From b12f342222cbf8e7f5e3651c6a52a2e1c7df18fc Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Sun, 10 Feb 2019 00:29:06 +0100
Subject: [PATCH 001/249] Merge pull request #5498 from
 storybooks/transpile-safe-eval

Transpile safe-eval package
---
 lib/core/src/server/common/babel-loader.js    | 22 +++++++++++++++++++
 .../server/manager/manager-webpack.config.js  |  4 ++--
 .../server/preview/iframe-webpack.config.js   |  3 ++-
 3 files changed, 26 insertions(+), 3 deletions(-)

diff --git a/lib/core/src/server/common/babel-loader.js b/lib/core/src/server/common/babel-loader.js
index 3b762f613f0..75b9cf53e10 100644
--- a/lib/core/src/server/common/babel-loader.js
+++ b/lib/core/src/server/common/babel-loader.js
@@ -11,3 +11,25 @@ export default options => ({
   include: includePaths,
   exclude: excludePaths,
 });
+
+export const nodeModulesBabelLoader = {
+  test: /\.js$/,
+  include: /\/node_modules\/safe-eval\//,
+  use: [
+    {
+      loader: 'babel-loader',
+      options: {
+        cacheDirectory: true,
+        babelrc: false,
+        presets: [
+          [
+            'env',
+            {
+              modules: 'commonjs',
+            },
+          ],
+        ],
+      },
+    },
+  ],
+};
diff --git a/lib/core/src/server/manager/manager-webpack.config.js b/lib/core/src/server/manager/manager-webpack.config.js
index 061cb450c44..6e8a04e992a 100644
--- a/lib/core/src/server/manager/manager-webpack.config.js
+++ b/lib/core/src/server/manager/manager-webpack.config.js
@@ -10,7 +10,7 @@ import findCacheDir from 'find-cache-dir';
 import { version } from '../../../package.json';
 import { getManagerHeadHtml } from '../utils/template';
 import { loadEnv } from '../config/utils';
-import babelLoader from '../common/babel-loader';
+import babelLoader, { nodeModulesBabelLoader } from '../common/babel-loader';
 
 const coreDirName = path.dirname(require.resolve('@storybook/core/package.json'));
 const context = path.join(coreDirName, '../../node_modules');
@@ -59,7 +59,7 @@ export default ({ configDir, configType, entries, dll, outputDir, cache, babelOp
       new Dotenv({ silent: true }),
     ].filter(Boolean),
     module: {
-      rules: [babelLoader(babelOptions)],
+      rules: [babelLoader(babelOptions), nodeModulesBabelLoader],
     },
     resolve: {
       extensions: ['.mjs', '.js', '.jsx', '.json'],
diff --git a/lib/core/src/server/preview/iframe-webpack.config.js b/lib/core/src/server/preview/iframe-webpack.config.js
index 42e1abd7727..5c1c4815e29 100644
--- a/lib/core/src/server/preview/iframe-webpack.config.js
+++ b/lib/core/src/server/preview/iframe-webpack.config.js
@@ -7,7 +7,7 @@ import WatchMissingNodeModulesPlugin from 'react-dev-utils/WatchMissingNodeModul
 import TerserWebpackPlugin from 'terser-webpack-plugin';
 import resolveFrom from 'resolve-from';
 
-import babelLoader from '../common/babel-loader';
+import babelLoader, { nodeModulesBabelLoader } from '../common/babel-loader';
 import { nodeModulesPaths, loadEnv } from '../config/utils';
 import { getPreviewHeadHtml, getPreviewBodyHtml } from '../utils/template';
 
@@ -68,6 +68,7 @@ export default ({
     module: {
       rules: [
         babelLoader(babelOptions),
+        nodeModulesBabelLoader,
         {
           test: /\.md$/,
           use: [

From 5e96b69f2faedc05939b88fa06aa924ec8ea4172 Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Tue, 12 Feb 2019 00:34:14 +0100
Subject: [PATCH 002/249] Merge pull request #5548 from
 pascalduez/hotfix/mangled-function-names

Fix: Don't mangle function names for production builds
---
 lib/core/src/server/preview/iframe-webpack.config.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/lib/core/src/server/preview/iframe-webpack.config.js b/lib/core/src/server/preview/iframe-webpack.config.js
index 5c1c4815e29..01187bdc548 100644
--- a/lib/core/src/server/preview/iframe-webpack.config.js
+++ b/lib/core/src/server/preview/iframe-webpack.config.js
@@ -100,6 +100,7 @@ export default ({
           sourceMap: true,
           terserOptions: {
             mangle: false,
+            keep_fnames: true,
           },
         }),
       ],

From fc83edf29e0ae2c7d3d32f68f32c50ac26281b2e Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Thu, 14 Feb 2019 15:48:19 +0100
Subject: [PATCH 003/249] Merge pull request #5550 from
 storybooks/fix/clear-of-search

FIX the input not sending a onChange to the list when form is cleared
---
 lib/ui/src/components/sidebar/SidebarSearch.js     | 10 ++++++----
 lib/ui/src/components/sidebar/treeview/treeview.js |  4 ++--
 2 files changed, 8 insertions(+), 6 deletions(-)

diff --git a/lib/ui/src/components/sidebar/SidebarSearch.js b/lib/ui/src/components/sidebar/SidebarSearch.js
index d55069863b0..e50275d05ee 100644
--- a/lib/ui/src/components/sidebar/SidebarSearch.js
+++ b/lib/ui/src/components/sidebar/SidebarSearch.js
@@ -98,7 +98,7 @@ const FilterForm = styled.form(({ theme, focussed }) => ({
   },
 }));
 
-export const PureSidebarSearch = ({ focussed, onSetFocussed, className, ...props }) => (
+export const PureSidebarSearch = ({ focussed, onSetFocussed, className, onChange, ...props }) => (
   <FilterForm autoComplete="off" focussed={focussed} className={className}>
     <FilterField
       type="text"
@@ -106,20 +106,22 @@ export const PureSidebarSearch = ({ focussed, onSetFocussed, className, ...props
       id="storybook-explorer-searchfield"
       onFocus={() => onSetFocussed(true)}
       onBlur={() => onSetFocussed(false)}
+      onChange={e => onChange(e.target.value)}
       {...props}
       placeholder={focussed ? 'Type to search...' : 'Press "/" to search...'}
     />
     <Icons icon="search" />
-    <CancelButton type="reset" value="reset">
+    <CancelButton type="reset" value="reset" onClick={() => onChange('')}>
       <Icons icon="closeAlt" />
     </CancelButton>
   </FilterForm>
 );
 
 PureSidebarSearch.propTypes = {
-  focussed: PropTypes.bool.isRequired,
-  onSetFocussed: PropTypes.func.isRequired,
   className: PropTypes.string,
+  focussed: PropTypes.bool.isRequired,
+  onChange: PropTypes.func.isRequired,
+  onSetFocussed: PropTypes.func.isRequired,
 };
 
 PureSidebarSearch.defaultProps = {
diff --git a/lib/ui/src/components/sidebar/treeview/treeview.js b/lib/ui/src/components/sidebar/treeview/treeview.js
index 2f2ee907f90..670933dbb7e 100644
--- a/lib/ui/src/components/sidebar/treeview/treeview.js
+++ b/lib/ui/src/components/sidebar/treeview/treeview.js
@@ -252,8 +252,8 @@ class TreeState extends PureComponent {
       }
     },
 
-    onFilter: e => {
-      const filter = e.target.value.length >= 2 ? e.target.value : '';
+    onFilter: value => {
+      const filter = value.length >= 2 ? value : '';
       this.setState({ filter });
     },
   };

From 65f6dc11b4cf3de96294cd088c1d4c8499ebed00 Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Thu, 14 Feb 2019 15:58:27 +0100
Subject: [PATCH 004/249] Merge pull request #5585 from
 storybooks/fix/add-background-official

ADD default backgrounds to official example
---
 examples/official-storybook/config.js         |   5 +
 .../__snapshots__/storyshots.test.js.snap     |  15 +++
 lib/theming/src/global.ts                     |   4 +-
 .../__snapshots__/panel.stories.storyshot     | 116 ++++++++----------
 lib/ui/src/components/panel/panel.stories.js  |  13 --
 5 files changed, 76 insertions(+), 77 deletions(-)

diff --git a/examples/official-storybook/config.js b/examples/official-storybook/config.js
index 7073bd182b4..be51e97003b 100644
--- a/examples/official-storybook/config.js
+++ b/examples/official-storybook/config.js
@@ -52,6 +52,11 @@ addParameters({
     ...INITIAL_VIEWPORTS,
     ...extraViewports,
   },
+  backgrounds: [
+    { name: 'storybook app', value: themes.normal.background.app, default: true },
+    { name: 'light', value: '#eeeeee' },
+    { name: 'dark', value: '#222222' },
+  ],
 });
 
 let previousExports = {};
diff --git a/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap b/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
index fec9dca349e..40b864302a7 100644
--- a/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
+++ b/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
@@ -2036,6 +2036,21 @@ exports[`Storyshots Core|Parameters passed to story 1`] = `
       "type": "tablet"
     }
   },
+  "backgrounds": [
+    {
+      "name": "storybook app",
+      "value": "#F6F9FC",
+      "default": true
+    },
+    {
+      "name": "light",
+      "value": "#eeeeee"
+    },
+    {
+      "name": "dark",
+      "value": "#222222"
+    }
+  ],
   "globalParameter": "globalParameter",
   "chapterParameter": "chapterParameter",
   "storyParameter": "storyParameter",
diff --git a/lib/theming/src/global.ts b/lib/theming/src/global.ts
index 2b813362542..bcc4d122ed8 100644
--- a/lib/theming/src/global.ts
+++ b/lib/theming/src/global.ts
@@ -14,8 +14,6 @@ export const createReset = memoize(1)(
       fontFamily: typography.fonts.base,
       fontSize: typography.size.s3,
       margin: 0,
-      overflowY: 'auto',
-      overflowX: 'hidden',
 
       WebkitFontSmoothing: 'antialiased',
       MozOsxFontSmoothing: 'grayscale',
@@ -97,6 +95,8 @@ export const createGlobal = memoize(1)(
         ...resetStyles.body,
         color: color.defaultText,
         background: background.app,
+        overflowY: 'auto',
+        overflowX: 'hidden',
       },
 
       hr: {
diff --git a/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot b/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot
index dc251719f88..9c9f84cf70c 100644
--- a/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot
+++ b/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot
@@ -208,79 +208,75 @@ exports[`Storyshots UI|Panel default 1`] = `
 }
 
 <div
-  style="position:relative;width:800px;height:300px;margin:1rem auto;background:white"
+  class="emotion-13"
+  id="storybook-panel-root"
 >
   <div
-    class="emotion-13"
-    id="storybook-panel-root"
+    class="emotion-11"
   >
     <div
-      class="emotion-11"
+      class="emotion-3"
     >
       <div
-        class="emotion-3"
-      >
-        <div
-          class="emotion-2"
-          role="tablist"
-        >
-          <button
-            class="emotion-0"
-            role="tab"
-            type="button"
-          >
-            Test 1
-          </button>
-          <button
-            class="emotion-1"
-            role="tab"
-            type="button"
-          >
-            Test 2
-          </button>
-        </div>
-      </div>
-      <div
-        class="emotion-10"
+        class="emotion-2"
+        role="tablist"
       >
         <button
-          class="emotion-6"
-          title="Change orientation"
+          class="emotion-0"
+          role="tab"
+          type="button"
         >
-          <svg
-            class="emotion-5"
-            viewBox="0 0 1024 1024"
-          >
-            <path
-              class="emotion-4"
-              d="M64 167.944v688c0 22.092 17.908 40 40 40h816c22.092 0 40-17.908 40-40v-688c0-22.092-17.908-40-40-40h-816c-22.092 0-40 17.908-40 40zM880 815.944h-240v-608h240v608zM144 207.944h416v608h-416v-608zM793.296 320.118h-66.398c-17.676 0-32-14.324-32-32 0-17.674 14.328-32 32-32h66.396c17.674 0 32.002 14.326 32.002 32 0 17.672-14.324 32-32 32zM793.296 448.118h-66.398c-17.676 0-32-14.324-32-32 0-17.674 14.328-32 32-32h66.396c17.674 0 32.002 14.326 32.002 32 0 17.672-14.324 32-32 32zM793.296 576.118h-66.398c-17.676 0-32-14.324-32-32 0-17.674 14.328-32 32-32h66.396c17.674 0 32.002 14.326 32.002 32 0 17.672-14.324 32-32 32z"
-            />
-          </svg>
+          Test 1
         </button>
         <button
-          class="emotion-6"
-          title="Hide addons"
+          class="emotion-1"
+          role="tab"
+          type="button"
         >
-          <svg
-            class="emotion-5"
-            viewBox="0 0 1024 1024"
-          >
-            <path
-              class="emotion-4"
-              d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
-            />
-          </svg>
+          Test 2
         </button>
       </div>
     </div>
     <div
-      class="emotion-12"
+      class="emotion-10"
     >
-      <div
-        id="test2"
+      <button
+        class="emotion-6"
+        title="Change orientation"
       >
-        TEST 2
-      </div>
+        <svg
+          class="emotion-5"
+          viewBox="0 0 1024 1024"
+        >
+          <path
+            class="emotion-4"
+            d="M64 167.944v688c0 22.092 17.908 40 40 40h816c22.092 0 40-17.908 40-40v-688c0-22.092-17.908-40-40-40h-816c-22.092 0-40 17.908-40 40zM880 815.944h-240v-608h240v608zM144 207.944h416v608h-416v-608zM793.296 320.118h-66.398c-17.676 0-32-14.324-32-32 0-17.674 14.328-32 32-32h66.396c17.674 0 32.002 14.326 32.002 32 0 17.672-14.324 32-32 32zM793.296 448.118h-66.398c-17.676 0-32-14.324-32-32 0-17.674 14.328-32 32-32h66.396c17.674 0 32.002 14.326 32.002 32 0 17.672-14.324 32-32 32zM793.296 576.118h-66.398c-17.676 0-32-14.324-32-32 0-17.674 14.328-32 32-32h66.396c17.674 0 32.002 14.326 32.002 32 0 17.672-14.324 32-32 32z"
+          />
+        </svg>
+      </button>
+      <button
+        class="emotion-6"
+        title="Hide addons"
+      >
+        <svg
+          class="emotion-5"
+          viewBox="0 0 1024 1024"
+        >
+          <path
+            class="emotion-4"
+            d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
+          />
+        </svg>
+      </button>
+    </div>
+  </div>
+  <div
+    class="emotion-12"
+  >
+    <div
+      id="test2"
+    >
+      TEST 2
     </div>
   </div>
 </div>
@@ -299,16 +295,12 @@ exports[`Storyshots UI|Panel no panels 1`] = `
 }
 
 <div
-  style="position:relative;width:800px;height:300px;margin:1rem auto;background:white"
+  class="emotion-1"
 >
   <div
-    class="emotion-1"
+    class="emotion-0"
   >
-    <div
-      class="emotion-0"
-    >
-      Nothing found
-    </div>
+    Nothing found
   </div>
 </div>
 `;
diff --git a/lib/ui/src/components/panel/panel.stories.js b/lib/ui/src/components/panel/panel.stories.js
index 85e1635000a..b271c1289b1 100644
--- a/lib/ui/src/components/panel/panel.stories.js
+++ b/lib/ui/src/components/panel/panel.stories.js
@@ -32,19 +32,6 @@ const toggleVisibility = action('toggleVisibility');
 const togglePosition = action('togglePosition');
 
 storiesOf('UI|Panel', module)
-  .addDecorator(storyFn => (
-    <div
-      style={{
-        position: 'relative',
-        width: '800px',
-        height: '300px',
-        margin: '1rem auto',
-        background: 'white',
-      }}
-    >
-      {storyFn()}
-    </div>
-  ))
   .add('default', () => (
     <Panel
       panels={panels}

From db5a70036850a88bdfcde217f8a63e89432a9e66 Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Fri, 15 Feb 2019 11:56:15 +0800
Subject: [PATCH 005/249] Merge pull request #5599 from storybooks/fix-ie-11

Fix ie 11
---
 lib/ui/src/components/layout/layout.stories.js | 2 --
 lib/ui/src/components/layout/mobile.js         | 4 +---
 2 files changed, 1 insertion(+), 5 deletions(-)

diff --git a/lib/ui/src/components/layout/layout.stories.js b/lib/ui/src/components/layout/layout.stories.js
index 8cdf3f90754..4d36bf13da7 100644
--- a/lib/ui/src/components/layout/layout.stories.js
+++ b/lib/ui/src/components/layout/layout.stories.js
@@ -111,7 +111,6 @@ const mockProps = {
   Panel: MockPanel,
   pages: [],
   options: { isFullscreen: false, showNav: true, showPanel: true, panelPosition: 'right' },
-  location: new URL('http://localhost:9011/?path=/components/UI-DesktopLayout-noNav'),
   path: '/story/UI-DesktopLayout-noNav',
   viewMode: 'story',
   storyId: 'UI-DesktopLayout-noNav',
@@ -129,7 +128,6 @@ const realProps = {
   ),
   pages: [],
   options: { isFullscreen: false, showNav: true, showPanel: true, panelPosition: 'right' },
-  location: new URL('http://localhost:9011/?path=/components/UI-DesktopLayout-noNav'),
   path: '/story/UI-DesktopLayout-noNav',
   viewMode: 'story',
   storyId: 'UI-DesktopLayout-noNav',
diff --git a/lib/ui/src/components/layout/mobile.js b/lib/ui/src/components/layout/mobile.js
index 098bdf2cc22..f5381f2177e 100644
--- a/lib/ui/src/components/layout/mobile.js
+++ b/lib/ui/src/components/layout/mobile.js
@@ -118,7 +118,7 @@ class Mobile extends Component {
   }
 
   render() {
-    const { Nav, Preview, Panel, pages, viewMode, location, storyId, options, path } = this.props;
+    const { Nav, Preview, Panel, pages, viewMode, storyId, options, path } = this.props;
     const { active } = this.state;
 
     return (
@@ -132,7 +132,6 @@ class Mobile extends Component {
                 id="main"
                 path={path}
                 storyId={storyId}
-                location={location}
                 viewMode={viewMode}
                 debug={options}
               />
@@ -177,7 +176,6 @@ Mobile.propTypes = {
   viewMode: PropTypes.oneOf(['story', 'info']),
   storyId: PropTypes.string.isRequired,
   path: PropTypes.string.isRequired,
-  location: PropTypes.shape({}).isRequired,
   options: PropTypes.shape({
     initialActive: PropTypes.number,
   }).isRequired,

From 883365b482f1bbd938c23e8777467c61eef38825 Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Fri, 15 Feb 2019 12:02:01 +0800
Subject: [PATCH 006/249] Merge pull request #5601 from
 storybooks/tech/warning-fixes

Tech/warning fixes
---
 lib/components/src/tooltip/TooltipLinkList.js | 2 +-
 lib/ui/src/app.js                             | 5 ++++-
 2 files changed, 5 insertions(+), 2 deletions(-)

diff --git a/lib/components/src/tooltip/TooltipLinkList.js b/lib/components/src/tooltip/TooltipLinkList.js
index e5a4bdc9578..a181b59adc5 100644
--- a/lib/components/src/tooltip/TooltipLinkList.js
+++ b/lib/components/src/tooltip/TooltipLinkList.js
@@ -33,7 +33,7 @@ TooltipLinkList.propTypes = {
       active: PropTypes.bool,
     }).isRequired
   ).isRequired,
-  LinkWrapper: PropTypes.shape(),
+  LinkWrapper: PropTypes.oneOfType([PropTypes.shape({}), PropTypes.func]),
 };
 
 TooltipLinkList.defaultProps = {
diff --git a/lib/ui/src/app.js b/lib/ui/src/app.js
index b65b25a770c..05cdfa87b0f 100644
--- a/lib/ui/src/app.js
+++ b/lib/ui/src/app.js
@@ -53,9 +53,12 @@ const App = React.memo(({ viewMode, layout }) => {
   );
 });
 App.propTypes = {
-  viewMode: PropTypes.string.isRequired,
+  viewMode: PropTypes.oneOf(['story', 'info']),
   layout: PropTypes.shape({}).isRequired,
 };
+App.defaultProps = {
+  viewMode: undefined,
+};
 
 App.displayName = 'App';
 

From a06fcb5e0fcc7c85a0a2e7d812a76bb5d20b6aab Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Fri, 15 Feb 2019 14:11:49 +0800
Subject: [PATCH 007/249] Merge pull request #5603 from
 storybooks/5544-fix-mobile-layout

FIX mobile view
---
 lib/ui/src/app.js                             |   2 +-
 .../__snapshots__/layout.stories.storyshot    | 220 ++++++++----------
 lib/ui/src/components/layout/mobile.js        |   8 +-
 3 files changed, 101 insertions(+), 129 deletions(-)

diff --git a/lib/ui/src/app.js b/lib/ui/src/app.js
index 05cdfa87b0f..65f1201b0dd 100644
--- a/lib/ui/src/app.js
+++ b/lib/ui/src/app.js
@@ -44,7 +44,7 @@ const App = React.memo(({ viewMode, layout }) => {
             return <div />;
           }
           if (width < 600) {
-            return <Mobile {...props} viewMode={viewMode} />;
+            return <Mobile {...props} viewMode={viewMode} options={layout} />;
           }
           return <Desktop {...props} viewMode={viewMode} options={layout} />;
         }}
diff --git a/lib/ui/src/components/layout/__snapshots__/layout.stories.storyshot b/lib/ui/src/components/layout/__snapshots__/layout.stories.storyshot
index f0b2d7b04b9..84434154b8e 100644
--- a/lib/ui/src/components/layout/__snapshots__/layout.stories.storyshot
+++ b/lib/ui/src/components/layout/__snapshots__/layout.stories.storyshot
@@ -355,9 +355,6 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 0 1`] = `
   -ms-transform: translateX(-80vw);
   transform: translateX(-80vw);
   left: 0;
-  -webkit-transform: translateX(-0px);
-  -ms-transform: translateX(-0px);
-  transform: translateX(-0px);
 }
 
 .emotion-0 {
@@ -396,9 +393,6 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 0 1`] = `
   -ms-transform: translateX(0) scale(1);
   transform: translateX(0) scale(1);
   left: 0;
-  -webkit-transform: translateX(40vw) translateY(-42.5vh) translateY(40px) scale(0.2);
-  -ms-transform: translateX(40vw) translateY(-42.5vh) translateY(40px) scale(0.2);
-  transform: translateX(40vw) translateY(-42.5vh) translateY(40px) scale(0.2);
 }
 
 .emotion-2 {
@@ -521,9 +515,6 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 0 1`] = `
             <pre>
               {
   "id": "main",
-  "path": "/story/UI-DesktopLayout-noNav",
-  "storyId": "UI-DesktopLayout-noNav",
-  "location": "http://localhost:9011/?path=/components/UI-DesktopLayout-noNav",
   "viewMode": "story",
   "debug": {
     "initialActive": 0
@@ -641,6 +632,20 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 1 1`] = `
   height: calc(100% - 40px);
 }
 
+.emotion-1 {
+  -webkit-transition: -webkit-transform .2s ease;
+  -webkit-transition: transform .2s ease;
+  transition: transform .2s ease;
+  position: absolute;
+  top: 0;
+  height: 100%;
+  width: 80vw;
+  -webkit-transform: translateX(-80vw);
+  -ms-transform: translateX(-80vw);
+  transform: translateX(-80vw);
+  left: 0;
+}
+
 .emotion-0 {
   background: hotpink;
   position: absolute;
@@ -665,6 +670,20 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 1 1`] = `
   overflow: hidden;
 }
 
+.emotion-3 {
+  -webkit-transition: -webkit-transform .2s ease;
+  -webkit-transition: transform .2s ease;
+  transition: transform .2s ease;
+  position: absolute;
+  top: 0;
+  height: 100%;
+  width: 100%;
+  -webkit-transform: translateX(0) scale(1);
+  -ms-transform: translateX(0) scale(1);
+  transform: translateX(0) scale(1);
+  left: 0;
+}
+
 .emotion-2 {
   background: deepskyblue;
   position: absolute;
@@ -745,34 +764,6 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 1 1`] = `
   flex: 1;
 }
 
-.emotion-1 {
-  -webkit-transition: -webkit-transform .2s ease;
-  -webkit-transition: transform .2s ease;
-  transition: transform .2s ease;
-  position: absolute;
-  top: 0;
-  height: 100%;
-  width: 80vw;
-  -webkit-transform: translateX(-80vw);
-  -ms-transform: translateX(-80vw);
-  transform: translateX(-80vw);
-  left: 0;
-}
-
-.emotion-3 {
-  -webkit-transition: -webkit-transform .2s ease;
-  -webkit-transition: transform .2s ease;
-  transition: transform .2s ease;
-  position: absolute;
-  top: 0;
-  height: 100%;
-  width: 100%;
-  -webkit-transform: translateX(0) scale(1);
-  -ms-transform: translateX(0) scale(1);
-  transform: translateX(0) scale(1);
-  left: 0;
-}
-
 <div
   class="emotion-11"
 >
@@ -813,9 +804,6 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 1 1`] = `
             <pre>
               {
   "id": "main",
-  "path": "/story/UI-DesktopLayout-noNav",
-  "storyId": "UI-DesktopLayout-noNav",
-  "location": "http://localhost:9011/?path=/components/UI-DesktopLayout-noNav",
   "viewMode": "story",
   "debug": {
     "initialActive": 1
@@ -933,6 +921,20 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 2 1`] = `
   height: calc(100% - 40px);
 }
 
+.emotion-1 {
+  -webkit-transition: -webkit-transform .2s ease;
+  -webkit-transition: transform .2s ease;
+  transition: transform .2s ease;
+  position: absolute;
+  top: 0;
+  height: 100%;
+  width: 80vw;
+  -webkit-transform: translateX(-80vw);
+  -ms-transform: translateX(-80vw);
+  transform: translateX(-80vw);
+  left: 0;
+}
+
 .emotion-0 {
   background: hotpink;
   position: absolute;
@@ -957,6 +959,20 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 2 1`] = `
   overflow: hidden;
 }
 
+.emotion-3 {
+  -webkit-transition: -webkit-transform .2s ease;
+  -webkit-transition: transform .2s ease;
+  transition: transform .2s ease;
+  position: absolute;
+  top: 0;
+  height: 100%;
+  width: 100%;
+  -webkit-transform: translateX(0) scale(1);
+  -ms-transform: translateX(0) scale(1);
+  transform: translateX(0) scale(1);
+  left: 0;
+}
+
 .emotion-2 {
   background: deepskyblue;
   position: absolute;
@@ -981,6 +997,20 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 2 1`] = `
   overflow: hidden;
 }
 
+.emotion-5 {
+  -webkit-transition: -webkit-transform .2s ease;
+  -webkit-transition: transform .2s ease;
+  transition: transform .2s ease;
+  position: absolute;
+  top: 0;
+  height: 100%;
+  width: 80vw;
+  -webkit-transform: translateX(80vw);
+  -ms-transform: translateX(80vw);
+  transform: translateX(80vw);
+  right: 0;
+}
+
 .emotion-4 {
   background: orangered;
   position: absolute;
@@ -1023,54 +1053,6 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 2 1`] = `
   flex: 1;
 }
 
-.emotion-1 {
-  -webkit-transition: -webkit-transform .2s ease;
-  -webkit-transition: transform .2s ease;
-  transition: transform .2s ease;
-  position: absolute;
-  top: 0;
-  height: 100%;
-  width: 80vw;
-  -webkit-transform: translateX(-80vw);
-  -ms-transform: translateX(-80vw);
-  transform: translateX(-80vw);
-  left: 0;
-}
-
-.emotion-3 {
-  -webkit-transition: -webkit-transform .2s ease;
-  -webkit-transition: transform .2s ease;
-  transition: transform .2s ease;
-  position: absolute;
-  top: 0;
-  height: 100%;
-  width: 100%;
-  -webkit-transform: translateX(0) scale(1);
-  -ms-transform: translateX(0) scale(1);
-  transform: translateX(0) scale(1);
-  left: 0;
-  -webkit-transform: translateX(-40vw) translateY(-42.5vh) translateY(40px) scale(0.2);
-  -ms-transform: translateX(-40vw) translateY(-42.5vh) translateY(40px) scale(0.2);
-  transform: translateX(-40vw) translateY(-42.5vh) translateY(40px) scale(0.2);
-}
-
-.emotion-5 {
-  -webkit-transition: -webkit-transform .2s ease;
-  -webkit-transition: transform .2s ease;
-  transition: transform .2s ease;
-  position: absolute;
-  top: 0;
-  height: 100%;
-  width: 80vw;
-  -webkit-transform: translateX(80vw);
-  -ms-transform: translateX(80vw);
-  transform: translateX(80vw);
-  right: 0;
-  -webkit-transform: translateX(0px);
-  -ms-transform: translateX(0px);
-  transform: translateX(0px);
-}
-
 <div
   class="emotion-11"
 >
@@ -1111,9 +1093,6 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 2 1`] = `
             <pre>
               {
   "id": "main",
-  "path": "/story/UI-DesktopLayout-noNav",
-  "storyId": "UI-DesktopLayout-noNav",
-  "location": "http://localhost:9011/?path=/components/UI-DesktopLayout-noNav",
   "viewMode": "story",
   "debug": {
     "initialActive": 2
@@ -1231,6 +1210,20 @@ exports[`Storyshots UI|Layout/Mobile (mocked) page 1`] = `
   height: calc(100% - 40px);
 }
 
+.emotion-1 {
+  -webkit-transition: -webkit-transform .2s ease;
+  -webkit-transition: transform .2s ease;
+  transition: transform .2s ease;
+  position: absolute;
+  top: 0;
+  height: 100%;
+  width: 80vw;
+  -webkit-transform: translateX(-80vw);
+  -ms-transform: translateX(-80vw);
+  transform: translateX(-80vw);
+  left: 0;
+}
+
 .emotion-0 {
   background: hotpink;
   position: absolute;
@@ -1255,6 +1248,20 @@ exports[`Storyshots UI|Layout/Mobile (mocked) page 1`] = `
   overflow: hidden;
 }
 
+.emotion-4 {
+  -webkit-transition: -webkit-transform .2s ease;
+  -webkit-transition: transform .2s ease;
+  transition: transform .2s ease;
+  position: absolute;
+  top: 0;
+  height: 100%;
+  width: 100%;
+  -webkit-transform: translateX(0) scale(1);
+  -ms-transform: translateX(0) scale(1);
+  transform: translateX(0) scale(1);
+  left: 0;
+}
+
 .emotion-2 {
   background: deepskyblue;
   position: absolute;
@@ -1335,34 +1342,6 @@ exports[`Storyshots UI|Layout/Mobile (mocked) page 1`] = `
   flex: 1;
 }
 
-.emotion-1 {
-  -webkit-transition: -webkit-transform .2s ease;
-  -webkit-transition: transform .2s ease;
-  transition: transform .2s ease;
-  position: absolute;
-  top: 0;
-  height: 100%;
-  width: 80vw;
-  -webkit-transform: translateX(-80vw);
-  -ms-transform: translateX(-80vw);
-  transform: translateX(-80vw);
-  left: 0;
-}
-
-.emotion-4 {
-  -webkit-transition: -webkit-transform .2s ease;
-  -webkit-transition: transform .2s ease;
-  transition: transform .2s ease;
-  position: absolute;
-  top: 0;
-  height: 100%;
-  width: 100%;
-  -webkit-transform: translateX(0) scale(1);
-  -ms-transform: translateX(0) scale(1);
-  transform: translateX(0) scale(1);
-  left: 0;
-}
-
 .emotion-3 {
   background: cyan;
   position: absolute;
@@ -1429,9 +1408,6 @@ exports[`Storyshots UI|Layout/Mobile (mocked) page 1`] = `
             <pre>
               {
   "id": "main",
-  "path": "/story/UI-DesktopLayout-noNav",
-  "storyId": "UI-DesktopLayout-noNav",
-  "location": "http://localhost:9011/?path=/components/UI-DesktopLayout-noNav",
   "debug": {
     "initialActive": 1
   }
diff --git a/lib/ui/src/components/layout/mobile.js b/lib/ui/src/components/layout/mobile.js
index f5381f2177e..597fa9482a9 100644
--- a/lib/ui/src/components/layout/mobile.js
+++ b/lib/ui/src/components/layout/mobile.js
@@ -113,12 +113,12 @@ class Mobile extends Component {
 
     const { options } = props;
     this.state = {
-      active: options.initialActive,
+      active: !!options.initialActive,
     };
   }
 
   render() {
-    const { Nav, Preview, Panel, pages, viewMode, storyId, options, path } = this.props;
+    const { Nav, Preview, Panel, pages, viewMode, options } = this.props;
     const { active } = this.state;
 
     return (
@@ -130,8 +130,6 @@ class Mobile extends Component {
               <Preview
                 isToolshown={options.isToolshown}
                 id="main"
-                path={path}
-                storyId={storyId}
                 viewMode={viewMode}
                 debug={options}
               />
@@ -174,8 +172,6 @@ Mobile.propTypes = {
     })
   ).isRequired,
   viewMode: PropTypes.oneOf(['story', 'info']),
-  storyId: PropTypes.string.isRequired,
-  path: PropTypes.string.isRequired,
   options: PropTypes.shape({
     initialActive: PropTypes.number,
   }).isRequired,

From 1525cde9c37f63d4538b4943b324bec9d922e712 Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Fri, 15 Feb 2019 00:27:13 +0100
Subject: [PATCH 008/249] Merge pull request #5573 from
 petersendidit/FixAbsoluteOutputPath

fix for when outputDir is an absolute path
---
 lib/core/src/server/build-static.js | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/lib/core/src/server/build-static.js b/lib/core/src/server/build-static.js
index 8847334e171..e9cfbc19066 100644
--- a/lib/core/src/server/build-static.js
+++ b/lib/core/src/server/build-static.js
@@ -166,7 +166,9 @@ export async function buildStaticStandalone(options) {
   const { staticDir, configDir, packageJson } = options;
 
   const configType = 'PRODUCTION';
-  const outputDir = path.join(process.cwd(), options.outputDir);
+  const outputDir = path.isAbsolute(options.outputDir)
+    ? options.outputDir
+    : path.join(process.cwd(), options.outputDir);
   const dllPath = path.join(__dirname, '../../dll/*');
   const defaultFavIcon = require.resolve('./public/favicon.ico');
 

From b939f6e3276997493b82467aa753329345881136 Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Thu, 14 Feb 2019 23:48:45 +0100
Subject: [PATCH 009/249] Merge pull request #5564 from
 redeyeapps/fix-config-precedence

Fix: Prioritise programatic configuration
---
 lib/core/src/server/build-dev.js    | 2 +-
 lib/core/src/server/build-static.js | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/lib/core/src/server/build-dev.js b/lib/core/src/server/build-dev.js
index b67ee9ce764..357cb7e4245 100644
--- a/lib/core/src/server/build-dev.js
+++ b/lib/core/src/server/build-dev.js
@@ -342,6 +342,6 @@ export async function buildDev({ packageJson, ...loadOptions }) {
     ...cliOptions,
     ...loadOptions,
     packageJson,
-    configDir: cliOptions.configDir || './.storybook',
+    configDir: loadOptions.configDir || cliOptions.configDir || './.storybook',
   });
 }
diff --git a/lib/core/src/server/build-static.js b/lib/core/src/server/build-static.js
index e9cfbc19066..cf4ecf8a09b 100644
--- a/lib/core/src/server/build-static.js
+++ b/lib/core/src/server/build-static.js
@@ -192,7 +192,7 @@ export function buildStatic({ packageJson, ...loadOptions }) {
     ...cliOptions,
     ...loadOptions,
     packageJson,
-    configDir: cliOptions.configDir || './.storybook',
-    outputDir: cliOptions.outputDir || './storybook-static',
+    configDir: loadOptions.configDir || cliOptions.configDir || './.storybook',
+    outputDir: loadOptions.outputDir || cliOptions.outputDir || './storybook-static',
   });
 }

From a68259bd398f6347207c823aa067c1ad7ebb3d18 Mon Sep 17 00:00:00 2001
From: "dependabot[bot]" <dependabot[bot]@users.noreply.github.com>
Date: Thu, 14 Feb 2019 16:28:28 +0000
Subject: [PATCH 010/249] Merge pull request #5576 from
 storybooks/dependabot/npm_and_yarn/handlebars-4.1.0

---
 yarn.lock | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/yarn.lock b/yarn.lock
index 675b6de2bca..ed8cf01e448 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -10122,8 +10122,9 @@ handle-thing@^2.0.0:
   resolved "https://registry.yarnpkg.com/handle-thing/-/handle-thing-2.0.0.tgz#0e039695ff50c93fc288557d696f3c1dc6776754"
 
 handlebars@^4.0.1, handlebars@^4.0.11, handlebars@^4.0.2, handlebars@^4.0.3, handlebars@^4.0.4:
-  version "4.0.12"
-  resolved "https://registry.yarnpkg.com/handlebars/-/handlebars-4.0.12.tgz#2c15c8a96d46da5e266700518ba8cb8d919d5bc5"
+  version "4.1.0"
+  resolved "https://registry.yarnpkg.com/handlebars/-/handlebars-4.1.0.tgz#0d6a6f34ff1f63cecec8423aa4169827bf787c3a"
+  integrity sha512-l2jRuU1NAWK6AW5qqcTATWQJvNPEwkM7NEKSiv/gqOsoSQbVoWyqVEY5GS+XPQ88zLNmqASRpzfdm8d79hJS+w==
   dependencies:
     async "^2.5.0"
     optimist "^0.6.1"

From 224afb2bf638e363e74f66110a284c1af6f7fe12 Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Fri, 15 Feb 2019 00:00:22 +0100
Subject: [PATCH 011/249] Merge pull request #5565 from
 redeyeapps/fix-port-suggestion-false-negative

Fix: Avoid false-negative checks for port
---
 lib/core/src/server/cli/dev.js | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/lib/core/src/server/cli/dev.js b/lib/core/src/server/cli/dev.js
index 04a589e07cd..9dab960414f 100644
--- a/lib/core/src/server/cli/dev.js
+++ b/lib/core/src/server/cli/dev.js
@@ -57,6 +57,10 @@ async function getCLI(packageJson) {
     configDir: 'SBCONFIG_CONFIG_DIR',
   });
 
+  if (typeof program.port === 'string' && program.port.length > 0) {
+    program.port = parseInt(program.port, 10);
+  }
+
   const port = await getFreePort(program.port);
 
   if (!program.ci && !program.smokeTest && program.port != null && port !== program.port) {

From 2d17667d6c411d1b835f956b9511dba709d01c2c Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Fri, 15 Feb 2019 15:06:47 +0800
Subject: [PATCH 012/249] 5.0.0-beta.4 changelog

---
 CHANGELOG.md | 14 ++++++++++++++
 1 file changed, 14 insertions(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index e3bdd43f58f..a4f5834cda9 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,17 @@
+## 5.0.0-beta.4 (February 15, 2019)
+
+### Bug Fixes
+
+* UI: Fix mobile view ([#5603](https://github.com/storybooks/storybook/pull/5603))
+* UI: Misc warning fixes ([#5601](https://github.com/storybooks/storybook/pull/5601))
+* UI: Fix ie 11 ([#5599](https://github.com/storybooks/storybook/pull/5599))
+* CLI: Fix for when outputDir is an absolute path ([#5573](https://github.com/storybooks/storybook/pull/5573))
+* CLI: Avoid false-negative checks for port ([#5565](https://github.com/storybooks/storybook/pull/5565))
+* Core: Prioritise programatic configuration ([#5564](https://github.com/storybooks/storybook/pull/5564))
+* UI: FIX clear search ([#5550](https://github.com/storybooks/storybook/pull/5550))
+* Core: Transpile safe-eval package ([#5498](https://github.com/storybooks/storybook/pull/5498))
+* UI: Add default backgrounds to official example ([#5585](https://github.com/storybooks/storybook/pull/5585))
+
 ## 5.0.0-beta.3 (February 13, 2019)
 
 ### Bug Fixes

From 9c28b665825bcda33285ad6627999d55c7527bea Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Fri, 15 Feb 2019 16:21:42 +0800
Subject: [PATCH 013/249] v5.0.0-beta.4

---
 addons/a11y/package.json                      | 12 ++---
 addons/actions/package.json                   | 10 ++--
 addons/backgrounds/package.json               | 12 ++---
 addons/centered/package.json                  |  2 +-
 addons/cssresources/package.json              | 10 ++--
 addons/events/package.json                    |  8 +--
 addons/google-analytics/package.json          |  6 +--
 addons/graphql/package.json                   |  2 +-
 addons/info/package.json                      | 10 ++--
 addons/jest/package.json                      | 10 ++--
 addons/knobs/package.json                     | 10 ++--
 addons/links/package.json                     |  6 +--
 addons/notes/package.json                     | 12 ++---
 addons/ondevice-backgrounds/package.json      |  4 +-
 addons/ondevice-knobs/package.json            |  4 +-
 addons/ondevice-notes/package.json            |  4 +-
 addons/options/package.json                   |  4 +-
 .../storyshots/storyshots-core/package.json   |  4 +-
 .../storyshots-puppeteer/package.json         |  6 +--
 addons/storysource/package.json               |  8 +--
 addons/viewport/package.json                  | 12 ++---
 app/angular/package.json                      |  6 +--
 app/ember/package.json                        |  4 +-
 app/html/package.json                         |  4 +-
 app/marko/package.json                        |  4 +-
 app/mithril/package.json                      |  4 +-
 app/polymer/package.json                      |  4 +-
 app/preact/package.json                       |  4 +-
 app/react-native/package.json                 | 14 ++---
 app/react/package.json                        |  8 +--
 app/riot/package.json                         |  4 +-
 app/svelte/package.json                       |  4 +-
 app/vue/package.json                          |  4 +-
 examples/angular-cli/package.json             | 26 ++++-----
 examples/cra-kitchen-sink/package.json        | 32 +++++------
 examples/cra-ts-kitchen-sink/package.json     | 12 ++---
 examples/ember-cli/package.json               | 26 ++++-----
 examples/html-kitchen-sink/package.json       | 36 ++++++-------
 examples/marko-cli/package.json               | 14 ++---
 examples/mithril-kitchen-sink/package.json    | 26 ++++-----
 examples/official-storybook/package.json      | 48 ++++++++---------
 examples/polymer-cli/package.json             | 20 +++----
 examples/preact-kitchen-sink/package.json     | 26 ++++-----
 examples/riot-kitchen-sink/package.json       | 26 ++++-----
 examples/svelte-kitchen-sink/package.json     | 26 ++++-----
 examples/vue-kitchen-sink/package.json        | 26 ++++-----
 lerna.json                                    |  2 +-
 lib/addons/package.json                       |  6 +--
 lib/channel-postmessage/package.json          |  4 +-
 lib/channel-websocket/package.json            |  4 +-
 lib/channels/package.json                     |  2 +-
 lib/cli/package.json                          | 54 +++++++++----------
 lib/client-api/package.json                   |  8 +--
 lib/client-logger/package.json                |  2 +-
 lib/codemod/package.json                      |  2 +-
 lib/components/package.json                   | 12 ++---
 lib/core-events/package.json                  |  2 +-
 lib/core/package.json                         | 18 +++----
 lib/node-logger/package.json                  |  2 +-
 lib/router/package.json                       |  4 +-
 lib/theming/package.json                      |  2 +-
 lib/ui/package.json                           | 14 ++---
 62 files changed, 351 insertions(+), 351 deletions(-)

diff --git a/addons/a11y/package.json b/addons/a11y/package.json
index 1c4ba3729b5..d55c7332cca 100644
--- a/addons/a11y/package.json
+++ b/addons/a11y/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-a11y",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "a11y addon for storybook",
   "keywords": [
     "a11y",
@@ -25,11 +25,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-beta.3",
-    "@storybook/client-logger": "5.0.0-beta.3",
-    "@storybook/components": "5.0.0-beta.3",
-    "@storybook/core-events": "5.0.0-beta.3",
-    "@storybook/theming": "5.0.0-beta.3",
+    "@storybook/addons": "5.0.0-beta.4",
+    "@storybook/client-logger": "5.0.0-beta.4",
+    "@storybook/components": "5.0.0-beta.4",
+    "@storybook/core-events": "5.0.0-beta.4",
+    "@storybook/theming": "5.0.0-beta.4",
     "axe-core": "^3.1.2",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
diff --git a/addons/actions/package.json b/addons/actions/package.json
index 6b63a947202..b3b7f565665 100644
--- a/addons/actions/package.json
+++ b/addons/actions/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-actions",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "Action Logger addon for storybook",
   "keywords": [
     "storybook"
@@ -20,10 +20,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-beta.3",
-    "@storybook/components": "5.0.0-beta.3",
-    "@storybook/core-events": "5.0.0-beta.3",
-    "@storybook/theming": "5.0.0-beta.3",
+    "@storybook/addons": "5.0.0-beta.4",
+    "@storybook/components": "5.0.0-beta.4",
+    "@storybook/core-events": "5.0.0-beta.4",
+    "@storybook/theming": "5.0.0-beta.4",
     "core-js": "^2.6.2",
     "fast-deep-equal": "^2.0.1",
     "global": "^4.3.2",
diff --git a/addons/backgrounds/package.json b/addons/backgrounds/package.json
index 331a9f65096..539ea4549a7 100644
--- a/addons/backgrounds/package.json
+++ b/addons/backgrounds/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-backgrounds",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "A storybook addon to show different backgrounds for your preview",
   "keywords": [
     "addon",
@@ -24,11 +24,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-beta.3",
-    "@storybook/client-logger": "5.0.0-beta.3",
-    "@storybook/components": "5.0.0-beta.3",
-    "@storybook/core-events": "5.0.0-beta.3",
-    "@storybook/theming": "5.0.0-beta.3",
+    "@storybook/addons": "5.0.0-beta.4",
+    "@storybook/client-logger": "5.0.0-beta.4",
+    "@storybook/components": "5.0.0-beta.4",
+    "@storybook/core-events": "5.0.0-beta.4",
+    "@storybook/theming": "5.0.0-beta.4",
     "core-js": "^2.6.2",
     "eventemitter3": "^3.1.0",
     "global": "^4.3.2",
diff --git a/addons/centered/package.json b/addons/centered/package.json
index 40b115cb24b..73336a6f20c 100644
--- a/addons/centered/package.json
+++ b/addons/centered/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-centered",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "Storybook decorator to center components",
   "keywords": [
     "addon",
diff --git a/addons/cssresources/package.json b/addons/cssresources/package.json
index 1e9875c9b1c..a55c5450d4e 100644
--- a/addons/cssresources/package.json
+++ b/addons/cssresources/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-cssresources",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "A storybook addon to switch between css resources at runtime for your story",
   "keywords": [
     "addon",
@@ -25,10 +25,10 @@
   },
   "dependencies": {
     "@emotion/styled": "10.0.6",
-    "@storybook/addons": "5.0.0-beta.3",
-    "@storybook/channels": "5.0.0-beta.3",
-    "@storybook/components": "5.0.0-beta.3",
-    "@storybook/core-events": "5.0.0-beta.3",
+    "@storybook/addons": "5.0.0-beta.4",
+    "@storybook/channels": "5.0.0-beta.4",
+    "@storybook/components": "5.0.0-beta.4",
+    "@storybook/core-events": "5.0.0-beta.4",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "prop-types": "^15.6.2",
diff --git a/addons/events/package.json b/addons/events/package.json
index 42c7201ef3b..e4d28cc4b80 100644
--- a/addons/events/package.json
+++ b/addons/events/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-events",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "Add events to your Storybook stories.",
   "keywords": [
     "addon",
@@ -23,9 +23,9 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-beta.3",
-    "@storybook/core-events": "5.0.0-beta.3",
-    "@storybook/theming": "5.0.0-beta.3",
+    "@storybook/addons": "5.0.0-beta.4",
+    "@storybook/core-events": "5.0.0-beta.4",
+    "@storybook/theming": "5.0.0-beta.4",
     "core-js": "^2.6.2",
     "format-json": "^1.0.3",
     "prop-types": "^15.6.2",
diff --git a/addons/google-analytics/package.json b/addons/google-analytics/package.json
index b5e5b91b066..6b2b8967120 100644
--- a/addons/google-analytics/package.json
+++ b/addons/google-analytics/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-google-analytics",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "Storybook addon for google analytics",
   "keywords": [
     "addon",
@@ -19,8 +19,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-beta.3",
-    "@storybook/core-events": "5.0.0-beta.3",
+    "@storybook/addons": "5.0.0-beta.4",
+    "@storybook/core-events": "5.0.0-beta.4",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "react-ga": "^2.5.3"
diff --git a/addons/graphql/package.json b/addons/graphql/package.json
index 10514734441..714de703e65 100644
--- a/addons/graphql/package.json
+++ b/addons/graphql/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-graphql",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "Storybook addon to display the GraphiQL IDE",
   "keywords": [
     "addon",
diff --git a/addons/info/package.json b/addons/info/package.json
index bb9e7162c8f..2e3fec65952 100644
--- a/addons/info/package.json
+++ b/addons/info/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-info",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "A Storybook addon to show additional information for your stories.",
   "keywords": [
     "addon",
@@ -21,10 +21,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-beta.3",
-    "@storybook/client-logger": "5.0.0-beta.3",
-    "@storybook/components": "5.0.0-beta.3",
-    "@storybook/theming": "5.0.0-beta.3",
+    "@storybook/addons": "5.0.0-beta.4",
+    "@storybook/client-logger": "5.0.0-beta.4",
+    "@storybook/components": "5.0.0-beta.4",
+    "@storybook/theming": "5.0.0-beta.4",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "marksy": "^6.1.0",
diff --git a/addons/jest/package.json b/addons/jest/package.json
index ab3042aeff7..94378639e6e 100644
--- a/addons/jest/package.json
+++ b/addons/jest/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-jest",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "React storybook addon that show component jest report",
   "keywords": [
     "addon",
@@ -27,10 +27,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-beta.3",
-    "@storybook/components": "5.0.0-beta.3",
-    "@storybook/core-events": "5.0.0-beta.3",
-    "@storybook/theming": "5.0.0-beta.3",
+    "@storybook/addons": "5.0.0-beta.4",
+    "@storybook/components": "5.0.0-beta.4",
+    "@storybook/core-events": "5.0.0-beta.4",
+    "@storybook/theming": "5.0.0-beta.4",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "prop-types": "^15.6.2",
diff --git a/addons/knobs/package.json b/addons/knobs/package.json
index 6746d6ef5e3..55d1de85d35 100644
--- a/addons/knobs/package.json
+++ b/addons/knobs/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-knobs",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "Storybook Addon Prop Editor Component",
   "keywords": [
     "addon",
@@ -21,10 +21,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-beta.3",
-    "@storybook/components": "5.0.0-beta.3",
-    "@storybook/core-events": "5.0.0-beta.3",
-    "@storybook/theming": "5.0.0-beta.3",
+    "@storybook/addons": "5.0.0-beta.4",
+    "@storybook/components": "5.0.0-beta.4",
+    "@storybook/core-events": "5.0.0-beta.4",
+    "@storybook/theming": "5.0.0-beta.4",
     "copy-to-clipboard": "^3.0.8",
     "core-js": "^2.6.2",
     "escape-html": "^1.0.3",
diff --git a/addons/links/package.json b/addons/links/package.json
index 715efec4637..0b00bae7d09 100644
--- a/addons/links/package.json
+++ b/addons/links/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-links",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "Story Links addon for storybook",
   "keywords": [
     "addon",
@@ -21,8 +21,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-beta.3",
-    "@storybook/core-events": "5.0.0-beta.3",
+    "@storybook/addons": "5.0.0-beta.4",
+    "@storybook/core-events": "5.0.0-beta.4",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/addons/notes/package.json b/addons/notes/package.json
index c9797f630cb..79efc547434 100644
--- a/addons/notes/package.json
+++ b/addons/notes/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-notes",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "Write notes for your Storybook stories.",
   "keywords": [
     "addon",
@@ -22,11 +22,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-beta.3",
-    "@storybook/client-logger": "5.0.0-beta.3",
-    "@storybook/components": "5.0.0-beta.3",
-    "@storybook/core-events": "5.0.0-beta.3",
-    "@storybook/theming": "5.0.0-beta.3",
+    "@storybook/addons": "5.0.0-beta.4",
+    "@storybook/client-logger": "5.0.0-beta.4",
+    "@storybook/components": "5.0.0-beta.4",
+    "@storybook/core-events": "5.0.0-beta.4",
+    "@storybook/theming": "5.0.0-beta.4",
     "markdown-to-jsx": "^6.9.1",
     "prop-types": "^15.6.2",
     "util-deprecate": "^1.0.2"
diff --git a/addons/ondevice-backgrounds/package.json b/addons/ondevice-backgrounds/package.json
index 7033d67118d..a72f069af23 100644
--- a/addons/ondevice-backgrounds/package.json
+++ b/addons/ondevice-backgrounds/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-ondevice-backgrounds",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "A storybook addon to show different backgrounds for your preview",
   "keywords": [
     "addon",
@@ -23,7 +23,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-beta.3",
+    "@storybook/addons": "5.0.0-beta.4",
     "core-js": "^2.6.2",
     "prop-types": "^15.6.2"
   },
diff --git a/addons/ondevice-knobs/package.json b/addons/ondevice-knobs/package.json
index a28174be130..7d4b7ab124f 100644
--- a/addons/ondevice-knobs/package.json
+++ b/addons/ondevice-knobs/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-ondevice-knobs",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "Display storybook story knobs on your deviced.",
   "keywords": [
     "addon",
@@ -20,7 +20,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-beta.3",
+    "@storybook/addons": "5.0.0-beta.4",
     "core-js": "^2.6.2",
     "deep-equal": "^1.0.1",
     "prop-types": "^15.6.2",
diff --git a/addons/ondevice-notes/package.json b/addons/ondevice-notes/package.json
index 69e10a16218..d053b2906a7 100644
--- a/addons/ondevice-notes/package.json
+++ b/addons/ondevice-notes/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-ondevice-notes",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "Write notes for your Storybook stories.",
   "keywords": [
     "addon",
@@ -18,7 +18,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-beta.3",
+    "@storybook/addons": "5.0.0-beta.4",
     "core-js": "^2.6.2",
     "prop-types": "^15.6.2",
     "react-native-simple-markdown": "^1.1.0"
diff --git a/addons/options/package.json b/addons/options/package.json
index 1d4ed8cdc3a..62ce0769d02 100644
--- a/addons/options/package.json
+++ b/addons/options/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-options",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "Options addon for storybook",
   "keywords": [
     "addon",
@@ -20,7 +20,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-beta.3",
+    "@storybook/addons": "5.0.0-beta.4",
     "core-js": "^2.6.2",
     "util-deprecate": "^1.0.2"
   },
diff --git a/addons/storyshots/storyshots-core/package.json b/addons/storyshots/storyshots-core/package.json
index d7cec0eed1b..4fac105b7f6 100644
--- a/addons/storyshots/storyshots-core/package.json
+++ b/addons/storyshots/storyshots-core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storyshots",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "StoryShots is a Jest Snapshot Testing Addon for Storybook.",
   "keywords": [
     "addon",
@@ -24,7 +24,7 @@
     "storybook": "start-storybook -p 6006"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-beta.3",
+    "@storybook/addons": "5.0.0-beta.4",
     "core-js": "^2.6.2",
     "glob": "^7.1.3",
     "global": "^4.3.2",
diff --git a/addons/storyshots/storyshots-puppeteer/package.json b/addons/storyshots/storyshots-puppeteer/package.json
index e6c0c0d624c..8851cb6753c 100644
--- a/addons/storyshots/storyshots-puppeteer/package.json
+++ b/addons/storyshots/storyshots-puppeteer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storyshots-puppeteer",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "Image snappshots addition to StoryShots base on puppeteer",
   "keywords": [
     "addon",
@@ -21,8 +21,8 @@
     "prepare": "node ../../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-beta.3",
-    "@storybook/node-logger": "5.0.0-beta.3",
+    "@storybook/core": "5.0.0-beta.4",
+    "@storybook/node-logger": "5.0.0-beta.4",
     "core-js": "^2.6.2",
     "jest-image-snapshot": "^2.6.0",
     "puppeteer": "^1.12.0",
diff --git a/addons/storysource/package.json b/addons/storysource/package.json
index c0ab6158977..bbfb4ba12e7 100644
--- a/addons/storysource/package.json
+++ b/addons/storysource/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storysource",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "Stories addon for storybook",
   "keywords": [
     "addon",
@@ -21,9 +21,9 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-beta.3",
-    "@storybook/components": "5.0.0-beta.3",
-    "@storybook/theming": "5.0.0-beta.3",
+    "@storybook/addons": "5.0.0-beta.4",
+    "@storybook/components": "5.0.0-beta.4",
+    "@storybook/theming": "5.0.0-beta.4",
     "core-js": "^2.6.2",
     "estraverse": "^4.2.0",
     "loader-utils": "^1.2.1",
diff --git a/addons/viewport/package.json b/addons/viewport/package.json
index 61ee57d2a08..45d1101a312 100644
--- a/addons/viewport/package.json
+++ b/addons/viewport/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-viewport",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "Storybook addon to change the viewport size to mobile",
   "keywords": [
     "addon",
@@ -20,11 +20,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-beta.3",
-    "@storybook/client-logger": "5.0.0-beta.3",
-    "@storybook/components": "5.0.0-beta.3",
-    "@storybook/core-events": "5.0.0-beta.3",
-    "@storybook/theming": "5.0.0-beta.3",
+    "@storybook/addons": "5.0.0-beta.4",
+    "@storybook/client-logger": "5.0.0-beta.4",
+    "@storybook/components": "5.0.0-beta.4",
+    "@storybook/core-events": "5.0.0-beta.4",
+    "@storybook/theming": "5.0.0-beta.4",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
diff --git a/app/angular/package.json b/app/angular/package.json
index d2828ff343a..c27e3529e53 100644
--- a/app/angular/package.json
+++ b/app/angular/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/angular",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "Storybook for Angular: Develop Angular Components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,8 +25,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-beta.3",
-    "@storybook/node-logger": "5.0.0-beta.3",
+    "@storybook/core": "5.0.0-beta.4",
+    "@storybook/node-logger": "5.0.0-beta.4",
     "angular2-template-loader": "^0.6.2",
     "core-js": "^2.6.2",
     "fork-ts-checker-webpack-plugin": "^0.5.2",
diff --git a/app/ember/package.json b/app/ember/package.json
index 2821195ab5c..6cccd99a7ae 100644
--- a/app/ember/package.json
+++ b/app/ember/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/ember",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "Storybook for Ember: Develop Ember Component in isolation with Hot Reloading.",
   "homepage": "https://github.com/storybooks/storybook/tree/master/app/ember",
   "bugs": {
@@ -23,7 +23,7 @@
   },
   "dependencies": {
     "@ember/test-helpers": "^1.3.1",
-    "@storybook/core": "5.0.0-beta.3",
+    "@storybook/core": "5.0.0-beta.4",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/html/package.json b/app/html/package.json
index 4913c7957dc..75847ac2e46 100644
--- a/app/html/package.json
+++ b/app/html/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/html",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "Storybook for HTML: View HTML snippets in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-beta.3",
+    "@storybook/core": "5.0.0-beta.4",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/marko/package.json b/app/marko/package.json
index aea2a9cea7a..16c680df696 100644
--- a/app/marko/package.json
+++ b/app/marko/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/marko",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "Storybook for Marko: Develop Marko Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-beta.3",
+    "@storybook/core": "5.0.0-beta.4",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/mithril/package.json b/app/mithril/package.json
index e5adf3c39c0..1f6ab7b7570 100644
--- a/app/mithril/package.json
+++ b/app/mithril/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/mithril",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "Storybook for Mithril: Develop Mithril Component in isolation.",
   "keywords": [
     "storybook"
@@ -26,7 +26,7 @@
   },
   "dependencies": {
     "@babel/plugin-transform-react-jsx": "^7.3.0",
-    "@storybook/core": "5.0.0-beta.3",
+    "@storybook/core": "5.0.0-beta.4",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/polymer/package.json b/app/polymer/package.json
index 82f533add0d..9e3746aea7c 100644
--- a/app/polymer/package.json
+++ b/app/polymer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/polymer",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "Storybook for Polymer: Develop Polymer components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-beta.3",
+    "@storybook/core": "5.0.0-beta.4",
     "@webcomponents/webcomponentsjs": "^1.2.0",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
diff --git a/app/preact/package.json b/app/preact/package.json
index 6b678189053..77db5bbc4c3 100644
--- a/app/preact/package.json
+++ b/app/preact/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/preact",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "Storybook for Preact: Develop Preact Component in isolation.",
   "keywords": [
     "storybook"
@@ -26,7 +26,7 @@
   },
   "dependencies": {
     "@babel/plugin-transform-react-jsx": "^7.3.0",
-    "@storybook/core": "5.0.0-beta.3",
+    "@storybook/core": "5.0.0-beta.4",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/react-native/package.json b/app/react-native/package.json
index 554f41cf6b1..5da9a7c22ae 100644
--- a/app/react-native/package.json
+++ b/app/react-native/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/react-native",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "A better way to develop React Native Components for your app",
   "keywords": [
     "react",
@@ -25,12 +25,12 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-beta.3",
-    "@storybook/channel-websocket": "5.0.0-beta.3",
-    "@storybook/channels": "5.0.0-beta.3",
-    "@storybook/core": "5.0.0-beta.3",
-    "@storybook/core-events": "5.0.0-beta.3",
-    "@storybook/ui": "5.0.0-beta.3",
+    "@storybook/addons": "5.0.0-beta.4",
+    "@storybook/channel-websocket": "5.0.0-beta.4",
+    "@storybook/channels": "5.0.0-beta.4",
+    "@storybook/core": "5.0.0-beta.4",
+    "@storybook/core-events": "5.0.0-beta.4",
+    "@storybook/ui": "5.0.0-beta.4",
     "babel-loader": "^8.0.4",
     "babel-plugin-macros": "^2.4.5",
     "babel-plugin-syntax-async-functions": "^6.13.0",
diff --git a/app/react/package.json b/app/react/package.json
index 51ddfbfc361..c5b6cd9fe7e 100644
--- a/app/react/package.json
+++ b/app/react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/react",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "Storybook for React: Develop React Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -28,9 +28,9 @@
     "@babel/plugin-transform-react-constant-elements": "^7.2.0",
     "@babel/preset-flow": "^7.0.0",
     "@babel/preset-react": "^7.0.0",
-    "@storybook/core": "5.0.0-beta.3",
-    "@storybook/node-logger": "5.0.0-beta.3",
-    "@storybook/theming": "5.0.0-beta.3",
+    "@storybook/core": "5.0.0-beta.4",
+    "@storybook/node-logger": "5.0.0-beta.4",
+    "@storybook/theming": "5.0.0-beta.4",
     "@svgr/webpack": "^4.0.3",
     "babel-plugin-named-asset-import": "^0.3.0",
     "babel-plugin-react-docgen": "^2.0.2",
diff --git a/app/riot/package.json b/app/riot/package.json
index 1af4b86d698..d5d2f41081b 100644
--- a/app/riot/package.json
+++ b/app/riot/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/riot",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "Storybook for riot.js: View riot snippets in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-beta.3",
+    "@storybook/core": "5.0.0-beta.4",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/svelte/package.json b/app/svelte/package.json
index e97bc721a2a..0f3ee3a62ae 100644
--- a/app/svelte/package.json
+++ b/app/svelte/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/svelte",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "Storybook for Svelte: Develop Svelte Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-beta.3",
+    "@storybook/core": "5.0.0-beta.4",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/vue/package.json b/app/vue/package.json
index 9a29f6a8865..d95318bc64b 100644
--- a/app/vue/package.json
+++ b/app/vue/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/vue",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "Storybook for Vue: Develop Vue Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-beta.3",
+    "@storybook/core": "5.0.0-beta.4",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/examples/angular-cli/package.json b/examples/angular-cli/package.json
index db910e90e72..b26cb3e0e1e 100644
--- a/examples/angular-cli/package.json
+++ b/examples/angular-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "angular-cli",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "private": true,
   "license": "MIT",
   "scripts": {
@@ -33,18 +33,18 @@
     "@angular-devkit/build-angular": "^0.11.4",
     "@angular/cli": "^7.3.0",
     "@angular/compiler-cli": "^7.2.1",
-    "@storybook/addon-actions": "5.0.0-beta.3",
-    "@storybook/addon-backgrounds": "5.0.0-beta.3",
-    "@storybook/addon-centered": "5.0.0-beta.3",
-    "@storybook/addon-jest": "5.0.0-beta.3",
-    "@storybook/addon-knobs": "5.0.0-beta.3",
-    "@storybook/addon-links": "5.0.0-beta.3",
-    "@storybook/addon-notes": "5.0.0-beta.3",
-    "@storybook/addon-options": "5.0.0-beta.3",
-    "@storybook/addon-storyshots": "5.0.0-beta.3",
-    "@storybook/addon-storysource": "5.0.0-beta.3",
-    "@storybook/addons": "5.0.0-beta.3",
-    "@storybook/angular": "5.0.0-beta.3",
+    "@storybook/addon-actions": "5.0.0-beta.4",
+    "@storybook/addon-backgrounds": "5.0.0-beta.4",
+    "@storybook/addon-centered": "5.0.0-beta.4",
+    "@storybook/addon-jest": "5.0.0-beta.4",
+    "@storybook/addon-knobs": "5.0.0-beta.4",
+    "@storybook/addon-links": "5.0.0-beta.4",
+    "@storybook/addon-notes": "5.0.0-beta.4",
+    "@storybook/addon-options": "5.0.0-beta.4",
+    "@storybook/addon-storyshots": "5.0.0-beta.4",
+    "@storybook/addon-storysource": "5.0.0-beta.4",
+    "@storybook/addons": "5.0.0-beta.4",
+    "@storybook/angular": "5.0.0-beta.4",
     "@types/core-js": "^2.5.0",
     "@types/jest": "^23.3.13",
     "@types/node": "~10.12.19",
diff --git a/examples/cra-kitchen-sink/package.json b/examples/cra-kitchen-sink/package.json
index aa8cb89bbca..f36f510aa3e 100644
--- a/examples/cra-kitchen-sink/package.json
+++ b/examples/cra-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "cra-kitchen-sink",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "private": true,
   "scripts": {
     "build": "react-scripts build",
@@ -18,21 +18,21 @@
     "react-lifecycles-compat": "^3.0.4"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.0.0-beta.3",
-    "@storybook/addon-actions": "5.0.0-beta.3",
-    "@storybook/addon-backgrounds": "5.0.0-beta.3",
-    "@storybook/addon-centered": "5.0.0-beta.3",
-    "@storybook/addon-events": "5.0.0-beta.3",
-    "@storybook/addon-info": "5.0.0-beta.3",
-    "@storybook/addon-jest": "5.0.0-beta.3",
-    "@storybook/addon-knobs": "5.0.0-beta.3",
-    "@storybook/addon-links": "5.0.0-beta.3",
-    "@storybook/addon-notes": "5.0.0-beta.3",
-    "@storybook/addon-options": "5.0.0-beta.3",
-    "@storybook/addon-storyshots": "5.0.0-beta.3",
-    "@storybook/addons": "5.0.0-beta.3",
-    "@storybook/client-logger": "5.0.0-beta.3",
-    "@storybook/react": "5.0.0-beta.3",
+    "@storybook/addon-a11y": "5.0.0-beta.4",
+    "@storybook/addon-actions": "5.0.0-beta.4",
+    "@storybook/addon-backgrounds": "5.0.0-beta.4",
+    "@storybook/addon-centered": "5.0.0-beta.4",
+    "@storybook/addon-events": "5.0.0-beta.4",
+    "@storybook/addon-info": "5.0.0-beta.4",
+    "@storybook/addon-jest": "5.0.0-beta.4",
+    "@storybook/addon-knobs": "5.0.0-beta.4",
+    "@storybook/addon-links": "5.0.0-beta.4",
+    "@storybook/addon-notes": "5.0.0-beta.4",
+    "@storybook/addon-options": "5.0.0-beta.4",
+    "@storybook/addon-storyshots": "5.0.0-beta.4",
+    "@storybook/addons": "5.0.0-beta.4",
+    "@storybook/client-logger": "5.0.0-beta.4",
+    "@storybook/react": "5.0.0-beta.4",
     "enzyme": "^3.7.0",
     "enzyme-adapter-react-16": "^1.9.1",
     "enzyme-to-json": "^3.3.4",
diff --git a/examples/cra-ts-kitchen-sink/package.json b/examples/cra-ts-kitchen-sink/package.json
index c546c4cd8af..660abfd089a 100644
--- a/examples/cra-ts-kitchen-sink/package.json
+++ b/examples/cra-ts-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "cra-ts-kitchen-sink",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook -s public",
@@ -19,11 +19,11 @@
     "react-dom": "^16.8.1"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-beta.3",
-    "@storybook/addon-info": "5.0.0-beta.3",
-    "@storybook/addon-options": "5.0.0-beta.3",
-    "@storybook/addons": "5.0.0-beta.3",
-    "@storybook/react": "5.0.0-beta.3",
+    "@storybook/addon-actions": "5.0.0-beta.4",
+    "@storybook/addon-info": "5.0.0-beta.4",
+    "@storybook/addon-options": "5.0.0-beta.4",
+    "@storybook/addons": "5.0.0-beta.4",
+    "@storybook/react": "5.0.0-beta.4",
     "@types/enzyme": "^3.1.15",
     "@types/react": "^16.7.22",
     "@types/react-dom": "^16.0.11",
diff --git a/examples/ember-cli/package.json b/examples/ember-cli/package.json
index b90bf541697..db56dab3f9e 100644
--- a/examples/ember-cli/package.json
+++ b/examples/ember-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "ember-example",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "private": true,
   "scripts": {
     "build": "ember build",
@@ -14,18 +14,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.2.2",
-    "@storybook/addon-a11y": "5.0.0-beta.3",
-    "@storybook/addon-actions": "5.0.0-beta.3",
-    "@storybook/addon-backgrounds": "5.0.0-beta.3",
-    "@storybook/addon-centered": "5.0.0-beta.3",
-    "@storybook/addon-knobs": "5.0.0-beta.3",
-    "@storybook/addon-links": "5.0.0-beta.3",
-    "@storybook/addon-notes": "5.0.0-beta.3",
-    "@storybook/addon-options": "5.0.0-beta.3",
-    "@storybook/addon-storysource": "5.0.0-beta.3",
-    "@storybook/addon-viewport": "5.0.0-beta.3",
-    "@storybook/addons": "5.0.0-beta.3",
-    "@storybook/ember": "5.0.0-beta.3",
+    "@storybook/addon-a11y": "5.0.0-beta.4",
+    "@storybook/addon-actions": "5.0.0-beta.4",
+    "@storybook/addon-backgrounds": "5.0.0-beta.4",
+    "@storybook/addon-centered": "5.0.0-beta.4",
+    "@storybook/addon-knobs": "5.0.0-beta.4",
+    "@storybook/addon-links": "5.0.0-beta.4",
+    "@storybook/addon-notes": "5.0.0-beta.4",
+    "@storybook/addon-options": "5.0.0-beta.4",
+    "@storybook/addon-storysource": "5.0.0-beta.4",
+    "@storybook/addon-viewport": "5.0.0-beta.4",
+    "@storybook/addons": "5.0.0-beta.4",
+    "@storybook/ember": "5.0.0-beta.4",
     "babel-loader": "^8",
     "broccoli-asset-rev": "^3.0.0",
     "cross-env": "^5.2.0",
diff --git a/examples/html-kitchen-sink/package.json b/examples/html-kitchen-sink/package.json
index d7e8a95c4e8..3b821976971 100644
--- a/examples/html-kitchen-sink/package.json
+++ b/examples/html-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "html-kitchen-sink",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "private": true,
   "description": "",
   "keywords": [],
@@ -13,23 +13,23 @@
     "storybook": "start-storybook -p 9006"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.0.0-beta.3",
-    "@storybook/addon-actions": "5.0.0-beta.3",
-    "@storybook/addon-backgrounds": "5.0.0-beta.3",
-    "@storybook/addon-centered": "5.0.0-beta.3",
-    "@storybook/addon-events": "5.0.0-beta.3",
-    "@storybook/addon-jest": "5.0.0-beta.3",
-    "@storybook/addon-knobs": "5.0.0-beta.3",
-    "@storybook/addon-links": "5.0.0-beta.3",
-    "@storybook/addon-notes": "5.0.0-beta.3",
-    "@storybook/addon-options": "5.0.0-beta.3",
-    "@storybook/addon-storyshots": "5.0.0-beta.3",
-    "@storybook/addon-storysource": "5.0.0-beta.3",
-    "@storybook/addon-viewport": "5.0.0-beta.3",
-    "@storybook/addons": "5.0.0-beta.3",
-    "@storybook/core": "5.0.0-beta.3",
-    "@storybook/core-events": "5.0.0-beta.3",
-    "@storybook/html": "5.0.0-beta.3",
+    "@storybook/addon-a11y": "5.0.0-beta.4",
+    "@storybook/addon-actions": "5.0.0-beta.4",
+    "@storybook/addon-backgrounds": "5.0.0-beta.4",
+    "@storybook/addon-centered": "5.0.0-beta.4",
+    "@storybook/addon-events": "5.0.0-beta.4",
+    "@storybook/addon-jest": "5.0.0-beta.4",
+    "@storybook/addon-knobs": "5.0.0-beta.4",
+    "@storybook/addon-links": "5.0.0-beta.4",
+    "@storybook/addon-notes": "5.0.0-beta.4",
+    "@storybook/addon-options": "5.0.0-beta.4",
+    "@storybook/addon-storyshots": "5.0.0-beta.4",
+    "@storybook/addon-storysource": "5.0.0-beta.4",
+    "@storybook/addon-viewport": "5.0.0-beta.4",
+    "@storybook/addons": "5.0.0-beta.4",
+    "@storybook/core": "5.0.0-beta.4",
+    "@storybook/core-events": "5.0.0-beta.4",
+    "@storybook/html": "5.0.0-beta.4",
     "eventemitter3": "^3.1.0",
     "format-json": "^1.0.3",
     "global": "^4.3.2",
diff --git a/examples/marko-cli/package.json b/examples/marko-cli/package.json
index b2a52ffa2f5..75e6ea952e9 100644
--- a/examples/marko-cli/package.json
+++ b/examples/marko-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "marko-cli",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "private": true,
   "description": "Demo of how to build an app using marko-starter",
   "repository": {
@@ -22,12 +22,12 @@
     "marko-starter": "^2.0.4"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-beta.3",
-    "@storybook/addon-knobs": "5.0.0-beta.3",
-    "@storybook/addon-options": "5.0.0-beta.3",
-    "@storybook/addon-storysource": "5.0.0-beta.3",
-    "@storybook/addons": "5.0.0-beta.3",
-    "@storybook/marko": "5.0.0-beta.3",
+    "@storybook/addon-actions": "5.0.0-beta.4",
+    "@storybook/addon-knobs": "5.0.0-beta.4",
+    "@storybook/addon-options": "5.0.0-beta.4",
+    "@storybook/addon-storysource": "5.0.0-beta.4",
+    "@storybook/addons": "5.0.0-beta.4",
+    "@storybook/marko": "5.0.0-beta.4",
     "prettier": "^1.16.4",
     "webpack": "^4.29.0"
   }
diff --git a/examples/mithril-kitchen-sink/package.json b/examples/mithril-kitchen-sink/package.json
index cd89efca54a..67868db00a9 100644
--- a/examples/mithril-kitchen-sink/package.json
+++ b/examples/mithril-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "mithril-example",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook",
@@ -10,18 +10,18 @@
     "mithril": "^1.1.6"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-beta.3",
-    "@storybook/addon-backgrounds": "5.0.0-beta.3",
-    "@storybook/addon-centered": "5.0.0-beta.3",
-    "@storybook/addon-knobs": "5.0.0-beta.3",
-    "@storybook/addon-links": "5.0.0-beta.3",
-    "@storybook/addon-notes": "5.0.0-beta.3",
-    "@storybook/addon-options": "5.0.0-beta.3",
-    "@storybook/addon-storyshots": "5.0.0-beta.3",
-    "@storybook/addon-storysource": "5.0.0-beta.3",
-    "@storybook/addon-viewport": "5.0.0-beta.3",
-    "@storybook/addons": "5.0.0-beta.3",
-    "@storybook/mithril": "5.0.0-beta.3",
+    "@storybook/addon-actions": "5.0.0-beta.4",
+    "@storybook/addon-backgrounds": "5.0.0-beta.4",
+    "@storybook/addon-centered": "5.0.0-beta.4",
+    "@storybook/addon-knobs": "5.0.0-beta.4",
+    "@storybook/addon-links": "5.0.0-beta.4",
+    "@storybook/addon-notes": "5.0.0-beta.4",
+    "@storybook/addon-options": "5.0.0-beta.4",
+    "@storybook/addon-storyshots": "5.0.0-beta.4",
+    "@storybook/addon-storysource": "5.0.0-beta.4",
+    "@storybook/addon-viewport": "5.0.0-beta.4",
+    "@storybook/addons": "5.0.0-beta.4",
+    "@storybook/mithril": "5.0.0-beta.4",
     "webpack": "^4.29.0"
   }
 }
diff --git a/examples/official-storybook/package.json b/examples/official-storybook/package.json
index 330e4c42a5c..143dd3c2c91 100644
--- a/examples/official-storybook/package.json
+++ b/examples/official-storybook/package.json
@@ -1,6 +1,6 @@
 {
   "name": "official-storybook",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook -c ./ -s built-storybooks",
@@ -12,29 +12,29 @@
     "storybook": "cross-env STORYBOOK_DISPLAY_WARNING=true DISPLAY_WARNING=true start-storybook -p 9011 -c ./ -s built-storybooks --no-dll"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.0.0-beta.3",
-    "@storybook/addon-actions": "5.0.0-beta.3",
-    "@storybook/addon-backgrounds": "5.0.0-beta.3",
-    "@storybook/addon-centered": "5.0.0-beta.3",
-    "@storybook/addon-cssresources": "5.0.0-beta.3",
-    "@storybook/addon-events": "5.0.0-beta.3",
-    "@storybook/addon-graphql": "5.0.0-beta.3",
-    "@storybook/addon-info": "5.0.0-beta.3",
-    "@storybook/addon-jest": "5.0.0-beta.3",
-    "@storybook/addon-knobs": "5.0.0-beta.3",
-    "@storybook/addon-links": "5.0.0-beta.3",
-    "@storybook/addon-notes": "5.0.0-beta.3",
-    "@storybook/addon-options": "5.0.0-beta.3",
-    "@storybook/addon-storyshots": "5.0.0-beta.3",
-    "@storybook/addon-storyshots-puppeteer": "5.0.0-beta.3",
-    "@storybook/addon-storysource": "5.0.0-beta.3",
-    "@storybook/addon-viewport": "5.0.0-beta.3",
-    "@storybook/addons": "5.0.0-beta.3",
-    "@storybook/components": "5.0.0-beta.3",
-    "@storybook/core-events": "5.0.0-beta.3",
-    "@storybook/node-logger": "5.0.0-beta.3",
-    "@storybook/react": "5.0.0-beta.3",
-    "@storybook/theming": "5.0.0-beta.3",
+    "@storybook/addon-a11y": "5.0.0-beta.4",
+    "@storybook/addon-actions": "5.0.0-beta.4",
+    "@storybook/addon-backgrounds": "5.0.0-beta.4",
+    "@storybook/addon-centered": "5.0.0-beta.4",
+    "@storybook/addon-cssresources": "5.0.0-beta.4",
+    "@storybook/addon-events": "5.0.0-beta.4",
+    "@storybook/addon-graphql": "5.0.0-beta.4",
+    "@storybook/addon-info": "5.0.0-beta.4",
+    "@storybook/addon-jest": "5.0.0-beta.4",
+    "@storybook/addon-knobs": "5.0.0-beta.4",
+    "@storybook/addon-links": "5.0.0-beta.4",
+    "@storybook/addon-notes": "5.0.0-beta.4",
+    "@storybook/addon-options": "5.0.0-beta.4",
+    "@storybook/addon-storyshots": "5.0.0-beta.4",
+    "@storybook/addon-storyshots-puppeteer": "5.0.0-beta.4",
+    "@storybook/addon-storysource": "5.0.0-beta.4",
+    "@storybook/addon-viewport": "5.0.0-beta.4",
+    "@storybook/addons": "5.0.0-beta.4",
+    "@storybook/components": "5.0.0-beta.4",
+    "@storybook/core-events": "5.0.0-beta.4",
+    "@storybook/node-logger": "5.0.0-beta.4",
+    "@storybook/react": "5.0.0-beta.4",
+    "@storybook/theming": "5.0.0-beta.4",
     "cors": "^2.8.4",
     "cross-env": "^5.2.0",
     "enzyme-to-json": "^3.3.4",
diff --git a/examples/polymer-cli/package.json b/examples/polymer-cli/package.json
index b3b12f6b253..5de6577d7da 100644
--- a/examples/polymer-cli/package.json
+++ b/examples/polymer-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "polymer-cli",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook",
@@ -9,15 +9,15 @@
   },
   "dependencies": {
     "@polymer/polymer": "^2.6.0",
-    "@storybook/addon-actions": "5.0.0-beta.3",
-    "@storybook/addon-backgrounds": "5.0.0-beta.3",
-    "@storybook/addon-knobs": "5.0.0-beta.3",
-    "@storybook/addon-links": "5.0.0-beta.3",
-    "@storybook/addon-notes": "5.0.0-beta.3",
-    "@storybook/addon-options": "5.0.0-beta.3",
-    "@storybook/addon-storysource": "5.0.0-beta.3",
-    "@storybook/addon-viewport": "5.0.0-beta.3",
-    "@storybook/polymer": "5.0.0-beta.3",
+    "@storybook/addon-actions": "5.0.0-beta.4",
+    "@storybook/addon-backgrounds": "5.0.0-beta.4",
+    "@storybook/addon-knobs": "5.0.0-beta.4",
+    "@storybook/addon-links": "5.0.0-beta.4",
+    "@storybook/addon-notes": "5.0.0-beta.4",
+    "@storybook/addon-options": "5.0.0-beta.4",
+    "@storybook/addon-storysource": "5.0.0-beta.4",
+    "@storybook/addon-viewport": "5.0.0-beta.4",
+    "@storybook/polymer": "5.0.0-beta.4",
     "@webcomponents/webcomponentsjs": "^1.2.0",
     "global": "^4.3.2",
     "lit-html": "^1.0.0",
diff --git a/examples/preact-kitchen-sink/package.json b/examples/preact-kitchen-sink/package.json
index 42f21cedd18..7d64b696900 100644
--- a/examples/preact-kitchen-sink/package.json
+++ b/examples/preact-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "preact-example",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "private": true,
   "scripts": {
     "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
@@ -15,18 +15,18 @@
   "devDependencies": {
     "@babel/core": "^7.2.2",
     "@babel/plugin-transform-runtime": "^7.2.0",
-    "@storybook/addon-actions": "5.0.0-beta.3",
-    "@storybook/addon-backgrounds": "5.0.0-beta.3",
-    "@storybook/addon-centered": "5.0.0-beta.3",
-    "@storybook/addon-knobs": "5.0.0-beta.3",
-    "@storybook/addon-links": "5.0.0-beta.3",
-    "@storybook/addon-notes": "5.0.0-beta.3",
-    "@storybook/addon-options": "5.0.0-beta.3",
-    "@storybook/addon-storyshots": "5.0.0-beta.3",
-    "@storybook/addon-storysource": "5.0.0-beta.3",
-    "@storybook/addon-viewport": "5.0.0-beta.3",
-    "@storybook/addons": "5.0.0-beta.3",
-    "@storybook/preact": "5.0.0-beta.3",
+    "@storybook/addon-actions": "5.0.0-beta.4",
+    "@storybook/addon-backgrounds": "5.0.0-beta.4",
+    "@storybook/addon-centered": "5.0.0-beta.4",
+    "@storybook/addon-knobs": "5.0.0-beta.4",
+    "@storybook/addon-links": "5.0.0-beta.4",
+    "@storybook/addon-notes": "5.0.0-beta.4",
+    "@storybook/addon-options": "5.0.0-beta.4",
+    "@storybook/addon-storyshots": "5.0.0-beta.4",
+    "@storybook/addon-storysource": "5.0.0-beta.4",
+    "@storybook/addon-viewport": "5.0.0-beta.4",
+    "@storybook/addons": "5.0.0-beta.4",
+    "@storybook/preact": "5.0.0-beta.4",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
     "file-loader": "^3.0.1",
diff --git a/examples/riot-kitchen-sink/package.json b/examples/riot-kitchen-sink/package.json
index 976c4c9e16e..f11b885c1ec 100644
--- a/examples/riot-kitchen-sink/package.json
+++ b/examples/riot-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "riot-example",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "private": true,
   "scripts": {
     "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
@@ -15,18 +15,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.2.2",
-    "@storybook/addon-actions": "5.0.0-beta.3",
-    "@storybook/addon-backgrounds": "5.0.0-beta.3",
-    "@storybook/addon-centered": "5.0.0-beta.3",
-    "@storybook/addon-knobs": "5.0.0-beta.3",
-    "@storybook/addon-links": "5.0.0-beta.3",
-    "@storybook/addon-notes": "5.0.0-beta.3",
-    "@storybook/addon-options": "5.0.0-beta.3",
-    "@storybook/addon-storyshots": "5.0.0-beta.3",
-    "@storybook/addon-storysource": "5.0.0-beta.3",
-    "@storybook/addon-viewport": "5.0.0-beta.3",
-    "@storybook/addons": "5.0.0-beta.3",
-    "@storybook/riot": "5.0.0-beta.3",
+    "@storybook/addon-actions": "5.0.0-beta.4",
+    "@storybook/addon-backgrounds": "5.0.0-beta.4",
+    "@storybook/addon-centered": "5.0.0-beta.4",
+    "@storybook/addon-knobs": "5.0.0-beta.4",
+    "@storybook/addon-links": "5.0.0-beta.4",
+    "@storybook/addon-notes": "5.0.0-beta.4",
+    "@storybook/addon-options": "5.0.0-beta.4",
+    "@storybook/addon-storyshots": "5.0.0-beta.4",
+    "@storybook/addon-storysource": "5.0.0-beta.4",
+    "@storybook/addon-viewport": "5.0.0-beta.4",
+    "@storybook/addons": "5.0.0-beta.4",
+    "@storybook/riot": "5.0.0-beta.4",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
     "file-loader": "^3.0.1",
diff --git a/examples/svelte-kitchen-sink/package.json b/examples/svelte-kitchen-sink/package.json
index ba862d20d2a..98525a33c62 100644
--- a/examples/svelte-kitchen-sink/package.json
+++ b/examples/svelte-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "svelte-example",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook -s public",
@@ -10,17 +10,17 @@
     "global": "^4.3.2"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-beta.3",
-    "@storybook/addon-backgrounds": "5.0.0-beta.3",
-    "@storybook/addon-centered": "5.0.0-beta.3",
-    "@storybook/addon-knobs": "5.0.0-beta.3",
-    "@storybook/addon-links": "5.0.0-beta.3",
-    "@storybook/addon-notes": "5.0.0-beta.3",
-    "@storybook/addon-options": "5.0.0-beta.3",
-    "@storybook/addon-storyshots": "5.0.0-beta.3",
-    "@storybook/addon-storysource": "5.0.0-beta.3",
-    "@storybook/addon-viewport": "5.0.0-beta.3",
-    "@storybook/addons": "5.0.0-beta.3",
-    "@storybook/svelte": "5.0.0-beta.3"
+    "@storybook/addon-actions": "5.0.0-beta.4",
+    "@storybook/addon-backgrounds": "5.0.0-beta.4",
+    "@storybook/addon-centered": "5.0.0-beta.4",
+    "@storybook/addon-knobs": "5.0.0-beta.4",
+    "@storybook/addon-links": "5.0.0-beta.4",
+    "@storybook/addon-notes": "5.0.0-beta.4",
+    "@storybook/addon-options": "5.0.0-beta.4",
+    "@storybook/addon-storyshots": "5.0.0-beta.4",
+    "@storybook/addon-storysource": "5.0.0-beta.4",
+    "@storybook/addon-viewport": "5.0.0-beta.4",
+    "@storybook/addons": "5.0.0-beta.4",
+    "@storybook/svelte": "5.0.0-beta.4"
   }
 }
diff --git a/examples/vue-kitchen-sink/package.json b/examples/vue-kitchen-sink/package.json
index 0a9e50ea077..39eb1a6559c 100644
--- a/examples/vue-kitchen-sink/package.json
+++ b/examples/vue-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "vue-example",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "private": true,
   "scripts": {
     "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
@@ -14,18 +14,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.2.2",
-    "@storybook/addon-actions": "5.0.0-beta.3",
-    "@storybook/addon-backgrounds": "5.0.0-beta.3",
-    "@storybook/addon-centered": "5.0.0-beta.3",
-    "@storybook/addon-knobs": "5.0.0-beta.3",
-    "@storybook/addon-links": "5.0.0-beta.3",
-    "@storybook/addon-notes": "5.0.0-beta.3",
-    "@storybook/addon-options": "5.0.0-beta.3",
-    "@storybook/addon-storyshots": "5.0.0-beta.3",
-    "@storybook/addon-storysource": "5.0.0-beta.3",
-    "@storybook/addon-viewport": "5.0.0-beta.3",
-    "@storybook/addons": "5.0.0-beta.3",
-    "@storybook/vue": "5.0.0-beta.3",
+    "@storybook/addon-actions": "5.0.0-beta.4",
+    "@storybook/addon-backgrounds": "5.0.0-beta.4",
+    "@storybook/addon-centered": "5.0.0-beta.4",
+    "@storybook/addon-knobs": "5.0.0-beta.4",
+    "@storybook/addon-links": "5.0.0-beta.4",
+    "@storybook/addon-notes": "5.0.0-beta.4",
+    "@storybook/addon-options": "5.0.0-beta.4",
+    "@storybook/addon-storyshots": "5.0.0-beta.4",
+    "@storybook/addon-storysource": "5.0.0-beta.4",
+    "@storybook/addon-viewport": "5.0.0-beta.4",
+    "@storybook/addons": "5.0.0-beta.4",
+    "@storybook/vue": "5.0.0-beta.4",
     "babel-core": "^7.0.0-bridge.0",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
diff --git a/lerna.json b/lerna.json
index d5ee31eab8f..a0e1e12d619 100644
--- a/lerna.json
+++ b/lerna.json
@@ -11,5 +11,5 @@
   "npmClient": "yarn",
   "useWorkspaces": true,
   "registry": "https://registry.npmjs.org",
-  "version": "5.0.0-beta.3"
+  "version": "5.0.0-beta.4"
 }
diff --git a/lib/addons/package.json b/lib/addons/package.json
index 9bbb4796e3a..2308abf20ba 100644
--- a/lib/addons/package.json
+++ b/lib/addons/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addons",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "Storybook addons store",
   "keywords": [
     "storybook"
@@ -20,8 +20,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.0.0-beta.3",
-    "@storybook/client-logger": "5.0.0-beta.3",
+    "@storybook/channels": "5.0.0-beta.4",
+    "@storybook/client-logger": "5.0.0-beta.4",
     "global": "^4.3.2",
     "util-deprecate": "^1.0.2"
   },
diff --git a/lib/channel-postmessage/package.json b/lib/channel-postmessage/package.json
index 8b8f85a1faa..2fc27892490 100644
--- a/lib/channel-postmessage/package.json
+++ b/lib/channel-postmessage/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channel-postmessage",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "",
   "keywords": [
     "storybook"
@@ -20,7 +20,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.0.0-beta.3",
+    "@storybook/channels": "5.0.0-beta.4",
     "global": "^4.3.2",
     "telejson": "^1.0.1"
   },
diff --git a/lib/channel-websocket/package.json b/lib/channel-websocket/package.json
index 795daeb6564..e804c6c5e93 100644
--- a/lib/channel-websocket/package.json
+++ b/lib/channel-websocket/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channel-websocket",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "",
   "keywords": [
     "storybook"
@@ -20,7 +20,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.0.0-beta.3",
+    "@storybook/channels": "5.0.0-beta.4",
     "global": "^4.3.2",
     "json-fn": "^1.1.1"
   },
diff --git a/lib/channels/package.json b/lib/channels/package.json
index 2546237b6fa..cfcbdedef39 100644
--- a/lib/channels/package.json
+++ b/lib/channels/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channels",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/cli/package.json b/lib/cli/package.json
index e85c361fe73..e3df304ac93 100644
--- a/lib/cli/package.json
+++ b/lib/cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/cli",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "Storybook's CLI - easiest method of adding storybook to your projects",
   "keywords": [
     "cli",
@@ -29,7 +29,7 @@
     "@babel/core": "^7.2.2",
     "@babel/preset-env": "^7.3.1",
     "@babel/register": "^7.0.0",
-    "@storybook/codemod": "5.0.0-beta.3",
+    "@storybook/codemod": "5.0.0-beta.4",
     "chalk": "^2.4.1",
     "commander": "^2.19.0",
     "core-js": "^2.6.2",
@@ -43,31 +43,31 @@
     "update-notifier": "^2.5.0"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-beta.3",
-    "@storybook/addon-centered": "5.0.0-beta.3",
-    "@storybook/addon-graphql": "5.0.0-beta.3",
-    "@storybook/addon-info": "5.0.0-beta.3",
-    "@storybook/addon-knobs": "5.0.0-beta.3",
-    "@storybook/addon-links": "5.0.0-beta.3",
-    "@storybook/addon-notes": "5.0.0-beta.3",
-    "@storybook/addon-options": "5.0.0-beta.3",
-    "@storybook/addon-storyshots": "5.0.0-beta.3",
-    "@storybook/addons": "5.0.0-beta.3",
-    "@storybook/angular": "5.0.0-beta.3",
-    "@storybook/channel-postmessage": "5.0.0-beta.3",
-    "@storybook/channel-websocket": "5.0.0-beta.3",
-    "@storybook/channels": "5.0.0-beta.3",
-    "@storybook/ember": "5.0.0-beta.3",
-    "@storybook/html": "5.0.0-beta.3",
-    "@storybook/marko": "5.0.0-beta.3",
-    "@storybook/mithril": "5.0.0-beta.3",
-    "@storybook/polymer": "5.0.0-beta.3",
-    "@storybook/preact": "5.0.0-beta.3",
-    "@storybook/react": "5.0.0-beta.3",
-    "@storybook/react-native": "5.0.0-beta.3",
-    "@storybook/riot": "5.0.0-beta.3",
-    "@storybook/ui": "5.0.0-beta.3",
-    "@storybook/vue": "5.0.0-beta.3"
+    "@storybook/addon-actions": "5.0.0-beta.4",
+    "@storybook/addon-centered": "5.0.0-beta.4",
+    "@storybook/addon-graphql": "5.0.0-beta.4",
+    "@storybook/addon-info": "5.0.0-beta.4",
+    "@storybook/addon-knobs": "5.0.0-beta.4",
+    "@storybook/addon-links": "5.0.0-beta.4",
+    "@storybook/addon-notes": "5.0.0-beta.4",
+    "@storybook/addon-options": "5.0.0-beta.4",
+    "@storybook/addon-storyshots": "5.0.0-beta.4",
+    "@storybook/addons": "5.0.0-beta.4",
+    "@storybook/angular": "5.0.0-beta.4",
+    "@storybook/channel-postmessage": "5.0.0-beta.4",
+    "@storybook/channel-websocket": "5.0.0-beta.4",
+    "@storybook/channels": "5.0.0-beta.4",
+    "@storybook/ember": "5.0.0-beta.4",
+    "@storybook/html": "5.0.0-beta.4",
+    "@storybook/marko": "5.0.0-beta.4",
+    "@storybook/mithril": "5.0.0-beta.4",
+    "@storybook/polymer": "5.0.0-beta.4",
+    "@storybook/preact": "5.0.0-beta.4",
+    "@storybook/react": "5.0.0-beta.4",
+    "@storybook/react-native": "5.0.0-beta.4",
+    "@storybook/riot": "5.0.0-beta.4",
+    "@storybook/ui": "5.0.0-beta.4",
+    "@storybook/vue": "5.0.0-beta.4"
   },
   "publishConfig": {
     "access": "public"
diff --git a/lib/client-api/package.json b/lib/client-api/package.json
index 13b031c5853..a220f9cb7ac 100644
--- a/lib/client-api/package.json
+++ b/lib/client-api/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/client-api",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "Storybook Client API",
   "keywords": [
     "storybook"
@@ -19,9 +19,9 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-beta.3",
-    "@storybook/client-logger": "5.0.0-beta.3",
-    "@storybook/core-events": "5.0.0-beta.3",
+    "@storybook/addons": "5.0.0-beta.4",
+    "@storybook/client-logger": "5.0.0-beta.4",
+    "@storybook/core-events": "5.0.0-beta.4",
     "common-tags": "^1.8.0",
     "eventemitter3": "^3.1.0",
     "global": "^4.3.2",
diff --git a/lib/client-logger/package.json b/lib/client-logger/package.json
index 546d5ca6ffc..60c12dd8be8 100644
--- a/lib/client-logger/package.json
+++ b/lib/client-logger/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/client-logger",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/codemod/package.json b/lib/codemod/package.json
index f25e2de6dd0..0a3add8b5d0 100644
--- a/lib/codemod/package.json
+++ b/lib/codemod/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/codemod",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "A collection of codemod scripts written with JSCodeshift",
   "keywords": [
     "storybook"
diff --git a/lib/components/package.json b/lib/components/package.json
index d40bf9bb8ad..88a82603dc3 100644
--- a/lib/components/package.json
+++ b/lib/components/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/components",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "Core Storybook Components",
   "keywords": [
     "storybook"
@@ -20,11 +20,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-beta.3",
-    "@storybook/client-logger": "5.0.0-beta.3",
-    "@storybook/core-events": "5.0.0-beta.3",
-    "@storybook/router": "5.0.0-beta.3",
-    "@storybook/theming": "5.0.0-beta.3",
+    "@storybook/addons": "5.0.0-beta.4",
+    "@storybook/client-logger": "5.0.0-beta.4",
+    "@storybook/core-events": "5.0.0-beta.4",
+    "@storybook/router": "5.0.0-beta.4",
+    "@storybook/theming": "5.0.0-beta.4",
     "global": "^4.3.2",
     "immer": "^1.12.0",
     "js-beautify": "^1.8.9",
diff --git a/lib/core-events/package.json b/lib/core-events/package.json
index 00db7b7e6a0..6596b82f511 100644
--- a/lib/core-events/package.json
+++ b/lib/core-events/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/core-events",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "Event names used in storybook core",
   "keywords": [
     "storybook"
diff --git a/lib/core/package.json b/lib/core/package.json
index 5bbc3405095..ca8a888e4af 100644
--- a/lib/core/package.json
+++ b/lib/core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/core",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "Storybook framework-agnostic API",
   "keywords": [
     "storybook"
@@ -24,14 +24,14 @@
     "@babel/plugin-syntax-dynamic-import": "^7.2.0",
     "@babel/plugin-transform-react-constant-elements": "^7.2.0",
     "@babel/preset-env": "^7.3.1",
-    "@storybook/addons": "5.0.0-beta.3",
-    "@storybook/channel-postmessage": "5.0.0-beta.3",
-    "@storybook/client-api": "5.0.0-beta.3",
-    "@storybook/client-logger": "5.0.0-beta.3",
-    "@storybook/core-events": "5.0.0-beta.3",
-    "@storybook/node-logger": "5.0.0-beta.3",
-    "@storybook/theming": "5.0.0-beta.3",
-    "@storybook/ui": "5.0.0-beta.3",
+    "@storybook/addons": "5.0.0-beta.4",
+    "@storybook/channel-postmessage": "5.0.0-beta.4",
+    "@storybook/client-api": "5.0.0-beta.4",
+    "@storybook/client-logger": "5.0.0-beta.4",
+    "@storybook/core-events": "5.0.0-beta.4",
+    "@storybook/node-logger": "5.0.0-beta.4",
+    "@storybook/theming": "5.0.0-beta.4",
+    "@storybook/ui": "5.0.0-beta.4",
     "airbnb-js-shims": "^1 || ^2",
     "autoprefixer": "^9.4.7",
     "babel-plugin-add-react-displayname": "^0.0.5",
diff --git a/lib/node-logger/package.json b/lib/node-logger/package.json
index bc6450b2aa7..9507157b93b 100644
--- a/lib/node-logger/package.json
+++ b/lib/node-logger/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/node-logger",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/router/package.json b/lib/router/package.json
index 744b0c12521..355cee5b2bf 100644
--- a/lib/router/package.json
+++ b/lib/router/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/router",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "Core Storybook Router",
   "keywords": [
     "storybook"
@@ -20,7 +20,7 @@
   },
   "dependencies": {
     "@reach/router": "^1.2.1",
-    "@storybook/theming": "5.0.0-beta.3",
+    "@storybook/theming": "5.0.0-beta.4",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
     "qs": "^6.5.2"
diff --git a/lib/theming/package.json b/lib/theming/package.json
index 1c831a77c81..756b89617c7 100644
--- a/lib/theming/package.json
+++ b/lib/theming/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/theming",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "Core Storybook Components",
   "keywords": [
     "storybook"
diff --git a/lib/ui/package.json b/lib/ui/package.json
index 18e6752b9a3..967f0664f81 100644
--- a/lib/ui/package.json
+++ b/lib/ui/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/ui",
-  "version": "5.0.0-beta.3",
+  "version": "5.0.0-beta.4",
   "description": "Core Storybook UI",
   "keywords": [
     "storybook"
@@ -21,12 +21,12 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-beta.3",
-    "@storybook/client-logger": "5.0.0-beta.3",
-    "@storybook/components": "5.0.0-beta.3",
-    "@storybook/core-events": "5.0.0-beta.3",
-    "@storybook/router": "5.0.0-beta.3",
-    "@storybook/theming": "5.0.0-beta.3",
+    "@storybook/addons": "5.0.0-beta.4",
+    "@storybook/client-logger": "5.0.0-beta.4",
+    "@storybook/components": "5.0.0-beta.4",
+    "@storybook/core-events": "5.0.0-beta.4",
+    "@storybook/router": "5.0.0-beta.4",
+    "@storybook/theming": "5.0.0-beta.4",
     "eventemitter3": "^3.1.0",
     "fast-deep-equal": "^2.0.1",
     "fuse.js": "^3.3.1",

From c760d659f5bd89ffe92526d8a22c1cf7be33e765 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Sat, 16 Feb 2019 11:37:11 +0800
Subject: [PATCH 014/249] Decouple react native release

---
 package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package.json b/package.json
index 779ec9c70fb..ce8fafcec97 100644
--- a/package.json
+++ b/package.json
@@ -9,7 +9,7 @@
   "workspaces": [
     "addons/*",
     "addons/storyshots/*",
-    "app/*",
+    "app/!(react-native)*",
     "lib/*",
     "examples/*",
     "lib/cli/test/run/*"

From bfcd60a5be4920607b8add080af059368e0cfb41 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Sat, 16 Feb 2019 13:10:13 +0800
Subject: [PATCH 015/249] Fix yarn.lock

---
 yarn.lock | 1284 +++++------------------------------------------------
 1 file changed, 112 insertions(+), 1172 deletions(-)

diff --git a/yarn.lock b/yarn.lock
index ed8cf01e448..d5c24a77b71 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1952,6 +1952,51 @@
   resolved "https://registry.yarnpkg.com/@sheerun/mutationobserver-shim/-/mutationobserver-shim-0.3.2.tgz#8013f2af54a2b7d735f71560ff360d3a8176a87b"
   integrity sha512-vTCdPp/T/Q3oSqwHmZ5Kpa9oI7iLtGl3RQaA/NyLHikvcrPxACkkKVr/XzkSPJWXHRhKGzVvb0urJsbMlRxi1Q==
 
+"@storybook/react-native@5.0.0-beta.4":
+  version "5.0.0-beta.4"
+  resolved "https://registry.yarnpkg.com/@storybook/react-native/-/react-native-5.0.0-beta.4.tgz#d0b9baea545e156ff4b65590019373eaebbb7a65"
+  integrity sha512-31+FStoAHSEC8G/0Ia9X+PzU3NDWTYbtC7oGXaaGVa+RFso1GOgAIEZR1mz5EAoUfYiqfnAjeyWt5djDxX621w==
+  dependencies:
+    "@storybook/addons" "5.0.0-beta.4"
+    "@storybook/channel-websocket" "5.0.0-beta.4"
+    "@storybook/channels" "5.0.0-beta.4"
+    "@storybook/core" "5.0.0-beta.4"
+    "@storybook/core-events" "5.0.0-beta.4"
+    "@storybook/ui" "5.0.0-beta.4"
+    babel-loader "^8.0.4"
+    babel-plugin-macros "^2.4.5"
+    babel-plugin-syntax-async-functions "^6.13.0"
+    babel-plugin-syntax-trailing-function-commas "^6.22.0"
+    babel-plugin-transform-class-properties "^6.24.1"
+    babel-plugin-transform-object-rest-spread "^6.23.0"
+    babel-plugin-transform-regenerator "^6.26.0"
+    babel-plugin-transform-runtime "^6.23.0"
+    babel-preset-env "^1.7.0"
+    babel-preset-minify "^0.5.0 || 0.6.0-alpha.5"
+    babel-preset-react "^6.24.1"
+    babel-runtime "^6.26.0"
+    case-sensitive-paths-webpack-plugin "^2.2.0"
+    commander "^2.19.0"
+    dotenv-webpack "^1.7.0"
+    ejs "^2.6.1"
+    express "^4.16.3"
+    find-cache-dir "^2.0.0"
+    global "^4.3.2"
+    html-webpack-plugin "^4.0.0-beta.2"
+    json5 "^2.1.0"
+    lazy-universal-dotenv "^2.0.0"
+    prop-types "^15.6.2"
+    raw-loader "^1.0.0"
+    react-dev-utils "^7.0.1"
+    react-native-swipe-gestures "^1.0.2"
+    shelljs "^0.8.2"
+    url-parse "^1.4.3"
+    uuid "^3.3.2"
+    webpack "^4.29.0"
+    webpack-dev-middleware "^3.5.1"
+    webpack-hot-middleware "^2.24.3"
+    ws "^6.1.3"
+
 "@svgr/babel-plugin-add-jsx-attribute@^4.0.0":
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/@svgr/babel-plugin-add-jsx-attribute/-/babel-plugin-add-jsx-attribute-4.0.0.tgz#5acf239cd2747b1a36ec7e708de05d914cb9b948"
@@ -2650,24 +2695,13 @@ abbrev@1.0.x:
   version "1.0.9"
   resolved "https://registry.yarnpkg.com/abbrev/-/abbrev-1.0.9.tgz#91b4792588a7738c25f35dd6f63752a2f8776135"
 
-absolute-path@^0.0.0:
-  version "0.0.0"
-  resolved "https://registry.yarnpkg.com/absolute-path/-/absolute-path-0.0.0.tgz#a78762fbdadfb5297be99b15d35a785b2f095bf7"
-
-accepts@^1.3.5, accepts@~1.3.0, accepts@~1.3.4, accepts@~1.3.5:
+accepts@^1.3.5, accepts@~1.3.4, accepts@~1.3.5:
   version "1.3.5"
   resolved "https://registry.yarnpkg.com/accepts/-/accepts-1.3.5.tgz#eb777df6011723a3b14e8a72c0805c8e86746bd2"
   dependencies:
     mime-types "~2.1.18"
     negotiator "0.6.1"
 
-accepts@~1.2.12, accepts@~1.2.13:
-  version "1.2.13"
-  resolved "https://registry.yarnpkg.com/accepts/-/accepts-1.2.13.tgz#e5f1f3928c6d95fd96558c36ec3d9d0de4a6ecea"
-  dependencies:
-    mime-types "~2.1.6"
-    negotiator "0.5.3"
-
 acorn-dynamic-import@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/acorn-dynamic-import/-/acorn-dynamic-import-3.0.0.tgz#901ceee4c7faaef7e07ad2a47e890675da50a278"
@@ -2838,22 +2872,10 @@ ansi-align@^3.0.0:
   dependencies:
     string-width "^3.0.0"
 
-ansi-colors@^1.0.1:
-  version "1.1.0"
-  resolved "https://registry.yarnpkg.com/ansi-colors/-/ansi-colors-1.1.0.tgz#6374b4dd5d4718ff3ce27a671a3b1cad077132a9"
-  dependencies:
-    ansi-wrap "^0.1.0"
-
 ansi-colors@^3.0.0:
   version "3.2.3"
   resolved "https://registry.yarnpkg.com/ansi-colors/-/ansi-colors-3.2.3.tgz#57d35b8686e851e2cc04c403f1c00203976a1813"
 
-ansi-cyan@^0.1.1:
-  version "0.1.1"
-  resolved "https://registry.yarnpkg.com/ansi-cyan/-/ansi-cyan-0.1.1.tgz#538ae528af8982f28ae30d86f2f17456d2609873"
-  dependencies:
-    ansi-wrap "0.1.0"
-
 ansi-escapes@^1.1.0:
   version "1.4.0"
   resolved "https://registry.yarnpkg.com/ansi-escapes/-/ansi-escapes-1.4.0.tgz#d3a8a83b319aa67793662b13e761c7911422306e"
@@ -2862,22 +2884,10 @@ ansi-escapes@^3.0.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/ansi-escapes/-/ansi-escapes-3.1.0.tgz#f73207bb81207d75fd6c83f125af26eea378ca30"
 
-ansi-gray@^0.1.1:
-  version "0.1.1"
-  resolved "https://registry.yarnpkg.com/ansi-gray/-/ansi-gray-0.1.1.tgz#2962cf54ec9792c48510a3deb524436861ef7251"
-  dependencies:
-    ansi-wrap "0.1.0"
-
 ansi-html@0.0.7:
   version "0.0.7"
   resolved "https://registry.yarnpkg.com/ansi-html/-/ansi-html-0.0.7.tgz#813584021962a9e9e6fd039f940d12f56ca7859e"
 
-ansi-red@^0.1.1:
-  version "0.1.1"
-  resolved "https://registry.yarnpkg.com/ansi-red/-/ansi-red-0.1.1.tgz#8c638f9d1080800a353c9c28c8a81ca4705d946c"
-  dependencies:
-    ansi-wrap "0.1.0"
-
 ansi-regex@^2.0.0:
   version "2.1.1"
   resolved "https://registry.yarnpkg.com/ansi-regex/-/ansi-regex-2.1.1.tgz#c3b33ab5ee360d86e0e628f0468ae7ef27d654df"
@@ -2900,14 +2910,6 @@ ansi-styles@^3.0.0, ansi-styles@^3.2.0, ansi-styles@^3.2.1:
   dependencies:
     color-convert "^1.9.0"
 
-ansi-wrap@0.1.0, ansi-wrap@^0.1.0:
-  version "0.1.0"
-  resolved "https://registry.yarnpkg.com/ansi-wrap/-/ansi-wrap-0.1.0.tgz#a82250ddb0015e9a27ca82e82ea603bbfa45efaf"
-
-ansi@^0.3.0, ansi@~0.3.1:
-  version "0.3.1"
-  resolved "https://registry.yarnpkg.com/ansi/-/ansi-0.3.1.tgz#0c42d4fb17160d5a9af1e484bace1c66922c1b21"
-
 ansicolors@~0.2.1:
   version "0.2.1"
   resolved "https://registry.yarnpkg.com/ansicolors/-/ansicolors-0.2.1.tgz#be089599097b74a5c9c4a84a0cdbcdb62bd87aef"
@@ -2962,10 +2964,6 @@ aproba@^1.0.3, aproba@^1.1.1, aproba@^1.1.2:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/aproba/-/aproba-2.0.0.tgz#52520b8ae5b569215b354efc0caa3fe1e45a8adc"
 
-arch@^2.1.0:
-  version "2.1.1"
-  resolved "https://registry.yarnpkg.com/arch/-/arch-2.1.1.tgz#8f5c2731aa35a30929221bb0640eed65175ec84e"
-
 are-we-there-yet@~1.1.2:
   version "1.1.5"
   resolved "https://registry.yarnpkg.com/are-we-there-yet/-/are-we-there-yet-1.1.5.tgz#4b35c2944f062a8bfcda66410760350fe9ddfc21"
@@ -2998,13 +2996,6 @@ aria-query@^3.0.0:
     ast-types-flow "0.0.7"
     commander "^2.11.0"
 
-arr-diff@^1.0.1:
-  version "1.1.0"
-  resolved "https://registry.yarnpkg.com/arr-diff/-/arr-diff-1.1.0.tgz#687c32758163588fef7de7b36fabe495eb1a399a"
-  dependencies:
-    arr-flatten "^1.0.1"
-    array-slice "^0.2.3"
-
 arr-diff@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/arr-diff/-/arr-diff-2.0.0.tgz#8f3b827f955a8bd669697e4a4256ac3ceae356cf"
@@ -3019,10 +3010,6 @@ arr-flatten@^1.0.1, arr-flatten@^1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/arr-flatten/-/arr-flatten-1.1.0.tgz#36048bbff4e7b47e136644316c99669ea5ae91f1"
 
-arr-union@^2.0.1:
-  version "2.1.0"
-  resolved "https://registry.yarnpkg.com/arr-union/-/arr-union-2.1.0.tgz#20f9eab5ec70f5c7d215b1077b1c39161d292c7d"
-
 arr-union@^3.1.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/arr-union/-/arr-union-3.1.0.tgz#e39b09aea9def866a8f206e288af63919bae39c4"
@@ -3070,10 +3057,6 @@ array-reduce@~0.0.0:
   version "0.0.0"
   resolved "https://registry.yarnpkg.com/array-reduce/-/array-reduce-0.0.0.tgz#173899d3ffd1c7d9383e4479525dbe278cab5f2b"
 
-array-slice@^0.2.3:
-  version "0.2.3"
-  resolved "https://registry.yarnpkg.com/array-slice/-/array-slice-0.2.3.tgz#dd3cfb80ed7973a75117cdac69b0b99ec86186f5"
-
 array-to-error@^1.0.0:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/array-to-error/-/array-to-error-1.1.1.tgz#d68812926d14097a205579a667eeaf1856a44c07"
@@ -3126,10 +3109,6 @@ arrify@^1.0.0, arrify@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/arrify/-/arrify-1.0.1.tgz#898508da2226f380df904728456849c1501a4b0d"
 
-art@^0.10.0:
-  version "0.10.3"
-  resolved "https://registry.yarnpkg.com/art/-/art-0.10.3.tgz#b01d84a968ccce6208df55a733838c96caeeaea2"
-
 asap@^2.0.0, asap@~2.0.3, asap@~2.0.6:
   version "2.0.6"
   resolved "https://registry.yarnpkg.com/asap/-/asap-2.0.6.tgz#e50347611d7e690943208bbdafebcbc2fb866d46"
@@ -3232,7 +3211,7 @@ async@^0.9.0, async@^0.9.2:
   version "0.9.2"
   resolved "https://registry.yarnpkg.com/async/-/async-0.9.2.tgz#aea74d5e61c1f899613bf64bda66d4c78f2fd17d"
 
-async@^2.1.4, async@^2.4.0, async@^2.4.1, async@^2.5.0, async@^2.6.0:
+async@^2.1.4, async@^2.4.1, async@^2.5.0, async@^2.6.0:
   version "2.6.1"
   resolved "https://registry.yarnpkg.com/async/-/async-2.6.1.tgz#b245a23ca71930044ec53fa46aa00a3e87c6a610"
   dependencies:
@@ -3309,7 +3288,7 @@ babel-core@7.0.0-bridge.0, babel-core@^7.0.0-bridge.0:
   version "7.0.0-bridge.0"
   resolved "https://registry.yarnpkg.com/babel-core/-/babel-core-7.0.0-bridge.0.tgz#95a492ddd90f9b4e9a4a1da14eb335b87b634ece"
 
-babel-core@^6.0.0, babel-core@^6.23.1, babel-core@^6.24.1, babel-core@^6.26.0, babel-core@^6.7.2:
+babel-core@^6.0.0, babel-core@^6.23.1, babel-core@^6.26.0:
   version "6.26.3"
   resolved "https://registry.yarnpkg.com/babel-core/-/babel-core-6.26.3.tgz#b2e2f09e342d0f0c88e2f02e067794125e75c207"
   dependencies:
@@ -3475,7 +3454,7 @@ babel-helper-regex@^6.24.1:
     babel-types "^6.26.0"
     lodash "^4.17.4"
 
-babel-helper-remap-async-to-generator@^6.16.0, babel-helper-remap-async-to-generator@^6.24.1:
+babel-helper-remap-async-to-generator@^6.24.1:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-helper-remap-async-to-generator/-/babel-helper-remap-async-to-generator-6.24.1.tgz#5ec581827ad723fecdd381f1c928390676e4551b"
   dependencies:
@@ -3563,7 +3542,7 @@ babel-plugin-add-react-displayname@^0.0.5:
   version "0.0.5"
   resolved "https://registry.yarnpkg.com/babel-plugin-add-react-displayname/-/babel-plugin-add-react-displayname-0.0.5.tgz#339d4cddb7b65fd62d1df9db9fe04de134122bd5"
 
-babel-plugin-check-es2015-constants@^6.22.0, babel-plugin-check-es2015-constants@^6.5.0, babel-plugin-check-es2015-constants@^6.8.0:
+babel-plugin-check-es2015-constants@^6.22.0:
   version "6.22.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-check-es2015-constants/-/babel-plugin-check-es2015-constants-6.22.0.tgz#35157b101426fd2ffd3da3f75c7d1e91835bbf8a"
   dependencies:
@@ -3626,12 +3605,6 @@ babel-plugin-emotion@^9.2.11:
     source-map "^0.5.7"
     touch "^2.0.1"
 
-babel-plugin-external-helpers@^6.18.0:
-  version "6.22.0"
-  resolved "https://registry.yarnpkg.com/babel-plugin-external-helpers/-/babel-plugin-external-helpers-6.22.0.tgz#2285f48b02bd5dede85175caf8c62e86adccefa1"
-  dependencies:
-    babel-runtime "^6.22.0"
-
 babel-plugin-htmlbars-inline-precompile@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-htmlbars-inline-precompile/-/babel-plugin-htmlbars-inline-precompile-1.0.0.tgz#a9d2f6eaad8a3f3d361602de593a8cbef8179c22"
@@ -3773,37 +3746,27 @@ babel-plugin-react-docgen@^2.0.2:
     react-docgen "^3.0.0"
     recast "^0.14.7"
 
-babel-plugin-react-transform@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/babel-plugin-react-transform/-/babel-plugin-react-transform-3.0.0.tgz#402f25137b7bb66e9b54ead75557dfbc7ecaaa74"
-  dependencies:
-    lodash "^4.6.1"
-
 babel-plugin-require-context-hook@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-require-context-hook/-/babel-plugin-require-context-hook-1.0.0.tgz#3f0e7cce87c338f53639b948632fd4e73834632d"
 
-babel-plugin-syntax-async-functions@^6.13.0, babel-plugin-syntax-async-functions@^6.5.0, babel-plugin-syntax-async-functions@^6.8.0:
+babel-plugin-syntax-async-functions@^6.13.0, babel-plugin-syntax-async-functions@^6.8.0:
   version "6.13.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-syntax-async-functions/-/babel-plugin-syntax-async-functions-6.13.0.tgz#cad9cad1191b5ad634bf30ae0872391e0647be95"
 
-babel-plugin-syntax-class-properties@^6.5.0, babel-plugin-syntax-class-properties@^6.8.0:
+babel-plugin-syntax-class-properties@^6.8.0:
   version "6.13.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-syntax-class-properties/-/babel-plugin-syntax-class-properties-6.13.0.tgz#d7eb23b79a317f8543962c505b827c7d6cac27de"
 
-babel-plugin-syntax-dynamic-import@^6.18.0:
-  version "6.18.0"
-  resolved "https://registry.yarnpkg.com/babel-plugin-syntax-dynamic-import/-/babel-plugin-syntax-dynamic-import-6.18.0.tgz#8d6a26229c83745a9982a441051572caa179b1da"
-
 babel-plugin-syntax-exponentiation-operator@^6.8.0:
   version "6.13.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-syntax-exponentiation-operator/-/babel-plugin-syntax-exponentiation-operator-6.13.0.tgz#9ee7e8337290da95288201a6a57f4170317830de"
 
-babel-plugin-syntax-flow@^6.18.0, babel-plugin-syntax-flow@^6.5.0, babel-plugin-syntax-flow@^6.8.0:
+babel-plugin-syntax-flow@^6.18.0:
   version "6.18.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-syntax-flow/-/babel-plugin-syntax-flow-6.18.0.tgz#4c3ab20a2af26aa20cd25995c398c4eb70310c8d"
 
-babel-plugin-syntax-jsx@^6.18.0, babel-plugin-syntax-jsx@^6.3.13, babel-plugin-syntax-jsx@^6.5.0, babel-plugin-syntax-jsx@^6.8.0:
+babel-plugin-syntax-jsx@^6.18.0, babel-plugin-syntax-jsx@^6.3.13, babel-plugin-syntax-jsx@^6.8.0:
   version "6.18.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-syntax-jsx/-/babel-plugin-syntax-jsx-6.18.0.tgz#0af32a9a6e13ca7a3fd5069e62d7b0f58d0d8946"
 
@@ -3811,18 +3774,10 @@ babel-plugin-syntax-object-rest-spread@^6.13.0, babel-plugin-syntax-object-rest-
   version "6.13.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-syntax-object-rest-spread/-/babel-plugin-syntax-object-rest-spread-6.13.0.tgz#fd6536f2bce13836ffa3a5458c4903a597bb3bf5"
 
-babel-plugin-syntax-trailing-function-commas@^6.20.0, babel-plugin-syntax-trailing-function-commas@^6.22.0, babel-plugin-syntax-trailing-function-commas@^6.5.0, babel-plugin-syntax-trailing-function-commas@^6.8.0:
+babel-plugin-syntax-trailing-function-commas@^6.22.0:
   version "6.22.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-syntax-trailing-function-commas/-/babel-plugin-syntax-trailing-function-commas-6.22.0.tgz#ba0360937f8d06e40180a43fe0d5616fff532cf3"
 
-babel-plugin-transform-async-to-generator@6.16.0:
-  version "6.16.0"
-  resolved "https://registry.yarnpkg.com/babel-plugin-transform-async-to-generator/-/babel-plugin-transform-async-to-generator-6.16.0.tgz#19ec36cb1486b59f9f468adfa42ce13908ca2999"
-  dependencies:
-    babel-helper-remap-async-to-generator "^6.16.0"
-    babel-plugin-syntax-async-functions "^6.8.0"
-    babel-runtime "^6.0.0"
-
 babel-plugin-transform-async-to-generator@^6.22.0:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-async-to-generator/-/babel-plugin-transform-async-to-generator-6.24.1.tgz#6536e378aff6cb1d5517ac0e40eb3e9fc8d08761"
@@ -3831,7 +3786,7 @@ babel-plugin-transform-async-to-generator@^6.22.0:
     babel-plugin-syntax-async-functions "^6.8.0"
     babel-runtime "^6.22.0"
 
-babel-plugin-transform-class-properties@^6.18.0, babel-plugin-transform-class-properties@^6.24.1, babel-plugin-transform-class-properties@^6.5.0, babel-plugin-transform-class-properties@^6.8.0:
+babel-plugin-transform-class-properties@^6.24.1:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-class-properties/-/babel-plugin-transform-class-properties-6.24.1.tgz#6a79763ea61d33d36f37b611aa9def81a81b46ac"
   dependencies:
@@ -3840,19 +3795,19 @@ babel-plugin-transform-class-properties@^6.18.0, babel-plugin-transform-class-pr
     babel-runtime "^6.22.0"
     babel-template "^6.24.1"
 
-babel-plugin-transform-es2015-arrow-functions@^6.22.0, babel-plugin-transform-es2015-arrow-functions@^6.5.0, babel-plugin-transform-es2015-arrow-functions@^6.8.0:
+babel-plugin-transform-es2015-arrow-functions@^6.22.0:
   version "6.22.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-arrow-functions/-/babel-plugin-transform-es2015-arrow-functions-6.22.0.tgz#452692cb711d5f79dc7f85e440ce41b9f244d221"
   dependencies:
     babel-runtime "^6.22.0"
 
-babel-plugin-transform-es2015-block-scoped-functions@^6.22.0, babel-plugin-transform-es2015-block-scoped-functions@^6.8.0:
+babel-plugin-transform-es2015-block-scoped-functions@^6.22.0:
   version "6.22.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-block-scoped-functions/-/babel-plugin-transform-es2015-block-scoped-functions-6.22.0.tgz#bbc51b49f964d70cb8d8e0b94e820246ce3a6141"
   dependencies:
     babel-runtime "^6.22.0"
 
-babel-plugin-transform-es2015-block-scoping@^6.23.0, babel-plugin-transform-es2015-block-scoping@^6.5.0, babel-plugin-transform-es2015-block-scoping@^6.8.0:
+babel-plugin-transform-es2015-block-scoping@^6.23.0:
   version "6.26.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-block-scoping/-/babel-plugin-transform-es2015-block-scoping-6.26.0.tgz#d70f5299c1308d05c12f463813b0a09e73b1895f"
   dependencies:
@@ -3862,7 +3817,7 @@ babel-plugin-transform-es2015-block-scoping@^6.23.0, babel-plugin-transform-es20
     babel-types "^6.26.0"
     lodash "^4.17.4"
 
-babel-plugin-transform-es2015-classes@^6.23.0, babel-plugin-transform-es2015-classes@^6.5.0, babel-plugin-transform-es2015-classes@^6.8.0:
+babel-plugin-transform-es2015-classes@^6.23.0:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-classes/-/babel-plugin-transform-es2015-classes-6.24.1.tgz#5a4c58a50c9c9461e564b4b2a3bfabc97a2584db"
   dependencies:
@@ -3876,14 +3831,14 @@ babel-plugin-transform-es2015-classes@^6.23.0, babel-plugin-transform-es2015-cla
     babel-traverse "^6.24.1"
     babel-types "^6.24.1"
 
-babel-plugin-transform-es2015-computed-properties@^6.22.0, babel-plugin-transform-es2015-computed-properties@^6.5.0, babel-plugin-transform-es2015-computed-properties@^6.8.0:
+babel-plugin-transform-es2015-computed-properties@^6.22.0:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-computed-properties/-/babel-plugin-transform-es2015-computed-properties-6.24.1.tgz#6fe2a8d16895d5634f4cd999b6d3480a308159b3"
   dependencies:
     babel-runtime "^6.22.0"
     babel-template "^6.24.1"
 
-babel-plugin-transform-es2015-destructuring@6.x, babel-plugin-transform-es2015-destructuring@^6.23.0, babel-plugin-transform-es2015-destructuring@^6.5.0, babel-plugin-transform-es2015-destructuring@^6.8.0:
+babel-plugin-transform-es2015-destructuring@^6.23.0:
   version "6.23.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-destructuring/-/babel-plugin-transform-es2015-destructuring-6.23.0.tgz#997bb1f1ab967f682d2b0876fe358d60e765c56d"
   dependencies:
@@ -3896,13 +3851,13 @@ babel-plugin-transform-es2015-duplicate-keys@^6.22.0:
     babel-runtime "^6.22.0"
     babel-types "^6.24.1"
 
-babel-plugin-transform-es2015-for-of@^6.23.0, babel-plugin-transform-es2015-for-of@^6.5.0, babel-plugin-transform-es2015-for-of@^6.8.0:
+babel-plugin-transform-es2015-for-of@^6.23.0:
   version "6.23.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-for-of/-/babel-plugin-transform-es2015-for-of-6.23.0.tgz#f47c95b2b613df1d3ecc2fdb7573623c75248691"
   dependencies:
     babel-runtime "^6.22.0"
 
-babel-plugin-transform-es2015-function-name@6.x, babel-plugin-transform-es2015-function-name@^6.22.0, babel-plugin-transform-es2015-function-name@^6.5.0, babel-plugin-transform-es2015-function-name@^6.8.0:
+babel-plugin-transform-es2015-function-name@^6.22.0:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-function-name/-/babel-plugin-transform-es2015-function-name-6.24.1.tgz#834c89853bc36b1af0f3a4c5dbaa94fd8eacaa8b"
   dependencies:
@@ -3910,7 +3865,7 @@ babel-plugin-transform-es2015-function-name@6.x, babel-plugin-transform-es2015-f
     babel-runtime "^6.22.0"
     babel-types "^6.24.1"
 
-babel-plugin-transform-es2015-literals@^6.22.0, babel-plugin-transform-es2015-literals@^6.5.0, babel-plugin-transform-es2015-literals@^6.8.0:
+babel-plugin-transform-es2015-literals@^6.22.0:
   version "6.22.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-literals/-/babel-plugin-transform-es2015-literals-6.22.0.tgz#4f54a02d6cd66cf915280019a31d31925377ca2e"
   dependencies:
@@ -3924,7 +3879,7 @@ babel-plugin-transform-es2015-modules-amd@^6.22.0, babel-plugin-transform-es2015
     babel-runtime "^6.22.0"
     babel-template "^6.24.1"
 
-babel-plugin-transform-es2015-modules-commonjs@6.x, babel-plugin-transform-es2015-modules-commonjs@^6.23.0, babel-plugin-transform-es2015-modules-commonjs@^6.24.1, babel-plugin-transform-es2015-modules-commonjs@^6.5.0, babel-plugin-transform-es2015-modules-commonjs@^6.8.0:
+babel-plugin-transform-es2015-modules-commonjs@^6.23.0, babel-plugin-transform-es2015-modules-commonjs@^6.24.1:
   version "6.26.2"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-modules-commonjs/-/babel-plugin-transform-es2015-modules-commonjs-6.26.2.tgz#58a793863a9e7ca870bdc5a881117ffac27db6f3"
   dependencies:
@@ -3949,14 +3904,14 @@ babel-plugin-transform-es2015-modules-umd@^6.23.0:
     babel-runtime "^6.22.0"
     babel-template "^6.24.1"
 
-babel-plugin-transform-es2015-object-super@^6.22.0, babel-plugin-transform-es2015-object-super@^6.8.0:
+babel-plugin-transform-es2015-object-super@^6.22.0:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-object-super/-/babel-plugin-transform-es2015-object-super-6.24.1.tgz#24cef69ae21cb83a7f8603dad021f572eb278f8d"
   dependencies:
     babel-helper-replace-supers "^6.24.1"
     babel-runtime "^6.22.0"
 
-babel-plugin-transform-es2015-parameters@6.x, babel-plugin-transform-es2015-parameters@^6.23.0, babel-plugin-transform-es2015-parameters@^6.5.0, babel-plugin-transform-es2015-parameters@^6.8.0:
+babel-plugin-transform-es2015-parameters@^6.23.0:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-parameters/-/babel-plugin-transform-es2015-parameters-6.24.1.tgz#57ac351ab49caf14a97cd13b09f66fdf0a625f2b"
   dependencies:
@@ -3967,20 +3922,20 @@ babel-plugin-transform-es2015-parameters@6.x, babel-plugin-transform-es2015-para
     babel-traverse "^6.24.1"
     babel-types "^6.24.1"
 
-babel-plugin-transform-es2015-shorthand-properties@6.x, babel-plugin-transform-es2015-shorthand-properties@^6.22.0, babel-plugin-transform-es2015-shorthand-properties@^6.5.0, babel-plugin-transform-es2015-shorthand-properties@^6.8.0:
+babel-plugin-transform-es2015-shorthand-properties@^6.22.0:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-shorthand-properties/-/babel-plugin-transform-es2015-shorthand-properties-6.24.1.tgz#24f875d6721c87661bbd99a4622e51f14de38aa0"
   dependencies:
     babel-runtime "^6.22.0"
     babel-types "^6.24.1"
 
-babel-plugin-transform-es2015-spread@6.x, babel-plugin-transform-es2015-spread@^6.22.0, babel-plugin-transform-es2015-spread@^6.5.0, babel-plugin-transform-es2015-spread@^6.8.0:
+babel-plugin-transform-es2015-spread@^6.22.0:
   version "6.22.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-spread/-/babel-plugin-transform-es2015-spread-6.22.0.tgz#d6d68a99f89aedc4536c81a542e8dd9f1746f8d1"
   dependencies:
     babel-runtime "^6.22.0"
 
-babel-plugin-transform-es2015-sticky-regex@6.x, babel-plugin-transform-es2015-sticky-regex@^6.22.0:
+babel-plugin-transform-es2015-sticky-regex@^6.22.0:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-sticky-regex/-/babel-plugin-transform-es2015-sticky-regex-6.24.1.tgz#00c1cdb1aca71112cdf0cf6126c2ed6b457ccdbc"
   dependencies:
@@ -3988,7 +3943,7 @@ babel-plugin-transform-es2015-sticky-regex@6.x, babel-plugin-transform-es2015-st
     babel-runtime "^6.22.0"
     babel-types "^6.24.1"
 
-babel-plugin-transform-es2015-template-literals@^6.22.0, babel-plugin-transform-es2015-template-literals@^6.5.0, babel-plugin-transform-es2015-template-literals@^6.8.0:
+babel-plugin-transform-es2015-template-literals@^6.22.0:
   version "6.22.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-template-literals/-/babel-plugin-transform-es2015-template-literals-6.22.0.tgz#a84b3450f7e9f8f1f6839d6d687da84bb1236d8d"
   dependencies:
@@ -4000,7 +3955,7 @@ babel-plugin-transform-es2015-typeof-symbol@^6.23.0:
   dependencies:
     babel-runtime "^6.22.0"
 
-babel-plugin-transform-es2015-unicode-regex@6.x, babel-plugin-transform-es2015-unicode-regex@^6.22.0:
+babel-plugin-transform-es2015-unicode-regex@^6.22.0:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-unicode-regex/-/babel-plugin-transform-es2015-unicode-regex-6.24.1.tgz#d38b12f42ea7323f729387f18a7c5ae1faeb35e9"
   dependencies:
@@ -4008,19 +3963,7 @@ babel-plugin-transform-es2015-unicode-regex@6.x, babel-plugin-transform-es2015-u
     babel-runtime "^6.22.0"
     regexpu-core "^2.0.0"
 
-babel-plugin-transform-es3-member-expression-literals@^6.8.0:
-  version "6.22.0"
-  resolved "https://registry.yarnpkg.com/babel-plugin-transform-es3-member-expression-literals/-/babel-plugin-transform-es3-member-expression-literals-6.22.0.tgz#733d3444f3ecc41bef8ed1a6a4e09657b8969ebb"
-  dependencies:
-    babel-runtime "^6.22.0"
-
-babel-plugin-transform-es3-property-literals@^6.8.0:
-  version "6.22.0"
-  resolved "https://registry.yarnpkg.com/babel-plugin-transform-es3-property-literals/-/babel-plugin-transform-es3-property-literals-6.22.0.tgz#b2078d5842e22abf40f73e8cde9cd3711abd5758"
-  dependencies:
-    babel-runtime "^6.22.0"
-
-babel-plugin-transform-exponentiation-operator@^6.22.0, babel-plugin-transform-exponentiation-operator@^6.5.0:
+babel-plugin-transform-exponentiation-operator@^6.22.0:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-exponentiation-operator/-/babel-plugin-transform-exponentiation-operator-6.24.1.tgz#2ab0c9c7f3098fa48907772bb813fe41e8de3a0e"
   dependencies:
@@ -4028,7 +3971,7 @@ babel-plugin-transform-exponentiation-operator@^6.22.0, babel-plugin-transform-e
     babel-plugin-syntax-exponentiation-operator "^6.8.0"
     babel-runtime "^6.22.0"
 
-babel-plugin-transform-flow-strip-types@^6.21.0, babel-plugin-transform-flow-strip-types@^6.22.0, babel-plugin-transform-flow-strip-types@^6.5.0, babel-plugin-transform-flow-strip-types@^6.8.0:
+babel-plugin-transform-flow-strip-types@^6.22.0:
   version "6.22.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-flow-strip-types/-/babel-plugin-transform-flow-strip-types-6.22.0.tgz#84cb672935d43714fdc32bce84568d87441cf7cf"
   dependencies:
@@ -4051,13 +3994,7 @@ babel-plugin-transform-minify-booleans@^6.9.4:
   version "6.9.4"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-minify-booleans/-/babel-plugin-transform-minify-booleans-6.9.4.tgz#acbb3e56a3555dd23928e4b582d285162dd2b198"
 
-babel-plugin-transform-object-assign@^6.5.0:
-  version "6.22.0"
-  resolved "https://registry.yarnpkg.com/babel-plugin-transform-object-assign/-/babel-plugin-transform-object-assign-6.22.0.tgz#f99d2f66f1a0b0d498e346c5359684740caa20ba"
-  dependencies:
-    babel-runtime "^6.22.0"
-
-babel-plugin-transform-object-rest-spread@^6.20.2, babel-plugin-transform-object-rest-spread@^6.23.0, babel-plugin-transform-object-rest-spread@^6.26.0, babel-plugin-transform-object-rest-spread@^6.5.0, babel-plugin-transform-object-rest-spread@^6.8.0:
+babel-plugin-transform-object-rest-spread@^6.23.0, babel-plugin-transform-object-rest-spread@^6.26.0:
   version "6.26.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-object-rest-spread/-/babel-plugin-transform-object-rest-spread-6.26.0.tgz#0f36692d50fef6b7e2d4b3ac1478137a963b7b06"
   dependencies:
@@ -4070,7 +4007,7 @@ babel-plugin-transform-property-literals@^6.9.4:
   dependencies:
     esutils "^2.0.2"
 
-babel-plugin-transform-react-display-name@^6.23.0, babel-plugin-transform-react-display-name@^6.5.0, babel-plugin-transform-react-display-name@^6.8.0:
+babel-plugin-transform-react-display-name@^6.23.0:
   version "6.25.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-react-display-name/-/babel-plugin-transform-react-display-name-6.25.0.tgz#67e2bf1f1e9c93ab08db96792e05392bf2cc28d1"
   dependencies:
@@ -4083,14 +4020,14 @@ babel-plugin-transform-react-jsx-self@^6.22.0:
     babel-plugin-syntax-jsx "^6.8.0"
     babel-runtime "^6.22.0"
 
-babel-plugin-transform-react-jsx-source@^6.22.0, babel-plugin-transform-react-jsx-source@^6.5.0:
+babel-plugin-transform-react-jsx-source@^6.22.0:
   version "6.22.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-react-jsx-source/-/babel-plugin-transform-react-jsx-source-6.22.0.tgz#66ac12153f5cd2d17b3c19268f4bf0197f44ecd6"
   dependencies:
     babel-plugin-syntax-jsx "^6.8.0"
     babel-runtime "^6.22.0"
 
-babel-plugin-transform-react-jsx@^6.24.1, babel-plugin-transform-react-jsx@^6.5.0, babel-plugin-transform-react-jsx@^6.8.0:
+babel-plugin-transform-react-jsx@^6.24.1:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-react-jsx/-/babel-plugin-transform-react-jsx-6.24.1.tgz#840a028e7df460dfc3a2d29f0c0d91f6376e66a3"
   dependencies:
@@ -4102,7 +4039,7 @@ babel-plugin-transform-react-remove-prop-types@0.4.20:
   version "0.4.20"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-react-remove-prop-types/-/babel-plugin-transform-react-remove-prop-types-0.4.20.tgz#688bdea1e27ea0023775dea817fa2d3f8df8802b"
 
-babel-plugin-transform-regenerator@^6.22.0, babel-plugin-transform-regenerator@^6.26.0, babel-plugin-transform-regenerator@^6.5.0:
+babel-plugin-transform-regenerator@^6.22.0, babel-plugin-transform-regenerator@^6.26.0:
   version "6.26.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-regenerator/-/babel-plugin-transform-regenerator-6.26.0.tgz#e0703696fbde27f0a3efcacf8b4dca2f7b3a8f2f"
   dependencies:
@@ -4196,53 +4133,6 @@ babel-preset-env@^1.7.0:
     invariant "^2.2.2"
     semver "^5.3.0"
 
-babel-preset-es2015-node@^6.1.1:
-  version "6.1.1"
-  resolved "https://registry.yarnpkg.com/babel-preset-es2015-node/-/babel-preset-es2015-node-6.1.1.tgz#60b23157024b0cfebf3a63554cb05ee035b4e55f"
-  dependencies:
-    babel-plugin-transform-es2015-destructuring "6.x"
-    babel-plugin-transform-es2015-function-name "6.x"
-    babel-plugin-transform-es2015-modules-commonjs "6.x"
-    babel-plugin-transform-es2015-parameters "6.x"
-    babel-plugin-transform-es2015-shorthand-properties "6.x"
-    babel-plugin-transform-es2015-spread "6.x"
-    babel-plugin-transform-es2015-sticky-regex "6.x"
-    babel-plugin-transform-es2015-unicode-regex "6.x"
-    semver "5.x"
-
-babel-preset-fbjs@^2.1.2, babel-preset-fbjs@^2.1.4:
-  version "2.3.0"
-  resolved "https://registry.yarnpkg.com/babel-preset-fbjs/-/babel-preset-fbjs-2.3.0.tgz#92ff81307c18b926895114f9828ae1674c097f80"
-  dependencies:
-    babel-plugin-check-es2015-constants "^6.8.0"
-    babel-plugin-syntax-class-properties "^6.8.0"
-    babel-plugin-syntax-flow "^6.8.0"
-    babel-plugin-syntax-jsx "^6.8.0"
-    babel-plugin-syntax-object-rest-spread "^6.8.0"
-    babel-plugin-syntax-trailing-function-commas "^6.8.0"
-    babel-plugin-transform-class-properties "^6.8.0"
-    babel-plugin-transform-es2015-arrow-functions "^6.8.0"
-    babel-plugin-transform-es2015-block-scoped-functions "^6.8.0"
-    babel-plugin-transform-es2015-block-scoping "^6.8.0"
-    babel-plugin-transform-es2015-classes "^6.8.0"
-    babel-plugin-transform-es2015-computed-properties "^6.8.0"
-    babel-plugin-transform-es2015-destructuring "^6.8.0"
-    babel-plugin-transform-es2015-for-of "^6.8.0"
-    babel-plugin-transform-es2015-function-name "^6.8.0"
-    babel-plugin-transform-es2015-literals "^6.8.0"
-    babel-plugin-transform-es2015-modules-commonjs "^6.8.0"
-    babel-plugin-transform-es2015-object-super "^6.8.0"
-    babel-plugin-transform-es2015-parameters "^6.8.0"
-    babel-plugin-transform-es2015-shorthand-properties "^6.8.0"
-    babel-plugin-transform-es2015-spread "^6.8.0"
-    babel-plugin-transform-es2015-template-literals "^6.8.0"
-    babel-plugin-transform-es3-member-expression-literals "^6.8.0"
-    babel-plugin-transform-es3-property-literals "^6.8.0"
-    babel-plugin-transform-flow-strip-types "^6.8.0"
-    babel-plugin-transform-object-rest-spread "^6.8.0"
-    babel-plugin-transform-react-display-name "^6.8.0"
-    babel-plugin-transform-react-jsx "^6.8.0"
-
 babel-preset-flow@^6.23.0:
   version "6.23.0"
   resolved "https://registry.yarnpkg.com/babel-preset-flow/-/babel-preset-flow-6.23.0.tgz#e71218887085ae9a24b5be4169affb599816c49d"
@@ -4315,43 +4205,6 @@ babel-preset-react-app@^7.0.0:
     babel-plugin-macros "2.4.2"
     babel-plugin-transform-react-remove-prop-types "0.4.20"
 
-babel-preset-react-native@^4.0.0:
-  version "4.0.1"
-  resolved "https://registry.yarnpkg.com/babel-preset-react-native/-/babel-preset-react-native-4.0.1.tgz#14ff07bdb6c8df9408082c0c18b2ce8e3392e76a"
-  dependencies:
-    babel-plugin-check-es2015-constants "^6.5.0"
-    babel-plugin-react-transform "^3.0.0"
-    babel-plugin-syntax-async-functions "^6.5.0"
-    babel-plugin-syntax-class-properties "^6.5.0"
-    babel-plugin-syntax-dynamic-import "^6.18.0"
-    babel-plugin-syntax-flow "^6.5.0"
-    babel-plugin-syntax-jsx "^6.5.0"
-    babel-plugin-syntax-trailing-function-commas "^6.5.0"
-    babel-plugin-transform-class-properties "^6.5.0"
-    babel-plugin-transform-es2015-arrow-functions "^6.5.0"
-    babel-plugin-transform-es2015-block-scoping "^6.5.0"
-    babel-plugin-transform-es2015-classes "^6.5.0"
-    babel-plugin-transform-es2015-computed-properties "^6.5.0"
-    babel-plugin-transform-es2015-destructuring "^6.5.0"
-    babel-plugin-transform-es2015-for-of "^6.5.0"
-    babel-plugin-transform-es2015-function-name "^6.5.0"
-    babel-plugin-transform-es2015-literals "^6.5.0"
-    babel-plugin-transform-es2015-modules-commonjs "^6.5.0"
-    babel-plugin-transform-es2015-parameters "^6.5.0"
-    babel-plugin-transform-es2015-shorthand-properties "^6.5.0"
-    babel-plugin-transform-es2015-spread "^6.5.0"
-    babel-plugin-transform-es2015-template-literals "^6.5.0"
-    babel-plugin-transform-exponentiation-operator "^6.5.0"
-    babel-plugin-transform-flow-strip-types "^6.5.0"
-    babel-plugin-transform-object-assign "^6.5.0"
-    babel-plugin-transform-object-rest-spread "^6.5.0"
-    babel-plugin-transform-react-display-name "^6.5.0"
-    babel-plugin-transform-react-jsx "^6.5.0"
-    babel-plugin-transform-react-jsx-source "^6.5.0"
-    babel-plugin-transform-regenerator "^6.5.0"
-    babel-template "^6.24.1"
-    react-transform-hmr "^1.0.4"
-
 babel-preset-react@^6.24.1:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-preset-react/-/babel-preset-react-6.24.1.tgz#ba69dfaea45fc3ec639b6a4ecea6e17702c91380"
@@ -4373,7 +4226,7 @@ babel-preset-vue@^2.0.2:
     babel-plugin-syntax-jsx "^6.18.0"
     babel-plugin-transform-vue-jsx "^3.5.0"
 
-babel-register@^6.24.1, babel-register@^6.26.0:
+babel-register@^6.26.0:
   version "6.26.0"
   resolved "https://registry.yarnpkg.com/babel-register/-/babel-register-6.26.0.tgz#6ed021173e2fcb486d7acb45c6009a856f647071"
   dependencies:
@@ -4385,7 +4238,7 @@ babel-register@^6.24.1, babel-register@^6.26.0:
     mkdirp "^0.5.1"
     source-map-support "^0.4.15"
 
-babel-runtime@^6.0.0, babel-runtime@^6.18.0, babel-runtime@^6.22.0, babel-runtime@^6.23.0, babel-runtime@^6.26.0:
+babel-runtime@^6.18.0, babel-runtime@^6.22.0, babel-runtime@^6.26.0:
   version "6.26.0"
   resolved "https://registry.yarnpkg.com/babel-runtime/-/babel-runtime-6.26.0.tgz#965c7058668e82b55d7bfe04ff2337bc8b5647fe"
   dependencies:
@@ -4455,22 +4308,10 @@ base64-arraybuffer@0.1.5:
   version "0.1.5"
   resolved "https://registry.yarnpkg.com/base64-arraybuffer/-/base64-arraybuffer-0.1.5.tgz#73926771923b5a19747ad666aa5cd4bf9c6e9ce8"
 
-base64-js@0.0.8:
-  version "0.0.8"
-  resolved "https://registry.yarnpkg.com/base64-js/-/base64-js-0.0.8.tgz#1101e9544f4a76b1bc3b26d452ca96d7a35e7978"
-
-base64-js@1.1.2:
-  version "1.1.2"
-  resolved "https://registry.yarnpkg.com/base64-js/-/base64-js-1.1.2.tgz#d6400cac1c4c660976d90d07a04351d89395f5e8"
-
-base64-js@^1.0.2, base64-js@^1.1.2:
+base64-js@^1.0.2:
   version "1.3.0"
   resolved "https://registry.yarnpkg.com/base64-js/-/base64-js-1.3.0.tgz#cab1e6118f051095e58b5281aea8c1cd22bfc0e3"
 
-base64-url@1.2.1:
-  version "1.2.1"
-  resolved "https://registry.yarnpkg.com/base64-url/-/base64-url-1.2.1.tgz#199fd661702a0e7b7dcae6e0698bb089c52f6d78"
-
 base64id@1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/base64id/-/base64id-1.0.0.tgz#47688cb99bb6804f0e06d3e763b1c32e57d8e6b6"
@@ -4487,28 +4328,16 @@ base@^0.11.1:
     mixin-deep "^1.2.0"
     pascalcase "^0.1.1"
 
-basic-auth-connect@1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/basic-auth-connect/-/basic-auth-connect-1.0.0.tgz#fdb0b43962ca7b40456a7c2bb48fe173da2d2122"
-
 basic-auth-parser@0.0.2:
   version "0.0.2"
   resolved "https://registry.yarnpkg.com/basic-auth-parser/-/basic-auth-parser-0.0.2.tgz#ce9e71a77f23c1279eecd2659b2a46244c156e41"
 
-basic-auth@~1.0.3:
-  version "1.0.4"
-  resolved "https://registry.yarnpkg.com/basic-auth/-/basic-auth-1.0.4.tgz#030935b01de7c9b94a824b29f3fccb750d3a5290"
-
 basic-auth@~2.0.0:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/basic-auth/-/basic-auth-2.0.1.tgz#b998279bf47ce38344b4f3cf916d4679bbf51e3a"
   dependencies:
     safe-buffer "5.1.2"
 
-batch@0.5.3:
-  version "0.5.3"
-  resolved "https://registry.yarnpkg.com/batch/-/batch-0.5.3.tgz#3f3414f380321743bfc1042f9a83ff1d5824d464"
-
 batch@0.6.1:
   version "0.6.1"
   resolved "https://registry.yarnpkg.com/batch/-/batch-0.6.1.tgz#dc34314f4e679318093fc760272525f94bf25c16"
@@ -4538,10 +4367,6 @@ bfj@6.1.1:
     hoopy "^0.1.2"
     tryer "^1.0.0"
 
-big-integer@^1.6.7:
-  version "1.6.40"
-  resolved "https://registry.yarnpkg.com/big-integer/-/big-integer-1.6.40.tgz#02e4cd4d6e266c4d9ece2469c05cb6439149fc78"
-
 big.js@^3.1.3:
   version "3.2.0"
   resolved "https://registry.yarnpkg.com/big.js/-/big.js-3.2.0.tgz#a5fc298b81b9e0dca2e458824784b65c52ba588e"
@@ -4618,21 +4443,6 @@ body-parser@1.18.3:
     raw-body "2.3.3"
     type-is "~1.6.16"
 
-body-parser@~1.13.3:
-  version "1.13.3"
-  resolved "https://registry.yarnpkg.com/body-parser/-/body-parser-1.13.3.tgz#c08cf330c3358e151016a05746f13f029c97fa97"
-  dependencies:
-    bytes "2.1.0"
-    content-type "~1.0.1"
-    debug "~2.2.0"
-    depd "~1.0.1"
-    http-errors "~1.3.1"
-    iconv-lite "0.4.11"
-    on-finished "~2.3.0"
-    qs "4.0.0"
-    raw-body "~2.1.2"
-    type-is "~1.6.6"
-
 body@^5.1.0:
   version "5.1.0"
   resolved "https://registry.yarnpkg.com/body/-/body-5.1.0.tgz#e4ba0ce410a46936323367609ecb4e6553125069"
@@ -4695,18 +4505,6 @@ boxen@^2.1.0:
     term-size "^1.2.0"
     widest-line "^2.0.0"
 
-bplist-creator@0.0.7:
-  version "0.0.7"
-  resolved "https://registry.yarnpkg.com/bplist-creator/-/bplist-creator-0.0.7.tgz#37df1536092824b87c42f957b01344117372ae45"
-  dependencies:
-    stream-buffers "~2.2.0"
-
-bplist-parser@0.1.1:
-  version "0.1.1"
-  resolved "https://registry.yarnpkg.com/bplist-parser/-/bplist-parser-0.1.1.tgz#d60d5dcc20cba6dc7e1f299b35d3e1f95dafbae6"
-  dependencies:
-    big-integer "^1.6.7"
-
 brace-expansion@^1.1.7:
   version "1.1.11"
   resolved "https://registry.yarnpkg.com/brace-expansion/-/brace-expansion-1.1.11.tgz#3c7fcbf529d87226f3d2f52b966ff5271eb441dd"
@@ -5422,14 +5220,6 @@ bytes@1:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/bytes/-/bytes-1.0.0.tgz#3569ede8ba34315fab99c3e92cb04c7220de1fa8"
 
-bytes@2.1.0:
-  version "2.1.0"
-  resolved "https://registry.yarnpkg.com/bytes/-/bytes-2.1.0.tgz#ac93c410e2ffc9cc7cf4b464b38289067f5e47b4"
-
-bytes@2.4.0:
-  version "2.4.0"
-  resolved "https://registry.yarnpkg.com/bytes/-/bytes-2.4.0.tgz#7d97196f9d5baf7f6935e25985549edd2a6c2339"
-
 bytes@3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/bytes/-/bytes-3.0.0.tgz#d32815404d689699f85a4ea4fa8755dd13a96048"
@@ -5691,10 +5481,6 @@ character-reference-invalid@^1.0.0:
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/character-reference-invalid/-/character-reference-invalid-1.1.2.tgz#21e421ad3d84055952dab4a43a04e73cd425d3ed"
 
-chardet@^0.4.0:
-  version "0.4.2"
-  resolved "https://registry.yarnpkg.com/chardet/-/chardet-0.4.2.tgz#b5473b33dc97c424e5d98dc87d55d4d8a29c8bf2"
-
 chardet@^0.7.0:
   version "0.7.0"
   resolved "https://registry.yarnpkg.com/chardet/-/chardet-0.7.0.tgz#90094849f0937f2eedc2425d0d28a9e5f0cbad9e"
@@ -5903,13 +5689,6 @@ clipboard@^2.0.0:
     select "^1.1.2"
     tiny-emitter "^2.0.0"
 
-clipboardy@^1.2.2:
-  version "1.2.3"
-  resolved "https://registry.yarnpkg.com/clipboardy/-/clipboardy-1.2.3.tgz#0526361bf78724c1f20be248d428e365433c07ef"
-  dependencies:
-    arch "^2.1.0"
-    execa "^0.8.0"
-
 cliui@^3.2.0:
   version "3.2.0"
   resolved "https://registry.yarnpkg.com/cliui/-/cliui-3.2.0.tgz#120601537a916d29940f934da3b48d585a39213d"
@@ -6048,10 +5827,6 @@ color-string@^1.5.2:
     color-name "^1.0.0"
     simple-swizzle "^0.2.2"
 
-color-support@^1.1.3:
-  version "1.1.3"
-  resolved "https://registry.yarnpkg.com/color-support/-/color-support-1.1.3.tgz#93834379a1cc9a0c61f82f52f0d04322251bd5a2"
-
 color@^3.0.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/color/-/color-3.1.0.tgz#d8e9fb096732875774c84bf922815df0308d0ffc"
@@ -6154,7 +5929,7 @@ component-inherit@0.0.3:
   version "0.0.3"
   resolved "https://registry.yarnpkg.com/component-inherit/-/component-inherit-0.0.3.tgz#645fc4adf58b72b649d5cae65135619db26ff143"
 
-compressible@~2.0.14, compressible@~2.0.5:
+compressible@~2.0.14:
   version "2.0.15"
   resolved "https://registry.yarnpkg.com/compressible/-/compressible-2.0.15.tgz#857a9ab0a7e5a07d8d837ed43fe2defff64fe212"
   dependencies:
@@ -6172,17 +5947,6 @@ compression@^1.5.2, compression@^1.7.3:
     safe-buffer "5.1.2"
     vary "~1.1.2"
 
-compression@~1.5.2:
-  version "1.5.2"
-  resolved "https://registry.yarnpkg.com/compression/-/compression-1.5.2.tgz#b03b8d86e6f8ad29683cba8df91ddc6ffc77b395"
-  dependencies:
-    accepts "~1.2.12"
-    bytes "2.1.0"
-    compressible "~2.0.5"
-    debug "~2.2.0"
-    on-headers "~1.0.0"
-    vary "~1.0.1"
-
 concat-map@0.0.1:
   version "0.0.1"
   resolved "https://registry.yarnpkg.com/concat-map/-/concat-map-0.0.1.tgz#d8a96bd77fd68df7793a73036a3ba0d5405d477b"
@@ -6247,52 +6011,7 @@ connect-history-api-fallback@^1.3.0:
   version "1.6.0"
   resolved "https://registry.yarnpkg.com/connect-history-api-fallback/-/connect-history-api-fallback-1.6.0.tgz#8b32089359308d111115d81cad3fceab888f97bc"
 
-connect-timeout@~1.6.2:
-  version "1.6.2"
-  resolved "https://registry.yarnpkg.com/connect-timeout/-/connect-timeout-1.6.2.tgz#de9a5ec61e33a12b6edaab7b5f062e98c599b88e"
-  dependencies:
-    debug "~2.2.0"
-    http-errors "~1.3.1"
-    ms "0.7.1"
-    on-headers "~1.0.0"
-
-connect@^2.8.3:
-  version "2.30.2"
-  resolved "https://registry.yarnpkg.com/connect/-/connect-2.30.2.tgz#8da9bcbe8a054d3d318d74dfec903b5c39a1b609"
-  dependencies:
-    basic-auth-connect "1.0.0"
-    body-parser "~1.13.3"
-    bytes "2.1.0"
-    compression "~1.5.2"
-    connect-timeout "~1.6.2"
-    content-type "~1.0.1"
-    cookie "0.1.3"
-    cookie-parser "~1.3.5"
-    cookie-signature "1.0.6"
-    csurf "~1.8.3"
-    debug "~2.2.0"
-    depd "~1.0.1"
-    errorhandler "~1.4.2"
-    express-session "~1.11.3"
-    finalhandler "0.4.0"
-    fresh "0.3.0"
-    http-errors "~1.3.1"
-    method-override "~2.3.5"
-    morgan "~1.6.1"
-    multiparty "3.3.2"
-    on-headers "~1.0.0"
-    parseurl "~1.3.0"
-    pause "0.1.0"
-    qs "4.0.0"
-    response-time "~2.3.1"
-    serve-favicon "~2.3.0"
-    serve-index "~1.7.2"
-    serve-static "~1.10.0"
-    type-is "~1.6.6"
-    utils-merge "1.0.0"
-    vhost "~3.0.1"
-
-connect@^3.6.5, connect@^3.6.6:
+connect@^3.6.6:
   version "3.6.6"
   resolved "https://registry.yarnpkg.com/connect/-/connect-3.6.6.tgz#09eff6c55af7236e137135a72574858b6786f524"
   dependencies:
@@ -6340,7 +6059,7 @@ content-disposition@0.5.2:
   version "0.5.2"
   resolved "https://registry.yarnpkg.com/content-disposition/-/content-disposition-0.5.2.tgz#0cf68bb9ddf5f2be7961c3a85178cb85dba78cb4"
 
-content-type@^1.0.4, content-type@~1.0.1, content-type@~1.0.4:
+content-type@^1.0.4, content-type@~1.0.4:
   version "1.0.4"
   resolved "https://registry.yarnpkg.com/content-type/-/content-type-1.0.4.tgz#e138cc75e040c727b1966fe5e5f8c9aee256fe3b"
 
@@ -6434,21 +6153,10 @@ convert-source-map@~1.1.0:
   version "1.1.3"
   resolved "https://registry.yarnpkg.com/convert-source-map/-/convert-source-map-1.1.3.tgz#4829c877e9fe49b3161f3bf3673888e204699860"
 
-cookie-parser@~1.3.5:
-  version "1.3.5"
-  resolved "https://registry.yarnpkg.com/cookie-parser/-/cookie-parser-1.3.5.tgz#9d755570fb5d17890771227a02314d9be7cf8356"
-  dependencies:
-    cookie "0.1.3"
-    cookie-signature "1.0.6"
-
 cookie-signature@1.0.6:
   version "1.0.6"
   resolved "https://registry.yarnpkg.com/cookie-signature/-/cookie-signature-1.0.6.tgz#e303a882b342cc3ee8ca513a79999734dab3ae2c"
 
-cookie@0.1.3:
-  version "0.1.3"
-  resolved "https://registry.yarnpkg.com/cookie/-/cookie-0.1.3.tgz#e734a5c1417fce472d5aef82c381cabb64d1a435"
-
 cookie@0.3.1:
   version "0.3.1"
   resolved "https://registry.yarnpkg.com/cookie/-/cookie-0.3.1.tgz#e7e0a1f9ef43b4c8ba925c5c5a96e806d16873bb"
@@ -6512,7 +6220,7 @@ core-js@^1.0.0:
   version "1.2.7"
   resolved "https://registry.yarnpkg.com/core-js/-/core-js-1.2.7.tgz#652294c14651db28fa93bd2d5ff2983a4f08c636"
 
-core-js@^2.2.2, core-js@^2.4.0, core-js@^2.4.1, core-js@^2.5.0, core-js@^2.5.7, core-js@^2.6.2:
+core-js@^2.4.0, core-js@^2.5.0, core-js@^2.5.7, core-js@^2.6.2:
   version "2.6.2"
   resolved "https://registry.yarnpkg.com/core-js/-/core-js-2.6.2.tgz#267988d7268323b349e20b4588211655f0e83944"
 
@@ -6568,10 +6276,6 @@ cosmiconfig@^5.0.0, cosmiconfig@^5.0.2, cosmiconfig@^5.0.5, cosmiconfig@^5.0.6,
     js-yaml "^3.9.0"
     parse-json "^4.0.0"
 
-crc@3.3.0:
-  version "3.3.0"
-  resolved "https://registry.yarnpkg.com/crc/-/crc-3.3.0.tgz#fa622e1bc388bf257309082d6b65200ce67090ba"
-
 create-ecdh@^4.0.0:
   version "4.0.3"
   resolved "https://registry.yarnpkg.com/create-ecdh/-/create-ecdh-4.0.3.tgz#c9111b6f33045c4697f144787f9254cdc77c45ff"
@@ -6618,14 +6322,6 @@ create-hmac@^1.1.0, create-hmac@^1.1.2, create-hmac@^1.1.4:
     safe-buffer "^5.0.1"
     sha.js "^2.4.8"
 
-create-react-class@^15.5.2:
-  version "15.6.3"
-  resolved "https://registry.yarnpkg.com/create-react-class/-/create-react-class-15.6.3.tgz#2d73237fb3f970ae6ebe011a9e66f46dbca80036"
-  dependencies:
-    fbjs "^0.8.9"
-    loose-envify "^1.3.1"
-    object-assign "^4.1.1"
-
 create-react-context@<=0.2.2:
   version "0.2.2"
   resolved "https://registry.yarnpkg.com/create-react-context/-/create-react-context-0.2.2.tgz#9836542f9aaa22868cd7d4a6f82667df38019dca"
@@ -6678,7 +6374,7 @@ cross-spawn@^4.0.2:
     lru-cache "^4.0.1"
     which "^1.2.9"
 
-cross-spawn@^5.0.1, cross-spawn@^5.1.0:
+cross-spawn@^5.0.1:
   version "5.1.0"
   resolved "https://registry.yarnpkg.com/cross-spawn/-/cross-spawn-5.1.0.tgz#e8bd0efee58fcff6f8f94510a0a554bbfa235449"
   dependencies:
@@ -6706,14 +6402,6 @@ crypto-random-string@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/crypto-random-string/-/crypto-random-string-1.0.0.tgz#a230f64f568310e1498009940790ec99545bca7e"
 
-csrf@~3.0.0:
-  version "3.0.6"
-  resolved "https://registry.yarnpkg.com/csrf/-/csrf-3.0.6.tgz#b61120ddceeafc91e76ed5313bb5c0b2667b710a"
-  dependencies:
-    rndm "1.2.0"
-    tsscmp "1.0.5"
-    uid-safe "2.1.4"
-
 css-color-names@0.0.4, css-color-names@^0.0.4:
   version "0.0.4"
   resolved "https://registry.yarnpkg.com/css-color-names/-/css-color-names-0.0.4.tgz#808adc2e79cf84738069b646cb20ec27beb629e0"
@@ -6926,15 +6614,6 @@ csstype@^2.2.0, csstype@^2.5.2, csstype@^2.5.7:
   version "2.6.0"
   resolved "https://registry.yarnpkg.com/csstype/-/csstype-2.6.0.tgz#6cf7b2fa7fc32aab3d746802c244d4eda71371a2"
 
-csurf@~1.8.3:
-  version "1.8.3"
-  resolved "https://registry.yarnpkg.com/csurf/-/csurf-1.8.3.tgz#23f2a13bf1d8fce1d0c996588394442cba86a56a"
-  dependencies:
-    cookie "0.1.3"
-    cookie-signature "1.0.6"
-    csrf "~3.0.0"
-    http-errors "~1.3.1"
-
 currently-unhandled@^0.4.1:
   version "0.4.1"
   resolved "https://registry.yarnpkg.com/currently-unhandled/-/currently-unhandled-0.4.1.tgz#988df33feab191ef799a61369dd76c17adf957ea"
@@ -7063,12 +6742,6 @@ debug@^3.0.1, debug@^3.1.0, debug@^3.2.5:
   dependencies:
     ms "^2.1.1"
 
-debug@~2.2.0:
-  version "2.2.0"
-  resolved "https://registry.yarnpkg.com/debug/-/debug-2.2.0.tgz#f87057e995b1a1f6ae6a4960664137bc56f039da"
-  dependencies:
-    ms "0.7.1"
-
 debuglog@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/debuglog/-/debuglog-1.0.1.tgz#aa24ffb9ac3df9a2351837cfb2d279360cd78492"
@@ -7217,11 +6890,7 @@ denodeify@^1.2.1:
   version "1.2.1"
   resolved "https://registry.yarnpkg.com/denodeify/-/denodeify-1.2.1.tgz#3a36287f5034e699e7577901052c2e6c94251631"
 
-depd@~1.0.1:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/depd/-/depd-1.0.1.tgz#80aec64c9d6d97e65cc2a9caa93c0aa6abf73aaa"
-
-depd@~1.1.0, depd@~1.1.2:
+depd@~1.1.2:
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/depd/-/depd-1.1.2.tgz#9bcd52e14c097763e749b274c4346ed2e560b5a9"
 
@@ -8038,16 +7707,6 @@ env-ci@^2.1.0:
     execa "^1.0.0"
     java-properties "^0.2.9"
 
-envinfo@^3.0.0:
-  version "3.11.1"
-  resolved "https://registry.yarnpkg.com/envinfo/-/envinfo-3.11.1.tgz#45968faf5079aa797b7dcdc3b123f340d4529e1c"
-  dependencies:
-    clipboardy "^1.2.2"
-    glob "^7.1.2"
-    minimist "^1.2.0"
-    os-name "^2.0.1"
-    which "^1.2.14"
-
 enzyme-adapter-react-16@^1.9.1:
   version "1.9.1"
   resolved "https://registry.yarnpkg.com/enzyme-adapter-react-16/-/enzyme-adapter-react-16-1.9.1.tgz#6d49a3a31c3a0fccf527610f31b837e0f307128a"
@@ -8137,13 +7796,6 @@ error@^7.0.0:
     string-template "~0.2.1"
     xtend "~4.0.0"
 
-errorhandler@~1.4.2:
-  version "1.4.3"
-  resolved "https://registry.yarnpkg.com/errorhandler/-/errorhandler-1.4.3.tgz#b7b70ed8f359e9db88092f2d20c0f831420ad83f"
-  dependencies:
-    accepts "~1.3.0"
-    escape-html "~1.0.3"
-
 es-abstract@^1.10.0, es-abstract@^1.11.0, es-abstract@^1.12.0, es-abstract@^1.4.3, es-abstract@^1.5.0, es-abstract@^1.5.1, es-abstract@^1.7.0, es-abstract@^1.9.0:
   version "1.13.0"
   resolved "https://registry.yarnpkg.com/es-abstract/-/es-abstract-1.13.0.tgz#ac86145fdd5099d8dd49558ccba2eaf9b88e24e9"
@@ -8215,10 +7867,6 @@ es6-templates@^0.2.3:
     recast "~0.11.12"
     through "~2.3.6"
 
-escape-html@1.0.2:
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/escape-html/-/escape-html-1.0.2.tgz#d77d32fa98e38c2f41ae85e9278e0e0e6ba1022c"
-
 escape-html@^1.0.3, escape-html@~1.0.3:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/escape-html/-/escape-html-1.0.3.tgz#0258eae4d3d0c0974de1c169188ef0051d1d1988"
@@ -8614,18 +8262,10 @@ esutils@^2.0.0, esutils@^2.0.2:
   version "2.0.2"
   resolved "https://registry.yarnpkg.com/esutils/-/esutils-2.0.2.tgz#0abf4f1caa5bcb1f7a9d8acc6dea4faaa04bac9b"
 
-etag@~1.7.0:
-  version "1.7.0"
-  resolved "https://registry.yarnpkg.com/etag/-/etag-1.7.0.tgz#03d30b5f67dd6e632d2945d30d6652731a34d5d8"
-
 etag@~1.8.1:
   version "1.8.1"
   resolved "https://registry.yarnpkg.com/etag/-/etag-1.8.1.tgz#41ae2eeb65efa62268aebfea83ac7d79299b0887"
 
-event-target-shim@^1.0.5:
-  version "1.1.1"
-  resolved "https://registry.yarnpkg.com/event-target-shim/-/event-target-shim-1.1.1.tgz#a86e5ee6bdaa16054475da797ccddf0c55698491"
-
 eventemitter3@^3.0.0, eventemitter3@^3.1.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/eventemitter3/-/eventemitter3-3.1.0.tgz#090b4d6cdbd645ed10bf750d4b5407942d7ba163"
@@ -8713,18 +8353,6 @@ execa@^0.7.0:
     signal-exit "^3.0.0"
     strip-eof "^1.0.0"
 
-execa@^0.8.0:
-  version "0.8.0"
-  resolved "https://registry.yarnpkg.com/execa/-/execa-0.8.0.tgz#d8d76bbc1b55217ed190fd6dd49d3c774ecfc8da"
-  dependencies:
-    cross-spawn "^5.0.1"
-    get-stream "^3.0.0"
-    is-stream "^1.1.0"
-    npm-run-path "^2.0.0"
-    p-finally "^1.0.0"
-    signal-exit "^3.0.0"
-    strip-eof "^1.0.0"
-
 execa@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/execa/-/execa-1.0.0.tgz#c6236a5bb4df6d6f15e88e7f017798216749ddd8"
@@ -8817,20 +8445,6 @@ express-graphql@^0.7.1:
     http-errors "^1.7.1"
     raw-body "^2.3.3"
 
-express-session@~1.11.3:
-  version "1.11.3"
-  resolved "https://registry.yarnpkg.com/express-session/-/express-session-1.11.3.tgz#5cc98f3f5ff84ed835f91cbf0aabd0c7107400af"
-  dependencies:
-    cookie "0.1.3"
-    cookie-signature "1.0.6"
-    crc "3.3.0"
-    debug "~2.2.0"
-    depd "~1.0.1"
-    on-headers "~1.0.0"
-    parseurl "~1.3.0"
-    uid-safe "~2.0.0"
-    utils-merge "1.0.0"
-
 express@^4.10.7, express@^4.16.2, express@^4.16.3:
   version "4.16.4"
   resolved "https://registry.yarnpkg.com/express/-/express-4.16.4.tgz#fddef61926109e24c515ea97fd2f1bdbf62df12e"
@@ -8866,12 +8480,6 @@ express@^4.10.7, express@^4.16.2, express@^4.16.3:
     utils-merge "1.0.1"
     vary "~1.1.2"
 
-extend-shallow@^1.1.2:
-  version "1.1.4"
-  resolved "https://registry.yarnpkg.com/extend-shallow/-/extend-shallow-1.1.4.tgz#19d6bf94dfc09d76ba711f39b872d21ff4dd9071"
-  dependencies:
-    kind-of "^1.1.0"
-
 extend-shallow@^2.0.1:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/extend-shallow/-/extend-shallow-2.0.1.tgz#51af7d614ad9a9f610ea1bafbb989d6b1c56890f"
@@ -8897,14 +8505,6 @@ external-editor@^1.1.0:
     spawn-sync "^1.0.15"
     tmp "^0.0.29"
 
-external-editor@^2.0.4:
-  version "2.2.0"
-  resolved "https://registry.yarnpkg.com/external-editor/-/external-editor-2.2.0.tgz#045511cfd8d133f3846673d1047c154e214ad3d5"
-  dependencies:
-    chardet "^0.4.0"
-    iconv-lite "^0.4.17"
-    tmp "^0.0.33"
-
 external-editor@^3.0.0:
   version "3.0.3"
   resolved "https://registry.yarnpkg.com/external-editor/-/external-editor-3.0.3.tgz#5866db29a97826dbe4bf3afd24070ead9ea43a27"
@@ -8949,15 +8549,6 @@ extsprintf@^1.2.0:
   version "1.4.0"
   resolved "https://registry.yarnpkg.com/extsprintf/-/extsprintf-1.4.0.tgz#e2689f8f356fad62cca65a3a91c5df5f9551692f"
 
-fancy-log@^1.3.2:
-  version "1.3.3"
-  resolved "https://registry.yarnpkg.com/fancy-log/-/fancy-log-1.3.3.tgz#dbc19154f558690150a23953a0adbd035be45fc7"
-  dependencies:
-    ansi-gray "^0.1.1"
-    color-support "^1.1.3"
-    parse-node-version "^1.0.0"
-    time-stamp "^1.0.0"
-
 fashion-model-defaults@^1.0.1:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/fashion-model-defaults/-/fashion-model-defaults-1.1.1.tgz#ef556cbe1616161a66d83e472794592c65f129a8"
@@ -9047,22 +8638,7 @@ fb-watchman@^2.0.0:
   dependencies:
     bser "^2.0.0"
 
-fbjs-scripts@^0.8.1:
-  version "0.8.3"
-  resolved "https://registry.yarnpkg.com/fbjs-scripts/-/fbjs-scripts-0.8.3.tgz#b854de7a11e62a37f72dab9aaf4d9b53c4a03174"
-  dependencies:
-    ansi-colors "^1.0.1"
-    babel-core "^6.7.2"
-    babel-preset-fbjs "^2.1.2"
-    core-js "^2.4.1"
-    cross-spawn "^5.1.0"
-    fancy-log "^1.3.2"
-    object-assign "^4.0.1"
-    plugin-error "^0.1.2"
-    semver "^5.1.0"
-    through2 "^2.0.0"
-
-fbjs@^0.8.0, fbjs@^0.8.1, fbjs@^0.8.14, fbjs@^0.8.4, fbjs@^0.8.9:
+fbjs@^0.8.0, fbjs@^0.8.1, fbjs@^0.8.4:
   version "0.8.17"
   resolved "https://registry.yarnpkg.com/fbjs/-/fbjs-0.8.17.tgz#c4d598ead6949112653d6588b01a5cdcd9f90fdd"
   dependencies:
@@ -9167,15 +8743,6 @@ fill-range@^4.0.0:
     repeat-string "^1.6.1"
     to-regex-range "^2.1.0"
 
-finalhandler@0.4.0:
-  version "0.4.0"
-  resolved "https://registry.yarnpkg.com/finalhandler/-/finalhandler-0.4.0.tgz#965a52d9e8d05d2b857548541fb89b53a2497d9b"
-  dependencies:
-    debug "~2.2.0"
-    escape-html "1.0.2"
-    on-finished "~2.3.0"
-    unpipe "~1.0.0"
-
 finalhandler@1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/finalhandler/-/finalhandler-1.1.0.tgz#ce0b6855b45853e791b2fcc680046d88253dd7f5"
@@ -9422,10 +8989,6 @@ fragment-cache@^0.2.1:
   dependencies:
     map-cache "^0.2.2"
 
-fresh@0.3.0:
-  version "0.3.0"
-  resolved "https://registry.yarnpkg.com/fresh/-/fresh-0.3.0.tgz#651f838e22424e7566de161d8358caa199f83d4f"
-
 fresh@0.5.2:
   version "0.5.2"
   resolved "https://registry.yarnpkg.com/fresh/-/fresh-0.5.2.tgz#3d8cadd90d976569fa835ab1f8e4b23a105605a7"
@@ -9476,14 +9039,6 @@ fs-extra@^0.30.0:
     path-is-absolute "^1.0.0"
     rimraf "^2.2.8"
 
-fs-extra@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/fs-extra/-/fs-extra-1.0.0.tgz#cd3ce5f7e7cb6145883fcae3191e9877f8587950"
-  dependencies:
-    graceful-fs "^4.1.2"
-    jsonfile "^2.1.0"
-    klaw "^1.0.0"
-
 fs-extra@^4.0.2, fs-extra@^4.0.3:
   version "4.0.3"
   resolved "https://registry.yarnpkg.com/fs-extra/-/fs-extra-4.0.3.tgz#0d852122e5bc5beb453fb028e9c0c9bf36340c94"
@@ -9624,16 +9179,6 @@ g-status@^2.0.2:
     matcher "^1.0.0"
     simple-git "^1.85.0"
 
-gauge@~1.2.5:
-  version "1.2.7"
-  resolved "https://registry.yarnpkg.com/gauge/-/gauge-1.2.7.tgz#e9cec5483d3d4ee0ef44b60a7d99e4935e136d93"
-  dependencies:
-    ansi "^0.3.0"
-    has-unicode "^2.0.0"
-    lodash.pad "^4.1.0"
-    lodash.padend "^4.1.0"
-    lodash.padstart "^4.1.0"
-
 gauge@~2.7.3:
   version "2.7.4"
   resolved "https://registry.yarnpkg.com/gauge/-/gauge-2.7.4.tgz#2c03405c7538c39d7eb37b317022e325fb018bf7"
@@ -9875,7 +9420,7 @@ global-prefix@^1.0.1:
     is-windows "^1.0.1"
     which "^1.2.14"
 
-global@^4.3.0, global@^4.3.2:
+global@^4.3.2:
   version "4.3.2"
   resolved "https://registry.yarnpkg.com/global/-/global-4.3.2.tgz#e76989268a6c74c38908b1305b10fc0e394e9d0f"
   dependencies:
@@ -10491,13 +10036,6 @@ http-errors@^1.7.1:
     statuses ">= 1.5.0 < 2"
     toidentifier "1.0.0"
 
-http-errors@~1.3.1:
-  version "1.3.1"
-  resolved "https://registry.yarnpkg.com/http-errors/-/http-errors-1.3.1.tgz#197e22cdebd4198585e8694ef6786197b91ed942"
-  dependencies:
-    inherits "~2.0.1"
-    statuses "1"
-
 http-parser-js@>=0.4.0:
   version "0.5.0"
   resolved "https://registry.yarnpkg.com/http-parser-js/-/http-parser-js-0.5.0.tgz#d65edbede84349d0dc30320815a15d39cc3cbbd8"
@@ -10583,21 +10121,13 @@ hyperlinker@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/hyperlinker/-/hyperlinker-1.0.0.tgz#23dc9e38a206b208ee49bc2d6c8ef47027df0c0e"
 
-iconv-lite@0.4.11:
-  version "0.4.11"
-  resolved "https://registry.yarnpkg.com/iconv-lite/-/iconv-lite-0.4.11.tgz#2ecb42fd294744922209a2e7c404dac8793d8ade"
-
-iconv-lite@0.4.13:
-  version "0.4.13"
-  resolved "https://registry.yarnpkg.com/iconv-lite/-/iconv-lite-0.4.13.tgz#1f88aba4ab0b1508e8312acc39345f36e992e2f2"
-
 iconv-lite@0.4.23:
   version "0.4.23"
   resolved "https://registry.yarnpkg.com/iconv-lite/-/iconv-lite-0.4.23.tgz#297871f63be507adcfbfca715d0cd0eed84e9a63"
   dependencies:
     safer-buffer ">= 2.1.2 < 3"
 
-iconv-lite@0.4.24, iconv-lite@^0.4.17, iconv-lite@^0.4.24, iconv-lite@^0.4.4, iconv-lite@~0.4.13:
+iconv-lite@0.4.24, iconv-lite@^0.4.24, iconv-lite@^0.4.4, iconv-lite@~0.4.13:
   version "0.4.24"
   resolved "https://registry.yarnpkg.com/iconv-lite/-/iconv-lite-0.4.24.tgz#2022b4b25fbddc21d2f524974a474aafe733908b"
   dependencies:
@@ -10654,7 +10184,7 @@ ignoring-watcher@^1.0.5:
     chokidar "^1.4.3"
     raptor-util "^1.0.7"
 
-image-size@^0.6.0, image-size@^0.6.3:
+image-size@^0.6.3:
   version "0.6.3"
   resolved "https://registry.yarnpkg.com/image-size/-/image-size-0.6.3.tgz#e7e5c65bb534bd7cdcedd6cb5166272a85f75fb2"
 
@@ -10869,25 +10399,6 @@ inquirer@^2:
     strip-ansi "^3.0.0"
     through "^2.3.6"
 
-inquirer@^3.0.6:
-  version "3.3.0"
-  resolved "https://registry.yarnpkg.com/inquirer/-/inquirer-3.3.0.tgz#9dd2f2ad765dcab1ff0443b491442a20ba227dc9"
-  dependencies:
-    ansi-escapes "^3.0.0"
-    chalk "^2.0.0"
-    cli-cursor "^2.1.0"
-    cli-width "^2.0.0"
-    external-editor "^2.0.4"
-    figures "^2.0.0"
-    lodash "^4.3.0"
-    mute-stream "0.0.7"
-    run-async "^2.2.0"
-    rx-lite "^4.0.8"
-    rx-lite-aggregates "^4.0.8"
-    string-width "^2.1.0"
-    strip-ansi "^4.0.0"
-    through "^2.3.6"
-
 insert-module-globals@^7.0.0:
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/insert-module-globals/-/insert-module-globals-7.2.0.tgz#ec87e5b42728479e327bd5c5c71611ddfb4752ba"
@@ -11690,22 +11201,10 @@ jest-diff@^24.0.0:
     jest-get-type "^24.0.0"
     pretty-format "^24.0.0"
 
-jest-docblock@22.1.0:
-  version "22.1.0"
-  resolved "https://registry.yarnpkg.com/jest-docblock/-/jest-docblock-22.1.0.tgz#3fe5986d5444cbcb149746eb4b07c57c5a464dfd"
-  dependencies:
-    detect-newline "^2.1.0"
-
 jest-docblock@^21.0.0:
   version "21.2.0"
   resolved "https://registry.yarnpkg.com/jest-docblock/-/jest-docblock-21.2.0.tgz#51529c3b30d5fd159da60c27ceedc195faf8d414"
 
-jest-docblock@^22.1.0:
-  version "22.4.3"
-  resolved "https://registry.yarnpkg.com/jest-docblock/-/jest-docblock-22.4.3.tgz#50886f132b42b280c903c592373bb6e93bb68b19"
-  dependencies:
-    detect-newline "^2.1.0"
-
 jest-docblock@^23.2.0:
   version "23.2.0"
   resolved "https://registry.yarnpkg.com/jest-docblock/-/jest-docblock-23.2.0.tgz#f085e1f18548d99fdd69b20207e6fd55d91383a7"
@@ -11798,17 +11297,6 @@ jest-get-type@^24.0.0:
   version "24.0.0"
   resolved "https://registry.yarnpkg.com/jest-get-type/-/jest-get-type-24.0.0.tgz#36e72930b78e33da59a4f63d44d332188278940b"
 
-jest-haste-map@22.1.0:
-  version "22.1.0"
-  resolved "https://registry.yarnpkg.com/jest-haste-map/-/jest-haste-map-22.1.0.tgz#1174c6ff393f9818ebf1163710d8868b5370da2a"
-  dependencies:
-    fb-watchman "^2.0.0"
-    graceful-fs "^4.1.11"
-    jest-docblock "^22.1.0"
-    jest-worker "^22.1.0"
-    micromatch "^2.3.11"
-    sane "^2.0.0"
-
 jest-haste-map@^23.6.0:
   version "23.6.0"
   resolved "https://registry.yarnpkg.com/jest-haste-map/-/jest-haste-map-23.6.0.tgz#2e3eb997814ca696d62afdb3f2529f5bbc935e16"
@@ -12141,18 +11629,6 @@ jest-watcher@^23.4.0:
     chalk "^2.0.1"
     string-length "^2.0.0"
 
-jest-worker@22.1.0:
-  version "22.1.0"
-  resolved "https://registry.yarnpkg.com/jest-worker/-/jest-worker-22.1.0.tgz#0987832fe58fbdc205357f4c19b992446368cafb"
-  dependencies:
-    merge-stream "^1.0.1"
-
-jest-worker@^22.1.0:
-  version "22.4.3"
-  resolved "https://registry.yarnpkg.com/jest-worker/-/jest-worker-22.4.3.tgz#5c421417cba1c0abf64bf56bd5fb7968d79dd40b"
-  dependencies:
-    merge-stream "^1.0.1"
-
 jest-worker@^23.2.0:
   version "23.2.0"
   resolved "https://registry.yarnpkg.com/jest-worker/-/jest-worker-23.2.0.tgz#faf706a8da36fae60eb26957257fa7b5d8ea02b9"
@@ -12382,10 +11858,6 @@ json5@2.x, json5@^2.1.0:
   dependencies:
     minimist "^1.2.0"
 
-json5@^0.4.0:
-  version "0.4.0"
-  resolved "https://registry.yarnpkg.com/json5/-/json5-0.4.0.tgz#054352e4c4c80c86c0923877d449de176a732c8d"
-
 json5@^0.5.0, json5@^0.5.1:
   version "0.5.1"
   resolved "https://registry.yarnpkg.com/json5/-/json5-0.5.1.tgz#1eade7acc012034ad84e2396767ead9fa5495821"
@@ -12496,10 +11968,6 @@ killable@^1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/killable/-/killable-1.0.1.tgz#4c8ce441187a061c7474fb87ca08e2a638194892"
 
-kind-of@^1.1.0:
-  version "1.1.0"
-  resolved "https://registry.yarnpkg.com/kind-of/-/kind-of-1.1.0.tgz#140a3d2d41a36d2efcfa9377b62c24f8495a5c44"
-
 kind-of@^2.0.1:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/kind-of/-/kind-of-2.0.1.tgz#018ec7a4ce7e3a86cb9141be519d24c8faa981b5"
@@ -12701,7 +12169,7 @@ leek@0.0.24:
     lodash.assign "^3.2.0"
     rsvp "^3.0.21"
 
-left-pad@^1.1.3, left-pad@^1.3.0:
+left-pad@^1.3.0:
   version "1.3.0"
   resolved "https://registry.yarnpkg.com/left-pad/-/left-pad-1.3.0.tgz#5b8a3a7765dfe001261dde915589e782f8c94d1e"
 
@@ -13451,18 +12919,6 @@ lodash.once@^4.0.0:
   version "4.1.1"
   resolved "https://registry.yarnpkg.com/lodash.once/-/lodash.once-4.1.1.tgz#0dd3971213c7c56df880977d504c88fb471a97ac"
 
-lodash.pad@^4.1.0:
-  version "4.5.1"
-  resolved "https://registry.yarnpkg.com/lodash.pad/-/lodash.pad-4.5.1.tgz#4330949a833a7c8da22cc20f6a26c4d59debba70"
-
-lodash.padend@^4.1.0:
-  version "4.6.1"
-  resolved "https://registry.yarnpkg.com/lodash.padend/-/lodash.padend-4.6.1.tgz#53ccba047d06e158d311f45da625f4e49e6f166e"
-
-lodash.padstart@^4.1.0:
-  version "4.6.1"
-  resolved "https://registry.yarnpkg.com/lodash.padstart/-/lodash.padstart-4.6.1.tgz#d2e3eebff0d9d39ad50f5cbd1b52a7bce6bb611b"
-
 lodash.pick@^4.4.0:
   version "4.4.0"
   resolved "https://registry.yarnpkg.com/lodash.pick/-/lodash.pick-4.4.0.tgz#52f05610fff9ded422611441ed1fc123a03001b3"
@@ -13543,11 +12999,11 @@ lodash.values@~2.3.0:
   dependencies:
     lodash.keys "~2.3.0"
 
-lodash@>4.17.4, "lodash@>=3.5 <5", lodash@^4.0.0, lodash@^4.0.1, lodash@^4.13.1, lodash@^4.15.0, lodash@^4.16.6, lodash@^4.17.10, lodash@^4.17.11, lodash@^4.17.4, lodash@^4.17.5, lodash@^4.2.1, lodash@^4.3.0, lodash@^4.6.1, lodash@~4.17.10:
+lodash@>4.17.4, "lodash@>=3.5 <5", lodash@^4.0.0, lodash@^4.0.1, lodash@^4.13.1, lodash@^4.15.0, lodash@^4.17.10, lodash@^4.17.11, lodash@^4.17.4, lodash@^4.17.5, lodash@^4.2.1, lodash@^4.3.0, lodash@~4.17.10:
   version "4.17.11"
   resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.11.tgz#b39ea6229ef607ecd89e2c8df12536891cac9b8d"
 
-lodash@^3.3.1, lodash@^3.5.0:
+lodash@^3.3.1:
   version "3.10.1"
   resolved "https://registry.yarnpkg.com/lodash/-/lodash-3.10.1.tgz#5bf45e8e49ba4189e17d482789dfd15bd140b7b6"
 
@@ -13627,10 +13083,6 @@ lru-cache@^5.1.1:
   dependencies:
     yallist "^3.0.2"
 
-macos-release@^1.0.0:
-  version "1.1.0"
-  resolved "https://registry.yarnpkg.com/macos-release/-/macos-release-1.1.0.tgz#831945e29365b470aa8724b0ab36c8f8959d10fb"
-
 macos-release@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/macos-release/-/macos-release-2.0.0.tgz#7dddf4caf79001a851eb4fba7fb6034f251276ab"
@@ -14032,81 +13484,10 @@ merge@^1.2.0:
   version "1.2.1"
   resolved "https://registry.yarnpkg.com/merge/-/merge-1.2.1.tgz#38bebf80c3220a8a487b6fcfb3941bb11720c145"
 
-method-override@~2.3.5:
-  version "2.3.10"
-  resolved "https://registry.yarnpkg.com/method-override/-/method-override-2.3.10.tgz#e3daf8d5dee10dd2dce7d4ae88d62bbee77476b4"
-  dependencies:
-    debug "2.6.9"
-    methods "~1.1.2"
-    parseurl "~1.3.2"
-    vary "~1.1.2"
-
 methods@~1.1.2:
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/methods/-/methods-1.1.2.tgz#5529a4d67654134edcc5266656835b0f851afcee"
 
-metro-core@0.24.7, metro-core@^0.24.1:
-  version "0.24.7"
-  resolved "https://registry.yarnpkg.com/metro-core/-/metro-core-0.24.7.tgz#89e4fbea5bad574eb971459ebfa74c028f52d278"
-  dependencies:
-    lodash.throttle "^4.1.1"
-
-metro-source-map@0.24.7:
-  version "0.24.7"
-  resolved "https://registry.yarnpkg.com/metro-source-map/-/metro-source-map-0.24.7.tgz#b13d0ae6417c2a2cd3d521ae6cd898196748ec0b"
-  dependencies:
-    source-map "^0.5.6"
-
-metro@^0.24.1:
-  version "0.24.7"
-  resolved "https://registry.yarnpkg.com/metro/-/metro-0.24.7.tgz#42cecdb236b702d16243812294f7d3b97c43378d"
-  dependencies:
-    absolute-path "^0.0.0"
-    async "^2.4.0"
-    babel-core "^6.24.1"
-    babel-generator "^6.26.0"
-    babel-plugin-external-helpers "^6.18.0"
-    babel-preset-es2015-node "^6.1.1"
-    babel-preset-fbjs "^2.1.4"
-    babel-preset-react-native "^4.0.0"
-    babel-register "^6.24.1"
-    babylon "^6.18.0"
-    chalk "^1.1.1"
-    concat-stream "^1.6.0"
-    connect "^3.6.5"
-    core-js "^2.2.2"
-    debug "^2.2.0"
-    denodeify "^1.2.1"
-    eventemitter3 "^3.0.0"
-    fbjs "^0.8.14"
-    fs-extra "^1.0.0"
-    graceful-fs "^4.1.3"
-    image-size "^0.6.0"
-    jest-docblock "22.1.0"
-    jest-haste-map "22.1.0"
-    jest-worker "22.1.0"
-    json-stable-stringify "^1.0.1"
-    json5 "^0.4.0"
-    left-pad "^1.1.3"
-    lodash.throttle "^4.1.1"
-    merge-stream "^1.0.1"
-    metro-core "0.24.7"
-    metro-source-map "0.24.7"
-    mime-types "2.1.11"
-    mkdirp "^0.5.1"
-    request "^2.79.0"
-    rimraf "^2.5.4"
-    serialize-error "^2.1.0"
-    source-map "^0.5.6"
-    temp "0.8.3"
-    throat "^4.1.0"
-    uglify-es "^3.1.9"
-    wordwrap "^1.0.0"
-    write-file-atomic "^1.2.0"
-    ws "^1.1.0"
-    xpipe "^1.0.5"
-    yargs "^9.0.0"
-
 micromatch@^2.1.5, micromatch@^2.3.11:
   version "2.3.11"
   resolved "https://registry.yarnpkg.com/micromatch/-/micromatch-2.3.11.tgz#86677c97d1720b363431d04d0d15293bd38c1565"
@@ -14154,31 +13535,17 @@ miller-rabin@^4.0.0:
   version "1.37.0"
   resolved "https://registry.yarnpkg.com/mime-db/-/mime-db-1.37.0.tgz#0b6a0ce6fdbe9576e25f1f2d2fde8830dc0ad0d8"
 
-mime-db@~1.23.0:
-  version "1.23.0"
-  resolved "https://registry.yarnpkg.com/mime-db/-/mime-db-1.23.0.tgz#a31b4070adaea27d732ea333740a64d0ec9a6659"
-
-mime-types@2.1.11:
-  version "2.1.11"
-  resolved "https://registry.yarnpkg.com/mime-types/-/mime-types-2.1.11.tgz#c259c471bda808a85d6cd193b430a5fae4473b3c"
-  dependencies:
-    mime-db "~1.23.0"
-
-mime-types@^2.1.12, mime-types@^2.1.18, mime-types@^2.1.19, mime-types@~2.1.17, mime-types@~2.1.18, mime-types@~2.1.19, mime-types@~2.1.6, mime-types@~2.1.9:
+mime-types@^2.1.12, mime-types@^2.1.18, mime-types@^2.1.19, mime-types@~2.1.17, mime-types@~2.1.18, mime-types@~2.1.19:
   version "2.1.21"
   resolved "https://registry.yarnpkg.com/mime-types/-/mime-types-2.1.21.tgz#28995aa1ecb770742fe6ae7e58f9181c744b3f96"
   dependencies:
     mime-db "~1.37.0"
 
-mime@1.3.4:
-  version "1.3.4"
-  resolved "https://registry.yarnpkg.com/mime/-/mime-1.3.4.tgz#115f9e3b6b3daf2959983cb38f149a2d40eb5d53"
-
 mime@1.4.1:
   version "1.4.1"
   resolved "https://registry.yarnpkg.com/mime/-/mime-1.4.1.tgz#121f9ebc49e3766f311a76e1fa1c8003c4b03aa6"
 
-mime@^1.2.11, mime@^1.3.4, mime@^1.4.1:
+mime@^1.2.11, mime@^1.4.1:
   version "1.6.0"
   resolved "https://registry.yarnpkg.com/mime/-/mime-1.6.0.tgz#32cd9e5c64553bd58d19a568af452acff04981b1"
 
@@ -14370,16 +13737,6 @@ morgan@^1.9.0:
     on-finished "~2.3.0"
     on-headers "~1.0.1"
 
-morgan@~1.6.1:
-  version "1.6.1"
-  resolved "https://registry.yarnpkg.com/morgan/-/morgan-1.6.1.tgz#5fd818398c6819cba28a7cd6664f292fe1c0bbf2"
-  dependencies:
-    basic-auth "~1.0.3"
-    debug "~2.2.0"
-    depd "~1.0.1"
-    on-finished "~2.3.0"
-    on-headers "~1.0.0"
-
 mout@^1.0.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/mout/-/mout-1.1.0.tgz#0b29d41e6a80fa9e2d4a5be9d602e1d9d02177f6"
@@ -14395,14 +13752,6 @@ move-concurrently@^1.0.1:
     rimraf "^2.5.4"
     run-queue "^1.0.3"
 
-ms@0.7.1:
-  version "0.7.1"
-  resolved "https://registry.yarnpkg.com/ms/-/ms-0.7.1.tgz#9cd13c03adbff25b65effde7ce864ee952017098"
-
-ms@0.7.2:
-  version "0.7.2"
-  resolved "https://registry.yarnpkg.com/ms/-/ms-0.7.2.tgz#ae25cf2512b3885a1d95d7f037868d8431124765"
-
 ms@2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/ms/-/ms-2.0.0.tgz#5608aeadfc00be6c2901df5f9861788de0d597c8"
@@ -14431,13 +13780,6 @@ multimatch@^2.1.0:
     arrify "^1.0.0"
     minimatch "^3.0.0"
 
-multiparty@3.3.2:
-  version "3.3.2"
-  resolved "https://registry.yarnpkg.com/multiparty/-/multiparty-3.3.2.tgz#35de6804dc19643e5249f3d3e3bdc6c8ce301d3f"
-  dependencies:
-    readable-stream "~1.1.9"
-    stream-counter "~0.2.0"
-
 mustache@^3.0.0:
   version "3.0.1"
   resolved "https://registry.yarnpkg.com/mustache/-/mustache-3.0.1.tgz#873855f23aa8a95b150fb96d9836edbc5a1d248a"
@@ -14508,10 +13850,6 @@ needle@^2.2.1:
     iconv-lite "^0.4.4"
     sax "^1.2.4"
 
-negotiator@0.5.3:
-  version "0.5.3"
-  resolved "https://registry.yarnpkg.com/negotiator/-/negotiator-0.5.3.tgz#269d5c476810ec92edbe7b6c2f28316384f9a7e8"
-
 negotiator@0.6.1:
   version "0.6.1"
   resolved "https://registry.yarnpkg.com/negotiator/-/negotiator-0.6.1.tgz#2b327184e8992101177b28563fb5e7102acd0ca9"
@@ -14564,7 +13902,7 @@ node-fetch@2.1.2:
   version "2.1.2"
   resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-2.1.2.tgz#ab884e8e7e57e38a944753cec706f788d1768bb5"
 
-node-fetch@^1.0.1, node-fetch@^1.3.3:
+node-fetch@^1.0.1:
   version "1.7.3"
   resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-1.7.3.tgz#980f6f72d85211a5347c6b2bc18c5b84c3eb47ef"
   dependencies:
@@ -14648,7 +13986,7 @@ node-modules-regexp@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/node-modules-regexp/-/node-modules-regexp-1.0.0.tgz#8d9dbe28964a4ac5712e9131642107c71e90ec40"
 
-node-notifier@^5.0.1, node-notifier@^5.1.2, node-notifier@^5.2.1:
+node-notifier@^5.0.1, node-notifier@^5.2.1:
   version "5.3.0"
   resolved "https://registry.yarnpkg.com/node-notifier/-/node-notifier-5.3.0.tgz#c77a4a7b84038733d5fb351aafd8a268bfe19a01"
   dependencies:
@@ -14849,14 +14187,6 @@ npm-which@^3.0.1:
     gauge "~2.7.3"
     set-blocking "~2.0.0"
 
-npmlog@^2.0.4:
-  version "2.0.4"
-  resolved "https://registry.yarnpkg.com/npmlog/-/npmlog-2.0.4.tgz#98b52530f2514ca90d09ec5b22c8846722375692"
-  dependencies:
-    ansi "~0.3.1"
-    are-we-there-yet "~1.1.2"
-    gauge "~1.2.5"
-
 nth-check@^1.0.2, nth-check@~1.0.1:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/nth-check/-/nth-check-1.0.2.tgz#b2bd295c37e3dd58a3bf0700376663ba4d9cf05c"
@@ -15002,7 +14332,7 @@ on-finished@~2.3.0:
   dependencies:
     ee-first "1.1.1"
 
-on-headers@~1.0.0, on-headers@~1.0.1:
+on-headers@~1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/on-headers/-/on-headers-1.0.1.tgz#928f5d0f470d49342651ea6794b0857c100693f7"
 
@@ -15042,12 +14372,6 @@ opn@5.4.0, opn@^5.1.0, opn@^5.3.0, opn@^5.4.0:
   dependencies:
     is-wsl "^1.1.0"
 
-opn@^3.0.2:
-  version "3.0.3"
-  resolved "https://registry.yarnpkg.com/opn/-/opn-3.0.3.tgz#b6d99e7399f78d65c3baaffef1fb288e9b85243a"
-  dependencies:
-    object-assign "^4.0.1"
-
 optimist@0.6.x, optimist@^0.6.1, optimist@~0.6.0:
   version "0.6.1"
   resolved "https://registry.yarnpkg.com/optimist/-/optimist-0.6.1.tgz#da3ea74686fa21a19a111c326e90eb15a0196686"
@@ -15073,10 +14397,6 @@ optionator@^0.8.1, optionator@^0.8.2:
     type-check "~0.3.2"
     wordwrap "~1.0.0"
 
-options@>=0.0.5:
-  version "0.0.6"
-  resolved "https://registry.yarnpkg.com/options/-/options-0.0.6.tgz#ec22d312806bb53e731773e7cdaefcf1c643128f"
-
 ora@^2.0.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/ora/-/ora-2.1.0.tgz#6caf2830eb924941861ec53a173799e008b51e5b"
@@ -15124,13 +14444,6 @@ os-locale@^3.0.0:
     lcid "^2.0.0"
     mem "^4.0.0"
 
-os-name@^2.0.1:
-  version "2.0.1"
-  resolved "https://registry.yarnpkg.com/os-name/-/os-name-2.0.1.tgz#b9a386361c17ae3a21736ef0599405c9a8c5dc5e"
-  dependencies:
-    macos-release "^1.0.0"
-    win-release "^1.0.0"
-
 os-name@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/os-name/-/os-name-3.0.0.tgz#e1434dbfddb8e74b44c98b56797d951b7648a5d9"
@@ -15393,10 +14706,6 @@ parse-ms@^1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/parse-ms/-/parse-ms-1.0.1.tgz#56346d4749d78f23430ca0c713850aef91aa361d"
 
-parse-node-version@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/parse-node-version/-/parse-node-version-1.0.0.tgz#33d9aa8920dcc3c0d33658ec18ce237009a56d53"
-
 parse-passwd@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/parse-passwd/-/parse-passwd-1.0.0.tgz#6d5b934a456993b23d37f40a382d6f1666a8e5c6"
@@ -15437,7 +14746,7 @@ parseuri@0.0.5:
   dependencies:
     better-assert "~1.0.0"
 
-parseurl@~1.3.0, parseurl@~1.3.1, parseurl@~1.3.2:
+parseurl@~1.3.2:
   version "1.3.2"
   resolved "https://registry.yarnpkg.com/parseurl/-/parseurl-1.3.2.tgz#fc289d4ed8993119460c156253262cdc8de65bf3"
 
@@ -15545,10 +14854,6 @@ paths.macro@^2.0.2:
     find-root "^1.1.0"
     upath "^1.0.2"
 
-pause@0.1.0:
-  version "0.1.0"
-  resolved "https://registry.yarnpkg.com/pause/-/pause-0.1.0.tgz#ebc8a4a8619ff0b8a81ac1513c3434ff469fdb74"
-
 pbkdf2@^3.0.3:
   version "3.0.17"
   resolved "https://registry.yarnpkg.com/pbkdf2/-/pbkdf2-3.0.17.tgz#976c206530617b14ebb32114239f7b09336e93a6"
@@ -15559,10 +14864,6 @@ pbkdf2@^3.0.3:
     safe-buffer "^5.0.1"
     sha.js "^2.4.8"
 
-pegjs@^0.10.0:
-  version "0.10.0"
-  resolved "https://registry.yarnpkg.com/pegjs/-/pegjs-0.10.0.tgz#cf8bafae6eddff4b5a7efb185269eaaf4610ddbd"
-
 pend@~1.2.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/pend/-/pend-1.2.0.tgz#7a57eb550a6783f9115331fcf4663d5c8e007a50"
@@ -15635,33 +14936,6 @@ please-upgrade-node@^3.0.2, please-upgrade-node@^3.1.1:
   dependencies:
     semver-compare "^1.0.0"
 
-plist@2.0.1:
-  version "2.0.1"
-  resolved "https://registry.yarnpkg.com/plist/-/plist-2.0.1.tgz#0a32ca9481b1c364e92e18dc55c876de9d01da8b"
-  dependencies:
-    base64-js "1.1.2"
-    xmlbuilder "8.2.2"
-    xmldom "0.1.x"
-
-plist@^1.2.0:
-  version "1.2.0"
-  resolved "https://registry.yarnpkg.com/plist/-/plist-1.2.0.tgz#084b5093ddc92506e259f874b8d9b1afb8c79593"
-  dependencies:
-    base64-js "0.0.8"
-    util-deprecate "1.0.2"
-    xmlbuilder "4.0.0"
-    xmldom "0.1.x"
-
-plugin-error@^0.1.2:
-  version "0.1.2"
-  resolved "https://registry.yarnpkg.com/plugin-error/-/plugin-error-0.1.2.tgz#3b9bb3335ccf00f425e07437e19276967da47ace"
-  dependencies:
-    ansi-cyan "^0.1.1"
-    ansi-red "^0.1.1"
-    arr-diff "^1.0.1"
-    arr-union "^2.0.1"
-    extend-shallow "^1.1.2"
-
 plur@^3.0.0:
   version "3.0.1"
   resolved "https://registry.yarnpkg.com/plur/-/plur-3.0.1.tgz#268652d605f816699b42b86248de73c9acd06a7c"
@@ -16388,10 +15662,6 @@ pretty-format@^24.0.0:
     ansi-regex "^4.0.0"
     ansi-styles "^3.2.0"
 
-pretty-format@^4.2.1:
-  version "4.3.1"
-  resolved "https://registry.yarnpkg.com/pretty-format/-/pretty-format-4.3.1.tgz#530be5c42b3c05b36414a7a2a4337aa80acd0e8d"
-
 pretty-hrtime@^1.0.3:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/pretty-hrtime/-/pretty-hrtime-1.0.3.tgz#b7e3ea42435a4c9b2759d99e0f201eb195802ee1"
@@ -16637,10 +15907,6 @@ q@^1.0.1, q@^1.1.2, q@^1.4.1, q@^1.5.1:
   version "1.5.1"
   resolved "https://registry.yarnpkg.com/q/-/q-1.5.1.tgz#7e32f75b41381291d04611f1bf14109ac00651d7"
 
-qs@4.0.0:
-  version "4.0.0"
-  resolved "https://registry.yarnpkg.com/qs/-/qs-4.0.0.tgz#c31d9b74ec27df75e543a86c78728ed8d4623607"
-
 qs@6.5.2, qs@~6.5.2:
   version "6.5.2"
   resolved "https://registry.yarnpkg.com/qs/-/qs-6.5.2.tgz#cb3ae806e8740444584ef154ce8ee98d403f3e36"
@@ -16704,10 +15970,6 @@ randexp@0.4.6:
     discontinuous-range "1.0.0"
     ret "~0.1.10"
 
-random-bytes@~1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/random-bytes/-/random-bytes-1.0.0.tgz#4f68a1dc0ae58bd3fb95848c30324db75d64360b"
-
 randomatic@^3.0.0:
   version "3.1.1"
   resolved "https://registry.yarnpkg.com/randomatic/-/randomatic-3.1.1.tgz#b776efc59375984e36c537b2f51a1f0aff0da1ed"
@@ -16733,10 +15995,6 @@ range-parser@^1.0.3, range-parser@~1.2.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/range-parser/-/range-parser-1.2.0.tgz#f49be6b487894ddc40dcc94a322f611092e00d5e"
 
-range-parser@~1.0.3:
-  version "1.0.3"
-  resolved "https://registry.yarnpkg.com/range-parser/-/range-parser-1.0.3.tgz#6872823535c692e2c2a0103826afd82c2e0ff175"
-
 raptor-args@^1:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/raptor-args/-/raptor-args-1.0.3.tgz#e096ce5c0f9de5e0848617a78bfface94c54dc86"
@@ -16844,14 +16102,6 @@ raw-body@~1.1.0:
     bytes "1"
     string_decoder "0.10"
 
-raw-body@~2.1.2:
-  version "2.1.7"
-  resolved "https://registry.yarnpkg.com/raw-body/-/raw-body-2.1.7.tgz#adfeace2e4fb3098058014d08c072dcc59758774"
-  dependencies:
-    bytes "2.4.0"
-    iconv-lite "0.4.13"
-    unpipe "1.0.0"
-
 raw-loader@0.5.1:
   version "0.5.1"
   resolved "https://registry.yarnpkg.com/raw-loader/-/raw-loader-0.5.1.tgz#0c3d0beaed8a01c966d9787bf778281252a979aa"
@@ -16897,10 +16147,6 @@ react-clientside-effect@^1.2.0:
     "@babel/runtime" "^7.0.0"
     shallowequal "^1.1.0"
 
-react-clone-referenced-element@^1.0.1:
-  version "1.1.0"
-  resolved "https://registry.yarnpkg.com/react-clone-referenced-element/-/react-clone-referenced-element-1.1.0.tgz#9cdda7f2aeb54fea791f3ab8c6ab96c7a77d0158"
-
 react-color@^2.17.0:
   version "2.17.0"
   resolved "https://registry.yarnpkg.com/react-color/-/react-color-2.17.0.tgz#e14b8a11f4e89163f65a34c8b43faf93f7f02aaa"
@@ -16912,10 +16158,6 @@ react-color@^2.17.0:
     reactcss "^1.2.0"
     tinycolor2 "^1.4.1"
 
-react-deep-force-update@^1.0.0:
-  version "1.1.2"
-  resolved "https://registry.yarnpkg.com/react-deep-force-update/-/react-deep-force-update-1.1.2.tgz#3d2ae45c2c9040cbb1772be52f8ea1ade6ca2ee1"
-
 react-dev-utils@^7.0.0, react-dev-utils@^7.0.1:
   version "7.0.1"
   resolved "https://registry.yarnpkg.com/react-dev-utils/-/react-dev-utils-7.0.1.tgz#c53e759a22668ee2c0d146c24ce4bdec2b41e3c8"
@@ -16945,13 +16187,6 @@ react-dev-utils@^7.0.0, react-dev-utils@^7.0.1:
     strip-ansi "4.0.0"
     text-table "0.2.0"
 
-react-devtools-core@3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/react-devtools-core/-/react-devtools-core-3.0.0.tgz#f683e19f0311108f97dbb5b29d948323a1bf7c03"
-  dependencies:
-    shell-quote "^1.6.1"
-    ws "^2.0.3"
-
 react-docgen-typescript-loader@^3.0.1:
   version "3.0.1"
   resolved "https://registry.yarnpkg.com/react-docgen-typescript-loader/-/react-docgen-typescript-loader-3.0.1.tgz#889aa472450c8db82ea0355656a307806ec74e77"
@@ -17120,65 +16355,6 @@ react-native-switch@^1.5.0:
   dependencies:
     prop-types "^15.6.0"
 
-react-native@^0.52.2:
-  version "0.52.3"
-  resolved "https://registry.yarnpkg.com/react-native/-/react-native-0.52.3.tgz#e11698e19bbc8f98135f82d40ac82ccb046641fd"
-  dependencies:
-    absolute-path "^0.0.0"
-    art "^0.10.0"
-    babel-core "^6.24.1"
-    babel-plugin-syntax-trailing-function-commas "^6.20.0"
-    babel-plugin-transform-async-to-generator "6.16.0"
-    babel-plugin-transform-class-properties "^6.18.0"
-    babel-plugin-transform-exponentiation-operator "^6.5.0"
-    babel-plugin-transform-flow-strip-types "^6.21.0"
-    babel-plugin-transform-object-rest-spread "^6.20.2"
-    babel-register "^6.24.1"
-    babel-runtime "^6.23.0"
-    base64-js "^1.1.2"
-    chalk "^1.1.1"
-    commander "^2.9.0"
-    connect "^2.8.3"
-    create-react-class "^15.5.2"
-    debug "^2.2.0"
-    denodeify "^1.2.1"
-    envinfo "^3.0.0"
-    event-target-shim "^1.0.5"
-    fbjs "^0.8.14"
-    fbjs-scripts "^0.8.1"
-    fs-extra "^1.0.0"
-    glob "^7.1.1"
-    graceful-fs "^4.1.3"
-    inquirer "^3.0.6"
-    lodash "^4.16.6"
-    metro "^0.24.1"
-    metro-core "^0.24.1"
-    mime "^1.3.4"
-    minimist "^1.2.0"
-    mkdirp "^0.5.1"
-    node-fetch "^1.3.3"
-    node-notifier "^5.1.2"
-    npmlog "^2.0.4"
-    opn "^3.0.2"
-    optimist "^0.6.1"
-    plist "^1.2.0"
-    pretty-format "^4.2.1"
-    promise "^7.1.1"
-    prop-types "^15.5.8"
-    react-clone-referenced-element "^1.0.1"
-    react-devtools-core "3.0.0"
-    react-timer-mixin "^0.13.2"
-    regenerator-runtime "^0.11.0"
-    rimraf "^2.5.4"
-    semver "^5.0.3"
-    shell-quote "1.6.1"
-    stacktrace-parser "^0.1.3"
-    whatwg-fetch "^1.0.0"
-    ws "^1.1.0"
-    xcode "^0.9.1"
-    xmldoc "^0.4.0"
-    yargs "^9.0.0"
-
 react-popper-tooltip@^2.8.0:
   version "2.8.0"
   resolved "https://registry.yarnpkg.com/react-popper-tooltip/-/react-popper-tooltip-2.8.0.tgz#777e710e4696bd1b8e1a1ef24a6e3375e0206609"
@@ -17197,13 +16373,6 @@ react-popper@^1.3.2:
     typed-styles "^0.0.7"
     warning "^4.0.2"
 
-react-proxy@^1.1.7:
-  version "1.1.8"
-  resolved "https://registry.yarnpkg.com/react-proxy/-/react-proxy-1.1.8.tgz#9dbfd9d927528c3aa9f444e4558c37830ab8c26a"
-  dependencies:
-    lodash "^4.6.1"
-    react-deep-force-update "^1.0.0"
-
 react-resize-detector@^3.2.1:
   version "3.4.0"
   resolved "https://registry.yarnpkg.com/react-resize-detector/-/react-resize-detector-3.4.0.tgz#2ccd399958a0efe9b7c52c5db5a13d87e47cd585"
@@ -17322,17 +16491,6 @@ react-textarea-autosize@^7.0.4:
     "@babel/runtime" "^7.1.2"
     prop-types "^15.6.0"
 
-react-timer-mixin@^0.13.2:
-  version "0.13.4"
-  resolved "https://registry.yarnpkg.com/react-timer-mixin/-/react-timer-mixin-0.13.4.tgz#75a00c3c94c13abe29b43d63b4c65a88fc8264d3"
-
-react-transform-hmr@^1.0.4:
-  version "1.0.4"
-  resolved "https://registry.yarnpkg.com/react-transform-hmr/-/react-transform-hmr-1.0.4.tgz#e1a40bd0aaefc72e8dfd7a7cda09af85066397bb"
-  dependencies:
-    global "^4.3.0"
-    react-proxy "^1.1.7"
-
 react-transition-group@^2.2.1:
   version "2.5.3"
   resolved "https://registry.yarnpkg.com/react-transition-group/-/react-transition-group-2.5.3.tgz#26de363cab19e5c88ae5dbae105c706cf953bb92"
@@ -17496,15 +16654,6 @@ readable-stream@^3.0.6:
     string_decoder "^1.1.1"
     util-deprecate "^1.0.1"
 
-readable-stream@~1.1.8, readable-stream@~1.1.9:
-  version "1.1.14"
-  resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-1.1.14.tgz#7cf4c54ef648e3813084c636dd2079e166c081d9"
-  dependencies:
-    core-util-is "~1.0.0"
-    inherits "~2.0.1"
-    isarray "0.0.1"
-    string_decoder "~0.10.x"
-
 readable-stream@~2.0.6:
   version "2.0.6"
   resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-2.0.6.tgz#8f90341e68a53ccc928788dacfcd11b36eb9b78e"
@@ -18056,7 +17205,7 @@ request-promise-native@^1.0.5:
     stealthy-require "^1.1.0"
     tough-cookie ">=2.3.3"
 
-"request@>=2.76.0 <3.0.0", request@^2.79.0, request@^2.83.0, request@^2.87.0, request@^2.88.0:
+"request@>=2.76.0 <3.0.0", request@^2.83.0, request@^2.87.0, request@^2.88.0:
   version "2.88.0"
   resolved "https://registry.yarnpkg.com/request/-/request-2.88.0.tgz#9c2fca4f7d35b592efe57c7f0a55e81052124fef"
   dependencies:
@@ -18182,13 +17331,6 @@ resolve@1.x, resolve@^1.1.4, resolve@^1.1.6, resolve@^1.1.7, resolve@^1.10.0, re
   dependencies:
     path-parse "^1.0.6"
 
-response-time@~2.3.1:
-  version "2.3.2"
-  resolved "https://registry.yarnpkg.com/response-time/-/response-time-2.3.2.tgz#ffa71bab952d62f7c1d49b7434355fbc68dffc5a"
-  dependencies:
-    depd "~1.1.0"
-    on-headers "~1.0.1"
-
 rest-handler@^1.2.16:
   version "1.2.17"
   resolved "https://registry.yarnpkg.com/rest-handler/-/rest-handler-1.2.17.tgz#2369830a5a2b6f5d5635dfd30cb963c43141b1c7"
@@ -18309,10 +17451,6 @@ ripemd160@^2.0.0, ripemd160@^2.0.1:
     hash-base "^3.0.0"
     inherits "^2.0.1"
 
-rndm@1.2.0:
-  version "1.2.0"
-  resolved "https://registry.yarnpkg.com/rndm/-/rndm-1.2.0.tgz#f33fe9cfb52bbfd520aa18323bc65db110a1b76c"
-
 rollup-pluginutils@^2.0.1:
   version "2.3.3"
   resolved "https://registry.yarnpkg.com/rollup-pluginutils/-/rollup-pluginutils-2.3.3.tgz#3aad9b1eb3e7fe8262820818840bf091e5ae6794"
@@ -18388,16 +17526,6 @@ rusha@^0.8.1:
   version "0.8.13"
   resolved "https://registry.yarnpkg.com/rusha/-/rusha-0.8.13.tgz#9a084e7b860b17bff3015b92c67a6a336191513a"
 
-rx-lite-aggregates@^4.0.8:
-  version "4.0.8"
-  resolved "https://registry.yarnpkg.com/rx-lite-aggregates/-/rx-lite-aggregates-4.0.8.tgz#753b87a89a11c95467c4ac1626c4efc4e05c67be"
-  dependencies:
-    rx-lite "*"
-
-rx-lite@*, rx-lite@^4.0.8:
-  version "4.0.8"
-  resolved "https://registry.yarnpkg.com/rx-lite/-/rx-lite-4.0.8.tgz#0b1e11af8bc44836f04a6407e92da42467b79444"
-
 rx-lite@^3.1.2:
   version "3.1.2"
   resolved "https://registry.yarnpkg.com/rx-lite/-/rx-lite-3.1.2.tgz#19ce502ca572665f3b647b10939f97fd1615f102"
@@ -18424,10 +17552,6 @@ safe-buffer@5.1.2, safe-buffer@^5.0.1, safe-buffer@^5.1.0, safe-buffer@^5.1.1, s
   version "5.1.2"
   resolved "https://registry.yarnpkg.com/safe-buffer/-/safe-buffer-5.1.2.tgz#991ec69d296e0313747d59bdfd2b745c35f8828d"
 
-safe-buffer@~5.0.1:
-  version "5.0.1"
-  resolved "https://registry.yarnpkg.com/safe-buffer/-/safe-buffer-5.0.1.tgz#d263ca54696cd8a306b5ca6551e92de57918fbe7"
-
 safe-eval@^0.4.1:
   version "0.4.1"
   resolved "https://registry.yarnpkg.com/safe-eval/-/safe-eval-0.4.1.tgz#e54ba5a1bbdec795d488f6c8765e0c2a78b4cdc0"
@@ -18509,10 +17633,6 @@ sax@>=0.6.0, sax@^1.2.4, sax@~1.2.4:
   version "1.2.4"
   resolved "https://registry.yarnpkg.com/sax/-/sax-1.2.4.tgz#2816234e2378bddc4e5354fab5caa895df7100d9"
 
-sax@~1.1.1:
-  version "1.1.6"
-  resolved "https://registry.yarnpkg.com/sax/-/sax-1.1.6.tgz#5d616be8a5e607d54e114afae55b7eaf2fcc3240"
-
 saxes@^3.1.4:
   version "3.1.6"
   resolved "https://registry.yarnpkg.com/saxes/-/saxes-3.1.6.tgz#2d948a47b54918516c5a64096f08865deb5bd8cd"
@@ -18607,7 +17727,7 @@ semver-intersect@1.4.0:
   dependencies:
     semver "^5.0.0"
 
-"semver@2 || 3 || 4 || 5", "semver@2.x || 3.x || 4 || 5", semver@5.6.0, semver@5.x, semver@^5.0.0, semver@^5.0.1, semver@^5.0.3, semver@^5.1.0, semver@^5.3.0, semver@^5.4.1, semver@^5.5, semver@^5.5.0, semver@^5.5.1, semver@^5.6.0:
+"semver@2 || 3 || 4 || 5", "semver@2.x || 3.x || 4 || 5", semver@5.6.0, semver@^5.0.0, semver@^5.0.1, semver@^5.0.3, semver@^5.1.0, semver@^5.3.0, semver@^5.4.1, semver@^5.5, semver@^5.5.0, semver@^5.5.1, semver@^5.6.0:
   version "5.6.0"
   resolved "https://registry.yarnpkg.com/semver/-/semver-5.6.0.tgz#7e74256fbaa49c75aa7c7a205cc22799cac80004"
 
@@ -18619,23 +17739,6 @@ semver@~5.3.0:
   version "5.3.0"
   resolved "https://registry.yarnpkg.com/semver/-/semver-5.3.0.tgz#9b2ce5d3de02d17c6012ad326aa6b4d0cf54f94f"
 
-send@0.13.2:
-  version "0.13.2"
-  resolved "https://registry.yarnpkg.com/send/-/send-0.13.2.tgz#765e7607c8055452bba6f0b052595350986036de"
-  dependencies:
-    debug "~2.2.0"
-    depd "~1.1.0"
-    destroy "~1.0.4"
-    escape-html "~1.0.3"
-    etag "~1.7.0"
-    fresh "0.3.0"
-    http-errors "~1.3.1"
-    mime "1.3.4"
-    ms "0.7.1"
-    on-finished "~2.3.0"
-    range-parser "~1.0.3"
-    statuses "~1.2.1"
-
 send@0.16.2, send@^0.16.2:
   version "0.16.2"
   resolved "https://registry.yarnpkg.com/send/-/send-0.16.2.tgz#6ecca1e0f8c156d141597559848df64730a6bbc1"
@@ -18654,10 +17757,6 @@ send@0.16.2, send@^0.16.2:
     range-parser "~1.2.0"
     statuses "~1.4.0"
 
-serialize-error@^2.1.0:
-  version "2.1.0"
-  resolved "https://registry.yarnpkg.com/serialize-error/-/serialize-error-2.1.0.tgz#50b679d5635cdf84667bdc8e59af4e5b81d5f60a"
-
 serialize-javascript@^1.4.0:
   version "1.6.1"
   resolved "https://registry.yarnpkg.com/serialize-javascript/-/serialize-javascript-1.6.1.tgz#4d1f697ec49429a847ca6f442a2a755126c4d879"
@@ -18672,15 +17771,6 @@ serve-favicon@^2.5.0:
     parseurl "~1.3.2"
     safe-buffer "5.1.1"
 
-serve-favicon@~2.3.0:
-  version "2.3.2"
-  resolved "https://registry.yarnpkg.com/serve-favicon/-/serve-favicon-2.3.2.tgz#dd419e268de012ab72b319d337f2105013f9381f"
-  dependencies:
-    etag "~1.7.0"
-    fresh "0.3.0"
-    ms "0.7.2"
-    parseurl "~1.3.1"
-
 serve-index@^1.7.2:
   version "1.9.1"
   resolved "https://registry.yarnpkg.com/serve-index/-/serve-index-1.9.1.tgz#d3768d69b1e7d82e5ce050fff5b453bea12a9239"
@@ -18693,18 +17783,6 @@ serve-index@^1.7.2:
     mime-types "~2.1.17"
     parseurl "~1.3.2"
 
-serve-index@~1.7.2:
-  version "1.7.3"
-  resolved "https://registry.yarnpkg.com/serve-index/-/serve-index-1.7.3.tgz#7a057fc6ee28dc63f64566e5fa57b111a86aecd2"
-  dependencies:
-    accepts "~1.2.13"
-    batch "0.5.3"
-    debug "~2.2.0"
-    escape-html "~1.0.3"
-    http-errors "~1.3.1"
-    mime-types "~2.1.9"
-    parseurl "~1.3.1"
-
 serve-static@1.13.2:
   version "1.13.2"
   resolved "https://registry.yarnpkg.com/serve-static/-/serve-static-1.13.2.tgz#095e8472fd5b46237db50ce486a43f4b86c6cec1"
@@ -18714,14 +17792,6 @@ serve-static@1.13.2:
     parseurl "~1.3.2"
     send "0.16.2"
 
-serve-static@~1.10.0:
-  version "1.10.3"
-  resolved "https://registry.yarnpkg.com/serve-static/-/serve-static-1.10.3.tgz#ce5a6ecd3101fed5ec09827dac22a9c29bfb0535"
-  dependencies:
-    escape-html "~1.0.3"
-    parseurl "~1.3.1"
-    send "0.13.2"
-
 set-blocking@^2.0.0, set-blocking@~2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/set-blocking/-/set-blocking-2.0.0.tgz#045f9782d011ae9a6803ddd382b24392b3d890f7"
@@ -18862,14 +17932,6 @@ simple-html-tokenizer@^0.5.7:
   version "0.1.1"
   resolved "git://github.com/CharlesMangwa/simple-markdown.git#33d963c760b8196bee01b1a5ba9974bc7f669af1"
 
-simple-plist@^0.2.1:
-  version "0.2.1"
-  resolved "https://registry.yarnpkg.com/simple-plist/-/simple-plist-0.2.1.tgz#71766db352326928cf3a807242ba762322636723"
-  dependencies:
-    bplist-creator "0.0.7"
-    bplist-parser "0.1.1"
-    plist "2.0.1"
-
 simple-sha1@^2.1.0:
   version "2.1.1"
   resolved "https://registry.yarnpkg.com/simple-sha1/-/simple-sha1-2.1.1.tgz#93f3b7f2e8dfdc056c32793e5d47b58d311b140d"
@@ -18920,7 +17982,7 @@ sliced@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/sliced/-/sliced-1.0.1.tgz#0b3a662b5d04c3177b1926bea82b03f837a2ef41"
 
-slide@^1.1.5, slide@^1.1.6:
+slide@^1.1.6:
   version "1.1.6"
   resolved "https://registry.yarnpkg.com/slide/-/slide-1.1.6.tgz#56eb027d65b4d2dce6cb2e2d32c4d4afc9e1d707"
 
@@ -19331,10 +18393,6 @@ stackframe@^1.0.4:
   version "1.0.4"
   resolved "https://registry.yarnpkg.com/stackframe/-/stackframe-1.0.4.tgz#357b24a992f9427cba6b545d96a14ed2cbca187b"
 
-stacktrace-parser@^0.1.3:
-  version "0.1.4"
-  resolved "https://registry.yarnpkg.com/stacktrace-parser/-/stacktrace-parser-0.1.4.tgz#01397922e5f62ecf30845522c95c4fe1d25e7d4e"
-
 staged-git-files@1.1.2:
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/staged-git-files/-/staged-git-files-1.1.2.tgz#4326d33886dc9ecfa29a6193bf511ba90a46454b"
@@ -19356,14 +18414,10 @@ stats-webpack-plugin@0.7.0:
   dependencies:
     lodash "^4.17.4"
 
-statuses@1, "statuses@>= 1.4.0 < 2", "statuses@>= 1.5.0 < 2":
+"statuses@>= 1.4.0 < 2", "statuses@>= 1.5.0 < 2":
   version "1.5.0"
   resolved "https://registry.yarnpkg.com/statuses/-/statuses-1.5.0.tgz#161c7dac177659fd9811f43771fa99381478628c"
 
-statuses@~1.2.1:
-  version "1.2.1"
-  resolved "https://registry.yarnpkg.com/statuses/-/statuses-1.2.1.tgz#dded45cc18256d51ed40aec142489d5c61026d28"
-
 statuses@~1.3.1:
   version "1.3.1"
   resolved "https://registry.yarnpkg.com/statuses/-/statuses-1.3.1.tgz#faf51b9eb74aaef3b3acf4ad5f61abf24cb7b93e"
@@ -19411,10 +18465,6 @@ stream-browserify@^2.0.0, stream-browserify@^2.0.1:
     inherits "~2.0.1"
     readable-stream "^2.0.2"
 
-stream-buffers@~2.2.0:
-  version "2.2.0"
-  resolved "https://registry.yarnpkg.com/stream-buffers/-/stream-buffers-2.2.0.tgz#91d5f5130d1cef96dcfa7f726945188741d09ee4"
-
 stream-combiner2@^1.1.1:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/stream-combiner2/-/stream-combiner2-1.1.1.tgz#fb4d8a1420ea362764e21ad4780397bebcb41cbe"
@@ -19422,12 +18472,6 @@ stream-combiner2@^1.1.1:
     duplexer2 "~0.1.0"
     readable-stream "^2.0.2"
 
-stream-counter@~0.2.0:
-  version "0.2.0"
-  resolved "https://registry.yarnpkg.com/stream-counter/-/stream-counter-0.2.0.tgz#ded266556319c8b0e222812b9cf3b26fa7d947de"
-  dependencies:
-    readable-stream "~1.1.8"
-
 stream-each@^1.1.0:
   version "1.2.3"
   resolved "https://registry.yarnpkg.com/stream-each/-/stream-each-1.2.3.tgz#ebe27a0c389b04fbcc233642952e10731afa9bae"
@@ -20016,7 +19060,7 @@ text-table@0.2.0, text-table@^0.2.0:
   version "2.4.0"
   resolved "https://registry.yarnpkg.com/textextensions/-/textextensions-2.4.0.tgz#6a143a985464384cc2cff11aea448cd5b018e72b"
 
-throat@^4.0.0, throat@^4.1.0:
+throat@^4.0.0:
   version "4.1.0"
   resolved "https://registry.yarnpkg.com/throat/-/throat-4.1.0.tgz#89037cbc92c56ab18926e6ba4cbb200e15672a6a"
 
@@ -20035,10 +19079,6 @@ thunky@^1.0.2:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/thunky/-/thunky-1.0.3.tgz#f5df732453407b09191dae73e2a8cc73f381a826"
 
-time-stamp@^1.0.0:
-  version "1.1.0"
-  resolved "https://registry.yarnpkg.com/time-stamp/-/time-stamp-1.1.0.tgz#764a5a11af50561921b133f3b44e618687e0f5c3"
-
 time-zone@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/time-zone/-/time-zone-1.0.0.tgz#99c5bf55958966af6d06d83bdf3800dc82faec5d"
@@ -20415,10 +19455,6 @@ tslint@^5.12.1, tslint@~5.12.1:
     tslib "^1.8.0"
     tsutils "^2.27.2"
 
-tsscmp@1.0.5:
-  version "1.0.5"
-  resolved "https://registry.yarnpkg.com/tsscmp/-/tsscmp-1.0.5.tgz#7dc4a33af71581ab4337da91d85ca5427ebd9a97"
-
 tsutils@^2.27.2, tsutils@^2.29.0:
   version "2.29.0"
   resolved "https://registry.yarnpkg.com/tsutils/-/tsutils-2.29.0.tgz#32b488501467acbedd4b85498673a0812aca0b99"
@@ -20469,7 +19505,7 @@ type-detect@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/type-detect/-/type-detect-1.0.0.tgz#762217cc06db258ec48908a1298e8b95121e8ea2"
 
-type-is@~1.6.16, type-is@~1.6.6:
+type-is@~1.6.16:
   version "1.6.16"
   resolved "https://registry.yarnpkg.com/type-is/-/type-is-1.6.16.tgz#f89ce341541c672b25ee7ae3c73dee3b2be50194"
   dependencies:
@@ -20509,7 +19545,7 @@ uc.micro@^1.0.1, uc.micro@^1.0.5:
   version "1.0.5"
   resolved "https://registry.yarnpkg.com/uc.micro/-/uc.micro-1.0.5.tgz#0c65f15f815aa08b560a61ce8b4db7ffc3f45376"
 
-uglify-es@^3.1.9, uglify-es@^3.3.4:
+uglify-es@^3.3.4:
   version "3.3.9"
   resolved "https://registry.yarnpkg.com/uglify-es/-/uglify-es-3.3.9.tgz#0c1c4f0700bed8dbc124cdb304d2592ca203e677"
   dependencies:
@@ -20540,26 +19576,6 @@ uid-number@0.0.6:
   version "0.0.6"
   resolved "https://registry.yarnpkg.com/uid-number/-/uid-number-0.0.6.tgz#0ea10e8035e8eb5b8e4449f06da1c730663baa81"
 
-uid-safe@2.1.4:
-  version "2.1.4"
-  resolved "https://registry.yarnpkg.com/uid-safe/-/uid-safe-2.1.4.tgz#3ad6f38368c6d4c8c75ec17623fb79aa1d071d81"
-  dependencies:
-    random-bytes "~1.0.0"
-
-uid-safe@~2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/uid-safe/-/uid-safe-2.0.0.tgz#a7f3c6ca64a1f6a5d04ec0ef3e4c3d5367317137"
-  dependencies:
-    base64-url "1.2.1"
-
-ultron@1.0.x:
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/ultron/-/ultron-1.0.2.tgz#ace116ab557cd197386a4e88f4685378c8b2e4fa"
-
-ultron@~1.1.0:
-  version "1.1.1"
-  resolved "https://registry.yarnpkg.com/ultron/-/ultron-1.1.1.tgz#9fe1536a10a664a65266a1e3ccf85fd36302bc9c"
-
 umask@^1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/umask/-/umask-1.1.0.tgz#f29cebf01df517912bb58ff9c4e50fde8e33320d"
@@ -20901,7 +19917,7 @@ username@^1.0.1:
   dependencies:
     meow "^3.4.0"
 
-util-deprecate@1.0.2, util-deprecate@^1.0.1, util-deprecate@^1.0.2, util-deprecate@~1.0.1:
+util-deprecate@^1.0.1, util-deprecate@^1.0.2, util-deprecate@~1.0.1:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/util-deprecate/-/util-deprecate-1.0.2.tgz#450d4dc9fa70de732762fbd2d4a28981419a0ccf"
 
@@ -20934,18 +19950,10 @@ utila@^0.4.0, utila@~0.4:
   version "0.4.0"
   resolved "https://registry.yarnpkg.com/utila/-/utila-0.4.0.tgz#8a16a05d445657a3aea5eecc5b12a4fa5379772c"
 
-utils-merge@1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/utils-merge/-/utils-merge-1.0.0.tgz#0294fb922bb9375153541c4f7096231f287c8af8"
-
 utils-merge@1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/utils-merge/-/utils-merge-1.0.1.tgz#9f95710f50a267947b2ccc124741c1028427e713"
 
-uuid@3.0.1:
-  version "3.0.1"
-  resolved "https://registry.yarnpkg.com/uuid/-/uuid-3.0.1.tgz#6544bba2dfda8c1cf17e629a3a305e2bb1fee6c1"
-
 uuid@^3.0.1, uuid@^3.1.0, uuid@^3.2.1, uuid@^3.3.2:
   version "3.3.2"
   resolved "https://registry.yarnpkg.com/uuid/-/uuid-3.3.2.tgz#1b4af4955eb3077c501c23872fc6513811587131"
@@ -20975,10 +19983,6 @@ vary@^1, vary@~1.1.2:
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/vary/-/vary-1.1.2.tgz#2299f02c6ded30d4a5961b0b9f74524a18f634fc"
 
-vary@~1.0.1:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/vary/-/vary-1.0.1.tgz#99e4981566a286118dfb2b817357df7993376d10"
-
 vendors@^1.0.0:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/vendors/-/vendors-1.0.2.tgz#7fcb5eef9f5623b156bcea89ec37d63676f21801"
@@ -21029,10 +20033,6 @@ vfile@^3.0.0, vfile@^3.0.1:
     unist-util-stringify-position "^1.0.0"
     vfile-message "^1.0.0"
 
-vhost@~3.0.1:
-  version "3.0.2"
-  resolved "https://registry.yarnpkg.com/vhost/-/vhost-3.0.2.tgz#2fb1decd4c466aa88b0f9341af33dc1aff2478d5"
-
 vm-browserify@0.0.4:
   version "0.0.4"
   resolved "https://registry.yarnpkg.com/vm-browserify/-/vm-browserify-0.0.4.tgz#5d7ea45bbef9e4a6ff65f95438e0a87c357d5a73"
@@ -21532,10 +20532,6 @@ whatwg-fetch@3.0.0, whatwg-fetch@>=0.10.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/whatwg-fetch/-/whatwg-fetch-3.0.0.tgz#fc804e458cc460009b1a2b966bc8817d2578aefb"
 
-whatwg-fetch@^1.0.0:
-  version "1.1.1"
-  resolved "https://registry.yarnpkg.com/whatwg-fetch/-/whatwg-fetch-1.1.1.tgz#ac3c9d39f320c6dce5339969d054ef43dd333319"
-
 whatwg-mimetype@^2.1.0, whatwg-mimetype@^2.2.0, whatwg-mimetype@^2.3.0:
   version "2.3.0"
   resolved "https://registry.yarnpkg.com/whatwg-mimetype/-/whatwg-mimetype-2.3.0.tgz#3d4b1e0312d2079879f826aff18dbeeca5960fbf"
@@ -21586,12 +20582,6 @@ widest-line@^2.0.0:
   dependencies:
     string-width "^2.1.1"
 
-win-release@^1.0.0:
-  version "1.1.1"
-  resolved "https://registry.yarnpkg.com/win-release/-/win-release-1.1.1.tgz#5fa55e02be7ca934edfc12665632e849b72e5209"
-  dependencies:
-    semver "^5.0.1"
-
 windows-release@^3.1.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/windows-release/-/windows-release-3.1.0.tgz#8d4a7e266cbf5a233f6c717dac19ce00af36e12e"
@@ -21755,14 +20745,6 @@ wrappy@1:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/wrappy/-/wrappy-1.0.2.tgz#b5243d8f3ec1aa35f1364605bc0d1036e30ab69f"
 
-write-file-atomic@^1.2.0:
-  version "1.3.4"
-  resolved "https://registry.yarnpkg.com/write-file-atomic/-/write-file-atomic-1.3.4.tgz#f807a4f0b1d9e913ae7a48112e6cc3af1991b45f"
-  dependencies:
-    graceful-fs "^4.1.11"
-    imurmurhash "^0.1.4"
-    slide "^1.1.5"
-
 write-file-atomic@^2.0.0, write-file-atomic@^2.1.0, write-file-atomic@^2.3.0:
   version "2.3.0"
   resolved "https://registry.yarnpkg.com/write-file-atomic/-/write-file-atomic-2.3.0.tgz#1ff61575c2e2a4e8e510d6fa4e243cce183999ab"
@@ -21795,20 +20777,6 @@ write@^0.2.1:
   dependencies:
     mkdirp "^0.5.1"
 
-ws@^1.1.0:
-  version "1.1.5"
-  resolved "https://registry.yarnpkg.com/ws/-/ws-1.1.5.tgz#cbd9e6e75e09fc5d2c90015f21f0c40875e0dd51"
-  dependencies:
-    options ">=0.0.5"
-    ultron "1.0.x"
-
-ws@^2.0.3:
-  version "2.3.1"
-  resolved "https://registry.yarnpkg.com/ws/-/ws-2.3.1.tgz#6b94b3e447cb6a363f785eaf94af6359e8e81c80"
-  dependencies:
-    safe-buffer "~5.0.1"
-    ultron "~1.1.0"
-
 ws@^5.2.0:
   version "5.2.2"
   resolved "https://registry.yarnpkg.com/ws/-/ws-5.2.2.tgz#dffef14866b8e8dc9133582514d1befaf96e980f"
@@ -21825,14 +20793,6 @@ x-is-string@^0.1.0:
   version "0.1.0"
   resolved "https://registry.yarnpkg.com/x-is-string/-/x-is-string-0.1.0.tgz#474b50865af3a49a9c4657f05acd145458f77d82"
 
-xcode@^0.9.1:
-  version "0.9.3"
-  resolved "https://registry.yarnpkg.com/xcode/-/xcode-0.9.3.tgz#910a89c16aee6cc0b42ca805a6d0b4cf87211cf3"
-  dependencies:
-    pegjs "^0.10.0"
-    simple-plist "^0.2.1"
-    uuid "3.0.1"
-
 xdg-basedir@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/xdg-basedir/-/xdg-basedir-3.0.0.tgz#496b2cc109eca8dbacfe2dc72b603c17c5870ad4"
@@ -21848,16 +20808,6 @@ xml2js@^0.4.17:
     sax ">=0.6.0"
     xmlbuilder "~9.0.1"
 
-xmlbuilder@4.0.0:
-  version "4.0.0"
-  resolved "https://registry.yarnpkg.com/xmlbuilder/-/xmlbuilder-4.0.0.tgz#98b8f651ca30aa624036f127d11cc66dc7b907a3"
-  dependencies:
-    lodash "^3.5.0"
-
-xmlbuilder@8.2.2:
-  version "8.2.2"
-  resolved "https://registry.yarnpkg.com/xmlbuilder/-/xmlbuilder-8.2.2.tgz#69248673410b4ba42e1a6136551d2922335aa773"
-
 xmlbuilder@~9.0.1:
   version "9.0.7"
   resolved "https://registry.yarnpkg.com/xmlbuilder/-/xmlbuilder-9.0.7.tgz#132ee63d2ec5565c557e20f4c22df9aca686b10d"
@@ -21866,13 +20816,7 @@ xmlchars@^1.3.1:
   version "1.3.1"
   resolved "https://registry.yarnpkg.com/xmlchars/-/xmlchars-1.3.1.tgz#1dda035f833dbb4f86a0c28eaa6ca769214793cf"
 
-xmldoc@^0.4.0:
-  version "0.4.0"
-  resolved "https://registry.yarnpkg.com/xmldoc/-/xmldoc-0.4.0.tgz#d257224be8393eaacbf837ef227fd8ec25b36888"
-  dependencies:
-    sax "~1.1.1"
-
-xmldom@0.1.x, xmldom@^0.1.19:
+xmldom@^0.1.19:
   version "0.1.27"
   resolved "https://registry.yarnpkg.com/xmldom/-/xmldom-0.1.27.tgz#d501f97b3bdb403af8ef9ecc20573187aadac0e9"
 
@@ -21880,10 +20824,6 @@ xmlhttprequest-ssl@~1.5.4:
   version "1.5.5"
   resolved "https://registry.yarnpkg.com/xmlhttprequest-ssl/-/xmlhttprequest-ssl-1.5.5.tgz#c2876b06168aadc40e57d97e81191ac8f4398b3e"
 
-xpipe@^1.0.5:
-  version "1.0.5"
-  resolved "https://registry.yarnpkg.com/xpipe/-/xpipe-1.0.5.tgz#8dd8bf45fc3f7f55f0e054b878f43a62614dafdf"
-
 xregexp@4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/xregexp/-/xregexp-4.0.0.tgz#e698189de49dd2a18cc5687b05e17c8e43943020"
@@ -21993,7 +20933,7 @@ yargs@6.6.0:
     y18n "^3.2.1"
     yargs-parser "^4.2.0"
 
-yargs@9.0.1, yargs@^9.0.0:
+yargs@9.0.1:
   version "9.0.1"
   resolved "https://registry.yarnpkg.com/yargs/-/yargs-9.0.1.tgz#52acc23feecac34042078ee78c0c007f5085db4c"
   dependencies:

From ee14568bcf97fa85ccbaee5a9a191b0745d811af Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Sat, 16 Feb 2019 17:42:55 +0800
Subject: [PATCH 016/249] Disable ondevice addons

---
 package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package.json b/package.json
index ce8fafcec97..03c022ef49c 100644
--- a/package.json
+++ b/package.json
@@ -7,7 +7,7 @@
     "url": "https://github.com/storybooks/storybook.git"
   },
   "workspaces": [
-    "addons/*",
+    "addons/!(ondevice)*",
     "addons/storyshots/*",
     "app/!(react-native)*",
     "lib/*",

From c6cbc86eae8fb0e4dd308b54c5133a8ca480f5d3 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Sat, 16 Feb 2019 17:50:33 +0800
Subject: [PATCH 017/249] Disable RN linting

---
 .eslintignore | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/.eslintignore b/.eslintignore
index 76cb54f8b1e..909aea6b614 100644
--- a/.eslintignore
+++ b/.eslintignore
@@ -18,3 +18,8 @@ lib/cli/test
 !.eslintrc-markdown.js
 !.jest.config.js
 !.storybook
+
+REACT_NATIVE
+examples-native
+react-native
+ondevice-*
\ No newline at end of file

From 4007bb798346bf947aee5e6e5e9b2f9978c0a528 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Sat, 16 Feb 2019 17:56:39 +0800
Subject: [PATCH 018/249] Fix yarn.lock

---
 yarn.lock | 50 --------------------------------------------------
 1 file changed, 50 deletions(-)

diff --git a/yarn.lock b/yarn.lock
index d5c24a77b71..676fa950a11 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -16305,56 +16305,10 @@ react-modal@^3.8.1:
     react-lifecycles-compat "^3.0.0"
     warning "^3.0.0"
 
-react-native-animatable@^1.2.4:
-  version "1.3.1"
-  resolved "https://registry.yarnpkg.com/react-native-animatable/-/react-native-animatable-1.3.1.tgz#f004a7e9de6838d0fbf210d642593cff7affd9ef"
-  dependencies:
-    prop-types "^15.5.10"
-
-react-native-color-picker@^0.4.0:
-  version "0.4.0"
-  resolved "https://registry.yarnpkg.com/react-native-color-picker/-/react-native-color-picker-0.4.0.tgz#801a413a20b833ea8aa9b10418c3761dd4d88fb6"
-  dependencies:
-    prop-types "^15.5.10"
-    tinycolor2 "^1.4.1"
-
-react-native-modal-datetime-picker@^5.1.0:
-  version "5.1.0"
-  resolved "https://registry.yarnpkg.com/react-native-modal-datetime-picker/-/react-native-modal-datetime-picker-5.1.0.tgz#6e183531170881c2ff5b0742d132060f828e2b77"
-  dependencies:
-    prop-types "^15.6.1"
-    react-native-modal "^5.4.0"
-
-react-native-modal-selector@^0.0.29:
-  version "0.0.29"
-  resolved "https://registry.yarnpkg.com/react-native-modal-selector/-/react-native-modal-selector-0.0.29.tgz#e33326a9191ce6a6ed07c222366eb13ba5e03e21"
-  dependencies:
-    prop-types "^15.5.10"
-
-react-native-modal@^5.4.0:
-  version "5.4.0"
-  resolved "https://registry.yarnpkg.com/react-native-modal/-/react-native-modal-5.4.0.tgz#95f70b5d68e08824951cd11038b9db2d6fdb9962"
-  dependencies:
-    prop-types "^15.6.1"
-    react-native-animatable "^1.2.4"
-
-react-native-simple-markdown@^1.1.0:
-  version "1.1.0"
-  resolved "https://registry.yarnpkg.com/react-native-simple-markdown/-/react-native-simple-markdown-1.1.0.tgz#4d462f8ced26393c5230467420c61a50cc6a8095"
-  dependencies:
-    lodash "^4.15.0"
-    simple-markdown "git://github.com/CharlesMangwa/simple-markdown.git"
-
 react-native-swipe-gestures@^1.0.2:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/react-native-swipe-gestures/-/react-native-swipe-gestures-1.0.3.tgz#4160f8d459627323f3a3d2770af4bcd82fd054f5"
 
-react-native-switch@^1.5.0:
-  version "1.5.0"
-  resolved "https://registry.yarnpkg.com/react-native-switch/-/react-native-switch-1.5.0.tgz#a5c8e72f87def649d1c9de027c5ae27e2037ea40"
-  dependencies:
-    prop-types "^15.6.0"
-
 react-popper-tooltip@^2.8.0:
   version "2.8.0"
   resolved "https://registry.yarnpkg.com/react-popper-tooltip/-/react-popper-tooltip-2.8.0.tgz#777e710e4696bd1b8e1a1ef24a6e3375e0206609"
@@ -17928,10 +17882,6 @@ simple-html-tokenizer@^0.5.7:
   version "0.5.7"
   resolved "https://registry.yarnpkg.com/simple-html-tokenizer/-/simple-html-tokenizer-0.5.7.tgz#8eca336ecfbe2b3c6166cbb31b2682088de79f40"
 
-"simple-markdown@git://github.com/CharlesMangwa/simple-markdown.git":
-  version "0.1.1"
-  resolved "git://github.com/CharlesMangwa/simple-markdown.git#33d963c760b8196bee01b1a5ba9974bc7f669af1"
-
 simple-sha1@^2.1.0:
   version "2.1.1"
   resolved "https://registry.yarnpkg.com/simple-sha1/-/simple-sha1-2.1.1.tgz#93f3b7f2e8dfdc056c32793e5d47b58d311b140d"

From 8597d208042b8d2f395ef7a4fa0e80fc445eb4a0 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Sat, 16 Feb 2019 22:36:07 +0800
Subject: [PATCH 019/249] 5.0.0-rc.0 changelog

---
 CHANGELOG.md | 14 ++++++++++++++
 1 file changed, 14 insertions(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index a4f5834cda9..bdf466130c5 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,17 @@
+## 5.0.0-rc.0 (February 16, 2019)
+
+Welcome to Storybook 5 (SB5) with a beautiful new user interface including:
+
+* Navigation sidebar redesign
+* New canvas toolbar 
+* Customizable keyboard shortcuts
+* Improved search
+* Version update notifications
+
+SB5 also includes a new URL structure, expanded addon API, and many more features and architectural improvements.
+
+See [the RC announcement](https://gist.github.com/shilman/0332090b63f1798a58ed8d85db44f4b4) for more details!
+
 ## 5.0.0-beta.4 (February 15, 2019)
 
 ### Bug Fixes

From 93ad5297b92b4dc797961c4377cece1c5b780a61 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Sat, 16 Feb 2019 22:48:27 +0800
Subject: [PATCH 020/249] v5.0.0-rc.0

---
 addons/a11y/package.json                      | 12 ++---
 addons/actions/package.json                   | 10 ++--
 addons/backgrounds/package.json               | 12 ++---
 addons/centered/package.json                  |  2 +-
 addons/cssresources/package.json              | 10 ++--
 addons/events/package.json                    |  8 +--
 addons/google-analytics/package.json          |  6 +--
 addons/graphql/package.json                   |  2 +-
 addons/info/package.json                      | 10 ++--
 addons/jest/package.json                      | 10 ++--
 addons/knobs/package.json                     | 10 ++--
 addons/links/package.json                     |  6 +--
 addons/notes/package.json                     | 12 ++---
 addons/options/package.json                   |  4 +-
 .../storyshots/storyshots-core/package.json   |  4 +-
 .../storyshots-puppeteer/package.json         |  6 +--
 addons/storysource/package.json               |  8 +--
 addons/viewport/package.json                  | 12 ++---
 app/angular/package.json                      |  6 +--
 app/ember/package.json                        |  4 +-
 app/html/package.json                         |  4 +-
 app/marko/package.json                        |  4 +-
 app/mithril/package.json                      |  4 +-
 app/polymer/package.json                      |  4 +-
 app/preact/package.json                       |  4 +-
 app/react/package.json                        |  8 +--
 app/riot/package.json                         |  4 +-
 app/svelte/package.json                       |  4 +-
 app/vue/package.json                          |  4 +-
 examples/angular-cli/package.json             | 26 +++++-----
 examples/cra-kitchen-sink/package.json        | 32 ++++++------
 examples/cra-ts-kitchen-sink/package.json     | 12 ++---
 examples/ember-cli/package.json               | 26 +++++-----
 examples/html-kitchen-sink/package.json       | 36 ++++++-------
 examples/marko-cli/package.json               | 14 ++---
 examples/mithril-kitchen-sink/package.json    | 26 +++++-----
 examples/official-storybook/package.json      | 48 ++++++++---------
 examples/polymer-cli/package.json             | 20 +++----
 examples/preact-kitchen-sink/package.json     | 26 +++++-----
 examples/riot-kitchen-sink/package.json       | 26 +++++-----
 examples/svelte-kitchen-sink/package.json     | 26 +++++-----
 examples/vue-kitchen-sink/package.json        | 26 +++++-----
 lerna.json                                    |  2 +-
 lib/addons/package.json                       |  6 +--
 lib/channel-postmessage/package.json          |  4 +-
 lib/channel-websocket/package.json            |  4 +-
 lib/channels/package.json                     |  2 +-
 lib/cli/package.json                          | 52 +++++++++----------
 lib/client-api/package.json                   |  8 +--
 lib/client-logger/package.json                |  2 +-
 lib/codemod/package.json                      |  2 +-
 lib/components/package.json                   | 12 ++---
 lib/core-events/package.json                  |  2 +-
 lib/core/package.json                         | 18 +++----
 lib/node-logger/package.json                  |  2 +-
 lib/router/package.json                       |  4 +-
 lib/theming/package.json                      |  2 +-
 lib/ui/package.json                           | 14 ++---
 58 files changed, 337 insertions(+), 337 deletions(-)

diff --git a/addons/a11y/package.json b/addons/a11y/package.json
index d55c7332cca..fac9e8049cd 100644
--- a/addons/a11y/package.json
+++ b/addons/a11y/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-a11y",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "description": "a11y addon for storybook",
   "keywords": [
     "a11y",
@@ -25,11 +25,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-beta.4",
-    "@storybook/client-logger": "5.0.0-beta.4",
-    "@storybook/components": "5.0.0-beta.4",
-    "@storybook/core-events": "5.0.0-beta.4",
-    "@storybook/theming": "5.0.0-beta.4",
+    "@storybook/addons": "5.0.0-rc.0",
+    "@storybook/client-logger": "5.0.0-rc.0",
+    "@storybook/components": "5.0.0-rc.0",
+    "@storybook/core-events": "5.0.0-rc.0",
+    "@storybook/theming": "5.0.0-rc.0",
     "axe-core": "^3.1.2",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
diff --git a/addons/actions/package.json b/addons/actions/package.json
index b3b7f565665..71c3317721c 100644
--- a/addons/actions/package.json
+++ b/addons/actions/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-actions",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "description": "Action Logger addon for storybook",
   "keywords": [
     "storybook"
@@ -20,10 +20,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-beta.4",
-    "@storybook/components": "5.0.0-beta.4",
-    "@storybook/core-events": "5.0.0-beta.4",
-    "@storybook/theming": "5.0.0-beta.4",
+    "@storybook/addons": "5.0.0-rc.0",
+    "@storybook/components": "5.0.0-rc.0",
+    "@storybook/core-events": "5.0.0-rc.0",
+    "@storybook/theming": "5.0.0-rc.0",
     "core-js": "^2.6.2",
     "fast-deep-equal": "^2.0.1",
     "global": "^4.3.2",
diff --git a/addons/backgrounds/package.json b/addons/backgrounds/package.json
index 539ea4549a7..5af298c9506 100644
--- a/addons/backgrounds/package.json
+++ b/addons/backgrounds/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-backgrounds",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "description": "A storybook addon to show different backgrounds for your preview",
   "keywords": [
     "addon",
@@ -24,11 +24,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-beta.4",
-    "@storybook/client-logger": "5.0.0-beta.4",
-    "@storybook/components": "5.0.0-beta.4",
-    "@storybook/core-events": "5.0.0-beta.4",
-    "@storybook/theming": "5.0.0-beta.4",
+    "@storybook/addons": "5.0.0-rc.0",
+    "@storybook/client-logger": "5.0.0-rc.0",
+    "@storybook/components": "5.0.0-rc.0",
+    "@storybook/core-events": "5.0.0-rc.0",
+    "@storybook/theming": "5.0.0-rc.0",
     "core-js": "^2.6.2",
     "eventemitter3": "^3.1.0",
     "global": "^4.3.2",
diff --git a/addons/centered/package.json b/addons/centered/package.json
index 73336a6f20c..94c56176501 100644
--- a/addons/centered/package.json
+++ b/addons/centered/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-centered",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "description": "Storybook decorator to center components",
   "keywords": [
     "addon",
diff --git a/addons/cssresources/package.json b/addons/cssresources/package.json
index a55c5450d4e..cac4d23f7bd 100644
--- a/addons/cssresources/package.json
+++ b/addons/cssresources/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-cssresources",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "description": "A storybook addon to switch between css resources at runtime for your story",
   "keywords": [
     "addon",
@@ -25,10 +25,10 @@
   },
   "dependencies": {
     "@emotion/styled": "10.0.6",
-    "@storybook/addons": "5.0.0-beta.4",
-    "@storybook/channels": "5.0.0-beta.4",
-    "@storybook/components": "5.0.0-beta.4",
-    "@storybook/core-events": "5.0.0-beta.4",
+    "@storybook/addons": "5.0.0-rc.0",
+    "@storybook/channels": "5.0.0-rc.0",
+    "@storybook/components": "5.0.0-rc.0",
+    "@storybook/core-events": "5.0.0-rc.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "prop-types": "^15.6.2",
diff --git a/addons/events/package.json b/addons/events/package.json
index e4d28cc4b80..df295af9a7c 100644
--- a/addons/events/package.json
+++ b/addons/events/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-events",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "description": "Add events to your Storybook stories.",
   "keywords": [
     "addon",
@@ -23,9 +23,9 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-beta.4",
-    "@storybook/core-events": "5.0.0-beta.4",
-    "@storybook/theming": "5.0.0-beta.4",
+    "@storybook/addons": "5.0.0-rc.0",
+    "@storybook/core-events": "5.0.0-rc.0",
+    "@storybook/theming": "5.0.0-rc.0",
     "core-js": "^2.6.2",
     "format-json": "^1.0.3",
     "prop-types": "^15.6.2",
diff --git a/addons/google-analytics/package.json b/addons/google-analytics/package.json
index 6b2b8967120..7c5a1e2a542 100644
--- a/addons/google-analytics/package.json
+++ b/addons/google-analytics/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-google-analytics",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "description": "Storybook addon for google analytics",
   "keywords": [
     "addon",
@@ -19,8 +19,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-beta.4",
-    "@storybook/core-events": "5.0.0-beta.4",
+    "@storybook/addons": "5.0.0-rc.0",
+    "@storybook/core-events": "5.0.0-rc.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "react-ga": "^2.5.3"
diff --git a/addons/graphql/package.json b/addons/graphql/package.json
index 714de703e65..474891b664e 100644
--- a/addons/graphql/package.json
+++ b/addons/graphql/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-graphql",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "description": "Storybook addon to display the GraphiQL IDE",
   "keywords": [
     "addon",
diff --git a/addons/info/package.json b/addons/info/package.json
index 2e3fec65952..89123b151e7 100644
--- a/addons/info/package.json
+++ b/addons/info/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-info",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "description": "A Storybook addon to show additional information for your stories.",
   "keywords": [
     "addon",
@@ -21,10 +21,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-beta.4",
-    "@storybook/client-logger": "5.0.0-beta.4",
-    "@storybook/components": "5.0.0-beta.4",
-    "@storybook/theming": "5.0.0-beta.4",
+    "@storybook/addons": "5.0.0-rc.0",
+    "@storybook/client-logger": "5.0.0-rc.0",
+    "@storybook/components": "5.0.0-rc.0",
+    "@storybook/theming": "5.0.0-rc.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "marksy": "^6.1.0",
diff --git a/addons/jest/package.json b/addons/jest/package.json
index 94378639e6e..106c9a7f665 100644
--- a/addons/jest/package.json
+++ b/addons/jest/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-jest",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "description": "React storybook addon that show component jest report",
   "keywords": [
     "addon",
@@ -27,10 +27,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-beta.4",
-    "@storybook/components": "5.0.0-beta.4",
-    "@storybook/core-events": "5.0.0-beta.4",
-    "@storybook/theming": "5.0.0-beta.4",
+    "@storybook/addons": "5.0.0-rc.0",
+    "@storybook/components": "5.0.0-rc.0",
+    "@storybook/core-events": "5.0.0-rc.0",
+    "@storybook/theming": "5.0.0-rc.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "prop-types": "^15.6.2",
diff --git a/addons/knobs/package.json b/addons/knobs/package.json
index 55d1de85d35..9d2d2a7c6d4 100644
--- a/addons/knobs/package.json
+++ b/addons/knobs/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-knobs",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "description": "Storybook Addon Prop Editor Component",
   "keywords": [
     "addon",
@@ -21,10 +21,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-beta.4",
-    "@storybook/components": "5.0.0-beta.4",
-    "@storybook/core-events": "5.0.0-beta.4",
-    "@storybook/theming": "5.0.0-beta.4",
+    "@storybook/addons": "5.0.0-rc.0",
+    "@storybook/components": "5.0.0-rc.0",
+    "@storybook/core-events": "5.0.0-rc.0",
+    "@storybook/theming": "5.0.0-rc.0",
     "copy-to-clipboard": "^3.0.8",
     "core-js": "^2.6.2",
     "escape-html": "^1.0.3",
diff --git a/addons/links/package.json b/addons/links/package.json
index 0b00bae7d09..f41d10b46b0 100644
--- a/addons/links/package.json
+++ b/addons/links/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-links",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "description": "Story Links addon for storybook",
   "keywords": [
     "addon",
@@ -21,8 +21,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-beta.4",
-    "@storybook/core-events": "5.0.0-beta.4",
+    "@storybook/addons": "5.0.0-rc.0",
+    "@storybook/core-events": "5.0.0-rc.0",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/addons/notes/package.json b/addons/notes/package.json
index 79efc547434..06581f9191b 100644
--- a/addons/notes/package.json
+++ b/addons/notes/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-notes",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "description": "Write notes for your Storybook stories.",
   "keywords": [
     "addon",
@@ -22,11 +22,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-beta.4",
-    "@storybook/client-logger": "5.0.0-beta.4",
-    "@storybook/components": "5.0.0-beta.4",
-    "@storybook/core-events": "5.0.0-beta.4",
-    "@storybook/theming": "5.0.0-beta.4",
+    "@storybook/addons": "5.0.0-rc.0",
+    "@storybook/client-logger": "5.0.0-rc.0",
+    "@storybook/components": "5.0.0-rc.0",
+    "@storybook/core-events": "5.0.0-rc.0",
+    "@storybook/theming": "5.0.0-rc.0",
     "markdown-to-jsx": "^6.9.1",
     "prop-types": "^15.6.2",
     "util-deprecate": "^1.0.2"
diff --git a/addons/options/package.json b/addons/options/package.json
index 62ce0769d02..94ac709d962 100644
--- a/addons/options/package.json
+++ b/addons/options/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-options",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "description": "Options addon for storybook",
   "keywords": [
     "addon",
@@ -20,7 +20,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-beta.4",
+    "@storybook/addons": "5.0.0-rc.0",
     "core-js": "^2.6.2",
     "util-deprecate": "^1.0.2"
   },
diff --git a/addons/storyshots/storyshots-core/package.json b/addons/storyshots/storyshots-core/package.json
index 4fac105b7f6..c972ab89b64 100644
--- a/addons/storyshots/storyshots-core/package.json
+++ b/addons/storyshots/storyshots-core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storyshots",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "description": "StoryShots is a Jest Snapshot Testing Addon for Storybook.",
   "keywords": [
     "addon",
@@ -24,7 +24,7 @@
     "storybook": "start-storybook -p 6006"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-beta.4",
+    "@storybook/addons": "5.0.0-rc.0",
     "core-js": "^2.6.2",
     "glob": "^7.1.3",
     "global": "^4.3.2",
diff --git a/addons/storyshots/storyshots-puppeteer/package.json b/addons/storyshots/storyshots-puppeteer/package.json
index 8851cb6753c..c965609c873 100644
--- a/addons/storyshots/storyshots-puppeteer/package.json
+++ b/addons/storyshots/storyshots-puppeteer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storyshots-puppeteer",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "description": "Image snappshots addition to StoryShots base on puppeteer",
   "keywords": [
     "addon",
@@ -21,8 +21,8 @@
     "prepare": "node ../../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-beta.4",
-    "@storybook/node-logger": "5.0.0-beta.4",
+    "@storybook/core": "5.0.0-rc.0",
+    "@storybook/node-logger": "5.0.0-rc.0",
     "core-js": "^2.6.2",
     "jest-image-snapshot": "^2.6.0",
     "puppeteer": "^1.12.0",
diff --git a/addons/storysource/package.json b/addons/storysource/package.json
index bbfb4ba12e7..1b3518c2475 100644
--- a/addons/storysource/package.json
+++ b/addons/storysource/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storysource",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "description": "Stories addon for storybook",
   "keywords": [
     "addon",
@@ -21,9 +21,9 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-beta.4",
-    "@storybook/components": "5.0.0-beta.4",
-    "@storybook/theming": "5.0.0-beta.4",
+    "@storybook/addons": "5.0.0-rc.0",
+    "@storybook/components": "5.0.0-rc.0",
+    "@storybook/theming": "5.0.0-rc.0",
     "core-js": "^2.6.2",
     "estraverse": "^4.2.0",
     "loader-utils": "^1.2.1",
diff --git a/addons/viewport/package.json b/addons/viewport/package.json
index 45d1101a312..83bbdfab550 100644
--- a/addons/viewport/package.json
+++ b/addons/viewport/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-viewport",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "description": "Storybook addon to change the viewport size to mobile",
   "keywords": [
     "addon",
@@ -20,11 +20,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-beta.4",
-    "@storybook/client-logger": "5.0.0-beta.4",
-    "@storybook/components": "5.0.0-beta.4",
-    "@storybook/core-events": "5.0.0-beta.4",
-    "@storybook/theming": "5.0.0-beta.4",
+    "@storybook/addons": "5.0.0-rc.0",
+    "@storybook/client-logger": "5.0.0-rc.0",
+    "@storybook/components": "5.0.0-rc.0",
+    "@storybook/core-events": "5.0.0-rc.0",
+    "@storybook/theming": "5.0.0-rc.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
diff --git a/app/angular/package.json b/app/angular/package.json
index c27e3529e53..2aba06f40c1 100644
--- a/app/angular/package.json
+++ b/app/angular/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/angular",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "description": "Storybook for Angular: Develop Angular Components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,8 +25,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-beta.4",
-    "@storybook/node-logger": "5.0.0-beta.4",
+    "@storybook/core": "5.0.0-rc.0",
+    "@storybook/node-logger": "5.0.0-rc.0",
     "angular2-template-loader": "^0.6.2",
     "core-js": "^2.6.2",
     "fork-ts-checker-webpack-plugin": "^0.5.2",
diff --git a/app/ember/package.json b/app/ember/package.json
index 6cccd99a7ae..e13db176821 100644
--- a/app/ember/package.json
+++ b/app/ember/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/ember",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "description": "Storybook for Ember: Develop Ember Component in isolation with Hot Reloading.",
   "homepage": "https://github.com/storybooks/storybook/tree/master/app/ember",
   "bugs": {
@@ -23,7 +23,7 @@
   },
   "dependencies": {
     "@ember/test-helpers": "^1.3.1",
-    "@storybook/core": "5.0.0-beta.4",
+    "@storybook/core": "5.0.0-rc.0",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/html/package.json b/app/html/package.json
index 75847ac2e46..5c4c8970dd2 100644
--- a/app/html/package.json
+++ b/app/html/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/html",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "description": "Storybook for HTML: View HTML snippets in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-beta.4",
+    "@storybook/core": "5.0.0-rc.0",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/marko/package.json b/app/marko/package.json
index 16c680df696..d52a4e5809c 100644
--- a/app/marko/package.json
+++ b/app/marko/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/marko",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "description": "Storybook for Marko: Develop Marko Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-beta.4",
+    "@storybook/core": "5.0.0-rc.0",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/mithril/package.json b/app/mithril/package.json
index 1f6ab7b7570..59cbe3015bd 100644
--- a/app/mithril/package.json
+++ b/app/mithril/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/mithril",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "description": "Storybook for Mithril: Develop Mithril Component in isolation.",
   "keywords": [
     "storybook"
@@ -26,7 +26,7 @@
   },
   "dependencies": {
     "@babel/plugin-transform-react-jsx": "^7.3.0",
-    "@storybook/core": "5.0.0-beta.4",
+    "@storybook/core": "5.0.0-rc.0",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/polymer/package.json b/app/polymer/package.json
index 9e3746aea7c..5a2b13ef941 100644
--- a/app/polymer/package.json
+++ b/app/polymer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/polymer",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "description": "Storybook for Polymer: Develop Polymer components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-beta.4",
+    "@storybook/core": "5.0.0-rc.0",
     "@webcomponents/webcomponentsjs": "^1.2.0",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
diff --git a/app/preact/package.json b/app/preact/package.json
index 77db5bbc4c3..68321f54d65 100644
--- a/app/preact/package.json
+++ b/app/preact/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/preact",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "description": "Storybook for Preact: Develop Preact Component in isolation.",
   "keywords": [
     "storybook"
@@ -26,7 +26,7 @@
   },
   "dependencies": {
     "@babel/plugin-transform-react-jsx": "^7.3.0",
-    "@storybook/core": "5.0.0-beta.4",
+    "@storybook/core": "5.0.0-rc.0",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/react/package.json b/app/react/package.json
index c5b6cd9fe7e..ed11da3511a 100644
--- a/app/react/package.json
+++ b/app/react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/react",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "description": "Storybook for React: Develop React Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -28,9 +28,9 @@
     "@babel/plugin-transform-react-constant-elements": "^7.2.0",
     "@babel/preset-flow": "^7.0.0",
     "@babel/preset-react": "^7.0.0",
-    "@storybook/core": "5.0.0-beta.4",
-    "@storybook/node-logger": "5.0.0-beta.4",
-    "@storybook/theming": "5.0.0-beta.4",
+    "@storybook/core": "5.0.0-rc.0",
+    "@storybook/node-logger": "5.0.0-rc.0",
+    "@storybook/theming": "5.0.0-rc.0",
     "@svgr/webpack": "^4.0.3",
     "babel-plugin-named-asset-import": "^0.3.0",
     "babel-plugin-react-docgen": "^2.0.2",
diff --git a/app/riot/package.json b/app/riot/package.json
index d5d2f41081b..cd417586292 100644
--- a/app/riot/package.json
+++ b/app/riot/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/riot",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "description": "Storybook for riot.js: View riot snippets in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-beta.4",
+    "@storybook/core": "5.0.0-rc.0",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/svelte/package.json b/app/svelte/package.json
index 0f3ee3a62ae..528bffd6555 100644
--- a/app/svelte/package.json
+++ b/app/svelte/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/svelte",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "description": "Storybook for Svelte: Develop Svelte Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-beta.4",
+    "@storybook/core": "5.0.0-rc.0",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/vue/package.json b/app/vue/package.json
index d95318bc64b..f9428fcb187 100644
--- a/app/vue/package.json
+++ b/app/vue/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/vue",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "description": "Storybook for Vue: Develop Vue Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-beta.4",
+    "@storybook/core": "5.0.0-rc.0",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/examples/angular-cli/package.json b/examples/angular-cli/package.json
index b26cb3e0e1e..c6e3b0028c8 100644
--- a/examples/angular-cli/package.json
+++ b/examples/angular-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "angular-cli",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "private": true,
   "license": "MIT",
   "scripts": {
@@ -33,18 +33,18 @@
     "@angular-devkit/build-angular": "^0.11.4",
     "@angular/cli": "^7.3.0",
     "@angular/compiler-cli": "^7.2.1",
-    "@storybook/addon-actions": "5.0.0-beta.4",
-    "@storybook/addon-backgrounds": "5.0.0-beta.4",
-    "@storybook/addon-centered": "5.0.0-beta.4",
-    "@storybook/addon-jest": "5.0.0-beta.4",
-    "@storybook/addon-knobs": "5.0.0-beta.4",
-    "@storybook/addon-links": "5.0.0-beta.4",
-    "@storybook/addon-notes": "5.0.0-beta.4",
-    "@storybook/addon-options": "5.0.0-beta.4",
-    "@storybook/addon-storyshots": "5.0.0-beta.4",
-    "@storybook/addon-storysource": "5.0.0-beta.4",
-    "@storybook/addons": "5.0.0-beta.4",
-    "@storybook/angular": "5.0.0-beta.4",
+    "@storybook/addon-actions": "5.0.0-rc.0",
+    "@storybook/addon-backgrounds": "5.0.0-rc.0",
+    "@storybook/addon-centered": "5.0.0-rc.0",
+    "@storybook/addon-jest": "5.0.0-rc.0",
+    "@storybook/addon-knobs": "5.0.0-rc.0",
+    "@storybook/addon-links": "5.0.0-rc.0",
+    "@storybook/addon-notes": "5.0.0-rc.0",
+    "@storybook/addon-options": "5.0.0-rc.0",
+    "@storybook/addon-storyshots": "5.0.0-rc.0",
+    "@storybook/addon-storysource": "5.0.0-rc.0",
+    "@storybook/addons": "5.0.0-rc.0",
+    "@storybook/angular": "5.0.0-rc.0",
     "@types/core-js": "^2.5.0",
     "@types/jest": "^23.3.13",
     "@types/node": "~10.12.19",
diff --git a/examples/cra-kitchen-sink/package.json b/examples/cra-kitchen-sink/package.json
index f36f510aa3e..cad7b978b59 100644
--- a/examples/cra-kitchen-sink/package.json
+++ b/examples/cra-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "cra-kitchen-sink",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "private": true,
   "scripts": {
     "build": "react-scripts build",
@@ -18,21 +18,21 @@
     "react-lifecycles-compat": "^3.0.4"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.0.0-beta.4",
-    "@storybook/addon-actions": "5.0.0-beta.4",
-    "@storybook/addon-backgrounds": "5.0.0-beta.4",
-    "@storybook/addon-centered": "5.0.0-beta.4",
-    "@storybook/addon-events": "5.0.0-beta.4",
-    "@storybook/addon-info": "5.0.0-beta.4",
-    "@storybook/addon-jest": "5.0.0-beta.4",
-    "@storybook/addon-knobs": "5.0.0-beta.4",
-    "@storybook/addon-links": "5.0.0-beta.4",
-    "@storybook/addon-notes": "5.0.0-beta.4",
-    "@storybook/addon-options": "5.0.0-beta.4",
-    "@storybook/addon-storyshots": "5.0.0-beta.4",
-    "@storybook/addons": "5.0.0-beta.4",
-    "@storybook/client-logger": "5.0.0-beta.4",
-    "@storybook/react": "5.0.0-beta.4",
+    "@storybook/addon-a11y": "5.0.0-rc.0",
+    "@storybook/addon-actions": "5.0.0-rc.0",
+    "@storybook/addon-backgrounds": "5.0.0-rc.0",
+    "@storybook/addon-centered": "5.0.0-rc.0",
+    "@storybook/addon-events": "5.0.0-rc.0",
+    "@storybook/addon-info": "5.0.0-rc.0",
+    "@storybook/addon-jest": "5.0.0-rc.0",
+    "@storybook/addon-knobs": "5.0.0-rc.0",
+    "@storybook/addon-links": "5.0.0-rc.0",
+    "@storybook/addon-notes": "5.0.0-rc.0",
+    "@storybook/addon-options": "5.0.0-rc.0",
+    "@storybook/addon-storyshots": "5.0.0-rc.0",
+    "@storybook/addons": "5.0.0-rc.0",
+    "@storybook/client-logger": "5.0.0-rc.0",
+    "@storybook/react": "5.0.0-rc.0",
     "enzyme": "^3.7.0",
     "enzyme-adapter-react-16": "^1.9.1",
     "enzyme-to-json": "^3.3.4",
diff --git a/examples/cra-ts-kitchen-sink/package.json b/examples/cra-ts-kitchen-sink/package.json
index 660abfd089a..64b19007079 100644
--- a/examples/cra-ts-kitchen-sink/package.json
+++ b/examples/cra-ts-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "cra-ts-kitchen-sink",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook -s public",
@@ -19,11 +19,11 @@
     "react-dom": "^16.8.1"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-beta.4",
-    "@storybook/addon-info": "5.0.0-beta.4",
-    "@storybook/addon-options": "5.0.0-beta.4",
-    "@storybook/addons": "5.0.0-beta.4",
-    "@storybook/react": "5.0.0-beta.4",
+    "@storybook/addon-actions": "5.0.0-rc.0",
+    "@storybook/addon-info": "5.0.0-rc.0",
+    "@storybook/addon-options": "5.0.0-rc.0",
+    "@storybook/addons": "5.0.0-rc.0",
+    "@storybook/react": "5.0.0-rc.0",
     "@types/enzyme": "^3.1.15",
     "@types/react": "^16.7.22",
     "@types/react-dom": "^16.0.11",
diff --git a/examples/ember-cli/package.json b/examples/ember-cli/package.json
index db56dab3f9e..e0dfee166e0 100644
--- a/examples/ember-cli/package.json
+++ b/examples/ember-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "ember-example",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "private": true,
   "scripts": {
     "build": "ember build",
@@ -14,18 +14,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.2.2",
-    "@storybook/addon-a11y": "5.0.0-beta.4",
-    "@storybook/addon-actions": "5.0.0-beta.4",
-    "@storybook/addon-backgrounds": "5.0.0-beta.4",
-    "@storybook/addon-centered": "5.0.0-beta.4",
-    "@storybook/addon-knobs": "5.0.0-beta.4",
-    "@storybook/addon-links": "5.0.0-beta.4",
-    "@storybook/addon-notes": "5.0.0-beta.4",
-    "@storybook/addon-options": "5.0.0-beta.4",
-    "@storybook/addon-storysource": "5.0.0-beta.4",
-    "@storybook/addon-viewport": "5.0.0-beta.4",
-    "@storybook/addons": "5.0.0-beta.4",
-    "@storybook/ember": "5.0.0-beta.4",
+    "@storybook/addon-a11y": "5.0.0-rc.0",
+    "@storybook/addon-actions": "5.0.0-rc.0",
+    "@storybook/addon-backgrounds": "5.0.0-rc.0",
+    "@storybook/addon-centered": "5.0.0-rc.0",
+    "@storybook/addon-knobs": "5.0.0-rc.0",
+    "@storybook/addon-links": "5.0.0-rc.0",
+    "@storybook/addon-notes": "5.0.0-rc.0",
+    "@storybook/addon-options": "5.0.0-rc.0",
+    "@storybook/addon-storysource": "5.0.0-rc.0",
+    "@storybook/addon-viewport": "5.0.0-rc.0",
+    "@storybook/addons": "5.0.0-rc.0",
+    "@storybook/ember": "5.0.0-rc.0",
     "babel-loader": "^8",
     "broccoli-asset-rev": "^3.0.0",
     "cross-env": "^5.2.0",
diff --git a/examples/html-kitchen-sink/package.json b/examples/html-kitchen-sink/package.json
index 3b821976971..4c86625d181 100644
--- a/examples/html-kitchen-sink/package.json
+++ b/examples/html-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "html-kitchen-sink",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "private": true,
   "description": "",
   "keywords": [],
@@ -13,23 +13,23 @@
     "storybook": "start-storybook -p 9006"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.0.0-beta.4",
-    "@storybook/addon-actions": "5.0.0-beta.4",
-    "@storybook/addon-backgrounds": "5.0.0-beta.4",
-    "@storybook/addon-centered": "5.0.0-beta.4",
-    "@storybook/addon-events": "5.0.0-beta.4",
-    "@storybook/addon-jest": "5.0.0-beta.4",
-    "@storybook/addon-knobs": "5.0.0-beta.4",
-    "@storybook/addon-links": "5.0.0-beta.4",
-    "@storybook/addon-notes": "5.0.0-beta.4",
-    "@storybook/addon-options": "5.0.0-beta.4",
-    "@storybook/addon-storyshots": "5.0.0-beta.4",
-    "@storybook/addon-storysource": "5.0.0-beta.4",
-    "@storybook/addon-viewport": "5.0.0-beta.4",
-    "@storybook/addons": "5.0.0-beta.4",
-    "@storybook/core": "5.0.0-beta.4",
-    "@storybook/core-events": "5.0.0-beta.4",
-    "@storybook/html": "5.0.0-beta.4",
+    "@storybook/addon-a11y": "5.0.0-rc.0",
+    "@storybook/addon-actions": "5.0.0-rc.0",
+    "@storybook/addon-backgrounds": "5.0.0-rc.0",
+    "@storybook/addon-centered": "5.0.0-rc.0",
+    "@storybook/addon-events": "5.0.0-rc.0",
+    "@storybook/addon-jest": "5.0.0-rc.0",
+    "@storybook/addon-knobs": "5.0.0-rc.0",
+    "@storybook/addon-links": "5.0.0-rc.0",
+    "@storybook/addon-notes": "5.0.0-rc.0",
+    "@storybook/addon-options": "5.0.0-rc.0",
+    "@storybook/addon-storyshots": "5.0.0-rc.0",
+    "@storybook/addon-storysource": "5.0.0-rc.0",
+    "@storybook/addon-viewport": "5.0.0-rc.0",
+    "@storybook/addons": "5.0.0-rc.0",
+    "@storybook/core": "5.0.0-rc.0",
+    "@storybook/core-events": "5.0.0-rc.0",
+    "@storybook/html": "5.0.0-rc.0",
     "eventemitter3": "^3.1.0",
     "format-json": "^1.0.3",
     "global": "^4.3.2",
diff --git a/examples/marko-cli/package.json b/examples/marko-cli/package.json
index 75e6ea952e9..6f85f4b4b7e 100644
--- a/examples/marko-cli/package.json
+++ b/examples/marko-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "marko-cli",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "private": true,
   "description": "Demo of how to build an app using marko-starter",
   "repository": {
@@ -22,12 +22,12 @@
     "marko-starter": "^2.0.4"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-beta.4",
-    "@storybook/addon-knobs": "5.0.0-beta.4",
-    "@storybook/addon-options": "5.0.0-beta.4",
-    "@storybook/addon-storysource": "5.0.0-beta.4",
-    "@storybook/addons": "5.0.0-beta.4",
-    "@storybook/marko": "5.0.0-beta.4",
+    "@storybook/addon-actions": "5.0.0-rc.0",
+    "@storybook/addon-knobs": "5.0.0-rc.0",
+    "@storybook/addon-options": "5.0.0-rc.0",
+    "@storybook/addon-storysource": "5.0.0-rc.0",
+    "@storybook/addons": "5.0.0-rc.0",
+    "@storybook/marko": "5.0.0-rc.0",
     "prettier": "^1.16.4",
     "webpack": "^4.29.0"
   }
diff --git a/examples/mithril-kitchen-sink/package.json b/examples/mithril-kitchen-sink/package.json
index 67868db00a9..a53a0986df1 100644
--- a/examples/mithril-kitchen-sink/package.json
+++ b/examples/mithril-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "mithril-example",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook",
@@ -10,18 +10,18 @@
     "mithril": "^1.1.6"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-beta.4",
-    "@storybook/addon-backgrounds": "5.0.0-beta.4",
-    "@storybook/addon-centered": "5.0.0-beta.4",
-    "@storybook/addon-knobs": "5.0.0-beta.4",
-    "@storybook/addon-links": "5.0.0-beta.4",
-    "@storybook/addon-notes": "5.0.0-beta.4",
-    "@storybook/addon-options": "5.0.0-beta.4",
-    "@storybook/addon-storyshots": "5.0.0-beta.4",
-    "@storybook/addon-storysource": "5.0.0-beta.4",
-    "@storybook/addon-viewport": "5.0.0-beta.4",
-    "@storybook/addons": "5.0.0-beta.4",
-    "@storybook/mithril": "5.0.0-beta.4",
+    "@storybook/addon-actions": "5.0.0-rc.0",
+    "@storybook/addon-backgrounds": "5.0.0-rc.0",
+    "@storybook/addon-centered": "5.0.0-rc.0",
+    "@storybook/addon-knobs": "5.0.0-rc.0",
+    "@storybook/addon-links": "5.0.0-rc.0",
+    "@storybook/addon-notes": "5.0.0-rc.0",
+    "@storybook/addon-options": "5.0.0-rc.0",
+    "@storybook/addon-storyshots": "5.0.0-rc.0",
+    "@storybook/addon-storysource": "5.0.0-rc.0",
+    "@storybook/addon-viewport": "5.0.0-rc.0",
+    "@storybook/addons": "5.0.0-rc.0",
+    "@storybook/mithril": "5.0.0-rc.0",
     "webpack": "^4.29.0"
   }
 }
diff --git a/examples/official-storybook/package.json b/examples/official-storybook/package.json
index 143dd3c2c91..787b5681403 100644
--- a/examples/official-storybook/package.json
+++ b/examples/official-storybook/package.json
@@ -1,6 +1,6 @@
 {
   "name": "official-storybook",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook -c ./ -s built-storybooks",
@@ -12,29 +12,29 @@
     "storybook": "cross-env STORYBOOK_DISPLAY_WARNING=true DISPLAY_WARNING=true start-storybook -p 9011 -c ./ -s built-storybooks --no-dll"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.0.0-beta.4",
-    "@storybook/addon-actions": "5.0.0-beta.4",
-    "@storybook/addon-backgrounds": "5.0.0-beta.4",
-    "@storybook/addon-centered": "5.0.0-beta.4",
-    "@storybook/addon-cssresources": "5.0.0-beta.4",
-    "@storybook/addon-events": "5.0.0-beta.4",
-    "@storybook/addon-graphql": "5.0.0-beta.4",
-    "@storybook/addon-info": "5.0.0-beta.4",
-    "@storybook/addon-jest": "5.0.0-beta.4",
-    "@storybook/addon-knobs": "5.0.0-beta.4",
-    "@storybook/addon-links": "5.0.0-beta.4",
-    "@storybook/addon-notes": "5.0.0-beta.4",
-    "@storybook/addon-options": "5.0.0-beta.4",
-    "@storybook/addon-storyshots": "5.0.0-beta.4",
-    "@storybook/addon-storyshots-puppeteer": "5.0.0-beta.4",
-    "@storybook/addon-storysource": "5.0.0-beta.4",
-    "@storybook/addon-viewport": "5.0.0-beta.4",
-    "@storybook/addons": "5.0.0-beta.4",
-    "@storybook/components": "5.0.0-beta.4",
-    "@storybook/core-events": "5.0.0-beta.4",
-    "@storybook/node-logger": "5.0.0-beta.4",
-    "@storybook/react": "5.0.0-beta.4",
-    "@storybook/theming": "5.0.0-beta.4",
+    "@storybook/addon-a11y": "5.0.0-rc.0",
+    "@storybook/addon-actions": "5.0.0-rc.0",
+    "@storybook/addon-backgrounds": "5.0.0-rc.0",
+    "@storybook/addon-centered": "5.0.0-rc.0",
+    "@storybook/addon-cssresources": "5.0.0-rc.0",
+    "@storybook/addon-events": "5.0.0-rc.0",
+    "@storybook/addon-graphql": "5.0.0-rc.0",
+    "@storybook/addon-info": "5.0.0-rc.0",
+    "@storybook/addon-jest": "5.0.0-rc.0",
+    "@storybook/addon-knobs": "5.0.0-rc.0",
+    "@storybook/addon-links": "5.0.0-rc.0",
+    "@storybook/addon-notes": "5.0.0-rc.0",
+    "@storybook/addon-options": "5.0.0-rc.0",
+    "@storybook/addon-storyshots": "5.0.0-rc.0",
+    "@storybook/addon-storyshots-puppeteer": "5.0.0-rc.0",
+    "@storybook/addon-storysource": "5.0.0-rc.0",
+    "@storybook/addon-viewport": "5.0.0-rc.0",
+    "@storybook/addons": "5.0.0-rc.0",
+    "@storybook/components": "5.0.0-rc.0",
+    "@storybook/core-events": "5.0.0-rc.0",
+    "@storybook/node-logger": "5.0.0-rc.0",
+    "@storybook/react": "5.0.0-rc.0",
+    "@storybook/theming": "5.0.0-rc.0",
     "cors": "^2.8.4",
     "cross-env": "^5.2.0",
     "enzyme-to-json": "^3.3.4",
diff --git a/examples/polymer-cli/package.json b/examples/polymer-cli/package.json
index 5de6577d7da..93b6f386c10 100644
--- a/examples/polymer-cli/package.json
+++ b/examples/polymer-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "polymer-cli",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook",
@@ -9,15 +9,15 @@
   },
   "dependencies": {
     "@polymer/polymer": "^2.6.0",
-    "@storybook/addon-actions": "5.0.0-beta.4",
-    "@storybook/addon-backgrounds": "5.0.0-beta.4",
-    "@storybook/addon-knobs": "5.0.0-beta.4",
-    "@storybook/addon-links": "5.0.0-beta.4",
-    "@storybook/addon-notes": "5.0.0-beta.4",
-    "@storybook/addon-options": "5.0.0-beta.4",
-    "@storybook/addon-storysource": "5.0.0-beta.4",
-    "@storybook/addon-viewport": "5.0.0-beta.4",
-    "@storybook/polymer": "5.0.0-beta.4",
+    "@storybook/addon-actions": "5.0.0-rc.0",
+    "@storybook/addon-backgrounds": "5.0.0-rc.0",
+    "@storybook/addon-knobs": "5.0.0-rc.0",
+    "@storybook/addon-links": "5.0.0-rc.0",
+    "@storybook/addon-notes": "5.0.0-rc.0",
+    "@storybook/addon-options": "5.0.0-rc.0",
+    "@storybook/addon-storysource": "5.0.0-rc.0",
+    "@storybook/addon-viewport": "5.0.0-rc.0",
+    "@storybook/polymer": "5.0.0-rc.0",
     "@webcomponents/webcomponentsjs": "^1.2.0",
     "global": "^4.3.2",
     "lit-html": "^1.0.0",
diff --git a/examples/preact-kitchen-sink/package.json b/examples/preact-kitchen-sink/package.json
index 7d64b696900..ce3df30411c 100644
--- a/examples/preact-kitchen-sink/package.json
+++ b/examples/preact-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "preact-example",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "private": true,
   "scripts": {
     "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
@@ -15,18 +15,18 @@
   "devDependencies": {
     "@babel/core": "^7.2.2",
     "@babel/plugin-transform-runtime": "^7.2.0",
-    "@storybook/addon-actions": "5.0.0-beta.4",
-    "@storybook/addon-backgrounds": "5.0.0-beta.4",
-    "@storybook/addon-centered": "5.0.0-beta.4",
-    "@storybook/addon-knobs": "5.0.0-beta.4",
-    "@storybook/addon-links": "5.0.0-beta.4",
-    "@storybook/addon-notes": "5.0.0-beta.4",
-    "@storybook/addon-options": "5.0.0-beta.4",
-    "@storybook/addon-storyshots": "5.0.0-beta.4",
-    "@storybook/addon-storysource": "5.0.0-beta.4",
-    "@storybook/addon-viewport": "5.0.0-beta.4",
-    "@storybook/addons": "5.0.0-beta.4",
-    "@storybook/preact": "5.0.0-beta.4",
+    "@storybook/addon-actions": "5.0.0-rc.0",
+    "@storybook/addon-backgrounds": "5.0.0-rc.0",
+    "@storybook/addon-centered": "5.0.0-rc.0",
+    "@storybook/addon-knobs": "5.0.0-rc.0",
+    "@storybook/addon-links": "5.0.0-rc.0",
+    "@storybook/addon-notes": "5.0.0-rc.0",
+    "@storybook/addon-options": "5.0.0-rc.0",
+    "@storybook/addon-storyshots": "5.0.0-rc.0",
+    "@storybook/addon-storysource": "5.0.0-rc.0",
+    "@storybook/addon-viewport": "5.0.0-rc.0",
+    "@storybook/addons": "5.0.0-rc.0",
+    "@storybook/preact": "5.0.0-rc.0",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
     "file-loader": "^3.0.1",
diff --git a/examples/riot-kitchen-sink/package.json b/examples/riot-kitchen-sink/package.json
index f11b885c1ec..5e8aa491187 100644
--- a/examples/riot-kitchen-sink/package.json
+++ b/examples/riot-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "riot-example",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "private": true,
   "scripts": {
     "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
@@ -15,18 +15,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.2.2",
-    "@storybook/addon-actions": "5.0.0-beta.4",
-    "@storybook/addon-backgrounds": "5.0.0-beta.4",
-    "@storybook/addon-centered": "5.0.0-beta.4",
-    "@storybook/addon-knobs": "5.0.0-beta.4",
-    "@storybook/addon-links": "5.0.0-beta.4",
-    "@storybook/addon-notes": "5.0.0-beta.4",
-    "@storybook/addon-options": "5.0.0-beta.4",
-    "@storybook/addon-storyshots": "5.0.0-beta.4",
-    "@storybook/addon-storysource": "5.0.0-beta.4",
-    "@storybook/addon-viewport": "5.0.0-beta.4",
-    "@storybook/addons": "5.0.0-beta.4",
-    "@storybook/riot": "5.0.0-beta.4",
+    "@storybook/addon-actions": "5.0.0-rc.0",
+    "@storybook/addon-backgrounds": "5.0.0-rc.0",
+    "@storybook/addon-centered": "5.0.0-rc.0",
+    "@storybook/addon-knobs": "5.0.0-rc.0",
+    "@storybook/addon-links": "5.0.0-rc.0",
+    "@storybook/addon-notes": "5.0.0-rc.0",
+    "@storybook/addon-options": "5.0.0-rc.0",
+    "@storybook/addon-storyshots": "5.0.0-rc.0",
+    "@storybook/addon-storysource": "5.0.0-rc.0",
+    "@storybook/addon-viewport": "5.0.0-rc.0",
+    "@storybook/addons": "5.0.0-rc.0",
+    "@storybook/riot": "5.0.0-rc.0",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
     "file-loader": "^3.0.1",
diff --git a/examples/svelte-kitchen-sink/package.json b/examples/svelte-kitchen-sink/package.json
index 98525a33c62..e431457acc9 100644
--- a/examples/svelte-kitchen-sink/package.json
+++ b/examples/svelte-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "svelte-example",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook -s public",
@@ -10,17 +10,17 @@
     "global": "^4.3.2"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-beta.4",
-    "@storybook/addon-backgrounds": "5.0.0-beta.4",
-    "@storybook/addon-centered": "5.0.0-beta.4",
-    "@storybook/addon-knobs": "5.0.0-beta.4",
-    "@storybook/addon-links": "5.0.0-beta.4",
-    "@storybook/addon-notes": "5.0.0-beta.4",
-    "@storybook/addon-options": "5.0.0-beta.4",
-    "@storybook/addon-storyshots": "5.0.0-beta.4",
-    "@storybook/addon-storysource": "5.0.0-beta.4",
-    "@storybook/addon-viewport": "5.0.0-beta.4",
-    "@storybook/addons": "5.0.0-beta.4",
-    "@storybook/svelte": "5.0.0-beta.4"
+    "@storybook/addon-actions": "5.0.0-rc.0",
+    "@storybook/addon-backgrounds": "5.0.0-rc.0",
+    "@storybook/addon-centered": "5.0.0-rc.0",
+    "@storybook/addon-knobs": "5.0.0-rc.0",
+    "@storybook/addon-links": "5.0.0-rc.0",
+    "@storybook/addon-notes": "5.0.0-rc.0",
+    "@storybook/addon-options": "5.0.0-rc.0",
+    "@storybook/addon-storyshots": "5.0.0-rc.0",
+    "@storybook/addon-storysource": "5.0.0-rc.0",
+    "@storybook/addon-viewport": "5.0.0-rc.0",
+    "@storybook/addons": "5.0.0-rc.0",
+    "@storybook/svelte": "5.0.0-rc.0"
   }
 }
diff --git a/examples/vue-kitchen-sink/package.json b/examples/vue-kitchen-sink/package.json
index 39eb1a6559c..10aaae91dec 100644
--- a/examples/vue-kitchen-sink/package.json
+++ b/examples/vue-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "vue-example",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "private": true,
   "scripts": {
     "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
@@ -14,18 +14,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.2.2",
-    "@storybook/addon-actions": "5.0.0-beta.4",
-    "@storybook/addon-backgrounds": "5.0.0-beta.4",
-    "@storybook/addon-centered": "5.0.0-beta.4",
-    "@storybook/addon-knobs": "5.0.0-beta.4",
-    "@storybook/addon-links": "5.0.0-beta.4",
-    "@storybook/addon-notes": "5.0.0-beta.4",
-    "@storybook/addon-options": "5.0.0-beta.4",
-    "@storybook/addon-storyshots": "5.0.0-beta.4",
-    "@storybook/addon-storysource": "5.0.0-beta.4",
-    "@storybook/addon-viewport": "5.0.0-beta.4",
-    "@storybook/addons": "5.0.0-beta.4",
-    "@storybook/vue": "5.0.0-beta.4",
+    "@storybook/addon-actions": "5.0.0-rc.0",
+    "@storybook/addon-backgrounds": "5.0.0-rc.0",
+    "@storybook/addon-centered": "5.0.0-rc.0",
+    "@storybook/addon-knobs": "5.0.0-rc.0",
+    "@storybook/addon-links": "5.0.0-rc.0",
+    "@storybook/addon-notes": "5.0.0-rc.0",
+    "@storybook/addon-options": "5.0.0-rc.0",
+    "@storybook/addon-storyshots": "5.0.0-rc.0",
+    "@storybook/addon-storysource": "5.0.0-rc.0",
+    "@storybook/addon-viewport": "5.0.0-rc.0",
+    "@storybook/addons": "5.0.0-rc.0",
+    "@storybook/vue": "5.0.0-rc.0",
     "babel-core": "^7.0.0-bridge.0",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
diff --git a/lerna.json b/lerna.json
index a0e1e12d619..9d722944541 100644
--- a/lerna.json
+++ b/lerna.json
@@ -11,5 +11,5 @@
   "npmClient": "yarn",
   "useWorkspaces": true,
   "registry": "https://registry.npmjs.org",
-  "version": "5.0.0-beta.4"
+  "version": "5.0.0-rc.0"
 }
diff --git a/lib/addons/package.json b/lib/addons/package.json
index 2308abf20ba..de26f379e4b 100644
--- a/lib/addons/package.json
+++ b/lib/addons/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addons",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "description": "Storybook addons store",
   "keywords": [
     "storybook"
@@ -20,8 +20,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.0.0-beta.4",
-    "@storybook/client-logger": "5.0.0-beta.4",
+    "@storybook/channels": "5.0.0-rc.0",
+    "@storybook/client-logger": "5.0.0-rc.0",
     "global": "^4.3.2",
     "util-deprecate": "^1.0.2"
   },
diff --git a/lib/channel-postmessage/package.json b/lib/channel-postmessage/package.json
index 2fc27892490..dd52f81ae0f 100644
--- a/lib/channel-postmessage/package.json
+++ b/lib/channel-postmessage/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channel-postmessage",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "description": "",
   "keywords": [
     "storybook"
@@ -20,7 +20,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.0.0-beta.4",
+    "@storybook/channels": "5.0.0-rc.0",
     "global": "^4.3.2",
     "telejson": "^1.0.1"
   },
diff --git a/lib/channel-websocket/package.json b/lib/channel-websocket/package.json
index e804c6c5e93..bf0eb040f0d 100644
--- a/lib/channel-websocket/package.json
+++ b/lib/channel-websocket/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channel-websocket",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "description": "",
   "keywords": [
     "storybook"
@@ -20,7 +20,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.0.0-beta.4",
+    "@storybook/channels": "5.0.0-rc.0",
     "global": "^4.3.2",
     "json-fn": "^1.1.1"
   },
diff --git a/lib/channels/package.json b/lib/channels/package.json
index cfcbdedef39..1140800e8fa 100644
--- a/lib/channels/package.json
+++ b/lib/channels/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channels",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/cli/package.json b/lib/cli/package.json
index e3df304ac93..0cb2f2b6398 100644
--- a/lib/cli/package.json
+++ b/lib/cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/cli",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "description": "Storybook's CLI - easiest method of adding storybook to your projects",
   "keywords": [
     "cli",
@@ -29,7 +29,7 @@
     "@babel/core": "^7.2.2",
     "@babel/preset-env": "^7.3.1",
     "@babel/register": "^7.0.0",
-    "@storybook/codemod": "5.0.0-beta.4",
+    "@storybook/codemod": "5.0.0-rc.0",
     "chalk": "^2.4.1",
     "commander": "^2.19.0",
     "core-js": "^2.6.2",
@@ -43,31 +43,31 @@
     "update-notifier": "^2.5.0"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-beta.4",
-    "@storybook/addon-centered": "5.0.0-beta.4",
-    "@storybook/addon-graphql": "5.0.0-beta.4",
-    "@storybook/addon-info": "5.0.0-beta.4",
-    "@storybook/addon-knobs": "5.0.0-beta.4",
-    "@storybook/addon-links": "5.0.0-beta.4",
-    "@storybook/addon-notes": "5.0.0-beta.4",
-    "@storybook/addon-options": "5.0.0-beta.4",
-    "@storybook/addon-storyshots": "5.0.0-beta.4",
-    "@storybook/addons": "5.0.0-beta.4",
-    "@storybook/angular": "5.0.0-beta.4",
-    "@storybook/channel-postmessage": "5.0.0-beta.4",
-    "@storybook/channel-websocket": "5.0.0-beta.4",
-    "@storybook/channels": "5.0.0-beta.4",
-    "@storybook/ember": "5.0.0-beta.4",
-    "@storybook/html": "5.0.0-beta.4",
-    "@storybook/marko": "5.0.0-beta.4",
-    "@storybook/mithril": "5.0.0-beta.4",
-    "@storybook/polymer": "5.0.0-beta.4",
-    "@storybook/preact": "5.0.0-beta.4",
-    "@storybook/react": "5.0.0-beta.4",
+    "@storybook/addon-actions": "5.0.0-rc.0",
+    "@storybook/addon-centered": "5.0.0-rc.0",
+    "@storybook/addon-graphql": "5.0.0-rc.0",
+    "@storybook/addon-info": "5.0.0-rc.0",
+    "@storybook/addon-knobs": "5.0.0-rc.0",
+    "@storybook/addon-links": "5.0.0-rc.0",
+    "@storybook/addon-notes": "5.0.0-rc.0",
+    "@storybook/addon-options": "5.0.0-rc.0",
+    "@storybook/addon-storyshots": "5.0.0-rc.0",
+    "@storybook/addons": "5.0.0-rc.0",
+    "@storybook/angular": "5.0.0-rc.0",
+    "@storybook/channel-postmessage": "5.0.0-rc.0",
+    "@storybook/channel-websocket": "5.0.0-rc.0",
+    "@storybook/channels": "5.0.0-rc.0",
+    "@storybook/ember": "5.0.0-rc.0",
+    "@storybook/html": "5.0.0-rc.0",
+    "@storybook/marko": "5.0.0-rc.0",
+    "@storybook/mithril": "5.0.0-rc.0",
+    "@storybook/polymer": "5.0.0-rc.0",
+    "@storybook/preact": "5.0.0-rc.0",
+    "@storybook/react": "5.0.0-rc.0",
     "@storybook/react-native": "5.0.0-beta.4",
-    "@storybook/riot": "5.0.0-beta.4",
-    "@storybook/ui": "5.0.0-beta.4",
-    "@storybook/vue": "5.0.0-beta.4"
+    "@storybook/riot": "5.0.0-rc.0",
+    "@storybook/ui": "5.0.0-rc.0",
+    "@storybook/vue": "5.0.0-rc.0"
   },
   "publishConfig": {
     "access": "public"
diff --git a/lib/client-api/package.json b/lib/client-api/package.json
index a220f9cb7ac..584391d5d90 100644
--- a/lib/client-api/package.json
+++ b/lib/client-api/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/client-api",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "description": "Storybook Client API",
   "keywords": [
     "storybook"
@@ -19,9 +19,9 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-beta.4",
-    "@storybook/client-logger": "5.0.0-beta.4",
-    "@storybook/core-events": "5.0.0-beta.4",
+    "@storybook/addons": "5.0.0-rc.0",
+    "@storybook/client-logger": "5.0.0-rc.0",
+    "@storybook/core-events": "5.0.0-rc.0",
     "common-tags": "^1.8.0",
     "eventemitter3": "^3.1.0",
     "global": "^4.3.2",
diff --git a/lib/client-logger/package.json b/lib/client-logger/package.json
index 60c12dd8be8..5f37d87e86b 100644
--- a/lib/client-logger/package.json
+++ b/lib/client-logger/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/client-logger",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/codemod/package.json b/lib/codemod/package.json
index 0a3add8b5d0..4cfbb09d7aa 100644
--- a/lib/codemod/package.json
+++ b/lib/codemod/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/codemod",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "description": "A collection of codemod scripts written with JSCodeshift",
   "keywords": [
     "storybook"
diff --git a/lib/components/package.json b/lib/components/package.json
index 88a82603dc3..390f915d594 100644
--- a/lib/components/package.json
+++ b/lib/components/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/components",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "description": "Core Storybook Components",
   "keywords": [
     "storybook"
@@ -20,11 +20,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-beta.4",
-    "@storybook/client-logger": "5.0.0-beta.4",
-    "@storybook/core-events": "5.0.0-beta.4",
-    "@storybook/router": "5.0.0-beta.4",
-    "@storybook/theming": "5.0.0-beta.4",
+    "@storybook/addons": "5.0.0-rc.0",
+    "@storybook/client-logger": "5.0.0-rc.0",
+    "@storybook/core-events": "5.0.0-rc.0",
+    "@storybook/router": "5.0.0-rc.0",
+    "@storybook/theming": "5.0.0-rc.0",
     "global": "^4.3.2",
     "immer": "^1.12.0",
     "js-beautify": "^1.8.9",
diff --git a/lib/core-events/package.json b/lib/core-events/package.json
index 6596b82f511..d64a492c452 100644
--- a/lib/core-events/package.json
+++ b/lib/core-events/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/core-events",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "description": "Event names used in storybook core",
   "keywords": [
     "storybook"
diff --git a/lib/core/package.json b/lib/core/package.json
index ca8a888e4af..30dd89eb18b 100644
--- a/lib/core/package.json
+++ b/lib/core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/core",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "description": "Storybook framework-agnostic API",
   "keywords": [
     "storybook"
@@ -24,14 +24,14 @@
     "@babel/plugin-syntax-dynamic-import": "^7.2.0",
     "@babel/plugin-transform-react-constant-elements": "^7.2.0",
     "@babel/preset-env": "^7.3.1",
-    "@storybook/addons": "5.0.0-beta.4",
-    "@storybook/channel-postmessage": "5.0.0-beta.4",
-    "@storybook/client-api": "5.0.0-beta.4",
-    "@storybook/client-logger": "5.0.0-beta.4",
-    "@storybook/core-events": "5.0.0-beta.4",
-    "@storybook/node-logger": "5.0.0-beta.4",
-    "@storybook/theming": "5.0.0-beta.4",
-    "@storybook/ui": "5.0.0-beta.4",
+    "@storybook/addons": "5.0.0-rc.0",
+    "@storybook/channel-postmessage": "5.0.0-rc.0",
+    "@storybook/client-api": "5.0.0-rc.0",
+    "@storybook/client-logger": "5.0.0-rc.0",
+    "@storybook/core-events": "5.0.0-rc.0",
+    "@storybook/node-logger": "5.0.0-rc.0",
+    "@storybook/theming": "5.0.0-rc.0",
+    "@storybook/ui": "5.0.0-rc.0",
     "airbnb-js-shims": "^1 || ^2",
     "autoprefixer": "^9.4.7",
     "babel-plugin-add-react-displayname": "^0.0.5",
diff --git a/lib/node-logger/package.json b/lib/node-logger/package.json
index 9507157b93b..c133a83235f 100644
--- a/lib/node-logger/package.json
+++ b/lib/node-logger/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/node-logger",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/router/package.json b/lib/router/package.json
index 355cee5b2bf..54055695666 100644
--- a/lib/router/package.json
+++ b/lib/router/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/router",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "description": "Core Storybook Router",
   "keywords": [
     "storybook"
@@ -20,7 +20,7 @@
   },
   "dependencies": {
     "@reach/router": "^1.2.1",
-    "@storybook/theming": "5.0.0-beta.4",
+    "@storybook/theming": "5.0.0-rc.0",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
     "qs": "^6.5.2"
diff --git a/lib/theming/package.json b/lib/theming/package.json
index 756b89617c7..8b819e72471 100644
--- a/lib/theming/package.json
+++ b/lib/theming/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/theming",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "description": "Core Storybook Components",
   "keywords": [
     "storybook"
diff --git a/lib/ui/package.json b/lib/ui/package.json
index 967f0664f81..0b848994bbe 100644
--- a/lib/ui/package.json
+++ b/lib/ui/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/ui",
-  "version": "5.0.0-beta.4",
+  "version": "5.0.0-rc.0",
   "description": "Core Storybook UI",
   "keywords": [
     "storybook"
@@ -21,12 +21,12 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-beta.4",
-    "@storybook/client-logger": "5.0.0-beta.4",
-    "@storybook/components": "5.0.0-beta.4",
-    "@storybook/core-events": "5.0.0-beta.4",
-    "@storybook/router": "5.0.0-beta.4",
-    "@storybook/theming": "5.0.0-beta.4",
+    "@storybook/addons": "5.0.0-rc.0",
+    "@storybook/client-logger": "5.0.0-rc.0",
+    "@storybook/components": "5.0.0-rc.0",
+    "@storybook/core-events": "5.0.0-rc.0",
+    "@storybook/router": "5.0.0-rc.0",
+    "@storybook/theming": "5.0.0-rc.0",
     "eventemitter3": "^3.1.0",
     "fast-deep-equal": "^2.0.1",
     "fuse.js": "^3.3.1",

From 12847e194ba15e033eb7c81ce30b55679577cdc6 Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Sat, 16 Feb 2019 23:51:54 +0800
Subject: [PATCH 021/249] Add missing babel-preset-env dependency (#5617)

Add missing babel-preset-env dependency
---
 lib/core/package.json | 1 +
 1 file changed, 1 insertion(+)

diff --git a/lib/core/package.json b/lib/core/package.json
index 30dd89eb18b..bae7f8d36ad 100644
--- a/lib/core/package.json
+++ b/lib/core/package.json
@@ -37,6 +37,7 @@
     "babel-plugin-add-react-displayname": "^0.0.5",
     "babel-plugin-emotion": "^10.0.7",
     "babel-plugin-macros": "^2.4.5",
+    "babel-preset-env": "^1.7.0",
     "babel-preset-minify": "^0.5.0 || 0.6.0-alpha.5",
     "boxen": "^2.1.0",
     "case-sensitive-paths-webpack-plugin": "^2.2.0",

From 1cf21b7f6249f808c11ef11ad4aefac72ee84b81 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Sat, 16 Feb 2019 23:55:45 +0800
Subject: [PATCH 022/249] 5.0.0-rc.1 changelog

---
 CHANGELOG.md | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index bdf466130c5..fa4c0acfaf9 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,9 @@
+## 5.0.0-rc.1 (February 16, 2019)
+
+### Bug Fixes
+
+* Core: Add missing babel-preset-env dependency ([#5617](https://github.com/storybooks/storybook/pull/5617))
+
 ## 5.0.0-rc.0 (February 16, 2019)
 
 Welcome to Storybook 5 (SB5) with a beautiful new user interface including:

From 55e36a69a5d953d6951393a5664bda9d3661fe09 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Sun, 17 Feb 2019 00:06:26 +0800
Subject: [PATCH 023/249] Fix yarn.lock

---
 yarn.lock | 240 ++++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 240 insertions(+)

diff --git a/yarn.lock b/yarn.lock
index 676fa950a11..c65ca1dc8e7 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1952,6 +1952,181 @@
   resolved "https://registry.yarnpkg.com/@sheerun/mutationobserver-shim/-/mutationobserver-shim-0.3.2.tgz#8013f2af54a2b7d735f71560ff360d3a8176a87b"
   integrity sha512-vTCdPp/T/Q3oSqwHmZ5Kpa9oI7iLtGl3RQaA/NyLHikvcrPxACkkKVr/XzkSPJWXHRhKGzVvb0urJsbMlRxi1Q==
 
+"@storybook/addons@5.0.0-beta.4":
+  version "5.0.0-beta.4"
+  resolved "https://registry.yarnpkg.com/@storybook/addons/-/addons-5.0.0-beta.4.tgz#57e091695a0aa647f02dd9745de1789a5d276b14"
+  integrity sha512-BPa63CvUTTkuAcblFgw+SlNuwpU+coHbzcU4zUZIgIg9auTZG5CZrkYMzwBF1nQsCkiNtGzRW27WrmcP7ufO4g==
+  dependencies:
+    "@storybook/channels" "5.0.0-beta.4"
+    "@storybook/client-logger" "5.0.0-beta.4"
+    global "^4.3.2"
+    util-deprecate "^1.0.2"
+
+"@storybook/channel-postmessage@5.0.0-beta.4":
+  version "5.0.0-beta.4"
+  resolved "https://registry.yarnpkg.com/@storybook/channel-postmessage/-/channel-postmessage-5.0.0-beta.4.tgz#7a2c004b8ea2a8b90ad586cfa78f0e5dc06d81a1"
+  integrity sha512-zLgDZag8pWgM3LlnBCcDlthQ9CEOHuWXbDjwJ2hYYqHfZSsCphdaZlsi2wzRgBB5GovJYso4du3mwmRQYbMxPw==
+  dependencies:
+    "@storybook/channels" "5.0.0-beta.4"
+    global "^4.3.2"
+    telejson "^1.0.1"
+
+"@storybook/channel-websocket@5.0.0-beta.4":
+  version "5.0.0-beta.4"
+  resolved "https://registry.yarnpkg.com/@storybook/channel-websocket/-/channel-websocket-5.0.0-beta.4.tgz#280e3061d1b252f9f58a6b9fb356f5282bd4f186"
+  integrity sha512-mr+9fhEb+BKymG/ubs43ehJxfnKJ3bXNW9SEtiAJ7hDcGi6oxhWobt9hM84hf0sGKyQBHBG/L2dDIryQfiWRqg==
+  dependencies:
+    "@storybook/channels" "5.0.0-beta.4"
+    global "^4.3.2"
+    json-fn "^1.1.1"
+
+"@storybook/channels@5.0.0-beta.4":
+  version "5.0.0-beta.4"
+  resolved "https://registry.yarnpkg.com/@storybook/channels/-/channels-5.0.0-beta.4.tgz#e721fdfcd2a9593ff384edbfdae05ac62b2ffabc"
+  integrity sha512-la7VbasB6Dl1C22NrEb10Ilv/2RIeKPHmn1aaf6034OeAhPpCwdOnf0G4H9fNhEvm8qZIa7JhhDimxNchUD37w==
+
+"@storybook/client-api@5.0.0-beta.4":
+  version "5.0.0-beta.4"
+  resolved "https://registry.yarnpkg.com/@storybook/client-api/-/client-api-5.0.0-beta.4.tgz#6336a3703c10b5a9d374aa2ec00d11acb0f46333"
+  integrity sha512-brxGvLV46ebj5UQqOzZBkHrqueONTu7a3O7D42Wn+87zZ24uqy+SKIWItaRGvrkIdry/QlBQweLJsfhpw2OHRQ==
+  dependencies:
+    "@storybook/addons" "5.0.0-beta.4"
+    "@storybook/client-logger" "5.0.0-beta.4"
+    "@storybook/core-events" "5.0.0-beta.4"
+    common-tags "^1.8.0"
+    eventemitter3 "^3.1.0"
+    global "^4.3.2"
+    is-plain-object "^2.0.4"
+    lodash.debounce "^4.0.8"
+    lodash.isequal "^4.5.0"
+    lodash.mergewith "^4.6.1"
+    memoizerific "^1.11.3"
+    qs "^6.5.2"
+
+"@storybook/client-logger@5.0.0-beta.4":
+  version "5.0.0-beta.4"
+  resolved "https://registry.yarnpkg.com/@storybook/client-logger/-/client-logger-5.0.0-beta.4.tgz#005040cec6bfa2d2060d550f73567dcbdaa3b8a0"
+  integrity sha512-Nw8mCVZqTWAYO/sLOZmBDSUZPauyy07fRg+OISX9fplPOb9eFdv0PQhWPEeU6oE0f0tI9b2aQ1NAJeWpE+kV3Q==
+
+"@storybook/components@5.0.0-beta.4":
+  version "5.0.0-beta.4"
+  resolved "https://registry.yarnpkg.com/@storybook/components/-/components-5.0.0-beta.4.tgz#195b90be9aa895bc349345b0dab91bda4c05c0fc"
+  integrity sha512-9EfFx0sxcnWz2Q02T9OCLrEHsoy/dALBwWnujcle5LmUQ8AtJK6DMpxNg4JETd6Zk3m1d3h7oakSKR6W54h9VA==
+  dependencies:
+    "@storybook/addons" "5.0.0-beta.4"
+    "@storybook/client-logger" "5.0.0-beta.4"
+    "@storybook/core-events" "5.0.0-beta.4"
+    "@storybook/router" "5.0.0-beta.4"
+    "@storybook/theming" "5.0.0-beta.4"
+    global "^4.3.2"
+    immer "^1.12.0"
+    js-beautify "^1.8.9"
+    lodash.pick "^4.4.0"
+    lodash.throttle "^4.1.1"
+    memoizerific "^1.11.3"
+    polished "^2.3.3"
+    prop-types "^15.6.2"
+    react "^16.8.1"
+    react-dom "^16.8.1"
+    react-focus-lock "^1.17.7"
+    react-helmet-async "^0.2.0"
+    react-inspector "^2.3.0"
+    react-popper-tooltip "^2.8.0"
+    react-syntax-highlighter "^8.0.1"
+    react-textarea-autosize "^7.0.4"
+    reactjs-popup "^1.3.2"
+    recompose "^0.30.0"
+    render-fragment "^0.1.1"
+
+"@storybook/core-events@5.0.0-beta.4":
+  version "5.0.0-beta.4"
+  resolved "https://registry.yarnpkg.com/@storybook/core-events/-/core-events-5.0.0-beta.4.tgz#5964328f7259eafdbe14c976324a3488596c97f9"
+  integrity sha512-odmfS6fEuJQB5mu//ivblevxDCgQFr1Sqn0Ky1STTYbH6FKXhoRRsaMkGkjNZoyBPuKu9dmSW1MYy1MYZB6iiA==
+
+"@storybook/core@5.0.0-beta.4":
+  version "5.0.0-beta.4"
+  resolved "https://registry.yarnpkg.com/@storybook/core/-/core-5.0.0-beta.4.tgz#81062859c2d510364e354b6e475cd45d8d5486ad"
+  integrity sha512-rP2joiWTf8AvPgccEytjsW+Q+kuuhVSJGTNGg9ciBfMkmW2wab8/eZ4rtp/GkUKWjoWWyJZsc+ahkXTj88e1HA==
+  dependencies:
+    "@babel/plugin-proposal-class-properties" "^7.3.0"
+    "@babel/plugin-proposal-object-rest-spread" "^7.3.2"
+    "@babel/plugin-syntax-dynamic-import" "^7.2.0"
+    "@babel/plugin-transform-react-constant-elements" "^7.2.0"
+    "@babel/preset-env" "^7.3.1"
+    "@storybook/addons" "5.0.0-beta.4"
+    "@storybook/channel-postmessage" "5.0.0-beta.4"
+    "@storybook/client-api" "5.0.0-beta.4"
+    "@storybook/client-logger" "5.0.0-beta.4"
+    "@storybook/core-events" "5.0.0-beta.4"
+    "@storybook/node-logger" "5.0.0-beta.4"
+    "@storybook/theming" "5.0.0-beta.4"
+    "@storybook/ui" "5.0.0-beta.4"
+    airbnb-js-shims "^1 || ^2"
+    autoprefixer "^9.4.7"
+    babel-plugin-add-react-displayname "^0.0.5"
+    babel-plugin-emotion "^10.0.7"
+    babel-plugin-macros "^2.4.5"
+    babel-preset-minify "^0.5.0 || 0.6.0-alpha.5"
+    boxen "^2.1.0"
+    case-sensitive-paths-webpack-plugin "^2.2.0"
+    chalk "^2.4.2"
+    child-process-promise "^2.2.1"
+    cli-table3 "0.5.1"
+    commander "^2.19.0"
+    common-tags "^1.8.0"
+    core-js "^2.6.2"
+    css-loader "^2.1.0"
+    detect-port "^1.2.3"
+    dotenv-webpack "^1.7.0"
+    ejs "^2.6.1"
+    express "^4.16.3"
+    file-loader "^3.0.1"
+    file-system-cache "^1.0.5"
+    find-cache-dir "^2.0.0"
+    fs-extra "^7.0.1"
+    global "^4.3.2"
+    html-webpack-plugin "^4.0.0-beta.2"
+    inquirer "^6.2.0"
+    interpret "^1.2.0"
+    ip "^1.1.5"
+    json5 "^2.1.0"
+    lazy-universal-dotenv "^2.0.0"
+    node-fetch "^2.2.0"
+    object.omit "^3.0.0"
+    opn "^5.4.0"
+    postcss-flexbugs-fixes "^4.1.0"
+    postcss-loader "^3.0.0"
+    pretty-hrtime "^1.0.3"
+    prop-types "^15.6.2"
+    raw-loader "^1.0.0"
+    react-dev-utils "^7.0.0"
+    regenerator-runtime "^0.12.1"
+    resolve "^1.10.0"
+    resolve-from "^4.0.0"
+    semver "^5.6.0"
+    serve-favicon "^2.5.0"
+    shelljs "^0.8.2"
+    spawn-promise "^0.1.8"
+    style-loader "^0.23.1"
+    svg-url-loader "^2.3.2"
+    terser-webpack-plugin "^1.2.1"
+    url-loader "^1.1.2"
+    util-deprecate "^1.0.2"
+    webpack "^4.29.0"
+    webpack-dev-middleware "^3.5.1"
+    webpack-hot-middleware "^2.24.3"
+
+"@storybook/node-logger@5.0.0-beta.4":
+  version "5.0.0-beta.4"
+  resolved "https://registry.yarnpkg.com/@storybook/node-logger/-/node-logger-5.0.0-beta.4.tgz#db6e01f78005960d8ee1a5725df2dc85d7f30f7b"
+  integrity sha512-I4zm1jFEc1wMG/4/fLHFTO9GPEmoBjAgWE6pyc4CJnC7B7pU3JP66LGCc5N923oSNgrlY/biyUKnm3iLAJr6Og==
+  dependencies:
+    chalk "^2.4.2"
+    core-js "^2.6.2"
+    npmlog "^4.1.2"
+    pretty-hrtime "^1.0.3"
+    regenerator-runtime "^0.12.1"
+
 "@storybook/react-native@5.0.0-beta.4":
   version "5.0.0-beta.4"
   resolved "https://registry.yarnpkg.com/@storybook/react-native/-/react-native-5.0.0-beta.4.tgz#d0b9baea545e156ff4b65590019373eaebbb7a65"
@@ -1997,6 +2172,71 @@
     webpack-hot-middleware "^2.24.3"
     ws "^6.1.3"
 
+"@storybook/router@5.0.0-beta.4":
+  version "5.0.0-beta.4"
+  resolved "https://registry.yarnpkg.com/@storybook/router/-/router-5.0.0-beta.4.tgz#7691698cb5ec03f81a32b8eadeb3d8856b7dc659"
+  integrity sha512-0w9MmLrwSanulVjvAewQ9qQNnkn9CSy/+YXkesNuI/FNzS88RbZUZW3N1LkWNc505cMA6Qro41hak41iv7ipXw==
+  dependencies:
+    "@reach/router" "^1.2.1"
+    "@storybook/theming" "5.0.0-beta.4"
+    global "^4.3.2"
+    memoizerific "^1.11.3"
+    qs "^6.5.2"
+
+"@storybook/theming@5.0.0-beta.4":
+  version "5.0.0-beta.4"
+  resolved "https://registry.yarnpkg.com/@storybook/theming/-/theming-5.0.0-beta.4.tgz#9b2d47b10e3bae8b0a76b399eccaa495013aeca2"
+  integrity sha512-xDHvV0jM6g21b9anjdk9L6TGK79itiYMoomTr4jkzERX0mgi0ENJCQbCE0q1G1XTQOOKSzvFSk0JSX1DzvZp9w==
+  dependencies:
+    "@emotion/core" "^10.0.5"
+    "@emotion/styled" "^10.0.5"
+    emotion-theming "^10.0.5"
+    global "^4.3.2"
+    memoizerific "^1.11.3"
+    prop-types "^15.6.2"
+    react-inspector "^2.3.1"
+
+"@storybook/ui@5.0.0-beta.4":
+  version "5.0.0-beta.4"
+  resolved "https://registry.yarnpkg.com/@storybook/ui/-/ui-5.0.0-beta.4.tgz#fade4069aa61b391d3237bcfa67b2faf4b5a0d9c"
+  integrity sha512-MpMltR79CUevWNrMvfH601zMP/UJ4mhrA021uYov9KbHI+FptSbyehemPFP83UYJw6oWWlBDwkOwSeFxJNCiQQ==
+  dependencies:
+    "@storybook/addons" "5.0.0-beta.4"
+    "@storybook/client-logger" "5.0.0-beta.4"
+    "@storybook/components" "5.0.0-beta.4"
+    "@storybook/core-events" "5.0.0-beta.4"
+    "@storybook/router" "5.0.0-beta.4"
+    "@storybook/theming" "5.0.0-beta.4"
+    eventemitter3 "^3.1.0"
+    fast-deep-equal "^2.0.1"
+    fuse.js "^3.3.1"
+    fuzzy-search "^3.0.1"
+    global "^4.3.2"
+    history "^4.7.2"
+    keycode "^2.2.0"
+    lodash.debounce "^4.0.8"
+    lodash.isequal "^4.5.0"
+    lodash.mergewith "^4.6.1"
+    lodash.pick "^4.4.0"
+    lodash.sortby "^4.7.0"
+    lodash.throttle "^4.1.1"
+    markdown-to-jsx "^6.9.1"
+    memoizerific "^1.11.3"
+    polished "^2.3.3"
+    prop-types "^15.6.2"
+    qs "^6.5.2"
+    react "^16.8.1"
+    react-dom "^16.8.1"
+    react-draggable "^3.1.1"
+    react-helmet-async "^0.2.0"
+    react-hotkeys "2.0.0-pre4"
+    react-lifecycles-compat "^3.0.4"
+    react-modal "^3.8.1"
+    react-resize-detector "^3.2.1"
+    recompose "^0.30.0"
+    to-camel-case "^1.0.0"
+    util-deprecate "^1.0.2"
+
 "@svgr/babel-plugin-add-jsx-attribute@^4.0.0":
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/@svgr/babel-plugin-add-jsx-attribute/-/babel-plugin-add-jsx-attribute-4.0.0.tgz#5acf239cd2747b1a36ec7e708de05d914cb9b948"

From 22d3ee17e6f5931234951b6e7df43b1dc63f03b4 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Sun, 17 Feb 2019 00:07:33 +0800
Subject: [PATCH 024/249] v5.0.0-rc.1

---
 addons/a11y/package.json                      | 12 ++---
 addons/actions/package.json                   | 10 ++--
 addons/backgrounds/package.json               | 12 ++---
 addons/centered/package.json                  |  2 +-
 addons/cssresources/package.json              | 10 ++--
 addons/events/package.json                    |  8 +--
 addons/google-analytics/package.json          |  6 +--
 addons/graphql/package.json                   |  2 +-
 addons/info/package.json                      | 10 ++--
 addons/jest/package.json                      | 10 ++--
 addons/knobs/package.json                     | 10 ++--
 addons/links/package.json                     |  6 +--
 addons/notes/package.json                     | 12 ++---
 addons/options/package.json                   |  4 +-
 .../storyshots/storyshots-core/package.json   |  4 +-
 .../storyshots-puppeteer/package.json         |  6 +--
 addons/storysource/package.json               |  8 +--
 addons/viewport/package.json                  | 12 ++---
 app/angular/package.json                      |  6 +--
 app/ember/package.json                        |  4 +-
 app/html/package.json                         |  4 +-
 app/marko/package.json                        |  4 +-
 app/mithril/package.json                      |  4 +-
 app/polymer/package.json                      |  4 +-
 app/preact/package.json                       |  4 +-
 app/react/package.json                        |  8 +--
 app/riot/package.json                         |  4 +-
 app/svelte/package.json                       |  4 +-
 app/vue/package.json                          |  4 +-
 examples/angular-cli/package.json             | 26 +++++-----
 examples/cra-kitchen-sink/package.json        | 32 ++++++------
 examples/cra-ts-kitchen-sink/package.json     | 12 ++---
 examples/ember-cli/package.json               | 26 +++++-----
 examples/html-kitchen-sink/package.json       | 36 ++++++-------
 examples/marko-cli/package.json               | 14 ++---
 examples/mithril-kitchen-sink/package.json    | 26 +++++-----
 examples/official-storybook/package.json      | 48 ++++++++---------
 examples/polymer-cli/package.json             | 20 +++----
 examples/preact-kitchen-sink/package.json     | 26 +++++-----
 examples/riot-kitchen-sink/package.json       | 26 +++++-----
 examples/svelte-kitchen-sink/package.json     | 26 +++++-----
 examples/vue-kitchen-sink/package.json        | 26 +++++-----
 lerna.json                                    |  2 +-
 lib/addons/package.json                       |  6 +--
 lib/channel-postmessage/package.json          |  4 +-
 lib/channel-websocket/package.json            |  4 +-
 lib/channels/package.json                     |  2 +-
 lib/cli/package.json                          | 52 +++++++++----------
 lib/client-api/package.json                   |  8 +--
 lib/client-logger/package.json                |  2 +-
 lib/codemod/package.json                      |  2 +-
 lib/components/package.json                   | 12 ++---
 lib/core-events/package.json                  |  2 +-
 lib/core/package.json                         | 18 +++----
 lib/node-logger/package.json                  |  2 +-
 lib/router/package.json                       |  4 +-
 lib/theming/package.json                      |  2 +-
 lib/ui/package.json                           | 14 ++---
 58 files changed, 337 insertions(+), 337 deletions(-)

diff --git a/addons/a11y/package.json b/addons/a11y/package.json
index fac9e8049cd..25efb8a4b39 100644
--- a/addons/a11y/package.json
+++ b/addons/a11y/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-a11y",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "description": "a11y addon for storybook",
   "keywords": [
     "a11y",
@@ -25,11 +25,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.0",
-    "@storybook/client-logger": "5.0.0-rc.0",
-    "@storybook/components": "5.0.0-rc.0",
-    "@storybook/core-events": "5.0.0-rc.0",
-    "@storybook/theming": "5.0.0-rc.0",
+    "@storybook/addons": "5.0.0-rc.1",
+    "@storybook/client-logger": "5.0.0-rc.1",
+    "@storybook/components": "5.0.0-rc.1",
+    "@storybook/core-events": "5.0.0-rc.1",
+    "@storybook/theming": "5.0.0-rc.1",
     "axe-core": "^3.1.2",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
diff --git a/addons/actions/package.json b/addons/actions/package.json
index 71c3317721c..1d494963bef 100644
--- a/addons/actions/package.json
+++ b/addons/actions/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-actions",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "description": "Action Logger addon for storybook",
   "keywords": [
     "storybook"
@@ -20,10 +20,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.0",
-    "@storybook/components": "5.0.0-rc.0",
-    "@storybook/core-events": "5.0.0-rc.0",
-    "@storybook/theming": "5.0.0-rc.0",
+    "@storybook/addons": "5.0.0-rc.1",
+    "@storybook/components": "5.0.0-rc.1",
+    "@storybook/core-events": "5.0.0-rc.1",
+    "@storybook/theming": "5.0.0-rc.1",
     "core-js": "^2.6.2",
     "fast-deep-equal": "^2.0.1",
     "global": "^4.3.2",
diff --git a/addons/backgrounds/package.json b/addons/backgrounds/package.json
index 5af298c9506..0311b33e551 100644
--- a/addons/backgrounds/package.json
+++ b/addons/backgrounds/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-backgrounds",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "description": "A storybook addon to show different backgrounds for your preview",
   "keywords": [
     "addon",
@@ -24,11 +24,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.0",
-    "@storybook/client-logger": "5.0.0-rc.0",
-    "@storybook/components": "5.0.0-rc.0",
-    "@storybook/core-events": "5.0.0-rc.0",
-    "@storybook/theming": "5.0.0-rc.0",
+    "@storybook/addons": "5.0.0-rc.1",
+    "@storybook/client-logger": "5.0.0-rc.1",
+    "@storybook/components": "5.0.0-rc.1",
+    "@storybook/core-events": "5.0.0-rc.1",
+    "@storybook/theming": "5.0.0-rc.1",
     "core-js": "^2.6.2",
     "eventemitter3": "^3.1.0",
     "global": "^4.3.2",
diff --git a/addons/centered/package.json b/addons/centered/package.json
index 94c56176501..4a8779c3229 100644
--- a/addons/centered/package.json
+++ b/addons/centered/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-centered",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "description": "Storybook decorator to center components",
   "keywords": [
     "addon",
diff --git a/addons/cssresources/package.json b/addons/cssresources/package.json
index cac4d23f7bd..e515d526183 100644
--- a/addons/cssresources/package.json
+++ b/addons/cssresources/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-cssresources",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "description": "A storybook addon to switch between css resources at runtime for your story",
   "keywords": [
     "addon",
@@ -25,10 +25,10 @@
   },
   "dependencies": {
     "@emotion/styled": "10.0.6",
-    "@storybook/addons": "5.0.0-rc.0",
-    "@storybook/channels": "5.0.0-rc.0",
-    "@storybook/components": "5.0.0-rc.0",
-    "@storybook/core-events": "5.0.0-rc.0",
+    "@storybook/addons": "5.0.0-rc.1",
+    "@storybook/channels": "5.0.0-rc.1",
+    "@storybook/components": "5.0.0-rc.1",
+    "@storybook/core-events": "5.0.0-rc.1",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "prop-types": "^15.6.2",
diff --git a/addons/events/package.json b/addons/events/package.json
index df295af9a7c..629a4dbaa5d 100644
--- a/addons/events/package.json
+++ b/addons/events/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-events",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "description": "Add events to your Storybook stories.",
   "keywords": [
     "addon",
@@ -23,9 +23,9 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.0",
-    "@storybook/core-events": "5.0.0-rc.0",
-    "@storybook/theming": "5.0.0-rc.0",
+    "@storybook/addons": "5.0.0-rc.1",
+    "@storybook/core-events": "5.0.0-rc.1",
+    "@storybook/theming": "5.0.0-rc.1",
     "core-js": "^2.6.2",
     "format-json": "^1.0.3",
     "prop-types": "^15.6.2",
diff --git a/addons/google-analytics/package.json b/addons/google-analytics/package.json
index 7c5a1e2a542..1d7b936564f 100644
--- a/addons/google-analytics/package.json
+++ b/addons/google-analytics/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-google-analytics",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "description": "Storybook addon for google analytics",
   "keywords": [
     "addon",
@@ -19,8 +19,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.0",
-    "@storybook/core-events": "5.0.0-rc.0",
+    "@storybook/addons": "5.0.0-rc.1",
+    "@storybook/core-events": "5.0.0-rc.1",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "react-ga": "^2.5.3"
diff --git a/addons/graphql/package.json b/addons/graphql/package.json
index 474891b664e..ac3809753c2 100644
--- a/addons/graphql/package.json
+++ b/addons/graphql/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-graphql",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "description": "Storybook addon to display the GraphiQL IDE",
   "keywords": [
     "addon",
diff --git a/addons/info/package.json b/addons/info/package.json
index 89123b151e7..59b23494a52 100644
--- a/addons/info/package.json
+++ b/addons/info/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-info",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "description": "A Storybook addon to show additional information for your stories.",
   "keywords": [
     "addon",
@@ -21,10 +21,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.0",
-    "@storybook/client-logger": "5.0.0-rc.0",
-    "@storybook/components": "5.0.0-rc.0",
-    "@storybook/theming": "5.0.0-rc.0",
+    "@storybook/addons": "5.0.0-rc.1",
+    "@storybook/client-logger": "5.0.0-rc.1",
+    "@storybook/components": "5.0.0-rc.1",
+    "@storybook/theming": "5.0.0-rc.1",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "marksy": "^6.1.0",
diff --git a/addons/jest/package.json b/addons/jest/package.json
index 106c9a7f665..0a5954f7a22 100644
--- a/addons/jest/package.json
+++ b/addons/jest/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-jest",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "description": "React storybook addon that show component jest report",
   "keywords": [
     "addon",
@@ -27,10 +27,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.0",
-    "@storybook/components": "5.0.0-rc.0",
-    "@storybook/core-events": "5.0.0-rc.0",
-    "@storybook/theming": "5.0.0-rc.0",
+    "@storybook/addons": "5.0.0-rc.1",
+    "@storybook/components": "5.0.0-rc.1",
+    "@storybook/core-events": "5.0.0-rc.1",
+    "@storybook/theming": "5.0.0-rc.1",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "prop-types": "^15.6.2",
diff --git a/addons/knobs/package.json b/addons/knobs/package.json
index 9d2d2a7c6d4..c77d58957d6 100644
--- a/addons/knobs/package.json
+++ b/addons/knobs/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-knobs",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "description": "Storybook Addon Prop Editor Component",
   "keywords": [
     "addon",
@@ -21,10 +21,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.0",
-    "@storybook/components": "5.0.0-rc.0",
-    "@storybook/core-events": "5.0.0-rc.0",
-    "@storybook/theming": "5.0.0-rc.0",
+    "@storybook/addons": "5.0.0-rc.1",
+    "@storybook/components": "5.0.0-rc.1",
+    "@storybook/core-events": "5.0.0-rc.1",
+    "@storybook/theming": "5.0.0-rc.1",
     "copy-to-clipboard": "^3.0.8",
     "core-js": "^2.6.2",
     "escape-html": "^1.0.3",
diff --git a/addons/links/package.json b/addons/links/package.json
index f41d10b46b0..275d782ed2f 100644
--- a/addons/links/package.json
+++ b/addons/links/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-links",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "description": "Story Links addon for storybook",
   "keywords": [
     "addon",
@@ -21,8 +21,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.0",
-    "@storybook/core-events": "5.0.0-rc.0",
+    "@storybook/addons": "5.0.0-rc.1",
+    "@storybook/core-events": "5.0.0-rc.1",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/addons/notes/package.json b/addons/notes/package.json
index 06581f9191b..c471d5d0756 100644
--- a/addons/notes/package.json
+++ b/addons/notes/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-notes",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "description": "Write notes for your Storybook stories.",
   "keywords": [
     "addon",
@@ -22,11 +22,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.0",
-    "@storybook/client-logger": "5.0.0-rc.0",
-    "@storybook/components": "5.0.0-rc.0",
-    "@storybook/core-events": "5.0.0-rc.0",
-    "@storybook/theming": "5.0.0-rc.0",
+    "@storybook/addons": "5.0.0-rc.1",
+    "@storybook/client-logger": "5.0.0-rc.1",
+    "@storybook/components": "5.0.0-rc.1",
+    "@storybook/core-events": "5.0.0-rc.1",
+    "@storybook/theming": "5.0.0-rc.1",
     "markdown-to-jsx": "^6.9.1",
     "prop-types": "^15.6.2",
     "util-deprecate": "^1.0.2"
diff --git a/addons/options/package.json b/addons/options/package.json
index 94ac709d962..29b5df669da 100644
--- a/addons/options/package.json
+++ b/addons/options/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-options",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "description": "Options addon for storybook",
   "keywords": [
     "addon",
@@ -20,7 +20,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.0",
+    "@storybook/addons": "5.0.0-rc.1",
     "core-js": "^2.6.2",
     "util-deprecate": "^1.0.2"
   },
diff --git a/addons/storyshots/storyshots-core/package.json b/addons/storyshots/storyshots-core/package.json
index c972ab89b64..900e2ce6b7e 100644
--- a/addons/storyshots/storyshots-core/package.json
+++ b/addons/storyshots/storyshots-core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storyshots",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "description": "StoryShots is a Jest Snapshot Testing Addon for Storybook.",
   "keywords": [
     "addon",
@@ -24,7 +24,7 @@
     "storybook": "start-storybook -p 6006"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.0",
+    "@storybook/addons": "5.0.0-rc.1",
     "core-js": "^2.6.2",
     "glob": "^7.1.3",
     "global": "^4.3.2",
diff --git a/addons/storyshots/storyshots-puppeteer/package.json b/addons/storyshots/storyshots-puppeteer/package.json
index c965609c873..fec79e00d47 100644
--- a/addons/storyshots/storyshots-puppeteer/package.json
+++ b/addons/storyshots/storyshots-puppeteer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storyshots-puppeteer",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "description": "Image snappshots addition to StoryShots base on puppeteer",
   "keywords": [
     "addon",
@@ -21,8 +21,8 @@
     "prepare": "node ../../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.0",
-    "@storybook/node-logger": "5.0.0-rc.0",
+    "@storybook/core": "5.0.0-rc.1",
+    "@storybook/node-logger": "5.0.0-rc.1",
     "core-js": "^2.6.2",
     "jest-image-snapshot": "^2.6.0",
     "puppeteer": "^1.12.0",
diff --git a/addons/storysource/package.json b/addons/storysource/package.json
index 1b3518c2475..7755343e3f0 100644
--- a/addons/storysource/package.json
+++ b/addons/storysource/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storysource",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "description": "Stories addon for storybook",
   "keywords": [
     "addon",
@@ -21,9 +21,9 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.0",
-    "@storybook/components": "5.0.0-rc.0",
-    "@storybook/theming": "5.0.0-rc.0",
+    "@storybook/addons": "5.0.0-rc.1",
+    "@storybook/components": "5.0.0-rc.1",
+    "@storybook/theming": "5.0.0-rc.1",
     "core-js": "^2.6.2",
     "estraverse": "^4.2.0",
     "loader-utils": "^1.2.1",
diff --git a/addons/viewport/package.json b/addons/viewport/package.json
index 83bbdfab550..8dc37cce563 100644
--- a/addons/viewport/package.json
+++ b/addons/viewport/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-viewport",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "description": "Storybook addon to change the viewport size to mobile",
   "keywords": [
     "addon",
@@ -20,11 +20,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.0",
-    "@storybook/client-logger": "5.0.0-rc.0",
-    "@storybook/components": "5.0.0-rc.0",
-    "@storybook/core-events": "5.0.0-rc.0",
-    "@storybook/theming": "5.0.0-rc.0",
+    "@storybook/addons": "5.0.0-rc.1",
+    "@storybook/client-logger": "5.0.0-rc.1",
+    "@storybook/components": "5.0.0-rc.1",
+    "@storybook/core-events": "5.0.0-rc.1",
+    "@storybook/theming": "5.0.0-rc.1",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
diff --git a/app/angular/package.json b/app/angular/package.json
index 2aba06f40c1..cb2733fa394 100644
--- a/app/angular/package.json
+++ b/app/angular/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/angular",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "description": "Storybook for Angular: Develop Angular Components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,8 +25,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.0",
-    "@storybook/node-logger": "5.0.0-rc.0",
+    "@storybook/core": "5.0.0-rc.1",
+    "@storybook/node-logger": "5.0.0-rc.1",
     "angular2-template-loader": "^0.6.2",
     "core-js": "^2.6.2",
     "fork-ts-checker-webpack-plugin": "^0.5.2",
diff --git a/app/ember/package.json b/app/ember/package.json
index e13db176821..68b2072619b 100644
--- a/app/ember/package.json
+++ b/app/ember/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/ember",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "description": "Storybook for Ember: Develop Ember Component in isolation with Hot Reloading.",
   "homepage": "https://github.com/storybooks/storybook/tree/master/app/ember",
   "bugs": {
@@ -23,7 +23,7 @@
   },
   "dependencies": {
     "@ember/test-helpers": "^1.3.1",
-    "@storybook/core": "5.0.0-rc.0",
+    "@storybook/core": "5.0.0-rc.1",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/html/package.json b/app/html/package.json
index 5c4c8970dd2..f3d9393d7f1 100644
--- a/app/html/package.json
+++ b/app/html/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/html",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "description": "Storybook for HTML: View HTML snippets in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.0",
+    "@storybook/core": "5.0.0-rc.1",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/marko/package.json b/app/marko/package.json
index d52a4e5809c..d838d663cd7 100644
--- a/app/marko/package.json
+++ b/app/marko/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/marko",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "description": "Storybook for Marko: Develop Marko Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.0",
+    "@storybook/core": "5.0.0-rc.1",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/mithril/package.json b/app/mithril/package.json
index 59cbe3015bd..f94cf749898 100644
--- a/app/mithril/package.json
+++ b/app/mithril/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/mithril",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "description": "Storybook for Mithril: Develop Mithril Component in isolation.",
   "keywords": [
     "storybook"
@@ -26,7 +26,7 @@
   },
   "dependencies": {
     "@babel/plugin-transform-react-jsx": "^7.3.0",
-    "@storybook/core": "5.0.0-rc.0",
+    "@storybook/core": "5.0.0-rc.1",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/polymer/package.json b/app/polymer/package.json
index 5a2b13ef941..dfbbf27ec12 100644
--- a/app/polymer/package.json
+++ b/app/polymer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/polymer",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "description": "Storybook for Polymer: Develop Polymer components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.0",
+    "@storybook/core": "5.0.0-rc.1",
     "@webcomponents/webcomponentsjs": "^1.2.0",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
diff --git a/app/preact/package.json b/app/preact/package.json
index 68321f54d65..82271fc297b 100644
--- a/app/preact/package.json
+++ b/app/preact/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/preact",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "description": "Storybook for Preact: Develop Preact Component in isolation.",
   "keywords": [
     "storybook"
@@ -26,7 +26,7 @@
   },
   "dependencies": {
     "@babel/plugin-transform-react-jsx": "^7.3.0",
-    "@storybook/core": "5.0.0-rc.0",
+    "@storybook/core": "5.0.0-rc.1",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/react/package.json b/app/react/package.json
index ed11da3511a..02dca019dcd 100644
--- a/app/react/package.json
+++ b/app/react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/react",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "description": "Storybook for React: Develop React Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -28,9 +28,9 @@
     "@babel/plugin-transform-react-constant-elements": "^7.2.0",
     "@babel/preset-flow": "^7.0.0",
     "@babel/preset-react": "^7.0.0",
-    "@storybook/core": "5.0.0-rc.0",
-    "@storybook/node-logger": "5.0.0-rc.0",
-    "@storybook/theming": "5.0.0-rc.0",
+    "@storybook/core": "5.0.0-rc.1",
+    "@storybook/node-logger": "5.0.0-rc.1",
+    "@storybook/theming": "5.0.0-rc.1",
     "@svgr/webpack": "^4.0.3",
     "babel-plugin-named-asset-import": "^0.3.0",
     "babel-plugin-react-docgen": "^2.0.2",
diff --git a/app/riot/package.json b/app/riot/package.json
index cd417586292..ba674a6845b 100644
--- a/app/riot/package.json
+++ b/app/riot/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/riot",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "description": "Storybook for riot.js: View riot snippets in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.0",
+    "@storybook/core": "5.0.0-rc.1",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/svelte/package.json b/app/svelte/package.json
index 528bffd6555..38e5d867c7d 100644
--- a/app/svelte/package.json
+++ b/app/svelte/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/svelte",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "description": "Storybook for Svelte: Develop Svelte Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.0",
+    "@storybook/core": "5.0.0-rc.1",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/vue/package.json b/app/vue/package.json
index f9428fcb187..6a23872320c 100644
--- a/app/vue/package.json
+++ b/app/vue/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/vue",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "description": "Storybook for Vue: Develop Vue Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.0",
+    "@storybook/core": "5.0.0-rc.1",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/examples/angular-cli/package.json b/examples/angular-cli/package.json
index c6e3b0028c8..e3caad48227 100644
--- a/examples/angular-cli/package.json
+++ b/examples/angular-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "angular-cli",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "private": true,
   "license": "MIT",
   "scripts": {
@@ -33,18 +33,18 @@
     "@angular-devkit/build-angular": "^0.11.4",
     "@angular/cli": "^7.3.0",
     "@angular/compiler-cli": "^7.2.1",
-    "@storybook/addon-actions": "5.0.0-rc.0",
-    "@storybook/addon-backgrounds": "5.0.0-rc.0",
-    "@storybook/addon-centered": "5.0.0-rc.0",
-    "@storybook/addon-jest": "5.0.0-rc.0",
-    "@storybook/addon-knobs": "5.0.0-rc.0",
-    "@storybook/addon-links": "5.0.0-rc.0",
-    "@storybook/addon-notes": "5.0.0-rc.0",
-    "@storybook/addon-options": "5.0.0-rc.0",
-    "@storybook/addon-storyshots": "5.0.0-rc.0",
-    "@storybook/addon-storysource": "5.0.0-rc.0",
-    "@storybook/addons": "5.0.0-rc.0",
-    "@storybook/angular": "5.0.0-rc.0",
+    "@storybook/addon-actions": "5.0.0-rc.1",
+    "@storybook/addon-backgrounds": "5.0.0-rc.1",
+    "@storybook/addon-centered": "5.0.0-rc.1",
+    "@storybook/addon-jest": "5.0.0-rc.1",
+    "@storybook/addon-knobs": "5.0.0-rc.1",
+    "@storybook/addon-links": "5.0.0-rc.1",
+    "@storybook/addon-notes": "5.0.0-rc.1",
+    "@storybook/addon-options": "5.0.0-rc.1",
+    "@storybook/addon-storyshots": "5.0.0-rc.1",
+    "@storybook/addon-storysource": "5.0.0-rc.1",
+    "@storybook/addons": "5.0.0-rc.1",
+    "@storybook/angular": "5.0.0-rc.1",
     "@types/core-js": "^2.5.0",
     "@types/jest": "^23.3.13",
     "@types/node": "~10.12.19",
diff --git a/examples/cra-kitchen-sink/package.json b/examples/cra-kitchen-sink/package.json
index cad7b978b59..612d354950c 100644
--- a/examples/cra-kitchen-sink/package.json
+++ b/examples/cra-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "cra-kitchen-sink",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "private": true,
   "scripts": {
     "build": "react-scripts build",
@@ -18,21 +18,21 @@
     "react-lifecycles-compat": "^3.0.4"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.0.0-rc.0",
-    "@storybook/addon-actions": "5.0.0-rc.0",
-    "@storybook/addon-backgrounds": "5.0.0-rc.0",
-    "@storybook/addon-centered": "5.0.0-rc.0",
-    "@storybook/addon-events": "5.0.0-rc.0",
-    "@storybook/addon-info": "5.0.0-rc.0",
-    "@storybook/addon-jest": "5.0.0-rc.0",
-    "@storybook/addon-knobs": "5.0.0-rc.0",
-    "@storybook/addon-links": "5.0.0-rc.0",
-    "@storybook/addon-notes": "5.0.0-rc.0",
-    "@storybook/addon-options": "5.0.0-rc.0",
-    "@storybook/addon-storyshots": "5.0.0-rc.0",
-    "@storybook/addons": "5.0.0-rc.0",
-    "@storybook/client-logger": "5.0.0-rc.0",
-    "@storybook/react": "5.0.0-rc.0",
+    "@storybook/addon-a11y": "5.0.0-rc.1",
+    "@storybook/addon-actions": "5.0.0-rc.1",
+    "@storybook/addon-backgrounds": "5.0.0-rc.1",
+    "@storybook/addon-centered": "5.0.0-rc.1",
+    "@storybook/addon-events": "5.0.0-rc.1",
+    "@storybook/addon-info": "5.0.0-rc.1",
+    "@storybook/addon-jest": "5.0.0-rc.1",
+    "@storybook/addon-knobs": "5.0.0-rc.1",
+    "@storybook/addon-links": "5.0.0-rc.1",
+    "@storybook/addon-notes": "5.0.0-rc.1",
+    "@storybook/addon-options": "5.0.0-rc.1",
+    "@storybook/addon-storyshots": "5.0.0-rc.1",
+    "@storybook/addons": "5.0.0-rc.1",
+    "@storybook/client-logger": "5.0.0-rc.1",
+    "@storybook/react": "5.0.0-rc.1",
     "enzyme": "^3.7.0",
     "enzyme-adapter-react-16": "^1.9.1",
     "enzyme-to-json": "^3.3.4",
diff --git a/examples/cra-ts-kitchen-sink/package.json b/examples/cra-ts-kitchen-sink/package.json
index 64b19007079..1241af5607b 100644
--- a/examples/cra-ts-kitchen-sink/package.json
+++ b/examples/cra-ts-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "cra-ts-kitchen-sink",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook -s public",
@@ -19,11 +19,11 @@
     "react-dom": "^16.8.1"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.0",
-    "@storybook/addon-info": "5.0.0-rc.0",
-    "@storybook/addon-options": "5.0.0-rc.0",
-    "@storybook/addons": "5.0.0-rc.0",
-    "@storybook/react": "5.0.0-rc.0",
+    "@storybook/addon-actions": "5.0.0-rc.1",
+    "@storybook/addon-info": "5.0.0-rc.1",
+    "@storybook/addon-options": "5.0.0-rc.1",
+    "@storybook/addons": "5.0.0-rc.1",
+    "@storybook/react": "5.0.0-rc.1",
     "@types/enzyme": "^3.1.15",
     "@types/react": "^16.7.22",
     "@types/react-dom": "^16.0.11",
diff --git a/examples/ember-cli/package.json b/examples/ember-cli/package.json
index e0dfee166e0..c899919d2f6 100644
--- a/examples/ember-cli/package.json
+++ b/examples/ember-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "ember-example",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "private": true,
   "scripts": {
     "build": "ember build",
@@ -14,18 +14,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.2.2",
-    "@storybook/addon-a11y": "5.0.0-rc.0",
-    "@storybook/addon-actions": "5.0.0-rc.0",
-    "@storybook/addon-backgrounds": "5.0.0-rc.0",
-    "@storybook/addon-centered": "5.0.0-rc.0",
-    "@storybook/addon-knobs": "5.0.0-rc.0",
-    "@storybook/addon-links": "5.0.0-rc.0",
-    "@storybook/addon-notes": "5.0.0-rc.0",
-    "@storybook/addon-options": "5.0.0-rc.0",
-    "@storybook/addon-storysource": "5.0.0-rc.0",
-    "@storybook/addon-viewport": "5.0.0-rc.0",
-    "@storybook/addons": "5.0.0-rc.0",
-    "@storybook/ember": "5.0.0-rc.0",
+    "@storybook/addon-a11y": "5.0.0-rc.1",
+    "@storybook/addon-actions": "5.0.0-rc.1",
+    "@storybook/addon-backgrounds": "5.0.0-rc.1",
+    "@storybook/addon-centered": "5.0.0-rc.1",
+    "@storybook/addon-knobs": "5.0.0-rc.1",
+    "@storybook/addon-links": "5.0.0-rc.1",
+    "@storybook/addon-notes": "5.0.0-rc.1",
+    "@storybook/addon-options": "5.0.0-rc.1",
+    "@storybook/addon-storysource": "5.0.0-rc.1",
+    "@storybook/addon-viewport": "5.0.0-rc.1",
+    "@storybook/addons": "5.0.0-rc.1",
+    "@storybook/ember": "5.0.0-rc.1",
     "babel-loader": "^8",
     "broccoli-asset-rev": "^3.0.0",
     "cross-env": "^5.2.0",
diff --git a/examples/html-kitchen-sink/package.json b/examples/html-kitchen-sink/package.json
index 4c86625d181..a8afac3a589 100644
--- a/examples/html-kitchen-sink/package.json
+++ b/examples/html-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "html-kitchen-sink",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "private": true,
   "description": "",
   "keywords": [],
@@ -13,23 +13,23 @@
     "storybook": "start-storybook -p 9006"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.0.0-rc.0",
-    "@storybook/addon-actions": "5.0.0-rc.0",
-    "@storybook/addon-backgrounds": "5.0.0-rc.0",
-    "@storybook/addon-centered": "5.0.0-rc.0",
-    "@storybook/addon-events": "5.0.0-rc.0",
-    "@storybook/addon-jest": "5.0.0-rc.0",
-    "@storybook/addon-knobs": "5.0.0-rc.0",
-    "@storybook/addon-links": "5.0.0-rc.0",
-    "@storybook/addon-notes": "5.0.0-rc.0",
-    "@storybook/addon-options": "5.0.0-rc.0",
-    "@storybook/addon-storyshots": "5.0.0-rc.0",
-    "@storybook/addon-storysource": "5.0.0-rc.0",
-    "@storybook/addon-viewport": "5.0.0-rc.0",
-    "@storybook/addons": "5.0.0-rc.0",
-    "@storybook/core": "5.0.0-rc.0",
-    "@storybook/core-events": "5.0.0-rc.0",
-    "@storybook/html": "5.0.0-rc.0",
+    "@storybook/addon-a11y": "5.0.0-rc.1",
+    "@storybook/addon-actions": "5.0.0-rc.1",
+    "@storybook/addon-backgrounds": "5.0.0-rc.1",
+    "@storybook/addon-centered": "5.0.0-rc.1",
+    "@storybook/addon-events": "5.0.0-rc.1",
+    "@storybook/addon-jest": "5.0.0-rc.1",
+    "@storybook/addon-knobs": "5.0.0-rc.1",
+    "@storybook/addon-links": "5.0.0-rc.1",
+    "@storybook/addon-notes": "5.0.0-rc.1",
+    "@storybook/addon-options": "5.0.0-rc.1",
+    "@storybook/addon-storyshots": "5.0.0-rc.1",
+    "@storybook/addon-storysource": "5.0.0-rc.1",
+    "@storybook/addon-viewport": "5.0.0-rc.1",
+    "@storybook/addons": "5.0.0-rc.1",
+    "@storybook/core": "5.0.0-rc.1",
+    "@storybook/core-events": "5.0.0-rc.1",
+    "@storybook/html": "5.0.0-rc.1",
     "eventemitter3": "^3.1.0",
     "format-json": "^1.0.3",
     "global": "^4.3.2",
diff --git a/examples/marko-cli/package.json b/examples/marko-cli/package.json
index 6f85f4b4b7e..7d6df4a4255 100644
--- a/examples/marko-cli/package.json
+++ b/examples/marko-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "marko-cli",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "private": true,
   "description": "Demo of how to build an app using marko-starter",
   "repository": {
@@ -22,12 +22,12 @@
     "marko-starter": "^2.0.4"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.0",
-    "@storybook/addon-knobs": "5.0.0-rc.0",
-    "@storybook/addon-options": "5.0.0-rc.0",
-    "@storybook/addon-storysource": "5.0.0-rc.0",
-    "@storybook/addons": "5.0.0-rc.0",
-    "@storybook/marko": "5.0.0-rc.0",
+    "@storybook/addon-actions": "5.0.0-rc.1",
+    "@storybook/addon-knobs": "5.0.0-rc.1",
+    "@storybook/addon-options": "5.0.0-rc.1",
+    "@storybook/addon-storysource": "5.0.0-rc.1",
+    "@storybook/addons": "5.0.0-rc.1",
+    "@storybook/marko": "5.0.0-rc.1",
     "prettier": "^1.16.4",
     "webpack": "^4.29.0"
   }
diff --git a/examples/mithril-kitchen-sink/package.json b/examples/mithril-kitchen-sink/package.json
index a53a0986df1..25127b44841 100644
--- a/examples/mithril-kitchen-sink/package.json
+++ b/examples/mithril-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "mithril-example",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook",
@@ -10,18 +10,18 @@
     "mithril": "^1.1.6"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.0",
-    "@storybook/addon-backgrounds": "5.0.0-rc.0",
-    "@storybook/addon-centered": "5.0.0-rc.0",
-    "@storybook/addon-knobs": "5.0.0-rc.0",
-    "@storybook/addon-links": "5.0.0-rc.0",
-    "@storybook/addon-notes": "5.0.0-rc.0",
-    "@storybook/addon-options": "5.0.0-rc.0",
-    "@storybook/addon-storyshots": "5.0.0-rc.0",
-    "@storybook/addon-storysource": "5.0.0-rc.0",
-    "@storybook/addon-viewport": "5.0.0-rc.0",
-    "@storybook/addons": "5.0.0-rc.0",
-    "@storybook/mithril": "5.0.0-rc.0",
+    "@storybook/addon-actions": "5.0.0-rc.1",
+    "@storybook/addon-backgrounds": "5.0.0-rc.1",
+    "@storybook/addon-centered": "5.0.0-rc.1",
+    "@storybook/addon-knobs": "5.0.0-rc.1",
+    "@storybook/addon-links": "5.0.0-rc.1",
+    "@storybook/addon-notes": "5.0.0-rc.1",
+    "@storybook/addon-options": "5.0.0-rc.1",
+    "@storybook/addon-storyshots": "5.0.0-rc.1",
+    "@storybook/addon-storysource": "5.0.0-rc.1",
+    "@storybook/addon-viewport": "5.0.0-rc.1",
+    "@storybook/addons": "5.0.0-rc.1",
+    "@storybook/mithril": "5.0.0-rc.1",
     "webpack": "^4.29.0"
   }
 }
diff --git a/examples/official-storybook/package.json b/examples/official-storybook/package.json
index 787b5681403..fe056b631a1 100644
--- a/examples/official-storybook/package.json
+++ b/examples/official-storybook/package.json
@@ -1,6 +1,6 @@
 {
   "name": "official-storybook",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook -c ./ -s built-storybooks",
@@ -12,29 +12,29 @@
     "storybook": "cross-env STORYBOOK_DISPLAY_WARNING=true DISPLAY_WARNING=true start-storybook -p 9011 -c ./ -s built-storybooks --no-dll"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.0.0-rc.0",
-    "@storybook/addon-actions": "5.0.0-rc.0",
-    "@storybook/addon-backgrounds": "5.0.0-rc.0",
-    "@storybook/addon-centered": "5.0.0-rc.0",
-    "@storybook/addon-cssresources": "5.0.0-rc.0",
-    "@storybook/addon-events": "5.0.0-rc.0",
-    "@storybook/addon-graphql": "5.0.0-rc.0",
-    "@storybook/addon-info": "5.0.0-rc.0",
-    "@storybook/addon-jest": "5.0.0-rc.0",
-    "@storybook/addon-knobs": "5.0.0-rc.0",
-    "@storybook/addon-links": "5.0.0-rc.0",
-    "@storybook/addon-notes": "5.0.0-rc.0",
-    "@storybook/addon-options": "5.0.0-rc.0",
-    "@storybook/addon-storyshots": "5.0.0-rc.0",
-    "@storybook/addon-storyshots-puppeteer": "5.0.0-rc.0",
-    "@storybook/addon-storysource": "5.0.0-rc.0",
-    "@storybook/addon-viewport": "5.0.0-rc.0",
-    "@storybook/addons": "5.0.0-rc.0",
-    "@storybook/components": "5.0.0-rc.0",
-    "@storybook/core-events": "5.0.0-rc.0",
-    "@storybook/node-logger": "5.0.0-rc.0",
-    "@storybook/react": "5.0.0-rc.0",
-    "@storybook/theming": "5.0.0-rc.0",
+    "@storybook/addon-a11y": "5.0.0-rc.1",
+    "@storybook/addon-actions": "5.0.0-rc.1",
+    "@storybook/addon-backgrounds": "5.0.0-rc.1",
+    "@storybook/addon-centered": "5.0.0-rc.1",
+    "@storybook/addon-cssresources": "5.0.0-rc.1",
+    "@storybook/addon-events": "5.0.0-rc.1",
+    "@storybook/addon-graphql": "5.0.0-rc.1",
+    "@storybook/addon-info": "5.0.0-rc.1",
+    "@storybook/addon-jest": "5.0.0-rc.1",
+    "@storybook/addon-knobs": "5.0.0-rc.1",
+    "@storybook/addon-links": "5.0.0-rc.1",
+    "@storybook/addon-notes": "5.0.0-rc.1",
+    "@storybook/addon-options": "5.0.0-rc.1",
+    "@storybook/addon-storyshots": "5.0.0-rc.1",
+    "@storybook/addon-storyshots-puppeteer": "5.0.0-rc.1",
+    "@storybook/addon-storysource": "5.0.0-rc.1",
+    "@storybook/addon-viewport": "5.0.0-rc.1",
+    "@storybook/addons": "5.0.0-rc.1",
+    "@storybook/components": "5.0.0-rc.1",
+    "@storybook/core-events": "5.0.0-rc.1",
+    "@storybook/node-logger": "5.0.0-rc.1",
+    "@storybook/react": "5.0.0-rc.1",
+    "@storybook/theming": "5.0.0-rc.1",
     "cors": "^2.8.4",
     "cross-env": "^5.2.0",
     "enzyme-to-json": "^3.3.4",
diff --git a/examples/polymer-cli/package.json b/examples/polymer-cli/package.json
index 93b6f386c10..2d80c2d868f 100644
--- a/examples/polymer-cli/package.json
+++ b/examples/polymer-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "polymer-cli",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook",
@@ -9,15 +9,15 @@
   },
   "dependencies": {
     "@polymer/polymer": "^2.6.0",
-    "@storybook/addon-actions": "5.0.0-rc.0",
-    "@storybook/addon-backgrounds": "5.0.0-rc.0",
-    "@storybook/addon-knobs": "5.0.0-rc.0",
-    "@storybook/addon-links": "5.0.0-rc.0",
-    "@storybook/addon-notes": "5.0.0-rc.0",
-    "@storybook/addon-options": "5.0.0-rc.0",
-    "@storybook/addon-storysource": "5.0.0-rc.0",
-    "@storybook/addon-viewport": "5.0.0-rc.0",
-    "@storybook/polymer": "5.0.0-rc.0",
+    "@storybook/addon-actions": "5.0.0-rc.1",
+    "@storybook/addon-backgrounds": "5.0.0-rc.1",
+    "@storybook/addon-knobs": "5.0.0-rc.1",
+    "@storybook/addon-links": "5.0.0-rc.1",
+    "@storybook/addon-notes": "5.0.0-rc.1",
+    "@storybook/addon-options": "5.0.0-rc.1",
+    "@storybook/addon-storysource": "5.0.0-rc.1",
+    "@storybook/addon-viewport": "5.0.0-rc.1",
+    "@storybook/polymer": "5.0.0-rc.1",
     "@webcomponents/webcomponentsjs": "^1.2.0",
     "global": "^4.3.2",
     "lit-html": "^1.0.0",
diff --git a/examples/preact-kitchen-sink/package.json b/examples/preact-kitchen-sink/package.json
index ce3df30411c..1f69010be02 100644
--- a/examples/preact-kitchen-sink/package.json
+++ b/examples/preact-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "preact-example",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "private": true,
   "scripts": {
     "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
@@ -15,18 +15,18 @@
   "devDependencies": {
     "@babel/core": "^7.2.2",
     "@babel/plugin-transform-runtime": "^7.2.0",
-    "@storybook/addon-actions": "5.0.0-rc.0",
-    "@storybook/addon-backgrounds": "5.0.0-rc.0",
-    "@storybook/addon-centered": "5.0.0-rc.0",
-    "@storybook/addon-knobs": "5.0.0-rc.0",
-    "@storybook/addon-links": "5.0.0-rc.0",
-    "@storybook/addon-notes": "5.0.0-rc.0",
-    "@storybook/addon-options": "5.0.0-rc.0",
-    "@storybook/addon-storyshots": "5.0.0-rc.0",
-    "@storybook/addon-storysource": "5.0.0-rc.0",
-    "@storybook/addon-viewport": "5.0.0-rc.0",
-    "@storybook/addons": "5.0.0-rc.0",
-    "@storybook/preact": "5.0.0-rc.0",
+    "@storybook/addon-actions": "5.0.0-rc.1",
+    "@storybook/addon-backgrounds": "5.0.0-rc.1",
+    "@storybook/addon-centered": "5.0.0-rc.1",
+    "@storybook/addon-knobs": "5.0.0-rc.1",
+    "@storybook/addon-links": "5.0.0-rc.1",
+    "@storybook/addon-notes": "5.0.0-rc.1",
+    "@storybook/addon-options": "5.0.0-rc.1",
+    "@storybook/addon-storyshots": "5.0.0-rc.1",
+    "@storybook/addon-storysource": "5.0.0-rc.1",
+    "@storybook/addon-viewport": "5.0.0-rc.1",
+    "@storybook/addons": "5.0.0-rc.1",
+    "@storybook/preact": "5.0.0-rc.1",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
     "file-loader": "^3.0.1",
diff --git a/examples/riot-kitchen-sink/package.json b/examples/riot-kitchen-sink/package.json
index 5e8aa491187..b15b2e3f0b9 100644
--- a/examples/riot-kitchen-sink/package.json
+++ b/examples/riot-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "riot-example",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "private": true,
   "scripts": {
     "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
@@ -15,18 +15,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.2.2",
-    "@storybook/addon-actions": "5.0.0-rc.0",
-    "@storybook/addon-backgrounds": "5.0.0-rc.0",
-    "@storybook/addon-centered": "5.0.0-rc.0",
-    "@storybook/addon-knobs": "5.0.0-rc.0",
-    "@storybook/addon-links": "5.0.0-rc.0",
-    "@storybook/addon-notes": "5.0.0-rc.0",
-    "@storybook/addon-options": "5.0.0-rc.0",
-    "@storybook/addon-storyshots": "5.0.0-rc.0",
-    "@storybook/addon-storysource": "5.0.0-rc.0",
-    "@storybook/addon-viewport": "5.0.0-rc.0",
-    "@storybook/addons": "5.0.0-rc.0",
-    "@storybook/riot": "5.0.0-rc.0",
+    "@storybook/addon-actions": "5.0.0-rc.1",
+    "@storybook/addon-backgrounds": "5.0.0-rc.1",
+    "@storybook/addon-centered": "5.0.0-rc.1",
+    "@storybook/addon-knobs": "5.0.0-rc.1",
+    "@storybook/addon-links": "5.0.0-rc.1",
+    "@storybook/addon-notes": "5.0.0-rc.1",
+    "@storybook/addon-options": "5.0.0-rc.1",
+    "@storybook/addon-storyshots": "5.0.0-rc.1",
+    "@storybook/addon-storysource": "5.0.0-rc.1",
+    "@storybook/addon-viewport": "5.0.0-rc.1",
+    "@storybook/addons": "5.0.0-rc.1",
+    "@storybook/riot": "5.0.0-rc.1",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
     "file-loader": "^3.0.1",
diff --git a/examples/svelte-kitchen-sink/package.json b/examples/svelte-kitchen-sink/package.json
index e431457acc9..02a851c38ca 100644
--- a/examples/svelte-kitchen-sink/package.json
+++ b/examples/svelte-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "svelte-example",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook -s public",
@@ -10,17 +10,17 @@
     "global": "^4.3.2"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.0",
-    "@storybook/addon-backgrounds": "5.0.0-rc.0",
-    "@storybook/addon-centered": "5.0.0-rc.0",
-    "@storybook/addon-knobs": "5.0.0-rc.0",
-    "@storybook/addon-links": "5.0.0-rc.0",
-    "@storybook/addon-notes": "5.0.0-rc.0",
-    "@storybook/addon-options": "5.0.0-rc.0",
-    "@storybook/addon-storyshots": "5.0.0-rc.0",
-    "@storybook/addon-storysource": "5.0.0-rc.0",
-    "@storybook/addon-viewport": "5.0.0-rc.0",
-    "@storybook/addons": "5.0.0-rc.0",
-    "@storybook/svelte": "5.0.0-rc.0"
+    "@storybook/addon-actions": "5.0.0-rc.1",
+    "@storybook/addon-backgrounds": "5.0.0-rc.1",
+    "@storybook/addon-centered": "5.0.0-rc.1",
+    "@storybook/addon-knobs": "5.0.0-rc.1",
+    "@storybook/addon-links": "5.0.0-rc.1",
+    "@storybook/addon-notes": "5.0.0-rc.1",
+    "@storybook/addon-options": "5.0.0-rc.1",
+    "@storybook/addon-storyshots": "5.0.0-rc.1",
+    "@storybook/addon-storysource": "5.0.0-rc.1",
+    "@storybook/addon-viewport": "5.0.0-rc.1",
+    "@storybook/addons": "5.0.0-rc.1",
+    "@storybook/svelte": "5.0.0-rc.1"
   }
 }
diff --git a/examples/vue-kitchen-sink/package.json b/examples/vue-kitchen-sink/package.json
index 10aaae91dec..c80abc3f524 100644
--- a/examples/vue-kitchen-sink/package.json
+++ b/examples/vue-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "vue-example",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "private": true,
   "scripts": {
     "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
@@ -14,18 +14,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.2.2",
-    "@storybook/addon-actions": "5.0.0-rc.0",
-    "@storybook/addon-backgrounds": "5.0.0-rc.0",
-    "@storybook/addon-centered": "5.0.0-rc.0",
-    "@storybook/addon-knobs": "5.0.0-rc.0",
-    "@storybook/addon-links": "5.0.0-rc.0",
-    "@storybook/addon-notes": "5.0.0-rc.0",
-    "@storybook/addon-options": "5.0.0-rc.0",
-    "@storybook/addon-storyshots": "5.0.0-rc.0",
-    "@storybook/addon-storysource": "5.0.0-rc.0",
-    "@storybook/addon-viewport": "5.0.0-rc.0",
-    "@storybook/addons": "5.0.0-rc.0",
-    "@storybook/vue": "5.0.0-rc.0",
+    "@storybook/addon-actions": "5.0.0-rc.1",
+    "@storybook/addon-backgrounds": "5.0.0-rc.1",
+    "@storybook/addon-centered": "5.0.0-rc.1",
+    "@storybook/addon-knobs": "5.0.0-rc.1",
+    "@storybook/addon-links": "5.0.0-rc.1",
+    "@storybook/addon-notes": "5.0.0-rc.1",
+    "@storybook/addon-options": "5.0.0-rc.1",
+    "@storybook/addon-storyshots": "5.0.0-rc.1",
+    "@storybook/addon-storysource": "5.0.0-rc.1",
+    "@storybook/addon-viewport": "5.0.0-rc.1",
+    "@storybook/addons": "5.0.0-rc.1",
+    "@storybook/vue": "5.0.0-rc.1",
     "babel-core": "^7.0.0-bridge.0",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
diff --git a/lerna.json b/lerna.json
index 9d722944541..69b885cfa42 100644
--- a/lerna.json
+++ b/lerna.json
@@ -11,5 +11,5 @@
   "npmClient": "yarn",
   "useWorkspaces": true,
   "registry": "https://registry.npmjs.org",
-  "version": "5.0.0-rc.0"
+  "version": "5.0.0-rc.1"
 }
diff --git a/lib/addons/package.json b/lib/addons/package.json
index de26f379e4b..314c0ea0067 100644
--- a/lib/addons/package.json
+++ b/lib/addons/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addons",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "description": "Storybook addons store",
   "keywords": [
     "storybook"
@@ -20,8 +20,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.0.0-rc.0",
-    "@storybook/client-logger": "5.0.0-rc.0",
+    "@storybook/channels": "5.0.0-rc.1",
+    "@storybook/client-logger": "5.0.0-rc.1",
     "global": "^4.3.2",
     "util-deprecate": "^1.0.2"
   },
diff --git a/lib/channel-postmessage/package.json b/lib/channel-postmessage/package.json
index dd52f81ae0f..898c9153eba 100644
--- a/lib/channel-postmessage/package.json
+++ b/lib/channel-postmessage/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channel-postmessage",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "description": "",
   "keywords": [
     "storybook"
@@ -20,7 +20,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.0.0-rc.0",
+    "@storybook/channels": "5.0.0-rc.1",
     "global": "^4.3.2",
     "telejson": "^1.0.1"
   },
diff --git a/lib/channel-websocket/package.json b/lib/channel-websocket/package.json
index bf0eb040f0d..b7b07b9debd 100644
--- a/lib/channel-websocket/package.json
+++ b/lib/channel-websocket/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channel-websocket",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "description": "",
   "keywords": [
     "storybook"
@@ -20,7 +20,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.0.0-rc.0",
+    "@storybook/channels": "5.0.0-rc.1",
     "global": "^4.3.2",
     "json-fn": "^1.1.1"
   },
diff --git a/lib/channels/package.json b/lib/channels/package.json
index 1140800e8fa..07e1cad6154 100644
--- a/lib/channels/package.json
+++ b/lib/channels/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channels",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/cli/package.json b/lib/cli/package.json
index 0cb2f2b6398..908383fb934 100644
--- a/lib/cli/package.json
+++ b/lib/cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/cli",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "description": "Storybook's CLI - easiest method of adding storybook to your projects",
   "keywords": [
     "cli",
@@ -29,7 +29,7 @@
     "@babel/core": "^7.2.2",
     "@babel/preset-env": "^7.3.1",
     "@babel/register": "^7.0.0",
-    "@storybook/codemod": "5.0.0-rc.0",
+    "@storybook/codemod": "5.0.0-rc.1",
     "chalk": "^2.4.1",
     "commander": "^2.19.0",
     "core-js": "^2.6.2",
@@ -43,31 +43,31 @@
     "update-notifier": "^2.5.0"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.0",
-    "@storybook/addon-centered": "5.0.0-rc.0",
-    "@storybook/addon-graphql": "5.0.0-rc.0",
-    "@storybook/addon-info": "5.0.0-rc.0",
-    "@storybook/addon-knobs": "5.0.0-rc.0",
-    "@storybook/addon-links": "5.0.0-rc.0",
-    "@storybook/addon-notes": "5.0.0-rc.0",
-    "@storybook/addon-options": "5.0.0-rc.0",
-    "@storybook/addon-storyshots": "5.0.0-rc.0",
-    "@storybook/addons": "5.0.0-rc.0",
-    "@storybook/angular": "5.0.0-rc.0",
-    "@storybook/channel-postmessage": "5.0.0-rc.0",
-    "@storybook/channel-websocket": "5.0.0-rc.0",
-    "@storybook/channels": "5.0.0-rc.0",
-    "@storybook/ember": "5.0.0-rc.0",
-    "@storybook/html": "5.0.0-rc.0",
-    "@storybook/marko": "5.0.0-rc.0",
-    "@storybook/mithril": "5.0.0-rc.0",
-    "@storybook/polymer": "5.0.0-rc.0",
-    "@storybook/preact": "5.0.0-rc.0",
-    "@storybook/react": "5.0.0-rc.0",
+    "@storybook/addon-actions": "5.0.0-rc.1",
+    "@storybook/addon-centered": "5.0.0-rc.1",
+    "@storybook/addon-graphql": "5.0.0-rc.1",
+    "@storybook/addon-info": "5.0.0-rc.1",
+    "@storybook/addon-knobs": "5.0.0-rc.1",
+    "@storybook/addon-links": "5.0.0-rc.1",
+    "@storybook/addon-notes": "5.0.0-rc.1",
+    "@storybook/addon-options": "5.0.0-rc.1",
+    "@storybook/addon-storyshots": "5.0.0-rc.1",
+    "@storybook/addons": "5.0.0-rc.1",
+    "@storybook/angular": "5.0.0-rc.1",
+    "@storybook/channel-postmessage": "5.0.0-rc.1",
+    "@storybook/channel-websocket": "5.0.0-rc.1",
+    "@storybook/channels": "5.0.0-rc.1",
+    "@storybook/ember": "5.0.0-rc.1",
+    "@storybook/html": "5.0.0-rc.1",
+    "@storybook/marko": "5.0.0-rc.1",
+    "@storybook/mithril": "5.0.0-rc.1",
+    "@storybook/polymer": "5.0.0-rc.1",
+    "@storybook/preact": "5.0.0-rc.1",
+    "@storybook/react": "5.0.0-rc.1",
     "@storybook/react-native": "5.0.0-beta.4",
-    "@storybook/riot": "5.0.0-rc.0",
-    "@storybook/ui": "5.0.0-rc.0",
-    "@storybook/vue": "5.0.0-rc.0"
+    "@storybook/riot": "5.0.0-rc.1",
+    "@storybook/ui": "5.0.0-rc.1",
+    "@storybook/vue": "5.0.0-rc.1"
   },
   "publishConfig": {
     "access": "public"
diff --git a/lib/client-api/package.json b/lib/client-api/package.json
index 584391d5d90..af5a84abe36 100644
--- a/lib/client-api/package.json
+++ b/lib/client-api/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/client-api",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "description": "Storybook Client API",
   "keywords": [
     "storybook"
@@ -19,9 +19,9 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.0",
-    "@storybook/client-logger": "5.0.0-rc.0",
-    "@storybook/core-events": "5.0.0-rc.0",
+    "@storybook/addons": "5.0.0-rc.1",
+    "@storybook/client-logger": "5.0.0-rc.1",
+    "@storybook/core-events": "5.0.0-rc.1",
     "common-tags": "^1.8.0",
     "eventemitter3": "^3.1.0",
     "global": "^4.3.2",
diff --git a/lib/client-logger/package.json b/lib/client-logger/package.json
index 5f37d87e86b..26b41433a53 100644
--- a/lib/client-logger/package.json
+++ b/lib/client-logger/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/client-logger",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/codemod/package.json b/lib/codemod/package.json
index 4cfbb09d7aa..0688718b15d 100644
--- a/lib/codemod/package.json
+++ b/lib/codemod/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/codemod",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "description": "A collection of codemod scripts written with JSCodeshift",
   "keywords": [
     "storybook"
diff --git a/lib/components/package.json b/lib/components/package.json
index 390f915d594..7889f209cd2 100644
--- a/lib/components/package.json
+++ b/lib/components/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/components",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "description": "Core Storybook Components",
   "keywords": [
     "storybook"
@@ -20,11 +20,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.0",
-    "@storybook/client-logger": "5.0.0-rc.0",
-    "@storybook/core-events": "5.0.0-rc.0",
-    "@storybook/router": "5.0.0-rc.0",
-    "@storybook/theming": "5.0.0-rc.0",
+    "@storybook/addons": "5.0.0-rc.1",
+    "@storybook/client-logger": "5.0.0-rc.1",
+    "@storybook/core-events": "5.0.0-rc.1",
+    "@storybook/router": "5.0.0-rc.1",
+    "@storybook/theming": "5.0.0-rc.1",
     "global": "^4.3.2",
     "immer": "^1.12.0",
     "js-beautify": "^1.8.9",
diff --git a/lib/core-events/package.json b/lib/core-events/package.json
index d64a492c452..a0b06bdffa9 100644
--- a/lib/core-events/package.json
+++ b/lib/core-events/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/core-events",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "description": "Event names used in storybook core",
   "keywords": [
     "storybook"
diff --git a/lib/core/package.json b/lib/core/package.json
index bae7f8d36ad..00e83f083dd 100644
--- a/lib/core/package.json
+++ b/lib/core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/core",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "description": "Storybook framework-agnostic API",
   "keywords": [
     "storybook"
@@ -24,14 +24,14 @@
     "@babel/plugin-syntax-dynamic-import": "^7.2.0",
     "@babel/plugin-transform-react-constant-elements": "^7.2.0",
     "@babel/preset-env": "^7.3.1",
-    "@storybook/addons": "5.0.0-rc.0",
-    "@storybook/channel-postmessage": "5.0.0-rc.0",
-    "@storybook/client-api": "5.0.0-rc.0",
-    "@storybook/client-logger": "5.0.0-rc.0",
-    "@storybook/core-events": "5.0.0-rc.0",
-    "@storybook/node-logger": "5.0.0-rc.0",
-    "@storybook/theming": "5.0.0-rc.0",
-    "@storybook/ui": "5.0.0-rc.0",
+    "@storybook/addons": "5.0.0-rc.1",
+    "@storybook/channel-postmessage": "5.0.0-rc.1",
+    "@storybook/client-api": "5.0.0-rc.1",
+    "@storybook/client-logger": "5.0.0-rc.1",
+    "@storybook/core-events": "5.0.0-rc.1",
+    "@storybook/node-logger": "5.0.0-rc.1",
+    "@storybook/theming": "5.0.0-rc.1",
+    "@storybook/ui": "5.0.0-rc.1",
     "airbnb-js-shims": "^1 || ^2",
     "autoprefixer": "^9.4.7",
     "babel-plugin-add-react-displayname": "^0.0.5",
diff --git a/lib/node-logger/package.json b/lib/node-logger/package.json
index c133a83235f..5aca4204d75 100644
--- a/lib/node-logger/package.json
+++ b/lib/node-logger/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/node-logger",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/router/package.json b/lib/router/package.json
index 54055695666..c9620258419 100644
--- a/lib/router/package.json
+++ b/lib/router/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/router",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "description": "Core Storybook Router",
   "keywords": [
     "storybook"
@@ -20,7 +20,7 @@
   },
   "dependencies": {
     "@reach/router": "^1.2.1",
-    "@storybook/theming": "5.0.0-rc.0",
+    "@storybook/theming": "5.0.0-rc.1",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
     "qs": "^6.5.2"
diff --git a/lib/theming/package.json b/lib/theming/package.json
index 8b819e72471..40515c4c8e5 100644
--- a/lib/theming/package.json
+++ b/lib/theming/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/theming",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "description": "Core Storybook Components",
   "keywords": [
     "storybook"
diff --git a/lib/ui/package.json b/lib/ui/package.json
index 0b848994bbe..e50159c5c28 100644
--- a/lib/ui/package.json
+++ b/lib/ui/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/ui",
-  "version": "5.0.0-rc.0",
+  "version": "5.0.0-rc.1",
   "description": "Core Storybook UI",
   "keywords": [
     "storybook"
@@ -21,12 +21,12 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.0",
-    "@storybook/client-logger": "5.0.0-rc.0",
-    "@storybook/components": "5.0.0-rc.0",
-    "@storybook/core-events": "5.0.0-rc.0",
-    "@storybook/router": "5.0.0-rc.0",
-    "@storybook/theming": "5.0.0-rc.0",
+    "@storybook/addons": "5.0.0-rc.1",
+    "@storybook/client-logger": "5.0.0-rc.1",
+    "@storybook/components": "5.0.0-rc.1",
+    "@storybook/core-events": "5.0.0-rc.1",
+    "@storybook/router": "5.0.0-rc.1",
+    "@storybook/theming": "5.0.0-rc.1",
     "eventemitter3": "^3.1.0",
     "fast-deep-equal": "^2.0.1",
     "fuse.js": "^3.3.1",

From 61196fc6bc11243aac9d5d248590290a47814349 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Mon, 18 Feb 2019 09:04:06 +0800
Subject: [PATCH 025/249] Trigger frontpage deploy in CI

---
 .circleci/config.yml       | 20 ++++++++++++++++++++
 package.json               |  1 +
 scripts/build-frontpage.js | 19 +++++++++++++++++++
 3 files changed, 40 insertions(+)
 create mode 100755 scripts/build-frontpage.js

diff --git a/.circleci/config.yml b/.circleci/config.yml
index 97a1f443f23..33a990d7839 100644
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -200,6 +200,25 @@ jobs:
           command: |
             cd examples-native/crna-kitchen-sink
             yarn storybook --smoke-test
+  frontpage:
+    <<: *defaults
+    steps:
+      - checkout
+      - restore_cache:
+        name: Restore core dependencies cache
+        keys:
+          - core-dependencies-v3-{{ checksum "yarn.lock" }}
+      - run:
+        name: Install dependencies
+        run: yarn install
+      - run:
+        name: Trigger build
+        run: ./scripts/build-frontpage.js
+      - save_cache:
+        name: Cache core dependencies
+        key: core-dependencies-v3-{{ checksum "yarn.lock" }}
+        paths:
+          - ~/.cache/yarn
   docs:
     <<: *defaults
     steps:
@@ -288,6 +307,7 @@ workflows:
     jobs:
       - build
       - docs
+      - frontpage
       - lint:
           requires:
             - docs
diff --git a/package.json b/package.json
index 03c022ef49c..68f47588545 100644
--- a/package.json
+++ b/package.json
@@ -121,6 +121,7 @@
     "lerna": "^3.10.7",
     "lint-staged": "^8.1.3",
     "lodash": "^4.17.11",
+    "node-fetch": "^2.3.0",
     "npmlog": "^4.1.2",
     "prettier": "^1.16.4",
     "raf": "^3.4.0",
diff --git a/scripts/build-frontpage.js b/scripts/build-frontpage.js
new file mode 100755
index 00000000000..77d08b5f994
--- /dev/null
+++ b/scripts/build-frontpage.js
@@ -0,0 +1,19 @@
+#!/usr/bin/env node
+/* eslint-disable no-console */
+
+const fetch = require('node-fetch');
+
+const { CIRCLE_BRANCH, FRONTPAGE_WEBHOOK } = process.env;
+
+console.log('build-frontpage');
+if (CIRCLE_BRANCH === 'release/5.0') {
+  if (FRONTPAGE_WEBHOOK) {
+    console.log('triggering frontpage build');
+    const url = `https://api.netlify.com/build_hooks/${FRONTPAGE_WEBHOOK}`;
+    fetch(url, { method: 'post' }).then(res => console.log('result', res.status));
+  } else {
+    console.log('no webhook defined');
+  }
+} else {
+  console.log('skipping branch', CIRCLE_BRANCH);
+}

From 0783e6d82aefabcaf928494c682608f7a5a01c8d Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Mon, 18 Feb 2019 09:21:08 +0800
Subject: [PATCH 026/249] Merge pull request #5632 from storybooks/docs-subpath

Use a `/docs` pathPrefix for docs
---
 docs/gatsby-config.js | 1 +
 docs/package.json     | 2 +-
 2 files changed, 2 insertions(+), 1 deletion(-)

diff --git a/docs/gatsby-config.js b/docs/gatsby-config.js
index 9d92c7ad255..185a343075f 100644
--- a/docs/gatsby-config.js
+++ b/docs/gatsby-config.js
@@ -1,4 +1,5 @@
 module.exports = {
+  pathPrefix: '/docs',
   siteMetadata: {
     siteTitle: 'Storybook',
     baseColor: '#e64074',
diff --git a/docs/package.json b/docs/package.json
index 095ab479d6d..150042edb5d 100644
--- a/docs/package.json
+++ b/docs/package.json
@@ -10,7 +10,7 @@
   "license": "MIT",
   "main": "n/a",
   "scripts": {
-    "build": "gatsby build && cp static/**/* ./public",
+    "build": "gatsby build --prefix-paths && cp static/**/* ./public",
     "build-storybook": "build-storybook",
     "dev": "gatsby develop",
     "serve": "gatsby serve",

From bb8b4a84f360b7817dffd82b9bdc93e6c0f0dfd7 Mon Sep 17 00:00:00 2001
From: Tom Coleman <tom@percolatestudio.com>
Date: Mon, 18 Feb 2019 12:15:56 +1100
Subject: [PATCH 027/249] Merge pull request #5610 from
 storybooks/5591-fix-tooltip-stories

Use the correct props to start the tooltip open
---
 .../src/tooltip/TooltipLinkList.stories.js    |  12 +-
 .../src/tooltip/TooltipMessage.stories.js     |   2 +-
 .../src/tooltip/TooltipNote.stories.js        |   8 +-
 .../TooltipLinkList.stories.storyshot         | 287 ++++++++++++++
 .../TooltipMessage.stories.storyshot          | 369 +++++++++++++++++-
 .../TooltipNote.stories.storyshot             |  34 ++
 .../WithTooltip.stories.storyshot             |  23 ++
 7 files changed, 711 insertions(+), 24 deletions(-)

diff --git a/lib/components/src/tooltip/TooltipLinkList.stories.js b/lib/components/src/tooltip/TooltipLinkList.stories.js
index 688ca89ecb4..c9c5c5f0c75 100644
--- a/lib/components/src/tooltip/TooltipLinkList.stories.js
+++ b/lib/components/src/tooltip/TooltipLinkList.stories.js
@@ -1,23 +1,23 @@
 import React from 'react';
 import { storiesOf } from '@storybook/react';
 import { action } from '@storybook/addon-actions';
-import WithTooltip from './WithTooltip';
+import WithToolTip from './WithTooltip';
 
 import TooltipLinkList from './TooltipLinkList';
 import StoryLinkWrapper from '../StoryLinkWrapper';
 
 export const links = [
-  { title: 'Link', href: 'http://google.com' },
-  { title: 'Link', href: 'http://google.com' },
-  { title: 'callback', onClick: action('onClick') },
+  { id: '1', title: 'Link', href: 'http://google.com' },
+  { id: '2', title: 'Link', href: 'http://google.com' },
+  { id: '3', title: 'callback', onClick: action('onClick') },
 ];
 
 storiesOf('basics/Tooltip/TooltipLinkList', module)
   .addDecorator(storyFn => (
     <div style={{ height: '300px' }}>
-      <WithTooltip placement="top" trigger="click" startOpen tooltip={storyFn()}>
+      <WithToolTip placement="top" trigger="click" tooltipShown tooltip={storyFn()}>
         <div>Tooltip</div>
-      </WithTooltip>
+      </WithToolTip>
     </div>
   ))
   .add('links', () => <TooltipLinkList links={links.slice(0, 2)} LinkWrapper={StoryLinkWrapper} />)
diff --git a/lib/components/src/tooltip/TooltipMessage.stories.js b/lib/components/src/tooltip/TooltipMessage.stories.js
index f06317718bc..975efcb3297 100644
--- a/lib/components/src/tooltip/TooltipMessage.stories.js
+++ b/lib/components/src/tooltip/TooltipMessage.stories.js
@@ -7,7 +7,7 @@ import TooltipMessage from './TooltipMessage';
 storiesOf('basics/Tooltip/TooltipMessage', module)
   .addDecorator(storyFn => (
     <div style={{ height: '300px' }}>
-      <WithTooltip placement="top" trigger="click" startOpen tooltip={storyFn()}>
+      <WithTooltip placement="top" trigger="click" tooltipShown tooltip={storyFn()}>
         <div>Tooltip</div>
       </WithTooltip>
     </div>
diff --git a/lib/components/src/tooltip/TooltipNote.stories.js b/lib/components/src/tooltip/TooltipNote.stories.js
index 9c9c1be3a14..0e678e2bb85 100644
--- a/lib/components/src/tooltip/TooltipNote.stories.js
+++ b/lib/components/src/tooltip/TooltipNote.stories.js
@@ -7,7 +7,13 @@ import TooltipNote from './TooltipNote';
 storiesOf('basics/Tooltip/TooltipNote', module)
   .addDecorator(storyFn => (
     <div style={{ height: '300px' }}>
-      <WithTooltip hasChrome={false} placement="top" trigger="click" startOpen tooltip={storyFn()}>
+      <WithTooltip
+        hasChrome={false}
+        placement="top"
+        trigger="click"
+        tooltipShown
+        tooltip={storyFn()}
+      >
         <div>Tooltip</div>
       </WithTooltip>
     </div>
diff --git a/lib/components/src/tooltip/__snapshots__/TooltipLinkList.stories.storyshot b/lib/components/src/tooltip/__snapshots__/TooltipLinkList.stories.storyshot
index 8a7e645e866..145e257ce3f 100644
--- a/lib/components/src/tooltip/__snapshots__/TooltipLinkList.stories.storyshot
+++ b/lib/components/src/tooltip/__snapshots__/TooltipLinkList.stories.storyshot
@@ -1,11 +1,108 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Storyshots basics/Tooltip/TooltipLinkList links 1`] = `
+.emotion-8 {
+  min-width: 180px;
+}
+
+.emotion-4 {
+  font-size: 12px;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  color: #999999;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  cursor: pointer;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+  line-height: 18px;
+  padding: 7px 15px;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+
+.emotion-4 + .emotion-4 {
+  border-top: 1px solid #EEEEEE;
+}
+
+.emotion-4 > * + * {
+  padding-left: 10px;
+}
+
+.emotion-4:hover {
+  background: rgba(0,0,0,.05);
+}
+
+.emotion-4:hover svg {
+  opacity: 1;
+}
+
+.emotion-3 {
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  text-align: left;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+}
+
+.emotion-3 > * + * {
+  padding-left: 10px;
+}
+
+.emotion-2 {
+  color: #444444;
+}
+
 .emotion-0 {
   display: inline-block;
   cursor: pointer;
 }
 
+.emotion-9 {
+  display: inline-block;
+  z-index: 2147483647;
+  margin-bottom: 10px;
+  margin-top: 0px;
+  margin-left: 0px;
+  margin-right: 0px;
+  background: linear-gradient( -1deg, rgba(248,248,248,0.97) 0%, rgba(255,255,255,0.97) 100% );
+  -webkit-filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
+  filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
+  font-size: 12px;
+}
+
+.emotion-1 {
+  position: absolute;
+  border-style: solid;
+  margin-bottom: 0px;
+  margin-top: 8px;
+  margin-right: 8px;
+  margin-left: 8px;
+  bottom: -8px;
+  top: autopx;
+  right: autopx;
+  left: autopx;
+  border-bottom-width: 0px;
+  border-top-width: 8px;
+  border-right-width: 8px;
+  border-left-width: 8px;
+  border-top-color: #FFFFFF;
+  border-bottom-color: transparent;
+  border-left-color: transparent;
+  border-right-color: transparent;
+}
+
 <div
   style="height:300px"
 >
@@ -16,15 +113,152 @@ exports[`Storyshots basics/Tooltip/TooltipLinkList links 1`] = `
       Tooltip
     </div>
   </div>
+  <div
+    class="emotion-9"
+    style="position:absolute;top:0;left:0;opacity:0;pointer-events:none"
+  >
+    <div
+      class="emotion-1"
+    />
+    <div
+      class="emotion-8"
+    >
+      <a
+        class="emotion-4"
+        href="http://google.com"
+      >
+        <span
+          class="emotion-3"
+        >
+          <span
+            class="emotion-2"
+          >
+            Link
+          </span>
+        </span>
+      </a>
+      <a
+        class="emotion-4"
+        href="http://google.com"
+      >
+        <span
+          class="emotion-3"
+        >
+          <span
+            class="emotion-2"
+          >
+            Link
+          </span>
+        </span>
+      </a>
+    </div>
+  </div>
 </div>
 `;
 
 exports[`Storyshots basics/Tooltip/TooltipLinkList links and callback 1`] = `
+.emotion-11 {
+  min-width: 180px;
+}
+
+.emotion-4 {
+  font-size: 12px;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  color: #999999;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  cursor: pointer;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+  line-height: 18px;
+  padding: 7px 15px;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+
+.emotion-4 + .emotion-4 {
+  border-top: 1px solid #EEEEEE;
+}
+
+.emotion-4 > * + * {
+  padding-left: 10px;
+}
+
+.emotion-4:hover {
+  background: rgba(0,0,0,.05);
+}
+
+.emotion-4:hover svg {
+  opacity: 1;
+}
+
+.emotion-3 {
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  text-align: left;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+}
+
+.emotion-3 > * + * {
+  padding-left: 10px;
+}
+
+.emotion-2 {
+  color: #444444;
+}
+
 .emotion-0 {
   display: inline-block;
   cursor: pointer;
 }
 
+.emotion-12 {
+  display: inline-block;
+  z-index: 2147483647;
+  margin-bottom: 10px;
+  margin-top: 0px;
+  margin-left: 0px;
+  margin-right: 0px;
+  background: linear-gradient( -1deg, rgba(248,248,248,0.97) 0%, rgba(255,255,255,0.97) 100% );
+  -webkit-filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
+  filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
+  font-size: 12px;
+}
+
+.emotion-1 {
+  position: absolute;
+  border-style: solid;
+  margin-bottom: 0px;
+  margin-top: 8px;
+  margin-right: 8px;
+  margin-left: 8px;
+  bottom: -8px;
+  top: autopx;
+  right: autopx;
+  left: autopx;
+  border-bottom-width: 0px;
+  border-top-width: 8px;
+  border-right-width: 8px;
+  border-left-width: 8px;
+  border-top-color: #FFFFFF;
+  border-bottom-color: transparent;
+  border-left-color: transparent;
+  border-right-color: transparent;
+}
+
 <div
   style="height:300px"
 >
@@ -35,5 +269,58 @@ exports[`Storyshots basics/Tooltip/TooltipLinkList links and callback 1`] = `
       Tooltip
     </div>
   </div>
+  <div
+    class="emotion-12"
+    style="position:absolute;top:0;left:0;opacity:0;pointer-events:none"
+  >
+    <div
+      class="emotion-1"
+    />
+    <div
+      class="emotion-11"
+    >
+      <a
+        class="emotion-4"
+        href="http://google.com"
+      >
+        <span
+          class="emotion-3"
+        >
+          <span
+            class="emotion-2"
+          >
+            Link
+          </span>
+        </span>
+      </a>
+      <a
+        class="emotion-4"
+        href="http://google.com"
+      >
+        <span
+          class="emotion-3"
+        >
+          <span
+            class="emotion-2"
+          >
+            Link
+          </span>
+        </span>
+      </a>
+      <a
+        class="emotion-4"
+      >
+        <span
+          class="emotion-3"
+        >
+          <span
+            class="emotion-2"
+          >
+            callback
+          </span>
+        </span>
+      </a>
+    </div>
+  </div>
 </div>
 `;
diff --git a/lib/components/src/tooltip/__snapshots__/TooltipMessage.stories.storyshot b/lib/components/src/tooltip/__snapshots__/TooltipMessage.stories.storyshot
index 96467feedb6..5eefe02dcba 100644
--- a/lib/components/src/tooltip/__snapshots__/TooltipMessage.stories.storyshot
+++ b/lib/components/src/tooltip/__snapshots__/TooltipMessage.stories.storyshot
@@ -6,6 +6,55 @@ exports[`Storyshots basics/Tooltip/TooltipMessage default 1`] = `
   cursor: pointer;
 }
 
+.emotion-6 {
+  display: inline-block;
+  z-index: 2147483647;
+  margin-bottom: 10px;
+  margin-top: 0px;
+  margin-left: 0px;
+  margin-right: 0px;
+  background: linear-gradient( -1deg, rgba(248,248,248,0.97) 0%, rgba(255,255,255,0.97) 100% );
+  -webkit-filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
+  filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
+  font-size: 12px;
+}
+
+.emotion-1 {
+  position: absolute;
+  border-style: solid;
+  margin-bottom: 0px;
+  margin-top: 8px;
+  margin-right: 8px;
+  margin-left: 8px;
+  bottom: -8px;
+  top: autopx;
+  right: autopx;
+  left: autopx;
+  border-bottom-width: 0px;
+  border-top-width: 8px;
+  border-right-width: 8px;
+  border-left-width: 8px;
+  border-top-color: #FFFFFF;
+  border-bottom-color: transparent;
+  border-left-color: transparent;
+  border-right-color: transparent;
+}
+
+.emotion-5 {
+  padding: 15px;
+  width: 280px;
+  box-sizing: border-box;
+}
+
+.emotion-4 {
+  color: #444444;
+  line-height: 18px;
+}
+
+.emotion-2 {
+  font-weight: 900;
+}
+
 <div
   style="height:300px"
 >
@@ -16,6 +65,32 @@ exports[`Storyshots basics/Tooltip/TooltipMessage default 1`] = `
       Tooltip
     </div>
   </div>
+  <div
+    class="emotion-6"
+    style="position:absolute;top:0;left:0;opacity:0;pointer-events:none"
+  >
+    <div
+      class="emotion-1"
+    />
+    <div
+      class="emotion-5"
+    >
+      <div
+        class="emotion-4"
+      >
+        <div
+          class="emotion-2"
+        >
+          Lorem ipsum dolor sit
+        </div>
+        <span
+          class="emotion-3"
+        >
+          Amet consectatur vestibulum concet durum politu coret weirom
+        </span>
+      </div>
+    </div>
+  </div>
 </div>
 `;
 
@@ -25,6 +100,51 @@ exports[`Storyshots basics/Tooltip/TooltipMessage minimal message 1`] = `
   cursor: pointer;
 }
 
+.emotion-5 {
+  display: inline-block;
+  z-index: 2147483647;
+  margin-bottom: 10px;
+  margin-top: 0px;
+  margin-left: 0px;
+  margin-right: 0px;
+  background: linear-gradient( -1deg, rgba(248,248,248,0.97) 0%, rgba(255,255,255,0.97) 100% );
+  -webkit-filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
+  filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
+  font-size: 12px;
+}
+
+.emotion-1 {
+  position: absolute;
+  border-style: solid;
+  margin-bottom: 0px;
+  margin-top: 8px;
+  margin-right: 8px;
+  margin-left: 8px;
+  bottom: -8px;
+  top: autopx;
+  right: autopx;
+  left: autopx;
+  border-bottom-width: 0px;
+  border-top-width: 8px;
+  border-right-width: 8px;
+  border-left-width: 8px;
+  border-top-color: #FFFFFF;
+  border-bottom-color: transparent;
+  border-left-color: transparent;
+  border-right-color: transparent;
+}
+
+.emotion-4 {
+  padding: 15px;
+  width: 280px;
+  box-sizing: border-box;
+}
+
+.emotion-3 {
+  color: #444444;
+  line-height: 18px;
+}
+
 <div
   style="height:300px"
 >
@@ -35,6 +155,27 @@ exports[`Storyshots basics/Tooltip/TooltipMessage minimal message 1`] = `
       Tooltip
     </div>
   </div>
+  <div
+    class="emotion-5"
+    style="position:absolute;top:0;left:0;opacity:0;pointer-events:none"
+  >
+    <div
+      class="emotion-1"
+    />
+    <div
+      class="emotion-4"
+    >
+      <div
+        class="emotion-3"
+      >
+        <span
+          class="emotion-2"
+        >
+          Amet consectatur vestibulum concet durum politu coret weirom
+        </span>
+      </div>
+    </div>
+  </div>
 </div>
 `;
 
@@ -44,23 +185,63 @@ exports[`Storyshots basics/Tooltip/TooltipMessage with link 1`] = `
   cursor: pointer;
 }
 
-<div
-  style="height:300px"
->
-  <div
-    class="emotion-0"
-  >
-    <div>
-      Tooltip
-    </div>
-  </div>
-</div>
-`;
-
-exports[`Storyshots basics/Tooltip/TooltipMessage with links 1`] = `
-.emotion-0 {
+.emotion-8 {
   display: inline-block;
-  cursor: pointer;
+  z-index: 2147483647;
+  margin-bottom: 10px;
+  margin-top: 0px;
+  margin-left: 0px;
+  margin-right: 0px;
+  background: linear-gradient( -1deg, rgba(248,248,248,0.97) 0%, rgba(255,255,255,0.97) 100% );
+  -webkit-filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
+  filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
+  font-size: 12px;
+}
+
+.emotion-1 {
+  position: absolute;
+  border-style: solid;
+  margin-bottom: 0px;
+  margin-top: 8px;
+  margin-right: 8px;
+  margin-left: 8px;
+  bottom: -8px;
+  top: autopx;
+  right: autopx;
+  left: autopx;
+  border-bottom-width: 0px;
+  border-top-width: 8px;
+  border-right-width: 8px;
+  border-left-width: 8px;
+  border-top-color: #FFFFFF;
+  border-bottom-color: transparent;
+  border-left-color: transparent;
+  border-right-color: transparent;
+}
+
+.emotion-7 {
+  padding: 15px;
+  width: 280px;
+  box-sizing: border-box;
+}
+
+.emotion-4 {
+  color: #444444;
+  line-height: 18px;
+}
+
+.emotion-2 {
+  font-weight: 900;
+}
+
+.emotion-6 {
+  margin-top: 8px;
+  text-align: center;
+}
+
+.emotion-6 > * {
+  margin: 0 8px;
+  font-weight: 900;
 }
 
 <div
@@ -73,5 +254,161 @@ exports[`Storyshots basics/Tooltip/TooltipMessage with links 1`] = `
       Tooltip
     </div>
   </div>
+  <div
+    class="emotion-8"
+    style="position:absolute;top:0;left:0;opacity:0;pointer-events:none"
+  >
+    <div
+      class="emotion-1"
+    />
+    <div
+      class="emotion-7"
+    >
+      <div
+        class="emotion-4"
+      >
+        <div
+          class="emotion-2"
+        >
+          Lorem ipsum dolor sit
+        </div>
+        <span
+          class="emotion-3"
+        >
+          Amet consectatur vestibulum concet durum politu coret weirom
+        </span>
+      </div>
+      <div
+        class="emotion-6"
+      >
+        <a
+          class="emotion-3"
+          href="test"
+        >
+          Continue
+        </a>
+      </div>
+    </div>
+  </div>
+</div>
+`;
+
+exports[`Storyshots basics/Tooltip/TooltipMessage with links 1`] = `
+.emotion-0 {
+  display: inline-block;
+  cursor: pointer;
+}
+
+.emotion-9 {
+  display: inline-block;
+  z-index: 2147483647;
+  margin-bottom: 10px;
+  margin-top: 0px;
+  margin-left: 0px;
+  margin-right: 0px;
+  background: linear-gradient( -1deg, rgba(248,248,248,0.97) 0%, rgba(255,255,255,0.97) 100% );
+  -webkit-filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
+  filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
+  font-size: 12px;
+}
+
+.emotion-1 {
+  position: absolute;
+  border-style: solid;
+  margin-bottom: 0px;
+  margin-top: 8px;
+  margin-right: 8px;
+  margin-left: 8px;
+  bottom: -8px;
+  top: autopx;
+  right: autopx;
+  left: autopx;
+  border-bottom-width: 0px;
+  border-top-width: 8px;
+  border-right-width: 8px;
+  border-left-width: 8px;
+  border-top-color: #FFFFFF;
+  border-bottom-color: transparent;
+  border-left-color: transparent;
+  border-right-color: transparent;
+}
+
+.emotion-8 {
+  padding: 15px;
+  width: 280px;
+  box-sizing: border-box;
+}
+
+.emotion-4 {
+  color: #444444;
+  line-height: 18px;
+}
+
+.emotion-2 {
+  font-weight: 900;
+}
+
+.emotion-7 {
+  margin-top: 8px;
+  text-align: center;
+}
+
+.emotion-7 > * {
+  margin: 0 8px;
+  font-weight: 900;
+}
+
+<div
+  style="height:300px"
+>
+  <div
+    class="emotion-0"
+  >
+    <div>
+      Tooltip
+    </div>
+  </div>
+  <div
+    class="emotion-9"
+    style="position:absolute;top:0;left:0;opacity:0;pointer-events:none"
+  >
+    <div
+      class="emotion-1"
+    />
+    <div
+      class="emotion-8"
+    >
+      <div
+        class="emotion-4"
+      >
+        <div
+          class="emotion-2"
+        >
+          Lorem ipsum dolor sit
+        </div>
+        <span
+          class="emotion-3"
+        >
+          Amet consectatur vestibulum concet durum politu coret weirom
+        </span>
+      </div>
+      <div
+        class="emotion-7"
+      >
+        <a
+          class="emotion-3"
+          href="test"
+        >
+          Get more tips
+        </a>
+        <a
+          class="emotion-3"
+          href="test"
+        >
+          Done
+        </a>
+      </div>
+    </div>
+  </div>
 </div>
 `;
diff --git a/lib/components/src/tooltip/__snapshots__/TooltipNote.stories.storyshot b/lib/components/src/tooltip/__snapshots__/TooltipNote.stories.storyshot
index 1e801903f9c..0eea0521232 100644
--- a/lib/components/src/tooltip/__snapshots__/TooltipNote.stories.storyshot
+++ b/lib/components/src/tooltip/__snapshots__/TooltipNote.stories.storyshot
@@ -6,6 +6,30 @@ exports[`Storyshots basics/Tooltip/TooltipNote default 1`] = `
   cursor: pointer;
 }
 
+.emotion-2 {
+  display: inline-block;
+  z-index: 2147483647;
+  margin-bottom: 8px;
+  margin-top: 0px;
+  margin-left: 0px;
+  margin-right: 0px;
+}
+
+.emotion-1 {
+  padding: 2px 6px;
+  line-height: 16px;
+  font-size: 10px;
+  font-weight: 700;
+  color: #FFFFFF;
+  box-shadow: 0 0 5px 0 rgba(0,0,0,0.3);
+  border-radius: 4px;
+  white-space: nowrap;
+  pointer-events: none;
+  z-index: -1;
+  background: rgba(0,0,0,0.4);
+  margin: 6px;
+}
+
 <div
   style="height:300px"
 >
@@ -16,5 +40,15 @@ exports[`Storyshots basics/Tooltip/TooltipNote default 1`] = `
       Tooltip
     </div>
   </div>
+  <div
+    class="emotion-2"
+    style="position:absolute;top:0;left:0;opacity:0;pointer-events:none"
+  >
+    <div
+      class="emotion-1"
+    >
+      Lorem ipsum dolor
+    </div>
+  </div>
 </div>
 `;
diff --git a/lib/components/src/tooltip/__snapshots__/WithTooltip.stories.storyshot b/lib/components/src/tooltip/__snapshots__/WithTooltip.stories.storyshot
index 18eefbd3ed1..4e0323d032f 100644
--- a/lib/components/src/tooltip/__snapshots__/WithTooltip.stories.storyshot
+++ b/lib/components/src/tooltip/__snapshots__/WithTooltip.stories.storyshot
@@ -241,6 +241,29 @@ exports[`Storyshots basics/Tooltip/WithTooltip simple click start open 1`] = `
   font-weight: 900;
 }
 
+.emotion-12 {
+  height: 300px;
+}
+
+.emotion-11 {
+  width: 500px;
+  height: 500px;
+  overflow-y: scroll;
+  background: #eee;
+  position: relative;
+}
+
+.emotion-0 {
+  height: 100px;
+}
+
+.emotion-1 {
+  width: 200px;
+  height: 100px;
+  background-color: red;
+  color: white;
+}
+
 <div
   class="emotion-12"
 >

From 834367c4a8abb066b16f21f002fcc81f649338de Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Mon, 18 Feb 2019 23:17:40 +0800
Subject: [PATCH 028/249] Merge pull request #5638 from
 storybooks/shilman/version-check-semver

Handle old versions in version check
---
 lib/ui/package.json              |  1 +
 lib/ui/src/core/versions.js      |  7 ++++--
 lib/ui/src/core/versions.test.js | 38 ++++++++++++++++++++++----------
 3 files changed, 32 insertions(+), 14 deletions(-)

diff --git a/lib/ui/package.json b/lib/ui/package.json
index e50159c5c28..8f0c2c1f850 100644
--- a/lib/ui/package.json
+++ b/lib/ui/package.json
@@ -54,6 +54,7 @@
     "react-modal": "^3.8.1",
     "react-resize-detector": "^3.2.1",
     "recompose": "^0.30.0",
+    "semver": "^5.6.0",
     "to-camel-case": "^1.0.0",
     "util-deprecate": "^1.0.2"
   },
diff --git a/lib/ui/src/core/versions.js b/lib/ui/src/core/versions.js
index 6f663bb6853..c20a58983e5 100644
--- a/lib/ui/src/core/versions.js
+++ b/lib/ui/src/core/versions.js
@@ -1,5 +1,6 @@
 import { logger } from '@storybook/client-logger';
 import { fetch } from 'global';
+import semver from 'semver';
 
 import { version as currentVersion } from '../../package.json';
 
@@ -48,8 +49,10 @@ export default function({ store }) {
       return latest;
     },
     versionUpdateAvailable: () => {
-      const latestVersion = api.getLatestVersion();
-      return latestVersion && latestVersion.version !== store.getState().currentVersion;
+      const latest = api.getLatestVersion();
+      const current = api.getCurrentVersion();
+
+      return latest && semver.gt(latest.version, current.version);
     },
   };
 
diff --git a/lib/ui/src/core/versions.test.js b/lib/ui/src/core/versions.test.js
index 5964043f27f..5434aeef973 100644
--- a/lib/ui/src/core/versions.test.js
+++ b/lib/ui/src/core/versions.test.js
@@ -19,13 +19,16 @@ function createMockStore() {
   };
 }
 
-const standardResponse = {
+const makeResponse = version => ({
   json: jest.fn().mockResolvedValue({
     latest: {
-      version: '4.0.0',
+      version,
     },
   }),
-};
+});
+
+const newResponse = makeResponse('4.0.0');
+const oldResponse = makeResponse('2.0.0');
 
 jest.mock('@storybook/client-logger');
 
@@ -60,7 +63,7 @@ describe('versions API', () => {
     const { state: initialState, init, api } = initVersions({ store });
     store.setState(initialState);
 
-    fetch.mockResolvedValueOnce(standardResponse);
+    fetch.mockResolvedValueOnce(newResponse);
     store.setState.mockReset();
     await init({ api: { addNotification: jest.fn(), ...api } });
     expect(store.setState).toHaveBeenCalledWith(
@@ -87,7 +90,7 @@ describe('versions API', () => {
     const { state: initialState, init, api } = initVersions({ store });
     store.setState(initialState);
 
-    fetch.mockResolvedValueOnce(standardResponse);
+    fetch.mockResolvedValueOnce(newResponse);
     store.setState.mockReset();
     await init({ api: { addNotification: jest.fn(), ...api } });
     expect(store.setState).toHaveBeenCalledWith(
@@ -131,7 +134,7 @@ describe('versions API', () => {
     const { init, api, state: initialState } = initVersions({ store });
     store.setState(initialState);
 
-    fetch.mockResolvedValueOnce(standardResponse);
+    fetch.mockResolvedValueOnce(newResponse);
     const addNotification = jest.fn();
     await init({ api: { addNotification, ...api } });
     expect(addNotification).toHaveBeenCalled();
@@ -143,7 +146,7 @@ describe('versions API', () => {
     const { init, api, state: initialState } = initVersions({ store });
     store.setState(initialState);
 
-    fetch.mockResolvedValueOnce(standardResponse);
+    fetch.mockResolvedValueOnce(newResponse);
     const addNotification = jest.fn();
     await init({ api: { addNotification, ...api } });
     expect(addNotification).not.toHaveBeenCalled();
@@ -154,7 +157,7 @@ describe('versions API', () => {
     const { init, api, state: initialState } = initVersions({ store });
     store.setState(initialState);
 
-    fetch.mockResolvedValueOnce(standardResponse);
+    fetch.mockResolvedValueOnce(newResponse);
     let notification;
     const addNotification = jest.fn().mockImplementation(n => {
       notification = n;
@@ -172,7 +175,7 @@ describe('versions API', () => {
     const { api, init, state: initialState } = initVersions({ store });
     store.setState(initialState);
 
-    fetch.mockResolvedValueOnce(standardResponse);
+    fetch.mockResolvedValueOnce(newResponse);
     await init({ api: { ...api, addNotification: jest.fn() } });
 
     expect(api.getCurrentVersion()).toEqual({
@@ -185,7 +188,7 @@ describe('versions API', () => {
     const { api, init, state: initialState } = initVersions({ store });
     store.setState(initialState);
 
-    fetch.mockResolvedValueOnce(standardResponse);
+    fetch.mockResolvedValueOnce(newResponse);
     await init({ api: { ...api, addNotification: jest.fn() } });
 
     expect(api.getLatestVersion()).toMatchObject({
@@ -193,14 +196,25 @@ describe('versions API', () => {
     });
   });
 
-  it('versionUpdateAvailable works', async () => {
+  it('versionUpdateAvailable works for new versions', async () => {
     const store = createMockStore();
     const { api, init, state: initialState } = initVersions({ store });
     store.setState(initialState);
 
-    fetch.mockResolvedValueOnce(standardResponse);
+    fetch.mockResolvedValueOnce(newResponse);
     await init({ api: { ...api, addNotification: jest.fn() } });
 
     expect(api.versionUpdateAvailable()).toEqual(true);
   });
+
+  it('versionUpdateAvailable works for old versions', async () => {
+    const store = createMockStore();
+    const { api, init, state: initialState } = initVersions({ store });
+    store.setState(initialState);
+
+    fetch.mockResolvedValueOnce(oldResponse);
+    await init({ api: { ...api, addNotification: jest.fn() } });
+
+    expect(api.versionUpdateAvailable()).toEqual(false);
+  });
 });

From 6d5528e8014aa0ea7c0e959c0dbe836986a1d1ed Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Mon, 18 Feb 2019 23:20:28 +0800
Subject: [PATCH 029/249] Merge pull request #5644 from
 storybooks/shilman/5197-fix-addon-jest

Addon-Jest: Fix event subscription
---
 addons/jest/src/index.js | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/addons/jest/src/index.js b/addons/jest/src/index.js
index 1f4d54df682..26db47c5960 100644
--- a/addons/jest/src/index.js
+++ b/addons/jest/src/index.js
@@ -1,6 +1,7 @@
 import addons from '@storybook/addons';
 import deprecate from 'util-deprecate';
 import { normalize } from 'upath';
+import { ADD_TESTS } from './shared';
 
 const findTestResults = (testFiles, jestTestResults, jestTestFilesExt) =>
   Object.values(testFiles).map(name => {
@@ -22,7 +23,7 @@ const findTestResults = (testFiles, jestTestResults, jestTestFilesExt) =>
   });
 
 const emitAddTests = ({ kind, story, testFiles, options }) => {
-  addons.getChannel().emit('storybook/tests/add_tests', {
+  addons.getChannel().emit(ADD_TESTS, {
     kind,
     storyName: story,
     tests: findTestResults(testFiles, options.results, options.filesExt),

From cc1b1b6a93946d73db101503502a7cebbf02758b Mon Sep 17 00:00:00 2001
From: Tom Coleman <tom@percolatestudio.com>
Date: Tue, 19 Feb 2019 12:22:43 +1100
Subject: [PATCH 030/249] Merge pull request #5646 from
 storybooks/5595-a11y-selected-tab

Fix tab highlighting in addon-a11y
---
 addons/a11y/src/components/Tabs.js | 16 ++++++++--------
 1 file changed, 8 insertions(+), 8 deletions(-)

diff --git a/addons/a11y/src/components/Tabs.js b/addons/a11y/src/components/Tabs.js
index 94f74828a47..0834a04e614 100644
--- a/addons/a11y/src/components/Tabs.js
+++ b/addons/a11y/src/components/Tabs.js
@@ -17,13 +17,6 @@ const List = styled.div(({ theme }) => ({
 }));
 
 const Item = styled.button(
-  ({ active, theme }) =>
-    active
-      ? {
-          opacity: 1,
-          borderBottom: `3px solid ${theme.color.secondary}`,
-        }
-      : {},
   ({ theme }) => ({
     textDecoration: 'none',
     padding: '10px 15px',
@@ -41,7 +34,14 @@ const Item = styled.button(
       outline: '0 none',
       borderBottom: `3px solid ${theme.color.secondary}`,
     },
-  })
+  }),
+  ({ active, theme }) =>
+    active
+      ? {
+          opacity: 1,
+          borderBottom: `3px solid ${theme.color.secondary}`,
+        }
+      : {}
 );
 
 class Tabs extends Component {

From 8c2fb3b2e98c8aa061a8c6f19497781d3c2de465 Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Tue, 19 Feb 2019 13:43:27 +0800
Subject: [PATCH 031/249] Merge pull request #5625 from
 storybooks/5594-better-treeview-expansion

Allow collapsing active story and use separate expansion for filtered
---
 .../src/components/sidebar/SidebarSearch.js   |   9 +-
 .../components/sidebar/treeview/treeview.js   | 143 ++++++++++++------
 2 files changed, 100 insertions(+), 52 deletions(-)

diff --git a/lib/ui/src/components/sidebar/SidebarSearch.js b/lib/ui/src/components/sidebar/SidebarSearch.js
index e50275d05ee..7a467e8a6b8 100644
--- a/lib/ui/src/components/sidebar/SidebarSearch.js
+++ b/lib/ui/src/components/sidebar/SidebarSearch.js
@@ -99,7 +99,12 @@ const FilterForm = styled.form(({ theme, focussed }) => ({
 }));
 
 export const PureSidebarSearch = ({ focussed, onSetFocussed, className, onChange, ...props }) => (
-  <FilterForm autoComplete="off" focussed={focussed} className={className}>
+  <FilterForm
+    autoComplete="off"
+    focussed={focussed}
+    className={className}
+    onReset={() => onChange('')}
+  >
     <FilterField
       type="text"
       autocomplete="off"
@@ -111,7 +116,7 @@ export const PureSidebarSearch = ({ focussed, onSetFocussed, className, onChange
       placeholder={focussed ? 'Type to search...' : 'Press "/" to search...'}
     />
     <Icons icon="search" />
-    <CancelButton type="reset" value="reset" onClick={() => onChange('')}>
+    <CancelButton type="reset" value="reset">
       <Icons icon="closeAlt" />
     </CancelButton>
   </FilterForm>
diff --git a/lib/ui/src/components/sidebar/treeview/treeview.js b/lib/ui/src/components/sidebar/treeview/treeview.js
index 670933dbb7e..2b95312c577 100644
--- a/lib/ui/src/components/sidebar/treeview/treeview.js
+++ b/lib/ui/src/components/sidebar/treeview/treeview.js
@@ -138,24 +138,53 @@ const Tree = props => {
   }
 };
 
-const calculateTreeProps = memoize(50)((input, filter, selectedId, extraExpanded) => {
-  const dataset = filter ? toFiltered(input, filter) : input;
+const calculateTreeState = memoize(50)(
+  ({ dataset, selectedId }, { lastSelectedId, unfilteredExpanded }) => {
+    if (selectedId === lastSelectedId) {
+      return null;
+    }
 
+    // If a new selection is made, we need to ensure it is part of the expanded set
+    const selectedAncestorIds = selectedId ? getParents(selectedId, dataset).map(i => i.id) : [];
+
+    const newExpanded = Object.keys(dataset).reduce(
+      (acc, key) => ({
+        ...acc,
+        [key]: selectedAncestorIds.includes(key) || unfilteredExpanded[key],
+      }),
+      {}
+    );
+
+    return {
+      lastSelectedId: selectedId,
+      unfilteredExpanded: newExpanded,
+    };
+  }
+);
+
+const getExpanded = ({ unfilteredExpanded, filteredExpanded, filter }) =>
+  filter ? filteredExpanded : unfilteredExpanded;
+
+const getFilteredDataset = memoize(50)(({ dataset, filter }) =>
+  filter ? toFiltered(dataset, filter) : dataset
+);
+
+// Update the set of expansions we are currently working with
+const updateExpanded = fn => ({ unfilteredExpanded, filteredExpanded, filter }) => {
+  if (filter) {
+    return {
+      filteredExpanded: fn(filteredExpanded),
+    };
+  }
+  return { unfilteredExpanded: fn(unfilteredExpanded) };
+};
+
+const getPropsForTree = memoize(50)(({ dataset, selectedId }) => {
   const selected = Object.keys(dataset).reduce(
     (acc, k) => Object.assign(acc, { [k]: k === selectedId }),
     {}
   );
 
-  const selectedAncestorIds = selectedId ? getParents(selectedId, dataset).map(i => i.id) : [];
-
-  const expanded = Object.keys(dataset).reduce(
-    (acc, key) => ({
-      ...acc,
-      [key]: selectedAncestorIds.includes(key) || extraExpanded[key],
-    }),
-    {}
-  );
-
   const { roots, others } = getMains(dataset).reduce(
     (acc, item) => {
       const { isRoot } = item;
@@ -166,25 +195,50 @@ const calculateTreeProps = memoize(50)((input, filter, selectedId, extraExpanded
     { roots: [], others: [] }
   );
 
-  return { input, dataset, selected, expanded, roots, others };
+  return { selected, roots, others };
 });
 
 // eslint-disable-next-line react/no-multi-comp
 class TreeState extends PureComponent {
+  state = {
+    // We maintain two sets of expanded nodes, so we remember which were expanded if we clear the filter
+    unfilteredExpanded: [],
+    filteredExpanded: [],
+    filter: null,
+    lastSelectedId: null,
+  };
+
+  static getDerivedStateFromProps(props, state) {
+    return calculateTreeState(props, state);
+  }
+
   events = {
     onClick: (e, item) => {
-      const { extraExpanded } = this.state;
+      this.setState(
+        updateExpanded(expanded => ({
+          ...expanded,
+          [item.id]: !expanded[item.id],
+        }))
+      );
+    },
+    onFilter: inputFilter => {
+      const { dataset } = this.props;
+      const filter = inputFilter.length >= 2 ? inputFilter : '';
+      const filteredDataset = getFilteredDataset({ dataset, filter });
+
+      // Whenever we change the filter, we reset the "filtered" expanded set back to all matching stories
       this.setState({
-        extraExpanded: {
-          ...extraExpanded,
-          [item.id]: !extraExpanded[item.id],
-        },
+        filter,
+        filteredExpanded:
+          !!filter &&
+          Object.keys(filteredDataset).reduce((acc, k) => Object.assign(acc, { [k]: true }), {}),
       });
     },
     onKeyUp: (e, item) => {
-      const { dataset: input, selectedId, prefix } = this.props;
-      const { filter, extraExpanded } = this.state;
-      const { dataset, expanded } = calculateTreeProps(input, filter, selectedId, extraExpanded);
+      const { prefix, dataset } = this.props;
+      const { filter } = this.state;
+      const filteredDataset = getFilteredDataset({ dataset, filter });
+      const expanded = getExpanded(this.state);
 
       const action = keyEventToAction(e);
       if (action) {
@@ -192,8 +246,8 @@ class TreeState extends PureComponent {
       }
 
       if (action === 'RIGHT') {
-        const next = getNext({ id: item.id, dataset, expanded });
-        if (!dataset[item.id].children || expanded[item.id]) {
+        const next = getNext({ id: item.id, dataset: filteredDataset, expanded });
+        if (!filteredDataset[item.id].children || expanded[item.id]) {
           if (next) {
             try {
               document.getElementById(createId(next.id, prefix)).focus();
@@ -203,13 +257,13 @@ class TreeState extends PureComponent {
           }
         }
 
-        this.setState({ extraExpanded: { ...extraExpanded, [item.id]: true } });
+        this.setState(updateExpanded(currExpanded => ({ ...currExpanded, [item.id]: true })));
       }
       if (action === 'LEFT') {
-        const prev = getPrevious({ id: item.id, dataset, expanded });
+        const prev = getPrevious({ id: item.id, dataset: filteredDataset, expanded });
 
-        if (!dataset[item.id].children || !expanded[item.id]) {
-          const parent = getParent(item.id, dataset);
+        if (!filteredDataset[item.id].children || !expanded[item.id]) {
+          const parent = getParent(item.id, filteredDataset);
           if (parent && parent.children) {
             try {
               document.getElementById(createId(parent.id, prefix)).focus();
@@ -227,10 +281,10 @@ class TreeState extends PureComponent {
           }
         }
 
-        this.setState({ extraExpanded: { ...extraExpanded, [item.id]: false } });
+        this.setState(updateExpanded(currExpanded => ({ ...currExpanded, [item.id]: false })));
       }
       if (action === 'DOWN') {
-        const next = getNext({ id: item.id, dataset, expanded });
+        const next = getNext({ id: item.id, dataset: filteredDataset, expanded });
         if (next) {
           try {
             document.getElementById(createId(next.id, prefix)).focus();
@@ -240,7 +294,7 @@ class TreeState extends PureComponent {
         }
       }
       if (action === 'UP') {
-        const prev = getPrevious({ id: item.id, dataset, expanded });
+        const prev = getPrevious({ id: item.id, dataset: filteredDataset, expanded });
 
         if (prev) {
           try {
@@ -251,25 +305,15 @@ class TreeState extends PureComponent {
         }
       }
     },
-
-    onFilter: value => {
-      const filter = value.length >= 2 ? value : '';
-      this.setState({ filter });
-    },
-  };
-
-  state = {
-    filter: null,
-    extraExpanded: {},
   };
 
   render() {
     const {
       events,
-      state: { filter, extraExpanded },
+      state: { filter, unfilteredExpanded, filteredExpanded },
       props,
     } = this;
-    const { prefix, dataset: input, selectedId } = props;
+    const { prefix, dataset, selectedId } = props;
 
     const Filter = getFilter(props.Filter);
     const List = getFilter(props.List);
@@ -281,12 +325,9 @@ class TreeState extends PureComponent {
     const Section = getContainer(props.Section);
     const Message = getMessage(props.Message);
 
-    const { dataset, selected, expanded, roots, others } = calculateTreeProps(
-      input,
-      filter,
-      selectedId,
-      extraExpanded
-    );
+    const filteredDataset = getFilteredDataset({ dataset, filter });
+    const expanded = filter ? filteredExpanded : unfilteredExpanded;
+    const { selected, roots, others } = getPropsForTree({ dataset: filteredDataset, selectedId });
 
     return (
       <Fragment>
@@ -302,7 +343,7 @@ class TreeState extends PureComponent {
                   <Branch
                     key={key}
                     depth={0}
-                    dataset={dataset}
+                    dataset={filteredDataset}
                     selected={selected}
                     expanded={expanded}
                     root={key}
@@ -326,7 +367,7 @@ class TreeState extends PureComponent {
                   <Branch
                     key={id}
                     depth={0}
-                    dataset={dataset}
+                    dataset={filteredDataset}
                     selected={selected}
                     expanded={expanded}
                     root={id}
@@ -351,6 +392,8 @@ class TreeState extends PureComponent {
 TreeState.propTypes = {
   prefix: PropTypes.string.isRequired,
   dataset: PropTypes.shape({}).isRequired,
+  // We do use this prop, eslint is confused
+  // eslint-disable-next-line react/no-unused-prop-types
   selectedId: PropTypes.string,
 };
 TreeState.defaultProps = {

From f6e7ed03fc2136b6edc8e054bb04639c077e2a51 Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Tue, 19 Feb 2019 13:44:18 +0800
Subject: [PATCH 032/249] Merge pull request #5635 from
 storybooks/5600-fix-prop-warnings

Fix some prop warnings
---
 lib/addons/src/index.ts                              |  1 +
 lib/components/src/tooltip/WithTooltip.js            | 10 ++--------
 lib/ui/src/components/sidebar/NotificationList.js    |  2 +-
 .../components/sidebar/NotificationList.stories.js   |  2 +-
 .../src/components/sidebar/SidebarSearch.stories.js  | 12 +++++++-----
 5 files changed, 12 insertions(+), 15 deletions(-)

diff --git a/lib/addons/src/index.ts b/lib/addons/src/index.ts
index 22fc6f4b853..71fabb10a87 100644
--- a/lib/addons/src/index.ts
+++ b/lib/addons/src/index.ts
@@ -8,6 +8,7 @@ import deprecate from 'util-deprecate';
 
 export interface RenderOptions {
   active: boolean;
+  key: string;
 }
 export interface RouteOptions {
   storyId: string;
diff --git a/lib/components/src/tooltip/WithTooltip.js b/lib/components/src/tooltip/WithTooltip.js
index e1d9e5498b7..4077bbe4473 100644
--- a/lib/components/src/tooltip/WithTooltip.js
+++ b/lib/components/src/tooltip/WithTooltip.js
@@ -32,19 +32,13 @@ const WithTooltip = ({
 }) => {
   const Container = svg ? TargetSvgContainer : TargetContainer;
 
-  if (tooltipShown !== undefined) {
-    Object.assign(props, { tooltipShown });
-  }
-  if (onVisibilityChange !== undefined) {
-    Object.assign(props, { onVisibilityChange });
-  }
-
   return (
     <TooltipTrigger
       placement={placement}
       trigger={trigger}
       modifiers={modifiers}
-      {...props}
+      tooltipShown={tooltipShown}
+      onVisibilityChange={onVisibilityChange}
       tooltip={({
         getTooltipProps,
         getArrowProps,
diff --git a/lib/ui/src/components/sidebar/NotificationList.js b/lib/ui/src/components/sidebar/NotificationList.js
index 863adc462d7..ea6dd159f24 100644
--- a/lib/ui/src/components/sidebar/NotificationList.js
+++ b/lib/ui/src/components/sidebar/NotificationList.js
@@ -38,6 +38,6 @@ export default function NotificationList({ notifications }) {
 }
 
 NotificationList.propTypes = {
-  notifications: PropTypes.arrayOf(PropTypes.shape({ id: PropTypes.number.isRequired }).isRequired)
+  notifications: PropTypes.arrayOf(PropTypes.shape({ id: PropTypes.string.isRequired }).isRequired)
     .isRequired,
 };
diff --git a/lib/ui/src/components/sidebar/NotificationList.stories.js b/lib/ui/src/components/sidebar/NotificationList.stories.js
index df799ce9955..235108f90a6 100644
--- a/lib/ui/src/components/sidebar/NotificationList.stories.js
+++ b/lib/ui/src/components/sidebar/NotificationList.stories.js
@@ -13,7 +13,7 @@ const notifications = Object.values(NotificationItemStories)
   .filter(s => s.storyData)
   .map(({ storyData: { notification } }, index) => ({
     ...notification,
-    id: index,
+    id: index.toString(),
   }));
 export const all = () => <NotificationList notifications={notifications} />;
 all.storyData = { notifications };
diff --git a/lib/ui/src/components/sidebar/SidebarSearch.stories.js b/lib/ui/src/components/sidebar/SidebarSearch.stories.js
index e122da7d7ca..debaa77e8b1 100644
--- a/lib/ui/src/components/sidebar/SidebarSearch.stories.js
+++ b/lib/ui/src/components/sidebar/SidebarSearch.stories.js
@@ -1,5 +1,5 @@
 import React from 'react';
-import { action } from '@storybook/addon-actions';
+import { actions as makeActions } from '@storybook/addon-actions';
 
 import SidebarSearch, { PureSidebarSearch } from './SidebarSearch';
 
@@ -15,11 +15,13 @@ export default {
   ],
 };
 
-export const simple = () => <SidebarSearch />;
+const actions = makeActions('onChange');
+const pureActions = { ...actions, ...makeActions('onSetFocussed') };
 
-const onSetFocussed = action('onSetFocussed');
-export const focussed = () => <PureSidebarSearch focussed onSetFocussed={onSetFocussed} />;
+export const simple = () => <SidebarSearch {...actions} />;
+
+export const focussed = () => <PureSidebarSearch focussed {...pureActions} />;
 
 export const filledIn = () => (
-  <PureSidebarSearch focussed onSetFocussed={onSetFocussed} defaultValue="Searchstring" />
+  <PureSidebarSearch focussed defaultValue="Searchstring" {...pureActions} />
 );

From 586a9327403c2b414eb172e1430ee11e208a6472 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Tue, 19 Feb 2019 15:16:19 +0800
Subject: [PATCH 033/249] 5.0.0-rc.2 changelog

---
 CHANGELOG.md | 18 ++++++++++++++++++
 1 file changed, 18 insertions(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index fa4c0acfaf9..345c193176d 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,21 @@
+## 5.0.0-rc.2 (February 19, 2019)
+
+### Features
+
+* UI: Allow collapsing active story and use separate expansion for filtered ([#5625](https://github.com/storybooks/storybook/pull/5625))
+* UI: Handle prerelease versions in version check ([#5641](https://github.com/storybooks/storybook/pull/5641))
+
+### Bug Fixes
+
+* Addon-a11y: Fix tab highlighting  ([#5646](https://github.com/storybooks/storybook/pull/5646))
+* Addon-jest: Fix event subscription ([#5644](https://github.com/storybooks/storybook/pull/5644))
+* UI: Handle old versions in version check ([#5638](https://github.com/storybooks/storybook/pull/5638))
+
+### Maintenance
+
+* UI: Fix some prop warnings ([#5635](https://github.com/storybooks/storybook/pull/5635))
+* UI: Use the correct props to start the tooltip open ([#5610](https://github.com/storybooks/storybook/pull/5610))
+
 ## 5.0.0-rc.1 (February 16, 2019)
 
 ### Bug Fixes

From 71b2c9e5798f3768acbeabecb45559c07138653c Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Tue, 19 Feb 2019 15:22:59 +0800
Subject: [PATCH 034/249] v5.0.0-rc.2

---
 addons/a11y/package.json                      | 12 ++---
 addons/actions/package.json                   | 10 ++--
 addons/backgrounds/package.json               | 12 ++---
 addons/centered/package.json                  |  2 +-
 addons/cssresources/package.json              | 10 ++--
 addons/events/package.json                    |  8 +--
 addons/google-analytics/package.json          |  6 +--
 addons/graphql/package.json                   |  2 +-
 addons/info/package.json                      | 10 ++--
 addons/jest/package.json                      | 10 ++--
 addons/knobs/package.json                     | 10 ++--
 addons/links/package.json                     |  6 +--
 addons/notes/package.json                     | 12 ++---
 addons/options/package.json                   |  4 +-
 .../storyshots/storyshots-core/package.json   |  4 +-
 .../storyshots-puppeteer/package.json         |  6 +--
 addons/storysource/package.json               |  8 +--
 addons/viewport/package.json                  | 12 ++---
 app/angular/package.json                      |  6 +--
 app/ember/package.json                        |  4 +-
 app/html/package.json                         |  4 +-
 app/marko/package.json                        |  4 +-
 app/mithril/package.json                      |  4 +-
 app/polymer/package.json                      |  4 +-
 app/preact/package.json                       |  4 +-
 app/react/package.json                        |  8 +--
 app/riot/package.json                         |  4 +-
 app/svelte/package.json                       |  4 +-
 app/vue/package.json                          |  4 +-
 examples/angular-cli/package.json             | 26 +++++-----
 examples/cra-kitchen-sink/package.json        | 32 ++++++------
 examples/cra-ts-kitchen-sink/package.json     | 12 ++---
 examples/ember-cli/package.json               | 26 +++++-----
 examples/html-kitchen-sink/package.json       | 36 ++++++-------
 examples/marko-cli/package.json               | 14 ++---
 examples/mithril-kitchen-sink/package.json    | 26 +++++-----
 examples/official-storybook/package.json      | 48 ++++++++---------
 examples/polymer-cli/package.json             | 20 +++----
 examples/preact-kitchen-sink/package.json     | 26 +++++-----
 examples/riot-kitchen-sink/package.json       | 26 +++++-----
 examples/svelte-kitchen-sink/package.json     | 26 +++++-----
 examples/vue-kitchen-sink/package.json        | 26 +++++-----
 lerna.json                                    |  2 +-
 lib/addons/package.json                       |  6 +--
 lib/channel-postmessage/package.json          |  4 +-
 lib/channel-websocket/package.json            |  4 +-
 lib/channels/package.json                     |  2 +-
 lib/cli/package.json                          | 52 +++++++++----------
 lib/client-api/package.json                   |  8 +--
 lib/client-logger/package.json                |  2 +-
 lib/codemod/package.json                      |  2 +-
 lib/components/package.json                   | 12 ++---
 lib/core-events/package.json                  |  2 +-
 lib/core/package.json                         | 18 +++----
 lib/node-logger/package.json                  |  2 +-
 lib/router/package.json                       |  4 +-
 lib/theming/package.json                      |  2 +-
 lib/ui/package.json                           | 14 ++---
 58 files changed, 337 insertions(+), 337 deletions(-)

diff --git a/addons/a11y/package.json b/addons/a11y/package.json
index 25efb8a4b39..670559c0a37 100644
--- a/addons/a11y/package.json
+++ b/addons/a11y/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-a11y",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "description": "a11y addon for storybook",
   "keywords": [
     "a11y",
@@ -25,11 +25,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.1",
-    "@storybook/client-logger": "5.0.0-rc.1",
-    "@storybook/components": "5.0.0-rc.1",
-    "@storybook/core-events": "5.0.0-rc.1",
-    "@storybook/theming": "5.0.0-rc.1",
+    "@storybook/addons": "5.0.0-rc.2",
+    "@storybook/client-logger": "5.0.0-rc.2",
+    "@storybook/components": "5.0.0-rc.2",
+    "@storybook/core-events": "5.0.0-rc.2",
+    "@storybook/theming": "5.0.0-rc.2",
     "axe-core": "^3.1.2",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
diff --git a/addons/actions/package.json b/addons/actions/package.json
index 1d494963bef..375fbb45890 100644
--- a/addons/actions/package.json
+++ b/addons/actions/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-actions",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "description": "Action Logger addon for storybook",
   "keywords": [
     "storybook"
@@ -20,10 +20,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.1",
-    "@storybook/components": "5.0.0-rc.1",
-    "@storybook/core-events": "5.0.0-rc.1",
-    "@storybook/theming": "5.0.0-rc.1",
+    "@storybook/addons": "5.0.0-rc.2",
+    "@storybook/components": "5.0.0-rc.2",
+    "@storybook/core-events": "5.0.0-rc.2",
+    "@storybook/theming": "5.0.0-rc.2",
     "core-js": "^2.6.2",
     "fast-deep-equal": "^2.0.1",
     "global": "^4.3.2",
diff --git a/addons/backgrounds/package.json b/addons/backgrounds/package.json
index 0311b33e551..dc5ea46cf2c 100644
--- a/addons/backgrounds/package.json
+++ b/addons/backgrounds/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-backgrounds",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "description": "A storybook addon to show different backgrounds for your preview",
   "keywords": [
     "addon",
@@ -24,11 +24,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.1",
-    "@storybook/client-logger": "5.0.0-rc.1",
-    "@storybook/components": "5.0.0-rc.1",
-    "@storybook/core-events": "5.0.0-rc.1",
-    "@storybook/theming": "5.0.0-rc.1",
+    "@storybook/addons": "5.0.0-rc.2",
+    "@storybook/client-logger": "5.0.0-rc.2",
+    "@storybook/components": "5.0.0-rc.2",
+    "@storybook/core-events": "5.0.0-rc.2",
+    "@storybook/theming": "5.0.0-rc.2",
     "core-js": "^2.6.2",
     "eventemitter3": "^3.1.0",
     "global": "^4.3.2",
diff --git a/addons/centered/package.json b/addons/centered/package.json
index 4a8779c3229..63a03f12cd6 100644
--- a/addons/centered/package.json
+++ b/addons/centered/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-centered",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "description": "Storybook decorator to center components",
   "keywords": [
     "addon",
diff --git a/addons/cssresources/package.json b/addons/cssresources/package.json
index e515d526183..bfd211d2b9f 100644
--- a/addons/cssresources/package.json
+++ b/addons/cssresources/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-cssresources",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "description": "A storybook addon to switch between css resources at runtime for your story",
   "keywords": [
     "addon",
@@ -25,10 +25,10 @@
   },
   "dependencies": {
     "@emotion/styled": "10.0.6",
-    "@storybook/addons": "5.0.0-rc.1",
-    "@storybook/channels": "5.0.0-rc.1",
-    "@storybook/components": "5.0.0-rc.1",
-    "@storybook/core-events": "5.0.0-rc.1",
+    "@storybook/addons": "5.0.0-rc.2",
+    "@storybook/channels": "5.0.0-rc.2",
+    "@storybook/components": "5.0.0-rc.2",
+    "@storybook/core-events": "5.0.0-rc.2",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "prop-types": "^15.6.2",
diff --git a/addons/events/package.json b/addons/events/package.json
index 629a4dbaa5d..61919a9b239 100644
--- a/addons/events/package.json
+++ b/addons/events/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-events",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "description": "Add events to your Storybook stories.",
   "keywords": [
     "addon",
@@ -23,9 +23,9 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.1",
-    "@storybook/core-events": "5.0.0-rc.1",
-    "@storybook/theming": "5.0.0-rc.1",
+    "@storybook/addons": "5.0.0-rc.2",
+    "@storybook/core-events": "5.0.0-rc.2",
+    "@storybook/theming": "5.0.0-rc.2",
     "core-js": "^2.6.2",
     "format-json": "^1.0.3",
     "prop-types": "^15.6.2",
diff --git a/addons/google-analytics/package.json b/addons/google-analytics/package.json
index 1d7b936564f..14a0d9ebafe 100644
--- a/addons/google-analytics/package.json
+++ b/addons/google-analytics/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-google-analytics",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "description": "Storybook addon for google analytics",
   "keywords": [
     "addon",
@@ -19,8 +19,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.1",
-    "@storybook/core-events": "5.0.0-rc.1",
+    "@storybook/addons": "5.0.0-rc.2",
+    "@storybook/core-events": "5.0.0-rc.2",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "react-ga": "^2.5.3"
diff --git a/addons/graphql/package.json b/addons/graphql/package.json
index ac3809753c2..649244f2485 100644
--- a/addons/graphql/package.json
+++ b/addons/graphql/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-graphql",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "description": "Storybook addon to display the GraphiQL IDE",
   "keywords": [
     "addon",
diff --git a/addons/info/package.json b/addons/info/package.json
index 59b23494a52..e80e33a730e 100644
--- a/addons/info/package.json
+++ b/addons/info/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-info",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "description": "A Storybook addon to show additional information for your stories.",
   "keywords": [
     "addon",
@@ -21,10 +21,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.1",
-    "@storybook/client-logger": "5.0.0-rc.1",
-    "@storybook/components": "5.0.0-rc.1",
-    "@storybook/theming": "5.0.0-rc.1",
+    "@storybook/addons": "5.0.0-rc.2",
+    "@storybook/client-logger": "5.0.0-rc.2",
+    "@storybook/components": "5.0.0-rc.2",
+    "@storybook/theming": "5.0.0-rc.2",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "marksy": "^6.1.0",
diff --git a/addons/jest/package.json b/addons/jest/package.json
index 0a5954f7a22..6300c5b61ea 100644
--- a/addons/jest/package.json
+++ b/addons/jest/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-jest",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "description": "React storybook addon that show component jest report",
   "keywords": [
     "addon",
@@ -27,10 +27,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.1",
-    "@storybook/components": "5.0.0-rc.1",
-    "@storybook/core-events": "5.0.0-rc.1",
-    "@storybook/theming": "5.0.0-rc.1",
+    "@storybook/addons": "5.0.0-rc.2",
+    "@storybook/components": "5.0.0-rc.2",
+    "@storybook/core-events": "5.0.0-rc.2",
+    "@storybook/theming": "5.0.0-rc.2",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "prop-types": "^15.6.2",
diff --git a/addons/knobs/package.json b/addons/knobs/package.json
index c77d58957d6..2a414ec4514 100644
--- a/addons/knobs/package.json
+++ b/addons/knobs/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-knobs",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "description": "Storybook Addon Prop Editor Component",
   "keywords": [
     "addon",
@@ -21,10 +21,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.1",
-    "@storybook/components": "5.0.0-rc.1",
-    "@storybook/core-events": "5.0.0-rc.1",
-    "@storybook/theming": "5.0.0-rc.1",
+    "@storybook/addons": "5.0.0-rc.2",
+    "@storybook/components": "5.0.0-rc.2",
+    "@storybook/core-events": "5.0.0-rc.2",
+    "@storybook/theming": "5.0.0-rc.2",
     "copy-to-clipboard": "^3.0.8",
     "core-js": "^2.6.2",
     "escape-html": "^1.0.3",
diff --git a/addons/links/package.json b/addons/links/package.json
index 275d782ed2f..7e3a530f31f 100644
--- a/addons/links/package.json
+++ b/addons/links/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-links",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "description": "Story Links addon for storybook",
   "keywords": [
     "addon",
@@ -21,8 +21,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.1",
-    "@storybook/core-events": "5.0.0-rc.1",
+    "@storybook/addons": "5.0.0-rc.2",
+    "@storybook/core-events": "5.0.0-rc.2",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/addons/notes/package.json b/addons/notes/package.json
index c471d5d0756..daed6ee2baa 100644
--- a/addons/notes/package.json
+++ b/addons/notes/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-notes",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "description": "Write notes for your Storybook stories.",
   "keywords": [
     "addon",
@@ -22,11 +22,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.1",
-    "@storybook/client-logger": "5.0.0-rc.1",
-    "@storybook/components": "5.0.0-rc.1",
-    "@storybook/core-events": "5.0.0-rc.1",
-    "@storybook/theming": "5.0.0-rc.1",
+    "@storybook/addons": "5.0.0-rc.2",
+    "@storybook/client-logger": "5.0.0-rc.2",
+    "@storybook/components": "5.0.0-rc.2",
+    "@storybook/core-events": "5.0.0-rc.2",
+    "@storybook/theming": "5.0.0-rc.2",
     "markdown-to-jsx": "^6.9.1",
     "prop-types": "^15.6.2",
     "util-deprecate": "^1.0.2"
diff --git a/addons/options/package.json b/addons/options/package.json
index 29b5df669da..0e60fd96a05 100644
--- a/addons/options/package.json
+++ b/addons/options/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-options",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "description": "Options addon for storybook",
   "keywords": [
     "addon",
@@ -20,7 +20,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.1",
+    "@storybook/addons": "5.0.0-rc.2",
     "core-js": "^2.6.2",
     "util-deprecate": "^1.0.2"
   },
diff --git a/addons/storyshots/storyshots-core/package.json b/addons/storyshots/storyshots-core/package.json
index 900e2ce6b7e..cdceb395cc3 100644
--- a/addons/storyshots/storyshots-core/package.json
+++ b/addons/storyshots/storyshots-core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storyshots",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "description": "StoryShots is a Jest Snapshot Testing Addon for Storybook.",
   "keywords": [
     "addon",
@@ -24,7 +24,7 @@
     "storybook": "start-storybook -p 6006"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.1",
+    "@storybook/addons": "5.0.0-rc.2",
     "core-js": "^2.6.2",
     "glob": "^7.1.3",
     "global": "^4.3.2",
diff --git a/addons/storyshots/storyshots-puppeteer/package.json b/addons/storyshots/storyshots-puppeteer/package.json
index fec79e00d47..bd751182d7c 100644
--- a/addons/storyshots/storyshots-puppeteer/package.json
+++ b/addons/storyshots/storyshots-puppeteer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storyshots-puppeteer",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "description": "Image snappshots addition to StoryShots base on puppeteer",
   "keywords": [
     "addon",
@@ -21,8 +21,8 @@
     "prepare": "node ../../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.1",
-    "@storybook/node-logger": "5.0.0-rc.1",
+    "@storybook/core": "5.0.0-rc.2",
+    "@storybook/node-logger": "5.0.0-rc.2",
     "core-js": "^2.6.2",
     "jest-image-snapshot": "^2.6.0",
     "puppeteer": "^1.12.0",
diff --git a/addons/storysource/package.json b/addons/storysource/package.json
index 7755343e3f0..786e3ee2660 100644
--- a/addons/storysource/package.json
+++ b/addons/storysource/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storysource",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "description": "Stories addon for storybook",
   "keywords": [
     "addon",
@@ -21,9 +21,9 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.1",
-    "@storybook/components": "5.0.0-rc.1",
-    "@storybook/theming": "5.0.0-rc.1",
+    "@storybook/addons": "5.0.0-rc.2",
+    "@storybook/components": "5.0.0-rc.2",
+    "@storybook/theming": "5.0.0-rc.2",
     "core-js": "^2.6.2",
     "estraverse": "^4.2.0",
     "loader-utils": "^1.2.1",
diff --git a/addons/viewport/package.json b/addons/viewport/package.json
index 8dc37cce563..3c3329d2510 100644
--- a/addons/viewport/package.json
+++ b/addons/viewport/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-viewport",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "description": "Storybook addon to change the viewport size to mobile",
   "keywords": [
     "addon",
@@ -20,11 +20,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.1",
-    "@storybook/client-logger": "5.0.0-rc.1",
-    "@storybook/components": "5.0.0-rc.1",
-    "@storybook/core-events": "5.0.0-rc.1",
-    "@storybook/theming": "5.0.0-rc.1",
+    "@storybook/addons": "5.0.0-rc.2",
+    "@storybook/client-logger": "5.0.0-rc.2",
+    "@storybook/components": "5.0.0-rc.2",
+    "@storybook/core-events": "5.0.0-rc.2",
+    "@storybook/theming": "5.0.0-rc.2",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
diff --git a/app/angular/package.json b/app/angular/package.json
index cb2733fa394..cb98e933bc1 100644
--- a/app/angular/package.json
+++ b/app/angular/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/angular",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "description": "Storybook for Angular: Develop Angular Components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,8 +25,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.1",
-    "@storybook/node-logger": "5.0.0-rc.1",
+    "@storybook/core": "5.0.0-rc.2",
+    "@storybook/node-logger": "5.0.0-rc.2",
     "angular2-template-loader": "^0.6.2",
     "core-js": "^2.6.2",
     "fork-ts-checker-webpack-plugin": "^0.5.2",
diff --git a/app/ember/package.json b/app/ember/package.json
index 68b2072619b..53151490b2f 100644
--- a/app/ember/package.json
+++ b/app/ember/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/ember",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "description": "Storybook for Ember: Develop Ember Component in isolation with Hot Reloading.",
   "homepage": "https://github.com/storybooks/storybook/tree/master/app/ember",
   "bugs": {
@@ -23,7 +23,7 @@
   },
   "dependencies": {
     "@ember/test-helpers": "^1.3.1",
-    "@storybook/core": "5.0.0-rc.1",
+    "@storybook/core": "5.0.0-rc.2",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/html/package.json b/app/html/package.json
index f3d9393d7f1..520593fe26c 100644
--- a/app/html/package.json
+++ b/app/html/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/html",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "description": "Storybook for HTML: View HTML snippets in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.1",
+    "@storybook/core": "5.0.0-rc.2",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/marko/package.json b/app/marko/package.json
index d838d663cd7..80f609dfdf9 100644
--- a/app/marko/package.json
+++ b/app/marko/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/marko",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "description": "Storybook for Marko: Develop Marko Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.1",
+    "@storybook/core": "5.0.0-rc.2",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/mithril/package.json b/app/mithril/package.json
index f94cf749898..68ace8a872b 100644
--- a/app/mithril/package.json
+++ b/app/mithril/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/mithril",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "description": "Storybook for Mithril: Develop Mithril Component in isolation.",
   "keywords": [
     "storybook"
@@ -26,7 +26,7 @@
   },
   "dependencies": {
     "@babel/plugin-transform-react-jsx": "^7.3.0",
-    "@storybook/core": "5.0.0-rc.1",
+    "@storybook/core": "5.0.0-rc.2",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/polymer/package.json b/app/polymer/package.json
index dfbbf27ec12..6d93d4c4f1a 100644
--- a/app/polymer/package.json
+++ b/app/polymer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/polymer",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "description": "Storybook for Polymer: Develop Polymer components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.1",
+    "@storybook/core": "5.0.0-rc.2",
     "@webcomponents/webcomponentsjs": "^1.2.0",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
diff --git a/app/preact/package.json b/app/preact/package.json
index 82271fc297b..bc56ee82ffa 100644
--- a/app/preact/package.json
+++ b/app/preact/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/preact",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "description": "Storybook for Preact: Develop Preact Component in isolation.",
   "keywords": [
     "storybook"
@@ -26,7 +26,7 @@
   },
   "dependencies": {
     "@babel/plugin-transform-react-jsx": "^7.3.0",
-    "@storybook/core": "5.0.0-rc.1",
+    "@storybook/core": "5.0.0-rc.2",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/react/package.json b/app/react/package.json
index 02dca019dcd..414a8a86c77 100644
--- a/app/react/package.json
+++ b/app/react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/react",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "description": "Storybook for React: Develop React Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -28,9 +28,9 @@
     "@babel/plugin-transform-react-constant-elements": "^7.2.0",
     "@babel/preset-flow": "^7.0.0",
     "@babel/preset-react": "^7.0.0",
-    "@storybook/core": "5.0.0-rc.1",
-    "@storybook/node-logger": "5.0.0-rc.1",
-    "@storybook/theming": "5.0.0-rc.1",
+    "@storybook/core": "5.0.0-rc.2",
+    "@storybook/node-logger": "5.0.0-rc.2",
+    "@storybook/theming": "5.0.0-rc.2",
     "@svgr/webpack": "^4.0.3",
     "babel-plugin-named-asset-import": "^0.3.0",
     "babel-plugin-react-docgen": "^2.0.2",
diff --git a/app/riot/package.json b/app/riot/package.json
index ba674a6845b..f99faa56142 100644
--- a/app/riot/package.json
+++ b/app/riot/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/riot",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "description": "Storybook for riot.js: View riot snippets in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.1",
+    "@storybook/core": "5.0.0-rc.2",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/svelte/package.json b/app/svelte/package.json
index 38e5d867c7d..7d056cd3094 100644
--- a/app/svelte/package.json
+++ b/app/svelte/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/svelte",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "description": "Storybook for Svelte: Develop Svelte Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.1",
+    "@storybook/core": "5.0.0-rc.2",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/vue/package.json b/app/vue/package.json
index 6a23872320c..038971b968a 100644
--- a/app/vue/package.json
+++ b/app/vue/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/vue",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "description": "Storybook for Vue: Develop Vue Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.1",
+    "@storybook/core": "5.0.0-rc.2",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/examples/angular-cli/package.json b/examples/angular-cli/package.json
index e3caad48227..5be22f3ee50 100644
--- a/examples/angular-cli/package.json
+++ b/examples/angular-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "angular-cli",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "private": true,
   "license": "MIT",
   "scripts": {
@@ -33,18 +33,18 @@
     "@angular-devkit/build-angular": "^0.11.4",
     "@angular/cli": "^7.3.0",
     "@angular/compiler-cli": "^7.2.1",
-    "@storybook/addon-actions": "5.0.0-rc.1",
-    "@storybook/addon-backgrounds": "5.0.0-rc.1",
-    "@storybook/addon-centered": "5.0.0-rc.1",
-    "@storybook/addon-jest": "5.0.0-rc.1",
-    "@storybook/addon-knobs": "5.0.0-rc.1",
-    "@storybook/addon-links": "5.0.0-rc.1",
-    "@storybook/addon-notes": "5.0.0-rc.1",
-    "@storybook/addon-options": "5.0.0-rc.1",
-    "@storybook/addon-storyshots": "5.0.0-rc.1",
-    "@storybook/addon-storysource": "5.0.0-rc.1",
-    "@storybook/addons": "5.0.0-rc.1",
-    "@storybook/angular": "5.0.0-rc.1",
+    "@storybook/addon-actions": "5.0.0-rc.2",
+    "@storybook/addon-backgrounds": "5.0.0-rc.2",
+    "@storybook/addon-centered": "5.0.0-rc.2",
+    "@storybook/addon-jest": "5.0.0-rc.2",
+    "@storybook/addon-knobs": "5.0.0-rc.2",
+    "@storybook/addon-links": "5.0.0-rc.2",
+    "@storybook/addon-notes": "5.0.0-rc.2",
+    "@storybook/addon-options": "5.0.0-rc.2",
+    "@storybook/addon-storyshots": "5.0.0-rc.2",
+    "@storybook/addon-storysource": "5.0.0-rc.2",
+    "@storybook/addons": "5.0.0-rc.2",
+    "@storybook/angular": "5.0.0-rc.2",
     "@types/core-js": "^2.5.0",
     "@types/jest": "^23.3.13",
     "@types/node": "~10.12.19",
diff --git a/examples/cra-kitchen-sink/package.json b/examples/cra-kitchen-sink/package.json
index 612d354950c..06306b41f8a 100644
--- a/examples/cra-kitchen-sink/package.json
+++ b/examples/cra-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "cra-kitchen-sink",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "private": true,
   "scripts": {
     "build": "react-scripts build",
@@ -18,21 +18,21 @@
     "react-lifecycles-compat": "^3.0.4"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.0.0-rc.1",
-    "@storybook/addon-actions": "5.0.0-rc.1",
-    "@storybook/addon-backgrounds": "5.0.0-rc.1",
-    "@storybook/addon-centered": "5.0.0-rc.1",
-    "@storybook/addon-events": "5.0.0-rc.1",
-    "@storybook/addon-info": "5.0.0-rc.1",
-    "@storybook/addon-jest": "5.0.0-rc.1",
-    "@storybook/addon-knobs": "5.0.0-rc.1",
-    "@storybook/addon-links": "5.0.0-rc.1",
-    "@storybook/addon-notes": "5.0.0-rc.1",
-    "@storybook/addon-options": "5.0.0-rc.1",
-    "@storybook/addon-storyshots": "5.0.0-rc.1",
-    "@storybook/addons": "5.0.0-rc.1",
-    "@storybook/client-logger": "5.0.0-rc.1",
-    "@storybook/react": "5.0.0-rc.1",
+    "@storybook/addon-a11y": "5.0.0-rc.2",
+    "@storybook/addon-actions": "5.0.0-rc.2",
+    "@storybook/addon-backgrounds": "5.0.0-rc.2",
+    "@storybook/addon-centered": "5.0.0-rc.2",
+    "@storybook/addon-events": "5.0.0-rc.2",
+    "@storybook/addon-info": "5.0.0-rc.2",
+    "@storybook/addon-jest": "5.0.0-rc.2",
+    "@storybook/addon-knobs": "5.0.0-rc.2",
+    "@storybook/addon-links": "5.0.0-rc.2",
+    "@storybook/addon-notes": "5.0.0-rc.2",
+    "@storybook/addon-options": "5.0.0-rc.2",
+    "@storybook/addon-storyshots": "5.0.0-rc.2",
+    "@storybook/addons": "5.0.0-rc.2",
+    "@storybook/client-logger": "5.0.0-rc.2",
+    "@storybook/react": "5.0.0-rc.2",
     "enzyme": "^3.7.0",
     "enzyme-adapter-react-16": "^1.9.1",
     "enzyme-to-json": "^3.3.4",
diff --git a/examples/cra-ts-kitchen-sink/package.json b/examples/cra-ts-kitchen-sink/package.json
index 1241af5607b..f6402ca7377 100644
--- a/examples/cra-ts-kitchen-sink/package.json
+++ b/examples/cra-ts-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "cra-ts-kitchen-sink",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook -s public",
@@ -19,11 +19,11 @@
     "react-dom": "^16.8.1"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.1",
-    "@storybook/addon-info": "5.0.0-rc.1",
-    "@storybook/addon-options": "5.0.0-rc.1",
-    "@storybook/addons": "5.0.0-rc.1",
-    "@storybook/react": "5.0.0-rc.1",
+    "@storybook/addon-actions": "5.0.0-rc.2",
+    "@storybook/addon-info": "5.0.0-rc.2",
+    "@storybook/addon-options": "5.0.0-rc.2",
+    "@storybook/addons": "5.0.0-rc.2",
+    "@storybook/react": "5.0.0-rc.2",
     "@types/enzyme": "^3.1.15",
     "@types/react": "^16.7.22",
     "@types/react-dom": "^16.0.11",
diff --git a/examples/ember-cli/package.json b/examples/ember-cli/package.json
index c899919d2f6..5a67d3923bc 100644
--- a/examples/ember-cli/package.json
+++ b/examples/ember-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "ember-example",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "private": true,
   "scripts": {
     "build": "ember build",
@@ -14,18 +14,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.2.2",
-    "@storybook/addon-a11y": "5.0.0-rc.1",
-    "@storybook/addon-actions": "5.0.0-rc.1",
-    "@storybook/addon-backgrounds": "5.0.0-rc.1",
-    "@storybook/addon-centered": "5.0.0-rc.1",
-    "@storybook/addon-knobs": "5.0.0-rc.1",
-    "@storybook/addon-links": "5.0.0-rc.1",
-    "@storybook/addon-notes": "5.0.0-rc.1",
-    "@storybook/addon-options": "5.0.0-rc.1",
-    "@storybook/addon-storysource": "5.0.0-rc.1",
-    "@storybook/addon-viewport": "5.0.0-rc.1",
-    "@storybook/addons": "5.0.0-rc.1",
-    "@storybook/ember": "5.0.0-rc.1",
+    "@storybook/addon-a11y": "5.0.0-rc.2",
+    "@storybook/addon-actions": "5.0.0-rc.2",
+    "@storybook/addon-backgrounds": "5.0.0-rc.2",
+    "@storybook/addon-centered": "5.0.0-rc.2",
+    "@storybook/addon-knobs": "5.0.0-rc.2",
+    "@storybook/addon-links": "5.0.0-rc.2",
+    "@storybook/addon-notes": "5.0.0-rc.2",
+    "@storybook/addon-options": "5.0.0-rc.2",
+    "@storybook/addon-storysource": "5.0.0-rc.2",
+    "@storybook/addon-viewport": "5.0.0-rc.2",
+    "@storybook/addons": "5.0.0-rc.2",
+    "@storybook/ember": "5.0.0-rc.2",
     "babel-loader": "^8",
     "broccoli-asset-rev": "^3.0.0",
     "cross-env": "^5.2.0",
diff --git a/examples/html-kitchen-sink/package.json b/examples/html-kitchen-sink/package.json
index a8afac3a589..e44b5bdb252 100644
--- a/examples/html-kitchen-sink/package.json
+++ b/examples/html-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "html-kitchen-sink",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "private": true,
   "description": "",
   "keywords": [],
@@ -13,23 +13,23 @@
     "storybook": "start-storybook -p 9006"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.0.0-rc.1",
-    "@storybook/addon-actions": "5.0.0-rc.1",
-    "@storybook/addon-backgrounds": "5.0.0-rc.1",
-    "@storybook/addon-centered": "5.0.0-rc.1",
-    "@storybook/addon-events": "5.0.0-rc.1",
-    "@storybook/addon-jest": "5.0.0-rc.1",
-    "@storybook/addon-knobs": "5.0.0-rc.1",
-    "@storybook/addon-links": "5.0.0-rc.1",
-    "@storybook/addon-notes": "5.0.0-rc.1",
-    "@storybook/addon-options": "5.0.0-rc.1",
-    "@storybook/addon-storyshots": "5.0.0-rc.1",
-    "@storybook/addon-storysource": "5.0.0-rc.1",
-    "@storybook/addon-viewport": "5.0.0-rc.1",
-    "@storybook/addons": "5.0.0-rc.1",
-    "@storybook/core": "5.0.0-rc.1",
-    "@storybook/core-events": "5.0.0-rc.1",
-    "@storybook/html": "5.0.0-rc.1",
+    "@storybook/addon-a11y": "5.0.0-rc.2",
+    "@storybook/addon-actions": "5.0.0-rc.2",
+    "@storybook/addon-backgrounds": "5.0.0-rc.2",
+    "@storybook/addon-centered": "5.0.0-rc.2",
+    "@storybook/addon-events": "5.0.0-rc.2",
+    "@storybook/addon-jest": "5.0.0-rc.2",
+    "@storybook/addon-knobs": "5.0.0-rc.2",
+    "@storybook/addon-links": "5.0.0-rc.2",
+    "@storybook/addon-notes": "5.0.0-rc.2",
+    "@storybook/addon-options": "5.0.0-rc.2",
+    "@storybook/addon-storyshots": "5.0.0-rc.2",
+    "@storybook/addon-storysource": "5.0.0-rc.2",
+    "@storybook/addon-viewport": "5.0.0-rc.2",
+    "@storybook/addons": "5.0.0-rc.2",
+    "@storybook/core": "5.0.0-rc.2",
+    "@storybook/core-events": "5.0.0-rc.2",
+    "@storybook/html": "5.0.0-rc.2",
     "eventemitter3": "^3.1.0",
     "format-json": "^1.0.3",
     "global": "^4.3.2",
diff --git a/examples/marko-cli/package.json b/examples/marko-cli/package.json
index 7d6df4a4255..6d545a7d112 100644
--- a/examples/marko-cli/package.json
+++ b/examples/marko-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "marko-cli",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "private": true,
   "description": "Demo of how to build an app using marko-starter",
   "repository": {
@@ -22,12 +22,12 @@
     "marko-starter": "^2.0.4"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.1",
-    "@storybook/addon-knobs": "5.0.0-rc.1",
-    "@storybook/addon-options": "5.0.0-rc.1",
-    "@storybook/addon-storysource": "5.0.0-rc.1",
-    "@storybook/addons": "5.0.0-rc.1",
-    "@storybook/marko": "5.0.0-rc.1",
+    "@storybook/addon-actions": "5.0.0-rc.2",
+    "@storybook/addon-knobs": "5.0.0-rc.2",
+    "@storybook/addon-options": "5.0.0-rc.2",
+    "@storybook/addon-storysource": "5.0.0-rc.2",
+    "@storybook/addons": "5.0.0-rc.2",
+    "@storybook/marko": "5.0.0-rc.2",
     "prettier": "^1.16.4",
     "webpack": "^4.29.0"
   }
diff --git a/examples/mithril-kitchen-sink/package.json b/examples/mithril-kitchen-sink/package.json
index 25127b44841..02050914a3e 100644
--- a/examples/mithril-kitchen-sink/package.json
+++ b/examples/mithril-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "mithril-example",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook",
@@ -10,18 +10,18 @@
     "mithril": "^1.1.6"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.1",
-    "@storybook/addon-backgrounds": "5.0.0-rc.1",
-    "@storybook/addon-centered": "5.0.0-rc.1",
-    "@storybook/addon-knobs": "5.0.0-rc.1",
-    "@storybook/addon-links": "5.0.0-rc.1",
-    "@storybook/addon-notes": "5.0.0-rc.1",
-    "@storybook/addon-options": "5.0.0-rc.1",
-    "@storybook/addon-storyshots": "5.0.0-rc.1",
-    "@storybook/addon-storysource": "5.0.0-rc.1",
-    "@storybook/addon-viewport": "5.0.0-rc.1",
-    "@storybook/addons": "5.0.0-rc.1",
-    "@storybook/mithril": "5.0.0-rc.1",
+    "@storybook/addon-actions": "5.0.0-rc.2",
+    "@storybook/addon-backgrounds": "5.0.0-rc.2",
+    "@storybook/addon-centered": "5.0.0-rc.2",
+    "@storybook/addon-knobs": "5.0.0-rc.2",
+    "@storybook/addon-links": "5.0.0-rc.2",
+    "@storybook/addon-notes": "5.0.0-rc.2",
+    "@storybook/addon-options": "5.0.0-rc.2",
+    "@storybook/addon-storyshots": "5.0.0-rc.2",
+    "@storybook/addon-storysource": "5.0.0-rc.2",
+    "@storybook/addon-viewport": "5.0.0-rc.2",
+    "@storybook/addons": "5.0.0-rc.2",
+    "@storybook/mithril": "5.0.0-rc.2",
     "webpack": "^4.29.0"
   }
 }
diff --git a/examples/official-storybook/package.json b/examples/official-storybook/package.json
index fe056b631a1..1ea39ccc493 100644
--- a/examples/official-storybook/package.json
+++ b/examples/official-storybook/package.json
@@ -1,6 +1,6 @@
 {
   "name": "official-storybook",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook -c ./ -s built-storybooks",
@@ -12,29 +12,29 @@
     "storybook": "cross-env STORYBOOK_DISPLAY_WARNING=true DISPLAY_WARNING=true start-storybook -p 9011 -c ./ -s built-storybooks --no-dll"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.0.0-rc.1",
-    "@storybook/addon-actions": "5.0.0-rc.1",
-    "@storybook/addon-backgrounds": "5.0.0-rc.1",
-    "@storybook/addon-centered": "5.0.0-rc.1",
-    "@storybook/addon-cssresources": "5.0.0-rc.1",
-    "@storybook/addon-events": "5.0.0-rc.1",
-    "@storybook/addon-graphql": "5.0.0-rc.1",
-    "@storybook/addon-info": "5.0.0-rc.1",
-    "@storybook/addon-jest": "5.0.0-rc.1",
-    "@storybook/addon-knobs": "5.0.0-rc.1",
-    "@storybook/addon-links": "5.0.0-rc.1",
-    "@storybook/addon-notes": "5.0.0-rc.1",
-    "@storybook/addon-options": "5.0.0-rc.1",
-    "@storybook/addon-storyshots": "5.0.0-rc.1",
-    "@storybook/addon-storyshots-puppeteer": "5.0.0-rc.1",
-    "@storybook/addon-storysource": "5.0.0-rc.1",
-    "@storybook/addon-viewport": "5.0.0-rc.1",
-    "@storybook/addons": "5.0.0-rc.1",
-    "@storybook/components": "5.0.0-rc.1",
-    "@storybook/core-events": "5.0.0-rc.1",
-    "@storybook/node-logger": "5.0.0-rc.1",
-    "@storybook/react": "5.0.0-rc.1",
-    "@storybook/theming": "5.0.0-rc.1",
+    "@storybook/addon-a11y": "5.0.0-rc.2",
+    "@storybook/addon-actions": "5.0.0-rc.2",
+    "@storybook/addon-backgrounds": "5.0.0-rc.2",
+    "@storybook/addon-centered": "5.0.0-rc.2",
+    "@storybook/addon-cssresources": "5.0.0-rc.2",
+    "@storybook/addon-events": "5.0.0-rc.2",
+    "@storybook/addon-graphql": "5.0.0-rc.2",
+    "@storybook/addon-info": "5.0.0-rc.2",
+    "@storybook/addon-jest": "5.0.0-rc.2",
+    "@storybook/addon-knobs": "5.0.0-rc.2",
+    "@storybook/addon-links": "5.0.0-rc.2",
+    "@storybook/addon-notes": "5.0.0-rc.2",
+    "@storybook/addon-options": "5.0.0-rc.2",
+    "@storybook/addon-storyshots": "5.0.0-rc.2",
+    "@storybook/addon-storyshots-puppeteer": "5.0.0-rc.2",
+    "@storybook/addon-storysource": "5.0.0-rc.2",
+    "@storybook/addon-viewport": "5.0.0-rc.2",
+    "@storybook/addons": "5.0.0-rc.2",
+    "@storybook/components": "5.0.0-rc.2",
+    "@storybook/core-events": "5.0.0-rc.2",
+    "@storybook/node-logger": "5.0.0-rc.2",
+    "@storybook/react": "5.0.0-rc.2",
+    "@storybook/theming": "5.0.0-rc.2",
     "cors": "^2.8.4",
     "cross-env": "^5.2.0",
     "enzyme-to-json": "^3.3.4",
diff --git a/examples/polymer-cli/package.json b/examples/polymer-cli/package.json
index 2d80c2d868f..4386e8fb28a 100644
--- a/examples/polymer-cli/package.json
+++ b/examples/polymer-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "polymer-cli",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook",
@@ -9,15 +9,15 @@
   },
   "dependencies": {
     "@polymer/polymer": "^2.6.0",
-    "@storybook/addon-actions": "5.0.0-rc.1",
-    "@storybook/addon-backgrounds": "5.0.0-rc.1",
-    "@storybook/addon-knobs": "5.0.0-rc.1",
-    "@storybook/addon-links": "5.0.0-rc.1",
-    "@storybook/addon-notes": "5.0.0-rc.1",
-    "@storybook/addon-options": "5.0.0-rc.1",
-    "@storybook/addon-storysource": "5.0.0-rc.1",
-    "@storybook/addon-viewport": "5.0.0-rc.1",
-    "@storybook/polymer": "5.0.0-rc.1",
+    "@storybook/addon-actions": "5.0.0-rc.2",
+    "@storybook/addon-backgrounds": "5.0.0-rc.2",
+    "@storybook/addon-knobs": "5.0.0-rc.2",
+    "@storybook/addon-links": "5.0.0-rc.2",
+    "@storybook/addon-notes": "5.0.0-rc.2",
+    "@storybook/addon-options": "5.0.0-rc.2",
+    "@storybook/addon-storysource": "5.0.0-rc.2",
+    "@storybook/addon-viewport": "5.0.0-rc.2",
+    "@storybook/polymer": "5.0.0-rc.2",
     "@webcomponents/webcomponentsjs": "^1.2.0",
     "global": "^4.3.2",
     "lit-html": "^1.0.0",
diff --git a/examples/preact-kitchen-sink/package.json b/examples/preact-kitchen-sink/package.json
index 1f69010be02..11329c4cdf6 100644
--- a/examples/preact-kitchen-sink/package.json
+++ b/examples/preact-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "preact-example",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "private": true,
   "scripts": {
     "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
@@ -15,18 +15,18 @@
   "devDependencies": {
     "@babel/core": "^7.2.2",
     "@babel/plugin-transform-runtime": "^7.2.0",
-    "@storybook/addon-actions": "5.0.0-rc.1",
-    "@storybook/addon-backgrounds": "5.0.0-rc.1",
-    "@storybook/addon-centered": "5.0.0-rc.1",
-    "@storybook/addon-knobs": "5.0.0-rc.1",
-    "@storybook/addon-links": "5.0.0-rc.1",
-    "@storybook/addon-notes": "5.0.0-rc.1",
-    "@storybook/addon-options": "5.0.0-rc.1",
-    "@storybook/addon-storyshots": "5.0.0-rc.1",
-    "@storybook/addon-storysource": "5.0.0-rc.1",
-    "@storybook/addon-viewport": "5.0.0-rc.1",
-    "@storybook/addons": "5.0.0-rc.1",
-    "@storybook/preact": "5.0.0-rc.1",
+    "@storybook/addon-actions": "5.0.0-rc.2",
+    "@storybook/addon-backgrounds": "5.0.0-rc.2",
+    "@storybook/addon-centered": "5.0.0-rc.2",
+    "@storybook/addon-knobs": "5.0.0-rc.2",
+    "@storybook/addon-links": "5.0.0-rc.2",
+    "@storybook/addon-notes": "5.0.0-rc.2",
+    "@storybook/addon-options": "5.0.0-rc.2",
+    "@storybook/addon-storyshots": "5.0.0-rc.2",
+    "@storybook/addon-storysource": "5.0.0-rc.2",
+    "@storybook/addon-viewport": "5.0.0-rc.2",
+    "@storybook/addons": "5.0.0-rc.2",
+    "@storybook/preact": "5.0.0-rc.2",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
     "file-loader": "^3.0.1",
diff --git a/examples/riot-kitchen-sink/package.json b/examples/riot-kitchen-sink/package.json
index b15b2e3f0b9..d3e13672ab6 100644
--- a/examples/riot-kitchen-sink/package.json
+++ b/examples/riot-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "riot-example",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "private": true,
   "scripts": {
     "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
@@ -15,18 +15,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.2.2",
-    "@storybook/addon-actions": "5.0.0-rc.1",
-    "@storybook/addon-backgrounds": "5.0.0-rc.1",
-    "@storybook/addon-centered": "5.0.0-rc.1",
-    "@storybook/addon-knobs": "5.0.0-rc.1",
-    "@storybook/addon-links": "5.0.0-rc.1",
-    "@storybook/addon-notes": "5.0.0-rc.1",
-    "@storybook/addon-options": "5.0.0-rc.1",
-    "@storybook/addon-storyshots": "5.0.0-rc.1",
-    "@storybook/addon-storysource": "5.0.0-rc.1",
-    "@storybook/addon-viewport": "5.0.0-rc.1",
-    "@storybook/addons": "5.0.0-rc.1",
-    "@storybook/riot": "5.0.0-rc.1",
+    "@storybook/addon-actions": "5.0.0-rc.2",
+    "@storybook/addon-backgrounds": "5.0.0-rc.2",
+    "@storybook/addon-centered": "5.0.0-rc.2",
+    "@storybook/addon-knobs": "5.0.0-rc.2",
+    "@storybook/addon-links": "5.0.0-rc.2",
+    "@storybook/addon-notes": "5.0.0-rc.2",
+    "@storybook/addon-options": "5.0.0-rc.2",
+    "@storybook/addon-storyshots": "5.0.0-rc.2",
+    "@storybook/addon-storysource": "5.0.0-rc.2",
+    "@storybook/addon-viewport": "5.0.0-rc.2",
+    "@storybook/addons": "5.0.0-rc.2",
+    "@storybook/riot": "5.0.0-rc.2",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
     "file-loader": "^3.0.1",
diff --git a/examples/svelte-kitchen-sink/package.json b/examples/svelte-kitchen-sink/package.json
index 02a851c38ca..8e72b78aab6 100644
--- a/examples/svelte-kitchen-sink/package.json
+++ b/examples/svelte-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "svelte-example",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook -s public",
@@ -10,17 +10,17 @@
     "global": "^4.3.2"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.1",
-    "@storybook/addon-backgrounds": "5.0.0-rc.1",
-    "@storybook/addon-centered": "5.0.0-rc.1",
-    "@storybook/addon-knobs": "5.0.0-rc.1",
-    "@storybook/addon-links": "5.0.0-rc.1",
-    "@storybook/addon-notes": "5.0.0-rc.1",
-    "@storybook/addon-options": "5.0.0-rc.1",
-    "@storybook/addon-storyshots": "5.0.0-rc.1",
-    "@storybook/addon-storysource": "5.0.0-rc.1",
-    "@storybook/addon-viewport": "5.0.0-rc.1",
-    "@storybook/addons": "5.0.0-rc.1",
-    "@storybook/svelte": "5.0.0-rc.1"
+    "@storybook/addon-actions": "5.0.0-rc.2",
+    "@storybook/addon-backgrounds": "5.0.0-rc.2",
+    "@storybook/addon-centered": "5.0.0-rc.2",
+    "@storybook/addon-knobs": "5.0.0-rc.2",
+    "@storybook/addon-links": "5.0.0-rc.2",
+    "@storybook/addon-notes": "5.0.0-rc.2",
+    "@storybook/addon-options": "5.0.0-rc.2",
+    "@storybook/addon-storyshots": "5.0.0-rc.2",
+    "@storybook/addon-storysource": "5.0.0-rc.2",
+    "@storybook/addon-viewport": "5.0.0-rc.2",
+    "@storybook/addons": "5.0.0-rc.2",
+    "@storybook/svelte": "5.0.0-rc.2"
   }
 }
diff --git a/examples/vue-kitchen-sink/package.json b/examples/vue-kitchen-sink/package.json
index c80abc3f524..1d08648056b 100644
--- a/examples/vue-kitchen-sink/package.json
+++ b/examples/vue-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "vue-example",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "private": true,
   "scripts": {
     "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
@@ -14,18 +14,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.2.2",
-    "@storybook/addon-actions": "5.0.0-rc.1",
-    "@storybook/addon-backgrounds": "5.0.0-rc.1",
-    "@storybook/addon-centered": "5.0.0-rc.1",
-    "@storybook/addon-knobs": "5.0.0-rc.1",
-    "@storybook/addon-links": "5.0.0-rc.1",
-    "@storybook/addon-notes": "5.0.0-rc.1",
-    "@storybook/addon-options": "5.0.0-rc.1",
-    "@storybook/addon-storyshots": "5.0.0-rc.1",
-    "@storybook/addon-storysource": "5.0.0-rc.1",
-    "@storybook/addon-viewport": "5.0.0-rc.1",
-    "@storybook/addons": "5.0.0-rc.1",
-    "@storybook/vue": "5.0.0-rc.1",
+    "@storybook/addon-actions": "5.0.0-rc.2",
+    "@storybook/addon-backgrounds": "5.0.0-rc.2",
+    "@storybook/addon-centered": "5.0.0-rc.2",
+    "@storybook/addon-knobs": "5.0.0-rc.2",
+    "@storybook/addon-links": "5.0.0-rc.2",
+    "@storybook/addon-notes": "5.0.0-rc.2",
+    "@storybook/addon-options": "5.0.0-rc.2",
+    "@storybook/addon-storyshots": "5.0.0-rc.2",
+    "@storybook/addon-storysource": "5.0.0-rc.2",
+    "@storybook/addon-viewport": "5.0.0-rc.2",
+    "@storybook/addons": "5.0.0-rc.2",
+    "@storybook/vue": "5.0.0-rc.2",
     "babel-core": "^7.0.0-bridge.0",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
diff --git a/lerna.json b/lerna.json
index 69b885cfa42..3b5748abbac 100644
--- a/lerna.json
+++ b/lerna.json
@@ -11,5 +11,5 @@
   "npmClient": "yarn",
   "useWorkspaces": true,
   "registry": "https://registry.npmjs.org",
-  "version": "5.0.0-rc.1"
+  "version": "5.0.0-rc.2"
 }
diff --git a/lib/addons/package.json b/lib/addons/package.json
index 314c0ea0067..f3a278e1967 100644
--- a/lib/addons/package.json
+++ b/lib/addons/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addons",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "description": "Storybook addons store",
   "keywords": [
     "storybook"
@@ -20,8 +20,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.0.0-rc.1",
-    "@storybook/client-logger": "5.0.0-rc.1",
+    "@storybook/channels": "5.0.0-rc.2",
+    "@storybook/client-logger": "5.0.0-rc.2",
     "global": "^4.3.2",
     "util-deprecate": "^1.0.2"
   },
diff --git a/lib/channel-postmessage/package.json b/lib/channel-postmessage/package.json
index 898c9153eba..96c1b5cc55e 100644
--- a/lib/channel-postmessage/package.json
+++ b/lib/channel-postmessage/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channel-postmessage",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "description": "",
   "keywords": [
     "storybook"
@@ -20,7 +20,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.0.0-rc.1",
+    "@storybook/channels": "5.0.0-rc.2",
     "global": "^4.3.2",
     "telejson": "^1.0.1"
   },
diff --git a/lib/channel-websocket/package.json b/lib/channel-websocket/package.json
index b7b07b9debd..f8a934e1548 100644
--- a/lib/channel-websocket/package.json
+++ b/lib/channel-websocket/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channel-websocket",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "description": "",
   "keywords": [
     "storybook"
@@ -20,7 +20,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.0.0-rc.1",
+    "@storybook/channels": "5.0.0-rc.2",
     "global": "^4.3.2",
     "json-fn": "^1.1.1"
   },
diff --git a/lib/channels/package.json b/lib/channels/package.json
index 07e1cad6154..2b2f3ae9326 100644
--- a/lib/channels/package.json
+++ b/lib/channels/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channels",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/cli/package.json b/lib/cli/package.json
index 908383fb934..56f3b9242ea 100644
--- a/lib/cli/package.json
+++ b/lib/cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/cli",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "description": "Storybook's CLI - easiest method of adding storybook to your projects",
   "keywords": [
     "cli",
@@ -29,7 +29,7 @@
     "@babel/core": "^7.2.2",
     "@babel/preset-env": "^7.3.1",
     "@babel/register": "^7.0.0",
-    "@storybook/codemod": "5.0.0-rc.1",
+    "@storybook/codemod": "5.0.0-rc.2",
     "chalk": "^2.4.1",
     "commander": "^2.19.0",
     "core-js": "^2.6.2",
@@ -43,31 +43,31 @@
     "update-notifier": "^2.5.0"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.1",
-    "@storybook/addon-centered": "5.0.0-rc.1",
-    "@storybook/addon-graphql": "5.0.0-rc.1",
-    "@storybook/addon-info": "5.0.0-rc.1",
-    "@storybook/addon-knobs": "5.0.0-rc.1",
-    "@storybook/addon-links": "5.0.0-rc.1",
-    "@storybook/addon-notes": "5.0.0-rc.1",
-    "@storybook/addon-options": "5.0.0-rc.1",
-    "@storybook/addon-storyshots": "5.0.0-rc.1",
-    "@storybook/addons": "5.0.0-rc.1",
-    "@storybook/angular": "5.0.0-rc.1",
-    "@storybook/channel-postmessage": "5.0.0-rc.1",
-    "@storybook/channel-websocket": "5.0.0-rc.1",
-    "@storybook/channels": "5.0.0-rc.1",
-    "@storybook/ember": "5.0.0-rc.1",
-    "@storybook/html": "5.0.0-rc.1",
-    "@storybook/marko": "5.0.0-rc.1",
-    "@storybook/mithril": "5.0.0-rc.1",
-    "@storybook/polymer": "5.0.0-rc.1",
-    "@storybook/preact": "5.0.0-rc.1",
-    "@storybook/react": "5.0.0-rc.1",
+    "@storybook/addon-actions": "5.0.0-rc.2",
+    "@storybook/addon-centered": "5.0.0-rc.2",
+    "@storybook/addon-graphql": "5.0.0-rc.2",
+    "@storybook/addon-info": "5.0.0-rc.2",
+    "@storybook/addon-knobs": "5.0.0-rc.2",
+    "@storybook/addon-links": "5.0.0-rc.2",
+    "@storybook/addon-notes": "5.0.0-rc.2",
+    "@storybook/addon-options": "5.0.0-rc.2",
+    "@storybook/addon-storyshots": "5.0.0-rc.2",
+    "@storybook/addons": "5.0.0-rc.2",
+    "@storybook/angular": "5.0.0-rc.2",
+    "@storybook/channel-postmessage": "5.0.0-rc.2",
+    "@storybook/channel-websocket": "5.0.0-rc.2",
+    "@storybook/channels": "5.0.0-rc.2",
+    "@storybook/ember": "5.0.0-rc.2",
+    "@storybook/html": "5.0.0-rc.2",
+    "@storybook/marko": "5.0.0-rc.2",
+    "@storybook/mithril": "5.0.0-rc.2",
+    "@storybook/polymer": "5.0.0-rc.2",
+    "@storybook/preact": "5.0.0-rc.2",
+    "@storybook/react": "5.0.0-rc.2",
     "@storybook/react-native": "5.0.0-beta.4",
-    "@storybook/riot": "5.0.0-rc.1",
-    "@storybook/ui": "5.0.0-rc.1",
-    "@storybook/vue": "5.0.0-rc.1"
+    "@storybook/riot": "5.0.0-rc.2",
+    "@storybook/ui": "5.0.0-rc.2",
+    "@storybook/vue": "5.0.0-rc.2"
   },
   "publishConfig": {
     "access": "public"
diff --git a/lib/client-api/package.json b/lib/client-api/package.json
index af5a84abe36..978aa0cfd52 100644
--- a/lib/client-api/package.json
+++ b/lib/client-api/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/client-api",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "description": "Storybook Client API",
   "keywords": [
     "storybook"
@@ -19,9 +19,9 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.1",
-    "@storybook/client-logger": "5.0.0-rc.1",
-    "@storybook/core-events": "5.0.0-rc.1",
+    "@storybook/addons": "5.0.0-rc.2",
+    "@storybook/client-logger": "5.0.0-rc.2",
+    "@storybook/core-events": "5.0.0-rc.2",
     "common-tags": "^1.8.0",
     "eventemitter3": "^3.1.0",
     "global": "^4.3.2",
diff --git a/lib/client-logger/package.json b/lib/client-logger/package.json
index 26b41433a53..1fb64a56430 100644
--- a/lib/client-logger/package.json
+++ b/lib/client-logger/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/client-logger",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/codemod/package.json b/lib/codemod/package.json
index 0688718b15d..59ee200d911 100644
--- a/lib/codemod/package.json
+++ b/lib/codemod/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/codemod",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "description": "A collection of codemod scripts written with JSCodeshift",
   "keywords": [
     "storybook"
diff --git a/lib/components/package.json b/lib/components/package.json
index 7889f209cd2..4112f4adc33 100644
--- a/lib/components/package.json
+++ b/lib/components/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/components",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "description": "Core Storybook Components",
   "keywords": [
     "storybook"
@@ -20,11 +20,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.1",
-    "@storybook/client-logger": "5.0.0-rc.1",
-    "@storybook/core-events": "5.0.0-rc.1",
-    "@storybook/router": "5.0.0-rc.1",
-    "@storybook/theming": "5.0.0-rc.1",
+    "@storybook/addons": "5.0.0-rc.2",
+    "@storybook/client-logger": "5.0.0-rc.2",
+    "@storybook/core-events": "5.0.0-rc.2",
+    "@storybook/router": "5.0.0-rc.2",
+    "@storybook/theming": "5.0.0-rc.2",
     "global": "^4.3.2",
     "immer": "^1.12.0",
     "js-beautify": "^1.8.9",
diff --git a/lib/core-events/package.json b/lib/core-events/package.json
index a0b06bdffa9..50b82d10259 100644
--- a/lib/core-events/package.json
+++ b/lib/core-events/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/core-events",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "description": "Event names used in storybook core",
   "keywords": [
     "storybook"
diff --git a/lib/core/package.json b/lib/core/package.json
index 00e83f083dd..4a802ec1e5d 100644
--- a/lib/core/package.json
+++ b/lib/core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/core",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "description": "Storybook framework-agnostic API",
   "keywords": [
     "storybook"
@@ -24,14 +24,14 @@
     "@babel/plugin-syntax-dynamic-import": "^7.2.0",
     "@babel/plugin-transform-react-constant-elements": "^7.2.0",
     "@babel/preset-env": "^7.3.1",
-    "@storybook/addons": "5.0.0-rc.1",
-    "@storybook/channel-postmessage": "5.0.0-rc.1",
-    "@storybook/client-api": "5.0.0-rc.1",
-    "@storybook/client-logger": "5.0.0-rc.1",
-    "@storybook/core-events": "5.0.0-rc.1",
-    "@storybook/node-logger": "5.0.0-rc.1",
-    "@storybook/theming": "5.0.0-rc.1",
-    "@storybook/ui": "5.0.0-rc.1",
+    "@storybook/addons": "5.0.0-rc.2",
+    "@storybook/channel-postmessage": "5.0.0-rc.2",
+    "@storybook/client-api": "5.0.0-rc.2",
+    "@storybook/client-logger": "5.0.0-rc.2",
+    "@storybook/core-events": "5.0.0-rc.2",
+    "@storybook/node-logger": "5.0.0-rc.2",
+    "@storybook/theming": "5.0.0-rc.2",
+    "@storybook/ui": "5.0.0-rc.2",
     "airbnb-js-shims": "^1 || ^2",
     "autoprefixer": "^9.4.7",
     "babel-plugin-add-react-displayname": "^0.0.5",
diff --git a/lib/node-logger/package.json b/lib/node-logger/package.json
index 5aca4204d75..c8f75c9f89f 100644
--- a/lib/node-logger/package.json
+++ b/lib/node-logger/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/node-logger",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/router/package.json b/lib/router/package.json
index c9620258419..664c6d1e8c6 100644
--- a/lib/router/package.json
+++ b/lib/router/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/router",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "description": "Core Storybook Router",
   "keywords": [
     "storybook"
@@ -20,7 +20,7 @@
   },
   "dependencies": {
     "@reach/router": "^1.2.1",
-    "@storybook/theming": "5.0.0-rc.1",
+    "@storybook/theming": "5.0.0-rc.2",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
     "qs": "^6.5.2"
diff --git a/lib/theming/package.json b/lib/theming/package.json
index 40515c4c8e5..ddcfc168928 100644
--- a/lib/theming/package.json
+++ b/lib/theming/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/theming",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "description": "Core Storybook Components",
   "keywords": [
     "storybook"
diff --git a/lib/ui/package.json b/lib/ui/package.json
index 8f0c2c1f850..077d6fcb05d 100644
--- a/lib/ui/package.json
+++ b/lib/ui/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/ui",
-  "version": "5.0.0-rc.1",
+  "version": "5.0.0-rc.2",
   "description": "Core Storybook UI",
   "keywords": [
     "storybook"
@@ -21,12 +21,12 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.1",
-    "@storybook/client-logger": "5.0.0-rc.1",
-    "@storybook/components": "5.0.0-rc.1",
-    "@storybook/core-events": "5.0.0-rc.1",
-    "@storybook/router": "5.0.0-rc.1",
-    "@storybook/theming": "5.0.0-rc.1",
+    "@storybook/addons": "5.0.0-rc.2",
+    "@storybook/client-logger": "5.0.0-rc.2",
+    "@storybook/components": "5.0.0-rc.2",
+    "@storybook/core-events": "5.0.0-rc.2",
+    "@storybook/router": "5.0.0-rc.2",
+    "@storybook/theming": "5.0.0-rc.2",
     "eventemitter3": "^3.1.0",
     "fast-deep-equal": "^2.0.1",
     "fuse.js": "^3.3.1",

From 6e256da7367df16f0bd625b122d13998a35d09df Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Tue, 19 Feb 2019 15:41:28 +0800
Subject: [PATCH 035/249] 5.0.0-rc.2 versions

---
 docs/versions.json | 1 +
 1 file changed, 1 insertion(+)
 create mode 100644 docs/versions.json

diff --git a/docs/versions.json b/docs/versions.json
new file mode 100644
index 00000000000..4e5d2a09c8d
--- /dev/null
+++ b/docs/versions.json
@@ -0,0 +1 @@
+{"next":{"version":"5.0.0-rc.2","info":{"plain":"### Features\n\n* UI: Allow collapsing active story and use separate expansion for filtered ([#5625](https://github.com/storybooks/storybook/pull/5625))\n* UI: Handle prerelease versions in version check ([#5641](https://github.com/storybooks/storybook/pull/5641))\n\n### Bug Fixes\n\n* Addon-a11y: Fix tab highlighting  ([#5646](https://github.com/storybooks/storybook/pull/5646))\n* Addon-jest: Fix event subscription ([#5644](https://github.com/storybooks/storybook/pull/5644))\n* UI: Handle old versions in version check ([#5638](https://github.com/storybooks/storybook/pull/5638))\n\n### Maintenance\n\n* UI: Fix some prop warnings ([#5635](https://github.com/storybooks/storybook/pull/5635))\n* UI: Use the correct props to start the tooltip open ([#5610](https://github.com/storybooks/storybook/pull/5610))"}}}
\ No newline at end of file

From 7f8bcf437a665705ce5ada4be36337e721943817 Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Wed, 13 Feb 2019 10:53:31 +0800
Subject: [PATCH 036/249] Merge pull request #5562 from
 storybooks/v5-style-refinements

V5 style refinements
---
 addons/a11y/src/components/Tabs.js            |    2 +-
 addons/actions/package.json                   |    1 +
 .../src/components/ActionLogger/style.js      |    3 +-
 addons/knobs/src/components/Panel.js          |    4 +-
 .../__tests__/__snapshots__/Panel.js.snap     |    8 +-
 .../knobs/src/components/types/Checkboxes.js  |   34 +-
 addons/knobs/src/components/types/Options.js  |    2 +
 addons/knobs/src/components/types/Radio.js    |   29 +-
 .../src/pages/configurations/theming/index.md |  282 ++-
 examples/official-storybook/config.js         |    4 +-
 .../addon-a11y.stories.storyshot              |    4 +-
 .../addon-actions.stories.storyshot           | 1908 ++---------------
 .../__snapshots__/storyshots.test.js.snap     | 1418 ++++++------
 lib/components/src/ActionBar/ActionBar.js     |    6 +-
 lib/components/src/Badge/Badge.js             |   14 +-
 .../__snapshots__/Badge.stories.storyshot     |    9 +-
 lib/components/src/Button/Button.js           |  373 ++--
 lib/components/src/Button/Button.stories.js   |   18 +-
 .../__snapshots__/Button.stories.storyshot    | 1483 +++----------
 lib/components/src/bar/bar.js                 |    6 +-
 lib/components/src/bar/button.js              |    2 +-
 lib/components/src/brand/StorybookLogo.js     |    2 +-
 .../src/brand/StorybookLogo.stories.js        |    8 +-
 .../form/__snapshots__/form.stories.storyshot |  375 +---
 lib/components/src/form/field/field.js        |    8 +-
 lib/components/src/form/input/input.js        |   24 +-
 lib/components/src/placeholder/placeholder.js |    2 +-
 .../src/placeholder/placeholder.stories.js    |    3 +-
 .../syntaxhighlighter.stories.storyshot       |    4 +-
 .../tabs/__snapshots__/tabs.stories.storyshot |   16 +-
 lib/components/src/tooltip/ListItem.js        |   13 +-
 lib/components/src/tooltip/Tooltip.js         |   29 +-
 lib/components/src/tooltip/TooltipLinkList.js |   12 +-
 .../__snapshots__/ListItem.stories.storyshot  |   83 +-
 .../__snapshots__/Tooltip.stories.storyshot   |   20 +-
 .../WithTooltip.stories.storyshot             |   69 +-
 lib/theming/package.json                      |    1 +
 lib/theming/src/base.ts                       |    4 +-
 lib/theming/src/create.ts                     |   61 +-
 lib/theming/src/themes/dark.ts                |   44 +-
 lib/theming/src/themes/light.ts               |    7 +-
 .../__snapshots__/layout.stories.storyshot    |    8 +-
 lib/ui/src/components/layout/container.js     |    4 +-
 .../__snapshots__/preview.stories.storyshot   |    2 +-
 lib/ui/src/components/preview/background.js   |    2 +-
 .../components/sidebar/NotificationItem.js    |    8 +-
 .../src/components/sidebar/SidebarHeading.js  |    7 +
 .../sidebar/SidebarHeading.stories.js         |   14 +-
 lib/ui/src/components/sidebar/SidebarItem.js  |   16 +-
 .../src/components/sidebar/SidebarSearch.js   |   16 +-
 .../sidebar/SidebarSearch.stories.js          |    2 +-
 .../components/sidebar/SidebarSubheading.js   |    6 +-
 .../SidebarSubheading.stories.storyshot       |    4 +-
 .../__snapshots__/about.stories.storyshot     |    4 +-
 54 files changed, 1767 insertions(+), 4721 deletions(-)

diff --git a/addons/a11y/src/components/Tabs.js b/addons/a11y/src/components/Tabs.js
index 0834a04e614..6dbc8fbbf26 100644
--- a/addons/a11y/src/components/Tabs.js
+++ b/addons/a11y/src/components/Tabs.js
@@ -11,7 +11,7 @@ const Container = styled.div({
 
 const List = styled.div(({ theme }) => ({
   boxShadow: `${theme.appBorderColor} 0 -1px 0 0 inset`,
-  background: '#f8f8fc',
+  background: 'rgba(0,0,0,.05)',
   flexWrap: 'wrap',
   display: 'flex',
 }));
diff --git a/addons/actions/package.json b/addons/actions/package.json
index 375fbb45890..1355071a786 100644
--- a/addons/actions/package.json
+++ b/addons/actions/package.json
@@ -29,6 +29,7 @@
     "global": "^4.3.2",
     "lodash": "^4.17.11",
     "make-error": "^1.3.5",
+    "polished": "^2.3.3",
     "prop-types": "^15.6.2",
     "react": "^16.8.1",
     "react-inspector": "^2.3.0",
diff --git a/addons/actions/src/components/ActionLogger/style.js b/addons/actions/src/components/ActionLogger/style.js
index 86fe777b3e7..0aab9cbba91 100644
--- a/addons/actions/src/components/ActionLogger/style.js
+++ b/addons/actions/src/components/ActionLogger/style.js
@@ -1,4 +1,5 @@
 import { styled } from '@storybook/theming';
+import { opacify } from 'polished';
 
 export const Actions = styled.pre({
   flex: 1,
@@ -18,7 +19,7 @@ export const Action = styled.div({
 });
 
 export const Counter = styled.div(({ theme }) => ({
-  backgroundColor: 'rgba(0, 0, 0, 0.5)',
+  backgroundColor: opacify(0.5, theme.appBorderColor),
   color: theme.color.inverseText,
   fontSize: theme.typography.size.s1,
   fontWeight: theme.typography.weight.bold,
diff --git a/addons/knobs/src/components/Panel.js b/addons/knobs/src/components/Panel.js
index 8685083912c..ff311c28a27 100644
--- a/addons/knobs/src/components/Panel.js
+++ b/addons/knobs/src/components/Panel.js
@@ -177,10 +177,10 @@ export default class KnobPanel extends PureComponent {
             <Link
               href="https://github.com/storybooks/storybook/tree/master/addons/knobs"
               target="_blank"
+              withArrow
             >
               dynamically interact with components
-            </Link>{' '}
-            using knobs.
+            </Link>
           </Fragment>
         </Placeholder>
       );
diff --git a/addons/knobs/src/components/__tests__/__snapshots__/Panel.js.snap b/addons/knobs/src/components/__tests__/__snapshots__/Panel.js.snap
index df555bca26b..d6b39c95eb6 100644
--- a/addons/knobs/src/components/__tests__/__snapshots__/Panel.js.snap
+++ b/addons/knobs/src/components/__tests__/__snapshots__/Panel.js.snap
@@ -40,8 +40,8 @@ Array [
 
 .emotion-0 {
   min-width: 100px;
-  min-height: 32px;
-  margin-right: 16px;
+  font-weight: 700;
+  margin-right: 15px;
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -135,8 +135,8 @@ Array [
 
 .emotion-0 {
   min-width: 100px;
-  min-height: 32px;
-  margin-right: 16px;
+  font-weight: 700;
+  margin-right: 15px;
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
diff --git a/addons/knobs/src/components/types/Checkboxes.js b/addons/knobs/src/components/types/Checkboxes.js
index 78539711345..a15cf1d6412 100644
--- a/addons/knobs/src/components/types/Checkboxes.js
+++ b/addons/knobs/src/components/types/Checkboxes.js
@@ -2,6 +2,19 @@ import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 import { styled } from '@storybook/theming';
 
+const CheckboxesWrapper = styled.div(({ isInline }) =>
+  isInline
+    ? {
+        display: 'flex',
+        flexWrap: 'wrap',
+        alignItems: 'center',
+        '> * + *': {
+          marginLeft: 10,
+        },
+      }
+    : {}
+);
+
 const CheckboxFieldset = styled.fieldset({
   border: 0,
   padding: 0,
@@ -9,24 +22,11 @@ const CheckboxFieldset = styled.fieldset({
 });
 
 const CheckboxLabel = styled.label({
-  fontSize: 11,
-  padding: '5px',
+  padding: '3px 0 3px 5px',
+  lineHeight: '18px',
+  display: 'inline-block',
 });
 
-const flex = ({ isInline }) => {
-  if (isInline) {
-    return {
-      display: 'flex',
-      flexWrap: 'wrap',
-      alignItems: 'center',
-      height: '100%',
-    };
-  }
-  return null;
-};
-
-const FlexWrapper = styled.div(flex);
-
 class CheckboxesType extends Component {
   constructor(props) {
     super(props);
@@ -82,7 +82,7 @@ class CheckboxesType extends Component {
 
     return (
       <CheckboxFieldset>
-        <FlexWrapper isInline={isInline}>{this.renderCheckboxList(knob)}</FlexWrapper>
+        <CheckboxesWrapper isInline={isInline}>{this.renderCheckboxList(knob)}</CheckboxesWrapper>
       </CheckboxFieldset>
     );
   }
diff --git a/addons/knobs/src/components/types/Options.js b/addons/knobs/src/components/types/Options.js
index aa4d6c2e2c4..8580f72d7d4 100644
--- a/addons/knobs/src/components/types/Options.js
+++ b/addons/knobs/src/components/types/Options.js
@@ -6,6 +6,8 @@ import { styled } from '@storybook/theming';
 import RadiosType from './Radio';
 import CheckboxesType from './Checkboxes';
 
+// TODO: Apply the Storybook theme to react-select
+
 const OptionsSelect = styled(ReactSelect)({
   width: '100%',
   maxWidth: '300px',
diff --git a/addons/knobs/src/components/types/Radio.js b/addons/knobs/src/components/types/Radio.js
index 7b21d25a7dc..f4163967e2e 100644
--- a/addons/knobs/src/components/types/Radio.js
+++ b/addons/knobs/src/components/types/Radio.js
@@ -2,22 +2,23 @@ import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 import { styled } from '@storybook/theming';
 
-const flex = ({ isInline }) => {
-  if (isInline) {
-    return {
-      display: 'flex',
-      flexWrap: 'wrap',
-      alignItems: 'center',
-    };
-  }
-  return null;
-};
-
-const RadiosWrapper = styled.div(flex);
+const RadiosWrapper = styled.div(({ isInline }) =>
+  isInline
+    ? {
+        display: 'flex',
+        flexWrap: 'wrap',
+        alignItems: 'center',
+        '> * + *': {
+          marginLeft: 10,
+        },
+      }
+    : {}
+);
 
 const RadioLabel = styled.label({
-  fontSize: 11,
-  padding: '5px',
+  padding: '3px 0 3px 5px',
+  lineHeight: '18px',
+  display: 'inline-block',
 });
 
 class RadiosType extends Component {
diff --git a/docs/src/pages/configurations/theming/index.md b/docs/src/pages/configurations/theming/index.md
index 745e7acbeab..b69383d2f59 100644
--- a/docs/src/pages/configurations/theming/index.md
+++ b/docs/src/pages/configurations/theming/index.md
@@ -3,7 +3,7 @@ id: 'theming'
 title: 'Theming Storybook'
 ---
 
-Storybook's manager UI is theme-able! You can change theme variables using [addon-options](https://github.com/storybooks/storybook/tree/master/addons/options).
+Storybook is theme-able! You can change theme variables using [addon-options](https://github.com/storybooks/storybook/tree/master/addons/options).
 
 ## Set a theme
 
@@ -50,144 +50,196 @@ addParameters({
 });
 ```
 
-## Theme variables
+## Create a theme quickstart
+
+The easiest way to customize Storybook to generate a new theme using `create()`. This function includes shorthands for the most common theme variables. Here's how to use it.
+
+First create a new file in `.storybook` called `yourTheme.js`.
+
+Next paste the code below and tweak the variables.
 
 ```
+import { create } from '@storybook/theming';
 
-// Storybook-specific color palette
-colorPrimary: primary color, // Storybook pink
-colorSecondary: secondary color, // Blue
+export default create({
+  // Is this a 'light' or 'dark' theme?
+  base: 'light',
 
-// UI
-appBg: background.app,
-appBorderColor: color.border,
-appBorderRadius: 4,
+  // Color palette
+  colorPrimary: 'red', // primary color
+  colorSecondary: 'pink', // secondary color
 
-// Fonts
-fontBase: typography.fonts.base,
-fontCode: typography.fonts.mono,
+  // UI
+  appBg: 'papayawhip',
+  appContentBg: 'white',
+  appBorderColor: 'rgba(0,0,0,.1)',
+  appBorderRadius: 4,
 
-// Text colors
-textColor: color.darkest,
-textInverseColor: color.lightest,
+  // Fonts
+  fontBase: '"Helvetica", Arial, sans-serif',
+  fontCode: 'Monaco, monospace',
 
-// Toolbar default and active colors
-barTextColor: color.mediumdark,
-barSelectedColor: color.secondary,
-barBgColor: color.lightest,
-
-// Form colors
-inputBg: color.lightest,
-inputBorder: color.border,
-inputTextColor: color.darkest,
-inputBorderRadius: 4,
-
-// Brand logo/text
-brand: null,
+  // Text colors
+  textColor: '#FFFFFF',
+  textInverseColor: '#333333',
 
+  // Toolbar default and active colors
+  barTextColor: '#999999',
+  barSelectedColor: 'blue',
+  barBg: 'white',
 
+  // Form colors
+  inputBg: 'white',
+  inputBorder: 'rgba(0,0,0,.1)',
+  inputTextColor: '#333333',
+  inputBorderRadius: 4,
 
+  // Brand logo/text
+  brand: `<svg .../>`,
+});
 ```
 
-### Deep theming components
-
-All options above are single key options, in other words, they are variables, and their usage is fixed.
-
-We will extend the theming ability in the future and possibly add more deep theming ability.
-Right now we allow to deep theme: `stories nav panel`. Below are the varaiables that are used to deep theme `stories nav panel`.
-
-storiesNav: deep theme for `stories nav`
+Finally, import your theme into `.storybook/config` and add it to your Storybook parameters.
 
 ```
-storiesNav: {
-  backgroundColor: 'aqua',
-}
-```
+import {yourTheme} from './yourTheme';
 
-brand: deep theme for brand including `brand name` and `shortcuts`
-
-```
-brand: {
-  background: 'url("/path/to/logo.svg")',
-}
-```
-
-brandLink: deep theme for only `brand name`
-
-```
-brandLink: {
-  border: 'none'
-}
-```
-
-filter: deep theme for `stories filter section`
-
-```
-filter: {
-  backgroundColor: 'red',
-}
-```
-
-treeHeader: deep theme for `tree header`
-
-```
-treeHeader: {
-  color: 'blue',
-}
-```
-
-treeMenuHeader: deep theme for `tree menu header` of each menu
-
-```
-treeMenuHeader: {
-  color: 'aqua',
-}
-```
-
-menuLink: deep theme for `menu link` of each story
-
-```
-menuLink: {
-  color: 'black',
-}
-```
-
-activeMenuLink: deep theme for `active menu link` for the active story
-
-```
-activeMenuLink: {
-  fontWeight: 'light',
-}
-```
-
-treeArrow: deep theme for `tree arrow`. This accepts an object which receives `height`, `width`, `base` and `wrapper`
-
-```
-treeArrow: {
-  height: 5,
-  width: 5,
-  base: {
-    fontSize: '12px'
+addParameters({
+  options: {
+    theme: yourTheme,
   },
-  wrapper: {
-    backgroundColor: 'white'
-  }
-}
+});
 ```
 
-The styles provided here support everything [emotion](https://emotion.sh/) does. So that included things like nested selectors!
+## Addons and theme creation
 
-## Adding more theme variables for addons
+Some addons require specific theme variables that a Storybook user must add. If you share your theme with the community make sure to support the official and other popular addons so your users have a consistent experience.
 
-If addons have a need for specific theme variables, the user has to add them.
-We advise addons to reuse the variables listed above as much as possible.
-
-Addon actions uses [react-inspector](https://github.com/xyc/react-inspector/blob/master/src/styles/themes/chromeLight.js) which has themes of it's own. If you want to theme it (our themes do) you can add needs the following additional theme variables:
+For example, the popular Actions addon uses [react-inspector](https://github.com/xyc/react-inspector/blob/master/src/styles/themes/chromeLight.js) which has themes of it's own. Supply additional theme variables to style it like so:
 
 ```
 addonActionsTheme: {
   ...chromeLight,
-  BASE_FONT_FAMILY: monoFonts.fontFamily,
+  BASE_FONT_FAMILY: typography.fonts.mono,
   BASE_BACKGROUND_COLOR: 'transparent',
 }
 ```
+
+### Using the theme for addon authors
+
+For a native Storybook experience, we encourage addon authors to reuse the theme variables above. The theming engine relies on [emotion](https://emotion.sh/), a CSS-in-JS library.
+
+```
+import { styled } from '@storybook/theming';
+```
+
+Use the theme variables in object notation:
+
+```
+const Component = styled.div(
+  ({ theme }) => ({
+    background: theme.background.app,
+    width: 0,
+  }),
+);
+```
+
+Or with styled-components template literals:
+
+```
+const Component = styled.div`
+  background: `${props => props.theme.background.app}`
+  width: 0;
+`;
+```
+
+### Advanced theming
+
+For further customization adjust theme variables manually.
+
+This is the master list:
+
+```
+base: 'light' | 'dark',
+color: {
+  primary
+  secondary
+  tertiary
+  ancillary
+
+  orange
+  gold
+  green
+  seafoam
+  purple
+  ultraviolet
+
+  lightest
+  lighter
+  light
+  mediumlight
+  medium
+  mediumdark
+  dark
+  darker
+  darkest
+
+  border
+
+  positive
+  negative
+  warning
+
+  defaultText
+  inverseText
+}
+background: {
+  app
+  content
+  hoverable
+
+  positive
+  negative
+  warning
+}
+typography: {
+  fonts: {
+    base
+    mono
+  }
+  weight: {
+    regular
+    bold
+    black
+  }
+  size: {
+    s1
+    s2
+    s3
+    m1
+    m2
+    m3
+    l1
+    l2
+    l3
+    code
+  }
+  input: {
+    border
+    background
+    color
+    borderRadius
+  };
+
+  layoutMargin
+  appBorderColor
+  appBorderRadius
+
+  barTextColor
+  barSelectedColor
+  barBg
+
+  brand
+}
+TODO finish this, what's the best way to document?
+```
diff --git a/examples/official-storybook/config.js b/examples/official-storybook/config.js
index be51e97003b..fcf28e6631e 100644
--- a/examples/official-storybook/config.js
+++ b/examples/official-storybook/config.js
@@ -1,6 +1,6 @@
 import React from 'react';
 import { storiesOf, configure, addDecorator, addParameters } from '@storybook/react';
-import { Global, ThemeProvider, themes, createReset } from '@storybook/theming';
+import { Global, ThemeProvider, themes, createGlobal } from '@storybook/theming';
 
 import { INITIAL_VIEWPORTS } from '@storybook/addon-viewport';
 import { withCssResources } from '@storybook/addon-cssresources';
@@ -35,7 +35,7 @@ addDecorator(withNotes);
 
 addDecorator(fn => (
   <ThemeProvider theme={themes.normal}>
-    <Global styles={createReset} />
+    <Global styles={createGlobal} />
     {fn()}
   </ThemeProvider>
 ));
diff --git a/examples/official-storybook/stories/__snapshots__/addon-a11y.stories.storyshot b/examples/official-storybook/stories/__snapshots__/addon-a11y.stories.storyshot
index 4de68f0ce6c..b8fb54e56eb 100644
--- a/examples/official-storybook/stories/__snapshots__/addon-a11y.stories.storyshot
+++ b/examples/official-storybook/stories/__snapshots__/addon-a11y.stories.storyshot
@@ -97,8 +97,8 @@ exports[`Storyshots Addons|A11y/Form With label 1`] = `
 
 .emotion-0 {
   min-width: 100px;
-  min-height: 32px;
-  margin-right: 16px;
+  font-weight: 700;
+  margin-right: 15px;
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
diff --git a/examples/official-storybook/stories/__snapshots__/addon-actions.stories.storyshot b/examples/official-storybook/stories/__snapshots__/addon-actions.stories.storyshot
index 7c798fc6595..8b7cfba5f64 100644
--- a/examples/official-storybook/stories/__snapshots__/addon-actions.stories.storyshot
+++ b/examples/official-storybook/stories/__snapshots__/addon-actions.stories.storyshot
@@ -30,16 +30,11 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -48,38 +43,6 @@ Array [
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -92,23 +55,19 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -150,16 +109,11 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -168,38 +122,6 @@ Array [
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -212,23 +134,19 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -270,16 +188,11 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -288,38 +201,6 @@ Array [
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -332,23 +213,19 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -390,16 +267,11 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -408,38 +280,6 @@ Array [
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -452,23 +292,19 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -510,16 +346,11 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -528,38 +359,6 @@ Array [
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -572,23 +371,19 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -630,16 +425,11 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -648,38 +438,6 @@ Array [
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -692,23 +450,19 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -750,16 +504,11 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -768,38 +517,6 @@ Array [
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -812,23 +529,19 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -870,16 +583,11 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -888,38 +596,6 @@ Array [
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -932,23 +608,19 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -990,16 +662,11 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -1008,38 +675,6 @@ Array [
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -1052,23 +687,19 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -1110,16 +741,11 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -1128,38 +754,6 @@ Array [
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -1172,23 +766,19 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -1230,16 +820,11 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -1248,38 +833,6 @@ Array [
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -1292,23 +845,19 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -1350,16 +899,11 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -1368,38 +912,6 @@ Array [
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -1412,23 +924,19 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -1470,16 +978,11 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -1488,38 +991,6 @@ Array [
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -1532,23 +1003,19 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -1590,16 +1057,11 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -1608,38 +1070,6 @@ Array [
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -1652,23 +1082,19 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -1710,16 +1136,11 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -1728,38 +1149,6 @@ Array [
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -1772,23 +1161,19 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -1830,16 +1215,11 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -1848,38 +1228,6 @@ Array [
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -1892,23 +1240,19 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -1950,16 +1294,11 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -1968,38 +1307,6 @@ Array [
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -2012,23 +1319,19 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -2070,16 +1373,11 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -2088,38 +1386,6 @@ Array [
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -2132,23 +1398,19 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -2190,16 +1452,11 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -2208,38 +1465,6 @@ Array [
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -2252,23 +1477,19 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -2310,16 +1531,11 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -2328,38 +1544,6 @@ Array [
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -2372,23 +1556,19 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -2434,16 +1614,11 @@ exports[`Storyshots Addons|Actions Basic example 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -2452,38 +1627,6 @@ exports[`Storyshots Addons|Actions Basic example 1`] = `
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -2496,23 +1639,19 @@ exports[`Storyshots Addons|Actions Basic example 1`] = `
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -2557,16 +1696,11 @@ exports[`Storyshots Addons|Actions Circular Payload 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -2575,38 +1709,6 @@ exports[`Storyshots Addons|Actions Circular Payload 1`] = `
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -2619,23 +1721,19 @@ exports[`Storyshots Addons|Actions Circular Payload 1`] = `
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -2680,16 +1778,11 @@ exports[`Storyshots Addons|Actions Decorated action + config 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -2698,38 +1791,6 @@ exports[`Storyshots Addons|Actions Decorated action + config 1`] = `
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -2742,23 +1803,19 @@ exports[`Storyshots Addons|Actions Decorated action + config 1`] = `
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -2803,16 +1860,11 @@ exports[`Storyshots Addons|Actions Decorated action 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -2821,38 +1873,6 @@ exports[`Storyshots Addons|Actions Decorated action 1`] = `
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -2865,23 +1885,19 @@ exports[`Storyshots Addons|Actions Decorated action 1`] = `
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -2926,16 +1942,11 @@ exports[`Storyshots Addons|Actions Decorated actions + config 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -2944,38 +1955,6 @@ exports[`Storyshots Addons|Actions Decorated actions + config 1`] = `
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -2988,23 +1967,19 @@ exports[`Storyshots Addons|Actions Decorated actions + config 1`] = `
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -3049,16 +2024,11 @@ exports[`Storyshots Addons|Actions Decorated actions 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -3067,38 +2037,6 @@ exports[`Storyshots Addons|Actions Decorated actions 1`] = `
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -3111,23 +2049,19 @@ exports[`Storyshots Addons|Actions Decorated actions 1`] = `
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -3173,16 +2107,11 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -3191,38 +2120,6 @@ Array [
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -3235,23 +2132,19 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -3293,16 +2186,11 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -3311,38 +2199,6 @@ Array [
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -3355,23 +2211,19 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -3417,16 +2269,11 @@ exports[`Storyshots Addons|Actions Multiple actions + config 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -3435,38 +2282,6 @@ exports[`Storyshots Addons|Actions Multiple actions + config 1`] = `
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -3479,23 +2294,19 @@ exports[`Storyshots Addons|Actions Multiple actions + config 1`] = `
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -3540,16 +2351,11 @@ exports[`Storyshots Addons|Actions Multiple actions 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -3558,38 +2364,6 @@ exports[`Storyshots Addons|Actions Multiple actions 1`] = `
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -3602,23 +2376,19 @@ exports[`Storyshots Addons|Actions Multiple actions 1`] = `
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -3663,16 +2433,11 @@ exports[`Storyshots Addons|Actions Multiple actions as object 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -3681,38 +2446,6 @@ exports[`Storyshots Addons|Actions Multiple actions as object 1`] = `
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -3725,23 +2458,19 @@ exports[`Storyshots Addons|Actions Multiple actions as object 1`] = `
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -3786,16 +2515,11 @@ exports[`Storyshots Addons|Actions Multiple actions, object + config 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -3804,38 +2528,6 @@ exports[`Storyshots Addons|Actions Multiple actions, object + config 1`] = `
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -3848,23 +2540,19 @@ exports[`Storyshots Addons|Actions Multiple actions, object + config 1`] = `
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -3913,16 +2601,11 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -3931,38 +2614,6 @@ Array [
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -3975,23 +2626,19 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -4037,16 +2684,11 @@ exports[`Storyshots Addons|Actions Reserved keyword as name 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -4055,38 +2697,6 @@ exports[`Storyshots Addons|Actions Reserved keyword as name 1`] = `
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -4099,23 +2709,19 @@ exports[`Storyshots Addons|Actions Reserved keyword as name 1`] = `
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -4160,16 +2766,11 @@ exports[`Storyshots Addons|Actions configureActionsDepth 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -4178,38 +2779,6 @@ exports[`Storyshots Addons|Actions configureActionsDepth 1`] = `
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -4222,23 +2791,19 @@ exports[`Storyshots Addons|Actions configureActionsDepth 1`] = `
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -4283,16 +2848,11 @@ exports[`Storyshots Addons|Actions.deprecated Decorated Action 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -4301,38 +2861,6 @@ exports[`Storyshots Addons|Actions.deprecated Decorated Action 1`] = `
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -4345,23 +2873,19 @@ exports[`Storyshots Addons|Actions.deprecated Decorated Action 1`] = `
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
diff --git a/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap b/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
index 40b864302a7..f3f40f8d412 100644
--- a/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
+++ b/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
@@ -10,6 +10,7 @@ exports[`Storyshots Basics|ActionBar manyItems 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
+  background: #FFFFFF;
 }
 
 .emotion-0 {
@@ -24,7 +25,8 @@ exports[`Storyshots Basics|ActionBar manyItems 1`] = `
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
-  color: #666666;
+  color: #333333;
+  background: #FFFFFF;
   font-size: 12px;
   line-height: 16px;
   font-weight: 700;
@@ -57,6 +59,7 @@ exports[`Storyshots Basics|ActionBar manyItems 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
+  background: #FFFFFF;
 }
 
 .emotion-0 {
@@ -71,7 +74,8 @@ exports[`Storyshots Basics|ActionBar manyItems 1`] = `
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
-  color: #666666;
+  color: #333333;
+  background: #FFFFFF;
   font-size: 12px;
   line-height: 16px;
   font-weight: 700;
@@ -132,6 +136,7 @@ exports[`Storyshots Basics|ActionBar singleItem 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
+  background: #FFFFFF;
 }
 
 .emotion-0 {
@@ -146,7 +151,8 @@ exports[`Storyshots Basics|ActionBar singleItem 1`] = `
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
-  color: #666666;
+  color: #333333;
+  background: #FFFFFF;
   font-size: 12px;
   line-height: 16px;
   font-weight: 700;
@@ -179,6 +185,7 @@ exports[`Storyshots Basics|ActionBar singleItem 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
+  background: #FFFFFF;
 }
 
 .emotion-0 {
@@ -193,7 +200,8 @@ exports[`Storyshots Basics|ActionBar singleItem 1`] = `
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
-  color: #666666;
+  color: #333333;
+  background: #FFFFFF;
   font-size: 12px;
   line-height: 16px;
   font-weight: 700;
@@ -232,6 +240,50 @@ exports[`Storyshots Basics|ActionBar singleItem 1`] = `
 </div>
 `;
 
+exports[`Storyshots Basics|Brand/StorybookLogo normal 1`] = `
+<svg
+  height="40px"
+  title="Storybook"
+  viewBox="0 0 200 40"
+  width="200px"
+>
+  <defs>
+    <path
+      d="M1.2 36.9L0 3.9c0-1.1.8-2 1.9-2.1l28-1.8a2 2 0 0 1 2.2 1.9 2 2 0 0 1 0 .1v36a2 2 0 0 1-2 2 2 2 0 0 1-.1 0L3.2 38.8a2 2 0 0 1-2-2z"
+      id="a"
+    />
+  </defs>
+  <g
+    fill="none"
+    fill-rule="evenodd"
+  >
+    <path
+      d="M53.3 31.7c-1.7 0-3.4-.3-5-.7-1.5-.5-2.8-1.1-3.9-2l1.6-3.5c2.2 1.5 4.6 2.3 7.3 2.3 1.5 0 2.5-.2 3.3-.7.7-.5 1.1-1 1.1-1.9 0-.7-.3-1.3-1-1.7s-2-.8-3.7-1.2c-2-.4-3.6-.9-4.8-1.5-1.1-.5-2-1.2-2.6-2-.5-1-.8-2-.8-3.2 0-1.4.4-2.6 1.2-3.6.7-1.1 1.8-2 3.2-2.6 1.3-.6 2.9-.9 4.7-.9 1.6 0 3.1.3 4.6.7 1.5.5 2.7 1.1 3.5 2l-1.6 3.5c-2-1.5-4.2-2.3-6.5-2.3-1.3 0-2.3.2-3 .8-.8.5-1.2 1.1-1.2 2 0 .5.2 1 .5 1.3.2.3.7.6 1.4.9l2.9.8c2.9.6 5 1.4 6.2 2.4a5 5 0 0 1 2 4.2 6 6 0 0 1-2.5 5c-1.7 1.2-4 1.9-7 1.9zm21-3.6l1.4-.1-.2 3.5-1.9.1c-2.4 0-4.1-.5-5.2-1.5-1.1-1-1.6-2.7-1.6-4.8v-6h-3v-3.6h3V11h4.8v4.6h4v3.6h-4v6c0 1.8.9 2.8 2.6 2.8zm11.1 3.5c-1.6 0-3-.3-4.3-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.3-1 1.7 0 3.2.3 4.4 1a7 7 0 0 1 3 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.4 1zm0-3.6c2.4 0 3.6-1.6 3.6-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.6-1c-2.3 0-3.5 1.4-3.5 4.4 0 3 1.2 4.6 3.5 4.6zm21.7-8.8l-2.7.3c-1.3.2-2.3.5-2.8 1.2-.6.6-.9 1.4-.9 2.5v8.2H96V15.7h4.6v2.6c.8-1.8 2.5-2.8 5-3h1.3l.3 4zm14-3.5h4.8L116.4 37h-4.9l3-6.6-6.4-14.8h5l4 10 4-10zm16-.4c1.4 0 2.6.3 3.6 1 1 .6 1.9 1.6 2.5 2.8.6 1.2.9 2.7.9 4.3 0 1.6-.3 3-1 4.3a6.9 6.9 0 0 1-2.4 2.9c-1 .7-2.2 1-3.6 1-1 0-2-.2-3-.7-.8-.4-1.5-1-2-1.9v2.4h-4.7V8.8h4.8v9c.5-.8 1.2-1.4 2-1.9.9-.4 1.8-.6 3-.6zM135.7 28c1.1 0 2-.4 2.6-1.2.6-.8 1-2 1-3.4 0-1.5-.4-2.5-1-3.3s-1.5-1.1-2.6-1.1-2 .3-2.6 1.1c-.6.8-1 2-1 3.3 0 1.5.4 2.6 1 3.4.6.8 1.5 1.2 2.6 1.2zm18.9 3.6c-1.7 0-3.2-.3-4.4-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.4-1 1.6 0 3 .3 4.3 1a7 7 0 0 1 3 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.3 1zm0-3.6c2.3 0 3.5-1.6 3.5-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.5-1c-2.4 0-3.6 1.4-3.6 4.4 0 3 1.2 4.6 3.6 4.6zm18 3.6c-1.7 0-3.2-.3-4.4-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.4-1 1.6 0 3 .3 4.4 1a7 7 0 0 1 2.9 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.3 1zm0-3.6c2.3 0 3.5-1.6 3.5-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.5-1c-2.4 0-3.6 1.4-3.6 4.4 0 3 1.2 4.6 3.6 4.6zm27.4 3.4h-6l-6-7v7h-4.8V8.8h4.9v13.6l5.8-6.7h5.7l-6.6 7.5 7 8.2z"
+      fill="currentColor"
+    />
+    <mask
+      fill="#fff"
+      id="b"
+    >
+      <use
+        href="#a"
+      />
+    </mask>
+    <use
+      fill="#FF4785"
+      fill-rule="nonzero"
+      href="#a"
+    />
+    <path
+      d="M23.7 5L24 .2l3.9-.3.1 4.8a.3.3 0 0 1-.5.2L26 3.8l-1.7 1.4a.3.3 0 0 1-.5-.3zm-5 10c0 .9 5.3.5 6 0 0-5.4-2.8-8.2-8-8.2-5.3 0-8.2 2.8-8.2 7.1 0 7.4 10 7.6 10 11.6 0 1.2-.5 1.9-1.8 1.9-1.6 0-2.2-.9-2.1-3.6 0-.6-6.1-.8-6.3 0-.5 6.7 3.7 8.6 8.5 8.6 4.6 0 8.3-2.5 8.3-7 0-7.9-10.2-7.7-10.2-11.6 0-1.6 1.2-1.8 2-1.8.6 0 2 0 1.9 3z"
+      fill="#FFF"
+      fill-rule="nonzero"
+      mask="url(#b)"
+    />
+  </g>
+</svg>
+`;
+
 exports[`Storyshots Basics|DocumentFormatting sampleDocument 1`] = `
 .emotion-0 {
   font-size: 14px;
@@ -1643,7 +1695,7 @@ exports[`Storyshots Basics|Placeholder singleChild 1`] = `
 .emotion-1 {
   padding: 30px;
   text-align: center;
-  color: #666666;
+  color: #333333;
   font-size: 13px;
 }
 
@@ -1654,7 +1706,7 @@ exports[`Storyshots Basics|Placeholder singleChild 1`] = `
 .emotion-1 {
   padding: 30px;
   text-align: center;
-  color: #666666;
+  color: #333333;
   font-size: 13px;
 }
 
@@ -1674,10 +1726,10 @@ exports[`Storyshots Basics|Placeholder singleChild 1`] = `
 `;
 
 exports[`Storyshots Basics|Placeholder twoChildren 1`] = `
-.emotion-2 {
+.emotion-4 {
   padding: 30px;
   text-align: center;
-  color: #666666;
+  color: #333333;
   font-size: 13px;
 }
 
@@ -1686,9 +1738,57 @@ exports[`Storyshots Basics|Placeholder twoChildren 1`] = `
 }
 
 .emotion-2 {
+  display: inline-block;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: #1EA7FD;
+}
+
+.emotion-2 svg path {
+  fill: #1EA7FD;
+}
+
+.emotion-2:hover,
+.emotion-2:focus {
+  cursor: pointer;
+  -webkit-transform: translate3d(0,-1px,0);
+  -ms-transform: translate3d(0,-1px,0);
+  transform: translate3d(0,-1px,0);
+  color: #0297f5;
+}
+
+.emotion-2:hover svg path,
+.emotion-2:focus svg path {
+  fill: #0297f5;
+}
+
+.emotion-2:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  color: #028ee6;
+}
+
+.emotion-2:active svg path {
+  fill: #028ee6;
+}
+
+.emotion-2 svg {
+  display: inline-block;
+  height: 1em;
+  width: 1em;
+  vertical-align: text-top;
+  position: relative;
+  bottom: -0.125em;
+  margin-right: 0.4em;
+}
+
+.emotion-4 {
   padding: 30px;
   text-align: center;
-  color: #666666;
+  color: #333333;
   font-size: 13px;
 }
 
@@ -1696,8 +1796,56 @@ exports[`Storyshots Basics|Placeholder twoChildren 1`] = `
   font-weight: 700;
 }
 
+.emotion-2 {
+  display: inline-block;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: #1EA7FD;
+}
+
+.emotion-2 svg path {
+  fill: #1EA7FD;
+}
+
+.emotion-2:hover,
+.emotion-2:focus {
+  cursor: pointer;
+  -webkit-transform: translate3d(0,-1px,0);
+  -ms-transform: translate3d(0,-1px,0);
+  transform: translate3d(0,-1px,0);
+  color: #0297f5;
+}
+
+.emotion-2:hover svg path,
+.emotion-2:focus svg path {
+  fill: #0297f5;
+}
+
+.emotion-2:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  color: #028ee6;
+}
+
+.emotion-2:active svg path {
+  fill: #028ee6;
+}
+
+.emotion-2 svg {
+  display: inline-block;
+  height: 1em;
+  width: 1em;
+  vertical-align: text-top;
+  position: relative;
+  bottom: -0.125em;
+  margin-right: 0.4em;
+}
+
 <div
-  class="emotion-2"
+  class="emotion-4"
 >
   <div
     class="emotion-0"
@@ -1705,13 +1853,18 @@ exports[`Storyshots Basics|Placeholder twoChildren 1`] = `
     This has two children, the first bold
   </div>
   <div
-    class="emotion-1"
+    class="emotion-3"
   >
     The second normal weight. Here's a 
     <a
+      class="emotion-2"
       href="https://storybook.js.org"
     >
-      link
+      <span
+        class="emotion-1"
+      >
+        link
+      </span>
     </a>
   </div>
 </div>
@@ -1746,43 +1899,6 @@ exports[`Storyshots Core|Events Force re-render 1`] = `
   font-size: 13px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
 }
 
 .emotion-0 svg {
@@ -1796,6 +1912,10 @@ exports[`Storyshots Core|Events Force re-render 1`] = `
   pointer-events: none;
 }
 
+.emotion-0 svg path {
+  fill: currentColor;
+}
+
 .emotion-0 {
   border: 0;
   border-radius: 3em;
@@ -1824,43 +1944,6 @@ exports[`Storyshots Core|Events Force re-render 1`] = `
   font-size: 13px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
 }
 
 .emotion-0 svg {
@@ -1874,6 +1957,10 @@ exports[`Storyshots Core|Events Force re-render 1`] = `
   pointer-events: none;
 }
 
+.emotion-0 svg path {
+  fill: currentColor;
+}
+
 <button
   class="emotion-0"
 >
@@ -2067,9 +2154,9 @@ exports[`Storyshots UI|Notifications/NotificationItem longText 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 16px;
-  background-color: rgba(50,53,71,0.97);
   box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
   color: #FFFFFF;
+  background-color: rgba(0,0,0,0.95);
   -webkit-text-decoration: none;
   text-decoration: none;
 }
@@ -2081,9 +2168,9 @@ exports[`Storyshots UI|Notifications/NotificationItem longText 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 16px;
-  background-color: rgba(50,53,71,0.97);
   box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
   color: #FFFFFF;
+  background-color: rgba(0,0,0,0.95);
   -webkit-text-decoration: none;
   text-decoration: none;
 }
@@ -2111,9 +2198,9 @@ exports[`Storyshots UI|Notifications/NotificationItem simple 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 16px;
-  background-color: rgba(50,53,71,0.97);
   box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
   color: #FFFFFF;
+  background-color: rgba(0,0,0,0.95);
   -webkit-text-decoration: none;
   text-decoration: none;
 }
@@ -2125,9 +2212,9 @@ exports[`Storyshots UI|Notifications/NotificationItem simple 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 16px;
-  background-color: rgba(50,53,71,0.97);
   box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
   color: #FFFFFF;
+  background-color: rgba(0,0,0,0.95);
   -webkit-text-decoration: none;
   text-decoration: none;
 }
@@ -2155,9 +2242,9 @@ exports[`Storyshots UI|Notifications/NotificationItem withLink 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 16px;
-  background-color: rgba(50,53,71,0.97);
   box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
   color: #FFFFFF;
+  background-color: rgba(0,0,0,0.95);
   -webkit-text-decoration: none;
   text-decoration: none;
 }
@@ -2169,9 +2256,9 @@ exports[`Storyshots UI|Notifications/NotificationItem withLink 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 16px;
-  background-color: rgba(50,53,71,0.97);
   box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
   color: #FFFFFF;
+  background-color: rgba(0,0,0,0.95);
   -webkit-text-decoration: none;
   text-decoration: none;
 }
@@ -2200,9 +2287,9 @@ exports[`Storyshots UI|Notifications/NotificationList all 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 16px;
-  background-color: rgba(50,53,71,0.97);
   box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
   color: #FFFFFF;
+  background-color: rgba(0,0,0,0.95);
   -webkit-text-decoration: none;
   text-decoration: none;
 }
@@ -2222,9 +2309,9 @@ exports[`Storyshots UI|Notifications/NotificationList all 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 16px;
-  background-color: rgba(50,53,71,0.97);
   box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
   color: #FFFFFF;
+  background-color: rgba(0,0,0,0.95);
   -webkit-text-decoration: none;
   text-decoration: none;
 }
@@ -2309,9 +2396,9 @@ exports[`Storyshots UI|Notifications/NotificationList single 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 16px;
-  background-color: rgba(50,53,71,0.97);
   box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
   color: #FFFFFF;
+  background-color: rgba(0,0,0,0.95);
   -webkit-text-decoration: none;
   text-decoration: none;
 }
@@ -2331,9 +2418,9 @@ exports[`Storyshots UI|Notifications/NotificationList single 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 16px;
-  background-color: rgba(50,53,71,0.97);
   box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
   color: #FFFFFF;
+  background-color: rgba(0,0,0,0.95);
   -webkit-text-decoration: none;
   text-decoration: none;
 }
@@ -3025,16 +3112,11 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -3043,38 +3125,6 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   z-index: 2;
 }
 
-.emotion-88:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-88:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-88:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-88 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-88 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-88 svg {
   display: inline-block;
   height: 14px;
@@ -3087,23 +3137,19 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
 }
 
 .emotion-88 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-88:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-88:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-88:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-88:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-88:hover {
@@ -3532,16 +3578,11 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -3550,38 +3591,6 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   z-index: 2;
 }
 
-.emotion-88:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-88:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-88:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-88 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-88 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-88 svg {
   display: inline-block;
   height: 14px;
@@ -3594,23 +3603,19 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
 }
 
 .emotion-88 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-88:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-88:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-88:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-88:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-88:hover {
@@ -4120,13 +4125,15 @@ exports[`Storyshots UI|Sidebar/ListItemIcon all 1`] = `
 
 .emotion-16 {
   min-width: 180px;
+  overflow: hidden;
+  border-radius: 8px;
 }
 
 .emotion-5 {
   font-size: 12px;
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
-  color: #999999;
+  color: rgba(51,51,51,0.5);
   -webkit-text-decoration: none;
   text-decoration: none;
   cursor: pointer;
@@ -4146,10 +4153,6 @@ exports[`Storyshots UI|Sidebar/ListItemIcon all 1`] = `
   align-items: center;
 }
 
-.emotion-5 + .emotion-5 {
-  border-top: 1px solid #EEEEEE;
-}
-
 .emotion-5 > * + * {
   padding-left: 10px;
 }
@@ -4192,7 +4195,7 @@ exports[`Storyshots UI|Sidebar/ListItemIcon all 1`] = `
 }
 
 .emotion-3 {
-  color: #444444;
+  color: #333333;
 }
 
 .emotion-6 {
@@ -4209,13 +4212,15 @@ exports[`Storyshots UI|Sidebar/ListItemIcon all 1`] = `
 
 .emotion-16 {
   min-width: 180px;
+  overflow: hidden;
+  border-radius: 8px;
 }
 
 .emotion-5 {
   font-size: 12px;
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
-  color: #999999;
+  color: rgba(51,51,51,0.5);
   -webkit-text-decoration: none;
   text-decoration: none;
   cursor: pointer;
@@ -4235,10 +4240,6 @@ exports[`Storyshots UI|Sidebar/ListItemIcon all 1`] = `
   align-items: center;
 }
 
-.emotion-5 + .emotion-5 {
-  border-top: 1px solid #EEEEEE;
-}
-
 .emotion-5 > * + * {
   padding-left: 10px;
 }
@@ -4281,7 +4282,7 @@ exports[`Storyshots UI|Sidebar/ListItemIcon all 1`] = `
 }
 
 .emotion-3 {
-  color: #444444;
+  color: #333333;
 }
 
 .emotion-6 {
@@ -4426,9 +4427,9 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 16px;
-  background-color: rgba(50,53,71,0.97);
   box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
   color: #FFFFFF;
+  background-color: rgba(0,0,0,0.95);
   -webkit-text-decoration: none;
   text-decoration: none;
 }
@@ -4475,6 +4476,14 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
   font-weight: 700;
 }
 
+.emotion-2 > * {
+  max-height: 32px;
+  max-width: 200px;
+  height: auto;
+  width: auto;
+  display: block;
+}
+
 .emotion-1 {
   display: block;
   color: inherit;
@@ -4538,51 +4547,14 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
   padding: 7px;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #666666;
+  box-shadow: rgba(51,51,51,0.2) 0 0 0 1px inset;
+  color: rgba(51,51,51,0.7);
   background: transparent;
   position: relative;
   overflow: visible;
 }
 
-.emotion-5:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-5:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-5:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-5 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-5 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-5 svg {
   display: inline-block;
   height: 14px;
@@ -4594,23 +4566,22 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
   pointer-events: none;
 }
 
+.emotion-5 svg path {
+  fill: currentColor;
+}
+
 .emotion-5 svg {
   display: block;
   margin: 0;
 }
 
-.emotion-5 svg path {
-  fill: #666666;
-}
-
 .emotion-5:hover {
-  box-shadow: #999999 0 0 0 1px inset;
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
 }
 
 .emotion-5:active {
-  background: #DDDDDD;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #333333;
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
+  color: #333;
 }
 
 .emotion-8 {
@@ -4620,7 +4591,7 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
   margin-right: 6px;
   border-top: 3.5px solid transparent;
   border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid rgba(0,0,0,.2);
+  border-left: 3.5px solid rgba(0,0,0,0.3);
   -webkit-transition: -webkit-transform .1s ease-out;
   -webkit-transition: transform .1s ease-out;
   transition: transform .1s ease-out;
@@ -4861,9 +4832,9 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 16px;
-  background-color: rgba(50,53,71,0.97);
   box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
   color: #FFFFFF;
+  background-color: rgba(0,0,0,0.95);
   -webkit-text-decoration: none;
   text-decoration: none;
 }
@@ -4910,6 +4881,14 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
   font-weight: 700;
 }
 
+.emotion-2 > * {
+  max-height: 32px;
+  max-width: 200px;
+  height: auto;
+  width: auto;
+  display: block;
+}
+
 .emotion-1 {
   display: block;
   color: inherit;
@@ -4973,51 +4952,14 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
   padding: 7px;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #666666;
+  box-shadow: rgba(51,51,51,0.2) 0 0 0 1px inset;
+  color: rgba(51,51,51,0.7);
   background: transparent;
   position: relative;
   overflow: visible;
 }
 
-.emotion-5:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-5:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-5:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-5 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-5 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-5 svg {
   display: inline-block;
   height: 14px;
@@ -5029,23 +4971,22 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
   pointer-events: none;
 }
 
+.emotion-5 svg path {
+  fill: currentColor;
+}
+
 .emotion-5 svg {
   display: block;
   margin: 0;
 }
 
-.emotion-5 svg path {
-  fill: #666666;
-}
-
 .emotion-5:hover {
-  box-shadow: #999999 0 0 0 1px inset;
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
 }
 
 .emotion-5:active {
-  background: #DDDDDD;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #333333;
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
+  color: #333;
 }
 
 .emotion-8 {
@@ -5055,7 +4996,7 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
   margin-right: 6px;
   border-top: 3.5px solid transparent;
   border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid rgba(0,0,0,.2);
+  border-left: 3.5px solid rgba(0,0,0,0.3);
   -webkit-transition: -webkit-transform .1s ease-out;
   -webkit-transition: transform .1s ease-out;
   transition: transform .1s ease-out;
@@ -5269,7 +5210,7 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
           >
             <path
               d="M53.3 31.7c-1.7 0-3.4-.3-5-.7-1.5-.5-2.8-1.1-3.9-2l1.6-3.5c2.2 1.5 4.6 2.3 7.3 2.3 1.5 0 2.5-.2 3.3-.7.7-.5 1.1-1 1.1-1.9 0-.7-.3-1.3-1-1.7s-2-.8-3.7-1.2c-2-.4-3.6-.9-4.8-1.5-1.1-.5-2-1.2-2.6-2-.5-1-.8-2-.8-3.2 0-1.4.4-2.6 1.2-3.6.7-1.1 1.8-2 3.2-2.6 1.3-.6 2.9-.9 4.7-.9 1.6 0 3.1.3 4.6.7 1.5.5 2.7 1.1 3.5 2l-1.6 3.5c-2-1.5-4.2-2.3-6.5-2.3-1.3 0-2.3.2-3 .8-.8.5-1.2 1.1-1.2 2 0 .5.2 1 .5 1.3.2.3.7.6 1.4.9l2.9.8c2.9.6 5 1.4 6.2 2.4a5 5 0 0 1 2 4.2 6 6 0 0 1-2.5 5c-1.7 1.2-4 1.9-7 1.9zm21-3.6l1.4-.1-.2 3.5-1.9.1c-2.4 0-4.1-.5-5.2-1.5-1.1-1-1.6-2.7-1.6-4.8v-6h-3v-3.6h3V11h4.8v4.6h4v3.6h-4v6c0 1.8.9 2.8 2.6 2.8zm11.1 3.5c-1.6 0-3-.3-4.3-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.3-1 1.7 0 3.2.3 4.4 1a7 7 0 0 1 3 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.4 1zm0-3.6c2.4 0 3.6-1.6 3.6-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.6-1c-2.3 0-3.5 1.4-3.5 4.4 0 3 1.2 4.6 3.5 4.6zm21.7-8.8l-2.7.3c-1.3.2-2.3.5-2.8 1.2-.6.6-.9 1.4-.9 2.5v8.2H96V15.7h4.6v2.6c.8-1.8 2.5-2.8 5-3h1.3l.3 4zm14-3.5h4.8L116.4 37h-4.9l3-6.6-6.4-14.8h5l4 10 4-10zm16-.4c1.4 0 2.6.3 3.6 1 1 .6 1.9 1.6 2.5 2.8.6 1.2.9 2.7.9 4.3 0 1.6-.3 3-1 4.3a6.9 6.9 0 0 1-2.4 2.9c-1 .7-2.2 1-3.6 1-1 0-2-.2-3-.7-.8-.4-1.5-1-2-1.9v2.4h-4.7V8.8h4.8v9c.5-.8 1.2-1.4 2-1.9.9-.4 1.8-.6 3-.6zM135.7 28c1.1 0 2-.4 2.6-1.2.6-.8 1-2 1-3.4 0-1.5-.4-2.5-1-3.3s-1.5-1.1-2.6-1.1-2 .3-2.6 1.1c-.6.8-1 2-1 3.3 0 1.5.4 2.6 1 3.4.6.8 1.5 1.2 2.6 1.2zm18.9 3.6c-1.7 0-3.2-.3-4.4-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.4-1 1.6 0 3 .3 4.3 1a7 7 0 0 1 3 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.3 1zm0-3.6c2.3 0 3.5-1.6 3.5-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.5-1c-2.4 0-3.6 1.4-3.6 4.4 0 3 1.2 4.6 3.6 4.6zm18 3.6c-1.7 0-3.2-.3-4.4-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.4-1 1.6 0 3 .3 4.4 1a7 7 0 0 1 2.9 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.3 1zm0-3.6c2.3 0 3.5-1.6 3.5-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.5-1c-2.4 0-3.6 1.4-3.6 4.4 0 3 1.2 4.6 3.6 4.6zm27.4 3.4h-6l-6-7v7h-4.8V8.8h4.9v13.6l5.8-6.7h5.7l-6.6 7.5 7 8.2z"
-              fill="#333"
+              fill="currentColor"
             />
             <mask
               fill="#fff"
@@ -5690,9 +5631,9 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 16px;
-  background-color: rgba(50,53,71,0.97);
   box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
   color: #FFFFFF;
+  background-color: rgba(0,0,0,0.95);
   -webkit-text-decoration: none;
   text-decoration: none;
 }
@@ -5739,6 +5680,14 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   font-weight: 700;
 }
 
+.emotion-2 > * {
+  max-height: 32px;
+  max-width: 200px;
+  height: auto;
+  width: auto;
+  display: block;
+}
+
 .emotion-1 {
   display: block;
   color: inherit;
@@ -5802,51 +5751,14 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
   padding: 7px;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #666666;
+  box-shadow: rgba(51,51,51,0.2) 0 0 0 1px inset;
+  color: rgba(51,51,51,0.7);
   background: transparent;
   position: relative;
   overflow: visible;
 }
 
-.emotion-5:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-5:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-5:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-5 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-5 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-5 svg {
   display: inline-block;
   height: 14px;
@@ -5858,23 +5770,22 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   pointer-events: none;
 }
 
+.emotion-5 svg path {
+  fill: currentColor;
+}
+
 .emotion-5 svg {
   display: block;
   margin: 0;
 }
 
-.emotion-5 svg path {
-  fill: #666666;
-}
-
 .emotion-5:hover {
-  box-shadow: #999999 0 0 0 1px inset;
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
 }
 
 .emotion-5:active {
-  background: #DDDDDD;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #333333;
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
+  color: #333;
 }
 
 .emotion-14 {
@@ -5913,7 +5824,8 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
 .emotion-14 > svg path {
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
-  fill: #999999;
+  fill: currentColor;
+  opacity: 0.3;
 }
 
 .emotion-8 {
@@ -5979,7 +5891,7 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   display: block;
   height: 8px;
   width: 8px;
-  color: #666666;
+  color: #333333;
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
 }
@@ -5988,10 +5900,6 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   background: rgba(0,0,0,0.2);
 }
 
-.emotion-13:hover > svg {
-  color: #444444;
-}
-
 .emotion-32 + section {
   margin-top: 20px;
 }
@@ -6006,10 +5914,10 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   -ms-letter-spacing: 0.35em;
   letter-spacing: 0.35em;
   text-transform: uppercase;
-  font-weight: 700;
+  font-weight: 900;
   font-size: 11px;
   line-height: 24px;
-  color: #999999;
+  color: rgba(51,51,51,0.5);
   margin: 0 20px;
 }
 
@@ -6046,9 +5954,11 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
+  color: #333333;
 }
 
 .emotion-19:hover {
+  color: #333333;
   background: rgba(0,0,0,.05);
 }
 
@@ -6059,7 +5969,7 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   margin-right: 6px;
   border-top: 3.5px solid transparent;
   border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid rgba(0,0,0,.2);
+  border-left: 3.5px solid rgba(0,0,0,0.3);
   -webkit-transition: -webkit-transform .1s ease-out;
   -webkit-transition: transform .1s ease-out;
   transition: transform .1s ease-out;
@@ -6107,6 +6017,7 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   cursor: default;
   background: #1EA7FD;
   color: #FFFFFF;
+  font-weight: 700;
 }
 
 .emotion-21 {
@@ -6116,7 +6027,7 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   margin-right: 6px;
   border-top: 3.5px solid transparent;
   border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid rgba(0,0,0,.2);
+  border-left: 3.5px solid rgba(0,0,0,0.3);
   -webkit-transition: -webkit-transform .1s ease-out;
   -webkit-transition: transform .1s ease-out;
   transition: transform .1s ease-out;
@@ -6161,9 +6072,11 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   transition: background 75ms ease-out;
   padding-left: 24px;
   cursor: pointer;
+  color: #333333;
 }
 
 .emotion-29:hover {
+  color: #333333;
   background: rgba(0,0,0,.05);
 }
 
@@ -6189,7 +6102,7 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   margin-right: 6px;
   border-top: 3.5px solid transparent;
   border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid rgba(0,0,0,.2);
+  border-left: 3.5px solid rgba(0,0,0,0.3);
   -webkit-transition: -webkit-transform .1s ease-out;
   -webkit-transition: transform .1s ease-out;
   transition: transform .1s ease-out;
@@ -6246,9 +6159,9 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 16px;
-  background-color: rgba(50,53,71,0.97);
   box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
   color: #FFFFFF;
+  background-color: rgba(0,0,0,0.95);
   -webkit-text-decoration: none;
   text-decoration: none;
 }
@@ -6295,6 +6208,14 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   font-weight: 700;
 }
 
+.emotion-2 > * {
+  max-height: 32px;
+  max-width: 200px;
+  height: auto;
+  width: auto;
+  display: block;
+}
+
 .emotion-1 {
   display: block;
   color: inherit;
@@ -6358,51 +6279,14 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
   padding: 7px;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #666666;
+  box-shadow: rgba(51,51,51,0.2) 0 0 0 1px inset;
+  color: rgba(51,51,51,0.7);
   background: transparent;
   position: relative;
   overflow: visible;
 }
 
-.emotion-5:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-5:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-5:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-5 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-5 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-5 svg {
   display: inline-block;
   height: 14px;
@@ -6414,23 +6298,22 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   pointer-events: none;
 }
 
+.emotion-5 svg path {
+  fill: currentColor;
+}
+
 .emotion-5 svg {
   display: block;
   margin: 0;
 }
 
-.emotion-5 svg path {
-  fill: #666666;
-}
-
 .emotion-5:hover {
-  box-shadow: #999999 0 0 0 1px inset;
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
 }
 
 .emotion-5:active {
-  background: #DDDDDD;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #333333;
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
+  color: #333;
 }
 
 .emotion-14 {
@@ -6469,7 +6352,8 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
 .emotion-14 > svg path {
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
-  fill: #999999;
+  fill: currentColor;
+  opacity: 0.3;
 }
 
 .emotion-8 {
@@ -6535,7 +6419,7 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   display: block;
   height: 8px;
   width: 8px;
-  color: #666666;
+  color: #333333;
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
 }
@@ -6544,10 +6428,6 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   background: rgba(0,0,0,0.2);
 }
 
-.emotion-13:hover > svg {
-  color: #444444;
-}
-
 .emotion-32 + section {
   margin-top: 20px;
 }
@@ -6562,10 +6442,10 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   -ms-letter-spacing: 0.35em;
   letter-spacing: 0.35em;
   text-transform: uppercase;
-  font-weight: 700;
+  font-weight: 900;
   font-size: 11px;
   line-height: 24px;
-  color: #999999;
+  color: rgba(51,51,51,0.5);
   margin: 0 20px;
 }
 
@@ -6602,9 +6482,11 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
+  color: #333333;
 }
 
 .emotion-19:hover {
+  color: #333333;
   background: rgba(0,0,0,.05);
 }
 
@@ -6615,7 +6497,7 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   margin-right: 6px;
   border-top: 3.5px solid transparent;
   border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid rgba(0,0,0,.2);
+  border-left: 3.5px solid rgba(0,0,0,0.3);
   -webkit-transition: -webkit-transform .1s ease-out;
   -webkit-transition: transform .1s ease-out;
   transition: transform .1s ease-out;
@@ -6663,6 +6545,7 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   cursor: default;
   background: #1EA7FD;
   color: #FFFFFF;
+  font-weight: 700;
 }
 
 .emotion-21 {
@@ -6672,7 +6555,7 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   margin-right: 6px;
   border-top: 3.5px solid transparent;
   border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid rgba(0,0,0,.2);
+  border-left: 3.5px solid rgba(0,0,0,0.3);
   -webkit-transition: -webkit-transform .1s ease-out;
   -webkit-transition: transform .1s ease-out;
   transition: transform .1s ease-out;
@@ -6717,9 +6600,11 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   transition: background 75ms ease-out;
   padding-left: 24px;
   cursor: pointer;
+  color: #333333;
 }
 
 .emotion-29:hover {
+  color: #333333;
   background: rgba(0,0,0,.05);
 }
 
@@ -6745,7 +6630,7 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   margin-right: 6px;
   border-top: 3.5px solid transparent;
   border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid rgba(0,0,0,.2);
+  border-left: 3.5px solid rgba(0,0,0,0.3);
   -webkit-transition: -webkit-transform .1s ease-out;
   -webkit-transition: transform .1s ease-out;
   transition: transform .1s ease-out;
@@ -6815,7 +6700,7 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
           >
             <path
               d="M53.3 31.7c-1.7 0-3.4-.3-5-.7-1.5-.5-2.8-1.1-3.9-2l1.6-3.5c2.2 1.5 4.6 2.3 7.3 2.3 1.5 0 2.5-.2 3.3-.7.7-.5 1.1-1 1.1-1.9 0-.7-.3-1.3-1-1.7s-2-.8-3.7-1.2c-2-.4-3.6-.9-4.8-1.5-1.1-.5-2-1.2-2.6-2-.5-1-.8-2-.8-3.2 0-1.4.4-2.6 1.2-3.6.7-1.1 1.8-2 3.2-2.6 1.3-.6 2.9-.9 4.7-.9 1.6 0 3.1.3 4.6.7 1.5.5 2.7 1.1 3.5 2l-1.6 3.5c-2-1.5-4.2-2.3-6.5-2.3-1.3 0-2.3.2-3 .8-.8.5-1.2 1.1-1.2 2 0 .5.2 1 .5 1.3.2.3.7.6 1.4.9l2.9.8c2.9.6 5 1.4 6.2 2.4a5 5 0 0 1 2 4.2 6 6 0 0 1-2.5 5c-1.7 1.2-4 1.9-7 1.9zm21-3.6l1.4-.1-.2 3.5-1.9.1c-2.4 0-4.1-.5-5.2-1.5-1.1-1-1.6-2.7-1.6-4.8v-6h-3v-3.6h3V11h4.8v4.6h4v3.6h-4v6c0 1.8.9 2.8 2.6 2.8zm11.1 3.5c-1.6 0-3-.3-4.3-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.3-1 1.7 0 3.2.3 4.4 1a7 7 0 0 1 3 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.4 1zm0-3.6c2.4 0 3.6-1.6 3.6-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.6-1c-2.3 0-3.5 1.4-3.5 4.4 0 3 1.2 4.6 3.5 4.6zm21.7-8.8l-2.7.3c-1.3.2-2.3.5-2.8 1.2-.6.6-.9 1.4-.9 2.5v8.2H96V15.7h4.6v2.6c.8-1.8 2.5-2.8 5-3h1.3l.3 4zm14-3.5h4.8L116.4 37h-4.9l3-6.6-6.4-14.8h5l4 10 4-10zm16-.4c1.4 0 2.6.3 3.6 1 1 .6 1.9 1.6 2.5 2.8.6 1.2.9 2.7.9 4.3 0 1.6-.3 3-1 4.3a6.9 6.9 0 0 1-2.4 2.9c-1 .7-2.2 1-3.6 1-1 0-2-.2-3-.7-.8-.4-1.5-1-2-1.9v2.4h-4.7V8.8h4.8v9c.5-.8 1.2-1.4 2-1.9.9-.4 1.8-.6 3-.6zM135.7 28c1.1 0 2-.4 2.6-1.2.6-.8 1-2 1-3.4 0-1.5-.4-2.5-1-3.3s-1.5-1.1-2.6-1.1-2 .3-2.6 1.1c-.6.8-1 2-1 3.3 0 1.5.4 2.6 1 3.4.6.8 1.5 1.2 2.6 1.2zm18.9 3.6c-1.7 0-3.2-.3-4.4-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.4-1 1.6 0 3 .3 4.3 1a7 7 0 0 1 3 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.3 1zm0-3.6c2.3 0 3.5-1.6 3.5-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.5-1c-2.4 0-3.6 1.4-3.6 4.4 0 3 1.2 4.6 3.6 4.6zm18 3.6c-1.7 0-3.2-.3-4.4-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.4-1 1.6 0 3 .3 4.4 1a7 7 0 0 1 2.9 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.3 1zm0-3.6c2.3 0 3.5-1.6 3.5-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.5-1c-2.4 0-3.6 1.4-3.6 4.4 0 3 1.2 4.6 3.6 4.6zm27.4 3.4h-6l-6-7v7h-4.8V8.8h4.9v13.6l5.8-6.7h5.7l-6.6 7.5 7 8.2z"
-              fill="#333"
+              fill="currentColor"
             />
             <mask
               fill="#fff"
@@ -7112,6 +6997,14 @@ exports[`Storyshots UI|Sidebar/SidebarHeading customBrand 1`] = `
   font-weight: 700;
 }
 
+.emotion-0 > * {
+  max-height: 32px;
+  max-width: 200px;
+  height: auto;
+  width: auto;
+  display: block;
+}
+
 .emotion-4 {
   display: inline-block;
   cursor: pointer;
@@ -7145,51 +7038,14 @@ exports[`Storyshots UI|Sidebar/SidebarHeading customBrand 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
   padding: 7px;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #666666;
+  box-shadow: rgba(51,51,51,0.2) 0 0 0 1px inset;
+  color: rgba(51,51,51,0.7);
   background: transparent;
   position: relative;
   overflow: visible;
 }
 
-.emotion-3:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-3:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-3:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-3 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-3 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-3 svg {
   display: inline-block;
   height: 14px;
@@ -7201,23 +7057,22 @@ exports[`Storyshots UI|Sidebar/SidebarHeading customBrand 1`] = `
   pointer-events: none;
 }
 
+.emotion-3 svg path {
+  fill: currentColor;
+}
+
 .emotion-3 svg {
   display: block;
   margin: 0;
 }
 
-.emotion-3 svg path {
-  fill: #666666;
-}
-
 .emotion-3:hover {
-  box-shadow: #999999 0 0 0 1px inset;
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
 }
 
 .emotion-3:active {
-  background: #DDDDDD;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #333333;
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
+  color: #333;
 }
 
 .emotion-5 {
@@ -7252,6 +7107,14 @@ exports[`Storyshots UI|Sidebar/SidebarHeading customBrand 1`] = `
   font-weight: 700;
 }
 
+.emotion-0 > * {
+  max-height: 32px;
+  max-width: 200px;
+  height: auto;
+  width: auto;
+  display: block;
+}
+
 .emotion-4 {
   display: inline-block;
   cursor: pointer;
@@ -7285,51 +7148,14 @@ exports[`Storyshots UI|Sidebar/SidebarHeading customBrand 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
   padding: 7px;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #666666;
+  box-shadow: rgba(51,51,51,0.2) 0 0 0 1px inset;
+  color: rgba(51,51,51,0.7);
   background: transparent;
   position: relative;
   overflow: visible;
 }
 
-.emotion-3:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-3:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-3:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-3 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-3 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-3 svg {
   display: inline-block;
   height: 14px;
@@ -7341,23 +7167,22 @@ exports[`Storyshots UI|Sidebar/SidebarHeading customBrand 1`] = `
   pointer-events: none;
 }
 
+.emotion-3 svg path {
+  fill: currentColor;
+}
+
 .emotion-3 svg {
   display: block;
   margin: 0;
 }
 
-.emotion-3 svg path {
-  fill: #666666;
-}
-
 .emotion-3:hover {
-  box-shadow: #999999 0 0 0 1px inset;
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
 }
 
 .emotion-3:active {
-  background: #DDDDDD;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #333333;
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
+  color: #333;
 }
 
 .emotion-5 {
@@ -7381,7 +7206,64 @@ exports[`Storyshots UI|Sidebar/SidebarHeading customBrand 1`] = `
   <div
     class="emotion-0"
   >
-    custom brand
+    
+
+    <svg
+      height="64px"
+      version="1.1"
+      viewBox="0 0 64 64"
+      width="64px"
+      xlink="http://www.w3.org/1999/xlink"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      
+  
+      <a
+        href="https://storybook.js.org"
+      >
+        
+    
+        <g
+          fill="none"
+          fill-rule="evenodd"
+          id="Artboard"
+          stroke="none"
+          stroke-width="1"
+        >
+          
+      
+          <path
+            d="M8.04798541,58.7875918 L6.07908839,6.32540407 C6.01406344,4.5927838 7.34257463,3.12440831 9.07303814,3.01625434 L53.6958037,0.227331489 C55.457209,0.117243658 56.974354,1.45590096 57.0844418,3.21730626 C57.0885895,3.28366922 57.0906648,3.35014546 57.0906648,3.41663791 L57.0906648,60.5834697 C57.0906648,62.3483119 55.6599776,63.7789992 53.8951354,63.7789992 C53.847325,63.7789992 53.7995207,63.7779262 53.7517585,63.775781 L11.0978899,61.8600599 C9.43669044,61.7854501 8.11034889,60.4492961 8.04798541,58.7875918 Z"
+            fill="#FF4785"
+            fill-rule="nonzero"
+            id="path-1"
+          />
+          
+      
+          <path
+            d="M35.9095005,24.1768792 C35.9095005,25.420127 44.2838488,24.8242707 45.4080313,23.9509748 C45.4080313,15.4847538 40.8652557,11.0358878 32.5466666,11.0358878 C24.2280775,11.0358878 19.5673077,15.553972 19.5673077,22.3311017 C19.5673077,34.1346028 35.4965208,34.3605071 35.4965208,40.7987804 C35.4965208,42.606015 34.6115646,43.6790606 32.6646607,43.6790606 C30.127786,43.6790606 29.1248356,42.3834613 29.2428298,37.9783269 C29.2428298,37.0226907 19.5673077,36.7247626 19.2723223,37.9783269 C18.5211693,48.6535354 25.1720308,51.7326752 32.7826549,51.7326752 C40.1572906,51.7326752 45.939005,47.8018145 45.939005,40.6858282 C45.939005,28.035186 29.7738035,28.3740425 29.7738035,22.1051974 C29.7738035,19.5637737 31.6617103,19.2249173 32.7826549,19.2249173 C33.9625966,19.2249173 36.0864917,19.4328883 35.9095005,24.1768792 Z"
+            fill="#FFFFFF"
+            fill-rule="nonzero"
+            id="path9_fill-path"
+          />
+          
+      
+          <path
+            d="M44.0461638,0.830433986 L50.1874092,0.446606143 L50.443532,7.7810017 C50.4527198,8.04410717 50.2468789,8.26484453 49.9837734,8.27403237 C49.871115,8.27796649 49.7607078,8.24184808 49.6721567,8.17209069 L47.3089847,6.3104681 L44.5110468,8.43287463 C44.3012992,8.591981 44.0022839,8.55092814 43.8431776,8.34118051 C43.7762017,8.25288717 43.742082,8.14401677 43.7466857,8.03329059 L44.0461638,0.830433986 Z"
+            fill="#FFFFFF"
+            id="Path"
+          />
+          
+    
+        </g>
+        
+  
+      </a>
+      
+
+    </svg>
+    
+
   </div>
   <div
     class="emotion-4"
@@ -7421,6 +7303,14 @@ exports[`Storyshots UI|Sidebar/SidebarHeading menuHighlighted 1`] = `
   font-weight: 700;
 }
 
+.emotion-2 > * {
+  max-height: 32px;
+  max-width: 200px;
+  height: auto;
+  width: auto;
+  display: block;
+}
+
 .emotion-1 {
   display: block;
   color: inherit;
@@ -7499,51 +7389,14 @@ exports[`Storyshots UI|Sidebar/SidebarHeading menuHighlighted 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
   padding: 7px;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #666666;
+  box-shadow: rgba(51,51,51,0.2) 0 0 0 1px inset;
+  color: rgba(51,51,51,0.7);
   background: transparent;
   position: relative;
   overflow: visible;
 }
 
-.emotion-5:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-5:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-5:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-5 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-5 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-5 svg {
   display: inline-block;
   height: 14px;
@@ -7555,23 +7408,22 @@ exports[`Storyshots UI|Sidebar/SidebarHeading menuHighlighted 1`] = `
   pointer-events: none;
 }
 
+.emotion-5 svg path {
+  fill: currentColor;
+}
+
 .emotion-5 svg {
   display: block;
   margin: 0;
 }
 
-.emotion-5 svg path {
-  fill: #666666;
-}
-
 .emotion-5:hover {
-  box-shadow: #999999 0 0 0 1px inset;
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
 }
 
 .emotion-5:active {
-  background: #DDDDDD;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #333333;
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
+  color: #333;
 }
 
 .emotion-5:after {
@@ -7602,6 +7454,14 @@ exports[`Storyshots UI|Sidebar/SidebarHeading menuHighlighted 1`] = `
   font-weight: 700;
 }
 
+.emotion-2 > * {
+  max-height: 32px;
+  max-width: 200px;
+  height: auto;
+  width: auto;
+  display: block;
+}
+
 .emotion-1 {
   display: block;
   color: inherit;
@@ -7680,51 +7540,14 @@ exports[`Storyshots UI|Sidebar/SidebarHeading menuHighlighted 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
   padding: 7px;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #666666;
+  box-shadow: rgba(51,51,51,0.2) 0 0 0 1px inset;
+  color: rgba(51,51,51,0.7);
   background: transparent;
   position: relative;
   overflow: visible;
 }
 
-.emotion-5:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-5:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-5:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-5 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-5 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-5 svg {
   display: inline-block;
   height: 14px;
@@ -7736,23 +7559,22 @@ exports[`Storyshots UI|Sidebar/SidebarHeading menuHighlighted 1`] = `
   pointer-events: none;
 }
 
+.emotion-5 svg path {
+  fill: currentColor;
+}
+
 .emotion-5 svg {
   display: block;
   margin: 0;
 }
 
-.emotion-5 svg path {
-  fill: #666666;
-}
-
 .emotion-5:hover {
-  box-shadow: #999999 0 0 0 1px inset;
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
 }
 
 .emotion-5:active {
-  background: #DDDDDD;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #333333;
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
+  color: #333;
 }
 
 .emotion-5:after {
@@ -7795,7 +7617,7 @@ exports[`Storyshots UI|Sidebar/SidebarHeading menuHighlighted 1`] = `
         >
           <path
             d="M53.3 31.7c-1.7 0-3.4-.3-5-.7-1.5-.5-2.8-1.1-3.9-2l1.6-3.5c2.2 1.5 4.6 2.3 7.3 2.3 1.5 0 2.5-.2 3.3-.7.7-.5 1.1-1 1.1-1.9 0-.7-.3-1.3-1-1.7s-2-.8-3.7-1.2c-2-.4-3.6-.9-4.8-1.5-1.1-.5-2-1.2-2.6-2-.5-1-.8-2-.8-3.2 0-1.4.4-2.6 1.2-3.6.7-1.1 1.8-2 3.2-2.6 1.3-.6 2.9-.9 4.7-.9 1.6 0 3.1.3 4.6.7 1.5.5 2.7 1.1 3.5 2l-1.6 3.5c-2-1.5-4.2-2.3-6.5-2.3-1.3 0-2.3.2-3 .8-.8.5-1.2 1.1-1.2 2 0 .5.2 1 .5 1.3.2.3.7.6 1.4.9l2.9.8c2.9.6 5 1.4 6.2 2.4a5 5 0 0 1 2 4.2 6 6 0 0 1-2.5 5c-1.7 1.2-4 1.9-7 1.9zm21-3.6l1.4-.1-.2 3.5-1.9.1c-2.4 0-4.1-.5-5.2-1.5-1.1-1-1.6-2.7-1.6-4.8v-6h-3v-3.6h3V11h4.8v4.6h4v3.6h-4v6c0 1.8.9 2.8 2.6 2.8zm11.1 3.5c-1.6 0-3-.3-4.3-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.3-1 1.7 0 3.2.3 4.4 1a7 7 0 0 1 3 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.4 1zm0-3.6c2.4 0 3.6-1.6 3.6-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.6-1c-2.3 0-3.5 1.4-3.5 4.4 0 3 1.2 4.6 3.5 4.6zm21.7-8.8l-2.7.3c-1.3.2-2.3.5-2.8 1.2-.6.6-.9 1.4-.9 2.5v8.2H96V15.7h4.6v2.6c.8-1.8 2.5-2.8 5-3h1.3l.3 4zm14-3.5h4.8L116.4 37h-4.9l3-6.6-6.4-14.8h5l4 10 4-10zm16-.4c1.4 0 2.6.3 3.6 1 1 .6 1.9 1.6 2.5 2.8.6 1.2.9 2.7.9 4.3 0 1.6-.3 3-1 4.3a6.9 6.9 0 0 1-2.4 2.9c-1 .7-2.2 1-3.6 1-1 0-2-.2-3-.7-.8-.4-1.5-1-2-1.9v2.4h-4.7V8.8h4.8v9c.5-.8 1.2-1.4 2-1.9.9-.4 1.8-.6 3-.6zM135.7 28c1.1 0 2-.4 2.6-1.2.6-.8 1-2 1-3.4 0-1.5-.4-2.5-1-3.3s-1.5-1.1-2.6-1.1-2 .3-2.6 1.1c-.6.8-1 2-1 3.3 0 1.5.4 2.6 1 3.4.6.8 1.5 1.2 2.6 1.2zm18.9 3.6c-1.7 0-3.2-.3-4.4-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.4-1 1.6 0 3 .3 4.3 1a7 7 0 0 1 3 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.3 1zm0-3.6c2.3 0 3.5-1.6 3.5-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.5-1c-2.4 0-3.6 1.4-3.6 4.4 0 3 1.2 4.6 3.6 4.6zm18 3.6c-1.7 0-3.2-.3-4.4-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.4-1 1.6 0 3 .3 4.4 1a7 7 0 0 1 2.9 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.3 1zm0-3.6c2.3 0 3.5-1.6 3.5-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.5-1c-2.4 0-3.6 1.4-3.6 4.4 0 3 1.2 4.6 3.6 4.6zm27.4 3.4h-6l-6-7v7h-4.8V8.8h4.9v13.6l5.8-6.7h5.7l-6.6 7.5 7 8.2z"
-            fill="#333"
+            fill="currentColor"
           />
           <mask
             fill="#fff"
@@ -7858,6 +7680,14 @@ exports[`Storyshots UI|Sidebar/SidebarHeading simple 1`] = `
   font-weight: 700;
 }
 
+.emotion-2 > * {
+  max-height: 32px;
+  max-width: 200px;
+  height: auto;
+  width: auto;
+  display: block;
+}
+
 .emotion-1 {
   display: block;
   color: inherit;
@@ -7921,51 +7751,14 @@ exports[`Storyshots UI|Sidebar/SidebarHeading simple 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
   padding: 7px;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #666666;
+  box-shadow: rgba(51,51,51,0.2) 0 0 0 1px inset;
+  color: rgba(51,51,51,0.7);
   background: transparent;
   position: relative;
   overflow: visible;
 }
 
-.emotion-5:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-5:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-5:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-5 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-5 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-5 svg {
   display: inline-block;
   height: 14px;
@@ -7977,23 +7770,22 @@ exports[`Storyshots UI|Sidebar/SidebarHeading simple 1`] = `
   pointer-events: none;
 }
 
+.emotion-5 svg path {
+  fill: currentColor;
+}
+
 .emotion-5 svg {
   display: block;
   margin: 0;
 }
 
-.emotion-5 svg path {
-  fill: #666666;
-}
-
 .emotion-5:hover {
-  box-shadow: #999999 0 0 0 1px inset;
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
 }
 
 .emotion-5:active {
-  background: #DDDDDD;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #333333;
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
+  color: #333;
 }
 
 .emotion-7 {
@@ -8028,6 +7820,14 @@ exports[`Storyshots UI|Sidebar/SidebarHeading simple 1`] = `
   font-weight: 700;
 }
 
+.emotion-2 > * {
+  max-height: 32px;
+  max-width: 200px;
+  height: auto;
+  width: auto;
+  display: block;
+}
+
 .emotion-1 {
   display: block;
   color: inherit;
@@ -8091,51 +7891,14 @@ exports[`Storyshots UI|Sidebar/SidebarHeading simple 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
   padding: 7px;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #666666;
+  box-shadow: rgba(51,51,51,0.2) 0 0 0 1px inset;
+  color: rgba(51,51,51,0.7);
   background: transparent;
   position: relative;
   overflow: visible;
 }
 
-.emotion-5:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-5:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-5:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-5 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-5 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-5 svg {
   display: inline-block;
   height: 14px;
@@ -8147,23 +7910,22 @@ exports[`Storyshots UI|Sidebar/SidebarHeading simple 1`] = `
   pointer-events: none;
 }
 
+.emotion-5 svg path {
+  fill: currentColor;
+}
+
 .emotion-5 svg {
   display: block;
   margin: 0;
 }
 
-.emotion-5 svg path {
-  fill: #666666;
-}
-
 .emotion-5:hover {
-  box-shadow: #999999 0 0 0 1px inset;
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
 }
 
 .emotion-5:active {
-  background: #DDDDDD;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #333333;
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
+  color: #333;
 }
 
 .emotion-7 {
@@ -8210,7 +7972,7 @@ exports[`Storyshots UI|Sidebar/SidebarHeading simple 1`] = `
         >
           <path
             d="M53.3 31.7c-1.7 0-3.4-.3-5-.7-1.5-.5-2.8-1.1-3.9-2l1.6-3.5c2.2 1.5 4.6 2.3 7.3 2.3 1.5 0 2.5-.2 3.3-.7.7-.5 1.1-1 1.1-1.9 0-.7-.3-1.3-1-1.7s-2-.8-3.7-1.2c-2-.4-3.6-.9-4.8-1.5-1.1-.5-2-1.2-2.6-2-.5-1-.8-2-.8-3.2 0-1.4.4-2.6 1.2-3.6.7-1.1 1.8-2 3.2-2.6 1.3-.6 2.9-.9 4.7-.9 1.6 0 3.1.3 4.6.7 1.5.5 2.7 1.1 3.5 2l-1.6 3.5c-2-1.5-4.2-2.3-6.5-2.3-1.3 0-2.3.2-3 .8-.8.5-1.2 1.1-1.2 2 0 .5.2 1 .5 1.3.2.3.7.6 1.4.9l2.9.8c2.9.6 5 1.4 6.2 2.4a5 5 0 0 1 2 4.2 6 6 0 0 1-2.5 5c-1.7 1.2-4 1.9-7 1.9zm21-3.6l1.4-.1-.2 3.5-1.9.1c-2.4 0-4.1-.5-5.2-1.5-1.1-1-1.6-2.7-1.6-4.8v-6h-3v-3.6h3V11h4.8v4.6h4v3.6h-4v6c0 1.8.9 2.8 2.6 2.8zm11.1 3.5c-1.6 0-3-.3-4.3-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.3-1 1.7 0 3.2.3 4.4 1a7 7 0 0 1 3 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.4 1zm0-3.6c2.4 0 3.6-1.6 3.6-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.6-1c-2.3 0-3.5 1.4-3.5 4.4 0 3 1.2 4.6 3.5 4.6zm21.7-8.8l-2.7.3c-1.3.2-2.3.5-2.8 1.2-.6.6-.9 1.4-.9 2.5v8.2H96V15.7h4.6v2.6c.8-1.8 2.5-2.8 5-3h1.3l.3 4zm14-3.5h4.8L116.4 37h-4.9l3-6.6-6.4-14.8h5l4 10 4-10zm16-.4c1.4 0 2.6.3 3.6 1 1 .6 1.9 1.6 2.5 2.8.6 1.2.9 2.7.9 4.3 0 1.6-.3 3-1 4.3a6.9 6.9 0 0 1-2.4 2.9c-1 .7-2.2 1-3.6 1-1 0-2-.2-3-.7-.8-.4-1.5-1-2-1.9v2.4h-4.7V8.8h4.8v9c.5-.8 1.2-1.4 2-1.9.9-.4 1.8-.6 3-.6zM135.7 28c1.1 0 2-.4 2.6-1.2.6-.8 1-2 1-3.4 0-1.5-.4-2.5-1-3.3s-1.5-1.1-2.6-1.1-2 .3-2.6 1.1c-.6.8-1 2-1 3.3 0 1.5.4 2.6 1 3.4.6.8 1.5 1.2 2.6 1.2zm18.9 3.6c-1.7 0-3.2-.3-4.4-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.4-1 1.6 0 3 .3 4.3 1a7 7 0 0 1 3 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.3 1zm0-3.6c2.3 0 3.5-1.6 3.5-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.5-1c-2.4 0-3.6 1.4-3.6 4.4 0 3 1.2 4.6 3.6 4.6zm18 3.6c-1.7 0-3.2-.3-4.4-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.4-1 1.6 0 3 .3 4.4 1a7 7 0 0 1 2.9 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.3 1zm0-3.6c2.3 0 3.5-1.6 3.5-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.5-1c-2.4 0-3.6 1.4-3.6 4.4 0 3 1.2 4.6 3.6 4.6zm27.4 3.4h-6l-6-7v7h-4.8V8.8h4.9v13.6l5.8-6.7h5.7l-6.6 7.5 7 8.2z"
-            fill="#333"
+            fill="currentColor"
           />
           <mask
             fill="#fff"
@@ -8282,9 +8044,11 @@ exports[`Storyshots UI|Sidebar/SidebarItem component 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
+  color: #333333;
 }
 
 .emotion-3:hover {
+  color: #333333;
   background: rgba(0,0,0,.05);
 }
 
@@ -8310,7 +8074,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem component 1`] = `
   margin-right: 6px;
   border-top: 3.5px solid transparent;
   border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid rgba(0,0,0,.2);
+  border-left: 3.5px solid rgba(0,0,0,0.3);
   -webkit-transition: -webkit-transform .1s ease-out;
   -webkit-transition: transform .1s ease-out;
   transition: transform .1s ease-out;
@@ -8342,9 +8106,11 @@ exports[`Storyshots UI|Sidebar/SidebarItem component 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
+  color: #333333;
 }
 
 .emotion-3:hover {
+  color: #333333;
   background: rgba(0,0,0,.05);
 }
 
@@ -8370,7 +8136,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem component 1`] = `
   margin-right: 6px;
   border-top: 3.5px solid transparent;
   border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid rgba(0,0,0,.2);
+  border-left: 3.5px solid rgba(0,0,0,0.3);
   -webkit-transition: -webkit-transform .1s ease-out;
   -webkit-transition: transform .1s ease-out;
   transition: transform .1s ease-out;
@@ -8428,9 +8194,11 @@ exports[`Storyshots UI|Sidebar/SidebarItem componentExpanded 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
+  color: #333333;
 }
 
 .emotion-3:hover {
+  color: #333333;
   background: rgba(0,0,0,.05);
 }
 
@@ -8441,7 +8209,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem componentExpanded 1`] = `
   margin-right: 6px;
   border-top: 3.5px solid transparent;
   border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid rgba(0,0,0,.2);
+  border-left: 3.5px solid rgba(0,0,0,0.3);
   -webkit-transition: -webkit-transform .1s ease-out;
   -webkit-transition: transform .1s ease-out;
   transition: transform .1s ease-out;
@@ -8491,9 +8259,11 @@ exports[`Storyshots UI|Sidebar/SidebarItem componentExpanded 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
+  color: #333333;
 }
 
 .emotion-3:hover {
+  color: #333333;
   background: rgba(0,0,0,.05);
 }
 
@@ -8504,7 +8274,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem componentExpanded 1`] = `
   margin-right: 6px;
   border-top: 3.5px solid transparent;
   border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid rgba(0,0,0,.2);
+  border-left: 3.5px solid rgba(0,0,0,0.3);
   -webkit-transition: -webkit-transform .1s ease-out;
   -webkit-transition: transform .1s ease-out;
   transition: transform .1s ease-out;
@@ -8580,9 +8350,11 @@ exports[`Storyshots UI|Sidebar/SidebarItem group 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
+  color: #333333;
 }
 
 .emotion-3:hover {
+  color: #333333;
   background: rgba(0,0,0,.05);
 }
 
@@ -8593,7 +8365,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem group 1`] = `
   margin-right: 6px;
   border-top: 3.5px solid transparent;
   border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid rgba(0,0,0,.2);
+  border-left: 3.5px solid rgba(0,0,0,0.3);
   -webkit-transition: -webkit-transform .1s ease-out;
   -webkit-transition: transform .1s ease-out;
   transition: transform .1s ease-out;
@@ -8640,9 +8412,11 @@ exports[`Storyshots UI|Sidebar/SidebarItem group 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
+  color: #333333;
 }
 
 .emotion-3:hover {
+  color: #333333;
   background: rgba(0,0,0,.05);
 }
 
@@ -8653,7 +8427,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem group 1`] = `
   margin-right: 6px;
   border-top: 3.5px solid transparent;
   border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid rgba(0,0,0,.2);
+  border-left: 3.5px solid rgba(0,0,0,0.3);
   -webkit-transition: -webkit-transform .1s ease-out;
   -webkit-transition: transform .1s ease-out;
   transition: transform .1s ease-out;
@@ -8751,7 +8525,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem loading 1`] = `
   margin-right: 6px;
   border-top: 3.5px solid transparent;
   border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid rgba(0,0,0,.2);
+  border-left: 3.5px solid rgba(0,0,0,0.3);
   -webkit-transition: -webkit-transform .1s ease-out;
   -webkit-transition: transform .1s ease-out;
   transition: transform .1s ease-out;
@@ -8858,7 +8632,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem loading 1`] = `
   margin-right: 6px;
   border-top: 3.5px solid transparent;
   border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid rgba(0,0,0,.2);
+  border-left: 3.5px solid rgba(0,0,0,0.3);
   -webkit-transition: -webkit-transform .1s ease-out;
   -webkit-transition: transform .1s ease-out;
   transition: transform .1s ease-out;
@@ -8966,9 +8740,11 @@ exports[`Storyshots UI|Sidebar/SidebarItem nestedDepths 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
+  color: #333333;
 }
 
 .emotion-3:hover {
+  color: #333333;
   background: rgba(0,0,0,.05);
 }
 
@@ -8979,7 +8755,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem nestedDepths 1`] = `
   margin-right: 6px;
   border-top: 3.5px solid transparent;
   border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid rgba(0,0,0,.2);
+  border-left: 3.5px solid rgba(0,0,0,0.3);
   -webkit-transition: -webkit-transform .1s ease-out;
   -webkit-transition: transform .1s ease-out;
   transition: transform .1s ease-out;
@@ -9010,7 +8786,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem nestedDepths 1`] = `
   margin-right: 6px;
   border-top: 3.5px solid transparent;
   border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid rgba(0,0,0,.2);
+  border-left: 3.5px solid rgba(0,0,0,0.3);
   -webkit-transition: -webkit-transform .1s ease-out;
   -webkit-transition: transform .1s ease-out;
   transition: transform .1s ease-out;
@@ -9039,9 +8815,11 @@ exports[`Storyshots UI|Sidebar/SidebarItem nestedDepths 1`] = `
   transition: background 75ms ease-out;
   padding-left: 24px;
   cursor: pointer;
+  color: #333333;
 }
 
 .emotion-11:hover {
+  color: #333333;
   background: rgba(0,0,0,.05);
 }
 
@@ -9067,7 +8845,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem nestedDepths 1`] = `
   margin-right: 6px;
   border-top: 3.5px solid transparent;
   border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid rgba(0,0,0,.2);
+  border-left: 3.5px solid rgba(0,0,0,0.3);
   -webkit-transition: -webkit-transform .1s ease-out;
   -webkit-transition: transform .1s ease-out;
   transition: transform .1s ease-out;
@@ -9110,9 +8888,11 @@ exports[`Storyshots UI|Sidebar/SidebarItem nestedDepths 1`] = `
   transition: background 75ms ease-out;
   padding-left: 39px;
   cursor: pointer;
+  color: #333333;
 }
 
 .emotion-15:hover {
+  color: #333333;
   background: rgba(0,0,0,.05);
 }
 
@@ -9138,9 +8918,11 @@ exports[`Storyshots UI|Sidebar/SidebarItem nestedDepths 1`] = `
   transition: background 75ms ease-out;
   padding-left: 54px;
   cursor: pointer;
+  color: #333333;
 }
 
 .emotion-19:hover {
+  color: #333333;
   background: rgba(0,0,0,.05);
 }
 
@@ -9170,9 +8952,11 @@ exports[`Storyshots UI|Sidebar/SidebarItem nestedDepths 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
+  color: #333333;
 }
 
 .emotion-3:hover {
+  color: #333333;
   background: rgba(0,0,0,.05);
 }
 
@@ -9183,7 +8967,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem nestedDepths 1`] = `
   margin-right: 6px;
   border-top: 3.5px solid transparent;
   border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid rgba(0,0,0,.2);
+  border-left: 3.5px solid rgba(0,0,0,0.3);
   -webkit-transition: -webkit-transform .1s ease-out;
   -webkit-transition: transform .1s ease-out;
   transition: transform .1s ease-out;
@@ -9214,7 +8998,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem nestedDepths 1`] = `
   margin-right: 6px;
   border-top: 3.5px solid transparent;
   border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid rgba(0,0,0,.2);
+  border-left: 3.5px solid rgba(0,0,0,0.3);
   -webkit-transition: -webkit-transform .1s ease-out;
   -webkit-transition: transform .1s ease-out;
   transition: transform .1s ease-out;
@@ -9243,9 +9027,11 @@ exports[`Storyshots UI|Sidebar/SidebarItem nestedDepths 1`] = `
   transition: background 75ms ease-out;
   padding-left: 24px;
   cursor: pointer;
+  color: #333333;
 }
 
 .emotion-11:hover {
+  color: #333333;
   background: rgba(0,0,0,.05);
 }
 
@@ -9271,7 +9057,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem nestedDepths 1`] = `
   margin-right: 6px;
   border-top: 3.5px solid transparent;
   border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid rgba(0,0,0,.2);
+  border-left: 3.5px solid rgba(0,0,0,0.3);
   -webkit-transition: -webkit-transform .1s ease-out;
   -webkit-transition: transform .1s ease-out;
   transition: transform .1s ease-out;
@@ -9314,9 +9100,11 @@ exports[`Storyshots UI|Sidebar/SidebarItem nestedDepths 1`] = `
   transition: background 75ms ease-out;
   padding-left: 39px;
   cursor: pointer;
+  color: #333333;
 }
 
 .emotion-15:hover {
+  color: #333333;
   background: rgba(0,0,0,.05);
 }
 
@@ -9342,9 +9130,11 @@ exports[`Storyshots UI|Sidebar/SidebarItem nestedDepths 1`] = `
   transition: background 75ms ease-out;
   padding-left: 54px;
   cursor: pointer;
+  color: #333333;
 }
 
 .emotion-19:hover {
+  color: #333333;
   background: rgba(0,0,0,.05);
 }
 
@@ -9478,9 +9268,11 @@ exports[`Storyshots UI|Sidebar/SidebarItem story 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
+  color: #333333;
 }
 
 .emotion-3:hover {
+  color: #333333;
   background: rgba(0,0,0,.05);
 }
 
@@ -9491,7 +9283,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem story 1`] = `
   margin-right: 6px;
   border-top: 3.5px solid transparent;
   border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid rgba(0,0,0,.2);
+  border-left: 3.5px solid rgba(0,0,0,0.3);
   -webkit-transition: -webkit-transform .1s ease-out;
   -webkit-transition: transform .1s ease-out;
   transition: transform .1s ease-out;
@@ -9539,9 +9331,11 @@ exports[`Storyshots UI|Sidebar/SidebarItem story 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
+  color: #333333;
 }
 
 .emotion-3:hover {
+  color: #333333;
   background: rgba(0,0,0,.05);
 }
 
@@ -9552,7 +9346,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem story 1`] = `
   margin-right: 6px;
   border-top: 3.5px solid transparent;
   border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid rgba(0,0,0,.2);
+  border-left: 3.5px solid rgba(0,0,0,0.3);
   -webkit-transition: -webkit-transform .1s ease-out;
   -webkit-transition: transform .1s ease-out;
   transition: transform .1s ease-out;
@@ -9611,7 +9405,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem storySelected 1`] = `
   margin-right: 6px;
   border-top: 3.5px solid transparent;
   border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid rgba(0,0,0,.2);
+  border-left: 3.5px solid rgba(0,0,0,0.3);
   -webkit-transition: -webkit-transform .1s ease-out;
   -webkit-transition: transform .1s ease-out;
   transition: transform .1s ease-out;
@@ -9658,6 +9452,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem storySelected 1`] = `
   cursor: default;
   background: #1EA7FD;
   color: #FFFFFF;
+  font-weight: 700;
 }
 
 .emotion-1 {
@@ -9671,7 +9466,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem storySelected 1`] = `
   margin-right: 6px;
   border-top: 3.5px solid transparent;
   border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid rgba(0,0,0,.2);
+  border-left: 3.5px solid rgba(0,0,0,0.3);
   -webkit-transition: -webkit-transform .1s ease-out;
   -webkit-transition: transform .1s ease-out;
   transition: transform .1s ease-out;
@@ -9718,6 +9513,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem storySelected 1`] = `
   cursor: default;
   background: #1EA7FD;
   color: #FFFFFF;
+  font-weight: 700;
 }
 
 <div
@@ -9772,9 +9568,11 @@ exports[`Storyshots UI|Sidebar/SidebarItem with long name 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
+  color: #333333;
 }
 
 .emotion-3:hover {
+  color: #333333;
   background: rgba(0,0,0,.05);
 }
 
@@ -9800,7 +9598,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem with long name 1`] = `
   margin-right: 6px;
   border-top: 3.5px solid transparent;
   border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid rgba(0,0,0,.2);
+  border-left: 3.5px solid rgba(0,0,0,0.3);
   -webkit-transition: -webkit-transform .1s ease-out;
   -webkit-transition: transform .1s ease-out;
   transition: transform .1s ease-out;
@@ -9832,9 +9630,11 @@ exports[`Storyshots UI|Sidebar/SidebarItem with long name 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
+  color: #333333;
 }
 
 .emotion-3:hover {
+  color: #333333;
   background: rgba(0,0,0,.05);
 }
 
@@ -9860,7 +9660,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem with long name 1`] = `
   margin-right: 6px;
   border-top: 3.5px solid transparent;
   border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid rgba(0,0,0,.2);
+  border-left: 3.5px solid rgba(0,0,0,0.3);
   -webkit-transition: -webkit-transform .1s ease-out;
   -webkit-transition: transform .1s ease-out;
   transition: transform .1s ease-out;
@@ -9967,7 +9767,7 @@ exports[`Storyshots UI|Sidebar/SidebarSearch filledIn 1`] = `
   display: block;
   height: 8px;
   width: 8px;
-  color: #666666;
+  color: #333333;
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
 }
@@ -9976,15 +9776,11 @@ exports[`Storyshots UI|Sidebar/SidebarSearch filledIn 1`] = `
   background: rgba(0,0,0,0.2);
 }
 
-.emotion-5:hover > svg {
-  color: #444444;
-}
-
 .emotion-6 {
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
   border-bottom: 1px solid transparent;
-  border-bottom-color: #666666;
+  border-bottom-color: rgba(0,0,0,0.4);
   outline: 0;
   position: relative;
 }
@@ -10015,7 +9811,8 @@ exports[`Storyshots UI|Sidebar/SidebarSearch filledIn 1`] = `
 .emotion-6 > svg path {
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
-  fill: #666666;
+  fill: currentColor;
+  opacity: 1;
 }
 
 .emotion-2 {
@@ -10093,7 +9890,7 @@ exports[`Storyshots UI|Sidebar/SidebarSearch filledIn 1`] = `
   display: block;
   height: 8px;
   width: 8px;
-  color: #666666;
+  color: #333333;
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
 }
@@ -10102,15 +9899,11 @@ exports[`Storyshots UI|Sidebar/SidebarSearch filledIn 1`] = `
   background: rgba(0,0,0,0.2);
 }
 
-.emotion-5:hover > svg {
-  color: #444444;
-}
-
 .emotion-6 {
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
   border-bottom: 1px solid transparent;
-  border-bottom-color: #666666;
+  border-bottom-color: rgba(0,0,0,0.4);
   outline: 0;
   position: relative;
 }
@@ -10141,11 +9934,12 @@ exports[`Storyshots UI|Sidebar/SidebarSearch filledIn 1`] = `
 .emotion-6 > svg path {
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
-  fill: #666666;
+  fill: currentColor;
+  opacity: 1;
 }
 
 <div
-  style="width:240px;margin:1rem;padding:1rem;background:white"
+  style="width:240px;margin:1rem;padding:1rem;background:#999"
 >
   <form
     autocomplete="off"
@@ -10262,7 +10056,7 @@ exports[`Storyshots UI|Sidebar/SidebarSearch focussed 1`] = `
   display: block;
   height: 8px;
   width: 8px;
-  color: #666666;
+  color: #333333;
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
 }
@@ -10271,15 +10065,11 @@ exports[`Storyshots UI|Sidebar/SidebarSearch focussed 1`] = `
   background: rgba(0,0,0,0.2);
 }
 
-.emotion-5:hover > svg {
-  color: #444444;
-}
-
 .emotion-6 {
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
   border-bottom: 1px solid transparent;
-  border-bottom-color: #666666;
+  border-bottom-color: rgba(0,0,0,0.4);
   outline: 0;
   position: relative;
 }
@@ -10310,7 +10100,8 @@ exports[`Storyshots UI|Sidebar/SidebarSearch focussed 1`] = `
 .emotion-6 > svg path {
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
-  fill: #666666;
+  fill: currentColor;
+  opacity: 1;
 }
 
 .emotion-2 {
@@ -10388,7 +10179,7 @@ exports[`Storyshots UI|Sidebar/SidebarSearch focussed 1`] = `
   display: block;
   height: 8px;
   width: 8px;
-  color: #666666;
+  color: #333333;
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
 }
@@ -10397,15 +10188,11 @@ exports[`Storyshots UI|Sidebar/SidebarSearch focussed 1`] = `
   background: rgba(0,0,0,0.2);
 }
 
-.emotion-5:hover > svg {
-  color: #444444;
-}
-
 .emotion-6 {
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
   border-bottom: 1px solid transparent;
-  border-bottom-color: #666666;
+  border-bottom-color: rgba(0,0,0,0.4);
   outline: 0;
   position: relative;
 }
@@ -10436,11 +10223,12 @@ exports[`Storyshots UI|Sidebar/SidebarSearch focussed 1`] = `
 .emotion-6 > svg path {
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
-  fill: #666666;
+  fill: currentColor;
+  opacity: 1;
 }
 
 <div
-  style="width:240px;margin:1rem;padding:1rem;background:white"
+  style="width:240px;margin:1rem;padding:1rem;background:#999"
 >
   <form
     autocomplete="off"
@@ -10556,7 +10344,7 @@ exports[`Storyshots UI|Sidebar/SidebarSearch simple 1`] = `
   display: block;
   height: 8px;
   width: 8px;
-  color: #666666;
+  color: #333333;
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
 }
@@ -10565,10 +10353,6 @@ exports[`Storyshots UI|Sidebar/SidebarSearch simple 1`] = `
   background: rgba(0,0,0,0.2);
 }
 
-.emotion-5:hover > svg {
-  color: #444444;
-}
-
 .emotion-6 {
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
@@ -10604,7 +10388,8 @@ exports[`Storyshots UI|Sidebar/SidebarSearch simple 1`] = `
 .emotion-6 > svg path {
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
-  fill: #999999;
+  fill: currentColor;
+  opacity: 0.3;
 }
 
 .emotion-2 {
@@ -10682,7 +10467,7 @@ exports[`Storyshots UI|Sidebar/SidebarSearch simple 1`] = `
   display: block;
   height: 8px;
   width: 8px;
-  color: #666666;
+  color: #333333;
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
 }
@@ -10691,10 +10476,6 @@ exports[`Storyshots UI|Sidebar/SidebarSearch simple 1`] = `
   background: rgba(0,0,0,0.2);
 }
 
-.emotion-5:hover > svg {
-  color: #444444;
-}
-
 .emotion-6 {
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
@@ -10730,11 +10511,12 @@ exports[`Storyshots UI|Sidebar/SidebarSearch simple 1`] = `
 .emotion-6 > svg path {
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
-  fill: #999999;
+  fill: currentColor;
+  opacity: 0.3;
 }
 
 <div
-  style="width:240px;margin:1rem;padding:1rem;background:white"
+  style="width:240px;margin:1rem;padding:1rem;background:#999"
 >
   <form
     autocomplete="off"
@@ -10778,7 +10560,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories empty 1`] = `
 .emotion-4 {
   padding: 30px;
   text-align: center;
-  color: #666666;
+  color: #333333;
   font-size: 13px;
 }
 
@@ -10845,7 +10627,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories empty 1`] = `
 .emotion-4 {
   padding: 30px;
   text-align: center;
-  color: #666666;
+  color: #333333;
   font-size: 13px;
 }
 
@@ -10996,7 +10778,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories loading 1`] = `
   margin-right: 6px;
   border-top: 3.5px solid transparent;
   border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid rgba(0,0,0,.2);
+  border-left: 3.5px solid rgba(0,0,0,0.3);
   -webkit-transition: -webkit-transform .1s ease-out;
   -webkit-transition: transform .1s ease-out;
   transition: transform .1s ease-out;
@@ -11216,7 +10998,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories loading 1`] = `
   margin-right: 6px;
   border-top: 3.5px solid transparent;
   border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid rgba(0,0,0,.2);
+  border-left: 3.5px solid rgba(0,0,0,0.3);
   -webkit-transition: -webkit-transform .1s ease-out;
   -webkit-transition: transform .1s ease-out;
   transition: transform .1s ease-out;
@@ -11767,7 +11549,8 @@ exports[`Storyshots UI|Sidebar/SidebarStories noRoot 1`] = `
 .emotion-6 > svg path {
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
-  fill: #999999;
+  fill: currentColor;
+  opacity: 0.3;
 }
 
 .emotion-0 {
@@ -11833,7 +11616,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories noRoot 1`] = `
   display: block;
   height: 8px;
   width: 8px;
-  color: #666666;
+  color: #333333;
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
 }
@@ -11842,10 +11625,6 @@ exports[`Storyshots UI|Sidebar/SidebarStories noRoot 1`] = `
   background: rgba(0,0,0,0.2);
 }
 
-.emotion-5:hover > svg {
-  color: #444444;
-}
-
 .emotion-39 + section {
   margin-top: 20px;
 }
@@ -11887,9 +11666,11 @@ exports[`Storyshots UI|Sidebar/SidebarStories noRoot 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
+  color: #333333;
 }
 
 .emotion-10:hover {
+  color: #333333;
   background: rgba(0,0,0,.05);
 }
 
@@ -11900,7 +11681,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories noRoot 1`] = `
   margin-right: 6px;
   border-top: 3.5px solid transparent;
   border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid rgba(0,0,0,.2);
+  border-left: 3.5px solid rgba(0,0,0,0.3);
   -webkit-transition: -webkit-transform .1s ease-out;
   -webkit-transition: transform .1s ease-out;
   transition: transform .1s ease-out;
@@ -11931,7 +11712,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories noRoot 1`] = `
   margin-right: 6px;
   border-top: 3.5px solid transparent;
   border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid rgba(0,0,0,.2);
+  border-left: 3.5px solid rgba(0,0,0,0.3);
   -webkit-transition: -webkit-transform .1s ease-out;
   -webkit-transition: transform .1s ease-out;
   transition: transform .1s ease-out;
@@ -11976,9 +11757,11 @@ exports[`Storyshots UI|Sidebar/SidebarStories noRoot 1`] = `
   transition: background 75ms ease-out;
   padding-left: 24px;
   cursor: pointer;
+  color: #333333;
 }
 
 .emotion-15:hover {
+  color: #333333;
   background: rgba(0,0,0,.05);
 }
 
@@ -12004,7 +11787,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories noRoot 1`] = `
   margin-right: 6px;
   border-top: 3.5px solid transparent;
   border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid rgba(0,0,0,.2);
+  border-left: 3.5px solid rgba(0,0,0,0.3);
   -webkit-transition: -webkit-transform .1s ease-out;
   -webkit-transition: transform .1s ease-out;
   transition: transform .1s ease-out;
@@ -12047,9 +11830,11 @@ exports[`Storyshots UI|Sidebar/SidebarStories noRoot 1`] = `
   transition: background 75ms ease-out;
   padding-left: 39px;
   cursor: pointer;
+  color: #333333;
 }
 
 .emotion-30:hover {
+  color: #333333;
   background: rgba(0,0,0,.05);
 }
 
@@ -12085,6 +11870,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories noRoot 1`] = `
   cursor: default;
   background: #1EA7FD;
   color: #FFFFFF;
+  font-weight: 700;
 }
 
 .emotion-2 {
@@ -12135,7 +11921,8 @@ exports[`Storyshots UI|Sidebar/SidebarStories noRoot 1`] = `
 .emotion-6 > svg path {
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
-  fill: #999999;
+  fill: currentColor;
+  opacity: 0.3;
 }
 
 .emotion-0 {
@@ -12201,7 +11988,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories noRoot 1`] = `
   display: block;
   height: 8px;
   width: 8px;
-  color: #666666;
+  color: #333333;
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
 }
@@ -12210,10 +11997,6 @@ exports[`Storyshots UI|Sidebar/SidebarStories noRoot 1`] = `
   background: rgba(0,0,0,0.2);
 }
 
-.emotion-5:hover > svg {
-  color: #444444;
-}
-
 .emotion-39 + section {
   margin-top: 20px;
 }
@@ -12255,9 +12038,11 @@ exports[`Storyshots UI|Sidebar/SidebarStories noRoot 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
+  color: #333333;
 }
 
 .emotion-10:hover {
+  color: #333333;
   background: rgba(0,0,0,.05);
 }
 
@@ -12268,7 +12053,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories noRoot 1`] = `
   margin-right: 6px;
   border-top: 3.5px solid transparent;
   border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid rgba(0,0,0,.2);
+  border-left: 3.5px solid rgba(0,0,0,0.3);
   -webkit-transition: -webkit-transform .1s ease-out;
   -webkit-transition: transform .1s ease-out;
   transition: transform .1s ease-out;
@@ -12299,7 +12084,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories noRoot 1`] = `
   margin-right: 6px;
   border-top: 3.5px solid transparent;
   border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid rgba(0,0,0,.2);
+  border-left: 3.5px solid rgba(0,0,0,0.3);
   -webkit-transition: -webkit-transform .1s ease-out;
   -webkit-transition: transform .1s ease-out;
   transition: transform .1s ease-out;
@@ -12344,9 +12129,11 @@ exports[`Storyshots UI|Sidebar/SidebarStories noRoot 1`] = `
   transition: background 75ms ease-out;
   padding-left: 24px;
   cursor: pointer;
+  color: #333333;
 }
 
 .emotion-15:hover {
+  color: #333333;
   background: rgba(0,0,0,.05);
 }
 
@@ -12372,7 +12159,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories noRoot 1`] = `
   margin-right: 6px;
   border-top: 3.5px solid transparent;
   border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid rgba(0,0,0,.2);
+  border-left: 3.5px solid rgba(0,0,0,0.3);
   -webkit-transition: -webkit-transform .1s ease-out;
   -webkit-transition: transform .1s ease-out;
   transition: transform .1s ease-out;
@@ -12415,9 +12202,11 @@ exports[`Storyshots UI|Sidebar/SidebarStories noRoot 1`] = `
   transition: background 75ms ease-out;
   padding-left: 39px;
   cursor: pointer;
+  color: #333333;
 }
 
 .emotion-30:hover {
+  color: #333333;
   background: rgba(0,0,0,.05);
 }
 
@@ -12453,6 +12242,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories noRoot 1`] = `
   cursor: default;
   background: #1EA7FD;
   color: #FFFFFF;
+  font-weight: 700;
 }
 
 <div
@@ -12720,7 +12510,8 @@ exports[`Storyshots UI|Sidebar/SidebarStories withRoot 1`] = `
 .emotion-6 > svg path {
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
-  fill: #999999;
+  fill: currentColor;
+  opacity: 0.3;
 }
 
 .emotion-0 {
@@ -12786,7 +12577,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories withRoot 1`] = `
   display: block;
   height: 8px;
   width: 8px;
-  color: #666666;
+  color: #333333;
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
 }
@@ -12795,10 +12586,6 @@ exports[`Storyshots UI|Sidebar/SidebarStories withRoot 1`] = `
   background: rgba(0,0,0,0.2);
 }
 
-.emotion-5:hover > svg {
-  color: #444444;
-}
-
 .emotion-24 + section {
   margin-top: 20px;
 }
@@ -12813,10 +12600,10 @@ exports[`Storyshots UI|Sidebar/SidebarStories withRoot 1`] = `
   -ms-letter-spacing: 0.35em;
   letter-spacing: 0.35em;
   text-transform: uppercase;
-  font-weight: 700;
+  font-weight: 900;
   font-size: 11px;
   line-height: 24px;
-  color: #999999;
+  color: rgba(51,51,51,0.5);
   margin: 0 20px;
 }
 
@@ -12853,9 +12640,11 @@ exports[`Storyshots UI|Sidebar/SidebarStories withRoot 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
+  color: #333333;
 }
 
 .emotion-11:hover {
+  color: #333333;
   background: rgba(0,0,0,.05);
 }
 
@@ -12866,7 +12655,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories withRoot 1`] = `
   margin-right: 6px;
   border-top: 3.5px solid transparent;
   border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid rgba(0,0,0,.2);
+  border-left: 3.5px solid rgba(0,0,0,0.3);
   -webkit-transition: -webkit-transform .1s ease-out;
   -webkit-transition: transform .1s ease-out;
   transition: transform .1s ease-out;
@@ -12914,6 +12703,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories withRoot 1`] = `
   cursor: default;
   background: #1EA7FD;
   color: #FFFFFF;
+  font-weight: 700;
 }
 
 .emotion-13 {
@@ -12923,7 +12713,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories withRoot 1`] = `
   margin-right: 6px;
   border-top: 3.5px solid transparent;
   border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid rgba(0,0,0,.2);
+  border-left: 3.5px solid rgba(0,0,0,0.3);
   -webkit-transition: -webkit-transform .1s ease-out;
   -webkit-transition: transform .1s ease-out;
   transition: transform .1s ease-out;
@@ -12968,9 +12758,11 @@ exports[`Storyshots UI|Sidebar/SidebarStories withRoot 1`] = `
   transition: background 75ms ease-out;
   padding-left: 24px;
   cursor: pointer;
+  color: #333333;
 }
 
 .emotion-21:hover {
+  color: #333333;
   background: rgba(0,0,0,.05);
 }
 
@@ -12996,7 +12788,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories withRoot 1`] = `
   margin-right: 6px;
   border-top: 3.5px solid transparent;
   border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid rgba(0,0,0,.2);
+  border-left: 3.5px solid rgba(0,0,0,0.3);
   -webkit-transition: -webkit-transform .1s ease-out;
   -webkit-transition: transform .1s ease-out;
   transition: transform .1s ease-out;
@@ -13073,7 +12865,8 @@ exports[`Storyshots UI|Sidebar/SidebarStories withRoot 1`] = `
 .emotion-6 > svg path {
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
-  fill: #999999;
+  fill: currentColor;
+  opacity: 0.3;
 }
 
 .emotion-0 {
@@ -13139,7 +12932,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories withRoot 1`] = `
   display: block;
   height: 8px;
   width: 8px;
-  color: #666666;
+  color: #333333;
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
 }
@@ -13148,10 +12941,6 @@ exports[`Storyshots UI|Sidebar/SidebarStories withRoot 1`] = `
   background: rgba(0,0,0,0.2);
 }
 
-.emotion-5:hover > svg {
-  color: #444444;
-}
-
 .emotion-24 + section {
   margin-top: 20px;
 }
@@ -13166,10 +12955,10 @@ exports[`Storyshots UI|Sidebar/SidebarStories withRoot 1`] = `
   -ms-letter-spacing: 0.35em;
   letter-spacing: 0.35em;
   text-transform: uppercase;
-  font-weight: 700;
+  font-weight: 900;
   font-size: 11px;
   line-height: 24px;
-  color: #999999;
+  color: rgba(51,51,51,0.5);
   margin: 0 20px;
 }
 
@@ -13206,9 +12995,11 @@ exports[`Storyshots UI|Sidebar/SidebarStories withRoot 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
+  color: #333333;
 }
 
 .emotion-11:hover {
+  color: #333333;
   background: rgba(0,0,0,.05);
 }
 
@@ -13219,7 +13010,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories withRoot 1`] = `
   margin-right: 6px;
   border-top: 3.5px solid transparent;
   border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid rgba(0,0,0,.2);
+  border-left: 3.5px solid rgba(0,0,0,0.3);
   -webkit-transition: -webkit-transform .1s ease-out;
   -webkit-transition: transform .1s ease-out;
   transition: transform .1s ease-out;
@@ -13267,6 +13058,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories withRoot 1`] = `
   cursor: default;
   background: #1EA7FD;
   color: #FFFFFF;
+  font-weight: 700;
 }
 
 .emotion-13 {
@@ -13276,7 +13068,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories withRoot 1`] = `
   margin-right: 6px;
   border-top: 3.5px solid transparent;
   border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid rgba(0,0,0,.2);
+  border-left: 3.5px solid rgba(0,0,0,0.3);
   -webkit-transition: -webkit-transform .1s ease-out;
   -webkit-transition: transform .1s ease-out;
   transition: transform .1s ease-out;
@@ -13321,9 +13113,11 @@ exports[`Storyshots UI|Sidebar/SidebarStories withRoot 1`] = `
   transition: background 75ms ease-out;
   padding-left: 24px;
   cursor: pointer;
+  color: #333333;
 }
 
 .emotion-21:hover {
+  color: #333333;
   background: rgba(0,0,0,.05);
 }
 
@@ -13349,7 +13143,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories withRoot 1`] = `
   margin-right: 6px;
   border-top: 3.5px solid transparent;
   border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid rgba(0,0,0,.2);
+  border-left: 3.5px solid rgba(0,0,0,0.3);
   -webkit-transition: -webkit-transform .1s ease-out;
   -webkit-transition: transform .1s ease-out;
   transition: transform .1s ease-out;
diff --git a/lib/components/src/ActionBar/ActionBar.js b/lib/components/src/ActionBar/ActionBar.js
index 74928eb99e6..ea1b492badb 100644
--- a/lib/components/src/ActionBar/ActionBar.js
+++ b/lib/components/src/ActionBar/ActionBar.js
@@ -9,7 +9,7 @@ const Container = styled.div(({ theme }) => ({
   right: 0,
   maxWidth: '100%',
   display: 'flex',
-  background: theme.background.bar,
+  background: theme.background.content,
 }));
 
 export const ActionButton = styled.button(({ theme }) => ({
@@ -19,8 +19,8 @@ export const ActionButton = styled.button(({ theme }) => ({
   display: 'flex',
   alignItems: 'center',
 
-  color: theme.color.dark,
-  background: theme.background.bar,
+  color: theme.color.defaultText,
+  background: theme.background.content,
 
   fontSize: 12,
   lineHeight: '16px',
diff --git a/lib/components/src/Badge/Badge.js b/lib/components/src/Badge/Badge.js
index 8be51258c5a..fe3ee497e22 100644
--- a/lib/components/src/Badge/Badge.js
+++ b/lib/components/src/Badge/Badge.js
@@ -8,12 +8,17 @@ const BadgeWrapper = styled.div`
   line-height: 12px;
   padding: 4px 12px;
   border-radius: 3em;
+  font-weight: ${props => props.theme.typography.weight.bold};
 
   svg {
     height: 12px;
     width: 12px;
     margin-right: 4px;
     margin-top: -2px;
+
+    path {
+      fill: currentColor;
+    }
   }
 
   ${props =>
@@ -21,9 +26,6 @@ const BadgeWrapper = styled.div`
     css`
       color: ${props.theme.color.positive};
       background: ${props.theme.background.positive};
-      svg path {
-        fill: ${props.theme.color.positive};
-      }
     `};
 
   ${props =>
@@ -31,9 +33,6 @@ const BadgeWrapper = styled.div`
     css`
       color: ${props.theme.color.negative};
       background: ${props.theme.background.negative};
-      svg path {
-        fill: ${props.theme.color.negative};
-      }
     `};
 
   ${props =>
@@ -41,9 +40,6 @@ const BadgeWrapper = styled.div`
     css`
       color: ${props.theme.color.dark};
       background: ${props.theme.color.mediumlight};
-      svg path {
-        fill: ${props.theme.color.dark};
-      }
     `};
 `;
 
diff --git a/lib/components/src/Badge/__snapshots__/Badge.stories.storyshot b/lib/components/src/Badge/__snapshots__/Badge.stories.storyshot
index c8d675799ac..92620058705 100644
--- a/lib/components/src/Badge/__snapshots__/Badge.stories.storyshot
+++ b/lib/components/src/Badge/__snapshots__/Badge.stories.storyshot
@@ -8,6 +8,7 @@ exports[`Storyshots Basics|Badge all badges 1`] = `
   line-height: 12px;
   padding: 4px 12px;
   border-radius: 3em;
+  font-weight: 700;
   color: #66BF3C;
   background: #E1FFD4;
 }
@@ -20,7 +21,7 @@ exports[`Storyshots Basics|Badge all badges 1`] = `
 }
 
 .emotion-0 svg path {
-  fill: #66BF3C;
+  fill: currentColor;
 }
 
 .emotion-1 {
@@ -30,6 +31,7 @@ exports[`Storyshots Basics|Badge all badges 1`] = `
   line-height: 12px;
   padding: 4px 12px;
   border-radius: 3em;
+  font-weight: 700;
   color: #FF4400;
   background: #FEDED2;
 }
@@ -42,7 +44,7 @@ exports[`Storyshots Basics|Badge all badges 1`] = `
 }
 
 .emotion-1 svg path {
-  fill: #FF4400;
+  fill: currentColor;
 }
 
 .emotion-2 {
@@ -52,6 +54,7 @@ exports[`Storyshots Basics|Badge all badges 1`] = `
   line-height: 12px;
   padding: 4px 12px;
   border-radius: 3em;
+  font-weight: 700;
   color: #666666;
   background: #EEEEEE;
 }
@@ -64,7 +67,7 @@ exports[`Storyshots Basics|Badge all badges 1`] = `
 }
 
 .emotion-2 svg path {
-  fill: #666666;
+  fill: currentColor;
 }
 
 <div>
diff --git a/lib/components/src/Button/Button.js b/lib/components/src/Button/Button.js
index 4139784129b..ce560575062 100644
--- a/lib/components/src/Button/Button.js
+++ b/lib/components/src/Button/Button.js
@@ -1,7 +1,7 @@
 import React, { Fragment } from 'react';
 import PropTypes from 'prop-types';
 import { styled, css } from '@storybook/theming';
-import { darken, rgba } from 'polished';
+import { darken, lighten, rgba, transparentize } from 'polished';
 
 const Text = styled.span`
   display: inline-block;
@@ -16,14 +16,13 @@ const Loading = styled.span`
   opacity: 0;
 `;
 
-// prettier-ignore
 const ButtonWrapper = styled.button`
   border: 0;
   border-radius: 3em;
   cursor: pointer;
   display: inline-block;
   overflow: hidden;
-  padding: ${props => props.small ? '10px 16px' : '13px 20px'};
+  padding: ${props => (props.small ? '10px 16px' : '13px 20px')};
   position: relative;
   text-align: center;
   text-decoration: none;
@@ -37,263 +36,199 @@ const ButtonWrapper = styled.button`
   background: transparent;
 
 
-  font-size: ${props => props.small ? props.theme.typography.size.s1 : props.theme.typography.size.s2 - 1}px;
+  font-size: ${props =>
+    props.small ? props.theme.typography.size.s1 : props.theme.typography.size.s2 - 1}px;
   font-weight: ${props => props.theme.typography.weight.bold};
   line-height: 1;
 
-  ${props => !props.loading && css`
-    ${props.theme.animation.hoverable};
-
-    &:hover {
-      box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-    }
-  `}
-
-  & > span {
-    transform: scale3d(1,1,1) translate3d(0,0,0);
-    transition: transform 700ms ${props => props.theme.easing.rubber};
-    opacity: 1;
-  }
-
-  [role="progressbar"] {
-    transform: translate3d(0, 100%, 0);
-  }
 
   svg {
     display: inline-block;
-    height: ${props => props.small ? '14' : '16'}px;
-    width: ${props => props.small ? '14' : '16'}px;
+    height: ${props => (props.small ? '14' : '16')}px;
+    width: ${props => (props.small ? '14' : '16')}px;
     vertical-align: top;
-    margin-right: ${props => props.small ? '4' : '6'}px;
-    margin-top: ${props => props.small ? '-1' : '-2'}px;
-    margin-bottom: ${props => props.small ? '-1' : '-2'}px;
+    margin-right: ${props => (props.small ? '4' : '6')}px;
+    margin-top: ${props => (props.small ? '-1' : '-2')}px;
+    margin-bottom: ${props => (props.small ? '-1' : '-2')}px;
 
     /* Necessary for js mouse events to not glitch out when hovering on svgs */
     pointer-events: none;
+
+    path { fill: currentColor; }
   }
 
-  ${props => props.disabled && css`
-    cursor: not-allowed !important;
-		opacity: .5;
-    &:hover {
-      transform: none;
-    }
-	`}
-
-  ${props => props.unclickable && css`
-    cursor: default !important;
-		pointer-events: none;
-    &:hover {
-      transform: none;
-    }
-	`}
-
-  ${props => props.loading && css`
-    cursor: progress !important;
-    opacity: .7;
-
-    [role="progressbar"] {
-      transition: transform 700ms ${props.theme.easing.rubber};
-      transform: translate3d(0, -50%,0);
-      opacity: 1;
-    }
-
-    & > span {
-      transform: scale3d(0,0,1) translate3d(0,-100%,0);
-      opacity: 0;
-    }
-
-    &:hover {
-      transform: none;
-    }
-	`}
-
-  ${props => props.containsIcon && css`
-    svg {
-      display: block;
-      margin: 0;
-    }
-    ${props.small && css`
-  		padding: 7px;
-  	`}
-
-    ${!props.small && css`
-  		padding: 12px;
-  	`}
-  `}
-
-  ${props => props.primary && css`
-    background: ${props.theme.color.primary};
-    color: ${props.theme.color.lightest};
-    svg path { fill: ${props.theme.color.lightest}; }
-
-    ${!props.loading && css`
-      &:hover { background: ${darken(0.05, props.theme.color.primary)};}
-      &:active { box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset; }
-      &:focus { box-shadow: ${rgba(props.theme.color.primary, 0.4)} 0 1px 9px 2px; }
-      &:focus:hover { box-shadow: ${rgba(props.theme.color.primary, 0.2)} 0 8px 18px 0px;}
-    `}
-	`}
-
-  ${props => props.primary && props.active && css`
-    background: transparent;
-    box-shadow: ${props.theme.color.primary} 0 0 0 1px inset;
-    color: ${props.theme.color.primary};
-    svg path { fill: ${props.theme.color.primary}; }
-
-    ${!props.loading && css`
+  ${props =>
+    props.disabled &&
+    css`
+      cursor: not-allowed !important;
+      opacity: 0.5;
       &:hover {
-        background: transparent;
-        box-shadow: ${props.theme.color.primary} 0 0 0 1px inset;
+        transform: none;
+      }
+    `}
+
+  ${props =>
+    props.containsIcon &&
+    css`
+      svg {
+        display: block;
+        margin: 0;
+      }
+
+      ${props.small &&
+        css`
+          padding: 7px;
+        `}
+
+      ${!props.small &&
+        css`
+          padding: 12px;
+        `}
+    `}
+
+  /* Colored button for primary CTAs */
+  ${props =>
+    props.primary &&
+    css`
+      background: ${props.theme.color.primary};
+      color: ${props.theme.color.lightest};
+
+      &:hover {
+        background: ${darken(0.05, props.theme.color.primary)};
       }
       &:active {
-        box-shadow: ${props.theme.color.primary} 0 0 0 3em inset;
-        color: ${props.theme.color.lightest};
+        box-shadow: rgba(0, 0, 0, 0.1) 0 0 0 3em inset;
+      }
+      &:focus {
+        box-shadow: ${rgba(props.theme.color.primary, 0.4)} 0 1px 9px 2px;
+      }
+      &:focus:hover {
+        box-shadow: ${rgba(props.theme.color.primary, 0.2)} 0 8px 18px 0px;
       }
-      &:focus { box-shadow: ${props.theme.color.primary} 0 0 0 3em inset, ${rgba(props.theme.color.primary, 0.4)} 0 1px 9px 2px; }
-      &:focus:hover { box-shadow: ${props.theme.color.primary} 0 0 0 3em inset, ${rgba(props.theme.color.primary, 0.2)} 0 8px 18px 0px;}
     `}
 
-	`}
 
-  ${props => props.secondary && css`
-    background: ${props.theme.color.secondary};
-    color: ${props.theme.color.lightest};
-    svg path { fill: ${props.theme.color.lightest}; }
+  /* Colored button for secondary CTAs */
+  ${props =>
+    props.secondary &&
+    css`
+      background: ${props.theme.color.secondary};
+      color: ${props.theme.color.lightest};
 
-    ${!props.loading && css`
-      &:hover { background: ${darken(0.05, props.theme.color.secondary)}; }
-      &:active { box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset; }
-      &:focus { box-shadow: ${rgba(props.theme.color.secondary, 0.4)} 0 1px 9px 2px; }
-      &:focus:hover { box-shadow: ${rgba(props.theme.color.secondary, 0.2)} 0 8px 18px 0px;}
-    `}
-	`}
-
-  ${props => props.secondary && props.active && css`
-    background: transparent;
-    box-shadow: ${props.theme.color.secondary} 0 0 0 1px inset;
-    color: ${props.theme.color.secondary};
-    svg path { fill: ${props.theme.color.secondary}; }
-
-    ${!props.loading && css`
       &:hover {
-        background: transparent;
-        box-shadow: ${props.theme.color.secondary} 0 0 0 1px inset;
+        background: ${darken(0.05, props.theme.color.secondary)};
       }
       &:active {
-        box-shadow: ${props.theme.color.secondary} 0 0 0 3em inset;
-        color: ${props.theme.color.lightest};
+        box-shadow: rgba(0, 0, 0, 0.1) 0 0 0 3em inset;
+      }
+      &:focus {
+        box-shadow: ${rgba(props.theme.color.secondary, 0.4)} 0 1px 9px 2px;
+      }
+      &:focus:hover {
+        box-shadow: ${rgba(props.theme.color.secondary, 0.2)} 0 8px 18px 0px;
       }
-      &:focus { box-shadow: ${props.theme.color.secondary} 0 0 0 3em inset, ${rgba(props.theme.color.secondary, 0.4)} 0 1px 9px 2px; }
-      &:focus:hover { box-shadow: ${props.theme.color.secondary} 0 0 0 3em inset, ${rgba(props.theme.color.secondary, 0.2)} 0 8px 18px 0px;}
     `}
-	`}
 
-  ${props => props.tertiary && css`
-    background: ${props.theme.color.tertiary};
-    color: ${props.theme.color.darkest};
-    box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-    svg path { fill: ${props.theme.color.darkest}; }
+  /* Button for tertiary CTAs and forms that responds to theme */
+  ${props =>
+    props.tertiary &&
+    css`
+      background: ${props.theme.base === 'light'
+        ? darken(0.02, props.theme.input.background)
+        : lighten(0.02, props.theme.input.background)};
+      color: ${props.theme.input.color};
+      box-shadow: ${props.theme.input.border} 0 0 0 1px inset;
+      border-radius: ${props.theme.input.borderRadius}px;
 
-    ${!props.loading && css`
       &:hover {
-        ${props.inForm ?
-          'box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset'
-          :
-          'box-shadow: rgba(0,0,0,.2) 0 2px 6px 0, rgba(0,0,0,.1) 0 0 0 1px inset'
-        }
+        background: ${props.theme.base === 'light'
+          ? darken(0.05, props.theme.input.background)
+          : lighten(0.05, props.theme.input.background)};
+        ${props.inForm
+          ? ''
+          : 'box-shadow: rgba(0,0,0,.2) 0 2px 6px 0, rgba(0,0,0,.1) 0 0 0 1px inset'}
       }
-      &:active { box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset; }
-      &:focus { box-shadow: ${props.theme.color.secondary} 0 0 0 1px inset; }
-      &:focus:hover { box-shadow: ${props.theme.color.secondary} 0 0 0 1px inset;}
-    `}
-	`}
-
-  ${props => props.tertiary && props.active && css`
-    background: transparent;
-    box-shadow: ${props.theme.color.medium} 0 0 0 1px inset;
-    color: ${props.theme.color.darkest};
-    svg path { fill: ${props.theme.color.tertiary}; }
-
-    ${!props.loading && css`
-      &:hover {
-        background: transparent;
-        box-shadow: ${props.theme.color.medium} 0 0 0 1px inset;
-      }
-      &:focus { box-shadow: ${props.theme.color.medium} 0 0 0 1px inset, ${rgba(props.theme.color.tertiary, 0.4)} 0 1px 9px 2px; }
-      &:focus:hover { box-shadow: ${props.theme.color.medium} 0 0 0 1px inset, ${rgba(props.theme.color.tertiary, 0.2)} 0 8px 18px 0px;}
-    `}
-
-	`}
-
-  ${props => props.outline && css`
-    box-shadow: ${props.theme.color.medium} 0 0 0 1px inset;
-		color: ${props.theme.color.dark};
-    background: transparent;
-
-    svg path { fill: ${props.theme.color.dark}; }
-
-    ${!props.loading && css`
-      &:hover { box-shadow: ${props.theme.color.mediumdark} 0 0 0 1px inset; }
-
       &:active {
-        background: ${props.theme.color.medium};
-        box-shadow: ${props.theme.color.medium} 0 0 0 1px inset;
-        color: ${props.theme.color.darkest};
+        background: ${props.theme.base === 'light'
+          ? props.theme.input.background
+          : props.theme.input.background};
       }
-      
-    `};
+      &:focus {
+        box-shadow: ${rgba(props.theme.color.secondary, 0.4)} 0 0 0 1px inset;
+      }
+    `}
 
-    ${props.primary && css`
-      box-shadow: ${props.theme.color.primary} 0 0 0 1px inset;
-  		color: ${props.theme.color.primary};
-
-      svg path { fill: ${props.theme.color.primary}; }
+  /* Button that's outlined */
+  ${props =>
+    props.outline &&
+    css`
+      box-shadow: ${transparentize(0.8, props.theme.color.defaultText)} 0 0 0 1px inset;
+      color: ${transparentize(0.3, props.theme.color.defaultText)};
+      background: transparent;
 
       &:hover {
-        box-shadow: ${props.theme.color.primary} 0 0 0 1px inset;
-        background: transparent;
+        box-shadow: ${transparentize(0.5, props.theme.color.defaultText)} 0 0 0 1px inset;
       }
 
       &:active {
-        background: ${props.theme.color.primary};
-        box-shadow: ${props.theme.color.primary} 0 0 0 1px inset;
-        color: ${props.theme.color.lightest};
-        svg path { fill: ${props.theme.color.lightest}; }
-      }
-      &:focus { box-shadow: ${props.theme.color.primary} 0 0 0 1px inset, ${rgba(props.theme.color.primary, 0.4)} 0 1px 9px 2px; }
-      &:focus:hover { box-shadow: ${props.theme.color.primary} 0 0 0 1px inset, ${rgba(props.theme.color.primary, 0.2)} 0 8px 18px 0px;}
-    `};
-
-    ${props.secondary && css`
-      box-shadow: ${props.theme.color.secondary} 0 0 0 1px inset;
-  		color: ${props.theme.color.secondary};
-
-      svg path { fill: ${props.theme.color.secondary}; }
-
-      &:hover {
-        box-shadow: ${props.theme.color.secondary} 0 0 0 1px inset;
-        background: transparent;
+        box-shadow: ${transparentize(0.5, props.theme.color.defaultText)} 0 0 0 2px inset;
+        color: ${transparentize(0, props.theme.color.defaultText)};
       }
 
-      &:active {
-        background: ${props.theme.color.secondary};
-        box-shadow: ${props.theme.color.secondary} 0 0 0 1px inset;
-        color: ${props.theme.color.lightest};
-        svg path { fill: ${props.theme.color.lightest}; }
-      }
-      &:focus { box-shadow: ${props.theme.color.secondary} 0 0 0 1px inset, ${rgba(props.theme.color.secondary, 0.4)} 0 1px 9px 2px; }
-      &:focus:hover { box-shadow: ${props.theme.color.secondary} 0 0 0 1px inset, ${rgba(props.theme.color.secondary, 0.2)} 0 8px 18px 0px;}
-    `};
-	`}
+      ${props.primary &&
+        css`
+          box-shadow: ${props.theme.color.primary} 0 0 0 1px inset;
+          color: ${props.theme.color.primary};
 
-  ${props => props.outline && props.active && css`
-    background: ${props.theme.color.medium};
-    box-shadow: ${props.theme.color.medium} 0 0 0 1px inset;
-    color: ${props.theme.color.darkest};
+          svg path {
+            fill: ${props.theme.color.primary};
+          }
 
-    svg path { fill: ${props.theme.color.darkest}; }
-	`}
+          &:hover {
+            box-shadow: ${props.theme.color.primary} 0 0 0 1px inset;
+            background: transparent;
+          }
+
+          &:active {
+            background: ${props.theme.color.primary};
+            box-shadow: ${props.theme.color.primary} 0 0 0 1px inset;
+            color: ${props.theme.color.lightest};
+          }
+          &:focus {
+            box-shadow: ${props.theme.color.primary} 0 0 0 1px inset,
+              ${rgba(props.theme.color.primary, 0.4)} 0 1px 9px 2px;
+          }
+          &:focus:hover {
+            box-shadow: ${props.theme.color.primary} 0 0 0 1px inset,
+              ${rgba(props.theme.color.primary, 0.2)} 0 8px 18px 0px;
+          }
+        `};
+
+      ${props.secondary &&
+        css`
+          box-shadow: ${props.theme.color.secondary} 0 0 0 1px inset;
+          color: ${props.theme.color.secondary};
+
+          &:hover {
+            box-shadow: ${props.theme.color.secondary} 0 0 0 1px inset;
+            background: transparent;
+          }
+
+          &:active {
+            background: ${props.theme.color.secondary};
+            box-shadow: ${props.theme.color.secondary} 0 0 0 1px inset;
+            color: ${props.theme.color.lightest};
+          }
+          &:focus {
+            box-shadow: ${props.theme.color.secondary} 0 0 0 1px inset,
+              ${rgba(props.theme.color.secondary, 0.4)} 0 1px 9px 2px;
+          }
+          &:focus:hover {
+            box-shadow: ${props.theme.color.secondary} 0 0 0 1px inset,
+              ${rgba(props.theme.color.secondary, 0.2)} 0 8px 18px 0px;
+          }
+        `};
+    `}
 `;
 
 const ButtonLink = ButtonWrapper.withComponent('a');
diff --git a/lib/components/src/Button/Button.stories.js b/lib/components/src/Button/Button.stories.js
index 4c95401abfd..56b90db79eb 100644
--- a/lib/components/src/Button/Button.stories.js
+++ b/lib/components/src/Button/Button.stories.js
@@ -18,28 +18,12 @@ storiesOf('Basics|Button', module).add('all buttons', () => (
       Outline primary
     </Button>
     <Button outline secondary>
-      Outline primary
+      Outline secondary
     </Button>
     <Button primary disabled>
       Disabled
     </Button>
     <br />
-    <Button primary loading>
-      Primary
-    </Button>
-    <Button secondary loading>
-      Secondary
-    </Button>
-    <Button tertiary loading>
-      Tertiary
-    </Button>
-    <Button outline loading>
-      Outline
-    </Button>
-    <Button outline loading loadingText="Custom...">
-      Outline
-    </Button>
-    <br />
     <Button primary small>
       Primary
     </Button>
diff --git a/lib/components/src/Button/__snapshots__/Button.stories.storyshot b/lib/components/src/Button/__snapshots__/Button.stories.storyshot
index b7f437aef66..7c7590fff4b 100644
--- a/lib/components/src/Button/__snapshots__/Button.stories.storyshot
+++ b/lib/components/src/Button/__snapshots__/Button.stories.storyshot
@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Storyshots Basics|Button all buttons 1`] = `
-.emotion-29 {
+.emotion-14 {
   shape-rendering: inherit;
   -webkit-transform: translate3d(0,0,0);
   -ms-transform: translate3d(0,0,0);
@@ -9,7 +9,7 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   display: block;
 }
 
-.emotion-28 {
+.emotion-13 {
   fill: currentColor;
 }
 
@@ -41,16 +41,11 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -59,38 +54,6 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   z-index: 2;
 }
 
-.emotion-3:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-3:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-3:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-3 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-3 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-3 svg {
   display: inline-block;
   height: 14px;
@@ -103,23 +66,19 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
 }
 
 .emotion-3 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-3:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-3:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-3:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-3:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-3:hover {
@@ -156,47 +115,10 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   font-size: 13px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
   background: #FF4785;
   color: #FFFFFF;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 16px;
@@ -209,7 +131,7 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
 }
 
 .emotion-0 svg path {
-  fill: #FFFFFF;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
@@ -217,7 +139,7 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  box-shadow: rgba(0,0,0,0.1) 0 0 0 3em inset;
 }
 
 .emotion-0:focus {
@@ -256,47 +178,10 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   font-size: 13px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
   background: #1EA7FD;
   color: #FFFFFF;
 }
 
-.emotion-1:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-1:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-1:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-1 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-1 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-1 svg {
   display: inline-block;
   height: 16px;
@@ -309,7 +194,7 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
 }
 
 .emotion-1 svg path {
-  fill: #FFFFFF;
+  fill: currentColor;
 }
 
 .emotion-1:hover {
@@ -317,7 +202,7 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
 }
 
 .emotion-1:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  box-shadow: rgba(0,0,0,0.1) 0 0 0 3em inset;
 }
 
 .emotion-1:focus {
@@ -356,46 +241,10 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   font-size: 13px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-}
-
-.emotion-2:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-2:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-2:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-2 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-2 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
+  border-radius: 4px;
 }
 
 .emotion-2 svg {
@@ -410,23 +259,20 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
 }
 
 .emotion-2 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-2:hover {
+  background: #f2f2f2;
   box-shadow: rgba(0,0,0,.2) 0 2px 6px 0,rgba(0,0,0,.1) 0 0 0 1px inset;
 }
 
 .emotion-2:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-2:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-2:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-4 {
@@ -457,48 +303,11 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   font-size: 13px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #666666;
+  box-shadow: rgba(51,51,51,0.2) 0 0 0 1px inset;
+  color: rgba(51,51,51,0.7);
   background: transparent;
 }
 
-.emotion-4:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-4:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-4:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-4 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-4 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-4 svg {
   display: inline-block;
   height: 16px;
@@ -511,17 +320,16 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
 }
 
 .emotion-4 svg path {
-  fill: #666666;
+  fill: currentColor;
 }
 
 .emotion-4:hover {
-  box-shadow: #999999 0 0 0 1px inset;
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
 }
 
 .emotion-4:active {
-  background: #DDDDDD;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #333333;
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
+  color: #333;
 }
 
 .emotion-5 {
@@ -552,52 +360,15 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   font-size: 13px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
   background: #FF4785;
   color: #FFFFFF;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #666666;
+  box-shadow: rgba(51,51,51,0.2) 0 0 0 1px inset;
+  color: rgba(51,51,51,0.7);
   background: transparent;
   box-shadow: #FF4785 0 0 0 1px inset;
   color: #FF4785;
 }
 
-.emotion-5:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-5:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-5:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-5 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-5 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-5 svg {
   display: inline-block;
   height: 16px;
@@ -610,7 +381,7 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
 }
 
 .emotion-5 svg path {
-  fill: #FFFFFF;
+  fill: currentColor;
 }
 
 .emotion-5:hover {
@@ -618,7 +389,7 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
 }
 
 .emotion-5:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  box-shadow: rgba(0,0,0,0.1) 0 0 0 3em inset;
 }
 
 .emotion-5:focus {
@@ -629,18 +400,13 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   box-shadow: rgba(255,71,133,0.2) 0 8px 18px 0px;
 }
 
-.emotion-5 svg path {
-  fill: #666666;
-}
-
 .emotion-5:hover {
-  box-shadow: #999999 0 0 0 1px inset;
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
 }
 
 .emotion-5:active {
-  background: #DDDDDD;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #333333;
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
+  color: #333;
 }
 
 .emotion-5 svg path {
@@ -658,16 +424,12 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   color: #FFFFFF;
 }
 
-.emotion-5:active svg path {
-  fill: #FFFFFF;
-}
-
 .emotion-5:focus {
-  box-shadow: #FF4785 0 0 0 1px inset,rgba(255,71,133,0.4) 0 1px 9px 2px;
+  box-shadow: #FF4785 0 0 0 1px inset, rgba(255,71,133,0.4) 0 1px 9px 2px;
 }
 
 .emotion-5:focus:hover {
-  box-shadow: #FF4785 0 0 0 1px inset,rgba(255,71,133,0.2) 0 8px 18px 0px;
+  box-shadow: #FF4785 0 0 0 1px inset, rgba(255,71,133,0.2) 0 8px 18px 0px;
 }
 
 .emotion-6 {
@@ -698,52 +460,15 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   font-size: 13px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
   background: #1EA7FD;
   color: #FFFFFF;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #666666;
+  box-shadow: rgba(51,51,51,0.2) 0 0 0 1px inset;
+  color: rgba(51,51,51,0.7);
   background: transparent;
   box-shadow: #1EA7FD 0 0 0 1px inset;
   color: #1EA7FD;
 }
 
-.emotion-6:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-6:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-6:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-6 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-6 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-6 svg {
   display: inline-block;
   height: 16px;
@@ -756,7 +481,7 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
 }
 
 .emotion-6 svg path {
-  fill: #FFFFFF;
+  fill: currentColor;
 }
 
 .emotion-6:hover {
@@ -764,7 +489,7 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
 }
 
 .emotion-6:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  box-shadow: rgba(0,0,0,0.1) 0 0 0 3em inset;
 }
 
 .emotion-6:focus {
@@ -775,22 +500,13 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   box-shadow: rgba(30,167,253,0.2) 0 8px 18px 0px;
 }
 
-.emotion-6 svg path {
-  fill: #666666;
-}
-
 .emotion-6:hover {
-  box-shadow: #999999 0 0 0 1px inset;
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
 }
 
 .emotion-6:active {
-  background: #DDDDDD;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #333333;
-}
-
-.emotion-6 svg path {
-  fill: #1EA7FD;
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
+  color: #333;
 }
 
 .emotion-6:hover {
@@ -804,16 +520,12 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   color: #FFFFFF;
 }
 
-.emotion-6:active svg path {
-  fill: #FFFFFF;
-}
-
 .emotion-6:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset,rgba(30,167,253,0.4) 0 1px 9px 2px;
+  box-shadow: #1EA7FD 0 0 0 1px inset, rgba(30,167,253,0.4) 0 1px 9px 2px;
 }
 
 .emotion-6:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset,rgba(30,167,253,0.2) 0 8px 18px 0px;
+  box-shadow: #1EA7FD 0 0 0 1px inset, rgba(30,167,253,0.2) 0 8px 18px 0px;
 }
 
 .emotion-7 {
@@ -844,49 +556,12 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   font-size: 13px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
   cursor: not-allowed !important;
-  opacity: .5;
+  opacity: 0.5;
   background: #FF4785;
   color: #FFFFFF;
 }
 
-.emotion-7:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-7:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-7:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-7 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-7 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-7 svg {
   display: inline-block;
   height: 16px;
@@ -898,22 +573,22 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   pointer-events: none;
 }
 
+.emotion-7 svg path {
+  fill: currentColor;
+}
+
 .emotion-7:hover {
   -webkit-transform: none;
   -ms-transform: none;
   transform: none;
 }
 
-.emotion-7 svg path {
-  fill: #FFFFFF;
-}
-
 .emotion-7:hover {
   background: #ff2d74;
 }
 
 .emotion-7:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  box-shadow: rgba(0,0,0,0.1) 0 0 0 3em inset;
 }
 
 .emotion-7:focus {
@@ -924,13 +599,139 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   box-shadow: rgba(255,71,133,0.2) 0 8px 18px 0px;
 }
 
+.emotion-8 {
+  border: 0;
+  border-radius: 3em;
+  cursor: pointer;
+  display: inline-block;
+  overflow: hidden;
+  padding: 10px 16px;
+  position: relative;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  vertical-align: top;
+  white-space: nowrap;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  opacity: 1;
+  margin: 0;
+  background: transparent;
+  font-size: 12px;
+  font-weight: 700;
+  line-height: 1;
+  background: #FF4785;
+  color: #FFFFFF;
+}
+
+.emotion-8 svg {
+  display: inline-block;
+  height: 14px;
+  width: 14px;
+  vertical-align: top;
+  margin-right: 4px;
+  margin-top: -1px;
+  margin-bottom: -1px;
+  pointer-events: none;
+}
+
+.emotion-8 svg path {
+  fill: currentColor;
+}
+
+.emotion-8:hover {
+  background: #ff2d74;
+}
+
+.emotion-8:active {
+  box-shadow: rgba(0,0,0,0.1) 0 0 0 3em inset;
+}
+
+.emotion-8:focus {
+  box-shadow: rgba(255,71,133,0.4) 0 1px 9px 2px;
+}
+
+.emotion-8:focus:hover {
+  box-shadow: rgba(255,71,133,0.2) 0 8px 18px 0px;
+}
+
+.emotion-9 {
+  border: 0;
+  border-radius: 3em;
+  cursor: pointer;
+  display: inline-block;
+  overflow: hidden;
+  padding: 10px 16px;
+  position: relative;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  vertical-align: top;
+  white-space: nowrap;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  opacity: 1;
+  margin: 0;
+  background: transparent;
+  font-size: 12px;
+  font-weight: 700;
+  line-height: 1;
+  background: #1EA7FD;
+  color: #FFFFFF;
+}
+
+.emotion-9 svg {
+  display: inline-block;
+  height: 14px;
+  width: 14px;
+  vertical-align: top;
+  margin-right: 4px;
+  margin-top: -1px;
+  margin-bottom: -1px;
+  pointer-events: none;
+}
+
+.emotion-9 svg path {
+  fill: currentColor;
+}
+
+.emotion-9:hover {
+  background: #059dfd;
+}
+
+.emotion-9:active {
+  box-shadow: rgba(0,0,0,0.1) 0 0 0 3em inset;
+}
+
+.emotion-9:focus {
+  box-shadow: rgba(30,167,253,0.4) 0 1px 9px 2px;
+}
+
+.emotion-9:focus:hover {
+  box-shadow: rgba(30,167,253,0.2) 0 8px 18px 0px;
+}
+
 .emotion-10 {
   border: 0;
   border-radius: 3em;
   cursor: pointer;
   display: inline-block;
   overflow: hidden;
-  padding: 13px 20px;
+  padding: 10px 16px;
   position: relative;
   text-align: center;
   -webkit-text-decoration: none;
@@ -949,650 +750,44 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   opacity: 1;
   margin: 0;
   background: transparent;
-  font-size: 13px;
+  font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  cursor: progress !important;
-  opacity: .7;
-  background: #FF4785;
-  color: #FFFFFF;
-}
-
-.emotion-10 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-10 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
+  background: #fafafa;
+  color: #333333;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  border-radius: 4px;
 }
 
 .emotion-10 svg {
   display: inline-block;
-  height: 16px;
-  width: 16px;
+  height: 14px;
+  width: 14px;
   vertical-align: top;
-  margin-right: 6px;
-  margin-top: -2px;
-  margin-bottom: -2px;
+  margin-right: 4px;
+  margin-top: -1px;
+  margin-bottom: -1px;
   pointer-events: none;
 }
 
-.emotion-10 [role="progressbar"] {
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transform: translate3d(0,-50%,0);
-  -ms-transform: translate3d(0,-50%,0);
-  transform: translate3d(0,-50%,0);
-  opacity: 1;
-}
-
-.emotion-10 > span {
-  -webkit-transform: scale3d(0,0,1) translate3d(0,-100%,0);
-  -ms-transform: scale3d(0,0,1) translate3d(0,-100%,0);
-  transform: scale3d(0,0,1) translate3d(0,-100%,0);
-  opacity: 0;
-}
-
-.emotion-10:hover {
-  -webkit-transform: none;
-  -ms-transform: none;
-  transform: none;
-}
-
 .emotion-10 svg path {
-  fill: #FFFFFF;
+  fill: currentColor;
 }
 
-.emotion-8 {
-  display: inline-block;
-  vertical-align: top;
-}
-
-.emotion-9 {
-  position: absolute;
-  top: 50%;
-  left: 0;
-  right: 0;
-  opacity: 0;
-}
-
-.emotion-13 {
-  border: 0;
-  border-radius: 3em;
-  cursor: pointer;
-  display: inline-block;
-  overflow: hidden;
-  padding: 13px 20px;
-  position: relative;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  vertical-align: top;
-  white-space: nowrap;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-  user-select: none;
-  opacity: 1;
-  margin: 0;
-  background: transparent;
-  font-size: 13px;
-  font-weight: 700;
-  line-height: 1;
-  cursor: progress !important;
-  opacity: .7;
-  background: #1EA7FD;
-  color: #FFFFFF;
-}
-
-.emotion-13 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-13 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
-.emotion-13 svg {
-  display: inline-block;
-  height: 16px;
-  width: 16px;
-  vertical-align: top;
-  margin-right: 6px;
-  margin-top: -2px;
-  margin-bottom: -2px;
-  pointer-events: none;
-}
-
-.emotion-13 [role="progressbar"] {
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transform: translate3d(0,-50%,0);
-  -ms-transform: translate3d(0,-50%,0);
-  transform: translate3d(0,-50%,0);
-  opacity: 1;
-}
-
-.emotion-13 > span {
-  -webkit-transform: scale3d(0,0,1) translate3d(0,-100%,0);
-  -ms-transform: scale3d(0,0,1) translate3d(0,-100%,0);
-  transform: scale3d(0,0,1) translate3d(0,-100%,0);
-  opacity: 0;
-}
-
-.emotion-13:hover {
-  -webkit-transform: none;
-  -ms-transform: none;
-  transform: none;
-}
-
-.emotion-13 svg path {
-  fill: #FFFFFF;
-}
-
-.emotion-16 {
-  border: 0;
-  border-radius: 3em;
-  cursor: pointer;
-  display: inline-block;
-  overflow: hidden;
-  padding: 13px 20px;
-  position: relative;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  vertical-align: top;
-  white-space: nowrap;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-  user-select: none;
-  opacity: 1;
-  margin: 0;
-  background: transparent;
-  font-size: 13px;
-  font-weight: 700;
-  line-height: 1;
-  cursor: progress !important;
-  opacity: .7;
-  background: #FAFBFC;
-  color: #333333;
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-}
-
-.emotion-16 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-16 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
-.emotion-16 svg {
-  display: inline-block;
-  height: 16px;
-  width: 16px;
-  vertical-align: top;
-  margin-right: 6px;
-  margin-top: -2px;
-  margin-bottom: -2px;
-  pointer-events: none;
-}
-
-.emotion-16 [role="progressbar"] {
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transform: translate3d(0,-50%,0);
-  -ms-transform: translate3d(0,-50%,0);
-  transform: translate3d(0,-50%,0);
-  opacity: 1;
-}
-
-.emotion-16 > span {
-  -webkit-transform: scale3d(0,0,1) translate3d(0,-100%,0);
-  -ms-transform: scale3d(0,0,1) translate3d(0,-100%,0);
-  transform: scale3d(0,0,1) translate3d(0,-100%,0);
-  opacity: 0;
-}
-
-.emotion-16:hover {
-  -webkit-transform: none;
-  -ms-transform: none;
-  transform: none;
-}
-
-.emotion-16 svg path {
-  fill: #333333;
-}
-
-.emotion-19 {
-  border: 0;
-  border-radius: 3em;
-  cursor: pointer;
-  display: inline-block;
-  overflow: hidden;
-  padding: 13px 20px;
-  position: relative;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  vertical-align: top;
-  white-space: nowrap;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-  user-select: none;
-  opacity: 1;
-  margin: 0;
-  background: transparent;
-  font-size: 13px;
-  font-weight: 700;
-  line-height: 1;
-  cursor: progress !important;
-  opacity: .7;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #666666;
-  background: transparent;
-}
-
-.emotion-19 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-19 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
-.emotion-19 svg {
-  display: inline-block;
-  height: 16px;
-  width: 16px;
-  vertical-align: top;
-  margin-right: 6px;
-  margin-top: -2px;
-  margin-bottom: -2px;
-  pointer-events: none;
-}
-
-.emotion-19 [role="progressbar"] {
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transform: translate3d(0,-50%,0);
-  -ms-transform: translate3d(0,-50%,0);
-  transform: translate3d(0,-50%,0);
-  opacity: 1;
-}
-
-.emotion-19 > span {
-  -webkit-transform: scale3d(0,0,1) translate3d(0,-100%,0);
-  -ms-transform: scale3d(0,0,1) translate3d(0,-100%,0);
-  transform: scale3d(0,0,1) translate3d(0,-100%,0);
-  opacity: 0;
-}
-
-.emotion-19:hover {
-  -webkit-transform: none;
-  -ms-transform: none;
-  transform: none;
-}
-
-.emotion-19 svg path {
-  fill: #666666;
-}
-
-.emotion-23 {
-  border: 0;
-  border-radius: 3em;
-  cursor: pointer;
-  display: inline-block;
-  overflow: hidden;
-  padding: 10px 16px;
-  position: relative;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  vertical-align: top;
-  white-space: nowrap;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-  user-select: none;
-  opacity: 1;
-  margin: 0;
-  background: transparent;
-  font-size: 12px;
-  font-weight: 700;
-  line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FF4785;
-  color: #FFFFFF;
-}
-
-.emotion-23:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-23:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-23:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-23 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-23 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
-.emotion-23 svg {
-  display: inline-block;
-  height: 14px;
-  width: 14px;
-  vertical-align: top;
-  margin-right: 4px;
-  margin-top: -1px;
-  margin-bottom: -1px;
-  pointer-events: none;
-}
-
-.emotion-23 svg path {
-  fill: #FFFFFF;
-}
-
-.emotion-23:hover {
-  background: #ff2d74;
-}
-
-.emotion-23:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
-}
-
-.emotion-23:focus {
-  box-shadow: rgba(255,71,133,0.4) 0 1px 9px 2px;
-}
-
-.emotion-23:focus:hover {
-  box-shadow: rgba(255,71,133,0.2) 0 8px 18px 0px;
-}
-
-.emotion-24 {
-  border: 0;
-  border-radius: 3em;
-  cursor: pointer;
-  display: inline-block;
-  overflow: hidden;
-  padding: 10px 16px;
-  position: relative;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  vertical-align: top;
-  white-space: nowrap;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-  user-select: none;
-  opacity: 1;
-  margin: 0;
-  background: transparent;
-  font-size: 12px;
-  font-weight: 700;
-  line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #1EA7FD;
-  color: #FFFFFF;
-}
-
-.emotion-24:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-24:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-24:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-24 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-24 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
-.emotion-24 svg {
-  display: inline-block;
-  height: 14px;
-  width: 14px;
-  vertical-align: top;
-  margin-right: 4px;
-  margin-top: -1px;
-  margin-bottom: -1px;
-  pointer-events: none;
-}
-
-.emotion-24 svg path {
-  fill: #FFFFFF;
-}
-
-.emotion-24:hover {
-  background: #059dfd;
-}
-
-.emotion-24:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
-}
-
-.emotion-24:focus {
-  box-shadow: rgba(30,167,253,0.4) 0 1px 9px 2px;
-}
-
-.emotion-24:focus:hover {
-  box-shadow: rgba(30,167,253,0.2) 0 8px 18px 0px;
-}
-
-.emotion-25 {
-  border: 0;
-  border-radius: 3em;
-  cursor: pointer;
-  display: inline-block;
-  overflow: hidden;
-  padding: 10px 16px;
-  position: relative;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  vertical-align: top;
-  white-space: nowrap;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-  user-select: none;
-  opacity: 1;
-  margin: 0;
-  background: transparent;
-  font-size: 12px;
-  font-weight: 700;
-  line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
-  color: #333333;
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-}
-
-.emotion-25:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-25:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-25:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-25 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-25 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
-.emotion-25 svg {
-  display: inline-block;
-  height: 14px;
-  width: 14px;
-  vertical-align: top;
-  margin-right: 4px;
-  margin-top: -1px;
-  margin-bottom: -1px;
-  pointer-events: none;
-}
-
-.emotion-25 svg path {
-  fill: #333333;
-}
-
-.emotion-25:hover {
+.emotion-10:hover {
+  background: #f2f2f2;
   box-shadow: rgba(0,0,0,.2) 0 2px 6px 0,rgba(0,0,0,.1) 0 0 0 1px inset;
 }
 
-.emotion-25:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+.emotion-10:active {
+  background: #FFFFFF;
 }
 
-.emotion-25:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+.emotion-10:focus {
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
-.emotion-25:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-26 {
+.emotion-11 {
   border: 0;
   border-radius: 3em;
   cursor: pointer;
@@ -1620,49 +815,12 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #666666;
+  box-shadow: rgba(51,51,51,0.2) 0 0 0 1px inset;
+  color: rgba(51,51,51,0.7);
   background: transparent;
 }
 
-.emotion-26:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-26:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-26:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-26 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-26 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
-.emotion-26 svg {
+.emotion-11 svg {
   display: inline-block;
   height: 14px;
   width: 14px;
@@ -1673,21 +831,20 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   pointer-events: none;
 }
 
-.emotion-26 svg path {
-  fill: #666666;
+.emotion-11 svg path {
+  fill: currentColor;
 }
 
-.emotion-26:hover {
-  box-shadow: #999999 0 0 0 1px inset;
+.emotion-11:hover {
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
 }
 
-.emotion-26:active {
-  background: #DDDDDD;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #333333;
+.emotion-11:active {
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
+  color: #333;
 }
 
-.emotion-27 {
+.emotion-12 {
   border: 0;
   border-radius: 3em;
   cursor: pointer;
@@ -1715,50 +872,13 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
   cursor: not-allowed !important;
-  opacity: .5;
+  opacity: 0.5;
   background: #FF4785;
   color: #FFFFFF;
 }
 
-.emotion-27:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-27:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-27:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-27 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-27 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
-.emotion-27 svg {
+.emotion-12 svg {
   display: inline-block;
   height: 14px;
   width: 14px;
@@ -1769,33 +889,33 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   pointer-events: none;
 }
 
-.emotion-27:hover {
+.emotion-12 svg path {
+  fill: currentColor;
+}
+
+.emotion-12:hover {
   -webkit-transform: none;
   -ms-transform: none;
   transform: none;
 }
 
-.emotion-27 svg path {
-  fill: #FFFFFF;
-}
-
-.emotion-27:hover {
+.emotion-12:hover {
   background: #ff2d74;
 }
 
-.emotion-27:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+.emotion-12:active {
+  box-shadow: rgba(0,0,0,0.1) 0 0 0 3em inset;
 }
 
-.emotion-27:focus {
+.emotion-12:focus {
   box-shadow: rgba(255,71,133,0.4) 0 1px 9px 2px;
 }
 
-.emotion-27:focus:hover {
+.emotion-12:focus:hover {
   box-shadow: rgba(255,71,133,0.2) 0 8px 18px 0px;
 }
 
-.emotion-30 {
+.emotion-15 {
   border: 0;
   border-radius: 3em;
   cursor: pointer;
@@ -1823,50 +943,13 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
   padding: 7px;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #666666;
+  box-shadow: rgba(51,51,51,0.2) 0 0 0 1px inset;
+  color: rgba(51,51,51,0.7);
   background: transparent;
 }
 
-.emotion-30:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-30:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-30:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-30 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-30 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
-.emotion-30 svg {
+.emotion-15 svg {
   display: inline-block;
   height: 14px;
   width: 14px;
@@ -1877,23 +960,22 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   pointer-events: none;
 }
 
-.emotion-30 svg {
+.emotion-15 svg path {
+  fill: currentColor;
+}
+
+.emotion-15 svg {
   display: block;
   margin: 0;
 }
 
-.emotion-30 svg path {
-  fill: #666666;
+.emotion-15:hover {
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
 }
 
-.emotion-30:hover {
-  box-shadow: #999999 0 0 0 1px inset;
-}
-
-.emotion-30:active {
-  background: #DDDDDD;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #333333;
+.emotion-15:active {
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
+  color: #333;
 }
 
 <div>
@@ -1930,7 +1012,7 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   <button
     class="emotion-6"
   >
-    Outline primary
+    Outline secondary
   </button>
   <button
     class="emotion-7"
@@ -1940,134 +1022,53 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   </button>
   <br />
   <button
-    class="emotion-10"
-  >
-    <span
-      class="emotion-8"
-    >
-      Primary
-    </span>
-    <span
-      aria-busy="true"
-      class="emotion-9"
-      role="progressbar"
-    >
-      Loading...
-    </span>
-  </button>
-  <button
-    class="emotion-13"
-  >
-    <span
-      class="emotion-8"
-    >
-      Secondary
-    </span>
-    <span
-      aria-busy="true"
-      class="emotion-9"
-      role="progressbar"
-    >
-      Loading...
-    </span>
-  </button>
-  <button
-    class="emotion-16"
-  >
-    <span
-      class="emotion-8"
-    >
-      Tertiary
-    </span>
-    <span
-      aria-busy="true"
-      class="emotion-9"
-      role="progressbar"
-    >
-      Loading...
-    </span>
-  </button>
-  <button
-    class="emotion-19"
-  >
-    <span
-      class="emotion-8"
-    >
-      Outline
-    </span>
-    <span
-      aria-busy="true"
-      class="emotion-9"
-      role="progressbar"
-    >
-      Loading...
-    </span>
-  </button>
-  <button
-    class="emotion-19"
-  >
-    <span
-      class="emotion-8"
-    >
-      Outline
-    </span>
-    <span
-      aria-busy="true"
-      class="emotion-9"
-      role="progressbar"
-    >
-      Custom...
-    </span>
-  </button>
-  <br />
-  <button
-    class="emotion-23"
+    class="emotion-8"
   >
     Primary
   </button>
   <button
-    class="emotion-24"
+    class="emotion-9"
   >
     Secondary
   </button>
   <button
-    class="emotion-25"
+    class="emotion-10"
   >
     Tertiary
   </button>
   <button
-    class="emotion-26"
+    class="emotion-11"
   >
     Outline
   </button>
   <button
-    class="emotion-27"
+    class="emotion-12"
     disabled=""
   >
     Disabled
   </button>
   <button
-    class="emotion-30"
+    class="emotion-15"
   >
     <svg
-      class="emotion-29"
+      class="emotion-14"
       viewBox="0 0 1024 1024"
     >
       <path
-        class="emotion-28"
+        class="emotion-13"
         d="M743.52 529.234c5.616-5.616 83.048-83.046 88.462-88.46 30.944-32.778 47.97-75.636 47.97-120.792 0-47.048-18.304-91.26-51.542-124.484-33.228-33.22-77.43-51.516-124.458-51.516-45.024 0-87.792 16.94-120.536 47.72l-104.458 104.456c-30.792 32.738-47.734 75.512-47.734 120.548 0 41.916 14.576 81.544 41.248 113.196 3.264 3.876 6.666 7.664 10.292 11.29 4.258 4.258 8.704 8.262 13.304 12.022 0.054 0.080 0.096 0.152 0.148 0.232 9.572 7.308 15.778 18.804 15.778 31.776 0 22.094-17.914 40-40.004 40-8.542 0-16.442-2.696-22.938-7.26-2.746-1.93-20.622-17.43-30.35-28.050-0.008-0.010-0.018-0.018-0.026-0.028-4.992-5.432-13.234-15.23-18.552-22.65s-16.556-25.872-17.036-26.736c-0.7-1.262-2.974-5.526-3.422-6.39-0.69-1.334-6.118-12.67-6.114-12.67-14.342-31.96-22.332-67.4-22.332-104.728 0-60.826 21.198-116.648 56.58-160.544 0.252-0.314 4.61-5.594 6.594-7.866 0.304-0.35 5.038-5.636 7.16-7.874 0.252-0.268 105.86-105.874 106.128-106.126 45.902-43.584 107.958-70.314 176.264-70.314 141.382 0 255.998 114.5 255.998 256 0 68.516-26.882 130.688-70.652 176.61-0.144 0.148-109.854 109.546-112.090 111.528-0.958 0.848-5.072 4.352-5.072 4.352-6.448 5.434-13.132 10.592-20.1 15.378 0.412-6.836 0.644-13.702 0.644-20.6 0-26.46-3.108-52.206-8.918-76.918l-0.236-1.102zM616.144 767.82c35.382-43.896 56.58-99.718 56.58-160.544 0-37.328-7.99-72.768-22.332-104.728 0.004 0 0.006-0.002 0.010-0.004-0.258-0.576-0.538-1.14-0.8-1.714-0.686-1.498-2.894-6.112-3.296-6.93-0.668-1.344-2.952-5.732-3.386-6.604-3.48-6.982-8.708-15.126-9.49-16.366-0.498-0.792-0.996-1.58-1.502-2.364-0.834-1.29-15.364-22.066-26.656-34.466-0.008-0.010-0.018-0.018-0.026-0.028-7.056-8.448-24.932-24.198-30.35-28.050-6.47-4.602-14.396-7.26-22.938-7.26-22.090 0-40.004 17.906-40.004 40 0 12.97 6.206 24.466 15.778 31.776 0.052 0.080 0.094 0.152 0.148 0.232 4.602 3.76 20.334 19.434 23.598 23.31 26.672 31.65 41.248 71.28 41.248 113.196 0 45.038-16.944 87.81-47.734 120.548l-104.458 104.456c-32.742 30.782-75.512 47.72-120.536 47.72-47.028 0-91.228-18.294-124.458-51.516-33.236-33.224-51.542-77.436-51.542-124.484 0-45.154 17.028-88.014 47.97-120.792 5.414-5.414 40.812-40.812 68.958-68.958 7.176-7.176 13.888-13.886 19.504-19.502v-0.002c-0.356-1.562-0.246-1.096-0.246-1.096-5.81-24.712-8.918-50.458-8.918-76.918 0-6.898 0.232-13.764 0.644-20.6-6.966 4.788-20.1 15.33-20.1 15.33-0.734 0.62-9.518 8.388-11.68 10.45-0.16 0.154-105.338 105.33-105.482 105.478-43.77 45.922-70.652 108.094-70.652 176.61 0 141.5 114.616 256 255.998 256 68.306 0 130.362-26.73 176.264-70.314 0.27-0.254 105.876-105.86 106.128-106.126 0.004-0.002 13.506-15.426 13.758-15.74z"
       />
     </svg>
   </button>
   <button
-    class="emotion-26"
+    class="emotion-11"
   >
     <svg
-      class="emotion-29"
+      class="emotion-14"
       viewBox="0 0 1024 1024"
     >
       <path
-        class="emotion-28"
+        class="emotion-13"
         d="M743.52 529.234c5.616-5.616 83.048-83.046 88.462-88.46 30.944-32.778 47.97-75.636 47.97-120.792 0-47.048-18.304-91.26-51.542-124.484-33.228-33.22-77.43-51.516-124.458-51.516-45.024 0-87.792 16.94-120.536 47.72l-104.458 104.456c-30.792 32.738-47.734 75.512-47.734 120.548 0 41.916 14.576 81.544 41.248 113.196 3.264 3.876 6.666 7.664 10.292 11.29 4.258 4.258 8.704 8.262 13.304 12.022 0.054 0.080 0.096 0.152 0.148 0.232 9.572 7.308 15.778 18.804 15.778 31.776 0 22.094-17.914 40-40.004 40-8.542 0-16.442-2.696-22.938-7.26-2.746-1.93-20.622-17.43-30.35-28.050-0.008-0.010-0.018-0.018-0.026-0.028-4.992-5.432-13.234-15.23-18.552-22.65s-16.556-25.872-17.036-26.736c-0.7-1.262-2.974-5.526-3.422-6.39-0.69-1.334-6.118-12.67-6.114-12.67-14.342-31.96-22.332-67.4-22.332-104.728 0-60.826 21.198-116.648 56.58-160.544 0.252-0.314 4.61-5.594 6.594-7.866 0.304-0.35 5.038-5.636 7.16-7.874 0.252-0.268 105.86-105.874 106.128-106.126 45.902-43.584 107.958-70.314 176.264-70.314 141.382 0 255.998 114.5 255.998 256 0 68.516-26.882 130.688-70.652 176.61-0.144 0.148-109.854 109.546-112.090 111.528-0.958 0.848-5.072 4.352-5.072 4.352-6.448 5.434-13.132 10.592-20.1 15.378 0.412-6.836 0.644-13.702 0.644-20.6 0-26.46-3.108-52.206-8.918-76.918l-0.236-1.102zM616.144 767.82c35.382-43.896 56.58-99.718 56.58-160.544 0-37.328-7.99-72.768-22.332-104.728 0.004 0 0.006-0.002 0.010-0.004-0.258-0.576-0.538-1.14-0.8-1.714-0.686-1.498-2.894-6.112-3.296-6.93-0.668-1.344-2.952-5.732-3.386-6.604-3.48-6.982-8.708-15.126-9.49-16.366-0.498-0.792-0.996-1.58-1.502-2.364-0.834-1.29-15.364-22.066-26.656-34.466-0.008-0.010-0.018-0.018-0.026-0.028-7.056-8.448-24.932-24.198-30.35-28.050-6.47-4.602-14.396-7.26-22.938-7.26-22.090 0-40.004 17.906-40.004 40 0 12.97 6.206 24.466 15.778 31.776 0.052 0.080 0.094 0.152 0.148 0.232 4.602 3.76 20.334 19.434 23.598 23.31 26.672 31.65 41.248 71.28 41.248 113.196 0 45.038-16.944 87.81-47.734 120.548l-104.458 104.456c-32.742 30.782-75.512 47.72-120.536 47.72-47.028 0-91.228-18.294-124.458-51.516-33.236-33.224-51.542-77.436-51.542-124.484 0-45.154 17.028-88.014 47.97-120.792 5.414-5.414 40.812-40.812 68.958-68.958 7.176-7.176 13.888-13.886 19.504-19.502v-0.002c-0.356-1.562-0.246-1.096-0.246-1.096-5.81-24.712-8.918-50.458-8.918-76.918 0-6.898 0.232-13.764 0.644-20.6-6.966 4.788-20.1 15.33-20.1 15.33-0.734 0.62-9.518 8.388-11.68 10.45-0.16 0.154-105.338 105.33-105.482 105.478-43.77 45.922-70.652 108.094-70.652 176.61 0 141.5 114.616 256 255.998 256 68.306 0 130.362-26.73 176.264-70.314 0.27-0.254 105.876-105.86 106.128-106.126 0.004-0.002 13.506-15.426 13.758-15.74z"
       />
     </svg>
diff --git a/lib/components/src/bar/bar.js b/lib/components/src/bar/bar.js
index ba99e928598..bec7f3914f6 100644
--- a/lib/components/src/bar/bar.js
+++ b/lib/components/src/bar/bar.js
@@ -35,7 +35,7 @@ export const Bar = styled.div(
   ({ theme }) => ({
     display: 'flex',
     justifyContent: 'space-between',
-    background: theme.barBgColor,
+    background: theme.barBg,
     color: theme.barTextColor,
     height: 40,
     position: 'relative',
@@ -48,9 +48,7 @@ export const Bar = styled.div(
   ({ theme, border }) =>
     border
       ? {
-          background: `${
-            theme.barBgColor
-          } linear-gradient(to bottom, transparent calc(100% - 1px), ${
+          background: `${theme.barBg} linear-gradient(to bottom, transparent calc(100% - 1px), ${
             theme.appBorderColor
           } calc(100% - 1px))`,
         }
diff --git a/lib/components/src/bar/button.js b/lib/components/src/bar/button.js
index e55e380a9b1..5f0a6b39d2b 100644
--- a/lib/components/src/bar/button.js
+++ b/lib/components/src/bar/button.js
@@ -41,7 +41,7 @@ export const TabButton = styled.button(
           borderBottomColor: theme.barSelectedColor,
         }
       : {
-          opacity: 0.4,
+          color: 'inherit',
           borderBottomColor: 'transparent',
         }
 );
diff --git a/lib/components/src/brand/StorybookLogo.js b/lib/components/src/brand/StorybookLogo.js
index 744b987f84e..2336359e2e8 100644
--- a/lib/components/src/brand/StorybookLogo.js
+++ b/lib/components/src/brand/StorybookLogo.js
@@ -11,7 +11,7 @@ export const StorybookLogo = ({ ...props }) => (
     <g fill="none" fillRule="evenodd">
       <path
         d="M53.3 31.7c-1.7 0-3.4-.3-5-.7-1.5-.5-2.8-1.1-3.9-2l1.6-3.5c2.2 1.5 4.6 2.3 7.3 2.3 1.5 0 2.5-.2 3.3-.7.7-.5 1.1-1 1.1-1.9 0-.7-.3-1.3-1-1.7s-2-.8-3.7-1.2c-2-.4-3.6-.9-4.8-1.5-1.1-.5-2-1.2-2.6-2-.5-1-.8-2-.8-3.2 0-1.4.4-2.6 1.2-3.6.7-1.1 1.8-2 3.2-2.6 1.3-.6 2.9-.9 4.7-.9 1.6 0 3.1.3 4.6.7 1.5.5 2.7 1.1 3.5 2l-1.6 3.5c-2-1.5-4.2-2.3-6.5-2.3-1.3 0-2.3.2-3 .8-.8.5-1.2 1.1-1.2 2 0 .5.2 1 .5 1.3.2.3.7.6 1.4.9l2.9.8c2.9.6 5 1.4 6.2 2.4a5 5 0 0 1 2 4.2 6 6 0 0 1-2.5 5c-1.7 1.2-4 1.9-7 1.9zm21-3.6l1.4-.1-.2 3.5-1.9.1c-2.4 0-4.1-.5-5.2-1.5-1.1-1-1.6-2.7-1.6-4.8v-6h-3v-3.6h3V11h4.8v4.6h4v3.6h-4v6c0 1.8.9 2.8 2.6 2.8zm11.1 3.5c-1.6 0-3-.3-4.3-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.3-1 1.7 0 3.2.3 4.4 1a7 7 0 0 1 3 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.4 1zm0-3.6c2.4 0 3.6-1.6 3.6-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.6-1c-2.3 0-3.5 1.4-3.5 4.4 0 3 1.2 4.6 3.5 4.6zm21.7-8.8l-2.7.3c-1.3.2-2.3.5-2.8 1.2-.6.6-.9 1.4-.9 2.5v8.2H96V15.7h4.6v2.6c.8-1.8 2.5-2.8 5-3h1.3l.3 4zm14-3.5h4.8L116.4 37h-4.9l3-6.6-6.4-14.8h5l4 10 4-10zm16-.4c1.4 0 2.6.3 3.6 1 1 .6 1.9 1.6 2.5 2.8.6 1.2.9 2.7.9 4.3 0 1.6-.3 3-1 4.3a6.9 6.9 0 0 1-2.4 2.9c-1 .7-2.2 1-3.6 1-1 0-2-.2-3-.7-.8-.4-1.5-1-2-1.9v2.4h-4.7V8.8h4.8v9c.5-.8 1.2-1.4 2-1.9.9-.4 1.8-.6 3-.6zM135.7 28c1.1 0 2-.4 2.6-1.2.6-.8 1-2 1-3.4 0-1.5-.4-2.5-1-3.3s-1.5-1.1-2.6-1.1-2 .3-2.6 1.1c-.6.8-1 2-1 3.3 0 1.5.4 2.6 1 3.4.6.8 1.5 1.2 2.6 1.2zm18.9 3.6c-1.7 0-3.2-.3-4.4-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.4-1 1.6 0 3 .3 4.3 1a7 7 0 0 1 3 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.3 1zm0-3.6c2.3 0 3.5-1.6 3.5-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.5-1c-2.4 0-3.6 1.4-3.6 4.4 0 3 1.2 4.6 3.6 4.6zm18 3.6c-1.7 0-3.2-.3-4.4-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.4-1 1.6 0 3 .3 4.4 1a7 7 0 0 1 2.9 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.3 1zm0-3.6c2.3 0 3.5-1.6 3.5-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.5-1c-2.4 0-3.6 1.4-3.6 4.4 0 3 1.2 4.6 3.6 4.6zm27.4 3.4h-6l-6-7v7h-4.8V8.8h4.9v13.6l5.8-6.7h5.7l-6.6 7.5 7 8.2z"
-        fill="#333"
+        fill="currentColor"
       />
       <mask id="b" fill="#fff">
         <use xlinkHref="#a" />
diff --git a/lib/components/src/brand/StorybookLogo.stories.js b/lib/components/src/brand/StorybookLogo.stories.js
index 5070228935d..2ff676dffdf 100644
--- a/lib/components/src/brand/StorybookLogo.stories.js
+++ b/lib/components/src/brand/StorybookLogo.stories.js
@@ -1,6 +1,10 @@
 import React from 'react';
-import { storiesOf } from '@storybook/react';
 
 import { StorybookLogo } from './StorybookLogo';
 
-storiesOf('Basics|Brand/StorybookLogo', module).add('default', () => <StorybookLogo />);
+export default {
+  Component: StorybookLogo,
+  title: 'Basics|Brand/StorybookLogo',
+};
+
+export const normal = () => <StorybookLogo />;
diff --git a/lib/components/src/form/__snapshots__/form.stories.storyshot b/lib/components/src/form/__snapshots__/form.stories.storyshot
index 17d92749295..52e22b8d4c8 100644
--- a/lib/components/src/form/__snapshots__/form.stories.storyshot
+++ b/lib/components/src/form/__snapshots__/form.stories.storyshot
@@ -37,16 +37,11 @@ exports[`Storyshots Basics|Form/Button sizes 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -55,38 +50,6 @@ exports[`Storyshots Basics|Form/Button sizes 1`] = `
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -99,23 +62,19 @@ exports[`Storyshots Basics|Form/Button sizes 1`] = `
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -159,18 +118,13 @@ exports[`Storyshots Basics|Form/Button sizes 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  border-radius: 4px;
   -webkit-flex: 1;
   -ms-flex: 1;
   flex: 1;
-  border-radius: 4px;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -179,38 +133,6 @@ exports[`Storyshots Basics|Form/Button sizes 1`] = `
   z-index: 2;
 }
 
-.emotion-2:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-2:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-2:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-2 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-2 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-2 svg {
   display: inline-block;
   height: 14px;
@@ -223,23 +145,19 @@ exports[`Storyshots Basics|Form/Button sizes 1`] = `
 }
 
 .emotion-2 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-2:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-2:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-2:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-2:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-2:hover {
@@ -276,16 +194,11 @@ exports[`Storyshots Basics|Form/Button sizes 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  width: 100%;
   border-radius: 4px;
+  width: 100%;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -294,38 +207,6 @@ exports[`Storyshots Basics|Form/Button sizes 1`] = `
   z-index: 2;
 }
 
-.emotion-4:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-4:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-4:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-4 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-4 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-4 svg {
   display: inline-block;
   height: 14px;
@@ -338,23 +219,19 @@ exports[`Storyshots Basics|Form/Button sizes 1`] = `
 }
 
 .emotion-4 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-4:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-4:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-4:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-4:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-4:hover {
@@ -440,16 +317,11 @@ exports[`Storyshots Basics|Form/Button validations 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  width: 100%;
   border-radius: 4px;
+  width: 100%;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -458,38 +330,6 @@ exports[`Storyshots Basics|Form/Button validations 1`] = `
   z-index: 2;
 }
 
-.emotion-6:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-6:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-6:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-6 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-6 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-6 svg {
   display: inline-block;
   height: 14px;
@@ -502,23 +342,19 @@ exports[`Storyshots Basics|Form/Button validations 1`] = `
 }
 
 .emotion-6 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-6:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-6:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-6:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-6:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-6:hover {
@@ -555,17 +391,12 @@ exports[`Storyshots Basics|Form/Button validations 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  border-radius: 4px;
   width: 100%;
   box-shadow: #FF4400 0 0 0 1px inset !important;
-  border-radius: 4px;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -574,38 +405,6 @@ exports[`Storyshots Basics|Form/Button validations 1`] = `
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -618,23 +417,19 @@ exports[`Storyshots Basics|Form/Button validations 1`] = `
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -671,17 +466,12 @@ exports[`Storyshots Basics|Form/Button validations 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  border-radius: 4px;
   width: 100%;
   box-shadow: #E69D00 0 0 0 1px inset;
-  border-radius: 4px;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -690,38 +480,6 @@ exports[`Storyshots Basics|Form/Button validations 1`] = `
   z-index: 2;
 }
 
-.emotion-2:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-2:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-2:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-2 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-2 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-2 svg {
   display: inline-block;
   height: 14px;
@@ -734,23 +492,19 @@ exports[`Storyshots Basics|Form/Button validations 1`] = `
 }
 
 .emotion-2 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-2:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-2:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-2:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-2:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-2:hover {
@@ -787,17 +541,12 @@ exports[`Storyshots Basics|Form/Button validations 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  border-radius: 4px;
   width: 100%;
   box-shadow: #66BF3C 0 0 0 1px inset !important;
-  border-radius: 4px;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -806,38 +555,6 @@ exports[`Storyshots Basics|Form/Button validations 1`] = `
   z-index: 2;
 }
 
-.emotion-4:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-4:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-4:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-4 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-4 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-4 svg {
   display: inline-block;
   height: 14px;
@@ -850,23 +567,19 @@ exports[`Storyshots Basics|Form/Button validations 1`] = `
 }
 
 .emotion-4 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-4:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-4:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-4:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-4:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-4:hover {
@@ -934,8 +647,8 @@ exports[`Storyshots Basics|Form/Field field 1`] = `
 
 .emotion-0 {
   min-width: 100px;
-  min-height: 32px;
-  margin-right: 16px;
+  font-weight: 700;
+  margin-right: 15px;
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
diff --git a/lib/components/src/form/field/field.js b/lib/components/src/form/field/field.js
index 83e86bca9e8..ede07048147 100644
--- a/lib/components/src/form/field/field.js
+++ b/lib/components/src/form/field/field.js
@@ -13,15 +13,15 @@ const Wrapper = styled.label(({ theme }) => ({
   },
 }));
 
-const Label = styled.span({
+const Label = styled.span(({ theme }) => ({
   minWidth: 100,
-  minHeight: 32,
-  marginRight: 16,
+  fontWeight: theme.typography.weight.bold,
+  marginRight: 15,
   display: 'flex',
   justifyContent: 'flex-start',
   alignItems: 'center',
   lineHeight: '16px',
-});
+}));
 
 const Field = ({ label, children }) => (
   <Wrapper>
diff --git a/lib/components/src/form/input/input.js b/lib/components/src/form/input/input.js
index 8c08fcfc4e0..b6c2c40af32 100644
--- a/lib/components/src/form/input/input.js
+++ b/lib/components/src/form/input/input.js
@@ -112,20 +112,16 @@ export const Textarea = styled(TextareaAutoResize)(styles, sizes, alignment, val
 Textarea.displayName = 'Textarea';
 
 export const Button = withProps({ tertiary: true, small: true, inForm: true })(
-  styled(StyledButton)(
-    sizes,
-    validation,
-    ({ theme }) => ({ borderRadius: theme.appBorderRadius }),
-    {
-      userSelect: 'none',
-      overflow: 'visible',
-      zIndex: 2,
+  styled(StyledButton)(sizes, validation, {
+    // Custom styling for color widget nested in buttons
+    userSelect: 'none',
+    overflow: 'visible',
+    zIndex: 2,
 
-      // overrides the default hover from Button
-      '&:hover': {
-        transform: 'none',
-      },
-    }
-  )
+    // overrides the default hover from Button
+    '&:hover': {
+      transform: 'none',
+    },
+  })
 );
 Button.displayName = 'Button';
diff --git a/lib/components/src/placeholder/placeholder.js b/lib/components/src/placeholder/placeholder.js
index 06b84ea6e0f..cbb7bb41d6d 100644
--- a/lib/components/src/placeholder/placeholder.js
+++ b/lib/components/src/placeholder/placeholder.js
@@ -11,7 +11,7 @@ const Desc = styled.div``;
 const Message = styled.div`
   padding: 30px;
   text-align: center;
-  color: ${props => props.theme.color.dark};
+  color: ${props => props.theme.color.defaultText};
   font-size: ${props => props.theme.typography.size.s2 - 1}px;
 `;
 
diff --git a/lib/components/src/placeholder/placeholder.stories.js b/lib/components/src/placeholder/placeholder.stories.js
index 43ce53f0b68..27cbdfab21b 100644
--- a/lib/components/src/placeholder/placeholder.stories.js
+++ b/lib/components/src/placeholder/placeholder.stories.js
@@ -1,6 +1,7 @@
 import React, { Fragment } from 'react';
 
 import { Placeholder } from './placeholder';
+import Link from '../typography/link/link';
 
 export default {
   Component: Placeholder,
@@ -14,7 +15,7 @@ export const twoChildren = () => (
   <Placeholder>
     <Fragment key="title">This has two children, the first bold</Fragment>
     <Fragment key="desc">
-      The second normal weight. Here's a <a href="https://storybook.js.org">link</a>
+      The second normal weight. Here's a <Link href="https://storybook.js.org">link</Link>
     </Fragment>
   </Placeholder>
 );
diff --git a/lib/components/src/syntaxhighlighter/__snapshots__/syntaxhighlighter.stories.storyshot b/lib/components/src/syntaxhighlighter/__snapshots__/syntaxhighlighter.stories.storyshot
index b7bffddd7c2..83209e363fb 100644
--- a/lib/components/src/syntaxhighlighter/__snapshots__/syntaxhighlighter.stories.storyshot
+++ b/lib/components/src/syntaxhighlighter/__snapshots__/syntaxhighlighter.stories.storyshot
@@ -405,6 +405,7 @@ exports[`Storyshots Basics|SyntaxHighlighter bordered & copy-able 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
+  background: #FFFFFF;
 }
 
 .emotion-3 {
@@ -419,7 +420,8 @@ exports[`Storyshots Basics|SyntaxHighlighter bordered & copy-able 1`] = `
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
-  color: #666666;
+  color: #333333;
+  background: #FFFFFF;
   font-size: 12px;
   line-height: 16px;
   font-weight: 700;
diff --git a/lib/components/src/tabs/__snapshots__/tabs.stories.storyshot b/lib/components/src/tabs/__snapshots__/tabs.stories.storyshot
index 019f2bda0f2..d485e04bc89 100644
--- a/lib/components/src/tabs/__snapshots__/tabs.stories.storyshot
+++ b/lib/components/src/tabs/__snapshots__/tabs.stories.storyshot
@@ -78,7 +78,7 @@ exports[`Storyshots Basics|Tabs stateful - dynamic 1`] = `
   border-bottom: 3px solid transparent;
   font-weight: bold;
   font-size: 13px;
-  opacity: 0.4;
+  color: inherit;
   border-bottom-color: transparent;
 }
 
@@ -359,7 +359,7 @@ exports[`Storyshots Basics|Tabs stateful - no initial 1`] = `
   border-bottom: 3px solid transparent;
   font-weight: bold;
   font-size: 13px;
-  opacity: 0.4;
+  color: inherit;
   border-bottom-color: transparent;
 }
 
@@ -596,7 +596,7 @@ exports[`Storyshots Basics|Tabs stateful - static 1`] = `
   border-bottom: 3px solid transparent;
   font-weight: bold;
   font-size: 13px;
-  opacity: 0.4;
+  color: inherit;
   border-bottom-color: transparent;
 }
 
@@ -791,7 +791,7 @@ exports[`Storyshots Basics|Tabs stateless - absolute 1`] = `
   border-bottom: 3px solid transparent;
   font-weight: bold;
   font-size: 13px;
-  opacity: 0.4;
+  color: inherit;
   border-bottom-color: transparent;
 }
 
@@ -1089,7 +1089,7 @@ exports[`Storyshots Basics|Tabs stateless - bordered 1`] = `
   border-bottom: 3px solid transparent;
   font-weight: bold;
   font-size: 13px;
-  opacity: 0.4;
+  color: inherit;
   border-bottom-color: transparent;
 }
 
@@ -1298,7 +1298,7 @@ exports[`Storyshots Basics|Tabs stateless - empty 1`] = `
 .emotion-1 {
   padding: 30px;
   text-align: center;
-  color: #666666;
+  color: #333333;
   font-size: 13px;
 }
 
@@ -1380,7 +1380,7 @@ exports[`Storyshots Basics|Tabs stateless - no scrolling 1`] = `
   border-bottom: 3px solid transparent;
   font-weight: bold;
   font-size: 13px;
-  opacity: 0.4;
+  color: inherit;
   border-bottom-color: transparent;
 }
 
@@ -1682,7 +1682,7 @@ exports[`Storyshots Basics|Tabs stateless - with tools 1`] = `
   border-bottom: 3px solid transparent;
   font-weight: bold;
   font-size: 13px;
-  opacity: 0.4;
+  color: inherit;
   border-bottom-color: transparent;
 }
 
diff --git a/lib/components/src/tooltip/ListItem.js b/lib/components/src/tooltip/ListItem.js
index b25781502c8..7bc3ead1f3c 100644
--- a/lib/components/src/tooltip/ListItem.js
+++ b/lib/components/src/tooltip/ListItem.js
@@ -2,17 +2,18 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { styled } from '@storybook/theming';
 import memoize from 'memoizerific';
+import { transparentize } from 'polished';
 
 const Title = styled.span(
   ({ theme }) => ({
-    color: theme.color.darker,
+    color: theme.color.defaultText,
     fontWeight: theme.typography.weight.normal,
   }),
   ({ active, theme }) =>
     active
       ? {
           color: theme.color.primary,
-          fontWeight: theme.typography.weight.extrabold,
+          fontWeight: theme.typography.weight.bold,
         }
       : {},
   ({ loading, theme }) =>
@@ -26,7 +27,7 @@ const Title = styled.span(
   ({ disabled, theme }) =>
     disabled
       ? {
-          color: theme.color.mediumdark,
+          color: transparentize(0.7, theme.color.defaultText),
         }
       : {}
 );
@@ -104,7 +105,7 @@ const Item = styled.a(
   ({ theme }) => ({
     fontSize: theme.typography.size.s1,
     transition: 'all 150ms ease-out',
-    color: theme.color.mediumdark,
+    color: transparentize(0.5, theme.color.defaultText),
     textDecoration: 'none',
     cursor: 'pointer',
     justifyContent: 'space-between',
@@ -114,10 +115,6 @@ const Item = styled.a(
     display: 'flex',
     alignItems: 'center',
 
-    '& + &': {
-      borderTop: `1px solid ${theme.color.mediumlight}`,
-    },
-
     '& > * + *': {
       paddingLeft: 10,
     },
diff --git a/lib/components/src/tooltip/Tooltip.js b/lib/components/src/tooltip/Tooltip.js
index 59a051748dd..ea7d4cdef91 100644
--- a/lib/components/src/tooltip/Tooltip.js
+++ b/lib/components/src/tooltip/Tooltip.js
@@ -3,6 +3,7 @@ import PropTypes from 'prop-types';
 import memoize from 'memoizerific';
 
 import { styled } from '@storybook/theming';
+import { rgba, lighten, darken } from 'polished';
 
 const match = memoize(1000)((requestes, actual, value, fallback = 0) =>
   actual.split('-')[0] === requestes ? value : fallback
@@ -34,25 +35,33 @@ const Arrow = styled.div(
     borderTopColor: match(
       'top',
       placement,
-      theme.color[color] || color || theme.color.lightest,
+      theme.color[color] || color || theme.base === 'light'
+        ? rgba(`${lighten(1, theme.background.app)}`, 0.95)
+        : rgba(`${darken(1, theme.background.app)}`, 0.95),
       'transparent'
     ),
     borderBottomColor: match(
       'bottom',
       placement,
-      theme.color[color] || color || theme.color.lightest,
+      theme.color[color] || color || theme.base === 'light'
+        ? rgba(`${lighten(1, theme.background.app)}`, 0.95)
+        : rgba(`${darken(1, theme.background.app)}`, 0.95),
       'transparent'
     ),
     borderLeftColor: match(
       'left',
       placement,
-      theme.color[color] || color || theme.color.lightest,
+      theme.color[color] || color || theme.base === 'light'
+        ? rgba(`${lighten(1, theme.background.app)}`, 0.95)
+        : rgba(`${darken(1, theme.background.app)}`, 0.95),
       'transparent'
     ),
     borderRightColor: match(
       'right',
       placement,
-      theme.color[color] || color || theme.color.lightest,
+      theme.color[color] || color || theme.base === 'light'
+        ? rgba(`${lighten(1, theme.background.app)}`, 0.95)
+        : rgba(`${darken(1, theme.background.app)}`, 0.95),
       'transparent'
     ),
   })
@@ -72,18 +81,14 @@ const Wrapper = styled.div(
           marginRight: `${match('left', placement, ArrowSpacing + 2, 0)}px`,
 
           background:
-            theme.color[color] ||
-            color ||
-            `linear-gradient(
-              -1deg,
-              rgba(248, 248, 248, 0.97) 0%,
-              rgba(255, 255, 255, 0.97) 100%
-            )`,
+            theme.color[color] || color || theme.base === 'light'
+              ? rgba(`${lighten(1, theme.background.app)}`, 0.95)
+              : rgba(`${darken(1, theme.background.app)}`, 0.95),
           filter: `
             drop-shadow(0px 5px 5px rgba(0,0,0,0.05))
             drop-shadow(0 1px 3px rgba(0,0,0,0.1))
           `,
-          borderRadius: theme.borderRadius,
+          borderRadius: theme.appBorderRadius * 2,
           fontSize: theme.typography.size.s1,
         }
       : {
diff --git a/lib/components/src/tooltip/TooltipLinkList.js b/lib/components/src/tooltip/TooltipLinkList.js
index a181b59adc5..953e204a7e1 100644
--- a/lib/components/src/tooltip/TooltipLinkList.js
+++ b/lib/components/src/tooltip/TooltipLinkList.js
@@ -4,9 +4,15 @@ import { styled } from '@storybook/theming';
 
 import ListItem from './ListItem';
 
-const List = styled.div({
-  minWidth: 180,
-});
+const List = styled.div(
+  {
+    minWidth: 180,
+    overflow: 'hidden',
+  },
+  ({ theme }) => ({
+    borderRadius: theme.appBorderRadius * 2,
+  })
+);
 
 const TooltipLinkList = ({ links, LinkWrapper }) => (
   <List>
diff --git a/lib/components/src/tooltip/__snapshots__/ListItem.stories.storyshot b/lib/components/src/tooltip/__snapshots__/ListItem.stories.storyshot
index 4fd9772b645..d8481a0e4e6 100644
--- a/lib/components/src/tooltip/__snapshots__/ListItem.stories.storyshot
+++ b/lib/components/src/tooltip/__snapshots__/ListItem.stories.storyshot
@@ -17,7 +17,7 @@ exports[`Storyshots basics|Tooltip/ListItem active icon 1`] = `
   font-size: 12px;
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
-  color: #999999;
+  color: rgba(51,51,51,0.5);
   -webkit-text-decoration: none;
   text-decoration: none;
   cursor: pointer;
@@ -37,10 +37,6 @@ exports[`Storyshots basics|Tooltip/ListItem active icon 1`] = `
   align-items: center;
 }
 
-.emotion-5 + .emotion-5 {
-  border-top: 1px solid #EEEEEE;
-}
-
 .emotion-5 > * + * {
   padding-left: 10px;
 }
@@ -69,8 +65,9 @@ exports[`Storyshots basics|Tooltip/ListItem active icon 1`] = `
 }
 
 .emotion-0 {
-  color: #444444;
+  color: #333333;
   color: #FF4785;
+  font-weight: 700;
 }
 
 .emotion-4 svg {
@@ -190,7 +187,7 @@ exports[`Storyshots basics|Tooltip/ListItem all 1`] = `
   font-size: 12px;
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
-  color: #999999;
+  color: rgba(51,51,51,0.5);
   -webkit-text-decoration: none;
   text-decoration: none;
   cursor: pointer;
@@ -210,10 +207,6 @@ exports[`Storyshots basics|Tooltip/ListItem all 1`] = `
   align-items: center;
 }
 
-.emotion-2 + .emotion-2 {
-  border-top: 1px solid #EEEEEE;
-}
-
 .emotion-2 > * + * {
   padding-left: 10px;
 }
@@ -242,11 +235,11 @@ exports[`Storyshots basics|Tooltip/ListItem all 1`] = `
 }
 
 .emotion-3 {
-  color: #444444;
+  color: #333333;
 }
 
 .emotion-0 {
-  color: #444444;
+  color: #333333;
   -webkit-animation: animation-0 1.5s ease-in-out infinite;
   animation: animation-0 1.5s ease-in-out infinite;
   background: rgba(0,0,0,.1);
@@ -284,8 +277,9 @@ exports[`Storyshots basics|Tooltip/ListItem all 1`] = `
 }
 
 .emotion-19 {
-  color: #444444;
+  color: #333333;
   color: #FF4785;
+  font-weight: 700;
 }
 
 .emotion-20 {
@@ -322,7 +316,7 @@ exports[`Storyshots basics|Tooltip/ListItem all 1`] = `
   font-size: 12px;
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
-  color: #999999;
+  color: rgba(51,51,51,0.5);
   -webkit-text-decoration: none;
   text-decoration: none;
   cursor: pointer;
@@ -343,10 +337,6 @@ exports[`Storyshots basics|Tooltip/ListItem all 1`] = `
   cursor: not-allowed;
 }
 
-.emotion-37 + .emotion-37 {
-  border-top: 1px solid #EEEEEE;
-}
-
 .emotion-37 > * + * {
   padding-left: 10px;
 }
@@ -360,8 +350,8 @@ exports[`Storyshots basics|Tooltip/ListItem all 1`] = `
 }
 
 .emotion-33 {
-  color: #444444;
-  color: #999999;
+  color: #333333;
+  color: rgba(51,51,51,0.3);
 }
 
 .emotion-34 {
@@ -560,7 +550,7 @@ exports[`Storyshots basics|Tooltip/ListItem default 1`] = `
   font-size: 12px;
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
-  color: #999999;
+  color: rgba(51,51,51,0.5);
   -webkit-text-decoration: none;
   text-decoration: none;
   cursor: pointer;
@@ -580,10 +570,6 @@ exports[`Storyshots basics|Tooltip/ListItem default 1`] = `
   align-items: center;
 }
 
-.emotion-2 + .emotion-2 {
-  border-top: 1px solid #EEEEEE;
-}
-
 .emotion-2 > * + * {
   padding-left: 10px;
 }
@@ -612,7 +598,7 @@ exports[`Storyshots basics|Tooltip/ListItem default 1`] = `
 }
 
 .emotion-0 {
-  color: #444444;
+  color: #333333;
 }
 
 <a
@@ -647,7 +633,7 @@ exports[`Storyshots basics|Tooltip/ListItem default icon 1`] = `
   font-size: 12px;
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
-  color: #999999;
+  color: rgba(51,51,51,0.5);
   -webkit-text-decoration: none;
   text-decoration: none;
   cursor: pointer;
@@ -667,10 +653,6 @@ exports[`Storyshots basics|Tooltip/ListItem default icon 1`] = `
   align-items: center;
 }
 
-.emotion-5 + .emotion-5 {
-  border-top: 1px solid #EEEEEE;
-}
-
 .emotion-5 > * + * {
   padding-left: 10px;
 }
@@ -699,7 +681,7 @@ exports[`Storyshots basics|Tooltip/ListItem default icon 1`] = `
 }
 
 .emotion-0 {
-  color: #444444;
+  color: #333333;
 }
 
 .emotion-4 svg {
@@ -778,7 +760,7 @@ exports[`Storyshots basics|Tooltip/ListItem disabled 1`] = `
   font-size: 12px;
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
-  color: #999999;
+  color: rgba(51,51,51,0.5);
   -webkit-text-decoration: none;
   text-decoration: none;
   cursor: pointer;
@@ -799,10 +781,6 @@ exports[`Storyshots basics|Tooltip/ListItem disabled 1`] = `
   cursor: not-allowed;
 }
 
-.emotion-5 + .emotion-5 {
-  border-top: 1px solid #EEEEEE;
-}
-
 .emotion-5 > * + * {
   padding-left: 10px;
 }
@@ -816,8 +794,8 @@ exports[`Storyshots basics|Tooltip/ListItem disabled 1`] = `
 }
 
 .emotion-1 {
-  color: #444444;
-  color: #999999;
+  color: #333333;
+  color: rgba(51,51,51,0.3);
 }
 
 .emotion-2 {
@@ -918,7 +896,7 @@ exports[`Storyshots basics|Tooltip/ListItem loading 1`] = `
   font-size: 12px;
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
-  color: #999999;
+  color: rgba(51,51,51,0.5);
   -webkit-text-decoration: none;
   text-decoration: none;
   cursor: pointer;
@@ -938,10 +916,6 @@ exports[`Storyshots basics|Tooltip/ListItem loading 1`] = `
   align-items: center;
 }
 
-.emotion-2 + .emotion-2 {
-  border-top: 1px solid #EEEEEE;
-}
-
 .emotion-2 > * + * {
   padding-left: 10px;
 }
@@ -970,7 +944,7 @@ exports[`Storyshots basics|Tooltip/ListItem loading 1`] = `
 }
 
 .emotion-0 {
-  color: #444444;
+  color: #333333;
   -webkit-animation: animation-0 1.5s ease-in-out infinite;
   animation: animation-0 1.5s ease-in-out infinite;
   background: rgba(0,0,0,.1);
@@ -1000,7 +974,7 @@ exports[`Storyshots basics|Tooltip/ListItem w/positions 1`] = `
   font-size: 12px;
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
-  color: #999999;
+  color: rgba(51,51,51,0.5);
   -webkit-text-decoration: none;
   text-decoration: none;
   cursor: pointer;
@@ -1020,10 +994,6 @@ exports[`Storyshots basics|Tooltip/ListItem w/positions 1`] = `
   align-items: center;
 }
 
-.emotion-5 + .emotion-5 {
-  border-top: 1px solid #EEEEEE;
-}
-
 .emotion-5 > * + * {
   padding-left: 10px;
 }
@@ -1052,7 +1022,7 @@ exports[`Storyshots basics|Tooltip/ListItem w/positions 1`] = `
 }
 
 .emotion-1 {
-  color: #444444;
+  color: #333333;
 }
 
 .emotion-4 svg {
@@ -1111,7 +1081,7 @@ exports[`Storyshots basics|Tooltip/ListItem w/positions active 1`] = `
   font-size: 12px;
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
-  color: #999999;
+  color: rgba(51,51,51,0.5);
   -webkit-text-decoration: none;
   text-decoration: none;
   cursor: pointer;
@@ -1131,10 +1101,6 @@ exports[`Storyshots basics|Tooltip/ListItem w/positions active 1`] = `
   align-items: center;
 }
 
-.emotion-5 + .emotion-5 {
-  border-top: 1px solid #EEEEEE;
-}
-
 .emotion-5 > * + * {
   padding-left: 10px;
 }
@@ -1171,8 +1137,9 @@ exports[`Storyshots basics|Tooltip/ListItem w/positions active 1`] = `
 }
 
 .emotion-1 {
-  color: #444444;
+  color: #333333;
   color: #FF4785;
+  font-weight: 700;
 }
 
 .emotion-2 {
diff --git a/lib/components/src/tooltip/__snapshots__/Tooltip.stories.storyshot b/lib/components/src/tooltip/__snapshots__/Tooltip.stories.storyshot
index 0148cecdfdc..baeb3ec4662 100644
--- a/lib/components/src/tooltip/__snapshots__/Tooltip.stories.storyshot
+++ b/lib/components/src/tooltip/__snapshots__/Tooltip.stories.storyshot
@@ -8,9 +8,10 @@ exports[`Storyshots basics/Tooltip/Tooltip basic, default 1`] = `
   margin-top: 0px;
   margin-left: 0px;
   margin-right: 0px;
-  background: #DDDDDD;
+  background: rgba(255,255,255,0.95);
   -webkit-filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
   filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
+  border-radius: 8px;
   font-size: 12px;
 }
 
@@ -29,7 +30,7 @@ exports[`Storyshots basics/Tooltip/Tooltip basic, default 1`] = `
   border-top-width: 8px;
   border-right-width: 8px;
   border-left-width: 8px;
-  border-top-color: #DDDDDD;
+  border-top-color: rgba(255,255,255,0.95);
   border-bottom-color: transparent;
   border-left-color: transparent;
   border-right-color: transparent;
@@ -76,9 +77,10 @@ exports[`Storyshots basics/Tooltip/Tooltip basic, default, bottom 1`] = `
   margin-top: 10px;
   margin-left: 0px;
   margin-right: 0px;
-  background: linear-gradient( -1deg, rgba(248,248,248,0.97) 0%, rgba(255,255,255,0.97) 100% );
+  background: rgba(255,255,255,0.95);
   -webkit-filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
   filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
+  border-radius: 8px;
   font-size: 12px;
 }
 
@@ -98,7 +100,7 @@ exports[`Storyshots basics/Tooltip/Tooltip basic, default, bottom 1`] = `
   border-right-width: 8px;
   border-left-width: 8px;
   border-top-color: transparent;
-  border-bottom-color: #FFFFFF;
+  border-bottom-color: rgba(255,255,255,0.95);
   border-left-color: transparent;
   border-right-color: transparent;
 }
@@ -134,9 +136,10 @@ exports[`Storyshots basics/Tooltip/Tooltip basic, default, left 1`] = `
   margin-top: 0px;
   margin-left: 0px;
   margin-right: 10px;
-  background: linear-gradient( -1deg, rgba(248,248,248,0.97) 0%, rgba(255,255,255,0.97) 100% );
+  background: rgba(255,255,255,0.95);
   -webkit-filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
   filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
+  border-radius: 8px;
   font-size: 12px;
 }
 
@@ -157,7 +160,7 @@ exports[`Storyshots basics/Tooltip/Tooltip basic, default, left 1`] = `
   border-left-width: 8px;
   border-top-color: transparent;
   border-bottom-color: transparent;
-  border-left-color: #FFFFFF;
+  border-left-color: rgba(255,255,255,0.95);
   border-right-color: transparent;
 }
 
@@ -192,9 +195,10 @@ exports[`Storyshots basics/Tooltip/Tooltip basic, default, right 1`] = `
   margin-top: 0px;
   margin-left: 10px;
   margin-right: 0px;
-  background: linear-gradient( -1deg, rgba(248,248,248,0.97) 0%, rgba(255,255,255,0.97) 100% );
+  background: rgba(255,255,255,0.95);
   -webkit-filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
   filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
+  border-radius: 8px;
   font-size: 12px;
 }
 
@@ -216,7 +220,7 @@ exports[`Storyshots basics/Tooltip/Tooltip basic, default, right 1`] = `
   border-top-color: transparent;
   border-bottom-color: transparent;
   border-left-color: transparent;
-  border-right-color: #FFFFFF;
+  border-right-color: rgba(255,255,255,0.95);
 }
 
 <div
diff --git a/lib/components/src/tooltip/__snapshots__/WithTooltip.stories.storyshot b/lib/components/src/tooltip/__snapshots__/WithTooltip.stories.storyshot
index 4e0323d032f..74d7b2c8a91 100644
--- a/lib/components/src/tooltip/__snapshots__/WithTooltip.stories.storyshot
+++ b/lib/components/src/tooltip/__snapshots__/WithTooltip.stories.storyshot
@@ -159,6 +159,41 @@ exports[`Storyshots basics/Tooltip/WithTooltip simple click start open 1`] = `
   cursor: pointer;
 }
 
+.emotion-10 {
+  display: inline-block;
+  z-index: 2147483647;
+  margin-bottom: 10px;
+  margin-top: 0px;
+  margin-left: 0px;
+  margin-right: 0px;
+  background: rgba(255,255,255,0.95);
+  -webkit-filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
+  filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
+  border-radius: 8px;
+  font-size: 12px;
+}
+
+.emotion-3 {
+  position: absolute;
+  border-style: solid;
+  margin-bottom: 0px;
+  margin-top: 8px;
+  margin-right: 8px;
+  margin-left: 8px;
+  bottom: -8px;
+  top: autopx;
+  right: autopx;
+  left: autopx;
+  border-bottom-width: 0px;
+  border-top-width: 8px;
+  border-right-width: 8px;
+  border-left-width: 8px;
+  border-top-color: rgba(255,255,255,0.95);
+  border-bottom-color: transparent;
+  border-left-color: transparent;
+  border-right-color: transparent;
+}
+
 .emotion-12 {
   height: 300px;
 }
@@ -182,40 +217,6 @@ exports[`Storyshots basics/Tooltip/WithTooltip simple click start open 1`] = `
   color: white;
 }
 
-.emotion-10 {
-  display: inline-block;
-  z-index: 2147483647;
-  margin-bottom: 10px;
-  margin-top: 0px;
-  margin-left: 0px;
-  margin-right: 0px;
-  background: linear-gradient( -1deg, rgba(248,248,248,0.97) 0%, rgba(255,255,255,0.97) 100% );
-  -webkit-filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
-  filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
-  font-size: 12px;
-}
-
-.emotion-3 {
-  position: absolute;
-  border-style: solid;
-  margin-bottom: 0px;
-  margin-top: 8px;
-  margin-right: 8px;
-  margin-left: 8px;
-  bottom: -8px;
-  top: autopx;
-  right: autopx;
-  left: autopx;
-  border-bottom-width: 0px;
-  border-top-width: 8px;
-  border-right-width: 8px;
-  border-left-width: 8px;
-  border-top-color: #FFFFFF;
-  border-bottom-color: transparent;
-  border-left-color: transparent;
-  border-right-color: transparent;
-}
-
 .emotion-9 {
   padding: 15px;
   width: 280px;
diff --git a/lib/theming/package.json b/lib/theming/package.json
index ddcfc168928..621d9273acb 100644
--- a/lib/theming/package.json
+++ b/lib/theming/package.json
@@ -24,6 +24,7 @@
     "emotion-theming": "^10.0.5",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
+    "polished": "^2.3.3",
     "prop-types": "^15.6.2",
     "react-inspector": "^2.3.1"
   },
diff --git a/lib/theming/src/base.ts b/lib/theming/src/base.ts
index 232837b9ad9..98d239e1570 100644
--- a/lib/theming/src/base.ts
+++ b/lib/theming/src/base.ts
@@ -40,7 +40,7 @@ export const color = {
 
 export const background = {
   app: '#F6F9FC',
-  preview: color.lightest,
+  content: color.lightest,
   hoverable: 'rgba(0,0,0,.05)', // hover state for items in a list
 
   // Notification, error, and warning backgrounds
@@ -125,7 +125,7 @@ export interface Theme {
   // Toolbar default/active colors
   barTextColor: string;
   barSelectedColor: string;
-  barBgColor: string;
+  barBg: string;
 
   // Brand logo/text
   brand: Brand;
diff --git a/lib/theming/src/create.ts b/lib/theming/src/create.ts
index 8c9a43a0f41..e4bfe3fe96d 100644
--- a/lib/theming/src/create.ts
+++ b/lib/theming/src/create.ts
@@ -3,18 +3,22 @@
 import { Theme, Brand, color, Color, background, typography } from './base';
 import { easing, animation } from './animation';
 import { create as createSyntax } from './modules/syntax';
-import { chromeLight } from 'react-inspector';
+import { chromeLight, chromeDark } from 'react-inspector';
+import { opacify } from 'polished';
 
 interface Rest {
   [key: string]: any;
 }
 
 interface ThemeVar {
+  base?: 'light' | 'dark';
+
   colorPrimary?: string;
   colorSecondary?: string;
 
   // UI
   appBg?: string;
+  appContentBg?: string;
   appBorderColor?: string;
   appBorderRadius?: number;
 
@@ -29,7 +33,7 @@ interface ThemeVar {
   // Toolbar default and active colors
   barTextColor?: string;
   barSelectedColor?: string;
-  barBgColor?: string;
+  barBg?: string;
 
   // Form colors
   inputBg?: string;
@@ -78,12 +82,39 @@ const createColors = (vars: ThemeVar): Color => ({
   inverseText: vars.textInverseColor || color.lightest,
 });
 
+const lightSyntaxColors = {
+  green1: '#008000',
+  red1: '#A31515',
+  red2: '#9a050f',
+  red3: '#800000',
+  red4: '#ff0000',
+  gray1: '#393A34',
+  cyan1: '#36acaa',
+  cyan2: '#2B91AF',
+  blue1: '#0000ff',
+  blue2: '#00009f',
+};
+
+const darkSyntaxColors = {
+  green1: '#7C7C7C',
+  red1: '#92C379',
+  red2: '#9a050f',
+  red3: '#A8FF60',
+  red4: '#96CBFE',
+  gray1: '#EDEDED',
+  cyan1: '#C6C5FE',
+  cyan2: '#FFFFB6',
+  blue1: '#B474DD',
+  blue2: '#00009f',
+};
+
 export const create = (vars: ThemeVar, rest?: Rest): Theme => ({
+  base: vars.base,
   color: createColors(vars),
   background: {
     app: vars.appBg || background.app,
-    preview: color.lightest,
-    hoverable: background.hoverable, // TODO: change so it responds to whether appColor is light or dark
+    content: vars.appContentBg || color.lightest,
+    hoverable: vars.base === 'light' ? 'rgba(0,0,0,.05)' : 'rgba(250,250,252,.1)' || background.hoverable,
 
     positive: background.positive,
     negative: background.negative,
@@ -115,37 +146,27 @@ export const create = (vars: ThemeVar, rest?: Rest): Theme => ({
   // Toolbar default/active colors
   barTextColor: vars.barTextColor || color.mediumdark,
   barSelectedColor: vars.barSelectedColor || color.secondary,
-  barBgColor: vars.barBgColor || color.lightest,
+  barBg: vars.barBg || color.lightest,
 
   // Brand logo/text
   brand: vars.brand || null,
 
   code: createSyntax({
-    colors: {
-      green1: '#008000',
-      red1: '#A31515',
-      red2: '#9a050f',
-      red3: '#800000',
-      red4: '#ff0000',
-      gray1: '#393A34',
-      cyan1: '#36acaa',
-      cyan2: '#2B91AF',
-      blue1: '#0000ff',
-      blue2: '#00009f',
-    },
+    colors: vars.base === 'light' ? lightSyntaxColors : darkSyntaxColors,
     mono: vars.fontCode || typography.fonts.mono,
   }),
 
   // Addon actions theme
   // API example https://github.com/xyc/react-inspector/blob/master/src/styles/themes/chromeLight.js
   addonActionsTheme: {
-    ...chromeLight,
+    ...(vars.base === 'light' ? chromeLight : chromeDark),
+
     BASE_FONT_FAMILY: vars.fontCode || typography.fonts.mono,
     BASE_FONT_SIZE: typography.size.s2 - 1,
     BASE_LINE_HEIGHT: '18px',
-    BASE_BACKGROUND_COLOR: color.lightest,
+    BASE_BACKGROUND_COLOR: 'transparent',
     BASE_COLOR: vars.textColor || color.darkest,
-    ARROW_COLOR: 'rgba(0,0,0,.2)',
+    ARROW_COLOR: opacify(0.2, vars.appBorderColor),
     ARROW_MARGIN_RIGHT: 4,
     ARROW_FONT_SIZE: 8,
     TREENODE_FONT_FAMILY: vars.fontCode || typography.fonts.mono,
diff --git a/lib/theming/src/themes/dark.ts b/lib/theming/src/themes/dark.ts
index afd7871045d..abdbf46a8d8 100644
--- a/lib/theming/src/themes/dark.ts
+++ b/lib/theming/src/themes/dark.ts
@@ -1,37 +1,39 @@
 import { create } from '../create';
-
-import { color, typography, background } from '../base';
+import { color, typography } from '../base';
 
 export default create({
+  // Is this a light theme or a dark theme?
+  base: 'dark',
+
   // Storybook-specific color palette
   colorPrimary: '#FF4785', // coral
   colorSecondary: '#1EA7FD', // ocean
-  // colorTertiary: '#FAFBFC', // neutral buttons
-  // colorAncillary: '#22a699', // for code
 
-  // UI colors
-  appBg: background.app,
-  // bgHoverItem: background.hoverable,
-  appBorderColor: color.border,
+  // UI
+  appBg: '#2f2f2f',
+  appContentBg: '#333',
+  appBorderColor: 'rgba(255,255,255,.1)',
   appBorderRadius: 4,
 
-  // Typography
+  // Fonts
   fontBase: typography.fonts.base,
   fontCode: typography.fonts.mono,
-  // mainTextSize: typography.size.s2 - 1, // 13px
 
-  // Text colors (dark on light)
+  // Text colors
+  textColor: color.lightest,
+  textInverseColor: color.darkest,
 
-  textColor: color.darkest,
-  textInverseColor: color.lightest,
-
-  // Text colors (light on dark)
-  // inverseTextColor: color.lightest,
-  // inverseTextBgColor: color.mediumdark,
-
-  barTextColor: color.mediumdark,
+  // Toolbar default and active colors
+  barTextColor: '#999999',
   barSelectedColor: color.secondary,
+  barBg: color.darkest,
 
-  inputBg: color.lightest,
-  inputBorder: color.border,
+  // Form colors
+  inputBg: '#3f3f3f',
+  inputBorder: 'rgba(0,0,0,.3)',
+  inputTextColor: color.lightest,
+  inputBorderRadius: 4,
+
+  // Brand logo/text
+  brand: null,
 });
diff --git a/lib/theming/src/themes/light.ts b/lib/theming/src/themes/light.ts
index affb4f47eb9..3c2ed12ff98 100644
--- a/lib/theming/src/themes/light.ts
+++ b/lib/theming/src/themes/light.ts
@@ -1,14 +1,17 @@
 import { create } from '../create';
-
 import { color, typography, background } from '../base';
 
 export default create({
+  // Is this a light theme or a dark theme?
+  base: 'light',
+
   // Storybook-specific color palette
   colorPrimary: '#FF4785', // coral
   colorSecondary: '#1EA7FD', // ocean
 
   // UI
   appBg: background.app,
+  appContentBg: color.lightest,
   appBorderColor: color.border,
   appBorderRadius: 4,
 
@@ -23,7 +26,7 @@ export default create({
   // Toolbar default and active colors
   barTextColor: color.mediumdark,
   barSelectedColor: color.secondary,
-  barBgColor: color.lightest,
+  barBg: color.lightest,
 
   // Form colors
   inputBg: color.lightest,
diff --git a/lib/ui/src/components/layout/__snapshots__/layout.stories.storyshot b/lib/ui/src/components/layout/__snapshots__/layout.stories.storyshot
index 84434154b8e..8521c926594 100644
--- a/lib/ui/src/components/layout/__snapshots__/layout.stories.storyshot
+++ b/lib/ui/src/components/layout/__snapshots__/layout.stories.storyshot
@@ -313,7 +313,7 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 0 1`] = `
   border-bottom: 3px solid transparent;
   font-weight: bold;
   font-size: 13px;
-  opacity: 0.4;
+  color: inherit;
   border-bottom-color: transparent;
 }
 
@@ -602,7 +602,7 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 1 1`] = `
   border-bottom: 3px solid transparent;
   font-weight: bold;
   font-size: 13px;
-  opacity: 0.4;
+  color: inherit;
   border-bottom-color: transparent;
 }
 
@@ -891,7 +891,7 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 2 1`] = `
   border-bottom: 3px solid transparent;
   font-weight: bold;
   font-size: 13px;
-  opacity: 0.4;
+  color: inherit;
   border-bottom-color: transparent;
 }
 
@@ -1180,7 +1180,7 @@ exports[`Storyshots UI|Layout/Mobile (mocked) page 1`] = `
   border-bottom: 3px solid transparent;
   font-weight: bold;
   font-size: 13px;
-  opacity: 0.4;
+  color: inherit;
   border-bottom-color: transparent;
 }
 
diff --git a/lib/ui/src/components/layout/container.js b/lib/ui/src/components/layout/container.js
index 33001204da0..db2c9573101 100644
--- a/lib/ui/src/components/layout/container.js
+++ b/lib/ui/src/components/layout/container.js
@@ -89,8 +89,8 @@ const Paper = styled.div(
           borderRadius: '0',
         }
       : {
-          background: 'white',
-          borderRadius: theme.borderRadius,
+          background: theme.background.content,
+          borderRadius: theme.appBorderRadius,
           overflow: 'hidden',
           boxShadow: '0 1px 5px 0 rgba(0, 0, 0, 0.1)',
         }
diff --git a/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot b/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot
index d66c3145c49..4118a023114 100644
--- a/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot
+++ b/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot
@@ -343,7 +343,7 @@ Array [
   border-bottom: 3px solid transparent;
   font-weight: bold;
   font-size: 13px;
-  opacity: 0.4;
+  color: inherit;
   border-bottom-color: transparent;
 }
 
diff --git a/lib/ui/src/components/preview/background.js b/lib/ui/src/components/preview/background.js
index 9963d498859..4c155ad6ef3 100644
--- a/lib/ui/src/components/preview/background.js
+++ b/lib/ui/src/components/preview/background.js
@@ -60,7 +60,7 @@ const Background = styled.div(
     height: '100%',
     transition: 'background .1s linear',
   },
-  ({ theme }) => ({ background: theme.background.preview })
+  ({ theme }) => ({ background: theme.background.content })
 );
 
 export { Grid, Background, Consumer as BackgroundConsumer, Provider as BackgroundProvider };
diff --git a/lib/ui/src/components/sidebar/NotificationItem.js b/lib/ui/src/components/sidebar/NotificationItem.js
index d5a53a3af06..be3a2297078 100644
--- a/lib/ui/src/components/sidebar/NotificationItem.js
+++ b/lib/ui/src/components/sidebar/NotificationItem.js
@@ -2,6 +2,7 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { styled } from '@storybook/theming';
 import { Link } from '@storybook/router';
+import { rgba, lighten, darken } from 'polished';
 
 const NotificationText = styled.div();
 
@@ -12,9 +13,12 @@ const baseStyle = ({ theme }) => ({
   fontSize: theme.typography.size.s1,
   fontWeight: theme.typography.weight.bold,
   lineHeight: `16px`,
-  backgroundColor: 'rgba(50, 53, 71, 0.97)',
   boxShadow: '0 5px 15px 0 rgba(0, 0, 0, 0.1), 0 2px 5px 0 rgba(0, 0, 0, 0.05)',
-  color: `${theme.color.lightest}`,
+  color: theme.color.inverseText,
+  backgroundColor:
+    theme.base === 'light'
+      ? rgba(`${darken(1, theme.background.app)}`, 0.95)
+      : rgba(`${lighten(1, theme.background.app)}`, 0.95),
   textDecoration: 'none',
 });
 
diff --git a/lib/ui/src/components/sidebar/SidebarHeading.js b/lib/ui/src/components/sidebar/SidebarHeading.js
index 77ebd809f74..b45abadf499 100644
--- a/lib/ui/src/components/sidebar/SidebarHeading.js
+++ b/lib/ui/src/components/sidebar/SidebarHeading.js
@@ -8,6 +8,13 @@ import { StorybookLogo, WithTooltip, TooltipLinkList, Button, Icons } from '@sto
 const BrandArea = styled.div(({ theme }) => ({
   fontSize: theme.typography.size.s2,
   fontWeight: theme.typography.weight.bold,
+  '> *': {
+    maxHeight: 32,
+    maxWidth: 200,
+    height: 'auto',
+    width: 'auto',
+    display: 'block',
+  },
 }));
 
 const Logo = styled(StorybookLogo)({
diff --git a/lib/ui/src/components/sidebar/SidebarHeading.stories.js b/lib/ui/src/components/sidebar/SidebarHeading.stories.js
index f634af710a6..cf7713244d0 100644
--- a/lib/ui/src/components/sidebar/SidebarHeading.stories.js
+++ b/lib/ui/src/components/sidebar/SidebarHeading.stories.js
@@ -6,6 +6,18 @@ import SidebarHeading from './SidebarHeading';
 
 const { light: theme } = themes;
 
+const customizedBrand = `
+<svg width="64px" height="64px" viewBox="0 0 64 64" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+  <a xlink:href="https://storybook.js.org">
+    <g id="Artboard" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+      <path d="M8.04798541,58.7875918 L6.07908839,6.32540407 C6.01406344,4.5927838 7.34257463,3.12440831 9.07303814,3.01625434 L53.6958037,0.227331489 C55.457209,0.117243658 56.974354,1.45590096 57.0844418,3.21730626 C57.0885895,3.28366922 57.0906648,3.35014546 57.0906648,3.41663791 L57.0906648,60.5834697 C57.0906648,62.3483119 55.6599776,63.7789992 53.8951354,63.7789992 C53.847325,63.7789992 53.7995207,63.7779262 53.7517585,63.775781 L11.0978899,61.8600599 C9.43669044,61.7854501 8.11034889,60.4492961 8.04798541,58.7875918 Z" id="path-1" fill="#FF4785" fill-rule="nonzero"></path>
+      <path d="M35.9095005,24.1768792 C35.9095005,25.420127 44.2838488,24.8242707 45.4080313,23.9509748 C45.4080313,15.4847538 40.8652557,11.0358878 32.5466666,11.0358878 C24.2280775,11.0358878 19.5673077,15.553972 19.5673077,22.3311017 C19.5673077,34.1346028 35.4965208,34.3605071 35.4965208,40.7987804 C35.4965208,42.606015 34.6115646,43.6790606 32.6646607,43.6790606 C30.127786,43.6790606 29.1248356,42.3834613 29.2428298,37.9783269 C29.2428298,37.0226907 19.5673077,36.7247626 19.2723223,37.9783269 C18.5211693,48.6535354 25.1720308,51.7326752 32.7826549,51.7326752 C40.1572906,51.7326752 45.939005,47.8018145 45.939005,40.6858282 C45.939005,28.035186 29.7738035,28.3740425 29.7738035,22.1051974 C29.7738035,19.5637737 31.6617103,19.2249173 32.7826549,19.2249173 C33.9625966,19.2249173 36.0864917,19.4328883 35.9095005,24.1768792 Z" id="path9_fill-path" fill="#FFFFFF" fill-rule="nonzero"></path>
+      <path d="M44.0461638,0.830433986 L50.1874092,0.446606143 L50.443532,7.7810017 C50.4527198,8.04410717 50.2468789,8.26484453 49.9837734,8.27403237 C49.871115,8.27796649 49.7607078,8.24184808 49.6721567,8.17209069 L47.3089847,6.3104681 L44.5110468,8.43287463 C44.3012992,8.591981 44.0022839,8.55092814 43.8431776,8.34118051 C43.7762017,8.25288717 43.742082,8.14401677 43.7466857,8.03329059 L44.0461638,0.830433986 Z" id="Path" fill="#FFFFFF"></path>
+    </g>
+  </a>
+</svg>
+`;
+
 export default {
   component: SidebarHeading,
   title: 'UI|Sidebar/SidebarHeading',
@@ -22,7 +34,7 @@ simple.storyData = { menu: menuItems };
 export const menuHighlighted = () => <SidebarHeading menuHighlighted menu={menuItems} />;
 
 export const customBrand = () => (
-  <ThemeProvider theme={{ ...theme, brand: 'custom brand' }}>
+  <ThemeProvider theme={{ ...theme, brand: customizedBrand }}>
     <SidebarHeading menu={menuItems} />
   </ThemeProvider>
 );
diff --git a/lib/ui/src/components/sidebar/SidebarItem.js b/lib/ui/src/components/sidebar/SidebarItem.js
index 020599318d9..c8e1625ebe5 100644
--- a/lib/ui/src/components/sidebar/SidebarItem.js
+++ b/lib/ui/src/components/sidebar/SidebarItem.js
@@ -1,21 +1,21 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { styled } from '@storybook/theming';
+import { opacify, transparentize } from 'polished';
 
 import { Icons } from '@storybook/components';
 
 const Expander = styled.span(
-  {
+  ({ theme }) => ({
     display: 'block',
     width: 0,
     height: 0,
     marginRight: 6,
     borderTop: '3.5px solid transparent',
     borderBottom: '3.5px solid transparent',
-    // this needs to be inverted for the dark theme
-    borderLeft: `3.5px solid rgba(0,0,0,.2)`,
+    borderLeft: `3.5px solid ${opacify(0.2, theme.appBorderColor)}`,
     transition: 'transform .1s ease-out',
-  },
+  }),
 
   ({ isExpandable }) => (!isExpandable ? { borderLeftColor: 'transparent' } : {}),
 
@@ -72,11 +72,17 @@ export const Item = styled.div(
           cursor: 'default',
           background: theme.color.secondary,
           color: theme.color.lightest,
+          fontWeight: theme.typography.weight.bold,
         }
       : {
           cursor: 'pointer',
+          color:
+            theme.base === 'light'
+              ? theme.color.defaultText
+              : transparentize(0.2, theme.color.defaultText),
           '&:hover': {
-            background: 'rgba(0,0,0,.05)',
+            color: theme.color.defaultText,
+            background: theme.background.hoverable,
           },
         }),
   ({ theme, loading }) =>
diff --git a/lib/ui/src/components/sidebar/SidebarSearch.js b/lib/ui/src/components/sidebar/SidebarSearch.js
index 7a467e8a6b8..86f339823b0 100644
--- a/lib/ui/src/components/sidebar/SidebarSearch.js
+++ b/lib/ui/src/components/sidebar/SidebarSearch.js
@@ -52,27 +52,26 @@ const CancelButton = styled.button(({ theme }) => ({
     display: 'block',
     height: 8,
     width: 8,
-    color: theme.color.dark,
+    color: theme.input.color,
     transition: 'all 150ms ease-out',
   },
 
   '&:hover': {
     background: opacify(0.1, theme.appBorderColor),
-    '> svg': {
-      color: theme.color.darker,
-    },
   },
 }));
 
 const FilterForm = styled.form(({ theme, focussed }) => ({
   transition: 'all 150ms ease-out',
-  borderBottom: focussed ? `1px solid transparent` : '1px solid transparent',
-  borderBottomColor: focussed ? theme.color.dark : opacify(0.1, theme.appBorderColor),
+  borderBottom: '1px solid transparent',
+  borderBottomColor: focussed
+    ? opacify(0.3, theme.appBorderColor)
+    : opacify(0.1, theme.appBorderColor),
   outline: 0,
   position: 'relative',
 
   input: {
-    color: theme.color.darkest,
+    color: theme.input.color,
     fontSize: theme.typography.size.s2 - 1,
     lineHeight: '20px',
     paddingTop: '2px',
@@ -93,7 +92,8 @@ const FilterForm = styled.form(({ theme, focussed }) => ({
 
     path: {
       transition: 'all 150ms ease-out',
-      fill: focussed ? theme.color.dark : theme.color.mediumdark,
+      fill: 'currentColor',
+      opacity: focussed ? 1 : 0.3,
     },
   },
 }));
diff --git a/lib/ui/src/components/sidebar/SidebarSearch.stories.js b/lib/ui/src/components/sidebar/SidebarSearch.stories.js
index debaa77e8b1..6d98d261460 100644
--- a/lib/ui/src/components/sidebar/SidebarSearch.stories.js
+++ b/lib/ui/src/components/sidebar/SidebarSearch.stories.js
@@ -8,7 +8,7 @@ export default {
   title: 'UI|Sidebar/SidebarSearch',
   decorators: [
     storyFn => (
-      <div style={{ width: '240px', margin: '1rem', padding: '1rem', background: 'white' }}>
+      <div style={{ width: '240px', margin: '1rem', padding: '1rem', background: '#999' }}>
         {storyFn()}
       </div>
     ),
diff --git a/lib/ui/src/components/sidebar/SidebarSubheading.js b/lib/ui/src/components/sidebar/SidebarSubheading.js
index e8e73c52702..5b28f320b59 100644
--- a/lib/ui/src/components/sidebar/SidebarSubheading.js
+++ b/lib/ui/src/components/sidebar/SidebarSubheading.js
@@ -1,14 +1,14 @@
 import React from 'react';
-
+import { transparentize } from 'polished';
 import { styled } from '@storybook/theming';
 
 const Heading = styled.div(({ theme }) => ({
   letterSpacing: '0.35em',
   textTransform: 'uppercase',
-  fontWeight: theme.typography.weight.bold,
+  fontWeight: theme.typography.weight.black,
   fontSize: theme.typography.size.s1 - 1,
   lineHeight: '24px',
-  color: theme.color.mediumdark,
+  color: transparentize(0.5, theme.color.defaultText),
 }));
 
 const Subheading = props => <Heading {...props} />;
diff --git a/lib/ui/src/components/sidebar/__snapshots__/SidebarSubheading.stories.storyshot b/lib/ui/src/components/sidebar/__snapshots__/SidebarSubheading.stories.storyshot
index cd4ef2f8941..80ff86fa129 100644
--- a/lib/ui/src/components/sidebar/__snapshots__/SidebarSubheading.stories.storyshot
+++ b/lib/ui/src/components/sidebar/__snapshots__/SidebarSubheading.stories.storyshot
@@ -7,10 +7,10 @@ exports[`Storyshots UI|Sidebar/SidebarSubheading default 1`] = `
   -ms-letter-spacing: 0.35em;
   letter-spacing: 0.35em;
   text-transform: uppercase;
-  font-weight: 700;
+  font-weight: 900;
   font-size: 11px;
   line-height: 24px;
-  color: #999999;
+  color: rgba(51,51,51,0.5);
 }
 
 <div
diff --git a/lib/ui/src/settings/__snapshots__/about.stories.storyshot b/lib/ui/src/settings/__snapshots__/about.stories.storyshot
index 7937df77314..ed8deb18243 100644
--- a/lib/ui/src/settings/__snapshots__/about.stories.storyshot
+++ b/lib/ui/src/settings/__snapshots__/about.stories.storyshot
@@ -1525,6 +1525,7 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
+  background: #FFFFFF;
 }
 
 .emotion-20 {
@@ -1539,7 +1540,8 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
-  color: #666666;
+  color: #333333;
+  background: #FFFFFF;
   font-size: 12px;
   line-height: 16px;
   font-weight: 700;

From 08441a50d658f2b48ffa20a9cefb8dce57d74b6b Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Tue, 19 Feb 2019 18:59:52 +0800
Subject: [PATCH 037/249] Update snapshots

---
 .../__tests__/__snapshots__/Panel.js.snap     |    8 +-
 .../addon-a11y.stories.storyshot              |   38 +-
 .../addon-actions.stories.storyshot           | 1908 +++++++++++++++--
 .../__snapshots__/storyshots.test.js.snap     |  902 ++++++--
 .../__snapshots__/Button.stories.storyshot    |  156 +-
 .../form/__snapshots__/form.stories.storyshot |   28 +-
 .../syntaxhighlighter.stories.storyshot       |    2 -
 .../tabs/__snapshots__/tabs.stories.storyshot |  863 ++++----
 .../__snapshots__/ListItem.stories.storyshot  |  218 +-
 .../__snapshots__/Tooltip.stories.storyshot   |   12 +-
 .../TooltipLinkList.stories.storyshot         |  118 +-
 .../TooltipMessage.stories.storyshot          |   20 +-
 .../WithTooltip.stories.storyshot             |   27 +-
 .../__snapshots__/layout.stories.storyshot    |    8 +-
 .../__snapshots__/preview.stories.storyshot   |    4 +-
 .../__snapshots__/about.stories.storyshot     |    4 +-
 16 files changed, 3141 insertions(+), 1175 deletions(-)

diff --git a/addons/knobs/src/components/__tests__/__snapshots__/Panel.js.snap b/addons/knobs/src/components/__tests__/__snapshots__/Panel.js.snap
index d6b39c95eb6..df555bca26b 100644
--- a/addons/knobs/src/components/__tests__/__snapshots__/Panel.js.snap
+++ b/addons/knobs/src/components/__tests__/__snapshots__/Panel.js.snap
@@ -40,8 +40,8 @@ Array [
 
 .emotion-0 {
   min-width: 100px;
-  font-weight: 700;
-  margin-right: 15px;
+  min-height: 32px;
+  margin-right: 16px;
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -135,8 +135,8 @@ Array [
 
 .emotion-0 {
   min-width: 100px;
-  font-weight: 700;
-  margin-right: 15px;
+  min-height: 32px;
+  margin-right: 16px;
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
diff --git a/examples/official-storybook/stories/__snapshots__/addon-a11y.stories.storyshot b/examples/official-storybook/stories/__snapshots__/addon-a11y.stories.storyshot
index b8fb54e56eb..425453f21e5 100644
--- a/examples/official-storybook/stories/__snapshots__/addon-a11y.stories.storyshot
+++ b/examples/official-storybook/stories/__snapshots__/addon-a11y.stories.storyshot
@@ -95,25 +95,6 @@ exports[`Storyshots Addons|A11y/Form With label 1`] = `
   margin-bottom: 3rem;
 }
 
-.emotion-0 {
-  min-width: 100px;
-  font-weight: 700;
-  margin-right: 15px;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-pack: start;
-  -webkit-justify-content: flex-start;
-  -ms-flex-pack: start;
-  justify-content: flex-start;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  line-height: 16px;
-}
-
 .emotion-1 {
   -webkit-appearance: none;
   -moz-appearance: none;
@@ -166,6 +147,25 @@ exports[`Storyshots Addons|A11y/Form With label 1`] = `
   color: #999999;
 }
 
+.emotion-0 {
+  min-width: 100px;
+  min-height: 32px;
+  margin-right: 16px;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: start;
+  -webkit-justify-content: flex-start;
+  -ms-flex-pack: start;
+  justify-content: flex-start;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  line-height: 16px;
+}
+
 <label
   class="emotion-2"
 >
diff --git a/examples/official-storybook/stories/__snapshots__/addon-actions.stories.storyshot b/examples/official-storybook/stories/__snapshots__/addon-actions.stories.storyshot
index 8b7cfba5f64..7c798fc6595 100644
--- a/examples/official-storybook/stories/__snapshots__/addon-actions.stories.storyshot
+++ b/examples/official-storybook/stories/__snapshots__/addon-actions.stories.storyshot
@@ -30,11 +30,16 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fafafa;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  background: #FAFBFC;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  border-radius: 4px;
   display: inline;
+  border-radius: 4px;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -43,6 +48,38 @@ Array [
   z-index: 2;
 }
 
+.emotion-0:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-0:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-0:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-0 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-0 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -55,19 +92,23 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: currentColor;
+  fill: #333333;
 }
 
 .emotion-0:hover {
-  background: #f2f2f2;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
 }
 
 .emotion-0:active {
-  background: #FFFFFF;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
 }
 
 .emotion-0:focus {
-  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
+  box-shadow: #1EA7FD 0 0 0 1px inset;
+}
+
+.emotion-0:focus:hover {
+  box-shadow: #1EA7FD 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -109,11 +150,16 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fafafa;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  background: #FAFBFC;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  border-radius: 4px;
   display: inline;
+  border-radius: 4px;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -122,6 +168,38 @@ Array [
   z-index: 2;
 }
 
+.emotion-0:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-0:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-0:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-0 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-0 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -134,19 +212,23 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: currentColor;
+  fill: #333333;
 }
 
 .emotion-0:hover {
-  background: #f2f2f2;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
 }
 
 .emotion-0:active {
-  background: #FFFFFF;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
 }
 
 .emotion-0:focus {
-  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
+  box-shadow: #1EA7FD 0 0 0 1px inset;
+}
+
+.emotion-0:focus:hover {
+  box-shadow: #1EA7FD 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -188,11 +270,16 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fafafa;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  background: #FAFBFC;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  border-radius: 4px;
   display: inline;
+  border-radius: 4px;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -201,6 +288,38 @@ Array [
   z-index: 2;
 }
 
+.emotion-0:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-0:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-0:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-0 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-0 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -213,19 +332,23 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: currentColor;
+  fill: #333333;
 }
 
 .emotion-0:hover {
-  background: #f2f2f2;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
 }
 
 .emotion-0:active {
-  background: #FFFFFF;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
 }
 
 .emotion-0:focus {
-  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
+  box-shadow: #1EA7FD 0 0 0 1px inset;
+}
+
+.emotion-0:focus:hover {
+  box-shadow: #1EA7FD 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -267,11 +390,16 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fafafa;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  background: #FAFBFC;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  border-radius: 4px;
   display: inline;
+  border-radius: 4px;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -280,6 +408,38 @@ Array [
   z-index: 2;
 }
 
+.emotion-0:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-0:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-0:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-0 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-0 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -292,19 +452,23 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: currentColor;
+  fill: #333333;
 }
 
 .emotion-0:hover {
-  background: #f2f2f2;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
 }
 
 .emotion-0:active {
-  background: #FFFFFF;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
 }
 
 .emotion-0:focus {
-  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
+  box-shadow: #1EA7FD 0 0 0 1px inset;
+}
+
+.emotion-0:focus:hover {
+  box-shadow: #1EA7FD 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -346,11 +510,16 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fafafa;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  background: #FAFBFC;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  border-radius: 4px;
   display: inline;
+  border-radius: 4px;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -359,6 +528,38 @@ Array [
   z-index: 2;
 }
 
+.emotion-0:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-0:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-0:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-0 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-0 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -371,19 +572,23 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: currentColor;
+  fill: #333333;
 }
 
 .emotion-0:hover {
-  background: #f2f2f2;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
 }
 
 .emotion-0:active {
-  background: #FFFFFF;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
 }
 
 .emotion-0:focus {
-  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
+  box-shadow: #1EA7FD 0 0 0 1px inset;
+}
+
+.emotion-0:focus:hover {
+  box-shadow: #1EA7FD 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -425,11 +630,16 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fafafa;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  background: #FAFBFC;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  border-radius: 4px;
   display: inline;
+  border-radius: 4px;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -438,6 +648,38 @@ Array [
   z-index: 2;
 }
 
+.emotion-0:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-0:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-0:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-0 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-0 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -450,19 +692,23 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: currentColor;
+  fill: #333333;
 }
 
 .emotion-0:hover {
-  background: #f2f2f2;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
 }
 
 .emotion-0:active {
-  background: #FFFFFF;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
 }
 
 .emotion-0:focus {
-  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
+  box-shadow: #1EA7FD 0 0 0 1px inset;
+}
+
+.emotion-0:focus:hover {
+  box-shadow: #1EA7FD 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -504,11 +750,16 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fafafa;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  background: #FAFBFC;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  border-radius: 4px;
   display: inline;
+  border-radius: 4px;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -517,6 +768,38 @@ Array [
   z-index: 2;
 }
 
+.emotion-0:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-0:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-0:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-0 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-0 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -529,19 +812,23 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: currentColor;
+  fill: #333333;
 }
 
 .emotion-0:hover {
-  background: #f2f2f2;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
 }
 
 .emotion-0:active {
-  background: #FFFFFF;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
 }
 
 .emotion-0:focus {
-  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
+  box-shadow: #1EA7FD 0 0 0 1px inset;
+}
+
+.emotion-0:focus:hover {
+  box-shadow: #1EA7FD 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -583,11 +870,16 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fafafa;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  background: #FAFBFC;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  border-radius: 4px;
   display: inline;
+  border-radius: 4px;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -596,6 +888,38 @@ Array [
   z-index: 2;
 }
 
+.emotion-0:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-0:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-0:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-0 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-0 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -608,19 +932,23 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: currentColor;
+  fill: #333333;
 }
 
 .emotion-0:hover {
-  background: #f2f2f2;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
 }
 
 .emotion-0:active {
-  background: #FFFFFF;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
 }
 
 .emotion-0:focus {
-  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
+  box-shadow: #1EA7FD 0 0 0 1px inset;
+}
+
+.emotion-0:focus:hover {
+  box-shadow: #1EA7FD 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -662,11 +990,16 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fafafa;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  background: #FAFBFC;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  border-radius: 4px;
   display: inline;
+  border-radius: 4px;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -675,6 +1008,38 @@ Array [
   z-index: 2;
 }
 
+.emotion-0:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-0:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-0:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-0 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-0 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -687,19 +1052,23 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: currentColor;
+  fill: #333333;
 }
 
 .emotion-0:hover {
-  background: #f2f2f2;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
 }
 
 .emotion-0:active {
-  background: #FFFFFF;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
 }
 
 .emotion-0:focus {
-  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
+  box-shadow: #1EA7FD 0 0 0 1px inset;
+}
+
+.emotion-0:focus:hover {
+  box-shadow: #1EA7FD 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -741,11 +1110,16 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fafafa;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  background: #FAFBFC;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  border-radius: 4px;
   display: inline;
+  border-radius: 4px;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -754,6 +1128,38 @@ Array [
   z-index: 2;
 }
 
+.emotion-0:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-0:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-0:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-0 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-0 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -766,19 +1172,23 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: currentColor;
+  fill: #333333;
 }
 
 .emotion-0:hover {
-  background: #f2f2f2;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
 }
 
 .emotion-0:active {
-  background: #FFFFFF;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
 }
 
 .emotion-0:focus {
-  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
+  box-shadow: #1EA7FD 0 0 0 1px inset;
+}
+
+.emotion-0:focus:hover {
+  box-shadow: #1EA7FD 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -820,11 +1230,16 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fafafa;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  background: #FAFBFC;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  border-radius: 4px;
   display: inline;
+  border-radius: 4px;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -833,6 +1248,38 @@ Array [
   z-index: 2;
 }
 
+.emotion-0:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-0:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-0:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-0 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-0 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -845,19 +1292,23 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: currentColor;
+  fill: #333333;
 }
 
 .emotion-0:hover {
-  background: #f2f2f2;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
 }
 
 .emotion-0:active {
-  background: #FFFFFF;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
 }
 
 .emotion-0:focus {
-  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
+  box-shadow: #1EA7FD 0 0 0 1px inset;
+}
+
+.emotion-0:focus:hover {
+  box-shadow: #1EA7FD 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -899,11 +1350,16 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fafafa;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  background: #FAFBFC;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  border-radius: 4px;
   display: inline;
+  border-radius: 4px;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -912,6 +1368,38 @@ Array [
   z-index: 2;
 }
 
+.emotion-0:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-0:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-0:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-0 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-0 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -924,19 +1412,23 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: currentColor;
+  fill: #333333;
 }
 
 .emotion-0:hover {
-  background: #f2f2f2;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
 }
 
 .emotion-0:active {
-  background: #FFFFFF;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
 }
 
 .emotion-0:focus {
-  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
+  box-shadow: #1EA7FD 0 0 0 1px inset;
+}
+
+.emotion-0:focus:hover {
+  box-shadow: #1EA7FD 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -978,11 +1470,16 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fafafa;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  background: #FAFBFC;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  border-radius: 4px;
   display: inline;
+  border-radius: 4px;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -991,6 +1488,38 @@ Array [
   z-index: 2;
 }
 
+.emotion-0:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-0:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-0:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-0 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-0 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -1003,19 +1532,23 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: currentColor;
+  fill: #333333;
 }
 
 .emotion-0:hover {
-  background: #f2f2f2;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
 }
 
 .emotion-0:active {
-  background: #FFFFFF;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
 }
 
 .emotion-0:focus {
-  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
+  box-shadow: #1EA7FD 0 0 0 1px inset;
+}
+
+.emotion-0:focus:hover {
+  box-shadow: #1EA7FD 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -1057,11 +1590,16 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fafafa;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  background: #FAFBFC;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  border-radius: 4px;
   display: inline;
+  border-radius: 4px;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -1070,6 +1608,38 @@ Array [
   z-index: 2;
 }
 
+.emotion-0:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-0:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-0:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-0 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-0 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -1082,19 +1652,23 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: currentColor;
+  fill: #333333;
 }
 
 .emotion-0:hover {
-  background: #f2f2f2;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
 }
 
 .emotion-0:active {
-  background: #FFFFFF;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
 }
 
 .emotion-0:focus {
-  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
+  box-shadow: #1EA7FD 0 0 0 1px inset;
+}
+
+.emotion-0:focus:hover {
+  box-shadow: #1EA7FD 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -1136,11 +1710,16 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fafafa;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  background: #FAFBFC;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  border-radius: 4px;
   display: inline;
+  border-radius: 4px;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -1149,6 +1728,38 @@ Array [
   z-index: 2;
 }
 
+.emotion-0:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-0:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-0:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-0 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-0 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -1161,19 +1772,23 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: currentColor;
+  fill: #333333;
 }
 
 .emotion-0:hover {
-  background: #f2f2f2;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
 }
 
 .emotion-0:active {
-  background: #FFFFFF;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
 }
 
 .emotion-0:focus {
-  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
+  box-shadow: #1EA7FD 0 0 0 1px inset;
+}
+
+.emotion-0:focus:hover {
+  box-shadow: #1EA7FD 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -1215,11 +1830,16 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fafafa;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  background: #FAFBFC;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  border-radius: 4px;
   display: inline;
+  border-radius: 4px;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -1228,6 +1848,38 @@ Array [
   z-index: 2;
 }
 
+.emotion-0:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-0:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-0:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-0 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-0 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -1240,19 +1892,23 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: currentColor;
+  fill: #333333;
 }
 
 .emotion-0:hover {
-  background: #f2f2f2;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
 }
 
 .emotion-0:active {
-  background: #FFFFFF;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
 }
 
 .emotion-0:focus {
-  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
+  box-shadow: #1EA7FD 0 0 0 1px inset;
+}
+
+.emotion-0:focus:hover {
+  box-shadow: #1EA7FD 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -1294,11 +1950,16 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fafafa;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  background: #FAFBFC;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  border-radius: 4px;
   display: inline;
+  border-radius: 4px;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -1307,6 +1968,38 @@ Array [
   z-index: 2;
 }
 
+.emotion-0:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-0:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-0:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-0 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-0 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -1319,19 +2012,23 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: currentColor;
+  fill: #333333;
 }
 
 .emotion-0:hover {
-  background: #f2f2f2;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
 }
 
 .emotion-0:active {
-  background: #FFFFFF;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
 }
 
 .emotion-0:focus {
-  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
+  box-shadow: #1EA7FD 0 0 0 1px inset;
+}
+
+.emotion-0:focus:hover {
+  box-shadow: #1EA7FD 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -1373,11 +2070,16 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fafafa;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  background: #FAFBFC;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  border-radius: 4px;
   display: inline;
+  border-radius: 4px;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -1386,6 +2088,38 @@ Array [
   z-index: 2;
 }
 
+.emotion-0:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-0:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-0:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-0 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-0 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -1398,19 +2132,23 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: currentColor;
+  fill: #333333;
 }
 
 .emotion-0:hover {
-  background: #f2f2f2;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
 }
 
 .emotion-0:active {
-  background: #FFFFFF;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
 }
 
 .emotion-0:focus {
-  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
+  box-shadow: #1EA7FD 0 0 0 1px inset;
+}
+
+.emotion-0:focus:hover {
+  box-shadow: #1EA7FD 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -1452,11 +2190,16 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fafafa;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  background: #FAFBFC;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  border-radius: 4px;
   display: inline;
+  border-radius: 4px;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -1465,6 +2208,38 @@ Array [
   z-index: 2;
 }
 
+.emotion-0:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-0:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-0:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-0 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-0 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -1477,19 +2252,23 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: currentColor;
+  fill: #333333;
 }
 
 .emotion-0:hover {
-  background: #f2f2f2;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
 }
 
 .emotion-0:active {
-  background: #FFFFFF;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
 }
 
 .emotion-0:focus {
-  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
+  box-shadow: #1EA7FD 0 0 0 1px inset;
+}
+
+.emotion-0:focus:hover {
+  box-shadow: #1EA7FD 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -1531,11 +2310,16 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fafafa;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  background: #FAFBFC;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  border-radius: 4px;
   display: inline;
+  border-radius: 4px;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -1544,6 +2328,38 @@ Array [
   z-index: 2;
 }
 
+.emotion-0:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-0:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-0:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-0 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-0 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -1556,19 +2372,23 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: currentColor;
+  fill: #333333;
 }
 
 .emotion-0:hover {
-  background: #f2f2f2;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
 }
 
 .emotion-0:active {
-  background: #FFFFFF;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
 }
 
 .emotion-0:focus {
-  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
+  box-shadow: #1EA7FD 0 0 0 1px inset;
+}
+
+.emotion-0:focus:hover {
+  box-shadow: #1EA7FD 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -1614,11 +2434,16 @@ exports[`Storyshots Addons|Actions Basic example 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fafafa;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  background: #FAFBFC;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  border-radius: 4px;
   display: inline;
+  border-radius: 4px;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -1627,6 +2452,38 @@ exports[`Storyshots Addons|Actions Basic example 1`] = `
   z-index: 2;
 }
 
+.emotion-0:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-0:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-0:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-0 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-0 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -1639,19 +2496,23 @@ exports[`Storyshots Addons|Actions Basic example 1`] = `
 }
 
 .emotion-0 svg path {
-  fill: currentColor;
+  fill: #333333;
 }
 
 .emotion-0:hover {
-  background: #f2f2f2;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
 }
 
 .emotion-0:active {
-  background: #FFFFFF;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
 }
 
 .emotion-0:focus {
-  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
+  box-shadow: #1EA7FD 0 0 0 1px inset;
+}
+
+.emotion-0:focus:hover {
+  box-shadow: #1EA7FD 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -1696,11 +2557,16 @@ exports[`Storyshots Addons|Actions Circular Payload 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fafafa;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  background: #FAFBFC;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  border-radius: 4px;
   display: inline;
+  border-radius: 4px;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -1709,6 +2575,38 @@ exports[`Storyshots Addons|Actions Circular Payload 1`] = `
   z-index: 2;
 }
 
+.emotion-0:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-0:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-0:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-0 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-0 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -1721,19 +2619,23 @@ exports[`Storyshots Addons|Actions Circular Payload 1`] = `
 }
 
 .emotion-0 svg path {
-  fill: currentColor;
+  fill: #333333;
 }
 
 .emotion-0:hover {
-  background: #f2f2f2;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
 }
 
 .emotion-0:active {
-  background: #FFFFFF;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
 }
 
 .emotion-0:focus {
-  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
+  box-shadow: #1EA7FD 0 0 0 1px inset;
+}
+
+.emotion-0:focus:hover {
+  box-shadow: #1EA7FD 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -1778,11 +2680,16 @@ exports[`Storyshots Addons|Actions Decorated action + config 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fafafa;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  background: #FAFBFC;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  border-radius: 4px;
   display: inline;
+  border-radius: 4px;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -1791,6 +2698,38 @@ exports[`Storyshots Addons|Actions Decorated action + config 1`] = `
   z-index: 2;
 }
 
+.emotion-0:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-0:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-0:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-0 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-0 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -1803,19 +2742,23 @@ exports[`Storyshots Addons|Actions Decorated action + config 1`] = `
 }
 
 .emotion-0 svg path {
-  fill: currentColor;
+  fill: #333333;
 }
 
 .emotion-0:hover {
-  background: #f2f2f2;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
 }
 
 .emotion-0:active {
-  background: #FFFFFF;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
 }
 
 .emotion-0:focus {
-  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
+  box-shadow: #1EA7FD 0 0 0 1px inset;
+}
+
+.emotion-0:focus:hover {
+  box-shadow: #1EA7FD 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -1860,11 +2803,16 @@ exports[`Storyshots Addons|Actions Decorated action 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fafafa;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  background: #FAFBFC;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  border-radius: 4px;
   display: inline;
+  border-radius: 4px;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -1873,6 +2821,38 @@ exports[`Storyshots Addons|Actions Decorated action 1`] = `
   z-index: 2;
 }
 
+.emotion-0:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-0:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-0:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-0 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-0 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -1885,19 +2865,23 @@ exports[`Storyshots Addons|Actions Decorated action 1`] = `
 }
 
 .emotion-0 svg path {
-  fill: currentColor;
+  fill: #333333;
 }
 
 .emotion-0:hover {
-  background: #f2f2f2;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
 }
 
 .emotion-0:active {
-  background: #FFFFFF;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
 }
 
 .emotion-0:focus {
-  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
+  box-shadow: #1EA7FD 0 0 0 1px inset;
+}
+
+.emotion-0:focus:hover {
+  box-shadow: #1EA7FD 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -1942,11 +2926,16 @@ exports[`Storyshots Addons|Actions Decorated actions + config 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fafafa;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  background: #FAFBFC;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  border-radius: 4px;
   display: inline;
+  border-radius: 4px;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -1955,6 +2944,38 @@ exports[`Storyshots Addons|Actions Decorated actions + config 1`] = `
   z-index: 2;
 }
 
+.emotion-0:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-0:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-0:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-0 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-0 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -1967,19 +2988,23 @@ exports[`Storyshots Addons|Actions Decorated actions + config 1`] = `
 }
 
 .emotion-0 svg path {
-  fill: currentColor;
+  fill: #333333;
 }
 
 .emotion-0:hover {
-  background: #f2f2f2;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
 }
 
 .emotion-0:active {
-  background: #FFFFFF;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
 }
 
 .emotion-0:focus {
-  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
+  box-shadow: #1EA7FD 0 0 0 1px inset;
+}
+
+.emotion-0:focus:hover {
+  box-shadow: #1EA7FD 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -2024,11 +3049,16 @@ exports[`Storyshots Addons|Actions Decorated actions 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fafafa;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  background: #FAFBFC;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  border-radius: 4px;
   display: inline;
+  border-radius: 4px;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -2037,6 +3067,38 @@ exports[`Storyshots Addons|Actions Decorated actions 1`] = `
   z-index: 2;
 }
 
+.emotion-0:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-0:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-0:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-0 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-0 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -2049,19 +3111,23 @@ exports[`Storyshots Addons|Actions Decorated actions 1`] = `
 }
 
 .emotion-0 svg path {
-  fill: currentColor;
+  fill: #333333;
 }
 
 .emotion-0:hover {
-  background: #f2f2f2;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
 }
 
 .emotion-0:active {
-  background: #FFFFFF;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
 }
 
 .emotion-0:focus {
-  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
+  box-shadow: #1EA7FD 0 0 0 1px inset;
+}
+
+.emotion-0:focus:hover {
+  box-shadow: #1EA7FD 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -2107,11 +3173,16 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fafafa;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  background: #FAFBFC;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  border-radius: 4px;
   display: inline;
+  border-radius: 4px;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -2120,6 +3191,38 @@ Array [
   z-index: 2;
 }
 
+.emotion-0:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-0:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-0:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-0 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-0 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -2132,19 +3235,23 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: currentColor;
+  fill: #333333;
 }
 
 .emotion-0:hover {
-  background: #f2f2f2;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
 }
 
 .emotion-0:active {
-  background: #FFFFFF;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
 }
 
 .emotion-0:focus {
-  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
+  box-shadow: #1EA7FD 0 0 0 1px inset;
+}
+
+.emotion-0:focus:hover {
+  box-shadow: #1EA7FD 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -2186,11 +3293,16 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fafafa;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  background: #FAFBFC;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  border-radius: 4px;
   display: inline;
+  border-radius: 4px;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -2199,6 +3311,38 @@ Array [
   z-index: 2;
 }
 
+.emotion-0:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-0:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-0:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-0 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-0 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -2211,19 +3355,23 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: currentColor;
+  fill: #333333;
 }
 
 .emotion-0:hover {
-  background: #f2f2f2;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
 }
 
 .emotion-0:active {
-  background: #FFFFFF;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
 }
 
 .emotion-0:focus {
-  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
+  box-shadow: #1EA7FD 0 0 0 1px inset;
+}
+
+.emotion-0:focus:hover {
+  box-shadow: #1EA7FD 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -2269,11 +3417,16 @@ exports[`Storyshots Addons|Actions Multiple actions + config 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fafafa;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  background: #FAFBFC;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  border-radius: 4px;
   display: inline;
+  border-radius: 4px;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -2282,6 +3435,38 @@ exports[`Storyshots Addons|Actions Multiple actions + config 1`] = `
   z-index: 2;
 }
 
+.emotion-0:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-0:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-0:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-0 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-0 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -2294,19 +3479,23 @@ exports[`Storyshots Addons|Actions Multiple actions + config 1`] = `
 }
 
 .emotion-0 svg path {
-  fill: currentColor;
+  fill: #333333;
 }
 
 .emotion-0:hover {
-  background: #f2f2f2;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
 }
 
 .emotion-0:active {
-  background: #FFFFFF;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
 }
 
 .emotion-0:focus {
-  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
+  box-shadow: #1EA7FD 0 0 0 1px inset;
+}
+
+.emotion-0:focus:hover {
+  box-shadow: #1EA7FD 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -2351,11 +3540,16 @@ exports[`Storyshots Addons|Actions Multiple actions 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fafafa;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  background: #FAFBFC;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  border-radius: 4px;
   display: inline;
+  border-radius: 4px;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -2364,6 +3558,38 @@ exports[`Storyshots Addons|Actions Multiple actions 1`] = `
   z-index: 2;
 }
 
+.emotion-0:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-0:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-0:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-0 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-0 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -2376,19 +3602,23 @@ exports[`Storyshots Addons|Actions Multiple actions 1`] = `
 }
 
 .emotion-0 svg path {
-  fill: currentColor;
+  fill: #333333;
 }
 
 .emotion-0:hover {
-  background: #f2f2f2;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
 }
 
 .emotion-0:active {
-  background: #FFFFFF;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
 }
 
 .emotion-0:focus {
-  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
+  box-shadow: #1EA7FD 0 0 0 1px inset;
+}
+
+.emotion-0:focus:hover {
+  box-shadow: #1EA7FD 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -2433,11 +3663,16 @@ exports[`Storyshots Addons|Actions Multiple actions as object 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fafafa;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  background: #FAFBFC;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  border-radius: 4px;
   display: inline;
+  border-radius: 4px;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -2446,6 +3681,38 @@ exports[`Storyshots Addons|Actions Multiple actions as object 1`] = `
   z-index: 2;
 }
 
+.emotion-0:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-0:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-0:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-0 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-0 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -2458,19 +3725,23 @@ exports[`Storyshots Addons|Actions Multiple actions as object 1`] = `
 }
 
 .emotion-0 svg path {
-  fill: currentColor;
+  fill: #333333;
 }
 
 .emotion-0:hover {
-  background: #f2f2f2;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
 }
 
 .emotion-0:active {
-  background: #FFFFFF;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
 }
 
 .emotion-0:focus {
-  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
+  box-shadow: #1EA7FD 0 0 0 1px inset;
+}
+
+.emotion-0:focus:hover {
+  box-shadow: #1EA7FD 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -2515,11 +3786,16 @@ exports[`Storyshots Addons|Actions Multiple actions, object + config 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fafafa;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  background: #FAFBFC;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  border-radius: 4px;
   display: inline;
+  border-radius: 4px;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -2528,6 +3804,38 @@ exports[`Storyshots Addons|Actions Multiple actions, object + config 1`] = `
   z-index: 2;
 }
 
+.emotion-0:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-0:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-0:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-0 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-0 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -2540,19 +3848,23 @@ exports[`Storyshots Addons|Actions Multiple actions, object + config 1`] = `
 }
 
 .emotion-0 svg path {
-  fill: currentColor;
+  fill: #333333;
 }
 
 .emotion-0:hover {
-  background: #f2f2f2;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
 }
 
 .emotion-0:active {
-  background: #FFFFFF;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
 }
 
 .emotion-0:focus {
-  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
+  box-shadow: #1EA7FD 0 0 0 1px inset;
+}
+
+.emotion-0:focus:hover {
+  box-shadow: #1EA7FD 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -2601,11 +3913,16 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fafafa;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  background: #FAFBFC;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  border-radius: 4px;
   display: inline;
+  border-radius: 4px;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -2614,6 +3931,38 @@ Array [
   z-index: 2;
 }
 
+.emotion-0:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-0:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-0:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-0 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-0 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -2626,19 +3975,23 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: currentColor;
+  fill: #333333;
 }
 
 .emotion-0:hover {
-  background: #f2f2f2;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
 }
 
 .emotion-0:active {
-  background: #FFFFFF;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
 }
 
 .emotion-0:focus {
-  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
+  box-shadow: #1EA7FD 0 0 0 1px inset;
+}
+
+.emotion-0:focus:hover {
+  box-shadow: #1EA7FD 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -2684,11 +4037,16 @@ exports[`Storyshots Addons|Actions Reserved keyword as name 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fafafa;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  background: #FAFBFC;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  border-radius: 4px;
   display: inline;
+  border-radius: 4px;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -2697,6 +4055,38 @@ exports[`Storyshots Addons|Actions Reserved keyword as name 1`] = `
   z-index: 2;
 }
 
+.emotion-0:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-0:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-0:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-0 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-0 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -2709,19 +4099,23 @@ exports[`Storyshots Addons|Actions Reserved keyword as name 1`] = `
 }
 
 .emotion-0 svg path {
-  fill: currentColor;
+  fill: #333333;
 }
 
 .emotion-0:hover {
-  background: #f2f2f2;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
 }
 
 .emotion-0:active {
-  background: #FFFFFF;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
 }
 
 .emotion-0:focus {
-  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
+  box-shadow: #1EA7FD 0 0 0 1px inset;
+}
+
+.emotion-0:focus:hover {
+  box-shadow: #1EA7FD 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -2766,11 +4160,16 @@ exports[`Storyshots Addons|Actions configureActionsDepth 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fafafa;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  background: #FAFBFC;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  border-radius: 4px;
   display: inline;
+  border-radius: 4px;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -2779,6 +4178,38 @@ exports[`Storyshots Addons|Actions configureActionsDepth 1`] = `
   z-index: 2;
 }
 
+.emotion-0:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-0:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-0:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-0 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-0 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -2791,19 +4222,23 @@ exports[`Storyshots Addons|Actions configureActionsDepth 1`] = `
 }
 
 .emotion-0 svg path {
-  fill: currentColor;
+  fill: #333333;
 }
 
 .emotion-0:hover {
-  background: #f2f2f2;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
 }
 
 .emotion-0:active {
-  background: #FFFFFF;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
 }
 
 .emotion-0:focus {
-  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
+  box-shadow: #1EA7FD 0 0 0 1px inset;
+}
+
+.emotion-0:focus:hover {
+  box-shadow: #1EA7FD 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -2848,11 +4283,16 @@ exports[`Storyshots Addons|Actions.deprecated Decorated Action 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fafafa;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  background: #FAFBFC;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  border-radius: 4px;
   display: inline;
+  border-radius: 4px;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -2861,6 +4301,38 @@ exports[`Storyshots Addons|Actions.deprecated Decorated Action 1`] = `
   z-index: 2;
 }
 
+.emotion-0:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-0:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-0:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-0 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-0 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -2873,19 +4345,23 @@ exports[`Storyshots Addons|Actions.deprecated Decorated Action 1`] = `
 }
 
 .emotion-0 svg path {
-  fill: currentColor;
+  fill: #333333;
 }
 
 .emotion-0:hover {
-  background: #f2f2f2;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
 }
 
 .emotion-0:active {
-  background: #FFFFFF;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
 }
 
 .emotion-0:focus {
-  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
+  box-shadow: #1EA7FD 0 0 0 1px inset;
+}
+
+.emotion-0:focus:hover {
+  box-shadow: #1EA7FD 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
diff --git a/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap b/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
index f3f40f8d412..0d2a4a92597 100644
--- a/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
+++ b/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
@@ -10,7 +10,6 @@ exports[`Storyshots Basics|ActionBar manyItems 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  background: #FFFFFF;
 }
 
 .emotion-0 {
@@ -26,7 +25,6 @@ exports[`Storyshots Basics|ActionBar manyItems 1`] = `
   -ms-flex-align: center;
   align-items: center;
   color: #333333;
-  background: #FFFFFF;
   font-size: 12px;
   line-height: 16px;
   font-weight: 700;
@@ -59,7 +57,6 @@ exports[`Storyshots Basics|ActionBar manyItems 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  background: #FFFFFF;
 }
 
 .emotion-0 {
@@ -75,7 +72,6 @@ exports[`Storyshots Basics|ActionBar manyItems 1`] = `
   -ms-flex-align: center;
   align-items: center;
   color: #333333;
-  background: #FFFFFF;
   font-size: 12px;
   line-height: 16px;
   font-weight: 700;
@@ -136,7 +132,6 @@ exports[`Storyshots Basics|ActionBar singleItem 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  background: #FFFFFF;
 }
 
 .emotion-0 {
@@ -152,7 +147,6 @@ exports[`Storyshots Basics|ActionBar singleItem 1`] = `
   -ms-flex-align: center;
   align-items: center;
   color: #333333;
-  background: #FFFFFF;
   font-size: 12px;
   line-height: 16px;
   font-weight: 700;
@@ -185,7 +179,6 @@ exports[`Storyshots Basics|ActionBar singleItem 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  background: #FFFFFF;
 }
 
 .emotion-0 {
@@ -201,7 +194,6 @@ exports[`Storyshots Basics|ActionBar singleItem 1`] = `
   -ms-flex-align: center;
   align-items: center;
   color: #333333;
-  background: #FFFFFF;
   font-size: 12px;
   line-height: 16px;
   font-weight: 700;
@@ -1692,6 +1684,10 @@ exports[`Storyshots Basics|DocumentFormatting sampleDocument 1`] = `
 `;
 
 exports[`Storyshots Basics|Placeholder singleChild 1`] = `
+.emotion-0 {
+  font-weight: 700;
+}
+
 .emotion-1 {
   padding: 30px;
   text-align: center;
@@ -1710,10 +1706,6 @@ exports[`Storyshots Basics|Placeholder singleChild 1`] = `
   font-size: 13px;
 }
 
-.emotion-0 {
-  font-weight: 700;
-}
-
 <div
   class="emotion-1"
 >
@@ -1726,13 +1718,6 @@ exports[`Storyshots Basics|Placeholder singleChild 1`] = `
 `;
 
 exports[`Storyshots Basics|Placeholder twoChildren 1`] = `
-.emotion-4 {
-  padding: 30px;
-  text-align: center;
-  color: #333333;
-  font-size: 13px;
-}
-
 .emotion-0 {
   font-weight: 700;
 }
@@ -1844,6 +1829,13 @@ exports[`Storyshots Basics|Placeholder twoChildren 1`] = `
   margin-right: 0.4em;
 }
 
+.emotion-4 {
+  padding: 30px;
+  text-align: center;
+  color: #333333;
+  font-size: 13px;
+}
+
 <div
   class="emotion-4"
 >
@@ -1899,6 +1891,43 @@ exports[`Storyshots Core|Events Force re-render 1`] = `
   font-size: 13px;
   font-weight: 700;
   line-height: 1;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-0:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-0:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-0:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-0 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-0 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
 }
 
 .emotion-0 svg {
@@ -1912,10 +1941,6 @@ exports[`Storyshots Core|Events Force re-render 1`] = `
   pointer-events: none;
 }
 
-.emotion-0 svg path {
-  fill: currentColor;
-}
-
 .emotion-0 {
   border: 0;
   border-radius: 3em;
@@ -1944,6 +1969,43 @@ exports[`Storyshots Core|Events Force re-render 1`] = `
   font-size: 13px;
   font-weight: 700;
   line-height: 1;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-0:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-0:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-0:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-0 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-0 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
 }
 
 .emotion-0 svg {
@@ -1957,10 +2019,6 @@ exports[`Storyshots Core|Events Force re-render 1`] = `
   pointer-events: none;
 }
 
-.emotion-0 svg path {
-  fill: currentColor;
-}
-
 <button
   class="emotion-0"
 >
@@ -2156,7 +2214,7 @@ exports[`Storyshots UI|Notifications/NotificationItem longText 1`] = `
   line-height: 16px;
   box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
   color: #FFFFFF;
-  background-color: rgba(0,0,0,0.95);
+  background-color: rgba(255,255,255,0.95);
   -webkit-text-decoration: none;
   text-decoration: none;
 }
@@ -2170,7 +2228,7 @@ exports[`Storyshots UI|Notifications/NotificationItem longText 1`] = `
   line-height: 16px;
   box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
   color: #FFFFFF;
-  background-color: rgba(0,0,0,0.95);
+  background-color: rgba(255,255,255,0.95);
   -webkit-text-decoration: none;
   text-decoration: none;
 }
@@ -2200,7 +2258,7 @@ exports[`Storyshots UI|Notifications/NotificationItem simple 1`] = `
   line-height: 16px;
   box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
   color: #FFFFFF;
-  background-color: rgba(0,0,0,0.95);
+  background-color: rgba(255,255,255,0.95);
   -webkit-text-decoration: none;
   text-decoration: none;
 }
@@ -2214,7 +2272,7 @@ exports[`Storyshots UI|Notifications/NotificationItem simple 1`] = `
   line-height: 16px;
   box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
   color: #FFFFFF;
-  background-color: rgba(0,0,0,0.95);
+  background-color: rgba(255,255,255,0.95);
   -webkit-text-decoration: none;
   text-decoration: none;
 }
@@ -2244,7 +2302,7 @@ exports[`Storyshots UI|Notifications/NotificationItem withLink 1`] = `
   line-height: 16px;
   box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
   color: #FFFFFF;
-  background-color: rgba(0,0,0,0.95);
+  background-color: rgba(255,255,255,0.95);
   -webkit-text-decoration: none;
   text-decoration: none;
 }
@@ -2258,7 +2316,7 @@ exports[`Storyshots UI|Notifications/NotificationItem withLink 1`] = `
   line-height: 16px;
   box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
   color: #FFFFFF;
-  background-color: rgba(0,0,0,0.95);
+  background-color: rgba(255,255,255,0.95);
   -webkit-text-decoration: none;
   text-decoration: none;
 }
@@ -2289,7 +2347,7 @@ exports[`Storyshots UI|Notifications/NotificationList all 1`] = `
   line-height: 16px;
   box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
   color: #FFFFFF;
-  background-color: rgba(0,0,0,0.95);
+  background-color: rgba(255,255,255,0.95);
   -webkit-text-decoration: none;
   text-decoration: none;
 }
@@ -2311,7 +2369,7 @@ exports[`Storyshots UI|Notifications/NotificationList all 1`] = `
   line-height: 16px;
   box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
   color: #FFFFFF;
-  background-color: rgba(0,0,0,0.95);
+  background-color: rgba(255,255,255,0.95);
   -webkit-text-decoration: none;
   text-decoration: none;
 }
@@ -2398,7 +2456,7 @@ exports[`Storyshots UI|Notifications/NotificationList single 1`] = `
   line-height: 16px;
   box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
   color: #FFFFFF;
-  background-color: rgba(0,0,0,0.95);
+  background-color: rgba(255,255,255,0.95);
   -webkit-text-decoration: none;
   text-decoration: none;
 }
@@ -2420,7 +2478,7 @@ exports[`Storyshots UI|Notifications/NotificationList single 1`] = `
   line-height: 16px;
   box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
   color: #FFFFFF;
-  background-color: rgba(0,0,0,0.95);
+  background-color: rgba(255,255,255,0.95);
   -webkit-text-decoration: none;
   text-decoration: none;
 }
@@ -3112,11 +3170,16 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fafafa;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  background: #FAFBFC;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  border-radius: 4px;
   display: inline;
+  border-radius: 4px;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -3125,6 +3188,38 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   z-index: 2;
 }
 
+.emotion-88:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-88:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-88:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-88 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-88 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-88 svg {
   display: inline-block;
   height: 14px;
@@ -3137,19 +3232,23 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
 }
 
 .emotion-88 svg path {
-  fill: currentColor;
+  fill: #333333;
 }
 
 .emotion-88:hover {
-  background: #f2f2f2;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
 }
 
 .emotion-88:active {
-  background: #FFFFFF;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
 }
 
 .emotion-88:focus {
-  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
+  box-shadow: #1EA7FD 0 0 0 1px inset;
+}
+
+.emotion-88:focus:hover {
+  box-shadow: #1EA7FD 0 0 0 1px inset;
 }
 
 .emotion-88:hover {
@@ -3578,11 +3677,16 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fafafa;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  background: #FAFBFC;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  border-radius: 4px;
   display: inline;
+  border-radius: 4px;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -3591,6 +3695,38 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   z-index: 2;
 }
 
+.emotion-88:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-88:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-88:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-88 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-88 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-88 svg {
   display: inline-block;
   height: 14px;
@@ -3603,19 +3739,23 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
 }
 
 .emotion-88 svg path {
-  fill: currentColor;
+  fill: #333333;
 }
 
 .emotion-88:hover {
-  background: #f2f2f2;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
 }
 
 .emotion-88:active {
-  background: #FFFFFF;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
 }
 
 .emotion-88:focus {
-  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
+  box-shadow: #1EA7FD 0 0 0 1px inset;
+}
+
+.emotion-88:focus:hover {
+  box-shadow: #1EA7FD 0 0 0 1px inset;
 }
 
 .emotion-88:hover {
@@ -4125,15 +4265,13 @@ exports[`Storyshots UI|Sidebar/ListItemIcon all 1`] = `
 
 .emotion-16 {
   min-width: 180px;
-  overflow: hidden;
-  border-radius: 8px;
 }
 
 .emotion-5 {
   font-size: 12px;
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
-  color: rgba(51,51,51,0.5);
+  color: #999999;
   -webkit-text-decoration: none;
   text-decoration: none;
   cursor: pointer;
@@ -4153,6 +4291,10 @@ exports[`Storyshots UI|Sidebar/ListItemIcon all 1`] = `
   align-items: center;
 }
 
+.emotion-5 + .emotion-5 {
+  border-top: 1px solid #EEEEEE;
+}
+
 .emotion-5 > * + * {
   padding-left: 10px;
 }
@@ -4195,7 +4337,7 @@ exports[`Storyshots UI|Sidebar/ListItemIcon all 1`] = `
 }
 
 .emotion-3 {
-  color: #333333;
+  color: #444444;
 }
 
 .emotion-6 {
@@ -4212,15 +4354,13 @@ exports[`Storyshots UI|Sidebar/ListItemIcon all 1`] = `
 
 .emotion-16 {
   min-width: 180px;
-  overflow: hidden;
-  border-radius: 8px;
 }
 
 .emotion-5 {
   font-size: 12px;
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
-  color: rgba(51,51,51,0.5);
+  color: #999999;
   -webkit-text-decoration: none;
   text-decoration: none;
   cursor: pointer;
@@ -4240,6 +4380,10 @@ exports[`Storyshots UI|Sidebar/ListItemIcon all 1`] = `
   align-items: center;
 }
 
+.emotion-5 + .emotion-5 {
+  border-top: 1px solid #EEEEEE;
+}
+
 .emotion-5 > * + * {
   padding-left: 10px;
 }
@@ -4282,7 +4426,7 @@ exports[`Storyshots UI|Sidebar/ListItemIcon all 1`] = `
 }
 
 .emotion-3 {
-  color: #333333;
+  color: #444444;
 }
 
 .emotion-6 {
@@ -4429,7 +4573,7 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
   line-height: 16px;
   box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
   color: #FFFFFF;
-  background-color: rgba(0,0,0,0.95);
+  background-color: rgba(255,255,255,0.95);
   -webkit-text-decoration: none;
   text-decoration: none;
 }
@@ -4547,14 +4691,51 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
   padding: 7px;
-  box-shadow: rgba(51,51,51,0.2) 0 0 0 1px inset;
-  color: rgba(51,51,51,0.7);
+  box-shadow: #DDDDDD 0 0 0 1px inset;
+  color: #666666;
   background: transparent;
   position: relative;
   overflow: visible;
 }
 
+.emotion-5:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-5:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-5:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-5 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-5 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-5 svg {
   display: inline-block;
   height: 14px;
@@ -4566,22 +4747,23 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
   pointer-events: none;
 }
 
-.emotion-5 svg path {
-  fill: currentColor;
-}
-
 .emotion-5 svg {
   display: block;
   margin: 0;
 }
 
+.emotion-5 svg path {
+  fill: #666666;
+}
+
 .emotion-5:hover {
-  box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
+  box-shadow: #999999 0 0 0 1px inset;
 }
 
 .emotion-5:active {
-  box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
-  color: #333;
+  background: #DDDDDD;
+  box-shadow: #DDDDDD 0 0 0 1px inset;
+  color: #333333;
 }
 
 .emotion-8 {
@@ -4834,7 +5016,7 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
   line-height: 16px;
   box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
   color: #FFFFFF;
-  background-color: rgba(0,0,0,0.95);
+  background-color: rgba(255,255,255,0.95);
   -webkit-text-decoration: none;
   text-decoration: none;
 }
@@ -4952,14 +5134,51 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
   padding: 7px;
-  box-shadow: rgba(51,51,51,0.2) 0 0 0 1px inset;
-  color: rgba(51,51,51,0.7);
+  box-shadow: #DDDDDD 0 0 0 1px inset;
+  color: #666666;
   background: transparent;
   position: relative;
   overflow: visible;
 }
 
+.emotion-5:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-5:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-5:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-5 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-5 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-5 svg {
   display: inline-block;
   height: 14px;
@@ -4971,22 +5190,23 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
   pointer-events: none;
 }
 
-.emotion-5 svg path {
-  fill: currentColor;
-}
-
 .emotion-5 svg {
   display: block;
   margin: 0;
 }
 
+.emotion-5 svg path {
+  fill: #666666;
+}
+
 .emotion-5:hover {
-  box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
+  box-shadow: #999999 0 0 0 1px inset;
 }
 
 .emotion-5:active {
-  box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
-  color: #333;
+  background: #DDDDDD;
+  box-shadow: #DDDDDD 0 0 0 1px inset;
+  color: #333333;
 }
 
 .emotion-8 {
@@ -5210,7 +5430,7 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
           >
             <path
               d="M53.3 31.7c-1.7 0-3.4-.3-5-.7-1.5-.5-2.8-1.1-3.9-2l1.6-3.5c2.2 1.5 4.6 2.3 7.3 2.3 1.5 0 2.5-.2 3.3-.7.7-.5 1.1-1 1.1-1.9 0-.7-.3-1.3-1-1.7s-2-.8-3.7-1.2c-2-.4-3.6-.9-4.8-1.5-1.1-.5-2-1.2-2.6-2-.5-1-.8-2-.8-3.2 0-1.4.4-2.6 1.2-3.6.7-1.1 1.8-2 3.2-2.6 1.3-.6 2.9-.9 4.7-.9 1.6 0 3.1.3 4.6.7 1.5.5 2.7 1.1 3.5 2l-1.6 3.5c-2-1.5-4.2-2.3-6.5-2.3-1.3 0-2.3.2-3 .8-.8.5-1.2 1.1-1.2 2 0 .5.2 1 .5 1.3.2.3.7.6 1.4.9l2.9.8c2.9.6 5 1.4 6.2 2.4a5 5 0 0 1 2 4.2 6 6 0 0 1-2.5 5c-1.7 1.2-4 1.9-7 1.9zm21-3.6l1.4-.1-.2 3.5-1.9.1c-2.4 0-4.1-.5-5.2-1.5-1.1-1-1.6-2.7-1.6-4.8v-6h-3v-3.6h3V11h4.8v4.6h4v3.6h-4v6c0 1.8.9 2.8 2.6 2.8zm11.1 3.5c-1.6 0-3-.3-4.3-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.3-1 1.7 0 3.2.3 4.4 1a7 7 0 0 1 3 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.4 1zm0-3.6c2.4 0 3.6-1.6 3.6-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.6-1c-2.3 0-3.5 1.4-3.5 4.4 0 3 1.2 4.6 3.5 4.6zm21.7-8.8l-2.7.3c-1.3.2-2.3.5-2.8 1.2-.6.6-.9 1.4-.9 2.5v8.2H96V15.7h4.6v2.6c.8-1.8 2.5-2.8 5-3h1.3l.3 4zm14-3.5h4.8L116.4 37h-4.9l3-6.6-6.4-14.8h5l4 10 4-10zm16-.4c1.4 0 2.6.3 3.6 1 1 .6 1.9 1.6 2.5 2.8.6 1.2.9 2.7.9 4.3 0 1.6-.3 3-1 4.3a6.9 6.9 0 0 1-2.4 2.9c-1 .7-2.2 1-3.6 1-1 0-2-.2-3-.7-.8-.4-1.5-1-2-1.9v2.4h-4.7V8.8h4.8v9c.5-.8 1.2-1.4 2-1.9.9-.4 1.8-.6 3-.6zM135.7 28c1.1 0 2-.4 2.6-1.2.6-.8 1-2 1-3.4 0-1.5-.4-2.5-1-3.3s-1.5-1.1-2.6-1.1-2 .3-2.6 1.1c-.6.8-1 2-1 3.3 0 1.5.4 2.6 1 3.4.6.8 1.5 1.2 2.6 1.2zm18.9 3.6c-1.7 0-3.2-.3-4.4-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.4-1 1.6 0 3 .3 4.3 1a7 7 0 0 1 3 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.3 1zm0-3.6c2.3 0 3.5-1.6 3.5-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.5-1c-2.4 0-3.6 1.4-3.6 4.4 0 3 1.2 4.6 3.6 4.6zm18 3.6c-1.7 0-3.2-.3-4.4-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.4-1 1.6 0 3 .3 4.4 1a7 7 0 0 1 2.9 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.3 1zm0-3.6c2.3 0 3.5-1.6 3.5-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.5-1c-2.4 0-3.6 1.4-3.6 4.4 0 3 1.2 4.6 3.6 4.6zm27.4 3.4h-6l-6-7v7h-4.8V8.8h4.9v13.6l5.8-6.7h5.7l-6.6 7.5 7 8.2z"
-              fill="currentColor"
+              fill="#333"
             />
             <mask
               fill="#fff"
@@ -5633,7 +5853,7 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   line-height: 16px;
   box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
   color: #FFFFFF;
-  background-color: rgba(0,0,0,0.95);
+  background-color: rgba(255,255,255,0.95);
   -webkit-text-decoration: none;
   text-decoration: none;
 }
@@ -5751,14 +5971,51 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
   padding: 7px;
-  box-shadow: rgba(51,51,51,0.2) 0 0 0 1px inset;
-  color: rgba(51,51,51,0.7);
+  box-shadow: #DDDDDD 0 0 0 1px inset;
+  color: #666666;
   background: transparent;
   position: relative;
   overflow: visible;
 }
 
+.emotion-5:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-5:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-5:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-5 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-5 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-5 svg {
   display: inline-block;
   height: 14px;
@@ -5770,22 +6027,23 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   pointer-events: none;
 }
 
-.emotion-5 svg path {
-  fill: currentColor;
-}
-
 .emotion-5 svg {
   display: block;
   margin: 0;
 }
 
+.emotion-5 svg path {
+  fill: #666666;
+}
+
 .emotion-5:hover {
-  box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
+  box-shadow: #999999 0 0 0 1px inset;
 }
 
 .emotion-5:active {
-  box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
-  color: #333;
+  background: #DDDDDD;
+  box-shadow: #DDDDDD 0 0 0 1px inset;
+  color: #333333;
 }
 
 .emotion-14 {
@@ -5954,7 +6212,7 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
-  color: #333333;
+  color: rgba(51,51,51,0.8);
 }
 
 .emotion-19:hover {
@@ -6072,7 +6330,7 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   transition: background 75ms ease-out;
   padding-left: 24px;
   cursor: pointer;
-  color: #333333;
+  color: rgba(51,51,51,0.8);
 }
 
 .emotion-29:hover {
@@ -6161,7 +6419,7 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   line-height: 16px;
   box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
   color: #FFFFFF;
-  background-color: rgba(0,0,0,0.95);
+  background-color: rgba(255,255,255,0.95);
   -webkit-text-decoration: none;
   text-decoration: none;
 }
@@ -6279,14 +6537,51 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
   padding: 7px;
-  box-shadow: rgba(51,51,51,0.2) 0 0 0 1px inset;
-  color: rgba(51,51,51,0.7);
+  box-shadow: #DDDDDD 0 0 0 1px inset;
+  color: #666666;
   background: transparent;
   position: relative;
   overflow: visible;
 }
 
+.emotion-5:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-5:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-5:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-5 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-5 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-5 svg {
   display: inline-block;
   height: 14px;
@@ -6298,22 +6593,23 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   pointer-events: none;
 }
 
-.emotion-5 svg path {
-  fill: currentColor;
-}
-
 .emotion-5 svg {
   display: block;
   margin: 0;
 }
 
+.emotion-5 svg path {
+  fill: #666666;
+}
+
 .emotion-5:hover {
-  box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
+  box-shadow: #999999 0 0 0 1px inset;
 }
 
 .emotion-5:active {
-  box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
-  color: #333;
+  background: #DDDDDD;
+  box-shadow: #DDDDDD 0 0 0 1px inset;
+  color: #333333;
 }
 
 .emotion-14 {
@@ -6482,7 +6778,7 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
-  color: #333333;
+  color: rgba(51,51,51,0.8);
 }
 
 .emotion-19:hover {
@@ -6600,7 +6896,7 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   transition: background 75ms ease-out;
   padding-left: 24px;
   cursor: pointer;
-  color: #333333;
+  color: rgba(51,51,51,0.8);
 }
 
 .emotion-29:hover {
@@ -6700,7 +6996,7 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
           >
             <path
               d="M53.3 31.7c-1.7 0-3.4-.3-5-.7-1.5-.5-2.8-1.1-3.9-2l1.6-3.5c2.2 1.5 4.6 2.3 7.3 2.3 1.5 0 2.5-.2 3.3-.7.7-.5 1.1-1 1.1-1.9 0-.7-.3-1.3-1-1.7s-2-.8-3.7-1.2c-2-.4-3.6-.9-4.8-1.5-1.1-.5-2-1.2-2.6-2-.5-1-.8-2-.8-3.2 0-1.4.4-2.6 1.2-3.6.7-1.1 1.8-2 3.2-2.6 1.3-.6 2.9-.9 4.7-.9 1.6 0 3.1.3 4.6.7 1.5.5 2.7 1.1 3.5 2l-1.6 3.5c-2-1.5-4.2-2.3-6.5-2.3-1.3 0-2.3.2-3 .8-.8.5-1.2 1.1-1.2 2 0 .5.2 1 .5 1.3.2.3.7.6 1.4.9l2.9.8c2.9.6 5 1.4 6.2 2.4a5 5 0 0 1 2 4.2 6 6 0 0 1-2.5 5c-1.7 1.2-4 1.9-7 1.9zm21-3.6l1.4-.1-.2 3.5-1.9.1c-2.4 0-4.1-.5-5.2-1.5-1.1-1-1.6-2.7-1.6-4.8v-6h-3v-3.6h3V11h4.8v4.6h4v3.6h-4v6c0 1.8.9 2.8 2.6 2.8zm11.1 3.5c-1.6 0-3-.3-4.3-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.3-1 1.7 0 3.2.3 4.4 1a7 7 0 0 1 3 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.4 1zm0-3.6c2.4 0 3.6-1.6 3.6-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.6-1c-2.3 0-3.5 1.4-3.5 4.4 0 3 1.2 4.6 3.5 4.6zm21.7-8.8l-2.7.3c-1.3.2-2.3.5-2.8 1.2-.6.6-.9 1.4-.9 2.5v8.2H96V15.7h4.6v2.6c.8-1.8 2.5-2.8 5-3h1.3l.3 4zm14-3.5h4.8L116.4 37h-4.9l3-6.6-6.4-14.8h5l4 10 4-10zm16-.4c1.4 0 2.6.3 3.6 1 1 .6 1.9 1.6 2.5 2.8.6 1.2.9 2.7.9 4.3 0 1.6-.3 3-1 4.3a6.9 6.9 0 0 1-2.4 2.9c-1 .7-2.2 1-3.6 1-1 0-2-.2-3-.7-.8-.4-1.5-1-2-1.9v2.4h-4.7V8.8h4.8v9c.5-.8 1.2-1.4 2-1.9.9-.4 1.8-.6 3-.6zM135.7 28c1.1 0 2-.4 2.6-1.2.6-.8 1-2 1-3.4 0-1.5-.4-2.5-1-3.3s-1.5-1.1-2.6-1.1-2 .3-2.6 1.1c-.6.8-1 2-1 3.3 0 1.5.4 2.6 1 3.4.6.8 1.5 1.2 2.6 1.2zm18.9 3.6c-1.7 0-3.2-.3-4.4-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.4-1 1.6 0 3 .3 4.3 1a7 7 0 0 1 3 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.3 1zm0-3.6c2.3 0 3.5-1.6 3.5-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.5-1c-2.4 0-3.6 1.4-3.6 4.4 0 3 1.2 4.6 3.6 4.6zm18 3.6c-1.7 0-3.2-.3-4.4-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.4-1 1.6 0 3 .3 4.4 1a7 7 0 0 1 2.9 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.3 1zm0-3.6c2.3 0 3.5-1.6 3.5-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.5-1c-2.4 0-3.6 1.4-3.6 4.4 0 3 1.2 4.6 3.6 4.6zm27.4 3.4h-6l-6-7v7h-4.8V8.8h4.9v13.6l5.8-6.7h5.7l-6.6 7.5 7 8.2z"
-              fill="currentColor"
+              fill="#333"
             />
             <mask
               fill="#fff"
@@ -7038,14 +7334,51 @@ exports[`Storyshots UI|Sidebar/SidebarHeading customBrand 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
   padding: 7px;
-  box-shadow: rgba(51,51,51,0.2) 0 0 0 1px inset;
-  color: rgba(51,51,51,0.7);
+  box-shadow: #DDDDDD 0 0 0 1px inset;
+  color: #666666;
   background: transparent;
   position: relative;
   overflow: visible;
 }
 
+.emotion-3:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-3:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-3:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-3 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-3 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-3 svg {
   display: inline-block;
   height: 14px;
@@ -7057,22 +7390,23 @@ exports[`Storyshots UI|Sidebar/SidebarHeading customBrand 1`] = `
   pointer-events: none;
 }
 
-.emotion-3 svg path {
-  fill: currentColor;
-}
-
 .emotion-3 svg {
   display: block;
   margin: 0;
 }
 
+.emotion-3 svg path {
+  fill: #666666;
+}
+
 .emotion-3:hover {
-  box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
+  box-shadow: #999999 0 0 0 1px inset;
 }
 
 .emotion-3:active {
-  box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
-  color: #333;
+  background: #DDDDDD;
+  box-shadow: #DDDDDD 0 0 0 1px inset;
+  color: #333333;
 }
 
 .emotion-5 {
@@ -7148,14 +7482,51 @@ exports[`Storyshots UI|Sidebar/SidebarHeading customBrand 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
   padding: 7px;
-  box-shadow: rgba(51,51,51,0.2) 0 0 0 1px inset;
-  color: rgba(51,51,51,0.7);
+  box-shadow: #DDDDDD 0 0 0 1px inset;
+  color: #666666;
   background: transparent;
   position: relative;
   overflow: visible;
 }
 
+.emotion-3:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-3:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-3:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-3 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-3 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-3 svg {
   display: inline-block;
   height: 14px;
@@ -7167,22 +7538,23 @@ exports[`Storyshots UI|Sidebar/SidebarHeading customBrand 1`] = `
   pointer-events: none;
 }
 
-.emotion-3 svg path {
-  fill: currentColor;
-}
-
 .emotion-3 svg {
   display: block;
   margin: 0;
 }
 
+.emotion-3 svg path {
+  fill: #666666;
+}
+
 .emotion-3:hover {
-  box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
+  box-shadow: #999999 0 0 0 1px inset;
 }
 
 .emotion-3:active {
-  box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
-  color: #333;
+  background: #DDDDDD;
+  box-shadow: #DDDDDD 0 0 0 1px inset;
+  color: #333333;
 }
 
 .emotion-5 {
@@ -7389,14 +7761,51 @@ exports[`Storyshots UI|Sidebar/SidebarHeading menuHighlighted 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
   padding: 7px;
-  box-shadow: rgba(51,51,51,0.2) 0 0 0 1px inset;
-  color: rgba(51,51,51,0.7);
+  box-shadow: #DDDDDD 0 0 0 1px inset;
+  color: #666666;
   background: transparent;
   position: relative;
   overflow: visible;
 }
 
+.emotion-5:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-5:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-5:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-5 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-5 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-5 svg {
   display: inline-block;
   height: 14px;
@@ -7408,22 +7817,23 @@ exports[`Storyshots UI|Sidebar/SidebarHeading menuHighlighted 1`] = `
   pointer-events: none;
 }
 
-.emotion-5 svg path {
-  fill: currentColor;
-}
-
 .emotion-5 svg {
   display: block;
   margin: 0;
 }
 
+.emotion-5 svg path {
+  fill: #666666;
+}
+
 .emotion-5:hover {
-  box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
+  box-shadow: #999999 0 0 0 1px inset;
 }
 
 .emotion-5:active {
-  box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
-  color: #333;
+  background: #DDDDDD;
+  box-shadow: #DDDDDD 0 0 0 1px inset;
+  color: #333333;
 }
 
 .emotion-5:after {
@@ -7540,14 +7950,51 @@ exports[`Storyshots UI|Sidebar/SidebarHeading menuHighlighted 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
   padding: 7px;
-  box-shadow: rgba(51,51,51,0.2) 0 0 0 1px inset;
-  color: rgba(51,51,51,0.7);
+  box-shadow: #DDDDDD 0 0 0 1px inset;
+  color: #666666;
   background: transparent;
   position: relative;
   overflow: visible;
 }
 
+.emotion-5:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-5:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-5:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-5 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-5 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-5 svg {
   display: inline-block;
   height: 14px;
@@ -7559,22 +8006,23 @@ exports[`Storyshots UI|Sidebar/SidebarHeading menuHighlighted 1`] = `
   pointer-events: none;
 }
 
-.emotion-5 svg path {
-  fill: currentColor;
-}
-
 .emotion-5 svg {
   display: block;
   margin: 0;
 }
 
+.emotion-5 svg path {
+  fill: #666666;
+}
+
 .emotion-5:hover {
-  box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
+  box-shadow: #999999 0 0 0 1px inset;
 }
 
 .emotion-5:active {
-  box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
-  color: #333;
+  background: #DDDDDD;
+  box-shadow: #DDDDDD 0 0 0 1px inset;
+  color: #333333;
 }
 
 .emotion-5:after {
@@ -7617,7 +8065,7 @@ exports[`Storyshots UI|Sidebar/SidebarHeading menuHighlighted 1`] = `
         >
           <path
             d="M53.3 31.7c-1.7 0-3.4-.3-5-.7-1.5-.5-2.8-1.1-3.9-2l1.6-3.5c2.2 1.5 4.6 2.3 7.3 2.3 1.5 0 2.5-.2 3.3-.7.7-.5 1.1-1 1.1-1.9 0-.7-.3-1.3-1-1.7s-2-.8-3.7-1.2c-2-.4-3.6-.9-4.8-1.5-1.1-.5-2-1.2-2.6-2-.5-1-.8-2-.8-3.2 0-1.4.4-2.6 1.2-3.6.7-1.1 1.8-2 3.2-2.6 1.3-.6 2.9-.9 4.7-.9 1.6 0 3.1.3 4.6.7 1.5.5 2.7 1.1 3.5 2l-1.6 3.5c-2-1.5-4.2-2.3-6.5-2.3-1.3 0-2.3.2-3 .8-.8.5-1.2 1.1-1.2 2 0 .5.2 1 .5 1.3.2.3.7.6 1.4.9l2.9.8c2.9.6 5 1.4 6.2 2.4a5 5 0 0 1 2 4.2 6 6 0 0 1-2.5 5c-1.7 1.2-4 1.9-7 1.9zm21-3.6l1.4-.1-.2 3.5-1.9.1c-2.4 0-4.1-.5-5.2-1.5-1.1-1-1.6-2.7-1.6-4.8v-6h-3v-3.6h3V11h4.8v4.6h4v3.6h-4v6c0 1.8.9 2.8 2.6 2.8zm11.1 3.5c-1.6 0-3-.3-4.3-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.3-1 1.7 0 3.2.3 4.4 1a7 7 0 0 1 3 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.4 1zm0-3.6c2.4 0 3.6-1.6 3.6-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.6-1c-2.3 0-3.5 1.4-3.5 4.4 0 3 1.2 4.6 3.5 4.6zm21.7-8.8l-2.7.3c-1.3.2-2.3.5-2.8 1.2-.6.6-.9 1.4-.9 2.5v8.2H96V15.7h4.6v2.6c.8-1.8 2.5-2.8 5-3h1.3l.3 4zm14-3.5h4.8L116.4 37h-4.9l3-6.6-6.4-14.8h5l4 10 4-10zm16-.4c1.4 0 2.6.3 3.6 1 1 .6 1.9 1.6 2.5 2.8.6 1.2.9 2.7.9 4.3 0 1.6-.3 3-1 4.3a6.9 6.9 0 0 1-2.4 2.9c-1 .7-2.2 1-3.6 1-1 0-2-.2-3-.7-.8-.4-1.5-1-2-1.9v2.4h-4.7V8.8h4.8v9c.5-.8 1.2-1.4 2-1.9.9-.4 1.8-.6 3-.6zM135.7 28c1.1 0 2-.4 2.6-1.2.6-.8 1-2 1-3.4 0-1.5-.4-2.5-1-3.3s-1.5-1.1-2.6-1.1-2 .3-2.6 1.1c-.6.8-1 2-1 3.3 0 1.5.4 2.6 1 3.4.6.8 1.5 1.2 2.6 1.2zm18.9 3.6c-1.7 0-3.2-.3-4.4-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.4-1 1.6 0 3 .3 4.3 1a7 7 0 0 1 3 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.3 1zm0-3.6c2.3 0 3.5-1.6 3.5-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.5-1c-2.4 0-3.6 1.4-3.6 4.4 0 3 1.2 4.6 3.6 4.6zm18 3.6c-1.7 0-3.2-.3-4.4-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.4-1 1.6 0 3 .3 4.4 1a7 7 0 0 1 2.9 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.3 1zm0-3.6c2.3 0 3.5-1.6 3.5-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.5-1c-2.4 0-3.6 1.4-3.6 4.4 0 3 1.2 4.6 3.6 4.6zm27.4 3.4h-6l-6-7v7h-4.8V8.8h4.9v13.6l5.8-6.7h5.7l-6.6 7.5 7 8.2z"
-            fill="currentColor"
+            fill="#333"
           />
           <mask
             fill="#fff"
@@ -7751,14 +8199,51 @@ exports[`Storyshots UI|Sidebar/SidebarHeading simple 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
   padding: 7px;
-  box-shadow: rgba(51,51,51,0.2) 0 0 0 1px inset;
-  color: rgba(51,51,51,0.7);
+  box-shadow: #DDDDDD 0 0 0 1px inset;
+  color: #666666;
   background: transparent;
   position: relative;
   overflow: visible;
 }
 
+.emotion-5:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-5:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-5:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-5 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-5 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-5 svg {
   display: inline-block;
   height: 14px;
@@ -7770,22 +8255,23 @@ exports[`Storyshots UI|Sidebar/SidebarHeading simple 1`] = `
   pointer-events: none;
 }
 
-.emotion-5 svg path {
-  fill: currentColor;
-}
-
 .emotion-5 svg {
   display: block;
   margin: 0;
 }
 
+.emotion-5 svg path {
+  fill: #666666;
+}
+
 .emotion-5:hover {
-  box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
+  box-shadow: #999999 0 0 0 1px inset;
 }
 
 .emotion-5:active {
-  box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
-  color: #333;
+  background: #DDDDDD;
+  box-shadow: #DDDDDD 0 0 0 1px inset;
+  color: #333333;
 }
 
 .emotion-7 {
@@ -7891,14 +8377,51 @@ exports[`Storyshots UI|Sidebar/SidebarHeading simple 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
   padding: 7px;
-  box-shadow: rgba(51,51,51,0.2) 0 0 0 1px inset;
-  color: rgba(51,51,51,0.7);
+  box-shadow: #DDDDDD 0 0 0 1px inset;
+  color: #666666;
   background: transparent;
   position: relative;
   overflow: visible;
 }
 
+.emotion-5:hover {
+  -webkit-transform: translate3d(0,-2px,0);
+  -ms-transform: translate3d(0,-2px,0);
+  transform: translate3d(0,-2px,0);
+}
+
+.emotion-5:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+}
+
+.emotion-5:hover {
+  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
+}
+
+.emotion-5 > span {
+  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
+  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
+  transform: scale3d(1,1,1) translate3d(0,0,0);
+  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
+  opacity: 1;
+}
+
+.emotion-5 [role="progressbar"] {
+  -webkit-transform: translate3d(0,100%,0);
+  -ms-transform: translate3d(0,100%,0);
+  transform: translate3d(0,100%,0);
+}
+
 .emotion-5 svg {
   display: inline-block;
   height: 14px;
@@ -7910,22 +8433,23 @@ exports[`Storyshots UI|Sidebar/SidebarHeading simple 1`] = `
   pointer-events: none;
 }
 
-.emotion-5 svg path {
-  fill: currentColor;
-}
-
 .emotion-5 svg {
   display: block;
   margin: 0;
 }
 
+.emotion-5 svg path {
+  fill: #666666;
+}
+
 .emotion-5:hover {
-  box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
+  box-shadow: #999999 0 0 0 1px inset;
 }
 
 .emotion-5:active {
-  box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
-  color: #333;
+  background: #DDDDDD;
+  box-shadow: #DDDDDD 0 0 0 1px inset;
+  color: #333333;
 }
 
 .emotion-7 {
@@ -7972,7 +8496,7 @@ exports[`Storyshots UI|Sidebar/SidebarHeading simple 1`] = `
         >
           <path
             d="M53.3 31.7c-1.7 0-3.4-.3-5-.7-1.5-.5-2.8-1.1-3.9-2l1.6-3.5c2.2 1.5 4.6 2.3 7.3 2.3 1.5 0 2.5-.2 3.3-.7.7-.5 1.1-1 1.1-1.9 0-.7-.3-1.3-1-1.7s-2-.8-3.7-1.2c-2-.4-3.6-.9-4.8-1.5-1.1-.5-2-1.2-2.6-2-.5-1-.8-2-.8-3.2 0-1.4.4-2.6 1.2-3.6.7-1.1 1.8-2 3.2-2.6 1.3-.6 2.9-.9 4.7-.9 1.6 0 3.1.3 4.6.7 1.5.5 2.7 1.1 3.5 2l-1.6 3.5c-2-1.5-4.2-2.3-6.5-2.3-1.3 0-2.3.2-3 .8-.8.5-1.2 1.1-1.2 2 0 .5.2 1 .5 1.3.2.3.7.6 1.4.9l2.9.8c2.9.6 5 1.4 6.2 2.4a5 5 0 0 1 2 4.2 6 6 0 0 1-2.5 5c-1.7 1.2-4 1.9-7 1.9zm21-3.6l1.4-.1-.2 3.5-1.9.1c-2.4 0-4.1-.5-5.2-1.5-1.1-1-1.6-2.7-1.6-4.8v-6h-3v-3.6h3V11h4.8v4.6h4v3.6h-4v6c0 1.8.9 2.8 2.6 2.8zm11.1 3.5c-1.6 0-3-.3-4.3-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.3-1 1.7 0 3.2.3 4.4 1a7 7 0 0 1 3 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.4 1zm0-3.6c2.4 0 3.6-1.6 3.6-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.6-1c-2.3 0-3.5 1.4-3.5 4.4 0 3 1.2 4.6 3.5 4.6zm21.7-8.8l-2.7.3c-1.3.2-2.3.5-2.8 1.2-.6.6-.9 1.4-.9 2.5v8.2H96V15.7h4.6v2.6c.8-1.8 2.5-2.8 5-3h1.3l.3 4zm14-3.5h4.8L116.4 37h-4.9l3-6.6-6.4-14.8h5l4 10 4-10zm16-.4c1.4 0 2.6.3 3.6 1 1 .6 1.9 1.6 2.5 2.8.6 1.2.9 2.7.9 4.3 0 1.6-.3 3-1 4.3a6.9 6.9 0 0 1-2.4 2.9c-1 .7-2.2 1-3.6 1-1 0-2-.2-3-.7-.8-.4-1.5-1-2-1.9v2.4h-4.7V8.8h4.8v9c.5-.8 1.2-1.4 2-1.9.9-.4 1.8-.6 3-.6zM135.7 28c1.1 0 2-.4 2.6-1.2.6-.8 1-2 1-3.4 0-1.5-.4-2.5-1-3.3s-1.5-1.1-2.6-1.1-2 .3-2.6 1.1c-.6.8-1 2-1 3.3 0 1.5.4 2.6 1 3.4.6.8 1.5 1.2 2.6 1.2zm18.9 3.6c-1.7 0-3.2-.3-4.4-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.4-1 1.6 0 3 .3 4.3 1a7 7 0 0 1 3 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.3 1zm0-3.6c2.3 0 3.5-1.6 3.5-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.5-1c-2.4 0-3.6 1.4-3.6 4.4 0 3 1.2 4.6 3.6 4.6zm18 3.6c-1.7 0-3.2-.3-4.4-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.4-1 1.6 0 3 .3 4.4 1a7 7 0 0 1 2.9 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.3 1zm0-3.6c2.3 0 3.5-1.6 3.5-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.5-1c-2.4 0-3.6 1.4-3.6 4.4 0 3 1.2 4.6 3.6 4.6zm27.4 3.4h-6l-6-7v7h-4.8V8.8h4.9v13.6l5.8-6.7h5.7l-6.6 7.5 7 8.2z"
-            fill="currentColor"
+            fill="#333"
           />
           <mask
             fill="#fff"
@@ -8044,7 +8568,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem component 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
-  color: #333333;
+  color: rgba(51,51,51,0.8);
 }
 
 .emotion-3:hover {
@@ -8106,7 +8630,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem component 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
-  color: #333333;
+  color: rgba(51,51,51,0.8);
 }
 
 .emotion-3:hover {
@@ -8194,7 +8718,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem componentExpanded 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
-  color: #333333;
+  color: rgba(51,51,51,0.8);
 }
 
 .emotion-3:hover {
@@ -8259,7 +8783,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem componentExpanded 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
-  color: #333333;
+  color: rgba(51,51,51,0.8);
 }
 
 .emotion-3:hover {
@@ -8350,7 +8874,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem group 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
-  color: #333333;
+  color: rgba(51,51,51,0.8);
 }
 
 .emotion-3:hover {
@@ -8412,7 +8936,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem group 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
-  color: #333333;
+  color: rgba(51,51,51,0.8);
 }
 
 .emotion-3:hover {
@@ -8740,7 +9264,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem nestedDepths 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
-  color: #333333;
+  color: rgba(51,51,51,0.8);
 }
 
 .emotion-3:hover {
@@ -8815,7 +9339,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem nestedDepths 1`] = `
   transition: background 75ms ease-out;
   padding-left: 24px;
   cursor: pointer;
-  color: #333333;
+  color: rgba(51,51,51,0.8);
 }
 
 .emotion-11:hover {
@@ -8888,7 +9412,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem nestedDepths 1`] = `
   transition: background 75ms ease-out;
   padding-left: 39px;
   cursor: pointer;
-  color: #333333;
+  color: rgba(51,51,51,0.8);
 }
 
 .emotion-15:hover {
@@ -8918,7 +9442,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem nestedDepths 1`] = `
   transition: background 75ms ease-out;
   padding-left: 54px;
   cursor: pointer;
-  color: #333333;
+  color: rgba(51,51,51,0.8);
 }
 
 .emotion-19:hover {
@@ -8952,7 +9476,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem nestedDepths 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
-  color: #333333;
+  color: rgba(51,51,51,0.8);
 }
 
 .emotion-3:hover {
@@ -9027,7 +9551,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem nestedDepths 1`] = `
   transition: background 75ms ease-out;
   padding-left: 24px;
   cursor: pointer;
-  color: #333333;
+  color: rgba(51,51,51,0.8);
 }
 
 .emotion-11:hover {
@@ -9100,7 +9624,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem nestedDepths 1`] = `
   transition: background 75ms ease-out;
   padding-left: 39px;
   cursor: pointer;
-  color: #333333;
+  color: rgba(51,51,51,0.8);
 }
 
 .emotion-15:hover {
@@ -9130,7 +9654,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem nestedDepths 1`] = `
   transition: background 75ms ease-out;
   padding-left: 54px;
   cursor: pointer;
-  color: #333333;
+  color: rgba(51,51,51,0.8);
 }
 
 .emotion-19:hover {
@@ -9268,7 +9792,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem story 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
-  color: #333333;
+  color: rgba(51,51,51,0.8);
 }
 
 .emotion-3:hover {
@@ -9331,7 +9855,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem story 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
-  color: #333333;
+  color: rgba(51,51,51,0.8);
 }
 
 .emotion-3:hover {
@@ -9568,7 +10092,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem with long name 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
-  color: #333333;
+  color: rgba(51,51,51,0.8);
 }
 
 .emotion-3:hover {
@@ -9630,7 +10154,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem with long name 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
-  color: #333333;
+  color: rgba(51,51,51,0.8);
 }
 
 .emotion-3:hover {
@@ -10560,7 +11084,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories empty 1`] = `
 .emotion-4 {
   padding: 30px;
   text-align: center;
-  color: #333333;
+  color: #666666;
   font-size: 13px;
 }
 
@@ -10627,7 +11151,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories empty 1`] = `
 .emotion-4 {
   padding: 30px;
   text-align: center;
-  color: #333333;
+  color: #666666;
   font-size: 13px;
 }
 
@@ -11666,7 +12190,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories noRoot 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
-  color: #333333;
+  color: rgba(51,51,51,0.8);
 }
 
 .emotion-10:hover {
@@ -11757,7 +12281,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories noRoot 1`] = `
   transition: background 75ms ease-out;
   padding-left: 24px;
   cursor: pointer;
-  color: #333333;
+  color: rgba(51,51,51,0.8);
 }
 
 .emotion-15:hover {
@@ -11830,7 +12354,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories noRoot 1`] = `
   transition: background 75ms ease-out;
   padding-left: 39px;
   cursor: pointer;
-  color: #333333;
+  color: rgba(51,51,51,0.8);
 }
 
 .emotion-30:hover {
@@ -12038,7 +12562,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories noRoot 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
-  color: #333333;
+  color: rgba(51,51,51,0.8);
 }
 
 .emotion-10:hover {
@@ -12129,7 +12653,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories noRoot 1`] = `
   transition: background 75ms ease-out;
   padding-left: 24px;
   cursor: pointer;
-  color: #333333;
+  color: rgba(51,51,51,0.8);
 }
 
 .emotion-15:hover {
@@ -12202,7 +12726,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories noRoot 1`] = `
   transition: background 75ms ease-out;
   padding-left: 39px;
   cursor: pointer;
-  color: #333333;
+  color: rgba(51,51,51,0.8);
 }
 
 .emotion-30:hover {
@@ -12640,7 +13164,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories withRoot 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
-  color: #333333;
+  color: rgba(51,51,51,0.8);
 }
 
 .emotion-11:hover {
@@ -12758,7 +13282,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories withRoot 1`] = `
   transition: background 75ms ease-out;
   padding-left: 24px;
   cursor: pointer;
-  color: #333333;
+  color: rgba(51,51,51,0.8);
 }
 
 .emotion-21:hover {
@@ -12995,7 +13519,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories withRoot 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
-  color: #333333;
+  color: rgba(51,51,51,0.8);
 }
 
 .emotion-11:hover {
@@ -13113,7 +13637,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories withRoot 1`] = `
   transition: background 75ms ease-out;
   padding-left: 24px;
   cursor: pointer;
-  color: #333333;
+  color: rgba(51,51,51,0.8);
 }
 
 .emotion-21:hover {
diff --git a/lib/components/src/Button/__snapshots__/Button.stories.storyshot b/lib/components/src/Button/__snapshots__/Button.stories.storyshot
index 7c7590fff4b..e1e47a2c11d 100644
--- a/lib/components/src/Button/__snapshots__/Button.stories.storyshot
+++ b/lib/components/src/Button/__snapshots__/Button.stories.storyshot
@@ -13,80 +13,6 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   fill: currentColor;
 }
 
-.emotion-3 {
-  border: 0;
-  border-radius: 3em;
-  cursor: pointer;
-  display: inline-block;
-  overflow: hidden;
-  padding: 10px 16px;
-  position: relative;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  vertical-align: top;
-  white-space: nowrap;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-  user-select: none;
-  opacity: 1;
-  margin: 0;
-  background: transparent;
-  font-size: 12px;
-  font-weight: 700;
-  line-height: 1;
-  background: #fafafa;
-  color: #333333;
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  border-radius: 4px;
-  display: inline;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-  user-select: none;
-  overflow: visible;
-  z-index: 2;
-}
-
-.emotion-3 svg {
-  display: inline-block;
-  height: 14px;
-  width: 14px;
-  vertical-align: top;
-  margin-right: 4px;
-  margin-top: -1px;
-  margin-bottom: -1px;
-  pointer-events: none;
-}
-
-.emotion-3 svg path {
-  fill: currentColor;
-}
-
-.emotion-3:hover {
-  background: #f2f2f2;
-}
-
-.emotion-3:active {
-  background: #FFFFFF;
-}
-
-.emotion-3:focus {
-  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
-}
-
-.emotion-3:hover {
-  -webkit-transform: none;
-  -ms-transform: none;
-  transform: none;
-}
-
 .emotion-0 {
   border: 0;
   border-radius: 3em;
@@ -241,7 +167,7 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   font-size: 13px;
   font-weight: 700;
   line-height: 1;
-  background: #fafafa;
+  background: #fff;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
   border-radius: 4px;
@@ -263,7 +189,7 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
 }
 
 .emotion-2:hover {
-  background: #f2f2f2;
+  background: #fff;
   box-shadow: rgba(0,0,0,.2) 0 2px 6px 0,rgba(0,0,0,.1) 0 0 0 1px inset;
 }
 
@@ -275,6 +201,80 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
+.emotion-3 {
+  border: 0;
+  border-radius: 3em;
+  cursor: pointer;
+  display: inline-block;
+  overflow: hidden;
+  padding: 10px 16px;
+  position: relative;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  vertical-align: top;
+  white-space: nowrap;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  opacity: 1;
+  margin: 0;
+  background: transparent;
+  font-size: 12px;
+  font-weight: 700;
+  line-height: 1;
+  background: #fff;
+  color: #333333;
+  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  border-radius: 4px;
+  display: inline;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  overflow: visible;
+  z-index: 2;
+}
+
+.emotion-3 svg {
+  display: inline-block;
+  height: 14px;
+  width: 14px;
+  vertical-align: top;
+  margin-right: 4px;
+  margin-top: -1px;
+  margin-bottom: -1px;
+  pointer-events: none;
+}
+
+.emotion-3 svg path {
+  fill: currentColor;
+}
+
+.emotion-3:hover {
+  background: #fff;
+}
+
+.emotion-3:active {
+  background: #FFFFFF;
+}
+
+.emotion-3:focus {
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
+}
+
+.emotion-3:hover {
+  -webkit-transform: none;
+  -ms-transform: none;
+  transform: none;
+}
+
 .emotion-4 {
   border: 0;
   border-radius: 3em;
@@ -753,7 +753,7 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fafafa;
+  background: #fff;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
   border-radius: 4px;
@@ -775,7 +775,7 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
 }
 
 .emotion-10:hover {
-  background: #f2f2f2;
+  background: #fff;
   box-shadow: rgba(0,0,0,.2) 0 2px 6px 0,rgba(0,0,0,.1) 0 0 0 1px inset;
 }
 
diff --git a/lib/components/src/form/__snapshots__/form.stories.storyshot b/lib/components/src/form/__snapshots__/form.stories.storyshot
index 52e22b8d4c8..620c1052048 100644
--- a/lib/components/src/form/__snapshots__/form.stories.storyshot
+++ b/lib/components/src/form/__snapshots__/form.stories.storyshot
@@ -37,7 +37,7 @@ exports[`Storyshots Basics|Form/Button sizes 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fafafa;
+  background: #fff;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
   border-radius: 4px;
@@ -66,7 +66,7 @@ exports[`Storyshots Basics|Form/Button sizes 1`] = `
 }
 
 .emotion-0:hover {
-  background: #f2f2f2;
+  background: #fff;
 }
 
 .emotion-0:active {
@@ -118,7 +118,7 @@ exports[`Storyshots Basics|Form/Button sizes 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fafafa;
+  background: #fff;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
   border-radius: 4px;
@@ -149,7 +149,7 @@ exports[`Storyshots Basics|Form/Button sizes 1`] = `
 }
 
 .emotion-2:hover {
-  background: #f2f2f2;
+  background: #fff;
 }
 
 .emotion-2:active {
@@ -194,7 +194,7 @@ exports[`Storyshots Basics|Form/Button sizes 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fafafa;
+  background: #fff;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
   border-radius: 4px;
@@ -223,7 +223,7 @@ exports[`Storyshots Basics|Form/Button sizes 1`] = `
 }
 
 .emotion-4:hover {
-  background: #f2f2f2;
+  background: #fff;
 }
 
 .emotion-4:active {
@@ -317,7 +317,7 @@ exports[`Storyshots Basics|Form/Button validations 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fafafa;
+  background: #fff;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
   border-radius: 4px;
@@ -346,7 +346,7 @@ exports[`Storyshots Basics|Form/Button validations 1`] = `
 }
 
 .emotion-6:hover {
-  background: #f2f2f2;
+  background: #fff;
 }
 
 .emotion-6:active {
@@ -391,7 +391,7 @@ exports[`Storyshots Basics|Form/Button validations 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fafafa;
+  background: #fff;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
   border-radius: 4px;
@@ -421,7 +421,7 @@ exports[`Storyshots Basics|Form/Button validations 1`] = `
 }
 
 .emotion-0:hover {
-  background: #f2f2f2;
+  background: #fff;
 }
 
 .emotion-0:active {
@@ -466,7 +466,7 @@ exports[`Storyshots Basics|Form/Button validations 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fafafa;
+  background: #fff;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
   border-radius: 4px;
@@ -496,7 +496,7 @@ exports[`Storyshots Basics|Form/Button validations 1`] = `
 }
 
 .emotion-2:hover {
-  background: #f2f2f2;
+  background: #fff;
 }
 
 .emotion-2:active {
@@ -541,7 +541,7 @@ exports[`Storyshots Basics|Form/Button validations 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fafafa;
+  background: #fff;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
   border-radius: 4px;
@@ -571,7 +571,7 @@ exports[`Storyshots Basics|Form/Button validations 1`] = `
 }
 
 .emotion-4:hover {
-  background: #f2f2f2;
+  background: #fff;
 }
 
 .emotion-4:active {
diff --git a/lib/components/src/syntaxhighlighter/__snapshots__/syntaxhighlighter.stories.storyshot b/lib/components/src/syntaxhighlighter/__snapshots__/syntaxhighlighter.stories.storyshot
index 83209e363fb..3e85209335f 100644
--- a/lib/components/src/syntaxhighlighter/__snapshots__/syntaxhighlighter.stories.storyshot
+++ b/lib/components/src/syntaxhighlighter/__snapshots__/syntaxhighlighter.stories.storyshot
@@ -405,7 +405,6 @@ exports[`Storyshots Basics|SyntaxHighlighter bordered & copy-able 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  background: #FFFFFF;
 }
 
 .emotion-3 {
@@ -421,7 +420,6 @@ exports[`Storyshots Basics|SyntaxHighlighter bordered & copy-able 1`] = `
   -ms-flex-align: center;
   align-items: center;
   color: #333333;
-  background: #FFFFFF;
   font-size: 12px;
   line-height: 16px;
   font-weight: 700;
diff --git a/lib/components/src/tabs/__snapshots__/tabs.stories.storyshot b/lib/components/src/tabs/__snapshots__/tabs.stories.storyshot
index d485e04bc89..cc872571d38 100644
--- a/lib/components/src/tabs/__snapshots__/tabs.stories.storyshot
+++ b/lib/components/src/tabs/__snapshots__/tabs.stories.storyshot
@@ -1,25 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Storyshots Basics|Tabs stateful - dynamic 1`] = `
-.emotion-8 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-pack: justify;
-  -webkit-justify-content: space-between;
-  -ms-flex-pack: justify;
-  justify-content: space-between;
-  background: #FFFFFF;
-  color: #999999;
-  height: 40px;
-  position: relative;
-  overflow: visible;
-  overflow-x: visible;
-  overflow-y: visible;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
-}
-
 .emotion-7 {
   display: -webkit-box;
   display: -webkit-flex;
@@ -46,51 +27,6 @@ exports[`Storyshots Basics|Tabs stateful - dynamic 1`] = `
   margin-left: 0;
 }
 
-.emotion-0 {
-  white-space: normal;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding: 0 15px;
-  text-transform: capitalize;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  height: 40px;
-  line-height: 12px;
-  cursor: pointer;
-  background: transparent;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  font-weight: bold;
-  font-size: 13px;
-  color: inherit;
-  border-bottom-color: transparent;
-}
-
-.emotion-0:empty {
-  display: none;
-}
-
-.emotion-0:focus {
-  outline: 0 none;
-  border-bottom-color: #1EA7FD;
-}
-
 .emotion-2 {
   white-space: normal;
   display: -webkit-inline-box;
@@ -140,6 +76,69 @@ exports[`Storyshots Basics|Tabs stateful - dynamic 1`] = `
   display: block;
 }
 
+.emotion-8 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+  color: #999999;
+  height: 40px;
+  position: relative;
+  overflow: visible;
+  overflow-x: visible;
+  overflow-y: visible;
+  background: undefined linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-0 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
+  font-size: 13px;
+  color: inherit;
+  border-bottom-color: transparent;
+}
+
+.emotion-0:empty {
+  display: none;
+}
+
+.emotion-0:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
 .emotion-10 {
   display: block;
   position: relative;
@@ -282,25 +281,6 @@ exports[`Storyshots Basics|Tabs stateful - dynamic 1`] = `
 `;
 
 exports[`Storyshots Basics|Tabs stateful - no initial 1`] = `
-.emotion-8 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-pack: justify;
-  -webkit-justify-content: space-between;
-  -ms-flex-pack: justify;
-  justify-content: space-between;
-  background: #FFFFFF;
-  color: #999999;
-  height: 40px;
-  position: relative;
-  overflow: visible;
-  overflow-x: visible;
-  overflow-y: visible;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
-}
-
 .emotion-7 {
   display: -webkit-box;
   display: -webkit-flex;
@@ -327,51 +307,6 @@ exports[`Storyshots Basics|Tabs stateful - no initial 1`] = `
   margin-left: 0;
 }
 
-.emotion-1 {
-  white-space: normal;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding: 0 15px;
-  text-transform: capitalize;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  height: 40px;
-  line-height: 12px;
-  cursor: pointer;
-  background: transparent;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  font-weight: bold;
-  font-size: 13px;
-  color: inherit;
-  border-bottom-color: transparent;
-}
-
-.emotion-1:empty {
-  display: none;
-}
-
-.emotion-1:focus {
-  outline: 0 none;
-  border-bottom-color: #1EA7FD;
-}
-
 .emotion-0 {
   white-space: normal;
   display: -webkit-inline-box;
@@ -421,6 +356,69 @@ exports[`Storyshots Basics|Tabs stateful - no initial 1`] = `
   display: block;
 }
 
+.emotion-8 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+  color: #999999;
+  height: 40px;
+  position: relative;
+  overflow: visible;
+  overflow-x: visible;
+  overflow-y: visible;
+  background: undefined linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-1 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
+  font-size: 13px;
+  color: inherit;
+  border-bottom-color: transparent;
+}
+
+.emotion-1:empty {
+  display: none;
+}
+
+.emotion-1:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
 .emotion-10 {
   display: block;
   position: relative;
@@ -519,25 +517,6 @@ exports[`Storyshots Basics|Tabs stateful - no initial 1`] = `
 `;
 
 exports[`Storyshots Basics|Tabs stateful - static 1`] = `
-.emotion-4 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-pack: justify;
-  -webkit-justify-content: space-between;
-  -ms-flex-pack: justify;
-  justify-content: space-between;
-  background: #FFFFFF;
-  color: #999999;
-  height: 40px;
-  position: relative;
-  overflow: visible;
-  overflow-x: visible;
-  overflow-y: visible;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
-}
-
 .emotion-3 {
   display: -webkit-box;
   display: -webkit-flex;
@@ -564,51 +543,6 @@ exports[`Storyshots Basics|Tabs stateful - static 1`] = `
   margin-left: 0;
 }
 
-.emotion-0 {
-  white-space: normal;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding: 0 15px;
-  text-transform: capitalize;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  height: 40px;
-  line-height: 12px;
-  cursor: pointer;
-  background: transparent;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  font-weight: bold;
-  font-size: 13px;
-  color: inherit;
-  border-bottom-color: transparent;
-}
-
-.emotion-0:empty {
-  display: none;
-}
-
-.emotion-0:focus {
-  outline: 0 none;
-  border-bottom-color: #1EA7FD;
-}
-
 .emotion-1 {
   white-space: normal;
   display: -webkit-inline-box;
@@ -658,6 +592,69 @@ exports[`Storyshots Basics|Tabs stateful - static 1`] = `
   display: block;
 }
 
+.emotion-4 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+  color: #999999;
+  height: 40px;
+  position: relative;
+  overflow: visible;
+  overflow-x: visible;
+  overflow-y: visible;
+  background: undefined linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-0 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
+  font-size: 13px;
+  color: inherit;
+  border-bottom-color: transparent;
+}
+
+.emotion-0:empty {
+  display: none;
+}
+
+.emotion-0:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
 .emotion-6 {
   display: block;
   position: relative;
@@ -714,25 +711,6 @@ exports[`Storyshots Basics|Tabs stateful - static 1`] = `
 `;
 
 exports[`Storyshots Basics|Tabs stateless - absolute 1`] = `
-.emotion-8 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-pack: justify;
-  -webkit-justify-content: space-between;
-  -ms-flex-pack: justify;
-  justify-content: space-between;
-  background: #FFFFFF;
-  color: #999999;
-  height: 40px;
-  position: relative;
-  overflow: visible;
-  overflow-x: visible;
-  overflow-y: visible;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
-}
-
 .emotion-7 {
   display: -webkit-box;
   display: -webkit-flex;
@@ -759,51 +737,6 @@ exports[`Storyshots Basics|Tabs stateless - absolute 1`] = `
   margin-left: 0;
 }
 
-.emotion-0 {
-  white-space: normal;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding: 0 15px;
-  text-transform: capitalize;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  height: 40px;
-  line-height: 12px;
-  cursor: pointer;
-  background: transparent;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  font-weight: bold;
-  font-size: 13px;
-  color: inherit;
-  border-bottom-color: transparent;
-}
-
-.emotion-0:empty {
-  display: none;
-}
-
-.emotion-0:focus {
-  outline: 0 none;
-  border-bottom-color: #1EA7FD;
-}
-
 .emotion-2 {
   white-space: normal;
   display: -webkit-inline-box;
@@ -861,6 +794,69 @@ exports[`Storyshots Basics|Tabs stateless - absolute 1`] = `
   width: 100%;
 }
 
+.emotion-8 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+  color: #999999;
+  height: 40px;
+  position: relative;
+  overflow: visible;
+  overflow-x: visible;
+  overflow-y: visible;
+  background: undefined linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-0 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
+  font-size: 13px;
+  color: inherit;
+  border-bottom-color: transparent;
+}
+
+.emotion-0:empty {
+  display: none;
+}
+
+.emotion-0:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
 .emotion-9 {
   display: none;
 }
@@ -1012,25 +1008,6 @@ exports[`Storyshots Basics|Tabs stateless - absolute 1`] = `
 `;
 
 exports[`Storyshots Basics|Tabs stateless - bordered 1`] = `
-.emotion-8 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-pack: justify;
-  -webkit-justify-content: space-between;
-  -ms-flex-pack: justify;
-  justify-content: space-between;
-  background: #FFFFFF;
-  color: #999999;
-  height: 40px;
-  position: relative;
-  overflow: visible;
-  overflow-x: visible;
-  overflow-y: visible;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
-}
-
 .emotion-7 {
   display: -webkit-box;
   display: -webkit-flex;
@@ -1057,51 +1034,6 @@ exports[`Storyshots Basics|Tabs stateless - bordered 1`] = `
   margin-left: 0;
 }
 
-.emotion-0 {
-  white-space: normal;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding: 0 15px;
-  text-transform: capitalize;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  height: 40px;
-  line-height: 12px;
-  cursor: pointer;
-  background: transparent;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  font-weight: bold;
-  font-size: 13px;
-  color: inherit;
-  border-bottom-color: transparent;
-}
-
-.emotion-0:empty {
-  display: none;
-}
-
-.emotion-0:focus {
-  outline: 0 none;
-  border-bottom-color: #1EA7FD;
-}
-
 .emotion-2 {
   white-space: normal;
   display: -webkit-inline-box;
@@ -1147,6 +1079,69 @@ exports[`Storyshots Basics|Tabs stateless - bordered 1`] = `
   border-bottom-color: #1EA7FD;
 }
 
+.emotion-8 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+  color: #999999;
+  height: 40px;
+  position: relative;
+  overflow: visible;
+  overflow-x: visible;
+  overflow-y: visible;
+  background: undefined linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-0 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
+  font-size: 13px;
+  color: inherit;
+  border-bottom-color: transparent;
+}
+
+.emotion-0:empty {
+  display: none;
+}
+
+.emotion-0:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
 .emotion-10 {
   display: block;
   position: relative;
@@ -1295,6 +1290,10 @@ exports[`Storyshots Basics|Tabs stateless - bordered 1`] = `
 `;
 
 exports[`Storyshots Basics|Tabs stateless - empty 1`] = `
+.emotion-0 {
+  font-weight: 700;
+}
+
 .emotion-1 {
   padding: 30px;
   text-align: center;
@@ -1302,10 +1301,6 @@ exports[`Storyshots Basics|Tabs stateless - empty 1`] = `
   font-size: 13px;
 }
 
-.emotion-0 {
-  font-weight: 700;
-}
-
 <div
   style="height:calc(100vh - 20px)"
 >
@@ -1348,51 +1343,6 @@ exports[`Storyshots Basics|Tabs stateless - no scrolling 1`] = `
   margin-left: 0;
 }
 
-.emotion-0 {
-  white-space: normal;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding: 0 15px;
-  text-transform: capitalize;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  height: 40px;
-  line-height: 12px;
-  cursor: pointer;
-  background: transparent;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  font-weight: bold;
-  font-size: 13px;
-  color: inherit;
-  border-bottom-color: transparent;
-}
-
-.emotion-0:empty {
-  display: none;
-}
-
-.emotion-0:focus {
-  outline: 0 none;
-  border-bottom-color: #1EA7FD;
-}
-
 .emotion-2 {
   white-space: normal;
   display: -webkit-inline-box;
@@ -1438,6 +1388,51 @@ exports[`Storyshots Basics|Tabs stateless - no scrolling 1`] = `
   border-bottom-color: #1EA7FD;
 }
 
+.emotion-0 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
+  font-size: 13px;
+  color: inherit;
+  border-bottom-color: transparent;
+}
+
+.emotion-0:empty {
+  display: none;
+}
+
+.emotion-0:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
 .emotion-10 {
   display: block;
   position: relative;
@@ -1463,14 +1458,13 @@ exports[`Storyshots Basics|Tabs stateless - no scrolling 1`] = `
   -webkit-justify-content: space-between;
   -ms-flex-pack: justify;
   justify-content: space-between;
-  background: #FFFFFF;
   color: #999999;
   height: 40px;
   position: relative;
   overflow: auto;
   overflow-x: auto;
   overflow-y: hidden;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+  background: undefined linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
 }
 
 <div
@@ -1605,25 +1599,6 @@ exports[`Storyshots Basics|Tabs stateless - no scrolling 1`] = `
 `;
 
 exports[`Storyshots Basics|Tabs stateless - with tools 1`] = `
-.emotion-9 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-pack: justify;
-  -webkit-justify-content: space-between;
-  -ms-flex-pack: justify;
-  justify-content: space-between;
-  background: #FFFFFF;
-  color: #999999;
-  height: 40px;
-  position: relative;
-  overflow: visible;
-  overflow-x: visible;
-  overflow-y: visible;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
-}
-
 .emotion-7 {
   display: -webkit-box;
   display: -webkit-flex;
@@ -1650,51 +1625,6 @@ exports[`Storyshots Basics|Tabs stateless - with tools 1`] = `
   margin-left: 0;
 }
 
-.emotion-0 {
-  white-space: normal;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding: 0 15px;
-  text-transform: capitalize;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  height: 40px;
-  line-height: 12px;
-  cursor: pointer;
-  background: transparent;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  font-weight: bold;
-  font-size: 13px;
-  color: inherit;
-  border-bottom-color: transparent;
-}
-
-.emotion-0:empty {
-  display: none;
-}
-
-.emotion-0:focus {
-  outline: 0 none;
-  border-bottom-color: #1EA7FD;
-}
-
 .emotion-2 {
   white-space: normal;
   display: -webkit-inline-box;
@@ -1755,6 +1685,69 @@ exports[`Storyshots Basics|Tabs stateless - with tools 1`] = `
   display: block;
 }
 
+.emotion-9 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+  color: #999999;
+  height: 40px;
+  position: relative;
+  overflow: visible;
+  overflow-x: visible;
+  overflow-y: visible;
+  background: undefined linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-0 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
+  font-size: 13px;
+  color: inherit;
+  border-bottom-color: transparent;
+}
+
+.emotion-0:empty {
+  display: none;
+}
+
+.emotion-0:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
 .emotion-11 {
   display: block;
   position: relative;
diff --git a/lib/components/src/tooltip/__snapshots__/ListItem.stories.storyshot b/lib/components/src/tooltip/__snapshots__/ListItem.stories.storyshot
index d8481a0e4e6..832986157ec 100644
--- a/lib/components/src/tooltip/__snapshots__/ListItem.stories.storyshot
+++ b/lib/components/src/tooltip/__snapshots__/ListItem.stories.storyshot
@@ -13,6 +13,21 @@ exports[`Storyshots basics|Tooltip/ListItem active icon 1`] = `
   fill: currentColor;
 }
 
+.emotion-1 {
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  text-align: left;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+}
+
+.emotion-1 > * + * {
+  padding-left: 10px;
+}
+
 .emotion-5 {
   font-size: 12px;
   -webkit-transition: all 150ms ease-out;
@@ -49,21 +64,6 @@ exports[`Storyshots basics|Tooltip/ListItem active icon 1`] = `
   opacity: 1;
 }
 
-.emotion-1 {
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  text-align: left;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-}
-
-.emotion-1 > * + * {
-  padding-left: 10px;
-}
-
 .emotion-0 {
   color: #333333;
   color: #FF4785;
@@ -183,6 +183,21 @@ exports[`Storyshots basics|Tooltip/ListItem all 1`] = `
   fill: currentColor;
 }
 
+.emotion-1 {
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  text-align: left;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+}
+
+.emotion-1 > * + * {
+  padding-left: 10px;
+}
+
 .emotion-2 {
   font-size: 12px;
   -webkit-transition: all 150ms ease-out;
@@ -219,25 +234,6 @@ exports[`Storyshots basics|Tooltip/ListItem all 1`] = `
   opacity: 1;
 }
 
-.emotion-1 {
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  text-align: left;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-}
-
-.emotion-1 > * + * {
-  padding-left: 10px;
-}
-
-.emotion-3 {
-  color: #333333;
-}
-
 .emotion-0 {
   color: #333333;
   -webkit-animation: animation-0 1.5s ease-in-out infinite;
@@ -247,6 +243,10 @@ exports[`Storyshots basics|Tooltip/ListItem all 1`] = `
   cursor: progress;
 }
 
+.emotion-3 {
+  color: #333333;
+}
+
 .emotion-10 svg {
   -webkit-transition: all 200ms ease-out;
   transition: all 200ms ease-out;
@@ -546,6 +546,21 @@ exports[`Storyshots basics|Tooltip/ListItem all 1`] = `
 `;
 
 exports[`Storyshots basics|Tooltip/ListItem default 1`] = `
+.emotion-1 {
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  text-align: left;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+}
+
+.emotion-1 > * + * {
+  padding-left: 10px;
+}
+
 .emotion-2 {
   font-size: 12px;
   -webkit-transition: all 150ms ease-out;
@@ -582,21 +597,6 @@ exports[`Storyshots basics|Tooltip/ListItem default 1`] = `
   opacity: 1;
 }
 
-.emotion-1 {
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  text-align: left;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-}
-
-.emotion-1 > * + * {
-  padding-left: 10px;
-}
-
 .emotion-0 {
   color: #333333;
 }
@@ -629,6 +629,21 @@ exports[`Storyshots basics|Tooltip/ListItem default icon 1`] = `
   fill: currentColor;
 }
 
+.emotion-1 {
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  text-align: left;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+}
+
+.emotion-1 > * + * {
+  padding-left: 10px;
+}
+
 .emotion-5 {
   font-size: 12px;
   -webkit-transition: all 150ms ease-out;
@@ -665,21 +680,6 @@ exports[`Storyshots basics|Tooltip/ListItem default icon 1`] = `
   opacity: 1;
 }
 
-.emotion-1 {
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  text-align: left;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-}
-
-.emotion-1 > * + * {
-  padding-left: 10px;
-}
-
 .emotion-0 {
   color: #333333;
 }
@@ -892,6 +892,21 @@ exports[`Storyshots basics|Tooltip/ListItem loading 1`] = `
   }
 }
 
+.emotion-1 {
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  text-align: left;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+}
+
+.emotion-1 > * + * {
+  padding-left: 10px;
+}
+
 .emotion-2 {
   font-size: 12px;
   -webkit-transition: all 150ms ease-out;
@@ -928,21 +943,6 @@ exports[`Storyshots basics|Tooltip/ListItem loading 1`] = `
   opacity: 1;
 }
 
-.emotion-1 {
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  text-align: left;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-}
-
-.emotion-1 > * + * {
-  padding-left: 10px;
-}
-
 .emotion-0 {
   color: #333333;
   -webkit-animation: animation-0 1.5s ease-in-out infinite;
@@ -970,6 +970,21 @@ exports[`Storyshots basics|Tooltip/ListItem loading 1`] = `
 `;
 
 exports[`Storyshots basics|Tooltip/ListItem w/positions 1`] = `
+.emotion-3 {
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  text-align: left;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+}
+
+.emotion-3 > * + * {
+  padding-left: 10px;
+}
+
 .emotion-5 {
   font-size: 12px;
   -webkit-transition: all 150ms ease-out;
@@ -1006,21 +1021,6 @@ exports[`Storyshots basics|Tooltip/ListItem w/positions 1`] = `
   opacity: 1;
 }
 
-.emotion-3 {
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  text-align: left;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-}
-
-.emotion-3 > * + * {
-  padding-left: 10px;
-}
-
 .emotion-1 {
   color: #333333;
 }
@@ -1077,6 +1077,21 @@ exports[`Storyshots basics|Tooltip/ListItem w/positions 1`] = `
 `;
 
 exports[`Storyshots basics|Tooltip/ListItem w/positions active 1`] = `
+.emotion-3 {
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  text-align: left;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+}
+
+.emotion-3 > * + * {
+  padding-left: 10px;
+}
+
 .emotion-5 {
   font-size: 12px;
   -webkit-transition: all 150ms ease-out;
@@ -1113,21 +1128,6 @@ exports[`Storyshots basics|Tooltip/ListItem w/positions active 1`] = `
   opacity: 1;
 }
 
-.emotion-3 {
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  text-align: left;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-}
-
-.emotion-3 > * + * {
-  padding-left: 10px;
-}
-
 .emotion-0 svg {
   opacity: 1;
 }
diff --git a/lib/components/src/tooltip/__snapshots__/Tooltip.stories.storyshot b/lib/components/src/tooltip/__snapshots__/Tooltip.stories.storyshot
index baeb3ec4662..19dc793d25f 100644
--- a/lib/components/src/tooltip/__snapshots__/Tooltip.stories.storyshot
+++ b/lib/components/src/tooltip/__snapshots__/Tooltip.stories.storyshot
@@ -77,7 +77,7 @@ exports[`Storyshots basics/Tooltip/Tooltip basic, default, bottom 1`] = `
   margin-top: 10px;
   margin-left: 0px;
   margin-right: 0px;
-  background: rgba(255,255,255,0.95);
+  background: rgba(0,0,0,0.95);
   -webkit-filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
   filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
   border-radius: 8px;
@@ -100,7 +100,7 @@ exports[`Storyshots basics/Tooltip/Tooltip basic, default, bottom 1`] = `
   border-right-width: 8px;
   border-left-width: 8px;
   border-top-color: transparent;
-  border-bottom-color: rgba(255,255,255,0.95);
+  border-bottom-color: rgba(0,0,0,0.95);
   border-left-color: transparent;
   border-right-color: transparent;
 }
@@ -136,7 +136,7 @@ exports[`Storyshots basics/Tooltip/Tooltip basic, default, left 1`] = `
   margin-top: 0px;
   margin-left: 0px;
   margin-right: 10px;
-  background: rgba(255,255,255,0.95);
+  background: rgba(0,0,0,0.95);
   -webkit-filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
   filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
   border-radius: 8px;
@@ -160,7 +160,7 @@ exports[`Storyshots basics/Tooltip/Tooltip basic, default, left 1`] = `
   border-left-width: 8px;
   border-top-color: transparent;
   border-bottom-color: transparent;
-  border-left-color: rgba(255,255,255,0.95);
+  border-left-color: rgba(0,0,0,0.95);
   border-right-color: transparent;
 }
 
@@ -195,7 +195,7 @@ exports[`Storyshots basics/Tooltip/Tooltip basic, default, right 1`] = `
   margin-top: 0px;
   margin-left: 10px;
   margin-right: 0px;
-  background: rgba(255,255,255,0.95);
+  background: rgba(0,0,0,0.95);
   -webkit-filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
   filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
   border-radius: 8px;
@@ -220,7 +220,7 @@ exports[`Storyshots basics/Tooltip/Tooltip basic, default, right 1`] = `
   border-top-color: transparent;
   border-bottom-color: transparent;
   border-left-color: transparent;
-  border-right-color: rgba(255,255,255,0.95);
+  border-right-color: rgba(0,0,0,0.95);
 }
 
 <div
diff --git a/lib/components/src/tooltip/__snapshots__/TooltipLinkList.stories.storyshot b/lib/components/src/tooltip/__snapshots__/TooltipLinkList.stories.storyshot
index 145e257ce3f..4ce6af174ec 100644
--- a/lib/components/src/tooltip/__snapshots__/TooltipLinkList.stories.storyshot
+++ b/lib/components/src/tooltip/__snapshots__/TooltipLinkList.stories.storyshot
@@ -1,15 +1,31 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Storyshots basics/Tooltip/TooltipLinkList links 1`] = `
-.emotion-8 {
-  min-width: 180px;
+.emotion-3 {
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  text-align: left;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+}
+
+.emotion-3 > * + * {
+  padding-left: 10px;
+}
+
+.emotion-0 {
+  display: inline-block;
+  cursor: pointer;
 }
 
 .emotion-4 {
   font-size: 12px;
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
-  color: #999999;
+  color: rgba(51,51,51,0.5);
   -webkit-text-decoration: none;
   text-decoration: none;
   cursor: pointer;
@@ -29,10 +45,6 @@ exports[`Storyshots basics/Tooltip/TooltipLinkList links 1`] = `
   align-items: center;
 }
 
-.emotion-4 + .emotion-4 {
-  border-top: 1px solid #EEEEEE;
-}
-
 .emotion-4 > * + * {
   padding-left: 10px;
 }
@@ -45,28 +57,8 @@ exports[`Storyshots basics/Tooltip/TooltipLinkList links 1`] = `
   opacity: 1;
 }
 
-.emotion-3 {
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  text-align: left;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-}
-
-.emotion-3 > * + * {
-  padding-left: 10px;
-}
-
 .emotion-2 {
-  color: #444444;
-}
-
-.emotion-0 {
-  display: inline-block;
-  cursor: pointer;
+  color: #333333;
 }
 
 .emotion-9 {
@@ -76,9 +68,10 @@ exports[`Storyshots basics/Tooltip/TooltipLinkList links 1`] = `
   margin-top: 0px;
   margin-left: 0px;
   margin-right: 0px;
-  background: linear-gradient( -1deg, rgba(248,248,248,0.97) 0%, rgba(255,255,255,0.97) 100% );
+  background: rgba(0,0,0,0.95);
   -webkit-filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
   filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
+  border-radius: 8px;
   font-size: 12px;
 }
 
@@ -97,12 +90,18 @@ exports[`Storyshots basics/Tooltip/TooltipLinkList links 1`] = `
   border-top-width: 8px;
   border-right-width: 8px;
   border-left-width: 8px;
-  border-top-color: #FFFFFF;
+  border-top-color: rgba(0,0,0,0.95);
   border-bottom-color: transparent;
   border-left-color: transparent;
   border-right-color: transparent;
 }
 
+.emotion-8 {
+  min-width: 180px;
+  overflow: hidden;
+  border-radius: 8px;
+}
+
 <div
   style="height:300px"
 >
@@ -157,15 +156,31 @@ exports[`Storyshots basics/Tooltip/TooltipLinkList links 1`] = `
 `;
 
 exports[`Storyshots basics/Tooltip/TooltipLinkList links and callback 1`] = `
-.emotion-11 {
-  min-width: 180px;
+.emotion-3 {
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  text-align: left;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+}
+
+.emotion-3 > * + * {
+  padding-left: 10px;
+}
+
+.emotion-0 {
+  display: inline-block;
+  cursor: pointer;
 }
 
 .emotion-4 {
   font-size: 12px;
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
-  color: #999999;
+  color: rgba(51,51,51,0.5);
   -webkit-text-decoration: none;
   text-decoration: none;
   cursor: pointer;
@@ -185,10 +200,6 @@ exports[`Storyshots basics/Tooltip/TooltipLinkList links and callback 1`] = `
   align-items: center;
 }
 
-.emotion-4 + .emotion-4 {
-  border-top: 1px solid #EEEEEE;
-}
-
 .emotion-4 > * + * {
   padding-left: 10px;
 }
@@ -201,28 +212,8 @@ exports[`Storyshots basics/Tooltip/TooltipLinkList links and callback 1`] = `
   opacity: 1;
 }
 
-.emotion-3 {
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  text-align: left;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-}
-
-.emotion-3 > * + * {
-  padding-left: 10px;
-}
-
 .emotion-2 {
-  color: #444444;
-}
-
-.emotion-0 {
-  display: inline-block;
-  cursor: pointer;
+  color: #333333;
 }
 
 .emotion-12 {
@@ -232,9 +223,10 @@ exports[`Storyshots basics/Tooltip/TooltipLinkList links and callback 1`] = `
   margin-top: 0px;
   margin-left: 0px;
   margin-right: 0px;
-  background: linear-gradient( -1deg, rgba(248,248,248,0.97) 0%, rgba(255,255,255,0.97) 100% );
+  background: rgba(0,0,0,0.95);
   -webkit-filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
   filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
+  border-radius: 8px;
   font-size: 12px;
 }
 
@@ -253,12 +245,18 @@ exports[`Storyshots basics/Tooltip/TooltipLinkList links and callback 1`] = `
   border-top-width: 8px;
   border-right-width: 8px;
   border-left-width: 8px;
-  border-top-color: #FFFFFF;
+  border-top-color: rgba(0,0,0,0.95);
   border-bottom-color: transparent;
   border-left-color: transparent;
   border-right-color: transparent;
 }
 
+.emotion-11 {
+  min-width: 180px;
+  overflow: hidden;
+  border-radius: 8px;
+}
+
 <div
   style="height:300px"
 >
diff --git a/lib/components/src/tooltip/__snapshots__/TooltipMessage.stories.storyshot b/lib/components/src/tooltip/__snapshots__/TooltipMessage.stories.storyshot
index 5eefe02dcba..fa1f36db222 100644
--- a/lib/components/src/tooltip/__snapshots__/TooltipMessage.stories.storyshot
+++ b/lib/components/src/tooltip/__snapshots__/TooltipMessage.stories.storyshot
@@ -13,9 +13,10 @@ exports[`Storyshots basics/Tooltip/TooltipMessage default 1`] = `
   margin-top: 0px;
   margin-left: 0px;
   margin-right: 0px;
-  background: linear-gradient( -1deg, rgba(248,248,248,0.97) 0%, rgba(255,255,255,0.97) 100% );
+  background: rgba(0,0,0,0.95);
   -webkit-filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
   filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
+  border-radius: 8px;
   font-size: 12px;
 }
 
@@ -34,7 +35,7 @@ exports[`Storyshots basics/Tooltip/TooltipMessage default 1`] = `
   border-top-width: 8px;
   border-right-width: 8px;
   border-left-width: 8px;
-  border-top-color: #FFFFFF;
+  border-top-color: rgba(0,0,0,0.95);
   border-bottom-color: transparent;
   border-left-color: transparent;
   border-right-color: transparent;
@@ -107,9 +108,10 @@ exports[`Storyshots basics/Tooltip/TooltipMessage minimal message 1`] = `
   margin-top: 0px;
   margin-left: 0px;
   margin-right: 0px;
-  background: linear-gradient( -1deg, rgba(248,248,248,0.97) 0%, rgba(255,255,255,0.97) 100% );
+  background: rgba(0,0,0,0.95);
   -webkit-filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
   filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
+  border-radius: 8px;
   font-size: 12px;
 }
 
@@ -128,7 +130,7 @@ exports[`Storyshots basics/Tooltip/TooltipMessage minimal message 1`] = `
   border-top-width: 8px;
   border-right-width: 8px;
   border-left-width: 8px;
-  border-top-color: #FFFFFF;
+  border-top-color: rgba(0,0,0,0.95);
   border-bottom-color: transparent;
   border-left-color: transparent;
   border-right-color: transparent;
@@ -192,9 +194,10 @@ exports[`Storyshots basics/Tooltip/TooltipMessage with link 1`] = `
   margin-top: 0px;
   margin-left: 0px;
   margin-right: 0px;
-  background: linear-gradient( -1deg, rgba(248,248,248,0.97) 0%, rgba(255,255,255,0.97) 100% );
+  background: rgba(0,0,0,0.95);
   -webkit-filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
   filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
+  border-radius: 8px;
   font-size: 12px;
 }
 
@@ -213,7 +216,7 @@ exports[`Storyshots basics/Tooltip/TooltipMessage with link 1`] = `
   border-top-width: 8px;
   border-right-width: 8px;
   border-left-width: 8px;
-  border-top-color: #FFFFFF;
+  border-top-color: rgba(0,0,0,0.95);
   border-bottom-color: transparent;
   border-left-color: transparent;
   border-right-color: transparent;
@@ -306,9 +309,10 @@ exports[`Storyshots basics/Tooltip/TooltipMessage with links 1`] = `
   margin-top: 0px;
   margin-left: 0px;
   margin-right: 0px;
-  background: linear-gradient( -1deg, rgba(248,248,248,0.97) 0%, rgba(255,255,255,0.97) 100% );
+  background: rgba(0,0,0,0.95);
   -webkit-filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
   filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
+  border-radius: 8px;
   font-size: 12px;
 }
 
@@ -327,7 +331,7 @@ exports[`Storyshots basics/Tooltip/TooltipMessage with links 1`] = `
   border-top-width: 8px;
   border-right-width: 8px;
   border-left-width: 8px;
-  border-top-color: #FFFFFF;
+  border-top-color: rgba(0,0,0,0.95);
   border-bottom-color: transparent;
   border-left-color: transparent;
   border-right-color: transparent;
diff --git a/lib/components/src/tooltip/__snapshots__/WithTooltip.stories.storyshot b/lib/components/src/tooltip/__snapshots__/WithTooltip.stories.storyshot
index 74d7b2c8a91..61057cb5c74 100644
--- a/lib/components/src/tooltip/__snapshots__/WithTooltip.stories.storyshot
+++ b/lib/components/src/tooltip/__snapshots__/WithTooltip.stories.storyshot
@@ -166,7 +166,7 @@ exports[`Storyshots basics/Tooltip/WithTooltip simple click start open 1`] = `
   margin-top: 0px;
   margin-left: 0px;
   margin-right: 0px;
-  background: rgba(255,255,255,0.95);
+  background: rgba(0,0,0,0.95);
   -webkit-filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
   filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
   border-radius: 8px;
@@ -188,35 +188,12 @@ exports[`Storyshots basics/Tooltip/WithTooltip simple click start open 1`] = `
   border-top-width: 8px;
   border-right-width: 8px;
   border-left-width: 8px;
-  border-top-color: rgba(255,255,255,0.95);
+  border-top-color: rgba(0,0,0,0.95);
   border-bottom-color: transparent;
   border-left-color: transparent;
   border-right-color: transparent;
 }
 
-.emotion-12 {
-  height: 300px;
-}
-
-.emotion-11 {
-  width: 500px;
-  height: 500px;
-  overflow-y: scroll;
-  background: #eee;
-  position: relative;
-}
-
-.emotion-0 {
-  height: 100px;
-}
-
-.emotion-1 {
-  width: 200px;
-  height: 100px;
-  background-color: red;
-  color: white;
-}
-
 .emotion-9 {
   padding: 15px;
   width: 280px;
diff --git a/lib/ui/src/components/layout/__snapshots__/layout.stories.storyshot b/lib/ui/src/components/layout/__snapshots__/layout.stories.storyshot
index 8521c926594..84434154b8e 100644
--- a/lib/ui/src/components/layout/__snapshots__/layout.stories.storyshot
+++ b/lib/ui/src/components/layout/__snapshots__/layout.stories.storyshot
@@ -313,7 +313,7 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 0 1`] = `
   border-bottom: 3px solid transparent;
   font-weight: bold;
   font-size: 13px;
-  color: inherit;
+  opacity: 0.4;
   border-bottom-color: transparent;
 }
 
@@ -602,7 +602,7 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 1 1`] = `
   border-bottom: 3px solid transparent;
   font-weight: bold;
   font-size: 13px;
-  color: inherit;
+  opacity: 0.4;
   border-bottom-color: transparent;
 }
 
@@ -891,7 +891,7 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 2 1`] = `
   border-bottom: 3px solid transparent;
   font-weight: bold;
   font-size: 13px;
-  color: inherit;
+  opacity: 0.4;
   border-bottom-color: transparent;
 }
 
@@ -1180,7 +1180,7 @@ exports[`Storyshots UI|Layout/Mobile (mocked) page 1`] = `
   border-bottom: 3px solid transparent;
   font-weight: bold;
   font-size: 13px;
-  color: inherit;
+  opacity: 0.4;
   border-bottom-color: transparent;
 }
 
diff --git a/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot b/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot
index 4118a023114..1a9f236b6cc 100644
--- a/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot
+++ b/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot
@@ -231,7 +231,6 @@ Array [
   height: 100%;
   -webkit-transition: background .1s linear;
   transition: background .1s linear;
-  background: #FFFFFF;
 }
 
 .emotion-0 {
@@ -343,7 +342,7 @@ Array [
   border-bottom: 3px solid transparent;
   font-weight: bold;
   font-size: 13px;
-  color: inherit;
+  opacity: 0.4;
   border-bottom-color: transparent;
 }
 
@@ -650,7 +649,6 @@ Array [
   height: 100%;
   -webkit-transition: background .1s linear;
   transition: background .1s linear;
-  background: #FFFFFF;
 }
 
 .emotion-0 {
diff --git a/lib/ui/src/settings/__snapshots__/about.stories.storyshot b/lib/ui/src/settings/__snapshots__/about.stories.storyshot
index ed8deb18243..7937df77314 100644
--- a/lib/ui/src/settings/__snapshots__/about.stories.storyshot
+++ b/lib/ui/src/settings/__snapshots__/about.stories.storyshot
@@ -1525,7 +1525,6 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  background: #FFFFFF;
 }
 
 .emotion-20 {
@@ -1540,8 +1539,7 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
-  color: #333333;
-  background: #FFFFFF;
+  color: #666666;
   font-size: 12px;
   line-height: 16px;
   font-weight: 700;

From ba8142f13c2dd68636ddf06826a41ae0bd50603c Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Tue, 19 Feb 2019 11:27:59 +0800
Subject: [PATCH 038/249] Merge pull request #5650 from storybooks/v5-style-qa

Styling bug fixes, story updates, and more QA
---
 addons/knobs/src/components/types/Date.js     |    4 +-
 .../__snapshots__/storyshots.test.js.snap     | 1255 ++++--
 lib/components/src/Button/Button.js           |   49 +-
 lib/components/src/Button/Button.stories.js   |   13 +-
 .../__snapshots__/Button.stories.storyshot    |  668 ++-
 lib/components/src/bar/bar.js                 |   98 +-
 lib/components/src/bar/separator.js           |    4 +-
 .../form/__snapshots__/form.stories.storyshot |   20 +-
 lib/components/src/spaced/Spaced.js           |    4 +-
 lib/components/src/spaced/Spaced.stories.js   |    2 +-
 .../__snapshots__/Spaced.stories.storyshot    |   10 +-
 .../tabs/__snapshots__/tabs.stories.storyshot | 3781 +++++++++--------
 lib/components/src/tabs/tabs.js               |   33 +-
 lib/components/src/tooltip/TooltipMessage.js  |    4 +-
 .../TooltipMessage.stories.storyshot          |  344 +-
 .../WithTooltip.stories.storyshot             |   78 +-
 .../src/typography/DocumentFormatting.js      |   60 +-
 .../typography/DocumentFormatting.stories.js  |  110 +-
 .../typography/DocumentFormattingSample.md    |  125 +
 .../__snapshots__/panel.stories.storyshot     |  188 +-
 .../__snapshots__/preview.stories.storyshot   |  610 +--
 .../sidebar/NotificationList.stories.js       |    2 -
 .../src/components/sidebar/SidebarHeading.js  |    1 +
 .../__snapshots__/about.stories.storyshot     | 2669 ++++++------
 lib/ui/src/settings/about.js                  |    1 -
 yarn.lock                                     |  108 +-
 26 files changed, 5875 insertions(+), 4366 deletions(-)
 create mode 100644 lib/components/src/typography/DocumentFormattingSample.md

diff --git a/addons/knobs/src/components/types/Date.js b/addons/knobs/src/components/types/Date.js
index fc36810ab36..f645fcca9e6 100644
--- a/addons/knobs/src/components/types/Date.js
+++ b/addons/knobs/src/components/types/Date.js
@@ -6,10 +6,10 @@ import { Form } from '@storybook/components';
 const FlexSpaced = styled.div({
   flex: 1,
   display: 'flex',
-  '& > *': {
+  '&& > *': {
     marginLeft: 10,
   },
-  '& > *:first-child': {
+  '&& > *:first-of-type': {
     marginLeft: 0,
   },
 });
diff --git a/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap b/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
index 0d2a4a92597..b5b360c575c 100644
--- a/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
+++ b/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
@@ -276,7 +276,7 @@ exports[`Storyshots Basics|Brand/StorybookLogo normal 1`] = `
 </svg>
 `;
 
-exports[`Storyshots Basics|DocumentFormatting sampleDocument 1`] = `
+exports[`Storyshots Basics|DocumentFormatting withDOM 1`] = `
 .emotion-0 {
   font-size: 14px;
   line-height: 1.6;
@@ -348,7 +348,7 @@ exports[`Storyshots Basics|DocumentFormatting sampleDocument 1`] = `
   border: none;
 }
 
-.emotion-0 body > *:first-child {
+.emotion-0 body > *:first-of-type {
   margin-top: 0 !important;
 }
 
@@ -389,13 +389,13 @@ exports[`Storyshots Basics|DocumentFormatting sampleDocument 1`] = `
   position: relative;
 }
 
-.emotion-0 h2:first-child,
-.emotion-0 h1:first-child,
-.emotion-0 h1:first-child + h2,
-.emotion-0 h3:first-child,
-.emotion-0 h4:first-child,
-.emotion-0 h5:first-child,
-.emotion-0 h6:first-child {
+.emotion-0 h2:first-of-type,
+.emotion-0 h1:first-of-type,
+.emotion-0 h1:first-of-type + h2,
+.emotion-0 h3:first-of-type,
+.emotion-0 h4:first-of-type,
+.emotion-0 h5:first-of-type,
+.emotion-0 h6:first-of-type {
   margin-top: 0;
   padding-top: 0;
 }
@@ -458,35 +458,35 @@ exports[`Storyshots Basics|DocumentFormatting sampleDocument 1`] = `
   padding: 0;
 }
 
-.emotion-0 body > h2:first-child {
+.emotion-0 body > h2:first-of-type {
   margin-top: 0;
   padding-top: 0;
 }
 
-.emotion-0 body > h1:first-child {
+.emotion-0 body > h1:first-of-type {
   margin-top: 0;
   padding-top: 0;
 }
 
-.emotion-0 body > h1:first-child + h2 {
+.emotion-0 body > h1:first-of-type + h2 {
   margin-top: 0;
   padding-top: 0;
 }
 
-.emotion-0 body > h3:first-child,
-.emotion-0 body > h4:first-child,
-.emotion-0 body > h5:first-child,
-.emotion-0 body > h6:first-child {
+.emotion-0 body > h3:first-of-type,
+.emotion-0 body > h4:first-of-type,
+.emotion-0 body > h5:first-of-type,
+.emotion-0 body > h6:first-of-type {
   margin-top: 0;
   padding-top: 0;
 }
 
-.emotion-0 a:first-child h1,
-.emotion-0 a:first-child h2,
-.emotion-0 a:first-child h3,
-.emotion-0 a:first-child h4,
-.emotion-0 a:first-child h5,
-.emotion-0 a:first-child h6 {
+.emotion-0 a:first-of-type h1,
+.emotion-0 a:first-of-type h2,
+.emotion-0 a:first-of-type h3,
+.emotion-0 a:first-of-type h4,
+.emotion-0 a:first-of-type h5,
+.emotion-0 a:first-of-type h6 {
   margin-top: 0;
   padding-top: 0;
 }
@@ -509,8 +509,8 @@ exports[`Storyshots Basics|DocumentFormatting sampleDocument 1`] = `
   padding-left: 30px;
 }
 
-.emotion-0 ul :first-child,
-.emotion-0 ol :first-child {
+.emotion-0 ul :first-of-type,
+.emotion-0 ol :first-of-type {
   margin-top: 0;
 }
 
@@ -531,11 +531,11 @@ exports[`Storyshots Basics|DocumentFormatting sampleDocument 1`] = `
   margin: 15px 0 5px;
 }
 
-.emotion-0 dl dt:first-child {
+.emotion-0 dl dt:first-of-type {
   padding: 0;
 }
 
-.emotion-0 dl dt > :first-child {
+.emotion-0 dl dt > :first-of-type {
   margin-top: 0;
 }
 
@@ -548,7 +548,7 @@ exports[`Storyshots Basics|DocumentFormatting sampleDocument 1`] = `
   padding: 0 15px;
 }
 
-.emotion-0 dl dd > :first-child {
+.emotion-0 dl dd > :first-of-type {
   margin-top: 0;
 }
 
@@ -562,7 +562,7 @@ exports[`Storyshots Basics|DocumentFormatting sampleDocument 1`] = `
   color: #666666;
 }
 
-.emotion-0 blockquote > :first-child {
+.emotion-0 blockquote > :first-of-type {
   margin-top: 0;
 }
 
@@ -582,7 +582,7 @@ exports[`Storyshots Basics|DocumentFormatting sampleDocument 1`] = `
   padding: 0;
 }
 
-.emotion-0 table tr:nth-child(2n) {
+.emotion-0 table tr:nth-of-type(2n) {
   background-color: #F8F8F8;
 }
 
@@ -601,8 +601,8 @@ exports[`Storyshots Basics|DocumentFormatting sampleDocument 1`] = `
   padding: 6px 13px;
 }
 
-.emotion-0 table tr th :first-child,
-.emotion-0 table tr td :first-child {
+.emotion-0 table tr th :first-of-type,
+.emotion-0 table tr td :first-of-type {
   margin-top: 0;
 }
 
@@ -784,7 +784,7 @@ exports[`Storyshots Basics|DocumentFormatting sampleDocument 1`] = `
   border: none;
 }
 
-.emotion-0 body > *:first-child {
+.emotion-0 body > *:first-of-type {
   margin-top: 0 !important;
 }
 
@@ -825,13 +825,13 @@ exports[`Storyshots Basics|DocumentFormatting sampleDocument 1`] = `
   position: relative;
 }
 
-.emotion-0 h2:first-child,
-.emotion-0 h1:first-child,
-.emotion-0 h1:first-child + h2,
-.emotion-0 h3:first-child,
-.emotion-0 h4:first-child,
-.emotion-0 h5:first-child,
-.emotion-0 h6:first-child {
+.emotion-0 h2:first-of-type,
+.emotion-0 h1:first-of-type,
+.emotion-0 h1:first-of-type + h2,
+.emotion-0 h3:first-of-type,
+.emotion-0 h4:first-of-type,
+.emotion-0 h5:first-of-type,
+.emotion-0 h6:first-of-type {
   margin-top: 0;
   padding-top: 0;
 }
@@ -894,35 +894,35 @@ exports[`Storyshots Basics|DocumentFormatting sampleDocument 1`] = `
   padding: 0;
 }
 
-.emotion-0 body > h2:first-child {
+.emotion-0 body > h2:first-of-type {
   margin-top: 0;
   padding-top: 0;
 }
 
-.emotion-0 body > h1:first-child {
+.emotion-0 body > h1:first-of-type {
   margin-top: 0;
   padding-top: 0;
 }
 
-.emotion-0 body > h1:first-child + h2 {
+.emotion-0 body > h1:first-of-type + h2 {
   margin-top: 0;
   padding-top: 0;
 }
 
-.emotion-0 body > h3:first-child,
-.emotion-0 body > h4:first-child,
-.emotion-0 body > h5:first-child,
-.emotion-0 body > h6:first-child {
+.emotion-0 body > h3:first-of-type,
+.emotion-0 body > h4:first-of-type,
+.emotion-0 body > h5:first-of-type,
+.emotion-0 body > h6:first-of-type {
   margin-top: 0;
   padding-top: 0;
 }
 
-.emotion-0 a:first-child h1,
-.emotion-0 a:first-child h2,
-.emotion-0 a:first-child h3,
-.emotion-0 a:first-child h4,
-.emotion-0 a:first-child h5,
-.emotion-0 a:first-child h6 {
+.emotion-0 a:first-of-type h1,
+.emotion-0 a:first-of-type h2,
+.emotion-0 a:first-of-type h3,
+.emotion-0 a:first-of-type h4,
+.emotion-0 a:first-of-type h5,
+.emotion-0 a:first-of-type h6 {
   margin-top: 0;
   padding-top: 0;
 }
@@ -945,8 +945,8 @@ exports[`Storyshots Basics|DocumentFormatting sampleDocument 1`] = `
   padding-left: 30px;
 }
 
-.emotion-0 ul :first-child,
-.emotion-0 ol :first-child {
+.emotion-0 ul :first-of-type,
+.emotion-0 ol :first-of-type {
   margin-top: 0;
 }
 
@@ -967,11 +967,11 @@ exports[`Storyshots Basics|DocumentFormatting sampleDocument 1`] = `
   margin: 15px 0 5px;
 }
 
-.emotion-0 dl dt:first-child {
+.emotion-0 dl dt:first-of-type {
   padding: 0;
 }
 
-.emotion-0 dl dt > :first-child {
+.emotion-0 dl dt > :first-of-type {
   margin-top: 0;
 }
 
@@ -984,7 +984,7 @@ exports[`Storyshots Basics|DocumentFormatting sampleDocument 1`] = `
   padding: 0 15px;
 }
 
-.emotion-0 dl dd > :first-child {
+.emotion-0 dl dd > :first-of-type {
   margin-top: 0;
 }
 
@@ -998,7 +998,7 @@ exports[`Storyshots Basics|DocumentFormatting sampleDocument 1`] = `
   color: #666666;
 }
 
-.emotion-0 blockquote > :first-child {
+.emotion-0 blockquote > :first-of-type {
   margin-top: 0;
 }
 
@@ -1018,7 +1018,7 @@ exports[`Storyshots Basics|DocumentFormatting sampleDocument 1`] = `
   padding: 0;
 }
 
-.emotion-0 table tr:nth-child(2n) {
+.emotion-0 table tr:nth-of-type(2n) {
   background-color: #F8F8F8;
 }
 
@@ -1037,8 +1037,8 @@ exports[`Storyshots Basics|DocumentFormatting sampleDocument 1`] = `
   padding: 6px 13px;
 }
 
-.emotion-0 table tr th :first-child,
-.emotion-0 table tr td :first-child {
+.emotion-0 table tr th :first-of-type,
+.emotion-0 table tr td :first-of-type {
   margin-top: 0;
 }
 
@@ -1155,15 +1155,8 @@ exports[`Storyshots Basics|DocumentFormatting sampleDocument 1`] = `
   <div
     class="emotion-0"
   >
-    <p>
-      Wrap your components in 
-      <code>
-        DocumentFormatting
-      </code>
-       to get text styles for body content
-    </p>
     <h1>
-      h1 Heading 😎
+      h1 Heading
     </h1>
     <h2>
       h2 Heading
@@ -1477,208 +1470,892 @@ exports[`Storyshots Basics|DocumentFormatting sampleDocument 1`] = `
         title="The Stormtroopocat"
       />
     </p>
-    <p>
-      Like links, Images also have a footnote style syntax
-    </p>
-    <p>
-      <img
-        alt="Alt text"
-        src="https://octodex.github.com/images/dojocat.jpg"
-        title="The Dojocat"
-      />
-    </p>
-    <p>
-      With a reference later in the document defining the URL location:
-    </p>
-    <h2>
-      Plugins
-    </h2>
-    <p>
-      The killer feature of 
-      <code>
-        markdown-it
-      </code>
-       is very effective support of
-      <a
-        href="https://www.npmjs.org/browse/keyword/markdown-it-plugin"
-      >
-        syntax plugins
-      </a>
-      .
-    </p>
-    <h3>
-      <a
-        href="https://github.com/markdown-it/markdown-it-emoji"
-      >
-        Emojies
-      </a>
-    </h3>
-    <blockquote>
-      <p>
-        Classic markup: 😉 :crush: 😢 :tear: 😆 😋
-      </p>
-      <p>
-        Shortcuts (emoticons): 😃 😦 😎 😉
-      </p>
-    </blockquote>
-    <p>
-      see 
-      <a
-        href="https://github.com/markdown-it/markdown-it-emoji#change-output"
-      >
-        how to change output
-      </a>
-       with twemoji.
-    </p>
-    <h3>
-      <a
-        href="https://github.com/markdown-it/markdown-it-sub"
-      >
-        Subscript
-      </a>
-       / 
-      <a
-        href="https://github.com/markdown-it/markdown-it-sup"
-      >
-        Superscript
-      </a>
-    </h3>
-    <ul>
-      <li>
-        19
-        <sup>
-          th
-        </sup>
-      </li>
-      <li>
-        H
-        <sub>
-          2
-        </sub>
-        O
-      </li>
-    </ul>
-    <h3>
-      <a
-        href="https://github.com/markdown-it/markdown-it-deflist"
-      >
-        Definition lists
-      </a>
-    </h3>
-    <dl>
-      <dt>
-        Term 1
-      </dt>
-      <dd>
-        <p>
-          Definition 1 with lazy continuation.
-        </p>
-      </dd>
-      <dt>
-        Term 2 with 
-        <em>
-          inline markup
-        </em>
-      </dt>
-      <dd>
-        <p>
-          Definition 2
-        </p>
-        <pre>
-          <code>
-             some code, part of Definition 2
-          </code>
-        </pre>
-        <p>
-          Third paragraph of definition 2.
-        </p>
-      </dd>
-    </dl>
-    <p>
-      <em>
-        Compact style:
-      </em>
-    </p>
-    <dl>
-      <dt>
-        Term 1
-      </dt>
-      <dd>
-        Definition 1
-      </dd>
-      <dt>
-        Term 2
-      </dt>
-      <dd>
-        Definition 2a
-      </dd>
-      <dd>
-        Definition 2b
-      </dd>
-    </dl>
-    <p>
-      <em>
-        Compact style:
-      </em>
-    </p>
-    <dl>
-      <dt>
-        Term 1
-      </dt>
-      <dd>
-        Definition 1
-      </dd>
-      <dt>
-        Term 2
-      </dt>
-      <dd>
-        Definition 2a
-      </dd>
-      <dd>
-        Definition 2b
-      </dd>
-    </dl>
-    <h3>
-      <a
-        href="https://github.com/markdown-it/markdown-it-abbr"
-      >
-        Abbreviations
-      </a>
-    </h3>
-    <p>
-      This is 
-      <abbr
-        title="Hyper Text Markup Language"
-      >
-        HTML
-      </abbr>
-       abbreviation example.
-    </p>
-    <p>
-      It converts “
-      <abbr
-        title="Hyper Text Markup Language"
-      >
-        HTML
-      </abbr>
-      ”, but keep intact partial entries like “xxxHTMLyyy” and so on.
-    </p>
-    <h3>
-      <a
-        href="https://github.com/markdown-it/markdown-it-container"
-      >
-        Custom containers
-      </a>
-    </h3>
-    <div
-      class="warning"
-    >
-      <p>
-        <em>
-          here be dragons
-        </em>
-      </p>
-    </div>
+  </div>
+</div>
+`;
+
+exports[`Storyshots Basics|DocumentFormatting withMarkdown 1`] = `
+.emotion-0 {
+  font-size: 14px;
+  line-height: 1.6;
+}
+
+.emotion-0 h1 {
+  font-size: 32px;
+  font-weight: 900;
+}
+
+.emotion-0 h2 {
+  font-size: 24px;
+  border-bottom: 1px solid rgba(0,0,0,.1);
+}
+
+.emotion-0 h3 {
+  font-size: 20px;
+}
+
+.emotion-0 h4 {
+  font-size: 16px;
+}
+
+.emotion-0 h5 {
+  font-size: 14px;
+}
+
+.emotion-0 h6 {
+  font-size: 14px;
+  color: #666666;
+}
+
+.emotion-0 pre:not(.hljs) {
+  background: transparent;
+  border: none;
+  border-radius: 0;
+  padding: 0;
+  margin: 0;
+}
+
+.emotion-0 pre pre,
+.emotion-0 pre.hljs {
+  padding: 15px;
+  margin: 0;
+  overflow: auto;
+  white-space: pre-wrap;
+  color: #333333;
+  font-size: 13px;
+  line-height: 19px;
+}
+
+.emotion-0 pre pre code,
+.emotion-0 pre.hljs code {
+  color: inherit;
+  font-size: inherit;
+}
+
+.emotion-0 pre code {
+  margin: 0;
+  padding: 0;
+  white-space: pre;
+  border: none;
+  background: transparent;
+}
+
+.emotion-0 pre code,
+.emotion-0 pre tt {
+  background-color: transparent;
+  border: none;
+}
+
+.emotion-0 body > *:first-of-type {
+  margin-top: 0 !important;
+}
+
+.emotion-0 body > *:last-child {
+  margin-bottom: 0 !important;
+}
+
+.emotion-0 a {
+  color: #1EA7FD;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
+.emotion-0 a.absent {
+  color: #cc0000;
+}
+
+.emotion-0 a.anchor {
+  display: block;
+  padding-left: 30px;
+  margin-left: -30px;
+  cursor: pointer;
+  position: absolute;
+  top: 0;
+  left: 0;
+  bottom: 0;
+}
+
+.emotion-0 h1,
+.emotion-0 h2,
+.emotion-0 h3,
+.emotion-0 h4,
+.emotion-0 h5,
+.emotion-0 h6 {
+  margin: 20px 0 10px;
+  padding: 0;
+  cursor: text;
+  position: relative;
+}
+
+.emotion-0 h2:first-of-type,
+.emotion-0 h1:first-of-type,
+.emotion-0 h1:first-of-type + h2,
+.emotion-0 h3:first-of-type,
+.emotion-0 h4:first-of-type,
+.emotion-0 h5:first-of-type,
+.emotion-0 h6:first-of-type {
+  margin-top: 0;
+  padding-top: 0;
+}
+
+.emotion-0 h1:hover a.anchor,
+.emotion-0 h2:hover a.anchor,
+.emotion-0 h3:hover a.anchor,
+.emotion-0 h4:hover a.anchor,
+.emotion-0 h5:hover a.anchor,
+.emotion-0 h6:hover a.anchor {
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
+.emotion-0 h1 tt,
+.emotion-0 h1 code {
+  font-size: inherit;
+}
+
+.emotion-0 h2 tt,
+.emotion-0 h2 code {
+  font-size: inherit;
+}
+
+.emotion-0 h3 tt,
+.emotion-0 h3 code {
+  font-size: inherit;
+}
+
+.emotion-0 h4 tt,
+.emotion-0 h4 code {
+  font-size: inherit;
+}
+
+.emotion-0 h5 tt,
+.emotion-0 h5 code {
+  font-size: inherit;
+}
+
+.emotion-0 h6 tt,
+.emotion-0 h6 code {
+  font-size: inherit;
+}
+
+.emotion-0 p,
+.emotion-0 blockquote,
+.emotion-0 ul,
+.emotion-0 ol,
+.emotion-0 dl,
+.emotion-0 li,
+.emotion-0 table,
+.emotion-0 pre {
+  margin: 15px 0;
+}
+
+.emotion-0 hr {
+  border: 0 none;
+  color: rgba(0,0,0,.1);
+  height: 4px;
+  padding: 0;
+}
+
+.emotion-0 body > h2:first-of-type {
+  margin-top: 0;
+  padding-top: 0;
+}
+
+.emotion-0 body > h1:first-of-type {
+  margin-top: 0;
+  padding-top: 0;
+}
+
+.emotion-0 body > h1:first-of-type + h2 {
+  margin-top: 0;
+  padding-top: 0;
+}
+
+.emotion-0 body > h3:first-of-type,
+.emotion-0 body > h4:first-of-type,
+.emotion-0 body > h5:first-of-type,
+.emotion-0 body > h6:first-of-type {
+  margin-top: 0;
+  padding-top: 0;
+}
+
+.emotion-0 a:first-of-type h1,
+.emotion-0 a:first-of-type h2,
+.emotion-0 a:first-of-type h3,
+.emotion-0 a:first-of-type h4,
+.emotion-0 a:first-of-type h5,
+.emotion-0 a:first-of-type h6 {
+  margin-top: 0;
+  padding-top: 0;
+}
+
+.emotion-0 h1 p,
+.emotion-0 h2 p,
+.emotion-0 h3 p,
+.emotion-0 h4 p,
+.emotion-0 h5 p,
+.emotion-0 h6 p {
+  margin-top: 0;
+}
+
+.emotion-0 li p.first {
+  display: inline-block;
+}
+
+.emotion-0 ul,
+.emotion-0 ol {
+  padding-left: 30px;
+}
+
+.emotion-0 ul :first-of-type,
+.emotion-0 ol :first-of-type {
+  margin-top: 0;
+}
+
+.emotion-0 ul :last-child,
+.emotion-0 ol :last-child {
+  margin-bottom: 0;
+}
+
+.emotion-0 dl {
+  padding: 0;
+}
+
+.emotion-0 dl dt {
+  font-size: 14px;
+  font-weight: bold;
+  font-style: italic;
+  padding: 0;
+  margin: 15px 0 5px;
+}
+
+.emotion-0 dl dt:first-of-type {
+  padding: 0;
+}
+
+.emotion-0 dl dt > :first-of-type {
+  margin-top: 0;
+}
+
+.emotion-0 dl dt > :last-child {
+  margin-bottom: 0;
+}
+
+.emotion-0 dl dd {
+  margin: 0 0 15px;
+  padding: 0 15px;
+}
+
+.emotion-0 dl dd > :first-of-type {
+  margin-top: 0;
+}
+
+.emotion-0 dl dd > :last-child {
+  margin-bottom: 0;
+}
+
+.emotion-0 blockquote {
+  border-left: 4px solid #DDDDDD;
+  padding: 0 15px;
+  color: #666666;
+}
+
+.emotion-0 blockquote > :first-of-type {
+  margin-top: 0;
+}
+
+.emotion-0 blockquote > :last-child {
+  margin-bottom: 0;
+}
+
+.emotion-0 table {
+  padding: 0;
+  border-collapse: collapse;
+}
+
+.emotion-0 table tr {
+  border-top: 1px solid rgba(0,0,0,.1);
+  background-color: white;
+  margin: 0;
+  padding: 0;
+}
+
+.emotion-0 table tr:nth-of-type(2n) {
+  background-color: #F8F8F8;
+}
+
+.emotion-0 table tr th {
+  font-weight: bold;
+  border: 1px solid rgba(0,0,0,.1);
+  text-align: left;
+  margin: 0;
+  padding: 6px 13px;
+}
+
+.emotion-0 table tr td {
+  border: 1px solid rgba(0,0,0,.1);
+  text-align: left;
+  margin: 0;
+  padding: 6px 13px;
+}
+
+.emotion-0 table tr th :first-of-type,
+.emotion-0 table tr td :first-of-type {
+  margin-top: 0;
+}
+
+.emotion-0 table tr th :last-child,
+.emotion-0 table tr td :last-child {
+  margin-bottom: 0;
+}
+
+.emotion-0 img {
+  max-width: 100%;
+}
+
+.emotion-0 span.frame {
+  display: block;
+  overflow: hidden;
+}
+
+.emotion-0 span.frame > span {
+  border: 1px solid #DDDDDD;
+  display: block;
+  float: left;
+  overflow: hidden;
+  margin: 13px 0 0;
+  padding: 7px;
+  width: auto;
+}
+
+.emotion-0 span.frame span img {
+  display: block;
+  float: left;
+}
+
+.emotion-0 span.frame span span {
+  clear: both;
+  color: #333333;
+  display: block;
+  padding: 5px 0 0;
+}
+
+.emotion-0 span.align-center {
+  display: block;
+  overflow: hidden;
+  clear: both;
+}
+
+.emotion-0 span.align-center > span {
+  display: block;
+  overflow: hidden;
+  margin: 13px auto 0;
+  text-align: center;
+}
+
+.emotion-0 span.align-center span img {
+  margin: 0 auto;
+  text-align: center;
+}
+
+.emotion-0 span.align-right {
+  display: block;
+  overflow: hidden;
+  clear: both;
+}
+
+.emotion-0 span.align-right > span {
+  display: block;
+  overflow: hidden;
+  margin: 13px 0 0;
+  text-align: right;
+}
+
+.emotion-0 span.align-right span img {
+  margin: 0;
+  text-align: right;
+}
+
+.emotion-0 span.float-left {
+  display: block;
+  margin-right: 13px;
+  overflow: hidden;
+  float: left;
+}
+
+.emotion-0 span.float-left span {
+  margin: 13px 0 0;
+}
+
+.emotion-0 span.float-right {
+  display: block;
+  margin-left: 13px;
+  overflow: hidden;
+  float: right;
+}
+
+.emotion-0 span.float-right > span {
+  display: block;
+  overflow: hidden;
+  margin: 13px auto 0;
+  text-align: right;
+}
+
+.emotion-0 code,
+.emotion-0 tt {
+  margin: 0 2px;
+  padding: 0 5px;
+  white-space: nowrap;
+  border: 1px solid #EEEEEE;
+  background-color: #F8F8F8;
+  border-radius: 3px;
+}
+
+.emotion-0 {
+  font-size: 14px;
+  line-height: 1.6;
+}
+
+.emotion-0 h1 {
+  font-size: 32px;
+  font-weight: 900;
+}
+
+.emotion-0 h2 {
+  font-size: 24px;
+  border-bottom: 1px solid rgba(0,0,0,.1);
+}
+
+.emotion-0 h3 {
+  font-size: 20px;
+}
+
+.emotion-0 h4 {
+  font-size: 16px;
+}
+
+.emotion-0 h5 {
+  font-size: 14px;
+}
+
+.emotion-0 h6 {
+  font-size: 14px;
+  color: #666666;
+}
+
+.emotion-0 pre:not(.hljs) {
+  background: transparent;
+  border: none;
+  border-radius: 0;
+  padding: 0;
+  margin: 0;
+}
+
+.emotion-0 pre pre,
+.emotion-0 pre.hljs {
+  padding: 15px;
+  margin: 0;
+  overflow: auto;
+  white-space: pre-wrap;
+  color: #333333;
+  font-size: 13px;
+  line-height: 19px;
+}
+
+.emotion-0 pre pre code,
+.emotion-0 pre.hljs code {
+  color: inherit;
+  font-size: inherit;
+}
+
+.emotion-0 pre code {
+  margin: 0;
+  padding: 0;
+  white-space: pre;
+  border: none;
+  background: transparent;
+}
+
+.emotion-0 pre code,
+.emotion-0 pre tt {
+  background-color: transparent;
+  border: none;
+}
+
+.emotion-0 body > *:first-of-type {
+  margin-top: 0 !important;
+}
+
+.emotion-0 body > *:last-child {
+  margin-bottom: 0 !important;
+}
+
+.emotion-0 a {
+  color: #1EA7FD;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
+.emotion-0 a.absent {
+  color: #cc0000;
+}
+
+.emotion-0 a.anchor {
+  display: block;
+  padding-left: 30px;
+  margin-left: -30px;
+  cursor: pointer;
+  position: absolute;
+  top: 0;
+  left: 0;
+  bottom: 0;
+}
+
+.emotion-0 h1,
+.emotion-0 h2,
+.emotion-0 h3,
+.emotion-0 h4,
+.emotion-0 h5,
+.emotion-0 h6 {
+  margin: 20px 0 10px;
+  padding: 0;
+  cursor: text;
+  position: relative;
+}
+
+.emotion-0 h2:first-of-type,
+.emotion-0 h1:first-of-type,
+.emotion-0 h1:first-of-type + h2,
+.emotion-0 h3:first-of-type,
+.emotion-0 h4:first-of-type,
+.emotion-0 h5:first-of-type,
+.emotion-0 h6:first-of-type {
+  margin-top: 0;
+  padding-top: 0;
+}
+
+.emotion-0 h1:hover a.anchor,
+.emotion-0 h2:hover a.anchor,
+.emotion-0 h3:hover a.anchor,
+.emotion-0 h4:hover a.anchor,
+.emotion-0 h5:hover a.anchor,
+.emotion-0 h6:hover a.anchor {
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
+.emotion-0 h1 tt,
+.emotion-0 h1 code {
+  font-size: inherit;
+}
+
+.emotion-0 h2 tt,
+.emotion-0 h2 code {
+  font-size: inherit;
+}
+
+.emotion-0 h3 tt,
+.emotion-0 h3 code {
+  font-size: inherit;
+}
+
+.emotion-0 h4 tt,
+.emotion-0 h4 code {
+  font-size: inherit;
+}
+
+.emotion-0 h5 tt,
+.emotion-0 h5 code {
+  font-size: inherit;
+}
+
+.emotion-0 h6 tt,
+.emotion-0 h6 code {
+  font-size: inherit;
+}
+
+.emotion-0 p,
+.emotion-0 blockquote,
+.emotion-0 ul,
+.emotion-0 ol,
+.emotion-0 dl,
+.emotion-0 li,
+.emotion-0 table,
+.emotion-0 pre {
+  margin: 15px 0;
+}
+
+.emotion-0 hr {
+  border: 0 none;
+  color: rgba(0,0,0,.1);
+  height: 4px;
+  padding: 0;
+}
+
+.emotion-0 body > h2:first-of-type {
+  margin-top: 0;
+  padding-top: 0;
+}
+
+.emotion-0 body > h1:first-of-type {
+  margin-top: 0;
+  padding-top: 0;
+}
+
+.emotion-0 body > h1:first-of-type + h2 {
+  margin-top: 0;
+  padding-top: 0;
+}
+
+.emotion-0 body > h3:first-of-type,
+.emotion-0 body > h4:first-of-type,
+.emotion-0 body > h5:first-of-type,
+.emotion-0 body > h6:first-of-type {
+  margin-top: 0;
+  padding-top: 0;
+}
+
+.emotion-0 a:first-of-type h1,
+.emotion-0 a:first-of-type h2,
+.emotion-0 a:first-of-type h3,
+.emotion-0 a:first-of-type h4,
+.emotion-0 a:first-of-type h5,
+.emotion-0 a:first-of-type h6 {
+  margin-top: 0;
+  padding-top: 0;
+}
+
+.emotion-0 h1 p,
+.emotion-0 h2 p,
+.emotion-0 h3 p,
+.emotion-0 h4 p,
+.emotion-0 h5 p,
+.emotion-0 h6 p {
+  margin-top: 0;
+}
+
+.emotion-0 li p.first {
+  display: inline-block;
+}
+
+.emotion-0 ul,
+.emotion-0 ol {
+  padding-left: 30px;
+}
+
+.emotion-0 ul :first-of-type,
+.emotion-0 ol :first-of-type {
+  margin-top: 0;
+}
+
+.emotion-0 ul :last-child,
+.emotion-0 ol :last-child {
+  margin-bottom: 0;
+}
+
+.emotion-0 dl {
+  padding: 0;
+}
+
+.emotion-0 dl dt {
+  font-size: 14px;
+  font-weight: bold;
+  font-style: italic;
+  padding: 0;
+  margin: 15px 0 5px;
+}
+
+.emotion-0 dl dt:first-of-type {
+  padding: 0;
+}
+
+.emotion-0 dl dt > :first-of-type {
+  margin-top: 0;
+}
+
+.emotion-0 dl dt > :last-child {
+  margin-bottom: 0;
+}
+
+.emotion-0 dl dd {
+  margin: 0 0 15px;
+  padding: 0 15px;
+}
+
+.emotion-0 dl dd > :first-of-type {
+  margin-top: 0;
+}
+
+.emotion-0 dl dd > :last-child {
+  margin-bottom: 0;
+}
+
+.emotion-0 blockquote {
+  border-left: 4px solid #DDDDDD;
+  padding: 0 15px;
+  color: #666666;
+}
+
+.emotion-0 blockquote > :first-of-type {
+  margin-top: 0;
+}
+
+.emotion-0 blockquote > :last-child {
+  margin-bottom: 0;
+}
+
+.emotion-0 table {
+  padding: 0;
+  border-collapse: collapse;
+}
+
+.emotion-0 table tr {
+  border-top: 1px solid rgba(0,0,0,.1);
+  background-color: white;
+  margin: 0;
+  padding: 0;
+}
+
+.emotion-0 table tr:nth-of-type(2n) {
+  background-color: #F8F8F8;
+}
+
+.emotion-0 table tr th {
+  font-weight: bold;
+  border: 1px solid rgba(0,0,0,.1);
+  text-align: left;
+  margin: 0;
+  padding: 6px 13px;
+}
+
+.emotion-0 table tr td {
+  border: 1px solid rgba(0,0,0,.1);
+  text-align: left;
+  margin: 0;
+  padding: 6px 13px;
+}
+
+.emotion-0 table tr th :first-of-type,
+.emotion-0 table tr td :first-of-type {
+  margin-top: 0;
+}
+
+.emotion-0 table tr th :last-child,
+.emotion-0 table tr td :last-child {
+  margin-bottom: 0;
+}
+
+.emotion-0 img {
+  max-width: 100%;
+}
+
+.emotion-0 span.frame {
+  display: block;
+  overflow: hidden;
+}
+
+.emotion-0 span.frame > span {
+  border: 1px solid #DDDDDD;
+  display: block;
+  float: left;
+  overflow: hidden;
+  margin: 13px 0 0;
+  padding: 7px;
+  width: auto;
+}
+
+.emotion-0 span.frame span img {
+  display: block;
+  float: left;
+}
+
+.emotion-0 span.frame span span {
+  clear: both;
+  color: #333333;
+  display: block;
+  padding: 5px 0 0;
+}
+
+.emotion-0 span.align-center {
+  display: block;
+  overflow: hidden;
+  clear: both;
+}
+
+.emotion-0 span.align-center > span {
+  display: block;
+  overflow: hidden;
+  margin: 13px auto 0;
+  text-align: center;
+}
+
+.emotion-0 span.align-center span img {
+  margin: 0 auto;
+  text-align: center;
+}
+
+.emotion-0 span.align-right {
+  display: block;
+  overflow: hidden;
+  clear: both;
+}
+
+.emotion-0 span.align-right > span {
+  display: block;
+  overflow: hidden;
+  margin: 13px 0 0;
+  text-align: right;
+}
+
+.emotion-0 span.align-right span img {
+  margin: 0;
+  text-align: right;
+}
+
+.emotion-0 span.float-left {
+  display: block;
+  margin-right: 13px;
+  overflow: hidden;
+  float: left;
+}
+
+.emotion-0 span.float-left span {
+  margin: 13px 0 0;
+}
+
+.emotion-0 span.float-right {
+  display: block;
+  margin-left: 13px;
+  overflow: hidden;
+  float: right;
+}
+
+.emotion-0 span.float-right > span {
+  display: block;
+  overflow: hidden;
+  margin: 13px auto 0;
+  text-align: right;
+}
+
+.emotion-0 code,
+.emotion-0 tt {
+  margin: 0 2px;
+  padding: 0 5px;
+  white-space: nowrap;
+  border: 1px solid #EEEEEE;
+  background-color: #F8F8F8;
+  border-radius: 3px;
+}
+
+<div
+  style="width:600px;margin:3rem auto;padding:40px 20px;background:white"
+>
+  <div
+    class="emotion-0"
+  >
+    <h1>
+      HTML Mock
+    </h1>
   </div>
 </div>
 `;
@@ -2420,32 +3097,6 @@ exports[`Storyshots UI|Notifications/NotificationList all 1`] = `
 </div>
 `;
 
-exports[`Storyshots UI|Notifications/NotificationList empty 1`] = `
-.emotion-0 > * + * {
-  margin-top: 10px;
-}
-
-.emotion-0:empty {
-  display: none;
-}
-
-.emotion-0 > * + * {
-  margin-top: 10px;
-}
-
-.emotion-0:empty {
-  display: none;
-}
-
-<div
-  style="width:240px;margin:1rem"
->
-  <div
-    class="emotion-0"
-  />
-</div>
-`;
-
 exports[`Storyshots UI|Notifications/NotificationList single 1`] = `
 .emotion-1 {
   display: block;
@@ -4702,6 +5353,7 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
   background: transparent;
   position: relative;
   overflow: visible;
+  padding: 7px;
 }
 
 .emotion-5:hover {
@@ -5145,6 +5797,7 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
   background: transparent;
   position: relative;
   overflow: visible;
+  padding: 7px;
 }
 
 .emotion-5:hover {
@@ -5982,6 +6635,7 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   background: transparent;
   position: relative;
   overflow: visible;
+  padding: 7px;
 }
 
 .emotion-5:hover {
@@ -6548,6 +7202,7 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   background: transparent;
   position: relative;
   overflow: visible;
+  padding: 7px;
 }
 
 .emotion-5:hover {
@@ -7345,6 +8000,7 @@ exports[`Storyshots UI|Sidebar/SidebarHeading customBrand 1`] = `
   background: transparent;
   position: relative;
   overflow: visible;
+  padding: 7px;
 }
 
 .emotion-3:hover {
@@ -7493,6 +8149,7 @@ exports[`Storyshots UI|Sidebar/SidebarHeading customBrand 1`] = `
   background: transparent;
   position: relative;
   overflow: visible;
+  padding: 7px;
 }
 
 .emotion-3:hover {
@@ -7772,6 +8429,7 @@ exports[`Storyshots UI|Sidebar/SidebarHeading menuHighlighted 1`] = `
   background: transparent;
   position: relative;
   overflow: visible;
+  padding: 7px;
 }
 
 .emotion-5:hover {
@@ -7961,6 +8619,7 @@ exports[`Storyshots UI|Sidebar/SidebarHeading menuHighlighted 1`] = `
   background: transparent;
   position: relative;
   overflow: visible;
+  padding: 7px;
 }
 
 .emotion-5:hover {
@@ -8210,6 +8869,7 @@ exports[`Storyshots UI|Sidebar/SidebarHeading simple 1`] = `
   background: transparent;
   position: relative;
   overflow: visible;
+  padding: 7px;
 }
 
 .emotion-5:hover {
@@ -8388,6 +9048,7 @@ exports[`Storyshots UI|Sidebar/SidebarHeading simple 1`] = `
   background: transparent;
   position: relative;
   overflow: visible;
+  padding: 7px;
 }
 
 .emotion-5:hover {
diff --git a/lib/components/src/Button/Button.js b/lib/components/src/Button/Button.js
index ce560575062..38e2fe95662 100644
--- a/lib/components/src/Button/Button.js
+++ b/lib/components/src/Button/Button.js
@@ -1,21 +1,8 @@
-import React, { Fragment } from 'react';
+import React from 'react';
 import PropTypes from 'prop-types';
 import { styled, css } from '@storybook/theming';
 import { darken, lighten, rgba, transparentize } from 'polished';
 
-const Text = styled.span`
-  display: inline-block;
-  vertical-align: top;
-`;
-
-const Loading = styled.span`
-  position: absolute;
-  top: 50%;
-  left: 0;
-  right: 0;
-  opacity: 0;
-`;
-
 const ButtonWrapper = styled.button`
   border: 0;
   border-radius: 3em;
@@ -77,7 +64,7 @@ const ButtonWrapper = styled.button`
 
       ${props.small &&
         css`
-          padding: 7px;
+          padding: 9px;
         `}
 
       ${!props.small &&
@@ -233,45 +220,19 @@ const ButtonWrapper = styled.button`
 
 const ButtonLink = ButtonWrapper.withComponent('a');
 
-function Button({ loading, loadingText, isLink, children, ...props }) {
-  let buttonInner = children;
-  if (loading) {
-    buttonInner = (
-      <Fragment>
-        <Text>{children}</Text>
-        {loading && (
-          <Loading role="progressbar" aria-busy="true">
-            {loadingText || 'Loading...'}
-          </Loading>
-        )}
-      </Fragment>
-    );
-  }
-
+function Button({ isLink, children, ...props }) {
   if (isLink) {
-    return (
-      <ButtonLink loading={loading} {...props}>
-        {buttonInner}
-      </ButtonLink>
-    );
+    return <ButtonLink {...props}>{children}</ButtonLink>;
   }
-  return (
-    <ButtonWrapper loading={loading} {...props}>
-      {buttonInner}
-    </ButtonWrapper>
-  );
+  return <ButtonWrapper {...props}>{children}</ButtonWrapper>;
 }
 
 Button.propTypes = {
-  loading: PropTypes.bool,
-  loadingText: PropTypes.node,
   isLink: PropTypes.bool,
   children: PropTypes.node.isRequired,
 };
 
 Button.defaultProps = {
-  loading: false,
-  loadingText: null,
   isLink: false,
 };
 
diff --git a/lib/components/src/Button/Button.stories.js b/lib/components/src/Button/Button.stories.js
index 56b90db79eb..cff92c4dec8 100644
--- a/lib/components/src/Button/Button.stories.js
+++ b/lib/components/src/Button/Button.stories.js
@@ -9,10 +9,16 @@ const { Button: FormButton } = Form;
 
 storiesOf('Basics|Button', module).add('all buttons', () => (
   <div>
+    <p>Button that is used for forms</p>
+    <FormButton>Form.Button</FormButton>
+    <br />
+    <p>Buttons that are used for everything else</p>
     <Button primary>Primary</Button>
     <Button secondary>Secondary</Button>
-    <Button tertiary>Tertiary</Button>
-    <FormButton>FormButton copies teriary w/o hover translate</FormButton>
+    <Button outline containsIcon>
+      <Icon icon="link" />
+    </Button>
+    <br />
     <Button outline>Outline</Button>
     <Button outline primary>
       Outline primary
@@ -30,9 +36,6 @@ storiesOf('Basics|Button', module).add('all buttons', () => (
     <Button secondary small>
       Secondary
     </Button>
-    <Button tertiary small>
-      Tertiary
-    </Button>
     <Button outline small>
       Outline
     </Button>
diff --git a/lib/components/src/Button/__snapshots__/Button.stories.storyshot b/lib/components/src/Button/__snapshots__/Button.stories.storyshot
index e1e47a2c11d..f4a1930f4b6 100644
--- a/lib/components/src/Button/__snapshots__/Button.stories.storyshot
+++ b/lib/components/src/Button/__snapshots__/Button.stories.storyshot
@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Storyshots Basics|Button all buttons 1`] = `
-.emotion-14 {
+.emotion-4 {
   shape-rendering: inherit;
   -webkit-transform: translate3d(0,0,0);
   -ms-transform: translate3d(0,0,0);
@@ -9,199 +9,11 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   display: block;
 }
 
-.emotion-13 {
+.emotion-3 {
   fill: currentColor;
 }
 
 .emotion-0 {
-  border: 0;
-  border-radius: 3em;
-  cursor: pointer;
-  display: inline-block;
-  overflow: hidden;
-  padding: 13px 20px;
-  position: relative;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  vertical-align: top;
-  white-space: nowrap;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-  user-select: none;
-  opacity: 1;
-  margin: 0;
-  background: transparent;
-  font-size: 13px;
-  font-weight: 700;
-  line-height: 1;
-  background: #FF4785;
-  color: #FFFFFF;
-}
-
-.emotion-0 svg {
-  display: inline-block;
-  height: 16px;
-  width: 16px;
-  vertical-align: top;
-  margin-right: 6px;
-  margin-top: -2px;
-  margin-bottom: -2px;
-  pointer-events: none;
-}
-
-.emotion-0 svg path {
-  fill: currentColor;
-}
-
-.emotion-0:hover {
-  background: #ff2d74;
-}
-
-.emotion-0:active {
-  box-shadow: rgba(0,0,0,0.1) 0 0 0 3em inset;
-}
-
-.emotion-0:focus {
-  box-shadow: rgba(255,71,133,0.4) 0 1px 9px 2px;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: rgba(255,71,133,0.2) 0 8px 18px 0px;
-}
-
-.emotion-1 {
-  border: 0;
-  border-radius: 3em;
-  cursor: pointer;
-  display: inline-block;
-  overflow: hidden;
-  padding: 13px 20px;
-  position: relative;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  vertical-align: top;
-  white-space: nowrap;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-  user-select: none;
-  opacity: 1;
-  margin: 0;
-  background: transparent;
-  font-size: 13px;
-  font-weight: 700;
-  line-height: 1;
-  background: #1EA7FD;
-  color: #FFFFFF;
-}
-
-.emotion-1 svg {
-  display: inline-block;
-  height: 16px;
-  width: 16px;
-  vertical-align: top;
-  margin-right: 6px;
-  margin-top: -2px;
-  margin-bottom: -2px;
-  pointer-events: none;
-}
-
-.emotion-1 svg path {
-  fill: currentColor;
-}
-
-.emotion-1:hover {
-  background: #059dfd;
-}
-
-.emotion-1:active {
-  box-shadow: rgba(0,0,0,0.1) 0 0 0 3em inset;
-}
-
-.emotion-1:focus {
-  box-shadow: rgba(30,167,253,0.4) 0 1px 9px 2px;
-}
-
-.emotion-1:focus:hover {
-  box-shadow: rgba(30,167,253,0.2) 0 8px 18px 0px;
-}
-
-.emotion-2 {
-  border: 0;
-  border-radius: 3em;
-  cursor: pointer;
-  display: inline-block;
-  overflow: hidden;
-  padding: 13px 20px;
-  position: relative;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  vertical-align: top;
-  white-space: nowrap;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-  user-select: none;
-  opacity: 1;
-  margin: 0;
-  background: transparent;
-  font-size: 13px;
-  font-weight: 700;
-  line-height: 1;
-  background: #fff;
-  color: #333333;
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  border-radius: 4px;
-}
-
-.emotion-2 svg {
-  display: inline-block;
-  height: 16px;
-  width: 16px;
-  vertical-align: top;
-  margin-right: 6px;
-  margin-top: -2px;
-  margin-bottom: -2px;
-  pointer-events: none;
-}
-
-.emotion-2 svg path {
-  fill: currentColor;
-}
-
-.emotion-2:hover {
-  background: #fff;
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0,rgba(0,0,0,.1) 0 0 0 1px inset;
-}
-
-.emotion-2:active {
-  background: #FFFFFF;
-}
-
-.emotion-2:focus {
-  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
-}
-
-.emotion-3 {
   border: 0;
   border-radius: 3em;
   cursor: pointer;
@@ -242,7 +54,7 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   z-index: 2;
 }
 
-.emotion-3 svg {
+.emotion-0 svg {
   display: inline-block;
   height: 14px;
   width: 14px;
@@ -253,29 +65,218 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   pointer-events: none;
 }
 
-.emotion-3 svg path {
+.emotion-0 svg path {
   fill: currentColor;
 }
 
-.emotion-3:hover {
+.emotion-0:hover {
   background: #fff;
 }
 
-.emotion-3:active {
+.emotion-0:active {
   background: #FFFFFF;
 }
 
-.emotion-3:focus {
+.emotion-0:focus {
   box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
-.emotion-3:hover {
+.emotion-0:hover {
   -webkit-transform: none;
   -ms-transform: none;
   transform: none;
 }
 
-.emotion-4 {
+.emotion-1 {
+  border: 0;
+  border-radius: 3em;
+  cursor: pointer;
+  display: inline-block;
+  overflow: hidden;
+  padding: 13px 20px;
+  position: relative;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  vertical-align: top;
+  white-space: nowrap;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  opacity: 1;
+  margin: 0;
+  background: transparent;
+  font-size: 13px;
+  font-weight: 700;
+  line-height: 1;
+  background: #FF4785;
+  color: #FFFFFF;
+}
+
+.emotion-1 svg {
+  display: inline-block;
+  height: 16px;
+  width: 16px;
+  vertical-align: top;
+  margin-right: 6px;
+  margin-top: -2px;
+  margin-bottom: -2px;
+  pointer-events: none;
+}
+
+.emotion-1 svg path {
+  fill: currentColor;
+}
+
+.emotion-1:hover {
+  background: #ff2d74;
+}
+
+.emotion-1:active {
+  box-shadow: rgba(0,0,0,0.1) 0 0 0 3em inset;
+}
+
+.emotion-1:focus {
+  box-shadow: rgba(255,71,133,0.4) 0 1px 9px 2px;
+}
+
+.emotion-1:focus:hover {
+  box-shadow: rgba(255,71,133,0.2) 0 8px 18px 0px;
+}
+
+.emotion-2 {
+  border: 0;
+  border-radius: 3em;
+  cursor: pointer;
+  display: inline-block;
+  overflow: hidden;
+  padding: 13px 20px;
+  position: relative;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  vertical-align: top;
+  white-space: nowrap;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  opacity: 1;
+  margin: 0;
+  background: transparent;
+  font-size: 13px;
+  font-weight: 700;
+  line-height: 1;
+  background: #1EA7FD;
+  color: #FFFFFF;
+}
+
+.emotion-2 svg {
+  display: inline-block;
+  height: 16px;
+  width: 16px;
+  vertical-align: top;
+  margin-right: 6px;
+  margin-top: -2px;
+  margin-bottom: -2px;
+  pointer-events: none;
+}
+
+.emotion-2 svg path {
+  fill: currentColor;
+}
+
+.emotion-2:hover {
+  background: #059dfd;
+}
+
+.emotion-2:active {
+  box-shadow: rgba(0,0,0,0.1) 0 0 0 3em inset;
+}
+
+.emotion-2:focus {
+  box-shadow: rgba(30,167,253,0.4) 0 1px 9px 2px;
+}
+
+.emotion-2:focus:hover {
+  box-shadow: rgba(30,167,253,0.2) 0 8px 18px 0px;
+}
+
+.emotion-5 {
+  border: 0;
+  border-radius: 3em;
+  cursor: pointer;
+  display: inline-block;
+  overflow: hidden;
+  padding: 13px 20px;
+  position: relative;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  vertical-align: top;
+  white-space: nowrap;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  opacity: 1;
+  margin: 0;
+  background: transparent;
+  font-size: 13px;
+  font-weight: 700;
+  line-height: 1;
+  padding: 12px;
+  box-shadow: rgba(51,51,51,0.2) 0 0 0 1px inset;
+  color: rgba(51,51,51,0.7);
+  background: transparent;
+}
+
+.emotion-5 svg {
+  display: inline-block;
+  height: 16px;
+  width: 16px;
+  vertical-align: top;
+  margin-right: 6px;
+  margin-top: -2px;
+  margin-bottom: -2px;
+  pointer-events: none;
+}
+
+.emotion-5 svg path {
+  fill: currentColor;
+}
+
+.emotion-5 svg {
+  display: block;
+  margin: 0;
+}
+
+.emotion-5:hover {
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
+}
+
+.emotion-5:active {
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
+  color: #333;
+}
+
+.emotion-6 {
   border: 0;
   border-radius: 3em;
   cursor: pointer;
@@ -308,7 +309,7 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   background: transparent;
 }
 
-.emotion-4 svg {
+.emotion-6 svg {
   display: inline-block;
   height: 16px;
   width: 16px;
@@ -319,20 +320,20 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   pointer-events: none;
 }
 
-.emotion-4 svg path {
+.emotion-6 svg path {
   fill: currentColor;
 }
 
-.emotion-4:hover {
+.emotion-6:hover {
   box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
 }
 
-.emotion-4:active {
+.emotion-6:active {
   box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
   color: #333;
 }
 
-.emotion-5 {
+.emotion-7 {
   border: 0;
   border-radius: 3em;
   cursor: pointer;
@@ -369,7 +370,7 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   color: #FF4785;
 }
 
-.emotion-5 svg {
+.emotion-7 svg {
   display: inline-block;
   height: 16px;
   width: 16px;
@@ -380,59 +381,59 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   pointer-events: none;
 }
 
-.emotion-5 svg path {
+.emotion-7 svg path {
   fill: currentColor;
 }
 
-.emotion-5:hover {
+.emotion-7:hover {
   background: #ff2d74;
 }
 
-.emotion-5:active {
+.emotion-7:active {
   box-shadow: rgba(0,0,0,0.1) 0 0 0 3em inset;
 }
 
-.emotion-5:focus {
+.emotion-7:focus {
   box-shadow: rgba(255,71,133,0.4) 0 1px 9px 2px;
 }
 
-.emotion-5:focus:hover {
+.emotion-7:focus:hover {
   box-shadow: rgba(255,71,133,0.2) 0 8px 18px 0px;
 }
 
-.emotion-5:hover {
+.emotion-7:hover {
   box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
 }
 
-.emotion-5:active {
+.emotion-7:active {
   box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
   color: #333;
 }
 
-.emotion-5 svg path {
+.emotion-7 svg path {
   fill: #FF4785;
 }
 
-.emotion-5:hover {
+.emotion-7:hover {
   box-shadow: #FF4785 0 0 0 1px inset;
   background: transparent;
 }
 
-.emotion-5:active {
+.emotion-7:active {
   background: #FF4785;
   box-shadow: #FF4785 0 0 0 1px inset;
   color: #FFFFFF;
 }
 
-.emotion-5:focus {
+.emotion-7:focus {
   box-shadow: #FF4785 0 0 0 1px inset, rgba(255,71,133,0.4) 0 1px 9px 2px;
 }
 
-.emotion-5:focus:hover {
+.emotion-7:focus:hover {
   box-shadow: #FF4785 0 0 0 1px inset, rgba(255,71,133,0.2) 0 8px 18px 0px;
 }
 
-.emotion-6 {
+.emotion-8 {
   border: 0;
   border-radius: 3em;
   cursor: pointer;
@@ -469,7 +470,7 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   color: #1EA7FD;
 }
 
-.emotion-6 svg {
+.emotion-8 svg {
   display: inline-block;
   height: 16px;
   width: 16px;
@@ -480,55 +481,55 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   pointer-events: none;
 }
 
-.emotion-6 svg path {
+.emotion-8 svg path {
   fill: currentColor;
 }
 
-.emotion-6:hover {
+.emotion-8:hover {
   background: #059dfd;
 }
 
-.emotion-6:active {
+.emotion-8:active {
   box-shadow: rgba(0,0,0,0.1) 0 0 0 3em inset;
 }
 
-.emotion-6:focus {
+.emotion-8:focus {
   box-shadow: rgba(30,167,253,0.4) 0 1px 9px 2px;
 }
 
-.emotion-6:focus:hover {
+.emotion-8:focus:hover {
   box-shadow: rgba(30,167,253,0.2) 0 8px 18px 0px;
 }
 
-.emotion-6:hover {
+.emotion-8:hover {
   box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
 }
 
-.emotion-6:active {
+.emotion-8:active {
   box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
   color: #333;
 }
 
-.emotion-6:hover {
+.emotion-8:hover {
   box-shadow: #1EA7FD 0 0 0 1px inset;
   background: transparent;
 }
 
-.emotion-6:active {
+.emotion-8:active {
   background: #1EA7FD;
   box-shadow: #1EA7FD 0 0 0 1px inset;
   color: #FFFFFF;
 }
 
-.emotion-6:focus {
+.emotion-8:focus {
   box-shadow: #1EA7FD 0 0 0 1px inset, rgba(30,167,253,0.4) 0 1px 9px 2px;
 }
 
-.emotion-6:focus:hover {
+.emotion-8:focus:hover {
   box-shadow: #1EA7FD 0 0 0 1px inset, rgba(30,167,253,0.2) 0 8px 18px 0px;
 }
 
-.emotion-7 {
+.emotion-9 {
   border: 0;
   border-radius: 3em;
   cursor: pointer;
@@ -562,7 +563,7 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   color: #FFFFFF;
 }
 
-.emotion-7 svg {
+.emotion-9 svg {
   display: inline-block;
   height: 16px;
   width: 16px;
@@ -573,33 +574,33 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   pointer-events: none;
 }
 
-.emotion-7 svg path {
+.emotion-9 svg path {
   fill: currentColor;
 }
 
-.emotion-7:hover {
+.emotion-9:hover {
   -webkit-transform: none;
   -ms-transform: none;
   transform: none;
 }
 
-.emotion-7:hover {
+.emotion-9:hover {
   background: #ff2d74;
 }
 
-.emotion-7:active {
+.emotion-9:active {
   box-shadow: rgba(0,0,0,0.1) 0 0 0 3em inset;
 }
 
-.emotion-7:focus {
+.emotion-9:focus {
   box-shadow: rgba(255,71,133,0.4) 0 1px 9px 2px;
 }
 
-.emotion-7:focus:hover {
+.emotion-9:focus:hover {
   box-shadow: rgba(255,71,133,0.2) 0 8px 18px 0px;
 }
 
-.emotion-8 {
+.emotion-10 {
   border: 0;
   border-radius: 3em;
   cursor: pointer;
@@ -631,7 +632,7 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   color: #FFFFFF;
 }
 
-.emotion-8 svg {
+.emotion-10 svg {
   display: inline-block;
   height: 14px;
   width: 14px;
@@ -642,27 +643,27 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   pointer-events: none;
 }
 
-.emotion-8 svg path {
+.emotion-10 svg path {
   fill: currentColor;
 }
 
-.emotion-8:hover {
+.emotion-10:hover {
   background: #ff2d74;
 }
 
-.emotion-8:active {
+.emotion-10:active {
   box-shadow: rgba(0,0,0,0.1) 0 0 0 3em inset;
 }
 
-.emotion-8:focus {
+.emotion-10:focus {
   box-shadow: rgba(255,71,133,0.4) 0 1px 9px 2px;
 }
 
-.emotion-8:focus:hover {
+.emotion-10:focus:hover {
   box-shadow: rgba(255,71,133,0.2) 0 8px 18px 0px;
 }
 
-.emotion-9 {
+.emotion-11 {
   border: 0;
   border-radius: 3em;
   cursor: pointer;
@@ -694,7 +695,7 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   color: #FFFFFF;
 }
 
-.emotion-9 svg {
+.emotion-11 svg {
   display: inline-block;
   height: 14px;
   width: 14px;
@@ -705,89 +706,27 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   pointer-events: none;
 }
 
-.emotion-9 svg path {
+.emotion-11 svg path {
   fill: currentColor;
 }
 
-.emotion-9:hover {
+.emotion-11:hover {
   background: #059dfd;
 }
 
-.emotion-9:active {
+.emotion-11:active {
   box-shadow: rgba(0,0,0,0.1) 0 0 0 3em inset;
 }
 
-.emotion-9:focus {
+.emotion-11:focus {
   box-shadow: rgba(30,167,253,0.4) 0 1px 9px 2px;
 }
 
-.emotion-9:focus:hover {
+.emotion-11:focus:hover {
   box-shadow: rgba(30,167,253,0.2) 0 8px 18px 0px;
 }
 
-.emotion-10 {
-  border: 0;
-  border-radius: 3em;
-  cursor: pointer;
-  display: inline-block;
-  overflow: hidden;
-  padding: 10px 16px;
-  position: relative;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  vertical-align: top;
-  white-space: nowrap;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-  user-select: none;
-  opacity: 1;
-  margin: 0;
-  background: transparent;
-  font-size: 12px;
-  font-weight: 700;
-  line-height: 1;
-  background: #fff;
-  color: #333333;
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  border-radius: 4px;
-}
-
-.emotion-10 svg {
-  display: inline-block;
-  height: 14px;
-  width: 14px;
-  vertical-align: top;
-  margin-right: 4px;
-  margin-top: -1px;
-  margin-bottom: -1px;
-  pointer-events: none;
-}
-
-.emotion-10 svg path {
-  fill: currentColor;
-}
-
-.emotion-10:hover {
-  background: #fff;
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0,rgba(0,0,0,.1) 0 0 0 1px inset;
-}
-
-.emotion-10:active {
-  background: #FFFFFF;
-}
-
-.emotion-10:focus {
-  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
-}
-
-.emotion-11 {
+.emotion-12 {
   border: 0;
   border-radius: 3em;
   cursor: pointer;
@@ -820,7 +759,7 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   background: transparent;
 }
 
-.emotion-11 svg {
+.emotion-12 svg {
   display: inline-block;
   height: 14px;
   width: 14px;
@@ -831,20 +770,20 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   pointer-events: none;
 }
 
-.emotion-11 svg path {
+.emotion-12 svg path {
   fill: currentColor;
 }
 
-.emotion-11:hover {
+.emotion-12:hover {
   box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
 }
 
-.emotion-11:active {
+.emotion-12:active {
   box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
   color: #333;
 }
 
-.emotion-12 {
+.emotion-13 {
   border: 0;
   border-radius: 3em;
   cursor: pointer;
@@ -878,7 +817,7 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   color: #FFFFFF;
 }
 
-.emotion-12 svg {
+.emotion-13 svg {
   display: inline-block;
   height: 14px;
   width: 14px;
@@ -889,33 +828,33 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   pointer-events: none;
 }
 
-.emotion-12 svg path {
+.emotion-13 svg path {
   fill: currentColor;
 }
 
-.emotion-12:hover {
+.emotion-13:hover {
   -webkit-transform: none;
   -ms-transform: none;
   transform: none;
 }
 
-.emotion-12:hover {
+.emotion-13:hover {
   background: #ff2d74;
 }
 
-.emotion-12:active {
+.emotion-13:active {
   box-shadow: rgba(0,0,0,0.1) 0 0 0 3em inset;
 }
 
-.emotion-12:focus {
+.emotion-13:focus {
   box-shadow: rgba(255,71,133,0.4) 0 1px 9px 2px;
 }
 
-.emotion-12:focus:hover {
+.emotion-13:focus:hover {
   box-shadow: rgba(255,71,133,0.2) 0 8px 18px 0px;
 }
 
-.emotion-15 {
+.emotion-16 {
   border: 0;
   border-radius: 3em;
   cursor: pointer;
@@ -943,13 +882,13 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  padding: 7px;
+  padding: 9px;
   box-shadow: rgba(51,51,51,0.2) 0 0 0 1px inset;
   color: rgba(51,51,51,0.7);
   background: transparent;
 }
 
-.emotion-15 svg {
+.emotion-16 svg {
   display: inline-block;
   height: 14px;
   width: 14px;
@@ -960,115 +899,126 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   pointer-events: none;
 }
 
-.emotion-15 svg path {
+.emotion-16 svg path {
   fill: currentColor;
 }
 
-.emotion-15 svg {
+.emotion-16 svg {
   display: block;
   margin: 0;
 }
 
-.emotion-15:hover {
+.emotion-16:hover {
   box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
 }
 
-.emotion-15:active {
+.emotion-16:active {
   box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
   color: #333;
 }
 
 <div>
+  <p>
+    Button that is used for forms
+  </p>
   <button
     class="emotion-0"
+  >
+    Form.Button
+  </button>
+  <br />
+  <p>
+    Buttons that are used for everything else
+  </p>
+  <button
+    class="emotion-1"
   >
     Primary
   </button>
   <button
-    class="emotion-1"
+    class="emotion-2"
   >
     Secondary
   </button>
   <button
-    class="emotion-2"
+    class="emotion-5"
   >
-    Tertiary
+    <svg
+      class="emotion-4"
+      viewBox="0 0 1024 1024"
+    >
+      <path
+        class="emotion-3"
+        d="M743.52 529.234c5.616-5.616 83.048-83.046 88.462-88.46 30.944-32.778 47.97-75.636 47.97-120.792 0-47.048-18.304-91.26-51.542-124.484-33.228-33.22-77.43-51.516-124.458-51.516-45.024 0-87.792 16.94-120.536 47.72l-104.458 104.456c-30.792 32.738-47.734 75.512-47.734 120.548 0 41.916 14.576 81.544 41.248 113.196 3.264 3.876 6.666 7.664 10.292 11.29 4.258 4.258 8.704 8.262 13.304 12.022 0.054 0.080 0.096 0.152 0.148 0.232 9.572 7.308 15.778 18.804 15.778 31.776 0 22.094-17.914 40-40.004 40-8.542 0-16.442-2.696-22.938-7.26-2.746-1.93-20.622-17.43-30.35-28.050-0.008-0.010-0.018-0.018-0.026-0.028-4.992-5.432-13.234-15.23-18.552-22.65s-16.556-25.872-17.036-26.736c-0.7-1.262-2.974-5.526-3.422-6.39-0.69-1.334-6.118-12.67-6.114-12.67-14.342-31.96-22.332-67.4-22.332-104.728 0-60.826 21.198-116.648 56.58-160.544 0.252-0.314 4.61-5.594 6.594-7.866 0.304-0.35 5.038-5.636 7.16-7.874 0.252-0.268 105.86-105.874 106.128-106.126 45.902-43.584 107.958-70.314 176.264-70.314 141.382 0 255.998 114.5 255.998 256 0 68.516-26.882 130.688-70.652 176.61-0.144 0.148-109.854 109.546-112.090 111.528-0.958 0.848-5.072 4.352-5.072 4.352-6.448 5.434-13.132 10.592-20.1 15.378 0.412-6.836 0.644-13.702 0.644-20.6 0-26.46-3.108-52.206-8.918-76.918l-0.236-1.102zM616.144 767.82c35.382-43.896 56.58-99.718 56.58-160.544 0-37.328-7.99-72.768-22.332-104.728 0.004 0 0.006-0.002 0.010-0.004-0.258-0.576-0.538-1.14-0.8-1.714-0.686-1.498-2.894-6.112-3.296-6.93-0.668-1.344-2.952-5.732-3.386-6.604-3.48-6.982-8.708-15.126-9.49-16.366-0.498-0.792-0.996-1.58-1.502-2.364-0.834-1.29-15.364-22.066-26.656-34.466-0.008-0.010-0.018-0.018-0.026-0.028-7.056-8.448-24.932-24.198-30.35-28.050-6.47-4.602-14.396-7.26-22.938-7.26-22.090 0-40.004 17.906-40.004 40 0 12.97 6.206 24.466 15.778 31.776 0.052 0.080 0.094 0.152 0.148 0.232 4.602 3.76 20.334 19.434 23.598 23.31 26.672 31.65 41.248 71.28 41.248 113.196 0 45.038-16.944 87.81-47.734 120.548l-104.458 104.456c-32.742 30.782-75.512 47.72-120.536 47.72-47.028 0-91.228-18.294-124.458-51.516-33.236-33.224-51.542-77.436-51.542-124.484 0-45.154 17.028-88.014 47.97-120.792 5.414-5.414 40.812-40.812 68.958-68.958 7.176-7.176 13.888-13.886 19.504-19.502v-0.002c-0.356-1.562-0.246-1.096-0.246-1.096-5.81-24.712-8.918-50.458-8.918-76.918 0-6.898 0.232-13.764 0.644-20.6-6.966 4.788-20.1 15.33-20.1 15.33-0.734 0.62-9.518 8.388-11.68 10.45-0.16 0.154-105.338 105.33-105.482 105.478-43.77 45.922-70.652 108.094-70.652 176.61 0 141.5 114.616 256 255.998 256 68.306 0 130.362-26.73 176.264-70.314 0.27-0.254 105.876-105.86 106.128-106.126 0.004-0.002 13.506-15.426 13.758-15.74z"
+      />
+    </svg>
   </button>
+  <br />
   <button
-    class="emotion-3"
-  >
-    FormButton copies teriary w/o hover translate
-  </button>
-  <button
-    class="emotion-4"
+    class="emotion-6"
   >
     Outline
   </button>
   <button
-    class="emotion-5"
+    class="emotion-7"
   >
     Outline primary
   </button>
   <button
-    class="emotion-6"
+    class="emotion-8"
   >
     Outline secondary
   </button>
   <button
-    class="emotion-7"
+    class="emotion-9"
     disabled=""
   >
     Disabled
   </button>
   <br />
   <button
-    class="emotion-8"
+    class="emotion-10"
   >
     Primary
   </button>
   <button
-    class="emotion-9"
+    class="emotion-11"
   >
     Secondary
   </button>
   <button
-    class="emotion-10"
-  >
-    Tertiary
-  </button>
-  <button
-    class="emotion-11"
+    class="emotion-12"
   >
     Outline
   </button>
   <button
-    class="emotion-12"
+    class="emotion-13"
     disabled=""
   >
     Disabled
   </button>
   <button
-    class="emotion-15"
+    class="emotion-16"
   >
     <svg
-      class="emotion-14"
+      class="emotion-4"
       viewBox="0 0 1024 1024"
     >
       <path
-        class="emotion-13"
+        class="emotion-3"
         d="M743.52 529.234c5.616-5.616 83.048-83.046 88.462-88.46 30.944-32.778 47.97-75.636 47.97-120.792 0-47.048-18.304-91.26-51.542-124.484-33.228-33.22-77.43-51.516-124.458-51.516-45.024 0-87.792 16.94-120.536 47.72l-104.458 104.456c-30.792 32.738-47.734 75.512-47.734 120.548 0 41.916 14.576 81.544 41.248 113.196 3.264 3.876 6.666 7.664 10.292 11.29 4.258 4.258 8.704 8.262 13.304 12.022 0.054 0.080 0.096 0.152 0.148 0.232 9.572 7.308 15.778 18.804 15.778 31.776 0 22.094-17.914 40-40.004 40-8.542 0-16.442-2.696-22.938-7.26-2.746-1.93-20.622-17.43-30.35-28.050-0.008-0.010-0.018-0.018-0.026-0.028-4.992-5.432-13.234-15.23-18.552-22.65s-16.556-25.872-17.036-26.736c-0.7-1.262-2.974-5.526-3.422-6.39-0.69-1.334-6.118-12.67-6.114-12.67-14.342-31.96-22.332-67.4-22.332-104.728 0-60.826 21.198-116.648 56.58-160.544 0.252-0.314 4.61-5.594 6.594-7.866 0.304-0.35 5.038-5.636 7.16-7.874 0.252-0.268 105.86-105.874 106.128-106.126 45.902-43.584 107.958-70.314 176.264-70.314 141.382 0 255.998 114.5 255.998 256 0 68.516-26.882 130.688-70.652 176.61-0.144 0.148-109.854 109.546-112.090 111.528-0.958 0.848-5.072 4.352-5.072 4.352-6.448 5.434-13.132 10.592-20.1 15.378 0.412-6.836 0.644-13.702 0.644-20.6 0-26.46-3.108-52.206-8.918-76.918l-0.236-1.102zM616.144 767.82c35.382-43.896 56.58-99.718 56.58-160.544 0-37.328-7.99-72.768-22.332-104.728 0.004 0 0.006-0.002 0.010-0.004-0.258-0.576-0.538-1.14-0.8-1.714-0.686-1.498-2.894-6.112-3.296-6.93-0.668-1.344-2.952-5.732-3.386-6.604-3.48-6.982-8.708-15.126-9.49-16.366-0.498-0.792-0.996-1.58-1.502-2.364-0.834-1.29-15.364-22.066-26.656-34.466-0.008-0.010-0.018-0.018-0.026-0.028-7.056-8.448-24.932-24.198-30.35-28.050-6.47-4.602-14.396-7.26-22.938-7.26-22.090 0-40.004 17.906-40.004 40 0 12.97 6.206 24.466 15.778 31.776 0.052 0.080 0.094 0.152 0.148 0.232 4.602 3.76 20.334 19.434 23.598 23.31 26.672 31.65 41.248 71.28 41.248 113.196 0 45.038-16.944 87.81-47.734 120.548l-104.458 104.456c-32.742 30.782-75.512 47.72-120.536 47.72-47.028 0-91.228-18.294-124.458-51.516-33.236-33.224-51.542-77.436-51.542-124.484 0-45.154 17.028-88.014 47.97-120.792 5.414-5.414 40.812-40.812 68.958-68.958 7.176-7.176 13.888-13.886 19.504-19.502v-0.002c-0.356-1.562-0.246-1.096-0.246-1.096-5.81-24.712-8.918-50.458-8.918-76.918 0-6.898 0.232-13.764 0.644-20.6-6.966 4.788-20.1 15.33-20.1 15.33-0.734 0.62-9.518 8.388-11.68 10.45-0.16 0.154-105.338 105.33-105.482 105.478-43.77 45.922-70.652 108.094-70.652 176.61 0 141.5 114.616 256 255.998 256 68.306 0 130.362-26.73 176.264-70.314 0.27-0.254 105.876-105.86 106.128-106.126 0.004-0.002 13.506-15.426 13.758-15.74z"
       />
     </svg>
   </button>
   <button
-    class="emotion-11"
+    class="emotion-12"
   >
     <svg
-      class="emotion-14"
+      class="emotion-4"
       viewBox="0 0 1024 1024"
     >
       <path
-        class="emotion-13"
+        class="emotion-3"
         d="M743.52 529.234c5.616-5.616 83.048-83.046 88.462-88.46 30.944-32.778 47.97-75.636 47.97-120.792 0-47.048-18.304-91.26-51.542-124.484-33.228-33.22-77.43-51.516-124.458-51.516-45.024 0-87.792 16.94-120.536 47.72l-104.458 104.456c-30.792 32.738-47.734 75.512-47.734 120.548 0 41.916 14.576 81.544 41.248 113.196 3.264 3.876 6.666 7.664 10.292 11.29 4.258 4.258 8.704 8.262 13.304 12.022 0.054 0.080 0.096 0.152 0.148 0.232 9.572 7.308 15.778 18.804 15.778 31.776 0 22.094-17.914 40-40.004 40-8.542 0-16.442-2.696-22.938-7.26-2.746-1.93-20.622-17.43-30.35-28.050-0.008-0.010-0.018-0.018-0.026-0.028-4.992-5.432-13.234-15.23-18.552-22.65s-16.556-25.872-17.036-26.736c-0.7-1.262-2.974-5.526-3.422-6.39-0.69-1.334-6.118-12.67-6.114-12.67-14.342-31.96-22.332-67.4-22.332-104.728 0-60.826 21.198-116.648 56.58-160.544 0.252-0.314 4.61-5.594 6.594-7.866 0.304-0.35 5.038-5.636 7.16-7.874 0.252-0.268 105.86-105.874 106.128-106.126 45.902-43.584 107.958-70.314 176.264-70.314 141.382 0 255.998 114.5 255.998 256 0 68.516-26.882 130.688-70.652 176.61-0.144 0.148-109.854 109.546-112.090 111.528-0.958 0.848-5.072 4.352-5.072 4.352-6.448 5.434-13.132 10.592-20.1 15.378 0.412-6.836 0.644-13.702 0.644-20.6 0-26.46-3.108-52.206-8.918-76.918l-0.236-1.102zM616.144 767.82c35.382-43.896 56.58-99.718 56.58-160.544 0-37.328-7.99-72.768-22.332-104.728 0.004 0 0.006-0.002 0.010-0.004-0.258-0.576-0.538-1.14-0.8-1.714-0.686-1.498-2.894-6.112-3.296-6.93-0.668-1.344-2.952-5.732-3.386-6.604-3.48-6.982-8.708-15.126-9.49-16.366-0.498-0.792-0.996-1.58-1.502-2.364-0.834-1.29-15.364-22.066-26.656-34.466-0.008-0.010-0.018-0.018-0.026-0.028-7.056-8.448-24.932-24.198-30.35-28.050-6.47-4.602-14.396-7.26-22.938-7.26-22.090 0-40.004 17.906-40.004 40 0 12.97 6.206 24.466 15.778 31.776 0.052 0.080 0.094 0.152 0.148 0.232 4.602 3.76 20.334 19.434 23.598 23.31 26.672 31.65 41.248 71.28 41.248 113.196 0 45.038-16.944 87.81-47.734 120.548l-104.458 104.456c-32.742 30.782-75.512 47.72-120.536 47.72-47.028 0-91.228-18.294-124.458-51.516-33.236-33.224-51.542-77.436-51.542-124.484 0-45.154 17.028-88.014 47.97-120.792 5.414-5.414 40.812-40.812 68.958-68.958 7.176-7.176 13.888-13.886 19.504-19.502v-0.002c-0.356-1.562-0.246-1.096-0.246-1.096-5.81-24.712-8.918-50.458-8.918-76.918 0-6.898 0.232-13.764 0.644-20.6-6.966 4.788-20.1 15.33-20.1 15.33-0.734 0.62-9.518 8.388-11.68 10.45-0.16 0.154-105.338 105.33-105.482 105.478-43.77 45.922-70.652 108.094-70.652 176.61 0 141.5 114.616 256 255.998 256 68.306 0 130.362-26.73 176.264-70.314 0.27-0.254 105.876-105.86 106.128-106.126 0.004-0.002 13.506-15.426 13.758-15.74z"
       />
     </svg>
diff --git a/lib/components/src/bar/bar.js b/lib/components/src/bar/bar.js
index bec7f3914f6..afc1cfbc9c2 100644
--- a/lib/components/src/bar/bar.js
+++ b/lib/components/src/bar/bar.js
@@ -5,15 +5,9 @@ import { styled } from '@storybook/theming';
 const Side = styled.div(
   {
     display: 'flex',
+    flexBasis: 'auto',
+    flexShrink: 0,
   },
-  ({ right }) =>
-    right
-      ? {
-          '& > *': {
-            marginRight: 15,
-          },
-        }
-      : {},
   ({ left }) =>
     left
       ? {
@@ -22,10 +16,13 @@ const Side = styled.div(
           },
         }
       : {},
-  ({ flex }) =>
-    flex
+  ({ right }) =>
+    right
       ? {
-          flex: 1,
+          marginLeft: 30,
+          '& > *': {
+            marginRight: 15,
+          },
         }
       : {}
 );
@@ -33,18 +30,55 @@ Side.displayName = 'Side';
 
 export const Bar = styled.div(
   ({ theme }) => ({
-    display: 'flex',
-    justifyContent: 'space-between',
-    background: theme.barBg,
+    // display: 'flex',
+    // justifyContent: 'space-between',
+    // background: theme.barBg,
     color: theme.barTextColor,
     height: 40,
-    position: 'relative',
-  }),
-  ({ scroll = true }) => ({
-    overflow: scroll ? 'auto' : 'visible',
-    overflowX: scroll ? 'auto' : 'visible',
-    overflowY: scroll ? 'hidden' : 'visible',
   }),
+  ({ theme, scroll = true }) =>
+    scroll
+      ? {
+          overflow: 'auto',
+          overflowX: 'auto',
+          overflowY: 'hidden',
+          scrollbarWidth: ['slim', 3],
+          scrollbarColor: 'transparent transparent',
+
+          '&::-webkit-scrollbar': {
+            height: 3,
+            width: 3,
+            background: 'transparent',
+            boxShadow: 'none',
+          },
+
+          '&::-webkit-scrollbar-track': {
+            borderRadius: 0,
+            background: 'transparent',
+            opacity: 0,
+            border: '0 none',
+            boxShadow: 'none',
+            height: 0,
+            width: 0,
+          },
+
+          '&::-webkit-scrollbar-thumb': {
+            borderRadius: 0,
+            background: theme.color.border,
+            boxShadow: 'none',
+          },
+          '&::-webkit-scrollbar-track-piece': {
+            display: 'none',
+            border: '0 none',
+            opacity: 0,
+            visibility: 'hidden',
+          },
+        }
+      : {
+          overflow: 'visible',
+          overflowX: 'visible',
+          overflowY: 'visible',
+        },
   ({ theme, border }) =>
     border
       ? {
@@ -56,14 +90,28 @@ export const Bar = styled.div(
 );
 Bar.displayName = 'Bar';
 
+const BarInner = styled.div({
+  display: 'flex',
+  justifyContent: 'space-between',
+  position: 'relative',
+  whiteSpace: 'nowrap',
+  height: 40,
+});
+
 export const FlexBar = ({ children, ...rest }) => {
   const [left, right] = Children.toArray(children);
   return (
-    <Bar {...rest}>
-      <Side flex left>
-        {left}
-      </Side>
-      {right ? <Side right>{right}</Side> : null}
+    <Bar {...rest} title="bar">
+      <BarInner>
+        <Side left title="side left">
+          {left}
+        </Side>
+        {right ? (
+          <Side right title="side right">
+            {right}
+          </Side>
+        ) : null}
+      </BarInner>
     </Bar>
   );
 };
diff --git a/lib/components/src/bar/separator.js b/lib/components/src/bar/separator.js
index 3a4a533520c..61006d90aad 100644
--- a/lib/components/src/bar/separator.js
+++ b/lib/components/src/bar/separator.js
@@ -31,10 +31,10 @@ export const Separator = styled.span(
           '& + &': {
             display: 'none',
           },
-          '&:first-child': {
+          '&:first-of-type': {
             display: 'none',
           },
-          '&:last-child': {
+          '&:last-of-type': {
             display: 'none',
           },
         }
diff --git a/lib/components/src/form/__snapshots__/form.stories.storyshot b/lib/components/src/form/__snapshots__/form.stories.storyshot
index 620c1052048..6a2c8a94ba6 100644
--- a/lib/components/src/form/__snapshots__/form.stories.storyshot
+++ b/lib/components/src/form/__snapshots__/form.stories.storyshot
@@ -5,7 +5,7 @@ exports[`Storyshots Basics|Form/Button sizes 1`] = `
   margin-top: 10px;
 }
 
-.emotion-6 > *:first-child {
+.emotion-6 > *:first-of-type {
   margin-top: 0;
 }
 
@@ -278,7 +278,7 @@ exports[`Storyshots Basics|Form/Button validations 1`] = `
   margin-top: 10px;
 }
 
-.emotion-8 > *:first-child {
+.emotion-8 > *:first-of-type {
   margin-top: 0;
 }
 
@@ -762,7 +762,7 @@ exports[`Storyshots Basics|Form/Input alignment 1`] = `
   margin-top: 10px;
 }
 
-.emotion-6 > *:first-child {
+.emotion-6 > *:first-of-type {
   margin-top: 0;
 }
 
@@ -964,7 +964,7 @@ exports[`Storyshots Basics|Form/Input sizes 1`] = `
   margin-top: 10px;
 }
 
-.emotion-6 > *:first-child {
+.emotion-6 > *:first-of-type {
   margin-top: 0;
 }
 
@@ -1168,7 +1168,7 @@ exports[`Storyshots Basics|Form/Input validations 1`] = `
   margin-top: 10px;
 }
 
-.emotion-8 > *:first-child {
+.emotion-8 > *:first-of-type {
   margin-top: 0;
 }
 
@@ -1433,7 +1433,7 @@ exports[`Storyshots Basics|Form/Select sizes 1`] = `
   margin-top: 10px;
 }
 
-.emotion-6 > *:first-child {
+.emotion-6 > *:first-of-type {
   margin-top: 0;
 }
 
@@ -1706,7 +1706,7 @@ exports[`Storyshots Basics|Form/Select validations 1`] = `
   margin-top: 10px;
 }
 
-.emotion-4 > *:first-child {
+.emotion-4 > *:first-of-type {
   margin-top: 0;
 }
 
@@ -2063,7 +2063,7 @@ exports[`Storyshots Basics|Form/Textarea alignment 1`] = `
   margin-top: 10px;
 }
 
-.emotion-6 > *:first-child {
+.emotion-6 > *:first-of-type {
   margin-top: 0;
 }
 
@@ -2274,7 +2274,7 @@ exports[`Storyshots Basics|Form/Textarea sizes 1`] = `
   margin-top: 10px;
 }
 
-.emotion-6 > *:first-child {
+.emotion-6 > *:first-of-type {
   margin-top: 0;
 }
 
@@ -2484,7 +2484,7 @@ exports[`Storyshots Basics|Form/Textarea validations 1`] = `
   margin-top: 10px;
 }
 
-.emotion-8 > *:first-child {
+.emotion-8 > *:first-of-type {
   margin-top: 0;
 }
 
diff --git a/lib/components/src/spaced/Spaced.js b/lib/components/src/spaced/Spaced.js
index 903b1100b85..cf31adbcba8 100644
--- a/lib/components/src/spaced/Spaced.js
+++ b/lib/components/src/spaced/Spaced.js
@@ -14,7 +14,7 @@ const Container = styled.div(
             marginLeft: col * theme.layoutMargin,
             verticalAlign: 'inherit',
           },
-          '& > *:first-child': {
+          '& > *:first-of-type': {
             marginLeft: 0,
           },
         }
@@ -22,7 +22,7 @@ const Container = styled.div(
           '& > *': {
             marginTop: row * theme.layoutMargin,
           },
-          '& > *:first-child': {
+          '& > *:first-of-type': {
             marginTop: 0,
           },
         },
diff --git a/lib/components/src/spaced/Spaced.stories.js b/lib/components/src/spaced/Spaced.stories.js
index 27e47d8f511..779624b041c 100644
--- a/lib/components/src/spaced/Spaced.stories.js
+++ b/lib/components/src/spaced/Spaced.stories.js
@@ -1,4 +1,4 @@
-import React, { div } from 'react';
+import React from 'react';
 import { storiesOf } from '@storybook/react';
 import { styled } from '@storybook/theming';
 
diff --git a/lib/components/src/spaced/__snapshots__/Spaced.stories.storyshot b/lib/components/src/spaced/__snapshots__/Spaced.stories.storyshot
index dfb825c2d51..38ceb1d92be 100644
--- a/lib/components/src/spaced/__snapshots__/Spaced.stories.storyshot
+++ b/lib/components/src/spaced/__snapshots__/Spaced.stories.storyshot
@@ -17,7 +17,7 @@ exports[`Storyshots Basics|Spaced col 1`] = `
   vertical-align: inherit;
 }
 
-.emotion-4 > *:first-child {
+.emotion-4 > *:first-of-type {
   margin-left: 0;
 }
 
@@ -77,7 +77,7 @@ exports[`Storyshots Basics|Spaced col outer 1`] = `
   vertical-align: inherit;
 }
 
-.emotion-4 > *:first-child {
+.emotion-4 > *:first-of-type {
   margin-left: 0;
 }
 
@@ -111,7 +111,7 @@ exports[`Storyshots Basics|Spaced row 1`] = `
   margin-top: 10px;
 }
 
-.emotion-4 > *:first-child {
+.emotion-4 > *:first-of-type {
   margin-top: 0;
 }
 
@@ -170,7 +170,7 @@ exports[`Storyshots Basics|Spaced row multiply 1`] = `
   margin-top: 30px;
 }
 
-.emotion-4 > *:first-child {
+.emotion-4 > *:first-of-type {
   margin-top: 0;
 }
 
@@ -219,7 +219,7 @@ exports[`Storyshots Basics|Spaced row outer 1`] = `
   margin-top: 10px;
 }
 
-.emotion-4 > *:first-child {
+.emotion-4 > *:first-of-type {
   margin-top: 0;
 }
 
diff --git a/lib/components/src/tabs/__snapshots__/tabs.stories.storyshot b/lib/components/src/tabs/__snapshots__/tabs.stories.storyshot
index cc872571d38..e1690b24bf7 100644
--- a/lib/components/src/tabs/__snapshots__/tabs.stories.storyshot
+++ b/lib/components/src/tabs/__snapshots__/tabs.stories.storyshot
@@ -1,32 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Storyshots Basics|Tabs stateful - dynamic 1`] = `
-.emotion-7 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-}
-
-.emotion-7 > * {
-  margin-left: 15px;
-}
-
-.emotion-6 {
-  white-space: nowrap;
-  height: 100%;
-  padding-bottom: 50px;
-  overflow-x: visisble;
-  overflow-y: visisble;
-}
-
-.emotion-6:first-child {
-  margin-left: 0;
-}
-
 .emotion-2 {
   white-space: normal;
   display: -webkit-inline-box;
@@ -72,1620 +46,62 @@ exports[`Storyshots Basics|Tabs stateful - dynamic 1`] = `
   border-bottom-color: #1EA7FD;
 }
 
-.emotion-11 {
-  display: block;
-}
-
-.emotion-8 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-pack: justify;
-  -webkit-justify-content: space-between;
-  -ms-flex-pack: justify;
-  justify-content: space-between;
-  color: #999999;
-  height: 40px;
-  position: relative;
-  overflow: visible;
-  overflow-x: visible;
-  overflow-y: visible;
-  background: undefined linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
-}
-
-.emotion-0 {
-  white-space: normal;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding: 0 15px;
-  text-transform: capitalize;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  height: 40px;
-  line-height: 12px;
-  cursor: pointer;
-  background: transparent;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  font-weight: bold;
-  font-size: 13px;
-  color: inherit;
-  border-bottom-color: transparent;
-}
-
-.emotion-0:empty {
-  display: none;
-}
-
-.emotion-0:focus {
-  outline: 0 none;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-10 {
-  display: block;
-  position: relative;
-  font-size: 13px;
-}
-
-.emotion-9 {
-  display: none;
-}
-
-<div
-  style="height:calc(100vh - 20px)"
->
-  <div
-    class="emotion-11"
-  >
-    <div
-      class="emotion-8"
-    >
-      <div
-        class="emotion-7"
-      >
-        <div
-          class="emotion-6"
-          role="tablist"
-        >
-          <button
-            class="emotion-0"
-            role="tab"
-            type="button"
-          >
-            Tab title #1
-          </button>
-          <button
-            class="emotion-0"
-            role="tab"
-            type="button"
-          >
-            Tab title #2
-          </button>
-          <button
-            class="emotion-2"
-            role="tab"
-            type="button"
-          >
-            Tab with scroll!
-          </button>
-          <button
-            class="emotion-0"
-            role="tab"
-            type="button"
-          >
-            Tab title #4
-          </button>
-          <button
-            class="emotion-0"
-            role="tab"
-            type="button"
-          >
-            Tab title #5
-          </button>
-          <button
-            class="emotion-0"
-            role="tab"
-            type="button"
-          >
-            Tab title #6
-          </button>
-        </div>
-      </div>
-    </div>
-    <div
-      class="emotion-10"
-    >
-      <div
-        id="test2"
-        style="background:hotpink;min-height:100%;display:none"
-      >
-        CONTENT 2
-      </div>
-      <div
-        id="test3"
-      >
-        <div
-          style="background:#000000;height:30.8px"
-        />
-        <div
-          style="background:#111111;height:31.3px"
-        />
-        <div
-          style="background:#222222;height:32.1px"
-        />
-        <div
-          style="background:#333333;height:33.4px"
-        />
-        <div
-          style="background:#444444;height:35.5px"
-        />
-        <div
-          style="background:#555555;height:38.9px"
-        />
-        <div
-          style="background:#666666;height:44.4px"
-        />
-        <div
-          style="background:#777777;height:53.3px"
-        />
-        <div
-          style="background:#888888;height:67.7px"
-        />
-        <div
-          style="background:#999999;height:91px"
-        />
-        <div
-          style="background:#aaaaaa;height:128.7px"
-        />
-        <div
-          style="background:#bbbbbb;height:189.7px"
-        />
-        <div
-          style="background:#cccccc;height:288.4px"
-        />
-        <div
-          style="background:#dddddd;height:448.1px"
-        />
-        <div
-          style="background:#eeeeee;height:706.5px"
-        />
-      </div>
-      <div
-        class="emotion-9"
-      >
-        <div>
-          CONTENT 6
-        </div>
-      </div>
-    </div>
-  </div>
-</div>
-`;
-
-exports[`Storyshots Basics|Tabs stateful - no initial 1`] = `
-.emotion-7 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-}
-
-.emotion-7 > * {
-  margin-left: 15px;
-}
-
-.emotion-6 {
-  white-space: nowrap;
-  height: 100%;
-  padding-bottom: 50px;
-  overflow-x: visisble;
-  overflow-y: visisble;
-}
-
-.emotion-6:first-child {
-  margin-left: 0;
-}
-
-.emotion-0 {
-  white-space: normal;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding: 0 15px;
-  text-transform: capitalize;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  height: 40px;
-  line-height: 12px;
-  cursor: pointer;
-  background: transparent;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  font-weight: bold;
-  font-size: 13px;
-  color: #1EA7FD;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-0:empty {
-  display: none;
-}
-
-.emotion-0:focus {
-  outline: 0 none;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-11 {
-  display: block;
-}
-
-.emotion-8 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-pack: justify;
-  -webkit-justify-content: space-between;
-  -ms-flex-pack: justify;
-  justify-content: space-between;
-  color: #999999;
-  height: 40px;
-  position: relative;
-  overflow: visible;
-  overflow-x: visible;
-  overflow-y: visible;
-  background: undefined linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
-}
-
-.emotion-1 {
-  white-space: normal;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding: 0 15px;
-  text-transform: capitalize;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  height: 40px;
-  line-height: 12px;
-  cursor: pointer;
-  background: transparent;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  font-weight: bold;
-  font-size: 13px;
-  color: inherit;
-  border-bottom-color: transparent;
-}
-
-.emotion-1:empty {
-  display: none;
-}
-
-.emotion-1:focus {
-  outline: 0 none;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-10 {
-  display: block;
-  position: relative;
-  font-size: 13px;
-}
-
-.emotion-9 {
-  display: none;
-}
-
-<div
-  style="height:calc(100vh - 20px)"
->
-  <div
-    class="emotion-11"
-  >
-    <div
-      class="emotion-8"
-    >
-      <div
-        class="emotion-7"
-      >
-        <div
-          class="emotion-6"
-          role="tablist"
-        >
-          <button
-            class="emotion-0"
-            role="tab"
-            type="button"
-          >
-            Tab title #1
-          </button>
-          <button
-            class="emotion-1"
-            role="tab"
-            type="button"
-          >
-            Tab title #2
-          </button>
-          <button
-            class="emotion-1"
-            role="tab"
-            type="button"
-          >
-            Tab with scroll!
-          </button>
-          <button
-            class="emotion-1"
-            role="tab"
-            type="button"
-          >
-            Tab title #4
-          </button>
-          <button
-            class="emotion-1"
-            role="tab"
-            type="button"
-          >
-            Tab title #5
-          </button>
-          <button
-            class="emotion-1"
-            role="tab"
-            type="button"
-          >
-            Tab title #6
-          </button>
-        </div>
-      </div>
-    </div>
-    <div
-      class="emotion-10"
-    >
-      <div
-        id="test1"
-      >
-        CONTENT 1
-      </div>
-      <div
-        id="test2"
-        style="background:hotpink;min-height:100%;display:none"
-      >
-        CONTENT 2
-      </div>
-      <div
-        class="emotion-9"
-      >
-        <div>
-          CONTENT 6
-        </div>
-      </div>
-    </div>
-  </div>
-</div>
-`;
-
-exports[`Storyshots Basics|Tabs stateful - static 1`] = `
-.emotion-3 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-}
-
-.emotion-3 > * {
-  margin-left: 15px;
-}
-
-.emotion-2 {
-  white-space: nowrap;
-  height: 100%;
-  padding-bottom: 50px;
-  overflow-x: visisble;
-  overflow-y: visisble;
-}
-
-.emotion-2:first-child {
-  margin-left: 0;
-}
-
-.emotion-1 {
-  white-space: normal;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding: 0 15px;
-  text-transform: capitalize;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  height: 40px;
-  line-height: 12px;
-  cursor: pointer;
-  background: transparent;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  font-weight: bold;
-  font-size: 13px;
-  color: #1EA7FD;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-1:empty {
-  display: none;
-}
-
-.emotion-1:focus {
-  outline: 0 none;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-5 {
-  display: block;
-}
-
-.emotion-4 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-pack: justify;
-  -webkit-justify-content: space-between;
-  -ms-flex-pack: justify;
-  justify-content: space-between;
-  color: #999999;
-  height: 40px;
-  position: relative;
-  overflow: visible;
-  overflow-x: visible;
-  overflow-y: visible;
-  background: undefined linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
-}
-
-.emotion-0 {
-  white-space: normal;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding: 0 15px;
-  text-transform: capitalize;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  height: 40px;
-  line-height: 12px;
-  cursor: pointer;
-  background: transparent;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  font-weight: bold;
-  font-size: 13px;
-  color: inherit;
-  border-bottom-color: transparent;
-}
-
-.emotion-0:empty {
-  display: none;
-}
-
-.emotion-0:focus {
-  outline: 0 none;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-6 {
-  display: block;
-  position: relative;
-  font-size: 13px;
-}
-
-<div
-  style="height:calc(100vh - 20px)"
->
-  <div
-    class="emotion-5"
-  >
-    <div
-      class="emotion-4"
-    >
-      <div
-        class="emotion-3"
-      >
-        <div
-          class="emotion-2"
-          role="tablist"
-        >
-          <button
-            class="emotion-0"
-            role="tab"
-            type="button"
-          >
-            With a function
-          </button>
-          <button
-            class="emotion-1"
-            role="tab"
-            type="button"
-          >
-            With markup
-          </button>
-        </div>
-      </div>
-    </div>
-    <div
-      class="emotion-6"
-    >
-      <div
-        class="emotion-5"
-        role="tabpanel"
-      >
-        <div>
-          test2 is always active (but visually hidden)
-        </div>
-      </div>
-    </div>
-  </div>
-</div>
-`;
-
-exports[`Storyshots Basics|Tabs stateless - absolute 1`] = `
-.emotion-7 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-}
-
-.emotion-7 > * {
-  margin-left: 15px;
-}
-
-.emotion-6 {
-  white-space: nowrap;
-  height: 100%;
-  padding-bottom: 50px;
-  overflow-x: visisble;
-  overflow-y: visisble;
-}
-
-.emotion-6:first-child {
-  margin-left: 0;
-}
-
-.emotion-2 {
-  white-space: normal;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding: 0 15px;
-  text-transform: capitalize;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  height: 40px;
-  line-height: 12px;
-  cursor: pointer;
-  background: transparent;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  font-weight: bold;
-  font-size: 13px;
-  color: #1EA7FD;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-2:empty {
-  display: none;
-}
-
-.emotion-2:focus {
-  outline: 0 none;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-10 {
-  display: block;
-  position: relative;
-  font-size: 13px;
-  position: relative;
-  overflow: auto;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  width: 100%;
-}
-
-.emotion-8 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-pack: justify;
-  -webkit-justify-content: space-between;
-  -ms-flex-pack: justify;
-  justify-content: space-between;
-  color: #999999;
-  height: 40px;
-  position: relative;
-  overflow: visible;
-  overflow-x: visible;
-  overflow-y: visible;
-  background: undefined linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
-}
-
-.emotion-0 {
-  white-space: normal;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding: 0 15px;
-  text-transform: capitalize;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  height: 40px;
-  line-height: 12px;
-  cursor: pointer;
-  background: transparent;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  font-weight: bold;
-  font-size: 13px;
-  color: inherit;
-  border-bottom-color: transparent;
-}
-
-.emotion-0:empty {
-  display: none;
-}
-
-.emotion-0:focus {
-  outline: 0 none;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-9 {
-  display: none;
-}
-
-.emotion-11 {
-  background-clip: padding-box;
-  border: 1px solid rgba(0,0,0,.1);
-  width: 100%;
-  height: 100%;
-  box-sizing: border-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-}
-
-<div
-  style="height:calc(100vh - 20px)"
->
-  <div
-    class="emotion-11"
-  >
-    <div
-      class="emotion-8"
-    >
-      <div
-        class="emotion-7"
-      >
-        <div
-          class="emotion-6"
-          role="tablist"
-        >
-          <button
-            class="emotion-0"
-            role="tab"
-            type="button"
-          >
-            Tab title #1
-          </button>
-          <button
-            class="emotion-0"
-            role="tab"
-            type="button"
-          >
-            Tab title #2
-          </button>
-          <button
-            class="emotion-2"
-            role="tab"
-            type="button"
-          >
-            Tab with scroll!
-          </button>
-          <button
-            class="emotion-0"
-            role="tab"
-            type="button"
-          >
-            Tab title #4
-          </button>
-          <button
-            class="emotion-0"
-            role="tab"
-            type="button"
-          >
-            Tab title #5
-          </button>
-          <button
-            class="emotion-0"
-            role="tab"
-            type="button"
-          >
-            Tab title #6
-          </button>
-        </div>
-      </div>
-    </div>
-    <div
-      class="emotion-10"
-    >
-      <div
-        id="test2"
-        style="background:hotpink;min-height:100%;display:none"
-      >
-        CONTENT 2
-      </div>
-      <div
-        id="test3"
-      >
-        <div
-          style="background:#000000;height:30.8px"
-        />
-        <div
-          style="background:#111111;height:31.3px"
-        />
-        <div
-          style="background:#222222;height:32.1px"
-        />
-        <div
-          style="background:#333333;height:33.4px"
-        />
-        <div
-          style="background:#444444;height:35.5px"
-        />
-        <div
-          style="background:#555555;height:38.9px"
-        />
-        <div
-          style="background:#666666;height:44.4px"
-        />
-        <div
-          style="background:#777777;height:53.3px"
-        />
-        <div
-          style="background:#888888;height:67.7px"
-        />
-        <div
-          style="background:#999999;height:91px"
-        />
-        <div
-          style="background:#aaaaaa;height:128.7px"
-        />
-        <div
-          style="background:#bbbbbb;height:189.7px"
-        />
-        <div
-          style="background:#cccccc;height:288.4px"
-        />
-        <div
-          style="background:#dddddd;height:448.1px"
-        />
-        <div
-          style="background:#eeeeee;height:706.5px"
-        />
-      </div>
-      <div
-        class="emotion-9"
-      >
-        <div>
-          CONTENT 6
-        </div>
-      </div>
-    </div>
-  </div>
-</div>
-`;
-
-exports[`Storyshots Basics|Tabs stateless - bordered 1`] = `
-.emotion-7 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-}
-
-.emotion-7 > * {
-  margin-left: 15px;
-}
-
-.emotion-6 {
-  white-space: nowrap;
-  height: 100%;
-  padding-bottom: 50px;
-  overflow-x: visisble;
-  overflow-y: visisble;
-}
-
-.emotion-6:first-child {
-  margin-left: 0;
-}
-
-.emotion-2 {
-  white-space: normal;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding: 0 15px;
-  text-transform: capitalize;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  height: 40px;
-  line-height: 12px;
-  cursor: pointer;
-  background: transparent;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  font-weight: bold;
-  font-size: 13px;
-  color: #1EA7FD;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-2:empty {
-  display: none;
-}
-
-.emotion-2:focus {
-  outline: 0 none;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-8 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-pack: justify;
-  -webkit-justify-content: space-between;
-  -ms-flex-pack: justify;
-  justify-content: space-between;
-  color: #999999;
-  height: 40px;
-  position: relative;
-  overflow: visible;
-  overflow-x: visible;
-  overflow-y: visible;
-  background: undefined linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
-}
-
-.emotion-0 {
-  white-space: normal;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding: 0 15px;
-  text-transform: capitalize;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  height: 40px;
-  line-height: 12px;
-  cursor: pointer;
-  background: transparent;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  font-weight: bold;
-  font-size: 13px;
-  color: inherit;
-  border-bottom-color: transparent;
-}
-
-.emotion-0:empty {
-  display: none;
-}
-
-.emotion-0:focus {
-  outline: 0 none;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-10 {
-  display: block;
-  position: relative;
-  font-size: 13px;
-}
-
-.emotion-9 {
-  display: none;
-}
-
-.emotion-11 {
-  background-clip: padding-box;
-  border: 1px solid rgba(0,0,0,.1);
-  display: block;
-}
-
-<div
-  style="height:calc(100vh - 20px)"
->
-  <div
-    class="emotion-11"
-  >
-    <div
-      class="emotion-8"
-    >
-      <div
-        class="emotion-7"
-      >
-        <div
-          class="emotion-6"
-          role="tablist"
-        >
-          <button
-            class="emotion-0"
-            role="tab"
-            type="button"
-          >
-            Tab title #1
-          </button>
-          <button
-            class="emotion-0"
-            role="tab"
-            type="button"
-          >
-            Tab title #2
-          </button>
-          <button
-            class="emotion-2"
-            role="tab"
-            type="button"
-          >
-            Tab with scroll!
-          </button>
-          <button
-            class="emotion-0"
-            role="tab"
-            type="button"
-          >
-            Tab title #4
-          </button>
-          <button
-            class="emotion-0"
-            role="tab"
-            type="button"
-          >
-            Tab title #5
-          </button>
-          <button
-            class="emotion-0"
-            role="tab"
-            type="button"
-          >
-            Tab title #6
-          </button>
-        </div>
-      </div>
-    </div>
-    <div
-      class="emotion-10"
-    >
-      <div
-        id="test2"
-        style="background:hotpink;min-height:100%;display:none"
-      >
-        CONTENT 2
-      </div>
-      <div
-        id="test3"
-      >
-        <div
-          style="background:#000000;height:30.8px"
-        />
-        <div
-          style="background:#111111;height:31.3px"
-        />
-        <div
-          style="background:#222222;height:32.1px"
-        />
-        <div
-          style="background:#333333;height:33.4px"
-        />
-        <div
-          style="background:#444444;height:35.5px"
-        />
-        <div
-          style="background:#555555;height:38.9px"
-        />
-        <div
-          style="background:#666666;height:44.4px"
-        />
-        <div
-          style="background:#777777;height:53.3px"
-        />
-        <div
-          style="background:#888888;height:67.7px"
-        />
-        <div
-          style="background:#999999;height:91px"
-        />
-        <div
-          style="background:#aaaaaa;height:128.7px"
-        />
-        <div
-          style="background:#bbbbbb;height:189.7px"
-        />
-        <div
-          style="background:#cccccc;height:288.4px"
-        />
-        <div
-          style="background:#dddddd;height:448.1px"
-        />
-        <div
-          style="background:#eeeeee;height:706.5px"
-        />
-      </div>
-      <div
-        class="emotion-9"
-      >
-        <div>
-          CONTENT 6
-        </div>
-      </div>
-    </div>
-  </div>
-</div>
-`;
-
-exports[`Storyshots Basics|Tabs stateless - empty 1`] = `
-.emotion-0 {
-  font-weight: 700;
-}
-
-.emotion-1 {
-  padding: 30px;
-  text-align: center;
-  color: #333333;
-  font-size: 13px;
-}
-
-<div
-  style="height:calc(100vh - 20px)"
->
-  <div
-    class="emotion-1"
-  >
-    <div
-      class="emotion-0"
-    >
-      Nothing found
-    </div>
-  </div>
-</div>
-`;
-
-exports[`Storyshots Basics|Tabs stateless - no scrolling 1`] = `
-.emotion-7 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-}
-
-.emotion-7 > * {
-  margin-left: 15px;
-}
-
-.emotion-6 {
-  white-space: nowrap;
-  height: 100%;
-  padding-bottom: 50px;
-  overflow-x: visisble;
-  overflow-y: visisble;
-}
-
-.emotion-6:first-child {
-  margin-left: 0;
-}
-
-.emotion-2 {
-  white-space: normal;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding: 0 15px;
-  text-transform: capitalize;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  height: 40px;
-  line-height: 12px;
-  cursor: pointer;
-  background: transparent;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  font-weight: bold;
-  font-size: 13px;
-  color: #1EA7FD;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-2:empty {
-  display: none;
-}
-
-.emotion-2:focus {
-  outline: 0 none;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-0 {
-  white-space: normal;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding: 0 15px;
-  text-transform: capitalize;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  height: 40px;
-  line-height: 12px;
-  cursor: pointer;
-  background: transparent;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  font-weight: bold;
-  font-size: 13px;
-  color: inherit;
-  border-bottom-color: transparent;
-}
-
-.emotion-0:empty {
-  display: none;
-}
-
-.emotion-0:focus {
-  outline: 0 none;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-10 {
-  display: block;
-  position: relative;
-  font-size: 13px;
-}
-
-.emotion-9 {
-  display: none;
-}
-
-.emotion-11 {
-  background-clip: padding-box;
-  border: 1px solid rgba(0,0,0,.1);
-  display: block;
-}
-
-.emotion-8 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-pack: justify;
-  -webkit-justify-content: space-between;
-  -ms-flex-pack: justify;
-  justify-content: space-between;
-  color: #999999;
-  height: 40px;
-  position: relative;
-  overflow: auto;
-  overflow-x: auto;
-  overflow-y: hidden;
-  background: undefined linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
-}
-
-<div
-  style="height:calc(100vh - 20px)"
->
-  <div
-    class="emotion-11"
-  >
-    <div
-      class="emotion-8"
-    >
-      <div
-        class="emotion-7"
-      >
-        <div
-          class="emotion-6"
-          role="tablist"
-        >
-          <button
-            class="emotion-0"
-            role="tab"
-            type="button"
-          >
-            Tab title #1
-          </button>
-          <button
-            class="emotion-0"
-            role="tab"
-            type="button"
-          >
-            Tab title #2
-          </button>
-          <button
-            class="emotion-2"
-            role="tab"
-            type="button"
-          >
-            Tab with scroll!
-          </button>
-          <button
-            class="emotion-0"
-            role="tab"
-            type="button"
-          >
-            Tab title #4
-          </button>
-          <button
-            class="emotion-0"
-            role="tab"
-            type="button"
-          >
-            Tab title #5
-          </button>
-          <button
-            class="emotion-0"
-            role="tab"
-            type="button"
-          >
-            Tab title #6
-          </button>
-        </div>
-      </div>
-    </div>
-    <div
-      class="emotion-10"
-    >
-      <div
-        id="test2"
-        style="background:hotpink;min-height:100%;display:none"
-      >
-        CONTENT 2
-      </div>
-      <div
-        id="test3"
-      >
-        <div
-          style="background:#000000;height:30.8px"
-        />
-        <div
-          style="background:#111111;height:31.3px"
-        />
-        <div
-          style="background:#222222;height:32.1px"
-        />
-        <div
-          style="background:#333333;height:33.4px"
-        />
-        <div
-          style="background:#444444;height:35.5px"
-        />
-        <div
-          style="background:#555555;height:38.9px"
-        />
-        <div
-          style="background:#666666;height:44.4px"
-        />
-        <div
-          style="background:#777777;height:53.3px"
-        />
-        <div
-          style="background:#888888;height:67.7px"
-        />
-        <div
-          style="background:#999999;height:91px"
-        />
-        <div
-          style="background:#aaaaaa;height:128.7px"
-        />
-        <div
-          style="background:#bbbbbb;height:189.7px"
-        />
-        <div
-          style="background:#cccccc;height:288.4px"
-        />
-        <div
-          style="background:#dddddd;height:448.1px"
-        />
-        <div
-          style="background:#eeeeee;height:706.5px"
-        />
-      </div>
-      <div
-        class="emotion-9"
-      >
-        <div>
-          CONTENT 6
-        </div>
-      </div>
-    </div>
-  </div>
-</div>
-`;
-
-exports[`Storyshots Basics|Tabs stateless - with tools 1`] = `
-.emotion-7 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-}
-
-.emotion-7 > * {
-  margin-left: 15px;
-}
-
-.emotion-6 {
-  white-space: nowrap;
-  height: 100%;
-  padding-bottom: 50px;
-  overflow-x: visisble;
-  overflow-y: visisble;
-}
-
-.emotion-6:first-child {
-  margin-left: 0;
-}
-
-.emotion-2 {
-  white-space: normal;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding: 0 15px;
-  text-transform: capitalize;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  height: 40px;
-  line-height: 12px;
-  cursor: pointer;
-  background: transparent;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  font-weight: bold;
-  font-size: 13px;
-  color: #1EA7FD;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-2:empty {
-  display: none;
-}
-
-.emotion-2:focus {
-  outline: 0 none;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-8 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-}
-
-.emotion-8 > * {
-  margin-right: 15px;
-}
-
 .emotion-12 {
   display: block;
 }
 
 .emotion-9 {
+  color: #999999;
+  height: 40px;
+  overflow: auto;
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
+  background: undefined linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-9::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+}
+
+.emotion-9::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-9::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-9::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
+}
+
+.emotion-8 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -1694,13 +110,34 @@ exports[`Storyshots Basics|Tabs stateless - with tools 1`] = `
   -webkit-justify-content: space-between;
   -ms-flex-pack: justify;
   justify-content: space-between;
-  color: #999999;
-  height: 40px;
   position: relative;
-  overflow: visible;
-  overflow-x: visible;
-  overflow-y: visible;
-  background: undefined linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+  white-space: nowrap;
+  height: 40px;
+}
+
+.emotion-7 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+}
+
+.emotion-7 > * {
+  margin-left: 15px;
+}
+
+.emotion-6 {
+  overflow: hidden;
+}
+
+.emotion-6:first-of-type {
+  margin-left: 0;
 }
 
 .emotion-0 {
@@ -1763,74 +200,67 @@ exports[`Storyshots Basics|Tabs stateless - with tools 1`] = `
 >
   <div
     class="emotion-12"
+    title="wrapper"
   >
     <div
       class="emotion-9"
+      title="bar"
     >
-      <div
-        class="emotion-7"
-      >
-        <div
-          class="emotion-6"
-          role="tablist"
-        >
-          <button
-            class="emotion-0"
-            role="tab"
-            type="button"
-          >
-            Tab title #1
-          </button>
-          <button
-            class="emotion-0"
-            role="tab"
-            type="button"
-          >
-            Tab title #2
-          </button>
-          <button
-            class="emotion-2"
-            role="tab"
-            type="button"
-          >
-            Tab with scroll!
-          </button>
-          <button
-            class="emotion-0"
-            role="tab"
-            type="button"
-          >
-            Tab title #4
-          </button>
-          <button
-            class="emotion-0"
-            role="tab"
-            type="button"
-          >
-            Tab title #5
-          </button>
-          <button
-            class="emotion-0"
-            role="tab"
-            type="button"
-          >
-            Tab title #6
-          </button>
-        </div>
-      </div>
       <div
         class="emotion-8"
       >
-        <button
-          type="button"
+        <div
+          class="emotion-7"
+          title="side left"
         >
-          1
-        </button>
-        <button
-          type="button"
-        >
-          2
-        </button>
+          <div
+            class="emotion-6"
+            role="tablist"
+          >
+            <button
+              class="emotion-0"
+              role="tab"
+              type="button"
+            >
+              Tab title #1
+            </button>
+            <button
+              class="emotion-0"
+              role="tab"
+              type="button"
+            >
+              Tab title #2
+            </button>
+            <button
+              class="emotion-2"
+              role="tab"
+              type="button"
+            >
+              Tab with scroll!
+            </button>
+            <button
+              class="emotion-0"
+              role="tab"
+              type="button"
+            >
+              Tab title #4
+            </button>
+            <button
+              class="emotion-0"
+              role="tab"
+              type="button"
+            >
+              Tab title #5
+            </button>
+            <button
+              class="emotion-0"
+              role="tab"
+              type="button"
+            >
+              Tab title #6
+            </button>
+          </div>
+        </div>
       </div>
     </div>
     <div
@@ -1902,3 +332,1952 @@ exports[`Storyshots Basics|Tabs stateless - with tools 1`] = `
   </div>
 </div>
 `;
+
+exports[`Storyshots Basics|Tabs stateful - no initial 1`] = `
+.emotion-0 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
+  font-size: 13px;
+  color: #1EA7FD;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-0:empty {
+  display: none;
+}
+
+.emotion-0:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-12 {
+  display: block;
+}
+
+.emotion-9 {
+  color: #999999;
+  height: 40px;
+  overflow: auto;
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
+  background: undefined linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-9::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+}
+
+.emotion-9::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-9::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-9::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
+}
+
+.emotion-8 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+  position: relative;
+  white-space: nowrap;
+  height: 40px;
+}
+
+.emotion-7 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+}
+
+.emotion-7 > * {
+  margin-left: 15px;
+}
+
+.emotion-6 {
+  overflow: hidden;
+}
+
+.emotion-6:first-of-type {
+  margin-left: 0;
+}
+
+.emotion-1 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
+  font-size: 13px;
+  color: inherit;
+  border-bottom-color: transparent;
+}
+
+.emotion-1:empty {
+  display: none;
+}
+
+.emotion-1:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-11 {
+  display: block;
+  position: relative;
+  font-size: 13px;
+}
+
+.emotion-10 {
+  display: none;
+}
+
+<div
+  style="height:calc(100vh - 20px)"
+>
+  <div
+    class="emotion-12"
+    title="wrapper"
+  >
+    <div
+      class="emotion-9"
+      title="bar"
+    >
+      <div
+        class="emotion-8"
+      >
+        <div
+          class="emotion-7"
+          title="side left"
+        >
+          <div
+            class="emotion-6"
+            role="tablist"
+          >
+            <button
+              class="emotion-0"
+              role="tab"
+              type="button"
+            >
+              Tab title #1
+            </button>
+            <button
+              class="emotion-1"
+              role="tab"
+              type="button"
+            >
+              Tab title #2
+            </button>
+            <button
+              class="emotion-1"
+              role="tab"
+              type="button"
+            >
+              Tab with scroll!
+            </button>
+            <button
+              class="emotion-1"
+              role="tab"
+              type="button"
+            >
+              Tab title #4
+            </button>
+            <button
+              class="emotion-1"
+              role="tab"
+              type="button"
+            >
+              Tab title #5
+            </button>
+            <button
+              class="emotion-1"
+              role="tab"
+              type="button"
+            >
+              Tab title #6
+            </button>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div
+      class="emotion-11"
+    >
+      <div
+        id="test1"
+      >
+        CONTENT 1
+      </div>
+      <div
+        id="test2"
+        style="background:hotpink;min-height:100%;display:none"
+      >
+        CONTENT 2
+      </div>
+      <div
+        class="emotion-10"
+      >
+        <div>
+          CONTENT 6
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+`;
+
+exports[`Storyshots Basics|Tabs stateful - static 1`] = `
+.emotion-1 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
+  font-size: 13px;
+  color: #1EA7FD;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-1:empty {
+  display: none;
+}
+
+.emotion-1:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-6 {
+  display: block;
+}
+
+.emotion-5 {
+  color: #999999;
+  height: 40px;
+  overflow: auto;
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
+  background: undefined linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-5::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+}
+
+.emotion-5::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-5::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-5::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
+}
+
+.emotion-4 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+  position: relative;
+  white-space: nowrap;
+  height: 40px;
+}
+
+.emotion-3 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+}
+
+.emotion-3 > * {
+  margin-left: 15px;
+}
+
+.emotion-2 {
+  overflow: hidden;
+}
+
+.emotion-2:first-of-type {
+  margin-left: 0;
+}
+
+.emotion-0 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
+  font-size: 13px;
+  color: inherit;
+  border-bottom-color: transparent;
+}
+
+.emotion-0:empty {
+  display: none;
+}
+
+.emotion-0:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-7 {
+  display: block;
+  position: relative;
+  font-size: 13px;
+}
+
+<div
+  style="height:calc(100vh - 20px)"
+>
+  <div
+    class="emotion-6"
+    title="wrapper"
+  >
+    <div
+      class="emotion-5"
+      title="bar"
+    >
+      <div
+        class="emotion-4"
+      >
+        <div
+          class="emotion-3"
+          title="side left"
+        >
+          <div
+            class="emotion-2"
+            role="tablist"
+          >
+            <button
+              class="emotion-0"
+              role="tab"
+              type="button"
+            >
+              With a function
+            </button>
+            <button
+              class="emotion-1"
+              role="tab"
+              type="button"
+            >
+              With markup
+            </button>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div
+      class="emotion-7"
+    >
+      <div
+        class="emotion-6"
+        role="tabpanel"
+      >
+        <div>
+          test2 is always active (but visually hidden)
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+`;
+
+exports[`Storyshots Basics|Tabs stateless - absolute 1`] = `
+.emotion-2 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
+  font-size: 13px;
+  color: #1EA7FD;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-2:empty {
+  display: none;
+}
+
+.emotion-2:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-11 {
+  display: block;
+  position: relative;
+  font-size: 13px;
+  position: relative;
+  overflow: auto;
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  width: 100%;
+}
+
+.emotion-9 {
+  color: #999999;
+  height: 40px;
+  overflow: auto;
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
+  background: undefined linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-9::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+}
+
+.emotion-9::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-9::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-9::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
+}
+
+.emotion-8 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+  position: relative;
+  white-space: nowrap;
+  height: 40px;
+}
+
+.emotion-7 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+}
+
+.emotion-7 > * {
+  margin-left: 15px;
+}
+
+.emotion-6 {
+  overflow: hidden;
+}
+
+.emotion-6:first-of-type {
+  margin-left: 0;
+}
+
+.emotion-0 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
+  font-size: 13px;
+  color: inherit;
+  border-bottom-color: transparent;
+}
+
+.emotion-0:empty {
+  display: none;
+}
+
+.emotion-0:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-10 {
+  display: none;
+}
+
+.emotion-12 {
+  background-clip: padding-box;
+  border: 1px solid rgba(0,0,0,.1);
+  width: 100%;
+  height: 100%;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+}
+
+<div
+  style="height:calc(100vh - 20px)"
+>
+  <div
+    class="emotion-12"
+    title="wrapper"
+  >
+    <div
+      class="emotion-9"
+      title="bar"
+    >
+      <div
+        class="emotion-8"
+      >
+        <div
+          class="emotion-7"
+          title="side left"
+        >
+          <div
+            class="emotion-6"
+            role="tablist"
+          >
+            <button
+              class="emotion-0"
+              role="tab"
+              type="button"
+            >
+              Tab title #1
+            </button>
+            <button
+              class="emotion-0"
+              role="tab"
+              type="button"
+            >
+              Tab title #2
+            </button>
+            <button
+              class="emotion-2"
+              role="tab"
+              type="button"
+            >
+              Tab with scroll!
+            </button>
+            <button
+              class="emotion-0"
+              role="tab"
+              type="button"
+            >
+              Tab title #4
+            </button>
+            <button
+              class="emotion-0"
+              role="tab"
+              type="button"
+            >
+              Tab title #5
+            </button>
+            <button
+              class="emotion-0"
+              role="tab"
+              type="button"
+            >
+              Tab title #6
+            </button>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div
+      class="emotion-11"
+    >
+      <div
+        id="test2"
+        style="background:hotpink;min-height:100%;display:none"
+      >
+        CONTENT 2
+      </div>
+      <div
+        id="test3"
+      >
+        <div
+          style="background:#000000;height:30.8px"
+        />
+        <div
+          style="background:#111111;height:31.3px"
+        />
+        <div
+          style="background:#222222;height:32.1px"
+        />
+        <div
+          style="background:#333333;height:33.4px"
+        />
+        <div
+          style="background:#444444;height:35.5px"
+        />
+        <div
+          style="background:#555555;height:38.9px"
+        />
+        <div
+          style="background:#666666;height:44.4px"
+        />
+        <div
+          style="background:#777777;height:53.3px"
+        />
+        <div
+          style="background:#888888;height:67.7px"
+        />
+        <div
+          style="background:#999999;height:91px"
+        />
+        <div
+          style="background:#aaaaaa;height:128.7px"
+        />
+        <div
+          style="background:#bbbbbb;height:189.7px"
+        />
+        <div
+          style="background:#cccccc;height:288.4px"
+        />
+        <div
+          style="background:#dddddd;height:448.1px"
+        />
+        <div
+          style="background:#eeeeee;height:706.5px"
+        />
+      </div>
+      <div
+        class="emotion-10"
+      >
+        <div>
+          CONTENT 6
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+`;
+
+exports[`Storyshots Basics|Tabs stateless - bordered 1`] = `
+.emotion-2 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
+  font-size: 13px;
+  color: #1EA7FD;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-2:empty {
+  display: none;
+}
+
+.emotion-2:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-9 {
+  color: #999999;
+  height: 40px;
+  overflow: auto;
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
+  background: undefined linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-9::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+}
+
+.emotion-9::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-9::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-9::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
+}
+
+.emotion-8 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+  position: relative;
+  white-space: nowrap;
+  height: 40px;
+}
+
+.emotion-7 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+}
+
+.emotion-7 > * {
+  margin-left: 15px;
+}
+
+.emotion-6 {
+  overflow: hidden;
+}
+
+.emotion-6:first-of-type {
+  margin-left: 0;
+}
+
+.emotion-0 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
+  font-size: 13px;
+  color: inherit;
+  border-bottom-color: transparent;
+}
+
+.emotion-0:empty {
+  display: none;
+}
+
+.emotion-0:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-11 {
+  display: block;
+  position: relative;
+  font-size: 13px;
+}
+
+.emotion-10 {
+  display: none;
+}
+
+.emotion-12 {
+  background-clip: padding-box;
+  border: 1px solid rgba(0,0,0,.1);
+  display: block;
+}
+
+<div
+  style="height:calc(100vh - 20px)"
+>
+  <div
+    class="emotion-12"
+    title="wrapper"
+  >
+    <div
+      class="emotion-9"
+      title="bar"
+    >
+      <div
+        class="emotion-8"
+      >
+        <div
+          class="emotion-7"
+          title="side left"
+        >
+          <div
+            class="emotion-6"
+            role="tablist"
+          >
+            <button
+              class="emotion-0"
+              role="tab"
+              type="button"
+            >
+              Tab title #1
+            </button>
+            <button
+              class="emotion-0"
+              role="tab"
+              type="button"
+            >
+              Tab title #2
+            </button>
+            <button
+              class="emotion-2"
+              role="tab"
+              type="button"
+            >
+              Tab with scroll!
+            </button>
+            <button
+              class="emotion-0"
+              role="tab"
+              type="button"
+            >
+              Tab title #4
+            </button>
+            <button
+              class="emotion-0"
+              role="tab"
+              type="button"
+            >
+              Tab title #5
+            </button>
+            <button
+              class="emotion-0"
+              role="tab"
+              type="button"
+            >
+              Tab title #6
+            </button>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div
+      class="emotion-11"
+    >
+      <div
+        id="test2"
+        style="background:hotpink;min-height:100%;display:none"
+      >
+        CONTENT 2
+      </div>
+      <div
+        id="test3"
+      >
+        <div
+          style="background:#000000;height:30.8px"
+        />
+        <div
+          style="background:#111111;height:31.3px"
+        />
+        <div
+          style="background:#222222;height:32.1px"
+        />
+        <div
+          style="background:#333333;height:33.4px"
+        />
+        <div
+          style="background:#444444;height:35.5px"
+        />
+        <div
+          style="background:#555555;height:38.9px"
+        />
+        <div
+          style="background:#666666;height:44.4px"
+        />
+        <div
+          style="background:#777777;height:53.3px"
+        />
+        <div
+          style="background:#888888;height:67.7px"
+        />
+        <div
+          style="background:#999999;height:91px"
+        />
+        <div
+          style="background:#aaaaaa;height:128.7px"
+        />
+        <div
+          style="background:#bbbbbb;height:189.7px"
+        />
+        <div
+          style="background:#cccccc;height:288.4px"
+        />
+        <div
+          style="background:#dddddd;height:448.1px"
+        />
+        <div
+          style="background:#eeeeee;height:706.5px"
+        />
+      </div>
+      <div
+        class="emotion-10"
+      >
+        <div>
+          CONTENT 6
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+`;
+
+exports[`Storyshots Basics|Tabs stateless - empty 1`] = `
+.emotion-0 {
+  font-weight: 700;
+}
+
+.emotion-1 {
+  padding: 30px;
+  text-align: center;
+  color: #333333;
+  font-size: 13px;
+}
+
+<div
+  style="height:calc(100vh - 20px)"
+>
+  <div
+    class="emotion-1"
+  >
+    <div
+      class="emotion-0"
+    >
+      Nothing found
+    </div>
+  </div>
+</div>
+`;
+
+exports[`Storyshots Basics|Tabs stateless - no scrolling 1`] = `
+.emotion-2 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
+  font-size: 13px;
+  color: #1EA7FD;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-2:empty {
+  display: none;
+}
+
+.emotion-2:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-9 {
+  color: #999999;
+  height: 40px;
+  overflow: auto;
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
+  background: undefined linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-9::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+}
+
+.emotion-9::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-9::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-9::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
+}
+
+.emotion-8 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+  position: relative;
+  white-space: nowrap;
+  height: 40px;
+}
+
+.emotion-7 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+}
+
+.emotion-7 > * {
+  margin-left: 15px;
+}
+
+.emotion-6 {
+  overflow: hidden;
+}
+
+.emotion-6:first-of-type {
+  margin-left: 0;
+}
+
+.emotion-0 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
+  font-size: 13px;
+  color: inherit;
+  border-bottom-color: transparent;
+}
+
+.emotion-0:empty {
+  display: none;
+}
+
+.emotion-0:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-11 {
+  display: block;
+  position: relative;
+  font-size: 13px;
+}
+
+.emotion-10 {
+  display: none;
+}
+
+.emotion-12 {
+  background-clip: padding-box;
+  border: 1px solid rgba(0,0,0,.1);
+  display: block;
+}
+
+<div
+  style="height:calc(100vh - 20px)"
+>
+  <div
+    class="emotion-12"
+    title="wrapper"
+  >
+    <div
+      class="emotion-9"
+      title="bar"
+    >
+      <div
+        class="emotion-8"
+      >
+        <div
+          class="emotion-7"
+          title="side left"
+        >
+          <div
+            class="emotion-6"
+            role="tablist"
+          >
+            <button
+              class="emotion-0"
+              role="tab"
+              type="button"
+            >
+              Tab title #1
+            </button>
+            <button
+              class="emotion-0"
+              role="tab"
+              type="button"
+            >
+              Tab title #2
+            </button>
+            <button
+              class="emotion-2"
+              role="tab"
+              type="button"
+            >
+              Tab with scroll!
+            </button>
+            <button
+              class="emotion-0"
+              role="tab"
+              type="button"
+            >
+              Tab title #4
+            </button>
+            <button
+              class="emotion-0"
+              role="tab"
+              type="button"
+            >
+              Tab title #5
+            </button>
+            <button
+              class="emotion-0"
+              role="tab"
+              type="button"
+            >
+              Tab title #6
+            </button>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div
+      class="emotion-11"
+    >
+      <div
+        id="test2"
+        style="background:hotpink;min-height:100%;display:none"
+      >
+        CONTENT 2
+      </div>
+      <div
+        id="test3"
+      >
+        <div
+          style="background:#000000;height:30.8px"
+        />
+        <div
+          style="background:#111111;height:31.3px"
+        />
+        <div
+          style="background:#222222;height:32.1px"
+        />
+        <div
+          style="background:#333333;height:33.4px"
+        />
+        <div
+          style="background:#444444;height:35.5px"
+        />
+        <div
+          style="background:#555555;height:38.9px"
+        />
+        <div
+          style="background:#666666;height:44.4px"
+        />
+        <div
+          style="background:#777777;height:53.3px"
+        />
+        <div
+          style="background:#888888;height:67.7px"
+        />
+        <div
+          style="background:#999999;height:91px"
+        />
+        <div
+          style="background:#aaaaaa;height:128.7px"
+        />
+        <div
+          style="background:#bbbbbb;height:189.7px"
+        />
+        <div
+          style="background:#cccccc;height:288.4px"
+        />
+        <div
+          style="background:#dddddd;height:448.1px"
+        />
+        <div
+          style="background:#eeeeee;height:706.5px"
+        />
+      </div>
+      <div
+        class="emotion-10"
+      >
+        <div>
+          CONTENT 6
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+`;
+
+exports[`Storyshots Basics|Tabs stateless - with tools 1`] = `
+.emotion-2 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
+  font-size: 13px;
+  color: #1EA7FD;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-2:empty {
+  display: none;
+}
+
+.emotion-2:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-13 {
+  display: block;
+}
+
+.emotion-10 {
+  color: #999999;
+  height: 40px;
+  overflow: auto;
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
+  background: undefined linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-10::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+}
+
+.emotion-10::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-10::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-10::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
+}
+
+.emotion-9 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+  position: relative;
+  white-space: nowrap;
+  height: 40px;
+}
+
+.emotion-7 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+}
+
+.emotion-7 > * {
+  margin-left: 15px;
+}
+
+.emotion-6 {
+  overflow: hidden;
+}
+
+.emotion-6:first-of-type {
+  margin-left: 0;
+}
+
+.emotion-0 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
+  font-size: 13px;
+  color: inherit;
+  border-bottom-color: transparent;
+}
+
+.emotion-0:empty {
+  display: none;
+}
+
+.emotion-0:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-12 {
+  display: block;
+  position: relative;
+  font-size: 13px;
+}
+
+.emotion-11 {
+  display: none;
+}
+
+.emotion-8 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  margin-left: 30px;
+}
+
+.emotion-8 > * {
+  margin-right: 15px;
+}
+
+<div
+  style="height:calc(100vh - 20px)"
+>
+  <div
+    class="emotion-13"
+    title="wrapper"
+  >
+    <div
+      class="emotion-10"
+      title="bar"
+    >
+      <div
+        class="emotion-9"
+      >
+        <div
+          class="emotion-7"
+          title="side left"
+        >
+          <div
+            class="emotion-6"
+            role="tablist"
+          >
+            <button
+              class="emotion-0"
+              role="tab"
+              type="button"
+            >
+              Tab title #1
+            </button>
+            <button
+              class="emotion-0"
+              role="tab"
+              type="button"
+            >
+              Tab title #2
+            </button>
+            <button
+              class="emotion-2"
+              role="tab"
+              type="button"
+            >
+              Tab with scroll!
+            </button>
+            <button
+              class="emotion-0"
+              role="tab"
+              type="button"
+            >
+              Tab title #4
+            </button>
+            <button
+              class="emotion-0"
+              role="tab"
+              type="button"
+            >
+              Tab title #5
+            </button>
+            <button
+              class="emotion-0"
+              role="tab"
+              type="button"
+            >
+              Tab title #6
+            </button>
+          </div>
+        </div>
+        <div
+          class="emotion-8"
+          title="side right"
+        >
+          <button
+            type="button"
+          >
+            1
+          </button>
+          <button
+            type="button"
+          >
+            2
+          </button>
+        </div>
+      </div>
+    </div>
+    <div
+      class="emotion-12"
+    >
+      <div
+        id="test2"
+        style="background:hotpink;min-height:100%;display:none"
+      >
+        CONTENT 2
+      </div>
+      <div
+        id="test3"
+      >
+        <div
+          style="background:#000000;height:30.8px"
+        />
+        <div
+          style="background:#111111;height:31.3px"
+        />
+        <div
+          style="background:#222222;height:32.1px"
+        />
+        <div
+          style="background:#333333;height:33.4px"
+        />
+        <div
+          style="background:#444444;height:35.5px"
+        />
+        <div
+          style="background:#555555;height:38.9px"
+        />
+        <div
+          style="background:#666666;height:44.4px"
+        />
+        <div
+          style="background:#777777;height:53.3px"
+        />
+        <div
+          style="background:#888888;height:67.7px"
+        />
+        <div
+          style="background:#999999;height:91px"
+        />
+        <div
+          style="background:#aaaaaa;height:128.7px"
+        />
+        <div
+          style="background:#bbbbbb;height:189.7px"
+        />
+        <div
+          style="background:#cccccc;height:288.4px"
+        />
+        <div
+          style="background:#dddddd;height:448.1px"
+        />
+        <div
+          style="background:#eeeeee;height:706.5px"
+        />
+      </div>
+      <div
+        class="emotion-11"
+      >
+        <div>
+          CONTENT 6
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+`;
diff --git a/lib/components/src/tabs/tabs.js b/lib/components/src/tabs/tabs.js
index 5c518c80839..ea1b932acc5 100644
--- a/lib/components/src/tabs/tabs.js
+++ b/lib/components/src/tabs/tabs.js
@@ -29,28 +29,13 @@ const Wrapper = styled.div(
         }
 );
 
-export const TabBar = styled.div(
-  {
-    whiteSpace: 'nowrap',
-    height: '100%',
+export const TabBar = styled.div({
+  overflow: 'hidden',
 
-    '&:first-child': {
-      marginLeft: 0,
-    },
+  '&:first-of-type': {
+    marginLeft: 0,
   },
-  ({ scroll }) => ({
-    // super lame, hiding of scrollbar
-    paddingBottom: 50,
-    overflowX: scroll ? 'auto' : 'visisble',
-    overflowY: scroll ? 'hidden' : 'visisble',
-  }),
-  ({ flex }) =>
-    flex
-      ? {
-          flex: typeof flex === 'number' ? flex : 1,
-        }
-      : {}
-);
+});
 
 const Content = styled.div(
   {
@@ -111,12 +96,12 @@ const childrenToList = (children, selected) =>
   });
 
 export const Tabs = React.memo(
-  ({ children, selected, actions, absolute, bordered, scroll, tools, id: htmlId }) => {
+  ({ children, selected, actions, absolute, bordered, tools, id: htmlId }) => {
     const list = childrenToList(children, selected);
 
     return list.length ? (
-      <Wrapper absolute={absolute} bordered={bordered} id={htmlId}>
-        <FlexBar border scroll={!scroll}>
+      <Wrapper absolute={absolute} bordered={bordered} id={htmlId} title="wrapper">
+        <FlexBar border title="flexbar">
           <TabBar role="tablist">
             {list.map(({ title, id, active }) => (
               <TabButton
@@ -154,7 +139,6 @@ Tabs.propTypes = {
   }).isRequired,
   absolute: PropTypes.bool,
   bordered: PropTypes.bool,
-  scroll: PropTypes.bool,
 };
 Tabs.defaultProps = {
   id: null,
@@ -163,7 +147,6 @@ Tabs.defaultProps = {
   selected: null,
   absolute: false,
   bordered: false,
-  scroll: true,
 };
 
 // eslint-disable-next-line react/no-multi-comp
diff --git a/lib/components/src/tooltip/TooltipMessage.js b/lib/components/src/tooltip/TooltipMessage.js
index fb98c20ac30..92c4857b80d 100644
--- a/lib/components/src/tooltip/TooltipMessage.js
+++ b/lib/components/src/tooltip/TooltipMessage.js
@@ -2,9 +2,7 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { styled } from '@storybook/theming';
 
-// import Link from '../Link';
-// TODO reenable me
-const Link = styled.a``;
+import Link from '../typography/link/link';
 
 const Title = styled.div`
   font-weight: ${props => props.theme.typography.weight.black};
diff --git a/lib/components/src/tooltip/__snapshots__/TooltipMessage.stories.storyshot b/lib/components/src/tooltip/__snapshots__/TooltipMessage.stories.storyshot
index fa1f36db222..c9f5e1161da 100644
--- a/lib/components/src/tooltip/__snapshots__/TooltipMessage.stories.storyshot
+++ b/lib/components/src/tooltip/__snapshots__/TooltipMessage.stories.storyshot
@@ -187,119 +187,52 @@ exports[`Storyshots basics/Tooltip/TooltipMessage with link 1`] = `
   cursor: pointer;
 }
 
-.emotion-8 {
-  display: inline-block;
-  z-index: 2147483647;
-  margin-bottom: 10px;
-  margin-top: 0px;
-  margin-left: 0px;
-  margin-right: 0px;
-  background: rgba(0,0,0,0.95);
-  -webkit-filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
-  filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
-  border-radius: 8px;
-  font-size: 12px;
-}
-
-.emotion-1 {
-  position: absolute;
-  border-style: solid;
-  margin-bottom: 0px;
-  margin-top: 8px;
-  margin-right: 8px;
-  margin-left: 8px;
-  bottom: -8px;
-  top: autopx;
-  right: autopx;
-  left: autopx;
-  border-bottom-width: 0px;
-  border-top-width: 8px;
-  border-right-width: 8px;
-  border-left-width: 8px;
-  border-top-color: rgba(0,0,0,0.95);
-  border-bottom-color: transparent;
-  border-left-color: transparent;
-  border-right-color: transparent;
-}
-
-.emotion-7 {
-  padding: 15px;
-  width: 280px;
-  box-sizing: border-box;
-}
-
-.emotion-4 {
-  color: #444444;
-  line-height: 18px;
-}
-
-.emotion-2 {
-  font-weight: 900;
-}
-
 .emotion-6 {
-  margin-top: 8px;
-  text-align: center;
-}
-
-.emotion-6 > * {
-  margin: 0 8px;
-  font-weight: 900;
-}
-
-<div
-  style="height:300px"
->
-  <div
-    class="emotion-0"
-  >
-    <div>
-      Tooltip
-    </div>
-  </div>
-  <div
-    class="emotion-8"
-    style="position:absolute;top:0;left:0;opacity:0;pointer-events:none"
-  >
-    <div
-      class="emotion-1"
-    />
-    <div
-      class="emotion-7"
-    >
-      <div
-        class="emotion-4"
-      >
-        <div
-          class="emotion-2"
-        >
-          Lorem ipsum dolor sit
-        </div>
-        <span
-          class="emotion-3"
-        >
-          Amet consectatur vestibulum concet durum politu coret weirom
-        </span>
-      </div>
-      <div
-        class="emotion-6"
-      >
-        <a
-          class="emotion-3"
-          href="test"
-        >
-          Continue
-        </a>
-      </div>
-    </div>
-  </div>
-</div>
-`;
-
-exports[`Storyshots basics/Tooltip/TooltipMessage with links 1`] = `
-.emotion-0 {
   display: inline-block;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: #1EA7FD;
+}
+
+.emotion-6 svg path {
+  fill: #1EA7FD;
+}
+
+.emotion-6:hover,
+.emotion-6:focus {
   cursor: pointer;
+  -webkit-transform: translate3d(0,-1px,0);
+  -ms-transform: translate3d(0,-1px,0);
+  transform: translate3d(0,-1px,0);
+  color: #0297f5;
+}
+
+.emotion-6:hover svg path,
+.emotion-6:focus svg path {
+  fill: #0297f5;
+}
+
+.emotion-6:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  color: #028ee6;
+}
+
+.emotion-6:active svg path {
+  fill: #028ee6;
+}
+
+.emotion-6 svg {
+  display: inline-block;
+  height: 1em;
+  width: 1em;
+  vertical-align: text-top;
+  position: relative;
+  bottom: -0.125em;
+  margin-right: 0.4em;
 }
 
 .emotion-9 {
@@ -400,16 +333,191 @@ exports[`Storyshots basics/Tooltip/TooltipMessage with links 1`] = `
         class="emotion-7"
       >
         <a
-          class="emotion-3"
+          class="emotion-6"
           href="test"
         >
-          Get more tips
-        </a>
-        <a
-          class="emotion-3"
-          href="test"
-        >
-          Done
+          <span
+            class="emotion-5"
+          >
+            Continue
+          </span>
+        </a>
+      </div>
+    </div>
+  </div>
+</div>
+`;
+
+exports[`Storyshots basics/Tooltip/TooltipMessage with links 1`] = `
+.emotion-0 {
+  display: inline-block;
+  cursor: pointer;
+}
+
+.emotion-6 {
+  display: inline-block;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: #1EA7FD;
+}
+
+.emotion-6 svg path {
+  fill: #1EA7FD;
+}
+
+.emotion-6:hover,
+.emotion-6:focus {
+  cursor: pointer;
+  -webkit-transform: translate3d(0,-1px,0);
+  -ms-transform: translate3d(0,-1px,0);
+  transform: translate3d(0,-1px,0);
+  color: #0297f5;
+}
+
+.emotion-6:hover svg path,
+.emotion-6:focus svg path {
+  fill: #0297f5;
+}
+
+.emotion-6:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  color: #028ee6;
+}
+
+.emotion-6:active svg path {
+  fill: #028ee6;
+}
+
+.emotion-6 svg {
+  display: inline-block;
+  height: 1em;
+  width: 1em;
+  vertical-align: text-top;
+  position: relative;
+  bottom: -0.125em;
+  margin-right: 0.4em;
+}
+
+.emotion-11 {
+  display: inline-block;
+  z-index: 2147483647;
+  margin-bottom: 10px;
+  margin-top: 0px;
+  margin-left: 0px;
+  margin-right: 0px;
+  background: rgba(0,0,0,0.95);
+  -webkit-filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
+  filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
+  border-radius: 8px;
+  font-size: 12px;
+}
+
+.emotion-1 {
+  position: absolute;
+  border-style: solid;
+  margin-bottom: 0px;
+  margin-top: 8px;
+  margin-right: 8px;
+  margin-left: 8px;
+  bottom: -8px;
+  top: autopx;
+  right: autopx;
+  left: autopx;
+  border-bottom-width: 0px;
+  border-top-width: 8px;
+  border-right-width: 8px;
+  border-left-width: 8px;
+  border-top-color: rgba(0,0,0,0.95);
+  border-bottom-color: transparent;
+  border-left-color: transparent;
+  border-right-color: transparent;
+}
+
+.emotion-10 {
+  padding: 15px;
+  width: 280px;
+  box-sizing: border-box;
+}
+
+.emotion-4 {
+  color: #444444;
+  line-height: 18px;
+}
+
+.emotion-2 {
+  font-weight: 900;
+}
+
+.emotion-9 {
+  margin-top: 8px;
+  text-align: center;
+}
+
+.emotion-9 > * {
+  margin: 0 8px;
+  font-weight: 900;
+}
+
+<div
+  style="height:300px"
+>
+  <div
+    class="emotion-0"
+  >
+    <div>
+      Tooltip
+    </div>
+  </div>
+  <div
+    class="emotion-11"
+    style="position:absolute;top:0;left:0;opacity:0;pointer-events:none"
+  >
+    <div
+      class="emotion-1"
+    />
+    <div
+      class="emotion-10"
+    >
+      <div
+        class="emotion-4"
+      >
+        <div
+          class="emotion-2"
+        >
+          Lorem ipsum dolor sit
+        </div>
+        <span
+          class="emotion-3"
+        >
+          Amet consectatur vestibulum concet durum politu coret weirom
+        </span>
+      </div>
+      <div
+        class="emotion-9"
+      >
+        <a
+          class="emotion-6"
+          href="test"
+        >
+          <span
+            class="emotion-5"
+          >
+            Get more tips
+          </span>
+        </a>
+        <a
+          class="emotion-6"
+          href="test"
+        >
+          <span
+            class="emotion-5"
+          >
+            Done
+          </span>
         </a>
       </div>
     </div>
diff --git a/lib/components/src/tooltip/__snapshots__/WithTooltip.stories.storyshot b/lib/components/src/tooltip/__snapshots__/WithTooltip.stories.storyshot
index 61057cb5c74..06bafb3626b 100644
--- a/lib/components/src/tooltip/__snapshots__/WithTooltip.stories.storyshot
+++ b/lib/components/src/tooltip/__snapshots__/WithTooltip.stories.storyshot
@@ -159,7 +159,55 @@ exports[`Storyshots basics/Tooltip/WithTooltip simple click start open 1`] = `
   cursor: pointer;
 }
 
-.emotion-10 {
+.emotion-8 {
+  display: inline-block;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: #1EA7FD;
+}
+
+.emotion-8 svg path {
+  fill: #1EA7FD;
+}
+
+.emotion-8:hover,
+.emotion-8:focus {
+  cursor: pointer;
+  -webkit-transform: translate3d(0,-1px,0);
+  -ms-transform: translate3d(0,-1px,0);
+  transform: translate3d(0,-1px,0);
+  color: #0297f5;
+}
+
+.emotion-8:hover svg path,
+.emotion-8:focus svg path {
+  fill: #0297f5;
+}
+
+.emotion-8:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  color: #028ee6;
+}
+
+.emotion-8:active svg path {
+  fill: #028ee6;
+}
+
+.emotion-8 svg {
+  display: inline-block;
+  height: 1em;
+  width: 1em;
+  vertical-align: text-top;
+  position: relative;
+  bottom: -0.125em;
+  margin-right: 0.4em;
+}
+
+.emotion-11 {
   display: inline-block;
   z-index: 2147483647;
   margin-bottom: 10px;
@@ -194,7 +242,7 @@ exports[`Storyshots basics/Tooltip/WithTooltip simple click start open 1`] = `
   border-right-color: transparent;
 }
 
-.emotion-9 {
+.emotion-10 {
   padding: 15px;
   width: 280px;
   box-sizing: border-box;
@@ -209,21 +257,21 @@ exports[`Storyshots basics/Tooltip/WithTooltip simple click start open 1`] = `
   font-weight: 900;
 }
 
-.emotion-8 {
+.emotion-9 {
   margin-top: 8px;
   text-align: center;
 }
 
-.emotion-8 > * {
+.emotion-9 > * {
   margin: 0 8px;
   font-weight: 900;
 }
 
-.emotion-12 {
+.emotion-13 {
   height: 300px;
 }
 
-.emotion-11 {
+.emotion-12 {
   width: 500px;
   height: 500px;
   overflow-y: scroll;
@@ -243,10 +291,10 @@ exports[`Storyshots basics/Tooltip/WithTooltip simple click start open 1`] = `
 }
 
 <div
-  class="emotion-12"
+  class="emotion-13"
 >
   <div
-    class="emotion-11"
+    class="emotion-12"
   >
     <div
       class="emotion-0"
@@ -261,14 +309,14 @@ exports[`Storyshots basics/Tooltip/WithTooltip simple click start open 1`] = `
       </div>
     </div>
     <div
-      class="emotion-10"
+      class="emotion-11"
       style="position:absolute;top:0;left:0;opacity:0;pointer-events:none"
     >
       <div
         class="emotion-3"
       />
       <div
-        class="emotion-9"
+        class="emotion-10"
       >
         <div
           class="emotion-6"
@@ -285,12 +333,16 @@ exports[`Storyshots basics/Tooltip/WithTooltip simple click start open 1`] = `
           </span>
         </div>
         <div
-          class="emotion-8"
+          class="emotion-9"
         >
           <a
-            class="emotion-5"
+            class="emotion-8"
           >
-            Continue
+            <span
+              class="emotion-7"
+            >
+              Continue
+            </span>
           </a>
         </div>
       </div>
diff --git a/lib/components/src/typography/DocumentFormatting.js b/lib/components/src/typography/DocumentFormatting.js
index f0d2f741e8b..d66f4adea61 100644
--- a/lib/components/src/typography/DocumentFormatting.js
+++ b/lib/components/src/typography/DocumentFormatting.js
@@ -78,7 +78,7 @@ const Wrapper = styled.div(
 
     /* GitHub inspired Markdown styles loosely from https://gist.github.com/tuzz/3331384 */
 
-    body > *:first-child {
+    body > *:first-of-type {
       margin-top: 0 !important;
     }
 
@@ -118,13 +118,13 @@ const Wrapper = styled.div(
       position: relative;
     }
 
-    h2:first-child,
-    h1:first-child,
-    h1:first-child + h2,
-    h3:first-child,
-    h4:first-child,
-    h5:first-child,
-    h6:first-child {
+    h2:first-of-type,
+    h1:first-of-type,
+    h1:first-of-type + h2,
+    h3:first-of-type,
+    h4:first-of-type,
+    h5:first-of-type,
+    h6:first-of-type {
       margin-top: 0;
       padding-top: 0;
     }
@@ -186,35 +186,35 @@ const Wrapper = styled.div(
       padding: 0;
     }
 
-    body > h2:first-child {
+    body > h2:first-of-type {
       margin-top: 0;
       padding-top: 0;
     }
 
-    body > h1:first-child {
+    body > h1:first-of-type {
       margin-top: 0;
       padding-top: 0;
     }
 
-    body > h1:first-child + h2 {
+    body > h1:first-of-type + h2 {
       margin-top: 0;
       padding-top: 0;
     }
 
-    body > h3:first-child,
-    body > h4:first-child,
-    body > h5:first-child,
-    body > h6:first-child {
+    body > h3:first-of-type,
+    body > h4:first-of-type,
+    body > h5:first-of-type,
+    body > h6:first-of-type {
       margin-top: 0;
       padding-top: 0;
     }
 
-    a:first-child h1,
-    a:first-child h2,
-    a:first-child h3,
-    a:first-child h4,
-    a:first-child h5,
-    a:first-child h6 {
+    a:first-of-type h1,
+    a:first-of-type h2,
+    a:first-of-type h3,
+    a:first-of-type h4,
+    a:first-of-type h5,
+    a:first-of-type h6 {
       margin-top: 0;
       padding-top: 0;
     }
@@ -237,8 +237,8 @@ const Wrapper = styled.div(
       padding-left: 30px;
     }
 
-    ul :first-child,
-    ol :first-child {
+    ul :first-of-type,
+    ol :first-of-type {
       margin-top: 0;
     }
 
@@ -259,11 +259,11 @@ const Wrapper = styled.div(
       margin: 15px 0 5px;
     }
 
-    dl dt:first-child {
+    dl dt:first-of-type {
       padding: 0;
     }
 
-    dl dt > :first-child {
+    dl dt > :first-of-type {
       margin-top: 0;
     }
 
@@ -276,7 +276,7 @@ const Wrapper = styled.div(
       padding: 0 15px;
     }
 
-    dl dd > :first-child {
+    dl dd > :first-of-type {
       margin-top: 0;
     }
 
@@ -290,7 +290,7 @@ const Wrapper = styled.div(
       color: ${props.theme.color.dark};
     }
 
-    blockquote > :first-child {
+    blockquote > :first-of-type {
       margin-top: 0;
     }
 
@@ -309,7 +309,7 @@ const Wrapper = styled.div(
       padding: 0;
     }
 
-    table tr:nth-child(2n) {
+    table tr:nth-of-type(2n) {
       background-color: ${props.theme.color.lighter};
     }
 
@@ -328,8 +328,8 @@ const Wrapper = styled.div(
       padding: 6px 13px;
     }
 
-    table tr th :first-child,
-    table tr td :first-child {
+    table tr th :first-of-type,
+    table tr td :first-of-type {
       margin-top: 0;
     }
 
diff --git a/lib/components/src/typography/DocumentFormatting.stories.js b/lib/components/src/typography/DocumentFormatting.stories.js
index d6d33580e09..d9822f25c0a 100644
--- a/lib/components/src/typography/DocumentFormatting.stories.js
+++ b/lib/components/src/typography/DocumentFormatting.stories.js
@@ -1,6 +1,8 @@
 import React from 'react';
 
+import Markdown from 'markdown-to-jsx';
 import DocumentFormatting from './DocumentFormatting';
+import markdownSample from './DocumentFormattingSample.md';
 
 export default {
   Component: DocumentFormatting,
@@ -16,14 +18,15 @@ export default {
   ],
 };
 
-export const sampleDocument = () => (
-  // This is Markdown to HTML from https://markdown-it.github.io/
-  // Use by wrapping DOM in this component
+export const withMarkdown = () => (
   <DocumentFormatting>
-    <p>
-      Wrap your components in <code>DocumentFormatting</code> to get text styles for body content
-    </p>
-    <h1>h1 Heading 😎</h1>
+    <Markdown>{markdownSample}</Markdown>
+  </DocumentFormatting>
+);
+
+export const withDOM = () => (
+  <DocumentFormatting>
+    <h1>h1 Heading</h1>
     <h2>h2 Heading</h2>
     <h3>h3 Heading</h3>
     <h4>h4 Heading</h4>
@@ -183,98 +186,5 @@ export const sampleDocument = () => (
         title="The Stormtroopocat"
       />
     </p>
-    <p>Like links, Images also have a footnote style syntax</p>
-    <p>
-      <img src="https://octodex.github.com/images/dojocat.jpg" alt="Alt text" title="The Dojocat" />
-    </p>
-    <p>With a reference later in the document defining the URL location:</p>
-    <h2>Plugins</h2>
-    <p>
-      The killer feature of <code>markdown-it</code> is very effective support of
-      <a href="https://www.npmjs.org/browse/keyword/markdown-it-plugin">syntax plugins</a>.
-    </p>
-    <h3>
-      <a href="https://github.com/markdown-it/markdown-it-emoji">Emojies</a>
-    </h3>
-    <blockquote>
-      <p>Classic markup: 😉 :crush: 😢 :tear: 😆 😋</p>
-      <p>Shortcuts (emoticons): 😃 😦 😎 😉</p>
-    </blockquote>
-    <p>
-      see{' '}
-      <a href="https://github.com/markdown-it/markdown-it-emoji#change-output">
-        how to change output
-      </a>{' '}
-      with twemoji.
-    </p>
-    <h3>
-      <a href="https://github.com/markdown-it/markdown-it-sub">Subscript</a> /{' '}
-      <a href="https://github.com/markdown-it/markdown-it-sup">Superscript</a>
-    </h3>
-    <ul>
-      <li>
-        19<sup>th</sup>
-      </li>
-      <li>
-        H<sub>2</sub>O
-      </li>
-    </ul>
-    <h3>
-      <a href="https://github.com/markdown-it/markdown-it-deflist">Definition lists</a>
-    </h3>
-    <dl>
-      <dt>Term 1</dt>
-      <dd>
-        <p>Definition 1 with lazy continuation.</p>
-      </dd>
-      <dt>
-        Term 2 with <em>inline markup</em>
-      </dt>
-      <dd>
-        <p>Definition 2</p>
-        <pre>
-          <code> some code, part of Definition 2</code>
-        </pre>
-        <p>Third paragraph of definition 2.</p>
-      </dd>
-    </dl>
-    <p>
-      <em>Compact style:</em>
-    </p>
-    <dl>
-      <dt>Term 1</dt>
-      <dd>Definition 1</dd>
-      <dt>Term 2</dt>
-      <dd>Definition 2a</dd>
-      <dd>Definition 2b</dd>
-    </dl>
-    <p>
-      <em>Compact style:</em>
-    </p>
-    <dl>
-      <dt>Term 1</dt>
-      <dd>Definition 1</dd>
-      <dt>Term 2</dt>
-      <dd>Definition 2a</dd>
-      <dd>Definition 2b</dd>
-    </dl>
-    <h3>
-      <a href="https://github.com/markdown-it/markdown-it-abbr">Abbreviations</a>
-    </h3>
-    <p>
-      This is <abbr title="Hyper Text Markup Language">HTML</abbr> abbreviation example.
-    </p>
-    <p>
-      It converts “<abbr title="Hyper Text Markup Language">HTML</abbr>”, but keep intact partial
-      entries like “xxxHTMLyyy” and so on.
-    </p>
-    <h3>
-      <a href="https://github.com/markdown-it/markdown-it-container">Custom containers</a>
-    </h3>
-    <div className="warning">
-      <p>
-        <em>here be dragons</em>
-      </p>
-    </div>
   </DocumentFormatting>
 );
diff --git a/lib/components/src/typography/DocumentFormattingSample.md b/lib/components/src/typography/DocumentFormattingSample.md
new file mode 100644
index 00000000000..381d5f0591c
--- /dev/null
+++ b/lib/components/src/typography/DocumentFormattingSample.md
@@ -0,0 +1,125 @@
+# h1 Heading
+
+## h2 Heading
+
+### h3 Heading
+
+#### h4 Heading
+
+##### h5 Heading
+
+###### h6 Heading
+
+## Typographic replacements
+
+Enable typographer option to see result.
+
+(c) (C) (r) (R) (tm) (TM) (p) (P) +-
+
+test.. test... test..... test?..... test!....
+
+!!!!!! ???? ,, -- ---
+
+"Smartypants, double quotes" and 'single quotes'
+
+## Emphasis
+
+**This is bold text**
+
+**This is bold text**
+
+_This is italic text_
+
+_This is italic text_
+
+~~Strikethrough~~
+
+## Blockquotes
+
+> Blockquotes can also be nested...
+>
+> > ...by using additional greater-than signs right next to each other...
+> >
+> > > ...or with spaces between arrows.
+
+## Lists
+
+Unordered
+
+- Create a list by starting a line with `+`, `-`, or `*`
+- Sub-lists are made by indenting 2 spaces:
+  - Marker character change forces new list start:
+    - Ac tristique libero volutpat at
+    * Facilisis in pretium nisl aliquet
+    - Nulla volutpat aliquam velit
+- Very easy!
+
+Ordered
+
+1. Lorem ipsum dolor sit amet
+2. Consectetur adipiscing elit
+3. Integer molestie lorem at massa
+
+1) You can use sequential numbers...
+1) ...or keep all the numbers as `1.`
+
+Start numbering with offset:
+
+57. foo
+1. bar
+
+## Code
+
+Inline `code`
+
+Indented code
+
+    // Some comments
+    line 1 of code
+    line 2 of code
+    line 3 of code
+
+Block code "fences"
+
+```
+Sample text here...
+```
+
+Syntax highlighting
+
+```js
+var foo = function(bar) {
+  return bar++;
+};
+
+console.log(foo(5));
+```
+
+## Tables
+
+| Option | Description                                                               |
+| ------ | ------------------------------------------------------------------------- |
+| data   | path to data files to supply the data that will be passed into templates. |
+| engine | engine to be used for processing templates. Handlebars is the default.    |
+| ext    | extension to be used for dest files.                                      |
+
+Right aligned columns
+
+| Option |                                                               Description |
+| -----: | ------------------------------------------------------------------------: |
+|   data | path to data files to supply the data that will be passed into templates. |
+| engine |    engine to be used for processing templates. Handlebars is the default. |
+|    ext |                                      extension to be used for dest files. |
+
+## Links
+
+[link text](http://dev.nodeca.com)
+
+[link with title](http://nodeca.github.io/pica/demo/ 'title text!')
+
+Autoconverted link https://github.com/nodeca/pica (enable linkify to see)
+
+## Images
+
+![Minion](https://octodex.github.com/images/minion.png)
+![Stormtroopocat](https://octodex.github.com/images/stormtroopocat.jpg 'The Stormtroopocat')
diff --git a/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot b/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot
index 9c9f84cf70c..54550ef714f 100644
--- a/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot
+++ b/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot
@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Storyshots UI|Panel default 1`] = `
-.emotion-13 {
+.emotion-14 {
   width: 100%;
   height: 100%;
   box-sizing: border-box;
@@ -14,6 +14,57 @@ exports[`Storyshots UI|Panel default 1`] = `
   flex-direction: column;
 }
 
+.emotion-12 {
+  color: #999999;
+  height: 40px;
+  overflow: auto;
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-12::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+}
+
+.emotion-12::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-12::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-12::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
+}
+
 .emotion-11 {
   display: -webkit-box;
   display: -webkit-flex;
@@ -23,14 +74,9 @@ exports[`Storyshots UI|Panel default 1`] = `
   -webkit-justify-content: space-between;
   -ms-flex-pack: justify;
   justify-content: space-between;
-  background: #FFFFFF;
-  color: #999999;
-  height: 40px;
   position: relative;
-  overflow: visible;
-  overflow-x: visible;
-  overflow-y: visible;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+  white-space: nowrap;
+  height: 40px;
 }
 
 .emotion-3 {
@@ -38,9 +84,12 @@ exports[`Storyshots UI|Panel default 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
 }
 
 .emotion-3 > * {
@@ -48,14 +97,10 @@ exports[`Storyshots UI|Panel default 1`] = `
 }
 
 .emotion-2 {
-  white-space: nowrap;
-  height: 100%;
-  padding-bottom: 50px;
-  overflow-x: visisble;
-  overflow-y: visisble;
+  overflow: hidden;
 }
 
-.emotion-2:first-child {
+.emotion-2:first-of-type {
   margin-left: 0;
 }
 
@@ -154,6 +199,13 @@ exports[`Storyshots UI|Panel default 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  margin-left: 30px;
 }
 
 .emotion-10 > * {
@@ -195,7 +247,7 @@ exports[`Storyshots UI|Panel default 1`] = `
   fill: currentColor;
 }
 
-.emotion-12 {
+.emotion-13 {
   display: block;
   position: relative;
   font-size: 13px;
@@ -208,70 +260,78 @@ exports[`Storyshots UI|Panel default 1`] = `
 }
 
 <div
-  class="emotion-13"
+  class="emotion-14"
   id="storybook-panel-root"
+  title="wrapper"
 >
   <div
-    class="emotion-11"
+    class="emotion-12"
+    title="bar"
   >
     <div
-      class="emotion-3"
+      class="emotion-11"
     >
       <div
-        class="emotion-2"
-        role="tablist"
+        class="emotion-3"
+        title="side left"
+      >
+        <div
+          class="emotion-2"
+          role="tablist"
+        >
+          <button
+            class="emotion-0"
+            role="tab"
+            type="button"
+          >
+            Test 1
+          </button>
+          <button
+            class="emotion-1"
+            role="tab"
+            type="button"
+          >
+            Test 2
+          </button>
+        </div>
+      </div>
+      <div
+        class="emotion-10"
+        title="side right"
       >
         <button
-          class="emotion-0"
-          role="tab"
-          type="button"
+          class="emotion-6"
+          title="Change orientation"
         >
-          Test 1
+          <svg
+            class="emotion-5"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-4"
+              d="M64 167.944v688c0 22.092 17.908 40 40 40h816c22.092 0 40-17.908 40-40v-688c0-22.092-17.908-40-40-40h-816c-22.092 0-40 17.908-40 40zM880 815.944h-240v-608h240v608zM144 207.944h416v608h-416v-608zM793.296 320.118h-66.398c-17.676 0-32-14.324-32-32 0-17.674 14.328-32 32-32h66.396c17.674 0 32.002 14.326 32.002 32 0 17.672-14.324 32-32 32zM793.296 448.118h-66.398c-17.676 0-32-14.324-32-32 0-17.674 14.328-32 32-32h66.396c17.674 0 32.002 14.326 32.002 32 0 17.672-14.324 32-32 32zM793.296 576.118h-66.398c-17.676 0-32-14.324-32-32 0-17.674 14.328-32 32-32h66.396c17.674 0 32.002 14.326 32.002 32 0 17.672-14.324 32-32 32z"
+            />
+          </svg>
         </button>
         <button
-          class="emotion-1"
-          role="tab"
-          type="button"
+          class="emotion-6"
+          title="Hide addons"
         >
-          Test 2
+          <svg
+            class="emotion-5"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-4"
+              d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
+            />
+          </svg>
         </button>
       </div>
     </div>
-    <div
-      class="emotion-10"
-    >
-      <button
-        class="emotion-6"
-        title="Change orientation"
-      >
-        <svg
-          class="emotion-5"
-          viewBox="0 0 1024 1024"
-        >
-          <path
-            class="emotion-4"
-            d="M64 167.944v688c0 22.092 17.908 40 40 40h816c22.092 0 40-17.908 40-40v-688c0-22.092-17.908-40-40-40h-816c-22.092 0-40 17.908-40 40zM880 815.944h-240v-608h240v608zM144 207.944h416v608h-416v-608zM793.296 320.118h-66.398c-17.676 0-32-14.324-32-32 0-17.674 14.328-32 32-32h66.396c17.674 0 32.002 14.326 32.002 32 0 17.672-14.324 32-32 32zM793.296 448.118h-66.398c-17.676 0-32-14.324-32-32 0-17.674 14.328-32 32-32h66.396c17.674 0 32.002 14.326 32.002 32 0 17.672-14.324 32-32 32zM793.296 576.118h-66.398c-17.676 0-32-14.324-32-32 0-17.674 14.328-32 32-32h66.396c17.674 0 32.002 14.326 32.002 32 0 17.672-14.324 32-32 32z"
-          />
-        </svg>
-      </button>
-      <button
-        class="emotion-6"
-        title="Hide addons"
-      >
-        <svg
-          class="emotion-5"
-          viewBox="0 0 1024 1024"
-        >
-          <path
-            class="emotion-4"
-            d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
-          />
-        </svg>
-      </button>
-    </div>
   </div>
   <div
-    class="emotion-12"
+    class="emotion-13"
   >
     <div
       id="test2"
diff --git a/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot b/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot
index 1a9f236b6cc..94669389c56 100644
--- a/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot
+++ b/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot
@@ -2,14 +2,31 @@
 
 exports[`Storyshots UI|Preview/Preview no tabs 1`] = `
 Array [
-  .emotion-13 {
+  .emotion-22 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+  position: relative;
+  white-space: nowrap;
+  height: 40px;
+}
+
+.emotion-13 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
 }
 
 .emotion-13 > * {
@@ -21,6 +38,13 @@ Array [
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  margin-left: 30px;
 }
 
 .emotion-21 > * {
@@ -62,22 +86,24 @@ Array [
   fill: currentColor;
 }
 
-.emotion-22 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-pack: justify;
-  -webkit-justify-content: space-between;
-  -ms-flex-pack: justify;
-  justify-content: space-between;
-  background: #FFFFFF;
+.emotion-23 {
   color: #999999;
   height: 40px;
-  position: relative;
   overflow: auto;
   overflow-x: auto;
   overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
   background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
   position: absolute;
   left: 0;
@@ -90,6 +116,36 @@ Array [
   tranform: translateY(0px);
 }
 
+.emotion-23::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+}
+
+.emotion-23::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-23::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-23::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
+}
+
 .emotion-9 {
   width: 1px;
   height: 24px;
@@ -101,114 +157,121 @@ Array [
   display: none;
 }
 
-.emotion-9:first-child {
+.emotion-9:first-of-type {
   display: none;
 }
 
-.emotion-9:last-child {
+.emotion-9:last-of-type {
   display: none;
 }
 
 <div
-    class="emotion-22"
+    class="emotion-23"
+    title="bar"
   >
     <div
-      class="emotion-13"
+      class="emotion-22"
     >
-      <button
-        class="emotion-2"
-        title="Zoom in"
+      <div
+        class="emotion-13"
+        title="side left"
       >
-        <svg
-          class="emotion-1"
-          viewBox="0 0 1024 1024"
+        <button
+          class="emotion-2"
+          title="Zoom in"
         >
-          <path
-            class="emotion-0"
-            d="M220 670a316 316 0 0 1 0-450 316 316 0 0 1 450 0 316 316 0 0 1 0 450 316 316 0 0 1-450 0zm749 240L757 698a402 402 0 1 0-59 59l212 212a42 42 0 0 0 59-59zM487 604a42 42 0 0 1-84 0V487H286a42 42 0 1 1 0-84h117V286a42 42 0 1 1 84 0v117h117a42 42 0 0 1 0 84H487v117z"
-          />
-        </svg>
-      </button>
-      <button
-        class="emotion-2"
-        title="Zoom out"
+          <svg
+            class="emotion-1"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-0"
+              d="M220 670a316 316 0 0 1 0-450 316 316 0 0 1 450 0 316 316 0 0 1 0 450 316 316 0 0 1-450 0zm749 240L757 698a402 402 0 1 0-59 59l212 212a42 42 0 0 0 59-59zM487 604a42 42 0 0 1-84 0V487H286a42 42 0 1 1 0-84h117V286a42 42 0 1 1 84 0v117h117a42 42 0 0 1 0 84H487v117z"
+            />
+          </svg>
+        </button>
+        <button
+          class="emotion-2"
+          title="Zoom out"
+        >
+          <svg
+            class="emotion-1"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-0"
+              d="M757 698a402 402 0 1 0-59 59l212 212a42 42 0 0 0 59-59L757 698zM126 445a316 316 0 0 1 319-319 316 316 0 0 1 318 319 316 316 0 0 1-318 318 316 316 0 0 1-319-318zm160 42a42 42 0 1 1 0-84h318a42 42 0 0 1 0 84H286z"
+            />
+          </svg>
+        </button>
+        <button
+          class="emotion-2"
+          title="Reset zoom"
+        >
+          <svg
+            class="emotion-1"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-0"
+              d="M148 560a318 318 0 0 0 522 110 316 316 0 0 0 0-450 316 316 0 0 0-450 0c-11 11-21 22-30 34v4h47c25 0 46 21 46 46s-21 45-46 45H90c-13 0-25-6-33-14-9-9-14-20-14-33V156c0-25 20-45 45-45s45 20 45 45v32l1 1a401 401 0 0 1 623 509l212 212a42 42 0 0 1-59 59L698 757A401 401 0 0 1 65 570a42 42 0 0 1 83-10z"
+            />
+          </svg>
+        </button>
+        <span
+          class="emotion-9"
+        />
+        <button
+          class="emotion-2"
+          title="Toggle background grid"
+        >
+          <svg
+            class="emotion-1"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-0"
+              d="M437.162 552.368c-1.694-0.216-3.408-0.37-5.162-0.37h-263.978c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v264.040c0 22.094 17.91 40 40 40h263.978c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-264.044c0-20.34-15.19-37.094-34.838-39.632zM208.022 816.038v-184.040h183.978v184.040h-183.978zM437.162 128.4c-1.694-0.216-3.408-0.37-5.162-0.37h-263.978c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v263.968c0 22.094 17.91 40 40 40h263.978c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-263.972c0-20.342-15.19-37.096-34.838-39.632zM208.022 392v-183.968h183.978v183.968h-183.978zM861.212 552.368c-1.694-0.216-3.408-0.37-5.162-0.37h-264.050c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v264.040c0 22.094 17.91 40 40 40h264.048c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-264.044c0.002-20.34-15.19-37.094-34.836-39.632zM632 816.038v-184.040h184.048v184.040h-184.048zM861.212 128.4c-1.694-0.216-3.408-0.37-5.162-0.37h-264.050c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v263.968c0 22.094 17.91 40 40 40h264.048c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-263.972c0.002-20.342-15.19-37.096-34.836-39.632zM632 392v-183.968h184.048v183.968h-184.048z"
+            />
+          </svg>
+        </button>
+      </div>
+      <div
+        class="emotion-21"
+        title="side right"
       >
-        <svg
-          class="emotion-1"
-          viewBox="0 0 1024 1024"
+        <button
+          class="emotion-2"
+          title="Go full screen"
         >
-          <path
-            class="emotion-0"
-            d="M757 698a402 402 0 1 0-59 59l212 212a42 42 0 0 0 59-59L757 698zM126 445a316 316 0 0 1 319-319 316 316 0 0 1 318 319 316 316 0 0 1-318 318 316 316 0 0 1-319-318zm160 42a42 42 0 1 1 0-84h318a42 42 0 0 1 0 84H286z"
-          />
-        </svg>
-      </button>
-      <button
-        class="emotion-2"
-        title="Reset zoom"
-      >
-        <svg
-          class="emotion-1"
-          viewBox="0 0 1024 1024"
+          <svg
+            class="emotion-1"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-0"
+              d="M959.688 920.068l0.31-176c0.040-22.094-17.84-40.032-39.93-40.070-22.092-0.040-40.032 17.838-40.070 39.93l-0.142 79.672-235.734-235.732c-15.622-15.622-40.948-15.622-56.57 0s-15.622 40.948 0 56.568l235.442 235.442-78.946-0.1c-22.092-0.028-40.022 17.86-40.050 39.952-0.014 11.064 4.464 21.084 11.714 28.334 7.228 7.224 17.208 11.702 28.236 11.714l175.688 0.22c22.086 0.028 40.014-17.846 40.052-39.93zM920.178 64.228l-176-0.308c-22.094-0.040-40.032 17.84-40.070 39.93-0.040 22.092 17.838 40.032 39.93 40.070l79.672 0.14-235.732 235.734c-15.622 15.622-15.622 40.948 0 56.568s40.948 15.622 56.568 0l235.442-235.442-0.1 78.946c-0.028 22.092 17.86 40.022 39.952 40.050 11.064 0.014 21.084-4.464 28.334-11.714 7.224-7.228 11.702-17.208 11.714-28.236l0.22-175.688c0.026-22.082-17.846-40.010-39.93-40.050zM64.236 103.742l-0.308 176c-0.040 22.094 17.84 40.032 39.93 40.070 22.092 0.040 40.032-17.84 40.070-39.93l0.14-79.672 235.734 235.73c15.622 15.622 40.948 15.622 56.568 0s15.622-40.946 0-56.566l-235.442-235.442 78.946 0.098c22.092 0.028 40.022-17.86 40.050-39.95 0.014-11.066-4.464-21.086-11.714-28.336-7.228-7.222-17.208-11.7-28.236-11.714l-175.688-0.218c-22.084-0.026-40.012 17.844-40.050 39.93zM103.748 959.766l176 0.308c22.094 0.040 40.032-17.84 40.070-39.93 0.040-22.092-17.84-40.032-39.93-40.070l-79.672-0.14 235.73-235.734c15.622-15.622 15.622-40.948 0-56.568s-40.946-15.622-56.566 0l-235.442 235.442 0.098-78.946c0.028-22.092-17.86-40.022-39.95-40.050-11.066-0.014-21.086 4.464-28.336 11.714-7.222 7.228-11.7 17.208-11.714 28.236l-0.218 175.688c-0.026 22.082 17.844 40.010 39.93 40.050z"
+            />
+          </svg>
+        </button>
+        <span
+          class="emotion-9"
+        />
+        <button
+          class="emotion-2"
+          title="Open component in new tab"
         >
-          <path
-            class="emotion-0"
-            d="M148 560a318 318 0 0 0 522 110 316 316 0 0 0 0-450 316 316 0 0 0-450 0c-11 11-21 22-30 34v4h47c25 0 46 21 46 46s-21 45-46 45H90c-13 0-25-6-33-14-9-9-14-20-14-33V156c0-25 20-45 45-45s45 20 45 45v32l1 1a401 401 0 0 1 623 509l212 212a42 42 0 0 1-59 59L698 757A401 401 0 0 1 65 570a42 42 0 0 1 83-10z"
-          />
-        </svg>
-      </button>
-      <span
-        class="emotion-9"
-      />
-      <button
-        class="emotion-2"
-        title="Toggle background grid"
-      >
-        <svg
-          class="emotion-1"
-          viewBox="0 0 1024 1024"
-        >
-          <path
-            class="emotion-0"
-            d="M437.162 552.368c-1.694-0.216-3.408-0.37-5.162-0.37h-263.978c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v264.040c0 22.094 17.91 40 40 40h263.978c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-264.044c0-20.34-15.19-37.094-34.838-39.632zM208.022 816.038v-184.040h183.978v184.040h-183.978zM437.162 128.4c-1.694-0.216-3.408-0.37-5.162-0.37h-263.978c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v263.968c0 22.094 17.91 40 40 40h263.978c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-263.972c0-20.342-15.19-37.096-34.838-39.632zM208.022 392v-183.968h183.978v183.968h-183.978zM861.212 552.368c-1.694-0.216-3.408-0.37-5.162-0.37h-264.050c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v264.040c0 22.094 17.91 40 40 40h264.048c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-264.044c0.002-20.34-15.19-37.094-34.836-39.632zM632 816.038v-184.040h184.048v184.040h-184.048zM861.212 128.4c-1.694-0.216-3.408-0.37-5.162-0.37h-264.050c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v263.968c0 22.094 17.91 40 40 40h264.048c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-263.972c0.002-20.342-15.19-37.096-34.836-39.632zM632 392v-183.968h184.048v183.968h-184.048z"
-          />
-        </svg>
-      </button>
-    </div>
-    <div
-      class="emotion-21"
-    >
-      <button
-        class="emotion-2"
-        title="Go full screen"
-      >
-        <svg
-          class="emotion-1"
-          viewBox="0 0 1024 1024"
-        >
-          <path
-            class="emotion-0"
-            d="M959.688 920.068l0.31-176c0.040-22.094-17.84-40.032-39.93-40.070-22.092-0.040-40.032 17.838-40.070 39.93l-0.142 79.672-235.734-235.732c-15.622-15.622-40.948-15.622-56.57 0s-15.622 40.948 0 56.568l235.442 235.442-78.946-0.1c-22.092-0.028-40.022 17.86-40.050 39.952-0.014 11.064 4.464 21.084 11.714 28.334 7.228 7.224 17.208 11.702 28.236 11.714l175.688 0.22c22.086 0.028 40.014-17.846 40.052-39.93zM920.178 64.228l-176-0.308c-22.094-0.040-40.032 17.84-40.070 39.93-0.040 22.092 17.838 40.032 39.93 40.070l79.672 0.14-235.732 235.734c-15.622 15.622-15.622 40.948 0 56.568s40.948 15.622 56.568 0l235.442-235.442-0.1 78.946c-0.028 22.092 17.86 40.022 39.952 40.050 11.064 0.014 21.084-4.464 28.334-11.714 7.224-7.228 11.702-17.208 11.714-28.236l0.22-175.688c0.026-22.082-17.846-40.010-39.93-40.050zM64.236 103.742l-0.308 176c-0.040 22.094 17.84 40.032 39.93 40.070 22.092 0.040 40.032-17.84 40.070-39.93l0.14-79.672 235.734 235.73c15.622 15.622 40.948 15.622 56.568 0s15.622-40.946 0-56.566l-235.442-235.442 78.946 0.098c22.092 0.028 40.022-17.86 40.050-39.95 0.014-11.066-4.464-21.086-11.714-28.336-7.228-7.222-17.208-11.7-28.236-11.714l-175.688-0.218c-22.084-0.026-40.012 17.844-40.050 39.93zM103.748 959.766l176 0.308c22.094 0.040 40.032-17.84 40.070-39.93 0.040-22.092-17.84-40.032-39.93-40.070l-79.672-0.14 235.73-235.734c15.622-15.622 15.622-40.948 0-56.568s-40.946-15.622-56.566 0l-235.442 235.442 0.098-78.946c0.028-22.092-17.86-40.022-39.95-40.050-11.066-0.014-21.086 4.464-28.336 11.714-7.222 7.228-11.7 17.208-11.714 28.236l-0.218 175.688c-0.026 22.082 17.844 40.010 39.93 40.050z"
-          />
-        </svg>
-      </button>
-      <span
-        class="emotion-9"
-      />
-      <button
-        class="emotion-2"
-        title="Open component in new tab"
-      >
-        <svg
-          class="emotion-1"
-          viewBox="0 0 1024 1024"
-        >
-          <path
-            class="emotion-0"
-            d="M896.006 920c0 22.090-17.91 40-40 40h-688.006c-22.090 0-40-17.906-40-40v-549.922c-0.838-3.224-1.33-6.588-1.33-10.072 0-22.090 17.908-40.004 40-40.004h178.66c22.092 0.004 40 17.914 40 40.004 0 22.088-17.908 40-40 40h-137.33v479.996h607.998v-479.996h-138.658c-22.090 0-40-17.912-40-40 0-22.090 17.906-40.004 40-40.004h178.658c22.090 0 40 17.91 40 40v559.844c0 0.050 0.008 0.102 0.008 0.154zM665.622 200.168l-124.452-124.45c-8.042-8.042-18.65-11.912-29.186-11.674-1.612-0.034-3.222 0-4.828 0.16-0.558 0.054-1.098 0.16-1.648 0.238-0.742 0.104-1.484 0.192-2.218 0.338-0.656 0.13-1.29 0.31-1.934 0.472-0.622 0.154-1.244 0.292-1.86 0.476-0.64 0.196-1.258 0.436-1.886 0.66-0.602 0.216-1.208 0.414-1.802 0.66-0.598 0.248-1.17 0.54-1.754 0.814-0.598 0.282-1.202 0.546-1.788 0.86-0.578 0.312-1.13 0.664-1.694 1-0.552 0.332-1.116 0.644-1.654 1.006-0.67 0.448-1.3 0.942-1.942 1.426-0.394 0.302-0.806 0.576-1.196 0.894-1.046 0.858-2.052 1.768-3.008 2.726l-124.398 124.39c-15.622 15.62-15.618 40.948 0.002 56.57 15.622 15.62 40.95 15.62 56.568 0l56.164-56.166v439.426c0 22.094 17.912 40 40.002 40 22.092 0 40-17.91 40-40v-441.202l57.942 57.942c15.622 15.624 40.948 15.62 56.568 0 15.626-15.618 15.626-40.946 0.002-56.566z"
-          />
-        </svg>
-      </button>
+          <svg
+            class="emotion-1"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-0"
+              d="M896.006 920c0 22.090-17.91 40-40 40h-688.006c-22.090 0-40-17.906-40-40v-549.922c-0.838-3.224-1.33-6.588-1.33-10.072 0-22.090 17.908-40.004 40-40.004h178.66c22.092 0.004 40 17.914 40 40.004 0 22.088-17.908 40-40 40h-137.33v479.996h607.998v-479.996h-138.658c-22.090 0-40-17.912-40-40 0-22.090 17.906-40.004 40-40.004h178.658c22.090 0 40 17.91 40 40v559.844c0 0.050 0.008 0.102 0.008 0.154zM665.622 200.168l-124.452-124.45c-8.042-8.042-18.65-11.912-29.186-11.674-1.612-0.034-3.222 0-4.828 0.16-0.558 0.054-1.098 0.16-1.648 0.238-0.742 0.104-1.484 0.192-2.218 0.338-0.656 0.13-1.29 0.31-1.934 0.472-0.622 0.154-1.244 0.292-1.86 0.476-0.64 0.196-1.258 0.436-1.886 0.66-0.602 0.216-1.208 0.414-1.802 0.66-0.598 0.248-1.17 0.54-1.754 0.814-0.598 0.282-1.202 0.546-1.788 0.86-0.578 0.312-1.13 0.664-1.694 1-0.552 0.332-1.116 0.644-1.654 1.006-0.67 0.448-1.3 0.942-1.942 1.426-0.394 0.302-0.806 0.576-1.196 0.894-1.046 0.858-2.052 1.768-3.008 2.726l-124.398 124.39c-15.622 15.62-15.618 40.948 0.002 56.57 15.622 15.62 40.95 15.62 56.568 0l56.164-56.166v439.426c0 22.094 17.912 40 40.002 40 22.092 0 40-17.91 40-40v-441.202l57.942 57.942c15.622 15.624 40.948 15.62 56.568 0 15.626-15.618 15.626-40.946 0.002-56.566z"
+            />
+          </svg>
+        </button>
+      </div>
     </div>
   </div>,
   .emotion-2 {
@@ -284,14 +347,31 @@ Array [
 
 exports[`Storyshots UI|Preview/Preview with tabs 1`] = `
 Array [
-  .emotion-19 {
+  .emotion-28 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+  position: relative;
+  white-space: nowrap;
+  height: 40px;
+}
+
+.emotion-19 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
 }
 
 .emotion-19 > * {
@@ -299,14 +379,10 @@ Array [
 }
 
 .emotion-4 {
-  white-space: nowrap;
-  height: 100%;
-  padding-bottom: 50px;
-  overflow-x: visisble;
-  overflow-y: visisble;
+  overflow: hidden;
 }
 
-.emotion-4:first-child {
+.emotion-4:first-of-type {
   margin-left: 0;
 }
 
@@ -405,6 +481,13 @@ Array [
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  margin-left: 30px;
 }
 
 .emotion-27 > * {
@@ -446,22 +529,24 @@ Array [
   fill: currentColor;
 }
 
-.emotion-28 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-pack: justify;
-  -webkit-justify-content: space-between;
-  -ms-flex-pack: justify;
-  justify-content: space-between;
-  background: #FFFFFF;
+.emotion-29 {
   color: #999999;
   height: 40px;
-  position: relative;
   overflow: auto;
   overflow-x: auto;
   overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
   background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
   position: absolute;
   left: 0;
@@ -474,6 +559,36 @@ Array [
   tranform: translateY(0px);
 }
 
+.emotion-29::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+}
+
+.emotion-29::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-29::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-29::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
+}
+
 .emotion-5 {
   width: 1px;
   height: 24px;
@@ -485,11 +600,11 @@ Array [
   display: none;
 }
 
-.emotion-5:first-child {
+.emotion-5:first-of-type {
   display: none;
 }
 
-.emotion-5:last-child {
+.emotion-5:last-of-type {
   display: none;
 }
 
@@ -501,132 +616,139 @@ Array [
 }
 
 <div
-    class="emotion-28"
+    class="emotion-29"
+    title="bar"
   >
     <div
-      class="emotion-19"
+      class="emotion-28"
     >
       <div
-        class="emotion-4"
+        class="emotion-19"
+        title="side left"
       >
-        <a
-          class="emotion-1"
-          href="/?path=/story/string"
+        <div
+          class="emotion-4"
         >
-          <button
-            class="emotion-0"
+          <a
+            class="emotion-1"
+            href="/?path=/story/string"
           >
-            Canvas
-          </button>
-        </a>
-        <a
-          class="emotion-1"
-          href="/?path=/info/string"
+            <button
+              class="emotion-0"
+            >
+              Canvas
+            </button>
+          </a>
+          <a
+            class="emotion-1"
+            href="/?path=/info/string"
+          >
+            <button
+              class="emotion-2"
+            >
+              Notes
+            </button>
+          </a>
+        </div>
+        <span
+          class="emotion-5"
+        />
+        <button
+          class="emotion-8"
+          title="Zoom in"
         >
-          <button
-            class="emotion-2"
+          <svg
+            class="emotion-7"
+            viewBox="0 0 1024 1024"
           >
-            Notes
-          </button>
-        </a>
+            <path
+              class="emotion-6"
+              d="M220 670a316 316 0 0 1 0-450 316 316 0 0 1 450 0 316 316 0 0 1 0 450 316 316 0 0 1-450 0zm749 240L757 698a402 402 0 1 0-59 59l212 212a42 42 0 0 0 59-59zM487 604a42 42 0 0 1-84 0V487H286a42 42 0 1 1 0-84h117V286a42 42 0 1 1 84 0v117h117a42 42 0 0 1 0 84H487v117z"
+            />
+          </svg>
+        </button>
+        <button
+          class="emotion-8"
+          title="Zoom out"
+        >
+          <svg
+            class="emotion-7"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-6"
+              d="M757 698a402 402 0 1 0-59 59l212 212a42 42 0 0 0 59-59L757 698zM126 445a316 316 0 0 1 319-319 316 316 0 0 1 318 319 316 316 0 0 1-318 318 316 316 0 0 1-319-318zm160 42a42 42 0 1 1 0-84h318a42 42 0 0 1 0 84H286z"
+            />
+          </svg>
+        </button>
+        <button
+          class="emotion-8"
+          title="Reset zoom"
+        >
+          <svg
+            class="emotion-7"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-6"
+              d="M148 560a318 318 0 0 0 522 110 316 316 0 0 0 0-450 316 316 0 0 0-450 0c-11 11-21 22-30 34v4h47c25 0 46 21 46 46s-21 45-46 45H90c-13 0-25-6-33-14-9-9-14-20-14-33V156c0-25 20-45 45-45s45 20 45 45v32l1 1a401 401 0 0 1 623 509l212 212a42 42 0 0 1-59 59L698 757A401 401 0 0 1 65 570a42 42 0 0 1 83-10z"
+            />
+          </svg>
+        </button>
+        <span
+          class="emotion-5"
+        />
+        <button
+          class="emotion-8"
+          title="Toggle background grid"
+        >
+          <svg
+            class="emotion-7"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-6"
+              d="M437.162 552.368c-1.694-0.216-3.408-0.37-5.162-0.37h-263.978c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v264.040c0 22.094 17.91 40 40 40h263.978c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-264.044c0-20.34-15.19-37.094-34.838-39.632zM208.022 816.038v-184.040h183.978v184.040h-183.978zM437.162 128.4c-1.694-0.216-3.408-0.37-5.162-0.37h-263.978c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v263.968c0 22.094 17.91 40 40 40h263.978c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-263.972c0-20.342-15.19-37.096-34.838-39.632zM208.022 392v-183.968h183.978v183.968h-183.978zM861.212 552.368c-1.694-0.216-3.408-0.37-5.162-0.37h-264.050c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v264.040c0 22.094 17.91 40 40 40h264.048c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-264.044c0.002-20.34-15.19-37.094-34.836-39.632zM632 816.038v-184.040h184.048v184.040h-184.048zM861.212 128.4c-1.694-0.216-3.408-0.37-5.162-0.37h-264.050c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v263.968c0 22.094 17.91 40 40 40h264.048c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-263.972c0.002-20.342-15.19-37.096-34.836-39.632zM632 392v-183.968h184.048v183.968h-184.048z"
+            />
+          </svg>
+        </button>
       </div>
-      <span
-        class="emotion-5"
-      />
-      <button
-        class="emotion-8"
-        title="Zoom in"
+      <div
+        class="emotion-27"
+        title="side right"
       >
-        <svg
-          class="emotion-7"
-          viewBox="0 0 1024 1024"
+        <button
+          class="emotion-8"
+          title="Go full screen"
         >
-          <path
-            class="emotion-6"
-            d="M220 670a316 316 0 0 1 0-450 316 316 0 0 1 450 0 316 316 0 0 1 0 450 316 316 0 0 1-450 0zm749 240L757 698a402 402 0 1 0-59 59l212 212a42 42 0 0 0 59-59zM487 604a42 42 0 0 1-84 0V487H286a42 42 0 1 1 0-84h117V286a42 42 0 1 1 84 0v117h117a42 42 0 0 1 0 84H487v117z"
-          />
-        </svg>
-      </button>
-      <button
-        class="emotion-8"
-        title="Zoom out"
-      >
-        <svg
-          class="emotion-7"
-          viewBox="0 0 1024 1024"
+          <svg
+            class="emotion-7"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-6"
+              d="M959.688 920.068l0.31-176c0.040-22.094-17.84-40.032-39.93-40.070-22.092-0.040-40.032 17.838-40.070 39.93l-0.142 79.672-235.734-235.732c-15.622-15.622-40.948-15.622-56.57 0s-15.622 40.948 0 56.568l235.442 235.442-78.946-0.1c-22.092-0.028-40.022 17.86-40.050 39.952-0.014 11.064 4.464 21.084 11.714 28.334 7.228 7.224 17.208 11.702 28.236 11.714l175.688 0.22c22.086 0.028 40.014-17.846 40.052-39.93zM920.178 64.228l-176-0.308c-22.094-0.040-40.032 17.84-40.070 39.93-0.040 22.092 17.838 40.032 39.93 40.070l79.672 0.14-235.732 235.734c-15.622 15.622-15.622 40.948 0 56.568s40.948 15.622 56.568 0l235.442-235.442-0.1 78.946c-0.028 22.092 17.86 40.022 39.952 40.050 11.064 0.014 21.084-4.464 28.334-11.714 7.224-7.228 11.702-17.208 11.714-28.236l0.22-175.688c0.026-22.082-17.846-40.010-39.93-40.050zM64.236 103.742l-0.308 176c-0.040 22.094 17.84 40.032 39.93 40.070 22.092 0.040 40.032-17.84 40.070-39.93l0.14-79.672 235.734 235.73c15.622 15.622 40.948 15.622 56.568 0s15.622-40.946 0-56.566l-235.442-235.442 78.946 0.098c22.092 0.028 40.022-17.86 40.050-39.95 0.014-11.066-4.464-21.086-11.714-28.336-7.228-7.222-17.208-11.7-28.236-11.714l-175.688-0.218c-22.084-0.026-40.012 17.844-40.050 39.93zM103.748 959.766l176 0.308c22.094 0.040 40.032-17.84 40.070-39.93 0.040-22.092-17.84-40.032-39.93-40.070l-79.672-0.14 235.73-235.734c15.622-15.622 15.622-40.948 0-56.568s-40.946-15.622-56.566 0l-235.442 235.442 0.098-78.946c0.028-22.092-17.86-40.022-39.95-40.050-11.066-0.014-21.086 4.464-28.336 11.714-7.222 7.228-11.7 17.208-11.714 28.236l-0.218 175.688c-0.026 22.082 17.844 40.010 39.93 40.050z"
+            />
+          </svg>
+        </button>
+        <span
+          class="emotion-5"
+        />
+        <button
+          class="emotion-8"
+          title="Open component in new tab"
         >
-          <path
-            class="emotion-6"
-            d="M757 698a402 402 0 1 0-59 59l212 212a42 42 0 0 0 59-59L757 698zM126 445a316 316 0 0 1 319-319 316 316 0 0 1 318 319 316 316 0 0 1-318 318 316 316 0 0 1-319-318zm160 42a42 42 0 1 1 0-84h318a42 42 0 0 1 0 84H286z"
-          />
-        </svg>
-      </button>
-      <button
-        class="emotion-8"
-        title="Reset zoom"
-      >
-        <svg
-          class="emotion-7"
-          viewBox="0 0 1024 1024"
-        >
-          <path
-            class="emotion-6"
-            d="M148 560a318 318 0 0 0 522 110 316 316 0 0 0 0-450 316 316 0 0 0-450 0c-11 11-21 22-30 34v4h47c25 0 46 21 46 46s-21 45-46 45H90c-13 0-25-6-33-14-9-9-14-20-14-33V156c0-25 20-45 45-45s45 20 45 45v32l1 1a401 401 0 0 1 623 509l212 212a42 42 0 0 1-59 59L698 757A401 401 0 0 1 65 570a42 42 0 0 1 83-10z"
-          />
-        </svg>
-      </button>
-      <span
-        class="emotion-5"
-      />
-      <button
-        class="emotion-8"
-        title="Toggle background grid"
-      >
-        <svg
-          class="emotion-7"
-          viewBox="0 0 1024 1024"
-        >
-          <path
-            class="emotion-6"
-            d="M437.162 552.368c-1.694-0.216-3.408-0.37-5.162-0.37h-263.978c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v264.040c0 22.094 17.91 40 40 40h263.978c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-264.044c0-20.34-15.19-37.094-34.838-39.632zM208.022 816.038v-184.040h183.978v184.040h-183.978zM437.162 128.4c-1.694-0.216-3.408-0.37-5.162-0.37h-263.978c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v263.968c0 22.094 17.91 40 40 40h263.978c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-263.972c0-20.342-15.19-37.096-34.838-39.632zM208.022 392v-183.968h183.978v183.968h-183.978zM861.212 552.368c-1.694-0.216-3.408-0.37-5.162-0.37h-264.050c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v264.040c0 22.094 17.91 40 40 40h264.048c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-264.044c0.002-20.34-15.19-37.094-34.836-39.632zM632 816.038v-184.040h184.048v184.040h-184.048zM861.212 128.4c-1.694-0.216-3.408-0.37-5.162-0.37h-264.050c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v263.968c0 22.094 17.91 40 40 40h264.048c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-263.972c0.002-20.342-15.19-37.096-34.836-39.632zM632 392v-183.968h184.048v183.968h-184.048z"
-          />
-        </svg>
-      </button>
-    </div>
-    <div
-      class="emotion-27"
-    >
-      <button
-        class="emotion-8"
-        title="Go full screen"
-      >
-        <svg
-          class="emotion-7"
-          viewBox="0 0 1024 1024"
-        >
-          <path
-            class="emotion-6"
-            d="M959.688 920.068l0.31-176c0.040-22.094-17.84-40.032-39.93-40.070-22.092-0.040-40.032 17.838-40.070 39.93l-0.142 79.672-235.734-235.732c-15.622-15.622-40.948-15.622-56.57 0s-15.622 40.948 0 56.568l235.442 235.442-78.946-0.1c-22.092-0.028-40.022 17.86-40.050 39.952-0.014 11.064 4.464 21.084 11.714 28.334 7.228 7.224 17.208 11.702 28.236 11.714l175.688 0.22c22.086 0.028 40.014-17.846 40.052-39.93zM920.178 64.228l-176-0.308c-22.094-0.040-40.032 17.84-40.070 39.93-0.040 22.092 17.838 40.032 39.93 40.070l79.672 0.14-235.732 235.734c-15.622 15.622-15.622 40.948 0 56.568s40.948 15.622 56.568 0l235.442-235.442-0.1 78.946c-0.028 22.092 17.86 40.022 39.952 40.050 11.064 0.014 21.084-4.464 28.334-11.714 7.224-7.228 11.702-17.208 11.714-28.236l0.22-175.688c0.026-22.082-17.846-40.010-39.93-40.050zM64.236 103.742l-0.308 176c-0.040 22.094 17.84 40.032 39.93 40.070 22.092 0.040 40.032-17.84 40.070-39.93l0.14-79.672 235.734 235.73c15.622 15.622 40.948 15.622 56.568 0s15.622-40.946 0-56.566l-235.442-235.442 78.946 0.098c22.092 0.028 40.022-17.86 40.050-39.95 0.014-11.066-4.464-21.086-11.714-28.336-7.228-7.222-17.208-11.7-28.236-11.714l-175.688-0.218c-22.084-0.026-40.012 17.844-40.050 39.93zM103.748 959.766l176 0.308c22.094 0.040 40.032-17.84 40.070-39.93 0.040-22.092-17.84-40.032-39.93-40.070l-79.672-0.14 235.73-235.734c15.622-15.622 15.622-40.948 0-56.568s-40.946-15.622-56.566 0l-235.442 235.442 0.098-78.946c0.028-22.092-17.86-40.022-39.95-40.050-11.066-0.014-21.086 4.464-28.336 11.714-7.222 7.228-11.7 17.208-11.714 28.236l-0.218 175.688c-0.026 22.082 17.844 40.010 39.93 40.050z"
-          />
-        </svg>
-      </button>
-      <span
-        class="emotion-5"
-      />
-      <button
-        class="emotion-8"
-        title="Open component in new tab"
-      >
-        <svg
-          class="emotion-7"
-          viewBox="0 0 1024 1024"
-        >
-          <path
-            class="emotion-6"
-            d="M896.006 920c0 22.090-17.91 40-40 40h-688.006c-22.090 0-40-17.906-40-40v-549.922c-0.838-3.224-1.33-6.588-1.33-10.072 0-22.090 17.908-40.004 40-40.004h178.66c22.092 0.004 40 17.914 40 40.004 0 22.088-17.908 40-40 40h-137.33v479.996h607.998v-479.996h-138.658c-22.090 0-40-17.912-40-40 0-22.090 17.906-40.004 40-40.004h178.658c22.090 0 40 17.91 40 40v559.844c0 0.050 0.008 0.102 0.008 0.154zM665.622 200.168l-124.452-124.45c-8.042-8.042-18.65-11.912-29.186-11.674-1.612-0.034-3.222 0-4.828 0.16-0.558 0.054-1.098 0.16-1.648 0.238-0.742 0.104-1.484 0.192-2.218 0.338-0.656 0.13-1.29 0.31-1.934 0.472-0.622 0.154-1.244 0.292-1.86 0.476-0.64 0.196-1.258 0.436-1.886 0.66-0.602 0.216-1.208 0.414-1.802 0.66-0.598 0.248-1.17 0.54-1.754 0.814-0.598 0.282-1.202 0.546-1.788 0.86-0.578 0.312-1.13 0.664-1.694 1-0.552 0.332-1.116 0.644-1.654 1.006-0.67 0.448-1.3 0.942-1.942 1.426-0.394 0.302-0.806 0.576-1.196 0.894-1.046 0.858-2.052 1.768-3.008 2.726l-124.398 124.39c-15.622 15.62-15.618 40.948 0.002 56.57 15.622 15.62 40.95 15.62 56.568 0l56.164-56.166v439.426c0 22.094 17.912 40 40.002 40 22.092 0 40-17.91 40-40v-441.202l57.942 57.942c15.622 15.624 40.948 15.62 56.568 0 15.626-15.618 15.626-40.946 0.002-56.566z"
-          />
-        </svg>
-      </button>
+          <svg
+            class="emotion-7"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-6"
+              d="M896.006 920c0 22.090-17.91 40-40 40h-688.006c-22.090 0-40-17.906-40-40v-549.922c-0.838-3.224-1.33-6.588-1.33-10.072 0-22.090 17.908-40.004 40-40.004h178.66c22.092 0.004 40 17.914 40 40.004 0 22.088-17.908 40-40 40h-137.33v479.996h607.998v-479.996h-138.658c-22.090 0-40-17.912-40-40 0-22.090 17.906-40.004 40-40.004h178.658c22.090 0 40 17.91 40 40v559.844c0 0.050 0.008 0.102 0.008 0.154zM665.622 200.168l-124.452-124.45c-8.042-8.042-18.65-11.912-29.186-11.674-1.612-0.034-3.222 0-4.828 0.16-0.558 0.054-1.098 0.16-1.648 0.238-0.742 0.104-1.484 0.192-2.218 0.338-0.656 0.13-1.29 0.31-1.934 0.472-0.622 0.154-1.244 0.292-1.86 0.476-0.64 0.196-1.258 0.436-1.886 0.66-0.602 0.216-1.208 0.414-1.802 0.66-0.598 0.248-1.17 0.54-1.754 0.814-0.598 0.282-1.202 0.546-1.788 0.86-0.578 0.312-1.13 0.664-1.694 1-0.552 0.332-1.116 0.644-1.654 1.006-0.67 0.448-1.3 0.942-1.942 1.426-0.394 0.302-0.806 0.576-1.196 0.894-1.046 0.858-2.052 1.768-3.008 2.726l-124.398 124.39c-15.622 15.62-15.618 40.948 0.002 56.57 15.622 15.62 40.95 15.62 56.568 0l56.164-56.166v439.426c0 22.094 17.912 40 40.002 40 22.092 0 40-17.91 40-40v-441.202l57.942 57.942c15.622 15.624 40.948 15.62 56.568 0 15.626-15.618 15.626-40.946 0.002-56.566z"
+            />
+          </svg>
+        </button>
+      </div>
     </div>
   </div>,
   .emotion-2 {
diff --git a/lib/ui/src/components/sidebar/NotificationList.stories.js b/lib/ui/src/components/sidebar/NotificationList.stories.js
index 235108f90a6..7648fe32a1d 100644
--- a/lib/ui/src/components/sidebar/NotificationList.stories.js
+++ b/lib/ui/src/components/sidebar/NotificationList.stories.js
@@ -20,5 +20,3 @@ all.storyData = { notifications };
 
 export const single = () => <NotificationList notifications={notifications.slice(0, 1)} />;
 single.storyData = { notifications: notifications.slice(0, 1) };
-
-export const empty = () => <NotificationList notifications={[]} />;
diff --git a/lib/ui/src/components/sidebar/SidebarHeading.js b/lib/ui/src/components/sidebar/SidebarHeading.js
index b45abadf499..8d129b0e811 100644
--- a/lib/ui/src/components/sidebar/SidebarHeading.js
+++ b/lib/ui/src/components/sidebar/SidebarHeading.js
@@ -35,6 +35,7 @@ const LogoLink = styled.a(
 const MenuButton = styled(Button)(props => ({
   position: 'relative',
   overflow: 'visible',
+  padding: 7,
 
   ...(props.highlighted && {
     '&:after': {
diff --git a/lib/ui/src/settings/__snapshots__/about.stories.storyshot b/lib/ui/src/settings/__snapshots__/about.stories.storyshot
index 7937df77314..30c0ace51be 100644
--- a/lib/ui/src/settings/__snapshots__/about.stories.storyshot
+++ b/lib/ui/src/settings/__snapshots__/about.stories.storyshot
@@ -1,156 +1,208 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Storyshots UI|Settings/AboutScreen failed to fetch new version 1`] = `
+.emotion-26 {
+  width: 100%;
+  height: 100%;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+}
+
+.emotion-8 {
+  color: #999999;
+  height: 40px;
+  overflow: auto;
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-8::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+}
+
+.emotion-8::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-8::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-8::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
+}
+
+.emotion-7 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+  position: relative;
+  white-space: nowrap;
+  height: 40px;
+}
+
+.emotion-2 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+}
+
+.emotion-2 > * {
+  margin-left: 15px;
+}
+
+.emotion-1 {
+  overflow: hidden;
+}
+
+.emotion-1:first-of-type {
+  margin-left: 0;
+}
+
+.emotion-0 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
+  font-size: 13px;
+  color: #1EA7FD;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-0:empty {
+  display: none;
+}
+
+.emotion-0:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-6 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  margin-left: 30px;
+}
+
+.emotion-6 > * {
+  margin-right: 15px;
+}
+
+.emotion-5 {
+  height: 40px;
+  background: none;
+  color: inherit;
+  padding: 0;
+  cursor: pointer;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+}
+
+.emotion-5:hover,
+.emotion-5:focus {
+  outline: 0 none;
+  color: #1EA7FD;
+}
+
+.emotion-5 > svg {
+  width: 15px;
+}
+
+.emotion-4 {
+  shape-rendering: inherit;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  display: block;
+}
+
+.emotion-3 {
+  fill: currentColor;
+}
+
 .emotion-25 {
-  width: 100%;
-  height: 100%;
-  box-sizing: border-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-}
-
-.emotion-7 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-pack: justify;
-  -webkit-justify-content: space-between;
-  -ms-flex-pack: justify;
-  justify-content: space-between;
-  background: #FFFFFF;
-  color: #999999;
-  height: 40px;
-  position: relative;
-  overflow: visible;
-  overflow-x: visible;
-  overflow-y: visible;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
-}
-
-.emotion-2 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-}
-
-.emotion-2 > * {
-  margin-left: 15px;
-}
-
-.emotion-1 {
-  white-space: nowrap;
-  height: 100%;
-  padding-bottom: 50px;
-  overflow-x: visisble;
-  overflow-y: visisble;
-}
-
-.emotion-1:first-child {
-  margin-left: 0;
-}
-
-.emotion-0 {
-  white-space: normal;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding: 0 15px;
-  text-transform: capitalize;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  height: 40px;
-  line-height: 12px;
-  cursor: pointer;
-  background: transparent;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  font-weight: bold;
-  font-size: 13px;
-  color: #1EA7FD;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-0:empty {
-  display: none;
-}
-
-.emotion-0:focus {
-  outline: 0 none;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-6 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-}
-
-.emotion-6 > * {
-  margin-right: 15px;
-}
-
-.emotion-5 {
-  height: 40px;
-  background: none;
-  color: inherit;
-  padding: 0;
-  cursor: pointer;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-}
-
-.emotion-5:hover,
-.emotion-5:focus {
-  outline: 0 none;
-  color: #1EA7FD;
-}
-
-.emotion-5 > svg {
-  width: 15px;
-}
-
-.emotion-4 {
-  shape-rendering: inherit;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  display: block;
-}
-
-.emotion-3 {
-  fill: currentColor;
-}
-
-.emotion-24 {
   display: block;
   position: relative;
   font-size: 13px;
@@ -162,646 +214,6 @@ exports[`Storyshots UI|Settings/AboutScreen failed to fetch new version 1`] = `
   width: 100%;
 }
 
-.emotion-13 {
-  display: inline-block;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  color: #1EA7FD;
-}
-
-.emotion-13 svg path {
-  fill: #1EA7FD;
-}
-
-.emotion-13:hover,
-.emotion-13:focus {
-  cursor: pointer;
-  -webkit-transform: translate3d(0,-1px,0);
-  -ms-transform: translate3d(0,-1px,0);
-  transform: translate3d(0,-1px,0);
-  color: #0297f5;
-}
-
-.emotion-13:hover svg path,
-.emotion-13:focus svg path {
-  fill: #0297f5;
-}
-
-.emotion-13:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  color: #028ee6;
-}
-
-.emotion-13:active svg path {
-  fill: #028ee6;
-}
-
-.emotion-13 svg {
-  display: inline-block;
-  height: 1em;
-  width: 1em;
-  vertical-align: text-top;
-  position: relative;
-  bottom: -0.125em;
-  margin-right: 0.4em;
-}
-
-.emotion-21 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  padding-top: 20px;
-  margin-top: 20px;
-  border-top: 1px solid rgba(0,0,0,.1);
-  font-weight: 700;
-}
-
-.emotion-21 > * + * {
-  margin-left: 20px;
-}
-
-.emotion-16 {
-  display: inline-block;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  color: #1EA7FD;
-  color: #999999;
-}
-
-.emotion-16 svg path {
-  fill: #1EA7FD;
-}
-
-.emotion-16:hover,
-.emotion-16:focus {
-  cursor: pointer;
-  -webkit-transform: translate3d(0,-1px,0);
-  -ms-transform: translate3d(0,-1px,0);
-  transform: translate3d(0,-1px,0);
-  color: #0297f5;
-}
-
-.emotion-16:hover svg path,
-.emotion-16:focus svg path {
-  fill: #0297f5;
-}
-
-.emotion-16:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  color: #028ee6;
-}
-
-.emotion-16:active svg path {
-  fill: #028ee6;
-}
-
-.emotion-16 svg {
-  display: inline-block;
-  height: 1em;
-  width: 1em;
-  vertical-align: text-top;
-  position: relative;
-  bottom: -0.125em;
-  margin-right: 0.4em;
-}
-
-.emotion-16 svg path {
-  fill: #999999;
-}
-
-.emotion-16:hover {
-  color: #666666;
-}
-
-.emotion-16:hover svg path {
-  fill: #666666;
-}
-
-.emotion-16:active {
-  color: #444444;
-}
-
-.emotion-16:active svg path {
-  fill: #444444;
-}
-
-.emotion-23 {
-  display: block;
-}
-
-.emotion-22 {
-  padding: 3rem 20px;
-  max-width: 600px;
-  margin: 0 auto;
-}
-
-.emotion-8 {
-  margin-bottom: 20px;
-  font-size: 28px;
-  font-weight: 900;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-}
-
-.emotion-8 > svg {
-  height: 32px;
-  width: auto;
-  margin-right: 8px;
-}
-
-.emotion-12 > svg:last-of-type {
-  height: 0.7em;
-  width: 0.7em;
-  margin-right: 0;
-  margin-left: 0.25em;
-  bottom: auto;
-  vertical-align: inherit;
-}
-
-.emotion-9 {
-  background: #FEDED2;
-  color: #FF4400;
-  font-weight: 700;
-  height: 40px;
-  padding: 10px 20px;
-  margin-bottom: 24px;
-  border: 1px solid rgba(0,0,0,.1);
-  text-align: center;
-}
-
-.emotion-14 {
-  font-weight: 700;
-  text-align: center;
-}
-
-<div
-  class="emotion-25"
->
-  <div
-    class="emotion-7"
-  >
-    <div
-      class="emotion-2"
-    >
-      <div
-        class="emotion-1"
-        role="tablist"
-      >
-        <button
-          class="emotion-0"
-          role="tab"
-          type="button"
-        >
-          About
-        </button>
-      </div>
-    </div>
-    <div
-      class="emotion-6"
-    >
-      <button
-        class="emotion-5"
-      >
-        <svg
-          class="emotion-4"
-          viewBox="0 0 1024 1024"
-        >
-          <path
-            class="emotion-3"
-            d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
-          />
-        </svg>
-      </button>
-    </div>
-  </div>
-  <div
-    class="emotion-24"
-  >
-    <div
-      class="emotion-23"
-      role="tabpanel"
-    >
-      <div
-        class="emotion-22"
-      >
-        <header
-          class="emotion-8"
-        >
-          <svg
-            title="Storybook icon"
-            viewBox="0 0 64 64"
-          >
-            <g
-              fill="none"
-              fill-rule="evenodd"
-              id="Artboard"
-              stroke="none"
-              stroke-width="1"
-            >
-              <path
-                d="M8.04798541,58.7875918 L6.07908839,6.32540407 C6.01406344,4.5927838 7.34257463,3.12440831 9.07303814,3.01625434 L53.6958037,0.227331489 C55.457209,0.117243658 56.974354,1.45590096 57.0844418,3.21730626 C57.0885895,3.28366922 57.0906648,3.35014546 57.0906648,3.41663791 L57.0906648,60.5834697 C57.0906648,62.3483119 55.6599776,63.7789992 53.8951354,63.7789992 C53.847325,63.7789992 53.7995207,63.7779262 53.7517585,63.775781 L11.0978899,61.8600599 C9.43669044,61.7854501 8.11034889,60.4492961 8.04798541,58.7875918 Z"
-                fill="#FF4785"
-                fill-rule="nonzero"
-                id="path-1"
-              />
-              <path
-                d="M35.9095005,24.1768792 C35.9095005,25.420127 44.2838488,24.8242707 45.4080313,23.9509748 C45.4080313,15.4847538 40.8652557,11.0358878 32.5466666,11.0358878 C24.2280775,11.0358878 19.5673077,15.553972 19.5673077,22.3311017 C19.5673077,34.1346028 35.4965208,34.3605071 35.4965208,40.7987804 C35.4965208,42.606015 34.6115646,43.6790606 32.6646607,43.6790606 C30.127786,43.6790606 29.1248356,42.3834613 29.2428298,37.9783269 C29.2428298,37.0226907 19.5673077,36.7247626 19.2723223,37.9783269 C18.5211693,48.6535354 25.1720308,51.7326752 32.7826549,51.7326752 C40.1572906,51.7326752 45.939005,47.8018145 45.939005,40.6858282 C45.939005,28.035186 29.7738035,28.3740425 29.7738035,22.1051974 C29.7738035,19.5637737 31.6617103,19.2249173 32.7826549,19.2249173 C33.9625966,19.2249173 36.0864917,19.4328883 35.9095005,24.1768792 Z"
-                fill="#FFFFFF"
-                fill-rule="nonzero"
-                id="path9_fill-path"
-              />
-              <path
-                d="M44.0461638,0.830433986 L50.1874092,0.446606143 L50.443532,7.7810017 C50.4527198,8.04410717 50.2468789,8.26484453 49.9837734,8.27403237 C49.871115,8.27796649 49.7607078,8.24184808 49.6721567,8.17209069 L47.3089847,6.3104681 L44.5110468,8.43287463 C44.3012992,8.591981 44.0022839,8.55092814 43.8431776,8.34118051 C43.7762017,8.25288717 43.742082,8.14401677 43.7466857,8.03329059 L44.0461638,0.830433986 Z"
-                fill="#FFFFFF"
-                id="Path"
-              />
-            </g>
-          </svg>
-          Storybook 5.0.0
-        </header>
-        <div
-          class="emotion-9"
-        >
-          Oops! The latest version of Storybook couldn't be fetched.
-        </div>
-        <div
-          class="emotion-14"
-        >
-          <a
-            class="emotion-13"
-            href="https://github.com/storybooks/storybook/releases"
-            target="_blank"
-          >
-            <span
-              class="emotion-12"
-            >
-              Check Storybook's release history
-              <svg
-                class="emotion-4"
-                viewBox="0 0 1024 1024"
-              >
-                <path
-                  class="emotion-3"
-                  d="M768.072 514.022c0 10.236-3.904 20.47-11.712 28.282l-344.098 344.156c-15.62 15.624-40.946 15.624-56.568 0.006-15.622-15.622-15.624-40.948-0.006-56.568l315.82-315.876-315.868-315.922c-15.618-15.624-15.618-40.952 0.004-56.568 15.624-15.62 40.95-15.618 56.57 0.006l344.144 344.204c7.81 7.81 11.714 18.044 11.714 28.28z"
-                />
-              </svg>
-            </span>
-          </a>
-        </div>
-        <div
-          class="emotion-21"
-        >
-          <a
-            class="emotion-16"
-            href="https://storybook.js.org"
-          >
-            <span
-              class="emotion-15"
-            >
-              Docs
-            </span>
-          </a>
-          <a
-            class="emotion-16"
-            href="https://github.com/storybooks/storybook"
-          >
-            <span
-              class="emotion-15"
-            >
-              GitHub
-            </span>
-          </a>
-          <a
-            class="emotion-16"
-            href="https://storybook.js.org/support"
-          >
-            <span
-              class="emotion-15"
-            >
-              Support
-            </span>
-          </a>
-        </div>
-      </div>
-    </div>
-  </div>
-</div>
-`;
-
-exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
-.emotion-41 {
-  width: 100%;
-  height: 100%;
-  box-sizing: border-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-}
-
-.emotion-7 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-pack: justify;
-  -webkit-justify-content: space-between;
-  -ms-flex-pack: justify;
-  justify-content: space-between;
-  background: #FFFFFF;
-  color: #999999;
-  height: 40px;
-  position: relative;
-  overflow: visible;
-  overflow-x: visible;
-  overflow-y: visible;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
-}
-
-.emotion-2 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-}
-
-.emotion-2 > * {
-  margin-left: 15px;
-}
-
-.emotion-1 {
-  white-space: nowrap;
-  height: 100%;
-  padding-bottom: 50px;
-  overflow-x: visisble;
-  overflow-y: visisble;
-}
-
-.emotion-1:first-child {
-  margin-left: 0;
-}
-
-.emotion-0 {
-  white-space: normal;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding: 0 15px;
-  text-transform: capitalize;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  height: 40px;
-  line-height: 12px;
-  cursor: pointer;
-  background: transparent;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  font-weight: bold;
-  font-size: 13px;
-  color: #1EA7FD;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-0:empty {
-  display: none;
-}
-
-.emotion-0:focus {
-  outline: 0 none;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-6 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-}
-
-.emotion-6 > * {
-  margin-right: 15px;
-}
-
-.emotion-5 {
-  height: 40px;
-  background: none;
-  color: inherit;
-  padding: 0;
-  cursor: pointer;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-}
-
-.emotion-5:hover,
-.emotion-5:focus {
-  outline: 0 none;
-  color: #1EA7FD;
-}
-
-.emotion-5 > svg {
-  width: 15px;
-}
-
-.emotion-4 {
-  shape-rendering: inherit;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  display: block;
-}
-
-.emotion-3 {
-  fill: currentColor;
-}
-
-.emotion-40 {
-  display: block;
-  position: relative;
-  font-size: 13px;
-  position: relative;
-  overflow: auto;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  width: 100%;
-}
-
-.emotion-37 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  padding-top: 20px;
-  margin-top: 20px;
-  border-top: 1px solid rgba(0,0,0,.1);
-  font-weight: 700;
-}
-
-.emotion-37 > * + * {
-  margin-left: 20px;
-}
-
-.emotion-32 {
-  display: inline-block;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  color: #1EA7FD;
-  color: #999999;
-}
-
-.emotion-32 svg path {
-  fill: #1EA7FD;
-}
-
-.emotion-32:hover,
-.emotion-32:focus {
-  cursor: pointer;
-  -webkit-transform: translate3d(0,-1px,0);
-  -ms-transform: translate3d(0,-1px,0);
-  transform: translate3d(0,-1px,0);
-  color: #0297f5;
-}
-
-.emotion-32:hover svg path,
-.emotion-32:focus svg path {
-  fill: #0297f5;
-}
-
-.emotion-32:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  color: #028ee6;
-}
-
-.emotion-32:active svg path {
-  fill: #028ee6;
-}
-
-.emotion-32 svg {
-  display: inline-block;
-  height: 1em;
-  width: 1em;
-  vertical-align: text-top;
-  position: relative;
-  bottom: -0.125em;
-  margin-right: 0.4em;
-}
-
-.emotion-32 svg path {
-  fill: #999999;
-}
-
-.emotion-32:hover {
-  color: #666666;
-}
-
-.emotion-32:hover svg path {
-  fill: #666666;
-}
-
-.emotion-32:active {
-  color: #444444;
-}
-
-.emotion-32:active svg path {
-  fill: #444444;
-}
-
-.emotion-39 {
-  display: block;
-}
-
-.emotion-38 {
-  padding: 3rem 20px;
-  max-width: 600px;
-  margin: 0 auto;
-}
-
-.emotion-8 {
-  margin-bottom: 20px;
-  font-size: 28px;
-  font-weight: 900;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-}
-
-.emotion-8 > svg {
-  height: 32px;
-  width: auto;
-  margin-right: 8px;
-}
-
-.emotion-15 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-pack: justify;
-  -webkit-justify-content: space-between;
-  -ms-flex-pack: justify;
-  justify-content: space-between;
-}
-
-.emotion-10 {
-  -webkit-letter-spacing: 0.35em;
-  -moz-letter-spacing: 0.35em;
-  -ms-letter-spacing: 0.35em;
-  letter-spacing: 0.35em;
-  text-transform: uppercase;
-  font-weight: 900;
-  font-size: 13px;
-  line-height: 24px;
-  color: #999999;
-}
-
 .emotion-14 {
   display: inline-block;
   -webkit-transition: all 150ms ease-out;
@@ -809,8 +221,6 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   -webkit-text-decoration: none;
   text-decoration: none;
   color: #1EA7FD;
-  color: #999999;
-  font-size: 12px;
 }
 
 .emotion-14 svg path {
@@ -852,26 +262,120 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   margin-right: 0.4em;
 }
 
-.emotion-14 svg path {
+.emotion-22 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  padding-top: 20px;
+  margin-top: 20px;
+  border-top: 1px solid rgba(0,0,0,.1);
+  font-weight: 700;
+}
+
+.emotion-22 > * + * {
+  margin-left: 20px;
+}
+
+.emotion-17 {
+  display: inline-block;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: #1EA7FD;
+  color: #999999;
+}
+
+.emotion-17 svg path {
+  fill: #1EA7FD;
+}
+
+.emotion-17:hover,
+.emotion-17:focus {
+  cursor: pointer;
+  -webkit-transform: translate3d(0,-1px,0);
+  -ms-transform: translate3d(0,-1px,0);
+  transform: translate3d(0,-1px,0);
+  color: #0297f5;
+}
+
+.emotion-17:hover svg path,
+.emotion-17:focus svg path {
+  fill: #0297f5;
+}
+
+.emotion-17:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  color: #028ee6;
+}
+
+.emotion-17:active svg path {
+  fill: #028ee6;
+}
+
+.emotion-17 svg {
+  display: inline-block;
+  height: 1em;
+  width: 1em;
+  vertical-align: text-top;
+  position: relative;
+  bottom: -0.125em;
+  margin-right: 0.4em;
+}
+
+.emotion-17 svg path {
   fill: #999999;
 }
 
-.emotion-14:hover {
+.emotion-17:hover {
   color: #666666;
 }
 
-.emotion-14:hover svg path {
+.emotion-17:hover svg path {
   fill: #666666;
 }
 
-.emotion-14:active {
+.emotion-17:active {
   color: #444444;
 }
 
-.emotion-14:active svg path {
+.emotion-17:active svg path {
   fill: #444444;
 }
 
+.emotion-24 {
+  display: block;
+}
+
+.emotion-23 {
+  padding: 3rem 20px;
+  max-width: 600px;
+  margin: 0 auto;
+}
+
+.emotion-9 {
+  margin-bottom: 20px;
+  font-size: 28px;
+  font-weight: 900;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+}
+
+.emotion-9 > svg {
+  height: 32px;
+  width: auto;
+  margin-right: 8px;
+}
+
 .emotion-13 > svg:last-of-type {
   height: 0.7em;
   width: 0.7em;
@@ -881,39 +385,646 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   vertical-align: inherit;
 }
 
+.emotion-10 {
+  background: #FEDED2;
+  color: #FF4400;
+  font-weight: 700;
+  padding: 10px 20px;
+  margin-bottom: 24px;
+  border: 1px solid rgba(0,0,0,.1);
+  text-align: center;
+}
+
+.emotion-15 {
+  font-weight: 700;
+  text-align: center;
+}
+
+<div
+  class="emotion-26"
+  title="wrapper"
+>
+  <div
+    class="emotion-8"
+    title="bar"
+  >
+    <div
+      class="emotion-7"
+    >
+      <div
+        class="emotion-2"
+        title="side left"
+      >
+        <div
+          class="emotion-1"
+          role="tablist"
+        >
+          <button
+            class="emotion-0"
+            role="tab"
+            type="button"
+          >
+            About
+          </button>
+        </div>
+      </div>
+      <div
+        class="emotion-6"
+        title="side right"
+      >
+        <button
+          class="emotion-5"
+        >
+          <svg
+            class="emotion-4"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-3"
+              d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
+            />
+          </svg>
+        </button>
+      </div>
+    </div>
+  </div>
+  <div
+    class="emotion-25"
+  >
+    <div
+      class="emotion-24"
+      role="tabpanel"
+    >
+      <div
+        class="emotion-23"
+      >
+        <header
+          class="emotion-9"
+        >
+          <svg
+            title="Storybook icon"
+            viewBox="0 0 64 64"
+          >
+            <g
+              fill="none"
+              fill-rule="evenodd"
+              id="Artboard"
+              stroke="none"
+              stroke-width="1"
+            >
+              <path
+                d="M8.04798541,58.7875918 L6.07908839,6.32540407 C6.01406344,4.5927838 7.34257463,3.12440831 9.07303814,3.01625434 L53.6958037,0.227331489 C55.457209,0.117243658 56.974354,1.45590096 57.0844418,3.21730626 C57.0885895,3.28366922 57.0906648,3.35014546 57.0906648,3.41663791 L57.0906648,60.5834697 C57.0906648,62.3483119 55.6599776,63.7789992 53.8951354,63.7789992 C53.847325,63.7789992 53.7995207,63.7779262 53.7517585,63.775781 L11.0978899,61.8600599 C9.43669044,61.7854501 8.11034889,60.4492961 8.04798541,58.7875918 Z"
+                fill="#FF4785"
+                fill-rule="nonzero"
+                id="path-1"
+              />
+              <path
+                d="M35.9095005,24.1768792 C35.9095005,25.420127 44.2838488,24.8242707 45.4080313,23.9509748 C45.4080313,15.4847538 40.8652557,11.0358878 32.5466666,11.0358878 C24.2280775,11.0358878 19.5673077,15.553972 19.5673077,22.3311017 C19.5673077,34.1346028 35.4965208,34.3605071 35.4965208,40.7987804 C35.4965208,42.606015 34.6115646,43.6790606 32.6646607,43.6790606 C30.127786,43.6790606 29.1248356,42.3834613 29.2428298,37.9783269 C29.2428298,37.0226907 19.5673077,36.7247626 19.2723223,37.9783269 C18.5211693,48.6535354 25.1720308,51.7326752 32.7826549,51.7326752 C40.1572906,51.7326752 45.939005,47.8018145 45.939005,40.6858282 C45.939005,28.035186 29.7738035,28.3740425 29.7738035,22.1051974 C29.7738035,19.5637737 31.6617103,19.2249173 32.7826549,19.2249173 C33.9625966,19.2249173 36.0864917,19.4328883 35.9095005,24.1768792 Z"
+                fill="#FFFFFF"
+                fill-rule="nonzero"
+                id="path9_fill-path"
+              />
+              <path
+                d="M44.0461638,0.830433986 L50.1874092,0.446606143 L50.443532,7.7810017 C50.4527198,8.04410717 50.2468789,8.26484453 49.9837734,8.27403237 C49.871115,8.27796649 49.7607078,8.24184808 49.6721567,8.17209069 L47.3089847,6.3104681 L44.5110468,8.43287463 C44.3012992,8.591981 44.0022839,8.55092814 43.8431776,8.34118051 C43.7762017,8.25288717 43.742082,8.14401677 43.7466857,8.03329059 L44.0461638,0.830433986 Z"
+                fill="#FFFFFF"
+                id="Path"
+              />
+            </g>
+          </svg>
+          Storybook 5.0.0
+        </header>
+        <div
+          class="emotion-10"
+        >
+          Oops! The latest version of Storybook couldn't be fetched.
+        </div>
+        <div
+          class="emotion-15"
+        >
+          <a
+            class="emotion-14"
+            href="https://github.com/storybooks/storybook/releases"
+            target="_blank"
+          >
+            <span
+              class="emotion-13"
+            >
+              Check Storybook's release history
+              <svg
+                class="emotion-4"
+                viewBox="0 0 1024 1024"
+              >
+                <path
+                  class="emotion-3"
+                  d="M768.072 514.022c0 10.236-3.904 20.47-11.712 28.282l-344.098 344.156c-15.62 15.624-40.946 15.624-56.568 0.006-15.622-15.622-15.624-40.948-0.006-56.568l315.82-315.876-315.868-315.922c-15.618-15.624-15.618-40.952 0.004-56.568 15.624-15.62 40.95-15.618 56.57 0.006l344.144 344.204c7.81 7.81 11.714 18.044 11.714 28.28z"
+                />
+              </svg>
+            </span>
+          </a>
+        </div>
+        <div
+          class="emotion-22"
+        >
+          <a
+            class="emotion-17"
+            href="https://storybook.js.org"
+          >
+            <span
+              class="emotion-16"
+            >
+              Docs
+            </span>
+          </a>
+          <a
+            class="emotion-17"
+            href="https://github.com/storybooks/storybook"
+          >
+            <span
+              class="emotion-16"
+            >
+              GitHub
+            </span>
+          </a>
+          <a
+            class="emotion-17"
+            href="https://storybook.js.org/support"
+          >
+            <span
+              class="emotion-16"
+            >
+              Support
+            </span>
+          </a>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+`;
+
+exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
+.emotion-42 {
+  width: 100%;
+  height: 100%;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+}
+
+.emotion-8 {
+  color: #999999;
+  height: 40px;
+  overflow: auto;
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-8::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+}
+
+.emotion-8::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-8::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-8::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
+}
+
+.emotion-7 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+  position: relative;
+  white-space: nowrap;
+  height: 40px;
+}
+
+.emotion-2 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+}
+
+.emotion-2 > * {
+  margin-left: 15px;
+}
+
+.emotion-1 {
+  overflow: hidden;
+}
+
+.emotion-1:first-of-type {
+  margin-left: 0;
+}
+
+.emotion-0 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
+  font-size: 13px;
+  color: #1EA7FD;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-0:empty {
+  display: none;
+}
+
+.emotion-0:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-6 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  margin-left: 30px;
+}
+
+.emotion-6 > * {
+  margin-right: 15px;
+}
+
+.emotion-5 {
+  height: 40px;
+  background: none;
+  color: inherit;
+  padding: 0;
+  cursor: pointer;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+}
+
+.emotion-5:hover,
+.emotion-5:focus {
+  outline: 0 none;
+  color: #1EA7FD;
+}
+
+.emotion-5 > svg {
+  width: 15px;
+}
+
+.emotion-4 {
+  shape-rendering: inherit;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  display: block;
+}
+
+.emotion-3 {
+  fill: currentColor;
+}
+
+.emotion-41 {
+  display: block;
+  position: relative;
+  font-size: 13px;
+  position: relative;
+  overflow: auto;
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  width: 100%;
+}
+
+.emotion-38 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  padding-top: 20px;
+  margin-top: 20px;
+  border-top: 1px solid rgba(0,0,0,.1);
+  font-weight: 700;
+}
+
+.emotion-38 > * + * {
+  margin-left: 20px;
+}
+
+.emotion-33 {
+  display: inline-block;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: #1EA7FD;
+  color: #999999;
+}
+
+.emotion-33 svg path {
+  fill: #1EA7FD;
+}
+
+.emotion-33:hover,
+.emotion-33:focus {
+  cursor: pointer;
+  -webkit-transform: translate3d(0,-1px,0);
+  -ms-transform: translate3d(0,-1px,0);
+  transform: translate3d(0,-1px,0);
+  color: #0297f5;
+}
+
+.emotion-33:hover svg path,
+.emotion-33:focus svg path {
+  fill: #0297f5;
+}
+
+.emotion-33:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  color: #028ee6;
+}
+
+.emotion-33:active svg path {
+  fill: #028ee6;
+}
+
+.emotion-33 svg {
+  display: inline-block;
+  height: 1em;
+  width: 1em;
+  vertical-align: text-top;
+  position: relative;
+  bottom: -0.125em;
+  margin-right: 0.4em;
+}
+
+.emotion-33 svg path {
+  fill: #999999;
+}
+
+.emotion-33:hover {
+  color: #666666;
+}
+
+.emotion-33:hover svg path {
+  fill: #666666;
+}
+
+.emotion-33:active {
+  color: #444444;
+}
+
+.emotion-33:active svg path {
+  fill: #444444;
+}
+
+.emotion-40 {
+  display: block;
+}
+
+.emotion-39 {
+  padding: 3rem 20px;
+  max-width: 600px;
+  margin: 0 auto;
+}
+
+.emotion-9 {
+  margin-bottom: 20px;
+  font-size: 28px;
+  font-weight: 900;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+}
+
+.emotion-9 > svg {
+  height: 32px;
+  width: auto;
+  margin-right: 8px;
+}
+
 .emotion-16 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+}
+
+.emotion-11 {
+  -webkit-letter-spacing: 0.35em;
+  -moz-letter-spacing: 0.35em;
+  -ms-letter-spacing: 0.35em;
+  letter-spacing: 0.35em;
+  text-transform: uppercase;
+  font-weight: 900;
+  font-size: 13px;
+  line-height: 24px;
+  color: #999999;
+}
+
+.emotion-15 {
+  display: inline-block;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: #1EA7FD;
+  color: #999999;
+  font-size: 12px;
+}
+
+.emotion-15 svg path {
+  fill: #1EA7FD;
+}
+
+.emotion-15:hover,
+.emotion-15:focus {
+  cursor: pointer;
+  -webkit-transform: translate3d(0,-1px,0);
+  -ms-transform: translate3d(0,-1px,0);
+  transform: translate3d(0,-1px,0);
+  color: #0297f5;
+}
+
+.emotion-15:hover svg path,
+.emotion-15:focus svg path {
+  fill: #0297f5;
+}
+
+.emotion-15:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  color: #028ee6;
+}
+
+.emotion-15:active svg path {
+  fill: #028ee6;
+}
+
+.emotion-15 svg {
+  display: inline-block;
+  height: 1em;
+  width: 1em;
+  vertical-align: text-top;
+  position: relative;
+  bottom: -0.125em;
+  margin-right: 0.4em;
+}
+
+.emotion-15 svg path {
+  fill: #999999;
+}
+
+.emotion-15:hover {
+  color: #666666;
+}
+
+.emotion-15:hover svg path {
+  fill: #666666;
+}
+
+.emotion-15:active {
+  color: #444444;
+}
+
+.emotion-15:active svg path {
+  fill: #444444;
+}
+
+.emotion-14 > svg:last-of-type {
+  height: 0.7em;
+  width: 0.7em;
+  margin-right: 0;
+  margin-left: 0.25em;
+  bottom: auto;
+  vertical-align: inherit;
+}
+
+.emotion-17 {
   font-size: 14px;
   line-height: 1.6;
 }
 
-.emotion-16 h1 {
+.emotion-17 h1 {
   font-size: 32px;
   font-weight: 900;
 }
 
-.emotion-16 h2 {
+.emotion-17 h2 {
   font-size: 24px;
   border-bottom: 1px solid rgba(0,0,0,.1);
 }
 
-.emotion-16 h3 {
+.emotion-17 h3 {
   font-size: 20px;
 }
 
-.emotion-16 h4 {
+.emotion-17 h4 {
   font-size: 16px;
 }
 
-.emotion-16 h5 {
+.emotion-17 h5 {
   font-size: 14px;
 }
 
-.emotion-16 h6 {
+.emotion-17 h6 {
   font-size: 14px;
   color: #666666;
 }
 
-.emotion-16 pre:not(.hljs) {
+.emotion-17 pre:not(.hljs) {
   background: transparent;
   border: none;
   border-radius: 0;
@@ -921,8 +1032,8 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   margin: 0;
 }
 
-.emotion-16 pre pre,
-.emotion-16 pre.hljs {
+.emotion-17 pre pre,
+.emotion-17 pre.hljs {
   padding: 15px;
   margin: 0;
   overflow: auto;
@@ -932,13 +1043,13 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   line-height: 19px;
 }
 
-.emotion-16 pre pre code,
-.emotion-16 pre.hljs code {
+.emotion-17 pre pre code,
+.emotion-17 pre.hljs code {
   color: inherit;
   font-size: inherit;
 }
 
-.emotion-16 pre code {
+.emotion-17 pre code {
   margin: 0;
   padding: 0;
   white-space: pre;
@@ -946,31 +1057,31 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   background: transparent;
 }
 
-.emotion-16 pre code,
-.emotion-16 pre tt {
+.emotion-17 pre code,
+.emotion-17 pre tt {
   background-color: transparent;
   border: none;
 }
 
-.emotion-16 body > *:first-child {
+.emotion-17 body > *:first-of-type {
   margin-top: 0 !important;
 }
 
-.emotion-16 body > *:last-child {
+.emotion-17 body > *:last-child {
   margin-bottom: 0 !important;
 }
 
-.emotion-16 a {
+.emotion-17 a {
   color: #1EA7FD;
   -webkit-text-decoration: none;
   text-decoration: none;
 }
 
-.emotion-16 a.absent {
+.emotion-17 a.absent {
   color: #cc0000;
 }
 
-.emotion-16 a.anchor {
+.emotion-17 a.anchor {
   display: block;
   padding-left: 30px;
   margin-left: -30px;
@@ -981,153 +1092,153 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   bottom: 0;
 }
 
-.emotion-16 h1,
-.emotion-16 h2,
-.emotion-16 h3,
-.emotion-16 h4,
-.emotion-16 h5,
-.emotion-16 h6 {
+.emotion-17 h1,
+.emotion-17 h2,
+.emotion-17 h3,
+.emotion-17 h4,
+.emotion-17 h5,
+.emotion-17 h6 {
   margin: 20px 0 10px;
   padding: 0;
   cursor: text;
   position: relative;
 }
 
-.emotion-16 h2:first-child,
-.emotion-16 h1:first-child,
-.emotion-16 h1:first-child + h2,
-.emotion-16 h3:first-child,
-.emotion-16 h4:first-child,
-.emotion-16 h5:first-child,
-.emotion-16 h6:first-child {
+.emotion-17 h2:first-of-type,
+.emotion-17 h1:first-of-type,
+.emotion-17 h1:first-of-type + h2,
+.emotion-17 h3:first-of-type,
+.emotion-17 h4:first-of-type,
+.emotion-17 h5:first-of-type,
+.emotion-17 h6:first-of-type {
   margin-top: 0;
   padding-top: 0;
 }
 
-.emotion-16 h1:hover a.anchor,
-.emotion-16 h2:hover a.anchor,
-.emotion-16 h3:hover a.anchor,
-.emotion-16 h4:hover a.anchor,
-.emotion-16 h5:hover a.anchor,
-.emotion-16 h6:hover a.anchor {
+.emotion-17 h1:hover a.anchor,
+.emotion-17 h2:hover a.anchor,
+.emotion-17 h3:hover a.anchor,
+.emotion-17 h4:hover a.anchor,
+.emotion-17 h5:hover a.anchor,
+.emotion-17 h6:hover a.anchor {
   -webkit-text-decoration: none;
   text-decoration: none;
 }
 
-.emotion-16 h1 tt,
-.emotion-16 h1 code {
+.emotion-17 h1 tt,
+.emotion-17 h1 code {
   font-size: inherit;
 }
 
-.emotion-16 h2 tt,
-.emotion-16 h2 code {
+.emotion-17 h2 tt,
+.emotion-17 h2 code {
   font-size: inherit;
 }
 
-.emotion-16 h3 tt,
-.emotion-16 h3 code {
+.emotion-17 h3 tt,
+.emotion-17 h3 code {
   font-size: inherit;
 }
 
-.emotion-16 h4 tt,
-.emotion-16 h4 code {
+.emotion-17 h4 tt,
+.emotion-17 h4 code {
   font-size: inherit;
 }
 
-.emotion-16 h5 tt,
-.emotion-16 h5 code {
+.emotion-17 h5 tt,
+.emotion-17 h5 code {
   font-size: inherit;
 }
 
-.emotion-16 h6 tt,
-.emotion-16 h6 code {
+.emotion-17 h6 tt,
+.emotion-17 h6 code {
   font-size: inherit;
 }
 
-.emotion-16 p,
-.emotion-16 blockquote,
-.emotion-16 ul,
-.emotion-16 ol,
-.emotion-16 dl,
-.emotion-16 li,
-.emotion-16 table,
-.emotion-16 pre {
+.emotion-17 p,
+.emotion-17 blockquote,
+.emotion-17 ul,
+.emotion-17 ol,
+.emotion-17 dl,
+.emotion-17 li,
+.emotion-17 table,
+.emotion-17 pre {
   margin: 15px 0;
 }
 
-.emotion-16 hr {
+.emotion-17 hr {
   border: 0 none;
   color: rgba(0,0,0,.1);
   height: 4px;
   padding: 0;
 }
 
-.emotion-16 body > h2:first-child {
+.emotion-17 body > h2:first-of-type {
   margin-top: 0;
   padding-top: 0;
 }
 
-.emotion-16 body > h1:first-child {
+.emotion-17 body > h1:first-of-type {
   margin-top: 0;
   padding-top: 0;
 }
 
-.emotion-16 body > h1:first-child + h2 {
+.emotion-17 body > h1:first-of-type + h2 {
   margin-top: 0;
   padding-top: 0;
 }
 
-.emotion-16 body > h3:first-child,
-.emotion-16 body > h4:first-child,
-.emotion-16 body > h5:first-child,
-.emotion-16 body > h6:first-child {
+.emotion-17 body > h3:first-of-type,
+.emotion-17 body > h4:first-of-type,
+.emotion-17 body > h5:first-of-type,
+.emotion-17 body > h6:first-of-type {
   margin-top: 0;
   padding-top: 0;
 }
 
-.emotion-16 a:first-child h1,
-.emotion-16 a:first-child h2,
-.emotion-16 a:first-child h3,
-.emotion-16 a:first-child h4,
-.emotion-16 a:first-child h5,
-.emotion-16 a:first-child h6 {
+.emotion-17 a:first-of-type h1,
+.emotion-17 a:first-of-type h2,
+.emotion-17 a:first-of-type h3,
+.emotion-17 a:first-of-type h4,
+.emotion-17 a:first-of-type h5,
+.emotion-17 a:first-of-type h6 {
   margin-top: 0;
   padding-top: 0;
 }
 
-.emotion-16 h1 p,
-.emotion-16 h2 p,
-.emotion-16 h3 p,
-.emotion-16 h4 p,
-.emotion-16 h5 p,
-.emotion-16 h6 p {
+.emotion-17 h1 p,
+.emotion-17 h2 p,
+.emotion-17 h3 p,
+.emotion-17 h4 p,
+.emotion-17 h5 p,
+.emotion-17 h6 p {
   margin-top: 0;
 }
 
-.emotion-16 li p.first {
+.emotion-17 li p.first {
   display: inline-block;
 }
 
-.emotion-16 ul,
-.emotion-16 ol {
+.emotion-17 ul,
+.emotion-17 ol {
   padding-left: 30px;
 }
 
-.emotion-16 ul :first-child,
-.emotion-16 ol :first-child {
+.emotion-17 ul :first-of-type,
+.emotion-17 ol :first-of-type {
   margin-top: 0;
 }
 
-.emotion-16 ul :last-child,
-.emotion-16 ol :last-child {
+.emotion-17 ul :last-child,
+.emotion-17 ol :last-child {
   margin-bottom: 0;
 }
 
-.emotion-16 dl {
+.emotion-17 dl {
   padding: 0;
 }
 
-.emotion-16 dl dt {
+.emotion-17 dl dt {
   font-size: 14px;
   font-weight: bold;
   font-style: italic;
@@ -1135,62 +1246,62 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   margin: 15px 0 5px;
 }
 
-.emotion-16 dl dt:first-child {
+.emotion-17 dl dt:first-of-type {
   padding: 0;
 }
 
-.emotion-16 dl dt > :first-child {
+.emotion-17 dl dt > :first-of-type {
   margin-top: 0;
 }
 
-.emotion-16 dl dt > :last-child {
+.emotion-17 dl dt > :last-child {
   margin-bottom: 0;
 }
 
-.emotion-16 dl dd {
+.emotion-17 dl dd {
   margin: 0 0 15px;
   padding: 0 15px;
 }
 
-.emotion-16 dl dd > :first-child {
+.emotion-17 dl dd > :first-of-type {
   margin-top: 0;
 }
 
-.emotion-16 dl dd > :last-child {
+.emotion-17 dl dd > :last-child {
   margin-bottom: 0;
 }
 
-.emotion-16 blockquote {
+.emotion-17 blockquote {
   border-left: 4px solid #DDDDDD;
   padding: 0 15px;
   color: #666666;
 }
 
-.emotion-16 blockquote > :first-child {
+.emotion-17 blockquote > :first-of-type {
   margin-top: 0;
 }
 
-.emotion-16 blockquote > :last-child {
+.emotion-17 blockquote > :last-child {
   margin-bottom: 0;
 }
 
-.emotion-16 table {
+.emotion-17 table {
   padding: 0;
   border-collapse: collapse;
 }
 
-.emotion-16 table tr {
+.emotion-17 table tr {
   border-top: 1px solid rgba(0,0,0,.1);
   background-color: white;
   margin: 0;
   padding: 0;
 }
 
-.emotion-16 table tr:nth-child(2n) {
+.emotion-17 table tr:nth-of-type(2n) {
   background-color: #F8F8F8;
 }
 
-.emotion-16 table tr th {
+.emotion-17 table tr th {
   font-weight: bold;
   border: 1px solid rgba(0,0,0,.1);
   text-align: left;
@@ -1198,33 +1309,33 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   padding: 6px 13px;
 }
 
-.emotion-16 table tr td {
+.emotion-17 table tr td {
   border: 1px solid rgba(0,0,0,.1);
   text-align: left;
   margin: 0;
   padding: 6px 13px;
 }
 
-.emotion-16 table tr th :first-child,
-.emotion-16 table tr td :first-child {
+.emotion-17 table tr th :first-of-type,
+.emotion-17 table tr td :first-of-type {
   margin-top: 0;
 }
 
-.emotion-16 table tr th :last-child,
-.emotion-16 table tr td :last-child {
+.emotion-17 table tr th :last-child,
+.emotion-17 table tr td :last-child {
   margin-bottom: 0;
 }
 
-.emotion-16 img {
+.emotion-17 img {
   max-width: 100%;
 }
 
-.emotion-16 span.frame {
+.emotion-17 span.frame {
   display: block;
   overflow: hidden;
 }
 
-.emotion-16 span.frame > span {
+.emotion-17 span.frame > span {
   border: 1px solid #DDDDDD;
   display: block;
   float: left;
@@ -1234,81 +1345,81 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   width: auto;
 }
 
-.emotion-16 span.frame span img {
+.emotion-17 span.frame span img {
   display: block;
   float: left;
 }
 
-.emotion-16 span.frame span span {
+.emotion-17 span.frame span span {
   clear: both;
   color: #333333;
   display: block;
   padding: 5px 0 0;
 }
 
-.emotion-16 span.align-center {
+.emotion-17 span.align-center {
   display: block;
   overflow: hidden;
   clear: both;
 }
 
-.emotion-16 span.align-center > span {
+.emotion-17 span.align-center > span {
   display: block;
   overflow: hidden;
   margin: 13px auto 0;
   text-align: center;
 }
 
-.emotion-16 span.align-center span img {
+.emotion-17 span.align-center span img {
   margin: 0 auto;
   text-align: center;
 }
 
-.emotion-16 span.align-right {
+.emotion-17 span.align-right {
   display: block;
   overflow: hidden;
   clear: both;
 }
 
-.emotion-16 span.align-right > span {
+.emotion-17 span.align-right > span {
   display: block;
   overflow: hidden;
   margin: 13px 0 0;
   text-align: right;
 }
 
-.emotion-16 span.align-right span img {
+.emotion-17 span.align-right span img {
   margin: 0;
   text-align: right;
 }
 
-.emotion-16 span.float-left {
+.emotion-17 span.float-left {
   display: block;
   margin-right: 13px;
   overflow: hidden;
   float: left;
 }
 
-.emotion-16 span.float-left span {
+.emotion-17 span.float-left span {
   margin: 13px 0 0;
 }
 
-.emotion-16 span.float-right {
+.emotion-17 span.float-right {
   display: block;
   margin-left: 13px;
   overflow: hidden;
   float: right;
 }
 
-.emotion-16 span.float-right > span {
+.emotion-17 span.float-right > span {
   display: block;
   overflow: hidden;
   margin: 13px auto 0;
   text-align: right;
 }
 
-.emotion-16 code,
-.emotion-16 tt {
+.emotion-17 code,
+.emotion-17 tt {
   margin: 0 2px;
   padding: 0 5px;
   white-space: nowrap;
@@ -1317,185 +1428,184 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   border-radius: 3px;
 }
 
-.emotion-9 {
+.emotion-10 {
   background: #E1FFD4;
   color: #66BF3C;
   font-weight: 700;
-  height: 40px;
   padding: 10px 20px;
   margin-bottom: 24px;
   border: 1px solid rgba(0,0,0,.1);
   text-align: center;
 }
 
-.emotion-30 {
+.emotion-31 {
   margin-top: 20px;
   padding-bottom: 20px;
   border-top: 1px solid rgba(0,0,0,.1);
 }
 
-.emotion-22 {
+.emotion-23 {
   position: relative;
   overflow: hidden;
   border: 1px solid rgba(0,0,0,.1);
 }
 
-.emotion-19 {
+.emotion-20 {
   position: relative;
   overflow: auto;
 }
 
-.emotion-19 code {
+.emotion-20 code {
   padding-right: 10px;
 }
 
-.emotion-19 * .token {
+.emotion-20 * .token {
   font-family: "Operator Mono","Fira Code Retina","Fira Code","FiraCode-Retina","Andale Mono","Lucida Console",Consolas,Monaco,monospace;
   -webkit-font-smoothing: antialiased;
 }
 
-.emotion-19 * .token.comment {
+.emotion-20 * .token.comment {
   color: #008000;
   font-style: italic;
 }
 
-.emotion-19 * .token.prolog {
+.emotion-20 * .token.prolog {
   color: #008000;
   font-style: italic;
 }
 
-.emotion-19 * .token.doctype {
+.emotion-20 * .token.doctype {
   color: #008000;
   font-style: italic;
 }
 
-.emotion-19 * .token.cdata {
+.emotion-20 * .token.cdata {
   color: #008000;
   font-style: italic;
 }
 
-.emotion-19 * .token.string {
+.emotion-20 * .token.string {
   color: #A31515;
 }
 
-.emotion-19 * .token.punctuation {
+.emotion-20 * .token.punctuation {
   color: #393A34;
 }
 
-.emotion-19 * .token.operator {
+.emotion-20 * .token.operator {
   color: #393A34;
 }
 
-.emotion-19 * .token.url {
+.emotion-20 * .token.url {
   color: #36acaa;
 }
 
-.emotion-19 * .token.symbol {
+.emotion-20 * .token.symbol {
   color: #36acaa;
 }
 
-.emotion-19 * .token.number {
+.emotion-20 * .token.number {
   color: #36acaa;
 }
 
-.emotion-19 * .token.boolean {
+.emotion-20 * .token.boolean {
   color: #36acaa;
 }
 
-.emotion-19 * .token.variable {
+.emotion-20 * .token.variable {
   color: #36acaa;
 }
 
-.emotion-19 * .token.constant {
+.emotion-20 * .token.constant {
   color: #36acaa;
 }
 
-.emotion-19 * .token.inserted {
+.emotion-20 * .token.inserted {
   color: #36acaa;
 }
 
-.emotion-19 * .token.atrule {
+.emotion-20 * .token.atrule {
   color: #0000ff;
 }
 
-.emotion-19 * .token.keyword {
+.emotion-20 * .token.keyword {
   color: #0000ff;
 }
 
-.emotion-19 * .token.attr-value {
+.emotion-20 * .token.attr-value {
   color: #0000ff;
 }
 
-.emotion-19 * .token.function {
+.emotion-20 * .token.function {
   color: #393A34;
 }
 
-.emotion-19 * .token.deleted {
+.emotion-20 * .token.deleted {
   color: #9a050f;
 }
 
-.emotion-19 * .token.important {
+.emotion-20 * .token.important {
   font-weight: bold;
 }
 
-.emotion-19 * .token.bold {
+.emotion-20 * .token.bold {
   font-weight: bold;
 }
 
-.emotion-19 * .token.italic {
+.emotion-20 * .token.italic {
   font-style: italic;
 }
 
-.emotion-19 * .token.class-name {
+.emotion-20 * .token.class-name {
   color: #2B91AF;
 }
 
-.emotion-19 * .token.tag {
+.emotion-20 * .token.tag {
   color: #800000;
 }
 
-.emotion-19 * .token.selector {
+.emotion-20 * .token.selector {
   color: #800000;
 }
 
-.emotion-19 * .token.attr-name {
+.emotion-20 * .token.attr-name {
   color: #ff0000;
 }
 
-.emotion-19 * .token.property {
+.emotion-20 * .token.property {
   color: #ff0000;
 }
 
-.emotion-19 * .token.regex {
+.emotion-20 * .token.regex {
   color: #ff0000;
 }
 
-.emotion-19 * .token.entity {
+.emotion-20 * .token.entity {
   color: #ff0000;
 }
 
-.emotion-19 * .token.directive.tag .tag {
+.emotion-20 * .token.directive.tag .tag {
   background: #ffff00;
   color: #393A34;
 }
 
-.emotion-19 * .language-json .token.boolean {
+.emotion-20 * .language-json .token.boolean {
   color: #0000ff;
 }
 
-.emotion-19 * .language-json .token.number {
+.emotion-20 * .language-json .token.number {
   color: #0000ff;
 }
 
-.emotion-19 * .language-json .token.property {
+.emotion-20 * .language-json .token.property {
   color: #2B91AF;
 }
 
-.emotion-19 * .namespace {
+.emotion-20 * .namespace {
   opacity: 0.7;
 }
 
-.emotion-18 {
+.emotion-19 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -1508,7 +1618,7 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   padding: 10px;
 }
 
-.emotion-17 {
+.emotion-18 {
   -webkit-flex: 1;
   -ms-flex: 1;
   flex: 1;
@@ -1516,7 +1626,7 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   opacity: 1;
 }
 
-.emotion-21 {
+.emotion-22 {
   position: absolute;
   bottom: 0;
   right: 0;
@@ -1527,7 +1637,7 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   display: flex;
 }
 
-.emotion-20 {
+.emotion-21 {
   border: 0 none;
   padding: 4px 10px;
   cursor: pointer;
@@ -1549,72 +1659,80 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   border-radius: 4px 0 0 0;
 }
 
-.emotion-20:not(:last-child) {
+.emotion-21:not(:last-child) {
   border-right: 1px solid rgba(0,0,0,.1);
 }
 
-.emotion-20 + * {
+.emotion-21 + * {
   border-left: 1px solid rgba(0,0,0,.1);
   border-radius: 0;
 }
 
-.emotion-20:focus {
+.emotion-21:focus {
   box-shadow: #1EA7FD 0 -3px 0 0 inset;
   outline: 0 none;
 }
 
 <div
-  class="emotion-41"
+  class="emotion-42"
+  title="wrapper"
 >
   <div
-    class="emotion-7"
+    class="emotion-8"
+    title="bar"
   >
     <div
-      class="emotion-2"
+      class="emotion-7"
     >
       <div
-        class="emotion-1"
-        role="tablist"
+        class="emotion-2"
+        title="side left"
+      >
+        <div
+          class="emotion-1"
+          role="tablist"
+        >
+          <button
+            class="emotion-0"
+            role="tab"
+            type="button"
+          >
+            About
+          </button>
+        </div>
+      </div>
+      <div
+        class="emotion-6"
+        title="side right"
       >
         <button
-          class="emotion-0"
-          role="tab"
-          type="button"
+          class="emotion-5"
         >
-          About
+          <svg
+            class="emotion-4"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-3"
+              d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
+            />
+          </svg>
         </button>
       </div>
     </div>
-    <div
-      class="emotion-6"
-    >
-      <button
-        class="emotion-5"
-      >
-        <svg
-          class="emotion-4"
-          viewBox="0 0 1024 1024"
-        >
-          <path
-            class="emotion-3"
-            d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
-          />
-        </svg>
-      </button>
-    </div>
   </div>
   <div
-    class="emotion-40"
+    class="emotion-41"
   >
     <div
-      class="emotion-39"
+      class="emotion-40"
       role="tabpanel"
     >
       <div
-        class="emotion-38"
+        class="emotion-39"
       >
         <header
-          class="emotion-8"
+          class="emotion-9"
         >
           <svg
             title="Storybook icon"
@@ -1649,25 +1767,25 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
           Storybook 5.0.0
         </header>
         <div
-          class="emotion-9"
+          class="emotion-10"
         >
           Storybook 5.0.3 is available. Upgrade from 5.0.0 now.
         </div>
         <div
-          class="emotion-15"
+          class="emotion-16"
         >
           <span
-            class="emotion-10"
+            class="emotion-11"
           >
             5.0.3 Changelog
           </span>
           <a
-            class="emotion-14"
+            class="emotion-15"
             href="https://github.com/storybooks/storybook/blob/master/CHANGELOG.md"
             target="_blank"
           >
             <span
-              class="emotion-13"
+              class="emotion-14"
             >
               Read full changelog
               <svg
@@ -1683,7 +1801,7 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
           </a>
         </div>
         <div
-          class="emotion-16"
+          class="emotion-17"
         >
           <ul>
             <li>
@@ -1704,10 +1822,10 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
           </ul>
         </div>
         <div
-          class="emotion-30"
+          class="emotion-31"
         >
           <div
-            class="emotion-16"
+            class="emotion-17"
           >
             <p>
               <b>
@@ -1715,16 +1833,16 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
               </b>
             </p>
             <div
-              class="emotion-22"
+              class="emotion-23"
             >
               <div
-                class="emotion-19"
+                class="emotion-20"
               >
                 <pre
-                  class="hljs emotion-18"
+                  class="hljs emotion-19"
                 >
                   <code
-                    class="emotion-17"
+                    class="emotion-18"
                   >
                     npx npm-check-updates 
                     <span
@@ -1743,10 +1861,10 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
                 </pre>
               </div>
               <div
-                class="emotion-21"
+                class="emotion-22"
               >
                 <button
-                  class="emotion-20"
+                  class="emotion-21"
                 >
                   Copy
                 </button>
@@ -1756,26 +1874,26 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
               Alternatively, if you're using yarn run the following command, and check all Storybook related packages:
             </p>
             <div
-              class="emotion-22"
+              class="emotion-23"
             >
               <div
-                class="emotion-19"
+                class="emotion-20"
               >
                 <pre
-                  class="hljs emotion-18"
+                  class="hljs emotion-19"
                 >
                   <code
-                    class="emotion-17"
+                    class="emotion-18"
                   >
                     yarn upgrade-interactive --latest
                   </code>
                 </pre>
               </div>
               <div
-                class="emotion-21"
+                class="emotion-22"
               >
                 <button
-                  class="emotion-20"
+                  class="emotion-21"
                 >
                   Copy
                 </button>
@@ -1784,34 +1902,34 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
           </div>
         </div>
         <div
-          class="emotion-37"
+          class="emotion-38"
         >
           <a
-            class="emotion-32"
+            class="emotion-33"
             href="https://storybook.js.org"
           >
             <span
-              class="emotion-31"
+              class="emotion-32"
             >
               Docs
             </span>
           </a>
           <a
-            class="emotion-32"
+            class="emotion-33"
             href="https://github.com/storybooks/storybook"
           >
             <span
-              class="emotion-31"
+              class="emotion-32"
             >
               GitHub
             </span>
           </a>
           <a
-            class="emotion-32"
+            class="emotion-33"
             href="https://storybook.js.org/support"
           >
             <span
-              class="emotion-31"
+              class="emotion-32"
             >
               Support
             </span>
@@ -1824,7 +1942,7 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
 `;
 
 exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
-.emotion-27 {
+.emotion-28 {
   width: 100%;
   height: 100%;
   box-sizing: border-box;
@@ -1837,6 +1955,57 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   flex-direction: column;
 }
 
+.emotion-8 {
+  color: #999999;
+  height: 40px;
+  overflow: auto;
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-8::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+}
+
+.emotion-8::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-8::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-8::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
+}
+
 .emotion-7 {
   display: -webkit-box;
   display: -webkit-flex;
@@ -1846,14 +2015,9 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   -webkit-justify-content: space-between;
   -ms-flex-pack: justify;
   justify-content: space-between;
-  background: #FFFFFF;
-  color: #999999;
-  height: 40px;
   position: relative;
-  overflow: visible;
-  overflow-x: visible;
-  overflow-y: visible;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+  white-space: nowrap;
+  height: 40px;
 }
 
 .emotion-2 {
@@ -1861,9 +2025,12 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
 }
 
 .emotion-2 > * {
@@ -1871,14 +2038,10 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
 }
 
 .emotion-1 {
-  white-space: nowrap;
-  height: 100%;
-  padding-bottom: 50px;
-  overflow-x: visisble;
-  overflow-y: visisble;
+  overflow: hidden;
 }
 
-.emotion-1:first-child {
+.emotion-1:first-of-type {
   margin-left: 0;
 }
 
@@ -1932,6 +2095,13 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  margin-left: 30px;
 }
 
 .emotion-6 > * {
@@ -1973,7 +2143,7 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   fill: currentColor;
 }
 
-.emotion-26 {
+.emotion-27 {
   display: block;
   position: relative;
   font-size: 13px;
@@ -1985,7 +2155,7 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   width: 100%;
 }
 
-.emotion-23 {
+.emotion-24 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -1996,11 +2166,11 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   font-weight: 700;
 }
 
-.emotion-23 > * + * {
+.emotion-24 > * + * {
   margin-left: 20px;
 }
 
-.emotion-18 {
+.emotion-19 {
   display: inline-block;
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
@@ -2010,12 +2180,12 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   color: #999999;
 }
 
-.emotion-18 svg path {
+.emotion-19 svg path {
   fill: #1EA7FD;
 }
 
-.emotion-18:hover,
-.emotion-18:focus {
+.emotion-19:hover,
+.emotion-19:focus {
   cursor: pointer;
   -webkit-transform: translate3d(0,-1px,0);
   -ms-transform: translate3d(0,-1px,0);
@@ -2023,23 +2193,23 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   color: #0297f5;
 }
 
-.emotion-18:hover svg path,
-.emotion-18:focus svg path {
+.emotion-19:hover svg path,
+.emotion-19:focus svg path {
   fill: #0297f5;
 }
 
-.emotion-18:active {
+.emotion-19:active {
   -webkit-transform: translate3d(0,0,0);
   -ms-transform: translate3d(0,0,0);
   transform: translate3d(0,0,0);
   color: #028ee6;
 }
 
-.emotion-18:active svg path {
+.emotion-19:active svg path {
   fill: #028ee6;
 }
 
-.emotion-18 svg {
+.emotion-19 svg {
   display: inline-block;
   height: 1em;
   width: 1em;
@@ -2049,37 +2219,37 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   margin-right: 0.4em;
 }
 
-.emotion-18 svg path {
+.emotion-19 svg path {
   fill: #999999;
 }
 
-.emotion-18:hover {
+.emotion-19:hover {
   color: #666666;
 }
 
-.emotion-18:hover svg path {
+.emotion-19:hover svg path {
   fill: #666666;
 }
 
-.emotion-18:active {
+.emotion-19:active {
   color: #444444;
 }
 
-.emotion-18:active svg path {
+.emotion-19:active svg path {
   fill: #444444;
 }
 
-.emotion-25 {
+.emotion-26 {
   display: block;
 }
 
-.emotion-24 {
+.emotion-25 {
   padding: 3rem 20px;
   max-width: 600px;
   margin: 0 auto;
 }
 
-.emotion-8 {
+.emotion-9 {
   margin-bottom: 20px;
   font-size: 28px;
   font-weight: 900;
@@ -2093,24 +2263,23 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   display: flex;
 }
 
-.emotion-8 > svg {
+.emotion-9 > svg {
   height: 32px;
   width: auto;
   margin-right: 8px;
 }
 
-.emotion-9 {
+.emotion-10 {
   background: #EAF3FC;
   color: #333333;
   font-weight: 700;
-  height: 40px;
   padding: 10px 20px;
   margin-bottom: 24px;
   border: 1px solid rgba(0,0,0,.1);
   text-align: center;
 }
 
-.emotion-15 {
+.emotion-16 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -2121,7 +2290,7 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   justify-content: space-between;
 }
 
-.emotion-10 {
+.emotion-11 {
   -webkit-letter-spacing: 0.35em;
   -moz-letter-spacing: 0.35em;
   -ms-letter-spacing: 0.35em;
@@ -2133,7 +2302,7 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   color: #999999;
 }
 
-.emotion-14 {
+.emotion-15 {
   display: inline-block;
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
@@ -2144,12 +2313,12 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   font-size: 12px;
 }
 
-.emotion-14 svg path {
+.emotion-15 svg path {
   fill: #1EA7FD;
 }
 
-.emotion-14:hover,
-.emotion-14:focus {
+.emotion-15:hover,
+.emotion-15:focus {
   cursor: pointer;
   -webkit-transform: translate3d(0,-1px,0);
   -ms-transform: translate3d(0,-1px,0);
@@ -2157,23 +2326,23 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   color: #0297f5;
 }
 
-.emotion-14:hover svg path,
-.emotion-14:focus svg path {
+.emotion-15:hover svg path,
+.emotion-15:focus svg path {
   fill: #0297f5;
 }
 
-.emotion-14:active {
+.emotion-15:active {
   -webkit-transform: translate3d(0,0,0);
   -ms-transform: translate3d(0,0,0);
   transform: translate3d(0,0,0);
   color: #028ee6;
 }
 
-.emotion-14:active svg path {
+.emotion-15:active svg path {
   fill: #028ee6;
 }
 
-.emotion-14 svg {
+.emotion-15 svg {
   display: inline-block;
   height: 1em;
   width: 1em;
@@ -2183,27 +2352,27 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   margin-right: 0.4em;
 }
 
-.emotion-14 svg path {
+.emotion-15 svg path {
   fill: #999999;
 }
 
-.emotion-14:hover {
+.emotion-15:hover {
   color: #666666;
 }
 
-.emotion-14:hover svg path {
+.emotion-15:hover svg path {
   fill: #666666;
 }
 
-.emotion-14:active {
+.emotion-15:active {
   color: #444444;
 }
 
-.emotion-14:active svg path {
+.emotion-15:active svg path {
   fill: #444444;
 }
 
-.emotion-13 > svg:last-of-type {
+.emotion-14 > svg:last-of-type {
   height: 0.7em;
   width: 0.7em;
   margin-right: 0;
@@ -2212,39 +2381,39 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   vertical-align: inherit;
 }
 
-.emotion-16 {
+.emotion-17 {
   font-size: 14px;
   line-height: 1.6;
 }
 
-.emotion-16 h1 {
+.emotion-17 h1 {
   font-size: 32px;
   font-weight: 900;
 }
 
-.emotion-16 h2 {
+.emotion-17 h2 {
   font-size: 24px;
   border-bottom: 1px solid rgba(0,0,0,.1);
 }
 
-.emotion-16 h3 {
+.emotion-17 h3 {
   font-size: 20px;
 }
 
-.emotion-16 h4 {
+.emotion-17 h4 {
   font-size: 16px;
 }
 
-.emotion-16 h5 {
+.emotion-17 h5 {
   font-size: 14px;
 }
 
-.emotion-16 h6 {
+.emotion-17 h6 {
   font-size: 14px;
   color: #666666;
 }
 
-.emotion-16 pre:not(.hljs) {
+.emotion-17 pre:not(.hljs) {
   background: transparent;
   border: none;
   border-radius: 0;
@@ -2252,8 +2421,8 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   margin: 0;
 }
 
-.emotion-16 pre pre,
-.emotion-16 pre.hljs {
+.emotion-17 pre pre,
+.emotion-17 pre.hljs {
   padding: 15px;
   margin: 0;
   overflow: auto;
@@ -2263,13 +2432,13 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   line-height: 19px;
 }
 
-.emotion-16 pre pre code,
-.emotion-16 pre.hljs code {
+.emotion-17 pre pre code,
+.emotion-17 pre.hljs code {
   color: inherit;
   font-size: inherit;
 }
 
-.emotion-16 pre code {
+.emotion-17 pre code {
   margin: 0;
   padding: 0;
   white-space: pre;
@@ -2277,31 +2446,31 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   background: transparent;
 }
 
-.emotion-16 pre code,
-.emotion-16 pre tt {
+.emotion-17 pre code,
+.emotion-17 pre tt {
   background-color: transparent;
   border: none;
 }
 
-.emotion-16 body > *:first-child {
+.emotion-17 body > *:first-of-type {
   margin-top: 0 !important;
 }
 
-.emotion-16 body > *:last-child {
+.emotion-17 body > *:last-child {
   margin-bottom: 0 !important;
 }
 
-.emotion-16 a {
+.emotion-17 a {
   color: #1EA7FD;
   -webkit-text-decoration: none;
   text-decoration: none;
 }
 
-.emotion-16 a.absent {
+.emotion-17 a.absent {
   color: #cc0000;
 }
 
-.emotion-16 a.anchor {
+.emotion-17 a.anchor {
   display: block;
   padding-left: 30px;
   margin-left: -30px;
@@ -2312,153 +2481,153 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   bottom: 0;
 }
 
-.emotion-16 h1,
-.emotion-16 h2,
-.emotion-16 h3,
-.emotion-16 h4,
-.emotion-16 h5,
-.emotion-16 h6 {
+.emotion-17 h1,
+.emotion-17 h2,
+.emotion-17 h3,
+.emotion-17 h4,
+.emotion-17 h5,
+.emotion-17 h6 {
   margin: 20px 0 10px;
   padding: 0;
   cursor: text;
   position: relative;
 }
 
-.emotion-16 h2:first-child,
-.emotion-16 h1:first-child,
-.emotion-16 h1:first-child + h2,
-.emotion-16 h3:first-child,
-.emotion-16 h4:first-child,
-.emotion-16 h5:first-child,
-.emotion-16 h6:first-child {
+.emotion-17 h2:first-of-type,
+.emotion-17 h1:first-of-type,
+.emotion-17 h1:first-of-type + h2,
+.emotion-17 h3:first-of-type,
+.emotion-17 h4:first-of-type,
+.emotion-17 h5:first-of-type,
+.emotion-17 h6:first-of-type {
   margin-top: 0;
   padding-top: 0;
 }
 
-.emotion-16 h1:hover a.anchor,
-.emotion-16 h2:hover a.anchor,
-.emotion-16 h3:hover a.anchor,
-.emotion-16 h4:hover a.anchor,
-.emotion-16 h5:hover a.anchor,
-.emotion-16 h6:hover a.anchor {
+.emotion-17 h1:hover a.anchor,
+.emotion-17 h2:hover a.anchor,
+.emotion-17 h3:hover a.anchor,
+.emotion-17 h4:hover a.anchor,
+.emotion-17 h5:hover a.anchor,
+.emotion-17 h6:hover a.anchor {
   -webkit-text-decoration: none;
   text-decoration: none;
 }
 
-.emotion-16 h1 tt,
-.emotion-16 h1 code {
+.emotion-17 h1 tt,
+.emotion-17 h1 code {
   font-size: inherit;
 }
 
-.emotion-16 h2 tt,
-.emotion-16 h2 code {
+.emotion-17 h2 tt,
+.emotion-17 h2 code {
   font-size: inherit;
 }
 
-.emotion-16 h3 tt,
-.emotion-16 h3 code {
+.emotion-17 h3 tt,
+.emotion-17 h3 code {
   font-size: inherit;
 }
 
-.emotion-16 h4 tt,
-.emotion-16 h4 code {
+.emotion-17 h4 tt,
+.emotion-17 h4 code {
   font-size: inherit;
 }
 
-.emotion-16 h5 tt,
-.emotion-16 h5 code {
+.emotion-17 h5 tt,
+.emotion-17 h5 code {
   font-size: inherit;
 }
 
-.emotion-16 h6 tt,
-.emotion-16 h6 code {
+.emotion-17 h6 tt,
+.emotion-17 h6 code {
   font-size: inherit;
 }
 
-.emotion-16 p,
-.emotion-16 blockquote,
-.emotion-16 ul,
-.emotion-16 ol,
-.emotion-16 dl,
-.emotion-16 li,
-.emotion-16 table,
-.emotion-16 pre {
+.emotion-17 p,
+.emotion-17 blockquote,
+.emotion-17 ul,
+.emotion-17 ol,
+.emotion-17 dl,
+.emotion-17 li,
+.emotion-17 table,
+.emotion-17 pre {
   margin: 15px 0;
 }
 
-.emotion-16 hr {
+.emotion-17 hr {
   border: 0 none;
   color: rgba(0,0,0,.1);
   height: 4px;
   padding: 0;
 }
 
-.emotion-16 body > h2:first-child {
+.emotion-17 body > h2:first-of-type {
   margin-top: 0;
   padding-top: 0;
 }
 
-.emotion-16 body > h1:first-child {
+.emotion-17 body > h1:first-of-type {
   margin-top: 0;
   padding-top: 0;
 }
 
-.emotion-16 body > h1:first-child + h2 {
+.emotion-17 body > h1:first-of-type + h2 {
   margin-top: 0;
   padding-top: 0;
 }
 
-.emotion-16 body > h3:first-child,
-.emotion-16 body > h4:first-child,
-.emotion-16 body > h5:first-child,
-.emotion-16 body > h6:first-child {
+.emotion-17 body > h3:first-of-type,
+.emotion-17 body > h4:first-of-type,
+.emotion-17 body > h5:first-of-type,
+.emotion-17 body > h6:first-of-type {
   margin-top: 0;
   padding-top: 0;
 }
 
-.emotion-16 a:first-child h1,
-.emotion-16 a:first-child h2,
-.emotion-16 a:first-child h3,
-.emotion-16 a:first-child h4,
-.emotion-16 a:first-child h5,
-.emotion-16 a:first-child h6 {
+.emotion-17 a:first-of-type h1,
+.emotion-17 a:first-of-type h2,
+.emotion-17 a:first-of-type h3,
+.emotion-17 a:first-of-type h4,
+.emotion-17 a:first-of-type h5,
+.emotion-17 a:first-of-type h6 {
   margin-top: 0;
   padding-top: 0;
 }
 
-.emotion-16 h1 p,
-.emotion-16 h2 p,
-.emotion-16 h3 p,
-.emotion-16 h4 p,
-.emotion-16 h5 p,
-.emotion-16 h6 p {
+.emotion-17 h1 p,
+.emotion-17 h2 p,
+.emotion-17 h3 p,
+.emotion-17 h4 p,
+.emotion-17 h5 p,
+.emotion-17 h6 p {
   margin-top: 0;
 }
 
-.emotion-16 li p.first {
+.emotion-17 li p.first {
   display: inline-block;
 }
 
-.emotion-16 ul,
-.emotion-16 ol {
+.emotion-17 ul,
+.emotion-17 ol {
   padding-left: 30px;
 }
 
-.emotion-16 ul :first-child,
-.emotion-16 ol :first-child {
+.emotion-17 ul :first-of-type,
+.emotion-17 ol :first-of-type {
   margin-top: 0;
 }
 
-.emotion-16 ul :last-child,
-.emotion-16 ol :last-child {
+.emotion-17 ul :last-child,
+.emotion-17 ol :last-child {
   margin-bottom: 0;
 }
 
-.emotion-16 dl {
+.emotion-17 dl {
   padding: 0;
 }
 
-.emotion-16 dl dt {
+.emotion-17 dl dt {
   font-size: 14px;
   font-weight: bold;
   font-style: italic;
@@ -2466,62 +2635,62 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   margin: 15px 0 5px;
 }
 
-.emotion-16 dl dt:first-child {
+.emotion-17 dl dt:first-of-type {
   padding: 0;
 }
 
-.emotion-16 dl dt > :first-child {
+.emotion-17 dl dt > :first-of-type {
   margin-top: 0;
 }
 
-.emotion-16 dl dt > :last-child {
+.emotion-17 dl dt > :last-child {
   margin-bottom: 0;
 }
 
-.emotion-16 dl dd {
+.emotion-17 dl dd {
   margin: 0 0 15px;
   padding: 0 15px;
 }
 
-.emotion-16 dl dd > :first-child {
+.emotion-17 dl dd > :first-of-type {
   margin-top: 0;
 }
 
-.emotion-16 dl dd > :last-child {
+.emotion-17 dl dd > :last-child {
   margin-bottom: 0;
 }
 
-.emotion-16 blockquote {
+.emotion-17 blockquote {
   border-left: 4px solid #DDDDDD;
   padding: 0 15px;
   color: #666666;
 }
 
-.emotion-16 blockquote > :first-child {
+.emotion-17 blockquote > :first-of-type {
   margin-top: 0;
 }
 
-.emotion-16 blockquote > :last-child {
+.emotion-17 blockquote > :last-child {
   margin-bottom: 0;
 }
 
-.emotion-16 table {
+.emotion-17 table {
   padding: 0;
   border-collapse: collapse;
 }
 
-.emotion-16 table tr {
+.emotion-17 table tr {
   border-top: 1px solid rgba(0,0,0,.1);
   background-color: white;
   margin: 0;
   padding: 0;
 }
 
-.emotion-16 table tr:nth-child(2n) {
+.emotion-17 table tr:nth-of-type(2n) {
   background-color: #F8F8F8;
 }
 
-.emotion-16 table tr th {
+.emotion-17 table tr th {
   font-weight: bold;
   border: 1px solid rgba(0,0,0,.1);
   text-align: left;
@@ -2529,33 +2698,33 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   padding: 6px 13px;
 }
 
-.emotion-16 table tr td {
+.emotion-17 table tr td {
   border: 1px solid rgba(0,0,0,.1);
   text-align: left;
   margin: 0;
   padding: 6px 13px;
 }
 
-.emotion-16 table tr th :first-child,
-.emotion-16 table tr td :first-child {
+.emotion-17 table tr th :first-of-type,
+.emotion-17 table tr td :first-of-type {
   margin-top: 0;
 }
 
-.emotion-16 table tr th :last-child,
-.emotion-16 table tr td :last-child {
+.emotion-17 table tr th :last-child,
+.emotion-17 table tr td :last-child {
   margin-bottom: 0;
 }
 
-.emotion-16 img {
+.emotion-17 img {
   max-width: 100%;
 }
 
-.emotion-16 span.frame {
+.emotion-17 span.frame {
   display: block;
   overflow: hidden;
 }
 
-.emotion-16 span.frame > span {
+.emotion-17 span.frame > span {
   border: 1px solid #DDDDDD;
   display: block;
   float: left;
@@ -2565,81 +2734,81 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   width: auto;
 }
 
-.emotion-16 span.frame span img {
+.emotion-17 span.frame span img {
   display: block;
   float: left;
 }
 
-.emotion-16 span.frame span span {
+.emotion-17 span.frame span span {
   clear: both;
   color: #333333;
   display: block;
   padding: 5px 0 0;
 }
 
-.emotion-16 span.align-center {
+.emotion-17 span.align-center {
   display: block;
   overflow: hidden;
   clear: both;
 }
 
-.emotion-16 span.align-center > span {
+.emotion-17 span.align-center > span {
   display: block;
   overflow: hidden;
   margin: 13px auto 0;
   text-align: center;
 }
 
-.emotion-16 span.align-center span img {
+.emotion-17 span.align-center span img {
   margin: 0 auto;
   text-align: center;
 }
 
-.emotion-16 span.align-right {
+.emotion-17 span.align-right {
   display: block;
   overflow: hidden;
   clear: both;
 }
 
-.emotion-16 span.align-right > span {
+.emotion-17 span.align-right > span {
   display: block;
   overflow: hidden;
   margin: 13px 0 0;
   text-align: right;
 }
 
-.emotion-16 span.align-right span img {
+.emotion-17 span.align-right span img {
   margin: 0;
   text-align: right;
 }
 
-.emotion-16 span.float-left {
+.emotion-17 span.float-left {
   display: block;
   margin-right: 13px;
   overflow: hidden;
   float: left;
 }
 
-.emotion-16 span.float-left span {
+.emotion-17 span.float-left span {
   margin: 13px 0 0;
 }
 
-.emotion-16 span.float-right {
+.emotion-17 span.float-right {
   display: block;
   margin-left: 13px;
   overflow: hidden;
   float: right;
 }
 
-.emotion-16 span.float-right > span {
+.emotion-17 span.float-right > span {
   display: block;
   overflow: hidden;
   margin: 13px auto 0;
   text-align: right;
 }
 
-.emotion-16 code,
-.emotion-16 tt {
+.emotion-17 code,
+.emotion-17 tt {
   margin: 0 2px;
   padding: 0 5px;
   white-space: nowrap;
@@ -2649,57 +2818,65 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
 }
 
 <div
-  class="emotion-27"
+  class="emotion-28"
+  title="wrapper"
 >
   <div
-    class="emotion-7"
+    class="emotion-8"
+    title="bar"
   >
     <div
-      class="emotion-2"
+      class="emotion-7"
     >
       <div
-        class="emotion-1"
-        role="tablist"
+        class="emotion-2"
+        title="side left"
+      >
+        <div
+          class="emotion-1"
+          role="tablist"
+        >
+          <button
+            class="emotion-0"
+            role="tab"
+            type="button"
+          >
+            About
+          </button>
+        </div>
+      </div>
+      <div
+        class="emotion-6"
+        title="side right"
       >
         <button
-          class="emotion-0"
-          role="tab"
-          type="button"
+          class="emotion-5"
         >
-          About
+          <svg
+            class="emotion-4"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-3"
+              d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
+            />
+          </svg>
         </button>
       </div>
     </div>
-    <div
-      class="emotion-6"
-    >
-      <button
-        class="emotion-5"
-      >
-        <svg
-          class="emotion-4"
-          viewBox="0 0 1024 1024"
-        >
-          <path
-            class="emotion-3"
-            d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
-          />
-        </svg>
-      </button>
-    </div>
   </div>
   <div
-    class="emotion-26"
+    class="emotion-27"
   >
     <div
-      class="emotion-25"
+      class="emotion-26"
       role="tabpanel"
     >
       <div
-        class="emotion-24"
+        class="emotion-25"
       >
         <header
-          class="emotion-8"
+          class="emotion-9"
         >
           <svg
             title="Storybook icon"
@@ -2734,25 +2911,25 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
           Storybook 5.0.0
         </header>
         <div
-          class="emotion-9"
+          class="emotion-10"
         >
           Looking good! You're up to date.
         </div>
         <div
-          class="emotion-15"
+          class="emotion-16"
         >
           <span
-            class="emotion-10"
+            class="emotion-11"
           >
             5.0.0 Changelog
           </span>
           <a
-            class="emotion-14"
+            class="emotion-15"
             href="https://github.com/storybooks/storybook/blob/master/CHANGELOG.md"
             target="_blank"
           >
             <span
-              class="emotion-13"
+              class="emotion-14"
             >
               Read full changelog
               <svg
@@ -2768,7 +2945,7 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
           </a>
         </div>
         <div
-          class="emotion-16"
+          class="emotion-17"
         >
           <ul>
             <li>
@@ -2789,34 +2966,34 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
           </ul>
         </div>
         <div
-          class="emotion-23"
+          class="emotion-24"
         >
           <a
-            class="emotion-18"
+            class="emotion-19"
             href="https://storybook.js.org"
           >
             <span
-              class="emotion-17"
+              class="emotion-18"
             >
               Docs
             </span>
           </a>
           <a
-            class="emotion-18"
+            class="emotion-19"
             href="https://github.com/storybooks/storybook"
           >
             <span
-              class="emotion-17"
+              class="emotion-18"
             >
               GitHub
             </span>
           </a>
           <a
-            class="emotion-18"
+            class="emotion-19"
             href="https://storybook.js.org/support"
           >
             <span
-              class="emotion-17"
+              class="emotion-18"
             >
               Support
             </span>
diff --git a/lib/ui/src/settings/about.js b/lib/ui/src/settings/about.js
index 453f2c45a6a..f7df688fe5f 100644
--- a/lib/ui/src/settings/about.js
+++ b/lib/ui/src/settings/about.js
@@ -65,7 +65,6 @@ const UpdateMessage = styled.div(
 
   ({ theme }) => ({
     fontWeight: theme.typography.weight.bold,
-    height: 40,
     padding: '10px 20px',
     marginBottom: 24,
     borderRadius: theme.borderRadius,
diff --git a/yarn.lock b/yarn.lock
index c65ca1dc8e7..85e93abf679 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -12,7 +12,6 @@
 "@angular-devkit/architect@0.13.0":
   version "0.13.0"
   resolved "https://registry.yarnpkg.com/@angular-devkit/architect/-/architect-0.13.0.tgz#47a9c76ca4c01c357a8670810f29a45e906447cd"
-  integrity sha512-oDBrWlfKh/0t2ag4T8gz9xzPMItxfctinlsHxhw7dPQ+etq1mIcWgQkiKiDrz4l46YiGipBRlC55j+6f37omAA==
   dependencies:
     "@angular-devkit/core" "7.3.0"
     rxjs "6.3.3"
@@ -100,7 +99,6 @@
 "@angular-devkit/core@7.3.0":
   version "7.3.0"
   resolved "https://registry.yarnpkg.com/@angular-devkit/core/-/core-7.3.0.tgz#fc272e39b4c307833e9a7db77007418a246f5410"
-  integrity sha512-b0qtAUpgqLpWY8W6vWRv1aj6bXkZCP1rvywl8i8TbGMY67CWRcy5J3fNAMmjiZS+LJixFlIXYf4iOydglyJMfg==
   dependencies:
     ajv "6.7.0"
     chokidar "2.0.4"
@@ -111,7 +109,6 @@
 "@angular-devkit/schematics@7.3.0":
   version "7.3.0"
   resolved "https://registry.yarnpkg.com/@angular-devkit/schematics/-/schematics-7.3.0.tgz#112c1f59ff2778157aff6fb7484a6c132d4156ac"
-  integrity sha512-glOduymftH0LmJhITWgWUJK8QCDUltgTZ943/OyArIvLXTLL/8zCb+G6xL+3k33EQjwJicgQ3WIjonJmeTK/Ww==
   dependencies:
     "@angular-devkit/core" "7.3.0"
     rxjs "6.3.3"
@@ -119,7 +116,6 @@
 "@angular/cli@^7.3.0":
   version "7.3.0"
   resolved "https://registry.yarnpkg.com/@angular/cli/-/cli-7.3.0.tgz#8f9301aa7a942385258b35bf86806267073fce17"
-  integrity sha512-6+NoHsW1MYG7GBHUg71zaWIFeIRps/SVksCmRFCpW0RXqErCQmzf0GZuDTZZ2Yo4RzU01150sVp1R8wEvEZfZQ==
   dependencies:
     "@angular-devkit/architect" "0.13.0"
     "@angular-devkit/core" "7.3.0"
@@ -160,7 +156,6 @@
 "@angular/compiler@^7.2.3":
   version "7.2.3"
   resolved "https://registry.yarnpkg.com/@angular/compiler/-/compiler-7.2.3.tgz#ffa89911750342c5e4f0359d6e9402479dd6e7bd"
-  integrity sha512-UM6n4MyZkR5+VVjlwhLH8IfqdWBkdFcF5at4ckJXOJ/gkIUq97irbis9pGj1b0TO7MAl8uhF4b68xe5lk8b49g==
   dependencies:
     tslib "^1.9.0"
 
@@ -501,7 +496,6 @@
 "@babel/plugin-proposal-object-rest-spread@^7.0.0", "@babel/plugin-proposal-object-rest-spread@^7.3.1", "@babel/plugin-proposal-object-rest-spread@^7.3.2":
   version "7.3.2"
   resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-object-rest-spread/-/plugin-proposal-object-rest-spread-7.3.2.tgz#6d1859882d4d778578e41f82cc5d7bf3d5daf6c1"
-  integrity sha512-DjeMS+J2+lpANkYLLO+m6GjoTMygYglKmRe6cDTbFv3L9i6mmiE8fe6B8MtCSLZpVXscD5kn7s6SgtHrDoBWoA==
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
     "@babel/plugin-syntax-object-rest-spread" "^7.2.0"
@@ -1045,7 +1039,6 @@
 "@babel/runtime@^7.0.0", "@babel/runtime@^7.1.2", "@babel/runtime@^7.1.5", "@babel/runtime@^7.2.0":
   version "7.3.1"
   resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.3.1.tgz#574b03e8e8a9898eaf4a872a92ea20b7846f6f2a"
-  integrity sha512-7jGW8ppV0ant637pIqAcFfQDDH1orEPGJb8aXfUozuCU3QqX7rX4DA8iwrbPrR1hcH0FTTHz47yQnk+bl5xHQA==
   dependencies:
     regenerator-runtime "^0.12.0"
 
@@ -1103,7 +1096,6 @@
 "@ember/test-helpers@^1.3.1":
   version "1.3.1"
   resolved "https://registry.yarnpkg.com/@ember/test-helpers/-/test-helpers-1.3.1.tgz#575b30f4b74c888ea8510c6adffb855876c93a3d"
-  integrity sha512-j/o5ouq/i64PHkpkcq5Ji26cqxezHhMFRIiehdBmJQo/dVI3gAEsJJh0+qeDD8MrT8WhFT9oqLcicfjEWDEvaA==
   dependencies:
     broccoli-debug "^0.6.5"
     broccoli-funnel "^2.0.1"
@@ -1174,7 +1166,6 @@
 "@emotion/serialize@^0.11.3", "@emotion/serialize@^0.11.4":
   version "0.11.4"
   resolved "https://registry.yarnpkg.com/@emotion/serialize/-/serialize-0.11.4.tgz#691e615184a23cd3b9ae9b1eaa79eb8798e52379"
-  integrity sha512-JKmn+Qnc8f6OZKSHmNq1RpO27raIi6Kj0uqBaSOUVMW6NI0M3wLpV4pK5hZO4I+1WuCC39hOBPgQ/GcgoHbDeg==
   dependencies:
     "@emotion/hash" "0.7.1"
     "@emotion/memoize" "0.7.1"
@@ -1843,7 +1834,6 @@
 "@ngrx/store@^7.2.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@ngrx/store/-/store-7.2.0.tgz#b22200fd48b721afe0e5cc9eec92f3dc31c078b1"
-  integrity sha512-E9c0cDot0HeE0mXyeqw18SwmJ2+eKnA5mMMfwvoskpMInCYGI2pq1i6/lCVQ2wrEHSH+KvObK4PQbepcA9vP+w==
 
 "@ngtools/webpack@7.1.4":
   version "7.1.4"
@@ -1871,7 +1861,6 @@
 "@octokit/request@2.3.0":
   version "2.3.0"
   resolved "https://registry.yarnpkg.com/@octokit/request/-/request-2.3.0.tgz#da2672308bcf0b9376ef66f51bddbe5eb87cc00a"
-  integrity sha512-5YRqYNZOAaL7+nt7w3Scp6Sz4P2g7wKFP9npx1xdExMomk8/M/ICXVLYVam2wzxeY0cIc6wcKpjC5KI4jiNbGw==
   dependencies:
     "@octokit/endpoint" "^3.1.1"
     is-plain-object "^2.0.4"
@@ -1892,7 +1881,6 @@
 "@octokit/rest@^16.14.1":
   version "16.15.0"
   resolved "https://registry.yarnpkg.com/@octokit/rest/-/rest-16.15.0.tgz#648a88d5de055bcf38976709c5b2bdf1227b926f"
-  integrity sha512-Un+e7rgh38RtPOTe453pT/KPM/p2KZICimBmuZCd2wEo8PacDa4h6RqTPZs+f2DPazTTqdM7QU4LKlUjgiBwWw==
   dependencies:
     "@octokit/request" "2.3.0"
     before-after-hook "^1.2.0"
@@ -1927,7 +1915,6 @@
 "@schematics/angular@7.3.0":
   version "7.3.0"
   resolved "https://registry.yarnpkg.com/@schematics/angular/-/angular-7.3.0.tgz#0ed0af8250f767ceb42a3f658888697d95381569"
-  integrity sha512-fOjP/3Rz+Nqrgc+YVaiN88uhPX0FZgUjmMKgMp06lc3xmoc1ScGxoz8AF1fV50Zkvh0Etykzy1LTUczzEUJQqw==
   dependencies:
     "@angular-devkit/core" "7.3.0"
     "@angular-devkit/schematics" "7.3.0"
@@ -1936,7 +1923,6 @@
 "@schematics/update@0.13.0":
   version "0.13.0"
   resolved "https://registry.yarnpkg.com/@schematics/update/-/update-0.13.0.tgz#d8f7336da8d80d2fd9cecc3d0c97f31295fedb52"
-  integrity sha512-HGpZdIL/0w46UyaxpnIAg6SBwzKfaRixHIEihmgJUqA0DG8GZUixRPr1L0YIWC1EZ81cQ+yWL85XhkKBYR+wQg==
   dependencies:
     "@angular-devkit/core" "7.3.0"
     "@angular-devkit/schematics" "7.3.0"
@@ -1950,7 +1936,6 @@
 "@sheerun/mutationobserver-shim@^0.3.2":
   version "0.3.2"
   resolved "https://registry.yarnpkg.com/@sheerun/mutationobserver-shim/-/mutationobserver-shim-0.3.2.tgz#8013f2af54a2b7d735f71560ff360d3a8176a87b"
-  integrity sha512-vTCdPp/T/Q3oSqwHmZ5Kpa9oI7iLtGl3RQaA/NyLHikvcrPxACkkKVr/XzkSPJWXHRhKGzVvb0urJsbMlRxi1Q==
 
 "@storybook/addons@5.0.0-beta.4":
   version "5.0.0-beta.4"
@@ -2494,7 +2479,6 @@
 "@types/webpack-env@*", "@types/webpack-env@^1.13.7":
   version "1.13.7"
   resolved "https://registry.yarnpkg.com/@types/webpack-env/-/webpack-env-1.13.7.tgz#137a4e57aa31ab57b1baf66f5dc3b6bf085e9944"
-  integrity sha512-rzi6fw7hhxPcCoNVsgysHFlKnhYYvVj7AJwdAO0HQNP5vg9sY0DoRRC1pfuCQm94cOa1sab82HGUtdFlWHIhBg==
 
 "@vue/component-compiler-utils@^2.5.1":
   version "2.5.1"
@@ -3392,7 +3376,6 @@ ast-types-flow@0.0.7, ast-types-flow@^0.0.7:
 ast-types@0.11.3:
   version "0.11.3"
   resolved "https://registry.yarnpkg.com/ast-types/-/ast-types-0.11.3.tgz#c20757fe72ee71278ea0ff3d87e5c2ca30d9edf8"
-  integrity sha512-XA5o5dsNw8MhyW0Q7MWXJWc4oOzZKbdsEJq45h7c8q/d9DwWZ5F2ugUc1PuMLPGsUnphCt/cNDHu8JeBbxf1qA==
 
 ast-types@0.11.7:
   version "0.11.7"
@@ -3815,7 +3798,6 @@ babel-plugin-ember-modules-api-polyfill@^2.6.0:
 babel-plugin-emotion@^10.0.6, babel-plugin-emotion@^10.0.7:
   version "10.0.7"
   resolved "https://registry.yarnpkg.com/babel-plugin-emotion/-/babel-plugin-emotion-10.0.7.tgz#3634ada6dee762140f27db07387feaec8d2cb619"
-  integrity sha512-5PdLJYme3tFN97M3tBbEUS/rJVkS9EMbo7rs7/7BAUEUVMWehm1kb5DEbp16Rs+UsI3rTXRan1iqpL022T8XxA==
   dependencies:
     "@babel/helper-module-imports" "^7.0.0"
     "@emotion/hash" "0.7.1"
@@ -3980,7 +3962,6 @@ babel-plugin-named-asset-import@^0.3.0:
 babel-plugin-react-docgen@^2.0.2:
   version "2.0.2"
   resolved "https://registry.yarnpkg.com/babel-plugin-react-docgen/-/babel-plugin-react-docgen-2.0.2.tgz#3307e27414c370365710576b7fadbcaf8984d862"
-  integrity sha512-fFendfUUU2KqqE1ki2NyQoZm4uHPoEWPUgBZiPBiowcPZos+4q+chdQh0nlwY5hxs08AMHSH4Pp98RQL0VFS/g==
   dependencies:
     lodash "^4.17.10"
     react-docgen "^3.0.0"
@@ -5652,7 +5633,6 @@ case-sensitive-paths-webpack-plugin@2.1.2:
 case-sensitive-paths-webpack-plugin@^2.2.0:
   version "2.2.0"
   resolved "https://registry.yarnpkg.com/case-sensitive-paths-webpack-plugin/-/case-sensitive-paths-webpack-plugin-2.2.0.tgz#3371ef6365ef9c25fa4b81c16ace0e9c7dc58c3e"
-  integrity sha512-u5ElzokS8A1pm9vM3/iDgTcI3xqHxuCao94Oz8etI3cf0Tio0p8izkDYbTIn09uP3yUUr6+veaE6IkjnTYS46g==
 
 caseless@~0.12.0:
   version "0.12.0"
@@ -5699,7 +5679,6 @@ chalk@^2.0.0, chalk@^2.0.1, chalk@^2.1.0, chalk@^2.3.0, chalk@^2.3.1, chalk@^2.3
 change-emitter@^0.1.2:
   version "0.1.6"
   resolved "https://registry.yarnpkg.com/change-emitter/-/change-emitter-0.1.6.tgz#e8b2fe3d7f1ab7d69a32199aff91ea6931409515"
-  integrity sha1-6LL+PX8at9aaMhma/5HqaTFAlRU=
 
 char-props@^0.1.5, char-props@~0.1.5:
   version "0.1.5"
@@ -7320,7 +7299,6 @@ dom-serializer@0, dom-serializer@~0.1.0:
 dom-testing-library@^3.13.1:
   version "3.16.5"
   resolved "https://registry.yarnpkg.com/dom-testing-library/-/dom-testing-library-3.16.5.tgz#8c71f127c6b4ee48115660798040291b59dfc894"
-  integrity sha512-t3OaTcDdsAqtAZNeZ13KnOJmt+2HaDJqYWyf0iBRzbG6GwrNtpF0122Ygu/qkerIwcnHMX1ihwZVx/DhaLpmTw==
   dependencies:
     "@babel/runtime" "^7.1.5"
     "@sheerun/mutationobserver-shim" "^0.3.2"
@@ -7561,7 +7539,6 @@ ember-cli-babel@^6.12.0, ember-cli-babel@^6.16.0, ember-cli-babel@^6.8.1:
 ember-cli-babel@^7.0.0, ember-cli-babel@^7.1.2, ember-cli-babel@^7.1.3, ember-cli-babel@^7.4.0, ember-cli-babel@^7.4.1:
   version "7.4.1"
   resolved "https://registry.yarnpkg.com/ember-cli-babel/-/ember-cli-babel-7.4.1.tgz#9892f5883f5a6b1f0f86fb1331fc491338f372ad"
-  integrity sha512-h6qZKHyULm5SYhvjNOeXvLl3kHaBdh37g5QqTTiC/vMiWP/xnyNp2bMoq52qq+SLm/bE8+5UcVTKjrNl0+IqXA==
   dependencies:
     "@babel/core" "^7.0.0"
     "@babel/plugin-transform-modules-amd" "^7.0.0"
@@ -7823,7 +7800,6 @@ ember-router-generator@^1.2.3:
 ember-source@~3.7.3:
   version "3.7.3"
   resolved "https://registry.yarnpkg.com/ember-source/-/ember-source-3.7.3.tgz#ae66f5c37d928908d2cc6891dab46d24a8168678"
-  integrity sha512-K+jUCR0Q4ef71bBJnq380e0TgsE1KSDP430n3c/vA07HMnvg3BCakpy21TUJuGxpH07Jeuf7HNehI0ZHyIiW/w==
   dependencies:
     broccoli-funnel "^2.0.1"
     broccoli-merge-trees "^3.0.2"
@@ -7950,7 +7926,6 @@ env-ci@^2.1.0:
 enzyme-adapter-react-16@^1.9.1:
   version "1.9.1"
   resolved "https://registry.yarnpkg.com/enzyme-adapter-react-16/-/enzyme-adapter-react-16-1.9.1.tgz#6d49a3a31c3a0fccf527610f31b837e0f307128a"
-  integrity sha512-Egzogv1y77DUxdnq/CyHxLHaNxmSSKDDSDNNB/EiAXCZVFXdFibaNy2uUuRQ1n24T2m6KH/1Rw16XDRq+1yVEg==
   dependencies:
     enzyme-adapter-utils "^1.10.0"
     function.prototype.name "^1.1.0"
@@ -8202,7 +8177,6 @@ eslint-plugin-flowtype@2.50.1:
 eslint-plugin-html@^5.0.3:
   version "5.0.3"
   resolved "https://registry.yarnpkg.com/eslint-plugin-html/-/eslint-plugin-html-5.0.3.tgz#3db133995e49a73596f6a473c16a1b83634deffd"
-  integrity sha512-46ruAnp3jVQP/5Bi5eEIOooscjUTPFU3vxCxHe/OG6ORdM7Xv5c25/Nz9fAbHklzCpiXuIiH4/mV/XBkm7MINw==
   dependencies:
     htmlparser2 "^3.10.0"
 
@@ -8224,7 +8198,6 @@ eslint-plugin-import@2.14.0:
 eslint-plugin-import@^2.16.0:
   version "2.16.0"
   resolved "https://registry.yarnpkg.com/eslint-plugin-import/-/eslint-plugin-import-2.16.0.tgz#97ac3e75d0791c4fac0e15ef388510217be7f66f"
-  integrity sha512-z6oqWlf1x5GkHIFgrSvtmudnqM6Q60KM4KvpWi5ubonMjycLjndvd5+8VAZIsTlHC03djdgJuyKG6XO577px6A==
   dependencies:
     contains-path "^0.1.0"
     debug "^2.6.9"
@@ -8240,7 +8213,6 @@ eslint-plugin-import@^2.16.0:
 eslint-plugin-jest@^22.2.2:
   version "22.2.2"
   resolved "https://registry.yarnpkg.com/eslint-plugin-jest/-/eslint-plugin-jest-22.2.2.tgz#2a80d70a20c27dfb1503a6f32cdcb647fe5476df"
-  integrity sha512-hnWgh9o39VJfz6lJEyQJdTW7dN2yynlGkmPOlU/oMHh+d7WVMsJP1GeDTB520VCDljEdKExCwD5IBpQIUl4mJg==
 
 eslint-plugin-json@^1.2.1:
   version "1.3.2"
@@ -9409,7 +9381,6 @@ fuse.js@^3.3.1:
 fuzzy-search@^3.0.1:
   version "3.0.1"
   resolved "https://registry.yarnpkg.com/fuzzy-search/-/fuzzy-search-3.0.1.tgz#14a4964508a9607d6e9a88818e7ff634108260b6"
-  integrity sha512-rjUvzdsMlOyarm0oD5k6zVQwgvt4Tb5Xe3YdIGU+Vogw54+ueAGPUTMU2B9jfPQEie5cD11i/S9J9d+MNBSQ3Q==
 
 g-status@^2.0.2:
   version "2.0.2"
@@ -9831,7 +9802,6 @@ graphql-request@^1.5.0:
 graphql@^0.13.2, graphql@^14.1.1:
   version "0.13.2"
   resolved "https://registry.yarnpkg.com/graphql/-/graphql-0.13.2.tgz#4c740ae3c222823e7004096f832e7b93b2108270"
-  integrity sha512-QZ5BL8ZO/B20VA8APauGBg3GyEgZ19eduvpLWoq5x7gMmWnHoy8rlQWPLmWgFvo1yNgjSEFMesmS4R6pPr7xog==
   dependencies:
     iterall "^1.2.1"
 
@@ -9909,7 +9879,6 @@ handle-thing@^2.0.0:
 handlebars@^4.0.1, handlebars@^4.0.11, handlebars@^4.0.2, handlebars@^4.0.3, handlebars@^4.0.4:
   version "4.1.0"
   resolved "https://registry.yarnpkg.com/handlebars/-/handlebars-4.1.0.tgz#0d6a6f34ff1f63cecec8423aa4169827bf787c3a"
-  integrity sha512-l2jRuU1NAWK6AW5qqcTATWQJvNPEwkM7NEKSiv/gqOsoSQbVoWyqVEY5GS+XPQ88zLNmqASRpzfdm8d79hJS+w==
   dependencies:
     async "^2.5.0"
     optimist "^0.6.1"
@@ -11304,7 +11273,6 @@ istextorbinary@2.1.0:
 iterall@^1.2.1:
   version "1.2.2"
   resolved "https://registry.yarnpkg.com/iterall/-/iterall-1.2.2.tgz#92d70deb8028e0c39ff3164fdbf4d8b088130cd7"
-  integrity sha512-yynBb1g+RFUPY64fTrFv7nsjRrENBQJaX2UL+2Szc9REFrSNm1rpSXHGzhmAy7a9uv3vlvgBlXnf9RqmPH1/DA==
 
 jasmine-core@~2.8.0:
   version "2.8.0"
@@ -11470,7 +11438,6 @@ jest-each@^24.0.0:
 jest-emotion@^10.0.7:
   version "10.0.7"
   resolved "https://registry.yarnpkg.com/jest-emotion/-/jest-emotion-10.0.7.tgz#c882f6e201cf62c025245f863b8e5ff473d2cef0"
-  integrity sha512-uR6KIw/jnlqVOFBHpeRMirpnWggnUluqzKYSmlp/TpoNaRxSYTGj9+RVrS7kngtyFyn0F0rOJ73CaPRuxL5ebg==
   dependencies:
     "@types/jest" "^23.0.2"
     chalk "^2.4.1"
@@ -11580,20 +11547,21 @@ jest-jasmine2@^23.6.0:
     pretty-format "^23.6.0"
 
 jest-jasmine2@^24.0.0:
-  version "24.0.0"
-  resolved "https://registry.yarnpkg.com/jest-jasmine2/-/jest-jasmine2-24.0.0.tgz#7d87be9d8b32d34ac5980ad646b7ae7f99e33a19"
+  version "24.1.0"
+  resolved "https://registry.yarnpkg.com/jest-jasmine2/-/jest-jasmine2-24.1.0.tgz#8377324b967037c440f0a549ee0bbd9912055db6"
   dependencies:
     "@babel/traverse" "^7.1.0"
     chalk "^2.0.1"
     co "^4.6.0"
-    expect "^24.0.0"
+    expect "^24.1.0"
     is-generator-fn "^2.0.0"
     jest-each "^24.0.0"
     jest-matcher-utils "^24.0.0"
     jest-message-util "^24.0.0"
-    jest-snapshot "^24.0.0"
+    jest-snapshot "^24.1.0"
     jest-util "^24.0.0"
     pretty-format "^24.0.0"
+    throat "^4.0.0"
 
 jest-leak-detector@^23.6.0:
   version "23.6.0"
@@ -11755,16 +11723,16 @@ jest-serializer@^23.0.1:
   version "23.0.1"
   resolved "https://registry.yarnpkg.com/jest-serializer/-/jest-serializer-23.0.1.tgz#a3776aeb311e90fe83fab9e533e85102bd164165"
 
-jest-snapshot@>=20.0.3, jest-snapshot@^24.0.0:
-  version "24.0.0"
-  resolved "https://registry.yarnpkg.com/jest-snapshot/-/jest-snapshot-24.0.0.tgz#fb447a753a3271660b3d89d068698014eb14c414"
+jest-snapshot@>=20.0.3:
+  version "24.1.0"
+  resolved "https://registry.yarnpkg.com/jest-snapshot/-/jest-snapshot-24.1.0.tgz#85e22f810357aa5994ab61f236617dc2205f2f5b"
   dependencies:
     "@babel/types" "^7.0.0"
     chalk "^2.0.1"
     jest-diff "^24.0.0"
     jest-matcher-utils "^24.0.0"
     jest-message-util "^24.0.0"
-    jest-resolve "^24.0.0"
+    jest-resolve "^24.1.0"
     mkdirp "^0.5.1"
     natural-compare "^1.4.0"
     pretty-format "^24.0.0"
@@ -11785,6 +11753,21 @@ jest-snapshot@^23.6.0:
     pretty-format "^23.6.0"
     semver "^5.5.0"
 
+jest-snapshot@^24.0.0:
+  version "24.0.0"
+  resolved "https://registry.yarnpkg.com/jest-snapshot/-/jest-snapshot-24.0.0.tgz#fb447a753a3271660b3d89d068698014eb14c414"
+  dependencies:
+    "@babel/types" "^7.0.0"
+    chalk "^2.0.1"
+    jest-diff "^24.0.0"
+    jest-matcher-utils "^24.0.0"
+    jest-message-util "^24.0.0"
+    jest-resolve "^24.0.0"
+    mkdirp "^0.5.1"
+    natural-compare "^1.4.0"
+    pretty-format "^24.0.0"
+    semver "^5.5.0"
+
 jest-specific-snapshot@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/jest-specific-snapshot/-/jest-specific-snapshot-1.0.0.tgz#157c79e2534a6fea820fd475f5d17740c8f90833"
@@ -12600,7 +12583,6 @@ linkify-it@^2.0.0:
 lint-staged@^8.1.3:
   version "8.1.3"
   resolved "https://registry.yarnpkg.com/lint-staged/-/lint-staged-8.1.3.tgz#bb069db5466c0fe16710216e633a84f2b362fa60"
-  integrity sha512-6TGkikL1B+6mIOuSNq2TV6oP21IhPMnV8q0cf9oYZ296ArTVNcbFh1l1pfVOHHbBIYLlziWNsQ2q45/ffmJ4AA==
   dependencies:
     "@iamstarkov/listr-update-renderer" "0.4.1"
     chalk "^2.3.1"
@@ -12675,7 +12657,6 @@ listr@^0.14.2:
 lit-html@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/lit-html/-/lit-html-1.0.0.tgz#3dc3781a8ca68a9b5c2ff2a61e263662b9b2267b"
-  integrity sha512-oeWlpLmBW3gFl7979Wol2LKITpmKTUFNn7PnFbh6YNynF61W74l6x5WhwItAwPRSATpexaX1egNnRzlN4GOtfQ==
 
 livereload-js@^2.3.0:
   version "2.4.0"
@@ -13432,7 +13413,6 @@ markdown-table@^1.1.0:
 markdown-to-jsx@^6.9.1:
   version "6.9.1"
   resolved "https://registry.yarnpkg.com/markdown-to-jsx/-/markdown-to-jsx-6.9.1.tgz#a5771d468727e282f54a15ff447bcd79fc2e619f"
-  integrity sha512-SAUZWD//gjhP3Sfy2Q7EqhNOm7YYKTfQKuiuyr8FO9fa0EPkrXSDDE3u28A5SQx6j4BJ9Zs9Va77GBMtIcgAWw==
   dependencies:
     prop-types "^15.6.2"
     unquote "^1.1.0"
@@ -15201,7 +15181,6 @@ pnp-webpack-plugin@1.1.0:
 polished@^2.3.3:
   version "2.3.3"
   resolved "https://registry.yarnpkg.com/polished/-/polished-2.3.3.tgz#bdbaba962ba8271b0e11aa287f2befd4c87be99a"
-  integrity sha512-59V4fDbdxtH4I1m9TWxFsoGJbC8nnOpUYo5uFmvMfKp9Qh+6suo4VMUle1TGIIUZIGxfkW+Rs485zPk0wcwR2Q==
   dependencies:
     "@babel/runtime" "^7.2.0"
 
@@ -15875,7 +15854,6 @@ prettier@1.16.0:
 prettier@^1.14.2, prettier@^1.16.4:
   version "1.16.4"
   resolved "https://registry.yarnpkg.com/prettier/-/prettier-1.16.4.tgz#73e37e73e018ad2db9c76742e2647e21790c9717"
-  integrity sha512-ZzWuos7TI5CKUeQAtFd6Zhm2s6EpAD/ZLApIhsF9pRvRtM1RFo61dM/4MSRUA0SuLugA/zgrZD8m0BaY46Og7g==
 
 pretty-bytes@^4.0.2:
   version "4.0.2"
@@ -16128,7 +16106,6 @@ punycode@^1.2.4, punycode@^1.3.2, punycode@^1.4.1:
 puppeteer@^1.12.0:
   version "1.12.0"
   resolved "https://registry.yarnpkg.com/puppeteer/-/puppeteer-1.12.0.tgz#325b97f42aa6cd66ae4d3d27839278e1f0b8e0e5"
-  integrity sha512-+riSxJFPQpwGZvNHFeB7vEefwfdHNSstQmjdzUKZxPp/Qt1Dw9iKRAewl8X0ntdXZz4UR4jODLiM03Iw9HDnyw==
   dependencies:
     debug "^4.1.0"
     extract-zip "^1.6.6"
@@ -16442,7 +16419,6 @@ react-docgen-typescript@^1.9.0:
 react-docgen@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/react-docgen/-/react-docgen-3.0.0.tgz#79c6e1b1870480c3c2bc1a65bede0577a11c38cd"
-  integrity sha512-2UseoLWabFNXuk1Foz4VDPSIAkxz+1Hmmq4qijzUmYHDq0ZSloKDLXtGLpQRcAi/M76hRpPtH1rV4BI5jNAOnQ==
   dependencies:
     "@babel/parser" "^7.1.3"
     "@babel/runtime" "^7.0.0"
@@ -16455,7 +16431,6 @@ react-docgen@^3.0.0:
 react-dom@^16.8.1:
   version "16.8.1"
   resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-16.8.1.tgz#ec860f98853d09d39bafd3a6f1e12389d283dbb4"
-  integrity sha512-N74IZUrPt6UiDjXaO7UbDDFXeUXnVhZzeRLy/6iqqN1ipfjrhR60Bp5NuBK+rv3GMdqdIuwIl22u1SYwf330bg==
   dependencies:
     loose-envify "^1.1.0"
     object-assign "^4.1.1"
@@ -16509,7 +16484,6 @@ react-helmet-async@^0.2.0:
 react-hotkeys@2.0.0-pre4:
   version "2.0.0-pre4"
   resolved "https://registry.yarnpkg.com/react-hotkeys/-/react-hotkeys-2.0.0-pre4.tgz#a1c248a51bdba4282c36bf3204f80d58abc73333"
-  integrity sha512-oa+UncSWyOwMK3GExt+oELXaR7T3ItgcMolsupQFdKvwkEhVAluJd5rYczsRSQpQlVkdNoHG46De2NUeuS+88Q==
   dependencies:
     prop-types "^15.6.1"
 
@@ -16530,7 +16504,6 @@ react-inspector@^2.3.0, react-inspector@^2.3.1:
 react-is@^16.7.0, react-is@^16.8.1:
   version "16.8.1"
   resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.8.1.tgz#a80141e246eb894824fb4f2901c0c50ef31d4cdb"
-  integrity sha512-ioMCzVDWvCvKD8eeT+iukyWrBGrA3DiFYkXfBsVYIRdaREZuBjENG+KjrikavCLasozqRWTwFUagU/O4vPpRMA==
 
 react-lifecycles-compat@^3.0.0, react-lifecycles-compat@^3.0.2, react-lifecycles-compat@^3.0.4:
   version "3.0.4"
@@ -16664,7 +16637,6 @@ react-test-renderer@^16.0.0-0:
 react-test-renderer@^16.8.1:
   version "16.8.1"
   resolved "https://registry.yarnpkg.com/react-test-renderer/-/react-test-renderer-16.8.1.tgz#72845ad9269be526126e97853311982f781767be"
-  integrity sha512-Bd21TN3+YVl6GZwav6O0T6m5UwGfOj+2+xZH5VH93ToD6M5uclN/c+R1DGX49ueG413KZPUx7Kw3sOYz2aJgfg==
   dependencies:
     object-assign "^4.1.1"
     prop-types "^15.6.2"
@@ -16674,7 +16646,6 @@ react-test-renderer@^16.8.1:
 react-testing-library@^5.4.4:
   version "5.4.4"
   resolved "https://registry.yarnpkg.com/react-testing-library/-/react-testing-library-5.4.4.tgz#3fa787999492be94b228e4540a7211556bf4fd94"
-  integrity sha512-/TiERZ+URSNhZQfjrUXh0VLsiLSmhqP1WP+2e2wWqWqrRIWpcAxrfuBxzlT75LYMDNmicEikaXJqRDi/pqCEDg==
   dependencies:
     dom-testing-library "^3.13.1"
 
@@ -16697,7 +16668,6 @@ react-transition-group@^2.2.1:
 react@^16.8.1:
   version "16.8.1"
   resolved "https://registry.yarnpkg.com/react/-/react-16.8.1.tgz#ae11831f6cb2a05d58603a976afc8a558e852c4a"
-  integrity sha512-wLw5CFGPdo7p/AgteFz7GblI2JPOos0+biSoxf1FPsGxWQZdN/pj6oToJs1crn61DL3Ln7mN86uZ4j74p31ELQ==
   dependencies:
     loose-envify "^1.1.0"
     object-assign "^4.1.1"
@@ -16912,7 +16882,6 @@ recast@^0.11.3, recast@~0.11.12:
 recast@^0.14.7:
   version "0.14.7"
   resolved "https://registry.yarnpkg.com/recast/-/recast-0.14.7.tgz#4f1497c2b5826d42a66e8e3c9d80c512983ff61d"
-  integrity sha512-/nwm9pkrcWagN40JeJhkPaRxiHXBRkXyRh/hgU088Z/v+qCy+zIHHY6bC6o7NaKAxPqtE6nD8zBH1LfU0/Wx6A==
   dependencies:
     ast-types "0.11.3"
     esprima "~4.0.0"
@@ -16937,7 +16906,6 @@ rechoir@^0.6.2:
 recompose@^0.30.0:
   version "0.30.0"
   resolved "https://registry.yarnpkg.com/recompose/-/recompose-0.30.0.tgz#82773641b3927e8c7d24a0d87d65aeeba18aabd0"
-  integrity sha512-ZTrzzUDa9AqUIhRk4KmVFihH0rapdCSMFXjhHbNrjAWxBuUD/guYlyysMnuHjlZC/KRiOKRtB4jf96yYSkKE8w==
   dependencies:
     "@babel/runtime" "^7.0.0"
     change-emitter "^0.1.2"
@@ -17843,7 +17811,6 @@ scheduler@^0.12.0:
 scheduler@^0.13.1:
   version "0.13.1"
   resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.13.1.tgz#1a217df1bfaabaf4f1b92a9127d5d732d85a9591"
-  integrity sha512-VJKOkiKIN2/6NOoexuypwSrybx13MY7NSy9RNt8wPvZDMRT1CW6qlpF5jXRToXNHz3uWzbm2elNpZfXfGPqP9A==
   dependencies:
     loose-envify "^1.1.0"
     object-assign "^4.1.1"
@@ -18629,7 +18596,6 @@ stealthy-require@^1.1.0:
 storybook-chromatic@^1.2.6:
   version "1.2.6"
   resolved "https://registry.yarnpkg.com/storybook-chromatic/-/storybook-chromatic-1.2.6.tgz#bada3ea3b15469378cd85b5048309af954e43ad0"
-  integrity sha512-rJ0Qr95PwXp1//l8SDDCYkv9++YOsqTeJSIOIUTncDkNar2Tggj5IRDnJZkYvccGJQ5PeOlxHjie4Cnol2bz3Q==
   dependencies:
     "@chromaui/localtunnel" "1.9.1-chromatic.3"
     apollo-fetch "^0.6.0"
@@ -19165,7 +19131,20 @@ terser-webpack-plugin@1.1.0:
     webpack-sources "^1.1.0"
     worker-farm "^1.5.2"
 
-terser-webpack-plugin@^1.1.0, terser-webpack-plugin@^1.2.1:
+terser-webpack-plugin@^1.1.0:
+  version "1.2.2"
+  resolved "https://registry.yarnpkg.com/terser-webpack-plugin/-/terser-webpack-plugin-1.2.2.tgz#9bff3a891ad614855a7dde0d707f7db5a927e3d9"
+  dependencies:
+    cacache "^11.0.2"
+    find-cache-dir "^2.0.0"
+    schema-utils "^1.0.0"
+    serialize-javascript "^1.4.0"
+    source-map "^0.6.1"
+    terser "^3.16.1"
+    webpack-sources "^1.1.0"
+    worker-farm "^1.5.2"
+
+terser-webpack-plugin@^1.2.1:
   version "1.2.1"
   resolved "https://registry.yarnpkg.com/terser-webpack-plugin/-/terser-webpack-plugin-1.2.1.tgz#7545da9ae5f4f9ae6a0ac961eb46f5e7c845cc26"
   dependencies:
@@ -19179,12 +19158,12 @@ terser-webpack-plugin@^1.1.0, terser-webpack-plugin@^1.2.1:
     worker-farm "^1.5.2"
 
 terser@^3.7.5, terser@^3.8.1:
-  version "3.14.1"
-  resolved "https://registry.yarnpkg.com/terser/-/terser-3.14.1.tgz#cc4764014af570bc79c79742358bd46926018a32"
+  version "3.16.1"
+  resolved "https://registry.yarnpkg.com/terser/-/terser-3.16.1.tgz#5b0dd4fa1ffd0b0b43c2493b2c364fd179160493"
   dependencies:
     commander "~2.17.1"
     source-map "~0.6.1"
-    source-map-support "~0.5.6"
+    source-map-support "~0.5.9"
 
 test-exclude@^4.2.1:
   version "4.2.3"
@@ -19725,7 +19704,6 @@ typescript@3.2.2:
 typescript@^3.3.1:
   version "3.3.1"
   resolved "https://registry.yarnpkg.com/typescript/-/typescript-3.3.1.tgz#6de14e1db4b8a006ac535e482c8ba018c55f750b"
-  integrity sha512-cTmIDFW7O0IHbn1DPYjkiebHxwtCMU+eTy30ZtJNBPF9j2O1ITu5XH2YnBeVRKWHqF+3JQwWJv0Q0aUgX8W7IA==
 
 ua-parser-js@^0.7.18:
   version "0.7.19"
@@ -20293,7 +20271,6 @@ vue-style-loader@^4.1.0:
 vue-template-compiler@^2.6.3:
   version "2.6.3"
   resolved "https://registry.yarnpkg.com/vue-template-compiler/-/vue-template-compiler-2.6.3.tgz#fe76b7755b038889f5e887895745f0d2bce3f778"
-  integrity sha512-SQ3lJk7fwquz8fGac7MwvP9cEBZntokTWITaDrLC0zmyBKjcOfJtWZkMsv+2uSUBDD8kwz8Bsad9xmBWaNULhg==
   dependencies:
     de-indent "^1.0.2"
     he "^1.1.0"
@@ -20305,7 +20282,6 @@ vue-template-es2015-compiler@^1.6.0:
 vue@^2.6.3:
   version "2.6.3"
   resolved "https://registry.yarnpkg.com/vue/-/vue-2.6.3.tgz#180017ba25b94a9864b2921db8644e1062ea82a0"
-  integrity sha512-yftjtahz4UTAtOlXXuw7UaYD86fWrMDAAzqTdqJJx2FIBqcPmBN6kPBHiBJFGaQELVblb5ijbFMXsx0i0F7q3g==
 
 vuex@^3.1.0:
   version "3.1.0"
@@ -20328,7 +20304,6 @@ w3c-xmlserializer@^1.0.1:
 wait-for-expect@^1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/wait-for-expect/-/wait-for-expect-1.1.0.tgz#6607375c3f79d32add35cd2c87ce13f351a3d453"
-  integrity sha512-vQDokqxyMyknfX3luCDn16bSaRcOyH6gGuUXMIbxBLeTo6nWuEWYqMTT9a+44FmW8c2m6TRWBdNvBBjA1hwEKg==
 
 walk-sync@^0.2.5:
   version "0.2.7"
@@ -20444,7 +20419,6 @@ webidl-conversions@^4.0.2:
 webpack-cli@^3.2.3:
   version "3.2.3"
   resolved "https://registry.yarnpkg.com/webpack-cli/-/webpack-cli-3.2.3.tgz#13653549adfd8ccd920ad7be1ef868bacc22e346"
-  integrity sha512-Ik3SjV6uJtWIAN5jp5ZuBMWEAaP5E4V78XJ2nI+paFPh8v4HPSwo/myN0r29Xc/6ZKnd2IdrAlpSgNOu2CDQ6Q==
   dependencies:
     chalk "^2.4.1"
     cross-spawn "^6.0.5"

From b5252250dcf0e390cc45116ba8ca5aa21d7bdde5 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Tue, 19 Feb 2019 19:07:18 +0800
Subject: [PATCH 039/249] Update snapshots

---
 .../form/__snapshots__/form.stories.storyshot |   32 +-
 .../__snapshots__/panel.stories.storyshot     |  188 +-
 .../__snapshots__/preview.stories.storyshot   |  610 ++---
 .../__snapshots__/about.stories.storyshot     | 2404 ++++++++---------
 4 files changed, 1436 insertions(+), 1798 deletions(-)

diff --git a/lib/components/src/form/__snapshots__/form.stories.storyshot b/lib/components/src/form/__snapshots__/form.stories.storyshot
index 6a2c8a94ba6..c8674c49a33 100644
--- a/lib/components/src/form/__snapshots__/form.stories.storyshot
+++ b/lib/components/src/form/__snapshots__/form.stories.storyshot
@@ -1,14 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Storyshots Basics|Form/Button sizes 1`] = `
-.emotion-6 > * {
-  margin-top: 10px;
-}
-
-.emotion-6 > *:first-of-type {
-  margin-top: 0;
-}
-
 .emotion-0 {
   border: 0;
   border-radius: 3em;
@@ -83,6 +75,14 @@ exports[`Storyshots Basics|Form/Button sizes 1`] = `
   transform: none;
 }
 
+.emotion-6 > * {
+  margin-top: 10px;
+}
+
+.emotion-6 > *:first-of-type {
+  margin-top: 0;
+}
+
 .emotion-1 {
   display: -webkit-box;
   display: -webkit-flex;
@@ -1429,14 +1429,6 @@ exports[`Storyshots Basics|Form/Input validations 1`] = `
 `;
 
 exports[`Storyshots Basics|Form/Select sizes 1`] = `
-.emotion-6 > * {
-  margin-top: 10px;
-}
-
-.emotion-6 > *:first-of-type {
-  margin-top: 0;
-}
-
 .emotion-0 {
   -webkit-appearance: none;
   -moz-appearance: none;
@@ -1496,6 +1488,14 @@ exports[`Storyshots Basics|Form/Select sizes 1`] = `
   color: #999999;
 }
 
+.emotion-6 > * {
+  margin-top: 10px;
+}
+
+.emotion-6 > *:first-of-type {
+  margin-top: 0;
+}
+
 .emotion-1 {
   display: -webkit-box;
   display: -webkit-flex;
diff --git a/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot b/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot
index 54550ef714f..9c9f84cf70c 100644
--- a/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot
+++ b/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot
@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Storyshots UI|Panel default 1`] = `
-.emotion-14 {
+.emotion-13 {
   width: 100%;
   height: 100%;
   box-sizing: border-box;
@@ -14,57 +14,6 @@ exports[`Storyshots UI|Panel default 1`] = `
   flex-direction: column;
 }
 
-.emotion-12 {
-  color: #999999;
-  height: 40px;
-  overflow: auto;
-  overflow-x: auto;
-  overflow-y: hidden;
-  -webkit-scrollbar-width: slim;
-  -moz-scrollbar-width: slim;
-  -ms-scrollbar-width: slim;
-  scrollbar-width: slim;
-  -webkit-scrollbar-width: 3px;
-  -moz-scrollbar-width: 3px;
-  -ms-scrollbar-width: 3px;
-  scrollbar-width: 3px;
-  -webkit-scrollbar-color: transparent transparent;
-  -moz-scrollbar-color: transparent transparent;
-  -ms-scrollbar-color: transparent transparent;
-  scrollbar-color: transparent transparent;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
-}
-
-.emotion-12::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  box-shadow: none;
-}
-
-.emotion-12::-webkit-scrollbar-track {
-  border-radius: 0;
-  background: transparent;
-  opacity: 0;
-  border: 0 none;
-  box-shadow: none;
-  height: 0;
-  width: 0;
-}
-
-.emotion-12::-webkit-scrollbar-thumb {
-  border-radius: 0;
-  background: rgba(0,0,0,.1);
-  box-shadow: none;
-}
-
-.emotion-12::-webkit-scrollbar-track-piece {
-  display: none;
-  border: 0 none;
-  opacity: 0;
-  visibility: hidden;
-}
-
 .emotion-11 {
   display: -webkit-box;
   display: -webkit-flex;
@@ -74,9 +23,14 @@ exports[`Storyshots UI|Panel default 1`] = `
   -webkit-justify-content: space-between;
   -ms-flex-pack: justify;
   justify-content: space-between;
-  position: relative;
-  white-space: nowrap;
+  background: #FFFFFF;
+  color: #999999;
   height: 40px;
+  position: relative;
+  overflow: visible;
+  overflow-x: visible;
+  overflow-y: visible;
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
 }
 
 .emotion-3 {
@@ -84,12 +38,9 @@ exports[`Storyshots UI|Panel default 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  -webkit-flex-basis: auto;
-  -ms-flex-preferred-size: auto;
-  flex-basis: auto;
-  -webkit-flex-shrink: 0;
-  -ms-flex-negative: 0;
-  flex-shrink: 0;
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
 }
 
 .emotion-3 > * {
@@ -97,10 +48,14 @@ exports[`Storyshots UI|Panel default 1`] = `
 }
 
 .emotion-2 {
-  overflow: hidden;
+  white-space: nowrap;
+  height: 100%;
+  padding-bottom: 50px;
+  overflow-x: visisble;
+  overflow-y: visisble;
 }
 
-.emotion-2:first-of-type {
+.emotion-2:first-child {
   margin-left: 0;
 }
 
@@ -199,13 +154,6 @@ exports[`Storyshots UI|Panel default 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  -webkit-flex-basis: auto;
-  -ms-flex-preferred-size: auto;
-  flex-basis: auto;
-  -webkit-flex-shrink: 0;
-  -ms-flex-negative: 0;
-  flex-shrink: 0;
-  margin-left: 30px;
 }
 
 .emotion-10 > * {
@@ -247,7 +195,7 @@ exports[`Storyshots UI|Panel default 1`] = `
   fill: currentColor;
 }
 
-.emotion-13 {
+.emotion-12 {
   display: block;
   position: relative;
   font-size: 13px;
@@ -260,78 +208,70 @@ exports[`Storyshots UI|Panel default 1`] = `
 }
 
 <div
-  class="emotion-14"
+  class="emotion-13"
   id="storybook-panel-root"
-  title="wrapper"
 >
   <div
-    class="emotion-12"
-    title="bar"
+    class="emotion-11"
   >
     <div
-      class="emotion-11"
+      class="emotion-3"
     >
       <div
-        class="emotion-3"
-        title="side left"
-      >
-        <div
-          class="emotion-2"
-          role="tablist"
-        >
-          <button
-            class="emotion-0"
-            role="tab"
-            type="button"
-          >
-            Test 1
-          </button>
-          <button
-            class="emotion-1"
-            role="tab"
-            type="button"
-          >
-            Test 2
-          </button>
-        </div>
-      </div>
-      <div
-        class="emotion-10"
-        title="side right"
+        class="emotion-2"
+        role="tablist"
       >
         <button
-          class="emotion-6"
-          title="Change orientation"
+          class="emotion-0"
+          role="tab"
+          type="button"
         >
-          <svg
-            class="emotion-5"
-            viewBox="0 0 1024 1024"
-          >
-            <path
-              class="emotion-4"
-              d="M64 167.944v688c0 22.092 17.908 40 40 40h816c22.092 0 40-17.908 40-40v-688c0-22.092-17.908-40-40-40h-816c-22.092 0-40 17.908-40 40zM880 815.944h-240v-608h240v608zM144 207.944h416v608h-416v-608zM793.296 320.118h-66.398c-17.676 0-32-14.324-32-32 0-17.674 14.328-32 32-32h66.396c17.674 0 32.002 14.326 32.002 32 0 17.672-14.324 32-32 32zM793.296 448.118h-66.398c-17.676 0-32-14.324-32-32 0-17.674 14.328-32 32-32h66.396c17.674 0 32.002 14.326 32.002 32 0 17.672-14.324 32-32 32zM793.296 576.118h-66.398c-17.676 0-32-14.324-32-32 0-17.674 14.328-32 32-32h66.396c17.674 0 32.002 14.326 32.002 32 0 17.672-14.324 32-32 32z"
-            />
-          </svg>
+          Test 1
         </button>
         <button
-          class="emotion-6"
-          title="Hide addons"
+          class="emotion-1"
+          role="tab"
+          type="button"
         >
-          <svg
-            class="emotion-5"
-            viewBox="0 0 1024 1024"
-          >
-            <path
-              class="emotion-4"
-              d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
-            />
-          </svg>
+          Test 2
         </button>
       </div>
     </div>
+    <div
+      class="emotion-10"
+    >
+      <button
+        class="emotion-6"
+        title="Change orientation"
+      >
+        <svg
+          class="emotion-5"
+          viewBox="0 0 1024 1024"
+        >
+          <path
+            class="emotion-4"
+            d="M64 167.944v688c0 22.092 17.908 40 40 40h816c22.092 0 40-17.908 40-40v-688c0-22.092-17.908-40-40-40h-816c-22.092 0-40 17.908-40 40zM880 815.944h-240v-608h240v608zM144 207.944h416v608h-416v-608zM793.296 320.118h-66.398c-17.676 0-32-14.324-32-32 0-17.674 14.328-32 32-32h66.396c17.674 0 32.002 14.326 32.002 32 0 17.672-14.324 32-32 32zM793.296 448.118h-66.398c-17.676 0-32-14.324-32-32 0-17.674 14.328-32 32-32h66.396c17.674 0 32.002 14.326 32.002 32 0 17.672-14.324 32-32 32zM793.296 576.118h-66.398c-17.676 0-32-14.324-32-32 0-17.674 14.328-32 32-32h66.396c17.674 0 32.002 14.326 32.002 32 0 17.672-14.324 32-32 32z"
+          />
+        </svg>
+      </button>
+      <button
+        class="emotion-6"
+        title="Hide addons"
+      >
+        <svg
+          class="emotion-5"
+          viewBox="0 0 1024 1024"
+        >
+          <path
+            class="emotion-4"
+            d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
+          />
+        </svg>
+      </button>
+    </div>
   </div>
   <div
-    class="emotion-13"
+    class="emotion-12"
   >
     <div
       id="test2"
diff --git a/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot b/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot
index 94669389c56..1a9f236b6cc 100644
--- a/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot
+++ b/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot
@@ -2,31 +2,14 @@
 
 exports[`Storyshots UI|Preview/Preview no tabs 1`] = `
 Array [
-  .emotion-22 {
+  .emotion-13 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  -webkit-box-pack: justify;
-  -webkit-justify-content: space-between;
-  -ms-flex-pack: justify;
-  justify-content: space-between;
-  position: relative;
-  white-space: nowrap;
-  height: 40px;
-}
-
-.emotion-13 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex-basis: auto;
-  -ms-flex-preferred-size: auto;
-  flex-basis: auto;
-  -webkit-flex-shrink: 0;
-  -ms-flex-negative: 0;
-  flex-shrink: 0;
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
 }
 
 .emotion-13 > * {
@@ -38,13 +21,6 @@ Array [
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  -webkit-flex-basis: auto;
-  -ms-flex-preferred-size: auto;
-  flex-basis: auto;
-  -webkit-flex-shrink: 0;
-  -ms-flex-negative: 0;
-  flex-shrink: 0;
-  margin-left: 30px;
 }
 
 .emotion-21 > * {
@@ -86,24 +62,22 @@ Array [
   fill: currentColor;
 }
 
-.emotion-23 {
+.emotion-22 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+  background: #FFFFFF;
   color: #999999;
   height: 40px;
+  position: relative;
   overflow: auto;
   overflow-x: auto;
   overflow-y: hidden;
-  -webkit-scrollbar-width: slim;
-  -moz-scrollbar-width: slim;
-  -ms-scrollbar-width: slim;
-  scrollbar-width: slim;
-  -webkit-scrollbar-width: 3px;
-  -moz-scrollbar-width: 3px;
-  -ms-scrollbar-width: 3px;
-  scrollbar-width: 3px;
-  -webkit-scrollbar-color: transparent transparent;
-  -moz-scrollbar-color: transparent transparent;
-  -ms-scrollbar-color: transparent transparent;
-  scrollbar-color: transparent transparent;
   background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
   position: absolute;
   left: 0;
@@ -116,36 +90,6 @@ Array [
   tranform: translateY(0px);
 }
 
-.emotion-23::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  box-shadow: none;
-}
-
-.emotion-23::-webkit-scrollbar-track {
-  border-radius: 0;
-  background: transparent;
-  opacity: 0;
-  border: 0 none;
-  box-shadow: none;
-  height: 0;
-  width: 0;
-}
-
-.emotion-23::-webkit-scrollbar-thumb {
-  border-radius: 0;
-  background: rgba(0,0,0,.1);
-  box-shadow: none;
-}
-
-.emotion-23::-webkit-scrollbar-track-piece {
-  display: none;
-  border: 0 none;
-  opacity: 0;
-  visibility: hidden;
-}
-
 .emotion-9 {
   width: 1px;
   height: 24px;
@@ -157,121 +101,114 @@ Array [
   display: none;
 }
 
-.emotion-9:first-of-type {
+.emotion-9:first-child {
   display: none;
 }
 
-.emotion-9:last-of-type {
+.emotion-9:last-child {
   display: none;
 }
 
 <div
-    class="emotion-23"
-    title="bar"
+    class="emotion-22"
   >
     <div
-      class="emotion-22"
+      class="emotion-13"
     >
-      <div
-        class="emotion-13"
-        title="side left"
+      <button
+        class="emotion-2"
+        title="Zoom in"
       >
-        <button
-          class="emotion-2"
-          title="Zoom in"
+        <svg
+          class="emotion-1"
+          viewBox="0 0 1024 1024"
         >
-          <svg
-            class="emotion-1"
-            viewBox="0 0 1024 1024"
-          >
-            <path
-              class="emotion-0"
-              d="M220 670a316 316 0 0 1 0-450 316 316 0 0 1 450 0 316 316 0 0 1 0 450 316 316 0 0 1-450 0zm749 240L757 698a402 402 0 1 0-59 59l212 212a42 42 0 0 0 59-59zM487 604a42 42 0 0 1-84 0V487H286a42 42 0 1 1 0-84h117V286a42 42 0 1 1 84 0v117h117a42 42 0 0 1 0 84H487v117z"
-            />
-          </svg>
-        </button>
-        <button
-          class="emotion-2"
-          title="Zoom out"
-        >
-          <svg
-            class="emotion-1"
-            viewBox="0 0 1024 1024"
-          >
-            <path
-              class="emotion-0"
-              d="M757 698a402 402 0 1 0-59 59l212 212a42 42 0 0 0 59-59L757 698zM126 445a316 316 0 0 1 319-319 316 316 0 0 1 318 319 316 316 0 0 1-318 318 316 316 0 0 1-319-318zm160 42a42 42 0 1 1 0-84h318a42 42 0 0 1 0 84H286z"
-            />
-          </svg>
-        </button>
-        <button
-          class="emotion-2"
-          title="Reset zoom"
-        >
-          <svg
-            class="emotion-1"
-            viewBox="0 0 1024 1024"
-          >
-            <path
-              class="emotion-0"
-              d="M148 560a318 318 0 0 0 522 110 316 316 0 0 0 0-450 316 316 0 0 0-450 0c-11 11-21 22-30 34v4h47c25 0 46 21 46 46s-21 45-46 45H90c-13 0-25-6-33-14-9-9-14-20-14-33V156c0-25 20-45 45-45s45 20 45 45v32l1 1a401 401 0 0 1 623 509l212 212a42 42 0 0 1-59 59L698 757A401 401 0 0 1 65 570a42 42 0 0 1 83-10z"
-            />
-          </svg>
-        </button>
-        <span
-          class="emotion-9"
-        />
-        <button
-          class="emotion-2"
-          title="Toggle background grid"
-        >
-          <svg
-            class="emotion-1"
-            viewBox="0 0 1024 1024"
-          >
-            <path
-              class="emotion-0"
-              d="M437.162 552.368c-1.694-0.216-3.408-0.37-5.162-0.37h-263.978c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v264.040c0 22.094 17.91 40 40 40h263.978c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-264.044c0-20.34-15.19-37.094-34.838-39.632zM208.022 816.038v-184.040h183.978v184.040h-183.978zM437.162 128.4c-1.694-0.216-3.408-0.37-5.162-0.37h-263.978c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v263.968c0 22.094 17.91 40 40 40h263.978c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-263.972c0-20.342-15.19-37.096-34.838-39.632zM208.022 392v-183.968h183.978v183.968h-183.978zM861.212 552.368c-1.694-0.216-3.408-0.37-5.162-0.37h-264.050c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v264.040c0 22.094 17.91 40 40 40h264.048c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-264.044c0.002-20.34-15.19-37.094-34.836-39.632zM632 816.038v-184.040h184.048v184.040h-184.048zM861.212 128.4c-1.694-0.216-3.408-0.37-5.162-0.37h-264.050c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v263.968c0 22.094 17.91 40 40 40h264.048c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-263.972c0.002-20.342-15.19-37.096-34.836-39.632zM632 392v-183.968h184.048v183.968h-184.048z"
-            />
-          </svg>
-        </button>
-      </div>
-      <div
-        class="emotion-21"
-        title="side right"
+          <path
+            class="emotion-0"
+            d="M220 670a316 316 0 0 1 0-450 316 316 0 0 1 450 0 316 316 0 0 1 0 450 316 316 0 0 1-450 0zm749 240L757 698a402 402 0 1 0-59 59l212 212a42 42 0 0 0 59-59zM487 604a42 42 0 0 1-84 0V487H286a42 42 0 1 1 0-84h117V286a42 42 0 1 1 84 0v117h117a42 42 0 0 1 0 84H487v117z"
+          />
+        </svg>
+      </button>
+      <button
+        class="emotion-2"
+        title="Zoom out"
       >
-        <button
-          class="emotion-2"
-          title="Go full screen"
+        <svg
+          class="emotion-1"
+          viewBox="0 0 1024 1024"
         >
-          <svg
-            class="emotion-1"
-            viewBox="0 0 1024 1024"
-          >
-            <path
-              class="emotion-0"
-              d="M959.688 920.068l0.31-176c0.040-22.094-17.84-40.032-39.93-40.070-22.092-0.040-40.032 17.838-40.070 39.93l-0.142 79.672-235.734-235.732c-15.622-15.622-40.948-15.622-56.57 0s-15.622 40.948 0 56.568l235.442 235.442-78.946-0.1c-22.092-0.028-40.022 17.86-40.050 39.952-0.014 11.064 4.464 21.084 11.714 28.334 7.228 7.224 17.208 11.702 28.236 11.714l175.688 0.22c22.086 0.028 40.014-17.846 40.052-39.93zM920.178 64.228l-176-0.308c-22.094-0.040-40.032 17.84-40.070 39.93-0.040 22.092 17.838 40.032 39.93 40.070l79.672 0.14-235.732 235.734c-15.622 15.622-15.622 40.948 0 56.568s40.948 15.622 56.568 0l235.442-235.442-0.1 78.946c-0.028 22.092 17.86 40.022 39.952 40.050 11.064 0.014 21.084-4.464 28.334-11.714 7.224-7.228 11.702-17.208 11.714-28.236l0.22-175.688c0.026-22.082-17.846-40.010-39.93-40.050zM64.236 103.742l-0.308 176c-0.040 22.094 17.84 40.032 39.93 40.070 22.092 0.040 40.032-17.84 40.070-39.93l0.14-79.672 235.734 235.73c15.622 15.622 40.948 15.622 56.568 0s15.622-40.946 0-56.566l-235.442-235.442 78.946 0.098c22.092 0.028 40.022-17.86 40.050-39.95 0.014-11.066-4.464-21.086-11.714-28.336-7.228-7.222-17.208-11.7-28.236-11.714l-175.688-0.218c-22.084-0.026-40.012 17.844-40.050 39.93zM103.748 959.766l176 0.308c22.094 0.040 40.032-17.84 40.070-39.93 0.040-22.092-17.84-40.032-39.93-40.070l-79.672-0.14 235.73-235.734c15.622-15.622 15.622-40.948 0-56.568s-40.946-15.622-56.566 0l-235.442 235.442 0.098-78.946c0.028-22.092-17.86-40.022-39.95-40.050-11.066-0.014-21.086 4.464-28.336 11.714-7.222 7.228-11.7 17.208-11.714 28.236l-0.218 175.688c-0.026 22.082 17.844 40.010 39.93 40.050z"
-            />
-          </svg>
-        </button>
-        <span
-          class="emotion-9"
-        />
-        <button
-          class="emotion-2"
-          title="Open component in new tab"
+          <path
+            class="emotion-0"
+            d="M757 698a402 402 0 1 0-59 59l212 212a42 42 0 0 0 59-59L757 698zM126 445a316 316 0 0 1 319-319 316 316 0 0 1 318 319 316 316 0 0 1-318 318 316 316 0 0 1-319-318zm160 42a42 42 0 1 1 0-84h318a42 42 0 0 1 0 84H286z"
+          />
+        </svg>
+      </button>
+      <button
+        class="emotion-2"
+        title="Reset zoom"
+      >
+        <svg
+          class="emotion-1"
+          viewBox="0 0 1024 1024"
         >
-          <svg
-            class="emotion-1"
-            viewBox="0 0 1024 1024"
-          >
-            <path
-              class="emotion-0"
-              d="M896.006 920c0 22.090-17.91 40-40 40h-688.006c-22.090 0-40-17.906-40-40v-549.922c-0.838-3.224-1.33-6.588-1.33-10.072 0-22.090 17.908-40.004 40-40.004h178.66c22.092 0.004 40 17.914 40 40.004 0 22.088-17.908 40-40 40h-137.33v479.996h607.998v-479.996h-138.658c-22.090 0-40-17.912-40-40 0-22.090 17.906-40.004 40-40.004h178.658c22.090 0 40 17.91 40 40v559.844c0 0.050 0.008 0.102 0.008 0.154zM665.622 200.168l-124.452-124.45c-8.042-8.042-18.65-11.912-29.186-11.674-1.612-0.034-3.222 0-4.828 0.16-0.558 0.054-1.098 0.16-1.648 0.238-0.742 0.104-1.484 0.192-2.218 0.338-0.656 0.13-1.29 0.31-1.934 0.472-0.622 0.154-1.244 0.292-1.86 0.476-0.64 0.196-1.258 0.436-1.886 0.66-0.602 0.216-1.208 0.414-1.802 0.66-0.598 0.248-1.17 0.54-1.754 0.814-0.598 0.282-1.202 0.546-1.788 0.86-0.578 0.312-1.13 0.664-1.694 1-0.552 0.332-1.116 0.644-1.654 1.006-0.67 0.448-1.3 0.942-1.942 1.426-0.394 0.302-0.806 0.576-1.196 0.894-1.046 0.858-2.052 1.768-3.008 2.726l-124.398 124.39c-15.622 15.62-15.618 40.948 0.002 56.57 15.622 15.62 40.95 15.62 56.568 0l56.164-56.166v439.426c0 22.094 17.912 40 40.002 40 22.092 0 40-17.91 40-40v-441.202l57.942 57.942c15.622 15.624 40.948 15.62 56.568 0 15.626-15.618 15.626-40.946 0.002-56.566z"
-            />
-          </svg>
-        </button>
-      </div>
+          <path
+            class="emotion-0"
+            d="M148 560a318 318 0 0 0 522 110 316 316 0 0 0 0-450 316 316 0 0 0-450 0c-11 11-21 22-30 34v4h47c25 0 46 21 46 46s-21 45-46 45H90c-13 0-25-6-33-14-9-9-14-20-14-33V156c0-25 20-45 45-45s45 20 45 45v32l1 1a401 401 0 0 1 623 509l212 212a42 42 0 0 1-59 59L698 757A401 401 0 0 1 65 570a42 42 0 0 1 83-10z"
+          />
+        </svg>
+      </button>
+      <span
+        class="emotion-9"
+      />
+      <button
+        class="emotion-2"
+        title="Toggle background grid"
+      >
+        <svg
+          class="emotion-1"
+          viewBox="0 0 1024 1024"
+        >
+          <path
+            class="emotion-0"
+            d="M437.162 552.368c-1.694-0.216-3.408-0.37-5.162-0.37h-263.978c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v264.040c0 22.094 17.91 40 40 40h263.978c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-264.044c0-20.34-15.19-37.094-34.838-39.632zM208.022 816.038v-184.040h183.978v184.040h-183.978zM437.162 128.4c-1.694-0.216-3.408-0.37-5.162-0.37h-263.978c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v263.968c0 22.094 17.91 40 40 40h263.978c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-263.972c0-20.342-15.19-37.096-34.838-39.632zM208.022 392v-183.968h183.978v183.968h-183.978zM861.212 552.368c-1.694-0.216-3.408-0.37-5.162-0.37h-264.050c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v264.040c0 22.094 17.91 40 40 40h264.048c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-264.044c0.002-20.34-15.19-37.094-34.836-39.632zM632 816.038v-184.040h184.048v184.040h-184.048zM861.212 128.4c-1.694-0.216-3.408-0.37-5.162-0.37h-264.050c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v263.968c0 22.094 17.91 40 40 40h264.048c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-263.972c0.002-20.342-15.19-37.096-34.836-39.632zM632 392v-183.968h184.048v183.968h-184.048z"
+          />
+        </svg>
+      </button>
+    </div>
+    <div
+      class="emotion-21"
+    >
+      <button
+        class="emotion-2"
+        title="Go full screen"
+      >
+        <svg
+          class="emotion-1"
+          viewBox="0 0 1024 1024"
+        >
+          <path
+            class="emotion-0"
+            d="M959.688 920.068l0.31-176c0.040-22.094-17.84-40.032-39.93-40.070-22.092-0.040-40.032 17.838-40.070 39.93l-0.142 79.672-235.734-235.732c-15.622-15.622-40.948-15.622-56.57 0s-15.622 40.948 0 56.568l235.442 235.442-78.946-0.1c-22.092-0.028-40.022 17.86-40.050 39.952-0.014 11.064 4.464 21.084 11.714 28.334 7.228 7.224 17.208 11.702 28.236 11.714l175.688 0.22c22.086 0.028 40.014-17.846 40.052-39.93zM920.178 64.228l-176-0.308c-22.094-0.040-40.032 17.84-40.070 39.93-0.040 22.092 17.838 40.032 39.93 40.070l79.672 0.14-235.732 235.734c-15.622 15.622-15.622 40.948 0 56.568s40.948 15.622 56.568 0l235.442-235.442-0.1 78.946c-0.028 22.092 17.86 40.022 39.952 40.050 11.064 0.014 21.084-4.464 28.334-11.714 7.224-7.228 11.702-17.208 11.714-28.236l0.22-175.688c0.026-22.082-17.846-40.010-39.93-40.050zM64.236 103.742l-0.308 176c-0.040 22.094 17.84 40.032 39.93 40.070 22.092 0.040 40.032-17.84 40.070-39.93l0.14-79.672 235.734 235.73c15.622 15.622 40.948 15.622 56.568 0s15.622-40.946 0-56.566l-235.442-235.442 78.946 0.098c22.092 0.028 40.022-17.86 40.050-39.95 0.014-11.066-4.464-21.086-11.714-28.336-7.228-7.222-17.208-11.7-28.236-11.714l-175.688-0.218c-22.084-0.026-40.012 17.844-40.050 39.93zM103.748 959.766l176 0.308c22.094 0.040 40.032-17.84 40.070-39.93 0.040-22.092-17.84-40.032-39.93-40.070l-79.672-0.14 235.73-235.734c15.622-15.622 15.622-40.948 0-56.568s-40.946-15.622-56.566 0l-235.442 235.442 0.098-78.946c0.028-22.092-17.86-40.022-39.95-40.050-11.066-0.014-21.086 4.464-28.336 11.714-7.222 7.228-11.7 17.208-11.714 28.236l-0.218 175.688c-0.026 22.082 17.844 40.010 39.93 40.050z"
+          />
+        </svg>
+      </button>
+      <span
+        class="emotion-9"
+      />
+      <button
+        class="emotion-2"
+        title="Open component in new tab"
+      >
+        <svg
+          class="emotion-1"
+          viewBox="0 0 1024 1024"
+        >
+          <path
+            class="emotion-0"
+            d="M896.006 920c0 22.090-17.91 40-40 40h-688.006c-22.090 0-40-17.906-40-40v-549.922c-0.838-3.224-1.33-6.588-1.33-10.072 0-22.090 17.908-40.004 40-40.004h178.66c22.092 0.004 40 17.914 40 40.004 0 22.088-17.908 40-40 40h-137.33v479.996h607.998v-479.996h-138.658c-22.090 0-40-17.912-40-40 0-22.090 17.906-40.004 40-40.004h178.658c22.090 0 40 17.91 40 40v559.844c0 0.050 0.008 0.102 0.008 0.154zM665.622 200.168l-124.452-124.45c-8.042-8.042-18.65-11.912-29.186-11.674-1.612-0.034-3.222 0-4.828 0.16-0.558 0.054-1.098 0.16-1.648 0.238-0.742 0.104-1.484 0.192-2.218 0.338-0.656 0.13-1.29 0.31-1.934 0.472-0.622 0.154-1.244 0.292-1.86 0.476-0.64 0.196-1.258 0.436-1.886 0.66-0.602 0.216-1.208 0.414-1.802 0.66-0.598 0.248-1.17 0.54-1.754 0.814-0.598 0.282-1.202 0.546-1.788 0.86-0.578 0.312-1.13 0.664-1.694 1-0.552 0.332-1.116 0.644-1.654 1.006-0.67 0.448-1.3 0.942-1.942 1.426-0.394 0.302-0.806 0.576-1.196 0.894-1.046 0.858-2.052 1.768-3.008 2.726l-124.398 124.39c-15.622 15.62-15.618 40.948 0.002 56.57 15.622 15.62 40.95 15.62 56.568 0l56.164-56.166v439.426c0 22.094 17.912 40 40.002 40 22.092 0 40-17.91 40-40v-441.202l57.942 57.942c15.622 15.624 40.948 15.62 56.568 0 15.626-15.618 15.626-40.946 0.002-56.566z"
+          />
+        </svg>
+      </button>
     </div>
   </div>,
   .emotion-2 {
@@ -347,31 +284,14 @@ Array [
 
 exports[`Storyshots UI|Preview/Preview with tabs 1`] = `
 Array [
-  .emotion-28 {
+  .emotion-19 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  -webkit-box-pack: justify;
-  -webkit-justify-content: space-between;
-  -ms-flex-pack: justify;
-  justify-content: space-between;
-  position: relative;
-  white-space: nowrap;
-  height: 40px;
-}
-
-.emotion-19 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex-basis: auto;
-  -ms-flex-preferred-size: auto;
-  flex-basis: auto;
-  -webkit-flex-shrink: 0;
-  -ms-flex-negative: 0;
-  flex-shrink: 0;
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
 }
 
 .emotion-19 > * {
@@ -379,10 +299,14 @@ Array [
 }
 
 .emotion-4 {
-  overflow: hidden;
+  white-space: nowrap;
+  height: 100%;
+  padding-bottom: 50px;
+  overflow-x: visisble;
+  overflow-y: visisble;
 }
 
-.emotion-4:first-of-type {
+.emotion-4:first-child {
   margin-left: 0;
 }
 
@@ -481,13 +405,6 @@ Array [
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  -webkit-flex-basis: auto;
-  -ms-flex-preferred-size: auto;
-  flex-basis: auto;
-  -webkit-flex-shrink: 0;
-  -ms-flex-negative: 0;
-  flex-shrink: 0;
-  margin-left: 30px;
 }
 
 .emotion-27 > * {
@@ -529,24 +446,22 @@ Array [
   fill: currentColor;
 }
 
-.emotion-29 {
+.emotion-28 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+  background: #FFFFFF;
   color: #999999;
   height: 40px;
+  position: relative;
   overflow: auto;
   overflow-x: auto;
   overflow-y: hidden;
-  -webkit-scrollbar-width: slim;
-  -moz-scrollbar-width: slim;
-  -ms-scrollbar-width: slim;
-  scrollbar-width: slim;
-  -webkit-scrollbar-width: 3px;
-  -moz-scrollbar-width: 3px;
-  -ms-scrollbar-width: 3px;
-  scrollbar-width: 3px;
-  -webkit-scrollbar-color: transparent transparent;
-  -moz-scrollbar-color: transparent transparent;
-  -ms-scrollbar-color: transparent transparent;
-  scrollbar-color: transparent transparent;
   background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
   position: absolute;
   left: 0;
@@ -559,36 +474,6 @@ Array [
   tranform: translateY(0px);
 }
 
-.emotion-29::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  box-shadow: none;
-}
-
-.emotion-29::-webkit-scrollbar-track {
-  border-radius: 0;
-  background: transparent;
-  opacity: 0;
-  border: 0 none;
-  box-shadow: none;
-  height: 0;
-  width: 0;
-}
-
-.emotion-29::-webkit-scrollbar-thumb {
-  border-radius: 0;
-  background: rgba(0,0,0,.1);
-  box-shadow: none;
-}
-
-.emotion-29::-webkit-scrollbar-track-piece {
-  display: none;
-  border: 0 none;
-  opacity: 0;
-  visibility: hidden;
-}
-
 .emotion-5 {
   width: 1px;
   height: 24px;
@@ -600,11 +485,11 @@ Array [
   display: none;
 }
 
-.emotion-5:first-of-type {
+.emotion-5:first-child {
   display: none;
 }
 
-.emotion-5:last-of-type {
+.emotion-5:last-child {
   display: none;
 }
 
@@ -616,139 +501,132 @@ Array [
 }
 
 <div
-    class="emotion-29"
-    title="bar"
+    class="emotion-28"
   >
     <div
-      class="emotion-28"
+      class="emotion-19"
     >
       <div
-        class="emotion-19"
-        title="side left"
+        class="emotion-4"
       >
-        <div
-          class="emotion-4"
+        <a
+          class="emotion-1"
+          href="/?path=/story/string"
         >
-          <a
-            class="emotion-1"
-            href="/?path=/story/string"
+          <button
+            class="emotion-0"
           >
-            <button
-              class="emotion-0"
-            >
-              Canvas
-            </button>
-          </a>
-          <a
-            class="emotion-1"
-            href="/?path=/info/string"
-          >
-            <button
-              class="emotion-2"
-            >
-              Notes
-            </button>
-          </a>
-        </div>
-        <span
-          class="emotion-5"
-        />
-        <button
-          class="emotion-8"
-          title="Zoom in"
+            Canvas
+          </button>
+        </a>
+        <a
+          class="emotion-1"
+          href="/?path=/info/string"
         >
-          <svg
-            class="emotion-7"
-            viewBox="0 0 1024 1024"
+          <button
+            class="emotion-2"
           >
-            <path
-              class="emotion-6"
-              d="M220 670a316 316 0 0 1 0-450 316 316 0 0 1 450 0 316 316 0 0 1 0 450 316 316 0 0 1-450 0zm749 240L757 698a402 402 0 1 0-59 59l212 212a42 42 0 0 0 59-59zM487 604a42 42 0 0 1-84 0V487H286a42 42 0 1 1 0-84h117V286a42 42 0 1 1 84 0v117h117a42 42 0 0 1 0 84H487v117z"
-            />
-          </svg>
-        </button>
-        <button
-          class="emotion-8"
-          title="Zoom out"
-        >
-          <svg
-            class="emotion-7"
-            viewBox="0 0 1024 1024"
-          >
-            <path
-              class="emotion-6"
-              d="M757 698a402 402 0 1 0-59 59l212 212a42 42 0 0 0 59-59L757 698zM126 445a316 316 0 0 1 319-319 316 316 0 0 1 318 319 316 316 0 0 1-318 318 316 316 0 0 1-319-318zm160 42a42 42 0 1 1 0-84h318a42 42 0 0 1 0 84H286z"
-            />
-          </svg>
-        </button>
-        <button
-          class="emotion-8"
-          title="Reset zoom"
-        >
-          <svg
-            class="emotion-7"
-            viewBox="0 0 1024 1024"
-          >
-            <path
-              class="emotion-6"
-              d="M148 560a318 318 0 0 0 522 110 316 316 0 0 0 0-450 316 316 0 0 0-450 0c-11 11-21 22-30 34v4h47c25 0 46 21 46 46s-21 45-46 45H90c-13 0-25-6-33-14-9-9-14-20-14-33V156c0-25 20-45 45-45s45 20 45 45v32l1 1a401 401 0 0 1 623 509l212 212a42 42 0 0 1-59 59L698 757A401 401 0 0 1 65 570a42 42 0 0 1 83-10z"
-            />
-          </svg>
-        </button>
-        <span
-          class="emotion-5"
-        />
-        <button
-          class="emotion-8"
-          title="Toggle background grid"
-        >
-          <svg
-            class="emotion-7"
-            viewBox="0 0 1024 1024"
-          >
-            <path
-              class="emotion-6"
-              d="M437.162 552.368c-1.694-0.216-3.408-0.37-5.162-0.37h-263.978c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v264.040c0 22.094 17.91 40 40 40h263.978c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-264.044c0-20.34-15.19-37.094-34.838-39.632zM208.022 816.038v-184.040h183.978v184.040h-183.978zM437.162 128.4c-1.694-0.216-3.408-0.37-5.162-0.37h-263.978c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v263.968c0 22.094 17.91 40 40 40h263.978c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-263.972c0-20.342-15.19-37.096-34.838-39.632zM208.022 392v-183.968h183.978v183.968h-183.978zM861.212 552.368c-1.694-0.216-3.408-0.37-5.162-0.37h-264.050c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v264.040c0 22.094 17.91 40 40 40h264.048c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-264.044c0.002-20.34-15.19-37.094-34.836-39.632zM632 816.038v-184.040h184.048v184.040h-184.048zM861.212 128.4c-1.694-0.216-3.408-0.37-5.162-0.37h-264.050c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v263.968c0 22.094 17.91 40 40 40h264.048c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-263.972c0.002-20.342-15.19-37.096-34.836-39.632zM632 392v-183.968h184.048v183.968h-184.048z"
-            />
-          </svg>
-        </button>
+            Notes
+          </button>
+        </a>
       </div>
-      <div
-        class="emotion-27"
-        title="side right"
+      <span
+        class="emotion-5"
+      />
+      <button
+        class="emotion-8"
+        title="Zoom in"
       >
-        <button
-          class="emotion-8"
-          title="Go full screen"
+        <svg
+          class="emotion-7"
+          viewBox="0 0 1024 1024"
         >
-          <svg
-            class="emotion-7"
-            viewBox="0 0 1024 1024"
-          >
-            <path
-              class="emotion-6"
-              d="M959.688 920.068l0.31-176c0.040-22.094-17.84-40.032-39.93-40.070-22.092-0.040-40.032 17.838-40.070 39.93l-0.142 79.672-235.734-235.732c-15.622-15.622-40.948-15.622-56.57 0s-15.622 40.948 0 56.568l235.442 235.442-78.946-0.1c-22.092-0.028-40.022 17.86-40.050 39.952-0.014 11.064 4.464 21.084 11.714 28.334 7.228 7.224 17.208 11.702 28.236 11.714l175.688 0.22c22.086 0.028 40.014-17.846 40.052-39.93zM920.178 64.228l-176-0.308c-22.094-0.040-40.032 17.84-40.070 39.93-0.040 22.092 17.838 40.032 39.93 40.070l79.672 0.14-235.732 235.734c-15.622 15.622-15.622 40.948 0 56.568s40.948 15.622 56.568 0l235.442-235.442-0.1 78.946c-0.028 22.092 17.86 40.022 39.952 40.050 11.064 0.014 21.084-4.464 28.334-11.714 7.224-7.228 11.702-17.208 11.714-28.236l0.22-175.688c0.026-22.082-17.846-40.010-39.93-40.050zM64.236 103.742l-0.308 176c-0.040 22.094 17.84 40.032 39.93 40.070 22.092 0.040 40.032-17.84 40.070-39.93l0.14-79.672 235.734 235.73c15.622 15.622 40.948 15.622 56.568 0s15.622-40.946 0-56.566l-235.442-235.442 78.946 0.098c22.092 0.028 40.022-17.86 40.050-39.95 0.014-11.066-4.464-21.086-11.714-28.336-7.228-7.222-17.208-11.7-28.236-11.714l-175.688-0.218c-22.084-0.026-40.012 17.844-40.050 39.93zM103.748 959.766l176 0.308c22.094 0.040 40.032-17.84 40.070-39.93 0.040-22.092-17.84-40.032-39.93-40.070l-79.672-0.14 235.73-235.734c15.622-15.622 15.622-40.948 0-56.568s-40.946-15.622-56.566 0l-235.442 235.442 0.098-78.946c0.028-22.092-17.86-40.022-39.95-40.050-11.066-0.014-21.086 4.464-28.336 11.714-7.222 7.228-11.7 17.208-11.714 28.236l-0.218 175.688c-0.026 22.082 17.844 40.010 39.93 40.050z"
-            />
-          </svg>
-        </button>
-        <span
-          class="emotion-5"
-        />
-        <button
-          class="emotion-8"
-          title="Open component in new tab"
+          <path
+            class="emotion-6"
+            d="M220 670a316 316 0 0 1 0-450 316 316 0 0 1 450 0 316 316 0 0 1 0 450 316 316 0 0 1-450 0zm749 240L757 698a402 402 0 1 0-59 59l212 212a42 42 0 0 0 59-59zM487 604a42 42 0 0 1-84 0V487H286a42 42 0 1 1 0-84h117V286a42 42 0 1 1 84 0v117h117a42 42 0 0 1 0 84H487v117z"
+          />
+        </svg>
+      </button>
+      <button
+        class="emotion-8"
+        title="Zoom out"
+      >
+        <svg
+          class="emotion-7"
+          viewBox="0 0 1024 1024"
         >
-          <svg
-            class="emotion-7"
-            viewBox="0 0 1024 1024"
-          >
-            <path
-              class="emotion-6"
-              d="M896.006 920c0 22.090-17.91 40-40 40h-688.006c-22.090 0-40-17.906-40-40v-549.922c-0.838-3.224-1.33-6.588-1.33-10.072 0-22.090 17.908-40.004 40-40.004h178.66c22.092 0.004 40 17.914 40 40.004 0 22.088-17.908 40-40 40h-137.33v479.996h607.998v-479.996h-138.658c-22.090 0-40-17.912-40-40 0-22.090 17.906-40.004 40-40.004h178.658c22.090 0 40 17.91 40 40v559.844c0 0.050 0.008 0.102 0.008 0.154zM665.622 200.168l-124.452-124.45c-8.042-8.042-18.65-11.912-29.186-11.674-1.612-0.034-3.222 0-4.828 0.16-0.558 0.054-1.098 0.16-1.648 0.238-0.742 0.104-1.484 0.192-2.218 0.338-0.656 0.13-1.29 0.31-1.934 0.472-0.622 0.154-1.244 0.292-1.86 0.476-0.64 0.196-1.258 0.436-1.886 0.66-0.602 0.216-1.208 0.414-1.802 0.66-0.598 0.248-1.17 0.54-1.754 0.814-0.598 0.282-1.202 0.546-1.788 0.86-0.578 0.312-1.13 0.664-1.694 1-0.552 0.332-1.116 0.644-1.654 1.006-0.67 0.448-1.3 0.942-1.942 1.426-0.394 0.302-0.806 0.576-1.196 0.894-1.046 0.858-2.052 1.768-3.008 2.726l-124.398 124.39c-15.622 15.62-15.618 40.948 0.002 56.57 15.622 15.62 40.95 15.62 56.568 0l56.164-56.166v439.426c0 22.094 17.912 40 40.002 40 22.092 0 40-17.91 40-40v-441.202l57.942 57.942c15.622 15.624 40.948 15.62 56.568 0 15.626-15.618 15.626-40.946 0.002-56.566z"
-            />
-          </svg>
-        </button>
-      </div>
+          <path
+            class="emotion-6"
+            d="M757 698a402 402 0 1 0-59 59l212 212a42 42 0 0 0 59-59L757 698zM126 445a316 316 0 0 1 319-319 316 316 0 0 1 318 319 316 316 0 0 1-318 318 316 316 0 0 1-319-318zm160 42a42 42 0 1 1 0-84h318a42 42 0 0 1 0 84H286z"
+          />
+        </svg>
+      </button>
+      <button
+        class="emotion-8"
+        title="Reset zoom"
+      >
+        <svg
+          class="emotion-7"
+          viewBox="0 0 1024 1024"
+        >
+          <path
+            class="emotion-6"
+            d="M148 560a318 318 0 0 0 522 110 316 316 0 0 0 0-450 316 316 0 0 0-450 0c-11 11-21 22-30 34v4h47c25 0 46 21 46 46s-21 45-46 45H90c-13 0-25-6-33-14-9-9-14-20-14-33V156c0-25 20-45 45-45s45 20 45 45v32l1 1a401 401 0 0 1 623 509l212 212a42 42 0 0 1-59 59L698 757A401 401 0 0 1 65 570a42 42 0 0 1 83-10z"
+          />
+        </svg>
+      </button>
+      <span
+        class="emotion-5"
+      />
+      <button
+        class="emotion-8"
+        title="Toggle background grid"
+      >
+        <svg
+          class="emotion-7"
+          viewBox="0 0 1024 1024"
+        >
+          <path
+            class="emotion-6"
+            d="M437.162 552.368c-1.694-0.216-3.408-0.37-5.162-0.37h-263.978c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v264.040c0 22.094 17.91 40 40 40h263.978c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-264.044c0-20.34-15.19-37.094-34.838-39.632zM208.022 816.038v-184.040h183.978v184.040h-183.978zM437.162 128.4c-1.694-0.216-3.408-0.37-5.162-0.37h-263.978c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v263.968c0 22.094 17.91 40 40 40h263.978c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-263.972c0-20.342-15.19-37.096-34.838-39.632zM208.022 392v-183.968h183.978v183.968h-183.978zM861.212 552.368c-1.694-0.216-3.408-0.37-5.162-0.37h-264.050c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v264.040c0 22.094 17.91 40 40 40h264.048c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-264.044c0.002-20.34-15.19-37.094-34.836-39.632zM632 816.038v-184.040h184.048v184.040h-184.048zM861.212 128.4c-1.694-0.216-3.408-0.37-5.162-0.37h-264.050c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v263.968c0 22.094 17.91 40 40 40h264.048c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-263.972c0.002-20.342-15.19-37.096-34.836-39.632zM632 392v-183.968h184.048v183.968h-184.048z"
+          />
+        </svg>
+      </button>
+    </div>
+    <div
+      class="emotion-27"
+    >
+      <button
+        class="emotion-8"
+        title="Go full screen"
+      >
+        <svg
+          class="emotion-7"
+          viewBox="0 0 1024 1024"
+        >
+          <path
+            class="emotion-6"
+            d="M959.688 920.068l0.31-176c0.040-22.094-17.84-40.032-39.93-40.070-22.092-0.040-40.032 17.838-40.070 39.93l-0.142 79.672-235.734-235.732c-15.622-15.622-40.948-15.622-56.57 0s-15.622 40.948 0 56.568l235.442 235.442-78.946-0.1c-22.092-0.028-40.022 17.86-40.050 39.952-0.014 11.064 4.464 21.084 11.714 28.334 7.228 7.224 17.208 11.702 28.236 11.714l175.688 0.22c22.086 0.028 40.014-17.846 40.052-39.93zM920.178 64.228l-176-0.308c-22.094-0.040-40.032 17.84-40.070 39.93-0.040 22.092 17.838 40.032 39.93 40.070l79.672 0.14-235.732 235.734c-15.622 15.622-15.622 40.948 0 56.568s40.948 15.622 56.568 0l235.442-235.442-0.1 78.946c-0.028 22.092 17.86 40.022 39.952 40.050 11.064 0.014 21.084-4.464 28.334-11.714 7.224-7.228 11.702-17.208 11.714-28.236l0.22-175.688c0.026-22.082-17.846-40.010-39.93-40.050zM64.236 103.742l-0.308 176c-0.040 22.094 17.84 40.032 39.93 40.070 22.092 0.040 40.032-17.84 40.070-39.93l0.14-79.672 235.734 235.73c15.622 15.622 40.948 15.622 56.568 0s15.622-40.946 0-56.566l-235.442-235.442 78.946 0.098c22.092 0.028 40.022-17.86 40.050-39.95 0.014-11.066-4.464-21.086-11.714-28.336-7.228-7.222-17.208-11.7-28.236-11.714l-175.688-0.218c-22.084-0.026-40.012 17.844-40.050 39.93zM103.748 959.766l176 0.308c22.094 0.040 40.032-17.84 40.070-39.93 0.040-22.092-17.84-40.032-39.93-40.070l-79.672-0.14 235.73-235.734c15.622-15.622 15.622-40.948 0-56.568s-40.946-15.622-56.566 0l-235.442 235.442 0.098-78.946c0.028-22.092-17.86-40.022-39.95-40.050-11.066-0.014-21.086 4.464-28.336 11.714-7.222 7.228-11.7 17.208-11.714 28.236l-0.218 175.688c-0.026 22.082 17.844 40.010 39.93 40.050z"
+          />
+        </svg>
+      </button>
+      <span
+        class="emotion-5"
+      />
+      <button
+        class="emotion-8"
+        title="Open component in new tab"
+      >
+        <svg
+          class="emotion-7"
+          viewBox="0 0 1024 1024"
+        >
+          <path
+            class="emotion-6"
+            d="M896.006 920c0 22.090-17.91 40-40 40h-688.006c-22.090 0-40-17.906-40-40v-549.922c-0.838-3.224-1.33-6.588-1.33-10.072 0-22.090 17.908-40.004 40-40.004h178.66c22.092 0.004 40 17.914 40 40.004 0 22.088-17.908 40-40 40h-137.33v479.996h607.998v-479.996h-138.658c-22.090 0-40-17.912-40-40 0-22.090 17.906-40.004 40-40.004h178.658c22.090 0 40 17.91 40 40v559.844c0 0.050 0.008 0.102 0.008 0.154zM665.622 200.168l-124.452-124.45c-8.042-8.042-18.65-11.912-29.186-11.674-1.612-0.034-3.222 0-4.828 0.16-0.558 0.054-1.098 0.16-1.648 0.238-0.742 0.104-1.484 0.192-2.218 0.338-0.656 0.13-1.29 0.31-1.934 0.472-0.622 0.154-1.244 0.292-1.86 0.476-0.64 0.196-1.258 0.436-1.886 0.66-0.602 0.216-1.208 0.414-1.802 0.66-0.598 0.248-1.17 0.54-1.754 0.814-0.598 0.282-1.202 0.546-1.788 0.86-0.578 0.312-1.13 0.664-1.694 1-0.552 0.332-1.116 0.644-1.654 1.006-0.67 0.448-1.3 0.942-1.942 1.426-0.394 0.302-0.806 0.576-1.196 0.894-1.046 0.858-2.052 1.768-3.008 2.726l-124.398 124.39c-15.622 15.62-15.618 40.948 0.002 56.57 15.622 15.62 40.95 15.62 56.568 0l56.164-56.166v439.426c0 22.094 17.912 40 40.002 40 22.092 0 40-17.91 40-40v-441.202l57.942 57.942c15.622 15.624 40.948 15.62 56.568 0 15.626-15.618 15.626-40.946 0.002-56.566z"
+          />
+        </svg>
+      </button>
     </div>
   </div>,
   .emotion-2 {
diff --git a/lib/ui/src/settings/__snapshots__/about.stories.storyshot b/lib/ui/src/settings/__snapshots__/about.stories.storyshot
index 30c0ace51be..d822ee8dc84 100644
--- a/lib/ui/src/settings/__snapshots__/about.stories.storyshot
+++ b/lib/ui/src/settings/__snapshots__/about.stories.storyshot
@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Storyshots UI|Settings/AboutScreen failed to fetch new version 1`] = `
-.emotion-26 {
+.emotion-25 {
   width: 100%;
   height: 100%;
   box-sizing: border-box;
@@ -14,57 +14,6 @@ exports[`Storyshots UI|Settings/AboutScreen failed to fetch new version 1`] = `
   flex-direction: column;
 }
 
-.emotion-8 {
-  color: #999999;
-  height: 40px;
-  overflow: auto;
-  overflow-x: auto;
-  overflow-y: hidden;
-  -webkit-scrollbar-width: slim;
-  -moz-scrollbar-width: slim;
-  -ms-scrollbar-width: slim;
-  scrollbar-width: slim;
-  -webkit-scrollbar-width: 3px;
-  -moz-scrollbar-width: 3px;
-  -ms-scrollbar-width: 3px;
-  scrollbar-width: 3px;
-  -webkit-scrollbar-color: transparent transparent;
-  -moz-scrollbar-color: transparent transparent;
-  -ms-scrollbar-color: transparent transparent;
-  scrollbar-color: transparent transparent;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
-}
-
-.emotion-8::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  box-shadow: none;
-}
-
-.emotion-8::-webkit-scrollbar-track {
-  border-radius: 0;
-  background: transparent;
-  opacity: 0;
-  border: 0 none;
-  box-shadow: none;
-  height: 0;
-  width: 0;
-}
-
-.emotion-8::-webkit-scrollbar-thumb {
-  border-radius: 0;
-  background: rgba(0,0,0,.1);
-  box-shadow: none;
-}
-
-.emotion-8::-webkit-scrollbar-track-piece {
-  display: none;
-  border: 0 none;
-  opacity: 0;
-  visibility: hidden;
-}
-
 .emotion-7 {
   display: -webkit-box;
   display: -webkit-flex;
@@ -74,9 +23,14 @@ exports[`Storyshots UI|Settings/AboutScreen failed to fetch new version 1`] = `
   -webkit-justify-content: space-between;
   -ms-flex-pack: justify;
   justify-content: space-between;
-  position: relative;
-  white-space: nowrap;
+  background: #FFFFFF;
+  color: #999999;
   height: 40px;
+  position: relative;
+  overflow: visible;
+  overflow-x: visible;
+  overflow-y: visible;
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
 }
 
 .emotion-2 {
@@ -84,12 +38,9 @@ exports[`Storyshots UI|Settings/AboutScreen failed to fetch new version 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  -webkit-flex-basis: auto;
-  -ms-flex-preferred-size: auto;
-  flex-basis: auto;
-  -webkit-flex-shrink: 0;
-  -ms-flex-negative: 0;
-  flex-shrink: 0;
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
 }
 
 .emotion-2 > * {
@@ -97,10 +48,14 @@ exports[`Storyshots UI|Settings/AboutScreen failed to fetch new version 1`] = `
 }
 
 .emotion-1 {
-  overflow: hidden;
+  white-space: nowrap;
+  height: 100%;
+  padding-bottom: 50px;
+  overflow-x: visisble;
+  overflow-y: visisble;
 }
 
-.emotion-1:first-of-type {
+.emotion-1:first-child {
   margin-left: 0;
 }
 
@@ -154,13 +109,6 @@ exports[`Storyshots UI|Settings/AboutScreen failed to fetch new version 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  -webkit-flex-basis: auto;
-  -ms-flex-preferred-size: auto;
-  flex-basis: auto;
-  -webkit-flex-shrink: 0;
-  -ms-flex-negative: 0;
-  flex-shrink: 0;
-  margin-left: 30px;
 }
 
 .emotion-6 > * {
@@ -202,7 +150,7 @@ exports[`Storyshots UI|Settings/AboutScreen failed to fetch new version 1`] = `
   fill: currentColor;
 }
 
-.emotion-25 {
+.emotion-24 {
   display: block;
   position: relative;
   font-size: 13px;
@@ -214,6 +162,645 @@ exports[`Storyshots UI|Settings/AboutScreen failed to fetch new version 1`] = `
   width: 100%;
 }
 
+.emotion-13 {
+  display: inline-block;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: #1EA7FD;
+}
+
+.emotion-13 svg path {
+  fill: #1EA7FD;
+}
+
+.emotion-13:hover,
+.emotion-13:focus {
+  cursor: pointer;
+  -webkit-transform: translate3d(0,-1px,0);
+  -ms-transform: translate3d(0,-1px,0);
+  transform: translate3d(0,-1px,0);
+  color: #0297f5;
+}
+
+.emotion-13:hover svg path,
+.emotion-13:focus svg path {
+  fill: #0297f5;
+}
+
+.emotion-13:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  color: #028ee6;
+}
+
+.emotion-13:active svg path {
+  fill: #028ee6;
+}
+
+.emotion-13 svg {
+  display: inline-block;
+  height: 1em;
+  width: 1em;
+  vertical-align: text-top;
+  position: relative;
+  bottom: -0.125em;
+  margin-right: 0.4em;
+}
+
+.emotion-21 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  padding-top: 20px;
+  margin-top: 20px;
+  border-top: 1px solid rgba(0,0,0,.1);
+  font-weight: 700;
+}
+
+.emotion-21 > * + * {
+  margin-left: 20px;
+}
+
+.emotion-16 {
+  display: inline-block;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: #1EA7FD;
+  color: #999999;
+}
+
+.emotion-16 svg path {
+  fill: #1EA7FD;
+}
+
+.emotion-16:hover,
+.emotion-16:focus {
+  cursor: pointer;
+  -webkit-transform: translate3d(0,-1px,0);
+  -ms-transform: translate3d(0,-1px,0);
+  transform: translate3d(0,-1px,0);
+  color: #0297f5;
+}
+
+.emotion-16:hover svg path,
+.emotion-16:focus svg path {
+  fill: #0297f5;
+}
+
+.emotion-16:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  color: #028ee6;
+}
+
+.emotion-16:active svg path {
+  fill: #028ee6;
+}
+
+.emotion-16 svg {
+  display: inline-block;
+  height: 1em;
+  width: 1em;
+  vertical-align: text-top;
+  position: relative;
+  bottom: -0.125em;
+  margin-right: 0.4em;
+}
+
+.emotion-16 svg path {
+  fill: #999999;
+}
+
+.emotion-16:hover {
+  color: #666666;
+}
+
+.emotion-16:hover svg path {
+  fill: #666666;
+}
+
+.emotion-16:active {
+  color: #444444;
+}
+
+.emotion-16:active svg path {
+  fill: #444444;
+}
+
+.emotion-23 {
+  display: block;
+}
+
+.emotion-22 {
+  padding: 3rem 20px;
+  max-width: 600px;
+  margin: 0 auto;
+}
+
+.emotion-8 {
+  margin-bottom: 20px;
+  font-size: 28px;
+  font-weight: 900;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+}
+
+.emotion-8 > svg {
+  height: 32px;
+  width: auto;
+  margin-right: 8px;
+}
+
+.emotion-12 > svg:last-of-type {
+  height: 0.7em;
+  width: 0.7em;
+  margin-right: 0;
+  margin-left: 0.25em;
+  bottom: auto;
+  vertical-align: inherit;
+}
+
+.emotion-9 {
+  background: #FEDED2;
+  color: #FF4400;
+  font-weight: 700;
+  padding: 10px 20px;
+  margin-bottom: 24px;
+  border: 1px solid rgba(0,0,0,.1);
+  text-align: center;
+}
+
+.emotion-14 {
+  font-weight: 700;
+  text-align: center;
+}
+
+<div
+  class="emotion-25"
+>
+  <div
+    class="emotion-7"
+  >
+    <div
+      class="emotion-2"
+    >
+      <div
+        class="emotion-1"
+        role="tablist"
+      >
+        <button
+          class="emotion-0"
+          role="tab"
+          type="button"
+        >
+          About
+        </button>
+      </div>
+    </div>
+    <div
+      class="emotion-6"
+    >
+      <button
+        class="emotion-5"
+      >
+        <svg
+          class="emotion-4"
+          viewBox="0 0 1024 1024"
+        >
+          <path
+            class="emotion-3"
+            d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
+          />
+        </svg>
+      </button>
+    </div>
+  </div>
+  <div
+    class="emotion-24"
+  >
+    <div
+      class="emotion-23"
+      role="tabpanel"
+    >
+      <div
+        class="emotion-22"
+      >
+        <header
+          class="emotion-8"
+        >
+          <svg
+            title="Storybook icon"
+            viewBox="0 0 64 64"
+          >
+            <g
+              fill="none"
+              fill-rule="evenodd"
+              id="Artboard"
+              stroke="none"
+              stroke-width="1"
+            >
+              <path
+                d="M8.04798541,58.7875918 L6.07908839,6.32540407 C6.01406344,4.5927838 7.34257463,3.12440831 9.07303814,3.01625434 L53.6958037,0.227331489 C55.457209,0.117243658 56.974354,1.45590096 57.0844418,3.21730626 C57.0885895,3.28366922 57.0906648,3.35014546 57.0906648,3.41663791 L57.0906648,60.5834697 C57.0906648,62.3483119 55.6599776,63.7789992 53.8951354,63.7789992 C53.847325,63.7789992 53.7995207,63.7779262 53.7517585,63.775781 L11.0978899,61.8600599 C9.43669044,61.7854501 8.11034889,60.4492961 8.04798541,58.7875918 Z"
+                fill="#FF4785"
+                fill-rule="nonzero"
+                id="path-1"
+              />
+              <path
+                d="M35.9095005,24.1768792 C35.9095005,25.420127 44.2838488,24.8242707 45.4080313,23.9509748 C45.4080313,15.4847538 40.8652557,11.0358878 32.5466666,11.0358878 C24.2280775,11.0358878 19.5673077,15.553972 19.5673077,22.3311017 C19.5673077,34.1346028 35.4965208,34.3605071 35.4965208,40.7987804 C35.4965208,42.606015 34.6115646,43.6790606 32.6646607,43.6790606 C30.127786,43.6790606 29.1248356,42.3834613 29.2428298,37.9783269 C29.2428298,37.0226907 19.5673077,36.7247626 19.2723223,37.9783269 C18.5211693,48.6535354 25.1720308,51.7326752 32.7826549,51.7326752 C40.1572906,51.7326752 45.939005,47.8018145 45.939005,40.6858282 C45.939005,28.035186 29.7738035,28.3740425 29.7738035,22.1051974 C29.7738035,19.5637737 31.6617103,19.2249173 32.7826549,19.2249173 C33.9625966,19.2249173 36.0864917,19.4328883 35.9095005,24.1768792 Z"
+                fill="#FFFFFF"
+                fill-rule="nonzero"
+                id="path9_fill-path"
+              />
+              <path
+                d="M44.0461638,0.830433986 L50.1874092,0.446606143 L50.443532,7.7810017 C50.4527198,8.04410717 50.2468789,8.26484453 49.9837734,8.27403237 C49.871115,8.27796649 49.7607078,8.24184808 49.6721567,8.17209069 L47.3089847,6.3104681 L44.5110468,8.43287463 C44.3012992,8.591981 44.0022839,8.55092814 43.8431776,8.34118051 C43.7762017,8.25288717 43.742082,8.14401677 43.7466857,8.03329059 L44.0461638,0.830433986 Z"
+                fill="#FFFFFF"
+                id="Path"
+              />
+            </g>
+          </svg>
+          Storybook 5.0.0
+        </header>
+        <div
+          class="emotion-9"
+        >
+          Oops! The latest version of Storybook couldn't be fetched.
+        </div>
+        <div
+          class="emotion-14"
+        >
+          <a
+            class="emotion-13"
+            href="https://github.com/storybooks/storybook/releases"
+            target="_blank"
+          >
+            <span
+              class="emotion-12"
+            >
+              Check Storybook's release history
+              <svg
+                class="emotion-4"
+                viewBox="0 0 1024 1024"
+              >
+                <path
+                  class="emotion-3"
+                  d="M768.072 514.022c0 10.236-3.904 20.47-11.712 28.282l-344.098 344.156c-15.62 15.624-40.946 15.624-56.568 0.006-15.622-15.622-15.624-40.948-0.006-56.568l315.82-315.876-315.868-315.922c-15.618-15.624-15.618-40.952 0.004-56.568 15.624-15.62 40.95-15.618 56.57 0.006l344.144 344.204c7.81 7.81 11.714 18.044 11.714 28.28z"
+                />
+              </svg>
+            </span>
+          </a>
+        </div>
+        <div
+          class="emotion-21"
+        >
+          <a
+            class="emotion-16"
+            href="https://storybook.js.org"
+          >
+            <span
+              class="emotion-15"
+            >
+              Docs
+            </span>
+          </a>
+          <a
+            class="emotion-16"
+            href="https://github.com/storybooks/storybook"
+          >
+            <span
+              class="emotion-15"
+            >
+              GitHub
+            </span>
+          </a>
+          <a
+            class="emotion-16"
+            href="https://storybook.js.org/support"
+          >
+            <span
+              class="emotion-15"
+            >
+              Support
+            </span>
+          </a>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+`;
+
+exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
+.emotion-41 {
+  width: 100%;
+  height: 100%;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+}
+
+.emotion-7 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+  background: #FFFFFF;
+  color: #999999;
+  height: 40px;
+  position: relative;
+  overflow: visible;
+  overflow-x: visible;
+  overflow-y: visible;
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-2 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+}
+
+.emotion-2 > * {
+  margin-left: 15px;
+}
+
+.emotion-1 {
+  white-space: nowrap;
+  height: 100%;
+  padding-bottom: 50px;
+  overflow-x: visisble;
+  overflow-y: visisble;
+}
+
+.emotion-1:first-child {
+  margin-left: 0;
+}
+
+.emotion-0 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
+  font-size: 13px;
+  color: #1EA7FD;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-0:empty {
+  display: none;
+}
+
+.emotion-0:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-6 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+}
+
+.emotion-6 > * {
+  margin-right: 15px;
+}
+
+.emotion-5 {
+  height: 40px;
+  background: none;
+  color: inherit;
+  padding: 0;
+  cursor: pointer;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+}
+
+.emotion-5:hover,
+.emotion-5:focus {
+  outline: 0 none;
+  color: #1EA7FD;
+}
+
+.emotion-5 > svg {
+  width: 15px;
+}
+
+.emotion-4 {
+  shape-rendering: inherit;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  display: block;
+}
+
+.emotion-3 {
+  fill: currentColor;
+}
+
+.emotion-40 {
+  display: block;
+  position: relative;
+  font-size: 13px;
+  position: relative;
+  overflow: auto;
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  width: 100%;
+}
+
+.emotion-37 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  padding-top: 20px;
+  margin-top: 20px;
+  border-top: 1px solid rgba(0,0,0,.1);
+  font-weight: 700;
+}
+
+.emotion-37 > * + * {
+  margin-left: 20px;
+}
+
+.emotion-32 {
+  display: inline-block;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: #1EA7FD;
+  color: #999999;
+}
+
+.emotion-32 svg path {
+  fill: #1EA7FD;
+}
+
+.emotion-32:hover,
+.emotion-32:focus {
+  cursor: pointer;
+  -webkit-transform: translate3d(0,-1px,0);
+  -ms-transform: translate3d(0,-1px,0);
+  transform: translate3d(0,-1px,0);
+  color: #0297f5;
+}
+
+.emotion-32:hover svg path,
+.emotion-32:focus svg path {
+  fill: #0297f5;
+}
+
+.emotion-32:active {
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  color: #028ee6;
+}
+
+.emotion-32:active svg path {
+  fill: #028ee6;
+}
+
+.emotion-32 svg {
+  display: inline-block;
+  height: 1em;
+  width: 1em;
+  vertical-align: text-top;
+  position: relative;
+  bottom: -0.125em;
+  margin-right: 0.4em;
+}
+
+.emotion-32 svg path {
+  fill: #999999;
+}
+
+.emotion-32:hover {
+  color: #666666;
+}
+
+.emotion-32:hover svg path {
+  fill: #666666;
+}
+
+.emotion-32:active {
+  color: #444444;
+}
+
+.emotion-32:active svg path {
+  fill: #444444;
+}
+
+.emotion-39 {
+  display: block;
+}
+
+.emotion-38 {
+  padding: 3rem 20px;
+  max-width: 600px;
+  margin: 0 auto;
+}
+
+.emotion-8 {
+  margin-bottom: 20px;
+  font-size: 28px;
+  font-weight: 900;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+}
+
+.emotion-8 > svg {
+  height: 32px;
+  width: auto;
+  margin-right: 8px;
+}
+
+.emotion-15 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+}
+
+.emotion-10 {
+  -webkit-letter-spacing: 0.35em;
+  -moz-letter-spacing: 0.35em;
+  -ms-letter-spacing: 0.35em;
+  letter-spacing: 0.35em;
+  text-transform: uppercase;
+  font-weight: 900;
+  font-size: 13px;
+  line-height: 24px;
+  color: #999999;
+}
+
 .emotion-14 {
   display: inline-block;
   -webkit-transition: all 150ms ease-out;
@@ -221,6 +808,8 @@ exports[`Storyshots UI|Settings/AboutScreen failed to fetch new version 1`] = `
   -webkit-text-decoration: none;
   text-decoration: none;
   color: #1EA7FD;
+  color: #999999;
+  font-size: 12px;
 }
 
 .emotion-14 svg path {
@@ -262,120 +851,26 @@ exports[`Storyshots UI|Settings/AboutScreen failed to fetch new version 1`] = `
   margin-right: 0.4em;
 }
 
-.emotion-22 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  padding-top: 20px;
-  margin-top: 20px;
-  border-top: 1px solid rgba(0,0,0,.1);
-  font-weight: 700;
-}
-
-.emotion-22 > * + * {
-  margin-left: 20px;
-}
-
-.emotion-17 {
-  display: inline-block;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  color: #1EA7FD;
-  color: #999999;
-}
-
-.emotion-17 svg path {
-  fill: #1EA7FD;
-}
-
-.emotion-17:hover,
-.emotion-17:focus {
-  cursor: pointer;
-  -webkit-transform: translate3d(0,-1px,0);
-  -ms-transform: translate3d(0,-1px,0);
-  transform: translate3d(0,-1px,0);
-  color: #0297f5;
-}
-
-.emotion-17:hover svg path,
-.emotion-17:focus svg path {
-  fill: #0297f5;
-}
-
-.emotion-17:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  color: #028ee6;
-}
-
-.emotion-17:active svg path {
-  fill: #028ee6;
-}
-
-.emotion-17 svg {
-  display: inline-block;
-  height: 1em;
-  width: 1em;
-  vertical-align: text-top;
-  position: relative;
-  bottom: -0.125em;
-  margin-right: 0.4em;
-}
-
-.emotion-17 svg path {
+.emotion-14 svg path {
   fill: #999999;
 }
 
-.emotion-17:hover {
+.emotion-14:hover {
   color: #666666;
 }
 
-.emotion-17:hover svg path {
+.emotion-14:hover svg path {
   fill: #666666;
 }
 
-.emotion-17:active {
+.emotion-14:active {
   color: #444444;
 }
 
-.emotion-17:active svg path {
+.emotion-14:active svg path {
   fill: #444444;
 }
 
-.emotion-24 {
-  display: block;
-}
-
-.emotion-23 {
-  padding: 3rem 20px;
-  max-width: 600px;
-  margin: 0 auto;
-}
-
-.emotion-9 {
-  margin-bottom: 20px;
-  font-size: 28px;
-  font-weight: 900;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-}
-
-.emotion-9 > svg {
-  height: 32px;
-  width: auto;
-  margin-right: 8px;
-}
-
 .emotion-13 > svg:last-of-type {
   height: 0.7em;
   width: 0.7em;
@@ -385,646 +880,39 @@ exports[`Storyshots UI|Settings/AboutScreen failed to fetch new version 1`] = `
   vertical-align: inherit;
 }
 
-.emotion-10 {
-  background: #FEDED2;
-  color: #FF4400;
-  font-weight: 700;
-  padding: 10px 20px;
-  margin-bottom: 24px;
-  border: 1px solid rgba(0,0,0,.1);
-  text-align: center;
-}
-
-.emotion-15 {
-  font-weight: 700;
-  text-align: center;
-}
-
-<div
-  class="emotion-26"
-  title="wrapper"
->
-  <div
-    class="emotion-8"
-    title="bar"
-  >
-    <div
-      class="emotion-7"
-    >
-      <div
-        class="emotion-2"
-        title="side left"
-      >
-        <div
-          class="emotion-1"
-          role="tablist"
-        >
-          <button
-            class="emotion-0"
-            role="tab"
-            type="button"
-          >
-            About
-          </button>
-        </div>
-      </div>
-      <div
-        class="emotion-6"
-        title="side right"
-      >
-        <button
-          class="emotion-5"
-        >
-          <svg
-            class="emotion-4"
-            viewBox="0 0 1024 1024"
-          >
-            <path
-              class="emotion-3"
-              d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
-            />
-          </svg>
-        </button>
-      </div>
-    </div>
-  </div>
-  <div
-    class="emotion-25"
-  >
-    <div
-      class="emotion-24"
-      role="tabpanel"
-    >
-      <div
-        class="emotion-23"
-      >
-        <header
-          class="emotion-9"
-        >
-          <svg
-            title="Storybook icon"
-            viewBox="0 0 64 64"
-          >
-            <g
-              fill="none"
-              fill-rule="evenodd"
-              id="Artboard"
-              stroke="none"
-              stroke-width="1"
-            >
-              <path
-                d="M8.04798541,58.7875918 L6.07908839,6.32540407 C6.01406344,4.5927838 7.34257463,3.12440831 9.07303814,3.01625434 L53.6958037,0.227331489 C55.457209,0.117243658 56.974354,1.45590096 57.0844418,3.21730626 C57.0885895,3.28366922 57.0906648,3.35014546 57.0906648,3.41663791 L57.0906648,60.5834697 C57.0906648,62.3483119 55.6599776,63.7789992 53.8951354,63.7789992 C53.847325,63.7789992 53.7995207,63.7779262 53.7517585,63.775781 L11.0978899,61.8600599 C9.43669044,61.7854501 8.11034889,60.4492961 8.04798541,58.7875918 Z"
-                fill="#FF4785"
-                fill-rule="nonzero"
-                id="path-1"
-              />
-              <path
-                d="M35.9095005,24.1768792 C35.9095005,25.420127 44.2838488,24.8242707 45.4080313,23.9509748 C45.4080313,15.4847538 40.8652557,11.0358878 32.5466666,11.0358878 C24.2280775,11.0358878 19.5673077,15.553972 19.5673077,22.3311017 C19.5673077,34.1346028 35.4965208,34.3605071 35.4965208,40.7987804 C35.4965208,42.606015 34.6115646,43.6790606 32.6646607,43.6790606 C30.127786,43.6790606 29.1248356,42.3834613 29.2428298,37.9783269 C29.2428298,37.0226907 19.5673077,36.7247626 19.2723223,37.9783269 C18.5211693,48.6535354 25.1720308,51.7326752 32.7826549,51.7326752 C40.1572906,51.7326752 45.939005,47.8018145 45.939005,40.6858282 C45.939005,28.035186 29.7738035,28.3740425 29.7738035,22.1051974 C29.7738035,19.5637737 31.6617103,19.2249173 32.7826549,19.2249173 C33.9625966,19.2249173 36.0864917,19.4328883 35.9095005,24.1768792 Z"
-                fill="#FFFFFF"
-                fill-rule="nonzero"
-                id="path9_fill-path"
-              />
-              <path
-                d="M44.0461638,0.830433986 L50.1874092,0.446606143 L50.443532,7.7810017 C50.4527198,8.04410717 50.2468789,8.26484453 49.9837734,8.27403237 C49.871115,8.27796649 49.7607078,8.24184808 49.6721567,8.17209069 L47.3089847,6.3104681 L44.5110468,8.43287463 C44.3012992,8.591981 44.0022839,8.55092814 43.8431776,8.34118051 C43.7762017,8.25288717 43.742082,8.14401677 43.7466857,8.03329059 L44.0461638,0.830433986 Z"
-                fill="#FFFFFF"
-                id="Path"
-              />
-            </g>
-          </svg>
-          Storybook 5.0.0
-        </header>
-        <div
-          class="emotion-10"
-        >
-          Oops! The latest version of Storybook couldn't be fetched.
-        </div>
-        <div
-          class="emotion-15"
-        >
-          <a
-            class="emotion-14"
-            href="https://github.com/storybooks/storybook/releases"
-            target="_blank"
-          >
-            <span
-              class="emotion-13"
-            >
-              Check Storybook's release history
-              <svg
-                class="emotion-4"
-                viewBox="0 0 1024 1024"
-              >
-                <path
-                  class="emotion-3"
-                  d="M768.072 514.022c0 10.236-3.904 20.47-11.712 28.282l-344.098 344.156c-15.62 15.624-40.946 15.624-56.568 0.006-15.622-15.622-15.624-40.948-0.006-56.568l315.82-315.876-315.868-315.922c-15.618-15.624-15.618-40.952 0.004-56.568 15.624-15.62 40.95-15.618 56.57 0.006l344.144 344.204c7.81 7.81 11.714 18.044 11.714 28.28z"
-                />
-              </svg>
-            </span>
-          </a>
-        </div>
-        <div
-          class="emotion-22"
-        >
-          <a
-            class="emotion-17"
-            href="https://storybook.js.org"
-          >
-            <span
-              class="emotion-16"
-            >
-              Docs
-            </span>
-          </a>
-          <a
-            class="emotion-17"
-            href="https://github.com/storybooks/storybook"
-          >
-            <span
-              class="emotion-16"
-            >
-              GitHub
-            </span>
-          </a>
-          <a
-            class="emotion-17"
-            href="https://storybook.js.org/support"
-          >
-            <span
-              class="emotion-16"
-            >
-              Support
-            </span>
-          </a>
-        </div>
-      </div>
-    </div>
-  </div>
-</div>
-`;
-
-exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
-.emotion-42 {
-  width: 100%;
-  height: 100%;
-  box-sizing: border-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-}
-
-.emotion-8 {
-  color: #999999;
-  height: 40px;
-  overflow: auto;
-  overflow-x: auto;
-  overflow-y: hidden;
-  -webkit-scrollbar-width: slim;
-  -moz-scrollbar-width: slim;
-  -ms-scrollbar-width: slim;
-  scrollbar-width: slim;
-  -webkit-scrollbar-width: 3px;
-  -moz-scrollbar-width: 3px;
-  -ms-scrollbar-width: 3px;
-  scrollbar-width: 3px;
-  -webkit-scrollbar-color: transparent transparent;
-  -moz-scrollbar-color: transparent transparent;
-  -ms-scrollbar-color: transparent transparent;
-  scrollbar-color: transparent transparent;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
-}
-
-.emotion-8::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  box-shadow: none;
-}
-
-.emotion-8::-webkit-scrollbar-track {
-  border-radius: 0;
-  background: transparent;
-  opacity: 0;
-  border: 0 none;
-  box-shadow: none;
-  height: 0;
-  width: 0;
-}
-
-.emotion-8::-webkit-scrollbar-thumb {
-  border-radius: 0;
-  background: rgba(0,0,0,.1);
-  box-shadow: none;
-}
-
-.emotion-8::-webkit-scrollbar-track-piece {
-  display: none;
-  border: 0 none;
-  opacity: 0;
-  visibility: hidden;
-}
-
-.emotion-7 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-pack: justify;
-  -webkit-justify-content: space-between;
-  -ms-flex-pack: justify;
-  justify-content: space-between;
-  position: relative;
-  white-space: nowrap;
-  height: 40px;
-}
-
-.emotion-2 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex-basis: auto;
-  -ms-flex-preferred-size: auto;
-  flex-basis: auto;
-  -webkit-flex-shrink: 0;
-  -ms-flex-negative: 0;
-  flex-shrink: 0;
-}
-
-.emotion-2 > * {
-  margin-left: 15px;
-}
-
-.emotion-1 {
-  overflow: hidden;
-}
-
-.emotion-1:first-of-type {
-  margin-left: 0;
-}
-
-.emotion-0 {
-  white-space: normal;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding: 0 15px;
-  text-transform: capitalize;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  height: 40px;
-  line-height: 12px;
-  cursor: pointer;
-  background: transparent;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  font-weight: bold;
-  font-size: 13px;
-  color: #1EA7FD;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-0:empty {
-  display: none;
-}
-
-.emotion-0:focus {
-  outline: 0 none;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-6 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex-basis: auto;
-  -ms-flex-preferred-size: auto;
-  flex-basis: auto;
-  -webkit-flex-shrink: 0;
-  -ms-flex-negative: 0;
-  flex-shrink: 0;
-  margin-left: 30px;
-}
-
-.emotion-6 > * {
-  margin-right: 15px;
-}
-
-.emotion-5 {
-  height: 40px;
-  background: none;
-  color: inherit;
-  padding: 0;
-  cursor: pointer;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-}
-
-.emotion-5:hover,
-.emotion-5:focus {
-  outline: 0 none;
-  color: #1EA7FD;
-}
-
-.emotion-5 > svg {
-  width: 15px;
-}
-
-.emotion-4 {
-  shape-rendering: inherit;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  display: block;
-}
-
-.emotion-3 {
-  fill: currentColor;
-}
-
-.emotion-41 {
-  display: block;
-  position: relative;
-  font-size: 13px;
-  position: relative;
-  overflow: auto;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  width: 100%;
-}
-
-.emotion-38 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  padding-top: 20px;
-  margin-top: 20px;
-  border-top: 1px solid rgba(0,0,0,.1);
-  font-weight: 700;
-}
-
-.emotion-38 > * + * {
-  margin-left: 20px;
-}
-
-.emotion-33 {
-  display: inline-block;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  color: #1EA7FD;
-  color: #999999;
-}
-
-.emotion-33 svg path {
-  fill: #1EA7FD;
-}
-
-.emotion-33:hover,
-.emotion-33:focus {
-  cursor: pointer;
-  -webkit-transform: translate3d(0,-1px,0);
-  -ms-transform: translate3d(0,-1px,0);
-  transform: translate3d(0,-1px,0);
-  color: #0297f5;
-}
-
-.emotion-33:hover svg path,
-.emotion-33:focus svg path {
-  fill: #0297f5;
-}
-
-.emotion-33:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  color: #028ee6;
-}
-
-.emotion-33:active svg path {
-  fill: #028ee6;
-}
-
-.emotion-33 svg {
-  display: inline-block;
-  height: 1em;
-  width: 1em;
-  vertical-align: text-top;
-  position: relative;
-  bottom: -0.125em;
-  margin-right: 0.4em;
-}
-
-.emotion-33 svg path {
-  fill: #999999;
-}
-
-.emotion-33:hover {
-  color: #666666;
-}
-
-.emotion-33:hover svg path {
-  fill: #666666;
-}
-
-.emotion-33:active {
-  color: #444444;
-}
-
-.emotion-33:active svg path {
-  fill: #444444;
-}
-
-.emotion-40 {
-  display: block;
-}
-
-.emotion-39 {
-  padding: 3rem 20px;
-  max-width: 600px;
-  margin: 0 auto;
-}
-
-.emotion-9 {
-  margin-bottom: 20px;
-  font-size: 28px;
-  font-weight: 900;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-}
-
-.emotion-9 > svg {
-  height: 32px;
-  width: auto;
-  margin-right: 8px;
-}
-
 .emotion-16 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-pack: justify;
-  -webkit-justify-content: space-between;
-  -ms-flex-pack: justify;
-  justify-content: space-between;
-}
-
-.emotion-11 {
-  -webkit-letter-spacing: 0.35em;
-  -moz-letter-spacing: 0.35em;
-  -ms-letter-spacing: 0.35em;
-  letter-spacing: 0.35em;
-  text-transform: uppercase;
-  font-weight: 900;
-  font-size: 13px;
-  line-height: 24px;
-  color: #999999;
-}
-
-.emotion-15 {
-  display: inline-block;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  color: #1EA7FD;
-  color: #999999;
-  font-size: 12px;
-}
-
-.emotion-15 svg path {
-  fill: #1EA7FD;
-}
-
-.emotion-15:hover,
-.emotion-15:focus {
-  cursor: pointer;
-  -webkit-transform: translate3d(0,-1px,0);
-  -ms-transform: translate3d(0,-1px,0);
-  transform: translate3d(0,-1px,0);
-  color: #0297f5;
-}
-
-.emotion-15:hover svg path,
-.emotion-15:focus svg path {
-  fill: #0297f5;
-}
-
-.emotion-15:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  color: #028ee6;
-}
-
-.emotion-15:active svg path {
-  fill: #028ee6;
-}
-
-.emotion-15 svg {
-  display: inline-block;
-  height: 1em;
-  width: 1em;
-  vertical-align: text-top;
-  position: relative;
-  bottom: -0.125em;
-  margin-right: 0.4em;
-}
-
-.emotion-15 svg path {
-  fill: #999999;
-}
-
-.emotion-15:hover {
-  color: #666666;
-}
-
-.emotion-15:hover svg path {
-  fill: #666666;
-}
-
-.emotion-15:active {
-  color: #444444;
-}
-
-.emotion-15:active svg path {
-  fill: #444444;
-}
-
-.emotion-14 > svg:last-of-type {
-  height: 0.7em;
-  width: 0.7em;
-  margin-right: 0;
-  margin-left: 0.25em;
-  bottom: auto;
-  vertical-align: inherit;
-}
-
-.emotion-17 {
   font-size: 14px;
   line-height: 1.6;
 }
 
-.emotion-17 h1 {
+.emotion-16 h1 {
   font-size: 32px;
   font-weight: 900;
 }
 
-.emotion-17 h2 {
+.emotion-16 h2 {
   font-size: 24px;
   border-bottom: 1px solid rgba(0,0,0,.1);
 }
 
-.emotion-17 h3 {
+.emotion-16 h3 {
   font-size: 20px;
 }
 
-.emotion-17 h4 {
+.emotion-16 h4 {
   font-size: 16px;
 }
 
-.emotion-17 h5 {
+.emotion-16 h5 {
   font-size: 14px;
 }
 
-.emotion-17 h6 {
+.emotion-16 h6 {
   font-size: 14px;
   color: #666666;
 }
 
-.emotion-17 pre:not(.hljs) {
+.emotion-16 pre:not(.hljs) {
   background: transparent;
   border: none;
   border-radius: 0;
@@ -1032,8 +920,8 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   margin: 0;
 }
 
-.emotion-17 pre pre,
-.emotion-17 pre.hljs {
+.emotion-16 pre pre,
+.emotion-16 pre.hljs {
   padding: 15px;
   margin: 0;
   overflow: auto;
@@ -1043,13 +931,13 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   line-height: 19px;
 }
 
-.emotion-17 pre pre code,
-.emotion-17 pre.hljs code {
+.emotion-16 pre pre code,
+.emotion-16 pre.hljs code {
   color: inherit;
   font-size: inherit;
 }
 
-.emotion-17 pre code {
+.emotion-16 pre code {
   margin: 0;
   padding: 0;
   white-space: pre;
@@ -1057,31 +945,31 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   background: transparent;
 }
 
-.emotion-17 pre code,
-.emotion-17 pre tt {
+.emotion-16 pre code,
+.emotion-16 pre tt {
   background-color: transparent;
   border: none;
 }
 
-.emotion-17 body > *:first-of-type {
+.emotion-16 body > *:first-child {
   margin-top: 0 !important;
 }
 
-.emotion-17 body > *:last-child {
+.emotion-16 body > *:last-child {
   margin-bottom: 0 !important;
 }
 
-.emotion-17 a {
+.emotion-16 a {
   color: #1EA7FD;
   -webkit-text-decoration: none;
   text-decoration: none;
 }
 
-.emotion-17 a.absent {
+.emotion-16 a.absent {
   color: #cc0000;
 }
 
-.emotion-17 a.anchor {
+.emotion-16 a.anchor {
   display: block;
   padding-left: 30px;
   margin-left: -30px;
@@ -1092,153 +980,153 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   bottom: 0;
 }
 
-.emotion-17 h1,
-.emotion-17 h2,
-.emotion-17 h3,
-.emotion-17 h4,
-.emotion-17 h5,
-.emotion-17 h6 {
+.emotion-16 h1,
+.emotion-16 h2,
+.emotion-16 h3,
+.emotion-16 h4,
+.emotion-16 h5,
+.emotion-16 h6 {
   margin: 20px 0 10px;
   padding: 0;
   cursor: text;
   position: relative;
 }
 
-.emotion-17 h2:first-of-type,
-.emotion-17 h1:first-of-type,
-.emotion-17 h1:first-of-type + h2,
-.emotion-17 h3:first-of-type,
-.emotion-17 h4:first-of-type,
-.emotion-17 h5:first-of-type,
-.emotion-17 h6:first-of-type {
+.emotion-16 h2:first-child,
+.emotion-16 h1:first-child,
+.emotion-16 h1:first-child + h2,
+.emotion-16 h3:first-child,
+.emotion-16 h4:first-child,
+.emotion-16 h5:first-child,
+.emotion-16 h6:first-child {
   margin-top: 0;
   padding-top: 0;
 }
 
-.emotion-17 h1:hover a.anchor,
-.emotion-17 h2:hover a.anchor,
-.emotion-17 h3:hover a.anchor,
-.emotion-17 h4:hover a.anchor,
-.emotion-17 h5:hover a.anchor,
-.emotion-17 h6:hover a.anchor {
+.emotion-16 h1:hover a.anchor,
+.emotion-16 h2:hover a.anchor,
+.emotion-16 h3:hover a.anchor,
+.emotion-16 h4:hover a.anchor,
+.emotion-16 h5:hover a.anchor,
+.emotion-16 h6:hover a.anchor {
   -webkit-text-decoration: none;
   text-decoration: none;
 }
 
-.emotion-17 h1 tt,
-.emotion-17 h1 code {
+.emotion-16 h1 tt,
+.emotion-16 h1 code {
   font-size: inherit;
 }
 
-.emotion-17 h2 tt,
-.emotion-17 h2 code {
+.emotion-16 h2 tt,
+.emotion-16 h2 code {
   font-size: inherit;
 }
 
-.emotion-17 h3 tt,
-.emotion-17 h3 code {
+.emotion-16 h3 tt,
+.emotion-16 h3 code {
   font-size: inherit;
 }
 
-.emotion-17 h4 tt,
-.emotion-17 h4 code {
+.emotion-16 h4 tt,
+.emotion-16 h4 code {
   font-size: inherit;
 }
 
-.emotion-17 h5 tt,
-.emotion-17 h5 code {
+.emotion-16 h5 tt,
+.emotion-16 h5 code {
   font-size: inherit;
 }
 
-.emotion-17 h6 tt,
-.emotion-17 h6 code {
+.emotion-16 h6 tt,
+.emotion-16 h6 code {
   font-size: inherit;
 }
 
-.emotion-17 p,
-.emotion-17 blockquote,
-.emotion-17 ul,
-.emotion-17 ol,
-.emotion-17 dl,
-.emotion-17 li,
-.emotion-17 table,
-.emotion-17 pre {
+.emotion-16 p,
+.emotion-16 blockquote,
+.emotion-16 ul,
+.emotion-16 ol,
+.emotion-16 dl,
+.emotion-16 li,
+.emotion-16 table,
+.emotion-16 pre {
   margin: 15px 0;
 }
 
-.emotion-17 hr {
+.emotion-16 hr {
   border: 0 none;
   color: rgba(0,0,0,.1);
   height: 4px;
   padding: 0;
 }
 
-.emotion-17 body > h2:first-of-type {
+.emotion-16 body > h2:first-child {
   margin-top: 0;
   padding-top: 0;
 }
 
-.emotion-17 body > h1:first-of-type {
+.emotion-16 body > h1:first-child {
   margin-top: 0;
   padding-top: 0;
 }
 
-.emotion-17 body > h1:first-of-type + h2 {
+.emotion-16 body > h1:first-child + h2 {
   margin-top: 0;
   padding-top: 0;
 }
 
-.emotion-17 body > h3:first-of-type,
-.emotion-17 body > h4:first-of-type,
-.emotion-17 body > h5:first-of-type,
-.emotion-17 body > h6:first-of-type {
+.emotion-16 body > h3:first-child,
+.emotion-16 body > h4:first-child,
+.emotion-16 body > h5:first-child,
+.emotion-16 body > h6:first-child {
   margin-top: 0;
   padding-top: 0;
 }
 
-.emotion-17 a:first-of-type h1,
-.emotion-17 a:first-of-type h2,
-.emotion-17 a:first-of-type h3,
-.emotion-17 a:first-of-type h4,
-.emotion-17 a:first-of-type h5,
-.emotion-17 a:first-of-type h6 {
+.emotion-16 a:first-child h1,
+.emotion-16 a:first-child h2,
+.emotion-16 a:first-child h3,
+.emotion-16 a:first-child h4,
+.emotion-16 a:first-child h5,
+.emotion-16 a:first-child h6 {
   margin-top: 0;
   padding-top: 0;
 }
 
-.emotion-17 h1 p,
-.emotion-17 h2 p,
-.emotion-17 h3 p,
-.emotion-17 h4 p,
-.emotion-17 h5 p,
-.emotion-17 h6 p {
+.emotion-16 h1 p,
+.emotion-16 h2 p,
+.emotion-16 h3 p,
+.emotion-16 h4 p,
+.emotion-16 h5 p,
+.emotion-16 h6 p {
   margin-top: 0;
 }
 
-.emotion-17 li p.first {
+.emotion-16 li p.first {
   display: inline-block;
 }
 
-.emotion-17 ul,
-.emotion-17 ol {
+.emotion-16 ul,
+.emotion-16 ol {
   padding-left: 30px;
 }
 
-.emotion-17 ul :first-of-type,
-.emotion-17 ol :first-of-type {
+.emotion-16 ul :first-child,
+.emotion-16 ol :first-child {
   margin-top: 0;
 }
 
-.emotion-17 ul :last-child,
-.emotion-17 ol :last-child {
+.emotion-16 ul :last-child,
+.emotion-16 ol :last-child {
   margin-bottom: 0;
 }
 
-.emotion-17 dl {
+.emotion-16 dl {
   padding: 0;
 }
 
-.emotion-17 dl dt {
+.emotion-16 dl dt {
   font-size: 14px;
   font-weight: bold;
   font-style: italic;
@@ -1246,62 +1134,62 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   margin: 15px 0 5px;
 }
 
-.emotion-17 dl dt:first-of-type {
+.emotion-16 dl dt:first-child {
   padding: 0;
 }
 
-.emotion-17 dl dt > :first-of-type {
+.emotion-16 dl dt > :first-child {
   margin-top: 0;
 }
 
-.emotion-17 dl dt > :last-child {
+.emotion-16 dl dt > :last-child {
   margin-bottom: 0;
 }
 
-.emotion-17 dl dd {
+.emotion-16 dl dd {
   margin: 0 0 15px;
   padding: 0 15px;
 }
 
-.emotion-17 dl dd > :first-of-type {
+.emotion-16 dl dd > :first-child {
   margin-top: 0;
 }
 
-.emotion-17 dl dd > :last-child {
+.emotion-16 dl dd > :last-child {
   margin-bottom: 0;
 }
 
-.emotion-17 blockquote {
+.emotion-16 blockquote {
   border-left: 4px solid #DDDDDD;
   padding: 0 15px;
   color: #666666;
 }
 
-.emotion-17 blockquote > :first-of-type {
+.emotion-16 blockquote > :first-child {
   margin-top: 0;
 }
 
-.emotion-17 blockquote > :last-child {
+.emotion-16 blockquote > :last-child {
   margin-bottom: 0;
 }
 
-.emotion-17 table {
+.emotion-16 table {
   padding: 0;
   border-collapse: collapse;
 }
 
-.emotion-17 table tr {
+.emotion-16 table tr {
   border-top: 1px solid rgba(0,0,0,.1);
   background-color: white;
   margin: 0;
   padding: 0;
 }
 
-.emotion-17 table tr:nth-of-type(2n) {
+.emotion-16 table tr:nth-child(2n) {
   background-color: #F8F8F8;
 }
 
-.emotion-17 table tr th {
+.emotion-16 table tr th {
   font-weight: bold;
   border: 1px solid rgba(0,0,0,.1);
   text-align: left;
@@ -1309,33 +1197,33 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   padding: 6px 13px;
 }
 
-.emotion-17 table tr td {
+.emotion-16 table tr td {
   border: 1px solid rgba(0,0,0,.1);
   text-align: left;
   margin: 0;
   padding: 6px 13px;
 }
 
-.emotion-17 table tr th :first-of-type,
-.emotion-17 table tr td :first-of-type {
+.emotion-16 table tr th :first-child,
+.emotion-16 table tr td :first-child {
   margin-top: 0;
 }
 
-.emotion-17 table tr th :last-child,
-.emotion-17 table tr td :last-child {
+.emotion-16 table tr th :last-child,
+.emotion-16 table tr td :last-child {
   margin-bottom: 0;
 }
 
-.emotion-17 img {
+.emotion-16 img {
   max-width: 100%;
 }
 
-.emotion-17 span.frame {
+.emotion-16 span.frame {
   display: block;
   overflow: hidden;
 }
 
-.emotion-17 span.frame > span {
+.emotion-16 span.frame > span {
   border: 1px solid #DDDDDD;
   display: block;
   float: left;
@@ -1345,81 +1233,81 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   width: auto;
 }
 
-.emotion-17 span.frame span img {
+.emotion-16 span.frame span img {
   display: block;
   float: left;
 }
 
-.emotion-17 span.frame span span {
+.emotion-16 span.frame span span {
   clear: both;
   color: #333333;
   display: block;
   padding: 5px 0 0;
 }
 
-.emotion-17 span.align-center {
+.emotion-16 span.align-center {
   display: block;
   overflow: hidden;
   clear: both;
 }
 
-.emotion-17 span.align-center > span {
+.emotion-16 span.align-center > span {
   display: block;
   overflow: hidden;
   margin: 13px auto 0;
   text-align: center;
 }
 
-.emotion-17 span.align-center span img {
+.emotion-16 span.align-center span img {
   margin: 0 auto;
   text-align: center;
 }
 
-.emotion-17 span.align-right {
+.emotion-16 span.align-right {
   display: block;
   overflow: hidden;
   clear: both;
 }
 
-.emotion-17 span.align-right > span {
+.emotion-16 span.align-right > span {
   display: block;
   overflow: hidden;
   margin: 13px 0 0;
   text-align: right;
 }
 
-.emotion-17 span.align-right span img {
+.emotion-16 span.align-right span img {
   margin: 0;
   text-align: right;
 }
 
-.emotion-17 span.float-left {
+.emotion-16 span.float-left {
   display: block;
   margin-right: 13px;
   overflow: hidden;
   float: left;
 }
 
-.emotion-17 span.float-left span {
+.emotion-16 span.float-left span {
   margin: 13px 0 0;
 }
 
-.emotion-17 span.float-right {
+.emotion-16 span.float-right {
   display: block;
   margin-left: 13px;
   overflow: hidden;
   float: right;
 }
 
-.emotion-17 span.float-right > span {
+.emotion-16 span.float-right > span {
   display: block;
   overflow: hidden;
   margin: 13px auto 0;
   text-align: right;
 }
 
-.emotion-17 code,
-.emotion-17 tt {
+.emotion-16 code,
+.emotion-16 tt {
   margin: 0 2px;
   padding: 0 5px;
   white-space: nowrap;
@@ -1428,7 +1316,7 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   border-radius: 3px;
 }
 
-.emotion-10 {
+.emotion-9 {
   background: #E1FFD4;
   color: #66BF3C;
   font-weight: 700;
@@ -1438,174 +1326,174 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   text-align: center;
 }
 
-.emotion-31 {
+.emotion-30 {
   margin-top: 20px;
   padding-bottom: 20px;
   border-top: 1px solid rgba(0,0,0,.1);
 }
 
-.emotion-23 {
+.emotion-22 {
   position: relative;
   overflow: hidden;
   border: 1px solid rgba(0,0,0,.1);
 }
 
-.emotion-20 {
+.emotion-19 {
   position: relative;
   overflow: auto;
 }
 
-.emotion-20 code {
+.emotion-19 code {
   padding-right: 10px;
 }
 
-.emotion-20 * .token {
+.emotion-19 * .token {
   font-family: "Operator Mono","Fira Code Retina","Fira Code","FiraCode-Retina","Andale Mono","Lucida Console",Consolas,Monaco,monospace;
   -webkit-font-smoothing: antialiased;
 }
 
-.emotion-20 * .token.comment {
+.emotion-19 * .token.comment {
   color: #008000;
   font-style: italic;
 }
 
-.emotion-20 * .token.prolog {
+.emotion-19 * .token.prolog {
   color: #008000;
   font-style: italic;
 }
 
-.emotion-20 * .token.doctype {
+.emotion-19 * .token.doctype {
   color: #008000;
   font-style: italic;
 }
 
-.emotion-20 * .token.cdata {
+.emotion-19 * .token.cdata {
   color: #008000;
   font-style: italic;
 }
 
-.emotion-20 * .token.string {
+.emotion-19 * .token.string {
   color: #A31515;
 }
 
-.emotion-20 * .token.punctuation {
+.emotion-19 * .token.punctuation {
   color: #393A34;
 }
 
-.emotion-20 * .token.operator {
+.emotion-19 * .token.operator {
   color: #393A34;
 }
 
-.emotion-20 * .token.url {
+.emotion-19 * .token.url {
   color: #36acaa;
 }
 
-.emotion-20 * .token.symbol {
+.emotion-19 * .token.symbol {
   color: #36acaa;
 }
 
-.emotion-20 * .token.number {
+.emotion-19 * .token.number {
   color: #36acaa;
 }
 
-.emotion-20 * .token.boolean {
+.emotion-19 * .token.boolean {
   color: #36acaa;
 }
 
-.emotion-20 * .token.variable {
+.emotion-19 * .token.variable {
   color: #36acaa;
 }
 
-.emotion-20 * .token.constant {
+.emotion-19 * .token.constant {
   color: #36acaa;
 }
 
-.emotion-20 * .token.inserted {
+.emotion-19 * .token.inserted {
   color: #36acaa;
 }
 
-.emotion-20 * .token.atrule {
+.emotion-19 * .token.atrule {
   color: #0000ff;
 }
 
-.emotion-20 * .token.keyword {
+.emotion-19 * .token.keyword {
   color: #0000ff;
 }
 
-.emotion-20 * .token.attr-value {
+.emotion-19 * .token.attr-value {
   color: #0000ff;
 }
 
-.emotion-20 * .token.function {
+.emotion-19 * .token.function {
   color: #393A34;
 }
 
-.emotion-20 * .token.deleted {
+.emotion-19 * .token.deleted {
   color: #9a050f;
 }
 
-.emotion-20 * .token.important {
+.emotion-19 * .token.important {
   font-weight: bold;
 }
 
-.emotion-20 * .token.bold {
+.emotion-19 * .token.bold {
   font-weight: bold;
 }
 
-.emotion-20 * .token.italic {
+.emotion-19 * .token.italic {
   font-style: italic;
 }
 
-.emotion-20 * .token.class-name {
+.emotion-19 * .token.class-name {
   color: #2B91AF;
 }
 
-.emotion-20 * .token.tag {
+.emotion-19 * .token.tag {
   color: #800000;
 }
 
-.emotion-20 * .token.selector {
+.emotion-19 * .token.selector {
   color: #800000;
 }
 
-.emotion-20 * .token.attr-name {
+.emotion-19 * .token.attr-name {
   color: #ff0000;
 }
 
-.emotion-20 * .token.property {
+.emotion-19 * .token.property {
   color: #ff0000;
 }
 
-.emotion-20 * .token.regex {
+.emotion-19 * .token.regex {
   color: #ff0000;
 }
 
-.emotion-20 * .token.entity {
+.emotion-19 * .token.entity {
   color: #ff0000;
 }
 
-.emotion-20 * .token.directive.tag .tag {
+.emotion-19 * .token.directive.tag .tag {
   background: #ffff00;
   color: #393A34;
 }
 
-.emotion-20 * .language-json .token.boolean {
+.emotion-19 * .language-json .token.boolean {
   color: #0000ff;
 }
 
-.emotion-20 * .language-json .token.number {
+.emotion-19 * .language-json .token.number {
   color: #0000ff;
 }
 
-.emotion-20 * .language-json .token.property {
+.emotion-19 * .language-json .token.property {
   color: #2B91AF;
 }
 
-.emotion-20 * .namespace {
+.emotion-19 * .namespace {
   opacity: 0.7;
 }
 
-.emotion-19 {
+.emotion-18 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -1618,7 +1506,7 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   padding: 10px;
 }
 
-.emotion-18 {
+.emotion-17 {
   -webkit-flex: 1;
   -ms-flex: 1;
   flex: 1;
@@ -1626,7 +1514,7 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   opacity: 1;
 }
 
-.emotion-22 {
+.emotion-21 {
   position: absolute;
   bottom: 0;
   right: 0;
@@ -1637,7 +1525,7 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   display: flex;
 }
 
-.emotion-21 {
+.emotion-20 {
   border: 0 none;
   padding: 4px 10px;
   cursor: pointer;
@@ -1659,80 +1547,72 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   border-radius: 4px 0 0 0;
 }
 
-.emotion-21:not(:last-child) {
+.emotion-20:not(:last-child) {
   border-right: 1px solid rgba(0,0,0,.1);
 }
 
-.emotion-21 + * {
+.emotion-20 + * {
   border-left: 1px solid rgba(0,0,0,.1);
   border-radius: 0;
 }
 
-.emotion-21:focus {
+.emotion-20:focus {
   box-shadow: #1EA7FD 0 -3px 0 0 inset;
   outline: 0 none;
 }
 
 <div
-  class="emotion-42"
-  title="wrapper"
+  class="emotion-41"
 >
   <div
-    class="emotion-8"
-    title="bar"
+    class="emotion-7"
   >
     <div
-      class="emotion-7"
+      class="emotion-2"
     >
       <div
-        class="emotion-2"
-        title="side left"
-      >
-        <div
-          class="emotion-1"
-          role="tablist"
-        >
-          <button
-            class="emotion-0"
-            role="tab"
-            type="button"
-          >
-            About
-          </button>
-        </div>
-      </div>
-      <div
-        class="emotion-6"
-        title="side right"
+        class="emotion-1"
+        role="tablist"
       >
         <button
-          class="emotion-5"
+          class="emotion-0"
+          role="tab"
+          type="button"
         >
-          <svg
-            class="emotion-4"
-            viewBox="0 0 1024 1024"
-          >
-            <path
-              class="emotion-3"
-              d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
-            />
-          </svg>
+          About
         </button>
       </div>
     </div>
+    <div
+      class="emotion-6"
+    >
+      <button
+        class="emotion-5"
+      >
+        <svg
+          class="emotion-4"
+          viewBox="0 0 1024 1024"
+        >
+          <path
+            class="emotion-3"
+            d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
+          />
+        </svg>
+      </button>
+    </div>
   </div>
   <div
-    class="emotion-41"
+    class="emotion-40"
   >
     <div
-      class="emotion-40"
+      class="emotion-39"
       role="tabpanel"
     >
       <div
-        class="emotion-39"
+        class="emotion-38"
       >
         <header
-          class="emotion-9"
+          class="emotion-8"
         >
           <svg
             title="Storybook icon"
@@ -1767,25 +1647,25 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
           Storybook 5.0.0
         </header>
         <div
-          class="emotion-10"
+          class="emotion-9"
         >
           Storybook 5.0.3 is available. Upgrade from 5.0.0 now.
         </div>
         <div
-          class="emotion-16"
+          class="emotion-15"
         >
           <span
-            class="emotion-11"
+            class="emotion-10"
           >
             5.0.3 Changelog
           </span>
           <a
-            class="emotion-15"
+            class="emotion-14"
             href="https://github.com/storybooks/storybook/blob/master/CHANGELOG.md"
             target="_blank"
           >
             <span
-              class="emotion-14"
+              class="emotion-13"
             >
               Read full changelog
               <svg
@@ -1801,7 +1681,7 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
           </a>
         </div>
         <div
-          class="emotion-17"
+          class="emotion-16"
         >
           <ul>
             <li>
@@ -1822,10 +1702,10 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
           </ul>
         </div>
         <div
-          class="emotion-31"
+          class="emotion-30"
         >
           <div
-            class="emotion-17"
+            class="emotion-16"
           >
             <p>
               <b>
@@ -1833,16 +1713,16 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
               </b>
             </p>
             <div
-              class="emotion-23"
+              class="emotion-22"
             >
               <div
-                class="emotion-20"
+                class="emotion-19"
               >
                 <pre
-                  class="hljs emotion-19"
+                  class="hljs emotion-18"
                 >
                   <code
-                    class="emotion-18"
+                    class="emotion-17"
                   >
                     npx npm-check-updates 
                     <span
@@ -1861,10 +1741,10 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
                 </pre>
               </div>
               <div
-                class="emotion-22"
+                class="emotion-21"
               >
                 <button
-                  class="emotion-21"
+                  class="emotion-20"
                 >
                   Copy
                 </button>
@@ -1874,26 +1754,26 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
               Alternatively, if you're using yarn run the following command, and check all Storybook related packages:
             </p>
             <div
-              class="emotion-23"
+              class="emotion-22"
             >
               <div
-                class="emotion-20"
+                class="emotion-19"
               >
                 <pre
-                  class="hljs emotion-19"
+                  class="hljs emotion-18"
                 >
                   <code
-                    class="emotion-18"
+                    class="emotion-17"
                   >
                     yarn upgrade-interactive --latest
                   </code>
                 </pre>
               </div>
               <div
-                class="emotion-22"
+                class="emotion-21"
               >
                 <button
-                  class="emotion-21"
+                  class="emotion-20"
                 >
                   Copy
                 </button>
@@ -1902,34 +1782,34 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
           </div>
         </div>
         <div
-          class="emotion-38"
+          class="emotion-37"
         >
           <a
-            class="emotion-33"
+            class="emotion-32"
             href="https://storybook.js.org"
           >
             <span
-              class="emotion-32"
+              class="emotion-31"
             >
               Docs
             </span>
           </a>
           <a
-            class="emotion-33"
+            class="emotion-32"
             href="https://github.com/storybooks/storybook"
           >
             <span
-              class="emotion-32"
+              class="emotion-31"
             >
               GitHub
             </span>
           </a>
           <a
-            class="emotion-33"
+            class="emotion-32"
             href="https://storybook.js.org/support"
           >
             <span
-              class="emotion-32"
+              class="emotion-31"
             >
               Support
             </span>
@@ -1942,7 +1822,7 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
 `;
 
 exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
-.emotion-28 {
+.emotion-27 {
   width: 100%;
   height: 100%;
   box-sizing: border-box;
@@ -1955,57 +1835,6 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   flex-direction: column;
 }
 
-.emotion-8 {
-  color: #999999;
-  height: 40px;
-  overflow: auto;
-  overflow-x: auto;
-  overflow-y: hidden;
-  -webkit-scrollbar-width: slim;
-  -moz-scrollbar-width: slim;
-  -ms-scrollbar-width: slim;
-  scrollbar-width: slim;
-  -webkit-scrollbar-width: 3px;
-  -moz-scrollbar-width: 3px;
-  -ms-scrollbar-width: 3px;
-  scrollbar-width: 3px;
-  -webkit-scrollbar-color: transparent transparent;
-  -moz-scrollbar-color: transparent transparent;
-  -ms-scrollbar-color: transparent transparent;
-  scrollbar-color: transparent transparent;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
-}
-
-.emotion-8::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  box-shadow: none;
-}
-
-.emotion-8::-webkit-scrollbar-track {
-  border-radius: 0;
-  background: transparent;
-  opacity: 0;
-  border: 0 none;
-  box-shadow: none;
-  height: 0;
-  width: 0;
-}
-
-.emotion-8::-webkit-scrollbar-thumb {
-  border-radius: 0;
-  background: rgba(0,0,0,.1);
-  box-shadow: none;
-}
-
-.emotion-8::-webkit-scrollbar-track-piece {
-  display: none;
-  border: 0 none;
-  opacity: 0;
-  visibility: hidden;
-}
-
 .emotion-7 {
   display: -webkit-box;
   display: -webkit-flex;
@@ -2015,9 +1844,14 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   -webkit-justify-content: space-between;
   -ms-flex-pack: justify;
   justify-content: space-between;
-  position: relative;
-  white-space: nowrap;
+  background: #FFFFFF;
+  color: #999999;
   height: 40px;
+  position: relative;
+  overflow: visible;
+  overflow-x: visible;
+  overflow-y: visible;
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
 }
 
 .emotion-2 {
@@ -2025,12 +1859,9 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  -webkit-flex-basis: auto;
-  -ms-flex-preferred-size: auto;
-  flex-basis: auto;
-  -webkit-flex-shrink: 0;
-  -ms-flex-negative: 0;
-  flex-shrink: 0;
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
 }
 
 .emotion-2 > * {
@@ -2038,10 +1869,14 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
 }
 
 .emotion-1 {
-  overflow: hidden;
+  white-space: nowrap;
+  height: 100%;
+  padding-bottom: 50px;
+  overflow-x: visisble;
+  overflow-y: visisble;
 }
 
-.emotion-1:first-of-type {
+.emotion-1:first-child {
   margin-left: 0;
 }
 
@@ -2095,13 +1930,6 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  -webkit-flex-basis: auto;
-  -ms-flex-preferred-size: auto;
-  flex-basis: auto;
-  -webkit-flex-shrink: 0;
-  -ms-flex-negative: 0;
-  flex-shrink: 0;
-  margin-left: 30px;
 }
 
 .emotion-6 > * {
@@ -2143,7 +1971,7 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   fill: currentColor;
 }
 
-.emotion-27 {
+.emotion-26 {
   display: block;
   position: relative;
   font-size: 13px;
@@ -2155,7 +1983,7 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   width: 100%;
 }
 
-.emotion-24 {
+.emotion-23 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -2166,11 +1994,11 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   font-weight: 700;
 }
 
-.emotion-24 > * + * {
+.emotion-23 > * + * {
   margin-left: 20px;
 }
 
-.emotion-19 {
+.emotion-18 {
   display: inline-block;
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
@@ -2180,12 +2008,12 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   color: #999999;
 }
 
-.emotion-19 svg path {
+.emotion-18 svg path {
   fill: #1EA7FD;
 }
 
-.emotion-19:hover,
-.emotion-19:focus {
+.emotion-18:hover,
+.emotion-18:focus {
   cursor: pointer;
   -webkit-transform: translate3d(0,-1px,0);
   -ms-transform: translate3d(0,-1px,0);
@@ -2193,23 +2021,23 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   color: #0297f5;
 }
 
-.emotion-19:hover svg path,
-.emotion-19:focus svg path {
+.emotion-18:hover svg path,
+.emotion-18:focus svg path {
   fill: #0297f5;
 }
 
-.emotion-19:active {
+.emotion-18:active {
   -webkit-transform: translate3d(0,0,0);
   -ms-transform: translate3d(0,0,0);
   transform: translate3d(0,0,0);
   color: #028ee6;
 }
 
-.emotion-19:active svg path {
+.emotion-18:active svg path {
   fill: #028ee6;
 }
 
-.emotion-19 svg {
+.emotion-18 svg {
   display: inline-block;
   height: 1em;
   width: 1em;
@@ -2219,37 +2047,37 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   margin-right: 0.4em;
 }
 
-.emotion-19 svg path {
+.emotion-18 svg path {
   fill: #999999;
 }
 
-.emotion-19:hover {
+.emotion-18:hover {
   color: #666666;
 }
 
-.emotion-19:hover svg path {
+.emotion-18:hover svg path {
   fill: #666666;
 }
 
-.emotion-19:active {
+.emotion-18:active {
   color: #444444;
 }
 
-.emotion-19:active svg path {
+.emotion-18:active svg path {
   fill: #444444;
 }
 
-.emotion-26 {
+.emotion-25 {
   display: block;
 }
 
-.emotion-25 {
+.emotion-24 {
   padding: 3rem 20px;
   max-width: 600px;
   margin: 0 auto;
 }
 
-.emotion-9 {
+.emotion-8 {
   margin-bottom: 20px;
   font-size: 28px;
   font-weight: 900;
@@ -2263,13 +2091,13 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   display: flex;
 }
 
-.emotion-9 > svg {
+.emotion-8 > svg {
   height: 32px;
   width: auto;
   margin-right: 8px;
 }
 
-.emotion-10 {
+.emotion-9 {
   background: #EAF3FC;
   color: #333333;
   font-weight: 700;
@@ -2279,7 +2107,7 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   text-align: center;
 }
 
-.emotion-16 {
+.emotion-15 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -2290,7 +2118,7 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   justify-content: space-between;
 }
 
-.emotion-11 {
+.emotion-10 {
   -webkit-letter-spacing: 0.35em;
   -moz-letter-spacing: 0.35em;
   -ms-letter-spacing: 0.35em;
@@ -2302,7 +2130,7 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   color: #999999;
 }
 
-.emotion-15 {
+.emotion-14 {
   display: inline-block;
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
@@ -2313,12 +2141,12 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   font-size: 12px;
 }
 
-.emotion-15 svg path {
+.emotion-14 svg path {
   fill: #1EA7FD;
 }
 
-.emotion-15:hover,
-.emotion-15:focus {
+.emotion-14:hover,
+.emotion-14:focus {
   cursor: pointer;
   -webkit-transform: translate3d(0,-1px,0);
   -ms-transform: translate3d(0,-1px,0);
@@ -2326,23 +2154,23 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   color: #0297f5;
 }
 
-.emotion-15:hover svg path,
-.emotion-15:focus svg path {
+.emotion-14:hover svg path,
+.emotion-14:focus svg path {
   fill: #0297f5;
 }
 
-.emotion-15:active {
+.emotion-14:active {
   -webkit-transform: translate3d(0,0,0);
   -ms-transform: translate3d(0,0,0);
   transform: translate3d(0,0,0);
   color: #028ee6;
 }
 
-.emotion-15:active svg path {
+.emotion-14:active svg path {
   fill: #028ee6;
 }
 
-.emotion-15 svg {
+.emotion-14 svg {
   display: inline-block;
   height: 1em;
   width: 1em;
@@ -2352,27 +2180,27 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   margin-right: 0.4em;
 }
 
-.emotion-15 svg path {
+.emotion-14 svg path {
   fill: #999999;
 }
 
-.emotion-15:hover {
+.emotion-14:hover {
   color: #666666;
 }
 
-.emotion-15:hover svg path {
+.emotion-14:hover svg path {
   fill: #666666;
 }
 
-.emotion-15:active {
+.emotion-14:active {
   color: #444444;
 }
 
-.emotion-15:active svg path {
+.emotion-14:active svg path {
   fill: #444444;
 }
 
-.emotion-14 > svg:last-of-type {
+.emotion-13 > svg:last-of-type {
   height: 0.7em;
   width: 0.7em;
   margin-right: 0;
@@ -2381,39 +2209,39 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   vertical-align: inherit;
 }
 
-.emotion-17 {
+.emotion-16 {
   font-size: 14px;
   line-height: 1.6;
 }
 
-.emotion-17 h1 {
+.emotion-16 h1 {
   font-size: 32px;
   font-weight: 900;
 }
 
-.emotion-17 h2 {
+.emotion-16 h2 {
   font-size: 24px;
   border-bottom: 1px solid rgba(0,0,0,.1);
 }
 
-.emotion-17 h3 {
+.emotion-16 h3 {
   font-size: 20px;
 }
 
-.emotion-17 h4 {
+.emotion-16 h4 {
   font-size: 16px;
 }
 
-.emotion-17 h5 {
+.emotion-16 h5 {
   font-size: 14px;
 }
 
-.emotion-17 h6 {
+.emotion-16 h6 {
   font-size: 14px;
   color: #666666;
 }
 
-.emotion-17 pre:not(.hljs) {
+.emotion-16 pre:not(.hljs) {
   background: transparent;
   border: none;
   border-radius: 0;
@@ -2421,8 +2249,8 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   margin: 0;
 }
 
-.emotion-17 pre pre,
-.emotion-17 pre.hljs {
+.emotion-16 pre pre,
+.emotion-16 pre.hljs {
   padding: 15px;
   margin: 0;
   overflow: auto;
@@ -2432,13 +2260,13 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   line-height: 19px;
 }
 
-.emotion-17 pre pre code,
-.emotion-17 pre.hljs code {
+.emotion-16 pre pre code,
+.emotion-16 pre.hljs code {
   color: inherit;
   font-size: inherit;
 }
 
-.emotion-17 pre code {
+.emotion-16 pre code {
   margin: 0;
   padding: 0;
   white-space: pre;
@@ -2446,31 +2274,31 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   background: transparent;
 }
 
-.emotion-17 pre code,
-.emotion-17 pre tt {
+.emotion-16 pre code,
+.emotion-16 pre tt {
   background-color: transparent;
   border: none;
 }
 
-.emotion-17 body > *:first-of-type {
+.emotion-16 body > *:first-child {
   margin-top: 0 !important;
 }
 
-.emotion-17 body > *:last-child {
+.emotion-16 body > *:last-child {
   margin-bottom: 0 !important;
 }
 
-.emotion-17 a {
+.emotion-16 a {
   color: #1EA7FD;
   -webkit-text-decoration: none;
   text-decoration: none;
 }
 
-.emotion-17 a.absent {
+.emotion-16 a.absent {
   color: #cc0000;
 }
 
-.emotion-17 a.anchor {
+.emotion-16 a.anchor {
   display: block;
   padding-left: 30px;
   margin-left: -30px;
@@ -2481,153 +2309,153 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   bottom: 0;
 }
 
-.emotion-17 h1,
-.emotion-17 h2,
-.emotion-17 h3,
-.emotion-17 h4,
-.emotion-17 h5,
-.emotion-17 h6 {
+.emotion-16 h1,
+.emotion-16 h2,
+.emotion-16 h3,
+.emotion-16 h4,
+.emotion-16 h5,
+.emotion-16 h6 {
   margin: 20px 0 10px;
   padding: 0;
   cursor: text;
   position: relative;
 }
 
-.emotion-17 h2:first-of-type,
-.emotion-17 h1:first-of-type,
-.emotion-17 h1:first-of-type + h2,
-.emotion-17 h3:first-of-type,
-.emotion-17 h4:first-of-type,
-.emotion-17 h5:first-of-type,
-.emotion-17 h6:first-of-type {
+.emotion-16 h2:first-child,
+.emotion-16 h1:first-child,
+.emotion-16 h1:first-child + h2,
+.emotion-16 h3:first-child,
+.emotion-16 h4:first-child,
+.emotion-16 h5:first-child,
+.emotion-16 h6:first-child {
   margin-top: 0;
   padding-top: 0;
 }
 
-.emotion-17 h1:hover a.anchor,
-.emotion-17 h2:hover a.anchor,
-.emotion-17 h3:hover a.anchor,
-.emotion-17 h4:hover a.anchor,
-.emotion-17 h5:hover a.anchor,
-.emotion-17 h6:hover a.anchor {
+.emotion-16 h1:hover a.anchor,
+.emotion-16 h2:hover a.anchor,
+.emotion-16 h3:hover a.anchor,
+.emotion-16 h4:hover a.anchor,
+.emotion-16 h5:hover a.anchor,
+.emotion-16 h6:hover a.anchor {
   -webkit-text-decoration: none;
   text-decoration: none;
 }
 
-.emotion-17 h1 tt,
-.emotion-17 h1 code {
+.emotion-16 h1 tt,
+.emotion-16 h1 code {
   font-size: inherit;
 }
 
-.emotion-17 h2 tt,
-.emotion-17 h2 code {
+.emotion-16 h2 tt,
+.emotion-16 h2 code {
   font-size: inherit;
 }
 
-.emotion-17 h3 tt,
-.emotion-17 h3 code {
+.emotion-16 h3 tt,
+.emotion-16 h3 code {
   font-size: inherit;
 }
 
-.emotion-17 h4 tt,
-.emotion-17 h4 code {
+.emotion-16 h4 tt,
+.emotion-16 h4 code {
   font-size: inherit;
 }
 
-.emotion-17 h5 tt,
-.emotion-17 h5 code {
+.emotion-16 h5 tt,
+.emotion-16 h5 code {
   font-size: inherit;
 }
 
-.emotion-17 h6 tt,
-.emotion-17 h6 code {
+.emotion-16 h6 tt,
+.emotion-16 h6 code {
   font-size: inherit;
 }
 
-.emotion-17 p,
-.emotion-17 blockquote,
-.emotion-17 ul,
-.emotion-17 ol,
-.emotion-17 dl,
-.emotion-17 li,
-.emotion-17 table,
-.emotion-17 pre {
+.emotion-16 p,
+.emotion-16 blockquote,
+.emotion-16 ul,
+.emotion-16 ol,
+.emotion-16 dl,
+.emotion-16 li,
+.emotion-16 table,
+.emotion-16 pre {
   margin: 15px 0;
 }
 
-.emotion-17 hr {
+.emotion-16 hr {
   border: 0 none;
   color: rgba(0,0,0,.1);
   height: 4px;
   padding: 0;
 }
 
-.emotion-17 body > h2:first-of-type {
+.emotion-16 body > h2:first-child {
   margin-top: 0;
   padding-top: 0;
 }
 
-.emotion-17 body > h1:first-of-type {
+.emotion-16 body > h1:first-child {
   margin-top: 0;
   padding-top: 0;
 }
 
-.emotion-17 body > h1:first-of-type + h2 {
+.emotion-16 body > h1:first-child + h2 {
   margin-top: 0;
   padding-top: 0;
 }
 
-.emotion-17 body > h3:first-of-type,
-.emotion-17 body > h4:first-of-type,
-.emotion-17 body > h5:first-of-type,
-.emotion-17 body > h6:first-of-type {
+.emotion-16 body > h3:first-child,
+.emotion-16 body > h4:first-child,
+.emotion-16 body > h5:first-child,
+.emotion-16 body > h6:first-child {
   margin-top: 0;
   padding-top: 0;
 }
 
-.emotion-17 a:first-of-type h1,
-.emotion-17 a:first-of-type h2,
-.emotion-17 a:first-of-type h3,
-.emotion-17 a:first-of-type h4,
-.emotion-17 a:first-of-type h5,
-.emotion-17 a:first-of-type h6 {
+.emotion-16 a:first-child h1,
+.emotion-16 a:first-child h2,
+.emotion-16 a:first-child h3,
+.emotion-16 a:first-child h4,
+.emotion-16 a:first-child h5,
+.emotion-16 a:first-child h6 {
   margin-top: 0;
   padding-top: 0;
 }
 
-.emotion-17 h1 p,
-.emotion-17 h2 p,
-.emotion-17 h3 p,
-.emotion-17 h4 p,
-.emotion-17 h5 p,
-.emotion-17 h6 p {
+.emotion-16 h1 p,
+.emotion-16 h2 p,
+.emotion-16 h3 p,
+.emotion-16 h4 p,
+.emotion-16 h5 p,
+.emotion-16 h6 p {
   margin-top: 0;
 }
 
-.emotion-17 li p.first {
+.emotion-16 li p.first {
   display: inline-block;
 }
 
-.emotion-17 ul,
-.emotion-17 ol {
+.emotion-16 ul,
+.emotion-16 ol {
   padding-left: 30px;
 }
 
-.emotion-17 ul :first-of-type,
-.emotion-17 ol :first-of-type {
+.emotion-16 ul :first-child,
+.emotion-16 ol :first-child {
   margin-top: 0;
 }
 
-.emotion-17 ul :last-child,
-.emotion-17 ol :last-child {
+.emotion-16 ul :last-child,
+.emotion-16 ol :last-child {
   margin-bottom: 0;
 }
 
-.emotion-17 dl {
+.emotion-16 dl {
   padding: 0;
 }
 
-.emotion-17 dl dt {
+.emotion-16 dl dt {
   font-size: 14px;
   font-weight: bold;
   font-style: italic;
@@ -2635,62 +2463,62 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   margin: 15px 0 5px;
 }
 
-.emotion-17 dl dt:first-of-type {
+.emotion-16 dl dt:first-child {
   padding: 0;
 }
 
-.emotion-17 dl dt > :first-of-type {
+.emotion-16 dl dt > :first-child {
   margin-top: 0;
 }
 
-.emotion-17 dl dt > :last-child {
+.emotion-16 dl dt > :last-child {
   margin-bottom: 0;
 }
 
-.emotion-17 dl dd {
+.emotion-16 dl dd {
   margin: 0 0 15px;
   padding: 0 15px;
 }
 
-.emotion-17 dl dd > :first-of-type {
+.emotion-16 dl dd > :first-child {
   margin-top: 0;
 }
 
-.emotion-17 dl dd > :last-child {
+.emotion-16 dl dd > :last-child {
   margin-bottom: 0;
 }
 
-.emotion-17 blockquote {
+.emotion-16 blockquote {
   border-left: 4px solid #DDDDDD;
   padding: 0 15px;
   color: #666666;
 }
 
-.emotion-17 blockquote > :first-of-type {
+.emotion-16 blockquote > :first-child {
   margin-top: 0;
 }
 
-.emotion-17 blockquote > :last-child {
+.emotion-16 blockquote > :last-child {
   margin-bottom: 0;
 }
 
-.emotion-17 table {
+.emotion-16 table {
   padding: 0;
   border-collapse: collapse;
 }
 
-.emotion-17 table tr {
+.emotion-16 table tr {
   border-top: 1px solid rgba(0,0,0,.1);
   background-color: white;
   margin: 0;
   padding: 0;
 }
 
-.emotion-17 table tr:nth-of-type(2n) {
+.emotion-16 table tr:nth-child(2n) {
   background-color: #F8F8F8;
 }
 
-.emotion-17 table tr th {
+.emotion-16 table tr th {
   font-weight: bold;
   border: 1px solid rgba(0,0,0,.1);
   text-align: left;
@@ -2698,33 +2526,33 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   padding: 6px 13px;
 }
 
-.emotion-17 table tr td {
+.emotion-16 table tr td {
   border: 1px solid rgba(0,0,0,.1);
   text-align: left;
   margin: 0;
   padding: 6px 13px;
 }
 
-.emotion-17 table tr th :first-of-type,
-.emotion-17 table tr td :first-of-type {
+.emotion-16 table tr th :first-child,
+.emotion-16 table tr td :first-child {
   margin-top: 0;
 }
 
-.emotion-17 table tr th :last-child,
-.emotion-17 table tr td :last-child {
+.emotion-16 table tr th :last-child,
+.emotion-16 table tr td :last-child {
   margin-bottom: 0;
 }
 
-.emotion-17 img {
+.emotion-16 img {
   max-width: 100%;
 }
 
-.emotion-17 span.frame {
+.emotion-16 span.frame {
   display: block;
   overflow: hidden;
 }
 
-.emotion-17 span.frame > span {
+.emotion-16 span.frame > span {
   border: 1px solid #DDDDDD;
   display: block;
   float: left;
@@ -2734,81 +2562,81 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   width: auto;
 }
 
-.emotion-17 span.frame span img {
+.emotion-16 span.frame span img {
   display: block;
   float: left;
 }
 
-.emotion-17 span.frame span span {
+.emotion-16 span.frame span span {
   clear: both;
   color: #333333;
   display: block;
   padding: 5px 0 0;
 }
 
-.emotion-17 span.align-center {
+.emotion-16 span.align-center {
   display: block;
   overflow: hidden;
   clear: both;
 }
 
-.emotion-17 span.align-center > span {
+.emotion-16 span.align-center > span {
   display: block;
   overflow: hidden;
   margin: 13px auto 0;
   text-align: center;
 }
 
-.emotion-17 span.align-center span img {
+.emotion-16 span.align-center span img {
   margin: 0 auto;
   text-align: center;
 }
 
-.emotion-17 span.align-right {
+.emotion-16 span.align-right {
   display: block;
   overflow: hidden;
   clear: both;
 }
 
-.emotion-17 span.align-right > span {
+.emotion-16 span.align-right > span {
   display: block;
   overflow: hidden;
   margin: 13px 0 0;
   text-align: right;
 }
 
-.emotion-17 span.align-right span img {
+.emotion-16 span.align-right span img {
   margin: 0;
   text-align: right;
 }
 
-.emotion-17 span.float-left {
+.emotion-16 span.float-left {
   display: block;
   margin-right: 13px;
   overflow: hidden;
   float: left;
 }
 
-.emotion-17 span.float-left span {
+.emotion-16 span.float-left span {
   margin: 13px 0 0;
 }
 
-.emotion-17 span.float-right {
+.emotion-16 span.float-right {
   display: block;
   margin-left: 13px;
   overflow: hidden;
   float: right;
 }
 
-.emotion-17 span.float-right > span {
+.emotion-16 span.float-right > span {
   display: block;
   overflow: hidden;
   margin: 13px auto 0;
   text-align: right;
 }
 
-.emotion-17 code,
-.emotion-17 tt {
+.emotion-16 code,
+.emotion-16 tt {
   margin: 0 2px;
   padding: 0 5px;
   white-space: nowrap;
@@ -2818,65 +2646,57 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
 }
 
 <div
-  class="emotion-28"
-  title="wrapper"
+  class="emotion-27"
 >
   <div
-    class="emotion-8"
-    title="bar"
+    class="emotion-7"
   >
     <div
-      class="emotion-7"
+      class="emotion-2"
     >
       <div
-        class="emotion-2"
-        title="side left"
-      >
-        <div
-          class="emotion-1"
-          role="tablist"
-        >
-          <button
-            class="emotion-0"
-            role="tab"
-            type="button"
-          >
-            About
-          </button>
-        </div>
-      </div>
-      <div
-        class="emotion-6"
-        title="side right"
+        class="emotion-1"
+        role="tablist"
       >
         <button
-          class="emotion-5"
+          class="emotion-0"
+          role="tab"
+          type="button"
         >
-          <svg
-            class="emotion-4"
-            viewBox="0 0 1024 1024"
-          >
-            <path
-              class="emotion-3"
-              d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
-            />
-          </svg>
+          About
         </button>
       </div>
     </div>
+    <div
+      class="emotion-6"
+    >
+      <button
+        class="emotion-5"
+      >
+        <svg
+          class="emotion-4"
+          viewBox="0 0 1024 1024"
+        >
+          <path
+            class="emotion-3"
+            d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
+          />
+        </svg>
+      </button>
+    </div>
   </div>
   <div
-    class="emotion-27"
+    class="emotion-26"
   >
     <div
-      class="emotion-26"
+      class="emotion-25"
       role="tabpanel"
     >
       <div
-        class="emotion-25"
+        class="emotion-24"
       >
         <header
-          class="emotion-9"
+          class="emotion-8"
         >
           <svg
             title="Storybook icon"
@@ -2911,25 +2731,25 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
           Storybook 5.0.0
         </header>
         <div
-          class="emotion-10"
+          class="emotion-9"
         >
           Looking good! You're up to date.
         </div>
         <div
-          class="emotion-16"
+          class="emotion-15"
         >
           <span
-            class="emotion-11"
+            class="emotion-10"
           >
             5.0.0 Changelog
           </span>
           <a
-            class="emotion-15"
+            class="emotion-14"
             href="https://github.com/storybooks/storybook/blob/master/CHANGELOG.md"
             target="_blank"
           >
             <span
-              class="emotion-14"
+              class="emotion-13"
             >
               Read full changelog
               <svg
@@ -2945,7 +2765,7 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
           </a>
         </div>
         <div
-          class="emotion-17"
+          class="emotion-16"
         >
           <ul>
             <li>
@@ -2966,34 +2786,34 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
           </ul>
         </div>
         <div
-          class="emotion-24"
+          class="emotion-23"
         >
           <a
-            class="emotion-19"
+            class="emotion-18"
             href="https://storybook.js.org"
           >
             <span
-              class="emotion-18"
+              class="emotion-17"
             >
               Docs
             </span>
           </a>
           <a
-            class="emotion-19"
+            class="emotion-18"
             href="https://github.com/storybooks/storybook"
           >
             <span
-              class="emotion-18"
+              class="emotion-17"
             >
               GitHub
             </span>
           </a>
           <a
-            class="emotion-19"
+            class="emotion-18"
             href="https://storybook.js.org/support"
           >
             <span
-              class="emotion-18"
+              class="emotion-17"
             >
               Support
             </span>

From b3d169eec20b61a6f3df0467a32b3f99a4417046 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Tue, 19 Feb 2019 19:13:52 +0800
Subject: [PATCH 040/249] 5.0.0-rc.3 changelog

---
 CHANGELOG.md | 7 +++++++
 1 file changed, 7 insertions(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 345c193176d..a8db7ba4896 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,10 @@
+## 5.0.0-rc.3 (February 19, 2019)
+
+### Bug Fixes
+
+* UI: Styling bug fixes, story updates, and more QA ([#5650](https://github.com/storybooks/storybook/pull/5650))
+* UI: V5 style refinements ([#5562](https://github.com/storybooks/storybook/pull/5562))
+
 ## 5.0.0-rc.2 (February 19, 2019)
 
 ### Features

From c9b173940643d00afd155bbdecc166751d4805a1 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Tue, 19 Feb 2019 19:20:14 +0800
Subject: [PATCH 041/249] Update yarn.lock

---
 yarn.lock | 38 +++++++++++++++++---------------------
 1 file changed, 17 insertions(+), 21 deletions(-)

diff --git a/yarn.lock b/yarn.lock
index 85e93abf679..ad98b5c9cd5 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -8638,9 +8638,10 @@ expect@^23.6.0:
     jest-message-util "^23.4.0"
     jest-regex-util "^23.3.0"
 
-expect@^24.0.0:
-  version "24.0.0"
-  resolved "https://registry.yarnpkg.com/expect/-/expect-24.0.0.tgz#71f71d88a4202746fc79849bb4c6498008b5ef03"
+expect@^24.1.0:
+  version "24.1.0"
+  resolved "https://registry.yarnpkg.com/expect/-/expect-24.1.0.tgz#88e73301c4c785cde5f16da130ab407bdaf8c0f2"
+  integrity sha512-lVcAPhaYkQcIyMS+F8RVwzbm1jro20IG8OkvxQ6f1JfqhVZyyudCwYogQ7wnktlf14iF3ii7ArIUO/mqvrW9Gw==
   dependencies:
     ansi-styles "^3.2.0"
     jest-get-type "^24.0.0"
@@ -11675,6 +11676,15 @@ jest-resolve@^24.0.0:
     chalk "^2.0.1"
     realpath-native "^1.0.0"
 
+jest-resolve@^24.1.0:
+  version "24.1.0"
+  resolved "https://registry.yarnpkg.com/jest-resolve/-/jest-resolve-24.1.0.tgz#42ff0169b0ea47bfdbd0c52a0067ca7d022c7688"
+  integrity sha512-TPiAIVp3TG6zAxH28u/6eogbwrvZjBMWroSLBDkwkHKrqxB/RIdwkWDye4uqPlZIXWIaHtifY3L0/eO5Z0f2wg==
+  dependencies:
+    browser-resolve "^1.11.3"
+    chalk "^2.0.1"
+    realpath-native "^1.0.0"
+
 jest-runner@^23.6.0:
   version "23.6.0"
   resolved "https://registry.yarnpkg.com/jest-runner/-/jest-runner-23.6.0.tgz#3894bd219ffc3f3cb94dc48a4170a2e6f23a5a38"
@@ -11723,9 +11733,10 @@ jest-serializer@^23.0.1:
   version "23.0.1"
   resolved "https://registry.yarnpkg.com/jest-serializer/-/jest-serializer-23.0.1.tgz#a3776aeb311e90fe83fab9e533e85102bd164165"
 
-jest-snapshot@>=20.0.3:
+jest-snapshot@>=20.0.3, jest-snapshot@^24.1.0:
   version "24.1.0"
   resolved "https://registry.yarnpkg.com/jest-snapshot/-/jest-snapshot-24.1.0.tgz#85e22f810357aa5994ab61f236617dc2205f2f5b"
+  integrity sha512-th6TDfFqEmXvuViacU1ikD7xFb7lQsPn2rJl7OEmnfIVpnrx3QNY2t3PE88meeg0u/mQ0nkyvmC05PBqO4USFA==
   dependencies:
     "@babel/types" "^7.0.0"
     chalk "^2.0.1"
@@ -11753,21 +11764,6 @@ jest-snapshot@^23.6.0:
     pretty-format "^23.6.0"
     semver "^5.5.0"
 
-jest-snapshot@^24.0.0:
-  version "24.0.0"
-  resolved "https://registry.yarnpkg.com/jest-snapshot/-/jest-snapshot-24.0.0.tgz#fb447a753a3271660b3d89d068698014eb14c414"
-  dependencies:
-    "@babel/types" "^7.0.0"
-    chalk "^2.0.1"
-    jest-diff "^24.0.0"
-    jest-matcher-utils "^24.0.0"
-    jest-message-util "^24.0.0"
-    jest-resolve "^24.0.0"
-    mkdirp "^0.5.1"
-    natural-compare "^1.4.0"
-    pretty-format "^24.0.0"
-    semver "^5.5.0"
-
 jest-specific-snapshot@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/jest-specific-snapshot/-/jest-specific-snapshot-1.0.0.tgz#157c79e2534a6fea820fd475f5d17740c8f90833"
@@ -18321,7 +18317,7 @@ source-map-support@^0.4.15, source-map-support@~0.4.0:
   dependencies:
     source-map "^0.5.6"
 
-source-map-support@^0.5.5, source-map-support@^0.5.6, source-map-support@^0.5.9, source-map-support@~0.5.6:
+source-map-support@^0.5.5, source-map-support@^0.5.6, source-map-support@^0.5.9, source-map-support@~0.5.9:
   version "0.5.10"
   resolved "https://registry.yarnpkg.com/source-map-support/-/source-map-support-0.5.10.tgz#2214080bc9d51832511ee2bab96e3c2f9353120c"
   dependencies:
@@ -19157,7 +19153,7 @@ terser-webpack-plugin@^1.2.1:
     webpack-sources "^1.1.0"
     worker-farm "^1.5.2"
 
-terser@^3.7.5, terser@^3.8.1:
+terser@^3.16.1, terser@^3.7.5, terser@^3.8.1:
   version "3.16.1"
   resolved "https://registry.yarnpkg.com/terser/-/terser-3.16.1.tgz#5b0dd4fa1ffd0b0b43c2493b2c364fd179160493"
   dependencies:

From 698f32e49855a5b4643436b693706865329a5b7e Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Tue, 19 Feb 2019 19:21:00 +0800
Subject: [PATCH 042/249] v5.0.0-rc.3

---
 addons/a11y/package.json                      | 12 ++---
 addons/actions/package.json                   | 10 ++--
 addons/backgrounds/package.json               | 12 ++---
 addons/centered/package.json                  |  2 +-
 addons/cssresources/package.json              | 10 ++--
 addons/events/package.json                    |  8 +--
 addons/google-analytics/package.json          |  6 +--
 addons/graphql/package.json                   |  2 +-
 addons/info/package.json                      | 10 ++--
 addons/jest/package.json                      | 10 ++--
 addons/knobs/package.json                     | 10 ++--
 addons/links/package.json                     |  6 +--
 addons/notes/package.json                     | 12 ++---
 addons/options/package.json                   |  4 +-
 .../storyshots/storyshots-core/package.json   |  4 +-
 .../storyshots-puppeteer/package.json         |  6 +--
 addons/storysource/package.json               |  8 +--
 addons/viewport/package.json                  | 12 ++---
 app/angular/package.json                      |  6 +--
 app/ember/package.json                        |  4 +-
 app/html/package.json                         |  4 +-
 app/marko/package.json                        |  4 +-
 app/mithril/package.json                      |  4 +-
 app/polymer/package.json                      |  4 +-
 app/preact/package.json                       |  4 +-
 app/react/package.json                        |  8 +--
 app/riot/package.json                         |  4 +-
 app/svelte/package.json                       |  4 +-
 app/vue/package.json                          |  4 +-
 examples/angular-cli/package.json             | 26 +++++-----
 examples/cra-kitchen-sink/package.json        | 32 ++++++------
 examples/cra-ts-kitchen-sink/package.json     | 12 ++---
 examples/ember-cli/package.json               | 26 +++++-----
 examples/html-kitchen-sink/package.json       | 36 ++++++-------
 examples/marko-cli/package.json               | 14 ++---
 examples/mithril-kitchen-sink/package.json    | 26 +++++-----
 examples/official-storybook/package.json      | 48 ++++++++---------
 examples/polymer-cli/package.json             | 20 +++----
 examples/preact-kitchen-sink/package.json     | 26 +++++-----
 examples/riot-kitchen-sink/package.json       | 26 +++++-----
 examples/svelte-kitchen-sink/package.json     | 26 +++++-----
 examples/vue-kitchen-sink/package.json        | 26 +++++-----
 lerna.json                                    |  2 +-
 lib/addons/package.json                       |  6 +--
 lib/channel-postmessage/package.json          |  4 +-
 lib/channel-websocket/package.json            |  4 +-
 lib/channels/package.json                     |  2 +-
 lib/cli/package.json                          | 52 +++++++++----------
 lib/client-api/package.json                   |  8 +--
 lib/client-logger/package.json                |  2 +-
 lib/codemod/package.json                      |  2 +-
 lib/components/package.json                   | 12 ++---
 lib/core-events/package.json                  |  2 +-
 lib/core/package.json                         | 18 +++----
 lib/node-logger/package.json                  |  2 +-
 lib/router/package.json                       |  4 +-
 lib/theming/package.json                      |  2 +-
 lib/ui/package.json                           | 14 ++---
 58 files changed, 337 insertions(+), 337 deletions(-)

diff --git a/addons/a11y/package.json b/addons/a11y/package.json
index 670559c0a37..14c9f2b727d 100644
--- a/addons/a11y/package.json
+++ b/addons/a11y/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-a11y",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "description": "a11y addon for storybook",
   "keywords": [
     "a11y",
@@ -25,11 +25,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.2",
-    "@storybook/client-logger": "5.0.0-rc.2",
-    "@storybook/components": "5.0.0-rc.2",
-    "@storybook/core-events": "5.0.0-rc.2",
-    "@storybook/theming": "5.0.0-rc.2",
+    "@storybook/addons": "5.0.0-rc.3",
+    "@storybook/client-logger": "5.0.0-rc.3",
+    "@storybook/components": "5.0.0-rc.3",
+    "@storybook/core-events": "5.0.0-rc.3",
+    "@storybook/theming": "5.0.0-rc.3",
     "axe-core": "^3.1.2",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
diff --git a/addons/actions/package.json b/addons/actions/package.json
index 1355071a786..3cdfebc1cd8 100644
--- a/addons/actions/package.json
+++ b/addons/actions/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-actions",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "description": "Action Logger addon for storybook",
   "keywords": [
     "storybook"
@@ -20,10 +20,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.2",
-    "@storybook/components": "5.0.0-rc.2",
-    "@storybook/core-events": "5.0.0-rc.2",
-    "@storybook/theming": "5.0.0-rc.2",
+    "@storybook/addons": "5.0.0-rc.3",
+    "@storybook/components": "5.0.0-rc.3",
+    "@storybook/core-events": "5.0.0-rc.3",
+    "@storybook/theming": "5.0.0-rc.3",
     "core-js": "^2.6.2",
     "fast-deep-equal": "^2.0.1",
     "global": "^4.3.2",
diff --git a/addons/backgrounds/package.json b/addons/backgrounds/package.json
index dc5ea46cf2c..6bee8331897 100644
--- a/addons/backgrounds/package.json
+++ b/addons/backgrounds/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-backgrounds",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "description": "A storybook addon to show different backgrounds for your preview",
   "keywords": [
     "addon",
@@ -24,11 +24,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.2",
-    "@storybook/client-logger": "5.0.0-rc.2",
-    "@storybook/components": "5.0.0-rc.2",
-    "@storybook/core-events": "5.0.0-rc.2",
-    "@storybook/theming": "5.0.0-rc.2",
+    "@storybook/addons": "5.0.0-rc.3",
+    "@storybook/client-logger": "5.0.0-rc.3",
+    "@storybook/components": "5.0.0-rc.3",
+    "@storybook/core-events": "5.0.0-rc.3",
+    "@storybook/theming": "5.0.0-rc.3",
     "core-js": "^2.6.2",
     "eventemitter3": "^3.1.0",
     "global": "^4.3.2",
diff --git a/addons/centered/package.json b/addons/centered/package.json
index 63a03f12cd6..4def2b53dbd 100644
--- a/addons/centered/package.json
+++ b/addons/centered/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-centered",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "description": "Storybook decorator to center components",
   "keywords": [
     "addon",
diff --git a/addons/cssresources/package.json b/addons/cssresources/package.json
index bfd211d2b9f..d24d336f087 100644
--- a/addons/cssresources/package.json
+++ b/addons/cssresources/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-cssresources",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "description": "A storybook addon to switch between css resources at runtime for your story",
   "keywords": [
     "addon",
@@ -25,10 +25,10 @@
   },
   "dependencies": {
     "@emotion/styled": "10.0.6",
-    "@storybook/addons": "5.0.0-rc.2",
-    "@storybook/channels": "5.0.0-rc.2",
-    "@storybook/components": "5.0.0-rc.2",
-    "@storybook/core-events": "5.0.0-rc.2",
+    "@storybook/addons": "5.0.0-rc.3",
+    "@storybook/channels": "5.0.0-rc.3",
+    "@storybook/components": "5.0.0-rc.3",
+    "@storybook/core-events": "5.0.0-rc.3",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "prop-types": "^15.6.2",
diff --git a/addons/events/package.json b/addons/events/package.json
index 61919a9b239..bdacbf26391 100644
--- a/addons/events/package.json
+++ b/addons/events/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-events",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "description": "Add events to your Storybook stories.",
   "keywords": [
     "addon",
@@ -23,9 +23,9 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.2",
-    "@storybook/core-events": "5.0.0-rc.2",
-    "@storybook/theming": "5.0.0-rc.2",
+    "@storybook/addons": "5.0.0-rc.3",
+    "@storybook/core-events": "5.0.0-rc.3",
+    "@storybook/theming": "5.0.0-rc.3",
     "core-js": "^2.6.2",
     "format-json": "^1.0.3",
     "prop-types": "^15.6.2",
diff --git a/addons/google-analytics/package.json b/addons/google-analytics/package.json
index 14a0d9ebafe..f1774d0e256 100644
--- a/addons/google-analytics/package.json
+++ b/addons/google-analytics/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-google-analytics",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "description": "Storybook addon for google analytics",
   "keywords": [
     "addon",
@@ -19,8 +19,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.2",
-    "@storybook/core-events": "5.0.0-rc.2",
+    "@storybook/addons": "5.0.0-rc.3",
+    "@storybook/core-events": "5.0.0-rc.3",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "react-ga": "^2.5.3"
diff --git a/addons/graphql/package.json b/addons/graphql/package.json
index 649244f2485..daefb5087eb 100644
--- a/addons/graphql/package.json
+++ b/addons/graphql/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-graphql",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "description": "Storybook addon to display the GraphiQL IDE",
   "keywords": [
     "addon",
diff --git a/addons/info/package.json b/addons/info/package.json
index e80e33a730e..19890a8ba6b 100644
--- a/addons/info/package.json
+++ b/addons/info/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-info",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "description": "A Storybook addon to show additional information for your stories.",
   "keywords": [
     "addon",
@@ -21,10 +21,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.2",
-    "@storybook/client-logger": "5.0.0-rc.2",
-    "@storybook/components": "5.0.0-rc.2",
-    "@storybook/theming": "5.0.0-rc.2",
+    "@storybook/addons": "5.0.0-rc.3",
+    "@storybook/client-logger": "5.0.0-rc.3",
+    "@storybook/components": "5.0.0-rc.3",
+    "@storybook/theming": "5.0.0-rc.3",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "marksy": "^6.1.0",
diff --git a/addons/jest/package.json b/addons/jest/package.json
index 6300c5b61ea..7afceb0f2d4 100644
--- a/addons/jest/package.json
+++ b/addons/jest/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-jest",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "description": "React storybook addon that show component jest report",
   "keywords": [
     "addon",
@@ -27,10 +27,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.2",
-    "@storybook/components": "5.0.0-rc.2",
-    "@storybook/core-events": "5.0.0-rc.2",
-    "@storybook/theming": "5.0.0-rc.2",
+    "@storybook/addons": "5.0.0-rc.3",
+    "@storybook/components": "5.0.0-rc.3",
+    "@storybook/core-events": "5.0.0-rc.3",
+    "@storybook/theming": "5.0.0-rc.3",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "prop-types": "^15.6.2",
diff --git a/addons/knobs/package.json b/addons/knobs/package.json
index 2a414ec4514..1bc9e688704 100644
--- a/addons/knobs/package.json
+++ b/addons/knobs/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-knobs",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "description": "Storybook Addon Prop Editor Component",
   "keywords": [
     "addon",
@@ -21,10 +21,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.2",
-    "@storybook/components": "5.0.0-rc.2",
-    "@storybook/core-events": "5.0.0-rc.2",
-    "@storybook/theming": "5.0.0-rc.2",
+    "@storybook/addons": "5.0.0-rc.3",
+    "@storybook/components": "5.0.0-rc.3",
+    "@storybook/core-events": "5.0.0-rc.3",
+    "@storybook/theming": "5.0.0-rc.3",
     "copy-to-clipboard": "^3.0.8",
     "core-js": "^2.6.2",
     "escape-html": "^1.0.3",
diff --git a/addons/links/package.json b/addons/links/package.json
index 7e3a530f31f..5e71719764e 100644
--- a/addons/links/package.json
+++ b/addons/links/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-links",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "description": "Story Links addon for storybook",
   "keywords": [
     "addon",
@@ -21,8 +21,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.2",
-    "@storybook/core-events": "5.0.0-rc.2",
+    "@storybook/addons": "5.0.0-rc.3",
+    "@storybook/core-events": "5.0.0-rc.3",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/addons/notes/package.json b/addons/notes/package.json
index daed6ee2baa..d88d52de0dc 100644
--- a/addons/notes/package.json
+++ b/addons/notes/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-notes",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "description": "Write notes for your Storybook stories.",
   "keywords": [
     "addon",
@@ -22,11 +22,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.2",
-    "@storybook/client-logger": "5.0.0-rc.2",
-    "@storybook/components": "5.0.0-rc.2",
-    "@storybook/core-events": "5.0.0-rc.2",
-    "@storybook/theming": "5.0.0-rc.2",
+    "@storybook/addons": "5.0.0-rc.3",
+    "@storybook/client-logger": "5.0.0-rc.3",
+    "@storybook/components": "5.0.0-rc.3",
+    "@storybook/core-events": "5.0.0-rc.3",
+    "@storybook/theming": "5.0.0-rc.3",
     "markdown-to-jsx": "^6.9.1",
     "prop-types": "^15.6.2",
     "util-deprecate": "^1.0.2"
diff --git a/addons/options/package.json b/addons/options/package.json
index 0e60fd96a05..3b0d90df3d1 100644
--- a/addons/options/package.json
+++ b/addons/options/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-options",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "description": "Options addon for storybook",
   "keywords": [
     "addon",
@@ -20,7 +20,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.2",
+    "@storybook/addons": "5.0.0-rc.3",
     "core-js": "^2.6.2",
     "util-deprecate": "^1.0.2"
   },
diff --git a/addons/storyshots/storyshots-core/package.json b/addons/storyshots/storyshots-core/package.json
index cdceb395cc3..e652515e9ff 100644
--- a/addons/storyshots/storyshots-core/package.json
+++ b/addons/storyshots/storyshots-core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storyshots",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "description": "StoryShots is a Jest Snapshot Testing Addon for Storybook.",
   "keywords": [
     "addon",
@@ -24,7 +24,7 @@
     "storybook": "start-storybook -p 6006"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.2",
+    "@storybook/addons": "5.0.0-rc.3",
     "core-js": "^2.6.2",
     "glob": "^7.1.3",
     "global": "^4.3.2",
diff --git a/addons/storyshots/storyshots-puppeteer/package.json b/addons/storyshots/storyshots-puppeteer/package.json
index bd751182d7c..bd61c3dbe73 100644
--- a/addons/storyshots/storyshots-puppeteer/package.json
+++ b/addons/storyshots/storyshots-puppeteer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storyshots-puppeteer",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "description": "Image snappshots addition to StoryShots base on puppeteer",
   "keywords": [
     "addon",
@@ -21,8 +21,8 @@
     "prepare": "node ../../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.2",
-    "@storybook/node-logger": "5.0.0-rc.2",
+    "@storybook/core": "5.0.0-rc.3",
+    "@storybook/node-logger": "5.0.0-rc.3",
     "core-js": "^2.6.2",
     "jest-image-snapshot": "^2.6.0",
     "puppeteer": "^1.12.0",
diff --git a/addons/storysource/package.json b/addons/storysource/package.json
index 786e3ee2660..81902504d64 100644
--- a/addons/storysource/package.json
+++ b/addons/storysource/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storysource",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "description": "Stories addon for storybook",
   "keywords": [
     "addon",
@@ -21,9 +21,9 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.2",
-    "@storybook/components": "5.0.0-rc.2",
-    "@storybook/theming": "5.0.0-rc.2",
+    "@storybook/addons": "5.0.0-rc.3",
+    "@storybook/components": "5.0.0-rc.3",
+    "@storybook/theming": "5.0.0-rc.3",
     "core-js": "^2.6.2",
     "estraverse": "^4.2.0",
     "loader-utils": "^1.2.1",
diff --git a/addons/viewport/package.json b/addons/viewport/package.json
index 3c3329d2510..45bf2244c6c 100644
--- a/addons/viewport/package.json
+++ b/addons/viewport/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-viewport",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "description": "Storybook addon to change the viewport size to mobile",
   "keywords": [
     "addon",
@@ -20,11 +20,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.2",
-    "@storybook/client-logger": "5.0.0-rc.2",
-    "@storybook/components": "5.0.0-rc.2",
-    "@storybook/core-events": "5.0.0-rc.2",
-    "@storybook/theming": "5.0.0-rc.2",
+    "@storybook/addons": "5.0.0-rc.3",
+    "@storybook/client-logger": "5.0.0-rc.3",
+    "@storybook/components": "5.0.0-rc.3",
+    "@storybook/core-events": "5.0.0-rc.3",
+    "@storybook/theming": "5.0.0-rc.3",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
diff --git a/app/angular/package.json b/app/angular/package.json
index cb98e933bc1..068a52d191f 100644
--- a/app/angular/package.json
+++ b/app/angular/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/angular",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "description": "Storybook for Angular: Develop Angular Components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,8 +25,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.2",
-    "@storybook/node-logger": "5.0.0-rc.2",
+    "@storybook/core": "5.0.0-rc.3",
+    "@storybook/node-logger": "5.0.0-rc.3",
     "angular2-template-loader": "^0.6.2",
     "core-js": "^2.6.2",
     "fork-ts-checker-webpack-plugin": "^0.5.2",
diff --git a/app/ember/package.json b/app/ember/package.json
index 53151490b2f..b1bf12dca20 100644
--- a/app/ember/package.json
+++ b/app/ember/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/ember",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "description": "Storybook for Ember: Develop Ember Component in isolation with Hot Reloading.",
   "homepage": "https://github.com/storybooks/storybook/tree/master/app/ember",
   "bugs": {
@@ -23,7 +23,7 @@
   },
   "dependencies": {
     "@ember/test-helpers": "^1.3.1",
-    "@storybook/core": "5.0.0-rc.2",
+    "@storybook/core": "5.0.0-rc.3",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/html/package.json b/app/html/package.json
index 520593fe26c..780c33ca915 100644
--- a/app/html/package.json
+++ b/app/html/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/html",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "description": "Storybook for HTML: View HTML snippets in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.2",
+    "@storybook/core": "5.0.0-rc.3",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/marko/package.json b/app/marko/package.json
index 80f609dfdf9..203c11e7560 100644
--- a/app/marko/package.json
+++ b/app/marko/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/marko",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "description": "Storybook for Marko: Develop Marko Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.2",
+    "@storybook/core": "5.0.0-rc.3",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/mithril/package.json b/app/mithril/package.json
index 68ace8a872b..0138f1751fa 100644
--- a/app/mithril/package.json
+++ b/app/mithril/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/mithril",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "description": "Storybook for Mithril: Develop Mithril Component in isolation.",
   "keywords": [
     "storybook"
@@ -26,7 +26,7 @@
   },
   "dependencies": {
     "@babel/plugin-transform-react-jsx": "^7.3.0",
-    "@storybook/core": "5.0.0-rc.2",
+    "@storybook/core": "5.0.0-rc.3",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/polymer/package.json b/app/polymer/package.json
index 6d93d4c4f1a..991de64e93b 100644
--- a/app/polymer/package.json
+++ b/app/polymer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/polymer",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "description": "Storybook for Polymer: Develop Polymer components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.2",
+    "@storybook/core": "5.0.0-rc.3",
     "@webcomponents/webcomponentsjs": "^1.2.0",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
diff --git a/app/preact/package.json b/app/preact/package.json
index bc56ee82ffa..2953ac6902c 100644
--- a/app/preact/package.json
+++ b/app/preact/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/preact",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "description": "Storybook for Preact: Develop Preact Component in isolation.",
   "keywords": [
     "storybook"
@@ -26,7 +26,7 @@
   },
   "dependencies": {
     "@babel/plugin-transform-react-jsx": "^7.3.0",
-    "@storybook/core": "5.0.0-rc.2",
+    "@storybook/core": "5.0.0-rc.3",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/react/package.json b/app/react/package.json
index 414a8a86c77..0d68d71b611 100644
--- a/app/react/package.json
+++ b/app/react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/react",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "description": "Storybook for React: Develop React Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -28,9 +28,9 @@
     "@babel/plugin-transform-react-constant-elements": "^7.2.0",
     "@babel/preset-flow": "^7.0.0",
     "@babel/preset-react": "^7.0.0",
-    "@storybook/core": "5.0.0-rc.2",
-    "@storybook/node-logger": "5.0.0-rc.2",
-    "@storybook/theming": "5.0.0-rc.2",
+    "@storybook/core": "5.0.0-rc.3",
+    "@storybook/node-logger": "5.0.0-rc.3",
+    "@storybook/theming": "5.0.0-rc.3",
     "@svgr/webpack": "^4.0.3",
     "babel-plugin-named-asset-import": "^0.3.0",
     "babel-plugin-react-docgen": "^2.0.2",
diff --git a/app/riot/package.json b/app/riot/package.json
index f99faa56142..d925923093e 100644
--- a/app/riot/package.json
+++ b/app/riot/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/riot",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "description": "Storybook for riot.js: View riot snippets in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.2",
+    "@storybook/core": "5.0.0-rc.3",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/svelte/package.json b/app/svelte/package.json
index 7d056cd3094..8630a62007f 100644
--- a/app/svelte/package.json
+++ b/app/svelte/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/svelte",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "description": "Storybook for Svelte: Develop Svelte Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.2",
+    "@storybook/core": "5.0.0-rc.3",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/vue/package.json b/app/vue/package.json
index 038971b968a..0640e5ba7ed 100644
--- a/app/vue/package.json
+++ b/app/vue/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/vue",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "description": "Storybook for Vue: Develop Vue Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.2",
+    "@storybook/core": "5.0.0-rc.3",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/examples/angular-cli/package.json b/examples/angular-cli/package.json
index 5be22f3ee50..c5787f12999 100644
--- a/examples/angular-cli/package.json
+++ b/examples/angular-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "angular-cli",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "private": true,
   "license": "MIT",
   "scripts": {
@@ -33,18 +33,18 @@
     "@angular-devkit/build-angular": "^0.11.4",
     "@angular/cli": "^7.3.0",
     "@angular/compiler-cli": "^7.2.1",
-    "@storybook/addon-actions": "5.0.0-rc.2",
-    "@storybook/addon-backgrounds": "5.0.0-rc.2",
-    "@storybook/addon-centered": "5.0.0-rc.2",
-    "@storybook/addon-jest": "5.0.0-rc.2",
-    "@storybook/addon-knobs": "5.0.0-rc.2",
-    "@storybook/addon-links": "5.0.0-rc.2",
-    "@storybook/addon-notes": "5.0.0-rc.2",
-    "@storybook/addon-options": "5.0.0-rc.2",
-    "@storybook/addon-storyshots": "5.0.0-rc.2",
-    "@storybook/addon-storysource": "5.0.0-rc.2",
-    "@storybook/addons": "5.0.0-rc.2",
-    "@storybook/angular": "5.0.0-rc.2",
+    "@storybook/addon-actions": "5.0.0-rc.3",
+    "@storybook/addon-backgrounds": "5.0.0-rc.3",
+    "@storybook/addon-centered": "5.0.0-rc.3",
+    "@storybook/addon-jest": "5.0.0-rc.3",
+    "@storybook/addon-knobs": "5.0.0-rc.3",
+    "@storybook/addon-links": "5.0.0-rc.3",
+    "@storybook/addon-notes": "5.0.0-rc.3",
+    "@storybook/addon-options": "5.0.0-rc.3",
+    "@storybook/addon-storyshots": "5.0.0-rc.3",
+    "@storybook/addon-storysource": "5.0.0-rc.3",
+    "@storybook/addons": "5.0.0-rc.3",
+    "@storybook/angular": "5.0.0-rc.3",
     "@types/core-js": "^2.5.0",
     "@types/jest": "^23.3.13",
     "@types/node": "~10.12.19",
diff --git a/examples/cra-kitchen-sink/package.json b/examples/cra-kitchen-sink/package.json
index 06306b41f8a..e29eb57cd80 100644
--- a/examples/cra-kitchen-sink/package.json
+++ b/examples/cra-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "cra-kitchen-sink",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "private": true,
   "scripts": {
     "build": "react-scripts build",
@@ -18,21 +18,21 @@
     "react-lifecycles-compat": "^3.0.4"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.0.0-rc.2",
-    "@storybook/addon-actions": "5.0.0-rc.2",
-    "@storybook/addon-backgrounds": "5.0.0-rc.2",
-    "@storybook/addon-centered": "5.0.0-rc.2",
-    "@storybook/addon-events": "5.0.0-rc.2",
-    "@storybook/addon-info": "5.0.0-rc.2",
-    "@storybook/addon-jest": "5.0.0-rc.2",
-    "@storybook/addon-knobs": "5.0.0-rc.2",
-    "@storybook/addon-links": "5.0.0-rc.2",
-    "@storybook/addon-notes": "5.0.0-rc.2",
-    "@storybook/addon-options": "5.0.0-rc.2",
-    "@storybook/addon-storyshots": "5.0.0-rc.2",
-    "@storybook/addons": "5.0.0-rc.2",
-    "@storybook/client-logger": "5.0.0-rc.2",
-    "@storybook/react": "5.0.0-rc.2",
+    "@storybook/addon-a11y": "5.0.0-rc.3",
+    "@storybook/addon-actions": "5.0.0-rc.3",
+    "@storybook/addon-backgrounds": "5.0.0-rc.3",
+    "@storybook/addon-centered": "5.0.0-rc.3",
+    "@storybook/addon-events": "5.0.0-rc.3",
+    "@storybook/addon-info": "5.0.0-rc.3",
+    "@storybook/addon-jest": "5.0.0-rc.3",
+    "@storybook/addon-knobs": "5.0.0-rc.3",
+    "@storybook/addon-links": "5.0.0-rc.3",
+    "@storybook/addon-notes": "5.0.0-rc.3",
+    "@storybook/addon-options": "5.0.0-rc.3",
+    "@storybook/addon-storyshots": "5.0.0-rc.3",
+    "@storybook/addons": "5.0.0-rc.3",
+    "@storybook/client-logger": "5.0.0-rc.3",
+    "@storybook/react": "5.0.0-rc.3",
     "enzyme": "^3.7.0",
     "enzyme-adapter-react-16": "^1.9.1",
     "enzyme-to-json": "^3.3.4",
diff --git a/examples/cra-ts-kitchen-sink/package.json b/examples/cra-ts-kitchen-sink/package.json
index f6402ca7377..b67c6100064 100644
--- a/examples/cra-ts-kitchen-sink/package.json
+++ b/examples/cra-ts-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "cra-ts-kitchen-sink",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook -s public",
@@ -19,11 +19,11 @@
     "react-dom": "^16.8.1"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.2",
-    "@storybook/addon-info": "5.0.0-rc.2",
-    "@storybook/addon-options": "5.0.0-rc.2",
-    "@storybook/addons": "5.0.0-rc.2",
-    "@storybook/react": "5.0.0-rc.2",
+    "@storybook/addon-actions": "5.0.0-rc.3",
+    "@storybook/addon-info": "5.0.0-rc.3",
+    "@storybook/addon-options": "5.0.0-rc.3",
+    "@storybook/addons": "5.0.0-rc.3",
+    "@storybook/react": "5.0.0-rc.3",
     "@types/enzyme": "^3.1.15",
     "@types/react": "^16.7.22",
     "@types/react-dom": "^16.0.11",
diff --git a/examples/ember-cli/package.json b/examples/ember-cli/package.json
index 5a67d3923bc..b14aea9a0da 100644
--- a/examples/ember-cli/package.json
+++ b/examples/ember-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "ember-example",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "private": true,
   "scripts": {
     "build": "ember build",
@@ -14,18 +14,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.2.2",
-    "@storybook/addon-a11y": "5.0.0-rc.2",
-    "@storybook/addon-actions": "5.0.0-rc.2",
-    "@storybook/addon-backgrounds": "5.0.0-rc.2",
-    "@storybook/addon-centered": "5.0.0-rc.2",
-    "@storybook/addon-knobs": "5.0.0-rc.2",
-    "@storybook/addon-links": "5.0.0-rc.2",
-    "@storybook/addon-notes": "5.0.0-rc.2",
-    "@storybook/addon-options": "5.0.0-rc.2",
-    "@storybook/addon-storysource": "5.0.0-rc.2",
-    "@storybook/addon-viewport": "5.0.0-rc.2",
-    "@storybook/addons": "5.0.0-rc.2",
-    "@storybook/ember": "5.0.0-rc.2",
+    "@storybook/addon-a11y": "5.0.0-rc.3",
+    "@storybook/addon-actions": "5.0.0-rc.3",
+    "@storybook/addon-backgrounds": "5.0.0-rc.3",
+    "@storybook/addon-centered": "5.0.0-rc.3",
+    "@storybook/addon-knobs": "5.0.0-rc.3",
+    "@storybook/addon-links": "5.0.0-rc.3",
+    "@storybook/addon-notes": "5.0.0-rc.3",
+    "@storybook/addon-options": "5.0.0-rc.3",
+    "@storybook/addon-storysource": "5.0.0-rc.3",
+    "@storybook/addon-viewport": "5.0.0-rc.3",
+    "@storybook/addons": "5.0.0-rc.3",
+    "@storybook/ember": "5.0.0-rc.3",
     "babel-loader": "^8",
     "broccoli-asset-rev": "^3.0.0",
     "cross-env": "^5.2.0",
diff --git a/examples/html-kitchen-sink/package.json b/examples/html-kitchen-sink/package.json
index e44b5bdb252..b062d2d2a1e 100644
--- a/examples/html-kitchen-sink/package.json
+++ b/examples/html-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "html-kitchen-sink",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "private": true,
   "description": "",
   "keywords": [],
@@ -13,23 +13,23 @@
     "storybook": "start-storybook -p 9006"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.0.0-rc.2",
-    "@storybook/addon-actions": "5.0.0-rc.2",
-    "@storybook/addon-backgrounds": "5.0.0-rc.2",
-    "@storybook/addon-centered": "5.0.0-rc.2",
-    "@storybook/addon-events": "5.0.0-rc.2",
-    "@storybook/addon-jest": "5.0.0-rc.2",
-    "@storybook/addon-knobs": "5.0.0-rc.2",
-    "@storybook/addon-links": "5.0.0-rc.2",
-    "@storybook/addon-notes": "5.0.0-rc.2",
-    "@storybook/addon-options": "5.0.0-rc.2",
-    "@storybook/addon-storyshots": "5.0.0-rc.2",
-    "@storybook/addon-storysource": "5.0.0-rc.2",
-    "@storybook/addon-viewport": "5.0.0-rc.2",
-    "@storybook/addons": "5.0.0-rc.2",
-    "@storybook/core": "5.0.0-rc.2",
-    "@storybook/core-events": "5.0.0-rc.2",
-    "@storybook/html": "5.0.0-rc.2",
+    "@storybook/addon-a11y": "5.0.0-rc.3",
+    "@storybook/addon-actions": "5.0.0-rc.3",
+    "@storybook/addon-backgrounds": "5.0.0-rc.3",
+    "@storybook/addon-centered": "5.0.0-rc.3",
+    "@storybook/addon-events": "5.0.0-rc.3",
+    "@storybook/addon-jest": "5.0.0-rc.3",
+    "@storybook/addon-knobs": "5.0.0-rc.3",
+    "@storybook/addon-links": "5.0.0-rc.3",
+    "@storybook/addon-notes": "5.0.0-rc.3",
+    "@storybook/addon-options": "5.0.0-rc.3",
+    "@storybook/addon-storyshots": "5.0.0-rc.3",
+    "@storybook/addon-storysource": "5.0.0-rc.3",
+    "@storybook/addon-viewport": "5.0.0-rc.3",
+    "@storybook/addons": "5.0.0-rc.3",
+    "@storybook/core": "5.0.0-rc.3",
+    "@storybook/core-events": "5.0.0-rc.3",
+    "@storybook/html": "5.0.0-rc.3",
     "eventemitter3": "^3.1.0",
     "format-json": "^1.0.3",
     "global": "^4.3.2",
diff --git a/examples/marko-cli/package.json b/examples/marko-cli/package.json
index 6d545a7d112..302f8738504 100644
--- a/examples/marko-cli/package.json
+++ b/examples/marko-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "marko-cli",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "private": true,
   "description": "Demo of how to build an app using marko-starter",
   "repository": {
@@ -22,12 +22,12 @@
     "marko-starter": "^2.0.4"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.2",
-    "@storybook/addon-knobs": "5.0.0-rc.2",
-    "@storybook/addon-options": "5.0.0-rc.2",
-    "@storybook/addon-storysource": "5.0.0-rc.2",
-    "@storybook/addons": "5.0.0-rc.2",
-    "@storybook/marko": "5.0.0-rc.2",
+    "@storybook/addon-actions": "5.0.0-rc.3",
+    "@storybook/addon-knobs": "5.0.0-rc.3",
+    "@storybook/addon-options": "5.0.0-rc.3",
+    "@storybook/addon-storysource": "5.0.0-rc.3",
+    "@storybook/addons": "5.0.0-rc.3",
+    "@storybook/marko": "5.0.0-rc.3",
     "prettier": "^1.16.4",
     "webpack": "^4.29.0"
   }
diff --git a/examples/mithril-kitchen-sink/package.json b/examples/mithril-kitchen-sink/package.json
index 02050914a3e..a634f29ae3a 100644
--- a/examples/mithril-kitchen-sink/package.json
+++ b/examples/mithril-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "mithril-example",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook",
@@ -10,18 +10,18 @@
     "mithril": "^1.1.6"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.2",
-    "@storybook/addon-backgrounds": "5.0.0-rc.2",
-    "@storybook/addon-centered": "5.0.0-rc.2",
-    "@storybook/addon-knobs": "5.0.0-rc.2",
-    "@storybook/addon-links": "5.0.0-rc.2",
-    "@storybook/addon-notes": "5.0.0-rc.2",
-    "@storybook/addon-options": "5.0.0-rc.2",
-    "@storybook/addon-storyshots": "5.0.0-rc.2",
-    "@storybook/addon-storysource": "5.0.0-rc.2",
-    "@storybook/addon-viewport": "5.0.0-rc.2",
-    "@storybook/addons": "5.0.0-rc.2",
-    "@storybook/mithril": "5.0.0-rc.2",
+    "@storybook/addon-actions": "5.0.0-rc.3",
+    "@storybook/addon-backgrounds": "5.0.0-rc.3",
+    "@storybook/addon-centered": "5.0.0-rc.3",
+    "@storybook/addon-knobs": "5.0.0-rc.3",
+    "@storybook/addon-links": "5.0.0-rc.3",
+    "@storybook/addon-notes": "5.0.0-rc.3",
+    "@storybook/addon-options": "5.0.0-rc.3",
+    "@storybook/addon-storyshots": "5.0.0-rc.3",
+    "@storybook/addon-storysource": "5.0.0-rc.3",
+    "@storybook/addon-viewport": "5.0.0-rc.3",
+    "@storybook/addons": "5.0.0-rc.3",
+    "@storybook/mithril": "5.0.0-rc.3",
     "webpack": "^4.29.0"
   }
 }
diff --git a/examples/official-storybook/package.json b/examples/official-storybook/package.json
index 1ea39ccc493..84fa8286ebb 100644
--- a/examples/official-storybook/package.json
+++ b/examples/official-storybook/package.json
@@ -1,6 +1,6 @@
 {
   "name": "official-storybook",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook -c ./ -s built-storybooks",
@@ -12,29 +12,29 @@
     "storybook": "cross-env STORYBOOK_DISPLAY_WARNING=true DISPLAY_WARNING=true start-storybook -p 9011 -c ./ -s built-storybooks --no-dll"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.0.0-rc.2",
-    "@storybook/addon-actions": "5.0.0-rc.2",
-    "@storybook/addon-backgrounds": "5.0.0-rc.2",
-    "@storybook/addon-centered": "5.0.0-rc.2",
-    "@storybook/addon-cssresources": "5.0.0-rc.2",
-    "@storybook/addon-events": "5.0.0-rc.2",
-    "@storybook/addon-graphql": "5.0.0-rc.2",
-    "@storybook/addon-info": "5.0.0-rc.2",
-    "@storybook/addon-jest": "5.0.0-rc.2",
-    "@storybook/addon-knobs": "5.0.0-rc.2",
-    "@storybook/addon-links": "5.0.0-rc.2",
-    "@storybook/addon-notes": "5.0.0-rc.2",
-    "@storybook/addon-options": "5.0.0-rc.2",
-    "@storybook/addon-storyshots": "5.0.0-rc.2",
-    "@storybook/addon-storyshots-puppeteer": "5.0.0-rc.2",
-    "@storybook/addon-storysource": "5.0.0-rc.2",
-    "@storybook/addon-viewport": "5.0.0-rc.2",
-    "@storybook/addons": "5.0.0-rc.2",
-    "@storybook/components": "5.0.0-rc.2",
-    "@storybook/core-events": "5.0.0-rc.2",
-    "@storybook/node-logger": "5.0.0-rc.2",
-    "@storybook/react": "5.0.0-rc.2",
-    "@storybook/theming": "5.0.0-rc.2",
+    "@storybook/addon-a11y": "5.0.0-rc.3",
+    "@storybook/addon-actions": "5.0.0-rc.3",
+    "@storybook/addon-backgrounds": "5.0.0-rc.3",
+    "@storybook/addon-centered": "5.0.0-rc.3",
+    "@storybook/addon-cssresources": "5.0.0-rc.3",
+    "@storybook/addon-events": "5.0.0-rc.3",
+    "@storybook/addon-graphql": "5.0.0-rc.3",
+    "@storybook/addon-info": "5.0.0-rc.3",
+    "@storybook/addon-jest": "5.0.0-rc.3",
+    "@storybook/addon-knobs": "5.0.0-rc.3",
+    "@storybook/addon-links": "5.0.0-rc.3",
+    "@storybook/addon-notes": "5.0.0-rc.3",
+    "@storybook/addon-options": "5.0.0-rc.3",
+    "@storybook/addon-storyshots": "5.0.0-rc.3",
+    "@storybook/addon-storyshots-puppeteer": "5.0.0-rc.3",
+    "@storybook/addon-storysource": "5.0.0-rc.3",
+    "@storybook/addon-viewport": "5.0.0-rc.3",
+    "@storybook/addons": "5.0.0-rc.3",
+    "@storybook/components": "5.0.0-rc.3",
+    "@storybook/core-events": "5.0.0-rc.3",
+    "@storybook/node-logger": "5.0.0-rc.3",
+    "@storybook/react": "5.0.0-rc.3",
+    "@storybook/theming": "5.0.0-rc.3",
     "cors": "^2.8.4",
     "cross-env": "^5.2.0",
     "enzyme-to-json": "^3.3.4",
diff --git a/examples/polymer-cli/package.json b/examples/polymer-cli/package.json
index 4386e8fb28a..cef11cfc870 100644
--- a/examples/polymer-cli/package.json
+++ b/examples/polymer-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "polymer-cli",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook",
@@ -9,15 +9,15 @@
   },
   "dependencies": {
     "@polymer/polymer": "^2.6.0",
-    "@storybook/addon-actions": "5.0.0-rc.2",
-    "@storybook/addon-backgrounds": "5.0.0-rc.2",
-    "@storybook/addon-knobs": "5.0.0-rc.2",
-    "@storybook/addon-links": "5.0.0-rc.2",
-    "@storybook/addon-notes": "5.0.0-rc.2",
-    "@storybook/addon-options": "5.0.0-rc.2",
-    "@storybook/addon-storysource": "5.0.0-rc.2",
-    "@storybook/addon-viewport": "5.0.0-rc.2",
-    "@storybook/polymer": "5.0.0-rc.2",
+    "@storybook/addon-actions": "5.0.0-rc.3",
+    "@storybook/addon-backgrounds": "5.0.0-rc.3",
+    "@storybook/addon-knobs": "5.0.0-rc.3",
+    "@storybook/addon-links": "5.0.0-rc.3",
+    "@storybook/addon-notes": "5.0.0-rc.3",
+    "@storybook/addon-options": "5.0.0-rc.3",
+    "@storybook/addon-storysource": "5.0.0-rc.3",
+    "@storybook/addon-viewport": "5.0.0-rc.3",
+    "@storybook/polymer": "5.0.0-rc.3",
     "@webcomponents/webcomponentsjs": "^1.2.0",
     "global": "^4.3.2",
     "lit-html": "^1.0.0",
diff --git a/examples/preact-kitchen-sink/package.json b/examples/preact-kitchen-sink/package.json
index 11329c4cdf6..5c9e0496af3 100644
--- a/examples/preact-kitchen-sink/package.json
+++ b/examples/preact-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "preact-example",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "private": true,
   "scripts": {
     "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
@@ -15,18 +15,18 @@
   "devDependencies": {
     "@babel/core": "^7.2.2",
     "@babel/plugin-transform-runtime": "^7.2.0",
-    "@storybook/addon-actions": "5.0.0-rc.2",
-    "@storybook/addon-backgrounds": "5.0.0-rc.2",
-    "@storybook/addon-centered": "5.0.0-rc.2",
-    "@storybook/addon-knobs": "5.0.0-rc.2",
-    "@storybook/addon-links": "5.0.0-rc.2",
-    "@storybook/addon-notes": "5.0.0-rc.2",
-    "@storybook/addon-options": "5.0.0-rc.2",
-    "@storybook/addon-storyshots": "5.0.0-rc.2",
-    "@storybook/addon-storysource": "5.0.0-rc.2",
-    "@storybook/addon-viewport": "5.0.0-rc.2",
-    "@storybook/addons": "5.0.0-rc.2",
-    "@storybook/preact": "5.0.0-rc.2",
+    "@storybook/addon-actions": "5.0.0-rc.3",
+    "@storybook/addon-backgrounds": "5.0.0-rc.3",
+    "@storybook/addon-centered": "5.0.0-rc.3",
+    "@storybook/addon-knobs": "5.0.0-rc.3",
+    "@storybook/addon-links": "5.0.0-rc.3",
+    "@storybook/addon-notes": "5.0.0-rc.3",
+    "@storybook/addon-options": "5.0.0-rc.3",
+    "@storybook/addon-storyshots": "5.0.0-rc.3",
+    "@storybook/addon-storysource": "5.0.0-rc.3",
+    "@storybook/addon-viewport": "5.0.0-rc.3",
+    "@storybook/addons": "5.0.0-rc.3",
+    "@storybook/preact": "5.0.0-rc.3",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
     "file-loader": "^3.0.1",
diff --git a/examples/riot-kitchen-sink/package.json b/examples/riot-kitchen-sink/package.json
index d3e13672ab6..efc60093565 100644
--- a/examples/riot-kitchen-sink/package.json
+++ b/examples/riot-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "riot-example",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "private": true,
   "scripts": {
     "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
@@ -15,18 +15,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.2.2",
-    "@storybook/addon-actions": "5.0.0-rc.2",
-    "@storybook/addon-backgrounds": "5.0.0-rc.2",
-    "@storybook/addon-centered": "5.0.0-rc.2",
-    "@storybook/addon-knobs": "5.0.0-rc.2",
-    "@storybook/addon-links": "5.0.0-rc.2",
-    "@storybook/addon-notes": "5.0.0-rc.2",
-    "@storybook/addon-options": "5.0.0-rc.2",
-    "@storybook/addon-storyshots": "5.0.0-rc.2",
-    "@storybook/addon-storysource": "5.0.0-rc.2",
-    "@storybook/addon-viewport": "5.0.0-rc.2",
-    "@storybook/addons": "5.0.0-rc.2",
-    "@storybook/riot": "5.0.0-rc.2",
+    "@storybook/addon-actions": "5.0.0-rc.3",
+    "@storybook/addon-backgrounds": "5.0.0-rc.3",
+    "@storybook/addon-centered": "5.0.0-rc.3",
+    "@storybook/addon-knobs": "5.0.0-rc.3",
+    "@storybook/addon-links": "5.0.0-rc.3",
+    "@storybook/addon-notes": "5.0.0-rc.3",
+    "@storybook/addon-options": "5.0.0-rc.3",
+    "@storybook/addon-storyshots": "5.0.0-rc.3",
+    "@storybook/addon-storysource": "5.0.0-rc.3",
+    "@storybook/addon-viewport": "5.0.0-rc.3",
+    "@storybook/addons": "5.0.0-rc.3",
+    "@storybook/riot": "5.0.0-rc.3",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
     "file-loader": "^3.0.1",
diff --git a/examples/svelte-kitchen-sink/package.json b/examples/svelte-kitchen-sink/package.json
index 8e72b78aab6..5cc7e64f93a 100644
--- a/examples/svelte-kitchen-sink/package.json
+++ b/examples/svelte-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "svelte-example",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook -s public",
@@ -10,17 +10,17 @@
     "global": "^4.3.2"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.2",
-    "@storybook/addon-backgrounds": "5.0.0-rc.2",
-    "@storybook/addon-centered": "5.0.0-rc.2",
-    "@storybook/addon-knobs": "5.0.0-rc.2",
-    "@storybook/addon-links": "5.0.0-rc.2",
-    "@storybook/addon-notes": "5.0.0-rc.2",
-    "@storybook/addon-options": "5.0.0-rc.2",
-    "@storybook/addon-storyshots": "5.0.0-rc.2",
-    "@storybook/addon-storysource": "5.0.0-rc.2",
-    "@storybook/addon-viewport": "5.0.0-rc.2",
-    "@storybook/addons": "5.0.0-rc.2",
-    "@storybook/svelte": "5.0.0-rc.2"
+    "@storybook/addon-actions": "5.0.0-rc.3",
+    "@storybook/addon-backgrounds": "5.0.0-rc.3",
+    "@storybook/addon-centered": "5.0.0-rc.3",
+    "@storybook/addon-knobs": "5.0.0-rc.3",
+    "@storybook/addon-links": "5.0.0-rc.3",
+    "@storybook/addon-notes": "5.0.0-rc.3",
+    "@storybook/addon-options": "5.0.0-rc.3",
+    "@storybook/addon-storyshots": "5.0.0-rc.3",
+    "@storybook/addon-storysource": "5.0.0-rc.3",
+    "@storybook/addon-viewport": "5.0.0-rc.3",
+    "@storybook/addons": "5.0.0-rc.3",
+    "@storybook/svelte": "5.0.0-rc.3"
   }
 }
diff --git a/examples/vue-kitchen-sink/package.json b/examples/vue-kitchen-sink/package.json
index 1d08648056b..aed5a1b00af 100644
--- a/examples/vue-kitchen-sink/package.json
+++ b/examples/vue-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "vue-example",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "private": true,
   "scripts": {
     "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
@@ -14,18 +14,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.2.2",
-    "@storybook/addon-actions": "5.0.0-rc.2",
-    "@storybook/addon-backgrounds": "5.0.0-rc.2",
-    "@storybook/addon-centered": "5.0.0-rc.2",
-    "@storybook/addon-knobs": "5.0.0-rc.2",
-    "@storybook/addon-links": "5.0.0-rc.2",
-    "@storybook/addon-notes": "5.0.0-rc.2",
-    "@storybook/addon-options": "5.0.0-rc.2",
-    "@storybook/addon-storyshots": "5.0.0-rc.2",
-    "@storybook/addon-storysource": "5.0.0-rc.2",
-    "@storybook/addon-viewport": "5.0.0-rc.2",
-    "@storybook/addons": "5.0.0-rc.2",
-    "@storybook/vue": "5.0.0-rc.2",
+    "@storybook/addon-actions": "5.0.0-rc.3",
+    "@storybook/addon-backgrounds": "5.0.0-rc.3",
+    "@storybook/addon-centered": "5.0.0-rc.3",
+    "@storybook/addon-knobs": "5.0.0-rc.3",
+    "@storybook/addon-links": "5.0.0-rc.3",
+    "@storybook/addon-notes": "5.0.0-rc.3",
+    "@storybook/addon-options": "5.0.0-rc.3",
+    "@storybook/addon-storyshots": "5.0.0-rc.3",
+    "@storybook/addon-storysource": "5.0.0-rc.3",
+    "@storybook/addon-viewport": "5.0.0-rc.3",
+    "@storybook/addons": "5.0.0-rc.3",
+    "@storybook/vue": "5.0.0-rc.3",
     "babel-core": "^7.0.0-bridge.0",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
diff --git a/lerna.json b/lerna.json
index 3b5748abbac..3018b0720ea 100644
--- a/lerna.json
+++ b/lerna.json
@@ -11,5 +11,5 @@
   "npmClient": "yarn",
   "useWorkspaces": true,
   "registry": "https://registry.npmjs.org",
-  "version": "5.0.0-rc.2"
+  "version": "5.0.0-rc.3"
 }
diff --git a/lib/addons/package.json b/lib/addons/package.json
index f3a278e1967..3e8fd598521 100644
--- a/lib/addons/package.json
+++ b/lib/addons/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addons",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "description": "Storybook addons store",
   "keywords": [
     "storybook"
@@ -20,8 +20,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.0.0-rc.2",
-    "@storybook/client-logger": "5.0.0-rc.2",
+    "@storybook/channels": "5.0.0-rc.3",
+    "@storybook/client-logger": "5.0.0-rc.3",
     "global": "^4.3.2",
     "util-deprecate": "^1.0.2"
   },
diff --git a/lib/channel-postmessage/package.json b/lib/channel-postmessage/package.json
index 96c1b5cc55e..c05cc46e103 100644
--- a/lib/channel-postmessage/package.json
+++ b/lib/channel-postmessage/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channel-postmessage",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "description": "",
   "keywords": [
     "storybook"
@@ -20,7 +20,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.0.0-rc.2",
+    "@storybook/channels": "5.0.0-rc.3",
     "global": "^4.3.2",
     "telejson": "^1.0.1"
   },
diff --git a/lib/channel-websocket/package.json b/lib/channel-websocket/package.json
index f8a934e1548..38b69b44ab2 100644
--- a/lib/channel-websocket/package.json
+++ b/lib/channel-websocket/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channel-websocket",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "description": "",
   "keywords": [
     "storybook"
@@ -20,7 +20,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.0.0-rc.2",
+    "@storybook/channels": "5.0.0-rc.3",
     "global": "^4.3.2",
     "json-fn": "^1.1.1"
   },
diff --git a/lib/channels/package.json b/lib/channels/package.json
index 2b2f3ae9326..85c0c744a9c 100644
--- a/lib/channels/package.json
+++ b/lib/channels/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channels",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/cli/package.json b/lib/cli/package.json
index 56f3b9242ea..16a449a2d0b 100644
--- a/lib/cli/package.json
+++ b/lib/cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/cli",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "description": "Storybook's CLI - easiest method of adding storybook to your projects",
   "keywords": [
     "cli",
@@ -29,7 +29,7 @@
     "@babel/core": "^7.2.2",
     "@babel/preset-env": "^7.3.1",
     "@babel/register": "^7.0.0",
-    "@storybook/codemod": "5.0.0-rc.2",
+    "@storybook/codemod": "5.0.0-rc.3",
     "chalk": "^2.4.1",
     "commander": "^2.19.0",
     "core-js": "^2.6.2",
@@ -43,31 +43,31 @@
     "update-notifier": "^2.5.0"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.2",
-    "@storybook/addon-centered": "5.0.0-rc.2",
-    "@storybook/addon-graphql": "5.0.0-rc.2",
-    "@storybook/addon-info": "5.0.0-rc.2",
-    "@storybook/addon-knobs": "5.0.0-rc.2",
-    "@storybook/addon-links": "5.0.0-rc.2",
-    "@storybook/addon-notes": "5.0.0-rc.2",
-    "@storybook/addon-options": "5.0.0-rc.2",
-    "@storybook/addon-storyshots": "5.0.0-rc.2",
-    "@storybook/addons": "5.0.0-rc.2",
-    "@storybook/angular": "5.0.0-rc.2",
-    "@storybook/channel-postmessage": "5.0.0-rc.2",
-    "@storybook/channel-websocket": "5.0.0-rc.2",
-    "@storybook/channels": "5.0.0-rc.2",
-    "@storybook/ember": "5.0.0-rc.2",
-    "@storybook/html": "5.0.0-rc.2",
-    "@storybook/marko": "5.0.0-rc.2",
-    "@storybook/mithril": "5.0.0-rc.2",
-    "@storybook/polymer": "5.0.0-rc.2",
-    "@storybook/preact": "5.0.0-rc.2",
-    "@storybook/react": "5.0.0-rc.2",
+    "@storybook/addon-actions": "5.0.0-rc.3",
+    "@storybook/addon-centered": "5.0.0-rc.3",
+    "@storybook/addon-graphql": "5.0.0-rc.3",
+    "@storybook/addon-info": "5.0.0-rc.3",
+    "@storybook/addon-knobs": "5.0.0-rc.3",
+    "@storybook/addon-links": "5.0.0-rc.3",
+    "@storybook/addon-notes": "5.0.0-rc.3",
+    "@storybook/addon-options": "5.0.0-rc.3",
+    "@storybook/addon-storyshots": "5.0.0-rc.3",
+    "@storybook/addons": "5.0.0-rc.3",
+    "@storybook/angular": "5.0.0-rc.3",
+    "@storybook/channel-postmessage": "5.0.0-rc.3",
+    "@storybook/channel-websocket": "5.0.0-rc.3",
+    "@storybook/channels": "5.0.0-rc.3",
+    "@storybook/ember": "5.0.0-rc.3",
+    "@storybook/html": "5.0.0-rc.3",
+    "@storybook/marko": "5.0.0-rc.3",
+    "@storybook/mithril": "5.0.0-rc.3",
+    "@storybook/polymer": "5.0.0-rc.3",
+    "@storybook/preact": "5.0.0-rc.3",
+    "@storybook/react": "5.0.0-rc.3",
     "@storybook/react-native": "5.0.0-beta.4",
-    "@storybook/riot": "5.0.0-rc.2",
-    "@storybook/ui": "5.0.0-rc.2",
-    "@storybook/vue": "5.0.0-rc.2"
+    "@storybook/riot": "5.0.0-rc.3",
+    "@storybook/ui": "5.0.0-rc.3",
+    "@storybook/vue": "5.0.0-rc.3"
   },
   "publishConfig": {
     "access": "public"
diff --git a/lib/client-api/package.json b/lib/client-api/package.json
index 978aa0cfd52..623e1755e37 100644
--- a/lib/client-api/package.json
+++ b/lib/client-api/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/client-api",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "description": "Storybook Client API",
   "keywords": [
     "storybook"
@@ -19,9 +19,9 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.2",
-    "@storybook/client-logger": "5.0.0-rc.2",
-    "@storybook/core-events": "5.0.0-rc.2",
+    "@storybook/addons": "5.0.0-rc.3",
+    "@storybook/client-logger": "5.0.0-rc.3",
+    "@storybook/core-events": "5.0.0-rc.3",
     "common-tags": "^1.8.0",
     "eventemitter3": "^3.1.0",
     "global": "^4.3.2",
diff --git a/lib/client-logger/package.json b/lib/client-logger/package.json
index 1fb64a56430..8580fc3bbcf 100644
--- a/lib/client-logger/package.json
+++ b/lib/client-logger/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/client-logger",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/codemod/package.json b/lib/codemod/package.json
index 59ee200d911..2f104d0259e 100644
--- a/lib/codemod/package.json
+++ b/lib/codemod/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/codemod",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "description": "A collection of codemod scripts written with JSCodeshift",
   "keywords": [
     "storybook"
diff --git a/lib/components/package.json b/lib/components/package.json
index 4112f4adc33..40667f55003 100644
--- a/lib/components/package.json
+++ b/lib/components/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/components",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "description": "Core Storybook Components",
   "keywords": [
     "storybook"
@@ -20,11 +20,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.2",
-    "@storybook/client-logger": "5.0.0-rc.2",
-    "@storybook/core-events": "5.0.0-rc.2",
-    "@storybook/router": "5.0.0-rc.2",
-    "@storybook/theming": "5.0.0-rc.2",
+    "@storybook/addons": "5.0.0-rc.3",
+    "@storybook/client-logger": "5.0.0-rc.3",
+    "@storybook/core-events": "5.0.0-rc.3",
+    "@storybook/router": "5.0.0-rc.3",
+    "@storybook/theming": "5.0.0-rc.3",
     "global": "^4.3.2",
     "immer": "^1.12.0",
     "js-beautify": "^1.8.9",
diff --git a/lib/core-events/package.json b/lib/core-events/package.json
index 50b82d10259..ff860d278ea 100644
--- a/lib/core-events/package.json
+++ b/lib/core-events/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/core-events",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "description": "Event names used in storybook core",
   "keywords": [
     "storybook"
diff --git a/lib/core/package.json b/lib/core/package.json
index 4a802ec1e5d..cbe13f26d03 100644
--- a/lib/core/package.json
+++ b/lib/core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/core",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "description": "Storybook framework-agnostic API",
   "keywords": [
     "storybook"
@@ -24,14 +24,14 @@
     "@babel/plugin-syntax-dynamic-import": "^7.2.0",
     "@babel/plugin-transform-react-constant-elements": "^7.2.0",
     "@babel/preset-env": "^7.3.1",
-    "@storybook/addons": "5.0.0-rc.2",
-    "@storybook/channel-postmessage": "5.0.0-rc.2",
-    "@storybook/client-api": "5.0.0-rc.2",
-    "@storybook/client-logger": "5.0.0-rc.2",
-    "@storybook/core-events": "5.0.0-rc.2",
-    "@storybook/node-logger": "5.0.0-rc.2",
-    "@storybook/theming": "5.0.0-rc.2",
-    "@storybook/ui": "5.0.0-rc.2",
+    "@storybook/addons": "5.0.0-rc.3",
+    "@storybook/channel-postmessage": "5.0.0-rc.3",
+    "@storybook/client-api": "5.0.0-rc.3",
+    "@storybook/client-logger": "5.0.0-rc.3",
+    "@storybook/core-events": "5.0.0-rc.3",
+    "@storybook/node-logger": "5.0.0-rc.3",
+    "@storybook/theming": "5.0.0-rc.3",
+    "@storybook/ui": "5.0.0-rc.3",
     "airbnb-js-shims": "^1 || ^2",
     "autoprefixer": "^9.4.7",
     "babel-plugin-add-react-displayname": "^0.0.5",
diff --git a/lib/node-logger/package.json b/lib/node-logger/package.json
index c8f75c9f89f..8169e656b18 100644
--- a/lib/node-logger/package.json
+++ b/lib/node-logger/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/node-logger",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/router/package.json b/lib/router/package.json
index 664c6d1e8c6..7f14cbd14c2 100644
--- a/lib/router/package.json
+++ b/lib/router/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/router",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "description": "Core Storybook Router",
   "keywords": [
     "storybook"
@@ -20,7 +20,7 @@
   },
   "dependencies": {
     "@reach/router": "^1.2.1",
-    "@storybook/theming": "5.0.0-rc.2",
+    "@storybook/theming": "5.0.0-rc.3",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
     "qs": "^6.5.2"
diff --git a/lib/theming/package.json b/lib/theming/package.json
index 621d9273acb..b026e0b8767 100644
--- a/lib/theming/package.json
+++ b/lib/theming/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/theming",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "description": "Core Storybook Components",
   "keywords": [
     "storybook"
diff --git a/lib/ui/package.json b/lib/ui/package.json
index 077d6fcb05d..46442535153 100644
--- a/lib/ui/package.json
+++ b/lib/ui/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/ui",
-  "version": "5.0.0-rc.2",
+  "version": "5.0.0-rc.3",
   "description": "Core Storybook UI",
   "keywords": [
     "storybook"
@@ -21,12 +21,12 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.2",
-    "@storybook/client-logger": "5.0.0-rc.2",
-    "@storybook/components": "5.0.0-rc.2",
-    "@storybook/core-events": "5.0.0-rc.2",
-    "@storybook/router": "5.0.0-rc.2",
-    "@storybook/theming": "5.0.0-rc.2",
+    "@storybook/addons": "5.0.0-rc.3",
+    "@storybook/client-logger": "5.0.0-rc.3",
+    "@storybook/components": "5.0.0-rc.3",
+    "@storybook/core-events": "5.0.0-rc.3",
+    "@storybook/router": "5.0.0-rc.3",
+    "@storybook/theming": "5.0.0-rc.3",
     "eventemitter3": "^3.1.0",
     "fast-deep-equal": "^2.0.1",
     "fuse.js": "^3.3.1",

From ec355540e9f45d9a7eeebb688b4f7496d5bceb21 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Tue, 19 Feb 2019 19:33:05 +0800
Subject: [PATCH 043/249] 5.0.0-rc.3 versions.json

---
 docs/versions.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/docs/versions.json b/docs/versions.json
index 4e5d2a09c8d..451f64c66e8 100644
--- a/docs/versions.json
+++ b/docs/versions.json
@@ -1 +1 @@
-{"next":{"version":"5.0.0-rc.2","info":{"plain":"### Features\n\n* UI: Allow collapsing active story and use separate expansion for filtered ([#5625](https://github.com/storybooks/storybook/pull/5625))\n* UI: Handle prerelease versions in version check ([#5641](https://github.com/storybooks/storybook/pull/5641))\n\n### Bug Fixes\n\n* Addon-a11y: Fix tab highlighting  ([#5646](https://github.com/storybooks/storybook/pull/5646))\n* Addon-jest: Fix event subscription ([#5644](https://github.com/storybooks/storybook/pull/5644))\n* UI: Handle old versions in version check ([#5638](https://github.com/storybooks/storybook/pull/5638))\n\n### Maintenance\n\n* UI: Fix some prop warnings ([#5635](https://github.com/storybooks/storybook/pull/5635))\n* UI: Use the correct props to start the tooltip open ([#5610](https://github.com/storybooks/storybook/pull/5610))"}}}
\ No newline at end of file
+{"next":{"version":"5.0.0-rc.3","info":{"plain":"### Bug Fixes\n\n* UI: Styling bug fixes, story updates, and more QA ([#5650](https://github.com/storybooks/storybook/pull/5650))\n* UI: V5 style refinements ([#5562](https://github.com/storybooks/storybook/pull/5562))"}}}
\ No newline at end of file

From 4334564c4bf2259270cfde84b35c59cd0d034b55 Mon Sep 17 00:00:00 2001
From: Tom Coleman <tom@percolatestudio.com>
Date: Wed, 20 Feb 2019 13:37:01 +1100
Subject: [PATCH 044/249] Merge pull request #5669 from
 storybooks/fix/storyFn-consistency

Fix/story fn consistency
---
 addons/actions/src/preview/decorateAction.js  |  2 +-
 addons/actions/src/preview/withActions.js     |  4 +-
 addons/centered/src/html.js                   | 12 ++--
 addons/events/src/index.js                    |  4 +-
 addons/jest/src/index.js                      | 12 ++--
 addons/links/src/preview.js                   |  4 +-
 .../storyshots-core/src/api/index.js          |  2 +-
 .../src/frameworks/riot/renderTree.js         |  4 +-
 addons/storysource/src/preview.js             |  4 +-
 .../src/client/preview/angular/helpers.ts     | 10 +--
 .../src/client/preview/angular/types.ts       |  2 +-
 app/angular/src/client/preview/render.js      |  4 +-
 app/ember/src/client/preview/render.js        | 11 ++-
 app/html/src/client/preview/render.js         | 12 ++--
 app/marko/src/client/preview/render.js        | 11 ++-
 app/mithril/src/client/preview/render.js      | 11 ++-
 app/polymer/src/client/preview/render.js      | 16 ++---
 app/preact/src/client/preview/render.js       | 11 ++-
 app/react/src/client/preview/render.js        |  4 +-
 app/riot/src/client/preview/render.js         |  9 +--
 app/svelte/src/client/preview/render.js       |  4 +-
 app/vue/src/client/preview/render.js          | 10 +--
 docs/.storybook/config.js                     |  2 +-
 .../src/pages/basics/writing-stories/index.md |  4 +-
 .../stories/addon-events.stories.js           |  4 +-
 examples/official-storybook/config.js         |  4 +-
 .../stories/addon-events.stories.js           |  4 +-
 .../stories/addon-links.stories.js            |  4 +-
 .../src/stories/custom-decorators.stories.js  |  4 +-
 .../src/stories/custom-decorators.stories.js  |  6 +-
 lib/client-api/src/client_api.js              | 40 +++++------
 lib/client-api/src/client_api.test.js         | 14 ++--
 lib/client-api/src/story_store.js             | 71 +++++++++++--------
 lib/client-api/src/story_store.test.js        | 64 +++++++++--------
 lib/core/src/client/preview/start.js          |  7 +-
 35 files changed, 222 insertions(+), 169 deletions(-)

diff --git a/addons/actions/src/preview/decorateAction.js b/addons/actions/src/preview/decorateAction.js
index d61f3744874..eb991ab0620 100644
--- a/addons/actions/src/preview/decorateAction.js
+++ b/addons/actions/src/preview/decorateAction.js
@@ -4,7 +4,7 @@ import { createDecorator } from './withActions';
 
 function applyDecorators(decorators, actionCallback) {
   return (..._args) => {
-    const decorated = decorators.reduce((args, fn) => fn(args), _args);
+    const decorated = decorators.reduce((args, storyFn) => storyFn(args), _args);
     actionCallback(...decorated);
   };
 }
diff --git a/addons/actions/src/preview/withActions.js b/addons/actions/src/preview/withActions.js
index 106659b936b..42731a9386e 100644
--- a/addons/actions/src/preview/withActions.js
+++ b/addons/actions/src/preview/withActions.js
@@ -56,11 +56,11 @@ const actionsSubscription = (...args) => {
   return lastSubscription;
 };
 
-export const createDecorator = actionsFn => (...args) => story => {
+export const createDecorator = actionsFn => (...args) => storyFn => {
   if (root != null) {
     addons.getChannel().emit(Events.REGISTER_SUBSCRIPTION, actionsSubscription(actionsFn, ...args));
   }
-  return story();
+  return storyFn();
 };
 
 export default createDecorator(actions);
diff --git a/addons/centered/src/html.js b/addons/centered/src/html.js
index 8060fabcee0..88e3e8ab4b7 100644
--- a/addons/centered/src/html.js
+++ b/addons/centered/src/html.js
@@ -31,15 +31,15 @@ export default function(storyFn) {
   const wrapper = getWrapperDiv();
   wrapper.appendChild(inner);
 
-  const component = storyFn();
+  const element = storyFn();
 
-  if (typeof component === 'string') {
-    inner.innerHTML = component;
-  } else if (component instanceof Node) {
+  if (typeof element === 'string') {
+    inner.innerHTML = element;
+  } else if (element instanceof Node) {
     inner.innerHTML = '';
-    inner.appendChild(component);
+    inner.appendChild(element);
   } else {
-    return component;
+    return element;
   }
 
   return wrapper;
diff --git a/addons/events/src/index.js b/addons/events/src/index.js
index 5b12b24b3f3..31eb1960e36 100644
--- a/addons/events/src/index.js
+++ b/addons/events/src/index.js
@@ -39,9 +39,9 @@ export default options => {
   if (options.children) {
     return WithEvents(options);
   }
-  return story => {
+  return storyFn => {
     addEvents(options);
-    return story();
+    return storyFn();
   };
 };
 
diff --git a/addons/jest/src/index.js b/addons/jest/src/index.js
index 26db47c5960..8d41d435bab 100644
--- a/addons/jest/src/index.js
+++ b/addons/jest/src/index.js
@@ -38,14 +38,14 @@ export const withTests = userOptions => {
 
   return (...args) => {
     if (typeof args[0] === 'string') {
-      return deprecate((story, { kind }) => {
-        emitAddTests({ kind, story, testFiles: args, options });
+      return deprecate((storyFn, { kind }) => {
+        emitAddTests({ kind, story: storyFn, testFiles: args, options });
 
-        return story();
+        return storyFn();
       }, 'Passing component filenames to the `@storybook/addon-jest` via `withTests` is deprecated. Instead, use the `jest` story parameter');
     }
 
-    const [story, { kind, parameters = {} }] = args;
+    const [storyFn, { kind, parameters = {} }] = args;
     let { jest: testFiles } = parameters;
 
     if (typeof testFiles === 'string') {
@@ -53,10 +53,10 @@ export const withTests = userOptions => {
     }
 
     if (testFiles && !testFiles.disable) {
-      emitAddTests({ kind, story, testFiles, options });
+      emitAddTests({ kind, story: storyFn, testFiles, options });
     }
 
-    return story();
+    return storyFn();
   };
 };
 
diff --git a/addons/links/src/preview.js b/addons/links/src/preview.js
index 938380e90ba..816426e449d 100644
--- a/addons/links/src/preview.js
+++ b/addons/links/src/preview.js
@@ -55,8 +55,8 @@ const off = () => {
   }
 };
 
-export const withLinks = story => {
+export const withLinks = storyFn => {
   on();
   addons.getChannel().once(STORY_CHANGED, off);
-  return story();
+  return storyFn();
 };
diff --git a/addons/storyshots/storyshots-core/src/api/index.js b/addons/storyshots/storyshots-core/src/api/index.js
index dcb833af3b3..a764f0a26b2 100644
--- a/addons/storyshots/storyshots-core/src/api/index.js
+++ b/addons/storyshots/storyshots-core/src/api/index.js
@@ -48,7 +48,7 @@ function testStorySnapshots(options = {}) {
     .filter(({ name }) => (storyNameRegex ? name.match(storyNameRegex) : true))
     .filter(({ kind }) => (storyKindRegex ? kind.match(storyKindRegex) : true))
     .reduce((acc, item) => {
-      const { kind, story: render, parameters } = item;
+      const { kind, storyFn: render, parameters } = item;
       const existing = acc.find(i => i.kind === kind);
       const { fileName } = item.parameters;
 
diff --git a/addons/storyshots/storyshots-core/src/frameworks/riot/renderTree.js b/addons/storyshots/storyshots-core/src/frameworks/riot/renderTree.js
index 77f81e12fa3..c95ccf8ff7f 100644
--- a/addons/storyshots/storyshots-core/src/frameworks/riot/renderTree.js
+++ b/addons/storyshots/storyshots-core/src/frameworks/riot/renderTree.js
@@ -13,9 +13,9 @@ function bootstrapADocumentAndReturnANode() {
 function makeSureThatResultIsRenderedSomehow({ context, result, rootElement }) {
   if (!rootElement.firstChild) {
     riotForStorybook.render({
-      story: () => result,
+      storyFn: () => result,
       selectedKind: context.kind,
-      selectedStory: context.story,
+      selectedStory: context.name,
     });
   }
 }
diff --git a/addons/storysource/src/preview.js b/addons/storysource/src/preview.js
index 7b516ff5368..1aa601caa95 100644
--- a/addons/storysource/src/preview.js
+++ b/addons/storysource/src/preview.js
@@ -17,8 +17,8 @@ function setStorySource(context, source, locationsMap) {
 }
 
 export function withStorySource(source, locationsMap = {}) {
-  return (story, context) => {
+  return (storyFn, context) => {
     setStorySource(context, source, locationsMap);
-    return story();
+    return storyFn();
   };
 }
diff --git a/app/angular/src/client/preview/angular/helpers.ts b/app/angular/src/client/preview/angular/helpers.ts
index 7d5df639c1c..f5e218d75b3 100644
--- a/app/angular/src/client/preview/angular/helpers.ts
+++ b/app/angular/src/client/preview/angular/helpers.ts
@@ -4,7 +4,7 @@ import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
 import { BrowserModule } from '@angular/platform-browser';
 import { AppComponent } from './components/app.component';
 import { STORY } from './app.token';
-import { NgModuleMetadata, IGetStory, NgStory } from './types';
+import { NgModuleMetadata, IStoryFn, NgStory } from './types';
 
 let platform: any = null;
 let promises: Array<Promise<NgModuleRef<any>>> = [];
@@ -40,8 +40,8 @@ const createComponentFromTemplate = (template: string, styles: string[]) => {
   })(componentClass);
 };
 
-const initModule = (currentStory: IGetStory) => {
-  const storyObj = currentStory();
+const initModule = (storyFn: IStoryFn) => {
+  const storyObj = storyFn();
   const { component, template, props, styles, moduleMetadata = {} } = storyObj;
 
   let AnnotatedComponent = template ? createComponentFromTemplate(template, styles) : component;
@@ -80,6 +80,6 @@ const draw = (newModule: DynamicComponentType): void => {
   }
 };
 
-export const renderNgApp = (story: IGetStory) => {
-  draw(initModule(story));
+export const renderNgApp = (storyFn: IStoryFn) => {
+  draw(initModule(storyFn));
 };
diff --git a/app/angular/src/client/preview/angular/types.ts b/app/angular/src/client/preview/angular/types.ts
index 317aa02a9bd..0633eabea0e 100644
--- a/app/angular/src/client/preview/angular/types.ts
+++ b/app/angular/src/client/preview/angular/types.ts
@@ -19,4 +19,4 @@ export interface NgStory {
   styles?: string[];
 }
 
-export type IGetStory = () => NgStory;
+export type IStoryFn = () => NgStory;
diff --git a/app/angular/src/client/preview/render.js b/app/angular/src/client/preview/render.js
index 9b0b027d0c3..c191b41d078 100644
--- a/app/angular/src/client/preview/render.js
+++ b/app/angular/src/client/preview/render.js
@@ -1,6 +1,6 @@
 import { renderNgApp } from './angular/helpers';
 
-export default function render({ story, showMain }) {
+export default function render({ storyFn, showMain }) {
   showMain();
-  renderNgApp(story);
+  renderNgApp(storyFn);
 }
diff --git a/app/ember/src/client/preview/render.js b/app/ember/src/client/preview/render.js
index f9c1ba6e0a2..ec81aaea2e3 100644
--- a/app/ember/src/client/preview/render.js
+++ b/app/ember/src/client/preview/render.js
@@ -50,8 +50,15 @@ function render(options, el) {
     });
 }
 
-export default function renderMain({ story, selectedKind, selectedStory, showMain, showError }) {
-  const element = story();
+export default function renderMain({
+  storyFn,
+  selectedKind,
+  selectedStory,
+  showMain,
+  showError,
+  // forceRender,
+}) {
+  const element = storyFn();
 
   if (!element) {
     showError({
diff --git a/app/html/src/client/preview/render.js b/app/html/src/client/preview/render.js
index db2632aa91e..a3898b72346 100644
--- a/app/html/src/client/preview/render.js
+++ b/app/html/src/client/preview/render.js
@@ -4,25 +4,25 @@ import { stripIndents } from 'common-tags';
 const rootElement = document.getElementById('root');
 
 export default function renderMain({
-  story,
+  storyFn,
   selectedKind,
   selectedStory,
   showMain,
   showError,
   forceRender,
 }) {
-  const component = story();
+  const element = storyFn();
 
   showMain();
-  if (typeof component === 'string') {
-    rootElement.innerHTML = component;
-  } else if (component instanceof Node) {
+  if (typeof element === 'string') {
+    rootElement.innerHTML = element;
+  } else if (element instanceof Node) {
     if (forceRender === true) {
       return;
     }
 
     rootElement.innerHTML = '';
-    rootElement.appendChild(component);
+    rootElement.appendChild(element);
   } else {
     showError({
       title: `Expecting an HTML snippet or DOM node from the story: "${selectedStory}" of "${selectedKind}".`,
diff --git a/app/marko/src/client/preview/render.js b/app/marko/src/client/preview/render.js
index 50b892aaaf7..9b63a431743 100644
--- a/app/marko/src/client/preview/render.js
+++ b/app/marko/src/client/preview/render.js
@@ -4,8 +4,15 @@ import { stripIndents } from 'common-tags';
 const rootEl = document.getElementById('root');
 let currLoadedComponent = null; // currently loaded marko widget!
 
-export default function renderMain({ story, selectedKind, selectedStory, showMain, showError }) {
-  const element = story();
+export default function renderMain({
+  storyFn,
+  selectedKind,
+  selectedStory,
+  showMain,
+  showError,
+  // forceRender,
+}) {
+  const element = storyFn();
 
   // We need to unmount the existing set of components in the DOM node.
   if (currLoadedComponent) {
diff --git a/app/mithril/src/client/preview/render.js b/app/mithril/src/client/preview/render.js
index 39b14981cda..1760e37ab7f 100644
--- a/app/mithril/src/client/preview/render.js
+++ b/app/mithril/src/client/preview/render.js
@@ -6,8 +6,15 @@ import { stripIndents } from 'common-tags';
 
 const rootEl = document.getElementById('root');
 
-export default function renderMain({ story, selectedKind, selectedStory, showMain, showError }) {
-  const element = story();
+export default function renderMain({
+  storyFn,
+  selectedKind,
+  selectedStory,
+  showMain,
+  showError,
+  // forceRender,
+}) {
+  const element = storyFn();
 
   if (!element) {
     const error = {
diff --git a/app/polymer/src/client/preview/render.js b/app/polymer/src/client/preview/render.js
index 6fbbe908c21..c290eb4dc37 100644
--- a/app/polymer/src/client/preview/render.js
+++ b/app/polymer/src/client/preview/render.js
@@ -5,16 +5,16 @@ import { html, render, TemplateResult } from 'lit-html';
 const rootElement = document.getElementById('root');
 
 export default function renderMain({
-  story,
+  storyFn,
   selectedKind,
   selectedStory,
   showMain,
   showError,
   forceRender,
 }) {
-  const component = story();
+  const element = storyFn();
 
-  if (!component) {
+  if (!element) {
     showError({
       title: `Expecting a Polymer component from the story: "${selectedStory}" of "${selectedKind}".`,
       description: stripIndents`
@@ -26,18 +26,18 @@ export default function renderMain({
   }
 
   showMain();
-  if (typeof component === 'string') {
-    rootElement.innerHTML = component;
-  } else if (component instanceof TemplateResult) {
+  if (typeof element === 'string') {
+    rootElement.innerHTML = element;
+  } else if (element instanceof TemplateResult) {
     // `render` stores the TemplateInstance in the Node and tries to update based on that.
     // Since we reuse `rootElement` for all stories, remove the stored instance first.
     // But forceRender means that it's the same story, so we want too keep the state in that case.
     if (!forceRender) {
       render(html``, rootElement);
     }
-    render(component, rootElement);
+    render(element, rootElement);
   } else {
     rootElement.innerHTML = '';
-    rootElement.appendChild(component);
+    rootElement.appendChild(element);
   }
 }
diff --git a/app/preact/src/client/preview/render.js b/app/preact/src/client/preview/render.js
index 964c606470c..edb9cf188f9 100644
--- a/app/preact/src/client/preview/render.js
+++ b/app/preact/src/client/preview/render.js
@@ -6,8 +6,15 @@ import { stripIndents } from 'common-tags';
 let renderedStory;
 const rootElement = document ? document.getElementById('root') : null;
 
-export default function renderMain({ story, selectedKind, selectedStory, showMain, showError }) {
-  const element = story();
+export default function renderMain({
+  storyFn,
+  selectedKind,
+  selectedStory,
+  showMain,
+  showError,
+  // forceRender,
+}) {
+  const element = storyFn();
 
   if (!element) {
     showError({
diff --git a/app/react/src/client/preview/render.js b/app/react/src/client/preview/render.js
index d4bd2627c16..8ba7d5cc11a 100644
--- a/app/react/src/client/preview/render.js
+++ b/app/react/src/client/preview/render.js
@@ -14,14 +14,14 @@ function render(node, el) {
 }
 
 export default function renderMain({
-  story,
+  storyFn,
   selectedKind,
   selectedStory,
   showMain,
   showError,
   forceRender,
 }) {
-  const element = story();
+  const element = storyFn();
 
   if (!element) {
     showError({
diff --git a/app/riot/src/client/preview/render.js b/app/riot/src/client/preview/render.js
index e332210d03c..1e8651d3f79 100644
--- a/app/riot/src/client/preview/render.js
+++ b/app/riot/src/client/preview/render.js
@@ -4,7 +4,7 @@ import { unregister } from 'riot';
 import { render as renderRiot } from './rendering';
 
 export default function renderMain({
-  story,
+  storyFn,
   selectedKind,
   selectedStory,
   showMain = () => {},
@@ -15,9 +15,9 @@ export default function renderMain({
   const rootElement = document.getElementById('root');
   rootElement.innerHTML = '';
   rootElement.dataset.is = 'root';
-  const component = story();
-  const rendered = renderRiot(component);
-  if (!rendered)
+  const element = storyFn();
+  const rendered = renderRiot(element);
+  if (!rendered) {
     showError({
       title: `Expecting a riot snippet or a riot component from the story: "${selectedStory}" of "${selectedKind}".`,
       description: stripIndents`
@@ -25,5 +25,6 @@ export default function renderMain({
         Use "() => <your snippet or node>" or when defining the story.
       `,
     });
+  }
   return rendered;
 }
diff --git a/app/svelte/src/client/preview/render.js b/app/svelte/src/client/preview/render.js
index a5e1f85d259..4c80f788f1f 100644
--- a/app/svelte/src/client/preview/render.js
+++ b/app/svelte/src/client/preview/render.js
@@ -42,7 +42,7 @@ function mountView({ Component, target, data, on, Wrapper, WrapperData }) {
 }
 
 export default function render({
-  story,
+  storyFn,
   selectedKind,
   selectedStory,
   showMain,
@@ -58,7 +58,7 @@ export default function render({
     on,
     Wrapper,
     WrapperData,
-  } = story();
+  } = storyFn();
 
   cleanUpPreviousStory();
 
diff --git a/app/vue/src/client/preview/render.js b/app/vue/src/client/preview/render.js
index e3227b3e71f..93072b8071b 100644
--- a/app/vue/src/client/preview/render.js
+++ b/app/vue/src/client/preview/render.js
@@ -18,7 +18,7 @@ const root = new Vue({
 });
 
 export default function render({
-  story,
+  storyFn,
   selectedKind,
   selectedStory,
   showMain,
@@ -28,9 +28,9 @@ export default function render({
 }) {
   Vue.config.errorHandler = showException;
 
-  const component = story();
+  const element = storyFn();
 
-  if (!component) {
+  if (!element) {
     showError({
       title: `Expecting a Vue component from the story: "${selectedStory}" of "${selectedKind}".`,
       description: stripIndents`
@@ -45,10 +45,10 @@ export default function render({
 
   // at component creation || refresh by HMR
   if (!root[COMPONENT] || !forceRender) {
-    root[COMPONENT] = component;
+    root[COMPONENT] = element;
   }
 
-  root[VALUES] = component.options[VALUES];
+  root[VALUES] = element.options[VALUES];
 
   if (!root.$el) {
     root.$mount('#root');
diff --git a/docs/.storybook/config.js b/docs/.storybook/config.js
index ac173268f49..85850bef9c4 100644
--- a/docs/.storybook/config.js
+++ b/docs/.storybook/config.js
@@ -5,7 +5,7 @@ import { MemoryRouter } from 'react-router';
 import 'bootstrap/dist/css/bootstrap.css';
 import '../src/css/main.css';
 
-addDecorator(story => <MemoryRouter>{story()}</MemoryRouter>);
+addDecorator(storyFn => <MemoryRouter>{storyFn()}</MemoryRouter>);
 
 function loadStories() {
   require('../src/stories');
diff --git a/docs/src/pages/basics/writing-stories/index.md b/docs/src/pages/basics/writing-stories/index.md
index 20d87e9ad06..1a6167ad0b9 100644
--- a/docs/src/pages/basics/writing-stories/index.md
+++ b/docs/src/pages/basics/writing-stories/index.md
@@ -79,7 +79,7 @@ import { storiesOf } from '@storybook/react';
 import MyComponent from '../my_component';
 
 storiesOf('MyComponent', module)
-  .addDecorator(story => <div style={{ textAlign: 'center' }}>{story()}</div>)
+  .addDecorator(storyFn => <div style={{ textAlign: 'center' }}>{storyFn()}</div>)
   .add('without props', () => <MyComponent />)
   .add('with some props', () => <MyComponent text="The Comp" />);
 ```
@@ -92,7 +92,7 @@ It is possible to apply a decorator **globally** to all the stories. Here is an
 import React from 'react';
 import { configure, addDecorator } from '@storybook/react';
 
-addDecorator(story => <div style={{ textAlign: 'center' }}>{story()}</div>);
+addDecorator(storyFn => <div style={{ textAlign: 'center' }}>{storyFn()}</div>);
 
 configure(function() {
   // ...
diff --git a/examples/html-kitchen-sink/stories/addon-events.stories.js b/examples/html-kitchen-sink/stories/addon-events.stories.js
index 954f7eeea87..5da5b3b9c38 100644
--- a/examples/html-kitchen-sink/stories/addon-events.stories.js
+++ b/examples/html-kitchen-sink/stories/addon-events.stories.js
@@ -85,9 +85,9 @@ storiesOf('Addons|Events', module)
       ],
     })
   )
-  .addDecorator(story => {
+  .addDecorator(storyFn => {
     addons.getChannel().emit(CoreEvents.REGISTER_SUBSCRIPTION, subscription);
-    return story();
+    return storyFn();
   })
   .add(
     'Logger',
diff --git a/examples/official-storybook/config.js b/examples/official-storybook/config.js
index fcf28e6631e..9c3a6b3351e 100644
--- a/examples/official-storybook/config.js
+++ b/examples/official-storybook/config.js
@@ -33,10 +33,10 @@ addDecorator(withCssResources);
 addDecorator(withA11Y);
 addDecorator(withNotes);
 
-addDecorator(fn => (
+addDecorator(storyFn => (
   <ThemeProvider theme={themes.normal}>
     <Global styles={createGlobal} />
-    {fn()}
+    {storyFn()}
   </ThemeProvider>
 ));
 
diff --git a/examples/official-storybook/stories/addon-events.stories.js b/examples/official-storybook/stories/addon-events.stories.js
index afa8dde8ad7..8c17d0a917a 100644
--- a/examples/official-storybook/stories/addon-events.stories.js
+++ b/examples/official-storybook/stories/addon-events.stories.js
@@ -83,9 +83,9 @@ storiesOf('Addons|Events.deprecated', module)
       selectedPanel: 'storybook/events/panel',
     },
   })
-  .addDecorator(story => (
+  .addDecorator(storyFn => (
     <WithEvents emit={emit} events={events}>
-      {story()}
+      {storyFn()}
     </WithEvents>
   ))
   .add('Logger', () => <Logger emitter={emitter} />);
diff --git a/examples/official-storybook/stories/addon-links.stories.js b/examples/official-storybook/stories/addon-links.stories.js
index b2d00fb7379..c5f6a148ba6 100644
--- a/examples/official-storybook/stories/addon-links.stories.js
+++ b/examples/official-storybook/stories/addon-links.stories.js
@@ -49,10 +49,10 @@ storiesOf('Addons|Links.Href', module).add(
 );
 
 storiesOf('Addons|Links.Scroll position', module)
-  .addDecorator(story => (
+  .addDecorator(storyFn => (
     <Fragment>
       <div style={{ marginBottom: '100vh' }}>Scroll down to see the link</div>
-      {story()}
+      {storyFn()}
     </Fragment>
   ))
   .add('First', () => <LinkTo story="Second">Go to Second</LinkTo>)
diff --git a/examples/polymer-cli/src/stories/custom-decorators.stories.js b/examples/polymer-cli/src/stories/custom-decorators.stories.js
index c2ef4cdf3dd..158b8be733c 100644
--- a/examples/polymer-cli/src/stories/custom-decorators.stories.js
+++ b/examples/polymer-cli/src/stories/custom-decorators.stories.js
@@ -2,8 +2,8 @@ import { storiesOf } from '@storybook/polymer';
 import { document } from 'global';
 
 storiesOf('Custom|Decorator', module)
-  .addDecorator(story => {
-    const el = story();
+  .addDecorator(storyFn => {
+    const el = storyFn();
     el.setAttribute('title', `${el.getAttribute('title')} - decorated`);
     return el;
   })
diff --git a/examples/vue-kitchen-sink/src/stories/custom-decorators.stories.js b/examples/vue-kitchen-sink/src/stories/custom-decorators.stories.js
index 3ff25608877..3c3a022d3cd 100644
--- a/examples/vue-kitchen-sink/src/stories/custom-decorators.stories.js
+++ b/examples/vue-kitchen-sink/src/stories/custom-decorators.stories.js
@@ -3,9 +3,9 @@ import { storiesOf } from '@storybook/vue';
 import MyButton from './Button.vue';
 
 storiesOf('Custom|Decorator for Vue', module)
-  .addDecorator(story => {
-    // Decorated with story function
-    const WrapButton = story();
+  .addDecorator(storyFn => {
+    // Decorated with story-function
+    const WrapButton = storyFn();
     return {
       components: { WrapButton },
       template: '<div :style="{ border: borderStyle }"><wrap-button/></div>',
diff --git a/lib/client-api/src/client_api.js b/lib/client-api/src/client_api.js
index d72d859ed1a..00af49f1697 100644
--- a/lib/client-api/src/client_api.js
+++ b/lib/client-api/src/client_api.js
@@ -4,7 +4,6 @@ import isPlainObject from 'is-plain-object';
 import { logger } from '@storybook/client-logger';
 import addons from '@storybook/addons';
 import Events from '@storybook/core-events';
-import memoize from 'memoizerific';
 import mergeWith from 'lodash.mergewith';
 import isEqual from 'lodash.isequal';
 
@@ -31,7 +30,7 @@ const merge = (a, b) =>
     return undefined;
   });
 
-export const defaultDecorateStory = (getStory, decorators) =>
+export const defaultDecorateStory = (storyFn, decorators) =>
   decorators.reduce(
     (decorated, decorator) => (context = {}) =>
       decorator(
@@ -47,7 +46,7 @@ export const defaultDecorateStory = (getStory, decorators) =>
           ),
         context
       ),
-    getStory
+    storyFn
   );
 
 const metaSubscription = () => {
@@ -57,7 +56,9 @@ const metaSubscription = () => {
 };
 
 const withSubscriptionTracking = storyFn => {
-  if (!addons.hasChannel()) return storyFn();
+  if (!addons.hasChannel()) {
+    return storyFn();
+  }
   subscriptionsStore.markAllAsUnused();
   subscriptionsStore.register(metaSubscription);
   const result = storyFn();
@@ -145,7 +146,7 @@ export default class ClientApi {
       };
     });
 
-    api.add = (storyName, getStory, parameters) => {
+    api.add = (storyName, storyFn, parameters) => {
       const { _globalParameters, _globalDecorators } = this;
       const id = toId(kind, storyName);
 
@@ -159,11 +160,6 @@ export default class ClientApi {
         });
       }
 
-      // Wrap the getStory function with each decorator. The first
-      // decorator will wrap the story function. The second will
-      // wrap the first decorator and so on.
-      const decorators = [...localDecorators, ..._globalDecorators, withSubscriptionTracking];
-
       const fileName = m ? m.id : null;
 
       const { hierarchyRootSeparator = '|', hierarchySeparator = /\/|\./ } = this.getSeparators();
@@ -196,15 +192,19 @@ export default class ClientApi {
         { fileName }
       );
 
-      this._storyStore.addStory({
-        id,
-        kind,
-        name: storyName,
-        story: getStory,
-        // lazily decorate the story when it's loaded
-        getDecorated: memoize(1)(() => this._decorateStory(getStory, decorators)),
-        parameters: allParam,
-      });
+      this._storyStore.addStory(
+        {
+          id,
+          kind,
+          name: storyName,
+          storyFn,
+          parameters: allParam,
+        },
+        {
+          applyDecorators: this._decorateStory,
+          getDecorators: () => [...localDecorators, ..._globalDecorators, withSubscriptionTracking],
+        }
+      );
       return api;
     };
 
@@ -221,8 +221,8 @@ export default class ClientApi {
     return api;
   };
 
+  // legacy
   getStorybook = () =>
-    // TODO: this could all be 1 call
     this._storyStore.getStoryKinds().map(kind => {
       const fileName = this._storyStore.getStoryFileName(kind);
 
diff --git a/lib/client-api/src/client_api.test.js b/lib/client-api/src/client_api.test.js
index 20ec7c9db80..ebf4d99b191 100644
--- a/lib/client-api/src/client_api.test.js
+++ b/lib/client-api/src/client_api.test.js
@@ -123,7 +123,7 @@ describe('preview.client_api', () => {
         .addDecorator(fn => `aa-${fn()}`)
         .add('name', () => 'Hello');
 
-      expect(storyStore.fromId('kind--name').story()).toBe('aa-Hello');
+      expect(storyStore.fromId('kind--name').storyFn()).toBe('aa-Hello');
     });
 
     it('should add global decorators', () => {
@@ -136,7 +136,7 @@ describe('preview.client_api', () => {
 
       storiesOf('kind', module).add('name', () => 'Hello');
 
-      expect(storyStore.fromId('kind--name').story()).toBe('bb-Hello');
+      expect(storyStore.fromId('kind--name').storyFn()).toBe('bb-Hello');
     });
 
     it('should utilize both decorators at once', () => {
@@ -151,7 +151,7 @@ describe('preview.client_api', () => {
         .addDecorator(fn => `bb-${fn()}`)
         .add('name', () => 'Hello');
 
-      expect(storyStore.fromId('kind--name').story()).toBe('aa-bb-Hello');
+      expect(storyStore.fromId('kind--name').storyFn()).toBe('aa-bb-Hello');
     });
 
     it('should pass the context', () => {
@@ -164,7 +164,7 @@ describe('preview.client_api', () => {
         .addDecorator(fn => `aa-${fn()}`)
         .add('name', c => `${c.kind}-${c.name}`);
 
-      const result = storyStore.fromId('kind--name').story();
+      const result = storyStore.fromId('kind--name').storyFn();
       expect(result).toBe(`aa-kind-name`);
     });
 
@@ -178,7 +178,7 @@ describe('preview.client_api', () => {
         .addDecorator((fn, { kind, name }) => `${kind}-${name}-${fn()}`)
         .add('name', () => 'Hello');
 
-      const result = storyStore.fromId('kind--name').story();
+      const result = storyStore.fromId('kind--name').storyFn();
       expect(result).toBe(`kind-name-Hello`);
     });
   });
@@ -252,8 +252,8 @@ describe('preview.client_api', () => {
         clientApi: { getStorybook, storiesOf },
       } = getContext();
 
-      const story = jest.fn();
-      storiesOf('kind', { id: 'foo.js' }).add('name', story);
+      const fn = jest.fn();
+      storiesOf('kind', { id: 'foo.js' }).add('name', fn);
 
       const storybook = getStorybook();
 
diff --git a/lib/client-api/src/story_store.js b/lib/client-api/src/story_store.js
index bf140005c05..b7dce29d0bb 100644
--- a/lib/client-api/src/story_store.js
+++ b/lib/client-api/src/story_store.js
@@ -2,10 +2,13 @@
 import { history, document } from 'global';
 import EventEmitter from 'eventemitter3';
 import qs from 'qs';
-import Events from '@storybook/core-events';
-import { logger } from '@storybook/client-logger';
+import memoize from 'memoizerific';
 import debounce from 'lodash.debounce';
 import { stripIndents } from 'common-tags';
+
+import Events from '@storybook/core-events';
+import { logger } from '@storybook/client-logger';
+
 import toId from './id';
 import pathToId from './pathToId';
 
@@ -93,10 +96,7 @@ export default class StoryStore extends EventEmitter {
         return null;
       }
 
-      return {
-        ...data,
-        story: p => data.getDecorated()({ ...data, parameters: { ...data.parameters, ...p } }),
-      };
+      return data;
     } catch (e) {
       logger.warn('failed to get story:', this._data);
       logger.error(e);
@@ -134,28 +134,48 @@ export default class StoryStore extends EventEmitter {
     delete _data[id];
   };
 
-  addStory({ id, kind, name: storyName, story, getDecorated, parameters = {} }) {
+  addStory(
+    { id, kind, name, storyFn: original, parameters = {} },
+    { getDecorators, applyDecorators }
+  ) {
     const { _data } = this;
 
     if (_data[id]) {
       logger.warn(stripIndents`
-      Story with id ${id} already exists in the store!
+        Story with id ${id} already exists in the store!
 
-      Perhaps you added the same story twice, or you have a name collision?
-      Story ids need to be unique -- ensure you aren't using the same names modolo url-sanitization.`);
+        Perhaps you added the same story twice, or you have a name collision?
+        Story ids need to be unique -- ensure you aren't using the same names modolo url-sanitization.
+      `);
     }
 
-    _data[id] = toChild({
-      kind,
-      name: storyName,
-      story,
-      getDecorated,
-      parameters,
+    const identification = {
       id,
+      kind,
+      name,
+      story: name, // legacy
+    };
+
+    // immutable original storyFn
+    const getOriginal = () => original;
+
+    // lazily decorate the story when it's loaded
+    const getDecorated = memoize(1)(() => applyDecorators(getOriginal(), getDecorators()));
+
+    const storyFn = p => getDecorated()({ ...identification, parameters: { ...parameters, ...p } });
+
+    _data[id] = toChild({
+      ...identification,
+
+      getDecorated,
+      getOriginal,
+      storyFn,
+
+      parameters,
     });
 
     // LEGACY DATA
-    this.addLegacyStory({ kind, name: storyName, story, getDecorated, parameters });
+    this.addLegacyStory({ kind, name, storyFn, parameters });
 
     // LET'S SEND IT TO THE MANAGER
     this.pushToManager();
@@ -179,7 +199,7 @@ export default class StoryStore extends EventEmitter {
     this._revision += 1;
   }
 
-  addLegacyStory({ kind, name, getDecorated, parameters = {} }) {
+  addLegacyStory({ kind, name, storyFn, parameters = {} }) {
     const k = toKey(kind);
     if (!this._legacydata[k]) {
       this._legacydata[k] = {
@@ -194,7 +214,7 @@ export default class StoryStore extends EventEmitter {
       name,
       // kind,
       index: getId(),
-      fn: (...args) => getDecorated()(...args),
+      story: storyFn,
       parameters,
     };
   }
@@ -243,9 +263,9 @@ export default class StoryStore extends EventEmitter {
       return null;
     }
 
-    const { fn, parameters } = storyInfo;
+    const { story, parameters } = storyInfo;
     return {
-      story: fn,
+      story,
       parameters,
     };
   }
@@ -261,13 +281,8 @@ export default class StoryStore extends EventEmitter {
       return null;
     }
 
-    const { story, parameters } = data;
-    return () =>
-      story({
-        kind,
-        story: name,
-        parameters,
-      });
+    const { story } = data;
+    return () => story();
   }
 
   removeStoryKind(kind) {
diff --git a/lib/client-api/src/story_store.test.js b/lib/client-api/src/story_store.test.js
index 59d96ca8ef9..fdf93daff1e 100644
--- a/lib/client-api/src/story_store.test.js
+++ b/lib/client-api/src/story_store.test.js
@@ -3,6 +3,7 @@ import createChannel from '@storybook/channel-postmessage';
 import Events from '@storybook/core-events';
 
 import StoryStore from './story_store';
+import { defaultDecorateStory } from './client_api';
 import toId from './id';
 
 jest.mock('global', () => ({
@@ -21,22 +22,27 @@ jest.mock('global', () => ({
 
 const channel = createChannel({ page: 'preview' });
 
-const make = (kind, name, story, parameters = {}) => ({
-  kind,
-  name,
-  story,
-  getDecorated: () => story,
-  parameters,
-  id: toId(kind, name),
-});
+const make = (kind, name, storyFn, parameters = {}) => [
+  {
+    kind,
+    name,
+    storyFn,
+    parameters,
+    id: toId(kind, name),
+  },
+  {
+    applyDecorators: defaultDecorateStory,
+    getDecorators: () => [],
+  },
+];
 
 describe('preview.story_store', () => {
   describe('raw storage', () => {
     it('stores hash object', () => {
       const store = new StoryStore({ channel });
-      store.addStory(make('a', '1', () => 0));
-      store.addStory(make('a', '2', () => 0));
-      store.addStory(make('b', '1', () => 0));
+      store.addStory(...make('a', '1', () => 0));
+      store.addStory(...make('a', '2', () => 0));
+      store.addStory(...make('b', '1', () => 0));
 
       const extracted = store.extract();
 
@@ -62,10 +68,10 @@ describe('preview.story_store', () => {
     it('should return storybook with stories', () => {
       const store = new StoryStore({ channel });
 
-      store.addStory(make('kind-1', 'story-1.1', () => 0));
-      store.addStory(make('kind-1', 'story-1.2', () => 0));
-      store.addStory(make('kind-2', 'story-2.1', () => 0));
-      store.addStory(make('kind-2', 'story-2.2', () => 0));
+      store.addStory(...make('kind-1', 'story-1.1', () => 0));
+      store.addStory(...make('kind-1', 'story-1.2', () => 0));
+      store.addStory(...make('kind-2', 'story-2.1', () => 0));
+      store.addStory(...make('kind-2', 'story-2.2', () => 0));
 
       expect(store.dumpStoryBook()).toEqual([
         {
@@ -83,9 +89,9 @@ describe('preview.story_store', () => {
   describe('getStoryFileName', () => {
     it('should return the filename of the first story passed for the kind', () => {
       const store = new StoryStore({ channel });
-      store.addStory(make('kind-1', 'story-1.1', () => 0, { fileName: 'foo.js' }));
-      store.addStory(make('kind-1', 'story-1.2', () => 0, { fileName: 'foo-2.js' }));
-      store.addStory(make('kind-2', 'story-2.1', () => 0, { fileName: 'bar.js' }));
+      store.addStory(...make('kind-1', 'story-1.1', () => 0, { fileName: 'foo.js' }));
+      store.addStory(...make('kind-1', 'story-1.2', () => 0, { fileName: 'foo-2.js' }));
+      store.addStory(...make('kind-2', 'story-2.1', () => 0, { fileName: 'bar.js' }));
 
       expect(store.getStoryFileName('kind-1')).toBe('foo.js');
       expect(store.getStoryFileName('kind-2')).toBe('bar.js');
@@ -107,7 +113,7 @@ describe('preview.story_store', () => {
         fileName: 'foo.js',
         parameter: 'value',
       };
-      store.addStory(make('kind', 'name', story, parameters));
+      store.addStory(...make('kind', 'name', story, parameters));
 
       expect(store.getStoryAndParameters('kind', 'name').parameters).toEqual(parameters);
     });
@@ -116,16 +122,18 @@ describe('preview.story_store', () => {
   describe('getStoryWithContext', () => {
     it('should return a function that calls the story with the context', () => {
       const store = new StoryStore({ channel });
-      const story = jest.fn();
+      const storyFn = jest.fn();
       const parameters = {
         fileName: 'foo.js',
         parameter: 'value',
       };
-      store.addStory(make('kind', 'name', story, parameters));
+      store.addStory(...make('kind', 'name', storyFn, parameters));
 
       const storyWithContext = store.getStoryWithContext('kind', 'name');
       storyWithContext();
-      expect(story).toHaveBeenCalledWith({
+      expect(storyFn).toHaveBeenCalledWith({
+        id: 'kind--name',
+        name: 'name',
         kind: 'kind',
         story: 'name',
         parameters,
@@ -143,8 +151,7 @@ describe('preview.story_store', () => {
   });
 
   describe('STORY_INIT', () => {
-    const story = () => 0;
-    const storyBundle = make('kind', 'story', story);
+    const storyFn = () => 0;
 
     it('supports path params', () => {
       document.location = {
@@ -152,27 +159,28 @@ describe('preview.story_store', () => {
         search: '?path=/story/kind--story&bar=baz',
       };
       const store = new StoryStore({ channel });
-      store.addStory(storyBundle);
+      store.addStory(...make('kind', 'story', storyFn));
       store.setSelection = jest.fn();
 
       store.emit(Events.STORY_INIT);
       expect(history.replaceState).toHaveBeenCalledWith({}, '', 'pathname?bar=baz&id=kind--story');
       expect(store.setSelection).toHaveBeenCalled();
-      expect(store.setSelection.mock.calls[0][0].getDecorated()).toEqual(story);
+      expect(store.setSelection.mock.calls[0][0].getDecorated()).toEqual(storyFn);
     });
+
     it('supports story kind/name params', () => {
       document.location = {
         pathname: 'pathname',
         search: '?selectedKind=kind&selectedStory=story&bar=baz',
       };
       const store = new StoryStore({ channel });
-      store.addStory(storyBundle);
+      store.addStory(...make('kind', 'story', storyFn));
       store.setSelection = jest.fn();
 
       store.emit(Events.STORY_INIT);
       expect(history.replaceState).toHaveBeenCalledWith({}, '', 'pathname?bar=baz&id=kind--story');
       expect(store.setSelection).toHaveBeenCalled();
-      expect(store.setSelection.mock.calls[0][0].getDecorated()).toEqual(story);
+      expect(store.setSelection.mock.calls[0][0].getDecorated()).toEqual(storyFn);
     });
   });
 });
diff --git a/lib/core/src/client/preview/start.js b/lib/core/src/client/preview/start.js
index 01d0a3b5eca..b4da2b35267 100644
--- a/lib/core/src/client/preview/start.js
+++ b/lib/core/src/client/preview/start.js
@@ -113,9 +113,10 @@ export default function start(render, { decorateStory } = {}) {
 
   const renderMain = forceRender => {
     const revision = storyStore.getRevision();
-    const { kind, name, story, id } = storyStore.getSelection() || {};
+    const selection = storyStore.getSelection();
+    const { kind, name, getDecorated, id } = selection || {};
 
-    if (story) {
+    if (getDecorated) {
       // Render story only if selectedKind or selectedStory have changed.
       // However, we DO want the story to re-render if the store itself has changed
       // (which happens at the moment when HMR occurs)
@@ -140,7 +141,7 @@ export default function start(render, { decorateStory } = {}) {
 
       render({
         ...context,
-        story,
+        ...selection,
         selectedKind: kind,
         selectedStory: name,
         forceRender,

From ac27de0563a09f47e0187a65135dd34df737d625 Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Wed, 20 Feb 2019 13:46:13 +0100
Subject: [PATCH 045/249] Merge pull request #5678 from
 storybooks/fix/error-reporting

FIX broken error reporting
---
 lib/core/src/server/build-dev.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/lib/core/src/server/build-dev.js b/lib/core/src/server/build-dev.js
index 357cb7e4245..7b207d09037 100644
--- a/lib/core/src/server/build-dev.js
+++ b/lib/core/src/server/build-dev.js
@@ -322,7 +322,7 @@ export async function buildDevStandalone(options) {
       } else if (error.stats && error.stats.compilation.errors) {
         error.stats.compilation.errors.forEach(e => logger.plain(e));
       } else {
-        logger.error(Object.keys(error.stats.compilation));
+        logger.error(error);
       }
 
       if (error.close) {

From 64120f34616cdf200835c700b0e2a88359ab8093 Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Tue, 19 Feb 2019 11:29:05 +0800
Subject: [PATCH 046/249] Merge pull request #5641 from
 storybooks/shilman/5639-prerelease-version-check

Handle prerelease versions in version check
---
 lib/ui/src/core/versions.js      |  9 ++-
 lib/ui/src/core/versions.test.js | 96 ++++++++++++++++++++++++--------
 2 files changed, 79 insertions(+), 26 deletions(-)

diff --git a/lib/ui/src/core/versions.js b/lib/ui/src/core/versions.js
index c20a58983e5..5faed2c883a 100644
--- a/lib/ui/src/core/versions.js
+++ b/lib/ui/src/core/versions.js
@@ -44,8 +44,11 @@ export default function({ store }) {
     },
     getLatestVersion: () => {
       const {
-        versions: { latest },
+        versions: { latest, next, current },
       } = store.getState();
+      if (current && semver.prerelease(current.version) && next) {
+        return latest && semver.gt(latest.version, next.version) ? latest : next;
+      }
       return latest;
     },
     versionUpdateAvailable: () => {
@@ -63,10 +66,10 @@ export default function({ store }) {
     const now = Date.now();
     if (!lastVersionCheck || now - lastVersionCheck > checkInterval) {
       try {
-        const { latest } = await fetchLatestVersion(currentVersion);
+        const { latest, next } = await fetchLatestVersion(currentVersion);
 
         await store.setState(
-          { versions: { ...versions, latest }, lastVersionCheck: now },
+          { versions: { ...versions, latest, next }, lastVersionCheck: now },
           { persistence: 'permanent' }
         );
       } catch (error) {
diff --git a/lib/ui/src/core/versions.test.js b/lib/ui/src/core/versions.test.js
index 5434aeef973..5e83f5727d3 100644
--- a/lib/ui/src/core/versions.test.js
+++ b/lib/ui/src/core/versions.test.js
@@ -19,16 +19,25 @@ function createMockStore() {
   };
 }
 
-const makeResponse = version => ({
-  json: jest.fn().mockResolvedValue({
-    latest: {
-      version,
+const makeResponse = (latest, next) => {
+  const nextVersion = next && {
+    next: {
+      version: next,
     },
-  }),
-});
+  };
+  return {
+    json: jest.fn().mockResolvedValue({
+      latest: {
+        version: latest,
+      },
+      ...nextVersion,
+    }),
+  };
+};
 
-const newResponse = makeResponse('4.0.0');
-const oldResponse = makeResponse('2.0.0');
+const newResponse = makeResponse('4.0.0', null);
+const oldResponse = makeResponse('2.0.0', null);
+const prereleaseResponse = makeResponse('3.0.0', '4.0.0-alpha.0');
 
 jest.mock('@storybook/client-logger');
 
@@ -196,25 +205,66 @@ describe('versions API', () => {
     });
   });
 
-  it('versionUpdateAvailable works for new versions', async () => {
-    const store = createMockStore();
-    const { api, init, state: initialState } = initVersions({ store });
-    store.setState(initialState);
+  describe('versionUpdateAvailable', () => {
+    describe('stable current version', () => {
+      it('new latest version', async () => {
+        const store = createMockStore();
+        const { api, init, state: initialState } = initVersions({ store });
+        store.setState(initialState);
 
-    fetch.mockResolvedValueOnce(newResponse);
-    await init({ api: { ...api, addNotification: jest.fn() } });
+        fetch.mockResolvedValueOnce(newResponse);
+        await init({ api: { ...api, addNotification: jest.fn() } });
 
-    expect(api.versionUpdateAvailable()).toEqual(true);
-  });
+        expect(api.versionUpdateAvailable()).toEqual(true);
+      });
 
-  it('versionUpdateAvailable works for old versions', async () => {
-    const store = createMockStore();
-    const { api, init, state: initialState } = initVersions({ store });
-    store.setState(initialState);
+      it('old latest version', async () => {
+        const store = createMockStore();
+        const { api, init, state: initialState } = initVersions({ store });
+        store.setState(initialState);
 
-    fetch.mockResolvedValueOnce(oldResponse);
-    await init({ api: { ...api, addNotification: jest.fn() } });
+        fetch.mockResolvedValueOnce(oldResponse);
+        await init({ api: { ...api, addNotification: jest.fn() } });
 
-    expect(api.versionUpdateAvailable()).toEqual(false);
+        expect(api.versionUpdateAvailable()).toEqual(false);
+      });
+
+      it('new next version', async () => {
+        const store = createMockStore();
+        const { api, init, state: initialState } = initVersions({ store });
+        store.setState(initialState);
+
+        fetch.mockResolvedValueOnce(prereleaseResponse);
+        await init({ api: { ...api, addNotification: jest.fn() } });
+
+        expect(api.versionUpdateAvailable()).toEqual(false);
+      });
+    });
+
+    describe('prerelease current version', () => {
+      it('new latest version', async () => {
+        const store = createMockStore();
+        const { api, init, state: initialState } = initVersions({ store });
+        initialState.versions.current.version = '3.1.0-alpha.0';
+        store.setState(initialState);
+
+        fetch.mockResolvedValueOnce(newResponse);
+        await init({ api: { ...api, addNotification: jest.fn() } });
+
+        expect(api.versionUpdateAvailable()).toEqual(true);
+      });
+
+      it('new next version', async () => {
+        const store = createMockStore();
+        const { api, init, state: initialState } = initVersions({ store });
+        initialState.versions.current.version = '3.1.0-alpha.0';
+        store.setState(initialState);
+
+        fetch.mockResolvedValueOnce(prereleaseResponse);
+        await init({ api: { ...api, addNotification: jest.fn() } });
+
+        expect(api.versionUpdateAvailable()).toEqual(true);
+      });
+    });
   });
 });

From 022db490235cd7fc973b182315945d5f791fcda5 Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Wed, 20 Feb 2019 23:17:27 +0800
Subject: [PATCH 047/249] Merge pull request #5672 from
 storybooks/fix/storysource-not-updating

Fix/storysource not updating
---
 .../storyshots-puppeteer/package.json         |    2 +-
 .../storyshots-puppeteer/src/url.js           |    2 +-
 addons/storysource/package.json               |    1 +
 addons/storysource/src/StoryPanel.js          |   25 +-
 addons/storysource/src/events.js              |    2 +-
 .../inject-decorator.test.js.snap             |   83 +-
 .../storysource/src/loader/parse-helpers.js   |   30 +-
 addons/storysource/src/preview.js             |    7 +-
 .../__snapshots__/storyshots.test.js.snap     | 1538 +++----
 lib/client-api/package.json                   |    1 +
 lib/client-api/src/client_api.js              |    3 +-
 lib/client-api/src/id.js                      |   29 -
 lib/client-api/src/index.js                   |    3 -
 lib/client-api/src/story_store.js             |    4 +-
 lib/client-api/src/story_store.test.js        |    2 +-
 .../syntaxhighlighter/syntaxhighlighter.js    |    9 +-
 .../TooltipMessage.stories.storyshot          |   12 -
 .../WithTooltip.stories.storyshot             |    6 -
 .../link/__snapshots__/link.stories.storyshot |   54 -
 lib/components/src/typography/link/link.js    |    2 -
 lib/core/package.json                         |    1 +
 lib/core/src/client/preview/index.js          |    5 +-
 lib/core/src/client/preview/start.js          |    3 +-
 lib/router/src/router.tsx                     |    7 +-
 .../src => router/src/tests}/id.test.js       |    8 +-
 lib/router/src/typings.d.ts                   |    1 +
 lib/router/src/utils.ts                       |   19 +
 lib/router/utils.js                           |    1 +
 .../src/components/layout/layout.stories.js   |    1 +
 lib/ui/src/core/stories.js                    |    2 +-
 lib/ui/src/core/url.js                        |    2 +-
 lib/ui/src/libs/id.js                         |   29 -
 lib/ui/src/libs/id.test.js                    |   38 -
 .../__snapshots__/about.stories.storyshot     | 3678 +++++++++--------
 34 files changed, 2565 insertions(+), 3045 deletions(-)
 delete mode 100644 lib/client-api/src/id.js
 rename lib/{client-api/src => router/src/tests}/id.test.js (83%)
 create mode 100644 lib/router/utils.js
 delete mode 100644 lib/ui/src/libs/id.js
 delete mode 100644 lib/ui/src/libs/id.test.js

diff --git a/addons/storyshots/storyshots-puppeteer/package.json b/addons/storyshots/storyshots-puppeteer/package.json
index bd61c3dbe73..ce996dade11 100644
--- a/addons/storyshots/storyshots-puppeteer/package.json
+++ b/addons/storyshots/storyshots-puppeteer/package.json
@@ -21,7 +21,7 @@
     "prepare": "node ../../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.3",
+    "@storybook/router": "5.0.0-rc.3",
     "@storybook/node-logger": "5.0.0-rc.3",
     "core-js": "^2.6.2",
     "jest-image-snapshot": "^2.6.0",
diff --git a/addons/storyshots/storyshots-puppeteer/src/url.js b/addons/storyshots/storyshots-puppeteer/src/url.js
index ba3198d61bc..bf01f101b10 100644
--- a/addons/storyshots/storyshots-puppeteer/src/url.js
+++ b/addons/storyshots/storyshots-puppeteer/src/url.js
@@ -1,4 +1,4 @@
-import { toId } from '@storybook/core/client';
+import { toId } from '@storybook/router/utils';
 
 import { URL } from 'url';
 
diff --git a/addons/storysource/package.json b/addons/storysource/package.json
index 81902504d64..78ec404fbfd 100644
--- a/addons/storysource/package.json
+++ b/addons/storysource/package.json
@@ -24,6 +24,7 @@
     "@storybook/addons": "5.0.0-rc.3",
     "@storybook/components": "5.0.0-rc.3",
     "@storybook/theming": "5.0.0-rc.3",
+    "@storybook/router": "5.0.0-rc.3",
     "core-js": "^2.6.2",
     "estraverse": "^4.2.0",
     "loader-utils": "^1.2.1",
diff --git a/addons/storysource/src/StoryPanel.js b/addons/storysource/src/StoryPanel.js
index 86ec970f24f..07e17f75163 100644
--- a/addons/storysource/src/StoryPanel.js
+++ b/addons/storysource/src/StoryPanel.js
@@ -1,7 +1,8 @@
 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 import { styled } from '@storybook/theming';
-import { Link, SyntaxHighlighter } from '@storybook/components';
+import { Link } from '@storybook/router';
+import { SyntaxHighlighter } from '@storybook/components';
 
 import { createElement } from 'react-syntax-highlighter';
 import { EVENT_ID } from './events';
@@ -10,6 +11,7 @@ const StyledStoryLink = styled(Link)(({ theme }) => ({
   display: 'block',
   textDecoration: 'none',
   borderRadius: theme.appBorderRadius,
+
   '&:hover': {
     background: theme.background.hoverable,
   },
@@ -23,6 +25,7 @@ const SelectedStoryHighlight = styled.div(({ theme }) => ({
 const StyledSyntaxHighlighter = styled(SyntaxHighlighter)(({ theme }) => ({
   fontSize: theme.typography.size.s2 - 1,
 }));
+
 const areLocationsEqual = (a, b) =>
   a.startLoc.line === b.startLoc.line &&
   a.startLoc.col === b.startLoc.col &&
@@ -73,14 +76,6 @@ export default class StoryPanel extends Component {
     });
   };
 
-  clickOnStory = (kind, story) => {
-    const { api } = this.props;
-
-    if (kind && story) {
-      api.selectStory(kind, story);
-    }
-  };
-
   createPart = (rows, stylesheet, useInlineStyles) =>
     rows.map((node, i) =>
       createElement({
@@ -91,7 +86,7 @@ export default class StoryPanel extends Component {
       })
     );
 
-  createStoryPart = (rows, stylesheet, useInlineStyles, location, kindStory) => {
+  createStoryPart = (rows, stylesheet, useInlineStyles, location, id) => {
     const { currentLocation } = this.state;
     const first = location.startLoc.line - 1;
     const last = location.endLoc.line;
@@ -108,15 +103,8 @@ export default class StoryPanel extends Component {
       );
     }
 
-    const [selectedKind, selectedStory] = kindStory.split('@');
-    const url = `/?selectedKind=${selectedKind}&selectedStory=${selectedStory}`;
-
     return (
-      <StyledStoryLink
-        href={url}
-        key={storyKey}
-        onClick={() => this.clickOnStory(selectedKind, selectedStory)}
-      >
+      <StyledStoryLink to={`/story/${id}`} key={storyKey}>
         {story}
       </StyledStoryLink>
     );
@@ -179,6 +167,7 @@ export default class StoryPanel extends Component {
         language="jsx"
         showLineNumbers="true"
         renderer={this.lineRenderer}
+        format={false}
         copyable={false}
         padded
       >
diff --git a/addons/storysource/src/events.js b/addons/storysource/src/events.js
index 6efb4f843c5..37a7edb2496 100644
--- a/addons/storysource/src/events.js
+++ b/addons/storysource/src/events.js
@@ -1,3 +1,3 @@
 export const ADDON_ID = 'storybook/storysource';
 export const PANEL_ID = `${ADDON_ID}/panel`;
-export const EVENT_ID = `${ADDON_ID}/story-event`;
+export const EVENT_ID = `${ADDON_ID}/set`;
diff --git a/addons/storysource/src/loader/__snapshots__/inject-decorator.test.js.snap b/addons/storysource/src/loader/__snapshots__/inject-decorator.test.js.snap
index ef68c362afa..71a9f6f70c7 100644
--- a/addons/storysource/src/loader/__snapshots__/inject-decorator.test.js.snap
+++ b/addons/storysource/src/loader/__snapshots__/inject-decorator.test.js.snap
@@ -252,7 +252,7 @@ storiesOf('Addons|Info.GitHub issues', module).add(
 
 exports[`inject-decorator positive - angular calculates "adds" map 1`] = `
 Object {
-  "Custom|ng-content@Default": Object {
+  "custom-ng-content--default": Object {
     "endLoc": Object {
       "col": 2,
       "line": 17,
@@ -284,20 +284,7 @@ storiesOf('Custom|ng-content', module).addDecorator(withStorySource(__STORY__, _
 "
 `;
 
-exports[`inject-decorator positive - flow calculates "adds" map 1`] = `
-Object {
-  "@Flow Class": Object {
-    "endLoc": Object {
-      "col": 70,
-      "line": 35,
-    },
-    "startLoc": Object {
-      "col": 12,
-      "line": 35,
-    },
-  },
-}
-`;
+exports[`inject-decorator positive - flow calculates "adds" map 1`] = `Object {}`;
 
 exports[`inject-decorator positive - flow injects stories decorator after the all "storiesOf" functions 1`] = `
 "// @flow
@@ -340,7 +327,7 @@ stories.add('Flow Class', withInfo('Lorum Ipsum Nem')(() => <Table />));
 
 exports[`inject-decorator positive - ts calculates "adds" map 1`] = `
 Object {
-  "ngrx|Store@With component": Object {
+  "ngrx-store--with-component": Object {
     "endLoc": Object {
       "col": 3,
       "line": 32,
@@ -390,7 +377,7 @@ storiesOf('ngrx|Store', module).addDecorator(withStorySource(__STORY__, __ADDS_M
 
 exports[`inject-decorator positive calculates "adds" map 1`] = `
 Object {
-  "Addons|Info.Decorator@Use Info as story decorator": Object {
+  "addons-info-decorator--use-info-as-story-decorator": Object {
     "endLoc": Object {
       "col": 73,
       "line": 137,
@@ -400,7 +387,7 @@ Object {
       "line": 137,
     },
   },
-  "Addons|Info.GitHub issues@#1814": Object {
+  "addons-info-github-issues--1814": Object {
     "endLoc": Object {
       "col": 4,
       "line": 152,
@@ -410,7 +397,7 @@ Object {
       "line": 146,
     },
   },
-  "Addons|Info.Markdown@Displays Markdown in description": Object {
+  "addons-info-markdown--displays-markdown-in-description": Object {
     "endLoc": Object {
       "col": 96,
       "line": 44,
@@ -420,17 +407,7 @@ Object {
       "line": 43,
     },
   },
-  "Addons|Info.Options.TableComponent@Use a custom component for the table": Object {
-    "endLoc": Object {
-      "col": 41,
-      "line": 130,
-    },
-    "startLoc": Object {
-      "col": 2,
-      "line": 127,
-    },
-  },
-  "Addons|Info.Options.header@Shows or hides Info Addon header": Object {
+  "addons-info-options-header--shows-or-hides-info-addon-header": Object {
     "endLoc": Object {
       "col": 41,
       "line": 60,
@@ -440,7 +417,7 @@ Object {
       "line": 56,
     },
   },
-  "Addons|Info.Options.inline@Inlines component inside story": Object {
+  "addons-info-options-inline--inlines-component-inside-story": Object {
     "endLoc": Object {
       "col": 41,
       "line": 52,
@@ -450,7 +427,7 @@ Object {
       "line": 48,
     },
   },
-  "Addons|Info.Options.propTables@Shows additional component prop tables": Object {
+  "addons-info-options-proptables--shows-additional-component-prop-tables": Object {
     "endLoc": Object {
       "col": 41,
       "line": 76,
@@ -460,7 +437,7 @@ Object {
       "line": 72,
     },
   },
-  "Addons|Info.Options.propTablesExclude@Exclude component from prop tables": Object {
+  "addons-info-options-proptablesexclude--exclude-component-from-prop-tables": Object {
     "endLoc": Object {
       "col": 4,
       "line": 89,
@@ -470,7 +447,7 @@ Object {
       "line": 80,
     },
   },
-  "Addons|Info.Options.source@Shows or hides Info Addon source": Object {
+  "addons-info-options-source--shows-or-hides-info-addon-source": Object {
     "endLoc": Object {
       "col": 41,
       "line": 68,
@@ -480,7 +457,7 @@ Object {
       "line": 64,
     },
   },
-  "Addons|Info.Options.styles@Extend info styles with an object": Object {
+  "addons-info-options-styles--extend-info-styles-with-an-object": Object {
     "endLoc": Object {
       "col": 43,
       "line": 108,
@@ -490,7 +467,7 @@ Object {
       "line": 94,
     },
   },
-  "Addons|Info.Options.styles@Full control over styles using a function": Object {
+  "addons-info-options-styles--full-control-over-styles-using-a-function": Object {
     "endLoc": Object {
       "col": 43,
       "line": 123,
@@ -500,7 +477,27 @@ Object {
       "line": 111,
     },
   },
-  "Addons|Info.React Docgen@Comments from Flow declarations": Object {
+  "addons-info-options-tablecomponent--use-a-custom-component-for-the-table": Object {
+    "endLoc": Object {
+      "col": 41,
+      "line": 130,
+    },
+    "startLoc": Object {
+      "col": 2,
+      "line": 127,
+    },
+  },
+  "addons-info-react-docgen--comments-from-component-declaration": Object {
+    "endLoc": Object {
+      "col": 70,
+      "line": 28,
+    },
+    "startLoc": Object {
+      "col": 4,
+      "line": 25,
+    },
+  },
+  "addons-info-react-docgen--comments-from-flow-declarations": Object {
     "endLoc": Object {
       "col": 85,
       "line": 22,
@@ -510,7 +507,7 @@ Object {
       "line": 19,
     },
   },
-  "Addons|Info.React Docgen@Comments from PropType declarations": Object {
+  "addons-info-react-docgen--comments-from-proptype-declarations": Object {
     "endLoc": Object {
       "col": 79,
       "line": 16,
@@ -520,16 +517,6 @@ Object {
       "line": 13,
     },
   },
-  "Addons|Info.React Docgen@Comments from component declaration": Object {
-    "endLoc": Object {
-      "col": 70,
-      "line": 28,
-    },
-    "startLoc": Object {
-      "col": 4,
-      "line": 25,
-    },
-  },
 }
 `;
 
diff --git a/addons/storysource/src/loader/parse-helpers.js b/addons/storysource/src/loader/parse-helpers.js
index 18b005ea2db..a27f4862cf2 100644
--- a/addons/storysource/src/loader/parse-helpers.js
+++ b/addons/storysource/src/loader/parse-helpers.js
@@ -1,3 +1,5 @@
+const { toId } = require('@storybook/router/utils');
+
 const STORIES_OF = 'storiesOf';
 
 function pushParts(source, parts, from, to) {
@@ -79,20 +81,22 @@ export function handleADD(node, parent, adds) {
   }
 
   const kind = findRelatedKind(node.object) || '';
-  const key = `${kind}@${storyName.value}`;
+  if (kind && storyName.value) {
+    const key = toId(kind, storyName.value);
 
-  // eslint-disable-next-line no-param-reassign
-  adds[key] = {
-    // Debug: code: source.slice(storyName.start, lastArg.end),
-    startLoc: {
-      col: storyName.loc.start.column,
-      line: storyName.loc.start.line,
-    },
-    endLoc: {
-      col: lastArg.loc.end.column,
-      line: lastArg.loc.end.line,
-    },
-  };
+    // eslint-disable-next-line no-param-reassign
+    adds[key] = {
+      // Debug: code: source.slice(storyName.start, lastArg.end),
+      startLoc: {
+        col: storyName.loc.start.column,
+        line: storyName.loc.start.line,
+      },
+      endLoc: {
+        col: lastArg.loc.end.column,
+        line: lastArg.loc.end.line,
+      },
+    };
+  }
 }
 
 export function handleSTORYOF(node, parts, source, lastIndex) {
diff --git a/addons/storysource/src/preview.js b/addons/storysource/src/preview.js
index 1aa601caa95..93a15a9ed92 100644
--- a/addons/storysource/src/preview.js
+++ b/addons/storysource/src/preview.js
@@ -1,15 +1,12 @@
 import addons from '@storybook/addons';
 import { EVENT_ID } from './events';
 
-function getLocation(context, locationsMap) {
-  return locationsMap[`${context.kind}@${context.name}`] || locationsMap[`@${context.name}`];
-}
+const getLocation = (context, locationsMap) => locationsMap[context.id];
 
 function setStorySource(context, source, locationsMap) {
-  const channel = addons.getChannel();
   const currentLocation = getLocation(context, locationsMap);
 
-  channel.emit(EVENT_ID, {
+  addons.getChannel().emit(EVENT_ID, {
     source,
     currentLocation,
     locationsMap,
diff --git a/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap b/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
index b5b360c575c..41cb155db4f 100644
--- a/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
+++ b/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
@@ -10,6 +10,7 @@ exports[`Storyshots Basics|ActionBar manyItems 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
+  background: #FFFFFF;
 }
 
 .emotion-0 {
@@ -25,6 +26,7 @@ exports[`Storyshots Basics|ActionBar manyItems 1`] = `
   -ms-flex-align: center;
   align-items: center;
   color: #333333;
+  background: #FFFFFF;
   font-size: 12px;
   line-height: 16px;
   font-weight: 700;
@@ -57,6 +59,7 @@ exports[`Storyshots Basics|ActionBar manyItems 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
+  background: #FFFFFF;
 }
 
 .emotion-0 {
@@ -72,6 +75,7 @@ exports[`Storyshots Basics|ActionBar manyItems 1`] = `
   -ms-flex-align: center;
   align-items: center;
   color: #333333;
+  background: #FFFFFF;
   font-size: 12px;
   line-height: 16px;
   font-weight: 700;
@@ -132,6 +136,7 @@ exports[`Storyshots Basics|ActionBar singleItem 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
+  background: #FFFFFF;
 }
 
 .emotion-0 {
@@ -147,6 +152,7 @@ exports[`Storyshots Basics|ActionBar singleItem 1`] = `
   -ms-flex-align: center;
   align-items: center;
   color: #333333;
+  background: #FFFFFF;
   font-size: 12px;
   line-height: 16px;
   font-weight: 700;
@@ -179,6 +185,7 @@ exports[`Storyshots Basics|ActionBar singleItem 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
+  background: #FFFFFF;
 }
 
 .emotion-0 {
@@ -194,6 +201,7 @@ exports[`Storyshots Basics|ActionBar singleItem 1`] = `
   -ms-flex-align: center;
   align-items: center;
   color: #333333;
+  background: #FFFFFF;
   font-size: 12px;
   line-height: 16px;
   font-weight: 700;
@@ -2361,10 +2369,6 @@ exports[`Storyshots Basics|DocumentFormatting withMarkdown 1`] = `
 `;
 
 exports[`Storyshots Basics|Placeholder singleChild 1`] = `
-.emotion-0 {
-  font-weight: 700;
-}
-
 .emotion-1 {
   padding: 30px;
   text-align: center;
@@ -2383,6 +2387,10 @@ exports[`Storyshots Basics|Placeholder singleChild 1`] = `
   font-size: 13px;
 }
 
+.emotion-0 {
+  font-weight: 700;
+}
+
 <div
   class="emotion-1"
 >
@@ -2395,6 +2403,13 @@ exports[`Storyshots Basics|Placeholder singleChild 1`] = `
 `;
 
 exports[`Storyshots Basics|Placeholder twoChildren 1`] = `
+.emotion-4 {
+  padding: 30px;
+  text-align: center;
+  color: #333333;
+  font-size: 13px;
+}
+
 .emotion-0 {
   font-weight: 700;
 }
@@ -2415,9 +2430,6 @@ exports[`Storyshots Basics|Placeholder twoChildren 1`] = `
 .emotion-2:hover,
 .emotion-2:focus {
   cursor: pointer;
-  -webkit-transform: translate3d(0,-1px,0);
-  -ms-transform: translate3d(0,-1px,0);
-  transform: translate3d(0,-1px,0);
   color: #0297f5;
 }
 
@@ -2427,9 +2439,6 @@ exports[`Storyshots Basics|Placeholder twoChildren 1`] = `
 }
 
 .emotion-2:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
   color: #028ee6;
 }
 
@@ -2474,9 +2483,6 @@ exports[`Storyshots Basics|Placeholder twoChildren 1`] = `
 .emotion-2:hover,
 .emotion-2:focus {
   cursor: pointer;
-  -webkit-transform: translate3d(0,-1px,0);
-  -ms-transform: translate3d(0,-1px,0);
-  transform: translate3d(0,-1px,0);
   color: #0297f5;
 }
 
@@ -2486,9 +2492,6 @@ exports[`Storyshots Basics|Placeholder twoChildren 1`] = `
 }
 
 .emotion-2:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
   color: #028ee6;
 }
 
@@ -2506,13 +2509,6 @@ exports[`Storyshots Basics|Placeholder twoChildren 1`] = `
   margin-right: 0.4em;
 }
 
-.emotion-4 {
-  padding: 30px;
-  text-align: center;
-  color: #333333;
-  font-size: 13px;
-}
-
 <div
   class="emotion-4"
 >
@@ -2568,43 +2564,6 @@ exports[`Storyshots Core|Events Force re-render 1`] = `
   font-size: 13px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
 }
 
 .emotion-0 svg {
@@ -2618,6 +2577,10 @@ exports[`Storyshots Core|Events Force re-render 1`] = `
   pointer-events: none;
 }
 
+.emotion-0 svg path {
+  fill: currentColor;
+}
+
 .emotion-0 {
   border: 0;
   border-radius: 3em;
@@ -2646,43 +2609,6 @@ exports[`Storyshots Core|Events Force re-render 1`] = `
   font-size: 13px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
 }
 
 .emotion-0 svg {
@@ -2696,6 +2622,10 @@ exports[`Storyshots Core|Events Force re-render 1`] = `
   pointer-events: none;
 }
 
+.emotion-0 svg path {
+  fill: currentColor;
+}
+
 <button
   class="emotion-0"
 >
@@ -2891,7 +2821,7 @@ exports[`Storyshots UI|Notifications/NotificationItem longText 1`] = `
   line-height: 16px;
   box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
   color: #FFFFFF;
-  background-color: rgba(255,255,255,0.95);
+  background-color: rgba(0,0,0,0.95);
   -webkit-text-decoration: none;
   text-decoration: none;
 }
@@ -2905,7 +2835,7 @@ exports[`Storyshots UI|Notifications/NotificationItem longText 1`] = `
   line-height: 16px;
   box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
   color: #FFFFFF;
-  background-color: rgba(255,255,255,0.95);
+  background-color: rgba(0,0,0,0.95);
   -webkit-text-decoration: none;
   text-decoration: none;
 }
@@ -2935,7 +2865,7 @@ exports[`Storyshots UI|Notifications/NotificationItem simple 1`] = `
   line-height: 16px;
   box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
   color: #FFFFFF;
-  background-color: rgba(255,255,255,0.95);
+  background-color: rgba(0,0,0,0.95);
   -webkit-text-decoration: none;
   text-decoration: none;
 }
@@ -2949,7 +2879,7 @@ exports[`Storyshots UI|Notifications/NotificationItem simple 1`] = `
   line-height: 16px;
   box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
   color: #FFFFFF;
-  background-color: rgba(255,255,255,0.95);
+  background-color: rgba(0,0,0,0.95);
   -webkit-text-decoration: none;
   text-decoration: none;
 }
@@ -2979,7 +2909,7 @@ exports[`Storyshots UI|Notifications/NotificationItem withLink 1`] = `
   line-height: 16px;
   box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
   color: #FFFFFF;
-  background-color: rgba(255,255,255,0.95);
+  background-color: rgba(0,0,0,0.95);
   -webkit-text-decoration: none;
   text-decoration: none;
 }
@@ -2993,7 +2923,7 @@ exports[`Storyshots UI|Notifications/NotificationItem withLink 1`] = `
   line-height: 16px;
   box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
   color: #FFFFFF;
-  background-color: rgba(255,255,255,0.95);
+  background-color: rgba(0,0,0,0.95);
   -webkit-text-decoration: none;
   text-decoration: none;
 }
@@ -3024,7 +2954,7 @@ exports[`Storyshots UI|Notifications/NotificationList all 1`] = `
   line-height: 16px;
   box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
   color: #FFFFFF;
-  background-color: rgba(255,255,255,0.95);
+  background-color: rgba(0,0,0,0.95);
   -webkit-text-decoration: none;
   text-decoration: none;
 }
@@ -3046,7 +2976,7 @@ exports[`Storyshots UI|Notifications/NotificationList all 1`] = `
   line-height: 16px;
   box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
   color: #FFFFFF;
-  background-color: rgba(255,255,255,0.95);
+  background-color: rgba(0,0,0,0.95);
   -webkit-text-decoration: none;
   text-decoration: none;
 }
@@ -3107,7 +3037,7 @@ exports[`Storyshots UI|Notifications/NotificationList single 1`] = `
   line-height: 16px;
   box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
   color: #FFFFFF;
-  background-color: rgba(255,255,255,0.95);
+  background-color: rgba(0,0,0,0.95);
   -webkit-text-decoration: none;
   text-decoration: none;
 }
@@ -3129,7 +3059,7 @@ exports[`Storyshots UI|Notifications/NotificationList single 1`] = `
   line-height: 16px;
   box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
   color: #FFFFFF;
-  background-color: rgba(255,255,255,0.95);
+  background-color: rgba(0,0,0,0.95);
   -webkit-text-decoration: none;
   text-decoration: none;
 }
@@ -3224,9 +3154,6 @@ exports[`Storyshots UI|Settings/SettingsFooter basic 1`] = `
 .emotion-1:hover,
 .emotion-1:focus {
   cursor: pointer;
-  -webkit-transform: translate3d(0,-1px,0);
-  -ms-transform: translate3d(0,-1px,0);
-  transform: translate3d(0,-1px,0);
   color: #0297f5;
 }
 
@@ -3236,9 +3163,6 @@ exports[`Storyshots UI|Settings/SettingsFooter basic 1`] = `
 }
 
 .emotion-1:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
   color: #028ee6;
 }
 
@@ -3308,9 +3232,6 @@ exports[`Storyshots UI|Settings/SettingsFooter basic 1`] = `
 .emotion-1:hover,
 .emotion-1:focus {
   cursor: pointer;
-  -webkit-transform: translate3d(0,-1px,0);
-  -ms-transform: translate3d(0,-1px,0);
-  transform: translate3d(0,-1px,0);
   color: #0297f5;
 }
 
@@ -3320,9 +3241,6 @@ exports[`Storyshots UI|Settings/SettingsFooter basic 1`] = `
 }
 
 .emotion-1:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
   color: #028ee6;
 }
 
@@ -3401,7 +3319,7 @@ exports[`Storyshots UI|Settings/SettingsFooter basic 1`] = `
 `;
 
 exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
-.emotion-99 {
+.emotion-100 {
   width: 100%;
   height: 100%;
   box-sizing: border-box;
@@ -3414,6 +3332,57 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   flex-direction: column;
 }
 
+.emotion-8 {
+  color: #999999;
+  height: 40px;
+  overflow: auto;
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-8::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+}
+
+.emotion-8::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-8::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-8::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
+}
+
 .emotion-7 {
   display: -webkit-box;
   display: -webkit-flex;
@@ -3423,14 +3392,9 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   -webkit-justify-content: space-between;
   -ms-flex-pack: justify;
   justify-content: space-between;
-  background: #FFFFFF;
-  color: #999999;
-  height: 40px;
   position: relative;
-  overflow: visible;
-  overflow-x: visible;
-  overflow-y: visible;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+  white-space: nowrap;
+  height: 40px;
 }
 
 .emotion-2 {
@@ -3438,9 +3402,12 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
 }
 
 .emotion-2 > * {
@@ -3448,14 +3415,10 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
 }
 
 .emotion-1 {
-  white-space: nowrap;
-  height: 100%;
-  padding-bottom: 50px;
-  overflow-x: visisble;
-  overflow-y: visisble;
+  overflow: hidden;
 }
 
-.emotion-1:first-child {
+.emotion-1:first-of-type {
   margin-left: 0;
 }
 
@@ -3509,6 +3472,13 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  margin-left: 30px;
 }
 
 .emotion-6 > * {
@@ -3550,7 +3520,7 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   fill: currentColor;
 }
 
-.emotion-98 {
+.emotion-99 {
   display: block;
   position: relative;
   font-size: 13px;
@@ -3562,7 +3532,7 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   width: 100%;
 }
 
-.emotion-95 {
+.emotion-96 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -3573,11 +3543,11 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   font-weight: 700;
 }
 
-.emotion-95 > * + * {
+.emotion-96 > * + * {
   margin-left: 20px;
 }
 
-.emotion-90 {
+.emotion-91 {
   display: inline-block;
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
@@ -3587,36 +3557,30 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   color: #999999;
 }
 
-.emotion-90 svg path {
+.emotion-91 svg path {
   fill: #1EA7FD;
 }
 
-.emotion-90:hover,
-.emotion-90:focus {
+.emotion-91:hover,
+.emotion-91:focus {
   cursor: pointer;
-  -webkit-transform: translate3d(0,-1px,0);
-  -ms-transform: translate3d(0,-1px,0);
-  transform: translate3d(0,-1px,0);
   color: #0297f5;
 }
 
-.emotion-90:hover svg path,
-.emotion-90:focus svg path {
+.emotion-91:hover svg path,
+.emotion-91:focus svg path {
   fill: #0297f5;
 }
 
-.emotion-90:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
+.emotion-91:active {
   color: #028ee6;
 }
 
-.emotion-90:active svg path {
+.emotion-91:active svg path {
   fill: #028ee6;
 }
 
-.emotion-90 svg {
+.emotion-91 svg {
   display: inline-block;
   height: 1em;
   width: 1em;
@@ -3626,38 +3590,38 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   margin-right: 0.4em;
 }
 
-.emotion-90 svg path {
+.emotion-91 svg path {
   fill: #999999;
 }
 
-.emotion-90:hover {
+.emotion-91:hover {
   color: #666666;
 }
 
-.emotion-90:hover svg path {
+.emotion-91:hover svg path {
   fill: #666666;
 }
 
-.emotion-90:active {
+.emotion-91:active {
   color: #444444;
 }
 
-.emotion-90:active svg path {
+.emotion-91:active svg path {
   fill: #444444;
 }
 
-.emotion-97 {
+.emotion-98 {
   display: block;
 }
 
-.emotion-96 {
+.emotion-97 {
   font-size: 14px;
   padding: 3rem 20px;
   max-width: 600px;
   margin: 0 auto;
 }
 
-.emotion-8 {
+.emotion-9 {
   margin-bottom: 20px;
   font-size: 28px;
   font-weight: 900;
@@ -3671,14 +3635,14 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   display: flex;
 }
 
-.emotion-87 {
+.emotion-88 {
   display: grid;
   grid-template-columns: 1fr;
   grid-auto-rows: minmax(auto,auto);
   margin-bottom: 20px;
 }
 
-.emotion-11 {
+.emotion-12 {
   -webkit-align-self: flex-end;
   -ms-flex-item-align: end;
   align-self: flex-end;
@@ -3687,30 +3651,30 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   grid-template-columns: 1fr 1fr 12px;
 }
 
-.emotion-11 > *:last-of-type {
+.emotion-12 > *:last-of-type {
   grid-column: 2 / 2;
   justify-self: flex-end;
   grid-row: 1;
 }
 
-.emotion-9 {
+.emotion-10 {
   font-weight: 700;
 }
 
-.emotion-16 {
+.emotion-17 {
   padding: 6px 0;
   border-top: 1px solid rgba(0,0,0,.1);
   display: grid;
   grid-template-columns: 1fr 1fr 0px;
 }
 
-.emotion-12 {
+.emotion-13 {
   -webkit-align-self: center;
   -ms-flex-item-align: center;
   align-self: center;
 }
 
-.emotion-13 {
+.emotion-14 {
   -webkit-appearance: none;
   -moz-appearance: none;
   appearance: none;
@@ -3745,36 +3709,36 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   text-align: center;
 }
 
-.emotion-13:focus {
+.emotion-14:focus {
   box-shadow: #1EA7FD 0 0 0 1px inset;
 }
 
-.emotion-13[disabled] {
+.emotion-14[disabled] {
   cursor: not-allowed;
   opacity: 0.5;
 }
 
-.emotion-13:-webkit-autofill {
+.emotion-14:-webkit-autofill {
   -webkit-box-shadow: 0 0 0 3em #FFFFFF inset;
 }
 
-.emotion-13::-webkit-input-placeholder {
+.emotion-14::-webkit-input-placeholder {
   color: #999999;
 }
 
-.emotion-13::-moz-placeholder {
+.emotion-14::-moz-placeholder {
   color: #999999;
 }
 
-.emotion-13:-ms-input-placeholder {
+.emotion-14:-ms-input-placeholder {
   color: #999999;
 }
 
-.emotion-13::placeholder {
+.emotion-14::placeholder {
   color: #999999;
 }
 
-.emotion-15 {
+.emotion-16 {
   shape-rendering: inherit;
   -webkit-transform: translate3d(0,0,0);
   -ms-transform: translate3d(0,0,0);
@@ -3793,7 +3757,7 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   width: 14px;
 }
 
-.emotion-88 {
+.emotion-89 {
   border: 0;
   border-radius: 3em;
   cursor: pointer;
@@ -3821,16 +3785,11 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -3839,39 +3798,7 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   z-index: 2;
 }
 
-.emotion-88:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-88:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-88:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-88 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-88 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
-.emotion-88 svg {
+.emotion-89 svg {
   display: inline-block;
   height: 14px;
   width: 14px;
@@ -3882,33 +3809,29 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   pointer-events: none;
 }
 
-.emotion-88 svg path {
-  fill: #333333;
+.emotion-89 svg path {
+  fill: currentColor;
 }
 
-.emotion-88:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+.emotion-89:hover {
+  background: #f2f2f2;
 }
 
-.emotion-88:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+.emotion-89:active {
+  background: #FFFFFF;
 }
 
-.emotion-88:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+.emotion-89:focus {
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
-.emotion-88:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-88:hover {
+.emotion-89:hover {
   -webkit-transform: none;
   -ms-transform: none;
   transform: none;
 }
 
-.emotion-99 {
+.emotion-100 {
   width: 100%;
   height: 100%;
   box-sizing: border-box;
@@ -3921,6 +3844,57 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   flex-direction: column;
 }
 
+.emotion-8 {
+  color: #999999;
+  height: 40px;
+  overflow: auto;
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-8::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+}
+
+.emotion-8::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-8::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-8::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
+}
+
 .emotion-7 {
   display: -webkit-box;
   display: -webkit-flex;
@@ -3930,14 +3904,9 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   -webkit-justify-content: space-between;
   -ms-flex-pack: justify;
   justify-content: space-between;
-  background: #FFFFFF;
-  color: #999999;
-  height: 40px;
   position: relative;
-  overflow: visible;
-  overflow-x: visible;
-  overflow-y: visible;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+  white-space: nowrap;
+  height: 40px;
 }
 
 .emotion-2 {
@@ -3945,9 +3914,12 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
 }
 
 .emotion-2 > * {
@@ -3955,14 +3927,10 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
 }
 
 .emotion-1 {
-  white-space: nowrap;
-  height: 100%;
-  padding-bottom: 50px;
-  overflow-x: visisble;
-  overflow-y: visisble;
+  overflow: hidden;
 }
 
-.emotion-1:first-child {
+.emotion-1:first-of-type {
   margin-left: 0;
 }
 
@@ -4016,6 +3984,13 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  margin-left: 30px;
 }
 
 .emotion-6 > * {
@@ -4057,7 +4032,7 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   fill: currentColor;
 }
 
-.emotion-98 {
+.emotion-99 {
   display: block;
   position: relative;
   font-size: 13px;
@@ -4069,7 +4044,7 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   width: 100%;
 }
 
-.emotion-95 {
+.emotion-96 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -4080,11 +4055,11 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   font-weight: 700;
 }
 
-.emotion-95 > * + * {
+.emotion-96 > * + * {
   margin-left: 20px;
 }
 
-.emotion-90 {
+.emotion-91 {
   display: inline-block;
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
@@ -4094,36 +4069,30 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   color: #999999;
 }
 
-.emotion-90 svg path {
+.emotion-91 svg path {
   fill: #1EA7FD;
 }
 
-.emotion-90:hover,
-.emotion-90:focus {
+.emotion-91:hover,
+.emotion-91:focus {
   cursor: pointer;
-  -webkit-transform: translate3d(0,-1px,0);
-  -ms-transform: translate3d(0,-1px,0);
-  transform: translate3d(0,-1px,0);
   color: #0297f5;
 }
 
-.emotion-90:hover svg path,
-.emotion-90:focus svg path {
+.emotion-91:hover svg path,
+.emotion-91:focus svg path {
   fill: #0297f5;
 }
 
-.emotion-90:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
+.emotion-91:active {
   color: #028ee6;
 }
 
-.emotion-90:active svg path {
+.emotion-91:active svg path {
   fill: #028ee6;
 }
 
-.emotion-90 svg {
+.emotion-91 svg {
   display: inline-block;
   height: 1em;
   width: 1em;
@@ -4133,38 +4102,38 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   margin-right: 0.4em;
 }
 
-.emotion-90 svg path {
+.emotion-91 svg path {
   fill: #999999;
 }
 
-.emotion-90:hover {
+.emotion-91:hover {
   color: #666666;
 }
 
-.emotion-90:hover svg path {
+.emotion-91:hover svg path {
   fill: #666666;
 }
 
-.emotion-90:active {
+.emotion-91:active {
   color: #444444;
 }
 
-.emotion-90:active svg path {
+.emotion-91:active svg path {
   fill: #444444;
 }
 
-.emotion-97 {
+.emotion-98 {
   display: block;
 }
 
-.emotion-96 {
+.emotion-97 {
   font-size: 14px;
   padding: 3rem 20px;
   max-width: 600px;
   margin: 0 auto;
 }
 
-.emotion-8 {
+.emotion-9 {
   margin-bottom: 20px;
   font-size: 28px;
   font-weight: 900;
@@ -4178,14 +4147,14 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   display: flex;
 }
 
-.emotion-87 {
+.emotion-88 {
   display: grid;
   grid-template-columns: 1fr;
   grid-auto-rows: minmax(auto,auto);
   margin-bottom: 20px;
 }
 
-.emotion-11 {
+.emotion-12 {
   -webkit-align-self: flex-end;
   -ms-flex-item-align: end;
   align-self: flex-end;
@@ -4194,30 +4163,30 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   grid-template-columns: 1fr 1fr 12px;
 }
 
-.emotion-11 > *:last-of-type {
+.emotion-12 > *:last-of-type {
   grid-column: 2 / 2;
   justify-self: flex-end;
   grid-row: 1;
 }
 
-.emotion-9 {
+.emotion-10 {
   font-weight: 700;
 }
 
-.emotion-16 {
+.emotion-17 {
   padding: 6px 0;
   border-top: 1px solid rgba(0,0,0,.1);
   display: grid;
   grid-template-columns: 1fr 1fr 0px;
 }
 
-.emotion-12 {
+.emotion-13 {
   -webkit-align-self: center;
   -ms-flex-item-align: center;
   align-self: center;
 }
 
-.emotion-13 {
+.emotion-14 {
   -webkit-appearance: none;
   -moz-appearance: none;
   appearance: none;
@@ -4252,36 +4221,36 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   text-align: center;
 }
 
-.emotion-13:focus {
+.emotion-14:focus {
   box-shadow: #1EA7FD 0 0 0 1px inset;
 }
 
-.emotion-13[disabled] {
+.emotion-14[disabled] {
   cursor: not-allowed;
   opacity: 0.5;
 }
 
-.emotion-13:-webkit-autofill {
+.emotion-14:-webkit-autofill {
   -webkit-box-shadow: 0 0 0 3em #FFFFFF inset;
 }
 
-.emotion-13::-webkit-input-placeholder {
+.emotion-14::-webkit-input-placeholder {
   color: #999999;
 }
 
-.emotion-13::-moz-placeholder {
+.emotion-14::-moz-placeholder {
   color: #999999;
 }
 
-.emotion-13:-ms-input-placeholder {
+.emotion-14:-ms-input-placeholder {
   color: #999999;
 }
 
-.emotion-13::placeholder {
+.emotion-14::placeholder {
   color: #999999;
 }
 
-.emotion-15 {
+.emotion-16 {
   shape-rendering: inherit;
   -webkit-transform: translate3d(0,0,0);
   -ms-transform: translate3d(0,0,0);
@@ -4300,7 +4269,7 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   width: 14px;
 }
 
-.emotion-88 {
+.emotion-89 {
   border: 0;
   border-radius: 3em;
   cursor: pointer;
@@ -4328,16 +4297,11 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -4346,39 +4310,7 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   z-index: 2;
 }
 
-.emotion-88:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-88:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-88:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-88 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-88 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
-.emotion-88 svg {
+.emotion-89 svg {
   display: inline-block;
   height: 14px;
   width: 14px;
@@ -4389,121 +4321,125 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   pointer-events: none;
 }
 
-.emotion-88 svg path {
-  fill: #333333;
+.emotion-89 svg path {
+  fill: currentColor;
 }
 
-.emotion-88:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+.emotion-89:hover {
+  background: #f2f2f2;
 }
 
-.emotion-88:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+.emotion-89:active {
+  background: #FFFFFF;
 }
 
-.emotion-88:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+.emotion-89:focus {
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
-.emotion-88:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-88:hover {
+.emotion-89:hover {
   -webkit-transform: none;
   -ms-transform: none;
   transform: none;
 }
 
 <div
-  class="emotion-99"
+  class="emotion-100"
+  title="wrapper"
 >
   <div
-    class="emotion-7"
+    class="emotion-8"
+    title="bar"
   >
     <div
-      class="emotion-2"
+      class="emotion-7"
     >
       <div
-        class="emotion-1"
-        role="tablist"
+        class="emotion-2"
+        title="side left"
+      >
+        <div
+          class="emotion-1"
+          role="tablist"
+        >
+          <button
+            class="emotion-0"
+            role="tab"
+            type="button"
+          >
+            Keyboard Shortcuts
+          </button>
+        </div>
+      </div>
+      <div
+        class="emotion-6"
+        title="side right"
       >
         <button
-          class="emotion-0"
-          role="tab"
-          type="button"
+          class="emotion-5"
         >
-          Keyboard Shortcuts
+          <svg
+            class="emotion-4"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-3"
+              d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
+            />
+          </svg>
         </button>
       </div>
     </div>
-    <div
-      class="emotion-6"
-    >
-      <button
-        class="emotion-5"
-      >
-        <svg
-          class="emotion-4"
-          viewBox="0 0 1024 1024"
-        >
-          <path
-            class="emotion-3"
-            d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
-          />
-        </svg>
-      </button>
-    </div>
   </div>
   <div
-    class="emotion-98"
+    class="emotion-99"
   >
     <div
-      class="emotion-97"
+      class="emotion-98"
       role="tabpanel"
     >
       <div
-        class="emotion-96"
+        class="emotion-97"
       >
         <header
-          class="emotion-8"
+          class="emotion-9"
         >
           Keyboard shortcuts
         </header>
         <div
-          class="emotion-87"
+          class="emotion-88"
         >
           <div
-            class="emotion-11"
+            class="emotion-12"
           >
             <div
-              class="emotion-9"
+              class="emotion-10"
             >
               Commands
             </div>
             <div
-              class="emotion-9"
+              class="emotion-10"
             >
               Shortcut
             </div>
           </div>
           <div
-            class="emotion-16"
+            class="emotion-17"
           >
             <div
-              class="emotion-12"
+              class="emotion-13"
             >
               Go full screen
             </div>
             <input
-              class="modalInput emotion-13"
+              class="modalInput emotion-14"
               placeholder="Type keys"
               readonly=""
               spellcheck="false"
               value="F"
             />
             <svg
-              class="emotion-15"
+              class="emotion-16"
               viewBox="0 0 1024 1024"
             >
               <path
@@ -4513,22 +4449,22 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
             </svg>
           </div>
           <div
-            class="emotion-16"
+            class="emotion-17"
           >
             <div
-              class="emotion-12"
+              class="emotion-13"
             >
               Toggle addons
             </div>
             <input
-              class="modalInput emotion-13"
+              class="modalInput emotion-14"
               placeholder="Type keys"
               readonly=""
               spellcheck="false"
               value="S"
             />
             <svg
-              class="emotion-15"
+              class="emotion-16"
               viewBox="0 0 1024 1024"
             >
               <path
@@ -4538,22 +4474,22 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
             </svg>
           </div>
           <div
-            class="emotion-16"
+            class="emotion-17"
           >
             <div
-              class="emotion-12"
+              class="emotion-13"
             >
               Toggle addons orientation
             </div>
             <input
-              class="modalInput emotion-13"
+              class="modalInput emotion-14"
               placeholder="Type keys"
               readonly=""
               spellcheck="false"
               value="D"
             />
             <svg
-              class="emotion-15"
+              class="emotion-16"
               viewBox="0 0 1024 1024"
             >
               <path
@@ -4563,22 +4499,22 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
             </svg>
           </div>
           <div
-            class="emotion-16"
+            class="emotion-17"
           >
             <div
-              class="emotion-12"
+              class="emotion-13"
             >
               Toggle sidebar
             </div>
             <input
-              class="modalInput emotion-13"
+              class="modalInput emotion-14"
               placeholder="Type keys"
               readonly=""
               spellcheck="false"
               value="A"
             />
             <svg
-              class="emotion-15"
+              class="emotion-16"
               viewBox="0 0 1024 1024"
             >
               <path
@@ -4588,22 +4524,22 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
             </svg>
           </div>
           <div
-            class="emotion-16"
+            class="emotion-17"
           >
             <div
-              class="emotion-12"
+              class="emotion-13"
             >
               Toggle canvas toolbar
             </div>
             <input
-              class="modalInput emotion-13"
+              class="modalInput emotion-14"
               placeholder="Type keys"
               readonly=""
               spellcheck="false"
               value="T"
             />
             <svg
-              class="emotion-15"
+              class="emotion-16"
               viewBox="0 0 1024 1024"
             >
               <path
@@ -4613,22 +4549,22 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
             </svg>
           </div>
           <div
-            class="emotion-16"
+            class="emotion-17"
           >
             <div
-              class="emotion-12"
+              class="emotion-13"
             >
               Focus search
             </div>
             <input
-              class="modalInput emotion-13"
+              class="modalInput emotion-14"
               placeholder="Type keys"
               readonly=""
               spellcheck="false"
               value="/"
             />
             <svg
-              class="emotion-15"
+              class="emotion-16"
               viewBox="0 0 1024 1024"
             >
               <path
@@ -4638,22 +4574,22 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
             </svg>
           </div>
           <div
-            class="emotion-16"
+            class="emotion-17"
           >
             <div
-              class="emotion-12"
+              class="emotion-13"
             >
               Focus sidebar
             </div>
             <input
-              class="modalInput emotion-13"
+              class="modalInput emotion-14"
               placeholder="Type keys"
               readonly=""
               spellcheck="false"
               value="1"
             />
             <svg
-              class="emotion-15"
+              class="emotion-16"
               viewBox="0 0 1024 1024"
             >
               <path
@@ -4663,22 +4599,22 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
             </svg>
           </div>
           <div
-            class="emotion-16"
+            class="emotion-17"
           >
             <div
-              class="emotion-12"
+              class="emotion-13"
             >
               Focus canvas
             </div>
             <input
-              class="modalInput emotion-13"
+              class="modalInput emotion-14"
               placeholder="Type keys"
               readonly=""
               spellcheck="false"
               value="2"
             />
             <svg
-              class="emotion-15"
+              class="emotion-16"
               viewBox="0 0 1024 1024"
             >
               <path
@@ -4688,22 +4624,22 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
             </svg>
           </div>
           <div
-            class="emotion-16"
+            class="emotion-17"
           >
             <div
-              class="emotion-12"
+              class="emotion-13"
             >
               Focus addons
             </div>
             <input
-              class="modalInput emotion-13"
+              class="modalInput emotion-14"
               placeholder="Type keys"
               readonly=""
               spellcheck="false"
               value="3"
             />
             <svg
-              class="emotion-15"
+              class="emotion-16"
               viewBox="0 0 1024 1024"
             >
               <path
@@ -4713,22 +4649,22 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
             </svg>
           </div>
           <div
-            class="emotion-16"
+            class="emotion-17"
           >
             <div
-              class="emotion-12"
+              class="emotion-13"
             >
               Previous component
             </div>
             <input
-              class="modalInput emotion-13"
+              class="modalInput emotion-14"
               placeholder="Type keys"
               readonly=""
               spellcheck="false"
               value="alt ↑"
             />
             <svg
-              class="emotion-15"
+              class="emotion-16"
               viewBox="0 0 1024 1024"
             >
               <path
@@ -4738,22 +4674,22 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
             </svg>
           </div>
           <div
-            class="emotion-16"
+            class="emotion-17"
           >
             <div
-              class="emotion-12"
+              class="emotion-13"
             >
               Next component
             </div>
             <input
-              class="modalInput emotion-13"
+              class="modalInput emotion-14"
               placeholder="Type keys"
               readonly=""
               spellcheck="false"
               value="alt ↓"
             />
             <svg
-              class="emotion-15"
+              class="emotion-16"
               viewBox="0 0 1024 1024"
             >
               <path
@@ -4763,22 +4699,22 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
             </svg>
           </div>
           <div
-            class="emotion-16"
+            class="emotion-17"
           >
             <div
-              class="emotion-12"
+              class="emotion-13"
             >
               Previous story
             </div>
             <input
-              class="modalInput emotion-13"
+              class="modalInput emotion-14"
               placeholder="Type keys"
               readonly=""
               spellcheck="false"
               value="alt ←"
             />
             <svg
-              class="emotion-15"
+              class="emotion-16"
               viewBox="0 0 1024 1024"
             >
               <path
@@ -4788,22 +4724,22 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
             </svg>
           </div>
           <div
-            class="emotion-16"
+            class="emotion-17"
           >
             <div
-              class="emotion-12"
+              class="emotion-13"
             >
               Next story
             </div>
             <input
-              class="modalInput emotion-13"
+              class="modalInput emotion-14"
               placeholder="Type keys"
               readonly=""
               spellcheck="false"
               value="alt →"
             />
             <svg
-              class="emotion-15"
+              class="emotion-16"
               viewBox="0 0 1024 1024"
             >
               <path
@@ -4813,22 +4749,22 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
             </svg>
           </div>
           <div
-            class="emotion-16"
+            class="emotion-17"
           >
             <div
-              class="emotion-12"
+              class="emotion-13"
             >
               Go to shortcuts page
             </div>
             <input
-              class="modalInput emotion-13"
+              class="modalInput emotion-14"
               placeholder="Type keys"
               readonly=""
               spellcheck="false"
               value="⌃ ⇧​ ,"
             />
             <svg
-              class="emotion-15"
+              class="emotion-16"
               viewBox="0 0 1024 1024"
             >
               <path
@@ -4838,22 +4774,22 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
             </svg>
           </div>
           <div
-            class="emotion-16"
+            class="emotion-17"
           >
             <div
-              class="emotion-12"
+              class="emotion-13"
             >
               Go to about page
             </div>
             <input
-              class="modalInput emotion-13"
+              class="modalInput emotion-14"
               placeholder="Type keys"
               readonly=""
               spellcheck="false"
               value=","
             />
             <svg
-              class="emotion-15"
+              class="emotion-16"
               viewBox="0 0 1024 1024"
             >
               <path
@@ -4864,40 +4800,40 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
           </div>
         </div>
         <button
-          class="emotion-88"
+          class="emotion-89"
           id="restoreDefaultsHotkeys"
         >
           Restore defaults
         </button>
         <div
-          class="emotion-95"
+          class="emotion-96"
         >
           <a
-            class="emotion-90"
+            class="emotion-91"
             href="https://storybook.js.org"
           >
             <span
-              class="emotion-89"
+              class="emotion-90"
             >
               Docs
             </span>
           </a>
           <a
-            class="emotion-90"
+            class="emotion-91"
             href="https://github.com/storybooks/storybook"
           >
             <span
-              class="emotion-89"
+              class="emotion-90"
             >
               GitHub
             </span>
           </a>
           <a
-            class="emotion-90"
+            class="emotion-91"
             href="https://storybook.js.org/support"
           >
             <span
-              class="emotion-89"
+              class="emotion-90"
             >
               Support
             </span>
@@ -4916,13 +4852,15 @@ exports[`Storyshots UI|Sidebar/ListItemIcon all 1`] = `
 
 .emotion-16 {
   min-width: 180px;
+  overflow: hidden;
+  border-radius: 8px;
 }
 
 .emotion-5 {
   font-size: 12px;
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
-  color: #999999;
+  color: rgba(51,51,51,0.5);
   -webkit-text-decoration: none;
   text-decoration: none;
   cursor: pointer;
@@ -4942,10 +4880,6 @@ exports[`Storyshots UI|Sidebar/ListItemIcon all 1`] = `
   align-items: center;
 }
 
-.emotion-5 + .emotion-5 {
-  border-top: 1px solid #EEEEEE;
-}
-
 .emotion-5 > * + * {
   padding-left: 10px;
 }
@@ -4988,7 +4922,7 @@ exports[`Storyshots UI|Sidebar/ListItemIcon all 1`] = `
 }
 
 .emotion-3 {
-  color: #444444;
+  color: #333333;
 }
 
 .emotion-6 {
@@ -5005,13 +4939,15 @@ exports[`Storyshots UI|Sidebar/ListItemIcon all 1`] = `
 
 .emotion-16 {
   min-width: 180px;
+  overflow: hidden;
+  border-radius: 8px;
 }
 
 .emotion-5 {
   font-size: 12px;
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
-  color: #999999;
+  color: rgba(51,51,51,0.5);
   -webkit-text-decoration: none;
   text-decoration: none;
   cursor: pointer;
@@ -5031,10 +4967,6 @@ exports[`Storyshots UI|Sidebar/ListItemIcon all 1`] = `
   align-items: center;
 }
 
-.emotion-5 + .emotion-5 {
-  border-top: 1px solid #EEEEEE;
-}
-
 .emotion-5 > * + * {
   padding-left: 10px;
 }
@@ -5077,7 +5009,7 @@ exports[`Storyshots UI|Sidebar/ListItemIcon all 1`] = `
 }
 
 .emotion-3 {
-  color: #444444;
+  color: #333333;
 }
 
 .emotion-6 {
@@ -5224,7 +5156,7 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
   line-height: 16px;
   box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
   color: #FFFFFF;
-  background-color: rgba(255,255,255,0.95);
+  background-color: rgba(0,0,0,0.95);
   -webkit-text-decoration: none;
   text-decoration: none;
 }
@@ -5342,52 +5274,15 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  padding: 7px;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #666666;
+  padding: 9px;
+  box-shadow: rgba(51,51,51,0.2) 0 0 0 1px inset;
+  color: rgba(51,51,51,0.7);
   background: transparent;
   position: relative;
   overflow: visible;
   padding: 7px;
 }
 
-.emotion-5:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-5:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-5:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-5 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-5 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-5 svg {
   display: inline-block;
   height: 14px;
@@ -5399,23 +5294,22 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
   pointer-events: none;
 }
 
+.emotion-5 svg path {
+  fill: currentColor;
+}
+
 .emotion-5 svg {
   display: block;
   margin: 0;
 }
 
-.emotion-5 svg path {
-  fill: #666666;
-}
-
 .emotion-5:hover {
-  box-shadow: #999999 0 0 0 1px inset;
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
 }
 
 .emotion-5:active {
-  background: #DDDDDD;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #333333;
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
+  color: #333;
 }
 
 .emotion-8 {
@@ -5668,7 +5562,7 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
   line-height: 16px;
   box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
   color: #FFFFFF;
-  background-color: rgba(255,255,255,0.95);
+  background-color: rgba(0,0,0,0.95);
   -webkit-text-decoration: none;
   text-decoration: none;
 }
@@ -5786,52 +5680,15 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  padding: 7px;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #666666;
+  padding: 9px;
+  box-shadow: rgba(51,51,51,0.2) 0 0 0 1px inset;
+  color: rgba(51,51,51,0.7);
   background: transparent;
   position: relative;
   overflow: visible;
   padding: 7px;
 }
 
-.emotion-5:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-5:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-5:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-5 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-5 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-5 svg {
   display: inline-block;
   height: 14px;
@@ -5843,23 +5700,22 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
   pointer-events: none;
 }
 
+.emotion-5 svg path {
+  fill: currentColor;
+}
+
 .emotion-5 svg {
   display: block;
   margin: 0;
 }
 
-.emotion-5 svg path {
-  fill: #666666;
-}
-
 .emotion-5:hover {
-  box-shadow: #999999 0 0 0 1px inset;
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
 }
 
 .emotion-5:active {
-  background: #DDDDDD;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #333333;
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
+  color: #333;
 }
 
 .emotion-8 {
@@ -6083,7 +5939,7 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
           >
             <path
               d="M53.3 31.7c-1.7 0-3.4-.3-5-.7-1.5-.5-2.8-1.1-3.9-2l1.6-3.5c2.2 1.5 4.6 2.3 7.3 2.3 1.5 0 2.5-.2 3.3-.7.7-.5 1.1-1 1.1-1.9 0-.7-.3-1.3-1-1.7s-2-.8-3.7-1.2c-2-.4-3.6-.9-4.8-1.5-1.1-.5-2-1.2-2.6-2-.5-1-.8-2-.8-3.2 0-1.4.4-2.6 1.2-3.6.7-1.1 1.8-2 3.2-2.6 1.3-.6 2.9-.9 4.7-.9 1.6 0 3.1.3 4.6.7 1.5.5 2.7 1.1 3.5 2l-1.6 3.5c-2-1.5-4.2-2.3-6.5-2.3-1.3 0-2.3.2-3 .8-.8.5-1.2 1.1-1.2 2 0 .5.2 1 .5 1.3.2.3.7.6 1.4.9l2.9.8c2.9.6 5 1.4 6.2 2.4a5 5 0 0 1 2 4.2 6 6 0 0 1-2.5 5c-1.7 1.2-4 1.9-7 1.9zm21-3.6l1.4-.1-.2 3.5-1.9.1c-2.4 0-4.1-.5-5.2-1.5-1.1-1-1.6-2.7-1.6-4.8v-6h-3v-3.6h3V11h4.8v4.6h4v3.6h-4v6c0 1.8.9 2.8 2.6 2.8zm11.1 3.5c-1.6 0-3-.3-4.3-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.3-1 1.7 0 3.2.3 4.4 1a7 7 0 0 1 3 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.4 1zm0-3.6c2.4 0 3.6-1.6 3.6-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.6-1c-2.3 0-3.5 1.4-3.5 4.4 0 3 1.2 4.6 3.5 4.6zm21.7-8.8l-2.7.3c-1.3.2-2.3.5-2.8 1.2-.6.6-.9 1.4-.9 2.5v8.2H96V15.7h4.6v2.6c.8-1.8 2.5-2.8 5-3h1.3l.3 4zm14-3.5h4.8L116.4 37h-4.9l3-6.6-6.4-14.8h5l4 10 4-10zm16-.4c1.4 0 2.6.3 3.6 1 1 .6 1.9 1.6 2.5 2.8.6 1.2.9 2.7.9 4.3 0 1.6-.3 3-1 4.3a6.9 6.9 0 0 1-2.4 2.9c-1 .7-2.2 1-3.6 1-1 0-2-.2-3-.7-.8-.4-1.5-1-2-1.9v2.4h-4.7V8.8h4.8v9c.5-.8 1.2-1.4 2-1.9.9-.4 1.8-.6 3-.6zM135.7 28c1.1 0 2-.4 2.6-1.2.6-.8 1-2 1-3.4 0-1.5-.4-2.5-1-3.3s-1.5-1.1-2.6-1.1-2 .3-2.6 1.1c-.6.8-1 2-1 3.3 0 1.5.4 2.6 1 3.4.6.8 1.5 1.2 2.6 1.2zm18.9 3.6c-1.7 0-3.2-.3-4.4-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.4-1 1.6 0 3 .3 4.3 1a7 7 0 0 1 3 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.3 1zm0-3.6c2.3 0 3.5-1.6 3.5-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.5-1c-2.4 0-3.6 1.4-3.6 4.4 0 3 1.2 4.6 3.6 4.6zm18 3.6c-1.7 0-3.2-.3-4.4-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.4-1 1.6 0 3 .3 4.4 1a7 7 0 0 1 2.9 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.3 1zm0-3.6c2.3 0 3.5-1.6 3.5-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.5-1c-2.4 0-3.6 1.4-3.6 4.4 0 3 1.2 4.6 3.6 4.6zm27.4 3.4h-6l-6-7v7h-4.8V8.8h4.9v13.6l5.8-6.7h5.7l-6.6 7.5 7 8.2z"
-              fill="#333"
+              fill="currentColor"
             />
             <mask
               fill="#fff"
@@ -6506,7 +6362,7 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   line-height: 16px;
   box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
   color: #FFFFFF;
-  background-color: rgba(255,255,255,0.95);
+  background-color: rgba(0,0,0,0.95);
   -webkit-text-decoration: none;
   text-decoration: none;
 }
@@ -6624,52 +6480,15 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  padding: 7px;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #666666;
+  padding: 9px;
+  box-shadow: rgba(51,51,51,0.2) 0 0 0 1px inset;
+  color: rgba(51,51,51,0.7);
   background: transparent;
   position: relative;
   overflow: visible;
   padding: 7px;
 }
 
-.emotion-5:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-5:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-5:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-5 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-5 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-5 svg {
   display: inline-block;
   height: 14px;
@@ -6681,23 +6500,22 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   pointer-events: none;
 }
 
+.emotion-5 svg path {
+  fill: currentColor;
+}
+
 .emotion-5 svg {
   display: block;
   margin: 0;
 }
 
-.emotion-5 svg path {
-  fill: #666666;
-}
-
 .emotion-5:hover {
-  box-shadow: #999999 0 0 0 1px inset;
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
 }
 
 .emotion-5:active {
-  background: #DDDDDD;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #333333;
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
+  color: #333;
 }
 
 .emotion-14 {
@@ -6866,7 +6684,7 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
-  color: rgba(51,51,51,0.8);
+  color: #333333;
 }
 
 .emotion-19:hover {
@@ -6984,7 +6802,7 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   transition: background 75ms ease-out;
   padding-left: 24px;
   cursor: pointer;
-  color: rgba(51,51,51,0.8);
+  color: #333333;
 }
 
 .emotion-29:hover {
@@ -7073,7 +6891,7 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   line-height: 16px;
   box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
   color: #FFFFFF;
-  background-color: rgba(255,255,255,0.95);
+  background-color: rgba(0,0,0,0.95);
   -webkit-text-decoration: none;
   text-decoration: none;
 }
@@ -7191,52 +7009,15 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  padding: 7px;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #666666;
+  padding: 9px;
+  box-shadow: rgba(51,51,51,0.2) 0 0 0 1px inset;
+  color: rgba(51,51,51,0.7);
   background: transparent;
   position: relative;
   overflow: visible;
   padding: 7px;
 }
 
-.emotion-5:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-5:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-5:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-5 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-5 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-5 svg {
   display: inline-block;
   height: 14px;
@@ -7248,23 +7029,22 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   pointer-events: none;
 }
 
+.emotion-5 svg path {
+  fill: currentColor;
+}
+
 .emotion-5 svg {
   display: block;
   margin: 0;
 }
 
-.emotion-5 svg path {
-  fill: #666666;
-}
-
 .emotion-5:hover {
-  box-shadow: #999999 0 0 0 1px inset;
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
 }
 
 .emotion-5:active {
-  background: #DDDDDD;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #333333;
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
+  color: #333;
 }
 
 .emotion-14 {
@@ -7433,7 +7213,7 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
-  color: rgba(51,51,51,0.8);
+  color: #333333;
 }
 
 .emotion-19:hover {
@@ -7551,7 +7331,7 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   transition: background 75ms ease-out;
   padding-left: 24px;
   cursor: pointer;
-  color: rgba(51,51,51,0.8);
+  color: #333333;
 }
 
 .emotion-29:hover {
@@ -7651,7 +7431,7 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
           >
             <path
               d="M53.3 31.7c-1.7 0-3.4-.3-5-.7-1.5-.5-2.8-1.1-3.9-2l1.6-3.5c2.2 1.5 4.6 2.3 7.3 2.3 1.5 0 2.5-.2 3.3-.7.7-.5 1.1-1 1.1-1.9 0-.7-.3-1.3-1-1.7s-2-.8-3.7-1.2c-2-.4-3.6-.9-4.8-1.5-1.1-.5-2-1.2-2.6-2-.5-1-.8-2-.8-3.2 0-1.4.4-2.6 1.2-3.6.7-1.1 1.8-2 3.2-2.6 1.3-.6 2.9-.9 4.7-.9 1.6 0 3.1.3 4.6.7 1.5.5 2.7 1.1 3.5 2l-1.6 3.5c-2-1.5-4.2-2.3-6.5-2.3-1.3 0-2.3.2-3 .8-.8.5-1.2 1.1-1.2 2 0 .5.2 1 .5 1.3.2.3.7.6 1.4.9l2.9.8c2.9.6 5 1.4 6.2 2.4a5 5 0 0 1 2 4.2 6 6 0 0 1-2.5 5c-1.7 1.2-4 1.9-7 1.9zm21-3.6l1.4-.1-.2 3.5-1.9.1c-2.4 0-4.1-.5-5.2-1.5-1.1-1-1.6-2.7-1.6-4.8v-6h-3v-3.6h3V11h4.8v4.6h4v3.6h-4v6c0 1.8.9 2.8 2.6 2.8zm11.1 3.5c-1.6 0-3-.3-4.3-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.3-1 1.7 0 3.2.3 4.4 1a7 7 0 0 1 3 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.4 1zm0-3.6c2.4 0 3.6-1.6 3.6-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.6-1c-2.3 0-3.5 1.4-3.5 4.4 0 3 1.2 4.6 3.5 4.6zm21.7-8.8l-2.7.3c-1.3.2-2.3.5-2.8 1.2-.6.6-.9 1.4-.9 2.5v8.2H96V15.7h4.6v2.6c.8-1.8 2.5-2.8 5-3h1.3l.3 4zm14-3.5h4.8L116.4 37h-4.9l3-6.6-6.4-14.8h5l4 10 4-10zm16-.4c1.4 0 2.6.3 3.6 1 1 .6 1.9 1.6 2.5 2.8.6 1.2.9 2.7.9 4.3 0 1.6-.3 3-1 4.3a6.9 6.9 0 0 1-2.4 2.9c-1 .7-2.2 1-3.6 1-1 0-2-.2-3-.7-.8-.4-1.5-1-2-1.9v2.4h-4.7V8.8h4.8v9c.5-.8 1.2-1.4 2-1.9.9-.4 1.8-.6 3-.6zM135.7 28c1.1 0 2-.4 2.6-1.2.6-.8 1-2 1-3.4 0-1.5-.4-2.5-1-3.3s-1.5-1.1-2.6-1.1-2 .3-2.6 1.1c-.6.8-1 2-1 3.3 0 1.5.4 2.6 1 3.4.6.8 1.5 1.2 2.6 1.2zm18.9 3.6c-1.7 0-3.2-.3-4.4-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.4-1 1.6 0 3 .3 4.3 1a7 7 0 0 1 3 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.3 1zm0-3.6c2.3 0 3.5-1.6 3.5-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.5-1c-2.4 0-3.6 1.4-3.6 4.4 0 3 1.2 4.6 3.6 4.6zm18 3.6c-1.7 0-3.2-.3-4.4-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.4-1 1.6 0 3 .3 4.4 1a7 7 0 0 1 2.9 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.3 1zm0-3.6c2.3 0 3.5-1.6 3.5-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.5-1c-2.4 0-3.6 1.4-3.6 4.4 0 3 1.2 4.6 3.6 4.6zm27.4 3.4h-6l-6-7v7h-4.8V8.8h4.9v13.6l5.8-6.7h5.7l-6.6 7.5 7 8.2z"
-              fill="#333"
+              fill="currentColor"
             />
             <mask
               fill="#fff"
@@ -7989,52 +7769,15 @@ exports[`Storyshots UI|Sidebar/SidebarHeading customBrand 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  padding: 7px;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #666666;
+  padding: 9px;
+  box-shadow: rgba(51,51,51,0.2) 0 0 0 1px inset;
+  color: rgba(51,51,51,0.7);
   background: transparent;
   position: relative;
   overflow: visible;
   padding: 7px;
 }
 
-.emotion-3:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-3:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-3:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-3 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-3 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-3 svg {
   display: inline-block;
   height: 14px;
@@ -8046,23 +7789,22 @@ exports[`Storyshots UI|Sidebar/SidebarHeading customBrand 1`] = `
   pointer-events: none;
 }
 
+.emotion-3 svg path {
+  fill: currentColor;
+}
+
 .emotion-3 svg {
   display: block;
   margin: 0;
 }
 
-.emotion-3 svg path {
-  fill: #666666;
-}
-
 .emotion-3:hover {
-  box-shadow: #999999 0 0 0 1px inset;
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
 }
 
 .emotion-3:active {
-  background: #DDDDDD;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #333333;
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
+  color: #333;
 }
 
 .emotion-5 {
@@ -8138,52 +7880,15 @@ exports[`Storyshots UI|Sidebar/SidebarHeading customBrand 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  padding: 7px;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #666666;
+  padding: 9px;
+  box-shadow: rgba(51,51,51,0.2) 0 0 0 1px inset;
+  color: rgba(51,51,51,0.7);
   background: transparent;
   position: relative;
   overflow: visible;
   padding: 7px;
 }
 
-.emotion-3:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-3:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-3:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-3 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-3 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-3 svg {
   display: inline-block;
   height: 14px;
@@ -8195,23 +7900,22 @@ exports[`Storyshots UI|Sidebar/SidebarHeading customBrand 1`] = `
   pointer-events: none;
 }
 
+.emotion-3 svg path {
+  fill: currentColor;
+}
+
 .emotion-3 svg {
   display: block;
   margin: 0;
 }
 
-.emotion-3 svg path {
-  fill: #666666;
-}
-
 .emotion-3:hover {
-  box-shadow: #999999 0 0 0 1px inset;
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
 }
 
 .emotion-3:active {
-  background: #DDDDDD;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #333333;
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
+  color: #333;
 }
 
 .emotion-5 {
@@ -8418,52 +8122,15 @@ exports[`Storyshots UI|Sidebar/SidebarHeading menuHighlighted 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  padding: 7px;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #666666;
+  padding: 9px;
+  box-shadow: rgba(51,51,51,0.2) 0 0 0 1px inset;
+  color: rgba(51,51,51,0.7);
   background: transparent;
   position: relative;
   overflow: visible;
   padding: 7px;
 }
 
-.emotion-5:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-5:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-5:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-5 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-5 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-5 svg {
   display: inline-block;
   height: 14px;
@@ -8475,23 +8142,22 @@ exports[`Storyshots UI|Sidebar/SidebarHeading menuHighlighted 1`] = `
   pointer-events: none;
 }
 
+.emotion-5 svg path {
+  fill: currentColor;
+}
+
 .emotion-5 svg {
   display: block;
   margin: 0;
 }
 
-.emotion-5 svg path {
-  fill: #666666;
-}
-
 .emotion-5:hover {
-  box-shadow: #999999 0 0 0 1px inset;
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
 }
 
 .emotion-5:active {
-  background: #DDDDDD;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #333333;
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
+  color: #333;
 }
 
 .emotion-5:after {
@@ -8608,52 +8274,15 @@ exports[`Storyshots UI|Sidebar/SidebarHeading menuHighlighted 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  padding: 7px;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #666666;
+  padding: 9px;
+  box-shadow: rgba(51,51,51,0.2) 0 0 0 1px inset;
+  color: rgba(51,51,51,0.7);
   background: transparent;
   position: relative;
   overflow: visible;
   padding: 7px;
 }
 
-.emotion-5:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-5:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-5:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-5 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-5 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-5 svg {
   display: inline-block;
   height: 14px;
@@ -8665,23 +8294,22 @@ exports[`Storyshots UI|Sidebar/SidebarHeading menuHighlighted 1`] = `
   pointer-events: none;
 }
 
+.emotion-5 svg path {
+  fill: currentColor;
+}
+
 .emotion-5 svg {
   display: block;
   margin: 0;
 }
 
-.emotion-5 svg path {
-  fill: #666666;
-}
-
 .emotion-5:hover {
-  box-shadow: #999999 0 0 0 1px inset;
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
 }
 
 .emotion-5:active {
-  background: #DDDDDD;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #333333;
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
+  color: #333;
 }
 
 .emotion-5:after {
@@ -8724,7 +8352,7 @@ exports[`Storyshots UI|Sidebar/SidebarHeading menuHighlighted 1`] = `
         >
           <path
             d="M53.3 31.7c-1.7 0-3.4-.3-5-.7-1.5-.5-2.8-1.1-3.9-2l1.6-3.5c2.2 1.5 4.6 2.3 7.3 2.3 1.5 0 2.5-.2 3.3-.7.7-.5 1.1-1 1.1-1.9 0-.7-.3-1.3-1-1.7s-2-.8-3.7-1.2c-2-.4-3.6-.9-4.8-1.5-1.1-.5-2-1.2-2.6-2-.5-1-.8-2-.8-3.2 0-1.4.4-2.6 1.2-3.6.7-1.1 1.8-2 3.2-2.6 1.3-.6 2.9-.9 4.7-.9 1.6 0 3.1.3 4.6.7 1.5.5 2.7 1.1 3.5 2l-1.6 3.5c-2-1.5-4.2-2.3-6.5-2.3-1.3 0-2.3.2-3 .8-.8.5-1.2 1.1-1.2 2 0 .5.2 1 .5 1.3.2.3.7.6 1.4.9l2.9.8c2.9.6 5 1.4 6.2 2.4a5 5 0 0 1 2 4.2 6 6 0 0 1-2.5 5c-1.7 1.2-4 1.9-7 1.9zm21-3.6l1.4-.1-.2 3.5-1.9.1c-2.4 0-4.1-.5-5.2-1.5-1.1-1-1.6-2.7-1.6-4.8v-6h-3v-3.6h3V11h4.8v4.6h4v3.6h-4v6c0 1.8.9 2.8 2.6 2.8zm11.1 3.5c-1.6 0-3-.3-4.3-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.3-1 1.7 0 3.2.3 4.4 1a7 7 0 0 1 3 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.4 1zm0-3.6c2.4 0 3.6-1.6 3.6-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.6-1c-2.3 0-3.5 1.4-3.5 4.4 0 3 1.2 4.6 3.5 4.6zm21.7-8.8l-2.7.3c-1.3.2-2.3.5-2.8 1.2-.6.6-.9 1.4-.9 2.5v8.2H96V15.7h4.6v2.6c.8-1.8 2.5-2.8 5-3h1.3l.3 4zm14-3.5h4.8L116.4 37h-4.9l3-6.6-6.4-14.8h5l4 10 4-10zm16-.4c1.4 0 2.6.3 3.6 1 1 .6 1.9 1.6 2.5 2.8.6 1.2.9 2.7.9 4.3 0 1.6-.3 3-1 4.3a6.9 6.9 0 0 1-2.4 2.9c-1 .7-2.2 1-3.6 1-1 0-2-.2-3-.7-.8-.4-1.5-1-2-1.9v2.4h-4.7V8.8h4.8v9c.5-.8 1.2-1.4 2-1.9.9-.4 1.8-.6 3-.6zM135.7 28c1.1 0 2-.4 2.6-1.2.6-.8 1-2 1-3.4 0-1.5-.4-2.5-1-3.3s-1.5-1.1-2.6-1.1-2 .3-2.6 1.1c-.6.8-1 2-1 3.3 0 1.5.4 2.6 1 3.4.6.8 1.5 1.2 2.6 1.2zm18.9 3.6c-1.7 0-3.2-.3-4.4-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.4-1 1.6 0 3 .3 4.3 1a7 7 0 0 1 3 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.3 1zm0-3.6c2.3 0 3.5-1.6 3.5-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.5-1c-2.4 0-3.6 1.4-3.6 4.4 0 3 1.2 4.6 3.6 4.6zm18 3.6c-1.7 0-3.2-.3-4.4-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.4-1 1.6 0 3 .3 4.4 1a7 7 0 0 1 2.9 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.3 1zm0-3.6c2.3 0 3.5-1.6 3.5-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.5-1c-2.4 0-3.6 1.4-3.6 4.4 0 3 1.2 4.6 3.6 4.6zm27.4 3.4h-6l-6-7v7h-4.8V8.8h4.9v13.6l5.8-6.7h5.7l-6.6 7.5 7 8.2z"
-            fill="#333"
+            fill="currentColor"
           />
           <mask
             fill="#fff"
@@ -8858,52 +8486,15 @@ exports[`Storyshots UI|Sidebar/SidebarHeading simple 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  padding: 7px;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #666666;
+  padding: 9px;
+  box-shadow: rgba(51,51,51,0.2) 0 0 0 1px inset;
+  color: rgba(51,51,51,0.7);
   background: transparent;
   position: relative;
   overflow: visible;
   padding: 7px;
 }
 
-.emotion-5:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-5:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-5:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-5 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-5 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-5 svg {
   display: inline-block;
   height: 14px;
@@ -8915,23 +8506,22 @@ exports[`Storyshots UI|Sidebar/SidebarHeading simple 1`] = `
   pointer-events: none;
 }
 
+.emotion-5 svg path {
+  fill: currentColor;
+}
+
 .emotion-5 svg {
   display: block;
   margin: 0;
 }
 
-.emotion-5 svg path {
-  fill: #666666;
-}
-
 .emotion-5:hover {
-  box-shadow: #999999 0 0 0 1px inset;
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
 }
 
 .emotion-5:active {
-  background: #DDDDDD;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #333333;
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
+  color: #333;
 }
 
 .emotion-7 {
@@ -9037,52 +8627,15 @@ exports[`Storyshots UI|Sidebar/SidebarHeading simple 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  padding: 7px;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #666666;
+  padding: 9px;
+  box-shadow: rgba(51,51,51,0.2) 0 0 0 1px inset;
+  color: rgba(51,51,51,0.7);
   background: transparent;
   position: relative;
   overflow: visible;
   padding: 7px;
 }
 
-.emotion-5:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-5:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-5:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-5 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-5 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-5 svg {
   display: inline-block;
   height: 14px;
@@ -9094,23 +8647,22 @@ exports[`Storyshots UI|Sidebar/SidebarHeading simple 1`] = `
   pointer-events: none;
 }
 
+.emotion-5 svg path {
+  fill: currentColor;
+}
+
 .emotion-5 svg {
   display: block;
   margin: 0;
 }
 
-.emotion-5 svg path {
-  fill: #666666;
-}
-
 .emotion-5:hover {
-  box-shadow: #999999 0 0 0 1px inset;
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
 }
 
 .emotion-5:active {
-  background: #DDDDDD;
-  box-shadow: #DDDDDD 0 0 0 1px inset;
-  color: #333333;
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
+  color: #333;
 }
 
 .emotion-7 {
@@ -9157,7 +8709,7 @@ exports[`Storyshots UI|Sidebar/SidebarHeading simple 1`] = `
         >
           <path
             d="M53.3 31.7c-1.7 0-3.4-.3-5-.7-1.5-.5-2.8-1.1-3.9-2l1.6-3.5c2.2 1.5 4.6 2.3 7.3 2.3 1.5 0 2.5-.2 3.3-.7.7-.5 1.1-1 1.1-1.9 0-.7-.3-1.3-1-1.7s-2-.8-3.7-1.2c-2-.4-3.6-.9-4.8-1.5-1.1-.5-2-1.2-2.6-2-.5-1-.8-2-.8-3.2 0-1.4.4-2.6 1.2-3.6.7-1.1 1.8-2 3.2-2.6 1.3-.6 2.9-.9 4.7-.9 1.6 0 3.1.3 4.6.7 1.5.5 2.7 1.1 3.5 2l-1.6 3.5c-2-1.5-4.2-2.3-6.5-2.3-1.3 0-2.3.2-3 .8-.8.5-1.2 1.1-1.2 2 0 .5.2 1 .5 1.3.2.3.7.6 1.4.9l2.9.8c2.9.6 5 1.4 6.2 2.4a5 5 0 0 1 2 4.2 6 6 0 0 1-2.5 5c-1.7 1.2-4 1.9-7 1.9zm21-3.6l1.4-.1-.2 3.5-1.9.1c-2.4 0-4.1-.5-5.2-1.5-1.1-1-1.6-2.7-1.6-4.8v-6h-3v-3.6h3V11h4.8v4.6h4v3.6h-4v6c0 1.8.9 2.8 2.6 2.8zm11.1 3.5c-1.6 0-3-.3-4.3-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.3-1 1.7 0 3.2.3 4.4 1a7 7 0 0 1 3 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.4 1zm0-3.6c2.4 0 3.6-1.6 3.6-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.6-1c-2.3 0-3.5 1.4-3.5 4.4 0 3 1.2 4.6 3.5 4.6zm21.7-8.8l-2.7.3c-1.3.2-2.3.5-2.8 1.2-.6.6-.9 1.4-.9 2.5v8.2H96V15.7h4.6v2.6c.8-1.8 2.5-2.8 5-3h1.3l.3 4zm14-3.5h4.8L116.4 37h-4.9l3-6.6-6.4-14.8h5l4 10 4-10zm16-.4c1.4 0 2.6.3 3.6 1 1 .6 1.9 1.6 2.5 2.8.6 1.2.9 2.7.9 4.3 0 1.6-.3 3-1 4.3a6.9 6.9 0 0 1-2.4 2.9c-1 .7-2.2 1-3.6 1-1 0-2-.2-3-.7-.8-.4-1.5-1-2-1.9v2.4h-4.7V8.8h4.8v9c.5-.8 1.2-1.4 2-1.9.9-.4 1.8-.6 3-.6zM135.7 28c1.1 0 2-.4 2.6-1.2.6-.8 1-2 1-3.4 0-1.5-.4-2.5-1-3.3s-1.5-1.1-2.6-1.1-2 .3-2.6 1.1c-.6.8-1 2-1 3.3 0 1.5.4 2.6 1 3.4.6.8 1.5 1.2 2.6 1.2zm18.9 3.6c-1.7 0-3.2-.3-4.4-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.4-1 1.6 0 3 .3 4.3 1a7 7 0 0 1 3 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.3 1zm0-3.6c2.3 0 3.5-1.6 3.5-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.5-1c-2.4 0-3.6 1.4-3.6 4.4 0 3 1.2 4.6 3.6 4.6zm18 3.6c-1.7 0-3.2-.3-4.4-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.4-1 1.6 0 3 .3 4.4 1a7 7 0 0 1 2.9 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.3 1zm0-3.6c2.3 0 3.5-1.6 3.5-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.5-1c-2.4 0-3.6 1.4-3.6 4.4 0 3 1.2 4.6 3.6 4.6zm27.4 3.4h-6l-6-7v7h-4.8V8.8h4.9v13.6l5.8-6.7h5.7l-6.6 7.5 7 8.2z"
-            fill="#333"
+            fill="currentColor"
           />
           <mask
             fill="#fff"
@@ -9229,7 +8781,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem component 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
-  color: rgba(51,51,51,0.8);
+  color: #333333;
 }
 
 .emotion-3:hover {
@@ -9291,7 +8843,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem component 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
-  color: rgba(51,51,51,0.8);
+  color: #333333;
 }
 
 .emotion-3:hover {
@@ -9379,7 +8931,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem componentExpanded 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
-  color: rgba(51,51,51,0.8);
+  color: #333333;
 }
 
 .emotion-3:hover {
@@ -9444,7 +8996,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem componentExpanded 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
-  color: rgba(51,51,51,0.8);
+  color: #333333;
 }
 
 .emotion-3:hover {
@@ -9535,7 +9087,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem group 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
-  color: rgba(51,51,51,0.8);
+  color: #333333;
 }
 
 .emotion-3:hover {
@@ -9597,7 +9149,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem group 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
-  color: rgba(51,51,51,0.8);
+  color: #333333;
 }
 
 .emotion-3:hover {
@@ -9925,7 +9477,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem nestedDepths 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
-  color: rgba(51,51,51,0.8);
+  color: #333333;
 }
 
 .emotion-3:hover {
@@ -10000,7 +9552,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem nestedDepths 1`] = `
   transition: background 75ms ease-out;
   padding-left: 24px;
   cursor: pointer;
-  color: rgba(51,51,51,0.8);
+  color: #333333;
 }
 
 .emotion-11:hover {
@@ -10073,7 +9625,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem nestedDepths 1`] = `
   transition: background 75ms ease-out;
   padding-left: 39px;
   cursor: pointer;
-  color: rgba(51,51,51,0.8);
+  color: #333333;
 }
 
 .emotion-15:hover {
@@ -10103,7 +9655,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem nestedDepths 1`] = `
   transition: background 75ms ease-out;
   padding-left: 54px;
   cursor: pointer;
-  color: rgba(51,51,51,0.8);
+  color: #333333;
 }
 
 .emotion-19:hover {
@@ -10137,7 +9689,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem nestedDepths 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
-  color: rgba(51,51,51,0.8);
+  color: #333333;
 }
 
 .emotion-3:hover {
@@ -10212,7 +9764,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem nestedDepths 1`] = `
   transition: background 75ms ease-out;
   padding-left: 24px;
   cursor: pointer;
-  color: rgba(51,51,51,0.8);
+  color: #333333;
 }
 
 .emotion-11:hover {
@@ -10285,7 +9837,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem nestedDepths 1`] = `
   transition: background 75ms ease-out;
   padding-left: 39px;
   cursor: pointer;
-  color: rgba(51,51,51,0.8);
+  color: #333333;
 }
 
 .emotion-15:hover {
@@ -10315,7 +9867,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem nestedDepths 1`] = `
   transition: background 75ms ease-out;
   padding-left: 54px;
   cursor: pointer;
-  color: rgba(51,51,51,0.8);
+  color: #333333;
 }
 
 .emotion-19:hover {
@@ -10453,7 +10005,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem story 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
-  color: rgba(51,51,51,0.8);
+  color: #333333;
 }
 
 .emotion-3:hover {
@@ -10516,7 +10068,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem story 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
-  color: rgba(51,51,51,0.8);
+  color: #333333;
 }
 
 .emotion-3:hover {
@@ -10753,7 +10305,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem with long name 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
-  color: rgba(51,51,51,0.8);
+  color: #333333;
 }
 
 .emotion-3:hover {
@@ -10815,7 +10367,7 @@ exports[`Storyshots UI|Sidebar/SidebarItem with long name 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
-  color: rgba(51,51,51,0.8);
+  color: #333333;
 }
 
 .emotion-3:hover {
@@ -11745,7 +11297,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories empty 1`] = `
 .emotion-4 {
   padding: 30px;
   text-align: center;
-  color: #666666;
+  color: #333333;
   font-size: 13px;
 }
 
@@ -11757,7 +11309,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories empty 1`] = `
   margin-top: 10px;
 }
 
-.emotion-6 > *:first-child {
+.emotion-6 > *:first-of-type {
   margin-top: 0;
 }
 
@@ -11777,9 +11329,6 @@ exports[`Storyshots UI|Sidebar/SidebarStories empty 1`] = `
 .emotion-2:hover,
 .emotion-2:focus {
   cursor: pointer;
-  -webkit-transform: translate3d(0,-1px,0);
-  -ms-transform: translate3d(0,-1px,0);
-  transform: translate3d(0,-1px,0);
   color: #0297f5;
 }
 
@@ -11789,9 +11338,6 @@ exports[`Storyshots UI|Sidebar/SidebarStories empty 1`] = `
 }
 
 .emotion-2:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
   color: #028ee6;
 }
 
@@ -11812,7 +11358,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories empty 1`] = `
 .emotion-4 {
   padding: 30px;
   text-align: center;
-  color: #666666;
+  color: #333333;
   font-size: 13px;
 }
 
@@ -11824,7 +11370,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories empty 1`] = `
   margin-top: 10px;
 }
 
-.emotion-6 > *:first-child {
+.emotion-6 > *:first-of-type {
   margin-top: 0;
 }
 
@@ -11844,9 +11390,6 @@ exports[`Storyshots UI|Sidebar/SidebarStories empty 1`] = `
 .emotion-2:hover,
 .emotion-2:focus {
   cursor: pointer;
-  -webkit-transform: translate3d(0,-1px,0);
-  -ms-transform: translate3d(0,-1px,0);
-  transform: translate3d(0,-1px,0);
   color: #0297f5;
 }
 
@@ -11856,9 +11399,6 @@ exports[`Storyshots UI|Sidebar/SidebarStories empty 1`] = `
 }
 
 .emotion-2:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
   color: #028ee6;
 }
 
@@ -12128,7 +11668,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories loading 1`] = `
   margin-top: 10px;
 }
 
-.emotion-69 > *:first-child {
+.emotion-69 > *:first-of-type {
   margin-top: 0;
 }
 
@@ -12348,7 +11888,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories loading 1`] = `
   margin-top: 10px;
 }
 
-.emotion-69 > *:first-child {
+.emotion-69 > *:first-of-type {
   margin-top: 0;
 }
 
@@ -12851,7 +12391,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories noRoot 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
-  color: rgba(51,51,51,0.8);
+  color: #333333;
 }
 
 .emotion-10:hover {
@@ -12942,7 +12482,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories noRoot 1`] = `
   transition: background 75ms ease-out;
   padding-left: 24px;
   cursor: pointer;
-  color: rgba(51,51,51,0.8);
+  color: #333333;
 }
 
 .emotion-15:hover {
@@ -13015,7 +12555,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories noRoot 1`] = `
   transition: background 75ms ease-out;
   padding-left: 39px;
   cursor: pointer;
-  color: rgba(51,51,51,0.8);
+  color: #333333;
 }
 
 .emotion-30:hover {
@@ -13027,7 +12567,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories noRoot 1`] = `
   margin-top: 10px;
 }
 
-.emotion-41 > *:first-child {
+.emotion-41 > *:first-of-type {
   margin-top: 0;
 }
 
@@ -13223,7 +12763,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories noRoot 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
-  color: rgba(51,51,51,0.8);
+  color: #333333;
 }
 
 .emotion-10:hover {
@@ -13314,7 +12854,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories noRoot 1`] = `
   transition: background 75ms ease-out;
   padding-left: 24px;
   cursor: pointer;
-  color: rgba(51,51,51,0.8);
+  color: #333333;
 }
 
 .emotion-15:hover {
@@ -13387,7 +12927,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories noRoot 1`] = `
   transition: background 75ms ease-out;
   padding-left: 39px;
   cursor: pointer;
-  color: rgba(51,51,51,0.8);
+  color: #333333;
 }
 
 .emotion-30:hover {
@@ -13399,7 +12939,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories noRoot 1`] = `
   margin-top: 10px;
 }
 
-.emotion-41 > *:first-child {
+.emotion-41 > *:first-of-type {
   margin-top: 0;
 }
 
@@ -13825,7 +13365,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories withRoot 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
-  color: rgba(51,51,51,0.8);
+  color: #333333;
 }
 
 .emotion-11:hover {
@@ -13943,7 +13483,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories withRoot 1`] = `
   transition: background 75ms ease-out;
   padding-left: 24px;
   cursor: pointer;
-  color: rgba(51,51,51,0.8);
+  color: #333333;
 }
 
 .emotion-21:hover {
@@ -13998,7 +13538,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories withRoot 1`] = `
   margin-top: 10px;
 }
 
-.emotion-40 > *:first-child {
+.emotion-40 > *:first-of-type {
   margin-top: 0;
 }
 
@@ -14180,7 +13720,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories withRoot 1`] = `
   transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
-  color: rgba(51,51,51,0.8);
+  color: #333333;
 }
 
 .emotion-11:hover {
@@ -14298,7 +13838,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories withRoot 1`] = `
   transition: background 75ms ease-out;
   padding-left: 24px;
   cursor: pointer;
-  color: rgba(51,51,51,0.8);
+  color: #333333;
 }
 
 .emotion-21:hover {
@@ -14353,7 +13893,7 @@ exports[`Storyshots UI|Sidebar/SidebarStories withRoot 1`] = `
   margin-top: 10px;
 }
 
-.emotion-40 > *:first-child {
+.emotion-40 > *:first-of-type {
   margin-top: 0;
 }
 
diff --git a/lib/client-api/package.json b/lib/client-api/package.json
index 623e1755e37..067e7512d1a 100644
--- a/lib/client-api/package.json
+++ b/lib/client-api/package.json
@@ -22,6 +22,7 @@
     "@storybook/addons": "5.0.0-rc.3",
     "@storybook/client-logger": "5.0.0-rc.3",
     "@storybook/core-events": "5.0.0-rc.3",
+    "@storybook/router": "5.0.0-rc.3",
     "common-tags": "^1.8.0",
     "eventemitter3": "^3.1.0",
     "global": "^4.3.2",
diff --git a/lib/client-api/src/client_api.js b/lib/client-api/src/client_api.js
index 00af49f1697..a1e259d139e 100644
--- a/lib/client-api/src/client_api.js
+++ b/lib/client-api/src/client_api.js
@@ -4,11 +4,12 @@ import isPlainObject from 'is-plain-object';
 import { logger } from '@storybook/client-logger';
 import addons from '@storybook/addons';
 import Events from '@storybook/core-events';
+import { toId } from '@storybook/router/utils';
+
 import mergeWith from 'lodash.mergewith';
 import isEqual from 'lodash.isequal';
 
 import subscriptionsStore from './subscriptions_store';
-import toId from './id';
 
 // merge with concatenating arrays, but no duplicates
 const merge = (a, b) =>
diff --git a/lib/client-api/src/id.js b/lib/client-api/src/id.js
deleted file mode 100644
index 8357b9478d4..00000000000
--- a/lib/client-api/src/id.js
+++ /dev/null
@@ -1,29 +0,0 @@
-// NOTE: this file is common to both `lib/ui` (manager) and `lib/core` (preview).
-// For now it is reproduced in both places (ick) rather than create a new package.
-// We should figure out what we are doing here.
-
-// Create a id/slug compatible string from an arbitrary string. We:
-//   1. replace all non-alphanumerics with '-', and downcase.
-//   2. replace all runs of '-' with a single '-',
-//        except if they are at the end, in which case, replace them with ''
-
-export function sanitize(string) {
-  return string
-    .toLowerCase()
-    .replace(/[^a-z0-9-]/g, '-')
-    .replace(/-+/g, '-')
-    .replace(/^-+/, '')
-    .replace(/-+$/, '');
-}
-
-function sanitizeSafe(string, part) {
-  const sanitized = sanitize(string);
-  if (sanitized === '') {
-    throw new Error(`Invalid ${part} '${string}', must include alphanumeric characters`);
-  }
-  return sanitized;
-}
-
-export default function toId(kind, story) {
-  return `${sanitizeSafe(kind, 'kind')}--${sanitizeSafe(story, 'story')}`;
-}
diff --git a/lib/client-api/src/index.js b/lib/client-api/src/index.js
index 80195ad8173..4cc48ab9503 100644
--- a/lib/client-api/src/index.js
+++ b/lib/client-api/src/index.js
@@ -2,7 +2,6 @@ import ClientApi, { defaultDecorateStory } from './client_api';
 import StoryStore, { splitPath } from './story_store';
 import ConfigApi from './config_api';
 import subscriptionsStore from './subscriptions_store';
-import toId, { sanitize } from './id';
 import pathToId from './pathToId';
 
 export {
@@ -11,8 +10,6 @@ export {
   ConfigApi,
   subscriptionsStore,
   defaultDecorateStory,
-  toId,
-  sanitize,
   pathToId,
   splitPath,
 };
diff --git a/lib/client-api/src/story_store.js b/lib/client-api/src/story_store.js
index b7dce29d0bb..1ae162cc5ba 100644
--- a/lib/client-api/src/story_store.js
+++ b/lib/client-api/src/story_store.js
@@ -8,8 +8,8 @@ import { stripIndents } from 'common-tags';
 
 import Events from '@storybook/core-events';
 import { logger } from '@storybook/client-logger';
+import { toId } from '@storybook/router/utils';
 
-import toId from './id';
 import pathToId from './pathToId';
 
 // TODO: these are copies from components/nav/lib
@@ -282,7 +282,7 @@ export default class StoryStore extends EventEmitter {
     }
 
     const { story } = data;
-    return () => story();
+    return story;
   }
 
   removeStoryKind(kind) {
diff --git a/lib/client-api/src/story_store.test.js b/lib/client-api/src/story_store.test.js
index fdf93daff1e..095c79ef440 100644
--- a/lib/client-api/src/story_store.test.js
+++ b/lib/client-api/src/story_store.test.js
@@ -1,10 +1,10 @@
 import { history, document } from 'global';
 import createChannel from '@storybook/channel-postmessage';
 import Events from '@storybook/core-events';
+import { toId } from '@storybook/router/utils';
 
 import StoryStore from './story_store';
 import { defaultDecorateStory } from './client_api';
-import toId from './id';
 
 jest.mock('global', () => ({
   history: { replaceState: jest.fn() },
diff --git a/lib/components/src/syntaxhighlighter/syntaxhighlighter.js b/lib/components/src/syntaxhighlighter/syntaxhighlighter.js
index 4ecc053983d..01617d5ec22 100644
--- a/lib/components/src/syntaxhighlighter/syntaxhighlighter.js
+++ b/lib/components/src/syntaxhighlighter/syntaxhighlighter.js
@@ -1,4 +1,4 @@
-import React, { PureComponent } from 'react';
+import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 import { styled } from '@storybook/theming';
 import { document, window } from 'global';
@@ -63,7 +63,7 @@ const Code = styled.code({
   opacity: 1,
 });
 
-export default class CopyableCode extends PureComponent {
+export default class CopyableCode extends Component {
   state = { copied: false };
 
   formatCode = memoize(2)((language, code) => {
@@ -111,6 +111,7 @@ export default class CopyableCode extends PureComponent {
       copyable,
       bordered,
       padded,
+      format,
       className,
       ...rest
     } = this.props;
@@ -128,7 +129,7 @@ export default class CopyableCode extends PureComponent {
             lineNumberContainerStyle={{}}
             {...rest}
           >
-            {this.formatCode(language, children.trim())}
+            {format ? this.formatCode(language, children.trim()) : children.trim()}
           </SyntaxHighlighter>
         </Scroller>
         {copyable ? (
@@ -145,6 +146,7 @@ CopyableCode.propTypes = {
   copyable: PropTypes.bool,
   bordered: PropTypes.bool,
   padded: PropTypes.bool,
+  format: PropTypes.bool,
   className: PropTypes.string,
 };
 
@@ -152,5 +154,6 @@ CopyableCode.defaultProps = {
   copyable: false,
   bordered: false,
   padded: false,
+  format: true,
   className: null,
 };
diff --git a/lib/components/src/tooltip/__snapshots__/TooltipMessage.stories.storyshot b/lib/components/src/tooltip/__snapshots__/TooltipMessage.stories.storyshot
index c9f5e1161da..77a33766ec1 100644
--- a/lib/components/src/tooltip/__snapshots__/TooltipMessage.stories.storyshot
+++ b/lib/components/src/tooltip/__snapshots__/TooltipMessage.stories.storyshot
@@ -203,9 +203,6 @@ exports[`Storyshots basics/Tooltip/TooltipMessage with link 1`] = `
 .emotion-6:hover,
 .emotion-6:focus {
   cursor: pointer;
-  -webkit-transform: translate3d(0,-1px,0);
-  -ms-transform: translate3d(0,-1px,0);
-  transform: translate3d(0,-1px,0);
   color: #0297f5;
 }
 
@@ -215,9 +212,6 @@ exports[`Storyshots basics/Tooltip/TooltipMessage with link 1`] = `
 }
 
 .emotion-6:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
   color: #028ee6;
 }
 
@@ -370,9 +364,6 @@ exports[`Storyshots basics/Tooltip/TooltipMessage with links 1`] = `
 .emotion-6:hover,
 .emotion-6:focus {
   cursor: pointer;
-  -webkit-transform: translate3d(0,-1px,0);
-  -ms-transform: translate3d(0,-1px,0);
-  transform: translate3d(0,-1px,0);
   color: #0297f5;
 }
 
@@ -382,9 +373,6 @@ exports[`Storyshots basics/Tooltip/TooltipMessage with links 1`] = `
 }
 
 .emotion-6:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
   color: #028ee6;
 }
 
diff --git a/lib/components/src/tooltip/__snapshots__/WithTooltip.stories.storyshot b/lib/components/src/tooltip/__snapshots__/WithTooltip.stories.storyshot
index 06bafb3626b..7f3adb7675e 100644
--- a/lib/components/src/tooltip/__snapshots__/WithTooltip.stories.storyshot
+++ b/lib/components/src/tooltip/__snapshots__/WithTooltip.stories.storyshot
@@ -175,9 +175,6 @@ exports[`Storyshots basics/Tooltip/WithTooltip simple click start open 1`] = `
 .emotion-8:hover,
 .emotion-8:focus {
   cursor: pointer;
-  -webkit-transform: translate3d(0,-1px,0);
-  -ms-transform: translate3d(0,-1px,0);
-  transform: translate3d(0,-1px,0);
   color: #0297f5;
 }
 
@@ -187,9 +184,6 @@ exports[`Storyshots basics/Tooltip/WithTooltip simple click start open 1`] = `
 }
 
 .emotion-8:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
   color: #028ee6;
 }
 
diff --git a/lib/components/src/typography/link/__snapshots__/link.stories.storyshot b/lib/components/src/typography/link/__snapshots__/link.stories.storyshot
index 32e2e18e9eb..d43a0dd939d 100644
--- a/lib/components/src/typography/link/__snapshots__/link.stories.storyshot
+++ b/lib/components/src/typography/link/__snapshots__/link.stories.storyshot
@@ -17,9 +17,6 @@ exports[`Storyshots Basics|Link cancel w/ href 1`] = `
 .emotion-1:hover,
 .emotion-1:focus {
   cursor: pointer;
-  -webkit-transform: translate3d(0,-1px,0);
-  -ms-transform: translate3d(0,-1px,0);
-  transform: translate3d(0,-1px,0);
   color: #0297f5;
 }
 
@@ -29,9 +26,6 @@ exports[`Storyshots Basics|Link cancel w/ href 1`] = `
 }
 
 .emotion-1:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
   color: #028ee6;
 }
 
@@ -78,9 +72,6 @@ exports[`Storyshots Basics|Link cancel w/ onClick 1`] = `
 .emotion-1:hover,
 .emotion-1:focus {
   cursor: pointer;
-  -webkit-transform: translate3d(0,-1px,0);
-  -ms-transform: translate3d(0,-1px,0);
-  transform: translate3d(0,-1px,0);
   color: #0297f5;
 }
 
@@ -90,9 +81,6 @@ exports[`Storyshots Basics|Link cancel w/ onClick 1`] = `
 }
 
 .emotion-1:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
   color: #028ee6;
 }
 
@@ -139,9 +127,6 @@ exports[`Storyshots Basics|Link no-cancel w/ href 1`] = `
 .emotion-1:hover,
 .emotion-1:focus {
   cursor: pointer;
-  -webkit-transform: translate3d(0,-1px,0);
-  -ms-transform: translate3d(0,-1px,0);
-  transform: translate3d(0,-1px,0);
   color: #0297f5;
 }
 
@@ -151,9 +136,6 @@ exports[`Storyshots Basics|Link no-cancel w/ href 1`] = `
 }
 
 .emotion-1:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
   color: #028ee6;
 }
 
@@ -200,9 +182,6 @@ exports[`Storyshots Basics|Link no-cancel w/ onClick 1`] = `
 .emotion-1:hover,
 .emotion-1:focus {
   cursor: pointer;
-  -webkit-transform: translate3d(0,-1px,0);
-  -ms-transform: translate3d(0,-1px,0);
-  transform: translate3d(0,-1px,0);
   color: #0297f5;
 }
 
@@ -212,9 +191,6 @@ exports[`Storyshots Basics|Link no-cancel w/ onClick 1`] = `
 }
 
 .emotion-1:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
   color: #028ee6;
 }
 
@@ -273,9 +249,6 @@ exports[`Storyshots Basics|Link styled links 1`] = `
 .emotion-1:hover,
 .emotion-1:focus {
   cursor: pointer;
-  -webkit-transform: translate3d(0,-1px,0);
-  -ms-transform: translate3d(0,-1px,0);
-  transform: translate3d(0,-1px,0);
   color: #0297f5;
 }
 
@@ -285,9 +258,6 @@ exports[`Storyshots Basics|Link styled links 1`] = `
 }
 
 .emotion-1:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
   color: #028ee6;
 }
 
@@ -322,9 +292,6 @@ exports[`Storyshots Basics|Link styled links 1`] = `
 .emotion-3:hover,
 .emotion-3:focus {
   cursor: pointer;
-  -webkit-transform: translate3d(0,-1px,0);
-  -ms-transform: translate3d(0,-1px,0);
-  transform: translate3d(0,-1px,0);
   color: #0297f5;
 }
 
@@ -334,9 +301,6 @@ exports[`Storyshots Basics|Link styled links 1`] = `
 }
 
 .emotion-3:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
   color: #028ee6;
 }
 
@@ -391,9 +355,6 @@ exports[`Storyshots Basics|Link styled links 1`] = `
 .emotion-5:hover,
 .emotion-5:focus {
   cursor: pointer;
-  -webkit-transform: translate3d(0,-1px,0);
-  -ms-transform: translate3d(0,-1px,0);
-  transform: translate3d(0,-1px,0);
   color: #0297f5;
 }
 
@@ -403,9 +364,6 @@ exports[`Storyshots Basics|Link styled links 1`] = `
 }
 
 .emotion-5:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
   color: #028ee6;
 }
 
@@ -460,9 +418,6 @@ exports[`Storyshots Basics|Link styled links 1`] = `
 .emotion-7:hover,
 .emotion-7:focus {
   cursor: pointer;
-  -webkit-transform: translate3d(0,-1px,0);
-  -ms-transform: translate3d(0,-1px,0);
-  transform: translate3d(0,-1px,0);
   color: #0297f5;
 }
 
@@ -472,9 +427,6 @@ exports[`Storyshots Basics|Link styled links 1`] = `
 }
 
 .emotion-7:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
   color: #028ee6;
 }
 
@@ -543,9 +495,6 @@ exports[`Storyshots Basics|Link styled links 1`] = `
 .emotion-21:hover,
 .emotion-21:focus {
   cursor: pointer;
-  -webkit-transform: translate3d(0,-1px,0);
-  -ms-transform: translate3d(0,-1px,0);
-  transform: translate3d(0,-1px,0);
   color: #0297f5;
 }
 
@@ -555,9 +504,6 @@ exports[`Storyshots Basics|Link styled links 1`] = `
 }
 
 .emotion-21:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
   color: #028ee6;
 }
 
diff --git a/lib/components/src/typography/link/link.js b/lib/components/src/typography/link/link.js
index 40ef6ba9333..60beb306164 100644
--- a/lib/components/src/typography/link/link.js
+++ b/lib/components/src/typography/link/link.js
@@ -31,14 +31,12 @@ const linkStyles = props => css`
   &:hover,
   &:focus {
     cursor: pointer;
-    transform: translate3d(0, -1px, 0);
     color: ${darken(0.07, props.theme.color.secondary)};
     svg path {
       fill: ${darken(0.07, props.theme.color.secondary)};
     }
   }
   &:active {
-    transform: translate3d(0, 0, 0);
     color: ${darken(0.1, props.theme.color.secondary)};
     svg path {
       fill: ${darken(0.1, props.theme.color.secondary)};
diff --git a/lib/core/package.json b/lib/core/package.json
index cbe13f26d03..aedfb89b29a 100644
--- a/lib/core/package.json
+++ b/lib/core/package.json
@@ -30,6 +30,7 @@
     "@storybook/client-logger": "5.0.0-rc.3",
     "@storybook/core-events": "5.0.0-rc.3",
     "@storybook/node-logger": "5.0.0-rc.3",
+    "@storybook/router": "5.0.0-rc.3",
     "@storybook/theming": "5.0.0-rc.3",
     "@storybook/ui": "5.0.0-rc.3",
     "airbnb-js-shims": "^1 || ^2",
diff --git a/lib/core/src/client/preview/index.js b/lib/core/src/client/preview/index.js
index 7f33a12c4be..5fd9ec35687 100644
--- a/lib/core/src/client/preview/index.js
+++ b/lib/core/src/client/preview/index.js
@@ -1,10 +1,11 @@
-import { ClientApi, StoryStore, ConfigApi, toId } from '@storybook/client-api';
+import { ClientApi, StoryStore, ConfigApi } from '@storybook/client-api';
+import { toId } from '@storybook/router/utils';
 import start from './start';
 
 export default {
   start,
+  toId,
   ClientApi,
   ConfigApi,
   StoryStore,
-  toId,
 };
diff --git a/lib/core/src/client/preview/start.js b/lib/core/src/client/preview/start.js
index b4da2b35267..670293398e9 100644
--- a/lib/core/src/client/preview/start.js
+++ b/lib/core/src/client/preview/start.js
@@ -1,7 +1,8 @@
 import addons from '@storybook/addons';
 import { navigator, window, document } from 'global';
 import createChannel from '@storybook/channel-postmessage';
-import { ClientApi, StoryStore, ConfigApi, toId } from '@storybook/client-api';
+import { ClientApi, StoryStore, ConfigApi } from '@storybook/client-api';
+import { toId } from '@storybook/router/utils';
 import { logger } from '@storybook/client-logger';
 import Events from '@storybook/core-events';
 import deprecate from 'util-deprecate';
diff --git a/lib/router/src/router.tsx b/lib/router/src/router.tsx
index 242535f805f..bb3d87d6e8e 100644
--- a/lib/router/src/router.tsx
+++ b/lib/router/src/router.tsx
@@ -1,3 +1,4 @@
+import { document } from 'global';
 import React from 'react';
 
 import { Link, Location, navigate, LocationProvider } from '@reach/router';
@@ -55,15 +56,15 @@ interface QueryLinkProps {
   children: React.ReactNode;
 }
 
-const base = document.location.pathname + '?';
+const getBase = () => document.location.pathname + '?';
 
 const queryNavigate = (to: string) => {
-  navigate(`${base}path=${to}`);
+  navigate(`${getBase()}path=${to}`);
 };
 
 // A component that will navigate to a new location/path when clicked
 const QueryLink = ({ to, children, ...rest }: QueryLinkProps) => (
-  <Link to={`${base}path=${to}`} {...rest}>
+  <Link to={`${getBase()}path=${to}`} {...rest}>
     {children}
   </Link>
 );
diff --git a/lib/client-api/src/id.test.js b/lib/router/src/tests/id.test.js
similarity index 83%
rename from lib/client-api/src/id.test.js
rename to lib/router/src/tests/id.test.js
index c97c0a8ba1f..f65c6c414fe 100644
--- a/lib/client-api/src/id.test.js
+++ b/lib/router/src/tests/id.test.js
@@ -1,4 +1,4 @@
-import toId from './id';
+import { toId } from '../utils';
 
 describe('toId', () => {
   [
@@ -26,13 +26,11 @@ describe('toId', () => {
 
   it('does not allow story with *no* url chars', () => {
     expect(() => toId('kind', '?')).toThrow(
-      `Invalid story '?', must include alphanumeric characters`
+      `Invalid name '?', must include alphanumeric characters`
     );
   });
 
   it('does not allow empty story', () => {
-    expect(() => toId('kind', '')).toThrow(
-      `Invalid story '', must include alphanumeric characters`
-    );
+    expect(() => toId('kind', '')).toThrow(`Invalid name '', must include alphanumeric characters`);
   });
 });
diff --git a/lib/router/src/typings.d.ts b/lib/router/src/typings.d.ts
index 82736aa8e1e..e78abbafc83 100644
--- a/lib/router/src/typings.d.ts
+++ b/lib/router/src/typings.d.ts
@@ -1,3 +1,4 @@
 // todo the following packages need definition files or a TS migration
 declare module 'qs';
+declare module 'global';
 declare module '@reach/router';
diff --git a/lib/router/src/utils.ts b/lib/router/src/utils.ts
index f9a2962a5e8..a0659d3b31a 100644
--- a/lib/router/src/utils.ts
+++ b/lib/router/src/utils.ts
@@ -9,6 +9,25 @@ interface StoryData {
 const knownViewModesRegex = /(story|info)/;
 const splitPath = /\/([^/]+)\/([^/]+)?/;
 
+export const sanitize = (string: string) => {
+  return string
+    .toLowerCase()
+    .replace(/[^a-z0-9-]/g, '-')
+    .replace(/-+/g, '-')
+    .replace(/^-+/, '')
+    .replace(/-+$/, '');
+};
+
+const sanitizeSafe = (string: string, part: string) => {
+  const sanitized = sanitize(string);
+  if (sanitized === '') {
+    throw new Error(`Invalid ${part} '${string}', must include alphanumeric characters`);
+  }
+  return sanitized;
+};
+
+export const toId = (kind: string, name: string) => `${sanitizeSafe(kind, 'kind')}--${sanitizeSafe(name, 'name')}`;
+
 export const storyDataFromString: (path: string) => StoryData = memoize(1000)((path: string | undefined | null) => {
   const result: StoryData = {
     viewMode: undefined,
diff --git a/lib/router/utils.js b/lib/router/utils.js
new file mode 100644
index 00000000000..4dcd9ca05ac
--- /dev/null
+++ b/lib/router/utils.js
@@ -0,0 +1 @@
+module.exports = require('./dist/utils');
diff --git a/lib/ui/src/components/layout/layout.stories.js b/lib/ui/src/components/layout/layout.stories.js
index 4d36bf13da7..c11cc9004c1 100644
--- a/lib/ui/src/components/layout/layout.stories.js
+++ b/lib/ui/src/components/layout/layout.stories.js
@@ -21,6 +21,7 @@ const realNavProps = {
   url: 'https://example.com',
   notifications: [],
   stories: mockDataset.withRoot,
+  menu: [],
 };
 
 const PlaceholderBlock = styled.div(({ color }) => ({
diff --git a/lib/ui/src/core/stories.js b/lib/ui/src/core/stories.js
index d67e82e2928..8eb896bf6df 100644
--- a/lib/ui/src/core/stories.js
+++ b/lib/ui/src/core/stories.js
@@ -1,6 +1,6 @@
 import mergeWith from 'lodash.mergewith';
 import isEqual from 'lodash.isequal';
-import toId, { sanitize } from '../libs/id';
+import { toId, sanitize } from '@storybook/router/utils';
 
 const merge = (a, b) =>
   mergeWith({}, a, b, (objValue, srcValue) => {
diff --git a/lib/ui/src/core/url.js b/lib/ui/src/core/url.js
index 2268baf2ff1..91f3806e571 100644
--- a/lib/ui/src/core/url.js
+++ b/lib/ui/src/core/url.js
@@ -1,5 +1,5 @@
 import { queryFromLocation } from '@storybook/router';
-import toId from '../libs/id';
+import { toId } from '@storybook/router/utils';
 
 // Initialize the state based on the URL.
 // NOTE:
diff --git a/lib/ui/src/libs/id.js b/lib/ui/src/libs/id.js
deleted file mode 100644
index 8357b9478d4..00000000000
--- a/lib/ui/src/libs/id.js
+++ /dev/null
@@ -1,29 +0,0 @@
-// NOTE: this file is common to both `lib/ui` (manager) and `lib/core` (preview).
-// For now it is reproduced in both places (ick) rather than create a new package.
-// We should figure out what we are doing here.
-
-// Create a id/slug compatible string from an arbitrary string. We:
-//   1. replace all non-alphanumerics with '-', and downcase.
-//   2. replace all runs of '-' with a single '-',
-//        except if they are at the end, in which case, replace them with ''
-
-export function sanitize(string) {
-  return string
-    .toLowerCase()
-    .replace(/[^a-z0-9-]/g, '-')
-    .replace(/-+/g, '-')
-    .replace(/^-+/, '')
-    .replace(/-+$/, '');
-}
-
-function sanitizeSafe(string, part) {
-  const sanitized = sanitize(string);
-  if (sanitized === '') {
-    throw new Error(`Invalid ${part} '${string}', must include alphanumeric characters`);
-  }
-  return sanitized;
-}
-
-export default function toId(kind, story) {
-  return `${sanitizeSafe(kind, 'kind')}--${sanitizeSafe(story, 'story')}`;
-}
diff --git a/lib/ui/src/libs/id.test.js b/lib/ui/src/libs/id.test.js
deleted file mode 100644
index c97c0a8ba1f..00000000000
--- a/lib/ui/src/libs/id.test.js
+++ /dev/null
@@ -1,38 +0,0 @@
-import toId from './id';
-
-describe('toId', () => {
-  [
-    // name, kind, story, output
-    ['handles simple cases', 'kind', 'story', 'kind--story'],
-    ['handles basic substitution', 'a b$c?d😀e', '1-2:3', 'a-b-c-d-e--1-2-3'],
-    ['handles runs of non-url chars', 'a?&*b', 'story', 'a-b--story'],
-    ['removes non-url chars from start and end', '?ab-', 'story', 'ab--story'],
-    ['downcases', 'KIND', 'STORY', 'kind--story'],
-  ].forEach(([name, kind, story, output]) => {
-    it(name, () => {
-      expect(toId(kind, story)).toBe(output);
-    });
-  });
-
-  it('does not allow kind with *no* url chars', () => {
-    expect(() => toId('?', 'asdf')).toThrow(
-      `Invalid kind '?', must include alphanumeric characters`
-    );
-  });
-
-  it('does not allow empty kind', () => {
-    expect(() => toId('', 'asdf')).toThrow(`Invalid kind '', must include alphanumeric characters`);
-  });
-
-  it('does not allow story with *no* url chars', () => {
-    expect(() => toId('kind', '?')).toThrow(
-      `Invalid story '?', must include alphanumeric characters`
-    );
-  });
-
-  it('does not allow empty story', () => {
-    expect(() => toId('kind', '')).toThrow(
-      `Invalid story '', must include alphanumeric characters`
-    );
-  });
-});
diff --git a/lib/ui/src/settings/__snapshots__/about.stories.storyshot b/lib/ui/src/settings/__snapshots__/about.stories.storyshot
index d822ee8dc84..6b355b24dd0 100644
--- a/lib/ui/src/settings/__snapshots__/about.stories.storyshot
+++ b/lib/ui/src/settings/__snapshots__/about.stories.storyshot
@@ -1,156 +1,208 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Storyshots UI|Settings/AboutScreen failed to fetch new version 1`] = `
+.emotion-26 {
+  width: 100%;
+  height: 100%;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+}
+
+.emotion-8 {
+  color: #999999;
+  height: 40px;
+  overflow: auto;
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-8::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+}
+
+.emotion-8::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-8::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-8::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
+}
+
+.emotion-7 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+  position: relative;
+  white-space: nowrap;
+  height: 40px;
+}
+
+.emotion-2 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+}
+
+.emotion-2 > * {
+  margin-left: 15px;
+}
+
+.emotion-1 {
+  overflow: hidden;
+}
+
+.emotion-1:first-of-type {
+  margin-left: 0;
+}
+
+.emotion-0 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
+  font-size: 13px;
+  color: #1EA7FD;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-0:empty {
+  display: none;
+}
+
+.emotion-0:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-6 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  margin-left: 30px;
+}
+
+.emotion-6 > * {
+  margin-right: 15px;
+}
+
+.emotion-5 {
+  height: 40px;
+  background: none;
+  color: inherit;
+  padding: 0;
+  cursor: pointer;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+}
+
+.emotion-5:hover,
+.emotion-5:focus {
+  outline: 0 none;
+  color: #1EA7FD;
+}
+
+.emotion-5 > svg {
+  width: 15px;
+}
+
+.emotion-4 {
+  shape-rendering: inherit;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  display: block;
+}
+
+.emotion-3 {
+  fill: currentColor;
+}
+
 .emotion-25 {
-  width: 100%;
-  height: 100%;
-  box-sizing: border-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-}
-
-.emotion-7 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-pack: justify;
-  -webkit-justify-content: space-between;
-  -ms-flex-pack: justify;
-  justify-content: space-between;
-  background: #FFFFFF;
-  color: #999999;
-  height: 40px;
-  position: relative;
-  overflow: visible;
-  overflow-x: visible;
-  overflow-y: visible;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
-}
-
-.emotion-2 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-}
-
-.emotion-2 > * {
-  margin-left: 15px;
-}
-
-.emotion-1 {
-  white-space: nowrap;
-  height: 100%;
-  padding-bottom: 50px;
-  overflow-x: visisble;
-  overflow-y: visisble;
-}
-
-.emotion-1:first-child {
-  margin-left: 0;
-}
-
-.emotion-0 {
-  white-space: normal;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding: 0 15px;
-  text-transform: capitalize;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  height: 40px;
-  line-height: 12px;
-  cursor: pointer;
-  background: transparent;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  font-weight: bold;
-  font-size: 13px;
-  color: #1EA7FD;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-0:empty {
-  display: none;
-}
-
-.emotion-0:focus {
-  outline: 0 none;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-6 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-}
-
-.emotion-6 > * {
-  margin-right: 15px;
-}
-
-.emotion-5 {
-  height: 40px;
-  background: none;
-  color: inherit;
-  padding: 0;
-  cursor: pointer;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-}
-
-.emotion-5:hover,
-.emotion-5:focus {
-  outline: 0 none;
-  color: #1EA7FD;
-}
-
-.emotion-5 > svg {
-  width: 15px;
-}
-
-.emotion-4 {
-  shape-rendering: inherit;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  display: block;
-}
-
-.emotion-3 {
-  fill: currentColor;
-}
-
-.emotion-24 {
   display: block;
   position: relative;
   font-size: 13px;
@@ -162,645 +214,6 @@ exports[`Storyshots UI|Settings/AboutScreen failed to fetch new version 1`] = `
   width: 100%;
 }
 
-.emotion-13 {
-  display: inline-block;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  color: #1EA7FD;
-}
-
-.emotion-13 svg path {
-  fill: #1EA7FD;
-}
-
-.emotion-13:hover,
-.emotion-13:focus {
-  cursor: pointer;
-  -webkit-transform: translate3d(0,-1px,0);
-  -ms-transform: translate3d(0,-1px,0);
-  transform: translate3d(0,-1px,0);
-  color: #0297f5;
-}
-
-.emotion-13:hover svg path,
-.emotion-13:focus svg path {
-  fill: #0297f5;
-}
-
-.emotion-13:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  color: #028ee6;
-}
-
-.emotion-13:active svg path {
-  fill: #028ee6;
-}
-
-.emotion-13 svg {
-  display: inline-block;
-  height: 1em;
-  width: 1em;
-  vertical-align: text-top;
-  position: relative;
-  bottom: -0.125em;
-  margin-right: 0.4em;
-}
-
-.emotion-21 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  padding-top: 20px;
-  margin-top: 20px;
-  border-top: 1px solid rgba(0,0,0,.1);
-  font-weight: 700;
-}
-
-.emotion-21 > * + * {
-  margin-left: 20px;
-}
-
-.emotion-16 {
-  display: inline-block;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  color: #1EA7FD;
-  color: #999999;
-}
-
-.emotion-16 svg path {
-  fill: #1EA7FD;
-}
-
-.emotion-16:hover,
-.emotion-16:focus {
-  cursor: pointer;
-  -webkit-transform: translate3d(0,-1px,0);
-  -ms-transform: translate3d(0,-1px,0);
-  transform: translate3d(0,-1px,0);
-  color: #0297f5;
-}
-
-.emotion-16:hover svg path,
-.emotion-16:focus svg path {
-  fill: #0297f5;
-}
-
-.emotion-16:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  color: #028ee6;
-}
-
-.emotion-16:active svg path {
-  fill: #028ee6;
-}
-
-.emotion-16 svg {
-  display: inline-block;
-  height: 1em;
-  width: 1em;
-  vertical-align: text-top;
-  position: relative;
-  bottom: -0.125em;
-  margin-right: 0.4em;
-}
-
-.emotion-16 svg path {
-  fill: #999999;
-}
-
-.emotion-16:hover {
-  color: #666666;
-}
-
-.emotion-16:hover svg path {
-  fill: #666666;
-}
-
-.emotion-16:active {
-  color: #444444;
-}
-
-.emotion-16:active svg path {
-  fill: #444444;
-}
-
-.emotion-23 {
-  display: block;
-}
-
-.emotion-22 {
-  padding: 3rem 20px;
-  max-width: 600px;
-  margin: 0 auto;
-}
-
-.emotion-8 {
-  margin-bottom: 20px;
-  font-size: 28px;
-  font-weight: 900;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-}
-
-.emotion-8 > svg {
-  height: 32px;
-  width: auto;
-  margin-right: 8px;
-}
-
-.emotion-12 > svg:last-of-type {
-  height: 0.7em;
-  width: 0.7em;
-  margin-right: 0;
-  margin-left: 0.25em;
-  bottom: auto;
-  vertical-align: inherit;
-}
-
-.emotion-9 {
-  background: #FEDED2;
-  color: #FF4400;
-  font-weight: 700;
-  padding: 10px 20px;
-  margin-bottom: 24px;
-  border: 1px solid rgba(0,0,0,.1);
-  text-align: center;
-}
-
-.emotion-14 {
-  font-weight: 700;
-  text-align: center;
-}
-
-<div
-  class="emotion-25"
->
-  <div
-    class="emotion-7"
-  >
-    <div
-      class="emotion-2"
-    >
-      <div
-        class="emotion-1"
-        role="tablist"
-      >
-        <button
-          class="emotion-0"
-          role="tab"
-          type="button"
-        >
-          About
-        </button>
-      </div>
-    </div>
-    <div
-      class="emotion-6"
-    >
-      <button
-        class="emotion-5"
-      >
-        <svg
-          class="emotion-4"
-          viewBox="0 0 1024 1024"
-        >
-          <path
-            class="emotion-3"
-            d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
-          />
-        </svg>
-      </button>
-    </div>
-  </div>
-  <div
-    class="emotion-24"
-  >
-    <div
-      class="emotion-23"
-      role="tabpanel"
-    >
-      <div
-        class="emotion-22"
-      >
-        <header
-          class="emotion-8"
-        >
-          <svg
-            title="Storybook icon"
-            viewBox="0 0 64 64"
-          >
-            <g
-              fill="none"
-              fill-rule="evenodd"
-              id="Artboard"
-              stroke="none"
-              stroke-width="1"
-            >
-              <path
-                d="M8.04798541,58.7875918 L6.07908839,6.32540407 C6.01406344,4.5927838 7.34257463,3.12440831 9.07303814,3.01625434 L53.6958037,0.227331489 C55.457209,0.117243658 56.974354,1.45590096 57.0844418,3.21730626 C57.0885895,3.28366922 57.0906648,3.35014546 57.0906648,3.41663791 L57.0906648,60.5834697 C57.0906648,62.3483119 55.6599776,63.7789992 53.8951354,63.7789992 C53.847325,63.7789992 53.7995207,63.7779262 53.7517585,63.775781 L11.0978899,61.8600599 C9.43669044,61.7854501 8.11034889,60.4492961 8.04798541,58.7875918 Z"
-                fill="#FF4785"
-                fill-rule="nonzero"
-                id="path-1"
-              />
-              <path
-                d="M35.9095005,24.1768792 C35.9095005,25.420127 44.2838488,24.8242707 45.4080313,23.9509748 C45.4080313,15.4847538 40.8652557,11.0358878 32.5466666,11.0358878 C24.2280775,11.0358878 19.5673077,15.553972 19.5673077,22.3311017 C19.5673077,34.1346028 35.4965208,34.3605071 35.4965208,40.7987804 C35.4965208,42.606015 34.6115646,43.6790606 32.6646607,43.6790606 C30.127786,43.6790606 29.1248356,42.3834613 29.2428298,37.9783269 C29.2428298,37.0226907 19.5673077,36.7247626 19.2723223,37.9783269 C18.5211693,48.6535354 25.1720308,51.7326752 32.7826549,51.7326752 C40.1572906,51.7326752 45.939005,47.8018145 45.939005,40.6858282 C45.939005,28.035186 29.7738035,28.3740425 29.7738035,22.1051974 C29.7738035,19.5637737 31.6617103,19.2249173 32.7826549,19.2249173 C33.9625966,19.2249173 36.0864917,19.4328883 35.9095005,24.1768792 Z"
-                fill="#FFFFFF"
-                fill-rule="nonzero"
-                id="path9_fill-path"
-              />
-              <path
-                d="M44.0461638,0.830433986 L50.1874092,0.446606143 L50.443532,7.7810017 C50.4527198,8.04410717 50.2468789,8.26484453 49.9837734,8.27403237 C49.871115,8.27796649 49.7607078,8.24184808 49.6721567,8.17209069 L47.3089847,6.3104681 L44.5110468,8.43287463 C44.3012992,8.591981 44.0022839,8.55092814 43.8431776,8.34118051 C43.7762017,8.25288717 43.742082,8.14401677 43.7466857,8.03329059 L44.0461638,0.830433986 Z"
-                fill="#FFFFFF"
-                id="Path"
-              />
-            </g>
-          </svg>
-          Storybook 5.0.0
-        </header>
-        <div
-          class="emotion-9"
-        >
-          Oops! The latest version of Storybook couldn't be fetched.
-        </div>
-        <div
-          class="emotion-14"
-        >
-          <a
-            class="emotion-13"
-            href="https://github.com/storybooks/storybook/releases"
-            target="_blank"
-          >
-            <span
-              class="emotion-12"
-            >
-              Check Storybook's release history
-              <svg
-                class="emotion-4"
-                viewBox="0 0 1024 1024"
-              >
-                <path
-                  class="emotion-3"
-                  d="M768.072 514.022c0 10.236-3.904 20.47-11.712 28.282l-344.098 344.156c-15.62 15.624-40.946 15.624-56.568 0.006-15.622-15.622-15.624-40.948-0.006-56.568l315.82-315.876-315.868-315.922c-15.618-15.624-15.618-40.952 0.004-56.568 15.624-15.62 40.95-15.618 56.57 0.006l344.144 344.204c7.81 7.81 11.714 18.044 11.714 28.28z"
-                />
-              </svg>
-            </span>
-          </a>
-        </div>
-        <div
-          class="emotion-21"
-        >
-          <a
-            class="emotion-16"
-            href="https://storybook.js.org"
-          >
-            <span
-              class="emotion-15"
-            >
-              Docs
-            </span>
-          </a>
-          <a
-            class="emotion-16"
-            href="https://github.com/storybooks/storybook"
-          >
-            <span
-              class="emotion-15"
-            >
-              GitHub
-            </span>
-          </a>
-          <a
-            class="emotion-16"
-            href="https://storybook.js.org/support"
-          >
-            <span
-              class="emotion-15"
-            >
-              Support
-            </span>
-          </a>
-        </div>
-      </div>
-    </div>
-  </div>
-</div>
-`;
-
-exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
-.emotion-41 {
-  width: 100%;
-  height: 100%;
-  box-sizing: border-box;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-}
-
-.emotion-7 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-pack: justify;
-  -webkit-justify-content: space-between;
-  -ms-flex-pack: justify;
-  justify-content: space-between;
-  background: #FFFFFF;
-  color: #999999;
-  height: 40px;
-  position: relative;
-  overflow: visible;
-  overflow-x: visible;
-  overflow-y: visible;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
-}
-
-.emotion-2 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-}
-
-.emotion-2 > * {
-  margin-left: 15px;
-}
-
-.emotion-1 {
-  white-space: nowrap;
-  height: 100%;
-  padding-bottom: 50px;
-  overflow-x: visisble;
-  overflow-y: visisble;
-}
-
-.emotion-1:first-child {
-  margin-left: 0;
-}
-
-.emotion-0 {
-  white-space: normal;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding: 0 15px;
-  text-transform: capitalize;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  height: 40px;
-  line-height: 12px;
-  cursor: pointer;
-  background: transparent;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  font-weight: bold;
-  font-size: 13px;
-  color: #1EA7FD;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-0:empty {
-  display: none;
-}
-
-.emotion-0:focus {
-  outline: 0 none;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-6 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-}
-
-.emotion-6 > * {
-  margin-right: 15px;
-}
-
-.emotion-5 {
-  height: 40px;
-  background: none;
-  color: inherit;
-  padding: 0;
-  cursor: pointer;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-}
-
-.emotion-5:hover,
-.emotion-5:focus {
-  outline: 0 none;
-  color: #1EA7FD;
-}
-
-.emotion-5 > svg {
-  width: 15px;
-}
-
-.emotion-4 {
-  shape-rendering: inherit;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  display: block;
-}
-
-.emotion-3 {
-  fill: currentColor;
-}
-
-.emotion-40 {
-  display: block;
-  position: relative;
-  font-size: 13px;
-  position: relative;
-  overflow: auto;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  width: 100%;
-}
-
-.emotion-37 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  padding-top: 20px;
-  margin-top: 20px;
-  border-top: 1px solid rgba(0,0,0,.1);
-  font-weight: 700;
-}
-
-.emotion-37 > * + * {
-  margin-left: 20px;
-}
-
-.emotion-32 {
-  display: inline-block;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  color: #1EA7FD;
-  color: #999999;
-}
-
-.emotion-32 svg path {
-  fill: #1EA7FD;
-}
-
-.emotion-32:hover,
-.emotion-32:focus {
-  cursor: pointer;
-  -webkit-transform: translate3d(0,-1px,0);
-  -ms-transform: translate3d(0,-1px,0);
-  transform: translate3d(0,-1px,0);
-  color: #0297f5;
-}
-
-.emotion-32:hover svg path,
-.emotion-32:focus svg path {
-  fill: #0297f5;
-}
-
-.emotion-32:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  color: #028ee6;
-}
-
-.emotion-32:active svg path {
-  fill: #028ee6;
-}
-
-.emotion-32 svg {
-  display: inline-block;
-  height: 1em;
-  width: 1em;
-  vertical-align: text-top;
-  position: relative;
-  bottom: -0.125em;
-  margin-right: 0.4em;
-}
-
-.emotion-32 svg path {
-  fill: #999999;
-}
-
-.emotion-32:hover {
-  color: #666666;
-}
-
-.emotion-32:hover svg path {
-  fill: #666666;
-}
-
-.emotion-32:active {
-  color: #444444;
-}
-
-.emotion-32:active svg path {
-  fill: #444444;
-}
-
-.emotion-39 {
-  display: block;
-}
-
-.emotion-38 {
-  padding: 3rem 20px;
-  max-width: 600px;
-  margin: 0 auto;
-}
-
-.emotion-8 {
-  margin-bottom: 20px;
-  font-size: 28px;
-  font-weight: 900;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-}
-
-.emotion-8 > svg {
-  height: 32px;
-  width: auto;
-  margin-right: 8px;
-}
-
-.emotion-15 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-pack: justify;
-  -webkit-justify-content: space-between;
-  -ms-flex-pack: justify;
-  justify-content: space-between;
-}
-
-.emotion-10 {
-  -webkit-letter-spacing: 0.35em;
-  -moz-letter-spacing: 0.35em;
-  -ms-letter-spacing: 0.35em;
-  letter-spacing: 0.35em;
-  text-transform: uppercase;
-  font-weight: 900;
-  font-size: 13px;
-  line-height: 24px;
-  color: #999999;
-}
-
 .emotion-14 {
   display: inline-block;
   -webkit-transition: all 150ms ease-out;
@@ -808,8 +221,6 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   -webkit-text-decoration: none;
   text-decoration: none;
   color: #1EA7FD;
-  color: #999999;
-  font-size: 12px;
 }
 
 .emotion-14 svg path {
@@ -819,9 +230,6 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
 .emotion-14:hover,
 .emotion-14:focus {
   cursor: pointer;
-  -webkit-transform: translate3d(0,-1px,0);
-  -ms-transform: translate3d(0,-1px,0);
-  transform: translate3d(0,-1px,0);
   color: #0297f5;
 }
 
@@ -831,9 +239,6 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
 }
 
 .emotion-14:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
   color: #028ee6;
 }
 
@@ -851,26 +256,114 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   margin-right: 0.4em;
 }
 
-.emotion-14 svg path {
+.emotion-22 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  padding-top: 20px;
+  margin-top: 20px;
+  border-top: 1px solid rgba(0,0,0,.1);
+  font-weight: 700;
+}
+
+.emotion-22 > * + * {
+  margin-left: 20px;
+}
+
+.emotion-17 {
+  display: inline-block;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: #1EA7FD;
+  color: #999999;
+}
+
+.emotion-17 svg path {
+  fill: #1EA7FD;
+}
+
+.emotion-17:hover,
+.emotion-17:focus {
+  cursor: pointer;
+  color: #0297f5;
+}
+
+.emotion-17:hover svg path,
+.emotion-17:focus svg path {
+  fill: #0297f5;
+}
+
+.emotion-17:active {
+  color: #028ee6;
+}
+
+.emotion-17:active svg path {
+  fill: #028ee6;
+}
+
+.emotion-17 svg {
+  display: inline-block;
+  height: 1em;
+  width: 1em;
+  vertical-align: text-top;
+  position: relative;
+  bottom: -0.125em;
+  margin-right: 0.4em;
+}
+
+.emotion-17 svg path {
   fill: #999999;
 }
 
-.emotion-14:hover {
+.emotion-17:hover {
   color: #666666;
 }
 
-.emotion-14:hover svg path {
+.emotion-17:hover svg path {
   fill: #666666;
 }
 
-.emotion-14:active {
+.emotion-17:active {
   color: #444444;
 }
 
-.emotion-14:active svg path {
+.emotion-17:active svg path {
   fill: #444444;
 }
 
+.emotion-24 {
+  display: block;
+}
+
+.emotion-23 {
+  padding: 3rem 20px;
+  max-width: 600px;
+  margin: 0 auto;
+}
+
+.emotion-9 {
+  margin-bottom: 20px;
+  font-size: 28px;
+  font-weight: 900;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+}
+
+.emotion-9 > svg {
+  height: 32px;
+  width: auto;
+  margin-right: 8px;
+}
+
 .emotion-13 > svg:last-of-type {
   height: 0.7em;
   width: 0.7em;
@@ -880,445 +373,9 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   vertical-align: inherit;
 }
 
-.emotion-16 {
-  font-size: 14px;
-  line-height: 1.6;
-}
-
-.emotion-16 h1 {
-  font-size: 32px;
-  font-weight: 900;
-}
-
-.emotion-16 h2 {
-  font-size: 24px;
-  border-bottom: 1px solid rgba(0,0,0,.1);
-}
-
-.emotion-16 h3 {
-  font-size: 20px;
-}
-
-.emotion-16 h4 {
-  font-size: 16px;
-}
-
-.emotion-16 h5 {
-  font-size: 14px;
-}
-
-.emotion-16 h6 {
-  font-size: 14px;
-  color: #666666;
-}
-
-.emotion-16 pre:not(.hljs) {
-  background: transparent;
-  border: none;
-  border-radius: 0;
-  padding: 0;
-  margin: 0;
-}
-
-.emotion-16 pre pre,
-.emotion-16 pre.hljs {
-  padding: 15px;
-  margin: 0;
-  overflow: auto;
-  white-space: pre-wrap;
-  color: #333333;
-  font-size: 13px;
-  line-height: 19px;
-}
-
-.emotion-16 pre pre code,
-.emotion-16 pre.hljs code {
-  color: inherit;
-  font-size: inherit;
-}
-
-.emotion-16 pre code {
-  margin: 0;
-  padding: 0;
-  white-space: pre;
-  border: none;
-  background: transparent;
-}
-
-.emotion-16 pre code,
-.emotion-16 pre tt {
-  background-color: transparent;
-  border: none;
-}
-
-.emotion-16 body > *:first-child {
-  margin-top: 0 !important;
-}
-
-.emotion-16 body > *:last-child {
-  margin-bottom: 0 !important;
-}
-
-.emotion-16 a {
-  color: #1EA7FD;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-}
-
-.emotion-16 a.absent {
-  color: #cc0000;
-}
-
-.emotion-16 a.anchor {
-  display: block;
-  padding-left: 30px;
-  margin-left: -30px;
-  cursor: pointer;
-  position: absolute;
-  top: 0;
-  left: 0;
-  bottom: 0;
-}
-
-.emotion-16 h1,
-.emotion-16 h2,
-.emotion-16 h3,
-.emotion-16 h4,
-.emotion-16 h5,
-.emotion-16 h6 {
-  margin: 20px 0 10px;
-  padding: 0;
-  cursor: text;
-  position: relative;
-}
-
-.emotion-16 h2:first-child,
-.emotion-16 h1:first-child,
-.emotion-16 h1:first-child + h2,
-.emotion-16 h3:first-child,
-.emotion-16 h4:first-child,
-.emotion-16 h5:first-child,
-.emotion-16 h6:first-child {
-  margin-top: 0;
-  padding-top: 0;
-}
-
-.emotion-16 h1:hover a.anchor,
-.emotion-16 h2:hover a.anchor,
-.emotion-16 h3:hover a.anchor,
-.emotion-16 h4:hover a.anchor,
-.emotion-16 h5:hover a.anchor,
-.emotion-16 h6:hover a.anchor {
-  -webkit-text-decoration: none;
-  text-decoration: none;
-}
-
-.emotion-16 h1 tt,
-.emotion-16 h1 code {
-  font-size: inherit;
-}
-
-.emotion-16 h2 tt,
-.emotion-16 h2 code {
-  font-size: inherit;
-}
-
-.emotion-16 h3 tt,
-.emotion-16 h3 code {
-  font-size: inherit;
-}
-
-.emotion-16 h4 tt,
-.emotion-16 h4 code {
-  font-size: inherit;
-}
-
-.emotion-16 h5 tt,
-.emotion-16 h5 code {
-  font-size: inherit;
-}
-
-.emotion-16 h6 tt,
-.emotion-16 h6 code {
-  font-size: inherit;
-}
-
-.emotion-16 p,
-.emotion-16 blockquote,
-.emotion-16 ul,
-.emotion-16 ol,
-.emotion-16 dl,
-.emotion-16 li,
-.emotion-16 table,
-.emotion-16 pre {
-  margin: 15px 0;
-}
-
-.emotion-16 hr {
-  border: 0 none;
-  color: rgba(0,0,0,.1);
-  height: 4px;
-  padding: 0;
-}
-
-.emotion-16 body > h2:first-child {
-  margin-top: 0;
-  padding-top: 0;
-}
-
-.emotion-16 body > h1:first-child {
-  margin-top: 0;
-  padding-top: 0;
-}
-
-.emotion-16 body > h1:first-child + h2 {
-  margin-top: 0;
-  padding-top: 0;
-}
-
-.emotion-16 body > h3:first-child,
-.emotion-16 body > h4:first-child,
-.emotion-16 body > h5:first-child,
-.emotion-16 body > h6:first-child {
-  margin-top: 0;
-  padding-top: 0;
-}
-
-.emotion-16 a:first-child h1,
-.emotion-16 a:first-child h2,
-.emotion-16 a:first-child h3,
-.emotion-16 a:first-child h4,
-.emotion-16 a:first-child h5,
-.emotion-16 a:first-child h6 {
-  margin-top: 0;
-  padding-top: 0;
-}
-
-.emotion-16 h1 p,
-.emotion-16 h2 p,
-.emotion-16 h3 p,
-.emotion-16 h4 p,
-.emotion-16 h5 p,
-.emotion-16 h6 p {
-  margin-top: 0;
-}
-
-.emotion-16 li p.first {
-  display: inline-block;
-}
-
-.emotion-16 ul,
-.emotion-16 ol {
-  padding-left: 30px;
-}
-
-.emotion-16 ul :first-child,
-.emotion-16 ol :first-child {
-  margin-top: 0;
-}
-
-.emotion-16 ul :last-child,
-.emotion-16 ol :last-child {
-  margin-bottom: 0;
-}
-
-.emotion-16 dl {
-  padding: 0;
-}
-
-.emotion-16 dl dt {
-  font-size: 14px;
-  font-weight: bold;
-  font-style: italic;
-  padding: 0;
-  margin: 15px 0 5px;
-}
-
-.emotion-16 dl dt:first-child {
-  padding: 0;
-}
-
-.emotion-16 dl dt > :first-child {
-  margin-top: 0;
-}
-
-.emotion-16 dl dt > :last-child {
-  margin-bottom: 0;
-}
-
-.emotion-16 dl dd {
-  margin: 0 0 15px;
-  padding: 0 15px;
-}
-
-.emotion-16 dl dd > :first-child {
-  margin-top: 0;
-}
-
-.emotion-16 dl dd > :last-child {
-  margin-bottom: 0;
-}
-
-.emotion-16 blockquote {
-  border-left: 4px solid #DDDDDD;
-  padding: 0 15px;
-  color: #666666;
-}
-
-.emotion-16 blockquote > :first-child {
-  margin-top: 0;
-}
-
-.emotion-16 blockquote > :last-child {
-  margin-bottom: 0;
-}
-
-.emotion-16 table {
-  padding: 0;
-  border-collapse: collapse;
-}
-
-.emotion-16 table tr {
-  border-top: 1px solid rgba(0,0,0,.1);
-  background-color: white;
-  margin: 0;
-  padding: 0;
-}
-
-.emotion-16 table tr:nth-child(2n) {
-  background-color: #F8F8F8;
-}
-
-.emotion-16 table tr th {
-  font-weight: bold;
-  border: 1px solid rgba(0,0,0,.1);
-  text-align: left;
-  margin: 0;
-  padding: 6px 13px;
-}
-
-.emotion-16 table tr td {
-  border: 1px solid rgba(0,0,0,.1);
-  text-align: left;
-  margin: 0;
-  padding: 6px 13px;
-}
-
-.emotion-16 table tr th :first-child,
-.emotion-16 table tr td :first-child {
-  margin-top: 0;
-}
-
-.emotion-16 table tr th :last-child,
-.emotion-16 table tr td :last-child {
-  margin-bottom: 0;
-}
-
-.emotion-16 img {
-  max-width: 100%;
-}
-
-.emotion-16 span.frame {
-  display: block;
-  overflow: hidden;
-}
-
-.emotion-16 span.frame > span {
-  border: 1px solid #DDDDDD;
-  display: block;
-  float: left;
-  overflow: hidden;
-  margin: 13px 0 0;
-  padding: 7px;
-  width: auto;
-}
-
-.emotion-16 span.frame span img {
-  display: block;
-  float: left;
-}
-
-.emotion-16 span.frame span span {
-  clear: both;
-  color: #333333;
-  display: block;
-  padding: 5px 0 0;
-}
-
-.emotion-16 span.align-center {
-  display: block;
-  overflow: hidden;
-  clear: both;
-}
-
-.emotion-16 span.align-center > span {
-  display: block;
-  overflow: hidden;
-  margin: 13px auto 0;
-  text-align: center;
-}
-
-.emotion-16 span.align-center span img {
-  margin: 0 auto;
-  text-align: center;
-}
-
-.emotion-16 span.align-right {
-  display: block;
-  overflow: hidden;
-  clear: both;
-}
-
-.emotion-16 span.align-right > span {
-  display: block;
-  overflow: hidden;
-  margin: 13px 0 0;
-  text-align: right;
-}
-
-.emotion-16 span.align-right span img {
-  margin: 0;
-  text-align: right;
-}
-
-.emotion-16 span.float-left {
-  display: block;
-  margin-right: 13px;
-  overflow: hidden;
-  float: left;
-}
-
-.emotion-16 span.float-left span {
-  margin: 13px 0 0;
-}
-
-.emotion-16 span.float-right {
-  display: block;
-  margin-left: 13px;
-  overflow: hidden;
-  float: right;
-}
-
-.emotion-16 span.float-right > span {
-  display: block;
-  overflow: hidden;
-  margin: 13px auto 0;
-  text-align: right;
-}
-
-.emotion-16 code,
-.emotion-16 tt {
-  margin: 0 2px;
-  padding: 0 5px;
-  white-space: nowrap;
-  border: 1px solid #EEEEEE;
-  background-color: #F8F8F8;
-  border-radius: 3px;
-}
-
-.emotion-9 {
-  background: #E1FFD4;
-  color: #66BF3C;
+.emotion-10 {
+  background: #FEDED2;
+  color: #FF4400;
   font-weight: 700;
   padding: 10px 20px;
   margin-bottom: 24px;
@@ -1326,293 +383,71 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   text-align: center;
 }
 
-.emotion-30 {
-  margin-top: 20px;
-  padding-bottom: 20px;
-  border-top: 1px solid rgba(0,0,0,.1);
-}
-
-.emotion-22 {
-  position: relative;
-  overflow: hidden;
-  border: 1px solid rgba(0,0,0,.1);
-}
-
-.emotion-19 {
-  position: relative;
-  overflow: auto;
-}
-
-.emotion-19 code {
-  padding-right: 10px;
-}
-
-.emotion-19 * .token {
-  font-family: "Operator Mono","Fira Code Retina","Fira Code","FiraCode-Retina","Andale Mono","Lucida Console",Consolas,Monaco,monospace;
-  -webkit-font-smoothing: antialiased;
-}
-
-.emotion-19 * .token.comment {
-  color: #008000;
-  font-style: italic;
-}
-
-.emotion-19 * .token.prolog {
-  color: #008000;
-  font-style: italic;
-}
-
-.emotion-19 * .token.doctype {
-  color: #008000;
-  font-style: italic;
-}
-
-.emotion-19 * .token.cdata {
-  color: #008000;
-  font-style: italic;
-}
-
-.emotion-19 * .token.string {
-  color: #A31515;
-}
-
-.emotion-19 * .token.punctuation {
-  color: #393A34;
-}
-
-.emotion-19 * .token.operator {
-  color: #393A34;
-}
-
-.emotion-19 * .token.url {
-  color: #36acaa;
-}
-
-.emotion-19 * .token.symbol {
-  color: #36acaa;
-}
-
-.emotion-19 * .token.number {
-  color: #36acaa;
-}
-
-.emotion-19 * .token.boolean {
-  color: #36acaa;
-}
-
-.emotion-19 * .token.variable {
-  color: #36acaa;
-}
-
-.emotion-19 * .token.constant {
-  color: #36acaa;
-}
-
-.emotion-19 * .token.inserted {
-  color: #36acaa;
-}
-
-.emotion-19 * .token.atrule {
-  color: #0000ff;
-}
-
-.emotion-19 * .token.keyword {
-  color: #0000ff;
-}
-
-.emotion-19 * .token.attr-value {
-  color: #0000ff;
-}
-
-.emotion-19 * .token.function {
-  color: #393A34;
-}
-
-.emotion-19 * .token.deleted {
-  color: #9a050f;
-}
-
-.emotion-19 * .token.important {
-  font-weight: bold;
-}
-
-.emotion-19 * .token.bold {
-  font-weight: bold;
-}
-
-.emotion-19 * .token.italic {
-  font-style: italic;
-}
-
-.emotion-19 * .token.class-name {
-  color: #2B91AF;
-}
-
-.emotion-19 * .token.tag {
-  color: #800000;
-}
-
-.emotion-19 * .token.selector {
-  color: #800000;
-}
-
-.emotion-19 * .token.attr-name {
-  color: #ff0000;
-}
-
-.emotion-19 * .token.property {
-  color: #ff0000;
-}
-
-.emotion-19 * .token.regex {
-  color: #ff0000;
-}
-
-.emotion-19 * .token.entity {
-  color: #ff0000;
-}
-
-.emotion-19 * .token.directive.tag .tag {
-  background: #ffff00;
-  color: #393A34;
-}
-
-.emotion-19 * .language-json .token.boolean {
-  color: #0000ff;
-}
-
-.emotion-19 * .language-json .token.number {
-  color: #0000ff;
-}
-
-.emotion-19 * .language-json .token.property {
-  color: #2B91AF;
-}
-
-.emotion-19 * .namespace {
-  opacity: 0.7;
-}
-
-.emotion-18 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-pack: start;
-  -webkit-justify-content: flex-start;
-  -ms-flex-pack: start;
-  justify-content: flex-start;
-  margin: 0;
-  padding: 10px;
-}
-
-.emotion-17 {
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  padding-right: 0;
-  opacity: 1;
-}
-
-.emotion-21 {
-  position: absolute;
-  bottom: 0;
-  right: 0;
-  max-width: 100%;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-}
-
-.emotion-20 {
-  border: 0 none;
-  padding: 4px 10px;
-  cursor: pointer;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  color: #666666;
-  font-size: 12px;
-  line-height: 16px;
+.emotion-15 {
   font-weight: 700;
-  border-top: 1px solid rgba(0,0,0,.1);
-  border-left: 1px solid rgba(0,0,0,.1);
-  margin-left: -1px;
-  border-radius: 4px 0 0 0;
-}
-
-.emotion-20:not(:last-child) {
-  border-right: 1px solid rgba(0,0,0,.1);
-}
-
-.emotion-20 + * {
-  border-left: 1px solid rgba(0,0,0,.1);
-  border-radius: 0;
-}
-
-.emotion-20:focus {
-  box-shadow: #1EA7FD 0 -3px 0 0 inset;
-  outline: 0 none;
+  text-align: center;
 }
 
 <div
-  class="emotion-41"
+  class="emotion-26"
+  title="wrapper"
 >
   <div
-    class="emotion-7"
+    class="emotion-8"
+    title="bar"
   >
     <div
-      class="emotion-2"
+      class="emotion-7"
     >
       <div
-        class="emotion-1"
-        role="tablist"
+        class="emotion-2"
+        title="side left"
+      >
+        <div
+          class="emotion-1"
+          role="tablist"
+        >
+          <button
+            class="emotion-0"
+            role="tab"
+            type="button"
+          >
+            About
+          </button>
+        </div>
+      </div>
+      <div
+        class="emotion-6"
+        title="side right"
       >
         <button
-          class="emotion-0"
-          role="tab"
-          type="button"
+          class="emotion-5"
         >
-          About
+          <svg
+            class="emotion-4"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-3"
+              d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
+            />
+          </svg>
         </button>
       </div>
     </div>
-    <div
-      class="emotion-6"
-    >
-      <button
-        class="emotion-5"
-      >
-        <svg
-          class="emotion-4"
-          viewBox="0 0 1024 1024"
-        >
-          <path
-            class="emotion-3"
-            d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
-          />
-        </svg>
-      </button>
-    </div>
   </div>
   <div
-    class="emotion-40"
+    class="emotion-25"
   >
     <div
-      class="emotion-39"
+      class="emotion-24"
       role="tabpanel"
     >
       <div
-        class="emotion-38"
+        class="emotion-23"
       >
         <header
-          class="emotion-8"
+          class="emotion-9"
         >
           <svg
             title="Storybook icon"
@@ -1647,25 +482,1288 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
           Storybook 5.0.0
         </header>
         <div
-          class="emotion-9"
+          class="emotion-10"
         >
-          Storybook 5.0.3 is available. Upgrade from 5.0.0 now.
+          Oops! The latest version of Storybook couldn't be fetched.
         </div>
         <div
           class="emotion-15"
         >
-          <span
-            class="emotion-10"
-          >
-            5.0.3 Changelog
-          </span>
           <a
             class="emotion-14"
-            href="https://github.com/storybooks/storybook/blob/master/CHANGELOG.md"
+            href="https://github.com/storybooks/storybook/releases"
             target="_blank"
           >
             <span
               class="emotion-13"
+            >
+              Check Storybook's release history
+              <svg
+                class="emotion-4"
+                viewBox="0 0 1024 1024"
+              >
+                <path
+                  class="emotion-3"
+                  d="M768.072 514.022c0 10.236-3.904 20.47-11.712 28.282l-344.098 344.156c-15.62 15.624-40.946 15.624-56.568 0.006-15.622-15.622-15.624-40.948-0.006-56.568l315.82-315.876-315.868-315.922c-15.618-15.624-15.618-40.952 0.004-56.568 15.624-15.62 40.95-15.618 56.57 0.006l344.144 344.204c7.81 7.81 11.714 18.044 11.714 28.28z"
+                />
+              </svg>
+            </span>
+          </a>
+        </div>
+        <div
+          class="emotion-22"
+        >
+          <a
+            class="emotion-17"
+            href="https://storybook.js.org"
+          >
+            <span
+              class="emotion-16"
+            >
+              Docs
+            </span>
+          </a>
+          <a
+            class="emotion-17"
+            href="https://github.com/storybooks/storybook"
+          >
+            <span
+              class="emotion-16"
+            >
+              GitHub
+            </span>
+          </a>
+          <a
+            class="emotion-17"
+            href="https://storybook.js.org/support"
+          >
+            <span
+              class="emotion-16"
+            >
+              Support
+            </span>
+          </a>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+`;
+
+exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
+.emotion-42 {
+  width: 100%;
+  height: 100%;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+}
+
+.emotion-8 {
+  color: #999999;
+  height: 40px;
+  overflow: auto;
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-8::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+}
+
+.emotion-8::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-8::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-8::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
+}
+
+.emotion-7 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+  position: relative;
+  white-space: nowrap;
+  height: 40px;
+}
+
+.emotion-2 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+}
+
+.emotion-2 > * {
+  margin-left: 15px;
+}
+
+.emotion-1 {
+  overflow: hidden;
+}
+
+.emotion-1:first-of-type {
+  margin-left: 0;
+}
+
+.emotion-0 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
+  font-size: 13px;
+  color: #1EA7FD;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-0:empty {
+  display: none;
+}
+
+.emotion-0:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-6 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  margin-left: 30px;
+}
+
+.emotion-6 > * {
+  margin-right: 15px;
+}
+
+.emotion-5 {
+  height: 40px;
+  background: none;
+  color: inherit;
+  padding: 0;
+  cursor: pointer;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+}
+
+.emotion-5:hover,
+.emotion-5:focus {
+  outline: 0 none;
+  color: #1EA7FD;
+}
+
+.emotion-5 > svg {
+  width: 15px;
+}
+
+.emotion-4 {
+  shape-rendering: inherit;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  display: block;
+}
+
+.emotion-3 {
+  fill: currentColor;
+}
+
+.emotion-41 {
+  display: block;
+  position: relative;
+  font-size: 13px;
+  position: relative;
+  overflow: auto;
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  width: 100%;
+}
+
+.emotion-38 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  padding-top: 20px;
+  margin-top: 20px;
+  border-top: 1px solid rgba(0,0,0,.1);
+  font-weight: 700;
+}
+
+.emotion-38 > * + * {
+  margin-left: 20px;
+}
+
+.emotion-33 {
+  display: inline-block;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: #1EA7FD;
+  color: #999999;
+}
+
+.emotion-33 svg path {
+  fill: #1EA7FD;
+}
+
+.emotion-33:hover,
+.emotion-33:focus {
+  cursor: pointer;
+  color: #0297f5;
+}
+
+.emotion-33:hover svg path,
+.emotion-33:focus svg path {
+  fill: #0297f5;
+}
+
+.emotion-33:active {
+  color: #028ee6;
+}
+
+.emotion-33:active svg path {
+  fill: #028ee6;
+}
+
+.emotion-33 svg {
+  display: inline-block;
+  height: 1em;
+  width: 1em;
+  vertical-align: text-top;
+  position: relative;
+  bottom: -0.125em;
+  margin-right: 0.4em;
+}
+
+.emotion-33 svg path {
+  fill: #999999;
+}
+
+.emotion-33:hover {
+  color: #666666;
+}
+
+.emotion-33:hover svg path {
+  fill: #666666;
+}
+
+.emotion-33:active {
+  color: #444444;
+}
+
+.emotion-33:active svg path {
+  fill: #444444;
+}
+
+.emotion-40 {
+  display: block;
+}
+
+.emotion-39 {
+  padding: 3rem 20px;
+  max-width: 600px;
+  margin: 0 auto;
+}
+
+.emotion-9 {
+  margin-bottom: 20px;
+  font-size: 28px;
+  font-weight: 900;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+}
+
+.emotion-9 > svg {
+  height: 32px;
+  width: auto;
+  margin-right: 8px;
+}
+
+.emotion-16 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+}
+
+.emotion-11 {
+  -webkit-letter-spacing: 0.35em;
+  -moz-letter-spacing: 0.35em;
+  -ms-letter-spacing: 0.35em;
+  letter-spacing: 0.35em;
+  text-transform: uppercase;
+  font-weight: 900;
+  font-size: 13px;
+  line-height: 24px;
+  color: #999999;
+}
+
+.emotion-15 {
+  display: inline-block;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: #1EA7FD;
+  color: #999999;
+  font-size: 12px;
+}
+
+.emotion-15 svg path {
+  fill: #1EA7FD;
+}
+
+.emotion-15:hover,
+.emotion-15:focus {
+  cursor: pointer;
+  color: #0297f5;
+}
+
+.emotion-15:hover svg path,
+.emotion-15:focus svg path {
+  fill: #0297f5;
+}
+
+.emotion-15:active {
+  color: #028ee6;
+}
+
+.emotion-15:active svg path {
+  fill: #028ee6;
+}
+
+.emotion-15 svg {
+  display: inline-block;
+  height: 1em;
+  width: 1em;
+  vertical-align: text-top;
+  position: relative;
+  bottom: -0.125em;
+  margin-right: 0.4em;
+}
+
+.emotion-15 svg path {
+  fill: #999999;
+}
+
+.emotion-15:hover {
+  color: #666666;
+}
+
+.emotion-15:hover svg path {
+  fill: #666666;
+}
+
+.emotion-15:active {
+  color: #444444;
+}
+
+.emotion-15:active svg path {
+  fill: #444444;
+}
+
+.emotion-14 > svg:last-of-type {
+  height: 0.7em;
+  width: 0.7em;
+  margin-right: 0;
+  margin-left: 0.25em;
+  bottom: auto;
+  vertical-align: inherit;
+}
+
+.emotion-17 {
+  font-size: 14px;
+  line-height: 1.6;
+}
+
+.emotion-17 h1 {
+  font-size: 32px;
+  font-weight: 900;
+}
+
+.emotion-17 h2 {
+  font-size: 24px;
+  border-bottom: 1px solid rgba(0,0,0,.1);
+}
+
+.emotion-17 h3 {
+  font-size: 20px;
+}
+
+.emotion-17 h4 {
+  font-size: 16px;
+}
+
+.emotion-17 h5 {
+  font-size: 14px;
+}
+
+.emotion-17 h6 {
+  font-size: 14px;
+  color: #666666;
+}
+
+.emotion-17 pre:not(.hljs) {
+  background: transparent;
+  border: none;
+  border-radius: 0;
+  padding: 0;
+  margin: 0;
+}
+
+.emotion-17 pre pre,
+.emotion-17 pre.hljs {
+  padding: 15px;
+  margin: 0;
+  overflow: auto;
+  white-space: pre-wrap;
+  color: #333333;
+  font-size: 13px;
+  line-height: 19px;
+}
+
+.emotion-17 pre pre code,
+.emotion-17 pre.hljs code {
+  color: inherit;
+  font-size: inherit;
+}
+
+.emotion-17 pre code {
+  margin: 0;
+  padding: 0;
+  white-space: pre;
+  border: none;
+  background: transparent;
+}
+
+.emotion-17 pre code,
+.emotion-17 pre tt {
+  background-color: transparent;
+  border: none;
+}
+
+.emotion-17 body > *:first-of-type {
+  margin-top: 0 !important;
+}
+
+.emotion-17 body > *:last-child {
+  margin-bottom: 0 !important;
+}
+
+.emotion-17 a {
+  color: #1EA7FD;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
+.emotion-17 a.absent {
+  color: #cc0000;
+}
+
+.emotion-17 a.anchor {
+  display: block;
+  padding-left: 30px;
+  margin-left: -30px;
+  cursor: pointer;
+  position: absolute;
+  top: 0;
+  left: 0;
+  bottom: 0;
+}
+
+.emotion-17 h1,
+.emotion-17 h2,
+.emotion-17 h3,
+.emotion-17 h4,
+.emotion-17 h5,
+.emotion-17 h6 {
+  margin: 20px 0 10px;
+  padding: 0;
+  cursor: text;
+  position: relative;
+}
+
+.emotion-17 h2:first-of-type,
+.emotion-17 h1:first-of-type,
+.emotion-17 h1:first-of-type + h2,
+.emotion-17 h3:first-of-type,
+.emotion-17 h4:first-of-type,
+.emotion-17 h5:first-of-type,
+.emotion-17 h6:first-of-type {
+  margin-top: 0;
+  padding-top: 0;
+}
+
+.emotion-17 h1:hover a.anchor,
+.emotion-17 h2:hover a.anchor,
+.emotion-17 h3:hover a.anchor,
+.emotion-17 h4:hover a.anchor,
+.emotion-17 h5:hover a.anchor,
+.emotion-17 h6:hover a.anchor {
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
+.emotion-17 h1 tt,
+.emotion-17 h1 code {
+  font-size: inherit;
+}
+
+.emotion-17 h2 tt,
+.emotion-17 h2 code {
+  font-size: inherit;
+}
+
+.emotion-17 h3 tt,
+.emotion-17 h3 code {
+  font-size: inherit;
+}
+
+.emotion-17 h4 tt,
+.emotion-17 h4 code {
+  font-size: inherit;
+}
+
+.emotion-17 h5 tt,
+.emotion-17 h5 code {
+  font-size: inherit;
+}
+
+.emotion-17 h6 tt,
+.emotion-17 h6 code {
+  font-size: inherit;
+}
+
+.emotion-17 p,
+.emotion-17 blockquote,
+.emotion-17 ul,
+.emotion-17 ol,
+.emotion-17 dl,
+.emotion-17 li,
+.emotion-17 table,
+.emotion-17 pre {
+  margin: 15px 0;
+}
+
+.emotion-17 hr {
+  border: 0 none;
+  color: rgba(0,0,0,.1);
+  height: 4px;
+  padding: 0;
+}
+
+.emotion-17 body > h2:first-of-type {
+  margin-top: 0;
+  padding-top: 0;
+}
+
+.emotion-17 body > h1:first-of-type {
+  margin-top: 0;
+  padding-top: 0;
+}
+
+.emotion-17 body > h1:first-of-type + h2 {
+  margin-top: 0;
+  padding-top: 0;
+}
+
+.emotion-17 body > h3:first-of-type,
+.emotion-17 body > h4:first-of-type,
+.emotion-17 body > h5:first-of-type,
+.emotion-17 body > h6:first-of-type {
+  margin-top: 0;
+  padding-top: 0;
+}
+
+.emotion-17 a:first-of-type h1,
+.emotion-17 a:first-of-type h2,
+.emotion-17 a:first-of-type h3,
+.emotion-17 a:first-of-type h4,
+.emotion-17 a:first-of-type h5,
+.emotion-17 a:first-of-type h6 {
+  margin-top: 0;
+  padding-top: 0;
+}
+
+.emotion-17 h1 p,
+.emotion-17 h2 p,
+.emotion-17 h3 p,
+.emotion-17 h4 p,
+.emotion-17 h5 p,
+.emotion-17 h6 p {
+  margin-top: 0;
+}
+
+.emotion-17 li p.first {
+  display: inline-block;
+}
+
+.emotion-17 ul,
+.emotion-17 ol {
+  padding-left: 30px;
+}
+
+.emotion-17 ul :first-of-type,
+.emotion-17 ol :first-of-type {
+  margin-top: 0;
+}
+
+.emotion-17 ul :last-child,
+.emotion-17 ol :last-child {
+  margin-bottom: 0;
+}
+
+.emotion-17 dl {
+  padding: 0;
+}
+
+.emotion-17 dl dt {
+  font-size: 14px;
+  font-weight: bold;
+  font-style: italic;
+  padding: 0;
+  margin: 15px 0 5px;
+}
+
+.emotion-17 dl dt:first-of-type {
+  padding: 0;
+}
+
+.emotion-17 dl dt > :first-of-type {
+  margin-top: 0;
+}
+
+.emotion-17 dl dt > :last-child {
+  margin-bottom: 0;
+}
+
+.emotion-17 dl dd {
+  margin: 0 0 15px;
+  padding: 0 15px;
+}
+
+.emotion-17 dl dd > :first-of-type {
+  margin-top: 0;
+}
+
+.emotion-17 dl dd > :last-child {
+  margin-bottom: 0;
+}
+
+.emotion-17 blockquote {
+  border-left: 4px solid #DDDDDD;
+  padding: 0 15px;
+  color: #666666;
+}
+
+.emotion-17 blockquote > :first-of-type {
+  margin-top: 0;
+}
+
+.emotion-17 blockquote > :last-child {
+  margin-bottom: 0;
+}
+
+.emotion-17 table {
+  padding: 0;
+  border-collapse: collapse;
+}
+
+.emotion-17 table tr {
+  border-top: 1px solid rgba(0,0,0,.1);
+  background-color: white;
+  margin: 0;
+  padding: 0;
+}
+
+.emotion-17 table tr:nth-of-type(2n) {
+  background-color: #F8F8F8;
+}
+
+.emotion-17 table tr th {
+  font-weight: bold;
+  border: 1px solid rgba(0,0,0,.1);
+  text-align: left;
+  margin: 0;
+  padding: 6px 13px;
+}
+
+.emotion-17 table tr td {
+  border: 1px solid rgba(0,0,0,.1);
+  text-align: left;
+  margin: 0;
+  padding: 6px 13px;
+}
+
+.emotion-17 table tr th :first-of-type,
+.emotion-17 table tr td :first-of-type {
+  margin-top: 0;
+}
+
+.emotion-17 table tr th :last-child,
+.emotion-17 table tr td :last-child {
+  margin-bottom: 0;
+}
+
+.emotion-17 img {
+  max-width: 100%;
+}
+
+.emotion-17 span.frame {
+  display: block;
+  overflow: hidden;
+}
+
+.emotion-17 span.frame > span {
+  border: 1px solid #DDDDDD;
+  display: block;
+  float: left;
+  overflow: hidden;
+  margin: 13px 0 0;
+  padding: 7px;
+  width: auto;
+}
+
+.emotion-17 span.frame span img {
+  display: block;
+  float: left;
+}
+
+.emotion-17 span.frame span span {
+  clear: both;
+  color: #333333;
+  display: block;
+  padding: 5px 0 0;
+}
+
+.emotion-17 span.align-center {
+  display: block;
+  overflow: hidden;
+  clear: both;
+}
+
+.emotion-17 span.align-center > span {
+  display: block;
+  overflow: hidden;
+  margin: 13px auto 0;
+  text-align: center;
+}
+
+.emotion-17 span.align-center span img {
+  margin: 0 auto;
+  text-align: center;
+}
+
+.emotion-17 span.align-right {
+  display: block;
+  overflow: hidden;
+  clear: both;
+}
+
+.emotion-17 span.align-right > span {
+  display: block;
+  overflow: hidden;
+  margin: 13px 0 0;
+  text-align: right;
+}
+
+.emotion-17 span.align-right span img {
+  margin: 0;
+  text-align: right;
+}
+
+.emotion-17 span.float-left {
+  display: block;
+  margin-right: 13px;
+  overflow: hidden;
+  float: left;
+}
+
+.emotion-17 span.float-left span {
+  margin: 13px 0 0;
+}
+
+.emotion-17 span.float-right {
+  display: block;
+  margin-left: 13px;
+  overflow: hidden;
+  float: right;
+}
+
+.emotion-17 span.float-right > span {
+  display: block;
+  overflow: hidden;
+  margin: 13px auto 0;
+  text-align: right;
+}
+
+.emotion-17 code,
+.emotion-17 tt {
+  margin: 0 2px;
+  padding: 0 5px;
+  white-space: nowrap;
+  border: 1px solid #EEEEEE;
+  background-color: #F8F8F8;
+  border-radius: 3px;
+}
+
+.emotion-10 {
+  background: #E1FFD4;
+  color: #66BF3C;
+  font-weight: 700;
+  padding: 10px 20px;
+  margin-bottom: 24px;
+  border: 1px solid rgba(0,0,0,.1);
+  text-align: center;
+}
+
+.emotion-31 {
+  margin-top: 20px;
+  padding-bottom: 20px;
+  border-top: 1px solid rgba(0,0,0,.1);
+}
+
+.emotion-23 {
+  position: relative;
+  overflow: hidden;
+  border: 1px solid rgba(0,0,0,.1);
+}
+
+.emotion-20 {
+  position: relative;
+  overflow: auto;
+}
+
+.emotion-20 code {
+  padding-right: 10px;
+}
+
+.emotion-20 * .token {
+  font-family: "Operator Mono","Fira Code Retina","Fira Code","FiraCode-Retina","Andale Mono","Lucida Console",Consolas,Monaco,monospace;
+  -webkit-font-smoothing: antialiased;
+}
+
+.emotion-20 * .token.comment {
+  color: #008000;
+  font-style: italic;
+}
+
+.emotion-20 * .token.prolog {
+  color: #008000;
+  font-style: italic;
+}
+
+.emotion-20 * .token.doctype {
+  color: #008000;
+  font-style: italic;
+}
+
+.emotion-20 * .token.cdata {
+  color: #008000;
+  font-style: italic;
+}
+
+.emotion-20 * .token.string {
+  color: #A31515;
+}
+
+.emotion-20 * .token.punctuation {
+  color: #393A34;
+}
+
+.emotion-20 * .token.operator {
+  color: #393A34;
+}
+
+.emotion-20 * .token.url {
+  color: #36acaa;
+}
+
+.emotion-20 * .token.symbol {
+  color: #36acaa;
+}
+
+.emotion-20 * .token.number {
+  color: #36acaa;
+}
+
+.emotion-20 * .token.boolean {
+  color: #36acaa;
+}
+
+.emotion-20 * .token.variable {
+  color: #36acaa;
+}
+
+.emotion-20 * .token.constant {
+  color: #36acaa;
+}
+
+.emotion-20 * .token.inserted {
+  color: #36acaa;
+}
+
+.emotion-20 * .token.atrule {
+  color: #0000ff;
+}
+
+.emotion-20 * .token.keyword {
+  color: #0000ff;
+}
+
+.emotion-20 * .token.attr-value {
+  color: #0000ff;
+}
+
+.emotion-20 * .token.function {
+  color: #393A34;
+}
+
+.emotion-20 * .token.deleted {
+  color: #9a050f;
+}
+
+.emotion-20 * .token.important {
+  font-weight: bold;
+}
+
+.emotion-20 * .token.bold {
+  font-weight: bold;
+}
+
+.emotion-20 * .token.italic {
+  font-style: italic;
+}
+
+.emotion-20 * .token.class-name {
+  color: #2B91AF;
+}
+
+.emotion-20 * .token.tag {
+  color: #800000;
+}
+
+.emotion-20 * .token.selector {
+  color: #800000;
+}
+
+.emotion-20 * .token.attr-name {
+  color: #ff0000;
+}
+
+.emotion-20 * .token.property {
+  color: #ff0000;
+}
+
+.emotion-20 * .token.regex {
+  color: #ff0000;
+}
+
+.emotion-20 * .token.entity {
+  color: #ff0000;
+}
+
+.emotion-20 * .token.directive.tag .tag {
+  background: #ffff00;
+  color: #393A34;
+}
+
+.emotion-20 * .language-json .token.boolean {
+  color: #0000ff;
+}
+
+.emotion-20 * .language-json .token.number {
+  color: #0000ff;
+}
+
+.emotion-20 * .language-json .token.property {
+  color: #2B91AF;
+}
+
+.emotion-20 * .namespace {
+  opacity: 0.7;
+}
+
+.emotion-19 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: start;
+  -webkit-justify-content: flex-start;
+  -ms-flex-pack: start;
+  justify-content: flex-start;
+  margin: 0;
+  padding: 10px;
+}
+
+.emotion-18 {
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  padding-right: 0;
+  opacity: 1;
+}
+
+.emotion-22 {
+  position: absolute;
+  bottom: 0;
+  right: 0;
+  max-width: 100%;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  background: #FFFFFF;
+}
+
+.emotion-21 {
+  border: 0 none;
+  padding: 4px 10px;
+  cursor: pointer;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  color: #333333;
+  background: #FFFFFF;
+  font-size: 12px;
+  line-height: 16px;
+  font-weight: 700;
+  border-top: 1px solid rgba(0,0,0,.1);
+  border-left: 1px solid rgba(0,0,0,.1);
+  margin-left: -1px;
+  border-radius: 4px 0 0 0;
+}
+
+.emotion-21:not(:last-child) {
+  border-right: 1px solid rgba(0,0,0,.1);
+}
+
+.emotion-21 + * {
+  border-left: 1px solid rgba(0,0,0,.1);
+  border-radius: 0;
+}
+
+.emotion-21:focus {
+  box-shadow: #1EA7FD 0 -3px 0 0 inset;
+  outline: 0 none;
+}
+
+<div
+  class="emotion-42"
+  title="wrapper"
+>
+  <div
+    class="emotion-8"
+    title="bar"
+  >
+    <div
+      class="emotion-7"
+    >
+      <div
+        class="emotion-2"
+        title="side left"
+      >
+        <div
+          class="emotion-1"
+          role="tablist"
+        >
+          <button
+            class="emotion-0"
+            role="tab"
+            type="button"
+          >
+            About
+          </button>
+        </div>
+      </div>
+      <div
+        class="emotion-6"
+        title="side right"
+      >
+        <button
+          class="emotion-5"
+        >
+          <svg
+            class="emotion-4"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-3"
+              d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
+            />
+          </svg>
+        </button>
+      </div>
+    </div>
+  </div>
+  <div
+    class="emotion-41"
+  >
+    <div
+      class="emotion-40"
+      role="tabpanel"
+    >
+      <div
+        class="emotion-39"
+      >
+        <header
+          class="emotion-9"
+        >
+          <svg
+            title="Storybook icon"
+            viewBox="0 0 64 64"
+          >
+            <g
+              fill="none"
+              fill-rule="evenodd"
+              id="Artboard"
+              stroke="none"
+              stroke-width="1"
+            >
+              <path
+                d="M8.04798541,58.7875918 L6.07908839,6.32540407 C6.01406344,4.5927838 7.34257463,3.12440831 9.07303814,3.01625434 L53.6958037,0.227331489 C55.457209,0.117243658 56.974354,1.45590096 57.0844418,3.21730626 C57.0885895,3.28366922 57.0906648,3.35014546 57.0906648,3.41663791 L57.0906648,60.5834697 C57.0906648,62.3483119 55.6599776,63.7789992 53.8951354,63.7789992 C53.847325,63.7789992 53.7995207,63.7779262 53.7517585,63.775781 L11.0978899,61.8600599 C9.43669044,61.7854501 8.11034889,60.4492961 8.04798541,58.7875918 Z"
+                fill="#FF4785"
+                fill-rule="nonzero"
+                id="path-1"
+              />
+              <path
+                d="M35.9095005,24.1768792 C35.9095005,25.420127 44.2838488,24.8242707 45.4080313,23.9509748 C45.4080313,15.4847538 40.8652557,11.0358878 32.5466666,11.0358878 C24.2280775,11.0358878 19.5673077,15.553972 19.5673077,22.3311017 C19.5673077,34.1346028 35.4965208,34.3605071 35.4965208,40.7987804 C35.4965208,42.606015 34.6115646,43.6790606 32.6646607,43.6790606 C30.127786,43.6790606 29.1248356,42.3834613 29.2428298,37.9783269 C29.2428298,37.0226907 19.5673077,36.7247626 19.2723223,37.9783269 C18.5211693,48.6535354 25.1720308,51.7326752 32.7826549,51.7326752 C40.1572906,51.7326752 45.939005,47.8018145 45.939005,40.6858282 C45.939005,28.035186 29.7738035,28.3740425 29.7738035,22.1051974 C29.7738035,19.5637737 31.6617103,19.2249173 32.7826549,19.2249173 C33.9625966,19.2249173 36.0864917,19.4328883 35.9095005,24.1768792 Z"
+                fill="#FFFFFF"
+                fill-rule="nonzero"
+                id="path9_fill-path"
+              />
+              <path
+                d="M44.0461638,0.830433986 L50.1874092,0.446606143 L50.443532,7.7810017 C50.4527198,8.04410717 50.2468789,8.26484453 49.9837734,8.27403237 C49.871115,8.27796649 49.7607078,8.24184808 49.6721567,8.17209069 L47.3089847,6.3104681 L44.5110468,8.43287463 C44.3012992,8.591981 44.0022839,8.55092814 43.8431776,8.34118051 C43.7762017,8.25288717 43.742082,8.14401677 43.7466857,8.03329059 L44.0461638,0.830433986 Z"
+                fill="#FFFFFF"
+                id="Path"
+              />
+            </g>
+          </svg>
+          Storybook 5.0.0
+        </header>
+        <div
+          class="emotion-10"
+        >
+          Storybook 5.0.3 is available. Upgrade from 5.0.0 now.
+        </div>
+        <div
+          class="emotion-16"
+        >
+          <span
+            class="emotion-11"
+          >
+            5.0.3 Changelog
+          </span>
+          <a
+            class="emotion-15"
+            href="https://github.com/storybooks/storybook/blob/master/CHANGELOG.md"
+            target="_blank"
+          >
+            <span
+              class="emotion-14"
             >
               Read full changelog
               <svg
@@ -1681,7 +1779,7 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
           </a>
         </div>
         <div
-          class="emotion-16"
+          class="emotion-17"
         >
           <ul>
             <li>
@@ -1702,10 +1800,10 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
           </ul>
         </div>
         <div
-          class="emotion-30"
+          class="emotion-31"
         >
           <div
-            class="emotion-16"
+            class="emotion-17"
           >
             <p>
               <b>
@@ -1713,16 +1811,16 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
               </b>
             </p>
             <div
-              class="emotion-22"
+              class="emotion-23"
             >
               <div
-                class="emotion-19"
+                class="emotion-20"
               >
                 <pre
-                  class="hljs emotion-18"
+                  class="hljs emotion-19"
                 >
                   <code
-                    class="emotion-17"
+                    class="emotion-18"
                   >
                     npx npm-check-updates 
                     <span
@@ -1741,10 +1839,10 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
                 </pre>
               </div>
               <div
-                class="emotion-21"
+                class="emotion-22"
               >
                 <button
-                  class="emotion-20"
+                  class="emotion-21"
                 >
                   Copy
                 </button>
@@ -1754,26 +1852,26 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
               Alternatively, if you're using yarn run the following command, and check all Storybook related packages:
             </p>
             <div
-              class="emotion-22"
+              class="emotion-23"
             >
               <div
-                class="emotion-19"
+                class="emotion-20"
               >
                 <pre
-                  class="hljs emotion-18"
+                  class="hljs emotion-19"
                 >
                   <code
-                    class="emotion-17"
+                    class="emotion-18"
                   >
                     yarn upgrade-interactive --latest
                   </code>
                 </pre>
               </div>
               <div
-                class="emotion-21"
+                class="emotion-22"
               >
                 <button
-                  class="emotion-20"
+                  class="emotion-21"
                 >
                   Copy
                 </button>
@@ -1782,34 +1880,34 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
           </div>
         </div>
         <div
-          class="emotion-37"
+          class="emotion-38"
         >
           <a
-            class="emotion-32"
+            class="emotion-33"
             href="https://storybook.js.org"
           >
             <span
-              class="emotion-31"
+              class="emotion-32"
             >
               Docs
             </span>
           </a>
           <a
-            class="emotion-32"
+            class="emotion-33"
             href="https://github.com/storybooks/storybook"
           >
             <span
-              class="emotion-31"
+              class="emotion-32"
             >
               GitHub
             </span>
           </a>
           <a
-            class="emotion-32"
+            class="emotion-33"
             href="https://storybook.js.org/support"
           >
             <span
-              class="emotion-31"
+              class="emotion-32"
             >
               Support
             </span>
@@ -1822,7 +1920,7 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
 `;
 
 exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
-.emotion-27 {
+.emotion-28 {
   width: 100%;
   height: 100%;
   box-sizing: border-box;
@@ -1835,6 +1933,57 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   flex-direction: column;
 }
 
+.emotion-8 {
+  color: #999999;
+  height: 40px;
+  overflow: auto;
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-8::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+}
+
+.emotion-8::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-8::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-8::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
+}
+
 .emotion-7 {
   display: -webkit-box;
   display: -webkit-flex;
@@ -1844,14 +1993,9 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   -webkit-justify-content: space-between;
   -ms-flex-pack: justify;
   justify-content: space-between;
-  background: #FFFFFF;
-  color: #999999;
-  height: 40px;
   position: relative;
-  overflow: visible;
-  overflow-x: visible;
-  overflow-y: visible;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+  white-space: nowrap;
+  height: 40px;
 }
 
 .emotion-2 {
@@ -1859,9 +2003,12 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
 }
 
 .emotion-2 > * {
@@ -1869,14 +2016,10 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
 }
 
 .emotion-1 {
-  white-space: nowrap;
-  height: 100%;
-  padding-bottom: 50px;
-  overflow-x: visisble;
-  overflow-y: visisble;
+  overflow: hidden;
 }
 
-.emotion-1:first-child {
+.emotion-1:first-of-type {
   margin-left: 0;
 }
 
@@ -1930,6 +2073,13 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  margin-left: 30px;
 }
 
 .emotion-6 > * {
@@ -1971,7 +2121,7 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   fill: currentColor;
 }
 
-.emotion-26 {
+.emotion-27 {
   display: block;
   position: relative;
   font-size: 13px;
@@ -1983,7 +2133,7 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   width: 100%;
 }
 
-.emotion-23 {
+.emotion-24 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -1994,11 +2144,11 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   font-weight: 700;
 }
 
-.emotion-23 > * + * {
+.emotion-24 > * + * {
   margin-left: 20px;
 }
 
-.emotion-18 {
+.emotion-19 {
   display: inline-block;
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
@@ -2008,36 +2158,30 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   color: #999999;
 }
 
-.emotion-18 svg path {
+.emotion-19 svg path {
   fill: #1EA7FD;
 }
 
-.emotion-18:hover,
-.emotion-18:focus {
+.emotion-19:hover,
+.emotion-19:focus {
   cursor: pointer;
-  -webkit-transform: translate3d(0,-1px,0);
-  -ms-transform: translate3d(0,-1px,0);
-  transform: translate3d(0,-1px,0);
   color: #0297f5;
 }
 
-.emotion-18:hover svg path,
-.emotion-18:focus svg path {
+.emotion-19:hover svg path,
+.emotion-19:focus svg path {
   fill: #0297f5;
 }
 
-.emotion-18:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
+.emotion-19:active {
   color: #028ee6;
 }
 
-.emotion-18:active svg path {
+.emotion-19:active svg path {
   fill: #028ee6;
 }
 
-.emotion-18 svg {
+.emotion-19 svg {
   display: inline-block;
   height: 1em;
   width: 1em;
@@ -2047,37 +2191,37 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   margin-right: 0.4em;
 }
 
-.emotion-18 svg path {
+.emotion-19 svg path {
   fill: #999999;
 }
 
-.emotion-18:hover {
+.emotion-19:hover {
   color: #666666;
 }
 
-.emotion-18:hover svg path {
+.emotion-19:hover svg path {
   fill: #666666;
 }
 
-.emotion-18:active {
+.emotion-19:active {
   color: #444444;
 }
 
-.emotion-18:active svg path {
+.emotion-19:active svg path {
   fill: #444444;
 }
 
-.emotion-25 {
+.emotion-26 {
   display: block;
 }
 
-.emotion-24 {
+.emotion-25 {
   padding: 3rem 20px;
   max-width: 600px;
   margin: 0 auto;
 }
 
-.emotion-8 {
+.emotion-9 {
   margin-bottom: 20px;
   font-size: 28px;
   font-weight: 900;
@@ -2091,13 +2235,13 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   display: flex;
 }
 
-.emotion-8 > svg {
+.emotion-9 > svg {
   height: 32px;
   width: auto;
   margin-right: 8px;
 }
 
-.emotion-9 {
+.emotion-10 {
   background: #EAF3FC;
   color: #333333;
   font-weight: 700;
@@ -2107,7 +2251,7 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   text-align: center;
 }
 
-.emotion-15 {
+.emotion-16 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -2118,7 +2262,7 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   justify-content: space-between;
 }
 
-.emotion-10 {
+.emotion-11 {
   -webkit-letter-spacing: 0.35em;
   -moz-letter-spacing: 0.35em;
   -ms-letter-spacing: 0.35em;
@@ -2130,7 +2274,7 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   color: #999999;
 }
 
-.emotion-14 {
+.emotion-15 {
   display: inline-block;
   -webkit-transition: all 150ms ease-out;
   transition: all 150ms ease-out;
@@ -2141,36 +2285,30 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   font-size: 12px;
 }
 
-.emotion-14 svg path {
+.emotion-15 svg path {
   fill: #1EA7FD;
 }
 
-.emotion-14:hover,
-.emotion-14:focus {
+.emotion-15:hover,
+.emotion-15:focus {
   cursor: pointer;
-  -webkit-transform: translate3d(0,-1px,0);
-  -ms-transform: translate3d(0,-1px,0);
-  transform: translate3d(0,-1px,0);
   color: #0297f5;
 }
 
-.emotion-14:hover svg path,
-.emotion-14:focus svg path {
+.emotion-15:hover svg path,
+.emotion-15:focus svg path {
   fill: #0297f5;
 }
 
-.emotion-14:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
+.emotion-15:active {
   color: #028ee6;
 }
 
-.emotion-14:active svg path {
+.emotion-15:active svg path {
   fill: #028ee6;
 }
 
-.emotion-14 svg {
+.emotion-15 svg {
   display: inline-block;
   height: 1em;
   width: 1em;
@@ -2180,27 +2318,27 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   margin-right: 0.4em;
 }
 
-.emotion-14 svg path {
+.emotion-15 svg path {
   fill: #999999;
 }
 
-.emotion-14:hover {
+.emotion-15:hover {
   color: #666666;
 }
 
-.emotion-14:hover svg path {
+.emotion-15:hover svg path {
   fill: #666666;
 }
 
-.emotion-14:active {
+.emotion-15:active {
   color: #444444;
 }
 
-.emotion-14:active svg path {
+.emotion-15:active svg path {
   fill: #444444;
 }
 
-.emotion-13 > svg:last-of-type {
+.emotion-14 > svg:last-of-type {
   height: 0.7em;
   width: 0.7em;
   margin-right: 0;
@@ -2209,39 +2347,39 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   vertical-align: inherit;
 }
 
-.emotion-16 {
+.emotion-17 {
   font-size: 14px;
   line-height: 1.6;
 }
 
-.emotion-16 h1 {
+.emotion-17 h1 {
   font-size: 32px;
   font-weight: 900;
 }
 
-.emotion-16 h2 {
+.emotion-17 h2 {
   font-size: 24px;
   border-bottom: 1px solid rgba(0,0,0,.1);
 }
 
-.emotion-16 h3 {
+.emotion-17 h3 {
   font-size: 20px;
 }
 
-.emotion-16 h4 {
+.emotion-17 h4 {
   font-size: 16px;
 }
 
-.emotion-16 h5 {
+.emotion-17 h5 {
   font-size: 14px;
 }
 
-.emotion-16 h6 {
+.emotion-17 h6 {
   font-size: 14px;
   color: #666666;
 }
 
-.emotion-16 pre:not(.hljs) {
+.emotion-17 pre:not(.hljs) {
   background: transparent;
   border: none;
   border-radius: 0;
@@ -2249,8 +2387,8 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   margin: 0;
 }
 
-.emotion-16 pre pre,
-.emotion-16 pre.hljs {
+.emotion-17 pre pre,
+.emotion-17 pre.hljs {
   padding: 15px;
   margin: 0;
   overflow: auto;
@@ -2260,13 +2398,13 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   line-height: 19px;
 }
 
-.emotion-16 pre pre code,
-.emotion-16 pre.hljs code {
+.emotion-17 pre pre code,
+.emotion-17 pre.hljs code {
   color: inherit;
   font-size: inherit;
 }
 
-.emotion-16 pre code {
+.emotion-17 pre code {
   margin: 0;
   padding: 0;
   white-space: pre;
@@ -2274,31 +2412,31 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   background: transparent;
 }
 
-.emotion-16 pre code,
-.emotion-16 pre tt {
+.emotion-17 pre code,
+.emotion-17 pre tt {
   background-color: transparent;
   border: none;
 }
 
-.emotion-16 body > *:first-child {
+.emotion-17 body > *:first-of-type {
   margin-top: 0 !important;
 }
 
-.emotion-16 body > *:last-child {
+.emotion-17 body > *:last-child {
   margin-bottom: 0 !important;
 }
 
-.emotion-16 a {
+.emotion-17 a {
   color: #1EA7FD;
   -webkit-text-decoration: none;
   text-decoration: none;
 }
 
-.emotion-16 a.absent {
+.emotion-17 a.absent {
   color: #cc0000;
 }
 
-.emotion-16 a.anchor {
+.emotion-17 a.anchor {
   display: block;
   padding-left: 30px;
   margin-left: -30px;
@@ -2309,153 +2447,153 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   bottom: 0;
 }
 
-.emotion-16 h1,
-.emotion-16 h2,
-.emotion-16 h3,
-.emotion-16 h4,
-.emotion-16 h5,
-.emotion-16 h6 {
+.emotion-17 h1,
+.emotion-17 h2,
+.emotion-17 h3,
+.emotion-17 h4,
+.emotion-17 h5,
+.emotion-17 h6 {
   margin: 20px 0 10px;
   padding: 0;
   cursor: text;
   position: relative;
 }
 
-.emotion-16 h2:first-child,
-.emotion-16 h1:first-child,
-.emotion-16 h1:first-child + h2,
-.emotion-16 h3:first-child,
-.emotion-16 h4:first-child,
-.emotion-16 h5:first-child,
-.emotion-16 h6:first-child {
+.emotion-17 h2:first-of-type,
+.emotion-17 h1:first-of-type,
+.emotion-17 h1:first-of-type + h2,
+.emotion-17 h3:first-of-type,
+.emotion-17 h4:first-of-type,
+.emotion-17 h5:first-of-type,
+.emotion-17 h6:first-of-type {
   margin-top: 0;
   padding-top: 0;
 }
 
-.emotion-16 h1:hover a.anchor,
-.emotion-16 h2:hover a.anchor,
-.emotion-16 h3:hover a.anchor,
-.emotion-16 h4:hover a.anchor,
-.emotion-16 h5:hover a.anchor,
-.emotion-16 h6:hover a.anchor {
+.emotion-17 h1:hover a.anchor,
+.emotion-17 h2:hover a.anchor,
+.emotion-17 h3:hover a.anchor,
+.emotion-17 h4:hover a.anchor,
+.emotion-17 h5:hover a.anchor,
+.emotion-17 h6:hover a.anchor {
   -webkit-text-decoration: none;
   text-decoration: none;
 }
 
-.emotion-16 h1 tt,
-.emotion-16 h1 code {
+.emotion-17 h1 tt,
+.emotion-17 h1 code {
   font-size: inherit;
 }
 
-.emotion-16 h2 tt,
-.emotion-16 h2 code {
+.emotion-17 h2 tt,
+.emotion-17 h2 code {
   font-size: inherit;
 }
 
-.emotion-16 h3 tt,
-.emotion-16 h3 code {
+.emotion-17 h3 tt,
+.emotion-17 h3 code {
   font-size: inherit;
 }
 
-.emotion-16 h4 tt,
-.emotion-16 h4 code {
+.emotion-17 h4 tt,
+.emotion-17 h4 code {
   font-size: inherit;
 }
 
-.emotion-16 h5 tt,
-.emotion-16 h5 code {
+.emotion-17 h5 tt,
+.emotion-17 h5 code {
   font-size: inherit;
 }
 
-.emotion-16 h6 tt,
-.emotion-16 h6 code {
+.emotion-17 h6 tt,
+.emotion-17 h6 code {
   font-size: inherit;
 }
 
-.emotion-16 p,
-.emotion-16 blockquote,
-.emotion-16 ul,
-.emotion-16 ol,
-.emotion-16 dl,
-.emotion-16 li,
-.emotion-16 table,
-.emotion-16 pre {
+.emotion-17 p,
+.emotion-17 blockquote,
+.emotion-17 ul,
+.emotion-17 ol,
+.emotion-17 dl,
+.emotion-17 li,
+.emotion-17 table,
+.emotion-17 pre {
   margin: 15px 0;
 }
 
-.emotion-16 hr {
+.emotion-17 hr {
   border: 0 none;
   color: rgba(0,0,0,.1);
   height: 4px;
   padding: 0;
 }
 
-.emotion-16 body > h2:first-child {
+.emotion-17 body > h2:first-of-type {
   margin-top: 0;
   padding-top: 0;
 }
 
-.emotion-16 body > h1:first-child {
+.emotion-17 body > h1:first-of-type {
   margin-top: 0;
   padding-top: 0;
 }
 
-.emotion-16 body > h1:first-child + h2 {
+.emotion-17 body > h1:first-of-type + h2 {
   margin-top: 0;
   padding-top: 0;
 }
 
-.emotion-16 body > h3:first-child,
-.emotion-16 body > h4:first-child,
-.emotion-16 body > h5:first-child,
-.emotion-16 body > h6:first-child {
+.emotion-17 body > h3:first-of-type,
+.emotion-17 body > h4:first-of-type,
+.emotion-17 body > h5:first-of-type,
+.emotion-17 body > h6:first-of-type {
   margin-top: 0;
   padding-top: 0;
 }
 
-.emotion-16 a:first-child h1,
-.emotion-16 a:first-child h2,
-.emotion-16 a:first-child h3,
-.emotion-16 a:first-child h4,
-.emotion-16 a:first-child h5,
-.emotion-16 a:first-child h6 {
+.emotion-17 a:first-of-type h1,
+.emotion-17 a:first-of-type h2,
+.emotion-17 a:first-of-type h3,
+.emotion-17 a:first-of-type h4,
+.emotion-17 a:first-of-type h5,
+.emotion-17 a:first-of-type h6 {
   margin-top: 0;
   padding-top: 0;
 }
 
-.emotion-16 h1 p,
-.emotion-16 h2 p,
-.emotion-16 h3 p,
-.emotion-16 h4 p,
-.emotion-16 h5 p,
-.emotion-16 h6 p {
+.emotion-17 h1 p,
+.emotion-17 h2 p,
+.emotion-17 h3 p,
+.emotion-17 h4 p,
+.emotion-17 h5 p,
+.emotion-17 h6 p {
   margin-top: 0;
 }
 
-.emotion-16 li p.first {
+.emotion-17 li p.first {
   display: inline-block;
 }
 
-.emotion-16 ul,
-.emotion-16 ol {
+.emotion-17 ul,
+.emotion-17 ol {
   padding-left: 30px;
 }
 
-.emotion-16 ul :first-child,
-.emotion-16 ol :first-child {
+.emotion-17 ul :first-of-type,
+.emotion-17 ol :first-of-type {
   margin-top: 0;
 }
 
-.emotion-16 ul :last-child,
-.emotion-16 ol :last-child {
+.emotion-17 ul :last-child,
+.emotion-17 ol :last-child {
   margin-bottom: 0;
 }
 
-.emotion-16 dl {
+.emotion-17 dl {
   padding: 0;
 }
 
-.emotion-16 dl dt {
+.emotion-17 dl dt {
   font-size: 14px;
   font-weight: bold;
   font-style: italic;
@@ -2463,62 +2601,62 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   margin: 15px 0 5px;
 }
 
-.emotion-16 dl dt:first-child {
+.emotion-17 dl dt:first-of-type {
   padding: 0;
 }
 
-.emotion-16 dl dt > :first-child {
+.emotion-17 dl dt > :first-of-type {
   margin-top: 0;
 }
 
-.emotion-16 dl dt > :last-child {
+.emotion-17 dl dt > :last-child {
   margin-bottom: 0;
 }
 
-.emotion-16 dl dd {
+.emotion-17 dl dd {
   margin: 0 0 15px;
   padding: 0 15px;
 }
 
-.emotion-16 dl dd > :first-child {
+.emotion-17 dl dd > :first-of-type {
   margin-top: 0;
 }
 
-.emotion-16 dl dd > :last-child {
+.emotion-17 dl dd > :last-child {
   margin-bottom: 0;
 }
 
-.emotion-16 blockquote {
+.emotion-17 blockquote {
   border-left: 4px solid #DDDDDD;
   padding: 0 15px;
   color: #666666;
 }
 
-.emotion-16 blockquote > :first-child {
+.emotion-17 blockquote > :first-of-type {
   margin-top: 0;
 }
 
-.emotion-16 blockquote > :last-child {
+.emotion-17 blockquote > :last-child {
   margin-bottom: 0;
 }
 
-.emotion-16 table {
+.emotion-17 table {
   padding: 0;
   border-collapse: collapse;
 }
 
-.emotion-16 table tr {
+.emotion-17 table tr {
   border-top: 1px solid rgba(0,0,0,.1);
   background-color: white;
   margin: 0;
   padding: 0;
 }
 
-.emotion-16 table tr:nth-child(2n) {
+.emotion-17 table tr:nth-of-type(2n) {
   background-color: #F8F8F8;
 }
 
-.emotion-16 table tr th {
+.emotion-17 table tr th {
   font-weight: bold;
   border: 1px solid rgba(0,0,0,.1);
   text-align: left;
@@ -2526,33 +2664,33 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   padding: 6px 13px;
 }
 
-.emotion-16 table tr td {
+.emotion-17 table tr td {
   border: 1px solid rgba(0,0,0,.1);
   text-align: left;
   margin: 0;
   padding: 6px 13px;
 }
 
-.emotion-16 table tr th :first-child,
-.emotion-16 table tr td :first-child {
+.emotion-17 table tr th :first-of-type,
+.emotion-17 table tr td :first-of-type {
   margin-top: 0;
 }
 
-.emotion-16 table tr th :last-child,
-.emotion-16 table tr td :last-child {
+.emotion-17 table tr th :last-child,
+.emotion-17 table tr td :last-child {
   margin-bottom: 0;
 }
 
-.emotion-16 img {
+.emotion-17 img {
   max-width: 100%;
 }
 
-.emotion-16 span.frame {
+.emotion-17 span.frame {
   display: block;
   overflow: hidden;
 }
 
-.emotion-16 span.frame > span {
+.emotion-17 span.frame > span {
   border: 1px solid #DDDDDD;
   display: block;
   float: left;
@@ -2562,81 +2700,81 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   width: auto;
 }
 
-.emotion-16 span.frame span img {
+.emotion-17 span.frame span img {
   display: block;
   float: left;
 }
 
-.emotion-16 span.frame span span {
+.emotion-17 span.frame span span {
   clear: both;
   color: #333333;
   display: block;
   padding: 5px 0 0;
 }
 
-.emotion-16 span.align-center {
+.emotion-17 span.align-center {
   display: block;
   overflow: hidden;
   clear: both;
 }
 
-.emotion-16 span.align-center > span {
+.emotion-17 span.align-center > span {
   display: block;
   overflow: hidden;
   margin: 13px auto 0;
   text-align: center;
 }
 
-.emotion-16 span.align-center span img {
+.emotion-17 span.align-center span img {
   margin: 0 auto;
   text-align: center;
 }
 
-.emotion-16 span.align-right {
+.emotion-17 span.align-right {
   display: block;
   overflow: hidden;
   clear: both;
 }
 
-.emotion-16 span.align-right > span {
+.emotion-17 span.align-right > span {
   display: block;
   overflow: hidden;
   margin: 13px 0 0;
   text-align: right;
 }
 
-.emotion-16 span.align-right span img {
+.emotion-17 span.align-right span img {
   margin: 0;
   text-align: right;
 }
 
-.emotion-16 span.float-left {
+.emotion-17 span.float-left {
   display: block;
   margin-right: 13px;
   overflow: hidden;
   float: left;
 }
 
-.emotion-16 span.float-left span {
+.emotion-17 span.float-left span {
   margin: 13px 0 0;
 }
 
-.emotion-16 span.float-right {
+.emotion-17 span.float-right {
   display: block;
   margin-left: 13px;
   overflow: hidden;
   float: right;
 }
 
-.emotion-16 span.float-right > span {
+.emotion-17 span.float-right > span {
   display: block;
   overflow: hidden;
   margin: 13px auto 0;
   text-align: right;
 }
 
-.emotion-16 code,
-.emotion-16 tt {
+.emotion-17 code,
+.emotion-17 tt {
   margin: 0 2px;
   padding: 0 5px;
   white-space: nowrap;
@@ -2646,57 +2784,65 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
 }
 
 <div
-  class="emotion-27"
+  class="emotion-28"
+  title="wrapper"
 >
   <div
-    class="emotion-7"
+    class="emotion-8"
+    title="bar"
   >
     <div
-      class="emotion-2"
+      class="emotion-7"
     >
       <div
-        class="emotion-1"
-        role="tablist"
+        class="emotion-2"
+        title="side left"
+      >
+        <div
+          class="emotion-1"
+          role="tablist"
+        >
+          <button
+            class="emotion-0"
+            role="tab"
+            type="button"
+          >
+            About
+          </button>
+        </div>
+      </div>
+      <div
+        class="emotion-6"
+        title="side right"
       >
         <button
-          class="emotion-0"
-          role="tab"
-          type="button"
+          class="emotion-5"
         >
-          About
+          <svg
+            class="emotion-4"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-3"
+              d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
+            />
+          </svg>
         </button>
       </div>
     </div>
-    <div
-      class="emotion-6"
-    >
-      <button
-        class="emotion-5"
-      >
-        <svg
-          class="emotion-4"
-          viewBox="0 0 1024 1024"
-        >
-          <path
-            class="emotion-3"
-            d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
-          />
-        </svg>
-      </button>
-    </div>
   </div>
   <div
-    class="emotion-26"
+    class="emotion-27"
   >
     <div
-      class="emotion-25"
+      class="emotion-26"
       role="tabpanel"
     >
       <div
-        class="emotion-24"
+        class="emotion-25"
       >
         <header
-          class="emotion-8"
+          class="emotion-9"
         >
           <svg
             title="Storybook icon"
@@ -2731,25 +2877,25 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
           Storybook 5.0.0
         </header>
         <div
-          class="emotion-9"
+          class="emotion-10"
         >
           Looking good! You're up to date.
         </div>
         <div
-          class="emotion-15"
+          class="emotion-16"
         >
           <span
-            class="emotion-10"
+            class="emotion-11"
           >
             5.0.0 Changelog
           </span>
           <a
-            class="emotion-14"
+            class="emotion-15"
             href="https://github.com/storybooks/storybook/blob/master/CHANGELOG.md"
             target="_blank"
           >
             <span
-              class="emotion-13"
+              class="emotion-14"
             >
               Read full changelog
               <svg
@@ -2765,7 +2911,7 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
           </a>
         </div>
         <div
-          class="emotion-16"
+          class="emotion-17"
         >
           <ul>
             <li>
@@ -2786,34 +2932,34 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
           </ul>
         </div>
         <div
-          class="emotion-23"
+          class="emotion-24"
         >
           <a
-            class="emotion-18"
+            class="emotion-19"
             href="https://storybook.js.org"
           >
             <span
-              class="emotion-17"
+              class="emotion-18"
             >
               Docs
             </span>
           </a>
           <a
-            class="emotion-18"
+            class="emotion-19"
             href="https://github.com/storybooks/storybook"
           >
             <span
-              class="emotion-17"
+              class="emotion-18"
             >
               GitHub
             </span>
           </a>
           <a
-            class="emotion-18"
+            class="emotion-19"
             href="https://storybook.js.org/support"
           >
             <span
-              class="emotion-17"
+              class="emotion-18"
             >
               Support
             </span>

From 65d567bfbad44107c6bbaf866b0f0bbfd43ebe8b Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Thu, 21 Feb 2019 16:53:11 +0800
Subject: [PATCH 048/249] Update snapshots

---
 .../__tests__/__snapshots__/Panel.js.snap     |    8 +-
 .../addon-a11y.stories.storyshot              |   38 +-
 .../addon-actions.stories.storyshot           | 1908 ++---------------
 .../__snapshots__/Button.stories.storyshot    |    4 +-
 .../form/__snapshots__/form.stories.storyshot |   60 +-
 .../syntaxhighlighter.stories.storyshot       |    2 +
 .../tabs/__snapshots__/tabs.stories.storyshot |  716 +++----
 .../__snapshots__/ListItem.stories.storyshot  |  218 +-
 .../__snapshots__/Tooltip.stories.storyshot   |   12 +-
 .../TooltipLinkList.stories.storyshot         |  104 +-
 .../TooltipMessage.stories.storyshot          |   16 +-
 .../WithTooltip.stories.storyshot             |    4 +-
 .../__snapshots__/layout.stories.storyshot    |    8 +-
 .../__snapshots__/panel.stories.storyshot     |  192 +-
 .../__snapshots__/preview.stories.storyshot   |  614 +++---
 15 files changed, 1307 insertions(+), 2597 deletions(-)

diff --git a/addons/knobs/src/components/__tests__/__snapshots__/Panel.js.snap b/addons/knobs/src/components/__tests__/__snapshots__/Panel.js.snap
index df555bca26b..d6b39c95eb6 100644
--- a/addons/knobs/src/components/__tests__/__snapshots__/Panel.js.snap
+++ b/addons/knobs/src/components/__tests__/__snapshots__/Panel.js.snap
@@ -40,8 +40,8 @@ Array [
 
 .emotion-0 {
   min-width: 100px;
-  min-height: 32px;
-  margin-right: 16px;
+  font-weight: 700;
+  margin-right: 15px;
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -135,8 +135,8 @@ Array [
 
 .emotion-0 {
   min-width: 100px;
-  min-height: 32px;
-  margin-right: 16px;
+  font-weight: 700;
+  margin-right: 15px;
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
diff --git a/examples/official-storybook/stories/__snapshots__/addon-a11y.stories.storyshot b/examples/official-storybook/stories/__snapshots__/addon-a11y.stories.storyshot
index 425453f21e5..b8fb54e56eb 100644
--- a/examples/official-storybook/stories/__snapshots__/addon-a11y.stories.storyshot
+++ b/examples/official-storybook/stories/__snapshots__/addon-a11y.stories.storyshot
@@ -95,6 +95,25 @@ exports[`Storyshots Addons|A11y/Form With label 1`] = `
   margin-bottom: 3rem;
 }
 
+.emotion-0 {
+  min-width: 100px;
+  font-weight: 700;
+  margin-right: 15px;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: start;
+  -webkit-justify-content: flex-start;
+  -ms-flex-pack: start;
+  justify-content: flex-start;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  line-height: 16px;
+}
+
 .emotion-1 {
   -webkit-appearance: none;
   -moz-appearance: none;
@@ -147,25 +166,6 @@ exports[`Storyshots Addons|A11y/Form With label 1`] = `
   color: #999999;
 }
 
-.emotion-0 {
-  min-width: 100px;
-  min-height: 32px;
-  margin-right: 16px;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-pack: start;
-  -webkit-justify-content: flex-start;
-  -ms-flex-pack: start;
-  justify-content: flex-start;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  line-height: 16px;
-}
-
 <label
   class="emotion-2"
 >
diff --git a/examples/official-storybook/stories/__snapshots__/addon-actions.stories.storyshot b/examples/official-storybook/stories/__snapshots__/addon-actions.stories.storyshot
index 7c798fc6595..8b7cfba5f64 100644
--- a/examples/official-storybook/stories/__snapshots__/addon-actions.stories.storyshot
+++ b/examples/official-storybook/stories/__snapshots__/addon-actions.stories.storyshot
@@ -30,16 +30,11 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -48,38 +43,6 @@ Array [
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -92,23 +55,19 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -150,16 +109,11 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -168,38 +122,6 @@ Array [
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -212,23 +134,19 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -270,16 +188,11 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -288,38 +201,6 @@ Array [
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -332,23 +213,19 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -390,16 +267,11 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -408,38 +280,6 @@ Array [
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -452,23 +292,19 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -510,16 +346,11 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -528,38 +359,6 @@ Array [
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -572,23 +371,19 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -630,16 +425,11 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -648,38 +438,6 @@ Array [
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -692,23 +450,19 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -750,16 +504,11 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -768,38 +517,6 @@ Array [
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -812,23 +529,19 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -870,16 +583,11 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -888,38 +596,6 @@ Array [
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -932,23 +608,19 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -990,16 +662,11 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -1008,38 +675,6 @@ Array [
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -1052,23 +687,19 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -1110,16 +741,11 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -1128,38 +754,6 @@ Array [
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -1172,23 +766,19 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -1230,16 +820,11 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -1248,38 +833,6 @@ Array [
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -1292,23 +845,19 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -1350,16 +899,11 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -1368,38 +912,6 @@ Array [
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -1412,23 +924,19 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -1470,16 +978,11 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -1488,38 +991,6 @@ Array [
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -1532,23 +1003,19 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -1590,16 +1057,11 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -1608,38 +1070,6 @@ Array [
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -1652,23 +1082,19 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -1710,16 +1136,11 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -1728,38 +1149,6 @@ Array [
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -1772,23 +1161,19 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -1830,16 +1215,11 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -1848,38 +1228,6 @@ Array [
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -1892,23 +1240,19 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -1950,16 +1294,11 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -1968,38 +1307,6 @@ Array [
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -2012,23 +1319,19 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -2070,16 +1373,11 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -2088,38 +1386,6 @@ Array [
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -2132,23 +1398,19 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -2190,16 +1452,11 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -2208,38 +1465,6 @@ Array [
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -2252,23 +1477,19 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -2310,16 +1531,11 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -2328,38 +1544,6 @@ Array [
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -2372,23 +1556,19 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -2434,16 +1614,11 @@ exports[`Storyshots Addons|Actions Basic example 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -2452,38 +1627,6 @@ exports[`Storyshots Addons|Actions Basic example 1`] = `
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -2496,23 +1639,19 @@ exports[`Storyshots Addons|Actions Basic example 1`] = `
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -2557,16 +1696,11 @@ exports[`Storyshots Addons|Actions Circular Payload 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -2575,38 +1709,6 @@ exports[`Storyshots Addons|Actions Circular Payload 1`] = `
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -2619,23 +1721,19 @@ exports[`Storyshots Addons|Actions Circular Payload 1`] = `
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -2680,16 +1778,11 @@ exports[`Storyshots Addons|Actions Decorated action + config 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -2698,38 +1791,6 @@ exports[`Storyshots Addons|Actions Decorated action + config 1`] = `
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -2742,23 +1803,19 @@ exports[`Storyshots Addons|Actions Decorated action + config 1`] = `
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -2803,16 +1860,11 @@ exports[`Storyshots Addons|Actions Decorated action 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -2821,38 +1873,6 @@ exports[`Storyshots Addons|Actions Decorated action 1`] = `
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -2865,23 +1885,19 @@ exports[`Storyshots Addons|Actions Decorated action 1`] = `
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -2926,16 +1942,11 @@ exports[`Storyshots Addons|Actions Decorated actions + config 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -2944,38 +1955,6 @@ exports[`Storyshots Addons|Actions Decorated actions + config 1`] = `
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -2988,23 +1967,19 @@ exports[`Storyshots Addons|Actions Decorated actions + config 1`] = `
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -3049,16 +2024,11 @@ exports[`Storyshots Addons|Actions Decorated actions 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -3067,38 +2037,6 @@ exports[`Storyshots Addons|Actions Decorated actions 1`] = `
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -3111,23 +2049,19 @@ exports[`Storyshots Addons|Actions Decorated actions 1`] = `
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -3173,16 +2107,11 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -3191,38 +2120,6 @@ Array [
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -3235,23 +2132,19 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -3293,16 +2186,11 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -3311,38 +2199,6 @@ Array [
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -3355,23 +2211,19 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -3417,16 +2269,11 @@ exports[`Storyshots Addons|Actions Multiple actions + config 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -3435,38 +2282,6 @@ exports[`Storyshots Addons|Actions Multiple actions + config 1`] = `
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -3479,23 +2294,19 @@ exports[`Storyshots Addons|Actions Multiple actions + config 1`] = `
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -3540,16 +2351,11 @@ exports[`Storyshots Addons|Actions Multiple actions 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -3558,38 +2364,6 @@ exports[`Storyshots Addons|Actions Multiple actions 1`] = `
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -3602,23 +2376,19 @@ exports[`Storyshots Addons|Actions Multiple actions 1`] = `
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -3663,16 +2433,11 @@ exports[`Storyshots Addons|Actions Multiple actions as object 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -3681,38 +2446,6 @@ exports[`Storyshots Addons|Actions Multiple actions as object 1`] = `
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -3725,23 +2458,19 @@ exports[`Storyshots Addons|Actions Multiple actions as object 1`] = `
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -3786,16 +2515,11 @@ exports[`Storyshots Addons|Actions Multiple actions, object + config 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -3804,38 +2528,6 @@ exports[`Storyshots Addons|Actions Multiple actions, object + config 1`] = `
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -3848,23 +2540,19 @@ exports[`Storyshots Addons|Actions Multiple actions, object + config 1`] = `
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -3913,16 +2601,11 @@ Array [
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -3931,38 +2614,6 @@ Array [
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -3975,23 +2626,19 @@ Array [
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -4037,16 +2684,11 @@ exports[`Storyshots Addons|Actions Reserved keyword as name 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -4055,38 +2697,6 @@ exports[`Storyshots Addons|Actions Reserved keyword as name 1`] = `
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -4099,23 +2709,19 @@ exports[`Storyshots Addons|Actions Reserved keyword as name 1`] = `
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -4160,16 +2766,11 @@ exports[`Storyshots Addons|Actions configureActionsDepth 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -4178,38 +2779,6 @@ exports[`Storyshots Addons|Actions configureActionsDepth 1`] = `
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -4222,23 +2791,19 @@ exports[`Storyshots Addons|Actions configureActionsDepth 1`] = `
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
@@ -4283,16 +2848,11 @@ exports[`Storyshots Addons|Actions.deprecated Decorated Action 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-  background: #FAFBFC;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
-  display: inline;
   border-radius: 4px;
+  display: inline;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
@@ -4301,38 +2861,6 @@ exports[`Storyshots Addons|Actions.deprecated Decorated Action 1`] = `
   z-index: 2;
 }
 
-.emotion-0:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-0:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0:hover {
-  box-shadow: rgba(0,0,0,.2) 0 2px 6px 0;
-}
-
-.emotion-0 > span {
-  -webkit-transform: scale3d(1,1,1) translate3d(0,0,0);
-  -ms-transform: scale3d(1,1,1) translate3d(0,0,0);
-  transform: scale3d(1,1,1) translate3d(0,0,0);
-  -webkit-transition: -webkit-transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  -webkit-transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  transition: transform 700ms cubic-bezier(0.175,0.885,0.335,1.05);
-  opacity: 1;
-}
-
-.emotion-0 [role="progressbar"] {
-  -webkit-transform: translate3d(0,100%,0);
-  -ms-transform: translate3d(0,100%,0);
-  transform: translate3d(0,100%,0);
-}
-
 .emotion-0 svg {
   display: inline-block;
   height: 14px;
@@ -4345,23 +2873,19 @@ exports[`Storyshots Addons|Actions.deprecated Decorated Action 1`] = `
 }
 
 .emotion-0 svg path {
-  fill: #333333;
+  fill: currentColor;
 }
 
 .emotion-0:hover {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
-  box-shadow: rgba(0,0,0,.1) 0 0 0 3em inset;
+  background: #FFFFFF;
 }
 
 .emotion-0:focus {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
-}
-
-.emotion-0:focus:hover {
-  box-shadow: #1EA7FD 0 0 0 1px inset;
+  box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
 }
 
 .emotion-0:hover {
diff --git a/lib/components/src/Button/__snapshots__/Button.stories.storyshot b/lib/components/src/Button/__snapshots__/Button.stories.storyshot
index f4a1930f4b6..b3095259427 100644
--- a/lib/components/src/Button/__snapshots__/Button.stories.storyshot
+++ b/lib/components/src/Button/__snapshots__/Button.stories.storyshot
@@ -41,7 +41,7 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fff;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
   border-radius: 4px;
@@ -70,7 +70,7 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
 }
 
 .emotion-0:hover {
-  background: #fff;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
diff --git a/lib/components/src/form/__snapshots__/form.stories.storyshot b/lib/components/src/form/__snapshots__/form.stories.storyshot
index c8674c49a33..136f4c46b3d 100644
--- a/lib/components/src/form/__snapshots__/form.stories.storyshot
+++ b/lib/components/src/form/__snapshots__/form.stories.storyshot
@@ -1,6 +1,14 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Storyshots Basics|Form/Button sizes 1`] = `
+.emotion-6 > * {
+  margin-top: 10px;
+}
+
+.emotion-6 > *:first-of-type {
+  margin-top: 0;
+}
+
 .emotion-0 {
   border: 0;
   border-radius: 3em;
@@ -29,7 +37,7 @@ exports[`Storyshots Basics|Form/Button sizes 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fff;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
   border-radius: 4px;
@@ -58,7 +66,7 @@ exports[`Storyshots Basics|Form/Button sizes 1`] = `
 }
 
 .emotion-0:hover {
-  background: #fff;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
@@ -75,14 +83,6 @@ exports[`Storyshots Basics|Form/Button sizes 1`] = `
   transform: none;
 }
 
-.emotion-6 > * {
-  margin-top: 10px;
-}
-
-.emotion-6 > *:first-of-type {
-  margin-top: 0;
-}
-
 .emotion-1 {
   display: -webkit-box;
   display: -webkit-flex;
@@ -118,7 +118,7 @@ exports[`Storyshots Basics|Form/Button sizes 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fff;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
   border-radius: 4px;
@@ -149,7 +149,7 @@ exports[`Storyshots Basics|Form/Button sizes 1`] = `
 }
 
 .emotion-2:hover {
-  background: #fff;
+  background: #f2f2f2;
 }
 
 .emotion-2:active {
@@ -194,7 +194,7 @@ exports[`Storyshots Basics|Form/Button sizes 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fff;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
   border-radius: 4px;
@@ -223,7 +223,7 @@ exports[`Storyshots Basics|Form/Button sizes 1`] = `
 }
 
 .emotion-4:hover {
-  background: #fff;
+  background: #f2f2f2;
 }
 
 .emotion-4:active {
@@ -317,7 +317,7 @@ exports[`Storyshots Basics|Form/Button validations 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fff;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
   border-radius: 4px;
@@ -346,7 +346,7 @@ exports[`Storyshots Basics|Form/Button validations 1`] = `
 }
 
 .emotion-6:hover {
-  background: #fff;
+  background: #f2f2f2;
 }
 
 .emotion-6:active {
@@ -391,7 +391,7 @@ exports[`Storyshots Basics|Form/Button validations 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fff;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
   border-radius: 4px;
@@ -421,7 +421,7 @@ exports[`Storyshots Basics|Form/Button validations 1`] = `
 }
 
 .emotion-0:hover {
-  background: #fff;
+  background: #f2f2f2;
 }
 
 .emotion-0:active {
@@ -466,7 +466,7 @@ exports[`Storyshots Basics|Form/Button validations 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fff;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
   border-radius: 4px;
@@ -496,7 +496,7 @@ exports[`Storyshots Basics|Form/Button validations 1`] = `
 }
 
 .emotion-2:hover {
-  background: #fff;
+  background: #f2f2f2;
 }
 
 .emotion-2:active {
@@ -541,7 +541,7 @@ exports[`Storyshots Basics|Form/Button validations 1`] = `
   font-size: 12px;
   font-weight: 700;
   line-height: 1;
-  background: #fff;
+  background: #fafafa;
   color: #333333;
   box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
   border-radius: 4px;
@@ -571,7 +571,7 @@ exports[`Storyshots Basics|Form/Button validations 1`] = `
 }
 
 .emotion-4:hover {
-  background: #fff;
+  background: #f2f2f2;
 }
 
 .emotion-4:active {
@@ -1429,6 +1429,14 @@ exports[`Storyshots Basics|Form/Input validations 1`] = `
 `;
 
 exports[`Storyshots Basics|Form/Select sizes 1`] = `
+.emotion-6 > * {
+  margin-top: 10px;
+}
+
+.emotion-6 > *:first-of-type {
+  margin-top: 0;
+}
+
 .emotion-0 {
   -webkit-appearance: none;
   -moz-appearance: none;
@@ -1488,14 +1496,6 @@ exports[`Storyshots Basics|Form/Select sizes 1`] = `
   color: #999999;
 }
 
-.emotion-6 > * {
-  margin-top: 10px;
-}
-
-.emotion-6 > *:first-of-type {
-  margin-top: 0;
-}
-
 .emotion-1 {
   display: -webkit-box;
   display: -webkit-flex;
diff --git a/lib/components/src/syntaxhighlighter/__snapshots__/syntaxhighlighter.stories.storyshot b/lib/components/src/syntaxhighlighter/__snapshots__/syntaxhighlighter.stories.storyshot
index 3e85209335f..83209e363fb 100644
--- a/lib/components/src/syntaxhighlighter/__snapshots__/syntaxhighlighter.stories.storyshot
+++ b/lib/components/src/syntaxhighlighter/__snapshots__/syntaxhighlighter.stories.storyshot
@@ -405,6 +405,7 @@ exports[`Storyshots Basics|SyntaxHighlighter bordered & copy-able 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
+  background: #FFFFFF;
 }
 
 .emotion-3 {
@@ -420,6 +421,7 @@ exports[`Storyshots Basics|SyntaxHighlighter bordered & copy-able 1`] = `
   -ms-flex-align: center;
   align-items: center;
   color: #333333;
+  background: #FFFFFF;
   font-size: 12px;
   line-height: 16px;
   font-weight: 700;
diff --git a/lib/components/src/tabs/__snapshots__/tabs.stories.storyshot b/lib/components/src/tabs/__snapshots__/tabs.stories.storyshot
index e1690b24bf7..e4a5400de7b 100644
--- a/lib/components/src/tabs/__snapshots__/tabs.stories.storyshot
+++ b/lib/components/src/tabs/__snapshots__/tabs.stories.storyshot
@@ -1,55 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Storyshots Basics|Tabs stateful - dynamic 1`] = `
-.emotion-2 {
-  white-space: normal;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding: 0 15px;
-  text-transform: capitalize;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  height: 40px;
-  line-height: 12px;
-  cursor: pointer;
-  background: transparent;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  font-weight: bold;
-  font-size: 13px;
-  color: #1EA7FD;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-2:empty {
-  display: none;
-}
-
-.emotion-2:focus {
-  outline: 0 none;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-12 {
-  display: block;
-}
-
 .emotion-9 {
   color: #999999;
   height: 40px;
@@ -68,7 +19,7 @@ exports[`Storyshots Basics|Tabs stateful - dynamic 1`] = `
   -moz-scrollbar-color: transparent transparent;
   -ms-scrollbar-color: transparent transparent;
   scrollbar-color: transparent transparent;
-  background: undefined linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
 }
 
 .emotion-9::-webkit-scrollbar {
@@ -185,6 +136,55 @@ exports[`Storyshots Basics|Tabs stateful - dynamic 1`] = `
   border-bottom-color: #1EA7FD;
 }
 
+.emotion-2 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
+  font-size: 13px;
+  color: #1EA7FD;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-2:empty {
+  display: none;
+}
+
+.emotion-2:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-12 {
+  display: block;
+}
+
 .emotion-11 {
   display: block;
   position: relative;
@@ -334,55 +334,6 @@ exports[`Storyshots Basics|Tabs stateful - dynamic 1`] = `
 `;
 
 exports[`Storyshots Basics|Tabs stateful - no initial 1`] = `
-.emotion-0 {
-  white-space: normal;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding: 0 15px;
-  text-transform: capitalize;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  height: 40px;
-  line-height: 12px;
-  cursor: pointer;
-  background: transparent;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  font-weight: bold;
-  font-size: 13px;
-  color: #1EA7FD;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-0:empty {
-  display: none;
-}
-
-.emotion-0:focus {
-  outline: 0 none;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-12 {
-  display: block;
-}
-
 .emotion-9 {
   color: #999999;
   height: 40px;
@@ -401,7 +352,7 @@ exports[`Storyshots Basics|Tabs stateful - no initial 1`] = `
   -moz-scrollbar-color: transparent transparent;
   -ms-scrollbar-color: transparent transparent;
   scrollbar-color: transparent transparent;
-  background: undefined linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
 }
 
 .emotion-9::-webkit-scrollbar {
@@ -518,6 +469,55 @@ exports[`Storyshots Basics|Tabs stateful - no initial 1`] = `
   border-bottom-color: #1EA7FD;
 }
 
+.emotion-0 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
+  font-size: 13px;
+  color: #1EA7FD;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-0:empty {
+  display: none;
+}
+
+.emotion-0:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-12 {
+  display: block;
+}
+
 .emotion-11 {
   display: block;
   position: relative;
@@ -623,55 +623,6 @@ exports[`Storyshots Basics|Tabs stateful - no initial 1`] = `
 `;
 
 exports[`Storyshots Basics|Tabs stateful - static 1`] = `
-.emotion-1 {
-  white-space: normal;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding: 0 15px;
-  text-transform: capitalize;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  height: 40px;
-  line-height: 12px;
-  cursor: pointer;
-  background: transparent;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  font-weight: bold;
-  font-size: 13px;
-  color: #1EA7FD;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-1:empty {
-  display: none;
-}
-
-.emotion-1:focus {
-  outline: 0 none;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-6 {
-  display: block;
-}
-
 .emotion-5 {
   color: #999999;
   height: 40px;
@@ -690,7 +641,7 @@ exports[`Storyshots Basics|Tabs stateful - static 1`] = `
   -moz-scrollbar-color: transparent transparent;
   -ms-scrollbar-color: transparent transparent;
   scrollbar-color: transparent transparent;
-  background: undefined linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
 }
 
 .emotion-5::-webkit-scrollbar {
@@ -807,6 +758,55 @@ exports[`Storyshots Basics|Tabs stateful - static 1`] = `
   border-bottom-color: #1EA7FD;
 }
 
+.emotion-1 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
+  font-size: 13px;
+  color: #1EA7FD;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-1:empty {
+  display: none;
+}
+
+.emotion-1:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-6 {
+  display: block;
+}
+
 .emotion-7 {
   display: block;
   position: relative;
@@ -870,63 +870,6 @@ exports[`Storyshots Basics|Tabs stateful - static 1`] = `
 `;
 
 exports[`Storyshots Basics|Tabs stateless - absolute 1`] = `
-.emotion-2 {
-  white-space: normal;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding: 0 15px;
-  text-transform: capitalize;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  height: 40px;
-  line-height: 12px;
-  cursor: pointer;
-  background: transparent;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  font-weight: bold;
-  font-size: 13px;
-  color: #1EA7FD;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-2:empty {
-  display: none;
-}
-
-.emotion-2:focus {
-  outline: 0 none;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-11 {
-  display: block;
-  position: relative;
-  font-size: 13px;
-  position: relative;
-  overflow: auto;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  width: 100%;
-}
-
 .emotion-9 {
   color: #999999;
   height: 40px;
@@ -945,7 +888,7 @@ exports[`Storyshots Basics|Tabs stateless - absolute 1`] = `
   -moz-scrollbar-color: transparent transparent;
   -ms-scrollbar-color: transparent transparent;
   scrollbar-color: transparent transparent;
-  background: undefined linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
 }
 
 .emotion-9::-webkit-scrollbar {
@@ -1062,6 +1005,63 @@ exports[`Storyshots Basics|Tabs stateless - absolute 1`] = `
   border-bottom-color: #1EA7FD;
 }
 
+.emotion-2 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
+  font-size: 13px;
+  color: #1EA7FD;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-2:empty {
+  display: none;
+}
+
+.emotion-2:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-11 {
+  display: block;
+  position: relative;
+  font-size: 13px;
+  position: relative;
+  overflow: auto;
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  width: 100%;
+}
+
 .emotion-10 {
   display: none;
 }
@@ -1220,51 +1220,6 @@ exports[`Storyshots Basics|Tabs stateless - absolute 1`] = `
 `;
 
 exports[`Storyshots Basics|Tabs stateless - bordered 1`] = `
-.emotion-2 {
-  white-space: normal;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding: 0 15px;
-  text-transform: capitalize;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  height: 40px;
-  line-height: 12px;
-  cursor: pointer;
-  background: transparent;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  font-weight: bold;
-  font-size: 13px;
-  color: #1EA7FD;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-2:empty {
-  display: none;
-}
-
-.emotion-2:focus {
-  outline: 0 none;
-  border-bottom-color: #1EA7FD;
-}
-
 .emotion-9 {
   color: #999999;
   height: 40px;
@@ -1283,7 +1238,7 @@ exports[`Storyshots Basics|Tabs stateless - bordered 1`] = `
   -moz-scrollbar-color: transparent transparent;
   -ms-scrollbar-color: transparent transparent;
   scrollbar-color: transparent transparent;
-  background: undefined linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
 }
 
 .emotion-9::-webkit-scrollbar {
@@ -1400,6 +1355,51 @@ exports[`Storyshots Basics|Tabs stateless - bordered 1`] = `
   border-bottom-color: #1EA7FD;
 }
 
+.emotion-2 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
+  font-size: 13px;
+  color: #1EA7FD;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-2:empty {
+  display: none;
+}
+
+.emotion-2:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
 .emotion-11 {
   display: block;
   position: relative;
@@ -1555,10 +1555,6 @@ exports[`Storyshots Basics|Tabs stateless - bordered 1`] = `
 `;
 
 exports[`Storyshots Basics|Tabs stateless - empty 1`] = `
-.emotion-0 {
-  font-weight: 700;
-}
-
 .emotion-1 {
   padding: 30px;
   text-align: center;
@@ -1566,6 +1562,10 @@ exports[`Storyshots Basics|Tabs stateless - empty 1`] = `
   font-size: 13px;
 }
 
+.emotion-0 {
+  font-weight: 700;
+}
+
 <div
   style="height:calc(100vh - 20px)"
 >
@@ -1582,51 +1582,6 @@ exports[`Storyshots Basics|Tabs stateless - empty 1`] = `
 `;
 
 exports[`Storyshots Basics|Tabs stateless - no scrolling 1`] = `
-.emotion-2 {
-  white-space: normal;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding: 0 15px;
-  text-transform: capitalize;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  height: 40px;
-  line-height: 12px;
-  cursor: pointer;
-  background: transparent;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  font-weight: bold;
-  font-size: 13px;
-  color: #1EA7FD;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-2:empty {
-  display: none;
-}
-
-.emotion-2:focus {
-  outline: 0 none;
-  border-bottom-color: #1EA7FD;
-}
-
 .emotion-9 {
   color: #999999;
   height: 40px;
@@ -1645,7 +1600,7 @@ exports[`Storyshots Basics|Tabs stateless - no scrolling 1`] = `
   -moz-scrollbar-color: transparent transparent;
   -ms-scrollbar-color: transparent transparent;
   scrollbar-color: transparent transparent;
-  background: undefined linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
 }
 
 .emotion-9::-webkit-scrollbar {
@@ -1762,6 +1717,51 @@ exports[`Storyshots Basics|Tabs stateless - no scrolling 1`] = `
   border-bottom-color: #1EA7FD;
 }
 
+.emotion-2 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
+  font-size: 13px;
+  color: #1EA7FD;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-2:empty {
+  display: none;
+}
+
+.emotion-2:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
 .emotion-11 {
   display: block;
   position: relative;
@@ -1917,55 +1917,6 @@ exports[`Storyshots Basics|Tabs stateless - no scrolling 1`] = `
 `;
 
 exports[`Storyshots Basics|Tabs stateless - with tools 1`] = `
-.emotion-2 {
-  white-space: normal;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding: 0 15px;
-  text-transform: capitalize;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  height: 40px;
-  line-height: 12px;
-  cursor: pointer;
-  background: transparent;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  font-weight: bold;
-  font-size: 13px;
-  color: #1EA7FD;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-2:empty {
-  display: none;
-}
-
-.emotion-2:focus {
-  outline: 0 none;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-13 {
-  display: block;
-}
-
 .emotion-10 {
   color: #999999;
   height: 40px;
@@ -1984,7 +1935,7 @@ exports[`Storyshots Basics|Tabs stateless - with tools 1`] = `
   -moz-scrollbar-color: transparent transparent;
   -ms-scrollbar-color: transparent transparent;
   scrollbar-color: transparent transparent;
-  background: undefined linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
 }
 
 .emotion-10::-webkit-scrollbar {
@@ -2101,16 +2052,51 @@ exports[`Storyshots Basics|Tabs stateless - with tools 1`] = `
   border-bottom-color: #1EA7FD;
 }
 
-.emotion-12 {
-  display: block;
-  position: relative;
+.emotion-2 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
   font-size: 13px;
+  color: #1EA7FD;
+  border-bottom-color: #1EA7FD;
 }
 
-.emotion-11 {
+.emotion-2:empty {
   display: none;
 }
 
+.emotion-2:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
 .emotion-8 {
   display: -webkit-box;
   display: -webkit-flex;
@@ -2129,6 +2115,20 @@ exports[`Storyshots Basics|Tabs stateless - with tools 1`] = `
   margin-right: 15px;
 }
 
+.emotion-13 {
+  display: block;
+}
+
+.emotion-12 {
+  display: block;
+  position: relative;
+  font-size: 13px;
+}
+
+.emotion-11 {
+  display: none;
+}
+
 <div
   style="height:calc(100vh - 20px)"
 >
diff --git a/lib/components/src/tooltip/__snapshots__/ListItem.stories.storyshot b/lib/components/src/tooltip/__snapshots__/ListItem.stories.storyshot
index 832986157ec..d8481a0e4e6 100644
--- a/lib/components/src/tooltip/__snapshots__/ListItem.stories.storyshot
+++ b/lib/components/src/tooltip/__snapshots__/ListItem.stories.storyshot
@@ -13,21 +13,6 @@ exports[`Storyshots basics|Tooltip/ListItem active icon 1`] = `
   fill: currentColor;
 }
 
-.emotion-1 {
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  text-align: left;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-}
-
-.emotion-1 > * + * {
-  padding-left: 10px;
-}
-
 .emotion-5 {
   font-size: 12px;
   -webkit-transition: all 150ms ease-out;
@@ -64,6 +49,21 @@ exports[`Storyshots basics|Tooltip/ListItem active icon 1`] = `
   opacity: 1;
 }
 
+.emotion-1 {
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  text-align: left;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+}
+
+.emotion-1 > * + * {
+  padding-left: 10px;
+}
+
 .emotion-0 {
   color: #333333;
   color: #FF4785;
@@ -183,21 +183,6 @@ exports[`Storyshots basics|Tooltip/ListItem all 1`] = `
   fill: currentColor;
 }
 
-.emotion-1 {
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  text-align: left;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-}
-
-.emotion-1 > * + * {
-  padding-left: 10px;
-}
-
 .emotion-2 {
   font-size: 12px;
   -webkit-transition: all 150ms ease-out;
@@ -234,6 +219,25 @@ exports[`Storyshots basics|Tooltip/ListItem all 1`] = `
   opacity: 1;
 }
 
+.emotion-1 {
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  text-align: left;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+}
+
+.emotion-1 > * + * {
+  padding-left: 10px;
+}
+
+.emotion-3 {
+  color: #333333;
+}
+
 .emotion-0 {
   color: #333333;
   -webkit-animation: animation-0 1.5s ease-in-out infinite;
@@ -243,10 +247,6 @@ exports[`Storyshots basics|Tooltip/ListItem all 1`] = `
   cursor: progress;
 }
 
-.emotion-3 {
-  color: #333333;
-}
-
 .emotion-10 svg {
   -webkit-transition: all 200ms ease-out;
   transition: all 200ms ease-out;
@@ -546,21 +546,6 @@ exports[`Storyshots basics|Tooltip/ListItem all 1`] = `
 `;
 
 exports[`Storyshots basics|Tooltip/ListItem default 1`] = `
-.emotion-1 {
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  text-align: left;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-}
-
-.emotion-1 > * + * {
-  padding-left: 10px;
-}
-
 .emotion-2 {
   font-size: 12px;
   -webkit-transition: all 150ms ease-out;
@@ -597,6 +582,21 @@ exports[`Storyshots basics|Tooltip/ListItem default 1`] = `
   opacity: 1;
 }
 
+.emotion-1 {
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  text-align: left;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+}
+
+.emotion-1 > * + * {
+  padding-left: 10px;
+}
+
 .emotion-0 {
   color: #333333;
 }
@@ -629,21 +629,6 @@ exports[`Storyshots basics|Tooltip/ListItem default icon 1`] = `
   fill: currentColor;
 }
 
-.emotion-1 {
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  text-align: left;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-}
-
-.emotion-1 > * + * {
-  padding-left: 10px;
-}
-
 .emotion-5 {
   font-size: 12px;
   -webkit-transition: all 150ms ease-out;
@@ -680,6 +665,21 @@ exports[`Storyshots basics|Tooltip/ListItem default icon 1`] = `
   opacity: 1;
 }
 
+.emotion-1 {
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  text-align: left;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+}
+
+.emotion-1 > * + * {
+  padding-left: 10px;
+}
+
 .emotion-0 {
   color: #333333;
 }
@@ -892,21 +892,6 @@ exports[`Storyshots basics|Tooltip/ListItem loading 1`] = `
   }
 }
 
-.emotion-1 {
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  text-align: left;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-}
-
-.emotion-1 > * + * {
-  padding-left: 10px;
-}
-
 .emotion-2 {
   font-size: 12px;
   -webkit-transition: all 150ms ease-out;
@@ -943,6 +928,21 @@ exports[`Storyshots basics|Tooltip/ListItem loading 1`] = `
   opacity: 1;
 }
 
+.emotion-1 {
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  text-align: left;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+}
+
+.emotion-1 > * + * {
+  padding-left: 10px;
+}
+
 .emotion-0 {
   color: #333333;
   -webkit-animation: animation-0 1.5s ease-in-out infinite;
@@ -970,21 +970,6 @@ exports[`Storyshots basics|Tooltip/ListItem loading 1`] = `
 `;
 
 exports[`Storyshots basics|Tooltip/ListItem w/positions 1`] = `
-.emotion-3 {
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  text-align: left;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-}
-
-.emotion-3 > * + * {
-  padding-left: 10px;
-}
-
 .emotion-5 {
   font-size: 12px;
   -webkit-transition: all 150ms ease-out;
@@ -1021,6 +1006,21 @@ exports[`Storyshots basics|Tooltip/ListItem w/positions 1`] = `
   opacity: 1;
 }
 
+.emotion-3 {
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  text-align: left;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+}
+
+.emotion-3 > * + * {
+  padding-left: 10px;
+}
+
 .emotion-1 {
   color: #333333;
 }
@@ -1077,21 +1077,6 @@ exports[`Storyshots basics|Tooltip/ListItem w/positions 1`] = `
 `;
 
 exports[`Storyshots basics|Tooltip/ListItem w/positions active 1`] = `
-.emotion-3 {
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  text-align: left;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-}
-
-.emotion-3 > * + * {
-  padding-left: 10px;
-}
-
 .emotion-5 {
   font-size: 12px;
   -webkit-transition: all 150ms ease-out;
@@ -1128,6 +1113,21 @@ exports[`Storyshots basics|Tooltip/ListItem w/positions active 1`] = `
   opacity: 1;
 }
 
+.emotion-3 {
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  text-align: left;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+}
+
+.emotion-3 > * + * {
+  padding-left: 10px;
+}
+
 .emotion-0 svg {
   opacity: 1;
 }
diff --git a/lib/components/src/tooltip/__snapshots__/Tooltip.stories.storyshot b/lib/components/src/tooltip/__snapshots__/Tooltip.stories.storyshot
index 19dc793d25f..baeb3ec4662 100644
--- a/lib/components/src/tooltip/__snapshots__/Tooltip.stories.storyshot
+++ b/lib/components/src/tooltip/__snapshots__/Tooltip.stories.storyshot
@@ -77,7 +77,7 @@ exports[`Storyshots basics/Tooltip/Tooltip basic, default, bottom 1`] = `
   margin-top: 10px;
   margin-left: 0px;
   margin-right: 0px;
-  background: rgba(0,0,0,0.95);
+  background: rgba(255,255,255,0.95);
   -webkit-filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
   filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
   border-radius: 8px;
@@ -100,7 +100,7 @@ exports[`Storyshots basics/Tooltip/Tooltip basic, default, bottom 1`] = `
   border-right-width: 8px;
   border-left-width: 8px;
   border-top-color: transparent;
-  border-bottom-color: rgba(0,0,0,0.95);
+  border-bottom-color: rgba(255,255,255,0.95);
   border-left-color: transparent;
   border-right-color: transparent;
 }
@@ -136,7 +136,7 @@ exports[`Storyshots basics/Tooltip/Tooltip basic, default, left 1`] = `
   margin-top: 0px;
   margin-left: 0px;
   margin-right: 10px;
-  background: rgba(0,0,0,0.95);
+  background: rgba(255,255,255,0.95);
   -webkit-filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
   filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
   border-radius: 8px;
@@ -160,7 +160,7 @@ exports[`Storyshots basics/Tooltip/Tooltip basic, default, left 1`] = `
   border-left-width: 8px;
   border-top-color: transparent;
   border-bottom-color: transparent;
-  border-left-color: rgba(0,0,0,0.95);
+  border-left-color: rgba(255,255,255,0.95);
   border-right-color: transparent;
 }
 
@@ -195,7 +195,7 @@ exports[`Storyshots basics/Tooltip/Tooltip basic, default, right 1`] = `
   margin-top: 0px;
   margin-left: 10px;
   margin-right: 0px;
-  background: rgba(0,0,0,0.95);
+  background: rgba(255,255,255,0.95);
   -webkit-filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
   filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
   border-radius: 8px;
@@ -220,7 +220,7 @@ exports[`Storyshots basics/Tooltip/Tooltip basic, default, right 1`] = `
   border-top-color: transparent;
   border-bottom-color: transparent;
   border-left-color: transparent;
-  border-right-color: rgba(0,0,0,0.95);
+  border-right-color: rgba(255,255,255,0.95);
 }
 
 <div
diff --git a/lib/components/src/tooltip/__snapshots__/TooltipLinkList.stories.storyshot b/lib/components/src/tooltip/__snapshots__/TooltipLinkList.stories.storyshot
index 4ce6af174ec..7d341d74cbd 100644
--- a/lib/components/src/tooltip/__snapshots__/TooltipLinkList.stories.storyshot
+++ b/lib/components/src/tooltip/__snapshots__/TooltipLinkList.stories.storyshot
@@ -1,24 +1,10 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Storyshots basics/Tooltip/TooltipLinkList links 1`] = `
-.emotion-3 {
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  text-align: left;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-}
-
-.emotion-3 > * + * {
-  padding-left: 10px;
-}
-
-.emotion-0 {
-  display: inline-block;
-  cursor: pointer;
+.emotion-8 {
+  min-width: 180px;
+  overflow: hidden;
+  border-radius: 8px;
 }
 
 .emotion-4 {
@@ -57,10 +43,30 @@ exports[`Storyshots basics/Tooltip/TooltipLinkList links 1`] = `
   opacity: 1;
 }
 
+.emotion-3 {
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  text-align: left;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+}
+
+.emotion-3 > * + * {
+  padding-left: 10px;
+}
+
 .emotion-2 {
   color: #333333;
 }
 
+.emotion-0 {
+  display: inline-block;
+  cursor: pointer;
+}
+
 .emotion-9 {
   display: inline-block;
   z-index: 2147483647;
@@ -68,7 +74,7 @@ exports[`Storyshots basics/Tooltip/TooltipLinkList links 1`] = `
   margin-top: 0px;
   margin-left: 0px;
   margin-right: 0px;
-  background: rgba(0,0,0,0.95);
+  background: rgba(255,255,255,0.95);
   -webkit-filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
   filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
   border-radius: 8px;
@@ -90,18 +96,12 @@ exports[`Storyshots basics/Tooltip/TooltipLinkList links 1`] = `
   border-top-width: 8px;
   border-right-width: 8px;
   border-left-width: 8px;
-  border-top-color: rgba(0,0,0,0.95);
+  border-top-color: rgba(255,255,255,0.95);
   border-bottom-color: transparent;
   border-left-color: transparent;
   border-right-color: transparent;
 }
 
-.emotion-8 {
-  min-width: 180px;
-  overflow: hidden;
-  border-radius: 8px;
-}
-
 <div
   style="height:300px"
 >
@@ -156,24 +156,10 @@ exports[`Storyshots basics/Tooltip/TooltipLinkList links 1`] = `
 `;
 
 exports[`Storyshots basics/Tooltip/TooltipLinkList links and callback 1`] = `
-.emotion-3 {
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  text-align: left;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-}
-
-.emotion-3 > * + * {
-  padding-left: 10px;
-}
-
-.emotion-0 {
-  display: inline-block;
-  cursor: pointer;
+.emotion-11 {
+  min-width: 180px;
+  overflow: hidden;
+  border-radius: 8px;
 }
 
 .emotion-4 {
@@ -212,10 +198,30 @@ exports[`Storyshots basics/Tooltip/TooltipLinkList links and callback 1`] = `
   opacity: 1;
 }
 
+.emotion-3 {
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  text-align: left;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+}
+
+.emotion-3 > * + * {
+  padding-left: 10px;
+}
+
 .emotion-2 {
   color: #333333;
 }
 
+.emotion-0 {
+  display: inline-block;
+  cursor: pointer;
+}
+
 .emotion-12 {
   display: inline-block;
   z-index: 2147483647;
@@ -223,7 +229,7 @@ exports[`Storyshots basics/Tooltip/TooltipLinkList links and callback 1`] = `
   margin-top: 0px;
   margin-left: 0px;
   margin-right: 0px;
-  background: rgba(0,0,0,0.95);
+  background: rgba(255,255,255,0.95);
   -webkit-filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
   filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
   border-radius: 8px;
@@ -245,18 +251,12 @@ exports[`Storyshots basics/Tooltip/TooltipLinkList links and callback 1`] = `
   border-top-width: 8px;
   border-right-width: 8px;
   border-left-width: 8px;
-  border-top-color: rgba(0,0,0,0.95);
+  border-top-color: rgba(255,255,255,0.95);
   border-bottom-color: transparent;
   border-left-color: transparent;
   border-right-color: transparent;
 }
 
-.emotion-11 {
-  min-width: 180px;
-  overflow: hidden;
-  border-radius: 8px;
-}
-
 <div
   style="height:300px"
 >
diff --git a/lib/components/src/tooltip/__snapshots__/TooltipMessage.stories.storyshot b/lib/components/src/tooltip/__snapshots__/TooltipMessage.stories.storyshot
index 77a33766ec1..b38f7898aa3 100644
--- a/lib/components/src/tooltip/__snapshots__/TooltipMessage.stories.storyshot
+++ b/lib/components/src/tooltip/__snapshots__/TooltipMessage.stories.storyshot
@@ -13,7 +13,7 @@ exports[`Storyshots basics/Tooltip/TooltipMessage default 1`] = `
   margin-top: 0px;
   margin-left: 0px;
   margin-right: 0px;
-  background: rgba(0,0,0,0.95);
+  background: rgba(255,255,255,0.95);
   -webkit-filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
   filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
   border-radius: 8px;
@@ -35,7 +35,7 @@ exports[`Storyshots basics/Tooltip/TooltipMessage default 1`] = `
   border-top-width: 8px;
   border-right-width: 8px;
   border-left-width: 8px;
-  border-top-color: rgba(0,0,0,0.95);
+  border-top-color: rgba(255,255,255,0.95);
   border-bottom-color: transparent;
   border-left-color: transparent;
   border-right-color: transparent;
@@ -108,7 +108,7 @@ exports[`Storyshots basics/Tooltip/TooltipMessage minimal message 1`] = `
   margin-top: 0px;
   margin-left: 0px;
   margin-right: 0px;
-  background: rgba(0,0,0,0.95);
+  background: rgba(255,255,255,0.95);
   -webkit-filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
   filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
   border-radius: 8px;
@@ -130,7 +130,7 @@ exports[`Storyshots basics/Tooltip/TooltipMessage minimal message 1`] = `
   border-top-width: 8px;
   border-right-width: 8px;
   border-left-width: 8px;
-  border-top-color: rgba(0,0,0,0.95);
+  border-top-color: rgba(255,255,255,0.95);
   border-bottom-color: transparent;
   border-left-color: transparent;
   border-right-color: transparent;
@@ -236,7 +236,7 @@ exports[`Storyshots basics/Tooltip/TooltipMessage with link 1`] = `
   margin-top: 0px;
   margin-left: 0px;
   margin-right: 0px;
-  background: rgba(0,0,0,0.95);
+  background: rgba(255,255,255,0.95);
   -webkit-filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
   filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
   border-radius: 8px;
@@ -258,7 +258,7 @@ exports[`Storyshots basics/Tooltip/TooltipMessage with link 1`] = `
   border-top-width: 8px;
   border-right-width: 8px;
   border-left-width: 8px;
-  border-top-color: rgba(0,0,0,0.95);
+  border-top-color: rgba(255,255,255,0.95);
   border-bottom-color: transparent;
   border-left-color: transparent;
   border-right-color: transparent;
@@ -397,7 +397,7 @@ exports[`Storyshots basics/Tooltip/TooltipMessage with links 1`] = `
   margin-top: 0px;
   margin-left: 0px;
   margin-right: 0px;
-  background: rgba(0,0,0,0.95);
+  background: rgba(255,255,255,0.95);
   -webkit-filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
   filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
   border-radius: 8px;
@@ -419,7 +419,7 @@ exports[`Storyshots basics/Tooltip/TooltipMessage with links 1`] = `
   border-top-width: 8px;
   border-right-width: 8px;
   border-left-width: 8px;
-  border-top-color: rgba(0,0,0,0.95);
+  border-top-color: rgba(255,255,255,0.95);
   border-bottom-color: transparent;
   border-left-color: transparent;
   border-right-color: transparent;
diff --git a/lib/components/src/tooltip/__snapshots__/WithTooltip.stories.storyshot b/lib/components/src/tooltip/__snapshots__/WithTooltip.stories.storyshot
index 7f3adb7675e..5faba31ab23 100644
--- a/lib/components/src/tooltip/__snapshots__/WithTooltip.stories.storyshot
+++ b/lib/components/src/tooltip/__snapshots__/WithTooltip.stories.storyshot
@@ -208,7 +208,7 @@ exports[`Storyshots basics/Tooltip/WithTooltip simple click start open 1`] = `
   margin-top: 0px;
   margin-left: 0px;
   margin-right: 0px;
-  background: rgba(0,0,0,0.95);
+  background: rgba(255,255,255,0.95);
   -webkit-filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
   filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1));
   border-radius: 8px;
@@ -230,7 +230,7 @@ exports[`Storyshots basics/Tooltip/WithTooltip simple click start open 1`] = `
   border-top-width: 8px;
   border-right-width: 8px;
   border-left-width: 8px;
-  border-top-color: rgba(0,0,0,0.95);
+  border-top-color: rgba(255,255,255,0.95);
   border-bottom-color: transparent;
   border-left-color: transparent;
   border-right-color: transparent;
diff --git a/lib/ui/src/components/layout/__snapshots__/layout.stories.storyshot b/lib/ui/src/components/layout/__snapshots__/layout.stories.storyshot
index 84434154b8e..8521c926594 100644
--- a/lib/ui/src/components/layout/__snapshots__/layout.stories.storyshot
+++ b/lib/ui/src/components/layout/__snapshots__/layout.stories.storyshot
@@ -313,7 +313,7 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 0 1`] = `
   border-bottom: 3px solid transparent;
   font-weight: bold;
   font-size: 13px;
-  opacity: 0.4;
+  color: inherit;
   border-bottom-color: transparent;
 }
 
@@ -602,7 +602,7 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 1 1`] = `
   border-bottom: 3px solid transparent;
   font-weight: bold;
   font-size: 13px;
-  opacity: 0.4;
+  color: inherit;
   border-bottom-color: transparent;
 }
 
@@ -891,7 +891,7 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 2 1`] = `
   border-bottom: 3px solid transparent;
   font-weight: bold;
   font-size: 13px;
-  opacity: 0.4;
+  color: inherit;
   border-bottom-color: transparent;
 }
 
@@ -1180,7 +1180,7 @@ exports[`Storyshots UI|Layout/Mobile (mocked) page 1`] = `
   border-bottom: 3px solid transparent;
   font-weight: bold;
   font-size: 13px;
-  opacity: 0.4;
+  color: inherit;
   border-bottom-color: transparent;
 }
 
diff --git a/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot b/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot
index 9c9f84cf70c..9b47032ffb7 100644
--- a/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot
+++ b/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot
@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Storyshots UI|Panel default 1`] = `
-.emotion-13 {
+.emotion-14 {
   width: 100%;
   height: 100%;
   box-sizing: border-box;
@@ -14,6 +14,57 @@ exports[`Storyshots UI|Panel default 1`] = `
   flex-direction: column;
 }
 
+.emotion-12 {
+  color: #999999;
+  height: 40px;
+  overflow: auto;
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-12::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+}
+
+.emotion-12::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-12::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-12::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
+}
+
 .emotion-11 {
   display: -webkit-box;
   display: -webkit-flex;
@@ -23,14 +74,9 @@ exports[`Storyshots UI|Panel default 1`] = `
   -webkit-justify-content: space-between;
   -ms-flex-pack: justify;
   justify-content: space-between;
-  background: #FFFFFF;
-  color: #999999;
-  height: 40px;
   position: relative;
-  overflow: visible;
-  overflow-x: visible;
-  overflow-y: visible;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+  white-space: nowrap;
+  height: 40px;
 }
 
 .emotion-3 {
@@ -38,9 +84,12 @@ exports[`Storyshots UI|Panel default 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
 }
 
 .emotion-3 > * {
@@ -48,14 +97,10 @@ exports[`Storyshots UI|Panel default 1`] = `
 }
 
 .emotion-2 {
-  white-space: nowrap;
-  height: 100%;
-  padding-bottom: 50px;
-  overflow-x: visisble;
-  overflow-y: visisble;
+  overflow: hidden;
 }
 
-.emotion-2:first-child {
+.emotion-2:first-of-type {
   margin-left: 0;
 }
 
@@ -91,7 +136,7 @@ exports[`Storyshots UI|Panel default 1`] = `
   border-bottom: 3px solid transparent;
   font-weight: bold;
   font-size: 13px;
-  opacity: 0.4;
+  color: inherit;
   border-bottom-color: transparent;
 }
 
@@ -154,6 +199,13 @@ exports[`Storyshots UI|Panel default 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  margin-left: 30px;
 }
 
 .emotion-10 > * {
@@ -195,7 +247,7 @@ exports[`Storyshots UI|Panel default 1`] = `
   fill: currentColor;
 }
 
-.emotion-12 {
+.emotion-13 {
   display: block;
   position: relative;
   font-size: 13px;
@@ -208,70 +260,78 @@ exports[`Storyshots UI|Panel default 1`] = `
 }
 
 <div
-  class="emotion-13"
+  class="emotion-14"
   id="storybook-panel-root"
+  title="wrapper"
 >
   <div
-    class="emotion-11"
+    class="emotion-12"
+    title="bar"
   >
     <div
-      class="emotion-3"
+      class="emotion-11"
     >
       <div
-        class="emotion-2"
-        role="tablist"
+        class="emotion-3"
+        title="side left"
+      >
+        <div
+          class="emotion-2"
+          role="tablist"
+        >
+          <button
+            class="emotion-0"
+            role="tab"
+            type="button"
+          >
+            Test 1
+          </button>
+          <button
+            class="emotion-1"
+            role="tab"
+            type="button"
+          >
+            Test 2
+          </button>
+        </div>
+      </div>
+      <div
+        class="emotion-10"
+        title="side right"
       >
         <button
-          class="emotion-0"
-          role="tab"
-          type="button"
+          class="emotion-6"
+          title="Change orientation"
         >
-          Test 1
+          <svg
+            class="emotion-5"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-4"
+              d="M64 167.944v688c0 22.092 17.908 40 40 40h816c22.092 0 40-17.908 40-40v-688c0-22.092-17.908-40-40-40h-816c-22.092 0-40 17.908-40 40zM880 815.944h-240v-608h240v608zM144 207.944h416v608h-416v-608zM793.296 320.118h-66.398c-17.676 0-32-14.324-32-32 0-17.674 14.328-32 32-32h66.396c17.674 0 32.002 14.326 32.002 32 0 17.672-14.324 32-32 32zM793.296 448.118h-66.398c-17.676 0-32-14.324-32-32 0-17.674 14.328-32 32-32h66.396c17.674 0 32.002 14.326 32.002 32 0 17.672-14.324 32-32 32zM793.296 576.118h-66.398c-17.676 0-32-14.324-32-32 0-17.674 14.328-32 32-32h66.396c17.674 0 32.002 14.326 32.002 32 0 17.672-14.324 32-32 32z"
+            />
+          </svg>
         </button>
         <button
-          class="emotion-1"
-          role="tab"
-          type="button"
+          class="emotion-6"
+          title="Hide addons"
         >
-          Test 2
+          <svg
+            class="emotion-5"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-4"
+              d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
+            />
+          </svg>
         </button>
       </div>
     </div>
-    <div
-      class="emotion-10"
-    >
-      <button
-        class="emotion-6"
-        title="Change orientation"
-      >
-        <svg
-          class="emotion-5"
-          viewBox="0 0 1024 1024"
-        >
-          <path
-            class="emotion-4"
-            d="M64 167.944v688c0 22.092 17.908 40 40 40h816c22.092 0 40-17.908 40-40v-688c0-22.092-17.908-40-40-40h-816c-22.092 0-40 17.908-40 40zM880 815.944h-240v-608h240v608zM144 207.944h416v608h-416v-608zM793.296 320.118h-66.398c-17.676 0-32-14.324-32-32 0-17.674 14.328-32 32-32h66.396c17.674 0 32.002 14.326 32.002 32 0 17.672-14.324 32-32 32zM793.296 448.118h-66.398c-17.676 0-32-14.324-32-32 0-17.674 14.328-32 32-32h66.396c17.674 0 32.002 14.326 32.002 32 0 17.672-14.324 32-32 32zM793.296 576.118h-66.398c-17.676 0-32-14.324-32-32 0-17.674 14.328-32 32-32h66.396c17.674 0 32.002 14.326 32.002 32 0 17.672-14.324 32-32 32z"
-          />
-        </svg>
-      </button>
-      <button
-        class="emotion-6"
-        title="Hide addons"
-      >
-        <svg
-          class="emotion-5"
-          viewBox="0 0 1024 1024"
-        >
-          <path
-            class="emotion-4"
-            d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
-          />
-        </svg>
-      </button>
-    </div>
   </div>
   <div
-    class="emotion-12"
+    class="emotion-13"
   >
     <div
       id="test2"
@@ -286,7 +346,7 @@ exports[`Storyshots UI|Panel no panels 1`] = `
 .emotion-1 {
   padding: 30px;
   text-align: center;
-  color: #666666;
+  color: #333333;
   font-size: 13px;
 }
 
diff --git a/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot b/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot
index 1a9f236b6cc..81a329b8faa 100644
--- a/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot
+++ b/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot
@@ -2,14 +2,31 @@
 
 exports[`Storyshots UI|Preview/Preview no tabs 1`] = `
 Array [
-  .emotion-13 {
+  .emotion-22 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+  position: relative;
+  white-space: nowrap;
+  height: 40px;
+}
+
+.emotion-13 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
 }
 
 .emotion-13 > * {
@@ -21,6 +38,13 @@ Array [
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  margin-left: 30px;
 }
 
 .emotion-21 > * {
@@ -62,22 +86,24 @@ Array [
   fill: currentColor;
 }
 
-.emotion-22 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-pack: justify;
-  -webkit-justify-content: space-between;
-  -ms-flex-pack: justify;
-  justify-content: space-between;
-  background: #FFFFFF;
+.emotion-23 {
   color: #999999;
   height: 40px;
-  position: relative;
   overflow: auto;
   overflow-x: auto;
   overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
   background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
   position: absolute;
   left: 0;
@@ -90,6 +116,36 @@ Array [
   tranform: translateY(0px);
 }
 
+.emotion-23::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+}
+
+.emotion-23::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-23::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-23::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
+}
+
 .emotion-9 {
   width: 1px;
   height: 24px;
@@ -101,114 +157,121 @@ Array [
   display: none;
 }
 
-.emotion-9:first-child {
+.emotion-9:first-of-type {
   display: none;
 }
 
-.emotion-9:last-child {
+.emotion-9:last-of-type {
   display: none;
 }
 
 <div
-    class="emotion-22"
+    class="emotion-23"
+    title="bar"
   >
     <div
-      class="emotion-13"
+      class="emotion-22"
     >
-      <button
-        class="emotion-2"
-        title="Zoom in"
+      <div
+        class="emotion-13"
+        title="side left"
       >
-        <svg
-          class="emotion-1"
-          viewBox="0 0 1024 1024"
+        <button
+          class="emotion-2"
+          title="Zoom in"
         >
-          <path
-            class="emotion-0"
-            d="M220 670a316 316 0 0 1 0-450 316 316 0 0 1 450 0 316 316 0 0 1 0 450 316 316 0 0 1-450 0zm749 240L757 698a402 402 0 1 0-59 59l212 212a42 42 0 0 0 59-59zM487 604a42 42 0 0 1-84 0V487H286a42 42 0 1 1 0-84h117V286a42 42 0 1 1 84 0v117h117a42 42 0 0 1 0 84H487v117z"
-          />
-        </svg>
-      </button>
-      <button
-        class="emotion-2"
-        title="Zoom out"
+          <svg
+            class="emotion-1"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-0"
+              d="M220 670a316 316 0 0 1 0-450 316 316 0 0 1 450 0 316 316 0 0 1 0 450 316 316 0 0 1-450 0zm749 240L757 698a402 402 0 1 0-59 59l212 212a42 42 0 0 0 59-59zM487 604a42 42 0 0 1-84 0V487H286a42 42 0 1 1 0-84h117V286a42 42 0 1 1 84 0v117h117a42 42 0 0 1 0 84H487v117z"
+            />
+          </svg>
+        </button>
+        <button
+          class="emotion-2"
+          title="Zoom out"
+        >
+          <svg
+            class="emotion-1"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-0"
+              d="M757 698a402 402 0 1 0-59 59l212 212a42 42 0 0 0 59-59L757 698zM126 445a316 316 0 0 1 319-319 316 316 0 0 1 318 319 316 316 0 0 1-318 318 316 316 0 0 1-319-318zm160 42a42 42 0 1 1 0-84h318a42 42 0 0 1 0 84H286z"
+            />
+          </svg>
+        </button>
+        <button
+          class="emotion-2"
+          title="Reset zoom"
+        >
+          <svg
+            class="emotion-1"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-0"
+              d="M148 560a318 318 0 0 0 522 110 316 316 0 0 0 0-450 316 316 0 0 0-450 0c-11 11-21 22-30 34v4h47c25 0 46 21 46 46s-21 45-46 45H90c-13 0-25-6-33-14-9-9-14-20-14-33V156c0-25 20-45 45-45s45 20 45 45v32l1 1a401 401 0 0 1 623 509l212 212a42 42 0 0 1-59 59L698 757A401 401 0 0 1 65 570a42 42 0 0 1 83-10z"
+            />
+          </svg>
+        </button>
+        <span
+          class="emotion-9"
+        />
+        <button
+          class="emotion-2"
+          title="Toggle background grid"
+        >
+          <svg
+            class="emotion-1"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-0"
+              d="M437.162 552.368c-1.694-0.216-3.408-0.37-5.162-0.37h-263.978c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v264.040c0 22.094 17.91 40 40 40h263.978c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-264.044c0-20.34-15.19-37.094-34.838-39.632zM208.022 816.038v-184.040h183.978v184.040h-183.978zM437.162 128.4c-1.694-0.216-3.408-0.37-5.162-0.37h-263.978c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v263.968c0 22.094 17.91 40 40 40h263.978c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-263.972c0-20.342-15.19-37.096-34.838-39.632zM208.022 392v-183.968h183.978v183.968h-183.978zM861.212 552.368c-1.694-0.216-3.408-0.37-5.162-0.37h-264.050c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v264.040c0 22.094 17.91 40 40 40h264.048c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-264.044c0.002-20.34-15.19-37.094-34.836-39.632zM632 816.038v-184.040h184.048v184.040h-184.048zM861.212 128.4c-1.694-0.216-3.408-0.37-5.162-0.37h-264.050c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v263.968c0 22.094 17.91 40 40 40h264.048c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-263.972c0.002-20.342-15.19-37.096-34.836-39.632zM632 392v-183.968h184.048v183.968h-184.048z"
+            />
+          </svg>
+        </button>
+      </div>
+      <div
+        class="emotion-21"
+        title="side right"
       >
-        <svg
-          class="emotion-1"
-          viewBox="0 0 1024 1024"
+        <button
+          class="emotion-2"
+          title="Go full screen"
         >
-          <path
-            class="emotion-0"
-            d="M757 698a402 402 0 1 0-59 59l212 212a42 42 0 0 0 59-59L757 698zM126 445a316 316 0 0 1 319-319 316 316 0 0 1 318 319 316 316 0 0 1-318 318 316 316 0 0 1-319-318zm160 42a42 42 0 1 1 0-84h318a42 42 0 0 1 0 84H286z"
-          />
-        </svg>
-      </button>
-      <button
-        class="emotion-2"
-        title="Reset zoom"
-      >
-        <svg
-          class="emotion-1"
-          viewBox="0 0 1024 1024"
+          <svg
+            class="emotion-1"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-0"
+              d="M959.688 920.068l0.31-176c0.040-22.094-17.84-40.032-39.93-40.070-22.092-0.040-40.032 17.838-40.070 39.93l-0.142 79.672-235.734-235.732c-15.622-15.622-40.948-15.622-56.57 0s-15.622 40.948 0 56.568l235.442 235.442-78.946-0.1c-22.092-0.028-40.022 17.86-40.050 39.952-0.014 11.064 4.464 21.084 11.714 28.334 7.228 7.224 17.208 11.702 28.236 11.714l175.688 0.22c22.086 0.028 40.014-17.846 40.052-39.93zM920.178 64.228l-176-0.308c-22.094-0.040-40.032 17.84-40.070 39.93-0.040 22.092 17.838 40.032 39.93 40.070l79.672 0.14-235.732 235.734c-15.622 15.622-15.622 40.948 0 56.568s40.948 15.622 56.568 0l235.442-235.442-0.1 78.946c-0.028 22.092 17.86 40.022 39.952 40.050 11.064 0.014 21.084-4.464 28.334-11.714 7.224-7.228 11.702-17.208 11.714-28.236l0.22-175.688c0.026-22.082-17.846-40.010-39.93-40.050zM64.236 103.742l-0.308 176c-0.040 22.094 17.84 40.032 39.93 40.070 22.092 0.040 40.032-17.84 40.070-39.93l0.14-79.672 235.734 235.73c15.622 15.622 40.948 15.622 56.568 0s15.622-40.946 0-56.566l-235.442-235.442 78.946 0.098c22.092 0.028 40.022-17.86 40.050-39.95 0.014-11.066-4.464-21.086-11.714-28.336-7.228-7.222-17.208-11.7-28.236-11.714l-175.688-0.218c-22.084-0.026-40.012 17.844-40.050 39.93zM103.748 959.766l176 0.308c22.094 0.040 40.032-17.84 40.070-39.93 0.040-22.092-17.84-40.032-39.93-40.070l-79.672-0.14 235.73-235.734c15.622-15.622 15.622-40.948 0-56.568s-40.946-15.622-56.566 0l-235.442 235.442 0.098-78.946c0.028-22.092-17.86-40.022-39.95-40.050-11.066-0.014-21.086 4.464-28.336 11.714-7.222 7.228-11.7 17.208-11.714 28.236l-0.218 175.688c-0.026 22.082 17.844 40.010 39.93 40.050z"
+            />
+          </svg>
+        </button>
+        <span
+          class="emotion-9"
+        />
+        <button
+          class="emotion-2"
+          title="Open component in new tab"
         >
-          <path
-            class="emotion-0"
-            d="M148 560a318 318 0 0 0 522 110 316 316 0 0 0 0-450 316 316 0 0 0-450 0c-11 11-21 22-30 34v4h47c25 0 46 21 46 46s-21 45-46 45H90c-13 0-25-6-33-14-9-9-14-20-14-33V156c0-25 20-45 45-45s45 20 45 45v32l1 1a401 401 0 0 1 623 509l212 212a42 42 0 0 1-59 59L698 757A401 401 0 0 1 65 570a42 42 0 0 1 83-10z"
-          />
-        </svg>
-      </button>
-      <span
-        class="emotion-9"
-      />
-      <button
-        class="emotion-2"
-        title="Toggle background grid"
-      >
-        <svg
-          class="emotion-1"
-          viewBox="0 0 1024 1024"
-        >
-          <path
-            class="emotion-0"
-            d="M437.162 552.368c-1.694-0.216-3.408-0.37-5.162-0.37h-263.978c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v264.040c0 22.094 17.91 40 40 40h263.978c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-264.044c0-20.34-15.19-37.094-34.838-39.632zM208.022 816.038v-184.040h183.978v184.040h-183.978zM437.162 128.4c-1.694-0.216-3.408-0.37-5.162-0.37h-263.978c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v263.968c0 22.094 17.91 40 40 40h263.978c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-263.972c0-20.342-15.19-37.096-34.838-39.632zM208.022 392v-183.968h183.978v183.968h-183.978zM861.212 552.368c-1.694-0.216-3.408-0.37-5.162-0.37h-264.050c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v264.040c0 22.094 17.91 40 40 40h264.048c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-264.044c0.002-20.34-15.19-37.094-34.836-39.632zM632 816.038v-184.040h184.048v184.040h-184.048zM861.212 128.4c-1.694-0.216-3.408-0.37-5.162-0.37h-264.050c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v263.968c0 22.094 17.91 40 40 40h264.048c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-263.972c0.002-20.342-15.19-37.096-34.836-39.632zM632 392v-183.968h184.048v183.968h-184.048z"
-          />
-        </svg>
-      </button>
-    </div>
-    <div
-      class="emotion-21"
-    >
-      <button
-        class="emotion-2"
-        title="Go full screen"
-      >
-        <svg
-          class="emotion-1"
-          viewBox="0 0 1024 1024"
-        >
-          <path
-            class="emotion-0"
-            d="M959.688 920.068l0.31-176c0.040-22.094-17.84-40.032-39.93-40.070-22.092-0.040-40.032 17.838-40.070 39.93l-0.142 79.672-235.734-235.732c-15.622-15.622-40.948-15.622-56.57 0s-15.622 40.948 0 56.568l235.442 235.442-78.946-0.1c-22.092-0.028-40.022 17.86-40.050 39.952-0.014 11.064 4.464 21.084 11.714 28.334 7.228 7.224 17.208 11.702 28.236 11.714l175.688 0.22c22.086 0.028 40.014-17.846 40.052-39.93zM920.178 64.228l-176-0.308c-22.094-0.040-40.032 17.84-40.070 39.93-0.040 22.092 17.838 40.032 39.93 40.070l79.672 0.14-235.732 235.734c-15.622 15.622-15.622 40.948 0 56.568s40.948 15.622 56.568 0l235.442-235.442-0.1 78.946c-0.028 22.092 17.86 40.022 39.952 40.050 11.064 0.014 21.084-4.464 28.334-11.714 7.224-7.228 11.702-17.208 11.714-28.236l0.22-175.688c0.026-22.082-17.846-40.010-39.93-40.050zM64.236 103.742l-0.308 176c-0.040 22.094 17.84 40.032 39.93 40.070 22.092 0.040 40.032-17.84 40.070-39.93l0.14-79.672 235.734 235.73c15.622 15.622 40.948 15.622 56.568 0s15.622-40.946 0-56.566l-235.442-235.442 78.946 0.098c22.092 0.028 40.022-17.86 40.050-39.95 0.014-11.066-4.464-21.086-11.714-28.336-7.228-7.222-17.208-11.7-28.236-11.714l-175.688-0.218c-22.084-0.026-40.012 17.844-40.050 39.93zM103.748 959.766l176 0.308c22.094 0.040 40.032-17.84 40.070-39.93 0.040-22.092-17.84-40.032-39.93-40.070l-79.672-0.14 235.73-235.734c15.622-15.622 15.622-40.948 0-56.568s-40.946-15.622-56.566 0l-235.442 235.442 0.098-78.946c0.028-22.092-17.86-40.022-39.95-40.050-11.066-0.014-21.086 4.464-28.336 11.714-7.222 7.228-11.7 17.208-11.714 28.236l-0.218 175.688c-0.026 22.082 17.844 40.010 39.93 40.050z"
-          />
-        </svg>
-      </button>
-      <span
-        class="emotion-9"
-      />
-      <button
-        class="emotion-2"
-        title="Open component in new tab"
-      >
-        <svg
-          class="emotion-1"
-          viewBox="0 0 1024 1024"
-        >
-          <path
-            class="emotion-0"
-            d="M896.006 920c0 22.090-17.91 40-40 40h-688.006c-22.090 0-40-17.906-40-40v-549.922c-0.838-3.224-1.33-6.588-1.33-10.072 0-22.090 17.908-40.004 40-40.004h178.66c22.092 0.004 40 17.914 40 40.004 0 22.088-17.908 40-40 40h-137.33v479.996h607.998v-479.996h-138.658c-22.090 0-40-17.912-40-40 0-22.090 17.906-40.004 40-40.004h178.658c22.090 0 40 17.91 40 40v559.844c0 0.050 0.008 0.102 0.008 0.154zM665.622 200.168l-124.452-124.45c-8.042-8.042-18.65-11.912-29.186-11.674-1.612-0.034-3.222 0-4.828 0.16-0.558 0.054-1.098 0.16-1.648 0.238-0.742 0.104-1.484 0.192-2.218 0.338-0.656 0.13-1.29 0.31-1.934 0.472-0.622 0.154-1.244 0.292-1.86 0.476-0.64 0.196-1.258 0.436-1.886 0.66-0.602 0.216-1.208 0.414-1.802 0.66-0.598 0.248-1.17 0.54-1.754 0.814-0.598 0.282-1.202 0.546-1.788 0.86-0.578 0.312-1.13 0.664-1.694 1-0.552 0.332-1.116 0.644-1.654 1.006-0.67 0.448-1.3 0.942-1.942 1.426-0.394 0.302-0.806 0.576-1.196 0.894-1.046 0.858-2.052 1.768-3.008 2.726l-124.398 124.39c-15.622 15.62-15.618 40.948 0.002 56.57 15.622 15.62 40.95 15.62 56.568 0l56.164-56.166v439.426c0 22.094 17.912 40 40.002 40 22.092 0 40-17.91 40-40v-441.202l57.942 57.942c15.622 15.624 40.948 15.62 56.568 0 15.626-15.618 15.626-40.946 0.002-56.566z"
-          />
-        </svg>
-      </button>
+          <svg
+            class="emotion-1"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-0"
+              d="M896.006 920c0 22.090-17.91 40-40 40h-688.006c-22.090 0-40-17.906-40-40v-549.922c-0.838-3.224-1.33-6.588-1.33-10.072 0-22.090 17.908-40.004 40-40.004h178.66c22.092 0.004 40 17.914 40 40.004 0 22.088-17.908 40-40 40h-137.33v479.996h607.998v-479.996h-138.658c-22.090 0-40-17.912-40-40 0-22.090 17.906-40.004 40-40.004h178.658c22.090 0 40 17.91 40 40v559.844c0 0.050 0.008 0.102 0.008 0.154zM665.622 200.168l-124.452-124.45c-8.042-8.042-18.65-11.912-29.186-11.674-1.612-0.034-3.222 0-4.828 0.16-0.558 0.054-1.098 0.16-1.648 0.238-0.742 0.104-1.484 0.192-2.218 0.338-0.656 0.13-1.29 0.31-1.934 0.472-0.622 0.154-1.244 0.292-1.86 0.476-0.64 0.196-1.258 0.436-1.886 0.66-0.602 0.216-1.208 0.414-1.802 0.66-0.598 0.248-1.17 0.54-1.754 0.814-0.598 0.282-1.202 0.546-1.788 0.86-0.578 0.312-1.13 0.664-1.694 1-0.552 0.332-1.116 0.644-1.654 1.006-0.67 0.448-1.3 0.942-1.942 1.426-0.394 0.302-0.806 0.576-1.196 0.894-1.046 0.858-2.052 1.768-3.008 2.726l-124.398 124.39c-15.622 15.62-15.618 40.948 0.002 56.57 15.622 15.62 40.95 15.62 56.568 0l56.164-56.166v439.426c0 22.094 17.912 40 40.002 40 22.092 0 40-17.91 40-40v-441.202l57.942 57.942c15.622 15.624 40.948 15.62 56.568 0 15.626-15.618 15.626-40.946 0.002-56.566z"
+            />
+          </svg>
+        </button>
+      </div>
     </div>
   </div>,
   .emotion-2 {
@@ -231,6 +294,7 @@ Array [
   height: 100%;
   -webkit-transition: background .1s linear;
   transition: background .1s linear;
+  background: #FFFFFF;
 }
 
 .emotion-0 {
@@ -284,14 +348,31 @@ Array [
 
 exports[`Storyshots UI|Preview/Preview with tabs 1`] = `
 Array [
-  .emotion-19 {
+  .emotion-28 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+  position: relative;
+  white-space: nowrap;
+  height: 40px;
+}
+
+.emotion-19 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
 }
 
 .emotion-19 > * {
@@ -299,14 +380,10 @@ Array [
 }
 
 .emotion-4 {
-  white-space: nowrap;
-  height: 100%;
-  padding-bottom: 50px;
-  overflow-x: visisble;
-  overflow-y: visisble;
+  overflow: hidden;
 }
 
-.emotion-4:first-child {
+.emotion-4:first-of-type {
   margin-left: 0;
 }
 
@@ -342,7 +419,7 @@ Array [
   border-bottom: 3px solid transparent;
   font-weight: bold;
   font-size: 13px;
-  opacity: 0.4;
+  color: inherit;
   border-bottom-color: transparent;
 }
 
@@ -405,6 +482,13 @@ Array [
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  margin-left: 30px;
 }
 
 .emotion-27 > * {
@@ -446,22 +530,24 @@ Array [
   fill: currentColor;
 }
 
-.emotion-28 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-pack: justify;
-  -webkit-justify-content: space-between;
-  -ms-flex-pack: justify;
-  justify-content: space-between;
-  background: #FFFFFF;
+.emotion-29 {
   color: #999999;
   height: 40px;
-  position: relative;
   overflow: auto;
   overflow-x: auto;
   overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
   background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
   position: absolute;
   left: 0;
@@ -474,6 +560,36 @@ Array [
   tranform: translateY(0px);
 }
 
+.emotion-29::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+}
+
+.emotion-29::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-29::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-29::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
+}
+
 .emotion-5 {
   width: 1px;
   height: 24px;
@@ -485,11 +601,11 @@ Array [
   display: none;
 }
 
-.emotion-5:first-child {
+.emotion-5:first-of-type {
   display: none;
 }
 
-.emotion-5:last-child {
+.emotion-5:last-of-type {
   display: none;
 }
 
@@ -501,132 +617,139 @@ Array [
 }
 
 <div
-    class="emotion-28"
+    class="emotion-29"
+    title="bar"
   >
     <div
-      class="emotion-19"
+      class="emotion-28"
     >
       <div
-        class="emotion-4"
+        class="emotion-19"
+        title="side left"
       >
-        <a
-          class="emotion-1"
-          href="/?path=/story/string"
+        <div
+          class="emotion-4"
         >
-          <button
-            class="emotion-0"
+          <a
+            class="emotion-1"
+            href="/?path=/story/string"
           >
-            Canvas
-          </button>
-        </a>
-        <a
-          class="emotion-1"
-          href="/?path=/info/string"
+            <button
+              class="emotion-0"
+            >
+              Canvas
+            </button>
+          </a>
+          <a
+            class="emotion-1"
+            href="/?path=/info/string"
+          >
+            <button
+              class="emotion-2"
+            >
+              Notes
+            </button>
+          </a>
+        </div>
+        <span
+          class="emotion-5"
+        />
+        <button
+          class="emotion-8"
+          title="Zoom in"
         >
-          <button
-            class="emotion-2"
+          <svg
+            class="emotion-7"
+            viewBox="0 0 1024 1024"
           >
-            Notes
-          </button>
-        </a>
+            <path
+              class="emotion-6"
+              d="M220 670a316 316 0 0 1 0-450 316 316 0 0 1 450 0 316 316 0 0 1 0 450 316 316 0 0 1-450 0zm749 240L757 698a402 402 0 1 0-59 59l212 212a42 42 0 0 0 59-59zM487 604a42 42 0 0 1-84 0V487H286a42 42 0 1 1 0-84h117V286a42 42 0 1 1 84 0v117h117a42 42 0 0 1 0 84H487v117z"
+            />
+          </svg>
+        </button>
+        <button
+          class="emotion-8"
+          title="Zoom out"
+        >
+          <svg
+            class="emotion-7"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-6"
+              d="M757 698a402 402 0 1 0-59 59l212 212a42 42 0 0 0 59-59L757 698zM126 445a316 316 0 0 1 319-319 316 316 0 0 1 318 319 316 316 0 0 1-318 318 316 316 0 0 1-319-318zm160 42a42 42 0 1 1 0-84h318a42 42 0 0 1 0 84H286z"
+            />
+          </svg>
+        </button>
+        <button
+          class="emotion-8"
+          title="Reset zoom"
+        >
+          <svg
+            class="emotion-7"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-6"
+              d="M148 560a318 318 0 0 0 522 110 316 316 0 0 0 0-450 316 316 0 0 0-450 0c-11 11-21 22-30 34v4h47c25 0 46 21 46 46s-21 45-46 45H90c-13 0-25-6-33-14-9-9-14-20-14-33V156c0-25 20-45 45-45s45 20 45 45v32l1 1a401 401 0 0 1 623 509l212 212a42 42 0 0 1-59 59L698 757A401 401 0 0 1 65 570a42 42 0 0 1 83-10z"
+            />
+          </svg>
+        </button>
+        <span
+          class="emotion-5"
+        />
+        <button
+          class="emotion-8"
+          title="Toggle background grid"
+        >
+          <svg
+            class="emotion-7"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-6"
+              d="M437.162 552.368c-1.694-0.216-3.408-0.37-5.162-0.37h-263.978c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v264.040c0 22.094 17.91 40 40 40h263.978c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-264.044c0-20.34-15.19-37.094-34.838-39.632zM208.022 816.038v-184.040h183.978v184.040h-183.978zM437.162 128.4c-1.694-0.216-3.408-0.37-5.162-0.37h-263.978c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v263.968c0 22.094 17.91 40 40 40h263.978c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-263.972c0-20.342-15.19-37.096-34.838-39.632zM208.022 392v-183.968h183.978v183.968h-183.978zM861.212 552.368c-1.694-0.216-3.408-0.37-5.162-0.37h-264.050c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v264.040c0 22.094 17.91 40 40 40h264.048c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-264.044c0.002-20.34-15.19-37.094-34.836-39.632zM632 816.038v-184.040h184.048v184.040h-184.048zM861.212 128.4c-1.694-0.216-3.408-0.37-5.162-0.37h-264.050c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v263.968c0 22.094 17.91 40 40 40h264.048c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-263.972c0.002-20.342-15.19-37.096-34.836-39.632zM632 392v-183.968h184.048v183.968h-184.048z"
+            />
+          </svg>
+        </button>
       </div>
-      <span
-        class="emotion-5"
-      />
-      <button
-        class="emotion-8"
-        title="Zoom in"
+      <div
+        class="emotion-27"
+        title="side right"
       >
-        <svg
-          class="emotion-7"
-          viewBox="0 0 1024 1024"
+        <button
+          class="emotion-8"
+          title="Go full screen"
         >
-          <path
-            class="emotion-6"
-            d="M220 670a316 316 0 0 1 0-450 316 316 0 0 1 450 0 316 316 0 0 1 0 450 316 316 0 0 1-450 0zm749 240L757 698a402 402 0 1 0-59 59l212 212a42 42 0 0 0 59-59zM487 604a42 42 0 0 1-84 0V487H286a42 42 0 1 1 0-84h117V286a42 42 0 1 1 84 0v117h117a42 42 0 0 1 0 84H487v117z"
-          />
-        </svg>
-      </button>
-      <button
-        class="emotion-8"
-        title="Zoom out"
-      >
-        <svg
-          class="emotion-7"
-          viewBox="0 0 1024 1024"
+          <svg
+            class="emotion-7"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-6"
+              d="M959.688 920.068l0.31-176c0.040-22.094-17.84-40.032-39.93-40.070-22.092-0.040-40.032 17.838-40.070 39.93l-0.142 79.672-235.734-235.732c-15.622-15.622-40.948-15.622-56.57 0s-15.622 40.948 0 56.568l235.442 235.442-78.946-0.1c-22.092-0.028-40.022 17.86-40.050 39.952-0.014 11.064 4.464 21.084 11.714 28.334 7.228 7.224 17.208 11.702 28.236 11.714l175.688 0.22c22.086 0.028 40.014-17.846 40.052-39.93zM920.178 64.228l-176-0.308c-22.094-0.040-40.032 17.84-40.070 39.93-0.040 22.092 17.838 40.032 39.93 40.070l79.672 0.14-235.732 235.734c-15.622 15.622-15.622 40.948 0 56.568s40.948 15.622 56.568 0l235.442-235.442-0.1 78.946c-0.028 22.092 17.86 40.022 39.952 40.050 11.064 0.014 21.084-4.464 28.334-11.714 7.224-7.228 11.702-17.208 11.714-28.236l0.22-175.688c0.026-22.082-17.846-40.010-39.93-40.050zM64.236 103.742l-0.308 176c-0.040 22.094 17.84 40.032 39.93 40.070 22.092 0.040 40.032-17.84 40.070-39.93l0.14-79.672 235.734 235.73c15.622 15.622 40.948 15.622 56.568 0s15.622-40.946 0-56.566l-235.442-235.442 78.946 0.098c22.092 0.028 40.022-17.86 40.050-39.95 0.014-11.066-4.464-21.086-11.714-28.336-7.228-7.222-17.208-11.7-28.236-11.714l-175.688-0.218c-22.084-0.026-40.012 17.844-40.050 39.93zM103.748 959.766l176 0.308c22.094 0.040 40.032-17.84 40.070-39.93 0.040-22.092-17.84-40.032-39.93-40.070l-79.672-0.14 235.73-235.734c15.622-15.622 15.622-40.948 0-56.568s-40.946-15.622-56.566 0l-235.442 235.442 0.098-78.946c0.028-22.092-17.86-40.022-39.95-40.050-11.066-0.014-21.086 4.464-28.336 11.714-7.222 7.228-11.7 17.208-11.714 28.236l-0.218 175.688c-0.026 22.082 17.844 40.010 39.93 40.050z"
+            />
+          </svg>
+        </button>
+        <span
+          class="emotion-5"
+        />
+        <button
+          class="emotion-8"
+          title="Open component in new tab"
         >
-          <path
-            class="emotion-6"
-            d="M757 698a402 402 0 1 0-59 59l212 212a42 42 0 0 0 59-59L757 698zM126 445a316 316 0 0 1 319-319 316 316 0 0 1 318 319 316 316 0 0 1-318 318 316 316 0 0 1-319-318zm160 42a42 42 0 1 1 0-84h318a42 42 0 0 1 0 84H286z"
-          />
-        </svg>
-      </button>
-      <button
-        class="emotion-8"
-        title="Reset zoom"
-      >
-        <svg
-          class="emotion-7"
-          viewBox="0 0 1024 1024"
-        >
-          <path
-            class="emotion-6"
-            d="M148 560a318 318 0 0 0 522 110 316 316 0 0 0 0-450 316 316 0 0 0-450 0c-11 11-21 22-30 34v4h47c25 0 46 21 46 46s-21 45-46 45H90c-13 0-25-6-33-14-9-9-14-20-14-33V156c0-25 20-45 45-45s45 20 45 45v32l1 1a401 401 0 0 1 623 509l212 212a42 42 0 0 1-59 59L698 757A401 401 0 0 1 65 570a42 42 0 0 1 83-10z"
-          />
-        </svg>
-      </button>
-      <span
-        class="emotion-5"
-      />
-      <button
-        class="emotion-8"
-        title="Toggle background grid"
-      >
-        <svg
-          class="emotion-7"
-          viewBox="0 0 1024 1024"
-        >
-          <path
-            class="emotion-6"
-            d="M437.162 552.368c-1.694-0.216-3.408-0.37-5.162-0.37h-263.978c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v264.040c0 22.094 17.91 40 40 40h263.978c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-264.044c0-20.34-15.19-37.094-34.838-39.632zM208.022 816.038v-184.040h183.978v184.040h-183.978zM437.162 128.4c-1.694-0.216-3.408-0.37-5.162-0.37h-263.978c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v263.968c0 22.094 17.91 40 40 40h263.978c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-263.972c0-20.342-15.19-37.096-34.838-39.632zM208.022 392v-183.968h183.978v183.968h-183.978zM861.212 552.368c-1.694-0.216-3.408-0.37-5.162-0.37h-264.050c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v264.040c0 22.094 17.91 40 40 40h264.048c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-264.044c0.002-20.34-15.19-37.094-34.836-39.632zM632 816.038v-184.040h184.048v184.040h-184.048zM861.212 128.4c-1.694-0.216-3.408-0.37-5.162-0.37h-264.050c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v263.968c0 22.094 17.91 40 40 40h264.048c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-263.972c0.002-20.342-15.19-37.096-34.836-39.632zM632 392v-183.968h184.048v183.968h-184.048z"
-          />
-        </svg>
-      </button>
-    </div>
-    <div
-      class="emotion-27"
-    >
-      <button
-        class="emotion-8"
-        title="Go full screen"
-      >
-        <svg
-          class="emotion-7"
-          viewBox="0 0 1024 1024"
-        >
-          <path
-            class="emotion-6"
-            d="M959.688 920.068l0.31-176c0.040-22.094-17.84-40.032-39.93-40.070-22.092-0.040-40.032 17.838-40.070 39.93l-0.142 79.672-235.734-235.732c-15.622-15.622-40.948-15.622-56.57 0s-15.622 40.948 0 56.568l235.442 235.442-78.946-0.1c-22.092-0.028-40.022 17.86-40.050 39.952-0.014 11.064 4.464 21.084 11.714 28.334 7.228 7.224 17.208 11.702 28.236 11.714l175.688 0.22c22.086 0.028 40.014-17.846 40.052-39.93zM920.178 64.228l-176-0.308c-22.094-0.040-40.032 17.84-40.070 39.93-0.040 22.092 17.838 40.032 39.93 40.070l79.672 0.14-235.732 235.734c-15.622 15.622-15.622 40.948 0 56.568s40.948 15.622 56.568 0l235.442-235.442-0.1 78.946c-0.028 22.092 17.86 40.022 39.952 40.050 11.064 0.014 21.084-4.464 28.334-11.714 7.224-7.228 11.702-17.208 11.714-28.236l0.22-175.688c0.026-22.082-17.846-40.010-39.93-40.050zM64.236 103.742l-0.308 176c-0.040 22.094 17.84 40.032 39.93 40.070 22.092 0.040 40.032-17.84 40.070-39.93l0.14-79.672 235.734 235.73c15.622 15.622 40.948 15.622 56.568 0s15.622-40.946 0-56.566l-235.442-235.442 78.946 0.098c22.092 0.028 40.022-17.86 40.050-39.95 0.014-11.066-4.464-21.086-11.714-28.336-7.228-7.222-17.208-11.7-28.236-11.714l-175.688-0.218c-22.084-0.026-40.012 17.844-40.050 39.93zM103.748 959.766l176 0.308c22.094 0.040 40.032-17.84 40.070-39.93 0.040-22.092-17.84-40.032-39.93-40.070l-79.672-0.14 235.73-235.734c15.622-15.622 15.622-40.948 0-56.568s-40.946-15.622-56.566 0l-235.442 235.442 0.098-78.946c0.028-22.092-17.86-40.022-39.95-40.050-11.066-0.014-21.086 4.464-28.336 11.714-7.222 7.228-11.7 17.208-11.714 28.236l-0.218 175.688c-0.026 22.082 17.844 40.010 39.93 40.050z"
-          />
-        </svg>
-      </button>
-      <span
-        class="emotion-5"
-      />
-      <button
-        class="emotion-8"
-        title="Open component in new tab"
-      >
-        <svg
-          class="emotion-7"
-          viewBox="0 0 1024 1024"
-        >
-          <path
-            class="emotion-6"
-            d="M896.006 920c0 22.090-17.91 40-40 40h-688.006c-22.090 0-40-17.906-40-40v-549.922c-0.838-3.224-1.33-6.588-1.33-10.072 0-22.090 17.908-40.004 40-40.004h178.66c22.092 0.004 40 17.914 40 40.004 0 22.088-17.908 40-40 40h-137.33v479.996h607.998v-479.996h-138.658c-22.090 0-40-17.912-40-40 0-22.090 17.906-40.004 40-40.004h178.658c22.090 0 40 17.91 40 40v559.844c0 0.050 0.008 0.102 0.008 0.154zM665.622 200.168l-124.452-124.45c-8.042-8.042-18.65-11.912-29.186-11.674-1.612-0.034-3.222 0-4.828 0.16-0.558 0.054-1.098 0.16-1.648 0.238-0.742 0.104-1.484 0.192-2.218 0.338-0.656 0.13-1.29 0.31-1.934 0.472-0.622 0.154-1.244 0.292-1.86 0.476-0.64 0.196-1.258 0.436-1.886 0.66-0.602 0.216-1.208 0.414-1.802 0.66-0.598 0.248-1.17 0.54-1.754 0.814-0.598 0.282-1.202 0.546-1.788 0.86-0.578 0.312-1.13 0.664-1.694 1-0.552 0.332-1.116 0.644-1.654 1.006-0.67 0.448-1.3 0.942-1.942 1.426-0.394 0.302-0.806 0.576-1.196 0.894-1.046 0.858-2.052 1.768-3.008 2.726l-124.398 124.39c-15.622 15.62-15.618 40.948 0.002 56.57 15.622 15.62 40.95 15.62 56.568 0l56.164-56.166v439.426c0 22.094 17.912 40 40.002 40 22.092 0 40-17.91 40-40v-441.202l57.942 57.942c15.622 15.624 40.948 15.62 56.568 0 15.626-15.618 15.626-40.946 0.002-56.566z"
-          />
-        </svg>
-      </button>
+          <svg
+            class="emotion-7"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-6"
+              d="M896.006 920c0 22.090-17.91 40-40 40h-688.006c-22.090 0-40-17.906-40-40v-549.922c-0.838-3.224-1.33-6.588-1.33-10.072 0-22.090 17.908-40.004 40-40.004h178.66c22.092 0.004 40 17.914 40 40.004 0 22.088-17.908 40-40 40h-137.33v479.996h607.998v-479.996h-138.658c-22.090 0-40-17.912-40-40 0-22.090 17.906-40.004 40-40.004h178.658c22.090 0 40 17.91 40 40v559.844c0 0.050 0.008 0.102 0.008 0.154zM665.622 200.168l-124.452-124.45c-8.042-8.042-18.65-11.912-29.186-11.674-1.612-0.034-3.222 0-4.828 0.16-0.558 0.054-1.098 0.16-1.648 0.238-0.742 0.104-1.484 0.192-2.218 0.338-0.656 0.13-1.29 0.31-1.934 0.472-0.622 0.154-1.244 0.292-1.86 0.476-0.64 0.196-1.258 0.436-1.886 0.66-0.602 0.216-1.208 0.414-1.802 0.66-0.598 0.248-1.17 0.54-1.754 0.814-0.598 0.282-1.202 0.546-1.788 0.86-0.578 0.312-1.13 0.664-1.694 1-0.552 0.332-1.116 0.644-1.654 1.006-0.67 0.448-1.3 0.942-1.942 1.426-0.394 0.302-0.806 0.576-1.196 0.894-1.046 0.858-2.052 1.768-3.008 2.726l-124.398 124.39c-15.622 15.62-15.618 40.948 0.002 56.57 15.622 15.62 40.95 15.62 56.568 0l56.164-56.166v439.426c0 22.094 17.912 40 40.002 40 22.092 0 40-17.91 40-40v-441.202l57.942 57.942c15.622 15.624 40.948 15.62 56.568 0 15.626-15.618 15.626-40.946 0.002-56.566z"
+            />
+          </svg>
+        </button>
+      </div>
     </div>
   </div>,
   .emotion-2 {
@@ -649,6 +772,7 @@ Array [
   height: 100%;
   -webkit-transition: background .1s linear;
   transition: background .1s linear;
+  background: #FFFFFF;
 }
 
 .emotion-0 {

From 4a442cb5e0352052256cc0021084a6b538fada87 Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Thu, 21 Feb 2019 14:02:16 +0800
Subject: [PATCH 049/249] Merge pull request #5679 from storybooks/fix/5651

FIX singleton module issue for manager & theme not being set correctly
---
 lib/client-logger/src/index.ts                |  6 +--
 .../server/manager/manager-webpack.config.js  | 16 ++++++
 lib/node-logger/src/index.test.ts             |  8 ---
 lib/theming/package.json                      |  7 ++-
 lib/theming/src/ensure.ts                     | 49 +++++++++++++++++++
 lib/theming/src/index.ts                      |  3 +-
 lib/theming/src/typings.d.ts                  |  2 +
 lib/ui/src/core/context.js                    |  4 ++
 lib/ui/src/index.js                           |  4 +-
 package.json                                  |  3 +-
 yarn.lock                                     | 10 ++++
 11 files changed, 96 insertions(+), 16 deletions(-)
 create mode 100644 lib/theming/src/ensure.ts

diff --git a/lib/client-logger/src/index.ts b/lib/client-logger/src/index.ts
index 7397db89f4a..77a01d8b4d4 100644
--- a/lib/client-logger/src/index.ts
+++ b/lib/client-logger/src/index.ts
@@ -1,7 +1,7 @@
 const { console } = global;
 
 export const logger = {
-  info: (message: any): void => console.log(message),
-  warn: (message: any): void => console.warn(message),
-  error: (message: any): void => console.error(message),
+  info: (message: any, ...rest: any[]): void => console.log(message, ...rest),
+  warn: (message: any, ...rest: any[]): void => console.warn(message, ...rest),
+  error: (message: any, ...rest: any[]): void => console.error(message, ...rest),
 };
diff --git a/lib/core/src/server/manager/manager-webpack.config.js b/lib/core/src/server/manager/manager-webpack.config.js
index 6e8a04e992a..b78077a2ed8 100644
--- a/lib/core/src/server/manager/manager-webpack.config.js
+++ b/lib/core/src/server/manager/manager-webpack.config.js
@@ -16,6 +16,15 @@ const coreDirName = path.dirname(require.resolve('@storybook/core/package.json')
 const context = path.join(coreDirName, '../../node_modules');
 const cacheDir = findCacheDir({ name: 'storybook' });
 
+const storybookPackages = [
+  '@storybook/router',
+  '@storybook/theming',
+  '@storybook/channels',
+  '@storybook/client-api',
+  '@storybook/core',
+  '@storybook/ui',
+];
+
 export default ({ configDir, configType, entries, dll, outputDir, cache, babelOptions }) => {
   const { raw, stringified } = loadEnv();
   const isProd = configType === 'PRODUCTION';
@@ -66,6 +75,13 @@ export default ({ configDir, configType, entries, dll, outputDir, cache, babelOp
       modules: ['node_modules'].concat(raw.NODE_PATH || []),
       alias: {
         'core-js': path.dirname(require.resolve('core-js/package.json')),
+        ...storybookPackages.reduce(
+          (acc, i) =>
+            Object.assign(acc, {
+              [i]: path.dirname(require.resolve(`${i}/package.json`)),
+            }),
+          {}
+        ),
         ...uiPaths,
       },
     },
diff --git a/lib/node-logger/src/index.test.ts b/lib/node-logger/src/index.test.ts
index 59cd0cfe86e..40188dbc8ce 100644
--- a/lib/node-logger/src/index.test.ts
+++ b/lib/node-logger/src/index.test.ts
@@ -8,14 +8,6 @@ jest.mock('npmlog', () => ({
 }));
 
 describe('node-logger', () => {
-  beforeEach(() => {
-    // This feels odd but TypeScript doesn't understand that the imported
-    // npmlog module is being wrapped by Jest so we are type casting here
-    // in order to be allowed to call Jest's mockReset() method.
-    ((info as any) as jest.MockInstance<any>).mockReset();
-    ((warn as any) as jest.MockInstance<any>).mockReset();
-    ((error as any) as jest.MockInstance<any>).mockReset();
-  });
   it('should have an info method', () => {
     const message = 'information';
     logger.info(message);
diff --git a/lib/theming/package.json b/lib/theming/package.json
index b026e0b8767..30a954bd74d 100644
--- a/lib/theming/package.json
+++ b/lib/theming/package.json
@@ -21,8 +21,13 @@
   "dependencies": {
     "@emotion/core": "^10.0.5",
     "@emotion/styled": "^10.0.5",
-    "emotion-theming": "^10.0.5",
+    "@storybook/client-logger": "5.0.0-rc.3",
+    "common-tags": "^1.8.0",
+    "deep-object-diff": "^1.1.0",
+    "emotion-theming": "^10.0.7",
     "global": "^4.3.2",
+    "lodash.isequal": "^4.5.0",
+    "lodash.mergewith": "^4.6.1",
     "memoizerific": "^1.11.3",
     "polished": "^2.3.3",
     "prop-types": "^15.6.2",
diff --git a/lib/theming/src/ensure.ts b/lib/theming/src/ensure.ts
new file mode 100644
index 00000000000..c206a73b0c9
--- /dev/null
+++ b/lib/theming/src/ensure.ts
@@ -0,0 +1,49 @@
+import { logger } from '@storybook/client-logger';
+
+import { deletedDiff } from 'deep-object-diff';
+import { stripIndent } from 'common-tags';
+
+import mergeWith from 'lodash.mergewith';
+import isEqual from 'lodash.isequal';
+
+import light from './themes/light';
+import { Theme } from './base';
+
+// merge with concatenating arrays, but no duplicates
+const merge = (a: any, b: any) =>
+  mergeWith({}, a, b, (objValue: any, srcValue: any) => {
+    if (Array.isArray(srcValue) && Array.isArray(objValue)) {
+      srcValue.forEach(s => {
+        const existing = objValue.find(o => o === s || isEqual(o, s));
+        if (!existing) {
+          objValue.push(s);
+        }
+      });
+
+      return objValue;
+    }
+    if (Array.isArray(objValue)) {
+      return objValue;
+    }
+    return undefined;
+  });
+
+export const ensure = (input: any): Theme => {
+  if (!input) {
+    return light;
+  } else {
+    const missing = deletedDiff(light, input);
+    if (Object.keys(missing).length) {
+      logger.warn(
+        stripIndent`
+          Your theme is missing properties, you should update your theme!
+
+          theme-data missing:
+        `,
+        missing
+      );
+    }
+
+    return merge(light, input);
+  }
+};
diff --git a/lib/theming/src/index.ts b/lib/theming/src/index.ts
index ad6980b7149..72b06808d4a 100644
--- a/lib/theming/src/index.ts
+++ b/lib/theming/src/index.ts
@@ -1,5 +1,4 @@
 import styled from '@emotion/styled';
-import { css } from '@emotion/core';
 import dark from './themes/dark';
 import light from './themes/light';
 
@@ -19,3 +18,5 @@ export * from '@emotion/core';
 export * from 'emotion-theming';
 
 export { createGlobal, createReset } from './global';
+export * from './create';
+export * from './ensure';
diff --git a/lib/theming/src/typings.d.ts b/lib/theming/src/typings.d.ts
index 151bb56deda..736edc60c4b 100644
--- a/lib/theming/src/typings.d.ts
+++ b/lib/theming/src/typings.d.ts
@@ -1,2 +1,4 @@
 // todo the following packages need definition files or a TS migration
 declare module 'react-inspector';
+declare module 'lodash.mergewith';
+declare module 'lodash.isequal';
diff --git a/lib/ui/src/core/context.js b/lib/ui/src/core/context.js
index 3342750df27..105e4ac181f 100644
--- a/lib/ui/src/core/context.js
+++ b/lib/ui/src/core/context.js
@@ -89,6 +89,10 @@ export class Provider extends Component {
 
     api.on(SET_STORIES, data => {
       api.setStories(data.stories);
+
+      const options = api.getParameters(storyId, 'options');
+
+      api.setOptions(options);
     });
     api.on(SELECT_STORY, ({ kind, story, ...rest }) => {
       api.selectStory(kind, story, rest);
diff --git a/lib/ui/src/index.js b/lib/ui/src/index.js
index a8fd14ffe63..990a8cd1312 100644
--- a/lib/ui/src/index.js
+++ b/lib/ui/src/index.js
@@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
 import ReactDOM from 'react-dom';
 
 import { Location, LocationProvider } from '@storybook/router';
-import { ThemeProvider } from '@storybook/theming';
+import { ThemeProvider, ensure as ensureTheme } from '@storybook/theming';
 import { HelmetProvider } from 'react-helmet-async';
 import { Provider as ManagerProvider } from './core/context';
 
@@ -24,7 +24,7 @@ const Root = ({ provider }) => (
           {locationData => (
             <ManagerProvider key="manager" provider={provider} {...locationData}>
               {({ state }) => (
-                <ThemeProvider key="theme.provider" theme={state.ui.theme}>
+                <ThemeProvider key="theme.provider" theme={ensureTheme(state.ui.theme)}>
                   <App key="app" viewMode={state.viewMode} layout={state.layout} />
                 </ThemeProvider>
               )}
diff --git a/package.json b/package.json
index 03c022ef49c..74931a45d07 100644
--- a/package.json
+++ b/package.json
@@ -66,7 +66,8 @@
     "@babel/preset-env": "^7.3.1",
     "@babel/preset-flow": "^7.0.0",
     "@babel/preset-react": "^7.0.0",
-    "@types/jest": "^23.3.13",
+    "@types/common-tags": "^1.8.0",
+    "@types/jest": "^24.0.6",
     "@types/node": "^10.12.19",
     "@types/react": "^16.7.22",
     "@types/webpack-env": "^1.13.7",
diff --git a/yarn.lock b/yarn.lock
index ad98b5c9cd5..c8cfb8c3c18 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2350,6 +2350,11 @@
   version "0.1.30"
   resolved "https://registry.yarnpkg.com/@types/clone/-/clone-0.1.30.tgz#e7365648c1b42136a59c7d5040637b3b5c83b614"
 
+"@types/common-tags@^1.8.0":
+  version "1.8.0"
+  resolved "https://registry.yarnpkg.com/@types/common-tags/-/common-tags-1.8.0.tgz#79d55e748d730b997be5b7fce4b74488d8b26a6b"
+  integrity sha512-htRqZr5qn8EzMelhX/Xmx142z218lLyGaeZ3YR8jlze4TATRU9huKKvuBmAJEW4LCC4pnY1N6JAm6p85fMHjhg==
+
 "@types/core-js@^2.5.0":
   version "2.5.0"
   resolved "https://registry.yarnpkg.com/@types/core-js/-/core-js-2.5.0.tgz#35cc282488de6f10af1d92902899a3b8ca3fbc47"
@@ -7014,6 +7019,11 @@ deep-is@~0.1.3:
   version "0.1.3"
   resolved "https://registry.yarnpkg.com/deep-is/-/deep-is-0.1.3.tgz#b369d6fb5dbc13eecf524f91b070feedc357cf34"
 
+deep-object-diff@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/deep-object-diff/-/deep-object-diff-1.1.0.tgz#d6fabf476c2ed1751fc94d5ca693d2ed8c18bc5a"
+  integrity sha512-b+QLs5vHgS+IoSNcUE4n9HP2NwcHj7aqnJWsjPtuG75Rh5TOaGt0OjAYInh77d5T16V5cRDC+Pw/6ZZZiETBGw==
+
 deepmerge@3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/deepmerge/-/deepmerge-3.0.0.tgz#ca7903b34bfa1f8c2eab6779280775a411bfc6ba"

From 1254bdd5091c66165de04ff42700389bf55521f2 Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Thu, 21 Feb 2019 14:24:28 +0800
Subject: [PATCH 050/249] Merge pull request #5677 from storybooks/fix/5666

CHANGE the keyboard shortcuts of toggleNav & togglePanel
---
 .../tests/__snapshots__/storyshots.test.js.snap               | 4 ++--
 lib/ui/src/containers/nav.js                                  | 4 ++--
 lib/ui/src/core/shortcuts.js                                  | 4 ++--
 lib/ui/src/core/shortcuts.test.js                             | 4 ++--
 lib/ui/src/settings/shortcuts.test.js                         | 4 ++--
 5 files changed, 10 insertions(+), 10 deletions(-)

diff --git a/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap b/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
index 41cb155db4f..5a3abad4b5d 100644
--- a/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
+++ b/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
@@ -4461,7 +4461,7 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
               placeholder="Type keys"
               readonly=""
               spellcheck="false"
-              value="S"
+              value="A"
             />
             <svg
               class="emotion-16"
@@ -4511,7 +4511,7 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
               placeholder="Type keys"
               readonly=""
               spellcheck="false"
-              value="A"
+              value="S"
             />
             <svg
               class="emotion-16"
diff --git a/lib/ui/src/containers/nav.js b/lib/ui/src/containers/nav.js
index 3b64e4a9d63..e41d3591c35 100755
--- a/lib/ui/src/containers/nav.js
+++ b/lib/ui/src/containers/nav.js
@@ -11,14 +11,14 @@ import { Consumer } from '../core/context';
 
 const createMenu = memoize(1)((api, shortcutKeys, isFullscreen, showPanel, showNav) => [
   {
-    id: 'A',
+    id: 'S',
     title: 'Show sidebar',
     onClick: () => api.toggleNav(),
     right: shortcutToHumanString(shortcutKeys.toggleNav),
     left: showNav ? <ListItemIcon icon="check" /> : <ListItemIcon />,
   },
   {
-    id: 'S',
+    id: 'A',
     title: 'Show addons',
     onClick: () => api.togglePanel(),
     right: shortcutToHumanString(shortcutKeys.togglePanel),
diff --git a/lib/ui/src/core/shortcuts.js b/lib/ui/src/core/shortcuts.js
index 623eb4ef4ef..0e5ae59ab10 100644
--- a/lib/ui/src/core/shortcuts.js
+++ b/lib/ui/src/core/shortcuts.js
@@ -9,9 +9,9 @@ export const controlOrMetaKey = () => (isMacLike() ? 'meta' : 'control');
 
 export const defaultShortcuts = Object.freeze({
   fullScreen: ['F'],
-  togglePanel: ['S'], // Panel visibiliy
+  togglePanel: ['A'],
   panelPosition: ['D'],
-  toggleNav: ['A'],
+  toggleNav: ['S'],
   toolbar: ['T'],
   search: ['/'],
   focusNav: ['1'],
diff --git a/lib/ui/src/core/shortcuts.test.js b/lib/ui/src/core/shortcuts.test.js
index 4a272e2d9b1..3a78318340a 100644
--- a/lib/ui/src/core/shortcuts.test.js
+++ b/lib/ui/src/core/shortcuts.test.js
@@ -28,7 +28,7 @@ describe('shortcuts api', () => {
     store.setState(state);
 
     expect(api.getShortcutKeys().fullScreen).toEqual(['Z']);
-    expect(api.getShortcutKeys().togglePanel).toEqual(['S']);
+    expect(api.getShortcutKeys().togglePanel).toEqual(['A']);
   });
 
   it('sets defaults, ignoring anything persisted that is out of date', () => {
@@ -61,7 +61,7 @@ describe('shortcuts api', () => {
     await api.setShortcut('togglePanel', ['B']);
     await api.restoreAllDefaultShortcuts();
     expect(api.getShortcutKeys().fullScreen).toEqual(['F']);
-    expect(api.getShortcutKeys().togglePanel).toEqual(['S']);
+    expect(api.getShortcutKeys().togglePanel).toEqual(['A']);
   });
 
   it('restores single default', async () => {
diff --git a/lib/ui/src/settings/shortcuts.test.js b/lib/ui/src/settings/shortcuts.test.js
index f19f6a0ed09..c791f10c055 100644
--- a/lib/ui/src/settings/shortcuts.test.js
+++ b/lib/ui/src/settings/shortcuts.test.js
@@ -8,8 +8,8 @@ import ShortcutsScreen from './shortcuts';
 // A limited set of keys we use in this test file
 const shortcutKeys = {
   fullScreen: ['F'],
-  togglePanel: ['S'],
-  toggleNav: ['A'],
+  togglePanel: ['A'],
+  toggleNav: ['S'],
   toolbar: ['T'],
   search: ['/'],
   focusNav: ['1'],

From a02fb7238b5ebe55c257089050f458e10cbd3fdc Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Thu, 21 Feb 2019 14:26:22 +0800
Subject: [PATCH 051/249] Merge pull request #5689 from
 storybooks/fix/bar-scrollbar-persistence

Fix/bar scrollbar persistence
---
 .../__snapshots__/storyshots.test.js.snap     |  38 +++++
 lib/components/src/bar/bar.js                 |  11 ++
 .../tabs/__snapshots__/tabs.stories.storyshot | 133 ++++++++++++++++++
 .../__snapshots__/panel.stories.storyshot     |  19 +++
 .../__snapshots__/preview.stories.storyshot   |  38 +++++
 .../__snapshots__/about.stories.storyshot     |  57 ++++++++
 6 files changed, 296 insertions(+)

diff --git a/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap b/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
index 5a3abad4b5d..3cdd355530e 100644
--- a/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
+++ b/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
@@ -3353,11 +3353,30 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
 }
 
+.emotion-8:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
 .emotion-8::-webkit-scrollbar {
   height: 3px;
   width: 3px;
   background: transparent;
   box-shadow: none;
+  display: none;
+}
+
+.emotion-8:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
 }
 
 .emotion-8::-webkit-scrollbar-track {
@@ -3865,11 +3884,30 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
 }
 
+.emotion-8:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
 .emotion-8::-webkit-scrollbar {
   height: 3px;
   width: 3px;
   background: transparent;
   box-shadow: none;
+  display: none;
+}
+
+.emotion-8:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
 }
 
 .emotion-8::-webkit-scrollbar-track {
diff --git a/lib/components/src/bar/bar.js b/lib/components/src/bar/bar.js
index afc1cfbc9c2..4d5f054e51d 100644
--- a/lib/components/src/bar/bar.js
+++ b/lib/components/src/bar/bar.js
@@ -45,11 +45,22 @@ export const Bar = styled.div(
           scrollbarWidth: ['slim', 3],
           scrollbarColor: 'transparent transparent',
 
+          '&:hover': {
+            scrollbarWidth: ['none', 0],
+          },
+
           '&::-webkit-scrollbar': {
             height: 3,
             width: 3,
             background: 'transparent',
             boxShadow: 'none',
+            display: 'none',
+          },
+          '&:hover::-webkit-scrollbar': {
+            height: 3,
+            width: 3,
+            background: 'transparent',
+            display: 'block',
           },
 
           '&::-webkit-scrollbar-track': {
diff --git a/lib/components/src/tabs/__snapshots__/tabs.stories.storyshot b/lib/components/src/tabs/__snapshots__/tabs.stories.storyshot
index e4a5400de7b..ec79f2959e4 100644
--- a/lib/components/src/tabs/__snapshots__/tabs.stories.storyshot
+++ b/lib/components/src/tabs/__snapshots__/tabs.stories.storyshot
@@ -22,11 +22,30 @@ exports[`Storyshots Basics|Tabs stateful - dynamic 1`] = `
   background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
 }
 
+.emotion-9:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
 .emotion-9::-webkit-scrollbar {
   height: 3px;
   width: 3px;
   background: transparent;
   box-shadow: none;
+  display: none;
+}
+
+.emotion-9:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
 }
 
 .emotion-9::-webkit-scrollbar-track {
@@ -355,11 +374,30 @@ exports[`Storyshots Basics|Tabs stateful - no initial 1`] = `
   background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
 }
 
+.emotion-9:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
 .emotion-9::-webkit-scrollbar {
   height: 3px;
   width: 3px;
   background: transparent;
   box-shadow: none;
+  display: none;
+}
+
+.emotion-9:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
 }
 
 .emotion-9::-webkit-scrollbar-track {
@@ -644,11 +682,30 @@ exports[`Storyshots Basics|Tabs stateful - static 1`] = `
   background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
 }
 
+.emotion-5:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
 .emotion-5::-webkit-scrollbar {
   height: 3px;
   width: 3px;
   background: transparent;
   box-shadow: none;
+  display: none;
+}
+
+.emotion-5:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
 }
 
 .emotion-5::-webkit-scrollbar-track {
@@ -891,11 +948,30 @@ exports[`Storyshots Basics|Tabs stateless - absolute 1`] = `
   background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
 }
 
+.emotion-9:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
 .emotion-9::-webkit-scrollbar {
   height: 3px;
   width: 3px;
   background: transparent;
   box-shadow: none;
+  display: none;
+}
+
+.emotion-9:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
 }
 
 .emotion-9::-webkit-scrollbar-track {
@@ -1241,11 +1317,30 @@ exports[`Storyshots Basics|Tabs stateless - bordered 1`] = `
   background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
 }
 
+.emotion-9:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
 .emotion-9::-webkit-scrollbar {
   height: 3px;
   width: 3px;
   background: transparent;
   box-shadow: none;
+  display: none;
+}
+
+.emotion-9:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
 }
 
 .emotion-9::-webkit-scrollbar-track {
@@ -1603,11 +1698,30 @@ exports[`Storyshots Basics|Tabs stateless - no scrolling 1`] = `
   background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
 }
 
+.emotion-9:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
 .emotion-9::-webkit-scrollbar {
   height: 3px;
   width: 3px;
   background: transparent;
   box-shadow: none;
+  display: none;
+}
+
+.emotion-9:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
 }
 
 .emotion-9::-webkit-scrollbar-track {
@@ -1938,11 +2052,30 @@ exports[`Storyshots Basics|Tabs stateless - with tools 1`] = `
   background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
 }
 
+.emotion-10:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
 .emotion-10::-webkit-scrollbar {
   height: 3px;
   width: 3px;
   background: transparent;
   box-shadow: none;
+  display: none;
+}
+
+.emotion-10:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
 }
 
 .emotion-10::-webkit-scrollbar-track {
diff --git a/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot b/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot
index 9b47032ffb7..64a6e9de740 100644
--- a/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot
+++ b/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot
@@ -35,11 +35,30 @@ exports[`Storyshots UI|Panel default 1`] = `
   background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
 }
 
+.emotion-12:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
 .emotion-12::-webkit-scrollbar {
   height: 3px;
   width: 3px;
   background: transparent;
   box-shadow: none;
+  display: none;
+}
+
+.emotion-12:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
 }
 
 .emotion-12::-webkit-scrollbar-track {
diff --git a/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot b/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot
index 81a329b8faa..58d47410daa 100644
--- a/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot
+++ b/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot
@@ -116,11 +116,30 @@ Array [
   tranform: translateY(0px);
 }
 
+.emotion-23:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
 .emotion-23::-webkit-scrollbar {
   height: 3px;
   width: 3px;
   background: transparent;
   box-shadow: none;
+  display: none;
+}
+
+.emotion-23:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
 }
 
 .emotion-23::-webkit-scrollbar-track {
@@ -560,11 +579,30 @@ Array [
   tranform: translateY(0px);
 }
 
+.emotion-29:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
 .emotion-29::-webkit-scrollbar {
   height: 3px;
   width: 3px;
   background: transparent;
   box-shadow: none;
+  display: none;
+}
+
+.emotion-29:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
 }
 
 .emotion-29::-webkit-scrollbar-track {
diff --git a/lib/ui/src/settings/__snapshots__/about.stories.storyshot b/lib/ui/src/settings/__snapshots__/about.stories.storyshot
index 6b355b24dd0..158f7f13922 100644
--- a/lib/ui/src/settings/__snapshots__/about.stories.storyshot
+++ b/lib/ui/src/settings/__snapshots__/about.stories.storyshot
@@ -35,11 +35,30 @@ exports[`Storyshots UI|Settings/AboutScreen failed to fetch new version 1`] = `
   background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
 }
 
+.emotion-8:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
 .emotion-8::-webkit-scrollbar {
   height: 3px;
   width: 3px;
   background: transparent;
   box-shadow: none;
+  display: none;
+}
+
+.emotion-8:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
 }
 
 .emotion-8::-webkit-scrollbar-track {
@@ -585,11 +604,30 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
 }
 
+.emotion-8:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
 .emotion-8::-webkit-scrollbar {
   height: 3px;
   width: 3px;
   background: transparent;
   box-shadow: none;
+  display: none;
+}
+
+.emotion-8:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
 }
 
 .emotion-8::-webkit-scrollbar-track {
@@ -1954,11 +1992,30 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
 }
 
+.emotion-8:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
 .emotion-8::-webkit-scrollbar {
   height: 3px;
   width: 3px;
   background: transparent;
   box-shadow: none;
+  display: none;
+}
+
+.emotion-8:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
 }
 
 .emotion-8::-webkit-scrollbar-track {

From cd89a1640a0ff9a8539f1cf77b90988df41421ea Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Thu, 21 Feb 2019 15:48:19 +0800
Subject: [PATCH 052/249] Merge pull request #5699 from
 storybooks/5683-cli-version-notice

Cleanup CLI version notice
---
 lib/core/src/server/build-dev.js                          | 4 +---
 lib/ui/src/settings/__snapshots__/about.stories.storyshot | 4 ++--
 lib/ui/src/settings/about.js                              | 2 +-
 3 files changed, 4 insertions(+), 6 deletions(-)

diff --git a/lib/core/src/server/build-dev.js b/lib/core/src/server/build-dev.js
index 7b207d09037..9ff7d85e72f 100644
--- a/lib/core/src/server/build-dev.js
+++ b/lib/core/src/server/build-dev.js
@@ -147,10 +147,8 @@ function createUpdateMessage(updateInfo, version) {
           ${colors.orange(
             `A new version (${chalk.bold(updateInfo.data.latest.version)}) is available!`
           )}
-          ${chalk.gray(updateInfo.data.latest.info.plain)}
 
-          ${chalk.gray('Read full changelog here:')}
-          ${chalk.gray.underline('https://git.io/fxc61')}
+          ${chalk.gray('Read full changelog here:')} ${chalk.gray.underline('https://git.io/fhFYe')}
         `
         : '';
   } catch (e) {
diff --git a/lib/ui/src/settings/__snapshots__/about.stories.storyshot b/lib/ui/src/settings/__snapshots__/about.stories.storyshot
index 158f7f13922..3078db25378 100644
--- a/lib/ui/src/settings/__snapshots__/about.stories.storyshot
+++ b/lib/ui/src/settings/__snapshots__/about.stories.storyshot
@@ -1797,7 +1797,7 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
           </span>
           <a
             class="emotion-15"
-            href="https://github.com/storybooks/storybook/blob/master/CHANGELOG.md"
+            href="https://github.com/storybooks/storybook/blob/next/CHANGELOG.md"
             target="_blank"
           >
             <span
@@ -2948,7 +2948,7 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
           </span>
           <a
             class="emotion-15"
-            href="https://github.com/storybooks/storybook/blob/master/CHANGELOG.md"
+            href="https://github.com/storybooks/storybook/blob/next/CHANGELOG.md"
             target="_blank"
           >
             <span
diff --git a/lib/ui/src/settings/about.js b/lib/ui/src/settings/about.js
index f7df688fe5f..c2a548bcf9e 100644
--- a/lib/ui/src/settings/about.js
+++ b/lib/ui/src/settings/about.js
@@ -148,7 +148,7 @@ const AboutScreen = ({ latest, current, onClose }) => {
                   <Subheading>{latest.version} Changelog</Subheading>
                   <SubheadingLink
                     secondary
-                    href="https://github.com/storybooks/storybook/blob/master/CHANGELOG.md"
+                    href="https://github.com/storybooks/storybook/blob/next/CHANGELOG.md"
                     withArrow
                     target="_blank"
                   >

From 4dad3f17ffc315a894b0c3bd0bd505e1df8b2052 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Thu, 21 Feb 2019 17:52:41 +0800
Subject: [PATCH 053/249] 5.0.0-rc.4 changelog

---
 CHANGELOG.md | 27 +++++++++++++++++++++++++++
 1 file changed, 27 insertions(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index a8db7ba4896..7a1075fe26e 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,30 @@
+## 5.0.0-rc.4 (February 21, 2019)
+
+### Features
+
+* Handle prerelease versions in version check ([#5641](https://github.com/storybooks/storybook/pull/5641))
+
+### Bug Fixes
+
+* UI: Fix scrollbar persistence ([#5689](https://github.com/storybooks/storybook/pull/5689))
+* UI: Fix keyboard shortcuts of toggleNav & togglePanel ([#5677](https://github.com/storybooks/storybook/pull/5677))
+* Core: Fix singleton module issue for manager & theme ([#5679](https://github.com/storybooks/storybook/pull/5679))
+* Addon-storysource: Fix source not updating ([#5672](https://github.com/storybooks/storybook/pull/5672))
+* Core: Fix broken error reporting ([#5678](https://github.com/storybooks/storybook/pull/5678))
+* Compare component name to story name, not story fn ([#5649](https://github.com/storybooks/storybook/pull/5649))
+
+### Maintenance
+
+* CLI: Cleanup version notice ([#5699](https://github.com/storybooks/storybook/pull/5699))
+* Core: Fix story fn consistency ([#5669](https://github.com/storybooks/storybook/pull/5669))
+
+## 4.1.13 (February 21, 2019)
+
+### Maintenance
+
+* CLI: Cleanup version notice ([#5699](https://github.com/storybooks/storybook/pull/5699))
+* Docs: Use static versions.json file instead of hacking one in ([#5675](https://github.com/storybooks/storybook/pull/5675))
+
 ## 5.0.0-rc.3 (February 19, 2019)
 
 ### Bug Fixes

From 5e14bdebb040e429e2e675d58abebac6381ae14c Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Tue, 19 Feb 2019 12:38:57 +0100
Subject: [PATCH 054/249] Merge pull request #5649 from ManBearTM/patch-3

Compare component name to story name, not story fn
---
 addons/info/src/__snapshots__/index.test.js.snap | 14 ++++++++------
 addons/info/src/components/Story.js              |  4 ++--
 addons/info/src/index.test.js                    | 13 +++++++------
 3 files changed, 17 insertions(+), 14 deletions(-)

diff --git a/addons/info/src/__snapshots__/index.test.js.snap b/addons/info/src/__snapshots__/index.test.js.snap
index 5b4d03fabce..67bc43a9cb1 100644
--- a/addons/info/src/__snapshots__/index.test.js.snap
+++ b/addons/info/src/__snapshots__/index.test.js.snap
@@ -2608,7 +2608,7 @@ exports[`addon Info should render component description if story kind matches co
     context={
       Object {
         "kind": "TestComponent",
-        "story": "Basic test",
+        "name": "Basic test",
       }
     }
     excludedPropTypes={Array []}
@@ -2670,7 +2670,9 @@ exports[`addon Info should render component description if story kind matches co
                   "padding": 0,
                 }
               }
-            />
+            >
+              Basic test
+            </h2>
           </div>
         </div>
       </div>
@@ -2823,7 +2825,6 @@ exports[`addon Info should render component description if story kind matches co
                 >
                   cursive
                 </em>
-                 
               </div>
             </P>
           </div>
@@ -3822,7 +3823,7 @@ exports[`addon Info should render component description if story name matches co
     context={
       Object {
         "kind": "Test Components",
-        "story": "TestComponent",
+        "name": "TestComponent",
       }
     }
     excludedPropTypes={Array []}
@@ -3884,7 +3885,9 @@ exports[`addon Info should render component description if story name matches co
                   "padding": 0,
                 }
               }
-            />
+            >
+              TestComponent
+            </h2>
           </div>
         </div>
       </div>
@@ -4037,7 +4040,6 @@ exports[`addon Info should render component description if story name matches co
                 >
                   cursive
                 </em>
-                 
               </div>
             </P>
           </div>
diff --git a/addons/info/src/components/Story.js b/addons/info/src/components/Story.js
index 33da53ddad6..dc7d0e9bfcd 100644
--- a/addons/info/src/components/Story.js
+++ b/addons/info/src/components/Story.js
@@ -264,11 +264,11 @@ class Story extends Component {
 
   _getComponentDescription() {
     const {
-      context: { kind, story },
+      context: { kind, name },
     } = this.props;
     let retDiv = null;
 
-    const validMatches = [kind, story];
+    const validMatches = [kind, name];
 
     if (Object.keys(STORYBOOK_REACT_CLASSES).length) {
       Object.keys(STORYBOOK_REACT_CLASSES).forEach(key => {
diff --git a/addons/info/src/index.test.js b/addons/info/src/index.test.js
index d85c99f48fc..339d4c669ad 100644
--- a/addons/info/src/index.test.js
+++ b/addons/info/src/index.test.js
@@ -20,7 +20,8 @@ const TestComponent = ({ func, obj, array, number, string, bool, empty }) => (
       <li>1</li>
       <li>2</li>
     </ul>
-  </div>);
+  </div>
+);
 /* eslint-enable */
 
 const reactClassPath = 'some/path/TestComponent.jsx';
@@ -31,7 +32,7 @@ const storybookReactClassMock = {
     description: `
 # Awesome test component description
 ## with markdown support
-**bold** *cursive* 
+**bold** *cursive*
     `,
     name: 'TestComponent',
   },
@@ -45,9 +46,9 @@ containing **bold**, *cursive* text, \`code\` and [a link](https://github.com)`;
 
 describe('addon Info', () => {
   // eslint-disable-next-line react/prop-types
-  const storyFn = ({ story }) => (
+  const storyFn = ({ name }) => (
     <div>
-      It's a {story} story:
+      It's a {name} story:
       <TestComponent
         func={x => x + 1}
         obj={{ a: 'a', b: 'b' }}
@@ -85,7 +86,7 @@ describe('addon Info', () => {
     const Info = () =>
       withInfo({ inline: true, propTables: false })(storyFn, {
         kind: 'TestComponent',
-        story: 'Basic test',
+        name: 'Basic test',
       });
 
     expect(mount(<Info />)).toMatchSnapshot();
@@ -100,7 +101,7 @@ describe('addon Info', () => {
     const Info = () =>
       withInfo({ inline: true, propTables: false })(storyFn, {
         kind: 'Test Components',
-        story: 'TestComponent',
+        name: 'TestComponent',
       });
 
     expect(mount(<Info />)).toMatchSnapshot();

From a089e9456486f4969734d1b35c7c62fcef10bdbc Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Thu, 21 Feb 2019 17:54:52 +0800
Subject: [PATCH 055/249] Update snapshots

---
 .../__snapshots__/storyshots.test.js.snap     |  38 -
 .../tabs/__snapshots__/tabs.stories.storyshot | 980 +++++++++---------
 .../__snapshots__/panel.stories.storyshot     |  19 -
 .../__snapshots__/preview.stories.storyshot   |  38 -
 .../__snapshots__/about.stories.storyshot     |  57 -
 5 files changed, 490 insertions(+), 642 deletions(-)

diff --git a/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap b/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
index 3cdd355530e..5a3abad4b5d 100644
--- a/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
+++ b/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
@@ -3353,30 +3353,11 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
 }
 
-.emotion-8:hover {
-  -webkit-scrollbar-width: none;
-  -moz-scrollbar-width: none;
-  -ms-scrollbar-width: none;
-  scrollbar-width: none;
-  -webkit-scrollbar-width: 0;
-  -moz-scrollbar-width: 0;
-  -ms-scrollbar-width: 0;
-  scrollbar-width: 0;
-}
-
 .emotion-8::-webkit-scrollbar {
   height: 3px;
   width: 3px;
   background: transparent;
   box-shadow: none;
-  display: none;
-}
-
-.emotion-8:hover::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  display: block;
 }
 
 .emotion-8::-webkit-scrollbar-track {
@@ -3884,30 +3865,11 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
 }
 
-.emotion-8:hover {
-  -webkit-scrollbar-width: none;
-  -moz-scrollbar-width: none;
-  -ms-scrollbar-width: none;
-  scrollbar-width: none;
-  -webkit-scrollbar-width: 0;
-  -moz-scrollbar-width: 0;
-  -ms-scrollbar-width: 0;
-  scrollbar-width: 0;
-}
-
 .emotion-8::-webkit-scrollbar {
   height: 3px;
   width: 3px;
   background: transparent;
   box-shadow: none;
-  display: none;
-}
-
-.emotion-8:hover::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  display: block;
 }
 
 .emotion-8::-webkit-scrollbar-track {
diff --git a/lib/components/src/tabs/__snapshots__/tabs.stories.storyshot b/lib/components/src/tabs/__snapshots__/tabs.stories.storyshot
index ec79f2959e4..ab62c31c611 100644
--- a/lib/components/src/tabs/__snapshots__/tabs.stories.storyshot
+++ b/lib/components/src/tabs/__snapshots__/tabs.stories.storyshot
@@ -1,76 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Storyshots Basics|Tabs stateful - dynamic 1`] = `
-.emotion-9 {
-  color: #999999;
-  height: 40px;
-  overflow: auto;
-  overflow-x: auto;
-  overflow-y: hidden;
-  -webkit-scrollbar-width: slim;
-  -moz-scrollbar-width: slim;
-  -ms-scrollbar-width: slim;
-  scrollbar-width: slim;
-  -webkit-scrollbar-width: 3px;
-  -moz-scrollbar-width: 3px;
-  -ms-scrollbar-width: 3px;
-  scrollbar-width: 3px;
-  -webkit-scrollbar-color: transparent transparent;
-  -moz-scrollbar-color: transparent transparent;
-  -ms-scrollbar-color: transparent transparent;
-  scrollbar-color: transparent transparent;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
-}
-
-.emotion-9:hover {
-  -webkit-scrollbar-width: none;
-  -moz-scrollbar-width: none;
-  -ms-scrollbar-width: none;
-  scrollbar-width: none;
-  -webkit-scrollbar-width: 0;
-  -moz-scrollbar-width: 0;
-  -ms-scrollbar-width: 0;
-  scrollbar-width: 0;
-}
-
-.emotion-9::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  box-shadow: none;
-  display: none;
-}
-
-.emotion-9:hover::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  display: block;
-}
-
-.emotion-9::-webkit-scrollbar-track {
-  border-radius: 0;
-  background: transparent;
-  opacity: 0;
-  border: 0 none;
-  box-shadow: none;
-  height: 0;
-  width: 0;
-}
-
-.emotion-9::-webkit-scrollbar-thumb {
-  border-radius: 0;
-  background: rgba(0,0,0,.1);
-  box-shadow: none;
-}
-
-.emotion-9::-webkit-scrollbar-track-piece {
-  display: none;
-  border: 0 none;
-  opacity: 0;
-  visibility: hidden;
-}
-
 .emotion-8 {
   display: -webkit-box;
   display: -webkit-flex;
@@ -204,6 +134,76 @@ exports[`Storyshots Basics|Tabs stateful - dynamic 1`] = `
   display: block;
 }
 
+.emotion-9 {
+  color: #999999;
+  height: 40px;
+  overflow: auto;
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-9:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
+.emotion-9::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+  display: none;
+}
+
+.emotion-9:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
+}
+
+.emotion-9::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-9::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-9::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
+}
+
 .emotion-11 {
   display: block;
   position: relative;
@@ -353,76 +353,6 @@ exports[`Storyshots Basics|Tabs stateful - dynamic 1`] = `
 `;
 
 exports[`Storyshots Basics|Tabs stateful - no initial 1`] = `
-.emotion-9 {
-  color: #999999;
-  height: 40px;
-  overflow: auto;
-  overflow-x: auto;
-  overflow-y: hidden;
-  -webkit-scrollbar-width: slim;
-  -moz-scrollbar-width: slim;
-  -ms-scrollbar-width: slim;
-  scrollbar-width: slim;
-  -webkit-scrollbar-width: 3px;
-  -moz-scrollbar-width: 3px;
-  -ms-scrollbar-width: 3px;
-  scrollbar-width: 3px;
-  -webkit-scrollbar-color: transparent transparent;
-  -moz-scrollbar-color: transparent transparent;
-  -ms-scrollbar-color: transparent transparent;
-  scrollbar-color: transparent transparent;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
-}
-
-.emotion-9:hover {
-  -webkit-scrollbar-width: none;
-  -moz-scrollbar-width: none;
-  -ms-scrollbar-width: none;
-  scrollbar-width: none;
-  -webkit-scrollbar-width: 0;
-  -moz-scrollbar-width: 0;
-  -ms-scrollbar-width: 0;
-  scrollbar-width: 0;
-}
-
-.emotion-9::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  box-shadow: none;
-  display: none;
-}
-
-.emotion-9:hover::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  display: block;
-}
-
-.emotion-9::-webkit-scrollbar-track {
-  border-radius: 0;
-  background: transparent;
-  opacity: 0;
-  border: 0 none;
-  box-shadow: none;
-  height: 0;
-  width: 0;
-}
-
-.emotion-9::-webkit-scrollbar-thumb {
-  border-radius: 0;
-  background: rgba(0,0,0,.1);
-  box-shadow: none;
-}
-
-.emotion-9::-webkit-scrollbar-track-piece {
-  display: none;
-  border: 0 none;
-  opacity: 0;
-  visibility: hidden;
-}
-
 .emotion-8 {
   display: -webkit-box;
   display: -webkit-flex;
@@ -556,6 +486,76 @@ exports[`Storyshots Basics|Tabs stateful - no initial 1`] = `
   display: block;
 }
 
+.emotion-9 {
+  color: #999999;
+  height: 40px;
+  overflow: auto;
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-9:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
+.emotion-9::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+  display: none;
+}
+
+.emotion-9:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
+}
+
+.emotion-9::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-9::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-9::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
+}
+
 .emotion-11 {
   display: block;
   position: relative;
@@ -661,76 +661,6 @@ exports[`Storyshots Basics|Tabs stateful - no initial 1`] = `
 `;
 
 exports[`Storyshots Basics|Tabs stateful - static 1`] = `
-.emotion-5 {
-  color: #999999;
-  height: 40px;
-  overflow: auto;
-  overflow-x: auto;
-  overflow-y: hidden;
-  -webkit-scrollbar-width: slim;
-  -moz-scrollbar-width: slim;
-  -ms-scrollbar-width: slim;
-  scrollbar-width: slim;
-  -webkit-scrollbar-width: 3px;
-  -moz-scrollbar-width: 3px;
-  -ms-scrollbar-width: 3px;
-  scrollbar-width: 3px;
-  -webkit-scrollbar-color: transparent transparent;
-  -moz-scrollbar-color: transparent transparent;
-  -ms-scrollbar-color: transparent transparent;
-  scrollbar-color: transparent transparent;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
-}
-
-.emotion-5:hover {
-  -webkit-scrollbar-width: none;
-  -moz-scrollbar-width: none;
-  -ms-scrollbar-width: none;
-  scrollbar-width: none;
-  -webkit-scrollbar-width: 0;
-  -moz-scrollbar-width: 0;
-  -ms-scrollbar-width: 0;
-  scrollbar-width: 0;
-}
-
-.emotion-5::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  box-shadow: none;
-  display: none;
-}
-
-.emotion-5:hover::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  display: block;
-}
-
-.emotion-5::-webkit-scrollbar-track {
-  border-radius: 0;
-  background: transparent;
-  opacity: 0;
-  border: 0 none;
-  box-shadow: none;
-  height: 0;
-  width: 0;
-}
-
-.emotion-5::-webkit-scrollbar-thumb {
-  border-radius: 0;
-  background: rgba(0,0,0,.1);
-  box-shadow: none;
-}
-
-.emotion-5::-webkit-scrollbar-track-piece {
-  display: none;
-  border: 0 none;
-  opacity: 0;
-  visibility: hidden;
-}
-
 .emotion-4 {
   display: -webkit-box;
   display: -webkit-flex;
@@ -864,6 +794,76 @@ exports[`Storyshots Basics|Tabs stateful - static 1`] = `
   display: block;
 }
 
+.emotion-5 {
+  color: #999999;
+  height: 40px;
+  overflow: auto;
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-5:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
+.emotion-5::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+  display: none;
+}
+
+.emotion-5:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
+}
+
+.emotion-5::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-5::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-5::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
+}
+
 .emotion-7 {
   display: block;
   position: relative;
@@ -927,76 +927,6 @@ exports[`Storyshots Basics|Tabs stateful - static 1`] = `
 `;
 
 exports[`Storyshots Basics|Tabs stateless - absolute 1`] = `
-.emotion-9 {
-  color: #999999;
-  height: 40px;
-  overflow: auto;
-  overflow-x: auto;
-  overflow-y: hidden;
-  -webkit-scrollbar-width: slim;
-  -moz-scrollbar-width: slim;
-  -ms-scrollbar-width: slim;
-  scrollbar-width: slim;
-  -webkit-scrollbar-width: 3px;
-  -moz-scrollbar-width: 3px;
-  -ms-scrollbar-width: 3px;
-  scrollbar-width: 3px;
-  -webkit-scrollbar-color: transparent transparent;
-  -moz-scrollbar-color: transparent transparent;
-  -ms-scrollbar-color: transparent transparent;
-  scrollbar-color: transparent transparent;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
-}
-
-.emotion-9:hover {
-  -webkit-scrollbar-width: none;
-  -moz-scrollbar-width: none;
-  -ms-scrollbar-width: none;
-  scrollbar-width: none;
-  -webkit-scrollbar-width: 0;
-  -moz-scrollbar-width: 0;
-  -ms-scrollbar-width: 0;
-  scrollbar-width: 0;
-}
-
-.emotion-9::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  box-shadow: none;
-  display: none;
-}
-
-.emotion-9:hover::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  display: block;
-}
-
-.emotion-9::-webkit-scrollbar-track {
-  border-radius: 0;
-  background: transparent;
-  opacity: 0;
-  border: 0 none;
-  box-shadow: none;
-  height: 0;
-  width: 0;
-}
-
-.emotion-9::-webkit-scrollbar-thumb {
-  border-radius: 0;
-  background: rgba(0,0,0,.1);
-  box-shadow: none;
-}
-
-.emotion-9::-webkit-scrollbar-track-piece {
-  display: none;
-  border: 0 none;
-  opacity: 0;
-  visibility: hidden;
-}
-
 .emotion-8 {
   display: -webkit-box;
   display: -webkit-flex;
@@ -1138,6 +1068,76 @@ exports[`Storyshots Basics|Tabs stateless - absolute 1`] = `
   width: 100%;
 }
 
+.emotion-9 {
+  color: #999999;
+  height: 40px;
+  overflow: auto;
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-9:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
+.emotion-9::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+  display: none;
+}
+
+.emotion-9:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
+}
+
+.emotion-9::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-9::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-9::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
+}
+
 .emotion-10 {
   display: none;
 }
@@ -1296,76 +1296,6 @@ exports[`Storyshots Basics|Tabs stateless - absolute 1`] = `
 `;
 
 exports[`Storyshots Basics|Tabs stateless - bordered 1`] = `
-.emotion-9 {
-  color: #999999;
-  height: 40px;
-  overflow: auto;
-  overflow-x: auto;
-  overflow-y: hidden;
-  -webkit-scrollbar-width: slim;
-  -moz-scrollbar-width: slim;
-  -ms-scrollbar-width: slim;
-  scrollbar-width: slim;
-  -webkit-scrollbar-width: 3px;
-  -moz-scrollbar-width: 3px;
-  -ms-scrollbar-width: 3px;
-  scrollbar-width: 3px;
-  -webkit-scrollbar-color: transparent transparent;
-  -moz-scrollbar-color: transparent transparent;
-  -ms-scrollbar-color: transparent transparent;
-  scrollbar-color: transparent transparent;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
-}
-
-.emotion-9:hover {
-  -webkit-scrollbar-width: none;
-  -moz-scrollbar-width: none;
-  -ms-scrollbar-width: none;
-  scrollbar-width: none;
-  -webkit-scrollbar-width: 0;
-  -moz-scrollbar-width: 0;
-  -ms-scrollbar-width: 0;
-  scrollbar-width: 0;
-}
-
-.emotion-9::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  box-shadow: none;
-  display: none;
-}
-
-.emotion-9:hover::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  display: block;
-}
-
-.emotion-9::-webkit-scrollbar-track {
-  border-radius: 0;
-  background: transparent;
-  opacity: 0;
-  border: 0 none;
-  box-shadow: none;
-  height: 0;
-  width: 0;
-}
-
-.emotion-9::-webkit-scrollbar-thumb {
-  border-radius: 0;
-  background: rgba(0,0,0,.1);
-  box-shadow: none;
-}
-
-.emotion-9::-webkit-scrollbar-track-piece {
-  display: none;
-  border: 0 none;
-  opacity: 0;
-  visibility: hidden;
-}
-
 .emotion-8 {
   display: -webkit-box;
   display: -webkit-flex;
@@ -1495,6 +1425,76 @@ exports[`Storyshots Basics|Tabs stateless - bordered 1`] = `
   border-bottom-color: #1EA7FD;
 }
 
+.emotion-9 {
+  color: #999999;
+  height: 40px;
+  overflow: auto;
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-9:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
+.emotion-9::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+  display: none;
+}
+
+.emotion-9:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
+}
+
+.emotion-9::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-9::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-9::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
+}
+
 .emotion-11 {
   display: block;
   position: relative;
@@ -1677,76 +1677,6 @@ exports[`Storyshots Basics|Tabs stateless - empty 1`] = `
 `;
 
 exports[`Storyshots Basics|Tabs stateless - no scrolling 1`] = `
-.emotion-9 {
-  color: #999999;
-  height: 40px;
-  overflow: auto;
-  overflow-x: auto;
-  overflow-y: hidden;
-  -webkit-scrollbar-width: slim;
-  -moz-scrollbar-width: slim;
-  -ms-scrollbar-width: slim;
-  scrollbar-width: slim;
-  -webkit-scrollbar-width: 3px;
-  -moz-scrollbar-width: 3px;
-  -ms-scrollbar-width: 3px;
-  scrollbar-width: 3px;
-  -webkit-scrollbar-color: transparent transparent;
-  -moz-scrollbar-color: transparent transparent;
-  -ms-scrollbar-color: transparent transparent;
-  scrollbar-color: transparent transparent;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
-}
-
-.emotion-9:hover {
-  -webkit-scrollbar-width: none;
-  -moz-scrollbar-width: none;
-  -ms-scrollbar-width: none;
-  scrollbar-width: none;
-  -webkit-scrollbar-width: 0;
-  -moz-scrollbar-width: 0;
-  -ms-scrollbar-width: 0;
-  scrollbar-width: 0;
-}
-
-.emotion-9::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  box-shadow: none;
-  display: none;
-}
-
-.emotion-9:hover::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  display: block;
-}
-
-.emotion-9::-webkit-scrollbar-track {
-  border-radius: 0;
-  background: transparent;
-  opacity: 0;
-  border: 0 none;
-  box-shadow: none;
-  height: 0;
-  width: 0;
-}
-
-.emotion-9::-webkit-scrollbar-thumb {
-  border-radius: 0;
-  background: rgba(0,0,0,.1);
-  box-shadow: none;
-}
-
-.emotion-9::-webkit-scrollbar-track-piece {
-  display: none;
-  border: 0 none;
-  opacity: 0;
-  visibility: hidden;
-}
-
 .emotion-8 {
   display: -webkit-box;
   display: -webkit-flex;
@@ -1876,6 +1806,76 @@ exports[`Storyshots Basics|Tabs stateless - no scrolling 1`] = `
   border-bottom-color: #1EA7FD;
 }
 
+.emotion-9 {
+  color: #999999;
+  height: 40px;
+  overflow: auto;
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-9:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
+.emotion-9::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+  display: none;
+}
+
+.emotion-9:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
+}
+
+.emotion-9::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-9::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-9::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
+}
+
 .emotion-11 {
   display: block;
   position: relative;
@@ -2031,76 +2031,6 @@ exports[`Storyshots Basics|Tabs stateless - no scrolling 1`] = `
 `;
 
 exports[`Storyshots Basics|Tabs stateless - with tools 1`] = `
-.emotion-10 {
-  color: #999999;
-  height: 40px;
-  overflow: auto;
-  overflow-x: auto;
-  overflow-y: hidden;
-  -webkit-scrollbar-width: slim;
-  -moz-scrollbar-width: slim;
-  -ms-scrollbar-width: slim;
-  scrollbar-width: slim;
-  -webkit-scrollbar-width: 3px;
-  -moz-scrollbar-width: 3px;
-  -ms-scrollbar-width: 3px;
-  scrollbar-width: 3px;
-  -webkit-scrollbar-color: transparent transparent;
-  -moz-scrollbar-color: transparent transparent;
-  -ms-scrollbar-color: transparent transparent;
-  scrollbar-color: transparent transparent;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
-}
-
-.emotion-10:hover {
-  -webkit-scrollbar-width: none;
-  -moz-scrollbar-width: none;
-  -ms-scrollbar-width: none;
-  scrollbar-width: none;
-  -webkit-scrollbar-width: 0;
-  -moz-scrollbar-width: 0;
-  -ms-scrollbar-width: 0;
-  scrollbar-width: 0;
-}
-
-.emotion-10::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  box-shadow: none;
-  display: none;
-}
-
-.emotion-10:hover::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  display: block;
-}
-
-.emotion-10::-webkit-scrollbar-track {
-  border-radius: 0;
-  background: transparent;
-  opacity: 0;
-  border: 0 none;
-  box-shadow: none;
-  height: 0;
-  width: 0;
-}
-
-.emotion-10::-webkit-scrollbar-thumb {
-  border-radius: 0;
-  background: rgba(0,0,0,.1);
-  box-shadow: none;
-}
-
-.emotion-10::-webkit-scrollbar-track-piece {
-  display: none;
-  border: 0 none;
-  opacity: 0;
-  visibility: hidden;
-}
-
 .emotion-9 {
   display: -webkit-box;
   display: -webkit-flex;
@@ -2252,6 +2182,76 @@ exports[`Storyshots Basics|Tabs stateless - with tools 1`] = `
   display: block;
 }
 
+.emotion-10 {
+  color: #999999;
+  height: 40px;
+  overflow: auto;
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-10:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
+.emotion-10::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+  display: none;
+}
+
+.emotion-10:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
+}
+
+.emotion-10::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-10::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-10::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
+}
+
 .emotion-12 {
   display: block;
   position: relative;
diff --git a/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot b/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot
index 64a6e9de740..9b47032ffb7 100644
--- a/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot
+++ b/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot
@@ -35,30 +35,11 @@ exports[`Storyshots UI|Panel default 1`] = `
   background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
 }
 
-.emotion-12:hover {
-  -webkit-scrollbar-width: none;
-  -moz-scrollbar-width: none;
-  -ms-scrollbar-width: none;
-  scrollbar-width: none;
-  -webkit-scrollbar-width: 0;
-  -moz-scrollbar-width: 0;
-  -ms-scrollbar-width: 0;
-  scrollbar-width: 0;
-}
-
 .emotion-12::-webkit-scrollbar {
   height: 3px;
   width: 3px;
   background: transparent;
   box-shadow: none;
-  display: none;
-}
-
-.emotion-12:hover::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  display: block;
 }
 
 .emotion-12::-webkit-scrollbar-track {
diff --git a/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot b/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot
index 58d47410daa..81a329b8faa 100644
--- a/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot
+++ b/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot
@@ -116,30 +116,11 @@ Array [
   tranform: translateY(0px);
 }
 
-.emotion-23:hover {
-  -webkit-scrollbar-width: none;
-  -moz-scrollbar-width: none;
-  -ms-scrollbar-width: none;
-  scrollbar-width: none;
-  -webkit-scrollbar-width: 0;
-  -moz-scrollbar-width: 0;
-  -ms-scrollbar-width: 0;
-  scrollbar-width: 0;
-}
-
 .emotion-23::-webkit-scrollbar {
   height: 3px;
   width: 3px;
   background: transparent;
   box-shadow: none;
-  display: none;
-}
-
-.emotion-23:hover::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  display: block;
 }
 
 .emotion-23::-webkit-scrollbar-track {
@@ -579,30 +560,11 @@ Array [
   tranform: translateY(0px);
 }
 
-.emotion-29:hover {
-  -webkit-scrollbar-width: none;
-  -moz-scrollbar-width: none;
-  -ms-scrollbar-width: none;
-  scrollbar-width: none;
-  -webkit-scrollbar-width: 0;
-  -moz-scrollbar-width: 0;
-  -ms-scrollbar-width: 0;
-  scrollbar-width: 0;
-}
-
 .emotion-29::-webkit-scrollbar {
   height: 3px;
   width: 3px;
   background: transparent;
   box-shadow: none;
-  display: none;
-}
-
-.emotion-29:hover::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  display: block;
 }
 
 .emotion-29::-webkit-scrollbar-track {
diff --git a/lib/ui/src/settings/__snapshots__/about.stories.storyshot b/lib/ui/src/settings/__snapshots__/about.stories.storyshot
index 3078db25378..175c108e01f 100644
--- a/lib/ui/src/settings/__snapshots__/about.stories.storyshot
+++ b/lib/ui/src/settings/__snapshots__/about.stories.storyshot
@@ -35,30 +35,11 @@ exports[`Storyshots UI|Settings/AboutScreen failed to fetch new version 1`] = `
   background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
 }
 
-.emotion-8:hover {
-  -webkit-scrollbar-width: none;
-  -moz-scrollbar-width: none;
-  -ms-scrollbar-width: none;
-  scrollbar-width: none;
-  -webkit-scrollbar-width: 0;
-  -moz-scrollbar-width: 0;
-  -ms-scrollbar-width: 0;
-  scrollbar-width: 0;
-}
-
 .emotion-8::-webkit-scrollbar {
   height: 3px;
   width: 3px;
   background: transparent;
   box-shadow: none;
-  display: none;
-}
-
-.emotion-8:hover::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  display: block;
 }
 
 .emotion-8::-webkit-scrollbar-track {
@@ -604,30 +585,11 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
 }
 
-.emotion-8:hover {
-  -webkit-scrollbar-width: none;
-  -moz-scrollbar-width: none;
-  -ms-scrollbar-width: none;
-  scrollbar-width: none;
-  -webkit-scrollbar-width: 0;
-  -moz-scrollbar-width: 0;
-  -ms-scrollbar-width: 0;
-  scrollbar-width: 0;
-}
-
 .emotion-8::-webkit-scrollbar {
   height: 3px;
   width: 3px;
   background: transparent;
   box-shadow: none;
-  display: none;
-}
-
-.emotion-8:hover::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  display: block;
 }
 
 .emotion-8::-webkit-scrollbar-track {
@@ -1992,30 +1954,11 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
 }
 
-.emotion-8:hover {
-  -webkit-scrollbar-width: none;
-  -moz-scrollbar-width: none;
-  -ms-scrollbar-width: none;
-  scrollbar-width: none;
-  -webkit-scrollbar-width: 0;
-  -moz-scrollbar-width: 0;
-  -ms-scrollbar-width: 0;
-  scrollbar-width: 0;
-}
-
 .emotion-8::-webkit-scrollbar {
   height: 3px;
   width: 3px;
   background: transparent;
   box-shadow: none;
-  display: none;
-}
-
-.emotion-8:hover::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  display: block;
 }
 
 .emotion-8::-webkit-scrollbar-track {

From 775e17e6121610258fb3dc5bd84a5dd7f8f69c06 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Thu, 21 Feb 2019 18:06:10 +0800
Subject: [PATCH 056/249] Update yarn.lock

---
 yarn.lock | 21 +++++++++++++++++++++
 1 file changed, 21 insertions(+)

diff --git a/yarn.lock b/yarn.lock
index c8cfb8c3c18..82f320aa5cf 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2370,10 +2370,22 @@
   version "0.0.39"
   resolved "https://registry.yarnpkg.com/@types/estree/-/estree-0.0.39.tgz#e177e699ee1b8c22d23174caaa7422644389509f"
 
+"@types/jest-diff@*":
+  version "20.0.1"
+  resolved "https://registry.yarnpkg.com/@types/jest-diff/-/jest-diff-20.0.1.tgz#35cc15b9c4f30a18ef21852e255fdb02f6d59b89"
+  integrity sha512-yALhelO3i0hqZwhjtcr6dYyaLoCHbAMshwtj6cGxTvHZAKXHsYGdff6E8EPw3xLKY0ELUTQ69Q1rQiJENnccMA==
+
 "@types/jest@^23.0.2", "@types/jest@^23.3.1", "@types/jest@^23.3.13":
   version "23.3.13"
   resolved "https://registry.yarnpkg.com/@types/jest/-/jest-23.3.13.tgz#c81484b6f4ca007bb09887ed15ecb3286d58f928"
 
+"@types/jest@^24.0.6":
+  version "24.0.6"
+  resolved "https://registry.yarnpkg.com/@types/jest/-/jest-24.0.6.tgz#ba4c8c7900ce098a82ca99293cbe4192bde4f355"
+  integrity sha512-NE7FBG/F4cMDKdCBqgyd+Sa6JZ5GiMOyA5QwJdeS4Ii/Z9a18WgGbFrHbcr48/7I9HdnkaAYP+S2MmQ27qoqJA==
+  dependencies:
+    "@types/jest-diff" "*"
+
 "@types/json-stringify-safe@^5.0.0":
   version "5.0.0"
   resolved "https://registry.yarnpkg.com/@types/json-stringify-safe/-/json-stringify-safe-5.0.0.tgz#df34d054419d39323a3730966bacba02ac5e474e"
@@ -7850,6 +7862,15 @@ emotion-theming@^10.0.5:
     hoist-non-react-statics "^2.3.1"
     object-assign "^4.1.1"
 
+emotion-theming@^10.0.7:
+  version "10.0.7"
+  resolved "https://registry.yarnpkg.com/emotion-theming/-/emotion-theming-10.0.7.tgz#0629740840f2ff6b929a7c3d52811187768e91c9"
+  integrity sha512-/dqXTvPA8pRQJRrW6/wpGqu0s0tmtwC27Pk0IOrxDV2F/knbKcd7J/G3T2385NjE+aJO4XJJ7JCNWQkwcjuX0Q==
+  dependencies:
+    "@emotion/weak-memoize" "0.2.2"
+    hoist-non-react-statics "^2.3.1"
+    object-assign "^4.1.1"
+
 emotion@^9.1.2:
   version "9.2.12"
   resolved "https://registry.yarnpkg.com/emotion/-/emotion-9.2.12.tgz#53925aaa005614e65c6e43db8243c843574d1ea9"

From 3ba5266050e404cc9eccd002b4b9cf9324f6d131 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Thu, 21 Feb 2019 18:15:01 +0800
Subject: [PATCH 057/249] v5.0.0-rc.4

---
 addons/a11y/package.json                      | 12 ++---
 addons/actions/package.json                   | 10 ++--
 addons/backgrounds/package.json               | 12 ++---
 addons/centered/package.json                  |  2 +-
 addons/cssresources/package.json              | 10 ++--
 addons/events/package.json                    |  8 +--
 addons/google-analytics/package.json          |  6 +--
 addons/graphql/package.json                   |  2 +-
 addons/info/package.json                      | 10 ++--
 addons/jest/package.json                      | 10 ++--
 addons/knobs/package.json                     | 10 ++--
 addons/links/package.json                     |  6 +--
 addons/notes/package.json                     | 12 ++---
 addons/options/package.json                   |  4 +-
 .../storyshots/storyshots-core/package.json   |  4 +-
 .../storyshots-puppeteer/package.json         |  6 +--
 addons/storysource/package.json               | 10 ++--
 addons/viewport/package.json                  | 12 ++---
 app/angular/package.json                      |  6 +--
 app/ember/package.json                        |  4 +-
 app/html/package.json                         |  4 +-
 app/marko/package.json                        |  4 +-
 app/mithril/package.json                      |  4 +-
 app/polymer/package.json                      |  4 +-
 app/preact/package.json                       |  4 +-
 app/react/package.json                        |  8 +--
 app/riot/package.json                         |  4 +-
 app/svelte/package.json                       |  4 +-
 app/vue/package.json                          |  4 +-
 examples/angular-cli/package.json             | 26 +++++-----
 examples/cra-kitchen-sink/package.json        | 32 ++++++------
 examples/cra-ts-kitchen-sink/package.json     | 12 ++---
 examples/ember-cli/package.json               | 26 +++++-----
 examples/html-kitchen-sink/package.json       | 36 ++++++-------
 examples/marko-cli/package.json               | 14 ++---
 examples/mithril-kitchen-sink/package.json    | 26 +++++-----
 examples/official-storybook/package.json      | 48 ++++++++---------
 examples/polymer-cli/package.json             | 20 +++----
 examples/preact-kitchen-sink/package.json     | 26 +++++-----
 examples/riot-kitchen-sink/package.json       | 26 +++++-----
 examples/svelte-kitchen-sink/package.json     | 26 +++++-----
 examples/vue-kitchen-sink/package.json        | 26 +++++-----
 lerna.json                                    |  2 +-
 lib/addons/package.json                       |  6 +--
 lib/channel-postmessage/package.json          |  4 +-
 lib/channel-websocket/package.json            |  4 +-
 lib/channels/package.json                     |  2 +-
 lib/cli/package.json                          | 52 +++++++++----------
 lib/client-api/package.json                   | 10 ++--
 lib/client-logger/package.json                |  2 +-
 lib/codemod/package.json                      |  2 +-
 lib/components/package.json                   | 12 ++---
 lib/core-events/package.json                  |  2 +-
 lib/core/package.json                         | 20 +++----
 lib/node-logger/package.json                  |  2 +-
 lib/router/package.json                       |  4 +-
 lib/theming/package.json                      |  4 +-
 lib/ui/package.json                           | 14 ++---
 58 files changed, 341 insertions(+), 341 deletions(-)

diff --git a/addons/a11y/package.json b/addons/a11y/package.json
index 14c9f2b727d..5c458abfc6f 100644
--- a/addons/a11y/package.json
+++ b/addons/a11y/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-a11y",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "description": "a11y addon for storybook",
   "keywords": [
     "a11y",
@@ -25,11 +25,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.3",
-    "@storybook/client-logger": "5.0.0-rc.3",
-    "@storybook/components": "5.0.0-rc.3",
-    "@storybook/core-events": "5.0.0-rc.3",
-    "@storybook/theming": "5.0.0-rc.3",
+    "@storybook/addons": "5.0.0-rc.4",
+    "@storybook/client-logger": "5.0.0-rc.4",
+    "@storybook/components": "5.0.0-rc.4",
+    "@storybook/core-events": "5.0.0-rc.4",
+    "@storybook/theming": "5.0.0-rc.4",
     "axe-core": "^3.1.2",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
diff --git a/addons/actions/package.json b/addons/actions/package.json
index 3cdfebc1cd8..20a55a7af26 100644
--- a/addons/actions/package.json
+++ b/addons/actions/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-actions",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "description": "Action Logger addon for storybook",
   "keywords": [
     "storybook"
@@ -20,10 +20,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.3",
-    "@storybook/components": "5.0.0-rc.3",
-    "@storybook/core-events": "5.0.0-rc.3",
-    "@storybook/theming": "5.0.0-rc.3",
+    "@storybook/addons": "5.0.0-rc.4",
+    "@storybook/components": "5.0.0-rc.4",
+    "@storybook/core-events": "5.0.0-rc.4",
+    "@storybook/theming": "5.0.0-rc.4",
     "core-js": "^2.6.2",
     "fast-deep-equal": "^2.0.1",
     "global": "^4.3.2",
diff --git a/addons/backgrounds/package.json b/addons/backgrounds/package.json
index 6bee8331897..ec3ccb3da52 100644
--- a/addons/backgrounds/package.json
+++ b/addons/backgrounds/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-backgrounds",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "description": "A storybook addon to show different backgrounds for your preview",
   "keywords": [
     "addon",
@@ -24,11 +24,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.3",
-    "@storybook/client-logger": "5.0.0-rc.3",
-    "@storybook/components": "5.0.0-rc.3",
-    "@storybook/core-events": "5.0.0-rc.3",
-    "@storybook/theming": "5.0.0-rc.3",
+    "@storybook/addons": "5.0.0-rc.4",
+    "@storybook/client-logger": "5.0.0-rc.4",
+    "@storybook/components": "5.0.0-rc.4",
+    "@storybook/core-events": "5.0.0-rc.4",
+    "@storybook/theming": "5.0.0-rc.4",
     "core-js": "^2.6.2",
     "eventemitter3": "^3.1.0",
     "global": "^4.3.2",
diff --git a/addons/centered/package.json b/addons/centered/package.json
index 4def2b53dbd..e44a427696c 100644
--- a/addons/centered/package.json
+++ b/addons/centered/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-centered",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "description": "Storybook decorator to center components",
   "keywords": [
     "addon",
diff --git a/addons/cssresources/package.json b/addons/cssresources/package.json
index d24d336f087..cf41437f1e8 100644
--- a/addons/cssresources/package.json
+++ b/addons/cssresources/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-cssresources",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "description": "A storybook addon to switch between css resources at runtime for your story",
   "keywords": [
     "addon",
@@ -25,10 +25,10 @@
   },
   "dependencies": {
     "@emotion/styled": "10.0.6",
-    "@storybook/addons": "5.0.0-rc.3",
-    "@storybook/channels": "5.0.0-rc.3",
-    "@storybook/components": "5.0.0-rc.3",
-    "@storybook/core-events": "5.0.0-rc.3",
+    "@storybook/addons": "5.0.0-rc.4",
+    "@storybook/channels": "5.0.0-rc.4",
+    "@storybook/components": "5.0.0-rc.4",
+    "@storybook/core-events": "5.0.0-rc.4",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "prop-types": "^15.6.2",
diff --git a/addons/events/package.json b/addons/events/package.json
index bdacbf26391..f9673d76247 100644
--- a/addons/events/package.json
+++ b/addons/events/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-events",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "description": "Add events to your Storybook stories.",
   "keywords": [
     "addon",
@@ -23,9 +23,9 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.3",
-    "@storybook/core-events": "5.0.0-rc.3",
-    "@storybook/theming": "5.0.0-rc.3",
+    "@storybook/addons": "5.0.0-rc.4",
+    "@storybook/core-events": "5.0.0-rc.4",
+    "@storybook/theming": "5.0.0-rc.4",
     "core-js": "^2.6.2",
     "format-json": "^1.0.3",
     "prop-types": "^15.6.2",
diff --git a/addons/google-analytics/package.json b/addons/google-analytics/package.json
index f1774d0e256..88734626283 100644
--- a/addons/google-analytics/package.json
+++ b/addons/google-analytics/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-google-analytics",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "description": "Storybook addon for google analytics",
   "keywords": [
     "addon",
@@ -19,8 +19,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.3",
-    "@storybook/core-events": "5.0.0-rc.3",
+    "@storybook/addons": "5.0.0-rc.4",
+    "@storybook/core-events": "5.0.0-rc.4",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "react-ga": "^2.5.3"
diff --git a/addons/graphql/package.json b/addons/graphql/package.json
index daefb5087eb..771effc8c44 100644
--- a/addons/graphql/package.json
+++ b/addons/graphql/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-graphql",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "description": "Storybook addon to display the GraphiQL IDE",
   "keywords": [
     "addon",
diff --git a/addons/info/package.json b/addons/info/package.json
index 19890a8ba6b..03a942155cc 100644
--- a/addons/info/package.json
+++ b/addons/info/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-info",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "description": "A Storybook addon to show additional information for your stories.",
   "keywords": [
     "addon",
@@ -21,10 +21,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.3",
-    "@storybook/client-logger": "5.0.0-rc.3",
-    "@storybook/components": "5.0.0-rc.3",
-    "@storybook/theming": "5.0.0-rc.3",
+    "@storybook/addons": "5.0.0-rc.4",
+    "@storybook/client-logger": "5.0.0-rc.4",
+    "@storybook/components": "5.0.0-rc.4",
+    "@storybook/theming": "5.0.0-rc.4",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "marksy": "^6.1.0",
diff --git a/addons/jest/package.json b/addons/jest/package.json
index 7afceb0f2d4..f022be6e841 100644
--- a/addons/jest/package.json
+++ b/addons/jest/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-jest",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "description": "React storybook addon that show component jest report",
   "keywords": [
     "addon",
@@ -27,10 +27,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.3",
-    "@storybook/components": "5.0.0-rc.3",
-    "@storybook/core-events": "5.0.0-rc.3",
-    "@storybook/theming": "5.0.0-rc.3",
+    "@storybook/addons": "5.0.0-rc.4",
+    "@storybook/components": "5.0.0-rc.4",
+    "@storybook/core-events": "5.0.0-rc.4",
+    "@storybook/theming": "5.0.0-rc.4",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "prop-types": "^15.6.2",
diff --git a/addons/knobs/package.json b/addons/knobs/package.json
index 1bc9e688704..d2c4d40fea5 100644
--- a/addons/knobs/package.json
+++ b/addons/knobs/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-knobs",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "description": "Storybook Addon Prop Editor Component",
   "keywords": [
     "addon",
@@ -21,10 +21,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.3",
-    "@storybook/components": "5.0.0-rc.3",
-    "@storybook/core-events": "5.0.0-rc.3",
-    "@storybook/theming": "5.0.0-rc.3",
+    "@storybook/addons": "5.0.0-rc.4",
+    "@storybook/components": "5.0.0-rc.4",
+    "@storybook/core-events": "5.0.0-rc.4",
+    "@storybook/theming": "5.0.0-rc.4",
     "copy-to-clipboard": "^3.0.8",
     "core-js": "^2.6.2",
     "escape-html": "^1.0.3",
diff --git a/addons/links/package.json b/addons/links/package.json
index 5e71719764e..341e8aa542a 100644
--- a/addons/links/package.json
+++ b/addons/links/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-links",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "description": "Story Links addon for storybook",
   "keywords": [
     "addon",
@@ -21,8 +21,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.3",
-    "@storybook/core-events": "5.0.0-rc.3",
+    "@storybook/addons": "5.0.0-rc.4",
+    "@storybook/core-events": "5.0.0-rc.4",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/addons/notes/package.json b/addons/notes/package.json
index d88d52de0dc..c3cb4597c34 100644
--- a/addons/notes/package.json
+++ b/addons/notes/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-notes",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "description": "Write notes for your Storybook stories.",
   "keywords": [
     "addon",
@@ -22,11 +22,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.3",
-    "@storybook/client-logger": "5.0.0-rc.3",
-    "@storybook/components": "5.0.0-rc.3",
-    "@storybook/core-events": "5.0.0-rc.3",
-    "@storybook/theming": "5.0.0-rc.3",
+    "@storybook/addons": "5.0.0-rc.4",
+    "@storybook/client-logger": "5.0.0-rc.4",
+    "@storybook/components": "5.0.0-rc.4",
+    "@storybook/core-events": "5.0.0-rc.4",
+    "@storybook/theming": "5.0.0-rc.4",
     "markdown-to-jsx": "^6.9.1",
     "prop-types": "^15.6.2",
     "util-deprecate": "^1.0.2"
diff --git a/addons/options/package.json b/addons/options/package.json
index 3b0d90df3d1..bdbbc85969f 100644
--- a/addons/options/package.json
+++ b/addons/options/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-options",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "description": "Options addon for storybook",
   "keywords": [
     "addon",
@@ -20,7 +20,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.3",
+    "@storybook/addons": "5.0.0-rc.4",
     "core-js": "^2.6.2",
     "util-deprecate": "^1.0.2"
   },
diff --git a/addons/storyshots/storyshots-core/package.json b/addons/storyshots/storyshots-core/package.json
index e652515e9ff..f90f2a939b2 100644
--- a/addons/storyshots/storyshots-core/package.json
+++ b/addons/storyshots/storyshots-core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storyshots",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "description": "StoryShots is a Jest Snapshot Testing Addon for Storybook.",
   "keywords": [
     "addon",
@@ -24,7 +24,7 @@
     "storybook": "start-storybook -p 6006"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.3",
+    "@storybook/addons": "5.0.0-rc.4",
     "core-js": "^2.6.2",
     "glob": "^7.1.3",
     "global": "^4.3.2",
diff --git a/addons/storyshots/storyshots-puppeteer/package.json b/addons/storyshots/storyshots-puppeteer/package.json
index ce996dade11..4a731f0c0de 100644
--- a/addons/storyshots/storyshots-puppeteer/package.json
+++ b/addons/storyshots/storyshots-puppeteer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storyshots-puppeteer",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "description": "Image snappshots addition to StoryShots base on puppeteer",
   "keywords": [
     "addon",
@@ -21,8 +21,8 @@
     "prepare": "node ../../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/router": "5.0.0-rc.3",
-    "@storybook/node-logger": "5.0.0-rc.3",
+    "@storybook/node-logger": "5.0.0-rc.4",
+    "@storybook/router": "5.0.0-rc.4",
     "core-js": "^2.6.2",
     "jest-image-snapshot": "^2.6.0",
     "puppeteer": "^1.12.0",
diff --git a/addons/storysource/package.json b/addons/storysource/package.json
index 78ec404fbfd..81568756081 100644
--- a/addons/storysource/package.json
+++ b/addons/storysource/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storysource",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "description": "Stories addon for storybook",
   "keywords": [
     "addon",
@@ -21,10 +21,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.3",
-    "@storybook/components": "5.0.0-rc.3",
-    "@storybook/theming": "5.0.0-rc.3",
-    "@storybook/router": "5.0.0-rc.3",
+    "@storybook/addons": "5.0.0-rc.4",
+    "@storybook/components": "5.0.0-rc.4",
+    "@storybook/router": "5.0.0-rc.4",
+    "@storybook/theming": "5.0.0-rc.4",
     "core-js": "^2.6.2",
     "estraverse": "^4.2.0",
     "loader-utils": "^1.2.1",
diff --git a/addons/viewport/package.json b/addons/viewport/package.json
index 45bf2244c6c..83b0716a667 100644
--- a/addons/viewport/package.json
+++ b/addons/viewport/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-viewport",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "description": "Storybook addon to change the viewport size to mobile",
   "keywords": [
     "addon",
@@ -20,11 +20,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.3",
-    "@storybook/client-logger": "5.0.0-rc.3",
-    "@storybook/components": "5.0.0-rc.3",
-    "@storybook/core-events": "5.0.0-rc.3",
-    "@storybook/theming": "5.0.0-rc.3",
+    "@storybook/addons": "5.0.0-rc.4",
+    "@storybook/client-logger": "5.0.0-rc.4",
+    "@storybook/components": "5.0.0-rc.4",
+    "@storybook/core-events": "5.0.0-rc.4",
+    "@storybook/theming": "5.0.0-rc.4",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
diff --git a/app/angular/package.json b/app/angular/package.json
index 068a52d191f..9e837b23df4 100644
--- a/app/angular/package.json
+++ b/app/angular/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/angular",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "description": "Storybook for Angular: Develop Angular Components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,8 +25,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.3",
-    "@storybook/node-logger": "5.0.0-rc.3",
+    "@storybook/core": "5.0.0-rc.4",
+    "@storybook/node-logger": "5.0.0-rc.4",
     "angular2-template-loader": "^0.6.2",
     "core-js": "^2.6.2",
     "fork-ts-checker-webpack-plugin": "^0.5.2",
diff --git a/app/ember/package.json b/app/ember/package.json
index b1bf12dca20..98b98590b4c 100644
--- a/app/ember/package.json
+++ b/app/ember/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/ember",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "description": "Storybook for Ember: Develop Ember Component in isolation with Hot Reloading.",
   "homepage": "https://github.com/storybooks/storybook/tree/master/app/ember",
   "bugs": {
@@ -23,7 +23,7 @@
   },
   "dependencies": {
     "@ember/test-helpers": "^1.3.1",
-    "@storybook/core": "5.0.0-rc.3",
+    "@storybook/core": "5.0.0-rc.4",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/html/package.json b/app/html/package.json
index 780c33ca915..ef817d21684 100644
--- a/app/html/package.json
+++ b/app/html/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/html",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "description": "Storybook for HTML: View HTML snippets in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.3",
+    "@storybook/core": "5.0.0-rc.4",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/marko/package.json b/app/marko/package.json
index 203c11e7560..666234b2bfa 100644
--- a/app/marko/package.json
+++ b/app/marko/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/marko",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "description": "Storybook for Marko: Develop Marko Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.3",
+    "@storybook/core": "5.0.0-rc.4",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/mithril/package.json b/app/mithril/package.json
index 0138f1751fa..a4cff431bbe 100644
--- a/app/mithril/package.json
+++ b/app/mithril/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/mithril",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "description": "Storybook for Mithril: Develop Mithril Component in isolation.",
   "keywords": [
     "storybook"
@@ -26,7 +26,7 @@
   },
   "dependencies": {
     "@babel/plugin-transform-react-jsx": "^7.3.0",
-    "@storybook/core": "5.0.0-rc.3",
+    "@storybook/core": "5.0.0-rc.4",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/polymer/package.json b/app/polymer/package.json
index 991de64e93b..e6a4d73b216 100644
--- a/app/polymer/package.json
+++ b/app/polymer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/polymer",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "description": "Storybook for Polymer: Develop Polymer components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.3",
+    "@storybook/core": "5.0.0-rc.4",
     "@webcomponents/webcomponentsjs": "^1.2.0",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
diff --git a/app/preact/package.json b/app/preact/package.json
index 2953ac6902c..b610ef17a71 100644
--- a/app/preact/package.json
+++ b/app/preact/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/preact",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "description": "Storybook for Preact: Develop Preact Component in isolation.",
   "keywords": [
     "storybook"
@@ -26,7 +26,7 @@
   },
   "dependencies": {
     "@babel/plugin-transform-react-jsx": "^7.3.0",
-    "@storybook/core": "5.0.0-rc.3",
+    "@storybook/core": "5.0.0-rc.4",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/react/package.json b/app/react/package.json
index 0d68d71b611..dcd5902086c 100644
--- a/app/react/package.json
+++ b/app/react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/react",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "description": "Storybook for React: Develop React Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -28,9 +28,9 @@
     "@babel/plugin-transform-react-constant-elements": "^7.2.0",
     "@babel/preset-flow": "^7.0.0",
     "@babel/preset-react": "^7.0.0",
-    "@storybook/core": "5.0.0-rc.3",
-    "@storybook/node-logger": "5.0.0-rc.3",
-    "@storybook/theming": "5.0.0-rc.3",
+    "@storybook/core": "5.0.0-rc.4",
+    "@storybook/node-logger": "5.0.0-rc.4",
+    "@storybook/theming": "5.0.0-rc.4",
     "@svgr/webpack": "^4.0.3",
     "babel-plugin-named-asset-import": "^0.3.0",
     "babel-plugin-react-docgen": "^2.0.2",
diff --git a/app/riot/package.json b/app/riot/package.json
index d925923093e..5a8c1cbdfa7 100644
--- a/app/riot/package.json
+++ b/app/riot/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/riot",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "description": "Storybook for riot.js: View riot snippets in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.3",
+    "@storybook/core": "5.0.0-rc.4",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/svelte/package.json b/app/svelte/package.json
index 8630a62007f..18e0163b3a1 100644
--- a/app/svelte/package.json
+++ b/app/svelte/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/svelte",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "description": "Storybook for Svelte: Develop Svelte Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.3",
+    "@storybook/core": "5.0.0-rc.4",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/vue/package.json b/app/vue/package.json
index 0640e5ba7ed..e98ee0711a4 100644
--- a/app/vue/package.json
+++ b/app/vue/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/vue",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "description": "Storybook for Vue: Develop Vue Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.3",
+    "@storybook/core": "5.0.0-rc.4",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/examples/angular-cli/package.json b/examples/angular-cli/package.json
index c5787f12999..ec08b87f381 100644
--- a/examples/angular-cli/package.json
+++ b/examples/angular-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "angular-cli",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "private": true,
   "license": "MIT",
   "scripts": {
@@ -33,18 +33,18 @@
     "@angular-devkit/build-angular": "^0.11.4",
     "@angular/cli": "^7.3.0",
     "@angular/compiler-cli": "^7.2.1",
-    "@storybook/addon-actions": "5.0.0-rc.3",
-    "@storybook/addon-backgrounds": "5.0.0-rc.3",
-    "@storybook/addon-centered": "5.0.0-rc.3",
-    "@storybook/addon-jest": "5.0.0-rc.3",
-    "@storybook/addon-knobs": "5.0.0-rc.3",
-    "@storybook/addon-links": "5.0.0-rc.3",
-    "@storybook/addon-notes": "5.0.0-rc.3",
-    "@storybook/addon-options": "5.0.0-rc.3",
-    "@storybook/addon-storyshots": "5.0.0-rc.3",
-    "@storybook/addon-storysource": "5.0.0-rc.3",
-    "@storybook/addons": "5.0.0-rc.3",
-    "@storybook/angular": "5.0.0-rc.3",
+    "@storybook/addon-actions": "5.0.0-rc.4",
+    "@storybook/addon-backgrounds": "5.0.0-rc.4",
+    "@storybook/addon-centered": "5.0.0-rc.4",
+    "@storybook/addon-jest": "5.0.0-rc.4",
+    "@storybook/addon-knobs": "5.0.0-rc.4",
+    "@storybook/addon-links": "5.0.0-rc.4",
+    "@storybook/addon-notes": "5.0.0-rc.4",
+    "@storybook/addon-options": "5.0.0-rc.4",
+    "@storybook/addon-storyshots": "5.0.0-rc.4",
+    "@storybook/addon-storysource": "5.0.0-rc.4",
+    "@storybook/addons": "5.0.0-rc.4",
+    "@storybook/angular": "5.0.0-rc.4",
     "@types/core-js": "^2.5.0",
     "@types/jest": "^23.3.13",
     "@types/node": "~10.12.19",
diff --git a/examples/cra-kitchen-sink/package.json b/examples/cra-kitchen-sink/package.json
index e29eb57cd80..86744fae540 100644
--- a/examples/cra-kitchen-sink/package.json
+++ b/examples/cra-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "cra-kitchen-sink",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "private": true,
   "scripts": {
     "build": "react-scripts build",
@@ -18,21 +18,21 @@
     "react-lifecycles-compat": "^3.0.4"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.0.0-rc.3",
-    "@storybook/addon-actions": "5.0.0-rc.3",
-    "@storybook/addon-backgrounds": "5.0.0-rc.3",
-    "@storybook/addon-centered": "5.0.0-rc.3",
-    "@storybook/addon-events": "5.0.0-rc.3",
-    "@storybook/addon-info": "5.0.0-rc.3",
-    "@storybook/addon-jest": "5.0.0-rc.3",
-    "@storybook/addon-knobs": "5.0.0-rc.3",
-    "@storybook/addon-links": "5.0.0-rc.3",
-    "@storybook/addon-notes": "5.0.0-rc.3",
-    "@storybook/addon-options": "5.0.0-rc.3",
-    "@storybook/addon-storyshots": "5.0.0-rc.3",
-    "@storybook/addons": "5.0.0-rc.3",
-    "@storybook/client-logger": "5.0.0-rc.3",
-    "@storybook/react": "5.0.0-rc.3",
+    "@storybook/addon-a11y": "5.0.0-rc.4",
+    "@storybook/addon-actions": "5.0.0-rc.4",
+    "@storybook/addon-backgrounds": "5.0.0-rc.4",
+    "@storybook/addon-centered": "5.0.0-rc.4",
+    "@storybook/addon-events": "5.0.0-rc.4",
+    "@storybook/addon-info": "5.0.0-rc.4",
+    "@storybook/addon-jest": "5.0.0-rc.4",
+    "@storybook/addon-knobs": "5.0.0-rc.4",
+    "@storybook/addon-links": "5.0.0-rc.4",
+    "@storybook/addon-notes": "5.0.0-rc.4",
+    "@storybook/addon-options": "5.0.0-rc.4",
+    "@storybook/addon-storyshots": "5.0.0-rc.4",
+    "@storybook/addons": "5.0.0-rc.4",
+    "@storybook/client-logger": "5.0.0-rc.4",
+    "@storybook/react": "5.0.0-rc.4",
     "enzyme": "^3.7.0",
     "enzyme-adapter-react-16": "^1.9.1",
     "enzyme-to-json": "^3.3.4",
diff --git a/examples/cra-ts-kitchen-sink/package.json b/examples/cra-ts-kitchen-sink/package.json
index b67c6100064..cca7a263773 100644
--- a/examples/cra-ts-kitchen-sink/package.json
+++ b/examples/cra-ts-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "cra-ts-kitchen-sink",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook -s public",
@@ -19,11 +19,11 @@
     "react-dom": "^16.8.1"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.3",
-    "@storybook/addon-info": "5.0.0-rc.3",
-    "@storybook/addon-options": "5.0.0-rc.3",
-    "@storybook/addons": "5.0.0-rc.3",
-    "@storybook/react": "5.0.0-rc.3",
+    "@storybook/addon-actions": "5.0.0-rc.4",
+    "@storybook/addon-info": "5.0.0-rc.4",
+    "@storybook/addon-options": "5.0.0-rc.4",
+    "@storybook/addons": "5.0.0-rc.4",
+    "@storybook/react": "5.0.0-rc.4",
     "@types/enzyme": "^3.1.15",
     "@types/react": "^16.7.22",
     "@types/react-dom": "^16.0.11",
diff --git a/examples/ember-cli/package.json b/examples/ember-cli/package.json
index b14aea9a0da..74f3c5a7728 100644
--- a/examples/ember-cli/package.json
+++ b/examples/ember-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "ember-example",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "private": true,
   "scripts": {
     "build": "ember build",
@@ -14,18 +14,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.2.2",
-    "@storybook/addon-a11y": "5.0.0-rc.3",
-    "@storybook/addon-actions": "5.0.0-rc.3",
-    "@storybook/addon-backgrounds": "5.0.0-rc.3",
-    "@storybook/addon-centered": "5.0.0-rc.3",
-    "@storybook/addon-knobs": "5.0.0-rc.3",
-    "@storybook/addon-links": "5.0.0-rc.3",
-    "@storybook/addon-notes": "5.0.0-rc.3",
-    "@storybook/addon-options": "5.0.0-rc.3",
-    "@storybook/addon-storysource": "5.0.0-rc.3",
-    "@storybook/addon-viewport": "5.0.0-rc.3",
-    "@storybook/addons": "5.0.0-rc.3",
-    "@storybook/ember": "5.0.0-rc.3",
+    "@storybook/addon-a11y": "5.0.0-rc.4",
+    "@storybook/addon-actions": "5.0.0-rc.4",
+    "@storybook/addon-backgrounds": "5.0.0-rc.4",
+    "@storybook/addon-centered": "5.0.0-rc.4",
+    "@storybook/addon-knobs": "5.0.0-rc.4",
+    "@storybook/addon-links": "5.0.0-rc.4",
+    "@storybook/addon-notes": "5.0.0-rc.4",
+    "@storybook/addon-options": "5.0.0-rc.4",
+    "@storybook/addon-storysource": "5.0.0-rc.4",
+    "@storybook/addon-viewport": "5.0.0-rc.4",
+    "@storybook/addons": "5.0.0-rc.4",
+    "@storybook/ember": "5.0.0-rc.4",
     "babel-loader": "^8",
     "broccoli-asset-rev": "^3.0.0",
     "cross-env": "^5.2.0",
diff --git a/examples/html-kitchen-sink/package.json b/examples/html-kitchen-sink/package.json
index b062d2d2a1e..36240f02ed0 100644
--- a/examples/html-kitchen-sink/package.json
+++ b/examples/html-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "html-kitchen-sink",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "private": true,
   "description": "",
   "keywords": [],
@@ -13,23 +13,23 @@
     "storybook": "start-storybook -p 9006"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.0.0-rc.3",
-    "@storybook/addon-actions": "5.0.0-rc.3",
-    "@storybook/addon-backgrounds": "5.0.0-rc.3",
-    "@storybook/addon-centered": "5.0.0-rc.3",
-    "@storybook/addon-events": "5.0.0-rc.3",
-    "@storybook/addon-jest": "5.0.0-rc.3",
-    "@storybook/addon-knobs": "5.0.0-rc.3",
-    "@storybook/addon-links": "5.0.0-rc.3",
-    "@storybook/addon-notes": "5.0.0-rc.3",
-    "@storybook/addon-options": "5.0.0-rc.3",
-    "@storybook/addon-storyshots": "5.0.0-rc.3",
-    "@storybook/addon-storysource": "5.0.0-rc.3",
-    "@storybook/addon-viewport": "5.0.0-rc.3",
-    "@storybook/addons": "5.0.0-rc.3",
-    "@storybook/core": "5.0.0-rc.3",
-    "@storybook/core-events": "5.0.0-rc.3",
-    "@storybook/html": "5.0.0-rc.3",
+    "@storybook/addon-a11y": "5.0.0-rc.4",
+    "@storybook/addon-actions": "5.0.0-rc.4",
+    "@storybook/addon-backgrounds": "5.0.0-rc.4",
+    "@storybook/addon-centered": "5.0.0-rc.4",
+    "@storybook/addon-events": "5.0.0-rc.4",
+    "@storybook/addon-jest": "5.0.0-rc.4",
+    "@storybook/addon-knobs": "5.0.0-rc.4",
+    "@storybook/addon-links": "5.0.0-rc.4",
+    "@storybook/addon-notes": "5.0.0-rc.4",
+    "@storybook/addon-options": "5.0.0-rc.4",
+    "@storybook/addon-storyshots": "5.0.0-rc.4",
+    "@storybook/addon-storysource": "5.0.0-rc.4",
+    "@storybook/addon-viewport": "5.0.0-rc.4",
+    "@storybook/addons": "5.0.0-rc.4",
+    "@storybook/core": "5.0.0-rc.4",
+    "@storybook/core-events": "5.0.0-rc.4",
+    "@storybook/html": "5.0.0-rc.4",
     "eventemitter3": "^3.1.0",
     "format-json": "^1.0.3",
     "global": "^4.3.2",
diff --git a/examples/marko-cli/package.json b/examples/marko-cli/package.json
index 302f8738504..9bf5108bcaf 100644
--- a/examples/marko-cli/package.json
+++ b/examples/marko-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "marko-cli",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "private": true,
   "description": "Demo of how to build an app using marko-starter",
   "repository": {
@@ -22,12 +22,12 @@
     "marko-starter": "^2.0.4"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.3",
-    "@storybook/addon-knobs": "5.0.0-rc.3",
-    "@storybook/addon-options": "5.0.0-rc.3",
-    "@storybook/addon-storysource": "5.0.0-rc.3",
-    "@storybook/addons": "5.0.0-rc.3",
-    "@storybook/marko": "5.0.0-rc.3",
+    "@storybook/addon-actions": "5.0.0-rc.4",
+    "@storybook/addon-knobs": "5.0.0-rc.4",
+    "@storybook/addon-options": "5.0.0-rc.4",
+    "@storybook/addon-storysource": "5.0.0-rc.4",
+    "@storybook/addons": "5.0.0-rc.4",
+    "@storybook/marko": "5.0.0-rc.4",
     "prettier": "^1.16.4",
     "webpack": "^4.29.0"
   }
diff --git a/examples/mithril-kitchen-sink/package.json b/examples/mithril-kitchen-sink/package.json
index a634f29ae3a..4aa17d99435 100644
--- a/examples/mithril-kitchen-sink/package.json
+++ b/examples/mithril-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "mithril-example",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook",
@@ -10,18 +10,18 @@
     "mithril": "^1.1.6"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.3",
-    "@storybook/addon-backgrounds": "5.0.0-rc.3",
-    "@storybook/addon-centered": "5.0.0-rc.3",
-    "@storybook/addon-knobs": "5.0.0-rc.3",
-    "@storybook/addon-links": "5.0.0-rc.3",
-    "@storybook/addon-notes": "5.0.0-rc.3",
-    "@storybook/addon-options": "5.0.0-rc.3",
-    "@storybook/addon-storyshots": "5.0.0-rc.3",
-    "@storybook/addon-storysource": "5.0.0-rc.3",
-    "@storybook/addon-viewport": "5.0.0-rc.3",
-    "@storybook/addons": "5.0.0-rc.3",
-    "@storybook/mithril": "5.0.0-rc.3",
+    "@storybook/addon-actions": "5.0.0-rc.4",
+    "@storybook/addon-backgrounds": "5.0.0-rc.4",
+    "@storybook/addon-centered": "5.0.0-rc.4",
+    "@storybook/addon-knobs": "5.0.0-rc.4",
+    "@storybook/addon-links": "5.0.0-rc.4",
+    "@storybook/addon-notes": "5.0.0-rc.4",
+    "@storybook/addon-options": "5.0.0-rc.4",
+    "@storybook/addon-storyshots": "5.0.0-rc.4",
+    "@storybook/addon-storysource": "5.0.0-rc.4",
+    "@storybook/addon-viewport": "5.0.0-rc.4",
+    "@storybook/addons": "5.0.0-rc.4",
+    "@storybook/mithril": "5.0.0-rc.4",
     "webpack": "^4.29.0"
   }
 }
diff --git a/examples/official-storybook/package.json b/examples/official-storybook/package.json
index 84fa8286ebb..0643ca8f674 100644
--- a/examples/official-storybook/package.json
+++ b/examples/official-storybook/package.json
@@ -1,6 +1,6 @@
 {
   "name": "official-storybook",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook -c ./ -s built-storybooks",
@@ -12,29 +12,29 @@
     "storybook": "cross-env STORYBOOK_DISPLAY_WARNING=true DISPLAY_WARNING=true start-storybook -p 9011 -c ./ -s built-storybooks --no-dll"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.0.0-rc.3",
-    "@storybook/addon-actions": "5.0.0-rc.3",
-    "@storybook/addon-backgrounds": "5.0.0-rc.3",
-    "@storybook/addon-centered": "5.0.0-rc.3",
-    "@storybook/addon-cssresources": "5.0.0-rc.3",
-    "@storybook/addon-events": "5.0.0-rc.3",
-    "@storybook/addon-graphql": "5.0.0-rc.3",
-    "@storybook/addon-info": "5.0.0-rc.3",
-    "@storybook/addon-jest": "5.0.0-rc.3",
-    "@storybook/addon-knobs": "5.0.0-rc.3",
-    "@storybook/addon-links": "5.0.0-rc.3",
-    "@storybook/addon-notes": "5.0.0-rc.3",
-    "@storybook/addon-options": "5.0.0-rc.3",
-    "@storybook/addon-storyshots": "5.0.0-rc.3",
-    "@storybook/addon-storyshots-puppeteer": "5.0.0-rc.3",
-    "@storybook/addon-storysource": "5.0.0-rc.3",
-    "@storybook/addon-viewport": "5.0.0-rc.3",
-    "@storybook/addons": "5.0.0-rc.3",
-    "@storybook/components": "5.0.0-rc.3",
-    "@storybook/core-events": "5.0.0-rc.3",
-    "@storybook/node-logger": "5.0.0-rc.3",
-    "@storybook/react": "5.0.0-rc.3",
-    "@storybook/theming": "5.0.0-rc.3",
+    "@storybook/addon-a11y": "5.0.0-rc.4",
+    "@storybook/addon-actions": "5.0.0-rc.4",
+    "@storybook/addon-backgrounds": "5.0.0-rc.4",
+    "@storybook/addon-centered": "5.0.0-rc.4",
+    "@storybook/addon-cssresources": "5.0.0-rc.4",
+    "@storybook/addon-events": "5.0.0-rc.4",
+    "@storybook/addon-graphql": "5.0.0-rc.4",
+    "@storybook/addon-info": "5.0.0-rc.4",
+    "@storybook/addon-jest": "5.0.0-rc.4",
+    "@storybook/addon-knobs": "5.0.0-rc.4",
+    "@storybook/addon-links": "5.0.0-rc.4",
+    "@storybook/addon-notes": "5.0.0-rc.4",
+    "@storybook/addon-options": "5.0.0-rc.4",
+    "@storybook/addon-storyshots": "5.0.0-rc.4",
+    "@storybook/addon-storyshots-puppeteer": "5.0.0-rc.4",
+    "@storybook/addon-storysource": "5.0.0-rc.4",
+    "@storybook/addon-viewport": "5.0.0-rc.4",
+    "@storybook/addons": "5.0.0-rc.4",
+    "@storybook/components": "5.0.0-rc.4",
+    "@storybook/core-events": "5.0.0-rc.4",
+    "@storybook/node-logger": "5.0.0-rc.4",
+    "@storybook/react": "5.0.0-rc.4",
+    "@storybook/theming": "5.0.0-rc.4",
     "cors": "^2.8.4",
     "cross-env": "^5.2.0",
     "enzyme-to-json": "^3.3.4",
diff --git a/examples/polymer-cli/package.json b/examples/polymer-cli/package.json
index cef11cfc870..b52985b7eea 100644
--- a/examples/polymer-cli/package.json
+++ b/examples/polymer-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "polymer-cli",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook",
@@ -9,15 +9,15 @@
   },
   "dependencies": {
     "@polymer/polymer": "^2.6.0",
-    "@storybook/addon-actions": "5.0.0-rc.3",
-    "@storybook/addon-backgrounds": "5.0.0-rc.3",
-    "@storybook/addon-knobs": "5.0.0-rc.3",
-    "@storybook/addon-links": "5.0.0-rc.3",
-    "@storybook/addon-notes": "5.0.0-rc.3",
-    "@storybook/addon-options": "5.0.0-rc.3",
-    "@storybook/addon-storysource": "5.0.0-rc.3",
-    "@storybook/addon-viewport": "5.0.0-rc.3",
-    "@storybook/polymer": "5.0.0-rc.3",
+    "@storybook/addon-actions": "5.0.0-rc.4",
+    "@storybook/addon-backgrounds": "5.0.0-rc.4",
+    "@storybook/addon-knobs": "5.0.0-rc.4",
+    "@storybook/addon-links": "5.0.0-rc.4",
+    "@storybook/addon-notes": "5.0.0-rc.4",
+    "@storybook/addon-options": "5.0.0-rc.4",
+    "@storybook/addon-storysource": "5.0.0-rc.4",
+    "@storybook/addon-viewport": "5.0.0-rc.4",
+    "@storybook/polymer": "5.0.0-rc.4",
     "@webcomponents/webcomponentsjs": "^1.2.0",
     "global": "^4.3.2",
     "lit-html": "^1.0.0",
diff --git a/examples/preact-kitchen-sink/package.json b/examples/preact-kitchen-sink/package.json
index 5c9e0496af3..a3f3d5ec4b7 100644
--- a/examples/preact-kitchen-sink/package.json
+++ b/examples/preact-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "preact-example",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "private": true,
   "scripts": {
     "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
@@ -15,18 +15,18 @@
   "devDependencies": {
     "@babel/core": "^7.2.2",
     "@babel/plugin-transform-runtime": "^7.2.0",
-    "@storybook/addon-actions": "5.0.0-rc.3",
-    "@storybook/addon-backgrounds": "5.0.0-rc.3",
-    "@storybook/addon-centered": "5.0.0-rc.3",
-    "@storybook/addon-knobs": "5.0.0-rc.3",
-    "@storybook/addon-links": "5.0.0-rc.3",
-    "@storybook/addon-notes": "5.0.0-rc.3",
-    "@storybook/addon-options": "5.0.0-rc.3",
-    "@storybook/addon-storyshots": "5.0.0-rc.3",
-    "@storybook/addon-storysource": "5.0.0-rc.3",
-    "@storybook/addon-viewport": "5.0.0-rc.3",
-    "@storybook/addons": "5.0.0-rc.3",
-    "@storybook/preact": "5.0.0-rc.3",
+    "@storybook/addon-actions": "5.0.0-rc.4",
+    "@storybook/addon-backgrounds": "5.0.0-rc.4",
+    "@storybook/addon-centered": "5.0.0-rc.4",
+    "@storybook/addon-knobs": "5.0.0-rc.4",
+    "@storybook/addon-links": "5.0.0-rc.4",
+    "@storybook/addon-notes": "5.0.0-rc.4",
+    "@storybook/addon-options": "5.0.0-rc.4",
+    "@storybook/addon-storyshots": "5.0.0-rc.4",
+    "@storybook/addon-storysource": "5.0.0-rc.4",
+    "@storybook/addon-viewport": "5.0.0-rc.4",
+    "@storybook/addons": "5.0.0-rc.4",
+    "@storybook/preact": "5.0.0-rc.4",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
     "file-loader": "^3.0.1",
diff --git a/examples/riot-kitchen-sink/package.json b/examples/riot-kitchen-sink/package.json
index efc60093565..813ce48ed4d 100644
--- a/examples/riot-kitchen-sink/package.json
+++ b/examples/riot-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "riot-example",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "private": true,
   "scripts": {
     "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
@@ -15,18 +15,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.2.2",
-    "@storybook/addon-actions": "5.0.0-rc.3",
-    "@storybook/addon-backgrounds": "5.0.0-rc.3",
-    "@storybook/addon-centered": "5.0.0-rc.3",
-    "@storybook/addon-knobs": "5.0.0-rc.3",
-    "@storybook/addon-links": "5.0.0-rc.3",
-    "@storybook/addon-notes": "5.0.0-rc.3",
-    "@storybook/addon-options": "5.0.0-rc.3",
-    "@storybook/addon-storyshots": "5.0.0-rc.3",
-    "@storybook/addon-storysource": "5.0.0-rc.3",
-    "@storybook/addon-viewport": "5.0.0-rc.3",
-    "@storybook/addons": "5.0.0-rc.3",
-    "@storybook/riot": "5.0.0-rc.3",
+    "@storybook/addon-actions": "5.0.0-rc.4",
+    "@storybook/addon-backgrounds": "5.0.0-rc.4",
+    "@storybook/addon-centered": "5.0.0-rc.4",
+    "@storybook/addon-knobs": "5.0.0-rc.4",
+    "@storybook/addon-links": "5.0.0-rc.4",
+    "@storybook/addon-notes": "5.0.0-rc.4",
+    "@storybook/addon-options": "5.0.0-rc.4",
+    "@storybook/addon-storyshots": "5.0.0-rc.4",
+    "@storybook/addon-storysource": "5.0.0-rc.4",
+    "@storybook/addon-viewport": "5.0.0-rc.4",
+    "@storybook/addons": "5.0.0-rc.4",
+    "@storybook/riot": "5.0.0-rc.4",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
     "file-loader": "^3.0.1",
diff --git a/examples/svelte-kitchen-sink/package.json b/examples/svelte-kitchen-sink/package.json
index 5cc7e64f93a..c744cdca6da 100644
--- a/examples/svelte-kitchen-sink/package.json
+++ b/examples/svelte-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "svelte-example",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook -s public",
@@ -10,17 +10,17 @@
     "global": "^4.3.2"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.3",
-    "@storybook/addon-backgrounds": "5.0.0-rc.3",
-    "@storybook/addon-centered": "5.0.0-rc.3",
-    "@storybook/addon-knobs": "5.0.0-rc.3",
-    "@storybook/addon-links": "5.0.0-rc.3",
-    "@storybook/addon-notes": "5.0.0-rc.3",
-    "@storybook/addon-options": "5.0.0-rc.3",
-    "@storybook/addon-storyshots": "5.0.0-rc.3",
-    "@storybook/addon-storysource": "5.0.0-rc.3",
-    "@storybook/addon-viewport": "5.0.0-rc.3",
-    "@storybook/addons": "5.0.0-rc.3",
-    "@storybook/svelte": "5.0.0-rc.3"
+    "@storybook/addon-actions": "5.0.0-rc.4",
+    "@storybook/addon-backgrounds": "5.0.0-rc.4",
+    "@storybook/addon-centered": "5.0.0-rc.4",
+    "@storybook/addon-knobs": "5.0.0-rc.4",
+    "@storybook/addon-links": "5.0.0-rc.4",
+    "@storybook/addon-notes": "5.0.0-rc.4",
+    "@storybook/addon-options": "5.0.0-rc.4",
+    "@storybook/addon-storyshots": "5.0.0-rc.4",
+    "@storybook/addon-storysource": "5.0.0-rc.4",
+    "@storybook/addon-viewport": "5.0.0-rc.4",
+    "@storybook/addons": "5.0.0-rc.4",
+    "@storybook/svelte": "5.0.0-rc.4"
   }
 }
diff --git a/examples/vue-kitchen-sink/package.json b/examples/vue-kitchen-sink/package.json
index aed5a1b00af..8ce64a184db 100644
--- a/examples/vue-kitchen-sink/package.json
+++ b/examples/vue-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "vue-example",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "private": true,
   "scripts": {
     "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
@@ -14,18 +14,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.2.2",
-    "@storybook/addon-actions": "5.0.0-rc.3",
-    "@storybook/addon-backgrounds": "5.0.0-rc.3",
-    "@storybook/addon-centered": "5.0.0-rc.3",
-    "@storybook/addon-knobs": "5.0.0-rc.3",
-    "@storybook/addon-links": "5.0.0-rc.3",
-    "@storybook/addon-notes": "5.0.0-rc.3",
-    "@storybook/addon-options": "5.0.0-rc.3",
-    "@storybook/addon-storyshots": "5.0.0-rc.3",
-    "@storybook/addon-storysource": "5.0.0-rc.3",
-    "@storybook/addon-viewport": "5.0.0-rc.3",
-    "@storybook/addons": "5.0.0-rc.3",
-    "@storybook/vue": "5.0.0-rc.3",
+    "@storybook/addon-actions": "5.0.0-rc.4",
+    "@storybook/addon-backgrounds": "5.0.0-rc.4",
+    "@storybook/addon-centered": "5.0.0-rc.4",
+    "@storybook/addon-knobs": "5.0.0-rc.4",
+    "@storybook/addon-links": "5.0.0-rc.4",
+    "@storybook/addon-notes": "5.0.0-rc.4",
+    "@storybook/addon-options": "5.0.0-rc.4",
+    "@storybook/addon-storyshots": "5.0.0-rc.4",
+    "@storybook/addon-storysource": "5.0.0-rc.4",
+    "@storybook/addon-viewport": "5.0.0-rc.4",
+    "@storybook/addons": "5.0.0-rc.4",
+    "@storybook/vue": "5.0.0-rc.4",
     "babel-core": "^7.0.0-bridge.0",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
diff --git a/lerna.json b/lerna.json
index 3018b0720ea..7805559a3d0 100644
--- a/lerna.json
+++ b/lerna.json
@@ -11,5 +11,5 @@
   "npmClient": "yarn",
   "useWorkspaces": true,
   "registry": "https://registry.npmjs.org",
-  "version": "5.0.0-rc.3"
+  "version": "5.0.0-rc.4"
 }
diff --git a/lib/addons/package.json b/lib/addons/package.json
index 3e8fd598521..6d643e86475 100644
--- a/lib/addons/package.json
+++ b/lib/addons/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addons",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "description": "Storybook addons store",
   "keywords": [
     "storybook"
@@ -20,8 +20,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.0.0-rc.3",
-    "@storybook/client-logger": "5.0.0-rc.3",
+    "@storybook/channels": "5.0.0-rc.4",
+    "@storybook/client-logger": "5.0.0-rc.4",
     "global": "^4.3.2",
     "util-deprecate": "^1.0.2"
   },
diff --git a/lib/channel-postmessage/package.json b/lib/channel-postmessage/package.json
index c05cc46e103..eb73a9c0daa 100644
--- a/lib/channel-postmessage/package.json
+++ b/lib/channel-postmessage/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channel-postmessage",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "description": "",
   "keywords": [
     "storybook"
@@ -20,7 +20,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.0.0-rc.3",
+    "@storybook/channels": "5.0.0-rc.4",
     "global": "^4.3.2",
     "telejson": "^1.0.1"
   },
diff --git a/lib/channel-websocket/package.json b/lib/channel-websocket/package.json
index 38b69b44ab2..85a335f0615 100644
--- a/lib/channel-websocket/package.json
+++ b/lib/channel-websocket/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channel-websocket",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "description": "",
   "keywords": [
     "storybook"
@@ -20,7 +20,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.0.0-rc.3",
+    "@storybook/channels": "5.0.0-rc.4",
     "global": "^4.3.2",
     "json-fn": "^1.1.1"
   },
diff --git a/lib/channels/package.json b/lib/channels/package.json
index 85c0c744a9c..d542aad56c1 100644
--- a/lib/channels/package.json
+++ b/lib/channels/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channels",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/cli/package.json b/lib/cli/package.json
index 16a449a2d0b..ef1780c63d4 100644
--- a/lib/cli/package.json
+++ b/lib/cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/cli",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "description": "Storybook's CLI - easiest method of adding storybook to your projects",
   "keywords": [
     "cli",
@@ -29,7 +29,7 @@
     "@babel/core": "^7.2.2",
     "@babel/preset-env": "^7.3.1",
     "@babel/register": "^7.0.0",
-    "@storybook/codemod": "5.0.0-rc.3",
+    "@storybook/codemod": "5.0.0-rc.4",
     "chalk": "^2.4.1",
     "commander": "^2.19.0",
     "core-js": "^2.6.2",
@@ -43,31 +43,31 @@
     "update-notifier": "^2.5.0"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.3",
-    "@storybook/addon-centered": "5.0.0-rc.3",
-    "@storybook/addon-graphql": "5.0.0-rc.3",
-    "@storybook/addon-info": "5.0.0-rc.3",
-    "@storybook/addon-knobs": "5.0.0-rc.3",
-    "@storybook/addon-links": "5.0.0-rc.3",
-    "@storybook/addon-notes": "5.0.0-rc.3",
-    "@storybook/addon-options": "5.0.0-rc.3",
-    "@storybook/addon-storyshots": "5.0.0-rc.3",
-    "@storybook/addons": "5.0.0-rc.3",
-    "@storybook/angular": "5.0.0-rc.3",
-    "@storybook/channel-postmessage": "5.0.0-rc.3",
-    "@storybook/channel-websocket": "5.0.0-rc.3",
-    "@storybook/channels": "5.0.0-rc.3",
-    "@storybook/ember": "5.0.0-rc.3",
-    "@storybook/html": "5.0.0-rc.3",
-    "@storybook/marko": "5.0.0-rc.3",
-    "@storybook/mithril": "5.0.0-rc.3",
-    "@storybook/polymer": "5.0.0-rc.3",
-    "@storybook/preact": "5.0.0-rc.3",
-    "@storybook/react": "5.0.0-rc.3",
+    "@storybook/addon-actions": "5.0.0-rc.4",
+    "@storybook/addon-centered": "5.0.0-rc.4",
+    "@storybook/addon-graphql": "5.0.0-rc.4",
+    "@storybook/addon-info": "5.0.0-rc.4",
+    "@storybook/addon-knobs": "5.0.0-rc.4",
+    "@storybook/addon-links": "5.0.0-rc.4",
+    "@storybook/addon-notes": "5.0.0-rc.4",
+    "@storybook/addon-options": "5.0.0-rc.4",
+    "@storybook/addon-storyshots": "5.0.0-rc.4",
+    "@storybook/addons": "5.0.0-rc.4",
+    "@storybook/angular": "5.0.0-rc.4",
+    "@storybook/channel-postmessage": "5.0.0-rc.4",
+    "@storybook/channel-websocket": "5.0.0-rc.4",
+    "@storybook/channels": "5.0.0-rc.4",
+    "@storybook/ember": "5.0.0-rc.4",
+    "@storybook/html": "5.0.0-rc.4",
+    "@storybook/marko": "5.0.0-rc.4",
+    "@storybook/mithril": "5.0.0-rc.4",
+    "@storybook/polymer": "5.0.0-rc.4",
+    "@storybook/preact": "5.0.0-rc.4",
+    "@storybook/react": "5.0.0-rc.4",
     "@storybook/react-native": "5.0.0-beta.4",
-    "@storybook/riot": "5.0.0-rc.3",
-    "@storybook/ui": "5.0.0-rc.3",
-    "@storybook/vue": "5.0.0-rc.3"
+    "@storybook/riot": "5.0.0-rc.4",
+    "@storybook/ui": "5.0.0-rc.4",
+    "@storybook/vue": "5.0.0-rc.4"
   },
   "publishConfig": {
     "access": "public"
diff --git a/lib/client-api/package.json b/lib/client-api/package.json
index 067e7512d1a..f5376b46337 100644
--- a/lib/client-api/package.json
+++ b/lib/client-api/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/client-api",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "description": "Storybook Client API",
   "keywords": [
     "storybook"
@@ -19,10 +19,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.3",
-    "@storybook/client-logger": "5.0.0-rc.3",
-    "@storybook/core-events": "5.0.0-rc.3",
-    "@storybook/router": "5.0.0-rc.3",
+    "@storybook/addons": "5.0.0-rc.4",
+    "@storybook/client-logger": "5.0.0-rc.4",
+    "@storybook/core-events": "5.0.0-rc.4",
+    "@storybook/router": "5.0.0-rc.4",
     "common-tags": "^1.8.0",
     "eventemitter3": "^3.1.0",
     "global": "^4.3.2",
diff --git a/lib/client-logger/package.json b/lib/client-logger/package.json
index 8580fc3bbcf..586c687852a 100644
--- a/lib/client-logger/package.json
+++ b/lib/client-logger/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/client-logger",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/codemod/package.json b/lib/codemod/package.json
index 2f104d0259e..36f0b1db9f5 100644
--- a/lib/codemod/package.json
+++ b/lib/codemod/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/codemod",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "description": "A collection of codemod scripts written with JSCodeshift",
   "keywords": [
     "storybook"
diff --git a/lib/components/package.json b/lib/components/package.json
index 40667f55003..bed4bb6c0bc 100644
--- a/lib/components/package.json
+++ b/lib/components/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/components",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "description": "Core Storybook Components",
   "keywords": [
     "storybook"
@@ -20,11 +20,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.3",
-    "@storybook/client-logger": "5.0.0-rc.3",
-    "@storybook/core-events": "5.0.0-rc.3",
-    "@storybook/router": "5.0.0-rc.3",
-    "@storybook/theming": "5.0.0-rc.3",
+    "@storybook/addons": "5.0.0-rc.4",
+    "@storybook/client-logger": "5.0.0-rc.4",
+    "@storybook/core-events": "5.0.0-rc.4",
+    "@storybook/router": "5.0.0-rc.4",
+    "@storybook/theming": "5.0.0-rc.4",
     "global": "^4.3.2",
     "immer": "^1.12.0",
     "js-beautify": "^1.8.9",
diff --git a/lib/core-events/package.json b/lib/core-events/package.json
index ff860d278ea..a71387adfa4 100644
--- a/lib/core-events/package.json
+++ b/lib/core-events/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/core-events",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "description": "Event names used in storybook core",
   "keywords": [
     "storybook"
diff --git a/lib/core/package.json b/lib/core/package.json
index aedfb89b29a..9baba8fc599 100644
--- a/lib/core/package.json
+++ b/lib/core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/core",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "description": "Storybook framework-agnostic API",
   "keywords": [
     "storybook"
@@ -24,15 +24,15 @@
     "@babel/plugin-syntax-dynamic-import": "^7.2.0",
     "@babel/plugin-transform-react-constant-elements": "^7.2.0",
     "@babel/preset-env": "^7.3.1",
-    "@storybook/addons": "5.0.0-rc.3",
-    "@storybook/channel-postmessage": "5.0.0-rc.3",
-    "@storybook/client-api": "5.0.0-rc.3",
-    "@storybook/client-logger": "5.0.0-rc.3",
-    "@storybook/core-events": "5.0.0-rc.3",
-    "@storybook/node-logger": "5.0.0-rc.3",
-    "@storybook/router": "5.0.0-rc.3",
-    "@storybook/theming": "5.0.0-rc.3",
-    "@storybook/ui": "5.0.0-rc.3",
+    "@storybook/addons": "5.0.0-rc.4",
+    "@storybook/channel-postmessage": "5.0.0-rc.4",
+    "@storybook/client-api": "5.0.0-rc.4",
+    "@storybook/client-logger": "5.0.0-rc.4",
+    "@storybook/core-events": "5.0.0-rc.4",
+    "@storybook/node-logger": "5.0.0-rc.4",
+    "@storybook/router": "5.0.0-rc.4",
+    "@storybook/theming": "5.0.0-rc.4",
+    "@storybook/ui": "5.0.0-rc.4",
     "airbnb-js-shims": "^1 || ^2",
     "autoprefixer": "^9.4.7",
     "babel-plugin-add-react-displayname": "^0.0.5",
diff --git a/lib/node-logger/package.json b/lib/node-logger/package.json
index 8169e656b18..19f58e66ad3 100644
--- a/lib/node-logger/package.json
+++ b/lib/node-logger/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/node-logger",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/router/package.json b/lib/router/package.json
index 7f14cbd14c2..d24cae5aaca 100644
--- a/lib/router/package.json
+++ b/lib/router/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/router",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "description": "Core Storybook Router",
   "keywords": [
     "storybook"
@@ -20,7 +20,7 @@
   },
   "dependencies": {
     "@reach/router": "^1.2.1",
-    "@storybook/theming": "5.0.0-rc.3",
+    "@storybook/theming": "5.0.0-rc.4",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
     "qs": "^6.5.2"
diff --git a/lib/theming/package.json b/lib/theming/package.json
index 30a954bd74d..abfd8d6d471 100644
--- a/lib/theming/package.json
+++ b/lib/theming/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/theming",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "description": "Core Storybook Components",
   "keywords": [
     "storybook"
@@ -21,7 +21,7 @@
   "dependencies": {
     "@emotion/core": "^10.0.5",
     "@emotion/styled": "^10.0.5",
-    "@storybook/client-logger": "5.0.0-rc.3",
+    "@storybook/client-logger": "5.0.0-rc.4",
     "common-tags": "^1.8.0",
     "deep-object-diff": "^1.1.0",
     "emotion-theming": "^10.0.7",
diff --git a/lib/ui/package.json b/lib/ui/package.json
index 46442535153..a8a92025ded 100644
--- a/lib/ui/package.json
+++ b/lib/ui/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/ui",
-  "version": "5.0.0-rc.3",
+  "version": "5.0.0-rc.4",
   "description": "Core Storybook UI",
   "keywords": [
     "storybook"
@@ -21,12 +21,12 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.3",
-    "@storybook/client-logger": "5.0.0-rc.3",
-    "@storybook/components": "5.0.0-rc.3",
-    "@storybook/core-events": "5.0.0-rc.3",
-    "@storybook/router": "5.0.0-rc.3",
-    "@storybook/theming": "5.0.0-rc.3",
+    "@storybook/addons": "5.0.0-rc.4",
+    "@storybook/client-logger": "5.0.0-rc.4",
+    "@storybook/components": "5.0.0-rc.4",
+    "@storybook/core-events": "5.0.0-rc.4",
+    "@storybook/router": "5.0.0-rc.4",
+    "@storybook/theming": "5.0.0-rc.4",
     "eventemitter3": "^3.1.0",
     "fast-deep-equal": "^2.0.1",
     "fuse.js": "^3.3.1",

From 17f1d8dc89ec70d411c2b90502964fc3306a4b96 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Thu, 21 Feb 2019 18:27:28 +0800
Subject: [PATCH 058/249] 5.0.0-rc.4 versions.json

---
 CHANGELOG.md              | 4 ++--
 docs/static/versions.json | 1 +
 2 files changed, 3 insertions(+), 2 deletions(-)
 create mode 100644 docs/static/versions.json

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 7a1075fe26e..9aa0f537135 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -2,7 +2,7 @@
 
 ### Features
 
-* Handle prerelease versions in version check ([#5641](https://github.com/storybooks/storybook/pull/5641))
+* UI: Handle prerelease versions in version check ([#5641](https://github.com/storybooks/storybook/pull/5641))
 
 ### Bug Fixes
 
@@ -11,7 +11,7 @@
 * Core: Fix singleton module issue for manager & theme ([#5679](https://github.com/storybooks/storybook/pull/5679))
 * Addon-storysource: Fix source not updating ([#5672](https://github.com/storybooks/storybook/pull/5672))
 * Core: Fix broken error reporting ([#5678](https://github.com/storybooks/storybook/pull/5678))
-* Compare component name to story name, not story fn ([#5649](https://github.com/storybooks/storybook/pull/5649))
+* Addon-info: Compare component name to story name, not story fn ([#5649](https://github.com/storybooks/storybook/pull/5649))
 
 ### Maintenance
 
diff --git a/docs/static/versions.json b/docs/static/versions.json
new file mode 100644
index 00000000000..ac6d55b8474
--- /dev/null
+++ b/docs/static/versions.json
@@ -0,0 +1 @@
+{"next":{"version":"5.0.0-rc.4","info":{"plain":"### Features\n\n* Handle prerelease versions in version check ([#5641](https://github.com/storybooks/storybook/pull/5641))\n\n### Bug Fixes\n\n* UI: Fix scrollbar persistence ([#5689](https://github.com/storybooks/storybook/pull/5689))\n* UI: Fix keyboard shortcuts of toggleNav & togglePanel ([#5677](https://github.com/storybooks/storybook/pull/5677))\n* Core: Fix singleton module issue for manager & theme ([#5679](https://github.com/storybooks/storybook/pull/5679))\n* Addon-storysource: Fix source not updating ([#5672](https://github.com/storybooks/storybook/pull/5672))\n* Core: Fix broken error reporting ([#5678](https://github.com/storybooks/storybook/pull/5678))\n* Compare component name to story name, not story fn ([#5649](https://github.com/storybooks/storybook/pull/5649))\n\n### Maintenance\n\n* CLI: Cleanup version notice ([#5699](https://github.com/storybooks/storybook/pull/5699))\n* Core: Fix story fn consistency ([#5669](https://github.com/storybooks/storybook/pull/5669))"}}}
\ No newline at end of file

From 353c4634a09a7e78085dceee48af0eb355d042e4 Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Thu, 21 Feb 2019 22:00:16 +0100
Subject: [PATCH 059/249] Merge pull request #5709 from
 storybooks/5652-mobile-styling

Fix up mobile styling
---
 .../__snapshots__/storyshots.test.js.snap     |  92 +++---
 .../__snapshots__/layout.stories.storyshot    | 283 ++++++++++++++----
 lib/ui/src/components/layout/mobile.js        |  54 ++--
 .../__snapshots__/panel.stories.storyshot     |   6 +
 lib/ui/src/components/panel/panel.js          |  24 +-
 .../__snapshots__/preview.stories.storyshot   |  78 ++++-
 lib/ui/src/components/preview/preview.js      |  16 +-
 .../__snapshots__/about.stories.storyshot     | 138 ++++-----
 8 files changed, 477 insertions(+), 214 deletions(-)

diff --git a/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap b/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
index 5a3abad4b5d..977241abe86 100644
--- a/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
+++ b/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
@@ -3485,29 +3485,6 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   margin-right: 15px;
 }
 
-.emotion-5 {
-  height: 40px;
-  background: none;
-  color: inherit;
-  padding: 0;
-  cursor: pointer;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-}
-
-.emotion-5:hover,
-.emotion-5:focus {
-  outline: 0 none;
-  color: #1EA7FD;
-}
-
-.emotion-5 > svg {
-  width: 15px;
-}
-
 .emotion-4 {
   shape-rendering: inherit;
   -webkit-transform: translate3d(0,0,0);
@@ -3532,6 +3509,29 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   width: 100%;
 }
 
+.emotion-5 {
+  height: 40px;
+  background: none;
+  color: inherit;
+  padding: 0;
+  cursor: pointer;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+}
+
+.emotion-5:hover,
+.emotion-5:focus {
+  outline: 0 none;
+  color: #1EA7FD;
+}
+
+.emotion-5 > svg {
+  width: 15px;
+}
+
 .emotion-96 {
   display: -webkit-box;
   display: -webkit-flex;
@@ -3997,29 +3997,6 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   margin-right: 15px;
 }
 
-.emotion-5 {
-  height: 40px;
-  background: none;
-  color: inherit;
-  padding: 0;
-  cursor: pointer;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-}
-
-.emotion-5:hover,
-.emotion-5:focus {
-  outline: 0 none;
-  color: #1EA7FD;
-}
-
-.emotion-5 > svg {
-  width: 15px;
-}
-
 .emotion-4 {
   shape-rendering: inherit;
   -webkit-transform: translate3d(0,0,0);
@@ -4044,6 +4021,29 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   width: 100%;
 }
 
+.emotion-5 {
+  height: 40px;
+  background: none;
+  color: inherit;
+  padding: 0;
+  cursor: pointer;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+}
+
+.emotion-5:hover,
+.emotion-5:focus {
+  outline: 0 none;
+  color: #1EA7FD;
+}
+
+.emotion-5 > svg {
+  width: 15px;
+}
+
 .emotion-96 {
   display: -webkit-box;
   display: -webkit-flex;
diff --git a/lib/ui/src/components/layout/__snapshots__/layout.stories.storyshot b/lib/ui/src/components/layout/__snapshots__/layout.stories.storyshot
index 8521c926594..0de2f833a5a 100644
--- a/lib/ui/src/components/layout/__snapshots__/layout.stories.storyshot
+++ b/lib/ui/src/components/layout/__snapshots__/layout.stories.storyshot
@@ -326,6 +326,51 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 0 1`] = `
   border-bottom-color: #1EA7FD;
 }
 
+.emotion-8 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
+  font-size: 13px;
+  color: #1EA7FD;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-8:empty {
+  display: none;
+}
+
+.emotion-8:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
 .emotion-11 {
   position: fixed;
   left: 0;
@@ -350,6 +395,7 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 0 1`] = `
   position: absolute;
   top: 0;
   height: 100%;
+  background: #FFFFFF;
   width: 80vw;
   -webkit-transform: translateX(-80vw);
   -ms-transform: translateX(-80vw);
@@ -357,6 +403,14 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 0 1`] = `
   left: 0;
 }
 
+.emotion-1:nth-of-type(1) {
+  border-right: 1px solid rgba(0,0,0,.1);
+}
+
+.emotion-1:nth-of-type(3) {
+  border-left: 1px solid rgba(0,0,0,.1);
+}
+
 .emotion-0 {
   background: hotpink;
   position: absolute;
@@ -388,6 +442,7 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 0 1`] = `
   position: absolute;
   top: 0;
   height: 100%;
+  background: #FFFFFF;
   width: 100%;
   -webkit-transform: translateX(0) scale(1);
   -ms-transform: translateX(0) scale(1);
@@ -395,6 +450,14 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 0 1`] = `
   left: 0;
 }
 
+.emotion-3:nth-of-type(1) {
+  border-right: 1px solid rgba(0,0,0,.1);
+}
+
+.emotion-3:nth-of-type(3) {
+  border-left: 1px solid rgba(0,0,0,.1);
+}
+
 .emotion-2 {
   background: deepskyblue;
   position: absolute;
@@ -426,6 +489,7 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 0 1`] = `
   position: absolute;
   top: 0;
   height: 100%;
+  background: #FFFFFF;
   width: 80vw;
   -webkit-transform: translateX(80vw);
   -ms-transform: translateX(80vw);
@@ -433,6 +497,14 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 0 1`] = `
   right: 0;
 }
 
+.emotion-5:nth-of-type(1) {
+  border-right: 1px solid rgba(0,0,0,.1);
+}
+
+.emotion-5:nth-of-type(3) {
+  border-left: 1px solid rgba(0,0,0,.1);
+}
+
 .emotion-4 {
   background: orangered;
   position: absolute;
@@ -467,6 +539,8 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 0 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
+  box-shadow: 0 1px 5px 0 rgba(0,0,0,0.1);
+  background: #FFFFFF;
 }
 
 .emotion-10 > * {
@@ -528,22 +602,20 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 0 1`] = `
     <div
       class="emotion-5"
     >
-      <div>
-        <div
-          class="emotion-4"
-          color="orangered"
+      <div
+        class="emotion-4"
+        color="orangered"
+      >
+        <h2
+          style="position:absolute;bottom:0;right:0;color:rgba(0,0,0,0.2);font-size:150px;line-height:150px;margin:-20px"
         >
-          <h2
-            style="position:absolute;bottom:0;right:0;color:rgba(0,0,0,0.2);font-size:150px;line-height:150px;margin:-20px"
-          >
-            1
-          </h2>
-          <pre>
-            {
+          1
+        </h2>
+        <pre>
+          {
   "hidden": false
 }
-          </pre>
-        </div>
+        </pre>
       </div>
     </div>
   </div>
@@ -553,17 +625,17 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 0 1`] = `
     <button
       class="emotion-7"
     >
-      Nav
+      Sidebar
+    </button>
+    <button
+      class="emotion-8"
+    >
+      Canvas
     </button>
     <button
       class="emotion-7"
     >
-      Preview
-    </button>
-    <button
-      class="emotion-7"
-    >
-      Panel
+      Addons
     </button>
   </nav>
 </div>
@@ -639,6 +711,7 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 1 1`] = `
   position: absolute;
   top: 0;
   height: 100%;
+  background: #FFFFFF;
   width: 80vw;
   -webkit-transform: translateX(-80vw);
   -ms-transform: translateX(-80vw);
@@ -646,6 +719,14 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 1 1`] = `
   left: 0;
 }
 
+.emotion-1:nth-of-type(1) {
+  border-right: 1px solid rgba(0,0,0,.1);
+}
+
+.emotion-1:nth-of-type(3) {
+  border-left: 1px solid rgba(0,0,0,.1);
+}
+
 .emotion-0 {
   background: hotpink;
   position: absolute;
@@ -677,6 +758,7 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 1 1`] = `
   position: absolute;
   top: 0;
   height: 100%;
+  background: #FFFFFF;
   width: 100%;
   -webkit-transform: translateX(0) scale(1);
   -ms-transform: translateX(0) scale(1);
@@ -684,6 +766,14 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 1 1`] = `
   left: 0;
 }
 
+.emotion-3:nth-of-type(1) {
+  border-right: 1px solid rgba(0,0,0,.1);
+}
+
+.emotion-3:nth-of-type(3) {
+  border-left: 1px solid rgba(0,0,0,.1);
+}
+
 .emotion-2 {
   background: deepskyblue;
   position: absolute;
@@ -715,6 +805,7 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 1 1`] = `
   position: absolute;
   top: 0;
   height: 100%;
+  background: #FFFFFF;
   width: 80vw;
   -webkit-transform: translateX(80vw);
   -ms-transform: translateX(80vw);
@@ -722,6 +813,14 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 1 1`] = `
   right: 0;
 }
 
+.emotion-5:nth-of-type(1) {
+  border-right: 1px solid rgba(0,0,0,.1);
+}
+
+.emotion-5:nth-of-type(3) {
+  border-left: 1px solid rgba(0,0,0,.1);
+}
+
 .emotion-4 {
   background: orangered;
   position: absolute;
@@ -756,6 +855,8 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 1 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
+  box-shadow: 0 1px 5px 0 rgba(0,0,0,0.1);
+  background: #FFFFFF;
 }
 
 .emotion-10 > * {
@@ -817,22 +918,20 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 1 1`] = `
     <div
       class="emotion-5"
     >
-      <div>
-        <div
-          class="emotion-4"
-          color="orangered"
+      <div
+        class="emotion-4"
+        color="orangered"
+      >
+        <h2
+          style="position:absolute;bottom:0;right:0;color:rgba(0,0,0,0.2);font-size:150px;line-height:150px;margin:-20px"
         >
-          <h2
-            style="position:absolute;bottom:0;right:0;color:rgba(0,0,0,0.2);font-size:150px;line-height:150px;margin:-20px"
-          >
-            1
-          </h2>
-          <pre>
-            {
+          1
+        </h2>
+        <pre>
+          {
   "hidden": false
 }
-          </pre>
-        </div>
+        </pre>
       </div>
     </div>
   </div>
@@ -842,17 +941,17 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 1 1`] = `
     <button
       class="emotion-7"
     >
-      Nav
+      Sidebar
     </button>
     <button
       class="emotion-7"
     >
-      Preview
+      Canvas
     </button>
     <button
       class="emotion-7"
     >
-      Panel
+      Addons
     </button>
   </nav>
 </div>
@@ -928,6 +1027,7 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 2 1`] = `
   position: absolute;
   top: 0;
   height: 100%;
+  background: #FFFFFF;
   width: 80vw;
   -webkit-transform: translateX(-80vw);
   -ms-transform: translateX(-80vw);
@@ -935,6 +1035,14 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 2 1`] = `
   left: 0;
 }
 
+.emotion-1:nth-of-type(1) {
+  border-right: 1px solid rgba(0,0,0,.1);
+}
+
+.emotion-1:nth-of-type(3) {
+  border-left: 1px solid rgba(0,0,0,.1);
+}
+
 .emotion-0 {
   background: hotpink;
   position: absolute;
@@ -966,6 +1074,7 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 2 1`] = `
   position: absolute;
   top: 0;
   height: 100%;
+  background: #FFFFFF;
   width: 100%;
   -webkit-transform: translateX(0) scale(1);
   -ms-transform: translateX(0) scale(1);
@@ -973,6 +1082,14 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 2 1`] = `
   left: 0;
 }
 
+.emotion-3:nth-of-type(1) {
+  border-right: 1px solid rgba(0,0,0,.1);
+}
+
+.emotion-3:nth-of-type(3) {
+  border-left: 1px solid rgba(0,0,0,.1);
+}
+
 .emotion-2 {
   background: deepskyblue;
   position: absolute;
@@ -1004,6 +1121,7 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 2 1`] = `
   position: absolute;
   top: 0;
   height: 100%;
+  background: #FFFFFF;
   width: 80vw;
   -webkit-transform: translateX(80vw);
   -ms-transform: translateX(80vw);
@@ -1011,6 +1129,14 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 2 1`] = `
   right: 0;
 }
 
+.emotion-5:nth-of-type(1) {
+  border-right: 1px solid rgba(0,0,0,.1);
+}
+
+.emotion-5:nth-of-type(3) {
+  border-left: 1px solid rgba(0,0,0,.1);
+}
+
 .emotion-4 {
   background: orangered;
   position: absolute;
@@ -1045,6 +1171,8 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 2 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
+  box-shadow: 0 1px 5px 0 rgba(0,0,0,0.1);
+  background: #FFFFFF;
 }
 
 .emotion-10 > * {
@@ -1106,22 +1234,20 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 2 1`] = `
     <div
       class="emotion-5"
     >
-      <div>
-        <div
-          class="emotion-4"
-          color="orangered"
+      <div
+        class="emotion-4"
+        color="orangered"
+      >
+        <h2
+          style="position:absolute;bottom:0;right:0;color:rgba(0,0,0,0.2);font-size:150px;line-height:150px;margin:-20px"
         >
-          <h2
-            style="position:absolute;bottom:0;right:0;color:rgba(0,0,0,0.2);font-size:150px;line-height:150px;margin:-20px"
-          >
-            1
-          </h2>
-          <pre>
-            {
+          1
+        </h2>
+        <pre>
+          {
   "hidden": false
 }
-          </pre>
-        </div>
+        </pre>
       </div>
     </div>
   </div>
@@ -1131,17 +1257,17 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 2 1`] = `
     <button
       class="emotion-7"
     >
-      Nav
+      Sidebar
     </button>
     <button
       class="emotion-7"
     >
-      Preview
+      Canvas
     </button>
     <button
       class="emotion-7"
     >
-      Panel
+      Addons
     </button>
   </nav>
 </div>
@@ -1217,6 +1343,7 @@ exports[`Storyshots UI|Layout/Mobile (mocked) page 1`] = `
   position: absolute;
   top: 0;
   height: 100%;
+  background: #FFFFFF;
   width: 80vw;
   -webkit-transform: translateX(-80vw);
   -ms-transform: translateX(-80vw);
@@ -1224,6 +1351,14 @@ exports[`Storyshots UI|Layout/Mobile (mocked) page 1`] = `
   left: 0;
 }
 
+.emotion-1:nth-of-type(1) {
+  border-right: 1px solid rgba(0,0,0,.1);
+}
+
+.emotion-1:nth-of-type(3) {
+  border-left: 1px solid rgba(0,0,0,.1);
+}
+
 .emotion-0 {
   background: hotpink;
   position: absolute;
@@ -1255,6 +1390,7 @@ exports[`Storyshots UI|Layout/Mobile (mocked) page 1`] = `
   position: absolute;
   top: 0;
   height: 100%;
+  background: #FFFFFF;
   width: 100%;
   -webkit-transform: translateX(0) scale(1);
   -ms-transform: translateX(0) scale(1);
@@ -1262,6 +1398,14 @@ exports[`Storyshots UI|Layout/Mobile (mocked) page 1`] = `
   left: 0;
 }
 
+.emotion-4:nth-of-type(1) {
+  border-right: 1px solid rgba(0,0,0,.1);
+}
+
+.emotion-4:nth-of-type(3) {
+  border-left: 1px solid rgba(0,0,0,.1);
+}
+
 .emotion-2 {
   background: deepskyblue;
   position: absolute;
@@ -1293,6 +1437,7 @@ exports[`Storyshots UI|Layout/Mobile (mocked) page 1`] = `
   position: absolute;
   top: 0;
   height: 100%;
+  background: #FFFFFF;
   width: 80vw;
   -webkit-transform: translateX(80vw);
   -ms-transform: translateX(80vw);
@@ -1300,6 +1445,14 @@ exports[`Storyshots UI|Layout/Mobile (mocked) page 1`] = `
   right: 0;
 }
 
+.emotion-6:nth-of-type(1) {
+  border-right: 1px solid rgba(0,0,0,.1);
+}
+
+.emotion-6:nth-of-type(3) {
+  border-left: 1px solid rgba(0,0,0,.1);
+}
+
 .emotion-5 {
   background: orangered;
   position: absolute;
@@ -1334,6 +1487,8 @@ exports[`Storyshots UI|Layout/Mobile (mocked) page 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
+  box-shadow: 0 1px 5px 0 rgba(0,0,0,0.1);
+  background: #FFFFFF;
 }
 
 .emotion-10 > * {
@@ -1434,23 +1589,19 @@ exports[`Storyshots UI|Layout/Mobile (mocked) page 1`] = `
       class="emotion-6"
     >
       <div
-        hidden=""
+        class="emotion-5"
+        color="orangered"
       >
-        <div
-          class="emotion-5"
-          color="orangered"
+        <h2
+          style="position:absolute;bottom:0;right:0;color:rgba(0,0,0,0.2);font-size:150px;line-height:150px;margin:-20px"
         >
-          <h2
-            style="position:absolute;bottom:0;right:0;color:rgba(0,0,0,0.2);font-size:150px;line-height:150px;margin:-20px"
-          >
-            1
-          </h2>
-          <pre>
-            {
+          1
+        </h2>
+        <pre>
+          {
   "hidden": true
 }
-          </pre>
-        </div>
+        </pre>
       </div>
     </div>
   </div>
@@ -1460,7 +1611,7 @@ exports[`Storyshots UI|Layout/Mobile (mocked) page 1`] = `
     <button
       class="emotion-8"
     >
-      Nav
+      Sidebar
     </button>
     <button
       class="emotion-8"
diff --git a/lib/ui/src/components/layout/mobile.js b/lib/ui/src/components/layout/mobile.js
index 597fa9482a9..8a3be8a6795 100644
--- a/lib/ui/src/components/layout/mobile.js
+++ b/lib/ui/src/components/layout/mobile.js
@@ -12,6 +12,15 @@ const Pane = styled.div(
     top: 0,
     height: '100%',
   },
+  ({ theme }) => ({
+    background: theme.background.content,
+    '&:nth-of-type(1)': {
+      borderRight: `1px solid ${theme.appBorderColor}`,
+    },
+    '&:nth-of-type(3)': {
+      borderLeft: `1px solid ${theme.appBorderColor}`,
+    },
+  }),
   ({ index }) => {
     switch (index) {
       case 0: {
@@ -93,18 +102,24 @@ Panels.Container = styled.div({
   height: 'calc(100% - 40px)',
 });
 
-const Bar = styled.nav({
-  position: 'fixed',
-  bottom: 0,
-  left: 0,
-  width: '100vw',
-  height: 40,
-  display: 'flex',
+const Bar = styled.nav(
+  {
+    position: 'fixed',
+    bottom: 0,
+    left: 0,
+    width: '100vw',
+    height: 40,
+    display: 'flex',
+    boxShadow: '0 1px 5px 0 rgba(0, 0, 0, 0.1)',
 
-  '& > *': {
-    flex: 1,
+    '& > *': {
+      flex: 1,
+    },
   },
-});
+  ({ theme }) => ({
+    background: theme.barBg,
+  })
+);
 
 // eslint-disable-next-line react/no-multi-comp
 class Mobile extends Component {
@@ -138,20 +153,25 @@ class Mobile extends Component {
               <Route key={key}>{content()}</Route>
             ))}
           </div>
-          <div hidden={!viewMode}>
-            <Panel hidden={!viewMode} />
-          </div>
+          <Panel hidden={!viewMode} />
         </Panels>
         <Bar active={active}>
-          <TabButton onClick={() => this.setState({ active: 0 })}>Nav</TabButton>
-          <TabButton onClick={() => this.setState({ active: 1 })}>
-            {viewMode ? 'Preview' : null}
+          <TabButton onClick={() => this.setState({ active: 0 })} active={active === 0}>
+            Sidebar
+          </TabButton>
+          <TabButton
+            onClick={() => this.setState({ active: 1 })}
+            active={active === 1 || active === false}
+          >
+            {viewMode ? 'Canvas' : null}
             {pages.map(({ key, route: Route }) => (
               <Route key={key}>{key}</Route>
             ))}
           </TabButton>
           {viewMode ? (
-            <TabButton onClick={() => this.setState({ active: 2 })}>Panel</TabButton>
+            <TabButton onClick={() => this.setState({ active: 2 })} active={active === 2}>
+              Addons
+            </TabButton>
           ) : null}
         </Bar>
       </Root>
diff --git a/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot b/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot
index 9b47032ffb7..e35a7f00d1d 100644
--- a/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot
+++ b/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot
@@ -235,6 +235,12 @@ exports[`Storyshots UI|Panel default 1`] = `
   width: 15px;
 }
 
+@media (max-width:599px) {
+  .emotion-6 {
+    display: none;
+  }
+}
+
 .emotion-5 {
   shape-rendering: inherit;
   -webkit-transform: translate3d(0,0,0);
diff --git a/lib/ui/src/components/panel/panel.js b/lib/ui/src/components/panel/panel.js
index 75984a3d7dc..1c9cf0c7026 100644
--- a/lib/ui/src/components/panel/panel.js
+++ b/lib/ui/src/components/panel/panel.js
@@ -1,7 +1,15 @@
 import React, { Component, Fragment } from 'react';
 import PropTypes from 'prop-types';
+import { styled } from '@storybook/theming';
 import { Tabs, Icons, IconButton } from '@storybook/components';
 
+const DesktopOnlyIconButton = styled(IconButton)({
+  // Hides full screen icon at mobile breakpoint defined in app.js
+  '@media (max-width: 599px)': {
+    display: 'none',
+  },
+});
+
 class SafeTab extends Component {
   constructor(props) {
     super(props);
@@ -45,12 +53,20 @@ const AddonPanel = React.memo(({ panels, actions, selectedPanel, panelPosition }
     flex
     tools={
       <Fragment>
-        <IconButton key="position" onClick={actions.togglePosition} title="Change orientation">
+        <DesktopOnlyIconButton
+          key="position"
+          onClick={actions.togglePosition}
+          title="Change orientation"
+        >
           <Icons icon={panelPosition === 'bottom' ? 'bottombar' : 'sidebaralt'} />
-        </IconButton>
-        <IconButton key="visibility" onClick={actions.toggleVisibility} title="Hide addons">
+        </DesktopOnlyIconButton>
+        <DesktopOnlyIconButton
+          key="visibility"
+          onClick={actions.toggleVisibility}
+          title="Hide addons"
+        >
           <Icons icon="close" />
-        </IconButton>
+        </DesktopOnlyIconButton>
       </Fragment>
     }
     id="storybook-panel-root"
diff --git a/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot b/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot
index 81a329b8faa..a18ea1960d2 100644
--- a/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot
+++ b/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot
@@ -51,7 +51,7 @@ Array [
   margin-right: 15px;
 }
 
-.emotion-2 {
+.emotion-16 {
   height: 40px;
   background: none;
   color: inherit;
@@ -64,16 +64,22 @@ Array [
   transition: color 0.2s linear,border-bottom-color 0.2s linear;
 }
 
-.emotion-2:hover,
-.emotion-2:focus {
+.emotion-16:hover,
+.emotion-16:focus {
   outline: 0 none;
   color: #1EA7FD;
 }
 
-.emotion-2 > svg {
+.emotion-16 > svg {
   width: 15px;
 }
 
+@media (max-width:599px) {
+  .emotion-16 {
+    display: none;
+  }
+}
+
 .emotion-1 {
   shape-rendering: inherit;
   -webkit-transform: translate3d(0,0,0);
@@ -146,6 +152,29 @@ Array [
   visibility: hidden;
 }
 
+.emotion-2 {
+  height: 40px;
+  background: none;
+  color: inherit;
+  padding: 0;
+  cursor: pointer;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+}
+
+.emotion-2:hover,
+.emotion-2:focus {
+  outline: 0 none;
+  color: #1EA7FD;
+}
+
+.emotion-2 > svg {
+  width: 15px;
+}
+
 .emotion-9 {
   width: 1px;
   height: 24px;
@@ -241,7 +270,7 @@ Array [
         title="side right"
       >
         <button
-          class="emotion-2"
+          class="emotion-16"
           title="Go full screen"
         >
           <svg
@@ -495,7 +524,7 @@ Array [
   margin-right: 15px;
 }
 
-.emotion-8 {
+.emotion-22 {
   height: 40px;
   background: none;
   color: inherit;
@@ -508,16 +537,22 @@ Array [
   transition: color 0.2s linear,border-bottom-color 0.2s linear;
 }
 
-.emotion-8:hover,
-.emotion-8:focus {
+.emotion-22:hover,
+.emotion-22:focus {
   outline: 0 none;
   color: #1EA7FD;
 }
 
-.emotion-8 > svg {
+.emotion-22 > svg {
   width: 15px;
 }
 
+@media (max-width:599px) {
+  .emotion-22 {
+    display: none;
+  }
+}
+
 .emotion-7 {
   shape-rendering: inherit;
   -webkit-transform: translate3d(0,0,0);
@@ -590,6 +625,29 @@ Array [
   visibility: hidden;
 }
 
+.emotion-8 {
+  height: 40px;
+  background: none;
+  color: inherit;
+  padding: 0;
+  cursor: pointer;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+}
+
+.emotion-8:hover,
+.emotion-8:focus {
+  outline: 0 none;
+  color: #1EA7FD;
+}
+
+.emotion-8 > svg {
+  width: 15px;
+}
+
 .emotion-5 {
   width: 1px;
   height: 24px;
@@ -719,7 +777,7 @@ Array [
         title="side right"
       >
         <button
-          class="emotion-8"
+          class="emotion-22"
           title="Go full screen"
         >
           <svg
diff --git a/lib/ui/src/components/preview/preview.js b/lib/ui/src/components/preview/preview.js
index ffae2aeceeb..0f9c477d871 100644
--- a/lib/ui/src/components/preview/preview.js
+++ b/lib/ui/src/components/preview/preview.js
@@ -3,6 +3,7 @@ import React, { Component, Fragment } from 'react';
 import PropTypes from 'prop-types';
 import memoize from 'memoizerific';
 
+import { styled } from '@storybook/theming';
 import { SET_CURRENT_STORY } from '@storybook/core-events';
 import { types } from '@storybook/addons';
 import { Icons, IconButton, TabButton, TabBar, interleaveSeparators } from '@storybook/components';
@@ -18,6 +19,13 @@ import { Grid, Background, BackgroundProvider, BackgroundConsumer } from './back
 
 import { IFrame } from './iframe';
 
+const DesktopOnlyIconButton = styled(IconButton)({
+  // Hides full screen icon at mobile breakpoint defined in app.js
+  '@media (max-width: 599px)': {
+    display: 'none',
+  },
+});
+
 const renderIframe = (storyId, id, baseUrl) => (
   <IFrame
     key="iframe"
@@ -122,9 +130,13 @@ const getTools = memoize(10)(
       {
         match: p => p.viewMode === 'story',
         render: () => (
-          <IconButton key="full" onClick={actions.toggleFullscreen} title="Go full screen">
+          <DesktopOnlyIconButton
+            key="full"
+            onClick={actions.toggleFullscreen}
+            title="Go full screen"
+          >
             <Icons icon={options.isFullscreen ? 'close' : 'expand'} />
-          </IconButton>
+          </DesktopOnlyIconButton>
         ),
       },
       {
diff --git a/lib/ui/src/settings/__snapshots__/about.stories.storyshot b/lib/ui/src/settings/__snapshots__/about.stories.storyshot
index 175c108e01f..2df746c376d 100644
--- a/lib/ui/src/settings/__snapshots__/about.stories.storyshot
+++ b/lib/ui/src/settings/__snapshots__/about.stories.storyshot
@@ -167,29 +167,6 @@ exports[`Storyshots UI|Settings/AboutScreen failed to fetch new version 1`] = `
   margin-right: 15px;
 }
 
-.emotion-5 {
-  height: 40px;
-  background: none;
-  color: inherit;
-  padding: 0;
-  cursor: pointer;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-}
-
-.emotion-5:hover,
-.emotion-5:focus {
-  outline: 0 none;
-  color: #1EA7FD;
-}
-
-.emotion-5 > svg {
-  width: 15px;
-}
-
 .emotion-4 {
   shape-rendering: inherit;
   -webkit-transform: translate3d(0,0,0);
@@ -214,6 +191,29 @@ exports[`Storyshots UI|Settings/AboutScreen failed to fetch new version 1`] = `
   width: 100%;
 }
 
+.emotion-5 {
+  height: 40px;
+  background: none;
+  color: inherit;
+  padding: 0;
+  cursor: pointer;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+}
+
+.emotion-5:hover,
+.emotion-5:focus {
+  outline: 0 none;
+  color: #1EA7FD;
+}
+
+.emotion-5 > svg {
+  width: 15px;
+}
+
 .emotion-14 {
   display: inline-block;
   -webkit-transition: all 150ms ease-out;
@@ -717,29 +717,6 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   margin-right: 15px;
 }
 
-.emotion-5 {
-  height: 40px;
-  background: none;
-  color: inherit;
-  padding: 0;
-  cursor: pointer;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-}
-
-.emotion-5:hover,
-.emotion-5:focus {
-  outline: 0 none;
-  color: #1EA7FD;
-}
-
-.emotion-5 > svg {
-  width: 15px;
-}
-
 .emotion-4 {
   shape-rendering: inherit;
   -webkit-transform: translate3d(0,0,0);
@@ -764,6 +741,29 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   width: 100%;
 }
 
+.emotion-5 {
+  height: 40px;
+  background: none;
+  color: inherit;
+  padding: 0;
+  cursor: pointer;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+}
+
+.emotion-5:hover,
+.emotion-5:focus {
+  outline: 0 none;
+  color: #1EA7FD;
+}
+
+.emotion-5 > svg {
+  width: 15px;
+}
+
 .emotion-38 {
   display: -webkit-box;
   display: -webkit-flex;
@@ -2086,29 +2086,6 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   margin-right: 15px;
 }
 
-.emotion-5 {
-  height: 40px;
-  background: none;
-  color: inherit;
-  padding: 0;
-  cursor: pointer;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-}
-
-.emotion-5:hover,
-.emotion-5:focus {
-  outline: 0 none;
-  color: #1EA7FD;
-}
-
-.emotion-5 > svg {
-  width: 15px;
-}
-
 .emotion-4 {
   shape-rendering: inherit;
   -webkit-transform: translate3d(0,0,0);
@@ -2133,6 +2110,29 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   width: 100%;
 }
 
+.emotion-5 {
+  height: 40px;
+  background: none;
+  color: inherit;
+  padding: 0;
+  cursor: pointer;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+}
+
+.emotion-5:hover,
+.emotion-5:focus {
+  outline: 0 none;
+  color: #1EA7FD;
+}
+
+.emotion-5 > svg {
+  width: 15px;
+}
+
 .emotion-24 {
   display: -webkit-box;
   display: -webkit-flex;

From cc5761b1951697e5bc56d895d93547db0dbda55e Mon Sep 17 00:00:00 2001
From: Tom Coleman <tom@percolatestudio.com>
Date: Fri, 22 Feb 2019 08:13:20 +1100
Subject: [PATCH 060/249] Merge pull request #5713 from
 storybooks/fix/scrolling-down-on-storychange

Fix the damn scrolly scrolly buggy buggy stuff
---
 addons/a11y/README.md                         |  3 +-
 addons/a11y/src/index.js                      | 25 +++++++----
 examples/official-storybook/config.js         |  8 +++-
 .../stories/core/scroll.stories.js            | 29 +++++++++++++
 .../__snapshots__/storyshots.test.js.snap     | 42 ++++++++++++++++++-
 lib/core/src/client/preview/start.js          |  9 ++--
 6 files changed, 99 insertions(+), 17 deletions(-)
 create mode 100644 examples/official-storybook/stories/core/scroll.stories.js

diff --git a/addons/a11y/README.md b/addons/a11y/README.md
index 9940d899440..ea4ce8e1c8a 100755
--- a/addons/a11y/README.md
+++ b/addons/a11y/README.md
@@ -58,10 +58,11 @@ addParameters({
   a11y: {
     // ... axe options
     element: '#root', // optional selector which element to inspect
+    config: {} // axe-core configurationOptions (https://github.com/dequelabs/axe-core/blob/develop/doc/API.md#parameters-1)
+    options: {} // axe-core optionsParameter (https://github.com/dequelabs/axe-core/blob/develop/doc/API.md#options-parameter)
   },
 });
 
-
 storiesOf('button', module)
   .add('Accessible', () => (
     <button style={{ backgroundColor: 'black', color: 'white', }}>
diff --git a/addons/a11y/src/index.js b/addons/a11y/src/index.js
index 475b5a69e22..8875e938a7b 100644
--- a/addons/a11y/src/index.js
+++ b/addons/a11y/src/index.js
@@ -9,7 +9,7 @@ import EVENTS, { PARAM_KEY } from './constants';
 
 const channel = addons.getChannel();
 let progress = Promise.resolve();
-let options;
+let setup;
 
 const getElement = () => {
   const storyRoot = document.getElementById('story-root');
@@ -24,13 +24,20 @@ const report = input => {
   channel.emit(EVENTS.RESULT, input);
 };
 
-const run = o => {
+const run = (c, o) => {
   progress = progress.then(() => {
     axe.reset();
-    if (o) {
-      axe.configure(o);
+    if (c) {
+      axe.configure(c);
     }
-    return axe.run(getElement()).then(report);
+    return axe
+      .run(
+        getElement(),
+        o || {
+          restoreScroll: true,
+        }
+      )
+      .then(report);
   });
 };
 
@@ -41,14 +48,14 @@ export const withA11Y = makeDecorator({
   allowDeprecatedUsage: false,
 
   wrapper: (getStory, context, opt) => {
-    options = opt.parameters || opt.options;
+    setup = opt.parameters || opt.options;
 
     return getStory(context);
   },
 });
 
-channel.on(STORY_RENDERED, () => run(options));
-channel.on(EVENTS.REQUEST, () => run(options));
+channel.on(STORY_RENDERED, () => run(setup.config, setup.options));
+channel.on(EVENTS.REQUEST, () => run(setup.config, setup.options));
 
 if (module && module.hot && module.hot.decline) {
   module.hot.decline();
@@ -63,7 +70,7 @@ export const checkA11y = deprecate(
 // TODO: REMOVE at v6.0.0
 export const configureA11y = deprecate(
   config => {
-    options = config;
+    setup = config;
   },
   stripIndents`
     configureA11y is deprecated, please configure addon-a11y using the addParameter api:
diff --git a/examples/official-storybook/config.js b/examples/official-storybook/config.js
index 9c3a6b3351e..50e42f6a8dc 100644
--- a/examples/official-storybook/config.js
+++ b/examples/official-storybook/config.js
@@ -41,7 +41,13 @@ addDecorator(storyFn => (
 ));
 
 addParameters({
-  a11y: {},
+  a11y: {
+    configure: {},
+    options: {
+      checks: { 'color-contrast': { options: { noScroll: true } } },
+      restoreScroll: true,
+    },
+  },
   options: {
     name: 'Storybook',
     hierarchySeparator: /\/|\./,
diff --git a/examples/official-storybook/stories/core/scroll.stories.js b/examples/official-storybook/stories/core/scroll.stories.js
new file mode 100644
index 00000000000..8b1e255497b
--- /dev/null
+++ b/examples/official-storybook/stories/core/scroll.stories.js
@@ -0,0 +1,29 @@
+import React from 'react';
+
+export default {
+  title: 'Core|Scroll',
+};
+
+export const story1 = () => (
+  <div>
+    <pre>START, when switching stories, you should be able to read this at the top of the page</pre>
+    <div style={{ height: '100vh' }} />
+    <pre>
+      END, this text should be below the scroll "fold" and therefore only be readable after
+      scrolling
+    </pre>
+  </div>
+);
+story1.title = 'story with 100vh padding 1';
+
+export const story2 = () => (
+  <div>
+    <pre>START, when switching stories, you should be able to read this at the top of the page</pre>
+    <div style={{ height: '100vh' }} />
+    <pre>
+      END, this text should be below the scroll "fold" and therefore only be readable after
+      scrolling
+    </pre>
+  </div>
+);
+story2.title = 'story with 100vh padding 2';
diff --git a/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap b/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
index 977241abe86..b5869257c93 100644
--- a/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
+++ b/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
@@ -2641,7 +2641,19 @@ exports[`Storyshots Core|Parameters passed to story 1`] = `
     "hierarchySeparator": {},
     "name": "Storybook"
   },
-  "a11y": {},
+  "a11y": {
+    "configure": {},
+    "options": {
+      "checks": {
+        "color-contrast": {
+          "options": {
+            "noScroll": true
+          }
+        }
+      },
+      "restoreScroll": true
+    }
+  },
   "viewports": {
     "iphone5": {
       "name": "iPhone 5",
@@ -2811,6 +2823,34 @@ exports[`Storyshots Core|Parameters passed to story 1`] = `
 </pre>
 `;
 
+exports[`Storyshots Core|Scroll story with 100vh padding 1 1`] = `
+<div>
+  <pre>
+    START, when switching stories, you should be able to read this at the top of the page
+  </pre>
+  <div
+    style="height:100vh"
+  />
+  <pre>
+    END, this text should be below the scroll "fold" and therefore only be readable after scrolling
+  </pre>
+</div>
+`;
+
+exports[`Storyshots Core|Scroll story with 100vh padding 2 1`] = `
+<div>
+  <pre>
+    START, when switching stories, you should be able to read this at the top of the page
+  </pre>
+  <div
+    style="height:100vh"
+  />
+  <pre>
+    END, this text should be below the scroll "fold" and therefore only be readable after scrolling
+  </pre>
+</div>
+`;
+
 exports[`Storyshots UI|Notifications/NotificationItem longText 1`] = `
 .emotion-1 {
   display: block;
diff --git a/lib/core/src/client/preview/start.js b/lib/core/src/client/preview/start.js
index 670293398e9..deaa08b6774 100644
--- a/lib/core/src/client/preview/start.js
+++ b/lib/core/src/client/preview/start.js
@@ -131,11 +131,6 @@ export default function start(render, { decorateStory } = {}) {
         return;
       }
 
-      if (!forceRender) {
-        // Scroll to top of the page when changing story
-        document.documentElement.scrollTop = 0;
-      }
-
       if (!forceRender && previousKind && previousStory) {
         addons.getChannel().emit(Events.STORY_CHANGED, id);
       }
@@ -155,6 +150,10 @@ export default function start(render, { decorateStory } = {}) {
     previousRevision = revision;
     previousKind = kind;
     previousStory = name;
+
+    if (!forceRender) {
+      document.documentElement.scrollTop = 0;
+    }
   };
 
   // initialize the UI

From 8cd14c26f70e504c7e29b3df48e02d8b9fbaa4ce Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Fri, 22 Feb 2019 14:37:20 +0800
Subject: [PATCH 061/249] Merge pull request #5705 from
 storybooks/fix/debugger-in-code

Core: Clean up debug logging
---
 lib/channel-postmessage/package.json |  1 +
 lib/channel-postmessage/src/index.ts | 11 +++++------
 lib/client-logger/src/index.test.ts  | 14 +++++++++++++-
 lib/client-logger/src/index.ts       |  6 +++++-
 4 files changed, 24 insertions(+), 8 deletions(-)

diff --git a/lib/channel-postmessage/package.json b/lib/channel-postmessage/package.json
index eb73a9c0daa..f9601d41637 100644
--- a/lib/channel-postmessage/package.json
+++ b/lib/channel-postmessage/package.json
@@ -21,6 +21,7 @@
   },
   "dependencies": {
     "@storybook/channels": "5.0.0-rc.4",
+    "@storybook/client-logger": "5.0.0-rc.4",
     "global": "^4.3.2",
     "telejson": "^1.0.1"
   },
diff --git a/lib/channel-postmessage/src/index.ts b/lib/channel-postmessage/src/index.ts
index 90f23cc4968..25d672a6e23 100644
--- a/lib/channel-postmessage/src/index.ts
+++ b/lib/channel-postmessage/src/index.ts
@@ -1,5 +1,7 @@
 import { window, document } from 'global';
 import Channel, { ChannelEvent, ChannelHandler } from '@storybook/channels';
+import { logger } from '@storybook/client-logger';
+
 import { isJSON, parse, stringify } from 'telejson';
 
 interface RawEvent {
@@ -90,15 +92,12 @@ export class PostmsgTransport {
       const { data } = rawEvent;
       const { key, event } = typeof data === 'string' && isJSON(data) ? parse(data) : data;
       if (key === KEY) {
-        // tslint:disable-next-line no-console
-        console.debug(`message arrived at ${this.config.page}`, event.type, ...event.args);
+        logger.debug(`message arrived at ${this.config.page}`, event.type, ...event.args);
         this.handler(event);
       }
     } catch (error) {
-      // tslint:disable-next-line no-console
-      console.error(error);
-      // tslint:disable-next-line no-debugger
-      debugger;
+      logger.error(error);
+      // debugger;
     }
   }
 }
diff --git a/lib/client-logger/src/index.test.ts b/lib/client-logger/src/index.test.ts
index ee9eaf5dfa8..0d2bc5782bc 100644
--- a/lib/client-logger/src/index.test.ts
+++ b/lib/client-logger/src/index.test.ts
@@ -3,17 +3,29 @@ import { logger } from '.';
 describe('client-logger', () => {
   const initialConsole = { ...global.console };
   beforeEach(() => {
+    global.console.debug = jest.fn();
     global.console.log = jest.fn();
+    global.console.info = jest.fn();
     global.console.warn = jest.fn();
     global.console.error = jest.fn();
   });
   afterAll(() => {
     global.console = initialConsole;
   });
+  it('should have an debug method that displays the message in red, with a trace', () => {
+    const message = 'debug message';
+    logger.debug(message);
+    expect(global.console.debug).toHaveBeenCalledWith(message);
+  });
+  it('should have an log method that displays the message in red, with a trace', () => {
+    const message = 'log message';
+    logger.log(message);
+    expect(global.console.log).toHaveBeenCalledWith(message);
+  });
   it('should have an info method that displays the message', () => {
     const message = 'information';
     logger.info(message);
-    expect(global.console.log).toHaveBeenCalledWith(message);
+    expect(global.console.info).toHaveBeenCalledWith(message);
   });
   it('should have a warning method that displays the message in yellow, with a trace', () => {
     const message = 'warning message';
diff --git a/lib/client-logger/src/index.ts b/lib/client-logger/src/index.ts
index 77a01d8b4d4..c501e05b99e 100644
--- a/lib/client-logger/src/index.ts
+++ b/lib/client-logger/src/index.ts
@@ -1,7 +1,11 @@
 const { console } = global;
 
+/* tslint:disable: no-console */
+
 export const logger = {
-  info: (message: any, ...rest: any[]): void => console.log(message, ...rest),
+  debug: (message: any, ...rest: any[]): void => console.debug(message, ...rest),
+  log: (message: any, ...rest: any[]): void => console.log(message, ...rest),
+  info: (message: any, ...rest: any[]): void => console.info(message, ...rest),
   warn: (message: any, ...rest: any[]): void => console.warn(message, ...rest),
   error: (message: any, ...rest: any[]): void => console.error(message, ...rest),
 };

From 4c2f678d8387295b5c0e4b33292e2aa342167c35 Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Fri, 22 Feb 2019 23:55:13 +0800
Subject: [PATCH 062/249] Merge pull request #5722 from
 storybooks/fix/theming-broken

Fix/theming broken
---
 addons/a11y/src/index.js                        |  4 ++--
 addons/cssresources/package.json                |  1 -
 .../server/manager/manager-webpack.config.js    | 17 -----------------
 lib/theming/package.json                        |  4 ++--
 lib/ui/paths.js                                 | 12 ++++++++++++
 lib/ui/scripts/createDlls.js                    |  3 +++
 6 files changed, 19 insertions(+), 22 deletions(-)

diff --git a/addons/a11y/src/index.js b/addons/a11y/src/index.js
index 8875e938a7b..dd18397d73d 100644
--- a/addons/a11y/src/index.js
+++ b/addons/a11y/src/index.js
@@ -9,7 +9,7 @@ import EVENTS, { PARAM_KEY } from './constants';
 
 const channel = addons.getChannel();
 let progress = Promise.resolve();
-let setup;
+let setup = {};
 
 const getElement = () => {
   const storyRoot = document.getElementById('story-root');
@@ -48,7 +48,7 @@ export const withA11Y = makeDecorator({
   allowDeprecatedUsage: false,
 
   wrapper: (getStory, context, opt) => {
-    setup = opt.parameters || opt.options;
+    setup = opt.parameters || opt.options || {};
 
     return getStory(context);
   },
diff --git a/addons/cssresources/package.json b/addons/cssresources/package.json
index cf41437f1e8..c9e10352007 100644
--- a/addons/cssresources/package.json
+++ b/addons/cssresources/package.json
@@ -24,7 +24,6 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@emotion/styled": "10.0.6",
     "@storybook/addons": "5.0.0-rc.4",
     "@storybook/channels": "5.0.0-rc.4",
     "@storybook/components": "5.0.0-rc.4",
diff --git a/lib/core/src/server/manager/manager-webpack.config.js b/lib/core/src/server/manager/manager-webpack.config.js
index b78077a2ed8..739aeed1e5b 100644
--- a/lib/core/src/server/manager/manager-webpack.config.js
+++ b/lib/core/src/server/manager/manager-webpack.config.js
@@ -16,15 +16,6 @@ const coreDirName = path.dirname(require.resolve('@storybook/core/package.json')
 const context = path.join(coreDirName, '../../node_modules');
 const cacheDir = findCacheDir({ name: 'storybook' });
 
-const storybookPackages = [
-  '@storybook/router',
-  '@storybook/theming',
-  '@storybook/channels',
-  '@storybook/client-api',
-  '@storybook/core',
-  '@storybook/ui',
-];
-
 export default ({ configDir, configType, entries, dll, outputDir, cache, babelOptions }) => {
   const { raw, stringified } = loadEnv();
   const isProd = configType === 'PRODUCTION';
@@ -74,14 +65,6 @@ export default ({ configDir, configType, entries, dll, outputDir, cache, babelOp
       extensions: ['.mjs', '.js', '.jsx', '.json'],
       modules: ['node_modules'].concat(raw.NODE_PATH || []),
       alias: {
-        'core-js': path.dirname(require.resolve('core-js/package.json')),
-        ...storybookPackages.reduce(
-          (acc, i) =>
-            Object.assign(acc, {
-              [i]: path.dirname(require.resolve(`${i}/package.json`)),
-            }),
-          {}
-        ),
         ...uiPaths,
       },
     },
diff --git a/lib/theming/package.json b/lib/theming/package.json
index abfd8d6d471..831f7cac278 100644
--- a/lib/theming/package.json
+++ b/lib/theming/package.json
@@ -19,8 +19,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@emotion/core": "^10.0.5",
-    "@emotion/styled": "^10.0.5",
+    "@emotion/core": "^10.0.7",
+    "@emotion/styled": "^10.0.7",
     "@storybook/client-logger": "5.0.0-rc.4",
     "common-tags": "^1.8.0",
     "deep-object-diff": "^1.1.0",
diff --git a/lib/ui/paths.js b/lib/ui/paths.js
index baeaf0feb63..7d032622154 100644
--- a/lib/ui/paths.js
+++ b/lib/ui/paths.js
@@ -3,6 +3,18 @@ const { dirname } = require('path');
 // These paths need to be aliased in the manager webpack config to ensure that all
 // code running inside the manager uses the *same* version of react[-dom] that we use.
 module.exports = {
+  '@emotion/core': dirname(require.resolve('@emotion/core/package.json')),
+  '@emotion/styled': dirname(require.resolve('@emotion/styled/package.json')),
+  '@storybook/addons': dirname(require.resolve('@storybook/addons/package.json')),
+  '@storybook/channels': dirname(require.resolve('@storybook/channels/package.json')),
+  '@storybook/components': dirname(require.resolve('@storybook/components/package.json')),
+  '@storybook/core-events': dirname(require.resolve('@storybook/core-events/package.json')),
+  '@storybook/router': dirname(require.resolve('@storybook/router/package.json')),
+  '@storybook/theming': dirname(require.resolve('@storybook/theming/package.json')),
+  '@storybook/ui': dirname(require.resolve('@storybook/ui/package.json')),
+  'core-js': dirname(require.resolve('core-js/package.json')),
+  'emotion-theming': dirname(require.resolve('emotion-theming/package.json')),
+  'prop-types': dirname(require.resolve('prop-types/package.json')),
   react: dirname(require.resolve('react/package.json')),
   'react-dom': dirname(require.resolve('react-dom/package.json')),
 };
diff --git a/lib/ui/scripts/createDlls.js b/lib/ui/scripts/createDlls.js
index 08a106a5548..e586b0cc83c 100644
--- a/lib/ui/scripts/createDlls.js
+++ b/lib/ui/scripts/createDlls.js
@@ -20,6 +20,8 @@ const run = () =>
     config({
       entry: {
         storybook_ui: [
+          '@emotion/core',
+          '@emotion/styled',
           '@storybook/addons',
           '@storybook/core-events',
           '@storybook/theming',
@@ -27,6 +29,7 @@ const run = () =>
           'airbnb-js-shims',
           'core-js/es6/symbol',
           'core-js/fn/array/iterator',
+          'emotion-theming',
           'prop-types',
           'react-dom',
           'react',

From afb80a60201dbff3140a8b7db21f41b861f4eaa0 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Sat, 23 Feb 2019 00:00:29 +0800
Subject: [PATCH 063/249] Update yarn.lock

---
 yarn.lock | 50 +++++++++++++++++++++++++++++++++++++++++++++++++-
 1 file changed, 49 insertions(+), 1 deletion(-)

diff --git a/yarn.lock b/yarn.lock
index 82f320aa5cf..177461cc029 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1123,6 +1123,16 @@
     "@emotion/utils" "0.11.1"
     "@emotion/weak-memoize" "0.2.2"
 
+"@emotion/cache@^10.0.7":
+  version "10.0.7"
+  resolved "https://registry.yarnpkg.com/@emotion/cache/-/cache-10.0.7.tgz#6221de2e939f62022c04b4df2c165ce577809f23"
+  integrity sha512-wscXuawG+nQhSNbDpJdAqvv5d2g1O+fpwf/wD/CAmW/wsuN8hNzahWh2ldSVakqO9sINewyQNFl74IeDeTkRZg==
+  dependencies:
+    "@emotion/sheet" "0.9.2"
+    "@emotion/stylis" "0.8.3"
+    "@emotion/utils" "0.11.1"
+    "@emotion/weak-memoize" "0.2.2"
+
 "@emotion/core@^10.0.5":
   version "10.0.6"
   resolved "https://registry.yarnpkg.com/@emotion/core/-/core-10.0.6.tgz#c10d7884a525728f05589b31da1c804a5d7449fa"
@@ -1133,6 +1143,17 @@
     "@emotion/sheet" "0.9.2"
     "@emotion/utils" "0.11.1"
 
+"@emotion/core@^10.0.7":
+  version "10.0.7"
+  resolved "https://registry.yarnpkg.com/@emotion/core/-/core-10.0.7.tgz#a894324b944cb06dcd36813afe35f07b0ed8d20d"
+  integrity sha512-f5ZeA8R5mTiD2VDFCy6kRTXrQXN/1s79WPvEZZSwROJIyy9mHBB0/Lxg9BSIXfFdXryVw76kHNehTcBkgDYS7A==
+  dependencies:
+    "@emotion/cache" "^10.0.7"
+    "@emotion/css" "^10.0.7"
+    "@emotion/serialize" "^0.11.4"
+    "@emotion/sheet" "0.9.2"
+    "@emotion/utils" "0.11.1"
+
 "@emotion/css@^10.0.6":
   version "10.0.6"
   resolved "https://registry.yarnpkg.com/@emotion/css/-/css-10.0.6.tgz#50b325e6ee18f0ca791036149a985e3b40a9354b"
@@ -1141,6 +1162,15 @@
     "@emotion/utils" "0.11.1"
     babel-plugin-emotion "^10.0.6"
 
+"@emotion/css@^10.0.7":
+  version "10.0.7"
+  resolved "https://registry.yarnpkg.com/@emotion/css/-/css-10.0.7.tgz#fbee607e07aeea444b147719b6472612fff9199b"
+  integrity sha512-r8JuPanNW0+ftBKFSna+6p5X7ewvU8d8NaNBlFjdPYl7xmtbDmoz8E7ceXqF4QgdRH4FBFIIRFzTA4Y05JwkIw==
+  dependencies:
+    "@emotion/serialize" "^0.11.4"
+    "@emotion/utils" "0.11.1"
+    babel-plugin-emotion "^10.0.7"
+
 "@emotion/hash@0.7.1":
   version "0.7.1"
   resolved "https://registry.yarnpkg.com/@emotion/hash/-/hash-0.7.1.tgz#9833722341379fb7d67f06a4b00ab3c37913da53"
@@ -1195,13 +1225,31 @@
     "@emotion/utils" "0.11.1"
     object-assign "^4.1.1"
 
-"@emotion/styled@10.0.6", "@emotion/styled@^10.0.5":
+"@emotion/styled-base@^10.0.7":
+  version "10.0.7"
+  resolved "https://registry.yarnpkg.com/@emotion/styled-base/-/styled-base-10.0.7.tgz#87cee1043ffdf17690bdd96d7269a21f705bf224"
+  integrity sha512-wdYHs5bNXBtC9yuQzKP8Ue8K4VWcQ/dQApP4br/8JLuOw5Zxa6Vxtc1JpxnBhi1OSWKjqHGpd7XFETOr6gCHJg==
+  dependencies:
+    "@emotion/is-prop-valid" "0.7.3"
+    "@emotion/serialize" "^0.11.4"
+    "@emotion/utils" "0.11.1"
+    object-assign "^4.1.1"
+
+"@emotion/styled@^10.0.5":
   version "10.0.6"
   resolved "https://registry.yarnpkg.com/@emotion/styled/-/styled-10.0.6.tgz#e6591cf7b0fd56e82a0ae7e421568229e7c6d5f9"
   dependencies:
     "@emotion/styled-base" "^10.0.5"
     babel-plugin-emotion "^10.0.6"
 
+"@emotion/styled@^10.0.7":
+  version "10.0.7"
+  resolved "https://registry.yarnpkg.com/@emotion/styled/-/styled-10.0.7.tgz#e36c84bf14435127481a1ea0b038d64a15c13995"
+  integrity sha512-H/7wi2bFYl6GdxBPYef0FNYay1ay5iKFGYxmkuH8WJZnDc/bf1Bx+lH9IQ+QujAMgmAtUHwJsgO2vwj0LEIYcg==
+  dependencies:
+    "@emotion/styled-base" "^10.0.7"
+    babel-plugin-emotion "^10.0.7"
+
 "@emotion/stylis@0.8.3":
   version "0.8.3"
   resolved "https://registry.yarnpkg.com/@emotion/stylis/-/stylis-0.8.3.tgz#3ca7e9bcb31b3cb4afbaeb66156d86ee85e23246"

From fe799d6446f8449c11aff24b495f30cbd9fcd07f Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Sat, 23 Feb 2019 00:06:42 +0800
Subject: [PATCH 064/249] 5.0.0-rc.5 changelog

---
 CHANGELOG.md | 13 +++++++++++++
 1 file changed, 13 insertions(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 9aa0f537135..a0ca43dca6d 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,16 @@
+## 5.0.0-rc.5 (February 23, 2019)
+
+### Bug Fixes
+
+* UI: Fix `/` search hotkey so it doesn't type into the input ([#5702](https://github.com/storybooks/storybook/pull/5702))
+* Addon-a11y: Fix a11y setup being undefined ([#5724](https://github.com/storybooks/storybook/pull/5724))
+* UI: Fix duplicate theming packages ([#5722](https://github.com/storybooks/storybook/pull/5722))
+* Core: Clean up debug logging ([#5705](https://github.com/storybooks/storybook/pull/5705))
+* UI: Minor addon ux tweaks ([#5712](https://github.com/storybooks/storybook/pull/5712))
+* Addon-a11y: Fix story scrolling ([#5713](https://github.com/storybooks/storybook/pull/5713))
+* UI: Fix mobile styling ([#5709](https://github.com/storybooks/storybook/pull/5709))
+* UI: Fix tooltip bugs ([#5692](https://github.com/storybooks/storybook/pull/5692))
+
 ## 5.0.0-rc.4 (February 21, 2019)
 
 ### Features

From 12f59330c918d9c576d2dc9b455762db78d44550 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Sat, 23 Feb 2019 10:29:20 +0800
Subject: [PATCH 065/249] Add RN to workspace but make private

---
 addons/ondevice-backgrounds/package.json      |    5 +-
 addons/ondevice-knobs/package.json            |    7 +-
 addons/ondevice-notes/package.json            |    7 +-
 app/react-native/package.json                 |   15 +-
 .../__snapshots__/storyshots.test.js.snap     |   38 +
 lib/cli/package.json                          |    2 +-
 .../tabs/__snapshots__/tabs.stories.storyshot |  980 ++++-----
 .../__snapshots__/panel.stories.storyshot     |   19 +
 .../__snapshots__/preview.stories.storyshot   |   38 +
 .../__snapshots__/about.stories.storyshot     |   57 +
 package.json                                  |    4 +-
 yarn.lock                                     | 1821 +++++++++++++----
 12 files changed, 2086 insertions(+), 907 deletions(-)

diff --git a/addons/ondevice-backgrounds/package.json b/addons/ondevice-backgrounds/package.json
index a72f069af23..909f69039dd 100644
--- a/addons/ondevice-backgrounds/package.json
+++ b/addons/ondevice-backgrounds/package.json
@@ -1,6 +1,7 @@
 {
   "name": "@storybook/addon-ondevice-backgrounds",
-  "version": "5.0.0-beta.4",
+  "private": true,
+  "version": "5.0.0-rc.4",
   "description": "A storybook addon to show different backgrounds for your preview",
   "keywords": [
     "addon",
@@ -23,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-beta.4",
+    "@storybook/addons": "5.0.0-rc.4",
     "core-js": "^2.6.2",
     "prop-types": "^15.6.2"
   },
diff --git a/addons/ondevice-knobs/package.json b/addons/ondevice-knobs/package.json
index 7d4b7ab124f..947c86a37ae 100644
--- a/addons/ondevice-knobs/package.json
+++ b/addons/ondevice-knobs/package.json
@@ -1,6 +1,7 @@
 {
   "name": "@storybook/addon-ondevice-knobs",
-  "version": "5.0.0-beta.4",
+  "private": true,
+  "version": "5.0.0-rc.4",
   "description": "Display storybook story knobs on your deviced.",
   "keywords": [
     "addon",
@@ -20,7 +21,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-beta.4",
+    "@storybook/addons": "5.0.0-rc.4",
     "core-js": "^2.6.2",
     "deep-equal": "^1.0.1",
     "prop-types": "^15.6.2",
@@ -35,6 +36,6 @@
     "react-native": "*"
   },
   "publishConfig": {
-    "access": "public"
+    "private": true
   }
 }
diff --git a/addons/ondevice-notes/package.json b/addons/ondevice-notes/package.json
index d053b2906a7..714c2b86bb7 100644
--- a/addons/ondevice-notes/package.json
+++ b/addons/ondevice-notes/package.json
@@ -1,6 +1,7 @@
 {
   "name": "@storybook/addon-ondevice-notes",
-  "version": "5.0.0-beta.4",
+  "private": true,
+  "version": "5.0.0-rc.4",
   "description": "Write notes for your Storybook stories.",
   "keywords": [
     "addon",
@@ -18,7 +19,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-beta.4",
+    "@storybook/addons": "5.0.0-rc.4",
     "core-js": "^2.6.2",
     "prop-types": "^15.6.2",
     "react-native-simple-markdown": "^1.1.0"
@@ -28,6 +29,6 @@
     "react-native": "*"
   },
   "publishConfig": {
-    "access": "public"
+    "private": true
   }
 }
diff --git a/app/react-native/package.json b/app/react-native/package.json
index 5da9a7c22ae..7416b9511d2 100644
--- a/app/react-native/package.json
+++ b/app/react-native/package.json
@@ -1,6 +1,7 @@
 {
   "name": "@storybook/react-native",
-  "version": "5.0.0-beta.4",
+  "private": true,
+  "version": "5.0.0-rc.4",
   "description": "A better way to develop React Native Components for your app",
   "keywords": [
     "react",
@@ -25,12 +26,12 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-beta.4",
-    "@storybook/channel-websocket": "5.0.0-beta.4",
-    "@storybook/channels": "5.0.0-beta.4",
-    "@storybook/core": "5.0.0-beta.4",
-    "@storybook/core-events": "5.0.0-beta.4",
-    "@storybook/ui": "5.0.0-beta.4",
+    "@storybook/addons": "5.0.0-rc.4",
+    "@storybook/channel-websocket": "5.0.0-rc.4",
+    "@storybook/channels": "5.0.0-rc.4",
+    "@storybook/core": "5.0.0-rc.4",
+    "@storybook/core-events": "5.0.0-rc.4",
+    "@storybook/ui": "5.0.0-rc.4",
     "babel-loader": "^8.0.4",
     "babel-plugin-macros": "^2.4.5",
     "babel-plugin-syntax-async-functions": "^6.13.0",
diff --git a/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap b/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
index b5869257c93..2e03b4a5771 100644
--- a/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
+++ b/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
@@ -3393,11 +3393,30 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
 }
 
+.emotion-8:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
 .emotion-8::-webkit-scrollbar {
   height: 3px;
   width: 3px;
   background: transparent;
   box-shadow: none;
+  display: none;
+}
+
+.emotion-8:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
 }
 
 .emotion-8::-webkit-scrollbar-track {
@@ -3905,11 +3924,30 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
 }
 
+.emotion-8:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
 .emotion-8::-webkit-scrollbar {
   height: 3px;
   width: 3px;
   background: transparent;
   box-shadow: none;
+  display: none;
+}
+
+.emotion-8:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
 }
 
 .emotion-8::-webkit-scrollbar-track {
diff --git a/lib/cli/package.json b/lib/cli/package.json
index ef1780c63d4..cb3e8b22956 100644
--- a/lib/cli/package.json
+++ b/lib/cli/package.json
@@ -64,7 +64,7 @@
     "@storybook/polymer": "5.0.0-rc.4",
     "@storybook/preact": "5.0.0-rc.4",
     "@storybook/react": "5.0.0-rc.4",
-    "@storybook/react-native": "5.0.0-beta.4",
+    "@storybook/react-native": "5.0.0-rc.4",
     "@storybook/riot": "5.0.0-rc.4",
     "@storybook/ui": "5.0.0-rc.4",
     "@storybook/vue": "5.0.0-rc.4"
diff --git a/lib/components/src/tabs/__snapshots__/tabs.stories.storyshot b/lib/components/src/tabs/__snapshots__/tabs.stories.storyshot
index ab62c31c611..ec79f2959e4 100644
--- a/lib/components/src/tabs/__snapshots__/tabs.stories.storyshot
+++ b/lib/components/src/tabs/__snapshots__/tabs.stories.storyshot
@@ -1,6 +1,76 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Storyshots Basics|Tabs stateful - dynamic 1`] = `
+.emotion-9 {
+  color: #999999;
+  height: 40px;
+  overflow: auto;
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-9:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
+.emotion-9::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+  display: none;
+}
+
+.emotion-9:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
+}
+
+.emotion-9::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-9::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-9::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
+}
+
 .emotion-8 {
   display: -webkit-box;
   display: -webkit-flex;
@@ -134,76 +204,6 @@ exports[`Storyshots Basics|Tabs stateful - dynamic 1`] = `
   display: block;
 }
 
-.emotion-9 {
-  color: #999999;
-  height: 40px;
-  overflow: auto;
-  overflow-x: auto;
-  overflow-y: hidden;
-  -webkit-scrollbar-width: slim;
-  -moz-scrollbar-width: slim;
-  -ms-scrollbar-width: slim;
-  scrollbar-width: slim;
-  -webkit-scrollbar-width: 3px;
-  -moz-scrollbar-width: 3px;
-  -ms-scrollbar-width: 3px;
-  scrollbar-width: 3px;
-  -webkit-scrollbar-color: transparent transparent;
-  -moz-scrollbar-color: transparent transparent;
-  -ms-scrollbar-color: transparent transparent;
-  scrollbar-color: transparent transparent;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
-}
-
-.emotion-9:hover {
-  -webkit-scrollbar-width: none;
-  -moz-scrollbar-width: none;
-  -ms-scrollbar-width: none;
-  scrollbar-width: none;
-  -webkit-scrollbar-width: 0;
-  -moz-scrollbar-width: 0;
-  -ms-scrollbar-width: 0;
-  scrollbar-width: 0;
-}
-
-.emotion-9::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  box-shadow: none;
-  display: none;
-}
-
-.emotion-9:hover::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  display: block;
-}
-
-.emotion-9::-webkit-scrollbar-track {
-  border-radius: 0;
-  background: transparent;
-  opacity: 0;
-  border: 0 none;
-  box-shadow: none;
-  height: 0;
-  width: 0;
-}
-
-.emotion-9::-webkit-scrollbar-thumb {
-  border-radius: 0;
-  background: rgba(0,0,0,.1);
-  box-shadow: none;
-}
-
-.emotion-9::-webkit-scrollbar-track-piece {
-  display: none;
-  border: 0 none;
-  opacity: 0;
-  visibility: hidden;
-}
-
 .emotion-11 {
   display: block;
   position: relative;
@@ -353,6 +353,76 @@ exports[`Storyshots Basics|Tabs stateful - dynamic 1`] = `
 `;
 
 exports[`Storyshots Basics|Tabs stateful - no initial 1`] = `
+.emotion-9 {
+  color: #999999;
+  height: 40px;
+  overflow: auto;
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-9:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
+.emotion-9::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+  display: none;
+}
+
+.emotion-9:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
+}
+
+.emotion-9::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-9::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-9::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
+}
+
 .emotion-8 {
   display: -webkit-box;
   display: -webkit-flex;
@@ -486,76 +556,6 @@ exports[`Storyshots Basics|Tabs stateful - no initial 1`] = `
   display: block;
 }
 
-.emotion-9 {
-  color: #999999;
-  height: 40px;
-  overflow: auto;
-  overflow-x: auto;
-  overflow-y: hidden;
-  -webkit-scrollbar-width: slim;
-  -moz-scrollbar-width: slim;
-  -ms-scrollbar-width: slim;
-  scrollbar-width: slim;
-  -webkit-scrollbar-width: 3px;
-  -moz-scrollbar-width: 3px;
-  -ms-scrollbar-width: 3px;
-  scrollbar-width: 3px;
-  -webkit-scrollbar-color: transparent transparent;
-  -moz-scrollbar-color: transparent transparent;
-  -ms-scrollbar-color: transparent transparent;
-  scrollbar-color: transparent transparent;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
-}
-
-.emotion-9:hover {
-  -webkit-scrollbar-width: none;
-  -moz-scrollbar-width: none;
-  -ms-scrollbar-width: none;
-  scrollbar-width: none;
-  -webkit-scrollbar-width: 0;
-  -moz-scrollbar-width: 0;
-  -ms-scrollbar-width: 0;
-  scrollbar-width: 0;
-}
-
-.emotion-9::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  box-shadow: none;
-  display: none;
-}
-
-.emotion-9:hover::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  display: block;
-}
-
-.emotion-9::-webkit-scrollbar-track {
-  border-radius: 0;
-  background: transparent;
-  opacity: 0;
-  border: 0 none;
-  box-shadow: none;
-  height: 0;
-  width: 0;
-}
-
-.emotion-9::-webkit-scrollbar-thumb {
-  border-radius: 0;
-  background: rgba(0,0,0,.1);
-  box-shadow: none;
-}
-
-.emotion-9::-webkit-scrollbar-track-piece {
-  display: none;
-  border: 0 none;
-  opacity: 0;
-  visibility: hidden;
-}
-
 .emotion-11 {
   display: block;
   position: relative;
@@ -661,6 +661,76 @@ exports[`Storyshots Basics|Tabs stateful - no initial 1`] = `
 `;
 
 exports[`Storyshots Basics|Tabs stateful - static 1`] = `
+.emotion-5 {
+  color: #999999;
+  height: 40px;
+  overflow: auto;
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-5:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
+.emotion-5::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+  display: none;
+}
+
+.emotion-5:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
+}
+
+.emotion-5::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-5::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-5::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
+}
+
 .emotion-4 {
   display: -webkit-box;
   display: -webkit-flex;
@@ -794,76 +864,6 @@ exports[`Storyshots Basics|Tabs stateful - static 1`] = `
   display: block;
 }
 
-.emotion-5 {
-  color: #999999;
-  height: 40px;
-  overflow: auto;
-  overflow-x: auto;
-  overflow-y: hidden;
-  -webkit-scrollbar-width: slim;
-  -moz-scrollbar-width: slim;
-  -ms-scrollbar-width: slim;
-  scrollbar-width: slim;
-  -webkit-scrollbar-width: 3px;
-  -moz-scrollbar-width: 3px;
-  -ms-scrollbar-width: 3px;
-  scrollbar-width: 3px;
-  -webkit-scrollbar-color: transparent transparent;
-  -moz-scrollbar-color: transparent transparent;
-  -ms-scrollbar-color: transparent transparent;
-  scrollbar-color: transparent transparent;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
-}
-
-.emotion-5:hover {
-  -webkit-scrollbar-width: none;
-  -moz-scrollbar-width: none;
-  -ms-scrollbar-width: none;
-  scrollbar-width: none;
-  -webkit-scrollbar-width: 0;
-  -moz-scrollbar-width: 0;
-  -ms-scrollbar-width: 0;
-  scrollbar-width: 0;
-}
-
-.emotion-5::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  box-shadow: none;
-  display: none;
-}
-
-.emotion-5:hover::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  display: block;
-}
-
-.emotion-5::-webkit-scrollbar-track {
-  border-radius: 0;
-  background: transparent;
-  opacity: 0;
-  border: 0 none;
-  box-shadow: none;
-  height: 0;
-  width: 0;
-}
-
-.emotion-5::-webkit-scrollbar-thumb {
-  border-radius: 0;
-  background: rgba(0,0,0,.1);
-  box-shadow: none;
-}
-
-.emotion-5::-webkit-scrollbar-track-piece {
-  display: none;
-  border: 0 none;
-  opacity: 0;
-  visibility: hidden;
-}
-
 .emotion-7 {
   display: block;
   position: relative;
@@ -927,6 +927,76 @@ exports[`Storyshots Basics|Tabs stateful - static 1`] = `
 `;
 
 exports[`Storyshots Basics|Tabs stateless - absolute 1`] = `
+.emotion-9 {
+  color: #999999;
+  height: 40px;
+  overflow: auto;
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-9:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
+.emotion-9::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+  display: none;
+}
+
+.emotion-9:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
+}
+
+.emotion-9::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-9::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-9::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
+}
+
 .emotion-8 {
   display: -webkit-box;
   display: -webkit-flex;
@@ -1068,76 +1138,6 @@ exports[`Storyshots Basics|Tabs stateless - absolute 1`] = `
   width: 100%;
 }
 
-.emotion-9 {
-  color: #999999;
-  height: 40px;
-  overflow: auto;
-  overflow-x: auto;
-  overflow-y: hidden;
-  -webkit-scrollbar-width: slim;
-  -moz-scrollbar-width: slim;
-  -ms-scrollbar-width: slim;
-  scrollbar-width: slim;
-  -webkit-scrollbar-width: 3px;
-  -moz-scrollbar-width: 3px;
-  -ms-scrollbar-width: 3px;
-  scrollbar-width: 3px;
-  -webkit-scrollbar-color: transparent transparent;
-  -moz-scrollbar-color: transparent transparent;
-  -ms-scrollbar-color: transparent transparent;
-  scrollbar-color: transparent transparent;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
-}
-
-.emotion-9:hover {
-  -webkit-scrollbar-width: none;
-  -moz-scrollbar-width: none;
-  -ms-scrollbar-width: none;
-  scrollbar-width: none;
-  -webkit-scrollbar-width: 0;
-  -moz-scrollbar-width: 0;
-  -ms-scrollbar-width: 0;
-  scrollbar-width: 0;
-}
-
-.emotion-9::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  box-shadow: none;
-  display: none;
-}
-
-.emotion-9:hover::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  display: block;
-}
-
-.emotion-9::-webkit-scrollbar-track {
-  border-radius: 0;
-  background: transparent;
-  opacity: 0;
-  border: 0 none;
-  box-shadow: none;
-  height: 0;
-  width: 0;
-}
-
-.emotion-9::-webkit-scrollbar-thumb {
-  border-radius: 0;
-  background: rgba(0,0,0,.1);
-  box-shadow: none;
-}
-
-.emotion-9::-webkit-scrollbar-track-piece {
-  display: none;
-  border: 0 none;
-  opacity: 0;
-  visibility: hidden;
-}
-
 .emotion-10 {
   display: none;
 }
@@ -1296,6 +1296,76 @@ exports[`Storyshots Basics|Tabs stateless - absolute 1`] = `
 `;
 
 exports[`Storyshots Basics|Tabs stateless - bordered 1`] = `
+.emotion-9 {
+  color: #999999;
+  height: 40px;
+  overflow: auto;
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-9:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
+.emotion-9::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+  display: none;
+}
+
+.emotion-9:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
+}
+
+.emotion-9::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-9::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-9::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
+}
+
 .emotion-8 {
   display: -webkit-box;
   display: -webkit-flex;
@@ -1425,76 +1495,6 @@ exports[`Storyshots Basics|Tabs stateless - bordered 1`] = `
   border-bottom-color: #1EA7FD;
 }
 
-.emotion-9 {
-  color: #999999;
-  height: 40px;
-  overflow: auto;
-  overflow-x: auto;
-  overflow-y: hidden;
-  -webkit-scrollbar-width: slim;
-  -moz-scrollbar-width: slim;
-  -ms-scrollbar-width: slim;
-  scrollbar-width: slim;
-  -webkit-scrollbar-width: 3px;
-  -moz-scrollbar-width: 3px;
-  -ms-scrollbar-width: 3px;
-  scrollbar-width: 3px;
-  -webkit-scrollbar-color: transparent transparent;
-  -moz-scrollbar-color: transparent transparent;
-  -ms-scrollbar-color: transparent transparent;
-  scrollbar-color: transparent transparent;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
-}
-
-.emotion-9:hover {
-  -webkit-scrollbar-width: none;
-  -moz-scrollbar-width: none;
-  -ms-scrollbar-width: none;
-  scrollbar-width: none;
-  -webkit-scrollbar-width: 0;
-  -moz-scrollbar-width: 0;
-  -ms-scrollbar-width: 0;
-  scrollbar-width: 0;
-}
-
-.emotion-9::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  box-shadow: none;
-  display: none;
-}
-
-.emotion-9:hover::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  display: block;
-}
-
-.emotion-9::-webkit-scrollbar-track {
-  border-radius: 0;
-  background: transparent;
-  opacity: 0;
-  border: 0 none;
-  box-shadow: none;
-  height: 0;
-  width: 0;
-}
-
-.emotion-9::-webkit-scrollbar-thumb {
-  border-radius: 0;
-  background: rgba(0,0,0,.1);
-  box-shadow: none;
-}
-
-.emotion-9::-webkit-scrollbar-track-piece {
-  display: none;
-  border: 0 none;
-  opacity: 0;
-  visibility: hidden;
-}
-
 .emotion-11 {
   display: block;
   position: relative;
@@ -1677,6 +1677,76 @@ exports[`Storyshots Basics|Tabs stateless - empty 1`] = `
 `;
 
 exports[`Storyshots Basics|Tabs stateless - no scrolling 1`] = `
+.emotion-9 {
+  color: #999999;
+  height: 40px;
+  overflow: auto;
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-9:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
+.emotion-9::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+  display: none;
+}
+
+.emotion-9:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
+}
+
+.emotion-9::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-9::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-9::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
+}
+
 .emotion-8 {
   display: -webkit-box;
   display: -webkit-flex;
@@ -1806,76 +1876,6 @@ exports[`Storyshots Basics|Tabs stateless - no scrolling 1`] = `
   border-bottom-color: #1EA7FD;
 }
 
-.emotion-9 {
-  color: #999999;
-  height: 40px;
-  overflow: auto;
-  overflow-x: auto;
-  overflow-y: hidden;
-  -webkit-scrollbar-width: slim;
-  -moz-scrollbar-width: slim;
-  -ms-scrollbar-width: slim;
-  scrollbar-width: slim;
-  -webkit-scrollbar-width: 3px;
-  -moz-scrollbar-width: 3px;
-  -ms-scrollbar-width: 3px;
-  scrollbar-width: 3px;
-  -webkit-scrollbar-color: transparent transparent;
-  -moz-scrollbar-color: transparent transparent;
-  -ms-scrollbar-color: transparent transparent;
-  scrollbar-color: transparent transparent;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
-}
-
-.emotion-9:hover {
-  -webkit-scrollbar-width: none;
-  -moz-scrollbar-width: none;
-  -ms-scrollbar-width: none;
-  scrollbar-width: none;
-  -webkit-scrollbar-width: 0;
-  -moz-scrollbar-width: 0;
-  -ms-scrollbar-width: 0;
-  scrollbar-width: 0;
-}
-
-.emotion-9::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  box-shadow: none;
-  display: none;
-}
-
-.emotion-9:hover::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  display: block;
-}
-
-.emotion-9::-webkit-scrollbar-track {
-  border-radius: 0;
-  background: transparent;
-  opacity: 0;
-  border: 0 none;
-  box-shadow: none;
-  height: 0;
-  width: 0;
-}
-
-.emotion-9::-webkit-scrollbar-thumb {
-  border-radius: 0;
-  background: rgba(0,0,0,.1);
-  box-shadow: none;
-}
-
-.emotion-9::-webkit-scrollbar-track-piece {
-  display: none;
-  border: 0 none;
-  opacity: 0;
-  visibility: hidden;
-}
-
 .emotion-11 {
   display: block;
   position: relative;
@@ -2031,6 +2031,76 @@ exports[`Storyshots Basics|Tabs stateless - no scrolling 1`] = `
 `;
 
 exports[`Storyshots Basics|Tabs stateless - with tools 1`] = `
+.emotion-10 {
+  color: #999999;
+  height: 40px;
+  overflow: auto;
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-10:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
+.emotion-10::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+  display: none;
+}
+
+.emotion-10:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
+}
+
+.emotion-10::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-10::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-10::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
+}
+
 .emotion-9 {
   display: -webkit-box;
   display: -webkit-flex;
@@ -2182,76 +2252,6 @@ exports[`Storyshots Basics|Tabs stateless - with tools 1`] = `
   display: block;
 }
 
-.emotion-10 {
-  color: #999999;
-  height: 40px;
-  overflow: auto;
-  overflow-x: auto;
-  overflow-y: hidden;
-  -webkit-scrollbar-width: slim;
-  -moz-scrollbar-width: slim;
-  -ms-scrollbar-width: slim;
-  scrollbar-width: slim;
-  -webkit-scrollbar-width: 3px;
-  -moz-scrollbar-width: 3px;
-  -ms-scrollbar-width: 3px;
-  scrollbar-width: 3px;
-  -webkit-scrollbar-color: transparent transparent;
-  -moz-scrollbar-color: transparent transparent;
-  -ms-scrollbar-color: transparent transparent;
-  scrollbar-color: transparent transparent;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
-}
-
-.emotion-10:hover {
-  -webkit-scrollbar-width: none;
-  -moz-scrollbar-width: none;
-  -ms-scrollbar-width: none;
-  scrollbar-width: none;
-  -webkit-scrollbar-width: 0;
-  -moz-scrollbar-width: 0;
-  -ms-scrollbar-width: 0;
-  scrollbar-width: 0;
-}
-
-.emotion-10::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  box-shadow: none;
-  display: none;
-}
-
-.emotion-10:hover::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  display: block;
-}
-
-.emotion-10::-webkit-scrollbar-track {
-  border-radius: 0;
-  background: transparent;
-  opacity: 0;
-  border: 0 none;
-  box-shadow: none;
-  height: 0;
-  width: 0;
-}
-
-.emotion-10::-webkit-scrollbar-thumb {
-  border-radius: 0;
-  background: rgba(0,0,0,.1);
-  box-shadow: none;
-}
-
-.emotion-10::-webkit-scrollbar-track-piece {
-  display: none;
-  border: 0 none;
-  opacity: 0;
-  visibility: hidden;
-}
-
 .emotion-12 {
   display: block;
   position: relative;
diff --git a/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot b/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot
index e35a7f00d1d..05d29aa2388 100644
--- a/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot
+++ b/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot
@@ -35,11 +35,30 @@ exports[`Storyshots UI|Panel default 1`] = `
   background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
 }
 
+.emotion-12:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
 .emotion-12::-webkit-scrollbar {
   height: 3px;
   width: 3px;
   background: transparent;
   box-shadow: none;
+  display: none;
+}
+
+.emotion-12:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
 }
 
 .emotion-12::-webkit-scrollbar-track {
diff --git a/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot b/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot
index a18ea1960d2..bfa51224a2a 100644
--- a/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot
+++ b/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot
@@ -122,11 +122,30 @@ Array [
   tranform: translateY(0px);
 }
 
+.emotion-23:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
 .emotion-23::-webkit-scrollbar {
   height: 3px;
   width: 3px;
   background: transparent;
   box-shadow: none;
+  display: none;
+}
+
+.emotion-23:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
 }
 
 .emotion-23::-webkit-scrollbar-track {
@@ -595,11 +614,30 @@ Array [
   tranform: translateY(0px);
 }
 
+.emotion-29:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
 .emotion-29::-webkit-scrollbar {
   height: 3px;
   width: 3px;
   background: transparent;
   box-shadow: none;
+  display: none;
+}
+
+.emotion-29:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
 }
 
 .emotion-29::-webkit-scrollbar-track {
diff --git a/lib/ui/src/settings/__snapshots__/about.stories.storyshot b/lib/ui/src/settings/__snapshots__/about.stories.storyshot
index 2df746c376d..813e83d8f1a 100644
--- a/lib/ui/src/settings/__snapshots__/about.stories.storyshot
+++ b/lib/ui/src/settings/__snapshots__/about.stories.storyshot
@@ -35,11 +35,30 @@ exports[`Storyshots UI|Settings/AboutScreen failed to fetch new version 1`] = `
   background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
 }
 
+.emotion-8:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
 .emotion-8::-webkit-scrollbar {
   height: 3px;
   width: 3px;
   background: transparent;
   box-shadow: none;
+  display: none;
+}
+
+.emotion-8:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
 }
 
 .emotion-8::-webkit-scrollbar-track {
@@ -585,11 +604,30 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
 }
 
+.emotion-8:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
 .emotion-8::-webkit-scrollbar {
   height: 3px;
   width: 3px;
   background: transparent;
   box-shadow: none;
+  display: none;
+}
+
+.emotion-8:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
 }
 
 .emotion-8::-webkit-scrollbar-track {
@@ -1954,11 +1992,30 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
 }
 
+.emotion-8:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
 .emotion-8::-webkit-scrollbar {
   height: 3px;
   width: 3px;
   background: transparent;
   box-shadow: none;
+  display: none;
+}
+
+.emotion-8:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
 }
 
 .emotion-8::-webkit-scrollbar-track {
diff --git a/package.json b/package.json
index 74931a45d07..f2e51d0acda 100644
--- a/package.json
+++ b/package.json
@@ -7,9 +7,9 @@
     "url": "https://github.com/storybooks/storybook.git"
   },
   "workspaces": [
-    "addons/!(ondevice)*",
+    "addons/*",
     "addons/storyshots/*",
-    "app/!(react-native)*",
+    "app/*",
     "lib/*",
     "examples/*",
     "lib/cli/test/run/*"
diff --git a/yarn.lock b/yarn.lock
index 177461cc029..10fd03d4689 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1114,15 +1114,6 @@
     find-root "^1.1.0"
     source-map "^0.7.2"
 
-"@emotion/cache@10.0.0":
-  version "10.0.0"
-  resolved "https://registry.yarnpkg.com/@emotion/cache/-/cache-10.0.0.tgz#e22eadcb770de4131ec707c84207e9e1ce210413"
-  dependencies:
-    "@emotion/sheet" "0.9.2"
-    "@emotion/stylis" "0.8.3"
-    "@emotion/utils" "0.11.1"
-    "@emotion/weak-memoize" "0.2.2"
-
 "@emotion/cache@^10.0.7":
   version "10.0.7"
   resolved "https://registry.yarnpkg.com/@emotion/cache/-/cache-10.0.7.tgz#6221de2e939f62022c04b4df2c165ce577809f23"
@@ -1133,16 +1124,6 @@
     "@emotion/utils" "0.11.1"
     "@emotion/weak-memoize" "0.2.2"
 
-"@emotion/core@^10.0.5":
-  version "10.0.6"
-  resolved "https://registry.yarnpkg.com/@emotion/core/-/core-10.0.6.tgz#c10d7884a525728f05589b31da1c804a5d7449fa"
-  dependencies:
-    "@emotion/cache" "10.0.0"
-    "@emotion/css" "^10.0.6"
-    "@emotion/serialize" "^0.11.3"
-    "@emotion/sheet" "0.9.2"
-    "@emotion/utils" "0.11.1"
-
 "@emotion/core@^10.0.7":
   version "10.0.7"
   resolved "https://registry.yarnpkg.com/@emotion/core/-/core-10.0.7.tgz#a894324b944cb06dcd36813afe35f07b0ed8d20d"
@@ -1154,14 +1135,6 @@
     "@emotion/sheet" "0.9.2"
     "@emotion/utils" "0.11.1"
 
-"@emotion/css@^10.0.6":
-  version "10.0.6"
-  resolved "https://registry.yarnpkg.com/@emotion/css/-/css-10.0.6.tgz#50b325e6ee18f0ca791036149a985e3b40a9354b"
-  dependencies:
-    "@emotion/serialize" "^0.11.3"
-    "@emotion/utils" "0.11.1"
-    babel-plugin-emotion "^10.0.6"
-
 "@emotion/css@^10.0.7":
   version "10.0.7"
   resolved "https://registry.yarnpkg.com/@emotion/css/-/css-10.0.7.tgz#fbee607e07aeea444b147719b6472612fff9199b"
@@ -1193,7 +1166,7 @@
   version "0.6.6"
   resolved "https://registry.yarnpkg.com/@emotion/memoize/-/memoize-0.6.6.tgz#004b98298d04c7ca3b4f50ca2035d4f60d2eed1b"
 
-"@emotion/serialize@^0.11.3", "@emotion/serialize@^0.11.4":
+"@emotion/serialize@^0.11.4":
   version "0.11.4"
   resolved "https://registry.yarnpkg.com/@emotion/serialize/-/serialize-0.11.4.tgz#691e615184a23cd3b9ae9b1eaa79eb8798e52379"
   dependencies:
@@ -1216,15 +1189,6 @@
   version "0.9.2"
   resolved "https://registry.yarnpkg.com/@emotion/sheet/-/sheet-0.9.2.tgz#74e5c6b5e489a1ba30ab246ab5eedd96916487c4"
 
-"@emotion/styled-base@^10.0.5":
-  version "10.0.5"
-  resolved "https://registry.yarnpkg.com/@emotion/styled-base/-/styled-base-10.0.5.tgz#3bc29e7efc4c04190de4f84fda9dc7e6dc18a885"
-  dependencies:
-    "@emotion/is-prop-valid" "0.7.3"
-    "@emotion/serialize" "^0.11.3"
-    "@emotion/utils" "0.11.1"
-    object-assign "^4.1.1"
-
 "@emotion/styled-base@^10.0.7":
   version "10.0.7"
   resolved "https://registry.yarnpkg.com/@emotion/styled-base/-/styled-base-10.0.7.tgz#87cee1043ffdf17690bdd96d7269a21f705bf224"
@@ -1235,13 +1199,6 @@
     "@emotion/utils" "0.11.1"
     object-assign "^4.1.1"
 
-"@emotion/styled@^10.0.5":
-  version "10.0.6"
-  resolved "https://registry.yarnpkg.com/@emotion/styled/-/styled-10.0.6.tgz#e6591cf7b0fd56e82a0ae7e421568229e7c6d5f9"
-  dependencies:
-    "@emotion/styled-base" "^10.0.5"
-    babel-plugin-emotion "^10.0.6"
-
 "@emotion/styled@^10.0.7":
   version "10.0.7"
   resolved "https://registry.yarnpkg.com/@emotion/styled/-/styled-10.0.7.tgz#e36c84bf14435127481a1ea0b038d64a15c13995"
@@ -1985,291 +1942,6 @@
   version "0.3.2"
   resolved "https://registry.yarnpkg.com/@sheerun/mutationobserver-shim/-/mutationobserver-shim-0.3.2.tgz#8013f2af54a2b7d735f71560ff360d3a8176a87b"
 
-"@storybook/addons@5.0.0-beta.4":
-  version "5.0.0-beta.4"
-  resolved "https://registry.yarnpkg.com/@storybook/addons/-/addons-5.0.0-beta.4.tgz#57e091695a0aa647f02dd9745de1789a5d276b14"
-  integrity sha512-BPa63CvUTTkuAcblFgw+SlNuwpU+coHbzcU4zUZIgIg9auTZG5CZrkYMzwBF1nQsCkiNtGzRW27WrmcP7ufO4g==
-  dependencies:
-    "@storybook/channels" "5.0.0-beta.4"
-    "@storybook/client-logger" "5.0.0-beta.4"
-    global "^4.3.2"
-    util-deprecate "^1.0.2"
-
-"@storybook/channel-postmessage@5.0.0-beta.4":
-  version "5.0.0-beta.4"
-  resolved "https://registry.yarnpkg.com/@storybook/channel-postmessage/-/channel-postmessage-5.0.0-beta.4.tgz#7a2c004b8ea2a8b90ad586cfa78f0e5dc06d81a1"
-  integrity sha512-zLgDZag8pWgM3LlnBCcDlthQ9CEOHuWXbDjwJ2hYYqHfZSsCphdaZlsi2wzRgBB5GovJYso4du3mwmRQYbMxPw==
-  dependencies:
-    "@storybook/channels" "5.0.0-beta.4"
-    global "^4.3.2"
-    telejson "^1.0.1"
-
-"@storybook/channel-websocket@5.0.0-beta.4":
-  version "5.0.0-beta.4"
-  resolved "https://registry.yarnpkg.com/@storybook/channel-websocket/-/channel-websocket-5.0.0-beta.4.tgz#280e3061d1b252f9f58a6b9fb356f5282bd4f186"
-  integrity sha512-mr+9fhEb+BKymG/ubs43ehJxfnKJ3bXNW9SEtiAJ7hDcGi6oxhWobt9hM84hf0sGKyQBHBG/L2dDIryQfiWRqg==
-  dependencies:
-    "@storybook/channels" "5.0.0-beta.4"
-    global "^4.3.2"
-    json-fn "^1.1.1"
-
-"@storybook/channels@5.0.0-beta.4":
-  version "5.0.0-beta.4"
-  resolved "https://registry.yarnpkg.com/@storybook/channels/-/channels-5.0.0-beta.4.tgz#e721fdfcd2a9593ff384edbfdae05ac62b2ffabc"
-  integrity sha512-la7VbasB6Dl1C22NrEb10Ilv/2RIeKPHmn1aaf6034OeAhPpCwdOnf0G4H9fNhEvm8qZIa7JhhDimxNchUD37w==
-
-"@storybook/client-api@5.0.0-beta.4":
-  version "5.0.0-beta.4"
-  resolved "https://registry.yarnpkg.com/@storybook/client-api/-/client-api-5.0.0-beta.4.tgz#6336a3703c10b5a9d374aa2ec00d11acb0f46333"
-  integrity sha512-brxGvLV46ebj5UQqOzZBkHrqueONTu7a3O7D42Wn+87zZ24uqy+SKIWItaRGvrkIdry/QlBQweLJsfhpw2OHRQ==
-  dependencies:
-    "@storybook/addons" "5.0.0-beta.4"
-    "@storybook/client-logger" "5.0.0-beta.4"
-    "@storybook/core-events" "5.0.0-beta.4"
-    common-tags "^1.8.0"
-    eventemitter3 "^3.1.0"
-    global "^4.3.2"
-    is-plain-object "^2.0.4"
-    lodash.debounce "^4.0.8"
-    lodash.isequal "^4.5.0"
-    lodash.mergewith "^4.6.1"
-    memoizerific "^1.11.3"
-    qs "^6.5.2"
-
-"@storybook/client-logger@5.0.0-beta.4":
-  version "5.0.0-beta.4"
-  resolved "https://registry.yarnpkg.com/@storybook/client-logger/-/client-logger-5.0.0-beta.4.tgz#005040cec6bfa2d2060d550f73567dcbdaa3b8a0"
-  integrity sha512-Nw8mCVZqTWAYO/sLOZmBDSUZPauyy07fRg+OISX9fplPOb9eFdv0PQhWPEeU6oE0f0tI9b2aQ1NAJeWpE+kV3Q==
-
-"@storybook/components@5.0.0-beta.4":
-  version "5.0.0-beta.4"
-  resolved "https://registry.yarnpkg.com/@storybook/components/-/components-5.0.0-beta.4.tgz#195b90be9aa895bc349345b0dab91bda4c05c0fc"
-  integrity sha512-9EfFx0sxcnWz2Q02T9OCLrEHsoy/dALBwWnujcle5LmUQ8AtJK6DMpxNg4JETd6Zk3m1d3h7oakSKR6W54h9VA==
-  dependencies:
-    "@storybook/addons" "5.0.0-beta.4"
-    "@storybook/client-logger" "5.0.0-beta.4"
-    "@storybook/core-events" "5.0.0-beta.4"
-    "@storybook/router" "5.0.0-beta.4"
-    "@storybook/theming" "5.0.0-beta.4"
-    global "^4.3.2"
-    immer "^1.12.0"
-    js-beautify "^1.8.9"
-    lodash.pick "^4.4.0"
-    lodash.throttle "^4.1.1"
-    memoizerific "^1.11.3"
-    polished "^2.3.3"
-    prop-types "^15.6.2"
-    react "^16.8.1"
-    react-dom "^16.8.1"
-    react-focus-lock "^1.17.7"
-    react-helmet-async "^0.2.0"
-    react-inspector "^2.3.0"
-    react-popper-tooltip "^2.8.0"
-    react-syntax-highlighter "^8.0.1"
-    react-textarea-autosize "^7.0.4"
-    reactjs-popup "^1.3.2"
-    recompose "^0.30.0"
-    render-fragment "^0.1.1"
-
-"@storybook/core-events@5.0.0-beta.4":
-  version "5.0.0-beta.4"
-  resolved "https://registry.yarnpkg.com/@storybook/core-events/-/core-events-5.0.0-beta.4.tgz#5964328f7259eafdbe14c976324a3488596c97f9"
-  integrity sha512-odmfS6fEuJQB5mu//ivblevxDCgQFr1Sqn0Ky1STTYbH6FKXhoRRsaMkGkjNZoyBPuKu9dmSW1MYy1MYZB6iiA==
-
-"@storybook/core@5.0.0-beta.4":
-  version "5.0.0-beta.4"
-  resolved "https://registry.yarnpkg.com/@storybook/core/-/core-5.0.0-beta.4.tgz#81062859c2d510364e354b6e475cd45d8d5486ad"
-  integrity sha512-rP2joiWTf8AvPgccEytjsW+Q+kuuhVSJGTNGg9ciBfMkmW2wab8/eZ4rtp/GkUKWjoWWyJZsc+ahkXTj88e1HA==
-  dependencies:
-    "@babel/plugin-proposal-class-properties" "^7.3.0"
-    "@babel/plugin-proposal-object-rest-spread" "^7.3.2"
-    "@babel/plugin-syntax-dynamic-import" "^7.2.0"
-    "@babel/plugin-transform-react-constant-elements" "^7.2.0"
-    "@babel/preset-env" "^7.3.1"
-    "@storybook/addons" "5.0.0-beta.4"
-    "@storybook/channel-postmessage" "5.0.0-beta.4"
-    "@storybook/client-api" "5.0.0-beta.4"
-    "@storybook/client-logger" "5.0.0-beta.4"
-    "@storybook/core-events" "5.0.0-beta.4"
-    "@storybook/node-logger" "5.0.0-beta.4"
-    "@storybook/theming" "5.0.0-beta.4"
-    "@storybook/ui" "5.0.0-beta.4"
-    airbnb-js-shims "^1 || ^2"
-    autoprefixer "^9.4.7"
-    babel-plugin-add-react-displayname "^0.0.5"
-    babel-plugin-emotion "^10.0.7"
-    babel-plugin-macros "^2.4.5"
-    babel-preset-minify "^0.5.0 || 0.6.0-alpha.5"
-    boxen "^2.1.0"
-    case-sensitive-paths-webpack-plugin "^2.2.0"
-    chalk "^2.4.2"
-    child-process-promise "^2.2.1"
-    cli-table3 "0.5.1"
-    commander "^2.19.0"
-    common-tags "^1.8.0"
-    core-js "^2.6.2"
-    css-loader "^2.1.0"
-    detect-port "^1.2.3"
-    dotenv-webpack "^1.7.0"
-    ejs "^2.6.1"
-    express "^4.16.3"
-    file-loader "^3.0.1"
-    file-system-cache "^1.0.5"
-    find-cache-dir "^2.0.0"
-    fs-extra "^7.0.1"
-    global "^4.3.2"
-    html-webpack-plugin "^4.0.0-beta.2"
-    inquirer "^6.2.0"
-    interpret "^1.2.0"
-    ip "^1.1.5"
-    json5 "^2.1.0"
-    lazy-universal-dotenv "^2.0.0"
-    node-fetch "^2.2.0"
-    object.omit "^3.0.0"
-    opn "^5.4.0"
-    postcss-flexbugs-fixes "^4.1.0"
-    postcss-loader "^3.0.0"
-    pretty-hrtime "^1.0.3"
-    prop-types "^15.6.2"
-    raw-loader "^1.0.0"
-    react-dev-utils "^7.0.0"
-    regenerator-runtime "^0.12.1"
-    resolve "^1.10.0"
-    resolve-from "^4.0.0"
-    semver "^5.6.0"
-    serve-favicon "^2.5.0"
-    shelljs "^0.8.2"
-    spawn-promise "^0.1.8"
-    style-loader "^0.23.1"
-    svg-url-loader "^2.3.2"
-    terser-webpack-plugin "^1.2.1"
-    url-loader "^1.1.2"
-    util-deprecate "^1.0.2"
-    webpack "^4.29.0"
-    webpack-dev-middleware "^3.5.1"
-    webpack-hot-middleware "^2.24.3"
-
-"@storybook/node-logger@5.0.0-beta.4":
-  version "5.0.0-beta.4"
-  resolved "https://registry.yarnpkg.com/@storybook/node-logger/-/node-logger-5.0.0-beta.4.tgz#db6e01f78005960d8ee1a5725df2dc85d7f30f7b"
-  integrity sha512-I4zm1jFEc1wMG/4/fLHFTO9GPEmoBjAgWE6pyc4CJnC7B7pU3JP66LGCc5N923oSNgrlY/biyUKnm3iLAJr6Og==
-  dependencies:
-    chalk "^2.4.2"
-    core-js "^2.6.2"
-    npmlog "^4.1.2"
-    pretty-hrtime "^1.0.3"
-    regenerator-runtime "^0.12.1"
-
-"@storybook/react-native@5.0.0-beta.4":
-  version "5.0.0-beta.4"
-  resolved "https://registry.yarnpkg.com/@storybook/react-native/-/react-native-5.0.0-beta.4.tgz#d0b9baea545e156ff4b65590019373eaebbb7a65"
-  integrity sha512-31+FStoAHSEC8G/0Ia9X+PzU3NDWTYbtC7oGXaaGVa+RFso1GOgAIEZR1mz5EAoUfYiqfnAjeyWt5djDxX621w==
-  dependencies:
-    "@storybook/addons" "5.0.0-beta.4"
-    "@storybook/channel-websocket" "5.0.0-beta.4"
-    "@storybook/channels" "5.0.0-beta.4"
-    "@storybook/core" "5.0.0-beta.4"
-    "@storybook/core-events" "5.0.0-beta.4"
-    "@storybook/ui" "5.0.0-beta.4"
-    babel-loader "^8.0.4"
-    babel-plugin-macros "^2.4.5"
-    babel-plugin-syntax-async-functions "^6.13.0"
-    babel-plugin-syntax-trailing-function-commas "^6.22.0"
-    babel-plugin-transform-class-properties "^6.24.1"
-    babel-plugin-transform-object-rest-spread "^6.23.0"
-    babel-plugin-transform-regenerator "^6.26.0"
-    babel-plugin-transform-runtime "^6.23.0"
-    babel-preset-env "^1.7.0"
-    babel-preset-minify "^0.5.0 || 0.6.0-alpha.5"
-    babel-preset-react "^6.24.1"
-    babel-runtime "^6.26.0"
-    case-sensitive-paths-webpack-plugin "^2.2.0"
-    commander "^2.19.0"
-    dotenv-webpack "^1.7.0"
-    ejs "^2.6.1"
-    express "^4.16.3"
-    find-cache-dir "^2.0.0"
-    global "^4.3.2"
-    html-webpack-plugin "^4.0.0-beta.2"
-    json5 "^2.1.0"
-    lazy-universal-dotenv "^2.0.0"
-    prop-types "^15.6.2"
-    raw-loader "^1.0.0"
-    react-dev-utils "^7.0.1"
-    react-native-swipe-gestures "^1.0.2"
-    shelljs "^0.8.2"
-    url-parse "^1.4.3"
-    uuid "^3.3.2"
-    webpack "^4.29.0"
-    webpack-dev-middleware "^3.5.1"
-    webpack-hot-middleware "^2.24.3"
-    ws "^6.1.3"
-
-"@storybook/router@5.0.0-beta.4":
-  version "5.0.0-beta.4"
-  resolved "https://registry.yarnpkg.com/@storybook/router/-/router-5.0.0-beta.4.tgz#7691698cb5ec03f81a32b8eadeb3d8856b7dc659"
-  integrity sha512-0w9MmLrwSanulVjvAewQ9qQNnkn9CSy/+YXkesNuI/FNzS88RbZUZW3N1LkWNc505cMA6Qro41hak41iv7ipXw==
-  dependencies:
-    "@reach/router" "^1.2.1"
-    "@storybook/theming" "5.0.0-beta.4"
-    global "^4.3.2"
-    memoizerific "^1.11.3"
-    qs "^6.5.2"
-
-"@storybook/theming@5.0.0-beta.4":
-  version "5.0.0-beta.4"
-  resolved "https://registry.yarnpkg.com/@storybook/theming/-/theming-5.0.0-beta.4.tgz#9b2d47b10e3bae8b0a76b399eccaa495013aeca2"
-  integrity sha512-xDHvV0jM6g21b9anjdk9L6TGK79itiYMoomTr4jkzERX0mgi0ENJCQbCE0q1G1XTQOOKSzvFSk0JSX1DzvZp9w==
-  dependencies:
-    "@emotion/core" "^10.0.5"
-    "@emotion/styled" "^10.0.5"
-    emotion-theming "^10.0.5"
-    global "^4.3.2"
-    memoizerific "^1.11.3"
-    prop-types "^15.6.2"
-    react-inspector "^2.3.1"
-
-"@storybook/ui@5.0.0-beta.4":
-  version "5.0.0-beta.4"
-  resolved "https://registry.yarnpkg.com/@storybook/ui/-/ui-5.0.0-beta.4.tgz#fade4069aa61b391d3237bcfa67b2faf4b5a0d9c"
-  integrity sha512-MpMltR79CUevWNrMvfH601zMP/UJ4mhrA021uYov9KbHI+FptSbyehemPFP83UYJw6oWWlBDwkOwSeFxJNCiQQ==
-  dependencies:
-    "@storybook/addons" "5.0.0-beta.4"
-    "@storybook/client-logger" "5.0.0-beta.4"
-    "@storybook/components" "5.0.0-beta.4"
-    "@storybook/core-events" "5.0.0-beta.4"
-    "@storybook/router" "5.0.0-beta.4"
-    "@storybook/theming" "5.0.0-beta.4"
-    eventemitter3 "^3.1.0"
-    fast-deep-equal "^2.0.1"
-    fuse.js "^3.3.1"
-    fuzzy-search "^3.0.1"
-    global "^4.3.2"
-    history "^4.7.2"
-    keycode "^2.2.0"
-    lodash.debounce "^4.0.8"
-    lodash.isequal "^4.5.0"
-    lodash.mergewith "^4.6.1"
-    lodash.pick "^4.4.0"
-    lodash.sortby "^4.7.0"
-    lodash.throttle "^4.1.1"
-    markdown-to-jsx "^6.9.1"
-    memoizerific "^1.11.3"
-    polished "^2.3.3"
-    prop-types "^15.6.2"
-    qs "^6.5.2"
-    react "^16.8.1"
-    react-dom "^16.8.1"
-    react-draggable "^3.1.1"
-    react-helmet-async "^0.2.0"
-    react-hotkeys "2.0.0-pre4"
-    react-lifecycles-compat "^3.0.4"
-    react-modal "^3.8.1"
-    react-resize-detector "^3.2.1"
-    recompose "^0.30.0"
-    to-camel-case "^1.0.0"
-    util-deprecate "^1.0.2"
-
 "@svgr/babel-plugin-add-jsx-attribute@^4.0.0":
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/@svgr/babel-plugin-add-jsx-attribute/-/babel-plugin-add-jsx-attribute-4.0.0.tgz#5acf239cd2747b1a36ec7e708de05d914cb9b948"
@@ -2984,13 +2656,26 @@ abbrev@1.0.x:
   version "1.0.9"
   resolved "https://registry.yarnpkg.com/abbrev/-/abbrev-1.0.9.tgz#91b4792588a7738c25f35dd6f63752a2f8776135"
 
-accepts@^1.3.5, accepts@~1.3.4, accepts@~1.3.5:
+absolute-path@^0.0.0:
+  version "0.0.0"
+  resolved "https://registry.yarnpkg.com/absolute-path/-/absolute-path-0.0.0.tgz#a78762fbdadfb5297be99b15d35a785b2f095bf7"
+  integrity sha1-p4di+9rftSl76ZsV01p4Wy8JW/c=
+
+accepts@^1.3.5, accepts@~1.3.0, accepts@~1.3.4, accepts@~1.3.5:
   version "1.3.5"
   resolved "https://registry.yarnpkg.com/accepts/-/accepts-1.3.5.tgz#eb777df6011723a3b14e8a72c0805c8e86746bd2"
   dependencies:
     mime-types "~2.1.18"
     negotiator "0.6.1"
 
+accepts@~1.2.12, accepts@~1.2.13:
+  version "1.2.13"
+  resolved "https://registry.yarnpkg.com/accepts/-/accepts-1.2.13.tgz#e5f1f3928c6d95fd96558c36ec3d9d0de4a6ecea"
+  integrity sha1-5fHzkoxtlf2WVYw27D2dDeSm7Oo=
+  dependencies:
+    mime-types "~2.1.6"
+    negotiator "0.5.3"
+
 acorn-dynamic-import@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/acorn-dynamic-import/-/acorn-dynamic-import-3.0.0.tgz#901ceee4c7faaef7e07ad2a47e890675da50a278"
@@ -3161,10 +2846,24 @@ ansi-align@^3.0.0:
   dependencies:
     string-width "^3.0.0"
 
+ansi-colors@^1.0.1:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/ansi-colors/-/ansi-colors-1.1.0.tgz#6374b4dd5d4718ff3ce27a671a3b1cad077132a9"
+  integrity sha512-SFKX67auSNoVR38N3L+nvsPjOE0bybKTYbkf5tRvushrAPQ9V75huw0ZxBkKVeRU9kqH3d6HA4xTckbwZ4ixmA==
+  dependencies:
+    ansi-wrap "^0.1.0"
+
 ansi-colors@^3.0.0:
   version "3.2.3"
   resolved "https://registry.yarnpkg.com/ansi-colors/-/ansi-colors-3.2.3.tgz#57d35b8686e851e2cc04c403f1c00203976a1813"
 
+ansi-cyan@^0.1.1:
+  version "0.1.1"
+  resolved "https://registry.yarnpkg.com/ansi-cyan/-/ansi-cyan-0.1.1.tgz#538ae528af8982f28ae30d86f2f17456d2609873"
+  integrity sha1-U4rlKK+JgvKK4w2G8vF0VtJgmHM=
+  dependencies:
+    ansi-wrap "0.1.0"
+
 ansi-escapes@^1.1.0:
   version "1.4.0"
   resolved "https://registry.yarnpkg.com/ansi-escapes/-/ansi-escapes-1.4.0.tgz#d3a8a83b319aa67793662b13e761c7911422306e"
@@ -3173,10 +2872,24 @@ ansi-escapes@^3.0.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/ansi-escapes/-/ansi-escapes-3.1.0.tgz#f73207bb81207d75fd6c83f125af26eea378ca30"
 
+ansi-gray@^0.1.1:
+  version "0.1.1"
+  resolved "https://registry.yarnpkg.com/ansi-gray/-/ansi-gray-0.1.1.tgz#2962cf54ec9792c48510a3deb524436861ef7251"
+  integrity sha1-KWLPVOyXksSFEKPetSRDaGHvclE=
+  dependencies:
+    ansi-wrap "0.1.0"
+
 ansi-html@0.0.7:
   version "0.0.7"
   resolved "https://registry.yarnpkg.com/ansi-html/-/ansi-html-0.0.7.tgz#813584021962a9e9e6fd039f940d12f56ca7859e"
 
+ansi-red@^0.1.1:
+  version "0.1.1"
+  resolved "https://registry.yarnpkg.com/ansi-red/-/ansi-red-0.1.1.tgz#8c638f9d1080800a353c9c28c8a81ca4705d946c"
+  integrity sha1-jGOPnRCAgAo1PJwoyKgcpHBdlGw=
+  dependencies:
+    ansi-wrap "0.1.0"
+
 ansi-regex@^2.0.0:
   version "2.1.1"
   resolved "https://registry.yarnpkg.com/ansi-regex/-/ansi-regex-2.1.1.tgz#c3b33ab5ee360d86e0e628f0468ae7ef27d654df"
@@ -3199,6 +2912,16 @@ ansi-styles@^3.0.0, ansi-styles@^3.2.0, ansi-styles@^3.2.1:
   dependencies:
     color-convert "^1.9.0"
 
+ansi-wrap@0.1.0, ansi-wrap@^0.1.0:
+  version "0.1.0"
+  resolved "https://registry.yarnpkg.com/ansi-wrap/-/ansi-wrap-0.1.0.tgz#a82250ddb0015e9a27ca82e82ea603bbfa45efaf"
+  integrity sha1-qCJQ3bABXponyoLoLqYDu/pF768=
+
+ansi@^0.3.0, ansi@~0.3.1:
+  version "0.3.1"
+  resolved "https://registry.yarnpkg.com/ansi/-/ansi-0.3.1.tgz#0c42d4fb17160d5a9af1e484bace1c66922c1b21"
+  integrity sha1-DELU+xcWDVqa8eSEus4cZpIsGyE=
+
 ansicolors@~0.2.1:
   version "0.2.1"
   resolved "https://registry.yarnpkg.com/ansicolors/-/ansicolors-0.2.1.tgz#be089599097b74a5c9c4a84a0cdbcdb62bd87aef"
@@ -3253,6 +2976,11 @@ aproba@^1.0.3, aproba@^1.1.1, aproba@^1.1.2:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/aproba/-/aproba-2.0.0.tgz#52520b8ae5b569215b354efc0caa3fe1e45a8adc"
 
+arch@^2.1.0:
+  version "2.1.1"
+  resolved "https://registry.yarnpkg.com/arch/-/arch-2.1.1.tgz#8f5c2731aa35a30929221bb0640eed65175ec84e"
+  integrity sha512-BLM56aPo9vLLFVa8+/+pJLnrZ7QGGTVHWsCwieAWT9o9K8UeGaQbzZbGoabWLOo2ksBCztoXdqBZBplqLDDCSg==
+
 are-we-there-yet@~1.1.2:
   version "1.1.5"
   resolved "https://registry.yarnpkg.com/are-we-there-yet/-/are-we-there-yet-1.1.5.tgz#4b35c2944f062a8bfcda66410760350fe9ddfc21"
@@ -3285,6 +3013,14 @@ aria-query@^3.0.0:
     ast-types-flow "0.0.7"
     commander "^2.11.0"
 
+arr-diff@^1.0.1:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/arr-diff/-/arr-diff-1.1.0.tgz#687c32758163588fef7de7b36fabe495eb1a399a"
+  integrity sha1-aHwydYFjWI/vfeezb6vklesaOZo=
+  dependencies:
+    arr-flatten "^1.0.1"
+    array-slice "^0.2.3"
+
 arr-diff@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/arr-diff/-/arr-diff-2.0.0.tgz#8f3b827f955a8bd669697e4a4256ac3ceae356cf"
@@ -3299,6 +3035,11 @@ arr-flatten@^1.0.1, arr-flatten@^1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/arr-flatten/-/arr-flatten-1.1.0.tgz#36048bbff4e7b47e136644316c99669ea5ae91f1"
 
+arr-union@^2.0.1:
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/arr-union/-/arr-union-2.1.0.tgz#20f9eab5ec70f5c7d215b1077b1c39161d292c7d"
+  integrity sha1-IPnqtexw9cfSFbEHexw5Fh0pLH0=
+
 arr-union@^3.1.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/arr-union/-/arr-union-3.1.0.tgz#e39b09aea9def866a8f206e288af63919bae39c4"
@@ -3346,6 +3087,11 @@ array-reduce@~0.0.0:
   version "0.0.0"
   resolved "https://registry.yarnpkg.com/array-reduce/-/array-reduce-0.0.0.tgz#173899d3ffd1c7d9383e4479525dbe278cab5f2b"
 
+array-slice@^0.2.3:
+  version "0.2.3"
+  resolved "https://registry.yarnpkg.com/array-slice/-/array-slice-0.2.3.tgz#dd3cfb80ed7973a75117cdac69b0b99ec86186f5"
+  integrity sha1-3Tz7gO15c6dRF82sabC5nshhhvU=
+
 array-to-error@^1.0.0:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/array-to-error/-/array-to-error-1.1.1.tgz#d68812926d14097a205579a667eeaf1856a44c07"
@@ -3398,6 +3144,11 @@ arrify@^1.0.0, arrify@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/arrify/-/arrify-1.0.1.tgz#898508da2226f380df904728456849c1501a4b0d"
 
+art@^0.10.0:
+  version "0.10.3"
+  resolved "https://registry.yarnpkg.com/art/-/art-0.10.3.tgz#b01d84a968ccce6208df55a733838c96caeeaea2"
+  integrity sha512-HXwbdofRTiJT6qZX/FnchtldzJjS3vkLJxQilc3Xj+ma2MXjY4UAyQ0ls1XZYVnDvVIBiFZbC6QsvtW86TD6tQ==
+
 asap@^2.0.0, asap@~2.0.3, asap@~2.0.6:
   version "2.0.6"
   resolved "https://registry.yarnpkg.com/asap/-/asap-2.0.6.tgz#e50347611d7e690943208bbdafebcbc2fb866d46"
@@ -3505,6 +3256,13 @@ async@^2.1.4, async@^2.4.1, async@^2.5.0, async@^2.6.0:
   dependencies:
     lodash "^4.17.10"
 
+async@^2.4.0:
+  version "2.6.2"
+  resolved "https://registry.yarnpkg.com/async/-/async-2.6.2.tgz#18330ea7e6e313887f5d2f2a904bac6fe4dd5381"
+  integrity sha512-H1qVYh1MYhEEFLsP97cVKqCGo7KfCyTt6uEWqsTBr9SO84oK9Uwbyd/yCW+6rKJLHksBNUVWZDAjfS+Ccx0Bbg==
+  dependencies:
+    lodash "^4.17.11"
+
 async@~0.2.9:
   version "0.2.10"
   resolved "https://registry.yarnpkg.com/async/-/async-0.2.10.tgz#b6bbe0b0674b9d719708ca38de8c237cb526c3d1"
@@ -3576,7 +3334,7 @@ babel-core@7.0.0-bridge.0, babel-core@^7.0.0-bridge.0:
   version "7.0.0-bridge.0"
   resolved "https://registry.yarnpkg.com/babel-core/-/babel-core-7.0.0-bridge.0.tgz#95a492ddd90f9b4e9a4a1da14eb335b87b634ece"
 
-babel-core@^6.0.0, babel-core@^6.23.1, babel-core@^6.26.0:
+babel-core@^6.0.0, babel-core@^6.23.1, babel-core@^6.24.1, babel-core@^6.26.0, babel-core@^6.7.2:
   version "6.26.3"
   resolved "https://registry.yarnpkg.com/babel-core/-/babel-core-6.26.3.tgz#b2e2f09e342d0f0c88e2f02e067794125e75c207"
   dependencies:
@@ -3742,7 +3500,7 @@ babel-helper-regex@^6.24.1:
     babel-types "^6.26.0"
     lodash "^4.17.4"
 
-babel-helper-remap-async-to-generator@^6.24.1:
+babel-helper-remap-async-to-generator@^6.16.0, babel-helper-remap-async-to-generator@^6.24.1:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-helper-remap-async-to-generator/-/babel-helper-remap-async-to-generator-6.24.1.tgz#5ec581827ad723fecdd381f1c928390676e4551b"
   dependencies:
@@ -3830,7 +3588,7 @@ babel-plugin-add-react-displayname@^0.0.5:
   version "0.0.5"
   resolved "https://registry.yarnpkg.com/babel-plugin-add-react-displayname/-/babel-plugin-add-react-displayname-0.0.5.tgz#339d4cddb7b65fd62d1df9db9fe04de134122bd5"
 
-babel-plugin-check-es2015-constants@^6.22.0:
+babel-plugin-check-es2015-constants@^6.22.0, babel-plugin-check-es2015-constants@^6.5.0, babel-plugin-check-es2015-constants@^6.8.0:
   version "6.22.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-check-es2015-constants/-/babel-plugin-check-es2015-constants-6.22.0.tgz#35157b101426fd2ffd3da3f75c7d1e91835bbf8a"
   dependencies:
@@ -3860,7 +3618,7 @@ babel-plugin-ember-modules-api-polyfill@^2.6.0:
   dependencies:
     ember-rfc176-data "^0.3.6"
 
-babel-plugin-emotion@^10.0.6, babel-plugin-emotion@^10.0.7:
+babel-plugin-emotion@^10.0.7:
   version "10.0.7"
   resolved "https://registry.yarnpkg.com/babel-plugin-emotion/-/babel-plugin-emotion-10.0.7.tgz#3634ada6dee762140f27db07387feaec8d2cb619"
   dependencies:
@@ -3892,6 +3650,13 @@ babel-plugin-emotion@^9.2.11:
     source-map "^0.5.7"
     touch "^2.0.1"
 
+babel-plugin-external-helpers@^6.18.0:
+  version "6.22.0"
+  resolved "https://registry.yarnpkg.com/babel-plugin-external-helpers/-/babel-plugin-external-helpers-6.22.0.tgz#2285f48b02bd5dede85175caf8c62e86adccefa1"
+  integrity sha1-IoX0iwK9Xe3oUXXK+MYuhq3M76E=
+  dependencies:
+    babel-runtime "^6.22.0"
+
 babel-plugin-htmlbars-inline-precompile@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-htmlbars-inline-precompile/-/babel-plugin-htmlbars-inline-precompile-1.0.0.tgz#a9d2f6eaad8a3f3d361602de593a8cbef8179c22"
@@ -4032,27 +3797,39 @@ babel-plugin-react-docgen@^2.0.2:
     react-docgen "^3.0.0"
     recast "^0.14.7"
 
+babel-plugin-react-transform@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/babel-plugin-react-transform/-/babel-plugin-react-transform-3.0.0.tgz#402f25137b7bb66e9b54ead75557dfbc7ecaaa74"
+  integrity sha512-4vJGddwPiHAOgshzZdGwYy4zRjjIr5SMY7gkOaCyIASjgpcsyLTlZNuB5rHOFoaTvGlhfo8/g4pobXPyHqm/3w==
+  dependencies:
+    lodash "^4.6.1"
+
 babel-plugin-require-context-hook@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-require-context-hook/-/babel-plugin-require-context-hook-1.0.0.tgz#3f0e7cce87c338f53639b948632fd4e73834632d"
 
-babel-plugin-syntax-async-functions@^6.13.0, babel-plugin-syntax-async-functions@^6.8.0:
+babel-plugin-syntax-async-functions@^6.13.0, babel-plugin-syntax-async-functions@^6.5.0, babel-plugin-syntax-async-functions@^6.8.0:
   version "6.13.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-syntax-async-functions/-/babel-plugin-syntax-async-functions-6.13.0.tgz#cad9cad1191b5ad634bf30ae0872391e0647be95"
 
-babel-plugin-syntax-class-properties@^6.8.0:
+babel-plugin-syntax-class-properties@^6.5.0, babel-plugin-syntax-class-properties@^6.8.0:
   version "6.13.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-syntax-class-properties/-/babel-plugin-syntax-class-properties-6.13.0.tgz#d7eb23b79a317f8543962c505b827c7d6cac27de"
 
+babel-plugin-syntax-dynamic-import@^6.18.0:
+  version "6.18.0"
+  resolved "https://registry.yarnpkg.com/babel-plugin-syntax-dynamic-import/-/babel-plugin-syntax-dynamic-import-6.18.0.tgz#8d6a26229c83745a9982a441051572caa179b1da"
+  integrity sha1-jWomIpyDdFqZgqRBBRVyyqF5sdo=
+
 babel-plugin-syntax-exponentiation-operator@^6.8.0:
   version "6.13.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-syntax-exponentiation-operator/-/babel-plugin-syntax-exponentiation-operator-6.13.0.tgz#9ee7e8337290da95288201a6a57f4170317830de"
 
-babel-plugin-syntax-flow@^6.18.0:
+babel-plugin-syntax-flow@^6.18.0, babel-plugin-syntax-flow@^6.5.0, babel-plugin-syntax-flow@^6.8.0:
   version "6.18.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-syntax-flow/-/babel-plugin-syntax-flow-6.18.0.tgz#4c3ab20a2af26aa20cd25995c398c4eb70310c8d"
 
-babel-plugin-syntax-jsx@^6.18.0, babel-plugin-syntax-jsx@^6.3.13, babel-plugin-syntax-jsx@^6.8.0:
+babel-plugin-syntax-jsx@^6.18.0, babel-plugin-syntax-jsx@^6.3.13, babel-plugin-syntax-jsx@^6.5.0, babel-plugin-syntax-jsx@^6.8.0:
   version "6.18.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-syntax-jsx/-/babel-plugin-syntax-jsx-6.18.0.tgz#0af32a9a6e13ca7a3fd5069e62d7b0f58d0d8946"
 
@@ -4060,10 +3837,19 @@ babel-plugin-syntax-object-rest-spread@^6.13.0, babel-plugin-syntax-object-rest-
   version "6.13.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-syntax-object-rest-spread/-/babel-plugin-syntax-object-rest-spread-6.13.0.tgz#fd6536f2bce13836ffa3a5458c4903a597bb3bf5"
 
-babel-plugin-syntax-trailing-function-commas@^6.22.0:
+babel-plugin-syntax-trailing-function-commas@^6.20.0, babel-plugin-syntax-trailing-function-commas@^6.22.0, babel-plugin-syntax-trailing-function-commas@^6.5.0, babel-plugin-syntax-trailing-function-commas@^6.8.0:
   version "6.22.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-syntax-trailing-function-commas/-/babel-plugin-syntax-trailing-function-commas-6.22.0.tgz#ba0360937f8d06e40180a43fe0d5616fff532cf3"
 
+babel-plugin-transform-async-to-generator@6.16.0:
+  version "6.16.0"
+  resolved "https://registry.yarnpkg.com/babel-plugin-transform-async-to-generator/-/babel-plugin-transform-async-to-generator-6.16.0.tgz#19ec36cb1486b59f9f468adfa42ce13908ca2999"
+  integrity sha1-Gew2yxSGtZ+fRorfpCzhOQjKKZk=
+  dependencies:
+    babel-helper-remap-async-to-generator "^6.16.0"
+    babel-plugin-syntax-async-functions "^6.8.0"
+    babel-runtime "^6.0.0"
+
 babel-plugin-transform-async-to-generator@^6.22.0:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-async-to-generator/-/babel-plugin-transform-async-to-generator-6.24.1.tgz#6536e378aff6cb1d5517ac0e40eb3e9fc8d08761"
@@ -4072,7 +3858,7 @@ babel-plugin-transform-async-to-generator@^6.22.0:
     babel-plugin-syntax-async-functions "^6.8.0"
     babel-runtime "^6.22.0"
 
-babel-plugin-transform-class-properties@^6.24.1:
+babel-plugin-transform-class-properties@^6.18.0, babel-plugin-transform-class-properties@^6.24.1, babel-plugin-transform-class-properties@^6.5.0, babel-plugin-transform-class-properties@^6.8.0:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-class-properties/-/babel-plugin-transform-class-properties-6.24.1.tgz#6a79763ea61d33d36f37b611aa9def81a81b46ac"
   dependencies:
@@ -4081,19 +3867,19 @@ babel-plugin-transform-class-properties@^6.24.1:
     babel-runtime "^6.22.0"
     babel-template "^6.24.1"
 
-babel-plugin-transform-es2015-arrow-functions@^6.22.0:
+babel-plugin-transform-es2015-arrow-functions@^6.22.0, babel-plugin-transform-es2015-arrow-functions@^6.5.0, babel-plugin-transform-es2015-arrow-functions@^6.8.0:
   version "6.22.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-arrow-functions/-/babel-plugin-transform-es2015-arrow-functions-6.22.0.tgz#452692cb711d5f79dc7f85e440ce41b9f244d221"
   dependencies:
     babel-runtime "^6.22.0"
 
-babel-plugin-transform-es2015-block-scoped-functions@^6.22.0:
+babel-plugin-transform-es2015-block-scoped-functions@^6.22.0, babel-plugin-transform-es2015-block-scoped-functions@^6.8.0:
   version "6.22.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-block-scoped-functions/-/babel-plugin-transform-es2015-block-scoped-functions-6.22.0.tgz#bbc51b49f964d70cb8d8e0b94e820246ce3a6141"
   dependencies:
     babel-runtime "^6.22.0"
 
-babel-plugin-transform-es2015-block-scoping@^6.23.0:
+babel-plugin-transform-es2015-block-scoping@^6.23.0, babel-plugin-transform-es2015-block-scoping@^6.5.0, babel-plugin-transform-es2015-block-scoping@^6.8.0:
   version "6.26.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-block-scoping/-/babel-plugin-transform-es2015-block-scoping-6.26.0.tgz#d70f5299c1308d05c12f463813b0a09e73b1895f"
   dependencies:
@@ -4103,7 +3889,7 @@ babel-plugin-transform-es2015-block-scoping@^6.23.0:
     babel-types "^6.26.0"
     lodash "^4.17.4"
 
-babel-plugin-transform-es2015-classes@^6.23.0:
+babel-plugin-transform-es2015-classes@^6.23.0, babel-plugin-transform-es2015-classes@^6.5.0, babel-plugin-transform-es2015-classes@^6.8.0:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-classes/-/babel-plugin-transform-es2015-classes-6.24.1.tgz#5a4c58a50c9c9461e564b4b2a3bfabc97a2584db"
   dependencies:
@@ -4117,14 +3903,14 @@ babel-plugin-transform-es2015-classes@^6.23.0:
     babel-traverse "^6.24.1"
     babel-types "^6.24.1"
 
-babel-plugin-transform-es2015-computed-properties@^6.22.0:
+babel-plugin-transform-es2015-computed-properties@^6.22.0, babel-plugin-transform-es2015-computed-properties@^6.5.0, babel-plugin-transform-es2015-computed-properties@^6.8.0:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-computed-properties/-/babel-plugin-transform-es2015-computed-properties-6.24.1.tgz#6fe2a8d16895d5634f4cd999b6d3480a308159b3"
   dependencies:
     babel-runtime "^6.22.0"
     babel-template "^6.24.1"
 
-babel-plugin-transform-es2015-destructuring@^6.23.0:
+babel-plugin-transform-es2015-destructuring@6.x, babel-plugin-transform-es2015-destructuring@^6.23.0, babel-plugin-transform-es2015-destructuring@^6.5.0, babel-plugin-transform-es2015-destructuring@^6.8.0:
   version "6.23.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-destructuring/-/babel-plugin-transform-es2015-destructuring-6.23.0.tgz#997bb1f1ab967f682d2b0876fe358d60e765c56d"
   dependencies:
@@ -4137,13 +3923,13 @@ babel-plugin-transform-es2015-duplicate-keys@^6.22.0:
     babel-runtime "^6.22.0"
     babel-types "^6.24.1"
 
-babel-plugin-transform-es2015-for-of@^6.23.0:
+babel-plugin-transform-es2015-for-of@^6.23.0, babel-plugin-transform-es2015-for-of@^6.5.0, babel-plugin-transform-es2015-for-of@^6.8.0:
   version "6.23.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-for-of/-/babel-plugin-transform-es2015-for-of-6.23.0.tgz#f47c95b2b613df1d3ecc2fdb7573623c75248691"
   dependencies:
     babel-runtime "^6.22.0"
 
-babel-plugin-transform-es2015-function-name@^6.22.0:
+babel-plugin-transform-es2015-function-name@6.x, babel-plugin-transform-es2015-function-name@^6.22.0, babel-plugin-transform-es2015-function-name@^6.5.0, babel-plugin-transform-es2015-function-name@^6.8.0:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-function-name/-/babel-plugin-transform-es2015-function-name-6.24.1.tgz#834c89853bc36b1af0f3a4c5dbaa94fd8eacaa8b"
   dependencies:
@@ -4151,7 +3937,7 @@ babel-plugin-transform-es2015-function-name@^6.22.0:
     babel-runtime "^6.22.0"
     babel-types "^6.24.1"
 
-babel-plugin-transform-es2015-literals@^6.22.0:
+babel-plugin-transform-es2015-literals@^6.22.0, babel-plugin-transform-es2015-literals@^6.5.0, babel-plugin-transform-es2015-literals@^6.8.0:
   version "6.22.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-literals/-/babel-plugin-transform-es2015-literals-6.22.0.tgz#4f54a02d6cd66cf915280019a31d31925377ca2e"
   dependencies:
@@ -4165,7 +3951,7 @@ babel-plugin-transform-es2015-modules-amd@^6.22.0, babel-plugin-transform-es2015
     babel-runtime "^6.22.0"
     babel-template "^6.24.1"
 
-babel-plugin-transform-es2015-modules-commonjs@^6.23.0, babel-plugin-transform-es2015-modules-commonjs@^6.24.1:
+babel-plugin-transform-es2015-modules-commonjs@6.x, babel-plugin-transform-es2015-modules-commonjs@^6.23.0, babel-plugin-transform-es2015-modules-commonjs@^6.24.1, babel-plugin-transform-es2015-modules-commonjs@^6.5.0, babel-plugin-transform-es2015-modules-commonjs@^6.8.0:
   version "6.26.2"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-modules-commonjs/-/babel-plugin-transform-es2015-modules-commonjs-6.26.2.tgz#58a793863a9e7ca870bdc5a881117ffac27db6f3"
   dependencies:
@@ -4190,14 +3976,14 @@ babel-plugin-transform-es2015-modules-umd@^6.23.0:
     babel-runtime "^6.22.0"
     babel-template "^6.24.1"
 
-babel-plugin-transform-es2015-object-super@^6.22.0:
+babel-plugin-transform-es2015-object-super@^6.22.0, babel-plugin-transform-es2015-object-super@^6.8.0:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-object-super/-/babel-plugin-transform-es2015-object-super-6.24.1.tgz#24cef69ae21cb83a7f8603dad021f572eb278f8d"
   dependencies:
     babel-helper-replace-supers "^6.24.1"
     babel-runtime "^6.22.0"
 
-babel-plugin-transform-es2015-parameters@^6.23.0:
+babel-plugin-transform-es2015-parameters@6.x, babel-plugin-transform-es2015-parameters@^6.23.0, babel-plugin-transform-es2015-parameters@^6.5.0, babel-plugin-transform-es2015-parameters@^6.8.0:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-parameters/-/babel-plugin-transform-es2015-parameters-6.24.1.tgz#57ac351ab49caf14a97cd13b09f66fdf0a625f2b"
   dependencies:
@@ -4208,20 +3994,20 @@ babel-plugin-transform-es2015-parameters@^6.23.0:
     babel-traverse "^6.24.1"
     babel-types "^6.24.1"
 
-babel-plugin-transform-es2015-shorthand-properties@^6.22.0:
+babel-plugin-transform-es2015-shorthand-properties@6.x, babel-plugin-transform-es2015-shorthand-properties@^6.22.0, babel-plugin-transform-es2015-shorthand-properties@^6.5.0, babel-plugin-transform-es2015-shorthand-properties@^6.8.0:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-shorthand-properties/-/babel-plugin-transform-es2015-shorthand-properties-6.24.1.tgz#24f875d6721c87661bbd99a4622e51f14de38aa0"
   dependencies:
     babel-runtime "^6.22.0"
     babel-types "^6.24.1"
 
-babel-plugin-transform-es2015-spread@^6.22.0:
+babel-plugin-transform-es2015-spread@6.x, babel-plugin-transform-es2015-spread@^6.22.0, babel-plugin-transform-es2015-spread@^6.5.0, babel-plugin-transform-es2015-spread@^6.8.0:
   version "6.22.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-spread/-/babel-plugin-transform-es2015-spread-6.22.0.tgz#d6d68a99f89aedc4536c81a542e8dd9f1746f8d1"
   dependencies:
     babel-runtime "^6.22.0"
 
-babel-plugin-transform-es2015-sticky-regex@^6.22.0:
+babel-plugin-transform-es2015-sticky-regex@6.x, babel-plugin-transform-es2015-sticky-regex@^6.22.0:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-sticky-regex/-/babel-plugin-transform-es2015-sticky-regex-6.24.1.tgz#00c1cdb1aca71112cdf0cf6126c2ed6b457ccdbc"
   dependencies:
@@ -4229,7 +4015,7 @@ babel-plugin-transform-es2015-sticky-regex@^6.22.0:
     babel-runtime "^6.22.0"
     babel-types "^6.24.1"
 
-babel-plugin-transform-es2015-template-literals@^6.22.0:
+babel-plugin-transform-es2015-template-literals@^6.22.0, babel-plugin-transform-es2015-template-literals@^6.5.0, babel-plugin-transform-es2015-template-literals@^6.8.0:
   version "6.22.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-template-literals/-/babel-plugin-transform-es2015-template-literals-6.22.0.tgz#a84b3450f7e9f8f1f6839d6d687da84bb1236d8d"
   dependencies:
@@ -4241,7 +4027,7 @@ babel-plugin-transform-es2015-typeof-symbol@^6.23.0:
   dependencies:
     babel-runtime "^6.22.0"
 
-babel-plugin-transform-es2015-unicode-regex@^6.22.0:
+babel-plugin-transform-es2015-unicode-regex@6.x, babel-plugin-transform-es2015-unicode-regex@^6.22.0:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-unicode-regex/-/babel-plugin-transform-es2015-unicode-regex-6.24.1.tgz#d38b12f42ea7323f729387f18a7c5ae1faeb35e9"
   dependencies:
@@ -4249,7 +4035,21 @@ babel-plugin-transform-es2015-unicode-regex@^6.22.0:
     babel-runtime "^6.22.0"
     regexpu-core "^2.0.0"
 
-babel-plugin-transform-exponentiation-operator@^6.22.0:
+babel-plugin-transform-es3-member-expression-literals@^6.8.0:
+  version "6.22.0"
+  resolved "https://registry.yarnpkg.com/babel-plugin-transform-es3-member-expression-literals/-/babel-plugin-transform-es3-member-expression-literals-6.22.0.tgz#733d3444f3ecc41bef8ed1a6a4e09657b8969ebb"
+  integrity sha1-cz00RPPsxBvvjtGmpOCWV7iWnrs=
+  dependencies:
+    babel-runtime "^6.22.0"
+
+babel-plugin-transform-es3-property-literals@^6.8.0:
+  version "6.22.0"
+  resolved "https://registry.yarnpkg.com/babel-plugin-transform-es3-property-literals/-/babel-plugin-transform-es3-property-literals-6.22.0.tgz#b2078d5842e22abf40f73e8cde9cd3711abd5758"
+  integrity sha1-sgeNWELiKr9A9z6M3pzTcRq9V1g=
+  dependencies:
+    babel-runtime "^6.22.0"
+
+babel-plugin-transform-exponentiation-operator@^6.22.0, babel-plugin-transform-exponentiation-operator@^6.5.0:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-exponentiation-operator/-/babel-plugin-transform-exponentiation-operator-6.24.1.tgz#2ab0c9c7f3098fa48907772bb813fe41e8de3a0e"
   dependencies:
@@ -4257,7 +4057,7 @@ babel-plugin-transform-exponentiation-operator@^6.22.0:
     babel-plugin-syntax-exponentiation-operator "^6.8.0"
     babel-runtime "^6.22.0"
 
-babel-plugin-transform-flow-strip-types@^6.22.0:
+babel-plugin-transform-flow-strip-types@^6.21.0, babel-plugin-transform-flow-strip-types@^6.22.0, babel-plugin-transform-flow-strip-types@^6.5.0, babel-plugin-transform-flow-strip-types@^6.8.0:
   version "6.22.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-flow-strip-types/-/babel-plugin-transform-flow-strip-types-6.22.0.tgz#84cb672935d43714fdc32bce84568d87441cf7cf"
   dependencies:
@@ -4280,7 +4080,14 @@ babel-plugin-transform-minify-booleans@^6.9.4:
   version "6.9.4"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-minify-booleans/-/babel-plugin-transform-minify-booleans-6.9.4.tgz#acbb3e56a3555dd23928e4b582d285162dd2b198"
 
-babel-plugin-transform-object-rest-spread@^6.23.0, babel-plugin-transform-object-rest-spread@^6.26.0:
+babel-plugin-transform-object-assign@^6.5.0:
+  version "6.22.0"
+  resolved "https://registry.yarnpkg.com/babel-plugin-transform-object-assign/-/babel-plugin-transform-object-assign-6.22.0.tgz#f99d2f66f1a0b0d498e346c5359684740caa20ba"
+  integrity sha1-+Z0vZvGgsNSY40bFNZaEdAyqILo=
+  dependencies:
+    babel-runtime "^6.22.0"
+
+babel-plugin-transform-object-rest-spread@^6.20.2, babel-plugin-transform-object-rest-spread@^6.23.0, babel-plugin-transform-object-rest-spread@^6.26.0, babel-plugin-transform-object-rest-spread@^6.5.0, babel-plugin-transform-object-rest-spread@^6.8.0:
   version "6.26.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-object-rest-spread/-/babel-plugin-transform-object-rest-spread-6.26.0.tgz#0f36692d50fef6b7e2d4b3ac1478137a963b7b06"
   dependencies:
@@ -4293,7 +4100,7 @@ babel-plugin-transform-property-literals@^6.9.4:
   dependencies:
     esutils "^2.0.2"
 
-babel-plugin-transform-react-display-name@^6.23.0:
+babel-plugin-transform-react-display-name@^6.23.0, babel-plugin-transform-react-display-name@^6.5.0, babel-plugin-transform-react-display-name@^6.8.0:
   version "6.25.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-react-display-name/-/babel-plugin-transform-react-display-name-6.25.0.tgz#67e2bf1f1e9c93ab08db96792e05392bf2cc28d1"
   dependencies:
@@ -4306,14 +4113,14 @@ babel-plugin-transform-react-jsx-self@^6.22.0:
     babel-plugin-syntax-jsx "^6.8.0"
     babel-runtime "^6.22.0"
 
-babel-plugin-transform-react-jsx-source@^6.22.0:
+babel-plugin-transform-react-jsx-source@^6.22.0, babel-plugin-transform-react-jsx-source@^6.5.0:
   version "6.22.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-react-jsx-source/-/babel-plugin-transform-react-jsx-source-6.22.0.tgz#66ac12153f5cd2d17b3c19268f4bf0197f44ecd6"
   dependencies:
     babel-plugin-syntax-jsx "^6.8.0"
     babel-runtime "^6.22.0"
 
-babel-plugin-transform-react-jsx@^6.24.1:
+babel-plugin-transform-react-jsx@^6.24.1, babel-plugin-transform-react-jsx@^6.5.0, babel-plugin-transform-react-jsx@^6.8.0:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-react-jsx/-/babel-plugin-transform-react-jsx-6.24.1.tgz#840a028e7df460dfc3a2d29f0c0d91f6376e66a3"
   dependencies:
@@ -4325,7 +4132,7 @@ babel-plugin-transform-react-remove-prop-types@0.4.20:
   version "0.4.20"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-react-remove-prop-types/-/babel-plugin-transform-react-remove-prop-types-0.4.20.tgz#688bdea1e27ea0023775dea817fa2d3f8df8802b"
 
-babel-plugin-transform-regenerator@^6.22.0, babel-plugin-transform-regenerator@^6.26.0:
+babel-plugin-transform-regenerator@^6.22.0, babel-plugin-transform-regenerator@^6.26.0, babel-plugin-transform-regenerator@^6.5.0:
   version "6.26.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-regenerator/-/babel-plugin-transform-regenerator-6.26.0.tgz#e0703696fbde27f0a3efcacf8b4dca2f7b3a8f2f"
   dependencies:
@@ -4419,6 +4226,55 @@ babel-preset-env@^1.7.0:
     invariant "^2.2.2"
     semver "^5.3.0"
 
+babel-preset-es2015-node@^6.1.1:
+  version "6.1.1"
+  resolved "https://registry.yarnpkg.com/babel-preset-es2015-node/-/babel-preset-es2015-node-6.1.1.tgz#60b23157024b0cfebf3a63554cb05ee035b4e55f"
+  integrity sha1-YLIxVwJLDP6/OmNVTLBe4DW05V8=
+  dependencies:
+    babel-plugin-transform-es2015-destructuring "6.x"
+    babel-plugin-transform-es2015-function-name "6.x"
+    babel-plugin-transform-es2015-modules-commonjs "6.x"
+    babel-plugin-transform-es2015-parameters "6.x"
+    babel-plugin-transform-es2015-shorthand-properties "6.x"
+    babel-plugin-transform-es2015-spread "6.x"
+    babel-plugin-transform-es2015-sticky-regex "6.x"
+    babel-plugin-transform-es2015-unicode-regex "6.x"
+    semver "5.x"
+
+babel-preset-fbjs@^2.1.2, babel-preset-fbjs@^2.1.4:
+  version "2.3.0"
+  resolved "https://registry.yarnpkg.com/babel-preset-fbjs/-/babel-preset-fbjs-2.3.0.tgz#92ff81307c18b926895114f9828ae1674c097f80"
+  integrity sha512-ZOpAI1/bN0Y3J1ZAK9gRsFkHy9gGgJoDRUjtUCla/129LC7uViq9nIK22YdHfey8szohYoZY3f9L2lGOv0Edqw==
+  dependencies:
+    babel-plugin-check-es2015-constants "^6.8.0"
+    babel-plugin-syntax-class-properties "^6.8.0"
+    babel-plugin-syntax-flow "^6.8.0"
+    babel-plugin-syntax-jsx "^6.8.0"
+    babel-plugin-syntax-object-rest-spread "^6.8.0"
+    babel-plugin-syntax-trailing-function-commas "^6.8.0"
+    babel-plugin-transform-class-properties "^6.8.0"
+    babel-plugin-transform-es2015-arrow-functions "^6.8.0"
+    babel-plugin-transform-es2015-block-scoped-functions "^6.8.0"
+    babel-plugin-transform-es2015-block-scoping "^6.8.0"
+    babel-plugin-transform-es2015-classes "^6.8.0"
+    babel-plugin-transform-es2015-computed-properties "^6.8.0"
+    babel-plugin-transform-es2015-destructuring "^6.8.0"
+    babel-plugin-transform-es2015-for-of "^6.8.0"
+    babel-plugin-transform-es2015-function-name "^6.8.0"
+    babel-plugin-transform-es2015-literals "^6.8.0"
+    babel-plugin-transform-es2015-modules-commonjs "^6.8.0"
+    babel-plugin-transform-es2015-object-super "^6.8.0"
+    babel-plugin-transform-es2015-parameters "^6.8.0"
+    babel-plugin-transform-es2015-shorthand-properties "^6.8.0"
+    babel-plugin-transform-es2015-spread "^6.8.0"
+    babel-plugin-transform-es2015-template-literals "^6.8.0"
+    babel-plugin-transform-es3-member-expression-literals "^6.8.0"
+    babel-plugin-transform-es3-property-literals "^6.8.0"
+    babel-plugin-transform-flow-strip-types "^6.8.0"
+    babel-plugin-transform-object-rest-spread "^6.8.0"
+    babel-plugin-transform-react-display-name "^6.8.0"
+    babel-plugin-transform-react-jsx "^6.8.0"
+
 babel-preset-flow@^6.23.0:
   version "6.23.0"
   resolved "https://registry.yarnpkg.com/babel-preset-flow/-/babel-preset-flow-6.23.0.tgz#e71218887085ae9a24b5be4169affb599816c49d"
@@ -4491,6 +4347,44 @@ babel-preset-react-app@^7.0.0:
     babel-plugin-macros "2.4.2"
     babel-plugin-transform-react-remove-prop-types "0.4.20"
 
+babel-preset-react-native@^4.0.0:
+  version "4.0.1"
+  resolved "https://registry.yarnpkg.com/babel-preset-react-native/-/babel-preset-react-native-4.0.1.tgz#14ff07bdb6c8df9408082c0c18b2ce8e3392e76a"
+  integrity sha512-uhFXnl1WbEWNG4W8QB/jeQaVXkd0a0AD+wh4D2VqtdRnEyvscahqyHExnwKLU9N0sXRYwDyed4JfbiBtiOSGgA==
+  dependencies:
+    babel-plugin-check-es2015-constants "^6.5.0"
+    babel-plugin-react-transform "^3.0.0"
+    babel-plugin-syntax-async-functions "^6.5.0"
+    babel-plugin-syntax-class-properties "^6.5.0"
+    babel-plugin-syntax-dynamic-import "^6.18.0"
+    babel-plugin-syntax-flow "^6.5.0"
+    babel-plugin-syntax-jsx "^6.5.0"
+    babel-plugin-syntax-trailing-function-commas "^6.5.0"
+    babel-plugin-transform-class-properties "^6.5.0"
+    babel-plugin-transform-es2015-arrow-functions "^6.5.0"
+    babel-plugin-transform-es2015-block-scoping "^6.5.0"
+    babel-plugin-transform-es2015-classes "^6.5.0"
+    babel-plugin-transform-es2015-computed-properties "^6.5.0"
+    babel-plugin-transform-es2015-destructuring "^6.5.0"
+    babel-plugin-transform-es2015-for-of "^6.5.0"
+    babel-plugin-transform-es2015-function-name "^6.5.0"
+    babel-plugin-transform-es2015-literals "^6.5.0"
+    babel-plugin-transform-es2015-modules-commonjs "^6.5.0"
+    babel-plugin-transform-es2015-parameters "^6.5.0"
+    babel-plugin-transform-es2015-shorthand-properties "^6.5.0"
+    babel-plugin-transform-es2015-spread "^6.5.0"
+    babel-plugin-transform-es2015-template-literals "^6.5.0"
+    babel-plugin-transform-exponentiation-operator "^6.5.0"
+    babel-plugin-transform-flow-strip-types "^6.5.0"
+    babel-plugin-transform-object-assign "^6.5.0"
+    babel-plugin-transform-object-rest-spread "^6.5.0"
+    babel-plugin-transform-react-display-name "^6.5.0"
+    babel-plugin-transform-react-jsx "^6.5.0"
+    babel-plugin-transform-react-jsx-source "^6.5.0"
+    babel-plugin-transform-regenerator "^6.5.0"
+    babel-template "^6.24.1"
+    react-transform-hmr "^1.0.4"
+
 babel-preset-react@^6.24.1:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-preset-react/-/babel-preset-react-6.24.1.tgz#ba69dfaea45fc3ec639b6a4ecea6e17702c91380"
@@ -4512,7 +4406,7 @@ babel-preset-vue@^2.0.2:
     babel-plugin-syntax-jsx "^6.18.0"
     babel-plugin-transform-vue-jsx "^3.5.0"
 
-babel-register@^6.26.0:
+babel-register@^6.24.1, babel-register@^6.26.0:
   version "6.26.0"
   resolved "https://registry.yarnpkg.com/babel-register/-/babel-register-6.26.0.tgz#6ed021173e2fcb486d7acb45c6009a856f647071"
   dependencies:
@@ -4524,7 +4418,7 @@ babel-register@^6.26.0:
     mkdirp "^0.5.1"
     source-map-support "^0.4.15"
 
-babel-runtime@^6.18.0, babel-runtime@^6.22.0, babel-runtime@^6.26.0:
+babel-runtime@^6.0.0, babel-runtime@^6.18.0, babel-runtime@^6.22.0, babel-runtime@^6.23.0, babel-runtime@^6.26.0:
   version "6.26.0"
   resolved "https://registry.yarnpkg.com/babel-runtime/-/babel-runtime-6.26.0.tgz#965c7058668e82b55d7bfe04ff2337bc8b5647fe"
   dependencies:
@@ -4594,10 +4488,25 @@ base64-arraybuffer@0.1.5:
   version "0.1.5"
   resolved "https://registry.yarnpkg.com/base64-arraybuffer/-/base64-arraybuffer-0.1.5.tgz#73926771923b5a19747ad666aa5cd4bf9c6e9ce8"
 
-base64-js@^1.0.2:
+base64-js@0.0.8:
+  version "0.0.8"
+  resolved "https://registry.yarnpkg.com/base64-js/-/base64-js-0.0.8.tgz#1101e9544f4a76b1bc3b26d452ca96d7a35e7978"
+  integrity sha1-EQHpVE9KdrG8OybUUsqW16NeeXg=
+
+base64-js@1.1.2:
+  version "1.1.2"
+  resolved "https://registry.yarnpkg.com/base64-js/-/base64-js-1.1.2.tgz#d6400cac1c4c660976d90d07a04351d89395f5e8"
+  integrity sha1-1kAMrBxMZgl22Q0HoENR2JOV9eg=
+
+base64-js@^1.0.2, base64-js@^1.1.2:
   version "1.3.0"
   resolved "https://registry.yarnpkg.com/base64-js/-/base64-js-1.3.0.tgz#cab1e6118f051095e58b5281aea8c1cd22bfc0e3"
 
+base64-url@1.2.1:
+  version "1.2.1"
+  resolved "https://registry.yarnpkg.com/base64-url/-/base64-url-1.2.1.tgz#199fd661702a0e7b7dcae6e0698bb089c52f6d78"
+  integrity sha1-GZ/WYXAqDnt9yubgaYuwicUvbXg=
+
 base64id@1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/base64id/-/base64id-1.0.0.tgz#47688cb99bb6804f0e06d3e763b1c32e57d8e6b6"
@@ -4614,16 +4523,31 @@ base@^0.11.1:
     mixin-deep "^1.2.0"
     pascalcase "^0.1.1"
 
+basic-auth-connect@1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/basic-auth-connect/-/basic-auth-connect-1.0.0.tgz#fdb0b43962ca7b40456a7c2bb48fe173da2d2122"
+  integrity sha1-/bC0OWLKe0BFanwrtI/hc9otISI=
+
 basic-auth-parser@0.0.2:
   version "0.0.2"
   resolved "https://registry.yarnpkg.com/basic-auth-parser/-/basic-auth-parser-0.0.2.tgz#ce9e71a77f23c1279eecd2659b2a46244c156e41"
 
+basic-auth@~1.0.3:
+  version "1.0.4"
+  resolved "https://registry.yarnpkg.com/basic-auth/-/basic-auth-1.0.4.tgz#030935b01de7c9b94a824b29f3fccb750d3a5290"
+  integrity sha1-Awk1sB3nyblKgksp8/zLdQ06UpA=
+
 basic-auth@~2.0.0:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/basic-auth/-/basic-auth-2.0.1.tgz#b998279bf47ce38344b4f3cf916d4679bbf51e3a"
   dependencies:
     safe-buffer "5.1.2"
 
+batch@0.5.3:
+  version "0.5.3"
+  resolved "https://registry.yarnpkg.com/batch/-/batch-0.5.3.tgz#3f3414f380321743bfc1042f9a83ff1d5824d464"
+  integrity sha1-PzQU84AyF0O/wQQvmoP/HVgk1GQ=
+
 batch@0.6.1:
   version "0.6.1"
   resolved "https://registry.yarnpkg.com/batch/-/batch-0.6.1.tgz#dc34314f4e679318093fc760272525f94bf25c16"
@@ -4653,6 +4577,11 @@ bfj@6.1.1:
     hoopy "^0.1.2"
     tryer "^1.0.0"
 
+big-integer@^1.6.7:
+  version "1.6.42"
+  resolved "https://registry.yarnpkg.com/big-integer/-/big-integer-1.6.42.tgz#91623ae5ceeff9a47416c56c9440a66f12f534f1"
+  integrity sha512-3UQFKcRMx+5Z+IK5vYTMYK2jzLRJkt+XqyDdacgWgtMjjuifKpKTFneJLEgeBElOE2/lXZ1LcMcb5s8pwG2U8Q==
+
 big.js@^3.1.3:
   version "3.2.0"
   resolved "https://registry.yarnpkg.com/big.js/-/big.js-3.2.0.tgz#a5fc298b81b9e0dca2e458824784b65c52ba588e"
@@ -4729,6 +4658,22 @@ body-parser@1.18.3:
     raw-body "2.3.3"
     type-is "~1.6.16"
 
+body-parser@~1.13.3:
+  version "1.13.3"
+  resolved "https://registry.yarnpkg.com/body-parser/-/body-parser-1.13.3.tgz#c08cf330c3358e151016a05746f13f029c97fa97"
+  integrity sha1-wIzzMMM1jhUQFqBXRvE/ApyX+pc=
+  dependencies:
+    bytes "2.1.0"
+    content-type "~1.0.1"
+    debug "~2.2.0"
+    depd "~1.0.1"
+    http-errors "~1.3.1"
+    iconv-lite "0.4.11"
+    on-finished "~2.3.0"
+    qs "4.0.0"
+    raw-body "~2.1.2"
+    type-is "~1.6.6"
+
 body@^5.1.0:
   version "5.1.0"
   resolved "https://registry.yarnpkg.com/body/-/body-5.1.0.tgz#e4ba0ce410a46936323367609ecb4e6553125069"
@@ -4791,6 +4736,20 @@ boxen@^2.1.0:
     term-size "^1.2.0"
     widest-line "^2.0.0"
 
+bplist-creator@0.0.7:
+  version "0.0.7"
+  resolved "https://registry.yarnpkg.com/bplist-creator/-/bplist-creator-0.0.7.tgz#37df1536092824b87c42f957b01344117372ae45"
+  integrity sha1-N98VNgkoJLh8QvlXsBNEEXNyrkU=
+  dependencies:
+    stream-buffers "~2.2.0"
+
+bplist-parser@0.1.1:
+  version "0.1.1"
+  resolved "https://registry.yarnpkg.com/bplist-parser/-/bplist-parser-0.1.1.tgz#d60d5dcc20cba6dc7e1f299b35d3e1f95dafbae6"
+  integrity sha1-1g1dzCDLptx+HymbNdPh+V2vuuY=
+  dependencies:
+    big-integer "^1.6.7"
+
 brace-expansion@^1.1.7:
   version "1.1.11"
   resolved "https://registry.yarnpkg.com/brace-expansion/-/brace-expansion-1.1.11.tgz#3c7fcbf529d87226f3d2f52b966ff5271eb441dd"
@@ -5506,6 +5465,16 @@ bytes@1:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/bytes/-/bytes-1.0.0.tgz#3569ede8ba34315fab99c3e92cb04c7220de1fa8"
 
+bytes@2.1.0:
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/bytes/-/bytes-2.1.0.tgz#ac93c410e2ffc9cc7cf4b464b38289067f5e47b4"
+  integrity sha1-rJPEEOL/ycx89LRks4KJBn9eR7Q=
+
+bytes@2.4.0:
+  version "2.4.0"
+  resolved "https://registry.yarnpkg.com/bytes/-/bytes-2.4.0.tgz#7d97196f9d5baf7f6935e25985549edd2a6c2339"
+  integrity sha1-fZcZb51br39pNeJZhVSe3SpsIzk=
+
 bytes@3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/bytes/-/bytes-3.0.0.tgz#d32815404d689699f85a4ea4fa8755dd13a96048"
@@ -5765,6 +5734,11 @@ character-reference-invalid@^1.0.0:
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/character-reference-invalid/-/character-reference-invalid-1.1.2.tgz#21e421ad3d84055952dab4a43a04e73cd425d3ed"
 
+chardet@^0.4.0:
+  version "0.4.2"
+  resolved "https://registry.yarnpkg.com/chardet/-/chardet-0.4.2.tgz#b5473b33dc97c424e5d98dc87d55d4d8a29c8bf2"
+  integrity sha1-tUc7M9yXxCTl2Y3IfVXU2KKci/I=
+
 chardet@^0.7.0:
   version "0.7.0"
   resolved "https://registry.yarnpkg.com/chardet/-/chardet-0.7.0.tgz#90094849f0937f2eedc2425d0d28a9e5f0cbad9e"
@@ -5973,6 +5947,14 @@ clipboard@^2.0.0:
     select "^1.1.2"
     tiny-emitter "^2.0.0"
 
+clipboardy@^1.2.2:
+  version "1.2.3"
+  resolved "https://registry.yarnpkg.com/clipboardy/-/clipboardy-1.2.3.tgz#0526361bf78724c1f20be248d428e365433c07ef"
+  integrity sha512-2WNImOvCRe6r63Gk9pShfkwXsVtKCroMAevIbiae021mS850UkWPbevxsBz3tnvjZIEGvlwaqCPsw+4ulzNgJA==
+  dependencies:
+    arch "^2.1.0"
+    execa "^0.8.0"
+
 cliui@^3.2.0:
   version "3.2.0"
   resolved "https://registry.yarnpkg.com/cliui/-/cliui-3.2.0.tgz#120601537a916d29940f934da3b48d585a39213d"
@@ -6111,6 +6093,11 @@ color-string@^1.5.2:
     color-name "^1.0.0"
     simple-swizzle "^0.2.2"
 
+color-support@^1.1.3:
+  version "1.1.3"
+  resolved "https://registry.yarnpkg.com/color-support/-/color-support-1.1.3.tgz#93834379a1cc9a0c61f82f52f0d04322251bd5a2"
+  integrity sha512-qiBjkpbMLO/HL68y+lh4q0/O1MZFj2RX6X/KmMa3+gJD3z+WwI1ZzDHysvqHGS3mP6mznPckpXmw1nI9cJjyRg==
+
 color@^3.0.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/color/-/color-3.1.0.tgz#d8e9fb096732875774c84bf922815df0308d0ffc"
@@ -6219,6 +6206,13 @@ compressible@~2.0.14:
   dependencies:
     mime-db ">= 1.36.0 < 2"
 
+compressible@~2.0.5:
+  version "2.0.16"
+  resolved "https://registry.yarnpkg.com/compressible/-/compressible-2.0.16.tgz#a49bf9858f3821b64ce1be0296afc7380466a77f"
+  integrity sha512-JQfEOdnI7dASwCuSPWIeVYwc/zMsu/+tRhoUvEfXz2gxOA2DNjmG5vhtFdBlhWPPGo+RdT9S3tgc/uH5qgDiiA==
+  dependencies:
+    mime-db ">= 1.38.0 < 2"
+
 compression@^1.5.2, compression@^1.7.3:
   version "1.7.3"
   resolved "https://registry.yarnpkg.com/compression/-/compression-1.7.3.tgz#27e0e176aaf260f7f2c2813c3e440adb9f1993db"
@@ -6231,6 +6225,18 @@ compression@^1.5.2, compression@^1.7.3:
     safe-buffer "5.1.2"
     vary "~1.1.2"
 
+compression@~1.5.2:
+  version "1.5.2"
+  resolved "https://registry.yarnpkg.com/compression/-/compression-1.5.2.tgz#b03b8d86e6f8ad29683cba8df91ddc6ffc77b395"
+  integrity sha1-sDuNhub4rSloPLqN+R3cb/x3s5U=
+  dependencies:
+    accepts "~1.2.12"
+    bytes "2.1.0"
+    compressible "~2.0.5"
+    debug "~2.2.0"
+    on-headers "~1.0.0"
+    vary "~1.0.1"
+
 concat-map@0.0.1:
   version "0.0.1"
   resolved "https://registry.yarnpkg.com/concat-map/-/concat-map-0.0.1.tgz#d8a96bd77fd68df7793a73036a3ba0d5405d477b"
@@ -6295,7 +6301,54 @@ connect-history-api-fallback@^1.3.0:
   version "1.6.0"
   resolved "https://registry.yarnpkg.com/connect-history-api-fallback/-/connect-history-api-fallback-1.6.0.tgz#8b32089359308d111115d81cad3fceab888f97bc"
 
-connect@^3.6.6:
+connect-timeout@~1.6.2:
+  version "1.6.2"
+  resolved "https://registry.yarnpkg.com/connect-timeout/-/connect-timeout-1.6.2.tgz#de9a5ec61e33a12b6edaab7b5f062e98c599b88e"
+  integrity sha1-3ppexh4zoStu2qt7XwYumMWZuI4=
+  dependencies:
+    debug "~2.2.0"
+    http-errors "~1.3.1"
+    ms "0.7.1"
+    on-headers "~1.0.0"
+
+connect@^2.8.3:
+  version "2.30.2"
+  resolved "https://registry.yarnpkg.com/connect/-/connect-2.30.2.tgz#8da9bcbe8a054d3d318d74dfec903b5c39a1b609"
+  integrity sha1-jam8vooFTT0xjXTf7JA7XDmhtgk=
+  dependencies:
+    basic-auth-connect "1.0.0"
+    body-parser "~1.13.3"
+    bytes "2.1.0"
+    compression "~1.5.2"
+    connect-timeout "~1.6.2"
+    content-type "~1.0.1"
+    cookie "0.1.3"
+    cookie-parser "~1.3.5"
+    cookie-signature "1.0.6"
+    csurf "~1.8.3"
+    debug "~2.2.0"
+    depd "~1.0.1"
+    errorhandler "~1.4.2"
+    express-session "~1.11.3"
+    finalhandler "0.4.0"
+    fresh "0.3.0"
+    http-errors "~1.3.1"
+    method-override "~2.3.5"
+    morgan "~1.6.1"
+    multiparty "3.3.2"
+    on-headers "~1.0.0"
+    parseurl "~1.3.0"
+    pause "0.1.0"
+    qs "4.0.0"
+    response-time "~2.3.1"
+    serve-favicon "~2.3.0"
+    serve-index "~1.7.2"
+    serve-static "~1.10.0"
+    type-is "~1.6.6"
+    utils-merge "1.0.0"
+    vhost "~3.0.1"
+
+connect@^3.6.5, connect@^3.6.6:
   version "3.6.6"
   resolved "https://registry.yarnpkg.com/connect/-/connect-3.6.6.tgz#09eff6c55af7236e137135a72574858b6786f524"
   dependencies:
@@ -6343,7 +6396,7 @@ content-disposition@0.5.2:
   version "0.5.2"
   resolved "https://registry.yarnpkg.com/content-disposition/-/content-disposition-0.5.2.tgz#0cf68bb9ddf5f2be7961c3a85178cb85dba78cb4"
 
-content-type@^1.0.4, content-type@~1.0.4:
+content-type@^1.0.4, content-type@~1.0.1, content-type@~1.0.4:
   version "1.0.4"
   resolved "https://registry.yarnpkg.com/content-type/-/content-type-1.0.4.tgz#e138cc75e040c727b1966fe5e5f8c9aee256fe3b"
 
@@ -6437,10 +6490,23 @@ convert-source-map@~1.1.0:
   version "1.1.3"
   resolved "https://registry.yarnpkg.com/convert-source-map/-/convert-source-map-1.1.3.tgz#4829c877e9fe49b3161f3bf3673888e204699860"
 
+cookie-parser@~1.3.5:
+  version "1.3.5"
+  resolved "https://registry.yarnpkg.com/cookie-parser/-/cookie-parser-1.3.5.tgz#9d755570fb5d17890771227a02314d9be7cf8356"
+  integrity sha1-nXVVcPtdF4kHcSJ6AjFNm+fPg1Y=
+  dependencies:
+    cookie "0.1.3"
+    cookie-signature "1.0.6"
+
 cookie-signature@1.0.6:
   version "1.0.6"
   resolved "https://registry.yarnpkg.com/cookie-signature/-/cookie-signature-1.0.6.tgz#e303a882b342cc3ee8ca513a79999734dab3ae2c"
 
+cookie@0.1.3:
+  version "0.1.3"
+  resolved "https://registry.yarnpkg.com/cookie/-/cookie-0.1.3.tgz#e734a5c1417fce472d5aef82c381cabb64d1a435"
+  integrity sha1-5zSlwUF/zkctWu+Cw4HKu2TRpDU=
+
 cookie@0.3.1:
   version "0.3.1"
   resolved "https://registry.yarnpkg.com/cookie/-/cookie-0.3.1.tgz#e7e0a1f9ef43b4c8ba925c5c5a96e806d16873bb"
@@ -6504,6 +6570,11 @@ core-js@^1.0.0:
   version "1.2.7"
   resolved "https://registry.yarnpkg.com/core-js/-/core-js-1.2.7.tgz#652294c14651db28fa93bd2d5ff2983a4f08c636"
 
+core-js@^2.2.2, core-js@^2.4.1:
+  version "2.6.5"
+  resolved "https://registry.yarnpkg.com/core-js/-/core-js-2.6.5.tgz#44bc8d249e7fb2ff5d00e0341a7ffb94fbf67895"
+  integrity sha512-klh/kDpwX8hryYL14M9w/xei6vrv6sE8gTHDG7/T/+SEovB/G4ejwcfE/CBzO6Edsu+OETZMZ3wcX/EjUkrl5A==
+
 core-js@^2.4.0, core-js@^2.5.0, core-js@^2.5.7, core-js@^2.6.2:
   version "2.6.2"
   resolved "https://registry.yarnpkg.com/core-js/-/core-js-2.6.2.tgz#267988d7268323b349e20b4588211655f0e83944"
@@ -6560,6 +6631,11 @@ cosmiconfig@^5.0.0, cosmiconfig@^5.0.2, cosmiconfig@^5.0.5, cosmiconfig@^5.0.6,
     js-yaml "^3.9.0"
     parse-json "^4.0.0"
 
+crc@3.3.0:
+  version "3.3.0"
+  resolved "https://registry.yarnpkg.com/crc/-/crc-3.3.0.tgz#fa622e1bc388bf257309082d6b65200ce67090ba"
+  integrity sha1-+mIuG8OIvyVzCQgta2UgDOZwkLo=
+
 create-ecdh@^4.0.0:
   version "4.0.3"
   resolved "https://registry.yarnpkg.com/create-ecdh/-/create-ecdh-4.0.3.tgz#c9111b6f33045c4697f144787f9254cdc77c45ff"
@@ -6606,6 +6682,15 @@ create-hmac@^1.1.0, create-hmac@^1.1.2, create-hmac@^1.1.4:
     safe-buffer "^5.0.1"
     sha.js "^2.4.8"
 
+create-react-class@^15.5.2:
+  version "15.6.3"
+  resolved "https://registry.yarnpkg.com/create-react-class/-/create-react-class-15.6.3.tgz#2d73237fb3f970ae6ebe011a9e66f46dbca80036"
+  integrity sha512-M+/3Q6E6DLO6Yx3OwrWjwHBnvfXXYA7W+dFjt/ZDBemHO1DDZhsalX/NUtnTYclN6GfnBDRh4qRHjcDHmlJBJg==
+  dependencies:
+    fbjs "^0.8.9"
+    loose-envify "^1.3.1"
+    object-assign "^4.1.1"
+
 create-react-context@<=0.2.2:
   version "0.2.2"
   resolved "https://registry.yarnpkg.com/create-react-context/-/create-react-context-0.2.2.tgz#9836542f9aaa22868cd7d4a6f82667df38019dca"
@@ -6658,7 +6743,7 @@ cross-spawn@^4.0.2:
     lru-cache "^4.0.1"
     which "^1.2.9"
 
-cross-spawn@^5.0.1:
+cross-spawn@^5.0.1, cross-spawn@^5.1.0:
   version "5.1.0"
   resolved "https://registry.yarnpkg.com/cross-spawn/-/cross-spawn-5.1.0.tgz#e8bd0efee58fcff6f8f94510a0a554bbfa235449"
   dependencies:
@@ -6686,6 +6771,15 @@ crypto-random-string@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/crypto-random-string/-/crypto-random-string-1.0.0.tgz#a230f64f568310e1498009940790ec99545bca7e"
 
+csrf@~3.0.0:
+  version "3.0.6"
+  resolved "https://registry.yarnpkg.com/csrf/-/csrf-3.0.6.tgz#b61120ddceeafc91e76ed5313bb5c0b2667b710a"
+  integrity sha1-thEg3c7q/JHnbtUxO7XAsmZ7cQo=
+  dependencies:
+    rndm "1.2.0"
+    tsscmp "1.0.5"
+    uid-safe "2.1.4"
+
 css-color-names@0.0.4, css-color-names@^0.0.4:
   version "0.0.4"
   resolved "https://registry.yarnpkg.com/css-color-names/-/css-color-names-0.0.4.tgz#808adc2e79cf84738069b646cb20ec27beb629e0"
@@ -6898,6 +6992,16 @@ csstype@^2.2.0, csstype@^2.5.2, csstype@^2.5.7:
   version "2.6.0"
   resolved "https://registry.yarnpkg.com/csstype/-/csstype-2.6.0.tgz#6cf7b2fa7fc32aab3d746802c244d4eda71371a2"
 
+csurf@~1.8.3:
+  version "1.8.3"
+  resolved "https://registry.yarnpkg.com/csurf/-/csurf-1.8.3.tgz#23f2a13bf1d8fce1d0c996588394442cba86a56a"
+  integrity sha1-I/KhO/HY/OHQyZZYg5RELLqGpWo=
+  dependencies:
+    cookie "0.1.3"
+    cookie-signature "1.0.6"
+    csrf "~3.0.0"
+    http-errors "~1.3.1"
+
 currently-unhandled@^0.4.1:
   version "0.4.1"
   resolved "https://registry.yarnpkg.com/currently-unhandled/-/currently-unhandled-0.4.1.tgz#988df33feab191ef799a61369dd76c17adf957ea"
@@ -7026,6 +7130,13 @@ debug@^3.0.1, debug@^3.1.0, debug@^3.2.5:
   dependencies:
     ms "^2.1.1"
 
+debug@~2.2.0:
+  version "2.2.0"
+  resolved "https://registry.yarnpkg.com/debug/-/debug-2.2.0.tgz#f87057e995b1a1f6ae6a4960664137bc56f039da"
+  integrity sha1-+HBX6ZWxofauaklgZkE3vFbwOdo=
+  dependencies:
+    ms "0.7.1"
+
 debuglog@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/debuglog/-/debuglog-1.0.1.tgz#aa24ffb9ac3df9a2351837cfb2d279360cd78492"
@@ -7179,7 +7290,12 @@ denodeify@^1.2.1:
   version "1.2.1"
   resolved "https://registry.yarnpkg.com/denodeify/-/denodeify-1.2.1.tgz#3a36287f5034e699e7577901052c2e6c94251631"
 
-depd@~1.1.2:
+depd@~1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/depd/-/depd-1.0.1.tgz#80aec64c9d6d97e65cc2a9caa93c0aa6abf73aaa"
+  integrity sha1-gK7GTJ1tl+ZcwqnKqTwKpqv3Oqo=
+
+depd@~1.1.0, depd@~1.1.2:
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/depd/-/depd-1.1.2.tgz#9bcd52e14c097763e749b274c4346ed2e560b5a9"
 
@@ -7902,14 +8018,6 @@ emojis-list@^2.0.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/emojis-list/-/emojis-list-2.1.0.tgz#4daa4d9db00f9819880c79fa457ae5b09a1fd389"
 
-emotion-theming@^10.0.5:
-  version "10.0.6"
-  resolved "https://registry.yarnpkg.com/emotion-theming/-/emotion-theming-10.0.6.tgz#869f8d40e4f2549dbc165bd9c43bdf5fbedfeab8"
-  dependencies:
-    "@emotion/weak-memoize" "0.2.2"
-    hoist-non-react-statics "^2.3.1"
-    object-assign "^4.1.1"
-
 emotion-theming@^10.0.7:
   version "10.0.7"
   resolved "https://registry.yarnpkg.com/emotion-theming/-/emotion-theming-10.0.7.tgz#0629740840f2ff6b929a7c3d52811187768e91c9"
@@ -8002,6 +8110,17 @@ env-ci@^2.1.0:
     execa "^1.0.0"
     java-properties "^0.2.9"
 
+envinfo@^3.0.0:
+  version "3.11.1"
+  resolved "https://registry.yarnpkg.com/envinfo/-/envinfo-3.11.1.tgz#45968faf5079aa797b7dcdc3b123f340d4529e1c"
+  integrity sha512-hKkh7aKtont6Zuv4RmE4VkOc96TkBj9NXj7Ghsd/qCA9LuJI0Dh+ImwA1N5iORB9Vg+sz5bq9CHJzs51BILNCQ==
+  dependencies:
+    clipboardy "^1.2.2"
+    glob "^7.1.2"
+    minimist "^1.2.0"
+    os-name "^2.0.1"
+    which "^1.2.14"
+
 enzyme-adapter-react-16@^1.9.1:
   version "1.9.1"
   resolved "https://registry.yarnpkg.com/enzyme-adapter-react-16/-/enzyme-adapter-react-16-1.9.1.tgz#6d49a3a31c3a0fccf527610f31b837e0f307128a"
@@ -8090,6 +8209,14 @@ error@^7.0.0:
     string-template "~0.2.1"
     xtend "~4.0.0"
 
+errorhandler@~1.4.2:
+  version "1.4.3"
+  resolved "https://registry.yarnpkg.com/errorhandler/-/errorhandler-1.4.3.tgz#b7b70ed8f359e9db88092f2d20c0f831420ad83f"
+  integrity sha1-t7cO2PNZ6duICS8tIMD4MUIK2D8=
+  dependencies:
+    accepts "~1.3.0"
+    escape-html "~1.0.3"
+
 es-abstract@^1.10.0, es-abstract@^1.11.0, es-abstract@^1.12.0, es-abstract@^1.4.3, es-abstract@^1.5.0, es-abstract@^1.5.1, es-abstract@^1.7.0, es-abstract@^1.9.0:
   version "1.13.0"
   resolved "https://registry.yarnpkg.com/es-abstract/-/es-abstract-1.13.0.tgz#ac86145fdd5099d8dd49558ccba2eaf9b88e24e9"
@@ -8161,6 +8288,11 @@ es6-templates@^0.2.3:
     recast "~0.11.12"
     through "~2.3.6"
 
+escape-html@1.0.2:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/escape-html/-/escape-html-1.0.2.tgz#d77d32fa98e38c2f41ae85e9278e0e0e6ba1022c"
+  integrity sha1-130y+pjjjC9BroXpJ44ODmuhAiw=
+
 escape-html@^1.0.3, escape-html@~1.0.3:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/escape-html/-/escape-html-1.0.3.tgz#0258eae4d3d0c0974de1c169188ef0051d1d1988"
@@ -8553,10 +8685,20 @@ esutils@^2.0.0, esutils@^2.0.2:
   version "2.0.2"
   resolved "https://registry.yarnpkg.com/esutils/-/esutils-2.0.2.tgz#0abf4f1caa5bcb1f7a9d8acc6dea4faaa04bac9b"
 
+etag@~1.7.0:
+  version "1.7.0"
+  resolved "https://registry.yarnpkg.com/etag/-/etag-1.7.0.tgz#03d30b5f67dd6e632d2945d30d6652731a34d5d8"
+  integrity sha1-A9MLX2fdbmMtKUXTDWZScxo01dg=
+
 etag@~1.8.1:
   version "1.8.1"
   resolved "https://registry.yarnpkg.com/etag/-/etag-1.8.1.tgz#41ae2eeb65efa62268aebfea83ac7d79299b0887"
 
+event-target-shim@^1.0.5:
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/event-target-shim/-/event-target-shim-1.1.1.tgz#a86e5ee6bdaa16054475da797ccddf0c55698491"
+  integrity sha1-qG5e5r2qFgVEddp5fM3fDFVphJE=
+
 eventemitter3@^3.0.0, eventemitter3@^3.1.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/eventemitter3/-/eventemitter3-3.1.0.tgz#090b4d6cdbd645ed10bf750d4b5407942d7ba163"
@@ -8644,6 +8786,19 @@ execa@^0.7.0:
     signal-exit "^3.0.0"
     strip-eof "^1.0.0"
 
+execa@^0.8.0:
+  version "0.8.0"
+  resolved "https://registry.yarnpkg.com/execa/-/execa-0.8.0.tgz#d8d76bbc1b55217ed190fd6dd49d3c774ecfc8da"
+  integrity sha1-2NdrvBtVIX7RkP1t1J08d07PyNo=
+  dependencies:
+    cross-spawn "^5.0.1"
+    get-stream "^3.0.0"
+    is-stream "^1.1.0"
+    npm-run-path "^2.0.0"
+    p-finally "^1.0.0"
+    signal-exit "^3.0.0"
+    strip-eof "^1.0.0"
+
 execa@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/execa/-/execa-1.0.0.tgz#c6236a5bb4df6d6f15e88e7f017798216749ddd8"
@@ -8737,6 +8892,21 @@ express-graphql@^0.7.1:
     http-errors "^1.7.1"
     raw-body "^2.3.3"
 
+express-session@~1.11.3:
+  version "1.11.3"
+  resolved "https://registry.yarnpkg.com/express-session/-/express-session-1.11.3.tgz#5cc98f3f5ff84ed835f91cbf0aabd0c7107400af"
+  integrity sha1-XMmPP1/4Ttg1+Ry/CqvQxxB0AK8=
+  dependencies:
+    cookie "0.1.3"
+    cookie-signature "1.0.6"
+    crc "3.3.0"
+    debug "~2.2.0"
+    depd "~1.0.1"
+    on-headers "~1.0.0"
+    parseurl "~1.3.0"
+    uid-safe "~2.0.0"
+    utils-merge "1.0.0"
+
 express@^4.10.7, express@^4.16.2, express@^4.16.3:
   version "4.16.4"
   resolved "https://registry.yarnpkg.com/express/-/express-4.16.4.tgz#fddef61926109e24c515ea97fd2f1bdbf62df12e"
@@ -8772,6 +8942,13 @@ express@^4.10.7, express@^4.16.2, express@^4.16.3:
     utils-merge "1.0.1"
     vary "~1.1.2"
 
+extend-shallow@^1.1.2:
+  version "1.1.4"
+  resolved "https://registry.yarnpkg.com/extend-shallow/-/extend-shallow-1.1.4.tgz#19d6bf94dfc09d76ba711f39b872d21ff4dd9071"
+  integrity sha1-Gda/lN/AnXa6cR85uHLSH/TdkHE=
+  dependencies:
+    kind-of "^1.1.0"
+
 extend-shallow@^2.0.1:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/extend-shallow/-/extend-shallow-2.0.1.tgz#51af7d614ad9a9f610ea1bafbb989d6b1c56890f"
@@ -8797,6 +8974,15 @@ external-editor@^1.1.0:
     spawn-sync "^1.0.15"
     tmp "^0.0.29"
 
+external-editor@^2.0.4:
+  version "2.2.0"
+  resolved "https://registry.yarnpkg.com/external-editor/-/external-editor-2.2.0.tgz#045511cfd8d133f3846673d1047c154e214ad3d5"
+  integrity sha512-bSn6gvGxKt+b7+6TKEv1ZycHleA7aHhRHyAqJyp5pbUFuYYNIzpZnQDk7AsYckyWdEnTeAnay0aCy2aV6iTk9A==
+  dependencies:
+    chardet "^0.4.0"
+    iconv-lite "^0.4.17"
+    tmp "^0.0.33"
+
 external-editor@^3.0.0:
   version "3.0.3"
   resolved "https://registry.yarnpkg.com/external-editor/-/external-editor-3.0.3.tgz#5866db29a97826dbe4bf3afd24070ead9ea43a27"
@@ -8841,6 +9027,16 @@ extsprintf@^1.2.0:
   version "1.4.0"
   resolved "https://registry.yarnpkg.com/extsprintf/-/extsprintf-1.4.0.tgz#e2689f8f356fad62cca65a3a91c5df5f9551692f"
 
+fancy-log@^1.3.2:
+  version "1.3.3"
+  resolved "https://registry.yarnpkg.com/fancy-log/-/fancy-log-1.3.3.tgz#dbc19154f558690150a23953a0adbd035be45fc7"
+  integrity sha512-k9oEhlyc0FrVh25qYuSELjr8oxsCoc4/LEZfg2iJJrfEk/tZL9bCoJE47gqAvI2m/AUjluCS4+3I0eTx8n3AEw==
+  dependencies:
+    ansi-gray "^0.1.1"
+    color-support "^1.1.3"
+    parse-node-version "^1.0.0"
+    time-stamp "^1.0.0"
+
 fashion-model-defaults@^1.0.1:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/fashion-model-defaults/-/fashion-model-defaults-1.1.1.tgz#ef556cbe1616161a66d83e472794592c65f129a8"
@@ -8930,7 +9126,23 @@ fb-watchman@^2.0.0:
   dependencies:
     bser "^2.0.0"
 
-fbjs@^0.8.0, fbjs@^0.8.1, fbjs@^0.8.4:
+fbjs-scripts@^0.8.1:
+  version "0.8.3"
+  resolved "https://registry.yarnpkg.com/fbjs-scripts/-/fbjs-scripts-0.8.3.tgz#b854de7a11e62a37f72dab9aaf4d9b53c4a03174"
+  integrity sha512-aUJ/uEzMIiBYuj/blLp4sVNkQQ7ZEB/lyplG1IzzOmZ83meiWecrGg5jBo4wWrxXmO4RExdtsSV1QkTjPt2Gag==
+  dependencies:
+    ansi-colors "^1.0.1"
+    babel-core "^6.7.2"
+    babel-preset-fbjs "^2.1.2"
+    core-js "^2.4.1"
+    cross-spawn "^5.1.0"
+    fancy-log "^1.3.2"
+    object-assign "^4.0.1"
+    plugin-error "^0.1.2"
+    semver "^5.1.0"
+    through2 "^2.0.0"
+
+fbjs@^0.8.0, fbjs@^0.8.1, fbjs@^0.8.14, fbjs@^0.8.4, fbjs@^0.8.9:
   version "0.8.17"
   resolved "https://registry.yarnpkg.com/fbjs/-/fbjs-0.8.17.tgz#c4d598ead6949112653d6588b01a5cdcd9f90fdd"
   dependencies:
@@ -9035,6 +9247,16 @@ fill-range@^4.0.0:
     repeat-string "^1.6.1"
     to-regex-range "^2.1.0"
 
+finalhandler@0.4.0:
+  version "0.4.0"
+  resolved "https://registry.yarnpkg.com/finalhandler/-/finalhandler-0.4.0.tgz#965a52d9e8d05d2b857548541fb89b53a2497d9b"
+  integrity sha1-llpS2ejQXSuFdUhUH7ibU6JJfZs=
+  dependencies:
+    debug "~2.2.0"
+    escape-html "1.0.2"
+    on-finished "~2.3.0"
+    unpipe "~1.0.0"
+
 finalhandler@1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/finalhandler/-/finalhandler-1.1.0.tgz#ce0b6855b45853e791b2fcc680046d88253dd7f5"
@@ -9281,6 +9503,11 @@ fragment-cache@^0.2.1:
   dependencies:
     map-cache "^0.2.2"
 
+fresh@0.3.0:
+  version "0.3.0"
+  resolved "https://registry.yarnpkg.com/fresh/-/fresh-0.3.0.tgz#651f838e22424e7566de161d8358caa199f83d4f"
+  integrity sha1-ZR+DjiJCTnVm3hYdg1jKoZn4PU8=
+
 fresh@0.5.2:
   version "0.5.2"
   resolved "https://registry.yarnpkg.com/fresh/-/fresh-0.5.2.tgz#3d8cadd90d976569fa835ab1f8e4b23a105605a7"
@@ -9331,6 +9558,15 @@ fs-extra@^0.30.0:
     path-is-absolute "^1.0.0"
     rimraf "^2.2.8"
 
+fs-extra@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/fs-extra/-/fs-extra-1.0.0.tgz#cd3ce5f7e7cb6145883fcae3191e9877f8587950"
+  integrity sha1-zTzl9+fLYUWIP8rjGR6Yd/hYeVA=
+  dependencies:
+    graceful-fs "^4.1.2"
+    jsonfile "^2.1.0"
+    klaw "^1.0.0"
+
 fs-extra@^4.0.2, fs-extra@^4.0.3:
   version "4.0.3"
   resolved "https://registry.yarnpkg.com/fs-extra/-/fs-extra-4.0.3.tgz#0d852122e5bc5beb453fb028e9c0c9bf36340c94"
@@ -9470,6 +9706,17 @@ g-status@^2.0.2:
     matcher "^1.0.0"
     simple-git "^1.85.0"
 
+gauge@~1.2.5:
+  version "1.2.7"
+  resolved "https://registry.yarnpkg.com/gauge/-/gauge-1.2.7.tgz#e9cec5483d3d4ee0ef44b60a7d99e4935e136d93"
+  integrity sha1-6c7FSD09TuDvRLYKfZnkk14TbZM=
+  dependencies:
+    ansi "^0.3.0"
+    has-unicode "^2.0.0"
+    lodash.pad "^4.1.0"
+    lodash.padend "^4.1.0"
+    lodash.padstart "^4.1.0"
+
 gauge@~2.7.3:
   version "2.7.4"
   resolved "https://registry.yarnpkg.com/gauge/-/gauge-2.7.4.tgz#2c03405c7538c39d7eb37b317022e325fb018bf7"
@@ -9711,7 +9958,7 @@ global-prefix@^1.0.1:
     is-windows "^1.0.1"
     which "^1.2.14"
 
-global@^4.3.2:
+global@^4.3.0, global@^4.3.2:
   version "4.3.2"
   resolved "https://registry.yarnpkg.com/global/-/global-4.3.2.tgz#e76989268a6c74c38908b1305b10fc0e394e9d0f"
   dependencies:
@@ -10325,6 +10572,14 @@ http-errors@^1.7.1:
     statuses ">= 1.5.0 < 2"
     toidentifier "1.0.0"
 
+http-errors@~1.3.1:
+  version "1.3.1"
+  resolved "https://registry.yarnpkg.com/http-errors/-/http-errors-1.3.1.tgz#197e22cdebd4198585e8694ef6786197b91ed942"
+  integrity sha1-GX4izevUGYWF6GlO9nhhl7ke2UI=
+  dependencies:
+    inherits "~2.0.1"
+    statuses "1"
+
 http-parser-js@>=0.4.0:
   version "0.5.0"
   resolved "https://registry.yarnpkg.com/http-parser-js/-/http-parser-js-0.5.0.tgz#d65edbede84349d0dc30320815a15d39cc3cbbd8"
@@ -10410,13 +10665,23 @@ hyperlinker@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/hyperlinker/-/hyperlinker-1.0.0.tgz#23dc9e38a206b208ee49bc2d6c8ef47027df0c0e"
 
+iconv-lite@0.4.11:
+  version "0.4.11"
+  resolved "https://registry.yarnpkg.com/iconv-lite/-/iconv-lite-0.4.11.tgz#2ecb42fd294744922209a2e7c404dac8793d8ade"
+  integrity sha1-LstC/SlHRJIiCaLnxATayHk9it4=
+
+iconv-lite@0.4.13:
+  version "0.4.13"
+  resolved "https://registry.yarnpkg.com/iconv-lite/-/iconv-lite-0.4.13.tgz#1f88aba4ab0b1508e8312acc39345f36e992e2f2"
+  integrity sha1-H4irpKsLFQjoMSrMOTRfNumS4vI=
+
 iconv-lite@0.4.23:
   version "0.4.23"
   resolved "https://registry.yarnpkg.com/iconv-lite/-/iconv-lite-0.4.23.tgz#297871f63be507adcfbfca715d0cd0eed84e9a63"
   dependencies:
     safer-buffer ">= 2.1.2 < 3"
 
-iconv-lite@0.4.24, iconv-lite@^0.4.24, iconv-lite@^0.4.4, iconv-lite@~0.4.13:
+iconv-lite@0.4.24, iconv-lite@^0.4.17, iconv-lite@^0.4.24, iconv-lite@^0.4.4, iconv-lite@~0.4.13:
   version "0.4.24"
   resolved "https://registry.yarnpkg.com/iconv-lite/-/iconv-lite-0.4.24.tgz#2022b4b25fbddc21d2f524974a474aafe733908b"
   dependencies:
@@ -10473,7 +10738,7 @@ ignoring-watcher@^1.0.5:
     chokidar "^1.4.3"
     raptor-util "^1.0.7"
 
-image-size@^0.6.3:
+image-size@^0.6.0, image-size@^0.6.3:
   version "0.6.3"
   resolved "https://registry.yarnpkg.com/image-size/-/image-size-0.6.3.tgz#e7e5c65bb534bd7cdcedd6cb5166272a85f75fb2"
 
@@ -10688,6 +10953,26 @@ inquirer@^2:
     strip-ansi "^3.0.0"
     through "^2.3.6"
 
+inquirer@^3.0.6:
+  version "3.3.0"
+  resolved "https://registry.yarnpkg.com/inquirer/-/inquirer-3.3.0.tgz#9dd2f2ad765dcab1ff0443b491442a20ba227dc9"
+  integrity sha512-h+xtnyk4EwKvFWHrUYsWErEVR+igKtLdchu+o0Z1RL7VU/jVMFbYir2bp6bAj8efFNxWqHX0dIss6fJQ+/+qeQ==
+  dependencies:
+    ansi-escapes "^3.0.0"
+    chalk "^2.0.0"
+    cli-cursor "^2.1.0"
+    cli-width "^2.0.0"
+    external-editor "^2.0.4"
+    figures "^2.0.0"
+    lodash "^4.3.0"
+    mute-stream "0.0.7"
+    run-async "^2.2.0"
+    rx-lite "^4.0.8"
+    rx-lite-aggregates "^4.0.8"
+    string-width "^2.1.0"
+    strip-ansi "^4.0.0"
+    through "^2.3.6"
+
 insert-module-globals@^7.0.0:
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/insert-module-globals/-/insert-module-globals-7.2.0.tgz#ec87e5b42728479e327bd5c5c71611ddfb4752ba"
@@ -11489,10 +11774,24 @@ jest-diff@^24.0.0:
     jest-get-type "^24.0.0"
     pretty-format "^24.0.0"
 
+jest-docblock@22.1.0:
+  version "22.1.0"
+  resolved "https://registry.yarnpkg.com/jest-docblock/-/jest-docblock-22.1.0.tgz#3fe5986d5444cbcb149746eb4b07c57c5a464dfd"
+  integrity sha512-/+OGgBVRJb5wCbXrB1LQvibQBz2SdrvDdKRNzY1gL+OISQJZCR9MOewbygdT5rVzbbkfhC4AR2x+qWmNUdJfjw==
+  dependencies:
+    detect-newline "^2.1.0"
+
 jest-docblock@^21.0.0:
   version "21.2.0"
   resolved "https://registry.yarnpkg.com/jest-docblock/-/jest-docblock-21.2.0.tgz#51529c3b30d5fd159da60c27ceedc195faf8d414"
 
+jest-docblock@^22.1.0:
+  version "22.4.3"
+  resolved "https://registry.yarnpkg.com/jest-docblock/-/jest-docblock-22.4.3.tgz#50886f132b42b280c903c592373bb6e93bb68b19"
+  integrity sha512-uPKBEAw7YrEMcXueMKZXn/rbMxBiSv48fSqy3uEnmgOlQhSX+lthBqHb1fKWNVmFqAp9E/RsSdBfiV31LbzaOg==
+  dependencies:
+    detect-newline "^2.1.0"
+
 jest-docblock@^23.2.0:
   version "23.2.0"
   resolved "https://registry.yarnpkg.com/jest-docblock/-/jest-docblock-23.2.0.tgz#f085e1f18548d99fdd69b20207e6fd55d91383a7"
@@ -11584,6 +11883,18 @@ jest-get-type@^24.0.0:
   version "24.0.0"
   resolved "https://registry.yarnpkg.com/jest-get-type/-/jest-get-type-24.0.0.tgz#36e72930b78e33da59a4f63d44d332188278940b"
 
+jest-haste-map@22.1.0:
+  version "22.1.0"
+  resolved "https://registry.yarnpkg.com/jest-haste-map/-/jest-haste-map-22.1.0.tgz#1174c6ff393f9818ebf1163710d8868b5370da2a"
+  integrity sha512-vETdC6GboGlZX6+9SMZkXtYRQSKBbQ47sFF7NGglbMN4eyIZBODply8rlcO01KwBiAeiNCKdjUyfonZzJ93JEg==
+  dependencies:
+    fb-watchman "^2.0.0"
+    graceful-fs "^4.1.11"
+    jest-docblock "^22.1.0"
+    jest-worker "^22.1.0"
+    micromatch "^2.3.11"
+    sane "^2.0.0"
+
 jest-haste-map@^23.6.0:
   version "23.6.0"
   resolved "https://registry.yarnpkg.com/jest-haste-map/-/jest-haste-map-23.6.0.tgz#2e3eb997814ca696d62afdb3f2529f5bbc935e16"
@@ -11927,6 +12238,20 @@ jest-watcher@^23.4.0:
     chalk "^2.0.1"
     string-length "^2.0.0"
 
+jest-worker@22.1.0:
+  version "22.1.0"
+  resolved "https://registry.yarnpkg.com/jest-worker/-/jest-worker-22.1.0.tgz#0987832fe58fbdc205357f4c19b992446368cafb"
+  integrity sha512-ezLueYAQowk5N6g2J7bNZfq4NWZvMNB5Qd24EmOZLcM5SXTdiFvxykZIoNiMj9C98cCbPaojX8tfR7b1LJwNig==
+  dependencies:
+    merge-stream "^1.0.1"
+
+jest-worker@^22.1.0:
+  version "22.4.3"
+  resolved "https://registry.yarnpkg.com/jest-worker/-/jest-worker-22.4.3.tgz#5c421417cba1c0abf64bf56bd5fb7968d79dd40b"
+  integrity sha512-B1ucW4fI8qVAuZmicFxI1R3kr2fNeYJyvIQ1rKcuLYnenFV5K5aMbxFj6J0i00Ju83S8jP2d7Dz14+AvbIHRYQ==
+  dependencies:
+    merge-stream "^1.0.1"
+
 jest-worker@^23.2.0:
   version "23.2.0"
   resolved "https://registry.yarnpkg.com/jest-worker/-/jest-worker-23.2.0.tgz#faf706a8da36fae60eb26957257fa7b5d8ea02b9"
@@ -12156,6 +12481,11 @@ json5@2.x, json5@^2.1.0:
   dependencies:
     minimist "^1.2.0"
 
+json5@^0.4.0:
+  version "0.4.0"
+  resolved "https://registry.yarnpkg.com/json5/-/json5-0.4.0.tgz#054352e4c4c80c86c0923877d449de176a732c8d"
+  integrity sha1-BUNS5MTIDIbAkjh31EneF2pzLI0=
+
 json5@^0.5.0, json5@^0.5.1:
   version "0.5.1"
   resolved "https://registry.yarnpkg.com/json5/-/json5-0.5.1.tgz#1eade7acc012034ad84e2396767ead9fa5495821"
@@ -12266,6 +12596,11 @@ killable@^1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/killable/-/killable-1.0.1.tgz#4c8ce441187a061c7474fb87ca08e2a638194892"
 
+kind-of@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/kind-of/-/kind-of-1.1.0.tgz#140a3d2d41a36d2efcfa9377b62c24f8495a5c44"
+  integrity sha1-FAo9LUGjbS78+pN3tiwk+ElaXEQ=
+
 kind-of@^2.0.1:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/kind-of/-/kind-of-2.0.1.tgz#018ec7a4ce7e3a86cb9141be519d24c8faa981b5"
@@ -12467,7 +12802,7 @@ leek@0.0.24:
     lodash.assign "^3.2.0"
     rsvp "^3.0.21"
 
-left-pad@^1.3.0:
+left-pad@^1.1.3, left-pad@^1.3.0:
   version "1.3.0"
   resolved "https://registry.yarnpkg.com/left-pad/-/left-pad-1.3.0.tgz#5b8a3a7765dfe001261dde915589e782f8c94d1e"
 
@@ -13215,6 +13550,21 @@ lodash.once@^4.0.0:
   version "4.1.1"
   resolved "https://registry.yarnpkg.com/lodash.once/-/lodash.once-4.1.1.tgz#0dd3971213c7c56df880977d504c88fb471a97ac"
 
+lodash.pad@^4.1.0:
+  version "4.5.1"
+  resolved "https://registry.yarnpkg.com/lodash.pad/-/lodash.pad-4.5.1.tgz#4330949a833a7c8da22cc20f6a26c4d59debba70"
+  integrity sha1-QzCUmoM6fI2iLMIPaibE1Z3runA=
+
+lodash.padend@^4.1.0:
+  version "4.6.1"
+  resolved "https://registry.yarnpkg.com/lodash.padend/-/lodash.padend-4.6.1.tgz#53ccba047d06e158d311f45da625f4e49e6f166e"
+  integrity sha1-U8y6BH0G4VjTEfRdpiX05J5vFm4=
+
+lodash.padstart@^4.1.0:
+  version "4.6.1"
+  resolved "https://registry.yarnpkg.com/lodash.padstart/-/lodash.padstart-4.6.1.tgz#d2e3eebff0d9d39ad50f5cbd1b52a7bce6bb611b"
+  integrity sha1-0uPuv/DZ05rVD1y9G1KnvOa7YRs=
+
 lodash.pick@^4.4.0:
   version "4.4.0"
   resolved "https://registry.yarnpkg.com/lodash.pick/-/lodash.pick-4.4.0.tgz#52f05610fff9ded422611441ed1fc123a03001b3"
@@ -13295,11 +13645,11 @@ lodash.values@~2.3.0:
   dependencies:
     lodash.keys "~2.3.0"
 
-lodash@>4.17.4, "lodash@>=3.5 <5", lodash@^4.0.0, lodash@^4.0.1, lodash@^4.13.1, lodash@^4.15.0, lodash@^4.17.10, lodash@^4.17.11, lodash@^4.17.4, lodash@^4.17.5, lodash@^4.2.1, lodash@^4.3.0, lodash@~4.17.10:
+lodash@>4.17.4, "lodash@>=3.5 <5", lodash@^4.0.0, lodash@^4.0.1, lodash@^4.13.1, lodash@^4.15.0, lodash@^4.16.6, lodash@^4.17.10, lodash@^4.17.11, lodash@^4.17.4, lodash@^4.17.5, lodash@^4.2.1, lodash@^4.3.0, lodash@^4.6.1, lodash@~4.17.10:
   version "4.17.11"
   resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.11.tgz#b39ea6229ef607ecd89e2c8df12536891cac9b8d"
 
-lodash@^3.3.1:
+lodash@^3.3.1, lodash@^3.5.0:
   version "3.10.1"
   resolved "https://registry.yarnpkg.com/lodash/-/lodash-3.10.1.tgz#5bf45e8e49ba4189e17d482789dfd15bd140b7b6"
 
@@ -13379,6 +13729,11 @@ lru-cache@^5.1.1:
   dependencies:
     yallist "^3.0.2"
 
+macos-release@^1.0.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/macos-release/-/macos-release-1.1.0.tgz#831945e29365b470aa8724b0ab36c8f8959d10fb"
+  integrity sha512-mmLbumEYMi5nXReB9js3WGsB8UE6cDBWyIO62Z4DNx6GbRhDxHNjA1MlzSpJ2S2KM1wyiPRA0d19uHWYYvMHjA==
+
 macos-release@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/macos-release/-/macos-release-2.0.0.tgz#7dddf4caf79001a851eb4fba7fb6034f251276ab"
@@ -13779,10 +14134,85 @@ merge@^1.2.0:
   version "1.2.1"
   resolved "https://registry.yarnpkg.com/merge/-/merge-1.2.1.tgz#38bebf80c3220a8a487b6fcfb3941bb11720c145"
 
+method-override@~2.3.5:
+  version "2.3.10"
+  resolved "https://registry.yarnpkg.com/method-override/-/method-override-2.3.10.tgz#e3daf8d5dee10dd2dce7d4ae88d62bbee77476b4"
+  integrity sha1-49r41d7hDdLc59SuiNYrvud0drQ=
+  dependencies:
+    debug "2.6.9"
+    methods "~1.1.2"
+    parseurl "~1.3.2"
+    vary "~1.1.2"
+
 methods@~1.1.2:
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/methods/-/methods-1.1.2.tgz#5529a4d67654134edcc5266656835b0f851afcee"
 
+metro-core@0.24.7, metro-core@^0.24.1:
+  version "0.24.7"
+  resolved "https://registry.yarnpkg.com/metro-core/-/metro-core-0.24.7.tgz#89e4fbea5bad574eb971459ebfa74c028f52d278"
+  integrity sha512-Qheab9Wmc8T2m3Ax9COyKUk8LxRb1fHWe13CpoEgPIjwFBd6ILNXaq7ZzoWg0OoAbpMsNzvUOnOJNHvfRuJqJg==
+  dependencies:
+    lodash.throttle "^4.1.1"
+
+metro-source-map@0.24.7:
+  version "0.24.7"
+  resolved "https://registry.yarnpkg.com/metro-source-map/-/metro-source-map-0.24.7.tgz#b13d0ae6417c2a2cd3d521ae6cd898196748ec0b"
+  integrity sha512-12WEgolY5CGvHeHkF5QlM2qatdQC1DyjWkXLK9LzCqzd8YhUZww1+ZCM6E67rJwpeuCU9o1Mkiwd1h7dS+RBvA==
+  dependencies:
+    source-map "^0.5.6"
+
+metro@^0.24.1:
+  version "0.24.7"
+  resolved "https://registry.yarnpkg.com/metro/-/metro-0.24.7.tgz#42cecdb236b702d16243812294f7d3b97c43378d"
+  integrity sha512-9Fr3PDPPCTR3WJUHPLZL2nvyEWyvqyyxH9649OmA2TOF7VEtRzWedZlc6PAcl/rDOzwDOu2/c98NRFxnS1CYlw==
+  dependencies:
+    absolute-path "^0.0.0"
+    async "^2.4.0"
+    babel-core "^6.24.1"
+    babel-generator "^6.26.0"
+    babel-plugin-external-helpers "^6.18.0"
+    babel-preset-es2015-node "^6.1.1"
+    babel-preset-fbjs "^2.1.4"
+    babel-preset-react-native "^4.0.0"
+    babel-register "^6.24.1"
+    babylon "^6.18.0"
+    chalk "^1.1.1"
+    concat-stream "^1.6.0"
+    connect "^3.6.5"
+    core-js "^2.2.2"
+    debug "^2.2.0"
+    denodeify "^1.2.1"
+    eventemitter3 "^3.0.0"
+    fbjs "^0.8.14"
+    fs-extra "^1.0.0"
+    graceful-fs "^4.1.3"
+    image-size "^0.6.0"
+    jest-docblock "22.1.0"
+    jest-haste-map "22.1.0"
+    jest-worker "22.1.0"
+    json-stable-stringify "^1.0.1"
+    json5 "^0.4.0"
+    left-pad "^1.1.3"
+    lodash.throttle "^4.1.1"
+    merge-stream "^1.0.1"
+    metro-core "0.24.7"
+    metro-source-map "0.24.7"
+    mime-types "2.1.11"
+    mkdirp "^0.5.1"
+    request "^2.79.0"
+    rimraf "^2.5.4"
+    serialize-error "^2.1.0"
+    source-map "^0.5.6"
+    temp "0.8.3"
+    throat "^4.1.0"
+    uglify-es "^3.1.9"
+    wordwrap "^1.0.0"
+    write-file-atomic "^1.2.0"
+    ws "^1.1.0"
+    xpipe "^1.0.5"
+    yargs "^9.0.0"
+
 micromatch@^2.1.5, micromatch@^2.3.11:
   version "2.3.11"
   resolved "https://registry.yarnpkg.com/micromatch/-/micromatch-2.3.11.tgz#86677c97d1720b363431d04d0d15293bd38c1565"
@@ -13830,17 +14260,46 @@ miller-rabin@^4.0.0:
   version "1.37.0"
   resolved "https://registry.yarnpkg.com/mime-db/-/mime-db-1.37.0.tgz#0b6a0ce6fdbe9576e25f1f2d2fde8830dc0ad0d8"
 
+"mime-db@>= 1.38.0 < 2", mime-db@~1.38.0:
+  version "1.38.0"
+  resolved "https://registry.yarnpkg.com/mime-db/-/mime-db-1.38.0.tgz#1a2aab16da9eb167b49c6e4df2d9c68d63d8e2ad"
+  integrity sha512-bqVioMFFzc2awcdJZIzR3HjZFX20QhilVS7hytkKrv7xFAn8bM1gzc/FOX2awLISvWe0PV8ptFKcon+wZ5qYkg==
+
+mime-db@~1.23.0:
+  version "1.23.0"
+  resolved "https://registry.yarnpkg.com/mime-db/-/mime-db-1.23.0.tgz#a31b4070adaea27d732ea333740a64d0ec9a6659"
+  integrity sha1-oxtAcK2uon1zLqMzdApk0OyaZlk=
+
+mime-types@2.1.11:
+  version "2.1.11"
+  resolved "https://registry.yarnpkg.com/mime-types/-/mime-types-2.1.11.tgz#c259c471bda808a85d6cd193b430a5fae4473b3c"
+  integrity sha1-wlnEcb2oCKhdbNGTtDCl+uRHOzw=
+  dependencies:
+    mime-db "~1.23.0"
+
 mime-types@^2.1.12, mime-types@^2.1.18, mime-types@^2.1.19, mime-types@~2.1.17, mime-types@~2.1.18, mime-types@~2.1.19:
   version "2.1.21"
   resolved "https://registry.yarnpkg.com/mime-types/-/mime-types-2.1.21.tgz#28995aa1ecb770742fe6ae7e58f9181c744b3f96"
   dependencies:
     mime-db "~1.37.0"
 
+mime-types@~2.1.6, mime-types@~2.1.9:
+  version "2.1.22"
+  resolved "https://registry.yarnpkg.com/mime-types/-/mime-types-2.1.22.tgz#fe6b355a190926ab7698c9a0556a11199b2199bd"
+  integrity sha512-aGl6TZGnhm/li6F7yx82bJiBZwgiEa4Hf6CNr8YO+r5UHr53tSTYZb102zyU50DOWWKeOv0uQLRL0/9EiKWCog==
+  dependencies:
+    mime-db "~1.38.0"
+
+mime@1.3.4:
+  version "1.3.4"
+  resolved "https://registry.yarnpkg.com/mime/-/mime-1.3.4.tgz#115f9e3b6b3daf2959983cb38f149a2d40eb5d53"
+  integrity sha1-EV+eO2s9rylZmDyzjxSaLUDrXVM=
+
 mime@1.4.1:
   version "1.4.1"
   resolved "https://registry.yarnpkg.com/mime/-/mime-1.4.1.tgz#121f9ebc49e3766f311a76e1fa1c8003c4b03aa6"
 
-mime@^1.2.11, mime@^1.4.1:
+mime@^1.2.11, mime@^1.3.4, mime@^1.4.1:
   version "1.6.0"
   resolved "https://registry.yarnpkg.com/mime/-/mime-1.6.0.tgz#32cd9e5c64553bd58d19a568af452acff04981b1"
 
@@ -14032,6 +14491,17 @@ morgan@^1.9.0:
     on-finished "~2.3.0"
     on-headers "~1.0.1"
 
+morgan@~1.6.1:
+  version "1.6.1"
+  resolved "https://registry.yarnpkg.com/morgan/-/morgan-1.6.1.tgz#5fd818398c6819cba28a7cd6664f292fe1c0bbf2"
+  integrity sha1-X9gYOYxoGcuiinzWZk8pL+HAu/I=
+  dependencies:
+    basic-auth "~1.0.3"
+    debug "~2.2.0"
+    depd "~1.0.1"
+    on-finished "~2.3.0"
+    on-headers "~1.0.0"
+
 mout@^1.0.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/mout/-/mout-1.1.0.tgz#0b29d41e6a80fa9e2d4a5be9d602e1d9d02177f6"
@@ -14047,6 +14517,16 @@ move-concurrently@^1.0.1:
     rimraf "^2.5.4"
     run-queue "^1.0.3"
 
+ms@0.7.1:
+  version "0.7.1"
+  resolved "https://registry.yarnpkg.com/ms/-/ms-0.7.1.tgz#9cd13c03adbff25b65effde7ce864ee952017098"
+  integrity sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg=
+
+ms@0.7.2:
+  version "0.7.2"
+  resolved "https://registry.yarnpkg.com/ms/-/ms-0.7.2.tgz#ae25cf2512b3885a1d95d7f037868d8431124765"
+  integrity sha1-riXPJRKziFodldfwN4aNhDESR2U=
+
 ms@2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/ms/-/ms-2.0.0.tgz#5608aeadfc00be6c2901df5f9861788de0d597c8"
@@ -14075,6 +14555,14 @@ multimatch@^2.1.0:
     arrify "^1.0.0"
     minimatch "^3.0.0"
 
+multiparty@3.3.2:
+  version "3.3.2"
+  resolved "https://registry.yarnpkg.com/multiparty/-/multiparty-3.3.2.tgz#35de6804dc19643e5249f3d3e3bdc6c8ce301d3f"
+  integrity sha1-Nd5oBNwZZD5SSfPT473GyM4wHT8=
+  dependencies:
+    readable-stream "~1.1.9"
+    stream-counter "~0.2.0"
+
 mustache@^3.0.0:
   version "3.0.1"
   resolved "https://registry.yarnpkg.com/mustache/-/mustache-3.0.1.tgz#873855f23aa8a95b150fb96d9836edbc5a1d248a"
@@ -14145,6 +14633,11 @@ needle@^2.2.1:
     iconv-lite "^0.4.4"
     sax "^1.2.4"
 
+negotiator@0.5.3:
+  version "0.5.3"
+  resolved "https://registry.yarnpkg.com/negotiator/-/negotiator-0.5.3.tgz#269d5c476810ec92edbe7b6c2f28316384f9a7e8"
+  integrity sha1-Jp1cR2gQ7JLtvntsLygxY4T5p+g=
+
 negotiator@0.6.1:
   version "0.6.1"
   resolved "https://registry.yarnpkg.com/negotiator/-/negotiator-0.6.1.tgz#2b327184e8992101177b28563fb5e7102acd0ca9"
@@ -14197,7 +14690,7 @@ node-fetch@2.1.2:
   version "2.1.2"
   resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-2.1.2.tgz#ab884e8e7e57e38a944753cec706f788d1768bb5"
 
-node-fetch@^1.0.1:
+node-fetch@^1.0.1, node-fetch@^1.3.3:
   version "1.7.3"
   resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-1.7.3.tgz#980f6f72d85211a5347c6b2bc18c5b84c3eb47ef"
   dependencies:
@@ -14290,6 +14783,17 @@ node-notifier@^5.0.1, node-notifier@^5.2.1:
     shellwords "^0.1.1"
     which "^1.3.0"
 
+node-notifier@^5.1.2:
+  version "5.4.0"
+  resolved "https://registry.yarnpkg.com/node-notifier/-/node-notifier-5.4.0.tgz#7b455fdce9f7de0c63538297354f3db468426e6a"
+  integrity sha512-SUDEb+o71XR5lXSTyivXd9J7fCloE3SyP4lSgt3lU2oSANiox+SxlNRGPjDKrwU1YN3ix2KN/VGGCg0t01rttQ==
+  dependencies:
+    growly "^1.3.0"
+    is-wsl "^1.1.0"
+    semver "^5.5.0"
+    shellwords "^0.1.1"
+    which "^1.3.0"
+
 node-pre-gyp@^0.10.0:
   version "0.10.3"
   resolved "https://registry.yarnpkg.com/node-pre-gyp/-/node-pre-gyp-0.10.3.tgz#3070040716afdc778747b61b6887bf78880b80fc"
@@ -14482,6 +14986,15 @@ npm-which@^3.0.1:
     gauge "~2.7.3"
     set-blocking "~2.0.0"
 
+npmlog@^2.0.4:
+  version "2.0.4"
+  resolved "https://registry.yarnpkg.com/npmlog/-/npmlog-2.0.4.tgz#98b52530f2514ca90d09ec5b22c8846722375692"
+  integrity sha1-mLUlMPJRTKkNCexbIsiEZyI3VpI=
+  dependencies:
+    ansi "~0.3.1"
+    are-we-there-yet "~1.1.2"
+    gauge "~1.2.5"
+
 nth-check@^1.0.2, nth-check@~1.0.1:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/nth-check/-/nth-check-1.0.2.tgz#b2bd295c37e3dd58a3bf0700376663ba4d9cf05c"
@@ -14627,6 +15140,11 @@ on-finished@~2.3.0:
   dependencies:
     ee-first "1.1.1"
 
+on-headers@~1.0.0:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/on-headers/-/on-headers-1.0.2.tgz#772b0ae6aaa525c399e489adfad90c403eb3c28f"
+  integrity sha512-pZAE+FJLoyITytdqK0U5s+FIpjN0JP3OzFi/u8Rx+EV5/W+JTWGXG8xFzevE7AjBfDqHv/8vL8qQsIhHnqRkrA==
+
 on-headers@~1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/on-headers/-/on-headers-1.0.1.tgz#928f5d0f470d49342651ea6794b0857c100693f7"
@@ -14667,6 +15185,13 @@ opn@5.4.0, opn@^5.1.0, opn@^5.3.0, opn@^5.4.0:
   dependencies:
     is-wsl "^1.1.0"
 
+opn@^3.0.2:
+  version "3.0.3"
+  resolved "https://registry.yarnpkg.com/opn/-/opn-3.0.3.tgz#b6d99e7399f78d65c3baaffef1fb288e9b85243a"
+  integrity sha1-ttmec5n3jWXDuq/+8fsojpuFJDo=
+  dependencies:
+    object-assign "^4.0.1"
+
 optimist@0.6.x, optimist@^0.6.1, optimist@~0.6.0:
   version "0.6.1"
   resolved "https://registry.yarnpkg.com/optimist/-/optimist-0.6.1.tgz#da3ea74686fa21a19a111c326e90eb15a0196686"
@@ -14692,6 +15217,11 @@ optionator@^0.8.1, optionator@^0.8.2:
     type-check "~0.3.2"
     wordwrap "~1.0.0"
 
+options@>=0.0.5:
+  version "0.0.6"
+  resolved "https://registry.yarnpkg.com/options/-/options-0.0.6.tgz#ec22d312806bb53e731773e7cdaefcf1c643128f"
+  integrity sha1-7CLTEoBrtT5zF3Pnza788cZDEo8=
+
 ora@^2.0.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/ora/-/ora-2.1.0.tgz#6caf2830eb924941861ec53a173799e008b51e5b"
@@ -14739,6 +15269,14 @@ os-locale@^3.0.0:
     lcid "^2.0.0"
     mem "^4.0.0"
 
+os-name@^2.0.1:
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/os-name/-/os-name-2.0.1.tgz#b9a386361c17ae3a21736ef0599405c9a8c5dc5e"
+  integrity sha1-uaOGNhwXrjohc27wWZQFyajF3F4=
+  dependencies:
+    macos-release "^1.0.0"
+    win-release "^1.0.0"
+
 os-name@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/os-name/-/os-name-3.0.0.tgz#e1434dbfddb8e74b44c98b56797d951b7648a5d9"
@@ -15001,6 +15539,11 @@ parse-ms@^1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/parse-ms/-/parse-ms-1.0.1.tgz#56346d4749d78f23430ca0c713850aef91aa361d"
 
+parse-node-version@^1.0.0:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/parse-node-version/-/parse-node-version-1.0.1.tgz#e2b5dbede00e7fa9bc363607f53327e8b073189b"
+  integrity sha512-3YHlOa/JgH6Mnpr05jP9eDG254US9ek25LyIxZlDItp2iJtwyaXQb57lBYLdT3MowkUFYEV2XXNAYIPlESvJlA==
+
 parse-passwd@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/parse-passwd/-/parse-passwd-1.0.0.tgz#6d5b934a456993b23d37f40a382d6f1666a8e5c6"
@@ -15041,7 +15584,7 @@ parseuri@0.0.5:
   dependencies:
     better-assert "~1.0.0"
 
-parseurl@~1.3.2:
+parseurl@~1.3.0, parseurl@~1.3.1, parseurl@~1.3.2:
   version "1.3.2"
   resolved "https://registry.yarnpkg.com/parseurl/-/parseurl-1.3.2.tgz#fc289d4ed8993119460c156253262cdc8de65bf3"
 
@@ -15149,6 +15692,11 @@ paths.macro@^2.0.2:
     find-root "^1.1.0"
     upath "^1.0.2"
 
+pause@0.1.0:
+  version "0.1.0"
+  resolved "https://registry.yarnpkg.com/pause/-/pause-0.1.0.tgz#ebc8a4a8619ff0b8a81ac1513c3434ff469fdb74"
+  integrity sha1-68ikqGGf8LioGsFRPDQ0/0af23Q=
+
 pbkdf2@^3.0.3:
   version "3.0.17"
   resolved "https://registry.yarnpkg.com/pbkdf2/-/pbkdf2-3.0.17.tgz#976c206530617b14ebb32114239f7b09336e93a6"
@@ -15159,6 +15707,11 @@ pbkdf2@^3.0.3:
     safe-buffer "^5.0.1"
     sha.js "^2.4.8"
 
+pegjs@^0.10.0:
+  version "0.10.0"
+  resolved "https://registry.yarnpkg.com/pegjs/-/pegjs-0.10.0.tgz#cf8bafae6eddff4b5a7efb185269eaaf4610ddbd"
+  integrity sha1-z4uvrm7d/0tafvsYUmnqr0YQ3b0=
+
 pend@~1.2.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/pend/-/pend-1.2.0.tgz#7a57eb550a6783f9115331fcf4663d5c8e007a50"
@@ -15231,6 +15784,36 @@ please-upgrade-node@^3.0.2, please-upgrade-node@^3.1.1:
   dependencies:
     semver-compare "^1.0.0"
 
+plist@2.0.1:
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/plist/-/plist-2.0.1.tgz#0a32ca9481b1c364e92e18dc55c876de9d01da8b"
+  integrity sha1-CjLKlIGxw2TpLhjcVch23p0B2os=
+  dependencies:
+    base64-js "1.1.2"
+    xmlbuilder "8.2.2"
+    xmldom "0.1.x"
+
+plist@^1.2.0:
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/plist/-/plist-1.2.0.tgz#084b5093ddc92506e259f874b8d9b1afb8c79593"
+  integrity sha1-CEtQk93JJQbiWfh0uNmxr7jHlZM=
+  dependencies:
+    base64-js "0.0.8"
+    util-deprecate "1.0.2"
+    xmlbuilder "4.0.0"
+    xmldom "0.1.x"
+
+plugin-error@^0.1.2:
+  version "0.1.2"
+  resolved "https://registry.yarnpkg.com/plugin-error/-/plugin-error-0.1.2.tgz#3b9bb3335ccf00f425e07437e19276967da47ace"
+  integrity sha1-O5uzM1zPAPQl4HQ34ZJ2ln2kes4=
+  dependencies:
+    ansi-cyan "^0.1.1"
+    ansi-red "^0.1.1"
+    arr-diff "^1.0.1"
+    arr-union "^2.0.1"
+    extend-shallow "^1.1.2"
+
 plur@^3.0.0:
   version "3.0.1"
   resolved "https://registry.yarnpkg.com/plur/-/plur-3.0.1.tgz#268652d605f816699b42b86248de73c9acd06a7c"
@@ -15955,6 +16538,11 @@ pretty-format@^24.0.0:
     ansi-regex "^4.0.0"
     ansi-styles "^3.2.0"
 
+pretty-format@^4.2.1:
+  version "4.3.1"
+  resolved "https://registry.yarnpkg.com/pretty-format/-/pretty-format-4.3.1.tgz#530be5c42b3c05b36414a7a2a4337aa80acd0e8d"
+  integrity sha1-UwvlxCs8BbNkFKeipDN6qArNDo0=
+
 pretty-hrtime@^1.0.3:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/pretty-hrtime/-/pretty-hrtime-1.0.3.tgz#b7e3ea42435a4c9b2759d99e0f201eb195802ee1"
@@ -16199,6 +16787,11 @@ q@^1.0.1, q@^1.1.2, q@^1.4.1, q@^1.5.1:
   version "1.5.1"
   resolved "https://registry.yarnpkg.com/q/-/q-1.5.1.tgz#7e32f75b41381291d04611f1bf14109ac00651d7"
 
+qs@4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/qs/-/qs-4.0.0.tgz#c31d9b74ec27df75e543a86c78728ed8d4623607"
+  integrity sha1-wx2bdOwn33XlQ6hseHKO2NRiNgc=
+
 qs@6.5.2, qs@~6.5.2:
   version "6.5.2"
   resolved "https://registry.yarnpkg.com/qs/-/qs-6.5.2.tgz#cb3ae806e8740444584ef154ce8ee98d403f3e36"
@@ -16262,6 +16855,11 @@ randexp@0.4.6:
     discontinuous-range "1.0.0"
     ret "~0.1.10"
 
+random-bytes@~1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/random-bytes/-/random-bytes-1.0.0.tgz#4f68a1dc0ae58bd3fb95848c30324db75d64360b"
+  integrity sha1-T2ih3Arli9P7lYSMMDJNt11kNgs=
+
 randomatic@^3.0.0:
   version "3.1.1"
   resolved "https://registry.yarnpkg.com/randomatic/-/randomatic-3.1.1.tgz#b776efc59375984e36c537b2f51a1f0aff0da1ed"
@@ -16287,6 +16885,11 @@ range-parser@^1.0.3, range-parser@~1.2.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/range-parser/-/range-parser-1.2.0.tgz#f49be6b487894ddc40dcc94a322f611092e00d5e"
 
+range-parser@~1.0.3:
+  version "1.0.3"
+  resolved "https://registry.yarnpkg.com/range-parser/-/range-parser-1.0.3.tgz#6872823535c692e2c2a0103826afd82c2e0ff175"
+  integrity sha1-aHKCNTXGkuLCoBA4Jq/YLC4P8XU=
+
 raptor-args@^1:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/raptor-args/-/raptor-args-1.0.3.tgz#e096ce5c0f9de5e0848617a78bfface94c54dc86"
@@ -16394,6 +16997,15 @@ raw-body@~1.1.0:
     bytes "1"
     string_decoder "0.10"
 
+raw-body@~2.1.2:
+  version "2.1.7"
+  resolved "https://registry.yarnpkg.com/raw-body/-/raw-body-2.1.7.tgz#adfeace2e4fb3098058014d08c072dcc59758774"
+  integrity sha1-rf6s4uT7MJgFgBTQjActzFl1h3Q=
+  dependencies:
+    bytes "2.4.0"
+    iconv-lite "0.4.13"
+    unpipe "1.0.0"
+
 raw-loader@0.5.1:
   version "0.5.1"
   resolved "https://registry.yarnpkg.com/raw-loader/-/raw-loader-0.5.1.tgz#0c3d0beaed8a01c966d9787bf778281252a979aa"
@@ -16439,6 +17051,11 @@ react-clientside-effect@^1.2.0:
     "@babel/runtime" "^7.0.0"
     shallowequal "^1.1.0"
 
+react-clone-referenced-element@^1.0.1:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/react-clone-referenced-element/-/react-clone-referenced-element-1.1.0.tgz#9cdda7f2aeb54fea791f3ab8c6ab96c7a77d0158"
+  integrity sha512-FKOsfKbBkPxYE8576EM6uAfHC4rnMpLyH6/TJUL4WcHUEB3EUn8AxPjnnV/IiwSSzsClvHYK+sDELKN/EJ0WYg==
+
 react-color@^2.17.0:
   version "2.17.0"
   resolved "https://registry.yarnpkg.com/react-color/-/react-color-2.17.0.tgz#e14b8a11f4e89163f65a34c8b43faf93f7f02aaa"
@@ -16450,6 +17067,11 @@ react-color@^2.17.0:
     reactcss "^1.2.0"
     tinycolor2 "^1.4.1"
 
+react-deep-force-update@^1.0.0:
+  version "1.1.2"
+  resolved "https://registry.yarnpkg.com/react-deep-force-update/-/react-deep-force-update-1.1.2.tgz#3d2ae45c2c9040cbb1772be52f8ea1ade6ca2ee1"
+  integrity sha512-WUSQJ4P/wWcusaH+zZmbECOk7H5N2pOIl0vzheeornkIMhu+qrNdGFm0bDZLCb0hSF0jf/kH1SgkNGfBdTc4wA==
+
 react-dev-utils@^7.0.0, react-dev-utils@^7.0.1:
   version "7.0.1"
   resolved "https://registry.yarnpkg.com/react-dev-utils/-/react-dev-utils-7.0.1.tgz#c53e759a22668ee2c0d146c24ce4bdec2b41e3c8"
@@ -16479,6 +17101,14 @@ react-dev-utils@^7.0.0, react-dev-utils@^7.0.1:
     strip-ansi "4.0.0"
     text-table "0.2.0"
 
+react-devtools-core@3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/react-devtools-core/-/react-devtools-core-3.0.0.tgz#f683e19f0311108f97dbb5b29d948323a1bf7c03"
+  integrity sha512-24oLTwNqZJceQXfAfKRp3PwCyg2agXAQhgGwe/x6V6CvjLmnMmba4/ut9S8JTIJq7pS9fpPaRDGo5u3923RLFA==
+  dependencies:
+    shell-quote "^1.6.1"
+    ws "^2.0.3"
+
 react-docgen-typescript-loader@^3.0.1:
   version "3.0.1"
   resolved "https://registry.yarnpkg.com/react-docgen-typescript-loader/-/react-docgen-typescript-loader-3.0.1.tgz#889aa472450c8db82ea0355656a307806ec74e77"
@@ -16593,10 +17223,123 @@ react-modal@^3.8.1:
     react-lifecycles-compat "^3.0.0"
     warning "^3.0.0"
 
+react-native-animatable@^1.2.4:
+  version "1.3.1"
+  resolved "https://registry.yarnpkg.com/react-native-animatable/-/react-native-animatable-1.3.1.tgz#f004a7e9de6838d0fbf210d642593cff7affd9ef"
+  integrity sha512-NoE6OAgCrhggWBRV6rBJup5vLAGoTjx168Tku1RZmjUGIdYRAyGesP/MoqvxiNJjhTAgwYx2LT63VTT1xO8g4Q==
+  dependencies:
+    prop-types "^15.5.10"
+
+react-native-color-picker@^0.4.0:
+  version "0.4.0"
+  resolved "https://registry.yarnpkg.com/react-native-color-picker/-/react-native-color-picker-0.4.0.tgz#801a413a20b833ea8aa9b10418c3761dd4d88fb6"
+  integrity sha1-gBpBOiC4M+qKqbEEGMN2HdTYj7Y=
+  dependencies:
+    prop-types "^15.5.10"
+    tinycolor2 "^1.4.1"
+
+react-native-modal-datetime-picker@^5.1.0:
+  version "5.1.0"
+  resolved "https://registry.yarnpkg.com/react-native-modal-datetime-picker/-/react-native-modal-datetime-picker-5.1.0.tgz#6e183531170881c2ff5b0742d132060f828e2b77"
+  integrity sha512-r1ODJ0ZXrGwFF2FWB0VlERqvwyalo9zxioLhVSwoBrkT8pSAj6QW5b3EaefjN6xbp4o6k5Lni/qOR4Pjke3jiQ==
+  dependencies:
+    prop-types "^15.6.1"
+    react-native-modal "^5.4.0"
+
+react-native-modal-selector@^0.0.29:
+  version "0.0.29"
+  resolved "https://registry.yarnpkg.com/react-native-modal-selector/-/react-native-modal-selector-0.0.29.tgz#e33326a9191ce6a6ed07c222366eb13ba5e03e21"
+  integrity sha512-wgsgMEPtZrSFt2VfYErDPw6K6m7QI/QVix/9zO6bn3+1rmEhjfDS/0ju1V0zqiMXR8LdxiRxqrFlzW7db+2Kig==
+  dependencies:
+    prop-types "^15.5.10"
+
+react-native-modal@^5.4.0:
+  version "5.4.0"
+  resolved "https://registry.yarnpkg.com/react-native-modal/-/react-native-modal-5.4.0.tgz#95f70b5d68e08824951cd11038b9db2d6fdb9962"
+  integrity sha512-Bvq4FQPMAFijqjqNX6TxLgKOwdbruM6GvFwF9rb+mowbaFZVoYbHTKLaAbdPlrblgaZKWyOuuxBUoDx41+Xktg==
+  dependencies:
+    prop-types "^15.6.1"
+    react-native-animatable "^1.2.4"
+
+react-native-simple-markdown@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/react-native-simple-markdown/-/react-native-simple-markdown-1.1.0.tgz#4d462f8ced26393c5230467420c61a50cc6a8095"
+  integrity sha1-TUYvjO0mOTxSMEZ0IMYaUMxqgJU=
+  dependencies:
+    lodash "^4.15.0"
+    simple-markdown "git://github.com/CharlesMangwa/simple-markdown.git"
+
 react-native-swipe-gestures@^1.0.2:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/react-native-swipe-gestures/-/react-native-swipe-gestures-1.0.3.tgz#4160f8d459627323f3a3d2770af4bcd82fd054f5"
 
+react-native-switch@^1.5.0:
+  version "1.5.0"
+  resolved "https://registry.yarnpkg.com/react-native-switch/-/react-native-switch-1.5.0.tgz#a5c8e72f87def649d1c9de027c5ae27e2037ea40"
+  integrity sha1-pcjnL4fe9knRyd4CfFrifiA36kA=
+  dependencies:
+    prop-types "^15.6.0"
+
+react-native@^0.52.2:
+  version "0.52.3"
+  resolved "https://registry.yarnpkg.com/react-native/-/react-native-0.52.3.tgz#e11698e19bbc8f98135f82d40ac82ccb046641fd"
+  integrity sha512-0GFnmxtkUk0KRkB61JTBv5pkj1JsnKxa0jH8vtM0wa+WSKHLuRCDmEERtk09KOMgJ+esKZO+ZO30nhHup+ZPYg==
+  dependencies:
+    absolute-path "^0.0.0"
+    art "^0.10.0"
+    babel-core "^6.24.1"
+    babel-plugin-syntax-trailing-function-commas "^6.20.0"
+    babel-plugin-transform-async-to-generator "6.16.0"
+    babel-plugin-transform-class-properties "^6.18.0"
+    babel-plugin-transform-exponentiation-operator "^6.5.0"
+    babel-plugin-transform-flow-strip-types "^6.21.0"
+    babel-plugin-transform-object-rest-spread "^6.20.2"
+    babel-register "^6.24.1"
+    babel-runtime "^6.23.0"
+    base64-js "^1.1.2"
+    chalk "^1.1.1"
+    commander "^2.9.0"
+    connect "^2.8.3"
+    create-react-class "^15.5.2"
+    debug "^2.2.0"
+    denodeify "^1.2.1"
+    envinfo "^3.0.0"
+    event-target-shim "^1.0.5"
+    fbjs "^0.8.14"
+    fbjs-scripts "^0.8.1"
+    fs-extra "^1.0.0"
+    glob "^7.1.1"
+    graceful-fs "^4.1.3"
+    inquirer "^3.0.6"
+    lodash "^4.16.6"
+    metro "^0.24.1"
+    metro-core "^0.24.1"
+    mime "^1.3.4"
+    minimist "^1.2.0"
+    mkdirp "^0.5.1"
+    node-fetch "^1.3.3"
+    node-notifier "^5.1.2"
+    npmlog "^2.0.4"
+    opn "^3.0.2"
+    optimist "^0.6.1"
+    plist "^1.2.0"
+    pretty-format "^4.2.1"
+    promise "^7.1.1"
+    prop-types "^15.5.8"
+    react-clone-referenced-element "^1.0.1"
+    react-devtools-core "3.0.0"
+    react-timer-mixin "^0.13.2"
+    regenerator-runtime "^0.11.0"
+    rimraf "^2.5.4"
+    semver "^5.0.3"
+    shell-quote "1.6.1"
+    stacktrace-parser "^0.1.3"
+    whatwg-fetch "^1.0.0"
+    ws "^1.1.0"
+    xcode "^0.9.1"
+    xmldoc "^0.4.0"
+    yargs "^9.0.0"
+
 react-popper-tooltip@^2.8.0:
   version "2.8.0"
   resolved "https://registry.yarnpkg.com/react-popper-tooltip/-/react-popper-tooltip-2.8.0.tgz#777e710e4696bd1b8e1a1ef24a6e3375e0206609"
@@ -16615,6 +17358,14 @@ react-popper@^1.3.2:
     typed-styles "^0.0.7"
     warning "^4.0.2"
 
+react-proxy@^1.1.7:
+  version "1.1.8"
+  resolved "https://registry.yarnpkg.com/react-proxy/-/react-proxy-1.1.8.tgz#9dbfd9d927528c3aa9f444e4558c37830ab8c26a"
+  integrity sha1-nb/Z2SdSjDqp9ETkVYw3gwq4wmo=
+  dependencies:
+    lodash "^4.6.1"
+    react-deep-force-update "^1.0.0"
+
 react-resize-detector@^3.2.1:
   version "3.4.0"
   resolved "https://registry.yarnpkg.com/react-resize-detector/-/react-resize-detector-3.4.0.tgz#2ccd399958a0efe9b7c52c5db5a13d87e47cd585"
@@ -16731,6 +17482,19 @@ react-textarea-autosize@^7.0.4:
     "@babel/runtime" "^7.1.2"
     prop-types "^15.6.0"
 
+react-timer-mixin@^0.13.2:
+  version "0.13.4"
+  resolved "https://registry.yarnpkg.com/react-timer-mixin/-/react-timer-mixin-0.13.4.tgz#75a00c3c94c13abe29b43d63b4c65a88fc8264d3"
+  integrity sha512-4+ow23tp/Tv7hBM5Az5/Be/eKKF7DIvJ09voz5LyHGQaqqz9WV8YMs31eFvcYQs7d451LSg7kDJV70XYN/Ug/Q==
+
+react-transform-hmr@^1.0.4:
+  version "1.0.4"
+  resolved "https://registry.yarnpkg.com/react-transform-hmr/-/react-transform-hmr-1.0.4.tgz#e1a40bd0aaefc72e8dfd7a7cda09af85066397bb"
+  integrity sha1-4aQL0Krvxy6N/Xp82gmvhQZjl7s=
+  dependencies:
+    global "^4.3.0"
+    react-proxy "^1.1.7"
+
 react-transition-group@^2.2.1:
   version "2.5.3"
   resolved "https://registry.yarnpkg.com/react-transition-group/-/react-transition-group-2.5.3.tgz#26de363cab19e5c88ae5dbae105c706cf953bb92"
@@ -16893,6 +17657,16 @@ readable-stream@^3.0.6:
     string_decoder "^1.1.1"
     util-deprecate "^1.0.1"
 
+readable-stream@~1.1.8, readable-stream@~1.1.9:
+  version "1.1.14"
+  resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-1.1.14.tgz#7cf4c54ef648e3813084c636dd2079e166c081d9"
+  integrity sha1-fPTFTvZI44EwhMY23SB54WbAgdk=
+  dependencies:
+    core-util-is "~1.0.0"
+    inherits "~2.0.1"
+    isarray "0.0.1"
+    string_decoder "~0.10.x"
+
 readable-stream@~2.0.6:
   version "2.0.6"
   resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-2.0.6.tgz#8f90341e68a53ccc928788dacfcd11b36eb9b78e"
@@ -17442,7 +18216,7 @@ request-promise-native@^1.0.5:
     stealthy-require "^1.1.0"
     tough-cookie ">=2.3.3"
 
-"request@>=2.76.0 <3.0.0", request@^2.83.0, request@^2.87.0, request@^2.88.0:
+"request@>=2.76.0 <3.0.0", request@^2.79.0, request@^2.83.0, request@^2.87.0, request@^2.88.0:
   version "2.88.0"
   resolved "https://registry.yarnpkg.com/request/-/request-2.88.0.tgz#9c2fca4f7d35b592efe57c7f0a55e81052124fef"
   dependencies:
@@ -17568,6 +18342,14 @@ resolve@1.x, resolve@^1.1.4, resolve@^1.1.6, resolve@^1.1.7, resolve@^1.10.0, re
   dependencies:
     path-parse "^1.0.6"
 
+response-time@~2.3.1:
+  version "2.3.2"
+  resolved "https://registry.yarnpkg.com/response-time/-/response-time-2.3.2.tgz#ffa71bab952d62f7c1d49b7434355fbc68dffc5a"
+  integrity sha1-/6cbq5UtYvfB1Jt0NDVfvGjf/Fo=
+  dependencies:
+    depd "~1.1.0"
+    on-headers "~1.0.1"
+
 rest-handler@^1.2.16:
   version "1.2.17"
   resolved "https://registry.yarnpkg.com/rest-handler/-/rest-handler-1.2.17.tgz#2369830a5a2b6f5d5635dfd30cb963c43141b1c7"
@@ -17688,6 +18470,11 @@ ripemd160@^2.0.0, ripemd160@^2.0.1:
     hash-base "^3.0.0"
     inherits "^2.0.1"
 
+rndm@1.2.0:
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/rndm/-/rndm-1.2.0.tgz#f33fe9cfb52bbfd520aa18323bc65db110a1b76c"
+  integrity sha1-8z/pz7Urv9UgqhgyO8ZdsRCht2w=
+
 rollup-pluginutils@^2.0.1:
   version "2.3.3"
   resolved "https://registry.yarnpkg.com/rollup-pluginutils/-/rollup-pluginutils-2.3.3.tgz#3aad9b1eb3e7fe8262820818840bf091e5ae6794"
@@ -17763,6 +18550,18 @@ rusha@^0.8.1:
   version "0.8.13"
   resolved "https://registry.yarnpkg.com/rusha/-/rusha-0.8.13.tgz#9a084e7b860b17bff3015b92c67a6a336191513a"
 
+rx-lite-aggregates@^4.0.8:
+  version "4.0.8"
+  resolved "https://registry.yarnpkg.com/rx-lite-aggregates/-/rx-lite-aggregates-4.0.8.tgz#753b87a89a11c95467c4ac1626c4efc4e05c67be"
+  integrity sha1-dTuHqJoRyVRnxKwWJsTvxOBcZ74=
+  dependencies:
+    rx-lite "*"
+
+rx-lite@*, rx-lite@^4.0.8:
+  version "4.0.8"
+  resolved "https://registry.yarnpkg.com/rx-lite/-/rx-lite-4.0.8.tgz#0b1e11af8bc44836f04a6407e92da42467b79444"
+  integrity sha1-Cx4Rr4vESDbwSmQH6S2kJGe3lEQ=
+
 rx-lite@^3.1.2:
   version "3.1.2"
   resolved "https://registry.yarnpkg.com/rx-lite/-/rx-lite-3.1.2.tgz#19ce502ca572665f3b647b10939f97fd1615f102"
@@ -17789,6 +18588,11 @@ safe-buffer@5.1.2, safe-buffer@^5.0.1, safe-buffer@^5.1.0, safe-buffer@^5.1.1, s
   version "5.1.2"
   resolved "https://registry.yarnpkg.com/safe-buffer/-/safe-buffer-5.1.2.tgz#991ec69d296e0313747d59bdfd2b745c35f8828d"
 
+safe-buffer@~5.0.1:
+  version "5.0.1"
+  resolved "https://registry.yarnpkg.com/safe-buffer/-/safe-buffer-5.0.1.tgz#d263ca54696cd8a306b5ca6551e92de57918fbe7"
+  integrity sha1-0mPKVGls2KMGtcplUekt5XkY++c=
+
 safe-eval@^0.4.1:
   version "0.4.1"
   resolved "https://registry.yarnpkg.com/safe-eval/-/safe-eval-0.4.1.tgz#e54ba5a1bbdec795d488f6c8765e0c2a78b4cdc0"
@@ -17870,6 +18674,11 @@ sax@>=0.6.0, sax@^1.2.4, sax@~1.2.4:
   version "1.2.4"
   resolved "https://registry.yarnpkg.com/sax/-/sax-1.2.4.tgz#2816234e2378bddc4e5354fab5caa895df7100d9"
 
+sax@~1.1.1:
+  version "1.1.6"
+  resolved "https://registry.yarnpkg.com/sax/-/sax-1.1.6.tgz#5d616be8a5e607d54e114afae55b7eaf2fcc3240"
+  integrity sha1-XWFr6KXmB9VOEUr65Vt+ry/MMkA=
+
 saxes@^3.1.4:
   version "3.1.6"
   resolved "https://registry.yarnpkg.com/saxes/-/saxes-3.1.6.tgz#2d948a47b54918516c5a64096f08865deb5bd8cd"
@@ -17963,7 +18772,7 @@ semver-intersect@1.4.0:
   dependencies:
     semver "^5.0.0"
 
-"semver@2 || 3 || 4 || 5", "semver@2.x || 3.x || 4 || 5", semver@5.6.0, semver@^5.0.0, semver@^5.0.1, semver@^5.0.3, semver@^5.1.0, semver@^5.3.0, semver@^5.4.1, semver@^5.5, semver@^5.5.0, semver@^5.5.1, semver@^5.6.0:
+"semver@2 || 3 || 4 || 5", "semver@2.x || 3.x || 4 || 5", semver@5.6.0, semver@5.x, semver@^5.0.0, semver@^5.0.1, semver@^5.0.3, semver@^5.1.0, semver@^5.3.0, semver@^5.4.1, semver@^5.5, semver@^5.5.0, semver@^5.5.1, semver@^5.6.0:
   version "5.6.0"
   resolved "https://registry.yarnpkg.com/semver/-/semver-5.6.0.tgz#7e74256fbaa49c75aa7c7a205cc22799cac80004"
 
@@ -17975,6 +18784,24 @@ semver@~5.3.0:
   version "5.3.0"
   resolved "https://registry.yarnpkg.com/semver/-/semver-5.3.0.tgz#9b2ce5d3de02d17c6012ad326aa6b4d0cf54f94f"
 
+send@0.13.2:
+  version "0.13.2"
+  resolved "https://registry.yarnpkg.com/send/-/send-0.13.2.tgz#765e7607c8055452bba6f0b052595350986036de"
+  integrity sha1-dl52B8gFVFK7pvCwUllTUJhgNt4=
+  dependencies:
+    debug "~2.2.0"
+    depd "~1.1.0"
+    destroy "~1.0.4"
+    escape-html "~1.0.3"
+    etag "~1.7.0"
+    fresh "0.3.0"
+    http-errors "~1.3.1"
+    mime "1.3.4"
+    ms "0.7.1"
+    on-finished "~2.3.0"
+    range-parser "~1.0.3"
+    statuses "~1.2.1"
+
 send@0.16.2, send@^0.16.2:
   version "0.16.2"
   resolved "https://registry.yarnpkg.com/send/-/send-0.16.2.tgz#6ecca1e0f8c156d141597559848df64730a6bbc1"
@@ -17993,6 +18820,11 @@ send@0.16.2, send@^0.16.2:
     range-parser "~1.2.0"
     statuses "~1.4.0"
 
+serialize-error@^2.1.0:
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/serialize-error/-/serialize-error-2.1.0.tgz#50b679d5635cdf84667bdc8e59af4e5b81d5f60a"
+  integrity sha1-ULZ51WNc34Rme9yOWa9OW4HV9go=
+
 serialize-javascript@^1.4.0:
   version "1.6.1"
   resolved "https://registry.yarnpkg.com/serialize-javascript/-/serialize-javascript-1.6.1.tgz#4d1f697ec49429a847ca6f442a2a755126c4d879"
@@ -18007,6 +18839,16 @@ serve-favicon@^2.5.0:
     parseurl "~1.3.2"
     safe-buffer "5.1.1"
 
+serve-favicon@~2.3.0:
+  version "2.3.2"
+  resolved "https://registry.yarnpkg.com/serve-favicon/-/serve-favicon-2.3.2.tgz#dd419e268de012ab72b319d337f2105013f9381f"
+  integrity sha1-3UGeJo3gEqtysxnTN/IQUBP5OB8=
+  dependencies:
+    etag "~1.7.0"
+    fresh "0.3.0"
+    ms "0.7.2"
+    parseurl "~1.3.1"
+
 serve-index@^1.7.2:
   version "1.9.1"
   resolved "https://registry.yarnpkg.com/serve-index/-/serve-index-1.9.1.tgz#d3768d69b1e7d82e5ce050fff5b453bea12a9239"
@@ -18019,6 +18861,19 @@ serve-index@^1.7.2:
     mime-types "~2.1.17"
     parseurl "~1.3.2"
 
+serve-index@~1.7.2:
+  version "1.7.3"
+  resolved "https://registry.yarnpkg.com/serve-index/-/serve-index-1.7.3.tgz#7a057fc6ee28dc63f64566e5fa57b111a86aecd2"
+  integrity sha1-egV/xu4o3GP2RWbl+lexEahq7NI=
+  dependencies:
+    accepts "~1.2.13"
+    batch "0.5.3"
+    debug "~2.2.0"
+    escape-html "~1.0.3"
+    http-errors "~1.3.1"
+    mime-types "~2.1.9"
+    parseurl "~1.3.1"
+
 serve-static@1.13.2:
   version "1.13.2"
   resolved "https://registry.yarnpkg.com/serve-static/-/serve-static-1.13.2.tgz#095e8472fd5b46237db50ce486a43f4b86c6cec1"
@@ -18028,6 +18883,15 @@ serve-static@1.13.2:
     parseurl "~1.3.2"
     send "0.16.2"
 
+serve-static@~1.10.0:
+  version "1.10.3"
+  resolved "https://registry.yarnpkg.com/serve-static/-/serve-static-1.10.3.tgz#ce5a6ecd3101fed5ec09827dac22a9c29bfb0535"
+  integrity sha1-zlpuzTEB/tXsCYJ9rCKpwpv7BTU=
+  dependencies:
+    escape-html "~1.0.3"
+    parseurl "~1.3.1"
+    send "0.13.2"
+
 set-blocking@^2.0.0, set-blocking@~2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/set-blocking/-/set-blocking-2.0.0.tgz#045f9782d011ae9a6803ddd382b24392b3d890f7"
@@ -18164,6 +19028,19 @@ simple-html-tokenizer@^0.5.7:
   version "0.5.7"
   resolved "https://registry.yarnpkg.com/simple-html-tokenizer/-/simple-html-tokenizer-0.5.7.tgz#8eca336ecfbe2b3c6166cbb31b2682088de79f40"
 
+"simple-markdown@git://github.com/CharlesMangwa/simple-markdown.git":
+  version "0.1.1"
+  resolved "git://github.com/CharlesMangwa/simple-markdown.git#33d963c760b8196bee01b1a5ba9974bc7f669af1"
+
+simple-plist@^0.2.1:
+  version "0.2.1"
+  resolved "https://registry.yarnpkg.com/simple-plist/-/simple-plist-0.2.1.tgz#71766db352326928cf3a807242ba762322636723"
+  integrity sha1-cXZts1IyaSjPOoByQrp2IyJjZyM=
+  dependencies:
+    bplist-creator "0.0.7"
+    bplist-parser "0.1.1"
+    plist "2.0.1"
+
 simple-sha1@^2.1.0:
   version "2.1.1"
   resolved "https://registry.yarnpkg.com/simple-sha1/-/simple-sha1-2.1.1.tgz#93f3b7f2e8dfdc056c32793e5d47b58d311b140d"
@@ -18214,7 +19091,7 @@ sliced@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/sliced/-/sliced-1.0.1.tgz#0b3a662b5d04c3177b1926bea82b03f837a2ef41"
 
-slide@^1.1.6:
+slide@^1.1.5, slide@^1.1.6:
   version "1.1.6"
   resolved "https://registry.yarnpkg.com/slide/-/slide-1.1.6.tgz#56eb027d65b4d2dce6cb2e2d32c4d4afc9e1d707"
 
@@ -18625,6 +19502,11 @@ stackframe@^1.0.4:
   version "1.0.4"
   resolved "https://registry.yarnpkg.com/stackframe/-/stackframe-1.0.4.tgz#357b24a992f9427cba6b545d96a14ed2cbca187b"
 
+stacktrace-parser@^0.1.3:
+  version "0.1.4"
+  resolved "https://registry.yarnpkg.com/stacktrace-parser/-/stacktrace-parser-0.1.4.tgz#01397922e5f62ecf30845522c95c4fe1d25e7d4e"
+  integrity sha1-ATl5IuX2Ls8whFUiyVxP4dJefU4=
+
 staged-git-files@1.1.2:
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/staged-git-files/-/staged-git-files-1.1.2.tgz#4326d33886dc9ecfa29a6193bf511ba90a46454b"
@@ -18646,10 +19528,15 @@ stats-webpack-plugin@0.7.0:
   dependencies:
     lodash "^4.17.4"
 
-"statuses@>= 1.4.0 < 2", "statuses@>= 1.5.0 < 2":
+statuses@1, "statuses@>= 1.4.0 < 2", "statuses@>= 1.5.0 < 2":
   version "1.5.0"
   resolved "https://registry.yarnpkg.com/statuses/-/statuses-1.5.0.tgz#161c7dac177659fd9811f43771fa99381478628c"
 
+statuses@~1.2.1:
+  version "1.2.1"
+  resolved "https://registry.yarnpkg.com/statuses/-/statuses-1.2.1.tgz#dded45cc18256d51ed40aec142489d5c61026d28"
+  integrity sha1-3e1FzBglbVHtQK7BQkidXGECbSg=
+
 statuses@~1.3.1:
   version "1.3.1"
   resolved "https://registry.yarnpkg.com/statuses/-/statuses-1.3.1.tgz#faf51b9eb74aaef3b3acf4ad5f61abf24cb7b93e"
@@ -18696,6 +19583,11 @@ stream-browserify@^2.0.0, stream-browserify@^2.0.1:
     inherits "~2.0.1"
     readable-stream "^2.0.2"
 
+stream-buffers@~2.2.0:
+  version "2.2.0"
+  resolved "https://registry.yarnpkg.com/stream-buffers/-/stream-buffers-2.2.0.tgz#91d5f5130d1cef96dcfa7f726945188741d09ee4"
+  integrity sha1-kdX1Ew0c75bc+n9yaUUYh0HQnuQ=
+
 stream-combiner2@^1.1.1:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/stream-combiner2/-/stream-combiner2-1.1.1.tgz#fb4d8a1420ea362764e21ad4780397bebcb41cbe"
@@ -18703,6 +19595,13 @@ stream-combiner2@^1.1.1:
     duplexer2 "~0.1.0"
     readable-stream "^2.0.2"
 
+stream-counter@~0.2.0:
+  version "0.2.0"
+  resolved "https://registry.yarnpkg.com/stream-counter/-/stream-counter-0.2.0.tgz#ded266556319c8b0e222812b9cf3b26fa7d947de"
+  integrity sha1-3tJmVWMZyLDiIoErnPOyb6fZR94=
+  dependencies:
+    readable-stream "~1.1.8"
+
 stream-each@^1.1.0:
   version "1.2.3"
   resolved "https://registry.yarnpkg.com/stream-each/-/stream-each-1.2.3.tgz#ebe27a0c389b04fbcc233642952e10731afa9bae"
@@ -19304,7 +20203,7 @@ text-table@0.2.0, text-table@^0.2.0:
   version "2.4.0"
   resolved "https://registry.yarnpkg.com/textextensions/-/textextensions-2.4.0.tgz#6a143a985464384cc2cff11aea448cd5b018e72b"
 
-throat@^4.0.0:
+throat@^4.0.0, throat@^4.1.0:
   version "4.1.0"
   resolved "https://registry.yarnpkg.com/throat/-/throat-4.1.0.tgz#89037cbc92c56ab18926e6ba4cbb200e15672a6a"
 
@@ -19323,6 +20222,11 @@ thunky@^1.0.2:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/thunky/-/thunky-1.0.3.tgz#f5df732453407b09191dae73e2a8cc73f381a826"
 
+time-stamp@^1.0.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/time-stamp/-/time-stamp-1.1.0.tgz#764a5a11af50561921b133f3b44e618687e0f5c3"
+  integrity sha1-dkpaEa9QVhkhsTPztE5hhofg9cM=
+
 time-zone@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/time-zone/-/time-zone-1.0.0.tgz#99c5bf55958966af6d06d83bdf3800dc82faec5d"
@@ -19699,6 +20603,11 @@ tslint@^5.12.1, tslint@~5.12.1:
     tslib "^1.8.0"
     tsutils "^2.27.2"
 
+tsscmp@1.0.5:
+  version "1.0.5"
+  resolved "https://registry.yarnpkg.com/tsscmp/-/tsscmp-1.0.5.tgz#7dc4a33af71581ab4337da91d85ca5427ebd9a97"
+  integrity sha1-fcSjOvcVgatDN9qR2FylQn69mpc=
+
 tsutils@^2.27.2, tsutils@^2.29.0:
   version "2.29.0"
   resolved "https://registry.yarnpkg.com/tsutils/-/tsutils-2.29.0.tgz#32b488501467acbedd4b85498673a0812aca0b99"
@@ -19749,7 +20658,7 @@ type-detect@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/type-detect/-/type-detect-1.0.0.tgz#762217cc06db258ec48908a1298e8b95121e8ea2"
 
-type-is@~1.6.16:
+type-is@~1.6.16, type-is@~1.6.6:
   version "1.6.16"
   resolved "https://registry.yarnpkg.com/type-is/-/type-is-1.6.16.tgz#f89ce341541c672b25ee7ae3c73dee3b2be50194"
   dependencies:
@@ -19788,7 +20697,7 @@ uc.micro@^1.0.1, uc.micro@^1.0.5:
   version "1.0.5"
   resolved "https://registry.yarnpkg.com/uc.micro/-/uc.micro-1.0.5.tgz#0c65f15f815aa08b560a61ce8b4db7ffc3f45376"
 
-uglify-es@^3.3.4:
+uglify-es@^3.1.9, uglify-es@^3.3.4:
   version "3.3.9"
   resolved "https://registry.yarnpkg.com/uglify-es/-/uglify-es-3.3.9.tgz#0c1c4f0700bed8dbc124cdb304d2592ca203e677"
   dependencies:
@@ -19819,6 +20728,30 @@ uid-number@0.0.6:
   version "0.0.6"
   resolved "https://registry.yarnpkg.com/uid-number/-/uid-number-0.0.6.tgz#0ea10e8035e8eb5b8e4449f06da1c730663baa81"
 
+uid-safe@2.1.4:
+  version "2.1.4"
+  resolved "https://registry.yarnpkg.com/uid-safe/-/uid-safe-2.1.4.tgz#3ad6f38368c6d4c8c75ec17623fb79aa1d071d81"
+  integrity sha1-Otbzg2jG1MjHXsF2I/t5qh0HHYE=
+  dependencies:
+    random-bytes "~1.0.0"
+
+uid-safe@~2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/uid-safe/-/uid-safe-2.0.0.tgz#a7f3c6ca64a1f6a5d04ec0ef3e4c3d5367317137"
+  integrity sha1-p/PGymSh9qXQTsDvPkw9U2cxcTc=
+  dependencies:
+    base64-url "1.2.1"
+
+ultron@1.0.x:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/ultron/-/ultron-1.0.2.tgz#ace116ab557cd197386a4e88f4685378c8b2e4fa"
+  integrity sha1-rOEWq1V80Zc4ak6I9GhTeMiy5Po=
+
+ultron@~1.1.0:
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/ultron/-/ultron-1.1.1.tgz#9fe1536a10a664a65266a1e3ccf85fd36302bc9c"
+  integrity sha512-UIEXBNeYmKptWH6z8ZnqTeS8fV74zG0/eRU9VGkpzz+LIJNs8W/zM/L+7ctCkRrgbNnnR0xxw4bKOr0cW0N0Og==
+
 umask@^1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/umask/-/umask-1.1.0.tgz#f29cebf01df517912bb58ff9c4e50fde8e33320d"
@@ -20160,7 +21093,7 @@ username@^1.0.1:
   dependencies:
     meow "^3.4.0"
 
-util-deprecate@^1.0.1, util-deprecate@^1.0.2, util-deprecate@~1.0.1:
+util-deprecate@1.0.2, util-deprecate@^1.0.1, util-deprecate@^1.0.2, util-deprecate@~1.0.1:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/util-deprecate/-/util-deprecate-1.0.2.tgz#450d4dc9fa70de732762fbd2d4a28981419a0ccf"
 
@@ -20193,10 +21126,20 @@ utila@^0.4.0, utila@~0.4:
   version "0.4.0"
   resolved "https://registry.yarnpkg.com/utila/-/utila-0.4.0.tgz#8a16a05d445657a3aea5eecc5b12a4fa5379772c"
 
+utils-merge@1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/utils-merge/-/utils-merge-1.0.0.tgz#0294fb922bb9375153541c4f7096231f287c8af8"
+  integrity sha1-ApT7kiu5N1FTVBxPcJYjHyh8ivg=
+
 utils-merge@1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/utils-merge/-/utils-merge-1.0.1.tgz#9f95710f50a267947b2ccc124741c1028427e713"
 
+uuid@3.0.1:
+  version "3.0.1"
+  resolved "https://registry.yarnpkg.com/uuid/-/uuid-3.0.1.tgz#6544bba2dfda8c1cf17e629a3a305e2bb1fee6c1"
+  integrity sha1-ZUS7ot/ajBzxfmKaOjBeK7H+5sE=
+
 uuid@^3.0.1, uuid@^3.1.0, uuid@^3.2.1, uuid@^3.3.2:
   version "3.3.2"
   resolved "https://registry.yarnpkg.com/uuid/-/uuid-3.3.2.tgz#1b4af4955eb3077c501c23872fc6513811587131"
@@ -20226,6 +21169,11 @@ vary@^1, vary@~1.1.2:
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/vary/-/vary-1.1.2.tgz#2299f02c6ded30d4a5961b0b9f74524a18f634fc"
 
+vary@~1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/vary/-/vary-1.0.1.tgz#99e4981566a286118dfb2b817357df7993376d10"
+  integrity sha1-meSYFWaihhGN+yuBc1ffeZM3bRA=
+
 vendors@^1.0.0:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/vendors/-/vendors-1.0.2.tgz#7fcb5eef9f5623b156bcea89ec37d63676f21801"
@@ -20276,6 +21224,11 @@ vfile@^3.0.0, vfile@^3.0.1:
     unist-util-stringify-position "^1.0.0"
     vfile-message "^1.0.0"
 
+vhost@~3.0.1:
+  version "3.0.2"
+  resolved "https://registry.yarnpkg.com/vhost/-/vhost-3.0.2.tgz#2fb1decd4c466aa88b0f9341af33dc1aff2478d5"
+  integrity sha1-L7HezUxGaqiLD5NBrzPcGv8keNU=
+
 vm-browserify@0.0.4:
   version "0.0.4"
   resolved "https://registry.yarnpkg.com/vm-browserify/-/vm-browserify-0.0.4.tgz#5d7ea45bbef9e4a6ff65f95438e0a87c357d5a73"
@@ -20771,6 +21724,11 @@ whatwg-fetch@3.0.0, whatwg-fetch@>=0.10.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/whatwg-fetch/-/whatwg-fetch-3.0.0.tgz#fc804e458cc460009b1a2b966bc8817d2578aefb"
 
+whatwg-fetch@^1.0.0:
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/whatwg-fetch/-/whatwg-fetch-1.1.1.tgz#ac3c9d39f320c6dce5339969d054ef43dd333319"
+  integrity sha1-rDydOfMgxtzlM5lp0FTvQ90zMxk=
+
 whatwg-mimetype@^2.1.0, whatwg-mimetype@^2.2.0, whatwg-mimetype@^2.3.0:
   version "2.3.0"
   resolved "https://registry.yarnpkg.com/whatwg-mimetype/-/whatwg-mimetype-2.3.0.tgz#3d4b1e0312d2079879f826aff18dbeeca5960fbf"
@@ -20821,6 +21779,13 @@ widest-line@^2.0.0:
   dependencies:
     string-width "^2.1.1"
 
+win-release@^1.0.0:
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/win-release/-/win-release-1.1.1.tgz#5fa55e02be7ca934edfc12665632e849b72e5209"
+  integrity sha1-X6VeAr58qTTt/BJmVjLoSbcuUgk=
+  dependencies:
+    semver "^5.0.1"
+
 windows-release@^3.1.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/windows-release/-/windows-release-3.1.0.tgz#8d4a7e266cbf5a233f6c717dac19ce00af36e12e"
@@ -20984,6 +21949,15 @@ wrappy@1:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/wrappy/-/wrappy-1.0.2.tgz#b5243d8f3ec1aa35f1364605bc0d1036e30ab69f"
 
+write-file-atomic@^1.2.0:
+  version "1.3.4"
+  resolved "https://registry.yarnpkg.com/write-file-atomic/-/write-file-atomic-1.3.4.tgz#f807a4f0b1d9e913ae7a48112e6cc3af1991b45f"
+  integrity sha1-+Aek8LHZ6ROuekgRLmzDrxmRtF8=
+  dependencies:
+    graceful-fs "^4.1.11"
+    imurmurhash "^0.1.4"
+    slide "^1.1.5"
+
 write-file-atomic@^2.0.0, write-file-atomic@^2.1.0, write-file-atomic@^2.3.0:
   version "2.3.0"
   resolved "https://registry.yarnpkg.com/write-file-atomic/-/write-file-atomic-2.3.0.tgz#1ff61575c2e2a4e8e510d6fa4e243cce183999ab"
@@ -21016,6 +21990,22 @@ write@^0.2.1:
   dependencies:
     mkdirp "^0.5.1"
 
+ws@^1.1.0:
+  version "1.1.5"
+  resolved "https://registry.yarnpkg.com/ws/-/ws-1.1.5.tgz#cbd9e6e75e09fc5d2c90015f21f0c40875e0dd51"
+  integrity sha512-o3KqipXNUdS7wpQzBHSe180lBGO60SoK0yVo3CYJgb2MkobuWuBX6dhkYP5ORCLd55y+SaflMOV5fqAB53ux4w==
+  dependencies:
+    options ">=0.0.5"
+    ultron "1.0.x"
+
+ws@^2.0.3:
+  version "2.3.1"
+  resolved "https://registry.yarnpkg.com/ws/-/ws-2.3.1.tgz#6b94b3e447cb6a363f785eaf94af6359e8e81c80"
+  integrity sha1-a5Sz5EfLajY/eF6vlK9jWejoHIA=
+  dependencies:
+    safe-buffer "~5.0.1"
+    ultron "~1.1.0"
+
 ws@^5.2.0:
   version "5.2.2"
   resolved "https://registry.yarnpkg.com/ws/-/ws-5.2.2.tgz#dffef14866b8e8dc9133582514d1befaf96e980f"
@@ -21032,6 +22022,15 @@ x-is-string@^0.1.0:
   version "0.1.0"
   resolved "https://registry.yarnpkg.com/x-is-string/-/x-is-string-0.1.0.tgz#474b50865af3a49a9c4657f05acd145458f77d82"
 
+xcode@^0.9.1:
+  version "0.9.3"
+  resolved "https://registry.yarnpkg.com/xcode/-/xcode-0.9.3.tgz#910a89c16aee6cc0b42ca805a6d0b4cf87211cf3"
+  integrity sha1-kQqJwWrubMC0LKgFptC0z4chHPM=
+  dependencies:
+    pegjs "^0.10.0"
+    simple-plist "^0.2.1"
+    uuid "3.0.1"
+
 xdg-basedir@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/xdg-basedir/-/xdg-basedir-3.0.0.tgz#496b2cc109eca8dbacfe2dc72b603c17c5870ad4"
@@ -21047,6 +22046,18 @@ xml2js@^0.4.17:
     sax ">=0.6.0"
     xmlbuilder "~9.0.1"
 
+xmlbuilder@4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/xmlbuilder/-/xmlbuilder-4.0.0.tgz#98b8f651ca30aa624036f127d11cc66dc7b907a3"
+  integrity sha1-mLj2UcowqmJANvEn0RzGbce5B6M=
+  dependencies:
+    lodash "^3.5.0"
+
+xmlbuilder@8.2.2:
+  version "8.2.2"
+  resolved "https://registry.yarnpkg.com/xmlbuilder/-/xmlbuilder-8.2.2.tgz#69248673410b4ba42e1a6136551d2922335aa773"
+  integrity sha1-aSSGc0ELS6QuGmE2VR0pIjNap3M=
+
 xmlbuilder@~9.0.1:
   version "9.0.7"
   resolved "https://registry.yarnpkg.com/xmlbuilder/-/xmlbuilder-9.0.7.tgz#132ee63d2ec5565c557e20f4c22df9aca686b10d"
@@ -21055,7 +22066,14 @@ xmlchars@^1.3.1:
   version "1.3.1"
   resolved "https://registry.yarnpkg.com/xmlchars/-/xmlchars-1.3.1.tgz#1dda035f833dbb4f86a0c28eaa6ca769214793cf"
 
-xmldom@^0.1.19:
+xmldoc@^0.4.0:
+  version "0.4.0"
+  resolved "https://registry.yarnpkg.com/xmldoc/-/xmldoc-0.4.0.tgz#d257224be8393eaacbf837ef227fd8ec25b36888"
+  integrity sha1-0lciS+g5PqrL+DfvIn/Y7CWzaIg=
+  dependencies:
+    sax "~1.1.1"
+
+xmldom@0.1.x, xmldom@^0.1.19:
   version "0.1.27"
   resolved "https://registry.yarnpkg.com/xmldom/-/xmldom-0.1.27.tgz#d501f97b3bdb403af8ef9ecc20573187aadac0e9"
 
@@ -21063,6 +22081,11 @@ xmlhttprequest-ssl@~1.5.4:
   version "1.5.5"
   resolved "https://registry.yarnpkg.com/xmlhttprequest-ssl/-/xmlhttprequest-ssl-1.5.5.tgz#c2876b06168aadc40e57d97e81191ac8f4398b3e"
 
+xpipe@^1.0.5:
+  version "1.0.5"
+  resolved "https://registry.yarnpkg.com/xpipe/-/xpipe-1.0.5.tgz#8dd8bf45fc3f7f55f0e054b878f43a62614dafdf"
+  integrity sha1-jdi/Rfw/f1Xw4FS4ePQ6YmFNr98=
+
 xregexp@4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/xregexp/-/xregexp-4.0.0.tgz#e698189de49dd2a18cc5687b05e17c8e43943020"
@@ -21172,7 +22195,7 @@ yargs@6.6.0:
     y18n "^3.2.1"
     yargs-parser "^4.2.0"
 
-yargs@9.0.1:
+yargs@9.0.1, yargs@^9.0.0:
   version "9.0.1"
   resolved "https://registry.yarnpkg.com/yargs/-/yargs-9.0.1.tgz#52acc23feecac34042078ee78c0c007f5085db4c"
   dependencies:

From 44fe2802afd1da61d0c4111234db6d6d586f79e0 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Sat, 23 Feb 2019 10:33:41 +0800
Subject: [PATCH 066/249] Fix typo

---
 addons/ondevice-knobs/package.json | 2 +-
 addons/ondevice-notes/package.json | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/addons/ondevice-knobs/package.json b/addons/ondevice-knobs/package.json
index 947c86a37ae..4e9e1173c29 100644
--- a/addons/ondevice-knobs/package.json
+++ b/addons/ondevice-knobs/package.json
@@ -36,6 +36,6 @@
     "react-native": "*"
   },
   "publishConfig": {
-    "private": true
+    "access": "public"
   }
 }
diff --git a/addons/ondevice-notes/package.json b/addons/ondevice-notes/package.json
index 714c2b86bb7..0167b39e5f8 100644
--- a/addons/ondevice-notes/package.json
+++ b/addons/ondevice-notes/package.json
@@ -29,6 +29,6 @@
     "react-native": "*"
   },
   "publishConfig": {
-    "private": true
+    "access": "public"
   }
 }

From f31da75483e717718d2eb67613cb765965134751 Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Fri, 22 Feb 2019 17:01:15 +0100
Subject: [PATCH 067/249] Merge pull request #5702 from
 storybooks/fix/search-hotkey-keystroke

ADD a timeout around the `/` search hotkey, so it doesn't type into the input
---
 lib/ui/src/core/shortcuts.js | 11 +++++++----
 1 file changed, 7 insertions(+), 4 deletions(-)

diff --git a/lib/ui/src/core/shortcuts.js b/lib/ui/src/core/shortcuts.js
index 0e5ae59ab10..9c07925da75 100644
--- a/lib/ui/src/core/shortcuts.js
+++ b/lib/ui/src/core/shortcuts.js
@@ -101,11 +101,14 @@ export default function initShortcuts({ store }) {
           if (!showNav) {
             fullApi.toggleNav();
           }
-          const element = document.getElementById('storybook-explorer-searchfield');
 
-          if (element) {
-            element.focus();
-          }
+          setTimeout(() => {
+            const element = document.getElementById('storybook-explorer-searchfield');
+
+            if (element) {
+              element.focus();
+            }
+          }, 0);
           break;
         }
 

From 62651ef494520c8ca409f6c59568b5b436171167 Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Tue, 12 Feb 2019 00:53:08 +0100
Subject: [PATCH 068/249] Merge pull request #5535 from
 gaetanmaisse/ts-migration/addon-backgrounds

Migrate addon backgrounds to TS
---
 addons/backgrounds/package.json               |   7 +-
 addons/backgrounds/src/Tool.js                | 149 ----------------
 addons/backgrounds/src/components.js          |   5 -
 .../backgrounds/src/components/ColorIcon.tsx  |   9 +
 addons/backgrounds/src/components/index.ts    |   1 +
 .../src/{constants.js => constants.ts}        |   2 +-
 .../src/containers/BackgroundSelector.tsx     | 165 ++++++++++++++++++
 addons/backgrounds/src/containers/index.ts    |   1 +
 .../src/{deprecated.js => deprecated.ts}      |   0
 addons/backgrounds/src/{index.js => index.ts} |  15 +-
 .../src/models/BackgroundConfig.ts            |   5 +
 .../src/models/BackgroundSelectorItem.ts      |   7 +
 addons/backgrounds/src/models/index.ts        |   2 +
 .../src/{register.js => register.tsx}         |   7 +-
 addons/backgrounds/src/typings.d.ts           |   2 +
 addons/backgrounds/tsconfig.json              |  13 ++
 16 files changed, 222 insertions(+), 168 deletions(-)
 delete mode 100644 addons/backgrounds/src/Tool.js
 delete mode 100644 addons/backgrounds/src/components.js
 create mode 100644 addons/backgrounds/src/components/ColorIcon.tsx
 create mode 100644 addons/backgrounds/src/components/index.ts
 rename addons/backgrounds/src/{constants.js => constants.ts} (86%)
 create mode 100644 addons/backgrounds/src/containers/BackgroundSelector.tsx
 create mode 100644 addons/backgrounds/src/containers/index.ts
 rename addons/backgrounds/src/{deprecated.js => deprecated.ts} (100%)
 rename addons/backgrounds/src/{index.js => index.ts} (68%)
 create mode 100644 addons/backgrounds/src/models/BackgroundConfig.ts
 create mode 100644 addons/backgrounds/src/models/BackgroundSelectorItem.ts
 create mode 100644 addons/backgrounds/src/models/index.ts
 rename addons/backgrounds/src/{register.js => register.tsx} (54%)
 create mode 100644 addons/backgrounds/src/typings.d.ts
 create mode 100644 addons/backgrounds/tsconfig.json

diff --git a/addons/backgrounds/package.json b/addons/backgrounds/package.json
index ec3ccb3da52..dcb89bca0ff 100644
--- a/addons/backgrounds/package.json
+++ b/addons/backgrounds/package.json
@@ -19,7 +19,7 @@
   "license": "MIT",
   "author": "jbaxleyiii",
   "main": "dist/index.js",
-  "jsnext:main": "src/index.js",
+  "types": "dist/index.d.ts",
   "scripts": {
     "prepare": "node ../../scripts/prepare.js"
   },
@@ -30,13 +30,14 @@
     "@storybook/core-events": "5.0.0-rc.4",
     "@storybook/theming": "5.0.0-rc.4",
     "core-js": "^2.6.2",
-    "eventemitter3": "^3.1.0",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
-    "prop-types": "^15.6.2",
     "react": "^16.8.1",
     "util-deprecate": "^1.0.2"
   },
+  "devDependencies": {
+    "@types/util-deprecate": "^1.0.0"
+  },
   "publishConfig": {
     "access": "public"
   }
diff --git a/addons/backgrounds/src/Tool.js b/addons/backgrounds/src/Tool.js
deleted file mode 100644
index d05a7658936..00000000000
--- a/addons/backgrounds/src/Tool.js
+++ /dev/null
@@ -1,149 +0,0 @@
-import React, { Component, Fragment } from 'react';
-import PropTypes from 'prop-types';
-import memoize from 'memoizerific';
-
-import { Global, styled } from '@storybook/theming';
-
-import { SET_STORIES } from '@storybook/core-events';
-
-import { Icons, IconButton, WithTooltip, TooltipLinkList } from '@storybook/components';
-
-import { PARAM_KEY } from './constants';
-
-export const ColorIcon = styled.span(({ background }) => ({
-  borderRadius: '1rem',
-  display: 'block',
-  height: '1rem',
-  width: '1rem',
-  background,
-}));
-
-const iframeId = 'storybook-preview-background';
-
-const createItem = memoize(1000)((id, name, value, hasSwatch, change) =>
-  hasSwatch
-    ? {
-        id: id || name,
-        title: name,
-        onClick: () => {
-          change({ selected: value, expanded: false });
-        },
-        value,
-        right: <ColorIcon background={value} />,
-      }
-    : {
-        id: id || name,
-        title: name,
-        onClick: () => {
-          change({ selected: value, expanded: false });
-        },
-        value,
-      }
-);
-
-const getSelected = (list, state) => {
-  if (!list.length) {
-    return 'transparent';
-  }
-
-  if (state === 'transparent') {
-    return state;
-  }
-
-  if (list.find(i => i.value === state)) {
-    return state;
-  }
-
-  if (list.find(i => i.default)) {
-    return list.find(i => i.default).value;
-  }
-
-  return 'transparent';
-};
-
-const getState = memoize(10)((props, state, change) => {
-  const data = props.api.getCurrentStoryData();
-  const list = (data && data.parameters && data.parameters[PARAM_KEY]) || [];
-
-  const selected = getSelected(list, state.selected);
-
-  const initial =
-    selected !== 'transparent'
-      ? [createItem('reset', 'Clear background', 'transparent', false, change)]
-      : [];
-
-  const items = list.length
-    ? initial.concat(list.map(({ id, name, value }) => createItem(id, name, value, true, change)))
-    : list;
-
-  return {
-    items,
-    selected,
-  };
-});
-
-export default class BackgroundTool extends Component {
-  static propTypes = {
-    api: PropTypes.shape({
-      getQueryParam: PropTypes.func,
-      setQueryParams: PropTypes.func,
-    }).isRequired,
-  };
-
-  constructor(props) {
-    super(props);
-
-    this.state = {
-      items: [],
-      selected: undefined,
-      expanded: false,
-    };
-
-    this.listener = () => {
-      this.setState({ selected: null });
-    };
-  }
-
-  componentDidMount() {
-    const { api } = this.props;
-    api.on(SET_STORIES, this.listener);
-  }
-
-  componentWillUnmount() {
-    const { api } = this.props;
-    api.off(SET_STORIES, this.listener);
-  }
-
-  change = (...args) => this.setState(...args);
-
-  render() {
-    const { expanded } = this.state;
-    const { items, selected } = getState(this.props, this.state, this.change);
-
-    return items.length ? (
-      <Fragment>
-        {selected ? (
-          <Global
-            styles={{
-              [`#${iframeId}`]: {
-                background: selected,
-              },
-            }}
-          />
-        ) : null}
-        <WithTooltip
-          placement="top"
-          trigger="click"
-          tooltipShown={expanded}
-          onVisibilityChange={s => this.setState({ expanded: s })}
-          tooltip={<TooltipLinkList links={items} />}
-          closeOnClick
-        >
-          <IconButton key="background" title="Backgrounds">
-            <Icons icon="photo" />
-          </IconButton>
-        </WithTooltip>
-      </Fragment>
-    ) : null;
-  }
-}
diff --git a/addons/backgrounds/src/components.js b/addons/backgrounds/src/components.js
deleted file mode 100644
index 9bc6443aaf8..00000000000
--- a/addons/backgrounds/src/components.js
+++ /dev/null
@@ -1,5 +0,0 @@
-import { styled } from '@storybook/theming';
-
-export const ColorIcon = styled.span(({ background }) => ({
-  background,
-}));
diff --git a/addons/backgrounds/src/components/ColorIcon.tsx b/addons/backgrounds/src/components/ColorIcon.tsx
new file mode 100644
index 00000000000..aabdce3ffd4
--- /dev/null
+++ b/addons/backgrounds/src/components/ColorIcon.tsx
@@ -0,0 +1,9 @@
+import { styled } from '@storybook/theming';
+
+export const ColorIcon = styled.span(({ background }: { background: string }) => ({
+  borderRadius: '1rem',
+  display: 'block',
+  height: '1rem',
+  width: '1rem',
+  background,
+}));
diff --git a/addons/backgrounds/src/components/index.ts b/addons/backgrounds/src/components/index.ts
new file mode 100644
index 00000000000..db2a966bc4f
--- /dev/null
+++ b/addons/backgrounds/src/components/index.ts
@@ -0,0 +1 @@
+export * from './ColorIcon';
diff --git a/addons/backgrounds/src/constants.js b/addons/backgrounds/src/constants.ts
similarity index 86%
rename from addons/backgrounds/src/constants.js
rename to addons/backgrounds/src/constants.ts
index 39f865027c5..df63c53889d 100644
--- a/addons/backgrounds/src/constants.js
+++ b/addons/backgrounds/src/constants.ts
@@ -1,7 +1,7 @@
 export const ADDON_ID = 'storybook/background';
 export const PARAM_KEY = 'backgrounds';
 
-export default {
+export const EVENTS = {
   SET: `${ADDON_ID}:set`,
   UNSET: `${ADDON_ID}:unset`,
 };
diff --git a/addons/backgrounds/src/containers/BackgroundSelector.tsx b/addons/backgrounds/src/containers/BackgroundSelector.tsx
new file mode 100644
index 00000000000..9dd602b9a72
--- /dev/null
+++ b/addons/backgrounds/src/containers/BackgroundSelector.tsx
@@ -0,0 +1,165 @@
+import React, { Component, Fragment } from 'react';
+import memoize from 'memoizerific';
+
+import { Global } from '@storybook/theming';
+
+import { SET_STORIES } from '@storybook/core-events';
+
+import { Icons, IconButton, WithTooltip, TooltipLinkList } from '@storybook/components';
+
+import { PARAM_KEY } from '../constants';
+import { ColorIcon } from '../components';
+import { BackgroundConfig, BackgroundSelectorItem } from '../models';
+
+const iframeId = 'storybook-preview-background';
+
+const createBackgroundSelectorItem = memoize(1000)(
+  (
+    id: string,
+    name: string,
+    value: string,
+    hasSwatch: boolean,
+    change: (arg: { selected: string; expanded: boolean }) => void
+  ): BackgroundSelectorItem => ({
+    id: id || name,
+    title: name,
+    onClick: () => {
+      change({ selected: value, expanded: false });
+    },
+    value,
+    right: hasSwatch ? <ColorIcon background={value} /> : undefined,
+  })
+);
+
+const getSelectedBackgroundColor = (
+  list: BackgroundConfig[],
+  currentSelectedValue: string
+): string => {
+  if (!list.length) {
+    return 'transparent';
+  }
+
+  if (currentSelectedValue === 'transparent') {
+    return currentSelectedValue;
+  }
+
+  if (list.find(i => i.value === currentSelectedValue)) {
+    return currentSelectedValue;
+  }
+
+  if (list.find(i => i.default)) {
+    return list.find(i => i.default).value;
+  }
+
+  return 'transparent';
+};
+
+const getDisplayableState = memoize(10)(
+  (props: BackgroundToolProps, state: BackgroundToolState, change) => {
+    const data = props.api.getCurrentStoryData();
+    const list: BackgroundConfig[] = (data && data.parameters && data.parameters[PARAM_KEY]) || [];
+
+    const selectedBackgroundColor = getSelectedBackgroundColor(list, state.selected);
+
+    let availableBackgroundSelectorItems: BackgroundSelectorItem[] = [];
+
+    if (selectedBackgroundColor !== 'transparent') {
+      availableBackgroundSelectorItems.push(
+        createBackgroundSelectorItem('reset', 'Clear background', 'transparent', false, change)
+      );
+    }
+
+    if (list.length) {
+      availableBackgroundSelectorItems = [
+        ...availableBackgroundSelectorItems,
+        ...list.map(({ name, value }) =>
+          createBackgroundSelectorItem(null, name, value, true, change)
+        ),
+      ];
+    }
+
+    return {
+      items: availableBackgroundSelectorItems,
+      selectedBackgroundColor,
+    };
+  }
+);
+
+interface BackgroundToolProps {
+  api: {
+    on(event: string, callback: (data: any) => void): void;
+    off(event: string, callback: (data: any) => void): void;
+    getCurrentStoryData(): any;
+  };
+}
+
+interface BackgroundToolState {
+  items: BackgroundSelectorItem[];
+  selected: string;
+  expanded: boolean;
+}
+
+export class BackgroundSelector extends Component<BackgroundToolProps, BackgroundToolState> {
+  private listener = () => {
+    this.setState({ selected: null });
+  };
+
+  constructor(props: BackgroundToolProps) {
+    super(props);
+
+    this.state = {
+      items: [],
+      selected: null,
+      expanded: false,
+    };
+  }
+
+  componentDidMount() {
+    const { api } = this.props;
+    api.on(SET_STORIES, this.listener);
+  }
+
+  componentWillUnmount() {
+    const { api } = this.props;
+    api.off(SET_STORIES, this.listener);
+  }
+
+  change = (args: { selected: string; expanded: boolean }) => this.setState(args);
+
+  render() {
+    const { expanded } = this.state;
+    const { items, selectedBackgroundColor } = getDisplayableState(
+      this.props,
+      this.state,
+      this.change
+    );
+
+    return items.length ? (
+      <Fragment>
+        {selectedBackgroundColor ? (
+          <Global
+            styles={{
+              [`#${iframeId}`]: {
+                background: selectedBackgroundColor,
+              },
+            }}
+          />
+        ) : null}
+        <WithTooltip
+          placement="top"
+          trigger="click"
+          tooltipShown={expanded}
+          onVisibilityChange={(newVisibility: boolean) =>
+            this.setState({ expanded: newVisibility })
+          }
+          tooltip={<TooltipLinkList links={items} />}
+          closeOnClick
+        >
+          <IconButton key="background" title="Backgrounds">
+            <Icons icon="photo" />
+          </IconButton>
+        </WithTooltip>
+      </Fragment>
+    ) : null;
+  }
+}
diff --git a/addons/backgrounds/src/containers/index.ts b/addons/backgrounds/src/containers/index.ts
new file mode 100644
index 00000000000..87f68e7c7ae
--- /dev/null
+++ b/addons/backgrounds/src/containers/index.ts
@@ -0,0 +1 @@
+export * from './BackgroundSelector';
diff --git a/addons/backgrounds/src/deprecated.js b/addons/backgrounds/src/deprecated.ts
similarity index 100%
rename from addons/backgrounds/src/deprecated.js
rename to addons/backgrounds/src/deprecated.ts
diff --git a/addons/backgrounds/src/index.js b/addons/backgrounds/src/index.ts
similarity index 68%
rename from addons/backgrounds/src/index.js
rename to addons/backgrounds/src/index.ts
index 460a270e44b..7bccd015db8 100644
--- a/addons/backgrounds/src/index.js
+++ b/addons/backgrounds/src/index.ts
@@ -1,14 +1,15 @@
-import addons, { makeDecorator } from '@storybook/addons';
-import CoreEvents from '@storybook/core-events';
+import { addons, makeDecorator } from '@storybook/addons';
 import deprecate from 'util-deprecate';
 
-import Events from './constants';
+import { REGISTER_SUBSCRIPTION } from '@storybook/core-events';
+import { EVENTS } from './constants';
+import { BackgroundConfig } from './models';
 
-let prevBackgrounds;
+let prevBackgrounds: BackgroundConfig[];
 
 const subscription = () => () => {
   prevBackgrounds = null;
-  addons.getChannel().emit(Events.UNSET);
+  addons.getChannel().emit(EVENTS.UNSET);
 };
 
 export const withBackgrounds = makeDecorator({
@@ -25,10 +26,10 @@ export const withBackgrounds = makeDecorator({
     }
 
     if (prevBackgrounds !== backgrounds) {
-      addons.getChannel().emit(Events.SET, backgrounds);
+      addons.getChannel().emit(EVENTS.SET, backgrounds);
       prevBackgrounds = backgrounds;
     }
-    addons.getChannel().emit(CoreEvents.REGISTER_SUBSCRIPTION, subscription);
+    addons.getChannel().emit(REGISTER_SUBSCRIPTION, subscription);
 
     return getStory(context);
   },
diff --git a/addons/backgrounds/src/models/BackgroundConfig.ts b/addons/backgrounds/src/models/BackgroundConfig.ts
new file mode 100644
index 00000000000..f48826281bd
--- /dev/null
+++ b/addons/backgrounds/src/models/BackgroundConfig.ts
@@ -0,0 +1,5 @@
+export interface BackgroundConfig {
+  name: string;
+  value: string;
+  default?: boolean;
+}
diff --git a/addons/backgrounds/src/models/BackgroundSelectorItem.ts b/addons/backgrounds/src/models/BackgroundSelectorItem.ts
new file mode 100644
index 00000000000..fdc35e55c10
--- /dev/null
+++ b/addons/backgrounds/src/models/BackgroundSelectorItem.ts
@@ -0,0 +1,7 @@
+export interface BackgroundSelectorItem {
+  id: string;
+  title: string;
+  onClick: () => void;
+  value: string;
+  right?: any;
+}
diff --git a/addons/backgrounds/src/models/index.ts b/addons/backgrounds/src/models/index.ts
new file mode 100644
index 00000000000..dc3676a463d
--- /dev/null
+++ b/addons/backgrounds/src/models/index.ts
@@ -0,0 +1,2 @@
+export * from './BackgroundConfig';
+export * from './BackgroundSelectorItem';
diff --git a/addons/backgrounds/src/register.js b/addons/backgrounds/src/register.tsx
similarity index 54%
rename from addons/backgrounds/src/register.js
rename to addons/backgrounds/src/register.tsx
index 7f398493438..d592fdd43ef 100644
--- a/addons/backgrounds/src/register.js
+++ b/addons/backgrounds/src/register.tsx
@@ -1,13 +1,14 @@
 import React from 'react';
-import addons, { types } from '@storybook/addons';
+import { addons, types } from '@storybook/addons';
 
 import { ADDON_ID } from './constants';
-import Tool from './Tool';
+import { BackgroundSelector } from './containers';
 
 addons.register(ADDON_ID, api => {
   addons.add(ADDON_ID, {
+    title: 'Backgrounds',
     type: types.TOOL,
     match: ({ viewMode }) => viewMode === 'story',
-    render: () => <Tool api={api} />,
+    render: () => <BackgroundSelector api={api} />,
   });
 });
diff --git a/addons/backgrounds/src/typings.d.ts b/addons/backgrounds/src/typings.d.ts
new file mode 100644
index 00000000000..0ca9d455293
--- /dev/null
+++ b/addons/backgrounds/src/typings.d.ts
@@ -0,0 +1,2 @@
+// TODO: following packages need definition files or a TS migration
+declare module '@storybook/components';
diff --git a/addons/backgrounds/tsconfig.json b/addons/backgrounds/tsconfig.json
new file mode 100644
index 00000000000..8876bb6737a
--- /dev/null
+++ b/addons/backgrounds/tsconfig.json
@@ -0,0 +1,13 @@
+{
+  "extends": "../../tsconfig.json",
+  "compilerOptions": {
+    "rootDir": "./src",
+    "types": ["webpack-env"]
+  },
+  "include": [
+    "src/**/*"
+  ],
+  "exclude": [
+    "src/__tests__/**/*"
+  ]
+}

From 0ac558db252fb266350bc3d409925c1a1bd96479 Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Thu, 21 Feb 2019 22:14:31 +0100
Subject: [PATCH 069/249] Merge pull request #5712 from
 storybooks/minor-addon-UX-tweaks

Minor addon ux tweaks
---
 addons/a11y/src/components/ColorBlindness.js  |  3 +++
 .../backgrounds/src/components/ColorIcon.tsx  | 19 ++++++++++++-------
 .../src/containers/BackgroundSelector.tsx     |  2 +-
 addons/viewport/src/Tool.js                   |  2 +-
 4 files changed, 17 insertions(+), 9 deletions(-)

diff --git a/addons/a11y/src/components/ColorBlindness.js b/addons/a11y/src/components/ColorBlindness.js
index b5ac802b308..5289159b729 100644
--- a/addons/a11y/src/components/ColorBlindness.js
+++ b/addons/a11y/src/components/ColorBlindness.js
@@ -18,6 +18,9 @@ const ColorIcon = styled.span(
   },
   ({ filter }) => ({
     filter: filter === 'mono' ? 'grayscale(100%)' : `url('#${filter}')`,
+  }),
+  ({ theme }) => ({
+    boxShadow: `${theme.appBorderColor} 0 0 0 1px inset`,
   })
 );
 
diff --git a/addons/backgrounds/src/components/ColorIcon.tsx b/addons/backgrounds/src/components/ColorIcon.tsx
index aabdce3ffd4..00da34e6fd1 100644
--- a/addons/backgrounds/src/components/ColorIcon.tsx
+++ b/addons/backgrounds/src/components/ColorIcon.tsx
@@ -1,9 +1,14 @@
 import { styled } from '@storybook/theming';
 
-export const ColorIcon = styled.span(({ background }: { background: string }) => ({
-  borderRadius: '1rem',
-  display: 'block',
-  height: '1rem',
-  width: '1rem',
-  background,
-}));
+export const ColorIcon = styled.span(
+  ({ background }: { background: string }) => ({
+    borderRadius: '1rem',
+    display: 'block',
+    height: '1rem',
+    width: '1rem',
+    background,
+  }),
+  ({ theme }) => ({
+    boxShadow: `${theme.appBorderColor} 0 0 0 1px inset`,
+  }),
+);
diff --git a/addons/backgrounds/src/containers/BackgroundSelector.tsx b/addons/backgrounds/src/containers/BackgroundSelector.tsx
index 9dd602b9a72..73f15f4df06 100644
--- a/addons/backgrounds/src/containers/BackgroundSelector.tsx
+++ b/addons/backgrounds/src/containers/BackgroundSelector.tsx
@@ -8,7 +8,7 @@ import { SET_STORIES } from '@storybook/core-events';
 import { Icons, IconButton, WithTooltip, TooltipLinkList } from '@storybook/components';
 
 import { PARAM_KEY } from '../constants';
-import { ColorIcon } from '../components';
+import { ColorIcon } from '../components/ColorIcon';
 import { BackgroundConfig, BackgroundSelectorItem } from '../models';
 
 const iframeId = 'storybook-preview-background';
diff --git a/addons/viewport/src/Tool.js b/addons/viewport/src/Tool.js
index ed9652afef6..889a4a34687 100644
--- a/addons/viewport/src/Tool.js
+++ b/addons/viewport/src/Tool.js
@@ -20,7 +20,7 @@ const createItem = memoize(1000)((id, name, value, change) => ({
   onClick: () => {
     change({ selected: id, expanded: false });
   },
-  right: `${value.width}-${value.height}`,
+  right: `${value.width.replace('px', '')}x${value.height.replace('px', '')}`,
   value,
 }));
 

From d3edcf43dcb53f9f20ca564f40af1beaa9bfaa05 Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Thu, 21 Feb 2019 23:59:45 +0800
Subject: [PATCH 070/249] Merge pull request #5692 from
 storybooks/fix/tooltip-tools

Fix/tooltip tools
---
 addons/a11y/src/components/ColorBlindness.js  |  2 +-
 .../src/containers/BackgroundSelector.tsx     | 61 +++++++------------
 addons/storysource/src/StoryPanel.js          |  2 +-
 addons/viewport/src/Tool.js                   |  2 +-
 4 files changed, 26 insertions(+), 41 deletions(-)

diff --git a/addons/a11y/src/components/ColorBlindness.js b/addons/a11y/src/components/ColorBlindness.js
index 5289159b729..375b9a723d4 100644
--- a/addons/a11y/src/components/ColorBlindness.js
+++ b/addons/a11y/src/components/ColorBlindness.js
@@ -27,7 +27,7 @@ const ColorIcon = styled.span(
 class ColorBlindness extends Component {
   state = {
     expanded: false,
-    filter: false,
+    filter: null,
   };
 
   setFilter = filter => {
diff --git a/addons/backgrounds/src/containers/BackgroundSelector.tsx b/addons/backgrounds/src/containers/BackgroundSelector.tsx
index 73f15f4df06..76f0011a804 100644
--- a/addons/backgrounds/src/containers/BackgroundSelector.tsx
+++ b/addons/backgrounds/src/containers/BackgroundSelector.tsx
@@ -31,10 +31,7 @@ const createBackgroundSelectorItem = memoize(1000)(
   })
 );
 
-const getSelectedBackgroundColor = (
-  list: BackgroundConfig[],
-  currentSelectedValue: string
-): string => {
+const getSelectedBackgroundColor = (list: BackgroundConfig[], currentSelectedValue: string): string => {
   if (!list.length) {
     return 'transparent';
   }
@@ -54,36 +51,30 @@ const getSelectedBackgroundColor = (
   return 'transparent';
 };
 
-const getDisplayableState = memoize(10)(
-  (props: BackgroundToolProps, state: BackgroundToolState, change) => {
-    const data = props.api.getCurrentStoryData();
-    const list: BackgroundConfig[] = (data && data.parameters && data.parameters[PARAM_KEY]) || [];
+const getDisplayableState = memoize(10)((props: BackgroundToolProps, state: BackgroundToolState, change) => {
+  const data = props.api.getCurrentStoryData();
+  const list: BackgroundConfig[] = (data && data.parameters && data.parameters[PARAM_KEY]) || [];
 
-    const selectedBackgroundColor = getSelectedBackgroundColor(list, state.selected);
+  const selectedBackgroundColor = getSelectedBackgroundColor(list, state.selected);
 
-    let availableBackgroundSelectorItems: BackgroundSelectorItem[] = [];
+  let availableBackgroundSelectorItems: BackgroundSelectorItem[] = [];
 
-    if (selectedBackgroundColor !== 'transparent') {
-      availableBackgroundSelectorItems.push(
-        createBackgroundSelectorItem('reset', 'Clear background', 'transparent', false, change)
-      );
-    }
-
-    if (list.length) {
-      availableBackgroundSelectorItems = [
-        ...availableBackgroundSelectorItems,
-        ...list.map(({ name, value }) =>
-          createBackgroundSelectorItem(null, name, value, true, change)
-        ),
-      ];
-    }
-
-    return {
-      items: availableBackgroundSelectorItems,
-      selectedBackgroundColor,
-    };
+  if (selectedBackgroundColor !== 'transparent') {
+    availableBackgroundSelectorItems.push(createBackgroundSelectorItem('reset', 'Clear background', 'transparent', null, change));
   }
-);
+
+  if (list.length) {
+    availableBackgroundSelectorItems = [
+      ...availableBackgroundSelectorItems,
+      ...list.map(({ name, value }) => createBackgroundSelectorItem(null, name, value, true, change)),
+    ];
+  }
+
+  return {
+    items: availableBackgroundSelectorItems,
+    selectedBackgroundColor,
+  };
+});
 
 interface BackgroundToolProps {
   api: {
@@ -128,11 +119,7 @@ export class BackgroundSelector extends Component<BackgroundToolProps, Backgroun
 
   render() {
     const { expanded } = this.state;
-    const { items, selectedBackgroundColor } = getDisplayableState(
-      this.props,
-      this.state,
-      this.change
-    );
+    const { items, selectedBackgroundColor } = getDisplayableState(this.props, this.state, this.change);
 
     return items.length ? (
       <Fragment>
@@ -149,9 +136,7 @@ export class BackgroundSelector extends Component<BackgroundToolProps, Backgroun
           placement="top"
           trigger="click"
           tooltipShown={expanded}
-          onVisibilityChange={(newVisibility: boolean) =>
-            this.setState({ expanded: newVisibility })
-          }
+          onVisibilityChange={(newVisibility: boolean) => this.setState({ expanded: newVisibility })}
           tooltip={<TooltipLinkList links={items} />}
           closeOnClick
         >
diff --git a/addons/storysource/src/StoryPanel.js b/addons/storysource/src/StoryPanel.js
index 07e17f75163..a80f461edf4 100644
--- a/addons/storysource/src/StoryPanel.js
+++ b/addons/storysource/src/StoryPanel.js
@@ -95,7 +95,7 @@ export default class StoryPanel extends Component {
     const story = this.createPart(storyRows, stylesheet, useInlineStyles);
     const storyKey = `${first}-${last}`;
 
-    if (areLocationsEqual(location, currentLocation)) {
+    if (location && currentLocation && areLocationsEqual(location, currentLocation)) {
       return (
         <SelectedStoryHighlight key={storyKey} ref={this.setSelectedStoryRef}>
           {story}
diff --git a/addons/viewport/src/Tool.js b/addons/viewport/src/Tool.js
index 889a4a34687..d0042f2ea6c 100644
--- a/addons/viewport/src/Tool.js
+++ b/addons/viewport/src/Tool.js
@@ -49,7 +49,7 @@ const getState = memoize(10)((props, state, change) => {
             id: 'rotate',
             title: 'Rotate viewport',
             onClick: () => {
-              change({ isRotated: !state.isRotate, expanded: false });
+              change({ isRotated: !state.isRotated, expanded: false });
             },
           },
         ]

From 16332ee5e8dcaf01752d0a05149d0395ecfe5d8f Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Sat, 23 Feb 2019 14:56:22 +0800
Subject: [PATCH 071/249] Merge pull request #5711 from
 storybooks/5597-toolbar-separators

5597 toolbar separators
---
 .../__snapshots__/storyshots.test.js.snap     |  4 +-
 lib/components/src/bar/bar.js                 | 15 +---
 lib/components/src/bar/separator.js           |  6 --
 .../tabs/__snapshots__/tabs.stories.storyshot | 22 ++---
 .../__snapshots__/panel.stories.storyshot     |  4 +-
 .../__snapshots__/preview.stories.storyshot   | 88 +++++++------------
 lib/ui/src/components/preview/preview.js      | 69 +++++++++------
 .../__snapshots__/about.stories.storyshot     | 12 +--
 8 files changed, 89 insertions(+), 131 deletions(-)

diff --git a/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap b/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
index 2e03b4a5771..be34263df94 100644
--- a/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
+++ b/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
@@ -4427,14 +4427,13 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
 >
   <div
     class="emotion-8"
-    title="bar"
+    title="flexbar"
   >
     <div
       class="emotion-7"
     >
       <div
         class="emotion-2"
-        title="side left"
       >
         <div
           class="emotion-1"
@@ -4451,7 +4450,6 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
       </div>
       <div
         class="emotion-6"
-        title="side right"
       >
         <button
           class="emotion-5"
diff --git a/lib/components/src/bar/bar.js b/lib/components/src/bar/bar.js
index 4d5f054e51d..f86e5bb5ac3 100644
--- a/lib/components/src/bar/bar.js
+++ b/lib/components/src/bar/bar.js
@@ -30,9 +30,6 @@ Side.displayName = 'Side';
 
 export const Bar = styled.div(
   ({ theme }) => ({
-    // display: 'flex',
-    // justifyContent: 'space-between',
-    // background: theme.barBg,
     color: theme.barTextColor,
     height: 40,
   }),
@@ -112,16 +109,10 @@ const BarInner = styled.div({
 export const FlexBar = ({ children, ...rest }) => {
   const [left, right] = Children.toArray(children);
   return (
-    <Bar {...rest} title="bar">
+    <Bar {...rest}>
       <BarInner>
-        <Side left title="side left">
-          {left}
-        </Side>
-        {right ? (
-          <Side right title="side right">
-            {right}
-          </Side>
-        ) : null}
+        <Side left>{left}</Side>
+        {right ? <Side right>{right}</Side> : null}
       </BarInner>
     </Bar>
   );
diff --git a/lib/components/src/bar/separator.js b/lib/components/src/bar/separator.js
index 61006d90aad..55ae9ee27c8 100644
--- a/lib/components/src/bar/separator.js
+++ b/lib/components/src/bar/separator.js
@@ -31,12 +31,6 @@ export const Separator = styled.span(
           '& + &': {
             display: 'none',
           },
-          '&:first-of-type': {
-            display: 'none',
-          },
-          '&:last-of-type': {
-            display: 'none',
-          },
         }
 );
 Separator.displayName = 'Separator';
diff --git a/lib/components/src/tabs/__snapshots__/tabs.stories.storyshot b/lib/components/src/tabs/__snapshots__/tabs.stories.storyshot
index ec79f2959e4..0b1f616cad8 100644
--- a/lib/components/src/tabs/__snapshots__/tabs.stories.storyshot
+++ b/lib/components/src/tabs/__snapshots__/tabs.stories.storyshot
@@ -223,14 +223,13 @@ exports[`Storyshots Basics|Tabs stateful - dynamic 1`] = `
   >
     <div
       class="emotion-9"
-      title="bar"
+      title="flexbar"
     >
       <div
         class="emotion-8"
       >
         <div
           class="emotion-7"
-          title="side left"
         >
           <div
             class="emotion-6"
@@ -575,14 +574,13 @@ exports[`Storyshots Basics|Tabs stateful - no initial 1`] = `
   >
     <div
       class="emotion-9"
-      title="bar"
+      title="flexbar"
     >
       <div
         class="emotion-8"
       >
         <div
           class="emotion-7"
-          title="side left"
         >
           <div
             class="emotion-6"
@@ -879,14 +877,13 @@ exports[`Storyshots Basics|Tabs stateful - static 1`] = `
   >
     <div
       class="emotion-5"
-      title="bar"
+      title="flexbar"
     >
       <div
         class="emotion-4"
       >
         <div
           class="emotion-3"
-          title="side left"
         >
           <div
             class="emotion-2"
@@ -1166,14 +1163,13 @@ exports[`Storyshots Basics|Tabs stateless - absolute 1`] = `
   >
     <div
       class="emotion-9"
-      title="bar"
+      title="flexbar"
     >
       <div
         class="emotion-8"
       >
         <div
           class="emotion-7"
-          title="side left"
         >
           <div
             class="emotion-6"
@@ -1520,14 +1516,13 @@ exports[`Storyshots Basics|Tabs stateless - bordered 1`] = `
   >
     <div
       class="emotion-9"
-      title="bar"
+      title="flexbar"
     >
       <div
         class="emotion-8"
       >
         <div
           class="emotion-7"
-          title="side left"
         >
           <div
             class="emotion-6"
@@ -1901,14 +1896,13 @@ exports[`Storyshots Basics|Tabs stateless - no scrolling 1`] = `
   >
     <div
       class="emotion-9"
-      title="bar"
+      title="flexbar"
     >
       <div
         class="emotion-8"
       >
         <div
           class="emotion-7"
-          title="side left"
         >
           <div
             class="emotion-6"
@@ -2271,14 +2265,13 @@ exports[`Storyshots Basics|Tabs stateless - with tools 1`] = `
   >
     <div
       class="emotion-10"
-      title="bar"
+      title="flexbar"
     >
       <div
         class="emotion-9"
       >
         <div
           class="emotion-7"
-          title="side left"
         >
           <div
             class="emotion-6"
@@ -2330,7 +2323,6 @@ exports[`Storyshots Basics|Tabs stateless - with tools 1`] = `
         </div>
         <div
           class="emotion-8"
-          title="side right"
         >
           <button
             type="button"
diff --git a/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot b/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot
index 05d29aa2388..17181209d86 100644
--- a/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot
+++ b/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot
@@ -291,14 +291,13 @@ exports[`Storyshots UI|Panel default 1`] = `
 >
   <div
     class="emotion-12"
-    title="bar"
+    title="flexbar"
   >
     <div
       class="emotion-11"
     >
       <div
         class="emotion-3"
-        title="side left"
       >
         <div
           class="emotion-2"
@@ -322,7 +321,6 @@ exports[`Storyshots UI|Panel default 1`] = `
       </div>
       <div
         class="emotion-10"
-        title="side right"
       >
         <button
           class="emotion-6"
diff --git a/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot b/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot
index bfa51224a2a..9ab7dd2e0eb 100644
--- a/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot
+++ b/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot
@@ -2,7 +2,7 @@
 
 exports[`Storyshots UI|Preview/Preview no tabs 1`] = `
 Array [
-  .emotion-22 {
+  .emotion-21 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -33,7 +33,7 @@ Array [
   margin-left: 15px;
 }
 
-.emotion-21 {
+.emotion-20 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -47,7 +47,7 @@ Array [
   margin-left: 30px;
 }
 
-.emotion-21 > * {
+.emotion-20 > * {
   margin-right: 15px;
 }
 
@@ -92,7 +92,7 @@ Array [
   fill: currentColor;
 }
 
-.emotion-23 {
+.emotion-22 {
   color: #999999;
   height: 40px;
   overflow: auto;
@@ -122,7 +122,7 @@ Array [
   tranform: translateY(0px);
 }
 
-.emotion-23:hover {
+.emotion-22:hover {
   -webkit-scrollbar-width: none;
   -moz-scrollbar-width: none;
   -ms-scrollbar-width: none;
@@ -133,7 +133,7 @@ Array [
   scrollbar-width: 0;
 }
 
-.emotion-23::-webkit-scrollbar {
+.emotion-22::-webkit-scrollbar {
   height: 3px;
   width: 3px;
   background: transparent;
@@ -141,14 +141,14 @@ Array [
   display: none;
 }
 
-.emotion-23:hover::-webkit-scrollbar {
+.emotion-22:hover::-webkit-scrollbar {
   height: 3px;
   width: 3px;
   background: transparent;
   display: block;
 }
 
-.emotion-23::-webkit-scrollbar-track {
+.emotion-22::-webkit-scrollbar-track {
   border-radius: 0;
   background: transparent;
   opacity: 0;
@@ -158,13 +158,13 @@ Array [
   width: 0;
 }
 
-.emotion-23::-webkit-scrollbar-thumb {
+.emotion-22::-webkit-scrollbar-thumb {
   border-radius: 0;
   background: rgba(0,0,0,.1);
   box-shadow: none;
 }
 
-.emotion-23::-webkit-scrollbar-track-piece {
+.emotion-22::-webkit-scrollbar-track-piece {
   display: none;
   border: 0 none;
   opacity: 0;
@@ -205,24 +205,14 @@ Array [
   display: none;
 }
 
-.emotion-9:first-of-type {
-  display: none;
-}
-
-.emotion-9:last-of-type {
-  display: none;
-}
-
 <div
-    class="emotion-23"
-    title="bar"
+    class="emotion-22"
   >
     <div
-      class="emotion-22"
+      class="emotion-21"
     >
       <div
         class="emotion-13"
-        title="side left"
       >
         <button
           class="emotion-2"
@@ -285,8 +275,7 @@ Array [
         </button>
       </div>
       <div
-        class="emotion-21"
-        title="side right"
+        class="emotion-20"
       >
         <button
           class="emotion-16"
@@ -302,12 +291,9 @@ Array [
             />
           </svg>
         </button>
-        <span
-          class="emotion-9"
-        />
         <button
           class="emotion-2"
-          title="Open component in new tab"
+          title="Go full screen"
         >
           <svg
             class="emotion-1"
@@ -315,7 +301,7 @@ Array [
           >
             <path
               class="emotion-0"
-              d="M896.006 920c0 22.090-17.91 40-40 40h-688.006c-22.090 0-40-17.906-40-40v-549.922c-0.838-3.224-1.33-6.588-1.33-10.072 0-22.090 17.908-40.004 40-40.004h178.66c22.092 0.004 40 17.914 40 40.004 0 22.088-17.908 40-40 40h-137.33v479.996h607.998v-479.996h-138.658c-22.090 0-40-17.912-40-40 0-22.090 17.906-40.004 40-40.004h178.658c22.090 0 40 17.91 40 40v559.844c0 0.050 0.008 0.102 0.008 0.154zM665.622 200.168l-124.452-124.45c-8.042-8.042-18.65-11.912-29.186-11.674-1.612-0.034-3.222 0-4.828 0.16-0.558 0.054-1.098 0.16-1.648 0.238-0.742 0.104-1.484 0.192-2.218 0.338-0.656 0.13-1.29 0.31-1.934 0.472-0.622 0.154-1.244 0.292-1.86 0.476-0.64 0.196-1.258 0.436-1.886 0.66-0.602 0.216-1.208 0.414-1.802 0.66-0.598 0.248-1.17 0.54-1.754 0.814-0.598 0.282-1.202 0.546-1.788 0.86-0.578 0.312-1.13 0.664-1.694 1-0.552 0.332-1.116 0.644-1.654 1.006-0.67 0.448-1.3 0.942-1.942 1.426-0.394 0.302-0.806 0.576-1.196 0.894-1.046 0.858-2.052 1.768-3.008 2.726l-124.398 124.39c-15.622 15.62-15.618 40.948 0.002 56.57 15.622 15.62 40.95 15.62 56.568 0l56.164-56.166v439.426c0 22.094 17.912 40 40.002 40 22.092 0 40-17.91 40-40v-441.202l57.942 57.942c15.622 15.624 40.948 15.62 56.568 0 15.626-15.618 15.626-40.946 0.002-56.566z"
+              d="M959.688 920.068l0.31-176c0.040-22.094-17.84-40.032-39.93-40.070-22.092-0.040-40.032 17.838-40.070 39.93l-0.142 79.672-235.734-235.732c-15.622-15.622-40.948-15.622-56.57 0s-15.622 40.948 0 56.568l235.442 235.442-78.946-0.1c-22.092-0.028-40.022 17.86-40.050 39.952-0.014 11.064 4.464 21.084 11.714 28.334 7.228 7.224 17.208 11.702 28.236 11.714l175.688 0.22c22.086 0.028 40.014-17.846 40.052-39.93zM920.178 64.228l-176-0.308c-22.094-0.040-40.032 17.84-40.070 39.93-0.040 22.092 17.838 40.032 39.93 40.070l79.672 0.14-235.732 235.734c-15.622 15.622-15.622 40.948 0 56.568s40.948 15.622 56.568 0l235.442-235.442-0.1 78.946c-0.028 22.092 17.86 40.022 39.952 40.050 11.064 0.014 21.084-4.464 28.334-11.714 7.224-7.228 11.702-17.208 11.714-28.236l0.22-175.688c0.026-22.082-17.846-40.010-39.93-40.050zM64.236 103.742l-0.308 176c-0.040 22.094 17.84 40.032 39.93 40.070 22.092 0.040 40.032-17.84 40.070-39.93l0.14-79.672 235.734 235.73c15.622 15.622 40.948 15.622 56.568 0s15.622-40.946 0-56.566l-235.442-235.442 78.946 0.098c22.092 0.028 40.022-17.86 40.050-39.95 0.014-11.066-4.464-21.086-11.714-28.336-7.228-7.222-17.208-11.7-28.236-11.714l-175.688-0.218c-22.084-0.026-40.012 17.844-40.050 39.93zM103.748 959.766l176 0.308c22.094 0.040 40.032-17.84 40.070-39.93 0.040-22.092-17.84-40.032-39.93-40.070l-79.672-0.14 235.73-235.734c15.622-15.622 15.622-40.948 0-56.568s-40.946-15.622-56.566 0l-235.442 235.442 0.098-78.946c0.028-22.092-17.86-40.022-39.95-40.050-11.066-0.014-21.086 4.464-28.336 11.714-7.222 7.228-11.7 17.208-11.714 28.236l-0.218 175.688c-0.026 22.082 17.844 40.010 39.93 40.050z"
             />
           </svg>
         </button>
@@ -396,7 +382,7 @@ Array [
 
 exports[`Storyshots UI|Preview/Preview with tabs 1`] = `
 Array [
-  .emotion-28 {
+  .emotion-27 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -525,7 +511,7 @@ Array [
   border-bottom-color: #1EA7FD;
 }
 
-.emotion-27 {
+.emotion-26 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -539,7 +525,7 @@ Array [
   margin-left: 30px;
 }
 
-.emotion-27 > * {
+.emotion-26 > * {
   margin-right: 15px;
 }
 
@@ -584,7 +570,7 @@ Array [
   fill: currentColor;
 }
 
-.emotion-29 {
+.emotion-28 {
   color: #999999;
   height: 40px;
   overflow: auto;
@@ -614,7 +600,7 @@ Array [
   tranform: translateY(0px);
 }
 
-.emotion-29:hover {
+.emotion-28:hover {
   -webkit-scrollbar-width: none;
   -moz-scrollbar-width: none;
   -ms-scrollbar-width: none;
@@ -625,7 +611,7 @@ Array [
   scrollbar-width: 0;
 }
 
-.emotion-29::-webkit-scrollbar {
+.emotion-28::-webkit-scrollbar {
   height: 3px;
   width: 3px;
   background: transparent;
@@ -633,14 +619,14 @@ Array [
   display: none;
 }
 
-.emotion-29:hover::-webkit-scrollbar {
+.emotion-28:hover::-webkit-scrollbar {
   height: 3px;
   width: 3px;
   background: transparent;
   display: block;
 }
 
-.emotion-29::-webkit-scrollbar-track {
+.emotion-28::-webkit-scrollbar-track {
   border-radius: 0;
   background: transparent;
   opacity: 0;
@@ -650,13 +636,13 @@ Array [
   width: 0;
 }
 
-.emotion-29::-webkit-scrollbar-thumb {
+.emotion-28::-webkit-scrollbar-thumb {
   border-radius: 0;
   background: rgba(0,0,0,.1);
   box-shadow: none;
 }
 
-.emotion-29::-webkit-scrollbar-track-piece {
+.emotion-28::-webkit-scrollbar-track-piece {
   display: none;
   border: 0 none;
   opacity: 0;
@@ -697,14 +683,6 @@ Array [
   display: none;
 }
 
-.emotion-5:first-of-type {
-  display: none;
-}
-
-.emotion-5:last-of-type {
-  display: none;
-}
-
 .emotion-1 {
   color: inherit;
   -webkit-text-decoration: inherit;
@@ -713,15 +691,13 @@ Array [
 }
 
 <div
-    class="emotion-29"
-    title="bar"
+    class="emotion-28"
   >
     <div
-      class="emotion-28"
+      class="emotion-27"
     >
       <div
         class="emotion-19"
-        title="side left"
       >
         <div
           class="emotion-4"
@@ -811,8 +787,7 @@ Array [
         </button>
       </div>
       <div
-        class="emotion-27"
-        title="side right"
+        class="emotion-26"
       >
         <button
           class="emotion-22"
@@ -828,12 +803,9 @@ Array [
             />
           </svg>
         </button>
-        <span
-          class="emotion-5"
-        />
         <button
           class="emotion-8"
-          title="Open component in new tab"
+          title="Go full screen"
         >
           <svg
             class="emotion-7"
@@ -841,7 +813,7 @@ Array [
           >
             <path
               class="emotion-6"
-              d="M896.006 920c0 22.090-17.91 40-40 40h-688.006c-22.090 0-40-17.906-40-40v-549.922c-0.838-3.224-1.33-6.588-1.33-10.072 0-22.090 17.908-40.004 40-40.004h178.66c22.092 0.004 40 17.914 40 40.004 0 22.088-17.908 40-40 40h-137.33v479.996h607.998v-479.996h-138.658c-22.090 0-40-17.912-40-40 0-22.090 17.906-40.004 40-40.004h178.658c22.090 0 40 17.91 40 40v559.844c0 0.050 0.008 0.102 0.008 0.154zM665.622 200.168l-124.452-124.45c-8.042-8.042-18.65-11.912-29.186-11.674-1.612-0.034-3.222 0-4.828 0.16-0.558 0.054-1.098 0.16-1.648 0.238-0.742 0.104-1.484 0.192-2.218 0.338-0.656 0.13-1.29 0.31-1.934 0.472-0.622 0.154-1.244 0.292-1.86 0.476-0.64 0.196-1.258 0.436-1.886 0.66-0.602 0.216-1.208 0.414-1.802 0.66-0.598 0.248-1.17 0.54-1.754 0.814-0.598 0.282-1.202 0.546-1.788 0.86-0.578 0.312-1.13 0.664-1.694 1-0.552 0.332-1.116 0.644-1.654 1.006-0.67 0.448-1.3 0.942-1.942 1.426-0.394 0.302-0.806 0.576-1.196 0.894-1.046 0.858-2.052 1.768-3.008 2.726l-124.398 124.39c-15.622 15.62-15.618 40.948 0.002 56.57 15.622 15.62 40.95 15.62 56.568 0l56.164-56.166v439.426c0 22.094 17.912 40 40.002 40 22.092 0 40-17.91 40-40v-441.202l57.942 57.942c15.622 15.624 40.948 15.62 56.568 0 15.626-15.618 15.626-40.946 0.002-56.566z"
+              d="M959.688 920.068l0.31-176c0.040-22.094-17.84-40.032-39.93-40.070-22.092-0.040-40.032 17.838-40.070 39.93l-0.142 79.672-235.734-235.732c-15.622-15.622-40.948-15.622-56.57 0s-15.622 40.948 0 56.568l235.442 235.442-78.946-0.1c-22.092-0.028-40.022 17.86-40.050 39.952-0.014 11.064 4.464 21.084 11.714 28.334 7.228 7.224 17.208 11.702 28.236 11.714l175.688 0.22c22.086 0.028 40.014-17.846 40.052-39.93zM920.178 64.228l-176-0.308c-22.094-0.040-40.032 17.84-40.070 39.93-0.040 22.092 17.838 40.032 39.93 40.070l79.672 0.14-235.732 235.734c-15.622 15.622-15.622 40.948 0 56.568s40.948 15.622 56.568 0l235.442-235.442-0.1 78.946c-0.028 22.092 17.86 40.022 39.952 40.050 11.064 0.014 21.084-4.464 28.334-11.714 7.224-7.228 11.702-17.208 11.714-28.236l0.22-175.688c0.026-22.082-17.846-40.010-39.93-40.050zM64.236 103.742l-0.308 176c-0.040 22.094 17.84 40.032 39.93 40.070 22.092 0.040 40.032-17.84 40.070-39.93l0.14-79.672 235.734 235.73c15.622 15.622 40.948 15.622 56.568 0s15.622-40.946 0-56.566l-235.442-235.442 78.946 0.098c22.092 0.028 40.022-17.86 40.050-39.95 0.014-11.066-4.464-21.086-11.714-28.336-7.228-7.222-17.208-11.7-28.236-11.714l-175.688-0.218c-22.084-0.026-40.012 17.844-40.050 39.93zM103.748 959.766l176 0.308c22.094 0.040 40.032-17.84 40.070-39.93 0.040-22.092-17.84-40.032-39.93-40.070l-79.672-0.14 235.73-235.734c15.622-15.622 15.622-40.948 0-56.568s-40.946-15.622-56.566 0l-235.442 235.442 0.098-78.946c0.028-22.092-17.86-40.022-39.95-40.050-11.066-0.014-21.086 4.464-28.336 11.714-7.222 7.228-11.7 17.208-11.714 28.236l-0.218 175.688c-0.026 22.082 17.844 40.010 39.93 40.050z"
             />
           </svg>
         </button>
diff --git a/lib/ui/src/components/preview/preview.js b/lib/ui/src/components/preview/preview.js
index 0f9c477d871..480a1a556a6 100644
--- a/lib/ui/src/components/preview/preview.js
+++ b/lib/ui/src/components/preview/preview.js
@@ -1,4 +1,3 @@
-import { window } from 'global';
 import React, { Component, Fragment } from 'react';
 import PropTypes from 'prop-types';
 import memoize from 'memoizerific';
@@ -6,7 +5,7 @@ import memoize from 'memoizerific';
 import { styled } from '@storybook/theming';
 import { SET_CURRENT_STORY } from '@storybook/core-events';
 import { types } from '@storybook/addons';
-import { Icons, IconButton, TabButton, TabBar, interleaveSeparators } from '@storybook/components';
+import { Icons, IconButton, TabButton, TabBar, Separator } from '@storybook/components';
 
 import Helmet from 'react-helmet-async';
 
@@ -78,33 +77,39 @@ const defaultWrappers = [
 ];
 
 const getTools = memoize(10)(
-  (getElements, panels, actions, options, storyId, viewMode, location, path, baseUrl) => {
+  (getElements, panels, actions, options, storyId, viewMode, location, path) => {
     const tools = getElementList(getElements, types.TOOL, [
       panels.filter(p => p.id !== 'canvas').length
         ? {
             render: () => (
-              <TabBar key="tabs" scroll={false}>
-                {panels.map((t, index) => {
-                  const to = t.route({ storyId, viewMode, path, location });
-                  const isActive = t.match({ storyId, viewMode, path, location });
-                  return (
-                    <S.UnstyledLink key={t.id || `l${index}`} to={to}>
-                      <TabButton active={isActive}>{t.title}</TabButton>
-                    </S.UnstyledLink>
-                  );
-                })}
-              </TabBar>
+              <Fragment>
+                <TabBar key="tabs" scroll={false}>
+                  {panels.map((t, index) => {
+                    const to = t.route({ storyId, viewMode, path, location });
+                    const isActive = t.match({ storyId, viewMode, path, location });
+                    return (
+                      <S.UnstyledLink key={t.id || `l${index}`} to={to}>
+                        <TabButton active={isActive}>{t.title}</TabButton>
+                      </S.UnstyledLink>
+                    );
+                  })}
+                </TabBar>
+                <Separator />
+              </Fragment>
             ),
           }
         : null,
       {
         match: p => p.viewMode === 'story',
         render: () => (
-          <ZoomConsumer>
-            {({ set, value }) => (
-              <Zoom key="zoom" current={value} set={v => set(value * v)} reset={() => set(1)} />
-            )}
-          </ZoomConsumer>
+          <Fragment>
+            <ZoomConsumer>
+              {({ set, value }) => (
+                <Zoom key="zoom" current={value} set={v => set(value * v)} reset={() => set(1)} />
+              )}
+            </ZoomConsumer>
+            <Separator />
+          </Fragment>
         ),
       },
       {
@@ -143,11 +148,11 @@ const getTools = memoize(10)(
         match: p => p.viewMode === 'story',
         render: () => (
           <IconButton
-            key="opener"
-            onClick={() => window.open(`${baseUrl}?id=${storyId}`)}
-            title="Open component in new tab"
+            key="full"
+            onClick={actions.toggleFullscreen}
+            title={options.isFullscreen ? 'Exit full screen' : 'Go full screen'}
           >
-            <Icons icon="share" />
+            <Icons icon={options.isFullscreen ? 'close' : 'expand'} />
           </IconButton>
         ),
       },
@@ -156,8 +161,22 @@ const getTools = memoize(10)(
     const filter = item =>
       item && (!item.match || item.match({ storyId, viewMode, location, path }));
 
-    const left = interleaveSeparators(tools.filter(filter));
-    const right = interleaveSeparators(extraTools.filter(filter));
+    const displayItems = list =>
+      list.reduce(
+        (acc, item, index) =>
+          item ? (
+            <Fragment key={item.id || item.key || `f-${index}`}>
+              {acc}
+              {item.render() || item}
+            </Fragment>
+          ) : (
+            acc
+          ),
+        null
+      );
+
+    const left = displayItems(tools.filter(filter));
+    const right = displayItems(extraTools.filter(filter));
 
     return { left, right };
   }
diff --git a/lib/ui/src/settings/__snapshots__/about.stories.storyshot b/lib/ui/src/settings/__snapshots__/about.stories.storyshot
index 813e83d8f1a..871c8913c45 100644
--- a/lib/ui/src/settings/__snapshots__/about.stories.storyshot
+++ b/lib/ui/src/settings/__snapshots__/about.stories.storyshot
@@ -413,14 +413,13 @@ exports[`Storyshots UI|Settings/AboutScreen failed to fetch new version 1`] = `
 >
   <div
     class="emotion-8"
-    title="bar"
+    title="flexbar"
   >
     <div
       class="emotion-7"
     >
       <div
         class="emotion-2"
-        title="side left"
       >
         <div
           class="emotion-1"
@@ -437,7 +436,6 @@ exports[`Storyshots UI|Settings/AboutScreen failed to fetch new version 1`] = `
       </div>
       <div
         class="emotion-6"
-        title="side right"
       >
         <button
           class="emotion-5"
@@ -1695,14 +1693,13 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
 >
   <div
     class="emotion-8"
-    title="bar"
+    title="flexbar"
   >
     <div
       class="emotion-7"
     >
       <div
         class="emotion-2"
-        title="side left"
       >
         <div
           class="emotion-1"
@@ -1719,7 +1716,6 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
       </div>
       <div
         class="emotion-6"
-        title="side right"
       >
         <button
           class="emotion-5"
@@ -2846,14 +2842,13 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
 >
   <div
     class="emotion-8"
-    title="bar"
+    title="flexbar"
   >
     <div
       class="emotion-7"
     >
       <div
         class="emotion-2"
-        title="side left"
       >
         <div
           class="emotion-1"
@@ -2870,7 +2865,6 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
       </div>
       <div
         class="emotion-6"
-        title="side right"
       >
         <button
           class="emotion-5"

From 748e4fcfd050d37f30d4419c35e2c0616a66d164 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Sat, 23 Feb 2019 15:06:27 +0800
Subject: [PATCH 072/249] Update changelog

---
 CHANGELOG.md | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index a0ca43dca6d..50db642b916 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -10,6 +10,11 @@
 * Addon-a11y: Fix story scrolling ([#5713](https://github.com/storybooks/storybook/pull/5713))
 * UI: Fix mobile styling ([#5709](https://github.com/storybooks/storybook/pull/5709))
 * UI: Fix tooltip bugs ([#5692](https://github.com/storybooks/storybook/pull/5692))
+* UI: Fix toolbar separators ([#5711](https://github.com/storybooks/storybook/pull/5711))
+
+### Maintenance
+
+* Typescript: migrate addon-backgrounds ([#5535](https://github.com/storybooks/storybook/pull/5535))
 
 ## 5.0.0-rc.4 (February 21, 2019)
 

From e62c5789b70ece1855d40a4df3beb0364d318ef2 Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Sat, 23 Feb 2019 16:40:14 +0800
Subject: [PATCH 073/249] Merge pull request #5730 from
 storybooks/shilman/fix-backgrounds-types

Fix typings for addon-backgrounds
---
 addons/backgrounds/src/index.ts | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/addons/backgrounds/src/index.ts b/addons/backgrounds/src/index.ts
index 7bccd015db8..de5cb59a21f 100644
--- a/addons/backgrounds/src/index.ts
+++ b/addons/backgrounds/src/index.ts
@@ -1,4 +1,4 @@
-import { addons, makeDecorator } from '@storybook/addons';
+import { addons, makeDecorator, StoryContext, StoryGetter, WrapperSettings } from '@storybook/addons';
 import deprecate from 'util-deprecate';
 
 import { REGISTER_SUBSCRIPTION } from '@storybook/core-events';
@@ -17,7 +17,7 @@ export const withBackgrounds = makeDecorator({
   parameterName: 'backgrounds',
   skipIfNoParametersOrOptions: true,
   allowDeprecatedUsage: true,
-  wrapper: (getStory, context, { options, parameters }) => {
+  wrapper: (getStory: StoryGetter, context: StoryContext, { options, parameters }: WrapperSettings) => {
     const data = parameters || options || [];
     const backgrounds = Array.isArray(data) ? data : Object.values(data);
 

From cf7abeeb6ad69f60876beef3170c45767d7fb87f Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Sat, 23 Feb 2019 16:42:11 +0800
Subject: [PATCH 074/249] Update changelog

---
 CHANGELOG.md | 1 +
 1 file changed, 1 insertion(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 50db642b916..03f72a1de6f 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -15,6 +15,7 @@
 ### Maintenance
 
 * Typescript: migrate addon-backgrounds ([#5535](https://github.com/storybooks/storybook/pull/5535))
+* Typescript: fix typings for addon-backgrounds ([#5730](https://github.com/storybooks/storybook/pull/5730))
 
 ## 5.0.0-rc.4 (February 21, 2019)
 

From 3982959868bdb75696444a25494aa73e9847b413 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Sat, 23 Feb 2019 16:52:39 +0800
Subject: [PATCH 075/249] v5.0.0-rc.5

---
 addons/a11y/package.json                      | 12 ++---
 addons/actions/package.json                   | 10 ++--
 addons/backgrounds/package.json               | 12 ++---
 addons/centered/package.json                  |  2 +-
 addons/cssresources/package.json              | 10 ++--
 addons/events/package.json                    |  8 +--
 addons/google-analytics/package.json          |  6 +--
 addons/graphql/package.json                   |  2 +-
 addons/info/package.json                      | 10 ++--
 addons/jest/package.json                      | 10 ++--
 addons/knobs/package.json                     | 10 ++--
 addons/links/package.json                     |  6 +--
 addons/notes/package.json                     | 12 ++---
 addons/ondevice-backgrounds/package.json      |  4 +-
 addons/ondevice-knobs/package.json            |  4 +-
 addons/ondevice-notes/package.json            |  4 +-
 addons/options/package.json                   |  4 +-
 .../storyshots/storyshots-core/package.json   |  4 +-
 .../storyshots-puppeteer/package.json         |  6 +--
 addons/storysource/package.json               | 10 ++--
 addons/viewport/package.json                  | 12 ++---
 app/angular/package.json                      |  6 +--
 app/ember/package.json                        |  4 +-
 app/html/package.json                         |  4 +-
 app/marko/package.json                        |  4 +-
 app/mithril/package.json                      |  4 +-
 app/polymer/package.json                      |  4 +-
 app/preact/package.json                       |  4 +-
 app/react-native/package.json                 | 14 ++---
 app/react/package.json                        |  8 +--
 app/riot/package.json                         |  4 +-
 app/svelte/package.json                       |  4 +-
 app/vue/package.json                          |  4 +-
 examples/angular-cli/package.json             | 26 ++++-----
 examples/cra-kitchen-sink/package.json        | 32 +++++------
 examples/cra-ts-kitchen-sink/package.json     | 12 ++---
 examples/ember-cli/package.json               | 26 ++++-----
 examples/html-kitchen-sink/package.json       | 36 ++++++-------
 examples/marko-cli/package.json               | 14 ++---
 examples/mithril-kitchen-sink/package.json    | 26 ++++-----
 examples/official-storybook/package.json      | 48 ++++++++---------
 examples/polymer-cli/package.json             | 20 +++----
 examples/preact-kitchen-sink/package.json     | 26 ++++-----
 examples/riot-kitchen-sink/package.json       | 26 ++++-----
 examples/svelte-kitchen-sink/package.json     | 26 ++++-----
 examples/vue-kitchen-sink/package.json        | 26 ++++-----
 lerna.json                                    |  2 +-
 lib/addons/package.json                       |  6 +--
 lib/channel-postmessage/package.json          |  6 +--
 lib/channel-websocket/package.json            |  4 +-
 lib/channels/package.json                     |  2 +-
 lib/cli/package.json                          | 54 +++++++++----------
 lib/client-api/package.json                   | 10 ++--
 lib/client-logger/package.json                |  2 +-
 lib/codemod/package.json                      |  2 +-
 lib/components/package.json                   | 12 ++---
 lib/core-events/package.json                  |  2 +-
 lib/core/package.json                         | 20 +++----
 lib/node-logger/package.json                  |  2 +-
 lib/router/package.json                       |  4 +-
 lib/theming/package.json                      |  4 +-
 lib/ui/package.json                           | 14 ++---
 62 files changed, 356 insertions(+), 356 deletions(-)

diff --git a/addons/a11y/package.json b/addons/a11y/package.json
index 5c458abfc6f..70987fec8b7 100644
--- a/addons/a11y/package.json
+++ b/addons/a11y/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-a11y",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "a11y addon for storybook",
   "keywords": [
     "a11y",
@@ -25,11 +25,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.4",
-    "@storybook/client-logger": "5.0.0-rc.4",
-    "@storybook/components": "5.0.0-rc.4",
-    "@storybook/core-events": "5.0.0-rc.4",
-    "@storybook/theming": "5.0.0-rc.4",
+    "@storybook/addons": "5.0.0-rc.5",
+    "@storybook/client-logger": "5.0.0-rc.5",
+    "@storybook/components": "5.0.0-rc.5",
+    "@storybook/core-events": "5.0.0-rc.5",
+    "@storybook/theming": "5.0.0-rc.5",
     "axe-core": "^3.1.2",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
diff --git a/addons/actions/package.json b/addons/actions/package.json
index 20a55a7af26..dc313c645ba 100644
--- a/addons/actions/package.json
+++ b/addons/actions/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-actions",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "Action Logger addon for storybook",
   "keywords": [
     "storybook"
@@ -20,10 +20,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.4",
-    "@storybook/components": "5.0.0-rc.4",
-    "@storybook/core-events": "5.0.0-rc.4",
-    "@storybook/theming": "5.0.0-rc.4",
+    "@storybook/addons": "5.0.0-rc.5",
+    "@storybook/components": "5.0.0-rc.5",
+    "@storybook/core-events": "5.0.0-rc.5",
+    "@storybook/theming": "5.0.0-rc.5",
     "core-js": "^2.6.2",
     "fast-deep-equal": "^2.0.1",
     "global": "^4.3.2",
diff --git a/addons/backgrounds/package.json b/addons/backgrounds/package.json
index dcb89bca0ff..d5fa51225e9 100644
--- a/addons/backgrounds/package.json
+++ b/addons/backgrounds/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-backgrounds",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "A storybook addon to show different backgrounds for your preview",
   "keywords": [
     "addon",
@@ -24,11 +24,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.4",
-    "@storybook/client-logger": "5.0.0-rc.4",
-    "@storybook/components": "5.0.0-rc.4",
-    "@storybook/core-events": "5.0.0-rc.4",
-    "@storybook/theming": "5.0.0-rc.4",
+    "@storybook/addons": "5.0.0-rc.5",
+    "@storybook/client-logger": "5.0.0-rc.5",
+    "@storybook/components": "5.0.0-rc.5",
+    "@storybook/core-events": "5.0.0-rc.5",
+    "@storybook/theming": "5.0.0-rc.5",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
diff --git a/addons/centered/package.json b/addons/centered/package.json
index e44a427696c..099445e57ca 100644
--- a/addons/centered/package.json
+++ b/addons/centered/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-centered",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "Storybook decorator to center components",
   "keywords": [
     "addon",
diff --git a/addons/cssresources/package.json b/addons/cssresources/package.json
index c9e10352007..20d018c144c 100644
--- a/addons/cssresources/package.json
+++ b/addons/cssresources/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-cssresources",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "A storybook addon to switch between css resources at runtime for your story",
   "keywords": [
     "addon",
@@ -24,10 +24,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.4",
-    "@storybook/channels": "5.0.0-rc.4",
-    "@storybook/components": "5.0.0-rc.4",
-    "@storybook/core-events": "5.0.0-rc.4",
+    "@storybook/addons": "5.0.0-rc.5",
+    "@storybook/channels": "5.0.0-rc.5",
+    "@storybook/components": "5.0.0-rc.5",
+    "@storybook/core-events": "5.0.0-rc.5",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "prop-types": "^15.6.2",
diff --git a/addons/events/package.json b/addons/events/package.json
index f9673d76247..3ccd42d74a6 100644
--- a/addons/events/package.json
+++ b/addons/events/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-events",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "Add events to your Storybook stories.",
   "keywords": [
     "addon",
@@ -23,9 +23,9 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.4",
-    "@storybook/core-events": "5.0.0-rc.4",
-    "@storybook/theming": "5.0.0-rc.4",
+    "@storybook/addons": "5.0.0-rc.5",
+    "@storybook/core-events": "5.0.0-rc.5",
+    "@storybook/theming": "5.0.0-rc.5",
     "core-js": "^2.6.2",
     "format-json": "^1.0.3",
     "prop-types": "^15.6.2",
diff --git a/addons/google-analytics/package.json b/addons/google-analytics/package.json
index 88734626283..45d67fe3f14 100644
--- a/addons/google-analytics/package.json
+++ b/addons/google-analytics/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-google-analytics",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "Storybook addon for google analytics",
   "keywords": [
     "addon",
@@ -19,8 +19,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.4",
-    "@storybook/core-events": "5.0.0-rc.4",
+    "@storybook/addons": "5.0.0-rc.5",
+    "@storybook/core-events": "5.0.0-rc.5",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "react-ga": "^2.5.3"
diff --git a/addons/graphql/package.json b/addons/graphql/package.json
index 771effc8c44..55648a3e6cc 100644
--- a/addons/graphql/package.json
+++ b/addons/graphql/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-graphql",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "Storybook addon to display the GraphiQL IDE",
   "keywords": [
     "addon",
diff --git a/addons/info/package.json b/addons/info/package.json
index 03a942155cc..8a061330a3d 100644
--- a/addons/info/package.json
+++ b/addons/info/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-info",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "A Storybook addon to show additional information for your stories.",
   "keywords": [
     "addon",
@@ -21,10 +21,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.4",
-    "@storybook/client-logger": "5.0.0-rc.4",
-    "@storybook/components": "5.0.0-rc.4",
-    "@storybook/theming": "5.0.0-rc.4",
+    "@storybook/addons": "5.0.0-rc.5",
+    "@storybook/client-logger": "5.0.0-rc.5",
+    "@storybook/components": "5.0.0-rc.5",
+    "@storybook/theming": "5.0.0-rc.5",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "marksy": "^6.1.0",
diff --git a/addons/jest/package.json b/addons/jest/package.json
index f022be6e841..56155ea43bd 100644
--- a/addons/jest/package.json
+++ b/addons/jest/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-jest",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "React storybook addon that show component jest report",
   "keywords": [
     "addon",
@@ -27,10 +27,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.4",
-    "@storybook/components": "5.0.0-rc.4",
-    "@storybook/core-events": "5.0.0-rc.4",
-    "@storybook/theming": "5.0.0-rc.4",
+    "@storybook/addons": "5.0.0-rc.5",
+    "@storybook/components": "5.0.0-rc.5",
+    "@storybook/core-events": "5.0.0-rc.5",
+    "@storybook/theming": "5.0.0-rc.5",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "prop-types": "^15.6.2",
diff --git a/addons/knobs/package.json b/addons/knobs/package.json
index d2c4d40fea5..30f8f323ea4 100644
--- a/addons/knobs/package.json
+++ b/addons/knobs/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-knobs",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "Storybook Addon Prop Editor Component",
   "keywords": [
     "addon",
@@ -21,10 +21,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.4",
-    "@storybook/components": "5.0.0-rc.4",
-    "@storybook/core-events": "5.0.0-rc.4",
-    "@storybook/theming": "5.0.0-rc.4",
+    "@storybook/addons": "5.0.0-rc.5",
+    "@storybook/components": "5.0.0-rc.5",
+    "@storybook/core-events": "5.0.0-rc.5",
+    "@storybook/theming": "5.0.0-rc.5",
     "copy-to-clipboard": "^3.0.8",
     "core-js": "^2.6.2",
     "escape-html": "^1.0.3",
diff --git a/addons/links/package.json b/addons/links/package.json
index 341e8aa542a..bd8b72829cd 100644
--- a/addons/links/package.json
+++ b/addons/links/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-links",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "Story Links addon for storybook",
   "keywords": [
     "addon",
@@ -21,8 +21,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.4",
-    "@storybook/core-events": "5.0.0-rc.4",
+    "@storybook/addons": "5.0.0-rc.5",
+    "@storybook/core-events": "5.0.0-rc.5",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/addons/notes/package.json b/addons/notes/package.json
index c3cb4597c34..e991165371a 100644
--- a/addons/notes/package.json
+++ b/addons/notes/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-notes",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "Write notes for your Storybook stories.",
   "keywords": [
     "addon",
@@ -22,11 +22,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.4",
-    "@storybook/client-logger": "5.0.0-rc.4",
-    "@storybook/components": "5.0.0-rc.4",
-    "@storybook/core-events": "5.0.0-rc.4",
-    "@storybook/theming": "5.0.0-rc.4",
+    "@storybook/addons": "5.0.0-rc.5",
+    "@storybook/client-logger": "5.0.0-rc.5",
+    "@storybook/components": "5.0.0-rc.5",
+    "@storybook/core-events": "5.0.0-rc.5",
+    "@storybook/theming": "5.0.0-rc.5",
     "markdown-to-jsx": "^6.9.1",
     "prop-types": "^15.6.2",
     "util-deprecate": "^1.0.2"
diff --git a/addons/ondevice-backgrounds/package.json b/addons/ondevice-backgrounds/package.json
index 909f69039dd..3f5593d7000 100644
--- a/addons/ondevice-backgrounds/package.json
+++ b/addons/ondevice-backgrounds/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/addon-ondevice-backgrounds",
   "private": true,
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "A storybook addon to show different backgrounds for your preview",
   "keywords": [
     "addon",
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.4",
+    "@storybook/addons": "5.0.0-rc.5",
     "core-js": "^2.6.2",
     "prop-types": "^15.6.2"
   },
diff --git a/addons/ondevice-knobs/package.json b/addons/ondevice-knobs/package.json
index 4e9e1173c29..47b1b958602 100644
--- a/addons/ondevice-knobs/package.json
+++ b/addons/ondevice-knobs/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/addon-ondevice-knobs",
   "private": true,
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "Display storybook story knobs on your deviced.",
   "keywords": [
     "addon",
@@ -21,7 +21,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.4",
+    "@storybook/addons": "5.0.0-rc.5",
     "core-js": "^2.6.2",
     "deep-equal": "^1.0.1",
     "prop-types": "^15.6.2",
diff --git a/addons/ondevice-notes/package.json b/addons/ondevice-notes/package.json
index 0167b39e5f8..c396fd40920 100644
--- a/addons/ondevice-notes/package.json
+++ b/addons/ondevice-notes/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/addon-ondevice-notes",
   "private": true,
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "Write notes for your Storybook stories.",
   "keywords": [
     "addon",
@@ -19,7 +19,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.4",
+    "@storybook/addons": "5.0.0-rc.5",
     "core-js": "^2.6.2",
     "prop-types": "^15.6.2",
     "react-native-simple-markdown": "^1.1.0"
diff --git a/addons/options/package.json b/addons/options/package.json
index bdbbc85969f..3ca1ebd53a3 100644
--- a/addons/options/package.json
+++ b/addons/options/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-options",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "Options addon for storybook",
   "keywords": [
     "addon",
@@ -20,7 +20,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.4",
+    "@storybook/addons": "5.0.0-rc.5",
     "core-js": "^2.6.2",
     "util-deprecate": "^1.0.2"
   },
diff --git a/addons/storyshots/storyshots-core/package.json b/addons/storyshots/storyshots-core/package.json
index f90f2a939b2..2b5d8ea33d3 100644
--- a/addons/storyshots/storyshots-core/package.json
+++ b/addons/storyshots/storyshots-core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storyshots",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "StoryShots is a Jest Snapshot Testing Addon for Storybook.",
   "keywords": [
     "addon",
@@ -24,7 +24,7 @@
     "storybook": "start-storybook -p 6006"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.4",
+    "@storybook/addons": "5.0.0-rc.5",
     "core-js": "^2.6.2",
     "glob": "^7.1.3",
     "global": "^4.3.2",
diff --git a/addons/storyshots/storyshots-puppeteer/package.json b/addons/storyshots/storyshots-puppeteer/package.json
index 4a731f0c0de..63a4362a275 100644
--- a/addons/storyshots/storyshots-puppeteer/package.json
+++ b/addons/storyshots/storyshots-puppeteer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storyshots-puppeteer",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "Image snappshots addition to StoryShots base on puppeteer",
   "keywords": [
     "addon",
@@ -21,8 +21,8 @@
     "prepare": "node ../../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/node-logger": "5.0.0-rc.4",
-    "@storybook/router": "5.0.0-rc.4",
+    "@storybook/node-logger": "5.0.0-rc.5",
+    "@storybook/router": "5.0.0-rc.5",
     "core-js": "^2.6.2",
     "jest-image-snapshot": "^2.6.0",
     "puppeteer": "^1.12.0",
diff --git a/addons/storysource/package.json b/addons/storysource/package.json
index 81568756081..58ed1940003 100644
--- a/addons/storysource/package.json
+++ b/addons/storysource/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storysource",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "Stories addon for storybook",
   "keywords": [
     "addon",
@@ -21,10 +21,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.4",
-    "@storybook/components": "5.0.0-rc.4",
-    "@storybook/router": "5.0.0-rc.4",
-    "@storybook/theming": "5.0.0-rc.4",
+    "@storybook/addons": "5.0.0-rc.5",
+    "@storybook/components": "5.0.0-rc.5",
+    "@storybook/router": "5.0.0-rc.5",
+    "@storybook/theming": "5.0.0-rc.5",
     "core-js": "^2.6.2",
     "estraverse": "^4.2.0",
     "loader-utils": "^1.2.1",
diff --git a/addons/viewport/package.json b/addons/viewport/package.json
index 83b0716a667..697333802c1 100644
--- a/addons/viewport/package.json
+++ b/addons/viewport/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-viewport",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "Storybook addon to change the viewport size to mobile",
   "keywords": [
     "addon",
@@ -20,11 +20,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.4",
-    "@storybook/client-logger": "5.0.0-rc.4",
-    "@storybook/components": "5.0.0-rc.4",
-    "@storybook/core-events": "5.0.0-rc.4",
-    "@storybook/theming": "5.0.0-rc.4",
+    "@storybook/addons": "5.0.0-rc.5",
+    "@storybook/client-logger": "5.0.0-rc.5",
+    "@storybook/components": "5.0.0-rc.5",
+    "@storybook/core-events": "5.0.0-rc.5",
+    "@storybook/theming": "5.0.0-rc.5",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
diff --git a/app/angular/package.json b/app/angular/package.json
index 9e837b23df4..cc0a7d38b91 100644
--- a/app/angular/package.json
+++ b/app/angular/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/angular",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "Storybook for Angular: Develop Angular Components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,8 +25,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.4",
-    "@storybook/node-logger": "5.0.0-rc.4",
+    "@storybook/core": "5.0.0-rc.5",
+    "@storybook/node-logger": "5.0.0-rc.5",
     "angular2-template-loader": "^0.6.2",
     "core-js": "^2.6.2",
     "fork-ts-checker-webpack-plugin": "^0.5.2",
diff --git a/app/ember/package.json b/app/ember/package.json
index 98b98590b4c..ffc666185d4 100644
--- a/app/ember/package.json
+++ b/app/ember/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/ember",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "Storybook for Ember: Develop Ember Component in isolation with Hot Reloading.",
   "homepage": "https://github.com/storybooks/storybook/tree/master/app/ember",
   "bugs": {
@@ -23,7 +23,7 @@
   },
   "dependencies": {
     "@ember/test-helpers": "^1.3.1",
-    "@storybook/core": "5.0.0-rc.4",
+    "@storybook/core": "5.0.0-rc.5",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/html/package.json b/app/html/package.json
index ef817d21684..9dab02ce3f8 100644
--- a/app/html/package.json
+++ b/app/html/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/html",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "Storybook for HTML: View HTML snippets in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.4",
+    "@storybook/core": "5.0.0-rc.5",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/marko/package.json b/app/marko/package.json
index 666234b2bfa..d50cb6f6dfa 100644
--- a/app/marko/package.json
+++ b/app/marko/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/marko",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "Storybook for Marko: Develop Marko Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.4",
+    "@storybook/core": "5.0.0-rc.5",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/mithril/package.json b/app/mithril/package.json
index a4cff431bbe..296359c4edb 100644
--- a/app/mithril/package.json
+++ b/app/mithril/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/mithril",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "Storybook for Mithril: Develop Mithril Component in isolation.",
   "keywords": [
     "storybook"
@@ -26,7 +26,7 @@
   },
   "dependencies": {
     "@babel/plugin-transform-react-jsx": "^7.3.0",
-    "@storybook/core": "5.0.0-rc.4",
+    "@storybook/core": "5.0.0-rc.5",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/polymer/package.json b/app/polymer/package.json
index e6a4d73b216..d047703c716 100644
--- a/app/polymer/package.json
+++ b/app/polymer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/polymer",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "Storybook for Polymer: Develop Polymer components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.4",
+    "@storybook/core": "5.0.0-rc.5",
     "@webcomponents/webcomponentsjs": "^1.2.0",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
diff --git a/app/preact/package.json b/app/preact/package.json
index b610ef17a71..8df40a91301 100644
--- a/app/preact/package.json
+++ b/app/preact/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/preact",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "Storybook for Preact: Develop Preact Component in isolation.",
   "keywords": [
     "storybook"
@@ -26,7 +26,7 @@
   },
   "dependencies": {
     "@babel/plugin-transform-react-jsx": "^7.3.0",
-    "@storybook/core": "5.0.0-rc.4",
+    "@storybook/core": "5.0.0-rc.5",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/react-native/package.json b/app/react-native/package.json
index 7416b9511d2..51954dd388b 100644
--- a/app/react-native/package.json
+++ b/app/react-native/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/react-native",
   "private": true,
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "A better way to develop React Native Components for your app",
   "keywords": [
     "react",
@@ -26,12 +26,12 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.4",
-    "@storybook/channel-websocket": "5.0.0-rc.4",
-    "@storybook/channels": "5.0.0-rc.4",
-    "@storybook/core": "5.0.0-rc.4",
-    "@storybook/core-events": "5.0.0-rc.4",
-    "@storybook/ui": "5.0.0-rc.4",
+    "@storybook/addons": "5.0.0-rc.5",
+    "@storybook/channel-websocket": "5.0.0-rc.5",
+    "@storybook/channels": "5.0.0-rc.5",
+    "@storybook/core": "5.0.0-rc.5",
+    "@storybook/core-events": "5.0.0-rc.5",
+    "@storybook/ui": "5.0.0-rc.5",
     "babel-loader": "^8.0.4",
     "babel-plugin-macros": "^2.4.5",
     "babel-plugin-syntax-async-functions": "^6.13.0",
diff --git a/app/react/package.json b/app/react/package.json
index dcd5902086c..60af615c4d0 100644
--- a/app/react/package.json
+++ b/app/react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/react",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "Storybook for React: Develop React Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -28,9 +28,9 @@
     "@babel/plugin-transform-react-constant-elements": "^7.2.0",
     "@babel/preset-flow": "^7.0.0",
     "@babel/preset-react": "^7.0.0",
-    "@storybook/core": "5.0.0-rc.4",
-    "@storybook/node-logger": "5.0.0-rc.4",
-    "@storybook/theming": "5.0.0-rc.4",
+    "@storybook/core": "5.0.0-rc.5",
+    "@storybook/node-logger": "5.0.0-rc.5",
+    "@storybook/theming": "5.0.0-rc.5",
     "@svgr/webpack": "^4.0.3",
     "babel-plugin-named-asset-import": "^0.3.0",
     "babel-plugin-react-docgen": "^2.0.2",
diff --git a/app/riot/package.json b/app/riot/package.json
index 5a8c1cbdfa7..0fb03db5065 100644
--- a/app/riot/package.json
+++ b/app/riot/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/riot",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "Storybook for riot.js: View riot snippets in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.4",
+    "@storybook/core": "5.0.0-rc.5",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/svelte/package.json b/app/svelte/package.json
index 18e0163b3a1..0f61c5aa246 100644
--- a/app/svelte/package.json
+++ b/app/svelte/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/svelte",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "Storybook for Svelte: Develop Svelte Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.4",
+    "@storybook/core": "5.0.0-rc.5",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/vue/package.json b/app/vue/package.json
index e98ee0711a4..0d0c94001e3 100644
--- a/app/vue/package.json
+++ b/app/vue/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/vue",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "Storybook for Vue: Develop Vue Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.4",
+    "@storybook/core": "5.0.0-rc.5",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/examples/angular-cli/package.json b/examples/angular-cli/package.json
index ec08b87f381..9c918561309 100644
--- a/examples/angular-cli/package.json
+++ b/examples/angular-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "angular-cli",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "private": true,
   "license": "MIT",
   "scripts": {
@@ -33,18 +33,18 @@
     "@angular-devkit/build-angular": "^0.11.4",
     "@angular/cli": "^7.3.0",
     "@angular/compiler-cli": "^7.2.1",
-    "@storybook/addon-actions": "5.0.0-rc.4",
-    "@storybook/addon-backgrounds": "5.0.0-rc.4",
-    "@storybook/addon-centered": "5.0.0-rc.4",
-    "@storybook/addon-jest": "5.0.0-rc.4",
-    "@storybook/addon-knobs": "5.0.0-rc.4",
-    "@storybook/addon-links": "5.0.0-rc.4",
-    "@storybook/addon-notes": "5.0.0-rc.4",
-    "@storybook/addon-options": "5.0.0-rc.4",
-    "@storybook/addon-storyshots": "5.0.0-rc.4",
-    "@storybook/addon-storysource": "5.0.0-rc.4",
-    "@storybook/addons": "5.0.0-rc.4",
-    "@storybook/angular": "5.0.0-rc.4",
+    "@storybook/addon-actions": "5.0.0-rc.5",
+    "@storybook/addon-backgrounds": "5.0.0-rc.5",
+    "@storybook/addon-centered": "5.0.0-rc.5",
+    "@storybook/addon-jest": "5.0.0-rc.5",
+    "@storybook/addon-knobs": "5.0.0-rc.5",
+    "@storybook/addon-links": "5.0.0-rc.5",
+    "@storybook/addon-notes": "5.0.0-rc.5",
+    "@storybook/addon-options": "5.0.0-rc.5",
+    "@storybook/addon-storyshots": "5.0.0-rc.5",
+    "@storybook/addon-storysource": "5.0.0-rc.5",
+    "@storybook/addons": "5.0.0-rc.5",
+    "@storybook/angular": "5.0.0-rc.5",
     "@types/core-js": "^2.5.0",
     "@types/jest": "^23.3.13",
     "@types/node": "~10.12.19",
diff --git a/examples/cra-kitchen-sink/package.json b/examples/cra-kitchen-sink/package.json
index 86744fae540..a9b422ac0cc 100644
--- a/examples/cra-kitchen-sink/package.json
+++ b/examples/cra-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "cra-kitchen-sink",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "private": true,
   "scripts": {
     "build": "react-scripts build",
@@ -18,21 +18,21 @@
     "react-lifecycles-compat": "^3.0.4"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.0.0-rc.4",
-    "@storybook/addon-actions": "5.0.0-rc.4",
-    "@storybook/addon-backgrounds": "5.0.0-rc.4",
-    "@storybook/addon-centered": "5.0.0-rc.4",
-    "@storybook/addon-events": "5.0.0-rc.4",
-    "@storybook/addon-info": "5.0.0-rc.4",
-    "@storybook/addon-jest": "5.0.0-rc.4",
-    "@storybook/addon-knobs": "5.0.0-rc.4",
-    "@storybook/addon-links": "5.0.0-rc.4",
-    "@storybook/addon-notes": "5.0.0-rc.4",
-    "@storybook/addon-options": "5.0.0-rc.4",
-    "@storybook/addon-storyshots": "5.0.0-rc.4",
-    "@storybook/addons": "5.0.0-rc.4",
-    "@storybook/client-logger": "5.0.0-rc.4",
-    "@storybook/react": "5.0.0-rc.4",
+    "@storybook/addon-a11y": "5.0.0-rc.5",
+    "@storybook/addon-actions": "5.0.0-rc.5",
+    "@storybook/addon-backgrounds": "5.0.0-rc.5",
+    "@storybook/addon-centered": "5.0.0-rc.5",
+    "@storybook/addon-events": "5.0.0-rc.5",
+    "@storybook/addon-info": "5.0.0-rc.5",
+    "@storybook/addon-jest": "5.0.0-rc.5",
+    "@storybook/addon-knobs": "5.0.0-rc.5",
+    "@storybook/addon-links": "5.0.0-rc.5",
+    "@storybook/addon-notes": "5.0.0-rc.5",
+    "@storybook/addon-options": "5.0.0-rc.5",
+    "@storybook/addon-storyshots": "5.0.0-rc.5",
+    "@storybook/addons": "5.0.0-rc.5",
+    "@storybook/client-logger": "5.0.0-rc.5",
+    "@storybook/react": "5.0.0-rc.5",
     "enzyme": "^3.7.0",
     "enzyme-adapter-react-16": "^1.9.1",
     "enzyme-to-json": "^3.3.4",
diff --git a/examples/cra-ts-kitchen-sink/package.json b/examples/cra-ts-kitchen-sink/package.json
index cca7a263773..2d2dec176e0 100644
--- a/examples/cra-ts-kitchen-sink/package.json
+++ b/examples/cra-ts-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "cra-ts-kitchen-sink",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook -s public",
@@ -19,11 +19,11 @@
     "react-dom": "^16.8.1"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.4",
-    "@storybook/addon-info": "5.0.0-rc.4",
-    "@storybook/addon-options": "5.0.0-rc.4",
-    "@storybook/addons": "5.0.0-rc.4",
-    "@storybook/react": "5.0.0-rc.4",
+    "@storybook/addon-actions": "5.0.0-rc.5",
+    "@storybook/addon-info": "5.0.0-rc.5",
+    "@storybook/addon-options": "5.0.0-rc.5",
+    "@storybook/addons": "5.0.0-rc.5",
+    "@storybook/react": "5.0.0-rc.5",
     "@types/enzyme": "^3.1.15",
     "@types/react": "^16.7.22",
     "@types/react-dom": "^16.0.11",
diff --git a/examples/ember-cli/package.json b/examples/ember-cli/package.json
index 74f3c5a7728..edd675900d1 100644
--- a/examples/ember-cli/package.json
+++ b/examples/ember-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "ember-example",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "private": true,
   "scripts": {
     "build": "ember build",
@@ -14,18 +14,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.2.2",
-    "@storybook/addon-a11y": "5.0.0-rc.4",
-    "@storybook/addon-actions": "5.0.0-rc.4",
-    "@storybook/addon-backgrounds": "5.0.0-rc.4",
-    "@storybook/addon-centered": "5.0.0-rc.4",
-    "@storybook/addon-knobs": "5.0.0-rc.4",
-    "@storybook/addon-links": "5.0.0-rc.4",
-    "@storybook/addon-notes": "5.0.0-rc.4",
-    "@storybook/addon-options": "5.0.0-rc.4",
-    "@storybook/addon-storysource": "5.0.0-rc.4",
-    "@storybook/addon-viewport": "5.0.0-rc.4",
-    "@storybook/addons": "5.0.0-rc.4",
-    "@storybook/ember": "5.0.0-rc.4",
+    "@storybook/addon-a11y": "5.0.0-rc.5",
+    "@storybook/addon-actions": "5.0.0-rc.5",
+    "@storybook/addon-backgrounds": "5.0.0-rc.5",
+    "@storybook/addon-centered": "5.0.0-rc.5",
+    "@storybook/addon-knobs": "5.0.0-rc.5",
+    "@storybook/addon-links": "5.0.0-rc.5",
+    "@storybook/addon-notes": "5.0.0-rc.5",
+    "@storybook/addon-options": "5.0.0-rc.5",
+    "@storybook/addon-storysource": "5.0.0-rc.5",
+    "@storybook/addon-viewport": "5.0.0-rc.5",
+    "@storybook/addons": "5.0.0-rc.5",
+    "@storybook/ember": "5.0.0-rc.5",
     "babel-loader": "^8",
     "broccoli-asset-rev": "^3.0.0",
     "cross-env": "^5.2.0",
diff --git a/examples/html-kitchen-sink/package.json b/examples/html-kitchen-sink/package.json
index 36240f02ed0..86d8610eeee 100644
--- a/examples/html-kitchen-sink/package.json
+++ b/examples/html-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "html-kitchen-sink",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "private": true,
   "description": "",
   "keywords": [],
@@ -13,23 +13,23 @@
     "storybook": "start-storybook -p 9006"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.0.0-rc.4",
-    "@storybook/addon-actions": "5.0.0-rc.4",
-    "@storybook/addon-backgrounds": "5.0.0-rc.4",
-    "@storybook/addon-centered": "5.0.0-rc.4",
-    "@storybook/addon-events": "5.0.0-rc.4",
-    "@storybook/addon-jest": "5.0.0-rc.4",
-    "@storybook/addon-knobs": "5.0.0-rc.4",
-    "@storybook/addon-links": "5.0.0-rc.4",
-    "@storybook/addon-notes": "5.0.0-rc.4",
-    "@storybook/addon-options": "5.0.0-rc.4",
-    "@storybook/addon-storyshots": "5.0.0-rc.4",
-    "@storybook/addon-storysource": "5.0.0-rc.4",
-    "@storybook/addon-viewport": "5.0.0-rc.4",
-    "@storybook/addons": "5.0.0-rc.4",
-    "@storybook/core": "5.0.0-rc.4",
-    "@storybook/core-events": "5.0.0-rc.4",
-    "@storybook/html": "5.0.0-rc.4",
+    "@storybook/addon-a11y": "5.0.0-rc.5",
+    "@storybook/addon-actions": "5.0.0-rc.5",
+    "@storybook/addon-backgrounds": "5.0.0-rc.5",
+    "@storybook/addon-centered": "5.0.0-rc.5",
+    "@storybook/addon-events": "5.0.0-rc.5",
+    "@storybook/addon-jest": "5.0.0-rc.5",
+    "@storybook/addon-knobs": "5.0.0-rc.5",
+    "@storybook/addon-links": "5.0.0-rc.5",
+    "@storybook/addon-notes": "5.0.0-rc.5",
+    "@storybook/addon-options": "5.0.0-rc.5",
+    "@storybook/addon-storyshots": "5.0.0-rc.5",
+    "@storybook/addon-storysource": "5.0.0-rc.5",
+    "@storybook/addon-viewport": "5.0.0-rc.5",
+    "@storybook/addons": "5.0.0-rc.5",
+    "@storybook/core": "5.0.0-rc.5",
+    "@storybook/core-events": "5.0.0-rc.5",
+    "@storybook/html": "5.0.0-rc.5",
     "eventemitter3": "^3.1.0",
     "format-json": "^1.0.3",
     "global": "^4.3.2",
diff --git a/examples/marko-cli/package.json b/examples/marko-cli/package.json
index 9bf5108bcaf..402eaab2d61 100644
--- a/examples/marko-cli/package.json
+++ b/examples/marko-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "marko-cli",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "private": true,
   "description": "Demo of how to build an app using marko-starter",
   "repository": {
@@ -22,12 +22,12 @@
     "marko-starter": "^2.0.4"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.4",
-    "@storybook/addon-knobs": "5.0.0-rc.4",
-    "@storybook/addon-options": "5.0.0-rc.4",
-    "@storybook/addon-storysource": "5.0.0-rc.4",
-    "@storybook/addons": "5.0.0-rc.4",
-    "@storybook/marko": "5.0.0-rc.4",
+    "@storybook/addon-actions": "5.0.0-rc.5",
+    "@storybook/addon-knobs": "5.0.0-rc.5",
+    "@storybook/addon-options": "5.0.0-rc.5",
+    "@storybook/addon-storysource": "5.0.0-rc.5",
+    "@storybook/addons": "5.0.0-rc.5",
+    "@storybook/marko": "5.0.0-rc.5",
     "prettier": "^1.16.4",
     "webpack": "^4.29.0"
   }
diff --git a/examples/mithril-kitchen-sink/package.json b/examples/mithril-kitchen-sink/package.json
index 4aa17d99435..b02352c1d2d 100644
--- a/examples/mithril-kitchen-sink/package.json
+++ b/examples/mithril-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "mithril-example",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook",
@@ -10,18 +10,18 @@
     "mithril": "^1.1.6"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.4",
-    "@storybook/addon-backgrounds": "5.0.0-rc.4",
-    "@storybook/addon-centered": "5.0.0-rc.4",
-    "@storybook/addon-knobs": "5.0.0-rc.4",
-    "@storybook/addon-links": "5.0.0-rc.4",
-    "@storybook/addon-notes": "5.0.0-rc.4",
-    "@storybook/addon-options": "5.0.0-rc.4",
-    "@storybook/addon-storyshots": "5.0.0-rc.4",
-    "@storybook/addon-storysource": "5.0.0-rc.4",
-    "@storybook/addon-viewport": "5.0.0-rc.4",
-    "@storybook/addons": "5.0.0-rc.4",
-    "@storybook/mithril": "5.0.0-rc.4",
+    "@storybook/addon-actions": "5.0.0-rc.5",
+    "@storybook/addon-backgrounds": "5.0.0-rc.5",
+    "@storybook/addon-centered": "5.0.0-rc.5",
+    "@storybook/addon-knobs": "5.0.0-rc.5",
+    "@storybook/addon-links": "5.0.0-rc.5",
+    "@storybook/addon-notes": "5.0.0-rc.5",
+    "@storybook/addon-options": "5.0.0-rc.5",
+    "@storybook/addon-storyshots": "5.0.0-rc.5",
+    "@storybook/addon-storysource": "5.0.0-rc.5",
+    "@storybook/addon-viewport": "5.0.0-rc.5",
+    "@storybook/addons": "5.0.0-rc.5",
+    "@storybook/mithril": "5.0.0-rc.5",
     "webpack": "^4.29.0"
   }
 }
diff --git a/examples/official-storybook/package.json b/examples/official-storybook/package.json
index 0643ca8f674..c3683f586cb 100644
--- a/examples/official-storybook/package.json
+++ b/examples/official-storybook/package.json
@@ -1,6 +1,6 @@
 {
   "name": "official-storybook",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook -c ./ -s built-storybooks",
@@ -12,29 +12,29 @@
     "storybook": "cross-env STORYBOOK_DISPLAY_WARNING=true DISPLAY_WARNING=true start-storybook -p 9011 -c ./ -s built-storybooks --no-dll"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.0.0-rc.4",
-    "@storybook/addon-actions": "5.0.0-rc.4",
-    "@storybook/addon-backgrounds": "5.0.0-rc.4",
-    "@storybook/addon-centered": "5.0.0-rc.4",
-    "@storybook/addon-cssresources": "5.0.0-rc.4",
-    "@storybook/addon-events": "5.0.0-rc.4",
-    "@storybook/addon-graphql": "5.0.0-rc.4",
-    "@storybook/addon-info": "5.0.0-rc.4",
-    "@storybook/addon-jest": "5.0.0-rc.4",
-    "@storybook/addon-knobs": "5.0.0-rc.4",
-    "@storybook/addon-links": "5.0.0-rc.4",
-    "@storybook/addon-notes": "5.0.0-rc.4",
-    "@storybook/addon-options": "5.0.0-rc.4",
-    "@storybook/addon-storyshots": "5.0.0-rc.4",
-    "@storybook/addon-storyshots-puppeteer": "5.0.0-rc.4",
-    "@storybook/addon-storysource": "5.0.0-rc.4",
-    "@storybook/addon-viewport": "5.0.0-rc.4",
-    "@storybook/addons": "5.0.0-rc.4",
-    "@storybook/components": "5.0.0-rc.4",
-    "@storybook/core-events": "5.0.0-rc.4",
-    "@storybook/node-logger": "5.0.0-rc.4",
-    "@storybook/react": "5.0.0-rc.4",
-    "@storybook/theming": "5.0.0-rc.4",
+    "@storybook/addon-a11y": "5.0.0-rc.5",
+    "@storybook/addon-actions": "5.0.0-rc.5",
+    "@storybook/addon-backgrounds": "5.0.0-rc.5",
+    "@storybook/addon-centered": "5.0.0-rc.5",
+    "@storybook/addon-cssresources": "5.0.0-rc.5",
+    "@storybook/addon-events": "5.0.0-rc.5",
+    "@storybook/addon-graphql": "5.0.0-rc.5",
+    "@storybook/addon-info": "5.0.0-rc.5",
+    "@storybook/addon-jest": "5.0.0-rc.5",
+    "@storybook/addon-knobs": "5.0.0-rc.5",
+    "@storybook/addon-links": "5.0.0-rc.5",
+    "@storybook/addon-notes": "5.0.0-rc.5",
+    "@storybook/addon-options": "5.0.0-rc.5",
+    "@storybook/addon-storyshots": "5.0.0-rc.5",
+    "@storybook/addon-storyshots-puppeteer": "5.0.0-rc.5",
+    "@storybook/addon-storysource": "5.0.0-rc.5",
+    "@storybook/addon-viewport": "5.0.0-rc.5",
+    "@storybook/addons": "5.0.0-rc.5",
+    "@storybook/components": "5.0.0-rc.5",
+    "@storybook/core-events": "5.0.0-rc.5",
+    "@storybook/node-logger": "5.0.0-rc.5",
+    "@storybook/react": "5.0.0-rc.5",
+    "@storybook/theming": "5.0.0-rc.5",
     "cors": "^2.8.4",
     "cross-env": "^5.2.0",
     "enzyme-to-json": "^3.3.4",
diff --git a/examples/polymer-cli/package.json b/examples/polymer-cli/package.json
index b52985b7eea..bd1d188e4c2 100644
--- a/examples/polymer-cli/package.json
+++ b/examples/polymer-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "polymer-cli",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook",
@@ -9,15 +9,15 @@
   },
   "dependencies": {
     "@polymer/polymer": "^2.6.0",
-    "@storybook/addon-actions": "5.0.0-rc.4",
-    "@storybook/addon-backgrounds": "5.0.0-rc.4",
-    "@storybook/addon-knobs": "5.0.0-rc.4",
-    "@storybook/addon-links": "5.0.0-rc.4",
-    "@storybook/addon-notes": "5.0.0-rc.4",
-    "@storybook/addon-options": "5.0.0-rc.4",
-    "@storybook/addon-storysource": "5.0.0-rc.4",
-    "@storybook/addon-viewport": "5.0.0-rc.4",
-    "@storybook/polymer": "5.0.0-rc.4",
+    "@storybook/addon-actions": "5.0.0-rc.5",
+    "@storybook/addon-backgrounds": "5.0.0-rc.5",
+    "@storybook/addon-knobs": "5.0.0-rc.5",
+    "@storybook/addon-links": "5.0.0-rc.5",
+    "@storybook/addon-notes": "5.0.0-rc.5",
+    "@storybook/addon-options": "5.0.0-rc.5",
+    "@storybook/addon-storysource": "5.0.0-rc.5",
+    "@storybook/addon-viewport": "5.0.0-rc.5",
+    "@storybook/polymer": "5.0.0-rc.5",
     "@webcomponents/webcomponentsjs": "^1.2.0",
     "global": "^4.3.2",
     "lit-html": "^1.0.0",
diff --git a/examples/preact-kitchen-sink/package.json b/examples/preact-kitchen-sink/package.json
index a3f3d5ec4b7..32340d55460 100644
--- a/examples/preact-kitchen-sink/package.json
+++ b/examples/preact-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "preact-example",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "private": true,
   "scripts": {
     "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
@@ -15,18 +15,18 @@
   "devDependencies": {
     "@babel/core": "^7.2.2",
     "@babel/plugin-transform-runtime": "^7.2.0",
-    "@storybook/addon-actions": "5.0.0-rc.4",
-    "@storybook/addon-backgrounds": "5.0.0-rc.4",
-    "@storybook/addon-centered": "5.0.0-rc.4",
-    "@storybook/addon-knobs": "5.0.0-rc.4",
-    "@storybook/addon-links": "5.0.0-rc.4",
-    "@storybook/addon-notes": "5.0.0-rc.4",
-    "@storybook/addon-options": "5.0.0-rc.4",
-    "@storybook/addon-storyshots": "5.0.0-rc.4",
-    "@storybook/addon-storysource": "5.0.0-rc.4",
-    "@storybook/addon-viewport": "5.0.0-rc.4",
-    "@storybook/addons": "5.0.0-rc.4",
-    "@storybook/preact": "5.0.0-rc.4",
+    "@storybook/addon-actions": "5.0.0-rc.5",
+    "@storybook/addon-backgrounds": "5.0.0-rc.5",
+    "@storybook/addon-centered": "5.0.0-rc.5",
+    "@storybook/addon-knobs": "5.0.0-rc.5",
+    "@storybook/addon-links": "5.0.0-rc.5",
+    "@storybook/addon-notes": "5.0.0-rc.5",
+    "@storybook/addon-options": "5.0.0-rc.5",
+    "@storybook/addon-storyshots": "5.0.0-rc.5",
+    "@storybook/addon-storysource": "5.0.0-rc.5",
+    "@storybook/addon-viewport": "5.0.0-rc.5",
+    "@storybook/addons": "5.0.0-rc.5",
+    "@storybook/preact": "5.0.0-rc.5",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
     "file-loader": "^3.0.1",
diff --git a/examples/riot-kitchen-sink/package.json b/examples/riot-kitchen-sink/package.json
index 813ce48ed4d..94acdb034be 100644
--- a/examples/riot-kitchen-sink/package.json
+++ b/examples/riot-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "riot-example",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "private": true,
   "scripts": {
     "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
@@ -15,18 +15,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.2.2",
-    "@storybook/addon-actions": "5.0.0-rc.4",
-    "@storybook/addon-backgrounds": "5.0.0-rc.4",
-    "@storybook/addon-centered": "5.0.0-rc.4",
-    "@storybook/addon-knobs": "5.0.0-rc.4",
-    "@storybook/addon-links": "5.0.0-rc.4",
-    "@storybook/addon-notes": "5.0.0-rc.4",
-    "@storybook/addon-options": "5.0.0-rc.4",
-    "@storybook/addon-storyshots": "5.0.0-rc.4",
-    "@storybook/addon-storysource": "5.0.0-rc.4",
-    "@storybook/addon-viewport": "5.0.0-rc.4",
-    "@storybook/addons": "5.0.0-rc.4",
-    "@storybook/riot": "5.0.0-rc.4",
+    "@storybook/addon-actions": "5.0.0-rc.5",
+    "@storybook/addon-backgrounds": "5.0.0-rc.5",
+    "@storybook/addon-centered": "5.0.0-rc.5",
+    "@storybook/addon-knobs": "5.0.0-rc.5",
+    "@storybook/addon-links": "5.0.0-rc.5",
+    "@storybook/addon-notes": "5.0.0-rc.5",
+    "@storybook/addon-options": "5.0.0-rc.5",
+    "@storybook/addon-storyshots": "5.0.0-rc.5",
+    "@storybook/addon-storysource": "5.0.0-rc.5",
+    "@storybook/addon-viewport": "5.0.0-rc.5",
+    "@storybook/addons": "5.0.0-rc.5",
+    "@storybook/riot": "5.0.0-rc.5",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
     "file-loader": "^3.0.1",
diff --git a/examples/svelte-kitchen-sink/package.json b/examples/svelte-kitchen-sink/package.json
index c744cdca6da..3ac9e42fed4 100644
--- a/examples/svelte-kitchen-sink/package.json
+++ b/examples/svelte-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "svelte-example",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook -s public",
@@ -10,17 +10,17 @@
     "global": "^4.3.2"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.4",
-    "@storybook/addon-backgrounds": "5.0.0-rc.4",
-    "@storybook/addon-centered": "5.0.0-rc.4",
-    "@storybook/addon-knobs": "5.0.0-rc.4",
-    "@storybook/addon-links": "5.0.0-rc.4",
-    "@storybook/addon-notes": "5.0.0-rc.4",
-    "@storybook/addon-options": "5.0.0-rc.4",
-    "@storybook/addon-storyshots": "5.0.0-rc.4",
-    "@storybook/addon-storysource": "5.0.0-rc.4",
-    "@storybook/addon-viewport": "5.0.0-rc.4",
-    "@storybook/addons": "5.0.0-rc.4",
-    "@storybook/svelte": "5.0.0-rc.4"
+    "@storybook/addon-actions": "5.0.0-rc.5",
+    "@storybook/addon-backgrounds": "5.0.0-rc.5",
+    "@storybook/addon-centered": "5.0.0-rc.5",
+    "@storybook/addon-knobs": "5.0.0-rc.5",
+    "@storybook/addon-links": "5.0.0-rc.5",
+    "@storybook/addon-notes": "5.0.0-rc.5",
+    "@storybook/addon-options": "5.0.0-rc.5",
+    "@storybook/addon-storyshots": "5.0.0-rc.5",
+    "@storybook/addon-storysource": "5.0.0-rc.5",
+    "@storybook/addon-viewport": "5.0.0-rc.5",
+    "@storybook/addons": "5.0.0-rc.5",
+    "@storybook/svelte": "5.0.0-rc.5"
   }
 }
diff --git a/examples/vue-kitchen-sink/package.json b/examples/vue-kitchen-sink/package.json
index 8ce64a184db..b30599db143 100644
--- a/examples/vue-kitchen-sink/package.json
+++ b/examples/vue-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "vue-example",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "private": true,
   "scripts": {
     "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
@@ -14,18 +14,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.2.2",
-    "@storybook/addon-actions": "5.0.0-rc.4",
-    "@storybook/addon-backgrounds": "5.0.0-rc.4",
-    "@storybook/addon-centered": "5.0.0-rc.4",
-    "@storybook/addon-knobs": "5.0.0-rc.4",
-    "@storybook/addon-links": "5.0.0-rc.4",
-    "@storybook/addon-notes": "5.0.0-rc.4",
-    "@storybook/addon-options": "5.0.0-rc.4",
-    "@storybook/addon-storyshots": "5.0.0-rc.4",
-    "@storybook/addon-storysource": "5.0.0-rc.4",
-    "@storybook/addon-viewport": "5.0.0-rc.4",
-    "@storybook/addons": "5.0.0-rc.4",
-    "@storybook/vue": "5.0.0-rc.4",
+    "@storybook/addon-actions": "5.0.0-rc.5",
+    "@storybook/addon-backgrounds": "5.0.0-rc.5",
+    "@storybook/addon-centered": "5.0.0-rc.5",
+    "@storybook/addon-knobs": "5.0.0-rc.5",
+    "@storybook/addon-links": "5.0.0-rc.5",
+    "@storybook/addon-notes": "5.0.0-rc.5",
+    "@storybook/addon-options": "5.0.0-rc.5",
+    "@storybook/addon-storyshots": "5.0.0-rc.5",
+    "@storybook/addon-storysource": "5.0.0-rc.5",
+    "@storybook/addon-viewport": "5.0.0-rc.5",
+    "@storybook/addons": "5.0.0-rc.5",
+    "@storybook/vue": "5.0.0-rc.5",
     "babel-core": "^7.0.0-bridge.0",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
diff --git a/lerna.json b/lerna.json
index 7805559a3d0..ce1527c3f19 100644
--- a/lerna.json
+++ b/lerna.json
@@ -11,5 +11,5 @@
   "npmClient": "yarn",
   "useWorkspaces": true,
   "registry": "https://registry.npmjs.org",
-  "version": "5.0.0-rc.4"
+  "version": "5.0.0-rc.5"
 }
diff --git a/lib/addons/package.json b/lib/addons/package.json
index 6d643e86475..9e734075180 100644
--- a/lib/addons/package.json
+++ b/lib/addons/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addons",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "Storybook addons store",
   "keywords": [
     "storybook"
@@ -20,8 +20,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.0.0-rc.4",
-    "@storybook/client-logger": "5.0.0-rc.4",
+    "@storybook/channels": "5.0.0-rc.5",
+    "@storybook/client-logger": "5.0.0-rc.5",
     "global": "^4.3.2",
     "util-deprecate": "^1.0.2"
   },
diff --git a/lib/channel-postmessage/package.json b/lib/channel-postmessage/package.json
index f9601d41637..64aff2fa6ca 100644
--- a/lib/channel-postmessage/package.json
+++ b/lib/channel-postmessage/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channel-postmessage",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "",
   "keywords": [
     "storybook"
@@ -20,8 +20,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.0.0-rc.4",
-    "@storybook/client-logger": "5.0.0-rc.4",
+    "@storybook/channels": "5.0.0-rc.5",
+    "@storybook/client-logger": "5.0.0-rc.5",
     "global": "^4.3.2",
     "telejson": "^1.0.1"
   },
diff --git a/lib/channel-websocket/package.json b/lib/channel-websocket/package.json
index 85a335f0615..75d771af081 100644
--- a/lib/channel-websocket/package.json
+++ b/lib/channel-websocket/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channel-websocket",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "",
   "keywords": [
     "storybook"
@@ -20,7 +20,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.0.0-rc.4",
+    "@storybook/channels": "5.0.0-rc.5",
     "global": "^4.3.2",
     "json-fn": "^1.1.1"
   },
diff --git a/lib/channels/package.json b/lib/channels/package.json
index d542aad56c1..cc504d5dc50 100644
--- a/lib/channels/package.json
+++ b/lib/channels/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channels",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/cli/package.json b/lib/cli/package.json
index cb3e8b22956..272ef68a230 100644
--- a/lib/cli/package.json
+++ b/lib/cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/cli",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "Storybook's CLI - easiest method of adding storybook to your projects",
   "keywords": [
     "cli",
@@ -29,7 +29,7 @@
     "@babel/core": "^7.2.2",
     "@babel/preset-env": "^7.3.1",
     "@babel/register": "^7.0.0",
-    "@storybook/codemod": "5.0.0-rc.4",
+    "@storybook/codemod": "5.0.0-rc.5",
     "chalk": "^2.4.1",
     "commander": "^2.19.0",
     "core-js": "^2.6.2",
@@ -43,31 +43,31 @@
     "update-notifier": "^2.5.0"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.4",
-    "@storybook/addon-centered": "5.0.0-rc.4",
-    "@storybook/addon-graphql": "5.0.0-rc.4",
-    "@storybook/addon-info": "5.0.0-rc.4",
-    "@storybook/addon-knobs": "5.0.0-rc.4",
-    "@storybook/addon-links": "5.0.0-rc.4",
-    "@storybook/addon-notes": "5.0.0-rc.4",
-    "@storybook/addon-options": "5.0.0-rc.4",
-    "@storybook/addon-storyshots": "5.0.0-rc.4",
-    "@storybook/addons": "5.0.0-rc.4",
-    "@storybook/angular": "5.0.0-rc.4",
-    "@storybook/channel-postmessage": "5.0.0-rc.4",
-    "@storybook/channel-websocket": "5.0.0-rc.4",
-    "@storybook/channels": "5.0.0-rc.4",
-    "@storybook/ember": "5.0.0-rc.4",
-    "@storybook/html": "5.0.0-rc.4",
-    "@storybook/marko": "5.0.0-rc.4",
-    "@storybook/mithril": "5.0.0-rc.4",
-    "@storybook/polymer": "5.0.0-rc.4",
-    "@storybook/preact": "5.0.0-rc.4",
-    "@storybook/react": "5.0.0-rc.4",
-    "@storybook/react-native": "5.0.0-rc.4",
-    "@storybook/riot": "5.0.0-rc.4",
-    "@storybook/ui": "5.0.0-rc.4",
-    "@storybook/vue": "5.0.0-rc.4"
+    "@storybook/addon-actions": "5.0.0-rc.5",
+    "@storybook/addon-centered": "5.0.0-rc.5",
+    "@storybook/addon-graphql": "5.0.0-rc.5",
+    "@storybook/addon-info": "5.0.0-rc.5",
+    "@storybook/addon-knobs": "5.0.0-rc.5",
+    "@storybook/addon-links": "5.0.0-rc.5",
+    "@storybook/addon-notes": "5.0.0-rc.5",
+    "@storybook/addon-options": "5.0.0-rc.5",
+    "@storybook/addon-storyshots": "5.0.0-rc.5",
+    "@storybook/addons": "5.0.0-rc.5",
+    "@storybook/angular": "5.0.0-rc.5",
+    "@storybook/channel-postmessage": "5.0.0-rc.5",
+    "@storybook/channel-websocket": "5.0.0-rc.5",
+    "@storybook/channels": "5.0.0-rc.5",
+    "@storybook/ember": "5.0.0-rc.5",
+    "@storybook/html": "5.0.0-rc.5",
+    "@storybook/marko": "5.0.0-rc.5",
+    "@storybook/mithril": "5.0.0-rc.5",
+    "@storybook/polymer": "5.0.0-rc.5",
+    "@storybook/preact": "5.0.0-rc.5",
+    "@storybook/react": "5.0.0-rc.5",
+    "@storybook/react-native": "5.0.0-rc.5",
+    "@storybook/riot": "5.0.0-rc.5",
+    "@storybook/ui": "5.0.0-rc.5",
+    "@storybook/vue": "5.0.0-rc.5"
   },
   "publishConfig": {
     "access": "public"
diff --git a/lib/client-api/package.json b/lib/client-api/package.json
index f5376b46337..099d05cbca0 100644
--- a/lib/client-api/package.json
+++ b/lib/client-api/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/client-api",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "Storybook Client API",
   "keywords": [
     "storybook"
@@ -19,10 +19,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.4",
-    "@storybook/client-logger": "5.0.0-rc.4",
-    "@storybook/core-events": "5.0.0-rc.4",
-    "@storybook/router": "5.0.0-rc.4",
+    "@storybook/addons": "5.0.0-rc.5",
+    "@storybook/client-logger": "5.0.0-rc.5",
+    "@storybook/core-events": "5.0.0-rc.5",
+    "@storybook/router": "5.0.0-rc.5",
     "common-tags": "^1.8.0",
     "eventemitter3": "^3.1.0",
     "global": "^4.3.2",
diff --git a/lib/client-logger/package.json b/lib/client-logger/package.json
index 586c687852a..86b0b7d5cd7 100644
--- a/lib/client-logger/package.json
+++ b/lib/client-logger/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/client-logger",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/codemod/package.json b/lib/codemod/package.json
index 36f0b1db9f5..da6c6f4b29a 100644
--- a/lib/codemod/package.json
+++ b/lib/codemod/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/codemod",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "A collection of codemod scripts written with JSCodeshift",
   "keywords": [
     "storybook"
diff --git a/lib/components/package.json b/lib/components/package.json
index bed4bb6c0bc..b6ec56e42e9 100644
--- a/lib/components/package.json
+++ b/lib/components/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/components",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "Core Storybook Components",
   "keywords": [
     "storybook"
@@ -20,11 +20,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.4",
-    "@storybook/client-logger": "5.0.0-rc.4",
-    "@storybook/core-events": "5.0.0-rc.4",
-    "@storybook/router": "5.0.0-rc.4",
-    "@storybook/theming": "5.0.0-rc.4",
+    "@storybook/addons": "5.0.0-rc.5",
+    "@storybook/client-logger": "5.0.0-rc.5",
+    "@storybook/core-events": "5.0.0-rc.5",
+    "@storybook/router": "5.0.0-rc.5",
+    "@storybook/theming": "5.0.0-rc.5",
     "global": "^4.3.2",
     "immer": "^1.12.0",
     "js-beautify": "^1.8.9",
diff --git a/lib/core-events/package.json b/lib/core-events/package.json
index a71387adfa4..16dbe9b4d87 100644
--- a/lib/core-events/package.json
+++ b/lib/core-events/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/core-events",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "Event names used in storybook core",
   "keywords": [
     "storybook"
diff --git a/lib/core/package.json b/lib/core/package.json
index 9baba8fc599..dc4e1432c7b 100644
--- a/lib/core/package.json
+++ b/lib/core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/core",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "Storybook framework-agnostic API",
   "keywords": [
     "storybook"
@@ -24,15 +24,15 @@
     "@babel/plugin-syntax-dynamic-import": "^7.2.0",
     "@babel/plugin-transform-react-constant-elements": "^7.2.0",
     "@babel/preset-env": "^7.3.1",
-    "@storybook/addons": "5.0.0-rc.4",
-    "@storybook/channel-postmessage": "5.0.0-rc.4",
-    "@storybook/client-api": "5.0.0-rc.4",
-    "@storybook/client-logger": "5.0.0-rc.4",
-    "@storybook/core-events": "5.0.0-rc.4",
-    "@storybook/node-logger": "5.0.0-rc.4",
-    "@storybook/router": "5.0.0-rc.4",
-    "@storybook/theming": "5.0.0-rc.4",
-    "@storybook/ui": "5.0.0-rc.4",
+    "@storybook/addons": "5.0.0-rc.5",
+    "@storybook/channel-postmessage": "5.0.0-rc.5",
+    "@storybook/client-api": "5.0.0-rc.5",
+    "@storybook/client-logger": "5.0.0-rc.5",
+    "@storybook/core-events": "5.0.0-rc.5",
+    "@storybook/node-logger": "5.0.0-rc.5",
+    "@storybook/router": "5.0.0-rc.5",
+    "@storybook/theming": "5.0.0-rc.5",
+    "@storybook/ui": "5.0.0-rc.5",
     "airbnb-js-shims": "^1 || ^2",
     "autoprefixer": "^9.4.7",
     "babel-plugin-add-react-displayname": "^0.0.5",
diff --git a/lib/node-logger/package.json b/lib/node-logger/package.json
index 19f58e66ad3..ed179f9f32b 100644
--- a/lib/node-logger/package.json
+++ b/lib/node-logger/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/node-logger",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/router/package.json b/lib/router/package.json
index d24cae5aaca..8d26bcbd290 100644
--- a/lib/router/package.json
+++ b/lib/router/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/router",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "Core Storybook Router",
   "keywords": [
     "storybook"
@@ -20,7 +20,7 @@
   },
   "dependencies": {
     "@reach/router": "^1.2.1",
-    "@storybook/theming": "5.0.0-rc.4",
+    "@storybook/theming": "5.0.0-rc.5",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
     "qs": "^6.5.2"
diff --git a/lib/theming/package.json b/lib/theming/package.json
index 831f7cac278..0694d2933b2 100644
--- a/lib/theming/package.json
+++ b/lib/theming/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/theming",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "Core Storybook Components",
   "keywords": [
     "storybook"
@@ -21,7 +21,7 @@
   "dependencies": {
     "@emotion/core": "^10.0.7",
     "@emotion/styled": "^10.0.7",
-    "@storybook/client-logger": "5.0.0-rc.4",
+    "@storybook/client-logger": "5.0.0-rc.5",
     "common-tags": "^1.8.0",
     "deep-object-diff": "^1.1.0",
     "emotion-theming": "^10.0.7",
diff --git a/lib/ui/package.json b/lib/ui/package.json
index a8a92025ded..0c0af0d238f 100644
--- a/lib/ui/package.json
+++ b/lib/ui/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/ui",
-  "version": "5.0.0-rc.4",
+  "version": "5.0.0-rc.5",
   "description": "Core Storybook UI",
   "keywords": [
     "storybook"
@@ -21,12 +21,12 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.4",
-    "@storybook/client-logger": "5.0.0-rc.4",
-    "@storybook/components": "5.0.0-rc.4",
-    "@storybook/core-events": "5.0.0-rc.4",
-    "@storybook/router": "5.0.0-rc.4",
-    "@storybook/theming": "5.0.0-rc.4",
+    "@storybook/addons": "5.0.0-rc.5",
+    "@storybook/client-logger": "5.0.0-rc.5",
+    "@storybook/components": "5.0.0-rc.5",
+    "@storybook/core-events": "5.0.0-rc.5",
+    "@storybook/router": "5.0.0-rc.5",
+    "@storybook/theming": "5.0.0-rc.5",
     "eventemitter3": "^3.1.0",
     "fast-deep-equal": "^2.0.1",
     "fuse.js": "^3.3.1",

From cdf2265dbe1b750a3c7054e2fbe59b3da47acfc8 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Sat, 23 Feb 2019 17:13:34 +0800
Subject: [PATCH 076/249] 5.0.0-rc.5 versions.json

---
 docs/static/versions.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/docs/static/versions.json b/docs/static/versions.json
index ac6d55b8474..5dc74db58aa 100644
--- a/docs/static/versions.json
+++ b/docs/static/versions.json
@@ -1 +1 @@
-{"next":{"version":"5.0.0-rc.4","info":{"plain":"### Features\n\n* Handle prerelease versions in version check ([#5641](https://github.com/storybooks/storybook/pull/5641))\n\n### Bug Fixes\n\n* UI: Fix scrollbar persistence ([#5689](https://github.com/storybooks/storybook/pull/5689))\n* UI: Fix keyboard shortcuts of toggleNav & togglePanel ([#5677](https://github.com/storybooks/storybook/pull/5677))\n* Core: Fix singleton module issue for manager & theme ([#5679](https://github.com/storybooks/storybook/pull/5679))\n* Addon-storysource: Fix source not updating ([#5672](https://github.com/storybooks/storybook/pull/5672))\n* Core: Fix broken error reporting ([#5678](https://github.com/storybooks/storybook/pull/5678))\n* Compare component name to story name, not story fn ([#5649](https://github.com/storybooks/storybook/pull/5649))\n\n### Maintenance\n\n* CLI: Cleanup version notice ([#5699](https://github.com/storybooks/storybook/pull/5699))\n* Core: Fix story fn consistency ([#5669](https://github.com/storybooks/storybook/pull/5669))"}}}
\ No newline at end of file
+{"next":{"version":"5.0.0-rc.5","info":{"plain":"### Bug Fixes\n\n* UI: Fix `/` search hotkey so it doesn't type into the input ([#5702](https://github.com/storybooks/storybook/pull/5702))\n* Addon-a11y: Fix a11y setup being undefined ([#5724](https://github.com/storybooks/storybook/pull/5724))\n* UI: Fix duplicate theming packages ([#5722](https://github.com/storybooks/storybook/pull/5722))\n* Core: Clean up debug logging ([#5705](https://github.com/storybooks/storybook/pull/5705))\n* UI: Minor addon ux tweaks ([#5712](https://github.com/storybooks/storybook/pull/5712))\n* Addon-a11y: Fix story scrolling ([#5713](https://github.com/storybooks/storybook/pull/5713))\n* UI: Fix mobile styling ([#5709](https://github.com/storybooks/storybook/pull/5709))\n* UI: Fix tooltip bugs ([#5692](https://github.com/storybooks/storybook/pull/5692))\n* UI: Fix toolbar separators ([#5711](https://github.com/storybooks/storybook/pull/5711))\n\n### Maintenance\n\n* Typescript: migrate addon-backgrounds ([#5535](https://github.com/storybooks/storybook/pull/5535))\n* Typescript: fix typings for addon-backgrounds ([#5730](https://github.com/storybooks/storybook/pull/5730))"}}}
\ No newline at end of file

From 4c261fb136b009e15f04cfadbe7b98fb9917b36f Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Sat, 23 Feb 2019 18:32:34 +0800
Subject: [PATCH 077/249] Merge pull request #5715 from
 storybooks/tech/upgrade-telejson

UPGRADE telejson
---
 lib/channel-postmessage/package.json          |  2 +-
 lib/core/package.json                         |  1 -
 lib/core/src/server/common/babel-loader.js    | 22 -------------------
 .../server/manager/manager-webpack.config.js  |  4 ++--
 .../server/preview/iframe-webpack.config.js   |  3 +--
 yarn.lock                                     |  7 +++---
 6 files changed, 8 insertions(+), 31 deletions(-)

diff --git a/lib/channel-postmessage/package.json b/lib/channel-postmessage/package.json
index 64aff2fa6ca..f243526e24a 100644
--- a/lib/channel-postmessage/package.json
+++ b/lib/channel-postmessage/package.json
@@ -23,7 +23,7 @@
     "@storybook/channels": "5.0.0-rc.5",
     "@storybook/client-logger": "5.0.0-rc.5",
     "global": "^4.3.2",
-    "telejson": "^1.0.1"
+    "telejson": "^2.0.0"
   },
   "devDependencies": {
     "@types/json-stringify-safe": "^5.0.0"
diff --git a/lib/core/package.json b/lib/core/package.json
index dc4e1432c7b..a4ad1f557b5 100644
--- a/lib/core/package.json
+++ b/lib/core/package.json
@@ -38,7 +38,6 @@
     "babel-plugin-add-react-displayname": "^0.0.5",
     "babel-plugin-emotion": "^10.0.7",
     "babel-plugin-macros": "^2.4.5",
-    "babel-preset-env": "^1.7.0",
     "babel-preset-minify": "^0.5.0 || 0.6.0-alpha.5",
     "boxen": "^2.1.0",
     "case-sensitive-paths-webpack-plugin": "^2.2.0",
diff --git a/lib/core/src/server/common/babel-loader.js b/lib/core/src/server/common/babel-loader.js
index 75b9cf53e10..3b762f613f0 100644
--- a/lib/core/src/server/common/babel-loader.js
+++ b/lib/core/src/server/common/babel-loader.js
@@ -11,25 +11,3 @@ export default options => ({
   include: includePaths,
   exclude: excludePaths,
 });
-
-export const nodeModulesBabelLoader = {
-  test: /\.js$/,
-  include: /\/node_modules\/safe-eval\//,
-  use: [
-    {
-      loader: 'babel-loader',
-      options: {
-        cacheDirectory: true,
-        babelrc: false,
-        presets: [
-          [
-            'env',
-            {
-              modules: 'commonjs',
-            },
-          ],
-        ],
-      },
-    },
-  ],
-};
diff --git a/lib/core/src/server/manager/manager-webpack.config.js b/lib/core/src/server/manager/manager-webpack.config.js
index 739aeed1e5b..e86e8246b37 100644
--- a/lib/core/src/server/manager/manager-webpack.config.js
+++ b/lib/core/src/server/manager/manager-webpack.config.js
@@ -10,7 +10,7 @@ import findCacheDir from 'find-cache-dir';
 import { version } from '../../../package.json';
 import { getManagerHeadHtml } from '../utils/template';
 import { loadEnv } from '../config/utils';
-import babelLoader, { nodeModulesBabelLoader } from '../common/babel-loader';
+import babelLoader from '../common/babel-loader';
 
 const coreDirName = path.dirname(require.resolve('@storybook/core/package.json'));
 const context = path.join(coreDirName, '../../node_modules');
@@ -59,7 +59,7 @@ export default ({ configDir, configType, entries, dll, outputDir, cache, babelOp
       new Dotenv({ silent: true }),
     ].filter(Boolean),
     module: {
-      rules: [babelLoader(babelOptions), nodeModulesBabelLoader],
+      rules: [babelLoader(babelOptions)],
     },
     resolve: {
       extensions: ['.mjs', '.js', '.jsx', '.json'],
diff --git a/lib/core/src/server/preview/iframe-webpack.config.js b/lib/core/src/server/preview/iframe-webpack.config.js
index 01187bdc548..26a95c60c88 100644
--- a/lib/core/src/server/preview/iframe-webpack.config.js
+++ b/lib/core/src/server/preview/iframe-webpack.config.js
@@ -7,7 +7,7 @@ import WatchMissingNodeModulesPlugin from 'react-dev-utils/WatchMissingNodeModul
 import TerserWebpackPlugin from 'terser-webpack-plugin';
 import resolveFrom from 'resolve-from';
 
-import babelLoader, { nodeModulesBabelLoader } from '../common/babel-loader';
+import babelLoader from '../common/babel-loader';
 import { nodeModulesPaths, loadEnv } from '../config/utils';
 import { getPreviewHeadHtml, getPreviewBodyHtml } from '../utils/template';
 
@@ -68,7 +68,6 @@ export default ({
     module: {
       rules: [
         babelLoader(babelOptions),
-        nodeModulesBabelLoader,
         {
           test: /\.md$/,
           use: [
diff --git a/yarn.lock b/yarn.lock
index 10fd03d4689..f628798a48a 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -20052,9 +20052,10 @@ tar@^4, tar@^4.4.8:
     safe-buffer "^5.1.2"
     yallist "^3.0.2"
 
-telejson@^1.0.1:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/telejson/-/telejson-1.0.1.tgz#1457985fce02f1f054b626b7fcdc53fa54191b94"
+telejson@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/telejson/-/telejson-2.0.0.tgz#3bde0d8efc73b9410e51519e8f1e3952d51bafa3"
+  integrity sha512-NfJ8FLvYk7RiwBWw3QfsPz4kUK7lOFhL1KrtumlSnc9XAeD87T10ZrsfP3tbJdsPEPdwWA78x5VCEHtcs9foYQ==
   dependencies:
     global "^4.3.2"
     is-function "^1.0.1"

From 03149bb91ae2add19bc8c19c62d89da4f34b9b07 Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Sun, 24 Feb 2019 16:02:37 +0100
Subject: [PATCH 078/249] Merge pull request #5737 from
 storybooks/tech/restore-eject

RESTORE the eject button
---
 .../__snapshots__/preview.stories.storyshot   | 184 +++++++-----------
 lib/ui/src/components/preview/preview.js      |  29 ++-
 2 files changed, 86 insertions(+), 127 deletions(-)

diff --git a/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot b/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot
index 9ab7dd2e0eb..a03b4aadebd 100644
--- a/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot
+++ b/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot
@@ -2,7 +2,7 @@
 
 exports[`Storyshots UI|Preview/Preview no tabs 1`] = `
 Array [
-  .emotion-21 {
+  .emotion-22 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -33,7 +33,7 @@ Array [
   margin-left: 15px;
 }
 
-.emotion-20 {
+.emotion-21 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -47,39 +47,10 @@ Array [
   margin-left: 30px;
 }
 
-.emotion-20 > * {
+.emotion-21 > * {
   margin-right: 15px;
 }
 
-.emotion-16 {
-  height: 40px;
-  background: none;
-  color: inherit;
-  padding: 0;
-  cursor: pointer;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-}
-
-.emotion-16:hover,
-.emotion-16:focus {
-  outline: 0 none;
-  color: #1EA7FD;
-}
-
-.emotion-16 > svg {
-  width: 15px;
-}
-
-@media (max-width:599px) {
-  .emotion-16 {
-    display: none;
-  }
-}
-
 .emotion-1 {
   shape-rendering: inherit;
   -webkit-transform: translate3d(0,0,0);
@@ -92,7 +63,7 @@ Array [
   fill: currentColor;
 }
 
-.emotion-22 {
+.emotion-23 {
   color: #999999;
   height: 40px;
   overflow: auto;
@@ -122,7 +93,7 @@ Array [
   tranform: translateY(0px);
 }
 
-.emotion-22:hover {
+.emotion-23:hover {
   -webkit-scrollbar-width: none;
   -moz-scrollbar-width: none;
   -ms-scrollbar-width: none;
@@ -133,7 +104,7 @@ Array [
   scrollbar-width: 0;
 }
 
-.emotion-22::-webkit-scrollbar {
+.emotion-23::-webkit-scrollbar {
   height: 3px;
   width: 3px;
   background: transparent;
@@ -141,14 +112,14 @@ Array [
   display: none;
 }
 
-.emotion-22:hover::-webkit-scrollbar {
+.emotion-23:hover::-webkit-scrollbar {
   height: 3px;
   width: 3px;
   background: transparent;
   display: block;
 }
 
-.emotion-22::-webkit-scrollbar-track {
+.emotion-23::-webkit-scrollbar-track {
   border-radius: 0;
   background: transparent;
   opacity: 0;
@@ -158,13 +129,13 @@ Array [
   width: 0;
 }
 
-.emotion-22::-webkit-scrollbar-thumb {
+.emotion-23::-webkit-scrollbar-thumb {
   border-radius: 0;
   background: rgba(0,0,0,.1);
   box-shadow: none;
 }
 
-.emotion-22::-webkit-scrollbar-track-piece {
+.emotion-23::-webkit-scrollbar-track-piece {
   display: none;
   border: 0 none;
   opacity: 0;
@@ -205,11 +176,17 @@ Array [
   display: none;
 }
 
+@media (max-width:599px) {
+  .emotion-17 {
+    display: none;
+  }
+}
+
 <div
-    class="emotion-22"
+    class="emotion-23"
   >
     <div
-      class="emotion-21"
+      class="emotion-22"
     >
       <div
         class="emotion-13"
@@ -275,25 +252,28 @@ Array [
         </button>
       </div>
       <div
-        class="emotion-20"
+        class="emotion-21"
       >
-        <button
-          class="emotion-16"
-          title="Go full screen"
+        <span
+          class="emotion-17"
         >
-          <svg
-            class="emotion-1"
-            viewBox="0 0 1024 1024"
+          <button
+            class="emotion-2"
+            title="Go full screen"
           >
-            <path
-              class="emotion-0"
-              d="M959.688 920.068l0.31-176c0.040-22.094-17.84-40.032-39.93-40.070-22.092-0.040-40.032 17.838-40.070 39.93l-0.142 79.672-235.734-235.732c-15.622-15.622-40.948-15.622-56.57 0s-15.622 40.948 0 56.568l235.442 235.442-78.946-0.1c-22.092-0.028-40.022 17.86-40.050 39.952-0.014 11.064 4.464 21.084 11.714 28.334 7.228 7.224 17.208 11.702 28.236 11.714l175.688 0.22c22.086 0.028 40.014-17.846 40.052-39.93zM920.178 64.228l-176-0.308c-22.094-0.040-40.032 17.84-40.070 39.93-0.040 22.092 17.838 40.032 39.93 40.070l79.672 0.14-235.732 235.734c-15.622 15.622-15.622 40.948 0 56.568s40.948 15.622 56.568 0l235.442-235.442-0.1 78.946c-0.028 22.092 17.86 40.022 39.952 40.050 11.064 0.014 21.084-4.464 28.334-11.714 7.224-7.228 11.702-17.208 11.714-28.236l0.22-175.688c0.026-22.082-17.846-40.010-39.93-40.050zM64.236 103.742l-0.308 176c-0.040 22.094 17.84 40.032 39.93 40.070 22.092 0.040 40.032-17.84 40.070-39.93l0.14-79.672 235.734 235.73c15.622 15.622 40.948 15.622 56.568 0s15.622-40.946 0-56.566l-235.442-235.442 78.946 0.098c22.092 0.028 40.022-17.86 40.050-39.95 0.014-11.066-4.464-21.086-11.714-28.336-7.228-7.222-17.208-11.7-28.236-11.714l-175.688-0.218c-22.084-0.026-40.012 17.844-40.050 39.93zM103.748 959.766l176 0.308c22.094 0.040 40.032-17.84 40.070-39.93 0.040-22.092-17.84-40.032-39.93-40.070l-79.672-0.14 235.73-235.734c15.622-15.622 15.622-40.948 0-56.568s-40.946-15.622-56.566 0l-235.442 235.442 0.098-78.946c0.028-22.092-17.86-40.022-39.95-40.050-11.066-0.014-21.086 4.464-28.336 11.714-7.222 7.228-11.7 17.208-11.714 28.236l-0.218 175.688c-0.026 22.082 17.844 40.010 39.93 40.050z"
-            />
-          </svg>
-        </button>
+            <svg
+              class="emotion-1"
+              viewBox="0 0 1024 1024"
+            >
+              <path
+                class="emotion-0"
+                d="M959.688 920.068l0.31-176c0.040-22.094-17.84-40.032-39.93-40.070-22.092-0.040-40.032 17.838-40.070 39.93l-0.142 79.672-235.734-235.732c-15.622-15.622-40.948-15.622-56.57 0s-15.622 40.948 0 56.568l235.442 235.442-78.946-0.1c-22.092-0.028-40.022 17.86-40.050 39.952-0.014 11.064 4.464 21.084 11.714 28.334 7.228 7.224 17.208 11.702 28.236 11.714l175.688 0.22c22.086 0.028 40.014-17.846 40.052-39.93zM920.178 64.228l-176-0.308c-22.094-0.040-40.032 17.84-40.070 39.93-0.040 22.092 17.838 40.032 39.93 40.070l79.672 0.14-235.732 235.734c-15.622 15.622-15.622 40.948 0 56.568s40.948 15.622 56.568 0l235.442-235.442-0.1 78.946c-0.028 22.092 17.86 40.022 39.952 40.050 11.064 0.014 21.084-4.464 28.334-11.714 7.224-7.228 11.702-17.208 11.714-28.236l0.22-175.688c0.026-22.082-17.846-40.010-39.93-40.050zM64.236 103.742l-0.308 176c-0.040 22.094 17.84 40.032 39.93 40.070 22.092 0.040 40.032-17.84 40.070-39.93l0.14-79.672 235.734 235.73c15.622 15.622 40.948 15.622 56.568 0s15.622-40.946 0-56.566l-235.442-235.442 78.946 0.098c22.092 0.028 40.022-17.86 40.050-39.95 0.014-11.066-4.464-21.086-11.714-28.336-7.228-7.222-17.208-11.7-28.236-11.714l-175.688-0.218c-22.084-0.026-40.012 17.844-40.050 39.93zM103.748 959.766l176 0.308c22.094 0.040 40.032-17.84 40.070-39.93 0.040-22.092-17.84-40.032-39.93-40.070l-79.672-0.14 235.73-235.734c15.622-15.622 15.622-40.948 0-56.568s-40.946-15.622-56.566 0l-235.442 235.442 0.098-78.946c0.028-22.092-17.86-40.022-39.95-40.050-11.066-0.014-21.086 4.464-28.336 11.714-7.222 7.228-11.7 17.208-11.714 28.236l-0.218 175.688c-0.026 22.082 17.844 40.010 39.93 40.050z"
+              />
+            </svg>
+          </button>
+        </span>
         <button
           class="emotion-2"
-          title="Go full screen"
         >
           <svg
             class="emotion-1"
@@ -301,7 +281,7 @@ Array [
           >
             <path
               class="emotion-0"
-              d="M959.688 920.068l0.31-176c0.040-22.094-17.84-40.032-39.93-40.070-22.092-0.040-40.032 17.838-40.070 39.93l-0.142 79.672-235.734-235.732c-15.622-15.622-40.948-15.622-56.57 0s-15.622 40.948 0 56.568l235.442 235.442-78.946-0.1c-22.092-0.028-40.022 17.86-40.050 39.952-0.014 11.064 4.464 21.084 11.714 28.334 7.228 7.224 17.208 11.702 28.236 11.714l175.688 0.22c22.086 0.028 40.014-17.846 40.052-39.93zM920.178 64.228l-176-0.308c-22.094-0.040-40.032 17.84-40.070 39.93-0.040 22.092 17.838 40.032 39.93 40.070l79.672 0.14-235.732 235.734c-15.622 15.622-15.622 40.948 0 56.568s40.948 15.622 56.568 0l235.442-235.442-0.1 78.946c-0.028 22.092 17.86 40.022 39.952 40.050 11.064 0.014 21.084-4.464 28.334-11.714 7.224-7.228 11.702-17.208 11.714-28.236l0.22-175.688c0.026-22.082-17.846-40.010-39.93-40.050zM64.236 103.742l-0.308 176c-0.040 22.094 17.84 40.032 39.93 40.070 22.092 0.040 40.032-17.84 40.070-39.93l0.14-79.672 235.734 235.73c15.622 15.622 40.948 15.622 56.568 0s15.622-40.946 0-56.566l-235.442-235.442 78.946 0.098c22.092 0.028 40.022-17.86 40.050-39.95 0.014-11.066-4.464-21.086-11.714-28.336-7.228-7.222-17.208-11.7-28.236-11.714l-175.688-0.218c-22.084-0.026-40.012 17.844-40.050 39.93zM103.748 959.766l176 0.308c22.094 0.040 40.032-17.84 40.070-39.93 0.040-22.092-17.84-40.032-39.93-40.070l-79.672-0.14 235.73-235.734c15.622-15.622 15.622-40.948 0-56.568s-40.946-15.622-56.566 0l-235.442 235.442 0.098-78.946c0.028-22.092-17.86-40.022-39.95-40.050-11.066-0.014-21.086 4.464-28.336 11.714-7.222 7.228-11.7 17.208-11.714 28.236l-0.218 175.688c-0.026 22.082 17.844 40.010 39.93 40.050z"
+              d="M896.006 920c0 22.090-17.91 40-40 40h-688.006c-22.090 0-40-17.906-40-40v-549.922c-0.838-3.224-1.33-6.588-1.33-10.072 0-22.090 17.908-40.004 40-40.004h178.66c22.092 0.004 40 17.914 40 40.004 0 22.088-17.908 40-40 40h-137.33v479.996h607.998v-479.996h-138.658c-22.090 0-40-17.912-40-40 0-22.090 17.906-40.004 40-40.004h178.658c22.090 0 40 17.91 40 40v559.844c0 0.050 0.008 0.102 0.008 0.154zM665.622 200.168l-124.452-124.45c-8.042-8.042-18.65-11.912-29.186-11.674-1.612-0.034-3.222 0-4.828 0.16-0.558 0.054-1.098 0.16-1.648 0.238-0.742 0.104-1.484 0.192-2.218 0.338-0.656 0.13-1.29 0.31-1.934 0.472-0.622 0.154-1.244 0.292-1.86 0.476-0.64 0.196-1.258 0.436-1.886 0.66-0.602 0.216-1.208 0.414-1.802 0.66-0.598 0.248-1.17 0.54-1.754 0.814-0.598 0.282-1.202 0.546-1.788 0.86-0.578 0.312-1.13 0.664-1.694 1-0.552 0.332-1.116 0.644-1.654 1.006-0.67 0.448-1.3 0.942-1.942 1.426-0.394 0.302-0.806 0.576-1.196 0.894-1.046 0.858-2.052 1.768-3.008 2.726l-124.398 124.39c-15.622 15.62-15.618 40.948 0.002 56.57 15.622 15.62 40.95 15.62 56.568 0l56.164-56.166v439.426c0 22.094 17.912 40 40.002 40 22.092 0 40-17.91 40-40v-441.202l57.942 57.942c15.622 15.624 40.948 15.62 56.568 0 15.626-15.618 15.626-40.946 0.002-56.566z"
             />
           </svg>
         </button>
@@ -382,7 +362,7 @@ Array [
 
 exports[`Storyshots UI|Preview/Preview with tabs 1`] = `
 Array [
-  .emotion-27 {
+  .emotion-28 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -511,7 +491,7 @@ Array [
   border-bottom-color: #1EA7FD;
 }
 
-.emotion-26 {
+.emotion-27 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -525,39 +505,10 @@ Array [
   margin-left: 30px;
 }
 
-.emotion-26 > * {
+.emotion-27 > * {
   margin-right: 15px;
 }
 
-.emotion-22 {
-  height: 40px;
-  background: none;
-  color: inherit;
-  padding: 0;
-  cursor: pointer;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-}
-
-.emotion-22:hover,
-.emotion-22:focus {
-  outline: 0 none;
-  color: #1EA7FD;
-}
-
-.emotion-22 > svg {
-  width: 15px;
-}
-
-@media (max-width:599px) {
-  .emotion-22 {
-    display: none;
-  }
-}
-
 .emotion-7 {
   shape-rendering: inherit;
   -webkit-transform: translate3d(0,0,0);
@@ -570,7 +521,7 @@ Array [
   fill: currentColor;
 }
 
-.emotion-28 {
+.emotion-29 {
   color: #999999;
   height: 40px;
   overflow: auto;
@@ -600,7 +551,7 @@ Array [
   tranform: translateY(0px);
 }
 
-.emotion-28:hover {
+.emotion-29:hover {
   -webkit-scrollbar-width: none;
   -moz-scrollbar-width: none;
   -ms-scrollbar-width: none;
@@ -611,7 +562,7 @@ Array [
   scrollbar-width: 0;
 }
 
-.emotion-28::-webkit-scrollbar {
+.emotion-29::-webkit-scrollbar {
   height: 3px;
   width: 3px;
   background: transparent;
@@ -619,14 +570,14 @@ Array [
   display: none;
 }
 
-.emotion-28:hover::-webkit-scrollbar {
+.emotion-29:hover::-webkit-scrollbar {
   height: 3px;
   width: 3px;
   background: transparent;
   display: block;
 }
 
-.emotion-28::-webkit-scrollbar-track {
+.emotion-29::-webkit-scrollbar-track {
   border-radius: 0;
   background: transparent;
   opacity: 0;
@@ -636,13 +587,13 @@ Array [
   width: 0;
 }
 
-.emotion-28::-webkit-scrollbar-thumb {
+.emotion-29::-webkit-scrollbar-thumb {
   border-radius: 0;
   background: rgba(0,0,0,.1);
   box-shadow: none;
 }
 
-.emotion-28::-webkit-scrollbar-track-piece {
+.emotion-29::-webkit-scrollbar-track-piece {
   display: none;
   border: 0 none;
   opacity: 0;
@@ -683,6 +634,12 @@ Array [
   display: none;
 }
 
+@media (max-width:599px) {
+  .emotion-23 {
+    display: none;
+  }
+}
+
 .emotion-1 {
   color: inherit;
   -webkit-text-decoration: inherit;
@@ -691,10 +648,10 @@ Array [
 }
 
 <div
-    class="emotion-28"
+    class="emotion-29"
   >
     <div
-      class="emotion-27"
+      class="emotion-28"
     >
       <div
         class="emotion-19"
@@ -787,25 +744,28 @@ Array [
         </button>
       </div>
       <div
-        class="emotion-26"
+        class="emotion-27"
       >
-        <button
-          class="emotion-22"
-          title="Go full screen"
+        <span
+          class="emotion-23"
         >
-          <svg
-            class="emotion-7"
-            viewBox="0 0 1024 1024"
+          <button
+            class="emotion-8"
+            title="Go full screen"
           >
-            <path
-              class="emotion-6"
-              d="M959.688 920.068l0.31-176c0.040-22.094-17.84-40.032-39.93-40.070-22.092-0.040-40.032 17.838-40.070 39.93l-0.142 79.672-235.734-235.732c-15.622-15.622-40.948-15.622-56.57 0s-15.622 40.948 0 56.568l235.442 235.442-78.946-0.1c-22.092-0.028-40.022 17.86-40.050 39.952-0.014 11.064 4.464 21.084 11.714 28.334 7.228 7.224 17.208 11.702 28.236 11.714l175.688 0.22c22.086 0.028 40.014-17.846 40.052-39.93zM920.178 64.228l-176-0.308c-22.094-0.040-40.032 17.84-40.070 39.93-0.040 22.092 17.838 40.032 39.93 40.070l79.672 0.14-235.732 235.734c-15.622 15.622-15.622 40.948 0 56.568s40.948 15.622 56.568 0l235.442-235.442-0.1 78.946c-0.028 22.092 17.86 40.022 39.952 40.050 11.064 0.014 21.084-4.464 28.334-11.714 7.224-7.228 11.702-17.208 11.714-28.236l0.22-175.688c0.026-22.082-17.846-40.010-39.93-40.050zM64.236 103.742l-0.308 176c-0.040 22.094 17.84 40.032 39.93 40.070 22.092 0.040 40.032-17.84 40.070-39.93l0.14-79.672 235.734 235.73c15.622 15.622 40.948 15.622 56.568 0s15.622-40.946 0-56.566l-235.442-235.442 78.946 0.098c22.092 0.028 40.022-17.86 40.050-39.95 0.014-11.066-4.464-21.086-11.714-28.336-7.228-7.222-17.208-11.7-28.236-11.714l-175.688-0.218c-22.084-0.026-40.012 17.844-40.050 39.93zM103.748 959.766l176 0.308c22.094 0.040 40.032-17.84 40.070-39.93 0.040-22.092-17.84-40.032-39.93-40.070l-79.672-0.14 235.73-235.734c15.622-15.622 15.622-40.948 0-56.568s-40.946-15.622-56.566 0l-235.442 235.442 0.098-78.946c0.028-22.092-17.86-40.022-39.95-40.050-11.066-0.014-21.086 4.464-28.336 11.714-7.222 7.228-11.7 17.208-11.714 28.236l-0.218 175.688c-0.026 22.082 17.844 40.010 39.93 40.050z"
-            />
-          </svg>
-        </button>
+            <svg
+              class="emotion-7"
+              viewBox="0 0 1024 1024"
+            >
+              <path
+                class="emotion-6"
+                d="M959.688 920.068l0.31-176c0.040-22.094-17.84-40.032-39.93-40.070-22.092-0.040-40.032 17.838-40.070 39.93l-0.142 79.672-235.734-235.732c-15.622-15.622-40.948-15.622-56.57 0s-15.622 40.948 0 56.568l235.442 235.442-78.946-0.1c-22.092-0.028-40.022 17.86-40.050 39.952-0.014 11.064 4.464 21.084 11.714 28.334 7.228 7.224 17.208 11.702 28.236 11.714l175.688 0.22c22.086 0.028 40.014-17.846 40.052-39.93zM920.178 64.228l-176-0.308c-22.094-0.040-40.032 17.84-40.070 39.93-0.040 22.092 17.838 40.032 39.93 40.070l79.672 0.14-235.732 235.734c-15.622 15.622-15.622 40.948 0 56.568s40.948 15.622 56.568 0l235.442-235.442-0.1 78.946c-0.028 22.092 17.86 40.022 39.952 40.050 11.064 0.014 21.084-4.464 28.334-11.714 7.224-7.228 11.702-17.208 11.714-28.236l0.22-175.688c0.026-22.082-17.846-40.010-39.93-40.050zM64.236 103.742l-0.308 176c-0.040 22.094 17.84 40.032 39.93 40.070 22.092 0.040 40.032-17.84 40.070-39.93l0.14-79.672 235.734 235.73c15.622 15.622 40.948 15.622 56.568 0s15.622-40.946 0-56.566l-235.442-235.442 78.946 0.098c22.092 0.028 40.022-17.86 40.050-39.95 0.014-11.066-4.464-21.086-11.714-28.336-7.228-7.222-17.208-11.7-28.236-11.714l-175.688-0.218c-22.084-0.026-40.012 17.844-40.050 39.93zM103.748 959.766l176 0.308c22.094 0.040 40.032-17.84 40.070-39.93 0.040-22.092-17.84-40.032-39.93-40.070l-79.672-0.14 235.73-235.734c15.622-15.622 15.622-40.948 0-56.568s-40.946-15.622-56.566 0l-235.442 235.442 0.098-78.946c0.028-22.092-17.86-40.022-39.95-40.050-11.066-0.014-21.086 4.464-28.336 11.714-7.222 7.228-11.7 17.208-11.714 28.236l-0.218 175.688c-0.026 22.082 17.844 40.010 39.93 40.050z"
+              />
+            </svg>
+          </button>
+        </span>
         <button
           class="emotion-8"
-          title="Go full screen"
         >
           <svg
             class="emotion-7"
@@ -813,7 +773,7 @@ Array [
           >
             <path
               class="emotion-6"
-              d="M959.688 920.068l0.31-176c0.040-22.094-17.84-40.032-39.93-40.070-22.092-0.040-40.032 17.838-40.070 39.93l-0.142 79.672-235.734-235.732c-15.622-15.622-40.948-15.622-56.57 0s-15.622 40.948 0 56.568l235.442 235.442-78.946-0.1c-22.092-0.028-40.022 17.86-40.050 39.952-0.014 11.064 4.464 21.084 11.714 28.334 7.228 7.224 17.208 11.702 28.236 11.714l175.688 0.22c22.086 0.028 40.014-17.846 40.052-39.93zM920.178 64.228l-176-0.308c-22.094-0.040-40.032 17.84-40.070 39.93-0.040 22.092 17.838 40.032 39.93 40.070l79.672 0.14-235.732 235.734c-15.622 15.622-15.622 40.948 0 56.568s40.948 15.622 56.568 0l235.442-235.442-0.1 78.946c-0.028 22.092 17.86 40.022 39.952 40.050 11.064 0.014 21.084-4.464 28.334-11.714 7.224-7.228 11.702-17.208 11.714-28.236l0.22-175.688c0.026-22.082-17.846-40.010-39.93-40.050zM64.236 103.742l-0.308 176c-0.040 22.094 17.84 40.032 39.93 40.070 22.092 0.040 40.032-17.84 40.070-39.93l0.14-79.672 235.734 235.73c15.622 15.622 40.948 15.622 56.568 0s15.622-40.946 0-56.566l-235.442-235.442 78.946 0.098c22.092 0.028 40.022-17.86 40.050-39.95 0.014-11.066-4.464-21.086-11.714-28.336-7.228-7.222-17.208-11.7-28.236-11.714l-175.688-0.218c-22.084-0.026-40.012 17.844-40.050 39.93zM103.748 959.766l176 0.308c22.094 0.040 40.032-17.84 40.070-39.93 0.040-22.092-17.84-40.032-39.93-40.070l-79.672-0.14 235.73-235.734c15.622-15.622 15.622-40.948 0-56.568s-40.946-15.622-56.566 0l-235.442 235.442 0.098-78.946c0.028-22.092-17.86-40.022-39.95-40.050-11.066-0.014-21.086 4.464-28.336 11.714-7.222 7.228-11.7 17.208-11.714 28.236l-0.218 175.688c-0.026 22.082 17.844 40.010 39.93 40.050z"
+              d="M896.006 920c0 22.090-17.91 40-40 40h-688.006c-22.090 0-40-17.906-40-40v-549.922c-0.838-3.224-1.33-6.588-1.33-10.072 0-22.090 17.908-40.004 40-40.004h178.66c22.092 0.004 40 17.914 40 40.004 0 22.088-17.908 40-40 40h-137.33v479.996h607.998v-479.996h-138.658c-22.090 0-40-17.912-40-40 0-22.090 17.906-40.004 40-40.004h178.658c22.090 0 40 17.91 40 40v559.844c0 0.050 0.008 0.102 0.008 0.154zM665.622 200.168l-124.452-124.45c-8.042-8.042-18.65-11.912-29.186-11.674-1.612-0.034-3.222 0-4.828 0.16-0.558 0.054-1.098 0.16-1.648 0.238-0.742 0.104-1.484 0.192-2.218 0.338-0.656 0.13-1.29 0.31-1.934 0.472-0.622 0.154-1.244 0.292-1.86 0.476-0.64 0.196-1.258 0.436-1.886 0.66-0.602 0.216-1.208 0.414-1.802 0.66-0.598 0.248-1.17 0.54-1.754 0.814-0.598 0.282-1.202 0.546-1.788 0.86-0.578 0.312-1.13 0.664-1.694 1-0.552 0.332-1.116 0.644-1.654 1.006-0.67 0.448-1.3 0.942-1.942 1.426-0.394 0.302-0.806 0.576-1.196 0.894-1.046 0.858-2.052 1.768-3.008 2.726l-124.398 124.39c-15.622 15.62-15.618 40.948 0.002 56.57 15.622 15.62 40.95 15.62 56.568 0l56.164-56.166v439.426c0 22.094 17.912 40 40.002 40 22.092 0 40-17.91 40-40v-441.202l57.942 57.942c15.622 15.624 40.948 15.62 56.568 0 15.626-15.618 15.626-40.946 0.002-56.566z"
             />
           </svg>
         </button>
diff --git a/lib/ui/src/components/preview/preview.js b/lib/ui/src/components/preview/preview.js
index 480a1a556a6..9a920482143 100644
--- a/lib/ui/src/components/preview/preview.js
+++ b/lib/ui/src/components/preview/preview.js
@@ -1,3 +1,4 @@
+import window from 'global';
 import React, { Component, Fragment } from 'react';
 import PropTypes from 'prop-types';
 import memoize from 'memoizerific';
@@ -18,7 +19,7 @@ import { Grid, Background, BackgroundProvider, BackgroundConsumer } from './back
 
 import { IFrame } from './iframe';
 
-const DesktopOnlyIconButton = styled(IconButton)({
+const DesktopOnly = styled.span({
   // Hides full screen icon at mobile breakpoint defined in app.js
   '@media (max-width: 599px)': {
     display: 'none',
@@ -77,7 +78,7 @@ const defaultWrappers = [
 ];
 
 const getTools = memoize(10)(
-  (getElements, panels, actions, options, storyId, viewMode, location, path) => {
+  (getElements, panels, actions, options, storyId, viewMode, location, path, baseUrl) => {
     const tools = getElementList(getElements, types.TOOL, [
       panels.filter(p => p.id !== 'canvas').length
         ? {
@@ -135,24 +136,22 @@ const getTools = memoize(10)(
       {
         match: p => p.viewMode === 'story',
         render: () => (
-          <DesktopOnlyIconButton
-            key="full"
-            onClick={actions.toggleFullscreen}
-            title="Go full screen"
-          >
-            <Icons icon={options.isFullscreen ? 'close' : 'expand'} />
-          </DesktopOnlyIconButton>
+          <DesktopOnly>
+            <IconButton
+              key="full"
+              onClick={actions.toggleFullscreen}
+              title={options.isFullscreen ? 'Exit full screen' : 'Go full screen'}
+            >
+              <Icons icon={options.isFullscreen ? 'close' : 'expand'} />
+            </IconButton>
+          </DesktopOnly>
         ),
       },
       {
         match: p => p.viewMode === 'story',
         render: () => (
-          <IconButton
-            key="full"
-            onClick={actions.toggleFullscreen}
-            title={options.isFullscreen ? 'Exit full screen' : 'Go full screen'}
-          >
-            <Icons icon={options.isFullscreen ? 'close' : 'expand'} />
+          <IconButton key="opener" onClick={() => window.open(`${baseUrl}?id=${storyId}`)}>
+            <Icons icon="share" />
           </IconButton>
         ),
       },

From 9fa7ff635a96701f40c7a4e297cd6b807cd38a22 Mon Sep 17 00:00:00 2001
From: Tom Coleman <tom@percolatestudio.com>
Date: Mon, 25 Feb 2019 10:08:29 +1100
Subject: [PATCH 079/249] Merge pull request #5732 from
 storybooks/minor-v5-styling-polish

About page styling QA
---
 .../__snapshots__/about.stories.storyshot       | 17 ++++++++++++++++-
 lib/ui/src/settings/about.js                    |  6 ++++--
 2 files changed, 20 insertions(+), 3 deletions(-)

diff --git a/lib/ui/src/settings/__snapshots__/about.stories.storyshot b/lib/ui/src/settings/__snapshots__/about.stories.storyshot
index 871c8913c45..1be5b37f9bc 100644
--- a/lib/ui/src/settings/__snapshots__/about.stories.storyshot
+++ b/lib/ui/src/settings/__snapshots__/about.stories.storyshot
@@ -396,8 +396,10 @@ exports[`Storyshots UI|Settings/AboutScreen failed to fetch new version 1`] = `
   background: #FEDED2;
   color: #FF4400;
   font-weight: 700;
+  font-size: 14px;
   padding: 10px 20px;
   margin-bottom: 24px;
+  border-radius: 4px;
   border: 1px solid rgba(0,0,0,.1);
   text-align: center;
 }
@@ -917,6 +919,11 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   -webkit-justify-content: space-between;
   -ms-flex-pack: justify;
   justify-content: space-between;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  margin-bottom: .75rem;
 }
 
 .emotion-11 {
@@ -1444,15 +1451,16 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   background: #E1FFD4;
   color: #66BF3C;
   font-weight: 700;
+  font-size: 14px;
   padding: 10px 20px;
   margin-bottom: 24px;
+  border-radius: 4px;
   border: 1px solid rgba(0,0,0,.1);
   text-align: center;
 }
 
 .emotion-31 {
   margin-top: 20px;
-  padding-bottom: 20px;
   border-top: 1px solid rgba(0,0,0,.1);
 }
 
@@ -2298,8 +2306,10 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   background: #EAF3FC;
   color: #333333;
   font-weight: 700;
+  font-size: 14px;
   padding: 10px 20px;
   margin-bottom: 24px;
+  border-radius: 4px;
   border: 1px solid rgba(0,0,0,.1);
   text-align: center;
 }
@@ -2313,6 +2323,11 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   -webkit-justify-content: space-between;
   -ms-flex-pack: justify;
   justify-content: space-between;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  margin-bottom: .75rem;
 }
 
 .emotion-11 {
diff --git a/lib/ui/src/settings/about.js b/lib/ui/src/settings/about.js
index c2a548bcf9e..c961d6a8e1e 100644
--- a/lib/ui/src/settings/about.js
+++ b/lib/ui/src/settings/about.js
@@ -50,6 +50,8 @@ const SubheadingLink = styled(Link)(({ theme }) => ({
 const Subheader = styled.div({
   display: 'flex',
   justifyContent: 'space-between',
+  alignItems: 'center',
+  marginBottom: '.75rem',
 });
 
 const UpdateMessage = styled.div(
@@ -65,9 +67,10 @@ const UpdateMessage = styled.div(
 
   ({ theme }) => ({
     fontWeight: theme.typography.weight.bold,
+    fontSize: theme.typography.size.s2,
     padding: '10px 20px',
     marginBottom: 24,
-    borderRadius: theme.borderRadius,
+    borderRadius: theme.appBorderRadius,
     border: `1px solid ${theme.appBorderColor}`,
     textAlign: 'center',
   })
@@ -80,7 +83,6 @@ const ErrorMessage = styled.div(({ theme }) => ({
 
 const Upgrade = styled.div(({ theme }) => ({
   marginTop: 20,
-  paddingBottom: 20,
   borderTop: `1px solid ${theme.appBorderColor}`,
 }));
 

From 2839facc82943064c2b87641bffdc1b3ed7b8671 Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Mon, 25 Feb 2019 02:04:06 +0100
Subject: [PATCH 080/249] Merge pull request #5741 from
 storybooks/fix/bad-mockdata

FIX bad mockdata
---
 lib/ui/src/components/sidebar/treeview/treeview.mockdata.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/lib/ui/src/components/sidebar/treeview/treeview.mockdata.js b/lib/ui/src/components/sidebar/treeview/treeview.mockdata.js
index 76f4992b5ac..e8f50a20865 100644
--- a/lib/ui/src/components/sidebar/treeview/treeview.mockdata.js
+++ b/lib/ui/src/components/sidebar/treeview/treeview.mockdata.js
@@ -66,8 +66,8 @@ export const mockDataset = {
     },
     '2-22': {
       isRoot: false,
-      isLeaf: false,
-      isComponent: true,
+      isLeaf: true,
+      isComponent: false,
       id: '2-22',
       depth: 1,
       name: 'Child B2',

From 268100fe1dee31f8370ed35b7c74bac4be6d4cbc Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Mon, 25 Feb 2019 22:45:20 +0800
Subject: [PATCH 081/249] Merge pull request #5751 from
 storybooks/fix/actions-performance

FIX performance issue with addon-actions by upgrading to telejson 2.1
---
 lib/channel-postmessage/package.json | 2 +-
 yarn.lock                            | 9 +++++----
 2 files changed, 6 insertions(+), 5 deletions(-)

diff --git a/lib/channel-postmessage/package.json b/lib/channel-postmessage/package.json
index f243526e24a..247c544da66 100644
--- a/lib/channel-postmessage/package.json
+++ b/lib/channel-postmessage/package.json
@@ -23,7 +23,7 @@
     "@storybook/channels": "5.0.0-rc.5",
     "@storybook/client-logger": "5.0.0-rc.5",
     "global": "^4.3.2",
-    "telejson": "^2.0.0"
+    "telejson": "^2.1.0"
   },
   "devDependencies": {
     "@types/json-stringify-safe": "^5.0.0"
diff --git a/yarn.lock b/yarn.lock
index f628798a48a..dffc9122a47 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -20052,10 +20052,10 @@ tar@^4, tar@^4.4.8:
     safe-buffer "^5.1.2"
     yallist "^3.0.2"
 
-telejson@^2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/telejson/-/telejson-2.0.0.tgz#3bde0d8efc73b9410e51519e8f1e3952d51bafa3"
-  integrity sha512-NfJ8FLvYk7RiwBWw3QfsPz4kUK7lOFhL1KrtumlSnc9XAeD87T10ZrsfP3tbJdsPEPdwWA78x5VCEHtcs9foYQ==
+telejson@^2.1.0:
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/telejson/-/telejson-2.1.0.tgz#cd362a695929ac6fccc0491827fe05f60d63fcc2"
+  integrity sha512-wLaH1Yu50xlfwLscqIvnAfBjMbILF6OWpMsHlK91dWyZJX3adxgt6YgRTRQiKHJr5INEx0oKSYOaOHfRqpdtzg==
   dependencies:
     global "^4.3.2"
     is-function "^1.0.1"
@@ -20063,6 +20063,7 @@ telejson@^2.0.0:
     is-symbol "^1.0.2"
     isobject "^3.0.1"
     lodash.get "^4.4.2"
+    memoizerific "^1.11.3"
     safe-eval "^0.4.1"
 
 temp-dir@^1.0.0:

From 75073633fad0ab320ba362e74144785532fd6ee6 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Mon, 25 Feb 2019 23:54:51 +0800
Subject: [PATCH 082/249] 5.0.0-rc.6 changelog

---
 CHANGELOG.md | 9 +++++++++
 1 file changed, 9 insertions(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 03f72a1de6f..f0325059cdd 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,12 @@
+## 5.0.0-rc.6 (February 25, 2019)
+
+### Bug Fixes
+
+* Addon-actions: FIX performance by upgrading to telejson 2.1 ([#5751](https://github.com/storybooks/storybook/pull/5751))
+* UI: FIX bad treeview mockdata ([#5741](https://github.com/storybooks/storybook/pull/5741))
+* UI: About page styling fixes ([#5732](https://github.com/storybooks/storybook/pull/5732))
+* UI: Restore the toolbar eject button ([#5737](https://github.com/storybooks/storybook/pull/5737))
+
 ## 5.0.0-rc.5 (February 23, 2019)
 
 ### Bug Fixes

From 70ab48e02c501c401c15e73630919ff1bd2140f7 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Tue, 26 Feb 2019 00:03:55 +0800
Subject: [PATCH 083/249] v5.0.0-rc.6

---
 addons/a11y/package.json                      | 12 ++---
 addons/actions/package.json                   | 10 ++--
 addons/backgrounds/package.json               | 12 ++---
 addons/centered/package.json                  |  2 +-
 addons/cssresources/package.json              | 10 ++--
 addons/events/package.json                    |  8 +--
 addons/google-analytics/package.json          |  6 +--
 addons/graphql/package.json                   |  2 +-
 addons/info/package.json                      | 10 ++--
 addons/jest/package.json                      | 10 ++--
 addons/knobs/package.json                     | 10 ++--
 addons/links/package.json                     |  6 +--
 addons/notes/package.json                     | 12 ++---
 addons/ondevice-backgrounds/package.json      |  4 +-
 addons/ondevice-knobs/package.json            |  4 +-
 addons/ondevice-notes/package.json            |  4 +-
 addons/options/package.json                   |  4 +-
 .../storyshots/storyshots-core/package.json   |  4 +-
 .../storyshots-puppeteer/package.json         |  6 +--
 addons/storysource/package.json               | 10 ++--
 addons/viewport/package.json                  | 12 ++---
 app/angular/package.json                      |  6 +--
 app/ember/package.json                        |  4 +-
 app/html/package.json                         |  4 +-
 app/marko/package.json                        |  4 +-
 app/mithril/package.json                      |  4 +-
 app/polymer/package.json                      |  4 +-
 app/preact/package.json                       |  4 +-
 app/react-native/package.json                 | 14 ++---
 app/react/package.json                        |  8 +--
 app/riot/package.json                         |  4 +-
 app/svelte/package.json                       |  4 +-
 app/vue/package.json                          |  4 +-
 examples/angular-cli/package.json             | 26 ++++-----
 examples/cra-kitchen-sink/package.json        | 32 +++++------
 examples/cra-ts-kitchen-sink/package.json     | 12 ++---
 examples/ember-cli/package.json               | 26 ++++-----
 examples/html-kitchen-sink/package.json       | 36 ++++++-------
 examples/marko-cli/package.json               | 14 ++---
 examples/mithril-kitchen-sink/package.json    | 26 ++++-----
 examples/official-storybook/package.json      | 48 ++++++++---------
 examples/polymer-cli/package.json             | 20 +++----
 examples/preact-kitchen-sink/package.json     | 26 ++++-----
 examples/riot-kitchen-sink/package.json       | 26 ++++-----
 examples/svelte-kitchen-sink/package.json     | 26 ++++-----
 examples/vue-kitchen-sink/package.json        | 26 ++++-----
 lerna.json                                    |  2 +-
 lib/addons/package.json                       |  6 +--
 lib/channel-postmessage/package.json          |  6 +--
 lib/channel-websocket/package.json            |  4 +-
 lib/channels/package.json                     |  2 +-
 lib/cli/package.json                          | 54 +++++++++----------
 lib/client-api/package.json                   | 10 ++--
 lib/client-logger/package.json                |  2 +-
 lib/codemod/package.json                      |  2 +-
 lib/components/package.json                   | 12 ++---
 lib/core-events/package.json                  |  2 +-
 lib/core/package.json                         | 20 +++----
 lib/node-logger/package.json                  |  2 +-
 lib/router/package.json                       |  4 +-
 lib/theming/package.json                      |  4 +-
 lib/ui/package.json                           | 14 ++---
 62 files changed, 356 insertions(+), 356 deletions(-)

diff --git a/addons/a11y/package.json b/addons/a11y/package.json
index 70987fec8b7..05cdd93127a 100644
--- a/addons/a11y/package.json
+++ b/addons/a11y/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-a11y",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "a11y addon for storybook",
   "keywords": [
     "a11y",
@@ -25,11 +25,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.5",
-    "@storybook/client-logger": "5.0.0-rc.5",
-    "@storybook/components": "5.0.0-rc.5",
-    "@storybook/core-events": "5.0.0-rc.5",
-    "@storybook/theming": "5.0.0-rc.5",
+    "@storybook/addons": "5.0.0-rc.6",
+    "@storybook/client-logger": "5.0.0-rc.6",
+    "@storybook/components": "5.0.0-rc.6",
+    "@storybook/core-events": "5.0.0-rc.6",
+    "@storybook/theming": "5.0.0-rc.6",
     "axe-core": "^3.1.2",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
diff --git a/addons/actions/package.json b/addons/actions/package.json
index dc313c645ba..0e6e860beda 100644
--- a/addons/actions/package.json
+++ b/addons/actions/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-actions",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "Action Logger addon for storybook",
   "keywords": [
     "storybook"
@@ -20,10 +20,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.5",
-    "@storybook/components": "5.0.0-rc.5",
-    "@storybook/core-events": "5.0.0-rc.5",
-    "@storybook/theming": "5.0.0-rc.5",
+    "@storybook/addons": "5.0.0-rc.6",
+    "@storybook/components": "5.0.0-rc.6",
+    "@storybook/core-events": "5.0.0-rc.6",
+    "@storybook/theming": "5.0.0-rc.6",
     "core-js": "^2.6.2",
     "fast-deep-equal": "^2.0.1",
     "global": "^4.3.2",
diff --git a/addons/backgrounds/package.json b/addons/backgrounds/package.json
index d5fa51225e9..42025cc1f81 100644
--- a/addons/backgrounds/package.json
+++ b/addons/backgrounds/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-backgrounds",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "A storybook addon to show different backgrounds for your preview",
   "keywords": [
     "addon",
@@ -24,11 +24,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.5",
-    "@storybook/client-logger": "5.0.0-rc.5",
-    "@storybook/components": "5.0.0-rc.5",
-    "@storybook/core-events": "5.0.0-rc.5",
-    "@storybook/theming": "5.0.0-rc.5",
+    "@storybook/addons": "5.0.0-rc.6",
+    "@storybook/client-logger": "5.0.0-rc.6",
+    "@storybook/components": "5.0.0-rc.6",
+    "@storybook/core-events": "5.0.0-rc.6",
+    "@storybook/theming": "5.0.0-rc.6",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
diff --git a/addons/centered/package.json b/addons/centered/package.json
index 099445e57ca..99da816e144 100644
--- a/addons/centered/package.json
+++ b/addons/centered/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-centered",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "Storybook decorator to center components",
   "keywords": [
     "addon",
diff --git a/addons/cssresources/package.json b/addons/cssresources/package.json
index 20d018c144c..776008d9f45 100644
--- a/addons/cssresources/package.json
+++ b/addons/cssresources/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-cssresources",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "A storybook addon to switch between css resources at runtime for your story",
   "keywords": [
     "addon",
@@ -24,10 +24,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.5",
-    "@storybook/channels": "5.0.0-rc.5",
-    "@storybook/components": "5.0.0-rc.5",
-    "@storybook/core-events": "5.0.0-rc.5",
+    "@storybook/addons": "5.0.0-rc.6",
+    "@storybook/channels": "5.0.0-rc.6",
+    "@storybook/components": "5.0.0-rc.6",
+    "@storybook/core-events": "5.0.0-rc.6",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "prop-types": "^15.6.2",
diff --git a/addons/events/package.json b/addons/events/package.json
index 3ccd42d74a6..5e73d21097a 100644
--- a/addons/events/package.json
+++ b/addons/events/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-events",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "Add events to your Storybook stories.",
   "keywords": [
     "addon",
@@ -23,9 +23,9 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.5",
-    "@storybook/core-events": "5.0.0-rc.5",
-    "@storybook/theming": "5.0.0-rc.5",
+    "@storybook/addons": "5.0.0-rc.6",
+    "@storybook/core-events": "5.0.0-rc.6",
+    "@storybook/theming": "5.0.0-rc.6",
     "core-js": "^2.6.2",
     "format-json": "^1.0.3",
     "prop-types": "^15.6.2",
diff --git a/addons/google-analytics/package.json b/addons/google-analytics/package.json
index 45d67fe3f14..4ce7bc28dcc 100644
--- a/addons/google-analytics/package.json
+++ b/addons/google-analytics/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-google-analytics",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "Storybook addon for google analytics",
   "keywords": [
     "addon",
@@ -19,8 +19,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.5",
-    "@storybook/core-events": "5.0.0-rc.5",
+    "@storybook/addons": "5.0.0-rc.6",
+    "@storybook/core-events": "5.0.0-rc.6",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "react-ga": "^2.5.3"
diff --git a/addons/graphql/package.json b/addons/graphql/package.json
index 55648a3e6cc..3a9d79a448b 100644
--- a/addons/graphql/package.json
+++ b/addons/graphql/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-graphql",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "Storybook addon to display the GraphiQL IDE",
   "keywords": [
     "addon",
diff --git a/addons/info/package.json b/addons/info/package.json
index 8a061330a3d..d57de0c3fb1 100644
--- a/addons/info/package.json
+++ b/addons/info/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-info",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "A Storybook addon to show additional information for your stories.",
   "keywords": [
     "addon",
@@ -21,10 +21,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.5",
-    "@storybook/client-logger": "5.0.0-rc.5",
-    "@storybook/components": "5.0.0-rc.5",
-    "@storybook/theming": "5.0.0-rc.5",
+    "@storybook/addons": "5.0.0-rc.6",
+    "@storybook/client-logger": "5.0.0-rc.6",
+    "@storybook/components": "5.0.0-rc.6",
+    "@storybook/theming": "5.0.0-rc.6",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "marksy": "^6.1.0",
diff --git a/addons/jest/package.json b/addons/jest/package.json
index 56155ea43bd..59306e838a2 100644
--- a/addons/jest/package.json
+++ b/addons/jest/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-jest",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "React storybook addon that show component jest report",
   "keywords": [
     "addon",
@@ -27,10 +27,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.5",
-    "@storybook/components": "5.0.0-rc.5",
-    "@storybook/core-events": "5.0.0-rc.5",
-    "@storybook/theming": "5.0.0-rc.5",
+    "@storybook/addons": "5.0.0-rc.6",
+    "@storybook/components": "5.0.0-rc.6",
+    "@storybook/core-events": "5.0.0-rc.6",
+    "@storybook/theming": "5.0.0-rc.6",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "prop-types": "^15.6.2",
diff --git a/addons/knobs/package.json b/addons/knobs/package.json
index 30f8f323ea4..b0ea3a68a11 100644
--- a/addons/knobs/package.json
+++ b/addons/knobs/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-knobs",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "Storybook Addon Prop Editor Component",
   "keywords": [
     "addon",
@@ -21,10 +21,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.5",
-    "@storybook/components": "5.0.0-rc.5",
-    "@storybook/core-events": "5.0.0-rc.5",
-    "@storybook/theming": "5.0.0-rc.5",
+    "@storybook/addons": "5.0.0-rc.6",
+    "@storybook/components": "5.0.0-rc.6",
+    "@storybook/core-events": "5.0.0-rc.6",
+    "@storybook/theming": "5.0.0-rc.6",
     "copy-to-clipboard": "^3.0.8",
     "core-js": "^2.6.2",
     "escape-html": "^1.0.3",
diff --git a/addons/links/package.json b/addons/links/package.json
index bd8b72829cd..2f33e1cf9cb 100644
--- a/addons/links/package.json
+++ b/addons/links/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-links",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "Story Links addon for storybook",
   "keywords": [
     "addon",
@@ -21,8 +21,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.5",
-    "@storybook/core-events": "5.0.0-rc.5",
+    "@storybook/addons": "5.0.0-rc.6",
+    "@storybook/core-events": "5.0.0-rc.6",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/addons/notes/package.json b/addons/notes/package.json
index e991165371a..b8ebabc14d0 100644
--- a/addons/notes/package.json
+++ b/addons/notes/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-notes",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "Write notes for your Storybook stories.",
   "keywords": [
     "addon",
@@ -22,11 +22,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.5",
-    "@storybook/client-logger": "5.0.0-rc.5",
-    "@storybook/components": "5.0.0-rc.5",
-    "@storybook/core-events": "5.0.0-rc.5",
-    "@storybook/theming": "5.0.0-rc.5",
+    "@storybook/addons": "5.0.0-rc.6",
+    "@storybook/client-logger": "5.0.0-rc.6",
+    "@storybook/components": "5.0.0-rc.6",
+    "@storybook/core-events": "5.0.0-rc.6",
+    "@storybook/theming": "5.0.0-rc.6",
     "markdown-to-jsx": "^6.9.1",
     "prop-types": "^15.6.2",
     "util-deprecate": "^1.0.2"
diff --git a/addons/ondevice-backgrounds/package.json b/addons/ondevice-backgrounds/package.json
index 3f5593d7000..447cef3a4b9 100644
--- a/addons/ondevice-backgrounds/package.json
+++ b/addons/ondevice-backgrounds/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/addon-ondevice-backgrounds",
   "private": true,
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "A storybook addon to show different backgrounds for your preview",
   "keywords": [
     "addon",
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.5",
+    "@storybook/addons": "5.0.0-rc.6",
     "core-js": "^2.6.2",
     "prop-types": "^15.6.2"
   },
diff --git a/addons/ondevice-knobs/package.json b/addons/ondevice-knobs/package.json
index 47b1b958602..d363f320e32 100644
--- a/addons/ondevice-knobs/package.json
+++ b/addons/ondevice-knobs/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/addon-ondevice-knobs",
   "private": true,
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "Display storybook story knobs on your deviced.",
   "keywords": [
     "addon",
@@ -21,7 +21,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.5",
+    "@storybook/addons": "5.0.0-rc.6",
     "core-js": "^2.6.2",
     "deep-equal": "^1.0.1",
     "prop-types": "^15.6.2",
diff --git a/addons/ondevice-notes/package.json b/addons/ondevice-notes/package.json
index c396fd40920..85943398f45 100644
--- a/addons/ondevice-notes/package.json
+++ b/addons/ondevice-notes/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/addon-ondevice-notes",
   "private": true,
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "Write notes for your Storybook stories.",
   "keywords": [
     "addon",
@@ -19,7 +19,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.5",
+    "@storybook/addons": "5.0.0-rc.6",
     "core-js": "^2.6.2",
     "prop-types": "^15.6.2",
     "react-native-simple-markdown": "^1.1.0"
diff --git a/addons/options/package.json b/addons/options/package.json
index 3ca1ebd53a3..9bdb8e3692a 100644
--- a/addons/options/package.json
+++ b/addons/options/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-options",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "Options addon for storybook",
   "keywords": [
     "addon",
@@ -20,7 +20,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.5",
+    "@storybook/addons": "5.0.0-rc.6",
     "core-js": "^2.6.2",
     "util-deprecate": "^1.0.2"
   },
diff --git a/addons/storyshots/storyshots-core/package.json b/addons/storyshots/storyshots-core/package.json
index 2b5d8ea33d3..2baddc34277 100644
--- a/addons/storyshots/storyshots-core/package.json
+++ b/addons/storyshots/storyshots-core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storyshots",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "StoryShots is a Jest Snapshot Testing Addon for Storybook.",
   "keywords": [
     "addon",
@@ -24,7 +24,7 @@
     "storybook": "start-storybook -p 6006"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.5",
+    "@storybook/addons": "5.0.0-rc.6",
     "core-js": "^2.6.2",
     "glob": "^7.1.3",
     "global": "^4.3.2",
diff --git a/addons/storyshots/storyshots-puppeteer/package.json b/addons/storyshots/storyshots-puppeteer/package.json
index 63a4362a275..f030e4d91b3 100644
--- a/addons/storyshots/storyshots-puppeteer/package.json
+++ b/addons/storyshots/storyshots-puppeteer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storyshots-puppeteer",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "Image snappshots addition to StoryShots base on puppeteer",
   "keywords": [
     "addon",
@@ -21,8 +21,8 @@
     "prepare": "node ../../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/node-logger": "5.0.0-rc.5",
-    "@storybook/router": "5.0.0-rc.5",
+    "@storybook/node-logger": "5.0.0-rc.6",
+    "@storybook/router": "5.0.0-rc.6",
     "core-js": "^2.6.2",
     "jest-image-snapshot": "^2.6.0",
     "puppeteer": "^1.12.0",
diff --git a/addons/storysource/package.json b/addons/storysource/package.json
index 58ed1940003..a38ea95c349 100644
--- a/addons/storysource/package.json
+++ b/addons/storysource/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storysource",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "Stories addon for storybook",
   "keywords": [
     "addon",
@@ -21,10 +21,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.5",
-    "@storybook/components": "5.0.0-rc.5",
-    "@storybook/router": "5.0.0-rc.5",
-    "@storybook/theming": "5.0.0-rc.5",
+    "@storybook/addons": "5.0.0-rc.6",
+    "@storybook/components": "5.0.0-rc.6",
+    "@storybook/router": "5.0.0-rc.6",
+    "@storybook/theming": "5.0.0-rc.6",
     "core-js": "^2.6.2",
     "estraverse": "^4.2.0",
     "loader-utils": "^1.2.1",
diff --git a/addons/viewport/package.json b/addons/viewport/package.json
index 697333802c1..23fbd8ce711 100644
--- a/addons/viewport/package.json
+++ b/addons/viewport/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-viewport",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "Storybook addon to change the viewport size to mobile",
   "keywords": [
     "addon",
@@ -20,11 +20,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.5",
-    "@storybook/client-logger": "5.0.0-rc.5",
-    "@storybook/components": "5.0.0-rc.5",
-    "@storybook/core-events": "5.0.0-rc.5",
-    "@storybook/theming": "5.0.0-rc.5",
+    "@storybook/addons": "5.0.0-rc.6",
+    "@storybook/client-logger": "5.0.0-rc.6",
+    "@storybook/components": "5.0.0-rc.6",
+    "@storybook/core-events": "5.0.0-rc.6",
+    "@storybook/theming": "5.0.0-rc.6",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
diff --git a/app/angular/package.json b/app/angular/package.json
index cc0a7d38b91..994d5e52b05 100644
--- a/app/angular/package.json
+++ b/app/angular/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/angular",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "Storybook for Angular: Develop Angular Components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,8 +25,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.5",
-    "@storybook/node-logger": "5.0.0-rc.5",
+    "@storybook/core": "5.0.0-rc.6",
+    "@storybook/node-logger": "5.0.0-rc.6",
     "angular2-template-loader": "^0.6.2",
     "core-js": "^2.6.2",
     "fork-ts-checker-webpack-plugin": "^0.5.2",
diff --git a/app/ember/package.json b/app/ember/package.json
index ffc666185d4..f617a752b6f 100644
--- a/app/ember/package.json
+++ b/app/ember/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/ember",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "Storybook for Ember: Develop Ember Component in isolation with Hot Reloading.",
   "homepage": "https://github.com/storybooks/storybook/tree/master/app/ember",
   "bugs": {
@@ -23,7 +23,7 @@
   },
   "dependencies": {
     "@ember/test-helpers": "^1.3.1",
-    "@storybook/core": "5.0.0-rc.5",
+    "@storybook/core": "5.0.0-rc.6",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/html/package.json b/app/html/package.json
index 9dab02ce3f8..d1d624b53db 100644
--- a/app/html/package.json
+++ b/app/html/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/html",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "Storybook for HTML: View HTML snippets in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.5",
+    "@storybook/core": "5.0.0-rc.6",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/marko/package.json b/app/marko/package.json
index d50cb6f6dfa..fc38d2016cd 100644
--- a/app/marko/package.json
+++ b/app/marko/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/marko",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "Storybook for Marko: Develop Marko Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.5",
+    "@storybook/core": "5.0.0-rc.6",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/mithril/package.json b/app/mithril/package.json
index 296359c4edb..20f56ad4fac 100644
--- a/app/mithril/package.json
+++ b/app/mithril/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/mithril",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "Storybook for Mithril: Develop Mithril Component in isolation.",
   "keywords": [
     "storybook"
@@ -26,7 +26,7 @@
   },
   "dependencies": {
     "@babel/plugin-transform-react-jsx": "^7.3.0",
-    "@storybook/core": "5.0.0-rc.5",
+    "@storybook/core": "5.0.0-rc.6",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/polymer/package.json b/app/polymer/package.json
index d047703c716..e534591af7b 100644
--- a/app/polymer/package.json
+++ b/app/polymer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/polymer",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "Storybook for Polymer: Develop Polymer components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.5",
+    "@storybook/core": "5.0.0-rc.6",
     "@webcomponents/webcomponentsjs": "^1.2.0",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
diff --git a/app/preact/package.json b/app/preact/package.json
index 8df40a91301..24aeb4f6821 100644
--- a/app/preact/package.json
+++ b/app/preact/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/preact",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "Storybook for Preact: Develop Preact Component in isolation.",
   "keywords": [
     "storybook"
@@ -26,7 +26,7 @@
   },
   "dependencies": {
     "@babel/plugin-transform-react-jsx": "^7.3.0",
-    "@storybook/core": "5.0.0-rc.5",
+    "@storybook/core": "5.0.0-rc.6",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/react-native/package.json b/app/react-native/package.json
index 51954dd388b..6898373cb0e 100644
--- a/app/react-native/package.json
+++ b/app/react-native/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/react-native",
   "private": true,
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "A better way to develop React Native Components for your app",
   "keywords": [
     "react",
@@ -26,12 +26,12 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.5",
-    "@storybook/channel-websocket": "5.0.0-rc.5",
-    "@storybook/channels": "5.0.0-rc.5",
-    "@storybook/core": "5.0.0-rc.5",
-    "@storybook/core-events": "5.0.0-rc.5",
-    "@storybook/ui": "5.0.0-rc.5",
+    "@storybook/addons": "5.0.0-rc.6",
+    "@storybook/channel-websocket": "5.0.0-rc.6",
+    "@storybook/channels": "5.0.0-rc.6",
+    "@storybook/core": "5.0.0-rc.6",
+    "@storybook/core-events": "5.0.0-rc.6",
+    "@storybook/ui": "5.0.0-rc.6",
     "babel-loader": "^8.0.4",
     "babel-plugin-macros": "^2.4.5",
     "babel-plugin-syntax-async-functions": "^6.13.0",
diff --git a/app/react/package.json b/app/react/package.json
index 60af615c4d0..d890b4da7c6 100644
--- a/app/react/package.json
+++ b/app/react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/react",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "Storybook for React: Develop React Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -28,9 +28,9 @@
     "@babel/plugin-transform-react-constant-elements": "^7.2.0",
     "@babel/preset-flow": "^7.0.0",
     "@babel/preset-react": "^7.0.0",
-    "@storybook/core": "5.0.0-rc.5",
-    "@storybook/node-logger": "5.0.0-rc.5",
-    "@storybook/theming": "5.0.0-rc.5",
+    "@storybook/core": "5.0.0-rc.6",
+    "@storybook/node-logger": "5.0.0-rc.6",
+    "@storybook/theming": "5.0.0-rc.6",
     "@svgr/webpack": "^4.0.3",
     "babel-plugin-named-asset-import": "^0.3.0",
     "babel-plugin-react-docgen": "^2.0.2",
diff --git a/app/riot/package.json b/app/riot/package.json
index 0fb03db5065..3be591a0117 100644
--- a/app/riot/package.json
+++ b/app/riot/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/riot",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "Storybook for riot.js: View riot snippets in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.5",
+    "@storybook/core": "5.0.0-rc.6",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/svelte/package.json b/app/svelte/package.json
index 0f61c5aa246..40bfaf4386d 100644
--- a/app/svelte/package.json
+++ b/app/svelte/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/svelte",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "Storybook for Svelte: Develop Svelte Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.5",
+    "@storybook/core": "5.0.0-rc.6",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/vue/package.json b/app/vue/package.json
index 0d0c94001e3..a48c3ad6eef 100644
--- a/app/vue/package.json
+++ b/app/vue/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/vue",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "Storybook for Vue: Develop Vue Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.5",
+    "@storybook/core": "5.0.0-rc.6",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/examples/angular-cli/package.json b/examples/angular-cli/package.json
index 9c918561309..af2067ca76f 100644
--- a/examples/angular-cli/package.json
+++ b/examples/angular-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "angular-cli",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "private": true,
   "license": "MIT",
   "scripts": {
@@ -33,18 +33,18 @@
     "@angular-devkit/build-angular": "^0.11.4",
     "@angular/cli": "^7.3.0",
     "@angular/compiler-cli": "^7.2.1",
-    "@storybook/addon-actions": "5.0.0-rc.5",
-    "@storybook/addon-backgrounds": "5.0.0-rc.5",
-    "@storybook/addon-centered": "5.0.0-rc.5",
-    "@storybook/addon-jest": "5.0.0-rc.5",
-    "@storybook/addon-knobs": "5.0.0-rc.5",
-    "@storybook/addon-links": "5.0.0-rc.5",
-    "@storybook/addon-notes": "5.0.0-rc.5",
-    "@storybook/addon-options": "5.0.0-rc.5",
-    "@storybook/addon-storyshots": "5.0.0-rc.5",
-    "@storybook/addon-storysource": "5.0.0-rc.5",
-    "@storybook/addons": "5.0.0-rc.5",
-    "@storybook/angular": "5.0.0-rc.5",
+    "@storybook/addon-actions": "5.0.0-rc.6",
+    "@storybook/addon-backgrounds": "5.0.0-rc.6",
+    "@storybook/addon-centered": "5.0.0-rc.6",
+    "@storybook/addon-jest": "5.0.0-rc.6",
+    "@storybook/addon-knobs": "5.0.0-rc.6",
+    "@storybook/addon-links": "5.0.0-rc.6",
+    "@storybook/addon-notes": "5.0.0-rc.6",
+    "@storybook/addon-options": "5.0.0-rc.6",
+    "@storybook/addon-storyshots": "5.0.0-rc.6",
+    "@storybook/addon-storysource": "5.0.0-rc.6",
+    "@storybook/addons": "5.0.0-rc.6",
+    "@storybook/angular": "5.0.0-rc.6",
     "@types/core-js": "^2.5.0",
     "@types/jest": "^23.3.13",
     "@types/node": "~10.12.19",
diff --git a/examples/cra-kitchen-sink/package.json b/examples/cra-kitchen-sink/package.json
index a9b422ac0cc..986e07e2066 100644
--- a/examples/cra-kitchen-sink/package.json
+++ b/examples/cra-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "cra-kitchen-sink",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "private": true,
   "scripts": {
     "build": "react-scripts build",
@@ -18,21 +18,21 @@
     "react-lifecycles-compat": "^3.0.4"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.0.0-rc.5",
-    "@storybook/addon-actions": "5.0.0-rc.5",
-    "@storybook/addon-backgrounds": "5.0.0-rc.5",
-    "@storybook/addon-centered": "5.0.0-rc.5",
-    "@storybook/addon-events": "5.0.0-rc.5",
-    "@storybook/addon-info": "5.0.0-rc.5",
-    "@storybook/addon-jest": "5.0.0-rc.5",
-    "@storybook/addon-knobs": "5.0.0-rc.5",
-    "@storybook/addon-links": "5.0.0-rc.5",
-    "@storybook/addon-notes": "5.0.0-rc.5",
-    "@storybook/addon-options": "5.0.0-rc.5",
-    "@storybook/addon-storyshots": "5.0.0-rc.5",
-    "@storybook/addons": "5.0.0-rc.5",
-    "@storybook/client-logger": "5.0.0-rc.5",
-    "@storybook/react": "5.0.0-rc.5",
+    "@storybook/addon-a11y": "5.0.0-rc.6",
+    "@storybook/addon-actions": "5.0.0-rc.6",
+    "@storybook/addon-backgrounds": "5.0.0-rc.6",
+    "@storybook/addon-centered": "5.0.0-rc.6",
+    "@storybook/addon-events": "5.0.0-rc.6",
+    "@storybook/addon-info": "5.0.0-rc.6",
+    "@storybook/addon-jest": "5.0.0-rc.6",
+    "@storybook/addon-knobs": "5.0.0-rc.6",
+    "@storybook/addon-links": "5.0.0-rc.6",
+    "@storybook/addon-notes": "5.0.0-rc.6",
+    "@storybook/addon-options": "5.0.0-rc.6",
+    "@storybook/addon-storyshots": "5.0.0-rc.6",
+    "@storybook/addons": "5.0.0-rc.6",
+    "@storybook/client-logger": "5.0.0-rc.6",
+    "@storybook/react": "5.0.0-rc.6",
     "enzyme": "^3.7.0",
     "enzyme-adapter-react-16": "^1.9.1",
     "enzyme-to-json": "^3.3.4",
diff --git a/examples/cra-ts-kitchen-sink/package.json b/examples/cra-ts-kitchen-sink/package.json
index 2d2dec176e0..01c29733214 100644
--- a/examples/cra-ts-kitchen-sink/package.json
+++ b/examples/cra-ts-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "cra-ts-kitchen-sink",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook -s public",
@@ -19,11 +19,11 @@
     "react-dom": "^16.8.1"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.5",
-    "@storybook/addon-info": "5.0.0-rc.5",
-    "@storybook/addon-options": "5.0.0-rc.5",
-    "@storybook/addons": "5.0.0-rc.5",
-    "@storybook/react": "5.0.0-rc.5",
+    "@storybook/addon-actions": "5.0.0-rc.6",
+    "@storybook/addon-info": "5.0.0-rc.6",
+    "@storybook/addon-options": "5.0.0-rc.6",
+    "@storybook/addons": "5.0.0-rc.6",
+    "@storybook/react": "5.0.0-rc.6",
     "@types/enzyme": "^3.1.15",
     "@types/react": "^16.7.22",
     "@types/react-dom": "^16.0.11",
diff --git a/examples/ember-cli/package.json b/examples/ember-cli/package.json
index edd675900d1..fd34f24989d 100644
--- a/examples/ember-cli/package.json
+++ b/examples/ember-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "ember-example",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "private": true,
   "scripts": {
     "build": "ember build",
@@ -14,18 +14,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.2.2",
-    "@storybook/addon-a11y": "5.0.0-rc.5",
-    "@storybook/addon-actions": "5.0.0-rc.5",
-    "@storybook/addon-backgrounds": "5.0.0-rc.5",
-    "@storybook/addon-centered": "5.0.0-rc.5",
-    "@storybook/addon-knobs": "5.0.0-rc.5",
-    "@storybook/addon-links": "5.0.0-rc.5",
-    "@storybook/addon-notes": "5.0.0-rc.5",
-    "@storybook/addon-options": "5.0.0-rc.5",
-    "@storybook/addon-storysource": "5.0.0-rc.5",
-    "@storybook/addon-viewport": "5.0.0-rc.5",
-    "@storybook/addons": "5.0.0-rc.5",
-    "@storybook/ember": "5.0.0-rc.5",
+    "@storybook/addon-a11y": "5.0.0-rc.6",
+    "@storybook/addon-actions": "5.0.0-rc.6",
+    "@storybook/addon-backgrounds": "5.0.0-rc.6",
+    "@storybook/addon-centered": "5.0.0-rc.6",
+    "@storybook/addon-knobs": "5.0.0-rc.6",
+    "@storybook/addon-links": "5.0.0-rc.6",
+    "@storybook/addon-notes": "5.0.0-rc.6",
+    "@storybook/addon-options": "5.0.0-rc.6",
+    "@storybook/addon-storysource": "5.0.0-rc.6",
+    "@storybook/addon-viewport": "5.0.0-rc.6",
+    "@storybook/addons": "5.0.0-rc.6",
+    "@storybook/ember": "5.0.0-rc.6",
     "babel-loader": "^8",
     "broccoli-asset-rev": "^3.0.0",
     "cross-env": "^5.2.0",
diff --git a/examples/html-kitchen-sink/package.json b/examples/html-kitchen-sink/package.json
index 86d8610eeee..8b3dc974f9d 100644
--- a/examples/html-kitchen-sink/package.json
+++ b/examples/html-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "html-kitchen-sink",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "private": true,
   "description": "",
   "keywords": [],
@@ -13,23 +13,23 @@
     "storybook": "start-storybook -p 9006"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.0.0-rc.5",
-    "@storybook/addon-actions": "5.0.0-rc.5",
-    "@storybook/addon-backgrounds": "5.0.0-rc.5",
-    "@storybook/addon-centered": "5.0.0-rc.5",
-    "@storybook/addon-events": "5.0.0-rc.5",
-    "@storybook/addon-jest": "5.0.0-rc.5",
-    "@storybook/addon-knobs": "5.0.0-rc.5",
-    "@storybook/addon-links": "5.0.0-rc.5",
-    "@storybook/addon-notes": "5.0.0-rc.5",
-    "@storybook/addon-options": "5.0.0-rc.5",
-    "@storybook/addon-storyshots": "5.0.0-rc.5",
-    "@storybook/addon-storysource": "5.0.0-rc.5",
-    "@storybook/addon-viewport": "5.0.0-rc.5",
-    "@storybook/addons": "5.0.0-rc.5",
-    "@storybook/core": "5.0.0-rc.5",
-    "@storybook/core-events": "5.0.0-rc.5",
-    "@storybook/html": "5.0.0-rc.5",
+    "@storybook/addon-a11y": "5.0.0-rc.6",
+    "@storybook/addon-actions": "5.0.0-rc.6",
+    "@storybook/addon-backgrounds": "5.0.0-rc.6",
+    "@storybook/addon-centered": "5.0.0-rc.6",
+    "@storybook/addon-events": "5.0.0-rc.6",
+    "@storybook/addon-jest": "5.0.0-rc.6",
+    "@storybook/addon-knobs": "5.0.0-rc.6",
+    "@storybook/addon-links": "5.0.0-rc.6",
+    "@storybook/addon-notes": "5.0.0-rc.6",
+    "@storybook/addon-options": "5.0.0-rc.6",
+    "@storybook/addon-storyshots": "5.0.0-rc.6",
+    "@storybook/addon-storysource": "5.0.0-rc.6",
+    "@storybook/addon-viewport": "5.0.0-rc.6",
+    "@storybook/addons": "5.0.0-rc.6",
+    "@storybook/core": "5.0.0-rc.6",
+    "@storybook/core-events": "5.0.0-rc.6",
+    "@storybook/html": "5.0.0-rc.6",
     "eventemitter3": "^3.1.0",
     "format-json": "^1.0.3",
     "global": "^4.3.2",
diff --git a/examples/marko-cli/package.json b/examples/marko-cli/package.json
index 402eaab2d61..2570da29c49 100644
--- a/examples/marko-cli/package.json
+++ b/examples/marko-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "marko-cli",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "private": true,
   "description": "Demo of how to build an app using marko-starter",
   "repository": {
@@ -22,12 +22,12 @@
     "marko-starter": "^2.0.4"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.5",
-    "@storybook/addon-knobs": "5.0.0-rc.5",
-    "@storybook/addon-options": "5.0.0-rc.5",
-    "@storybook/addon-storysource": "5.0.0-rc.5",
-    "@storybook/addons": "5.0.0-rc.5",
-    "@storybook/marko": "5.0.0-rc.5",
+    "@storybook/addon-actions": "5.0.0-rc.6",
+    "@storybook/addon-knobs": "5.0.0-rc.6",
+    "@storybook/addon-options": "5.0.0-rc.6",
+    "@storybook/addon-storysource": "5.0.0-rc.6",
+    "@storybook/addons": "5.0.0-rc.6",
+    "@storybook/marko": "5.0.0-rc.6",
     "prettier": "^1.16.4",
     "webpack": "^4.29.0"
   }
diff --git a/examples/mithril-kitchen-sink/package.json b/examples/mithril-kitchen-sink/package.json
index b02352c1d2d..3fc97368264 100644
--- a/examples/mithril-kitchen-sink/package.json
+++ b/examples/mithril-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "mithril-example",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook",
@@ -10,18 +10,18 @@
     "mithril": "^1.1.6"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.5",
-    "@storybook/addon-backgrounds": "5.0.0-rc.5",
-    "@storybook/addon-centered": "5.0.0-rc.5",
-    "@storybook/addon-knobs": "5.0.0-rc.5",
-    "@storybook/addon-links": "5.0.0-rc.5",
-    "@storybook/addon-notes": "5.0.0-rc.5",
-    "@storybook/addon-options": "5.0.0-rc.5",
-    "@storybook/addon-storyshots": "5.0.0-rc.5",
-    "@storybook/addon-storysource": "5.0.0-rc.5",
-    "@storybook/addon-viewport": "5.0.0-rc.5",
-    "@storybook/addons": "5.0.0-rc.5",
-    "@storybook/mithril": "5.0.0-rc.5",
+    "@storybook/addon-actions": "5.0.0-rc.6",
+    "@storybook/addon-backgrounds": "5.0.0-rc.6",
+    "@storybook/addon-centered": "5.0.0-rc.6",
+    "@storybook/addon-knobs": "5.0.0-rc.6",
+    "@storybook/addon-links": "5.0.0-rc.6",
+    "@storybook/addon-notes": "5.0.0-rc.6",
+    "@storybook/addon-options": "5.0.0-rc.6",
+    "@storybook/addon-storyshots": "5.0.0-rc.6",
+    "@storybook/addon-storysource": "5.0.0-rc.6",
+    "@storybook/addon-viewport": "5.0.0-rc.6",
+    "@storybook/addons": "5.0.0-rc.6",
+    "@storybook/mithril": "5.0.0-rc.6",
     "webpack": "^4.29.0"
   }
 }
diff --git a/examples/official-storybook/package.json b/examples/official-storybook/package.json
index c3683f586cb..4ff4c07d4fa 100644
--- a/examples/official-storybook/package.json
+++ b/examples/official-storybook/package.json
@@ -1,6 +1,6 @@
 {
   "name": "official-storybook",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook -c ./ -s built-storybooks",
@@ -12,29 +12,29 @@
     "storybook": "cross-env STORYBOOK_DISPLAY_WARNING=true DISPLAY_WARNING=true start-storybook -p 9011 -c ./ -s built-storybooks --no-dll"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.0.0-rc.5",
-    "@storybook/addon-actions": "5.0.0-rc.5",
-    "@storybook/addon-backgrounds": "5.0.0-rc.5",
-    "@storybook/addon-centered": "5.0.0-rc.5",
-    "@storybook/addon-cssresources": "5.0.0-rc.5",
-    "@storybook/addon-events": "5.0.0-rc.5",
-    "@storybook/addon-graphql": "5.0.0-rc.5",
-    "@storybook/addon-info": "5.0.0-rc.5",
-    "@storybook/addon-jest": "5.0.0-rc.5",
-    "@storybook/addon-knobs": "5.0.0-rc.5",
-    "@storybook/addon-links": "5.0.0-rc.5",
-    "@storybook/addon-notes": "5.0.0-rc.5",
-    "@storybook/addon-options": "5.0.0-rc.5",
-    "@storybook/addon-storyshots": "5.0.0-rc.5",
-    "@storybook/addon-storyshots-puppeteer": "5.0.0-rc.5",
-    "@storybook/addon-storysource": "5.0.0-rc.5",
-    "@storybook/addon-viewport": "5.0.0-rc.5",
-    "@storybook/addons": "5.0.0-rc.5",
-    "@storybook/components": "5.0.0-rc.5",
-    "@storybook/core-events": "5.0.0-rc.5",
-    "@storybook/node-logger": "5.0.0-rc.5",
-    "@storybook/react": "5.0.0-rc.5",
-    "@storybook/theming": "5.0.0-rc.5",
+    "@storybook/addon-a11y": "5.0.0-rc.6",
+    "@storybook/addon-actions": "5.0.0-rc.6",
+    "@storybook/addon-backgrounds": "5.0.0-rc.6",
+    "@storybook/addon-centered": "5.0.0-rc.6",
+    "@storybook/addon-cssresources": "5.0.0-rc.6",
+    "@storybook/addon-events": "5.0.0-rc.6",
+    "@storybook/addon-graphql": "5.0.0-rc.6",
+    "@storybook/addon-info": "5.0.0-rc.6",
+    "@storybook/addon-jest": "5.0.0-rc.6",
+    "@storybook/addon-knobs": "5.0.0-rc.6",
+    "@storybook/addon-links": "5.0.0-rc.6",
+    "@storybook/addon-notes": "5.0.0-rc.6",
+    "@storybook/addon-options": "5.0.0-rc.6",
+    "@storybook/addon-storyshots": "5.0.0-rc.6",
+    "@storybook/addon-storyshots-puppeteer": "5.0.0-rc.6",
+    "@storybook/addon-storysource": "5.0.0-rc.6",
+    "@storybook/addon-viewport": "5.0.0-rc.6",
+    "@storybook/addons": "5.0.0-rc.6",
+    "@storybook/components": "5.0.0-rc.6",
+    "@storybook/core-events": "5.0.0-rc.6",
+    "@storybook/node-logger": "5.0.0-rc.6",
+    "@storybook/react": "5.0.0-rc.6",
+    "@storybook/theming": "5.0.0-rc.6",
     "cors": "^2.8.4",
     "cross-env": "^5.2.0",
     "enzyme-to-json": "^3.3.4",
diff --git a/examples/polymer-cli/package.json b/examples/polymer-cli/package.json
index bd1d188e4c2..70eb8e39f46 100644
--- a/examples/polymer-cli/package.json
+++ b/examples/polymer-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "polymer-cli",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook",
@@ -9,15 +9,15 @@
   },
   "dependencies": {
     "@polymer/polymer": "^2.6.0",
-    "@storybook/addon-actions": "5.0.0-rc.5",
-    "@storybook/addon-backgrounds": "5.0.0-rc.5",
-    "@storybook/addon-knobs": "5.0.0-rc.5",
-    "@storybook/addon-links": "5.0.0-rc.5",
-    "@storybook/addon-notes": "5.0.0-rc.5",
-    "@storybook/addon-options": "5.0.0-rc.5",
-    "@storybook/addon-storysource": "5.0.0-rc.5",
-    "@storybook/addon-viewport": "5.0.0-rc.5",
-    "@storybook/polymer": "5.0.0-rc.5",
+    "@storybook/addon-actions": "5.0.0-rc.6",
+    "@storybook/addon-backgrounds": "5.0.0-rc.6",
+    "@storybook/addon-knobs": "5.0.0-rc.6",
+    "@storybook/addon-links": "5.0.0-rc.6",
+    "@storybook/addon-notes": "5.0.0-rc.6",
+    "@storybook/addon-options": "5.0.0-rc.6",
+    "@storybook/addon-storysource": "5.0.0-rc.6",
+    "@storybook/addon-viewport": "5.0.0-rc.6",
+    "@storybook/polymer": "5.0.0-rc.6",
     "@webcomponents/webcomponentsjs": "^1.2.0",
     "global": "^4.3.2",
     "lit-html": "^1.0.0",
diff --git a/examples/preact-kitchen-sink/package.json b/examples/preact-kitchen-sink/package.json
index 32340d55460..013ab9aee85 100644
--- a/examples/preact-kitchen-sink/package.json
+++ b/examples/preact-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "preact-example",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "private": true,
   "scripts": {
     "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
@@ -15,18 +15,18 @@
   "devDependencies": {
     "@babel/core": "^7.2.2",
     "@babel/plugin-transform-runtime": "^7.2.0",
-    "@storybook/addon-actions": "5.0.0-rc.5",
-    "@storybook/addon-backgrounds": "5.0.0-rc.5",
-    "@storybook/addon-centered": "5.0.0-rc.5",
-    "@storybook/addon-knobs": "5.0.0-rc.5",
-    "@storybook/addon-links": "5.0.0-rc.5",
-    "@storybook/addon-notes": "5.0.0-rc.5",
-    "@storybook/addon-options": "5.0.0-rc.5",
-    "@storybook/addon-storyshots": "5.0.0-rc.5",
-    "@storybook/addon-storysource": "5.0.0-rc.5",
-    "@storybook/addon-viewport": "5.0.0-rc.5",
-    "@storybook/addons": "5.0.0-rc.5",
-    "@storybook/preact": "5.0.0-rc.5",
+    "@storybook/addon-actions": "5.0.0-rc.6",
+    "@storybook/addon-backgrounds": "5.0.0-rc.6",
+    "@storybook/addon-centered": "5.0.0-rc.6",
+    "@storybook/addon-knobs": "5.0.0-rc.6",
+    "@storybook/addon-links": "5.0.0-rc.6",
+    "@storybook/addon-notes": "5.0.0-rc.6",
+    "@storybook/addon-options": "5.0.0-rc.6",
+    "@storybook/addon-storyshots": "5.0.0-rc.6",
+    "@storybook/addon-storysource": "5.0.0-rc.6",
+    "@storybook/addon-viewport": "5.0.0-rc.6",
+    "@storybook/addons": "5.0.0-rc.6",
+    "@storybook/preact": "5.0.0-rc.6",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
     "file-loader": "^3.0.1",
diff --git a/examples/riot-kitchen-sink/package.json b/examples/riot-kitchen-sink/package.json
index 94acdb034be..3aeec3766ab 100644
--- a/examples/riot-kitchen-sink/package.json
+++ b/examples/riot-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "riot-example",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "private": true,
   "scripts": {
     "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
@@ -15,18 +15,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.2.2",
-    "@storybook/addon-actions": "5.0.0-rc.5",
-    "@storybook/addon-backgrounds": "5.0.0-rc.5",
-    "@storybook/addon-centered": "5.0.0-rc.5",
-    "@storybook/addon-knobs": "5.0.0-rc.5",
-    "@storybook/addon-links": "5.0.0-rc.5",
-    "@storybook/addon-notes": "5.0.0-rc.5",
-    "@storybook/addon-options": "5.0.0-rc.5",
-    "@storybook/addon-storyshots": "5.0.0-rc.5",
-    "@storybook/addon-storysource": "5.0.0-rc.5",
-    "@storybook/addon-viewport": "5.0.0-rc.5",
-    "@storybook/addons": "5.0.0-rc.5",
-    "@storybook/riot": "5.0.0-rc.5",
+    "@storybook/addon-actions": "5.0.0-rc.6",
+    "@storybook/addon-backgrounds": "5.0.0-rc.6",
+    "@storybook/addon-centered": "5.0.0-rc.6",
+    "@storybook/addon-knobs": "5.0.0-rc.6",
+    "@storybook/addon-links": "5.0.0-rc.6",
+    "@storybook/addon-notes": "5.0.0-rc.6",
+    "@storybook/addon-options": "5.0.0-rc.6",
+    "@storybook/addon-storyshots": "5.0.0-rc.6",
+    "@storybook/addon-storysource": "5.0.0-rc.6",
+    "@storybook/addon-viewport": "5.0.0-rc.6",
+    "@storybook/addons": "5.0.0-rc.6",
+    "@storybook/riot": "5.0.0-rc.6",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
     "file-loader": "^3.0.1",
diff --git a/examples/svelte-kitchen-sink/package.json b/examples/svelte-kitchen-sink/package.json
index 3ac9e42fed4..bfc055c4a5d 100644
--- a/examples/svelte-kitchen-sink/package.json
+++ b/examples/svelte-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "svelte-example",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook -s public",
@@ -10,17 +10,17 @@
     "global": "^4.3.2"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.5",
-    "@storybook/addon-backgrounds": "5.0.0-rc.5",
-    "@storybook/addon-centered": "5.0.0-rc.5",
-    "@storybook/addon-knobs": "5.0.0-rc.5",
-    "@storybook/addon-links": "5.0.0-rc.5",
-    "@storybook/addon-notes": "5.0.0-rc.5",
-    "@storybook/addon-options": "5.0.0-rc.5",
-    "@storybook/addon-storyshots": "5.0.0-rc.5",
-    "@storybook/addon-storysource": "5.0.0-rc.5",
-    "@storybook/addon-viewport": "5.0.0-rc.5",
-    "@storybook/addons": "5.0.0-rc.5",
-    "@storybook/svelte": "5.0.0-rc.5"
+    "@storybook/addon-actions": "5.0.0-rc.6",
+    "@storybook/addon-backgrounds": "5.0.0-rc.6",
+    "@storybook/addon-centered": "5.0.0-rc.6",
+    "@storybook/addon-knobs": "5.0.0-rc.6",
+    "@storybook/addon-links": "5.0.0-rc.6",
+    "@storybook/addon-notes": "5.0.0-rc.6",
+    "@storybook/addon-options": "5.0.0-rc.6",
+    "@storybook/addon-storyshots": "5.0.0-rc.6",
+    "@storybook/addon-storysource": "5.0.0-rc.6",
+    "@storybook/addon-viewport": "5.0.0-rc.6",
+    "@storybook/addons": "5.0.0-rc.6",
+    "@storybook/svelte": "5.0.0-rc.6"
   }
 }
diff --git a/examples/vue-kitchen-sink/package.json b/examples/vue-kitchen-sink/package.json
index b30599db143..7e394d08c32 100644
--- a/examples/vue-kitchen-sink/package.json
+++ b/examples/vue-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "vue-example",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "private": true,
   "scripts": {
     "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
@@ -14,18 +14,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.2.2",
-    "@storybook/addon-actions": "5.0.0-rc.5",
-    "@storybook/addon-backgrounds": "5.0.0-rc.5",
-    "@storybook/addon-centered": "5.0.0-rc.5",
-    "@storybook/addon-knobs": "5.0.0-rc.5",
-    "@storybook/addon-links": "5.0.0-rc.5",
-    "@storybook/addon-notes": "5.0.0-rc.5",
-    "@storybook/addon-options": "5.0.0-rc.5",
-    "@storybook/addon-storyshots": "5.0.0-rc.5",
-    "@storybook/addon-storysource": "5.0.0-rc.5",
-    "@storybook/addon-viewport": "5.0.0-rc.5",
-    "@storybook/addons": "5.0.0-rc.5",
-    "@storybook/vue": "5.0.0-rc.5",
+    "@storybook/addon-actions": "5.0.0-rc.6",
+    "@storybook/addon-backgrounds": "5.0.0-rc.6",
+    "@storybook/addon-centered": "5.0.0-rc.6",
+    "@storybook/addon-knobs": "5.0.0-rc.6",
+    "@storybook/addon-links": "5.0.0-rc.6",
+    "@storybook/addon-notes": "5.0.0-rc.6",
+    "@storybook/addon-options": "5.0.0-rc.6",
+    "@storybook/addon-storyshots": "5.0.0-rc.6",
+    "@storybook/addon-storysource": "5.0.0-rc.6",
+    "@storybook/addon-viewport": "5.0.0-rc.6",
+    "@storybook/addons": "5.0.0-rc.6",
+    "@storybook/vue": "5.0.0-rc.6",
     "babel-core": "^7.0.0-bridge.0",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
diff --git a/lerna.json b/lerna.json
index ce1527c3f19..38df0af6f0e 100644
--- a/lerna.json
+++ b/lerna.json
@@ -11,5 +11,5 @@
   "npmClient": "yarn",
   "useWorkspaces": true,
   "registry": "https://registry.npmjs.org",
-  "version": "5.0.0-rc.5"
+  "version": "5.0.0-rc.6"
 }
diff --git a/lib/addons/package.json b/lib/addons/package.json
index 9e734075180..4a6b4f77537 100644
--- a/lib/addons/package.json
+++ b/lib/addons/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addons",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "Storybook addons store",
   "keywords": [
     "storybook"
@@ -20,8 +20,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.0.0-rc.5",
-    "@storybook/client-logger": "5.0.0-rc.5",
+    "@storybook/channels": "5.0.0-rc.6",
+    "@storybook/client-logger": "5.0.0-rc.6",
     "global": "^4.3.2",
     "util-deprecate": "^1.0.2"
   },
diff --git a/lib/channel-postmessage/package.json b/lib/channel-postmessage/package.json
index 247c544da66..c2374a573c7 100644
--- a/lib/channel-postmessage/package.json
+++ b/lib/channel-postmessage/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channel-postmessage",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "",
   "keywords": [
     "storybook"
@@ -20,8 +20,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.0.0-rc.5",
-    "@storybook/client-logger": "5.0.0-rc.5",
+    "@storybook/channels": "5.0.0-rc.6",
+    "@storybook/client-logger": "5.0.0-rc.6",
     "global": "^4.3.2",
     "telejson": "^2.1.0"
   },
diff --git a/lib/channel-websocket/package.json b/lib/channel-websocket/package.json
index 75d771af081..4e3288b2bad 100644
--- a/lib/channel-websocket/package.json
+++ b/lib/channel-websocket/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channel-websocket",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "",
   "keywords": [
     "storybook"
@@ -20,7 +20,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.0.0-rc.5",
+    "@storybook/channels": "5.0.0-rc.6",
     "global": "^4.3.2",
     "json-fn": "^1.1.1"
   },
diff --git a/lib/channels/package.json b/lib/channels/package.json
index cc504d5dc50..1233e6e9f8e 100644
--- a/lib/channels/package.json
+++ b/lib/channels/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channels",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/cli/package.json b/lib/cli/package.json
index 272ef68a230..fa67ac033f5 100644
--- a/lib/cli/package.json
+++ b/lib/cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/cli",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "Storybook's CLI - easiest method of adding storybook to your projects",
   "keywords": [
     "cli",
@@ -29,7 +29,7 @@
     "@babel/core": "^7.2.2",
     "@babel/preset-env": "^7.3.1",
     "@babel/register": "^7.0.0",
-    "@storybook/codemod": "5.0.0-rc.5",
+    "@storybook/codemod": "5.0.0-rc.6",
     "chalk": "^2.4.1",
     "commander": "^2.19.0",
     "core-js": "^2.6.2",
@@ -43,31 +43,31 @@
     "update-notifier": "^2.5.0"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.5",
-    "@storybook/addon-centered": "5.0.0-rc.5",
-    "@storybook/addon-graphql": "5.0.0-rc.5",
-    "@storybook/addon-info": "5.0.0-rc.5",
-    "@storybook/addon-knobs": "5.0.0-rc.5",
-    "@storybook/addon-links": "5.0.0-rc.5",
-    "@storybook/addon-notes": "5.0.0-rc.5",
-    "@storybook/addon-options": "5.0.0-rc.5",
-    "@storybook/addon-storyshots": "5.0.0-rc.5",
-    "@storybook/addons": "5.0.0-rc.5",
-    "@storybook/angular": "5.0.0-rc.5",
-    "@storybook/channel-postmessage": "5.0.0-rc.5",
-    "@storybook/channel-websocket": "5.0.0-rc.5",
-    "@storybook/channels": "5.0.0-rc.5",
-    "@storybook/ember": "5.0.0-rc.5",
-    "@storybook/html": "5.0.0-rc.5",
-    "@storybook/marko": "5.0.0-rc.5",
-    "@storybook/mithril": "5.0.0-rc.5",
-    "@storybook/polymer": "5.0.0-rc.5",
-    "@storybook/preact": "5.0.0-rc.5",
-    "@storybook/react": "5.0.0-rc.5",
-    "@storybook/react-native": "5.0.0-rc.5",
-    "@storybook/riot": "5.0.0-rc.5",
-    "@storybook/ui": "5.0.0-rc.5",
-    "@storybook/vue": "5.0.0-rc.5"
+    "@storybook/addon-actions": "5.0.0-rc.6",
+    "@storybook/addon-centered": "5.0.0-rc.6",
+    "@storybook/addon-graphql": "5.0.0-rc.6",
+    "@storybook/addon-info": "5.0.0-rc.6",
+    "@storybook/addon-knobs": "5.0.0-rc.6",
+    "@storybook/addon-links": "5.0.0-rc.6",
+    "@storybook/addon-notes": "5.0.0-rc.6",
+    "@storybook/addon-options": "5.0.0-rc.6",
+    "@storybook/addon-storyshots": "5.0.0-rc.6",
+    "@storybook/addons": "5.0.0-rc.6",
+    "@storybook/angular": "5.0.0-rc.6",
+    "@storybook/channel-postmessage": "5.0.0-rc.6",
+    "@storybook/channel-websocket": "5.0.0-rc.6",
+    "@storybook/channels": "5.0.0-rc.6",
+    "@storybook/ember": "5.0.0-rc.6",
+    "@storybook/html": "5.0.0-rc.6",
+    "@storybook/marko": "5.0.0-rc.6",
+    "@storybook/mithril": "5.0.0-rc.6",
+    "@storybook/polymer": "5.0.0-rc.6",
+    "@storybook/preact": "5.0.0-rc.6",
+    "@storybook/react": "5.0.0-rc.6",
+    "@storybook/react-native": "5.0.0-rc.6",
+    "@storybook/riot": "5.0.0-rc.6",
+    "@storybook/ui": "5.0.0-rc.6",
+    "@storybook/vue": "5.0.0-rc.6"
   },
   "publishConfig": {
     "access": "public"
diff --git a/lib/client-api/package.json b/lib/client-api/package.json
index 099d05cbca0..57283bc4156 100644
--- a/lib/client-api/package.json
+++ b/lib/client-api/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/client-api",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "Storybook Client API",
   "keywords": [
     "storybook"
@@ -19,10 +19,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.5",
-    "@storybook/client-logger": "5.0.0-rc.5",
-    "@storybook/core-events": "5.0.0-rc.5",
-    "@storybook/router": "5.0.0-rc.5",
+    "@storybook/addons": "5.0.0-rc.6",
+    "@storybook/client-logger": "5.0.0-rc.6",
+    "@storybook/core-events": "5.0.0-rc.6",
+    "@storybook/router": "5.0.0-rc.6",
     "common-tags": "^1.8.0",
     "eventemitter3": "^3.1.0",
     "global": "^4.3.2",
diff --git a/lib/client-logger/package.json b/lib/client-logger/package.json
index 86b0b7d5cd7..3e25885f85f 100644
--- a/lib/client-logger/package.json
+++ b/lib/client-logger/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/client-logger",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/codemod/package.json b/lib/codemod/package.json
index da6c6f4b29a..91b1bc7e326 100644
--- a/lib/codemod/package.json
+++ b/lib/codemod/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/codemod",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "A collection of codemod scripts written with JSCodeshift",
   "keywords": [
     "storybook"
diff --git a/lib/components/package.json b/lib/components/package.json
index b6ec56e42e9..3e7b310be4d 100644
--- a/lib/components/package.json
+++ b/lib/components/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/components",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "Core Storybook Components",
   "keywords": [
     "storybook"
@@ -20,11 +20,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.5",
-    "@storybook/client-logger": "5.0.0-rc.5",
-    "@storybook/core-events": "5.0.0-rc.5",
-    "@storybook/router": "5.0.0-rc.5",
-    "@storybook/theming": "5.0.0-rc.5",
+    "@storybook/addons": "5.0.0-rc.6",
+    "@storybook/client-logger": "5.0.0-rc.6",
+    "@storybook/core-events": "5.0.0-rc.6",
+    "@storybook/router": "5.0.0-rc.6",
+    "@storybook/theming": "5.0.0-rc.6",
     "global": "^4.3.2",
     "immer": "^1.12.0",
     "js-beautify": "^1.8.9",
diff --git a/lib/core-events/package.json b/lib/core-events/package.json
index 16dbe9b4d87..76db93e2ff8 100644
--- a/lib/core-events/package.json
+++ b/lib/core-events/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/core-events",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "Event names used in storybook core",
   "keywords": [
     "storybook"
diff --git a/lib/core/package.json b/lib/core/package.json
index a4ad1f557b5..eb55235baab 100644
--- a/lib/core/package.json
+++ b/lib/core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/core",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "Storybook framework-agnostic API",
   "keywords": [
     "storybook"
@@ -24,15 +24,15 @@
     "@babel/plugin-syntax-dynamic-import": "^7.2.0",
     "@babel/plugin-transform-react-constant-elements": "^7.2.0",
     "@babel/preset-env": "^7.3.1",
-    "@storybook/addons": "5.0.0-rc.5",
-    "@storybook/channel-postmessage": "5.0.0-rc.5",
-    "@storybook/client-api": "5.0.0-rc.5",
-    "@storybook/client-logger": "5.0.0-rc.5",
-    "@storybook/core-events": "5.0.0-rc.5",
-    "@storybook/node-logger": "5.0.0-rc.5",
-    "@storybook/router": "5.0.0-rc.5",
-    "@storybook/theming": "5.0.0-rc.5",
-    "@storybook/ui": "5.0.0-rc.5",
+    "@storybook/addons": "5.0.0-rc.6",
+    "@storybook/channel-postmessage": "5.0.0-rc.6",
+    "@storybook/client-api": "5.0.0-rc.6",
+    "@storybook/client-logger": "5.0.0-rc.6",
+    "@storybook/core-events": "5.0.0-rc.6",
+    "@storybook/node-logger": "5.0.0-rc.6",
+    "@storybook/router": "5.0.0-rc.6",
+    "@storybook/theming": "5.0.0-rc.6",
+    "@storybook/ui": "5.0.0-rc.6",
     "airbnb-js-shims": "^1 || ^2",
     "autoprefixer": "^9.4.7",
     "babel-plugin-add-react-displayname": "^0.0.5",
diff --git a/lib/node-logger/package.json b/lib/node-logger/package.json
index ed179f9f32b..8fee2bbc0e6 100644
--- a/lib/node-logger/package.json
+++ b/lib/node-logger/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/node-logger",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/router/package.json b/lib/router/package.json
index 8d26bcbd290..921849410dc 100644
--- a/lib/router/package.json
+++ b/lib/router/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/router",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "Core Storybook Router",
   "keywords": [
     "storybook"
@@ -20,7 +20,7 @@
   },
   "dependencies": {
     "@reach/router": "^1.2.1",
-    "@storybook/theming": "5.0.0-rc.5",
+    "@storybook/theming": "5.0.0-rc.6",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
     "qs": "^6.5.2"
diff --git a/lib/theming/package.json b/lib/theming/package.json
index 0694d2933b2..03645ed21f9 100644
--- a/lib/theming/package.json
+++ b/lib/theming/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/theming",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "Core Storybook Components",
   "keywords": [
     "storybook"
@@ -21,7 +21,7 @@
   "dependencies": {
     "@emotion/core": "^10.0.7",
     "@emotion/styled": "^10.0.7",
-    "@storybook/client-logger": "5.0.0-rc.5",
+    "@storybook/client-logger": "5.0.0-rc.6",
     "common-tags": "^1.8.0",
     "deep-object-diff": "^1.1.0",
     "emotion-theming": "^10.0.7",
diff --git a/lib/ui/package.json b/lib/ui/package.json
index 0c0af0d238f..ac79e78e231 100644
--- a/lib/ui/package.json
+++ b/lib/ui/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/ui",
-  "version": "5.0.0-rc.5",
+  "version": "5.0.0-rc.6",
   "description": "Core Storybook UI",
   "keywords": [
     "storybook"
@@ -21,12 +21,12 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.5",
-    "@storybook/client-logger": "5.0.0-rc.5",
-    "@storybook/components": "5.0.0-rc.5",
-    "@storybook/core-events": "5.0.0-rc.5",
-    "@storybook/router": "5.0.0-rc.5",
-    "@storybook/theming": "5.0.0-rc.5",
+    "@storybook/addons": "5.0.0-rc.6",
+    "@storybook/client-logger": "5.0.0-rc.6",
+    "@storybook/components": "5.0.0-rc.6",
+    "@storybook/core-events": "5.0.0-rc.6",
+    "@storybook/router": "5.0.0-rc.6",
+    "@storybook/theming": "5.0.0-rc.6",
     "eventemitter3": "^3.1.0",
     "fast-deep-equal": "^2.0.1",
     "fuse.js": "^3.3.1",

From 158ceeb07f1aa94aa495a2db10470b83d5c7659f Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Tue, 26 Feb 2019 00:29:58 +0800
Subject: [PATCH 084/249] 5.0.0-rc.6 versions.json

---
 docs/static/versions.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/docs/static/versions.json b/docs/static/versions.json
index 5dc74db58aa..630fd2556c3 100644
--- a/docs/static/versions.json
+++ b/docs/static/versions.json
@@ -1 +1 @@
-{"next":{"version":"5.0.0-rc.5","info":{"plain":"### Bug Fixes\n\n* UI: Fix `/` search hotkey so it doesn't type into the input ([#5702](https://github.com/storybooks/storybook/pull/5702))\n* Addon-a11y: Fix a11y setup being undefined ([#5724](https://github.com/storybooks/storybook/pull/5724))\n* UI: Fix duplicate theming packages ([#5722](https://github.com/storybooks/storybook/pull/5722))\n* Core: Clean up debug logging ([#5705](https://github.com/storybooks/storybook/pull/5705))\n* UI: Minor addon ux tweaks ([#5712](https://github.com/storybooks/storybook/pull/5712))\n* Addon-a11y: Fix story scrolling ([#5713](https://github.com/storybooks/storybook/pull/5713))\n* UI: Fix mobile styling ([#5709](https://github.com/storybooks/storybook/pull/5709))\n* UI: Fix tooltip bugs ([#5692](https://github.com/storybooks/storybook/pull/5692))\n* UI: Fix toolbar separators ([#5711](https://github.com/storybooks/storybook/pull/5711))\n\n### Maintenance\n\n* Typescript: migrate addon-backgrounds ([#5535](https://github.com/storybooks/storybook/pull/5535))\n* Typescript: fix typings for addon-backgrounds ([#5730](https://github.com/storybooks/storybook/pull/5730))"}}}
\ No newline at end of file
+{"next":{"version":"5.0.0-rc.6","info":{"plain":"### Bug Fixes\n\n* Addon-actions: FIX performance by upgrading to telejson 2.1 ([#5751](https://github.com/storybooks/storybook/pull/5751))\n* UI: FIX bad treeview mockdata ([#5741](https://github.com/storybooks/storybook/pull/5741))\n* UI: About page styling fixes ([#5732](https://github.com/storybooks/storybook/pull/5732))\n* UI: Restore the toolbar eject button ([#5737](https://github.com/storybooks/storybook/pull/5737))"}}}
\ No newline at end of file

From f0e00c44f915c643aad5662d7e654d155704da4d Mon Sep 17 00:00:00 2001
From: Dominic Nguyen <dom@hichroma.com>
Date: Mon, 25 Feb 2019 11:16:16 -0500
Subject: [PATCH 085/249] Merge pull request #5742 from
 storybooks/feature/toolbar-toggle-animation

CHANGE animation duration for layout && ADD animation for toolbar
---
 lib/ui/src/components/layout/container.js                     | 2 +-
 .../preview/__snapshots__/preview.stories.storyshot           | 4 ++++
 lib/ui/src/components/preview/components.js                   | 3 ++-
 3 files changed, 7 insertions(+), 2 deletions(-)

diff --git a/lib/ui/src/components/layout/container.js b/lib/ui/src/components/layout/container.js
index db2c9573101..be43e824808 100644
--- a/lib/ui/src/components/layout/container.js
+++ b/lib/ui/src/components/layout/container.js
@@ -68,7 +68,7 @@ const Pane = styled.div(
     animate
       ? {
           transition: ['width', 'height', 'top', 'left', 'background', 'opacity', 'transform']
-            .map(p => `${p} 0.09s ease-out`)
+            .map(p => `${p} 0.1s ease-out`)
             .join(','),
         }
       : {}
diff --git a/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot b/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot
index a03b4aadebd..1e9b850e826 100644
--- a/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot
+++ b/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot
@@ -296,6 +296,8 @@ Array [
   bottom: 0;
   top: 40px;
   z-index: 3;
+  -webkit-transition: all 0.1s linear;
+  transition: all 0.1s linear;
   height: calc(100% - 40px);
   background: transparent;
 }
@@ -788,6 +790,8 @@ Array [
   bottom: 0;
   top: 40px;
   z-index: 3;
+  -webkit-transition: all 0.1s linear;
+  transition: all 0.1s linear;
   height: calc(100% - 40px);
   background: transparent;
 }
diff --git a/lib/ui/src/components/preview/components.js b/lib/ui/src/components/preview/components.js
index 9d93ac659c8..05ac8c1597a 100644
--- a/lib/ui/src/components/preview/components.js
+++ b/lib/ui/src/components/preview/components.js
@@ -27,7 +27,8 @@ export const FrameWrap = styled.div(({ offset }) => ({
   bottom: 0,
   top: offset,
   zIndex: 3,
-  height: offset ? `calc(100% - ${offset}px)` : '100%',
+  transition: 'all 0.1s linear',
+  height: `calc(100% - ${offset}px)`,
   background: 'transparent',
 }));
 

From 30c10676d3ffbee5ea6fdbfd4a8dcadd980d9d72 Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Tue, 26 Feb 2019 00:38:27 +0800
Subject: [PATCH 086/249] Merge pull request #5748 from
 storybooks/feature/no-fuzzy-for-only-2-char-search

Fuzzy search improvement
---
 .../src/components/sidebar/treeview/utils.js  | 26 +++++++++++++------
 1 file changed, 18 insertions(+), 8 deletions(-)

diff --git a/lib/ui/src/components/sidebar/treeview/utils.js b/lib/ui/src/components/sidebar/treeview/utils.js
index a2b704053f1..81efc9cfe05 100644
--- a/lib/ui/src/components/sidebar/treeview/utils.js
+++ b/lib/ui/src/components/sidebar/treeview/utils.js
@@ -3,6 +3,8 @@ import FuzzySearch from 'fuzzy-search';
 
 export const prevent = e => e.preventDefault();
 
+const toList = memoize(1)(dataset => Object.values(dataset));
+
 export const keyEventToAction = ({ keyCode, ctrlKey, shiftKey, altKey, metaKey }) => {
   if (shiftKey || metaKey || ctrlKey || altKey) {
     return false;
@@ -52,7 +54,7 @@ export const getParents = memoize(1000)((id, dataset) => {
 });
 
 export const getMains = memoize(1)(dataset =>
-  Object.values(dataset)
+  toList(dataset)
     .filter(m => m.depth === 0)
     .sort((a, b) => {
       if (a.isRoot && b.isRoot) {
@@ -163,16 +165,24 @@ export const getNext = ({ id, dataset, expanded }) => {
 
 const toHayStack = memoize(2)(
   dataset =>
-    new FuzzySearch(Object.values(dataset), [
-      'kind',
-      'name',
-      'parameters.fileName',
-      'parameters.notes',
-    ])
+    new FuzzySearch(toList(dataset), ['kind', 'name', 'parameters.fileName', 'parameters.notes'])
 );
+
+const exactMatch = memoize(1)(filter => i =>
+  (i.kind && i.kind.includes(filter)) ||
+  (i.name && i.name.includes(filter)) ||
+  (i.parameters && i.parameters.fileName && i.parameters.fileName.includes(filter)) ||
+  (i.parameters && typeof i.parameters.notes === 'string' && i.parameters.notes.includes(filter))
+);
+
 export const toId = (base, addition) => (base === '' ? `${addition}` : `${base}-${addition}`);
 export const toFiltered = (dataset, filter) => {
-  const found = toHayStack(dataset).search(filter);
+  let found;
+  if (filter.length && filter.length > 2) {
+    found = toHayStack(dataset).search(filter);
+  } else {
+    found = toList(dataset).filter(exactMatch(filter));
+  }
 
   // get all parents for all results
   const result = found.reduce((acc, item) => {

From 9ee2df00954491080ceddd5c0d26c021358e6794 Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Mon, 25 Feb 2019 20:16:01 +0100
Subject: [PATCH 087/249] Merge pull request #5749 from
 storybooks/feature/addon-tool-active-indicator

ADD activity to addon-background and addon-viewport tool
---
 addons/backgrounds/src/containers/BackgroundSelector.tsx | 2 +-
 addons/viewport/src/Tool.js                              | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/addons/backgrounds/src/containers/BackgroundSelector.tsx b/addons/backgrounds/src/containers/BackgroundSelector.tsx
index 76f0011a804..7a3f634017a 100644
--- a/addons/backgrounds/src/containers/BackgroundSelector.tsx
+++ b/addons/backgrounds/src/containers/BackgroundSelector.tsx
@@ -140,7 +140,7 @@ export class BackgroundSelector extends Component<BackgroundToolProps, Backgroun
           tooltip={<TooltipLinkList links={items} />}
           closeOnClick
         >
-          <IconButton key="background" title="Backgrounds">
+          <IconButton key="background" active={selectedBackgroundColor !== 'transparent'} title="Change the background of the preview">
             <Icons icon="photo" />
           </IconButton>
         </WithTooltip>
diff --git a/addons/viewport/src/Tool.js b/addons/viewport/src/Tool.js
index d0042f2ea6c..3e986d455d1 100644
--- a/addons/viewport/src/Tool.js
+++ b/addons/viewport/src/Tool.js
@@ -123,7 +123,7 @@ export default class ViewportTool extends Component {
           tooltip={<TooltipLinkList links={items} />}
           closeOnClick
         >
-          <IconButton key="viewport" title="Change Viewport">
+          <IconButton key="viewport" title="Change the size of the preview" active={!!item}>
             <Icons icon="grow" />
           </IconButton>
         </WithTooltip>

From a290b1f33ef05631ae4b211acd4c79c57d81ec8e Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Tue, 26 Feb 2019 10:52:11 +0800
Subject: [PATCH 088/249] Merge pull request #5756 from
 storybooks/5620-loading-state

Added `STORIES_CONFIGURED` and use to drive loading state
---
 lib/client-api/src/config_api.js | 4 ++++
 lib/core-events/src/index.ts     | 2 ++
 lib/ui/src/containers/nav.js     | 2 ++
 lib/ui/src/core/context.js       | 5 ++++-
 lib/ui/src/core/initial-state.js | 1 +
 5 files changed, 13 insertions(+), 1 deletion(-)

diff --git a/lib/client-api/src/config_api.js b/lib/client-api/src/config_api.js
index dcce4456a64..a59226a84a9 100644
--- a/lib/client-api/src/config_api.js
+++ b/lib/client-api/src/config_api.js
@@ -75,6 +75,10 @@ export default class ConfigApi {
     if (this._channel) {
       // in Browser
       render();
+      // Send a signal to the manager that configure() is done. We do this in a timeout
+      // because the story_store sends stories in a debounced function, which results in
+      // as setTimeout. We want to ensure this happens after, to avoid a FOUC.
+      setTimeout(() => this._channel.emit(Events.STORIES_CONFIGURED), 0);
     } else {
       // in NodeJS
       loaders();
diff --git a/lib/core-events/src/index.ts b/lib/core-events/src/index.ts
index d216fe77d0b..43195089ed6 100644
--- a/lib/core-events/src/index.ts
+++ b/lib/core-events/src/index.ts
@@ -4,6 +4,7 @@ enum events {
   SET_CURRENT_STORY = 'setCurrentStory',
   GET_STORIES = 'getStories',
   SET_STORIES = 'setStories',
+  STORIES_CONFIGURED = 'storiesConfigured',
   SELECT_STORY = 'selectStory',
   PREVIEW_KEYDOWN = 'previewKeydown',
   STORY_ADDED = 'storyAdded',
@@ -29,6 +30,7 @@ export const GET_CURRENT_STORY = events.GET_CURRENT_STORY;
 export const SET_CURRENT_STORY = events.SET_CURRENT_STORY;
 export const GET_STORIES = events.GET_STORIES;
 export const SET_STORIES = events.SET_STORIES;
+export const STORIES_CONFIGURED = events.STORIES_CONFIGURED;
 export const SELECT_STORY = events.SELECT_STORY;
 export const PREVIEW_KEYDOWN = events.PREVIEW_KEYDOWN;
 export const FORCE_RE_RENDER = events.FORCE_RE_RENDER;
diff --git a/lib/ui/src/containers/nav.js b/lib/ui/src/containers/nav.js
index e41d3591c35..68750a080e6 100755
--- a/lib/ui/src/containers/nav.js
+++ b/lib/ui/src/containers/nav.js
@@ -97,10 +97,12 @@ export const mapper = (state, api) => {
     storyId,
     layout: { isFullscreen, showPanel, showNav, panelPosition },
     storiesHash,
+    storiesConfigured,
   } = state;
 
   const shortcutKeys = api.getShortcutKeys();
   return {
+    loading: !storiesConfigured,
     title: name,
     url,
     notifications,
diff --git a/lib/ui/src/core/context.js b/lib/ui/src/core/context.js
index 105e4ac181f..7e03f6a0e8f 100644
--- a/lib/ui/src/core/context.js
+++ b/lib/ui/src/core/context.js
@@ -1,7 +1,7 @@
 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 
-import Events from '@storybook/core-events';
+import Events, { STORIES_CONFIGURED } from '@storybook/core-events';
 
 import initProviderApi from './init-provider-api';
 
@@ -94,6 +94,9 @@ export class Provider extends Component {
 
       api.setOptions(options);
     });
+    api.on(STORIES_CONFIGURED, () => {
+      store.setState({ storiesConfigured: true });
+    });
     api.on(SELECT_STORY, ({ kind, story, ...rest }) => {
       api.selectStory(kind, story, rest);
     });
diff --git a/lib/ui/src/core/initial-state.js b/lib/ui/src/core/initial-state.js
index 0bcca3cc73c..762aed06bf3 100644
--- a/lib/ui/src/core/initial-state.js
+++ b/lib/ui/src/core/initial-state.js
@@ -19,6 +19,7 @@ const initial = {
     panelPosition: 'bottom',
   },
   customQueryParams: {},
+  storiesConfigured: false,
 };
 
 // Returns the initialState of the app

From b2bae0abdc26f99157da92f918faa2903d28229a Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Tue, 26 Feb 2019 02:15:47 +0100
Subject: [PATCH 089/249] Merge pull request #5733 from
 storybooks/5665-customizable-brand

Improve `brand` API
---
 examples/official-storybook/config.js         |    1 -
 .../__snapshots__/storyshots.test.js.snap     | 1995 +++++++++++++----
 lib/components/src/brand/StorybookLogo.js     |   10 +-
 lib/theming/src/base.ts                       |    7 +-
 lib/theming/src/brand.tsx                     |   51 -
 lib/theming/src/create.ts                     |   12 +-
 lib/theming/src/themes/dark.ts                |    3 -
 lib/theming/src/themes/light.ts               |    3 -
 .../src/components/sidebar/Sidebar.stories.js |    2 +-
 .../src/components/sidebar/SidebarHeading.js  |   74 +-
 .../sidebar/SidebarHeading.stories.js         |  115 +-
 lib/ui/src/core/init-provider-api.js          |   20 +
 lib/ui/src/core/initial-state.js              |    2 -
 13 files changed, 1772 insertions(+), 523 deletions(-)
 delete mode 100644 lib/theming/src/brand.tsx

diff --git a/examples/official-storybook/config.js b/examples/official-storybook/config.js
index 50e42f6a8dc..b5f8ca2e8a2 100644
--- a/examples/official-storybook/config.js
+++ b/examples/official-storybook/config.js
@@ -49,7 +49,6 @@ addParameters({
     },
   },
   options: {
-    name: 'Storybook',
     hierarchySeparator: /\/|\./,
     hierarchyRootSeparator: '|',
     // theme: themes.dark,
diff --git a/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap b/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
index be34263df94..2c69de59a58 100644
--- a/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
+++ b/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
@@ -243,7 +243,7 @@ exports[`Storyshots Basics|ActionBar singleItem 1`] = `
 exports[`Storyshots Basics|Brand/StorybookLogo normal 1`] = `
 <svg
   height="40px"
-  title="Storybook"
+  role="img"
   viewBox="0 0 200 40"
   width="200px"
 >
@@ -2638,8 +2638,7 @@ exports[`Storyshots Core|Parameters passed to story 1`] = `
   Parameters are {
   "options": {
     "hierarchyRootSeparator": "|",
-    "hierarchySeparator": {},
-    "name": "Storybook"
+    "hierarchySeparator": {}
   },
   "a11y": {
     "configure": {},
@@ -5263,10 +5262,10 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
+  -webkit-align-items: flex-start;
+  -webkit-box-align: flex-start;
+  -ms-flex-align: flex-start;
+  align-items: flex-start;
   -webkit-box-pack: justify;
   -webkit-justify-content: space-between;
   -ms-flex-pack: justify;
@@ -5277,11 +5276,22 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
 .emotion-2 {
   font-size: 14px;
   font-weight: 700;
+  margin-right: 10px;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  padding-top: 3px;
+  padding-bottom: 3px;
+  min-height: 28px;
 }
 
 .emotion-2 > * {
-  max-height: 32px;
-  max-width: 200px;
+  max-width: 100%;
   height: auto;
   width: auto;
   display: block;
@@ -5292,23 +5302,6 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
   color: inherit;
   -webkit-text-decoration: none;
   text-decoration: none;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-1:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-1:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
 }
 
 .emotion-0 {
@@ -5669,10 +5662,10 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
+  -webkit-align-items: flex-start;
+  -webkit-box-align: flex-start;
+  -ms-flex-align: flex-start;
+  align-items: flex-start;
   -webkit-box-pack: justify;
   -webkit-justify-content: space-between;
   -ms-flex-pack: justify;
@@ -5683,11 +5676,22 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
 .emotion-2 {
   font-size: 14px;
   font-weight: 700;
+  margin-right: 10px;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  padding-top: 3px;
+  padding-bottom: 3px;
+  min-height: 28px;
 }
 
 .emotion-2 > * {
-  max-height: 32px;
-  max-width: 200px;
+  max-width: 100%;
   height: auto;
   width: auto;
   display: block;
@@ -5698,23 +5702,6 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
   color: inherit;
   -webkit-text-decoration: none;
   text-decoration: none;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-1:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-1:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
 }
 
 .emotion-0 {
@@ -5999,10 +5986,14 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
         <svg
           class="emotion-0"
           height="40px"
+          role="img"
           title="Storybook"
           viewBox="0 0 200 40"
           width="200px"
         >
+          <title>
+            Storybook
+          </title>
           <defs>
             <path
               d="M1.2 36.9L0 3.9c0-1.1.8-2 1.9-2.1l28-1.8a2 2 0 0 1 2.2 1.9 2 2 0 0 1 0 .1v36a2 2 0 0 1-2 2 2 2 0 0 1-.1 0L3.2 38.8a2 2 0 0 1-2-2z"
@@ -6469,10 +6460,10 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
+  -webkit-align-items: flex-start;
+  -webkit-box-align: flex-start;
+  -ms-flex-align: flex-start;
+  align-items: flex-start;
   -webkit-box-pack: justify;
   -webkit-justify-content: space-between;
   -ms-flex-pack: justify;
@@ -6483,11 +6474,22 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
 .emotion-2 {
   font-size: 14px;
   font-weight: 700;
+  margin-right: 10px;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  padding-top: 3px;
+  padding-bottom: 3px;
+  min-height: 28px;
 }
 
 .emotion-2 > * {
-  max-height: 32px;
-  max-width: 200px;
+  max-width: 100%;
   height: auto;
   width: auto;
   display: block;
@@ -6498,23 +6500,6 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   color: inherit;
   -webkit-text-decoration: none;
   text-decoration: none;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-1:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-1:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
 }
 
 .emotion-0 {
@@ -6998,10 +6983,10 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
+  -webkit-align-items: flex-start;
+  -webkit-box-align: flex-start;
+  -ms-flex-align: flex-start;
+  align-items: flex-start;
   -webkit-box-pack: justify;
   -webkit-justify-content: space-between;
   -ms-flex-pack: justify;
@@ -7012,11 +6997,22 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
 .emotion-2 {
   font-size: 14px;
   font-weight: 700;
+  margin-right: 10px;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  padding-top: 3px;
+  padding-bottom: 3px;
+  min-height: 28px;
 }
 
 .emotion-2 > * {
-  max-height: 32px;
-  max-width: 200px;
+  max-width: 100%;
   height: auto;
   width: auto;
   display: block;
@@ -7027,23 +7023,6 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   color: inherit;
   -webkit-text-decoration: none;
   text-decoration: none;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-1:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-1:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
 }
 
 .emotion-0 {
@@ -7491,10 +7470,14 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
         <svg
           class="emotion-0"
           height="40px"
+          role="img"
           title="Storybook"
           viewBox="0 0 200 40"
           width="200px"
         >
+          <title>
+            Storybook
+          </title>
           <defs>
             <path
               d="M1.2 36.9L0 3.9c0-1.1.8-2 1.9-2.1l28-1.8a2 2 0 0 1 2.2 1.9 2 2 0 0 1 0 .1v36a2 2 0 0 1-2 2 2 2 0 0 1-.1 0L3.2 38.8a2 2 0 0 1-2-2z"
@@ -7786,8 +7769,8 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
 </nav>
 `;
 
-exports[`Storyshots UI|Sidebar/SidebarHeading customBrand 1`] = `
-.emotion-2 {
+exports[`Storyshots UI|Sidebar/SidebarHeading customBrandImage 1`] = `
+.emotion-4 {
   shape-rendering: inherit;
   -webkit-transform: translate3d(0,0,0);
   -ms-transform: translate3d(0,0,0);
@@ -7795,29 +7778,47 @@ exports[`Storyshots UI|Sidebar/SidebarHeading customBrand 1`] = `
   display: block;
 }
 
-.emotion-1 {
+.emotion-3 {
   fill: currentColor;
 }
 
-.emotion-0 {
+.emotion-2 {
   font-size: 14px;
   font-weight: 700;
+  margin-right: 10px;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  padding-top: 3px;
+  padding-bottom: 3px;
+  min-height: 28px;
 }
 
-.emotion-0 > * {
-  max-height: 32px;
-  max-width: 200px;
+.emotion-2 > * {
+  max-width: 100%;
   height: auto;
   width: auto;
   display: block;
 }
 
-.emotion-4 {
+.emotion-1 {
+  display: block;
+  color: inherit;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
+.emotion-6 {
   display: inline-block;
   cursor: pointer;
 }
 
-.emotion-3 {
+.emotion-5 {
   border: 0;
   border-radius: 3em;
   cursor: pointer;
@@ -7854,7 +7855,7 @@ exports[`Storyshots UI|Sidebar/SidebarHeading customBrand 1`] = `
   padding: 7px;
 }
 
-.emotion-3 svg {
+.emotion-5 svg {
   display: inline-block;
   height: 14px;
   width: 14px;
@@ -7865,40 +7866,46 @@ exports[`Storyshots UI|Sidebar/SidebarHeading customBrand 1`] = `
   pointer-events: none;
 }
 
-.emotion-3 svg path {
+.emotion-5 svg path {
   fill: currentColor;
 }
 
-.emotion-3 svg {
+.emotion-5 svg {
   display: block;
   margin: 0;
 }
 
-.emotion-3:hover {
+.emotion-5:hover {
   box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
 }
 
-.emotion-3:active {
+.emotion-5:active {
   box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
   color: #333;
 }
 
-.emotion-5 {
+.emotion-7 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
+  -webkit-align-items: flex-start;
+  -webkit-box-align: flex-start;
+  -ms-flex-align: flex-start;
+  align-items: flex-start;
   -webkit-box-pack: justify;
   -webkit-justify-content: space-between;
   -ms-flex-pack: justify;
   justify-content: space-between;
 }
 
-.emotion-2 {
+.emotion-0 {
+  width: auto;
+  display: block;
+  max-width: 100%;
+}
+
+.emotion-4 {
   shape-rendering: inherit;
   -webkit-transform: translate3d(0,0,0);
   -ms-transform: translate3d(0,0,0);
@@ -7906,29 +7913,47 @@ exports[`Storyshots UI|Sidebar/SidebarHeading customBrand 1`] = `
   display: block;
 }
 
-.emotion-1 {
+.emotion-3 {
   fill: currentColor;
 }
 
-.emotion-0 {
+.emotion-2 {
   font-size: 14px;
   font-weight: 700;
+  margin-right: 10px;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  padding-top: 3px;
+  padding-bottom: 3px;
+  min-height: 28px;
 }
 
-.emotion-0 > * {
-  max-height: 32px;
-  max-width: 200px;
+.emotion-2 > * {
+  max-width: 100%;
   height: auto;
   width: auto;
   display: block;
 }
 
-.emotion-4 {
+.emotion-1 {
+  display: block;
+  color: inherit;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
+.emotion-6 {
   display: inline-block;
   cursor: pointer;
 }
 
-.emotion-3 {
+.emotion-5 {
   border: 0;
   border-radius: 3em;
   cursor: pointer;
@@ -7965,7 +7990,7 @@ exports[`Storyshots UI|Sidebar/SidebarHeading customBrand 1`] = `
   padding: 7px;
 }
 
-.emotion-3 svg {
+.emotion-5 svg {
   display: inline-block;
   height: 14px;
   width: 14px;
@@ -7976,25 +8001,103 @@ exports[`Storyshots UI|Sidebar/SidebarHeading customBrand 1`] = `
   pointer-events: none;
 }
 
-.emotion-3 svg path {
+.emotion-5 svg path {
   fill: currentColor;
 }
 
-.emotion-3 svg {
+.emotion-5 svg {
   display: block;
   margin: 0;
 }
 
-.emotion-3:hover {
+.emotion-5:hover {
   box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
 }
 
-.emotion-3:active {
+.emotion-5:active {
   box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
   color: #333;
 }
 
-.emotion-5 {
+.emotion-7 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: flex-start;
+  -webkit-box-align: flex-start;
+  -ms-flex-align: flex-start;
+  align-items: flex-start;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+}
+
+.emotion-0 {
+  width: auto;
+  display: block;
+  max-width: 100%;
+}
+
+<div
+  style="width:240px;margin:1rem"
+>
+  <div
+    class="emotion-7"
+  >
+    <div
+      class="emotion-2"
+    >
+      <a
+        class="emotion-1"
+        href="https://example.com"
+      >
+        <img
+          alt="My Title"
+          class="emotion-0"
+          src="https://via.placeholder.com/150x22"
+        />
+      </a>
+    </div>
+    <div
+      class="emotion-6"
+    >
+      <button
+        class="emotion-5"
+      >
+        <svg
+          class="emotion-4"
+          viewBox="0 0 1024 1024"
+        >
+          <path
+            class="emotion-3"
+            d="M184 393c66.274 0 120 53.73 120 120s-53.726 120-120 120c-66.286 0-120-53.73-120-120s53.714-120 120-120zM512 393c66.272 0 120 53.73 120 120s-53.728 120-120 120c-66.286 0-120-53.73-120-120s53.714-120 120-120zM840 393c66.272 0 120 53.73 120 120s-53.728 120-120 120c-66.286 0-120-53.73-120-120s53.714-120 120-120z"
+          />
+        </svg>
+      </button>
+    </div>
+  </div>
+</div>
+`;
+
+exports[`Storyshots UI|Sidebar/SidebarHeading linkAndText 1`] = `
+.emotion-3 {
+  shape-rendering: inherit;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  display: block;
+}
+
+.emotion-2 {
+  fill: currentColor;
+}
+
+.emotion-1 {
+  font-size: 14px;
+  font-weight: 700;
+  margin-right: 10px;
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -8003,6 +8106,234 @@ exports[`Storyshots UI|Sidebar/SidebarHeading customBrand 1`] = `
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
+  padding-top: 3px;
+  padding-bottom: 3px;
+  min-height: 28px;
+}
+
+.emotion-1 > * {
+  max-width: 100%;
+  height: auto;
+  width: auto;
+  display: block;
+}
+
+.emotion-0 {
+  display: block;
+  color: inherit;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
+.emotion-5 {
+  display: inline-block;
+  cursor: pointer;
+}
+
+.emotion-4 {
+  border: 0;
+  border-radius: 3em;
+  cursor: pointer;
+  display: inline-block;
+  overflow: hidden;
+  padding: 10px 16px;
+  position: relative;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  vertical-align: top;
+  white-space: nowrap;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  opacity: 1;
+  margin: 0;
+  background: transparent;
+  font-size: 12px;
+  font-weight: 700;
+  line-height: 1;
+  padding: 9px;
+  box-shadow: rgba(51,51,51,0.2) 0 0 0 1px inset;
+  color: rgba(51,51,51,0.7);
+  background: transparent;
+  position: relative;
+  overflow: visible;
+  padding: 7px;
+}
+
+.emotion-4 svg {
+  display: inline-block;
+  height: 14px;
+  width: 14px;
+  vertical-align: top;
+  margin-right: 4px;
+  margin-top: -1px;
+  margin-bottom: -1px;
+  pointer-events: none;
+}
+
+.emotion-4 svg path {
+  fill: currentColor;
+}
+
+.emotion-4 svg {
+  display: block;
+  margin: 0;
+}
+
+.emotion-4:hover {
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
+}
+
+.emotion-4:active {
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
+  color: #333;
+}
+
+.emotion-6 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: flex-start;
+  -webkit-box-align: flex-start;
+  -ms-flex-align: flex-start;
+  align-items: flex-start;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+}
+
+.emotion-3 {
+  shape-rendering: inherit;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  display: block;
+}
+
+.emotion-2 {
+  fill: currentColor;
+}
+
+.emotion-1 {
+  font-size: 14px;
+  font-weight: 700;
+  margin-right: 10px;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  padding-top: 3px;
+  padding-bottom: 3px;
+  min-height: 28px;
+}
+
+.emotion-1 > * {
+  max-width: 100%;
+  height: auto;
+  width: auto;
+  display: block;
+}
+
+.emotion-0 {
+  display: block;
+  color: inherit;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
+.emotion-5 {
+  display: inline-block;
+  cursor: pointer;
+}
+
+.emotion-4 {
+  border: 0;
+  border-radius: 3em;
+  cursor: pointer;
+  display: inline-block;
+  overflow: hidden;
+  padding: 10px 16px;
+  position: relative;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  vertical-align: top;
+  white-space: nowrap;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  opacity: 1;
+  margin: 0;
+  background: transparent;
+  font-size: 12px;
+  font-weight: 700;
+  line-height: 1;
+  padding: 9px;
+  box-shadow: rgba(51,51,51,0.2) 0 0 0 1px inset;
+  color: rgba(51,51,51,0.7);
+  background: transparent;
+  position: relative;
+  overflow: visible;
+  padding: 7px;
+}
+
+.emotion-4 svg {
+  display: inline-block;
+  height: 14px;
+  width: 14px;
+  vertical-align: top;
+  margin-right: 4px;
+  margin-top: -1px;
+  margin-bottom: -1px;
+  pointer-events: none;
+}
+
+.emotion-4 svg path {
+  fill: currentColor;
+}
+
+.emotion-4 svg {
+  display: block;
+  margin: 0;
+}
+
+.emotion-4:hover {
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
+}
+
+.emotion-4:active {
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
+  color: #333;
+}
+
+.emotion-6 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: flex-start;
+  -webkit-box-align: flex-start;
+  -ms-flex-align: flex-start;
+  align-items: flex-start;
   -webkit-box-pack: justify;
   -webkit-justify-content: space-between;
   -ms-flex-pack: justify;
@@ -8010,86 +8341,315 @@ exports[`Storyshots UI|Sidebar/SidebarHeading customBrand 1`] = `
 }
 
 <div
-  class="emotion-5"
+  style="width:240px;margin:1rem"
 >
   <div
-    class="emotion-0"
+    class="emotion-6"
   >
-    
-
-    <svg
-      height="64px"
-      version="1.1"
-      viewBox="0 0 64 64"
-      width="64px"
-      xlink="http://www.w3.org/1999/xlink"
-      xmlns="http://www.w3.org/2000/svg"
+    <div
+      class="emotion-1"
     >
-      
-  
       <a
-        href="https://storybook.js.org"
+        class="emotion-0"
+        href="https://example.com"
       >
-        
-    
-        <g
-          fill="none"
-          fill-rule="evenodd"
-          id="Artboard"
-          stroke="none"
-          stroke-width="1"
-        >
-          
-      
-          <path
-            d="M8.04798541,58.7875918 L6.07908839,6.32540407 C6.01406344,4.5927838 7.34257463,3.12440831 9.07303814,3.01625434 L53.6958037,0.227331489 C55.457209,0.117243658 56.974354,1.45590096 57.0844418,3.21730626 C57.0885895,3.28366922 57.0906648,3.35014546 57.0906648,3.41663791 L57.0906648,60.5834697 C57.0906648,62.3483119 55.6599776,63.7789992 53.8951354,63.7789992 C53.847325,63.7789992 53.7995207,63.7779262 53.7517585,63.775781 L11.0978899,61.8600599 C9.43669044,61.7854501 8.11034889,60.4492961 8.04798541,58.7875918 Z"
-            fill="#FF4785"
-            fill-rule="nonzero"
-            id="path-1"
-          />
-          
-      
-          <path
-            d="M35.9095005,24.1768792 C35.9095005,25.420127 44.2838488,24.8242707 45.4080313,23.9509748 C45.4080313,15.4847538 40.8652557,11.0358878 32.5466666,11.0358878 C24.2280775,11.0358878 19.5673077,15.553972 19.5673077,22.3311017 C19.5673077,34.1346028 35.4965208,34.3605071 35.4965208,40.7987804 C35.4965208,42.606015 34.6115646,43.6790606 32.6646607,43.6790606 C30.127786,43.6790606 29.1248356,42.3834613 29.2428298,37.9783269 C29.2428298,37.0226907 19.5673077,36.7247626 19.2723223,37.9783269 C18.5211693,48.6535354 25.1720308,51.7326752 32.7826549,51.7326752 C40.1572906,51.7326752 45.939005,47.8018145 45.939005,40.6858282 C45.939005,28.035186 29.7738035,28.3740425 29.7738035,22.1051974 C29.7738035,19.5637737 31.6617103,19.2249173 32.7826549,19.2249173 C33.9625966,19.2249173 36.0864917,19.4328883 35.9095005,24.1768792 Z"
-            fill="#FFFFFF"
-            fill-rule="nonzero"
-            id="path9_fill-path"
-          />
-          
-      
-          <path
-            d="M44.0461638,0.830433986 L50.1874092,0.446606143 L50.443532,7.7810017 C50.4527198,8.04410717 50.2468789,8.26484453 49.9837734,8.27403237 C49.871115,8.27796649 49.7607078,8.24184808 49.6721567,8.17209069 L47.3089847,6.3104681 L44.5110468,8.43287463 C44.3012992,8.591981 44.0022839,8.55092814 43.8431776,8.34118051 C43.7762017,8.25288717 43.742082,8.14401677 43.7466857,8.03329059 L44.0461638,0.830433986 Z"
-            fill="#FFFFFF"
-            id="Path"
-          />
-          
-    
-        </g>
-        
-  
+        My title
       </a>
-      
-
-    </svg>
-    
-
-  </div>
-  <div
-    class="emotion-4"
-  >
-    <button
-      class="emotion-3"
+    </div>
+    <div
+      class="emotion-5"
     >
-      <svg
-        class="emotion-2"
-        viewBox="0 0 1024 1024"
+      <button
+        class="emotion-4"
       >
-        <path
-          class="emotion-1"
-          d="M184 393c66.274 0 120 53.73 120 120s-53.726 120-120 120c-66.286 0-120-53.73-120-120s53.714-120 120-120zM512 393c66.272 0 120 53.73 120 120s-53.728 120-120 120c-66.286 0-120-53.73-120-120s53.714-120 120-120zM840 393c66.272 0 120 53.73 120 120s-53.728 120-120 120c-66.286 0-120-53.73-120-120s53.714-120 120-120z"
-        />
-      </svg>
-    </button>
+        <svg
+          class="emotion-3"
+          viewBox="0 0 1024 1024"
+        >
+          <path
+            class="emotion-2"
+            d="M184 393c66.274 0 120 53.73 120 120s-53.726 120-120 120c-66.286 0-120-53.73-120-120s53.714-120 120-120zM512 393c66.272 0 120 53.73 120 120s-53.728 120-120 120c-66.286 0-120-53.73-120-120s53.714-120 120-120zM840 393c66.272 0 120 53.73 120 120s-53.728 120-120 120c-66.286 0-120-53.73-120-120s53.714-120 120-120z"
+          />
+        </svg>
+      </button>
+    </div>
+  </div>
+</div>
+`;
+
+exports[`Storyshots UI|Sidebar/SidebarHeading longText 1`] = `
+.emotion-2 {
+  shape-rendering: inherit;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  display: block;
+}
+
+.emotion-1 {
+  fill: currentColor;
+}
+
+.emotion-0 {
+  font-size: 14px;
+  font-weight: 700;
+  margin-right: 10px;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  padding-top: 3px;
+  padding-bottom: 3px;
+  min-height: 28px;
+}
+
+.emotion-0 > * {
+  max-width: 100%;
+  height: auto;
+  width: auto;
+  display: block;
+}
+
+.emotion-4 {
+  display: inline-block;
+  cursor: pointer;
+}
+
+.emotion-3 {
+  border: 0;
+  border-radius: 3em;
+  cursor: pointer;
+  display: inline-block;
+  overflow: hidden;
+  padding: 10px 16px;
+  position: relative;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  vertical-align: top;
+  white-space: nowrap;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  opacity: 1;
+  margin: 0;
+  background: transparent;
+  font-size: 12px;
+  font-weight: 700;
+  line-height: 1;
+  padding: 9px;
+  box-shadow: rgba(51,51,51,0.2) 0 0 0 1px inset;
+  color: rgba(51,51,51,0.7);
+  background: transparent;
+  position: relative;
+  overflow: visible;
+  padding: 7px;
+}
+
+.emotion-3 svg {
+  display: inline-block;
+  height: 14px;
+  width: 14px;
+  vertical-align: top;
+  margin-right: 4px;
+  margin-top: -1px;
+  margin-bottom: -1px;
+  pointer-events: none;
+}
+
+.emotion-3 svg path {
+  fill: currentColor;
+}
+
+.emotion-3 svg {
+  display: block;
+  margin: 0;
+}
+
+.emotion-3:hover {
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
+}
+
+.emotion-3:active {
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
+  color: #333;
+}
+
+.emotion-5 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: flex-start;
+  -webkit-box-align: flex-start;
+  -ms-flex-align: flex-start;
+  align-items: flex-start;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+}
+
+.emotion-2 {
+  shape-rendering: inherit;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  display: block;
+}
+
+.emotion-1 {
+  fill: currentColor;
+}
+
+.emotion-0 {
+  font-size: 14px;
+  font-weight: 700;
+  margin-right: 10px;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  padding-top: 3px;
+  padding-bottom: 3px;
+  min-height: 28px;
+}
+
+.emotion-0 > * {
+  max-width: 100%;
+  height: auto;
+  width: auto;
+  display: block;
+}
+
+.emotion-4 {
+  display: inline-block;
+  cursor: pointer;
+}
+
+.emotion-3 {
+  border: 0;
+  border-radius: 3em;
+  cursor: pointer;
+  display: inline-block;
+  overflow: hidden;
+  padding: 10px 16px;
+  position: relative;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  vertical-align: top;
+  white-space: nowrap;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  opacity: 1;
+  margin: 0;
+  background: transparent;
+  font-size: 12px;
+  font-weight: 700;
+  line-height: 1;
+  padding: 9px;
+  box-shadow: rgba(51,51,51,0.2) 0 0 0 1px inset;
+  color: rgba(51,51,51,0.7);
+  background: transparent;
+  position: relative;
+  overflow: visible;
+  padding: 7px;
+}
+
+.emotion-3 svg {
+  display: inline-block;
+  height: 14px;
+  width: 14px;
+  vertical-align: top;
+  margin-right: 4px;
+  margin-top: -1px;
+  margin-bottom: -1px;
+  pointer-events: none;
+}
+
+.emotion-3 svg path {
+  fill: currentColor;
+}
+
+.emotion-3 svg {
+  display: block;
+  margin: 0;
+}
+
+.emotion-3:hover {
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
+}
+
+.emotion-3:active {
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
+  color: #333;
+}
+
+.emotion-5 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: flex-start;
+  -webkit-box-align: flex-start;
+  -ms-flex-align: flex-start;
+  align-items: flex-start;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+}
+
+<div
+  style="width:240px;margin:1rem"
+>
+  <div
+    class="emotion-5"
+  >
+    <div
+      class="emotion-0"
+    >
+      My title is way to long to actually fit
+    </div>
+    <div
+      class="emotion-4"
+    >
+      <button
+        class="emotion-3"
+      >
+        <svg
+          class="emotion-2"
+          viewBox="0 0 1024 1024"
+        >
+          <path
+            class="emotion-1"
+            d="M184 393c66.274 0 120 53.73 120 120s-53.726 120-120 120c-66.286 0-120-53.73-120-120s53.714-120 120-120zM512 393c66.272 0 120 53.73 120 120s-53.728 120-120 120c-66.286 0-120-53.73-120-120s53.714-120 120-120zM840 393c66.272 0 120 53.73 120 120s-53.728 120-120 120c-66.286 0-120-53.73-120-120s53.714-120 120-120z"
+          />
+        </svg>
+      </button>
+    </div>
   </div>
 </div>
 `;
@@ -8110,11 +8670,22 @@ exports[`Storyshots UI|Sidebar/SidebarHeading menuHighlighted 1`] = `
 .emotion-2 {
   font-size: 14px;
   font-weight: 700;
+  margin-right: 10px;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  padding-top: 3px;
+  padding-bottom: 3px;
+  min-height: 28px;
 }
 
 .emotion-2 > * {
-  max-height: 32px;
-  max-width: 200px;
+  max-width: 100%;
   height: auto;
   width: auto;
   display: block;
@@ -8125,23 +8696,6 @@ exports[`Storyshots UI|Sidebar/SidebarHeading menuHighlighted 1`] = `
   color: inherit;
   -webkit-text-decoration: none;
   text-decoration: none;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-1:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-1:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
 }
 
 .emotion-0 {
@@ -8160,10 +8714,10 @@ exports[`Storyshots UI|Sidebar/SidebarHeading menuHighlighted 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
+  -webkit-align-items: flex-start;
+  -webkit-box-align: flex-start;
+  -ms-flex-align: flex-start;
+  align-items: flex-start;
   -webkit-box-pack: justify;
   -webkit-justify-content: space-between;
   -ms-flex-pack: justify;
@@ -8262,11 +8816,22 @@ exports[`Storyshots UI|Sidebar/SidebarHeading menuHighlighted 1`] = `
 .emotion-2 {
   font-size: 14px;
   font-weight: 700;
+  margin-right: 10px;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  padding-top: 3px;
+  padding-bottom: 3px;
+  min-height: 28px;
 }
 
 .emotion-2 > * {
-  max-height: 32px;
-  max-width: 200px;
+  max-width: 100%;
   height: auto;
   width: auto;
   display: block;
@@ -8277,23 +8842,6 @@ exports[`Storyshots UI|Sidebar/SidebarHeading menuHighlighted 1`] = `
   color: inherit;
   -webkit-text-decoration: none;
   text-decoration: none;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-1:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-1:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
 }
 
 .emotion-0 {
@@ -8312,10 +8860,10 @@ exports[`Storyshots UI|Sidebar/SidebarHeading menuHighlighted 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
+  -webkit-align-items: flex-start;
+  -webkit-box-align: flex-start;
+  -ms-flex-align: flex-start;
+  align-items: flex-start;
   -webkit-box-pack: justify;
   -webkit-justify-content: space-between;
   -ms-flex-pack: justify;
@@ -8400,81 +8948,89 @@ exports[`Storyshots UI|Sidebar/SidebarHeading menuHighlighted 1`] = `
 }
 
 <div
-  class="emotion-7"
+  style="width:240px;margin:1rem"
 >
   <div
-    class="emotion-2"
+    class="emotion-7"
   >
-    <a
-      class="emotion-1"
-      href="./"
+    <div
+      class="emotion-2"
     >
-      <svg
-        class="emotion-0"
-        height="40px"
-        title="Storybook"
-        viewBox="0 0 200 40"
-        width="200px"
+      <a
+        class="emotion-1"
+        href="./"
       >
-        <defs>
-          <path
-            d="M1.2 36.9L0 3.9c0-1.1.8-2 1.9-2.1l28-1.8a2 2 0 0 1 2.2 1.9 2 2 0 0 1 0 .1v36a2 2 0 0 1-2 2 2 2 0 0 1-.1 0L3.2 38.8a2 2 0 0 1-2-2z"
-            id="a"
-          />
-        </defs>
-        <g
-          fill="none"
-          fill-rule="evenodd"
+        <svg
+          class="emotion-0"
+          height="40px"
+          role="img"
+          title="Storybook"
+          viewBox="0 0 200 40"
+          width="200px"
         >
-          <path
-            d="M53.3 31.7c-1.7 0-3.4-.3-5-.7-1.5-.5-2.8-1.1-3.9-2l1.6-3.5c2.2 1.5 4.6 2.3 7.3 2.3 1.5 0 2.5-.2 3.3-.7.7-.5 1.1-1 1.1-1.9 0-.7-.3-1.3-1-1.7s-2-.8-3.7-1.2c-2-.4-3.6-.9-4.8-1.5-1.1-.5-2-1.2-2.6-2-.5-1-.8-2-.8-3.2 0-1.4.4-2.6 1.2-3.6.7-1.1 1.8-2 3.2-2.6 1.3-.6 2.9-.9 4.7-.9 1.6 0 3.1.3 4.6.7 1.5.5 2.7 1.1 3.5 2l-1.6 3.5c-2-1.5-4.2-2.3-6.5-2.3-1.3 0-2.3.2-3 .8-.8.5-1.2 1.1-1.2 2 0 .5.2 1 .5 1.3.2.3.7.6 1.4.9l2.9.8c2.9.6 5 1.4 6.2 2.4a5 5 0 0 1 2 4.2 6 6 0 0 1-2.5 5c-1.7 1.2-4 1.9-7 1.9zm21-3.6l1.4-.1-.2 3.5-1.9.1c-2.4 0-4.1-.5-5.2-1.5-1.1-1-1.6-2.7-1.6-4.8v-6h-3v-3.6h3V11h4.8v4.6h4v3.6h-4v6c0 1.8.9 2.8 2.6 2.8zm11.1 3.5c-1.6 0-3-.3-4.3-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.3-1 1.7 0 3.2.3 4.4 1a7 7 0 0 1 3 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.4 1zm0-3.6c2.4 0 3.6-1.6 3.6-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.6-1c-2.3 0-3.5 1.4-3.5 4.4 0 3 1.2 4.6 3.5 4.6zm21.7-8.8l-2.7.3c-1.3.2-2.3.5-2.8 1.2-.6.6-.9 1.4-.9 2.5v8.2H96V15.7h4.6v2.6c.8-1.8 2.5-2.8 5-3h1.3l.3 4zm14-3.5h4.8L116.4 37h-4.9l3-6.6-6.4-14.8h5l4 10 4-10zm16-.4c1.4 0 2.6.3 3.6 1 1 .6 1.9 1.6 2.5 2.8.6 1.2.9 2.7.9 4.3 0 1.6-.3 3-1 4.3a6.9 6.9 0 0 1-2.4 2.9c-1 .7-2.2 1-3.6 1-1 0-2-.2-3-.7-.8-.4-1.5-1-2-1.9v2.4h-4.7V8.8h4.8v9c.5-.8 1.2-1.4 2-1.9.9-.4 1.8-.6 3-.6zM135.7 28c1.1 0 2-.4 2.6-1.2.6-.8 1-2 1-3.4 0-1.5-.4-2.5-1-3.3s-1.5-1.1-2.6-1.1-2 .3-2.6 1.1c-.6.8-1 2-1 3.3 0 1.5.4 2.6 1 3.4.6.8 1.5 1.2 2.6 1.2zm18.9 3.6c-1.7 0-3.2-.3-4.4-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.4-1 1.6 0 3 .3 4.3 1a7 7 0 0 1 3 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.3 1zm0-3.6c2.3 0 3.5-1.6 3.5-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.5-1c-2.4 0-3.6 1.4-3.6 4.4 0 3 1.2 4.6 3.6 4.6zm18 3.6c-1.7 0-3.2-.3-4.4-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.4-1 1.6 0 3 .3 4.4 1a7 7 0 0 1 2.9 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.3 1zm0-3.6c2.3 0 3.5-1.6 3.5-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.5-1c-2.4 0-3.6 1.4-3.6 4.4 0 3 1.2 4.6 3.6 4.6zm27.4 3.4h-6l-6-7v7h-4.8V8.8h4.9v13.6l5.8-6.7h5.7l-6.6 7.5 7 8.2z"
-            fill="currentColor"
-          />
-          <mask
-            fill="#fff"
-            id="b"
+          <title>
+            Storybook
+          </title>
+          <defs>
+            <path
+              d="M1.2 36.9L0 3.9c0-1.1.8-2 1.9-2.1l28-1.8a2 2 0 0 1 2.2 1.9 2 2 0 0 1 0 .1v36a2 2 0 0 1-2 2 2 2 0 0 1-.1 0L3.2 38.8a2 2 0 0 1-2-2z"
+              id="a"
+            />
+          </defs>
+          <g
+            fill="none"
+            fill-rule="evenodd"
           >
+            <path
+              d="M53.3 31.7c-1.7 0-3.4-.3-5-.7-1.5-.5-2.8-1.1-3.9-2l1.6-3.5c2.2 1.5 4.6 2.3 7.3 2.3 1.5 0 2.5-.2 3.3-.7.7-.5 1.1-1 1.1-1.9 0-.7-.3-1.3-1-1.7s-2-.8-3.7-1.2c-2-.4-3.6-.9-4.8-1.5-1.1-.5-2-1.2-2.6-2-.5-1-.8-2-.8-3.2 0-1.4.4-2.6 1.2-3.6.7-1.1 1.8-2 3.2-2.6 1.3-.6 2.9-.9 4.7-.9 1.6 0 3.1.3 4.6.7 1.5.5 2.7 1.1 3.5 2l-1.6 3.5c-2-1.5-4.2-2.3-6.5-2.3-1.3 0-2.3.2-3 .8-.8.5-1.2 1.1-1.2 2 0 .5.2 1 .5 1.3.2.3.7.6 1.4.9l2.9.8c2.9.6 5 1.4 6.2 2.4a5 5 0 0 1 2 4.2 6 6 0 0 1-2.5 5c-1.7 1.2-4 1.9-7 1.9zm21-3.6l1.4-.1-.2 3.5-1.9.1c-2.4 0-4.1-.5-5.2-1.5-1.1-1-1.6-2.7-1.6-4.8v-6h-3v-3.6h3V11h4.8v4.6h4v3.6h-4v6c0 1.8.9 2.8 2.6 2.8zm11.1 3.5c-1.6 0-3-.3-4.3-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.3-1 1.7 0 3.2.3 4.4 1a7 7 0 0 1 3 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.4 1zm0-3.6c2.4 0 3.6-1.6 3.6-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.6-1c-2.3 0-3.5 1.4-3.5 4.4 0 3 1.2 4.6 3.5 4.6zm21.7-8.8l-2.7.3c-1.3.2-2.3.5-2.8 1.2-.6.6-.9 1.4-.9 2.5v8.2H96V15.7h4.6v2.6c.8-1.8 2.5-2.8 5-3h1.3l.3 4zm14-3.5h4.8L116.4 37h-4.9l3-6.6-6.4-14.8h5l4 10 4-10zm16-.4c1.4 0 2.6.3 3.6 1 1 .6 1.9 1.6 2.5 2.8.6 1.2.9 2.7.9 4.3 0 1.6-.3 3-1 4.3a6.9 6.9 0 0 1-2.4 2.9c-1 .7-2.2 1-3.6 1-1 0-2-.2-3-.7-.8-.4-1.5-1-2-1.9v2.4h-4.7V8.8h4.8v9c.5-.8 1.2-1.4 2-1.9.9-.4 1.8-.6 3-.6zM135.7 28c1.1 0 2-.4 2.6-1.2.6-.8 1-2 1-3.4 0-1.5-.4-2.5-1-3.3s-1.5-1.1-2.6-1.1-2 .3-2.6 1.1c-.6.8-1 2-1 3.3 0 1.5.4 2.6 1 3.4.6.8 1.5 1.2 2.6 1.2zm18.9 3.6c-1.7 0-3.2-.3-4.4-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.4-1 1.6 0 3 .3 4.3 1a7 7 0 0 1 3 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.3 1zm0-3.6c2.3 0 3.5-1.6 3.5-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.5-1c-2.4 0-3.6 1.4-3.6 4.4 0 3 1.2 4.6 3.6 4.6zm18 3.6c-1.7 0-3.2-.3-4.4-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.4-1 1.6 0 3 .3 4.4 1a7 7 0 0 1 2.9 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.3 1zm0-3.6c2.3 0 3.5-1.6 3.5-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.5-1c-2.4 0-3.6 1.4-3.6 4.4 0 3 1.2 4.6 3.6 4.6zm27.4 3.4h-6l-6-7v7h-4.8V8.8h4.9v13.6l5.8-6.7h5.7l-6.6 7.5 7 8.2z"
+              fill="currentColor"
+            />
+            <mask
+              fill="#fff"
+              id="b"
+            >
+              <use
+                href="#a"
+              />
+            </mask>
             <use
+              fill="#FF4785"
+              fill-rule="nonzero"
               href="#a"
             />
-          </mask>
-          <use
-            fill="#FF4785"
-            fill-rule="nonzero"
-            href="#a"
-          />
-          <path
-            d="M23.7 5L24 .2l3.9-.3.1 4.8a.3.3 0 0 1-.5.2L26 3.8l-1.7 1.4a.3.3 0 0 1-.5-.3zm-5 10c0 .9 5.3.5 6 0 0-5.4-2.8-8.2-8-8.2-5.3 0-8.2 2.8-8.2 7.1 0 7.4 10 7.6 10 11.6 0 1.2-.5 1.9-1.8 1.9-1.6 0-2.2-.9-2.1-3.6 0-.6-6.1-.8-6.3 0-.5 6.7 3.7 8.6 8.5 8.6 4.6 0 8.3-2.5 8.3-7 0-7.9-10.2-7.7-10.2-11.6 0-1.6 1.2-1.8 2-1.8.6 0 2 0 1.9 3z"
-            fill="#FFF"
-            fill-rule="nonzero"
-            mask="url(#b)"
-          />
-        </g>
-      </svg>
-    </a>
-  </div>
-  <div
-    class="emotion-6"
-  >
-    <button
-      class="emotion-5"
+            <path
+              d="M23.7 5L24 .2l3.9-.3.1 4.8a.3.3 0 0 1-.5.2L26 3.8l-1.7 1.4a.3.3 0 0 1-.5-.3zm-5 10c0 .9 5.3.5 6 0 0-5.4-2.8-8.2-8-8.2-5.3 0-8.2 2.8-8.2 7.1 0 7.4 10 7.6 10 11.6 0 1.2-.5 1.9-1.8 1.9-1.6 0-2.2-.9-2.1-3.6 0-.6-6.1-.8-6.3 0-.5 6.7 3.7 8.6 8.5 8.6 4.6 0 8.3-2.5 8.3-7 0-7.9-10.2-7.7-10.2-11.6 0-1.6 1.2-1.8 2-1.8.6 0 2 0 1.9 3z"
+              fill="#FFF"
+              fill-rule="nonzero"
+              mask="url(#b)"
+            />
+          </g>
+        </svg>
+      </a>
+    </div>
+    <div
+      class="emotion-6"
     >
-      <svg
-        class="emotion-4"
-        viewBox="0 0 1024 1024"
+      <button
+        class="emotion-5"
       >
-        <path
-          class="emotion-3"
-          d="M184 393c66.274 0 120 53.73 120 120s-53.726 120-120 120c-66.286 0-120-53.73-120-120s53.714-120 120-120zM512 393c66.272 0 120 53.73 120 120s-53.728 120-120 120c-66.286 0-120-53.73-120-120s53.714-120 120-120zM840 393c66.272 0 120 53.73 120 120s-53.728 120-120 120c-66.286 0-120-53.73-120-120s53.714-120 120-120z"
-        />
-      </svg>
-    </button>
+        <svg
+          class="emotion-4"
+          viewBox="0 0 1024 1024"
+        >
+          <path
+            class="emotion-3"
+            d="M184 393c66.274 0 120 53.73 120 120s-53.726 120-120 120c-66.286 0-120-53.73-120-120s53.714-120 120-120zM512 393c66.272 0 120 53.73 120 120s-53.728 120-120 120c-66.286 0-120-53.73-120-120s53.714-120 120-120zM840 393c66.272 0 120 53.73 120 120s-53.728 120-120 120c-66.286 0-120-53.73-120-120s53.714-120 120-120z"
+          />
+        </svg>
+      </button>
+    </div>
   </div>
 </div>
 `;
 
-exports[`Storyshots UI|Sidebar/SidebarHeading simple 1`] = `
-.emotion-4 {
+exports[`Storyshots UI|Sidebar/SidebarHeading onlyText 1`] = `
+.emotion-2 {
   shape-rendering: inherit;
   -webkit-transform: translate3d(0,0,0);
   -ms-transform: translate3d(0,0,0);
@@ -8482,59 +9038,40 @@ exports[`Storyshots UI|Sidebar/SidebarHeading simple 1`] = `
   display: block;
 }
 
-.emotion-3 {
+.emotion-1 {
   fill: currentColor;
 }
 
-.emotion-2 {
+.emotion-0 {
   font-size: 14px;
   font-weight: 700;
+  margin-right: 10px;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  padding-top: 3px;
+  padding-bottom: 3px;
+  min-height: 28px;
 }
 
-.emotion-2 > * {
-  max-height: 32px;
-  max-width: 200px;
+.emotion-0 > * {
+  max-width: 100%;
   height: auto;
   width: auto;
   display: block;
 }
 
-.emotion-1 {
-  display: block;
-  color: inherit;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-1:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-1:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0 {
-  width: auto;
-  height: 22px;
-  display: block;
-}
-
-.emotion-6 {
+.emotion-4 {
   display: inline-block;
   cursor: pointer;
 }
 
-.emotion-5 {
+.emotion-3 {
   border: 0;
   border-radius: 3em;
   cursor: pointer;
@@ -8571,7 +9108,7 @@ exports[`Storyshots UI|Sidebar/SidebarHeading simple 1`] = `
   padding: 7px;
 }
 
-.emotion-5 svg {
+.emotion-3 svg {
   display: inline-block;
   height: 14px;
   width: 14px;
@@ -8582,40 +9119,40 @@ exports[`Storyshots UI|Sidebar/SidebarHeading simple 1`] = `
   pointer-events: none;
 }
 
-.emotion-5 svg path {
+.emotion-3 svg path {
   fill: currentColor;
 }
 
-.emotion-5 svg {
+.emotion-3 svg {
   display: block;
   margin: 0;
 }
 
-.emotion-5:hover {
+.emotion-3:hover {
   box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
 }
 
-.emotion-5:active {
+.emotion-3:active {
   box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
   color: #333;
 }
 
-.emotion-7 {
+.emotion-5 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
+  -webkit-align-items: flex-start;
+  -webkit-box-align: flex-start;
+  -ms-flex-align: flex-start;
+  align-items: flex-start;
   -webkit-box-pack: justify;
   -webkit-justify-content: space-between;
   -ms-flex-pack: justify;
   justify-content: space-between;
 }
 
-.emotion-4 {
+.emotion-2 {
   shape-rendering: inherit;
   -webkit-transform: translate3d(0,0,0);
   -ms-transform: translate3d(0,0,0);
@@ -8623,59 +9160,40 @@ exports[`Storyshots UI|Sidebar/SidebarHeading simple 1`] = `
   display: block;
 }
 
-.emotion-3 {
+.emotion-1 {
   fill: currentColor;
 }
 
-.emotion-2 {
+.emotion-0 {
   font-size: 14px;
   font-weight: 700;
+  margin-right: 10px;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  padding-top: 3px;
+  padding-bottom: 3px;
+  min-height: 28px;
 }
 
-.emotion-2 > * {
-  max-height: 32px;
-  max-width: 200px;
+.emotion-0 > * {
+  max-width: 100%;
   height: auto;
   width: auto;
   display: block;
 }
 
-.emotion-1 {
-  display: block;
-  color: inherit;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  -webkit-transition: all 150ms ease-out;
-  transition: all 150ms ease-out;
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-1:hover {
-  -webkit-transform: translate3d(0,-2px,0);
-  -ms-transform: translate3d(0,-2px,0);
-  transform: translate3d(0,-2px,0);
-}
-
-.emotion-1:active {
-  -webkit-transform: translate3d(0,0,0);
-  -ms-transform: translate3d(0,0,0);
-  transform: translate3d(0,0,0);
-}
-
-.emotion-0 {
-  width: auto;
-  height: 22px;
-  display: block;
-}
-
-.emotion-6 {
+.emotion-4 {
   display: inline-block;
   cursor: pointer;
 }
 
-.emotion-5 {
+.emotion-3 {
   border: 0;
   border-radius: 3em;
   cursor: pointer;
@@ -8712,7 +9230,7 @@ exports[`Storyshots UI|Sidebar/SidebarHeading simple 1`] = `
   padding: 7px;
 }
 
-.emotion-5 svg {
+.emotion-3 svg {
   display: inline-block;
   height: 14px;
   width: 14px;
@@ -8723,33 +9241,33 @@ exports[`Storyshots UI|Sidebar/SidebarHeading simple 1`] = `
   pointer-events: none;
 }
 
-.emotion-5 svg path {
+.emotion-3 svg path {
   fill: currentColor;
 }
 
-.emotion-5 svg {
+.emotion-3 svg {
   display: block;
   margin: 0;
 }
 
-.emotion-5:hover {
+.emotion-3:hover {
   box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
 }
 
-.emotion-5:active {
+.emotion-3:active {
   box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
   color: #333;
 }
 
-.emotion-7 {
+.emotion-5 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
+  -webkit-align-items: flex-start;
+  -webkit-box-align: flex-start;
+  -ms-flex-align: flex-start;
+  align-items: flex-start;
   -webkit-box-pack: justify;
   -webkit-justify-content: space-between;
   -ms-flex-pack: justify;
@@ -8757,22 +9275,667 @@ exports[`Storyshots UI|Sidebar/SidebarHeading simple 1`] = `
 }
 
 <div
-  class="emotion-7"
+  style="width:240px;margin:1rem"
 >
   <div
-    class="emotion-2"
+    class="emotion-5"
   >
-    <a
+    <div
+      class="emotion-0"
+    >
+      My title
+    </div>
+    <div
+      class="emotion-4"
+    >
+      <button
+        class="emotion-3"
+      >
+        <svg
+          class="emotion-2"
+          viewBox="0 0 1024 1024"
+        >
+          <path
+            class="emotion-1"
+            d="M184 393c66.274 0 120 53.73 120 120s-53.726 120-120 120c-66.286 0-120-53.73-120-120s53.714-120 120-120zM512 393c66.272 0 120 53.73 120 120s-53.728 120-120 120c-66.286 0-120-53.73-120-120s53.714-120 120-120zM840 393c66.272 0 120 53.73 120 120s-53.728 120-120 120c-66.286 0-120-53.73-120-120s53.714-120 120-120z"
+          />
+        </svg>
+      </button>
+    </div>
+  </div>
+</div>
+`;
+
+exports[`Storyshots UI|Sidebar/SidebarHeading standard 1`] = `
+.emotion-4 {
+  shape-rendering: inherit;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  display: block;
+}
+
+.emotion-3 {
+  fill: currentColor;
+}
+
+.emotion-2 {
+  font-size: 14px;
+  font-weight: 700;
+  margin-right: 10px;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  padding-top: 3px;
+  padding-bottom: 3px;
+  min-height: 28px;
+}
+
+.emotion-2 > * {
+  max-width: 100%;
+  height: auto;
+  width: auto;
+  display: block;
+}
+
+.emotion-1 {
+  display: block;
+  color: inherit;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
+.emotion-0 {
+  width: auto;
+  height: 22px;
+  display: block;
+}
+
+.emotion-6 {
+  display: inline-block;
+  cursor: pointer;
+}
+
+.emotion-5 {
+  border: 0;
+  border-radius: 3em;
+  cursor: pointer;
+  display: inline-block;
+  overflow: hidden;
+  padding: 10px 16px;
+  position: relative;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  vertical-align: top;
+  white-space: nowrap;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  opacity: 1;
+  margin: 0;
+  background: transparent;
+  font-size: 12px;
+  font-weight: 700;
+  line-height: 1;
+  padding: 9px;
+  box-shadow: rgba(51,51,51,0.2) 0 0 0 1px inset;
+  color: rgba(51,51,51,0.7);
+  background: transparent;
+  position: relative;
+  overflow: visible;
+  padding: 7px;
+}
+
+.emotion-5 svg {
+  display: inline-block;
+  height: 14px;
+  width: 14px;
+  vertical-align: top;
+  margin-right: 4px;
+  margin-top: -1px;
+  margin-bottom: -1px;
+  pointer-events: none;
+}
+
+.emotion-5 svg path {
+  fill: currentColor;
+}
+
+.emotion-5 svg {
+  display: block;
+  margin: 0;
+}
+
+.emotion-5:hover {
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
+}
+
+.emotion-5:active {
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
+  color: #333;
+}
+
+.emotion-7 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: flex-start;
+  -webkit-box-align: flex-start;
+  -ms-flex-align: flex-start;
+  align-items: flex-start;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+}
+
+.emotion-4 {
+  shape-rendering: inherit;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  display: block;
+}
+
+.emotion-3 {
+  fill: currentColor;
+}
+
+.emotion-2 {
+  font-size: 14px;
+  font-weight: 700;
+  margin-right: 10px;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  padding-top: 3px;
+  padding-bottom: 3px;
+  min-height: 28px;
+}
+
+.emotion-2 > * {
+  max-width: 100%;
+  height: auto;
+  width: auto;
+  display: block;
+}
+
+.emotion-1 {
+  display: block;
+  color: inherit;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
+.emotion-0 {
+  width: auto;
+  height: 22px;
+  display: block;
+}
+
+.emotion-6 {
+  display: inline-block;
+  cursor: pointer;
+}
+
+.emotion-5 {
+  border: 0;
+  border-radius: 3em;
+  cursor: pointer;
+  display: inline-block;
+  overflow: hidden;
+  padding: 10px 16px;
+  position: relative;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  vertical-align: top;
+  white-space: nowrap;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  opacity: 1;
+  margin: 0;
+  background: transparent;
+  font-size: 12px;
+  font-weight: 700;
+  line-height: 1;
+  padding: 9px;
+  box-shadow: rgba(51,51,51,0.2) 0 0 0 1px inset;
+  color: rgba(51,51,51,0.7);
+  background: transparent;
+  position: relative;
+  overflow: visible;
+  padding: 7px;
+}
+
+.emotion-5 svg {
+  display: inline-block;
+  height: 14px;
+  width: 14px;
+  vertical-align: top;
+  margin-right: 4px;
+  margin-top: -1px;
+  margin-bottom: -1px;
+  pointer-events: none;
+}
+
+.emotion-5 svg path {
+  fill: currentColor;
+}
+
+.emotion-5 svg {
+  display: block;
+  margin: 0;
+}
+
+.emotion-5:hover {
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
+}
+
+.emotion-5:active {
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
+  color: #333;
+}
+
+.emotion-7 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: flex-start;
+  -webkit-box-align: flex-start;
+  -ms-flex-align: flex-start;
+  align-items: flex-start;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+}
+
+<div
+  style="width:240px;margin:1rem"
+>
+  <div
+    class="emotion-7"
+  >
+    <div
+      class="emotion-2"
+    >
+      <a
+        class="emotion-1"
+        href="./"
+      >
+        <svg
+          class="emotion-0"
+          height="40px"
+          role="img"
+          title="Storybook"
+          viewBox="0 0 200 40"
+          width="200px"
+        >
+          <title>
+            Storybook
+          </title>
+          <defs>
+            <path
+              d="M1.2 36.9L0 3.9c0-1.1.8-2 1.9-2.1l28-1.8a2 2 0 0 1 2.2 1.9 2 2 0 0 1 0 .1v36a2 2 0 0 1-2 2 2 2 0 0 1-.1 0L3.2 38.8a2 2 0 0 1-2-2z"
+              id="a"
+            />
+          </defs>
+          <g
+            fill="none"
+            fill-rule="evenodd"
+          >
+            <path
+              d="M53.3 31.7c-1.7 0-3.4-.3-5-.7-1.5-.5-2.8-1.1-3.9-2l1.6-3.5c2.2 1.5 4.6 2.3 7.3 2.3 1.5 0 2.5-.2 3.3-.7.7-.5 1.1-1 1.1-1.9 0-.7-.3-1.3-1-1.7s-2-.8-3.7-1.2c-2-.4-3.6-.9-4.8-1.5-1.1-.5-2-1.2-2.6-2-.5-1-.8-2-.8-3.2 0-1.4.4-2.6 1.2-3.6.7-1.1 1.8-2 3.2-2.6 1.3-.6 2.9-.9 4.7-.9 1.6 0 3.1.3 4.6.7 1.5.5 2.7 1.1 3.5 2l-1.6 3.5c-2-1.5-4.2-2.3-6.5-2.3-1.3 0-2.3.2-3 .8-.8.5-1.2 1.1-1.2 2 0 .5.2 1 .5 1.3.2.3.7.6 1.4.9l2.9.8c2.9.6 5 1.4 6.2 2.4a5 5 0 0 1 2 4.2 6 6 0 0 1-2.5 5c-1.7 1.2-4 1.9-7 1.9zm21-3.6l1.4-.1-.2 3.5-1.9.1c-2.4 0-4.1-.5-5.2-1.5-1.1-1-1.6-2.7-1.6-4.8v-6h-3v-3.6h3V11h4.8v4.6h4v3.6h-4v6c0 1.8.9 2.8 2.6 2.8zm11.1 3.5c-1.6 0-3-.3-4.3-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.3-1 1.7 0 3.2.3 4.4 1a7 7 0 0 1 3 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.4 1zm0-3.6c2.4 0 3.6-1.6 3.6-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.6-1c-2.3 0-3.5 1.4-3.5 4.4 0 3 1.2 4.6 3.5 4.6zm21.7-8.8l-2.7.3c-1.3.2-2.3.5-2.8 1.2-.6.6-.9 1.4-.9 2.5v8.2H96V15.7h4.6v2.6c.8-1.8 2.5-2.8 5-3h1.3l.3 4zm14-3.5h4.8L116.4 37h-4.9l3-6.6-6.4-14.8h5l4 10 4-10zm16-.4c1.4 0 2.6.3 3.6 1 1 .6 1.9 1.6 2.5 2.8.6 1.2.9 2.7.9 4.3 0 1.6-.3 3-1 4.3a6.9 6.9 0 0 1-2.4 2.9c-1 .7-2.2 1-3.6 1-1 0-2-.2-3-.7-.8-.4-1.5-1-2-1.9v2.4h-4.7V8.8h4.8v9c.5-.8 1.2-1.4 2-1.9.9-.4 1.8-.6 3-.6zM135.7 28c1.1 0 2-.4 2.6-1.2.6-.8 1-2 1-3.4 0-1.5-.4-2.5-1-3.3s-1.5-1.1-2.6-1.1-2 .3-2.6 1.1c-.6.8-1 2-1 3.3 0 1.5.4 2.6 1 3.4.6.8 1.5 1.2 2.6 1.2zm18.9 3.6c-1.7 0-3.2-.3-4.4-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.4-1 1.6 0 3 .3 4.3 1a7 7 0 0 1 3 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.3 1zm0-3.6c2.3 0 3.5-1.6 3.5-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.5-1c-2.4 0-3.6 1.4-3.6 4.4 0 3 1.2 4.6 3.6 4.6zm18 3.6c-1.7 0-3.2-.3-4.4-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.4-1 1.6 0 3 .3 4.4 1a7 7 0 0 1 2.9 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.3 1zm0-3.6c2.3 0 3.5-1.6 3.5-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.5-1c-2.4 0-3.6 1.4-3.6 4.4 0 3 1.2 4.6 3.6 4.6zm27.4 3.4h-6l-6-7v7h-4.8V8.8h4.9v13.6l5.8-6.7h5.7l-6.6 7.5 7 8.2z"
+              fill="currentColor"
+            />
+            <mask
+              fill="#fff"
+              id="b"
+            >
+              <use
+                href="#a"
+              />
+            </mask>
+            <use
+              fill="#FF4785"
+              fill-rule="nonzero"
+              href="#a"
+            />
+            <path
+              d="M23.7 5L24 .2l3.9-.3.1 4.8a.3.3 0 0 1-.5.2L26 3.8l-1.7 1.4a.3.3 0 0 1-.5-.3zm-5 10c0 .9 5.3.5 6 0 0-5.4-2.8-8.2-8-8.2-5.3 0-8.2 2.8-8.2 7.1 0 7.4 10 7.6 10 11.6 0 1.2-.5 1.9-1.8 1.9-1.6 0-2.2-.9-2.1-3.6 0-.6-6.1-.8-6.3 0-.5 6.7 3.7 8.6 8.5 8.6 4.6 0 8.3-2.5 8.3-7 0-7.9-10.2-7.7-10.2-11.6 0-1.6 1.2-1.8 2-1.8.6 0 2 0 1.9 3z"
+              fill="#FFF"
+              fill-rule="nonzero"
+              mask="url(#b)"
+            />
+          </g>
+        </svg>
+      </a>
+    </div>
+    <div
+      class="emotion-6"
+    >
+      <button
+        class="emotion-5"
+      >
+        <svg
+          class="emotion-4"
+          viewBox="0 0 1024 1024"
+        >
+          <path
+            class="emotion-3"
+            d="M184 393c66.274 0 120 53.73 120 120s-53.726 120-120 120c-66.286 0-120-53.73-120-120s53.714-120 120-120zM512 393c66.272 0 120 53.73 120 120s-53.728 120-120 120c-66.286 0-120-53.73-120-120s53.714-120 120-120zM840 393c66.272 0 120 53.73 120 120s-53.728 120-120 120c-66.286 0-120-53.73-120-120s53.714-120 120-120z"
+          />
+        </svg>
+      </button>
+    </div>
+  </div>
+</div>
+`;
+
+exports[`Storyshots UI|Sidebar/SidebarHeading standardNoLink 1`] = `
+.emotion-3 {
+  shape-rendering: inherit;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  display: block;
+}
+
+.emotion-2 {
+  fill: currentColor;
+}
+
+.emotion-1 {
+  font-size: 14px;
+  font-weight: 700;
+  margin-right: 10px;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  padding-top: 3px;
+  padding-bottom: 3px;
+  min-height: 28px;
+}
+
+.emotion-1 > * {
+  max-width: 100%;
+  height: auto;
+  width: auto;
+  display: block;
+}
+
+.emotion-0 {
+  width: auto;
+  height: 22px;
+  display: block;
+}
+
+.emotion-5 {
+  display: inline-block;
+  cursor: pointer;
+}
+
+.emotion-4 {
+  border: 0;
+  border-radius: 3em;
+  cursor: pointer;
+  display: inline-block;
+  overflow: hidden;
+  padding: 10px 16px;
+  position: relative;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  vertical-align: top;
+  white-space: nowrap;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  opacity: 1;
+  margin: 0;
+  background: transparent;
+  font-size: 12px;
+  font-weight: 700;
+  line-height: 1;
+  padding: 9px;
+  box-shadow: rgba(51,51,51,0.2) 0 0 0 1px inset;
+  color: rgba(51,51,51,0.7);
+  background: transparent;
+  position: relative;
+  overflow: visible;
+  padding: 7px;
+}
+
+.emotion-4 svg {
+  display: inline-block;
+  height: 14px;
+  width: 14px;
+  vertical-align: top;
+  margin-right: 4px;
+  margin-top: -1px;
+  margin-bottom: -1px;
+  pointer-events: none;
+}
+
+.emotion-4 svg path {
+  fill: currentColor;
+}
+
+.emotion-4 svg {
+  display: block;
+  margin: 0;
+}
+
+.emotion-4:hover {
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
+}
+
+.emotion-4:active {
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
+  color: #333;
+}
+
+.emotion-6 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: flex-start;
+  -webkit-box-align: flex-start;
+  -ms-flex-align: flex-start;
+  align-items: flex-start;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+}
+
+.emotion-3 {
+  shape-rendering: inherit;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  display: block;
+}
+
+.emotion-2 {
+  fill: currentColor;
+}
+
+.emotion-1 {
+  font-size: 14px;
+  font-weight: 700;
+  margin-right: 10px;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  padding-top: 3px;
+  padding-bottom: 3px;
+  min-height: 28px;
+}
+
+.emotion-1 > * {
+  max-width: 100%;
+  height: auto;
+  width: auto;
+  display: block;
+}
+
+.emotion-0 {
+  width: auto;
+  height: 22px;
+  display: block;
+}
+
+.emotion-5 {
+  display: inline-block;
+  cursor: pointer;
+}
+
+.emotion-4 {
+  border: 0;
+  border-radius: 3em;
+  cursor: pointer;
+  display: inline-block;
+  overflow: hidden;
+  padding: 10px 16px;
+  position: relative;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  -webkit-transition: all 150ms ease-out;
+  transition: all 150ms ease-out;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
+  vertical-align: top;
+  white-space: nowrap;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  opacity: 1;
+  margin: 0;
+  background: transparent;
+  font-size: 12px;
+  font-weight: 700;
+  line-height: 1;
+  padding: 9px;
+  box-shadow: rgba(51,51,51,0.2) 0 0 0 1px inset;
+  color: rgba(51,51,51,0.7);
+  background: transparent;
+  position: relative;
+  overflow: visible;
+  padding: 7px;
+}
+
+.emotion-4 svg {
+  display: inline-block;
+  height: 14px;
+  width: 14px;
+  vertical-align: top;
+  margin-right: 4px;
+  margin-top: -1px;
+  margin-bottom: -1px;
+  pointer-events: none;
+}
+
+.emotion-4 svg path {
+  fill: currentColor;
+}
+
+.emotion-4 svg {
+  display: block;
+  margin: 0;
+}
+
+.emotion-4:hover {
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 1px inset;
+}
+
+.emotion-4:active {
+  box-shadow: rgba(51,51,51,0.5) 0 0 0 2px inset;
+  color: #333;
+}
+
+.emotion-6 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: flex-start;
+  -webkit-box-align: flex-start;
+  -ms-flex-align: flex-start;
+  align-items: flex-start;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+}
+
+<div
+  style="width:240px;margin:1rem"
+>
+  <div
+    class="emotion-6"
+  >
+    <div
       class="emotion-1"
-      href="./"
     >
       <svg
         class="emotion-0"
         height="40px"
+        role="img"
         title="Storybook"
         viewBox="0 0 200 40"
         width="200px"
       >
+        <title>
+          Storybook
+        </title>
         <defs>
           <path
             d="M1.2 36.9L0 3.9c0-1.1.8-2 1.9-2.1l28-1.8a2 2 0 0 1 2.2 1.9 2 2 0 0 1 0 .1v36a2 2 0 0 1-2 2 2 2 0 0 1-.1 0L3.2 38.8a2 2 0 0 1-2-2z"
@@ -8808,24 +9971,24 @@ exports[`Storyshots UI|Sidebar/SidebarHeading simple 1`] = `
           />
         </g>
       </svg>
-    </a>
-  </div>
-  <div
-    class="emotion-6"
-  >
-    <button
+    </div>
+    <div
       class="emotion-5"
     >
-      <svg
+      <button
         class="emotion-4"
-        viewBox="0 0 1024 1024"
       >
-        <path
+        <svg
           class="emotion-3"
-          d="M184 393c66.274 0 120 53.73 120 120s-53.726 120-120 120c-66.286 0-120-53.73-120-120s53.714-120 120-120zM512 393c66.272 0 120 53.73 120 120s-53.728 120-120 120c-66.286 0-120-53.73-120-120s53.714-120 120-120zM840 393c66.272 0 120 53.73 120 120s-53.728 120-120 120c-66.286 0-120-53.73-120-120s53.714-120 120-120z"
-        />
-      </svg>
-    </button>
+          viewBox="0 0 1024 1024"
+        >
+          <path
+            class="emotion-2"
+            d="M184 393c66.274 0 120 53.73 120 120s-53.726 120-120 120c-66.286 0-120-53.73-120-120s53.714-120 120-120zM512 393c66.272 0 120 53.73 120 120s-53.728 120-120 120c-66.286 0-120-53.73-120-120s53.714-120 120-120zM840 393c66.272 0 120 53.73 120 120s-53.728 120-120 120c-66.286 0-120-53.73-120-120s53.714-120 120-120z"
+          />
+        </svg>
+      </button>
+    </div>
   </div>
 </div>
 `;
diff --git a/lib/components/src/brand/StorybookLogo.js b/lib/components/src/brand/StorybookLogo.js
index 2336359e2e8..ace23e59dea 100644
--- a/lib/components/src/brand/StorybookLogo.js
+++ b/lib/components/src/brand/StorybookLogo.js
@@ -1,7 +1,9 @@
 import React from 'react';
+import PropTypes from 'prop-types';
 
-export const StorybookLogo = ({ ...props }) => (
-  <svg width="200px" height="40px" viewBox="0 0 200 40" {...props} title="Storybook">
+export const StorybookLogo = ({ alt, ...props }) => (
+  <svg width="200px" height="40px" viewBox="0 0 200 40" {...props} title={alt} role="img">
+    {alt ? <title>{alt}</title> : null}
     <defs>
       <path
         d="M1.2 36.9L0 3.9c0-1.1.8-2 1.9-2.1l28-1.8a2 2 0 0 1 2.2 1.9 2 2 0 0 1 0 .1v36a2 2 0 0 1-2 2 2 2 0 0 1-.1 0L3.2 38.8a2 2 0 0 1-2-2z"
@@ -26,3 +28,7 @@ export const StorybookLogo = ({ ...props }) => (
     </g>
   </svg>
 );
+
+StorybookLogo.propTypes = {
+  alt: PropTypes.string.isRequired,
+};
diff --git a/lib/theming/src/base.ts b/lib/theming/src/base.ts
index 98d239e1570..061566cf47f 100644
--- a/lib/theming/src/base.ts
+++ b/lib/theming/src/base.ts
@@ -101,7 +101,11 @@ export type Animation = typeof animation;
 export type Easing = typeof easing;
 
 export type TextSize = number | string;
-export type Brand = string;
+export interface Brand {
+  title: string | undefined;
+  url: string | null | undefined;
+  image: string | null | undefined;
+}
 
 export interface Theme {
   color: Color;
@@ -127,7 +131,6 @@ export interface Theme {
   barSelectedColor: string;
   barBg: string;
 
-  // Brand logo/text
   brand: Brand;
 
   code: {
diff --git a/lib/theming/src/brand.tsx b/lib/theming/src/brand.tsx
deleted file mode 100644
index 9b9674d971b..00000000000
--- a/lib/theming/src/brand.tsx
+++ /dev/null
@@ -1,51 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import styled from '@emotion/styled';
-
-const Svg = styled.svg(({ inline }: { inline: boolean; children: React.ReactNode }) =>
-  inline
-    ? {
-        display: 'inline-block',
-      }
-    : {
-        display: 'block',
-      }
-);
-Svg.displayName = 'Svg';
-
-const Storybook = (props: { inline: boolean; height: string }) => (
-  <Svg viewBox="0 0 420 538" {...props}>
-    <path d="M 420,0 28,28 52,520 420,538 Z" fill="#f1618c" />
-    <path d="M 324.8652,6.79492 320,72 348.4004,50.5996 372,72 V 3.42774 Z" fill="#fff" />
-    <path
-      d="m 230,96.80078 c 67.6,0 106.5996,37.19884 104.5996,111.79882 l -77.4004,2 v -0.1992 c 1.6,-40 -15.7984,-44 -25.3984,-44 -9,0 -24.4004,2.8004 -24.4004,24.4004 0,53.4 131.4004,50.4 131.4004,158 0,60.4 -46.8008,88.39844 -106.8008,88.39844 -62,0 -116.4,-21.19884 -110,-113.79884 h 81 c -1,37.4 7.2008,50.79884 27.8008,50.79884 16,0 23.1992,-8.99844 23.1992,-24.39844 0,-54.8 -129.5996,-56.6 -129.5996,-157 0,-57.6 37.5996,-96 105.5996,-96 z"
-      fill="#fff"
-    />
-    <path d="M 42,520 18,28 H 0 l 18,492 z" fill="#b57ee5" />
-  </Svg>
-);
-const BrandWrapper = styled.a({
-  minHeight: 30,
-  verticalAlign: 'top',
-  display: 'flex',
-  color: 'inherit',
-  textDecoration: 'none',
-});
-const BrandText = styled.span({
-  paddingLeft: 10,
-  alignItems: 'center',
-  display: 'flex',
-  lineHeight: '12px',
-});
-
-export const Brand = ({ title }: { title: string }) => (
-  <BrandWrapper href="./">
-    <Storybook height="30px" inline />
-    <BrandText>
-      <strong>{title}</strong>
-    </BrandText>
-  </BrandWrapper>
-);
-Brand.propTypes = {
-  title: PropTypes.string.isRequired,
-};
diff --git a/lib/theming/src/create.ts b/lib/theming/src/create.ts
index e4bfe3fe96d..dce9514df68 100644
--- a/lib/theming/src/create.ts
+++ b/lib/theming/src/create.ts
@@ -41,7 +41,9 @@ interface ThemeVar {
   inputTextColor?: string;
   inputBorderRadius?: number;
 
-  brand?: Brand;
+  brandTitle?: string;
+  brandUrl?: string;
+  brandImage?: string;
 }
 
 const createColors = (vars: ThemeVar): Color => ({
@@ -149,7 +151,11 @@ export const create = (vars: ThemeVar, rest?: Rest): Theme => ({
   barBg: vars.barBg || color.lightest,
 
   // Brand logo/text
-  brand: vars.brand || null,
+  brand: {
+    title: vars.brandTitle,
+    url: vars.brandUrl,
+    image: vars.brandImage,
+  },
 
   code: createSyntax({
     colors: vars.base === 'light' ? lightSyntaxColors : darkSyntaxColors,
@@ -166,7 +172,7 @@ export const create = (vars: ThemeVar, rest?: Rest): Theme => ({
     BASE_LINE_HEIGHT: '18px',
     BASE_BACKGROUND_COLOR: 'transparent',
     BASE_COLOR: vars.textColor || color.darkest,
-    ARROW_COLOR: opacify(0.2, vars.appBorderColor),
+    ARROW_COLOR: opacify(0.2, vars.appBorderColor || color.border),
     ARROW_MARGIN_RIGHT: 4,
     ARROW_FONT_SIZE: 8,
     TREENODE_FONT_FAMILY: vars.fontCode || typography.fonts.mono,
diff --git a/lib/theming/src/themes/dark.ts b/lib/theming/src/themes/dark.ts
index abdbf46a8d8..5c64255032d 100644
--- a/lib/theming/src/themes/dark.ts
+++ b/lib/theming/src/themes/dark.ts
@@ -33,7 +33,4 @@ export default create({
   inputBorder: 'rgba(0,0,0,.3)',
   inputTextColor: color.lightest,
   inputBorderRadius: 4,
-
-  // Brand logo/text
-  brand: null,
 });
diff --git a/lib/theming/src/themes/light.ts b/lib/theming/src/themes/light.ts
index 3c2ed12ff98..f635af5ca6b 100644
--- a/lib/theming/src/themes/light.ts
+++ b/lib/theming/src/themes/light.ts
@@ -33,7 +33,4 @@ export default create({
   inputBorder: color.border,
   inputTextColor: color.darkest,
   inputBorderRadius: 4,
-
-  // Brand logo/text
-  brand: null,
 });
diff --git a/lib/ui/src/components/sidebar/Sidebar.stories.js b/lib/ui/src/components/sidebar/Sidebar.stories.js
index 1bf6c5585c8..8c45e6cf904 100644
--- a/lib/ui/src/components/sidebar/Sidebar.stories.js
+++ b/lib/ui/src/components/sidebar/Sidebar.stories.js
@@ -10,7 +10,7 @@ export default {
   title: 'UI|Sidebar/Sidebar',
 };
 
-const { menu } = SidebarHeadingStories.simple.storyData;
+const { menu } = SidebarHeadingStories.standard.storyData;
 const { notifications } = NotificationsListStories.single.storyData;
 const { stories, storyId } = SidebarStoriesStories.withRoot.storyData;
 
diff --git a/lib/ui/src/components/sidebar/SidebarHeading.js b/lib/ui/src/components/sidebar/SidebarHeading.js
index 8d129b0e811..df9c9c246ec 100644
--- a/lib/ui/src/components/sidebar/SidebarHeading.js
+++ b/lib/ui/src/components/sidebar/SidebarHeading.js
@@ -8,9 +8,14 @@ import { StorybookLogo, WithTooltip, TooltipLinkList, Button, Icons } from '@sto
 const BrandArea = styled.div(({ theme }) => ({
   fontSize: theme.typography.size.s2,
   fontWeight: theme.typography.weight.bold,
-  '> *': {
-    maxHeight: 32,
-    maxWidth: 200,
+  marginRight: theme.layoutMargin,
+  display: 'flex',
+  alignItems: 'center',
+  paddingTop: 3,
+  paddingBottom: 3,
+  minHeight: 28,
+  '& > *': {
+    maxWidth: '100%',
     height: 'auto',
     width: 'auto',
     display: 'block',
@@ -22,15 +27,17 @@ const Logo = styled(StorybookLogo)({
   height: 22,
   display: 'block',
 });
+const Img = styled.img({
+  width: 'auto',
+  display: 'block',
+  maxWidth: '100%',
+});
 
-const LogoLink = styled.a(
-  {
-    display: 'block',
-    color: 'inherit',
-    textDecoration: 'none',
-  },
-  ({ theme }) => theme.animation.hoverable
-);
+const LogoLink = styled.a({
+  display: 'block',
+  color: 'inherit',
+  textDecoration: 'none',
+});
 
 const MenuButton = styled(Button)(props => ({
   position: 'relative',
@@ -53,26 +60,47 @@ const MenuButton = styled(Button)(props => ({
 
 const Head = styled.div({
   display: 'flex',
-  alignItems: 'center',
+  alignItems: 'flex-start',
   justifyContent: 'space-between',
 });
 
-const Brand = withTheme(({ theme: { brand } }) =>
-  brand ? (
-    <BrandArea dangerouslySetInnerHTML={{ __html: brand }} />
-  ) : (
-    <BrandArea>
-      <LogoLink href="./">
-        <Logo />
+const Brand = withTheme(({ theme: { brand: { title = 'Storybook', url = './', image } } }) => {
+  if (image === undefined && url === null) {
+    return <Logo alt={title} />;
+  }
+  if (image === undefined && url) {
+    return (
+      <LogoLink href={url}>
+        <Logo alt={title} />
       </LogoLink>
-    </BrandArea>
-  )
-);
+    );
+  }
+  if (image === null && url === null) {
+    return title;
+  }
+  if (image === null && url) {
+    return <LogoLink href={url}>{title}</LogoLink>;
+  }
+  if (image && url === null) {
+    return <Img src={image} alt={title} />;
+  }
+  if (image && url) {
+    return (
+      <LogoLink href={url}>
+        <Img src={image} alt={title} />
+      </LogoLink>
+    );
+  }
+  return null;
+});
 
 const SidebarHeading = withState('tooltipShown', 'onVisibilityChange', false)(
   ({ menuHighlighted, menu, tooltipShown, onVisibilityChange, ...props }) => (
     <Head {...props}>
-      <Brand />
+      <BrandArea>
+        <Brand />
+      </BrandArea>
+
       <WithTooltip
         placement="top"
         trigger="click"
diff --git a/lib/ui/src/components/sidebar/SidebarHeading.stories.js b/lib/ui/src/components/sidebar/SidebarHeading.stories.js
index cf7713244d0..17f0960d90b 100644
--- a/lib/ui/src/components/sidebar/SidebarHeading.stories.js
+++ b/lib/ui/src/components/sidebar/SidebarHeading.stories.js
@@ -6,21 +6,21 @@ import SidebarHeading from './SidebarHeading';
 
 const { light: theme } = themes;
 
-const customizedBrand = `
-<svg width="64px" height="64px" viewBox="0 0 64 64" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-  <a xlink:href="https://storybook.js.org">
-    <g id="Artboard" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-      <path d="M8.04798541,58.7875918 L6.07908839,6.32540407 C6.01406344,4.5927838 7.34257463,3.12440831 9.07303814,3.01625434 L53.6958037,0.227331489 C55.457209,0.117243658 56.974354,1.45590096 57.0844418,3.21730626 C57.0885895,3.28366922 57.0906648,3.35014546 57.0906648,3.41663791 L57.0906648,60.5834697 C57.0906648,62.3483119 55.6599776,63.7789992 53.8951354,63.7789992 C53.847325,63.7789992 53.7995207,63.7779262 53.7517585,63.775781 L11.0978899,61.8600599 C9.43669044,61.7854501 8.11034889,60.4492961 8.04798541,58.7875918 Z" id="path-1" fill="#FF4785" fill-rule="nonzero"></path>
-      <path d="M35.9095005,24.1768792 C35.9095005,25.420127 44.2838488,24.8242707 45.4080313,23.9509748 C45.4080313,15.4847538 40.8652557,11.0358878 32.5466666,11.0358878 C24.2280775,11.0358878 19.5673077,15.553972 19.5673077,22.3311017 C19.5673077,34.1346028 35.4965208,34.3605071 35.4965208,40.7987804 C35.4965208,42.606015 34.6115646,43.6790606 32.6646607,43.6790606 C30.127786,43.6790606 29.1248356,42.3834613 29.2428298,37.9783269 C29.2428298,37.0226907 19.5673077,36.7247626 19.2723223,37.9783269 C18.5211693,48.6535354 25.1720308,51.7326752 32.7826549,51.7326752 C40.1572906,51.7326752 45.939005,47.8018145 45.939005,40.6858282 C45.939005,28.035186 29.7738035,28.3740425 29.7738035,22.1051974 C29.7738035,19.5637737 31.6617103,19.2249173 32.7826549,19.2249173 C33.9625966,19.2249173 36.0864917,19.4328883 35.9095005,24.1768792 Z" id="path9_fill-path" fill="#FFFFFF" fill-rule="nonzero"></path>
-      <path d="M44.0461638,0.830433986 L50.1874092,0.446606143 L50.443532,7.7810017 C50.4527198,8.04410717 50.2468789,8.26484453 49.9837734,8.27403237 C49.871115,8.27796649 49.7607078,8.24184808 49.6721567,8.17209069 L47.3089847,6.3104681 L44.5110468,8.43287463 C44.3012992,8.591981 44.0022839,8.55092814 43.8431776,8.34118051 C43.7762017,8.25288717 43.742082,8.14401677 43.7466857,8.03329059 L44.0461638,0.830433986 Z" id="Path" fill="#FFFFFF"></path>
-    </g>
-  </a>
-</svg>
-`;
-
 export default {
   component: SidebarHeading,
   title: 'UI|Sidebar/SidebarHeading',
+  decorators: [
+    storyFn => (
+      <div
+        style={{
+          width: '240px',
+          margin: '1rem',
+        }}
+      >
+        {storyFn()}
+      </div>
+    ),
+  ],
 };
 
 const menuItems = [
@@ -28,13 +28,96 @@ const menuItems = [
   { title: 'Menu Item 2', onClick: action('onActivateMenuItem') },
   { title: 'Menu Item 3', onClick: action('onActivateMenuItem') },
 ];
-export const simple = () => <SidebarHeading menu={menuItems} />;
-simple.storyData = { menu: menuItems };
 
 export const menuHighlighted = () => <SidebarHeading menuHighlighted menu={menuItems} />;
 
-export const customBrand = () => (
-  <ThemeProvider theme={{ ...theme, brand: customizedBrand }}>
+export const standard = () => (
+  <ThemeProvider
+    theme={{
+      ...theme,
+      brand: {
+        title: undefined,
+        url: undefined,
+        image: undefined,
+      },
+    }}
+  >
+    <SidebarHeading menu={menuItems} />
+  </ThemeProvider>
+);
+standard.storyData = { menu: menuItems };
+
+export const standardNoLink = () => (
+  <ThemeProvider
+    theme={{
+      ...theme,
+      brand: {
+        title: undefined,
+        url: null,
+        image: undefined,
+      },
+    }}
+  >
+    <SidebarHeading menu={menuItems} />
+  </ThemeProvider>
+);
+
+export const linkAndText = () => (
+  <ThemeProvider
+    theme={{
+      ...theme,
+      brand: {
+        title: 'My title',
+        url: 'https://example.com',
+        image: null,
+      },
+    }}
+  >
+    <SidebarHeading menu={menuItems} />
+  </ThemeProvider>
+);
+
+export const onlyText = () => (
+  <ThemeProvider
+    theme={{
+      ...theme,
+      brand: {
+        title: 'My title',
+        url: null,
+        image: null,
+      },
+    }}
+  >
+    <SidebarHeading menu={menuItems} />
+  </ThemeProvider>
+);
+
+export const longText = () => (
+  <ThemeProvider
+    theme={{
+      ...theme,
+      brand: {
+        title: 'My title is way to long to actually fit',
+        url: null,
+        image: null,
+      },
+    }}
+  >
+    <SidebarHeading menu={menuItems} />
+  </ThemeProvider>
+);
+
+export const customBrandImage = () => (
+  <ThemeProvider
+    theme={{
+      ...theme,
+      brand: {
+        title: 'My Title',
+        url: 'https://example.com',
+        image: 'https://via.placeholder.com/150x22',
+      },
+    }}
+  >
     <SidebarHeading menu={menuItems} />
   </ThemeProvider>
 );
diff --git a/lib/ui/src/core/init-provider-api.js b/lib/ui/src/core/init-provider-api.js
index e92d4045749..d3a24b41dac 100644
--- a/lib/ui/src/core/init-provider-api.js
+++ b/lib/ui/src/core/init-provider-api.js
@@ -1,4 +1,23 @@
 import pick from 'lodash.pick';
+import deprecate from 'util-deprecate';
+
+import { create } from '@storybook/theming';
+
+const deprecatedUiOptions = ['name', 'url'];
+const applyDeprecatedUiOptions = deprecate(({ name, url, theme }) => {
+  const vars = {
+    brandTitle: name,
+    brandUrl: url,
+  };
+
+  return { theme: create(vars, theme) };
+}, 'The `name` and `url` options are deprecated -- instead use the `theme.brandTitle` or `theme.brandUrl`');
+const checkDeprecatedUiOptions = options => {
+  if (deprecatedUiOptions.find(key => !!options[key])) {
+    return applyDeprecatedUiOptions(options);
+  }
+  return {};
+};
 
 export default ({ provider, api, store }) => {
   const providerAPI = {
@@ -16,6 +35,7 @@ export default ({ provider, api, store }) => {
           ui: {
             ...ui,
             ...pick(options, Object.keys(ui)),
+            ...checkDeprecatedUiOptions(options),
           },
           selectedPanel: options.panel || options.selectedPanel || selectedPanel,
         });
diff --git a/lib/ui/src/core/initial-state.js b/lib/ui/src/core/initial-state.js
index 762aed06bf3..5ac502039fc 100644
--- a/lib/ui/src/core/initial-state.js
+++ b/lib/ui/src/core/initial-state.js
@@ -4,8 +4,6 @@ import merge from '../libs/merge';
 
 const initial = {
   ui: {
-    name: 'STORYBOOK',
-    url: 'https://github.com/storybooks/storybook',
     enableShortcuts: true,
     sortStoriesByKind: false,
     sidebarAnimations: true,

From 4057541bff5fd4cd657569ebd1242556f174b965 Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Tue, 26 Feb 2019 17:30:32 +0800
Subject: [PATCH 090/249] Merge pull request #5753 from gaetanmaisse/fix-5382

fix: remove call to `forceReRender()` on STORY_CHANGED in addon knobs
---
 addons/knobs/src/registerKnobs.js | 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)

diff --git a/addons/knobs/src/registerKnobs.js b/addons/knobs/src/registerKnobs.js
index ae4c2388b56..687f7d59a34 100644
--- a/addons/knobs/src/registerKnobs.js
+++ b/addons/knobs/src/registerKnobs.js
@@ -37,6 +37,12 @@ function knobClicked(clicked) {
 function resetKnobs() {
   knobStore.reset();
 
+  setPaneKnobs(false);
+}
+
+function resetKnobsAndForceReRender() {
+  knobStore.reset();
+
   forceReRender();
 
   setPaneKnobs(false);
@@ -47,7 +53,7 @@ function disconnectCallbacks() {
   channel.removeListener(CHANGE, knobChanged);
   channel.removeListener(CLICK, knobClicked);
   channel.removeListener(STORY_CHANGED, resetKnobs);
-  channel.removeListener(RESET, resetKnobs);
+  channel.removeListener(RESET, resetKnobsAndForceReRender);
   knobStore.unsubscribe(setPaneKnobs);
 }
 
@@ -56,7 +62,7 @@ function connectCallbacks() {
   channel.on(CHANGE, knobChanged);
   channel.on(CLICK, knobClicked);
   channel.on(STORY_CHANGED, resetKnobs);
-  channel.on(RESET, resetKnobs);
+  channel.on(RESET, resetKnobsAndForceReRender);
   knobStore.subscribe(setPaneKnobs);
 
   return disconnectCallbacks;

From 66765e98af5b2258d0a758cceb84c890982e2867 Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Tue, 26 Feb 2019 18:03:15 +0800
Subject: [PATCH 091/249] Merge pull request #5773 from
 storybooks/5665-fix-deprecated-options

Fix deprecated url/name options
---
 lib/ui/src/core/init-provider-api.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/lib/ui/src/core/init-provider-api.js b/lib/ui/src/core/init-provider-api.js
index d3a24b41dac..589c65e9e1a 100644
--- a/lib/ui/src/core/init-provider-api.js
+++ b/lib/ui/src/core/init-provider-api.js
@@ -8,6 +8,7 @@ const applyDeprecatedUiOptions = deprecate(({ name, url, theme }) => {
   const vars = {
     brandTitle: name,
     brandUrl: url,
+    brandImage: null,
   };
 
   return { theme: create(vars, theme) };

From cabe3ba29e0eefd3387e2d6fc018281018a8bf49 Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Tue, 26 Feb 2019 19:45:13 +0800
Subject: [PATCH 092/249] Merge pull request #5758 from
 storybooks/options-back-compat

Addon-options back compat
---
 MIGRATION.md                                  | 100 ++++++++++++++++--
 addons/options/README.md                      |  11 +-
 docs/gatsby-config.js                         |   1 +
 .../components/Homepage/MainLinks/index.js    |   3 +
 docs/src/pages/addons/using-addons/index.md   |  10 +-
 .../configurations/options-parameter/index.md | 100 ++++++++++++++++++
 .../src/pages/configurations/theming/index.md |  10 +-
 lib/ui/src/core/init-provider-api.js          |  69 +++++++++---
 8 files changed, 265 insertions(+), 39 deletions(-)
 create mode 100644 docs/src/pages/configurations/options-parameter/index.md

diff --git a/MIGRATION.md b/MIGRATION.md
index 8ed6b1ab2b2..b2897816561 100644
--- a/MIGRATION.md
+++ b/MIGRATION.md
@@ -2,6 +2,8 @@
 
 - [From version 4.1.x to 5.0.x](#from-version-41x-to-50x)
   - [Webpack config simplification](#webpack-config-simplification)
+  - [Story hierarchy defaults](#story-hierarchy-defaults)
+  - [Options addon deprecated](#options-addon-deprecated)
 - [From version 4.0.x to 4.1.x](#from-version-40x-to-41x)
   - [Private addon config](#private-addon-config)
   - [React 15.x](#react-15x)
@@ -59,6 +61,84 @@ In contrast, the 4.x configuration function accepted either two or three argumen
 
 Please see the [current custom webpack documentation](https://github.com/storybooks/storybook/blob/next/docs/src/pages/configurations/custom-webpack-config/index.md) for more information on custom webpack config.
 
+## Story hierarchy defaults
+
+Storybook's UI contains a hierarchical tree of stories that can be configured by `hierarchySeparator` and `hierarchyRootSeparator` [options](./addons/options/README.md).
+
+In Storybook 4.x the values defaulted to `null` for both of these options, so that there would be no hierarchy by default.
+
+In 5.0, we now provide recommended defaults:
+
+```js
+{
+  hierarchyRootSeparator: '|',
+  hierarchySeparator: /\/|\./,
+}
+```
+
+This means if you use the characters { `|`, `/`, `.` } in your story kinds it will triggger the story hierarchy to appear. For example `storiesOf('UI|Widgets/Basics/Button')` will create a story root called `UI` containing a `Widgets/Basics` group, containing a `Button` component.
+
+If you wish to opt-out of this new behavior and restore the flat UI, simply set them back to `null` in your storybook config, or remove { `|`, `/`, `.` } from your story kinds:
+
+```js
+addParameters({
+  options: {
+    hierarchyRootSeparator: null,
+    hierarchySeparator: null,
+  },
+});
+```
+
+## Options addon deprecated
+
+In 4.x we added story parameters. In 5.x we've deprecated the options addon in favor of [global parameters](./docs/src/pages/configurations/options-parameter/index.md), and we've also renamed some of the options in the process (though we're maintaining backwards compatibility until 6.0).
+
+Here's an old configuration:
+
+```js
+addDecorator(
+  withOptions({
+    name: 'Storybook',
+    url: 'https://storybook.js.org',
+    goFullScreen: false,
+    addonPanelInRight: true,
+  })
+);
+```
+
+And here's its new counterpart:
+
+```js
+import { create } from '@storybook/theming';
+addParameters({
+  options: {
+    theme: create({
+      base: 'light',
+      brandTitle: 'Storybook',
+      brandUrl: 'https://storybook.js.org',
+      // To control appearance:
+      // brandImage: 'http://url.of/some.svg',
+    }),
+    isFullscreen: false,
+    panelPosition: 'right',
+  },
+});
+```
+
+Here is the mapping from old options to new:
+
+| Old               | New              |
+| ----------------- | ---------------- |
+| name              | theme.brandTitle |
+| url               | theme.brandUrl   |
+| goFullScreen      | isFullscreen     |
+| showStoriesPanel  | showNav          |
+| showAddonPanel    | showPanel        |
+| addonPanelInRight | panelPosition    |
+| showSearchBox     |                  |
+
+Storybook v5 removes the search dialog box in favor of a quick search in the navigation view, so `showSearchBox` has been removed.
+
 ## From version 4.0.x to 4.1.x
 
 There are are a few migrations you should be aware of in 4.1, including one unintentionally breaking change for advanced addon usage.
@@ -89,16 +169,16 @@ Also, here's the error you'll get if you're running an older version of React:
 
 ```
 core.browser.esm.js:15 Uncaught TypeError: Object(...) is not a function
-    at Module../node_modules/@emotion/core/dist/core.browser.esm.js (core.browser.esm.js:15)
-    at __webpack_require__ (bootstrap:724)
-    at fn (bootstrap:101)
-    at Module../node_modules/@emotion/styled-base/dist/styled-base.browser.esm.js (styled-base.browser.esm.js:1)
-    at __webpack_require__ (bootstrap:724)
-    at fn (bootstrap:101)
-    at Module../node_modules/@emotion/styled/dist/styled.esm.js (styled.esm.js:1)
-    at __webpack_require__ (bootstrap:724)
-    at fn (bootstrap:101)
-    at Object../node_modules/@storybook/components/dist/navigation/MenuLink.js (MenuLink.js:12)
+  at Module../node_modules/@emotion/core/dist/core.browser.esm.js (core.browser.esm.js:15)
+  at **webpack_require** (bootstrap:724)
+  at fn (bootstrap:101)
+  at Module../node_modules/@emotion/styled-base/dist/styled-base.browser.esm.js (styled-base.browser.esm.js:1)
+  at **webpack_require** (bootstrap:724)
+  at fn (bootstrap:101)
+  at Module../node_modules/@emotion/styled/dist/styled.esm.js (styled.esm.js:1)
+  at **webpack_require** (bootstrap:724)
+  at fn (bootstrap:101)
+  at Object../node_modules/@storybook/components/dist/navigation/MenuLink.js (MenuLink.js:12)
 ```
 
 ### Generic addons
diff --git a/addons/options/README.md b/addons/options/README.md
index 57672d3457d..33b90b441cc 100644
--- a/addons/options/README.md
+++ b/addons/options/README.md
@@ -1,3 +1,12 @@
+#NOTE: Options Addon is deprecated as of Storybook 5.0
+
+Options are now configured using the [`options` parameter](../../docs/src/pages/configurations/options-parameter/index.md) which is built into Storybook.
+
+- Global options: `addParameters({ options: { ... }})` and no addon is needed.
+- Story options: `storiesOf(...).add('name', storyFn, { options: { ... }})`
+
+See the [migration docs](../../MIGRATION.md#options-addon-deprecated) for what's changed.
+
 # Storybook Options Addon
 
 The Options addon can be used to (re-)configure the [Storybook](https://storybook.js.org) UI at runtime.
@@ -136,5 +145,5 @@ Make sure you also have the type definitions installed for the following libs:
 
 - Node
 - React
- 
+
 You can install them using `yarn add @types/node @types/react --dev`, assuming you are using TypeScript >2.0.
diff --git a/docs/gatsby-config.js b/docs/gatsby-config.js
index 185a343075f..3b807525588 100644
--- a/docs/gatsby-config.js
+++ b/docs/gatsby-config.js
@@ -23,6 +23,7 @@ module.exports = {
         '/basics/live-examples/',
       ],
       configurations: [
+        '/configurations/options-parameter/',
         '/configurations/default-config/',
         '/configurations/custom-webpack-config/',
         '/configurations/custom-babel-config/',
diff --git a/docs/src/components/Homepage/MainLinks/index.js b/docs/src/components/Homepage/MainLinks/index.js
index 5aa7e8306ff..2a82ba7feed 100644
--- a/docs/src/components/Homepage/MainLinks/index.js
+++ b/docs/src/components/Homepage/MainLinks/index.js
@@ -97,6 +97,9 @@ class MainLinks extends React.Component {
                 <h3>Configuration</h3>
               </Link>
               <ul>
+                <li>
+                  <Link to="/configurations/options-parameter/">Storybook options</Link>
+                </li>
                 <li>
                   <Link to="/configurations/custom-babel-config/">Babel configurations</Link>
                 </li>
diff --git a/docs/src/pages/addons/using-addons/index.md b/docs/src/pages/addons/using-addons/index.md
index fd4d2123d35..a74bc728e9c 100644
--- a/docs/src/pages/addons/using-addons/index.md
+++ b/docs/src/pages/addons/using-addons/index.md
@@ -22,8 +22,8 @@ import '@storybook/addon-actions/register';
 import '@storybook/addon-links/register';
 import '@storybook/addon-notes/register';
 ```
-Once created, youl'll have to restart storybook to make the underlying webpack aware of the addons file.
 
+Once created, you'll have to restart storybook to make the underlying webpack aware of the addons file.
 
 This will register all the addons and you'll be able to see the actions and notes panels (in that order) when you are viewing the story. (Links do not register a tab--check individual addon docs to see which Storybook features they use!)
 
@@ -57,6 +57,7 @@ Then you'll be able to see those notes when you are viewing the story.
 ![Stories with notes](../static/stories-with-notes.png)
 
 ## Global Configuration
+
 Sometimes you might want to configure an addon globally, as in the case of collocating stories with components, or just simply to keep your stories file cleaner. To do that, you can add your decorators to a config file, typically in `.storybook/config.js`. Here's an example of how you might do that.
 
 ```js
@@ -65,11 +66,10 @@ import { configure, addParameters } from '@storybook/react';
 addParameters({
   options: {
     name: 'CRA Kitchen Sink',
-    goFullScreen: false,
-    showAddonsPanel: true,
-    showSearchBox: false
+    isFullScreen: false,
+    showPanel: true,
     // more configuration here
-  }
+  },
 });
 ```
 
diff --git a/docs/src/pages/configurations/options-parameter/index.md b/docs/src/pages/configurations/options-parameter/index.md
new file mode 100644
index 00000000000..5ba802c18c3
--- /dev/null
+++ b/docs/src/pages/configurations/options-parameter/index.md
@@ -0,0 +1,100 @@
+---
+id: 'options-parameter'
+title: 'Options Parameter'
+---
+
+Storybook UI is configurable using an options API that allows you to tweak its appearance globally and for each story.
+
+> NOTE: If you've used older versions of Storybook this is formerly [addon-options](https://github.com/storybooks/storybook/tree/next/addons/options), which has been deprecated.
+
+### Global options
+
+Import and use `addParameters` with the `options` key in your `config.js` file.
+
+```js
+import { addParameters, configure } from '@storybook/react';
+
+// Option defaults:
+addParameters({
+  options: {
+    /**
+     * show story component as full screen
+     * @type {Boolean}
+     */
+    isFullScreen: false,
+    /**
+     * display panel that shows a list of stories
+     * @type {Boolean}
+     */
+    showNav: true,
+    /**
+     * display panel that shows addon configurations
+     * @type {Boolean}
+     */
+    showPanel: true,
+    /**
+     * where to show the addon panel
+     * @type {String}
+     */
+    panelPosition: 'bottom',
+    /**
+     * sorts stories
+     * @type {Boolean}
+     */
+    sortStoriesByKind: false,
+    /**
+     * regex for finding the hierarchy separator
+     * @example:
+     *   null - turn off hierarchy
+     *   /\// - split by `/`
+     *   /\./ - split by `.`
+     *   /\/|\./ - split by `/` or `.`
+     * @type {Regex}
+     */
+    hierarchySeparator: /\/|\./,
+    /**
+     * regex for finding the hierarchy root separator
+     * @example:
+     *   null - turn off multiple hierarchy roots
+     *   /\|/ - split by `|`
+     * @type {Regex}
+     */
+    hierarchyRootSeparator: /\|/,
+    /**
+     * sidebar tree animations
+     * @type {Boolean}
+     */
+    sidebarAnimations: true,
+    /**
+     * enable/disable shortcuts
+     * @type {Boolean}
+     */
+    enableShortcuts: true,
+    /**
+     * theme storybook, see link below
+     */
+    theme: undefined,
+  },
+});
+```
+
+For more information on configuring the `theme`, see [theming](../theming/).
+
+### Per-story options
+
+The options-addon accepts story parameters on the `options` key:
+
+```js
+import { storiesOf } from '@storybook/react';
+import MyComponent from './my-component';
+
+storiesOf('Addons|Custom options', module)
+  // If you want to set the option for all stories in of this kind
+  .addParameters({ options: { panelPosition: 'bottom' } })
+  .add(
+    'Story for MyComponent',
+    () => <MyComponent />,
+    // If you want to set the options for a specific story
+    { options: { panelPosition: 'right' } }
+  );
+```
diff --git a/docs/src/pages/configurations/theming/index.md b/docs/src/pages/configurations/theming/index.md
index b69383d2f59..81e73015771 100644
--- a/docs/src/pages/configurations/theming/index.md
+++ b/docs/src/pages/configurations/theming/index.md
@@ -3,19 +3,13 @@ id: 'theming'
 title: 'Theming Storybook'
 ---
 
-Storybook is theme-able! You can change theme variables using [addon-options](https://github.com/storybooks/storybook/tree/master/addons/options).
+Storybook is theme-able! You can change theme variables using the [options parameter](../options-parameter).
 
 ## Set a theme
 
 You can do this in an decorator, addon or in `.storybook/config.js`. Changing theme at runtime is supported!
 
-First, create or modify `.storybook/addons.js` to include registering addon-options:
-
-```js
-import '@storybook/addon-options/register';
-```
-
-Then, modify `.storybook/config.js` to include your new options:
+Just modify `.storybook/config.js` to include your new options:
 
 ```js
 import { addParameters, configure } from '@storybook/react';
diff --git a/lib/ui/src/core/init-provider-api.js b/lib/ui/src/core/init-provider-api.js
index 589c65e9e1a..f0267136cc6 100644
--- a/lib/ui/src/core/init-provider-api.js
+++ b/lib/ui/src/core/init-provider-api.js
@@ -3,8 +3,16 @@ import deprecate from 'util-deprecate';
 
 import { create } from '@storybook/theming';
 
-const deprecatedUiOptions = ['name', 'url'];
-const applyDeprecatedUiOptions = deprecate(({ name, url, theme }) => {
+const deprecationMessage = (optionsMap, prefix) =>
+  `The options { ${Object.keys(optionsMap).join(', ')} } are deprecated -- use ${
+    prefix ? `${prefix}'s` : ''
+  } { ${Object.values(optionsMap).join(', ')} } instead.`;
+
+const deprecatedThemeOptions = {
+  name: 'brandTitle',
+  url: 'brandUrl',
+};
+const applyDeprecatedThemeOptions = deprecate(({ name, url, theme }) => {
   const vars = {
     brandTitle: name,
     brandUrl: url,
@@ -12,10 +20,36 @@ const applyDeprecatedUiOptions = deprecate(({ name, url, theme }) => {
   };
 
   return { theme: create(vars, theme) };
-}, 'The `name` and `url` options are deprecated -- instead use the `theme.brandTitle` or `theme.brandUrl`');
-const checkDeprecatedUiOptions = options => {
-  if (deprecatedUiOptions.find(key => !!options[key])) {
-    return applyDeprecatedUiOptions(options);
+}, deprecationMessage(deprecatedThemeOptions));
+const checkDeprecatedThemeOptions = options => {
+  if (Object.keys(deprecatedThemeOptions).find(key => !!options[key])) {
+    return applyDeprecatedThemeOptions(options);
+  }
+  return {};
+};
+
+const deprecatedLayoutOptions = {
+  goFullScreen: 'isFullscreen',
+  showStoriesPanel: 'showNav',
+  showAddonPanel: 'showPanel',
+  addonPanelInRight: 'panelPosition',
+};
+const applyDeprecatedLayoutOptions = deprecate(options => {
+  const layoutUpdate = {};
+
+  ['goFullScreen', 'showStoriesPanel', 'showAddonPanel'].forEach(option => {
+    if (typeof options[option] !== 'undefined') {
+      layoutUpdate[deprecatedLayoutOptions[option]] = options[option];
+    }
+  });
+  if (options.addonPanelInRight) {
+    layoutUpdate.panelPosition = 'right';
+  }
+  return layoutUpdate;
+}, deprecationMessage(deprecatedLayoutOptions));
+const checkDeprecatedLayoutOptions = options => {
+  if (Object.keys(deprecatedLayoutOptions).find(key => typeof options[key] !== 'undefined')) {
+    return applyDeprecatedLayoutOptions(options);
   }
   return {};
 };
@@ -28,16 +62,21 @@ export default ({ provider, api, store }) => {
       const { layout, ui, selectedPanel } = store.getState();
 
       if (options) {
+        const updatedLayout = {
+          ...layout,
+          ...pick(options, Object.keys(layout)),
+          ...checkDeprecatedLayoutOptions(options),
+        };
+
+        const updatedUi = {
+          ...ui,
+          ...pick(options, Object.keys(ui)),
+          ...checkDeprecatedThemeOptions(options),
+        };
+
         store.setState({
-          layout: {
-            ...layout,
-            ...pick(options, Object.keys(layout)),
-          },
-          ui: {
-            ...ui,
-            ...pick(options, Object.keys(ui)),
-            ...checkDeprecatedUiOptions(options),
-          },
+          layout: updatedLayout,
+          ui: updatedUi,
           selectedPanel: options.panel || options.selectedPanel || selectedPanel,
         });
       }

From f0b6ce33cbcaae57433a8133ab691cbe9fdf3c45 Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Wed, 27 Feb 2019 22:19:12 +0800
Subject: [PATCH 093/249] Merge pull request #5776 from
 storybooks/5525-resolve-merge-conflicts

Fix Angular global style imports
---
 app/angular/src/server/angular-cli_config.js  |   2 +
 .../src/server/angular-cli_config.test.js     |  31 +
 examples/angular-cli/package.json             |   4 +-
 yarn.lock                                     | 742 +++++-------------
 4 files changed, 241 insertions(+), 538 deletions(-)
 create mode 100644 app/angular/src/server/angular-cli_config.test.js

diff --git a/app/angular/src/server/angular-cli_config.js b/app/angular/src/server/angular-cli_config.js
index c5b25b4710f..c51c982cdf5 100644
--- a/app/angular/src/server/angular-cli_config.js
+++ b/app/angular/src/server/angular-cli_config.js
@@ -71,6 +71,8 @@ export function getAngularCliWebpackConfigOptions(dirToSearch) {
     tsConfig,
     supportES2015: false,
     buildOptions: {
+      sourceMap: {},
+      optimization: {},
       ...projectOptions,
       assets: normalizedAssets,
     },
diff --git a/app/angular/src/server/angular-cli_config.test.js b/app/angular/src/server/angular-cli_config.test.js
new file mode 100644
index 00000000000..ba312df8179
--- /dev/null
+++ b/app/angular/src/server/angular-cli_config.test.js
@@ -0,0 +1,31 @@
+import { getAngularCliWebpackConfigOptions } from './angular-cli_config';
+import angularJson from '../../../../examples/angular-cli/angular.json';
+
+// eslint-disable-next-line global-require
+jest.mock('fs', () => require('../../../../__mocks__/fs'));
+jest.mock('path', () => ({
+  join: () => 'angular.json',
+  resolve: () => 'tsconfig.json',
+}));
+
+const setupFiles = files => {
+  // eslint-disable-next-line no-underscore-dangle, global-require
+  require('fs').__setMockFiles(files);
+};
+
+describe('angualr-cli_config', () => {
+  describe('getAngularCliWebpackConfigOptions()', () => {
+    it('should return have empty `buildOptions.sourceMap` and `buildOptions.optimization` by default', () => {
+      setupFiles({ 'angular.json': JSON.stringify(angularJson) });
+
+      const config = getAngularCliWebpackConfigOptions('/');
+
+      expect(config).toMatchObject({
+        buildOptions: {
+          sourceMap: {},
+          optimization: {},
+        },
+      });
+    });
+  });
+});
diff --git a/examples/angular-cli/package.json b/examples/angular-cli/package.json
index af2067ca76f..0f09000643e 100644
--- a/examples/angular-cli/package.json
+++ b/examples/angular-cli/package.json
@@ -30,8 +30,8 @@
     "zone.js": "^0.8.29"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "^0.11.4",
-    "@angular/cli": "^7.3.0",
+    "@angular-devkit/build-angular": "^0.13.1",
+    "@angular/cli": "^7.3.2",
     "@angular/compiler-cli": "^7.2.1",
     "@storybook/addon-actions": "5.0.0-rc.6",
     "@storybook/addon-backgrounds": "5.0.0-rc.6",
diff --git a/yarn.lock b/yarn.lock
index dffc9122a47..5693ba605a3 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2,103 +2,97 @@
 # yarn lockfile v1
 
 
-"@angular-devkit/architect@0.11.4":
-  version "0.11.4"
-  resolved "https://registry.yarnpkg.com/@angular-devkit/architect/-/architect-0.11.4.tgz#f0cc3b4f1dd0128f6b41d3bb760bcf4c324cd063"
+"@angular-devkit/architect@0.13.1":
+  version "0.13.1"
+  resolved "https://registry.yarnpkg.com/@angular-devkit/architect/-/architect-0.13.1.tgz#39597ce94f72d89bdd89ee567cb937cff4c13b98"
+  integrity sha512-QDmIbqde75ZZSEFbw6Q6kQWq4cY6C7D67yujXw6XTyubDNAs1tyXJyxTIB8vjSlEKwRizTTDd/B0ZXVcke3Mvw==
   dependencies:
-    "@angular-devkit/core" "7.1.4"
+    "@angular-devkit/core" "7.3.1"
     rxjs "6.3.3"
 
-"@angular-devkit/architect@0.13.0":
-  version "0.13.0"
-  resolved "https://registry.yarnpkg.com/@angular-devkit/architect/-/architect-0.13.0.tgz#47a9c76ca4c01c357a8670810f29a45e906447cd"
+"@angular-devkit/architect@0.13.3":
+  version "0.13.3"
+  resolved "https://registry.yarnpkg.com/@angular-devkit/architect/-/architect-0.13.3.tgz#28813279c546cdcb709ad55038bb2051736de668"
+  integrity sha512-89VL75bq3+h3m0jhzWNqXqW+HQcrihnM3i6eiUE6P81LcllP159JMlusAvB1LHLNc6Cc62wTq4BJr7KDILkPOA==
   dependencies:
-    "@angular-devkit/core" "7.3.0"
+    "@angular-devkit/core" "7.3.3"
     rxjs "6.3.3"
 
-"@angular-devkit/build-angular@^0.11.4":
-  version "0.11.4"
-  resolved "https://registry.yarnpkg.com/@angular-devkit/build-angular/-/build-angular-0.11.4.tgz#795084e29c66a71da15227cf2ac29794aa807c7c"
+"@angular-devkit/build-angular@^0.13.1":
+  version "0.13.1"
+  resolved "https://registry.yarnpkg.com/@angular-devkit/build-angular/-/build-angular-0.13.1.tgz#369febda48dd40e47a4f0077064e792612a8e1c1"
+  integrity sha512-vkKwMVQ+NNCcVR3HFMffS+Mq4b2afXeUjI+02N38hBuFTppnC83uivUB6Uu2NUk5NTSQA4BnJlG5CbMs6N4QYg==
   dependencies:
-    "@angular-devkit/architect" "0.11.4"
-    "@angular-devkit/build-optimizer" "0.11.4"
-    "@angular-devkit/build-webpack" "0.11.4"
-    "@angular-devkit/core" "7.1.4"
-    "@ngtools/webpack" "7.1.4"
-    ajv "6.5.3"
-    autoprefixer "9.3.1"
+    "@angular-devkit/architect" "0.13.1"
+    "@angular-devkit/build-optimizer" "0.13.1"
+    "@angular-devkit/build-webpack" "0.13.1"
+    "@angular-devkit/core" "7.3.1"
+    "@ngtools/webpack" "7.3.1"
+    ajv "6.7.0"
+    autoprefixer "9.4.6"
     circular-dependency-plugin "5.0.2"
     clean-css "4.2.1"
-    copy-webpack-plugin "4.5.4"
-    file-loader "2.0.0"
+    copy-webpack-plugin "4.6.0"
+    file-loader "3.0.1"
     glob "7.1.3"
-    istanbul "0.4.5"
     istanbul-instrumenter-loader "3.0.1"
     karma-source-map-support "1.3.0"
-    less "3.8.1"
+    less "3.9.0"
     less-loader "4.1.0"
-    license-webpack-plugin "2.0.2"
-    loader-utils "1.1.0"
-    mini-css-extract-plugin "0.4.4"
+    license-webpack-plugin "2.1.0"
+    loader-utils "1.2.3"
+    mini-css-extract-plugin "0.5.0"
     minimatch "3.0.4"
-    opn "5.3.0"
+    opn "5.4.0"
     parse5 "4.0.0"
-    portfinder "1.0.17"
-    postcss "7.0.5"
-    postcss-import "12.0.0"
+    postcss "7.0.14"
+    postcss-import "12.0.1"
     postcss-loader "3.0.0"
-    raw-loader "0.5.1"
+    raw-loader "1.0.0"
     rxjs "6.3.3"
     sass-loader "7.1.0"
-    semver "5.5.1"
+    semver "5.6.0"
     source-map-loader "0.2.4"
-    source-map-support "0.5.9"
-    speed-measure-webpack-plugin "1.2.3"
+    source-map-support "0.5.10"
+    speed-measure-webpack-plugin "1.3.0"
     stats-webpack-plugin "0.7.0"
     style-loader "0.23.1"
     stylus "0.54.5"
     stylus-loader "3.0.2"
-    terser-webpack-plugin "1.1.0"
-    tree-kill "1.2.0"
-    webpack "4.23.1"
-    webpack-dev-middleware "3.4.0"
-    webpack-dev-server "3.1.10"
-    webpack-merge "4.1.4"
+    terser-webpack-plugin "1.2.2"
+    tree-kill "1.2.1"
+    webpack "4.29.0"
+    webpack-dev-middleware "3.5.1"
+    webpack-dev-server "3.1.14"
+    webpack-merge "4.2.1"
     webpack-sources "1.3.0"
     webpack-subresource-integrity "1.1.0-rc.6"
   optionalDependencies:
-    node-sass "4.10.0"
+    node-sass "4.11.0"
 
-"@angular-devkit/build-optimizer@0.11.4":
-  version "0.11.4"
-  resolved "https://registry.yarnpkg.com/@angular-devkit/build-optimizer/-/build-optimizer-0.11.4.tgz#d96b0e16a76f3825f173220a2de5f376fc5abaee"
+"@angular-devkit/build-optimizer@0.13.1":
+  version "0.13.1"
+  resolved "https://registry.yarnpkg.com/@angular-devkit/build-optimizer/-/build-optimizer-0.13.1.tgz#56151179bd6427918ba8e0f5a7e581e5daa00294"
+  integrity sha512-LmvHiI3H451aVWY5Ac6Fqz0i1eX/mUfWN+uJvo8NaL6Jc0HKYX2o3l4ODr8UUECWWctUC9AMD522ZMwAvnvsKQ==
   dependencies:
-    loader-utils "1.1.0"
+    loader-utils "1.2.3"
     source-map "0.5.6"
-    typescript "3.1.6"
-    webpack-sources "1.2.0"
+    typescript "3.2.4"
+    webpack-sources "1.3.0"
 
-"@angular-devkit/build-webpack@0.11.4":
-  version "0.11.4"
-  resolved "https://registry.yarnpkg.com/@angular-devkit/build-webpack/-/build-webpack-0.11.4.tgz#1397b21b6187eab0641830ece4c3b9faba00855e"
+"@angular-devkit/build-webpack@0.13.1":
+  version "0.13.1"
+  resolved "https://registry.yarnpkg.com/@angular-devkit/build-webpack/-/build-webpack-0.13.1.tgz#98d666765705e9379c9b2e0a3b6dfcd0347a2a32"
+  integrity sha512-OGwC7bAl3u+w7Glw+OqIrN7OD1BkDXgrWbeQSpKAmsx6VdNPCnI4NPS+JldWNp70LVlE2nQlJUhtEqMVfBMnlg==
   dependencies:
-    "@angular-devkit/architect" "0.11.4"
-    "@angular-devkit/core" "7.1.4"
+    "@angular-devkit/architect" "0.13.1"
+    "@angular-devkit/core" "7.3.1"
     rxjs "6.3.3"
 
-"@angular-devkit/core@7.1.4":
-  version "7.1.4"
-  resolved "https://registry.yarnpkg.com/@angular-devkit/core/-/core-7.1.4.tgz#4d903fd2ecc259b716ae76da19695d03993e583c"
-  dependencies:
-    ajv "6.5.3"
-    chokidar "2.0.4"
-    fast-json-stable-stringify "2.0.0"
-    rxjs "6.3.3"
-    source-map "0.7.3"
-
-"@angular-devkit/core@7.3.0":
-  version "7.3.0"
-  resolved "https://registry.yarnpkg.com/@angular-devkit/core/-/core-7.3.0.tgz#fc272e39b4c307833e9a7db77007418a246f5410"
+"@angular-devkit/core@7.3.1":
+  version "7.3.1"
+  resolved "https://registry.yarnpkg.com/@angular-devkit/core/-/core-7.3.1.tgz#d92f6545796579cabdcfc29579a2c977f7a96c6c"
+  integrity sha512-56XDWWfIzOAkEk69lBLgmCYybPUA4yjunhmMlCk7vVdb7gbQUyzNjFD04Uj0GjlejatAQ5F76tRwygD9C+3RXQ==
   dependencies:
     ajv "6.7.0"
     chokidar "2.0.4"
@@ -106,22 +100,35 @@
     rxjs "6.3.3"
     source-map "0.7.3"
 
-"@angular-devkit/schematics@7.3.0":
-  version "7.3.0"
-  resolved "https://registry.yarnpkg.com/@angular-devkit/schematics/-/schematics-7.3.0.tgz#112c1f59ff2778157aff6fb7484a6c132d4156ac"
+"@angular-devkit/core@7.3.3":
+  version "7.3.3"
+  resolved "https://registry.yarnpkg.com/@angular-devkit/core/-/core-7.3.3.tgz#cd6d5a8eca25ef07b6394bc2b08133d90d08d39f"
+  integrity sha512-fosULDtMoDWrOyUzTmBkJccOy7zodo02kENyKai7vOv9EWfv9jytkVdNc+jl0ys9OE2QadvSYBo49jhnZxFXfQ==
   dependencies:
-    "@angular-devkit/core" "7.3.0"
+    ajv "6.9.1"
+    chokidar "2.0.4"
+    fast-json-stable-stringify "2.0.0"
+    rxjs "6.3.3"
+    source-map "0.7.3"
+
+"@angular-devkit/schematics@7.3.3":
+  version "7.3.3"
+  resolved "https://registry.yarnpkg.com/@angular-devkit/schematics/-/schematics-7.3.3.tgz#80e9dc3197a3181f32edfb5c07e7ac016eace7d3"
+  integrity sha512-SdDq9eKwceb6WLwci1fywtZ/kARR5CYyzi5dZIR1lOxrz00682uUBqH/X39mKdqc6eVqR7rtPceqNm6nQpOIMg==
+  dependencies:
+    "@angular-devkit/core" "7.3.3"
     rxjs "6.3.3"
 
-"@angular/cli@^7.3.0":
-  version "7.3.0"
-  resolved "https://registry.yarnpkg.com/@angular/cli/-/cli-7.3.0.tgz#8f9301aa7a942385258b35bf86806267073fce17"
+"@angular/cli@^7.3.2":
+  version "7.3.3"
+  resolved "https://registry.yarnpkg.com/@angular/cli/-/cli-7.3.3.tgz#b357000385aa6c75b001cb9fa7982ef3ce02c423"
+  integrity sha512-dw1iBOYbQRN2l/BH21zDItDFC9KXgqeK0A/koDLDukjrUAnW/XVATjxGi+7EPlTpABTFhqu/rHZDy8aBglLDXQ==
   dependencies:
-    "@angular-devkit/architect" "0.13.0"
-    "@angular-devkit/core" "7.3.0"
-    "@angular-devkit/schematics" "7.3.0"
-    "@schematics/angular" "7.3.0"
-    "@schematics/update" "0.13.0"
+    "@angular-devkit/architect" "0.13.3"
+    "@angular-devkit/core" "7.3.3"
+    "@angular-devkit/schematics" "7.3.3"
+    "@schematics/angular" "7.3.3"
+    "@schematics/update" "0.13.3"
     "@yarnpkg/lockfile" "1.1.0"
     ini "1.3.5"
     inquirer "6.2.1"
@@ -1840,15 +1847,16 @@
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@ngrx/store/-/store-7.2.0.tgz#b22200fd48b721afe0e5cc9eec92f3dc31c078b1"
 
-"@ngtools/webpack@7.1.4":
-  version "7.1.4"
-  resolved "https://registry.yarnpkg.com/@ngtools/webpack/-/webpack-7.1.4.tgz#632ece6ed8e05fe743554cc935be36a653376f01"
+"@ngtools/webpack@7.3.1":
+  version "7.3.1"
+  resolved "https://registry.yarnpkg.com/@ngtools/webpack/-/webpack-7.3.1.tgz#4ff68007fd68fdc26f22e19115182f96fb6f7335"
+  integrity sha512-EGQRjgDf5XP+Fm1MdZNRFiPd9e1vhl11BhjkwqkAsewic4eoz6fqXfj/Osz1hQy8xU+2dPPf/byQ/+nY3E02Zg==
   dependencies:
-    "@angular-devkit/core" "7.1.4"
+    "@angular-devkit/core" "7.3.1"
     enhanced-resolve "4.1.0"
     rxjs "6.3.3"
-    tree-kill "1.2.0"
-    webpack-sources "1.2.0"
+    tree-kill "1.2.1"
+    webpack-sources "1.3.0"
 
 "@nodelib/fs.stat@^1.1.2":
   version "1.1.3"
@@ -1917,20 +1925,22 @@
   dependencies:
     any-observable "^0.3.0"
 
-"@schematics/angular@7.3.0":
-  version "7.3.0"
-  resolved "https://registry.yarnpkg.com/@schematics/angular/-/angular-7.3.0.tgz#0ed0af8250f767ceb42a3f658888697d95381569"
+"@schematics/angular@7.3.3":
+  version "7.3.3"
+  resolved "https://registry.yarnpkg.com/@schematics/angular/-/angular-7.3.3.tgz#aaa63331365bf67b1b908cc18cfc5d7097ec8377"
+  integrity sha512-HbH8vajYPka0xGcFAN5IUBx8n8SFMQLFb9di2dJCOBaEakbKVkk8qtOpil54oFQbx7DFCvutq/p0u42JfEbuMQ==
   dependencies:
-    "@angular-devkit/core" "7.3.0"
-    "@angular-devkit/schematics" "7.3.0"
-    typescript "3.2.2"
+    "@angular-devkit/core" "7.3.3"
+    "@angular-devkit/schematics" "7.3.3"
+    typescript "3.2.4"
 
-"@schematics/update@0.13.0":
-  version "0.13.0"
-  resolved "https://registry.yarnpkg.com/@schematics/update/-/update-0.13.0.tgz#d8f7336da8d80d2fd9cecc3d0c97f31295fedb52"
+"@schematics/update@0.13.3":
+  version "0.13.3"
+  resolved "https://registry.yarnpkg.com/@schematics/update/-/update-0.13.3.tgz#7c325b1f723e538ed932b3e344a4a51ea123ffb7"
+  integrity sha512-sCOFQ62dd7VdEGiSUJNZshNI31ODwpJjn2WIvFgZLt6sdHHun67s/JOvOUq4mxx6I74oD6RPJPF4AP5sigVxxg==
   dependencies:
-    "@angular-devkit/core" "7.3.0"
-    "@angular-devkit/schematics" "7.3.0"
+    "@angular-devkit/core" "7.3.3"
+    "@angular-devkit/schematics" "7.3.3"
     "@yarnpkg/lockfile" "1.1.0"
     ini "1.3.5"
     pacote "9.4.0"
@@ -2169,6 +2179,11 @@
   version "5.5.0"
   resolved "https://registry.yarnpkg.com/@types/semver/-/semver-5.5.0.tgz#146c2a29ee7d3bae4bf2fcb274636e264c813c45"
 
+"@types/source-list-map@*":
+  version "0.1.2"
+  resolved "https://registry.yarnpkg.com/@types/source-list-map/-/source-list-map-0.1.2.tgz#0078836063ffaf17412349bba364087e0ac02ec9"
+  integrity sha512-K5K+yml8LTo9bWJI/rECfIPrGgxdpeNbj+d53lwN4QjW1MCwlkhUms+gtdzigTeUyBr09+u8BwOIY3MXvHdcsA==
+
 "@types/storybook__addon-actions@^3.4.1":
   version "3.4.1"
   resolved "https://registry.yarnpkg.com/@types/storybook__addon-actions/-/storybook__addon-actions-3.4.1.tgz#8f90d76b023b58ee794170f2fe774a3fddda2c1d"
@@ -2217,6 +2232,15 @@
   version "1.13.7"
   resolved "https://registry.yarnpkg.com/@types/webpack-env/-/webpack-env-1.13.7.tgz#137a4e57aa31ab57b1baf66f5dc3b6bf085e9944"
 
+"@types/webpack-sources@^0.1.5":
+  version "0.1.5"
+  resolved "https://registry.yarnpkg.com/@types/webpack-sources/-/webpack-sources-0.1.5.tgz#be47c10f783d3d6efe1471ff7f042611bd464a92"
+  integrity sha512-zfvjpp7jiafSmrzJ2/i3LqOyTYTuJ7u1KOXlKgDlvsj9Rr0x7ZiYu5lZbXwobL7lmsRNtPXlBfmaUD8eU2Hu8w==
+  dependencies:
+    "@types/node" "*"
+    "@types/source-list-map" "*"
+    source-map "^0.6.1"
+
 "@vue/component-compiler-utils@^2.5.1":
   version "2.5.1"
   resolved "https://registry.yarnpkg.com/@vue/component-compiler-utils/-/component-compiler-utils-2.5.1.tgz#bd9cf68d728324d7dcede80462c2c0e8fe090acb"
@@ -2231,14 +2255,6 @@
     source-map "^0.7.3"
     vue-template-es2015-compiler "^1.6.0"
 
-"@webassemblyjs/ast@1.7.10":
-  version "1.7.10"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/ast/-/ast-1.7.10.tgz#0cfc61d61286240b72fc522cb755613699eea40a"
-  dependencies:
-    "@webassemblyjs/helper-module-context" "1.7.10"
-    "@webassemblyjs/helper-wasm-bytecode" "1.7.10"
-    "@webassemblyjs/wast-parser" "1.7.10"
-
 "@webassemblyjs/ast@1.7.11":
   version "1.7.11"
   resolved "https://registry.yarnpkg.com/@webassemblyjs/ast/-/ast-1.7.11.tgz#b988582cafbb2b095e8b556526f30c90d057cace"
@@ -2256,10 +2272,6 @@
     "@webassemblyjs/wast-parser" "1.7.6"
     mamacro "^0.0.3"
 
-"@webassemblyjs/floating-point-hex-parser@1.7.10":
-  version "1.7.10"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/floating-point-hex-parser/-/floating-point-hex-parser-1.7.10.tgz#ee63d729c6311a85863e369a473f9983f984e4d9"
-
 "@webassemblyjs/floating-point-hex-parser@1.7.11":
   version "1.7.11"
   resolved "https://registry.yarnpkg.com/@webassemblyjs/floating-point-hex-parser/-/floating-point-hex-parser-1.7.11.tgz#a69f0af6502eb9a3c045555b1a6129d3d3f2e313"
@@ -2268,10 +2280,6 @@
   version "1.7.6"
   resolved "https://registry.yarnpkg.com/@webassemblyjs/floating-point-hex-parser/-/floating-point-hex-parser-1.7.6.tgz#7cb37d51a05c3fe09b464ae7e711d1ab3837801f"
 
-"@webassemblyjs/helper-api-error@1.7.10":
-  version "1.7.10"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-api-error/-/helper-api-error-1.7.10.tgz#bfcb3bbe59775357475790a2ad7b289f09b2f198"
-
 "@webassemblyjs/helper-api-error@1.7.11":
   version "1.7.11"
   resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-api-error/-/helper-api-error-1.7.11.tgz#c7b6bb8105f84039511a2b39ce494f193818a32a"
@@ -2280,10 +2288,6 @@
   version "1.7.6"
   resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-api-error/-/helper-api-error-1.7.6.tgz#99b7e30e66f550a2638299a109dda84a622070ef"
 
-"@webassemblyjs/helper-buffer@1.7.10":
-  version "1.7.10"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-buffer/-/helper-buffer-1.7.10.tgz#0a8c624c67ad0b214d2e003859921a1988cb151b"
-
 "@webassemblyjs/helper-buffer@1.7.11":
   version "1.7.11"
   resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-buffer/-/helper-buffer-1.7.11.tgz#3122d48dcc6c9456ed982debe16c8f37101df39b"
@@ -2292,12 +2296,6 @@
   version "1.7.6"
   resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-buffer/-/helper-buffer-1.7.6.tgz#ba0648be12bbe560c25c997e175c2018df39ca3e"
 
-"@webassemblyjs/helper-code-frame@1.7.10":
-  version "1.7.10"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-code-frame/-/helper-code-frame-1.7.10.tgz#0ab7e22fad0241a173178c73976fc0edf50832ce"
-  dependencies:
-    "@webassemblyjs/wast-printer" "1.7.10"
-
 "@webassemblyjs/helper-code-frame@1.7.11":
   version "1.7.11"
   resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-code-frame/-/helper-code-frame-1.7.11.tgz#cf8f106e746662a0da29bdef635fcd3d1248364b"
@@ -2310,10 +2308,6 @@
   dependencies:
     "@webassemblyjs/wast-printer" "1.7.6"
 
-"@webassemblyjs/helper-fsm@1.7.10":
-  version "1.7.10"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-fsm/-/helper-fsm-1.7.10.tgz#0915e7713fbbb735620a9d3e4fa3d7951f97ac64"
-
 "@webassemblyjs/helper-fsm@1.7.11":
   version "1.7.11"
   resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-fsm/-/helper-fsm-1.7.11.tgz#df38882a624080d03f7503f93e3f17ac5ac01181"
@@ -2322,10 +2316,6 @@
   version "1.7.6"
   resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-fsm/-/helper-fsm-1.7.6.tgz#ae1741c6f6121213c7a0b587fb964fac492d3e49"
 
-"@webassemblyjs/helper-module-context@1.7.10":
-  version "1.7.10"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-module-context/-/helper-module-context-1.7.10.tgz#9beb83f72740f5ac8075313b5cac5e796510f755"
-
 "@webassemblyjs/helper-module-context@1.7.11":
   version "1.7.11"
   resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-module-context/-/helper-module-context-1.7.11.tgz#d874d722e51e62ac202476935d649c802fa0e209"
@@ -2336,10 +2326,6 @@
   dependencies:
     mamacro "^0.0.3"
 
-"@webassemblyjs/helper-wasm-bytecode@1.7.10":
-  version "1.7.10"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-wasm-bytecode/-/helper-wasm-bytecode-1.7.10.tgz#797b1e734bbcfdea8399669cdc58308ef1c7ffc0"
-
 "@webassemblyjs/helper-wasm-bytecode@1.7.11":
   version "1.7.11"
   resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-wasm-bytecode/-/helper-wasm-bytecode-1.7.11.tgz#dd9a1e817f1c2eb105b4cf1013093cb9f3c9cb06"
@@ -2348,15 +2334,6 @@
   version "1.7.6"
   resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-wasm-bytecode/-/helper-wasm-bytecode-1.7.6.tgz#98e515eaee611aa6834eb5f6a7f8f5b29fefb6f1"
 
-"@webassemblyjs/helper-wasm-section@1.7.10":
-  version "1.7.10"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-wasm-section/-/helper-wasm-section-1.7.10.tgz#c0ea3703c615d7bc3e3507c3b7991c8767b2f20e"
-  dependencies:
-    "@webassemblyjs/ast" "1.7.10"
-    "@webassemblyjs/helper-buffer" "1.7.10"
-    "@webassemblyjs/helper-wasm-bytecode" "1.7.10"
-    "@webassemblyjs/wasm-gen" "1.7.10"
-
 "@webassemblyjs/helper-wasm-section@1.7.11":
   version "1.7.11"
   resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-wasm-section/-/helper-wasm-section-1.7.11.tgz#9c9ac41ecf9fbcfffc96f6d2675e2de33811e68a"
@@ -2375,12 +2352,6 @@
     "@webassemblyjs/helper-wasm-bytecode" "1.7.6"
     "@webassemblyjs/wasm-gen" "1.7.6"
 
-"@webassemblyjs/ieee754@1.7.10":
-  version "1.7.10"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/ieee754/-/ieee754-1.7.10.tgz#62c1728b7ef0f66ef8221e2966a0afd75db430df"
-  dependencies:
-    "@xtuc/ieee754" "^1.2.0"
-
 "@webassemblyjs/ieee754@1.7.11":
   version "1.7.11"
   resolved "https://registry.yarnpkg.com/@webassemblyjs/ieee754/-/ieee754-1.7.11.tgz#c95839eb63757a31880aaec7b6512d4191ac640b"
@@ -2393,12 +2364,6 @@
   dependencies:
     "@xtuc/ieee754" "^1.2.0"
 
-"@webassemblyjs/leb128@1.7.10":
-  version "1.7.10"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/leb128/-/leb128-1.7.10.tgz#167e0bb4b06d7701585772a73fba9f4df85439f6"
-  dependencies:
-    "@xtuc/long" "4.2.1"
-
 "@webassemblyjs/leb128@1.7.11":
   version "1.7.11"
   resolved "https://registry.yarnpkg.com/@webassemblyjs/leb128/-/leb128-1.7.11.tgz#d7267a1ee9c4594fd3f7e37298818ec65687db63"
@@ -2411,10 +2376,6 @@
   dependencies:
     "@xtuc/long" "4.2.1"
 
-"@webassemblyjs/utf8@1.7.10":
-  version "1.7.10"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/utf8/-/utf8-1.7.10.tgz#b6728f5b6f50364abc155be029f9670e6685605a"
-
 "@webassemblyjs/utf8@1.7.11":
   version "1.7.11"
   resolved "https://registry.yarnpkg.com/@webassemblyjs/utf8/-/utf8-1.7.11.tgz#06d7218ea9fdc94a6793aa92208160db3d26ee82"
@@ -2423,19 +2384,6 @@
   version "1.7.6"
   resolved "https://registry.yarnpkg.com/@webassemblyjs/utf8/-/utf8-1.7.6.tgz#eb62c66f906af2be70de0302e29055d25188797d"
 
-"@webassemblyjs/wasm-edit@1.7.10":
-  version "1.7.10"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/wasm-edit/-/wasm-edit-1.7.10.tgz#83fe3140f5a58f5a30b914702be9f0e59a399092"
-  dependencies:
-    "@webassemblyjs/ast" "1.7.10"
-    "@webassemblyjs/helper-buffer" "1.7.10"
-    "@webassemblyjs/helper-wasm-bytecode" "1.7.10"
-    "@webassemblyjs/helper-wasm-section" "1.7.10"
-    "@webassemblyjs/wasm-gen" "1.7.10"
-    "@webassemblyjs/wasm-opt" "1.7.10"
-    "@webassemblyjs/wasm-parser" "1.7.10"
-    "@webassemblyjs/wast-printer" "1.7.10"
-
 "@webassemblyjs/wasm-edit@1.7.11":
   version "1.7.11"
   resolved "https://registry.yarnpkg.com/@webassemblyjs/wasm-edit/-/wasm-edit-1.7.11.tgz#8c74ca474d4f951d01dbae9bd70814ee22a82005"
@@ -2462,16 +2410,6 @@
     "@webassemblyjs/wasm-parser" "1.7.6"
     "@webassemblyjs/wast-printer" "1.7.6"
 
-"@webassemblyjs/wasm-gen@1.7.10":
-  version "1.7.10"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/wasm-gen/-/wasm-gen-1.7.10.tgz#4de003806ae29c97ab3707782469b53299570174"
-  dependencies:
-    "@webassemblyjs/ast" "1.7.10"
-    "@webassemblyjs/helper-wasm-bytecode" "1.7.10"
-    "@webassemblyjs/ieee754" "1.7.10"
-    "@webassemblyjs/leb128" "1.7.10"
-    "@webassemblyjs/utf8" "1.7.10"
-
 "@webassemblyjs/wasm-gen@1.7.11":
   version "1.7.11"
   resolved "https://registry.yarnpkg.com/@webassemblyjs/wasm-gen/-/wasm-gen-1.7.11.tgz#9bbba942f22375686a6fb759afcd7ac9c45da1a8"
@@ -2492,15 +2430,6 @@
     "@webassemblyjs/leb128" "1.7.6"
     "@webassemblyjs/utf8" "1.7.6"
 
-"@webassemblyjs/wasm-opt@1.7.10":
-  version "1.7.10"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/wasm-opt/-/wasm-opt-1.7.10.tgz#d151e31611934a556c82789fdeec41a814993c2a"
-  dependencies:
-    "@webassemblyjs/ast" "1.7.10"
-    "@webassemblyjs/helper-buffer" "1.7.10"
-    "@webassemblyjs/wasm-gen" "1.7.10"
-    "@webassemblyjs/wasm-parser" "1.7.10"
-
 "@webassemblyjs/wasm-opt@1.7.11":
   version "1.7.11"
   resolved "https://registry.yarnpkg.com/@webassemblyjs/wasm-opt/-/wasm-opt-1.7.11.tgz#b331e8e7cef8f8e2f007d42c3a36a0580a7d6ca7"
@@ -2519,17 +2448,6 @@
     "@webassemblyjs/wasm-gen" "1.7.6"
     "@webassemblyjs/wasm-parser" "1.7.6"
 
-"@webassemblyjs/wasm-parser@1.7.10":
-  version "1.7.10"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/wasm-parser/-/wasm-parser-1.7.10.tgz#0367be7bf8f09e3e6abc95f8e483b9206487ec65"
-  dependencies:
-    "@webassemblyjs/ast" "1.7.10"
-    "@webassemblyjs/helper-api-error" "1.7.10"
-    "@webassemblyjs/helper-wasm-bytecode" "1.7.10"
-    "@webassemblyjs/ieee754" "1.7.10"
-    "@webassemblyjs/leb128" "1.7.10"
-    "@webassemblyjs/utf8" "1.7.10"
-
 "@webassemblyjs/wasm-parser@1.7.11":
   version "1.7.11"
   resolved "https://registry.yarnpkg.com/@webassemblyjs/wasm-parser/-/wasm-parser-1.7.11.tgz#6e3d20fa6a3519f6b084ef9391ad58211efb0a1a"
@@ -2552,17 +2470,6 @@
     "@webassemblyjs/leb128" "1.7.6"
     "@webassemblyjs/utf8" "1.7.6"
 
-"@webassemblyjs/wast-parser@1.7.10":
-  version "1.7.10"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/wast-parser/-/wast-parser-1.7.10.tgz#058f598b52f730b23fc874d4775b6286b6247264"
-  dependencies:
-    "@webassemblyjs/ast" "1.7.10"
-    "@webassemblyjs/floating-point-hex-parser" "1.7.10"
-    "@webassemblyjs/helper-api-error" "1.7.10"
-    "@webassemblyjs/helper-code-frame" "1.7.10"
-    "@webassemblyjs/helper-fsm" "1.7.10"
-    "@xtuc/long" "4.2.1"
-
 "@webassemblyjs/wast-parser@1.7.11":
   version "1.7.11"
   resolved "https://registry.yarnpkg.com/@webassemblyjs/wast-parser/-/wast-parser-1.7.11.tgz#25bd117562ca8c002720ff8116ef9072d9ca869c"
@@ -2586,14 +2493,6 @@
     "@xtuc/long" "4.2.1"
     mamacro "^0.0.3"
 
-"@webassemblyjs/wast-printer@1.7.10":
-  version "1.7.10"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/wast-printer/-/wast-printer-1.7.10.tgz#d817909d2450ae96c66b7607624d98a33b84223b"
-  dependencies:
-    "@webassemblyjs/ast" "1.7.10"
-    "@webassemblyjs/wast-parser" "1.7.10"
-    "@xtuc/long" "4.2.1"
-
 "@webassemblyjs/wast-printer@1.7.11":
   version "1.7.11"
   resolved "https://registry.yarnpkg.com/@webassemblyjs/wast-printer/-/wast-printer-1.7.11.tgz#c4245b6de242cb50a2cc950174fdbf65c78d7813"
@@ -2652,10 +2551,6 @@ abbrev@1:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/abbrev/-/abbrev-1.1.1.tgz#f8f2c887ad10bf67f634f005b6987fed3179aac8"
 
-abbrev@1.0.x:
-  version "1.0.9"
-  resolved "https://registry.yarnpkg.com/abbrev/-/abbrev-1.0.9.tgz#91b4792588a7738c25f35dd6f63752a2f8776135"
-
 absolute-path@^0.0.0:
   version "0.0.0"
   resolved "https://registry.yarnpkg.com/absolute-path/-/absolute-path-0.0.0.tgz#a78762fbdadfb5297be99b15d35a785b2f095bf7"
@@ -2780,18 +2675,19 @@ ajv-keywords@^3.0.0, ajv-keywords@^3.1.0:
   version "3.2.0"
   resolved "https://registry.yarnpkg.com/ajv-keywords/-/ajv-keywords-3.2.0.tgz#e86b819c602cf8821ad637413698f1dec021847a"
 
-ajv@6.5.3:
-  version "6.5.3"
-  resolved "https://registry.yarnpkg.com/ajv/-/ajv-6.5.3.tgz#71a569d189ecf4f4f321224fecb166f071dd90f9"
+ajv@6.7.0, ajv@^6.0.1, ajv@^6.1.0, ajv@^6.5.3, ajv@^6.5.5, ajv@^6.6.1:
+  version "6.7.0"
+  resolved "https://registry.yarnpkg.com/ajv/-/ajv-6.7.0.tgz#e3ce7bb372d6577bb1839f1dfdfcbf5ad2948d96"
   dependencies:
     fast-deep-equal "^2.0.1"
     fast-json-stable-stringify "^2.0.0"
     json-schema-traverse "^0.4.1"
     uri-js "^4.2.2"
 
-ajv@6.7.0, ajv@^6.0.1, ajv@^6.1.0, ajv@^6.5.3, ajv@^6.5.5, ajv@^6.6.1:
-  version "6.7.0"
-  resolved "https://registry.yarnpkg.com/ajv/-/ajv-6.7.0.tgz#e3ce7bb372d6577bb1839f1dfdfcbf5ad2948d96"
+ajv@6.9.1:
+  version "6.9.1"
+  resolved "https://registry.yarnpkg.com/ajv/-/ajv-6.9.1.tgz#a4d3683d74abc5670e75f0b16520f70a20ea8dc1"
+  integrity sha512-XDN92U311aINL77ieWHmqCcNlwjoP5cHXDxIxbf2MaPYuCXOHS7gHH8jktxeK5omgd52XbSTX6a4Piwd1pQmzA==
   dependencies:
     fast-deep-equal "^2.0.1"
     fast-json-stable-stringify "^2.0.0"
@@ -3242,21 +3138,15 @@ async-writer@^1.1.0:
   dependencies:
     events "^1.0.2"
 
-async@1.x, async@^1.5.2:
-  version "1.5.2"
-  resolved "https://registry.yarnpkg.com/async/-/async-1.5.2.tgz#ec6a61ae56480c0c3cb241c95618e20892f9672a"
-
 async@^0.9.0, async@^0.9.2:
   version "0.9.2"
   resolved "https://registry.yarnpkg.com/async/-/async-0.9.2.tgz#aea74d5e61c1f899613bf64bda66d4c78f2fd17d"
 
-async@^2.1.4, async@^2.4.1, async@^2.5.0, async@^2.6.0:
-  version "2.6.1"
-  resolved "https://registry.yarnpkg.com/async/-/async-2.6.1.tgz#b245a23ca71930044ec53fa46aa00a3e87c6a610"
-  dependencies:
-    lodash "^4.17.10"
+async@^1.5.2:
+  version "1.5.2"
+  resolved "https://registry.yarnpkg.com/async/-/async-1.5.2.tgz#ec6a61ae56480c0c3cb241c95618e20892f9672a"
 
-async@^2.4.0:
+async@^2.1.4, async@^2.4.0, async@^2.4.1, async@^2.5.0, async@^2.6.0:
   version "2.6.2"
   resolved "https://registry.yarnpkg.com/async/-/async-2.6.2.tgz#18330ea7e6e313887f5d2f2a904bac6fe4dd5381"
   integrity sha512-H1qVYh1MYhEEFLsP97cVKqCGo7KfCyTt6uEWqsTBr9SO84oK9Uwbyd/yCW+6rKJLHksBNUVWZDAjfS+Ccx0Bbg==
@@ -3275,15 +3165,16 @@ atob@^2.1.1:
   version "2.1.2"
   resolved "https://registry.yarnpkg.com/atob/-/atob-2.1.2.tgz#6d9517eb9e030d2436666651e86bd9f6f13533c9"
 
-autoprefixer@9.3.1:
-  version "9.3.1"
-  resolved "https://registry.yarnpkg.com/autoprefixer/-/autoprefixer-9.3.1.tgz#71b622174de2b783d5fd99f9ad617b7a3c78443e"
+autoprefixer@9.4.6:
+  version "9.4.6"
+  resolved "https://registry.yarnpkg.com/autoprefixer/-/autoprefixer-9.4.6.tgz#0ace275e33b37de16b09a5547dbfe73a98c1d446"
+  integrity sha512-Yp51mevbOEdxDUy5WjiKtpQaecqYq9OqZSL04rSoCiry7Tc5I9FEyo3bfxiTJc1DfHeKwSFCUYbBAiOQ2VGfiw==
   dependencies:
-    browserslist "^4.3.3"
-    caniuse-lite "^1.0.30000898"
+    browserslist "^4.4.1"
+    caniuse-lite "^1.0.30000929"
     normalize-range "^0.1.2"
     num2fraction "^1.2.2"
-    postcss "^7.0.5"
+    postcss "^7.0.13"
     postcss-value-parser "^3.3.1"
 
 autoprefixer@^9.3.1, autoprefixer@^9.4.7:
@@ -5361,7 +5252,7 @@ browserslist@^3.2.6:
     caniuse-lite "^1.0.30000844"
     electron-to-chromium "^1.3.47"
 
-browserslist@^4.0.0, browserslist@^4.1.0, browserslist@^4.3.3, browserslist@^4.3.4, browserslist@^4.4.1:
+browserslist@^4.0.0, browserslist@^4.1.0, browserslist@^4.3.4, browserslist@^4.4.1:
   version "4.4.1"
   resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.4.1.tgz#42e828954b6b29a7a53e352277be429478a69062"
   dependencies:
@@ -5635,7 +5526,12 @@ caniuse-api@^3.0.0:
     lodash.memoize "^4.1.2"
     lodash.uniq "^4.5.0"
 
-caniuse-lite@^1.0.0, caniuse-lite@^1.0.30000844, caniuse-lite@^1.0.30000884, caniuse-lite@^1.0.30000898, caniuse-lite@^1.0.30000905, caniuse-lite@^1.0.30000929, caniuse-lite@^1.0.30000932:
+caniuse-lite@^1.0.0, caniuse-lite@^1.0.30000844, caniuse-lite@^1.0.30000929, caniuse-lite@^1.0.30000932:
+  version "1.0.30000936"
+  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30000936.tgz#5d33b118763988bf721b9b8ad436d0400e4a116b"
+  integrity sha512-orX4IdpbFhdNO7bTBhSbahp1EBpqzBc+qrvTRVUFfZgA4zta7TdM6PN5ZxkEUgDnz36m+PfWGcdX7AVfFWItJw==
+
+caniuse-lite@^1.0.30000884, caniuse-lite@^1.0.30000905:
   version "1.0.30000932"
   resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30000932.tgz#d01763e9ce77810962ca7391ff827b5949ce4272"
 
@@ -6536,20 +6432,7 @@ copy-to-clipboard@^3.0.8:
   dependencies:
     toggle-selection "^1.0.3"
 
-copy-webpack-plugin@4.5.4:
-  version "4.5.4"
-  resolved "https://registry.yarnpkg.com/copy-webpack-plugin/-/copy-webpack-plugin-4.5.4.tgz#f2b2782b3cd5225535c3dc166a80067e7d940f27"
-  dependencies:
-    cacache "^10.0.4"
-    find-cache-dir "^1.0.0"
-    globby "^7.1.1"
-    is-glob "^4.0.0"
-    loader-utils "^1.1.0"
-    minimatch "^3.0.4"
-    p-limit "^1.0.0"
-    serialize-javascript "^1.4.0"
-
-copy-webpack-plugin@^4.6.0:
+copy-webpack-plugin@4.6.0, copy-webpack-plugin@^4.6.0:
   version "4.6.0"
   resolved "https://registry.yarnpkg.com/copy-webpack-plugin/-/copy-webpack-plugin-4.6.0.tgz#e7f40dd8a68477d405dd1b7a854aae324b158bae"
   dependencies:
@@ -7353,7 +7236,7 @@ detect-newline@^2.1.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/detect-newline/-/detect-newline-2.1.0.tgz#f41f1c10be4b00e87b5f13da680759f2c5bfd3e2"
 
-detect-node@^2.0.3, detect-node@^2.0.4:
+detect-node@^2.0.4:
   version "2.0.4"
   resolved "https://registry.yarnpkg.com/detect-node/-/detect-node-2.0.4.tgz#014ee8f8f669c5c58023da64b8179c083a28c46c"
 
@@ -8301,17 +8184,6 @@ escape-string-regexp@1.0.5, escape-string-regexp@^1.0.2, escape-string-regexp@^1
   version "1.0.5"
   resolved "https://registry.yarnpkg.com/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz#1b61c0562190a8dff6ae3bb2cf0200ca130b86d4"
 
-escodegen@1.8.x:
-  version "1.8.1"
-  resolved "https://registry.yarnpkg.com/escodegen/-/escodegen-1.8.1.tgz#5a5b53af4693110bebb0867aa3430dd3b70a1018"
-  dependencies:
-    esprima "^2.7.1"
-    estraverse "^1.9.1"
-    esutils "^2.0.2"
-    optionator "^0.8.1"
-  optionalDependencies:
-    source-map "~0.2.0"
-
 escodegen@^1.10.0, escodegen@^1.11.0, escodegen@^1.8.1, escodegen@^1.9.1:
   version "1.11.0"
   resolved "https://registry.yarnpkg.com/escodegen/-/escodegen-1.11.0.tgz#b27a9389481d5bfd5bec76f7bb1eb3f8f4556589"
@@ -8637,10 +8509,6 @@ espree@^5.0.0:
     acorn-jsx "^5.0.0"
     eslint-visitor-keys "^1.0.0"
 
-esprima@2.7.x, esprima@^2.7.1:
-  version "2.7.3"
-  resolved "https://registry.yarnpkg.com/esprima/-/esprima-2.7.3.tgz#96e3b70d5779f6ad49cd032673d1c312767ba581"
-
 esprima@^3.1.3, esprima@~3.1.0:
   version "3.1.3"
   resolved "https://registry.yarnpkg.com/esprima/-/esprima-3.1.3.tgz#fdca51cee6133895e3c88d535ce49dbff62a4633"
@@ -8665,10 +8533,6 @@ esrecurse@^4.1.0:
   dependencies:
     estraverse "^4.1.0"
 
-estraverse@^1.9.1:
-  version "1.9.3"
-  resolved "https://registry.yarnpkg.com/estraverse/-/estraverse-1.9.3.tgz#af67f2dc922582415950926091a4005d29c9bb44"
-
 estraverse@^4.0.0, estraverse@^4.1.0, estraverse@^4.1.1, estraverse@^4.2.0:
   version "4.2.0"
   resolved "https://registry.yarnpkg.com/estraverse/-/estraverse-4.2.0.tgz#0dee3fed31fcd469618ce7342099fc1afa0bdb13"
@@ -9198,7 +9062,7 @@ file-loader@2.0.0:
     loader-utils "^1.0.2"
     schema-utils "^1.0.0"
 
-file-loader@^3.0.1:
+file-loader@3.0.1, file-loader@^3.0.1:
   version "3.0.1"
   resolved "https://registry.yarnpkg.com/file-loader/-/file-loader-3.0.1.tgz#f8e0ba0b599918b51adfe45d66d1e771ad560faa"
   dependencies:
@@ -9924,7 +9788,7 @@ glob@7.1.3, glob@^7.0.0, glob@^7.0.3, glob@^7.0.4, glob@^7.0.6, glob@^7.1.0, glo
     once "^1.3.0"
     path-is-absolute "^1.0.0"
 
-glob@^5.0.10, glob@^5.0.15:
+glob@^5.0.10:
   version "5.0.15"
   resolved "https://registry.yarnpkg.com/glob/-/glob-5.0.15.tgz#1bc936b9e02f4a603fcc222ecf7633d30b8b93b1"
   dependencies:
@@ -10195,15 +10059,11 @@ h2x-types@^1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/h2x-types/-/h2x-types-1.1.0.tgz#ec0d5e3674e2207269f32976ac9c82aaff4818e6"
 
-handle-thing@^1.2.5:
-  version "1.2.5"
-  resolved "https://registry.yarnpkg.com/handle-thing/-/handle-thing-1.2.5.tgz#fd7aad726bf1a5fd16dfc29b2f7a6601d27139c4"
-
 handle-thing@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/handle-thing/-/handle-thing-2.0.0.tgz#0e039695ff50c93fc288557d696f3c1dc6776754"
 
-handlebars@^4.0.1, handlebars@^4.0.11, handlebars@^4.0.2, handlebars@^4.0.3, handlebars@^4.0.4:
+handlebars@^4.0.11, handlebars@^4.0.2, handlebars@^4.0.3, handlebars@^4.0.4:
   version "4.1.0"
   resolved "https://registry.yarnpkg.com/handlebars/-/handlebars-4.1.0.tgz#0d6a6f34ff1f63cecec8423aa4169827bf787c3a"
   dependencies:
@@ -11608,25 +11468,6 @@ istanbul-reports@^1.5.1:
   dependencies:
     handlebars "^4.0.3"
 
-istanbul@0.4.5:
-  version "0.4.5"
-  resolved "https://registry.yarnpkg.com/istanbul/-/istanbul-0.4.5.tgz#65c7d73d4c4da84d4f3ac310b918fb0b8033733b"
-  dependencies:
-    abbrev "1.0.x"
-    async "1.x"
-    escodegen "1.8.x"
-    esprima "2.7.x"
-    glob "^5.0.15"
-    handlebars "^4.0.1"
-    js-yaml "3.x"
-    mkdirp "0.5.x"
-    nopt "3.x"
-    once "1.x"
-    resolve "1.1.x"
-    supports-color "^3.1.0"
-    which "^1.1.1"
-    wordwrap "^1.0.0"
-
 istextorbinary@2.1.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/istextorbinary/-/istextorbinary-2.1.0.tgz#dbed2a6f51be2f7475b68f89465811141b758874"
@@ -12311,7 +12152,7 @@ js-tokens@^3.0.2:
   version "3.0.2"
   resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-3.0.2.tgz#9866df395102130e38f7f996bceb65443209c25b"
 
-js-yaml@3.x, js-yaml@^3.10.0, js-yaml@^3.12.0, js-yaml@^3.2.5, js-yaml@^3.2.7, js-yaml@^3.6.1, js-yaml@^3.7.0, js-yaml@^3.9.0:
+js-yaml@^3.10.0, js-yaml@^3.12.0, js-yaml@^3.2.5, js-yaml@^3.2.7, js-yaml@^3.6.1, js-yaml@^3.7.0, js-yaml@^3.9.0:
   version "3.12.1"
   resolved "https://registry.yarnpkg.com/js-yaml/-/js-yaml-3.12.1.tgz#295c8632a18a23e054cf5c9d3cecafe678167600"
   dependencies:
@@ -12836,22 +12677,7 @@ less-loader@4.1.0:
     loader-utils "^1.1.0"
     pify "^3.0.0"
 
-less@3.8.1:
-  version "3.8.1"
-  resolved "https://registry.yarnpkg.com/less/-/less-3.8.1.tgz#f31758598ef5a1930dd4caefa9e4340641e71e1d"
-  dependencies:
-    clone "^2.1.2"
-  optionalDependencies:
-    errno "^0.1.1"
-    graceful-fs "^4.1.2"
-    image-size "~0.5.0"
-    mime "^1.4.1"
-    mkdirp "^0.5.0"
-    promise "^7.1.1"
-    request "^2.83.0"
-    source-map "~0.6.0"
-
-less@^3.0.4:
+less@3.9.0, less@^3.0.4:
   version "3.9.0"
   resolved "https://registry.yarnpkg.com/less/-/less-3.9.0.tgz#b7511c43f37cf57dc87dffd9883ec121289b1474"
   dependencies:
@@ -12968,10 +12794,12 @@ libnpmteam@^1.0.1:
     get-stream "^4.0.0"
     npm-registry-fetch "^3.8.0"
 
-license-webpack-plugin@2.0.2:
-  version "2.0.2"
-  resolved "https://registry.yarnpkg.com/license-webpack-plugin/-/license-webpack-plugin-2.0.2.tgz#9d34b521cb7fca8527945310b05be6ef0248b687"
+license-webpack-plugin@2.1.0:
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/license-webpack-plugin/-/license-webpack-plugin-2.1.0.tgz#83acaa6e89c3c5316effdd80cb4ec9c5cd8efc2f"
+  integrity sha512-vDiBeMWxjE9n6TabQ9J4FH8urFdsRK0Nvxn1cit9biCiR9aq1zBR0X2BlAkEiIG6qPamLeU0GzvIgLkrFc398A==
   dependencies:
+    "@types/webpack-sources" "^0.1.5"
     webpack-sources "^1.2.0"
 
 lie@~3.1.0:
@@ -13126,6 +12954,14 @@ loader-utils@1.1.0:
     emojis-list "^2.0.0"
     json5 "^0.5.0"
 
+loader-utils@1.2.3, loader-utils@^1.0.1, loader-utils@^1.0.2, loader-utils@^1.0.3, loader-utils@^1.1.0, loader-utils@^1.2.1:
+  version "1.2.3"
+  resolved "https://registry.yarnpkg.com/loader-utils/-/loader-utils-1.2.3.tgz#1ff5dc6911c9f0a062531a4c04b609406108c2c7"
+  dependencies:
+    big.js "^5.2.2"
+    emojis-list "^2.0.0"
+    json5 "^1.0.1"
+
 loader-utils@^0.2.15:
   version "0.2.17"
   resolved "https://registry.yarnpkg.com/loader-utils/-/loader-utils-0.2.17.tgz#f86e6374d43205a6e6c60e9196f17c0299bfb348"
@@ -13135,14 +12971,6 @@ loader-utils@^0.2.15:
     json5 "^0.5.0"
     object-assign "^4.0.1"
 
-loader-utils@^1.0.1, loader-utils@^1.0.2, loader-utils@^1.0.3, loader-utils@^1.1.0, loader-utils@^1.2.1:
-  version "1.2.3"
-  resolved "https://registry.yarnpkg.com/loader-utils/-/loader-utils-1.2.3.tgz#1ff5dc6911c9f0a062531a4c04b609406108c2c7"
-  dependencies:
-    big.js "^5.2.2"
-    emojis-list "^2.0.0"
-    json5 "^1.0.1"
-
 loader.js@^4.2.3:
   version "4.7.0"
   resolved "https://registry.yarnpkg.com/loader.js/-/loader.js-4.7.0.tgz#a1a52902001c83631efde9688b8ab3799325ef1f"
@@ -14325,15 +14153,7 @@ mini-css-extract-plugin@0.4.3:
     schema-utils "^1.0.0"
     webpack-sources "^1.1.0"
 
-mini-css-extract-plugin@0.4.4:
-  version "0.4.4"
-  resolved "https://registry.yarnpkg.com/mini-css-extract-plugin/-/mini-css-extract-plugin-0.4.4.tgz#c10410a004951bd3cedac1da69053940fccb625d"
-  dependencies:
-    loader-utils "^1.1.0"
-    schema-utils "^1.0.0"
-    webpack-sources "^1.1.0"
-
-mini-css-extract-plugin@^0.5.0:
+mini-css-extract-plugin@0.5.0, mini-css-extract-plugin@^0.5.0:
   version "0.5.0"
   resolved "https://registry.yarnpkg.com/mini-css-extract-plugin/-/mini-css-extract-plugin-0.5.0.tgz#ac0059b02b9692515a637115b0cc9fed3a35c7b0"
   dependencies:
@@ -14815,9 +14635,10 @@ node-releases@^1.0.0-alpha.11, node-releases@^1.1.3:
   dependencies:
     semver "^5.3.0"
 
-node-sass@4.10.0:
-  version "4.10.0"
-  resolved "https://registry.yarnpkg.com/node-sass/-/node-sass-4.10.0.tgz#dcc2b364c0913630945ccbf7a2bbf1f926effca4"
+node-sass@4.11.0:
+  version "4.11.0"
+  resolved "https://registry.yarnpkg.com/node-sass/-/node-sass-4.11.0.tgz#183faec398e9cbe93ba43362e2768ca988a6369a"
+  integrity sha512-bHUdHTphgQJZaF1LASx0kAviPH7sGlcyNhWade4eVIpFp6tsn7SV8xNMTbsQFpEV9VXpnwTTnNYlfsZXgGgmkA==
   dependencies:
     async-foreach "^0.1.3"
     chalk "^1.1.1"
@@ -14843,7 +14664,7 @@ node-version@^1.0.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/node-version/-/node-version-1.2.0.tgz#34fde3ffa8e1149bd323983479dda620e1b5060d"
 
-"nopt@2 || 3", nopt@3.x, nopt@^3.0.6:
+"nopt@2 || 3", nopt@^3.0.6:
   version "3.0.6"
   resolved "https://registry.yarnpkg.com/nopt/-/nopt-3.0.6.tgz#c6465dbf08abcd4db359317f79ac68a646b28ff9"
   dependencies:
@@ -15126,7 +14947,7 @@ object.values@^1.0.4, object.values@^1.1.0:
     function-bind "^1.1.1"
     has "^1.0.3"
 
-obuf@^1.0.0, obuf@^1.1.1, obuf@^1.1.2:
+obuf@^1.0.0, obuf@^1.1.2:
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/obuf/-/obuf-1.1.2.tgz#09bea3343d41859ebd446292d11c9d4db619084e"
 
@@ -15149,7 +14970,7 @@ on-headers@~1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/on-headers/-/on-headers-1.0.1.tgz#928f5d0f470d49342651ea6794b0857c100693f7"
 
-once@1.x, once@^1.3.0, once@^1.3.1, once@^1.4.0:
+once@^1.3.0, once@^1.3.1, once@^1.4.0:
   version "1.4.0"
   resolved "https://registry.yarnpkg.com/once/-/once-1.4.0.tgz#583b1aa775961d4b113ac17d9c50baef9dd76bd1"
   dependencies:
@@ -15173,12 +14994,6 @@ openurl@1.1.1:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/openurl/-/openurl-1.1.1.tgz#3875b4b0ef7a52c156f0db41d4609dbb0f94b387"
 
-opn@5.3.0:
-  version "5.3.0"
-  resolved "https://registry.yarnpkg.com/opn/-/opn-5.3.0.tgz#64871565c863875f052cfdf53d3e3cb5adb53b1c"
-  dependencies:
-    is-wsl "^1.1.0"
-
 opn@5.4.0, opn@^5.1.0, opn@^5.3.0, opn@^5.4.0:
   version "5.4.0"
   resolved "https://registry.yarnpkg.com/opn/-/opn-5.4.0.tgz#cb545e7aab78562beb11aa3bfabc7042e1761035"
@@ -15860,14 +15675,6 @@ popper.js@^1.14.4:
   version "1.14.6"
   resolved "https://registry.yarnpkg.com/popper.js/-/popper.js-1.14.6.tgz#ab20dd4edf9288b8b3b6531c47c361107b60b4b0"
 
-portfinder@1.0.17:
-  version "1.0.17"
-  resolved "https://registry.yarnpkg.com/portfinder/-/portfinder-1.0.17.tgz#a8a1691143e46c4735edefcf4fbcccedad26456a"
-  dependencies:
-    async "^1.5.2"
-    debug "^2.2.0"
-    mkdirp "0.5.x"
-
 portfinder@^1.0.13, portfinder@^1.0.15, portfinder@^1.0.9:
   version "1.0.20"
   resolved "https://registry.yarnpkg.com/portfinder/-/portfinder-1.0.20.tgz#bea68632e54b2e13ab7b0c4775e9b41bf270e44a"
@@ -16052,9 +15859,10 @@ postcss-image-set-function@^3.0.1:
     postcss "^7.0.2"
     postcss-values-parser "^2.0.0"
 
-postcss-import@12.0.0:
-  version "12.0.0"
-  resolved "https://registry.yarnpkg.com/postcss-import/-/postcss-import-12.0.0.tgz#149f96a4ef0b27525c419784be8517ebd17e92c5"
+postcss-import@12.0.1:
+  version "12.0.1"
+  resolved "https://registry.yarnpkg.com/postcss-import/-/postcss-import-12.0.1.tgz#cf8c7ab0b5ccab5649024536e565f841928b7153"
+  integrity sha512-3Gti33dmCjyKBgimqGxL3vcV8w9+bsHwO5UrBawp796+jdardbcFl4RP5w/76BwNL7aGzpKstIfF9I+kdE8pTw==
   dependencies:
     postcss "^7.0.1"
     postcss-value-parser "^3.2.3"
@@ -16455,13 +16263,14 @@ postcss-values-parser@^2.0.0:
     indexes-of "^1.0.1"
     uniq "^1.0.1"
 
-postcss@7.0.5:
-  version "7.0.5"
-  resolved "https://registry.yarnpkg.com/postcss/-/postcss-7.0.5.tgz#70e6443e36a6d520b0fd4e7593fcca3635ee9f55"
+postcss@7.0.14, postcss@^7.0.0, postcss@^7.0.1, postcss@^7.0.13, postcss@^7.0.14, postcss@^7.0.2, postcss@^7.0.5, postcss@^7.0.6, postcss@^7.0.7:
+  version "7.0.14"
+  resolved "https://registry.yarnpkg.com/postcss/-/postcss-7.0.14.tgz#4527ed6b1ca0d82c53ce5ec1a2041c2346bbd6e5"
+  integrity sha512-NsbD6XUUMZvBxtQAJuWDJeeC4QFsmWsfozWxCJPWf3M55K9iu2iMDaKqyoOdTJ1R4usBXuxlVFAIo8rZPQD4Bg==
   dependencies:
-    chalk "^2.4.1"
+    chalk "^2.4.2"
     source-map "^0.6.1"
-    supports-color "^5.5.0"
+    supports-color "^6.1.0"
 
 postcss@^6.0.1, postcss@^6.0.23, postcss@^6.0.9:
   version "6.0.23"
@@ -16471,14 +16280,6 @@ postcss@^6.0.1, postcss@^6.0.23, postcss@^6.0.9:
     source-map "^0.6.1"
     supports-color "^5.4.0"
 
-postcss@^7.0.0, postcss@^7.0.1, postcss@^7.0.14, postcss@^7.0.2, postcss@^7.0.5, postcss@^7.0.6, postcss@^7.0.7:
-  version "7.0.14"
-  resolved "https://registry.yarnpkg.com/postcss/-/postcss-7.0.14.tgz#4527ed6b1ca0d82c53ce5ec1a2041c2346bbd6e5"
-  dependencies:
-    chalk "^2.4.2"
-    source-map "^0.6.1"
-    supports-color "^6.1.0"
-
 preact-render-to-json@^3.6.6:
   version "3.6.6"
   resolved "https://registry.yarnpkg.com/preact-render-to-json/-/preact-render-to-json-3.6.6.tgz#f67f48581912ac53fc9f4873bc6d7ce342f71c20"
@@ -17006,11 +16807,7 @@ raw-body@~2.1.2:
     iconv-lite "0.4.13"
     unpipe "1.0.0"
 
-raw-loader@0.5.1:
-  version "0.5.1"
-  resolved "https://registry.yarnpkg.com/raw-loader/-/raw-loader-0.5.1.tgz#0c3d0beaed8a01c966d9787bf778281252a979aa"
-
-raw-loader@^1.0.0:
+raw-loader@1.0.0, raw-loader@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/raw-loader/-/raw-loader-1.0.0.tgz#3f9889e73dadbda9a424bce79809b4133ad46405"
   dependencies:
@@ -17628,7 +17425,7 @@ read@1, read@~1.0.1:
   dependencies:
     mute-stream "~0.0.4"
 
-"readable-stream@1 || 2", readable-stream@^2.0.0, readable-stream@^2.0.1, readable-stream@^2.0.2, readable-stream@^2.0.4, readable-stream@^2.0.6, readable-stream@^2.1.5, readable-stream@^2.2.2, readable-stream@^2.2.9, readable-stream@^2.3.3, readable-stream@^2.3.5, readable-stream@^2.3.6, readable-stream@~2.3.6:
+"readable-stream@1 || 2", readable-stream@^2.0.0, readable-stream@^2.0.1, readable-stream@^2.0.2, readable-stream@^2.0.4, readable-stream@^2.0.6, readable-stream@^2.1.5, readable-stream@^2.2.2, readable-stream@^2.3.3, readable-stream@^2.3.5, readable-stream@^2.3.6, readable-stream@~2.3.6:
   version "2.3.6"
   resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-2.3.6.tgz#b11c27d88b8ff1fbe070643cf94b0c79ae1b0aaf"
   dependencies:
@@ -18326,7 +18123,7 @@ resolve-url@^0.2.1:
   version "0.2.1"
   resolved "https://registry.yarnpkg.com/resolve-url/-/resolve-url-0.2.1.tgz#2c637fe77c893afd2a663fe21aa9080068e2052a"
 
-resolve@1.1.7, resolve@1.1.x:
+resolve@1.1.7:
   version "1.1.7"
   resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.1.7.tgz#203114d82ad2c5ed9e8e0411b3932875e889e97b"
 
@@ -18776,10 +18573,6 @@ semver-intersect@1.4.0:
   version "5.6.0"
   resolved "https://registry.yarnpkg.com/semver/-/semver-5.6.0.tgz#7e74256fbaa49c75aa7c7a205cc22799cac80004"
 
-semver@5.5.1:
-  version "5.5.1"
-  resolved "https://registry.yarnpkg.com/semver/-/semver-5.5.1.tgz#7dfdd8814bdb7cabc7be0fb1d734cfb66c940477"
-
 semver@~5.3.0:
   version "5.3.0"
   resolved "https://registry.yarnpkg.com/semver/-/semver-5.3.0.tgz#9b2ce5d3de02d17c6012ad326aa6b4d0cf54f94f"
@@ -19260,9 +19053,10 @@ source-map-resolve@^0.5.0, source-map-resolve@^0.5.2:
     source-map-url "^0.4.0"
     urix "^0.1.0"
 
-source-map-support@0.5.9:
-  version "0.5.9"
-  resolved "https://registry.yarnpkg.com/source-map-support/-/source-map-support-0.5.9.tgz#41bc953b2534267ea2d605bccfa7bfa3111ced5f"
+source-map-support@0.5.10, source-map-support@^0.5.5, source-map-support@^0.5.6, source-map-support@^0.5.9, source-map-support@~0.5.9:
+  version "0.5.10"
+  resolved "https://registry.yarnpkg.com/source-map-support/-/source-map-support-0.5.10.tgz#2214080bc9d51832511ee2bab96e3c2f9353120c"
+  integrity sha512-YfQ3tQFTK/yzlGJuX8pTwa4tifQj4QS2Mj7UegOu8jAz59MqIiMGPXxQhVQiIMNzayuUSF/jEuVnfFF5JqybmQ==
   dependencies:
     buffer-from "^1.0.0"
     source-map "^0.6.0"
@@ -19273,13 +19067,6 @@ source-map-support@^0.4.15, source-map-support@~0.4.0:
   dependencies:
     source-map "^0.5.6"
 
-source-map-support@^0.5.5, source-map-support@^0.5.6, source-map-support@^0.5.9, source-map-support@~0.5.9:
-  version "0.5.10"
-  resolved "https://registry.yarnpkg.com/source-map-support/-/source-map-support-0.5.10.tgz#2214080bc9d51832511ee2bab96e3c2f9353120c"
-  dependencies:
-    buffer-from "^1.0.0"
-    source-map "^0.6.0"
-
 source-map-url@^0.3.0:
   version "0.3.0"
   resolved "https://registry.yarnpkg.com/source-map-url/-/source-map-url-0.3.0.tgz#7ecaf13b57bcd09da8a40c5d269db33799d4aaf9"
@@ -19316,12 +19103,6 @@ source-map@^0.6.0, source-map@^0.6.1, source-map@~0.6.0, source-map@~0.6.1:
   version "0.6.1"
   resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.6.1.tgz#74722af32e9614e9c287a8d0bbde48b5e2f1a263"
 
-source-map@~0.2.0:
-  version "0.2.0"
-  resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.2.0.tgz#dab73fbcfc2ba819b4de03bd6f6eaa48164b3f9d"
-  dependencies:
-    amdefine ">=0.0.4"
-
 sourcemap-codec@^1.4.1:
   version "1.4.4"
   resolved "https://registry.yarnpkg.com/sourcemap-codec/-/sourcemap-codec-1.4.4.tgz#c63ea927c029dd6bd9a2b7fa03b3fec02ad56e9f"
@@ -19384,18 +19165,6 @@ spdx-license-ids@^3.0.0:
   version "3.0.3"
   resolved "https://registry.yarnpkg.com/spdx-license-ids/-/spdx-license-ids-3.0.3.tgz#81c0ce8f21474756148bbb5f3bfc0f36bf15d76e"
 
-spdy-transport@^2.0.18:
-  version "2.1.1"
-  resolved "https://registry.yarnpkg.com/spdy-transport/-/spdy-transport-2.1.1.tgz#c54815d73858aadd06ce63001e7d25fa6441623b"
-  dependencies:
-    debug "^2.6.8"
-    detect-node "^2.0.3"
-    hpack.js "^2.1.6"
-    obuf "^1.1.1"
-    readable-stream "^2.2.9"
-    safe-buffer "^5.0.1"
-    wbuf "^1.7.2"
-
 spdy-transport@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/spdy-transport/-/spdy-transport-3.0.0.tgz#00d4863a6400ad75df93361a1608605e5dcdcf31"
@@ -19407,17 +19176,6 @@ spdy-transport@^3.0.0:
     readable-stream "^3.0.6"
     wbuf "^1.7.3"
 
-spdy@^3.4.1:
-  version "3.4.7"
-  resolved "https://registry.yarnpkg.com/spdy/-/spdy-3.4.7.tgz#42ff41ece5cc0f99a3a6c28aabb73f5c3b03acbc"
-  dependencies:
-    debug "^2.6.8"
-    handle-thing "^1.2.5"
-    http-deceiver "^1.2.7"
-    safe-buffer "^5.0.1"
-    select-hose "^2.0.0"
-    spdy-transport "^2.0.18"
-
 spdy@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/spdy/-/spdy-4.0.0.tgz#81f222b5a743a329aa12cea6a390e60e9b613c52"
@@ -19428,9 +19186,10 @@ spdy@^4.0.0:
     select-hose "^2.0.0"
     spdy-transport "^3.0.0"
 
-speed-measure-webpack-plugin@1.2.3:
-  version "1.2.3"
-  resolved "https://registry.yarnpkg.com/speed-measure-webpack-plugin/-/speed-measure-webpack-plugin-1.2.3.tgz#de170b5cefbfa1c039d95e639edd3ad50cfc7c48"
+speed-measure-webpack-plugin@1.3.0:
+  version "1.3.0"
+  resolved "https://registry.yarnpkg.com/speed-measure-webpack-plugin/-/speed-measure-webpack-plugin-1.3.0.tgz#c7ffafef513df3d63d5d546c8fc1986dfc4969aa"
+  integrity sha512-b9Yd0TrzceMVYSbuamM1sFsGM1oVfyFTM22gOoyLhymNvBVApuYpkdFOgYkKJpN/KhTpcCYcTGHg7X+FJ33Vvw==
   dependencies:
     chalk "^2.0.1"
 
@@ -19891,7 +19650,7 @@ supports-color@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-2.0.0.tgz#535d045ce6b6363fa40117084629995e9df324c7"
 
-supports-color@^3.1.0, supports-color@^3.1.2:
+supports-color@^3.1.2:
   version "3.2.3"
   resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-3.2.3.tgz#65ac0504b3954171d8a64946b2ae3cbb8a5f54f6"
   dependencies:
@@ -20107,7 +19866,7 @@ terser-webpack-plugin@1.1.0:
     webpack-sources "^1.1.0"
     worker-farm "^1.5.2"
 
-terser-webpack-plugin@^1.1.0:
+terser-webpack-plugin@1.2.2, terser-webpack-plugin@^1.1.0:
   version "1.2.2"
   resolved "https://registry.yarnpkg.com/terser-webpack-plugin/-/terser-webpack-plugin-1.2.2.tgz#9bff3a891ad614855a7dde0d707f7db5a927e3d9"
   dependencies:
@@ -20413,11 +20172,7 @@ tr46@^1.0.1:
   dependencies:
     punycode "^2.1.0"
 
-tree-kill@1.2.0:
-  version "1.2.0"
-  resolved "https://registry.yarnpkg.com/tree-kill/-/tree-kill-1.2.0.tgz#5846786237b4239014f05db156b643212d4c6f36"
-
-tree-kill@^1.1.0:
+tree-kill@1.2.1, tree-kill@^1.1.0:
   version "1.2.1"
   resolved "https://registry.yarnpkg.com/tree-kill/-/tree-kill-1.2.1.tgz#5398f374e2f292b9dcc7b2e71e30a5c3bb6c743a"
 
@@ -20679,13 +20434,9 @@ typescript@2.7.2:
   version "2.7.2"
   resolved "https://registry.yarnpkg.com/typescript/-/typescript-2.7.2.tgz#2d615a1ef4aee4f574425cdff7026edf81919836"
 
-typescript@3.1.6:
-  version "3.1.6"
-  resolved "https://registry.yarnpkg.com/typescript/-/typescript-3.1.6.tgz#b6543a83cfc8c2befb3f4c8fba6896f5b0c9be68"
-
-typescript@3.2.2:
-  version "3.2.2"
-  resolved "https://registry.yarnpkg.com/typescript/-/typescript-3.2.2.tgz#fe8101c46aa123f8353523ebdcf5730c2ae493e5"
+typescript@3.2.4:
+  version "3.2.4"
+  resolved "https://registry.yarnpkg.com/typescript/-/typescript-3.2.4.tgz#c585cb952912263d915b462726ce244ba510ef3d"
 
 typescript@^3.3.1:
   version "3.3.1"
@@ -20699,7 +20450,7 @@ uc.micro@^1.0.1, uc.micro@^1.0.5:
   version "1.0.5"
   resolved "https://registry.yarnpkg.com/uc.micro/-/uc.micro-1.0.5.tgz#0c65f15f815aa08b560a61ce8b4db7ffc3f45376"
 
-uglify-es@^3.1.9, uglify-es@^3.3.4:
+uglify-es@^3.1.9:
   version "3.3.9"
   resolved "https://registry.yarnpkg.com/uglify-es/-/uglify-es-3.3.9.tgz#0c1c4f0700bed8dbc124cdb304d2592ca203e677"
   dependencies:
@@ -20713,19 +20464,6 @@ uglify-js@3.4.x, uglify-js@^3.1.4, uglify-js@^3.4.0:
     commander "~2.17.1"
     source-map "~0.6.1"
 
-uglifyjs-webpack-plugin@^1.2.4:
-  version "1.3.0"
-  resolved "https://registry.yarnpkg.com/uglifyjs-webpack-plugin/-/uglifyjs-webpack-plugin-1.3.0.tgz#75f548160858163a08643e086d5fefe18a5d67de"
-  dependencies:
-    cacache "^10.0.4"
-    find-cache-dir "^1.0.0"
-    schema-utils "^0.4.5"
-    serialize-javascript "^1.4.0"
-    source-map "^0.6.1"
-    uglify-es "^3.3.4"
-    webpack-sources "^1.1.0"
-    worker-farm "^1.5.2"
-
 uid-number@0.0.6:
   version "0.0.6"
   resolved "https://registry.yarnpkg.com/uid-number/-/uid-number-0.0.6.tgz#0ea10e8035e8eb5b8e4449f06da1c730663baa81"
@@ -21403,7 +21141,7 @@ watchpack@^1.5.0:
     graceful-fs "^4.1.2"
     neo-async "^2.5.0"
 
-wbuf@^1.1.0, wbuf@^1.7.2, wbuf@^1.7.3:
+wbuf@^1.1.0, wbuf@^1.7.3:
   version "1.7.3"
   resolved "https://registry.yarnpkg.com/wbuf/-/wbuf-1.7.3.tgz#c1d8d149316d3ea852848895cb6a0bfe887b87df"
   dependencies:
@@ -21478,7 +21216,7 @@ webpack-dev-middleware@3.4.0:
     range-parser "^1.0.3"
     webpack-log "^2.0.0"
 
-webpack-dev-middleware@^3.5.1:
+webpack-dev-middleware@3.5.1, webpack-dev-middleware@^3.5.1:
   version "3.5.1"
   resolved "https://registry.yarnpkg.com/webpack-dev-middleware/-/webpack-dev-middleware-3.5.1.tgz#9265b7742ef50f54f54c1d9af022fc17c1be9b88"
   dependencies:
@@ -21487,39 +21225,6 @@ webpack-dev-middleware@^3.5.1:
     range-parser "^1.0.3"
     webpack-log "^2.0.0"
 
-webpack-dev-server@3.1.10:
-  version "3.1.10"
-  resolved "https://registry.yarnpkg.com/webpack-dev-server/-/webpack-dev-server-3.1.10.tgz#507411bee727ee8d2fdffdc621b66a64ab3dea2b"
-  dependencies:
-    ansi-html "0.0.7"
-    bonjour "^3.5.0"
-    chokidar "^2.0.0"
-    compression "^1.5.2"
-    connect-history-api-fallback "^1.3.0"
-    debug "^3.1.0"
-    del "^3.0.0"
-    express "^4.16.2"
-    html-entities "^1.2.0"
-    http-proxy-middleware "~0.18.0"
-    import-local "^2.0.0"
-    internal-ip "^3.0.1"
-    ip "^1.1.5"
-    killable "^1.0.0"
-    loglevel "^1.4.1"
-    opn "^5.1.0"
-    portfinder "^1.0.9"
-    schema-utils "^1.0.0"
-    selfsigned "^1.9.1"
-    serve-index "^1.7.2"
-    sockjs "0.3.19"
-    sockjs-client "1.3.0"
-    spdy "^3.4.1"
-    strip-ansi "^3.0.0"
-    supports-color "^5.1.0"
-    webpack-dev-middleware "3.4.0"
-    webpack-log "^2.0.0"
-    yargs "12.0.2"
-
 webpack-dev-server@3.1.14, webpack-dev-server@^3.1.14:
   version "3.1.14"
   resolved "https://registry.yarnpkg.com/webpack-dev-server/-/webpack-dev-server-3.1.14.tgz#60fb229b997fc5a0a1fc6237421030180959d469"
@@ -21588,19 +21293,13 @@ webpack-manifest-plugin@2.0.4:
     lodash ">=3.5 <5"
     tapable "^1.0.0"
 
-webpack-merge@4.1.4:
-  version "4.1.4"
-  resolved "https://registry.yarnpkg.com/webpack-merge/-/webpack-merge-4.1.4.tgz#0fde38eabf2d5fd85251c24a5a8c48f8a3f4eb7b"
+webpack-merge@4.2.1:
+  version "4.2.1"
+  resolved "https://registry.yarnpkg.com/webpack-merge/-/webpack-merge-4.2.1.tgz#5e923cf802ea2ace4fd5af1d3247368a633489b4"
+  integrity sha512-4p8WQyS98bUJcCvFMbdGZyZmsKuWjWVnVHnAS3FFg0HDaRVrPbkivx2RYCre8UiemD67RsiFFLfn4JhLAin8Vw==
   dependencies:
     lodash "^4.17.5"
 
-webpack-sources@1.2.0:
-  version "1.2.0"
-  resolved "https://registry.yarnpkg.com/webpack-sources/-/webpack-sources-1.2.0.tgz#18181e0d013fce096faf6f8e6d41eeffffdceac2"
-  dependencies:
-    source-list-map "^2.0.0"
-    source-map "~0.6.1"
-
 webpack-sources@1.3.0, webpack-sources@^1.1.0, webpack-sources@^1.2.0, webpack-sources@^1.3.0:
   version "1.3.0"
   resolved "https://registry.yarnpkg.com/webpack-sources/-/webpack-sources-1.3.0.tgz#2a28dcb9f1f45fe960d8f1493252b5ee6530fa85"
@@ -21643,36 +21342,7 @@ webpack@4.19.1:
     watchpack "^1.5.0"
     webpack-sources "^1.2.0"
 
-webpack@4.23.1:
-  version "4.23.1"
-  resolved "https://registry.yarnpkg.com/webpack/-/webpack-4.23.1.tgz#db7467b116771ae020c58bdfe2a0822785bb8239"
-  dependencies:
-    "@webassemblyjs/ast" "1.7.10"
-    "@webassemblyjs/helper-module-context" "1.7.10"
-    "@webassemblyjs/wasm-edit" "1.7.10"
-    "@webassemblyjs/wasm-parser" "1.7.10"
-    acorn "^5.6.2"
-    acorn-dynamic-import "^3.0.0"
-    ajv "^6.1.0"
-    ajv-keywords "^3.1.0"
-    chrome-trace-event "^1.0.0"
-    enhanced-resolve "^4.1.0"
-    eslint-scope "^4.0.0"
-    json-parse-better-errors "^1.0.2"
-    loader-runner "^2.3.0"
-    loader-utils "^1.1.0"
-    memory-fs "~0.4.1"
-    micromatch "^3.1.8"
-    mkdirp "~0.5.0"
-    neo-async "^2.5.0"
-    node-libs-browser "^2.0.0"
-    schema-utils "^0.4.4"
-    tapable "^1.1.0"
-    uglifyjs-webpack-plugin "^1.2.4"
-    watchpack "^1.5.0"
-    webpack-sources "^1.3.0"
-
-webpack@^4.29.0:
+webpack@4.29.0, webpack@^4.29.0:
   version "4.29.0"
   resolved "https://registry.yarnpkg.com/webpack/-/webpack-4.29.0.tgz#f2cfef83f7ae404ba889ff5d43efd285ca26e750"
   dependencies:
@@ -21763,7 +21433,7 @@ which-module@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/which-module/-/which-module-2.0.0.tgz#d9ef07dce77b9902b8a3a8fa4b31c3e3f7e6e87a"
 
-which@1, which@^1.1.1, which@^1.2.10, which@^1.2.12, which@^1.2.14, which@^1.2.9, which@^1.3.0, which@^1.3.1:
+which@1, which@^1.2.10, which@^1.2.12, which@^1.2.14, which@^1.2.9, which@^1.3.0, which@^1.3.1:
   version "1.3.1"
   resolved "https://registry.yarnpkg.com/which/-/which-1.3.1.tgz#a45043d54f5805316da8d62f9f50918d3da70b0a"
   dependencies:

From fa68e3396e7f1bef0f7e2abaad1c94aeaf7fb083 Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Wed, 27 Feb 2019 22:19:12 +0800
Subject: [PATCH 094/249] Merge pull request #5776 from
 storybooks/5525-resolve-merge-conflicts

Fix Angular global style imports
---
 yarn.lock | 29 ++++++++++++++++++++---------
 1 file changed, 20 insertions(+), 9 deletions(-)

diff --git a/yarn.lock b/yarn.lock
index 5693ba605a3..fe088a846ca 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2379,6 +2379,7 @@
 "@webassemblyjs/utf8@1.7.11":
   version "1.7.11"
   resolved "https://registry.yarnpkg.com/@webassemblyjs/utf8/-/utf8-1.7.11.tgz#06d7218ea9fdc94a6793aa92208160db3d26ee82"
+  integrity sha512-C6GFkc7aErQIAH+BMrIdVSmW+6HSe20wg57HEC1uqJP8E/xpMjXqQUxkQw07MhNDSDcGpxI9G5JSNOQCqJk4sA==
 
 "@webassemblyjs/utf8@1.7.6":
   version "1.7.6"
@@ -2550,6 +2551,7 @@ abab@^2.0.0:
 abbrev@1:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/abbrev/-/abbrev-1.1.1.tgz#f8f2c887ad10bf67f634f005b6987fed3179aac8"
+  integrity sha512-nne9/IiQ/hzIhY6pdDnbBtz7DjPTKrY00P/zvPSm5pOFkl6xuGrGnXn/VtTNNfNtAfZ9/1RtehkszU9qcTii0Q==
 
 absolute-path@^0.0.0:
   version "0.0.0"
@@ -8183,6 +8185,7 @@ escape-html@^1.0.3, escape-html@~1.0.3:
 escape-string-regexp@1.0.5, escape-string-regexp@^1.0.2, escape-string-regexp@^1.0.4, escape-string-regexp@^1.0.5:
   version "1.0.5"
   resolved "https://registry.yarnpkg.com/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz#1b61c0562190a8dff6ae3bb2cf0200ca130b86d4"
+  integrity sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ=
 
 escodegen@^1.10.0, escodegen@^1.11.0, escodegen@^1.8.1, escodegen@^1.9.1:
   version "1.11.0"
@@ -14993,6 +14996,7 @@ opener@~1.4.0:
 openurl@1.1.1:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/openurl/-/openurl-1.1.1.tgz#3875b4b0ef7a52c156f0db41d4609dbb0f94b387"
+  integrity sha1-OHW0sO96UsFW8NtB1GCduw+Us4c=
 
 opn@5.4.0, opn@^5.1.0, opn@^5.3.0, opn@^5.4.0:
   version "5.4.0"
@@ -15672,8 +15676,9 @@ polymer-webpack-loader@^2.0.3:
     source-map "^0.5.6"
 
 popper.js@^1.14.4:
-  version "1.14.6"
-  resolved "https://registry.yarnpkg.com/popper.js/-/popper.js-1.14.6.tgz#ab20dd4edf9288b8b3b6531c47c361107b60b4b0"
+  version "1.14.7"
+  resolved "https://registry.yarnpkg.com/popper.js/-/popper.js-1.14.7.tgz#e31ec06cfac6a97a53280c3e55e4e0c860e7738e"
+  integrity sha512-4q1hNvoUre/8srWsH7hnoSJ5xVmIL4qgz+s4qf2TnJIMyZFUFMGH+9vE7mXynAlHSZ/NdTmmow86muD0myUkVQ==
 
 portfinder@^1.0.13, portfinder@^1.0.15, portfinder@^1.0.9:
   version "1.0.20"
@@ -16306,9 +16311,10 @@ prettier-linter-helpers@^1.0.0:
   dependencies:
     fast-diff "^1.1.2"
 
-prettier@1.16.0:
-  version "1.16.0"
-  resolved "https://registry.yarnpkg.com/prettier/-/prettier-1.16.0.tgz#104dd25f5ee3d0c9d0a6ce4bb40ced8481d51219"
+prettier@1.16.3:
+  version "1.16.3"
+  resolved "https://registry.yarnpkg.com/prettier/-/prettier-1.16.3.tgz#8c62168453badef702f34b45b6ee899574a6a65d"
+  integrity sha512-kn/GU6SMRYPxUakNXhpP0EedT/KmaPzr0H5lIsDogrykbaxOpOfAFfk5XA7DZrJyMAv1wlMV3CPcZruGXVVUZw==
 
 prettier@^1.14.2, prettier@^1.16.4:
   version "1.16.4"
@@ -18572,6 +18578,7 @@ semver-intersect@1.4.0:
 "semver@2 || 3 || 4 || 5", "semver@2.x || 3.x || 4 || 5", semver@5.6.0, semver@5.x, semver@^5.0.0, semver@^5.0.1, semver@^5.0.3, semver@^5.1.0, semver@^5.3.0, semver@^5.4.1, semver@^5.5, semver@^5.5.0, semver@^5.5.1, semver@^5.6.0:
   version "5.6.0"
   resolved "https://registry.yarnpkg.com/semver/-/semver-5.6.0.tgz#7e74256fbaa49c75aa7c7a205cc22799cac80004"
+  integrity sha512-RS9R6R35NYgQn++fkDWaOmqGoj4Ek9gGs+DPxNUZKuwE183xjJroKvyo1IzVFeXvUrvmALy6FWD5xrdJT25gMg==
 
 semver@~5.3.0:
   version "5.3.0"
@@ -19091,7 +19098,7 @@ source-map@0.5.6:
   version "0.5.6"
   resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.5.6.tgz#75ce38f52bf0733c5a7f0c118d81334a2bb5f412"
 
-source-map@0.7.3, source-map@^0.7.2, source-map@^0.7.3:
+source-map@0.7.3, source-map@^0.7.2:
   version "0.7.3"
   resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.7.3.tgz#5302f8169031735226544092e64981f751750383"
 
@@ -19102,6 +19109,7 @@ source-map@^0.5.0, source-map@^0.5.3, source-map@^0.5.6, source-map@^0.5.7, sour
 source-map@^0.6.0, source-map@^0.6.1, source-map@~0.6.0, source-map@~0.6.1:
   version "0.6.1"
   resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.6.1.tgz#74722af32e9614e9c287a8d0bbde48b5e2f1a263"
+  integrity sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==
 
 sourcemap-codec@^1.4.1:
   version "1.4.4"
@@ -19164,6 +19172,7 @@ spdx-expression-parse@^3.0.0:
 spdx-license-ids@^3.0.0:
   version "3.0.3"
   resolved "https://registry.yarnpkg.com/spdx-license-ids/-/spdx-license-ids-3.0.3.tgz#81c0ce8f21474756148bbb5f3bfc0f36bf15d76e"
+  integrity sha512-uBIcIl3Ih6Phe3XHK1NqboJLdGfwr1UN3k6wSD1dZpmPsIkb8AGNbZYJ1fOBk834+Gxy8rpfDxrS6XLEMZMY2g==
 
 spdy-transport@^3.0.0:
   version "3.0.0"
@@ -20433,6 +20442,7 @@ typedarray@^0.0.6:
 typescript@2.7.2:
   version "2.7.2"
   resolved "https://registry.yarnpkg.com/typescript/-/typescript-2.7.2.tgz#2d615a1ef4aee4f574425cdff7026edf81919836"
+  integrity sha512-p5TCYZDAO0m4G344hD+wx/LATebLWZNkkh2asWUFqSsD2OrDNhbAHuSjobrmsUmdzjJjEeZVU9g1h3O6vpstnw==
 
 typescript@3.2.4:
   version "3.2.4"
@@ -21043,9 +21053,10 @@ vue-template-compiler@^2.6.3:
     de-indent "^1.0.2"
     he "^1.1.0"
 
-vue-template-es2015-compiler@^1.6.0:
-  version "1.8.1"
-  resolved "https://registry.yarnpkg.com/vue-template-es2015-compiler/-/vue-template-es2015-compiler-1.8.1.tgz#e2ec4f42d16b6c712e61899c6b20bcdb1df128ca"
+vue-template-es2015-compiler@^1.8.2:
+  version "1.9.1"
+  resolved "https://registry.yarnpkg.com/vue-template-es2015-compiler/-/vue-template-es2015-compiler-1.9.1.tgz#1ee3bc9a16ecbf5118be334bb15f9c46f82f5825"
+  integrity sha512-4gDntzrifFnCEvyoO8PqyJDmguXgVPxKiIxrBKjIowvL9l+N66196+72XVYR8BBf1Uv1Fgt3bGevJ+sEmxfZzw==
 
 vue@^2.6.3:
   version "2.6.3"

From acfc740d92cd3a9c01872d1704227fa699f0e7f8 Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Wed, 27 Feb 2019 22:56:56 +0800
Subject: [PATCH 095/249] Merge pull request #5716 from
 storybooks/5421-notifications-styling

Notifications placement
---
 .../__snapshots__/storyshots.test.js.snap     | 449 +++++++-----------
 .../tabs/__snapshots__/tabs.stories.storyshot |  14 -
 lib/components/src/tabs/tabs.js               |   4 +-
 lib/ui/src/app.js                             |   2 +
 lib/ui/src/components/layout/desktop.js       |  11 +-
 .../src/components/layout/layout.stories.js   |   3 +-
 lib/ui/src/components/layout/mobile.js        |  12 +-
 .../item.js}                                  |  11 +-
 .../item.stories.js}                          |   4 +-
 .../components/notifications/notifications.js |  50 ++
 .../notifications.stories.js}                 |  19 +-
 .../__snapshots__/panel.stories.storyshot     |   2 -
 .../components/sidebar/NotificationList.js    |  43 --
 lib/ui/src/components/sidebar/Sidebar.js      |  27 +-
 .../src/components/sidebar/Sidebar.stories.js |  14 +-
 lib/ui/src/containers/nav.js                  |   2 -
 lib/ui/src/containers/notifications.js        |  18 +
 lib/ui/src/core/versions.js                   |   4 +-
 .../__snapshots__/about.stories.storyshot     |   6 -
 19 files changed, 281 insertions(+), 414 deletions(-)
 rename lib/ui/src/components/{sidebar/NotificationItem.js => notifications/item.js} (80%)
 rename lib/ui/src/components/{sidebar/NotificationItem.stories.js => notifications/item.stories.js} (87%)
 create mode 100644 lib/ui/src/components/notifications/notifications.js
 rename lib/ui/src/components/{sidebar/NotificationList.stories.js => notifications/notifications.stories.js} (65%)
 delete mode 100644 lib/ui/src/components/sidebar/NotificationList.js
 create mode 100644 lib/ui/src/containers/notifications.js

diff --git a/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap b/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
index 2c69de59a58..a2c80ea1e62 100644
--- a/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
+++ b/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
@@ -2850,8 +2850,8 @@ exports[`Storyshots Core|Scroll story with 100vh padding 2 1`] = `
 </div>
 `;
 
-exports[`Storyshots UI|Notifications/NotificationItem longText 1`] = `
-.emotion-1 {
+exports[`Storyshots UI|Notifications/Item longText 1`] = `
+.emotion-0 {
   display: block;
   padding: 16px 20px;
   border-radius: 10px;
@@ -2865,7 +2865,7 @@ exports[`Storyshots UI|Notifications/NotificationItem longText 1`] = `
   text-decoration: none;
 }
 
-.emotion-1 {
+.emotion-0 {
   display: block;
   padding: 16px 20px;
   border-radius: 10px;
@@ -2883,19 +2883,15 @@ exports[`Storyshots UI|Notifications/NotificationItem longText 1`] = `
   style="width:240px;margin:1rem"
 >
   <div
-    class="emotion-1"
+    class="emotion-0"
   >
-    <div
-      class="emotion-0"
-    >
-      🎉 This is a long message that extends over two lines!
-    </div>
+    🎉 This is a long message that extends over two lines!
   </div>
 </div>
 `;
 
-exports[`Storyshots UI|Notifications/NotificationItem simple 1`] = `
-.emotion-1 {
+exports[`Storyshots UI|Notifications/Item simple 1`] = `
+.emotion-0 {
   display: block;
   padding: 16px 20px;
   border-radius: 10px;
@@ -2909,7 +2905,7 @@ exports[`Storyshots UI|Notifications/NotificationItem simple 1`] = `
   text-decoration: none;
 }
 
-.emotion-1 {
+.emotion-0 {
   display: block;
   padding: 16px 20px;
   border-radius: 10px;
@@ -2927,19 +2923,15 @@ exports[`Storyshots UI|Notifications/NotificationItem simple 1`] = `
   style="width:240px;margin:1rem"
 >
   <div
-    class="emotion-1"
+    class="emotion-0"
   >
-    <div
-      class="emotion-0"
-    >
-      🎉 Storybook is cool!
-    </div>
+    🎉 Storybook is cool!
   </div>
 </div>
 `;
 
-exports[`Storyshots UI|Notifications/NotificationItem withLink 1`] = `
-.emotion-1 {
+exports[`Storyshots UI|Notifications/Item withLink 1`] = `
+.emotion-0 {
   display: block;
   padding: 16px 20px;
   border-radius: 10px;
@@ -2953,7 +2945,7 @@ exports[`Storyshots UI|Notifications/NotificationItem withLink 1`] = `
   text-decoration: none;
 }
 
-.emotion-1 {
+.emotion-0 {
   display: block;
   padding: 16px 20px;
   border-radius: 10px;
@@ -2971,20 +2963,16 @@ exports[`Storyshots UI|Notifications/NotificationItem withLink 1`] = `
   style="width:240px;margin:1rem"
 >
   <a
-    class="emotion-1"
+    class="emotion-0"
     href="/?path=/some/path"
   >
-    <div
-      class="emotion-0"
-    >
-      🎉 Storybook X.X is available! Download now »
-    </div>
+    🎉 Storybook X.X is available! Download now »
   </a>
 </div>
 `;
 
-exports[`Storyshots UI|Notifications/NotificationList all 1`] = `
-.emotion-1 {
+exports[`Storyshots UI|Notifications/Notifications all 1`] = `
+.emotion-0 {
   display: block;
   padding: 16px 20px;
   border-radius: 10px;
@@ -2998,15 +2986,23 @@ exports[`Storyshots UI|Notifications/NotificationList all 1`] = `
   text-decoration: none;
 }
 
-.emotion-6 > * + * {
+.emotion-3 {
+  z-index: 10;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  position: fixed;
+}
+
+.emotion-3 > * + * {
   margin-top: 10px;
 }
 
-.emotion-6:empty {
+.emotion-3:empty {
   display: none;
 }
 
-.emotion-1 {
+.emotion-0 {
   display: block;
   padding: 16px 20px;
   border-radius: 10px;
@@ -3020,11 +3016,19 @@ exports[`Storyshots UI|Notifications/NotificationList all 1`] = `
   text-decoration: none;
 }
 
-.emotion-6 > * + * {
+.emotion-3 {
+  z-index: 10;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  position: fixed;
+}
+
+.emotion-3 > * + * {
   margin-top: 10px;
 }
 
-.emotion-6:empty {
+.emotion-3:empty {
   display: none;
 }
 
@@ -3032,42 +3036,30 @@ exports[`Storyshots UI|Notifications/NotificationList all 1`] = `
   style="width:240px;margin:1rem"
 >
   <div
-    class="emotion-6"
+    class="emotion-3"
   >
     <div
-      class="emotion-1"
+      class="emotion-0"
     >
-      <div
-        class="emotion-0"
-      >
-        🎉 Storybook is cool!
-      </div>
+      🎉 Storybook is cool!
     </div>
     <div
-      class="emotion-1"
+      class="emotion-0"
     >
-      <div
-        class="emotion-0"
-      >
-        🎉 This is a long message that extends over two lines!
-      </div>
+      🎉 This is a long message that extends over two lines!
     </div>
     <a
-      class="emotion-1"
+      class="emotion-0"
       href="/?path=/some/path"
     >
-      <div
-        class="emotion-0"
-      >
-        🎉 Storybook X.X is available! Download now »
-      </div>
+      🎉 Storybook X.X is available! Download now »
     </a>
   </div>
 </div>
 `;
 
-exports[`Storyshots UI|Notifications/NotificationList single 1`] = `
-.emotion-1 {
+exports[`Storyshots UI|Notifications/Notifications placement 1`] = `
+.emotion-0 {
   display: block;
   padding: 16px 20px;
   border-radius: 10px;
@@ -3081,15 +3073,22 @@ exports[`Storyshots UI|Notifications/NotificationList single 1`] = `
   text-decoration: none;
 }
 
-.emotion-2 > * + * {
+.emotion-3 {
+  z-index: 10;
+  position: fixed;
+  left: 20px;
+  bottom: 20px;
+}
+
+.emotion-3 > * + * {
   margin-top: 10px;
 }
 
-.emotion-2:empty {
+.emotion-3:empty {
   display: none;
 }
 
-.emotion-1 {
+.emotion-0 {
   display: block;
   padding: 16px 20px;
   border-radius: 10px;
@@ -3103,11 +3102,18 @@ exports[`Storyshots UI|Notifications/NotificationList single 1`] = `
   text-decoration: none;
 }
 
-.emotion-2 > * + * {
+.emotion-3 {
+  z-index: 10;
+  position: fixed;
+  left: 20px;
+  bottom: 20px;
+}
+
+.emotion-3 > * + * {
   margin-top: 10px;
 }
 
-.emotion-2:empty {
+.emotion-3:empty {
   display: none;
 }
 
@@ -3115,16 +3121,99 @@ exports[`Storyshots UI|Notifications/NotificationList single 1`] = `
   style="width:240px;margin:1rem"
 >
   <div
-    class="emotion-2"
+    class="emotion-3"
   >
     <div
-      class="emotion-1"
+      class="emotion-0"
     >
-      <div
-        class="emotion-0"
-      >
-        🎉 Storybook is cool!
-      </div>
+      🎉 Storybook is cool!
+    </div>
+    <div
+      class="emotion-0"
+    >
+      🎉 This is a long message that extends over two lines!
+    </div>
+    <a
+      class="emotion-0"
+      href="/?path=/some/path"
+    >
+      🎉 Storybook X.X is available! Download now »
+    </a>
+  </div>
+</div>
+`;
+
+exports[`Storyshots UI|Notifications/Notifications single 1`] = `
+.emotion-0 {
+  display: block;
+  padding: 16px 20px;
+  border-radius: 10px;
+  font-size: 12px;
+  font-weight: 700;
+  line-height: 16px;
+  box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
+  color: #FFFFFF;
+  background-color: rgba(0,0,0,0.95);
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
+.emotion-1 {
+  z-index: 10;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  position: fixed;
+}
+
+.emotion-1 > * + * {
+  margin-top: 10px;
+}
+
+.emotion-1:empty {
+  display: none;
+}
+
+.emotion-0 {
+  display: block;
+  padding: 16px 20px;
+  border-radius: 10px;
+  font-size: 12px;
+  font-weight: 700;
+  line-height: 16px;
+  box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
+  color: #FFFFFF;
+  background-color: rgba(0,0,0,0.95);
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
+.emotion-1 {
+  z-index: 10;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  position: fixed;
+}
+
+.emotion-1 > * + * {
+  margin-top: 10px;
+}
+
+.emotion-1:empty {
+  display: none;
+}
+
+<div
+  style="width:240px;margin:1rem"
+>
+  <div
+    class="emotion-1"
+  >
+    <div
+      class="emotion-0"
+    >
+      🎉 Storybook is cool!
     </div>
   </div>
 </div>
@@ -4422,11 +4511,9 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
 
 <div
   class="emotion-100"
-  title="wrapper"
 >
   <div
     class="emotion-8"
-    title="flexbar"
   >
     <div
       class="emotion-7"
@@ -5222,29 +5309,7 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
   fill: currentColor;
 }
 
-.emotion-81 {
-  display: block;
-  padding: 16px 20px;
-  border-radius: 10px;
-  font-size: 12px;
-  font-weight: 700;
-  line-height: 16px;
-  box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
-  color: #FFFFFF;
-  background-color: rgba(0,0,0,0.95);
-  -webkit-text-decoration: none;
-  text-decoration: none;
-}
-
-.emotion-78 > * + * {
-  margin-top: 10px;
-}
-
-.emotion-78:empty {
-  display: none;
-}
-
-.emotion-84 {
+.emotion-77 {
   position: absolute;
   z-index: 1;
   left: 0;
@@ -5409,23 +5474,6 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
   color: #774dd7;
 }
 
-.emotion-77 {
-  height: 48px;
-}
-
-.emotion-83 {
-  position: fixed;
-  display: block;
-  bottom: 20px;
-  left: 20px;
-  margin: 0;
-  padding: 0;
-  width: 20%;
-  min-width: 200px;
-  max-width: 280px;
-  z-index: 2;
-}
-
 .emotion-76 {
   margin-top: 8px;
 }
@@ -5622,29 +5670,7 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
   fill: currentColor;
 }
 
-.emotion-81 {
-  display: block;
-  padding: 16px 20px;
-  border-radius: 10px;
-  font-size: 12px;
-  font-weight: 700;
-  line-height: 16px;
-  box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
-  color: #FFFFFF;
-  background-color: rgba(0,0,0,0.95);
-  -webkit-text-decoration: none;
-  text-decoration: none;
-}
-
-.emotion-78 > * + * {
-  margin-top: 10px;
-}
-
-.emotion-78:empty {
-  display: none;
-}
-
-.emotion-84 {
+.emotion-77 {
   position: absolute;
   z-index: 1;
   left: 0;
@@ -5809,23 +5835,6 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
   color: #774dd7;
 }
 
-.emotion-77 {
-  height: 48px;
-}
-
-.emotion-83 {
-  position: fixed;
-  display: block;
-  bottom: 20px;
-  left: 20px;
-  margin: 0;
-  padding: 0;
-  width: 20%;
-  min-width: 200px;
-  max-width: 280px;
-  z-index: 2;
-}
-
 .emotion-76 {
   margin-top: 8px;
 }
@@ -5971,7 +5980,7 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
 }
 
 <nav
-  class="container emotion-84"
+  class="container emotion-77"
 >
   <div
     class="emotion-7"
@@ -6376,34 +6385,6 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
       </span>
     </div>
   </div>
-  <div
-    class="emotion-79"
-  >
-    <div
-      class="emotion-78"
-    >
-      <div
-        class="emotion-77"
-      />
-    </div>
-  </div>
-  <div
-    class="emotion-83"
-  >
-    <div
-      class="emotion-78"
-    >
-      <div
-        class="emotion-81"
-      >
-        <div
-          class="emotion-79"
-        >
-          🎉 Storybook is cool!
-        </div>
-      </div>
-    </div>
-  </div>
 </nav>
 `;
 
@@ -6420,29 +6401,7 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   fill: currentColor;
 }
 
-.emotion-52 {
-  display: block;
-  padding: 16px 20px;
-  border-radius: 10px;
-  font-size: 12px;
-  font-weight: 700;
-  line-height: 16px;
-  box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
-  color: #FFFFFF;
-  background-color: rgba(0,0,0,0.95);
-  -webkit-text-decoration: none;
-  text-decoration: none;
-}
-
-.emotion-49 > * + * {
-  margin-top: 10px;
-}
-
-.emotion-49:empty {
-  display: none;
-}
-
-.emotion-55 {
+.emotion-48 {
   position: absolute;
   z-index: 1;
   left: 0;
@@ -6914,23 +6873,6 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   color: #774dd7;
 }
 
-.emotion-48 {
-  height: 48px;
-}
-
-.emotion-54 {
-  position: fixed;
-  display: block;
-  bottom: 20px;
-  left: 20px;
-  margin: 0;
-  padding: 0;
-  width: 20%;
-  min-width: 200px;
-  max-width: 280px;
-  z-index: 2;
-}
-
 .emotion-4 {
   shape-rendering: inherit;
   -webkit-transform: translate3d(0,0,0);
@@ -6943,29 +6885,7 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   fill: currentColor;
 }
 
-.emotion-52 {
-  display: block;
-  padding: 16px 20px;
-  border-radius: 10px;
-  font-size: 12px;
-  font-weight: 700;
-  line-height: 16px;
-  box-shadow: 0 5px 15px 0 rgba(0,0,0,0.1),0 2px 5px 0 rgba(0,0,0,0.05);
-  color: #FFFFFF;
-  background-color: rgba(0,0,0,0.95);
-  -webkit-text-decoration: none;
-  text-decoration: none;
-}
-
-.emotion-49 > * + * {
-  margin-top: 10px;
-}
-
-.emotion-49:empty {
-  display: none;
-}
-
-.emotion-55 {
+.emotion-48 {
   position: absolute;
   z-index: 1;
   left: 0;
@@ -7437,25 +7357,8 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   color: #774dd7;
 }
 
-.emotion-48 {
-  height: 48px;
-}
-
-.emotion-54 {
-  position: fixed;
-  display: block;
-  bottom: 20px;
-  left: 20px;
-  margin: 0;
-  padding: 0;
-  width: 20%;
-  min-width: 200px;
-  max-width: 280px;
-  z-index: 2;
-}
-
 <nav
-  class="container emotion-55"
+  class="container emotion-48"
 >
   <div
     class="emotion-7"
@@ -7738,34 +7641,6 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
       </a>
     </section>
   </div>
-  <div
-    class="emotion-31"
-  >
-    <div
-      class="emotion-49"
-    >
-      <div
-        class="emotion-48"
-      />
-    </div>
-  </div>
-  <div
-    class="emotion-54"
-  >
-    <div
-      class="emotion-49"
-    >
-      <div
-        class="emotion-52"
-      >
-        <div
-          class="emotion-31"
-        >
-          🎉 Storybook is cool!
-        </div>
-      </div>
-    </div>
-  </div>
 </nav>
 `;
 
diff --git a/lib/components/src/tabs/__snapshots__/tabs.stories.storyshot b/lib/components/src/tabs/__snapshots__/tabs.stories.storyshot
index 0b1f616cad8..172fa52ea43 100644
--- a/lib/components/src/tabs/__snapshots__/tabs.stories.storyshot
+++ b/lib/components/src/tabs/__snapshots__/tabs.stories.storyshot
@@ -219,11 +219,9 @@ exports[`Storyshots Basics|Tabs stateful - dynamic 1`] = `
 >
   <div
     class="emotion-12"
-    title="wrapper"
   >
     <div
       class="emotion-9"
-      title="flexbar"
     >
       <div
         class="emotion-8"
@@ -570,11 +568,9 @@ exports[`Storyshots Basics|Tabs stateful - no initial 1`] = `
 >
   <div
     class="emotion-12"
-    title="wrapper"
   >
     <div
       class="emotion-9"
-      title="flexbar"
     >
       <div
         class="emotion-8"
@@ -873,11 +869,9 @@ exports[`Storyshots Basics|Tabs stateful - static 1`] = `
 >
   <div
     class="emotion-6"
-    title="wrapper"
   >
     <div
       class="emotion-5"
-      title="flexbar"
     >
       <div
         class="emotion-4"
@@ -1159,11 +1153,9 @@ exports[`Storyshots Basics|Tabs stateless - absolute 1`] = `
 >
   <div
     class="emotion-12"
-    title="wrapper"
   >
     <div
       class="emotion-9"
-      title="flexbar"
     >
       <div
         class="emotion-8"
@@ -1512,11 +1504,9 @@ exports[`Storyshots Basics|Tabs stateless - bordered 1`] = `
 >
   <div
     class="emotion-12"
-    title="wrapper"
   >
     <div
       class="emotion-9"
-      title="flexbar"
     >
       <div
         class="emotion-8"
@@ -1892,11 +1882,9 @@ exports[`Storyshots Basics|Tabs stateless - no scrolling 1`] = `
 >
   <div
     class="emotion-12"
-    title="wrapper"
   >
     <div
       class="emotion-9"
-      title="flexbar"
     >
       <div
         class="emotion-8"
@@ -2261,11 +2249,9 @@ exports[`Storyshots Basics|Tabs stateless - with tools 1`] = `
 >
   <div
     class="emotion-13"
-    title="wrapper"
   >
     <div
       class="emotion-10"
-      title="flexbar"
     >
       <div
         class="emotion-9"
diff --git a/lib/components/src/tabs/tabs.js b/lib/components/src/tabs/tabs.js
index ea1b932acc5..94178e64c4c 100644
--- a/lib/components/src/tabs/tabs.js
+++ b/lib/components/src/tabs/tabs.js
@@ -100,8 +100,8 @@ export const Tabs = React.memo(
     const list = childrenToList(children, selected);
 
     return list.length ? (
-      <Wrapper absolute={absolute} bordered={bordered} id={htmlId} title="wrapper">
-        <FlexBar border title="flexbar">
+      <Wrapper absolute={absolute} bordered={bordered} id={htmlId}>
+        <FlexBar border>
           <TabBar role="tablist">
             {list.map(({ title, id, active }) => (
               <TabButton
diff --git a/lib/ui/src/app.js b/lib/ui/src/app.js
index 65f1201b0dd..cc5c5946a43 100644
--- a/lib/ui/src/app.js
+++ b/lib/ui/src/app.js
@@ -11,6 +11,7 @@ import { Desktop } from './components/layout/desktop';
 import Nav from './containers/nav';
 import Preview from './containers/preview';
 import Panel from './containers/panel';
+import Notifications from './containers/notifications';
 
 import SettingsPages from './settings';
 
@@ -18,6 +19,7 @@ const createProps = memoize(1)(() => ({
   Nav,
   Preview,
   Panel,
+  Notifications,
   pages: [
     {
       key: 'settings',
diff --git a/lib/ui/src/components/layout/desktop.js b/lib/ui/src/components/layout/desktop.js
index ae8e509003c..da51326d594 100644
--- a/lib/ui/src/components/layout/desktop.js
+++ b/lib/ui/src/components/layout/desktop.js
@@ -5,8 +5,16 @@ import ResizeDetector from 'react-resize-detector';
 
 import * as S from './container';
 
-const Desktop = React.memo(({ Panel, Nav, Preview, pages, options, viewMode }) => (
+const Desktop = React.memo(({ Panel, Nav, Preview, Notifications, pages, options, viewMode }) => (
   <S.Root>
+    <Notifications
+      placement={{
+        position: 'fixed',
+        bottom: 20,
+        left: 20,
+      }}
+    />
+
     <ResizeDetector handleWidth handleHeight>
       {(width, height) =>
         width && height ? (
@@ -48,6 +56,7 @@ Desktop.propTypes = {
   Nav: PropTypes.any.isRequired, // eslint-disable-line react/forbid-prop-types
   Preview: PropTypes.any.isRequired, // eslint-disable-line react/forbid-prop-types
   Panel: PropTypes.any.isRequired, // eslint-disable-line react/forbid-prop-types
+  Notifications: PropTypes.any.isRequired, // eslint-disable-line react/forbid-prop-types
   pages: PropTypes.arrayOf(
     PropTypes.shape({
       key: PropTypes.string.isRequired,
diff --git a/lib/ui/src/components/layout/layout.stories.js b/lib/ui/src/components/layout/layout.stories.js
index c11cc9004c1..2cc10e64b72 100644
--- a/lib/ui/src/components/layout/layout.stories.js
+++ b/lib/ui/src/components/layout/layout.stories.js
@@ -19,7 +19,6 @@ import { mockDataset } from '../sidebar/treeview/treeview.mockdata';
 const realNavProps = {
   title: 'Title',
   url: 'https://example.com',
-  notifications: [],
   stories: mockDataset.withRoot,
   menu: [],
 };
@@ -110,6 +109,7 @@ const mockProps = {
   Nav: MockNav,
   Preview: MockPreview,
   Panel: MockPanel,
+  Notifications: () => null,
   pages: [],
   options: { isFullscreen: false, showNav: true, showPanel: true, panelPosition: 'right' },
   path: '/story/UI-DesktopLayout-noNav',
@@ -120,6 +120,7 @@ const mockProps = {
 const realProps = {
   Nav: () => <Sidebar {...realNavProps} />,
   Preview: () => <Preview {...previewProps} />,
+  Notifications: () => null,
   Panel: () => (
     <Panel
       panels={panels}
diff --git a/lib/ui/src/components/layout/mobile.js b/lib/ui/src/components/layout/mobile.js
index 8a3be8a6795..dceaed9071a 100644
--- a/lib/ui/src/components/layout/mobile.js
+++ b/lib/ui/src/components/layout/mobile.js
@@ -133,11 +133,20 @@ class Mobile extends Component {
   }
 
   render() {
-    const { Nav, Preview, Panel, pages, viewMode, options } = this.props;
+    const { Nav, Preview, Panel, Notifications, pages, viewMode, options } = this.props;
     const { active } = this.state;
 
     return (
       <Root>
+        <Notifications
+          placement={{
+            position: 'fixed',
+            bottom: 60,
+            left: 20,
+            right: 20,
+          }}
+        />
+
         <Panels active={active}>
           <Nav />
           <div>
@@ -184,6 +193,7 @@ Mobile.propTypes = {
   Nav: PropTypes.any.isRequired, // eslint-disable-line react/forbid-prop-types
   Preview: PropTypes.any.isRequired, // eslint-disable-line react/forbid-prop-types
   Panel: PropTypes.any.isRequired, // eslint-disable-line react/forbid-prop-types
+  Notifications: PropTypes.any.isRequired, // eslint-disable-line react/forbid-prop-types
   pages: PropTypes.arrayOf(
     PropTypes.shape({
       key: PropTypes.string.isRequired,
diff --git a/lib/ui/src/components/sidebar/NotificationItem.js b/lib/ui/src/components/notifications/item.js
similarity index 80%
rename from lib/ui/src/components/sidebar/NotificationItem.js
rename to lib/ui/src/components/notifications/item.js
index be3a2297078..6cd33b38b47 100644
--- a/lib/ui/src/components/sidebar/NotificationItem.js
+++ b/lib/ui/src/components/notifications/item.js
@@ -4,8 +4,6 @@ import { styled } from '@storybook/theming';
 import { Link } from '@storybook/router';
 import { rgba, lighten, darken } from 'polished';
 
-const NotificationText = styled.div();
-
 const baseStyle = ({ theme }) => ({
   display: 'block',
   padding: '16px 20px',
@@ -31,19 +29,14 @@ export const NotificationItemSpacer = styled.div({
 
 export default function NotificationItem({ notification: { content, link } }) {
   return link ? (
-    <NotificationLink to={link}>
-      <NotificationText>{content}</NotificationText>
-    </NotificationLink>
+    <NotificationLink to={link}>{content}</NotificationLink>
   ) : (
-    <Notification>
-      <NotificationText>{content}</NotificationText>
-    </Notification>
+    <Notification>{content}</Notification>
   );
 }
 
 NotificationItem.propTypes = {
   notification: PropTypes.shape({
-    icon: PropTypes.string,
     content: PropTypes.string.isRequired,
     link: PropTypes.string,
   }).isRequired,
diff --git a/lib/ui/src/components/sidebar/NotificationItem.stories.js b/lib/ui/src/components/notifications/item.stories.js
similarity index 87%
rename from lib/ui/src/components/sidebar/NotificationItem.stories.js
rename to lib/ui/src/components/notifications/item.stories.js
index ac98c243525..f3a90bd5da1 100644
--- a/lib/ui/src/components/sidebar/NotificationItem.stories.js
+++ b/lib/ui/src/components/notifications/item.stories.js
@@ -1,10 +1,10 @@
 import React from 'react';
 
-import NotificationItem from './NotificationItem';
+import NotificationItem from './item';
 
 export default {
   component: NotificationItem,
-  title: 'UI|Notifications/NotificationItem',
+  title: 'UI|Notifications/Item',
   decorators: [storyFn => <div style={{ width: '240px', margin: '1rem' }}>{storyFn()}</div>],
 };
 
diff --git a/lib/ui/src/components/notifications/notifications.js b/lib/ui/src/components/notifications/notifications.js
new file mode 100644
index 00000000000..8386b0be511
--- /dev/null
+++ b/lib/ui/src/components/notifications/notifications.js
@@ -0,0 +1,50 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { styled } from '@storybook/theming';
+
+import NotificationItem from './item';
+
+const List = styled.div(
+  {
+    zIndex: 10,
+
+    '> * + *': {
+      marginTop: 10,
+    },
+    '&:empty': {
+      display: 'none',
+    },
+  },
+  ({ placement }) =>
+    placement || {
+      bottom: 0,
+      left: 0,
+      right: 0,
+      position: 'fixed',
+    }
+);
+
+export default function NotificationList({ notifications, placement }) {
+  return (
+    <List placement={placement}>
+      {notifications.map(notification => (
+        <NotificationItem key={notification.id} notification={notification} />
+      ))}
+    </List>
+  );
+}
+
+NotificationList.propTypes = {
+  placement: PropTypes.shape({
+    position: PropTypes.string,
+    left: PropTypes.number,
+    right: PropTypes.number,
+    top: PropTypes.number,
+    bottom: PropTypes.number,
+  }),
+  notifications: PropTypes.arrayOf(PropTypes.shape({ id: PropTypes.string.isRequired }).isRequired)
+    .isRequired,
+};
+NotificationList.defaultProps = {
+  placement: undefined,
+};
diff --git a/lib/ui/src/components/sidebar/NotificationList.stories.js b/lib/ui/src/components/notifications/notifications.stories.js
similarity index 65%
rename from lib/ui/src/components/sidebar/NotificationList.stories.js
rename to lib/ui/src/components/notifications/notifications.stories.js
index 7648fe32a1d..9c77ae15349 100644
--- a/lib/ui/src/components/sidebar/NotificationList.stories.js
+++ b/lib/ui/src/components/notifications/notifications.stories.js
@@ -1,11 +1,11 @@
 import React from 'react';
 
-import NotificationList from './NotificationList';
-import * as NotificationItemStories from './NotificationItem.stories';
+import NotificationList from './notifications';
+import * as NotificationItemStories from './item.stories';
 
 export default {
   component: NotificationList,
-  title: 'UI|Notifications/NotificationList',
+  title: 'UI|Notifications/Notifications',
   decorators: [storyFn => <div style={{ width: '240px', margin: '1rem' }}>{storyFn()}</div>],
 };
 
@@ -15,8 +15,17 @@ const notifications = Object.values(NotificationItemStories)
     ...notification,
     id: index.toString(),
   }));
-export const all = () => <NotificationList notifications={notifications} />;
-all.storyData = { notifications };
 
 export const single = () => <NotificationList notifications={notifications.slice(0, 1)} />;
 single.storyData = { notifications: notifications.slice(0, 1) };
+
+export const all = () => <NotificationList notifications={notifications} />;
+all.storyData = { notifications };
+
+export const placement = () => (
+  <NotificationList
+    placement={{ position: 'fixed', left: 20, bottom: 20 }}
+    notifications={notifications}
+  />
+);
+all.storyData = { notifications };
diff --git a/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot b/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot
index 17181209d86..49acd540911 100644
--- a/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot
+++ b/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot
@@ -287,11 +287,9 @@ exports[`Storyshots UI|Panel default 1`] = `
 <div
   class="emotion-14"
   id="storybook-panel-root"
-  title="wrapper"
 >
   <div
     class="emotion-12"
-    title="flexbar"
   >
     <div
       class="emotion-11"
diff --git a/lib/ui/src/components/sidebar/NotificationList.js b/lib/ui/src/components/sidebar/NotificationList.js
deleted file mode 100644
index ea6dd159f24..00000000000
--- a/lib/ui/src/components/sidebar/NotificationList.js
+++ /dev/null
@@ -1,43 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import { styled } from '@storybook/theming';
-
-import NotificationItem, { NotificationItemSpacer } from './NotificationItem';
-
-const List = styled.div({
-  '> * + *': {
-    marginTop: 10,
-  },
-  '&:empty': {
-    display: 'none',
-  },
-});
-
-export function NotificationListSpacer({ notifications }) {
-  return (
-    <List>
-      {notifications.map(notification => (
-        <NotificationItemSpacer key={notification.id} />
-      ))}
-    </List>
-  );
-}
-NotificationListSpacer.propTypes = {
-  notifications: PropTypes.arrayOf(PropTypes.shape({ id: PropTypes.string.isRequired }).isRequired)
-    .isRequired,
-};
-
-export default function NotificationList({ notifications }) {
-  return (
-    <List>
-      {notifications.map(notification => (
-        <NotificationItem key={notification.id} notification={notification} />
-      ))}
-    </List>
-  );
-}
-
-NotificationList.propTypes = {
-  notifications: PropTypes.arrayOf(PropTypes.shape({ id: PropTypes.string.isRequired }).isRequired)
-    .isRequired,
-};
diff --git a/lib/ui/src/components/sidebar/Sidebar.js b/lib/ui/src/components/sidebar/Sidebar.js
index 2bce763cc25..b0ee7d1e630 100644
--- a/lib/ui/src/components/sidebar/Sidebar.js
+++ b/lib/ui/src/components/sidebar/Sidebar.js
@@ -2,7 +2,6 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { styled } from '@storybook/theming';
 
-import NotificationList, { NotificationListSpacer } from './NotificationList';
 import SidebarHeading from './SidebarHeading';
 import SidebarStories from './SidebarStories';
 
@@ -25,40 +24,16 @@ const Container = styled.nav({
   overflowX: 'hidden',
 });
 
-const Foot = styled.div({});
-
-export const Notifications = styled.div({
-  position: 'fixed',
-  display: 'block',
-  bottom: 20,
-  left: 20,
-  margin: 0,
-  padding: 0,
-  width: '20%',
-  minWidth: 200,
-  maxWidth: 280,
-  zIndex: 2,
-});
-
-const Sidebar = ({ storyId, notifications = [], stories, menu, menuHighlighted, loading }) => (
+const Sidebar = ({ storyId, stories, menu, menuHighlighted, loading }) => (
   <Container className="container">
     <Heading menuHighlighted={menuHighlighted} menu={menu} />
     <Stories stories={stories} storyId={storyId} loading={loading} />
-
-    <Foot>
-      <NotificationListSpacer notifications={notifications} />
-    </Foot>
-
-    <Notifications>
-      <NotificationList notifications={notifications} />
-    </Notifications>
   </Container>
 );
 
 Sidebar.propTypes = {
   stories: PropTypes.shape({}).isRequired,
   storyId: PropTypes.string,
-  notifications: PropTypes.arrayOf(PropTypes.shape({})).isRequired,
   menu: PropTypes.arrayOf(PropTypes.shape({})).isRequired,
   menuHighlighted: PropTypes.bool,
   loading: PropTypes.bool,
diff --git a/lib/ui/src/components/sidebar/Sidebar.stories.js b/lib/ui/src/components/sidebar/Sidebar.stories.js
index 8c45e6cf904..feb26bf28a6 100644
--- a/lib/ui/src/components/sidebar/Sidebar.stories.js
+++ b/lib/ui/src/components/sidebar/Sidebar.stories.js
@@ -2,7 +2,6 @@ import React from 'react';
 
 import Sidebar from './Sidebar';
 import * as SidebarHeadingStories from './SidebarHeading.stories';
-import * as NotificationsListStories from './NotificationList.stories';
 import * as SidebarStoriesStories from './SidebarStories.stories';
 
 export default {
@@ -11,15 +10,10 @@ export default {
 };
 
 const { menu } = SidebarHeadingStories.standard.storyData;
-const { notifications } = NotificationsListStories.single.storyData;
 const { stories, storyId } = SidebarStoriesStories.withRoot.storyData;
 
-export const simple = () => (
-  <Sidebar menu={menu} notifications={notifications} stories={stories} storyId={storyId} />
-);
-simple.storyData = { menu, notifications, stories, storyId };
+export const simple = () => <Sidebar menu={menu} stories={stories} storyId={storyId} />;
+simple.storyData = { menu, stories, storyId };
 
-export const loading = () => (
-  <Sidebar menu={menu} notifications={notifications} stories={{}} loading />
-);
-loading.storyData = { menu, notifications, stories: {} };
+export const loading = () => <Sidebar menu={menu} stories={{}} loading />;
+loading.storyData = { menu, stories: {} };
diff --git a/lib/ui/src/containers/nav.js b/lib/ui/src/containers/nav.js
index 68750a080e6..eb611f12a24 100755
--- a/lib/ui/src/containers/nav.js
+++ b/lib/ui/src/containers/nav.js
@@ -92,7 +92,6 @@ const createMenu = memoize(1)((api, shortcutKeys, isFullscreen, showPanel, showN
 export const mapper = (state, api) => {
   const {
     ui: { name, url },
-    notifications,
     viewMode,
     storyId,
     layout: { isFullscreen, showPanel, showNav, panelPosition },
@@ -105,7 +104,6 @@ export const mapper = (state, api) => {
     loading: !storiesConfigured,
     title: name,
     url,
-    notifications,
     stories: storiesHash,
     storyId,
     viewMode,
diff --git a/lib/ui/src/containers/notifications.js b/lib/ui/src/containers/notifications.js
new file mode 100644
index 00000000000..641709e3b54
--- /dev/null
+++ b/lib/ui/src/containers/notifications.js
@@ -0,0 +1,18 @@
+import React from 'react';
+
+import Notifications from '../components/notifications/notifications';
+import { Consumer } from '../core/context';
+
+export const mapper = state => {
+  const { notifications } = state;
+
+  return {
+    notifications,
+  };
+};
+
+const NotificationConnect = props => (
+  <Consumer>{({ state, api }) => <Notifications {...props} {...mapper(state, api)} />}</Consumer>
+);
+
+export default NotificationConnect;
diff --git a/lib/ui/src/core/versions.js b/lib/ui/src/core/versions.js
index 5faed2c883a..0bb0c8cc5be 100644
--- a/lib/ui/src/core/versions.js
+++ b/lib/ui/src/core/versions.js
@@ -83,10 +83,8 @@ export default function({ store }) {
       if (latestVersion !== dismissedVersionNotification) {
         addNotification({
           id: 'update',
-          level: 2,
           link: '/settings/about',
-          icon: '🎉',
-          content: `There's a new version available: ${latestVersion}`,
+          content: `🎉 Storybook ${latestVersion} is available!`,
           onClear() {
             store.setState(
               { dismissedVersionNotification: latestVersion },
diff --git a/lib/ui/src/settings/__snapshots__/about.stories.storyshot b/lib/ui/src/settings/__snapshots__/about.stories.storyshot
index 1be5b37f9bc..bc9c8ce2487 100644
--- a/lib/ui/src/settings/__snapshots__/about.stories.storyshot
+++ b/lib/ui/src/settings/__snapshots__/about.stories.storyshot
@@ -411,11 +411,9 @@ exports[`Storyshots UI|Settings/AboutScreen failed to fetch new version 1`] = `
 
 <div
   class="emotion-26"
-  title="wrapper"
 >
   <div
     class="emotion-8"
-    title="flexbar"
   >
     <div
       class="emotion-7"
@@ -1697,11 +1695,9 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
 
 <div
   class="emotion-42"
-  title="wrapper"
 >
   <div
     class="emotion-8"
-    title="flexbar"
   >
     <div
       class="emotion-7"
@@ -2853,11 +2849,9 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
 
 <div
   class="emotion-28"
-  title="wrapper"
 >
   <div
     class="emotion-8"
-    title="flexbar"
   >
     <div
       class="emotion-7"

From bdb7aaca92135f447aadf32680a8aceac09f86ce Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Thu, 28 Feb 2019 01:23:33 +0800
Subject: [PATCH 096/249] 5.0.0-rc.7 changelog

---
 CHANGELOG.md | 18 ++++++++++++++++++
 1 file changed, 18 insertions(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index f0325059cdd..e97cf007643 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,21 @@
+## 5.0.0-rc.7 (February 28, 2019)
+
+### Features
+
+* UI: Page load animation and `STORIES_CONFIGURED` event ([#5756](https://github.com/storybooks/storybook/pull/5756))
+* Theming: Improve `brand` API  ([#5733](https://github.com/storybooks/storybook/pull/5733))
+* UI: Fuzzy search improvement ([#5748](https://github.com/storybooks/storybook/pull/5748))
+* UI: Add toolbar animation ([#5742](https://github.com/storybooks/storybook/pull/5742))
+
+### Bug Fixes
+
+* UI: Fix update notifications placement ([#5716](https://github.com/storybooks/storybook/pull/5716))
+* Angular: Fix global style imports ([#5776](https://github.com/storybooks/storybook/pull/5776))
+* Addon-options: Add backwards compatibility ([#5758](https://github.com/storybooks/storybook/pull/5758))
+* Addon-options: Fix deprecated url/name options ([#5773](https://github.com/storybooks/storybook/pull/5773))
+* Addon-knobs: Remove call to `forceReRender()` on `STORY_CHANGED` ([#5753](https://github.com/storybooks/storybook/pull/5753))
+* UI: Fix active state in addon-background, addon-viewport tools ([#5749](https://github.com/storybooks/storybook/pull/5749))
+
 ## 5.0.0-rc.6 (February 25, 2019)
 
 ### Bug Fixes

From c038374ae930df289e53cd4f96a7a1085fd580ae Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Thu, 28 Feb 2019 01:30:00 +0800
Subject: [PATCH 097/249] update yarn.lock

---
 yarn.lock | 28 +++++++++++++++++++++-------
 1 file changed, 21 insertions(+), 7 deletions(-)

diff --git a/yarn.lock b/yarn.lock
index fe088a846ca..8850b73e60c 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -16311,10 +16311,10 @@ prettier-linter-helpers@^1.0.0:
   dependencies:
     fast-diff "^1.1.2"
 
-prettier@1.16.3:
-  version "1.16.3"
-  resolved "https://registry.yarnpkg.com/prettier/-/prettier-1.16.3.tgz#8c62168453badef702f34b45b6ee899574a6a65d"
-  integrity sha512-kn/GU6SMRYPxUakNXhpP0EedT/KmaPzr0H5lIsDogrykbaxOpOfAFfk5XA7DZrJyMAv1wlMV3CPcZruGXVVUZw==
+prettier@1.16.0:
+  version "1.16.0"
+  resolved "https://registry.yarnpkg.com/prettier/-/prettier-1.16.0.tgz#104dd25f5ee3d0c9d0a6ce4bb40ced8481d51219"
+  integrity sha512-MCBCYeAuZfejUPdEpkleLWvpRBwLii/Sp5jQs0eb8Ul/drGIDjkL6tAU24tk6yCGf0KPV5rhPPPlczfBmN2pWQ==
 
 prettier@^1.14.2, prettier@^1.16.4:
   version "1.16.4"
@@ -19098,7 +19098,7 @@ source-map@0.5.6:
   version "0.5.6"
   resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.5.6.tgz#75ce38f52bf0733c5a7f0c118d81334a2bb5f412"
 
-source-map@0.7.3, source-map@^0.7.2:
+source-map@0.7.3, source-map@^0.7.2, source-map@^0.7.3:
   version "0.7.3"
   resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.7.3.tgz#5302f8169031735226544092e64981f751750383"
 
@@ -20460,7 +20460,7 @@ uc.micro@^1.0.1, uc.micro@^1.0.5:
   version "1.0.5"
   resolved "https://registry.yarnpkg.com/uc.micro/-/uc.micro-1.0.5.tgz#0c65f15f815aa08b560a61ce8b4db7ffc3f45376"
 
-uglify-es@^3.1.9:
+uglify-es@^3.1.9, uglify-es@^3.3.4:
   version "3.3.9"
   resolved "https://registry.yarnpkg.com/uglify-es/-/uglify-es-3.3.9.tgz#0c1c4f0700bed8dbc124cdb304d2592ca203e677"
   dependencies:
@@ -20474,6 +20474,20 @@ uglify-js@3.4.x, uglify-js@^3.1.4, uglify-js@^3.4.0:
     commander "~2.17.1"
     source-map "~0.6.1"
 
+uglifyjs-webpack-plugin@^1.2.4:
+  version "1.3.0"
+  resolved "https://registry.yarnpkg.com/uglifyjs-webpack-plugin/-/uglifyjs-webpack-plugin-1.3.0.tgz#75f548160858163a08643e086d5fefe18a5d67de"
+  integrity sha512-ovHIch0AMlxjD/97j9AYovZxG5wnHOPkL7T1GKochBADp/Zwc44pEWNqpKl1Loupp1WhFg7SlYmHZRUfdAacgw==
+  dependencies:
+    cacache "^10.0.4"
+    find-cache-dir "^1.0.0"
+    schema-utils "^0.4.5"
+    serialize-javascript "^1.4.0"
+    source-map "^0.6.1"
+    uglify-es "^3.3.4"
+    webpack-sources "^1.1.0"
+    worker-farm "^1.5.2"
+
 uid-number@0.0.6:
   version "0.0.6"
   resolved "https://registry.yarnpkg.com/uid-number/-/uid-number-0.0.6.tgz#0ea10e8035e8eb5b8e4449f06da1c730663baa81"
@@ -21053,7 +21067,7 @@ vue-template-compiler@^2.6.3:
     de-indent "^1.0.2"
     he "^1.1.0"
 
-vue-template-es2015-compiler@^1.8.2:
+vue-template-es2015-compiler@^1.6.0:
   version "1.9.1"
   resolved "https://registry.yarnpkg.com/vue-template-es2015-compiler/-/vue-template-es2015-compiler-1.9.1.tgz#1ee3bc9a16ecbf5118be334bb15f9c46f82f5825"
   integrity sha512-4gDntzrifFnCEvyoO8PqyJDmguXgVPxKiIxrBKjIowvL9l+N66196+72XVYR8BBf1Uv1Fgt3bGevJ+sEmxfZzw==

From 163aa5b5f386f3ad07d27f2112c82185c150c8fa Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Thu, 28 Feb 2019 01:31:03 +0800
Subject: [PATCH 098/249] v5.0.0-rc.7

---
 addons/a11y/package.json                      | 12 ++---
 addons/actions/package.json                   | 10 ++--
 addons/backgrounds/package.json               | 12 ++---
 addons/centered/package.json                  |  2 +-
 addons/cssresources/package.json              | 10 ++--
 addons/events/package.json                    |  8 +--
 addons/google-analytics/package.json          |  6 +--
 addons/graphql/package.json                   |  2 +-
 addons/info/package.json                      | 10 ++--
 addons/jest/package.json                      | 10 ++--
 addons/knobs/package.json                     | 10 ++--
 addons/links/package.json                     |  6 +--
 addons/notes/package.json                     | 12 ++---
 addons/ondevice-backgrounds/package.json      |  4 +-
 addons/ondevice-knobs/package.json            |  4 +-
 addons/ondevice-notes/package.json            |  4 +-
 addons/options/package.json                   |  4 +-
 .../storyshots/storyshots-core/package.json   |  4 +-
 .../storyshots-puppeteer/package.json         |  6 +--
 addons/storysource/package.json               | 10 ++--
 addons/viewport/package.json                  | 12 ++---
 app/angular/package.json                      |  6 +--
 app/ember/package.json                        |  4 +-
 app/html/package.json                         |  4 +-
 app/marko/package.json                        |  4 +-
 app/mithril/package.json                      |  4 +-
 app/polymer/package.json                      |  4 +-
 app/preact/package.json                       |  4 +-
 app/react-native/package.json                 | 14 ++---
 app/react/package.json                        |  8 +--
 app/riot/package.json                         |  4 +-
 app/svelte/package.json                       |  4 +-
 app/vue/package.json                          |  4 +-
 examples/angular-cli/package.json             | 26 ++++-----
 examples/cra-kitchen-sink/package.json        | 32 +++++------
 examples/cra-ts-kitchen-sink/package.json     | 12 ++---
 examples/ember-cli/package.json               | 26 ++++-----
 examples/html-kitchen-sink/package.json       | 36 ++++++-------
 examples/marko-cli/package.json               | 14 ++---
 examples/mithril-kitchen-sink/package.json    | 26 ++++-----
 examples/official-storybook/package.json      | 48 ++++++++---------
 examples/polymer-cli/package.json             | 20 +++----
 examples/preact-kitchen-sink/package.json     | 26 ++++-----
 examples/riot-kitchen-sink/package.json       | 26 ++++-----
 examples/svelte-kitchen-sink/package.json     | 26 ++++-----
 examples/vue-kitchen-sink/package.json        | 26 ++++-----
 lerna.json                                    |  2 +-
 lib/addons/package.json                       |  6 +--
 lib/channel-postmessage/package.json          |  6 +--
 lib/channel-websocket/package.json            |  4 +-
 lib/channels/package.json                     |  2 +-
 lib/cli/package.json                          | 54 +++++++++----------
 lib/client-api/package.json                   | 10 ++--
 lib/client-logger/package.json                |  2 +-
 lib/codemod/package.json                      |  2 +-
 lib/components/package.json                   | 12 ++---
 lib/core-events/package.json                  |  2 +-
 lib/core/package.json                         | 20 +++----
 lib/node-logger/package.json                  |  2 +-
 lib/router/package.json                       |  4 +-
 lib/theming/package.json                      |  4 +-
 lib/ui/package.json                           | 14 ++---
 62 files changed, 356 insertions(+), 356 deletions(-)

diff --git a/addons/a11y/package.json b/addons/a11y/package.json
index 05cdd93127a..3f6b3032d6c 100644
--- a/addons/a11y/package.json
+++ b/addons/a11y/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-a11y",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "a11y addon for storybook",
   "keywords": [
     "a11y",
@@ -25,11 +25,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.6",
-    "@storybook/client-logger": "5.0.0-rc.6",
-    "@storybook/components": "5.0.0-rc.6",
-    "@storybook/core-events": "5.0.0-rc.6",
-    "@storybook/theming": "5.0.0-rc.6",
+    "@storybook/addons": "5.0.0-rc.7",
+    "@storybook/client-logger": "5.0.0-rc.7",
+    "@storybook/components": "5.0.0-rc.7",
+    "@storybook/core-events": "5.0.0-rc.7",
+    "@storybook/theming": "5.0.0-rc.7",
     "axe-core": "^3.1.2",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
diff --git a/addons/actions/package.json b/addons/actions/package.json
index 0e6e860beda..5de7294b815 100644
--- a/addons/actions/package.json
+++ b/addons/actions/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-actions",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "Action Logger addon for storybook",
   "keywords": [
     "storybook"
@@ -20,10 +20,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.6",
-    "@storybook/components": "5.0.0-rc.6",
-    "@storybook/core-events": "5.0.0-rc.6",
-    "@storybook/theming": "5.0.0-rc.6",
+    "@storybook/addons": "5.0.0-rc.7",
+    "@storybook/components": "5.0.0-rc.7",
+    "@storybook/core-events": "5.0.0-rc.7",
+    "@storybook/theming": "5.0.0-rc.7",
     "core-js": "^2.6.2",
     "fast-deep-equal": "^2.0.1",
     "global": "^4.3.2",
diff --git a/addons/backgrounds/package.json b/addons/backgrounds/package.json
index 42025cc1f81..f89f679dc17 100644
--- a/addons/backgrounds/package.json
+++ b/addons/backgrounds/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-backgrounds",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "A storybook addon to show different backgrounds for your preview",
   "keywords": [
     "addon",
@@ -24,11 +24,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.6",
-    "@storybook/client-logger": "5.0.0-rc.6",
-    "@storybook/components": "5.0.0-rc.6",
-    "@storybook/core-events": "5.0.0-rc.6",
-    "@storybook/theming": "5.0.0-rc.6",
+    "@storybook/addons": "5.0.0-rc.7",
+    "@storybook/client-logger": "5.0.0-rc.7",
+    "@storybook/components": "5.0.0-rc.7",
+    "@storybook/core-events": "5.0.0-rc.7",
+    "@storybook/theming": "5.0.0-rc.7",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
diff --git a/addons/centered/package.json b/addons/centered/package.json
index 99da816e144..664c19e706b 100644
--- a/addons/centered/package.json
+++ b/addons/centered/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-centered",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "Storybook decorator to center components",
   "keywords": [
     "addon",
diff --git a/addons/cssresources/package.json b/addons/cssresources/package.json
index 776008d9f45..efd3c89931b 100644
--- a/addons/cssresources/package.json
+++ b/addons/cssresources/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-cssresources",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "A storybook addon to switch between css resources at runtime for your story",
   "keywords": [
     "addon",
@@ -24,10 +24,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.6",
-    "@storybook/channels": "5.0.0-rc.6",
-    "@storybook/components": "5.0.0-rc.6",
-    "@storybook/core-events": "5.0.0-rc.6",
+    "@storybook/addons": "5.0.0-rc.7",
+    "@storybook/channels": "5.0.0-rc.7",
+    "@storybook/components": "5.0.0-rc.7",
+    "@storybook/core-events": "5.0.0-rc.7",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "prop-types": "^15.6.2",
diff --git a/addons/events/package.json b/addons/events/package.json
index 5e73d21097a..69b14c1b80a 100644
--- a/addons/events/package.json
+++ b/addons/events/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-events",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "Add events to your Storybook stories.",
   "keywords": [
     "addon",
@@ -23,9 +23,9 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.6",
-    "@storybook/core-events": "5.0.0-rc.6",
-    "@storybook/theming": "5.0.0-rc.6",
+    "@storybook/addons": "5.0.0-rc.7",
+    "@storybook/core-events": "5.0.0-rc.7",
+    "@storybook/theming": "5.0.0-rc.7",
     "core-js": "^2.6.2",
     "format-json": "^1.0.3",
     "prop-types": "^15.6.2",
diff --git a/addons/google-analytics/package.json b/addons/google-analytics/package.json
index 4ce7bc28dcc..5933d1f6f1b 100644
--- a/addons/google-analytics/package.json
+++ b/addons/google-analytics/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-google-analytics",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "Storybook addon for google analytics",
   "keywords": [
     "addon",
@@ -19,8 +19,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.6",
-    "@storybook/core-events": "5.0.0-rc.6",
+    "@storybook/addons": "5.0.0-rc.7",
+    "@storybook/core-events": "5.0.0-rc.7",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "react-ga": "^2.5.3"
diff --git a/addons/graphql/package.json b/addons/graphql/package.json
index 3a9d79a448b..500dbf405e9 100644
--- a/addons/graphql/package.json
+++ b/addons/graphql/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-graphql",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "Storybook addon to display the GraphiQL IDE",
   "keywords": [
     "addon",
diff --git a/addons/info/package.json b/addons/info/package.json
index d57de0c3fb1..8d5de63cf79 100644
--- a/addons/info/package.json
+++ b/addons/info/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-info",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "A Storybook addon to show additional information for your stories.",
   "keywords": [
     "addon",
@@ -21,10 +21,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.6",
-    "@storybook/client-logger": "5.0.0-rc.6",
-    "@storybook/components": "5.0.0-rc.6",
-    "@storybook/theming": "5.0.0-rc.6",
+    "@storybook/addons": "5.0.0-rc.7",
+    "@storybook/client-logger": "5.0.0-rc.7",
+    "@storybook/components": "5.0.0-rc.7",
+    "@storybook/theming": "5.0.0-rc.7",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "marksy": "^6.1.0",
diff --git a/addons/jest/package.json b/addons/jest/package.json
index 59306e838a2..fff0a04ed35 100644
--- a/addons/jest/package.json
+++ b/addons/jest/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-jest",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "React storybook addon that show component jest report",
   "keywords": [
     "addon",
@@ -27,10 +27,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.6",
-    "@storybook/components": "5.0.0-rc.6",
-    "@storybook/core-events": "5.0.0-rc.6",
-    "@storybook/theming": "5.0.0-rc.6",
+    "@storybook/addons": "5.0.0-rc.7",
+    "@storybook/components": "5.0.0-rc.7",
+    "@storybook/core-events": "5.0.0-rc.7",
+    "@storybook/theming": "5.0.0-rc.7",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "prop-types": "^15.6.2",
diff --git a/addons/knobs/package.json b/addons/knobs/package.json
index b0ea3a68a11..e7a7bc741f7 100644
--- a/addons/knobs/package.json
+++ b/addons/knobs/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-knobs",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "Storybook Addon Prop Editor Component",
   "keywords": [
     "addon",
@@ -21,10 +21,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.6",
-    "@storybook/components": "5.0.0-rc.6",
-    "@storybook/core-events": "5.0.0-rc.6",
-    "@storybook/theming": "5.0.0-rc.6",
+    "@storybook/addons": "5.0.0-rc.7",
+    "@storybook/components": "5.0.0-rc.7",
+    "@storybook/core-events": "5.0.0-rc.7",
+    "@storybook/theming": "5.0.0-rc.7",
     "copy-to-clipboard": "^3.0.8",
     "core-js": "^2.6.2",
     "escape-html": "^1.0.3",
diff --git a/addons/links/package.json b/addons/links/package.json
index 2f33e1cf9cb..03c9af48ad6 100644
--- a/addons/links/package.json
+++ b/addons/links/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-links",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "Story Links addon for storybook",
   "keywords": [
     "addon",
@@ -21,8 +21,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.6",
-    "@storybook/core-events": "5.0.0-rc.6",
+    "@storybook/addons": "5.0.0-rc.7",
+    "@storybook/core-events": "5.0.0-rc.7",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/addons/notes/package.json b/addons/notes/package.json
index b8ebabc14d0..0520b7210ec 100644
--- a/addons/notes/package.json
+++ b/addons/notes/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-notes",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "Write notes for your Storybook stories.",
   "keywords": [
     "addon",
@@ -22,11 +22,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.6",
-    "@storybook/client-logger": "5.0.0-rc.6",
-    "@storybook/components": "5.0.0-rc.6",
-    "@storybook/core-events": "5.0.0-rc.6",
-    "@storybook/theming": "5.0.0-rc.6",
+    "@storybook/addons": "5.0.0-rc.7",
+    "@storybook/client-logger": "5.0.0-rc.7",
+    "@storybook/components": "5.0.0-rc.7",
+    "@storybook/core-events": "5.0.0-rc.7",
+    "@storybook/theming": "5.0.0-rc.7",
     "markdown-to-jsx": "^6.9.1",
     "prop-types": "^15.6.2",
     "util-deprecate": "^1.0.2"
diff --git a/addons/ondevice-backgrounds/package.json b/addons/ondevice-backgrounds/package.json
index 447cef3a4b9..c73d39a5c7e 100644
--- a/addons/ondevice-backgrounds/package.json
+++ b/addons/ondevice-backgrounds/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/addon-ondevice-backgrounds",
   "private": true,
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "A storybook addon to show different backgrounds for your preview",
   "keywords": [
     "addon",
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.6",
+    "@storybook/addons": "5.0.0-rc.7",
     "core-js": "^2.6.2",
     "prop-types": "^15.6.2"
   },
diff --git a/addons/ondevice-knobs/package.json b/addons/ondevice-knobs/package.json
index d363f320e32..c8261f12471 100644
--- a/addons/ondevice-knobs/package.json
+++ b/addons/ondevice-knobs/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/addon-ondevice-knobs",
   "private": true,
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "Display storybook story knobs on your deviced.",
   "keywords": [
     "addon",
@@ -21,7 +21,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.6",
+    "@storybook/addons": "5.0.0-rc.7",
     "core-js": "^2.6.2",
     "deep-equal": "^1.0.1",
     "prop-types": "^15.6.2",
diff --git a/addons/ondevice-notes/package.json b/addons/ondevice-notes/package.json
index 85943398f45..7fb6c333b76 100644
--- a/addons/ondevice-notes/package.json
+++ b/addons/ondevice-notes/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/addon-ondevice-notes",
   "private": true,
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "Write notes for your Storybook stories.",
   "keywords": [
     "addon",
@@ -19,7 +19,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.6",
+    "@storybook/addons": "5.0.0-rc.7",
     "core-js": "^2.6.2",
     "prop-types": "^15.6.2",
     "react-native-simple-markdown": "^1.1.0"
diff --git a/addons/options/package.json b/addons/options/package.json
index 9bdb8e3692a..9778c01f123 100644
--- a/addons/options/package.json
+++ b/addons/options/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-options",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "Options addon for storybook",
   "keywords": [
     "addon",
@@ -20,7 +20,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.6",
+    "@storybook/addons": "5.0.0-rc.7",
     "core-js": "^2.6.2",
     "util-deprecate": "^1.0.2"
   },
diff --git a/addons/storyshots/storyshots-core/package.json b/addons/storyshots/storyshots-core/package.json
index 2baddc34277..354ec17e1c2 100644
--- a/addons/storyshots/storyshots-core/package.json
+++ b/addons/storyshots/storyshots-core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storyshots",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "StoryShots is a Jest Snapshot Testing Addon for Storybook.",
   "keywords": [
     "addon",
@@ -24,7 +24,7 @@
     "storybook": "start-storybook -p 6006"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.6",
+    "@storybook/addons": "5.0.0-rc.7",
     "core-js": "^2.6.2",
     "glob": "^7.1.3",
     "global": "^4.3.2",
diff --git a/addons/storyshots/storyshots-puppeteer/package.json b/addons/storyshots/storyshots-puppeteer/package.json
index f030e4d91b3..f13e3cabb25 100644
--- a/addons/storyshots/storyshots-puppeteer/package.json
+++ b/addons/storyshots/storyshots-puppeteer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storyshots-puppeteer",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "Image snappshots addition to StoryShots base on puppeteer",
   "keywords": [
     "addon",
@@ -21,8 +21,8 @@
     "prepare": "node ../../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/node-logger": "5.0.0-rc.6",
-    "@storybook/router": "5.0.0-rc.6",
+    "@storybook/node-logger": "5.0.0-rc.7",
+    "@storybook/router": "5.0.0-rc.7",
     "core-js": "^2.6.2",
     "jest-image-snapshot": "^2.6.0",
     "puppeteer": "^1.12.0",
diff --git a/addons/storysource/package.json b/addons/storysource/package.json
index a38ea95c349..4cdcc43025a 100644
--- a/addons/storysource/package.json
+++ b/addons/storysource/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storysource",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "Stories addon for storybook",
   "keywords": [
     "addon",
@@ -21,10 +21,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.6",
-    "@storybook/components": "5.0.0-rc.6",
-    "@storybook/router": "5.0.0-rc.6",
-    "@storybook/theming": "5.0.0-rc.6",
+    "@storybook/addons": "5.0.0-rc.7",
+    "@storybook/components": "5.0.0-rc.7",
+    "@storybook/router": "5.0.0-rc.7",
+    "@storybook/theming": "5.0.0-rc.7",
     "core-js": "^2.6.2",
     "estraverse": "^4.2.0",
     "loader-utils": "^1.2.1",
diff --git a/addons/viewport/package.json b/addons/viewport/package.json
index 23fbd8ce711..a119d997c3f 100644
--- a/addons/viewport/package.json
+++ b/addons/viewport/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-viewport",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "Storybook addon to change the viewport size to mobile",
   "keywords": [
     "addon",
@@ -20,11 +20,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.6",
-    "@storybook/client-logger": "5.0.0-rc.6",
-    "@storybook/components": "5.0.0-rc.6",
-    "@storybook/core-events": "5.0.0-rc.6",
-    "@storybook/theming": "5.0.0-rc.6",
+    "@storybook/addons": "5.0.0-rc.7",
+    "@storybook/client-logger": "5.0.0-rc.7",
+    "@storybook/components": "5.0.0-rc.7",
+    "@storybook/core-events": "5.0.0-rc.7",
+    "@storybook/theming": "5.0.0-rc.7",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
diff --git a/app/angular/package.json b/app/angular/package.json
index 994d5e52b05..95fadb44544 100644
--- a/app/angular/package.json
+++ b/app/angular/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/angular",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "Storybook for Angular: Develop Angular Components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,8 +25,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.6",
-    "@storybook/node-logger": "5.0.0-rc.6",
+    "@storybook/core": "5.0.0-rc.7",
+    "@storybook/node-logger": "5.0.0-rc.7",
     "angular2-template-loader": "^0.6.2",
     "core-js": "^2.6.2",
     "fork-ts-checker-webpack-plugin": "^0.5.2",
diff --git a/app/ember/package.json b/app/ember/package.json
index f617a752b6f..9e95944e084 100644
--- a/app/ember/package.json
+++ b/app/ember/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/ember",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "Storybook for Ember: Develop Ember Component in isolation with Hot Reloading.",
   "homepage": "https://github.com/storybooks/storybook/tree/master/app/ember",
   "bugs": {
@@ -23,7 +23,7 @@
   },
   "dependencies": {
     "@ember/test-helpers": "^1.3.1",
-    "@storybook/core": "5.0.0-rc.6",
+    "@storybook/core": "5.0.0-rc.7",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/html/package.json b/app/html/package.json
index d1d624b53db..85ebb9220eb 100644
--- a/app/html/package.json
+++ b/app/html/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/html",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "Storybook for HTML: View HTML snippets in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.6",
+    "@storybook/core": "5.0.0-rc.7",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/marko/package.json b/app/marko/package.json
index fc38d2016cd..c5191b6e5de 100644
--- a/app/marko/package.json
+++ b/app/marko/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/marko",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "Storybook for Marko: Develop Marko Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.6",
+    "@storybook/core": "5.0.0-rc.7",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/mithril/package.json b/app/mithril/package.json
index 20f56ad4fac..8785c72b9db 100644
--- a/app/mithril/package.json
+++ b/app/mithril/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/mithril",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "Storybook for Mithril: Develop Mithril Component in isolation.",
   "keywords": [
     "storybook"
@@ -26,7 +26,7 @@
   },
   "dependencies": {
     "@babel/plugin-transform-react-jsx": "^7.3.0",
-    "@storybook/core": "5.0.0-rc.6",
+    "@storybook/core": "5.0.0-rc.7",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/polymer/package.json b/app/polymer/package.json
index e534591af7b..6e5dec11786 100644
--- a/app/polymer/package.json
+++ b/app/polymer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/polymer",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "Storybook for Polymer: Develop Polymer components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.6",
+    "@storybook/core": "5.0.0-rc.7",
     "@webcomponents/webcomponentsjs": "^1.2.0",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
diff --git a/app/preact/package.json b/app/preact/package.json
index 24aeb4f6821..e7e346a76e4 100644
--- a/app/preact/package.json
+++ b/app/preact/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/preact",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "Storybook for Preact: Develop Preact Component in isolation.",
   "keywords": [
     "storybook"
@@ -26,7 +26,7 @@
   },
   "dependencies": {
     "@babel/plugin-transform-react-jsx": "^7.3.0",
-    "@storybook/core": "5.0.0-rc.6",
+    "@storybook/core": "5.0.0-rc.7",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/react-native/package.json b/app/react-native/package.json
index 6898373cb0e..672f893fd4d 100644
--- a/app/react-native/package.json
+++ b/app/react-native/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/react-native",
   "private": true,
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "A better way to develop React Native Components for your app",
   "keywords": [
     "react",
@@ -26,12 +26,12 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.6",
-    "@storybook/channel-websocket": "5.0.0-rc.6",
-    "@storybook/channels": "5.0.0-rc.6",
-    "@storybook/core": "5.0.0-rc.6",
-    "@storybook/core-events": "5.0.0-rc.6",
-    "@storybook/ui": "5.0.0-rc.6",
+    "@storybook/addons": "5.0.0-rc.7",
+    "@storybook/channel-websocket": "5.0.0-rc.7",
+    "@storybook/channels": "5.0.0-rc.7",
+    "@storybook/core": "5.0.0-rc.7",
+    "@storybook/core-events": "5.0.0-rc.7",
+    "@storybook/ui": "5.0.0-rc.7",
     "babel-loader": "^8.0.4",
     "babel-plugin-macros": "^2.4.5",
     "babel-plugin-syntax-async-functions": "^6.13.0",
diff --git a/app/react/package.json b/app/react/package.json
index d890b4da7c6..9faf4d27118 100644
--- a/app/react/package.json
+++ b/app/react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/react",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "Storybook for React: Develop React Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -28,9 +28,9 @@
     "@babel/plugin-transform-react-constant-elements": "^7.2.0",
     "@babel/preset-flow": "^7.0.0",
     "@babel/preset-react": "^7.0.0",
-    "@storybook/core": "5.0.0-rc.6",
-    "@storybook/node-logger": "5.0.0-rc.6",
-    "@storybook/theming": "5.0.0-rc.6",
+    "@storybook/core": "5.0.0-rc.7",
+    "@storybook/node-logger": "5.0.0-rc.7",
+    "@storybook/theming": "5.0.0-rc.7",
     "@svgr/webpack": "^4.0.3",
     "babel-plugin-named-asset-import": "^0.3.0",
     "babel-plugin-react-docgen": "^2.0.2",
diff --git a/app/riot/package.json b/app/riot/package.json
index 3be591a0117..7ba3ab7cd84 100644
--- a/app/riot/package.json
+++ b/app/riot/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/riot",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "Storybook for riot.js: View riot snippets in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.6",
+    "@storybook/core": "5.0.0-rc.7",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/svelte/package.json b/app/svelte/package.json
index 40bfaf4386d..9043f07198a 100644
--- a/app/svelte/package.json
+++ b/app/svelte/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/svelte",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "Storybook for Svelte: Develop Svelte Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.6",
+    "@storybook/core": "5.0.0-rc.7",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/vue/package.json b/app/vue/package.json
index a48c3ad6eef..22ee6076d28 100644
--- a/app/vue/package.json
+++ b/app/vue/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/vue",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "Storybook for Vue: Develop Vue Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.6",
+    "@storybook/core": "5.0.0-rc.7",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/examples/angular-cli/package.json b/examples/angular-cli/package.json
index 0f09000643e..6ccf4465590 100644
--- a/examples/angular-cli/package.json
+++ b/examples/angular-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "angular-cli",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "private": true,
   "license": "MIT",
   "scripts": {
@@ -33,18 +33,18 @@
     "@angular-devkit/build-angular": "^0.13.1",
     "@angular/cli": "^7.3.2",
     "@angular/compiler-cli": "^7.2.1",
-    "@storybook/addon-actions": "5.0.0-rc.6",
-    "@storybook/addon-backgrounds": "5.0.0-rc.6",
-    "@storybook/addon-centered": "5.0.0-rc.6",
-    "@storybook/addon-jest": "5.0.0-rc.6",
-    "@storybook/addon-knobs": "5.0.0-rc.6",
-    "@storybook/addon-links": "5.0.0-rc.6",
-    "@storybook/addon-notes": "5.0.0-rc.6",
-    "@storybook/addon-options": "5.0.0-rc.6",
-    "@storybook/addon-storyshots": "5.0.0-rc.6",
-    "@storybook/addon-storysource": "5.0.0-rc.6",
-    "@storybook/addons": "5.0.0-rc.6",
-    "@storybook/angular": "5.0.0-rc.6",
+    "@storybook/addon-actions": "5.0.0-rc.7",
+    "@storybook/addon-backgrounds": "5.0.0-rc.7",
+    "@storybook/addon-centered": "5.0.0-rc.7",
+    "@storybook/addon-jest": "5.0.0-rc.7",
+    "@storybook/addon-knobs": "5.0.0-rc.7",
+    "@storybook/addon-links": "5.0.0-rc.7",
+    "@storybook/addon-notes": "5.0.0-rc.7",
+    "@storybook/addon-options": "5.0.0-rc.7",
+    "@storybook/addon-storyshots": "5.0.0-rc.7",
+    "@storybook/addon-storysource": "5.0.0-rc.7",
+    "@storybook/addons": "5.0.0-rc.7",
+    "@storybook/angular": "5.0.0-rc.7",
     "@types/core-js": "^2.5.0",
     "@types/jest": "^23.3.13",
     "@types/node": "~10.12.19",
diff --git a/examples/cra-kitchen-sink/package.json b/examples/cra-kitchen-sink/package.json
index 986e07e2066..df417600274 100644
--- a/examples/cra-kitchen-sink/package.json
+++ b/examples/cra-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "cra-kitchen-sink",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "private": true,
   "scripts": {
     "build": "react-scripts build",
@@ -18,21 +18,21 @@
     "react-lifecycles-compat": "^3.0.4"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.0.0-rc.6",
-    "@storybook/addon-actions": "5.0.0-rc.6",
-    "@storybook/addon-backgrounds": "5.0.0-rc.6",
-    "@storybook/addon-centered": "5.0.0-rc.6",
-    "@storybook/addon-events": "5.0.0-rc.6",
-    "@storybook/addon-info": "5.0.0-rc.6",
-    "@storybook/addon-jest": "5.0.0-rc.6",
-    "@storybook/addon-knobs": "5.0.0-rc.6",
-    "@storybook/addon-links": "5.0.0-rc.6",
-    "@storybook/addon-notes": "5.0.0-rc.6",
-    "@storybook/addon-options": "5.0.0-rc.6",
-    "@storybook/addon-storyshots": "5.0.0-rc.6",
-    "@storybook/addons": "5.0.0-rc.6",
-    "@storybook/client-logger": "5.0.0-rc.6",
-    "@storybook/react": "5.0.0-rc.6",
+    "@storybook/addon-a11y": "5.0.0-rc.7",
+    "@storybook/addon-actions": "5.0.0-rc.7",
+    "@storybook/addon-backgrounds": "5.0.0-rc.7",
+    "@storybook/addon-centered": "5.0.0-rc.7",
+    "@storybook/addon-events": "5.0.0-rc.7",
+    "@storybook/addon-info": "5.0.0-rc.7",
+    "@storybook/addon-jest": "5.0.0-rc.7",
+    "@storybook/addon-knobs": "5.0.0-rc.7",
+    "@storybook/addon-links": "5.0.0-rc.7",
+    "@storybook/addon-notes": "5.0.0-rc.7",
+    "@storybook/addon-options": "5.0.0-rc.7",
+    "@storybook/addon-storyshots": "5.0.0-rc.7",
+    "@storybook/addons": "5.0.0-rc.7",
+    "@storybook/client-logger": "5.0.0-rc.7",
+    "@storybook/react": "5.0.0-rc.7",
     "enzyme": "^3.7.0",
     "enzyme-adapter-react-16": "^1.9.1",
     "enzyme-to-json": "^3.3.4",
diff --git a/examples/cra-ts-kitchen-sink/package.json b/examples/cra-ts-kitchen-sink/package.json
index 01c29733214..093c2823782 100644
--- a/examples/cra-ts-kitchen-sink/package.json
+++ b/examples/cra-ts-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "cra-ts-kitchen-sink",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook -s public",
@@ -19,11 +19,11 @@
     "react-dom": "^16.8.1"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.6",
-    "@storybook/addon-info": "5.0.0-rc.6",
-    "@storybook/addon-options": "5.0.0-rc.6",
-    "@storybook/addons": "5.0.0-rc.6",
-    "@storybook/react": "5.0.0-rc.6",
+    "@storybook/addon-actions": "5.0.0-rc.7",
+    "@storybook/addon-info": "5.0.0-rc.7",
+    "@storybook/addon-options": "5.0.0-rc.7",
+    "@storybook/addons": "5.0.0-rc.7",
+    "@storybook/react": "5.0.0-rc.7",
     "@types/enzyme": "^3.1.15",
     "@types/react": "^16.7.22",
     "@types/react-dom": "^16.0.11",
diff --git a/examples/ember-cli/package.json b/examples/ember-cli/package.json
index fd34f24989d..6a83e56b644 100644
--- a/examples/ember-cli/package.json
+++ b/examples/ember-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "ember-example",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "private": true,
   "scripts": {
     "build": "ember build",
@@ -14,18 +14,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.2.2",
-    "@storybook/addon-a11y": "5.0.0-rc.6",
-    "@storybook/addon-actions": "5.0.0-rc.6",
-    "@storybook/addon-backgrounds": "5.0.0-rc.6",
-    "@storybook/addon-centered": "5.0.0-rc.6",
-    "@storybook/addon-knobs": "5.0.0-rc.6",
-    "@storybook/addon-links": "5.0.0-rc.6",
-    "@storybook/addon-notes": "5.0.0-rc.6",
-    "@storybook/addon-options": "5.0.0-rc.6",
-    "@storybook/addon-storysource": "5.0.0-rc.6",
-    "@storybook/addon-viewport": "5.0.0-rc.6",
-    "@storybook/addons": "5.0.0-rc.6",
-    "@storybook/ember": "5.0.0-rc.6",
+    "@storybook/addon-a11y": "5.0.0-rc.7",
+    "@storybook/addon-actions": "5.0.0-rc.7",
+    "@storybook/addon-backgrounds": "5.0.0-rc.7",
+    "@storybook/addon-centered": "5.0.0-rc.7",
+    "@storybook/addon-knobs": "5.0.0-rc.7",
+    "@storybook/addon-links": "5.0.0-rc.7",
+    "@storybook/addon-notes": "5.0.0-rc.7",
+    "@storybook/addon-options": "5.0.0-rc.7",
+    "@storybook/addon-storysource": "5.0.0-rc.7",
+    "@storybook/addon-viewport": "5.0.0-rc.7",
+    "@storybook/addons": "5.0.0-rc.7",
+    "@storybook/ember": "5.0.0-rc.7",
     "babel-loader": "^8",
     "broccoli-asset-rev": "^3.0.0",
     "cross-env": "^5.2.0",
diff --git a/examples/html-kitchen-sink/package.json b/examples/html-kitchen-sink/package.json
index 8b3dc974f9d..2367df64363 100644
--- a/examples/html-kitchen-sink/package.json
+++ b/examples/html-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "html-kitchen-sink",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "private": true,
   "description": "",
   "keywords": [],
@@ -13,23 +13,23 @@
     "storybook": "start-storybook -p 9006"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.0.0-rc.6",
-    "@storybook/addon-actions": "5.0.0-rc.6",
-    "@storybook/addon-backgrounds": "5.0.0-rc.6",
-    "@storybook/addon-centered": "5.0.0-rc.6",
-    "@storybook/addon-events": "5.0.0-rc.6",
-    "@storybook/addon-jest": "5.0.0-rc.6",
-    "@storybook/addon-knobs": "5.0.0-rc.6",
-    "@storybook/addon-links": "5.0.0-rc.6",
-    "@storybook/addon-notes": "5.0.0-rc.6",
-    "@storybook/addon-options": "5.0.0-rc.6",
-    "@storybook/addon-storyshots": "5.0.0-rc.6",
-    "@storybook/addon-storysource": "5.0.0-rc.6",
-    "@storybook/addon-viewport": "5.0.0-rc.6",
-    "@storybook/addons": "5.0.0-rc.6",
-    "@storybook/core": "5.0.0-rc.6",
-    "@storybook/core-events": "5.0.0-rc.6",
-    "@storybook/html": "5.0.0-rc.6",
+    "@storybook/addon-a11y": "5.0.0-rc.7",
+    "@storybook/addon-actions": "5.0.0-rc.7",
+    "@storybook/addon-backgrounds": "5.0.0-rc.7",
+    "@storybook/addon-centered": "5.0.0-rc.7",
+    "@storybook/addon-events": "5.0.0-rc.7",
+    "@storybook/addon-jest": "5.0.0-rc.7",
+    "@storybook/addon-knobs": "5.0.0-rc.7",
+    "@storybook/addon-links": "5.0.0-rc.7",
+    "@storybook/addon-notes": "5.0.0-rc.7",
+    "@storybook/addon-options": "5.0.0-rc.7",
+    "@storybook/addon-storyshots": "5.0.0-rc.7",
+    "@storybook/addon-storysource": "5.0.0-rc.7",
+    "@storybook/addon-viewport": "5.0.0-rc.7",
+    "@storybook/addons": "5.0.0-rc.7",
+    "@storybook/core": "5.0.0-rc.7",
+    "@storybook/core-events": "5.0.0-rc.7",
+    "@storybook/html": "5.0.0-rc.7",
     "eventemitter3": "^3.1.0",
     "format-json": "^1.0.3",
     "global": "^4.3.2",
diff --git a/examples/marko-cli/package.json b/examples/marko-cli/package.json
index 2570da29c49..9f4c816f18a 100644
--- a/examples/marko-cli/package.json
+++ b/examples/marko-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "marko-cli",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "private": true,
   "description": "Demo of how to build an app using marko-starter",
   "repository": {
@@ -22,12 +22,12 @@
     "marko-starter": "^2.0.4"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.6",
-    "@storybook/addon-knobs": "5.0.0-rc.6",
-    "@storybook/addon-options": "5.0.0-rc.6",
-    "@storybook/addon-storysource": "5.0.0-rc.6",
-    "@storybook/addons": "5.0.0-rc.6",
-    "@storybook/marko": "5.0.0-rc.6",
+    "@storybook/addon-actions": "5.0.0-rc.7",
+    "@storybook/addon-knobs": "5.0.0-rc.7",
+    "@storybook/addon-options": "5.0.0-rc.7",
+    "@storybook/addon-storysource": "5.0.0-rc.7",
+    "@storybook/addons": "5.0.0-rc.7",
+    "@storybook/marko": "5.0.0-rc.7",
     "prettier": "^1.16.4",
     "webpack": "^4.29.0"
   }
diff --git a/examples/mithril-kitchen-sink/package.json b/examples/mithril-kitchen-sink/package.json
index 3fc97368264..38778c8a1e8 100644
--- a/examples/mithril-kitchen-sink/package.json
+++ b/examples/mithril-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "mithril-example",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook",
@@ -10,18 +10,18 @@
     "mithril": "^1.1.6"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.6",
-    "@storybook/addon-backgrounds": "5.0.0-rc.6",
-    "@storybook/addon-centered": "5.0.0-rc.6",
-    "@storybook/addon-knobs": "5.0.0-rc.6",
-    "@storybook/addon-links": "5.0.0-rc.6",
-    "@storybook/addon-notes": "5.0.0-rc.6",
-    "@storybook/addon-options": "5.0.0-rc.6",
-    "@storybook/addon-storyshots": "5.0.0-rc.6",
-    "@storybook/addon-storysource": "5.0.0-rc.6",
-    "@storybook/addon-viewport": "5.0.0-rc.6",
-    "@storybook/addons": "5.0.0-rc.6",
-    "@storybook/mithril": "5.0.0-rc.6",
+    "@storybook/addon-actions": "5.0.0-rc.7",
+    "@storybook/addon-backgrounds": "5.0.0-rc.7",
+    "@storybook/addon-centered": "5.0.0-rc.7",
+    "@storybook/addon-knobs": "5.0.0-rc.7",
+    "@storybook/addon-links": "5.0.0-rc.7",
+    "@storybook/addon-notes": "5.0.0-rc.7",
+    "@storybook/addon-options": "5.0.0-rc.7",
+    "@storybook/addon-storyshots": "5.0.0-rc.7",
+    "@storybook/addon-storysource": "5.0.0-rc.7",
+    "@storybook/addon-viewport": "5.0.0-rc.7",
+    "@storybook/addons": "5.0.0-rc.7",
+    "@storybook/mithril": "5.0.0-rc.7",
     "webpack": "^4.29.0"
   }
 }
diff --git a/examples/official-storybook/package.json b/examples/official-storybook/package.json
index 4ff4c07d4fa..cb3b56848a5 100644
--- a/examples/official-storybook/package.json
+++ b/examples/official-storybook/package.json
@@ -1,6 +1,6 @@
 {
   "name": "official-storybook",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook -c ./ -s built-storybooks",
@@ -12,29 +12,29 @@
     "storybook": "cross-env STORYBOOK_DISPLAY_WARNING=true DISPLAY_WARNING=true start-storybook -p 9011 -c ./ -s built-storybooks --no-dll"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.0.0-rc.6",
-    "@storybook/addon-actions": "5.0.0-rc.6",
-    "@storybook/addon-backgrounds": "5.0.0-rc.6",
-    "@storybook/addon-centered": "5.0.0-rc.6",
-    "@storybook/addon-cssresources": "5.0.0-rc.6",
-    "@storybook/addon-events": "5.0.0-rc.6",
-    "@storybook/addon-graphql": "5.0.0-rc.6",
-    "@storybook/addon-info": "5.0.0-rc.6",
-    "@storybook/addon-jest": "5.0.0-rc.6",
-    "@storybook/addon-knobs": "5.0.0-rc.6",
-    "@storybook/addon-links": "5.0.0-rc.6",
-    "@storybook/addon-notes": "5.0.0-rc.6",
-    "@storybook/addon-options": "5.0.0-rc.6",
-    "@storybook/addon-storyshots": "5.0.0-rc.6",
-    "@storybook/addon-storyshots-puppeteer": "5.0.0-rc.6",
-    "@storybook/addon-storysource": "5.0.0-rc.6",
-    "@storybook/addon-viewport": "5.0.0-rc.6",
-    "@storybook/addons": "5.0.0-rc.6",
-    "@storybook/components": "5.0.0-rc.6",
-    "@storybook/core-events": "5.0.0-rc.6",
-    "@storybook/node-logger": "5.0.0-rc.6",
-    "@storybook/react": "5.0.0-rc.6",
-    "@storybook/theming": "5.0.0-rc.6",
+    "@storybook/addon-a11y": "5.0.0-rc.7",
+    "@storybook/addon-actions": "5.0.0-rc.7",
+    "@storybook/addon-backgrounds": "5.0.0-rc.7",
+    "@storybook/addon-centered": "5.0.0-rc.7",
+    "@storybook/addon-cssresources": "5.0.0-rc.7",
+    "@storybook/addon-events": "5.0.0-rc.7",
+    "@storybook/addon-graphql": "5.0.0-rc.7",
+    "@storybook/addon-info": "5.0.0-rc.7",
+    "@storybook/addon-jest": "5.0.0-rc.7",
+    "@storybook/addon-knobs": "5.0.0-rc.7",
+    "@storybook/addon-links": "5.0.0-rc.7",
+    "@storybook/addon-notes": "5.0.0-rc.7",
+    "@storybook/addon-options": "5.0.0-rc.7",
+    "@storybook/addon-storyshots": "5.0.0-rc.7",
+    "@storybook/addon-storyshots-puppeteer": "5.0.0-rc.7",
+    "@storybook/addon-storysource": "5.0.0-rc.7",
+    "@storybook/addon-viewport": "5.0.0-rc.7",
+    "@storybook/addons": "5.0.0-rc.7",
+    "@storybook/components": "5.0.0-rc.7",
+    "@storybook/core-events": "5.0.0-rc.7",
+    "@storybook/node-logger": "5.0.0-rc.7",
+    "@storybook/react": "5.0.0-rc.7",
+    "@storybook/theming": "5.0.0-rc.7",
     "cors": "^2.8.4",
     "cross-env": "^5.2.0",
     "enzyme-to-json": "^3.3.4",
diff --git a/examples/polymer-cli/package.json b/examples/polymer-cli/package.json
index 70eb8e39f46..867fa5978db 100644
--- a/examples/polymer-cli/package.json
+++ b/examples/polymer-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "polymer-cli",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook",
@@ -9,15 +9,15 @@
   },
   "dependencies": {
     "@polymer/polymer": "^2.6.0",
-    "@storybook/addon-actions": "5.0.0-rc.6",
-    "@storybook/addon-backgrounds": "5.0.0-rc.6",
-    "@storybook/addon-knobs": "5.0.0-rc.6",
-    "@storybook/addon-links": "5.0.0-rc.6",
-    "@storybook/addon-notes": "5.0.0-rc.6",
-    "@storybook/addon-options": "5.0.0-rc.6",
-    "@storybook/addon-storysource": "5.0.0-rc.6",
-    "@storybook/addon-viewport": "5.0.0-rc.6",
-    "@storybook/polymer": "5.0.0-rc.6",
+    "@storybook/addon-actions": "5.0.0-rc.7",
+    "@storybook/addon-backgrounds": "5.0.0-rc.7",
+    "@storybook/addon-knobs": "5.0.0-rc.7",
+    "@storybook/addon-links": "5.0.0-rc.7",
+    "@storybook/addon-notes": "5.0.0-rc.7",
+    "@storybook/addon-options": "5.0.0-rc.7",
+    "@storybook/addon-storysource": "5.0.0-rc.7",
+    "@storybook/addon-viewport": "5.0.0-rc.7",
+    "@storybook/polymer": "5.0.0-rc.7",
     "@webcomponents/webcomponentsjs": "^1.2.0",
     "global": "^4.3.2",
     "lit-html": "^1.0.0",
diff --git a/examples/preact-kitchen-sink/package.json b/examples/preact-kitchen-sink/package.json
index 013ab9aee85..a5529c8f051 100644
--- a/examples/preact-kitchen-sink/package.json
+++ b/examples/preact-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "preact-example",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "private": true,
   "scripts": {
     "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
@@ -15,18 +15,18 @@
   "devDependencies": {
     "@babel/core": "^7.2.2",
     "@babel/plugin-transform-runtime": "^7.2.0",
-    "@storybook/addon-actions": "5.0.0-rc.6",
-    "@storybook/addon-backgrounds": "5.0.0-rc.6",
-    "@storybook/addon-centered": "5.0.0-rc.6",
-    "@storybook/addon-knobs": "5.0.0-rc.6",
-    "@storybook/addon-links": "5.0.0-rc.6",
-    "@storybook/addon-notes": "5.0.0-rc.6",
-    "@storybook/addon-options": "5.0.0-rc.6",
-    "@storybook/addon-storyshots": "5.0.0-rc.6",
-    "@storybook/addon-storysource": "5.0.0-rc.6",
-    "@storybook/addon-viewport": "5.0.0-rc.6",
-    "@storybook/addons": "5.0.0-rc.6",
-    "@storybook/preact": "5.0.0-rc.6",
+    "@storybook/addon-actions": "5.0.0-rc.7",
+    "@storybook/addon-backgrounds": "5.0.0-rc.7",
+    "@storybook/addon-centered": "5.0.0-rc.7",
+    "@storybook/addon-knobs": "5.0.0-rc.7",
+    "@storybook/addon-links": "5.0.0-rc.7",
+    "@storybook/addon-notes": "5.0.0-rc.7",
+    "@storybook/addon-options": "5.0.0-rc.7",
+    "@storybook/addon-storyshots": "5.0.0-rc.7",
+    "@storybook/addon-storysource": "5.0.0-rc.7",
+    "@storybook/addon-viewport": "5.0.0-rc.7",
+    "@storybook/addons": "5.0.0-rc.7",
+    "@storybook/preact": "5.0.0-rc.7",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
     "file-loader": "^3.0.1",
diff --git a/examples/riot-kitchen-sink/package.json b/examples/riot-kitchen-sink/package.json
index 3aeec3766ab..aa95fa8ee92 100644
--- a/examples/riot-kitchen-sink/package.json
+++ b/examples/riot-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "riot-example",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "private": true,
   "scripts": {
     "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
@@ -15,18 +15,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.2.2",
-    "@storybook/addon-actions": "5.0.0-rc.6",
-    "@storybook/addon-backgrounds": "5.0.0-rc.6",
-    "@storybook/addon-centered": "5.0.0-rc.6",
-    "@storybook/addon-knobs": "5.0.0-rc.6",
-    "@storybook/addon-links": "5.0.0-rc.6",
-    "@storybook/addon-notes": "5.0.0-rc.6",
-    "@storybook/addon-options": "5.0.0-rc.6",
-    "@storybook/addon-storyshots": "5.0.0-rc.6",
-    "@storybook/addon-storysource": "5.0.0-rc.6",
-    "@storybook/addon-viewport": "5.0.0-rc.6",
-    "@storybook/addons": "5.0.0-rc.6",
-    "@storybook/riot": "5.0.0-rc.6",
+    "@storybook/addon-actions": "5.0.0-rc.7",
+    "@storybook/addon-backgrounds": "5.0.0-rc.7",
+    "@storybook/addon-centered": "5.0.0-rc.7",
+    "@storybook/addon-knobs": "5.0.0-rc.7",
+    "@storybook/addon-links": "5.0.0-rc.7",
+    "@storybook/addon-notes": "5.0.0-rc.7",
+    "@storybook/addon-options": "5.0.0-rc.7",
+    "@storybook/addon-storyshots": "5.0.0-rc.7",
+    "@storybook/addon-storysource": "5.0.0-rc.7",
+    "@storybook/addon-viewport": "5.0.0-rc.7",
+    "@storybook/addons": "5.0.0-rc.7",
+    "@storybook/riot": "5.0.0-rc.7",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
     "file-loader": "^3.0.1",
diff --git a/examples/svelte-kitchen-sink/package.json b/examples/svelte-kitchen-sink/package.json
index bfc055c4a5d..c7e7561e3fa 100644
--- a/examples/svelte-kitchen-sink/package.json
+++ b/examples/svelte-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "svelte-example",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook -s public",
@@ -10,17 +10,17 @@
     "global": "^4.3.2"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.6",
-    "@storybook/addon-backgrounds": "5.0.0-rc.6",
-    "@storybook/addon-centered": "5.0.0-rc.6",
-    "@storybook/addon-knobs": "5.0.0-rc.6",
-    "@storybook/addon-links": "5.0.0-rc.6",
-    "@storybook/addon-notes": "5.0.0-rc.6",
-    "@storybook/addon-options": "5.0.0-rc.6",
-    "@storybook/addon-storyshots": "5.0.0-rc.6",
-    "@storybook/addon-storysource": "5.0.0-rc.6",
-    "@storybook/addon-viewport": "5.0.0-rc.6",
-    "@storybook/addons": "5.0.0-rc.6",
-    "@storybook/svelte": "5.0.0-rc.6"
+    "@storybook/addon-actions": "5.0.0-rc.7",
+    "@storybook/addon-backgrounds": "5.0.0-rc.7",
+    "@storybook/addon-centered": "5.0.0-rc.7",
+    "@storybook/addon-knobs": "5.0.0-rc.7",
+    "@storybook/addon-links": "5.0.0-rc.7",
+    "@storybook/addon-notes": "5.0.0-rc.7",
+    "@storybook/addon-options": "5.0.0-rc.7",
+    "@storybook/addon-storyshots": "5.0.0-rc.7",
+    "@storybook/addon-storysource": "5.0.0-rc.7",
+    "@storybook/addon-viewport": "5.0.0-rc.7",
+    "@storybook/addons": "5.0.0-rc.7",
+    "@storybook/svelte": "5.0.0-rc.7"
   }
 }
diff --git a/examples/vue-kitchen-sink/package.json b/examples/vue-kitchen-sink/package.json
index 7e394d08c32..be648a993d3 100644
--- a/examples/vue-kitchen-sink/package.json
+++ b/examples/vue-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "vue-example",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "private": true,
   "scripts": {
     "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
@@ -14,18 +14,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.2.2",
-    "@storybook/addon-actions": "5.0.0-rc.6",
-    "@storybook/addon-backgrounds": "5.0.0-rc.6",
-    "@storybook/addon-centered": "5.0.0-rc.6",
-    "@storybook/addon-knobs": "5.0.0-rc.6",
-    "@storybook/addon-links": "5.0.0-rc.6",
-    "@storybook/addon-notes": "5.0.0-rc.6",
-    "@storybook/addon-options": "5.0.0-rc.6",
-    "@storybook/addon-storyshots": "5.0.0-rc.6",
-    "@storybook/addon-storysource": "5.0.0-rc.6",
-    "@storybook/addon-viewport": "5.0.0-rc.6",
-    "@storybook/addons": "5.0.0-rc.6",
-    "@storybook/vue": "5.0.0-rc.6",
+    "@storybook/addon-actions": "5.0.0-rc.7",
+    "@storybook/addon-backgrounds": "5.0.0-rc.7",
+    "@storybook/addon-centered": "5.0.0-rc.7",
+    "@storybook/addon-knobs": "5.0.0-rc.7",
+    "@storybook/addon-links": "5.0.0-rc.7",
+    "@storybook/addon-notes": "5.0.0-rc.7",
+    "@storybook/addon-options": "5.0.0-rc.7",
+    "@storybook/addon-storyshots": "5.0.0-rc.7",
+    "@storybook/addon-storysource": "5.0.0-rc.7",
+    "@storybook/addon-viewport": "5.0.0-rc.7",
+    "@storybook/addons": "5.0.0-rc.7",
+    "@storybook/vue": "5.0.0-rc.7",
     "babel-core": "^7.0.0-bridge.0",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
diff --git a/lerna.json b/lerna.json
index 38df0af6f0e..c1962f5af86 100644
--- a/lerna.json
+++ b/lerna.json
@@ -11,5 +11,5 @@
   "npmClient": "yarn",
   "useWorkspaces": true,
   "registry": "https://registry.npmjs.org",
-  "version": "5.0.0-rc.6"
+  "version": "5.0.0-rc.7"
 }
diff --git a/lib/addons/package.json b/lib/addons/package.json
index 4a6b4f77537..4097f9dc767 100644
--- a/lib/addons/package.json
+++ b/lib/addons/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addons",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "Storybook addons store",
   "keywords": [
     "storybook"
@@ -20,8 +20,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.0.0-rc.6",
-    "@storybook/client-logger": "5.0.0-rc.6",
+    "@storybook/channels": "5.0.0-rc.7",
+    "@storybook/client-logger": "5.0.0-rc.7",
     "global": "^4.3.2",
     "util-deprecate": "^1.0.2"
   },
diff --git a/lib/channel-postmessage/package.json b/lib/channel-postmessage/package.json
index c2374a573c7..87b44a30248 100644
--- a/lib/channel-postmessage/package.json
+++ b/lib/channel-postmessage/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channel-postmessage",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "",
   "keywords": [
     "storybook"
@@ -20,8 +20,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.0.0-rc.6",
-    "@storybook/client-logger": "5.0.0-rc.6",
+    "@storybook/channels": "5.0.0-rc.7",
+    "@storybook/client-logger": "5.0.0-rc.7",
     "global": "^4.3.2",
     "telejson": "^2.1.0"
   },
diff --git a/lib/channel-websocket/package.json b/lib/channel-websocket/package.json
index 4e3288b2bad..c27669e6913 100644
--- a/lib/channel-websocket/package.json
+++ b/lib/channel-websocket/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channel-websocket",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "",
   "keywords": [
     "storybook"
@@ -20,7 +20,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.0.0-rc.6",
+    "@storybook/channels": "5.0.0-rc.7",
     "global": "^4.3.2",
     "json-fn": "^1.1.1"
   },
diff --git a/lib/channels/package.json b/lib/channels/package.json
index 1233e6e9f8e..5660d7c1966 100644
--- a/lib/channels/package.json
+++ b/lib/channels/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channels",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/cli/package.json b/lib/cli/package.json
index fa67ac033f5..9be74b7ba1c 100644
--- a/lib/cli/package.json
+++ b/lib/cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/cli",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "Storybook's CLI - easiest method of adding storybook to your projects",
   "keywords": [
     "cli",
@@ -29,7 +29,7 @@
     "@babel/core": "^7.2.2",
     "@babel/preset-env": "^7.3.1",
     "@babel/register": "^7.0.0",
-    "@storybook/codemod": "5.0.0-rc.6",
+    "@storybook/codemod": "5.0.0-rc.7",
     "chalk": "^2.4.1",
     "commander": "^2.19.0",
     "core-js": "^2.6.2",
@@ -43,31 +43,31 @@
     "update-notifier": "^2.5.0"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.6",
-    "@storybook/addon-centered": "5.0.0-rc.6",
-    "@storybook/addon-graphql": "5.0.0-rc.6",
-    "@storybook/addon-info": "5.0.0-rc.6",
-    "@storybook/addon-knobs": "5.0.0-rc.6",
-    "@storybook/addon-links": "5.0.0-rc.6",
-    "@storybook/addon-notes": "5.0.0-rc.6",
-    "@storybook/addon-options": "5.0.0-rc.6",
-    "@storybook/addon-storyshots": "5.0.0-rc.6",
-    "@storybook/addons": "5.0.0-rc.6",
-    "@storybook/angular": "5.0.0-rc.6",
-    "@storybook/channel-postmessage": "5.0.0-rc.6",
-    "@storybook/channel-websocket": "5.0.0-rc.6",
-    "@storybook/channels": "5.0.0-rc.6",
-    "@storybook/ember": "5.0.0-rc.6",
-    "@storybook/html": "5.0.0-rc.6",
-    "@storybook/marko": "5.0.0-rc.6",
-    "@storybook/mithril": "5.0.0-rc.6",
-    "@storybook/polymer": "5.0.0-rc.6",
-    "@storybook/preact": "5.0.0-rc.6",
-    "@storybook/react": "5.0.0-rc.6",
-    "@storybook/react-native": "5.0.0-rc.6",
-    "@storybook/riot": "5.0.0-rc.6",
-    "@storybook/ui": "5.0.0-rc.6",
-    "@storybook/vue": "5.0.0-rc.6"
+    "@storybook/addon-actions": "5.0.0-rc.7",
+    "@storybook/addon-centered": "5.0.0-rc.7",
+    "@storybook/addon-graphql": "5.0.0-rc.7",
+    "@storybook/addon-info": "5.0.0-rc.7",
+    "@storybook/addon-knobs": "5.0.0-rc.7",
+    "@storybook/addon-links": "5.0.0-rc.7",
+    "@storybook/addon-notes": "5.0.0-rc.7",
+    "@storybook/addon-options": "5.0.0-rc.7",
+    "@storybook/addon-storyshots": "5.0.0-rc.7",
+    "@storybook/addons": "5.0.0-rc.7",
+    "@storybook/angular": "5.0.0-rc.7",
+    "@storybook/channel-postmessage": "5.0.0-rc.7",
+    "@storybook/channel-websocket": "5.0.0-rc.7",
+    "@storybook/channels": "5.0.0-rc.7",
+    "@storybook/ember": "5.0.0-rc.7",
+    "@storybook/html": "5.0.0-rc.7",
+    "@storybook/marko": "5.0.0-rc.7",
+    "@storybook/mithril": "5.0.0-rc.7",
+    "@storybook/polymer": "5.0.0-rc.7",
+    "@storybook/preact": "5.0.0-rc.7",
+    "@storybook/react": "5.0.0-rc.7",
+    "@storybook/react-native": "5.0.0-rc.7",
+    "@storybook/riot": "5.0.0-rc.7",
+    "@storybook/ui": "5.0.0-rc.7",
+    "@storybook/vue": "5.0.0-rc.7"
   },
   "publishConfig": {
     "access": "public"
diff --git a/lib/client-api/package.json b/lib/client-api/package.json
index 57283bc4156..25233060e25 100644
--- a/lib/client-api/package.json
+++ b/lib/client-api/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/client-api",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "Storybook Client API",
   "keywords": [
     "storybook"
@@ -19,10 +19,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.6",
-    "@storybook/client-logger": "5.0.0-rc.6",
-    "@storybook/core-events": "5.0.0-rc.6",
-    "@storybook/router": "5.0.0-rc.6",
+    "@storybook/addons": "5.0.0-rc.7",
+    "@storybook/client-logger": "5.0.0-rc.7",
+    "@storybook/core-events": "5.0.0-rc.7",
+    "@storybook/router": "5.0.0-rc.7",
     "common-tags": "^1.8.0",
     "eventemitter3": "^3.1.0",
     "global": "^4.3.2",
diff --git a/lib/client-logger/package.json b/lib/client-logger/package.json
index 3e25885f85f..42bec0ee003 100644
--- a/lib/client-logger/package.json
+++ b/lib/client-logger/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/client-logger",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/codemod/package.json b/lib/codemod/package.json
index 91b1bc7e326..5585c93e801 100644
--- a/lib/codemod/package.json
+++ b/lib/codemod/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/codemod",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "A collection of codemod scripts written with JSCodeshift",
   "keywords": [
     "storybook"
diff --git a/lib/components/package.json b/lib/components/package.json
index 3e7b310be4d..f79510c3f5a 100644
--- a/lib/components/package.json
+++ b/lib/components/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/components",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "Core Storybook Components",
   "keywords": [
     "storybook"
@@ -20,11 +20,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.6",
-    "@storybook/client-logger": "5.0.0-rc.6",
-    "@storybook/core-events": "5.0.0-rc.6",
-    "@storybook/router": "5.0.0-rc.6",
-    "@storybook/theming": "5.0.0-rc.6",
+    "@storybook/addons": "5.0.0-rc.7",
+    "@storybook/client-logger": "5.0.0-rc.7",
+    "@storybook/core-events": "5.0.0-rc.7",
+    "@storybook/router": "5.0.0-rc.7",
+    "@storybook/theming": "5.0.0-rc.7",
     "global": "^4.3.2",
     "immer": "^1.12.0",
     "js-beautify": "^1.8.9",
diff --git a/lib/core-events/package.json b/lib/core-events/package.json
index 76db93e2ff8..486b80d9dc2 100644
--- a/lib/core-events/package.json
+++ b/lib/core-events/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/core-events",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "Event names used in storybook core",
   "keywords": [
     "storybook"
diff --git a/lib/core/package.json b/lib/core/package.json
index eb55235baab..5a520e93ada 100644
--- a/lib/core/package.json
+++ b/lib/core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/core",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "Storybook framework-agnostic API",
   "keywords": [
     "storybook"
@@ -24,15 +24,15 @@
     "@babel/plugin-syntax-dynamic-import": "^7.2.0",
     "@babel/plugin-transform-react-constant-elements": "^7.2.0",
     "@babel/preset-env": "^7.3.1",
-    "@storybook/addons": "5.0.0-rc.6",
-    "@storybook/channel-postmessage": "5.0.0-rc.6",
-    "@storybook/client-api": "5.0.0-rc.6",
-    "@storybook/client-logger": "5.0.0-rc.6",
-    "@storybook/core-events": "5.0.0-rc.6",
-    "@storybook/node-logger": "5.0.0-rc.6",
-    "@storybook/router": "5.0.0-rc.6",
-    "@storybook/theming": "5.0.0-rc.6",
-    "@storybook/ui": "5.0.0-rc.6",
+    "@storybook/addons": "5.0.0-rc.7",
+    "@storybook/channel-postmessage": "5.0.0-rc.7",
+    "@storybook/client-api": "5.0.0-rc.7",
+    "@storybook/client-logger": "5.0.0-rc.7",
+    "@storybook/core-events": "5.0.0-rc.7",
+    "@storybook/node-logger": "5.0.0-rc.7",
+    "@storybook/router": "5.0.0-rc.7",
+    "@storybook/theming": "5.0.0-rc.7",
+    "@storybook/ui": "5.0.0-rc.7",
     "airbnb-js-shims": "^1 || ^2",
     "autoprefixer": "^9.4.7",
     "babel-plugin-add-react-displayname": "^0.0.5",
diff --git a/lib/node-logger/package.json b/lib/node-logger/package.json
index 8fee2bbc0e6..e2d8dfc92a7 100644
--- a/lib/node-logger/package.json
+++ b/lib/node-logger/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/node-logger",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/router/package.json b/lib/router/package.json
index 921849410dc..3404698535f 100644
--- a/lib/router/package.json
+++ b/lib/router/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/router",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "Core Storybook Router",
   "keywords": [
     "storybook"
@@ -20,7 +20,7 @@
   },
   "dependencies": {
     "@reach/router": "^1.2.1",
-    "@storybook/theming": "5.0.0-rc.6",
+    "@storybook/theming": "5.0.0-rc.7",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
     "qs": "^6.5.2"
diff --git a/lib/theming/package.json b/lib/theming/package.json
index 03645ed21f9..e219c136a76 100644
--- a/lib/theming/package.json
+++ b/lib/theming/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/theming",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "Core Storybook Components",
   "keywords": [
     "storybook"
@@ -21,7 +21,7 @@
   "dependencies": {
     "@emotion/core": "^10.0.7",
     "@emotion/styled": "^10.0.7",
-    "@storybook/client-logger": "5.0.0-rc.6",
+    "@storybook/client-logger": "5.0.0-rc.7",
     "common-tags": "^1.8.0",
     "deep-object-diff": "^1.1.0",
     "emotion-theming": "^10.0.7",
diff --git a/lib/ui/package.json b/lib/ui/package.json
index ac79e78e231..6c1ba284511 100644
--- a/lib/ui/package.json
+++ b/lib/ui/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/ui",
-  "version": "5.0.0-rc.6",
+  "version": "5.0.0-rc.7",
   "description": "Core Storybook UI",
   "keywords": [
     "storybook"
@@ -21,12 +21,12 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.6",
-    "@storybook/client-logger": "5.0.0-rc.6",
-    "@storybook/components": "5.0.0-rc.6",
-    "@storybook/core-events": "5.0.0-rc.6",
-    "@storybook/router": "5.0.0-rc.6",
-    "@storybook/theming": "5.0.0-rc.6",
+    "@storybook/addons": "5.0.0-rc.7",
+    "@storybook/client-logger": "5.0.0-rc.7",
+    "@storybook/components": "5.0.0-rc.7",
+    "@storybook/core-events": "5.0.0-rc.7",
+    "@storybook/router": "5.0.0-rc.7",
+    "@storybook/theming": "5.0.0-rc.7",
     "eventemitter3": "^3.1.0",
     "fast-deep-equal": "^2.0.1",
     "fuse.js": "^3.3.1",

From bc80890caaaed0f6b25bc7589d5bd64813fc0edf Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Thu, 28 Feb 2019 08:19:19 +0800
Subject: [PATCH 099/249] 5.0.0-rc.7 versions.json

---
 docs/static/versions.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/docs/static/versions.json b/docs/static/versions.json
index 630fd2556c3..00618c69c9b 100644
--- a/docs/static/versions.json
+++ b/docs/static/versions.json
@@ -1 +1 @@
-{"next":{"version":"5.0.0-rc.6","info":{"plain":"### Bug Fixes\n\n* Addon-actions: FIX performance by upgrading to telejson 2.1 ([#5751](https://github.com/storybooks/storybook/pull/5751))\n* UI: FIX bad treeview mockdata ([#5741](https://github.com/storybooks/storybook/pull/5741))\n* UI: About page styling fixes ([#5732](https://github.com/storybooks/storybook/pull/5732))\n* UI: Restore the toolbar eject button ([#5737](https://github.com/storybooks/storybook/pull/5737))"}}}
\ No newline at end of file
+{"next":{"version":"5.0.0-rc.7","info":{"plain":"### Features\n\n* UI: Page load animation and `STORIES_CONFIGURED` event ([#5756](https://github.com/storybooks/storybook/pull/5756))\n* Theming: Improve `brand` API  ([#5733](https://github.com/storybooks/storybook/pull/5733))\n* UI: Fuzzy search improvement ([#5748](https://github.com/storybooks/storybook/pull/5748))\n* UI: Add toolbar animation ([#5742](https://github.com/storybooks/storybook/pull/5742))\n\n### Bug Fixes\n\n* UI: Fix update notifications placement ([#5716](https://github.com/storybooks/storybook/pull/5716))\n* Angular: Fix global style imports ([#5776](https://github.com/storybooks/storybook/pull/5776))\n* Addon-options: Add backwards compatibility ([#5758](https://github.com/storybooks/storybook/pull/5758))\n* Addon-options: Fix deprecated url/name options ([#5773](https://github.com/storybooks/storybook/pull/5773))\n* Addon-knobs: Remove call to `forceReRender()` on `STORY_CHANGED` ([#5753](https://github.com/storybooks/storybook/pull/5753))\n* UI: Fix active state in addon-background, addon-viewport tools ([#5749](https://github.com/storybooks/storybook/pull/5749))"}}}
\ No newline at end of file

From 429752a546d8929b1fa25f46bca140b497361482 Mon Sep 17 00:00:00 2001
From: CodeByAlex <WilsonC.alexander@gmail.com>
Date: Fri, 1 Mar 2019 11:17:54 -0500
Subject: [PATCH 100/249] added debouncing at 155ms between each keypress
 before the forceReRender function is called

---
 addons/knobs/src/registerKnobs.js | 18 ++++++++++++------
 1 file changed, 12 insertions(+), 6 deletions(-)

diff --git a/addons/knobs/src/registerKnobs.js b/addons/knobs/src/registerKnobs.js
index 687f7d59a34..8705cfe096e 100644
--- a/addons/knobs/src/registerKnobs.js
+++ b/addons/knobs/src/registerKnobs.js
@@ -6,6 +6,8 @@ import { CHANGE, CLICK, RESET, SET } from './shared';
 
 export const manager = new KnobManager();
 const { knobStore } = manager;
+const KNOB_CHANGED_DEBOUNCE_DELAY_MS = 155; // approximate average time between keypresses
+let timeoutId = null;
 
 function forceReRender() {
   addons.getChannel().emit(FORCE_RE_RENDER);
@@ -17,15 +19,19 @@ function setPaneKnobs(timestamp = +new Date()) {
 }
 
 function knobChanged(change) {
-  const { name, value } = change;
+  clearTimeout(timeoutId);
+  timeoutId = setTimeout(() => {
+    // debouncing occurs here to increase performance
+    const { name, value } = change;
 
-  // Update the related knob and it's value.
-  const knobOptions = knobStore.get(name);
+    // Update the related knob and it's value.
+    const knobOptions = knobStore.get(name);
 
-  knobOptions.value = value;
-  knobStore.markAllUnused();
+    knobOptions.value = value;
+    knobStore.markAllUnused();
 
-  forceReRender();
+    forceReRender();
+  }, DEBOUNCE_DELAY_MS); // amount of time used to ensure that the user has time to type before re-rendering
 }
 
 function knobClicked(clicked) {

From 920892ad5cb230c56b208e4fec59b82f411d779d Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Wed, 27 Feb 2019 21:10:29 +0100
Subject: [PATCH 101/249] Merge pull request #5759 from
 mateoholman/5723-info-addon-styling

Add font family to info panel
---
 .../info/src/__snapshots__/index.test.js.snap |  2 +
 addons/info/src/components/Story.js           |  1 +
 .../__snapshots__/index.stories.storyshot     |  2 +-
 .../addon-info.stories.storyshot              | 52 +++++++++----------
 4 files changed, 30 insertions(+), 27 deletions(-)

diff --git a/addons/info/src/__snapshots__/index.test.js.snap b/addons/info/src/__snapshots__/index.test.js.snap
index 67bc43a9cb1..836ee6c3a6a 100644
--- a/addons/info/src/__snapshots__/index.test.js.snap
+++ b/addons/info/src/__snapshots__/index.test.js.snap
@@ -138,6 +138,7 @@ exports[`addon Info should render <Info /> and external markdown 1`] = `
             "background": "white",
             "bottom": 0,
             "display": "none",
+            "fontFamily": "Helvetica Neue, Helvetica, Segoe UI, Arial, freesans, sans-serif",
             "left": 0,
             "overflow": "auto",
             "padding": "0 40px",
@@ -1391,6 +1392,7 @@ containing **bold**, *cursive* text, \`code\` and [a link](https://github.com)"
             "background": "white",
             "bottom": 0,
             "display": "none",
+            "fontFamily": "Helvetica Neue, Helvetica, Segoe UI, Arial, freesans, sans-serif",
             "left": 0,
             "overflow": "auto",
             "padding": "0 40px",
diff --git a/addons/info/src/components/Story.js b/addons/info/src/components/Story.js
index dc7d0e9bfcd..89826ad7e10 100644
--- a/addons/info/src/components/Story.js
+++ b/addons/info/src/components/Story.js
@@ -35,6 +35,7 @@ const stylesheetBase = {
     },
   },
   info: {
+    fontFamily: 'Helvetica Neue, Helvetica, Segoe UI, Arial, freesans, sans-serif',
     position: 'fixed',
     background: 'white',
     top: 0,
diff --git a/examples/cra-kitchen-sink/src/stories/__snapshots__/index.stories.storyshot b/examples/cra-kitchen-sink/src/stories/__snapshots__/index.stories.storyshot
index 2baa29b4353..bf2eff4f81c 100644
--- a/examples/cra-kitchen-sink/src/stories/__snapshots__/index.stories.storyshot
+++ b/examples/cra-kitchen-sink/src/stories/__snapshots__/index.stories.storyshot
@@ -28,7 +28,7 @@ exports[`Storyshots Button with new info 1`] = `
   </button>
   <div
     class="info__overlay"
-    style="position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
+    style="font-family:Helvetica Neue, Helvetica, Segoe UI, Arial, freesans, sans-serif;position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
   >
     <button
       class="info__close-button"
diff --git a/examples/official-storybook/stories/__snapshots__/addon-info.stories.storyshot b/examples/official-storybook/stories/__snapshots__/addon-info.stories.storyshot
index d8c767c3d29..71f17378224 100644
--- a/examples/official-storybook/stories/__snapshots__/addon-info.stories.storyshot
+++ b/examples/official-storybook/stories/__snapshots__/addon-info.stories.storyshot
@@ -20,7 +20,7 @@ exports[`Storyshots Addons|Info/Decorator Use Info as story decorator 1`] = `
   </button>
   <div
     class="info__overlay"
-    style="position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
+    style="font-family:Helvetica Neue, Helvetica, Segoe UI, Arial, freesans, sans-serif;position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
   >
     <button
       class="info__close-button"
@@ -297,7 +297,7 @@ exports[`Storyshots Addons|Info/ForwardRef Displays forwarded ref components cor
   </button>
   <div
     class="info__overlay"
-    style="position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
+    style="font-family:Helvetica Neue, Helvetica, Segoe UI, Arial, freesans, sans-serif;position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
   >
     <button
       class="info__close-button"
@@ -647,7 +647,7 @@ exports[`Storyshots Addons|Info/GitHub issues #1814 1`] = `
   </button>
   <div
     class="info__overlay"
-    style="position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
+    style="font-family:Helvetica Neue, Helvetica, Segoe UI, Arial, freesans, sans-serif;position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
   >
     <button
       class="info__close-button"
@@ -811,7 +811,7 @@ exports[`Storyshots Addons|Info/JSX Displays JSX in description 1`] = `
   </button>
   <div
     class="info__overlay"
-    style="position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
+    style="font-family:Helvetica Neue, Helvetica, Segoe UI, Arial, freesans, sans-serif;position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
   >
     <button
       class="info__close-button"
@@ -1122,7 +1122,7 @@ exports[`Storyshots Addons|Info/Markdown Displays Markdown in description 1`] =
   </button>
   <div
     class="info__overlay"
-    style="position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
+    style="font-family:Helvetica Neue, Helvetica, Segoe UI, Arial, freesans, sans-serif;position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
   >
     <button
       class="info__close-button"
@@ -1437,7 +1437,7 @@ exports[`Storyshots Addons|Info/Markdown From external Markdown file 1`] = `
   </button>
   <div
     class="info__overlay"
-    style="position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
+    style="font-family:Helvetica Neue, Helvetica, Segoe UI, Arial, freesans, sans-serif;position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
   >
     <button
       class="info__close-button"
@@ -1732,7 +1732,7 @@ exports[`Storyshots Addons|Info/Markdown From internal Markdown file 1`] = `
   </button>
   <div
     class="info__overlay"
-    style="position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
+    style="font-family:Helvetica Neue, Helvetica, Segoe UI, Arial, freesans, sans-serif;position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
   >
     <button
       class="info__close-button"
@@ -2039,7 +2039,7 @@ exports[`Storyshots Addons|Info/Options.TableComponent Use a custom component fo
   </button>
   <div
     class="info__overlay"
-    style="position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
+    style="font-family:Helvetica Neue, Helvetica, Segoe UI, Arial, freesans, sans-serif;position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
   >
     <button
       class="info__close-button"
@@ -2221,7 +2221,7 @@ exports[`Storyshots Addons|Info/Options.excludedPropTypes Excludes propTypes tha
   </button>
   <div
     class="info__overlay"
-    style="position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
+    style="font-family:Helvetica Neue, Helvetica, Segoe UI, Arial, freesans, sans-serif;position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
   >
     <button
       class="info__close-button"
@@ -2471,7 +2471,7 @@ exports[`Storyshots Addons|Info/Options.header Shows or hides Info Addon header
   </button>
   <div
     class="info__overlay"
-    style="position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
+    style="font-family:Helvetica Neue, Helvetica, Segoe UI, Arial, freesans, sans-serif;position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
   >
     <button
       class="info__close-button"
@@ -2998,7 +2998,7 @@ exports[`Storyshots Addons|Info/Options.propTables Shows additional component pr
   </button>
   <div
     class="info__overlay"
-    style="position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
+    style="font-family:Helvetica Neue, Helvetica, Segoe UI, Arial, freesans, sans-serif;position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
   >
     <button
       class="info__close-button"
@@ -3380,7 +3380,7 @@ exports[`Storyshots Addons|Info/Options.propTablesExclude Exclude component from
   </button>
   <div
     class="info__overlay"
-    style="position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
+    style="font-family:Helvetica Neue, Helvetica, Segoe UI, Arial, freesans, sans-serif;position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
   >
     <button
       class="info__close-button"
@@ -3718,7 +3718,7 @@ exports[`Storyshots Addons|Info/Options.source Shows or hides Info Addon source
   </button>
   <div
     class="info__overlay"
-    style="position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
+    style="font-family:Helvetica Neue, Helvetica, Segoe UI, Arial, freesans, sans-serif;position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
   >
     <button
       class="info__close-button"
@@ -3941,7 +3941,7 @@ exports[`Storyshots Addons|Info/Options.styles Extend info styles with an object
   </button>
   <div
     class="info__overlay"
-    style="position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
+    style="font-family:Helvetica Neue, Helvetica, Segoe UI, Arial, freesans, sans-serif;position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
   >
     <button
       class="info__close-button"
@@ -4209,7 +4209,7 @@ exports[`Storyshots Addons|Info/Options.styles Full control over styles using a
   </button>
   <div
     class="info__overlay"
-    style="position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
+    style="font-family:Helvetica Neue, Helvetica, Segoe UI, Arial, freesans, sans-serif;position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
   >
     <button
       class="info__close-button"
@@ -4485,7 +4485,7 @@ exports[`Storyshots Addons|Info/Parameters Overwrite the parameters with markdow
   </button>
   <div
     class="info__overlay"
-    style="position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
+    style="font-family:Helvetica Neue, Helvetica, Segoe UI, Arial, freesans, sans-serif;position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
   >
     <button
       class="info__close-button"
@@ -5583,7 +5583,7 @@ exports[`Storyshots Addons|Info/React Docgen Comments from Flow declarations 1`]
   </button>
   <div
     class="info__overlay"
-    style="position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
+    style="font-family:Helvetica Neue, Helvetica, Segoe UI, Arial, freesans, sans-serif;position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
   >
     <button
       class="info__close-button"
@@ -5822,7 +5822,7 @@ exports[`Storyshots Addons|Info/React Docgen Comments from PropType declarations
   </button>
   <div
     class="info__overlay"
-    style="position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
+    style="font-family:Helvetica Neue, Helvetica, Segoe UI, Arial, freesans, sans-serif;position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
   >
     <button
       class="info__close-button"
@@ -6711,7 +6711,7 @@ exports[`Storyshots Addons|Info/React Docgen Comments from component declaration
   </button>
   <div
     class="info__overlay"
-    style="position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
+    style="font-family:Helvetica Neue, Helvetica, Segoe UI, Arial, freesans, sans-serif;position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
   >
     <button
       class="info__close-button"
@@ -7006,7 +7006,7 @@ exports[`Storyshots Addons|Info/React Docgen Comments from named export componen
   </button>
   <div
     class="info__overlay"
-    style="position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
+    style="font-family:Helvetica Neue, Helvetica, Segoe UI, Arial, freesans, sans-serif;position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
   >
     <button
       class="info__close-button"
@@ -7376,7 +7376,7 @@ exports[`Storyshots Addons|Info/Story Source Array prop 1`] = `
   </button>
   <div
     class="info__overlay"
-    style="position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
+    style="font-family:Helvetica Neue, Helvetica, Segoe UI, Arial, freesans, sans-serif;position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
   >
     <button
       class="info__close-button"
@@ -7852,7 +7852,7 @@ exports[`Storyshots Addons|Info/Story Source Children 1`] = `
   </button>
   <div
     class="info__overlay"
-    style="position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
+    style="font-family:Helvetica Neue, Helvetica, Segoe UI, Arial, freesans, sans-serif;position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
   >
     <button
       class="info__close-button"
@@ -8200,7 +8200,7 @@ exports[`Storyshots Addons|Info/Story Source Many props 1`] = `
   </button>
   <div
     class="info__overlay"
-    style="position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
+    style="font-family:Helvetica Neue, Helvetica, Segoe UI, Arial, freesans, sans-serif;position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
   >
     <button
       class="info__close-button"
@@ -8493,7 +8493,7 @@ exports[`Storyshots Addons|Info/Story Source Object prop 1`] = `
   </button>
   <div
     class="info__overlay"
-    style="position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
+    style="font-family:Helvetica Neue, Helvetica, Segoe UI, Arial, freesans, sans-serif;position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
   >
     <button
       class="info__close-button"
@@ -8845,7 +8845,7 @@ exports[`Storyshots Addons|Info/Story Source One prop 1`] = `
   </button>
   <div
     class="info__overlay"
-    style="position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
+    style="font-family:Helvetica Neue, Helvetica, Segoe UI, Arial, freesans, sans-serif;position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
   >
     <button
       class="info__close-button"
@@ -9113,7 +9113,7 @@ exports[`Storyshots Addons|Info/deprecated Displays Markdown in description 1`]
   </button>
   <div
     class="info__overlay"
-    style="position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
+    style="font-family:Helvetica Neue, Helvetica, Segoe UI, Arial, freesans, sans-serif;position:fixed;background:white;top:0;bottom:0;left:0;right:0;padding:0 40px;overflow:auto;z-index:99999;display:none"
   >
     <button
       class="info__close-button"

From a5b2afa9214b0a9e96bd6d2723e5b48ce8ed8989 Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Fri, 1 Mar 2019 22:42:19 +0800
Subject: [PATCH 102/249] Merge pull request #5807 from
 storybooks/5593-iframe-clicks

Close tooltips on iframe clicks on keypresses
---
 lib/components/src/tooltip/WithTooltip.js | 50 ++++++++++++++++++++---
 1 file changed, 45 insertions(+), 5 deletions(-)

diff --git a/lib/components/src/tooltip/WithTooltip.js b/lib/components/src/tooltip/WithTooltip.js
index 4077bbe4473..8ad6fe259a2 100644
--- a/lib/components/src/tooltip/WithTooltip.js
+++ b/lib/components/src/tooltip/WithTooltip.js
@@ -1,7 +1,8 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { styled } from '@storybook/theming';
-import { withState } from 'recompose';
+import { withState, lifecycle } from 'recompose';
+import { document } from 'global';
 
 import TooltipTrigger from 'react-popper-tooltip';
 import Tooltip from './Tooltip';
@@ -17,7 +18,8 @@ const TargetSvgContainer = styled.g`
   cursor: ${props => (props.mode === 'hover' ? 'default' : 'pointer')};
 `;
 
-const WithTooltip = ({
+// Pure, does not bind to the body
+const WithTooltipPure = ({
   svg,
   trigger,
   closeOnClick,
@@ -69,7 +71,7 @@ const WithTooltip = ({
   );
 };
 
-WithTooltip.propTypes = {
+WithTooltipPure.propTypes = {
   svg: PropTypes.bool,
   trigger: PropTypes.string,
   closeOnClick: PropTypes.bool,
@@ -82,7 +84,7 @@ WithTooltip.propTypes = {
   onVisibilityChange: PropTypes.func.isRequired,
 };
 
-WithTooltip.defaultProps = {
+WithTooltipPure.defaultProps = {
   svg: false,
   trigger: 'hover',
   closeOnClick: false,
@@ -92,6 +94,44 @@ WithTooltip.defaultProps = {
   tooltipShown: false,
 };
 
+const WithTooltip = lifecycle({
+  componentDidMount() {
+    const { onVisibilityChange } = this.props;
+    const hide = () => onVisibilityChange(false);
+    document.addEventListener('keydown', hide, false);
+
+    // Find all iframes on the screen and bind to clicks inside them (waiting until the iframe is ready)
+    const iframes = Array.from(document.getElementsByTagName('iframe'));
+    const unbinders = [];
+    iframes.forEach(iframe => {
+      const bind = () => {
+        iframe.contentDocument.addEventListener('click', hide);
+        unbinders.push(() => {
+          iframe.contentDocument.removeEventListener('click', hide);
+        });
+      };
+
+      bind(); // I don't know how to find out if it's already loaded so I potentially will bind twice
+      iframe.addEventListener('load', bind);
+      unbinders.push(() => {
+        iframe.removeEventListener('load', bind);
+      });
+    });
+
+    this.unbind = () => {
+      document.removeEventListener('keydown', hide);
+      unbinders.forEach(unbind => {
+        unbind();
+      });
+    };
+  },
+  componentWillUnmount() {
+    if (this.unbind) {
+      this.unbind();
+    }
+  },
+})(WithTooltipPure);
+
 export default WithTooltip;
 
 const WithToolTipState = withState(
@@ -100,4 +140,4 @@ const WithToolTipState = withState(
   ({ startOpen }) => startOpen
 )(WithTooltip);
 
-export { WithToolTipState };
+export { WithTooltipPure, WithToolTipState };

From 0b284391f68171bdab25ee9e4b5bcd006a085765 Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Fri, 1 Mar 2019 22:43:53 +0800
Subject: [PATCH 103/249] Merge pull request #5805 from
 storybooks/5518-fix-story-ordering

Sort storiesHash so grouped keys appear together.
---
 lib/ui/src/core/stories.js      | 19 +++++++++++++++++-
 lib/ui/src/core/stories.test.js | 35 +++++++++++++++++++++++++++++++++
 2 files changed, 53 insertions(+), 1 deletion(-)

diff --git a/lib/ui/src/core/stories.js b/lib/ui/src/core/stories.js
index 8eb896bf6df..0ca4f0d4b5d 100644
--- a/lib/ui/src/core/stories.js
+++ b/lib/ui/src/core/stories.js
@@ -134,7 +134,8 @@ const initStoriesApi = ({
   });
 
   const setStories = input => {
-    const storiesHash = Object.values(input).reduce((acc, item) => {
+    // This doesn't quite have the right order -- it does not group the top-level keys, see #5518
+    const storiesHashOutOfOrder = Object.values(input).reduce((acc, item) => {
       const { kind, parameters } = item;
       const {
         hierarchyRootSeparator: rootSeparator,
@@ -182,6 +183,22 @@ const initStoriesApi = ({
       return acc;
     }, {});
 
+    // When adding a group, also add all of its children, depth first
+    function addItem(acc, item) {
+      if (!acc[item]) {
+        // If we were already inserted as part of a group, that's great.
+        acc[item.id] = item;
+        const { children } = item;
+        if (children) {
+          children.forEach(id => addItem(acc, storiesHashOutOfOrder[id]));
+        }
+      }
+      return acc;
+    }
+
+    // Now create storiesHash by reordering the above by group
+    const storiesHash = Object.values(storiesHashOutOfOrder).reduce(addItem, {});
+
     const { storyId, viewMode } = store.getState();
 
     if (!storyId || !storiesHash[storyId]) {
diff --git a/lib/ui/src/core/stories.test.js b/lib/ui/src/core/stories.test.js
index a625c425381..c16c703ec72 100644
--- a/lib/ui/src/core/stories.test.js
+++ b/lib/ui/src/core/stories.test.js
@@ -144,6 +144,41 @@ describe('stories API', () => {
       });
     });
 
+    // Stories can get out of order for a few reasons -- see reproductions on
+    //   https://github.com/storybooks/storybook/issues/5518
+    it('does the right thing for out of order stories', () => {
+      const navigate = jest.fn();
+      const store = createMockStore();
+
+      const {
+        api: { setStories },
+      } = initStories({ store, navigate });
+
+      setStories({
+        'a--1': { kind: 'a', name: '1', parameters, path: 'a--1', id: 'a--1' },
+        'b--1': { kind: 'b', name: '1', parameters, path: 'b--1', id: 'b--1' },
+        'a--2': { kind: 'a', name: '2', parameters, path: 'a--2', id: 'a--2' },
+      });
+
+      const { storiesHash: storedStoriesHash } = store.getState();
+
+      // We need exact key ordering, even if in theory JS doens't guarantee it
+      expect(Object.keys(storedStoriesHash)).toEqual(['a', 'a--1', 'a--2', 'b', 'b--1']);
+      expect(storedStoriesHash.a).toMatchObject({
+        id: 'a',
+        children: ['a--1', 'a--2'],
+        isRoot: false,
+        isComponent: true,
+      });
+
+      expect(storedStoriesHash.b).toMatchObject({
+        id: 'b',
+        children: ['b--1'],
+        isRoot: false,
+        isComponent: true,
+      });
+    });
+
     it('navigates to the first story in the store if there is none selected', () => {
       const navigate = jest.fn();
       const store = { getState: () => ({ viewMode: 'story' }), setState: jest.fn() };

From 67955082d7658a0f19712fa8b9aead01c5153558 Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Fri, 1 Mar 2019 22:40:58 +0800
Subject: [PATCH 104/249] Merge pull request #5806 from
 storybooks/5781-document-decorator-changes

Allow local decorators via params
---
 .../__snapshots__/index.stories.storyshot     |   88 +-
 .../addon-info.stories.storyshot              | 2552 ++++++-----------
 .../stories/core/decorators.stories.js        |   39 +
 .../__snapshots__/storyshots.test.js.snap     |  320 +--
 lib/client-api/src/client_api.js              |    7 +-
 .../syntaxhighlighter.stories.storyshot       |  466 +--
 .../tabs/__snapshots__/tabs.stories.storyshot | 1430 ++++-----
 .../__snapshots__/panel.stories.storyshot     |  242 +-
 .../__snapshots__/preview.stories.storyshot   |  658 +++--
 .../__snapshots__/about.stories.storyshot     |  731 ++---
 10 files changed, 2834 insertions(+), 3699 deletions(-)
 create mode 100644 examples/official-storybook/stories/core/decorators.stories.js

diff --git a/examples/cra-kitchen-sink/src/stories/__snapshots__/index.stories.storyshot b/examples/cra-kitchen-sink/src/stories/__snapshots__/index.stories.storyshot
index bf2eff4f81c..43ab3a7cde5 100644
--- a/examples/cra-kitchen-sink/src/stories/__snapshots__/index.stories.storyshot
+++ b/examples/cra-kitchen-sink/src/stories/__snapshots__/index.stories.storyshot
@@ -207,32 +207,24 @@ exports[`Storyshots Button with new info 1`] = `
             >
               "Container" Component
             </h3>
-            <table>
+            <table
+              class="info-table"
+            >
               <thead>
                 <tr>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     property
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     propType
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     required
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     default
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     description
                   </th>
                 </tr>
@@ -240,81 +232,65 @@ exports[`Storyshots Button with new info 1`] = `
               <tbody>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     children
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       node
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     yes
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     isAmazing
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       bool
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       false
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     age
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       {
                       <span>
@@ -339,38 +315,30 @@ exports[`Storyshots Button with new info 1`] = `
                       }
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     title
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       string
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       the best container ever
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
               </tbody>
             </table>
diff --git a/examples/official-storybook/stories/__snapshots__/addon-info.stories.storyshot b/examples/official-storybook/stories/__snapshots__/addon-info.stories.storyshot
index 71f17378224..aabe5f6698f 100644
--- a/examples/official-storybook/stories/__snapshots__/addon-info.stories.storyshot
+++ b/examples/official-storybook/stories/__snapshots__/addon-info.stories.storyshot
@@ -122,32 +122,24 @@ exports[`Storyshots Addons|Info/Decorator Use Info as story decorator 1`] = `
             >
               "BaseButton" Component
             </h3>
-            <table>
+            <table
+              class="info-table"
+            >
               <thead>
                 <tr>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     property
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     propType
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     required
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     default
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     description
                   </th>
                 </tr>
@@ -155,117 +147,93 @@ exports[`Storyshots Addons|Info/Decorator Use Info as story decorator 1`] = `
               <tbody>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     disabled
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       bool
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       false
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     label
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       string
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     yes
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     onClick
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       func
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     style
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       {}
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
               </tbody>
             </table>
@@ -471,32 +439,24 @@ exports[`Storyshots Addons|Info/ForwardRef Displays forwarded ref components cor
             >
               "BaseButton" Component
             </h3>
-            <table>
+            <table
+              class="info-table"
+            >
               <thead>
                 <tr>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     property
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     propType
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     required
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     default
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     description
                   </th>
                 </tr>
@@ -504,117 +464,93 @@ exports[`Storyshots Addons|Info/ForwardRef Displays forwarded ref components cor
               <tbody>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     disabled
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       bool
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       false
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     label
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       string
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     yes
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     onClick
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       func
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     style
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       {}
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
               </tbody>
             </table>
@@ -947,32 +883,24 @@ exports[`Storyshots Addons|Info/JSX Displays JSX in description 1`] = `
             >
               "BaseButton" Component
             </h3>
-            <table>
+            <table
+              class="info-table"
+            >
               <thead>
                 <tr>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     property
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     propType
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     required
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     default
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     description
                   </th>
                 </tr>
@@ -980,117 +908,93 @@ exports[`Storyshots Addons|Info/JSX Displays JSX in description 1`] = `
               <tbody>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     disabled
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       bool
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       false
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     label
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       string
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     yes
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     onClick
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       func
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     style
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       {}
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
               </tbody>
             </table>
@@ -1262,32 +1166,24 @@ exports[`Storyshots Addons|Info/Markdown Displays Markdown in description 1`] =
             >
               "BaseButton" Component
             </h3>
-            <table>
+            <table
+              class="info-table"
+            >
               <thead>
                 <tr>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     property
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     propType
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     required
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     default
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     description
                   </th>
                 </tr>
@@ -1295,117 +1191,93 @@ exports[`Storyshots Addons|Info/Markdown Displays Markdown in description 1`] =
               <tbody>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     disabled
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       bool
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       false
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     label
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       string
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     yes
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     onClick
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       func
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     style
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       {}
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
               </tbody>
             </table>
@@ -1557,32 +1429,24 @@ exports[`Storyshots Addons|Info/Markdown From external Markdown file 1`] = `
             >
               "BaseButton" Component
             </h3>
-            <table>
+            <table
+              class="info-table"
+            >
               <thead>
                 <tr>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     property
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     propType
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     required
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     default
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     description
                   </th>
                 </tr>
@@ -1590,117 +1454,93 @@ exports[`Storyshots Addons|Info/Markdown From external Markdown file 1`] = `
               <tbody>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     disabled
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       bool
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       false
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     label
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       string
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     yes
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     onClick
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       func
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     style
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       {}
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
               </tbody>
             </table>
@@ -1864,32 +1704,24 @@ exports[`Storyshots Addons|Info/Markdown From internal Markdown file 1`] = `
             >
               "BaseButton" Component
             </h3>
-            <table>
+            <table
+              class="info-table"
+            >
               <thead>
                 <tr>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     property
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     propType
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     required
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     default
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     description
                   </th>
                 </tr>
@@ -1897,117 +1729,93 @@ exports[`Storyshots Addons|Info/Markdown From internal Markdown file 1`] = `
               <tbody>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     disabled
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       bool
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       false
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     label
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       string
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     yes
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     onClick
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       func
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     style
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       {}
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
               </tbody>
             </table>
@@ -2323,32 +2131,24 @@ exports[`Storyshots Addons|Info/Options.excludedPropTypes Excludes propTypes tha
             >
               "BaseButton" Component
             </h3>
-            <table>
+            <table
+              class="info-table"
+            >
               <thead>
                 <tr>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     property
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     propType
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     required
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     default
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     description
                   </th>
                 </tr>
@@ -2356,90 +2156,72 @@ exports[`Storyshots Addons|Info/Options.excludedPropTypes Excludes propTypes tha
               <tbody>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     disabled
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       bool
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       false
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     onClick
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       func
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     style
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       {}
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
               </tbody>
             </table>
@@ -2559,32 +2341,24 @@ exports[`Storyshots Addons|Info/Options.header Shows or hides Info Addon header
             >
               "BaseButton" Component
             </h3>
-            <table>
+            <table
+              class="info-table"
+            >
               <thead>
                 <tr>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     property
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     propType
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     required
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     default
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     description
                   </th>
                 </tr>
@@ -2592,117 +2366,93 @@ exports[`Storyshots Addons|Info/Options.header Shows or hides Info Addon header
               <tbody>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     disabled
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       bool
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       false
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     label
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       string
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     yes
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     onClick
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       func
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     style
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       {}
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
               </tbody>
             </table>
@@ -2824,32 +2574,24 @@ exports[`Storyshots Addons|Info/Options.inline Inlines component inside story 1`
           >
             "BaseButton" Component
           </h3>
-          <table>
+          <table
+            class="info-table"
+          >
             <thead>
               <tr>
-                <th
-                  style="text-align:left;vertical-align:top"
-                >
+                <th>
                   property
                 </th>
-                <th
-                  style="text-align:left;vertical-align:top"
-                >
+                <th>
                   propType
                 </th>
-                <th
-                  style="text-align:left;vertical-align:top"
-                >
+                <th>
                   required
                 </th>
-                <th
-                  style="text-align:left;vertical-align:top"
-                >
+                <th>
                   default
                 </th>
-                <th
-                  style="text-align:left;vertical-align:top"
-                >
+                <th>
                   description
                 </th>
               </tr>
@@ -2857,117 +2599,93 @@ exports[`Storyshots Addons|Info/Options.inline Inlines component inside story 1`
             <tbody>
               <tr>
                 <td
-                  style="padding-right:10px;vertical-align:top"
+                  class="info-table-monospace"
                 >
                   disabled
                 </td>
                 <td
-                  style="padding-right:10px;vertical-align:top"
+                  class="info-table-monospace"
                 >
                   <span>
                     bool
                   </span>
                 </td>
-                <td
-                  style="padding-right:10px;vertical-align:top"
-                >
+                <td>
                   -
                 </td>
-                <td
-                  style="padding-right:10px;vertical-align:top"
-                >
+                <td>
                   <span>
                     false
                   </span>
                 </td>
-                <td
-                  style="padding-right:10px;vertical-align:top"
-                />
+                <td />
               </tr>
               <tr>
                 <td
-                  style="padding-right:10px;vertical-align:top"
+                  class="info-table-monospace"
                 >
                   label
                 </td>
                 <td
-                  style="padding-right:10px;vertical-align:top"
+                  class="info-table-monospace"
                 >
                   <span>
                     string
                   </span>
                 </td>
-                <td
-                  style="padding-right:10px;vertical-align:top"
-                >
+                <td>
                   yes
                 </td>
-                <td
-                  style="padding-right:10px;vertical-align:top"
-                >
+                <td>
                   -
                 </td>
-                <td
-                  style="padding-right:10px;vertical-align:top"
-                />
+                <td />
               </tr>
               <tr>
                 <td
-                  style="padding-right:10px;vertical-align:top"
+                  class="info-table-monospace"
                 >
                   onClick
                 </td>
                 <td
-                  style="padding-right:10px;vertical-align:top"
+                  class="info-table-monospace"
                 >
                   <span>
                     func
                   </span>
                 </td>
-                <td
-                  style="padding-right:10px;vertical-align:top"
-                >
+                <td>
                   -
                 </td>
-                <td
-                  style="padding-right:10px;vertical-align:top"
-                >
+                <td>
                   <span>
                     onClick
                   </span>
                 </td>
-                <td
-                  style="padding-right:10px;vertical-align:top"
-                />
+                <td />
               </tr>
               <tr>
                 <td
-                  style="padding-right:10px;vertical-align:top"
+                  class="info-table-monospace"
                 >
                   style
                 </td>
                 <td
-                  style="padding-right:10px;vertical-align:top"
+                  class="info-table-monospace"
                 >
                   <span>
                     other
                   </span>
                 </td>
-                <td
-                  style="padding-right:10px;vertical-align:top"
-                >
+                <td>
                   -
                 </td>
-                <td
-                  style="padding-right:10px;vertical-align:top"
-                >
+                <td>
                   <span>
                     {}
                   </span>
                 </td>
-                <td
-                  style="padding-right:10px;vertical-align:top"
-                />
+                <td />
               </tr>
             </tbody>
           </table>
@@ -3100,32 +2818,24 @@ exports[`Storyshots Addons|Info/Options.propTables Shows additional component pr
             >
               "BaseButton" Component
             </h3>
-            <table>
+            <table
+              class="info-table"
+            >
               <thead>
                 <tr>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     property
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     propType
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     required
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     default
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     description
                   </th>
                 </tr>
@@ -3133,117 +2843,93 @@ exports[`Storyshots Addons|Info/Options.propTables Shows additional component pr
               <tbody>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     disabled
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       bool
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       false
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     label
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       string
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     yes
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     onClick
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       func
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     style
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       {}
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
               </tbody>
             </table>
@@ -3254,32 +2940,24 @@ exports[`Storyshots Addons|Info/Options.propTables Shows additional component pr
             >
               "FlowTypeButton" Component
             </h3>
-            <table>
+            <table
+              class="info-table"
+            >
               <thead>
                 <tr>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     property
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     propType
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     required
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     default
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     description
                   </th>
                 </tr>
@@ -3287,61 +2965,49 @@ exports[`Storyshots Addons|Info/Options.propTables Shows additional component pr
               <tbody>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     disabled
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       unknown
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       false
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     onClick
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       unknown
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
               </tbody>
             </table>
@@ -3543,32 +3209,24 @@ exports[`Storyshots Addons|Info/Options.propTablesExclude Exclude component from
             >
               "BaseButton" Component
             </h3>
-            <table>
+            <table
+              class="info-table"
+            >
               <thead>
                 <tr>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     property
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     propType
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     required
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     default
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     description
                   </th>
                 </tr>
@@ -3576,117 +3234,93 @@ exports[`Storyshots Addons|Info/Options.propTablesExclude Exclude component from
               <tbody>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     disabled
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       bool
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       false
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     label
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       string
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     yes
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     onClick
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       func
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     style
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       {}
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
               </tbody>
             </table>
@@ -3766,32 +3400,24 @@ exports[`Storyshots Addons|Info/Options.source Shows or hides Info Addon source
             >
               "BaseButton" Component
             </h3>
-            <table>
+            <table
+              class="info-table"
+            >
               <thead>
                 <tr>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     property
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     propType
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     required
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     default
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     description
                   </th>
                 </tr>
@@ -3799,117 +3425,93 @@ exports[`Storyshots Addons|Info/Options.source Shows or hides Info Addon source
               <tbody>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     disabled
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       bool
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       false
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     label
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       string
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     yes
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     onClick
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       func
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     style
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       {}
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
               </tbody>
             </table>
@@ -4034,32 +3636,24 @@ exports[`Storyshots Addons|Info/Options.styles Extend info styles with an object
             >
               "BaseButton" Component
             </h3>
-            <table>
+            <table
+              class="info-table"
+            >
               <thead>
                 <tr>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     property
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     propType
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     required
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     default
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     description
                   </th>
                 </tr>
@@ -4067,117 +3661,93 @@ exports[`Storyshots Addons|Info/Options.styles Extend info styles with an object
               <tbody>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     disabled
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       bool
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       false
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     label
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       string
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     yes
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     onClick
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       func
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     style
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       {}
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
               </tbody>
             </table>
@@ -4302,32 +3872,24 @@ exports[`Storyshots Addons|Info/Options.styles Full control over styles using a
             >
               "BaseButton" Component
             </h3>
-            <table>
+            <table
+              class="info-table"
+            >
               <thead>
                 <tr>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     property
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     propType
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     required
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     default
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     description
                   </th>
                 </tr>
@@ -4335,117 +3897,93 @@ exports[`Storyshots Addons|Info/Options.styles Full control over styles using a
               <tbody>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     disabled
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       bool
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       false
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     label
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       string
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     yes
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     onClick
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       func
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     style
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       {}
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
               </tbody>
             </table>
@@ -4625,32 +4163,24 @@ exports[`Storyshots Addons|Info/Parameters Overwrite the parameters with markdow
             >
               "BaseButton" Component
             </h3>
-            <table>
+            <table
+              class="info-table"
+            >
               <thead>
                 <tr>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     property
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     propType
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     required
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     default
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     description
                   </th>
                 </tr>
@@ -4658,117 +4188,93 @@ exports[`Storyshots Addons|Info/Parameters Overwrite the parameters with markdow
               <tbody>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     disabled
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       bool
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       false
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     label
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       string
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     yes
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     onClick
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       func
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     style
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       {}
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
               </tbody>
             </table>
@@ -4908,32 +4414,24 @@ exports[`Storyshots Addons|Info/Parameters Overwrite the text parameter with mar
           >
             "BaseButton" Component
           </h3>
-          <table>
+          <table
+            class="info-table"
+          >
             <thead>
               <tr>
-                <th
-                  style="text-align:left;vertical-align:top"
-                >
+                <th>
                   property
                 </th>
-                <th
-                  style="text-align:left;vertical-align:top"
-                >
+                <th>
                   propType
                 </th>
-                <th
-                  style="text-align:left;vertical-align:top"
-                >
+                <th>
                   required
                 </th>
-                <th
-                  style="text-align:left;vertical-align:top"
-                >
+                <th>
                   default
                 </th>
-                <th
-                  style="text-align:left;vertical-align:top"
-                >
+                <th>
                   description
                 </th>
               </tr>
@@ -4941,117 +4439,93 @@ exports[`Storyshots Addons|Info/Parameters Overwrite the text parameter with mar
             <tbody>
               <tr>
                 <td
-                  style="padding-right:10px;vertical-align:top"
+                  class="info-table-monospace"
                 >
                   disabled
                 </td>
                 <td
-                  style="padding-right:10px;vertical-align:top"
+                  class="info-table-monospace"
                 >
                   <span>
                     bool
                   </span>
                 </td>
-                <td
-                  style="padding-right:10px;vertical-align:top"
-                >
+                <td>
                   -
                 </td>
-                <td
-                  style="padding-right:10px;vertical-align:top"
-                >
+                <td>
                   <span>
                     false
                   </span>
                 </td>
-                <td
-                  style="padding-right:10px;vertical-align:top"
-                />
+                <td />
               </tr>
               <tr>
                 <td
-                  style="padding-right:10px;vertical-align:top"
+                  class="info-table-monospace"
                 >
                   label
                 </td>
                 <td
-                  style="padding-right:10px;vertical-align:top"
+                  class="info-table-monospace"
                 >
                   <span>
                     string
                   </span>
                 </td>
-                <td
-                  style="padding-right:10px;vertical-align:top"
-                >
+                <td>
                   yes
                 </td>
-                <td
-                  style="padding-right:10px;vertical-align:top"
-                >
+                <td>
                   -
                 </td>
-                <td
-                  style="padding-right:10px;vertical-align:top"
-                />
+                <td />
               </tr>
               <tr>
                 <td
-                  style="padding-right:10px;vertical-align:top"
+                  class="info-table-monospace"
                 >
                   onClick
                 </td>
                 <td
-                  style="padding-right:10px;vertical-align:top"
+                  class="info-table-monospace"
                 >
                   <span>
                     func
                   </span>
                 </td>
-                <td
-                  style="padding-right:10px;vertical-align:top"
-                >
+                <td>
                   -
                 </td>
-                <td
-                  style="padding-right:10px;vertical-align:top"
-                >
+                <td>
                   <span>
                     onClick
                   </span>
                 </td>
-                <td
-                  style="padding-right:10px;vertical-align:top"
-                />
+                <td />
               </tr>
               <tr>
                 <td
-                  style="padding-right:10px;vertical-align:top"
+                  class="info-table-monospace"
                 >
                   style
                 </td>
                 <td
-                  style="padding-right:10px;vertical-align:top"
+                  class="info-table-monospace"
                 >
                   <span>
                     other
                   </span>
                 </td>
-                <td
-                  style="padding-right:10px;vertical-align:top"
-                >
+                <td>
                   -
                 </td>
-                <td
-                  style="padding-right:10px;vertical-align:top"
-                >
+                <td>
                   <span>
                     {}
                   </span>
                 </td>
-                <td
-                  style="padding-right:10px;vertical-align:top"
-                />
+                <td />
               </tr>
             </tbody>
           </table>
@@ -5172,32 +4646,24 @@ exports[`Storyshots Addons|Info/Parameters Overwriting and extending the paramet
           >
             "BaseButton" Component
           </h3>
-          <table>
+          <table
+            class="info-table"
+          >
             <thead>
               <tr>
-                <th
-                  style="text-align:left;vertical-align:top"
-                >
+                <th>
                   property
                 </th>
-                <th
-                  style="text-align:left;vertical-align:top"
-                >
+                <th>
                   propType
                 </th>
-                <th
-                  style="text-align:left;vertical-align:top"
-                >
+                <th>
                   required
                 </th>
-                <th
-                  style="text-align:left;vertical-align:top"
-                >
+                <th>
                   default
                 </th>
-                <th
-                  style="text-align:left;vertical-align:top"
-                >
+                <th>
                   description
                 </th>
               </tr>
@@ -5205,90 +4671,72 @@ exports[`Storyshots Addons|Info/Parameters Overwriting and extending the paramet
             <tbody>
               <tr>
                 <td
-                  style="padding-right:10px;vertical-align:top"
+                  class="info-table-monospace"
                 >
                   disabled
                 </td>
                 <td
-                  style="padding-right:10px;vertical-align:top"
+                  class="info-table-monospace"
                 >
                   <span>
                     bool
                   </span>
                 </td>
-                <td
-                  style="padding-right:10px;vertical-align:top"
-                >
+                <td>
                   -
                 </td>
-                <td
-                  style="padding-right:10px;vertical-align:top"
-                >
+                <td>
                   <span>
                     false
                   </span>
                 </td>
-                <td
-                  style="padding-right:10px;vertical-align:top"
-                />
+                <td />
               </tr>
               <tr>
                 <td
-                  style="padding-right:10px;vertical-align:top"
+                  class="info-table-monospace"
                 >
                   onClick
                 </td>
                 <td
-                  style="padding-right:10px;vertical-align:top"
+                  class="info-table-monospace"
                 >
                   <span>
                     func
                   </span>
                 </td>
-                <td
-                  style="padding-right:10px;vertical-align:top"
-                >
+                <td>
                   -
                 </td>
-                <td
-                  style="padding-right:10px;vertical-align:top"
-                >
+                <td>
                   <span>
                     onClick
                   </span>
                 </td>
-                <td
-                  style="padding-right:10px;vertical-align:top"
-                />
+                <td />
               </tr>
               <tr>
                 <td
-                  style="padding-right:10px;vertical-align:top"
+                  class="info-table-monospace"
                 >
                   style
                 </td>
                 <td
-                  style="padding-right:10px;vertical-align:top"
+                  class="info-table-monospace"
                 >
                   <span>
                     other
                   </span>
                 </td>
-                <td
-                  style="padding-right:10px;vertical-align:top"
-                >
+                <td>
                   -
                 </td>
-                <td
-                  style="padding-right:10px;vertical-align:top"
-                >
+                <td>
                   <span>
                     {}
                   </span>
                 </td>
-                <td
-                  style="padding-right:10px;vertical-align:top"
-                />
+                <td />
               </tr>
             </tbody>
           </table>
@@ -5409,32 +4857,24 @@ exports[`Storyshots Addons|Info/Parameters Using paramaters across all stories 1
           >
             "BaseButton" Component
           </h3>
-          <table>
+          <table
+            class="info-table"
+          >
             <thead>
               <tr>
-                <th
-                  style="text-align:left;vertical-align:top"
-                >
+                <th>
                   property
                 </th>
-                <th
-                  style="text-align:left;vertical-align:top"
-                >
+                <th>
                   propType
                 </th>
-                <th
-                  style="text-align:left;vertical-align:top"
-                >
+                <th>
                   required
                 </th>
-                <th
-                  style="text-align:left;vertical-align:top"
-                >
+                <th>
                   default
                 </th>
-                <th
-                  style="text-align:left;vertical-align:top"
-                >
+                <th>
                   description
                 </th>
               </tr>
@@ -5442,117 +4882,93 @@ exports[`Storyshots Addons|Info/Parameters Using paramaters across all stories 1
             <tbody>
               <tr>
                 <td
-                  style="padding-right:10px;vertical-align:top"
+                  class="info-table-monospace"
                 >
                   disabled
                 </td>
                 <td
-                  style="padding-right:10px;vertical-align:top"
+                  class="info-table-monospace"
                 >
                   <span>
                     bool
                   </span>
                 </td>
-                <td
-                  style="padding-right:10px;vertical-align:top"
-                >
+                <td>
                   -
                 </td>
-                <td
-                  style="padding-right:10px;vertical-align:top"
-                >
+                <td>
                   <span>
                     false
                   </span>
                 </td>
-                <td
-                  style="padding-right:10px;vertical-align:top"
-                />
+                <td />
               </tr>
               <tr>
                 <td
-                  style="padding-right:10px;vertical-align:top"
+                  class="info-table-monospace"
                 >
                   label
                 </td>
                 <td
-                  style="padding-right:10px;vertical-align:top"
+                  class="info-table-monospace"
                 >
                   <span>
                     string
                   </span>
                 </td>
-                <td
-                  style="padding-right:10px;vertical-align:top"
-                >
+                <td>
                   yes
                 </td>
-                <td
-                  style="padding-right:10px;vertical-align:top"
-                >
+                <td>
                   -
                 </td>
-                <td
-                  style="padding-right:10px;vertical-align:top"
-                />
+                <td />
               </tr>
               <tr>
                 <td
-                  style="padding-right:10px;vertical-align:top"
+                  class="info-table-monospace"
                 >
                   onClick
                 </td>
                 <td
-                  style="padding-right:10px;vertical-align:top"
+                  class="info-table-monospace"
                 >
                   <span>
                     func
                   </span>
                 </td>
-                <td
-                  style="padding-right:10px;vertical-align:top"
-                >
+                <td>
                   -
                 </td>
-                <td
-                  style="padding-right:10px;vertical-align:top"
-                >
+                <td>
                   <span>
                     onClick
                   </span>
                 </td>
-                <td
-                  style="padding-right:10px;vertical-align:top"
-                />
+                <td />
               </tr>
               <tr>
                 <td
-                  style="padding-right:10px;vertical-align:top"
+                  class="info-table-monospace"
                 >
                   style
                 </td>
                 <td
-                  style="padding-right:10px;vertical-align:top"
+                  class="info-table-monospace"
                 >
                   <span>
                     other
                   </span>
                 </td>
-                <td
-                  style="padding-right:10px;vertical-align:top"
-                >
+                <td>
                   -
                 </td>
-                <td
-                  style="padding-right:10px;vertical-align:top"
-                >
+                <td>
                   <span>
                     {}
                   </span>
                 </td>
-                <td
-                  style="padding-right:10px;vertical-align:top"
-                />
+                <td />
               </tr>
             </tbody>
           </table>
@@ -5703,32 +5119,24 @@ exports[`Storyshots Addons|Info/React Docgen Comments from Flow declarations 1`]
             >
               "FlowTypeButton" Component
             </h3>
-            <table>
+            <table
+              class="info-table"
+            >
               <thead>
                 <tr>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     property
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     propType
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     required
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     default
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     description
                   </th>
                 </tr>
@@ -5736,61 +5144,49 @@ exports[`Storyshots Addons|Info/React Docgen Comments from Flow declarations 1`]
               <tbody>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     disabled
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       unknown
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       false
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     onClick
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       unknown
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
               </tbody>
             </table>
@@ -6143,32 +5539,24 @@ exports[`Storyshots Addons|Info/React Docgen Comments from PropType declarations
             >
               "DocgenButton" Component
             </h3>
-            <table>
+            <table
+              class="info-table"
+            >
               <thead>
                 <tr>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     property
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     propType
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     required
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     default
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     description
                   </th>
                 </tr>
@@ -6176,110 +5564,88 @@ exports[`Storyshots Addons|Info/React Docgen Comments from PropType declarations
               <tbody>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     disabled
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       bool
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       false
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     label
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       string
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     yes
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     onClick
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       func
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     one
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       {
                       <span>
@@ -6294,31 +5660,25 @@ exports[`Storyshots Addons|Info/React Docgen Comments from PropType declarations
                       }
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     two
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       {
                       <span>
@@ -6363,31 +5723,25 @@ exports[`Storyshots Addons|Info/React Docgen Comments from PropType declarations
                       }
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     obj
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       object
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       {
                       <span>
@@ -6402,31 +5756,25 @@ exports[`Storyshots Addons|Info/React Docgen Comments from PropType declarations
                       }
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     shape
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       {
                       <span>
@@ -6485,31 +5833,25 @@ exports[`Storyshots Addons|Info/React Docgen Comments from PropType declarations
                       }
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     arrayOf
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       [
                       <span>
@@ -6532,154 +5874,122 @@ exports[`Storyshots Addons|Info/React Docgen Comments from PropType declarations
                       ]
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     msg
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       {}
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     enm
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       News
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     enmEval
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       Photos
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     union
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       hello
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     optionalString
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       string
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       Default String
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
               </tbody>
             </table>
@@ -6831,32 +6141,24 @@ exports[`Storyshots Addons|Info/React Docgen Comments from component declaration
             >
               "BaseButton" Component
             </h3>
-            <table>
+            <table
+              class="info-table"
+            >
               <thead>
                 <tr>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     property
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     propType
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     required
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     default
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     description
                   </th>
                 </tr>
@@ -6864,117 +6166,93 @@ exports[`Storyshots Addons|Info/React Docgen Comments from component declaration
               <tbody>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     disabled
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       bool
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       false
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     label
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       string
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     yes
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     onClick
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       func
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     style
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       {}
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
               </tbody>
             </table>
@@ -7126,32 +6404,24 @@ exports[`Storyshots Addons|Info/React Docgen Comments from named export componen
             >
               "NamedExportButton" Component
             </h3>
-            <table>
+            <table
+              class="info-table"
+            >
               <thead>
                 <tr>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     property
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     propType
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     required
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     default
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     description
                   </th>
                 </tr>
@@ -7159,117 +6429,93 @@ exports[`Storyshots Addons|Info/React Docgen Comments from named export componen
               <tbody>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     disabled
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       bool
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       false
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     label
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       string
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     yes
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     onClick
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       func
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     style
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       {}
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
               </tbody>
             </table>
@@ -7757,32 +7003,24 @@ exports[`Storyshots Addons|Info/Story Source Array prop 1`] = `
             >
               "TableComponent" Component
             </h3>
-            <table>
+            <table
+              class="info-table"
+            >
               <thead>
                 <tr>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     property
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     propType
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     required
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     default
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     description
                   </th>
                 </tr>
@@ -7790,32 +7028,26 @@ exports[`Storyshots Addons|Info/Story Source Array prop 1`] = `
               <tbody>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     propDefinitions
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       []
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
               </tbody>
             </table>
@@ -8024,32 +7256,24 @@ exports[`Storyshots Addons|Info/Story Source Children 1`] = `
             >
               "BaseButton" Component
             </h3>
-            <table>
+            <table
+              class="info-table"
+            >
               <thead>
                 <tr>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     property
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     propType
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     required
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     default
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     description
                   </th>
                 </tr>
@@ -8057,117 +7281,93 @@ exports[`Storyshots Addons|Info/Story Source Children 1`] = `
               <tbody>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     disabled
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       bool
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       false
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     label
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       string
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     yes
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     onClick
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       func
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     style
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       {}
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
               </tbody>
             </table>
@@ -8317,32 +7517,24 @@ exports[`Storyshots Addons|Info/Story Source Many props 1`] = `
             >
               "BaseButton" Component
             </h3>
-            <table>
+            <table
+              class="info-table"
+            >
               <thead>
                 <tr>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     property
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     propType
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     required
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     default
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     description
                   </th>
                 </tr>
@@ -8350,117 +7542,93 @@ exports[`Storyshots Addons|Info/Story Source Many props 1`] = `
               <tbody>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     disabled
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       bool
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       false
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     label
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       string
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     yes
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     onClick
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       func
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     style
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       {}
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
               </tbody>
             </table>
@@ -8670,32 +7838,24 @@ exports[`Storyshots Addons|Info/Story Source Object prop 1`] = `
             >
               "BaseButton" Component
             </h3>
-            <table>
+            <table
+              class="info-table"
+            >
               <thead>
                 <tr>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     property
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     propType
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     required
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     default
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     description
                   </th>
                 </tr>
@@ -8703,117 +7863,93 @@ exports[`Storyshots Addons|Info/Story Source Object prop 1`] = `
               <tbody>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     disabled
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       bool
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       false
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     label
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       string
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     yes
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     onClick
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       func
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     style
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       {}
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
               </tbody>
             </table>
@@ -8938,32 +8074,24 @@ exports[`Storyshots Addons|Info/Story Source One prop 1`] = `
             >
               "BaseButton" Component
             </h3>
-            <table>
+            <table
+              class="info-table"
+            >
               <thead>
                 <tr>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     property
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     propType
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     required
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     default
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     description
                   </th>
                 </tr>
@@ -8971,117 +8099,93 @@ exports[`Storyshots Addons|Info/Story Source One prop 1`] = `
               <tbody>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     disabled
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       bool
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       false
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     label
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       string
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     yes
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     onClick
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       func
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     style
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       {}
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
               </tbody>
             </table>
@@ -9253,32 +8357,24 @@ exports[`Storyshots Addons|Info/deprecated Displays Markdown in description 1`]
             >
               "BaseButton" Component
             </h3>
-            <table>
+            <table
+              class="info-table"
+            >
               <thead>
                 <tr>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     property
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     propType
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     required
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     default
                   </th>
-                  <th
-                    style="text-align:left;vertical-align:top"
-                  >
+                  <th>
                     description
                   </th>
                 </tr>
@@ -9286,117 +8382,93 @@ exports[`Storyshots Addons|Info/deprecated Displays Markdown in description 1`]
               <tbody>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     disabled
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       bool
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       false
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     label
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       string
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     yes
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     onClick
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       func
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
                 <tr>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     style
                   </td>
                   <td
-                    style="padding-right:10px;vertical-align:top"
+                    class="info-table-monospace"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     -
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  >
+                  <td>
                     <span>
                       {}
                     </span>
                   </td>
-                  <td
-                    style="padding-right:10px;vertical-align:top"
-                  />
+                  <td />
                 </tr>
               </tbody>
             </table>
diff --git a/examples/official-storybook/stories/core/decorators.stories.js b/examples/official-storybook/stories/core/decorators.stories.js
new file mode 100644
index 00000000000..2edb62f9d66
--- /dev/null
+++ b/examples/official-storybook/stories/core/decorators.stories.js
@@ -0,0 +1,39 @@
+import React from 'react';
+
+// We would need to add this in config.js idomatically however that would make this file a bit confusing
+import { addDecorator } from '@storybook/react';
+
+addDecorator((s, { kind }) =>
+  kind === 'Core|Decorators' ? (
+    <>
+      <p>Global Decorator</p>
+      {s()}
+    </>
+  ) : (
+    s()
+  )
+);
+
+export default {
+  title: 'Core|Decorators',
+  decorators: [
+    s => (
+      <>
+        <p>Kind Decorator</p>
+        {s()}
+      </>
+    ),
+  ],
+};
+
+export const all = () => <p>Story</p>;
+all.parameters = {
+  decorators: [
+    s => (
+      <>
+        <p>Local Decorator</p>
+        {s()}
+      </>
+    ),
+  ],
+};
diff --git a/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap b/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
index a2c80ea1e62..9e583358900 100644
--- a/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
+++ b/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
@@ -2535,6 +2535,23 @@ exports[`Storyshots Basics|Placeholder twoChildren 1`] = `
 </div>
 `;
 
+exports[`Storyshots Core|Decorators all 1`] = `
+Array [
+  <p>
+    Global Decorator
+  </p>,
+  <p>
+    Kind Decorator
+  </p>,
+  <p>
+    Local Decorator
+  </p>,
+  <p>
+    Story
+  </p>,
+]
+`;
+
 exports[`Storyshots Core|Events Force re-render 1`] = `
 .emotion-0 {
   border: 0;
@@ -3461,73 +3478,16 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
 }
 
 .emotion-8 {
-  color: #999999;
-  height: 40px;
-  overflow: auto;
-  overflow-x: auto;
   overflow-y: hidden;
-  -webkit-scrollbar-width: slim;
-  -moz-scrollbar-width: slim;
-  -ms-scrollbar-width: slim;
-  scrollbar-width: slim;
-  -webkit-scrollbar-width: 3px;
-  -moz-scrollbar-width: 3px;
-  -ms-scrollbar-width: 3px;
-  scrollbar-width: 3px;
-  -webkit-scrollbar-color: transparent transparent;
-  -moz-scrollbar-color: transparent transparent;
-  -ms-scrollbar-color: transparent transparent;
-  scrollbar-color: transparent transparent;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
-}
-
-.emotion-8:hover {
-  -webkit-scrollbar-width: none;
-  -moz-scrollbar-width: none;
-  -ms-scrollbar-width: none;
-  scrollbar-width: none;
-  -webkit-scrollbar-width: 0;
-  -moz-scrollbar-width: 0;
-  -ms-scrollbar-width: 0;
-  scrollbar-width: 0;
-}
-
-.emotion-8::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  box-shadow: none;
-  display: none;
-}
-
-.emotion-8:hover::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  display: block;
-}
-
-.emotion-8::-webkit-scrollbar-track {
-  border-radius: 0;
-  background: transparent;
-  opacity: 0;
-  border: 0 none;
-  box-shadow: none;
-  height: 0;
-  width: 0;
-}
-
-.emotion-8::-webkit-scrollbar-thumb {
-  border-radius: 0;
-  background: rgba(0,0,0,.1);
-  box-shadow: none;
-}
-
-.emotion-8::-webkit-scrollbar-track-piece {
-  display: none;
-  border: 0 none;
-  opacity: 0;
-  visibility: hidden;
+  overflow-x: auto;
+  color: #999999;
+  width: 100%;
+  height: 40px;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  box-shadow: rgba(0,0,0,.1) 0 -1px 0 0 inset;
+  background: #FFFFFF;
 }
 
 .emotion-7 {
@@ -3540,7 +3500,12 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   -ms-flex-pack: justify;
   justify-content: space-between;
   position: relative;
-  white-space: nowrap;
+  -webkit-flex-wrap: nowrap;
+  -ms-flex-wrap: nowrap;
+  flex-wrap: nowrap;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
   height: 40px;
 }
 
@@ -3549,6 +3514,7 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
+  white-space: nowrap;
   -webkit-flex-basis: auto;
   -ms-flex-preferred-size: auto;
   flex-basis: auto;
@@ -3619,6 +3585,7 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
+  white-space: nowrap;
   -webkit-flex-basis: auto;
   -ms-flex-preferred-size: auto;
   flex-basis: auto;
@@ -3648,12 +3615,23 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   display: block;
   position: relative;
   font-size: 13px;
-  position: relative;
+  height: calc(100% - 40px);
+  position: absolute;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  top: 40px;
+  overflow: auto;
+}
+
+.emotion-99 > *:first-child {
+  position: absolute;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  top: 0;
+  height: 100%;
   overflow: auto;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  width: 100%;
 }
 
 .emotion-5 {
@@ -3992,73 +3970,16 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
 }
 
 .emotion-8 {
-  color: #999999;
-  height: 40px;
-  overflow: auto;
-  overflow-x: auto;
   overflow-y: hidden;
-  -webkit-scrollbar-width: slim;
-  -moz-scrollbar-width: slim;
-  -ms-scrollbar-width: slim;
-  scrollbar-width: slim;
-  -webkit-scrollbar-width: 3px;
-  -moz-scrollbar-width: 3px;
-  -ms-scrollbar-width: 3px;
-  scrollbar-width: 3px;
-  -webkit-scrollbar-color: transparent transparent;
-  -moz-scrollbar-color: transparent transparent;
-  -ms-scrollbar-color: transparent transparent;
-  scrollbar-color: transparent transparent;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
-}
-
-.emotion-8:hover {
-  -webkit-scrollbar-width: none;
-  -moz-scrollbar-width: none;
-  -ms-scrollbar-width: none;
-  scrollbar-width: none;
-  -webkit-scrollbar-width: 0;
-  -moz-scrollbar-width: 0;
-  -ms-scrollbar-width: 0;
-  scrollbar-width: 0;
-}
-
-.emotion-8::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  box-shadow: none;
-  display: none;
-}
-
-.emotion-8:hover::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  display: block;
-}
-
-.emotion-8::-webkit-scrollbar-track {
-  border-radius: 0;
-  background: transparent;
-  opacity: 0;
-  border: 0 none;
-  box-shadow: none;
-  height: 0;
-  width: 0;
-}
-
-.emotion-8::-webkit-scrollbar-thumb {
-  border-radius: 0;
-  background: rgba(0,0,0,.1);
-  box-shadow: none;
-}
-
-.emotion-8::-webkit-scrollbar-track-piece {
-  display: none;
-  border: 0 none;
-  opacity: 0;
-  visibility: hidden;
+  overflow-x: auto;
+  color: #999999;
+  width: 100%;
+  height: 40px;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  box-shadow: rgba(0,0,0,.1) 0 -1px 0 0 inset;
+  background: #FFFFFF;
 }
 
 .emotion-7 {
@@ -4071,7 +3992,12 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   -ms-flex-pack: justify;
   justify-content: space-between;
   position: relative;
-  white-space: nowrap;
+  -webkit-flex-wrap: nowrap;
+  -ms-flex-wrap: nowrap;
+  flex-wrap: nowrap;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
   height: 40px;
 }
 
@@ -4080,6 +4006,7 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
+  white-space: nowrap;
   -webkit-flex-basis: auto;
   -ms-flex-preferred-size: auto;
   flex-basis: auto;
@@ -4150,6 +4077,7 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
+  white-space: nowrap;
   -webkit-flex-basis: auto;
   -ms-flex-preferred-size: auto;
   flex-basis: auto;
@@ -4179,12 +4107,23 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   display: block;
   position: relative;
   font-size: 13px;
-  position: relative;
+  height: calc(100% - 40px);
+  position: absolute;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  top: 40px;
+  overflow: auto;
+}
+
+.emotion-99 > *:first-child {
+  position: absolute;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  top: 0;
+  height: 100%;
   overflow: auto;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  width: 100%;
 }
 
 .emotion-5 {
@@ -4514,43 +4453,84 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
 >
   <div
     class="emotion-8"
+    data-simplebar="true"
   >
     <div
-      class="emotion-7"
+      class="simplebar-wrapper"
     >
       <div
-        class="emotion-2"
+        class="simplebar-height-auto-observer-wrapper"
       >
         <div
-          class="emotion-1"
-          role="tablist"
+          class="simplebar-height-auto-observer"
+        />
+      </div>
+      <div
+        class="simplebar-mask"
+      >
+        <div
+          class="simplebar-offset"
         >
-          <button
-            class="emotion-0"
-            role="tab"
-            type="button"
+          <div
+            class="simplebar-content"
           >
-            Keyboard Shortcuts
-          </button>
+            <div
+              class="emotion-7"
+            >
+              <div
+                class="emotion-2"
+              >
+                <div
+                  class="emotion-1"
+                  role="tablist"
+                >
+                  <button
+                    class="emotion-0"
+                    role="tab"
+                    type="button"
+                  >
+                    Keyboard Shortcuts
+                  </button>
+                </div>
+              </div>
+              <div
+                class="emotion-6"
+              >
+                <button
+                  class="emotion-5"
+                >
+                  <svg
+                    class="emotion-4"
+                    viewBox="0 0 1024 1024"
+                  >
+                    <path
+                      class="emotion-3"
+                      d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
+                    />
+                  </svg>
+                </button>
+              </div>
+            </div>
+          </div>
         </div>
       </div>
       <div
-        class="emotion-6"
-      >
-        <button
-          class="emotion-5"
-        >
-          <svg
-            class="emotion-4"
-            viewBox="0 0 1024 1024"
-          >
-            <path
-              class="emotion-3"
-              d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
-            />
-          </svg>
-        </button>
-      </div>
+        class="simplebar-placeholder"
+      />
+    </div>
+    <div
+      class="simplebar-track simplebar-horizontal"
+    >
+      <div
+        class="simplebar-scrollbar"
+      />
+    </div>
+    <div
+      class="simplebar-track simplebar-vertical"
+    >
+      <div
+        class="simplebar-scrollbar"
+      />
     </div>
   </div>
   <div
diff --git a/lib/client-api/src/client_api.js b/lib/client-api/src/client_api.js
index a1e259d139e..45a854a5a7b 100644
--- a/lib/client-api/src/client_api.js
+++ b/lib/client-api/src/client_api.js
@@ -203,7 +203,12 @@ export default class ClientApi {
         },
         {
           applyDecorators: this._decorateStory,
-          getDecorators: () => [...localDecorators, ..._globalDecorators, withSubscriptionTracking],
+          getDecorators: () => [
+            ...(allParam.decorators || []),
+            ...localDecorators,
+            ..._globalDecorators,
+            withSubscriptionTracking,
+          ],
         }
       );
       return api;
diff --git a/lib/components/src/syntaxhighlighter/__snapshots__/syntaxhighlighter.stories.storyshot b/lib/components/src/syntaxhighlighter/__snapshots__/syntaxhighlighter.stories.storyshot
index 83209e363fb..bb700664b9a 100644
--- a/lib/components/src/syntaxhighlighter/__snapshots__/syntaxhighlighter.stories.storyshot
+++ b/lib/components/src/syntaxhighlighter/__snapshots__/syntaxhighlighter.stories.storyshot
@@ -1,6 +1,19 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Storyshots Basics|SyntaxHighlighter bash 1`] = `
+.emotion-0 {
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  padding-right: 0;
+  opacity: 1;
+}
+
+.emotion-3 {
+  position: relative;
+  overflow: hidden;
+}
+
 .emotion-2 {
   position: relative;
   overflow: auto;
@@ -156,19 +169,6 @@ exports[`Storyshots Basics|SyntaxHighlighter bash 1`] = `
   opacity: 0.7;
 }
 
-.emotion-0 {
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  padding-right: 0;
-  opacity: 1;
-}
-
-.emotion-3 {
-  position: relative;
-  overflow: hidden;
-}
-
 .emotion-1 {
   display: -webkit-box;
   display: -webkit-flex;
@@ -220,161 +220,6 @@ exports[`Storyshots Basics|SyntaxHighlighter bordered & copy-able 1`] = `
   border: 1px solid rgba(0,0,0,.1);
 }
 
-.emotion-2 {
-  position: relative;
-  overflow: auto;
-}
-
-.emotion-2 code {
-  padding-right: 10px;
-}
-
-.emotion-2 * .token {
-  font-family: "Operator Mono","Fira Code Retina","Fira Code","FiraCode-Retina","Andale Mono","Lucida Console",Consolas,Monaco,monospace;
-  -webkit-font-smoothing: antialiased;
-}
-
-.emotion-2 * .token.comment {
-  color: #008000;
-  font-style: italic;
-}
-
-.emotion-2 * .token.prolog {
-  color: #008000;
-  font-style: italic;
-}
-
-.emotion-2 * .token.doctype {
-  color: #008000;
-  font-style: italic;
-}
-
-.emotion-2 * .token.cdata {
-  color: #008000;
-  font-style: italic;
-}
-
-.emotion-2 * .token.string {
-  color: #A31515;
-}
-
-.emotion-2 * .token.punctuation {
-  color: #393A34;
-}
-
-.emotion-2 * .token.operator {
-  color: #393A34;
-}
-
-.emotion-2 * .token.url {
-  color: #36acaa;
-}
-
-.emotion-2 * .token.symbol {
-  color: #36acaa;
-}
-
-.emotion-2 * .token.number {
-  color: #36acaa;
-}
-
-.emotion-2 * .token.boolean {
-  color: #36acaa;
-}
-
-.emotion-2 * .token.variable {
-  color: #36acaa;
-}
-
-.emotion-2 * .token.constant {
-  color: #36acaa;
-}
-
-.emotion-2 * .token.inserted {
-  color: #36acaa;
-}
-
-.emotion-2 * .token.atrule {
-  color: #0000ff;
-}
-
-.emotion-2 * .token.keyword {
-  color: #0000ff;
-}
-
-.emotion-2 * .token.attr-value {
-  color: #0000ff;
-}
-
-.emotion-2 * .token.function {
-  color: #393A34;
-}
-
-.emotion-2 * .token.deleted {
-  color: #9a050f;
-}
-
-.emotion-2 * .token.important {
-  font-weight: bold;
-}
-
-.emotion-2 * .token.bold {
-  font-weight: bold;
-}
-
-.emotion-2 * .token.italic {
-  font-style: italic;
-}
-
-.emotion-2 * .token.class-name {
-  color: #2B91AF;
-}
-
-.emotion-2 * .token.tag {
-  color: #800000;
-}
-
-.emotion-2 * .token.selector {
-  color: #800000;
-}
-
-.emotion-2 * .token.attr-name {
-  color: #ff0000;
-}
-
-.emotion-2 * .token.property {
-  color: #ff0000;
-}
-
-.emotion-2 * .token.regex {
-  color: #ff0000;
-}
-
-.emotion-2 * .token.entity {
-  color: #ff0000;
-}
-
-.emotion-2 * .token.directive.tag .tag {
-  background: #ffff00;
-  color: #393A34;
-}
-
-.emotion-2 * .language-json .token.boolean {
-  color: #0000ff;
-}
-
-.emotion-2 * .language-json .token.number {
-  color: #0000ff;
-}
-
-.emotion-2 * .language-json .token.property {
-  color: #2B91AF;
-}
-
-.emotion-2 * .namespace {
-  opacity: 0.7;
-}
-
 .emotion-1 {
   display: -webkit-box;
   display: -webkit-flex;
@@ -445,6 +290,161 @@ exports[`Storyshots Basics|SyntaxHighlighter bordered & copy-able 1`] = `
   outline: 0 none;
 }
 
+.emotion-2 {
+  position: relative;
+  overflow: auto;
+}
+
+.emotion-2 code {
+  padding-right: 10px;
+}
+
+.emotion-2 * .token {
+  font-family: "Operator Mono","Fira Code Retina","Fira Code","FiraCode-Retina","Andale Mono","Lucida Console",Consolas,Monaco,monospace;
+  -webkit-font-smoothing: antialiased;
+}
+
+.emotion-2 * .token.comment {
+  color: #008000;
+  font-style: italic;
+}
+
+.emotion-2 * .token.prolog {
+  color: #008000;
+  font-style: italic;
+}
+
+.emotion-2 * .token.doctype {
+  color: #008000;
+  font-style: italic;
+}
+
+.emotion-2 * .token.cdata {
+  color: #008000;
+  font-style: italic;
+}
+
+.emotion-2 * .token.string {
+  color: #A31515;
+}
+
+.emotion-2 * .token.punctuation {
+  color: #393A34;
+}
+
+.emotion-2 * .token.operator {
+  color: #393A34;
+}
+
+.emotion-2 * .token.url {
+  color: #36acaa;
+}
+
+.emotion-2 * .token.symbol {
+  color: #36acaa;
+}
+
+.emotion-2 * .token.number {
+  color: #36acaa;
+}
+
+.emotion-2 * .token.boolean {
+  color: #36acaa;
+}
+
+.emotion-2 * .token.variable {
+  color: #36acaa;
+}
+
+.emotion-2 * .token.constant {
+  color: #36acaa;
+}
+
+.emotion-2 * .token.inserted {
+  color: #36acaa;
+}
+
+.emotion-2 * .token.atrule {
+  color: #0000ff;
+}
+
+.emotion-2 * .token.keyword {
+  color: #0000ff;
+}
+
+.emotion-2 * .token.attr-value {
+  color: #0000ff;
+}
+
+.emotion-2 * .token.function {
+  color: #393A34;
+}
+
+.emotion-2 * .token.deleted {
+  color: #9a050f;
+}
+
+.emotion-2 * .token.important {
+  font-weight: bold;
+}
+
+.emotion-2 * .token.bold {
+  font-weight: bold;
+}
+
+.emotion-2 * .token.italic {
+  font-style: italic;
+}
+
+.emotion-2 * .token.class-name {
+  color: #2B91AF;
+}
+
+.emotion-2 * .token.tag {
+  color: #800000;
+}
+
+.emotion-2 * .token.selector {
+  color: #800000;
+}
+
+.emotion-2 * .token.attr-name {
+  color: #ff0000;
+}
+
+.emotion-2 * .token.property {
+  color: #ff0000;
+}
+
+.emotion-2 * .token.regex {
+  color: #ff0000;
+}
+
+.emotion-2 * .token.entity {
+  color: #ff0000;
+}
+
+.emotion-2 * .token.directive.tag .tag {
+  background: #ffff00;
+  color: #393A34;
+}
+
+.emotion-2 * .language-json .token.boolean {
+  color: #0000ff;
+}
+
+.emotion-2 * .language-json .token.number {
+  color: #0000ff;
+}
+
+.emotion-2 * .language-json .token.property {
+  color: #2B91AF;
+}
+
+.emotion-2 * .namespace {
+  opacity: 0.7;
+}
+
 <div
   class="emotion-5"
 >
@@ -653,6 +653,19 @@ exports[`Storyshots Basics|SyntaxHighlighter bordered & copy-able 1`] = `
 `;
 
 exports[`Storyshots Basics|SyntaxHighlighter jsx 1`] = `
+.emotion-0 {
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  padding-right: 0;
+  opacity: 1;
+}
+
+.emotion-3 {
+  position: relative;
+  overflow: hidden;
+}
+
 .emotion-2 {
   position: relative;
   overflow: auto;
@@ -808,19 +821,6 @@ exports[`Storyshots Basics|SyntaxHighlighter jsx 1`] = `
   opacity: 0.7;
 }
 
-.emotion-0 {
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  padding-right: 0;
-  opacity: 1;
-}
-
-.emotion-3 {
-  position: relative;
-  overflow: hidden;
-}
-
 .emotion-1 {
   display: -webkit-box;
   display: -webkit-flex;
@@ -1063,6 +1063,32 @@ exports[`Storyshots Basics|SyntaxHighlighter jsx 1`] = `
 `;
 
 exports[`Storyshots Basics|SyntaxHighlighter padded 1`] = `
+.emotion-1 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: start;
+  -webkit-justify-content: flex-start;
+  -ms-flex-pack: start;
+  justify-content: flex-start;
+  margin: 0;
+  padding: 10px;
+}
+
+.emotion-0 {
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  padding-right: 0;
+  opacity: 1;
+}
+
+.emotion-3 {
+  position: relative;
+  overflow: hidden;
+}
+
 .emotion-2 {
   position: relative;
   overflow: auto;
@@ -1218,32 +1244,6 @@ exports[`Storyshots Basics|SyntaxHighlighter padded 1`] = `
   opacity: 0.7;
 }
 
-.emotion-1 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-pack: start;
-  -webkit-justify-content: flex-start;
-  -ms-flex-pack: start;
-  justify-content: flex-start;
-  margin: 0;
-  padding: 10px;
-}
-
-.emotion-0 {
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  padding-right: 0;
-  opacity: 1;
-}
-
-.emotion-3 {
-  position: relative;
-  overflow: hidden;
-}
-
 <div
   class="emotion-3"
 >
@@ -1443,6 +1443,19 @@ exports[`Storyshots Basics|SyntaxHighlighter padded 1`] = `
 `;
 
 exports[`Storyshots Basics|SyntaxHighlighter showLineNumbers 1`] = `
+.emotion-0 {
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  padding-right: 0;
+  opacity: 1;
+}
+
+.emotion-3 {
+  position: relative;
+  overflow: hidden;
+}
+
 .emotion-2 {
   position: relative;
   overflow: auto;
@@ -1598,19 +1611,6 @@ exports[`Storyshots Basics|SyntaxHighlighter showLineNumbers 1`] = `
   opacity: 0.7;
 }
 
-.emotion-0 {
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  padding-right: 0;
-  opacity: 1;
-}
-
-.emotion-3 {
-  position: relative;
-  overflow: hidden;
-}
-
 .emotion-1 {
   display: -webkit-box;
   display: -webkit-flex;
@@ -1855,6 +1855,19 @@ exports[`Storyshots Basics|SyntaxHighlighter showLineNumbers 1`] = `
 `;
 
 exports[`Storyshots Basics|SyntaxHighlighter story 1`] = `
+.emotion-0 {
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  padding-right: 0;
+  opacity: 1;
+}
+
+.emotion-3 {
+  position: relative;
+  overflow: hidden;
+}
+
 .emotion-2 {
   position: relative;
   overflow: auto;
@@ -2010,19 +2023,6 @@ exports[`Storyshots Basics|SyntaxHighlighter story 1`] = `
   opacity: 0.7;
 }
 
-.emotion-0 {
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  padding-right: 0;
-  opacity: 1;
-}
-
-.emotion-3 {
-  position: relative;
-  overflow: hidden;
-}
-
 .emotion-1 {
   display: -webkit-box;
   display: -webkit-flex;
diff --git a/lib/components/src/tabs/__snapshots__/tabs.stories.storyshot b/lib/components/src/tabs/__snapshots__/tabs.stories.storyshot
index 172fa52ea43..2d58ee1b12b 100644
--- a/lib/components/src/tabs/__snapshots__/tabs.stories.storyshot
+++ b/lib/components/src/tabs/__snapshots__/tabs.stories.storyshot
@@ -1,107 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Storyshots Basics|Tabs stateful - dynamic 1`] = `
-.emotion-9 {
-  color: #999999;
-  height: 40px;
-  overflow: auto;
-  overflow-x: auto;
-  overflow-y: hidden;
-  -webkit-scrollbar-width: slim;
-  -moz-scrollbar-width: slim;
-  -ms-scrollbar-width: slim;
-  scrollbar-width: slim;
-  -webkit-scrollbar-width: 3px;
-  -moz-scrollbar-width: 3px;
-  -ms-scrollbar-width: 3px;
-  scrollbar-width: 3px;
-  -webkit-scrollbar-color: transparent transparent;
-  -moz-scrollbar-color: transparent transparent;
-  -ms-scrollbar-color: transparent transparent;
-  scrollbar-color: transparent transparent;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
-}
-
-.emotion-9:hover {
-  -webkit-scrollbar-width: none;
-  -moz-scrollbar-width: none;
-  -ms-scrollbar-width: none;
-  scrollbar-width: none;
-  -webkit-scrollbar-width: 0;
-  -moz-scrollbar-width: 0;
-  -ms-scrollbar-width: 0;
-  scrollbar-width: 0;
-}
-
-.emotion-9::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  box-shadow: none;
-  display: none;
-}
-
-.emotion-9:hover::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  display: block;
-}
-
-.emotion-9::-webkit-scrollbar-track {
-  border-radius: 0;
-  background: transparent;
-  opacity: 0;
-  border: 0 none;
-  box-shadow: none;
-  height: 0;
-  width: 0;
-}
-
-.emotion-9::-webkit-scrollbar-thumb {
-  border-radius: 0;
-  background: rgba(0,0,0,.1);
-  box-shadow: none;
-}
-
-.emotion-9::-webkit-scrollbar-track-piece {
-  display: none;
-  border: 0 none;
-  opacity: 0;
-  visibility: hidden;
-}
-
-.emotion-8 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-pack: justify;
-  -webkit-justify-content: space-between;
-  -ms-flex-pack: justify;
-  justify-content: space-between;
-  position: relative;
-  white-space: nowrap;
-  height: 40px;
-}
-
-.emotion-7 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex-basis: auto;
-  -ms-flex-preferred-size: auto;
-  flex-basis: auto;
-  -webkit-flex-shrink: 0;
-  -ms-flex-negative: 0;
-  flex-shrink: 0;
-}
-
-.emotion-7 > * {
-  margin-left: 15px;
-}
-
 .emotion-6 {
   overflow: hidden;
 }
@@ -204,6 +103,107 @@ exports[`Storyshots Basics|Tabs stateful - dynamic 1`] = `
   display: block;
 }
 
+.emotion-9 {
+  color: #999999;
+  height: 40px;
+  overflow: auto;
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-9:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
+.emotion-9::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+  display: none;
+}
+
+.emotion-9:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
+}
+
+.emotion-9::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-9::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-9::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
+}
+
+.emotion-8 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+  position: relative;
+  white-space: nowrap;
+  height: 40px;
+}
+
+.emotion-7 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+}
+
+.emotion-7 > * {
+  margin-left: 15px;
+}
+
 .emotion-11 {
   display: block;
   position: relative;
@@ -350,107 +350,6 @@ exports[`Storyshots Basics|Tabs stateful - dynamic 1`] = `
 `;
 
 exports[`Storyshots Basics|Tabs stateful - no initial 1`] = `
-.emotion-9 {
-  color: #999999;
-  height: 40px;
-  overflow: auto;
-  overflow-x: auto;
-  overflow-y: hidden;
-  -webkit-scrollbar-width: slim;
-  -moz-scrollbar-width: slim;
-  -ms-scrollbar-width: slim;
-  scrollbar-width: slim;
-  -webkit-scrollbar-width: 3px;
-  -moz-scrollbar-width: 3px;
-  -ms-scrollbar-width: 3px;
-  scrollbar-width: 3px;
-  -webkit-scrollbar-color: transparent transparent;
-  -moz-scrollbar-color: transparent transparent;
-  -ms-scrollbar-color: transparent transparent;
-  scrollbar-color: transparent transparent;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
-}
-
-.emotion-9:hover {
-  -webkit-scrollbar-width: none;
-  -moz-scrollbar-width: none;
-  -ms-scrollbar-width: none;
-  scrollbar-width: none;
-  -webkit-scrollbar-width: 0;
-  -moz-scrollbar-width: 0;
-  -ms-scrollbar-width: 0;
-  scrollbar-width: 0;
-}
-
-.emotion-9::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  box-shadow: none;
-  display: none;
-}
-
-.emotion-9:hover::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  display: block;
-}
-
-.emotion-9::-webkit-scrollbar-track {
-  border-radius: 0;
-  background: transparent;
-  opacity: 0;
-  border: 0 none;
-  box-shadow: none;
-  height: 0;
-  width: 0;
-}
-
-.emotion-9::-webkit-scrollbar-thumb {
-  border-radius: 0;
-  background: rgba(0,0,0,.1);
-  box-shadow: none;
-}
-
-.emotion-9::-webkit-scrollbar-track-piece {
-  display: none;
-  border: 0 none;
-  opacity: 0;
-  visibility: hidden;
-}
-
-.emotion-8 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-pack: justify;
-  -webkit-justify-content: space-between;
-  -ms-flex-pack: justify;
-  justify-content: space-between;
-  position: relative;
-  white-space: nowrap;
-  height: 40px;
-}
-
-.emotion-7 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex-basis: auto;
-  -ms-flex-preferred-size: auto;
-  flex-basis: auto;
-  -webkit-flex-shrink: 0;
-  -ms-flex-negative: 0;
-  flex-shrink: 0;
-}
-
-.emotion-7 > * {
-  margin-left: 15px;
-}
-
 .emotion-6 {
   overflow: hidden;
 }
@@ -553,6 +452,107 @@ exports[`Storyshots Basics|Tabs stateful - no initial 1`] = `
   display: block;
 }
 
+.emotion-9 {
+  color: #999999;
+  height: 40px;
+  overflow: auto;
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-9:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
+.emotion-9::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+  display: none;
+}
+
+.emotion-9:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
+}
+
+.emotion-9::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-9::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-9::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
+}
+
+.emotion-8 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+  position: relative;
+  white-space: nowrap;
+  height: 40px;
+}
+
+.emotion-7 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+}
+
+.emotion-7 > * {
+  margin-left: 15px;
+}
+
 .emotion-11 {
   display: block;
   position: relative;
@@ -655,107 +655,6 @@ exports[`Storyshots Basics|Tabs stateful - no initial 1`] = `
 `;
 
 exports[`Storyshots Basics|Tabs stateful - static 1`] = `
-.emotion-5 {
-  color: #999999;
-  height: 40px;
-  overflow: auto;
-  overflow-x: auto;
-  overflow-y: hidden;
-  -webkit-scrollbar-width: slim;
-  -moz-scrollbar-width: slim;
-  -ms-scrollbar-width: slim;
-  scrollbar-width: slim;
-  -webkit-scrollbar-width: 3px;
-  -moz-scrollbar-width: 3px;
-  -ms-scrollbar-width: 3px;
-  scrollbar-width: 3px;
-  -webkit-scrollbar-color: transparent transparent;
-  -moz-scrollbar-color: transparent transparent;
-  -ms-scrollbar-color: transparent transparent;
-  scrollbar-color: transparent transparent;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
-}
-
-.emotion-5:hover {
-  -webkit-scrollbar-width: none;
-  -moz-scrollbar-width: none;
-  -ms-scrollbar-width: none;
-  scrollbar-width: none;
-  -webkit-scrollbar-width: 0;
-  -moz-scrollbar-width: 0;
-  -ms-scrollbar-width: 0;
-  scrollbar-width: 0;
-}
-
-.emotion-5::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  box-shadow: none;
-  display: none;
-}
-
-.emotion-5:hover::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  display: block;
-}
-
-.emotion-5::-webkit-scrollbar-track {
-  border-radius: 0;
-  background: transparent;
-  opacity: 0;
-  border: 0 none;
-  box-shadow: none;
-  height: 0;
-  width: 0;
-}
-
-.emotion-5::-webkit-scrollbar-thumb {
-  border-radius: 0;
-  background: rgba(0,0,0,.1);
-  box-shadow: none;
-}
-
-.emotion-5::-webkit-scrollbar-track-piece {
-  display: none;
-  border: 0 none;
-  opacity: 0;
-  visibility: hidden;
-}
-
-.emotion-4 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-pack: justify;
-  -webkit-justify-content: space-between;
-  -ms-flex-pack: justify;
-  justify-content: space-between;
-  position: relative;
-  white-space: nowrap;
-  height: 40px;
-}
-
-.emotion-3 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex-basis: auto;
-  -ms-flex-preferred-size: auto;
-  flex-basis: auto;
-  -webkit-flex-shrink: 0;
-  -ms-flex-negative: 0;
-  flex-shrink: 0;
-}
-
-.emotion-3 > * {
-  margin-left: 15px;
-}
-
 .emotion-2 {
   overflow: hidden;
 }
@@ -858,6 +757,107 @@ exports[`Storyshots Basics|Tabs stateful - static 1`] = `
   display: block;
 }
 
+.emotion-5 {
+  color: #999999;
+  height: 40px;
+  overflow: auto;
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-5:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
+.emotion-5::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+  display: none;
+}
+
+.emotion-5:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
+}
+
+.emotion-5::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-5::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-5::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
+}
+
+.emotion-4 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+  position: relative;
+  white-space: nowrap;
+  height: 40px;
+}
+
+.emotion-3 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+}
+
+.emotion-3 > * {
+  margin-left: 15px;
+}
+
 .emotion-7 {
   display: block;
   position: relative;
@@ -918,6 +918,104 @@ exports[`Storyshots Basics|Tabs stateful - static 1`] = `
 `;
 
 exports[`Storyshots Basics|Tabs stateless - absolute 1`] = `
+.emotion-6 {
+  overflow: hidden;
+}
+
+.emotion-6:first-of-type {
+  margin-left: 0;
+}
+
+.emotion-0 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
+  font-size: 13px;
+  color: inherit;
+  border-bottom-color: transparent;
+}
+
+.emotion-0:empty {
+  display: none;
+}
+
+.emotion-0:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-2 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
+  font-size: 13px;
+  color: #1EA7FD;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-2:empty {
+  display: none;
+}
+
+.emotion-2:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
 .emotion-9 {
   color: #999999;
   height: 40px;
@@ -1019,116 +1117,6 @@ exports[`Storyshots Basics|Tabs stateless - absolute 1`] = `
   margin-left: 15px;
 }
 
-.emotion-6 {
-  overflow: hidden;
-}
-
-.emotion-6:first-of-type {
-  margin-left: 0;
-}
-
-.emotion-0 {
-  white-space: normal;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding: 0 15px;
-  text-transform: capitalize;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  height: 40px;
-  line-height: 12px;
-  cursor: pointer;
-  background: transparent;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  font-weight: bold;
-  font-size: 13px;
-  color: inherit;
-  border-bottom-color: transparent;
-}
-
-.emotion-0:empty {
-  display: none;
-}
-
-.emotion-0:focus {
-  outline: 0 none;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-2 {
-  white-space: normal;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding: 0 15px;
-  text-transform: capitalize;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  height: 40px;
-  line-height: 12px;
-  cursor: pointer;
-  background: transparent;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  font-weight: bold;
-  font-size: 13px;
-  color: #1EA7FD;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-2:empty {
-  display: none;
-}
-
-.emotion-2:focus {
-  outline: 0 none;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-11 {
-  display: block;
-  position: relative;
-  font-size: 13px;
-  position: relative;
-  overflow: auto;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  width: 100%;
-}
-
 .emotion-10 {
   display: none;
 }
@@ -1148,6 +1136,18 @@ exports[`Storyshots Basics|Tabs stateless - absolute 1`] = `
   flex-direction: column;
 }
 
+.emotion-11 {
+  display: block;
+  position: relative;
+  font-size: 13px;
+  position: relative;
+  overflow: auto;
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  width: 100%;
+}
+
 <div
   style="height:calc(100vh - 20px)"
 >
@@ -1284,6 +1284,104 @@ exports[`Storyshots Basics|Tabs stateless - absolute 1`] = `
 `;
 
 exports[`Storyshots Basics|Tabs stateless - bordered 1`] = `
+.emotion-6 {
+  overflow: hidden;
+}
+
+.emotion-6:first-of-type {
+  margin-left: 0;
+}
+
+.emotion-0 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
+  font-size: 13px;
+  color: inherit;
+  border-bottom-color: transparent;
+}
+
+.emotion-0:empty {
+  display: none;
+}
+
+.emotion-0:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-2 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
+  font-size: 13px;
+  color: #1EA7FD;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-2:empty {
+  display: none;
+}
+
+.emotion-2:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
 .emotion-9 {
   color: #999999;
   height: 40px;
@@ -1385,104 +1483,6 @@ exports[`Storyshots Basics|Tabs stateless - bordered 1`] = `
   margin-left: 15px;
 }
 
-.emotion-6 {
-  overflow: hidden;
-}
-
-.emotion-6:first-of-type {
-  margin-left: 0;
-}
-
-.emotion-0 {
-  white-space: normal;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding: 0 15px;
-  text-transform: capitalize;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  height: 40px;
-  line-height: 12px;
-  cursor: pointer;
-  background: transparent;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  font-weight: bold;
-  font-size: 13px;
-  color: inherit;
-  border-bottom-color: transparent;
-}
-
-.emotion-0:empty {
-  display: none;
-}
-
-.emotion-0:focus {
-  outline: 0 none;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-2 {
-  white-space: normal;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding: 0 15px;
-  text-transform: capitalize;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  height: 40px;
-  line-height: 12px;
-  cursor: pointer;
-  background: transparent;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  font-weight: bold;
-  font-size: 13px;
-  color: #1EA7FD;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-2:empty {
-  display: none;
-}
-
-.emotion-2:focus {
-  outline: 0 none;
-  border-bottom-color: #1EA7FD;
-}
-
 .emotion-11 {
   display: block;
   position: relative;
@@ -1662,6 +1662,104 @@ exports[`Storyshots Basics|Tabs stateless - empty 1`] = `
 `;
 
 exports[`Storyshots Basics|Tabs stateless - no scrolling 1`] = `
+.emotion-6 {
+  overflow: hidden;
+}
+
+.emotion-6:first-of-type {
+  margin-left: 0;
+}
+
+.emotion-0 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
+  font-size: 13px;
+  color: inherit;
+  border-bottom-color: transparent;
+}
+
+.emotion-0:empty {
+  display: none;
+}
+
+.emotion-0:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-2 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
+  font-size: 13px;
+  color: #1EA7FD;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-2:empty {
+  display: none;
+}
+
+.emotion-2:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
 .emotion-9 {
   color: #999999;
   height: 40px;
@@ -1763,104 +1861,6 @@ exports[`Storyshots Basics|Tabs stateless - no scrolling 1`] = `
   margin-left: 15px;
 }
 
-.emotion-6 {
-  overflow: hidden;
-}
-
-.emotion-6:first-of-type {
-  margin-left: 0;
-}
-
-.emotion-0 {
-  white-space: normal;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding: 0 15px;
-  text-transform: capitalize;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  height: 40px;
-  line-height: 12px;
-  cursor: pointer;
-  background: transparent;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  font-weight: bold;
-  font-size: 13px;
-  color: inherit;
-  border-bottom-color: transparent;
-}
-
-.emotion-0:empty {
-  display: none;
-}
-
-.emotion-0:focus {
-  outline: 0 none;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-2 {
-  white-space: normal;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding: 0 15px;
-  text-transform: capitalize;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  height: 40px;
-  line-height: 12px;
-  cursor: pointer;
-  background: transparent;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  font-weight: bold;
-  font-size: 13px;
-  color: #1EA7FD;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-2:empty {
-  display: none;
-}
-
-.emotion-2:focus {
-  outline: 0 none;
-  border-bottom-color: #1EA7FD;
-}
-
 .emotion-11 {
   display: block;
   position: relative;
@@ -2013,6 +2013,108 @@ exports[`Storyshots Basics|Tabs stateless - no scrolling 1`] = `
 `;
 
 exports[`Storyshots Basics|Tabs stateless - with tools 1`] = `
+.emotion-6 {
+  overflow: hidden;
+}
+
+.emotion-6:first-of-type {
+  margin-left: 0;
+}
+
+.emotion-0 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
+  font-size: 13px;
+  color: inherit;
+  border-bottom-color: transparent;
+}
+
+.emotion-0:empty {
+  display: none;
+}
+
+.emotion-0:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-2 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
+  font-size: 13px;
+  color: #1EA7FD;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-2:empty {
+  display: none;
+}
+
+.emotion-2:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-13 {
+  display: block;
+}
+
 .emotion-10 {
   color: #999999;
   height: 40px;
@@ -2114,104 +2216,16 @@ exports[`Storyshots Basics|Tabs stateless - with tools 1`] = `
   margin-left: 15px;
 }
 
-.emotion-6 {
-  overflow: hidden;
-}
-
-.emotion-6:first-of-type {
-  margin-left: 0;
-}
-
-.emotion-0 {
-  white-space: normal;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding: 0 15px;
-  text-transform: capitalize;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  height: 40px;
-  line-height: 12px;
-  cursor: pointer;
-  background: transparent;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  font-weight: bold;
+.emotion-12 {
+  display: block;
+  position: relative;
   font-size: 13px;
-  color: inherit;
-  border-bottom-color: transparent;
 }
 
-.emotion-0:empty {
+.emotion-11 {
   display: none;
 }
 
-.emotion-0:focus {
-  outline: 0 none;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-2 {
-  white-space: normal;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding: 0 15px;
-  text-transform: capitalize;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  height: 40px;
-  line-height: 12px;
-  cursor: pointer;
-  background: transparent;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  font-weight: bold;
-  font-size: 13px;
-  color: #1EA7FD;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-2:empty {
-  display: none;
-}
-
-.emotion-2:focus {
-  outline: 0 none;
-  border-bottom-color: #1EA7FD;
-}
-
 .emotion-8 {
   display: -webkit-box;
   display: -webkit-flex;
@@ -2230,20 +2244,6 @@ exports[`Storyshots Basics|Tabs stateless - with tools 1`] = `
   margin-right: 15px;
 }
 
-.emotion-13 {
-  display: block;
-}
-
-.emotion-12 {
-  display: block;
-  position: relative;
-  font-size: 13px;
-}
-
-.emotion-11 {
-  display: none;
-}
-
 <div
   style="height:calc(100vh - 20px)"
 >
diff --git a/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot b/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot
index 49acd540911..39da8a6a008 100644
--- a/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot
+++ b/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot
@@ -15,73 +15,16 @@ exports[`Storyshots UI|Panel default 1`] = `
 }
 
 .emotion-12 {
-  color: #999999;
-  height: 40px;
-  overflow: auto;
-  overflow-x: auto;
   overflow-y: hidden;
-  -webkit-scrollbar-width: slim;
-  -moz-scrollbar-width: slim;
-  -ms-scrollbar-width: slim;
-  scrollbar-width: slim;
-  -webkit-scrollbar-width: 3px;
-  -moz-scrollbar-width: 3px;
-  -ms-scrollbar-width: 3px;
-  scrollbar-width: 3px;
-  -webkit-scrollbar-color: transparent transparent;
-  -moz-scrollbar-color: transparent transparent;
-  -ms-scrollbar-color: transparent transparent;
-  scrollbar-color: transparent transparent;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
-}
-
-.emotion-12:hover {
-  -webkit-scrollbar-width: none;
-  -moz-scrollbar-width: none;
-  -ms-scrollbar-width: none;
-  scrollbar-width: none;
-  -webkit-scrollbar-width: 0;
-  -moz-scrollbar-width: 0;
-  -ms-scrollbar-width: 0;
-  scrollbar-width: 0;
-}
-
-.emotion-12::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  box-shadow: none;
-  display: none;
-}
-
-.emotion-12:hover::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  display: block;
-}
-
-.emotion-12::-webkit-scrollbar-track {
-  border-radius: 0;
-  background: transparent;
-  opacity: 0;
-  border: 0 none;
-  box-shadow: none;
-  height: 0;
-  width: 0;
-}
-
-.emotion-12::-webkit-scrollbar-thumb {
-  border-radius: 0;
-  background: rgba(0,0,0,.1);
-  box-shadow: none;
-}
-
-.emotion-12::-webkit-scrollbar-track-piece {
-  display: none;
-  border: 0 none;
-  opacity: 0;
-  visibility: hidden;
+  overflow-x: auto;
+  color: #999999;
+  width: 100%;
+  height: 40px;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  box-shadow: rgba(0,0,0,.1) 0 -1px 0 0 inset;
+  background: #FFFFFF;
 }
 
 .emotion-11 {
@@ -94,7 +37,12 @@ exports[`Storyshots UI|Panel default 1`] = `
   -ms-flex-pack: justify;
   justify-content: space-between;
   position: relative;
-  white-space: nowrap;
+  -webkit-flex-wrap: nowrap;
+  -ms-flex-wrap: nowrap;
+  flex-wrap: nowrap;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
   height: 40px;
 }
 
@@ -103,6 +51,7 @@ exports[`Storyshots UI|Panel default 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
+  white-space: nowrap;
   -webkit-flex-basis: auto;
   -ms-flex-preferred-size: auto;
   flex-basis: auto;
@@ -218,6 +167,7 @@ exports[`Storyshots UI|Panel default 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
+  white-space: nowrap;
   -webkit-flex-basis: auto;
   -ms-flex-preferred-size: auto;
   flex-basis: auto;
@@ -276,12 +226,23 @@ exports[`Storyshots UI|Panel default 1`] = `
   display: block;
   position: relative;
   font-size: 13px;
-  position: relative;
+  height: calc(100% - 40px);
+  position: absolute;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  top: 40px;
+  overflow: auto;
+}
+
+.emotion-13 > *:first-child {
+  position: absolute;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  top: 0;
+  height: 100%;
   overflow: auto;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  width: 100%;
 }
 
 <div
@@ -290,65 +251,106 @@ exports[`Storyshots UI|Panel default 1`] = `
 >
   <div
     class="emotion-12"
+    data-simplebar="true"
   >
     <div
-      class="emotion-11"
+      class="simplebar-wrapper"
     >
       <div
-        class="emotion-3"
+        class="simplebar-height-auto-observer-wrapper"
       >
         <div
-          class="emotion-2"
-          role="tablist"
+          class="simplebar-height-auto-observer"
+        />
+      </div>
+      <div
+        class="simplebar-mask"
+      >
+        <div
+          class="simplebar-offset"
         >
-          <button
-            class="emotion-0"
-            role="tab"
-            type="button"
+          <div
+            class="simplebar-content"
           >
-            Test 1
-          </button>
-          <button
-            class="emotion-1"
-            role="tab"
-            type="button"
-          >
-            Test 2
-          </button>
+            <div
+              class="emotion-11"
+            >
+              <div
+                class="emotion-3"
+              >
+                <div
+                  class="emotion-2"
+                  role="tablist"
+                >
+                  <button
+                    class="emotion-0"
+                    role="tab"
+                    type="button"
+                  >
+                    Test 1
+                  </button>
+                  <button
+                    class="emotion-1"
+                    role="tab"
+                    type="button"
+                  >
+                    Test 2
+                  </button>
+                </div>
+              </div>
+              <div
+                class="emotion-10"
+              >
+                <button
+                  class="emotion-6"
+                  title="Change orientation"
+                >
+                  <svg
+                    class="emotion-5"
+                    viewBox="0 0 1024 1024"
+                  >
+                    <path
+                      class="emotion-4"
+                      d="M64 167.944v688c0 22.092 17.908 40 40 40h816c22.092 0 40-17.908 40-40v-688c0-22.092-17.908-40-40-40h-816c-22.092 0-40 17.908-40 40zM880 815.944h-240v-608h240v608zM144 207.944h416v608h-416v-608zM793.296 320.118h-66.398c-17.676 0-32-14.324-32-32 0-17.674 14.328-32 32-32h66.396c17.674 0 32.002 14.326 32.002 32 0 17.672-14.324 32-32 32zM793.296 448.118h-66.398c-17.676 0-32-14.324-32-32 0-17.674 14.328-32 32-32h66.396c17.674 0 32.002 14.326 32.002 32 0 17.672-14.324 32-32 32zM793.296 576.118h-66.398c-17.676 0-32-14.324-32-32 0-17.674 14.328-32 32-32h66.396c17.674 0 32.002 14.326 32.002 32 0 17.672-14.324 32-32 32z"
+                    />
+                  </svg>
+                </button>
+                <button
+                  class="emotion-6"
+                  title="Hide addons"
+                >
+                  <svg
+                    class="emotion-5"
+                    viewBox="0 0 1024 1024"
+                  >
+                    <path
+                      class="emotion-4"
+                      d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
+                    />
+                  </svg>
+                </button>
+              </div>
+            </div>
+          </div>
         </div>
       </div>
       <div
-        class="emotion-10"
-      >
-        <button
-          class="emotion-6"
-          title="Change orientation"
-        >
-          <svg
-            class="emotion-5"
-            viewBox="0 0 1024 1024"
-          >
-            <path
-              class="emotion-4"
-              d="M64 167.944v688c0 22.092 17.908 40 40 40h816c22.092 0 40-17.908 40-40v-688c0-22.092-17.908-40-40-40h-816c-22.092 0-40 17.908-40 40zM880 815.944h-240v-608h240v608zM144 207.944h416v608h-416v-608zM793.296 320.118h-66.398c-17.676 0-32-14.324-32-32 0-17.674 14.328-32 32-32h66.396c17.674 0 32.002 14.326 32.002 32 0 17.672-14.324 32-32 32zM793.296 448.118h-66.398c-17.676 0-32-14.324-32-32 0-17.674 14.328-32 32-32h66.396c17.674 0 32.002 14.326 32.002 32 0 17.672-14.324 32-32 32zM793.296 576.118h-66.398c-17.676 0-32-14.324-32-32 0-17.674 14.328-32 32-32h66.396c17.674 0 32.002 14.326 32.002 32 0 17.672-14.324 32-32 32z"
-            />
-          </svg>
-        </button>
-        <button
-          class="emotion-6"
-          title="Hide addons"
-        >
-          <svg
-            class="emotion-5"
-            viewBox="0 0 1024 1024"
-          >
-            <path
-              class="emotion-4"
-              d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
-            />
-          </svg>
-        </button>
-      </div>
+        class="simplebar-placeholder"
+      />
+    </div>
+    <div
+      class="simplebar-track simplebar-horizontal"
+    >
+      <div
+        class="simplebar-scrollbar"
+      />
+    </div>
+    <div
+      class="simplebar-track simplebar-vertical"
+    >
+      <div
+        class="simplebar-scrollbar"
+      />
     </div>
   </div>
   <div
diff --git a/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot b/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot
index 1e9b850e826..5f1ce01b189 100644
--- a/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot
+++ b/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot
@@ -12,7 +12,12 @@ Array [
   -ms-flex-pack: justify;
   justify-content: space-between;
   position: relative;
-  white-space: nowrap;
+  -webkit-flex-wrap: nowrap;
+  -ms-flex-wrap: nowrap;
+  flex-wrap: nowrap;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
   height: 40px;
 }
 
@@ -21,6 +26,7 @@ Array [
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
+  white-space: nowrap;
   -webkit-flex-basis: auto;
   -ms-flex-preferred-size: auto;
   flex-basis: auto;
@@ -38,6 +44,7 @@ Array [
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
+  white-space: nowrap;
   -webkit-flex-basis: auto;
   -ms-flex-preferred-size: auto;
   flex-basis: auto;
@@ -64,24 +71,16 @@ Array [
 }
 
 .emotion-23 {
-  color: #999999;
-  height: 40px;
-  overflow: auto;
-  overflow-x: auto;
   overflow-y: hidden;
-  -webkit-scrollbar-width: slim;
-  -moz-scrollbar-width: slim;
-  -ms-scrollbar-width: slim;
-  scrollbar-width: slim;
-  -webkit-scrollbar-width: 3px;
-  -moz-scrollbar-width: 3px;
-  -ms-scrollbar-width: 3px;
-  scrollbar-width: 3px;
-  -webkit-scrollbar-color: transparent transparent;
-  -moz-scrollbar-color: transparent transparent;
-  -ms-scrollbar-color: transparent transparent;
-  scrollbar-color: transparent transparent;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+  overflow-x: auto;
+  color: #999999;
+  width: 100%;
+  height: 40px;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  box-shadow: rgba(0,0,0,.1) 0 -1px 0 0 inset;
+  background: #FFFFFF;
   position: absolute;
   left: 0;
   right: 0;
@@ -93,55 +92,6 @@ Array [
   tranform: translateY(0px);
 }
 
-.emotion-23:hover {
-  -webkit-scrollbar-width: none;
-  -moz-scrollbar-width: none;
-  -ms-scrollbar-width: none;
-  scrollbar-width: none;
-  -webkit-scrollbar-width: 0;
-  -moz-scrollbar-width: 0;
-  -ms-scrollbar-width: 0;
-  scrollbar-width: 0;
-}
-
-.emotion-23::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  box-shadow: none;
-  display: none;
-}
-
-.emotion-23:hover::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  display: block;
-}
-
-.emotion-23::-webkit-scrollbar-track {
-  border-radius: 0;
-  background: transparent;
-  opacity: 0;
-  border: 0 none;
-  box-shadow: none;
-  height: 0;
-  width: 0;
-}
-
-.emotion-23::-webkit-scrollbar-thumb {
-  border-radius: 0;
-  background: rgba(0,0,0,.1);
-  box-shadow: none;
-}
-
-.emotion-23::-webkit-scrollbar-track-piece {
-  display: none;
-  border: 0 none;
-  opacity: 0;
-  visibility: hidden;
-}
-
 .emotion-2 {
   height: 40px;
   background: none;
@@ -184,108 +134,149 @@ Array [
 
 <div
     class="emotion-23"
+    data-simplebar="true"
   >
     <div
-      class="emotion-22"
+      class="simplebar-wrapper"
     >
       <div
-        class="emotion-13"
+        class="simplebar-height-auto-observer-wrapper"
       >
-        <button
-          class="emotion-2"
-          title="Zoom in"
-        >
-          <svg
-            class="emotion-1"
-            viewBox="0 0 1024 1024"
-          >
-            <path
-              class="emotion-0"
-              d="M220 670a316 316 0 0 1 0-450 316 316 0 0 1 450 0 316 316 0 0 1 0 450 316 316 0 0 1-450 0zm749 240L757 698a402 402 0 1 0-59 59l212 212a42 42 0 0 0 59-59zM487 604a42 42 0 0 1-84 0V487H286a42 42 0 1 1 0-84h117V286a42 42 0 1 1 84 0v117h117a42 42 0 0 1 0 84H487v117z"
-            />
-          </svg>
-        </button>
-        <button
-          class="emotion-2"
-          title="Zoom out"
-        >
-          <svg
-            class="emotion-1"
-            viewBox="0 0 1024 1024"
-          >
-            <path
-              class="emotion-0"
-              d="M757 698a402 402 0 1 0-59 59l212 212a42 42 0 0 0 59-59L757 698zM126 445a316 316 0 0 1 319-319 316 316 0 0 1 318 319 316 316 0 0 1-318 318 316 316 0 0 1-319-318zm160 42a42 42 0 1 1 0-84h318a42 42 0 0 1 0 84H286z"
-            />
-          </svg>
-        </button>
-        <button
-          class="emotion-2"
-          title="Reset zoom"
-        >
-          <svg
-            class="emotion-1"
-            viewBox="0 0 1024 1024"
-          >
-            <path
-              class="emotion-0"
-              d="M148 560a318 318 0 0 0 522 110 316 316 0 0 0 0-450 316 316 0 0 0-450 0c-11 11-21 22-30 34v4h47c25 0 46 21 46 46s-21 45-46 45H90c-13 0-25-6-33-14-9-9-14-20-14-33V156c0-25 20-45 45-45s45 20 45 45v32l1 1a401 401 0 0 1 623 509l212 212a42 42 0 0 1-59 59L698 757A401 401 0 0 1 65 570a42 42 0 0 1 83-10z"
-            />
-          </svg>
-        </button>
-        <span
-          class="emotion-9"
+        <div
+          class="simplebar-height-auto-observer"
         />
-        <button
-          class="emotion-2"
-          title="Toggle background grid"
-        >
-          <svg
-            class="emotion-1"
-            viewBox="0 0 1024 1024"
-          >
-            <path
-              class="emotion-0"
-              d="M437.162 552.368c-1.694-0.216-3.408-0.37-5.162-0.37h-263.978c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v264.040c0 22.094 17.91 40 40 40h263.978c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-264.044c0-20.34-15.19-37.094-34.838-39.632zM208.022 816.038v-184.040h183.978v184.040h-183.978zM437.162 128.4c-1.694-0.216-3.408-0.37-5.162-0.37h-263.978c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v263.968c0 22.094 17.91 40 40 40h263.978c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-263.972c0-20.342-15.19-37.096-34.838-39.632zM208.022 392v-183.968h183.978v183.968h-183.978zM861.212 552.368c-1.694-0.216-3.408-0.37-5.162-0.37h-264.050c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v264.040c0 22.094 17.91 40 40 40h264.048c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-264.044c0.002-20.34-15.19-37.094-34.836-39.632zM632 816.038v-184.040h184.048v184.040h-184.048zM861.212 128.4c-1.694-0.216-3.408-0.37-5.162-0.37h-264.050c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v263.968c0 22.094 17.91 40 40 40h264.048c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-263.972c0.002-20.342-15.19-37.096-34.836-39.632zM632 392v-183.968h184.048v183.968h-184.048z"
-            />
-          </svg>
-        </button>
       </div>
       <div
-        class="emotion-21"
+        class="simplebar-mask"
       >
-        <span
-          class="emotion-17"
+        <div
+          class="simplebar-offset"
         >
-          <button
-            class="emotion-2"
-            title="Go full screen"
+          <div
+            class="simplebar-content"
           >
-            <svg
-              class="emotion-1"
-              viewBox="0 0 1024 1024"
+            <div
+              class="emotion-22"
             >
-              <path
-                class="emotion-0"
-                d="M959.688 920.068l0.31-176c0.040-22.094-17.84-40.032-39.93-40.070-22.092-0.040-40.032 17.838-40.070 39.93l-0.142 79.672-235.734-235.732c-15.622-15.622-40.948-15.622-56.57 0s-15.622 40.948 0 56.568l235.442 235.442-78.946-0.1c-22.092-0.028-40.022 17.86-40.050 39.952-0.014 11.064 4.464 21.084 11.714 28.334 7.228 7.224 17.208 11.702 28.236 11.714l175.688 0.22c22.086 0.028 40.014-17.846 40.052-39.93zM920.178 64.228l-176-0.308c-22.094-0.040-40.032 17.84-40.070 39.93-0.040 22.092 17.838 40.032 39.93 40.070l79.672 0.14-235.732 235.734c-15.622 15.622-15.622 40.948 0 56.568s40.948 15.622 56.568 0l235.442-235.442-0.1 78.946c-0.028 22.092 17.86 40.022 39.952 40.050 11.064 0.014 21.084-4.464 28.334-11.714 7.224-7.228 11.702-17.208 11.714-28.236l0.22-175.688c0.026-22.082-17.846-40.010-39.93-40.050zM64.236 103.742l-0.308 176c-0.040 22.094 17.84 40.032 39.93 40.070 22.092 0.040 40.032-17.84 40.070-39.93l0.14-79.672 235.734 235.73c15.622 15.622 40.948 15.622 56.568 0s15.622-40.946 0-56.566l-235.442-235.442 78.946 0.098c22.092 0.028 40.022-17.86 40.050-39.95 0.014-11.066-4.464-21.086-11.714-28.336-7.228-7.222-17.208-11.7-28.236-11.714l-175.688-0.218c-22.084-0.026-40.012 17.844-40.050 39.93zM103.748 959.766l176 0.308c22.094 0.040 40.032-17.84 40.070-39.93 0.040-22.092-17.84-40.032-39.93-40.070l-79.672-0.14 235.73-235.734c15.622-15.622 15.622-40.948 0-56.568s-40.946-15.622-56.566 0l-235.442 235.442 0.098-78.946c0.028-22.092-17.86-40.022-39.95-40.050-11.066-0.014-21.086 4.464-28.336 11.714-7.222 7.228-11.7 17.208-11.714 28.236l-0.218 175.688c-0.026 22.082 17.844 40.010 39.93 40.050z"
-              />
-            </svg>
-          </button>
-        </span>
-        <button
-          class="emotion-2"
-        >
-          <svg
-            class="emotion-1"
-            viewBox="0 0 1024 1024"
-          >
-            <path
-              class="emotion-0"
-              d="M896.006 920c0 22.090-17.91 40-40 40h-688.006c-22.090 0-40-17.906-40-40v-549.922c-0.838-3.224-1.33-6.588-1.33-10.072 0-22.090 17.908-40.004 40-40.004h178.66c22.092 0.004 40 17.914 40 40.004 0 22.088-17.908 40-40 40h-137.33v479.996h607.998v-479.996h-138.658c-22.090 0-40-17.912-40-40 0-22.090 17.906-40.004 40-40.004h178.658c22.090 0 40 17.91 40 40v559.844c0 0.050 0.008 0.102 0.008 0.154zM665.622 200.168l-124.452-124.45c-8.042-8.042-18.65-11.912-29.186-11.674-1.612-0.034-3.222 0-4.828 0.16-0.558 0.054-1.098 0.16-1.648 0.238-0.742 0.104-1.484 0.192-2.218 0.338-0.656 0.13-1.29 0.31-1.934 0.472-0.622 0.154-1.244 0.292-1.86 0.476-0.64 0.196-1.258 0.436-1.886 0.66-0.602 0.216-1.208 0.414-1.802 0.66-0.598 0.248-1.17 0.54-1.754 0.814-0.598 0.282-1.202 0.546-1.788 0.86-0.578 0.312-1.13 0.664-1.694 1-0.552 0.332-1.116 0.644-1.654 1.006-0.67 0.448-1.3 0.942-1.942 1.426-0.394 0.302-0.806 0.576-1.196 0.894-1.046 0.858-2.052 1.768-3.008 2.726l-124.398 124.39c-15.622 15.62-15.618 40.948 0.002 56.57 15.622 15.62 40.95 15.62 56.568 0l56.164-56.166v439.426c0 22.094 17.912 40 40.002 40 22.092 0 40-17.91 40-40v-441.202l57.942 57.942c15.622 15.624 40.948 15.62 56.568 0 15.626-15.618 15.626-40.946 0.002-56.566z"
-            />
-          </svg>
-        </button>
+              <div
+                class="emotion-13"
+              >
+                <button
+                  class="emotion-2"
+                  title="Zoom in"
+                >
+                  <svg
+                    class="emotion-1"
+                    viewBox="0 0 1024 1024"
+                  >
+                    <path
+                      class="emotion-0"
+                      d="M220 670a316 316 0 0 1 0-450 316 316 0 0 1 450 0 316 316 0 0 1 0 450 316 316 0 0 1-450 0zm749 240L757 698a402 402 0 1 0-59 59l212 212a42 42 0 0 0 59-59zM487 604a42 42 0 0 1-84 0V487H286a42 42 0 1 1 0-84h117V286a42 42 0 1 1 84 0v117h117a42 42 0 0 1 0 84H487v117z"
+                    />
+                  </svg>
+                </button>
+                <button
+                  class="emotion-2"
+                  title="Zoom out"
+                >
+                  <svg
+                    class="emotion-1"
+                    viewBox="0 0 1024 1024"
+                  >
+                    <path
+                      class="emotion-0"
+                      d="M757 698a402 402 0 1 0-59 59l212 212a42 42 0 0 0 59-59L757 698zM126 445a316 316 0 0 1 319-319 316 316 0 0 1 318 319 316 316 0 0 1-318 318 316 316 0 0 1-319-318zm160 42a42 42 0 1 1 0-84h318a42 42 0 0 1 0 84H286z"
+                    />
+                  </svg>
+                </button>
+                <button
+                  class="emotion-2"
+                  title="Reset zoom"
+                >
+                  <svg
+                    class="emotion-1"
+                    viewBox="0 0 1024 1024"
+                  >
+                    <path
+                      class="emotion-0"
+                      d="M148 560a318 318 0 0 0 522 110 316 316 0 0 0 0-450 316 316 0 0 0-450 0c-11 11-21 22-30 34v4h47c25 0 46 21 46 46s-21 45-46 45H90c-13 0-25-6-33-14-9-9-14-20-14-33V156c0-25 20-45 45-45s45 20 45 45v32l1 1a401 401 0 0 1 623 509l212 212a42 42 0 0 1-59 59L698 757A401 401 0 0 1 65 570a42 42 0 0 1 83-10z"
+                    />
+                  </svg>
+                </button>
+                <span
+                  class="emotion-9"
+                />
+                <button
+                  class="emotion-2"
+                  title="Toggle background grid"
+                >
+                  <svg
+                    class="emotion-1"
+                    viewBox="0 0 1024 1024"
+                  >
+                    <path
+                      class="emotion-0"
+                      d="M437.162 552.368c-1.694-0.216-3.408-0.37-5.162-0.37h-263.978c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v264.040c0 22.094 17.91 40 40 40h263.978c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-264.044c0-20.34-15.19-37.094-34.838-39.632zM208.022 816.038v-184.040h183.978v184.040h-183.978zM437.162 128.4c-1.694-0.216-3.408-0.37-5.162-0.37h-263.978c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v263.968c0 22.094 17.91 40 40 40h263.978c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-263.972c0-20.342-15.19-37.096-34.838-39.632zM208.022 392v-183.968h183.978v183.968h-183.978zM861.212 552.368c-1.694-0.216-3.408-0.37-5.162-0.37h-264.050c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v264.040c0 22.094 17.91 40 40 40h264.048c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-264.044c0.002-20.34-15.19-37.094-34.836-39.632zM632 816.038v-184.040h184.048v184.040h-184.048zM861.212 128.4c-1.694-0.216-3.408-0.37-5.162-0.37h-264.050c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v263.968c0 22.094 17.91 40 40 40h264.048c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-263.972c0.002-20.342-15.19-37.096-34.836-39.632zM632 392v-183.968h184.048v183.968h-184.048z"
+                    />
+                  </svg>
+                </button>
+              </div>
+              <div
+                class="emotion-21"
+              >
+                <span
+                  class="emotion-17"
+                >
+                  <button
+                    class="emotion-2"
+                    title="Go full screen"
+                  >
+                    <svg
+                      class="emotion-1"
+                      viewBox="0 0 1024 1024"
+                    >
+                      <path
+                        class="emotion-0"
+                        d="M959.688 920.068l0.31-176c0.040-22.094-17.84-40.032-39.93-40.070-22.092-0.040-40.032 17.838-40.070 39.93l-0.142 79.672-235.734-235.732c-15.622-15.622-40.948-15.622-56.57 0s-15.622 40.948 0 56.568l235.442 235.442-78.946-0.1c-22.092-0.028-40.022 17.86-40.050 39.952-0.014 11.064 4.464 21.084 11.714 28.334 7.228 7.224 17.208 11.702 28.236 11.714l175.688 0.22c22.086 0.028 40.014-17.846 40.052-39.93zM920.178 64.228l-176-0.308c-22.094-0.040-40.032 17.84-40.070 39.93-0.040 22.092 17.838 40.032 39.93 40.070l79.672 0.14-235.732 235.734c-15.622 15.622-15.622 40.948 0 56.568s40.948 15.622 56.568 0l235.442-235.442-0.1 78.946c-0.028 22.092 17.86 40.022 39.952 40.050 11.064 0.014 21.084-4.464 28.334-11.714 7.224-7.228 11.702-17.208 11.714-28.236l0.22-175.688c0.026-22.082-17.846-40.010-39.93-40.050zM64.236 103.742l-0.308 176c-0.040 22.094 17.84 40.032 39.93 40.070 22.092 0.040 40.032-17.84 40.070-39.93l0.14-79.672 235.734 235.73c15.622 15.622 40.948 15.622 56.568 0s15.622-40.946 0-56.566l-235.442-235.442 78.946 0.098c22.092 0.028 40.022-17.86 40.050-39.95 0.014-11.066-4.464-21.086-11.714-28.336-7.228-7.222-17.208-11.7-28.236-11.714l-175.688-0.218c-22.084-0.026-40.012 17.844-40.050 39.93zM103.748 959.766l176 0.308c22.094 0.040 40.032-17.84 40.070-39.93 0.040-22.092-17.84-40.032-39.93-40.070l-79.672-0.14 235.73-235.734c15.622-15.622 15.622-40.948 0-56.568s-40.946-15.622-56.566 0l-235.442 235.442 0.098-78.946c0.028-22.092-17.86-40.022-39.95-40.050-11.066-0.014-21.086 4.464-28.336 11.714-7.222 7.228-11.7 17.208-11.714 28.236l-0.218 175.688c-0.026 22.082 17.844 40.010 39.93 40.050z"
+                      />
+                    </svg>
+                  </button>
+                </span>
+                <button
+                  class="emotion-2"
+                >
+                  <svg
+                    class="emotion-1"
+                    viewBox="0 0 1024 1024"
+                  >
+                    <path
+                      class="emotion-0"
+                      d="M896.006 920c0 22.090-17.91 40-40 40h-688.006c-22.090 0-40-17.906-40-40v-549.922c-0.838-3.224-1.33-6.588-1.33-10.072 0-22.090 17.908-40.004 40-40.004h178.66c22.092 0.004 40 17.914 40 40.004 0 22.088-17.908 40-40 40h-137.33v479.996h607.998v-479.996h-138.658c-22.090 0-40-17.912-40-40 0-22.090 17.906-40.004 40-40.004h178.658c22.090 0 40 17.91 40 40v559.844c0 0.050 0.008 0.102 0.008 0.154zM665.622 200.168l-124.452-124.45c-8.042-8.042-18.65-11.912-29.186-11.674-1.612-0.034-3.222 0-4.828 0.16-0.558 0.054-1.098 0.16-1.648 0.238-0.742 0.104-1.484 0.192-2.218 0.338-0.656 0.13-1.29 0.31-1.934 0.472-0.622 0.154-1.244 0.292-1.86 0.476-0.64 0.196-1.258 0.436-1.886 0.66-0.602 0.216-1.208 0.414-1.802 0.66-0.598 0.248-1.17 0.54-1.754 0.814-0.598 0.282-1.202 0.546-1.788 0.86-0.578 0.312-1.13 0.664-1.694 1-0.552 0.332-1.116 0.644-1.654 1.006-0.67 0.448-1.3 0.942-1.942 1.426-0.394 0.302-0.806 0.576-1.196 0.894-1.046 0.858-2.052 1.768-3.008 2.726l-124.398 124.39c-15.622 15.62-15.618 40.948 0.002 56.57 15.622 15.62 40.95 15.62 56.568 0l56.164-56.166v439.426c0 22.094 17.912 40 40.002 40 22.092 0 40-17.91 40-40v-441.202l57.942 57.942c15.622 15.624 40.948 15.62 56.568 0 15.626-15.618 15.626-40.946 0.002-56.566z"
+                    />
+                  </svg>
+                </button>
+              </div>
+            </div>
+          </div>
+        </div>
       </div>
+      <div
+        class="simplebar-placeholder"
+      />
+    </div>
+    <div
+      class="simplebar-track simplebar-horizontal"
+    >
+      <div
+        class="simplebar-scrollbar"
+      />
+    </div>
+    <div
+      class="simplebar-track simplebar-vertical"
+    >
+      <div
+        class="simplebar-scrollbar"
+      />
     </div>
   </div>,
   .emotion-2 {
@@ -374,7 +365,12 @@ Array [
   -ms-flex-pack: justify;
   justify-content: space-between;
   position: relative;
-  white-space: nowrap;
+  -webkit-flex-wrap: nowrap;
+  -ms-flex-wrap: nowrap;
+  flex-wrap: nowrap;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
   height: 40px;
 }
 
@@ -383,6 +379,7 @@ Array [
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
+  white-space: nowrap;
   -webkit-flex-basis: auto;
   -ms-flex-preferred-size: auto;
   flex-basis: auto;
@@ -498,6 +495,7 @@ Array [
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
+  white-space: nowrap;
   -webkit-flex-basis: auto;
   -ms-flex-preferred-size: auto;
   flex-basis: auto;
@@ -524,24 +522,16 @@ Array [
 }
 
 .emotion-29 {
-  color: #999999;
-  height: 40px;
-  overflow: auto;
-  overflow-x: auto;
   overflow-y: hidden;
-  -webkit-scrollbar-width: slim;
-  -moz-scrollbar-width: slim;
-  -ms-scrollbar-width: slim;
-  scrollbar-width: slim;
-  -webkit-scrollbar-width: 3px;
-  -moz-scrollbar-width: 3px;
-  -ms-scrollbar-width: 3px;
-  scrollbar-width: 3px;
-  -webkit-scrollbar-color: transparent transparent;
-  -moz-scrollbar-color: transparent transparent;
-  -ms-scrollbar-color: transparent transparent;
-  scrollbar-color: transparent transparent;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+  overflow-x: auto;
+  color: #999999;
+  width: 100%;
+  height: 40px;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  box-shadow: rgba(0,0,0,.1) 0 -1px 0 0 inset;
+  background: #FFFFFF;
   position: absolute;
   left: 0;
   right: 0;
@@ -553,55 +543,6 @@ Array [
   tranform: translateY(0px);
 }
 
-.emotion-29:hover {
-  -webkit-scrollbar-width: none;
-  -moz-scrollbar-width: none;
-  -ms-scrollbar-width: none;
-  scrollbar-width: none;
-  -webkit-scrollbar-width: 0;
-  -moz-scrollbar-width: 0;
-  -ms-scrollbar-width: 0;
-  scrollbar-width: 0;
-}
-
-.emotion-29::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  box-shadow: none;
-  display: none;
-}
-
-.emotion-29:hover::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  display: block;
-}
-
-.emotion-29::-webkit-scrollbar-track {
-  border-radius: 0;
-  background: transparent;
-  opacity: 0;
-  border: 0 none;
-  box-shadow: none;
-  height: 0;
-  width: 0;
-}
-
-.emotion-29::-webkit-scrollbar-thumb {
-  border-radius: 0;
-  background: rgba(0,0,0,.1);
-  box-shadow: none;
-}
-
-.emotion-29::-webkit-scrollbar-track-piece {
-  display: none;
-  border: 0 none;
-  opacity: 0;
-  visibility: hidden;
-}
-
 .emotion-8 {
   height: 40px;
   background: none;
@@ -651,135 +592,176 @@ Array [
 
 <div
     class="emotion-29"
+    data-simplebar="true"
   >
     <div
-      class="emotion-28"
+      class="simplebar-wrapper"
     >
       <div
-        class="emotion-19"
+        class="simplebar-height-auto-observer-wrapper"
       >
         <div
-          class="emotion-4"
-        >
-          <a
-            class="emotion-1"
-            href="/?path=/story/string"
-          >
-            <button
-              class="emotion-0"
-            >
-              Canvas
-            </button>
-          </a>
-          <a
-            class="emotion-1"
-            href="/?path=/info/string"
-          >
-            <button
-              class="emotion-2"
-            >
-              Notes
-            </button>
-          </a>
-        </div>
-        <span
-          class="emotion-5"
+          class="simplebar-height-auto-observer"
         />
-        <button
-          class="emotion-8"
-          title="Zoom in"
-        >
-          <svg
-            class="emotion-7"
-            viewBox="0 0 1024 1024"
-          >
-            <path
-              class="emotion-6"
-              d="M220 670a316 316 0 0 1 0-450 316 316 0 0 1 450 0 316 316 0 0 1 0 450 316 316 0 0 1-450 0zm749 240L757 698a402 402 0 1 0-59 59l212 212a42 42 0 0 0 59-59zM487 604a42 42 0 0 1-84 0V487H286a42 42 0 1 1 0-84h117V286a42 42 0 1 1 84 0v117h117a42 42 0 0 1 0 84H487v117z"
-            />
-          </svg>
-        </button>
-        <button
-          class="emotion-8"
-          title="Zoom out"
-        >
-          <svg
-            class="emotion-7"
-            viewBox="0 0 1024 1024"
-          >
-            <path
-              class="emotion-6"
-              d="M757 698a402 402 0 1 0-59 59l212 212a42 42 0 0 0 59-59L757 698zM126 445a316 316 0 0 1 319-319 316 316 0 0 1 318 319 316 316 0 0 1-318 318 316 316 0 0 1-319-318zm160 42a42 42 0 1 1 0-84h318a42 42 0 0 1 0 84H286z"
-            />
-          </svg>
-        </button>
-        <button
-          class="emotion-8"
-          title="Reset zoom"
-        >
-          <svg
-            class="emotion-7"
-            viewBox="0 0 1024 1024"
-          >
-            <path
-              class="emotion-6"
-              d="M148 560a318 318 0 0 0 522 110 316 316 0 0 0 0-450 316 316 0 0 0-450 0c-11 11-21 22-30 34v4h47c25 0 46 21 46 46s-21 45-46 45H90c-13 0-25-6-33-14-9-9-14-20-14-33V156c0-25 20-45 45-45s45 20 45 45v32l1 1a401 401 0 0 1 623 509l212 212a42 42 0 0 1-59 59L698 757A401 401 0 0 1 65 570a42 42 0 0 1 83-10z"
-            />
-          </svg>
-        </button>
-        <span
-          class="emotion-5"
-        />
-        <button
-          class="emotion-8"
-          title="Toggle background grid"
-        >
-          <svg
-            class="emotion-7"
-            viewBox="0 0 1024 1024"
-          >
-            <path
-              class="emotion-6"
-              d="M437.162 552.368c-1.694-0.216-3.408-0.37-5.162-0.37h-263.978c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v264.040c0 22.094 17.91 40 40 40h263.978c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-264.044c0-20.34-15.19-37.094-34.838-39.632zM208.022 816.038v-184.040h183.978v184.040h-183.978zM437.162 128.4c-1.694-0.216-3.408-0.37-5.162-0.37h-263.978c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v263.968c0 22.094 17.91 40 40 40h263.978c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-263.972c0-20.342-15.19-37.096-34.838-39.632zM208.022 392v-183.968h183.978v183.968h-183.978zM861.212 552.368c-1.694-0.216-3.408-0.37-5.162-0.37h-264.050c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v264.040c0 22.094 17.91 40 40 40h264.048c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-264.044c0.002-20.34-15.19-37.094-34.836-39.632zM632 816.038v-184.040h184.048v184.040h-184.048zM861.212 128.4c-1.694-0.216-3.408-0.37-5.162-0.37h-264.050c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v263.968c0 22.094 17.91 40 40 40h264.048c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-263.972c0.002-20.342-15.19-37.096-34.836-39.632zM632 392v-183.968h184.048v183.968h-184.048z"
-            />
-          </svg>
-        </button>
       </div>
       <div
-        class="emotion-27"
+        class="simplebar-mask"
       >
-        <span
-          class="emotion-23"
+        <div
+          class="simplebar-offset"
         >
-          <button
-            class="emotion-8"
-            title="Go full screen"
+          <div
+            class="simplebar-content"
           >
-            <svg
-              class="emotion-7"
-              viewBox="0 0 1024 1024"
+            <div
+              class="emotion-28"
             >
-              <path
-                class="emotion-6"
-                d="M959.688 920.068l0.31-176c0.040-22.094-17.84-40.032-39.93-40.070-22.092-0.040-40.032 17.838-40.070 39.93l-0.142 79.672-235.734-235.732c-15.622-15.622-40.948-15.622-56.57 0s-15.622 40.948 0 56.568l235.442 235.442-78.946-0.1c-22.092-0.028-40.022 17.86-40.050 39.952-0.014 11.064 4.464 21.084 11.714 28.334 7.228 7.224 17.208 11.702 28.236 11.714l175.688 0.22c22.086 0.028 40.014-17.846 40.052-39.93zM920.178 64.228l-176-0.308c-22.094-0.040-40.032 17.84-40.070 39.93-0.040 22.092 17.838 40.032 39.93 40.070l79.672 0.14-235.732 235.734c-15.622 15.622-15.622 40.948 0 56.568s40.948 15.622 56.568 0l235.442-235.442-0.1 78.946c-0.028 22.092 17.86 40.022 39.952 40.050 11.064 0.014 21.084-4.464 28.334-11.714 7.224-7.228 11.702-17.208 11.714-28.236l0.22-175.688c0.026-22.082-17.846-40.010-39.93-40.050zM64.236 103.742l-0.308 176c-0.040 22.094 17.84 40.032 39.93 40.070 22.092 0.040 40.032-17.84 40.070-39.93l0.14-79.672 235.734 235.73c15.622 15.622 40.948 15.622 56.568 0s15.622-40.946 0-56.566l-235.442-235.442 78.946 0.098c22.092 0.028 40.022-17.86 40.050-39.95 0.014-11.066-4.464-21.086-11.714-28.336-7.228-7.222-17.208-11.7-28.236-11.714l-175.688-0.218c-22.084-0.026-40.012 17.844-40.050 39.93zM103.748 959.766l176 0.308c22.094 0.040 40.032-17.84 40.070-39.93 0.040-22.092-17.84-40.032-39.93-40.070l-79.672-0.14 235.73-235.734c15.622-15.622 15.622-40.948 0-56.568s-40.946-15.622-56.566 0l-235.442 235.442 0.098-78.946c0.028-22.092-17.86-40.022-39.95-40.050-11.066-0.014-21.086 4.464-28.336 11.714-7.222 7.228-11.7 17.208-11.714 28.236l-0.218 175.688c-0.026 22.082 17.844 40.010 39.93 40.050z"
-              />
-            </svg>
-          </button>
-        </span>
-        <button
-          class="emotion-8"
-        >
-          <svg
-            class="emotion-7"
-            viewBox="0 0 1024 1024"
-          >
-            <path
-              class="emotion-6"
-              d="M896.006 920c0 22.090-17.91 40-40 40h-688.006c-22.090 0-40-17.906-40-40v-549.922c-0.838-3.224-1.33-6.588-1.33-10.072 0-22.090 17.908-40.004 40-40.004h178.66c22.092 0.004 40 17.914 40 40.004 0 22.088-17.908 40-40 40h-137.33v479.996h607.998v-479.996h-138.658c-22.090 0-40-17.912-40-40 0-22.090 17.906-40.004 40-40.004h178.658c22.090 0 40 17.91 40 40v559.844c0 0.050 0.008 0.102 0.008 0.154zM665.622 200.168l-124.452-124.45c-8.042-8.042-18.65-11.912-29.186-11.674-1.612-0.034-3.222 0-4.828 0.16-0.558 0.054-1.098 0.16-1.648 0.238-0.742 0.104-1.484 0.192-2.218 0.338-0.656 0.13-1.29 0.31-1.934 0.472-0.622 0.154-1.244 0.292-1.86 0.476-0.64 0.196-1.258 0.436-1.886 0.66-0.602 0.216-1.208 0.414-1.802 0.66-0.598 0.248-1.17 0.54-1.754 0.814-0.598 0.282-1.202 0.546-1.788 0.86-0.578 0.312-1.13 0.664-1.694 1-0.552 0.332-1.116 0.644-1.654 1.006-0.67 0.448-1.3 0.942-1.942 1.426-0.394 0.302-0.806 0.576-1.196 0.894-1.046 0.858-2.052 1.768-3.008 2.726l-124.398 124.39c-15.622 15.62-15.618 40.948 0.002 56.57 15.622 15.62 40.95 15.62 56.568 0l56.164-56.166v439.426c0 22.094 17.912 40 40.002 40 22.092 0 40-17.91 40-40v-441.202l57.942 57.942c15.622 15.624 40.948 15.62 56.568 0 15.626-15.618 15.626-40.946 0.002-56.566z"
-            />
-          </svg>
-        </button>
+              <div
+                class="emotion-19"
+              >
+                <div
+                  class="emotion-4"
+                >
+                  <a
+                    class="emotion-1"
+                    href="/?path=/story/string"
+                  >
+                    <button
+                      class="emotion-0"
+                    >
+                      Canvas
+                    </button>
+                  </a>
+                  <a
+                    class="emotion-1"
+                    href="/?path=/info/string"
+                  >
+                    <button
+                      class="emotion-2"
+                    >
+                      Notes
+                    </button>
+                  </a>
+                </div>
+                <span
+                  class="emotion-5"
+                />
+                <button
+                  class="emotion-8"
+                  title="Zoom in"
+                >
+                  <svg
+                    class="emotion-7"
+                    viewBox="0 0 1024 1024"
+                  >
+                    <path
+                      class="emotion-6"
+                      d="M220 670a316 316 0 0 1 0-450 316 316 0 0 1 450 0 316 316 0 0 1 0 450 316 316 0 0 1-450 0zm749 240L757 698a402 402 0 1 0-59 59l212 212a42 42 0 0 0 59-59zM487 604a42 42 0 0 1-84 0V487H286a42 42 0 1 1 0-84h117V286a42 42 0 1 1 84 0v117h117a42 42 0 0 1 0 84H487v117z"
+                    />
+                  </svg>
+                </button>
+                <button
+                  class="emotion-8"
+                  title="Zoom out"
+                >
+                  <svg
+                    class="emotion-7"
+                    viewBox="0 0 1024 1024"
+                  >
+                    <path
+                      class="emotion-6"
+                      d="M757 698a402 402 0 1 0-59 59l212 212a42 42 0 0 0 59-59L757 698zM126 445a316 316 0 0 1 319-319 316 316 0 0 1 318 319 316 316 0 0 1-318 318 316 316 0 0 1-319-318zm160 42a42 42 0 1 1 0-84h318a42 42 0 0 1 0 84H286z"
+                    />
+                  </svg>
+                </button>
+                <button
+                  class="emotion-8"
+                  title="Reset zoom"
+                >
+                  <svg
+                    class="emotion-7"
+                    viewBox="0 0 1024 1024"
+                  >
+                    <path
+                      class="emotion-6"
+                      d="M148 560a318 318 0 0 0 522 110 316 316 0 0 0 0-450 316 316 0 0 0-450 0c-11 11-21 22-30 34v4h47c25 0 46 21 46 46s-21 45-46 45H90c-13 0-25-6-33-14-9-9-14-20-14-33V156c0-25 20-45 45-45s45 20 45 45v32l1 1a401 401 0 0 1 623 509l212 212a42 42 0 0 1-59 59L698 757A401 401 0 0 1 65 570a42 42 0 0 1 83-10z"
+                    />
+                  </svg>
+                </button>
+                <span
+                  class="emotion-5"
+                />
+                <button
+                  class="emotion-8"
+                  title="Toggle background grid"
+                >
+                  <svg
+                    class="emotion-7"
+                    viewBox="0 0 1024 1024"
+                  >
+                    <path
+                      class="emotion-6"
+                      d="M437.162 552.368c-1.694-0.216-3.408-0.37-5.162-0.37h-263.978c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v264.040c0 22.094 17.91 40 40 40h263.978c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-264.044c0-20.34-15.19-37.094-34.838-39.632zM208.022 816.038v-184.040h183.978v184.040h-183.978zM437.162 128.4c-1.694-0.216-3.408-0.37-5.162-0.37h-263.978c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v263.968c0 22.094 17.91 40 40 40h263.978c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-263.972c0-20.342-15.19-37.096-34.838-39.632zM208.022 392v-183.968h183.978v183.968h-183.978zM861.212 552.368c-1.694-0.216-3.408-0.37-5.162-0.37h-264.050c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v264.040c0 22.094 17.91 40 40 40h264.048c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-264.044c0.002-20.34-15.19-37.094-34.836-39.632zM632 816.038v-184.040h184.048v184.040h-184.048zM861.212 128.4c-1.694-0.216-3.408-0.37-5.162-0.37h-264.050c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v263.968c0 22.094 17.91 40 40 40h264.048c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-263.972c0.002-20.342-15.19-37.096-34.836-39.632zM632 392v-183.968h184.048v183.968h-184.048z"
+                    />
+                  </svg>
+                </button>
+              </div>
+              <div
+                class="emotion-27"
+              >
+                <span
+                  class="emotion-23"
+                >
+                  <button
+                    class="emotion-8"
+                    title="Go full screen"
+                  >
+                    <svg
+                      class="emotion-7"
+                      viewBox="0 0 1024 1024"
+                    >
+                      <path
+                        class="emotion-6"
+                        d="M959.688 920.068l0.31-176c0.040-22.094-17.84-40.032-39.93-40.070-22.092-0.040-40.032 17.838-40.070 39.93l-0.142 79.672-235.734-235.732c-15.622-15.622-40.948-15.622-56.57 0s-15.622 40.948 0 56.568l235.442 235.442-78.946-0.1c-22.092-0.028-40.022 17.86-40.050 39.952-0.014 11.064 4.464 21.084 11.714 28.334 7.228 7.224 17.208 11.702 28.236 11.714l175.688 0.22c22.086 0.028 40.014-17.846 40.052-39.93zM920.178 64.228l-176-0.308c-22.094-0.040-40.032 17.84-40.070 39.93-0.040 22.092 17.838 40.032 39.93 40.070l79.672 0.14-235.732 235.734c-15.622 15.622-15.622 40.948 0 56.568s40.948 15.622 56.568 0l235.442-235.442-0.1 78.946c-0.028 22.092 17.86 40.022 39.952 40.050 11.064 0.014 21.084-4.464 28.334-11.714 7.224-7.228 11.702-17.208 11.714-28.236l0.22-175.688c0.026-22.082-17.846-40.010-39.93-40.050zM64.236 103.742l-0.308 176c-0.040 22.094 17.84 40.032 39.93 40.070 22.092 0.040 40.032-17.84 40.070-39.93l0.14-79.672 235.734 235.73c15.622 15.622 40.948 15.622 56.568 0s15.622-40.946 0-56.566l-235.442-235.442 78.946 0.098c22.092 0.028 40.022-17.86 40.050-39.95 0.014-11.066-4.464-21.086-11.714-28.336-7.228-7.222-17.208-11.7-28.236-11.714l-175.688-0.218c-22.084-0.026-40.012 17.844-40.050 39.93zM103.748 959.766l176 0.308c22.094 0.040 40.032-17.84 40.070-39.93 0.040-22.092-17.84-40.032-39.93-40.070l-79.672-0.14 235.73-235.734c15.622-15.622 15.622-40.948 0-56.568s-40.946-15.622-56.566 0l-235.442 235.442 0.098-78.946c0.028-22.092-17.86-40.022-39.95-40.050-11.066-0.014-21.086 4.464-28.336 11.714-7.222 7.228-11.7 17.208-11.714 28.236l-0.218 175.688c-0.026 22.082 17.844 40.010 39.93 40.050z"
+                      />
+                    </svg>
+                  </button>
+                </span>
+                <button
+                  class="emotion-8"
+                >
+                  <svg
+                    class="emotion-7"
+                    viewBox="0 0 1024 1024"
+                  >
+                    <path
+                      class="emotion-6"
+                      d="M896.006 920c0 22.090-17.91 40-40 40h-688.006c-22.090 0-40-17.906-40-40v-549.922c-0.838-3.224-1.33-6.588-1.33-10.072 0-22.090 17.908-40.004 40-40.004h178.66c22.092 0.004 40 17.914 40 40.004 0 22.088-17.908 40-40 40h-137.33v479.996h607.998v-479.996h-138.658c-22.090 0-40-17.912-40-40 0-22.090 17.906-40.004 40-40.004h178.658c22.090 0 40 17.91 40 40v559.844c0 0.050 0.008 0.102 0.008 0.154zM665.622 200.168l-124.452-124.45c-8.042-8.042-18.65-11.912-29.186-11.674-1.612-0.034-3.222 0-4.828 0.16-0.558 0.054-1.098 0.16-1.648 0.238-0.742 0.104-1.484 0.192-2.218 0.338-0.656 0.13-1.29 0.31-1.934 0.472-0.622 0.154-1.244 0.292-1.86 0.476-0.64 0.196-1.258 0.436-1.886 0.66-0.602 0.216-1.208 0.414-1.802 0.66-0.598 0.248-1.17 0.54-1.754 0.814-0.598 0.282-1.202 0.546-1.788 0.86-0.578 0.312-1.13 0.664-1.694 1-0.552 0.332-1.116 0.644-1.654 1.006-0.67 0.448-1.3 0.942-1.942 1.426-0.394 0.302-0.806 0.576-1.196 0.894-1.046 0.858-2.052 1.768-3.008 2.726l-124.398 124.39c-15.622 15.62-15.618 40.948 0.002 56.57 15.622 15.62 40.95 15.62 56.568 0l56.164-56.166v439.426c0 22.094 17.912 40 40.002 40 22.092 0 40-17.91 40-40v-441.202l57.942 57.942c15.622 15.624 40.948 15.62 56.568 0 15.626-15.618 15.626-40.946 0.002-56.566z"
+                    />
+                  </svg>
+                </button>
+              </div>
+            </div>
+          </div>
+        </div>
       </div>
+      <div
+        class="simplebar-placeholder"
+      />
+    </div>
+    <div
+      class="simplebar-track simplebar-horizontal"
+    >
+      <div
+        class="simplebar-scrollbar"
+      />
+    </div>
+    <div
+      class="simplebar-track simplebar-vertical"
+    >
+      <div
+        class="simplebar-scrollbar"
+      />
     </div>
   </div>,
   .emotion-2 {
diff --git a/lib/ui/src/settings/__snapshots__/about.stories.storyshot b/lib/ui/src/settings/__snapshots__/about.stories.storyshot
index bc9c8ce2487..604adef4e1f 100644
--- a/lib/ui/src/settings/__snapshots__/about.stories.storyshot
+++ b/lib/ui/src/settings/__snapshots__/about.stories.storyshot
@@ -15,73 +15,16 @@ exports[`Storyshots UI|Settings/AboutScreen failed to fetch new version 1`] = `
 }
 
 .emotion-8 {
-  color: #999999;
-  height: 40px;
-  overflow: auto;
-  overflow-x: auto;
   overflow-y: hidden;
-  -webkit-scrollbar-width: slim;
-  -moz-scrollbar-width: slim;
-  -ms-scrollbar-width: slim;
-  scrollbar-width: slim;
-  -webkit-scrollbar-width: 3px;
-  -moz-scrollbar-width: 3px;
-  -ms-scrollbar-width: 3px;
-  scrollbar-width: 3px;
-  -webkit-scrollbar-color: transparent transparent;
-  -moz-scrollbar-color: transparent transparent;
-  -ms-scrollbar-color: transparent transparent;
-  scrollbar-color: transparent transparent;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
-}
-
-.emotion-8:hover {
-  -webkit-scrollbar-width: none;
-  -moz-scrollbar-width: none;
-  -ms-scrollbar-width: none;
-  scrollbar-width: none;
-  -webkit-scrollbar-width: 0;
-  -moz-scrollbar-width: 0;
-  -ms-scrollbar-width: 0;
-  scrollbar-width: 0;
-}
-
-.emotion-8::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  box-shadow: none;
-  display: none;
-}
-
-.emotion-8:hover::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  display: block;
-}
-
-.emotion-8::-webkit-scrollbar-track {
-  border-radius: 0;
-  background: transparent;
-  opacity: 0;
-  border: 0 none;
-  box-shadow: none;
-  height: 0;
-  width: 0;
-}
-
-.emotion-8::-webkit-scrollbar-thumb {
-  border-radius: 0;
-  background: rgba(0,0,0,.1);
-  box-shadow: none;
-}
-
-.emotion-8::-webkit-scrollbar-track-piece {
-  display: none;
-  border: 0 none;
-  opacity: 0;
-  visibility: hidden;
+  overflow-x: auto;
+  color: #999999;
+  width: 100%;
+  height: 40px;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  box-shadow: rgba(0,0,0,.1) 0 -1px 0 0 inset;
+  background: #FFFFFF;
 }
 
 .emotion-7 {
@@ -94,7 +37,12 @@ exports[`Storyshots UI|Settings/AboutScreen failed to fetch new version 1`] = `
   -ms-flex-pack: justify;
   justify-content: space-between;
   position: relative;
-  white-space: nowrap;
+  -webkit-flex-wrap: nowrap;
+  -ms-flex-wrap: nowrap;
+  flex-wrap: nowrap;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
   height: 40px;
 }
 
@@ -103,6 +51,7 @@ exports[`Storyshots UI|Settings/AboutScreen failed to fetch new version 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
+  white-space: nowrap;
   -webkit-flex-basis: auto;
   -ms-flex-preferred-size: auto;
   flex-basis: auto;
@@ -173,6 +122,7 @@ exports[`Storyshots UI|Settings/AboutScreen failed to fetch new version 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
+  white-space: nowrap;
   -webkit-flex-basis: auto;
   -ms-flex-preferred-size: auto;
   flex-basis: auto;
@@ -202,12 +152,23 @@ exports[`Storyshots UI|Settings/AboutScreen failed to fetch new version 1`] = `
   display: block;
   position: relative;
   font-size: 13px;
-  position: relative;
+  height: calc(100% - 40px);
+  position: absolute;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  top: 40px;
+  overflow: auto;
+}
+
+.emotion-25 > *:first-child {
+  position: absolute;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  top: 0;
+  height: 100%;
   overflow: auto;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  width: 100%;
 }
 
 .emotion-5 {
@@ -414,43 +375,84 @@ exports[`Storyshots UI|Settings/AboutScreen failed to fetch new version 1`] = `
 >
   <div
     class="emotion-8"
+    data-simplebar="true"
   >
     <div
-      class="emotion-7"
+      class="simplebar-wrapper"
     >
       <div
-        class="emotion-2"
+        class="simplebar-height-auto-observer-wrapper"
       >
         <div
-          class="emotion-1"
-          role="tablist"
+          class="simplebar-height-auto-observer"
+        />
+      </div>
+      <div
+        class="simplebar-mask"
+      >
+        <div
+          class="simplebar-offset"
         >
-          <button
-            class="emotion-0"
-            role="tab"
-            type="button"
+          <div
+            class="simplebar-content"
           >
-            About
-          </button>
+            <div
+              class="emotion-7"
+            >
+              <div
+                class="emotion-2"
+              >
+                <div
+                  class="emotion-1"
+                  role="tablist"
+                >
+                  <button
+                    class="emotion-0"
+                    role="tab"
+                    type="button"
+                  >
+                    About
+                  </button>
+                </div>
+              </div>
+              <div
+                class="emotion-6"
+              >
+                <button
+                  class="emotion-5"
+                >
+                  <svg
+                    class="emotion-4"
+                    viewBox="0 0 1024 1024"
+                  >
+                    <path
+                      class="emotion-3"
+                      d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
+                    />
+                  </svg>
+                </button>
+              </div>
+            </div>
+          </div>
         </div>
       </div>
       <div
-        class="emotion-6"
-      >
-        <button
-          class="emotion-5"
-        >
-          <svg
-            class="emotion-4"
-            viewBox="0 0 1024 1024"
-          >
-            <path
-              class="emotion-3"
-              d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
-            />
-          </svg>
-        </button>
-      </div>
+        class="simplebar-placeholder"
+      />
+    </div>
+    <div
+      class="simplebar-track simplebar-horizontal"
+    >
+      <div
+        class="simplebar-scrollbar"
+      />
+    </div>
+    <div
+      class="simplebar-track simplebar-vertical"
+    >
+      <div
+        class="simplebar-scrollbar"
+      />
     </div>
   </div>
   <div
@@ -582,73 +584,16 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
 }
 
 .emotion-8 {
-  color: #999999;
-  height: 40px;
-  overflow: auto;
-  overflow-x: auto;
   overflow-y: hidden;
-  -webkit-scrollbar-width: slim;
-  -moz-scrollbar-width: slim;
-  -ms-scrollbar-width: slim;
-  scrollbar-width: slim;
-  -webkit-scrollbar-width: 3px;
-  -moz-scrollbar-width: 3px;
-  -ms-scrollbar-width: 3px;
-  scrollbar-width: 3px;
-  -webkit-scrollbar-color: transparent transparent;
-  -moz-scrollbar-color: transparent transparent;
-  -ms-scrollbar-color: transparent transparent;
-  scrollbar-color: transparent transparent;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
-}
-
-.emotion-8:hover {
-  -webkit-scrollbar-width: none;
-  -moz-scrollbar-width: none;
-  -ms-scrollbar-width: none;
-  scrollbar-width: none;
-  -webkit-scrollbar-width: 0;
-  -moz-scrollbar-width: 0;
-  -ms-scrollbar-width: 0;
-  scrollbar-width: 0;
-}
-
-.emotion-8::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  box-shadow: none;
-  display: none;
-}
-
-.emotion-8:hover::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  display: block;
-}
-
-.emotion-8::-webkit-scrollbar-track {
-  border-radius: 0;
-  background: transparent;
-  opacity: 0;
-  border: 0 none;
-  box-shadow: none;
-  height: 0;
-  width: 0;
-}
-
-.emotion-8::-webkit-scrollbar-thumb {
-  border-radius: 0;
-  background: rgba(0,0,0,.1);
-  box-shadow: none;
-}
-
-.emotion-8::-webkit-scrollbar-track-piece {
-  display: none;
-  border: 0 none;
-  opacity: 0;
-  visibility: hidden;
+  overflow-x: auto;
+  color: #999999;
+  width: 100%;
+  height: 40px;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  box-shadow: rgba(0,0,0,.1) 0 -1px 0 0 inset;
+  background: #FFFFFF;
 }
 
 .emotion-7 {
@@ -661,7 +606,12 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   -ms-flex-pack: justify;
   justify-content: space-between;
   position: relative;
-  white-space: nowrap;
+  -webkit-flex-wrap: nowrap;
+  -ms-flex-wrap: nowrap;
+  flex-wrap: nowrap;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
   height: 40px;
 }
 
@@ -670,6 +620,7 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
+  white-space: nowrap;
   -webkit-flex-basis: auto;
   -ms-flex-preferred-size: auto;
   flex-basis: auto;
@@ -740,6 +691,7 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
+  white-space: nowrap;
   -webkit-flex-basis: auto;
   -ms-flex-preferred-size: auto;
   flex-basis: auto;
@@ -769,12 +721,23 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   display: block;
   position: relative;
   font-size: 13px;
-  position: relative;
+  height: calc(100% - 40px);
+  position: absolute;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  top: 40px;
+  overflow: auto;
+}
+
+.emotion-41 > *:first-child {
+  position: absolute;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  top: 0;
+  height: 100%;
   overflow: auto;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  width: 100%;
 }
 
 .emotion-5 {
@@ -1053,7 +1016,6 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
 .emotion-17 pre.hljs {
   padding: 15px;
   margin: 0;
-  overflow: auto;
   white-space: pre-wrap;
   color: #333333;
   font-size: 13px;
@@ -1469,8 +1431,9 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
 }
 
 .emotion-20 {
+  overflow-y: auto;
+  overflow-x: auto;
   position: relative;
-  overflow: auto;
 }
 
 .emotion-20 code {
@@ -1698,43 +1661,84 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
 >
   <div
     class="emotion-8"
+    data-simplebar="true"
   >
     <div
-      class="emotion-7"
+      class="simplebar-wrapper"
     >
       <div
-        class="emotion-2"
+        class="simplebar-height-auto-observer-wrapper"
       >
         <div
-          class="emotion-1"
-          role="tablist"
+          class="simplebar-height-auto-observer"
+        />
+      </div>
+      <div
+        class="simplebar-mask"
+      >
+        <div
+          class="simplebar-offset"
         >
-          <button
-            class="emotion-0"
-            role="tab"
-            type="button"
+          <div
+            class="simplebar-content"
           >
-            About
-          </button>
+            <div
+              class="emotion-7"
+            >
+              <div
+                class="emotion-2"
+              >
+                <div
+                  class="emotion-1"
+                  role="tablist"
+                >
+                  <button
+                    class="emotion-0"
+                    role="tab"
+                    type="button"
+                  >
+                    About
+                  </button>
+                </div>
+              </div>
+              <div
+                class="emotion-6"
+              >
+                <button
+                  class="emotion-5"
+                >
+                  <svg
+                    class="emotion-4"
+                    viewBox="0 0 1024 1024"
+                  >
+                    <path
+                      class="emotion-3"
+                      d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
+                    />
+                  </svg>
+                </button>
+              </div>
+            </div>
+          </div>
         </div>
       </div>
       <div
-        class="emotion-6"
-      >
-        <button
-          class="emotion-5"
-        >
-          <svg
-            class="emotion-4"
-            viewBox="0 0 1024 1024"
-          >
-            <path
-              class="emotion-3"
-              d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
-            />
-          </svg>
-        </button>
-      </div>
+        class="simplebar-placeholder"
+      />
+    </div>
+    <div
+      class="simplebar-track simplebar-horizontal"
+    >
+      <div
+        class="simplebar-scrollbar"
+      />
+    </div>
+    <div
+      class="simplebar-track simplebar-vertical"
+    >
+      <div
+        class="simplebar-scrollbar"
+      />
     </div>
   </div>
   <div
@@ -1853,28 +1857,69 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
             >
               <div
                 class="emotion-20"
+                data-simplebar="true"
               >
-                <pre
-                  class="hljs emotion-19"
+                <div
+                  class="simplebar-wrapper"
                 >
-                  <code
-                    class="emotion-18"
+                  <div
+                    class="simplebar-height-auto-observer-wrapper"
                   >
-                    npx npm-check-updates 
-                    <span
-                      class="token string"
+                    <div
+                      class="simplebar-height-auto-observer"
+                    />
+                  </div>
+                  <div
+                    class="simplebar-mask"
+                  >
+                    <div
+                      class="simplebar-offset"
                     >
-                      '/storybook/'
-                    </span>
-                     -u 
-                    <span
-                      class="token operator"
-                    >
-                      &&
-                    </span>
-                     yarn
-                  </code>
-                </pre>
+                      <div
+                        class="simplebar-content"
+                      >
+                        <pre
+                          class="hljs emotion-19"
+                        >
+                          <code
+                            class="emotion-18"
+                          >
+                            npx npm-check-updates 
+                            <span
+                              class="token string"
+                            >
+                              '/storybook/'
+                            </span>
+                             -u 
+                            <span
+                              class="token operator"
+                            >
+                              &&
+                            </span>
+                             yarn
+                          </code>
+                        </pre>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    class="simplebar-placeholder"
+                  />
+                </div>
+                <div
+                  class="simplebar-track simplebar-horizontal"
+                >
+                  <div
+                    class="simplebar-scrollbar"
+                  />
+                </div>
+                <div
+                  class="simplebar-track simplebar-vertical"
+                >
+                  <div
+                    class="simplebar-scrollbar"
+                  />
+                </div>
               </div>
               <div
                 class="emotion-22"
@@ -1894,16 +1939,57 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
             >
               <div
                 class="emotion-20"
+                data-simplebar="true"
               >
-                <pre
-                  class="hljs emotion-19"
+                <div
+                  class="simplebar-wrapper"
                 >
-                  <code
-                    class="emotion-18"
+                  <div
+                    class="simplebar-height-auto-observer-wrapper"
                   >
-                    yarn upgrade-interactive --latest
-                  </code>
-                </pre>
+                    <div
+                      class="simplebar-height-auto-observer"
+                    />
+                  </div>
+                  <div
+                    class="simplebar-mask"
+                  >
+                    <div
+                      class="simplebar-offset"
+                    >
+                      <div
+                        class="simplebar-content"
+                      >
+                        <pre
+                          class="hljs emotion-19"
+                        >
+                          <code
+                            class="emotion-18"
+                          >
+                            yarn upgrade-interactive --latest
+                          </code>
+                        </pre>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    class="simplebar-placeholder"
+                  />
+                </div>
+                <div
+                  class="simplebar-track simplebar-horizontal"
+                >
+                  <div
+                    class="simplebar-scrollbar"
+                  />
+                </div>
+                <div
+                  class="simplebar-track simplebar-vertical"
+                >
+                  <div
+                    class="simplebar-scrollbar"
+                  />
+                </div>
               </div>
               <div
                 class="emotion-22"
@@ -1972,73 +2058,16 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
 }
 
 .emotion-8 {
-  color: #999999;
-  height: 40px;
-  overflow: auto;
-  overflow-x: auto;
   overflow-y: hidden;
-  -webkit-scrollbar-width: slim;
-  -moz-scrollbar-width: slim;
-  -ms-scrollbar-width: slim;
-  scrollbar-width: slim;
-  -webkit-scrollbar-width: 3px;
-  -moz-scrollbar-width: 3px;
-  -ms-scrollbar-width: 3px;
-  scrollbar-width: 3px;
-  -webkit-scrollbar-color: transparent transparent;
-  -moz-scrollbar-color: transparent transparent;
-  -ms-scrollbar-color: transparent transparent;
-  scrollbar-color: transparent transparent;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
-}
-
-.emotion-8:hover {
-  -webkit-scrollbar-width: none;
-  -moz-scrollbar-width: none;
-  -ms-scrollbar-width: none;
-  scrollbar-width: none;
-  -webkit-scrollbar-width: 0;
-  -moz-scrollbar-width: 0;
-  -ms-scrollbar-width: 0;
-  scrollbar-width: 0;
-}
-
-.emotion-8::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  box-shadow: none;
-  display: none;
-}
-
-.emotion-8:hover::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  display: block;
-}
-
-.emotion-8::-webkit-scrollbar-track {
-  border-radius: 0;
-  background: transparent;
-  opacity: 0;
-  border: 0 none;
-  box-shadow: none;
-  height: 0;
-  width: 0;
-}
-
-.emotion-8::-webkit-scrollbar-thumb {
-  border-radius: 0;
-  background: rgba(0,0,0,.1);
-  box-shadow: none;
-}
-
-.emotion-8::-webkit-scrollbar-track-piece {
-  display: none;
-  border: 0 none;
-  opacity: 0;
-  visibility: hidden;
+  overflow-x: auto;
+  color: #999999;
+  width: 100%;
+  height: 40px;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  box-shadow: rgba(0,0,0,.1) 0 -1px 0 0 inset;
+  background: #FFFFFF;
 }
 
 .emotion-7 {
@@ -2051,7 +2080,12 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   -ms-flex-pack: justify;
   justify-content: space-between;
   position: relative;
-  white-space: nowrap;
+  -webkit-flex-wrap: nowrap;
+  -ms-flex-wrap: nowrap;
+  flex-wrap: nowrap;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
   height: 40px;
 }
 
@@ -2060,6 +2094,7 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
+  white-space: nowrap;
   -webkit-flex-basis: auto;
   -ms-flex-preferred-size: auto;
   flex-basis: auto;
@@ -2130,6 +2165,7 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
+  white-space: nowrap;
   -webkit-flex-basis: auto;
   -ms-flex-preferred-size: auto;
   flex-basis: auto;
@@ -2159,12 +2195,23 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   display: block;
   position: relative;
   font-size: 13px;
-  position: relative;
+  height: calc(100% - 40px);
+  position: absolute;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  top: 40px;
+  overflow: auto;
+}
+
+.emotion-27 > *:first-child {
+  position: absolute;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  top: 0;
+  height: 100%;
   overflow: auto;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  width: 100%;
 }
 
 .emotion-5 {
@@ -2455,7 +2502,6 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
 .emotion-17 pre.hljs {
   padding: 15px;
   margin: 0;
-  overflow: auto;
   white-space: pre-wrap;
   color: #333333;
   font-size: 13px;
@@ -2852,43 +2898,84 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
 >
   <div
     class="emotion-8"
+    data-simplebar="true"
   >
     <div
-      class="emotion-7"
+      class="simplebar-wrapper"
     >
       <div
-        class="emotion-2"
+        class="simplebar-height-auto-observer-wrapper"
       >
         <div
-          class="emotion-1"
-          role="tablist"
+          class="simplebar-height-auto-observer"
+        />
+      </div>
+      <div
+        class="simplebar-mask"
+      >
+        <div
+          class="simplebar-offset"
         >
-          <button
-            class="emotion-0"
-            role="tab"
-            type="button"
+          <div
+            class="simplebar-content"
           >
-            About
-          </button>
+            <div
+              class="emotion-7"
+            >
+              <div
+                class="emotion-2"
+              >
+                <div
+                  class="emotion-1"
+                  role="tablist"
+                >
+                  <button
+                    class="emotion-0"
+                    role="tab"
+                    type="button"
+                  >
+                    About
+                  </button>
+                </div>
+              </div>
+              <div
+                class="emotion-6"
+              >
+                <button
+                  class="emotion-5"
+                >
+                  <svg
+                    class="emotion-4"
+                    viewBox="0 0 1024 1024"
+                  >
+                    <path
+                      class="emotion-3"
+                      d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
+                    />
+                  </svg>
+                </button>
+              </div>
+            </div>
+          </div>
         </div>
       </div>
       <div
-        class="emotion-6"
-      >
-        <button
-          class="emotion-5"
-        >
-          <svg
-            class="emotion-4"
-            viewBox="0 0 1024 1024"
-          >
-            <path
-              class="emotion-3"
-              d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
-            />
-          </svg>
-        </button>
-      </div>
+        class="simplebar-placeholder"
+      />
+    </div>
+    <div
+      class="simplebar-track simplebar-horizontal"
+    >
+      <div
+        class="simplebar-scrollbar"
+      />
+    </div>
+    <div
+      class="simplebar-track simplebar-vertical"
+    >
+      <div
+        class="simplebar-scrollbar"
+      />
     </div>
   </div>
   <div

From 1e93c2ad242ffdb2c107a517ffd736967e9cd47e Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Sat, 2 Mar 2019 01:18:37 +0800
Subject: [PATCH 105/249] 5.0.0-rc.8 changelog

---
 CHANGELOG.md | 12 ++++++++++++
 1 file changed, 12 insertions(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index e97cf007643..b2ad34e0945 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,15 @@
+## 5.0.0-rc.8 (March 1, 2019)
+
+### Features
+
+* Core: Allow local decorators via params ([#5806](https://github.com/storybooks/storybook/pull/5806))
+
+### Bug Fixes
+
+* UI: Sort storiesHash so grouped keys appear together ([#5805](https://github.com/storybooks/storybook/pull/5805))
+* UI: Close tooltips on iframe clicks on keypresses ([#5807](https://github.com/storybooks/storybook/pull/5807))
+* Addon-Info: Add font family to info panel ([#5759](https://github.com/storybooks/storybook/pull/5759))
+
 ## 5.0.0-rc.7 (February 28, 2019)
 
 ### Features

From 6c1d4183d3608a3af6328e6d4aa706d2689a0320 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Sat, 2 Mar 2019 01:19:52 +0800
Subject: [PATCH 106/249] v5.0.0-rc.8

---
 addons/a11y/package.json                      | 12 ++---
 addons/actions/package.json                   | 10 ++--
 addons/backgrounds/package.json               | 12 ++---
 addons/centered/package.json                  |  2 +-
 addons/cssresources/package.json              | 10 ++--
 addons/events/package.json                    |  8 +--
 addons/google-analytics/package.json          |  6 +--
 addons/graphql/package.json                   |  2 +-
 addons/info/package.json                      | 10 ++--
 addons/jest/package.json                      | 10 ++--
 addons/knobs/package.json                     | 10 ++--
 addons/links/package.json                     |  6 +--
 addons/notes/package.json                     | 12 ++---
 addons/ondevice-backgrounds/package.json      |  4 +-
 addons/ondevice-knobs/package.json            |  4 +-
 addons/ondevice-notes/package.json            |  4 +-
 addons/options/package.json                   |  4 +-
 .../storyshots/storyshots-core/package.json   |  4 +-
 .../storyshots-puppeteer/package.json         |  6 +--
 addons/storysource/package.json               | 10 ++--
 addons/viewport/package.json                  | 12 ++---
 app/angular/package.json                      |  6 +--
 app/ember/package.json                        |  4 +-
 app/html/package.json                         |  4 +-
 app/marko/package.json                        |  4 +-
 app/mithril/package.json                      |  4 +-
 app/polymer/package.json                      |  4 +-
 app/preact/package.json                       |  4 +-
 app/react-native/package.json                 | 14 ++---
 app/react/package.json                        |  8 +--
 app/riot/package.json                         |  4 +-
 app/svelte/package.json                       |  4 +-
 app/vue/package.json                          |  4 +-
 examples/angular-cli/package.json             | 26 ++++-----
 examples/cra-kitchen-sink/package.json        | 32 +++++------
 examples/cra-ts-kitchen-sink/package.json     | 12 ++---
 examples/ember-cli/package.json               | 26 ++++-----
 examples/html-kitchen-sink/package.json       | 36 ++++++-------
 examples/marko-cli/package.json               | 14 ++---
 examples/mithril-kitchen-sink/package.json    | 26 ++++-----
 examples/official-storybook/package.json      | 48 ++++++++---------
 examples/polymer-cli/package.json             | 20 +++----
 examples/preact-kitchen-sink/package.json     | 26 ++++-----
 examples/riot-kitchen-sink/package.json       | 26 ++++-----
 examples/svelte-kitchen-sink/package.json     | 26 ++++-----
 examples/vue-kitchen-sink/package.json        | 26 ++++-----
 lerna.json                                    |  2 +-
 lib/addons/package.json                       |  6 +--
 lib/channel-postmessage/package.json          |  6 +--
 lib/channel-websocket/package.json            |  4 +-
 lib/channels/package.json                     |  2 +-
 lib/cli/package.json                          | 54 +++++++++----------
 lib/client-api/package.json                   | 10 ++--
 lib/client-logger/package.json                |  2 +-
 lib/codemod/package.json                      |  2 +-
 lib/components/package.json                   | 12 ++---
 lib/core-events/package.json                  |  2 +-
 lib/core/package.json                         | 20 +++----
 lib/node-logger/package.json                  |  2 +-
 lib/router/package.json                       |  4 +-
 lib/theming/package.json                      |  4 +-
 lib/ui/package.json                           | 14 ++---
 62 files changed, 356 insertions(+), 356 deletions(-)

diff --git a/addons/a11y/package.json b/addons/a11y/package.json
index 3f6b3032d6c..4382a86458f 100644
--- a/addons/a11y/package.json
+++ b/addons/a11y/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-a11y",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "a11y addon for storybook",
   "keywords": [
     "a11y",
@@ -25,11 +25,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.7",
-    "@storybook/client-logger": "5.0.0-rc.7",
-    "@storybook/components": "5.0.0-rc.7",
-    "@storybook/core-events": "5.0.0-rc.7",
-    "@storybook/theming": "5.0.0-rc.7",
+    "@storybook/addons": "5.0.0-rc.8",
+    "@storybook/client-logger": "5.0.0-rc.8",
+    "@storybook/components": "5.0.0-rc.8",
+    "@storybook/core-events": "5.0.0-rc.8",
+    "@storybook/theming": "5.0.0-rc.8",
     "axe-core": "^3.1.2",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
diff --git a/addons/actions/package.json b/addons/actions/package.json
index 5de7294b815..2e3945ff51b 100644
--- a/addons/actions/package.json
+++ b/addons/actions/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-actions",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "Action Logger addon for storybook",
   "keywords": [
     "storybook"
@@ -20,10 +20,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.7",
-    "@storybook/components": "5.0.0-rc.7",
-    "@storybook/core-events": "5.0.0-rc.7",
-    "@storybook/theming": "5.0.0-rc.7",
+    "@storybook/addons": "5.0.0-rc.8",
+    "@storybook/components": "5.0.0-rc.8",
+    "@storybook/core-events": "5.0.0-rc.8",
+    "@storybook/theming": "5.0.0-rc.8",
     "core-js": "^2.6.2",
     "fast-deep-equal": "^2.0.1",
     "global": "^4.3.2",
diff --git a/addons/backgrounds/package.json b/addons/backgrounds/package.json
index f89f679dc17..df2b68a3630 100644
--- a/addons/backgrounds/package.json
+++ b/addons/backgrounds/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-backgrounds",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "A storybook addon to show different backgrounds for your preview",
   "keywords": [
     "addon",
@@ -24,11 +24,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.7",
-    "@storybook/client-logger": "5.0.0-rc.7",
-    "@storybook/components": "5.0.0-rc.7",
-    "@storybook/core-events": "5.0.0-rc.7",
-    "@storybook/theming": "5.0.0-rc.7",
+    "@storybook/addons": "5.0.0-rc.8",
+    "@storybook/client-logger": "5.0.0-rc.8",
+    "@storybook/components": "5.0.0-rc.8",
+    "@storybook/core-events": "5.0.0-rc.8",
+    "@storybook/theming": "5.0.0-rc.8",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
diff --git a/addons/centered/package.json b/addons/centered/package.json
index 664c19e706b..2f76908b30f 100644
--- a/addons/centered/package.json
+++ b/addons/centered/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-centered",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "Storybook decorator to center components",
   "keywords": [
     "addon",
diff --git a/addons/cssresources/package.json b/addons/cssresources/package.json
index efd3c89931b..a065fe270c3 100644
--- a/addons/cssresources/package.json
+++ b/addons/cssresources/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-cssresources",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "A storybook addon to switch between css resources at runtime for your story",
   "keywords": [
     "addon",
@@ -24,10 +24,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.7",
-    "@storybook/channels": "5.0.0-rc.7",
-    "@storybook/components": "5.0.0-rc.7",
-    "@storybook/core-events": "5.0.0-rc.7",
+    "@storybook/addons": "5.0.0-rc.8",
+    "@storybook/channels": "5.0.0-rc.8",
+    "@storybook/components": "5.0.0-rc.8",
+    "@storybook/core-events": "5.0.0-rc.8",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "prop-types": "^15.6.2",
diff --git a/addons/events/package.json b/addons/events/package.json
index 69b14c1b80a..32a862bfc23 100644
--- a/addons/events/package.json
+++ b/addons/events/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-events",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "Add events to your Storybook stories.",
   "keywords": [
     "addon",
@@ -23,9 +23,9 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.7",
-    "@storybook/core-events": "5.0.0-rc.7",
-    "@storybook/theming": "5.0.0-rc.7",
+    "@storybook/addons": "5.0.0-rc.8",
+    "@storybook/core-events": "5.0.0-rc.8",
+    "@storybook/theming": "5.0.0-rc.8",
     "core-js": "^2.6.2",
     "format-json": "^1.0.3",
     "prop-types": "^15.6.2",
diff --git a/addons/google-analytics/package.json b/addons/google-analytics/package.json
index 5933d1f6f1b..ad67bd0a4b7 100644
--- a/addons/google-analytics/package.json
+++ b/addons/google-analytics/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-google-analytics",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "Storybook addon for google analytics",
   "keywords": [
     "addon",
@@ -19,8 +19,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.7",
-    "@storybook/core-events": "5.0.0-rc.7",
+    "@storybook/addons": "5.0.0-rc.8",
+    "@storybook/core-events": "5.0.0-rc.8",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "react-ga": "^2.5.3"
diff --git a/addons/graphql/package.json b/addons/graphql/package.json
index 500dbf405e9..5a103ff07e4 100644
--- a/addons/graphql/package.json
+++ b/addons/graphql/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-graphql",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "Storybook addon to display the GraphiQL IDE",
   "keywords": [
     "addon",
diff --git a/addons/info/package.json b/addons/info/package.json
index 8d5de63cf79..3205b43fcad 100644
--- a/addons/info/package.json
+++ b/addons/info/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-info",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "A Storybook addon to show additional information for your stories.",
   "keywords": [
     "addon",
@@ -21,10 +21,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.7",
-    "@storybook/client-logger": "5.0.0-rc.7",
-    "@storybook/components": "5.0.0-rc.7",
-    "@storybook/theming": "5.0.0-rc.7",
+    "@storybook/addons": "5.0.0-rc.8",
+    "@storybook/client-logger": "5.0.0-rc.8",
+    "@storybook/components": "5.0.0-rc.8",
+    "@storybook/theming": "5.0.0-rc.8",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "marksy": "^6.1.0",
diff --git a/addons/jest/package.json b/addons/jest/package.json
index fff0a04ed35..ab1191a8b0a 100644
--- a/addons/jest/package.json
+++ b/addons/jest/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-jest",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "React storybook addon that show component jest report",
   "keywords": [
     "addon",
@@ -27,10 +27,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.7",
-    "@storybook/components": "5.0.0-rc.7",
-    "@storybook/core-events": "5.0.0-rc.7",
-    "@storybook/theming": "5.0.0-rc.7",
+    "@storybook/addons": "5.0.0-rc.8",
+    "@storybook/components": "5.0.0-rc.8",
+    "@storybook/core-events": "5.0.0-rc.8",
+    "@storybook/theming": "5.0.0-rc.8",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "prop-types": "^15.6.2",
diff --git a/addons/knobs/package.json b/addons/knobs/package.json
index e7a7bc741f7..2a8d85dca08 100644
--- a/addons/knobs/package.json
+++ b/addons/knobs/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-knobs",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "Storybook Addon Prop Editor Component",
   "keywords": [
     "addon",
@@ -21,10 +21,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.7",
-    "@storybook/components": "5.0.0-rc.7",
-    "@storybook/core-events": "5.0.0-rc.7",
-    "@storybook/theming": "5.0.0-rc.7",
+    "@storybook/addons": "5.0.0-rc.8",
+    "@storybook/components": "5.0.0-rc.8",
+    "@storybook/core-events": "5.0.0-rc.8",
+    "@storybook/theming": "5.0.0-rc.8",
     "copy-to-clipboard": "^3.0.8",
     "core-js": "^2.6.2",
     "escape-html": "^1.0.3",
diff --git a/addons/links/package.json b/addons/links/package.json
index 03c9af48ad6..58ca9f99a0f 100644
--- a/addons/links/package.json
+++ b/addons/links/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-links",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "Story Links addon for storybook",
   "keywords": [
     "addon",
@@ -21,8 +21,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.7",
-    "@storybook/core-events": "5.0.0-rc.7",
+    "@storybook/addons": "5.0.0-rc.8",
+    "@storybook/core-events": "5.0.0-rc.8",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/addons/notes/package.json b/addons/notes/package.json
index 0520b7210ec..b5821b8a2e1 100644
--- a/addons/notes/package.json
+++ b/addons/notes/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-notes",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "Write notes for your Storybook stories.",
   "keywords": [
     "addon",
@@ -22,11 +22,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.7",
-    "@storybook/client-logger": "5.0.0-rc.7",
-    "@storybook/components": "5.0.0-rc.7",
-    "@storybook/core-events": "5.0.0-rc.7",
-    "@storybook/theming": "5.0.0-rc.7",
+    "@storybook/addons": "5.0.0-rc.8",
+    "@storybook/client-logger": "5.0.0-rc.8",
+    "@storybook/components": "5.0.0-rc.8",
+    "@storybook/core-events": "5.0.0-rc.8",
+    "@storybook/theming": "5.0.0-rc.8",
     "markdown-to-jsx": "^6.9.1",
     "prop-types": "^15.6.2",
     "util-deprecate": "^1.0.2"
diff --git a/addons/ondevice-backgrounds/package.json b/addons/ondevice-backgrounds/package.json
index c73d39a5c7e..395c680b0d6 100644
--- a/addons/ondevice-backgrounds/package.json
+++ b/addons/ondevice-backgrounds/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/addon-ondevice-backgrounds",
   "private": true,
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "A storybook addon to show different backgrounds for your preview",
   "keywords": [
     "addon",
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.7",
+    "@storybook/addons": "5.0.0-rc.8",
     "core-js": "^2.6.2",
     "prop-types": "^15.6.2"
   },
diff --git a/addons/ondevice-knobs/package.json b/addons/ondevice-knobs/package.json
index c8261f12471..17d8f640600 100644
--- a/addons/ondevice-knobs/package.json
+++ b/addons/ondevice-knobs/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/addon-ondevice-knobs",
   "private": true,
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "Display storybook story knobs on your deviced.",
   "keywords": [
     "addon",
@@ -21,7 +21,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.7",
+    "@storybook/addons": "5.0.0-rc.8",
     "core-js": "^2.6.2",
     "deep-equal": "^1.0.1",
     "prop-types": "^15.6.2",
diff --git a/addons/ondevice-notes/package.json b/addons/ondevice-notes/package.json
index 7fb6c333b76..2bda6c8f4a5 100644
--- a/addons/ondevice-notes/package.json
+++ b/addons/ondevice-notes/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/addon-ondevice-notes",
   "private": true,
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "Write notes for your Storybook stories.",
   "keywords": [
     "addon",
@@ -19,7 +19,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.7",
+    "@storybook/addons": "5.0.0-rc.8",
     "core-js": "^2.6.2",
     "prop-types": "^15.6.2",
     "react-native-simple-markdown": "^1.1.0"
diff --git a/addons/options/package.json b/addons/options/package.json
index 9778c01f123..bf88642e755 100644
--- a/addons/options/package.json
+++ b/addons/options/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-options",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "Options addon for storybook",
   "keywords": [
     "addon",
@@ -20,7 +20,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.7",
+    "@storybook/addons": "5.0.0-rc.8",
     "core-js": "^2.6.2",
     "util-deprecate": "^1.0.2"
   },
diff --git a/addons/storyshots/storyshots-core/package.json b/addons/storyshots/storyshots-core/package.json
index 354ec17e1c2..bb66226721c 100644
--- a/addons/storyshots/storyshots-core/package.json
+++ b/addons/storyshots/storyshots-core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storyshots",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "StoryShots is a Jest Snapshot Testing Addon for Storybook.",
   "keywords": [
     "addon",
@@ -24,7 +24,7 @@
     "storybook": "start-storybook -p 6006"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.7",
+    "@storybook/addons": "5.0.0-rc.8",
     "core-js": "^2.6.2",
     "glob": "^7.1.3",
     "global": "^4.3.2",
diff --git a/addons/storyshots/storyshots-puppeteer/package.json b/addons/storyshots/storyshots-puppeteer/package.json
index f13e3cabb25..a014096e9e2 100644
--- a/addons/storyshots/storyshots-puppeteer/package.json
+++ b/addons/storyshots/storyshots-puppeteer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storyshots-puppeteer",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "Image snappshots addition to StoryShots base on puppeteer",
   "keywords": [
     "addon",
@@ -21,8 +21,8 @@
     "prepare": "node ../../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/node-logger": "5.0.0-rc.7",
-    "@storybook/router": "5.0.0-rc.7",
+    "@storybook/node-logger": "5.0.0-rc.8",
+    "@storybook/router": "5.0.0-rc.8",
     "core-js": "^2.6.2",
     "jest-image-snapshot": "^2.6.0",
     "puppeteer": "^1.12.0",
diff --git a/addons/storysource/package.json b/addons/storysource/package.json
index 4cdcc43025a..100db18d18e 100644
--- a/addons/storysource/package.json
+++ b/addons/storysource/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storysource",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "Stories addon for storybook",
   "keywords": [
     "addon",
@@ -21,10 +21,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.7",
-    "@storybook/components": "5.0.0-rc.7",
-    "@storybook/router": "5.0.0-rc.7",
-    "@storybook/theming": "5.0.0-rc.7",
+    "@storybook/addons": "5.0.0-rc.8",
+    "@storybook/components": "5.0.0-rc.8",
+    "@storybook/router": "5.0.0-rc.8",
+    "@storybook/theming": "5.0.0-rc.8",
     "core-js": "^2.6.2",
     "estraverse": "^4.2.0",
     "loader-utils": "^1.2.1",
diff --git a/addons/viewport/package.json b/addons/viewport/package.json
index a119d997c3f..c7956a06059 100644
--- a/addons/viewport/package.json
+++ b/addons/viewport/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-viewport",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "Storybook addon to change the viewport size to mobile",
   "keywords": [
     "addon",
@@ -20,11 +20,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.7",
-    "@storybook/client-logger": "5.0.0-rc.7",
-    "@storybook/components": "5.0.0-rc.7",
-    "@storybook/core-events": "5.0.0-rc.7",
-    "@storybook/theming": "5.0.0-rc.7",
+    "@storybook/addons": "5.0.0-rc.8",
+    "@storybook/client-logger": "5.0.0-rc.8",
+    "@storybook/components": "5.0.0-rc.8",
+    "@storybook/core-events": "5.0.0-rc.8",
+    "@storybook/theming": "5.0.0-rc.8",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
diff --git a/app/angular/package.json b/app/angular/package.json
index 95fadb44544..afa2a75322e 100644
--- a/app/angular/package.json
+++ b/app/angular/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/angular",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "Storybook for Angular: Develop Angular Components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,8 +25,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.7",
-    "@storybook/node-logger": "5.0.0-rc.7",
+    "@storybook/core": "5.0.0-rc.8",
+    "@storybook/node-logger": "5.0.0-rc.8",
     "angular2-template-loader": "^0.6.2",
     "core-js": "^2.6.2",
     "fork-ts-checker-webpack-plugin": "^0.5.2",
diff --git a/app/ember/package.json b/app/ember/package.json
index 9e95944e084..fd2946cdec1 100644
--- a/app/ember/package.json
+++ b/app/ember/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/ember",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "Storybook for Ember: Develop Ember Component in isolation with Hot Reloading.",
   "homepage": "https://github.com/storybooks/storybook/tree/master/app/ember",
   "bugs": {
@@ -23,7 +23,7 @@
   },
   "dependencies": {
     "@ember/test-helpers": "^1.3.1",
-    "@storybook/core": "5.0.0-rc.7",
+    "@storybook/core": "5.0.0-rc.8",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/html/package.json b/app/html/package.json
index 85ebb9220eb..a2e8e78894e 100644
--- a/app/html/package.json
+++ b/app/html/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/html",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "Storybook for HTML: View HTML snippets in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.7",
+    "@storybook/core": "5.0.0-rc.8",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/marko/package.json b/app/marko/package.json
index c5191b6e5de..982e8aa5545 100644
--- a/app/marko/package.json
+++ b/app/marko/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/marko",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "Storybook for Marko: Develop Marko Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.7",
+    "@storybook/core": "5.0.0-rc.8",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/mithril/package.json b/app/mithril/package.json
index 8785c72b9db..f2eced986ff 100644
--- a/app/mithril/package.json
+++ b/app/mithril/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/mithril",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "Storybook for Mithril: Develop Mithril Component in isolation.",
   "keywords": [
     "storybook"
@@ -26,7 +26,7 @@
   },
   "dependencies": {
     "@babel/plugin-transform-react-jsx": "^7.3.0",
-    "@storybook/core": "5.0.0-rc.7",
+    "@storybook/core": "5.0.0-rc.8",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/polymer/package.json b/app/polymer/package.json
index 6e5dec11786..0f8a0911ecb 100644
--- a/app/polymer/package.json
+++ b/app/polymer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/polymer",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "Storybook for Polymer: Develop Polymer components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.7",
+    "@storybook/core": "5.0.0-rc.8",
     "@webcomponents/webcomponentsjs": "^1.2.0",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
diff --git a/app/preact/package.json b/app/preact/package.json
index e7e346a76e4..2e5eafb74a6 100644
--- a/app/preact/package.json
+++ b/app/preact/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/preact",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "Storybook for Preact: Develop Preact Component in isolation.",
   "keywords": [
     "storybook"
@@ -26,7 +26,7 @@
   },
   "dependencies": {
     "@babel/plugin-transform-react-jsx": "^7.3.0",
-    "@storybook/core": "5.0.0-rc.7",
+    "@storybook/core": "5.0.0-rc.8",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/react-native/package.json b/app/react-native/package.json
index 672f893fd4d..46819e8a335 100644
--- a/app/react-native/package.json
+++ b/app/react-native/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/react-native",
   "private": true,
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "A better way to develop React Native Components for your app",
   "keywords": [
     "react",
@@ -26,12 +26,12 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.7",
-    "@storybook/channel-websocket": "5.0.0-rc.7",
-    "@storybook/channels": "5.0.0-rc.7",
-    "@storybook/core": "5.0.0-rc.7",
-    "@storybook/core-events": "5.0.0-rc.7",
-    "@storybook/ui": "5.0.0-rc.7",
+    "@storybook/addons": "5.0.0-rc.8",
+    "@storybook/channel-websocket": "5.0.0-rc.8",
+    "@storybook/channels": "5.0.0-rc.8",
+    "@storybook/core": "5.0.0-rc.8",
+    "@storybook/core-events": "5.0.0-rc.8",
+    "@storybook/ui": "5.0.0-rc.8",
     "babel-loader": "^8.0.4",
     "babel-plugin-macros": "^2.4.5",
     "babel-plugin-syntax-async-functions": "^6.13.0",
diff --git a/app/react/package.json b/app/react/package.json
index 9faf4d27118..07d75c857fc 100644
--- a/app/react/package.json
+++ b/app/react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/react",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "Storybook for React: Develop React Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -28,9 +28,9 @@
     "@babel/plugin-transform-react-constant-elements": "^7.2.0",
     "@babel/preset-flow": "^7.0.0",
     "@babel/preset-react": "^7.0.0",
-    "@storybook/core": "5.0.0-rc.7",
-    "@storybook/node-logger": "5.0.0-rc.7",
-    "@storybook/theming": "5.0.0-rc.7",
+    "@storybook/core": "5.0.0-rc.8",
+    "@storybook/node-logger": "5.0.0-rc.8",
+    "@storybook/theming": "5.0.0-rc.8",
     "@svgr/webpack": "^4.0.3",
     "babel-plugin-named-asset-import": "^0.3.0",
     "babel-plugin-react-docgen": "^2.0.2",
diff --git a/app/riot/package.json b/app/riot/package.json
index 7ba3ab7cd84..141df4b81ac 100644
--- a/app/riot/package.json
+++ b/app/riot/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/riot",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "Storybook for riot.js: View riot snippets in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.7",
+    "@storybook/core": "5.0.0-rc.8",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/svelte/package.json b/app/svelte/package.json
index 9043f07198a..e287ab1ed93 100644
--- a/app/svelte/package.json
+++ b/app/svelte/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/svelte",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "Storybook for Svelte: Develop Svelte Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.7",
+    "@storybook/core": "5.0.0-rc.8",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/vue/package.json b/app/vue/package.json
index 22ee6076d28..2b2c9dba37f 100644
--- a/app/vue/package.json
+++ b/app/vue/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/vue",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "Storybook for Vue: Develop Vue Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.7",
+    "@storybook/core": "5.0.0-rc.8",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/examples/angular-cli/package.json b/examples/angular-cli/package.json
index 6ccf4465590..87023401ecb 100644
--- a/examples/angular-cli/package.json
+++ b/examples/angular-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "angular-cli",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "private": true,
   "license": "MIT",
   "scripts": {
@@ -33,18 +33,18 @@
     "@angular-devkit/build-angular": "^0.13.1",
     "@angular/cli": "^7.3.2",
     "@angular/compiler-cli": "^7.2.1",
-    "@storybook/addon-actions": "5.0.0-rc.7",
-    "@storybook/addon-backgrounds": "5.0.0-rc.7",
-    "@storybook/addon-centered": "5.0.0-rc.7",
-    "@storybook/addon-jest": "5.0.0-rc.7",
-    "@storybook/addon-knobs": "5.0.0-rc.7",
-    "@storybook/addon-links": "5.0.0-rc.7",
-    "@storybook/addon-notes": "5.0.0-rc.7",
-    "@storybook/addon-options": "5.0.0-rc.7",
-    "@storybook/addon-storyshots": "5.0.0-rc.7",
-    "@storybook/addon-storysource": "5.0.0-rc.7",
-    "@storybook/addons": "5.0.0-rc.7",
-    "@storybook/angular": "5.0.0-rc.7",
+    "@storybook/addon-actions": "5.0.0-rc.8",
+    "@storybook/addon-backgrounds": "5.0.0-rc.8",
+    "@storybook/addon-centered": "5.0.0-rc.8",
+    "@storybook/addon-jest": "5.0.0-rc.8",
+    "@storybook/addon-knobs": "5.0.0-rc.8",
+    "@storybook/addon-links": "5.0.0-rc.8",
+    "@storybook/addon-notes": "5.0.0-rc.8",
+    "@storybook/addon-options": "5.0.0-rc.8",
+    "@storybook/addon-storyshots": "5.0.0-rc.8",
+    "@storybook/addon-storysource": "5.0.0-rc.8",
+    "@storybook/addons": "5.0.0-rc.8",
+    "@storybook/angular": "5.0.0-rc.8",
     "@types/core-js": "^2.5.0",
     "@types/jest": "^23.3.13",
     "@types/node": "~10.12.19",
diff --git a/examples/cra-kitchen-sink/package.json b/examples/cra-kitchen-sink/package.json
index df417600274..4dd4474c589 100644
--- a/examples/cra-kitchen-sink/package.json
+++ b/examples/cra-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "cra-kitchen-sink",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "private": true,
   "scripts": {
     "build": "react-scripts build",
@@ -18,21 +18,21 @@
     "react-lifecycles-compat": "^3.0.4"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.0.0-rc.7",
-    "@storybook/addon-actions": "5.0.0-rc.7",
-    "@storybook/addon-backgrounds": "5.0.0-rc.7",
-    "@storybook/addon-centered": "5.0.0-rc.7",
-    "@storybook/addon-events": "5.0.0-rc.7",
-    "@storybook/addon-info": "5.0.0-rc.7",
-    "@storybook/addon-jest": "5.0.0-rc.7",
-    "@storybook/addon-knobs": "5.0.0-rc.7",
-    "@storybook/addon-links": "5.0.0-rc.7",
-    "@storybook/addon-notes": "5.0.0-rc.7",
-    "@storybook/addon-options": "5.0.0-rc.7",
-    "@storybook/addon-storyshots": "5.0.0-rc.7",
-    "@storybook/addons": "5.0.0-rc.7",
-    "@storybook/client-logger": "5.0.0-rc.7",
-    "@storybook/react": "5.0.0-rc.7",
+    "@storybook/addon-a11y": "5.0.0-rc.8",
+    "@storybook/addon-actions": "5.0.0-rc.8",
+    "@storybook/addon-backgrounds": "5.0.0-rc.8",
+    "@storybook/addon-centered": "5.0.0-rc.8",
+    "@storybook/addon-events": "5.0.0-rc.8",
+    "@storybook/addon-info": "5.0.0-rc.8",
+    "@storybook/addon-jest": "5.0.0-rc.8",
+    "@storybook/addon-knobs": "5.0.0-rc.8",
+    "@storybook/addon-links": "5.0.0-rc.8",
+    "@storybook/addon-notes": "5.0.0-rc.8",
+    "@storybook/addon-options": "5.0.0-rc.8",
+    "@storybook/addon-storyshots": "5.0.0-rc.8",
+    "@storybook/addons": "5.0.0-rc.8",
+    "@storybook/client-logger": "5.0.0-rc.8",
+    "@storybook/react": "5.0.0-rc.8",
     "enzyme": "^3.7.0",
     "enzyme-adapter-react-16": "^1.9.1",
     "enzyme-to-json": "^3.3.4",
diff --git a/examples/cra-ts-kitchen-sink/package.json b/examples/cra-ts-kitchen-sink/package.json
index 093c2823782..145e91221c8 100644
--- a/examples/cra-ts-kitchen-sink/package.json
+++ b/examples/cra-ts-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "cra-ts-kitchen-sink",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook -s public",
@@ -19,11 +19,11 @@
     "react-dom": "^16.8.1"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.7",
-    "@storybook/addon-info": "5.0.0-rc.7",
-    "@storybook/addon-options": "5.0.0-rc.7",
-    "@storybook/addons": "5.0.0-rc.7",
-    "@storybook/react": "5.0.0-rc.7",
+    "@storybook/addon-actions": "5.0.0-rc.8",
+    "@storybook/addon-info": "5.0.0-rc.8",
+    "@storybook/addon-options": "5.0.0-rc.8",
+    "@storybook/addons": "5.0.0-rc.8",
+    "@storybook/react": "5.0.0-rc.8",
     "@types/enzyme": "^3.1.15",
     "@types/react": "^16.7.22",
     "@types/react-dom": "^16.0.11",
diff --git a/examples/ember-cli/package.json b/examples/ember-cli/package.json
index 6a83e56b644..851f5dbb994 100644
--- a/examples/ember-cli/package.json
+++ b/examples/ember-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "ember-example",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "private": true,
   "scripts": {
     "build": "ember build",
@@ -14,18 +14,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.2.2",
-    "@storybook/addon-a11y": "5.0.0-rc.7",
-    "@storybook/addon-actions": "5.0.0-rc.7",
-    "@storybook/addon-backgrounds": "5.0.0-rc.7",
-    "@storybook/addon-centered": "5.0.0-rc.7",
-    "@storybook/addon-knobs": "5.0.0-rc.7",
-    "@storybook/addon-links": "5.0.0-rc.7",
-    "@storybook/addon-notes": "5.0.0-rc.7",
-    "@storybook/addon-options": "5.0.0-rc.7",
-    "@storybook/addon-storysource": "5.0.0-rc.7",
-    "@storybook/addon-viewport": "5.0.0-rc.7",
-    "@storybook/addons": "5.0.0-rc.7",
-    "@storybook/ember": "5.0.0-rc.7",
+    "@storybook/addon-a11y": "5.0.0-rc.8",
+    "@storybook/addon-actions": "5.0.0-rc.8",
+    "@storybook/addon-backgrounds": "5.0.0-rc.8",
+    "@storybook/addon-centered": "5.0.0-rc.8",
+    "@storybook/addon-knobs": "5.0.0-rc.8",
+    "@storybook/addon-links": "5.0.0-rc.8",
+    "@storybook/addon-notes": "5.0.0-rc.8",
+    "@storybook/addon-options": "5.0.0-rc.8",
+    "@storybook/addon-storysource": "5.0.0-rc.8",
+    "@storybook/addon-viewport": "5.0.0-rc.8",
+    "@storybook/addons": "5.0.0-rc.8",
+    "@storybook/ember": "5.0.0-rc.8",
     "babel-loader": "^8",
     "broccoli-asset-rev": "^3.0.0",
     "cross-env": "^5.2.0",
diff --git a/examples/html-kitchen-sink/package.json b/examples/html-kitchen-sink/package.json
index 2367df64363..85a8cd8cf31 100644
--- a/examples/html-kitchen-sink/package.json
+++ b/examples/html-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "html-kitchen-sink",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "private": true,
   "description": "",
   "keywords": [],
@@ -13,23 +13,23 @@
     "storybook": "start-storybook -p 9006"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.0.0-rc.7",
-    "@storybook/addon-actions": "5.0.0-rc.7",
-    "@storybook/addon-backgrounds": "5.0.0-rc.7",
-    "@storybook/addon-centered": "5.0.0-rc.7",
-    "@storybook/addon-events": "5.0.0-rc.7",
-    "@storybook/addon-jest": "5.0.0-rc.7",
-    "@storybook/addon-knobs": "5.0.0-rc.7",
-    "@storybook/addon-links": "5.0.0-rc.7",
-    "@storybook/addon-notes": "5.0.0-rc.7",
-    "@storybook/addon-options": "5.0.0-rc.7",
-    "@storybook/addon-storyshots": "5.0.0-rc.7",
-    "@storybook/addon-storysource": "5.0.0-rc.7",
-    "@storybook/addon-viewport": "5.0.0-rc.7",
-    "@storybook/addons": "5.0.0-rc.7",
-    "@storybook/core": "5.0.0-rc.7",
-    "@storybook/core-events": "5.0.0-rc.7",
-    "@storybook/html": "5.0.0-rc.7",
+    "@storybook/addon-a11y": "5.0.0-rc.8",
+    "@storybook/addon-actions": "5.0.0-rc.8",
+    "@storybook/addon-backgrounds": "5.0.0-rc.8",
+    "@storybook/addon-centered": "5.0.0-rc.8",
+    "@storybook/addon-events": "5.0.0-rc.8",
+    "@storybook/addon-jest": "5.0.0-rc.8",
+    "@storybook/addon-knobs": "5.0.0-rc.8",
+    "@storybook/addon-links": "5.0.0-rc.8",
+    "@storybook/addon-notes": "5.0.0-rc.8",
+    "@storybook/addon-options": "5.0.0-rc.8",
+    "@storybook/addon-storyshots": "5.0.0-rc.8",
+    "@storybook/addon-storysource": "5.0.0-rc.8",
+    "@storybook/addon-viewport": "5.0.0-rc.8",
+    "@storybook/addons": "5.0.0-rc.8",
+    "@storybook/core": "5.0.0-rc.8",
+    "@storybook/core-events": "5.0.0-rc.8",
+    "@storybook/html": "5.0.0-rc.8",
     "eventemitter3": "^3.1.0",
     "format-json": "^1.0.3",
     "global": "^4.3.2",
diff --git a/examples/marko-cli/package.json b/examples/marko-cli/package.json
index 9f4c816f18a..4685846ee05 100644
--- a/examples/marko-cli/package.json
+++ b/examples/marko-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "marko-cli",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "private": true,
   "description": "Demo of how to build an app using marko-starter",
   "repository": {
@@ -22,12 +22,12 @@
     "marko-starter": "^2.0.4"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.7",
-    "@storybook/addon-knobs": "5.0.0-rc.7",
-    "@storybook/addon-options": "5.0.0-rc.7",
-    "@storybook/addon-storysource": "5.0.0-rc.7",
-    "@storybook/addons": "5.0.0-rc.7",
-    "@storybook/marko": "5.0.0-rc.7",
+    "@storybook/addon-actions": "5.0.0-rc.8",
+    "@storybook/addon-knobs": "5.0.0-rc.8",
+    "@storybook/addon-options": "5.0.0-rc.8",
+    "@storybook/addon-storysource": "5.0.0-rc.8",
+    "@storybook/addons": "5.0.0-rc.8",
+    "@storybook/marko": "5.0.0-rc.8",
     "prettier": "^1.16.4",
     "webpack": "^4.29.0"
   }
diff --git a/examples/mithril-kitchen-sink/package.json b/examples/mithril-kitchen-sink/package.json
index 38778c8a1e8..5f75636c85e 100644
--- a/examples/mithril-kitchen-sink/package.json
+++ b/examples/mithril-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "mithril-example",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook",
@@ -10,18 +10,18 @@
     "mithril": "^1.1.6"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.7",
-    "@storybook/addon-backgrounds": "5.0.0-rc.7",
-    "@storybook/addon-centered": "5.0.0-rc.7",
-    "@storybook/addon-knobs": "5.0.0-rc.7",
-    "@storybook/addon-links": "5.0.0-rc.7",
-    "@storybook/addon-notes": "5.0.0-rc.7",
-    "@storybook/addon-options": "5.0.0-rc.7",
-    "@storybook/addon-storyshots": "5.0.0-rc.7",
-    "@storybook/addon-storysource": "5.0.0-rc.7",
-    "@storybook/addon-viewport": "5.0.0-rc.7",
-    "@storybook/addons": "5.0.0-rc.7",
-    "@storybook/mithril": "5.0.0-rc.7",
+    "@storybook/addon-actions": "5.0.0-rc.8",
+    "@storybook/addon-backgrounds": "5.0.0-rc.8",
+    "@storybook/addon-centered": "5.0.0-rc.8",
+    "@storybook/addon-knobs": "5.0.0-rc.8",
+    "@storybook/addon-links": "5.0.0-rc.8",
+    "@storybook/addon-notes": "5.0.0-rc.8",
+    "@storybook/addon-options": "5.0.0-rc.8",
+    "@storybook/addon-storyshots": "5.0.0-rc.8",
+    "@storybook/addon-storysource": "5.0.0-rc.8",
+    "@storybook/addon-viewport": "5.0.0-rc.8",
+    "@storybook/addons": "5.0.0-rc.8",
+    "@storybook/mithril": "5.0.0-rc.8",
     "webpack": "^4.29.0"
   }
 }
diff --git a/examples/official-storybook/package.json b/examples/official-storybook/package.json
index cb3b56848a5..3e0d171bab0 100644
--- a/examples/official-storybook/package.json
+++ b/examples/official-storybook/package.json
@@ -1,6 +1,6 @@
 {
   "name": "official-storybook",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook -c ./ -s built-storybooks",
@@ -12,29 +12,29 @@
     "storybook": "cross-env STORYBOOK_DISPLAY_WARNING=true DISPLAY_WARNING=true start-storybook -p 9011 -c ./ -s built-storybooks --no-dll"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.0.0-rc.7",
-    "@storybook/addon-actions": "5.0.0-rc.7",
-    "@storybook/addon-backgrounds": "5.0.0-rc.7",
-    "@storybook/addon-centered": "5.0.0-rc.7",
-    "@storybook/addon-cssresources": "5.0.0-rc.7",
-    "@storybook/addon-events": "5.0.0-rc.7",
-    "@storybook/addon-graphql": "5.0.0-rc.7",
-    "@storybook/addon-info": "5.0.0-rc.7",
-    "@storybook/addon-jest": "5.0.0-rc.7",
-    "@storybook/addon-knobs": "5.0.0-rc.7",
-    "@storybook/addon-links": "5.0.0-rc.7",
-    "@storybook/addon-notes": "5.0.0-rc.7",
-    "@storybook/addon-options": "5.0.0-rc.7",
-    "@storybook/addon-storyshots": "5.0.0-rc.7",
-    "@storybook/addon-storyshots-puppeteer": "5.0.0-rc.7",
-    "@storybook/addon-storysource": "5.0.0-rc.7",
-    "@storybook/addon-viewport": "5.0.0-rc.7",
-    "@storybook/addons": "5.0.0-rc.7",
-    "@storybook/components": "5.0.0-rc.7",
-    "@storybook/core-events": "5.0.0-rc.7",
-    "@storybook/node-logger": "5.0.0-rc.7",
-    "@storybook/react": "5.0.0-rc.7",
-    "@storybook/theming": "5.0.0-rc.7",
+    "@storybook/addon-a11y": "5.0.0-rc.8",
+    "@storybook/addon-actions": "5.0.0-rc.8",
+    "@storybook/addon-backgrounds": "5.0.0-rc.8",
+    "@storybook/addon-centered": "5.0.0-rc.8",
+    "@storybook/addon-cssresources": "5.0.0-rc.8",
+    "@storybook/addon-events": "5.0.0-rc.8",
+    "@storybook/addon-graphql": "5.0.0-rc.8",
+    "@storybook/addon-info": "5.0.0-rc.8",
+    "@storybook/addon-jest": "5.0.0-rc.8",
+    "@storybook/addon-knobs": "5.0.0-rc.8",
+    "@storybook/addon-links": "5.0.0-rc.8",
+    "@storybook/addon-notes": "5.0.0-rc.8",
+    "@storybook/addon-options": "5.0.0-rc.8",
+    "@storybook/addon-storyshots": "5.0.0-rc.8",
+    "@storybook/addon-storyshots-puppeteer": "5.0.0-rc.8",
+    "@storybook/addon-storysource": "5.0.0-rc.8",
+    "@storybook/addon-viewport": "5.0.0-rc.8",
+    "@storybook/addons": "5.0.0-rc.8",
+    "@storybook/components": "5.0.0-rc.8",
+    "@storybook/core-events": "5.0.0-rc.8",
+    "@storybook/node-logger": "5.0.0-rc.8",
+    "@storybook/react": "5.0.0-rc.8",
+    "@storybook/theming": "5.0.0-rc.8",
     "cors": "^2.8.4",
     "cross-env": "^5.2.0",
     "enzyme-to-json": "^3.3.4",
diff --git a/examples/polymer-cli/package.json b/examples/polymer-cli/package.json
index 867fa5978db..547d10e9671 100644
--- a/examples/polymer-cli/package.json
+++ b/examples/polymer-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "polymer-cli",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook",
@@ -9,15 +9,15 @@
   },
   "dependencies": {
     "@polymer/polymer": "^2.6.0",
-    "@storybook/addon-actions": "5.0.0-rc.7",
-    "@storybook/addon-backgrounds": "5.0.0-rc.7",
-    "@storybook/addon-knobs": "5.0.0-rc.7",
-    "@storybook/addon-links": "5.0.0-rc.7",
-    "@storybook/addon-notes": "5.0.0-rc.7",
-    "@storybook/addon-options": "5.0.0-rc.7",
-    "@storybook/addon-storysource": "5.0.0-rc.7",
-    "@storybook/addon-viewport": "5.0.0-rc.7",
-    "@storybook/polymer": "5.0.0-rc.7",
+    "@storybook/addon-actions": "5.0.0-rc.8",
+    "@storybook/addon-backgrounds": "5.0.0-rc.8",
+    "@storybook/addon-knobs": "5.0.0-rc.8",
+    "@storybook/addon-links": "5.0.0-rc.8",
+    "@storybook/addon-notes": "5.0.0-rc.8",
+    "@storybook/addon-options": "5.0.0-rc.8",
+    "@storybook/addon-storysource": "5.0.0-rc.8",
+    "@storybook/addon-viewport": "5.0.0-rc.8",
+    "@storybook/polymer": "5.0.0-rc.8",
     "@webcomponents/webcomponentsjs": "^1.2.0",
     "global": "^4.3.2",
     "lit-html": "^1.0.0",
diff --git a/examples/preact-kitchen-sink/package.json b/examples/preact-kitchen-sink/package.json
index a5529c8f051..33ee8d0d4c7 100644
--- a/examples/preact-kitchen-sink/package.json
+++ b/examples/preact-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "preact-example",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "private": true,
   "scripts": {
     "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
@@ -15,18 +15,18 @@
   "devDependencies": {
     "@babel/core": "^7.2.2",
     "@babel/plugin-transform-runtime": "^7.2.0",
-    "@storybook/addon-actions": "5.0.0-rc.7",
-    "@storybook/addon-backgrounds": "5.0.0-rc.7",
-    "@storybook/addon-centered": "5.0.0-rc.7",
-    "@storybook/addon-knobs": "5.0.0-rc.7",
-    "@storybook/addon-links": "5.0.0-rc.7",
-    "@storybook/addon-notes": "5.0.0-rc.7",
-    "@storybook/addon-options": "5.0.0-rc.7",
-    "@storybook/addon-storyshots": "5.0.0-rc.7",
-    "@storybook/addon-storysource": "5.0.0-rc.7",
-    "@storybook/addon-viewport": "5.0.0-rc.7",
-    "@storybook/addons": "5.0.0-rc.7",
-    "@storybook/preact": "5.0.0-rc.7",
+    "@storybook/addon-actions": "5.0.0-rc.8",
+    "@storybook/addon-backgrounds": "5.0.0-rc.8",
+    "@storybook/addon-centered": "5.0.0-rc.8",
+    "@storybook/addon-knobs": "5.0.0-rc.8",
+    "@storybook/addon-links": "5.0.0-rc.8",
+    "@storybook/addon-notes": "5.0.0-rc.8",
+    "@storybook/addon-options": "5.0.0-rc.8",
+    "@storybook/addon-storyshots": "5.0.0-rc.8",
+    "@storybook/addon-storysource": "5.0.0-rc.8",
+    "@storybook/addon-viewport": "5.0.0-rc.8",
+    "@storybook/addons": "5.0.0-rc.8",
+    "@storybook/preact": "5.0.0-rc.8",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
     "file-loader": "^3.0.1",
diff --git a/examples/riot-kitchen-sink/package.json b/examples/riot-kitchen-sink/package.json
index aa95fa8ee92..18c672aa177 100644
--- a/examples/riot-kitchen-sink/package.json
+++ b/examples/riot-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "riot-example",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "private": true,
   "scripts": {
     "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
@@ -15,18 +15,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.2.2",
-    "@storybook/addon-actions": "5.0.0-rc.7",
-    "@storybook/addon-backgrounds": "5.0.0-rc.7",
-    "@storybook/addon-centered": "5.0.0-rc.7",
-    "@storybook/addon-knobs": "5.0.0-rc.7",
-    "@storybook/addon-links": "5.0.0-rc.7",
-    "@storybook/addon-notes": "5.0.0-rc.7",
-    "@storybook/addon-options": "5.0.0-rc.7",
-    "@storybook/addon-storyshots": "5.0.0-rc.7",
-    "@storybook/addon-storysource": "5.0.0-rc.7",
-    "@storybook/addon-viewport": "5.0.0-rc.7",
-    "@storybook/addons": "5.0.0-rc.7",
-    "@storybook/riot": "5.0.0-rc.7",
+    "@storybook/addon-actions": "5.0.0-rc.8",
+    "@storybook/addon-backgrounds": "5.0.0-rc.8",
+    "@storybook/addon-centered": "5.0.0-rc.8",
+    "@storybook/addon-knobs": "5.0.0-rc.8",
+    "@storybook/addon-links": "5.0.0-rc.8",
+    "@storybook/addon-notes": "5.0.0-rc.8",
+    "@storybook/addon-options": "5.0.0-rc.8",
+    "@storybook/addon-storyshots": "5.0.0-rc.8",
+    "@storybook/addon-storysource": "5.0.0-rc.8",
+    "@storybook/addon-viewport": "5.0.0-rc.8",
+    "@storybook/addons": "5.0.0-rc.8",
+    "@storybook/riot": "5.0.0-rc.8",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
     "file-loader": "^3.0.1",
diff --git a/examples/svelte-kitchen-sink/package.json b/examples/svelte-kitchen-sink/package.json
index c7e7561e3fa..622796bbffd 100644
--- a/examples/svelte-kitchen-sink/package.json
+++ b/examples/svelte-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "svelte-example",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook -s public",
@@ -10,17 +10,17 @@
     "global": "^4.3.2"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.7",
-    "@storybook/addon-backgrounds": "5.0.0-rc.7",
-    "@storybook/addon-centered": "5.0.0-rc.7",
-    "@storybook/addon-knobs": "5.0.0-rc.7",
-    "@storybook/addon-links": "5.0.0-rc.7",
-    "@storybook/addon-notes": "5.0.0-rc.7",
-    "@storybook/addon-options": "5.0.0-rc.7",
-    "@storybook/addon-storyshots": "5.0.0-rc.7",
-    "@storybook/addon-storysource": "5.0.0-rc.7",
-    "@storybook/addon-viewport": "5.0.0-rc.7",
-    "@storybook/addons": "5.0.0-rc.7",
-    "@storybook/svelte": "5.0.0-rc.7"
+    "@storybook/addon-actions": "5.0.0-rc.8",
+    "@storybook/addon-backgrounds": "5.0.0-rc.8",
+    "@storybook/addon-centered": "5.0.0-rc.8",
+    "@storybook/addon-knobs": "5.0.0-rc.8",
+    "@storybook/addon-links": "5.0.0-rc.8",
+    "@storybook/addon-notes": "5.0.0-rc.8",
+    "@storybook/addon-options": "5.0.0-rc.8",
+    "@storybook/addon-storyshots": "5.0.0-rc.8",
+    "@storybook/addon-storysource": "5.0.0-rc.8",
+    "@storybook/addon-viewport": "5.0.0-rc.8",
+    "@storybook/addons": "5.0.0-rc.8",
+    "@storybook/svelte": "5.0.0-rc.8"
   }
 }
diff --git a/examples/vue-kitchen-sink/package.json b/examples/vue-kitchen-sink/package.json
index be648a993d3..8c0583ba28f 100644
--- a/examples/vue-kitchen-sink/package.json
+++ b/examples/vue-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "vue-example",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "private": true,
   "scripts": {
     "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
@@ -14,18 +14,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.2.2",
-    "@storybook/addon-actions": "5.0.0-rc.7",
-    "@storybook/addon-backgrounds": "5.0.0-rc.7",
-    "@storybook/addon-centered": "5.0.0-rc.7",
-    "@storybook/addon-knobs": "5.0.0-rc.7",
-    "@storybook/addon-links": "5.0.0-rc.7",
-    "@storybook/addon-notes": "5.0.0-rc.7",
-    "@storybook/addon-options": "5.0.0-rc.7",
-    "@storybook/addon-storyshots": "5.0.0-rc.7",
-    "@storybook/addon-storysource": "5.0.0-rc.7",
-    "@storybook/addon-viewport": "5.0.0-rc.7",
-    "@storybook/addons": "5.0.0-rc.7",
-    "@storybook/vue": "5.0.0-rc.7",
+    "@storybook/addon-actions": "5.0.0-rc.8",
+    "@storybook/addon-backgrounds": "5.0.0-rc.8",
+    "@storybook/addon-centered": "5.0.0-rc.8",
+    "@storybook/addon-knobs": "5.0.0-rc.8",
+    "@storybook/addon-links": "5.0.0-rc.8",
+    "@storybook/addon-notes": "5.0.0-rc.8",
+    "@storybook/addon-options": "5.0.0-rc.8",
+    "@storybook/addon-storyshots": "5.0.0-rc.8",
+    "@storybook/addon-storysource": "5.0.0-rc.8",
+    "@storybook/addon-viewport": "5.0.0-rc.8",
+    "@storybook/addons": "5.0.0-rc.8",
+    "@storybook/vue": "5.0.0-rc.8",
     "babel-core": "^7.0.0-bridge.0",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
diff --git a/lerna.json b/lerna.json
index c1962f5af86..aa824e658c3 100644
--- a/lerna.json
+++ b/lerna.json
@@ -11,5 +11,5 @@
   "npmClient": "yarn",
   "useWorkspaces": true,
   "registry": "https://registry.npmjs.org",
-  "version": "5.0.0-rc.7"
+  "version": "5.0.0-rc.8"
 }
diff --git a/lib/addons/package.json b/lib/addons/package.json
index 4097f9dc767..500dccafa7c 100644
--- a/lib/addons/package.json
+++ b/lib/addons/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addons",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "Storybook addons store",
   "keywords": [
     "storybook"
@@ -20,8 +20,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.0.0-rc.7",
-    "@storybook/client-logger": "5.0.0-rc.7",
+    "@storybook/channels": "5.0.0-rc.8",
+    "@storybook/client-logger": "5.0.0-rc.8",
     "global": "^4.3.2",
     "util-deprecate": "^1.0.2"
   },
diff --git a/lib/channel-postmessage/package.json b/lib/channel-postmessage/package.json
index 87b44a30248..1e82d7e6372 100644
--- a/lib/channel-postmessage/package.json
+++ b/lib/channel-postmessage/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channel-postmessage",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "",
   "keywords": [
     "storybook"
@@ -20,8 +20,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.0.0-rc.7",
-    "@storybook/client-logger": "5.0.0-rc.7",
+    "@storybook/channels": "5.0.0-rc.8",
+    "@storybook/client-logger": "5.0.0-rc.8",
     "global": "^4.3.2",
     "telejson": "^2.1.0"
   },
diff --git a/lib/channel-websocket/package.json b/lib/channel-websocket/package.json
index c27669e6913..01d535dcaaa 100644
--- a/lib/channel-websocket/package.json
+++ b/lib/channel-websocket/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channel-websocket",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "",
   "keywords": [
     "storybook"
@@ -20,7 +20,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.0.0-rc.7",
+    "@storybook/channels": "5.0.0-rc.8",
     "global": "^4.3.2",
     "json-fn": "^1.1.1"
   },
diff --git a/lib/channels/package.json b/lib/channels/package.json
index 5660d7c1966..6d744573caf 100644
--- a/lib/channels/package.json
+++ b/lib/channels/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channels",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/cli/package.json b/lib/cli/package.json
index 9be74b7ba1c..1c2b05feb20 100644
--- a/lib/cli/package.json
+++ b/lib/cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/cli",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "Storybook's CLI - easiest method of adding storybook to your projects",
   "keywords": [
     "cli",
@@ -29,7 +29,7 @@
     "@babel/core": "^7.2.2",
     "@babel/preset-env": "^7.3.1",
     "@babel/register": "^7.0.0",
-    "@storybook/codemod": "5.0.0-rc.7",
+    "@storybook/codemod": "5.0.0-rc.8",
     "chalk": "^2.4.1",
     "commander": "^2.19.0",
     "core-js": "^2.6.2",
@@ -43,31 +43,31 @@
     "update-notifier": "^2.5.0"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.7",
-    "@storybook/addon-centered": "5.0.0-rc.7",
-    "@storybook/addon-graphql": "5.0.0-rc.7",
-    "@storybook/addon-info": "5.0.0-rc.7",
-    "@storybook/addon-knobs": "5.0.0-rc.7",
-    "@storybook/addon-links": "5.0.0-rc.7",
-    "@storybook/addon-notes": "5.0.0-rc.7",
-    "@storybook/addon-options": "5.0.0-rc.7",
-    "@storybook/addon-storyshots": "5.0.0-rc.7",
-    "@storybook/addons": "5.0.0-rc.7",
-    "@storybook/angular": "5.0.0-rc.7",
-    "@storybook/channel-postmessage": "5.0.0-rc.7",
-    "@storybook/channel-websocket": "5.0.0-rc.7",
-    "@storybook/channels": "5.0.0-rc.7",
-    "@storybook/ember": "5.0.0-rc.7",
-    "@storybook/html": "5.0.0-rc.7",
-    "@storybook/marko": "5.0.0-rc.7",
-    "@storybook/mithril": "5.0.0-rc.7",
-    "@storybook/polymer": "5.0.0-rc.7",
-    "@storybook/preact": "5.0.0-rc.7",
-    "@storybook/react": "5.0.0-rc.7",
-    "@storybook/react-native": "5.0.0-rc.7",
-    "@storybook/riot": "5.0.0-rc.7",
-    "@storybook/ui": "5.0.0-rc.7",
-    "@storybook/vue": "5.0.0-rc.7"
+    "@storybook/addon-actions": "5.0.0-rc.8",
+    "@storybook/addon-centered": "5.0.0-rc.8",
+    "@storybook/addon-graphql": "5.0.0-rc.8",
+    "@storybook/addon-info": "5.0.0-rc.8",
+    "@storybook/addon-knobs": "5.0.0-rc.8",
+    "@storybook/addon-links": "5.0.0-rc.8",
+    "@storybook/addon-notes": "5.0.0-rc.8",
+    "@storybook/addon-options": "5.0.0-rc.8",
+    "@storybook/addon-storyshots": "5.0.0-rc.8",
+    "@storybook/addons": "5.0.0-rc.8",
+    "@storybook/angular": "5.0.0-rc.8",
+    "@storybook/channel-postmessage": "5.0.0-rc.8",
+    "@storybook/channel-websocket": "5.0.0-rc.8",
+    "@storybook/channels": "5.0.0-rc.8",
+    "@storybook/ember": "5.0.0-rc.8",
+    "@storybook/html": "5.0.0-rc.8",
+    "@storybook/marko": "5.0.0-rc.8",
+    "@storybook/mithril": "5.0.0-rc.8",
+    "@storybook/polymer": "5.0.0-rc.8",
+    "@storybook/preact": "5.0.0-rc.8",
+    "@storybook/react": "5.0.0-rc.8",
+    "@storybook/react-native": "5.0.0-rc.8",
+    "@storybook/riot": "5.0.0-rc.8",
+    "@storybook/ui": "5.0.0-rc.8",
+    "@storybook/vue": "5.0.0-rc.8"
   },
   "publishConfig": {
     "access": "public"
diff --git a/lib/client-api/package.json b/lib/client-api/package.json
index 25233060e25..7af6a8406e5 100644
--- a/lib/client-api/package.json
+++ b/lib/client-api/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/client-api",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "Storybook Client API",
   "keywords": [
     "storybook"
@@ -19,10 +19,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.7",
-    "@storybook/client-logger": "5.0.0-rc.7",
-    "@storybook/core-events": "5.0.0-rc.7",
-    "@storybook/router": "5.0.0-rc.7",
+    "@storybook/addons": "5.0.0-rc.8",
+    "@storybook/client-logger": "5.0.0-rc.8",
+    "@storybook/core-events": "5.0.0-rc.8",
+    "@storybook/router": "5.0.0-rc.8",
     "common-tags": "^1.8.0",
     "eventemitter3": "^3.1.0",
     "global": "^4.3.2",
diff --git a/lib/client-logger/package.json b/lib/client-logger/package.json
index 42bec0ee003..99a4d49161e 100644
--- a/lib/client-logger/package.json
+++ b/lib/client-logger/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/client-logger",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/codemod/package.json b/lib/codemod/package.json
index 5585c93e801..0681f5d9236 100644
--- a/lib/codemod/package.json
+++ b/lib/codemod/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/codemod",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "A collection of codemod scripts written with JSCodeshift",
   "keywords": [
     "storybook"
diff --git a/lib/components/package.json b/lib/components/package.json
index f79510c3f5a..ffb3151e155 100644
--- a/lib/components/package.json
+++ b/lib/components/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/components",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "Core Storybook Components",
   "keywords": [
     "storybook"
@@ -20,11 +20,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.7",
-    "@storybook/client-logger": "5.0.0-rc.7",
-    "@storybook/core-events": "5.0.0-rc.7",
-    "@storybook/router": "5.0.0-rc.7",
-    "@storybook/theming": "5.0.0-rc.7",
+    "@storybook/addons": "5.0.0-rc.8",
+    "@storybook/client-logger": "5.0.0-rc.8",
+    "@storybook/core-events": "5.0.0-rc.8",
+    "@storybook/router": "5.0.0-rc.8",
+    "@storybook/theming": "5.0.0-rc.8",
     "global": "^4.3.2",
     "immer": "^1.12.0",
     "js-beautify": "^1.8.9",
diff --git a/lib/core-events/package.json b/lib/core-events/package.json
index 486b80d9dc2..b86a6adbe84 100644
--- a/lib/core-events/package.json
+++ b/lib/core-events/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/core-events",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "Event names used in storybook core",
   "keywords": [
     "storybook"
diff --git a/lib/core/package.json b/lib/core/package.json
index 5a520e93ada..b14970dfccf 100644
--- a/lib/core/package.json
+++ b/lib/core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/core",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "Storybook framework-agnostic API",
   "keywords": [
     "storybook"
@@ -24,15 +24,15 @@
     "@babel/plugin-syntax-dynamic-import": "^7.2.0",
     "@babel/plugin-transform-react-constant-elements": "^7.2.0",
     "@babel/preset-env": "^7.3.1",
-    "@storybook/addons": "5.0.0-rc.7",
-    "@storybook/channel-postmessage": "5.0.0-rc.7",
-    "@storybook/client-api": "5.0.0-rc.7",
-    "@storybook/client-logger": "5.0.0-rc.7",
-    "@storybook/core-events": "5.0.0-rc.7",
-    "@storybook/node-logger": "5.0.0-rc.7",
-    "@storybook/router": "5.0.0-rc.7",
-    "@storybook/theming": "5.0.0-rc.7",
-    "@storybook/ui": "5.0.0-rc.7",
+    "@storybook/addons": "5.0.0-rc.8",
+    "@storybook/channel-postmessage": "5.0.0-rc.8",
+    "@storybook/client-api": "5.0.0-rc.8",
+    "@storybook/client-logger": "5.0.0-rc.8",
+    "@storybook/core-events": "5.0.0-rc.8",
+    "@storybook/node-logger": "5.0.0-rc.8",
+    "@storybook/router": "5.0.0-rc.8",
+    "@storybook/theming": "5.0.0-rc.8",
+    "@storybook/ui": "5.0.0-rc.8",
     "airbnb-js-shims": "^1 || ^2",
     "autoprefixer": "^9.4.7",
     "babel-plugin-add-react-displayname": "^0.0.5",
diff --git a/lib/node-logger/package.json b/lib/node-logger/package.json
index e2d8dfc92a7..aa44c8077b8 100644
--- a/lib/node-logger/package.json
+++ b/lib/node-logger/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/node-logger",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/router/package.json b/lib/router/package.json
index 3404698535f..a8335960d95 100644
--- a/lib/router/package.json
+++ b/lib/router/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/router",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "Core Storybook Router",
   "keywords": [
     "storybook"
@@ -20,7 +20,7 @@
   },
   "dependencies": {
     "@reach/router": "^1.2.1",
-    "@storybook/theming": "5.0.0-rc.7",
+    "@storybook/theming": "5.0.0-rc.8",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
     "qs": "^6.5.2"
diff --git a/lib/theming/package.json b/lib/theming/package.json
index e219c136a76..5e3d967081f 100644
--- a/lib/theming/package.json
+++ b/lib/theming/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/theming",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "Core Storybook Components",
   "keywords": [
     "storybook"
@@ -21,7 +21,7 @@
   "dependencies": {
     "@emotion/core": "^10.0.7",
     "@emotion/styled": "^10.0.7",
-    "@storybook/client-logger": "5.0.0-rc.7",
+    "@storybook/client-logger": "5.0.0-rc.8",
     "common-tags": "^1.8.0",
     "deep-object-diff": "^1.1.0",
     "emotion-theming": "^10.0.7",
diff --git a/lib/ui/package.json b/lib/ui/package.json
index 6c1ba284511..b7166ff9b36 100644
--- a/lib/ui/package.json
+++ b/lib/ui/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/ui",
-  "version": "5.0.0-rc.7",
+  "version": "5.0.0-rc.8",
   "description": "Core Storybook UI",
   "keywords": [
     "storybook"
@@ -21,12 +21,12 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.7",
-    "@storybook/client-logger": "5.0.0-rc.7",
-    "@storybook/components": "5.0.0-rc.7",
-    "@storybook/core-events": "5.0.0-rc.7",
-    "@storybook/router": "5.0.0-rc.7",
-    "@storybook/theming": "5.0.0-rc.7",
+    "@storybook/addons": "5.0.0-rc.8",
+    "@storybook/client-logger": "5.0.0-rc.8",
+    "@storybook/components": "5.0.0-rc.8",
+    "@storybook/core-events": "5.0.0-rc.8",
+    "@storybook/router": "5.0.0-rc.8",
+    "@storybook/theming": "5.0.0-rc.8",
     "eventemitter3": "^3.1.0",
     "fast-deep-equal": "^2.0.1",
     "fuse.js": "^3.3.1",

From da9c4f69266001bd0595af6c97a4564af91529ec Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Sat, 2 Mar 2019 01:29:44 +0800
Subject: [PATCH 107/249] 5.0.0-rc.8 versions.json

---
 docs/static/versions.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/docs/static/versions.json b/docs/static/versions.json
index 00618c69c9b..2a0233d1970 100644
--- a/docs/static/versions.json
+++ b/docs/static/versions.json
@@ -1 +1 @@
-{"next":{"version":"5.0.0-rc.7","info":{"plain":"### Features\n\n* UI: Page load animation and `STORIES_CONFIGURED` event ([#5756](https://github.com/storybooks/storybook/pull/5756))\n* Theming: Improve `brand` API  ([#5733](https://github.com/storybooks/storybook/pull/5733))\n* UI: Fuzzy search improvement ([#5748](https://github.com/storybooks/storybook/pull/5748))\n* UI: Add toolbar animation ([#5742](https://github.com/storybooks/storybook/pull/5742))\n\n### Bug Fixes\n\n* UI: Fix update notifications placement ([#5716](https://github.com/storybooks/storybook/pull/5716))\n* Angular: Fix global style imports ([#5776](https://github.com/storybooks/storybook/pull/5776))\n* Addon-options: Add backwards compatibility ([#5758](https://github.com/storybooks/storybook/pull/5758))\n* Addon-options: Fix deprecated url/name options ([#5773](https://github.com/storybooks/storybook/pull/5773))\n* Addon-knobs: Remove call to `forceReRender()` on `STORY_CHANGED` ([#5753](https://github.com/storybooks/storybook/pull/5753))\n* UI: Fix active state in addon-background, addon-viewport tools ([#5749](https://github.com/storybooks/storybook/pull/5749))"}}}
\ No newline at end of file
+{"next":{"version":"5.0.0-rc.8","info":{"plain":"### Features\n\n* Core: Allow local decorators via params ([#5806](https://github.com/storybooks/storybook/pull/5806))\n\n### Bug Fixes\n\n* UI: Sort storiesHash so grouped keys appear together ([#5805](https://github.com/storybooks/storybook/pull/5805))\n* UI: Close tooltips on iframe clicks on keypresses ([#5807](https://github.com/storybooks/storybook/pull/5807))\n* Addon-Info: Add font family to info panel ([#5759](https://github.com/storybooks/storybook/pull/5759))"}}}
\ No newline at end of file

From c15e07a646eb863dab9fe27f788e69a2cb611e00 Mon Sep 17 00:00:00 2001
From: CodeByAlex <wilsonc.alexander@gmail.com>
Date: Fri, 1 Mar 2019 19:18:58 -0500
Subject: [PATCH 108/249] edited variable name

---
 addons/knobs/src/registerKnobs.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/addons/knobs/src/registerKnobs.js b/addons/knobs/src/registerKnobs.js
index 8705cfe096e..9e14eb46ac3 100644
--- a/addons/knobs/src/registerKnobs.js
+++ b/addons/knobs/src/registerKnobs.js
@@ -31,7 +31,7 @@ function knobChanged(change) {
     knobStore.markAllUnused();
 
     forceReRender();
-  }, DEBOUNCE_DELAY_MS); // amount of time used to ensure that the user has time to type before re-rendering
+  }, KNOB_CHANGED_DEBOUNCE_DELAY_MS); // amount of time used to ensure that the user has time to type before re-rendering
 }
 
 function knobClicked(clicked) {

From 694f8e9c95a4f08d814283d9662f8305cac10d60 Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Sat, 2 Mar 2019 19:13:50 +0100
Subject: [PATCH 109/249] Merge pull request #5787 from
 storybooks/fix/theming-flash

FIX theming bugs
---
 examples/official-storybook/config.js         |   1 -
 .../stories/core/parameters.stories.js        |   2 +-
 .../__snapshots__/storyshots.test.js.snap     |   4 -
 lib/channel-postmessage/src/index.ts          |   2 +-
 lib/theming/src/ensure.ts                     |   8 +-
 lib/ui/package.json                           |   2 +-
 lib/ui/src/components/layout/container.js     |   9 +-
 lib/ui/src/core/addons.js                     |   4 +-
 lib/ui/src/core/context.js                    |   7 +-
 lib/ui/src/core/init-provider-api.js          |  82 +------------
 lib/ui/src/core/initial-state.js              |  15 ---
 lib/ui/src/core/layout.js                     | 110 +++++++++++++++++-
 lib/ui/src/core/store.js                      |   5 +-
 lib/ui/src/core/stories.js                    |  22 +---
 14 files changed, 137 insertions(+), 136 deletions(-)

diff --git a/examples/official-storybook/config.js b/examples/official-storybook/config.js
index b5f8ca2e8a2..51db2828b8b 100644
--- a/examples/official-storybook/config.js
+++ b/examples/official-storybook/config.js
@@ -51,7 +51,6 @@ addParameters({
   options: {
     hierarchySeparator: /\/|\./,
     hierarchyRootSeparator: '|',
-    // theme: themes.dark,
   },
   viewports: {
     ...INITIAL_VIEWPORTS,
diff --git a/examples/official-storybook/stories/core/parameters.stories.js b/examples/official-storybook/stories/core/parameters.stories.js
index 41b1e09052e..b5ab588400a 100644
--- a/examples/official-storybook/stories/core/parameters.stories.js
+++ b/examples/official-storybook/stories/core/parameters.stories.js
@@ -17,7 +17,7 @@ export default {
 // Given we sort of control the props, should we export a prop type?
 export const passed = ({
   // eslint-disable-next-line react/prop-types
-  parameters,
+  parameters: { options, ...parameters },
 }) => <pre>Parameters are {JSON.stringify(parameters, null, 2)}</pre>;
 passed.title = 'passed to story';
 passed.parameters = { storyParameter: 'storyParameter' };
diff --git a/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap b/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
index 9e583358900..5e5b364366f 100644
--- a/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
+++ b/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
@@ -2653,10 +2653,6 @@ exports[`Storyshots Core|Events Force re-render 1`] = `
 exports[`Storyshots Core|Parameters passed to story 1`] = `
 <pre>
   Parameters are {
-  "options": {
-    "hierarchyRootSeparator": "|",
-    "hierarchySeparator": {}
-  },
   "a11y": {
     "configure": {},
     "options": {
diff --git a/lib/channel-postmessage/src/index.ts b/lib/channel-postmessage/src/index.ts
index 25d672a6e23..b870100cd0e 100644
--- a/lib/channel-postmessage/src/index.ts
+++ b/lib/channel-postmessage/src/index.ts
@@ -56,7 +56,7 @@ export class PostmsgTransport {
       });
     }
 
-    const data = stringify({ key: KEY, event }, { maxDepth: 10 });
+    const data = stringify({ key: KEY, event }, { maxDepth: 15 });
 
     // TODO: investigate http://blog.teamtreehouse.com/cross-domain-messaging-with-postmessage
     // might replace '*' with document.location ?
diff --git a/lib/theming/src/ensure.ts b/lib/theming/src/ensure.ts
index c206a73b0c9..70fe4771812 100644
--- a/lib/theming/src/ensure.ts
+++ b/lib/theming/src/ensure.ts
@@ -9,6 +9,12 @@ import isEqual from 'lodash.isequal';
 import light from './themes/light';
 import { Theme } from './base';
 
+const base = {
+  ...light,
+  animation: {},
+  brand: {},
+};
+
 // merge with concatenating arrays, but no duplicates
 const merge = (a: any, b: any) =>
   mergeWith({}, a, b, (objValue: any, srcValue: any) => {
@@ -32,7 +38,7 @@ export const ensure = (input: any): Theme => {
   if (!input) {
     return light;
   } else {
-    const missing = deletedDiff(light, input);
+    const missing = deletedDiff(base, input);
     if (Object.keys(missing).length) {
       logger.warn(
         stripIndent`
diff --git a/lib/ui/package.json b/lib/ui/package.json
index b7166ff9b36..031d5d423e9 100644
--- a/lib/ui/package.json
+++ b/lib/ui/package.json
@@ -55,7 +55,7 @@
     "react-resize-detector": "^3.2.1",
     "recompose": "^0.30.0",
     "semver": "^5.6.0",
-    "to-camel-case": "^1.0.0",
+    "telejson": "^2.1.1",
     "util-deprecate": "^1.0.2"
   },
   "devDependencies": {
diff --git a/lib/ui/src/components/layout/container.js b/lib/ui/src/components/layout/container.js
index be43e824808..33f23593ea9 100644
--- a/lib/ui/src/components/layout/container.js
+++ b/lib/ui/src/components/layout/container.js
@@ -270,7 +270,7 @@ class Layout extends Component {
   constructor(props) {
     super(props);
 
-    const { options } = this.props;
+    const { bounds, options } = props;
 
     const { resizerNav, resizerPanel } = persistance.get();
 
@@ -278,7 +278,10 @@ class Layout extends Component {
       isDragging: false,
       resizerNav: resizerNav || { x: 200, y: 0 },
       resizerPanel:
-        resizerPanel || (options.panelPosition === 'bottom' ? { x: 0, y: 400 } : { x: 400, y: 0 }),
+        resizerPanel ||
+        (options.panelPosition === 'bottom'
+          ? { x: 0, y: bounds.height - 400 }
+          : { x: bounds.width - 400, y: 0 }),
     };
   }
 
@@ -323,7 +326,7 @@ class Layout extends Component {
       }
     }
     if (isPanelRight && !isPanelHidden) {
-      if (bounds.width - 200 < panelX) {
+      if (bounds.width - 200 < panelX || panelX === 0) {
         mutation.resizerPanel = {
           x: bounds.width - 200,
           y: 0,
diff --git a/lib/ui/src/core/addons.js b/lib/ui/src/core/addons.js
index 996233d5467..7ebc7cc5ac4 100644
--- a/lib/ui/src/core/addons.js
+++ b/lib/ui/src/core/addons.js
@@ -22,14 +22,14 @@ export default ({ provider, store }) => {
       return ensurePanel(api.getPanels(), selectedPanel, selectedPanel);
     },
     setSelectedPanel: panelName => {
-      store.setState({ selectedPanel: panelName });
+      store.setState({ selectedPanel: panelName }, { persistence: 'session' });
     },
   };
 
   return {
     api,
     state: {
-      selectedPanel: ensurePanel(api.getPanels()),
+      selectedPanel: ensurePanel(api.getPanels(), store.getState().selectedPanel),
     },
   };
 };
diff --git a/lib/ui/src/core/context.js b/lib/ui/src/core/context.js
index 7e03f6a0e8f..04e13d1d630 100644
--- a/lib/ui/src/core/context.js
+++ b/lib/ui/src/core/context.js
@@ -50,7 +50,6 @@ export class Provider extends Component {
     // Initialize the state to be the initial (persisted) state of the store.
     // This gives the modules the chance to read the persisted state, apply their defaults
     // and override if necessary
-    this.state = store.getInitialState();
 
     const apiData = {
       navigate,
@@ -62,6 +61,8 @@ export class Provider extends Component {
       storyId,
     };
 
+    this.state = store.getInitialState();
+
     this.modules = [
       initChannel,
       initAddons,
@@ -90,7 +91,9 @@ export class Provider extends Component {
     api.on(SET_STORIES, data => {
       api.setStories(data.stories);
 
-      const options = api.getParameters(storyId, 'options');
+      const options = storyId
+        ? api.getParameters(storyId, 'options')
+        : api.getParameters(Object.keys(data.stories)[0], 'options');
 
       api.setOptions(options);
     });
diff --git a/lib/ui/src/core/init-provider-api.js b/lib/ui/src/core/init-provider-api.js
index f0267136cc6..b3414c4add6 100644
--- a/lib/ui/src/core/init-provider-api.js
+++ b/lib/ui/src/core/init-provider-api.js
@@ -1,86 +1,6 @@
-import pick from 'lodash.pick';
-import deprecate from 'util-deprecate';
-
-import { create } from '@storybook/theming';
-
-const deprecationMessage = (optionsMap, prefix) =>
-  `The options { ${Object.keys(optionsMap).join(', ')} } are deprecated -- use ${
-    prefix ? `${prefix}'s` : ''
-  } { ${Object.values(optionsMap).join(', ')} } instead.`;
-
-const deprecatedThemeOptions = {
-  name: 'brandTitle',
-  url: 'brandUrl',
-};
-const applyDeprecatedThemeOptions = deprecate(({ name, url, theme }) => {
-  const vars = {
-    brandTitle: name,
-    brandUrl: url,
-    brandImage: null,
-  };
-
-  return { theme: create(vars, theme) };
-}, deprecationMessage(deprecatedThemeOptions));
-const checkDeprecatedThemeOptions = options => {
-  if (Object.keys(deprecatedThemeOptions).find(key => !!options[key])) {
-    return applyDeprecatedThemeOptions(options);
-  }
-  return {};
-};
-
-const deprecatedLayoutOptions = {
-  goFullScreen: 'isFullscreen',
-  showStoriesPanel: 'showNav',
-  showAddonPanel: 'showPanel',
-  addonPanelInRight: 'panelPosition',
-};
-const applyDeprecatedLayoutOptions = deprecate(options => {
-  const layoutUpdate = {};
-
-  ['goFullScreen', 'showStoriesPanel', 'showAddonPanel'].forEach(option => {
-    if (typeof options[option] !== 'undefined') {
-      layoutUpdate[deprecatedLayoutOptions[option]] = options[option];
-    }
-  });
-  if (options.addonPanelInRight) {
-    layoutUpdate.panelPosition = 'right';
-  }
-  return layoutUpdate;
-}, deprecationMessage(deprecatedLayoutOptions));
-const checkDeprecatedLayoutOptions = options => {
-  if (Object.keys(deprecatedLayoutOptions).find(key => typeof options[key] !== 'undefined')) {
-    return applyDeprecatedLayoutOptions(options);
-  }
-  return {};
-};
-
-export default ({ provider, api, store }) => {
+export default ({ provider, api }) => {
   const providerAPI = {
     ...api,
-
-    setOptions: options => {
-      const { layout, ui, selectedPanel } = store.getState();
-
-      if (options) {
-        const updatedLayout = {
-          ...layout,
-          ...pick(options, Object.keys(layout)),
-          ...checkDeprecatedLayoutOptions(options),
-        };
-
-        const updatedUi = {
-          ...ui,
-          ...pick(options, Object.keys(ui)),
-          ...checkDeprecatedThemeOptions(options),
-        };
-
-        store.setState({
-          layout: updatedLayout,
-          ui: updatedUi,
-          selectedPanel: options.panel || options.selectedPanel || selectedPanel,
-        });
-      }
-    },
   };
 
   provider.handleAPI(providerAPI);
diff --git a/lib/ui/src/core/initial-state.js b/lib/ui/src/core/initial-state.js
index 5ac502039fc..5eee085d628 100644
--- a/lib/ui/src/core/initial-state.js
+++ b/lib/ui/src/core/initial-state.js
@@ -1,21 +1,6 @@
-import { themes } from '@storybook/theming';
-
 import merge from '../libs/merge';
 
 const initial = {
-  ui: {
-    enableShortcuts: true,
-    sortStoriesByKind: false,
-    sidebarAnimations: true,
-    theme: themes.normal,
-  },
-  layout: {
-    isToolshown: true,
-    isFullscreen: false,
-    showPanel: true,
-    showNav: true,
-    panelPosition: 'bottom',
-  },
   customQueryParams: {},
   storiesConfigured: false,
 };
diff --git a/lib/ui/src/core/layout.js b/lib/ui/src/core/layout.js
index 80a9523899e..d6bf8ef8ce9 100644
--- a/lib/ui/src/core/layout.js
+++ b/lib/ui/src/core/layout.js
@@ -1,3 +1,64 @@
+import pick from 'lodash.pick';
+
+import deprecate from 'util-deprecate';
+
+import { create, themes } from '@storybook/theming';
+import merge from '../libs/merge';
+
+const deprecatedThemeOptions = {
+  name: 'brandTitle',
+  url: 'brandUrl',
+};
+const deprecatedLayoutOptions = {
+  goFullScreen: 'isFullscreen',
+  showStoriesPanel: 'showNav',
+  showAddonPanel: 'showPanel',
+  addonPanelInRight: 'panelPosition',
+};
+
+const deprecationMessage = (optionsMap, prefix) =>
+  `The options { ${Object.keys(optionsMap).join(', ')} } are deprecated -- use ${
+    prefix ? `${prefix}'s` : ''
+  } { ${Object.values(optionsMap).join(', ')} } instead.`;
+
+const applyDeprecatedThemeOptions = deprecate(({ name, url, theme }) => {
+  const vars = {
+    brandTitle: name,
+    brandUrl: url,
+    brandImage: null,
+  };
+
+  return { theme: create(vars, theme) };
+}, deprecationMessage(deprecatedThemeOptions));
+
+const applyDeprecatedLayoutOptions = deprecate(options => {
+  const layoutUpdate = {};
+
+  ['goFullScreen', 'showStoriesPanel', 'showAddonPanel'].forEach(option => {
+    if (typeof options[option] !== 'undefined') {
+      layoutUpdate[deprecatedLayoutOptions[option]] = options[option];
+    }
+  });
+  if (options.addonPanelInRight) {
+    layoutUpdate.panelPosition = 'right';
+  }
+  return layoutUpdate;
+}, deprecationMessage(deprecatedLayoutOptions));
+
+const checkDeprecatedThemeOptions = options => {
+  if (Object.keys(deprecatedThemeOptions).find(key => !!options[key])) {
+    return applyDeprecatedThemeOptions(options);
+  }
+  return {};
+};
+
+const checkDeprecatedLayoutOptions = options => {
+  if (Object.keys(deprecatedLayoutOptions).find(key => typeof options[key] !== 'undefined')) {
+    return applyDeprecatedLayoutOptions(options);
+  }
+  return {};
+};
+
 export default function({ store }) {
   const api = {
     toggleFullscreen(toggled) {
@@ -69,7 +130,54 @@ export default function({ store }) {
         };
       });
     },
+
+    setOptions: options => {
+      const { layout, ui, selectedPanel } = store.getState();
+
+      if (options) {
+        const updatedLayout = {
+          ...layout,
+          ...pick(options, Object.keys(layout)),
+          ...checkDeprecatedLayoutOptions(options),
+        };
+
+        const updatedUi = {
+          ...ui,
+          ...pick(options, Object.keys(ui)),
+          ...checkDeprecatedThemeOptions(options),
+        };
+
+        store.setState(
+          {
+            layout: updatedLayout,
+            ui: updatedUi,
+            selectedPanel: options.panel || options.selectedPanel || selectedPanel,
+          },
+          { persistence: 'permanent' }
+        );
+      }
+    },
   };
 
-  return { api };
+  const fromState = pick(store.getState(), 'layout', 'ui', 'selectedPanel');
+
+  const initial = {
+    ui: {
+      enableShortcuts: true,
+      sortStoriesByKind: false,
+      sidebarAnimations: true,
+      theme: themes.normal,
+    },
+    layout: {
+      isToolshown: true,
+      isFullscreen: false,
+      showPanel: true,
+      showNav: true,
+      panelPosition: 'bottom',
+    },
+  };
+
+  const state = merge(fromState, initial);
+
+  return { api, state };
 }
diff --git a/lib/ui/src/core/store.js b/lib/ui/src/core/store.js
index c87ada758e1..4bab4257270 100644
--- a/lib/ui/src/core/store.js
+++ b/lib/ui/src/core/store.js
@@ -1,16 +1,17 @@
 // TODO -- make this TS?
 
 import { localStorage, sessionStorage } from 'global';
+import { parse, stringify } from 'telejson';
 
 export const STORAGE_KEY = '@storybook/ui/store';
 
 function get(storage) {
   const serialized = storage.getItem(STORAGE_KEY);
-  return serialized ? JSON.parse(serialized) : {};
+  return serialized ? parse(serialized) : {};
 }
 
 function set(storage, value) {
-  storage.setItem(STORAGE_KEY, JSON.stringify(value));
+  storage.setItem(STORAGE_KEY, stringify(value, { maxDepth: 50 }));
 }
 
 function update(storage, patch) {
diff --git a/lib/ui/src/core/stories.js b/lib/ui/src/core/stories.js
index 0ca4f0d4b5d..94cfd00204b 100644
--- a/lib/ui/src/core/stories.js
+++ b/lib/ui/src/core/stories.js
@@ -1,26 +1,6 @@
-import mergeWith from 'lodash.mergewith';
-import isEqual from 'lodash.isequal';
 import { toId, sanitize } from '@storybook/router/utils';
 
-const merge = (a, b) =>
-  mergeWith({}, a, b, (objValue, srcValue) => {
-    if (Array.isArray(srcValue) && Array.isArray(objValue)) {
-      srcValue.forEach(s => {
-        const existing = objValue.find(o => o === s || isEqual(o, s));
-        if (!existing) {
-          objValue.push(s);
-        }
-      });
-
-      return objValue;
-    }
-    if (Array.isArray(objValue)) {
-      // eslint-disable-next-line no-console
-      console.log('the types mismatch, picking', objValue);
-      return objValue;
-    }
-    return undefined;
-  });
+import merge from '../libs/merge';
 
 const initStoriesApi = ({
   store,

From 09c2987bdc0fba9b0519e64a63823d14faefd464 Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Sat, 2 Mar 2019 21:21:55 +0100
Subject: [PATCH 110/249] Merge pull request #5802 from
 B3zo0/B3zo0-notes-inline-code

fix(addon-notes): inline code markdown
---
 addons/notes/src/Panel.test.js | 23 +++++++++++++++++++++++
 addons/notes/src/Panel.tsx     | 28 ++++++++++++++++++++--------
 2 files changed, 43 insertions(+), 8 deletions(-)
 create mode 100644 addons/notes/src/Panel.test.js

diff --git a/addons/notes/src/Panel.test.js b/addons/notes/src/Panel.test.js
new file mode 100644
index 00000000000..19bcf0da497
--- /dev/null
+++ b/addons/notes/src/Panel.test.js
@@ -0,0 +1,23 @@
+import React from 'react';
+import { shallow } from 'enzyme';
+import { SyntaxHighlighter as SyntaxHighlighterBase } from '@storybook/components';
+import { SyntaxHighlighter } from './Panel.tsx';
+
+describe('NotesPanel', () => {
+  describe('SyntaxHighlighter component', () => {
+    it('should return code if className is undefined', () => {
+      const wrapper = shallow(<SyntaxHighlighter>some text</SyntaxHighlighter>);
+      const code = wrapper.find('code');
+      expect(code.exists()).toBeTruthy();
+      expect(code.text()).toBe('some text');
+    });
+    it('should return SyntaxHighlighterBase if there is a className prop', () => {
+      const wrapper = shallow(
+        <SyntaxHighlighter className="lang-jsx">some text</SyntaxHighlighter>
+      );
+      const syntaxHighlighterBase = wrapper.find(SyntaxHighlighterBase);
+      expect(syntaxHighlighterBase.exists()).toBeTruthy();
+      expect(syntaxHighlighterBase.prop('language')).toBe('jsx');
+    });
+  });
+});
diff --git a/addons/notes/src/Panel.tsx b/addons/notes/src/Panel.tsx
index 5229362d653..543ea9f6135 100644
--- a/addons/notes/src/Panel.tsx
+++ b/addons/notes/src/Panel.tsx
@@ -41,7 +41,15 @@ function read(param: Parameters | undefined): string | undefined {
   }
 }
 
-const SyntaxHighlighter = (props: any) => <SyntaxHighlighterBase bordered copyable {...props} />;
+export const SyntaxHighlighter = (props: any) => {
+  // markdown-to-jsx does not add className to inline code
+  if (props.className === undefined) {
+    return <code>{props.children}</code>;
+  }
+  //className: "lang-jsx"
+  const language = props.className.split('-');
+  return <SyntaxHighlighterBase language={language[1]} bordered copyable {...props} />;
+};
 
 const defaultOptions = {
   overrides: {
@@ -105,21 +113,25 @@ export default class NotesPanel extends React.Component<Props, NotesPanelState>
 
     // TODO: memoize
     const extraElements = Object.entries(api.getElements(types.NOTES_ELEMENT)).reduce((acc, [k, v]) => ({ ...acc, [k]: v.render }), {});
-    const options = { ...defaultOptions, overrides: { ...defaultOptions.overrides, ...extraElements } };
+    const options = {
+      ...defaultOptions,
+      overrides: { ...defaultOptions.overrides, ...extraElements },
+    };
 
     return value ? (
       <Panel className="addon-notes-container">
-      <DocumentFormatting>
-        <Markdown options={options}>{value}</Markdown>
+        <DocumentFormatting>
+          <Markdown options={options}>{value}</Markdown>
         </DocumentFormatting>
       </Panel>
     ) : (
       <Placeholder>
+        <React.Fragment>No notes yet</React.Fragment>
         <React.Fragment>
-          No notes yet
-        </React.Fragment>
-        <React.Fragment>
-          Learn how to <Link href="https://github.com/storybooks/storybook/tree/master/addons/notes" target="_blank" withArrow>document components in Markdown</Link>
+          Learn how to{' '}
+          <Link href="https://github.com/storybooks/storybook/tree/master/addons/notes" target="_blank" withArrow>
+            document components in Markdown
+          </Link>
         </React.Fragment>
       </Placeholder>
     );

From ea173c16e3a55a03c6fe81c574432b8c29900c11 Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Sun, 3 Mar 2019 13:21:27 +0800
Subject: [PATCH 111/249] Merge pull request #5819 from
 storybooks/5781-warn-mid-decorators

ADD warning for decorators added "mid-kind"
---
 .../component-with-di/di.component.stories.ts | 19 ++++++++-----
 .../src/stories/custom-pipes.stories.ts       | 19 ++++++++-----
 .../src/stories/custom-providers.stories.ts   | 25 ++++++++++-------
 .../src/stories/custom-styles.stories.ts      | 27 +++++++++++--------
 lib/client-api/src/client_api.js              |  8 ++++++
 5 files changed, 63 insertions(+), 35 deletions(-)

diff --git a/examples/angular-cli/src/stories/component-with-di/di.component.stories.ts b/examples/angular-cli/src/stories/component-with-di/di.component.stories.ts
index 6059f9ecc77..a553eb7ac00 100644
--- a/examples/angular-cli/src/stories/component-with-di/di.component.stories.ts
+++ b/examples/angular-cli/src/stories/component-with-di/di.component.stories.ts
@@ -9,10 +9,15 @@ storiesOf('Custom|Dependencies', module)
       title: 'Component dependencies',
     },
   }))
-  .addDecorator(withKnobs)
-  .add('inputs and inject dependencies with knobs', () => ({
-    component: DiComponent,
-    props: {
-      title: text('title', 'Component dependencies'),
-    },
-  }));
+  .add(
+    'inputs and inject dependencies with knobs',
+    () => ({
+      component: DiComponent,
+      props: {
+        title: text('title', 'Component dependencies'),
+      },
+    }),
+    {
+      decorators: [withKnobs],
+    }
+  );
diff --git a/examples/angular-cli/src/stories/custom-pipes.stories.ts b/examples/angular-cli/src/stories/custom-pipes.stories.ts
index b342d530c21..9bb29bc75ba 100644
--- a/examples/angular-cli/src/stories/custom-pipes.stories.ts
+++ b/examples/angular-cli/src/stories/custom-pipes.stories.ts
@@ -19,10 +19,15 @@ storiesOf('Custom|Pipes', module)
       field: 'foobar',
     },
   }))
-  .addDecorator(withKnobs)
-  .add('With Knobs', () => ({
-    component: NameComponent,
-    props: {
-      field: text('field', 'foobar'),
-    },
-  }));
+  .add(
+    'With Knobs',
+    () => ({
+      component: NameComponent,
+      props: {
+        field: text('field', 'foobar'),
+      },
+    }),
+    {
+      decorators: [withKnobs],
+    }
+  );
diff --git a/examples/angular-cli/src/stories/custom-providers.stories.ts b/examples/angular-cli/src/stories/custom-providers.stories.ts
index d7ca9ed069b..12814781bcd 100644
--- a/examples/angular-cli/src/stories/custom-providers.stories.ts
+++ b/examples/angular-cli/src/stories/custom-providers.stories.ts
@@ -19,14 +19,19 @@ storiesOf('Custom|Providers', module)
       name: 'Static name',
     },
   }))
-  .addDecorator(withKnobs)
-  .add('With knobs', () => {
-    const name = text('name', 'Dynamic knob');
+  .add(
+    'With knobs',
+    () => {
+      const name = text('name', 'Dynamic knob');
 
-    return {
-      component: ServiceComponent,
-      props: {
-        name,
-      },
-    };
-  });
+      return {
+        component: ServiceComponent,
+        props: {
+          name,
+        },
+      };
+    },
+    {
+      decorators: [withKnobs],
+    }
+  );
diff --git a/examples/angular-cli/src/stories/custom-styles.stories.ts b/examples/angular-cli/src/stories/custom-styles.stories.ts
index df2e1b20a78..fc14f680dde 100644
--- a/examples/angular-cli/src/stories/custom-styles.stories.ts
+++ b/examples/angular-cli/src/stories/custom-styles.stories.ts
@@ -24,19 +24,24 @@ storiesOf('Custom|Style', module)
     `,
     ],
   }))
-  .addDecorator(withKnobs)
-  .add('With Knobs', () => ({
-    template: `<storybook-button-component [text]="text" (onClick)="onClick($event)"></storybook-button-component>`,
-    props: {
-      text: text('text', 'Button with custom styles'),
-      onClick: action('log'),
-    },
-    styles: [
-      `
+  .add(
+    'With Knobs',
+    () => ({
+      template: `<storybook-button-component [text]="text" (onClick)="onClick($event)"></storybook-button-component>`,
+      props: {
+        text: text('text', 'Button with custom styles'),
+        onClick: action('log'),
+      },
+      styles: [
+        `
       storybook-button-component {
         background-color: red;
         padding: 25px;
       }
     `,
-    ],
-  }));
+      ],
+    }),
+    {
+      decorators: [withKnobs],
+    }
+  );
diff --git a/lib/client-api/src/client_api.js b/lib/client-api/src/client_api.js
index 45a854a5a7b..a505fe66e43 100644
--- a/lib/client-api/src/client_api.js
+++ b/lib/client-api/src/client_api.js
@@ -134,6 +134,7 @@ export default class ClientApi {
 
     const localDecorators = [];
     let localParameters = {};
+    let hasAdded = false;
     const api = {
       kind,
     };
@@ -148,6 +149,7 @@ export default class ClientApi {
     });
 
     api.add = (storyName, storyFn, parameters) => {
+      hasAdded = true;
       const { _globalParameters, _globalDecorators } = this;
       const id = toId(kind, storyName);
 
@@ -215,6 +217,12 @@ export default class ClientApi {
     };
 
     api.addDecorator = decorator => {
+      if (hasAdded) {
+        console.warn(`You have added a decorator to the kind '${kind}' after a story has already been added.
+In Storybook 4 this applied the decorator only to subsequent stories. In Storybook 5+ it applies to all stories.
+This is probably not what you intended. Read more here: https://github.com/storybooks/storybook/blob/master/MIGRATION.md`);
+      }
+
       localDecorators.push(decorator);
       return api;
     };

From f99263269301555ae2ab8bfa1f20b1eef78f43da Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Sat, 2 Mar 2019 17:57:43 +0100
Subject: [PATCH 112/249] Merge pull request #5816 from
 storybooks/fix/official-example-iframe

FIX build-storybook with simplebar esm files
---
 lib/core/src/server/preview/iframe-webpack.config.js | 1 -
 1 file changed, 1 deletion(-)

diff --git a/lib/core/src/server/preview/iframe-webpack.config.js b/lib/core/src/server/preview/iframe-webpack.config.js
index 26a95c60c88..3cb4ac5e0fd 100644
--- a/lib/core/src/server/preview/iframe-webpack.config.js
+++ b/lib/core/src/server/preview/iframe-webpack.config.js
@@ -81,7 +81,6 @@ export default ({
     resolve: {
       extensions: ['.mjs', '.js', '.jsx', '.json'],
       modules: ['node_modules'].concat(raw.NODE_PATH || []),
-      mainFields: ['browser', 'main', 'module'],
       alias: {
         'core-js': path.dirname(require.resolve('core-js/package.json')),
         ...reactPaths,

From b8ae89bb5e673bdd99eba582c345f73fbaad358a Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Sun, 3 Mar 2019 13:32:04 +0800
Subject: [PATCH 113/249] Update yarn.lock

---
 yarn.lock | 30 ++++++++++++++----------------
 1 file changed, 14 insertions(+), 16 deletions(-)

diff --git a/yarn.lock b/yarn.lock
index 8850b73e60c..12d83c5d35e 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -19834,6 +19834,20 @@ telejson@^2.1.0:
     memoizerific "^1.11.3"
     safe-eval "^0.4.1"
 
+telejson@^2.1.1:
+  version "2.1.1"
+  resolved "https://registry.yarnpkg.com/telejson/-/telejson-2.1.1.tgz#cd8835ce90198c9341078dbe80849e39d1a2b73c"
+  integrity sha512-tc9Jdrhro4zzYgN6y5DNzCXIyIsWT7znGEfK7G4KMPF0X0tC2cVw2SPKnJObao/cxP7/FSnG8bJe0JD390My5g==
+  dependencies:
+    global "^4.3.2"
+    is-function "^1.0.1"
+    is-regex "^1.0.4"
+    is-symbol "^1.0.2"
+    isobject "^3.0.1"
+    lodash.get "^4.4.2"
+    memoizerific "^1.11.3"
+    safe-eval "^0.4.1"
+
 temp-dir@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/temp-dir/-/temp-dir-1.0.0.tgz#0a7c0ea26d3a39afa7e0ebea9c1fc0bc4daa011d"
@@ -20076,12 +20090,6 @@ to-arraybuffer@^1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/to-arraybuffer/-/to-arraybuffer-1.0.1.tgz#7d229b1fcc637e466ca081180836a7aabff83f43"
 
-to-camel-case@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/to-camel-case/-/to-camel-case-1.0.0.tgz#1a56054b2f9d696298ce66a60897322b6f423e46"
-  dependencies:
-    to-space-case "^1.0.0"
-
 to-fast-properties@^1.0.3:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/to-fast-properties/-/to-fast-properties-1.0.3.tgz#b83571fa4d8c25b82e231b06e3a3055de4ca1a47"
@@ -20090,10 +20098,6 @@ to-fast-properties@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/to-fast-properties/-/to-fast-properties-2.0.0.tgz#dc5e698cbd079265bc73e0377681a4e4e83f616e"
 
-to-no-case@^1.0.0:
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/to-no-case/-/to-no-case-1.0.2.tgz#c722907164ef6b178132c8e69930212d1b4aa16a"
-
 to-object-path@^0.3.0:
   version "0.3.0"
   resolved "https://registry.yarnpkg.com/to-object-path/-/to-object-path-0.3.0.tgz#297588b7b0e7e0ac08e04e672f85c1f4999e17af"
@@ -20116,12 +20120,6 @@ to-regex@^3.0.1, to-regex@^3.0.2:
     regex-not "^1.0.2"
     safe-regex "^1.1.0"
 
-to-space-case@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/to-space-case/-/to-space-case-1.0.0.tgz#b052daafb1b2b29dc770cea0163e5ec0ebc9fc17"
-  dependencies:
-    to-no-case "^1.0.0"
-
 to-vfile@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/to-vfile/-/to-vfile-4.0.0.tgz#465ade5fc2b9e97e6c80b854d378a5d0f4b5d04a"

From 36182f1196738c27e979d2121e9b862ee29e4b98 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Sun, 3 Mar 2019 14:23:45 +0800
Subject: [PATCH 114/249] 5.0.0-rc.9 changelog

---
 CHANGELOG.md | 13 +++++++++++++
 1 file changed, 13 insertions(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index b2ad34e0945..b36717aa426 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,16 @@
+## 5.0.0-rc.9 (March 3, 2019)
+
+### Features
+
+* Core: Allow local decorators via params ([#5806](https://github.com/storybooks/storybook/pull/5806))
+
+### Bug Fixes
+
+* Core: Add warning for decorators added "mid-kind" ([#5819](https://github.com/storybooks/storybook/pull/5819))
+* Addon-notes: Support inline code markdown ([#5802](https://github.com/storybooks/storybook/pull/5802))
+* Theming: Fix theme loading bugs ([#5787](https://github.com/storybooks/storybook/pull/5787))
+* CLI: Fix build-storybook with simplebar esm files ([#5816](https://github.com/storybooks/storybook/pull/5816))
+
 ## 5.0.0-rc.8 (March 1, 2019)
 
 ### Features

From d782ca1260df341cc488bc9a575c17c4e9e6e0ec Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Sun, 3 Mar 2019 14:25:13 +0800
Subject: [PATCH 115/249] v5.0.0-rc.9

---
 addons/a11y/package.json                      | 12 ++---
 addons/actions/package.json                   | 10 ++--
 addons/backgrounds/package.json               | 12 ++---
 addons/centered/package.json                  |  2 +-
 addons/cssresources/package.json              | 10 ++--
 addons/events/package.json                    |  8 +--
 addons/google-analytics/package.json          |  6 +--
 addons/graphql/package.json                   |  2 +-
 addons/info/package.json                      | 10 ++--
 addons/jest/package.json                      | 10 ++--
 addons/knobs/package.json                     | 10 ++--
 addons/links/package.json                     |  6 +--
 addons/notes/package.json                     | 12 ++---
 addons/ondevice-backgrounds/package.json      |  4 +-
 addons/ondevice-knobs/package.json            |  4 +-
 addons/ondevice-notes/package.json            |  4 +-
 addons/options/package.json                   |  4 +-
 .../storyshots/storyshots-core/package.json   |  4 +-
 .../storyshots-puppeteer/package.json         |  6 +--
 addons/storysource/package.json               | 10 ++--
 addons/viewport/package.json                  | 12 ++---
 app/angular/package.json                      |  6 +--
 app/ember/package.json                        |  4 +-
 app/html/package.json                         |  4 +-
 app/marko/package.json                        |  4 +-
 app/mithril/package.json                      |  4 +-
 app/polymer/package.json                      |  4 +-
 app/preact/package.json                       |  4 +-
 app/react-native/package.json                 | 14 ++---
 app/react/package.json                        |  8 +--
 app/riot/package.json                         |  4 +-
 app/svelte/package.json                       |  4 +-
 app/vue/package.json                          |  4 +-
 examples/angular-cli/package.json             | 26 ++++-----
 examples/cra-kitchen-sink/package.json        | 32 +++++------
 examples/cra-ts-kitchen-sink/package.json     | 12 ++---
 examples/ember-cli/package.json               | 26 ++++-----
 examples/html-kitchen-sink/package.json       | 36 ++++++-------
 examples/marko-cli/package.json               | 14 ++---
 examples/mithril-kitchen-sink/package.json    | 26 ++++-----
 examples/official-storybook/package.json      | 48 ++++++++---------
 examples/polymer-cli/package.json             | 20 +++----
 examples/preact-kitchen-sink/package.json     | 26 ++++-----
 examples/riot-kitchen-sink/package.json       | 26 ++++-----
 examples/svelte-kitchen-sink/package.json     | 26 ++++-----
 examples/vue-kitchen-sink/package.json        | 26 ++++-----
 lerna.json                                    |  2 +-
 lib/addons/package.json                       |  6 +--
 lib/channel-postmessage/package.json          |  6 +--
 lib/channel-websocket/package.json            |  4 +-
 lib/channels/package.json                     |  2 +-
 lib/cli/package.json                          | 54 +++++++++----------
 lib/client-api/package.json                   | 10 ++--
 lib/client-logger/package.json                |  2 +-
 lib/codemod/package.json                      |  2 +-
 lib/components/package.json                   | 12 ++---
 lib/core-events/package.json                  |  2 +-
 lib/core/package.json                         | 20 +++----
 lib/node-logger/package.json                  |  2 +-
 lib/router/package.json                       |  4 +-
 lib/theming/package.json                      |  4 +-
 lib/ui/package.json                           | 14 ++---
 62 files changed, 356 insertions(+), 356 deletions(-)

diff --git a/addons/a11y/package.json b/addons/a11y/package.json
index 4382a86458f..89b087d8827 100644
--- a/addons/a11y/package.json
+++ b/addons/a11y/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-a11y",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "a11y addon for storybook",
   "keywords": [
     "a11y",
@@ -25,11 +25,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.8",
-    "@storybook/client-logger": "5.0.0-rc.8",
-    "@storybook/components": "5.0.0-rc.8",
-    "@storybook/core-events": "5.0.0-rc.8",
-    "@storybook/theming": "5.0.0-rc.8",
+    "@storybook/addons": "5.0.0-rc.9",
+    "@storybook/client-logger": "5.0.0-rc.9",
+    "@storybook/components": "5.0.0-rc.9",
+    "@storybook/core-events": "5.0.0-rc.9",
+    "@storybook/theming": "5.0.0-rc.9",
     "axe-core": "^3.1.2",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
diff --git a/addons/actions/package.json b/addons/actions/package.json
index 2e3945ff51b..b6cd752b91f 100644
--- a/addons/actions/package.json
+++ b/addons/actions/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-actions",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "Action Logger addon for storybook",
   "keywords": [
     "storybook"
@@ -20,10 +20,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.8",
-    "@storybook/components": "5.0.0-rc.8",
-    "@storybook/core-events": "5.0.0-rc.8",
-    "@storybook/theming": "5.0.0-rc.8",
+    "@storybook/addons": "5.0.0-rc.9",
+    "@storybook/components": "5.0.0-rc.9",
+    "@storybook/core-events": "5.0.0-rc.9",
+    "@storybook/theming": "5.0.0-rc.9",
     "core-js": "^2.6.2",
     "fast-deep-equal": "^2.0.1",
     "global": "^4.3.2",
diff --git a/addons/backgrounds/package.json b/addons/backgrounds/package.json
index df2b68a3630..07faf0d96c8 100644
--- a/addons/backgrounds/package.json
+++ b/addons/backgrounds/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-backgrounds",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "A storybook addon to show different backgrounds for your preview",
   "keywords": [
     "addon",
@@ -24,11 +24,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.8",
-    "@storybook/client-logger": "5.0.0-rc.8",
-    "@storybook/components": "5.0.0-rc.8",
-    "@storybook/core-events": "5.0.0-rc.8",
-    "@storybook/theming": "5.0.0-rc.8",
+    "@storybook/addons": "5.0.0-rc.9",
+    "@storybook/client-logger": "5.0.0-rc.9",
+    "@storybook/components": "5.0.0-rc.9",
+    "@storybook/core-events": "5.0.0-rc.9",
+    "@storybook/theming": "5.0.0-rc.9",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
diff --git a/addons/centered/package.json b/addons/centered/package.json
index 2f76908b30f..73171d73a5e 100644
--- a/addons/centered/package.json
+++ b/addons/centered/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-centered",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "Storybook decorator to center components",
   "keywords": [
     "addon",
diff --git a/addons/cssresources/package.json b/addons/cssresources/package.json
index a065fe270c3..42a83ac0273 100644
--- a/addons/cssresources/package.json
+++ b/addons/cssresources/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-cssresources",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "A storybook addon to switch between css resources at runtime for your story",
   "keywords": [
     "addon",
@@ -24,10 +24,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.8",
-    "@storybook/channels": "5.0.0-rc.8",
-    "@storybook/components": "5.0.0-rc.8",
-    "@storybook/core-events": "5.0.0-rc.8",
+    "@storybook/addons": "5.0.0-rc.9",
+    "@storybook/channels": "5.0.0-rc.9",
+    "@storybook/components": "5.0.0-rc.9",
+    "@storybook/core-events": "5.0.0-rc.9",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "prop-types": "^15.6.2",
diff --git a/addons/events/package.json b/addons/events/package.json
index 32a862bfc23..03e3738058a 100644
--- a/addons/events/package.json
+++ b/addons/events/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-events",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "Add events to your Storybook stories.",
   "keywords": [
     "addon",
@@ -23,9 +23,9 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.8",
-    "@storybook/core-events": "5.0.0-rc.8",
-    "@storybook/theming": "5.0.0-rc.8",
+    "@storybook/addons": "5.0.0-rc.9",
+    "@storybook/core-events": "5.0.0-rc.9",
+    "@storybook/theming": "5.0.0-rc.9",
     "core-js": "^2.6.2",
     "format-json": "^1.0.3",
     "prop-types": "^15.6.2",
diff --git a/addons/google-analytics/package.json b/addons/google-analytics/package.json
index ad67bd0a4b7..0db51c4fecf 100644
--- a/addons/google-analytics/package.json
+++ b/addons/google-analytics/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-google-analytics",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "Storybook addon for google analytics",
   "keywords": [
     "addon",
@@ -19,8 +19,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.8",
-    "@storybook/core-events": "5.0.0-rc.8",
+    "@storybook/addons": "5.0.0-rc.9",
+    "@storybook/core-events": "5.0.0-rc.9",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "react-ga": "^2.5.3"
diff --git a/addons/graphql/package.json b/addons/graphql/package.json
index 5a103ff07e4..759b525d512 100644
--- a/addons/graphql/package.json
+++ b/addons/graphql/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-graphql",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "Storybook addon to display the GraphiQL IDE",
   "keywords": [
     "addon",
diff --git a/addons/info/package.json b/addons/info/package.json
index 3205b43fcad..c72c859b997 100644
--- a/addons/info/package.json
+++ b/addons/info/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-info",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "A Storybook addon to show additional information for your stories.",
   "keywords": [
     "addon",
@@ -21,10 +21,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.8",
-    "@storybook/client-logger": "5.0.0-rc.8",
-    "@storybook/components": "5.0.0-rc.8",
-    "@storybook/theming": "5.0.0-rc.8",
+    "@storybook/addons": "5.0.0-rc.9",
+    "@storybook/client-logger": "5.0.0-rc.9",
+    "@storybook/components": "5.0.0-rc.9",
+    "@storybook/theming": "5.0.0-rc.9",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "marksy": "^6.1.0",
diff --git a/addons/jest/package.json b/addons/jest/package.json
index ab1191a8b0a..53a6d9c3b94 100644
--- a/addons/jest/package.json
+++ b/addons/jest/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-jest",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "React storybook addon that show component jest report",
   "keywords": [
     "addon",
@@ -27,10 +27,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.8",
-    "@storybook/components": "5.0.0-rc.8",
-    "@storybook/core-events": "5.0.0-rc.8",
-    "@storybook/theming": "5.0.0-rc.8",
+    "@storybook/addons": "5.0.0-rc.9",
+    "@storybook/components": "5.0.0-rc.9",
+    "@storybook/core-events": "5.0.0-rc.9",
+    "@storybook/theming": "5.0.0-rc.9",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "prop-types": "^15.6.2",
diff --git a/addons/knobs/package.json b/addons/knobs/package.json
index 2a8d85dca08..94d775554dc 100644
--- a/addons/knobs/package.json
+++ b/addons/knobs/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-knobs",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "Storybook Addon Prop Editor Component",
   "keywords": [
     "addon",
@@ -21,10 +21,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.8",
-    "@storybook/components": "5.0.0-rc.8",
-    "@storybook/core-events": "5.0.0-rc.8",
-    "@storybook/theming": "5.0.0-rc.8",
+    "@storybook/addons": "5.0.0-rc.9",
+    "@storybook/components": "5.0.0-rc.9",
+    "@storybook/core-events": "5.0.0-rc.9",
+    "@storybook/theming": "5.0.0-rc.9",
     "copy-to-clipboard": "^3.0.8",
     "core-js": "^2.6.2",
     "escape-html": "^1.0.3",
diff --git a/addons/links/package.json b/addons/links/package.json
index 58ca9f99a0f..fa7e279196d 100644
--- a/addons/links/package.json
+++ b/addons/links/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-links",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "Story Links addon for storybook",
   "keywords": [
     "addon",
@@ -21,8 +21,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.8",
-    "@storybook/core-events": "5.0.0-rc.8",
+    "@storybook/addons": "5.0.0-rc.9",
+    "@storybook/core-events": "5.0.0-rc.9",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/addons/notes/package.json b/addons/notes/package.json
index b5821b8a2e1..5f751ef5d1c 100644
--- a/addons/notes/package.json
+++ b/addons/notes/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-notes",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "Write notes for your Storybook stories.",
   "keywords": [
     "addon",
@@ -22,11 +22,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.8",
-    "@storybook/client-logger": "5.0.0-rc.8",
-    "@storybook/components": "5.0.0-rc.8",
-    "@storybook/core-events": "5.0.0-rc.8",
-    "@storybook/theming": "5.0.0-rc.8",
+    "@storybook/addons": "5.0.0-rc.9",
+    "@storybook/client-logger": "5.0.0-rc.9",
+    "@storybook/components": "5.0.0-rc.9",
+    "@storybook/core-events": "5.0.0-rc.9",
+    "@storybook/theming": "5.0.0-rc.9",
     "markdown-to-jsx": "^6.9.1",
     "prop-types": "^15.6.2",
     "util-deprecate": "^1.0.2"
diff --git a/addons/ondevice-backgrounds/package.json b/addons/ondevice-backgrounds/package.json
index 395c680b0d6..325a64251fb 100644
--- a/addons/ondevice-backgrounds/package.json
+++ b/addons/ondevice-backgrounds/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/addon-ondevice-backgrounds",
   "private": true,
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "A storybook addon to show different backgrounds for your preview",
   "keywords": [
     "addon",
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.8",
+    "@storybook/addons": "5.0.0-rc.9",
     "core-js": "^2.6.2",
     "prop-types": "^15.6.2"
   },
diff --git a/addons/ondevice-knobs/package.json b/addons/ondevice-knobs/package.json
index 17d8f640600..6d0487fff57 100644
--- a/addons/ondevice-knobs/package.json
+++ b/addons/ondevice-knobs/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/addon-ondevice-knobs",
   "private": true,
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "Display storybook story knobs on your deviced.",
   "keywords": [
     "addon",
@@ -21,7 +21,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.8",
+    "@storybook/addons": "5.0.0-rc.9",
     "core-js": "^2.6.2",
     "deep-equal": "^1.0.1",
     "prop-types": "^15.6.2",
diff --git a/addons/ondevice-notes/package.json b/addons/ondevice-notes/package.json
index 2bda6c8f4a5..f164f9403cb 100644
--- a/addons/ondevice-notes/package.json
+++ b/addons/ondevice-notes/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/addon-ondevice-notes",
   "private": true,
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "Write notes for your Storybook stories.",
   "keywords": [
     "addon",
@@ -19,7 +19,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.8",
+    "@storybook/addons": "5.0.0-rc.9",
     "core-js": "^2.6.2",
     "prop-types": "^15.6.2",
     "react-native-simple-markdown": "^1.1.0"
diff --git a/addons/options/package.json b/addons/options/package.json
index bf88642e755..34be5366979 100644
--- a/addons/options/package.json
+++ b/addons/options/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-options",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "Options addon for storybook",
   "keywords": [
     "addon",
@@ -20,7 +20,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.8",
+    "@storybook/addons": "5.0.0-rc.9",
     "core-js": "^2.6.2",
     "util-deprecate": "^1.0.2"
   },
diff --git a/addons/storyshots/storyshots-core/package.json b/addons/storyshots/storyshots-core/package.json
index bb66226721c..fd125ca37b6 100644
--- a/addons/storyshots/storyshots-core/package.json
+++ b/addons/storyshots/storyshots-core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storyshots",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "StoryShots is a Jest Snapshot Testing Addon for Storybook.",
   "keywords": [
     "addon",
@@ -24,7 +24,7 @@
     "storybook": "start-storybook -p 6006"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.8",
+    "@storybook/addons": "5.0.0-rc.9",
     "core-js": "^2.6.2",
     "glob": "^7.1.3",
     "global": "^4.3.2",
diff --git a/addons/storyshots/storyshots-puppeteer/package.json b/addons/storyshots/storyshots-puppeteer/package.json
index a014096e9e2..416e38ea694 100644
--- a/addons/storyshots/storyshots-puppeteer/package.json
+++ b/addons/storyshots/storyshots-puppeteer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storyshots-puppeteer",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "Image snappshots addition to StoryShots base on puppeteer",
   "keywords": [
     "addon",
@@ -21,8 +21,8 @@
     "prepare": "node ../../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/node-logger": "5.0.0-rc.8",
-    "@storybook/router": "5.0.0-rc.8",
+    "@storybook/node-logger": "5.0.0-rc.9",
+    "@storybook/router": "5.0.0-rc.9",
     "core-js": "^2.6.2",
     "jest-image-snapshot": "^2.6.0",
     "puppeteer": "^1.12.0",
diff --git a/addons/storysource/package.json b/addons/storysource/package.json
index 100db18d18e..d2d67335206 100644
--- a/addons/storysource/package.json
+++ b/addons/storysource/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storysource",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "Stories addon for storybook",
   "keywords": [
     "addon",
@@ -21,10 +21,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.8",
-    "@storybook/components": "5.0.0-rc.8",
-    "@storybook/router": "5.0.0-rc.8",
-    "@storybook/theming": "5.0.0-rc.8",
+    "@storybook/addons": "5.0.0-rc.9",
+    "@storybook/components": "5.0.0-rc.9",
+    "@storybook/router": "5.0.0-rc.9",
+    "@storybook/theming": "5.0.0-rc.9",
     "core-js": "^2.6.2",
     "estraverse": "^4.2.0",
     "loader-utils": "^1.2.1",
diff --git a/addons/viewport/package.json b/addons/viewport/package.json
index c7956a06059..db8e913bdda 100644
--- a/addons/viewport/package.json
+++ b/addons/viewport/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-viewport",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "Storybook addon to change the viewport size to mobile",
   "keywords": [
     "addon",
@@ -20,11 +20,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.8",
-    "@storybook/client-logger": "5.0.0-rc.8",
-    "@storybook/components": "5.0.0-rc.8",
-    "@storybook/core-events": "5.0.0-rc.8",
-    "@storybook/theming": "5.0.0-rc.8",
+    "@storybook/addons": "5.0.0-rc.9",
+    "@storybook/client-logger": "5.0.0-rc.9",
+    "@storybook/components": "5.0.0-rc.9",
+    "@storybook/core-events": "5.0.0-rc.9",
+    "@storybook/theming": "5.0.0-rc.9",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
diff --git a/app/angular/package.json b/app/angular/package.json
index afa2a75322e..f6748263edd 100644
--- a/app/angular/package.json
+++ b/app/angular/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/angular",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "Storybook for Angular: Develop Angular Components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,8 +25,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.8",
-    "@storybook/node-logger": "5.0.0-rc.8",
+    "@storybook/core": "5.0.0-rc.9",
+    "@storybook/node-logger": "5.0.0-rc.9",
     "angular2-template-loader": "^0.6.2",
     "core-js": "^2.6.2",
     "fork-ts-checker-webpack-plugin": "^0.5.2",
diff --git a/app/ember/package.json b/app/ember/package.json
index fd2946cdec1..bd841860632 100644
--- a/app/ember/package.json
+++ b/app/ember/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/ember",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "Storybook for Ember: Develop Ember Component in isolation with Hot Reloading.",
   "homepage": "https://github.com/storybooks/storybook/tree/master/app/ember",
   "bugs": {
@@ -23,7 +23,7 @@
   },
   "dependencies": {
     "@ember/test-helpers": "^1.3.1",
-    "@storybook/core": "5.0.0-rc.8",
+    "@storybook/core": "5.0.0-rc.9",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/html/package.json b/app/html/package.json
index a2e8e78894e..dc8d3fdd4fc 100644
--- a/app/html/package.json
+++ b/app/html/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/html",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "Storybook for HTML: View HTML snippets in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.8",
+    "@storybook/core": "5.0.0-rc.9",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/marko/package.json b/app/marko/package.json
index 982e8aa5545..66ce3de14f7 100644
--- a/app/marko/package.json
+++ b/app/marko/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/marko",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "Storybook for Marko: Develop Marko Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.8",
+    "@storybook/core": "5.0.0-rc.9",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/mithril/package.json b/app/mithril/package.json
index f2eced986ff..2363dbb1c29 100644
--- a/app/mithril/package.json
+++ b/app/mithril/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/mithril",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "Storybook for Mithril: Develop Mithril Component in isolation.",
   "keywords": [
     "storybook"
@@ -26,7 +26,7 @@
   },
   "dependencies": {
     "@babel/plugin-transform-react-jsx": "^7.3.0",
-    "@storybook/core": "5.0.0-rc.8",
+    "@storybook/core": "5.0.0-rc.9",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/polymer/package.json b/app/polymer/package.json
index 0f8a0911ecb..b77cb5b1dad 100644
--- a/app/polymer/package.json
+++ b/app/polymer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/polymer",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "Storybook for Polymer: Develop Polymer components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.8",
+    "@storybook/core": "5.0.0-rc.9",
     "@webcomponents/webcomponentsjs": "^1.2.0",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
diff --git a/app/preact/package.json b/app/preact/package.json
index 2e5eafb74a6..2c66f99156a 100644
--- a/app/preact/package.json
+++ b/app/preact/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/preact",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "Storybook for Preact: Develop Preact Component in isolation.",
   "keywords": [
     "storybook"
@@ -26,7 +26,7 @@
   },
   "dependencies": {
     "@babel/plugin-transform-react-jsx": "^7.3.0",
-    "@storybook/core": "5.0.0-rc.8",
+    "@storybook/core": "5.0.0-rc.9",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/react-native/package.json b/app/react-native/package.json
index 46819e8a335..8b5f3cca3d2 100644
--- a/app/react-native/package.json
+++ b/app/react-native/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/react-native",
   "private": true,
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "A better way to develop React Native Components for your app",
   "keywords": [
     "react",
@@ -26,12 +26,12 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.8",
-    "@storybook/channel-websocket": "5.0.0-rc.8",
-    "@storybook/channels": "5.0.0-rc.8",
-    "@storybook/core": "5.0.0-rc.8",
-    "@storybook/core-events": "5.0.0-rc.8",
-    "@storybook/ui": "5.0.0-rc.8",
+    "@storybook/addons": "5.0.0-rc.9",
+    "@storybook/channel-websocket": "5.0.0-rc.9",
+    "@storybook/channels": "5.0.0-rc.9",
+    "@storybook/core": "5.0.0-rc.9",
+    "@storybook/core-events": "5.0.0-rc.9",
+    "@storybook/ui": "5.0.0-rc.9",
     "babel-loader": "^8.0.4",
     "babel-plugin-macros": "^2.4.5",
     "babel-plugin-syntax-async-functions": "^6.13.0",
diff --git a/app/react/package.json b/app/react/package.json
index 07d75c857fc..321612fbf74 100644
--- a/app/react/package.json
+++ b/app/react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/react",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "Storybook for React: Develop React Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -28,9 +28,9 @@
     "@babel/plugin-transform-react-constant-elements": "^7.2.0",
     "@babel/preset-flow": "^7.0.0",
     "@babel/preset-react": "^7.0.0",
-    "@storybook/core": "5.0.0-rc.8",
-    "@storybook/node-logger": "5.0.0-rc.8",
-    "@storybook/theming": "5.0.0-rc.8",
+    "@storybook/core": "5.0.0-rc.9",
+    "@storybook/node-logger": "5.0.0-rc.9",
+    "@storybook/theming": "5.0.0-rc.9",
     "@svgr/webpack": "^4.0.3",
     "babel-plugin-named-asset-import": "^0.3.0",
     "babel-plugin-react-docgen": "^2.0.2",
diff --git a/app/riot/package.json b/app/riot/package.json
index 141df4b81ac..9976d69bcde 100644
--- a/app/riot/package.json
+++ b/app/riot/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/riot",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "Storybook for riot.js: View riot snippets in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.8",
+    "@storybook/core": "5.0.0-rc.9",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/svelte/package.json b/app/svelte/package.json
index e287ab1ed93..1b1a5cec6b4 100644
--- a/app/svelte/package.json
+++ b/app/svelte/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/svelte",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "Storybook for Svelte: Develop Svelte Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.8",
+    "@storybook/core": "5.0.0-rc.9",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/vue/package.json b/app/vue/package.json
index 2b2c9dba37f..3db871d5ae1 100644
--- a/app/vue/package.json
+++ b/app/vue/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/vue",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "Storybook for Vue: Develop Vue Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.8",
+    "@storybook/core": "5.0.0-rc.9",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/examples/angular-cli/package.json b/examples/angular-cli/package.json
index 87023401ecb..f6986880435 100644
--- a/examples/angular-cli/package.json
+++ b/examples/angular-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "angular-cli",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "private": true,
   "license": "MIT",
   "scripts": {
@@ -33,18 +33,18 @@
     "@angular-devkit/build-angular": "^0.13.1",
     "@angular/cli": "^7.3.2",
     "@angular/compiler-cli": "^7.2.1",
-    "@storybook/addon-actions": "5.0.0-rc.8",
-    "@storybook/addon-backgrounds": "5.0.0-rc.8",
-    "@storybook/addon-centered": "5.0.0-rc.8",
-    "@storybook/addon-jest": "5.0.0-rc.8",
-    "@storybook/addon-knobs": "5.0.0-rc.8",
-    "@storybook/addon-links": "5.0.0-rc.8",
-    "@storybook/addon-notes": "5.0.0-rc.8",
-    "@storybook/addon-options": "5.0.0-rc.8",
-    "@storybook/addon-storyshots": "5.0.0-rc.8",
-    "@storybook/addon-storysource": "5.0.0-rc.8",
-    "@storybook/addons": "5.0.0-rc.8",
-    "@storybook/angular": "5.0.0-rc.8",
+    "@storybook/addon-actions": "5.0.0-rc.9",
+    "@storybook/addon-backgrounds": "5.0.0-rc.9",
+    "@storybook/addon-centered": "5.0.0-rc.9",
+    "@storybook/addon-jest": "5.0.0-rc.9",
+    "@storybook/addon-knobs": "5.0.0-rc.9",
+    "@storybook/addon-links": "5.0.0-rc.9",
+    "@storybook/addon-notes": "5.0.0-rc.9",
+    "@storybook/addon-options": "5.0.0-rc.9",
+    "@storybook/addon-storyshots": "5.0.0-rc.9",
+    "@storybook/addon-storysource": "5.0.0-rc.9",
+    "@storybook/addons": "5.0.0-rc.9",
+    "@storybook/angular": "5.0.0-rc.9",
     "@types/core-js": "^2.5.0",
     "@types/jest": "^23.3.13",
     "@types/node": "~10.12.19",
diff --git a/examples/cra-kitchen-sink/package.json b/examples/cra-kitchen-sink/package.json
index 4dd4474c589..6b515c6bbec 100644
--- a/examples/cra-kitchen-sink/package.json
+++ b/examples/cra-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "cra-kitchen-sink",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "private": true,
   "scripts": {
     "build": "react-scripts build",
@@ -18,21 +18,21 @@
     "react-lifecycles-compat": "^3.0.4"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.0.0-rc.8",
-    "@storybook/addon-actions": "5.0.0-rc.8",
-    "@storybook/addon-backgrounds": "5.0.0-rc.8",
-    "@storybook/addon-centered": "5.0.0-rc.8",
-    "@storybook/addon-events": "5.0.0-rc.8",
-    "@storybook/addon-info": "5.0.0-rc.8",
-    "@storybook/addon-jest": "5.0.0-rc.8",
-    "@storybook/addon-knobs": "5.0.0-rc.8",
-    "@storybook/addon-links": "5.0.0-rc.8",
-    "@storybook/addon-notes": "5.0.0-rc.8",
-    "@storybook/addon-options": "5.0.0-rc.8",
-    "@storybook/addon-storyshots": "5.0.0-rc.8",
-    "@storybook/addons": "5.0.0-rc.8",
-    "@storybook/client-logger": "5.0.0-rc.8",
-    "@storybook/react": "5.0.0-rc.8",
+    "@storybook/addon-a11y": "5.0.0-rc.9",
+    "@storybook/addon-actions": "5.0.0-rc.9",
+    "@storybook/addon-backgrounds": "5.0.0-rc.9",
+    "@storybook/addon-centered": "5.0.0-rc.9",
+    "@storybook/addon-events": "5.0.0-rc.9",
+    "@storybook/addon-info": "5.0.0-rc.9",
+    "@storybook/addon-jest": "5.0.0-rc.9",
+    "@storybook/addon-knobs": "5.0.0-rc.9",
+    "@storybook/addon-links": "5.0.0-rc.9",
+    "@storybook/addon-notes": "5.0.0-rc.9",
+    "@storybook/addon-options": "5.0.0-rc.9",
+    "@storybook/addon-storyshots": "5.0.0-rc.9",
+    "@storybook/addons": "5.0.0-rc.9",
+    "@storybook/client-logger": "5.0.0-rc.9",
+    "@storybook/react": "5.0.0-rc.9",
     "enzyme": "^3.7.0",
     "enzyme-adapter-react-16": "^1.9.1",
     "enzyme-to-json": "^3.3.4",
diff --git a/examples/cra-ts-kitchen-sink/package.json b/examples/cra-ts-kitchen-sink/package.json
index 145e91221c8..7a301789ba0 100644
--- a/examples/cra-ts-kitchen-sink/package.json
+++ b/examples/cra-ts-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "cra-ts-kitchen-sink",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook -s public",
@@ -19,11 +19,11 @@
     "react-dom": "^16.8.1"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.8",
-    "@storybook/addon-info": "5.0.0-rc.8",
-    "@storybook/addon-options": "5.0.0-rc.8",
-    "@storybook/addons": "5.0.0-rc.8",
-    "@storybook/react": "5.0.0-rc.8",
+    "@storybook/addon-actions": "5.0.0-rc.9",
+    "@storybook/addon-info": "5.0.0-rc.9",
+    "@storybook/addon-options": "5.0.0-rc.9",
+    "@storybook/addons": "5.0.0-rc.9",
+    "@storybook/react": "5.0.0-rc.9",
     "@types/enzyme": "^3.1.15",
     "@types/react": "^16.7.22",
     "@types/react-dom": "^16.0.11",
diff --git a/examples/ember-cli/package.json b/examples/ember-cli/package.json
index 851f5dbb994..9a6efda8d4e 100644
--- a/examples/ember-cli/package.json
+++ b/examples/ember-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "ember-example",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "private": true,
   "scripts": {
     "build": "ember build",
@@ -14,18 +14,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.2.2",
-    "@storybook/addon-a11y": "5.0.0-rc.8",
-    "@storybook/addon-actions": "5.0.0-rc.8",
-    "@storybook/addon-backgrounds": "5.0.0-rc.8",
-    "@storybook/addon-centered": "5.0.0-rc.8",
-    "@storybook/addon-knobs": "5.0.0-rc.8",
-    "@storybook/addon-links": "5.0.0-rc.8",
-    "@storybook/addon-notes": "5.0.0-rc.8",
-    "@storybook/addon-options": "5.0.0-rc.8",
-    "@storybook/addon-storysource": "5.0.0-rc.8",
-    "@storybook/addon-viewport": "5.0.0-rc.8",
-    "@storybook/addons": "5.0.0-rc.8",
-    "@storybook/ember": "5.0.0-rc.8",
+    "@storybook/addon-a11y": "5.0.0-rc.9",
+    "@storybook/addon-actions": "5.0.0-rc.9",
+    "@storybook/addon-backgrounds": "5.0.0-rc.9",
+    "@storybook/addon-centered": "5.0.0-rc.9",
+    "@storybook/addon-knobs": "5.0.0-rc.9",
+    "@storybook/addon-links": "5.0.0-rc.9",
+    "@storybook/addon-notes": "5.0.0-rc.9",
+    "@storybook/addon-options": "5.0.0-rc.9",
+    "@storybook/addon-storysource": "5.0.0-rc.9",
+    "@storybook/addon-viewport": "5.0.0-rc.9",
+    "@storybook/addons": "5.0.0-rc.9",
+    "@storybook/ember": "5.0.0-rc.9",
     "babel-loader": "^8",
     "broccoli-asset-rev": "^3.0.0",
     "cross-env": "^5.2.0",
diff --git a/examples/html-kitchen-sink/package.json b/examples/html-kitchen-sink/package.json
index 85a8cd8cf31..7fe4f7cc261 100644
--- a/examples/html-kitchen-sink/package.json
+++ b/examples/html-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "html-kitchen-sink",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "private": true,
   "description": "",
   "keywords": [],
@@ -13,23 +13,23 @@
     "storybook": "start-storybook -p 9006"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.0.0-rc.8",
-    "@storybook/addon-actions": "5.0.0-rc.8",
-    "@storybook/addon-backgrounds": "5.0.0-rc.8",
-    "@storybook/addon-centered": "5.0.0-rc.8",
-    "@storybook/addon-events": "5.0.0-rc.8",
-    "@storybook/addon-jest": "5.0.0-rc.8",
-    "@storybook/addon-knobs": "5.0.0-rc.8",
-    "@storybook/addon-links": "5.0.0-rc.8",
-    "@storybook/addon-notes": "5.0.0-rc.8",
-    "@storybook/addon-options": "5.0.0-rc.8",
-    "@storybook/addon-storyshots": "5.0.0-rc.8",
-    "@storybook/addon-storysource": "5.0.0-rc.8",
-    "@storybook/addon-viewport": "5.0.0-rc.8",
-    "@storybook/addons": "5.0.0-rc.8",
-    "@storybook/core": "5.0.0-rc.8",
-    "@storybook/core-events": "5.0.0-rc.8",
-    "@storybook/html": "5.0.0-rc.8",
+    "@storybook/addon-a11y": "5.0.0-rc.9",
+    "@storybook/addon-actions": "5.0.0-rc.9",
+    "@storybook/addon-backgrounds": "5.0.0-rc.9",
+    "@storybook/addon-centered": "5.0.0-rc.9",
+    "@storybook/addon-events": "5.0.0-rc.9",
+    "@storybook/addon-jest": "5.0.0-rc.9",
+    "@storybook/addon-knobs": "5.0.0-rc.9",
+    "@storybook/addon-links": "5.0.0-rc.9",
+    "@storybook/addon-notes": "5.0.0-rc.9",
+    "@storybook/addon-options": "5.0.0-rc.9",
+    "@storybook/addon-storyshots": "5.0.0-rc.9",
+    "@storybook/addon-storysource": "5.0.0-rc.9",
+    "@storybook/addon-viewport": "5.0.0-rc.9",
+    "@storybook/addons": "5.0.0-rc.9",
+    "@storybook/core": "5.0.0-rc.9",
+    "@storybook/core-events": "5.0.0-rc.9",
+    "@storybook/html": "5.0.0-rc.9",
     "eventemitter3": "^3.1.0",
     "format-json": "^1.0.3",
     "global": "^4.3.2",
diff --git a/examples/marko-cli/package.json b/examples/marko-cli/package.json
index 4685846ee05..0495544fc65 100644
--- a/examples/marko-cli/package.json
+++ b/examples/marko-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "marko-cli",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "private": true,
   "description": "Demo of how to build an app using marko-starter",
   "repository": {
@@ -22,12 +22,12 @@
     "marko-starter": "^2.0.4"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.8",
-    "@storybook/addon-knobs": "5.0.0-rc.8",
-    "@storybook/addon-options": "5.0.0-rc.8",
-    "@storybook/addon-storysource": "5.0.0-rc.8",
-    "@storybook/addons": "5.0.0-rc.8",
-    "@storybook/marko": "5.0.0-rc.8",
+    "@storybook/addon-actions": "5.0.0-rc.9",
+    "@storybook/addon-knobs": "5.0.0-rc.9",
+    "@storybook/addon-options": "5.0.0-rc.9",
+    "@storybook/addon-storysource": "5.0.0-rc.9",
+    "@storybook/addons": "5.0.0-rc.9",
+    "@storybook/marko": "5.0.0-rc.9",
     "prettier": "^1.16.4",
     "webpack": "^4.29.0"
   }
diff --git a/examples/mithril-kitchen-sink/package.json b/examples/mithril-kitchen-sink/package.json
index 5f75636c85e..96cc6a6e4f7 100644
--- a/examples/mithril-kitchen-sink/package.json
+++ b/examples/mithril-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "mithril-example",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook",
@@ -10,18 +10,18 @@
     "mithril": "^1.1.6"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.8",
-    "@storybook/addon-backgrounds": "5.0.0-rc.8",
-    "@storybook/addon-centered": "5.0.0-rc.8",
-    "@storybook/addon-knobs": "5.0.0-rc.8",
-    "@storybook/addon-links": "5.0.0-rc.8",
-    "@storybook/addon-notes": "5.0.0-rc.8",
-    "@storybook/addon-options": "5.0.0-rc.8",
-    "@storybook/addon-storyshots": "5.0.0-rc.8",
-    "@storybook/addon-storysource": "5.0.0-rc.8",
-    "@storybook/addon-viewport": "5.0.0-rc.8",
-    "@storybook/addons": "5.0.0-rc.8",
-    "@storybook/mithril": "5.0.0-rc.8",
+    "@storybook/addon-actions": "5.0.0-rc.9",
+    "@storybook/addon-backgrounds": "5.0.0-rc.9",
+    "@storybook/addon-centered": "5.0.0-rc.9",
+    "@storybook/addon-knobs": "5.0.0-rc.9",
+    "@storybook/addon-links": "5.0.0-rc.9",
+    "@storybook/addon-notes": "5.0.0-rc.9",
+    "@storybook/addon-options": "5.0.0-rc.9",
+    "@storybook/addon-storyshots": "5.0.0-rc.9",
+    "@storybook/addon-storysource": "5.0.0-rc.9",
+    "@storybook/addon-viewport": "5.0.0-rc.9",
+    "@storybook/addons": "5.0.0-rc.9",
+    "@storybook/mithril": "5.0.0-rc.9",
     "webpack": "^4.29.0"
   }
 }
diff --git a/examples/official-storybook/package.json b/examples/official-storybook/package.json
index 3e0d171bab0..048f48af817 100644
--- a/examples/official-storybook/package.json
+++ b/examples/official-storybook/package.json
@@ -1,6 +1,6 @@
 {
   "name": "official-storybook",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook -c ./ -s built-storybooks",
@@ -12,29 +12,29 @@
     "storybook": "cross-env STORYBOOK_DISPLAY_WARNING=true DISPLAY_WARNING=true start-storybook -p 9011 -c ./ -s built-storybooks --no-dll"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.0.0-rc.8",
-    "@storybook/addon-actions": "5.0.0-rc.8",
-    "@storybook/addon-backgrounds": "5.0.0-rc.8",
-    "@storybook/addon-centered": "5.0.0-rc.8",
-    "@storybook/addon-cssresources": "5.0.0-rc.8",
-    "@storybook/addon-events": "5.0.0-rc.8",
-    "@storybook/addon-graphql": "5.0.0-rc.8",
-    "@storybook/addon-info": "5.0.0-rc.8",
-    "@storybook/addon-jest": "5.0.0-rc.8",
-    "@storybook/addon-knobs": "5.0.0-rc.8",
-    "@storybook/addon-links": "5.0.0-rc.8",
-    "@storybook/addon-notes": "5.0.0-rc.8",
-    "@storybook/addon-options": "5.0.0-rc.8",
-    "@storybook/addon-storyshots": "5.0.0-rc.8",
-    "@storybook/addon-storyshots-puppeteer": "5.0.0-rc.8",
-    "@storybook/addon-storysource": "5.0.0-rc.8",
-    "@storybook/addon-viewport": "5.0.0-rc.8",
-    "@storybook/addons": "5.0.0-rc.8",
-    "@storybook/components": "5.0.0-rc.8",
-    "@storybook/core-events": "5.0.0-rc.8",
-    "@storybook/node-logger": "5.0.0-rc.8",
-    "@storybook/react": "5.0.0-rc.8",
-    "@storybook/theming": "5.0.0-rc.8",
+    "@storybook/addon-a11y": "5.0.0-rc.9",
+    "@storybook/addon-actions": "5.0.0-rc.9",
+    "@storybook/addon-backgrounds": "5.0.0-rc.9",
+    "@storybook/addon-centered": "5.0.0-rc.9",
+    "@storybook/addon-cssresources": "5.0.0-rc.9",
+    "@storybook/addon-events": "5.0.0-rc.9",
+    "@storybook/addon-graphql": "5.0.0-rc.9",
+    "@storybook/addon-info": "5.0.0-rc.9",
+    "@storybook/addon-jest": "5.0.0-rc.9",
+    "@storybook/addon-knobs": "5.0.0-rc.9",
+    "@storybook/addon-links": "5.0.0-rc.9",
+    "@storybook/addon-notes": "5.0.0-rc.9",
+    "@storybook/addon-options": "5.0.0-rc.9",
+    "@storybook/addon-storyshots": "5.0.0-rc.9",
+    "@storybook/addon-storyshots-puppeteer": "5.0.0-rc.9",
+    "@storybook/addon-storysource": "5.0.0-rc.9",
+    "@storybook/addon-viewport": "5.0.0-rc.9",
+    "@storybook/addons": "5.0.0-rc.9",
+    "@storybook/components": "5.0.0-rc.9",
+    "@storybook/core-events": "5.0.0-rc.9",
+    "@storybook/node-logger": "5.0.0-rc.9",
+    "@storybook/react": "5.0.0-rc.9",
+    "@storybook/theming": "5.0.0-rc.9",
     "cors": "^2.8.4",
     "cross-env": "^5.2.0",
     "enzyme-to-json": "^3.3.4",
diff --git a/examples/polymer-cli/package.json b/examples/polymer-cli/package.json
index 547d10e9671..e09ff6ce25b 100644
--- a/examples/polymer-cli/package.json
+++ b/examples/polymer-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "polymer-cli",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook",
@@ -9,15 +9,15 @@
   },
   "dependencies": {
     "@polymer/polymer": "^2.6.0",
-    "@storybook/addon-actions": "5.0.0-rc.8",
-    "@storybook/addon-backgrounds": "5.0.0-rc.8",
-    "@storybook/addon-knobs": "5.0.0-rc.8",
-    "@storybook/addon-links": "5.0.0-rc.8",
-    "@storybook/addon-notes": "5.0.0-rc.8",
-    "@storybook/addon-options": "5.0.0-rc.8",
-    "@storybook/addon-storysource": "5.0.0-rc.8",
-    "@storybook/addon-viewport": "5.0.0-rc.8",
-    "@storybook/polymer": "5.0.0-rc.8",
+    "@storybook/addon-actions": "5.0.0-rc.9",
+    "@storybook/addon-backgrounds": "5.0.0-rc.9",
+    "@storybook/addon-knobs": "5.0.0-rc.9",
+    "@storybook/addon-links": "5.0.0-rc.9",
+    "@storybook/addon-notes": "5.0.0-rc.9",
+    "@storybook/addon-options": "5.0.0-rc.9",
+    "@storybook/addon-storysource": "5.0.0-rc.9",
+    "@storybook/addon-viewport": "5.0.0-rc.9",
+    "@storybook/polymer": "5.0.0-rc.9",
     "@webcomponents/webcomponentsjs": "^1.2.0",
     "global": "^4.3.2",
     "lit-html": "^1.0.0",
diff --git a/examples/preact-kitchen-sink/package.json b/examples/preact-kitchen-sink/package.json
index 33ee8d0d4c7..1549a62c5e1 100644
--- a/examples/preact-kitchen-sink/package.json
+++ b/examples/preact-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "preact-example",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "private": true,
   "scripts": {
     "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
@@ -15,18 +15,18 @@
   "devDependencies": {
     "@babel/core": "^7.2.2",
     "@babel/plugin-transform-runtime": "^7.2.0",
-    "@storybook/addon-actions": "5.0.0-rc.8",
-    "@storybook/addon-backgrounds": "5.0.0-rc.8",
-    "@storybook/addon-centered": "5.0.0-rc.8",
-    "@storybook/addon-knobs": "5.0.0-rc.8",
-    "@storybook/addon-links": "5.0.0-rc.8",
-    "@storybook/addon-notes": "5.0.0-rc.8",
-    "@storybook/addon-options": "5.0.0-rc.8",
-    "@storybook/addon-storyshots": "5.0.0-rc.8",
-    "@storybook/addon-storysource": "5.0.0-rc.8",
-    "@storybook/addon-viewport": "5.0.0-rc.8",
-    "@storybook/addons": "5.0.0-rc.8",
-    "@storybook/preact": "5.0.0-rc.8",
+    "@storybook/addon-actions": "5.0.0-rc.9",
+    "@storybook/addon-backgrounds": "5.0.0-rc.9",
+    "@storybook/addon-centered": "5.0.0-rc.9",
+    "@storybook/addon-knobs": "5.0.0-rc.9",
+    "@storybook/addon-links": "5.0.0-rc.9",
+    "@storybook/addon-notes": "5.0.0-rc.9",
+    "@storybook/addon-options": "5.0.0-rc.9",
+    "@storybook/addon-storyshots": "5.0.0-rc.9",
+    "@storybook/addon-storysource": "5.0.0-rc.9",
+    "@storybook/addon-viewport": "5.0.0-rc.9",
+    "@storybook/addons": "5.0.0-rc.9",
+    "@storybook/preact": "5.0.0-rc.9",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
     "file-loader": "^3.0.1",
diff --git a/examples/riot-kitchen-sink/package.json b/examples/riot-kitchen-sink/package.json
index 18c672aa177..2d6795549ae 100644
--- a/examples/riot-kitchen-sink/package.json
+++ b/examples/riot-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "riot-example",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "private": true,
   "scripts": {
     "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
@@ -15,18 +15,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.2.2",
-    "@storybook/addon-actions": "5.0.0-rc.8",
-    "@storybook/addon-backgrounds": "5.0.0-rc.8",
-    "@storybook/addon-centered": "5.0.0-rc.8",
-    "@storybook/addon-knobs": "5.0.0-rc.8",
-    "@storybook/addon-links": "5.0.0-rc.8",
-    "@storybook/addon-notes": "5.0.0-rc.8",
-    "@storybook/addon-options": "5.0.0-rc.8",
-    "@storybook/addon-storyshots": "5.0.0-rc.8",
-    "@storybook/addon-storysource": "5.0.0-rc.8",
-    "@storybook/addon-viewport": "5.0.0-rc.8",
-    "@storybook/addons": "5.0.0-rc.8",
-    "@storybook/riot": "5.0.0-rc.8",
+    "@storybook/addon-actions": "5.0.0-rc.9",
+    "@storybook/addon-backgrounds": "5.0.0-rc.9",
+    "@storybook/addon-centered": "5.0.0-rc.9",
+    "@storybook/addon-knobs": "5.0.0-rc.9",
+    "@storybook/addon-links": "5.0.0-rc.9",
+    "@storybook/addon-notes": "5.0.0-rc.9",
+    "@storybook/addon-options": "5.0.0-rc.9",
+    "@storybook/addon-storyshots": "5.0.0-rc.9",
+    "@storybook/addon-storysource": "5.0.0-rc.9",
+    "@storybook/addon-viewport": "5.0.0-rc.9",
+    "@storybook/addons": "5.0.0-rc.9",
+    "@storybook/riot": "5.0.0-rc.9",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
     "file-loader": "^3.0.1",
diff --git a/examples/svelte-kitchen-sink/package.json b/examples/svelte-kitchen-sink/package.json
index 622796bbffd..192d58ec029 100644
--- a/examples/svelte-kitchen-sink/package.json
+++ b/examples/svelte-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "svelte-example",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook -s public",
@@ -10,17 +10,17 @@
     "global": "^4.3.2"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.8",
-    "@storybook/addon-backgrounds": "5.0.0-rc.8",
-    "@storybook/addon-centered": "5.0.0-rc.8",
-    "@storybook/addon-knobs": "5.0.0-rc.8",
-    "@storybook/addon-links": "5.0.0-rc.8",
-    "@storybook/addon-notes": "5.0.0-rc.8",
-    "@storybook/addon-options": "5.0.0-rc.8",
-    "@storybook/addon-storyshots": "5.0.0-rc.8",
-    "@storybook/addon-storysource": "5.0.0-rc.8",
-    "@storybook/addon-viewport": "5.0.0-rc.8",
-    "@storybook/addons": "5.0.0-rc.8",
-    "@storybook/svelte": "5.0.0-rc.8"
+    "@storybook/addon-actions": "5.0.0-rc.9",
+    "@storybook/addon-backgrounds": "5.0.0-rc.9",
+    "@storybook/addon-centered": "5.0.0-rc.9",
+    "@storybook/addon-knobs": "5.0.0-rc.9",
+    "@storybook/addon-links": "5.0.0-rc.9",
+    "@storybook/addon-notes": "5.0.0-rc.9",
+    "@storybook/addon-options": "5.0.0-rc.9",
+    "@storybook/addon-storyshots": "5.0.0-rc.9",
+    "@storybook/addon-storysource": "5.0.0-rc.9",
+    "@storybook/addon-viewport": "5.0.0-rc.9",
+    "@storybook/addons": "5.0.0-rc.9",
+    "@storybook/svelte": "5.0.0-rc.9"
   }
 }
diff --git a/examples/vue-kitchen-sink/package.json b/examples/vue-kitchen-sink/package.json
index 8c0583ba28f..51d49e73cd1 100644
--- a/examples/vue-kitchen-sink/package.json
+++ b/examples/vue-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "vue-example",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "private": true,
   "scripts": {
     "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
@@ -14,18 +14,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.2.2",
-    "@storybook/addon-actions": "5.0.0-rc.8",
-    "@storybook/addon-backgrounds": "5.0.0-rc.8",
-    "@storybook/addon-centered": "5.0.0-rc.8",
-    "@storybook/addon-knobs": "5.0.0-rc.8",
-    "@storybook/addon-links": "5.0.0-rc.8",
-    "@storybook/addon-notes": "5.0.0-rc.8",
-    "@storybook/addon-options": "5.0.0-rc.8",
-    "@storybook/addon-storyshots": "5.0.0-rc.8",
-    "@storybook/addon-storysource": "5.0.0-rc.8",
-    "@storybook/addon-viewport": "5.0.0-rc.8",
-    "@storybook/addons": "5.0.0-rc.8",
-    "@storybook/vue": "5.0.0-rc.8",
+    "@storybook/addon-actions": "5.0.0-rc.9",
+    "@storybook/addon-backgrounds": "5.0.0-rc.9",
+    "@storybook/addon-centered": "5.0.0-rc.9",
+    "@storybook/addon-knobs": "5.0.0-rc.9",
+    "@storybook/addon-links": "5.0.0-rc.9",
+    "@storybook/addon-notes": "5.0.0-rc.9",
+    "@storybook/addon-options": "5.0.0-rc.9",
+    "@storybook/addon-storyshots": "5.0.0-rc.9",
+    "@storybook/addon-storysource": "5.0.0-rc.9",
+    "@storybook/addon-viewport": "5.0.0-rc.9",
+    "@storybook/addons": "5.0.0-rc.9",
+    "@storybook/vue": "5.0.0-rc.9",
     "babel-core": "^7.0.0-bridge.0",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
diff --git a/lerna.json b/lerna.json
index aa824e658c3..f6d01f8edef 100644
--- a/lerna.json
+++ b/lerna.json
@@ -11,5 +11,5 @@
   "npmClient": "yarn",
   "useWorkspaces": true,
   "registry": "https://registry.npmjs.org",
-  "version": "5.0.0-rc.8"
+  "version": "5.0.0-rc.9"
 }
diff --git a/lib/addons/package.json b/lib/addons/package.json
index 500dccafa7c..bfaf30ddeb7 100644
--- a/lib/addons/package.json
+++ b/lib/addons/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addons",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "Storybook addons store",
   "keywords": [
     "storybook"
@@ -20,8 +20,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.0.0-rc.8",
-    "@storybook/client-logger": "5.0.0-rc.8",
+    "@storybook/channels": "5.0.0-rc.9",
+    "@storybook/client-logger": "5.0.0-rc.9",
     "global": "^4.3.2",
     "util-deprecate": "^1.0.2"
   },
diff --git a/lib/channel-postmessage/package.json b/lib/channel-postmessage/package.json
index 1e82d7e6372..d9acac87c7a 100644
--- a/lib/channel-postmessage/package.json
+++ b/lib/channel-postmessage/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channel-postmessage",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "",
   "keywords": [
     "storybook"
@@ -20,8 +20,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.0.0-rc.8",
-    "@storybook/client-logger": "5.0.0-rc.8",
+    "@storybook/channels": "5.0.0-rc.9",
+    "@storybook/client-logger": "5.0.0-rc.9",
     "global": "^4.3.2",
     "telejson": "^2.1.0"
   },
diff --git a/lib/channel-websocket/package.json b/lib/channel-websocket/package.json
index 01d535dcaaa..7cc75b9ef6f 100644
--- a/lib/channel-websocket/package.json
+++ b/lib/channel-websocket/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channel-websocket",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "",
   "keywords": [
     "storybook"
@@ -20,7 +20,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.0.0-rc.8",
+    "@storybook/channels": "5.0.0-rc.9",
     "global": "^4.3.2",
     "json-fn": "^1.1.1"
   },
diff --git a/lib/channels/package.json b/lib/channels/package.json
index 6d744573caf..efe2deb584d 100644
--- a/lib/channels/package.json
+++ b/lib/channels/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channels",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/cli/package.json b/lib/cli/package.json
index 1c2b05feb20..439a715eb4c 100644
--- a/lib/cli/package.json
+++ b/lib/cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/cli",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "Storybook's CLI - easiest method of adding storybook to your projects",
   "keywords": [
     "cli",
@@ -29,7 +29,7 @@
     "@babel/core": "^7.2.2",
     "@babel/preset-env": "^7.3.1",
     "@babel/register": "^7.0.0",
-    "@storybook/codemod": "5.0.0-rc.8",
+    "@storybook/codemod": "5.0.0-rc.9",
     "chalk": "^2.4.1",
     "commander": "^2.19.0",
     "core-js": "^2.6.2",
@@ -43,31 +43,31 @@
     "update-notifier": "^2.5.0"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.8",
-    "@storybook/addon-centered": "5.0.0-rc.8",
-    "@storybook/addon-graphql": "5.0.0-rc.8",
-    "@storybook/addon-info": "5.0.0-rc.8",
-    "@storybook/addon-knobs": "5.0.0-rc.8",
-    "@storybook/addon-links": "5.0.0-rc.8",
-    "@storybook/addon-notes": "5.0.0-rc.8",
-    "@storybook/addon-options": "5.0.0-rc.8",
-    "@storybook/addon-storyshots": "5.0.0-rc.8",
-    "@storybook/addons": "5.0.0-rc.8",
-    "@storybook/angular": "5.0.0-rc.8",
-    "@storybook/channel-postmessage": "5.0.0-rc.8",
-    "@storybook/channel-websocket": "5.0.0-rc.8",
-    "@storybook/channels": "5.0.0-rc.8",
-    "@storybook/ember": "5.0.0-rc.8",
-    "@storybook/html": "5.0.0-rc.8",
-    "@storybook/marko": "5.0.0-rc.8",
-    "@storybook/mithril": "5.0.0-rc.8",
-    "@storybook/polymer": "5.0.0-rc.8",
-    "@storybook/preact": "5.0.0-rc.8",
-    "@storybook/react": "5.0.0-rc.8",
-    "@storybook/react-native": "5.0.0-rc.8",
-    "@storybook/riot": "5.0.0-rc.8",
-    "@storybook/ui": "5.0.0-rc.8",
-    "@storybook/vue": "5.0.0-rc.8"
+    "@storybook/addon-actions": "5.0.0-rc.9",
+    "@storybook/addon-centered": "5.0.0-rc.9",
+    "@storybook/addon-graphql": "5.0.0-rc.9",
+    "@storybook/addon-info": "5.0.0-rc.9",
+    "@storybook/addon-knobs": "5.0.0-rc.9",
+    "@storybook/addon-links": "5.0.0-rc.9",
+    "@storybook/addon-notes": "5.0.0-rc.9",
+    "@storybook/addon-options": "5.0.0-rc.9",
+    "@storybook/addon-storyshots": "5.0.0-rc.9",
+    "@storybook/addons": "5.0.0-rc.9",
+    "@storybook/angular": "5.0.0-rc.9",
+    "@storybook/channel-postmessage": "5.0.0-rc.9",
+    "@storybook/channel-websocket": "5.0.0-rc.9",
+    "@storybook/channels": "5.0.0-rc.9",
+    "@storybook/ember": "5.0.0-rc.9",
+    "@storybook/html": "5.0.0-rc.9",
+    "@storybook/marko": "5.0.0-rc.9",
+    "@storybook/mithril": "5.0.0-rc.9",
+    "@storybook/polymer": "5.0.0-rc.9",
+    "@storybook/preact": "5.0.0-rc.9",
+    "@storybook/react": "5.0.0-rc.9",
+    "@storybook/react-native": "5.0.0-rc.9",
+    "@storybook/riot": "5.0.0-rc.9",
+    "@storybook/ui": "5.0.0-rc.9",
+    "@storybook/vue": "5.0.0-rc.9"
   },
   "publishConfig": {
     "access": "public"
diff --git a/lib/client-api/package.json b/lib/client-api/package.json
index 7af6a8406e5..093df12b4ec 100644
--- a/lib/client-api/package.json
+++ b/lib/client-api/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/client-api",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "Storybook Client API",
   "keywords": [
     "storybook"
@@ -19,10 +19,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.8",
-    "@storybook/client-logger": "5.0.0-rc.8",
-    "@storybook/core-events": "5.0.0-rc.8",
-    "@storybook/router": "5.0.0-rc.8",
+    "@storybook/addons": "5.0.0-rc.9",
+    "@storybook/client-logger": "5.0.0-rc.9",
+    "@storybook/core-events": "5.0.0-rc.9",
+    "@storybook/router": "5.0.0-rc.9",
     "common-tags": "^1.8.0",
     "eventemitter3": "^3.1.0",
     "global": "^4.3.2",
diff --git a/lib/client-logger/package.json b/lib/client-logger/package.json
index 99a4d49161e..8ede3bc002a 100644
--- a/lib/client-logger/package.json
+++ b/lib/client-logger/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/client-logger",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/codemod/package.json b/lib/codemod/package.json
index 0681f5d9236..fcd96ed798c 100644
--- a/lib/codemod/package.json
+++ b/lib/codemod/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/codemod",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "A collection of codemod scripts written with JSCodeshift",
   "keywords": [
     "storybook"
diff --git a/lib/components/package.json b/lib/components/package.json
index ffb3151e155..b16e3a2e954 100644
--- a/lib/components/package.json
+++ b/lib/components/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/components",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "Core Storybook Components",
   "keywords": [
     "storybook"
@@ -20,11 +20,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.8",
-    "@storybook/client-logger": "5.0.0-rc.8",
-    "@storybook/core-events": "5.0.0-rc.8",
-    "@storybook/router": "5.0.0-rc.8",
-    "@storybook/theming": "5.0.0-rc.8",
+    "@storybook/addons": "5.0.0-rc.9",
+    "@storybook/client-logger": "5.0.0-rc.9",
+    "@storybook/core-events": "5.0.0-rc.9",
+    "@storybook/router": "5.0.0-rc.9",
+    "@storybook/theming": "5.0.0-rc.9",
     "global": "^4.3.2",
     "immer": "^1.12.0",
     "js-beautify": "^1.8.9",
diff --git a/lib/core-events/package.json b/lib/core-events/package.json
index b86a6adbe84..bea7c993567 100644
--- a/lib/core-events/package.json
+++ b/lib/core-events/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/core-events",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "Event names used in storybook core",
   "keywords": [
     "storybook"
diff --git a/lib/core/package.json b/lib/core/package.json
index b14970dfccf..61a401d2095 100644
--- a/lib/core/package.json
+++ b/lib/core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/core",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "Storybook framework-agnostic API",
   "keywords": [
     "storybook"
@@ -24,15 +24,15 @@
     "@babel/plugin-syntax-dynamic-import": "^7.2.0",
     "@babel/plugin-transform-react-constant-elements": "^7.2.0",
     "@babel/preset-env": "^7.3.1",
-    "@storybook/addons": "5.0.0-rc.8",
-    "@storybook/channel-postmessage": "5.0.0-rc.8",
-    "@storybook/client-api": "5.0.0-rc.8",
-    "@storybook/client-logger": "5.0.0-rc.8",
-    "@storybook/core-events": "5.0.0-rc.8",
-    "@storybook/node-logger": "5.0.0-rc.8",
-    "@storybook/router": "5.0.0-rc.8",
-    "@storybook/theming": "5.0.0-rc.8",
-    "@storybook/ui": "5.0.0-rc.8",
+    "@storybook/addons": "5.0.0-rc.9",
+    "@storybook/channel-postmessage": "5.0.0-rc.9",
+    "@storybook/client-api": "5.0.0-rc.9",
+    "@storybook/client-logger": "5.0.0-rc.9",
+    "@storybook/core-events": "5.0.0-rc.9",
+    "@storybook/node-logger": "5.0.0-rc.9",
+    "@storybook/router": "5.0.0-rc.9",
+    "@storybook/theming": "5.0.0-rc.9",
+    "@storybook/ui": "5.0.0-rc.9",
     "airbnb-js-shims": "^1 || ^2",
     "autoprefixer": "^9.4.7",
     "babel-plugin-add-react-displayname": "^0.0.5",
diff --git a/lib/node-logger/package.json b/lib/node-logger/package.json
index aa44c8077b8..a1c8c9b295e 100644
--- a/lib/node-logger/package.json
+++ b/lib/node-logger/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/node-logger",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/router/package.json b/lib/router/package.json
index a8335960d95..e3621a93f02 100644
--- a/lib/router/package.json
+++ b/lib/router/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/router",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "Core Storybook Router",
   "keywords": [
     "storybook"
@@ -20,7 +20,7 @@
   },
   "dependencies": {
     "@reach/router": "^1.2.1",
-    "@storybook/theming": "5.0.0-rc.8",
+    "@storybook/theming": "5.0.0-rc.9",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
     "qs": "^6.5.2"
diff --git a/lib/theming/package.json b/lib/theming/package.json
index 5e3d967081f..cf95a325dcf 100644
--- a/lib/theming/package.json
+++ b/lib/theming/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/theming",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "Core Storybook Components",
   "keywords": [
     "storybook"
@@ -21,7 +21,7 @@
   "dependencies": {
     "@emotion/core": "^10.0.7",
     "@emotion/styled": "^10.0.7",
-    "@storybook/client-logger": "5.0.0-rc.8",
+    "@storybook/client-logger": "5.0.0-rc.9",
     "common-tags": "^1.8.0",
     "deep-object-diff": "^1.1.0",
     "emotion-theming": "^10.0.7",
diff --git a/lib/ui/package.json b/lib/ui/package.json
index 031d5d423e9..df67a46f56e 100644
--- a/lib/ui/package.json
+++ b/lib/ui/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/ui",
-  "version": "5.0.0-rc.8",
+  "version": "5.0.0-rc.9",
   "description": "Core Storybook UI",
   "keywords": [
     "storybook"
@@ -21,12 +21,12 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.8",
-    "@storybook/client-logger": "5.0.0-rc.8",
-    "@storybook/components": "5.0.0-rc.8",
-    "@storybook/core-events": "5.0.0-rc.8",
-    "@storybook/router": "5.0.0-rc.8",
-    "@storybook/theming": "5.0.0-rc.8",
+    "@storybook/addons": "5.0.0-rc.9",
+    "@storybook/client-logger": "5.0.0-rc.9",
+    "@storybook/components": "5.0.0-rc.9",
+    "@storybook/core-events": "5.0.0-rc.9",
+    "@storybook/router": "5.0.0-rc.9",
+    "@storybook/theming": "5.0.0-rc.9",
     "eventemitter3": "^3.1.0",
     "fast-deep-equal": "^2.0.1",
     "fuse.js": "^3.3.1",

From 1faf85de5bbc85fe881050146b023574d7403e6a Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Sun, 3 Mar 2019 15:16:36 +0800
Subject: [PATCH 116/249] 5.0.0-rc.9 versions.json

---
 docs/static/versions.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/docs/static/versions.json b/docs/static/versions.json
index 2a0233d1970..f6d7a59958d 100644
--- a/docs/static/versions.json
+++ b/docs/static/versions.json
@@ -1 +1 @@
-{"next":{"version":"5.0.0-rc.8","info":{"plain":"### Features\n\n* Core: Allow local decorators via params ([#5806](https://github.com/storybooks/storybook/pull/5806))\n\n### Bug Fixes\n\n* UI: Sort storiesHash so grouped keys appear together ([#5805](https://github.com/storybooks/storybook/pull/5805))\n* UI: Close tooltips on iframe clicks on keypresses ([#5807](https://github.com/storybooks/storybook/pull/5807))\n* Addon-Info: Add font family to info panel ([#5759](https://github.com/storybooks/storybook/pull/5759))"}}}
\ No newline at end of file
+{"next":{"version":"5.0.0-rc.9","info":{"plain":"### Features\n\n* Core: Allow local decorators via params ([#5806](https://github.com/storybooks/storybook/pull/5806))\n\n### Bug Fixes\n\n* Core: Add warning for decorators added \"mid-kind\" ([#5819](https://github.com/storybooks/storybook/pull/5819))\n* Addon-notes: Support inline code markdown ([#5802](https://github.com/storybooks/storybook/pull/5802))\n* Theming: Fix theme loading bugs ([#5787](https://github.com/storybooks/storybook/pull/5787))\n* CLI: Fix build-storybook with simplebar esm files ([#5816](https://github.com/storybooks/storybook/pull/5816))"}}}
\ No newline at end of file

From d162f7e17f2b19fec044e4312bbf29ca71edbd32 Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Sun, 3 Mar 2019 11:31:27 +0100
Subject: [PATCH 117/249] Merge pull request #5826 from
 storybooks/5823-enable-cors-versions

Enable CORS on versions.json
---
 docs/static/_headers | 3 +++
 1 file changed, 3 insertions(+)
 create mode 100644 docs/static/_headers

diff --git a/docs/static/_headers b/docs/static/_headers
new file mode 100644
index 00000000000..5f70931f146
--- /dev/null
+++ b/docs/static/_headers
@@ -0,0 +1,3 @@
+/versions.json
+  Access-Control-Allow-Origin: *
+  Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept
\ No newline at end of file

From d21308929f5ee0bf2e5a7bd85417372b0cbf9ab3 Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Sun, 3 Mar 2019 12:58:07 +0800
Subject: [PATCH 118/249] Merge pull request #5813 from
 storybooks/5781-local-decorators-migration

Document individual story decorators migration
---
 MIGRATION.md | 24 ++++++++++++++++++++++++
 1 file changed, 24 insertions(+)

diff --git a/MIGRATION.md b/MIGRATION.md
index b2897816561..a1d10779125 100644
--- a/MIGRATION.md
+++ b/MIGRATION.md
@@ -4,6 +4,7 @@
   - [Webpack config simplification](#webpack-config-simplification)
   - [Story hierarchy defaults](#story-hierarchy-defaults)
   - [Options addon deprecated](#options-addon-deprecated)
+  - [Individual story decorators](#individual-story-decorators)
 - [From version 4.0.x to 4.1.x](#from-version-40x-to-41x)
   - [Private addon config](#private-addon-config)
   - [React 15.x](#react-15x)
@@ -139,6 +140,29 @@ Here is the mapping from old options to new:
 
 Storybook v5 removes the search dialog box in favor of a quick search in the navigation view, so `showSearchBox` has been removed.
 
+## Individual story decorators
+
+The behavior of adding decorators to a kind has changed in SB5 ([#5781](https://github.com/storybooks/storybook/issues/5781)).
+
+In SB4 it was possible to add decorators to only a subset of the stories of a kind.
+
+```js
+storiesOf('Stories', module)
+  .add('noncentered', () => 'Hello')
+  .addDecorator(centered)
+  .add('centered', () => 'Hello');
+```
+
+The semantics has changed in SB5 so that calling `addDecorator` on a kind adds a decorator to all its stories, no mater the order. So in the previous example, both stories would be centered.
+
+To allow for a subset of the stories in a kind to be decorated, we've added the ability to add decorators to individual stories using parameters:
+
+```js
+storiesOf('Stories', module)
+  .add('noncentered', () => 'Hello')
+  .add('centered', () => 'Hello', { decorators: [centered] });
+```
+
 ## From version 4.0.x to 4.1.x
 
 There are are a few migrations you should be aware of in 4.1, including one unintentionally breaking change for advanced addon usage.

From 586f7620d694edfc0128a08557eef1ef499e375e Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Mon, 4 Mar 2019 10:41:14 +0800
Subject: [PATCH 119/249] Merge pull request #5829 from
 storybooks/5757-restore-viewport

Restore viewport behaviour
---
 MIGRATION.md                                  |  22 +++
 addons/viewport/README.md                     | 152 +++++-------------
 addons/viewport/preview.js                    |   1 -
 addons/viewport/src/Tool.js                   |  27 +++-
 addons/viewport/src/constants.js              |   2 +-
 addons/viewport/src/legacy_preview/index.js   |   4 +-
 .../src/legacy_preview/withViewport.js        |  10 +-
 examples/official-storybook/config.js         |   6 -
 .../official-storybook/extra-viewports.json   |  18 ---
 .../addon-viewport.stories.storyshot          |   8 +
 .../stories/addon-viewport.stories.js         |  59 +++----
 .../__snapshots__/storyshots.test.js.snap     | 146 -----------------
 12 files changed, 124 insertions(+), 331 deletions(-)
 delete mode 100644 examples/official-storybook/extra-viewports.json

diff --git a/MIGRATION.md b/MIGRATION.md
index a1d10779125..e498b9d97e4 100644
--- a/MIGRATION.md
+++ b/MIGRATION.md
@@ -163,6 +163,28 @@ storiesOf('Stories', module)
   .add('centered', () => 'Hello', { decorators: [centered] });
 ```
 
+## Addon viewport uses parameters
+
+Similarly, `@storybook/addon-viewport` uses parameters to pass viewport options. If you previously had:
+
+```js
+import { configureViewport } from `@storybook/addon-viewport`;
+
+configureViewport(options);
+```
+
+You can replace it with:
+
+```js
+import { addParameters } from '@storybook/react'; // or others
+
+addParameters({ viewport: options });
+```
+
+The `withViewport` decorator is also no longer supported and should be replaced with a parameter based API as above. Also the `onViewportChange` callback is no longer supported.
+
+See the [README](https://github.com/storybooks/storybook/blob/master/addons/viewport/README.md) for the viewport addon for more information.
+
 ## From version 4.0.x to 4.1.x
 
 There are are a few migrations you should be aware of in 4.1, including one unintentionally breaking change for advanced addon usage.
diff --git a/addons/viewport/README.md b/addons/viewport/README.md
index 5356c91bcff..5e9273e9b48 100644
--- a/addons/viewport/README.md
+++ b/addons/viewport/README.md
@@ -1,6 +1,6 @@
 # Storybook Viewport Addon
 
-Storybook Viewport Addon allows your stories to be displayed in different sizes and layouts in [Storybook](https://storybook.js.org).  This helps build responsive components inside of Storybook.
+Storybook Viewport Addon allows your stories to be displayed in different sizes and layouts in [Storybook](https://storybook.js.org). This helps build responsive components inside of Storybook.
 
 [Framework Support](https://github.com/storybooks/storybook/blob/master/ADDONS_SUPPORT.md)
 
@@ -28,21 +28,30 @@ import '@storybook/addon-viewport/register';
 
 ## Configuration
 
-Import and use the `configureViewport` function in your `config.js` file.
+The viewport addon is configured by story parameters with the `viewport` key. To configure globally, import `addParameters` from your app layer in your `config.js` file.
 
 ```js
-import { configureViewport } from '@storybook/addon-viewport';
+import { addParameters } from '@storybook/react';
+
+addParameters({ viewport: options });
 ```
 
+Options can take a object with the following keys:
+
 ### defaultViewport : String
-----
+
+---
+
 Setting this property to, let say `iphone6`, will make `iPhone 6` the default device/viewport for all stories. Default is `'responsive'` which fills 100% of the preview area.
 
 ### viewports : Object
-----
+
+---
+
 A key-value pair of viewport's key and properties (see `Viewport` definition below) for all viewports to be displayed. Default is [`INITIAL_VIEWPORTS`](src/shared/index.js)
 
 #### Viewport Model
+
 ```js
 {
   /**
@@ -70,154 +79,81 @@ A key-value pair of viewport's key and properties (see `Viewport` definition bel
 }
 ```
 
-## Decorators
+## Configuring per component or story
 
-Sometimes you want to show collection of mobile stories, and you know those stories look horible on desktop (`responsive`), so you think you need to change the default viewport only for those?
+Parameters can be configured for a whole set of stories or a single story via the standard parameter API:
 
-Here is the answer, with `withViewport` decorator, you can change the default viewport of single, multiple, or all stories.
-
-`withViewport` accepts either
-* A `String`, which represents the default viewport, or
-* An `Object`, which looks like
 ```js
-{
-  name: 'iphone6', // default viewport
-  onViewportChange({ viewport }) { // called whenever different viewport is selected from the dropdown
+import addStories from '@storybook/react';
 
-  }
-}
+addStories('Stories', module)
+  // To set a default viewport for all the stories for this component
+  .addParameters({ viewport: { defaultViewport: 'iphone6' }})
+  .add('story', () => </>, { viewport: 'iphonex' });
 ```
 
 ## Examples
 
-### Basic Usage
-
-Simply import the Storybook Viewport Addon in the `addons.js` file in your `.storybook` directory.
-
-```js
-import '@storybook/addon-viewport/register'
-```
-
-This will register the Viewport Addon to Storybook and will show up in the action area.
-
-
 ### Use Custom Set of Devices
 
-This will replace all previous devices with `Kindle Fire 2` and `Kindle Fire HD` by simply calling `configureViewport` with the two devices as `viewports` in `config.js` file in your `.storybook` directory.
+This will replace all previous devices with `Kindle Fire 2` and `Kindle Fire HD` by simply calling `addParameters` with the two devices as `viewports` in `config.js` file in your `.storybook` directory.
 
 ```js
-import { configureViewport } from '@storybook/addon-viewport';
+import { addParameters } from '@storybook/react';
 
 const newViewports = {
   kindleFire2: {
     name: 'Kindle Fire 2',
     styles: {
       width: '600px',
-      height: '963px'
-    }
+      height: '963px',
+    },
   },
   kindleFireHD: {
     name: 'Kindle Fire HD',
     styles: {
       width: '533px',
-      height: '801px'
-    }
-  }
+      height: '801px',
+    },
+  },
 };
 
-configureViewport({
-  viewports: newViewports
+addParameters({
+  viewport: { viewports: newViewports },
 });
 ```
 
-
 ### Add New Device
 
 This will add both `Kindle Fire 2` and `Kindle Fire HD` to the list of devices. This is acheived by making use of the exported [`INITIAL_VIEWPORTS`](src/shared/index.js) property, by merging it with the new viewports and pass the result as `viewports` to `configureViewport` function
 
 ```js
-import { configureViewport, INITIAL_VIEWPORTS } from '@storybook/addon-viewport';
+import { addParameters } from '@storybook/react';
+import { INITIAL_VIEWPORTS } from '@storybook/addon-viewport';
 
 const newViewports = {
   kindleFire2: {
     name: 'Kindle Fire 2',
     styles: {
       width: '600px',
-      height: '963px'
-    }
+      height: '963px',
+    },
   },
   kindleFireHD: {
     name: 'Kindle Fire HD',
     styles: {
       width: '533px',
-      height: '801px'
-    }
-  }
+      height: '801px',
+    },
+  },
 };
 
-configureViewport({
-  viewports: {
-    ...INITIAL_VIEWPORTS,
-    ...newViewports
-  }
+addParameters({
+  viewport: {
+    viewports: {
+      ...INITIAL_VIEWPORTS,
+      ...newViewports,
+    },
+  },
 });
 ```
-
-
-### Change The Default Viewport
-
-This will make `iPhone 6` the default viewport for all stories.
-
-```js
-import { configureViewport } from '@storybook/addon-viewport';
-
-configureViewport({
-  defaultViewport: 'iphone6'
-});
-```
-
-## withViewport Decorator
-
-Change the default viewport for single/multiple/global stories, or listen to viewport selection changes
-
-```js
-import React from 'react';
-import { storiesOf, addDecorator } from '@storybook/react';
-import { withViewport } from '@storybook/addon-viewport';
-
-// Globablly
-addDecorator(withViewport('iphone5'));
-
-// Collection
-storiesOf('Decorator with string', module)
-  .addDecorator(withViewport('iphone6'))
-  .add('iPhone 6', () => (
-    <h1>
-      Do I look good on <b>iPhone 6</b>?
-    </h1>
-  ));
-
-// Single
-storiesOf('Parameterized story', module)
-  .addDecorator(withViewport())
-  .add(
-    'iPad',
-    () => (
-      <h1>
-        Do I look good on <b>iPad</b>?
-      </h1>
-    ),
-    { viewport: 'ipad' }
-  );
-
-storiesOf('Decorator with object', module)
-  .addDecorator(
-    withViewport({
-      onViewportChange({ viewport }) {
-        console.log(`Viewport changed: ${viewport.name} (${viewport.type})`); // e.g. Viewport changed: iphone6 (mobile)
-      },
-    })
-  )
-  .add('onViewportChange', () => <MobileFirstComponent />);
-
-```
diff --git a/addons/viewport/preview.js b/addons/viewport/preview.js
index 0c0f6c62539..aea18c08354 100644
--- a/addons/viewport/preview.js
+++ b/addons/viewport/preview.js
@@ -4,4 +4,3 @@ exports.configureViewport = preview.configureViewport;
 exports.DEFAULT_VIEWPORT = preview.DEFAULT_VIEWPORT;
 exports.INITIAL_VIEWPORTS = preview.INITIAL_VIEWPORTS;
 exports.withViewport = preview.withViewport;
-exports.Viewport = preview.Viewport;
diff --git a/addons/viewport/src/Tool.js b/addons/viewport/src/Tool.js
index 3e986d455d1..2c4390838f1 100644
--- a/addons/viewport/src/Tool.js
+++ b/addons/viewport/src/Tool.js
@@ -1,6 +1,7 @@
 import React, { Component, Fragment } from 'react';
 import PropTypes from 'prop-types';
 import memoize from 'memoizerific';
+import deprecate from 'util-deprecate';
 
 import { Global } from '@storybook/theming';
 
@@ -8,6 +9,7 @@ import { Icons, IconButton, WithTooltip, TooltipLinkList } from '@storybook/comp
 import { SET_STORIES } from '@storybook/core-events';
 
 import { PARAM_KEY } from './constants';
+import { INITIAL_VIEWPORTS, DEFAULT_VIEWPORT } from './defaults';
 
 const toList = memoize(50)(items =>
   items ? Object.entries(items).map(([id, value]) => ({ ...value, id })) : []
@@ -26,14 +28,35 @@ const createItem = memoize(1000)((id, name, value, change) => ({
 
 const flip = ({ width, height }) => ({ height: width, width: height });
 
+const deprecatedViewportString = deprecate(
+  () => 0,
+  'The viewport parameter must be an object with keys `viewports` and `defaultViewport`'
+);
+const deprecateOnViewportChange = deprecate(
+  () => 0,
+  'The viewport parameter `onViewportChange` is no longer supported'
+);
+
 const getState = memoize(10)((props, state, change) => {
   const data = props.api.getCurrentStoryData();
-  const list = toList(data && data.parameters && data.parameters[PARAM_KEY]);
+  const parameters = data && data.parameters && data.parameters[PARAM_KEY];
+
+  if (parameters && typeof parameters !== 'object') {
+    deprecatedViewportString();
+  }
+
+  const { disable, viewports, defaultViewport, onViewportChange } = parameters || {};
+
+  if (onViewportChange) {
+    deprecateOnViewportChange();
+  }
+
+  const list = disable ? [] : toList(viewports || INITIAL_VIEWPORTS);
 
   const selected =
     state.selected === 'responsive' || list.find(i => i.id === state.selected)
       ? state.selected
-      : list.find(i => i.default) || 'responsive';
+      : list.find(i => i.default) || defaultViewport || DEFAULT_VIEWPORT;
 
   const resets =
     selected !== 'responsive'
diff --git a/addons/viewport/src/constants.js b/addons/viewport/src/constants.js
index 90beefe690d..1a9e8f7376b 100644
--- a/addons/viewport/src/constants.js
+++ b/addons/viewport/src/constants.js
@@ -1,5 +1,5 @@
 export const ADDON_ID = 'storybook/viewport';
-export const PARAM_KEY = 'viewports';
+export const PARAM_KEY = 'viewport';
 
 export default {
   UPDATE: `${ADDON_ID}/update`,
diff --git a/addons/viewport/src/legacy_preview/index.js b/addons/viewport/src/legacy_preview/index.js
index 9a4af3066d5..7bb7c3ef5fc 100644
--- a/addons/viewport/src/legacy_preview/index.js
+++ b/addons/viewport/src/legacy_preview/index.js
@@ -1,7 +1,7 @@
 import deprecate from 'util-deprecate';
 
 export { INITIAL_VIEWPORTS, DEFAULT_VIEWPORT } from '../defaults';
-export { default as withViewport, Viewport } from './withViewport';
+export { default as withViewport } from './withViewport';
 
 export const configureViewport = deprecate(() => {},
-'usage is deprecated, use .addParameters({ viewport }) instead');
+'configureViewport is no longer supported, use .addParameters({ viewport }) instead');
diff --git a/addons/viewport/src/legacy_preview/withViewport.js b/addons/viewport/src/legacy_preview/withViewport.js
index 5cdb169ca31..f1f6ca2a6f9 100644
--- a/addons/viewport/src/legacy_preview/withViewport.js
+++ b/addons/viewport/src/legacy_preview/withViewport.js
@@ -3,17 +3,11 @@ import deprecate from 'util-deprecate';
 
 const withViewport = makeDecorator({
   name: 'withViewport',
-  parameterName: 'viewports',
-  allowDeprecatedUsage: true,
+  parameterName: 'viewport',
   wrapper: deprecate(
     (getStory, context) => getStory(context),
-    'usage is deprecated, use .addParameters({ viewport }) instead'
+    'withViewport is no longer supported, use .addParameters({ viewport }) instead'
   ),
 });
 
 export default withViewport;
-
-export const Viewport = deprecate(
-  ({ children }) => children,
-  `<Viewport> usage is deprecated, use .addParameters({ viewport }) instead`
-);
diff --git a/examples/official-storybook/config.js b/examples/official-storybook/config.js
index 51db2828b8b..cfebccad259 100644
--- a/examples/official-storybook/config.js
+++ b/examples/official-storybook/config.js
@@ -2,7 +2,6 @@ import React from 'react';
 import { storiesOf, configure, addDecorator, addParameters } from '@storybook/react';
 import { Global, ThemeProvider, themes, createGlobal } from '@storybook/theming';
 
-import { INITIAL_VIEWPORTS } from '@storybook/addon-viewport';
 import { withCssResources } from '@storybook/addon-cssresources';
 import { withA11Y } from '@storybook/addon-a11y';
 import { withNotes } from '@storybook/addon-notes';
@@ -10,7 +9,6 @@ import { withNotes } from '@storybook/addon-notes';
 import 'storybook-chromatic';
 
 import addHeadWarning from './head-warning';
-import extraViewports from './extra-viewports.json';
 
 if (process.env.NODE_ENV === 'development') {
   if (!process.env.DOTENV_DEVELOPMENT_DISPLAY_WARNING) {
@@ -52,10 +50,6 @@ addParameters({
     hierarchySeparator: /\/|\./,
     hierarchyRootSeparator: '|',
   },
-  viewports: {
-    ...INITIAL_VIEWPORTS,
-    ...extraViewports,
-  },
   backgrounds: [
     { name: 'storybook app', value: themes.normal.background.app, default: true },
     { name: 'light', value: '#eeeeee' },
diff --git a/examples/official-storybook/extra-viewports.json b/examples/official-storybook/extra-viewports.json
deleted file mode 100644
index 4d688518385..00000000000
--- a/examples/official-storybook/extra-viewports.json
+++ /dev/null
@@ -1,18 +0,0 @@
-{
-  "kindleFire2": {
-    "name": "Kindle Fire 2",
-    "styles": {
-      "width": "600px",
-      "height": "963px"
-    },
-    "type": "tablet"
-  },
-  "kindleFireHD": {
-    "name": "Kindle Fire HD",
-    "styles": {
-      "width": "533px",
-      "height": "801px"
-    },
-    "type": "tablet"
-  }
-}
diff --git a/examples/official-storybook/stories/__snapshots__/addon-viewport.stories.storyshot b/examples/official-storybook/stories/__snapshots__/addon-viewport.stories.storyshot
index a9645fbf615..9fcc118a9b6 100644
--- a/examples/official-storybook/stories/__snapshots__/addon-viewport.stories.storyshot
+++ b/examples/official-storybook/stories/__snapshots__/addon-viewport.stories.storyshot
@@ -8,6 +8,14 @@ exports[`Storyshots Addons|Viewport default 1`] = `
 </div>
 `;
 
+exports[`Storyshots Addons|Viewport.Custom Default (Kindle Fire 2) Disabled 1`] = `
+<div
+  class="emotion-0"
+>
+  There should be no viewport selector in the toolbar
+</div>
+`;
+
 exports[`Storyshots Addons|Viewport.Custom Default (Kindle Fire 2) Inherited 1`] = `
 <div
   class="emotion-0"
diff --git a/examples/official-storybook/stories/addon-viewport.stories.js b/examples/official-storybook/stories/addon-viewport.stories.js
index 7276ee4eaa8..98776463238 100644
--- a/examples/official-storybook/stories/addon-viewport.stories.js
+++ b/examples/official-storybook/stories/addon-viewport.stories.js
@@ -3,10 +3,7 @@ import { storiesOf } from '@storybook/react';
 
 import { styled } from '@storybook/theming';
 
-// import { Viewport, withViewport } from '@storybook/addon-viewport';
-// import EventEmitter from 'eventemitter3';
-
-// import Logger from './Logger';
+import { INITIAL_VIEWPORTS } from '@storybook/addon-viewport';
 
 const Panel = styled.div();
 
@@ -15,6 +12,20 @@ storiesOf('Addons|Viewport', module).add('default', () => (
 ));
 
 storiesOf('Addons|Viewport.Custom Default (Kindle Fire 2)', module)
+  .addParameters({
+    viewport: {
+      viewports: {
+        ...INITIAL_VIEWPORTS,
+        kindleFire2: {
+          name: 'Kindle Fire 2',
+          styles: {
+            width: '600px',
+            height: '963px',
+          },
+        },
+      },
+    },
+  })
   .add('Inherited', () => (
     <Panel>
       I've inherited <b>Kindle Fire 2</b> viewport from my parent.
@@ -27,38 +38,8 @@ storiesOf('Addons|Viewport.Custom Default (Kindle Fire 2)', module)
         I respect my parents but I should be looking good on <b>iPad</b>.
       </Panel>
     ),
-    { viewports: [] }
-  );
-
-// const emitter = new EventEmitter();
-
-// storiesOf('Addons|Viewport.withViewport', module)
-//   .addDecorator(
-//     withViewport({
-//       onViewportChange({ viewport }) {
-//         emitter.emit(Logger.LOG_EVENT, {
-//           name: 'Viewport Changed',
-//           payload: `${viewport.name} (${viewport.type})`,
-//         });
-//       },
-//     })
-//   )
-//   .add('onViewportChange', () => <Logger title="Select device/viewport" emitter={emitter} />);
-
-// storiesOf('Addons|Viewport.deprecated', module)
-//   .addDecorator(withViewport('kindleFire2'))
-//   .add(
-//     'Overridden via "withViewport" decorator',
-//     withViewport('iphone6')(() => (
-//       <Panel>
-//         I respect my parents but I should be looking good on <b>iPhone 6</b>.
-//       </Panel>
-//     ))
-//   )
-//   .add('Overridden via "Viewport" component', () => (
-//     <Viewport name="iphone6p">
-//       <Panel>
-//         I respect my parents but I should be looking good on <b>iPhone 6 Plus</b>.
-//       </Panel>
-//     </Viewport>
-//   ));
+    { viewport: { defaultViewport: 'ipad' } }
+  )
+  .add('Disabled', () => <Panel>There should be no viewport selector in the toolbar</Panel>, {
+    viewport: { disable: true },
+  });
diff --git a/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap b/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
index 5e5b364366f..872ce1e1055 100644
--- a/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
+++ b/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
@@ -2666,152 +2666,6 @@ exports[`Storyshots Core|Parameters passed to story 1`] = `
       "restoreScroll": true
     }
   },
-  "viewports": {
-    "iphone5": {
-      "name": "iPhone 5",
-      "styles": {
-        "height": "568px",
-        "width": "320px"
-      },
-      "type": "mobile"
-    },
-    "iphone6": {
-      "name": "iPhone 6",
-      "styles": {
-        "height": "667px",
-        "width": "375px"
-      },
-      "type": "mobile"
-    },
-    "iphone6p": {
-      "name": "iPhone 6 Plus",
-      "styles": {
-        "height": "736px",
-        "width": "414px"
-      },
-      "type": "mobile"
-    },
-    "iphone8p": {
-      "name": "iPhone 8 Plus",
-      "styles": {
-        "height": "736px",
-        "width": "414px"
-      },
-      "type": "mobile"
-    },
-    "iphonex": {
-      "name": "iPhone X",
-      "styles": {
-        "height": "812px",
-        "width": "375px"
-      },
-      "type": "mobile"
-    },
-    "iphonexr": {
-      "name": "iPhone XR",
-      "styles": {
-        "height": "896px",
-        "width": "414px"
-      },
-      "type": "mobile"
-    },
-    "iphonexsmax": {
-      "name": "iPhone XS Max",
-      "styles": {
-        "height": "896px",
-        "width": "414px"
-      },
-      "type": "mobile"
-    },
-    "ipad": {
-      "name": "iPad",
-      "styles": {
-        "height": "1024px",
-        "width": "768px"
-      },
-      "type": "tablet"
-    },
-    "ipad10p": {
-      "name": "iPad Pro 10.5-in",
-      "styles": {
-        "height": "1112px",
-        "width": "834px"
-      },
-      "type": "tablet"
-    },
-    "ipad12p": {
-      "name": "iPad Pro 12.9-in",
-      "styles": {
-        "height": "1366px",
-        "width": "1024px"
-      },
-      "type": "tablet"
-    },
-    "galaxys5": {
-      "name": "Galaxy S5",
-      "styles": {
-        "height": "640px",
-        "width": "360px"
-      },
-      "type": "mobile"
-    },
-    "galaxys9": {
-      "name": "Galaxy S9",
-      "styles": {
-        "height": "1480px",
-        "width": "720px"
-      },
-      "type": "mobile"
-    },
-    "nexus5x": {
-      "name": "Nexus 5X",
-      "styles": {
-        "height": "660px",
-        "width": "412px"
-      },
-      "type": "mobile"
-    },
-    "nexus6p": {
-      "name": "Nexus 6P",
-      "styles": {
-        "height": "732px",
-        "width": "412px"
-      },
-      "type": "mobile"
-    },
-    "pixel": {
-      "name": "Pixel",
-      "styles": {
-        "height": "960px",
-        "width": "540px"
-      },
-      "type": "mobile"
-    },
-    "pixelxl": {
-      "name": "Pixel XL",
-      "styles": {
-        "height": "1280px",
-        "width": "720px"
-      },
-      "type": "mobile"
-    },
-    "kindleFire2": {
-      "name": "Kindle Fire 2",
-      "styles": {
-        "width": "600px",
-        "height": "963px"
-      },
-      "type": "tablet"
-    },
-    "kindleFireHD": {
-      "name": "Kindle Fire HD",
-      "styles": {
-        "width": "533px",
-        "height": "801px"
-      },
-      "type": "tablet"
-    }
-  },
   "backgrounds": [
     {
       "name": "storybook app",

From bceef46fc3a5401e2206215d9ef53a977966b4d2 Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Mon, 4 Mar 2019 10:51:57 +0800
Subject: [PATCH 120/249] Merge pull request #5828 from
 storybooks/5818-cleanup-backgrounds

REMOVE previously deprecated default export from backgrounds
---
 MIGRATION.md                         | 31 +++++++++++++++---
 addons/backgrounds/mithril.js        |  1 -
 addons/backgrounds/src/constants.ts  |  5 ---
 addons/backgrounds/src/deprecated.ts |  8 -----
 addons/backgrounds/src/index.ts      | 49 +++++++---------------------
 addons/backgrounds/vue.js            |  1 -
 6 files changed, 39 insertions(+), 56 deletions(-)
 delete mode 100644 addons/backgrounds/mithril.js
 delete mode 100644 addons/backgrounds/src/deprecated.ts
 delete mode 100644 addons/backgrounds/vue.js

diff --git a/MIGRATION.md b/MIGRATION.md
index e498b9d97e4..195e6058194 100644
--- a/MIGRATION.md
+++ b/MIGRATION.md
@@ -5,6 +5,8 @@
   - [Story hierarchy defaults](#story-hierarchy-defaults)
   - [Options addon deprecated](#options-addon-deprecated)
   - [Individual story decorators](#individual-story-decorators)
+  - [Addon backgrounds uses parameters](#addon-backgrounds-uses-parameters)
+  - [Addon viewport uses parameters](#addon-backgrounds-uses-parameters)
 - [From version 4.0.x to 4.1.x](#from-version-40x-to-41x)
   - [Private addon config](#private-addon-config)
   - [React 15.x](#react-15x)
@@ -163,6 +165,25 @@ storiesOf('Stories', module)
   .add('centered', () => 'Hello', { decorators: [centered] });
 ```
 
+## Addon backgrounds uses parameters
+
+Similarly, `@storybook/addon-backgrounds` uses parameters to pass background options. If you previously had:
+
+```js
+import { withBackgrounds } from `@storybook/addon-backgrounds`;
+
+storiesOf('Stories', module)
+  .addDecorator(withBackgrounds(options));
+```
+
+You should replace it with:
+
+```js
+storiesOf('Stories', module).addParameters({ backgrounds: options });
+```
+
+You can pass `backgrounds` parameters at the global level (via `addParameters` imported from `@storybook/react` et al.), and the story level (via the third argument to `.add()`).
+
 ## Addon viewport uses parameters
 
 Similarly, `@storybook/addon-viewport` uses parameters to pass viewport options. If you previously had:
@@ -173,7 +194,7 @@ import { configureViewport } from `@storybook/addon-viewport`;
 configureViewport(options);
 ```
 
-You can replace it with:
+You should replace it with:
 
 ```js
 import { addParameters } from '@storybook/react'; // or others
@@ -214,17 +235,19 @@ However, if you're developing React components, this means you need to upgrade t
 Also, here's the error you'll get if you're running an older version of React:
 
 ```
+
 core.browser.esm.js:15 Uncaught TypeError: Object(...) is not a function
   at Module../node_modules/@emotion/core/dist/core.browser.esm.js (core.browser.esm.js:15)
-  at **webpack_require** (bootstrap:724)
+  at __webpack_require__ (bootstrap:724)
   at fn (bootstrap:101)
   at Module../node_modules/@emotion/styled-base/dist/styled-base.browser.esm.js (styled-base.browser.esm.js:1)
-  at **webpack_require** (bootstrap:724)
+  at __webpack_require__ (bootstrap:724)
   at fn (bootstrap:101)
   at Module../node_modules/@emotion/styled/dist/styled.esm.js (styled.esm.js:1)
-  at **webpack_require** (bootstrap:724)
+  at __webpack_require__ (bootstrap:724)
   at fn (bootstrap:101)
   at Object../node_modules/@storybook/components/dist/navigation/MenuLink.js (MenuLink.js:12)
+
 ```
 
 ### Generic addons
diff --git a/addons/backgrounds/mithril.js b/addons/backgrounds/mithril.js
deleted file mode 100644
index c22c26b6732..00000000000
--- a/addons/backgrounds/mithril.js
+++ /dev/null
@@ -1 +0,0 @@
-module.exports = require('./dist/deprecated');
diff --git a/addons/backgrounds/src/constants.ts b/addons/backgrounds/src/constants.ts
index df63c53889d..503f310a6f5 100644
--- a/addons/backgrounds/src/constants.ts
+++ b/addons/backgrounds/src/constants.ts
@@ -1,7 +1,2 @@
 export const ADDON_ID = 'storybook/background';
 export const PARAM_KEY = 'backgrounds';
-
-export const EVENTS = {
-  SET: `${ADDON_ID}:set`,
-  UNSET: `${ADDON_ID}:unset`,
-};
diff --git a/addons/backgrounds/src/deprecated.ts b/addons/backgrounds/src/deprecated.ts
deleted file mode 100644
index f03a1a29018..00000000000
--- a/addons/backgrounds/src/deprecated.ts
+++ /dev/null
@@ -1,8 +0,0 @@
-import deprecate from 'util-deprecate';
-
-import backgrounds from '.';
-
-export default deprecate(
-  backgrounds,
-  "addon-backgrounds: framework-specific imports are deprecated, just use `import backgrounds from '@storybook/addon-backgrounds`"
-);
diff --git a/addons/backgrounds/src/index.ts b/addons/backgrounds/src/index.ts
index de5cb59a21f..51e8ff3a9db 100644
--- a/addons/backgrounds/src/index.ts
+++ b/addons/backgrounds/src/index.ts
@@ -1,43 +1,18 @@
-import { addons, makeDecorator, StoryContext, StoryGetter, WrapperSettings } from '@storybook/addons';
+import { makeDecorator, StoryContext, StoryGetter } from '@storybook/addons';
 import deprecate from 'util-deprecate';
 
-import { REGISTER_SUBSCRIPTION } from '@storybook/core-events';
-import { EVENTS } from './constants';
-import { BackgroundConfig } from './models';
-
-let prevBackgrounds: BackgroundConfig[];
-
-const subscription = () => () => {
-  prevBackgrounds = null;
-  addons.getChannel().emit(EVENTS.UNSET);
-};
-
-export const withBackgrounds = makeDecorator({
-  name: 'withBackgrounds',
-  parameterName: 'backgrounds',
-  skipIfNoParametersOrOptions: true,
-  allowDeprecatedUsage: true,
-  wrapper: (getStory: StoryGetter, context: StoryContext, { options, parameters }: WrapperSettings) => {
-    const data = parameters || options || [];
-    const backgrounds = Array.isArray(data) ? data : Object.values(data);
-
-    if (backgrounds.length === 0) {
+// This decorator is kept purely so we produce a decorator that is compatible with both
+// `addDecorator(withBackgrounds(...))` and `addDecorator(withBackgrounds)`
+export const withBackgrounds = deprecate(
+  makeDecorator({
+    name: 'withBackgrounds',
+    parameterName: 'backgrounds',
+    wrapper: (getStory: StoryGetter, context: StoryContext) => {
       return getStory(context);
-    }
-
-    if (prevBackgrounds !== backgrounds) {
-      addons.getChannel().emit(EVENTS.SET, backgrounds);
-      prevBackgrounds = backgrounds;
-    }
-    addons.getChannel().emit(REGISTER_SUBSCRIPTION, subscription);
-
-    return getStory(context);
-  },
-});
-
-export default deprecate(
-  withBackgrounds,
-  'The default export of @storybook/addon-backgrounds is deprecated, please `import { withBackgrounds }` instead'
+    },
+  }),
+  `Note that withBackgrounds(options) has been replaced by addParameters({ backgrounds: options})
+Read more about it in the migration guide: https://github.com/storybooks/storybook/blob/master/MIGRATION.md`
 );
 
 if (module && module.hot && module.hot.decline) {
diff --git a/addons/backgrounds/vue.js b/addons/backgrounds/vue.js
deleted file mode 100644
index c22c26b6732..00000000000
--- a/addons/backgrounds/vue.js
+++ /dev/null
@@ -1 +0,0 @@
-module.exports = require('./dist/deprecated');

From 83bb311ba9bbd14707819f96900ee7fe7d79e8fb Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Mon, 4 Mar 2019 11:07:54 +0800
Subject: [PATCH 121/249] 5.0.0-rc.10 changelog

---
 CHANGELOG.md | 7 +++++++
 1 file changed, 7 insertions(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index b36717aa426..51293471bbe 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,10 @@
+## 5.0.0-rc.10 (March 4, 2019)
+
+### Bug Fixes
+
+* Addon-viewports: Restore v4 behaviour ([#5829](https://github.com/storybooks/storybook/pull/5829))
+* Addon-backgrounds: REMOVE previously deprecated default export ([#5828](https://github.com/storybooks/storybook/pull/5828))
+
 ## 5.0.0-rc.9 (March 3, 2019)
 
 ### Features

From b5451c69ffc56556fcfa18bd2adb3f39f034b358 Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Mon, 4 Mar 2019 14:19:50 +0800
Subject: [PATCH 122/249] Merge pull request #5833 from
 storybooks/5832-a11y-migration

Cleanup & document a11y migration
---
 MIGRATION.md                                  | 49 ++++++++++++++-----
 addons/a11y/README.md                         | 10 ++--
 addons/a11y/src/index.js                      | 34 ++++++-------
 .../stories/addon-a11y.stories.js             |  4 +-
 examples/official-storybook/config.js         |  4 +-
 .../addon-a11y.stories.storyshot              |  6 +++
 .../stories/addon-a11y.stories.js             |  9 ++++
 7 files changed, 76 insertions(+), 40 deletions(-)

diff --git a/MIGRATION.md b/MIGRATION.md
index 195e6058194..5bb3baba152 100644
--- a/MIGRATION.md
+++ b/MIGRATION.md
@@ -6,7 +6,8 @@
   - [Options addon deprecated](#options-addon-deprecated)
   - [Individual story decorators](#individual-story-decorators)
   - [Addon backgrounds uses parameters](#addon-backgrounds-uses-parameters)
-  - [Addon viewport uses parameters](#addon-backgrounds-uses-parameters)
+  - [Addon viewport uses parameters](#addon-viewport-uses-parameters)
+  - [Addon a11y uses parameters](#addon-a11y-uses-parameters-decorator-renamed)
 - [From version 4.0.x to 4.1.x](#from-version-40x-to-41x)
   - [Private addon config](#private-addon-config)
   - [React 15.x](#react-15x)
@@ -204,7 +205,31 @@ addParameters({ viewport: options });
 
 The `withViewport` decorator is also no longer supported and should be replaced with a parameter based API as above. Also the `onViewportChange` callback is no longer supported.
 
-See the [README](https://github.com/storybooks/storybook/blob/master/addons/viewport/README.md) for the viewport addon for more information.
+See the [viewport addon README](https://github.com/storybooks/storybook/blob/master/addons/viewport/README.md) for more information.
+
+## Addon a11y uses parameters, decorator renamed
+
+Similarly, `@storybook/addon-a11y` uses parameters to pass a11y options. If you previously had:
+
+```js
+import { configureA11y } from `@storybook/addon-a11y`;
+
+configureA11y(options);
+```
+
+You should replace it with:
+
+```js
+import { addParameters } from '@storybook/react'; // or others
+
+addParameters({ a11y: options });
+```
+
+You can also pass `a11y` parameters at the component level (via `storiesOf(...).addParameters`), and the story level (via the third argument to `.add()`).
+
+Furthermore, the decorator `checkA11y` has been deprecated and renamed to `withA11y` to make it consistent with other Storybook decorators.
+
+See the [a11y addon README](https://github.com/storybooks/storybook/blob/master/addons/a11y/README.md) for more information.
 
 ## From version 4.0.x to 4.1.x
 
@@ -237,16 +262,16 @@ Also, here's the error you'll get if you're running an older version of React:
 ```
 
 core.browser.esm.js:15 Uncaught TypeError: Object(...) is not a function
-  at Module../node_modules/@emotion/core/dist/core.browser.esm.js (core.browser.esm.js:15)
-  at __webpack_require__ (bootstrap:724)
-  at fn (bootstrap:101)
-  at Module../node_modules/@emotion/styled-base/dist/styled-base.browser.esm.js (styled-base.browser.esm.js:1)
-  at __webpack_require__ (bootstrap:724)
-  at fn (bootstrap:101)
-  at Module../node_modules/@emotion/styled/dist/styled.esm.js (styled.esm.js:1)
-  at __webpack_require__ (bootstrap:724)
-  at fn (bootstrap:101)
-  at Object../node_modules/@storybook/components/dist/navigation/MenuLink.js (MenuLink.js:12)
+at Module../node_modules/@emotion/core/dist/core.browser.esm.js (core.browser.esm.js:15)
+at **webpack_require** (bootstrap:724)
+at fn (bootstrap:101)
+at Module../node_modules/@emotion/styled-base/dist/styled-base.browser.esm.js (styled-base.browser.esm.js:1)
+at **webpack_require** (bootstrap:724)
+at fn (bootstrap:101)
+at Module../node_modules/@emotion/styled/dist/styled.esm.js (styled.esm.js:1)
+at **webpack_require** (bootstrap:724)
+at fn (bootstrap:101)
+at Object../node_modules/@storybook/components/dist/navigation/MenuLink.js (MenuLink.js:12)
 
 ```
 
diff --git a/addons/a11y/README.md b/addons/a11y/README.md
index ea4ce8e1c8a..04f3f809819 100755
--- a/addons/a11y/README.md
+++ b/addons/a11y/README.md
@@ -20,16 +20,16 @@ Add this line to your `addons.js` file (create this file inside your storybook c
 import '@storybook/addon-a11y/register';
 ```
 
-import the `withA11Y` decorator to check your stories for violations within your components.
+import the `withA11y` decorator to check your stories for violations within your components.
 
 ```js
 import React from 'react';
 import { storiesOf } from '@storybook/react';
-import { withA11Y } from '@storybook/addon-a11y';
+import { withA11y } from '@storybook/addon-a11y';
 
 // should only be added once
 // best place is in config.js
-addDecorator(withA11Y)
+addDecorator(withA11y)
 
 storiesOf('button', module)
   .add('Accessible', () => (
@@ -51,9 +51,9 @@ You can override these options at story level too.
 import React from 'react';
 import { storiesOf, addDecorator, addParameters } from '@storybook/react';
 
-import { withA11Y } from '@storybook/addon-a11y';
+import { withA11y } from '@storybook/addon-a11y';
 
-addDecorator(withA11Y)
+addDecorator(withA11y)
 addParameters({
   a11y: {
     // ... axe options
diff --git a/addons/a11y/src/index.js b/addons/a11y/src/index.js
index dd18397d73d..da104099d00 100644
--- a/addons/a11y/src/index.js
+++ b/addons/a11y/src/index.js
@@ -3,7 +3,7 @@ import axe from 'axe-core';
 import deprecate from 'util-deprecate';
 import { stripIndents } from 'common-tags';
 
-import addons, { makeDecorator } from '@storybook/addons';
+import addons from '@storybook/addons';
 import { STORY_RENDERED } from '@storybook/core-events';
 import EVENTS, { PARAM_KEY } from './constants';
 
@@ -24,16 +24,16 @@ const report = input => {
   channel.emit(EVENTS.RESULT, input);
 };
 
-const run = (c, o) => {
+const run = (config, options) => {
   progress = progress.then(() => {
     axe.reset();
-    if (c) {
-      axe.configure(c);
+    if (config) {
+      axe.configure(config);
     }
     return axe
       .run(
         getElement(),
-        o || {
+        options || {
           restoreScroll: true,
         }
       )
@@ -41,18 +41,14 @@ const run = (c, o) => {
   });
 };
 
-export const withA11Y = makeDecorator({
-  name: 'withA11Y',
-  parameterName: PARAM_KEY,
-  skipIfNoParametersOrOptions: false,
-  allowDeprecatedUsage: false,
-
-  wrapper: (getStory, context, opt) => {
-    setup = opt.parameters || opt.options || {};
-
-    return getStory(context);
-  },
-});
+// NOTE: we should add paramaters to the STORY_RENDERED event and deprecate this
+export const withA11y = (getStory, context) => {
+  const params = context.parameters[PARAM_KEY];
+  if (params) {
+    setup = params;
+  }
+  return getStory(context);
+};
 
 channel.on(STORY_RENDERED, () => run(setup.config, setup.options));
 channel.on(EVENTS.REQUEST, () => run(setup.config, setup.options));
@@ -63,8 +59,8 @@ if (module && module.hot && module.hot.decline) {
 
 // TODO: REMOVE at v6.0.0
 export const checkA11y = deprecate(
-  (...args) => withA11Y(...args),
-  'checkA11y has been replaced with withA11Y'
+  (...args) => withA11y(...args),
+  'checkA11y has been renamed withA11y'
 );
 
 // TODO: REMOVE at v6.0.0
diff --git a/examples/html-kitchen-sink/stories/addon-a11y.stories.js b/examples/html-kitchen-sink/stories/addon-a11y.stories.js
index ec0c5ab2877..d6b2c50319e 100644
--- a/examples/html-kitchen-sink/stories/addon-a11y.stories.js
+++ b/examples/html-kitchen-sink/stories/addon-a11y.stories.js
@@ -1,11 +1,11 @@
 import { document, setTimeout } from 'global';
 import { storiesOf } from '@storybook/html';
-import { withA11Y } from '@storybook/addon-a11y';
+import { withA11y } from '@storybook/addon-a11y';
 
 const text = 'Testing the a11y addon';
 
 storiesOf('Addons|a11y', module)
-  .addDecorator(withA11Y)
+  .addDecorator(withA11y)
   .addParameters({ options: { selectedPanel: 'storybook/a11y/panel' } })
   .add('Default', () => `<button></button>`)
   .add('Label', () => `<button>${text}</button>`)
diff --git a/examples/official-storybook/config.js b/examples/official-storybook/config.js
index cfebccad259..20c4851863b 100644
--- a/examples/official-storybook/config.js
+++ b/examples/official-storybook/config.js
@@ -3,7 +3,7 @@ import { storiesOf, configure, addDecorator, addParameters } from '@storybook/re
 import { Global, ThemeProvider, themes, createGlobal } from '@storybook/theming';
 
 import { withCssResources } from '@storybook/addon-cssresources';
-import { withA11Y } from '@storybook/addon-a11y';
+import { withA11y } from '@storybook/addon-a11y';
 import { withNotes } from '@storybook/addon-notes';
 
 import 'storybook-chromatic';
@@ -28,7 +28,7 @@ addHeadWarning('preview-head-not-loaded', 'Preview head not loaded');
 addHeadWarning('dotenv-file-not-loaded', 'Dotenv file not loaded');
 
 addDecorator(withCssResources);
-addDecorator(withA11Y);
+addDecorator(withA11y);
 addDecorator(withNotes);
 
 addDecorator(storyFn => (
diff --git a/examples/official-storybook/stories/__snapshots__/addon-a11y.stories.storyshot b/examples/official-storybook/stories/__snapshots__/addon-a11y.stories.storyshot
index b8fb54e56eb..4923d4cca68 100644
--- a/examples/official-storybook/stories/__snapshots__/addon-a11y.stories.storyshot
+++ b/examples/official-storybook/stories/__snapshots__/addon-a11y.stories.storyshot
@@ -357,6 +357,12 @@ exports[`Storyshots Addons|A11y/Image Without alt 1`] = `
 />
 `;
 
+exports[`Storyshots Addons|A11y/Image Without alt but unchecked 1`] = `
+<img
+  src="http://placehold.it/350x150"
+/>
+`;
+
 exports[`Storyshots Addons|A11y/Typography Correct 1`] = `
 Array [
   <h1>
diff --git a/examples/official-storybook/stories/addon-a11y.stories.js b/examples/official-storybook/stories/addon-a11y.stories.js
index 2ff7308f8c9..a4717e3ec9e 100644
--- a/examples/official-storybook/stories/addon-a11y.stories.js
+++ b/examples/official-storybook/stories/addon-a11y.stories.js
@@ -56,6 +56,15 @@ storiesOf('Addons|A11y/Image', module)
   .addParameters({ options: { selectedPanel: 'storybook/a11y/panel' } })
   /* eslint-disable jsx-a11y/alt-text */
   .add('Without alt', () => <img src={image} />)
+  .add('Without alt but unchecked', () => <img src={image} />, {
+    a11y: {
+      config: {
+        disableOtherRules: true,
+        rules: [],
+      },
+      options: {},
+    },
+  })
   .add('With alt', () => <img src={image} alt={text} />)
   .add('Presentation', () => <img role="presentation" src={image} />);
 

From 9bf2eb6fa12ca37959fe7b753dd6a11413b8a497 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Mon, 4 Mar 2019 14:23:04 +0800
Subject: [PATCH 123/249] 5.0.0-rc.10 additions

---
 CHANGELOG.md | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 51293471bbe..c681692b1bb 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -3,7 +3,11 @@
 ### Bug Fixes
 
 * Addon-viewports: Restore v4 behaviour ([#5829](https://github.com/storybooks/storybook/pull/5829))
-* Addon-backgrounds: REMOVE previously deprecated default export ([#5828](https://github.com/storybooks/storybook/pull/5828))
+* Addon-backgrounds: Remove previously deprecated default export ([#5828](https://github.com/storybooks/storybook/pull/5828))
+
+### Maintenance
+
+* Addon-a11y: Cleanup and document migration ([#5833](https://github.com/storybooks/storybook/pull/5833))
 
 ## 5.0.0-rc.9 (March 3, 2019)
 

From a464c6b23689223a452bd6fcb9956273d9b56023 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Mon, 4 Mar 2019 14:28:36 +0800
Subject: [PATCH 124/249] v5.0.0-rc.10

---
 addons/a11y/package.json                      | 12 ++---
 addons/actions/package.json                   | 10 ++--
 addons/backgrounds/package.json               | 12 ++---
 addons/centered/package.json                  |  2 +-
 addons/cssresources/package.json              | 10 ++--
 addons/events/package.json                    |  8 +--
 addons/google-analytics/package.json          |  6 +--
 addons/graphql/package.json                   |  2 +-
 addons/info/package.json                      | 10 ++--
 addons/jest/package.json                      | 10 ++--
 addons/knobs/package.json                     | 10 ++--
 addons/links/package.json                     |  6 +--
 addons/notes/package.json                     | 12 ++---
 addons/ondevice-backgrounds/package.json      |  4 +-
 addons/ondevice-knobs/package.json            |  4 +-
 addons/ondevice-notes/package.json            |  4 +-
 addons/options/package.json                   |  4 +-
 .../storyshots/storyshots-core/package.json   |  4 +-
 .../storyshots-puppeteer/package.json         |  6 +--
 addons/storysource/package.json               | 10 ++--
 addons/viewport/package.json                  | 12 ++---
 app/angular/package.json                      |  6 +--
 app/ember/package.json                        |  4 +-
 app/html/package.json                         |  4 +-
 app/marko/package.json                        |  4 +-
 app/mithril/package.json                      |  4 +-
 app/polymer/package.json                      |  4 +-
 app/preact/package.json                       |  4 +-
 app/react-native/package.json                 | 14 ++---
 app/react/package.json                        |  8 +--
 app/riot/package.json                         |  4 +-
 app/svelte/package.json                       |  4 +-
 app/vue/package.json                          |  4 +-
 examples/angular-cli/package.json             | 26 ++++-----
 examples/cra-kitchen-sink/package.json        | 32 +++++------
 examples/cra-ts-kitchen-sink/package.json     | 12 ++---
 examples/ember-cli/package.json               | 26 ++++-----
 examples/html-kitchen-sink/package.json       | 36 ++++++-------
 examples/marko-cli/package.json               | 14 ++---
 examples/mithril-kitchen-sink/package.json    | 26 ++++-----
 examples/official-storybook/package.json      | 48 ++++++++---------
 examples/polymer-cli/package.json             | 20 +++----
 examples/preact-kitchen-sink/package.json     | 26 ++++-----
 examples/riot-kitchen-sink/package.json       | 26 ++++-----
 examples/svelte-kitchen-sink/package.json     | 26 ++++-----
 examples/vue-kitchen-sink/package.json        | 26 ++++-----
 lerna.json                                    |  2 +-
 lib/addons/package.json                       |  6 +--
 lib/channel-postmessage/package.json          |  6 +--
 lib/channel-websocket/package.json            |  4 +-
 lib/channels/package.json                     |  2 +-
 lib/cli/package.json                          | 54 +++++++++----------
 lib/client-api/package.json                   | 10 ++--
 lib/client-logger/package.json                |  2 +-
 lib/codemod/package.json                      |  2 +-
 lib/components/package.json                   | 12 ++---
 lib/core-events/package.json                  |  2 +-
 lib/core/package.json                         | 20 +++----
 lib/node-logger/package.json                  |  2 +-
 lib/router/package.json                       |  4 +-
 lib/theming/package.json                      |  4 +-
 lib/ui/package.json                           | 14 ++---
 62 files changed, 356 insertions(+), 356 deletions(-)

diff --git a/addons/a11y/package.json b/addons/a11y/package.json
index 89b087d8827..1a39cf441c4 100644
--- a/addons/a11y/package.json
+++ b/addons/a11y/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-a11y",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "a11y addon for storybook",
   "keywords": [
     "a11y",
@@ -25,11 +25,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.9",
-    "@storybook/client-logger": "5.0.0-rc.9",
-    "@storybook/components": "5.0.0-rc.9",
-    "@storybook/core-events": "5.0.0-rc.9",
-    "@storybook/theming": "5.0.0-rc.9",
+    "@storybook/addons": "5.0.0-rc.10",
+    "@storybook/client-logger": "5.0.0-rc.10",
+    "@storybook/components": "5.0.0-rc.10",
+    "@storybook/core-events": "5.0.0-rc.10",
+    "@storybook/theming": "5.0.0-rc.10",
     "axe-core": "^3.1.2",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
diff --git a/addons/actions/package.json b/addons/actions/package.json
index b6cd752b91f..93d295575ba 100644
--- a/addons/actions/package.json
+++ b/addons/actions/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-actions",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "Action Logger addon for storybook",
   "keywords": [
     "storybook"
@@ -20,10 +20,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.9",
-    "@storybook/components": "5.0.0-rc.9",
-    "@storybook/core-events": "5.0.0-rc.9",
-    "@storybook/theming": "5.0.0-rc.9",
+    "@storybook/addons": "5.0.0-rc.10",
+    "@storybook/components": "5.0.0-rc.10",
+    "@storybook/core-events": "5.0.0-rc.10",
+    "@storybook/theming": "5.0.0-rc.10",
     "core-js": "^2.6.2",
     "fast-deep-equal": "^2.0.1",
     "global": "^4.3.2",
diff --git a/addons/backgrounds/package.json b/addons/backgrounds/package.json
index 07faf0d96c8..d8bace1961a 100644
--- a/addons/backgrounds/package.json
+++ b/addons/backgrounds/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-backgrounds",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "A storybook addon to show different backgrounds for your preview",
   "keywords": [
     "addon",
@@ -24,11 +24,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.9",
-    "@storybook/client-logger": "5.0.0-rc.9",
-    "@storybook/components": "5.0.0-rc.9",
-    "@storybook/core-events": "5.0.0-rc.9",
-    "@storybook/theming": "5.0.0-rc.9",
+    "@storybook/addons": "5.0.0-rc.10",
+    "@storybook/client-logger": "5.0.0-rc.10",
+    "@storybook/components": "5.0.0-rc.10",
+    "@storybook/core-events": "5.0.0-rc.10",
+    "@storybook/theming": "5.0.0-rc.10",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
diff --git a/addons/centered/package.json b/addons/centered/package.json
index 73171d73a5e..1788548fb04 100644
--- a/addons/centered/package.json
+++ b/addons/centered/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-centered",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "Storybook decorator to center components",
   "keywords": [
     "addon",
diff --git a/addons/cssresources/package.json b/addons/cssresources/package.json
index 42a83ac0273..290e8c105d6 100644
--- a/addons/cssresources/package.json
+++ b/addons/cssresources/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-cssresources",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "A storybook addon to switch between css resources at runtime for your story",
   "keywords": [
     "addon",
@@ -24,10 +24,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.9",
-    "@storybook/channels": "5.0.0-rc.9",
-    "@storybook/components": "5.0.0-rc.9",
-    "@storybook/core-events": "5.0.0-rc.9",
+    "@storybook/addons": "5.0.0-rc.10",
+    "@storybook/channels": "5.0.0-rc.10",
+    "@storybook/components": "5.0.0-rc.10",
+    "@storybook/core-events": "5.0.0-rc.10",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "prop-types": "^15.6.2",
diff --git a/addons/events/package.json b/addons/events/package.json
index 03e3738058a..6087fc40db9 100644
--- a/addons/events/package.json
+++ b/addons/events/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-events",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "Add events to your Storybook stories.",
   "keywords": [
     "addon",
@@ -23,9 +23,9 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.9",
-    "@storybook/core-events": "5.0.0-rc.9",
-    "@storybook/theming": "5.0.0-rc.9",
+    "@storybook/addons": "5.0.0-rc.10",
+    "@storybook/core-events": "5.0.0-rc.10",
+    "@storybook/theming": "5.0.0-rc.10",
     "core-js": "^2.6.2",
     "format-json": "^1.0.3",
     "prop-types": "^15.6.2",
diff --git a/addons/google-analytics/package.json b/addons/google-analytics/package.json
index 0db51c4fecf..522406e170b 100644
--- a/addons/google-analytics/package.json
+++ b/addons/google-analytics/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-google-analytics",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "Storybook addon for google analytics",
   "keywords": [
     "addon",
@@ -19,8 +19,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.9",
-    "@storybook/core-events": "5.0.0-rc.9",
+    "@storybook/addons": "5.0.0-rc.10",
+    "@storybook/core-events": "5.0.0-rc.10",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "react-ga": "^2.5.3"
diff --git a/addons/graphql/package.json b/addons/graphql/package.json
index 759b525d512..ea637492c50 100644
--- a/addons/graphql/package.json
+++ b/addons/graphql/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-graphql",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "Storybook addon to display the GraphiQL IDE",
   "keywords": [
     "addon",
diff --git a/addons/info/package.json b/addons/info/package.json
index c72c859b997..c74f964b3d7 100644
--- a/addons/info/package.json
+++ b/addons/info/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-info",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "A Storybook addon to show additional information for your stories.",
   "keywords": [
     "addon",
@@ -21,10 +21,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.9",
-    "@storybook/client-logger": "5.0.0-rc.9",
-    "@storybook/components": "5.0.0-rc.9",
-    "@storybook/theming": "5.0.0-rc.9",
+    "@storybook/addons": "5.0.0-rc.10",
+    "@storybook/client-logger": "5.0.0-rc.10",
+    "@storybook/components": "5.0.0-rc.10",
+    "@storybook/theming": "5.0.0-rc.10",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "marksy": "^6.1.0",
diff --git a/addons/jest/package.json b/addons/jest/package.json
index 53a6d9c3b94..cb01001e54f 100644
--- a/addons/jest/package.json
+++ b/addons/jest/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-jest",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "React storybook addon that show component jest report",
   "keywords": [
     "addon",
@@ -27,10 +27,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.9",
-    "@storybook/components": "5.0.0-rc.9",
-    "@storybook/core-events": "5.0.0-rc.9",
-    "@storybook/theming": "5.0.0-rc.9",
+    "@storybook/addons": "5.0.0-rc.10",
+    "@storybook/components": "5.0.0-rc.10",
+    "@storybook/core-events": "5.0.0-rc.10",
+    "@storybook/theming": "5.0.0-rc.10",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "prop-types": "^15.6.2",
diff --git a/addons/knobs/package.json b/addons/knobs/package.json
index 94d775554dc..8b0e8589320 100644
--- a/addons/knobs/package.json
+++ b/addons/knobs/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-knobs",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "Storybook Addon Prop Editor Component",
   "keywords": [
     "addon",
@@ -21,10 +21,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.9",
-    "@storybook/components": "5.0.0-rc.9",
-    "@storybook/core-events": "5.0.0-rc.9",
-    "@storybook/theming": "5.0.0-rc.9",
+    "@storybook/addons": "5.0.0-rc.10",
+    "@storybook/components": "5.0.0-rc.10",
+    "@storybook/core-events": "5.0.0-rc.10",
+    "@storybook/theming": "5.0.0-rc.10",
     "copy-to-clipboard": "^3.0.8",
     "core-js": "^2.6.2",
     "escape-html": "^1.0.3",
diff --git a/addons/links/package.json b/addons/links/package.json
index fa7e279196d..bb268ddad3d 100644
--- a/addons/links/package.json
+++ b/addons/links/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-links",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "Story Links addon for storybook",
   "keywords": [
     "addon",
@@ -21,8 +21,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.9",
-    "@storybook/core-events": "5.0.0-rc.9",
+    "@storybook/addons": "5.0.0-rc.10",
+    "@storybook/core-events": "5.0.0-rc.10",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/addons/notes/package.json b/addons/notes/package.json
index 5f751ef5d1c..62f0ba16537 100644
--- a/addons/notes/package.json
+++ b/addons/notes/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-notes",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "Write notes for your Storybook stories.",
   "keywords": [
     "addon",
@@ -22,11 +22,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.9",
-    "@storybook/client-logger": "5.0.0-rc.9",
-    "@storybook/components": "5.0.0-rc.9",
-    "@storybook/core-events": "5.0.0-rc.9",
-    "@storybook/theming": "5.0.0-rc.9",
+    "@storybook/addons": "5.0.0-rc.10",
+    "@storybook/client-logger": "5.0.0-rc.10",
+    "@storybook/components": "5.0.0-rc.10",
+    "@storybook/core-events": "5.0.0-rc.10",
+    "@storybook/theming": "5.0.0-rc.10",
     "markdown-to-jsx": "^6.9.1",
     "prop-types": "^15.6.2",
     "util-deprecate": "^1.0.2"
diff --git a/addons/ondevice-backgrounds/package.json b/addons/ondevice-backgrounds/package.json
index 325a64251fb..db71f5679ee 100644
--- a/addons/ondevice-backgrounds/package.json
+++ b/addons/ondevice-backgrounds/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/addon-ondevice-backgrounds",
   "private": true,
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "A storybook addon to show different backgrounds for your preview",
   "keywords": [
     "addon",
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.9",
+    "@storybook/addons": "5.0.0-rc.10",
     "core-js": "^2.6.2",
     "prop-types": "^15.6.2"
   },
diff --git a/addons/ondevice-knobs/package.json b/addons/ondevice-knobs/package.json
index 6d0487fff57..b957f95965b 100644
--- a/addons/ondevice-knobs/package.json
+++ b/addons/ondevice-knobs/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/addon-ondevice-knobs",
   "private": true,
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "Display storybook story knobs on your deviced.",
   "keywords": [
     "addon",
@@ -21,7 +21,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.9",
+    "@storybook/addons": "5.0.0-rc.10",
     "core-js": "^2.6.2",
     "deep-equal": "^1.0.1",
     "prop-types": "^15.6.2",
diff --git a/addons/ondevice-notes/package.json b/addons/ondevice-notes/package.json
index f164f9403cb..b43a6f1e1a4 100644
--- a/addons/ondevice-notes/package.json
+++ b/addons/ondevice-notes/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/addon-ondevice-notes",
   "private": true,
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "Write notes for your Storybook stories.",
   "keywords": [
     "addon",
@@ -19,7 +19,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.9",
+    "@storybook/addons": "5.0.0-rc.10",
     "core-js": "^2.6.2",
     "prop-types": "^15.6.2",
     "react-native-simple-markdown": "^1.1.0"
diff --git a/addons/options/package.json b/addons/options/package.json
index 34be5366979..7504f344458 100644
--- a/addons/options/package.json
+++ b/addons/options/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-options",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "Options addon for storybook",
   "keywords": [
     "addon",
@@ -20,7 +20,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.9",
+    "@storybook/addons": "5.0.0-rc.10",
     "core-js": "^2.6.2",
     "util-deprecate": "^1.0.2"
   },
diff --git a/addons/storyshots/storyshots-core/package.json b/addons/storyshots/storyshots-core/package.json
index fd125ca37b6..7a02d83498b 100644
--- a/addons/storyshots/storyshots-core/package.json
+++ b/addons/storyshots/storyshots-core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storyshots",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "StoryShots is a Jest Snapshot Testing Addon for Storybook.",
   "keywords": [
     "addon",
@@ -24,7 +24,7 @@
     "storybook": "start-storybook -p 6006"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.9",
+    "@storybook/addons": "5.0.0-rc.10",
     "core-js": "^2.6.2",
     "glob": "^7.1.3",
     "global": "^4.3.2",
diff --git a/addons/storyshots/storyshots-puppeteer/package.json b/addons/storyshots/storyshots-puppeteer/package.json
index 416e38ea694..49fa938f314 100644
--- a/addons/storyshots/storyshots-puppeteer/package.json
+++ b/addons/storyshots/storyshots-puppeteer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storyshots-puppeteer",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "Image snappshots addition to StoryShots base on puppeteer",
   "keywords": [
     "addon",
@@ -21,8 +21,8 @@
     "prepare": "node ../../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/node-logger": "5.0.0-rc.9",
-    "@storybook/router": "5.0.0-rc.9",
+    "@storybook/node-logger": "5.0.0-rc.10",
+    "@storybook/router": "5.0.0-rc.10",
     "core-js": "^2.6.2",
     "jest-image-snapshot": "^2.6.0",
     "puppeteer": "^1.12.0",
diff --git a/addons/storysource/package.json b/addons/storysource/package.json
index d2d67335206..506d58ffcca 100644
--- a/addons/storysource/package.json
+++ b/addons/storysource/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storysource",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "Stories addon for storybook",
   "keywords": [
     "addon",
@@ -21,10 +21,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.9",
-    "@storybook/components": "5.0.0-rc.9",
-    "@storybook/router": "5.0.0-rc.9",
-    "@storybook/theming": "5.0.0-rc.9",
+    "@storybook/addons": "5.0.0-rc.10",
+    "@storybook/components": "5.0.0-rc.10",
+    "@storybook/router": "5.0.0-rc.10",
+    "@storybook/theming": "5.0.0-rc.10",
     "core-js": "^2.6.2",
     "estraverse": "^4.2.0",
     "loader-utils": "^1.2.1",
diff --git a/addons/viewport/package.json b/addons/viewport/package.json
index db8e913bdda..1def1187235 100644
--- a/addons/viewport/package.json
+++ b/addons/viewport/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-viewport",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "Storybook addon to change the viewport size to mobile",
   "keywords": [
     "addon",
@@ -20,11 +20,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.9",
-    "@storybook/client-logger": "5.0.0-rc.9",
-    "@storybook/components": "5.0.0-rc.9",
-    "@storybook/core-events": "5.0.0-rc.9",
-    "@storybook/theming": "5.0.0-rc.9",
+    "@storybook/addons": "5.0.0-rc.10",
+    "@storybook/client-logger": "5.0.0-rc.10",
+    "@storybook/components": "5.0.0-rc.10",
+    "@storybook/core-events": "5.0.0-rc.10",
+    "@storybook/theming": "5.0.0-rc.10",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
diff --git a/app/angular/package.json b/app/angular/package.json
index f6748263edd..d91af448627 100644
--- a/app/angular/package.json
+++ b/app/angular/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/angular",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "Storybook for Angular: Develop Angular Components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,8 +25,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.9",
-    "@storybook/node-logger": "5.0.0-rc.9",
+    "@storybook/core": "5.0.0-rc.10",
+    "@storybook/node-logger": "5.0.0-rc.10",
     "angular2-template-loader": "^0.6.2",
     "core-js": "^2.6.2",
     "fork-ts-checker-webpack-plugin": "^0.5.2",
diff --git a/app/ember/package.json b/app/ember/package.json
index bd841860632..7a62c5438ac 100644
--- a/app/ember/package.json
+++ b/app/ember/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/ember",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "Storybook for Ember: Develop Ember Component in isolation with Hot Reloading.",
   "homepage": "https://github.com/storybooks/storybook/tree/master/app/ember",
   "bugs": {
@@ -23,7 +23,7 @@
   },
   "dependencies": {
     "@ember/test-helpers": "^1.3.1",
-    "@storybook/core": "5.0.0-rc.9",
+    "@storybook/core": "5.0.0-rc.10",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/html/package.json b/app/html/package.json
index dc8d3fdd4fc..1cd2f1fde0e 100644
--- a/app/html/package.json
+++ b/app/html/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/html",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "Storybook for HTML: View HTML snippets in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.9",
+    "@storybook/core": "5.0.0-rc.10",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/marko/package.json b/app/marko/package.json
index 66ce3de14f7..4db8ef03adf 100644
--- a/app/marko/package.json
+++ b/app/marko/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/marko",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "Storybook for Marko: Develop Marko Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.9",
+    "@storybook/core": "5.0.0-rc.10",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/mithril/package.json b/app/mithril/package.json
index 2363dbb1c29..339a42736b0 100644
--- a/app/mithril/package.json
+++ b/app/mithril/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/mithril",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "Storybook for Mithril: Develop Mithril Component in isolation.",
   "keywords": [
     "storybook"
@@ -26,7 +26,7 @@
   },
   "dependencies": {
     "@babel/plugin-transform-react-jsx": "^7.3.0",
-    "@storybook/core": "5.0.0-rc.9",
+    "@storybook/core": "5.0.0-rc.10",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/polymer/package.json b/app/polymer/package.json
index b77cb5b1dad..cb67dab9577 100644
--- a/app/polymer/package.json
+++ b/app/polymer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/polymer",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "Storybook for Polymer: Develop Polymer components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.9",
+    "@storybook/core": "5.0.0-rc.10",
     "@webcomponents/webcomponentsjs": "^1.2.0",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
diff --git a/app/preact/package.json b/app/preact/package.json
index 2c66f99156a..12af29c506a 100644
--- a/app/preact/package.json
+++ b/app/preact/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/preact",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "Storybook for Preact: Develop Preact Component in isolation.",
   "keywords": [
     "storybook"
@@ -26,7 +26,7 @@
   },
   "dependencies": {
     "@babel/plugin-transform-react-jsx": "^7.3.0",
-    "@storybook/core": "5.0.0-rc.9",
+    "@storybook/core": "5.0.0-rc.10",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/react-native/package.json b/app/react-native/package.json
index 8b5f3cca3d2..07b3d119a84 100644
--- a/app/react-native/package.json
+++ b/app/react-native/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/react-native",
   "private": true,
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "A better way to develop React Native Components for your app",
   "keywords": [
     "react",
@@ -26,12 +26,12 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.9",
-    "@storybook/channel-websocket": "5.0.0-rc.9",
-    "@storybook/channels": "5.0.0-rc.9",
-    "@storybook/core": "5.0.0-rc.9",
-    "@storybook/core-events": "5.0.0-rc.9",
-    "@storybook/ui": "5.0.0-rc.9",
+    "@storybook/addons": "5.0.0-rc.10",
+    "@storybook/channel-websocket": "5.0.0-rc.10",
+    "@storybook/channels": "5.0.0-rc.10",
+    "@storybook/core": "5.0.0-rc.10",
+    "@storybook/core-events": "5.0.0-rc.10",
+    "@storybook/ui": "5.0.0-rc.10",
     "babel-loader": "^8.0.4",
     "babel-plugin-macros": "^2.4.5",
     "babel-plugin-syntax-async-functions": "^6.13.0",
diff --git a/app/react/package.json b/app/react/package.json
index 321612fbf74..27b62f71f67 100644
--- a/app/react/package.json
+++ b/app/react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/react",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "Storybook for React: Develop React Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -28,9 +28,9 @@
     "@babel/plugin-transform-react-constant-elements": "^7.2.0",
     "@babel/preset-flow": "^7.0.0",
     "@babel/preset-react": "^7.0.0",
-    "@storybook/core": "5.0.0-rc.9",
-    "@storybook/node-logger": "5.0.0-rc.9",
-    "@storybook/theming": "5.0.0-rc.9",
+    "@storybook/core": "5.0.0-rc.10",
+    "@storybook/node-logger": "5.0.0-rc.10",
+    "@storybook/theming": "5.0.0-rc.10",
     "@svgr/webpack": "^4.0.3",
     "babel-plugin-named-asset-import": "^0.3.0",
     "babel-plugin-react-docgen": "^2.0.2",
diff --git a/app/riot/package.json b/app/riot/package.json
index 9976d69bcde..065b736ff32 100644
--- a/app/riot/package.json
+++ b/app/riot/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/riot",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "Storybook for riot.js: View riot snippets in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.9",
+    "@storybook/core": "5.0.0-rc.10",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/svelte/package.json b/app/svelte/package.json
index 1b1a5cec6b4..1bbf452ca1b 100644
--- a/app/svelte/package.json
+++ b/app/svelte/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/svelte",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "Storybook for Svelte: Develop Svelte Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.9",
+    "@storybook/core": "5.0.0-rc.10",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/vue/package.json b/app/vue/package.json
index 3db871d5ae1..d38b8e42b52 100644
--- a/app/vue/package.json
+++ b/app/vue/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/vue",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "Storybook for Vue: Develop Vue Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.9",
+    "@storybook/core": "5.0.0-rc.10",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/examples/angular-cli/package.json b/examples/angular-cli/package.json
index f6986880435..963d9817c1e 100644
--- a/examples/angular-cli/package.json
+++ b/examples/angular-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "angular-cli",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "private": true,
   "license": "MIT",
   "scripts": {
@@ -33,18 +33,18 @@
     "@angular-devkit/build-angular": "^0.13.1",
     "@angular/cli": "^7.3.2",
     "@angular/compiler-cli": "^7.2.1",
-    "@storybook/addon-actions": "5.0.0-rc.9",
-    "@storybook/addon-backgrounds": "5.0.0-rc.9",
-    "@storybook/addon-centered": "5.0.0-rc.9",
-    "@storybook/addon-jest": "5.0.0-rc.9",
-    "@storybook/addon-knobs": "5.0.0-rc.9",
-    "@storybook/addon-links": "5.0.0-rc.9",
-    "@storybook/addon-notes": "5.0.0-rc.9",
-    "@storybook/addon-options": "5.0.0-rc.9",
-    "@storybook/addon-storyshots": "5.0.0-rc.9",
-    "@storybook/addon-storysource": "5.0.0-rc.9",
-    "@storybook/addons": "5.0.0-rc.9",
-    "@storybook/angular": "5.0.0-rc.9",
+    "@storybook/addon-actions": "5.0.0-rc.10",
+    "@storybook/addon-backgrounds": "5.0.0-rc.10",
+    "@storybook/addon-centered": "5.0.0-rc.10",
+    "@storybook/addon-jest": "5.0.0-rc.10",
+    "@storybook/addon-knobs": "5.0.0-rc.10",
+    "@storybook/addon-links": "5.0.0-rc.10",
+    "@storybook/addon-notes": "5.0.0-rc.10",
+    "@storybook/addon-options": "5.0.0-rc.10",
+    "@storybook/addon-storyshots": "5.0.0-rc.10",
+    "@storybook/addon-storysource": "5.0.0-rc.10",
+    "@storybook/addons": "5.0.0-rc.10",
+    "@storybook/angular": "5.0.0-rc.10",
     "@types/core-js": "^2.5.0",
     "@types/jest": "^23.3.13",
     "@types/node": "~10.12.19",
diff --git a/examples/cra-kitchen-sink/package.json b/examples/cra-kitchen-sink/package.json
index 6b515c6bbec..ec22608c553 100644
--- a/examples/cra-kitchen-sink/package.json
+++ b/examples/cra-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "cra-kitchen-sink",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "private": true,
   "scripts": {
     "build": "react-scripts build",
@@ -18,21 +18,21 @@
     "react-lifecycles-compat": "^3.0.4"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.0.0-rc.9",
-    "@storybook/addon-actions": "5.0.0-rc.9",
-    "@storybook/addon-backgrounds": "5.0.0-rc.9",
-    "@storybook/addon-centered": "5.0.0-rc.9",
-    "@storybook/addon-events": "5.0.0-rc.9",
-    "@storybook/addon-info": "5.0.0-rc.9",
-    "@storybook/addon-jest": "5.0.0-rc.9",
-    "@storybook/addon-knobs": "5.0.0-rc.9",
-    "@storybook/addon-links": "5.0.0-rc.9",
-    "@storybook/addon-notes": "5.0.0-rc.9",
-    "@storybook/addon-options": "5.0.0-rc.9",
-    "@storybook/addon-storyshots": "5.0.0-rc.9",
-    "@storybook/addons": "5.0.0-rc.9",
-    "@storybook/client-logger": "5.0.0-rc.9",
-    "@storybook/react": "5.0.0-rc.9",
+    "@storybook/addon-a11y": "5.0.0-rc.10",
+    "@storybook/addon-actions": "5.0.0-rc.10",
+    "@storybook/addon-backgrounds": "5.0.0-rc.10",
+    "@storybook/addon-centered": "5.0.0-rc.10",
+    "@storybook/addon-events": "5.0.0-rc.10",
+    "@storybook/addon-info": "5.0.0-rc.10",
+    "@storybook/addon-jest": "5.0.0-rc.10",
+    "@storybook/addon-knobs": "5.0.0-rc.10",
+    "@storybook/addon-links": "5.0.0-rc.10",
+    "@storybook/addon-notes": "5.0.0-rc.10",
+    "@storybook/addon-options": "5.0.0-rc.10",
+    "@storybook/addon-storyshots": "5.0.0-rc.10",
+    "@storybook/addons": "5.0.0-rc.10",
+    "@storybook/client-logger": "5.0.0-rc.10",
+    "@storybook/react": "5.0.0-rc.10",
     "enzyme": "^3.7.0",
     "enzyme-adapter-react-16": "^1.9.1",
     "enzyme-to-json": "^3.3.4",
diff --git a/examples/cra-ts-kitchen-sink/package.json b/examples/cra-ts-kitchen-sink/package.json
index 7a301789ba0..ff0415649ff 100644
--- a/examples/cra-ts-kitchen-sink/package.json
+++ b/examples/cra-ts-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "cra-ts-kitchen-sink",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook -s public",
@@ -19,11 +19,11 @@
     "react-dom": "^16.8.1"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.9",
-    "@storybook/addon-info": "5.0.0-rc.9",
-    "@storybook/addon-options": "5.0.0-rc.9",
-    "@storybook/addons": "5.0.0-rc.9",
-    "@storybook/react": "5.0.0-rc.9",
+    "@storybook/addon-actions": "5.0.0-rc.10",
+    "@storybook/addon-info": "5.0.0-rc.10",
+    "@storybook/addon-options": "5.0.0-rc.10",
+    "@storybook/addons": "5.0.0-rc.10",
+    "@storybook/react": "5.0.0-rc.10",
     "@types/enzyme": "^3.1.15",
     "@types/react": "^16.7.22",
     "@types/react-dom": "^16.0.11",
diff --git a/examples/ember-cli/package.json b/examples/ember-cli/package.json
index 9a6efda8d4e..d5fd17b063b 100644
--- a/examples/ember-cli/package.json
+++ b/examples/ember-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "ember-example",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "private": true,
   "scripts": {
     "build": "ember build",
@@ -14,18 +14,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.2.2",
-    "@storybook/addon-a11y": "5.0.0-rc.9",
-    "@storybook/addon-actions": "5.0.0-rc.9",
-    "@storybook/addon-backgrounds": "5.0.0-rc.9",
-    "@storybook/addon-centered": "5.0.0-rc.9",
-    "@storybook/addon-knobs": "5.0.0-rc.9",
-    "@storybook/addon-links": "5.0.0-rc.9",
-    "@storybook/addon-notes": "5.0.0-rc.9",
-    "@storybook/addon-options": "5.0.0-rc.9",
-    "@storybook/addon-storysource": "5.0.0-rc.9",
-    "@storybook/addon-viewport": "5.0.0-rc.9",
-    "@storybook/addons": "5.0.0-rc.9",
-    "@storybook/ember": "5.0.0-rc.9",
+    "@storybook/addon-a11y": "5.0.0-rc.10",
+    "@storybook/addon-actions": "5.0.0-rc.10",
+    "@storybook/addon-backgrounds": "5.0.0-rc.10",
+    "@storybook/addon-centered": "5.0.0-rc.10",
+    "@storybook/addon-knobs": "5.0.0-rc.10",
+    "@storybook/addon-links": "5.0.0-rc.10",
+    "@storybook/addon-notes": "5.0.0-rc.10",
+    "@storybook/addon-options": "5.0.0-rc.10",
+    "@storybook/addon-storysource": "5.0.0-rc.10",
+    "@storybook/addon-viewport": "5.0.0-rc.10",
+    "@storybook/addons": "5.0.0-rc.10",
+    "@storybook/ember": "5.0.0-rc.10",
     "babel-loader": "^8",
     "broccoli-asset-rev": "^3.0.0",
     "cross-env": "^5.2.0",
diff --git a/examples/html-kitchen-sink/package.json b/examples/html-kitchen-sink/package.json
index 7fe4f7cc261..21b703f4b48 100644
--- a/examples/html-kitchen-sink/package.json
+++ b/examples/html-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "html-kitchen-sink",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "private": true,
   "description": "",
   "keywords": [],
@@ -13,23 +13,23 @@
     "storybook": "start-storybook -p 9006"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.0.0-rc.9",
-    "@storybook/addon-actions": "5.0.0-rc.9",
-    "@storybook/addon-backgrounds": "5.0.0-rc.9",
-    "@storybook/addon-centered": "5.0.0-rc.9",
-    "@storybook/addon-events": "5.0.0-rc.9",
-    "@storybook/addon-jest": "5.0.0-rc.9",
-    "@storybook/addon-knobs": "5.0.0-rc.9",
-    "@storybook/addon-links": "5.0.0-rc.9",
-    "@storybook/addon-notes": "5.0.0-rc.9",
-    "@storybook/addon-options": "5.0.0-rc.9",
-    "@storybook/addon-storyshots": "5.0.0-rc.9",
-    "@storybook/addon-storysource": "5.0.0-rc.9",
-    "@storybook/addon-viewport": "5.0.0-rc.9",
-    "@storybook/addons": "5.0.0-rc.9",
-    "@storybook/core": "5.0.0-rc.9",
-    "@storybook/core-events": "5.0.0-rc.9",
-    "@storybook/html": "5.0.0-rc.9",
+    "@storybook/addon-a11y": "5.0.0-rc.10",
+    "@storybook/addon-actions": "5.0.0-rc.10",
+    "@storybook/addon-backgrounds": "5.0.0-rc.10",
+    "@storybook/addon-centered": "5.0.0-rc.10",
+    "@storybook/addon-events": "5.0.0-rc.10",
+    "@storybook/addon-jest": "5.0.0-rc.10",
+    "@storybook/addon-knobs": "5.0.0-rc.10",
+    "@storybook/addon-links": "5.0.0-rc.10",
+    "@storybook/addon-notes": "5.0.0-rc.10",
+    "@storybook/addon-options": "5.0.0-rc.10",
+    "@storybook/addon-storyshots": "5.0.0-rc.10",
+    "@storybook/addon-storysource": "5.0.0-rc.10",
+    "@storybook/addon-viewport": "5.0.0-rc.10",
+    "@storybook/addons": "5.0.0-rc.10",
+    "@storybook/core": "5.0.0-rc.10",
+    "@storybook/core-events": "5.0.0-rc.10",
+    "@storybook/html": "5.0.0-rc.10",
     "eventemitter3": "^3.1.0",
     "format-json": "^1.0.3",
     "global": "^4.3.2",
diff --git a/examples/marko-cli/package.json b/examples/marko-cli/package.json
index 0495544fc65..a81bb2d0e24 100644
--- a/examples/marko-cli/package.json
+++ b/examples/marko-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "marko-cli",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "private": true,
   "description": "Demo of how to build an app using marko-starter",
   "repository": {
@@ -22,12 +22,12 @@
     "marko-starter": "^2.0.4"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.9",
-    "@storybook/addon-knobs": "5.0.0-rc.9",
-    "@storybook/addon-options": "5.0.0-rc.9",
-    "@storybook/addon-storysource": "5.0.0-rc.9",
-    "@storybook/addons": "5.0.0-rc.9",
-    "@storybook/marko": "5.0.0-rc.9",
+    "@storybook/addon-actions": "5.0.0-rc.10",
+    "@storybook/addon-knobs": "5.0.0-rc.10",
+    "@storybook/addon-options": "5.0.0-rc.10",
+    "@storybook/addon-storysource": "5.0.0-rc.10",
+    "@storybook/addons": "5.0.0-rc.10",
+    "@storybook/marko": "5.0.0-rc.10",
     "prettier": "^1.16.4",
     "webpack": "^4.29.0"
   }
diff --git a/examples/mithril-kitchen-sink/package.json b/examples/mithril-kitchen-sink/package.json
index 96cc6a6e4f7..b542c68c935 100644
--- a/examples/mithril-kitchen-sink/package.json
+++ b/examples/mithril-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "mithril-example",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook",
@@ -10,18 +10,18 @@
     "mithril": "^1.1.6"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.9",
-    "@storybook/addon-backgrounds": "5.0.0-rc.9",
-    "@storybook/addon-centered": "5.0.0-rc.9",
-    "@storybook/addon-knobs": "5.0.0-rc.9",
-    "@storybook/addon-links": "5.0.0-rc.9",
-    "@storybook/addon-notes": "5.0.0-rc.9",
-    "@storybook/addon-options": "5.0.0-rc.9",
-    "@storybook/addon-storyshots": "5.0.0-rc.9",
-    "@storybook/addon-storysource": "5.0.0-rc.9",
-    "@storybook/addon-viewport": "5.0.0-rc.9",
-    "@storybook/addons": "5.0.0-rc.9",
-    "@storybook/mithril": "5.0.0-rc.9",
+    "@storybook/addon-actions": "5.0.0-rc.10",
+    "@storybook/addon-backgrounds": "5.0.0-rc.10",
+    "@storybook/addon-centered": "5.0.0-rc.10",
+    "@storybook/addon-knobs": "5.0.0-rc.10",
+    "@storybook/addon-links": "5.0.0-rc.10",
+    "@storybook/addon-notes": "5.0.0-rc.10",
+    "@storybook/addon-options": "5.0.0-rc.10",
+    "@storybook/addon-storyshots": "5.0.0-rc.10",
+    "@storybook/addon-storysource": "5.0.0-rc.10",
+    "@storybook/addon-viewport": "5.0.0-rc.10",
+    "@storybook/addons": "5.0.0-rc.10",
+    "@storybook/mithril": "5.0.0-rc.10",
     "webpack": "^4.29.0"
   }
 }
diff --git a/examples/official-storybook/package.json b/examples/official-storybook/package.json
index 048f48af817..58739217fc9 100644
--- a/examples/official-storybook/package.json
+++ b/examples/official-storybook/package.json
@@ -1,6 +1,6 @@
 {
   "name": "official-storybook",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook -c ./ -s built-storybooks",
@@ -12,29 +12,29 @@
     "storybook": "cross-env STORYBOOK_DISPLAY_WARNING=true DISPLAY_WARNING=true start-storybook -p 9011 -c ./ -s built-storybooks --no-dll"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.0.0-rc.9",
-    "@storybook/addon-actions": "5.0.0-rc.9",
-    "@storybook/addon-backgrounds": "5.0.0-rc.9",
-    "@storybook/addon-centered": "5.0.0-rc.9",
-    "@storybook/addon-cssresources": "5.0.0-rc.9",
-    "@storybook/addon-events": "5.0.0-rc.9",
-    "@storybook/addon-graphql": "5.0.0-rc.9",
-    "@storybook/addon-info": "5.0.0-rc.9",
-    "@storybook/addon-jest": "5.0.0-rc.9",
-    "@storybook/addon-knobs": "5.0.0-rc.9",
-    "@storybook/addon-links": "5.0.0-rc.9",
-    "@storybook/addon-notes": "5.0.0-rc.9",
-    "@storybook/addon-options": "5.0.0-rc.9",
-    "@storybook/addon-storyshots": "5.0.0-rc.9",
-    "@storybook/addon-storyshots-puppeteer": "5.0.0-rc.9",
-    "@storybook/addon-storysource": "5.0.0-rc.9",
-    "@storybook/addon-viewport": "5.0.0-rc.9",
-    "@storybook/addons": "5.0.0-rc.9",
-    "@storybook/components": "5.0.0-rc.9",
-    "@storybook/core-events": "5.0.0-rc.9",
-    "@storybook/node-logger": "5.0.0-rc.9",
-    "@storybook/react": "5.0.0-rc.9",
-    "@storybook/theming": "5.0.0-rc.9",
+    "@storybook/addon-a11y": "5.0.0-rc.10",
+    "@storybook/addon-actions": "5.0.0-rc.10",
+    "@storybook/addon-backgrounds": "5.0.0-rc.10",
+    "@storybook/addon-centered": "5.0.0-rc.10",
+    "@storybook/addon-cssresources": "5.0.0-rc.10",
+    "@storybook/addon-events": "5.0.0-rc.10",
+    "@storybook/addon-graphql": "5.0.0-rc.10",
+    "@storybook/addon-info": "5.0.0-rc.10",
+    "@storybook/addon-jest": "5.0.0-rc.10",
+    "@storybook/addon-knobs": "5.0.0-rc.10",
+    "@storybook/addon-links": "5.0.0-rc.10",
+    "@storybook/addon-notes": "5.0.0-rc.10",
+    "@storybook/addon-options": "5.0.0-rc.10",
+    "@storybook/addon-storyshots": "5.0.0-rc.10",
+    "@storybook/addon-storyshots-puppeteer": "5.0.0-rc.10",
+    "@storybook/addon-storysource": "5.0.0-rc.10",
+    "@storybook/addon-viewport": "5.0.0-rc.10",
+    "@storybook/addons": "5.0.0-rc.10",
+    "@storybook/components": "5.0.0-rc.10",
+    "@storybook/core-events": "5.0.0-rc.10",
+    "@storybook/node-logger": "5.0.0-rc.10",
+    "@storybook/react": "5.0.0-rc.10",
+    "@storybook/theming": "5.0.0-rc.10",
     "cors": "^2.8.4",
     "cross-env": "^5.2.0",
     "enzyme-to-json": "^3.3.4",
diff --git a/examples/polymer-cli/package.json b/examples/polymer-cli/package.json
index e09ff6ce25b..ecc9a9a4a6b 100644
--- a/examples/polymer-cli/package.json
+++ b/examples/polymer-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "polymer-cli",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook",
@@ -9,15 +9,15 @@
   },
   "dependencies": {
     "@polymer/polymer": "^2.6.0",
-    "@storybook/addon-actions": "5.0.0-rc.9",
-    "@storybook/addon-backgrounds": "5.0.0-rc.9",
-    "@storybook/addon-knobs": "5.0.0-rc.9",
-    "@storybook/addon-links": "5.0.0-rc.9",
-    "@storybook/addon-notes": "5.0.0-rc.9",
-    "@storybook/addon-options": "5.0.0-rc.9",
-    "@storybook/addon-storysource": "5.0.0-rc.9",
-    "@storybook/addon-viewport": "5.0.0-rc.9",
-    "@storybook/polymer": "5.0.0-rc.9",
+    "@storybook/addon-actions": "5.0.0-rc.10",
+    "@storybook/addon-backgrounds": "5.0.0-rc.10",
+    "@storybook/addon-knobs": "5.0.0-rc.10",
+    "@storybook/addon-links": "5.0.0-rc.10",
+    "@storybook/addon-notes": "5.0.0-rc.10",
+    "@storybook/addon-options": "5.0.0-rc.10",
+    "@storybook/addon-storysource": "5.0.0-rc.10",
+    "@storybook/addon-viewport": "5.0.0-rc.10",
+    "@storybook/polymer": "5.0.0-rc.10",
     "@webcomponents/webcomponentsjs": "^1.2.0",
     "global": "^4.3.2",
     "lit-html": "^1.0.0",
diff --git a/examples/preact-kitchen-sink/package.json b/examples/preact-kitchen-sink/package.json
index 1549a62c5e1..5cbcbb05d14 100644
--- a/examples/preact-kitchen-sink/package.json
+++ b/examples/preact-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "preact-example",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "private": true,
   "scripts": {
     "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
@@ -15,18 +15,18 @@
   "devDependencies": {
     "@babel/core": "^7.2.2",
     "@babel/plugin-transform-runtime": "^7.2.0",
-    "@storybook/addon-actions": "5.0.0-rc.9",
-    "@storybook/addon-backgrounds": "5.0.0-rc.9",
-    "@storybook/addon-centered": "5.0.0-rc.9",
-    "@storybook/addon-knobs": "5.0.0-rc.9",
-    "@storybook/addon-links": "5.0.0-rc.9",
-    "@storybook/addon-notes": "5.0.0-rc.9",
-    "@storybook/addon-options": "5.0.0-rc.9",
-    "@storybook/addon-storyshots": "5.0.0-rc.9",
-    "@storybook/addon-storysource": "5.0.0-rc.9",
-    "@storybook/addon-viewport": "5.0.0-rc.9",
-    "@storybook/addons": "5.0.0-rc.9",
-    "@storybook/preact": "5.0.0-rc.9",
+    "@storybook/addon-actions": "5.0.0-rc.10",
+    "@storybook/addon-backgrounds": "5.0.0-rc.10",
+    "@storybook/addon-centered": "5.0.0-rc.10",
+    "@storybook/addon-knobs": "5.0.0-rc.10",
+    "@storybook/addon-links": "5.0.0-rc.10",
+    "@storybook/addon-notes": "5.0.0-rc.10",
+    "@storybook/addon-options": "5.0.0-rc.10",
+    "@storybook/addon-storyshots": "5.0.0-rc.10",
+    "@storybook/addon-storysource": "5.0.0-rc.10",
+    "@storybook/addon-viewport": "5.0.0-rc.10",
+    "@storybook/addons": "5.0.0-rc.10",
+    "@storybook/preact": "5.0.0-rc.10",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
     "file-loader": "^3.0.1",
diff --git a/examples/riot-kitchen-sink/package.json b/examples/riot-kitchen-sink/package.json
index 2d6795549ae..a928235646a 100644
--- a/examples/riot-kitchen-sink/package.json
+++ b/examples/riot-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "riot-example",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "private": true,
   "scripts": {
     "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
@@ -15,18 +15,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.2.2",
-    "@storybook/addon-actions": "5.0.0-rc.9",
-    "@storybook/addon-backgrounds": "5.0.0-rc.9",
-    "@storybook/addon-centered": "5.0.0-rc.9",
-    "@storybook/addon-knobs": "5.0.0-rc.9",
-    "@storybook/addon-links": "5.0.0-rc.9",
-    "@storybook/addon-notes": "5.0.0-rc.9",
-    "@storybook/addon-options": "5.0.0-rc.9",
-    "@storybook/addon-storyshots": "5.0.0-rc.9",
-    "@storybook/addon-storysource": "5.0.0-rc.9",
-    "@storybook/addon-viewport": "5.0.0-rc.9",
-    "@storybook/addons": "5.0.0-rc.9",
-    "@storybook/riot": "5.0.0-rc.9",
+    "@storybook/addon-actions": "5.0.0-rc.10",
+    "@storybook/addon-backgrounds": "5.0.0-rc.10",
+    "@storybook/addon-centered": "5.0.0-rc.10",
+    "@storybook/addon-knobs": "5.0.0-rc.10",
+    "@storybook/addon-links": "5.0.0-rc.10",
+    "@storybook/addon-notes": "5.0.0-rc.10",
+    "@storybook/addon-options": "5.0.0-rc.10",
+    "@storybook/addon-storyshots": "5.0.0-rc.10",
+    "@storybook/addon-storysource": "5.0.0-rc.10",
+    "@storybook/addon-viewport": "5.0.0-rc.10",
+    "@storybook/addons": "5.0.0-rc.10",
+    "@storybook/riot": "5.0.0-rc.10",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
     "file-loader": "^3.0.1",
diff --git a/examples/svelte-kitchen-sink/package.json b/examples/svelte-kitchen-sink/package.json
index 192d58ec029..bdcaab9b0de 100644
--- a/examples/svelte-kitchen-sink/package.json
+++ b/examples/svelte-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "svelte-example",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook -s public",
@@ -10,17 +10,17 @@
     "global": "^4.3.2"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.9",
-    "@storybook/addon-backgrounds": "5.0.0-rc.9",
-    "@storybook/addon-centered": "5.0.0-rc.9",
-    "@storybook/addon-knobs": "5.0.0-rc.9",
-    "@storybook/addon-links": "5.0.0-rc.9",
-    "@storybook/addon-notes": "5.0.0-rc.9",
-    "@storybook/addon-options": "5.0.0-rc.9",
-    "@storybook/addon-storyshots": "5.0.0-rc.9",
-    "@storybook/addon-storysource": "5.0.0-rc.9",
-    "@storybook/addon-viewport": "5.0.0-rc.9",
-    "@storybook/addons": "5.0.0-rc.9",
-    "@storybook/svelte": "5.0.0-rc.9"
+    "@storybook/addon-actions": "5.0.0-rc.10",
+    "@storybook/addon-backgrounds": "5.0.0-rc.10",
+    "@storybook/addon-centered": "5.0.0-rc.10",
+    "@storybook/addon-knobs": "5.0.0-rc.10",
+    "@storybook/addon-links": "5.0.0-rc.10",
+    "@storybook/addon-notes": "5.0.0-rc.10",
+    "@storybook/addon-options": "5.0.0-rc.10",
+    "@storybook/addon-storyshots": "5.0.0-rc.10",
+    "@storybook/addon-storysource": "5.0.0-rc.10",
+    "@storybook/addon-viewport": "5.0.0-rc.10",
+    "@storybook/addons": "5.0.0-rc.10",
+    "@storybook/svelte": "5.0.0-rc.10"
   }
 }
diff --git a/examples/vue-kitchen-sink/package.json b/examples/vue-kitchen-sink/package.json
index 51d49e73cd1..e56ee631be3 100644
--- a/examples/vue-kitchen-sink/package.json
+++ b/examples/vue-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "vue-example",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "private": true,
   "scripts": {
     "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
@@ -14,18 +14,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.2.2",
-    "@storybook/addon-actions": "5.0.0-rc.9",
-    "@storybook/addon-backgrounds": "5.0.0-rc.9",
-    "@storybook/addon-centered": "5.0.0-rc.9",
-    "@storybook/addon-knobs": "5.0.0-rc.9",
-    "@storybook/addon-links": "5.0.0-rc.9",
-    "@storybook/addon-notes": "5.0.0-rc.9",
-    "@storybook/addon-options": "5.0.0-rc.9",
-    "@storybook/addon-storyshots": "5.0.0-rc.9",
-    "@storybook/addon-storysource": "5.0.0-rc.9",
-    "@storybook/addon-viewport": "5.0.0-rc.9",
-    "@storybook/addons": "5.0.0-rc.9",
-    "@storybook/vue": "5.0.0-rc.9",
+    "@storybook/addon-actions": "5.0.0-rc.10",
+    "@storybook/addon-backgrounds": "5.0.0-rc.10",
+    "@storybook/addon-centered": "5.0.0-rc.10",
+    "@storybook/addon-knobs": "5.0.0-rc.10",
+    "@storybook/addon-links": "5.0.0-rc.10",
+    "@storybook/addon-notes": "5.0.0-rc.10",
+    "@storybook/addon-options": "5.0.0-rc.10",
+    "@storybook/addon-storyshots": "5.0.0-rc.10",
+    "@storybook/addon-storysource": "5.0.0-rc.10",
+    "@storybook/addon-viewport": "5.0.0-rc.10",
+    "@storybook/addons": "5.0.0-rc.10",
+    "@storybook/vue": "5.0.0-rc.10",
     "babel-core": "^7.0.0-bridge.0",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
diff --git a/lerna.json b/lerna.json
index f6d01f8edef..e843e523996 100644
--- a/lerna.json
+++ b/lerna.json
@@ -11,5 +11,5 @@
   "npmClient": "yarn",
   "useWorkspaces": true,
   "registry": "https://registry.npmjs.org",
-  "version": "5.0.0-rc.9"
+  "version": "5.0.0-rc.10"
 }
diff --git a/lib/addons/package.json b/lib/addons/package.json
index bfaf30ddeb7..a52e2e144e0 100644
--- a/lib/addons/package.json
+++ b/lib/addons/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addons",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "Storybook addons store",
   "keywords": [
     "storybook"
@@ -20,8 +20,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.0.0-rc.9",
-    "@storybook/client-logger": "5.0.0-rc.9",
+    "@storybook/channels": "5.0.0-rc.10",
+    "@storybook/client-logger": "5.0.0-rc.10",
     "global": "^4.3.2",
     "util-deprecate": "^1.0.2"
   },
diff --git a/lib/channel-postmessage/package.json b/lib/channel-postmessage/package.json
index d9acac87c7a..5edb536bdd8 100644
--- a/lib/channel-postmessage/package.json
+++ b/lib/channel-postmessage/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channel-postmessage",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "",
   "keywords": [
     "storybook"
@@ -20,8 +20,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.0.0-rc.9",
-    "@storybook/client-logger": "5.0.0-rc.9",
+    "@storybook/channels": "5.0.0-rc.10",
+    "@storybook/client-logger": "5.0.0-rc.10",
     "global": "^4.3.2",
     "telejson": "^2.1.0"
   },
diff --git a/lib/channel-websocket/package.json b/lib/channel-websocket/package.json
index 7cc75b9ef6f..a4138d245dd 100644
--- a/lib/channel-websocket/package.json
+++ b/lib/channel-websocket/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channel-websocket",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "",
   "keywords": [
     "storybook"
@@ -20,7 +20,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.0.0-rc.9",
+    "@storybook/channels": "5.0.0-rc.10",
     "global": "^4.3.2",
     "json-fn": "^1.1.1"
   },
diff --git a/lib/channels/package.json b/lib/channels/package.json
index efe2deb584d..96e47ffbe79 100644
--- a/lib/channels/package.json
+++ b/lib/channels/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channels",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/cli/package.json b/lib/cli/package.json
index 439a715eb4c..12175c376c6 100644
--- a/lib/cli/package.json
+++ b/lib/cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/cli",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "Storybook's CLI - easiest method of adding storybook to your projects",
   "keywords": [
     "cli",
@@ -29,7 +29,7 @@
     "@babel/core": "^7.2.2",
     "@babel/preset-env": "^7.3.1",
     "@babel/register": "^7.0.0",
-    "@storybook/codemod": "5.0.0-rc.9",
+    "@storybook/codemod": "5.0.0-rc.10",
     "chalk": "^2.4.1",
     "commander": "^2.19.0",
     "core-js": "^2.6.2",
@@ -43,31 +43,31 @@
     "update-notifier": "^2.5.0"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.9",
-    "@storybook/addon-centered": "5.0.0-rc.9",
-    "@storybook/addon-graphql": "5.0.0-rc.9",
-    "@storybook/addon-info": "5.0.0-rc.9",
-    "@storybook/addon-knobs": "5.0.0-rc.9",
-    "@storybook/addon-links": "5.0.0-rc.9",
-    "@storybook/addon-notes": "5.0.0-rc.9",
-    "@storybook/addon-options": "5.0.0-rc.9",
-    "@storybook/addon-storyshots": "5.0.0-rc.9",
-    "@storybook/addons": "5.0.0-rc.9",
-    "@storybook/angular": "5.0.0-rc.9",
-    "@storybook/channel-postmessage": "5.0.0-rc.9",
-    "@storybook/channel-websocket": "5.0.0-rc.9",
-    "@storybook/channels": "5.0.0-rc.9",
-    "@storybook/ember": "5.0.0-rc.9",
-    "@storybook/html": "5.0.0-rc.9",
-    "@storybook/marko": "5.0.0-rc.9",
-    "@storybook/mithril": "5.0.0-rc.9",
-    "@storybook/polymer": "5.0.0-rc.9",
-    "@storybook/preact": "5.0.0-rc.9",
-    "@storybook/react": "5.0.0-rc.9",
-    "@storybook/react-native": "5.0.0-rc.9",
-    "@storybook/riot": "5.0.0-rc.9",
-    "@storybook/ui": "5.0.0-rc.9",
-    "@storybook/vue": "5.0.0-rc.9"
+    "@storybook/addon-actions": "5.0.0-rc.10",
+    "@storybook/addon-centered": "5.0.0-rc.10",
+    "@storybook/addon-graphql": "5.0.0-rc.10",
+    "@storybook/addon-info": "5.0.0-rc.10",
+    "@storybook/addon-knobs": "5.0.0-rc.10",
+    "@storybook/addon-links": "5.0.0-rc.10",
+    "@storybook/addon-notes": "5.0.0-rc.10",
+    "@storybook/addon-options": "5.0.0-rc.10",
+    "@storybook/addon-storyshots": "5.0.0-rc.10",
+    "@storybook/addons": "5.0.0-rc.10",
+    "@storybook/angular": "5.0.0-rc.10",
+    "@storybook/channel-postmessage": "5.0.0-rc.10",
+    "@storybook/channel-websocket": "5.0.0-rc.10",
+    "@storybook/channels": "5.0.0-rc.10",
+    "@storybook/ember": "5.0.0-rc.10",
+    "@storybook/html": "5.0.0-rc.10",
+    "@storybook/marko": "5.0.0-rc.10",
+    "@storybook/mithril": "5.0.0-rc.10",
+    "@storybook/polymer": "5.0.0-rc.10",
+    "@storybook/preact": "5.0.0-rc.10",
+    "@storybook/react": "5.0.0-rc.10",
+    "@storybook/react-native": "5.0.0-rc.10",
+    "@storybook/riot": "5.0.0-rc.10",
+    "@storybook/ui": "5.0.0-rc.10",
+    "@storybook/vue": "5.0.0-rc.10"
   },
   "publishConfig": {
     "access": "public"
diff --git a/lib/client-api/package.json b/lib/client-api/package.json
index 093df12b4ec..f14d6c346a1 100644
--- a/lib/client-api/package.json
+++ b/lib/client-api/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/client-api",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "Storybook Client API",
   "keywords": [
     "storybook"
@@ -19,10 +19,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.9",
-    "@storybook/client-logger": "5.0.0-rc.9",
-    "@storybook/core-events": "5.0.0-rc.9",
-    "@storybook/router": "5.0.0-rc.9",
+    "@storybook/addons": "5.0.0-rc.10",
+    "@storybook/client-logger": "5.0.0-rc.10",
+    "@storybook/core-events": "5.0.0-rc.10",
+    "@storybook/router": "5.0.0-rc.10",
     "common-tags": "^1.8.0",
     "eventemitter3": "^3.1.0",
     "global": "^4.3.2",
diff --git a/lib/client-logger/package.json b/lib/client-logger/package.json
index 8ede3bc002a..211c2527f9c 100644
--- a/lib/client-logger/package.json
+++ b/lib/client-logger/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/client-logger",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/codemod/package.json b/lib/codemod/package.json
index fcd96ed798c..62de6c7d6b0 100644
--- a/lib/codemod/package.json
+++ b/lib/codemod/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/codemod",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "A collection of codemod scripts written with JSCodeshift",
   "keywords": [
     "storybook"
diff --git a/lib/components/package.json b/lib/components/package.json
index b16e3a2e954..34e9903af24 100644
--- a/lib/components/package.json
+++ b/lib/components/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/components",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "Core Storybook Components",
   "keywords": [
     "storybook"
@@ -20,11 +20,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.9",
-    "@storybook/client-logger": "5.0.0-rc.9",
-    "@storybook/core-events": "5.0.0-rc.9",
-    "@storybook/router": "5.0.0-rc.9",
-    "@storybook/theming": "5.0.0-rc.9",
+    "@storybook/addons": "5.0.0-rc.10",
+    "@storybook/client-logger": "5.0.0-rc.10",
+    "@storybook/core-events": "5.0.0-rc.10",
+    "@storybook/router": "5.0.0-rc.10",
+    "@storybook/theming": "5.0.0-rc.10",
     "global": "^4.3.2",
     "immer": "^1.12.0",
     "js-beautify": "^1.8.9",
diff --git a/lib/core-events/package.json b/lib/core-events/package.json
index bea7c993567..e800febe9b5 100644
--- a/lib/core-events/package.json
+++ b/lib/core-events/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/core-events",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "Event names used in storybook core",
   "keywords": [
     "storybook"
diff --git a/lib/core/package.json b/lib/core/package.json
index 61a401d2095..34800209da8 100644
--- a/lib/core/package.json
+++ b/lib/core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/core",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "Storybook framework-agnostic API",
   "keywords": [
     "storybook"
@@ -24,15 +24,15 @@
     "@babel/plugin-syntax-dynamic-import": "^7.2.0",
     "@babel/plugin-transform-react-constant-elements": "^7.2.0",
     "@babel/preset-env": "^7.3.1",
-    "@storybook/addons": "5.0.0-rc.9",
-    "@storybook/channel-postmessage": "5.0.0-rc.9",
-    "@storybook/client-api": "5.0.0-rc.9",
-    "@storybook/client-logger": "5.0.0-rc.9",
-    "@storybook/core-events": "5.0.0-rc.9",
-    "@storybook/node-logger": "5.0.0-rc.9",
-    "@storybook/router": "5.0.0-rc.9",
-    "@storybook/theming": "5.0.0-rc.9",
-    "@storybook/ui": "5.0.0-rc.9",
+    "@storybook/addons": "5.0.0-rc.10",
+    "@storybook/channel-postmessage": "5.0.0-rc.10",
+    "@storybook/client-api": "5.0.0-rc.10",
+    "@storybook/client-logger": "5.0.0-rc.10",
+    "@storybook/core-events": "5.0.0-rc.10",
+    "@storybook/node-logger": "5.0.0-rc.10",
+    "@storybook/router": "5.0.0-rc.10",
+    "@storybook/theming": "5.0.0-rc.10",
+    "@storybook/ui": "5.0.0-rc.10",
     "airbnb-js-shims": "^1 || ^2",
     "autoprefixer": "^9.4.7",
     "babel-plugin-add-react-displayname": "^0.0.5",
diff --git a/lib/node-logger/package.json b/lib/node-logger/package.json
index a1c8c9b295e..392a440e891 100644
--- a/lib/node-logger/package.json
+++ b/lib/node-logger/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/node-logger",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/router/package.json b/lib/router/package.json
index e3621a93f02..81956527e9e 100644
--- a/lib/router/package.json
+++ b/lib/router/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/router",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "Core Storybook Router",
   "keywords": [
     "storybook"
@@ -20,7 +20,7 @@
   },
   "dependencies": {
     "@reach/router": "^1.2.1",
-    "@storybook/theming": "5.0.0-rc.9",
+    "@storybook/theming": "5.0.0-rc.10",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
     "qs": "^6.5.2"
diff --git a/lib/theming/package.json b/lib/theming/package.json
index cf95a325dcf..1161de01211 100644
--- a/lib/theming/package.json
+++ b/lib/theming/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/theming",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "Core Storybook Components",
   "keywords": [
     "storybook"
@@ -21,7 +21,7 @@
   "dependencies": {
     "@emotion/core": "^10.0.7",
     "@emotion/styled": "^10.0.7",
-    "@storybook/client-logger": "5.0.0-rc.9",
+    "@storybook/client-logger": "5.0.0-rc.10",
     "common-tags": "^1.8.0",
     "deep-object-diff": "^1.1.0",
     "emotion-theming": "^10.0.7",
diff --git a/lib/ui/package.json b/lib/ui/package.json
index df67a46f56e..c9531bf9a92 100644
--- a/lib/ui/package.json
+++ b/lib/ui/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/ui",
-  "version": "5.0.0-rc.9",
+  "version": "5.0.0-rc.10",
   "description": "Core Storybook UI",
   "keywords": [
     "storybook"
@@ -21,12 +21,12 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.9",
-    "@storybook/client-logger": "5.0.0-rc.9",
-    "@storybook/components": "5.0.0-rc.9",
-    "@storybook/core-events": "5.0.0-rc.9",
-    "@storybook/router": "5.0.0-rc.9",
-    "@storybook/theming": "5.0.0-rc.9",
+    "@storybook/addons": "5.0.0-rc.10",
+    "@storybook/client-logger": "5.0.0-rc.10",
+    "@storybook/components": "5.0.0-rc.10",
+    "@storybook/core-events": "5.0.0-rc.10",
+    "@storybook/router": "5.0.0-rc.10",
+    "@storybook/theming": "5.0.0-rc.10",
     "eventemitter3": "^3.1.0",
     "fast-deep-equal": "^2.0.1",
     "fuse.js": "^3.3.1",

From b710aef048b818c710efe82a3312d60c8b35af6a Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Mon, 4 Mar 2019 14:42:26 +0800
Subject: [PATCH 125/249] 5.0.0-rc.10 versions.json

---
 docs/static/versions.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/docs/static/versions.json b/docs/static/versions.json
index f6d7a59958d..8c15918ac36 100644
--- a/docs/static/versions.json
+++ b/docs/static/versions.json
@@ -1 +1 @@
-{"next":{"version":"5.0.0-rc.9","info":{"plain":"### Features\n\n* Core: Allow local decorators via params ([#5806](https://github.com/storybooks/storybook/pull/5806))\n\n### Bug Fixes\n\n* Core: Add warning for decorators added \"mid-kind\" ([#5819](https://github.com/storybooks/storybook/pull/5819))\n* Addon-notes: Support inline code markdown ([#5802](https://github.com/storybooks/storybook/pull/5802))\n* Theming: Fix theme loading bugs ([#5787](https://github.com/storybooks/storybook/pull/5787))\n* CLI: Fix build-storybook with simplebar esm files ([#5816](https://github.com/storybooks/storybook/pull/5816))"}}}
\ No newline at end of file
+{"next":{"version":"5.0.0-rc.10","info":{"plain":"### Bug Fixes\n\n* Addon-viewports: Restore v4 behaviour ([#5829](https://github.com/storybooks/storybook/pull/5829))\n* Addon-backgrounds: Remove previously deprecated default export ([#5828](https://github.com/storybooks/storybook/pull/5828))\n\n### Maintenance\n\n* Addon-a11y: Cleanup and document migration ([#5833](https://github.com/storybooks/storybook/pull/5833))"}}}
\ No newline at end of file

From aff2a9638e2e20e6a7ca871af2ed421bb6657e70 Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Mon, 4 Mar 2019 12:12:08 +0100
Subject: [PATCH 126/249] ADD parameters to compile-js to no longer copy .ts
 files into dist

---
 scripts/compile-js.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/scripts/compile-js.js b/scripts/compile-js.js
index 1ebba2962c7..b9446eb67dc 100644
--- a/scripts/compile-js.js
+++ b/scripts/compile-js.js
@@ -10,6 +10,7 @@ function getCommand(watch) {
     '--ignore **/__mocks__/,**/tests/*,**/__tests__/,**/**.test.js,**/stories/,**/**.story.js,**/**.stories.js,**/__snapshots__',
     './src --out-dir ./dist',
     '--copy-files',
+    '--ignore *.ts',
     `--config-file ${path.resolve(__dirname, '../.babelrc.js')}`,
   ];
 

From 9d7c28debb069889d2aab9bbfe5c2f8366496e36 Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Sat, 2 Mar 2019 18:04:37 +0100
Subject: [PATCH 127/249] MOVE guides to /guides/ && update them with more
 concise information

---
 docs/gatsby-config.js                         |  19 +-
 docs/src/components/Docs/Content/style.css    |   2 +-
 docs/src/pages/basics/guide-angular/index.md  | 210 ------------------
 docs/src/pages/basics/guide-html/index.md     | 111 ---------
 docs/src/pages/basics/guide-marko/index.md    |  96 --------
 docs/src/pages/basics/guide-mithril/index.md  | 108 ---------
 docs/src/pages/basics/guide-preact/index.md   | 114 ----------
 docs/src/pages/basics/guide-react/index.md    | 111 ---------
 docs/src/pages/basics/guide-riot/index.md     | 145 ------------
 docs/src/pages/basics/guide-svelte/index.md   | 158 -------------
 docs/src/pages/basics/guide-vue/index.md      | 130 -----------
 .../pages/basics/slow-start-guide/index.md    |  17 --
 .../custom-webpack-config/index.md            | 137 ++++++++++++
 docs/src/pages/guides/guide-angular/index.md  | 147 ++++++++++++
 .../{basics => guides}/guide-ember/index.md   |   0
 docs/src/pages/guides/guide-html/index.md     | 128 +++++++++++
 docs/src/pages/guides/guide-marko/index.md    | 120 ++++++++++
 docs/src/pages/guides/guide-mithril/index.md  | 125 +++++++++++
 docs/src/pages/guides/guide-preact/index.md   | 123 ++++++++++
 .../guide-react-native/index.md               |  11 +-
 docs/src/pages/guides/guide-react/index.md    | 123 ++++++++++
 docs/src/pages/guides/guide-react/new.md      | 158 +++++++++++++
 docs/src/pages/guides/guide-riot/index.md     | 199 +++++++++++++++++
 docs/src/pages/guides/guide-svelte/index.md   | 171 ++++++++++++++
 docs/src/pages/guides/guide-vue/index.md      | 162 ++++++++++++++
 .../quick-start-guide/index.md                |  34 +--
 .../pages/guides/slow-start-guide/index.md    |  17 ++
 docs/src/stories/data.js                      |   9 +
 docs/src/templates/_docstemplate.jsx          |   5 +-
 examples/official-storybook/package.json      |   2 +-
 examples/official-storybook/webpack.config.js |  95 ++++----
 31 files changed, 1710 insertions(+), 1277 deletions(-)
 delete mode 100644 docs/src/pages/basics/guide-angular/index.md
 delete mode 100644 docs/src/pages/basics/guide-html/index.md
 delete mode 100644 docs/src/pages/basics/guide-marko/index.md
 delete mode 100644 docs/src/pages/basics/guide-mithril/index.md
 delete mode 100644 docs/src/pages/basics/guide-preact/index.md
 delete mode 100644 docs/src/pages/basics/guide-react/index.md
 delete mode 100644 docs/src/pages/basics/guide-riot/index.md
 delete mode 100644 docs/src/pages/basics/guide-svelte/index.md
 delete mode 100644 docs/src/pages/basics/guide-vue/index.md
 delete mode 100644 docs/src/pages/basics/slow-start-guide/index.md
 create mode 100644 docs/src/pages/guides/guide-angular/index.md
 rename docs/src/pages/{basics => guides}/guide-ember/index.md (100%)
 create mode 100644 docs/src/pages/guides/guide-html/index.md
 create mode 100644 docs/src/pages/guides/guide-marko/index.md
 create mode 100644 docs/src/pages/guides/guide-mithril/index.md
 create mode 100644 docs/src/pages/guides/guide-preact/index.md
 rename docs/src/pages/{basics => guides}/guide-react-native/index.md (95%)
 create mode 100644 docs/src/pages/guides/guide-react/index.md
 create mode 100644 docs/src/pages/guides/guide-react/new.md
 create mode 100644 docs/src/pages/guides/guide-riot/index.md
 create mode 100644 docs/src/pages/guides/guide-svelte/index.md
 create mode 100644 docs/src/pages/guides/guide-vue/index.md
 rename docs/src/pages/{basics => guides}/quick-start-guide/index.md (66%)
 create mode 100644 docs/src/pages/guides/slow-start-guide/index.md

diff --git a/docs/gatsby-config.js b/docs/gatsby-config.js
index 3b807525588..b40be144c7a 100644
--- a/docs/gatsby-config.js
+++ b/docs/gatsby-config.js
@@ -8,20 +8,23 @@ module.exports = {
     docSections: {
       basics: [
         '/basics/introduction/',
-        '/basics/quick-start-guide/',
-        '/basics/slow-start-guide/',
-        '/basics/guide-react/',
-        '/basics/guide-react-native/',
-        '/basics/guide-vue/',
-        '/basics/guide-angular/',
-        '/basics/guide-mithril/',
-        '/basics/guide-ember/',
         '/basics/writing-stories/',
         '/basics/exporting-storybook/',
         '/basics/faq/',
         '/basics/community/',
         '/basics/live-examples/',
       ],
+      guides: [
+        '/guides/quick-start-guide/',
+        '/guides/slow-start-guide/',
+        '/guides/guide-react/',
+        '/guides/guide-react-native/',
+        '/guides/guide-vue/',
+        '/guides/guide-angular/',
+        '/guides/guide-mithril/',
+        '/guides/guide-ember/',
+        '/guides/guide-riot/',
+      ],
       configurations: [
         '/configurations/options-parameter/',
         '/configurations/default-config/',
diff --git a/docs/src/components/Docs/Content/style.css b/docs/src/components/Docs/Content/style.css
index 8ff6de2ccd3..1840a3c5691 100644
--- a/docs/src/components/Docs/Content/style.css
+++ b/docs/src/components/Docs/Content/style.css
@@ -44,7 +44,7 @@
 #docs-content .markdown h3 {
   font-size: 18px;
   margin: 30px 0 10px 0;
-  font-weight: 800;
+  font-weight: 500;
 }
 
 #docs-content .markdown a,
diff --git a/docs/src/pages/basics/guide-angular/index.md b/docs/src/pages/basics/guide-angular/index.md
deleted file mode 100644
index 82b2ef31012..00000000000
--- a/docs/src/pages/basics/guide-angular/index.md
+++ /dev/null
@@ -1,210 +0,0 @@
----
-id: 'guide-angular'
-title: 'Storybook for Angular'
----
-
-You may have tried to use our quick start guide to setup your project for Storybook. If you want to set up Storybook manually, this is the guide for you.
-
-> This will also help you understand how Storybook works.
-
-## Starter Guide Angular
-
-Storybook has its own webpack setup and a dev server.  
-The webpack setup is very similar to [Angular CLI](https://cli.angular.io), but allows you to [configure it however you want](/configurations/custom-webpack-config/).
-
-In this guide, we are trying to set up Storybook for your Angular project.
-
-## Table of contents
-
--   [Create Angular project](#create-angular-project)
--   [Add @storybook/angular and babel-core](#add-storybookangular-and-babel-core)
--   [Create the config file](#create-the-config-file)
--   [Write your stories](#write-your-stories)
--   [Run your Storybook](#run-your-storybook)
-
-## Create Angular project
-
-First of all, you need to prepare an Angular project. To do that, run:
-
-```sh
-npm i -g @angular/cli
-ng new your-angular-prj
-cd your-angular-prj
-```
-
-## Add @storybook/angular, @babel/core, and babel-loader
-
-Next, install `@storybook/angular`, `@babel/core`, and `babel-loader` (it's a peerDependency) to your project:
-
-```sh
-npm i --save-dev @storybook/angular @babel/core babel-loader
-```
-
-Then add the following NPM script to your package json in order to start the storybook later in this guide:
-
-```json
-{
-  "scripts": {
-    "storybook": "start-storybook -p 9001 -c .storybook"
-  }
-}
-```
-
-## Create the config file
-
-Storybook can be configured in several different ways. 
-That’s why we need a config directory. We've added a `-c` option to the above NPM script mentioning `.storybook` as the config directory.
-
-For the basic Storybook configuration file, you don't need to do much, but simply tell Storybook where to find stories.
-
-To do that, simply create a file at `.storybook/config.js` with the following content:
-
-```js
-import { configure } from '@storybook/angular';
-
-function loadStories() {
-  require('../src/stories/index.ts');
-}
-
-configure(loadStories, module);
-```
-
-That'll load stories in `../src/stories/index.ts`.
-
-Just like that, you can load stories from wherever you want to.
-
-## Storybook TypeScript configuration
-
-**Note:** You only need this if you are using Storybook `>= 4.0.0-alpha.23`.
-
-`@storybook/angular` is using [ForkTsCheckerWebpackPlugin](https://github.com/Realytics/fork-ts-checker-webpack-plugin) to boost the build performance. 
-This makes it necessary to create a `tsconfig.json` file at `.storybook/tsconfig.json` with the following content:
-
-```json
-{
-  "extends": "../tsconfig.json",
-  "exclude": [
-    "../src/test.ts",
-    "../src/**/*.spec.ts",
-    "../projects/**/*.spec.ts"
-  ],
-  "include": [
-    "../src/**/*",
-    "../projects/**/*"
-  ]
-}
-```
-
-> Only files that are included in the `include` or `files` section are checked for semantic TypeScript errors.
-> For more information visit the [ForkTsCheckerWebpackPlugin documentation](https://github.com/Realytics/fork-ts-checker-webpack-plugin#modules-resolution).
-
-## Write your stories
-
-Now you can write some stories inside the `../src/stories/index.ts` file, like this:
-
-```js
-import { storiesOf } from '@storybook/angular';
-import { action } from '@storybook/addon-actions';
-import { MyButtonComponent } from '../app/my-button/my-button.component';
-
-storiesOf('My Button', module)
-  .add('with some emoji', () => ({
-    component: MyButtonComponent,
-    props: {
-      text: '😀 😎 👍 💯',
-    },
-  }))
-  .add('with some emoji and action', () => ({
-    component: MyButtonComponent,
-    props: {
-      text: '😀 😎 👍 💯',
-      click: action('clicked'),
-    },
-  }));
-```
-
-Each story is a single state of your component. In the above case, there are two stories for the MyButton component:
-
-1.  story with `@Input()` property binding.
-2.  story with `@Input()` and `@Output()` property binding.
-
-## Run your Storybook
-
-Now everything is ready. Simply run your storybook with:
-
-```sh
-npm run storybook
-```
-
-Now you can change components and write stories whenever you need to.
-You'll get those changes into Storybook in a snap with the help of webpack's HMR API.
-
-## Module Metadata
-
-If your component has dependencies on other Angular directives and modules, these can be supplied using the `moduleMetadata` property on an individual story:
-
-```js
-import { CommonModule } from '@angular/common';
-import { storiesOf } from '@storybook/angular';
-import { MyButtonComponent } from '../app/my-button/my-button.component';
-import { MyPanelComponent } from '../app/my-panel/my-panel.component';
-import { MyDataService } from '../app/my-data/my-data.service';
-
-storiesOf('My Panel', module)
-  .add('Default', () => ({
-    component: MyPanelComponent,
-    moduleMetadata: {
-      imports: [CommonModule],
-      schemas: [],
-      declarations: [MyButtonComponent],
-      providers: [MyDataService],
-    }
-  }));
-```
-
-If you have metadata that is common between your stories, this can configured once using the `moduleMetadata()` decorator:
-
-```js
-import { CommonModule } from '@angular/common';
-import { storiesOf, moduleMetadata } from '@storybook/angular';
-import { MyButtonComponent } from '../app/my-button/my-button.component';
-import { MyPanelComponent } from '../app/my-panel/my-panel.component';
-import { MyDataService } from '../app/my-data/my-data.service';
-
-storiesOf('My Panel', module)
-  .addDecorator(
-    moduleMetadata({
-      imports: [CommonModule],
-      schemas: [],
-      declarations: [MyButtonComponent],
-      providers: [MyDataService],
-    })
-  )
-  .add('Default', () => ({
-    component: MyPanelComponent
-  }))
-  .add('with a title', () => ({
-    component: MyPanelComponent,
-    props: {
-      title: 'Foo',
-    }
-  }));
-```
-## Trouble Shooting
-
-If you have problems running @angular/cli using "ng serve" after install specifically the following error: 
-
-```ERROR in node_modules/@storybook/angular/index.d.ts(31,44): error TS2304: Cannot find name 'NodeRequire'.```
-
-You may need to exclude your stories from being compiled when running your angular dev environment.  To do this add "stories", "\*\*/\*.stories.ts" to the exclude section in src/app/tsconfig.app.json:
-
-```json
-{
-  "exclude": [
-    "stories",
-    "**/*.stories.ts"
-  ]
-}
-```
-
-If you're using scss for styling, you need to have `node-sass` dependency installed on your side (directly or via `@angular/cli`).
diff --git a/docs/src/pages/basics/guide-html/index.md b/docs/src/pages/basics/guide-html/index.md
deleted file mode 100644
index a954ac03dc9..00000000000
--- a/docs/src/pages/basics/guide-html/index.md
+++ /dev/null
@@ -1,111 +0,0 @@
----
-id: 'guide-html'
-title: 'Storybook for HTML'
----
-
-You may have tried to use our quick start guide to setup your project for Storybook. If you want to set up Storybook manually, this is the guide for you.
-
-> This will also help you to understand how Storybook works.
-
-## Starter Guide HTML
-
-Storybook has its own Webpack setup and a dev server.
-
-In this guide, we will set up Storybook for your HTML project.
-
-## Table of contents
-
--   [Add @storybook/html](#add-storybookhtml)
--   [Add babel-runtime and babel-core](#add-babel-runtime-and-babel-core)
--   [Create the config file](#create-the-config-file)
--   [Write your stories](#write-your-stories)
--   [Run your Storybook](#run-your-storybook)
-
-## Add @storybook/html
-
-First of all, you need to add `@storybook/html` to your project. To do that, simply run:
-
-```sh
-npm i --save-dev @storybook/html
-```
-
-If you don't have `package.json` in your project, you'll need to init it first:
-
-```sh
-npm init
-```
-
-## Add @babel/core, and babel-loader
-
-Make sure that you have `@babel/core`, and `babel-loader` in your dependencies as well because we list these as a peerDependency:
-
-```sh
-npm i --save-dev @babel/core
-npm i --save-dev babel-loader
-```
-
-Then add the following NPM script to your package json in order to start the storybook later in this guide:
-
-```json
-{
-  "scripts": {
-    "storybook": "start-storybook -p 9001 -c .storybook"
-  }
-}
-```
-
-## Create the config file
-
-Storybook can be configured in several different ways. 
-That’s why we need a config directory. We've added a `-c` option to the above NPM script mentioning `.storybook` as the config directory.
-
-For the basic Storybook configuration file, you don't need to do much, but simply tell Storybook where to find stories.
-
-To do that, simply create a file at `.storybook/config.js` with the following content:
-
-```js
-import { configure } from '@storybook/html';
-
-function loadStories() {
-  require('../stories/index.js');
-  // You can require as many stories as you need.
-}
-
-configure(loadStories, module);
-```
-
-That'll load stories in `../stories/index.js`.
-
-## Write your stories
-
-Now you can write some stories inside the `../stories/index.js` file, like this:
-
-```js
-/* global document */
-import { storiesOf } from '@storybook/html';
-
-storiesOf('Demo', module)
-  .add('heading', () => '<h1>Hello World</h1>')
-  .add('button', () => {
-    const button = document.createElement('button');
-    button.innerText = 'Hello Button';
-    button.addEventListener('click', e => console.log(e));
-    return button;
-  });
-
-```
-
-Story is a single HTML snippet or DOM node. In the above case, there are two stories:
-
-1.  heading — an HTML snippet
-2.  button — a DOM node with event listener
-
-## Run your Storybook
-
-Now everything is ready. Simply run your storybook with:
-
-```sh
-npm run storybook
-```
-
-Now you can change components and write stories whenever you need to.
diff --git a/docs/src/pages/basics/guide-marko/index.md b/docs/src/pages/basics/guide-marko/index.md
deleted file mode 100644
index 6daf3419185..00000000000
--- a/docs/src/pages/basics/guide-marko/index.md
+++ /dev/null
@@ -1,96 +0,0 @@
----
-id: 'guide-marko'
-title: 'Storybook for Marko'
----
-
-You may have tried to use our quick start guide to setup your project for Storybook. If you want to set up Storybook manually, this is the guide for you.
-
-> This will also help you to understand how Storybook works.
-
-## Starter Guide Marko
-
-Storybook has its own Webpack setup and a dev server.
-
-In this guide, we will set up Storybook for your Marko project.
-
-## Table of contents
-
--   [Add @storybook/marko](#add-storybookmarko)
--   [Add babel-runtime and babel-core](#add-babel-runtime-and-babel-core)
--   [Create the config file](#create-the-config-file)
--   [Write your stories](#write-your-stories)
--   [Run your Storybook](#run-your-storybook)
-
-## Add @storybook/marko
-
-First of all, you need to add `@storybook/marko` to your project. To do that, simply run:
-
-```sh
-npm i --save-dev @storybook/marko
-```
-
-## Add babel-runtime and babel-core
-
-Make sure that you have `babel-runtime` and `babel-core` in your dependencies as well because we list these as a peerDependency:
-
-```sh
-npm i --save babel-runtime
-npm i --save-dev babel-core
-```
-
-Then add the following NPM script to your package json in order to start the storybook later in this guide:
-
-```json
-{
-  "scripts": {
-    "storybook": "start-storybook -p 9001 -c .storybook"
-  }
-}
-```
-
-## Create the config file
-
-Storybook can be configured in several different ways. 
-That’s why we need a config directory. We've added a `-c` option to the above NPM script mentioning `.storybook` as the config directory.
-
-For the basic Storybook configuration file, you don't need to do much, but simply tell Storybook where to find stories.
-
-To do that, simply create a file at `.storybook/config.js` with the following content:
-
-```js
-import { configure } from '@storybook/marko';
-
-function loadStories() {
-  require('../stories/index.js');
-  // You can require as many stories as you need.
-}
-
-configure(loadStories, module);
-```
-
-That'll load stories in `../stories/index.js`.
-
-## Write your stories
-
-Now you can write some stories inside the `../stories/index.js` file, like this:
-
-```js
-import { storiesOf } from '@storybook/marko';
-import { action } from '@storybook/addon-actions';
-import Button from '../components/button/index.marko';
-
-storiesOf('Button', module)
-  .add('with action', () => Button.renderSync({ click: action('action logged!') }));
-```
-
-Story is a single state of your component.
-
-## Run your Storybook
-
-Now everything is ready. Simply run your storybook with:
-
-```sh
-npm run storybook
-```
-
-Now you can change components and write stories whenever you need to.
diff --git a/docs/src/pages/basics/guide-mithril/index.md b/docs/src/pages/basics/guide-mithril/index.md
deleted file mode 100644
index 9f75c147564..00000000000
--- a/docs/src/pages/basics/guide-mithril/index.md
+++ /dev/null
@@ -1,108 +0,0 @@
----
-id: 'guide-mithril'
-title: 'Storybook for Mithril'
----
-
-You may have tried to use our quick start guide to setup your project for Storybook. If you want to set up Storybook manually, this is the guide for you.
-
-> This will also help you to understand how Storybook works.
-
-## Starter Guide Mithril
-
-Storybook has its own Webpack setup and a dev server.
-
-In this guide, we will set up Storybook for your Mithril project.
-
-## Table of contents
-
--   [Add @storybook/mithril](#add-storybookmithril)
--   [Add mithril and babel-core](#add-mithril-and-babel-core)
--   [Create the config file](#create-the-config-file)
--   [Write your stories](#write-your-stories)
--   [Run your Storybook](#run-your-storybook)
-
-## Add @storybook/mithril
-
-First of all, you need to add `@storybook/mithril` to your project. To do that, simply run:
-
-```sh
-npm i --save-dev @storybook/mithril
-```
-
-## Add mithril and babel-core
-
-Make sure that you have `mithril` and `babel-core` in your dependencies as well because we list these as a peerDependency:
-
-```sh
-npm i --save mithril
-npm i --save-dev babel-core
-```
-
-Then add the following NPM script to your package json in order to start the storybook later in this guide:
-
-```json
-{
-  "scripts": {
-    "storybook": "start-storybook -p 9001 -c .storybook"
-  }
-}
-```
-
-## Create the config file
-
-Storybook can be configured in several different ways. 
-That’s why we need a config directory. We've added a `-c` option to the above NPM script mentioning `.storybook` as the config directory.
-
-For the basic Storybook configuration file, you don't need to do much, but simply tell Storybook where to find stories.
-
-To do that, simply create a file at `.storybook/config.js` with the following content:
-
-```js
-import { configure } from '@storybook/mithril';
-
-function loadStories() {
-  require('../stories/index.js');
-  // You can require as many stories as you need.
-}
-
-configure(loadStories, module);
-```
-
-That'll load stories in `../stories/index.js`.
-
-## Write your stories
-
-Now you can write some stories inside the `../stories/index.js` file, like this:
-
-```js
-/** @jsx m */
-
-import m from 'mithril';
-
-import { storiesOf } from '@storybook/mithril';
-import { action } from '@storybook/addon-actions';
-import Button from '../components/Button';
-
-storiesOf('Button', module)
-  .add('with text', () => ({
-    view: () => <Button onclick={action('clicked')}>Hello Button</Button>
-  }))
-  .add('with some emoji', () => ({
-  	view: () => <Button onclick={action('clicked')}><span role="img" aria-label="so cool">😀 😎 👍 💯</span></Button>
-  }));
-```
-
-Story is a single state of your component. In the above case, there are two stories for the native button component:
-
-1.  with text
-2.  with some emoji
-
-## Run your Storybook
-
-Now everything is ready. Simply run your storybook with:
-
-```sh
-npm run storybook
-```
-
-Now you can change components and write stories whenever you need to.
diff --git a/docs/src/pages/basics/guide-preact/index.md b/docs/src/pages/basics/guide-preact/index.md
deleted file mode 100644
index c110a46afbc..00000000000
--- a/docs/src/pages/basics/guide-preact/index.md
+++ /dev/null
@@ -1,114 +0,0 @@
----
-id: 'guide-preact'
-title: 'Storybook for Preact'
----
-
-You may have tried to use our quick start guide to setup your project for Storybook. If you want to set up Storybook manually, this is the guide for you.
-
-This will also help you to understand how Storybook works.
-
-## Starter Guide Preact
-
-Storybook has its own Webpack setup and a dev server.
-
-In this guide, we will set up Storybook for your Preact project.
-
-## Table of contents
-
-- [Add @storybook/preact](#add-storybookpreact)
-- [Add preact, @babel/core, and babel-loader](#add-preact-babel-core-and-babel-loader)
-- [Create the config file](#create-the-config-file)
-- [Write your stories](#write-your-stories)
-- [Run your Storybook](#run-your-storybook)
-
-## Add @storybook/react
-
-First of all, you need to add `@storybook/preact` to your project. To do that, run:
-
-```sh
-npm i --save-dev @storybook/preact
-```
-
-## Add preact, @babel/core, and babel-loader
-
-Make sure that you have `preact`, `@babel/core`, and `babel-loader` in your dependencies as well because we list these as a peer dependencies:
-
-```sh
-npm i --save preact
-npm i --save-dev @babel/core
-npm i --save-dev babel-loader
-```
-
-Then add the following NPM script to your `package.json` in order to start the storybook later in this guide:
-
-```json
-{
-  "scripts": {
-    "storybook": "start-storybook -p 9001 -c .storybook"
-  }
-}
-```
-
-## Create the config file
-
-Storybook can be configured in several different ways.
-That’s why we need a config directory. We've added a `-c` option to the above NPM script mentioning `.storybook` as the config directory.
-
-For a basic Storybook configuration, the only thing you need to do is tell Storybook where to find stories.
-
-To do that, create a file at `.storybook/config.js` with the following content:
-
-```js
-import { configure } from '@storybook/preact';
-
-function loadStories() {
-  require('../stories/index.js');
-  // You can require as many stories as you need.
-}
-
-configure(loadStories, module);
-```
-
-That'll load stories in `../stories/index.js`.
-
-Just like that, you can load stories from wherever you want to.
-
-## Write your stories
-
-Now you can write some stories inside the `../stories/index.js` file, like this:
-
-```js
-import { h } from 'preact';
-import { storiesOf } from '@storybook/preact';
-
-const Button = ({ children, ...props }) => <button {...props}>{children}</button>;
-
-storiesOf('Button', module)
-  .add('with text', () => <Button>Hello Button</Button>)
-  .add('with some emoji', () => (
-    <Button>
-      <span role="img" aria-label="so cool">
-        😀 😎 👍 💯
-      </span>
-    </Button>
-  ));
-```
-
-Each story is a single state of your component. In the above case, there are two stories for the demo button component:
-
-1.  With text
-2.  With some emoji
-
-## Run your Storybook
-
-Now everything is ready. Run your storybook with:
-
-```sh
-npm run storybook
-```
-
-Then you can see all your stories, like this:
-
-![Basic stories](../static/basic-stories.png)
-
-Now you can change components and write stories whenever you need to. You'll see the changes in Storybook immediately since it uses Webpack's hot module reloading.
diff --git a/docs/src/pages/basics/guide-react/index.md b/docs/src/pages/basics/guide-react/index.md
deleted file mode 100644
index ed33c1c2e41..00000000000
--- a/docs/src/pages/basics/guide-react/index.md
+++ /dev/null
@@ -1,111 +0,0 @@
----
-id: 'guide-react'
-title: 'Storybook for React'
----
-
-You may have tried to use our quick start guide to setup your project for Storybook. If you want to set up Storybook manually, this is the guide for you.
-
-This will also help you to understand how Storybook works.
-
-## Starter Guide React
-
-Storybook has its own Webpack setup and a dev server. Webpack setup is very similar to [Create React App](https://github.com/facebookincubator/create-react-app), but allows you to configure it as you want.
-
-In this guide, we will set up Storybook for your React project.
-
-## Table of contents
-
--   [Add @storybook/react](#add-storybookreact)
--   [Add react, react-dom, @babel/core, and babel-loader](#add-react-react-dom-babel-core-and-babel-loader)
--   [Create the config file](#create-the-config-file)
--   [Write your stories](#write-your-stories)
--   [Run your Storybook](#run-your-storybook)
-
-## Add @storybook/react
-
-First of all, you need to add `@storybook/react` to your project. To do that, run:
-
-```sh
-npm i --save-dev @storybook/react
-```
-
-## Add react, react-dom, @babel/core, and babel-loader
-
-Make sure that you have `react`, `react-dom`, `@babel/core`, and `babel-loader` in your dependencies as well because we list these as a peer dependencies:
-
-```sh
-npm i --save react react-dom
-npm i --save-dev @babel/core
-npm i --save-dev babel-loader
-```
-
-Then add the following NPM script to your `package.json` in order to start the storybook later in this guide:
-
-```json
-{
-  "scripts": {
-    "storybook": "start-storybook -p 9001 -c .storybook"
-  }
-}
-```
-
-## Create the config file
-
-Storybook can be configured in several different ways. 
-That’s why we need a config directory. We've added a `-c` option to the above NPM script mentioning `.storybook` as the config directory.
-
-For a basic Storybook configuration, the only thing you need to do is tell Storybook where to find stories.
-
-To do that, create a file at `.storybook/config.js` with the following content:
-
-```js
-import { configure } from '@storybook/react';
-
-function loadStories() {
-  require('../stories/index.js');
-  // You can require as many stories as you need.
-}
-
-configure(loadStories, module);
-```
-
-That'll load stories in `../stories/index.js`.
-
-Just like that, you can load stories from wherever you want to.
-
-## Write your stories
-
-Now you can write some stories inside the `../stories/index.js` file, like this:
-
-```js
-import React from 'react';
-import { storiesOf } from '@storybook/react';
-import { Button } from '@storybook/react/demo';
-
-storiesOf('Button', module)
-  .add('with text', () => (
-    <Button>Hello Button</Button>
-  ))
-  .add('with some emoji', () => (
-    <Button><span role="img" aria-label="so cool">😀 😎 👍 💯</span></Button>
-  ));   
-```
-
-Each story is a single state of your component. In the above case, there are two stories for the demo button component:
-
-1.  With text
-2.  With some emoji
-
-## Run your Storybook
-
-Now everything is ready. Run your storybook with:
-
-```sh
-npm run storybook
-```
-
-Then you can see all your stories, like this:
-
-![Basic stories](../static/basic-stories.png)
-
-Now you can change components and write stories whenever you need to. You'll see the changes in Storybook immediately since it uses Webpack's hot module reloading.
diff --git a/docs/src/pages/basics/guide-riot/index.md b/docs/src/pages/basics/guide-riot/index.md
deleted file mode 100644
index b9690202425..00000000000
--- a/docs/src/pages/basics/guide-riot/index.md
+++ /dev/null
@@ -1,145 +0,0 @@
----
-id: 'guide-riot'
-title: 'Storybook for Riot'
----
-
-You may have tried to use our quick start guide to setup your project for Storybook. If you want to set up Storybook manually, this is the guide for you.
-
-> This will also help you understand how Storybook works.
-
-## Starter Guide Riot
-
-Storybook has its own Webpack setup and a dev server.
-The Webpack setup is very similar to [tag-loader](https://github.com/riot/tag-loader), but allows you to [configure it however you want](/configurations/custom-webpack-config/).
-
-In this guide, we are trying to set up Storybook for your Riot project.
-
-## Table of contents
-
--   [Add @storybook/riot](#add-storybookriot)
--   [Add riot and babel-loader](#add-riot-and-babel-loader)
--   [Create the NPM script](#create-the-npm-script)
--   [Create the config file](#create-the-config-file)
--   [Write your stories](#write-your-stories)
--   [Run your Storybook](#run-your-storybook)
-
-## Add @storybook/riot
-
-First of all, you need to add `@storybook/riot` to your project. To do that, simply run:
-
-```sh
-npm i --save-dev @storybook/riot
-```
-
-## Add riot and babel-loader
-
-Make sure that you have `riot`, the `riot-compiler`, the `riot-tag-loader` and `babel-loader` in your dependencies as well because we list it as a peerDependency:
-
-```sh
-npm i --save riot
-npm i --save-dev babel-core riot-compiler riot-tag-loader
-```
-
-## Create the NPM script
-
-Add the following NPM script to your `package.json` in order to start the storybook later in this guide:
-
-    {
-      "scripts": {
-        "storybook": "start-storybook -p 9001 -c .storybook"
-      }
-    }
-
-## Create the config file
-
-Storybook can be configured in several different ways.
-That’s why we need a config directory. We've added a `-c` option to the above NPM script mentioning `.storybook` as the config directory.
-
-There are 2 things you need to tell Storybook to do:
-
-1.  Import and globally register with [`riot.mount()`](https://riot.js.org/api/#mounting) any global custom components just like you did with your project.
-2.  Require your stories.
-
-Here's an example `.storybook/config.js` to get you started:
-
-```js
-import { configure } from '@storybook/riot';
-
-// Import your globally available components.
-import '../src/stories/Button.tag'; 
-
-function loadStories() {
-  // You can require as many stories as you need.
-  require('../src/stories');
-}
-
-configure(loadStories, module);
-```
-
-This example registered your custom `Button.tag` component, and loaded your Storybook stories defined in `../stories/index.js`.
-
-All custom components can be registered before or after calling `configure()`.
-
-> This stories folder is just an example, you can load stories from wherever you want to.
-> We think stories are best located close to the source files.
-
-## Write your stories
-
-There are several ways to implement a story using either a text import or a component import
-
-```js
-import { tag, mount, storiesOf } from '@storybook/riot';
-import SimpleTestRaw from './SimpleTest.txt'; //can be loaded as string if you prefer
-import './AnotherTest.tag';
-//if you need to import .tag files as text, just use the raw-loader instead of the riot-tag-loader
-
-storiesOf('Story|How to create a story', module)
-  .add(
-    'built with tag', // the template is compiled below
-    () =>
-      tag('test', '<div>simple test ({ opts.value })</div>', '', '', () => {}) &&
-      mount('test', { value: 'with a parameter' }))
-
-  // tags[0] will be the parent tag, always
-  // you can leave out the root tag, if we find out that the new root tag
-  // is a built-in html tag, it will be wrapped
-  .add('built as string', () => ({ tags: ['<test><div>simple test</div></test>'] })
-
-  // the component is a string, it will be instantiated without params
-  // e.g. <SimpletestRaw/>
-  .add('built from raw import', () => SimpleTestRaw)
-
-  // the comprehensive form is this one
-  // list all the possible tags (the root element is in the content)
-  // then scenario is compiled and executed
-  .add(
-    'built from tags and scenario',
-    () => ({
-      tags: [{ content: SimpleTestRaw, boundAs: 'mustBeUniquePlease' }],
-      scenario:
-        '<SimpleTest test={ "with a parameter" } value={"value is mapped to riotValue"}></SimpleTest>',
-    }),
-    {
-      notes:
-        'WARN : the tag file root element must have exactly the same name (or else you will see nothing)',
-    }
-  )
-
-  // the tag is already compiled before running the js
-  // the tag name 'anothertest' must match exactly the root tag inside the tag file
-  // mind the lower case
-  .add('built from the precompilation', () => mount('anothertest', {}), {
-    notes: 'WARN, only works in lower case, never upper case with precompiled templates',
-  });
-```
-
-## Run your Storybook
-
-Now everything is ready. Simply run your storybook with:
-
-```sh
-npm run storybook
-```
-
-Now you can change components and write stories whenever you need to.
-You'll get those changes into Storybook in a snap with the help of Webpack's HMR API.
diff --git a/docs/src/pages/basics/guide-svelte/index.md b/docs/src/pages/basics/guide-svelte/index.md
deleted file mode 100644
index 084d34a90f0..00000000000
--- a/docs/src/pages/basics/guide-svelte/index.md
+++ /dev/null
@@ -1,158 +0,0 @@
----
-id: 'guide-svelte'
-title: 'Storybook for Svelte'
----
-
-You may have tried to use our quick start guide to setup your project for Storybook. If you want to set up Storybook manually, this is the guide for you.
-
-> This will also help you understand how Storybook works.
-
-## Starter Guide Svelte
-
-Storybook has its own Webpack setup and a dev server.
-
-The Webpack setup is very similar to [Svelte CLI's](https://github.com/sveltejs/svelte-cli), but allows you to [configure it however you want](/configurations/custom-webpack-config/).
-
-In this guide, we are trying to set up Storybook for your Svelte project.
-
-> It is very important to remember that Svelte components are precompiled from
-> .svelte or .html files to vanilla javascript, so there is no 'runtime'.
-
-## Table of contents
-
--   [Add @storybook/svelte](#add-storybooksvelte)
--   [Create the NPM script](#create-the-npm-script)
--   [Create the config file](#create-the-config-file)
--   [Write your stories](#write-your-stories)
--   [Run your Storybook](#run-your-storybook)
-
-## Add @storybook/svelte
-
-First of all, you need to add `@storybook/svelte` to your project. To do that, simply run:
-
-```sh
-yarn add @storybook/svelte --dev
-```
-
-## Create the NPM script
-
-Add the following NPM script to your `package.json` in order to start the storybook later in this guide:
-
-```json
-{
-  "scripts": {
-    "storybook": "start-storybook -p 9001 -c .storybook"
-  }
-}
-```
-
-Those flags mean port (-p) 9001 and configuration (-c) located in the .storybook directory.
-
-## Create the config file
-
-Storybook can be configured in several different ways.
-
-That’s why we need a config directory. We've added a `-c` option to the above NPM script mentioning `.storybook` as the config directory.
-
-Here's an example `.storybook/config.js` to get you started:
-
-```js
-import { configure } from '@storybook/svelte';
-
-function loadStories() {
-  // You can require as many stories as you need.
-  require('../src/stories');
-}
-
-configure(loadStories, module);
-```
-
-> This stories folder is just an example, you can load stories from wherever you want to.
-> We think stories are best located close to the source files.
-
-## Write your stories
-
-Now you can write some stories inside the `../stories/index.js` file, like this:
-
-```js
-// Story about MyButton
-import { storiesOf } from '@storybook/svelte';
-
-import MyButton from '../components/MyButton.svelte';
-
-storiesOf('MyButton', module)
-  .add('simple component example', () => ({
-    Component: MyButton,
-
-    data: {
-      rounded: true
-    },
-
-    on: {
-      click: event => {
-        console.log('clicked', event);
-      }
-    }
-  }));
-```
-
-Svelte storybooks don't support using templates in a story yet. Instead,
-you can create a .svelte file to compose components together, or simply to access
-all normal Svelte functionality, like slots.
-
-So you can create a story "view" file, essentially just a .svelte file to load
-your components into to test.
-
-```html
-<!-- MyButtonView  -->
-<MyButton rounded="{rounded}" on:click>
-  {buttonText}
-</Button>
-```
-
-In this example, the `on:click` that is heard on the `MyButton` component is
-simply passed up to the containing component `MyButtonView` using the svelte
-shorthand. It's the equivalent to `on:click="fire('click', event)"`, but it's
-worth knowing about especially in this "component wrapper" scenario.
-
-> If your component doesn't use slots, you don't need to do this, but if it does
-> or some other svelte functionality that requires the component to exist in a svelte
-> view, then this is how to do that.
-
-You would then write a story for this "view" the exact same way you did with a component.
-
-```js
-// MyButtonView
-import { storiesOf } from '@storybook/svelte';
-
-import MyButtonView from '../views/MyButtonView.svelte';
-
-storiesOf('MyButtonView', module)
-  .add('wrapped component(s) example', () => ({
-    Components: MyButtonView,
-
-    data: {
-      buttonText: 'Some button text',
-      rounded: true
-    },
-
-    on: {
-      click: (event) => {
-        console.log('clicked', event);
-      }
-    }
-  }));
-```
-
-Each story represents a single state of your component.
-
-## Run your Storybook
-
-Now everything is ready. Simply run your storybook with:
-
-```sh
-yarn storybook
-```
-
-Now you can change components and write stories whenever you need to.
-You'll get those changes into Storybook in a snap with the help of Webpack's HMR API.
diff --git a/docs/src/pages/basics/guide-vue/index.md b/docs/src/pages/basics/guide-vue/index.md
deleted file mode 100644
index 2fa14f4da3e..00000000000
--- a/docs/src/pages/basics/guide-vue/index.md
+++ /dev/null
@@ -1,130 +0,0 @@
----
-id: 'guide-vue'
-title: 'Storybook for Vue'
----
-
-You may have tried to use our quick start guide to setup your project for Storybook. If you want to set up Storybook manually, this is the guide for you.
-
-> This will also help you understand how Storybook works.
-
-## Starter Guide Vue
-
-Storybook has its own Webpack setup and a dev server.  
-The Webpack setup is very similar to [Vue CLI's](https://github.com/vuejs/vue-cli), but allows you to [configure it however you want](/configurations/custom-webpack-config/).
-
-In this guide, we are trying to set up Storybook for your Vue project.
-
-## Table of contents
-
--   [Add @storybook/vue](#add-storybookvue)
--   [Add vue and babel-core](#add-vue-and-babel-core)
--   [Create the NPM script](#create-the-npm-script)
--   [Create the config file](#create-the-config-file)
--   [Write your stories](#write-your-stories)
--   [Run your Storybook](#run-your-storybook)
-
-## Add @storybook/vue
-
-First of all, you need to add `@storybook/vue` to your project. To do that, simply run:
-
-```sh
-npm i --save-dev @storybook/vue
-```
-
-## Add vue, babel-core, and babel-loader
-
-Make sure that you have `vue`, `babel-core`, `babel-loader` in your dependencies as well because we list it as a peerDependency:
-
-```sh
-npm i --save vue
-npm i --save-dev babel-loader vue-loader vue-template-compiler
-npm i --save-dev @babel/core babel-preset-vue
-```
-
-## Create the NPM script
-
-Add the following NPM script to your `package.json` in order to start the storybook later in this guide:
-
-    {
-      "scripts": {
-        "storybook": "start-storybook -p 9001 -c .storybook"
-      }
-    }
-
-## Create the config file
-
-Storybook can be configured in several different ways. 
-That’s why we need a config directory. We've added a `-c` option to the above NPM script mentioning `.storybook` as the config directory.
-
-There are 3 things you need to tell Storybook to do:
-
-1.  Import and globally register with [`Vue.component()`](https://vuejs.org/v2/api/#Vue-component) any global custom components just like you did with your project. (Note: [components registered locally](https://vuejs.org/v2/guide/components.html#Local-Registration) will be brought in automatically).
-2.  For any required Vue plugins (e.g. `vuex`), you'll also need to [install these with `Vue.use`](https://vuejs.org/v2/api/#Vue-use).
-3.  Require your stories.
-
-Here's an example `.storybook/config.js` to get you started:
-
-```js
-import { configure } from '@storybook/vue';
-
-import Vue from 'vue';
-import Vuex from 'vuex'; // Vue plugins
-
-// Import your custom components.
-import Mybutton from '../src/stories/Button.vue';
-
-// Install Vue plugins.
-Vue.use(Vuex);
-
-// Register custom components.
-Vue.component('my-button', Mybutton);
-
-function loadStories() {
-  // You can require as many stories as you need.
-  require('../src/stories');
-}
-
-configure(loadStories, module);
-```
-
-This example registered your custom `Button.vue` component, installed the Vuex plugin, and loaded your Storybook stories defined in `../stories/index.js`.
-
-All custom components and Vue plugins should be registered before calling `configure()`.
-
-> This stories folder is just an example, you can load stories from wherever you want to.
-> We think stories are best located close to the source files.
-
-## Write your stories
-
-Now you can write some stories inside the `../stories/index.js` file, like this:
-
-```js
-import Vue from 'vue';
-
-import { storiesOf } from '@storybook/vue';
-
-import MyButton from './Button.vue';
-
-storiesOf('MyButton', module)
-  .add('story as a template', () => '<my-button :rounded="true">story as a function template</my-button>')
-  .add('story as a component', () => ({
-    components: { MyButton },
-    template: '<my-button :rounded="true">rounded</my-button>'
-  }));
-```
-
-Each story is a single state of your component. In the above case, there are two stories for the MyButton component:
-
-1.  story as a template
-2.  story as a component
-
-## Run your Storybook
-
-Now everything is ready. Simply run your storybook with:
-
-```sh
-npm run storybook
-```
-
-Now you can change components and write stories whenever you need to.
-You'll get those changes into Storybook in a snap with the help of Webpack's HMR API.
diff --git a/docs/src/pages/basics/slow-start-guide/index.md b/docs/src/pages/basics/slow-start-guide/index.md
deleted file mode 100644
index 02b64af3167..00000000000
--- a/docs/src/pages/basics/slow-start-guide/index.md
+++ /dev/null
@@ -1,17 +0,0 @@
----
-id: 'slow-start-guide'
-title: 'Slow Start Guide'
----
-
-Storybook supports multiple UI libraries. The manual setup for each framework is different:
-
-- [Storybook for React](/basics/guide-react/)
-- [Storybook for React Native](/basics/guide-react-native/)
-- [Storybook for Vue](/basics/guide-vue/)
-- [Storybook for Angular](/basics/guide-angular/)
-- [Storybook for Mithril](/basics/guide-mithril/)
-- [Storybook for Marko](/basics/guide-marko/)
-- [Storybook for HTML](/basics/guide-html/)
-- [Storybook for Svelte](/basics/guide-svelte/)
-- [Storybook for Riot](/basics/guide-riot/)
-- [Storybook for Preact](/basics/guide-preact/)
diff --git a/docs/src/pages/configurations/custom-webpack-config/index.md b/docs/src/pages/configurations/custom-webpack-config/index.md
index 3799d04f2b7..e2106ec7d30 100644
--- a/docs/src/pages/configurations/custom-webpack-config/index.md
+++ b/docs/src/pages/configurations/custom-webpack-config/index.md
@@ -5,6 +5,143 @@ title: 'Custom Webpack Config'
 
 You can customize Storybook's webpack setup by providing a `webpack.config.js` file exporting a **webpack 4** compatible config exported as a **commonjs module**.
 
+Storybook has its own Webpack setup and a dev server. 
+The webpack config [is configurable](/configurations/webpack), and the default can depend on whether you are using [Create React App](https://github.com/facebookincubator/create-react-app).
+
+Here's what the default webpack looks like in dev-mode:
+```js
+{
+  mode: 'development',
+  bail: false,
+  devtool: '#cheap-module-source-map',
+  entry: [
+    '@storybook/core/dist/server/common/polyfills.js',
+    '@storybook/core/dist/server/preview/globals.js',
+    '<your-storybook-dir>/config.js',
+    'webpack-hot-middleware/client.js?reload=true',
+  ],
+  output: {
+    path: './',
+    filename: '[name].[hash].bundle.js',
+    publicPath: '',
+  },
+  plugins: [
+    HtmlWebpackPlugin {
+      options: {
+        template: '@storybook/core/dist/server/templates/index.ejs',
+        templateContent: false,
+        templateParameters: [Function: templateParameters],
+        filename: 'iframe.html',
+        hash: false,
+        inject: false,
+        compile: true,
+        favicon: false,
+        minify: undefined,
+        cache: true,
+        showErrors: true,
+        chunks: 'all',
+        excludeChunks: [],
+        chunksSortMode: 'none',
+        meta: {},
+        title: 'Webpack App',
+        xhtml: false,
+        alwaysWriteToDisk: true,
+      },
+    },
+    DefinePlugin {
+      definitions: {
+        'process.env': {
+          NODE_ENV: '"development"',
+          NODE_PATH: '""',
+          PUBLIC_URL: '"."',
+          '<storybook-environment-variables>'
+          '<dotenv-environment-variables>'
+        },
+      },
+    },
+    WatchMissingNodeModulesPlugin {
+      nodeModulesPath: './node_modules',
+    },
+    HotModuleReplacementPlugin {},
+    CaseSensitivePathsPlugin {},
+    ProgressPlugin {},
+    DefinePlugin {
+      definitions: {
+        '<storybook-environment-variables>'
+        '<dotenv-environment-variables>'
+      },
+    },
+  ],
+  module: {
+    rules: [
+      { test: /\.(mjs|jsx?)$/, 
+        use: [
+          { loader: 'babel-loader', options:
+            { cacheDirectory: './node_modules/.cache/storybook',
+              presets: [
+                [ './node_modules/@babel/preset-env/lib/index.js', { shippedProposals: true, useBuiltIns: 'usage' } ],
+                './node_modules/@babel/preset-react/lib/index.js',
+                './node_modules/@babel/preset-flow/lib/index.js',
+              ],
+              plugins: [
+                './node_modules/@babel/plugin-proposal-object-rest-spread/lib/index.js',
+                './node_modules/@babel/plugin-proposal-class-properties/lib/index.js',
+                './node_modules/@babel/plugin-syntax-dynamic-import/lib/index.js',
+                [ './node_modules/babel-plugin-emotion/dist/babel-plugin-emotion.cjs.js', { sourceMap: true, autoLabel: true } ],
+                './node_modules/babel-plugin-macros/dist/index.js',
+                './node_modules/@babel/plugin-transform-react-constant-elements/lib/index.js',
+                './node_modules/babel-plugin-add-react-displayname/index.js',
+                [ './node_modules/babel-plugin-react-docgen/lib/index.js', { DOC_GEN_COLLECTION_NAME: 'STORYBOOK_REACT_CLASSES' } ],
+              ],
+            },
+          },
+        ],
+        include: [ './' ],
+        exclude: [ './node_modules' ],
+      },
+      { test: /\.md$/, 
+        use: [
+          { loader: './node_modules/raw-loader/index.js' },
+        ],
+      },
+      { test: /\.css$/,
+        use: [
+          './node_modules/style-loader/index.js',
+          { loader: './node_modules/css-loader/dist/cjs.js', options: { importLoaders: 1 } },
+          { loader: './node_modules/postcss-loader/src/index.js', options: { ident: 'postcss', postcss: {}, plugins: [Function: plugins] } },
+        ],
+      },
+      { test: /\.(svg|ico|jpg|jpeg|png|gif|eot|otf|webp|ttf|woff|woff2|cur|ani)(\?.*)?$/,
+        loader: './node_modules/file-loader/dist/cjs.js',
+        query: { name: 'static/media/[name].[hash:8].[ext]' },
+      },
+      { test: /\.(mp4|webm|wav|mp3|m4a|aac|oga)(\?.*)?$/,
+        loader: './node_modules/url-loader/dist/cjs.js',
+        query: { limit: 10000, name: 'static/media/[name].[hash:8].[ext]' },
+      },
+    ],
+  },
+  resolve: {
+    extensions: [ '.mjs', '.js', '.jsx', '.json' ],
+    modules: [ 'node_modules' ],
+    mainFields: [ 'browser', 'main', 'module' ],
+    alias: {
+      'core-js': './node_modules/core-js',
+      react: './node_modules/react',
+      'react-dom': './node_modules/react-dom',
+    },
+  },
+  optimization: {
+    splitChunks: { chunks: 'all' },
+    runtimeChunk: true,
+    minimizer: [ [Object] ],
+  },
+  performance: { hints: false },
+}
+```
+
+
+
 The file can export an object or a function. The former configures in [extend mode](#extend-mode), the latter in [full control mode](#full-control-mode), both described here.
 
 ## Extend Mode
diff --git a/docs/src/pages/guides/guide-angular/index.md b/docs/src/pages/guides/guide-angular/index.md
new file mode 100644
index 00000000000..1f0c082c627
--- /dev/null
+++ b/docs/src/pages/guides/guide-angular/index.md
@@ -0,0 +1,147 @@
+---
+id: 'guide-angular'
+title: 'Storybook for Angular'
+---
+
+## Automatic setup
+
+You may have tried to use our quick start guide to setup your project for Storybook.
+If it failed because it couldn't detect you're using angular, you could try forcing it to use angular:
+
+```sh
+npx -p @storybook/cli sb init --type angular
+```
+
+## Manual setup
+
+If you want to set up Storybook manually for your Angular project, this is the guide for you.
+
+## Step 1: Add dependencies
+
+### Add @storybook/angular
+
+Add `@storybook/angular` to your project. To do that, run:
+
+```sh
+npm install @storybook/angular --save-dev
+```
+
+### Add @babel/core, and babel-loader
+
+Make sure that you have `@babel/core`, and `babel-loader` in your dependencies as well because we list these as a peer dependencies:
+
+```sh
+npm install babel-loader @babel/core --save-dev 
+```
+
+## Step 2: Add a npm script
+
+Then add the following NPM script to your `package.json` in order to start the storybook later in this guide:
+
+```json
+{
+  "scripts": {
+    "storybook": "start-storybook"
+  }
+}
+```
+
+## Step 3: Create the config file
+
+For a basic Storybook configuration, the only thing you need to do is tell Storybook where to find stories.
+
+To do that, create a file at `.storybook/config.js` with the following content:
+
+```ts
+import { configure } from '@storybook/angular';
+
+function loadStories() {
+  require('../stories/index.js');
+  // You can require as many stories as you need.
+}
+
+configure(loadStories, module);
+```
+
+That'll load stories in `../stories/index.js`. You can choose where to place stories, you can co-locate them with source files, or place them in an other directory.
+
+> Requiring all your stories becomes bothersome real quick, so you can use this to load all stories matching a glob.
+> 
+> <details>
+>   <summary>details</summary>
+> 
+> ```ts
+> import { configure } from '@storybook/angular';
+> 
+> function loadStories() {
+>   const req = require.context('../stories', true, /\.stories\.ts$/);
+>   req.keys().forEach(filename => req(filename));
+> }
+> 
+> configure(loadStories, module);
+> ```
+> 
+> </details>
+
+## Step 4: Storybook TypeScript configuration
+
+`@storybook/angular` is using [ForkTsCheckerWebpackPlugin](https://github.com/Realytics/fork-ts-checker-webpack-plugin) to boost the build performance. 
+This makes it necessary to create a `tsconfig.json` file at `.storybook/tsconfig.json` with the following content:
+
+```json
+{
+  "extends": "../tsconfig.json",
+  "exclude": [
+    "../src/test.ts",
+    "../src/**/*.spec.ts",
+    "../projects/**/*.spec.ts"
+  ],
+  "include": [
+    "../src/**/*",
+    "../projects/**/*"
+  ]
+}
+```
+
+## Step 5: Write your stories
+
+Now create a `../stories/index.js` file, and write your first story like this:
+
+```ts
+import { storiesOf } from '@storybook/angular';
+import { Button } from '@storybook/angular/demo';
+
+storiesOf('My Button', module)
+  .add('with emoji', () => ({
+    component: Button,
+    props: {
+      text: '😀 😎 👍 💯',
+    },
+  }))
+  .add('with emoji', () => ({
+    component: Button,
+    props: {
+      text: '😀 😎 👍 💯',
+    },
+  }));
+```
+
+Each story is a single state of your component. In the above case, there are two stories for the demo button component:
+
+```plaintext
+Button
+  ├── with text
+  └── with emoji
+```
+
+## Finally: Run your Storybook
+
+Now everything is ready. Run your storybook with:
+
+```sh
+npm run storybook
+```
+
+Storybook should start, on a random open port in dev-mode.
+
+Now you can develop your components and write stories and see the changes in Storybook immediately since it uses Webpack's hot module reloading.
diff --git a/docs/src/pages/basics/guide-ember/index.md b/docs/src/pages/guides/guide-ember/index.md
similarity index 100%
rename from docs/src/pages/basics/guide-ember/index.md
rename to docs/src/pages/guides/guide-ember/index.md
diff --git a/docs/src/pages/guides/guide-html/index.md b/docs/src/pages/guides/guide-html/index.md
new file mode 100644
index 00000000000..8db981a626d
--- /dev/null
+++ b/docs/src/pages/guides/guide-html/index.md
@@ -0,0 +1,128 @@
+---
+id: 'guide-html'
+title: 'Storybook for HTML'
+---
+
+## Automatic setup
+
+You may have tried to use our quick start guide to setup your project for Storybook.
+If it failed because it couldn't detect you're using html, you could try forcing it to use html:
+
+```sh
+npx -p @storybook/cli sb init --type html
+```
+
+## Manual setup
+
+If you want to set up Storybook manually for your html project, this is the guide for you.
+
+## Step 1: Add dependencies
+
+### Init npm if necessary
+
+If you don't have `package.json` in your project, you'll need to init it first:
+
+```sh
+npm init
+```
+
+### Add @storybook/html
+
+Add `@storybook/html` to your project. To do that, run:
+
+```sh
+npm install @storybook/html --save-dev
+```
+
+### Add @babel/core and babel-loader
+
+Make sure that you have `@babel/core`, and `babel-loader` in your dependencies as well because we list these as a peer dependencies:
+
+```sh
+npm install babel-loader @babel/core --save-dev 
+```
+
+## Step 2: Add a npm script
+
+Then add the following NPM script to your `package.json` in order to start the storybook later in this guide:
+
+```json
+{
+  "scripts": {
+    "storybook": "start-storybook"
+  }
+}
+```
+
+## Step 3: Create the config file
+
+For a basic Storybook configuration, the only thing you need to do is tell Storybook where to find stories.
+
+To do that, create a file at `.storybook/config.js` with the following content:
+
+```js
+import { configure } from '@storybook/html';
+
+function loadStories() {
+  require('../stories/index.js');
+  // You can require as many stories as you need.
+}
+
+configure(loadStories, module);
+```
+
+That'll load stories in `../stories/index.js`. You can choose where to place stories, you can co-locate them with source files, or place them in an other directory.
+
+> Requiring all your stories becomes bothersome real quick, so you can use this to load all stories matching a glob.
+> 
+> <details>
+>   <summary>details</summary>
+> 
+> ```js
+> import { configure } from '@storybook/html';
+> 
+> function loadStories() {
+>   const req = require.context('../stories', true, /\.stories\.js$/);
+>   req.keys().forEach(filename => req(filename));
+> }
+> 
+> configure(loadStories, module);
+> ```
+> 
+> </details>
+
+## Step 4: Write your stories
+
+Now create a `../stories/index.js` file, and write your first story like this:
+
+```js
+import { storiesOf } from '@storybook/html';
+
+storiesOf('Button', module)
+  .add('with text', () => '<button class="btn">Hello World</button>')
+  .add('with emoji', () => {
+    const button = document.createElement('button');
+    button.innerText = '😀 😎 👍 💯';
+    return button;
+  });
+```
+
+Each story is a single state of your component. In the above case, there are two stories for the demo button component:
+
+```plaintext
+Button
+  ├── with text
+  └── with emoji
+```
+
+## Finally: Run your Storybook
+
+Now everything is ready. Run your storybook with:
+
+```sh
+npm run storybook
+```
+
+Storybook should start, on a random open port in dev-mode.
+
+Now you can develop your components and write stories and see the changes in Storybook immediately since it uses Webpack's hot module reloading.
diff --git a/docs/src/pages/guides/guide-marko/index.md b/docs/src/pages/guides/guide-marko/index.md
new file mode 100644
index 00000000000..943efbb5529
--- /dev/null
+++ b/docs/src/pages/guides/guide-marko/index.md
@@ -0,0 +1,120 @@
+---
+id: 'guide-marko'
+title: 'Storybook for Marko'
+---
+
+## Automatic setup
+
+You may have tried to use our quick start guide to setup your project for Storybook.
+If it failed because it couldn't detect you're using marko, you could try forcing it to use marko:
+
+```sh
+npx -p @storybook/cli sb init --type marko
+```
+
+## Manual setup
+
+If you want to set up Storybook manually for your marko project, this is the guide for you.
+
+## Step 1: Add dependencies
+
+### Add @storybook/marko
+
+Add `@storybook/marko` to your project. To do that, run:
+
+```sh
+npm install @storybook/marko --save-dev
+```
+
+### Add marko, @babel/core and babel-loader
+
+Make sure that you have `marko`, `@babel/core`, and `babel-loader` in your dependencies as well because we list these as a peer dependencies:
+
+```sh
+npm install babel-loader @babel/core --save-dev 
+```
+
+## Step 2: Add a npm script
+
+Then add the following NPM script to your `package.json` in order to start the storybook later in this guide:
+
+```json
+{
+  "scripts": {
+    "storybook": "start-storybook"
+  }
+}
+```
+
+## Step 3: Create the config file
+
+For a basic Storybook configuration, the only thing you need to do is tell Storybook where to find stories.
+
+To do that, create a file at `.storybook/config.js` with the following content:
+
+```js
+import { configure } from '@storybook/marko';
+
+function loadStories() {
+  require('../stories/index.js');
+  // You can require as many stories as you need.
+}
+
+configure(loadStories, module);
+```
+
+That'll load stories in `../stories/index.js`. You can choose where to place stories, you can co-locate them with source files, or place them in an other directory.
+
+> Requiring all your stories becomes bothersome real quick, so you can use this to load all stories matching a glob.
+> 
+> <details>
+>   <summary>details</summary>
+> 
+> ```js
+> import { configure } from '@storybook/marko';
+> 
+> function loadStories() {
+>   const req = require.context('../stories', true, /\.stories\.js$/);
+>   req.keys().forEach(filename => req(filename));
+> }
+> 
+> configure(loadStories, module);
+> ```
+> 
+> </details>
+
+## Step 4: Write your stories
+
+Now create a `../stories/index.js` file, and write your first story like this:
+
+```js
+/** @jsx m */
+
+import m from 'marko';
+import { storiesOf } from '@storybook/marko';
+import Button from '../components/button/index.marko';
+
+storiesOf('Button', module)
+  .add('with text', () => Button.renderSync({ text: 'some text'}))
+  .add('with emoji', () => Button.renderSync({ text: '😀 😎 👍 💯'}));
+```
+
+Each story is a single state of your component. In the above case, there are two stories for the demo button component:
+
+```plaintext
+Button
+  ├── with text
+  └── with emoji
+```
+
+## Finally: Run your Storybook
+
+Now everything is ready. Run your storybook with:
+
+```sh
+npm run storybook
+```
+
+Storybook should start, on a random open port in dev-mode.
+
+Now you can develop your components and write stories and see the changes in Storybook immediately since it uses Webpack's hot module reloading.
diff --git a/docs/src/pages/guides/guide-mithril/index.md b/docs/src/pages/guides/guide-mithril/index.md
new file mode 100644
index 00000000000..5cd447794e1
--- /dev/null
+++ b/docs/src/pages/guides/guide-mithril/index.md
@@ -0,0 +1,125 @@
+---
+id: 'guide-mithril'
+title: 'Storybook for Mithril'
+---
+
+## Automatic setup
+
+You may have tried to use our quick start guide to setup your project for Storybook.
+If it failed because it couldn't detect you're using mithril, you could try forcing it to use mithril:
+
+```sh
+npx -p @storybook/cli sb init --type mithril
+```
+
+## Manual setup
+
+If you want to set up Storybook manually for your mithril project, this is the guide for you.
+
+## Step 1: Add dependencies
+
+### Add @storybook/mithril
+
+Add `@storybook/mithril` to your project. To do that, run:
+
+```sh
+npm install @storybook/mithril --save-dev
+```
+
+### Add mithril, @babel/core and babel-loader
+
+Make sure that you have `mithril`, `@babel/core`, and `babel-loader` in your dependencies as well because we list these as a peer dependencies:
+
+```sh
+npm install mithril --save
+npm install babel-loader @babel/core --save-dev 
+```
+
+## Step 2: Add a npm script
+
+Then add the following NPM script to your `package.json` in order to start the storybook later in this guide:
+
+```json
+{
+  "scripts": {
+    "storybook": "start-storybook"
+  }
+}
+```
+
+## Step 3: Create the config file
+
+For a basic Storybook configuration, the only thing you need to do is tell Storybook where to find stories.
+
+To do that, create a file at `.storybook/config.js` with the following content:
+
+```js
+import { configure } from '@storybook/mithril';
+
+function loadStories() {
+  require('../stories/index.js');
+  // You can require as many stories as you need.
+}
+
+configure(loadStories, module);
+```
+
+That'll load stories in `../stories/index.js`. You can choose where to place stories, you can co-locate them with source files, or place them in an other directory.
+
+> Requiring all your stories becomes bothersome real quick, so you can use this to load all stories matching a glob.
+> 
+> <details>
+>   <summary>details</summary>
+> 
+> ```js
+> import { configure } from '@storybook/mithril';
+> 
+> function loadStories() {
+>   const req = require.context('../stories', true, /\.stories\.js$/);
+>   req.keys().forEach(filename => req(filename));
+> }
+> 
+> configure(loadStories, module);
+> ```
+> 
+> </details>
+
+## Step 4: Write your stories
+
+Now create a `../stories/index.js` file, and write your first story like this:
+
+```js
+/** @jsx m */
+
+import m from 'mithril';
+import { storiesOf } from '@storybook/mithril';
+import { Button } from '<your-button>';
+
+storiesOf('Button', module)
+  .add('with text', () => (
+    <Button>Hello Button</Button>
+  ))
+  .add('with emoji', () => (
+    <Button><span role="img" aria-label="so cool">😀 😎 👍 💯</span></Button>
+  ));
+```
+
+Each story is a single state of your component. In the above case, there are two stories for the demo button component:
+
+```plaintext
+Button
+  ├── with text
+  └── with emoji
+```
+
+## Finally: Run your Storybook
+
+Now everything is ready. Run your storybook with:
+
+```sh
+npm run storybook
+```
+
+Storybook should start, on a random open port in dev-mode.
+
+Now you can develop your components and write stories and see the changes in Storybook immediately since it uses Webpack's hot module reloading.
diff --git a/docs/src/pages/guides/guide-preact/index.md b/docs/src/pages/guides/guide-preact/index.md
new file mode 100644
index 00000000000..21f33354d9f
--- /dev/null
+++ b/docs/src/pages/guides/guide-preact/index.md
@@ -0,0 +1,123 @@
+---
+id: 'guide-preact'
+title: 'Storybook for Preact'
+---
+
+## Automatic setup
+
+You may have tried to use our quick start guide to setup your project for Storybook.
+If it failed because it couldn't detect you're using preact, you could try forcing it to use preact:
+
+```sh
+npx -p @storybook/cli sb init --type preact
+```
+
+## Manual setup
+
+If you want to set up Storybook manually for your preact project, this is the guide for you.
+
+## Step 1: Add dependencies
+
+### Add @storybook/preact
+
+Add `@storybook/preact` to your project. To do that, run:
+
+```sh
+npm install @storybook/preact --save-dev
+```
+
+### Add preact, @babel/core and babel-loader
+
+Make sure that you have `preact`, `@babel/core`, and `babel-loader` in your dependencies as well because we list these as a peer dependencies:
+
+```sh
+npm install preact --save
+npm install babel-loader @babel/core --save-dev 
+```
+
+## Step 2: Add a npm script
+
+Then add the following NPM script to your `package.json` in order to start the storybook later in this guide:
+
+```json
+{
+  "scripts": {
+    "storybook": "start-storybook"
+  }
+}
+```
+
+## Step 3: Create the config file
+
+For a basic Storybook configuration, the only thing you need to do is tell Storybook where to find stories.
+
+To do that, create a file at `.storybook/config.js` with the following content:
+
+```js
+import { configure } from '@storybook/preact';
+
+function loadStories() {
+  require('../stories/index.js');
+  // You can require as many stories as you need.
+}
+
+configure(loadStories, module);
+```
+
+That'll load stories in `../stories/index.js`. You can choose where to place stories, you can co-locate them with source files, or place them in an other directory.
+
+> Requiring all your stories becomes bothersome real quick, so you can use this to load all stories matching a glob.
+> 
+> <details>
+>   <summary>details</summary>
+> 
+> ```js
+> import { configure } from '@storybook/preact';
+> 
+> function loadStories() {
+>   const req = require.context('../stories', true, /\.stories\.js$/);
+>   req.keys().forEach(filename => req(filename));
+> }
+> 
+> configure(loadStories, module);
+> ```
+> 
+> </details>
+
+## Step 4: Write your stories
+
+Now create a `../stories/index.js` file, and write your first story like this:
+
+```js
+import { h } from 'preact';
+import { storiesOf } from '@storybook/preact';
+import { Button } from '<your-button>';
+
+storiesOf('Button', module)
+  .add('with text', () => (
+    <Button>Hello Button</Button>
+  ))
+  .add('with emoji', () => (
+    <Button><span role="img" aria-label="so cool">😀 😎 👍 💯</span></Button>
+  ));
+```
+
+Each story is a single state of your component. In the above case, there are two stories for the demo button component:
+
+```plaintext
+Button
+  ├── with text
+  └── with emoji
+```
+
+## Finally: Run your Storybook
+
+Now everything is ready. Run your storybook with:
+
+```sh
+npm run storybook
+```
+
+Storybook should start, on a random open port in dev-mode.
+
+Now you can develop your components and write stories and see the changes in Storybook immediately since it uses Webpack's hot module reloading.
diff --git a/docs/src/pages/basics/guide-react-native/index.md b/docs/src/pages/guides/guide-react-native/index.md
similarity index 95%
rename from docs/src/pages/basics/guide-react-native/index.md
rename to docs/src/pages/guides/guide-react-native/index.md
index f7d6adada7f..5a1d3a55daf 100644
--- a/docs/src/pages/basics/guide-react-native/index.md
+++ b/docs/src/pages/guides/guide-react-native/index.md
@@ -5,13 +5,14 @@ title: 'Storybook for React Native'
 
 This guide will help you to manually setup React Native Storybook and explain about addons and Storybook server. 
 
+## Automatic setup
 
-## Table of contents
+You may have tried to use our quick start guide to setup your project for Storybook.
+If it failed because it couldn't detect you're using react-native, you could try forcing it to use react-native:
 
--   [Manual setup](#manual-setup)
--   [Writing stories](#writing-stories)
--   [Addons](#addons)
--   [Storybook Server](#storybook-server)
+```sh
+npx -p @storybook/cli sb init --type react-native
+```
 
 ## Manual setup
 
diff --git a/docs/src/pages/guides/guide-react/index.md b/docs/src/pages/guides/guide-react/index.md
new file mode 100644
index 00000000000..51d47c08b79
--- /dev/null
+++ b/docs/src/pages/guides/guide-react/index.md
@@ -0,0 +1,123 @@
+---
+id: 'guide-react'
+title: 'Storybook for React'
+---
+
+## Automatic setup
+
+You may have tried to use our quick start guide to setup your project for Storybook.
+If it failed because it couldn't detect you're using react, you could try forcing it to use react:
+
+```sh
+npx -p @storybook/cli sb init --type react
+```
+
+## Manual setup
+
+If you want to set up Storybook manually for your React project, this is the guide for you.
+
+## Step 1: Add dependencies
+
+### Add @storybook/react
+
+Add `@storybook/react` to your project. To do that, run:
+
+```sh
+npm install @storybook/react --save-dev
+```
+
+### Add react, react-dom, @babel/core, and babel-loader
+
+Make sure that you have `react`, `react-dom`, `@babel/core`, and `babel-loader` in your dependencies as well because we list these as a peer dependencies:
+
+```sh
+npm install react react-dom --save
+npm install babel-loader @babel/core --save-dev 
+```
+
+## Step 2: Add a npm script
+
+Then add the following NPM script to your `package.json` in order to start the storybook later in this guide:
+
+```json
+{
+  "scripts": {
+    "storybook": "start-storybook"
+  }
+}
+```
+
+## Step 3: Create the config file
+
+For a basic Storybook configuration, the only thing you need to do is tell Storybook where to find stories.
+
+To do that, create a file at `.storybook/config.js` with the following content:
+
+```js
+import { configure } from '@storybook/react';
+
+function loadStories() {
+  require('../stories/index.js');
+  // You can require as many stories as you need.
+}
+
+configure(loadStories, module);
+```
+
+That'll load stories in `../stories/index.js`. You can choose where to place stories, you can co-locate them with source files, or place them in an other directory.
+
+> Requiring all your stories becomes bothersome real quick, so you can use this to load all stories matching a glob.
+> 
+> <details>
+>   <summary>details</summary>
+> 
+> ```js
+> import { configure } from '@storybook/react';
+> 
+> function loadStories() {
+>   const req = require.context('../stories', true, /\.stories\.js$/);
+>   req.keys().forEach(filename => req(filename));
+> }
+> 
+> configure(loadStories, module);
+> ```
+> 
+> </details>
+
+## Step 4: Write your stories
+
+Now create a `../stories/index.js` file, and write your first story like this:
+
+```js
+import React from 'react';
+import { storiesOf } from '@storybook/react';
+import { Button } from '@storybook/react/demo';
+
+storiesOf('Button', module)
+  .add('with text', () => (
+    <Button>Hello Button</Button>
+  ))
+  .add('with emoji', () => (
+    <Button><span role="img" aria-label="so cool">😀 😎 👍 💯</span></Button>
+  ));   
+```
+
+Each story is a single state of your component. In the above case, there are two stories for the demo button component:
+
+```plaintext
+Button
+  ├── with text
+  └── with emoji
+```
+
+## Finally: Run your Storybook
+
+Now everything is ready. Run your storybook with:
+
+```sh
+npm run storybook
+```
+
+Storybook should start, on a random open port in dev-mode.
+
+Now you can develop your components and write stories and see the changes in Storybook immediately since it uses Webpack's hot module reloading.
diff --git a/docs/src/pages/guides/guide-react/new.md b/docs/src/pages/guides/guide-react/new.md
new file mode 100644
index 00000000000..6e304e575bf
--- /dev/null
+++ b/docs/src/pages/guides/guide-react/new.md
@@ -0,0 +1,158 @@
+
+## Automatic setup
+
+You may have tried to use our quick start guide to setup your project for Storybook.
+If it failed because it couldn't detect you're using vue, you could try forcing it to use vue:
+
+```sh
+npx -p @storybook/cli sb init --type vue
+```
+
+## Manual setup
+
+If you want to set up Storybook manually for your React project, this is the guide for you.
+
+## Step 1: Add dependencies
+
+### Add @storybook/vue
+
+Add `@storybook/vue` to your project. To do that, run:
+
+```sh
+npm install @storybook/vue --save-dev
+```
+
+### Add vue, vue-dom, @babel/core, and babel-loader
+
+Make sure that you have `vue`, `vue-loader`, `vue-template-compiler`, `@babel/core`, and `babel-loader` in your dependencies as well because we list these as a peer dependencies:
+
+```sh
+npm install vue --save
+npm install babel-loader vue-loader vue-template-compiler @babel/core --save-dev 
+```
+
+## Step 2: Add a npm script
+
+Then add the following NPM script to your `package.json` in order to start the storybook later in this guide:
+
+```json
+{
+  "scripts": {
+    "storybook": "start-storybook"
+  }
+}
+```
+
+## Step 3: Create the config file
+
+For a basic Storybook configuration, the only thing you need to do is tell Storybook where to find stories.
+
+To do that, create a file at `.storybook/config.js` with the following content:
+
+```js
+import { configure } from '@storybook/vue';
+
+function loadStories() {
+  require('../stories/index.js');
+  // You can require as many stories as you need.
+}
+
+configure(loadStories, module);
+```
+
+That'll load stories in `../stories/index.js`. You can choose where to place stories, you can co-locate them with source files, or place them in an other directory.
+
+> Requiring all your stories becomes bothersome real quick, so you can use this to load all stories matching a glob.
+> 
+> <details>
+>   <summary>details</summary>
+> 
+> ```js
+> import { configure } from '@storybook/vue';
+> 
+> function loadStories() {
+>   const req = require.context('../stories', true, /\.stories\.js$/);
+>   req.keys().forEach(filename => req(filename));
+> }
+> 
+> configure(loadStories, module);
+> ```
+> 
+> </details>
+
+
+> You might be using global components or vue plugins such as vuex, in that case you'll need to register them in this `config.js` file.
+> 
+> <details>
+>   <summary>details</summary>
+> 
+> ```js
+> import { configure } from '@storybook/vue';
+> 
+> import Vue from 'vue';
+> 
+> // Import Vue plugins
+> import Vuex from 'vuex';
+> 
+> // Import your global components.
+> import Mybutton from '../src/stories/Button.vue';
+> 
+> // Install Vue plugins.
+> Vue.use(Vuex);
+> 
+> // Register global components.
+> Vue.component('my-button', Mybutton);
+> 
+> function loadStories() {
+>   // You can require as many stories as you need.
+>   require('../src/stories');
+> }
+> 
+> configure(loadStories, module);
+> ```
+> 
+> This example registered your custom `Button.vue` component, installed the Vuex plugin, and loaded your Storybook stories defined in `../stories/index.js`.
+> 
+> All custom components and Vue plugins should be registered before calling `configure()`.
+> 
+> </details>
+
+
+## Step 4: Write your stories
+
+Now create a `../stories/index.js` file, and write your first story like this:
+
+```js
+import Vue from 'vue';
+import { storiesOf } from '@storybook/vue';
+import MyButton from './Button.vue';
+
+storiesOf('Button', module)
+  .add('with text', () => '<my-button>with text</my-button>')
+  .add('with emoji', () => '<my-button>😀 😎 👍 💯</my-button>')
+  .add('as a component', () => ({
+    components: { MyButton },
+    template: '<my-button :rounded="true">rounded</my-button>'
+  }));
+```
+
+Each story is a single state of your component. In the above case, there are two stories for the demo button component:
+
+```plaintext
+Button
+  ├── with text
+  ├── with emoji
+  └── as a component
+```
+
+## Finally: Run your Storybook
+
+Now everything is ready. Run your storybook with:
+
+```sh
+npm run storybook
+```
+
+Storybook should start, on a random open port in dev-mode.
+
+Now you can develop your components and write stories and see the changes in Storybook immediately since it uses Webpack's hot module reloading.
diff --git a/docs/src/pages/guides/guide-riot/index.md b/docs/src/pages/guides/guide-riot/index.md
new file mode 100644
index 00000000000..5afa2cacb2e
--- /dev/null
+++ b/docs/src/pages/guides/guide-riot/index.md
@@ -0,0 +1,199 @@
+---
+id: 'guide-riot'
+title: 'Storybook for Riot'
+---
+
+## Automatic setup
+
+You may have tried to use our quick start guide to setup your project for Storybook.
+If it failed because it couldn't detect you're using riot, you could try forcing it to use riot:
+
+```sh
+npx -p @storybook/cli sb init --type riot
+```
+
+## Manual setup
+
+If you want to set up Storybook manually for your Angular project, this is the guide for you.
+
+## Step 1: Add dependencies
+
+### Add @storybook/riot
+
+Add `@storybook/riot` to your project. To do that, run:
+
+```sh
+npm install @storybook/riot --save-dev
+```
+
+### Add riot, @babel/core, and babel-loader
+
+Make sure that you have `riot`, `@babel/core`, and `babel-loader` in your dependencies as well because we list these as a peer dependencies:
+
+```sh
+npm install riot babel-loader @babel/core --save-dev 
+```
+
+## Step 2: Add a npm script
+
+Then add the following NPM script to your `package.json` in order to start the storybook later in this guide:
+
+```json
+{
+  "scripts": {
+    "storybook": "start-storybook"
+  }
+}
+```
+
+## Step 3: Create the config file
+
+For a basic Storybook configuration, the only thing you need to do is tell Storybook where to find stories.
+
+To do that, create a file at `.storybook/config.js` with the following content:
+
+```ts
+import { configure } from '@storybook/riot';
+
+function loadStories() {
+  require('../stories/index.js');
+  // You can require as many stories as you need.
+}
+
+configure(loadStories, module);
+```
+
+That'll load stories in `../stories/index.js`. You can choose where to place stories, you can co-locate them with source files, or place them in an other directory.
+
+> Requiring all your stories becomes bothersome real quick, so you can use this to load all stories matching a glob.
+> 
+> <details>
+>   <summary>details</summary>
+> 
+> ```ts
+> import { configure } from '@storybook/riot';
+> 
+> function loadStories() {
+>   const req = require.context('../stories', true, /\.stories\.ts$/);
+>   req.keys().forEach(filename => req(filename));
+> }
+> 
+> configure(loadStories, module);
+> ```
+> 
+> </details>
+
+
+> Additionally this is the place where you can register global component.
+> 
+> <details>
+>   <summary>details</summary>
+> 
+> ```ts
+> import { configure } from '@storybook/riot';
+> 
+> // Import your globally available components.
+> import '../src/stories/Button.tag'; 
+> 
+> function loadStories() {
+>   require('../stories/index.js');
+>   // You can require as many stories as you need.
+}
+> 
+> configure(loadStories, module);
+> ```
+> 
+> </details>
+
+## Step 4: Storybook TypeScript configuration
+
+`@storybook/riot` is using [ForkTsCheckerWebpackPlugin](https://github.com/Realytics/fork-ts-checker-webpack-plugin) to boost the build performance. 
+This makes it necessary to create a `tsconfig.json` file at `.storybook/tsconfig.json` with the following content:
+
+```json
+{
+  "extends": "../tsconfig.json",
+  "exclude": [
+    "../src/test.ts",
+    "../src/**/*.spec.ts",
+    "../projects/**/*.spec.ts"
+  ],
+  "include": [
+    "../src/**/*",
+    "../projects/**/*"
+  ]
+}
+```
+
+## Step 5: Write your stories
+
+Now create a `../stories/index.js` file, and write your first story like this:
+
+```js
+import { tag, mount, storiesOf } from '@storybook/riot';
+import SimpleTestRaw from './SimpleTest.txt'; //can be loaded as string if you prefer
+import './AnotherTest.tag';
+//if you need to import .tag files as text, just use the raw-loader instead of the riot-tag-loader
+
+storiesOf('My Component', module)
+  .add(
+    'built with tag', // the template is compiled below
+    () =>
+      tag('test', '<div>simple test ({ opts.value })</div>', '', '', () => {}) &&
+      mount('test', { value: 'with a parameter' }))
+
+  // tags[0] will be the parent tag, always
+  // you can leave out the root tag, if we find out that the new root tag
+  // is a built-in html tag, it will be wrapped
+  .add('built as string', () => ({ tags: ['<test><div>simple test</div></test>'] })
+
+  // the component is a string, it will be instantiated without params
+  // e.g. <SimpletestRaw/>
+  .add('built from raw import', () => SimpleTestRaw)
+
+  // the comprehensive form is this one
+  // list all the possible tags (the root element is in the content)
+  // then scenario is compiled and executed
+  .add(
+    'built from tags and scenario',
+    () => ({
+      tags: [{ content: SimpleTestRaw, boundAs: 'mustBeUniquePlease' }],
+      scenario:
+        '<SimpleTest test={ "with a parameter" } value={"value is mapped to riotValue"}></SimpleTest>',
+    }),
+    {
+      notes:
+        'WARN : the tag file root element must have exactly the same name (or else you will see nothing)',
+    }
+  )
+
+  // the tag is already compiled before running the js
+  // the tag name 'anothertest' must match exactly the root tag inside the tag file
+  // mind the lower case
+  .add('built from the precompilation', () => mount('anothertest', {}), {
+    notes: 'WARN, only works in lower case, never upper case with precompiled templates',
+  });
+```
+
+Each story is a single state of your component. In the above case, there are two stories for the demo button component:
+
+```plaintext
+My Component
+  ├── built with tag
+  ├── built as string
+  ├── bubuilt from raw import
+  ├── built from tags and scenario
+  └── built from the precompilation
+```
+
+## Finally: Run your Storybook
+
+Now everything is ready. Run your storybook with:
+
+```sh
+npm run storybook
+```
+
+Storybook should start, on a random open port in dev-mode.
+
+Now you can develop your components and write stories and see the changes in Storybook immediately since it uses Webpack's hot module reloading.
diff --git a/docs/src/pages/guides/guide-svelte/index.md b/docs/src/pages/guides/guide-svelte/index.md
new file mode 100644
index 00000000000..4de2e5329a8
--- /dev/null
+++ b/docs/src/pages/guides/guide-svelte/index.md
@@ -0,0 +1,171 @@
+---
+id: 'guide-svelte'
+title: 'Storybook for Svelte'
+---
+
+## Automatic setup
+
+You may have tried to use our quick start guide to setup your project for Storybook.
+If it failed because it couldn't detect you're using svelte, you could try forcing it to use svelte:
+
+```sh
+npx -p @storybook/cli sb init --type svelte
+```
+
+## Manual setup
+
+If you want to set up Storybook manually for your React project, this is the guide for you.
+
+> It is very important to remember that Svelte components are precompiled from `.svelte` or `.html` files to vanilla javascript, so there is no 'runtime'.
+
+## Step 1: Add dependencies
+
+### Add @storybook/svelte
+
+Add `@storybook/svelte` to your project. To do that, run:
+
+```sh
+npm install @storybook/svelte --save-dev
+```
+
+### @babel/core, and babel-loader
+
+Make sure that you have `@babel/core`, and `babel-loader` in your dependencies as well because we list these as a peer dependencies:
+
+```sh
+npm install babel-loader @babel/core --save-dev 
+```
+
+## Step 2: Add a npm script
+
+Then add the following NPM script to your `package.json` in order to start the storybook later in this guide:
+
+```json
+{
+  "scripts": {
+    "storybook": "start-storybook"
+  }
+}
+```
+
+## Step 3: Create the config file
+
+For a basic Storybook configuration, the only thing you need to do is tell Storybook where to find stories.
+
+To do that, create a file at `.storybook/config.js` with the following content:
+
+```js
+import { configure } from '@storybook/svelte';
+
+function loadStories() {
+  require('../stories/index.js');
+  // You can require as many stories as you need.
+}
+
+configure(loadStories, module);
+```
+
+That'll load stories in `../stories/index.js`. You can choose where to place stories, you can co-locate them with source files, or place them in an other directory.
+
+> Requiring all your stories becomes bothersome real quick, so you can use this to load all stories matching a glob.
+> 
+> <details>
+>   <summary>details</summary>
+> 
+> ```js
+> import { configure } from '@storybook/svelte';
+> 
+> function loadStories() {
+>   const req = require.context('../stories', true, /\.stories\.js$/);
+>   req.keys().forEach(filename => req(filename));
+> }
+> 
+> configure(loadStories, module);
+> ```
+> 
+> </details>
+
+## Step 4: Write your stories
+
+Now create a `../stories/index.js` file, and write your first story like this:
+
+```js
+import { storiesOf } from '@storybook/svelte';
+import MyButton from '../components/MyButton.svelte';
+
+storiesOf('MyButton', module)
+  .add('with text', () => ({
+    Component: MyButton,
+    data: {
+      buttonText: 'some text',
+    },
+  })),
+  .add('with text', () => ({
+    Component: MyButton,
+
+    data: {
+      buttonText: '😀 😎 👍 💯',
+    },
+  }));
+```
+
+Svelte storybooks don't support using templates in a story yet. 
+Instead, you can create a `.svelte` file to compose components together, or simply to access all normal Svelte functionality, like slots.
+
+So you can create a story "view" file, essentially just a .svelte file to load your components into to test.
+
+```html
+<!-- MyButtonView  -->
+<MyButton rounded="{rounded}" on:click>
+  {buttonText}
+</Button>
+```
+
+In this example, the `on:click` that is heard on the `MyButton` component is simply passed up to the containing component `MyButtonView` using the svelte shorthand.
+It's the equivalent to `on:click="fire('click', event)"`, but it's worth knowing about especially in this "component wrapper" scenario.
+
+> If your component doesn't use slots, you don't need to do this, but if it does or some other svelte functionality that requires the component to exist in a svelte view, then this is how to do that.
+
+You would then write a story for this "view" the exact same way you did with a component.
+
+```js
+import { storiesOf } from '@storybook/svelte';
+import MyButtonView from '../views/MyButtonView.svelte';
+
+storiesOf('Button', module)
+  .add('wrapped component(s) example', () => ({
+    Components: MyButtonView,
+
+    data: {
+      buttonText: 'some text',
+      rounded: true,
+    },
+
+    on: {
+      click: (event) => {
+        console.log('clicked', event);
+      },
+    },
+  }));
+```
+
+Each story is a single state of your component. In the above case, there are two stories for the demo button component:
+
+```plaintext
+Button
+  ├── with text
+  ├── with emoji
+  └── wrapped component(s) example
+```
+
+## Finally: Run your Storybook
+
+Now everything is ready. Run your storybook with:
+
+```sh
+npm run storybook
+```
+
+Storybook should start, on a random open port in dev-mode.
+
+Now you can develop your components and write stories and see the changes in Storybook immediately since it uses Webpack's hot module reloading.
diff --git a/docs/src/pages/guides/guide-vue/index.md b/docs/src/pages/guides/guide-vue/index.md
new file mode 100644
index 00000000000..c11a4e55102
--- /dev/null
+++ b/docs/src/pages/guides/guide-vue/index.md
@@ -0,0 +1,162 @@
+---
+id: 'guide-vue'
+title: 'Storybook for Vue'
+---
+
+## Automatic setup
+
+You may have tried to use our quick start guide to setup your project for Storybook.
+If it failed because it couldn't detect you're using vue, you could try forcing it to use vue:
+
+```sh
+npx -p @storybook/cli sb init --type vue
+```
+
+## Manual setup
+
+If you want to set up Storybook manually for your React project, this is the guide for you.
+
+## Step 1: Add dependencies
+
+### Add @storybook/vue
+
+Add `@storybook/vue` to your project. To do that, run:
+
+```sh
+npm install @storybook/vue --save-dev
+```
+
+### Add vue, vue-dom, @babel/core, and babel-loader
+
+Make sure that you have `vue`, `vue-loader`, `vue-template-compiler`, `@babel/core`, and `babel-loader` in your dependencies as well because we list these as a peer dependencies:
+
+```sh
+npm install vue --save
+npm install babel-loader vue-loader vue-template-compiler @babel/core --save-dev 
+```
+
+## Step 2: Add a npm script
+
+Then add the following NPM script to your `package.json` in order to start the storybook later in this guide:
+
+```json
+{
+  "scripts": {
+    "storybook": "start-storybook"
+  }
+}
+```
+
+## Step 3: Create the config file
+
+For a basic Storybook configuration, the only thing you need to do is tell Storybook where to find stories.
+
+To do that, create a file at `.storybook/config.js` with the following content:
+
+```js
+import { configure } from '@storybook/vue';
+
+function loadStories() {
+  require('../stories/index.js');
+  // You can require as many stories as you need.
+}
+
+configure(loadStories, module);
+```
+
+That'll load stories in `../stories/index.js`. You can choose where to place stories, you can co-locate them with source files, or place them in an other directory.
+
+> Requiring all your stories becomes bothersome real quick, so you can use this to load all stories matching a glob.
+> 
+> <details>
+>   <summary>details</summary>
+> 
+> ```js
+> import { configure } from '@storybook/vue';
+> 
+> function loadStories() {
+>   const req = require.context('../stories', true, /\.stories\.js$/);
+>   req.keys().forEach(filename => req(filename));
+> }
+> 
+> configure(loadStories, module);
+> ```
+> 
+> </details>
+
+
+> You might be using global components or vue plugins such as vuex, in that case you'll need to register them in this `config.js` file.
+> 
+> <details>
+>   <summary>details</summary>
+> 
+> ```js
+> import { configure } from '@storybook/vue';
+> 
+> import Vue from 'vue';
+> 
+> // Import Vue plugins
+> import Vuex from 'vuex';
+> 
+> // Import your global components.
+> import Mybutton from '../src/stories/Button.vue';
+> 
+> // Install Vue plugins.
+> Vue.use(Vuex);
+> 
+> // Register global components.
+> Vue.component('my-button', Mybutton);
+> 
+> function loadStories() {
+>   // You can require as many stories as you need.
+>   require('../src/stories');
+> }
+> 
+> configure(loadStories, module);
+> ```
+> 
+> This example registered your custom `Button.vue` component, installed the Vuex plugin, and loaded your Storybook stories defined in `../stories/index.js`.
+> 
+> All custom components and Vue plugins should be registered before calling `configure()`.
+> 
+> </details>
+
+
+## Step 4: Write your stories
+
+Now create a `../stories/index.js` file, and write your first story like this:
+
+```js
+import Vue from 'vue';
+import { storiesOf } from '@storybook/vue';
+import MyButton from './Button.vue';
+
+storiesOf('Button', module)
+  .add('with text', () => '<my-button>with text</my-button>')
+  .add('with emoji', () => '<my-button>😀 😎 👍 💯</my-button>')
+  .add('as a component', () => ({
+    components: { MyButton },
+    template: '<my-button :rounded="true">rounded</my-button>'
+  }));
+```
+
+Each story is a single state of your component. In the above case, there are two stories for the demo button component:
+
+```plaintext
+Button
+  ├── with text
+  ├── with emoji
+  └── as a component
+```
+
+## Finally: Run your Storybook
+
+Now everything is ready. Run your storybook with:
+
+```sh
+npm run storybook
+```
+
+Storybook should start, on a random open port in dev-mode.
+
+Now you can develop your components and write stories and see the changes in Storybook immediately since it uses Webpack's hot module reloading.
diff --git a/docs/src/pages/basics/quick-start-guide/index.md b/docs/src/pages/guides/quick-start-guide/index.md
similarity index 66%
rename from docs/src/pages/basics/quick-start-guide/index.md
rename to docs/src/pages/guides/quick-start-guide/index.md
index 462f1f9dde7..06806a5ca8f 100644
--- a/docs/src/pages/basics/quick-start-guide/index.md
+++ b/docs/src/pages/guides/quick-start-guide/index.md
@@ -15,11 +15,19 @@ npx -p @storybook/cli sb init
 
 The tool inspects your `package.json` to determine which view layer you're using. If you want to develop HTML snippets in storybook, we can't determine that automatically. So to install storybook for HTML, use the `--type` flag to force that the HTML project type:
 
-```
+```sh
 npx -p @storybook/cli sb init --type html
 ```
 
-To setup a project manually, take a look at the [Slow Start Guide](/basics/slow-start-guide/).
+It's also useful if our automatic detection fails.
+
+By default npx will use the latest version, if you want to try out an next version, you can use the following:
+
+```sh
+npx -p @storybook/cli@5.0.0-rc.6 sb init
+```
+
+To setup a project manually, take a look at the [Slow Start Guide](/guides/slow-start-guide/).
 
 Start Storybook with:
 
@@ -33,16 +41,16 @@ Storybook should now be available in the browser with a link provided in the con
 
 To learn more about what the Storybook CLI command `sb init` command does, have a look at the slow start guides:
 
-- [React](/basics/guide-react/)
-- [React Native](/basics/guide-react-native/)
-- [Vue](/basics/guide-vue/)
-- [Angular](/basics/guide-angular/)
-- [Mithril](/basics/guide-mithril/)
-- [Marko](/basics/guide-marko/)
-- [HTML](/basics/guide-html/)
-- [Svelte](/basics/guide-svelte/)
-- [Ember](/basics/guide-ember/)
-- [Riot](/basics/guide-riot/)
-- [Preact](/basics/guide-preact/)
+- [React](/guides/guide-react/)
+- [React Native](/guides/guide-react-native/)
+- [Vue](/guides/guide-vue/)
+- [Angular](/guides/guide-angular/)
+- [Mithril](/guides/guide-mithril/)
+- [Marko](/guides/guide-marko/)
+- [HTML](/guides/guide-html/)
+- [Svelte](/guides/guide-svelte/)
+- [Ember](/guides/guide-ember/)
+- [Riot](/guides/guide-riot/)
+- [Preact](/guides/guide-preact/)
 
 A tutorial is also available at [Learn Storybook](https://www.learnstorybook.com) for a step-by-step guide (only available for React).
diff --git a/docs/src/pages/guides/slow-start-guide/index.md b/docs/src/pages/guides/slow-start-guide/index.md
new file mode 100644
index 00000000000..ce972a6183b
--- /dev/null
+++ b/docs/src/pages/guides/slow-start-guide/index.md
@@ -0,0 +1,17 @@
+---
+id: 'slow-start-guide'
+title: 'Slow Start Guide'
+---
+
+Storybook supports multiple UI libraries. The manual setup for each framework is different:
+
+- [Storybook for React](/guides/guide-react/)
+- [Storybook for React Native](/guides/guide-react-native/)
+- [Storybook for Vue](/guides/guide-vue/)
+- [Storybook for Angular](/guides/guide-angular/)
+- [Storybook for Mithril](/guides/guide-mithril/)
+- [Storybook for Marko](/guides/guide-marko/)
+- [Storybook for HTML](/guides/guide-html/)
+- [Storybook for Svelte](/guides/guide-svelte/)
+- [Storybook for Riot](/guides/guide-riot/)
+- [Storybook for Preact](/guides/guide-preact/)
diff --git a/docs/src/stories/data.js b/docs/src/stories/data.js
index 816195daa62..8e2fdd884ce 100644
--- a/docs/src/stories/data.js
+++ b/docs/src/stories/data.js
@@ -21,6 +21,15 @@ export const docsData = {
         { id: 'build-as-a-static-app', title: 'Build as a Static App' },
       ],
     },
+    {
+      id: 'guides',
+      heading: 'Guides',
+      items: [
+        { id: 'getting-started', title: 'Getting Started' },
+        { id: 'writing-stories', title: 'Writing Stories' },
+        { id: 'build-as-a-static-app', title: 'Build as a Static App' },
+      ],
+    },
     {
       id: 'configurations',
       heading: 'Configuations',
diff --git a/docs/src/templates/_docstemplate.jsx b/docs/src/templates/_docstemplate.jsx
index 5c495013ed5..7b3b70a6316 100644
--- a/docs/src/templates/_docstemplate.jsx
+++ b/docs/src/templates/_docstemplate.jsx
@@ -6,8 +6,8 @@ import Docs from '../components/Docs';
 
 const categories = [
   {
-    id: 'react-storybook',
-    title: 'React Storybook',
+    id: 'storybook',
+    title: 'Storybook',
   },
 ];
 
@@ -86,6 +86,7 @@ export const pageQuery = graphql`
       siteMetadata {
         docSections {
           basics
+          guides
           configurations
           testing
           addons
diff --git a/examples/official-storybook/package.json b/examples/official-storybook/package.json
index c49d5e067fa..f954930c1de 100644
--- a/examples/official-storybook/package.json
+++ b/examples/official-storybook/package.json
@@ -10,7 +10,7 @@
     "generate-addon-jest-testresults": "jest --config=tests/addon-jest.config.json --json --outputFile=stories/addon-jest.testresults.json",
     "graphql": "node ./graphql-server/index.js",
     "image-snapshots": "yarn run build-storybook && yarn run do-image-snapshots",
-    "storybook": "cross-env STORYBOOK_DISPLAY_WARNING=true DISPLAY_WARNING=true start-storybook -p 9011 -c ./ -s built-storybooks --no-dll"
+    "storybook": "cross-env STORYBOOK_DISPLAY_WARNING=true DISPLAY_WARNING=true start-storybook -c ./ -s built-storybooks --no-dll"
   },
   "devDependencies": {
     "@storybook/addon-a11y": "5.0.0-beta.3",
diff --git a/examples/official-storybook/webpack.config.js b/examples/official-storybook/webpack.config.js
index fe957caf62c..9fa766e9f1b 100644
--- a/examples/official-storybook/webpack.config.js
+++ b/examples/official-storybook/webpack.config.js
@@ -1,51 +1,52 @@
 const path = require('path');
 const { DefinePlugin, ContextReplacementPlugin } = require('webpack');
 
-module.exports = async ({ config }) => ({
-  ...config,
-  module: {
-    ...config.module,
-    rules: [
-      ...config.module.rules,
-      {
-        test: /\.stories\.jsx?$/,
-        use: require.resolve('@storybook/addon-storysource/loader'),
-        include: [
-          path.resolve(__dirname, './stories'),
-          path.resolve(__dirname, '../../lib/ui/src'),
-          path.resolve(__dirname, '../../lib/components/src'),
-        ],
-        enforce: 'pre',
-      },
-      {
-        test: /\.js/,
-        use: config.module.rules[0].use,
-        include: [
-          path.resolve(__dirname, '../../lib/ui/src'),
-          path.resolve(__dirname, '../../lib/components/src'),
-        ],
-      },
-      {
-        test: /\.tsx?$/,
-        use: [
-          {
-            loader: require.resolve('ts-loader'),
-          },
-        ],
-      },
+module.exports = async ({ config }) =>
+  console.dir(config.plugins, { depth: null }) || {
+    ...config,
+    module: {
+      ...config.module,
+      rules: [
+        ...config.module.rules,
+        {
+          test: /\.stories\.jsx?$/,
+          use: require.resolve('@storybook/addon-storysource/loader'),
+          include: [
+            path.resolve(__dirname, './stories'),
+            path.resolve(__dirname, '../../lib/ui/src'),
+            path.resolve(__dirname, '../../lib/components/src'),
+          ],
+          enforce: 'pre',
+        },
+        {
+          test: /\.js/,
+          use: config.module.rules[0].use,
+          include: [
+            path.resolve(__dirname, '../../lib/ui/src'),
+            path.resolve(__dirname, '../../lib/components/src'),
+          ],
+        },
+        {
+          test: /\.tsx?$/,
+          use: [
+            {
+              loader: require.resolve('ts-loader'),
+            },
+          ],
+        },
+      ],
+    },
+    plugins: [
+      ...config.plugins,
+      // graphql sources check process variable
+      new DefinePlugin({
+        process: JSON.stringify(true),
+      }),
+      // See https://github.com/graphql/graphql-language-service/issues/111#issuecomment-306723400
+      new ContextReplacementPlugin(/graphql-language-service-interface[/\\]dist/, /\.js$/),
     ],
-  },
-  plugins: [
-    ...config.plugins,
-    // graphql sources check process variable
-    new DefinePlugin({
-      process: JSON.stringify(true),
-    }),
-    // See https://github.com/graphql/graphql-language-service/issues/111#issuecomment-306723400
-    new ContextReplacementPlugin(/graphql-language-service-interface[/\\]dist/, /\.js$/),
-  ],
-  resolve: {
-    ...config.resolve,
-    extensions: [...(config.resolve.extensions || []), '.ts', '.tsx'],
-  },
-});
+    resolve: {
+      ...config.resolve,
+      extensions: [...(config.resolve.extensions || []), '.ts', '.tsx'],
+    },
+  };

From 91be9e8fee73271fa53261d4158a7283f4260562 Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Mon, 4 Mar 2019 14:00:35 +0100
Subject: [PATCH 128/249] IMPROVE webpack docs

---
 .../custom-webpack-config/index.md            | 299 ++++++++++--------
 1 file changed, 167 insertions(+), 132 deletions(-)

diff --git a/docs/src/pages/configurations/custom-webpack-config/index.md b/docs/src/pages/configurations/custom-webpack-config/index.md
index e2106ec7d30..ba92df93140 100644
--- a/docs/src/pages/configurations/custom-webpack-config/index.md
+++ b/docs/src/pages/configurations/custom-webpack-config/index.md
@@ -6,145 +6,170 @@ title: 'Custom Webpack Config'
 You can customize Storybook's webpack setup by providing a `webpack.config.js` file exporting a **webpack 4** compatible config exported as a **commonjs module**.
 
 Storybook has its own Webpack setup and a dev server. 
-The webpack config [is configurable](/configurations/webpack), and the default can depend on whether you are using [Create React App](https://github.com/facebookincubator/create-react-app).
+The webpack config [is configurable](/configurations/webpack), and the default can depend on which framework you're using and whether you've used a generator like [Create React App](https://github.com/facebookincubator/create-react-app) or Angular CLI etc.
 
-Here's what the default webpack looks like in dev-mode:
-```js
-{
-  mode: 'development',
-  bail: false,
-  devtool: '#cheap-module-source-map',
-  entry: [
-    '@storybook/core/dist/server/common/polyfills.js',
-    '@storybook/core/dist/server/preview/globals.js',
-    '<your-storybook-dir>/config.js',
-    'webpack-hot-middleware/client.js?reload=true',
-  ],
-  output: {
-    path: './',
-    filename: '[name].[hash].bundle.js',
-    publicPath: '',
-  },
-  plugins: [
-    HtmlWebpackPlugin {
-      options: {
-        template: '@storybook/core/dist/server/templates/index.ejs',
-        templateContent: false,
-        templateParameters: [Function: templateParameters],
-        filename: 'iframe.html',
-        hash: false,
-        inject: false,
-        compile: true,
-        favicon: false,
-        minify: undefined,
-        cache: true,
-        showErrors: true,
-        chunks: 'all',
-        excludeChunks: [],
-        chunksSortMode: 'none',
-        meta: {},
-        title: 'Webpack App',
-        xhtml: false,
-        alwaysWriteToDisk: true,
-      },
+> We're trying to make storybook more zero-config over time, **help to hook into the config of generators is very welcome**.
+
+<details>
+  <summary>This is what the config for storybook looks like when using CRA in dev-mode:</summary>
+
+  ```js
+  {
+    mode: 'development',
+    bail: false,
+    devtool: '#cheap-module-source-map',
+    entry: [
+      '@storybook/core/dist/server/common/polyfills.js',
+      '@storybook/core/dist/server/preview/globals.js',
+      '<your-storybook-dir>/config.js',
+      'webpack-hot-middleware/client.js?reload=true',
+    ],
+    output: {
+      path: './',
+      filename: '[name].[hash].bundle.js',
+      publicPath: '',
     },
-    DefinePlugin {
-      definitions: {
-        'process.env': {
-          NODE_ENV: '"development"',
-          NODE_PATH: '""',
-          PUBLIC_URL: '"."',
+    plugins: [
+      HtmlWebpackPlugin {
+        options: {
+          template: '@storybook/core/dist/server/templates/index.ejs',
+          templateContent: false,
+          templateParameters: [Function: templateParameters],
+          filename: 'iframe.html',
+          hash: false,
+          inject: false,
+          compile: true,
+          favicon: false,
+          minify: undefined,
+          cache: true,
+          showErrors: true,
+          chunks: 'all',
+          excludeChunks: [],
+          chunksSortMode: 'none',
+          meta: {},
+          title: 'Webpack App',
+          xhtml: false,
+          alwaysWriteToDisk: true,
+        },
+      },
+      DefinePlugin {
+        definitions: {
+          'process.env': {
+            NODE_ENV: '"development"',
+            NODE_PATH: '""',
+            PUBLIC_URL: '"."',
+            '<storybook-environment-variables>'
+            '<dotenv-environment-variables>'
+          },
+        },
+      },
+      WatchMissingNodeModulesPlugin {
+        nodeModulesPath: './node_modules',
+      },
+      HotModuleReplacementPlugin {},
+      CaseSensitivePathsPlugin {},
+      ProgressPlugin {},
+      DefinePlugin {
+        definitions: {
           '<storybook-environment-variables>'
           '<dotenv-environment-variables>'
         },
       },
-    },
-    WatchMissingNodeModulesPlugin {
-      nodeModulesPath: './node_modules',
-    },
-    HotModuleReplacementPlugin {},
-    CaseSensitivePathsPlugin {},
-    ProgressPlugin {},
-    DefinePlugin {
-      definitions: {
-        '<storybook-environment-variables>'
-        '<dotenv-environment-variables>'
-      },
-    },
-  ],
-  module: {
-    rules: [
-      { test: /\.(mjs|jsx?)$/, 
-        use: [
-          { loader: 'babel-loader', options:
-            { cacheDirectory: './node_modules/.cache/storybook',
-              presets: [
-                [ './node_modules/@babel/preset-env/lib/index.js', { shippedProposals: true, useBuiltIns: 'usage' } ],
-                './node_modules/@babel/preset-react/lib/index.js',
-                './node_modules/@babel/preset-flow/lib/index.js',
-              ],
-              plugins: [
-                './node_modules/@babel/plugin-proposal-object-rest-spread/lib/index.js',
-                './node_modules/@babel/plugin-proposal-class-properties/lib/index.js',
-                './node_modules/@babel/plugin-syntax-dynamic-import/lib/index.js',
-                [ './node_modules/babel-plugin-emotion/dist/babel-plugin-emotion.cjs.js', { sourceMap: true, autoLabel: true } ],
-                './node_modules/babel-plugin-macros/dist/index.js',
-                './node_modules/@babel/plugin-transform-react-constant-elements/lib/index.js',
-                './node_modules/babel-plugin-add-react-displayname/index.js',
-                [ './node_modules/babel-plugin-react-docgen/lib/index.js', { DOC_GEN_COLLECTION_NAME: 'STORYBOOK_REACT_CLASSES' } ],
-              ],
-            },
-          },
-        ],
-        include: [ './' ],
-        exclude: [ './node_modules' ],
-      },
-      { test: /\.md$/, 
-        use: [
-          { loader: './node_modules/raw-loader/index.js' },
-        ],
-      },
-      { test: /\.css$/,
-        use: [
-          './node_modules/style-loader/index.js',
-          { loader: './node_modules/css-loader/dist/cjs.js', options: { importLoaders: 1 } },
-          { loader: './node_modules/postcss-loader/src/index.js', options: { ident: 'postcss', postcss: {}, plugins: [Function: plugins] } },
-        ],
-      },
-      { test: /\.(svg|ico|jpg|jpeg|png|gif|eot|otf|webp|ttf|woff|woff2|cur|ani)(\?.*)?$/,
-        loader: './node_modules/file-loader/dist/cjs.js',
-        query: { name: 'static/media/[name].[hash:8].[ext]' },
-      },
-      { test: /\.(mp4|webm|wav|mp3|m4a|aac|oga)(\?.*)?$/,
-        loader: './node_modules/url-loader/dist/cjs.js',
-        query: { limit: 10000, name: 'static/media/[name].[hash:8].[ext]' },
-      },
     ],
-  },
-  resolve: {
-    extensions: [ '.mjs', '.js', '.jsx', '.json' ],
-    modules: [ 'node_modules' ],
-    mainFields: [ 'browser', 'main', 'module' ],
-    alias: {
-      'core-js': './node_modules/core-js',
-      react: './node_modules/react',
-      'react-dom': './node_modules/react-dom',
+    module: {
+      rules: [
+        { test: /\.(mjs|jsx?)$/, 
+          use: [
+            { loader: 'babel-loader', options:
+              { cacheDirectory: './node_modules/.cache/storybook',
+                presets: [
+                  [ './node_modules/@babel/preset-env/lib/index.js', { shippedProposals: true, useBuiltIns: 'usage' } ],
+                  './node_modules/@babel/preset-react/lib/index.js',
+                  './node_modules/@babel/preset-flow/lib/index.js',
+                ],
+                plugins: [
+                  './node_modules/@babel/plugin-proposal-object-rest-spread/lib/index.js',
+                  './node_modules/@babel/plugin-proposal-class-properties/lib/index.js',
+                  './node_modules/@babel/plugin-syntax-dynamic-import/lib/index.js',
+                  [ './node_modules/babel-plugin-emotion/dist/babel-plugin-emotion.cjs.js', { sourceMap: true, autoLabel: true } ],
+                  './node_modules/babel-plugin-macros/dist/index.js',
+                  './node_modules/@babel/plugin-transform-react-constant-elements/lib/index.js',
+                  './node_modules/babel-plugin-add-react-displayname/index.js',
+                  [ './node_modules/babel-plugin-react-docgen/lib/index.js', { DOC_GEN_COLLECTION_NAME: 'STORYBOOK_REACT_CLASSES' } ],
+                ],
+              },
+            },
+          ],
+          include: [ './' ],
+          exclude: [ './node_modules' ],
+        },
+        { test: /\.md$/, 
+          use: [
+            { loader: './node_modules/raw-loader/index.js' },
+          ],
+        },
+        { test: /\.css$/,
+          use: [
+            './node_modules/style-loader/index.js',
+            { loader: './node_modules/css-loader/dist/cjs.js', options: { importLoaders: 1 } },
+            { loader: './node_modules/postcss-loader/src/index.js', options: { ident: 'postcss', postcss: {}, plugins: [Function: plugins] } },
+          ],
+        },
+        { test: /\.(svg|ico|jpg|jpeg|png|gif|eot|otf|webp|ttf|woff|woff2|cur|ani)(\?.*)?$/,
+          loader: './node_modules/file-loader/dist/cjs.js',
+          query: { name: 'static/media/[name].[hash:8].[ext]' },
+        },
+        { test: /\.(mp4|webm|wav|mp3|m4a|aac|oga)(\?.*)?$/,
+          loader: './node_modules/url-loader/dist/cjs.js',
+          query: { limit: 10000, name: 'static/media/[name].[hash:8].[ext]' },
+        },
+      ],
     },
-  },
-  optimization: {
-    splitChunks: { chunks: 'all' },
-    runtimeChunk: true,
-    minimizer: [ [Object] ],
-  },
-  performance: { hints: false },
-}
-```
+    resolve: {
+      extensions: [ '.mjs', '.js', '.jsx', '.json' ],
+      modules: [ 'node_modules' ],
+      mainFields: [ 'browser', 'main', 'module' ],
+      alias: {
+        'core-js': './node_modules/core-js',
+        react: './node_modules/react',
+        'react-dom': './node_modules/react-dom',
+      },
+    },
+    optimization: {
+      splitChunks: { chunks: 'all' },
+      runtimeChunk: true,
+      minimizer: [ [Object] ],
+    },
+    performance: { hints: false },
+  }
+  ```
+</details>
 
+### Debug the default webpack config
 
+<details>
+  <summary>To effectively customise the webpack config, you might need to get the full default config it's using.</summary>
+  
+  <div></div>
 
-The file can export an object or a function. The former configures in [extend mode](#extend-mode), the latter in [full control mode](#full-control-mode), both described here.
+  - Create a `.storybook/webpack.config.js` file.
+  - Edit it's contents:
+    ```js
+    module.exports = async ({ config }) => console.dir(config.plugins, { depth: null }) || config;
+    ```
+  - Then run storybook:  
+    ```sh
+    yarn storybook --quiet
+    ```
 
-## Extend Mode
+  The console should log the entire config, for you to inspect.
+</details>
+
+## Webpack customisation modes
+
+The file can export an [object](#extend-mode) or a [function](#full-control-mode).
+
+### Extend Mode
 
 If your file exports an **object**, it puts Storybook into **extend-mode**.
 
@@ -175,11 +200,10 @@ But you won't be able to change the following config options:
 
 - entry
 - output
-- js loader with babel
 
 For the advanced usage we strongly recommend [full control mode](#full-control-mode).
 
-## Full Control Mode
+### Full Control Mode
 
 If your file exports a **function**, it puts Storybook into **full-control-mode**.
 
@@ -191,7 +215,7 @@ For example, here's a `webpack.config.js` to add [SASS](http://sass-lang.com/) s
 const path = require('path');
 
 // Export a function. Accept the base config as the only param.
-module.exports = ({ config, mode }) => {
+module.exports = async ({ config, mode }) => {
   // `mode` has a value of 'DEVELOPMENT' or 'PRODUCTION'
   // You can change the configuration based on that.
   // 'PRODUCTION' is used when building the static version of storybook.
@@ -212,8 +236,6 @@ Storybook uses the config returned from the above function. So edit `config` wit
 
 - entry
 - output
-- first loader in the module.loaders (Babel loader for JS)
-- all existing plugins
 
 > If your custom webpack config uses a loader that does not explicitly include specific file extensions via the `test` property, it is necessary to `exclude` the `.ejs` file extension from that loader.
 
@@ -223,3 +245,16 @@ If you have an existing webpack config for your project and want to reuse this a
 
 - Import your main webpack config into Storybook's `webpack.config.js` and use the loaders and plugins used in that.
 - Create a new file with common webpack options and use it in both inside the main webpack config and inside Storybook's `webpack.config.js`.
+
+**Example**  
+*merging the loaders from your app's `webpack.config.js` with storybook's*
+
+```js
+const path = require('path');
+// your app's webpack.config.js
+const custom = require('../webpack.config.js');
+
+module.exports = async ({ config, mode }) => {
+  return {...config, loaders: custom.loaders };
+};
+```

From 50a8670a185f2d82e72bcdf3c6e825e5fc5307ab Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Mon, 4 Mar 2019 14:06:46 +0100
Subject: [PATCH 129/249] IMPROVE default config docs

---
 .../configurations/default-config/index.md    | 169 ++++++++++++++++--
 1 file changed, 153 insertions(+), 16 deletions(-)

diff --git a/docs/src/pages/configurations/default-config/index.md b/docs/src/pages/configurations/default-config/index.md
index 1705f0dabe8..d97ed7a75b5 100644
--- a/docs/src/pages/configurations/default-config/index.md
+++ b/docs/src/pages/configurations/default-config/index.md
@@ -3,22 +3,8 @@ id: 'default-config'
 title: 'Default Config'
 ---
 
-Storybook has a default Webpack setup which suits a large range of projects.
-It is similar to [Create React App](https://github.com/facebookincubator/create-react-app)'s config when using react, and has been tweaked to closely resemble the webpack config generated by [Vue CLI](https://github.com/vuejs/vue-cli).
-
 Let's learn about the default config comes with Storybook.
 
-## Table of Contents
-
--   [Babel](#babel)
-    -   [ES2016+ Support](#es2016-support)
-    -   [.babelrc support](#babelrc-support)
--   [Webpack](#webpack)
-    -   [CSS Support](#css-support)
-    -   [Image and Static File Support](#image-and-static-file-support)
-    -   [JSON Loader](#json-loader)
--   [NPM Modules](#npm-modules)
-
 ## Babel
 
 We use Babel for JavaScript(ES6) transpiling.
@@ -38,7 +24,146 @@ So, you could use any babel plugins or presets that you have used in your projec
 ## Webpack
 
 We use Webpack to serve and load JavaScript modules for the web.
-We've added some Webpack loaders to bring some good defaults. (This setup is very close to what you get with the [Create React App](https://github.com/facebookincubator/create-react-app).)
+
+The webpack config [is configurable](/configurations/webpack), and the default can depend on which framework you're using and whether you've used a generator like [Create React App](https://github.com/facebookincubator/create-react-app) or Angular CLI etc.
+
+> We're trying to make storybook more zero-config over time, **help to hook into the config of generators is very welcome**.
+
+<details>
+  <summary>This is what the config for storybook looks like when using CRA in dev-mode:</summary>
+
+  ```js
+  {
+    mode: 'development',
+    bail: false,
+    devtool: '#cheap-module-source-map',
+    entry: [
+      '@storybook/core/dist/server/common/polyfills.js',
+      '@storybook/core/dist/server/preview/globals.js',
+      '<your-storybook-dir>/config.js',
+      'webpack-hot-middleware/client.js?reload=true',
+    ],
+    output: {
+      path: './',
+      filename: '[name].[hash].bundle.js',
+      publicPath: '',
+    },
+    plugins: [
+      HtmlWebpackPlugin {
+        options: {
+          template: '@storybook/core/dist/server/templates/index.ejs',
+          templateContent: false,
+          templateParameters: [Function: templateParameters],
+          filename: 'iframe.html',
+          hash: false,
+          inject: false,
+          compile: true,
+          favicon: false,
+          minify: undefined,
+          cache: true,
+          showErrors: true,
+          chunks: 'all',
+          excludeChunks: [],
+          chunksSortMode: 'none',
+          meta: {},
+          title: 'Webpack App',
+          xhtml: false,
+          alwaysWriteToDisk: true,
+        },
+      },
+      DefinePlugin {
+        definitions: {
+          'process.env': {
+            NODE_ENV: '"development"',
+            NODE_PATH: '""',
+            PUBLIC_URL: '"."',
+            '<storybook-environment-variables>'
+            '<dotenv-environment-variables>'
+          },
+        },
+      },
+      WatchMissingNodeModulesPlugin {
+        nodeModulesPath: './node_modules',
+      },
+      HotModuleReplacementPlugin {},
+      CaseSensitivePathsPlugin {},
+      ProgressPlugin {},
+      DefinePlugin {
+        definitions: {
+          '<storybook-environment-variables>'
+          '<dotenv-environment-variables>'
+        },
+      },
+    ],
+    module: {
+      rules: [
+        { test: /\.(mjs|jsx?)$/, 
+          use: [
+            { loader: 'babel-loader', options:
+              { cacheDirectory: './node_modules/.cache/storybook',
+                presets: [
+                  [ './node_modules/@babel/preset-env/lib/index.js', { shippedProposals: true, useBuiltIns: 'usage' } ],
+                  './node_modules/@babel/preset-react/lib/index.js',
+                  './node_modules/@babel/preset-flow/lib/index.js',
+                ],
+                plugins: [
+                  './node_modules/@babel/plugin-proposal-object-rest-spread/lib/index.js',
+                  './node_modules/@babel/plugin-proposal-class-properties/lib/index.js',
+                  './node_modules/@babel/plugin-syntax-dynamic-import/lib/index.js',
+                  [ './node_modules/babel-plugin-emotion/dist/babel-plugin-emotion.cjs.js', { sourceMap: true, autoLabel: true } ],
+                  './node_modules/babel-plugin-macros/dist/index.js',
+                  './node_modules/@babel/plugin-transform-react-constant-elements/lib/index.js',
+                  './node_modules/babel-plugin-add-react-displayname/index.js',
+                  [ './node_modules/babel-plugin-react-docgen/lib/index.js', { DOC_GEN_COLLECTION_NAME: 'STORYBOOK_REACT_CLASSES' } ],
+                ],
+              },
+            },
+          ],
+          include: [ './' ],
+          exclude: [ './node_modules' ],
+        },
+        { test: /\.md$/, 
+          use: [
+            { loader: './node_modules/raw-loader/index.js' },
+          ],
+        },
+        { test: /\.css$/,
+          use: [
+            './node_modules/style-loader/index.js',
+            { loader: './node_modules/css-loader/dist/cjs.js', options: { importLoaders: 1 } },
+            { loader: './node_modules/postcss-loader/src/index.js', options: { ident: 'postcss', postcss: {}, plugins: [Function: plugins] } },
+          ],
+        },
+        { test: /\.(svg|ico|jpg|jpeg|png|gif|eot|otf|webp|ttf|woff|woff2|cur|ani)(\?.*)?$/,
+          loader: './node_modules/file-loader/dist/cjs.js',
+          query: { name: 'static/media/[name].[hash:8].[ext]' },
+        },
+        { test: /\.(mp4|webm|wav|mp3|m4a|aac|oga)(\?.*)?$/,
+          loader: './node_modules/url-loader/dist/cjs.js',
+          query: { limit: 10000, name: 'static/media/[name].[hash:8].[ext]' },
+        },
+      ],
+    },
+    resolve: {
+      extensions: [ '.mjs', '.js', '.jsx', '.json' ],
+      modules: [ 'node_modules' ],
+      mainFields: [ 'browser', 'main', 'module' ],
+      alias: {
+        'core-js': './node_modules/core-js',
+        react: './node_modules/react',
+        'react-dom': './node_modules/react-dom',
+      },
+    },
+    optimization: {
+      splitChunks: { chunks: 'all' },
+      runtimeChunk: true,
+      minimizer: [ [Object] ],
+    },
+    performance: { hints: false },
+  }
+  ```
+</details>
+
 
 ### CSS Support
 
@@ -54,7 +179,7 @@ import 'bootstrap/dist/css/bootstrap.css';
 import './styles.css';
 ```
 
-> **Note:** this is plain CSS only. If you need a preprocessor like SASS, you need to [customize the webpack config](/configurations/custom-webpack-config/).
+> **Note:** with some frameworks/clis we inject plain CSS only. If you need a preprocessor like SASS, you need to [customize the webpack config](/configurations/custom-webpack-config/).
 >
 > **Warning:** storybooks for projects that use Angular CLI cannot import CSS by default. They must either [customize the webpack config](/configurations/custom-webpack-config/), or use the inline loader syntax:
 > ```js
@@ -88,6 +213,18 @@ So, this is a good approach to loading all of your static content.
 You can import `.json` files, as you do with Node.js.
 This will also allow you to use NPM projects, which imports `.json` files inside them.
 
+```js
+import React from 'react';
+import { storiesOf } from '@storybook/react';
+
+import data from './data.json';
+
+storiesOf('Component', module)
+  .add('with data', () => (
+    <pre>{JSON.stringify(data, null, 2)}</pre>
+  ));
+```
+
 ## NPM Modules
 
 You can use any of the NPM modules installed on your project.

From d173ec5e3cb41269ac8006b99ce86337c92566fc Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Mon, 4 Mar 2019 14:08:40 +0100
Subject: [PATCH 130/249] IMPROVE cli docs

---
 .../pages/configurations/cli-options/index.md | 50 ++++++++++---------
 1 file changed, 27 insertions(+), 23 deletions(-)

diff --git a/docs/src/pages/configurations/cli-options/index.md b/docs/src/pages/configurations/cli-options/index.md
index acd0804beef..4f92db3ff35 100644
--- a/docs/src/pages/configurations/cli-options/index.md
+++ b/docs/src/pages/configurations/cli-options/index.md
@@ -11,33 +11,37 @@ Here are all those options:
 
 ## For start-storybook
 
-    Usage: start-storybook [options]
+```plaintext
+Usage: start-storybook [options]
 
-    Options:
+Options:
 
-      --help                    output usage information
-      -V, --version                 output the version number
-      -p, --port [number]           Port to run Storybook
-      -h, --host [string]           Host to run Storybook
-      -s, --static-dir <dir-names>  Directory where to load static files from, comma-separated list
-      -c, --config-dir [dir-name]   Directory where to load Storybook configurations from
-      --https                       Serve Storybook over HTTPS. Note: You must provide your own certificate information.
-      --ssl-ca <ca>                 Provide an SSL certificate authority. (Optional with --https, required if using a self-signed certificate)
-      --ssl-cert <cert>             Provide an SSL certificate. (Required with --https)
-      --ssl-key <key>               Provide an SSL key. (Required with --https)
-      --smoke-test                  Exit after successful start
-      --ci                          CI mode (skip interactive prompts, don't open browser)
-      --quiet                       Suppress verbose build output
+--help                        output usage information
+-V, --version                 output the version number
+-p, --port [number]           Port to run Storybook
+-h, --host [string]           Host to run Storybook
+-s, --static-dir <dir-names>  Directory where to load static files from, comma-separated list
+-c, --config-dir [dir-name]   Directory where to load Storybook configurations from
+--https                       Serve Storybook over HTTPS. Note: You must provide your own certificate information.
+--ssl-ca <ca>                 Provide an SSL certificate authority. (Optional with --https, required if using a self-signed certificate)
+--ssl-cert <cert>             Provide an SSL certificate. (Required with --https)
+--ssl-key <key>               Provide an SSL key. (Required with --https)
+--smoke-test                  Exit after successful start
+--ci                          CI mode (skip interactive prompts, don't open browser)
+--quiet                       Suppress verbose build output
+```
 
 ## For build-storybook
 
-    Usage: build-storybook [options]
+```plaintext
+Usage: build-storybook [options]
 
-    Options:
+Options:
 
-      -h, --help                    output usage information
-      -V, --version                 output the version number
-      -s, --static-dir <dir-names>  Directory where to load static files from, comma-separated list
-      -o, --output-dir [dir-name]   Directory where to store built files
-      -c, --config-dir [dir-name]   Directory where to load Storybook configurations from
-      -w, --watch                   Enable watch mode
+-h, --help                    output usage information
+-V, --version                 output the version number
+-s, --static-dir <dir-names>  Directory where to load static files from, comma-separated list
+-o, --output-dir [dir-name]   Directory where to store built files
+-c, --config-dir [dir-name]   Directory where to load Storybook configurations from
+-w, --watch                   Enable watch mode
+```

From 0dbf67c3dbe12fd9cdf3d790439d3c3495250c2b Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Mon, 4 Mar 2019 14:31:42 +0100
Subject: [PATCH 131/249] IMPROVE theming docs

---
 .../src/pages/configurations/theming/index.md | 208 ++++++++++--------
 lib/theming/src/create.ts                     |   2 +-
 2 files changed, 114 insertions(+), 96 deletions(-)

diff --git a/docs/src/pages/configurations/theming/index.md b/docs/src/pages/configurations/theming/index.md
index 81e73015771..6cf7a6ee031 100644
--- a/docs/src/pages/configurations/theming/index.md
+++ b/docs/src/pages/configurations/theming/index.md
@@ -33,7 +33,7 @@ You can get these themes like so:
 
 ```js
 import { addParameters, configure } from '@storybook/react';
-import { themes } from '@storybook/components';
+import { themes } from '@storybook/theming';
 
 // Option defaults.
 addParameters({
@@ -46,57 +46,58 @@ addParameters({
 
 ## Create a theme quickstart
 
+The `storybook/theming` is build using TypeScript, so this should help create a valid theme for typescript users. The types are part of the package itself.
+
 The easiest way to customize Storybook to generate a new theme using `create()`. This function includes shorthands for the most common theme variables. Here's how to use it.
 
 First create a new file in `.storybook` called `yourTheme.js`.
 
 Next paste the code below and tweak the variables.
 
-```
+```ts
 import { create } from '@storybook/theming';
 
 export default create({
-  // Is this a 'light' or 'dark' theme?
-  base: 'light',
+  base: 'light';
 
-  // Color palette
-  colorPrimary: 'red', // primary color
-  colorSecondary: 'pink', // secondary color
+  colorPrimary: 'hotpink';
+  colorSecondary: 'deepskyblue';
 
   // UI
-  appBg: 'papayawhip',
-  appContentBg: 'white',
-  appBorderColor: 'rgba(0,0,0,.1)',
-  appBorderRadius: 4,
+  appBg: 'white';
+  appContentBg: 'silver';
+  appBorderColor: 'grey';
+  appBorderRadius: 4;
 
-  // Fonts
-  fontBase: '"Helvetica", Arial, sans-serif',
-  fontCode: 'Monaco, monospace',
+  // Typography
+  fontBase: '"Open Sans", sans-serif',
+  fontCode: 'monospace';
 
   // Text colors
-  textColor: '#FFFFFF',
-  textInverseColor: '#333333',
+  textColor: 'black';
+  textInverseColor: 'rgba(255,255,255,0.9)';
 
   // Toolbar default and active colors
-  barTextColor: '#999999',
-  barSelectedColor: 'blue',
-  barBg: 'white',
+  barTextColor: 'silver';
+  barSelectedColor: 'black';
+  barBg: 'hotpink';
 
   // Form colors
-  inputBg: 'white',
-  inputBorder: 'rgba(0,0,0,.1)',
-  inputTextColor: '#333333',
-  inputBorderRadius: 4,
+  inputBg: 'white';
+  inputBorder: 'silver';
+  inputTextColor: 'black';
+  inputBorderRadius: 4;
 
-  // Brand logo/text
-  brand: `<svg .../>`,
+  brandTitle: 'My custom storybook';
+  brandUrl: 'https://example.com';
+  brandImage: 'https://placehold.it/350x150';
 });
 ```
 
 Finally, import your theme into `.storybook/config` and add it to your Storybook parameters.
 
-```
-import {yourTheme} from './yourTheme';
+```js
+import { yourTheme } from './yourTheme';
 
 addParameters({
   options: {
@@ -105,13 +106,27 @@ addParameters({
 });
 ```
 
+Many them variables are optional, the `base` property is NOT. This is a perfectly valid theme:
+
+```ts
+import { create } from '@storybook/theming';
+
+export default create({
+  base: 'light';
+
+  brandTitle: 'My custom storybook';
+  brandUrl: 'https://example.com';
+  brandImage: 'https://placehold.it/350x150';
+});
+```
+
 ## Addons and theme creation
 
 Some addons require specific theme variables that a Storybook user must add. If you share your theme with the community make sure to support the official and other popular addons so your users have a consistent experience.
 
 For example, the popular Actions addon uses [react-inspector](https://github.com/xyc/react-inspector/blob/master/src/styles/themes/chromeLight.js) which has themes of it's own. Supply additional theme variables to style it like so:
 
-```
+```js
 addonActionsTheme: {
   ...chromeLight,
   BASE_FONT_FAMILY: typography.fonts.mono,
@@ -123,13 +138,13 @@ addonActionsTheme: {
 
 For a native Storybook experience, we encourage addon authors to reuse the theme variables above. The theming engine relies on [emotion](https://emotion.sh/), a CSS-in-JS library.
 
-```
+```js
 import { styled } from '@storybook/theming';
 ```
 
 Use the theme variables in object notation:
 
-```
+```js
 const Component = styled.div(
   ({ theme }) => ({
     background: theme.background.app,
@@ -138,9 +153,9 @@ const Component = styled.div(
 );
 ```
 
-Or with styled-components template literals:
+Or with template literals:
 
-```
+```js
 const Component = styled.div`
   background: `${props => props.theme.background.app}`
   width: 0;
@@ -149,81 +164,81 @@ const Component = styled.div`
 
 ### Advanced theming
 
-For further customization adjust theme variables manually.
+the `create` function creates an object like this:
 
-This is the master list:
+```js
+{
+  base: 'light' | 'dark',
+  color: {
+    primary
+    secondary
+    tertiary
+    ancillary
 
-```
-base: 'light' | 'dark',
-color: {
-  primary
-  secondary
-  tertiary
-  ancillary
+    orange
+    gold
+    green
+    seafoam
+    purple
+    ultraviolet
 
-  orange
-  gold
-  green
-  seafoam
-  purple
-  ultraviolet
+    lightest
+    lighter
+    light
+    mediumlight
+    medium
+    mediumdark
+    dark
+    darker
+    darkest
 
-  lightest
-  lighter
-  light
-  mediumlight
-  medium
-  mediumdark
-  dark
-  darker
-  darkest
+    border
 
-  border
+    positive
+    negative
+    warning
 
-  positive
-  negative
-  warning
+    defaultText
+    inverseText
+  },
+  background: {
+    app
+    content
+    hoverable
 
-  defaultText
-  inverseText
-}
-background: {
-  app
-  content
-  hoverable
-
-  positive
-  negative
-  warning
-}
-typography: {
-  fonts: {
-    base
-    mono
-  }
-  weight: {
-    regular
-    bold
-    black
-  }
-  size: {
-    s1
-    s2
-    s3
-    m1
-    m2
-    m3
-    l1
-    l2
-    l3
-    code
+    positive
+    negative
+    warning
+  },
+  typography: {
+    fonts: {
+      base
+      mono
+    }
+    weight: {
+      regular
+      bold
+      black
+    }
+    size: {
+      s1
+      s2
+      s3
+      m1
+      m2
+      m3
+      l1
+      l2
+      l3
+      code
+    }
   }
   input: {
     border
     background
     color
     borderRadius
-  };
+  },
 
   layoutMargin
   appBorderColor
@@ -235,5 +250,8 @@ typography: {
 
   brand
 }
-TODO finish this, what's the best way to document?
 ```
+
+All properties are required.
+
+Again the `@storybook/theming` package is built using TypeScript, so if you do create a theme like this, that should help.
diff --git a/lib/theming/src/create.ts b/lib/theming/src/create.ts
index dce9514df68..de3784faea4 100644
--- a/lib/theming/src/create.ts
+++ b/lib/theming/src/create.ts
@@ -11,7 +11,7 @@ interface Rest {
 }
 
 interface ThemeVar {
-  base?: 'light' | 'dark';
+  base: 'light' | 'dark';
 
   colorPrimary?: string;
   colorSecondary?: string;

From 793c8ff11c9e1aeba5d3976f5296282c5a520b95 Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Mon, 4 Mar 2019 14:36:50 +0100
Subject: [PATCH 132/249] IMPROVE docs for standalone

---
 .../standalone-options/index.md               | 46 ++++++++++---------
 1 file changed, 25 insertions(+), 21 deletions(-)

diff --git a/docs/src/pages/configurations/standalone-options/index.md b/docs/src/pages/configurations/standalone-options/index.md
index baf61721519..8f629824f48 100644
--- a/docs/src/pages/configurations/standalone-options/index.md
+++ b/docs/src/pages/configurations/standalone-options/index.md
@@ -27,7 +27,9 @@ storybook({
 
 Mode is defining what Storybook mode will be applied:
 
-    dev - run Storybook in a dev mode - similar to "start-storybook" in CLI
+### dev
+
+run Storybook in a dev mode - similar to `start-storybook` in CLI
 
 ```js
 const storybook = require('@storybook/react/standalone');
@@ -38,7 +40,9 @@ storybook({
 });
 ```    
 
-    static - build static version of Storybook - similar to "build-storybook" in CLI
+### static
+
+build static version of Storybook - similar to `build-storybook` in CLI
 
 ```js
 const storybook = require('@storybook/react/standalone');
@@ -53,28 +57,28 @@ Other options are similar to those in the CLI.
 
 ## For "dev" mode:
 
-    Options:
-
-      port [number]           Port to run Storybook
-      host [string]           Host to run Storybook
-      staticDir <dir-names>   Directory where to load static files from, array of strings
-      configDir [dir-name]    Directory where to load Storybook configurations from
-      https                   Serve Storybook over HTTPS. Note: You must provide your own certificate information.
-      sslCa <ca>              Provide an SSL certificate authority. (Optional with "https", required if using a self-signed certificate)
-      sslCert <cert>          Provide an SSL certificate. (Required with "https")
-      sslKey <key>            Provide an SSL key. (Required with "https")
-      smokeTest               Exit after successful start
-      ci                      CI mode (skip interactive prompts, don't open browser)
-      quiet                   Suppress verbose build output
+```plaintext
+port [number]           Port to run Storybook
+host [string]           Host to run Storybook
+staticDir <dir-names>   Directory where to load static files from, array of strings
+configDir [dir-name]    Directory where to load Storybook configurations from
+https                   Serve Storybook over HTTPS. Note: You must provide your own certificate information.
+sslCa <ca>              Provide an SSL certificate authority. (Optional with "https", required if using a self-signed certificate)
+sslCert <cert>          Provide an SSL certificate. (Required with "https")
+sslKey <key>            Provide an SSL key. (Required with "https")
+smokeTest               Exit after successful start
+ci                      CI mode (skip interactive prompts, don't open browser)
+quiet                   Suppress verbose build output
+```
 
 ## For "static" mode:
 
-    Options:
-
-      staticDir <dir-names>   Directory where to load static files from, array of strings
-      outputDir [dir-name]    Directory where to store built files
-      configDir [dir-name]    Directory where to load Storybook configurations from
-      watch                   Enable watch mode
+```plaintext
+staticDir <dir-names>   Directory where to load static files from, array of strings
+outputDir [dir-name]    Directory where to store built files
+configDir [dir-name]    Directory where to load Storybook configurations from
+watch                   Enable watch mode
+```
 
 Example: 
 

From dc9d97a95c95750215c4189a55c6fd26feefd435 Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Mon, 4 Mar 2019 14:54:58 +0100
Subject: [PATCH 133/249] IMMPROVE the writing stories docs

---
 .../src/pages/basics/writing-stories/index.md | 57 ++++++++++++++++---
 1 file changed, 50 insertions(+), 7 deletions(-)

diff --git a/docs/src/pages/basics/writing-stories/index.md b/docs/src/pages/basics/writing-stories/index.md
index 1a6167ad0b9..67aaeba7330 100644
--- a/docs/src/pages/basics/writing-stories/index.md
+++ b/docs/src/pages/basics/writing-stories/index.md
@@ -5,7 +5,7 @@ title: 'Writing Stories'
 
 Storybook is all about writing stories. A story usually contains a single state of one component, almost like a visual test case.
 
-> Technically, a story is a function that returns a React element.
+> Technically, a story is a function that returns something that can be rendered to screen.
 
 A Storybook can be comprised of many stories for many components.
 
@@ -13,9 +13,52 @@ A Storybook can be comprised of many stories for many components.
 
 There are no rules for this, but in general, stories are easier to maintain when they are located closer to components.
 
-For example, if the UI components live in a directory called: `src/components`, then the stories can be written inside the `src/stories` directory.
+Some examples:
 
-The Storybook config file can also be edited to load stories from other folders too.
+<details>
+  <summary>stories inside component directory</summary>
+
+  ```plaintext
+  •
+  └── src
+      └── components
+          └── button
+              ├── button.js
+              └── button.stories.js
+  ```
+
+</details>
+
+<details>
+  <summary>stories sub-directory in component directory</summary>
+
+  ```plaintext
+  •
+  └── src
+      └── components
+          └── button
+              ├── button.js
+              └── stories
+                  └── button.stories.js
+  ```
+
+</details>
+
+<details>
+  <summary>stories directory outside src directory</summary>
+
+  ```plaintext
+  •
+  ├── src
+  │   └── components
+  │       └── button.js
+  └── stories
+      └── button.stories.js
+  ```
+
+</details>
+
+It's up to you to find a naming/placing scheme that works for your project/team.
 
 ## Writing Stories
 
@@ -73,7 +116,7 @@ The **React Native** packager resolves all the imports at build-time, so it's no
 
 A decorator is a way to wrap a story with a common set of components. Here is an example for centering all components:
 
-```js
+```jsx
 import React from 'react';
 import { storiesOf } from '@storybook/react';
 import MyComponent from '../my_component';
@@ -88,7 +131,7 @@ This only applies the decorator to the current set of stories. (In this example,
 
 It is possible to apply a decorator **globally** to all the stories. Here is an example of the Storybook config file:
 
-```js
+```jsx
 import React from 'react';
 import { configure, addDecorator } from '@storybook/react';
 
@@ -103,7 +146,7 @@ configure(function() {
 
 As of storybook 3.3, [Markdown](https://github.com/adam-p/markdown-here/wiki/Markdown-Cheatsheet) can be used in Storybook by default. Users can import a markdown file which extracts the raw markdown content into a string. The string can then be used in any addon that supports markdown such as notes and info.
 
-```js
+```jsx
 import React from 'react';
 import { storiesOf } from '@storybook/react';
 import MyComponent from './MyComponent';
@@ -118,7 +161,7 @@ storiesOf('Component', module).add('With Markdown', () => <MyComponent />, {
 
 Stories can be organized in a nested structure using "/" as a separator:
 
-```js
+```jsx
 // file: src/stories/index.js
 
 import React from 'react';

From eaa6da2b2f6590583fc1e7891ef58e2e2d32d43f Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Mon, 4 Mar 2019 20:30:44 +0800
Subject: [PATCH 134/249] Merge pull request #5842 from
 storybooks/shilman/misc-migration-notes

Misc migration notes
---
 MIGRATION.md | 32 ++++++++++++++++++++++++++++++++
 1 file changed, 32 insertions(+)

diff --git a/MIGRATION.md b/MIGRATION.md
index 5bb3baba152..a9139dcf454 100644
--- a/MIGRATION.md
+++ b/MIGRATION.md
@@ -8,6 +8,8 @@
   - [Addon backgrounds uses parameters](#addon-backgrounds-uses-parameters)
   - [Addon viewport uses parameters](#addon-viewport-uses-parameters)
   - [Addon a11y uses parameters](#addon-a11y-uses-parameters-decorator-renamed)
+  - [New keyboard shortcuts defaults](#new-keyboard-shortcuts-defaults)
+  - [New URL structure](#new-url-structure)
 - [From version 4.0.x to 4.1.x](#from-version-40x-to-41x)
   - [Private addon config](#private-addon-config)
   - [React 15.x](#react-15x)
@@ -231,6 +233,36 @@ Furthermore, the decorator `checkA11y` has been deprecated and renamed to `withA
 
 See the [a11y addon README](https://github.com/storybooks/storybook/blob/master/addons/a11y/README.md) for more information.
 
+## New keyboard shortcuts defaults
+
+Storybook's keyboard shortcuts are updated in 5.0, but they are configurable via the menu so if you want to set them back you can:
+
+| Shorctut               | Old         | New   |
+| ---------------------- | ----------- | ----- |
+| Toggle sidebar         | cmd-shift-X | S     |
+| Toggle addons panel    | cmd-shift-Z | A     |
+| Toggle addons position | cmd-shift-G | D     |
+| Toggle fullscreen      | cmd-shift-F | F     |
+| Next story             | cmd-shift-→ | alt-→ |
+| Prev story             | cmd-shift-← | alt-← |
+| Next component         |             | alt-↓ |
+| Prev component         |             | alt-↑ |
+| Search                 |             | /     |
+
+## New URL structure
+
+We've update Storybook's URL structure in 5.0. The old structure used URL parameters to save the UI state, resulting in long ugly URLs. v5 respects the old URL parameters, but largely does away with them.
+
+The old structure encoded `selectedKind` and `selectedStory` among other parameters. Storybook v5 respects these parameters but will issue a deprecation message in the browser console warning of potential future removal.
+
+The new URL structure looks like:
+
+```
+https://url-of-storybook?path=/story/<storyId>
+```
+
+The structure of `storyId` is a slugified `<selectedKind>--<selectedStory>` (slugified = lowercase, hyphen-separated). Each `storyId` must be unique. We plan to build more features into Storybook in upcoming versions based on this new structure.
+
 ## From version 4.0.x to 4.1.x
 
 There are are a few migrations you should be aware of in 4.1, including one unintentionally breaking change for advanced addon usage.

From 4cf92040424fdd047d69cc93e2ed688cc65fcf3b Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Mon, 4 Mar 2019 22:05:50 +0800
Subject: [PATCH 135/249] Merge pull request #5846 from
 storybooks/5833-deprecate-withA11Y

Deprecate withA11Y
---
 addons/a11y/src/index.js | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/addons/a11y/src/index.js b/addons/a11y/src/index.js
index da104099d00..13428ae784d 100644
--- a/addons/a11y/src/index.js
+++ b/addons/a11y/src/index.js
@@ -57,6 +57,12 @@ if (module && module.hot && module.hot.decline) {
   module.hot.decline();
 }
 
+// TODO: REMOVE at v6.0.0
+export const withA11Y = deprecate(
+  (...args) => withA11y(...args),
+  'withA11Y has been renamed withA11y'
+);
+
 // TODO: REMOVE at v6.0.0
 export const checkA11y = deprecate(
   (...args) => withA11y(...args),

From 619ae85abf2d1eeb8e720242698b4e27b9e679f3 Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Mon, 4 Mar 2019 23:58:39 +0800
Subject: [PATCH 136/249] Merge pull request #5845 from
 huntie/addon-cssresources-migration-docs

Add MIGRATION.md entry for addon-cssresources 5.x attribute change
---
 MIGRATION.md | 41 +++++++++++++++++++++++++++++++++++++++++
 1 file changed, 41 insertions(+)

diff --git a/MIGRATION.md b/MIGRATION.md
index a9139dcf454..1f61a95ee90 100644
--- a/MIGRATION.md
+++ b/MIGRATION.md
@@ -6,6 +6,7 @@
   - [Options addon deprecated](#options-addon-deprecated)
   - [Individual story decorators](#individual-story-decorators)
   - [Addon backgrounds uses parameters](#addon-backgrounds-uses-parameters)
+  - [Addon cssresources name attribute renamed](#addon-cssresources-name-attribute-renamed)
   - [Addon viewport uses parameters](#addon-viewport-uses-parameters)
   - [Addon a11y uses parameters](#addon-a11y-uses-parameters-decorator-renamed)
   - [New keyboard shortcuts defaults](#new-keyboard-shortcuts-defaults)
@@ -187,6 +188,46 @@ storiesOf('Stories', module).addParameters({ backgrounds: options });
 
 You can pass `backgrounds` parameters at the global level (via `addParameters` imported from `@storybook/react` et al.), and the story level (via the third argument to `.add()`).
 
+## Addon cssresources name attribute renamed
+
+In the options object for `@storybook/addon-cssresources`, the `name` attribute for each resource has been renamed to `id`. If you previously had:
+
+```js
+import { withCssResources } from '@storybook/addon-cssresources';
+import { addDecorator } from '@storybook/react';
+
+addDecorator(
+  withCssResources({
+    cssresources: [
+      {
+        name: `bluetheme`, // Previous
+        code: `<style>body { background-color: lightblue; }</style>`,
+        picked: false
+      }
+    ]
+  })
+);
+```
+
+You should replace it with:
+
+```js
+import { withCssResources } from '@storybook/addon-cssresources';
+import { addDecorator } from '@storybook/react';
+
+addDecorator(
+  withCssResources({
+    cssresources: [
+      {
+        id: `bluetheme`, // Renamed
+        code: `<style>body { background-color: lightblue; }</style>`,
+        picked: false
+      }
+    ]
+  })
+);
+```
+
 ## Addon viewport uses parameters
 
 Similarly, `@storybook/addon-viewport` uses parameters to pass viewport options. If you previously had:

From f9343eebf1c06eddedc60de7316dde69e7dc742b Mon Sep 17 00:00:00 2001
From: Tom Coleman <tom@percolatestudio.com>
Date: Tue, 5 Mar 2019 11:31:57 +1100
Subject: [PATCH 137/249] Merge pull request #5850 from
 storybooks/laggy-sidebaritem-active

Fix: SidebarItem feels "laggy" when clicked
---
 .../__snapshots__/storyshots.test.js.snap     | 116 ------------------
 lib/ui/src/components/sidebar/SidebarItem.js  |   1 -
 2 files changed, 117 deletions(-)

diff --git a/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap b/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
index 872ce1e1055..1534ae76e8a 100644
--- a/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
+++ b/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
@@ -5326,8 +5326,6 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 9px;
 }
 
@@ -5361,8 +5359,6 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 24px;
 }
 
@@ -5396,8 +5392,6 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 39px;
 }
 
@@ -5431,8 +5425,6 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 54px;
 }
 
@@ -5687,8 +5679,6 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 9px;
 }
 
@@ -5722,8 +5712,6 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 24px;
 }
 
@@ -5757,8 +5745,6 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 39px;
 }
 
@@ -5792,8 +5778,6 @@ exports[`Storyshots UI|Sidebar/Sidebar loading 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 54px;
 }
 
@@ -6530,8 +6514,6 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
   color: #333333;
@@ -6591,8 +6573,6 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 24px;
   cursor: default;
   background: #1EA7FD;
@@ -6648,8 +6628,6 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 24px;
   cursor: pointer;
   color: #333333;
@@ -7014,8 +6992,6 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
   color: #333333;
@@ -7075,8 +7051,6 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 24px;
   cursor: default;
   background: #1EA7FD;
@@ -7132,8 +7106,6 @@ exports[`Storyshots UI|Sidebar/Sidebar simple 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 24px;
   cursor: pointer;
   color: #333333;
@@ -9721,8 +9693,6 @@ exports[`Storyshots UI|Sidebar/SidebarItem component 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
   color: #333333;
@@ -9783,8 +9753,6 @@ exports[`Storyshots UI|Sidebar/SidebarItem component 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
   color: #333333;
@@ -9871,8 +9839,6 @@ exports[`Storyshots UI|Sidebar/SidebarItem componentExpanded 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
   color: #333333;
@@ -9936,8 +9902,6 @@ exports[`Storyshots UI|Sidebar/SidebarItem componentExpanded 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
   color: #333333;
@@ -10027,8 +9991,6 @@ exports[`Storyshots UI|Sidebar/SidebarItem group 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
   color: #333333;
@@ -10089,8 +10051,6 @@ exports[`Storyshots UI|Sidebar/SidebarItem group 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
   color: #333333;
@@ -10245,8 +10205,6 @@ exports[`Storyshots UI|Sidebar/SidebarItem loading 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 9px;
 }
 
@@ -10352,8 +10310,6 @@ exports[`Storyshots UI|Sidebar/SidebarItem loading 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 9px;
 }
 
@@ -10417,8 +10373,6 @@ exports[`Storyshots UI|Sidebar/SidebarItem nestedDepths 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
   color: #333333;
@@ -10492,8 +10446,6 @@ exports[`Storyshots UI|Sidebar/SidebarItem nestedDepths 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 24px;
   cursor: pointer;
   color: #333333;
@@ -10565,8 +10517,6 @@ exports[`Storyshots UI|Sidebar/SidebarItem nestedDepths 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 39px;
   cursor: pointer;
   color: #333333;
@@ -10595,8 +10545,6 @@ exports[`Storyshots UI|Sidebar/SidebarItem nestedDepths 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 54px;
   cursor: pointer;
   color: #333333;
@@ -10629,8 +10577,6 @@ exports[`Storyshots UI|Sidebar/SidebarItem nestedDepths 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
   color: #333333;
@@ -10704,8 +10650,6 @@ exports[`Storyshots UI|Sidebar/SidebarItem nestedDepths 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 24px;
   cursor: pointer;
   color: #333333;
@@ -10777,8 +10721,6 @@ exports[`Storyshots UI|Sidebar/SidebarItem nestedDepths 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 39px;
   cursor: pointer;
   color: #333333;
@@ -10807,8 +10749,6 @@ exports[`Storyshots UI|Sidebar/SidebarItem nestedDepths 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 54px;
   cursor: pointer;
   color: #333333;
@@ -10945,8 +10885,6 @@ exports[`Storyshots UI|Sidebar/SidebarItem story 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
   color: #333333;
@@ -11008,8 +10946,6 @@ exports[`Storyshots UI|Sidebar/SidebarItem story 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
   color: #333333;
@@ -11127,8 +11063,6 @@ exports[`Storyshots UI|Sidebar/SidebarItem storySelected 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: default;
   background: #1EA7FD;
@@ -11188,8 +11122,6 @@ exports[`Storyshots UI|Sidebar/SidebarItem storySelected 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: default;
   background: #1EA7FD;
@@ -11245,8 +11177,6 @@ exports[`Storyshots UI|Sidebar/SidebarItem with long name 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
   color: #333333;
@@ -11307,8 +11237,6 @@ exports[`Storyshots UI|Sidebar/SidebarItem with long name 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
   color: #333333;
@@ -12486,8 +12414,6 @@ exports[`Storyshots UI|Sidebar/SidebarStories loading 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 9px;
 }
 
@@ -12521,8 +12447,6 @@ exports[`Storyshots UI|Sidebar/SidebarStories loading 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 24px;
 }
 
@@ -12556,8 +12480,6 @@ exports[`Storyshots UI|Sidebar/SidebarStories loading 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 39px;
 }
 
@@ -12591,8 +12513,6 @@ exports[`Storyshots UI|Sidebar/SidebarStories loading 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 54px;
 }
 
@@ -12706,8 +12626,6 @@ exports[`Storyshots UI|Sidebar/SidebarStories loading 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 9px;
 }
 
@@ -12741,8 +12659,6 @@ exports[`Storyshots UI|Sidebar/SidebarStories loading 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 24px;
 }
 
@@ -12776,8 +12692,6 @@ exports[`Storyshots UI|Sidebar/SidebarStories loading 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 39px;
 }
 
@@ -12811,8 +12725,6 @@ exports[`Storyshots UI|Sidebar/SidebarStories loading 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 54px;
 }
 
@@ -13331,8 +13243,6 @@ exports[`Storyshots UI|Sidebar/SidebarStories noRoot 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
   color: #333333;
@@ -13422,8 +13332,6 @@ exports[`Storyshots UI|Sidebar/SidebarStories noRoot 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 24px;
   cursor: pointer;
   color: #333333;
@@ -13495,8 +13403,6 @@ exports[`Storyshots UI|Sidebar/SidebarStories noRoot 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 39px;
   cursor: pointer;
   color: #333333;
@@ -13533,8 +13439,6 @@ exports[`Storyshots UI|Sidebar/SidebarStories noRoot 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 39px;
   cursor: default;
   background: #1EA7FD;
@@ -13703,8 +13607,6 @@ exports[`Storyshots UI|Sidebar/SidebarStories noRoot 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
   color: #333333;
@@ -13794,8 +13696,6 @@ exports[`Storyshots UI|Sidebar/SidebarStories noRoot 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 24px;
   cursor: pointer;
   color: #333333;
@@ -13867,8 +13767,6 @@ exports[`Storyshots UI|Sidebar/SidebarStories noRoot 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 39px;
   cursor: pointer;
   color: #333333;
@@ -13905,8 +13803,6 @@ exports[`Storyshots UI|Sidebar/SidebarStories noRoot 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 39px;
   cursor: default;
   background: #1EA7FD;
@@ -14305,8 +14201,6 @@ exports[`Storyshots UI|Sidebar/SidebarStories withRoot 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
   color: #333333;
@@ -14366,8 +14260,6 @@ exports[`Storyshots UI|Sidebar/SidebarStories withRoot 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 24px;
   cursor: default;
   background: #1EA7FD;
@@ -14423,8 +14315,6 @@ exports[`Storyshots UI|Sidebar/SidebarStories withRoot 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 24px;
   cursor: pointer;
   color: #333333;
@@ -14660,8 +14550,6 @@ exports[`Storyshots UI|Sidebar/SidebarStories withRoot 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 9px;
   cursor: pointer;
   color: #333333;
@@ -14721,8 +14609,6 @@ exports[`Storyshots UI|Sidebar/SidebarStories withRoot 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 24px;
   cursor: default;
   background: #1EA7FD;
@@ -14778,8 +14664,6 @@ exports[`Storyshots UI|Sidebar/SidebarStories withRoot 1`] = `
   -ms-flex: 1;
   flex: 1;
   background: transparent;
-  -webkit-transition: background 75ms ease-out;
-  transition: background 75ms ease-out;
   padding-left: 24px;
   cursor: pointer;
   color: #333333;
diff --git a/lib/ui/src/components/sidebar/SidebarItem.js b/lib/ui/src/components/sidebar/SidebarItem.js
index c8e1625ebe5..72526968f4b 100644
--- a/lib/ui/src/components/sidebar/SidebarItem.js
+++ b/lib/ui/src/components/sidebar/SidebarItem.js
@@ -60,7 +60,6 @@ export const Item = styled.div(
     alignItems: 'center',
     flex: 1,
     background: 'transparent',
-    transition: 'background 75ms ease-out',
   },
   ({ depth }) => ({
     paddingLeft: depth * 15 + 9,

From ced6d407fa4a3e79ea4141f11ad9f1247b08281c Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Tue, 5 Mar 2019 09:29:00 +0800
Subject: [PATCH 138/249] Merge pull request #5843 from
 storybooks/tech/improve-theme-creating

FIX base theme initialization and theme bootup
---
 .../knobs/src/components/__tests__/Panel.js   |   8 +-
 examples/official-storybook/config.js         |   9 +-
 lib/theming/src/base.ts                       |  36 +++
 lib/theming/src/create.ts                     | 220 +++++++++---------
 lib/theming/src/ensure.ts                     |  39 +---
 lib/theming/src/tests/create.test.js          | 145 ++++++++++++
 lib/theming/src/themes/dark.ts                |  10 +-
 lib/theming/src/themes/light.ts               |  10 +-
 lib/ui/package.json                           |   2 -
 .../sidebar/SidebarHeading.stories.js         |   5 +-
 lib/ui/src/core/layout.js                     |  94 +++++---
 lib/ui/src/index.js                           |   2 +-
 lib/ui/src/settings/shortcuts.test.js         |   6 +-
 scripts/compile-js.js                         |   4 +-
 yarn.lock                                     |   5 -
 15 files changed, 390 insertions(+), 205 deletions(-)
 create mode 100644 lib/theming/src/tests/create.test.js

diff --git a/addons/knobs/src/components/__tests__/Panel.js b/addons/knobs/src/components/__tests__/Panel.js
index 6fc9321af28..60bd11af464 100644
--- a/addons/knobs/src/components/__tests__/Panel.js
+++ b/addons/knobs/src/components/__tests__/Panel.js
@@ -3,7 +3,7 @@ import { shallow, mount } from 'enzyme';
 import { STORY_CHANGED } from '@storybook/core-events';
 import { TabsState } from '@storybook/components';
 
-import { ThemeProvider, themes } from '@storybook/theming';
+import { ThemeProvider, themes, convert } from '@storybook/theming';
 import Panel from '../Panel';
 import { CHANGE, SET } from '../../shared';
 import PropForm from '../PropForm';
@@ -191,7 +191,7 @@ describe('Panel', () => {
       // We have to do a full mount.
 
       const root = mount(
-        <ThemeProvider theme={themes.light}>
+        <ThemeProvider theme={convert(themes.light)}>
           <Panel channel={testChannel} api={testApi} active />
         </ThemeProvider>
       );
@@ -225,7 +225,7 @@ describe('Panel', () => {
 
     it('should have one tab per groupId and an empty ALL tab when all are defined', () => {
       const root = mount(
-        <ThemeProvider theme={themes.light}>
+        <ThemeProvider theme={convert(themes.light)}>
           <Panel channel={testChannel} api={testApi} active />
         </ThemeProvider>
       );
@@ -265,7 +265,7 @@ describe('Panel', () => {
 
     it('the ALL tab should have its own additional content when there are knobs both with and without a groupId', () => {
       const root = mount(
-        <ThemeProvider theme={themes.light}>
+        <ThemeProvider theme={convert(themes.light)}>
           <Panel channel={testChannel} api={testApi} active />
         </ThemeProvider>
       );
diff --git a/examples/official-storybook/config.js b/examples/official-storybook/config.js
index 20c4851863b..a3e716b72f2 100644
--- a/examples/official-storybook/config.js
+++ b/examples/official-storybook/config.js
@@ -1,6 +1,6 @@
 import React from 'react';
 import { storiesOf, configure, addDecorator, addParameters } from '@storybook/react';
-import { Global, ThemeProvider, themes, createGlobal } from '@storybook/theming';
+import { Global, ThemeProvider, themes, createReset, create, convert } from '@storybook/theming';
 
 import { withCssResources } from '@storybook/addon-cssresources';
 import { withA11y } from '@storybook/addon-a11y';
@@ -32,8 +32,8 @@ addDecorator(withA11y);
 addDecorator(withNotes);
 
 addDecorator(storyFn => (
-  <ThemeProvider theme={themes.normal}>
-    <Global styles={createGlobal} />
+  <ThemeProvider theme={convert(themes.light)}>
+    <Global styles={createReset} />
     {storyFn()}
   </ThemeProvider>
 ));
@@ -49,9 +49,10 @@ addParameters({
   options: {
     hierarchySeparator: /\/|\./,
     hierarchyRootSeparator: '|',
+    theme: create({ colorPrimary: 'hotpink', colorSecondary: 'orangered' }),
   },
   backgrounds: [
-    { name: 'storybook app', value: themes.normal.background.app, default: true },
+    { name: 'storybook app', value: themes.light.appBg, default: true },
     { name: 'light', value: '#eeeeee' },
     { name: 'dark', value: '#222222' },
   ],
diff --git a/lib/theming/src/base.ts b/lib/theming/src/base.ts
index 061566cf47f..f89258ea291 100644
--- a/lib/theming/src/base.ts
+++ b/lib/theming/src/base.ts
@@ -94,6 +94,42 @@ export const typography = {
   },
 };
 
+export interface ThemeVars {
+  base: 'light' | 'dark';
+
+  colorPrimary?: string;
+  colorSecondary?: string;
+
+  // UI
+  appBg?: string;
+  appContentBg?: string;
+  appBorderColor?: string;
+  appBorderRadius?: number;
+
+  // Typography
+  fontBase?: string;
+  fontCode?: string;
+
+  // Text colors
+  textColor?: string;
+  textInverseColor?: string;
+
+  // Toolbar default and active colors
+  barTextColor?: string;
+  barSelectedColor?: string;
+  barBg?: string;
+
+  // Form colors
+  inputBg?: string;
+  inputBorder?: string;
+  inputTextColor?: string;
+  inputBorderRadius?: number;
+
+  brandTitle?: string;
+  brandUrl?: string;
+  brandImage?: string;
+}
+
 export type Color = typeof color;
 export type Background = typeof background;
 export type Typography = typeof typography;
diff --git a/lib/theming/src/create.ts b/lib/theming/src/create.ts
index dce9514df68..a4d44f016a3 100644
--- a/lib/theming/src/create.ts
+++ b/lib/theming/src/create.ts
@@ -1,52 +1,21 @@
 // This generates theme variables in the correct shape for the UI
-
-import { Theme, Brand, color, Color, background, typography } from './base';
-import { easing, animation } from './animation';
-import { create as createSyntax } from './modules/syntax';
 import { chromeLight, chromeDark } from 'react-inspector';
 import { opacify } from 'polished';
 
+import lightThemeVars from './themes/light';
+import darkThemeVars from './themes/dark';
+
+import { Theme, color, Color, background, typography, ThemeVars } from './base';
+import { easing, animation } from './animation';
+import { create as createSyntax } from './modules/syntax';
+
+const themes: { light: ThemeVars; dark: ThemeVars } = { light: lightThemeVars, dark: darkThemeVars };
+
 interface Rest {
   [key: string]: any;
 }
 
-interface ThemeVar {
-  base?: 'light' | 'dark';
-
-  colorPrimary?: string;
-  colorSecondary?: string;
-
-  // UI
-  appBg?: string;
-  appContentBg?: string;
-  appBorderColor?: string;
-  appBorderRadius?: number;
-
-  // Typography
-  fontBase?: string;
-  fontCode?: string;
-
-  // Text colors
-  textColor?: string;
-  textInverseColor?: string;
-
-  // Toolbar default and active colors
-  barTextColor?: string;
-  barSelectedColor?: string;
-  barBg?: string;
-
-  // Form colors
-  inputBg?: string;
-  inputBorder?: string;
-  inputTextColor?: string;
-  inputBorderRadius?: number;
-
-  brandTitle?: string;
-  brandUrl?: string;
-  brandImage?: string;
-}
-
-const createColors = (vars: ThemeVar): Color => ({
+const createColors = (vars: ThemeVars): Color => ({
   // Changeable colors
   primary: vars.colorPrimary,
   secondary: vars.colorSecondary,
@@ -110,76 +79,117 @@ const darkSyntaxColors = {
   blue2: '#00009f',
 };
 
-export const create = (vars: ThemeVar, rest?: Rest): Theme => ({
-  base: vars.base,
-  color: createColors(vars),
-  background: {
-    app: vars.appBg || background.app,
-    content: vars.appContentBg || color.lightest,
-    hoverable: vars.base === 'light' ? 'rgba(0,0,0,.05)' : 'rgba(250,250,252,.1)' || background.hoverable,
+export const create = (vars: ThemeVars = { base: 'light' }, rest?: Rest): ThemeVars => {
+  const inherit: ThemeVars = {
+    ...themes.light,
+    ...(themes[vars.base] || {}),
+    ...vars,
+    ...{ base: themes[vars.base] ? vars.base : 'light' },
+  };
+  return {
+    ...rest,
+    ...inherit,
+    ...{ barSelectedColor: vars.barSelectedColor || inherit.colorSecondary },
+  };
+};
 
-    positive: background.positive,
-    negative: background.negative,
-    warning: background.warning,
-  },
-  typography: {
-    fonts: {
-      base: vars.fontBase || typography.fonts.base,
-      mono: vars.fontCode || typography.fonts.mono,
+export const convert = (inherit: ThemeVars = lightThemeVars): Theme => {
+  const {
+    base,
+    colorPrimary,
+    colorSecondary,
+    appBg,
+    appContentBg,
+    appBorderColor,
+    appBorderRadius,
+    fontBase,
+    fontCode,
+    textColor,
+    textInverseColor,
+    barTextColor,
+    barSelectedColor,
+    barBg,
+    inputBg,
+    inputBorder,
+    inputTextColor,
+    inputBorderRadius,
+    brandTitle,
+    brandUrl,
+    brandImage,
+    ...rest
+  } = inherit;
+
+  return {
+    ...(rest || {}),
+
+    base,
+    color: createColors(inherit),
+    background: {
+      app: appBg,
+      content: appContentBg,
+      hoverable: base === 'light' ? 'rgba(0,0,0,.05)' : 'rgba(250,250,252,.1)' || background.hoverable,
+
+      positive: background.positive,
+      negative: background.negative,
+      warning: background.warning,
     },
-    weight: typography.weight,
-    size: typography.size,
-  },
-  animation,
-  easing,
+    typography: {
+      fonts: {
+        base: fontBase,
+        mono: fontCode,
+      },
+      weight: typography.weight,
+      size: typography.size,
+    },
+    animation,
+    easing,
 
-  input: {
-    border: vars.inputBorder || color.border,
-    background: vars.inputBg || color.lightest,
-    color: vars.inputTextColor || color.defaultText,
-    borderRadius: vars.inputBorderRadius || vars.appBorderRadius || 4,
-  },
+    input: {
+      border: inputBorder,
+      background: inputBg,
+      color: inputTextColor,
+      borderRadius: inputBorderRadius,
+    },
 
-  // UI
-  layoutMargin: 10,
-  appBorderColor: vars.appBorderColor || color.border,
-  appBorderRadius: vars.appBorderRadius || 4,
+    // UI
+    layoutMargin: 10,
+    appBorderColor,
+    appBorderRadius,
 
-  // Toolbar default/active colors
-  barTextColor: vars.barTextColor || color.mediumdark,
-  barSelectedColor: vars.barSelectedColor || color.secondary,
-  barBg: vars.barBg || color.lightest,
+    // Toolbar default/active colors
+    barTextColor,
+    barSelectedColor: barSelectedColor || colorSecondary,
+    barBg,
 
-  // Brand logo/text
-  brand: {
-    title: vars.brandTitle,
-    url: vars.brandUrl,
-    image: vars.brandImage,
-  },
+    // Brand logo/text
+    brand: {
+      title: brandTitle,
+      url: brandUrl,
+      image: brandImage,
+    },
 
-  code: createSyntax({
-    colors: vars.base === 'light' ? lightSyntaxColors : darkSyntaxColors,
-    mono: vars.fontCode || typography.fonts.mono,
-  }),
+    code: createSyntax({
+      colors: base === 'light' ? lightSyntaxColors : darkSyntaxColors,
+      mono: fontCode,
+    }),
 
-  // Addon actions theme
-  // API example https://github.com/xyc/react-inspector/blob/master/src/styles/themes/chromeLight.js
-  addonActionsTheme: {
-    ...(vars.base === 'light' ? chromeLight : chromeDark),
+    // Addon actions theme
+    // API example https://github.com/xyc/react-inspector/blob/master/src/styles/themes/chromeLight.js
+    addonActionsTheme: {
+      ...(base === 'light' ? chromeLight : chromeDark),
 
-    BASE_FONT_FAMILY: vars.fontCode || typography.fonts.mono,
-    BASE_FONT_SIZE: typography.size.s2 - 1,
-    BASE_LINE_HEIGHT: '18px',
-    BASE_BACKGROUND_COLOR: 'transparent',
-    BASE_COLOR: vars.textColor || color.darkest,
-    ARROW_COLOR: opacify(0.2, vars.appBorderColor || color.border),
-    ARROW_MARGIN_RIGHT: 4,
-    ARROW_FONT_SIZE: 8,
-    TREENODE_FONT_FAMILY: vars.fontCode || typography.fonts.mono,
-    TREENODE_FONT_SIZE: typography.size.s2 - 1,
-    TREENODE_LINE_HEIGHT: '18px',
-    TREENODE_PADDING_LEFT: 12,
-  },
-
-  ...(rest || {}),
-});
+      BASE_FONT_FAMILY: fontCode,
+      BASE_FONT_SIZE: typography.size.s2 - 1,
+      BASE_LINE_HEIGHT: '18px',
+      BASE_BACKGROUND_COLOR: 'transparent',
+      BASE_COLOR: textColor,
+      ARROW_COLOR: opacify(0.2, appBorderColor),
+      ARROW_MARGIN_RIGHT: 4,
+      ARROW_FONT_SIZE: 8,
+      TREENODE_FONT_FAMILY: fontCode,
+      TREENODE_FONT_SIZE: typography.size.s2 - 1,
+      TREENODE_LINE_HEIGHT: '18px',
+      TREENODE_PADDING_LEFT: 12,
+    },
+  };
+};
diff --git a/lib/theming/src/ensure.ts b/lib/theming/src/ensure.ts
index 70fe4771812..7cfb9ea1f99 100644
--- a/lib/theming/src/ensure.ts
+++ b/lib/theming/src/ensure.ts
@@ -3,42 +3,15 @@ import { logger } from '@storybook/client-logger';
 import { deletedDiff } from 'deep-object-diff';
 import { stripIndent } from 'common-tags';
 
-import mergeWith from 'lodash.mergewith';
-import isEqual from 'lodash.isequal';
-
 import light from './themes/light';
-import { Theme } from './base';
+import { Theme, ThemeVars } from './base';
+import { convert } from './create';
 
-const base = {
-  ...light,
-  animation: {},
-  brand: {},
-};
-
-// merge with concatenating arrays, but no duplicates
-const merge = (a: any, b: any) =>
-  mergeWith({}, a, b, (objValue: any, srcValue: any) => {
-    if (Array.isArray(srcValue) && Array.isArray(objValue)) {
-      srcValue.forEach(s => {
-        const existing = objValue.find(o => o === s || isEqual(o, s));
-        if (!existing) {
-          objValue.push(s);
-        }
-      });
-
-      return objValue;
-    }
-    if (Array.isArray(objValue)) {
-      return objValue;
-    }
-    return undefined;
-  });
-
-export const ensure = (input: any): Theme => {
+export const ensure = (input: ThemeVars): Theme => {
   if (!input) {
-    return light;
+    return convert(light);
   } else {
-    const missing = deletedDiff(base, input);
+    const missing = deletedDiff(light, input);
     if (Object.keys(missing).length) {
       logger.warn(
         stripIndent`
@@ -50,6 +23,6 @@ export const ensure = (input: any): Theme => {
       );
     }
 
-    return merge(light, input);
+    return convert(input);
   }
 };
diff --git a/lib/theming/src/tests/create.test.js b/lib/theming/src/tests/create.test.js
new file mode 100644
index 00000000000..94494ceea09
--- /dev/null
+++ b/lib/theming/src/tests/create.test.js
@@ -0,0 +1,145 @@
+import { create, convert } from '../create';
+import darkThemeVars from '../themes/dark';
+import lightThemeVars from '../themes/light';
+
+describe('create base', () => {
+  it('should create a theme with minimal viable theme', () => {
+    const result = create({ base: 'light' });
+
+    expect(result).toBeDefined();
+  });
+  it('should pick `light` when `base` is missing', () => {
+    const result = create({ base: undefined });
+
+    expect(result.base).toBe('light');
+  });
+  it('should pick `light` when nothing is given', () => {
+    const result = create();
+
+    expect(result.base).toBe('light');
+  });
+  it('should pick `dark` when base is dark', () => {
+    const result = create({ base: 'dark' });
+
+    expect(result.base).toBe('dark');
+  });
+  it('should pick `light` when base is a unknown value', () => {
+    const result = create({ base: 'foobar' });
+
+    expect(result.base).toBe('light');
+  });
+});
+
+describe('create merge', () => {
+  it('should merge colorPrimary', () => {
+    const result = create({ base: 'light', colorPrimary: 'orange' });
+
+    expect(result).toHaveProperty('colorPrimary', 'orange');
+  });
+  it('should merge colorSecondary', () => {
+    const result = create({ base: 'light', colorSecondary: 'orange' });
+
+    expect(result).toHaveProperty('colorSecondary', 'orange');
+  });
+  it('should merge appBg', () => {
+    const result = create({ base: 'light', appBg: 'orange' });
+
+    expect(result).toHaveProperty('appBg', 'orange');
+  });
+});
+
+describe('create brand', () => {
+  it('should have default', () => {
+    const result = create({ base: 'light' });
+
+    expect(result.brandImage).not.toBeDefined();
+    expect(result.brandTitle).not.toBeDefined();
+    expect(result.brandUrl).not.toBeDefined();
+  });
+  it('should accept null', () => {
+    const result = create({ base: 'light', brandTitle: null, brandUrl: null, brandImage: null });
+
+    expect(result).toMatchObject({
+      brandImage: null,
+      brandTitle: null,
+      brandUrl: null,
+    });
+  });
+  it('should accept values', () => {
+    const result = create({
+      base: 'light',
+      brandImage: 'https://placehold.it/350x150',
+      brandTitle: 'my custom storybook',
+      brandUrl: 'https://example.com',
+    });
+
+    expect(result).toMatchObject({
+      brandImage: 'https://placehold.it/350x150',
+      brandTitle: 'my custom storybook',
+      brandUrl: 'https://example.com',
+    });
+  });
+});
+
+describe('create extend', () => {
+  it('should allow custom props', () => {
+    const result = create(
+      {
+        base: 'light',
+      },
+      {
+        myCustomProperty: 42,
+      }
+    );
+
+    expect(result.myCustomProperty).toEqual(42);
+  });
+  it('should not allow overriding known properties with custom props', () => {
+    const result = create(
+      {
+        base: 'light',
+      },
+      {
+        base: 42,
+      }
+    );
+
+    expect(result.base).toEqual('light');
+  });
+});
+
+describe('convert', () => {
+  it('should return the default theme when no params', () => {
+    const result = convert();
+
+    expect(result.base).toEqual('light');
+  });
+  it('should return a valid dark theme', () => {
+    const result = convert(darkThemeVars);
+
+    expect(result.base).toEqual('dark');
+    expect(result).toMatchObject({
+      color: expect.objectContaining({
+        primary: '#FF4785',
+        secondary: '#1EA7FD',
+      }),
+      background: expect.objectContaining({
+        app: '#2f2f2f',
+      }),
+    });
+  });
+  it('should return a valid light theme', () => {
+    const result = convert(lightThemeVars);
+
+    expect(result.base).toEqual('light');
+    expect(result).toMatchObject({
+      color: expect.objectContaining({
+        primary: '#FF4785',
+        secondary: '#1EA7FD',
+      }),
+      background: expect.objectContaining({
+        app: '#F6F9FC',
+      }),
+    });
+  });
+});
diff --git a/lib/theming/src/themes/dark.ts b/lib/theming/src/themes/dark.ts
index 5c64255032d..39ed282514f 100644
--- a/lib/theming/src/themes/dark.ts
+++ b/lib/theming/src/themes/dark.ts
@@ -1,8 +1,6 @@
-import { create } from '../create';
-import { color, typography } from '../base';
+import { color, typography, ThemeVars } from '../base';
 
-export default create({
-  // Is this a light theme or a dark theme?
+const theme: ThemeVars = {
   base: 'dark',
 
   // Storybook-specific color palette
@@ -33,4 +31,6 @@ export default create({
   inputBorder: 'rgba(0,0,0,.3)',
   inputTextColor: color.lightest,
   inputBorderRadius: 4,
-});
+};
+
+export default theme;
diff --git a/lib/theming/src/themes/light.ts b/lib/theming/src/themes/light.ts
index f635af5ca6b..fec3cd175c3 100644
--- a/lib/theming/src/themes/light.ts
+++ b/lib/theming/src/themes/light.ts
@@ -1,8 +1,6 @@
-import { create } from '../create';
-import { color, typography, background } from '../base';
+import { color, typography, background, ThemeVars } from '../base';
 
-export default create({
-  // Is this a light theme or a dark theme?
+const theme: ThemeVars = {
   base: 'light',
 
   // Storybook-specific color palette
@@ -33,4 +31,6 @@ export default create({
   inputBorder: color.border,
   inputTextColor: color.darkest,
   inputBorderRadius: 4,
-});
+};
+
+export default theme;
diff --git a/lib/ui/package.json b/lib/ui/package.json
index c9531bf9a92..4398aa7789c 100644
--- a/lib/ui/package.json
+++ b/lib/ui/package.json
@@ -27,9 +27,7 @@
     "@storybook/core-events": "5.0.0-rc.10",
     "@storybook/router": "5.0.0-rc.10",
     "@storybook/theming": "5.0.0-rc.10",
-    "eventemitter3": "^3.1.0",
     "fast-deep-equal": "^2.0.1",
-    "fuse.js": "^3.3.1",
     "fuzzy-search": "^3.0.1",
     "global": "^4.3.2",
     "history": "^4.7.2",
diff --git a/lib/ui/src/components/sidebar/SidebarHeading.stories.js b/lib/ui/src/components/sidebar/SidebarHeading.stories.js
index 17f0960d90b..3bd9b36297d 100644
--- a/lib/ui/src/components/sidebar/SidebarHeading.stories.js
+++ b/lib/ui/src/components/sidebar/SidebarHeading.stories.js
@@ -1,10 +1,11 @@
 import React from 'react';
-import { themes, ThemeProvider } from '@storybook/theming';
+import { themes, ThemeProvider, convert } from '@storybook/theming';
 import { action } from '@storybook/addon-actions';
 
 import SidebarHeading from './SidebarHeading';
 
-const { light: theme } = themes;
+const { light } = themes;
+const theme = convert(light);
 
 export default {
   component: SidebarHeading,
diff --git a/lib/ui/src/core/layout.js b/lib/ui/src/core/layout.js
index d6bf8ef8ce9..520b863ab67 100644
--- a/lib/ui/src/core/layout.js
+++ b/lib/ui/src/core/layout.js
@@ -1,14 +1,16 @@
 import pick from 'lodash.pick';
 
 import deprecate from 'util-deprecate';
+import deepEqual from 'fast-deep-equal';
 
-import { create, themes } from '@storybook/theming';
+import { themes } from '@storybook/theming';
 import merge from '../libs/merge';
 
 const deprecatedThemeOptions = {
   name: 'brandTitle',
   url: 'brandUrl',
 };
+
 const deprecatedLayoutOptions = {
   goFullScreen: 'isFullscreen',
   showStoriesPanel: 'showNav',
@@ -21,15 +23,14 @@ const deprecationMessage = (optionsMap, prefix) =>
     prefix ? `${prefix}'s` : ''
   } { ${Object.values(optionsMap).join(', ')} } instead.`;
 
-const applyDeprecatedThemeOptions = deprecate(({ name, url, theme }) => {
-  const vars = {
+const applyDeprecatedThemeOptions = deprecate(
+  ({ name, url }) => ({
     brandTitle: name,
     brandUrl: url,
     brandImage: null,
-  };
-
-  return { theme: create(vars, theme) };
-}, deprecationMessage(deprecatedThemeOptions));
+  }),
+  deprecationMessage(deprecatedThemeOptions)
+);
 
 const applyDeprecatedLayoutOptions = deprecate(options => {
   const layoutUpdate = {};
@@ -59,6 +60,23 @@ const checkDeprecatedLayoutOptions = options => {
   return {};
 };
 
+const initial = {
+  ui: {
+    enableShortcuts: true,
+    sortStoriesByKind: false,
+    sidebarAnimations: true,
+  },
+  layout: {
+    isToolshown: true,
+    isFullscreen: false,
+    showPanel: true,
+    showNav: true,
+    panelPosition: 'bottom',
+  },
+  theme: themes.light,
+};
+
+let hasSetOptions = false;
 export default function({ store }) {
   const api = {
     toggleFullscreen(toggled) {
@@ -132,7 +150,13 @@ export default function({ store }) {
     },
 
     setOptions: options => {
-      const { layout, ui, selectedPanel } = store.getState();
+      // The very first time the user sets their options, we don't consider what is in the store.
+      // At this point in time, what is in the store is what we *persisted*. We did that in order
+      // to avoid a FOUC (e.g. initial rendering the wrong theme while we waited for the stories to load)
+      // However, we don't want to have a memory about these things, otherwise we see bugs like the
+      // user setting a name for their storybook, persisting it, then never being able to unset it
+      // without clearing localstorage. See https://github.com/storybooks/storybook/issues/5857
+      const { layout, ui, selectedPanel, theme } = hasSetOptions ? store.getState() : initial;
 
       if (options) {
         const updatedLayout = {
@@ -144,40 +168,40 @@ export default function({ store }) {
         const updatedUi = {
           ...ui,
           ...pick(options, Object.keys(ui)),
+        };
+
+        const updatedTheme = {
+          ...theme,
+          ...options.theme,
           ...checkDeprecatedThemeOptions(options),
         };
 
-        store.setState(
-          {
-            layout: updatedLayout,
-            ui: updatedUi,
-            selectedPanel: options.panel || options.selectedPanel || selectedPanel,
-          },
-          { persistence: 'permanent' }
-        );
+        const modification = {};
+
+        if (!deepEqual(ui, updatedUi)) {
+          modification.ui = updatedUi;
+        }
+        if (!deepEqual(layout, updatedLayout)) {
+          modification.layout = updatedLayout;
+        }
+        if (!deepEqual(theme, updatedTheme)) {
+          modification.theme = updatedTheme;
+        }
+        if (!deepEqual(selectedPanel, options.selectedPanel)) {
+          modification.selectedPanel = options.selectedPanel;
+        }
+
+        if (Object.keys(modification).length) {
+          store.setState(modification, { persistence: 'permanent' });
+        }
+
+        hasSetOptions = true;
       }
     },
   };
 
-  const fromState = pick(store.getState(), 'layout', 'ui', 'selectedPanel');
-
-  const initial = {
-    ui: {
-      enableShortcuts: true,
-      sortStoriesByKind: false,
-      sidebarAnimations: true,
-      theme: themes.normal,
-    },
-    layout: {
-      isToolshown: true,
-      isFullscreen: false,
-      showPanel: true,
-      showNav: true,
-      panelPosition: 'bottom',
-    },
-  };
-
-  const state = merge(fromState, initial);
+  const persisted = pick(store.getState(), 'layout', 'ui', 'selectedPanel', 'theme');
+  const state = merge(initial, persisted);
 
   return { api, state };
 }
diff --git a/lib/ui/src/index.js b/lib/ui/src/index.js
index 990a8cd1312..2e62922d4aa 100644
--- a/lib/ui/src/index.js
+++ b/lib/ui/src/index.js
@@ -24,7 +24,7 @@ const Root = ({ provider }) => (
           {locationData => (
             <ManagerProvider key="manager" provider={provider} {...locationData}>
               {({ state }) => (
-                <ThemeProvider key="theme.provider" theme={ensureTheme(state.ui.theme)}>
+                <ThemeProvider key="theme.provider" theme={ensureTheme(state.theme)}>
                   <App key="app" viewMode={state.viewMode} layout={state.layout} />
                 </ThemeProvider>
               )}
diff --git a/lib/ui/src/settings/shortcuts.test.js b/lib/ui/src/settings/shortcuts.test.js
index c791f10c055..afad8d70ca0 100644
--- a/lib/ui/src/settings/shortcuts.test.js
+++ b/lib/ui/src/settings/shortcuts.test.js
@@ -2,7 +2,7 @@ import React from 'react';
 import { shallow } from 'enzyme';
 import { render } from 'react-testing-library';
 
-import { ThemeProvider, themes } from '@storybook/theming';
+import { ThemeProvider, themes, convert } from '@storybook/theming';
 import ShortcutsScreen from './shortcuts';
 
 // A limited set of keys we use in this test file
@@ -26,7 +26,7 @@ const makeActions = () => ({
 describe('ShortcutsScreen', () => {
   it('renders correctly', () => {
     const comp = shallow(
-      <ThemeProvider theme={themes.light}>
+      <ThemeProvider theme={convert(themes.light)}>
         <ShortcutsScreen shortcutKeys={shortcutKeys} {...makeActions()} />
       </ThemeProvider>
     );
@@ -35,7 +35,7 @@ describe('ShortcutsScreen', () => {
 
   it('handles a full mount', () => {
     const comp = render(
-      <ThemeProvider theme={themes.light}>
+      <ThemeProvider theme={convert(themes.light)}>
         <ShortcutsScreen shortcutKeys={shortcutKeys} {...makeActions()} />
       </ThemeProvider>
     );
diff --git a/scripts/compile-js.js b/scripts/compile-js.js
index 1ebba2962c7..a25c9907aab 100644
--- a/scripts/compile-js.js
+++ b/scripts/compile-js.js
@@ -34,7 +34,9 @@ function babelify(options = {}) {
   const { watch = false, silent = true, errorCallback } = options;
 
   if (!fs.existsSync('src')) {
-    if (!silent) console.log('No src dir');
+    if (!silent) {
+      console.log('No src dir');
+    }
     return;
   }
 
diff --git a/yarn.lock b/yarn.lock
index 12d83c5d35e..cbb66f5d7c7 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -9556,11 +9556,6 @@ functional-red-black-tree@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/functional-red-black-tree/-/functional-red-black-tree-1.0.1.tgz#1b0ab3bd553b2a0d6399d29c0e3ea0b252078327"
 
-fuse.js@^3.3.1:
-  version "3.3.1"
-  resolved "https://registry.yarnpkg.com/fuse.js/-/fuse.js-3.3.1.tgz#6e4762b1e1219f41bac8b7b723204d2b1d4cb8cf"
-  integrity sha512-Ranlb3nqh4Scw1ev5HvMoBUNHnhLceTGImSVf7ug87exLI75CfjhpCV5lFr1vHrAEn7fS80KZFaHCOznlGAG4A==
-
 fuzzy-search@^3.0.1:
   version "3.0.1"
   resolved "https://registry.yarnpkg.com/fuzzy-search/-/fuzzy-search-3.0.1.tgz#14a4964508a9607d6e9a88818e7ff634108260b6"

From bced5bf69212a6c06f107c9f9121c604a5e459d2 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Tue, 5 Mar 2019 10:08:31 +0800
Subject: [PATCH 139/249] Theming mgiration placeholder

Misc migration notes
---
 MIGRATION.md | 17 +++++++++++------
 1 file changed, 11 insertions(+), 6 deletions(-)

diff --git a/MIGRATION.md b/MIGRATION.md
index 1f61a95ee90..2d9f55a3df5 100644
--- a/MIGRATION.md
+++ b/MIGRATION.md
@@ -2,6 +2,7 @@
 
 - [From version 4.1.x to 5.0.x](#from-version-41x-to-50x)
   - [Webpack config simplification](#webpack-config-simplification)
+  - [Theming overhaul](#theming-overhaul)
   - [Story hierarchy defaults](#story-hierarchy-defaults)
   - [Options addon deprecated](#options-addon-deprecated)
   - [Individual story decorators](#individual-story-decorators)
@@ -68,6 +69,10 @@ In contrast, the 4.x configuration function accepted either two or three argumen
 
 Please see the [current custom webpack documentation](https://github.com/storybooks/storybook/blob/next/docs/src/pages/configurations/custom-webpack-config/index.md) for more information on custom webpack config.
 
+## Theming overhaul
+
+Theming has been rewritten in v5. If you used theming in v4, please consult the [theming docs](https://github.com/storybooks/storybook/blob/next/docs/src/pages/configurations/theming/index.md) to learn about the new API.
+
 ## Story hierarchy defaults
 
 Storybook's UI contains a hierarchical tree of stories that can be configured by `hierarchySeparator` and `hierarchyRootSeparator` [options](./addons/options/README.md).
@@ -202,9 +207,9 @@ addDecorator(
       {
         name: `bluetheme`, // Previous
         code: `<style>body { background-color: lightblue; }</style>`,
-        picked: false
-      }
-    ]
+        picked: false,
+      },
+    ],
   })
 );
 ```
@@ -221,9 +226,9 @@ addDecorator(
       {
         id: `bluetheme`, // Renamed
         code: `<style>body { background-color: lightblue; }</style>`,
-        picked: false
-      }
-    ]
+        picked: false,
+      },
+    ],
   })
 );
 ```

From cf9a855b8f6847a5621352244e75192d085a267d Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Tue, 5 Mar 2019 10:12:39 +0800
Subject: [PATCH 140/249] 5.0.0-rc.11 changelog

---
 CHANGELOG.md | 12 ++++++++++++
 1 file changed, 12 insertions(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index c681692b1bb..6b14f5a6249 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,15 @@
+## 5.0.0-rc.11 (March 5, 2019)
+
+### Bug Fixes
+
+* UI: Fix base theme initialization and theme bootup ([#5843](https://github.com/storybooks/storybook/pull/5843))
+* UI: Fix SidebarItem feels "laggy" when clicked ([#5850](https://github.com/storybooks/storybook/pull/5850))
+* Addon-viewport: Restore v4 behaviour ([#5829](https://github.com/storybooks/storybook/pull/5829))
+
+### Maintenance
+
+* Addon-a11y: Cleanup & document migration ([#5833](https://github.com/storybooks/storybook/pull/5833))
+
 ## 5.0.0-rc.10 (March 4, 2019)
 
 ### Bug Fixes

From 2724eb7c21d0d28e9a5cf0abf314f2314f32d594 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Tue, 5 Mar 2019 10:13:46 +0800
Subject: [PATCH 141/249] v5.0.0-rc.11

---
 addons/a11y/package.json                      | 12 ++---
 addons/actions/package.json                   | 10 ++--
 addons/backgrounds/package.json               | 12 ++---
 addons/centered/package.json                  |  2 +-
 addons/cssresources/package.json              | 10 ++--
 addons/events/package.json                    |  8 +--
 addons/google-analytics/package.json          |  6 +--
 addons/graphql/package.json                   |  2 +-
 addons/info/package.json                      | 10 ++--
 addons/jest/package.json                      | 10 ++--
 addons/knobs/package.json                     | 10 ++--
 addons/links/package.json                     |  6 +--
 addons/notes/package.json                     | 12 ++---
 addons/ondevice-backgrounds/package.json      |  4 +-
 addons/ondevice-knobs/package.json            |  4 +-
 addons/ondevice-notes/package.json            |  4 +-
 addons/options/package.json                   |  4 +-
 .../storyshots/storyshots-core/package.json   |  4 +-
 .../storyshots-puppeteer/package.json         |  6 +--
 addons/storysource/package.json               | 10 ++--
 addons/viewport/package.json                  | 12 ++---
 app/angular/package.json                      |  6 +--
 app/ember/package.json                        |  4 +-
 app/html/package.json                         |  4 +-
 app/marko/package.json                        |  4 +-
 app/mithril/package.json                      |  4 +-
 app/polymer/package.json                      |  4 +-
 app/preact/package.json                       |  4 +-
 app/react-native/package.json                 | 14 ++---
 app/react/package.json                        |  8 +--
 app/riot/package.json                         |  4 +-
 app/svelte/package.json                       |  4 +-
 app/vue/package.json                          |  4 +-
 examples/angular-cli/package.json             | 26 ++++-----
 examples/cra-kitchen-sink/package.json        | 32 +++++------
 examples/cra-ts-kitchen-sink/package.json     | 12 ++---
 examples/ember-cli/package.json               | 26 ++++-----
 examples/html-kitchen-sink/package.json       | 36 ++++++-------
 examples/marko-cli/package.json               | 14 ++---
 examples/mithril-kitchen-sink/package.json    | 26 ++++-----
 examples/official-storybook/package.json      | 48 ++++++++---------
 examples/polymer-cli/package.json             | 20 +++----
 examples/preact-kitchen-sink/package.json     | 26 ++++-----
 examples/riot-kitchen-sink/package.json       | 26 ++++-----
 examples/svelte-kitchen-sink/package.json     | 26 ++++-----
 examples/vue-kitchen-sink/package.json        | 26 ++++-----
 lerna.json                                    |  2 +-
 lib/addons/package.json                       |  6 +--
 lib/channel-postmessage/package.json          |  6 +--
 lib/channel-websocket/package.json            |  4 +-
 lib/channels/package.json                     |  2 +-
 lib/cli/package.json                          | 54 +++++++++----------
 lib/client-api/package.json                   | 10 ++--
 lib/client-logger/package.json                |  2 +-
 lib/codemod/package.json                      |  2 +-
 lib/components/package.json                   | 12 ++---
 lib/core-events/package.json                  |  2 +-
 lib/core/package.json                         | 20 +++----
 lib/node-logger/package.json                  |  2 +-
 lib/router/package.json                       |  4 +-
 lib/theming/package.json                      |  4 +-
 lib/ui/package.json                           | 14 ++---
 62 files changed, 356 insertions(+), 356 deletions(-)

diff --git a/addons/a11y/package.json b/addons/a11y/package.json
index 1a39cf441c4..96f215d86f8 100644
--- a/addons/a11y/package.json
+++ b/addons/a11y/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-a11y",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "a11y addon for storybook",
   "keywords": [
     "a11y",
@@ -25,11 +25,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.10",
-    "@storybook/client-logger": "5.0.0-rc.10",
-    "@storybook/components": "5.0.0-rc.10",
-    "@storybook/core-events": "5.0.0-rc.10",
-    "@storybook/theming": "5.0.0-rc.10",
+    "@storybook/addons": "5.0.0-rc.11",
+    "@storybook/client-logger": "5.0.0-rc.11",
+    "@storybook/components": "5.0.0-rc.11",
+    "@storybook/core-events": "5.0.0-rc.11",
+    "@storybook/theming": "5.0.0-rc.11",
     "axe-core": "^3.1.2",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
diff --git a/addons/actions/package.json b/addons/actions/package.json
index 93d295575ba..a704ac34557 100644
--- a/addons/actions/package.json
+++ b/addons/actions/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-actions",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "Action Logger addon for storybook",
   "keywords": [
     "storybook"
@@ -20,10 +20,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.10",
-    "@storybook/components": "5.0.0-rc.10",
-    "@storybook/core-events": "5.0.0-rc.10",
-    "@storybook/theming": "5.0.0-rc.10",
+    "@storybook/addons": "5.0.0-rc.11",
+    "@storybook/components": "5.0.0-rc.11",
+    "@storybook/core-events": "5.0.0-rc.11",
+    "@storybook/theming": "5.0.0-rc.11",
     "core-js": "^2.6.2",
     "fast-deep-equal": "^2.0.1",
     "global": "^4.3.2",
diff --git a/addons/backgrounds/package.json b/addons/backgrounds/package.json
index d8bace1961a..d06101cca11 100644
--- a/addons/backgrounds/package.json
+++ b/addons/backgrounds/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-backgrounds",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "A storybook addon to show different backgrounds for your preview",
   "keywords": [
     "addon",
@@ -24,11 +24,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.10",
-    "@storybook/client-logger": "5.0.0-rc.10",
-    "@storybook/components": "5.0.0-rc.10",
-    "@storybook/core-events": "5.0.0-rc.10",
-    "@storybook/theming": "5.0.0-rc.10",
+    "@storybook/addons": "5.0.0-rc.11",
+    "@storybook/client-logger": "5.0.0-rc.11",
+    "@storybook/components": "5.0.0-rc.11",
+    "@storybook/core-events": "5.0.0-rc.11",
+    "@storybook/theming": "5.0.0-rc.11",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
diff --git a/addons/centered/package.json b/addons/centered/package.json
index 1788548fb04..83270bc7a6a 100644
--- a/addons/centered/package.json
+++ b/addons/centered/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-centered",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "Storybook decorator to center components",
   "keywords": [
     "addon",
diff --git a/addons/cssresources/package.json b/addons/cssresources/package.json
index 290e8c105d6..30823151ea4 100644
--- a/addons/cssresources/package.json
+++ b/addons/cssresources/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-cssresources",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "A storybook addon to switch between css resources at runtime for your story",
   "keywords": [
     "addon",
@@ -24,10 +24,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.10",
-    "@storybook/channels": "5.0.0-rc.10",
-    "@storybook/components": "5.0.0-rc.10",
-    "@storybook/core-events": "5.0.0-rc.10",
+    "@storybook/addons": "5.0.0-rc.11",
+    "@storybook/channels": "5.0.0-rc.11",
+    "@storybook/components": "5.0.0-rc.11",
+    "@storybook/core-events": "5.0.0-rc.11",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "prop-types": "^15.6.2",
diff --git a/addons/events/package.json b/addons/events/package.json
index 6087fc40db9..f64f547bced 100644
--- a/addons/events/package.json
+++ b/addons/events/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-events",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "Add events to your Storybook stories.",
   "keywords": [
     "addon",
@@ -23,9 +23,9 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.10",
-    "@storybook/core-events": "5.0.0-rc.10",
-    "@storybook/theming": "5.0.0-rc.10",
+    "@storybook/addons": "5.0.0-rc.11",
+    "@storybook/core-events": "5.0.0-rc.11",
+    "@storybook/theming": "5.0.0-rc.11",
     "core-js": "^2.6.2",
     "format-json": "^1.0.3",
     "prop-types": "^15.6.2",
diff --git a/addons/google-analytics/package.json b/addons/google-analytics/package.json
index 522406e170b..3aa4a017561 100644
--- a/addons/google-analytics/package.json
+++ b/addons/google-analytics/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-google-analytics",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "Storybook addon for google analytics",
   "keywords": [
     "addon",
@@ -19,8 +19,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.10",
-    "@storybook/core-events": "5.0.0-rc.10",
+    "@storybook/addons": "5.0.0-rc.11",
+    "@storybook/core-events": "5.0.0-rc.11",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "react-ga": "^2.5.3"
diff --git a/addons/graphql/package.json b/addons/graphql/package.json
index ea637492c50..aaed6fffe13 100644
--- a/addons/graphql/package.json
+++ b/addons/graphql/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-graphql",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "Storybook addon to display the GraphiQL IDE",
   "keywords": [
     "addon",
diff --git a/addons/info/package.json b/addons/info/package.json
index c74f964b3d7..4d179b9cd4e 100644
--- a/addons/info/package.json
+++ b/addons/info/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-info",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "A Storybook addon to show additional information for your stories.",
   "keywords": [
     "addon",
@@ -21,10 +21,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.10",
-    "@storybook/client-logger": "5.0.0-rc.10",
-    "@storybook/components": "5.0.0-rc.10",
-    "@storybook/theming": "5.0.0-rc.10",
+    "@storybook/addons": "5.0.0-rc.11",
+    "@storybook/client-logger": "5.0.0-rc.11",
+    "@storybook/components": "5.0.0-rc.11",
+    "@storybook/theming": "5.0.0-rc.11",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "marksy": "^6.1.0",
diff --git a/addons/jest/package.json b/addons/jest/package.json
index cb01001e54f..8067b2697c0 100644
--- a/addons/jest/package.json
+++ b/addons/jest/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-jest",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "React storybook addon that show component jest report",
   "keywords": [
     "addon",
@@ -27,10 +27,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.10",
-    "@storybook/components": "5.0.0-rc.10",
-    "@storybook/core-events": "5.0.0-rc.10",
-    "@storybook/theming": "5.0.0-rc.10",
+    "@storybook/addons": "5.0.0-rc.11",
+    "@storybook/components": "5.0.0-rc.11",
+    "@storybook/core-events": "5.0.0-rc.11",
+    "@storybook/theming": "5.0.0-rc.11",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "prop-types": "^15.6.2",
diff --git a/addons/knobs/package.json b/addons/knobs/package.json
index 8b0e8589320..bdb3f97baff 100644
--- a/addons/knobs/package.json
+++ b/addons/knobs/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-knobs",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "Storybook Addon Prop Editor Component",
   "keywords": [
     "addon",
@@ -21,10 +21,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.10",
-    "@storybook/components": "5.0.0-rc.10",
-    "@storybook/core-events": "5.0.0-rc.10",
-    "@storybook/theming": "5.0.0-rc.10",
+    "@storybook/addons": "5.0.0-rc.11",
+    "@storybook/components": "5.0.0-rc.11",
+    "@storybook/core-events": "5.0.0-rc.11",
+    "@storybook/theming": "5.0.0-rc.11",
     "copy-to-clipboard": "^3.0.8",
     "core-js": "^2.6.2",
     "escape-html": "^1.0.3",
diff --git a/addons/links/package.json b/addons/links/package.json
index bb268ddad3d..720c72dffe9 100644
--- a/addons/links/package.json
+++ b/addons/links/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-links",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "Story Links addon for storybook",
   "keywords": [
     "addon",
@@ -21,8 +21,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.10",
-    "@storybook/core-events": "5.0.0-rc.10",
+    "@storybook/addons": "5.0.0-rc.11",
+    "@storybook/core-events": "5.0.0-rc.11",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/addons/notes/package.json b/addons/notes/package.json
index 62f0ba16537..bf4cb392d50 100644
--- a/addons/notes/package.json
+++ b/addons/notes/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-notes",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "Write notes for your Storybook stories.",
   "keywords": [
     "addon",
@@ -22,11 +22,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.10",
-    "@storybook/client-logger": "5.0.0-rc.10",
-    "@storybook/components": "5.0.0-rc.10",
-    "@storybook/core-events": "5.0.0-rc.10",
-    "@storybook/theming": "5.0.0-rc.10",
+    "@storybook/addons": "5.0.0-rc.11",
+    "@storybook/client-logger": "5.0.0-rc.11",
+    "@storybook/components": "5.0.0-rc.11",
+    "@storybook/core-events": "5.0.0-rc.11",
+    "@storybook/theming": "5.0.0-rc.11",
     "markdown-to-jsx": "^6.9.1",
     "prop-types": "^15.6.2",
     "util-deprecate": "^1.0.2"
diff --git a/addons/ondevice-backgrounds/package.json b/addons/ondevice-backgrounds/package.json
index db71f5679ee..5d4086ce3c9 100644
--- a/addons/ondevice-backgrounds/package.json
+++ b/addons/ondevice-backgrounds/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/addon-ondevice-backgrounds",
   "private": true,
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "A storybook addon to show different backgrounds for your preview",
   "keywords": [
     "addon",
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.10",
+    "@storybook/addons": "5.0.0-rc.11",
     "core-js": "^2.6.2",
     "prop-types": "^15.6.2"
   },
diff --git a/addons/ondevice-knobs/package.json b/addons/ondevice-knobs/package.json
index b957f95965b..e0025a23483 100644
--- a/addons/ondevice-knobs/package.json
+++ b/addons/ondevice-knobs/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/addon-ondevice-knobs",
   "private": true,
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "Display storybook story knobs on your deviced.",
   "keywords": [
     "addon",
@@ -21,7 +21,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.10",
+    "@storybook/addons": "5.0.0-rc.11",
     "core-js": "^2.6.2",
     "deep-equal": "^1.0.1",
     "prop-types": "^15.6.2",
diff --git a/addons/ondevice-notes/package.json b/addons/ondevice-notes/package.json
index b43a6f1e1a4..bd5c34816df 100644
--- a/addons/ondevice-notes/package.json
+++ b/addons/ondevice-notes/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/addon-ondevice-notes",
   "private": true,
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "Write notes for your Storybook stories.",
   "keywords": [
     "addon",
@@ -19,7 +19,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.10",
+    "@storybook/addons": "5.0.0-rc.11",
     "core-js": "^2.6.2",
     "prop-types": "^15.6.2",
     "react-native-simple-markdown": "^1.1.0"
diff --git a/addons/options/package.json b/addons/options/package.json
index 7504f344458..33e5f5694e8 100644
--- a/addons/options/package.json
+++ b/addons/options/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-options",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "Options addon for storybook",
   "keywords": [
     "addon",
@@ -20,7 +20,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.10",
+    "@storybook/addons": "5.0.0-rc.11",
     "core-js": "^2.6.2",
     "util-deprecate": "^1.0.2"
   },
diff --git a/addons/storyshots/storyshots-core/package.json b/addons/storyshots/storyshots-core/package.json
index 7a02d83498b..e0f39f67982 100644
--- a/addons/storyshots/storyshots-core/package.json
+++ b/addons/storyshots/storyshots-core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storyshots",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "StoryShots is a Jest Snapshot Testing Addon for Storybook.",
   "keywords": [
     "addon",
@@ -24,7 +24,7 @@
     "storybook": "start-storybook -p 6006"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.10",
+    "@storybook/addons": "5.0.0-rc.11",
     "core-js": "^2.6.2",
     "glob": "^7.1.3",
     "global": "^4.3.2",
diff --git a/addons/storyshots/storyshots-puppeteer/package.json b/addons/storyshots/storyshots-puppeteer/package.json
index 49fa938f314..a946ac57834 100644
--- a/addons/storyshots/storyshots-puppeteer/package.json
+++ b/addons/storyshots/storyshots-puppeteer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storyshots-puppeteer",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "Image snappshots addition to StoryShots base on puppeteer",
   "keywords": [
     "addon",
@@ -21,8 +21,8 @@
     "prepare": "node ../../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/node-logger": "5.0.0-rc.10",
-    "@storybook/router": "5.0.0-rc.10",
+    "@storybook/node-logger": "5.0.0-rc.11",
+    "@storybook/router": "5.0.0-rc.11",
     "core-js": "^2.6.2",
     "jest-image-snapshot": "^2.6.0",
     "puppeteer": "^1.12.0",
diff --git a/addons/storysource/package.json b/addons/storysource/package.json
index 506d58ffcca..3b4df165682 100644
--- a/addons/storysource/package.json
+++ b/addons/storysource/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storysource",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "Stories addon for storybook",
   "keywords": [
     "addon",
@@ -21,10 +21,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.10",
-    "@storybook/components": "5.0.0-rc.10",
-    "@storybook/router": "5.0.0-rc.10",
-    "@storybook/theming": "5.0.0-rc.10",
+    "@storybook/addons": "5.0.0-rc.11",
+    "@storybook/components": "5.0.0-rc.11",
+    "@storybook/router": "5.0.0-rc.11",
+    "@storybook/theming": "5.0.0-rc.11",
     "core-js": "^2.6.2",
     "estraverse": "^4.2.0",
     "loader-utils": "^1.2.1",
diff --git a/addons/viewport/package.json b/addons/viewport/package.json
index 1def1187235..5439946319b 100644
--- a/addons/viewport/package.json
+++ b/addons/viewport/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-viewport",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "Storybook addon to change the viewport size to mobile",
   "keywords": [
     "addon",
@@ -20,11 +20,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.10",
-    "@storybook/client-logger": "5.0.0-rc.10",
-    "@storybook/components": "5.0.0-rc.10",
-    "@storybook/core-events": "5.0.0-rc.10",
-    "@storybook/theming": "5.0.0-rc.10",
+    "@storybook/addons": "5.0.0-rc.11",
+    "@storybook/client-logger": "5.0.0-rc.11",
+    "@storybook/components": "5.0.0-rc.11",
+    "@storybook/core-events": "5.0.0-rc.11",
+    "@storybook/theming": "5.0.0-rc.11",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
diff --git a/app/angular/package.json b/app/angular/package.json
index d91af448627..39ba50f2403 100644
--- a/app/angular/package.json
+++ b/app/angular/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/angular",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "Storybook for Angular: Develop Angular Components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,8 +25,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.10",
-    "@storybook/node-logger": "5.0.0-rc.10",
+    "@storybook/core": "5.0.0-rc.11",
+    "@storybook/node-logger": "5.0.0-rc.11",
     "angular2-template-loader": "^0.6.2",
     "core-js": "^2.6.2",
     "fork-ts-checker-webpack-plugin": "^0.5.2",
diff --git a/app/ember/package.json b/app/ember/package.json
index 7a62c5438ac..ed06592d216 100644
--- a/app/ember/package.json
+++ b/app/ember/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/ember",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "Storybook for Ember: Develop Ember Component in isolation with Hot Reloading.",
   "homepage": "https://github.com/storybooks/storybook/tree/master/app/ember",
   "bugs": {
@@ -23,7 +23,7 @@
   },
   "dependencies": {
     "@ember/test-helpers": "^1.3.1",
-    "@storybook/core": "5.0.0-rc.10",
+    "@storybook/core": "5.0.0-rc.11",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/html/package.json b/app/html/package.json
index 1cd2f1fde0e..76c4d906e31 100644
--- a/app/html/package.json
+++ b/app/html/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/html",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "Storybook for HTML: View HTML snippets in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.10",
+    "@storybook/core": "5.0.0-rc.11",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/marko/package.json b/app/marko/package.json
index 4db8ef03adf..da116568506 100644
--- a/app/marko/package.json
+++ b/app/marko/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/marko",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "Storybook for Marko: Develop Marko Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.10",
+    "@storybook/core": "5.0.0-rc.11",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/mithril/package.json b/app/mithril/package.json
index 339a42736b0..2f5f1edf01f 100644
--- a/app/mithril/package.json
+++ b/app/mithril/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/mithril",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "Storybook for Mithril: Develop Mithril Component in isolation.",
   "keywords": [
     "storybook"
@@ -26,7 +26,7 @@
   },
   "dependencies": {
     "@babel/plugin-transform-react-jsx": "^7.3.0",
-    "@storybook/core": "5.0.0-rc.10",
+    "@storybook/core": "5.0.0-rc.11",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/polymer/package.json b/app/polymer/package.json
index cb67dab9577..d165bd3a646 100644
--- a/app/polymer/package.json
+++ b/app/polymer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/polymer",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "Storybook for Polymer: Develop Polymer components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.10",
+    "@storybook/core": "5.0.0-rc.11",
     "@webcomponents/webcomponentsjs": "^1.2.0",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
diff --git a/app/preact/package.json b/app/preact/package.json
index 12af29c506a..70b9dbb543a 100644
--- a/app/preact/package.json
+++ b/app/preact/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/preact",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "Storybook for Preact: Develop Preact Component in isolation.",
   "keywords": [
     "storybook"
@@ -26,7 +26,7 @@
   },
   "dependencies": {
     "@babel/plugin-transform-react-jsx": "^7.3.0",
-    "@storybook/core": "5.0.0-rc.10",
+    "@storybook/core": "5.0.0-rc.11",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/react-native/package.json b/app/react-native/package.json
index 07b3d119a84..ad5c624474f 100644
--- a/app/react-native/package.json
+++ b/app/react-native/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/react-native",
   "private": true,
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "A better way to develop React Native Components for your app",
   "keywords": [
     "react",
@@ -26,12 +26,12 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.10",
-    "@storybook/channel-websocket": "5.0.0-rc.10",
-    "@storybook/channels": "5.0.0-rc.10",
-    "@storybook/core": "5.0.0-rc.10",
-    "@storybook/core-events": "5.0.0-rc.10",
-    "@storybook/ui": "5.0.0-rc.10",
+    "@storybook/addons": "5.0.0-rc.11",
+    "@storybook/channel-websocket": "5.0.0-rc.11",
+    "@storybook/channels": "5.0.0-rc.11",
+    "@storybook/core": "5.0.0-rc.11",
+    "@storybook/core-events": "5.0.0-rc.11",
+    "@storybook/ui": "5.0.0-rc.11",
     "babel-loader": "^8.0.4",
     "babel-plugin-macros": "^2.4.5",
     "babel-plugin-syntax-async-functions": "^6.13.0",
diff --git a/app/react/package.json b/app/react/package.json
index 27b62f71f67..a2f9147b4ca 100644
--- a/app/react/package.json
+++ b/app/react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/react",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "Storybook for React: Develop React Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -28,9 +28,9 @@
     "@babel/plugin-transform-react-constant-elements": "^7.2.0",
     "@babel/preset-flow": "^7.0.0",
     "@babel/preset-react": "^7.0.0",
-    "@storybook/core": "5.0.0-rc.10",
-    "@storybook/node-logger": "5.0.0-rc.10",
-    "@storybook/theming": "5.0.0-rc.10",
+    "@storybook/core": "5.0.0-rc.11",
+    "@storybook/node-logger": "5.0.0-rc.11",
+    "@storybook/theming": "5.0.0-rc.11",
     "@svgr/webpack": "^4.0.3",
     "babel-plugin-named-asset-import": "^0.3.0",
     "babel-plugin-react-docgen": "^2.0.2",
diff --git a/app/riot/package.json b/app/riot/package.json
index 065b736ff32..bf130227817 100644
--- a/app/riot/package.json
+++ b/app/riot/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/riot",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "Storybook for riot.js: View riot snippets in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.10",
+    "@storybook/core": "5.0.0-rc.11",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/svelte/package.json b/app/svelte/package.json
index 1bbf452ca1b..ce0ef88f447 100644
--- a/app/svelte/package.json
+++ b/app/svelte/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/svelte",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "Storybook for Svelte: Develop Svelte Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.10",
+    "@storybook/core": "5.0.0-rc.11",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/vue/package.json b/app/vue/package.json
index d38b8e42b52..9d374ff62d4 100644
--- a/app/vue/package.json
+++ b/app/vue/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/vue",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "Storybook for Vue: Develop Vue Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.10",
+    "@storybook/core": "5.0.0-rc.11",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/examples/angular-cli/package.json b/examples/angular-cli/package.json
index 963d9817c1e..4810dbc41c2 100644
--- a/examples/angular-cli/package.json
+++ b/examples/angular-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "angular-cli",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "private": true,
   "license": "MIT",
   "scripts": {
@@ -33,18 +33,18 @@
     "@angular-devkit/build-angular": "^0.13.1",
     "@angular/cli": "^7.3.2",
     "@angular/compiler-cli": "^7.2.1",
-    "@storybook/addon-actions": "5.0.0-rc.10",
-    "@storybook/addon-backgrounds": "5.0.0-rc.10",
-    "@storybook/addon-centered": "5.0.0-rc.10",
-    "@storybook/addon-jest": "5.0.0-rc.10",
-    "@storybook/addon-knobs": "5.0.0-rc.10",
-    "@storybook/addon-links": "5.0.0-rc.10",
-    "@storybook/addon-notes": "5.0.0-rc.10",
-    "@storybook/addon-options": "5.0.0-rc.10",
-    "@storybook/addon-storyshots": "5.0.0-rc.10",
-    "@storybook/addon-storysource": "5.0.0-rc.10",
-    "@storybook/addons": "5.0.0-rc.10",
-    "@storybook/angular": "5.0.0-rc.10",
+    "@storybook/addon-actions": "5.0.0-rc.11",
+    "@storybook/addon-backgrounds": "5.0.0-rc.11",
+    "@storybook/addon-centered": "5.0.0-rc.11",
+    "@storybook/addon-jest": "5.0.0-rc.11",
+    "@storybook/addon-knobs": "5.0.0-rc.11",
+    "@storybook/addon-links": "5.0.0-rc.11",
+    "@storybook/addon-notes": "5.0.0-rc.11",
+    "@storybook/addon-options": "5.0.0-rc.11",
+    "@storybook/addon-storyshots": "5.0.0-rc.11",
+    "@storybook/addon-storysource": "5.0.0-rc.11",
+    "@storybook/addons": "5.0.0-rc.11",
+    "@storybook/angular": "5.0.0-rc.11",
     "@types/core-js": "^2.5.0",
     "@types/jest": "^23.3.13",
     "@types/node": "~10.12.19",
diff --git a/examples/cra-kitchen-sink/package.json b/examples/cra-kitchen-sink/package.json
index ec22608c553..966d3f31231 100644
--- a/examples/cra-kitchen-sink/package.json
+++ b/examples/cra-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "cra-kitchen-sink",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "private": true,
   "scripts": {
     "build": "react-scripts build",
@@ -18,21 +18,21 @@
     "react-lifecycles-compat": "^3.0.4"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.0.0-rc.10",
-    "@storybook/addon-actions": "5.0.0-rc.10",
-    "@storybook/addon-backgrounds": "5.0.0-rc.10",
-    "@storybook/addon-centered": "5.0.0-rc.10",
-    "@storybook/addon-events": "5.0.0-rc.10",
-    "@storybook/addon-info": "5.0.0-rc.10",
-    "@storybook/addon-jest": "5.0.0-rc.10",
-    "@storybook/addon-knobs": "5.0.0-rc.10",
-    "@storybook/addon-links": "5.0.0-rc.10",
-    "@storybook/addon-notes": "5.0.0-rc.10",
-    "@storybook/addon-options": "5.0.0-rc.10",
-    "@storybook/addon-storyshots": "5.0.0-rc.10",
-    "@storybook/addons": "5.0.0-rc.10",
-    "@storybook/client-logger": "5.0.0-rc.10",
-    "@storybook/react": "5.0.0-rc.10",
+    "@storybook/addon-a11y": "5.0.0-rc.11",
+    "@storybook/addon-actions": "5.0.0-rc.11",
+    "@storybook/addon-backgrounds": "5.0.0-rc.11",
+    "@storybook/addon-centered": "5.0.0-rc.11",
+    "@storybook/addon-events": "5.0.0-rc.11",
+    "@storybook/addon-info": "5.0.0-rc.11",
+    "@storybook/addon-jest": "5.0.0-rc.11",
+    "@storybook/addon-knobs": "5.0.0-rc.11",
+    "@storybook/addon-links": "5.0.0-rc.11",
+    "@storybook/addon-notes": "5.0.0-rc.11",
+    "@storybook/addon-options": "5.0.0-rc.11",
+    "@storybook/addon-storyshots": "5.0.0-rc.11",
+    "@storybook/addons": "5.0.0-rc.11",
+    "@storybook/client-logger": "5.0.0-rc.11",
+    "@storybook/react": "5.0.0-rc.11",
     "enzyme": "^3.7.0",
     "enzyme-adapter-react-16": "^1.9.1",
     "enzyme-to-json": "^3.3.4",
diff --git a/examples/cra-ts-kitchen-sink/package.json b/examples/cra-ts-kitchen-sink/package.json
index ff0415649ff..d0fd776f586 100644
--- a/examples/cra-ts-kitchen-sink/package.json
+++ b/examples/cra-ts-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "cra-ts-kitchen-sink",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook -s public",
@@ -19,11 +19,11 @@
     "react-dom": "^16.8.1"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.10",
-    "@storybook/addon-info": "5.0.0-rc.10",
-    "@storybook/addon-options": "5.0.0-rc.10",
-    "@storybook/addons": "5.0.0-rc.10",
-    "@storybook/react": "5.0.0-rc.10",
+    "@storybook/addon-actions": "5.0.0-rc.11",
+    "@storybook/addon-info": "5.0.0-rc.11",
+    "@storybook/addon-options": "5.0.0-rc.11",
+    "@storybook/addons": "5.0.0-rc.11",
+    "@storybook/react": "5.0.0-rc.11",
     "@types/enzyme": "^3.1.15",
     "@types/react": "^16.7.22",
     "@types/react-dom": "^16.0.11",
diff --git a/examples/ember-cli/package.json b/examples/ember-cli/package.json
index d5fd17b063b..01b65c9c513 100644
--- a/examples/ember-cli/package.json
+++ b/examples/ember-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "ember-example",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "private": true,
   "scripts": {
     "build": "ember build",
@@ -14,18 +14,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.2.2",
-    "@storybook/addon-a11y": "5.0.0-rc.10",
-    "@storybook/addon-actions": "5.0.0-rc.10",
-    "@storybook/addon-backgrounds": "5.0.0-rc.10",
-    "@storybook/addon-centered": "5.0.0-rc.10",
-    "@storybook/addon-knobs": "5.0.0-rc.10",
-    "@storybook/addon-links": "5.0.0-rc.10",
-    "@storybook/addon-notes": "5.0.0-rc.10",
-    "@storybook/addon-options": "5.0.0-rc.10",
-    "@storybook/addon-storysource": "5.0.0-rc.10",
-    "@storybook/addon-viewport": "5.0.0-rc.10",
-    "@storybook/addons": "5.0.0-rc.10",
-    "@storybook/ember": "5.0.0-rc.10",
+    "@storybook/addon-a11y": "5.0.0-rc.11",
+    "@storybook/addon-actions": "5.0.0-rc.11",
+    "@storybook/addon-backgrounds": "5.0.0-rc.11",
+    "@storybook/addon-centered": "5.0.0-rc.11",
+    "@storybook/addon-knobs": "5.0.0-rc.11",
+    "@storybook/addon-links": "5.0.0-rc.11",
+    "@storybook/addon-notes": "5.0.0-rc.11",
+    "@storybook/addon-options": "5.0.0-rc.11",
+    "@storybook/addon-storysource": "5.0.0-rc.11",
+    "@storybook/addon-viewport": "5.0.0-rc.11",
+    "@storybook/addons": "5.0.0-rc.11",
+    "@storybook/ember": "5.0.0-rc.11",
     "babel-loader": "^8",
     "broccoli-asset-rev": "^3.0.0",
     "cross-env": "^5.2.0",
diff --git a/examples/html-kitchen-sink/package.json b/examples/html-kitchen-sink/package.json
index 21b703f4b48..fb4f4624214 100644
--- a/examples/html-kitchen-sink/package.json
+++ b/examples/html-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "html-kitchen-sink",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "private": true,
   "description": "",
   "keywords": [],
@@ -13,23 +13,23 @@
     "storybook": "start-storybook -p 9006"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.0.0-rc.10",
-    "@storybook/addon-actions": "5.0.0-rc.10",
-    "@storybook/addon-backgrounds": "5.0.0-rc.10",
-    "@storybook/addon-centered": "5.0.0-rc.10",
-    "@storybook/addon-events": "5.0.0-rc.10",
-    "@storybook/addon-jest": "5.0.0-rc.10",
-    "@storybook/addon-knobs": "5.0.0-rc.10",
-    "@storybook/addon-links": "5.0.0-rc.10",
-    "@storybook/addon-notes": "5.0.0-rc.10",
-    "@storybook/addon-options": "5.0.0-rc.10",
-    "@storybook/addon-storyshots": "5.0.0-rc.10",
-    "@storybook/addon-storysource": "5.0.0-rc.10",
-    "@storybook/addon-viewport": "5.0.0-rc.10",
-    "@storybook/addons": "5.0.0-rc.10",
-    "@storybook/core": "5.0.0-rc.10",
-    "@storybook/core-events": "5.0.0-rc.10",
-    "@storybook/html": "5.0.0-rc.10",
+    "@storybook/addon-a11y": "5.0.0-rc.11",
+    "@storybook/addon-actions": "5.0.0-rc.11",
+    "@storybook/addon-backgrounds": "5.0.0-rc.11",
+    "@storybook/addon-centered": "5.0.0-rc.11",
+    "@storybook/addon-events": "5.0.0-rc.11",
+    "@storybook/addon-jest": "5.0.0-rc.11",
+    "@storybook/addon-knobs": "5.0.0-rc.11",
+    "@storybook/addon-links": "5.0.0-rc.11",
+    "@storybook/addon-notes": "5.0.0-rc.11",
+    "@storybook/addon-options": "5.0.0-rc.11",
+    "@storybook/addon-storyshots": "5.0.0-rc.11",
+    "@storybook/addon-storysource": "5.0.0-rc.11",
+    "@storybook/addon-viewport": "5.0.0-rc.11",
+    "@storybook/addons": "5.0.0-rc.11",
+    "@storybook/core": "5.0.0-rc.11",
+    "@storybook/core-events": "5.0.0-rc.11",
+    "@storybook/html": "5.0.0-rc.11",
     "eventemitter3": "^3.1.0",
     "format-json": "^1.0.3",
     "global": "^4.3.2",
diff --git a/examples/marko-cli/package.json b/examples/marko-cli/package.json
index a81bb2d0e24..58657715539 100644
--- a/examples/marko-cli/package.json
+++ b/examples/marko-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "marko-cli",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "private": true,
   "description": "Demo of how to build an app using marko-starter",
   "repository": {
@@ -22,12 +22,12 @@
     "marko-starter": "^2.0.4"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.10",
-    "@storybook/addon-knobs": "5.0.0-rc.10",
-    "@storybook/addon-options": "5.0.0-rc.10",
-    "@storybook/addon-storysource": "5.0.0-rc.10",
-    "@storybook/addons": "5.0.0-rc.10",
-    "@storybook/marko": "5.0.0-rc.10",
+    "@storybook/addon-actions": "5.0.0-rc.11",
+    "@storybook/addon-knobs": "5.0.0-rc.11",
+    "@storybook/addon-options": "5.0.0-rc.11",
+    "@storybook/addon-storysource": "5.0.0-rc.11",
+    "@storybook/addons": "5.0.0-rc.11",
+    "@storybook/marko": "5.0.0-rc.11",
     "prettier": "^1.16.4",
     "webpack": "^4.29.0"
   }
diff --git a/examples/mithril-kitchen-sink/package.json b/examples/mithril-kitchen-sink/package.json
index b542c68c935..f4ee46c621b 100644
--- a/examples/mithril-kitchen-sink/package.json
+++ b/examples/mithril-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "mithril-example",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook",
@@ -10,18 +10,18 @@
     "mithril": "^1.1.6"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.10",
-    "@storybook/addon-backgrounds": "5.0.0-rc.10",
-    "@storybook/addon-centered": "5.0.0-rc.10",
-    "@storybook/addon-knobs": "5.0.0-rc.10",
-    "@storybook/addon-links": "5.0.0-rc.10",
-    "@storybook/addon-notes": "5.0.0-rc.10",
-    "@storybook/addon-options": "5.0.0-rc.10",
-    "@storybook/addon-storyshots": "5.0.0-rc.10",
-    "@storybook/addon-storysource": "5.0.0-rc.10",
-    "@storybook/addon-viewport": "5.0.0-rc.10",
-    "@storybook/addons": "5.0.0-rc.10",
-    "@storybook/mithril": "5.0.0-rc.10",
+    "@storybook/addon-actions": "5.0.0-rc.11",
+    "@storybook/addon-backgrounds": "5.0.0-rc.11",
+    "@storybook/addon-centered": "5.0.0-rc.11",
+    "@storybook/addon-knobs": "5.0.0-rc.11",
+    "@storybook/addon-links": "5.0.0-rc.11",
+    "@storybook/addon-notes": "5.0.0-rc.11",
+    "@storybook/addon-options": "5.0.0-rc.11",
+    "@storybook/addon-storyshots": "5.0.0-rc.11",
+    "@storybook/addon-storysource": "5.0.0-rc.11",
+    "@storybook/addon-viewport": "5.0.0-rc.11",
+    "@storybook/addons": "5.0.0-rc.11",
+    "@storybook/mithril": "5.0.0-rc.11",
     "webpack": "^4.29.0"
   }
 }
diff --git a/examples/official-storybook/package.json b/examples/official-storybook/package.json
index 58739217fc9..f409203ed61 100644
--- a/examples/official-storybook/package.json
+++ b/examples/official-storybook/package.json
@@ -1,6 +1,6 @@
 {
   "name": "official-storybook",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook -c ./ -s built-storybooks",
@@ -12,29 +12,29 @@
     "storybook": "cross-env STORYBOOK_DISPLAY_WARNING=true DISPLAY_WARNING=true start-storybook -p 9011 -c ./ -s built-storybooks --no-dll"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.0.0-rc.10",
-    "@storybook/addon-actions": "5.0.0-rc.10",
-    "@storybook/addon-backgrounds": "5.0.0-rc.10",
-    "@storybook/addon-centered": "5.0.0-rc.10",
-    "@storybook/addon-cssresources": "5.0.0-rc.10",
-    "@storybook/addon-events": "5.0.0-rc.10",
-    "@storybook/addon-graphql": "5.0.0-rc.10",
-    "@storybook/addon-info": "5.0.0-rc.10",
-    "@storybook/addon-jest": "5.0.0-rc.10",
-    "@storybook/addon-knobs": "5.0.0-rc.10",
-    "@storybook/addon-links": "5.0.0-rc.10",
-    "@storybook/addon-notes": "5.0.0-rc.10",
-    "@storybook/addon-options": "5.0.0-rc.10",
-    "@storybook/addon-storyshots": "5.0.0-rc.10",
-    "@storybook/addon-storyshots-puppeteer": "5.0.0-rc.10",
-    "@storybook/addon-storysource": "5.0.0-rc.10",
-    "@storybook/addon-viewport": "5.0.0-rc.10",
-    "@storybook/addons": "5.0.0-rc.10",
-    "@storybook/components": "5.0.0-rc.10",
-    "@storybook/core-events": "5.0.0-rc.10",
-    "@storybook/node-logger": "5.0.0-rc.10",
-    "@storybook/react": "5.0.0-rc.10",
-    "@storybook/theming": "5.0.0-rc.10",
+    "@storybook/addon-a11y": "5.0.0-rc.11",
+    "@storybook/addon-actions": "5.0.0-rc.11",
+    "@storybook/addon-backgrounds": "5.0.0-rc.11",
+    "@storybook/addon-centered": "5.0.0-rc.11",
+    "@storybook/addon-cssresources": "5.0.0-rc.11",
+    "@storybook/addon-events": "5.0.0-rc.11",
+    "@storybook/addon-graphql": "5.0.0-rc.11",
+    "@storybook/addon-info": "5.0.0-rc.11",
+    "@storybook/addon-jest": "5.0.0-rc.11",
+    "@storybook/addon-knobs": "5.0.0-rc.11",
+    "@storybook/addon-links": "5.0.0-rc.11",
+    "@storybook/addon-notes": "5.0.0-rc.11",
+    "@storybook/addon-options": "5.0.0-rc.11",
+    "@storybook/addon-storyshots": "5.0.0-rc.11",
+    "@storybook/addon-storyshots-puppeteer": "5.0.0-rc.11",
+    "@storybook/addon-storysource": "5.0.0-rc.11",
+    "@storybook/addon-viewport": "5.0.0-rc.11",
+    "@storybook/addons": "5.0.0-rc.11",
+    "@storybook/components": "5.0.0-rc.11",
+    "@storybook/core-events": "5.0.0-rc.11",
+    "@storybook/node-logger": "5.0.0-rc.11",
+    "@storybook/react": "5.0.0-rc.11",
+    "@storybook/theming": "5.0.0-rc.11",
     "cors": "^2.8.4",
     "cross-env": "^5.2.0",
     "enzyme-to-json": "^3.3.4",
diff --git a/examples/polymer-cli/package.json b/examples/polymer-cli/package.json
index ecc9a9a4a6b..c23c2d354a6 100644
--- a/examples/polymer-cli/package.json
+++ b/examples/polymer-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "polymer-cli",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook",
@@ -9,15 +9,15 @@
   },
   "dependencies": {
     "@polymer/polymer": "^2.6.0",
-    "@storybook/addon-actions": "5.0.0-rc.10",
-    "@storybook/addon-backgrounds": "5.0.0-rc.10",
-    "@storybook/addon-knobs": "5.0.0-rc.10",
-    "@storybook/addon-links": "5.0.0-rc.10",
-    "@storybook/addon-notes": "5.0.0-rc.10",
-    "@storybook/addon-options": "5.0.0-rc.10",
-    "@storybook/addon-storysource": "5.0.0-rc.10",
-    "@storybook/addon-viewport": "5.0.0-rc.10",
-    "@storybook/polymer": "5.0.0-rc.10",
+    "@storybook/addon-actions": "5.0.0-rc.11",
+    "@storybook/addon-backgrounds": "5.0.0-rc.11",
+    "@storybook/addon-knobs": "5.0.0-rc.11",
+    "@storybook/addon-links": "5.0.0-rc.11",
+    "@storybook/addon-notes": "5.0.0-rc.11",
+    "@storybook/addon-options": "5.0.0-rc.11",
+    "@storybook/addon-storysource": "5.0.0-rc.11",
+    "@storybook/addon-viewport": "5.0.0-rc.11",
+    "@storybook/polymer": "5.0.0-rc.11",
     "@webcomponents/webcomponentsjs": "^1.2.0",
     "global": "^4.3.2",
     "lit-html": "^1.0.0",
diff --git a/examples/preact-kitchen-sink/package.json b/examples/preact-kitchen-sink/package.json
index 5cbcbb05d14..6fb16f8b6a5 100644
--- a/examples/preact-kitchen-sink/package.json
+++ b/examples/preact-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "preact-example",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "private": true,
   "scripts": {
     "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
@@ -15,18 +15,18 @@
   "devDependencies": {
     "@babel/core": "^7.2.2",
     "@babel/plugin-transform-runtime": "^7.2.0",
-    "@storybook/addon-actions": "5.0.0-rc.10",
-    "@storybook/addon-backgrounds": "5.0.0-rc.10",
-    "@storybook/addon-centered": "5.0.0-rc.10",
-    "@storybook/addon-knobs": "5.0.0-rc.10",
-    "@storybook/addon-links": "5.0.0-rc.10",
-    "@storybook/addon-notes": "5.0.0-rc.10",
-    "@storybook/addon-options": "5.0.0-rc.10",
-    "@storybook/addon-storyshots": "5.0.0-rc.10",
-    "@storybook/addon-storysource": "5.0.0-rc.10",
-    "@storybook/addon-viewport": "5.0.0-rc.10",
-    "@storybook/addons": "5.0.0-rc.10",
-    "@storybook/preact": "5.0.0-rc.10",
+    "@storybook/addon-actions": "5.0.0-rc.11",
+    "@storybook/addon-backgrounds": "5.0.0-rc.11",
+    "@storybook/addon-centered": "5.0.0-rc.11",
+    "@storybook/addon-knobs": "5.0.0-rc.11",
+    "@storybook/addon-links": "5.0.0-rc.11",
+    "@storybook/addon-notes": "5.0.0-rc.11",
+    "@storybook/addon-options": "5.0.0-rc.11",
+    "@storybook/addon-storyshots": "5.0.0-rc.11",
+    "@storybook/addon-storysource": "5.0.0-rc.11",
+    "@storybook/addon-viewport": "5.0.0-rc.11",
+    "@storybook/addons": "5.0.0-rc.11",
+    "@storybook/preact": "5.0.0-rc.11",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
     "file-loader": "^3.0.1",
diff --git a/examples/riot-kitchen-sink/package.json b/examples/riot-kitchen-sink/package.json
index a928235646a..996b19ce35d 100644
--- a/examples/riot-kitchen-sink/package.json
+++ b/examples/riot-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "riot-example",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "private": true,
   "scripts": {
     "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
@@ -15,18 +15,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.2.2",
-    "@storybook/addon-actions": "5.0.0-rc.10",
-    "@storybook/addon-backgrounds": "5.0.0-rc.10",
-    "@storybook/addon-centered": "5.0.0-rc.10",
-    "@storybook/addon-knobs": "5.0.0-rc.10",
-    "@storybook/addon-links": "5.0.0-rc.10",
-    "@storybook/addon-notes": "5.0.0-rc.10",
-    "@storybook/addon-options": "5.0.0-rc.10",
-    "@storybook/addon-storyshots": "5.0.0-rc.10",
-    "@storybook/addon-storysource": "5.0.0-rc.10",
-    "@storybook/addon-viewport": "5.0.0-rc.10",
-    "@storybook/addons": "5.0.0-rc.10",
-    "@storybook/riot": "5.0.0-rc.10",
+    "@storybook/addon-actions": "5.0.0-rc.11",
+    "@storybook/addon-backgrounds": "5.0.0-rc.11",
+    "@storybook/addon-centered": "5.0.0-rc.11",
+    "@storybook/addon-knobs": "5.0.0-rc.11",
+    "@storybook/addon-links": "5.0.0-rc.11",
+    "@storybook/addon-notes": "5.0.0-rc.11",
+    "@storybook/addon-options": "5.0.0-rc.11",
+    "@storybook/addon-storyshots": "5.0.0-rc.11",
+    "@storybook/addon-storysource": "5.0.0-rc.11",
+    "@storybook/addon-viewport": "5.0.0-rc.11",
+    "@storybook/addons": "5.0.0-rc.11",
+    "@storybook/riot": "5.0.0-rc.11",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
     "file-loader": "^3.0.1",
diff --git a/examples/svelte-kitchen-sink/package.json b/examples/svelte-kitchen-sink/package.json
index bdcaab9b0de..33f9c4f54db 100644
--- a/examples/svelte-kitchen-sink/package.json
+++ b/examples/svelte-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "svelte-example",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook -s public",
@@ -10,17 +10,17 @@
     "global": "^4.3.2"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.10",
-    "@storybook/addon-backgrounds": "5.0.0-rc.10",
-    "@storybook/addon-centered": "5.0.0-rc.10",
-    "@storybook/addon-knobs": "5.0.0-rc.10",
-    "@storybook/addon-links": "5.0.0-rc.10",
-    "@storybook/addon-notes": "5.0.0-rc.10",
-    "@storybook/addon-options": "5.0.0-rc.10",
-    "@storybook/addon-storyshots": "5.0.0-rc.10",
-    "@storybook/addon-storysource": "5.0.0-rc.10",
-    "@storybook/addon-viewport": "5.0.0-rc.10",
-    "@storybook/addons": "5.0.0-rc.10",
-    "@storybook/svelte": "5.0.0-rc.10"
+    "@storybook/addon-actions": "5.0.0-rc.11",
+    "@storybook/addon-backgrounds": "5.0.0-rc.11",
+    "@storybook/addon-centered": "5.0.0-rc.11",
+    "@storybook/addon-knobs": "5.0.0-rc.11",
+    "@storybook/addon-links": "5.0.0-rc.11",
+    "@storybook/addon-notes": "5.0.0-rc.11",
+    "@storybook/addon-options": "5.0.0-rc.11",
+    "@storybook/addon-storyshots": "5.0.0-rc.11",
+    "@storybook/addon-storysource": "5.0.0-rc.11",
+    "@storybook/addon-viewport": "5.0.0-rc.11",
+    "@storybook/addons": "5.0.0-rc.11",
+    "@storybook/svelte": "5.0.0-rc.11"
   }
 }
diff --git a/examples/vue-kitchen-sink/package.json b/examples/vue-kitchen-sink/package.json
index e56ee631be3..39fd051c59e 100644
--- a/examples/vue-kitchen-sink/package.json
+++ b/examples/vue-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "vue-example",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "private": true,
   "scripts": {
     "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
@@ -14,18 +14,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.2.2",
-    "@storybook/addon-actions": "5.0.0-rc.10",
-    "@storybook/addon-backgrounds": "5.0.0-rc.10",
-    "@storybook/addon-centered": "5.0.0-rc.10",
-    "@storybook/addon-knobs": "5.0.0-rc.10",
-    "@storybook/addon-links": "5.0.0-rc.10",
-    "@storybook/addon-notes": "5.0.0-rc.10",
-    "@storybook/addon-options": "5.0.0-rc.10",
-    "@storybook/addon-storyshots": "5.0.0-rc.10",
-    "@storybook/addon-storysource": "5.0.0-rc.10",
-    "@storybook/addon-viewport": "5.0.0-rc.10",
-    "@storybook/addons": "5.0.0-rc.10",
-    "@storybook/vue": "5.0.0-rc.10",
+    "@storybook/addon-actions": "5.0.0-rc.11",
+    "@storybook/addon-backgrounds": "5.0.0-rc.11",
+    "@storybook/addon-centered": "5.0.0-rc.11",
+    "@storybook/addon-knobs": "5.0.0-rc.11",
+    "@storybook/addon-links": "5.0.0-rc.11",
+    "@storybook/addon-notes": "5.0.0-rc.11",
+    "@storybook/addon-options": "5.0.0-rc.11",
+    "@storybook/addon-storyshots": "5.0.0-rc.11",
+    "@storybook/addon-storysource": "5.0.0-rc.11",
+    "@storybook/addon-viewport": "5.0.0-rc.11",
+    "@storybook/addons": "5.0.0-rc.11",
+    "@storybook/vue": "5.0.0-rc.11",
     "babel-core": "^7.0.0-bridge.0",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
diff --git a/lerna.json b/lerna.json
index e843e523996..10d9b74f493 100644
--- a/lerna.json
+++ b/lerna.json
@@ -11,5 +11,5 @@
   "npmClient": "yarn",
   "useWorkspaces": true,
   "registry": "https://registry.npmjs.org",
-  "version": "5.0.0-rc.10"
+  "version": "5.0.0-rc.11"
 }
diff --git a/lib/addons/package.json b/lib/addons/package.json
index a52e2e144e0..4b94704700f 100644
--- a/lib/addons/package.json
+++ b/lib/addons/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addons",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "Storybook addons store",
   "keywords": [
     "storybook"
@@ -20,8 +20,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.0.0-rc.10",
-    "@storybook/client-logger": "5.0.0-rc.10",
+    "@storybook/channels": "5.0.0-rc.11",
+    "@storybook/client-logger": "5.0.0-rc.11",
     "global": "^4.3.2",
     "util-deprecate": "^1.0.2"
   },
diff --git a/lib/channel-postmessage/package.json b/lib/channel-postmessage/package.json
index 5edb536bdd8..5945aefd9f4 100644
--- a/lib/channel-postmessage/package.json
+++ b/lib/channel-postmessage/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channel-postmessage",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "",
   "keywords": [
     "storybook"
@@ -20,8 +20,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.0.0-rc.10",
-    "@storybook/client-logger": "5.0.0-rc.10",
+    "@storybook/channels": "5.0.0-rc.11",
+    "@storybook/client-logger": "5.0.0-rc.11",
     "global": "^4.3.2",
     "telejson": "^2.1.0"
   },
diff --git a/lib/channel-websocket/package.json b/lib/channel-websocket/package.json
index a4138d245dd..d1f00e00ecd 100644
--- a/lib/channel-websocket/package.json
+++ b/lib/channel-websocket/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channel-websocket",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "",
   "keywords": [
     "storybook"
@@ -20,7 +20,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.0.0-rc.10",
+    "@storybook/channels": "5.0.0-rc.11",
     "global": "^4.3.2",
     "json-fn": "^1.1.1"
   },
diff --git a/lib/channels/package.json b/lib/channels/package.json
index 96e47ffbe79..e6cb75db3d3 100644
--- a/lib/channels/package.json
+++ b/lib/channels/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channels",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/cli/package.json b/lib/cli/package.json
index 12175c376c6..7b01862086a 100644
--- a/lib/cli/package.json
+++ b/lib/cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/cli",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "Storybook's CLI - easiest method of adding storybook to your projects",
   "keywords": [
     "cli",
@@ -29,7 +29,7 @@
     "@babel/core": "^7.2.2",
     "@babel/preset-env": "^7.3.1",
     "@babel/register": "^7.0.0",
-    "@storybook/codemod": "5.0.0-rc.10",
+    "@storybook/codemod": "5.0.0-rc.11",
     "chalk": "^2.4.1",
     "commander": "^2.19.0",
     "core-js": "^2.6.2",
@@ -43,31 +43,31 @@
     "update-notifier": "^2.5.0"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.10",
-    "@storybook/addon-centered": "5.0.0-rc.10",
-    "@storybook/addon-graphql": "5.0.0-rc.10",
-    "@storybook/addon-info": "5.0.0-rc.10",
-    "@storybook/addon-knobs": "5.0.0-rc.10",
-    "@storybook/addon-links": "5.0.0-rc.10",
-    "@storybook/addon-notes": "5.0.0-rc.10",
-    "@storybook/addon-options": "5.0.0-rc.10",
-    "@storybook/addon-storyshots": "5.0.0-rc.10",
-    "@storybook/addons": "5.0.0-rc.10",
-    "@storybook/angular": "5.0.0-rc.10",
-    "@storybook/channel-postmessage": "5.0.0-rc.10",
-    "@storybook/channel-websocket": "5.0.0-rc.10",
-    "@storybook/channels": "5.0.0-rc.10",
-    "@storybook/ember": "5.0.0-rc.10",
-    "@storybook/html": "5.0.0-rc.10",
-    "@storybook/marko": "5.0.0-rc.10",
-    "@storybook/mithril": "5.0.0-rc.10",
-    "@storybook/polymer": "5.0.0-rc.10",
-    "@storybook/preact": "5.0.0-rc.10",
-    "@storybook/react": "5.0.0-rc.10",
-    "@storybook/react-native": "5.0.0-rc.10",
-    "@storybook/riot": "5.0.0-rc.10",
-    "@storybook/ui": "5.0.0-rc.10",
-    "@storybook/vue": "5.0.0-rc.10"
+    "@storybook/addon-actions": "5.0.0-rc.11",
+    "@storybook/addon-centered": "5.0.0-rc.11",
+    "@storybook/addon-graphql": "5.0.0-rc.11",
+    "@storybook/addon-info": "5.0.0-rc.11",
+    "@storybook/addon-knobs": "5.0.0-rc.11",
+    "@storybook/addon-links": "5.0.0-rc.11",
+    "@storybook/addon-notes": "5.0.0-rc.11",
+    "@storybook/addon-options": "5.0.0-rc.11",
+    "@storybook/addon-storyshots": "5.0.0-rc.11",
+    "@storybook/addons": "5.0.0-rc.11",
+    "@storybook/angular": "5.0.0-rc.11",
+    "@storybook/channel-postmessage": "5.0.0-rc.11",
+    "@storybook/channel-websocket": "5.0.0-rc.11",
+    "@storybook/channels": "5.0.0-rc.11",
+    "@storybook/ember": "5.0.0-rc.11",
+    "@storybook/html": "5.0.0-rc.11",
+    "@storybook/marko": "5.0.0-rc.11",
+    "@storybook/mithril": "5.0.0-rc.11",
+    "@storybook/polymer": "5.0.0-rc.11",
+    "@storybook/preact": "5.0.0-rc.11",
+    "@storybook/react": "5.0.0-rc.11",
+    "@storybook/react-native": "5.0.0-rc.11",
+    "@storybook/riot": "5.0.0-rc.11",
+    "@storybook/ui": "5.0.0-rc.11",
+    "@storybook/vue": "5.0.0-rc.11"
   },
   "publishConfig": {
     "access": "public"
diff --git a/lib/client-api/package.json b/lib/client-api/package.json
index f14d6c346a1..cdb3052eeb9 100644
--- a/lib/client-api/package.json
+++ b/lib/client-api/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/client-api",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "Storybook Client API",
   "keywords": [
     "storybook"
@@ -19,10 +19,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.10",
-    "@storybook/client-logger": "5.0.0-rc.10",
-    "@storybook/core-events": "5.0.0-rc.10",
-    "@storybook/router": "5.0.0-rc.10",
+    "@storybook/addons": "5.0.0-rc.11",
+    "@storybook/client-logger": "5.0.0-rc.11",
+    "@storybook/core-events": "5.0.0-rc.11",
+    "@storybook/router": "5.0.0-rc.11",
     "common-tags": "^1.8.0",
     "eventemitter3": "^3.1.0",
     "global": "^4.3.2",
diff --git a/lib/client-logger/package.json b/lib/client-logger/package.json
index 211c2527f9c..a7bb1ba7a8e 100644
--- a/lib/client-logger/package.json
+++ b/lib/client-logger/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/client-logger",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/codemod/package.json b/lib/codemod/package.json
index 62de6c7d6b0..6455c15ce5d 100644
--- a/lib/codemod/package.json
+++ b/lib/codemod/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/codemod",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "A collection of codemod scripts written with JSCodeshift",
   "keywords": [
     "storybook"
diff --git a/lib/components/package.json b/lib/components/package.json
index 34e9903af24..fedc071572b 100644
--- a/lib/components/package.json
+++ b/lib/components/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/components",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "Core Storybook Components",
   "keywords": [
     "storybook"
@@ -20,11 +20,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.10",
-    "@storybook/client-logger": "5.0.0-rc.10",
-    "@storybook/core-events": "5.0.0-rc.10",
-    "@storybook/router": "5.0.0-rc.10",
-    "@storybook/theming": "5.0.0-rc.10",
+    "@storybook/addons": "5.0.0-rc.11",
+    "@storybook/client-logger": "5.0.0-rc.11",
+    "@storybook/core-events": "5.0.0-rc.11",
+    "@storybook/router": "5.0.0-rc.11",
+    "@storybook/theming": "5.0.0-rc.11",
     "global": "^4.3.2",
     "immer": "^1.12.0",
     "js-beautify": "^1.8.9",
diff --git a/lib/core-events/package.json b/lib/core-events/package.json
index e800febe9b5..29667df5a21 100644
--- a/lib/core-events/package.json
+++ b/lib/core-events/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/core-events",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "Event names used in storybook core",
   "keywords": [
     "storybook"
diff --git a/lib/core/package.json b/lib/core/package.json
index 34800209da8..98308ba1c1b 100644
--- a/lib/core/package.json
+++ b/lib/core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/core",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "Storybook framework-agnostic API",
   "keywords": [
     "storybook"
@@ -24,15 +24,15 @@
     "@babel/plugin-syntax-dynamic-import": "^7.2.0",
     "@babel/plugin-transform-react-constant-elements": "^7.2.0",
     "@babel/preset-env": "^7.3.1",
-    "@storybook/addons": "5.0.0-rc.10",
-    "@storybook/channel-postmessage": "5.0.0-rc.10",
-    "@storybook/client-api": "5.0.0-rc.10",
-    "@storybook/client-logger": "5.0.0-rc.10",
-    "@storybook/core-events": "5.0.0-rc.10",
-    "@storybook/node-logger": "5.0.0-rc.10",
-    "@storybook/router": "5.0.0-rc.10",
-    "@storybook/theming": "5.0.0-rc.10",
-    "@storybook/ui": "5.0.0-rc.10",
+    "@storybook/addons": "5.0.0-rc.11",
+    "@storybook/channel-postmessage": "5.0.0-rc.11",
+    "@storybook/client-api": "5.0.0-rc.11",
+    "@storybook/client-logger": "5.0.0-rc.11",
+    "@storybook/core-events": "5.0.0-rc.11",
+    "@storybook/node-logger": "5.0.0-rc.11",
+    "@storybook/router": "5.0.0-rc.11",
+    "@storybook/theming": "5.0.0-rc.11",
+    "@storybook/ui": "5.0.0-rc.11",
     "airbnb-js-shims": "^1 || ^2",
     "autoprefixer": "^9.4.7",
     "babel-plugin-add-react-displayname": "^0.0.5",
diff --git a/lib/node-logger/package.json b/lib/node-logger/package.json
index 392a440e891..67209bacbfa 100644
--- a/lib/node-logger/package.json
+++ b/lib/node-logger/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/node-logger",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/router/package.json b/lib/router/package.json
index 81956527e9e..625ea29215d 100644
--- a/lib/router/package.json
+++ b/lib/router/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/router",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "Core Storybook Router",
   "keywords": [
     "storybook"
@@ -20,7 +20,7 @@
   },
   "dependencies": {
     "@reach/router": "^1.2.1",
-    "@storybook/theming": "5.0.0-rc.10",
+    "@storybook/theming": "5.0.0-rc.11",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
     "qs": "^6.5.2"
diff --git a/lib/theming/package.json b/lib/theming/package.json
index 1161de01211..8079ba56732 100644
--- a/lib/theming/package.json
+++ b/lib/theming/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/theming",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "Core Storybook Components",
   "keywords": [
     "storybook"
@@ -21,7 +21,7 @@
   "dependencies": {
     "@emotion/core": "^10.0.7",
     "@emotion/styled": "^10.0.7",
-    "@storybook/client-logger": "5.0.0-rc.10",
+    "@storybook/client-logger": "5.0.0-rc.11",
     "common-tags": "^1.8.0",
     "deep-object-diff": "^1.1.0",
     "emotion-theming": "^10.0.7",
diff --git a/lib/ui/package.json b/lib/ui/package.json
index 4398aa7789c..e90f65610f5 100644
--- a/lib/ui/package.json
+++ b/lib/ui/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/ui",
-  "version": "5.0.0-rc.10",
+  "version": "5.0.0-rc.11",
   "description": "Core Storybook UI",
   "keywords": [
     "storybook"
@@ -21,12 +21,12 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.10",
-    "@storybook/client-logger": "5.0.0-rc.10",
-    "@storybook/components": "5.0.0-rc.10",
-    "@storybook/core-events": "5.0.0-rc.10",
-    "@storybook/router": "5.0.0-rc.10",
-    "@storybook/theming": "5.0.0-rc.10",
+    "@storybook/addons": "5.0.0-rc.11",
+    "@storybook/client-logger": "5.0.0-rc.11",
+    "@storybook/components": "5.0.0-rc.11",
+    "@storybook/core-events": "5.0.0-rc.11",
+    "@storybook/router": "5.0.0-rc.11",
+    "@storybook/theming": "5.0.0-rc.11",
     "fast-deep-equal": "^2.0.1",
     "fuzzy-search": "^3.0.1",
     "global": "^4.3.2",

From f0e4b1d03677ff1c37bdfe59d2c7806c0c14356d Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Tue, 5 Mar 2019 10:37:37 +0800
Subject: [PATCH 142/249] 5.0.0-rc.11 versions.json

---
 CHANGELOG.md              | 5 -----
 docs/static/versions.json | 9 ++++++++-
 2 files changed, 8 insertions(+), 6 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 6b14f5a6249..a4467aafee4 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -4,11 +4,6 @@
 
 * UI: Fix base theme initialization and theme bootup ([#5843](https://github.com/storybooks/storybook/pull/5843))
 * UI: Fix SidebarItem feels "laggy" when clicked ([#5850](https://github.com/storybooks/storybook/pull/5850))
-* Addon-viewport: Restore v4 behaviour ([#5829](https://github.com/storybooks/storybook/pull/5829))
-
-### Maintenance
-
-* Addon-a11y: Cleanup & document migration ([#5833](https://github.com/storybooks/storybook/pull/5833))
 
 ## 5.0.0-rc.10 (March 4, 2019)
 
diff --git a/docs/static/versions.json b/docs/static/versions.json
index 8c15918ac36..0cfc365fd97 100644
--- a/docs/static/versions.json
+++ b/docs/static/versions.json
@@ -1 +1,8 @@
-{"next":{"version":"5.0.0-rc.10","info":{"plain":"### Bug Fixes\n\n* Addon-viewports: Restore v4 behaviour ([#5829](https://github.com/storybooks/storybook/pull/5829))\n* Addon-backgrounds: Remove previously deprecated default export ([#5828](https://github.com/storybooks/storybook/pull/5828))\n\n### Maintenance\n\n* Addon-a11y: Cleanup and document migration ([#5833](https://github.com/storybooks/storybook/pull/5833))"}}}
\ No newline at end of file
+{
+  "next": {
+    "version": "5.0.0-rc.11",
+    "info": {
+      "plain": "### Bug Fixes\n\n* UI: Fix base theme initialization and theme bootup ([#5843](https://github.com/storybooks/storybook/pull/5843))\n* UI: Fix SidebarItem feels \"laggy\" when clicked ([#5850](https://github.com/storybooks/storybook/pull/5850))"
+    }
+  }
+}

From 1c659a5055a04c21f2453d346f7b32effca02618 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Tue, 5 Mar 2019 13:12:49 +0800
Subject: [PATCH 143/249] Test docs update

---
 docs/src/pages/basics/introduction/index.md | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/docs/src/pages/basics/introduction/index.md b/docs/src/pages/basics/introduction/index.md
index 58ae0b039fb..8d2357c66af 100644
--- a/docs/src/pages/basics/introduction/index.md
+++ b/docs/src/pages/basics/introduction/index.md
@@ -3,7 +3,7 @@ id: 'introduction'
 title: 'Introduction'
 ---
 
-Storybook is a UI development environment and playground for UI components.
+Storybook is a user interface development environment and playground for UI components.
 The tool enables users to create components independently and showcase components interactively in an isolated development environment.
 
 Storybook runs outside of the main app so users can develop UI components in isolation without worrying about app specific dependencies and requirements.
@@ -15,5 +15,5 @@ A [Static version](/basics/exporting-storybook) of Storybook can also be built a
 
 Here are some featured Storybooks to see how it works:
 
--   [Demo of React Dates](http://airbnb.io/react-dates/) - [source](https://github.com/airbnb/react-dates)
--   [Demo of React Native Web](http://necolas.github.io/react-native-web/storybook/) - [source](https://github.com/necolas/react-native-web)
+- [Demo of React Dates](http://airbnb.io/react-dates/) - [source](https://github.com/airbnb/react-dates)
+- [Demo of React Native Web](http://necolas.github.io/react-native-web/storybook/) - [source](https://github.com/necolas/react-native-web)

From 5d986a7d31926b44d92f9fc8882c6cd318a437e9 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Tue, 5 Mar 2019 13:33:05 +0800
Subject: [PATCH 144/249] Update storyshots

---
 .../__snapshots__/index.stories.storyshot     |   88 +-
 .../addon-info.stories.storyshot              | 2552 +++++++++++------
 .../__snapshots__/storyshots.test.js.snap     |  299 +-
 .../syntaxhighlighter.stories.storyshot       |  466 +--
 .../tabs/__snapshots__/tabs.stories.storyshot | 1432 ++++-----
 .../__snapshots__/panel.stories.storyshot     |  240 +-
 .../__snapshots__/preview.stories.storyshot   |  666 ++---
 .../__snapshots__/about.stories.storyshot     |  725 +++--
 8 files changed, 3697 insertions(+), 2771 deletions(-)

diff --git a/examples/cra-kitchen-sink/src/stories/__snapshots__/index.stories.storyshot b/examples/cra-kitchen-sink/src/stories/__snapshots__/index.stories.storyshot
index 43ab3a7cde5..bf2eff4f81c 100644
--- a/examples/cra-kitchen-sink/src/stories/__snapshots__/index.stories.storyshot
+++ b/examples/cra-kitchen-sink/src/stories/__snapshots__/index.stories.storyshot
@@ -207,24 +207,32 @@ exports[`Storyshots Button with new info 1`] = `
             >
               "Container" Component
             </h3>
-            <table
-              class="info-table"
-            >
+            <table>
               <thead>
                 <tr>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     property
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     propType
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     required
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     default
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     description
                   </th>
                 </tr>
@@ -232,65 +240,81 @@ exports[`Storyshots Button with new info 1`] = `
               <tbody>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     children
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       node
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     yes
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     isAmazing
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       bool
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       false
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     age
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       {
                       <span>
@@ -315,30 +339,38 @@ exports[`Storyshots Button with new info 1`] = `
                       }
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     title
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       string
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       the best container ever
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
               </tbody>
             </table>
diff --git a/examples/official-storybook/stories/__snapshots__/addon-info.stories.storyshot b/examples/official-storybook/stories/__snapshots__/addon-info.stories.storyshot
index aabe5f6698f..71f17378224 100644
--- a/examples/official-storybook/stories/__snapshots__/addon-info.stories.storyshot
+++ b/examples/official-storybook/stories/__snapshots__/addon-info.stories.storyshot
@@ -122,24 +122,32 @@ exports[`Storyshots Addons|Info/Decorator Use Info as story decorator 1`] = `
             >
               "BaseButton" Component
             </h3>
-            <table
-              class="info-table"
-            >
+            <table>
               <thead>
                 <tr>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     property
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     propType
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     required
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     default
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     description
                   </th>
                 </tr>
@@ -147,93 +155,117 @@ exports[`Storyshots Addons|Info/Decorator Use Info as story decorator 1`] = `
               <tbody>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     disabled
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       bool
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       false
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     label
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       string
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     yes
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     onClick
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       func
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     style
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       {}
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
               </tbody>
             </table>
@@ -439,24 +471,32 @@ exports[`Storyshots Addons|Info/ForwardRef Displays forwarded ref components cor
             >
               "BaseButton" Component
             </h3>
-            <table
-              class="info-table"
-            >
+            <table>
               <thead>
                 <tr>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     property
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     propType
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     required
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     default
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     description
                   </th>
                 </tr>
@@ -464,93 +504,117 @@ exports[`Storyshots Addons|Info/ForwardRef Displays forwarded ref components cor
               <tbody>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     disabled
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       bool
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       false
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     label
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       string
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     yes
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     onClick
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       func
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     style
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       {}
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
               </tbody>
             </table>
@@ -883,24 +947,32 @@ exports[`Storyshots Addons|Info/JSX Displays JSX in description 1`] = `
             >
               "BaseButton" Component
             </h3>
-            <table
-              class="info-table"
-            >
+            <table>
               <thead>
                 <tr>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     property
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     propType
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     required
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     default
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     description
                   </th>
                 </tr>
@@ -908,93 +980,117 @@ exports[`Storyshots Addons|Info/JSX Displays JSX in description 1`] = `
               <tbody>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     disabled
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       bool
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       false
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     label
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       string
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     yes
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     onClick
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       func
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     style
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       {}
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
               </tbody>
             </table>
@@ -1166,24 +1262,32 @@ exports[`Storyshots Addons|Info/Markdown Displays Markdown in description 1`] =
             >
               "BaseButton" Component
             </h3>
-            <table
-              class="info-table"
-            >
+            <table>
               <thead>
                 <tr>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     property
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     propType
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     required
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     default
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     description
                   </th>
                 </tr>
@@ -1191,93 +1295,117 @@ exports[`Storyshots Addons|Info/Markdown Displays Markdown in description 1`] =
               <tbody>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     disabled
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       bool
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       false
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     label
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       string
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     yes
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     onClick
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       func
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     style
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       {}
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
               </tbody>
             </table>
@@ -1429,24 +1557,32 @@ exports[`Storyshots Addons|Info/Markdown From external Markdown file 1`] = `
             >
               "BaseButton" Component
             </h3>
-            <table
-              class="info-table"
-            >
+            <table>
               <thead>
                 <tr>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     property
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     propType
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     required
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     default
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     description
                   </th>
                 </tr>
@@ -1454,93 +1590,117 @@ exports[`Storyshots Addons|Info/Markdown From external Markdown file 1`] = `
               <tbody>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     disabled
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       bool
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       false
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     label
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       string
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     yes
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     onClick
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       func
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     style
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       {}
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
               </tbody>
             </table>
@@ -1704,24 +1864,32 @@ exports[`Storyshots Addons|Info/Markdown From internal Markdown file 1`] = `
             >
               "BaseButton" Component
             </h3>
-            <table
-              class="info-table"
-            >
+            <table>
               <thead>
                 <tr>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     property
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     propType
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     required
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     default
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     description
                   </th>
                 </tr>
@@ -1729,93 +1897,117 @@ exports[`Storyshots Addons|Info/Markdown From internal Markdown file 1`] = `
               <tbody>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     disabled
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       bool
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       false
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     label
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       string
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     yes
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     onClick
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       func
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     style
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       {}
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
               </tbody>
             </table>
@@ -2131,24 +2323,32 @@ exports[`Storyshots Addons|Info/Options.excludedPropTypes Excludes propTypes tha
             >
               "BaseButton" Component
             </h3>
-            <table
-              class="info-table"
-            >
+            <table>
               <thead>
                 <tr>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     property
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     propType
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     required
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     default
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     description
                   </th>
                 </tr>
@@ -2156,72 +2356,90 @@ exports[`Storyshots Addons|Info/Options.excludedPropTypes Excludes propTypes tha
               <tbody>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     disabled
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       bool
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       false
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     onClick
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       func
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     style
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       {}
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
               </tbody>
             </table>
@@ -2341,24 +2559,32 @@ exports[`Storyshots Addons|Info/Options.header Shows or hides Info Addon header
             >
               "BaseButton" Component
             </h3>
-            <table
-              class="info-table"
-            >
+            <table>
               <thead>
                 <tr>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     property
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     propType
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     required
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     default
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     description
                   </th>
                 </tr>
@@ -2366,93 +2592,117 @@ exports[`Storyshots Addons|Info/Options.header Shows or hides Info Addon header
               <tbody>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     disabled
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       bool
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       false
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     label
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       string
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     yes
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     onClick
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       func
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     style
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       {}
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
               </tbody>
             </table>
@@ -2574,24 +2824,32 @@ exports[`Storyshots Addons|Info/Options.inline Inlines component inside story 1`
           >
             "BaseButton" Component
           </h3>
-          <table
-            class="info-table"
-          >
+          <table>
             <thead>
               <tr>
-                <th>
+                <th
+                  style="text-align:left;vertical-align:top"
+                >
                   property
                 </th>
-                <th>
+                <th
+                  style="text-align:left;vertical-align:top"
+                >
                   propType
                 </th>
-                <th>
+                <th
+                  style="text-align:left;vertical-align:top"
+                >
                   required
                 </th>
-                <th>
+                <th
+                  style="text-align:left;vertical-align:top"
+                >
                   default
                 </th>
-                <th>
+                <th
+                  style="text-align:left;vertical-align:top"
+                >
                   description
                 </th>
               </tr>
@@ -2599,93 +2857,117 @@ exports[`Storyshots Addons|Info/Options.inline Inlines component inside story 1`
             <tbody>
               <tr>
                 <td
-                  class="info-table-monospace"
+                  style="padding-right:10px;vertical-align:top"
                 >
                   disabled
                 </td>
                 <td
-                  class="info-table-monospace"
+                  style="padding-right:10px;vertical-align:top"
                 >
                   <span>
                     bool
                   </span>
                 </td>
-                <td>
+                <td
+                  style="padding-right:10px;vertical-align:top"
+                >
                   -
                 </td>
-                <td>
+                <td
+                  style="padding-right:10px;vertical-align:top"
+                >
                   <span>
                     false
                   </span>
                 </td>
-                <td />
+                <td
+                  style="padding-right:10px;vertical-align:top"
+                />
               </tr>
               <tr>
                 <td
-                  class="info-table-monospace"
+                  style="padding-right:10px;vertical-align:top"
                 >
                   label
                 </td>
                 <td
-                  class="info-table-monospace"
+                  style="padding-right:10px;vertical-align:top"
                 >
                   <span>
                     string
                   </span>
                 </td>
-                <td>
+                <td
+                  style="padding-right:10px;vertical-align:top"
+                >
                   yes
                 </td>
-                <td>
+                <td
+                  style="padding-right:10px;vertical-align:top"
+                >
                   -
                 </td>
-                <td />
+                <td
+                  style="padding-right:10px;vertical-align:top"
+                />
               </tr>
               <tr>
                 <td
-                  class="info-table-monospace"
+                  style="padding-right:10px;vertical-align:top"
                 >
                   onClick
                 </td>
                 <td
-                  class="info-table-monospace"
+                  style="padding-right:10px;vertical-align:top"
                 >
                   <span>
                     func
                   </span>
                 </td>
-                <td>
+                <td
+                  style="padding-right:10px;vertical-align:top"
+                >
                   -
                 </td>
-                <td>
+                <td
+                  style="padding-right:10px;vertical-align:top"
+                >
                   <span>
                     onClick
                   </span>
                 </td>
-                <td />
+                <td
+                  style="padding-right:10px;vertical-align:top"
+                />
               </tr>
               <tr>
                 <td
-                  class="info-table-monospace"
+                  style="padding-right:10px;vertical-align:top"
                 >
                   style
                 </td>
                 <td
-                  class="info-table-monospace"
+                  style="padding-right:10px;vertical-align:top"
                 >
                   <span>
                     other
                   </span>
                 </td>
-                <td>
+                <td
+                  style="padding-right:10px;vertical-align:top"
+                >
                   -
                 </td>
-                <td>
+                <td
+                  style="padding-right:10px;vertical-align:top"
+                >
                   <span>
                     {}
                   </span>
                 </td>
-                <td />
+                <td
+                  style="padding-right:10px;vertical-align:top"
+                />
               </tr>
             </tbody>
           </table>
@@ -2818,24 +3100,32 @@ exports[`Storyshots Addons|Info/Options.propTables Shows additional component pr
             >
               "BaseButton" Component
             </h3>
-            <table
-              class="info-table"
-            >
+            <table>
               <thead>
                 <tr>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     property
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     propType
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     required
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     default
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     description
                   </th>
                 </tr>
@@ -2843,93 +3133,117 @@ exports[`Storyshots Addons|Info/Options.propTables Shows additional component pr
               <tbody>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     disabled
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       bool
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       false
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     label
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       string
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     yes
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     onClick
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       func
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     style
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       {}
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
               </tbody>
             </table>
@@ -2940,24 +3254,32 @@ exports[`Storyshots Addons|Info/Options.propTables Shows additional component pr
             >
               "FlowTypeButton" Component
             </h3>
-            <table
-              class="info-table"
-            >
+            <table>
               <thead>
                 <tr>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     property
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     propType
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     required
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     default
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     description
                   </th>
                 </tr>
@@ -2965,49 +3287,61 @@ exports[`Storyshots Addons|Info/Options.propTables Shows additional component pr
               <tbody>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     disabled
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       unknown
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       false
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     onClick
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       unknown
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
               </tbody>
             </table>
@@ -3209,24 +3543,32 @@ exports[`Storyshots Addons|Info/Options.propTablesExclude Exclude component from
             >
               "BaseButton" Component
             </h3>
-            <table
-              class="info-table"
-            >
+            <table>
               <thead>
                 <tr>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     property
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     propType
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     required
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     default
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     description
                   </th>
                 </tr>
@@ -3234,93 +3576,117 @@ exports[`Storyshots Addons|Info/Options.propTablesExclude Exclude component from
               <tbody>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     disabled
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       bool
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       false
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     label
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       string
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     yes
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     onClick
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       func
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     style
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       {}
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
               </tbody>
             </table>
@@ -3400,24 +3766,32 @@ exports[`Storyshots Addons|Info/Options.source Shows or hides Info Addon source
             >
               "BaseButton" Component
             </h3>
-            <table
-              class="info-table"
-            >
+            <table>
               <thead>
                 <tr>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     property
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     propType
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     required
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     default
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     description
                   </th>
                 </tr>
@@ -3425,93 +3799,117 @@ exports[`Storyshots Addons|Info/Options.source Shows or hides Info Addon source
               <tbody>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     disabled
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       bool
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       false
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     label
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       string
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     yes
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     onClick
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       func
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     style
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       {}
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
               </tbody>
             </table>
@@ -3636,24 +4034,32 @@ exports[`Storyshots Addons|Info/Options.styles Extend info styles with an object
             >
               "BaseButton" Component
             </h3>
-            <table
-              class="info-table"
-            >
+            <table>
               <thead>
                 <tr>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     property
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     propType
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     required
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     default
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     description
                   </th>
                 </tr>
@@ -3661,93 +4067,117 @@ exports[`Storyshots Addons|Info/Options.styles Extend info styles with an object
               <tbody>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     disabled
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       bool
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       false
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     label
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       string
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     yes
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     onClick
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       func
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     style
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       {}
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
               </tbody>
             </table>
@@ -3872,24 +4302,32 @@ exports[`Storyshots Addons|Info/Options.styles Full control over styles using a
             >
               "BaseButton" Component
             </h3>
-            <table
-              class="info-table"
-            >
+            <table>
               <thead>
                 <tr>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     property
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     propType
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     required
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     default
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     description
                   </th>
                 </tr>
@@ -3897,93 +4335,117 @@ exports[`Storyshots Addons|Info/Options.styles Full control over styles using a
               <tbody>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     disabled
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       bool
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       false
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     label
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       string
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     yes
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     onClick
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       func
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     style
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       {}
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
               </tbody>
             </table>
@@ -4163,24 +4625,32 @@ exports[`Storyshots Addons|Info/Parameters Overwrite the parameters with markdow
             >
               "BaseButton" Component
             </h3>
-            <table
-              class="info-table"
-            >
+            <table>
               <thead>
                 <tr>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     property
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     propType
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     required
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     default
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     description
                   </th>
                 </tr>
@@ -4188,93 +4658,117 @@ exports[`Storyshots Addons|Info/Parameters Overwrite the parameters with markdow
               <tbody>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     disabled
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       bool
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       false
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     label
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       string
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     yes
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     onClick
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       func
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     style
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       {}
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
               </tbody>
             </table>
@@ -4414,24 +4908,32 @@ exports[`Storyshots Addons|Info/Parameters Overwrite the text parameter with mar
           >
             "BaseButton" Component
           </h3>
-          <table
-            class="info-table"
-          >
+          <table>
             <thead>
               <tr>
-                <th>
+                <th
+                  style="text-align:left;vertical-align:top"
+                >
                   property
                 </th>
-                <th>
+                <th
+                  style="text-align:left;vertical-align:top"
+                >
                   propType
                 </th>
-                <th>
+                <th
+                  style="text-align:left;vertical-align:top"
+                >
                   required
                 </th>
-                <th>
+                <th
+                  style="text-align:left;vertical-align:top"
+                >
                   default
                 </th>
-                <th>
+                <th
+                  style="text-align:left;vertical-align:top"
+                >
                   description
                 </th>
               </tr>
@@ -4439,93 +4941,117 @@ exports[`Storyshots Addons|Info/Parameters Overwrite the text parameter with mar
             <tbody>
               <tr>
                 <td
-                  class="info-table-monospace"
+                  style="padding-right:10px;vertical-align:top"
                 >
                   disabled
                 </td>
                 <td
-                  class="info-table-monospace"
+                  style="padding-right:10px;vertical-align:top"
                 >
                   <span>
                     bool
                   </span>
                 </td>
-                <td>
+                <td
+                  style="padding-right:10px;vertical-align:top"
+                >
                   -
                 </td>
-                <td>
+                <td
+                  style="padding-right:10px;vertical-align:top"
+                >
                   <span>
                     false
                   </span>
                 </td>
-                <td />
+                <td
+                  style="padding-right:10px;vertical-align:top"
+                />
               </tr>
               <tr>
                 <td
-                  class="info-table-monospace"
+                  style="padding-right:10px;vertical-align:top"
                 >
                   label
                 </td>
                 <td
-                  class="info-table-monospace"
+                  style="padding-right:10px;vertical-align:top"
                 >
                   <span>
                     string
                   </span>
                 </td>
-                <td>
+                <td
+                  style="padding-right:10px;vertical-align:top"
+                >
                   yes
                 </td>
-                <td>
+                <td
+                  style="padding-right:10px;vertical-align:top"
+                >
                   -
                 </td>
-                <td />
+                <td
+                  style="padding-right:10px;vertical-align:top"
+                />
               </tr>
               <tr>
                 <td
-                  class="info-table-monospace"
+                  style="padding-right:10px;vertical-align:top"
                 >
                   onClick
                 </td>
                 <td
-                  class="info-table-monospace"
+                  style="padding-right:10px;vertical-align:top"
                 >
                   <span>
                     func
                   </span>
                 </td>
-                <td>
+                <td
+                  style="padding-right:10px;vertical-align:top"
+                >
                   -
                 </td>
-                <td>
+                <td
+                  style="padding-right:10px;vertical-align:top"
+                >
                   <span>
                     onClick
                   </span>
                 </td>
-                <td />
+                <td
+                  style="padding-right:10px;vertical-align:top"
+                />
               </tr>
               <tr>
                 <td
-                  class="info-table-monospace"
+                  style="padding-right:10px;vertical-align:top"
                 >
                   style
                 </td>
                 <td
-                  class="info-table-monospace"
+                  style="padding-right:10px;vertical-align:top"
                 >
                   <span>
                     other
                   </span>
                 </td>
-                <td>
+                <td
+                  style="padding-right:10px;vertical-align:top"
+                >
                   -
                 </td>
-                <td>
+                <td
+                  style="padding-right:10px;vertical-align:top"
+                >
                   <span>
                     {}
                   </span>
                 </td>
-                <td />
+                <td
+                  style="padding-right:10px;vertical-align:top"
+                />
               </tr>
             </tbody>
           </table>
@@ -4646,24 +5172,32 @@ exports[`Storyshots Addons|Info/Parameters Overwriting and extending the paramet
           >
             "BaseButton" Component
           </h3>
-          <table
-            class="info-table"
-          >
+          <table>
             <thead>
               <tr>
-                <th>
+                <th
+                  style="text-align:left;vertical-align:top"
+                >
                   property
                 </th>
-                <th>
+                <th
+                  style="text-align:left;vertical-align:top"
+                >
                   propType
                 </th>
-                <th>
+                <th
+                  style="text-align:left;vertical-align:top"
+                >
                   required
                 </th>
-                <th>
+                <th
+                  style="text-align:left;vertical-align:top"
+                >
                   default
                 </th>
-                <th>
+                <th
+                  style="text-align:left;vertical-align:top"
+                >
                   description
                 </th>
               </tr>
@@ -4671,72 +5205,90 @@ exports[`Storyshots Addons|Info/Parameters Overwriting and extending the paramet
             <tbody>
               <tr>
                 <td
-                  class="info-table-monospace"
+                  style="padding-right:10px;vertical-align:top"
                 >
                   disabled
                 </td>
                 <td
-                  class="info-table-monospace"
+                  style="padding-right:10px;vertical-align:top"
                 >
                   <span>
                     bool
                   </span>
                 </td>
-                <td>
+                <td
+                  style="padding-right:10px;vertical-align:top"
+                >
                   -
                 </td>
-                <td>
+                <td
+                  style="padding-right:10px;vertical-align:top"
+                >
                   <span>
                     false
                   </span>
                 </td>
-                <td />
+                <td
+                  style="padding-right:10px;vertical-align:top"
+                />
               </tr>
               <tr>
                 <td
-                  class="info-table-monospace"
+                  style="padding-right:10px;vertical-align:top"
                 >
                   onClick
                 </td>
                 <td
-                  class="info-table-monospace"
+                  style="padding-right:10px;vertical-align:top"
                 >
                   <span>
                     func
                   </span>
                 </td>
-                <td>
+                <td
+                  style="padding-right:10px;vertical-align:top"
+                >
                   -
                 </td>
-                <td>
+                <td
+                  style="padding-right:10px;vertical-align:top"
+                >
                   <span>
                     onClick
                   </span>
                 </td>
-                <td />
+                <td
+                  style="padding-right:10px;vertical-align:top"
+                />
               </tr>
               <tr>
                 <td
-                  class="info-table-monospace"
+                  style="padding-right:10px;vertical-align:top"
                 >
                   style
                 </td>
                 <td
-                  class="info-table-monospace"
+                  style="padding-right:10px;vertical-align:top"
                 >
                   <span>
                     other
                   </span>
                 </td>
-                <td>
+                <td
+                  style="padding-right:10px;vertical-align:top"
+                >
                   -
                 </td>
-                <td>
+                <td
+                  style="padding-right:10px;vertical-align:top"
+                >
                   <span>
                     {}
                   </span>
                 </td>
-                <td />
+                <td
+                  style="padding-right:10px;vertical-align:top"
+                />
               </tr>
             </tbody>
           </table>
@@ -4857,24 +5409,32 @@ exports[`Storyshots Addons|Info/Parameters Using paramaters across all stories 1
           >
             "BaseButton" Component
           </h3>
-          <table
-            class="info-table"
-          >
+          <table>
             <thead>
               <tr>
-                <th>
+                <th
+                  style="text-align:left;vertical-align:top"
+                >
                   property
                 </th>
-                <th>
+                <th
+                  style="text-align:left;vertical-align:top"
+                >
                   propType
                 </th>
-                <th>
+                <th
+                  style="text-align:left;vertical-align:top"
+                >
                   required
                 </th>
-                <th>
+                <th
+                  style="text-align:left;vertical-align:top"
+                >
                   default
                 </th>
-                <th>
+                <th
+                  style="text-align:left;vertical-align:top"
+                >
                   description
                 </th>
               </tr>
@@ -4882,93 +5442,117 @@ exports[`Storyshots Addons|Info/Parameters Using paramaters across all stories 1
             <tbody>
               <tr>
                 <td
-                  class="info-table-monospace"
+                  style="padding-right:10px;vertical-align:top"
                 >
                   disabled
                 </td>
                 <td
-                  class="info-table-monospace"
+                  style="padding-right:10px;vertical-align:top"
                 >
                   <span>
                     bool
                   </span>
                 </td>
-                <td>
+                <td
+                  style="padding-right:10px;vertical-align:top"
+                >
                   -
                 </td>
-                <td>
+                <td
+                  style="padding-right:10px;vertical-align:top"
+                >
                   <span>
                     false
                   </span>
                 </td>
-                <td />
+                <td
+                  style="padding-right:10px;vertical-align:top"
+                />
               </tr>
               <tr>
                 <td
-                  class="info-table-monospace"
+                  style="padding-right:10px;vertical-align:top"
                 >
                   label
                 </td>
                 <td
-                  class="info-table-monospace"
+                  style="padding-right:10px;vertical-align:top"
                 >
                   <span>
                     string
                   </span>
                 </td>
-                <td>
+                <td
+                  style="padding-right:10px;vertical-align:top"
+                >
                   yes
                 </td>
-                <td>
+                <td
+                  style="padding-right:10px;vertical-align:top"
+                >
                   -
                 </td>
-                <td />
+                <td
+                  style="padding-right:10px;vertical-align:top"
+                />
               </tr>
               <tr>
                 <td
-                  class="info-table-monospace"
+                  style="padding-right:10px;vertical-align:top"
                 >
                   onClick
                 </td>
                 <td
-                  class="info-table-monospace"
+                  style="padding-right:10px;vertical-align:top"
                 >
                   <span>
                     func
                   </span>
                 </td>
-                <td>
+                <td
+                  style="padding-right:10px;vertical-align:top"
+                >
                   -
                 </td>
-                <td>
+                <td
+                  style="padding-right:10px;vertical-align:top"
+                >
                   <span>
                     onClick
                   </span>
                 </td>
-                <td />
+                <td
+                  style="padding-right:10px;vertical-align:top"
+                />
               </tr>
               <tr>
                 <td
-                  class="info-table-monospace"
+                  style="padding-right:10px;vertical-align:top"
                 >
                   style
                 </td>
                 <td
-                  class="info-table-monospace"
+                  style="padding-right:10px;vertical-align:top"
                 >
                   <span>
                     other
                   </span>
                 </td>
-                <td>
+                <td
+                  style="padding-right:10px;vertical-align:top"
+                >
                   -
                 </td>
-                <td>
+                <td
+                  style="padding-right:10px;vertical-align:top"
+                >
                   <span>
                     {}
                   </span>
                 </td>
-                <td />
+                <td
+                  style="padding-right:10px;vertical-align:top"
+                />
               </tr>
             </tbody>
           </table>
@@ -5119,24 +5703,32 @@ exports[`Storyshots Addons|Info/React Docgen Comments from Flow declarations 1`]
             >
               "FlowTypeButton" Component
             </h3>
-            <table
-              class="info-table"
-            >
+            <table>
               <thead>
                 <tr>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     property
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     propType
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     required
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     default
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     description
                   </th>
                 </tr>
@@ -5144,49 +5736,61 @@ exports[`Storyshots Addons|Info/React Docgen Comments from Flow declarations 1`]
               <tbody>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     disabled
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       unknown
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       false
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     onClick
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       unknown
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
               </tbody>
             </table>
@@ -5539,24 +6143,32 @@ exports[`Storyshots Addons|Info/React Docgen Comments from PropType declarations
             >
               "DocgenButton" Component
             </h3>
-            <table
-              class="info-table"
-            >
+            <table>
               <thead>
                 <tr>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     property
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     propType
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     required
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     default
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     description
                   </th>
                 </tr>
@@ -5564,88 +6176,110 @@ exports[`Storyshots Addons|Info/React Docgen Comments from PropType declarations
               <tbody>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     disabled
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       bool
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       false
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     label
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       string
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     yes
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     onClick
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       func
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     one
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       {
                       <span>
@@ -5660,25 +6294,31 @@ exports[`Storyshots Addons|Info/React Docgen Comments from PropType declarations
                       }
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     two
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       {
                       <span>
@@ -5723,25 +6363,31 @@ exports[`Storyshots Addons|Info/React Docgen Comments from PropType declarations
                       }
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     obj
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       object
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       {
                       <span>
@@ -5756,25 +6402,31 @@ exports[`Storyshots Addons|Info/React Docgen Comments from PropType declarations
                       }
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     shape
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       {
                       <span>
@@ -5833,25 +6485,31 @@ exports[`Storyshots Addons|Info/React Docgen Comments from PropType declarations
                       }
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     arrayOf
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       [
                       <span>
@@ -5874,122 +6532,154 @@ exports[`Storyshots Addons|Info/React Docgen Comments from PropType declarations
                       ]
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     msg
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       {}
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     enm
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       News
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     enmEval
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       Photos
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     union
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       hello
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     optionalString
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       string
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       Default String
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
               </tbody>
             </table>
@@ -6141,24 +6831,32 @@ exports[`Storyshots Addons|Info/React Docgen Comments from component declaration
             >
               "BaseButton" Component
             </h3>
-            <table
-              class="info-table"
-            >
+            <table>
               <thead>
                 <tr>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     property
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     propType
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     required
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     default
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     description
                   </th>
                 </tr>
@@ -6166,93 +6864,117 @@ exports[`Storyshots Addons|Info/React Docgen Comments from component declaration
               <tbody>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     disabled
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       bool
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       false
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     label
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       string
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     yes
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     onClick
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       func
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     style
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       {}
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
               </tbody>
             </table>
@@ -6404,24 +7126,32 @@ exports[`Storyshots Addons|Info/React Docgen Comments from named export componen
             >
               "NamedExportButton" Component
             </h3>
-            <table
-              class="info-table"
-            >
+            <table>
               <thead>
                 <tr>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     property
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     propType
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     required
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     default
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     description
                   </th>
                 </tr>
@@ -6429,93 +7159,117 @@ exports[`Storyshots Addons|Info/React Docgen Comments from named export componen
               <tbody>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     disabled
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       bool
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       false
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     label
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       string
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     yes
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     onClick
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       func
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     style
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       {}
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
               </tbody>
             </table>
@@ -7003,24 +7757,32 @@ exports[`Storyshots Addons|Info/Story Source Array prop 1`] = `
             >
               "TableComponent" Component
             </h3>
-            <table
-              class="info-table"
-            >
+            <table>
               <thead>
                 <tr>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     property
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     propType
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     required
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     default
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     description
                   </th>
                 </tr>
@@ -7028,26 +7790,32 @@ exports[`Storyshots Addons|Info/Story Source Array prop 1`] = `
               <tbody>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     propDefinitions
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       []
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
               </tbody>
             </table>
@@ -7256,24 +8024,32 @@ exports[`Storyshots Addons|Info/Story Source Children 1`] = `
             >
               "BaseButton" Component
             </h3>
-            <table
-              class="info-table"
-            >
+            <table>
               <thead>
                 <tr>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     property
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     propType
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     required
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     default
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     description
                   </th>
                 </tr>
@@ -7281,93 +8057,117 @@ exports[`Storyshots Addons|Info/Story Source Children 1`] = `
               <tbody>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     disabled
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       bool
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       false
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     label
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       string
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     yes
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     onClick
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       func
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     style
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       {}
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
               </tbody>
             </table>
@@ -7517,24 +8317,32 @@ exports[`Storyshots Addons|Info/Story Source Many props 1`] = `
             >
               "BaseButton" Component
             </h3>
-            <table
-              class="info-table"
-            >
+            <table>
               <thead>
                 <tr>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     property
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     propType
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     required
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     default
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     description
                   </th>
                 </tr>
@@ -7542,93 +8350,117 @@ exports[`Storyshots Addons|Info/Story Source Many props 1`] = `
               <tbody>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     disabled
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       bool
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       false
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     label
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       string
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     yes
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     onClick
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       func
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     style
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       {}
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
               </tbody>
             </table>
@@ -7838,24 +8670,32 @@ exports[`Storyshots Addons|Info/Story Source Object prop 1`] = `
             >
               "BaseButton" Component
             </h3>
-            <table
-              class="info-table"
-            >
+            <table>
               <thead>
                 <tr>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     property
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     propType
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     required
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     default
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     description
                   </th>
                 </tr>
@@ -7863,93 +8703,117 @@ exports[`Storyshots Addons|Info/Story Source Object prop 1`] = `
               <tbody>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     disabled
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       bool
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       false
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     label
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       string
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     yes
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     onClick
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       func
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     style
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       {}
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
               </tbody>
             </table>
@@ -8074,24 +8938,32 @@ exports[`Storyshots Addons|Info/Story Source One prop 1`] = `
             >
               "BaseButton" Component
             </h3>
-            <table
-              class="info-table"
-            >
+            <table>
               <thead>
                 <tr>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     property
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     propType
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     required
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     default
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     description
                   </th>
                 </tr>
@@ -8099,93 +8971,117 @@ exports[`Storyshots Addons|Info/Story Source One prop 1`] = `
               <tbody>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     disabled
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       bool
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       false
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     label
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       string
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     yes
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     onClick
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       func
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     style
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       {}
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
               </tbody>
             </table>
@@ -8357,24 +9253,32 @@ exports[`Storyshots Addons|Info/deprecated Displays Markdown in description 1`]
             >
               "BaseButton" Component
             </h3>
-            <table
-              class="info-table"
-            >
+            <table>
               <thead>
                 <tr>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     property
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     propType
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     required
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     default
                   </th>
-                  <th>
+                  <th
+                    style="text-align:left;vertical-align:top"
+                  >
                     description
                   </th>
                 </tr>
@@ -8382,93 +9286,117 @@ exports[`Storyshots Addons|Info/deprecated Displays Markdown in description 1`]
               <tbody>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     disabled
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       bool
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       false
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     label
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       string
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     yes
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     onClick
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       func
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       onClick
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
                 <tr>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     style
                   </td>
                   <td
-                    class="info-table-monospace"
+                    style="padding-right:10px;vertical-align:top"
                   >
                     <span>
                       other
                     </span>
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     -
                   </td>
-                  <td>
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  >
                     <span>
                       {}
                     </span>
                   </td>
-                  <td />
+                  <td
+                    style="padding-right:10px;vertical-align:top"
+                  />
                 </tr>
               </tbody>
             </table>
diff --git a/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap b/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
index 1534ae76e8a..1748bad582b 100644
--- a/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
+++ b/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
@@ -3328,16 +3328,73 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
 }
 
 .emotion-8 {
-  overflow-y: hidden;
-  overflow-x: auto;
   color: #999999;
-  width: 100%;
   height: 40px;
-  -webkit-flex-shrink: 0;
-  -ms-flex-negative: 0;
-  flex-shrink: 0;
-  box-shadow: rgba(0,0,0,.1) 0 -1px 0 0 inset;
-  background: #FFFFFF;
+  overflow: auto;
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-8:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
+.emotion-8::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+  display: none;
+}
+
+.emotion-8:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
+}
+
+.emotion-8::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-8::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-8::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
 }
 
 .emotion-7 {
@@ -3350,12 +3407,7 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   -ms-flex-pack: justify;
   justify-content: space-between;
   position: relative;
-  -webkit-flex-wrap: nowrap;
-  -ms-flex-wrap: nowrap;
-  flex-wrap: nowrap;
-  -webkit-flex-shrink: 0;
-  -ms-flex-negative: 0;
-  flex-shrink: 0;
+  white-space: nowrap;
   height: 40px;
 }
 
@@ -3364,7 +3416,6 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  white-space: nowrap;
   -webkit-flex-basis: auto;
   -ms-flex-preferred-size: auto;
   flex-basis: auto;
@@ -3435,7 +3486,6 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  white-space: nowrap;
   -webkit-flex-basis: auto;
   -ms-flex-preferred-size: auto;
   flex-basis: auto;
@@ -3465,23 +3515,12 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   display: block;
   position: relative;
   font-size: 13px;
-  height: calc(100% - 40px);
-  position: absolute;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  top: 40px;
-  overflow: auto;
-}
-
-.emotion-99 > *:first-child {
-  position: absolute;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  top: 0;
-  height: 100%;
+  position: relative;
   overflow: auto;
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  width: 100%;
 }
 
 .emotion-5 {
@@ -3820,16 +3859,73 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
 }
 
 .emotion-8 {
-  overflow-y: hidden;
-  overflow-x: auto;
   color: #999999;
-  width: 100%;
   height: 40px;
-  -webkit-flex-shrink: 0;
-  -ms-flex-negative: 0;
-  flex-shrink: 0;
-  box-shadow: rgba(0,0,0,.1) 0 -1px 0 0 inset;
-  background: #FFFFFF;
+  overflow: auto;
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-8:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
+.emotion-8::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+  display: none;
+}
+
+.emotion-8:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
+}
+
+.emotion-8::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-8::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-8::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
 }
 
 .emotion-7 {
@@ -3842,12 +3938,7 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   -ms-flex-pack: justify;
   justify-content: space-between;
   position: relative;
-  -webkit-flex-wrap: nowrap;
-  -ms-flex-wrap: nowrap;
-  flex-wrap: nowrap;
-  -webkit-flex-shrink: 0;
-  -ms-flex-negative: 0;
-  flex-shrink: 0;
+  white-space: nowrap;
   height: 40px;
 }
 
@@ -3856,7 +3947,6 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  white-space: nowrap;
   -webkit-flex-basis: auto;
   -ms-flex-preferred-size: auto;
   flex-basis: auto;
@@ -3927,7 +4017,6 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  white-space: nowrap;
   -webkit-flex-basis: auto;
   -ms-flex-preferred-size: auto;
   flex-basis: auto;
@@ -3957,23 +4046,12 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
   display: block;
   position: relative;
   font-size: 13px;
-  height: calc(100% - 40px);
-  position: absolute;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  top: 40px;
-  overflow: auto;
-}
-
-.emotion-99 > *:first-child {
-  position: absolute;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  top: 0;
-  height: 100%;
+  position: relative;
   overflow: auto;
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  width: 100%;
 }
 
 .emotion-5 {
@@ -4303,84 +4381,43 @@ exports[`Storyshots UI|Settings/ShortcutsScreen default shortcuts 1`] = `
 >
   <div
     class="emotion-8"
-    data-simplebar="true"
   >
     <div
-      class="simplebar-wrapper"
+      class="emotion-7"
     >
       <div
-        class="simplebar-height-auto-observer-wrapper"
+        class="emotion-2"
       >
         <div
-          class="simplebar-height-auto-observer"
-        />
-      </div>
-      <div
-        class="simplebar-mask"
-      >
-        <div
-          class="simplebar-offset"
+          class="emotion-1"
+          role="tablist"
         >
-          <div
-            class="simplebar-content"
+          <button
+            class="emotion-0"
+            role="tab"
+            type="button"
           >
-            <div
-              class="emotion-7"
-            >
-              <div
-                class="emotion-2"
-              >
-                <div
-                  class="emotion-1"
-                  role="tablist"
-                >
-                  <button
-                    class="emotion-0"
-                    role="tab"
-                    type="button"
-                  >
-                    Keyboard Shortcuts
-                  </button>
-                </div>
-              </div>
-              <div
-                class="emotion-6"
-              >
-                <button
-                  class="emotion-5"
-                >
-                  <svg
-                    class="emotion-4"
-                    viewBox="0 0 1024 1024"
-                  >
-                    <path
-                      class="emotion-3"
-                      d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
-                    />
-                  </svg>
-                </button>
-              </div>
-            </div>
-          </div>
+            Keyboard Shortcuts
+          </button>
         </div>
       </div>
       <div
-        class="simplebar-placeholder"
-      />
-    </div>
-    <div
-      class="simplebar-track simplebar-horizontal"
-    >
-      <div
-        class="simplebar-scrollbar"
-      />
-    </div>
-    <div
-      class="simplebar-track simplebar-vertical"
-    >
-      <div
-        class="simplebar-scrollbar"
-      />
+        class="emotion-6"
+      >
+        <button
+          class="emotion-5"
+        >
+          <svg
+            class="emotion-4"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-3"
+              d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
+            />
+          </svg>
+        </button>
+      </div>
     </div>
   </div>
   <div
diff --git a/lib/components/src/syntaxhighlighter/__snapshots__/syntaxhighlighter.stories.storyshot b/lib/components/src/syntaxhighlighter/__snapshots__/syntaxhighlighter.stories.storyshot
index bb700664b9a..83209e363fb 100644
--- a/lib/components/src/syntaxhighlighter/__snapshots__/syntaxhighlighter.stories.storyshot
+++ b/lib/components/src/syntaxhighlighter/__snapshots__/syntaxhighlighter.stories.storyshot
@@ -1,19 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Storyshots Basics|SyntaxHighlighter bash 1`] = `
-.emotion-0 {
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  padding-right: 0;
-  opacity: 1;
-}
-
-.emotion-3 {
-  position: relative;
-  overflow: hidden;
-}
-
 .emotion-2 {
   position: relative;
   overflow: auto;
@@ -169,6 +156,19 @@ exports[`Storyshots Basics|SyntaxHighlighter bash 1`] = `
   opacity: 0.7;
 }
 
+.emotion-0 {
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  padding-right: 0;
+  opacity: 1;
+}
+
+.emotion-3 {
+  position: relative;
+  overflow: hidden;
+}
+
 .emotion-1 {
   display: -webkit-box;
   display: -webkit-flex;
@@ -220,6 +220,161 @@ exports[`Storyshots Basics|SyntaxHighlighter bordered & copy-able 1`] = `
   border: 1px solid rgba(0,0,0,.1);
 }
 
+.emotion-2 {
+  position: relative;
+  overflow: auto;
+}
+
+.emotion-2 code {
+  padding-right: 10px;
+}
+
+.emotion-2 * .token {
+  font-family: "Operator Mono","Fira Code Retina","Fira Code","FiraCode-Retina","Andale Mono","Lucida Console",Consolas,Monaco,monospace;
+  -webkit-font-smoothing: antialiased;
+}
+
+.emotion-2 * .token.comment {
+  color: #008000;
+  font-style: italic;
+}
+
+.emotion-2 * .token.prolog {
+  color: #008000;
+  font-style: italic;
+}
+
+.emotion-2 * .token.doctype {
+  color: #008000;
+  font-style: italic;
+}
+
+.emotion-2 * .token.cdata {
+  color: #008000;
+  font-style: italic;
+}
+
+.emotion-2 * .token.string {
+  color: #A31515;
+}
+
+.emotion-2 * .token.punctuation {
+  color: #393A34;
+}
+
+.emotion-2 * .token.operator {
+  color: #393A34;
+}
+
+.emotion-2 * .token.url {
+  color: #36acaa;
+}
+
+.emotion-2 * .token.symbol {
+  color: #36acaa;
+}
+
+.emotion-2 * .token.number {
+  color: #36acaa;
+}
+
+.emotion-2 * .token.boolean {
+  color: #36acaa;
+}
+
+.emotion-2 * .token.variable {
+  color: #36acaa;
+}
+
+.emotion-2 * .token.constant {
+  color: #36acaa;
+}
+
+.emotion-2 * .token.inserted {
+  color: #36acaa;
+}
+
+.emotion-2 * .token.atrule {
+  color: #0000ff;
+}
+
+.emotion-2 * .token.keyword {
+  color: #0000ff;
+}
+
+.emotion-2 * .token.attr-value {
+  color: #0000ff;
+}
+
+.emotion-2 * .token.function {
+  color: #393A34;
+}
+
+.emotion-2 * .token.deleted {
+  color: #9a050f;
+}
+
+.emotion-2 * .token.important {
+  font-weight: bold;
+}
+
+.emotion-2 * .token.bold {
+  font-weight: bold;
+}
+
+.emotion-2 * .token.italic {
+  font-style: italic;
+}
+
+.emotion-2 * .token.class-name {
+  color: #2B91AF;
+}
+
+.emotion-2 * .token.tag {
+  color: #800000;
+}
+
+.emotion-2 * .token.selector {
+  color: #800000;
+}
+
+.emotion-2 * .token.attr-name {
+  color: #ff0000;
+}
+
+.emotion-2 * .token.property {
+  color: #ff0000;
+}
+
+.emotion-2 * .token.regex {
+  color: #ff0000;
+}
+
+.emotion-2 * .token.entity {
+  color: #ff0000;
+}
+
+.emotion-2 * .token.directive.tag .tag {
+  background: #ffff00;
+  color: #393A34;
+}
+
+.emotion-2 * .language-json .token.boolean {
+  color: #0000ff;
+}
+
+.emotion-2 * .language-json .token.number {
+  color: #0000ff;
+}
+
+.emotion-2 * .language-json .token.property {
+  color: #2B91AF;
+}
+
+.emotion-2 * .namespace {
+  opacity: 0.7;
+}
+
 .emotion-1 {
   display: -webkit-box;
   display: -webkit-flex;
@@ -290,161 +445,6 @@ exports[`Storyshots Basics|SyntaxHighlighter bordered & copy-able 1`] = `
   outline: 0 none;
 }
 
-.emotion-2 {
-  position: relative;
-  overflow: auto;
-}
-
-.emotion-2 code {
-  padding-right: 10px;
-}
-
-.emotion-2 * .token {
-  font-family: "Operator Mono","Fira Code Retina","Fira Code","FiraCode-Retina","Andale Mono","Lucida Console",Consolas,Monaco,monospace;
-  -webkit-font-smoothing: antialiased;
-}
-
-.emotion-2 * .token.comment {
-  color: #008000;
-  font-style: italic;
-}
-
-.emotion-2 * .token.prolog {
-  color: #008000;
-  font-style: italic;
-}
-
-.emotion-2 * .token.doctype {
-  color: #008000;
-  font-style: italic;
-}
-
-.emotion-2 * .token.cdata {
-  color: #008000;
-  font-style: italic;
-}
-
-.emotion-2 * .token.string {
-  color: #A31515;
-}
-
-.emotion-2 * .token.punctuation {
-  color: #393A34;
-}
-
-.emotion-2 * .token.operator {
-  color: #393A34;
-}
-
-.emotion-2 * .token.url {
-  color: #36acaa;
-}
-
-.emotion-2 * .token.symbol {
-  color: #36acaa;
-}
-
-.emotion-2 * .token.number {
-  color: #36acaa;
-}
-
-.emotion-2 * .token.boolean {
-  color: #36acaa;
-}
-
-.emotion-2 * .token.variable {
-  color: #36acaa;
-}
-
-.emotion-2 * .token.constant {
-  color: #36acaa;
-}
-
-.emotion-2 * .token.inserted {
-  color: #36acaa;
-}
-
-.emotion-2 * .token.atrule {
-  color: #0000ff;
-}
-
-.emotion-2 * .token.keyword {
-  color: #0000ff;
-}
-
-.emotion-2 * .token.attr-value {
-  color: #0000ff;
-}
-
-.emotion-2 * .token.function {
-  color: #393A34;
-}
-
-.emotion-2 * .token.deleted {
-  color: #9a050f;
-}
-
-.emotion-2 * .token.important {
-  font-weight: bold;
-}
-
-.emotion-2 * .token.bold {
-  font-weight: bold;
-}
-
-.emotion-2 * .token.italic {
-  font-style: italic;
-}
-
-.emotion-2 * .token.class-name {
-  color: #2B91AF;
-}
-
-.emotion-2 * .token.tag {
-  color: #800000;
-}
-
-.emotion-2 * .token.selector {
-  color: #800000;
-}
-
-.emotion-2 * .token.attr-name {
-  color: #ff0000;
-}
-
-.emotion-2 * .token.property {
-  color: #ff0000;
-}
-
-.emotion-2 * .token.regex {
-  color: #ff0000;
-}
-
-.emotion-2 * .token.entity {
-  color: #ff0000;
-}
-
-.emotion-2 * .token.directive.tag .tag {
-  background: #ffff00;
-  color: #393A34;
-}
-
-.emotion-2 * .language-json .token.boolean {
-  color: #0000ff;
-}
-
-.emotion-2 * .language-json .token.number {
-  color: #0000ff;
-}
-
-.emotion-2 * .language-json .token.property {
-  color: #2B91AF;
-}
-
-.emotion-2 * .namespace {
-  opacity: 0.7;
-}
-
 <div
   class="emotion-5"
 >
@@ -653,19 +653,6 @@ exports[`Storyshots Basics|SyntaxHighlighter bordered & copy-able 1`] = `
 `;
 
 exports[`Storyshots Basics|SyntaxHighlighter jsx 1`] = `
-.emotion-0 {
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  padding-right: 0;
-  opacity: 1;
-}
-
-.emotion-3 {
-  position: relative;
-  overflow: hidden;
-}
-
 .emotion-2 {
   position: relative;
   overflow: auto;
@@ -821,6 +808,19 @@ exports[`Storyshots Basics|SyntaxHighlighter jsx 1`] = `
   opacity: 0.7;
 }
 
+.emotion-0 {
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  padding-right: 0;
+  opacity: 1;
+}
+
+.emotion-3 {
+  position: relative;
+  overflow: hidden;
+}
+
 .emotion-1 {
   display: -webkit-box;
   display: -webkit-flex;
@@ -1063,32 +1063,6 @@ exports[`Storyshots Basics|SyntaxHighlighter jsx 1`] = `
 `;
 
 exports[`Storyshots Basics|SyntaxHighlighter padded 1`] = `
-.emotion-1 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-pack: start;
-  -webkit-justify-content: flex-start;
-  -ms-flex-pack: start;
-  justify-content: flex-start;
-  margin: 0;
-  padding: 10px;
-}
-
-.emotion-0 {
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  padding-right: 0;
-  opacity: 1;
-}
-
-.emotion-3 {
-  position: relative;
-  overflow: hidden;
-}
-
 .emotion-2 {
   position: relative;
   overflow: auto;
@@ -1244,6 +1218,32 @@ exports[`Storyshots Basics|SyntaxHighlighter padded 1`] = `
   opacity: 0.7;
 }
 
+.emotion-1 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: start;
+  -webkit-justify-content: flex-start;
+  -ms-flex-pack: start;
+  justify-content: flex-start;
+  margin: 0;
+  padding: 10px;
+}
+
+.emotion-0 {
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  padding-right: 0;
+  opacity: 1;
+}
+
+.emotion-3 {
+  position: relative;
+  overflow: hidden;
+}
+
 <div
   class="emotion-3"
 >
@@ -1443,19 +1443,6 @@ exports[`Storyshots Basics|SyntaxHighlighter padded 1`] = `
 `;
 
 exports[`Storyshots Basics|SyntaxHighlighter showLineNumbers 1`] = `
-.emotion-0 {
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  padding-right: 0;
-  opacity: 1;
-}
-
-.emotion-3 {
-  position: relative;
-  overflow: hidden;
-}
-
 .emotion-2 {
   position: relative;
   overflow: auto;
@@ -1611,6 +1598,19 @@ exports[`Storyshots Basics|SyntaxHighlighter showLineNumbers 1`] = `
   opacity: 0.7;
 }
 
+.emotion-0 {
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  padding-right: 0;
+  opacity: 1;
+}
+
+.emotion-3 {
+  position: relative;
+  overflow: hidden;
+}
+
 .emotion-1 {
   display: -webkit-box;
   display: -webkit-flex;
@@ -1855,19 +1855,6 @@ exports[`Storyshots Basics|SyntaxHighlighter showLineNumbers 1`] = `
 `;
 
 exports[`Storyshots Basics|SyntaxHighlighter story 1`] = `
-.emotion-0 {
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  padding-right: 0;
-  opacity: 1;
-}
-
-.emotion-3 {
-  position: relative;
-  overflow: hidden;
-}
-
 .emotion-2 {
   position: relative;
   overflow: auto;
@@ -2023,6 +2010,19 @@ exports[`Storyshots Basics|SyntaxHighlighter story 1`] = `
   opacity: 0.7;
 }
 
+.emotion-0 {
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  padding-right: 0;
+  opacity: 1;
+}
+
+.emotion-3 {
+  position: relative;
+  overflow: hidden;
+}
+
 .emotion-1 {
   display: -webkit-box;
   display: -webkit-flex;
diff --git a/lib/components/src/tabs/__snapshots__/tabs.stories.storyshot b/lib/components/src/tabs/__snapshots__/tabs.stories.storyshot
index 2d58ee1b12b..172fa52ea43 100644
--- a/lib/components/src/tabs/__snapshots__/tabs.stories.storyshot
+++ b/lib/components/src/tabs/__snapshots__/tabs.stories.storyshot
@@ -1,6 +1,107 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Storyshots Basics|Tabs stateful - dynamic 1`] = `
+.emotion-9 {
+  color: #999999;
+  height: 40px;
+  overflow: auto;
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-9:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
+.emotion-9::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+  display: none;
+}
+
+.emotion-9:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
+}
+
+.emotion-9::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-9::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-9::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
+}
+
+.emotion-8 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+  position: relative;
+  white-space: nowrap;
+  height: 40px;
+}
+
+.emotion-7 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+}
+
+.emotion-7 > * {
+  margin-left: 15px;
+}
+
 .emotion-6 {
   overflow: hidden;
 }
@@ -103,107 +204,6 @@ exports[`Storyshots Basics|Tabs stateful - dynamic 1`] = `
   display: block;
 }
 
-.emotion-9 {
-  color: #999999;
-  height: 40px;
-  overflow: auto;
-  overflow-x: auto;
-  overflow-y: hidden;
-  -webkit-scrollbar-width: slim;
-  -moz-scrollbar-width: slim;
-  -ms-scrollbar-width: slim;
-  scrollbar-width: slim;
-  -webkit-scrollbar-width: 3px;
-  -moz-scrollbar-width: 3px;
-  -ms-scrollbar-width: 3px;
-  scrollbar-width: 3px;
-  -webkit-scrollbar-color: transparent transparent;
-  -moz-scrollbar-color: transparent transparent;
-  -ms-scrollbar-color: transparent transparent;
-  scrollbar-color: transparent transparent;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
-}
-
-.emotion-9:hover {
-  -webkit-scrollbar-width: none;
-  -moz-scrollbar-width: none;
-  -ms-scrollbar-width: none;
-  scrollbar-width: none;
-  -webkit-scrollbar-width: 0;
-  -moz-scrollbar-width: 0;
-  -ms-scrollbar-width: 0;
-  scrollbar-width: 0;
-}
-
-.emotion-9::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  box-shadow: none;
-  display: none;
-}
-
-.emotion-9:hover::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  display: block;
-}
-
-.emotion-9::-webkit-scrollbar-track {
-  border-radius: 0;
-  background: transparent;
-  opacity: 0;
-  border: 0 none;
-  box-shadow: none;
-  height: 0;
-  width: 0;
-}
-
-.emotion-9::-webkit-scrollbar-thumb {
-  border-radius: 0;
-  background: rgba(0,0,0,.1);
-  box-shadow: none;
-}
-
-.emotion-9::-webkit-scrollbar-track-piece {
-  display: none;
-  border: 0 none;
-  opacity: 0;
-  visibility: hidden;
-}
-
-.emotion-8 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-pack: justify;
-  -webkit-justify-content: space-between;
-  -ms-flex-pack: justify;
-  justify-content: space-between;
-  position: relative;
-  white-space: nowrap;
-  height: 40px;
-}
-
-.emotion-7 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex-basis: auto;
-  -ms-flex-preferred-size: auto;
-  flex-basis: auto;
-  -webkit-flex-shrink: 0;
-  -ms-flex-negative: 0;
-  flex-shrink: 0;
-}
-
-.emotion-7 > * {
-  margin-left: 15px;
-}
-
 .emotion-11 {
   display: block;
   position: relative;
@@ -350,6 +350,107 @@ exports[`Storyshots Basics|Tabs stateful - dynamic 1`] = `
 `;
 
 exports[`Storyshots Basics|Tabs stateful - no initial 1`] = `
+.emotion-9 {
+  color: #999999;
+  height: 40px;
+  overflow: auto;
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-9:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
+.emotion-9::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+  display: none;
+}
+
+.emotion-9:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
+}
+
+.emotion-9::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-9::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-9::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
+}
+
+.emotion-8 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+  position: relative;
+  white-space: nowrap;
+  height: 40px;
+}
+
+.emotion-7 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+}
+
+.emotion-7 > * {
+  margin-left: 15px;
+}
+
 .emotion-6 {
   overflow: hidden;
 }
@@ -452,107 +553,6 @@ exports[`Storyshots Basics|Tabs stateful - no initial 1`] = `
   display: block;
 }
 
-.emotion-9 {
-  color: #999999;
-  height: 40px;
-  overflow: auto;
-  overflow-x: auto;
-  overflow-y: hidden;
-  -webkit-scrollbar-width: slim;
-  -moz-scrollbar-width: slim;
-  -ms-scrollbar-width: slim;
-  scrollbar-width: slim;
-  -webkit-scrollbar-width: 3px;
-  -moz-scrollbar-width: 3px;
-  -ms-scrollbar-width: 3px;
-  scrollbar-width: 3px;
-  -webkit-scrollbar-color: transparent transparent;
-  -moz-scrollbar-color: transparent transparent;
-  -ms-scrollbar-color: transparent transparent;
-  scrollbar-color: transparent transparent;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
-}
-
-.emotion-9:hover {
-  -webkit-scrollbar-width: none;
-  -moz-scrollbar-width: none;
-  -ms-scrollbar-width: none;
-  scrollbar-width: none;
-  -webkit-scrollbar-width: 0;
-  -moz-scrollbar-width: 0;
-  -ms-scrollbar-width: 0;
-  scrollbar-width: 0;
-}
-
-.emotion-9::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  box-shadow: none;
-  display: none;
-}
-
-.emotion-9:hover::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  display: block;
-}
-
-.emotion-9::-webkit-scrollbar-track {
-  border-radius: 0;
-  background: transparent;
-  opacity: 0;
-  border: 0 none;
-  box-shadow: none;
-  height: 0;
-  width: 0;
-}
-
-.emotion-9::-webkit-scrollbar-thumb {
-  border-radius: 0;
-  background: rgba(0,0,0,.1);
-  box-shadow: none;
-}
-
-.emotion-9::-webkit-scrollbar-track-piece {
-  display: none;
-  border: 0 none;
-  opacity: 0;
-  visibility: hidden;
-}
-
-.emotion-8 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-pack: justify;
-  -webkit-justify-content: space-between;
-  -ms-flex-pack: justify;
-  justify-content: space-between;
-  position: relative;
-  white-space: nowrap;
-  height: 40px;
-}
-
-.emotion-7 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex-basis: auto;
-  -ms-flex-preferred-size: auto;
-  flex-basis: auto;
-  -webkit-flex-shrink: 0;
-  -ms-flex-negative: 0;
-  flex-shrink: 0;
-}
-
-.emotion-7 > * {
-  margin-left: 15px;
-}
-
 .emotion-11 {
   display: block;
   position: relative;
@@ -655,6 +655,107 @@ exports[`Storyshots Basics|Tabs stateful - no initial 1`] = `
 `;
 
 exports[`Storyshots Basics|Tabs stateful - static 1`] = `
+.emotion-5 {
+  color: #999999;
+  height: 40px;
+  overflow: auto;
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-5:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
+.emotion-5::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+  display: none;
+}
+
+.emotion-5:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
+}
+
+.emotion-5::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-5::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-5::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
+}
+
+.emotion-4 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+  position: relative;
+  white-space: nowrap;
+  height: 40px;
+}
+
+.emotion-3 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+}
+
+.emotion-3 > * {
+  margin-left: 15px;
+}
+
 .emotion-2 {
   overflow: hidden;
 }
@@ -757,107 +858,6 @@ exports[`Storyshots Basics|Tabs stateful - static 1`] = `
   display: block;
 }
 
-.emotion-5 {
-  color: #999999;
-  height: 40px;
-  overflow: auto;
-  overflow-x: auto;
-  overflow-y: hidden;
-  -webkit-scrollbar-width: slim;
-  -moz-scrollbar-width: slim;
-  -ms-scrollbar-width: slim;
-  scrollbar-width: slim;
-  -webkit-scrollbar-width: 3px;
-  -moz-scrollbar-width: 3px;
-  -ms-scrollbar-width: 3px;
-  scrollbar-width: 3px;
-  -webkit-scrollbar-color: transparent transparent;
-  -moz-scrollbar-color: transparent transparent;
-  -ms-scrollbar-color: transparent transparent;
-  scrollbar-color: transparent transparent;
-  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
-}
-
-.emotion-5:hover {
-  -webkit-scrollbar-width: none;
-  -moz-scrollbar-width: none;
-  -ms-scrollbar-width: none;
-  scrollbar-width: none;
-  -webkit-scrollbar-width: 0;
-  -moz-scrollbar-width: 0;
-  -ms-scrollbar-width: 0;
-  scrollbar-width: 0;
-}
-
-.emotion-5::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  box-shadow: none;
-  display: none;
-}
-
-.emotion-5:hover::-webkit-scrollbar {
-  height: 3px;
-  width: 3px;
-  background: transparent;
-  display: block;
-}
-
-.emotion-5::-webkit-scrollbar-track {
-  border-radius: 0;
-  background: transparent;
-  opacity: 0;
-  border: 0 none;
-  box-shadow: none;
-  height: 0;
-  width: 0;
-}
-
-.emotion-5::-webkit-scrollbar-thumb {
-  border-radius: 0;
-  background: rgba(0,0,0,.1);
-  box-shadow: none;
-}
-
-.emotion-5::-webkit-scrollbar-track-piece {
-  display: none;
-  border: 0 none;
-  opacity: 0;
-  visibility: hidden;
-}
-
-.emotion-4 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-pack: justify;
-  -webkit-justify-content: space-between;
-  -ms-flex-pack: justify;
-  justify-content: space-between;
-  position: relative;
-  white-space: nowrap;
-  height: 40px;
-}
-
-.emotion-3 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex-basis: auto;
-  -ms-flex-preferred-size: auto;
-  flex-basis: auto;
-  -webkit-flex-shrink: 0;
-  -ms-flex-negative: 0;
-  flex-shrink: 0;
-}
-
-.emotion-3 > * {
-  margin-left: 15px;
-}
-
 .emotion-7 {
   display: block;
   position: relative;
@@ -918,104 +918,6 @@ exports[`Storyshots Basics|Tabs stateful - static 1`] = `
 `;
 
 exports[`Storyshots Basics|Tabs stateless - absolute 1`] = `
-.emotion-6 {
-  overflow: hidden;
-}
-
-.emotion-6:first-of-type {
-  margin-left: 0;
-}
-
-.emotion-0 {
-  white-space: normal;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding: 0 15px;
-  text-transform: capitalize;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  height: 40px;
-  line-height: 12px;
-  cursor: pointer;
-  background: transparent;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  font-weight: bold;
-  font-size: 13px;
-  color: inherit;
-  border-bottom-color: transparent;
-}
-
-.emotion-0:empty {
-  display: none;
-}
-
-.emotion-0:focus {
-  outline: 0 none;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-2 {
-  white-space: normal;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding: 0 15px;
-  text-transform: capitalize;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  height: 40px;
-  line-height: 12px;
-  cursor: pointer;
-  background: transparent;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  font-weight: bold;
-  font-size: 13px;
-  color: #1EA7FD;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-2:empty {
-  display: none;
-}
-
-.emotion-2:focus {
-  outline: 0 none;
-  border-bottom-color: #1EA7FD;
-}
-
 .emotion-9 {
   color: #999999;
   height: 40px;
@@ -1117,6 +1019,116 @@ exports[`Storyshots Basics|Tabs stateless - absolute 1`] = `
   margin-left: 15px;
 }
 
+.emotion-6 {
+  overflow: hidden;
+}
+
+.emotion-6:first-of-type {
+  margin-left: 0;
+}
+
+.emotion-0 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
+  font-size: 13px;
+  color: inherit;
+  border-bottom-color: transparent;
+}
+
+.emotion-0:empty {
+  display: none;
+}
+
+.emotion-0:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-2 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
+  font-size: 13px;
+  color: #1EA7FD;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-2:empty {
+  display: none;
+}
+
+.emotion-2:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-11 {
+  display: block;
+  position: relative;
+  font-size: 13px;
+  position: relative;
+  overflow: auto;
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  width: 100%;
+}
+
 .emotion-10 {
   display: none;
 }
@@ -1136,18 +1148,6 @@ exports[`Storyshots Basics|Tabs stateless - absolute 1`] = `
   flex-direction: column;
 }
 
-.emotion-11 {
-  display: block;
-  position: relative;
-  font-size: 13px;
-  position: relative;
-  overflow: auto;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  width: 100%;
-}
-
 <div
   style="height:calc(100vh - 20px)"
 >
@@ -1284,104 +1284,6 @@ exports[`Storyshots Basics|Tabs stateless - absolute 1`] = `
 `;
 
 exports[`Storyshots Basics|Tabs stateless - bordered 1`] = `
-.emotion-6 {
-  overflow: hidden;
-}
-
-.emotion-6:first-of-type {
-  margin-left: 0;
-}
-
-.emotion-0 {
-  white-space: normal;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding: 0 15px;
-  text-transform: capitalize;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  height: 40px;
-  line-height: 12px;
-  cursor: pointer;
-  background: transparent;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  font-weight: bold;
-  font-size: 13px;
-  color: inherit;
-  border-bottom-color: transparent;
-}
-
-.emotion-0:empty {
-  display: none;
-}
-
-.emotion-0:focus {
-  outline: 0 none;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-2 {
-  white-space: normal;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding: 0 15px;
-  text-transform: capitalize;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  height: 40px;
-  line-height: 12px;
-  cursor: pointer;
-  background: transparent;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  font-weight: bold;
-  font-size: 13px;
-  color: #1EA7FD;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-2:empty {
-  display: none;
-}
-
-.emotion-2:focus {
-  outline: 0 none;
-  border-bottom-color: #1EA7FD;
-}
-
 .emotion-9 {
   color: #999999;
   height: 40px;
@@ -1483,6 +1385,104 @@ exports[`Storyshots Basics|Tabs stateless - bordered 1`] = `
   margin-left: 15px;
 }
 
+.emotion-6 {
+  overflow: hidden;
+}
+
+.emotion-6:first-of-type {
+  margin-left: 0;
+}
+
+.emotion-0 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
+  font-size: 13px;
+  color: inherit;
+  border-bottom-color: transparent;
+}
+
+.emotion-0:empty {
+  display: none;
+}
+
+.emotion-0:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-2 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
+  font-size: 13px;
+  color: #1EA7FD;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-2:empty {
+  display: none;
+}
+
+.emotion-2:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
 .emotion-11 {
   display: block;
   position: relative;
@@ -1662,104 +1662,6 @@ exports[`Storyshots Basics|Tabs stateless - empty 1`] = `
 `;
 
 exports[`Storyshots Basics|Tabs stateless - no scrolling 1`] = `
-.emotion-6 {
-  overflow: hidden;
-}
-
-.emotion-6:first-of-type {
-  margin-left: 0;
-}
-
-.emotion-0 {
-  white-space: normal;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding: 0 15px;
-  text-transform: capitalize;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  height: 40px;
-  line-height: 12px;
-  cursor: pointer;
-  background: transparent;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  font-weight: bold;
-  font-size: 13px;
-  color: inherit;
-  border-bottom-color: transparent;
-}
-
-.emotion-0:empty {
-  display: none;
-}
-
-.emotion-0:focus {
-  outline: 0 none;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-2 {
-  white-space: normal;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding: 0 15px;
-  text-transform: capitalize;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  height: 40px;
-  line-height: 12px;
-  cursor: pointer;
-  background: transparent;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  font-weight: bold;
-  font-size: 13px;
-  color: #1EA7FD;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-2:empty {
-  display: none;
-}
-
-.emotion-2:focus {
-  outline: 0 none;
-  border-bottom-color: #1EA7FD;
-}
-
 .emotion-9 {
   color: #999999;
   height: 40px;
@@ -1861,6 +1763,104 @@ exports[`Storyshots Basics|Tabs stateless - no scrolling 1`] = `
   margin-left: 15px;
 }
 
+.emotion-6 {
+  overflow: hidden;
+}
+
+.emotion-6:first-of-type {
+  margin-left: 0;
+}
+
+.emotion-0 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
+  font-size: 13px;
+  color: inherit;
+  border-bottom-color: transparent;
+}
+
+.emotion-0:empty {
+  display: none;
+}
+
+.emotion-0:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-2 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
+  font-size: 13px;
+  color: #1EA7FD;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-2:empty {
+  display: none;
+}
+
+.emotion-2:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
 .emotion-11 {
   display: block;
   position: relative;
@@ -2013,108 +2013,6 @@ exports[`Storyshots Basics|Tabs stateless - no scrolling 1`] = `
 `;
 
 exports[`Storyshots Basics|Tabs stateless - with tools 1`] = `
-.emotion-6 {
-  overflow: hidden;
-}
-
-.emotion-6:first-of-type {
-  margin-left: 0;
-}
-
-.emotion-0 {
-  white-space: normal;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding: 0 15px;
-  text-transform: capitalize;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  height: 40px;
-  line-height: 12px;
-  cursor: pointer;
-  background: transparent;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  font-weight: bold;
-  font-size: 13px;
-  color: inherit;
-  border-bottom-color: transparent;
-}
-
-.emotion-0:empty {
-  display: none;
-}
-
-.emotion-0:focus {
-  outline: 0 none;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-2 {
-  white-space: normal;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  overflow: hidden;
-  vertical-align: top;
-  -webkit-box-pack: center;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding: 0 15px;
-  text-transform: capitalize;
-  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  transition: color 0.2s linear,border-bottom-color 0.2s linear;
-  height: 40px;
-  line-height: 12px;
-  cursor: pointer;
-  background: transparent;
-  border: 0 solid transparent;
-  border-top: 3px solid transparent;
-  border-bottom: 3px solid transparent;
-  font-weight: bold;
-  font-size: 13px;
-  color: #1EA7FD;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-2:empty {
-  display: none;
-}
-
-.emotion-2:focus {
-  outline: 0 none;
-  border-bottom-color: #1EA7FD;
-}
-
-.emotion-13 {
-  display: block;
-}
-
 .emotion-10 {
   color: #999999;
   height: 40px;
@@ -2216,16 +2114,104 @@ exports[`Storyshots Basics|Tabs stateless - with tools 1`] = `
   margin-left: 15px;
 }
 
-.emotion-12 {
-  display: block;
-  position: relative;
-  font-size: 13px;
+.emotion-6 {
+  overflow: hidden;
 }
 
-.emotion-11 {
+.emotion-6:first-of-type {
+  margin-left: 0;
+}
+
+.emotion-0 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
+  font-size: 13px;
+  color: inherit;
+  border-bottom-color: transparent;
+}
+
+.emotion-0:empty {
   display: none;
 }
 
+.emotion-0:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-2 {
+  white-space: normal;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  overflow: hidden;
+  vertical-align: top;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  padding: 0 15px;
+  text-transform: capitalize;
+  -webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  transition: color 0.2s linear,border-bottom-color 0.2s linear;
+  height: 40px;
+  line-height: 12px;
+  cursor: pointer;
+  background: transparent;
+  border: 0 solid transparent;
+  border-top: 3px solid transparent;
+  border-bottom: 3px solid transparent;
+  font-weight: bold;
+  font-size: 13px;
+  color: #1EA7FD;
+  border-bottom-color: #1EA7FD;
+}
+
+.emotion-2:empty {
+  display: none;
+}
+
+.emotion-2:focus {
+  outline: 0 none;
+  border-bottom-color: #1EA7FD;
+}
+
 .emotion-8 {
   display: -webkit-box;
   display: -webkit-flex;
@@ -2244,6 +2230,20 @@ exports[`Storyshots Basics|Tabs stateless - with tools 1`] = `
   margin-right: 15px;
 }
 
+.emotion-13 {
+  display: block;
+}
+
+.emotion-12 {
+  display: block;
+  position: relative;
+  font-size: 13px;
+}
+
+.emotion-11 {
+  display: none;
+}
+
 <div
   style="height:calc(100vh - 20px)"
 >
diff --git a/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot b/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot
index 39da8a6a008..49acd540911 100644
--- a/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot
+++ b/lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot
@@ -15,16 +15,73 @@ exports[`Storyshots UI|Panel default 1`] = `
 }
 
 .emotion-12 {
-  overflow-y: hidden;
-  overflow-x: auto;
   color: #999999;
-  width: 100%;
   height: 40px;
-  -webkit-flex-shrink: 0;
-  -ms-flex-negative: 0;
-  flex-shrink: 0;
-  box-shadow: rgba(0,0,0,.1) 0 -1px 0 0 inset;
-  background: #FFFFFF;
+  overflow: auto;
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-12:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
+.emotion-12::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+  display: none;
+}
+
+.emotion-12:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
+}
+
+.emotion-12::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-12::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-12::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
 }
 
 .emotion-11 {
@@ -37,12 +94,7 @@ exports[`Storyshots UI|Panel default 1`] = `
   -ms-flex-pack: justify;
   justify-content: space-between;
   position: relative;
-  -webkit-flex-wrap: nowrap;
-  -ms-flex-wrap: nowrap;
-  flex-wrap: nowrap;
-  -webkit-flex-shrink: 0;
-  -ms-flex-negative: 0;
-  flex-shrink: 0;
+  white-space: nowrap;
   height: 40px;
 }
 
@@ -51,7 +103,6 @@ exports[`Storyshots UI|Panel default 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  white-space: nowrap;
   -webkit-flex-basis: auto;
   -ms-flex-preferred-size: auto;
   flex-basis: auto;
@@ -167,7 +218,6 @@ exports[`Storyshots UI|Panel default 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  white-space: nowrap;
   -webkit-flex-basis: auto;
   -ms-flex-preferred-size: auto;
   flex-basis: auto;
@@ -226,23 +276,12 @@ exports[`Storyshots UI|Panel default 1`] = `
   display: block;
   position: relative;
   font-size: 13px;
-  height: calc(100% - 40px);
-  position: absolute;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  top: 40px;
-  overflow: auto;
-}
-
-.emotion-13 > *:first-child {
-  position: absolute;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  top: 0;
-  height: 100%;
+  position: relative;
   overflow: auto;
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  width: 100%;
 }
 
 <div
@@ -251,106 +290,65 @@ exports[`Storyshots UI|Panel default 1`] = `
 >
   <div
     class="emotion-12"
-    data-simplebar="true"
   >
     <div
-      class="simplebar-wrapper"
+      class="emotion-11"
     >
       <div
-        class="simplebar-height-auto-observer-wrapper"
+        class="emotion-3"
       >
         <div
-          class="simplebar-height-auto-observer"
-        />
-      </div>
-      <div
-        class="simplebar-mask"
-      >
-        <div
-          class="simplebar-offset"
+          class="emotion-2"
+          role="tablist"
         >
-          <div
-            class="simplebar-content"
+          <button
+            class="emotion-0"
+            role="tab"
+            type="button"
           >
-            <div
-              class="emotion-11"
-            >
-              <div
-                class="emotion-3"
-              >
-                <div
-                  class="emotion-2"
-                  role="tablist"
-                >
-                  <button
-                    class="emotion-0"
-                    role="tab"
-                    type="button"
-                  >
-                    Test 1
-                  </button>
-                  <button
-                    class="emotion-1"
-                    role="tab"
-                    type="button"
-                  >
-                    Test 2
-                  </button>
-                </div>
-              </div>
-              <div
-                class="emotion-10"
-              >
-                <button
-                  class="emotion-6"
-                  title="Change orientation"
-                >
-                  <svg
-                    class="emotion-5"
-                    viewBox="0 0 1024 1024"
-                  >
-                    <path
-                      class="emotion-4"
-                      d="M64 167.944v688c0 22.092 17.908 40 40 40h816c22.092 0 40-17.908 40-40v-688c0-22.092-17.908-40-40-40h-816c-22.092 0-40 17.908-40 40zM880 815.944h-240v-608h240v608zM144 207.944h416v608h-416v-608zM793.296 320.118h-66.398c-17.676 0-32-14.324-32-32 0-17.674 14.328-32 32-32h66.396c17.674 0 32.002 14.326 32.002 32 0 17.672-14.324 32-32 32zM793.296 448.118h-66.398c-17.676 0-32-14.324-32-32 0-17.674 14.328-32 32-32h66.396c17.674 0 32.002 14.326 32.002 32 0 17.672-14.324 32-32 32zM793.296 576.118h-66.398c-17.676 0-32-14.324-32-32 0-17.674 14.328-32 32-32h66.396c17.674 0 32.002 14.326 32.002 32 0 17.672-14.324 32-32 32z"
-                    />
-                  </svg>
-                </button>
-                <button
-                  class="emotion-6"
-                  title="Hide addons"
-                >
-                  <svg
-                    class="emotion-5"
-                    viewBox="0 0 1024 1024"
-                  >
-                    <path
-                      class="emotion-4"
-                      d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
-                    />
-                  </svg>
-                </button>
-              </div>
-            </div>
-          </div>
+            Test 1
+          </button>
+          <button
+            class="emotion-1"
+            role="tab"
+            type="button"
+          >
+            Test 2
+          </button>
         </div>
       </div>
       <div
-        class="simplebar-placeholder"
-      />
-    </div>
-    <div
-      class="simplebar-track simplebar-horizontal"
-    >
-      <div
-        class="simplebar-scrollbar"
-      />
-    </div>
-    <div
-      class="simplebar-track simplebar-vertical"
-    >
-      <div
-        class="simplebar-scrollbar"
-      />
+        class="emotion-10"
+      >
+        <button
+          class="emotion-6"
+          title="Change orientation"
+        >
+          <svg
+            class="emotion-5"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-4"
+              d="M64 167.944v688c0 22.092 17.908 40 40 40h816c22.092 0 40-17.908 40-40v-688c0-22.092-17.908-40-40-40h-816c-22.092 0-40 17.908-40 40zM880 815.944h-240v-608h240v608zM144 207.944h416v608h-416v-608zM793.296 320.118h-66.398c-17.676 0-32-14.324-32-32 0-17.674 14.328-32 32-32h66.396c17.674 0 32.002 14.326 32.002 32 0 17.672-14.324 32-32 32zM793.296 448.118h-66.398c-17.676 0-32-14.324-32-32 0-17.674 14.328-32 32-32h66.396c17.674 0 32.002 14.326 32.002 32 0 17.672-14.324 32-32 32zM793.296 576.118h-66.398c-17.676 0-32-14.324-32-32 0-17.674 14.328-32 32-32h66.396c17.674 0 32.002 14.326 32.002 32 0 17.672-14.324 32-32 32z"
+            />
+          </svg>
+        </button>
+        <button
+          class="emotion-6"
+          title="Hide addons"
+        >
+          <svg
+            class="emotion-5"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-4"
+              d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
+            />
+          </svg>
+        </button>
+      </div>
     </div>
   </div>
   <div
diff --git a/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot b/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot
index 5f1ce01b189..1e9b850e826 100644
--- a/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot
+++ b/lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot
@@ -12,12 +12,7 @@ Array [
   -ms-flex-pack: justify;
   justify-content: space-between;
   position: relative;
-  -webkit-flex-wrap: nowrap;
-  -ms-flex-wrap: nowrap;
-  flex-wrap: nowrap;
-  -webkit-flex-shrink: 0;
-  -ms-flex-negative: 0;
-  flex-shrink: 0;
+  white-space: nowrap;
   height: 40px;
 }
 
@@ -26,7 +21,6 @@ Array [
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  white-space: nowrap;
   -webkit-flex-basis: auto;
   -ms-flex-preferred-size: auto;
   flex-basis: auto;
@@ -44,7 +38,6 @@ Array [
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  white-space: nowrap;
   -webkit-flex-basis: auto;
   -ms-flex-preferred-size: auto;
   flex-basis: auto;
@@ -71,16 +64,24 @@ Array [
 }
 
 .emotion-23 {
-  overflow-y: hidden;
-  overflow-x: auto;
   color: #999999;
-  width: 100%;
   height: 40px;
-  -webkit-flex-shrink: 0;
-  -ms-flex-negative: 0;
-  flex-shrink: 0;
-  box-shadow: rgba(0,0,0,.1) 0 -1px 0 0 inset;
-  background: #FFFFFF;
+  overflow: auto;
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
   position: absolute;
   left: 0;
   right: 0;
@@ -92,6 +93,55 @@ Array [
   tranform: translateY(0px);
 }
 
+.emotion-23:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
+.emotion-23::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+  display: none;
+}
+
+.emotion-23:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
+}
+
+.emotion-23::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-23::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-23::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
+}
+
 .emotion-2 {
   height: 40px;
   background: none;
@@ -134,149 +184,108 @@ Array [
 
 <div
     class="emotion-23"
-    data-simplebar="true"
   >
     <div
-      class="simplebar-wrapper"
+      class="emotion-22"
     >
       <div
-        class="simplebar-height-auto-observer-wrapper"
+        class="emotion-13"
       >
-        <div
-          class="simplebar-height-auto-observer"
-        />
-      </div>
-      <div
-        class="simplebar-mask"
-      >
-        <div
-          class="simplebar-offset"
+        <button
+          class="emotion-2"
+          title="Zoom in"
         >
-          <div
-            class="simplebar-content"
+          <svg
+            class="emotion-1"
+            viewBox="0 0 1024 1024"
           >
-            <div
-              class="emotion-22"
-            >
-              <div
-                class="emotion-13"
-              >
-                <button
-                  class="emotion-2"
-                  title="Zoom in"
-                >
-                  <svg
-                    class="emotion-1"
-                    viewBox="0 0 1024 1024"
-                  >
-                    <path
-                      class="emotion-0"
-                      d="M220 670a316 316 0 0 1 0-450 316 316 0 0 1 450 0 316 316 0 0 1 0 450 316 316 0 0 1-450 0zm749 240L757 698a402 402 0 1 0-59 59l212 212a42 42 0 0 0 59-59zM487 604a42 42 0 0 1-84 0V487H286a42 42 0 1 1 0-84h117V286a42 42 0 1 1 84 0v117h117a42 42 0 0 1 0 84H487v117z"
-                    />
-                  </svg>
-                </button>
-                <button
-                  class="emotion-2"
-                  title="Zoom out"
-                >
-                  <svg
-                    class="emotion-1"
-                    viewBox="0 0 1024 1024"
-                  >
-                    <path
-                      class="emotion-0"
-                      d="M757 698a402 402 0 1 0-59 59l212 212a42 42 0 0 0 59-59L757 698zM126 445a316 316 0 0 1 319-319 316 316 0 0 1 318 319 316 316 0 0 1-318 318 316 316 0 0 1-319-318zm160 42a42 42 0 1 1 0-84h318a42 42 0 0 1 0 84H286z"
-                    />
-                  </svg>
-                </button>
-                <button
-                  class="emotion-2"
-                  title="Reset zoom"
-                >
-                  <svg
-                    class="emotion-1"
-                    viewBox="0 0 1024 1024"
-                  >
-                    <path
-                      class="emotion-0"
-                      d="M148 560a318 318 0 0 0 522 110 316 316 0 0 0 0-450 316 316 0 0 0-450 0c-11 11-21 22-30 34v4h47c25 0 46 21 46 46s-21 45-46 45H90c-13 0-25-6-33-14-9-9-14-20-14-33V156c0-25 20-45 45-45s45 20 45 45v32l1 1a401 401 0 0 1 623 509l212 212a42 42 0 0 1-59 59L698 757A401 401 0 0 1 65 570a42 42 0 0 1 83-10z"
-                    />
-                  </svg>
-                </button>
-                <span
-                  class="emotion-9"
-                />
-                <button
-                  class="emotion-2"
-                  title="Toggle background grid"
-                >
-                  <svg
-                    class="emotion-1"
-                    viewBox="0 0 1024 1024"
-                  >
-                    <path
-                      class="emotion-0"
-                      d="M437.162 552.368c-1.694-0.216-3.408-0.37-5.162-0.37h-263.978c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v264.040c0 22.094 17.91 40 40 40h263.978c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-264.044c0-20.34-15.19-37.094-34.838-39.632zM208.022 816.038v-184.040h183.978v184.040h-183.978zM437.162 128.4c-1.694-0.216-3.408-0.37-5.162-0.37h-263.978c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v263.968c0 22.094 17.91 40 40 40h263.978c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-263.972c0-20.342-15.19-37.096-34.838-39.632zM208.022 392v-183.968h183.978v183.968h-183.978zM861.212 552.368c-1.694-0.216-3.408-0.37-5.162-0.37h-264.050c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v264.040c0 22.094 17.91 40 40 40h264.048c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-264.044c0.002-20.34-15.19-37.094-34.836-39.632zM632 816.038v-184.040h184.048v184.040h-184.048zM861.212 128.4c-1.694-0.216-3.408-0.37-5.162-0.37h-264.050c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v263.968c0 22.094 17.91 40 40 40h264.048c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-263.972c0.002-20.342-15.19-37.096-34.836-39.632zM632 392v-183.968h184.048v183.968h-184.048z"
-                    />
-                  </svg>
-                </button>
-              </div>
-              <div
-                class="emotion-21"
-              >
-                <span
-                  class="emotion-17"
-                >
-                  <button
-                    class="emotion-2"
-                    title="Go full screen"
-                  >
-                    <svg
-                      class="emotion-1"
-                      viewBox="0 0 1024 1024"
-                    >
-                      <path
-                        class="emotion-0"
-                        d="M959.688 920.068l0.31-176c0.040-22.094-17.84-40.032-39.93-40.070-22.092-0.040-40.032 17.838-40.070 39.93l-0.142 79.672-235.734-235.732c-15.622-15.622-40.948-15.622-56.57 0s-15.622 40.948 0 56.568l235.442 235.442-78.946-0.1c-22.092-0.028-40.022 17.86-40.050 39.952-0.014 11.064 4.464 21.084 11.714 28.334 7.228 7.224 17.208 11.702 28.236 11.714l175.688 0.22c22.086 0.028 40.014-17.846 40.052-39.93zM920.178 64.228l-176-0.308c-22.094-0.040-40.032 17.84-40.070 39.93-0.040 22.092 17.838 40.032 39.93 40.070l79.672 0.14-235.732 235.734c-15.622 15.622-15.622 40.948 0 56.568s40.948 15.622 56.568 0l235.442-235.442-0.1 78.946c-0.028 22.092 17.86 40.022 39.952 40.050 11.064 0.014 21.084-4.464 28.334-11.714 7.224-7.228 11.702-17.208 11.714-28.236l0.22-175.688c0.026-22.082-17.846-40.010-39.93-40.050zM64.236 103.742l-0.308 176c-0.040 22.094 17.84 40.032 39.93 40.070 22.092 0.040 40.032-17.84 40.070-39.93l0.14-79.672 235.734 235.73c15.622 15.622 40.948 15.622 56.568 0s15.622-40.946 0-56.566l-235.442-235.442 78.946 0.098c22.092 0.028 40.022-17.86 40.050-39.95 0.014-11.066-4.464-21.086-11.714-28.336-7.228-7.222-17.208-11.7-28.236-11.714l-175.688-0.218c-22.084-0.026-40.012 17.844-40.050 39.93zM103.748 959.766l176 0.308c22.094 0.040 40.032-17.84 40.070-39.93 0.040-22.092-17.84-40.032-39.93-40.070l-79.672-0.14 235.73-235.734c15.622-15.622 15.622-40.948 0-56.568s-40.946-15.622-56.566 0l-235.442 235.442 0.098-78.946c0.028-22.092-17.86-40.022-39.95-40.050-11.066-0.014-21.086 4.464-28.336 11.714-7.222 7.228-11.7 17.208-11.714 28.236l-0.218 175.688c-0.026 22.082 17.844 40.010 39.93 40.050z"
-                      />
-                    </svg>
-                  </button>
-                </span>
-                <button
-                  class="emotion-2"
-                >
-                  <svg
-                    class="emotion-1"
-                    viewBox="0 0 1024 1024"
-                  >
-                    <path
-                      class="emotion-0"
-                      d="M896.006 920c0 22.090-17.91 40-40 40h-688.006c-22.090 0-40-17.906-40-40v-549.922c-0.838-3.224-1.33-6.588-1.33-10.072 0-22.090 17.908-40.004 40-40.004h178.66c22.092 0.004 40 17.914 40 40.004 0 22.088-17.908 40-40 40h-137.33v479.996h607.998v-479.996h-138.658c-22.090 0-40-17.912-40-40 0-22.090 17.906-40.004 40-40.004h178.658c22.090 0 40 17.91 40 40v559.844c0 0.050 0.008 0.102 0.008 0.154zM665.622 200.168l-124.452-124.45c-8.042-8.042-18.65-11.912-29.186-11.674-1.612-0.034-3.222 0-4.828 0.16-0.558 0.054-1.098 0.16-1.648 0.238-0.742 0.104-1.484 0.192-2.218 0.338-0.656 0.13-1.29 0.31-1.934 0.472-0.622 0.154-1.244 0.292-1.86 0.476-0.64 0.196-1.258 0.436-1.886 0.66-0.602 0.216-1.208 0.414-1.802 0.66-0.598 0.248-1.17 0.54-1.754 0.814-0.598 0.282-1.202 0.546-1.788 0.86-0.578 0.312-1.13 0.664-1.694 1-0.552 0.332-1.116 0.644-1.654 1.006-0.67 0.448-1.3 0.942-1.942 1.426-0.394 0.302-0.806 0.576-1.196 0.894-1.046 0.858-2.052 1.768-3.008 2.726l-124.398 124.39c-15.622 15.62-15.618 40.948 0.002 56.57 15.622 15.62 40.95 15.62 56.568 0l56.164-56.166v439.426c0 22.094 17.912 40 40.002 40 22.092 0 40-17.91 40-40v-441.202l57.942 57.942c15.622 15.624 40.948 15.62 56.568 0 15.626-15.618 15.626-40.946 0.002-56.566z"
-                    />
-                  </svg>
-                </button>
-              </div>
-            </div>
-          </div>
-        </div>
+            <path
+              class="emotion-0"
+              d="M220 670a316 316 0 0 1 0-450 316 316 0 0 1 450 0 316 316 0 0 1 0 450 316 316 0 0 1-450 0zm749 240L757 698a402 402 0 1 0-59 59l212 212a42 42 0 0 0 59-59zM487 604a42 42 0 0 1-84 0V487H286a42 42 0 1 1 0-84h117V286a42 42 0 1 1 84 0v117h117a42 42 0 0 1 0 84H487v117z"
+            />
+          </svg>
+        </button>
+        <button
+          class="emotion-2"
+          title="Zoom out"
+        >
+          <svg
+            class="emotion-1"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-0"
+              d="M757 698a402 402 0 1 0-59 59l212 212a42 42 0 0 0 59-59L757 698zM126 445a316 316 0 0 1 319-319 316 316 0 0 1 318 319 316 316 0 0 1-318 318 316 316 0 0 1-319-318zm160 42a42 42 0 1 1 0-84h318a42 42 0 0 1 0 84H286z"
+            />
+          </svg>
+        </button>
+        <button
+          class="emotion-2"
+          title="Reset zoom"
+        >
+          <svg
+            class="emotion-1"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-0"
+              d="M148 560a318 318 0 0 0 522 110 316 316 0 0 0 0-450 316 316 0 0 0-450 0c-11 11-21 22-30 34v4h47c25 0 46 21 46 46s-21 45-46 45H90c-13 0-25-6-33-14-9-9-14-20-14-33V156c0-25 20-45 45-45s45 20 45 45v32l1 1a401 401 0 0 1 623 509l212 212a42 42 0 0 1-59 59L698 757A401 401 0 0 1 65 570a42 42 0 0 1 83-10z"
+            />
+          </svg>
+        </button>
+        <span
+          class="emotion-9"
+        />
+        <button
+          class="emotion-2"
+          title="Toggle background grid"
+        >
+          <svg
+            class="emotion-1"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-0"
+              d="M437.162 552.368c-1.694-0.216-3.408-0.37-5.162-0.37h-263.978c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v264.040c0 22.094 17.91 40 40 40h263.978c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-264.044c0-20.34-15.19-37.094-34.838-39.632zM208.022 816.038v-184.040h183.978v184.040h-183.978zM437.162 128.4c-1.694-0.216-3.408-0.37-5.162-0.37h-263.978c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v263.968c0 22.094 17.91 40 40 40h263.978c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-263.972c0-20.342-15.19-37.096-34.838-39.632zM208.022 392v-183.968h183.978v183.968h-183.978zM861.212 552.368c-1.694-0.216-3.408-0.37-5.162-0.37h-264.050c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v264.040c0 22.094 17.91 40 40 40h264.048c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-264.044c0.002-20.34-15.19-37.094-34.836-39.632zM632 816.038v-184.040h184.048v184.040h-184.048zM861.212 128.4c-1.694-0.216-3.408-0.37-5.162-0.37h-264.050c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v263.968c0 22.094 17.91 40 40 40h264.048c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-263.972c0.002-20.342-15.19-37.096-34.836-39.632zM632 392v-183.968h184.048v183.968h-184.048z"
+            />
+          </svg>
+        </button>
       </div>
       <div
-        class="simplebar-placeholder"
-      />
-    </div>
-    <div
-      class="simplebar-track simplebar-horizontal"
-    >
-      <div
-        class="simplebar-scrollbar"
-      />
-    </div>
-    <div
-      class="simplebar-track simplebar-vertical"
-    >
-      <div
-        class="simplebar-scrollbar"
-      />
+        class="emotion-21"
+      >
+        <span
+          class="emotion-17"
+        >
+          <button
+            class="emotion-2"
+            title="Go full screen"
+          >
+            <svg
+              class="emotion-1"
+              viewBox="0 0 1024 1024"
+            >
+              <path
+                class="emotion-0"
+                d="M959.688 920.068l0.31-176c0.040-22.094-17.84-40.032-39.93-40.070-22.092-0.040-40.032 17.838-40.070 39.93l-0.142 79.672-235.734-235.732c-15.622-15.622-40.948-15.622-56.57 0s-15.622 40.948 0 56.568l235.442 235.442-78.946-0.1c-22.092-0.028-40.022 17.86-40.050 39.952-0.014 11.064 4.464 21.084 11.714 28.334 7.228 7.224 17.208 11.702 28.236 11.714l175.688 0.22c22.086 0.028 40.014-17.846 40.052-39.93zM920.178 64.228l-176-0.308c-22.094-0.040-40.032 17.84-40.070 39.93-0.040 22.092 17.838 40.032 39.93 40.070l79.672 0.14-235.732 235.734c-15.622 15.622-15.622 40.948 0 56.568s40.948 15.622 56.568 0l235.442-235.442-0.1 78.946c-0.028 22.092 17.86 40.022 39.952 40.050 11.064 0.014 21.084-4.464 28.334-11.714 7.224-7.228 11.702-17.208 11.714-28.236l0.22-175.688c0.026-22.082-17.846-40.010-39.93-40.050zM64.236 103.742l-0.308 176c-0.040 22.094 17.84 40.032 39.93 40.070 22.092 0.040 40.032-17.84 40.070-39.93l0.14-79.672 235.734 235.73c15.622 15.622 40.948 15.622 56.568 0s15.622-40.946 0-56.566l-235.442-235.442 78.946 0.098c22.092 0.028 40.022-17.86 40.050-39.95 0.014-11.066-4.464-21.086-11.714-28.336-7.228-7.222-17.208-11.7-28.236-11.714l-175.688-0.218c-22.084-0.026-40.012 17.844-40.050 39.93zM103.748 959.766l176 0.308c22.094 0.040 40.032-17.84 40.070-39.93 0.040-22.092-17.84-40.032-39.93-40.070l-79.672-0.14 235.73-235.734c15.622-15.622 15.622-40.948 0-56.568s-40.946-15.622-56.566 0l-235.442 235.442 0.098-78.946c0.028-22.092-17.86-40.022-39.95-40.050-11.066-0.014-21.086 4.464-28.336 11.714-7.222 7.228-11.7 17.208-11.714 28.236l-0.218 175.688c-0.026 22.082 17.844 40.010 39.93 40.050z"
+              />
+            </svg>
+          </button>
+        </span>
+        <button
+          class="emotion-2"
+        >
+          <svg
+            class="emotion-1"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-0"
+              d="M896.006 920c0 22.090-17.91 40-40 40h-688.006c-22.090 0-40-17.906-40-40v-549.922c-0.838-3.224-1.33-6.588-1.33-10.072 0-22.090 17.908-40.004 40-40.004h178.66c22.092 0.004 40 17.914 40 40.004 0 22.088-17.908 40-40 40h-137.33v479.996h607.998v-479.996h-138.658c-22.090 0-40-17.912-40-40 0-22.090 17.906-40.004 40-40.004h178.658c22.090 0 40 17.91 40 40v559.844c0 0.050 0.008 0.102 0.008 0.154zM665.622 200.168l-124.452-124.45c-8.042-8.042-18.65-11.912-29.186-11.674-1.612-0.034-3.222 0-4.828 0.16-0.558 0.054-1.098 0.16-1.648 0.238-0.742 0.104-1.484 0.192-2.218 0.338-0.656 0.13-1.29 0.31-1.934 0.472-0.622 0.154-1.244 0.292-1.86 0.476-0.64 0.196-1.258 0.436-1.886 0.66-0.602 0.216-1.208 0.414-1.802 0.66-0.598 0.248-1.17 0.54-1.754 0.814-0.598 0.282-1.202 0.546-1.788 0.86-0.578 0.312-1.13 0.664-1.694 1-0.552 0.332-1.116 0.644-1.654 1.006-0.67 0.448-1.3 0.942-1.942 1.426-0.394 0.302-0.806 0.576-1.196 0.894-1.046 0.858-2.052 1.768-3.008 2.726l-124.398 124.39c-15.622 15.62-15.618 40.948 0.002 56.57 15.622 15.62 40.95 15.62 56.568 0l56.164-56.166v439.426c0 22.094 17.912 40 40.002 40 22.092 0 40-17.91 40-40v-441.202l57.942 57.942c15.622 15.624 40.948 15.62 56.568 0 15.626-15.618 15.626-40.946 0.002-56.566z"
+            />
+          </svg>
+        </button>
+      </div>
     </div>
   </div>,
   .emotion-2 {
@@ -365,12 +374,7 @@ Array [
   -ms-flex-pack: justify;
   justify-content: space-between;
   position: relative;
-  -webkit-flex-wrap: nowrap;
-  -ms-flex-wrap: nowrap;
-  flex-wrap: nowrap;
-  -webkit-flex-shrink: 0;
-  -ms-flex-negative: 0;
-  flex-shrink: 0;
+  white-space: nowrap;
   height: 40px;
 }
 
@@ -379,7 +383,6 @@ Array [
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  white-space: nowrap;
   -webkit-flex-basis: auto;
   -ms-flex-preferred-size: auto;
   flex-basis: auto;
@@ -495,7 +498,6 @@ Array [
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  white-space: nowrap;
   -webkit-flex-basis: auto;
   -ms-flex-preferred-size: auto;
   flex-basis: auto;
@@ -522,16 +524,24 @@ Array [
 }
 
 .emotion-29 {
-  overflow-y: hidden;
-  overflow-x: auto;
   color: #999999;
-  width: 100%;
   height: 40px;
-  -webkit-flex-shrink: 0;
-  -ms-flex-negative: 0;
-  flex-shrink: 0;
-  box-shadow: rgba(0,0,0,.1) 0 -1px 0 0 inset;
-  background: #FFFFFF;
+  overflow: auto;
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
   position: absolute;
   left: 0;
   right: 0;
@@ -543,6 +553,55 @@ Array [
   tranform: translateY(0px);
 }
 
+.emotion-29:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
+.emotion-29::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+  display: none;
+}
+
+.emotion-29:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
+}
+
+.emotion-29::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-29::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-29::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
+}
+
 .emotion-8 {
   height: 40px;
   background: none;
@@ -592,176 +651,135 @@ Array [
 
 <div
     class="emotion-29"
-    data-simplebar="true"
   >
     <div
-      class="simplebar-wrapper"
+      class="emotion-28"
     >
       <div
-        class="simplebar-height-auto-observer-wrapper"
+        class="emotion-19"
       >
         <div
-          class="simplebar-height-auto-observer"
-        />
-      </div>
-      <div
-        class="simplebar-mask"
-      >
-        <div
-          class="simplebar-offset"
+          class="emotion-4"
         >
-          <div
-            class="simplebar-content"
+          <a
+            class="emotion-1"
+            href="/?path=/story/string"
           >
-            <div
-              class="emotion-28"
+            <button
+              class="emotion-0"
             >
-              <div
-                class="emotion-19"
-              >
-                <div
-                  class="emotion-4"
-                >
-                  <a
-                    class="emotion-1"
-                    href="/?path=/story/string"
-                  >
-                    <button
-                      class="emotion-0"
-                    >
-                      Canvas
-                    </button>
-                  </a>
-                  <a
-                    class="emotion-1"
-                    href="/?path=/info/string"
-                  >
-                    <button
-                      class="emotion-2"
-                    >
-                      Notes
-                    </button>
-                  </a>
-                </div>
-                <span
-                  class="emotion-5"
-                />
-                <button
-                  class="emotion-8"
-                  title="Zoom in"
-                >
-                  <svg
-                    class="emotion-7"
-                    viewBox="0 0 1024 1024"
-                  >
-                    <path
-                      class="emotion-6"
-                      d="M220 670a316 316 0 0 1 0-450 316 316 0 0 1 450 0 316 316 0 0 1 0 450 316 316 0 0 1-450 0zm749 240L757 698a402 402 0 1 0-59 59l212 212a42 42 0 0 0 59-59zM487 604a42 42 0 0 1-84 0V487H286a42 42 0 1 1 0-84h117V286a42 42 0 1 1 84 0v117h117a42 42 0 0 1 0 84H487v117z"
-                    />
-                  </svg>
-                </button>
-                <button
-                  class="emotion-8"
-                  title="Zoom out"
-                >
-                  <svg
-                    class="emotion-7"
-                    viewBox="0 0 1024 1024"
-                  >
-                    <path
-                      class="emotion-6"
-                      d="M757 698a402 402 0 1 0-59 59l212 212a42 42 0 0 0 59-59L757 698zM126 445a316 316 0 0 1 319-319 316 316 0 0 1 318 319 316 316 0 0 1-318 318 316 316 0 0 1-319-318zm160 42a42 42 0 1 1 0-84h318a42 42 0 0 1 0 84H286z"
-                    />
-                  </svg>
-                </button>
-                <button
-                  class="emotion-8"
-                  title="Reset zoom"
-                >
-                  <svg
-                    class="emotion-7"
-                    viewBox="0 0 1024 1024"
-                  >
-                    <path
-                      class="emotion-6"
-                      d="M148 560a318 318 0 0 0 522 110 316 316 0 0 0 0-450 316 316 0 0 0-450 0c-11 11-21 22-30 34v4h47c25 0 46 21 46 46s-21 45-46 45H90c-13 0-25-6-33-14-9-9-14-20-14-33V156c0-25 20-45 45-45s45 20 45 45v32l1 1a401 401 0 0 1 623 509l212 212a42 42 0 0 1-59 59L698 757A401 401 0 0 1 65 570a42 42 0 0 1 83-10z"
-                    />
-                  </svg>
-                </button>
-                <span
-                  class="emotion-5"
-                />
-                <button
-                  class="emotion-8"
-                  title="Toggle background grid"
-                >
-                  <svg
-                    class="emotion-7"
-                    viewBox="0 0 1024 1024"
-                  >
-                    <path
-                      class="emotion-6"
-                      d="M437.162 552.368c-1.694-0.216-3.408-0.37-5.162-0.37h-263.978c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v264.040c0 22.094 17.91 40 40 40h263.978c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-264.044c0-20.34-15.19-37.094-34.838-39.632zM208.022 816.038v-184.040h183.978v184.040h-183.978zM437.162 128.4c-1.694-0.216-3.408-0.37-5.162-0.37h-263.978c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v263.968c0 22.094 17.91 40 40 40h263.978c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-263.972c0-20.342-15.19-37.096-34.838-39.632zM208.022 392v-183.968h183.978v183.968h-183.978zM861.212 552.368c-1.694-0.216-3.408-0.37-5.162-0.37h-264.050c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v264.040c0 22.094 17.91 40 40 40h264.048c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-264.044c0.002-20.34-15.19-37.094-34.836-39.632zM632 816.038v-184.040h184.048v184.040h-184.048zM861.212 128.4c-1.694-0.216-3.408-0.37-5.162-0.37h-264.050c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v263.968c0 22.094 17.91 40 40 40h264.048c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-263.972c0.002-20.342-15.19-37.096-34.836-39.632zM632 392v-183.968h184.048v183.968h-184.048z"
-                    />
-                  </svg>
-                </button>
-              </div>
-              <div
-                class="emotion-27"
-              >
-                <span
-                  class="emotion-23"
-                >
-                  <button
-                    class="emotion-8"
-                    title="Go full screen"
-                  >
-                    <svg
-                      class="emotion-7"
-                      viewBox="0 0 1024 1024"
-                    >
-                      <path
-                        class="emotion-6"
-                        d="M959.688 920.068l0.31-176c0.040-22.094-17.84-40.032-39.93-40.070-22.092-0.040-40.032 17.838-40.070 39.93l-0.142 79.672-235.734-235.732c-15.622-15.622-40.948-15.622-56.57 0s-15.622 40.948 0 56.568l235.442 235.442-78.946-0.1c-22.092-0.028-40.022 17.86-40.050 39.952-0.014 11.064 4.464 21.084 11.714 28.334 7.228 7.224 17.208 11.702 28.236 11.714l175.688 0.22c22.086 0.028 40.014-17.846 40.052-39.93zM920.178 64.228l-176-0.308c-22.094-0.040-40.032 17.84-40.070 39.93-0.040 22.092 17.838 40.032 39.93 40.070l79.672 0.14-235.732 235.734c-15.622 15.622-15.622 40.948 0 56.568s40.948 15.622 56.568 0l235.442-235.442-0.1 78.946c-0.028 22.092 17.86 40.022 39.952 40.050 11.064 0.014 21.084-4.464 28.334-11.714 7.224-7.228 11.702-17.208 11.714-28.236l0.22-175.688c0.026-22.082-17.846-40.010-39.93-40.050zM64.236 103.742l-0.308 176c-0.040 22.094 17.84 40.032 39.93 40.070 22.092 0.040 40.032-17.84 40.070-39.93l0.14-79.672 235.734 235.73c15.622 15.622 40.948 15.622 56.568 0s15.622-40.946 0-56.566l-235.442-235.442 78.946 0.098c22.092 0.028 40.022-17.86 40.050-39.95 0.014-11.066-4.464-21.086-11.714-28.336-7.228-7.222-17.208-11.7-28.236-11.714l-175.688-0.218c-22.084-0.026-40.012 17.844-40.050 39.93zM103.748 959.766l176 0.308c22.094 0.040 40.032-17.84 40.070-39.93 0.040-22.092-17.84-40.032-39.93-40.070l-79.672-0.14 235.73-235.734c15.622-15.622 15.622-40.948 0-56.568s-40.946-15.622-56.566 0l-235.442 235.442 0.098-78.946c0.028-22.092-17.86-40.022-39.95-40.050-11.066-0.014-21.086 4.464-28.336 11.714-7.222 7.228-11.7 17.208-11.714 28.236l-0.218 175.688c-0.026 22.082 17.844 40.010 39.93 40.050z"
-                      />
-                    </svg>
-                  </button>
-                </span>
-                <button
-                  class="emotion-8"
-                >
-                  <svg
-                    class="emotion-7"
-                    viewBox="0 0 1024 1024"
-                  >
-                    <path
-                      class="emotion-6"
-                      d="M896.006 920c0 22.090-17.91 40-40 40h-688.006c-22.090 0-40-17.906-40-40v-549.922c-0.838-3.224-1.33-6.588-1.33-10.072 0-22.090 17.908-40.004 40-40.004h178.66c22.092 0.004 40 17.914 40 40.004 0 22.088-17.908 40-40 40h-137.33v479.996h607.998v-479.996h-138.658c-22.090 0-40-17.912-40-40 0-22.090 17.906-40.004 40-40.004h178.658c22.090 0 40 17.91 40 40v559.844c0 0.050 0.008 0.102 0.008 0.154zM665.622 200.168l-124.452-124.45c-8.042-8.042-18.65-11.912-29.186-11.674-1.612-0.034-3.222 0-4.828 0.16-0.558 0.054-1.098 0.16-1.648 0.238-0.742 0.104-1.484 0.192-2.218 0.338-0.656 0.13-1.29 0.31-1.934 0.472-0.622 0.154-1.244 0.292-1.86 0.476-0.64 0.196-1.258 0.436-1.886 0.66-0.602 0.216-1.208 0.414-1.802 0.66-0.598 0.248-1.17 0.54-1.754 0.814-0.598 0.282-1.202 0.546-1.788 0.86-0.578 0.312-1.13 0.664-1.694 1-0.552 0.332-1.116 0.644-1.654 1.006-0.67 0.448-1.3 0.942-1.942 1.426-0.394 0.302-0.806 0.576-1.196 0.894-1.046 0.858-2.052 1.768-3.008 2.726l-124.398 124.39c-15.622 15.62-15.618 40.948 0.002 56.57 15.622 15.62 40.95 15.62 56.568 0l56.164-56.166v439.426c0 22.094 17.912 40 40.002 40 22.092 0 40-17.91 40-40v-441.202l57.942 57.942c15.622 15.624 40.948 15.62 56.568 0 15.626-15.618 15.626-40.946 0.002-56.566z"
-                    />
-                  </svg>
-                </button>
-              </div>
-            </div>
-          </div>
+              Canvas
+            </button>
+          </a>
+          <a
+            class="emotion-1"
+            href="/?path=/info/string"
+          >
+            <button
+              class="emotion-2"
+            >
+              Notes
+            </button>
+          </a>
         </div>
+        <span
+          class="emotion-5"
+        />
+        <button
+          class="emotion-8"
+          title="Zoom in"
+        >
+          <svg
+            class="emotion-7"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-6"
+              d="M220 670a316 316 0 0 1 0-450 316 316 0 0 1 450 0 316 316 0 0 1 0 450 316 316 0 0 1-450 0zm749 240L757 698a402 402 0 1 0-59 59l212 212a42 42 0 0 0 59-59zM487 604a42 42 0 0 1-84 0V487H286a42 42 0 1 1 0-84h117V286a42 42 0 1 1 84 0v117h117a42 42 0 0 1 0 84H487v117z"
+            />
+          </svg>
+        </button>
+        <button
+          class="emotion-8"
+          title="Zoom out"
+        >
+          <svg
+            class="emotion-7"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-6"
+              d="M757 698a402 402 0 1 0-59 59l212 212a42 42 0 0 0 59-59L757 698zM126 445a316 316 0 0 1 319-319 316 316 0 0 1 318 319 316 316 0 0 1-318 318 316 316 0 0 1-319-318zm160 42a42 42 0 1 1 0-84h318a42 42 0 0 1 0 84H286z"
+            />
+          </svg>
+        </button>
+        <button
+          class="emotion-8"
+          title="Reset zoom"
+        >
+          <svg
+            class="emotion-7"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-6"
+              d="M148 560a318 318 0 0 0 522 110 316 316 0 0 0 0-450 316 316 0 0 0-450 0c-11 11-21 22-30 34v4h47c25 0 46 21 46 46s-21 45-46 45H90c-13 0-25-6-33-14-9-9-14-20-14-33V156c0-25 20-45 45-45s45 20 45 45v32l1 1a401 401 0 0 1 623 509l212 212a42 42 0 0 1-59 59L698 757A401 401 0 0 1 65 570a42 42 0 0 1 83-10z"
+            />
+          </svg>
+        </button>
+        <span
+          class="emotion-5"
+        />
+        <button
+          class="emotion-8"
+          title="Toggle background grid"
+        >
+          <svg
+            class="emotion-7"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-6"
+              d="M437.162 552.368c-1.694-0.216-3.408-0.37-5.162-0.37h-263.978c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v264.040c0 22.094 17.91 40 40 40h263.978c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-264.044c0-20.34-15.19-37.094-34.838-39.632zM208.022 816.038v-184.040h183.978v184.040h-183.978zM437.162 128.4c-1.694-0.216-3.408-0.37-5.162-0.37h-263.978c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v263.968c0 22.094 17.91 40 40 40h263.978c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-263.972c0-20.342-15.19-37.096-34.838-39.632zM208.022 392v-183.968h183.978v183.968h-183.978zM861.212 552.368c-1.694-0.216-3.408-0.37-5.162-0.37h-264.050c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v264.040c0 22.094 17.91 40 40 40h264.048c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-264.044c0.002-20.34-15.19-37.094-34.836-39.632zM632 816.038v-184.040h184.048v184.040h-184.048zM861.212 128.4c-1.694-0.216-3.408-0.37-5.162-0.37h-264.050c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v263.968c0 22.094 17.91 40 40 40h264.048c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-263.972c0.002-20.342-15.19-37.096-34.836-39.632zM632 392v-183.968h184.048v183.968h-184.048z"
+            />
+          </svg>
+        </button>
       </div>
       <div
-        class="simplebar-placeholder"
-      />
-    </div>
-    <div
-      class="simplebar-track simplebar-horizontal"
-    >
-      <div
-        class="simplebar-scrollbar"
-      />
-    </div>
-    <div
-      class="simplebar-track simplebar-vertical"
-    >
-      <div
-        class="simplebar-scrollbar"
-      />
+        class="emotion-27"
+      >
+        <span
+          class="emotion-23"
+        >
+          <button
+            class="emotion-8"
+            title="Go full screen"
+          >
+            <svg
+              class="emotion-7"
+              viewBox="0 0 1024 1024"
+            >
+              <path
+                class="emotion-6"
+                d="M959.688 920.068l0.31-176c0.040-22.094-17.84-40.032-39.93-40.070-22.092-0.040-40.032 17.838-40.070 39.93l-0.142 79.672-235.734-235.732c-15.622-15.622-40.948-15.622-56.57 0s-15.622 40.948 0 56.568l235.442 235.442-78.946-0.1c-22.092-0.028-40.022 17.86-40.050 39.952-0.014 11.064 4.464 21.084 11.714 28.334 7.228 7.224 17.208 11.702 28.236 11.714l175.688 0.22c22.086 0.028 40.014-17.846 40.052-39.93zM920.178 64.228l-176-0.308c-22.094-0.040-40.032 17.84-40.070 39.93-0.040 22.092 17.838 40.032 39.93 40.070l79.672 0.14-235.732 235.734c-15.622 15.622-15.622 40.948 0 56.568s40.948 15.622 56.568 0l235.442-235.442-0.1 78.946c-0.028 22.092 17.86 40.022 39.952 40.050 11.064 0.014 21.084-4.464 28.334-11.714 7.224-7.228 11.702-17.208 11.714-28.236l0.22-175.688c0.026-22.082-17.846-40.010-39.93-40.050zM64.236 103.742l-0.308 176c-0.040 22.094 17.84 40.032 39.93 40.070 22.092 0.040 40.032-17.84 40.070-39.93l0.14-79.672 235.734 235.73c15.622 15.622 40.948 15.622 56.568 0s15.622-40.946 0-56.566l-235.442-235.442 78.946 0.098c22.092 0.028 40.022-17.86 40.050-39.95 0.014-11.066-4.464-21.086-11.714-28.336-7.228-7.222-17.208-11.7-28.236-11.714l-175.688-0.218c-22.084-0.026-40.012 17.844-40.050 39.93zM103.748 959.766l176 0.308c22.094 0.040 40.032-17.84 40.070-39.93 0.040-22.092-17.84-40.032-39.93-40.070l-79.672-0.14 235.73-235.734c15.622-15.622 15.622-40.948 0-56.568s-40.946-15.622-56.566 0l-235.442 235.442 0.098-78.946c0.028-22.092-17.86-40.022-39.95-40.050-11.066-0.014-21.086 4.464-28.336 11.714-7.222 7.228-11.7 17.208-11.714 28.236l-0.218 175.688c-0.026 22.082 17.844 40.010 39.93 40.050z"
+              />
+            </svg>
+          </button>
+        </span>
+        <button
+          class="emotion-8"
+        >
+          <svg
+            class="emotion-7"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-6"
+              d="M896.006 920c0 22.090-17.91 40-40 40h-688.006c-22.090 0-40-17.906-40-40v-549.922c-0.838-3.224-1.33-6.588-1.33-10.072 0-22.090 17.908-40.004 40-40.004h178.66c22.092 0.004 40 17.914 40 40.004 0 22.088-17.908 40-40 40h-137.33v479.996h607.998v-479.996h-138.658c-22.090 0-40-17.912-40-40 0-22.090 17.906-40.004 40-40.004h178.658c22.090 0 40 17.91 40 40v559.844c0 0.050 0.008 0.102 0.008 0.154zM665.622 200.168l-124.452-124.45c-8.042-8.042-18.65-11.912-29.186-11.674-1.612-0.034-3.222 0-4.828 0.16-0.558 0.054-1.098 0.16-1.648 0.238-0.742 0.104-1.484 0.192-2.218 0.338-0.656 0.13-1.29 0.31-1.934 0.472-0.622 0.154-1.244 0.292-1.86 0.476-0.64 0.196-1.258 0.436-1.886 0.66-0.602 0.216-1.208 0.414-1.802 0.66-0.598 0.248-1.17 0.54-1.754 0.814-0.598 0.282-1.202 0.546-1.788 0.86-0.578 0.312-1.13 0.664-1.694 1-0.552 0.332-1.116 0.644-1.654 1.006-0.67 0.448-1.3 0.942-1.942 1.426-0.394 0.302-0.806 0.576-1.196 0.894-1.046 0.858-2.052 1.768-3.008 2.726l-124.398 124.39c-15.622 15.62-15.618 40.948 0.002 56.57 15.622 15.62 40.95 15.62 56.568 0l56.164-56.166v439.426c0 22.094 17.912 40 40.002 40 22.092 0 40-17.91 40-40v-441.202l57.942 57.942c15.622 15.624 40.948 15.62 56.568 0 15.626-15.618 15.626-40.946 0.002-56.566z"
+            />
+          </svg>
+        </button>
+      </div>
     </div>
   </div>,
   .emotion-2 {
diff --git a/lib/ui/src/settings/__snapshots__/about.stories.storyshot b/lib/ui/src/settings/__snapshots__/about.stories.storyshot
index 604adef4e1f..bc9c8ce2487 100644
--- a/lib/ui/src/settings/__snapshots__/about.stories.storyshot
+++ b/lib/ui/src/settings/__snapshots__/about.stories.storyshot
@@ -15,16 +15,73 @@ exports[`Storyshots UI|Settings/AboutScreen failed to fetch new version 1`] = `
 }
 
 .emotion-8 {
-  overflow-y: hidden;
-  overflow-x: auto;
   color: #999999;
-  width: 100%;
   height: 40px;
-  -webkit-flex-shrink: 0;
-  -ms-flex-negative: 0;
-  flex-shrink: 0;
-  box-shadow: rgba(0,0,0,.1) 0 -1px 0 0 inset;
-  background: #FFFFFF;
+  overflow: auto;
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-8:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
+.emotion-8::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+  display: none;
+}
+
+.emotion-8:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
+}
+
+.emotion-8::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-8::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-8::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
 }
 
 .emotion-7 {
@@ -37,12 +94,7 @@ exports[`Storyshots UI|Settings/AboutScreen failed to fetch new version 1`] = `
   -ms-flex-pack: justify;
   justify-content: space-between;
   position: relative;
-  -webkit-flex-wrap: nowrap;
-  -ms-flex-wrap: nowrap;
-  flex-wrap: nowrap;
-  -webkit-flex-shrink: 0;
-  -ms-flex-negative: 0;
-  flex-shrink: 0;
+  white-space: nowrap;
   height: 40px;
 }
 
@@ -51,7 +103,6 @@ exports[`Storyshots UI|Settings/AboutScreen failed to fetch new version 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  white-space: nowrap;
   -webkit-flex-basis: auto;
   -ms-flex-preferred-size: auto;
   flex-basis: auto;
@@ -122,7 +173,6 @@ exports[`Storyshots UI|Settings/AboutScreen failed to fetch new version 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  white-space: nowrap;
   -webkit-flex-basis: auto;
   -ms-flex-preferred-size: auto;
   flex-basis: auto;
@@ -152,23 +202,12 @@ exports[`Storyshots UI|Settings/AboutScreen failed to fetch new version 1`] = `
   display: block;
   position: relative;
   font-size: 13px;
-  height: calc(100% - 40px);
-  position: absolute;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  top: 40px;
-  overflow: auto;
-}
-
-.emotion-25 > *:first-child {
-  position: absolute;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  top: 0;
-  height: 100%;
+  position: relative;
   overflow: auto;
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  width: 100%;
 }
 
 .emotion-5 {
@@ -375,84 +414,43 @@ exports[`Storyshots UI|Settings/AboutScreen failed to fetch new version 1`] = `
 >
   <div
     class="emotion-8"
-    data-simplebar="true"
   >
     <div
-      class="simplebar-wrapper"
+      class="emotion-7"
     >
       <div
-        class="simplebar-height-auto-observer-wrapper"
+        class="emotion-2"
       >
         <div
-          class="simplebar-height-auto-observer"
-        />
-      </div>
-      <div
-        class="simplebar-mask"
-      >
-        <div
-          class="simplebar-offset"
+          class="emotion-1"
+          role="tablist"
         >
-          <div
-            class="simplebar-content"
+          <button
+            class="emotion-0"
+            role="tab"
+            type="button"
           >
-            <div
-              class="emotion-7"
-            >
-              <div
-                class="emotion-2"
-              >
-                <div
-                  class="emotion-1"
-                  role="tablist"
-                >
-                  <button
-                    class="emotion-0"
-                    role="tab"
-                    type="button"
-                  >
-                    About
-                  </button>
-                </div>
-              </div>
-              <div
-                class="emotion-6"
-              >
-                <button
-                  class="emotion-5"
-                >
-                  <svg
-                    class="emotion-4"
-                    viewBox="0 0 1024 1024"
-                  >
-                    <path
-                      class="emotion-3"
-                      d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
-                    />
-                  </svg>
-                </button>
-              </div>
-            </div>
-          </div>
+            About
+          </button>
         </div>
       </div>
       <div
-        class="simplebar-placeholder"
-      />
-    </div>
-    <div
-      class="simplebar-track simplebar-horizontal"
-    >
-      <div
-        class="simplebar-scrollbar"
-      />
-    </div>
-    <div
-      class="simplebar-track simplebar-vertical"
-    >
-      <div
-        class="simplebar-scrollbar"
-      />
+        class="emotion-6"
+      >
+        <button
+          class="emotion-5"
+        >
+          <svg
+            class="emotion-4"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-3"
+              d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
+            />
+          </svg>
+        </button>
+      </div>
     </div>
   </div>
   <div
@@ -584,16 +582,73 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
 }
 
 .emotion-8 {
-  overflow-y: hidden;
-  overflow-x: auto;
   color: #999999;
-  width: 100%;
   height: 40px;
-  -webkit-flex-shrink: 0;
-  -ms-flex-negative: 0;
-  flex-shrink: 0;
-  box-shadow: rgba(0,0,0,.1) 0 -1px 0 0 inset;
-  background: #FFFFFF;
+  overflow: auto;
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-8:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
+.emotion-8::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+  display: none;
+}
+
+.emotion-8:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
+}
+
+.emotion-8::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-8::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-8::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
 }
 
 .emotion-7 {
@@ -606,12 +661,7 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   -ms-flex-pack: justify;
   justify-content: space-between;
   position: relative;
-  -webkit-flex-wrap: nowrap;
-  -ms-flex-wrap: nowrap;
-  flex-wrap: nowrap;
-  -webkit-flex-shrink: 0;
-  -ms-flex-negative: 0;
-  flex-shrink: 0;
+  white-space: nowrap;
   height: 40px;
 }
 
@@ -620,7 +670,6 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  white-space: nowrap;
   -webkit-flex-basis: auto;
   -ms-flex-preferred-size: auto;
   flex-basis: auto;
@@ -691,7 +740,6 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  white-space: nowrap;
   -webkit-flex-basis: auto;
   -ms-flex-preferred-size: auto;
   flex-basis: auto;
@@ -721,23 +769,12 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   display: block;
   position: relative;
   font-size: 13px;
-  height: calc(100% - 40px);
-  position: absolute;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  top: 40px;
-  overflow: auto;
-}
-
-.emotion-41 > *:first-child {
-  position: absolute;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  top: 0;
-  height: 100%;
+  position: relative;
   overflow: auto;
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  width: 100%;
 }
 
 .emotion-5 {
@@ -1016,6 +1053,7 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
 .emotion-17 pre.hljs {
   padding: 15px;
   margin: 0;
+  overflow: auto;
   white-space: pre-wrap;
   color: #333333;
   font-size: 13px;
@@ -1431,9 +1469,8 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
 }
 
 .emotion-20 {
-  overflow-y: auto;
-  overflow-x: auto;
   position: relative;
+  overflow: auto;
 }
 
 .emotion-20 code {
@@ -1661,84 +1698,43 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
 >
   <div
     class="emotion-8"
-    data-simplebar="true"
   >
     <div
-      class="simplebar-wrapper"
+      class="emotion-7"
     >
       <div
-        class="simplebar-height-auto-observer-wrapper"
+        class="emotion-2"
       >
         <div
-          class="simplebar-height-auto-observer"
-        />
-      </div>
-      <div
-        class="simplebar-mask"
-      >
-        <div
-          class="simplebar-offset"
+          class="emotion-1"
+          role="tablist"
         >
-          <div
-            class="simplebar-content"
+          <button
+            class="emotion-0"
+            role="tab"
+            type="button"
           >
-            <div
-              class="emotion-7"
-            >
-              <div
-                class="emotion-2"
-              >
-                <div
-                  class="emotion-1"
-                  role="tablist"
-                >
-                  <button
-                    class="emotion-0"
-                    role="tab"
-                    type="button"
-                  >
-                    About
-                  </button>
-                </div>
-              </div>
-              <div
-                class="emotion-6"
-              >
-                <button
-                  class="emotion-5"
-                >
-                  <svg
-                    class="emotion-4"
-                    viewBox="0 0 1024 1024"
-                  >
-                    <path
-                      class="emotion-3"
-                      d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
-                    />
-                  </svg>
-                </button>
-              </div>
-            </div>
-          </div>
+            About
+          </button>
         </div>
       </div>
       <div
-        class="simplebar-placeholder"
-      />
-    </div>
-    <div
-      class="simplebar-track simplebar-horizontal"
-    >
-      <div
-        class="simplebar-scrollbar"
-      />
-    </div>
-    <div
-      class="simplebar-track simplebar-vertical"
-    >
-      <div
-        class="simplebar-scrollbar"
-      />
+        class="emotion-6"
+      >
+        <button
+          class="emotion-5"
+        >
+          <svg
+            class="emotion-4"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-3"
+              d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
+            />
+          </svg>
+        </button>
+      </div>
     </div>
   </div>
   <div
@@ -1857,69 +1853,28 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
             >
               <div
                 class="emotion-20"
-                data-simplebar="true"
               >
-                <div
-                  class="simplebar-wrapper"
+                <pre
+                  class="hljs emotion-19"
                 >
-                  <div
-                    class="simplebar-height-auto-observer-wrapper"
+                  <code
+                    class="emotion-18"
                   >
-                    <div
-                      class="simplebar-height-auto-observer"
-                    />
-                  </div>
-                  <div
-                    class="simplebar-mask"
-                  >
-                    <div
-                      class="simplebar-offset"
+                    npx npm-check-updates 
+                    <span
+                      class="token string"
                     >
-                      <div
-                        class="simplebar-content"
-                      >
-                        <pre
-                          class="hljs emotion-19"
-                        >
-                          <code
-                            class="emotion-18"
-                          >
-                            npx npm-check-updates 
-                            <span
-                              class="token string"
-                            >
-                              '/storybook/'
-                            </span>
-                             -u 
-                            <span
-                              class="token operator"
-                            >
-                              &&
-                            </span>
-                             yarn
-                          </code>
-                        </pre>
-                      </div>
-                    </div>
-                  </div>
-                  <div
-                    class="simplebar-placeholder"
-                  />
-                </div>
-                <div
-                  class="simplebar-track simplebar-horizontal"
-                >
-                  <div
-                    class="simplebar-scrollbar"
-                  />
-                </div>
-                <div
-                  class="simplebar-track simplebar-vertical"
-                >
-                  <div
-                    class="simplebar-scrollbar"
-                  />
-                </div>
+                      '/storybook/'
+                    </span>
+                     -u 
+                    <span
+                      class="token operator"
+                    >
+                      &&
+                    </span>
+                     yarn
+                  </code>
+                </pre>
               </div>
               <div
                 class="emotion-22"
@@ -1939,57 +1894,16 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
             >
               <div
                 class="emotion-20"
-                data-simplebar="true"
               >
-                <div
-                  class="simplebar-wrapper"
+                <pre
+                  class="hljs emotion-19"
                 >
-                  <div
-                    class="simplebar-height-auto-observer-wrapper"
+                  <code
+                    class="emotion-18"
                   >
-                    <div
-                      class="simplebar-height-auto-observer"
-                    />
-                  </div>
-                  <div
-                    class="simplebar-mask"
-                  >
-                    <div
-                      class="simplebar-offset"
-                    >
-                      <div
-                        class="simplebar-content"
-                      >
-                        <pre
-                          class="hljs emotion-19"
-                        >
-                          <code
-                            class="emotion-18"
-                          >
-                            yarn upgrade-interactive --latest
-                          </code>
-                        </pre>
-                      </div>
-                    </div>
-                  </div>
-                  <div
-                    class="simplebar-placeholder"
-                  />
-                </div>
-                <div
-                  class="simplebar-track simplebar-horizontal"
-                >
-                  <div
-                    class="simplebar-scrollbar"
-                  />
-                </div>
-                <div
-                  class="simplebar-track simplebar-vertical"
-                >
-                  <div
-                    class="simplebar-scrollbar"
-                  />
-                </div>
+                    yarn upgrade-interactive --latest
+                  </code>
+                </pre>
               </div>
               <div
                 class="emotion-22"
@@ -2058,16 +1972,73 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
 }
 
 .emotion-8 {
-  overflow-y: hidden;
-  overflow-x: auto;
   color: #999999;
-  width: 100%;
   height: 40px;
-  -webkit-flex-shrink: 0;
-  -ms-flex-negative: 0;
-  flex-shrink: 0;
-  box-shadow: rgba(0,0,0,.1) 0 -1px 0 0 inset;
-  background: #FFFFFF;
+  overflow: auto;
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-scrollbar-width: slim;
+  -moz-scrollbar-width: slim;
+  -ms-scrollbar-width: slim;
+  scrollbar-width: slim;
+  -webkit-scrollbar-width: 3px;
+  -moz-scrollbar-width: 3px;
+  -ms-scrollbar-width: 3px;
+  scrollbar-width: 3px;
+  -webkit-scrollbar-color: transparent transparent;
+  -moz-scrollbar-color: transparent transparent;
+  -ms-scrollbar-color: transparent transparent;
+  scrollbar-color: transparent transparent;
+  background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
+}
+
+.emotion-8:hover {
+  -webkit-scrollbar-width: none;
+  -moz-scrollbar-width: none;
+  -ms-scrollbar-width: none;
+  scrollbar-width: none;
+  -webkit-scrollbar-width: 0;
+  -moz-scrollbar-width: 0;
+  -ms-scrollbar-width: 0;
+  scrollbar-width: 0;
+}
+
+.emotion-8::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  box-shadow: none;
+  display: none;
+}
+
+.emotion-8:hover::-webkit-scrollbar {
+  height: 3px;
+  width: 3px;
+  background: transparent;
+  display: block;
+}
+
+.emotion-8::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: transparent;
+  opacity: 0;
+  border: 0 none;
+  box-shadow: none;
+  height: 0;
+  width: 0;
+}
+
+.emotion-8::-webkit-scrollbar-thumb {
+  border-radius: 0;
+  background: rgba(0,0,0,.1);
+  box-shadow: none;
+}
+
+.emotion-8::-webkit-scrollbar-track-piece {
+  display: none;
+  border: 0 none;
+  opacity: 0;
+  visibility: hidden;
 }
 
 .emotion-7 {
@@ -2080,12 +2051,7 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   -ms-flex-pack: justify;
   justify-content: space-between;
   position: relative;
-  -webkit-flex-wrap: nowrap;
-  -ms-flex-wrap: nowrap;
-  flex-wrap: nowrap;
-  -webkit-flex-shrink: 0;
-  -ms-flex-negative: 0;
-  flex-shrink: 0;
+  white-space: nowrap;
   height: 40px;
 }
 
@@ -2094,7 +2060,6 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  white-space: nowrap;
   -webkit-flex-basis: auto;
   -ms-flex-preferred-size: auto;
   flex-basis: auto;
@@ -2165,7 +2130,6 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  white-space: nowrap;
   -webkit-flex-basis: auto;
   -ms-flex-preferred-size: auto;
   flex-basis: auto;
@@ -2195,23 +2159,12 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
   display: block;
   position: relative;
   font-size: 13px;
-  height: calc(100% - 40px);
-  position: absolute;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  top: 40px;
-  overflow: auto;
-}
-
-.emotion-27 > *:first-child {
-  position: absolute;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  top: 0;
-  height: 100%;
+  position: relative;
   overflow: auto;
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  width: 100%;
 }
 
 .emotion-5 {
@@ -2502,6 +2455,7 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
 .emotion-17 pre.hljs {
   padding: 15px;
   margin: 0;
+  overflow: auto;
   white-space: pre-wrap;
   color: #333333;
   font-size: 13px;
@@ -2898,84 +2852,43 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
 >
   <div
     class="emotion-8"
-    data-simplebar="true"
   >
     <div
-      class="simplebar-wrapper"
+      class="emotion-7"
     >
       <div
-        class="simplebar-height-auto-observer-wrapper"
+        class="emotion-2"
       >
         <div
-          class="simplebar-height-auto-observer"
-        />
-      </div>
-      <div
-        class="simplebar-mask"
-      >
-        <div
-          class="simplebar-offset"
+          class="emotion-1"
+          role="tablist"
         >
-          <div
-            class="simplebar-content"
+          <button
+            class="emotion-0"
+            role="tab"
+            type="button"
           >
-            <div
-              class="emotion-7"
-            >
-              <div
-                class="emotion-2"
-              >
-                <div
-                  class="emotion-1"
-                  role="tablist"
-                >
-                  <button
-                    class="emotion-0"
-                    role="tab"
-                    type="button"
-                  >
-                    About
-                  </button>
-                </div>
-              </div>
-              <div
-                class="emotion-6"
-              >
-                <button
-                  class="emotion-5"
-                >
-                  <svg
-                    class="emotion-4"
-                    viewBox="0 0 1024 1024"
-                  >
-                    <path
-                      class="emotion-3"
-                      d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
-                    />
-                  </svg>
-                </button>
-              </div>
-            </div>
-          </div>
+            About
+          </button>
         </div>
       </div>
       <div
-        class="simplebar-placeholder"
-      />
-    </div>
-    <div
-      class="simplebar-track simplebar-horizontal"
-    >
-      <div
-        class="simplebar-scrollbar"
-      />
-    </div>
-    <div
-      class="simplebar-track simplebar-vertical"
-    >
-      <div
-        class="simplebar-scrollbar"
-      />
+        class="emotion-6"
+      >
+        <button
+          class="emotion-5"
+        >
+          <svg
+            class="emotion-4"
+            viewBox="0 0 1024 1024"
+          >
+            <path
+              class="emotion-3"
+              d="M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z"
+            />
+          </svg>
+        </button>
+      </div>
     </div>
   </div>
   <div

From ba0e8abc099058a5287f02112ab803d83f1bc99a Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Tue, 5 Mar 2019 13:43:07 +0800
Subject: [PATCH 145/249] Fix indentatation

---
 .circleci/config.yml | 22 +++++++++++-----------
 1 file changed, 11 insertions(+), 11 deletions(-)

diff --git a/.circleci/config.yml b/.circleci/config.yml
index 33a990d7839..8b63393d015 100644
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -205,20 +205,20 @@ jobs:
     steps:
       - checkout
       - restore_cache:
-        name: Restore core dependencies cache
-        keys:
-          - core-dependencies-v3-{{ checksum "yarn.lock" }}
+          name: Restore core dependencies cache
+          keys:
+            - core-dependencies-v3-{{ checksum "yarn.lock" }}
       - run:
-        name: Install dependencies
-        run: yarn install
+          name: Install dependencies
+          run: yarn install
       - run:
-        name: Trigger build
-        run: ./scripts/build-frontpage.js
+          name: Trigger build
+          run: ./scripts/build-frontpage.js
       - save_cache:
-        name: Cache core dependencies
-        key: core-dependencies-v3-{{ checksum "yarn.lock" }}
-        paths:
-          - ~/.cache/yarn
+          name: Cache core dependencies
+          key: core-dependencies-v3-{{ checksum "yarn.lock" }}
+          paths:
+            - ~/.cache/yarn
   docs:
     <<: *defaults
     steps:

From 80a8fee2f29dbd358264e8d05b150324c9cef3e7 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Tue, 5 Mar 2019 14:03:37 +0800
Subject: [PATCH 146/249] Fix typo

---
 .circleci/config.yml | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/.circleci/config.yml b/.circleci/config.yml
index 8b63393d015..94662b9b9e2 100644
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -210,10 +210,10 @@ jobs:
             - core-dependencies-v3-{{ checksum "yarn.lock" }}
       - run:
           name: Install dependencies
-          run: yarn install
+          command: yarn install
       - run:
           name: Trigger build
-          run: ./scripts/build-frontpage.js
+          command: ./scripts/build-frontpage.js
       - save_cache:
           name: Cache core dependencies
           key: core-dependencies-v3-{{ checksum "yarn.lock" }}

From 345bc9c8c4e5bbd90363f876bdaeb9a46d16e4f4 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Tue, 5 Mar 2019 14:27:51 +0800
Subject: [PATCH 147/249] Hardcode header link

---
 docs/src/components/Header/index.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/docs/src/components/Header/index.js b/docs/src/components/Header/index.js
index 5666958f3dd..27f8e2ea7d5 100644
--- a/docs/src/components/Header/index.js
+++ b/docs/src/components/Header/index.js
@@ -36,9 +36,9 @@ class Header extends React.Component {
       <div id="header" className="row">
         <div className="col-xs-12 col-md-12">
           <div id="header-title" className={titleClassname}>
-            <Link to="/">
+            <a href="https://storybook.js.org/">
               <img className="sb-title" src={storybookLogo} alt="Storybook Logo" />
-            </Link>
+            </a>
           </div>
           <div id="header-links" className="float-right">
             {this.renderSections()}

From caf96305134d54f413255782d85a0e6e0af2f3e1 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Tue, 5 Mar 2019 15:15:21 +0800
Subject: [PATCH 148/249] Update frontpage build trigger to master

---
 scripts/build-frontpage.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/scripts/build-frontpage.js b/scripts/build-frontpage.js
index 77d08b5f994..45a084457e0 100755
--- a/scripts/build-frontpage.js
+++ b/scripts/build-frontpage.js
@@ -6,7 +6,7 @@ const fetch = require('node-fetch');
 const { CIRCLE_BRANCH, FRONTPAGE_WEBHOOK } = process.env;
 
 console.log('build-frontpage');
-if (CIRCLE_BRANCH === 'release/5.0') {
+if (CIRCLE_BRANCH === 'master') {
   if (FRONTPAGE_WEBHOOK) {
     console.log('triggering frontpage build');
     const url = `https://api.netlify.com/build_hooks/${FRONTPAGE_WEBHOOK}`;

From 4bfcf0315ffb77d28332d558fa0fe36e478b62d5 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Tue, 5 Mar 2019 15:27:09 +0800
Subject: [PATCH 149/249] 5.0.0 changelog

---
 CHANGELOG.md | 13 +++++++++++++
 1 file changed, 13 insertions(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index a4467aafee4..1156ff98f61 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,16 @@
+## 5.0.0 (March 5, 2019)
+
+Storybook 5.0 is a completely new UI with the following improvements:
+
+- 🌓 New design with light and dark themes
+- 🛠 Canvas toolbar for easy access to addons
+- 🗺 Overhauled navigation sidebar with an intuitive menu
+- 🗜 Redesigned addons panel with handy buttons to toggle visibility and orientation
+- ⌨️ Improved keyboard shortcuts that are user configurable
+- 🌍 New URL structure that eliminates long strings of query parameters
+
+5.0 contains hundreds more fixes, features, and tweaks. Browse the changelogs matching `5.0.0-alpha.*`, `5.0.0-beta.*`, and `5.0.0-rc.*` for the full list of changes. See [MIGRATION.md](./MIGRATION.md) to ugprade from `4.x`.
+
 ## 5.0.0-rc.11 (March 5, 2019)
 
 ### Bug Fixes

From 670a682de384dca31c4ebc5c61a824f4d241f720 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Tue, 5 Mar 2019 15:44:39 +0800
Subject: [PATCH 150/249] v5.0.0

---
 addons/a11y/package.json                      | 12 ++---
 addons/actions/package.json                   | 10 ++--
 addons/backgrounds/package.json               | 12 ++---
 addons/centered/package.json                  |  2 +-
 addons/cssresources/package.json              | 10 ++--
 addons/events/package.json                    |  8 +--
 addons/google-analytics/package.json          |  6 +--
 addons/graphql/package.json                   |  2 +-
 addons/info/package.json                      | 10 ++--
 addons/jest/package.json                      | 10 ++--
 addons/knobs/package.json                     | 10 ++--
 addons/links/package.json                     |  6 +--
 addons/notes/package.json                     | 12 ++---
 addons/ondevice-backgrounds/package.json      |  4 +-
 addons/ondevice-knobs/package.json            |  4 +-
 addons/ondevice-notes/package.json            |  4 +-
 addons/options/package.json                   |  4 +-
 .../storyshots/storyshots-core/package.json   |  4 +-
 .../storyshots-puppeteer/package.json         |  6 +--
 addons/storysource/package.json               | 10 ++--
 addons/viewport/package.json                  | 12 ++---
 app/angular/package.json                      |  6 +--
 app/ember/package.json                        |  4 +-
 app/html/package.json                         |  4 +-
 app/marko/package.json                        |  4 +-
 app/mithril/package.json                      |  4 +-
 app/polymer/package.json                      |  4 +-
 app/preact/package.json                       |  4 +-
 app/react-native/package.json                 | 14 ++---
 app/react/package.json                        |  8 +--
 app/riot/package.json                         |  4 +-
 app/svelte/package.json                       |  4 +-
 app/vue/package.json                          |  4 +-
 examples/angular-cli/package.json             | 26 ++++-----
 examples/cra-kitchen-sink/package.json        | 32 +++++------
 examples/cra-ts-kitchen-sink/package.json     | 12 ++---
 examples/ember-cli/package.json               | 26 ++++-----
 examples/html-kitchen-sink/package.json       | 36 ++++++-------
 examples/marko-cli/package.json               | 14 ++---
 examples/mithril-kitchen-sink/package.json    | 26 ++++-----
 examples/official-storybook/package.json      | 48 ++++++++---------
 examples/polymer-cli/package.json             | 20 +++----
 examples/preact-kitchen-sink/package.json     | 26 ++++-----
 examples/riot-kitchen-sink/package.json       | 26 ++++-----
 examples/svelte-kitchen-sink/package.json     | 26 ++++-----
 examples/vue-kitchen-sink/package.json        | 26 ++++-----
 lerna.json                                    |  2 +-
 lib/addons/package.json                       |  6 +--
 lib/channel-postmessage/package.json          |  6 +--
 lib/channel-websocket/package.json            |  4 +-
 lib/channels/package.json                     |  2 +-
 lib/cli/package.json                          | 54 +++++++++----------
 lib/client-api/package.json                   | 10 ++--
 lib/client-logger/package.json                |  2 +-
 lib/codemod/package.json                      |  2 +-
 lib/components/package.json                   | 12 ++---
 lib/core-events/package.json                  |  2 +-
 lib/core/package.json                         | 20 +++----
 lib/node-logger/package.json                  |  2 +-
 lib/router/package.json                       |  4 +-
 lib/theming/package.json                      |  4 +-
 lib/ui/package.json                           | 14 ++---
 62 files changed, 356 insertions(+), 356 deletions(-)

diff --git a/addons/a11y/package.json b/addons/a11y/package.json
index 96f215d86f8..9e581bc5dc3 100644
--- a/addons/a11y/package.json
+++ b/addons/a11y/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-a11y",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "a11y addon for storybook",
   "keywords": [
     "a11y",
@@ -25,11 +25,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.11",
-    "@storybook/client-logger": "5.0.0-rc.11",
-    "@storybook/components": "5.0.0-rc.11",
-    "@storybook/core-events": "5.0.0-rc.11",
-    "@storybook/theming": "5.0.0-rc.11",
+    "@storybook/addons": "5.0.0",
+    "@storybook/client-logger": "5.0.0",
+    "@storybook/components": "5.0.0",
+    "@storybook/core-events": "5.0.0",
+    "@storybook/theming": "5.0.0",
     "axe-core": "^3.1.2",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
diff --git a/addons/actions/package.json b/addons/actions/package.json
index a704ac34557..66071ce2c0f 100644
--- a/addons/actions/package.json
+++ b/addons/actions/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-actions",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "Action Logger addon for storybook",
   "keywords": [
     "storybook"
@@ -20,10 +20,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.11",
-    "@storybook/components": "5.0.0-rc.11",
-    "@storybook/core-events": "5.0.0-rc.11",
-    "@storybook/theming": "5.0.0-rc.11",
+    "@storybook/addons": "5.0.0",
+    "@storybook/components": "5.0.0",
+    "@storybook/core-events": "5.0.0",
+    "@storybook/theming": "5.0.0",
     "core-js": "^2.6.2",
     "fast-deep-equal": "^2.0.1",
     "global": "^4.3.2",
diff --git a/addons/backgrounds/package.json b/addons/backgrounds/package.json
index d06101cca11..72cf769b3bc 100644
--- a/addons/backgrounds/package.json
+++ b/addons/backgrounds/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-backgrounds",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "A storybook addon to show different backgrounds for your preview",
   "keywords": [
     "addon",
@@ -24,11 +24,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.11",
-    "@storybook/client-logger": "5.0.0-rc.11",
-    "@storybook/components": "5.0.0-rc.11",
-    "@storybook/core-events": "5.0.0-rc.11",
-    "@storybook/theming": "5.0.0-rc.11",
+    "@storybook/addons": "5.0.0",
+    "@storybook/client-logger": "5.0.0",
+    "@storybook/components": "5.0.0",
+    "@storybook/core-events": "5.0.0",
+    "@storybook/theming": "5.0.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
diff --git a/addons/centered/package.json b/addons/centered/package.json
index 83270bc7a6a..2b0e674b29b 100644
--- a/addons/centered/package.json
+++ b/addons/centered/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-centered",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "Storybook decorator to center components",
   "keywords": [
     "addon",
diff --git a/addons/cssresources/package.json b/addons/cssresources/package.json
index 30823151ea4..279f60c692d 100644
--- a/addons/cssresources/package.json
+++ b/addons/cssresources/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-cssresources",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "A storybook addon to switch between css resources at runtime for your story",
   "keywords": [
     "addon",
@@ -24,10 +24,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.11",
-    "@storybook/channels": "5.0.0-rc.11",
-    "@storybook/components": "5.0.0-rc.11",
-    "@storybook/core-events": "5.0.0-rc.11",
+    "@storybook/addons": "5.0.0",
+    "@storybook/channels": "5.0.0",
+    "@storybook/components": "5.0.0",
+    "@storybook/core-events": "5.0.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "prop-types": "^15.6.2",
diff --git a/addons/events/package.json b/addons/events/package.json
index f64f547bced..6f49192a252 100644
--- a/addons/events/package.json
+++ b/addons/events/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-events",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "Add events to your Storybook stories.",
   "keywords": [
     "addon",
@@ -23,9 +23,9 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.11",
-    "@storybook/core-events": "5.0.0-rc.11",
-    "@storybook/theming": "5.0.0-rc.11",
+    "@storybook/addons": "5.0.0",
+    "@storybook/core-events": "5.0.0",
+    "@storybook/theming": "5.0.0",
     "core-js": "^2.6.2",
     "format-json": "^1.0.3",
     "prop-types": "^15.6.2",
diff --git a/addons/google-analytics/package.json b/addons/google-analytics/package.json
index 3aa4a017561..58d96c90c8f 100644
--- a/addons/google-analytics/package.json
+++ b/addons/google-analytics/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-google-analytics",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "Storybook addon for google analytics",
   "keywords": [
     "addon",
@@ -19,8 +19,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.11",
-    "@storybook/core-events": "5.0.0-rc.11",
+    "@storybook/addons": "5.0.0",
+    "@storybook/core-events": "5.0.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "react-ga": "^2.5.3"
diff --git a/addons/graphql/package.json b/addons/graphql/package.json
index aaed6fffe13..1ddd282504f 100644
--- a/addons/graphql/package.json
+++ b/addons/graphql/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-graphql",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "Storybook addon to display the GraphiQL IDE",
   "keywords": [
     "addon",
diff --git a/addons/info/package.json b/addons/info/package.json
index 4d179b9cd4e..4fd2b605029 100644
--- a/addons/info/package.json
+++ b/addons/info/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-info",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "A Storybook addon to show additional information for your stories.",
   "keywords": [
     "addon",
@@ -21,10 +21,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.11",
-    "@storybook/client-logger": "5.0.0-rc.11",
-    "@storybook/components": "5.0.0-rc.11",
-    "@storybook/theming": "5.0.0-rc.11",
+    "@storybook/addons": "5.0.0",
+    "@storybook/client-logger": "5.0.0",
+    "@storybook/components": "5.0.0",
+    "@storybook/theming": "5.0.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "marksy": "^6.1.0",
diff --git a/addons/jest/package.json b/addons/jest/package.json
index 8067b2697c0..2f7630fdd5a 100644
--- a/addons/jest/package.json
+++ b/addons/jest/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-jest",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "React storybook addon that show component jest report",
   "keywords": [
     "addon",
@@ -27,10 +27,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.11",
-    "@storybook/components": "5.0.0-rc.11",
-    "@storybook/core-events": "5.0.0-rc.11",
-    "@storybook/theming": "5.0.0-rc.11",
+    "@storybook/addons": "5.0.0",
+    "@storybook/components": "5.0.0",
+    "@storybook/core-events": "5.0.0",
+    "@storybook/theming": "5.0.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "prop-types": "^15.6.2",
diff --git a/addons/knobs/package.json b/addons/knobs/package.json
index bdb3f97baff..9387069cca4 100644
--- a/addons/knobs/package.json
+++ b/addons/knobs/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-knobs",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "Storybook Addon Prop Editor Component",
   "keywords": [
     "addon",
@@ -21,10 +21,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.11",
-    "@storybook/components": "5.0.0-rc.11",
-    "@storybook/core-events": "5.0.0-rc.11",
-    "@storybook/theming": "5.0.0-rc.11",
+    "@storybook/addons": "5.0.0",
+    "@storybook/components": "5.0.0",
+    "@storybook/core-events": "5.0.0",
+    "@storybook/theming": "5.0.0",
     "copy-to-clipboard": "^3.0.8",
     "core-js": "^2.6.2",
     "escape-html": "^1.0.3",
diff --git a/addons/links/package.json b/addons/links/package.json
index 720c72dffe9..18037a1d010 100644
--- a/addons/links/package.json
+++ b/addons/links/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-links",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "Story Links addon for storybook",
   "keywords": [
     "addon",
@@ -21,8 +21,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.11",
-    "@storybook/core-events": "5.0.0-rc.11",
+    "@storybook/addons": "5.0.0",
+    "@storybook/core-events": "5.0.0",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/addons/notes/package.json b/addons/notes/package.json
index bf4cb392d50..74c21faa45a 100644
--- a/addons/notes/package.json
+++ b/addons/notes/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-notes",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "Write notes for your Storybook stories.",
   "keywords": [
     "addon",
@@ -22,11 +22,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.11",
-    "@storybook/client-logger": "5.0.0-rc.11",
-    "@storybook/components": "5.0.0-rc.11",
-    "@storybook/core-events": "5.0.0-rc.11",
-    "@storybook/theming": "5.0.0-rc.11",
+    "@storybook/addons": "5.0.0",
+    "@storybook/client-logger": "5.0.0",
+    "@storybook/components": "5.0.0",
+    "@storybook/core-events": "5.0.0",
+    "@storybook/theming": "5.0.0",
     "markdown-to-jsx": "^6.9.1",
     "prop-types": "^15.6.2",
     "util-deprecate": "^1.0.2"
diff --git a/addons/ondevice-backgrounds/package.json b/addons/ondevice-backgrounds/package.json
index 5d4086ce3c9..79ab3a49f0f 100644
--- a/addons/ondevice-backgrounds/package.json
+++ b/addons/ondevice-backgrounds/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/addon-ondevice-backgrounds",
   "private": true,
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "A storybook addon to show different backgrounds for your preview",
   "keywords": [
     "addon",
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.11",
+    "@storybook/addons": "5.0.0",
     "core-js": "^2.6.2",
     "prop-types": "^15.6.2"
   },
diff --git a/addons/ondevice-knobs/package.json b/addons/ondevice-knobs/package.json
index e0025a23483..835014213ef 100644
--- a/addons/ondevice-knobs/package.json
+++ b/addons/ondevice-knobs/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/addon-ondevice-knobs",
   "private": true,
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "Display storybook story knobs on your deviced.",
   "keywords": [
     "addon",
@@ -21,7 +21,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.11",
+    "@storybook/addons": "5.0.0",
     "core-js": "^2.6.2",
     "deep-equal": "^1.0.1",
     "prop-types": "^15.6.2",
diff --git a/addons/ondevice-notes/package.json b/addons/ondevice-notes/package.json
index bd5c34816df..24919b62c2d 100644
--- a/addons/ondevice-notes/package.json
+++ b/addons/ondevice-notes/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/addon-ondevice-notes",
   "private": true,
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "Write notes for your Storybook stories.",
   "keywords": [
     "addon",
@@ -19,7 +19,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.11",
+    "@storybook/addons": "5.0.0",
     "core-js": "^2.6.2",
     "prop-types": "^15.6.2",
     "react-native-simple-markdown": "^1.1.0"
diff --git a/addons/options/package.json b/addons/options/package.json
index 33e5f5694e8..71636a0bcda 100644
--- a/addons/options/package.json
+++ b/addons/options/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-options",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "Options addon for storybook",
   "keywords": [
     "addon",
@@ -20,7 +20,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.11",
+    "@storybook/addons": "5.0.0",
     "core-js": "^2.6.2",
     "util-deprecate": "^1.0.2"
   },
diff --git a/addons/storyshots/storyshots-core/package.json b/addons/storyshots/storyshots-core/package.json
index e0f39f67982..1466dd2a718 100644
--- a/addons/storyshots/storyshots-core/package.json
+++ b/addons/storyshots/storyshots-core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storyshots",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "StoryShots is a Jest Snapshot Testing Addon for Storybook.",
   "keywords": [
     "addon",
@@ -24,7 +24,7 @@
     "storybook": "start-storybook -p 6006"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.11",
+    "@storybook/addons": "5.0.0",
     "core-js": "^2.6.2",
     "glob": "^7.1.3",
     "global": "^4.3.2",
diff --git a/addons/storyshots/storyshots-puppeteer/package.json b/addons/storyshots/storyshots-puppeteer/package.json
index a946ac57834..85d21607448 100644
--- a/addons/storyshots/storyshots-puppeteer/package.json
+++ b/addons/storyshots/storyshots-puppeteer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storyshots-puppeteer",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "Image snappshots addition to StoryShots base on puppeteer",
   "keywords": [
     "addon",
@@ -21,8 +21,8 @@
     "prepare": "node ../../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/node-logger": "5.0.0-rc.11",
-    "@storybook/router": "5.0.0-rc.11",
+    "@storybook/node-logger": "5.0.0",
+    "@storybook/router": "5.0.0",
     "core-js": "^2.6.2",
     "jest-image-snapshot": "^2.6.0",
     "puppeteer": "^1.12.0",
diff --git a/addons/storysource/package.json b/addons/storysource/package.json
index 3b4df165682..484023ff271 100644
--- a/addons/storysource/package.json
+++ b/addons/storysource/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storysource",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "Stories addon for storybook",
   "keywords": [
     "addon",
@@ -21,10 +21,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.11",
-    "@storybook/components": "5.0.0-rc.11",
-    "@storybook/router": "5.0.0-rc.11",
-    "@storybook/theming": "5.0.0-rc.11",
+    "@storybook/addons": "5.0.0",
+    "@storybook/components": "5.0.0",
+    "@storybook/router": "5.0.0",
+    "@storybook/theming": "5.0.0",
     "core-js": "^2.6.2",
     "estraverse": "^4.2.0",
     "loader-utils": "^1.2.1",
diff --git a/addons/viewport/package.json b/addons/viewport/package.json
index 5439946319b..c038a8b12b6 100644
--- a/addons/viewport/package.json
+++ b/addons/viewport/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-viewport",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "Storybook addon to change the viewport size to mobile",
   "keywords": [
     "addon",
@@ -20,11 +20,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.11",
-    "@storybook/client-logger": "5.0.0-rc.11",
-    "@storybook/components": "5.0.0-rc.11",
-    "@storybook/core-events": "5.0.0-rc.11",
-    "@storybook/theming": "5.0.0-rc.11",
+    "@storybook/addons": "5.0.0",
+    "@storybook/client-logger": "5.0.0",
+    "@storybook/components": "5.0.0",
+    "@storybook/core-events": "5.0.0",
+    "@storybook/theming": "5.0.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
diff --git a/app/angular/package.json b/app/angular/package.json
index 39ba50f2403..3c79fc2cdc9 100644
--- a/app/angular/package.json
+++ b/app/angular/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/angular",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "Storybook for Angular: Develop Angular Components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,8 +25,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.11",
-    "@storybook/node-logger": "5.0.0-rc.11",
+    "@storybook/core": "5.0.0",
+    "@storybook/node-logger": "5.0.0",
     "angular2-template-loader": "^0.6.2",
     "core-js": "^2.6.2",
     "fork-ts-checker-webpack-plugin": "^0.5.2",
diff --git a/app/ember/package.json b/app/ember/package.json
index ed06592d216..95b049886a7 100644
--- a/app/ember/package.json
+++ b/app/ember/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/ember",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "Storybook for Ember: Develop Ember Component in isolation with Hot Reloading.",
   "homepage": "https://github.com/storybooks/storybook/tree/master/app/ember",
   "bugs": {
@@ -23,7 +23,7 @@
   },
   "dependencies": {
     "@ember/test-helpers": "^1.3.1",
-    "@storybook/core": "5.0.0-rc.11",
+    "@storybook/core": "5.0.0",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/html/package.json b/app/html/package.json
index 76c4d906e31..d2721006d12 100644
--- a/app/html/package.json
+++ b/app/html/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/html",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "Storybook for HTML: View HTML snippets in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.11",
+    "@storybook/core": "5.0.0",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/marko/package.json b/app/marko/package.json
index da116568506..85721df9a24 100644
--- a/app/marko/package.json
+++ b/app/marko/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/marko",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "Storybook for Marko: Develop Marko Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.11",
+    "@storybook/core": "5.0.0",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/mithril/package.json b/app/mithril/package.json
index 2f5f1edf01f..b77e71d7a8e 100644
--- a/app/mithril/package.json
+++ b/app/mithril/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/mithril",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "Storybook for Mithril: Develop Mithril Component in isolation.",
   "keywords": [
     "storybook"
@@ -26,7 +26,7 @@
   },
   "dependencies": {
     "@babel/plugin-transform-react-jsx": "^7.3.0",
-    "@storybook/core": "5.0.0-rc.11",
+    "@storybook/core": "5.0.0",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/polymer/package.json b/app/polymer/package.json
index d165bd3a646..6952b57505f 100644
--- a/app/polymer/package.json
+++ b/app/polymer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/polymer",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "Storybook for Polymer: Develop Polymer components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.11",
+    "@storybook/core": "5.0.0",
     "@webcomponents/webcomponentsjs": "^1.2.0",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
diff --git a/app/preact/package.json b/app/preact/package.json
index 70b9dbb543a..2da9447a4b6 100644
--- a/app/preact/package.json
+++ b/app/preact/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/preact",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "Storybook for Preact: Develop Preact Component in isolation.",
   "keywords": [
     "storybook"
@@ -26,7 +26,7 @@
   },
   "dependencies": {
     "@babel/plugin-transform-react-jsx": "^7.3.0",
-    "@storybook/core": "5.0.0-rc.11",
+    "@storybook/core": "5.0.0",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/react-native/package.json b/app/react-native/package.json
index ad5c624474f..af690684176 100644
--- a/app/react-native/package.json
+++ b/app/react-native/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/react-native",
   "private": true,
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "A better way to develop React Native Components for your app",
   "keywords": [
     "react",
@@ -26,12 +26,12 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.11",
-    "@storybook/channel-websocket": "5.0.0-rc.11",
-    "@storybook/channels": "5.0.0-rc.11",
-    "@storybook/core": "5.0.0-rc.11",
-    "@storybook/core-events": "5.0.0-rc.11",
-    "@storybook/ui": "5.0.0-rc.11",
+    "@storybook/addons": "5.0.0",
+    "@storybook/channel-websocket": "5.0.0",
+    "@storybook/channels": "5.0.0",
+    "@storybook/core": "5.0.0",
+    "@storybook/core-events": "5.0.0",
+    "@storybook/ui": "5.0.0",
     "babel-loader": "^8.0.4",
     "babel-plugin-macros": "^2.4.5",
     "babel-plugin-syntax-async-functions": "^6.13.0",
diff --git a/app/react/package.json b/app/react/package.json
index a2f9147b4ca..82412f1a344 100644
--- a/app/react/package.json
+++ b/app/react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/react",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "Storybook for React: Develop React Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -28,9 +28,9 @@
     "@babel/plugin-transform-react-constant-elements": "^7.2.0",
     "@babel/preset-flow": "^7.0.0",
     "@babel/preset-react": "^7.0.0",
-    "@storybook/core": "5.0.0-rc.11",
-    "@storybook/node-logger": "5.0.0-rc.11",
-    "@storybook/theming": "5.0.0-rc.11",
+    "@storybook/core": "5.0.0",
+    "@storybook/node-logger": "5.0.0",
+    "@storybook/theming": "5.0.0",
     "@svgr/webpack": "^4.0.3",
     "babel-plugin-named-asset-import": "^0.3.0",
     "babel-plugin-react-docgen": "^2.0.2",
diff --git a/app/riot/package.json b/app/riot/package.json
index bf130227817..d4b25d969b3 100644
--- a/app/riot/package.json
+++ b/app/riot/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/riot",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "Storybook for riot.js: View riot snippets in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -24,7 +24,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.11",
+    "@storybook/core": "5.0.0",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/svelte/package.json b/app/svelte/package.json
index ce0ef88f447..e043a1c046c 100644
--- a/app/svelte/package.json
+++ b/app/svelte/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/svelte",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "Storybook for Svelte: Develop Svelte Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.11",
+    "@storybook/core": "5.0.0",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/app/vue/package.json b/app/vue/package.json
index 9d374ff62d4..ebf4f510f44 100644
--- a/app/vue/package.json
+++ b/app/vue/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/vue",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "Storybook for Vue: Develop Vue Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0-rc.11",
+    "@storybook/core": "5.0.0",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.2",
     "global": "^4.3.2",
diff --git a/examples/angular-cli/package.json b/examples/angular-cli/package.json
index 4810dbc41c2..4cc040d90dd 100644
--- a/examples/angular-cli/package.json
+++ b/examples/angular-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "angular-cli",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "private": true,
   "license": "MIT",
   "scripts": {
@@ -33,18 +33,18 @@
     "@angular-devkit/build-angular": "^0.13.1",
     "@angular/cli": "^7.3.2",
     "@angular/compiler-cli": "^7.2.1",
-    "@storybook/addon-actions": "5.0.0-rc.11",
-    "@storybook/addon-backgrounds": "5.0.0-rc.11",
-    "@storybook/addon-centered": "5.0.0-rc.11",
-    "@storybook/addon-jest": "5.0.0-rc.11",
-    "@storybook/addon-knobs": "5.0.0-rc.11",
-    "@storybook/addon-links": "5.0.0-rc.11",
-    "@storybook/addon-notes": "5.0.0-rc.11",
-    "@storybook/addon-options": "5.0.0-rc.11",
-    "@storybook/addon-storyshots": "5.0.0-rc.11",
-    "@storybook/addon-storysource": "5.0.0-rc.11",
-    "@storybook/addons": "5.0.0-rc.11",
-    "@storybook/angular": "5.0.0-rc.11",
+    "@storybook/addon-actions": "5.0.0",
+    "@storybook/addon-backgrounds": "5.0.0",
+    "@storybook/addon-centered": "5.0.0",
+    "@storybook/addon-jest": "5.0.0",
+    "@storybook/addon-knobs": "5.0.0",
+    "@storybook/addon-links": "5.0.0",
+    "@storybook/addon-notes": "5.0.0",
+    "@storybook/addon-options": "5.0.0",
+    "@storybook/addon-storyshots": "5.0.0",
+    "@storybook/addon-storysource": "5.0.0",
+    "@storybook/addons": "5.0.0",
+    "@storybook/angular": "5.0.0",
     "@types/core-js": "^2.5.0",
     "@types/jest": "^23.3.13",
     "@types/node": "~10.12.19",
diff --git a/examples/cra-kitchen-sink/package.json b/examples/cra-kitchen-sink/package.json
index 966d3f31231..957ac4cee9b 100644
--- a/examples/cra-kitchen-sink/package.json
+++ b/examples/cra-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "cra-kitchen-sink",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "private": true,
   "scripts": {
     "build": "react-scripts build",
@@ -18,21 +18,21 @@
     "react-lifecycles-compat": "^3.0.4"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.0.0-rc.11",
-    "@storybook/addon-actions": "5.0.0-rc.11",
-    "@storybook/addon-backgrounds": "5.0.0-rc.11",
-    "@storybook/addon-centered": "5.0.0-rc.11",
-    "@storybook/addon-events": "5.0.0-rc.11",
-    "@storybook/addon-info": "5.0.0-rc.11",
-    "@storybook/addon-jest": "5.0.0-rc.11",
-    "@storybook/addon-knobs": "5.0.0-rc.11",
-    "@storybook/addon-links": "5.0.0-rc.11",
-    "@storybook/addon-notes": "5.0.0-rc.11",
-    "@storybook/addon-options": "5.0.0-rc.11",
-    "@storybook/addon-storyshots": "5.0.0-rc.11",
-    "@storybook/addons": "5.0.0-rc.11",
-    "@storybook/client-logger": "5.0.0-rc.11",
-    "@storybook/react": "5.0.0-rc.11",
+    "@storybook/addon-a11y": "5.0.0",
+    "@storybook/addon-actions": "5.0.0",
+    "@storybook/addon-backgrounds": "5.0.0",
+    "@storybook/addon-centered": "5.0.0",
+    "@storybook/addon-events": "5.0.0",
+    "@storybook/addon-info": "5.0.0",
+    "@storybook/addon-jest": "5.0.0",
+    "@storybook/addon-knobs": "5.0.0",
+    "@storybook/addon-links": "5.0.0",
+    "@storybook/addon-notes": "5.0.0",
+    "@storybook/addon-options": "5.0.0",
+    "@storybook/addon-storyshots": "5.0.0",
+    "@storybook/addons": "5.0.0",
+    "@storybook/client-logger": "5.0.0",
+    "@storybook/react": "5.0.0",
     "enzyme": "^3.7.0",
     "enzyme-adapter-react-16": "^1.9.1",
     "enzyme-to-json": "^3.3.4",
diff --git a/examples/cra-ts-kitchen-sink/package.json b/examples/cra-ts-kitchen-sink/package.json
index d0fd776f586..0bc95897302 100644
--- a/examples/cra-ts-kitchen-sink/package.json
+++ b/examples/cra-ts-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "cra-ts-kitchen-sink",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook -s public",
@@ -19,11 +19,11 @@
     "react-dom": "^16.8.1"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.11",
-    "@storybook/addon-info": "5.0.0-rc.11",
-    "@storybook/addon-options": "5.0.0-rc.11",
-    "@storybook/addons": "5.0.0-rc.11",
-    "@storybook/react": "5.0.0-rc.11",
+    "@storybook/addon-actions": "5.0.0",
+    "@storybook/addon-info": "5.0.0",
+    "@storybook/addon-options": "5.0.0",
+    "@storybook/addons": "5.0.0",
+    "@storybook/react": "5.0.0",
     "@types/enzyme": "^3.1.15",
     "@types/react": "^16.7.22",
     "@types/react-dom": "^16.0.11",
diff --git a/examples/ember-cli/package.json b/examples/ember-cli/package.json
index 01b65c9c513..f868e8f314d 100644
--- a/examples/ember-cli/package.json
+++ b/examples/ember-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "ember-example",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "private": true,
   "scripts": {
     "build": "ember build",
@@ -14,18 +14,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.2.2",
-    "@storybook/addon-a11y": "5.0.0-rc.11",
-    "@storybook/addon-actions": "5.0.0-rc.11",
-    "@storybook/addon-backgrounds": "5.0.0-rc.11",
-    "@storybook/addon-centered": "5.0.0-rc.11",
-    "@storybook/addon-knobs": "5.0.0-rc.11",
-    "@storybook/addon-links": "5.0.0-rc.11",
-    "@storybook/addon-notes": "5.0.0-rc.11",
-    "@storybook/addon-options": "5.0.0-rc.11",
-    "@storybook/addon-storysource": "5.0.0-rc.11",
-    "@storybook/addon-viewport": "5.0.0-rc.11",
-    "@storybook/addons": "5.0.0-rc.11",
-    "@storybook/ember": "5.0.0-rc.11",
+    "@storybook/addon-a11y": "5.0.0",
+    "@storybook/addon-actions": "5.0.0",
+    "@storybook/addon-backgrounds": "5.0.0",
+    "@storybook/addon-centered": "5.0.0",
+    "@storybook/addon-knobs": "5.0.0",
+    "@storybook/addon-links": "5.0.0",
+    "@storybook/addon-notes": "5.0.0",
+    "@storybook/addon-options": "5.0.0",
+    "@storybook/addon-storysource": "5.0.0",
+    "@storybook/addon-viewport": "5.0.0",
+    "@storybook/addons": "5.0.0",
+    "@storybook/ember": "5.0.0",
     "babel-loader": "^8",
     "broccoli-asset-rev": "^3.0.0",
     "cross-env": "^5.2.0",
diff --git a/examples/html-kitchen-sink/package.json b/examples/html-kitchen-sink/package.json
index fb4f4624214..b3f7831728f 100644
--- a/examples/html-kitchen-sink/package.json
+++ b/examples/html-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "html-kitchen-sink",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "private": true,
   "description": "",
   "keywords": [],
@@ -13,23 +13,23 @@
     "storybook": "start-storybook -p 9006"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.0.0-rc.11",
-    "@storybook/addon-actions": "5.0.0-rc.11",
-    "@storybook/addon-backgrounds": "5.0.0-rc.11",
-    "@storybook/addon-centered": "5.0.0-rc.11",
-    "@storybook/addon-events": "5.0.0-rc.11",
-    "@storybook/addon-jest": "5.0.0-rc.11",
-    "@storybook/addon-knobs": "5.0.0-rc.11",
-    "@storybook/addon-links": "5.0.0-rc.11",
-    "@storybook/addon-notes": "5.0.0-rc.11",
-    "@storybook/addon-options": "5.0.0-rc.11",
-    "@storybook/addon-storyshots": "5.0.0-rc.11",
-    "@storybook/addon-storysource": "5.0.0-rc.11",
-    "@storybook/addon-viewport": "5.0.0-rc.11",
-    "@storybook/addons": "5.0.0-rc.11",
-    "@storybook/core": "5.0.0-rc.11",
-    "@storybook/core-events": "5.0.0-rc.11",
-    "@storybook/html": "5.0.0-rc.11",
+    "@storybook/addon-a11y": "5.0.0",
+    "@storybook/addon-actions": "5.0.0",
+    "@storybook/addon-backgrounds": "5.0.0",
+    "@storybook/addon-centered": "5.0.0",
+    "@storybook/addon-events": "5.0.0",
+    "@storybook/addon-jest": "5.0.0",
+    "@storybook/addon-knobs": "5.0.0",
+    "@storybook/addon-links": "5.0.0",
+    "@storybook/addon-notes": "5.0.0",
+    "@storybook/addon-options": "5.0.0",
+    "@storybook/addon-storyshots": "5.0.0",
+    "@storybook/addon-storysource": "5.0.0",
+    "@storybook/addon-viewport": "5.0.0",
+    "@storybook/addons": "5.0.0",
+    "@storybook/core": "5.0.0",
+    "@storybook/core-events": "5.0.0",
+    "@storybook/html": "5.0.0",
     "eventemitter3": "^3.1.0",
     "format-json": "^1.0.3",
     "global": "^4.3.2",
diff --git a/examples/marko-cli/package.json b/examples/marko-cli/package.json
index 58657715539..709e186be0e 100644
--- a/examples/marko-cli/package.json
+++ b/examples/marko-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "marko-cli",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "private": true,
   "description": "Demo of how to build an app using marko-starter",
   "repository": {
@@ -22,12 +22,12 @@
     "marko-starter": "^2.0.4"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.11",
-    "@storybook/addon-knobs": "5.0.0-rc.11",
-    "@storybook/addon-options": "5.0.0-rc.11",
-    "@storybook/addon-storysource": "5.0.0-rc.11",
-    "@storybook/addons": "5.0.0-rc.11",
-    "@storybook/marko": "5.0.0-rc.11",
+    "@storybook/addon-actions": "5.0.0",
+    "@storybook/addon-knobs": "5.0.0",
+    "@storybook/addon-options": "5.0.0",
+    "@storybook/addon-storysource": "5.0.0",
+    "@storybook/addons": "5.0.0",
+    "@storybook/marko": "5.0.0",
     "prettier": "^1.16.4",
     "webpack": "^4.29.0"
   }
diff --git a/examples/mithril-kitchen-sink/package.json b/examples/mithril-kitchen-sink/package.json
index f4ee46c621b..c9235e3e752 100644
--- a/examples/mithril-kitchen-sink/package.json
+++ b/examples/mithril-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "mithril-example",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook",
@@ -10,18 +10,18 @@
     "mithril": "^1.1.6"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.11",
-    "@storybook/addon-backgrounds": "5.0.0-rc.11",
-    "@storybook/addon-centered": "5.0.0-rc.11",
-    "@storybook/addon-knobs": "5.0.0-rc.11",
-    "@storybook/addon-links": "5.0.0-rc.11",
-    "@storybook/addon-notes": "5.0.0-rc.11",
-    "@storybook/addon-options": "5.0.0-rc.11",
-    "@storybook/addon-storyshots": "5.0.0-rc.11",
-    "@storybook/addon-storysource": "5.0.0-rc.11",
-    "@storybook/addon-viewport": "5.0.0-rc.11",
-    "@storybook/addons": "5.0.0-rc.11",
-    "@storybook/mithril": "5.0.0-rc.11",
+    "@storybook/addon-actions": "5.0.0",
+    "@storybook/addon-backgrounds": "5.0.0",
+    "@storybook/addon-centered": "5.0.0",
+    "@storybook/addon-knobs": "5.0.0",
+    "@storybook/addon-links": "5.0.0",
+    "@storybook/addon-notes": "5.0.0",
+    "@storybook/addon-options": "5.0.0",
+    "@storybook/addon-storyshots": "5.0.0",
+    "@storybook/addon-storysource": "5.0.0",
+    "@storybook/addon-viewport": "5.0.0",
+    "@storybook/addons": "5.0.0",
+    "@storybook/mithril": "5.0.0",
     "webpack": "^4.29.0"
   }
 }
diff --git a/examples/official-storybook/package.json b/examples/official-storybook/package.json
index f409203ed61..ea2dad1f721 100644
--- a/examples/official-storybook/package.json
+++ b/examples/official-storybook/package.json
@@ -1,6 +1,6 @@
 {
   "name": "official-storybook",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook -c ./ -s built-storybooks",
@@ -12,29 +12,29 @@
     "storybook": "cross-env STORYBOOK_DISPLAY_WARNING=true DISPLAY_WARNING=true start-storybook -p 9011 -c ./ -s built-storybooks --no-dll"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.0.0-rc.11",
-    "@storybook/addon-actions": "5.0.0-rc.11",
-    "@storybook/addon-backgrounds": "5.0.0-rc.11",
-    "@storybook/addon-centered": "5.0.0-rc.11",
-    "@storybook/addon-cssresources": "5.0.0-rc.11",
-    "@storybook/addon-events": "5.0.0-rc.11",
-    "@storybook/addon-graphql": "5.0.0-rc.11",
-    "@storybook/addon-info": "5.0.0-rc.11",
-    "@storybook/addon-jest": "5.0.0-rc.11",
-    "@storybook/addon-knobs": "5.0.0-rc.11",
-    "@storybook/addon-links": "5.0.0-rc.11",
-    "@storybook/addon-notes": "5.0.0-rc.11",
-    "@storybook/addon-options": "5.0.0-rc.11",
-    "@storybook/addon-storyshots": "5.0.0-rc.11",
-    "@storybook/addon-storyshots-puppeteer": "5.0.0-rc.11",
-    "@storybook/addon-storysource": "5.0.0-rc.11",
-    "@storybook/addon-viewport": "5.0.0-rc.11",
-    "@storybook/addons": "5.0.0-rc.11",
-    "@storybook/components": "5.0.0-rc.11",
-    "@storybook/core-events": "5.0.0-rc.11",
-    "@storybook/node-logger": "5.0.0-rc.11",
-    "@storybook/react": "5.0.0-rc.11",
-    "@storybook/theming": "5.0.0-rc.11",
+    "@storybook/addon-a11y": "5.0.0",
+    "@storybook/addon-actions": "5.0.0",
+    "@storybook/addon-backgrounds": "5.0.0",
+    "@storybook/addon-centered": "5.0.0",
+    "@storybook/addon-cssresources": "5.0.0",
+    "@storybook/addon-events": "5.0.0",
+    "@storybook/addon-graphql": "5.0.0",
+    "@storybook/addon-info": "5.0.0",
+    "@storybook/addon-jest": "5.0.0",
+    "@storybook/addon-knobs": "5.0.0",
+    "@storybook/addon-links": "5.0.0",
+    "@storybook/addon-notes": "5.0.0",
+    "@storybook/addon-options": "5.0.0",
+    "@storybook/addon-storyshots": "5.0.0",
+    "@storybook/addon-storyshots-puppeteer": "5.0.0",
+    "@storybook/addon-storysource": "5.0.0",
+    "@storybook/addon-viewport": "5.0.0",
+    "@storybook/addons": "5.0.0",
+    "@storybook/components": "5.0.0",
+    "@storybook/core-events": "5.0.0",
+    "@storybook/node-logger": "5.0.0",
+    "@storybook/react": "5.0.0",
+    "@storybook/theming": "5.0.0",
     "cors": "^2.8.4",
     "cross-env": "^5.2.0",
     "enzyme-to-json": "^3.3.4",
diff --git a/examples/polymer-cli/package.json b/examples/polymer-cli/package.json
index c23c2d354a6..f9443454191 100644
--- a/examples/polymer-cli/package.json
+++ b/examples/polymer-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "polymer-cli",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook",
@@ -9,15 +9,15 @@
   },
   "dependencies": {
     "@polymer/polymer": "^2.6.0",
-    "@storybook/addon-actions": "5.0.0-rc.11",
-    "@storybook/addon-backgrounds": "5.0.0-rc.11",
-    "@storybook/addon-knobs": "5.0.0-rc.11",
-    "@storybook/addon-links": "5.0.0-rc.11",
-    "@storybook/addon-notes": "5.0.0-rc.11",
-    "@storybook/addon-options": "5.0.0-rc.11",
-    "@storybook/addon-storysource": "5.0.0-rc.11",
-    "@storybook/addon-viewport": "5.0.0-rc.11",
-    "@storybook/polymer": "5.0.0-rc.11",
+    "@storybook/addon-actions": "5.0.0",
+    "@storybook/addon-backgrounds": "5.0.0",
+    "@storybook/addon-knobs": "5.0.0",
+    "@storybook/addon-links": "5.0.0",
+    "@storybook/addon-notes": "5.0.0",
+    "@storybook/addon-options": "5.0.0",
+    "@storybook/addon-storysource": "5.0.0",
+    "@storybook/addon-viewport": "5.0.0",
+    "@storybook/polymer": "5.0.0",
     "@webcomponents/webcomponentsjs": "^1.2.0",
     "global": "^4.3.2",
     "lit-html": "^1.0.0",
diff --git a/examples/preact-kitchen-sink/package.json b/examples/preact-kitchen-sink/package.json
index 6fb16f8b6a5..ebb9e9f0006 100644
--- a/examples/preact-kitchen-sink/package.json
+++ b/examples/preact-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "preact-example",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "private": true,
   "scripts": {
     "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
@@ -15,18 +15,18 @@
   "devDependencies": {
     "@babel/core": "^7.2.2",
     "@babel/plugin-transform-runtime": "^7.2.0",
-    "@storybook/addon-actions": "5.0.0-rc.11",
-    "@storybook/addon-backgrounds": "5.0.0-rc.11",
-    "@storybook/addon-centered": "5.0.0-rc.11",
-    "@storybook/addon-knobs": "5.0.0-rc.11",
-    "@storybook/addon-links": "5.0.0-rc.11",
-    "@storybook/addon-notes": "5.0.0-rc.11",
-    "@storybook/addon-options": "5.0.0-rc.11",
-    "@storybook/addon-storyshots": "5.0.0-rc.11",
-    "@storybook/addon-storysource": "5.0.0-rc.11",
-    "@storybook/addon-viewport": "5.0.0-rc.11",
-    "@storybook/addons": "5.0.0-rc.11",
-    "@storybook/preact": "5.0.0-rc.11",
+    "@storybook/addon-actions": "5.0.0",
+    "@storybook/addon-backgrounds": "5.0.0",
+    "@storybook/addon-centered": "5.0.0",
+    "@storybook/addon-knobs": "5.0.0",
+    "@storybook/addon-links": "5.0.0",
+    "@storybook/addon-notes": "5.0.0",
+    "@storybook/addon-options": "5.0.0",
+    "@storybook/addon-storyshots": "5.0.0",
+    "@storybook/addon-storysource": "5.0.0",
+    "@storybook/addon-viewport": "5.0.0",
+    "@storybook/addons": "5.0.0",
+    "@storybook/preact": "5.0.0",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
     "file-loader": "^3.0.1",
diff --git a/examples/riot-kitchen-sink/package.json b/examples/riot-kitchen-sink/package.json
index 996b19ce35d..fd46334a8b7 100644
--- a/examples/riot-kitchen-sink/package.json
+++ b/examples/riot-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "riot-example",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "private": true,
   "scripts": {
     "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
@@ -15,18 +15,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.2.2",
-    "@storybook/addon-actions": "5.0.0-rc.11",
-    "@storybook/addon-backgrounds": "5.0.0-rc.11",
-    "@storybook/addon-centered": "5.0.0-rc.11",
-    "@storybook/addon-knobs": "5.0.0-rc.11",
-    "@storybook/addon-links": "5.0.0-rc.11",
-    "@storybook/addon-notes": "5.0.0-rc.11",
-    "@storybook/addon-options": "5.0.0-rc.11",
-    "@storybook/addon-storyshots": "5.0.0-rc.11",
-    "@storybook/addon-storysource": "5.0.0-rc.11",
-    "@storybook/addon-viewport": "5.0.0-rc.11",
-    "@storybook/addons": "5.0.0-rc.11",
-    "@storybook/riot": "5.0.0-rc.11",
+    "@storybook/addon-actions": "5.0.0",
+    "@storybook/addon-backgrounds": "5.0.0",
+    "@storybook/addon-centered": "5.0.0",
+    "@storybook/addon-knobs": "5.0.0",
+    "@storybook/addon-links": "5.0.0",
+    "@storybook/addon-notes": "5.0.0",
+    "@storybook/addon-options": "5.0.0",
+    "@storybook/addon-storyshots": "5.0.0",
+    "@storybook/addon-storysource": "5.0.0",
+    "@storybook/addon-viewport": "5.0.0",
+    "@storybook/addons": "5.0.0",
+    "@storybook/riot": "5.0.0",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
     "file-loader": "^3.0.1",
diff --git a/examples/svelte-kitchen-sink/package.json b/examples/svelte-kitchen-sink/package.json
index 33f9c4f54db..7c8e6b426cd 100644
--- a/examples/svelte-kitchen-sink/package.json
+++ b/examples/svelte-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "svelte-example",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "private": true,
   "scripts": {
     "build-storybook": "build-storybook -s public",
@@ -10,17 +10,17 @@
     "global": "^4.3.2"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.11",
-    "@storybook/addon-backgrounds": "5.0.0-rc.11",
-    "@storybook/addon-centered": "5.0.0-rc.11",
-    "@storybook/addon-knobs": "5.0.0-rc.11",
-    "@storybook/addon-links": "5.0.0-rc.11",
-    "@storybook/addon-notes": "5.0.0-rc.11",
-    "@storybook/addon-options": "5.0.0-rc.11",
-    "@storybook/addon-storyshots": "5.0.0-rc.11",
-    "@storybook/addon-storysource": "5.0.0-rc.11",
-    "@storybook/addon-viewport": "5.0.0-rc.11",
-    "@storybook/addons": "5.0.0-rc.11",
-    "@storybook/svelte": "5.0.0-rc.11"
+    "@storybook/addon-actions": "5.0.0",
+    "@storybook/addon-backgrounds": "5.0.0",
+    "@storybook/addon-centered": "5.0.0",
+    "@storybook/addon-knobs": "5.0.0",
+    "@storybook/addon-links": "5.0.0",
+    "@storybook/addon-notes": "5.0.0",
+    "@storybook/addon-options": "5.0.0",
+    "@storybook/addon-storyshots": "5.0.0",
+    "@storybook/addon-storysource": "5.0.0",
+    "@storybook/addon-viewport": "5.0.0",
+    "@storybook/addons": "5.0.0",
+    "@storybook/svelte": "5.0.0"
   }
 }
diff --git a/examples/vue-kitchen-sink/package.json b/examples/vue-kitchen-sink/package.json
index 39fd051c59e..9551bd69823 100644
--- a/examples/vue-kitchen-sink/package.json
+++ b/examples/vue-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "vue-example",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "private": true,
   "scripts": {
     "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
@@ -14,18 +14,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.2.2",
-    "@storybook/addon-actions": "5.0.0-rc.11",
-    "@storybook/addon-backgrounds": "5.0.0-rc.11",
-    "@storybook/addon-centered": "5.0.0-rc.11",
-    "@storybook/addon-knobs": "5.0.0-rc.11",
-    "@storybook/addon-links": "5.0.0-rc.11",
-    "@storybook/addon-notes": "5.0.0-rc.11",
-    "@storybook/addon-options": "5.0.0-rc.11",
-    "@storybook/addon-storyshots": "5.0.0-rc.11",
-    "@storybook/addon-storysource": "5.0.0-rc.11",
-    "@storybook/addon-viewport": "5.0.0-rc.11",
-    "@storybook/addons": "5.0.0-rc.11",
-    "@storybook/vue": "5.0.0-rc.11",
+    "@storybook/addon-actions": "5.0.0",
+    "@storybook/addon-backgrounds": "5.0.0",
+    "@storybook/addon-centered": "5.0.0",
+    "@storybook/addon-knobs": "5.0.0",
+    "@storybook/addon-links": "5.0.0",
+    "@storybook/addon-notes": "5.0.0",
+    "@storybook/addon-options": "5.0.0",
+    "@storybook/addon-storyshots": "5.0.0",
+    "@storybook/addon-storysource": "5.0.0",
+    "@storybook/addon-viewport": "5.0.0",
+    "@storybook/addons": "5.0.0",
+    "@storybook/vue": "5.0.0",
     "babel-core": "^7.0.0-bridge.0",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
diff --git a/lerna.json b/lerna.json
index 10d9b74f493..b539c60d507 100644
--- a/lerna.json
+++ b/lerna.json
@@ -11,5 +11,5 @@
   "npmClient": "yarn",
   "useWorkspaces": true,
   "registry": "https://registry.npmjs.org",
-  "version": "5.0.0-rc.11"
+  "version": "5.0.0"
 }
diff --git a/lib/addons/package.json b/lib/addons/package.json
index 4b94704700f..80efe9f6a04 100644
--- a/lib/addons/package.json
+++ b/lib/addons/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addons",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "Storybook addons store",
   "keywords": [
     "storybook"
@@ -20,8 +20,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.0.0-rc.11",
-    "@storybook/client-logger": "5.0.0-rc.11",
+    "@storybook/channels": "5.0.0",
+    "@storybook/client-logger": "5.0.0",
     "global": "^4.3.2",
     "util-deprecate": "^1.0.2"
   },
diff --git a/lib/channel-postmessage/package.json b/lib/channel-postmessage/package.json
index 5945aefd9f4..68243979df2 100644
--- a/lib/channel-postmessage/package.json
+++ b/lib/channel-postmessage/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channel-postmessage",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "",
   "keywords": [
     "storybook"
@@ -20,8 +20,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.0.0-rc.11",
-    "@storybook/client-logger": "5.0.0-rc.11",
+    "@storybook/channels": "5.0.0",
+    "@storybook/client-logger": "5.0.0",
     "global": "^4.3.2",
     "telejson": "^2.1.0"
   },
diff --git a/lib/channel-websocket/package.json b/lib/channel-websocket/package.json
index d1f00e00ecd..7e2e3ddd53a 100644
--- a/lib/channel-websocket/package.json
+++ b/lib/channel-websocket/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channel-websocket",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "",
   "keywords": [
     "storybook"
@@ -20,7 +20,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.0.0-rc.11",
+    "@storybook/channels": "5.0.0",
     "global": "^4.3.2",
     "json-fn": "^1.1.1"
   },
diff --git a/lib/channels/package.json b/lib/channels/package.json
index e6cb75db3d3..b3956a2d1d6 100644
--- a/lib/channels/package.json
+++ b/lib/channels/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channels",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/cli/package.json b/lib/cli/package.json
index 7b01862086a..cdc5a232170 100644
--- a/lib/cli/package.json
+++ b/lib/cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/cli",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "Storybook's CLI - easiest method of adding storybook to your projects",
   "keywords": [
     "cli",
@@ -29,7 +29,7 @@
     "@babel/core": "^7.2.2",
     "@babel/preset-env": "^7.3.1",
     "@babel/register": "^7.0.0",
-    "@storybook/codemod": "5.0.0-rc.11",
+    "@storybook/codemod": "5.0.0",
     "chalk": "^2.4.1",
     "commander": "^2.19.0",
     "core-js": "^2.6.2",
@@ -43,31 +43,31 @@
     "update-notifier": "^2.5.0"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0-rc.11",
-    "@storybook/addon-centered": "5.0.0-rc.11",
-    "@storybook/addon-graphql": "5.0.0-rc.11",
-    "@storybook/addon-info": "5.0.0-rc.11",
-    "@storybook/addon-knobs": "5.0.0-rc.11",
-    "@storybook/addon-links": "5.0.0-rc.11",
-    "@storybook/addon-notes": "5.0.0-rc.11",
-    "@storybook/addon-options": "5.0.0-rc.11",
-    "@storybook/addon-storyshots": "5.0.0-rc.11",
-    "@storybook/addons": "5.0.0-rc.11",
-    "@storybook/angular": "5.0.0-rc.11",
-    "@storybook/channel-postmessage": "5.0.0-rc.11",
-    "@storybook/channel-websocket": "5.0.0-rc.11",
-    "@storybook/channels": "5.0.0-rc.11",
-    "@storybook/ember": "5.0.0-rc.11",
-    "@storybook/html": "5.0.0-rc.11",
-    "@storybook/marko": "5.0.0-rc.11",
-    "@storybook/mithril": "5.0.0-rc.11",
-    "@storybook/polymer": "5.0.0-rc.11",
-    "@storybook/preact": "5.0.0-rc.11",
-    "@storybook/react": "5.0.0-rc.11",
-    "@storybook/react-native": "5.0.0-rc.11",
-    "@storybook/riot": "5.0.0-rc.11",
-    "@storybook/ui": "5.0.0-rc.11",
-    "@storybook/vue": "5.0.0-rc.11"
+    "@storybook/addon-actions": "5.0.0",
+    "@storybook/addon-centered": "5.0.0",
+    "@storybook/addon-graphql": "5.0.0",
+    "@storybook/addon-info": "5.0.0",
+    "@storybook/addon-knobs": "5.0.0",
+    "@storybook/addon-links": "5.0.0",
+    "@storybook/addon-notes": "5.0.0",
+    "@storybook/addon-options": "5.0.0",
+    "@storybook/addon-storyshots": "5.0.0",
+    "@storybook/addons": "5.0.0",
+    "@storybook/angular": "5.0.0",
+    "@storybook/channel-postmessage": "5.0.0",
+    "@storybook/channel-websocket": "5.0.0",
+    "@storybook/channels": "5.0.0",
+    "@storybook/ember": "5.0.0",
+    "@storybook/html": "5.0.0",
+    "@storybook/marko": "5.0.0",
+    "@storybook/mithril": "5.0.0",
+    "@storybook/polymer": "5.0.0",
+    "@storybook/preact": "5.0.0",
+    "@storybook/react": "5.0.0",
+    "@storybook/react-native": "5.0.0",
+    "@storybook/riot": "5.0.0",
+    "@storybook/ui": "5.0.0",
+    "@storybook/vue": "5.0.0"
   },
   "publishConfig": {
     "access": "public"
diff --git a/lib/client-api/package.json b/lib/client-api/package.json
index cdb3052eeb9..7338816c1e9 100644
--- a/lib/client-api/package.json
+++ b/lib/client-api/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/client-api",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "Storybook Client API",
   "keywords": [
     "storybook"
@@ -19,10 +19,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.11",
-    "@storybook/client-logger": "5.0.0-rc.11",
-    "@storybook/core-events": "5.0.0-rc.11",
-    "@storybook/router": "5.0.0-rc.11",
+    "@storybook/addons": "5.0.0",
+    "@storybook/client-logger": "5.0.0",
+    "@storybook/core-events": "5.0.0",
+    "@storybook/router": "5.0.0",
     "common-tags": "^1.8.0",
     "eventemitter3": "^3.1.0",
     "global": "^4.3.2",
diff --git a/lib/client-logger/package.json b/lib/client-logger/package.json
index a7bb1ba7a8e..706d51f9d09 100644
--- a/lib/client-logger/package.json
+++ b/lib/client-logger/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/client-logger",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/codemod/package.json b/lib/codemod/package.json
index 6455c15ce5d..54cd314da4d 100644
--- a/lib/codemod/package.json
+++ b/lib/codemod/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/codemod",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "A collection of codemod scripts written with JSCodeshift",
   "keywords": [
     "storybook"
diff --git a/lib/components/package.json b/lib/components/package.json
index fedc071572b..65288c0c243 100644
--- a/lib/components/package.json
+++ b/lib/components/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/components",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "Core Storybook Components",
   "keywords": [
     "storybook"
@@ -20,11 +20,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.11",
-    "@storybook/client-logger": "5.0.0-rc.11",
-    "@storybook/core-events": "5.0.0-rc.11",
-    "@storybook/router": "5.0.0-rc.11",
-    "@storybook/theming": "5.0.0-rc.11",
+    "@storybook/addons": "5.0.0",
+    "@storybook/client-logger": "5.0.0",
+    "@storybook/core-events": "5.0.0",
+    "@storybook/router": "5.0.0",
+    "@storybook/theming": "5.0.0",
     "global": "^4.3.2",
     "immer": "^1.12.0",
     "js-beautify": "^1.8.9",
diff --git a/lib/core-events/package.json b/lib/core-events/package.json
index 29667df5a21..d875f5c8cb3 100644
--- a/lib/core-events/package.json
+++ b/lib/core-events/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/core-events",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "Event names used in storybook core",
   "keywords": [
     "storybook"
diff --git a/lib/core/package.json b/lib/core/package.json
index 98308ba1c1b..35f72657304 100644
--- a/lib/core/package.json
+++ b/lib/core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/core",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "Storybook framework-agnostic API",
   "keywords": [
     "storybook"
@@ -24,15 +24,15 @@
     "@babel/plugin-syntax-dynamic-import": "^7.2.0",
     "@babel/plugin-transform-react-constant-elements": "^7.2.0",
     "@babel/preset-env": "^7.3.1",
-    "@storybook/addons": "5.0.0-rc.11",
-    "@storybook/channel-postmessage": "5.0.0-rc.11",
-    "@storybook/client-api": "5.0.0-rc.11",
-    "@storybook/client-logger": "5.0.0-rc.11",
-    "@storybook/core-events": "5.0.0-rc.11",
-    "@storybook/node-logger": "5.0.0-rc.11",
-    "@storybook/router": "5.0.0-rc.11",
-    "@storybook/theming": "5.0.0-rc.11",
-    "@storybook/ui": "5.0.0-rc.11",
+    "@storybook/addons": "5.0.0",
+    "@storybook/channel-postmessage": "5.0.0",
+    "@storybook/client-api": "5.0.0",
+    "@storybook/client-logger": "5.0.0",
+    "@storybook/core-events": "5.0.0",
+    "@storybook/node-logger": "5.0.0",
+    "@storybook/router": "5.0.0",
+    "@storybook/theming": "5.0.0",
+    "@storybook/ui": "5.0.0",
     "airbnb-js-shims": "^1 || ^2",
     "autoprefixer": "^9.4.7",
     "babel-plugin-add-react-displayname": "^0.0.5",
diff --git a/lib/node-logger/package.json b/lib/node-logger/package.json
index 67209bacbfa..9ec7297fa43 100644
--- a/lib/node-logger/package.json
+++ b/lib/node-logger/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/node-logger",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/router/package.json b/lib/router/package.json
index 625ea29215d..c0833b956ed 100644
--- a/lib/router/package.json
+++ b/lib/router/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/router",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "Core Storybook Router",
   "keywords": [
     "storybook"
@@ -20,7 +20,7 @@
   },
   "dependencies": {
     "@reach/router": "^1.2.1",
-    "@storybook/theming": "5.0.0-rc.11",
+    "@storybook/theming": "5.0.0",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
     "qs": "^6.5.2"
diff --git a/lib/theming/package.json b/lib/theming/package.json
index 8079ba56732..be0cc2cbe1d 100644
--- a/lib/theming/package.json
+++ b/lib/theming/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/theming",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "Core Storybook Components",
   "keywords": [
     "storybook"
@@ -21,7 +21,7 @@
   "dependencies": {
     "@emotion/core": "^10.0.7",
     "@emotion/styled": "^10.0.7",
-    "@storybook/client-logger": "5.0.0-rc.11",
+    "@storybook/client-logger": "5.0.0",
     "common-tags": "^1.8.0",
     "deep-object-diff": "^1.1.0",
     "emotion-theming": "^10.0.7",
diff --git a/lib/ui/package.json b/lib/ui/package.json
index e90f65610f5..9e9c9dc1f4d 100644
--- a/lib/ui/package.json
+++ b/lib/ui/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/ui",
-  "version": "5.0.0-rc.11",
+  "version": "5.0.0",
   "description": "Core Storybook UI",
   "keywords": [
     "storybook"
@@ -21,12 +21,12 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0-rc.11",
-    "@storybook/client-logger": "5.0.0-rc.11",
-    "@storybook/components": "5.0.0-rc.11",
-    "@storybook/core-events": "5.0.0-rc.11",
-    "@storybook/router": "5.0.0-rc.11",
-    "@storybook/theming": "5.0.0-rc.11",
+    "@storybook/addons": "5.0.0",
+    "@storybook/client-logger": "5.0.0",
+    "@storybook/components": "5.0.0",
+    "@storybook/core-events": "5.0.0",
+    "@storybook/router": "5.0.0",
+    "@storybook/theming": "5.0.0",
     "fast-deep-equal": "^2.0.1",
     "fuzzy-search": "^3.0.1",
     "global": "^4.3.2",

From bb925f8832696f86ba67367bcd6478fc1956ade4 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Tue, 5 Mar 2019 15:57:51 +0800
Subject: [PATCH 151/249] 5.0.0 versions.json

---
 docs/static/versions.json | 9 +--------
 1 file changed, 1 insertion(+), 8 deletions(-)

diff --git a/docs/static/versions.json b/docs/static/versions.json
index 0cfc365fd97..9b729fa6f40 100644
--- a/docs/static/versions.json
+++ b/docs/static/versions.json
@@ -1,8 +1 @@
-{
-  "next": {
-    "version": "5.0.0-rc.11",
-    "info": {
-      "plain": "### Bug Fixes\n\n* UI: Fix base theme initialization and theme bootup ([#5843](https://github.com/storybooks/storybook/pull/5843))\n* UI: Fix SidebarItem feels \"laggy\" when clicked ([#5850](https://github.com/storybooks/storybook/pull/5850))"
-    }
-  }
-}
+{"next":{"version":"5.0.0-rc.11","info":{"plain":"### Bug Fixes\n\n* UI: Fix base theme initialization and theme bootup ([#5843](https://github.com/storybooks/storybook/pull/5843))\n* UI: Fix SidebarItem feels \"laggy\" when clicked ([#5850](https://github.com/storybooks/storybook/pull/5850))"}},"latest":{"version":"5.0.0","info":{"plain":"Storybook 5.0 is a completely new UI with the following improvements:\n\n- 🌓 New design with light and dark themes\n- 🛠 Canvas toolbar for easy access to addons\n- 🗺 Overhauled navigation sidebar with an intuitive menu\n- 🗜 Redesigned addons panel with handy buttons to toggle visibility and orientation\n- ⌨️ Improved keyboard shortcuts that are user configurable\n- 🌍 New URL structure that eliminates long strings of query parameters\n\n5.0 contains hundreds more fixes, features, and tweaks. Browse the changelogs matching `5.0.0-alpha.*`, `5.0.0-beta.*`, and `5.0.0-rc.*` for the full list of changes. See [MIGRATION.md](./MIGRATION.md) to ugprade from `4.x`."}}}
\ No newline at end of file

From 9f26f31bc91a2584771ce873e18e448f283ddc35 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Tue, 5 Mar 2019 16:23:43 +0800
Subject: [PATCH 152/249] Remove generated versions.json stub

---
 docs/gatsby-node.js | 22 ----------------------
 1 file changed, 22 deletions(-)

diff --git a/docs/gatsby-node.js b/docs/gatsby-node.js
index 39c0f7c7e71..20b1735765f 100644
--- a/docs/gatsby-node.js
+++ b/docs/gatsby-node.js
@@ -3,7 +3,6 @@
 const fs = require('fs');
 const path = require('path');
 const sm = require('sitemap');
-const stripIndent = require('common-tags/lib/stripIndent');
 
 function pagesToSitemap(pages) {
   return pages
@@ -24,26 +23,6 @@ function generateSitemap(pages) {
   fs.writeFileSync(`${__dirname}/public/sitemap.xml`, sitemap.toString());
 }
 
-const generateVersionsFile = () => {
-  // TODO: hard-coded for now
-  // must be generated from pr-log / CHANGELOG.md
-  const data = {
-    latest: {
-      version: '4.0.0',
-      info: {
-        plain: stripIndent`
-          - upgrade webpack & babel to latest
-          - new addParameters and third argument to .add to pass data to addons
-          - added the ability to theme storybook
-          - improved ui for mobile devices
-          - improved performance of addon-knobs
-        `,
-      },
-    },
-  };
-  fs.writeFileSync(`${__dirname}/public/versions.json`, JSON.stringify(data));
-};
-
 module.exports = {
   async onPostBuild({ graphql }) {
     const result = await graphql(`
@@ -57,7 +36,6 @@ module.exports = {
         }
       }
     `);
-    generateVersionsFile();
     generateSitemap(result.data.allSitePage.edges.map(({ node }) => node));
   },
   onCreateNode({ node, boundActionCreators, getNode }) {

From 55b5622e1cf7c1118c2a48eefc4a1efd4e5ae8c3 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Tue, 5 Mar 2019 16:56:51 +0800
Subject: [PATCH 153/249] Update MIGRATION.md link

---
 CHANGELOG.md              |  2 +-
 docs/static/versions.json | 15 ++++++++++++++-
 2 files changed, 15 insertions(+), 2 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 1156ff98f61..54b3d24953b 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -9,7 +9,7 @@ Storybook 5.0 is a completely new UI with the following improvements:
 - ⌨️ Improved keyboard shortcuts that are user configurable
 - 🌍 New URL structure that eliminates long strings of query parameters
 
-5.0 contains hundreds more fixes, features, and tweaks. Browse the changelogs matching `5.0.0-alpha.*`, `5.0.0-beta.*`, and `5.0.0-rc.*` for the full list of changes. See [MIGRATION.md](./MIGRATION.md) to ugprade from `4.x`.
+5.0 contains hundreds more fixes, features, and tweaks. Browse the changelogs matching `5.0.0-alpha.*`, `5.0.0-beta.*`, and `5.0.0-rc.*` for the full list of changes. See [MIGRATION.md](https://github.com/storybooks/storybook/blob/next/MIGRATION.md) to ugprade from `4.x`.
 
 ## 5.0.0-rc.11 (March 5, 2019)
 
diff --git a/docs/static/versions.json b/docs/static/versions.json
index 9b729fa6f40..fae9ae04439 100644
--- a/docs/static/versions.json
+++ b/docs/static/versions.json
@@ -1 +1,14 @@
-{"next":{"version":"5.0.0-rc.11","info":{"plain":"### Bug Fixes\n\n* UI: Fix base theme initialization and theme bootup ([#5843](https://github.com/storybooks/storybook/pull/5843))\n* UI: Fix SidebarItem feels \"laggy\" when clicked ([#5850](https://github.com/storybooks/storybook/pull/5850))"}},"latest":{"version":"5.0.0","info":{"plain":"Storybook 5.0 is a completely new UI with the following improvements:\n\n- 🌓 New design with light and dark themes\n- 🛠 Canvas toolbar for easy access to addons\n- 🗺 Overhauled navigation sidebar with an intuitive menu\n- 🗜 Redesigned addons panel with handy buttons to toggle visibility and orientation\n- ⌨️ Improved keyboard shortcuts that are user configurable\n- 🌍 New URL structure that eliminates long strings of query parameters\n\n5.0 contains hundreds more fixes, features, and tweaks. Browse the changelogs matching `5.0.0-alpha.*`, `5.0.0-beta.*`, and `5.0.0-rc.*` for the full list of changes. See [MIGRATION.md](./MIGRATION.md) to ugprade from `4.x`."}}}
\ No newline at end of file
+{
+  "next": {
+    "version": "5.0.0-rc.11",
+    "info": {
+      "plain": "### Bug Fixes\n\n* UI: Fix base theme initialization and theme bootup ([#5843](https://github.com/storybooks/storybook/pull/5843))\n* UI: Fix SidebarItem feels \"laggy\" when clicked ([#5850](https://github.com/storybooks/storybook/pull/5850))"
+    }
+  },
+  "latest": {
+    "version": "5.0.0",
+    "info": {
+      "plain": "Storybook 5.0 is a completely new UI with the following improvements:\n\n- 🌓 New design with light and dark themes\n- 🛠 Canvas toolbar for easy access to addons\n- 🗺 Overhauled navigation sidebar with an intuitive menu\n- 🗜 Redesigned addons panel with handy buttons to toggle visibility and orientation\n- ⌨️ Improved keyboard shortcuts that are user configurable\n- 🌍 New URL structure that eliminates long strings of query parameters\n\n5.0 contains hundreds more fixes, features, and tweaks. Browse the changelogs matching `5.0.0-alpha.*`, `5.0.0-beta.*`, and `5.0.0-rc.*` for the full list of changes. See [MIGRATION.md](https://github.com/storybooks/storybook/blob/next/MIGRATION.md) to ugprade from `4.x`."
+    }
+  }
+}

From 661481a05801c77992ed0f27e0cc3d0b0ce25b1d Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Tue, 5 Mar 2019 10:02:50 +0100
Subject: [PATCH 154/249] FIX an issue when re-rendering lit-html elements
 after rendering a non-lit-html element

It seems the mountNode becomes stateful after a render has occurred in lit-html.
Since storybook is changing the dom beyond lit-html, it gets "confused" and throws an error because it's unable to remove
some nodes. I guess it's trying to do reconciliation or cleanup, and it's missing state or it's state is inconsistent
with the actual dom.

By adding a extra inner root node that gets reset when switching stories we make lit-html mount correctly
---
 app/polymer/src/client/preview/render.js | 10 +++++++---
 1 file changed, 7 insertions(+), 3 deletions(-)

diff --git a/app/polymer/src/client/preview/render.js b/app/polymer/src/client/preview/render.js
index c290eb4dc37..872d8eb7a9f 100644
--- a/app/polymer/src/client/preview/render.js
+++ b/app/polymer/src/client/preview/render.js
@@ -1,6 +1,6 @@
 import { document } from 'global';
 import { stripIndents } from 'common-tags';
-import { html, render, TemplateResult } from 'lit-html';
+import { render, TemplateResult } from 'lit-html';
 
 const rootElement = document.getElementById('root');
 
@@ -33,9 +33,13 @@ export default function renderMain({
     // Since we reuse `rootElement` for all stories, remove the stored instance first.
     // But forceRender means that it's the same story, so we want too keep the state in that case.
     if (!forceRender) {
-      render(html``, rootElement);
+      rootElement.innerHTML = '<div id="root-inner"></div>';
+    } else if (!rootElement.querySelector('[id="root-inner"]')) {
+      rootElement.innerHTML = '<div id="root-inner"></div>';
     }
-    render(element, rootElement);
+    const renderTo = rootElement.querySelector('[id="root-inner"]');
+
+    render(element, renderTo);
   } else {
     rootElement.innerHTML = '';
     rootElement.appendChild(element);

From 4a421c52048bf78151f6bb676ac8e1b704606a96 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Tue, 5 Mar 2019 21:07:14 +0800
Subject: [PATCH 155/249] Fix home link in header

---
 docs/src/components/Header/index.js | 38 +++++++++++++++++++++++++----
 1 file changed, 33 insertions(+), 5 deletions(-)

diff --git a/docs/src/components/Header/index.js b/docs/src/components/Header/index.js
index 27f8e2ea7d5..457893f74d3 100644
--- a/docs/src/components/Header/index.js
+++ b/docs/src/components/Header/index.js
@@ -1,16 +1,44 @@
 import PropTypes from 'prop-types';
 import React from 'react';
-import Link from 'gatsby-link';
+import GatsbyLink from 'gatsby-link';
 import './style.css';
 
 import storybookLogo from '../../design/homepage/storybook-logo.svg';
 
+const home = 'https://storybook.js.org/';
+
 const sections = [
-  { id: 'home', caption: 'Home', href: '/' },
+  { id: 'home', caption: 'Home', href: home },
   { id: 'docs', caption: 'Docs', href: '/basics/introduction/' },
   { id: 'examples', caption: 'Examples', href: '/examples/' },
 ];
 
+const Link = ({ children, to, ...other }) => {
+  // Tailor the following test to your environment.
+  // This example assumes that any internal link (intended for Gatsby)
+  // will start with exactly one slash, and that anything else is external.
+  const internal = /^\/(?!\/)/.test(to);
+
+  // Use Gatsby Link for internal links, and <a> for others
+  if (internal) {
+    return (
+      <GatsbyLink to={to} {...other}>
+        {children}
+      </GatsbyLink>
+    );
+  }
+  return (
+    <a href={to} {...other}>
+      {children}
+    </a>
+  );
+};
+
+Link.propTypes = {
+  children: PropTypes.node.isRequired,
+  to: PropTypes.string.isRequired,
+};
+
 class Header extends React.Component {
   renderSections() {
     return sections.map(section => {
@@ -18,7 +46,7 @@ class Header extends React.Component {
       const className = currentSection === section.id ? 'selected' : '';
 
       return (
-        <Link className={className} key={section.href} to={section.href}>
+        <Link className={className} key={section.id} to={section.href}>
           {section.caption}
         </Link>
       );
@@ -36,9 +64,9 @@ class Header extends React.Component {
       <div id="header" className="row">
         <div className="col-xs-12 col-md-12">
           <div id="header-title" className={titleClassname}>
-            <a href="https://storybook.js.org/">
+            <Link to={home}>
               <img className="sb-title" src={storybookLogo} alt="Storybook Logo" />
-            </a>
+            </Link>
           </div>
           <div id="header-links" className="float-right">
             {this.renderSections()}

From 0b516044e056ec8611e291a1a59d791ef2e82e2d Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Tue, 5 Mar 2019 21:55:32 +0800
Subject: [PATCH 156/249] Remove addons gallery, examples

---
 docs/gatsby-config.js                         |  1 -
 docs/src/components/Header/index.js           |  1 -
 .../components/Homepage/MainLinks/index.js    |  3 -
 docs/src/design/homepage/storybook-logo.svg   | 46 +-------------
 docs/src/pages/addons/introduction/index.md   | 60 ++++++++-----------
 docs/src/pages/addons/using-addons/index.md   |  2 +-
 docs/src/pages/addons/writing-addons/index.md |  2 +-
 7 files changed, 27 insertions(+), 88 deletions(-)

diff --git a/docs/gatsby-config.js b/docs/gatsby-config.js
index 3b807525588..dd8c2b8429c 100644
--- a/docs/gatsby-config.js
+++ b/docs/gatsby-config.js
@@ -45,7 +45,6 @@ module.exports = {
       addons: [
         '/addons/introduction/',
         '/addons/using-addons/',
-        '/addons/addon-gallery/',
         '/addons/writing-addons/',
         '/addons/api/',
       ],
diff --git a/docs/src/components/Header/index.js b/docs/src/components/Header/index.js
index 457893f74d3..aead7e4bc8b 100644
--- a/docs/src/components/Header/index.js
+++ b/docs/src/components/Header/index.js
@@ -10,7 +10,6 @@ const home = 'https://storybook.js.org/';
 const sections = [
   { id: 'home', caption: 'Home', href: home },
   { id: 'docs', caption: 'Docs', href: '/basics/introduction/' },
-  { id: 'examples', caption: 'Examples', href: '/examples/' },
 ];
 
 const Link = ({ children, to, ...other }) => {
diff --git a/docs/src/components/Homepage/MainLinks/index.js b/docs/src/components/Homepage/MainLinks/index.js
index 2a82ba7feed..1ea0711c736 100644
--- a/docs/src/components/Homepage/MainLinks/index.js
+++ b/docs/src/components/Homepage/MainLinks/index.js
@@ -129,9 +129,6 @@ class MainLinks extends React.Component {
                 <li>
                   <Link to="/addons/using-addons/">Using Addons</Link>
                 </li>
-                <li>
-                  <Link to="/addons/addon-gallery/">Addon Gallery</Link>
-                </li>
                 <li>
                   <Link to="/addons/writing-addons/">Writing Addons</Link>
                 </li>
diff --git a/docs/src/design/homepage/storybook-logo.svg b/docs/src/design/homepage/storybook-logo.svg
index fe5e4f5ebff..6a7bc610ca2 100755
--- a/docs/src/design/homepage/storybook-logo.svg
+++ b/docs/src/design/homepage/storybook-logo.svg
@@ -1,45 +1 @@
-<svg width="2040" height="576" viewBox="0 0 2040 576" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-<title>storybook-logo-final</title>
-<desc>Created using Figma</desc>
-<g id="Canvas" transform="matrix(2 0 0 2 -4322 -506)">
-<clipPath id="clip-0" clip-rule="evenodd">
-<path d="M 2161 253L 3181 253L 3181 541L 2161 541L 2161 253Z" fill="#FFFFFF"/>
-</clipPath>
-<g id="storybook-logo-final" clip-path="url(#clip-0)">
-<g id="Group">
-<g id="Vector">
-<use xlink:href="#path0_fill" transform="translate(2166 275)" fill="#B57EE5"/>
-</g>
-<g id="Vector">
-<use xlink:href="#path1_fill" transform="translate(2180 261)" fill="#F1618C"/>
-</g>
-<g id="Vector 2">
-<use xlink:href="#path2_fill" transform="translate(2326 261.5)" fill="#FFFFFF"/>
-</g>
-<g id="torybook">
-<use xlink:href="#path3_fill" transform="translate(2393 300)" fill="#6DABF5"/>
-<use xlink:href="#path4_fill" transform="translate(2393 300)" fill="#F3AD38"/>
-<use xlink:href="#path5_fill" transform="translate(2393 300)" fill="#B57EE6"/>
-<use xlink:href="#path6_fill" transform="translate(2393 300)" fill="#F16161"/>
-<use xlink:href="#path7_fill" transform="translate(2393 300)" fill="#B57EE5"/>
-<use xlink:href="#path8_fill" transform="translate(2393 300)" fill="#A2E05E"/>
-</g>
-<g id="S">
-<use xlink:href="#path9_fill" transform="translate(2220 301)" fill="#FFFFFF"/>
-</g>
-</g>
-</g>
-</g>
-<defs>
-<path id="path0_fill" d="M 21 246L 9 0L 0 0L 9 246L 21 246Z"/>
-<path id="path1_fill" d="M 12 260L 0 14L 196 0L 196 269L 12 260Z"/>
-<path id="path2_fill" d="M 0 35.5L 2.5 2L 26 0L 26 35.5L 14.1818 24.8091L 0 35.5Z"/>
-<path id="path3_fill" d="M 347.041 57.2L 314.261 57.2C 314.261 63.36 314.261 69.52 314.261 75.46C 314.261 99 314.041 117.92 314.041 117.92C 314.041 129.58 309.201 132.66 303.041 132.66C 296.661 132.66 293.361 129.8 293.361 117.48C 293.361 99.44 294.681 63.8 294.681 63.8L 261.901 62.92C 261.901 62.48 260.801 90.2 260.801 122.98C 260.801 155.76 281.481 158.18 290.941 158.18C 299.961 158.18 309.861 154.66 315.141 148.94C 315.141 167.64 309.201 173.8 296.001 173.8C 287.641 173.8 277.521 169.62 272.021 165L 272.021 195.14C 281.261 200.64 291.601 203.06 301.941 203.06C 323.941 203.06 345.501 190.3 345.941 153.56C 346.601 112.64 346.821 71.72 347.041 57.2ZM 512.591 56.98C 479.151 56.98 464.851 83.82 464.851 115.72C 464.851 142.78 478.051 163.02 509.511 163.02C 544.711 163.02 557.251 136.62 557.251 106.04C 557.251 77.66 544.931 56.98 512.591 56.98ZM 524.251 110.22C 524.251 124.52 519.411 135.52 509.511 135.52C 501.151 135.52 497.851 125.84 497.851 115.72C 497.851 99.44 503.571 86.9 512.591 86.9C 521.831 86.9 524.251 99 524.251 110.22Z"/>
-<path id="path4_fill" d="M 20.68 163.24C 37.62 163.46 53.9 161.26 53.9 161.26C 53.9 132.44 53.9 105.38 54.12 84.92C 62.92 84.04 70.18 82.94 70.18 82.94C 70.62 69.08 69.52 56.54 69.52 56.54L 54.56 57.42C 55 36.52 55.44 25.74 55.44 25.74L 20.24 27.94C 20.24 27.94 20.24 40.92 20.46 60.72C 9.68 62.04 1.76 64.24 1.76 64.24C 2.2 75.9 6.38 88.44 6.38 88.44L 20.68 87.78L 20.68 163.24Z"/>
-<path id="path5_fill" d="M 219.276 70.62C 219.276 67.32 219.496 63.8 219.716 60.28L 189.136 59.18C 189.136 59.18 186.276 104.06 186.496 163.02C 201.236 164.12 218.396 164.12 218.396 164.12C 218.176 164.12 218.396 144.54 219.276 115.06C 219.716 97.9 225.876 92.62 235.116 92.62C 240.616 92.62 247.436 95.04 247.436 95.04L 250.956 64.46C 236.656 59.62 223.456 63.8 219.276 70.62Z"/>
-<path id="path6_fill" d="M 396.026 162.58C 396.026 157.74 396.466 153.34 396.466 151.58C 400.206 157.08 407.466 161.92 416.486 161.92C 441.786 161.92 452.786 137.06 453.446 107.58C 453.886 79.64 443.326 56.32 420.006 56.32C 411.426 56.32 404.166 60.94 400.206 65.78C 402.186 33 403.726 12.1 403.726 12.1L 370.506 9.68001C 368.526 32.56 365.446 108.24 365.886 163.46C 385.026 163.9 396.026 162.58 396.026 162.58ZM 398.006 118.8C 397.566 112.86 396.466 86.46 409.226 86.46C 418.246 86.46 420.446 97.46 420.006 108.46C 419.786 120.34 417.366 133.76 408.126 133.76C 401.746 133.76 398.666 129.14 398.006 118.8Z"/>
-<path id="path7_fill" d="M 776.409 64.24L 741.869 59.62C 741.869 59.62 729.989 77.44 713.269 97.9C 715.909 51.04 719.209 19.58 719.209 19.58L 683.349 16.28C 683.349 16.28 679.389 97.68 678.509 162.36C 693.469 164.12 710.849 164.12 710.849 164.12L 711.949 125.4C 728.229 143.88 746.489 163.02 746.489 163.02L 784.549 156.86C 762.549 134.86 747.589 119.46 740.329 109.78C 748.689 98.56 763.649 80.74 776.409 64.24Z"/>
-<path id="path8_fill" d="M 126.088 56.98C 92.6475 56.98 78.3475 83.82 78.3475 115.72C 78.3475 142.78 91.5475 163.02 123.008 163.02C 158.208 163.02 170.748 136.62 170.748 106.04C 170.748 77.66 158.427 56.98 126.088 56.98ZM 137.748 110.22C 137.748 124.52 132.907 135.52 123.008 135.52C 114.648 135.52 111.348 125.84 111.348 115.72C 111.348 99.44 117.067 86.9 126.088 86.9C 135.328 86.9 137.748 99 137.748 110.22ZM 617.22 56.98C 583.78 56.98 569.48 83.82 569.48 115.72C 569.48 142.78 582.68 163.02 614.14 163.02C 649.34 163.02 661.88 136.62 661.88 106.04C 661.88 77.66 649.56 56.98 617.22 56.98ZM 628.88 110.22C 628.88 124.52 624.04 135.52 614.14 135.52C 605.78 135.52 602.48 125.84 602.48 115.72C 602.48 99.44 608.2 86.9 617.22 86.9C 626.46 86.9 628.88 99 628.88 110.22Z"/>
-<path id="path9_fill" d="M 74.64 65.28L 113.28 64.32C 114.24 26.88 94.8 8.40001 60.96 8.40001C 27.12 8.40001 8.16 27.6 8.16 56.4C 8.16 106.56 72.96 107.52 72.96 134.88C 72.96 142.56 69.36 147.12 61.44 147.12C 51.12 147.12 47.04 140.4 47.52 121.68L 6.96 121.68C 3.84 168 30.96 178.56 61.92 178.56C 91.92 178.56 115.44 164.64 115.44 134.4C 115.44 80.64 49.68 82.08 49.68 55.44C 49.68 44.64 57.36 43.2 61.92 43.2C 66.72 43.2 75.36 45.12 74.64 65.28Z"/>
-</defs>
-</svg>
+<svg width="200px" height="40px" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><path d="M1.2405585 36.8586756L.00144019 3.84178492c-.04092322-1.09041839.79517056-2.01453526 1.8842316-2.08260158L29.9688501.0039847c1.1085341-.06928338 2.0633439.77319581 2.1326273 1.88172995a2.01111864 2.01111864 0 0 1 .0039164.12544867V37.9889049C32.1053938 39.0996021 31.2049959 40 30.0942987 40a2.01116305 2.01116305 0 0 1-.0902337-.0020253L3.16000504 38.7923224c-1.04546998-.0469554-1.8801983-.8878591-1.91944654-1.9336468z" id="a"/></defs><g fill="none" fill-rule="evenodd"><path d="M53.28 31.663c-1.7066752 0-3.3493254-.229331-4.928-.688-1.5786746-.458669-2.8906614-1.0933293-3.936-1.904l1.6-3.552c2.1760109 1.5146742 4.6186531 2.272 7.328 2.272 1.408007 0 2.4906629-.229331 3.248-.688.7573371-.458669 1.136-1.0933293 1.136-1.904 0-.725337-.3466632-1.2906646-1.04-1.696s-1.9253245-.7999981-3.696-1.184c-1.9840099-.4053354-3.5679941-.8959971-4.752-1.472-1.1840059-.5760029-2.0479973-1.2853291-2.592-2.128-.5440027-.8426709-.816-1.8826605-.816-3.12 0-1.3653402.3786629-2.581328 1.136-3.648.7573371-1.066672 1.8186598-1.903997 3.184-2.512 1.3653402-.60800304 2.943991-.912 4.736-.912 1.600008 0 3.1413259.23466432 4.624.704 1.4826741.46933568 2.661329 1.0986627 3.536 1.888l-1.6 3.552c-2.0693437-1.5146742-4.2453219-2.272-6.528-2.272-1.3013398 0-2.3253296.2506642-3.072.752-.7466704.5013358-1.12 1.189329-1.12 2.064 0 .5120026.1439986.9333317.432 1.264.2880014.3306683.7679966.6239987 1.44.88.6720034.2560013 1.6266605.5226653 2.864.8 2.9013478.6400032 4.9866603 1.4613283 6.256 2.464 1.2693397 1.0026717 1.904 2.3893245 1.904 4.16 0 2.133344-.8213251 3.8133272-2.464 5.04-1.6426749 1.2266728-3.9359853 1.84-6.88 1.84zm20.928-3.584c.4906691 0 1.002664-.0319997 1.536-.096l-.256 3.52c-.6186698.0853338-1.2373302.128-1.856.128-2.3893453 0-4.1333278-.5226614-5.232-1.568-1.0986722-1.0453386-1.648-2.634656-1.648-4.768v-6.016h-2.976v-3.616h2.976v-4.608h4.832v4.608h3.936v3.616h-3.936v5.984c0 1.8773427.8746579 2.816 2.624 2.816zm11.232 3.552c-1.6640083 0-3.125327-.3359966-4.384-1.008-1.258673-.6720034-2.2293299-1.6213272-2.912-2.848-.6826701-1.2266728-1.024-2.6719917-1.024-4.336 0-1.6640083.3413299-3.1093272 1.024-4.336.6826701-1.2266728 1.653327-2.1706634 2.912-2.832 1.258673-.6613366 2.7199917-.992 4.384-.992 1.6640083 0 3.125327.3306634 4.384.992 1.258673.6613366 2.2293299 1.6053272 2.912 2.832.6826701 1.2266728 1.024 2.6719917 1.024 4.336 0 1.6640083-.3413299 3.1093272-1.024 4.336-.6826701 1.2266728-1.653327 2.1759966-2.912 2.848-1.258673.6720034-2.7199917 1.008-4.384 1.008zm0-3.68c2.3466784 0 3.52-1.503985 3.52-4.512 0-1.5146742-.303997-2.6453296-.912-3.392-.608003-.7466704-1.4773277-1.12-2.608-1.12-2.3466784 0-3.52 1.503985-3.52 4.512 0 3.008015 1.1733216 4.512 3.52 4.512zm21.696-8.704l-2.72.288c-1.344007.1280006-2.293331.5066635-2.848 1.136-.554669.6293365-.832 1.4666614-.832 2.512v8.192h-4.832V15.663h4.64v2.656c.789337-1.8133424 2.421321-2.8053325 4.896-2.976l1.408-.096.288 4zm14.04-3.552h4.736l-9.472 21.44h-4.896l3.008-6.624-6.464-14.816h5.024l3.968 9.984 4.096-9.984zm15.936-.416c1.36534 0 2.570661.3306634 3.616.992 1.045339.6613366 1.86133 1.6053272 2.448 2.832.58667 1.2266728.88 2.6506586.88 4.272 0 1.6213414-.29333 3.0559938-.88 4.304-.58667 1.2480062-1.407995 2.2186632-2.464 2.912-1.056005.6933368-2.255993 1.04-3.6 1.04-1.088005 0-2.069329-.229331-2.944-.688-.874671-.458669-1.546664-1.0933293-2.016-1.904v2.336h-4.768V8.815h4.832v8.96c.469336-.7893373 1.135996-1.4026645 2-1.84.864004-.4373355 1.829328-.656 2.896-.656zm-1.408 12.672c1.130672 0 2.00533-.399996 2.624-1.2.61867-.800004.928-1.9253261.928-3.376 0-1.4293405-.30933-2.5226629-.928-3.28s-1.493328-1.136-2.624-1.136c-1.130672 0-2.00533.3893294-2.624 1.168-.61867.7786706-.928 1.8826595-.928 3.312 0 1.4506739.30933 2.5653294.928 3.344.61867.7786706 1.493328 1.168 2.624 1.168zm18.848 3.68c-1.664008 0-3.125327-.3359966-4.384-1.008-1.258673-.6720034-2.22933-1.6213272-2.912-2.848-.68267-1.2266728-1.024-2.6719917-1.024-4.336 0-1.6640083.34133-3.1093272 1.024-4.336.68267-1.2266728 1.653327-2.1706634 2.912-2.832 1.258673-.6613366 2.719992-.992 4.384-.992 1.664008 0 3.125327.3306634 4.384.992 1.258673.6613366 2.22933 1.6053272 2.912 2.832.68267 1.2266728 1.024 2.6719917 1.024 4.336 0 1.6640083-.34133 3.1093272-1.024 4.336-.68267 1.2266728-1.653327 2.1759966-2.912 2.848-1.258673.6720034-2.719992 1.008-4.384 1.008zm0-3.68c2.346678 0 3.52-1.503985 3.52-4.512 0-1.5146742-.303997-2.6453296-.912-3.392-.608003-.7466704-1.477328-1.12-2.608-1.12-2.346678 0-3.52 1.503985-3.52 4.512 0 3.008015 1.173322 4.512 3.52 4.512zm18.016 3.68c-1.664008 0-3.125327-.3359966-4.384-1.008-1.258673-.6720034-2.22933-1.6213272-2.912-2.848-.68267-1.2266728-1.024-2.6719917-1.024-4.336 0-1.6640083.34133-3.1093272 1.024-4.336.68267-1.2266728 1.653327-2.1706634 2.912-2.832 1.258673-.6613366 2.719992-.992 4.384-.992 1.664008 0 3.125327.3306634 4.384.992 1.258673.6613366 2.22933 1.6053272 2.912 2.832.68267 1.2266728 1.024 2.6719917 1.024 4.336 0 1.6640083-.34133 3.1093272-1.024 4.336-.68267 1.2266728-1.653327 2.1759966-2.912 2.848-1.258673.6720034-2.719992 1.008-4.384 1.008zm0-3.68c2.346678 0 3.52-1.503985 3.52-4.512 0-1.5146742-.303997-2.6453296-.912-3.392-.608003-.7466704-1.477328-1.12-2.608-1.12-2.346678 0-3.52 1.503985-3.52 4.512 0 3.008015 1.173322 4.512 3.52 4.512zM200 31.375h-5.92l-6.016-7.008v7.008h-4.832V8.815h4.832v13.568l5.792-6.688h5.76l-6.592 7.488L200 31.375z" fill="#333"/><mask id="b" fill="#fff"><use xlink:href="#a"/></mask><use fill="#FF4785" fill-rule="nonzero" xlink:href="#a"/><path d="M23.7074082 4.91663721l.1918233-4.61361355L27.7558963 0l.1661482 4.75786009c.0057823.1655845-.1237629.30450476-.2893474.3102871-.0709012.00247592-.1403856-.02025507-.1961149-.06415663l-1.4872539-1.17160554L24.1884561 5.168114c-.1320039.10013302-.3201881.07429656-.4203211-.05770737-.0421511-.0555671-.0636242-.12408429-.0607268-.19376942zM18.7751036 15.0765471c0 .7824336 5.2703662.4074336 5.9778665-.1421721 0-5.32818604-2.8589797-8.12806396-8.094254-8.12806396-5.2352744 0-8.16851322 2.84344015-8.16851322 7.10860256 0 7.4284913 10.02499342 7.5706634 10.02499342 11.6225677 0 1.1373767-.556944 1.8126941-1.782221 1.8126941-1.596573 0-2.2277763-.8153808-2.1535171-3.5877364 0-.6014263-6.08925532-.7889263-6.27490335 0-.47273546 6.7184043 3.71296055 8.65625 8.50267965 8.65625 4.6412007 0 8.279902-2.4738731 8.279902-6.9522937 0-7.9616366-10.1735119-7.7483785-10.1735119-11.6936537 0-1.599436 1.1881474-1.8126941 1.8936099-1.8126941.7425921 0 2.0792579.1308859 1.9678691 3.1164996z" fill="#FFF" fill-rule="nonzero" mask="url(#b)"/></g></svg>
\ No newline at end of file
diff --git a/docs/src/pages/addons/introduction/index.md b/docs/src/pages/addons/introduction/index.md
index 63f5a5fa891..8ec62a2348a 100644
--- a/docs/src/pages/addons/introduction/index.md
+++ b/docs/src/pages/addons/introduction/index.md
@@ -19,11 +19,7 @@ For example, let's say we want to center a story rendered on the screen. For tha
 const styles = {
   textAlign: 'center',
 };
-const Center = ({ children }) => (
-  <div style={styles}>
-    { children }
-  </div>
-);
+const Center = ({ children }) => <div style={styles}>{children}</div>;
 ```
 
 Then we can use it when writing stories.
@@ -35,12 +31,11 @@ import { action } from '@storybook/addon-actions';
 import Center from './center';
 import Button from './button';
 
-storiesOf('Button', module)
-  .add('with text', () => (
-    <Center>
-      <Button onClick={action('clicked')}>Hello Button</Button>
-    </Center>
-  ));
+storiesOf('Button', module).add('with text', () => (
+  <Center>
+    <Button onClick={action('clicked')}>Hello Button</Button>
+  </Center>
+));
 ```
 
 ### Storybook Decorators
@@ -56,19 +51,17 @@ import Button from './button';
 const styles = {
   textAlign: 'center',
 };
-const CenterDecorator = (storyFn) => (
-  <div style={styles}>
-    { storyFn() }
-  </div>
-);
+const CenterDecorator = storyFn => <div style={styles}>{storyFn()}</div>;
 
 storiesOf('Button', module)
   .addDecorator(CenterDecorator)
-  .add('with text', () => (
-    <Button onClick={action('clicked')}>Hello Button</Button>
-  ))
+  .add('with text', () => <Button onClick={action('clicked')}>Hello Button</Button>)
   .add('with some emojies', () => (
-    <Button onClick={action('clicked')}><span role="img" aria-label="so cool">😀 😎 👍 💯</span></Button>
+    <Button onClick={action('clicked')}>
+      <span role="img" aria-label="so cool">
+        😀 😎 👍 💯
+      </span>
+    </Button>
   ));
 ```
 
@@ -85,24 +78,19 @@ import Welcome from './welcome';
 const styles = {
   textAlign: 'center',
 };
-const CenterDecorator = (storyFn) => (
-  <div style={styles}>
-    { storyFn() }
-  </div>
-);
+const CenterDecorator = storyFn => <div style={styles}>{storyFn()}</div>;
 addDecorator(CenterDecorator);
 
-storiesOf('Welcome', module)
-  .add('to Storybook', () => (
-    <Welcome showApp={linkTo('Button')}/>
-  ));
+storiesOf('Welcome', module).add('to Storybook', () => <Welcome showApp={linkTo('Button')} />);
 
 storiesOf('Button', module)
-  .add('with text', () => (
-    <Button onClick={action('clicked')}>Hello Button</Button>
-  ))
+  .add('with text', () => <Button onClick={action('clicked')}>Hello Button</Button>)
   .add('with some emojies', () => (
-    <Button onClick={action('clicked')}><span role="img" aria-label="so cool">😀 😎 👍 💯</span></Button>
+    <Button onClick={action('clicked')}>
+      <span role="img" aria-label="so cool">
+        😀 😎 👍 💯
+      </span>
+    </Button>
   ));
 ```
 
@@ -120,6 +108,6 @@ It will allow you to inspect the parameters of any event of your components.
 
 See the following links to learn more about native addons:
 
--   [Using addons](/addons/using-addons)
--   [Addon gallery](/addons/addon-gallery)
--   [Write your own addon](/addons/writing-addons)
+- [Using addons](/addons/using-addons)
+- [Addon gallery](https://storybook.js.org/addons/)
+- [Write your own addon](/addons/writing-addons)
diff --git a/docs/src/pages/addons/using-addons/index.md b/docs/src/pages/addons/using-addons/index.md
index a74bc728e9c..e8b547f6a55 100644
--- a/docs/src/pages/addons/using-addons/index.md
+++ b/docs/src/pages/addons/using-addons/index.md
@@ -75,4 +75,4 @@ addParameters({
 
 Here's an example of a [production-ready config file](https://github.com/storybooks/storybook/blob/next/examples/cra-kitchen-sink/.storybook/config.js) from the cra-kitchen example.
 
-Just like this, you can install any other addon and use it. Have a look at our [addon gallery](/addons/addon-gallery) to discover more addons.
+Just like this, you can install any other addon and use it. Have a look at our [addon gallery](https://storybook.js.org/addons/) to discover more addons.
diff --git a/docs/src/pages/addons/writing-addons/index.md b/docs/src/pages/addons/writing-addons/index.md
index f4037104b5d..4390b2028b1 100644
--- a/docs/src/pages/addons/writing-addons/index.md
+++ b/docs/src/pages/addons/writing-addons/index.md
@@ -30,7 +30,7 @@ With an addon, you can add more functionality to Storybook. Here are a few thing
 - Navigating.
 - Register keyboard shortcuts (coming soon).
 
-With this, you can write some pretty cool addons. Look at our [Addon gallery](/addons/addon-gallery) to have a look at some sample addons.
+With this, you can write some pretty cool addons. Look at our [Addon gallery](https://storybook.js.org/addons/) to have a look at some sample addons.
 
 ## Getting Started
 

From 76343911d9e87ac214dda80f9d2deb59c900fd0c Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Tue, 5 Mar 2019 22:15:36 +0800
Subject: [PATCH 157/249] Fix header links

---
 docs/src/components/Header/index.js  | 11 ++++++-----
 docs/src/components/Header/style.css |  3 +--
 2 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/docs/src/components/Header/index.js b/docs/src/components/Header/index.js
index aead7e4bc8b..4b630f98352 100644
--- a/docs/src/components/Header/index.js
+++ b/docs/src/components/Header/index.js
@@ -8,8 +8,12 @@ import storybookLogo from '../../design/homepage/storybook-logo.svg';
 const home = 'https://storybook.js.org/';
 
 const sections = [
-  { id: 'home', caption: 'Home', href: home },
   { id: 'docs', caption: 'Docs', href: '/basics/introduction/' },
+  { id: 'addons', caption: 'Addons', href: `${home}addons/` },
+  { id: 'community', caption: 'Community', href: `${home}community/` },
+  { id: 'use-cases', caption: 'Use cases', href: `${home}use-cases/` },
+  { id: 'support', caption: 'Support', href: `${home}support/` },
+  { id: 'team', caption: 'Team', href: `${home}team/` },
 ];
 
 const Link = ({ children, to, ...other }) => {
@@ -41,11 +45,8 @@ Link.propTypes = {
 class Header extends React.Component {
   renderSections() {
     return sections.map(section => {
-      const { currentSection } = this.props;
-      const className = currentSection === section.id ? 'selected' : '';
-
       return (
-        <Link className={className} key={section.id} to={section.href}>
+        <Link className="selected" key={section.id} to={section.href}>
           {section.caption}
         </Link>
       );
diff --git a/docs/src/components/Header/style.css b/docs/src/components/Header/style.css
index ec3cb77f4b2..5f16bc88599 100644
--- a/docs/src/components/Header/style.css
+++ b/docs/src/components/Header/style.css
@@ -12,14 +12,13 @@
 
 #header-links a {
   padding-left: 15px;
-  text-transform: uppercase;
+  color: rgb(102, 102, 102);
 }
 
 #header-links a.selected {
   font-weight: 600;
 }
 
-
 @media only screen and (max-width: 540px) {
   #header {
     margin: 50px 0 20px;

From fa27fc409bf37defa2be96de532616378364e945 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Tue, 5 Mar 2019 22:24:52 +0800
Subject: [PATCH 158/249] Footer community link

---
 docs/gatsby-config.js               | 1 -
 docs/src/components/Footer/index.js | 3 +--
 2 files changed, 1 insertion(+), 3 deletions(-)

diff --git a/docs/gatsby-config.js b/docs/gatsby-config.js
index dd8c2b8429c..ac639e25976 100644
--- a/docs/gatsby-config.js
+++ b/docs/gatsby-config.js
@@ -19,7 +19,6 @@ module.exports = {
         '/basics/writing-stories/',
         '/basics/exporting-storybook/',
         '/basics/faq/',
-        '/basics/community/',
         '/basics/live-examples/',
       ],
       configurations: [
diff --git a/docs/src/components/Footer/index.js b/docs/src/components/Footer/index.js
index 8c88f57cfe5..92b9411936a 100644
--- a/docs/src/components/Footer/index.js
+++ b/docs/src/components/Footer/index.js
@@ -1,5 +1,4 @@
 import React from 'react';
-import Link from 'gatsby-link';
 import slackIcon from './images/slack-icon.png';
 import githubIcon from './images/github-icon.png';
 import './style.css';
@@ -10,7 +9,7 @@ const Footer = () => (
       <div className="logos">
         <div className="col-xs-12">
           <center>
-            Maintained by the <Link to="/basics/community/">Storybook Community</Link>.
+            Maintained by the <a href="https://storybook.js.org/community/">Storybook Community</a>.
           </center>
           <center>
             <a

From 2111fbec04751da1b32da39879c4f0259dc06f26 Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Tue, 5 Mar 2019 16:02:52 +0100
Subject: [PATCH 159/249] SYNC header from new site

---
 docs/package.json                             |  14 +-
 docs/src/components/Docs/index.js             |   3 +-
 .../components/Homepage/MainLinks/index.js    |   4 +-
 docs/src/css/main.css                         |   4 +-
 docs/src/new-components/basics/Icon.js        |  28 ++
 docs/src/new-components/basics/Link.js        | 162 ++++++++++
 docs/src/new-components/basics/ListItem.js    | 176 ++++++++++
 docs/src/new-components/basics/index.js       |  17 +
 .../new-components/basics/shared/animation.js |  60 ++++
 .../new-components/basics/shared/global.js    | 122 +++++++
 .../src/new-components/basics/shared/icons.js | 306 ++++++++++++++++++
 docs/src/new-components/basics/shared/site.js |  93 ++++++
 .../new-components/basics/shared/styles.js    |  96 ++++++
 .../new-components/basics/tooltip/Tooltip.js  | 100 ++++++
 .../basics/tooltip/Tooltip.stories.js         |  44 +++
 .../basics/tooltip/TooltipLinkList.js         |  45 +++
 .../basics/tooltip/TooltipLinkList.stories.js |  28 ++
 .../basics/tooltip/TooltipMessage.js          |  70 ++++
 .../basics/tooltip/TooltipMessage.stories.js  |  38 +++
 .../basics/tooltip/TooltipNote.js             |  27 ++
 .../basics/tooltip/TooltipNote.stories.js     |  16 +
 .../basics/tooltip/WithTooltip.js             |  94 ++++++
 .../basics/tooltip/WithTooltip.stories.js     |  87 +++++
 docs/src/new-components/layout/Header.js      | 184 +++++++++++
 docs/src/new-components/layout/PageLayout.js  |  12 +
 .../new-components/lib/StoryLinkWrapper.js    |  29 ++
 docs/static/images/logo-storybook.svg         |   1 +
 docs/yarn.lock                                | 153 ++++++++-
 28 files changed, 2001 insertions(+), 12 deletions(-)
 create mode 100644 docs/src/new-components/basics/Icon.js
 create mode 100644 docs/src/new-components/basics/Link.js
 create mode 100644 docs/src/new-components/basics/ListItem.js
 create mode 100644 docs/src/new-components/basics/index.js
 create mode 100644 docs/src/new-components/basics/shared/animation.js
 create mode 100644 docs/src/new-components/basics/shared/global.js
 create mode 100644 docs/src/new-components/basics/shared/icons.js
 create mode 100644 docs/src/new-components/basics/shared/site.js
 create mode 100644 docs/src/new-components/basics/shared/styles.js
 create mode 100644 docs/src/new-components/basics/tooltip/Tooltip.js
 create mode 100644 docs/src/new-components/basics/tooltip/Tooltip.stories.js
 create mode 100644 docs/src/new-components/basics/tooltip/TooltipLinkList.js
 create mode 100644 docs/src/new-components/basics/tooltip/TooltipLinkList.stories.js
 create mode 100644 docs/src/new-components/basics/tooltip/TooltipMessage.js
 create mode 100644 docs/src/new-components/basics/tooltip/TooltipMessage.stories.js
 create mode 100644 docs/src/new-components/basics/tooltip/TooltipNote.js
 create mode 100644 docs/src/new-components/basics/tooltip/TooltipNote.stories.js
 create mode 100644 docs/src/new-components/basics/tooltip/WithTooltip.js
 create mode 100644 docs/src/new-components/basics/tooltip/WithTooltip.stories.js
 create mode 100644 docs/src/new-components/layout/Header.js
 create mode 100644 docs/src/new-components/layout/PageLayout.js
 create mode 100644 docs/src/new-components/lib/StoryLinkWrapper.js
 create mode 100644 docs/static/images/logo-storybook.svg

diff --git a/docs/package.json b/docs/package.json
index 7a99dfb2da8..7ea328ffd24 100644
--- a/docs/package.json
+++ b/docs/package.json
@@ -39,15 +39,23 @@
     "highlight.js": "^9.14.2",
     "lodash": "^4.17.11",
     "marked": "^0.5.2",
+    "mobx": "^5.9.0",
+    "mobx-react": "^5.4.3",
+    "mobx-react-form": "^1.39.1",
+    "polished": "^3.0.3",
     "prop-types": "^15.7.2",
-    "react": "^15.6.2",
+    "react": "^16.8.3",
     "react-document-title": "^2.0.3",
-    "react-dom": "^15.6.2",
+    "react-dom": "^16.8.3",
     "react-helmet": "^5.2.0",
+    "react-lazyload": "^2.5.0",
+    "react-modal": "^3.8.1",
     "react-router": "^4.3.1",
     "react-stack-grid": "^0.7.1",
     "sitemap": "^2.1.0",
-    "snyk": "^1.134.2"
+    "snyk": "^1.134.2",
+    "styled-components": "^4.1.3",
+    "validatorjs": "^3.15.1"
   },
   "snyk": true
 }
diff --git a/docs/src/components/Docs/index.js b/docs/src/components/Docs/index.js
index df70cfc8ab0..61e1d380471 100644
--- a/docs/src/components/Docs/index.js
+++ b/docs/src/components/Docs/index.js
@@ -2,7 +2,8 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import Helmet from 'react-helmet';
 
-import Header from '../Header';
+// import Header from '../Header';
+import Header from '../../new-components/layout/Header';
 import Container from './Container';
 import Footer from '../Footer';
 import './style.css';
diff --git a/docs/src/components/Homepage/MainLinks/index.js b/docs/src/components/Homepage/MainLinks/index.js
index 2a82ba7feed..3549dce7aeb 100644
--- a/docs/src/components/Homepage/MainLinks/index.js
+++ b/docs/src/components/Homepage/MainLinks/index.js
@@ -78,10 +78,10 @@ class MainLinks extends React.Component {
               </Link>
               <ul>
                 <li>
-                  <Link to="/basics/quick-start-guide/">Quick setup</Link>
+                  <Link to="/guides/quick-start-guide/">Quick setup</Link>
                 </li>
                 <li>
-                  <Link to="/basics/slow-start-guide/">Adding to existing project</Link>
+                  <Link to="/guides/slow-start-guide/">Adding to existing project</Link>
                 </li>
                 <li>
                   <Link to="/basics/writing-stories/">Writing stories</Link>
diff --git a/docs/src/css/main.css b/docs/src/css/main.css
index 32714000f73..f85d624334d 100644
--- a/docs/src/css/main.css
+++ b/docs/src/css/main.css
@@ -1,4 +1,4 @@
-@import 'https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,800';
+/* @import 'https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,800';
 
 body, div, p, ul, li, a {
   font-family: 'Open Sans', sans-serif;
@@ -16,6 +16,6 @@ a:focus {
 
 a:hover {
   opacity: 0.7;
-}
+} */
 
 .github-corner:hover .octo-arm{animation:octocat-wave 560ms ease-in-out}@keyframes octocat-wave{0%,100%{transform:rotate(0)}20%,60%{transform:rotate(-25deg)}40%,80%{transform:rotate(10deg)}}@media (max-width:500px){.github-corner:hover .octo-arm{animation:none}.github-corner .octo-arm{animation:octocat-wave 560ms ease-in-out}}
diff --git a/docs/src/new-components/basics/Icon.js b/docs/src/new-components/basics/Icon.js
new file mode 100644
index 00000000000..a2788d44f13
--- /dev/null
+++ b/docs/src/new-components/basics/Icon.js
@@ -0,0 +1,28 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import styled from 'styled-components';
+import { color } from './shared/styles';
+import icons from './shared/icons';
+
+const Svg = styled.svg`
+  display: inline-block;
+  vertical-align: middle;
+`;
+
+const Path = styled.path`
+  fill: ${color.darkest};
+`;
+
+function Icon({ icon, ...props }) {
+  return (
+    <Svg viewBox="0 0 1024 1024" width="20px" height="20px" {...props}>
+      <Path d={icons[icon]} />
+    </Svg>
+  );
+}
+
+Icon.propTypes = {
+  icon: PropTypes.string.isRequired,
+};
+
+export default Icon;
diff --git a/docs/src/new-components/basics/Link.js b/docs/src/new-components/basics/Link.js
new file mode 100644
index 00000000000..6d6b324e291
--- /dev/null
+++ b/docs/src/new-components/basics/Link.js
@@ -0,0 +1,162 @@
+import React, { Fragment } from 'react';
+import PropTypes from 'prop-types';
+import styled, { css } from 'styled-components';
+import { darken } from 'polished';
+import { color } from './shared/styles';
+
+import Icon from './Icon';
+
+const linkStyles = css`
+  display: inline-block;
+  transition: all 150ms ease-out;
+  text-decoration: none;
+
+  color: ${color.secondary};
+
+  &:hover,
+  &:focus {
+    cursor: pointer;
+    transform: translate3d(0, -1px, 0);
+    color: ${darken(0.07, color.secondary)};
+  }
+  &:active {
+    transform: translate3d(0, 0, 0);
+    color: ${darken(0.1, color.secondary)};
+  }
+
+  ${props =>
+    props.secondary &&
+    css`
+      color: ${color.mediumdark};
+
+      &:hover {
+        color: ${color.dark};
+      }
+
+      &:active {
+        color: ${color.darker};
+      }
+    `};
+
+  ${props =>
+    props.tertiary &&
+    css`
+      color: ${color.dark};
+
+      &:hover {
+        color: ${color.darkest};
+      }
+
+      &:active {
+        color: ${color.mediumdark};
+      }
+    `};
+
+  ${props =>
+    props.nochrome &&
+    css`
+      color: inherit;
+
+      &:hover,
+      &:active {
+        color: inherit;
+        text-decoration: underline;
+      }
+    `};
+
+  ${props =>
+    props.inverse &&
+    css`
+      color: ${color.lightest};
+
+      &:hover {
+        color: ${color.lighter};
+      }
+
+      &:active {
+        color: ${color.light};
+      }
+    `};
+
+  ${props =>
+    props.isButton &&
+    css`
+      border: 0;
+      border-radius: 0;
+      background: none;
+      padding: 0;
+      font-size: inherit;
+    `};
+`;
+
+const LinkInner = styled.span`
+  ${props =>
+    props.withArrow &&
+    css`
+      > svg:last-of-type {
+        height: 0.7em;
+        width: 0.7em;
+        margin-right: 0;
+        margin-left: 0.25em;
+        bottom: auto;
+        vertical-align: inherit;
+      }
+    `};
+
+  ${props =>
+    props.containsIcon &&
+    css`
+      svg {
+        height: 1em;
+        width: 1em;
+        vertical-align: middle;
+        position: relative;
+        bottom: 0;
+        margin-right: 0;
+      }
+    `};
+`;
+
+const LinkWrapper = styled.a`
+  ${linkStyles};
+`;
+
+const LinkGatsby = styled.a`
+  ${linkStyles};
+`;
+const LinkButton = styled.button`
+  ${linkStyles};
+`;
+
+export default function Link({ isGatsby, isButton, withArrow, containsIcon, children, ...props }) {
+  const content = (
+    <Fragment>
+      <LinkInner withArrow={withArrow} containsIcon={containsIcon}>
+        {children}
+        {withArrow && <Icon icon="arrowright" />}
+      </LinkInner>
+    </Fragment>
+  );
+
+  if (isGatsby) {
+    return <LinkGatsby {...props}>{content}</LinkGatsby>;
+  }
+  if (isButton) {
+    return <LinkButton {...props}>{content}</LinkButton>;
+  }
+  return <LinkWrapper {...props}>{content}</LinkWrapper>;
+}
+
+Link.propTypes = {
+  isButton: PropTypes.bool,
+  isGatsby: PropTypes.bool,
+  children: PropTypes.node,
+  withArrow: PropTypes.bool,
+};
+
+Link.defaultProps = {
+  isButton: false,
+  isGatsby: false,
+  children: null,
+  withArrow: false,
+};
diff --git a/docs/src/new-components/basics/ListItem.js b/docs/src/new-components/basics/ListItem.js
new file mode 100644
index 00000000000..318aa62ec35
--- /dev/null
+++ b/docs/src/new-components/basics/ListItem.js
@@ -0,0 +1,176 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import styled, { css } from 'styled-components';
+import { color, typography } from './shared/styles';
+import { inlineGlow } from './shared/animation';
+
+const Left = styled.span``;
+const Title = styled.span`
+  font-weight: ${typography.weight.bold};
+`;
+const Center = styled.span``;
+const Right = styled.span``;
+
+const ItemInner = styled.span`
+  /* Layout */
+  line-height: 18px;
+  padding: 7px 15px;
+  display: flex;
+  align-items: center;
+
+  ${Left}, ${Title}, ${Center}, ${Right} {
+    display: inline-flex;
+  }
+
+  ${Title}, ${Center} {
+    flex: 1;
+  }
+
+  ${Left}, ${Right} {
+    flex: 0 1 auto;
+  }
+
+  ${Right} {
+    text-align: right;
+    margin-left: 20px;
+  }
+`;
+
+const Item = styled.a`
+  font-size: ${typography.size.s1}px;
+  transition: all 150ms ease-out;
+  color: ${color.mediumdark};
+  text-decoration: none;
+  display: block;
+
+  &:not(:first-child) {
+    border-top: 1px solid ${color.mediumlight};
+  }
+
+  /* Styling */
+  ${Title} {
+    color: ${color.darker};
+  }
+
+  ${Right} svg {
+    transition: all 200ms ease-out;
+    opacity: 0;
+    height: 12px;
+    width: 12px;
+    margin: 3px 0;
+    vertical-align: top;
+
+    path {
+      fill: ${color.mediumdark};
+    }
+  }
+
+  &:hover {
+    background: #e3f3ff;
+    cursor: pointer;
+
+    ${Right} svg {
+      opacity: 1;
+    }
+  }
+
+  ${props =>
+    props.active &&
+    css`
+      ${Title} {
+        font-weight: ${typography.weight.extrabold};
+      }
+      ${Title}, ${Center} {
+        color: ${color.primary};
+      }
+
+      ${Right} svg {
+        opacity: 1;
+        path {
+          fill: ${color.primary};
+        }
+      }
+    `};
+
+  ${props =>
+    props.loading &&
+    css`
+      ${Title} {
+        ${inlineGlow};
+        flex: 0;
+        display: inline-block;
+      }
+    `};
+
+  ${props =>
+    props.disabled &&
+    css`
+      cursor: not-allowed !important;
+      ${Title}, ${Center} {
+        color: ${color.mediumdark};
+      }
+    `};
+`;
+
+export default function ListItem({
+  loading,
+  left,
+  title,
+  center,
+  right,
+  active,
+  disabled,
+  href,
+  onClick,
+  LinkWrapper,
+  ...props
+}) {
+  const linkInner = (
+    <ItemInner onClick={onClick} role="presentation">
+      {left && <Left>{left}</Left>}
+      {title && <Title>{title}</Title>}
+      {center && <Center>{center}</Center>}
+      {right && <Right>{right}</Right>}
+    </ItemInner>
+  );
+
+  return (
+    <Item
+      as={LinkWrapper && href ? LinkWrapper : null}
+      href={!LinkWrapper ? href : undefined}
+      to={LinkWrapper ? href : undefined}
+      active={active}
+      loading={loading}
+      disabled={disabled}
+      {...props}
+    >
+      {linkInner}
+    </Item>
+  );
+}
+
+ListItem.propTypes = {
+  loading: PropTypes.bool,
+  left: PropTypes.node,
+  title: PropTypes.node,
+  center: PropTypes.node,
+  right: PropTypes.node,
+  active: PropTypes.bool,
+  disabled: PropTypes.bool,
+  href: PropTypes.oneOfType([PropTypes.string, PropTypes.shape({})]),
+  LinkWrapper: PropTypes.func,
+  onClick: PropTypes.func,
+};
+
+ListItem.defaultProps = {
+  loading: false,
+  left: null,
+  title: <span>Loading</span>,
+  center: null,
+  right: null,
+  active: false,
+  disabled: false,
+  href: null,
+  LinkWrapper: null,
+  onClick: null,
+};
diff --git a/docs/src/new-components/basics/index.js b/docs/src/new-components/basics/index.js
new file mode 100644
index 00000000000..ceef57969e2
--- /dev/null
+++ b/docs/src/new-components/basics/index.js
@@ -0,0 +1,17 @@
+import * as styles from './shared/styles';
+import * as global from './shared/global';
+import * as animation from './shared/animation';
+import * as icons from './shared/icons';
+import * as site from './shared/site';
+
+export { styles, global, animation, icons, site };
+
+export { default as Icon } from './Icon';
+export { default as Link } from './Link';
+
+export { default as WithTooltip } from './tooltip/WithTooltip';
+export { default as TooltipMessage } from './tooltip/TooltipMessage';
+export { default as TooltipNote } from './tooltip/TooltipNote';
+export { default as TooltipLinkList } from './tooltip/TooltipLinkList';
+
+// export { default as Modal } from './modal/Modal';
diff --git a/docs/src/new-components/basics/shared/animation.js b/docs/src/new-components/basics/shared/animation.js
new file mode 100644
index 00000000000..159c3c0e4b8
--- /dev/null
+++ b/docs/src/new-components/basics/shared/animation.js
@@ -0,0 +1,60 @@
+// Handy CSS animations for micro-interactions
+import { css, keyframes } from 'styled-components';
+import { color } from './styles';
+
+export const easing = {
+  rubber: 'cubic-bezier(0.175, 0.885, 0.335, 1.05)',
+};
+
+export const rotate360 = keyframes`
+	from {
+		transform: rotate(0deg);
+	}
+	to {
+		transform: rotate(360deg);
+	}
+`;
+
+export const glow = keyframes`
+  0%, 100% { opacity: 1; }
+  50% { opacity: .4; }
+`;
+
+export const float = keyframes`
+  0% { transform: translateY(1px); }
+  25% { transform: translateY(0px); }
+  50% { transform: translateY(-3px); }
+  100% { transform: translateY(1px); }
+`;
+
+export const jiggle = keyframes`
+  0%, 100% { transform:translate3d(0,0,0); }
+  12.5%, 62.5% { transform:translate3d(-4px,0,0); }
+  37.5%, 87.5% {  transform: translate3d(4px,0,0);  }
+`;
+
+export const shake = keyframes`
+  0% { transform:rotate(-3deg) }
+  1.68421% { transform:rotate(3deg) }
+  2.10526% { transform:rotate(6deg) }
+  3.78947% { transform:rotate(-6deg) }
+  4.21053% { transform:rotate(-6deg) }
+  5.89474% { transform:rotate(6deg) }
+  6.31579% { transform:rotate(6deg) }
+  8% { transform:rotate(-6deg) }
+  8.42105% { transform:rotate(-6deg) }
+  10.10526% { transform:rotate(6deg) }
+  10.52632% { transform:rotate(6deg) }
+  12.21053% { transform:rotate(-6deg) }
+  12.63158% { transform:rotate(-6deg) }
+  14.31579% { transform:rotate(6deg) }
+  15.78947% { transform:rotate(0deg) }
+  100% { transform:rotate(0deg) }
+`;
+
+export const inlineGlow = css`
+  animation: ${glow} 1.5s ease-in-out infinite;
+  background: ${color.mediumlight};
+  color: transparent;
+  cursor: progress;
+`;
diff --git a/docs/src/new-components/basics/shared/global.js b/docs/src/new-components/basics/shared/global.js
new file mode 100644
index 00000000000..711c6c0b0af
--- /dev/null
+++ b/docs/src/new-components/basics/shared/global.js
@@ -0,0 +1,122 @@
+import { createGlobalStyle, css } from 'styled-components';
+import { color, typography } from './styles';
+
+export const bodyStyles = css`
+  font-family: ${typography.type.primary};
+  font-size: ${typography.size.s3}px;
+  color: ${color.darkest};
+
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+  -webkit-tap-highlight-color: transparent;
+  -webkit-overflow-scrolling: touch;
+
+  * {
+    box-sizing: border-box;
+  }
+
+  h1,
+  h2,
+  h3,
+  h4,
+  h5,
+  h6 {
+    font-weight: ${typography.weight.regular};
+    margin: 0;
+    padding: 0;
+  }
+
+  button,
+  input,
+  textarea,
+  select {
+    outline: none;
+    font-family: ${typography.type.primary};
+  }
+
+  sub,
+  sup {
+    font-size: 0.8em;
+  }
+
+  sub {
+    bottom: -0.2em;
+  }
+
+  sup {
+    top: -0.2em;
+  }
+
+  b,
+  em {
+    font-weight: ${typography.weight.bold};
+  }
+
+  hr {
+    border: none;
+    border-top: 1px solid ${color.border};
+    clear: both;
+    margin-bottom: 1.25rem;
+  }
+
+  code,
+  pre {
+    font-family: ${typography.type.code};
+    font-size: ${typography.size.s2 - 1}px;
+    -webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
+  }
+
+  code {
+    display: inline-block;
+    padding-left: 2px;
+    padding-right: 2px;
+    vertical-align: baseline;
+
+    color: ${color.secondary};
+  }
+
+  pre {
+    line-height: 18px;
+    padding: 11px 1rem;
+    white-space: pre-wrap;
+
+    background: rgba(0, 0, 0, 0.05);
+    color: ${color.darkest};
+    border-radius: 3px;
+    margin: 1rem 0;
+  }
+
+  &.ReactModal__Body--open {
+    overflow: hidden;
+    &.hide-intercom #intercom-container {
+      display: none;
+    }
+  }
+
+  .ReactModalPortal > div {
+    opacity: 0;
+  }
+
+  .ReactModalPortal .ReactModal__Overlay {
+    transition: all 200ms ease-in;
+
+    &--after-open {
+      opacity: 1;
+    }
+    &--before-close {
+      opacity: 0;
+    }
+  }
+`;
+
+export const GlobalStyle = createGlobalStyle`
+    body {
+      ${bodyStyles}
+
+      margin: 0;
+      overflow-y: auto;
+      overflow-x: hidden;
+    }
+`;
diff --git a/docs/src/new-components/basics/shared/icons.js b/docs/src/new-components/basics/shared/icons.js
new file mode 100644
index 00000000000..e4be2820de0
--- /dev/null
+++ b/docs/src/new-components/basics/shared/icons.js
@@ -0,0 +1,306 @@
+// Icon paths
+const icons = {
+  mobile:
+    'M648 64h-272c-66.274 0-120 53.726-120 120v656c0 66.274 53.726 120 120 120h272c66.274 0 120-53.726 120-120v-656c0-66.274-53.726-120-120-120zM376 144h272c22.056 0 40 17.944 40 40v495.968h-352v-495.968c0-22.056 17.946-40 40-40zM648 880h-272c-22.054 0-40-17.944-40-40v-80.032h352v80.032c0 22.056-17.944 40-40 40zM544.034 819.962c0 17.676-14.33 32.002-32.004 32.002-17.67 0-32-14.326-32-32.002 0-17.672 14.33-31.998 32-31.998 17.674-0 32.004 14.326 32.004 31.998z',
+  watch:
+    'M736.172 108.030c0-11.044-8.956-20-20-20h-408.282c-11.044 0-20 8.956-20 20 0 11.046 8.956 20 20 20h408.282c11.044 0 20-8.954 20-20zM736.172 50.37c0-11.044-8.956-20-20-20h-408.282c-11.044 0-20 8.956-20 20s8.956 20 20 20h408.282c11.044 0 20-8.956 20-20zM736.172 973.692c0-11.044-8.956-20-20-20h-408.282c-11.044 0-20 8.956-20 20s8.956 20 20 20h408.282c11.044 0 20-8.956 20-20zM736.172 916.030c0-11.044-8.956-20-20-20h-408.282c-11.044 0-20 8.956-20 20 0 11.046 8.956 20 20 20h408.282c11.044 0 20-8.954 20-20zM717.53 228c18.904 0 34.286 15.14 34.286 33.75v500.502c0 18.61-15.38 33.75-34.286 33.75h-411.43c-18.904 0-34.286-15.14-34.286-33.75v-500.502c0-18.61 15.38-33.75 34.286-33.75h411.43zM717.53 148h-411.43c-63.118 0-114.286 50.928-114.286 113.75v500.502c0 62.822 51.166 113.75 114.286 113.75h411.43c63.118 0 114.286-50.926 114.286-113.75v-500.502c-0.002-62.822-51.168-113.75-114.286-113.75v0zM680.036 511.53c0 22.090-17.91 40-40 40h-128.004c-5.384 0-10.508-1.078-15.196-3.006-0.124-0.048-0.254-0.086-0.376-0.132-0.61-0.262-1.188-0.57-1.782-0.86-0.572-0.276-1.16-0.528-1.718-0.828-0.204-0.112-0.39-0.246-0.594-0.364-0.918-0.514-1.832-1.050-2.704-1.64-0.086-0.058-0.164-0.128-0.254-0.188-10.492-7.21-17.382-19.284-17.382-32.98v-151.5c0-22.094 17.91-40 40.004-40 22.088 0 40 17.906 40 40v111.498h88c22.094-0.002 40.002 17.91 40.006 40z',
+  tablet:
+    'M200.022 927.988h624.018c1.38 0 2.746-0.072 4.090-0.208 20.168-2.050 35.91-19.080 35.91-39.792v-751.916c0-22.092-17.91-40-40-40h-624.018c-22.098 0-40 17.908-40 40v751.916c0 22.094 17.906 40 40 40zM512.002 878.206c-17.674 0-32.004-14.328-32.004-31.998 0-17.678 14.33-32.002 32.004-32.002 17.67 0 32 14.324 32 32.002 0 17.67-14.33 31.998-32 31.998zM240.022 176.078h544.018v591.902h-544.018v-591.902z',
+  browser:
+    'M920.004 128h-816.008c-1.38 0-2.746 0.070-4.090 0.208-20.168 2.048-35.91 19.080-35.91 39.792v688c0 22.090 17.91 40 40 40h816.008c22.098 0 40-17.91 40-40v-688c-0-22.094-17.906-40-40-40zM368 177.78c17.674 0 32.004 14.328 32.004 31.998 0 17.676-14.33 32.002-32.004 32.002-17.67 0-32-14.326-32-32.002 0-17.67 14.33-31.998 32-31.998zM272 177.78c17.674 0 32.004 14.328 32.004 31.998 0 17.676-14.33 32.002-32.004 32.002-17.67 0-32-14.326-32-32.002 0-17.67 14.33-31.998 32-31.998zM176 177.78c17.674 0 32.004 14.328 32.004 31.998 0 17.676-14.33 32.002-32.004 32.002-17.67 0-32-14.326-32-32.002 0-17.67 14.33-31.998 32-31.998zM880.004 815.996h-736.008v-527.988h736.008v527.988z',
+  sidebar:
+    'M920.032 127.858h-816c-22.092 0-40 17.908-40 40v688c0 22.092 17.908 40 40 40h316.578c1.13 0.096 2.266 0.172 3.422 0.172s2.292-0.078 3.424-0.172h492.576c22.092 0 40-17.908 40-40v-688c0-22.092-17.908-40-40-40zM144.032 207.858h240v608h-240v-608zM880.032 815.858h-416v-608h416v608zM198.734 288.030c0-17.674 14.328-32 32.002-32h66.396c17.672 0 32 14.326 32 32 0 17.676-14.324 32-32 32h-66.398c-17.674 0-32-14.326-32-32zM198.734 416.030c0-17.674 14.328-32 32.002-32h66.396c17.672 0 32 14.326 32 32 0 17.676-14.324 32-32 32h-66.398c-17.674 0-32-14.326-32-32zM198.734 544.030c0-17.674 14.328-32 32.002-32h66.396c17.672 0 32 14.326 32 32 0 17.676-14.324 32-32 32h-66.398c-17.674 0-32-14.326-32-32z',
+  sidebaralt:
+    'M64 167.944v688c0 22.092 17.908 40 40 40h816c22.092 0 40-17.908 40-40v-688c0-22.092-17.908-40-40-40h-816c-22.092 0-40 17.908-40 40zM880 815.944h-240v-608h240v608zM144 207.944h416v608h-416v-608zM793.296 320.118h-66.398c-17.676 0-32-14.324-32-32 0-17.674 14.328-32 32-32h66.396c17.674 0 32.002 14.326 32.002 32 0 17.672-14.324 32-32 32zM793.296 448.118h-66.398c-17.676 0-32-14.324-32-32 0-17.674 14.328-32 32-32h66.396c17.674 0 32.002 14.326 32.002 32 0 17.672-14.324 32-32 32zM793.296 576.118h-66.398c-17.676 0-32-14.324-32-32 0-17.674 14.328-32 32-32h66.396c17.674 0 32.002 14.326 32.002 32 0 17.672-14.324 32-32 32z',
+  bottombar:
+    'M85 121h854c24 0 42 18 42 41v700c0 23-18 41-42 41H608a44 44 0 0 1-7 0H85c-24 0-42-18-42-41V162c0-23 18-41 42-41zm41 535v165h772V656H126zm0-82h772V202H126v372zm185 197h-69c-19 0-34-14-34-32s15-33 34-33h69c19 0 34 15 34 33s-15 32-34 32zm236 0h-70c-18 0-33-14-33-32s15-33 33-33h70c18 0 33 15 33 33s-15 32-33 32zm235 0h-70c-18 0-33-14-33-32s15-33 33-33h70c18 0 33 15 33 33s-15 32-33 32z',
+  useralt:
+    'M532.716 960c115.572 0 227.634-22.612 333.076-67.208 18.116-7.66 35.888-15.94 53.336-24.774v-18.726c0-116.912-241.728-223.528-306.458-233.828-20.1-3.198-20.556-58.458-20.556-58.458s59.050-58.452 71.922-137.062c34.618 0 56.004-83.57 21.378-112.972 1.448-30.95 44.5-242.972-173.474-242.972-217.976 0-174.916 212.022-173.476 242.972-34.622 29.402-13.244 112.972 21.38 112.972 12.864 78.61 71.916 137.062 71.916 137.062s-0.458 55.262-20.554 58.458c-64.042 10.19-301.326 114.674-306.334 230.124 30.474 17.61 62.084 33.376 94.776 47.204 105.436 44.596 217.498 67.208 333.068 67.208z',
+  user:
+    'M512.062 65.062c-247.424 0-448 200.576-448 448s200.576 448 448 448 448-200.576 448-448-200.576-448-448-448zM776.324 769.132c-55.386-54.52-155.436-95.864-189.492-101.282-14.918-2.376-15.258-43.39-15.258-43.39s43.832-43.39 53.384-101.738c25.698 0 41.568-62.032 15.87-83.856 1.072-22.974 33.038-180.352-128.766-180.352s-129.836 157.376-128.768 180.352c-25.706 21.824-9.83 83.856 15.87 83.856 9.552 58.348 53.382 101.738 53.382 101.738s-0.34 41.020-15.256 43.39c-34.056 5.418-134.104 46.762-189.49 101.282-66.932-69.018-103.738-159.708-103.738-256.070 0-98.296 38.278-190.708 107.786-260.212 69.51-69.506 161.918-107.788 260.214-107.788s190.708 38.278 260.214 107.788c69.506 69.506 107.786 161.916 107.786 260.212-0 96.364-36.808 187.054-103.738 256.070z',
+  useradd:
+    'M123.302 833.14c-26.284-11.118-51.696-23.792-76.196-37.95 4.028-92.818 194.792-176.82 246.28-185.012 16.158-2.57 16.526-46.994 16.526-46.994s-47.476-46.996-57.818-110.196c-27.836 0-45.024-67.186-17.19-90.824-1.158-24.882-35.776-195.34 139.468-195.34 175.242 0 140.628 170.458 139.464 195.34 27.838 23.638 10.644 90.824-17.188 90.824-10.346 63.2-57.822 110.196-57.822 110.196s0.37 44.424 16.528 46.994c52.042 8.282 246.38 93.996 246.38 187.988v15.054c-14.028 7.102-28.316 13.76-42.88 19.918-84.77 35.852-174.864 54.032-267.78 54.032-92.912 0.002-183.004-18.178-267.772-54.030zM910.064 335h-80.008v-80.010c0.002-22.088-17.906-39.992-39.996-39.992-22.088 0-39.998 17.906-39.998 39.996v80.006h-80.002c-22.094 0-40 17.908-39.998 40-0.002 22.090 17.904 39.996 39.996 39.996h80.004v80.002c0 22.094 17.908 40 40 40 22.090 0 39.996-17.906 39.996-39.996v-80.006l80.010-0.002c22.090 0.002 39.994-17.906 39.994-39.996 0-22.088-17.908-39.998-39.998-39.998z',
+  users:
+    'M123.302 822.204c-26.284-11.118-51.696-23.792-76.196-37.95 4.028-92.818 194.792-176.82 246.28-185.012 16.158-2.57 16.526-46.998 16.526-46.998s-47.476-46.994-57.818-110.192c-27.836 0-45.024-67.186-17.19-90.822-1.158-24.884-35.776-195.342 139.468-195.342 175.242 0 140.628 170.458 139.464 195.342 27.838 23.636 10.644 90.822-17.188 90.822-10.346 63.2-57.822 110.192-57.822 110.192s0.37 44.426 16.528 46.998c52.042 8.282 246.38 93.996 246.38 187.988v15.054c-14.028 7.102-28.316 13.758-42.88 19.918-84.77 35.852-174.864 54.032-267.78 54.032-92.912 0-183.004-18.18-267.772-54.030zM977.018 652.224c0-64.612-133.592-123.532-169.364-129.222-11.106-1.768-11.36-32.306-11.36-32.306s32.634-32.304 39.744-75.746c19.132 0 30.954-46.188 11.818-62.436 0.798-17.106 24.592-134.276-95.874-134.276-120.462 0-96.666 117.17-95.87 134.276-19.134 16.248-7.32 62.436 11.816 62.436 7.11 43.442 39.742 75.746 39.742 75.746s-0.25 30.54-11.358 32.306c-23.154 3.684-87.282 29.672-129.644 65.068 21.022 10.038 42.072 21.39 61.066 33.186 14.278 8.866 27.392 17.866 39.338 26.986 35.696 27.262 60.956 55.638 75.646 84.934 2.784 0.032 5.562 0.102 8.352 0.102 77.788 0 153.58-12.792 225.944-37.976v-43.078z',
+  profile:
+    'M396.984 530.228c-12.040-5.090-23.676-10.896-34.898-17.38 1.846-42.512 89.218-80.984 112.798-84.736 7.402-1.178 7.568-21.526 7.568-21.526s-21.742-21.524-26.48-50.47c-12.748 0-20.622-30.77-7.874-41.596-0.532-11.398-16.384-89.468 63.878-89.468s64.408 78.070 63.876 89.468c12.75 10.826 4.876 41.596-7.872 41.596-4.738 28.948-26.482 50.47-26.482 50.47s0.168 20.348 7.568 21.526c23.836 3.792 112.846 43.050 112.846 86.102v6.894c-6.426 3.252-12.968 6.3-19.64 9.122-38.826 16.422-80.090 24.746-122.646 24.746-42.552-0.002-83.816-8.326-122.642-24.748zM800 145h-592.004v736h592.004c8.708 0 15.876-7.086 15.972-15.796v-704.246c-0.018-8.8-7.176-15.958-15.972-15.958zM800 65c52.944 0 95.872 42.858 95.992 95.772l0.012 0.014v705.334h-0.036c-0.602 52.502-43.324 94.88-95.968 94.88h-632.004c-22.090 0-40-17.906-40-40v-816c0-20.338 15.192-37.090 34.836-39.628 1.696-0.218 3.41-0.372 5.164-0.372h632.004zM736.282 792.998c0-11.044-8.956-20-20-20h-408.282c-11.044 0-20 8.956-20 20s8.956 20 20 20h408.282c11.044 0 20-8.956 20-20zM736.282 704.998c0-11.044-8.956-20-20-20h-408.282c-11.044 0-20 8.956-20 20s8.956 20 20 20h408.282c11.044 0 20-8.956 20-20zM736.282 616.998c0-11.044-8.956-20-20-20h-408.282c-11.044 0-20 8.956-20 20s8.956 20 20 20h408.282c11.044 0 20-8.956 20-20z',
+  bookmark:
+    'M772 1012L511 761l-260 251a49 49 0 0 1-52 10c-18-7-29-24-29-43V132c0-25 21-46 47-46h588c26 0 47 21 47 46v847c0 19-11 36-29 43a49 49 0 0 1-51-10z',
+  bookmarkhollow:
+    'M772 1012L511 761l-260 251a49 49 0 0 1-52 10c-18-7-29-24-29-43V132c0-25 21-46 47-46h588c26 0 47 21 47 46v847c0 19-11 36-29 43a49 49 0 0 1-51-10zM545 664l213 205V181H265v688l213-205c9-9 21-14 33-14s24 5 34 14z',
+  book:
+    'M896.054 159.774c-0.122-52.914-43.048-95.774-95.992-95.774h-632.004c-1.754 0-3.468 0.154-5.164 0.372-19.644 2.54-34.836 19.292-34.836 39.628v816c0 22.094 17.91 40 40 40h632.004c52.642 0 95.368-42.378 95.968-94.88h0.036v-705.332l-0.012-0.014zM368.062 144h80v271.922l-11.728-11.718c-15.62-15.606-40.924-15.606-56.542 0l-11.728 11.718v-271.922zM816.036 864.204c-0.1 8.712-7.268 15.796-15.972 15.796h-592.004v-736h80.004v368.426c0 16.176 9.742 30.758 24.684 36.954 14.944 6.192 32.146 2.778 43.586-8.656l51.728-51.68 51.728 51.68c7.652 7.644 17.876 11.708 28.28 11.708 5.156 0 10.356-1 15.306-3.050 14.944-6.196 24.684-20.778 24.684-36.954v-368.428h272c8.796 0 15.972 7.16 15.992 15.958l-0.016 704.246z',
+  repository:
+    'M856.020 159.804c-0.122-52.916-43.048-95.774-95.992-95.774h-591.968c-1.754 0-3.468 0.154-5.164 0.37-19.644 2.54-34.836 19.292-34.836 39.63v784.584c0 22.094 17.91 40 40 40h151.972v63.594c0 10.876 6.548 20.682 16.598 24.844 10.046 4.164 21.612 1.87 29.304-5.818l34.78-34.748 34.78 34.748c5.144 5.14 12.020 7.87 19.014 7.87 3.466 0 6.962-0.672 10.292-2.052 10.048-4.164 16.598-13.968 16.598-24.844v-63.594h278.63c52.642 0 95.368-42.38 95.968-94.882h0.036v-673.916l-0.012-0.012zM776.020 159.988l-0.014 504.628h-519.974v-520.584h503.996c8.796-0 15.972 7.158 15.992 15.956zM760.028 848.616h-278.63v-56h-161.366v56h-111.972v-104h567.944l-0.002 88.204c-0.102 8.71-7.27 15.796-15.974 15.796zM320.032 240.396c0-17.67 14.328-31.998 31.998-31.998s32.002 14.326 32.002 31.998c0 17.674-14.332 32-32.002 32-17.672-0.002-31.998-14.326-31.998-32zM320.032 349.79c0-17.67 14.328-31.998 31.998-31.998s32.002 14.328 32.002 31.998c0 17.676-14.332 32-32.002 32-17.672 0-31.998-14.324-31.998-32zM320.032 459.188c0-17.67 14.328-32 31.998-32s32.002 14.328 32.002 32c0 17.674-14.332 31.998-32.002 31.998-17.672 0-31.998-14.324-31.998-31.998zM384.032 568.582c0 17.674-14.332 31.998-32.002 31.998s-31.998-14.324-31.998-31.998c0-17.67 14.328-32 31.998-32 17.67 0.002 32.002 14.33 32.002 32z',
+  star:
+    'M763.972 919.5c-6.368 0-12.758-1.518-18.61-4.596l-233.358-122.688-233.37 122.688c-13.476 7.090-29.808 5.904-42.124-3.042-12.318-8.95-18.486-24.118-15.912-39.124l44.57-259.856-188.792-184.028c-10.904-10.626-14.828-26.524-10.124-41.004s17.222-25.034 32.292-27.222l260.906-37.912 116.686-236.42c6.738-13.652 20.644-22.296 35.87-22.296v0c15.226 0 29.13 8.644 35.87 22.298l116.674 236.418 260.906 37.912c15.068 2.19 27.586 12.742 32.292 27.222s0.782 30.376-10.124 41.004l-188.792 184.028 44.24 257.93c0.62 2.796 0.946 5.704 0.946 8.688 0 22.054-17.848 39.942-39.888 40-0.054 0-0.106 0-0.158 0z',
+  starhollow:
+    'M763.972 919.5c-6.368 0-12.758-1.518-18.61-4.596l-233.358-122.688-233.37 122.688c-13.476 7.090-29.808 5.904-42.124-3.042-12.318-8.95-18.486-24.118-15.912-39.124l44.57-259.856-188.792-184.028c-10.904-10.626-14.828-26.524-10.124-41.004s17.222-25.034 32.292-27.222l260.906-37.912 116.686-236.42c6.738-13.652 20.644-22.296 35.87-22.296v0c15.226 0 29.13 8.644 35.87 22.298l116.674 236.418 260.906 37.912c15.068 2.19 27.586 12.742 32.292 27.222s0.782 30.376-10.124 41.004l-188.792 184.028 44.24 257.93c0.62 2.796 0.946 5.704 0.946 8.688 0 22.054-17.848 39.942-39.888 40-0.054 0-0.106 0-0.158 0zM190.256 428.144l145.812 142.13c9.428 9.192 13.73 22.432 11.504 35.406l-34.424 200.7 180.244-94.758c11.654-6.13 25.576-6.126 37.226 0l180.232 94.756-34.422-200.698c-2.226-12.974 2.076-26.214 11.504-35.406l145.812-142.13-201.51-29.282c-13.030-1.892-24.292-10.076-30.118-21.882l-90.114-182.596-90.122 182.598c-5.826 11.804-17.090 19.988-30.118 21.88l-201.506 29.282z',
+  circle:
+    'M960 512c0 247.424-200.576 448-448 448s-448-200.576-448-448c0-247.424 200.576-448 448-448s448 200.576 448 448z',
+  circlehollow:
+    'M960 513c0-247.424-200.574-448-448-448-247.422 0-448 200.576-448 448s200.578 448 448 448c247.426 0 448-200.576 448-448zM251.786 773.216c-69.504-69.508-107.786-161.918-107.786-260.216 0-98.294 38.282-190.708 107.786-260.216 69.506-69.504 161.918-107.784 260.214-107.784s190.708 38.28 260.214 107.784c69.508 69.508 107.786 161.922 107.786 260.216 0 98.296-38.278 190.708-107.786 260.214-69.506 69.508-161.922 107.786-260.214 107.786-98.296 0-190.708-38.278-260.214-107.784z',
+  heart:
+    'M895.032 194.328c-20.906-21.070-46.492-37.316-76.682-48.938-30.104-11.71-63.986-17.39-101.474-17.39-19.55 0-38.744 2.882-57.584 9.094-18.472 6.062-36.584 14.242-54.072 24.246-17.476 9.828-34.056 21.276-49.916 33.898-16.038 12.8-30.456 25.572-43.346 38.664-13.52-13.092-28.026-25.864-43.616-38.664-15.684-12.624-32.080-24.070-49.382-33.898-17.214-10.004-35.414-18.184-54.704-24.246-19.104-6.21-38.568-9.094-58.034-9.094-37.126 0-70.56 5.68-100.48 17.39-29.732 11.622-55.328 27.868-76.328 48.938-20.994 21.094-37.214 46.962-48.478 77.328-11.174 30.544-16.942 64.5-16.942 101.812 0 21.628 3.068 43.078 9.19 64.53 6.308 21.096 14.416 41.986 24.876 61.642 10.446 19.656 22.702 38.488 36.584 56.59 13.88 18.124 28.388 34.516 43.344 49.58l305.766 305.112c8.466 7.558 18.11 11.444 28.204 11.444 10.726 0 19.914-3.884 27.308-11.444l305.934-304.226c14.78-14.772 29.382-31.368 43.166-49.378 14.058-18.212 26.314-37.222 37.042-57.23 10.9-19.924 19.192-40.638 25.406-62 6.218-21.188 9.198-42.61 9.198-64.618 0-37.312-5.592-71.268-16.582-101.812-11.264-30.366-27.22-56.236-48.398-77.33z',
+  hearthollow:
+    'M716.876 208c27.708 0 52.092 4.020 72.47 11.948l0.132 0.052 0.13 0.050c19.866 7.644 35.774 17.664 48.632 30.624l0.166 0.168 0.17 0.168c12.586 12.536 22.304 28.27 29.706 48.094 7.782 21.786 11.726 46.798 11.726 74.364 0 14.658-1.95 28.426-5.958 42.086l-0.028 0.092-0.026 0.092c-4.866 16.72-11.006 31.752-18.776 45.952l-0.162 0.298-0.16 0.296c-8.81 16.434-18.58 31.532-29.864 46.148l-0.204 0.264c-11.316 14.786-23.48 28.708-36.154 41.378l-277.122 275.574-276.94-276.35c-13.32-13.43-25.248-27.074-36.488-41.75-11.386-14.848-21.284-30.136-29.444-45.49-7.206-13.54-13.494-29.17-18.7-46.472-4.030-14.264-5.988-28.044-5.988-42.116 0-27.36 4.042-52.314 12.016-74.176 7.214-19.378 17.344-35.708 30.066-48.492 12.998-13.042 28.958-23.148 48.826-30.914 20.436-8 43.764-11.886 71.32-11.886 11.536 0 22.738 1.742 33.298 5.174l0.374 0.122 0.376 0.12c13.116 4.122 26.066 9.874 38.494 17.094l0.34 0.2 0.344 0.196c12.736 7.234 25.308 15.876 38.43 26.412 14.486 11.906 27.060 23.048 38.428 34.056l56.994 55.192 55.662-56.532c10.324-10.484 22.18-21.040 36.242-32.264 13.382-10.646 26.216-19.38 39.228-26.698l0.256-0.144 0.254-0.144c13.008-7.442 26.228-13.386 39.294-17.676l0.050-0.016 0.050-0.018c10.354-3.414 20.998-5.076 32.54-5.076zM716.876 128c-19.55 0-38.744 2.882-57.584 9.094-18.472 6.062-36.584 14.242-54.072 24.246-17.476 9.828-34.056 21.276-49.916 33.898-16.038 12.8-30.456 25.572-43.346 38.664-13.52-13.092-28.026-25.864-43.616-38.664-15.684-12.624-32.080-24.070-49.382-33.898-17.214-10.004-35.414-18.184-54.704-24.246-19.104-6.21-38.568-9.094-58.034-9.094-37.126 0-70.56 5.68-100.48 17.39-29.732 11.622-55.328 27.868-76.328 48.938-20.994 21.094-37.214 46.962-48.478 77.328-11.174 30.544-16.942 64.5-16.942 101.812 0 21.628 3.068 43.078 9.19 64.53 6.308 21.096 14.416 41.986 24.876 61.642 10.446 19.656 22.702 38.488 36.584 56.59 13.88 18.124 28.388 34.516 43.344 49.58l305.766 305.112c8.466 7.558 18.11 11.444 28.204 11.444 10.726 0 19.914-3.884 27.308-11.444l305.934-304.226c14.78-14.772 29.382-31.368 43.166-49.378 14.058-18.212 26.314-37.222 37.042-57.23 10.9-19.924 19.192-40.638 25.406-62 6.218-21.188 9.198-42.61 9.198-64.618 0-37.312-5.592-71.268-16.582-101.812-11.262-30.366-27.216-56.234-48.396-77.328-20.906-21.070-46.492-37.316-76.682-48.938-30.106-11.712-63.988-17.392-101.476-17.392v0z',
+  facehappy:
+    'M960 513c0-247.424-200.574-448-448-448-247.422 0-448 200.576-448 448s200.578 448 448 448c247.426 0 448-200.576 448-448zM251.786 773.214c-69.504-69.508-107.786-161.918-107.786-260.214 0-98.294 38.282-190.708 107.786-260.216 69.506-69.504 161.918-107.784 260.214-107.784s190.708 38.28 260.214 107.784c69.508 69.508 107.786 161.922 107.786 260.216 0 98.296-38.278 190.708-107.786 260.214-69.506 69.506-161.922 107.786-260.214 107.786-98.296 0-190.708-38.28-260.214-107.786zM416.5 384.998c0 35.346-28.654 64-64 64s-64-28.654-64-64 28.654-64 64-64 64 28.654 64 64zM736 384.998c0 35.346-28.654 64-64 64s-64-28.654-64-64 28.654-64 64-64 64 28.654 64 64zM763.62 636.976v0.094c-49.554 87.14-143.21 145.93-250.62 145.93-107.486 0-201.2-58.868-250.726-146.108v-0.092c-3.34-5.842-5.274-12.59-5.274-19.8s1.934-13.958 5.274-19.798v-0.198h0.122c6.918-11.946 19.808-20.004 34.606-20.004s27.69 8.058 34.61 20.004h0.098c35.756 63.222 103.614 105.996 181.29 105.996s145.54-42.774 181.3-105.996h0.090c6.918-11.946 19.81-20.004 34.606-20.004s27.69 8.058 34.61 20.004h0.014v0.024c3.402 5.88 5.38 12.69 5.38 19.972 0 7.286-1.978 14.094-5.38 19.976z',
+  facesad:
+    'M960 513c0-247.424-200.574-448-448-448-247.422 0-448 200.576-448 448s200.578 448 448 448c247.426 0 448-200.576 448-448zM251.786 773.214c-69.504-69.506-107.786-161.918-107.786-260.214 0-98.294 38.282-190.708 107.786-260.216 69.506-69.504 161.918-107.784 260.214-107.784s190.708 38.28 260.214 107.784c69.508 69.508 107.786 161.922 107.786 260.216 0 98.296-38.278 190.708-107.786 260.214-69.506 69.506-161.922 107.786-260.214 107.786-98.296 0-190.708-38.28-260.214-107.786zM416.5 384.998c0 35.346-28.654 64-64 64s-64-28.654-64-64 28.654-64 64-64 64 28.654 64 64zM736 384.998c0 35.346-28.654 64-64 64s-64-28.654-64-64 28.654-64 64-64 64 28.654 64 64zM262.38 684.024v-0.094c49.552-87.14 143.208-145.93 250.62-145.93 107.486 0 201.2 58.868 250.726 146.108v0.092c3.34 5.842 5.274 12.59 5.274 19.8s-1.934 13.958-5.274 19.798v0.198h-0.122c-6.918 11.946-19.808 20.004-34.606 20.004s-27.69-8.058-34.61-20.004h-0.098c-35.76-63.222-103.618-105.996-181.292-105.996s-145.54 42.774-181.3 105.996h-0.090c-6.918 11.946-19.808 20.004-34.606 20.004s-27.69-8.058-34.61-20.004h-0.014v-0.024c-3.402-5.88-5.38-12.69-5.38-19.972 0.002-7.286 1.98-14.094 5.382-19.976z',
+  faceneutral:
+    'M968 513c0-247.424-200.574-448-448-448-247.422 0-448 200.576-448 448s200.578 448 448 448c247.426 0 448-200.576 448-448zM259.786 773.214c-69.504-69.506-107.786-161.918-107.786-260.214 0-98.294 38.282-190.708 107.786-260.216 69.506-69.504 161.918-107.784 260.214-107.784s190.708 38.28 260.214 107.784c69.508 69.508 107.786 161.922 107.786 260.216 0 98.296-38.278 190.708-107.786 260.214-69.506 69.506-161.922 107.786-260.214 107.786-98.296 0-190.708-38.28-260.214-107.786zM424.5 384.998c0 35.346-28.654 64-64 64s-64-28.654-64-64 28.654-64 64-64 64 28.654 64 64zM744 384.998c0 35.346-28.654 64-64 64s-64-28.654-64-64 28.654-64 64-64 64 28.654 64 64zM777 641c0 22.094-17.906 40-40 40h-432c-22.090 0-40-17.906-40-40 0-22.090 17.91-40 40-40h432c22.094 0 40 17.91 40 40z',
+  lock:
+    'M896.032 915.53v-467.498c0-19.102-13.402-35.052-31.31-39.026-0.21-0.046-0.414-0.12-0.628-0.162-0.444-0.090-0.904-0.13-1.354-0.208-2.186-0.37-4.416-0.606-6.708-0.606h-55.902l0.002-55.85h0.020c0-159.14-129.010-288.15-288.15-288.15-159.128 0-288.13 128.992-288.15 288.118v55.884h-54.852c-20.71 0-37.746 15.742-39.792 35.91-0.136 1.344-0.208 2.708-0.208 4.090v463.332c-0.618 2.792-0.968 5.688-0.968 8.668 0 22.094 17.91 40 40 40h688.27c22.092 0 40-17.91 40-40-0.002-1.524-0.104-3.024-0.27-4.502zM209 488.032h607.032v392h-607.032v-392zM303.85 352.182c0-114.776 93.376-208.15 208.15-208.15 114.59 0 207.842 93.074 208.142 207.596 0 0.084-0.012 0.164-0.012 0.248v56.156h-416.284l0.004-55.85zM552.164 691.858l-0.002 58.188c0.004 22.088-17.906 39.996-39.996 39.998-22.094 0.002-40.004-17.906-40-40v-57.974c-14.704-11.726-24.134-29.782-24.134-50.048 0-35.346 28.654-64 64-64s64 28.654 64 64c0 20.142-9.318 38.104-23.868 49.836z',
+  unlock:
+    'M896.032 915.53v-467.498c0-1.988-0.194-3.926-0.472-5.834-0.11-0.744-0.192-1.498-0.34-2.226-1.524-7.44-5.136-14.1-10.164-19.408-0.252-0.266-0.48-0.554-0.738-0.814-0.496-0.494-1.036-0.944-1.554-1.412-0.43-0.386-0.84-0.8-1.288-1.17-0.292-0.24-0.608-0.446-0.904-0.676-2.506-1.954-5.244-3.616-8.176-4.934-0.744-0.334-1.504-0.632-2.27-0.922-4.39-1.656-9.124-2.604-14.094-2.604h-552.184l0.002-55.85c0-114.776 93.376-208.15 208.15-208.15 86.038 0 160.034 52.474 191.7 127.096 0.012 0.028 0.030 0.044 0.042 0.072 5.978 14.566 20.284 24.832 37.006 24.832 22.090 0 40-17.906 40-40 0-4.71-0.86-9.21-2.354-13.41-0.182-0.694-0.42-1.438-0.782-2.292-43.666-103.582-146.14-176.296-265.612-176.296-159.128 0-288.13 128.994-288.15 288.12v55.882h-54.85c-20.71 0-37.746 15.742-39.792 35.91-0.136 1.344-0.208 2.708-0.208 4.090v463.332c-0.618 2.794-0.968 5.688-0.968 8.668 0 22.094 17.91 40 40 40h688.27c22.092 0 40-17.91 40-40-0.002-1.528-0.104-3.028-0.27-4.506zM209 488.032h607.032v392h-607.032v-392zM552.164 691.86l-0.002 58.186c0.004 22.088-17.906 39.996-39.996 40-22.094 0-40.004-17.908-40-40v-57.976c-14.702-11.726-24.134-29.782-24.134-50.048 0-35.346 28.654-64 64-64s64 28.654 64 64c0 20.142-9.318 38.102-23.868 49.838z',
+  key:
+    'M768.032 320.032c0 35.346-28.654 64-64 64s-64-28.654-64-64 28.654-64 64-64 64 28.654 64 64zM960.032 353.092c0 159.062-128.946 288.010-288.008 288.010-35.306 0-69.124-6.368-100.38-17.996l-27.736 27.738-0.002 54.464c0 0.016 0.002 0.028 0.002 0.040 0 11.046-4.478 21.046-11.716 28.29-6.334 6.332-14.784 10.55-24.196 11.508-1.346 0.136-2.708 0.208-4.090 0.208h-71.748l-0.002 71.96c0 0.012 0.002 0.040 0.002 0.040 0 11.046-4.478 21.046-11.716 28.286-6.334 6.336-14.784 10.554-24.196 11.508-1.346 0.136-2.708 0.208-4.090 0.208h-71.996l-0.002 62.684c0 22.094-17.908 40-40 40-0.022 0-0.042 0-0.062 0-0.022 0-0.042 0-0.064 0h-175.996c-13.76 0-25.888-6.95-33.086-17.524-4.362-6.406-6.916-14.14-6.916-22.476v-112c0-0.664 0.066-1.308 0.1-1.964 0.032-0.618 0.034-1.234 0.092-1.852 0.11-1.148 0.288-2.278 0.492-3.398 0.024-0.128 0.034-0.258 0.058-0.386 1.614-8.378 5.848-15.808 11.808-21.446l325.456-325.458c-11.642-31.274-18.020-65.11-18.020-100.44 0-159.060 128.946-288.006 288.006-288.006 159.060-0.004 288.006 128.942 288.006 288.002zM880.032 353.092c0-114.696-93.312-208.006-208.008-208.006s-208.006 93.31-208.006 208.006c0 43.208 13.246 83.376 35.884 116.668l-57.36 57.362c-0.136-0.184-0.27-0.368-0.408-0.546l-298.102 298.106-0.002 55.356h96.124v-62.684c0-0.708 0.070-1.394 0.106-2.094 0.036-0.664 0.036-1.336 0.102-1.992 0.132-1.316 0.334-2.61 0.592-3.882 0.006-0.028 0.008-0.058 0.014-0.090 0.258-1.262 0.58-2.5 0.956-3.714 0.012-0.040 0.018-0.078 0.030-0.118 4.676-15.032 17.976-26.262 34.114-27.902 1.344-0.136 2.708-0.208 4.090-0.208h71.998v-67.64c-0.156-1.434-0.248-2.882-0.248-4.36 0-22.094 17.908-40 40-40h71.998v-30.692c0-0.148 0.020-0.29 0.022-0.438 0.008-10.226 3.912-20.45 11.714-28.254l55.99-55.988c1.982-1.984 4.124-3.71 6.38-5.188l18.68-18.684c33.030 22.090 72.702 34.992 115.332 34.992 114.694-0 208.008-93.314 208.008-208.010z',
+  arrowleftalt:
+    'M107.854 539.924l282.834 283.272c15.594 15.65 40.92 15.692 56.568 0.1 15.648-15.594 15.694-40.92 0.1-56.568l-214.838-215.040h655.412c22.092 0 40-17.908 40-40s-17.908-40-40-40h-655l214.75-214.61c15.64-15.602 15.672-40.928 0.070-56.568-7.814-7.834-18.066-11.752-28.32-11.75-10.22 0-20.442 3.892-28.25 11.68l-283.242 282.93c-15.634 15.594-15.672 40.91-0.084 56.554z',
+  arrowrightalt:
+    'M916.266 483.792l-282.834-283.272c-15.594-15.65-40.92-15.692-56.568-0.1-15.648 15.594-15.694 40.92-0.1 56.568l214.838 215.040h-655.412c-22.092 0-40 17.908-40 40s17.908 40 40 40h655l-214.748 214.61c-15.64 15.602-15.672 40.928-0.070 56.568 7.814 7.834 18.066 11.752 28.32 11.75 10.22 0 20.442-3.892 28.25-11.68l283.242-282.93c15.632-15.596 15.67-40.91 0.082-56.554z',
+  sync:
+    'M998.786 474.516l-91 90.988c-8.028 8.036-18.624 11.902-29.152 11.676-10.536 0.234-21.144-3.632-29.184-11.676l-92.3-92.296c-15.624-15.622-15.624-40.95 0-56.57 15.622-15.622 40.95-15.624 56.57 0l26.146 26.148c-13.774-61.416-44.624-117.806-90.216-163.394-63.46-63.464-147.84-98.414-237.586-98.414-89.75 0-174.128 34.95-237.59 98.414-27.012 27.012-48.836 57.824-65.024 91.214l-0.008-0.004c-6.722 12.632-20.008 21.242-35.32 21.242-22.090 0-40-17.906-40-40 0-5.464 1.102-10.668 3.086-15.414l-0.004-0.004c0.016-0.032 0.024-0.058 0.040-0.090 0.036-0.078 0.070-0.156 0.106-0.234 0.73-1.632 0.208-0.718 5.004-9.996 69.18-133.726 208.766-225.128 369.71-225.128 203.224 0 372.374 145.734 408.728 338.392l21.424-21.424c15.618-15.622 40.946-15.622 56.566 0s15.624 40.948 0.004 56.57zM889.992 682.11c0 5.464-1.106 10.672-3.090 15.414l0.008 0.004c-0.016 0.036-0.028 0.058-0.040 0.090-0.036 0.078-0.074 0.156-0.106 0.234-0.73 1.636-0.208 0.718-5.008 10-69.176 133.722-208.762 225.124-369.708 225.124-205.2 0-375.668-148.578-409.76-344.022l-19.478 19.478c-15.622 15.622-40.95 15.622-56.57 0-15.618-15.622-15.622-40.95 0-56.57l90.996-90.992c8.032-8.032 18.628-11.902 29.152-11.672 10.536-0.238 21.144 3.632 29.188 11.672l92.296 92.3c15.624 15.618 15.624 40.946 0 56.566-15.618 15.622-40.946 15.624-56.566 0.004l-29.292-29.292c12.466 65.568 44.214 125.882 92.448 174.116 63.46 63.46 147.84 98.41 237.586 98.41 89.75 0 174.124-34.95 237.59-98.41 27.012-27.012 48.836-57.824 65.020-91.218l0.008 0.004c6.726-12.632 20.012-21.242 35.324-21.242 22.092 0.002 40.002 17.912 40.002 40.002zM145.83 545.416l1.4 0.248-0.824-0.824-0.576 0.576z',
+  reply:
+    'M679.496 431.738c-0.414-0.062-0.834-0.102-1.266-0.102h-477.482l171.506-171.504c15.622-15.622 15.622-40.95-0.002-56.57-15.62-15.624-40.948-15.624-56.568 0l-239.734 239.732c-0.958 0.956-1.868 1.958-2.724 3.006-0.328 0.402-1.884 2.482-2.324 3.138-0.36 0.54-1.696 2.77-2.008 3.352-0.308 0.58-1.424 2.936-1.676 3.544-0.036 0.086-0.468 1.268-0.648 1.774-0.23 0.636-0.474 1.266-0.672 1.918-0.186 0.612-0.818 3.13-0.95 3.788-0.148 0.748-0.522 3.318-0.574 3.862-0.262 2.642-0.262 5.3 0 7.942 0.044 0.448 0.412 3.032 0.58 3.874 0.112 0.556 0.74 3.088 0.958 3.808 0.158 0.524 1.036 2.992 1.328 3.7 0.192 0.458 1.298 2.828 1.688 3.552 0.208 0.386 0.446 0.75 0.666 1.126 0.436 0.752 1.844 2.888 2.084 3.224 0.52 0.724 4.262 5.074 4.29 5.098l239.718 239.72c15.62 15.618 40.948 15.618 56.57 0 15.62-15.624 15.622-40.948 0-56.57l-171.516-171.514h471.296c114.52 0.084 207.688 93.124 207.988 207.594 0 0.084-0.012 0.164-0.012 0.248v95.876c-0.004 22.094 17.906 40.002 40 40 22.090-0.002 40-17.91 39.996-39.998l0.004-95.57h0.020c0-156.594-124.914-284.012-280.536-288.048z',
+  undo:
+    'M230 301h480a240 240 0 1 1 0 481H235c-23 0-42-20-42-43 0-24 19-43 42-43h475a155 155 0 0 0 0-310H228l3 3 65 65a45 45 0 0 1-65 64L90 376a45 45 0 0 1 0-64l142-142a45 45 0 1 1 64 65l-63 62-3 4z',
+  transfer:
+    'M916.25 348.726l-125 124.688c-7.808 7.79-18.032 11.68-28.25 11.68-10.254 0.002-20.506-3.918-28.32-11.75-15.602-15.64-15.57-40.966 0.070-56.568l56.508-56.368h-655.258c-22.092 0-40-17.908-40-40s17.908-40 40-40h655.672l-57.006-57.206c-15.594-15.646-15.548-40.972 0.1-56.566s40.972-15.55 56.568 0.098l125 125.438c15.588 15.644 15.548 40.958-0.084 56.554zM107.666 731.892l125 125.438c15.596 15.648 40.92 15.692 56.568 0.098s15.694-40.92 0.1-56.566l-57.006-57.206h655.672c22.092 0 40-17.908 40-40s-17.908-40-40-40h-655.258l56.508-56.368c15.64-15.602 15.672-40.928 0.070-56.568-7.814-7.832-18.066-11.752-28.32-11.75-10.218 0-20.442 3.89-28.25 11.68l-125 124.688c-15.632 15.596-15.672 40.91-0.084 56.554z',
+  redirect:
+    'M913.852 702.796c-15.594-15.648-40.922-15.694-56.57-0.1l-57.204 57.006v-451.424c0-0.372-0.028-0.736-0.074-1.098-0.458-99.016-80.86-179.15-179.988-179.15-99.412 0-180 80.592-180 180 0 0.084 0.004 0.166 0.004 0.248h-0.004v343.504h-0.006c0 0.082 0.006 0.164 0.006 0.248 0 55.14-44.86 100-100 100s-100-44.86-100-100c0-0.084 0.006-0.166 0.006-0.248h-0.002v-483.752c0-22.092-17.91-40-40-40s-40.004 17.908-40.004 40v483.752c0 0.018 0.002 0.036 0.002 0.054 0 0.064-0.002 0.128-0.002 0.194 0 99.408 80.59 180 180 180 99.412 0 180-80.592 180-180 0-0.084-0.004-0.166-0.004-0.248h0.004v-343.504h0.008c0-0.082-0.008-0.164-0.008-0.248 0-55.138 44.86-100 100-100s100 44.862 100 100c0 0.084-0.008 0.166-0.008 0.248h0.070v451.008l-56.368-56.506c-15.602-15.642-40.93-15.67-56.566-0.070-7.836 7.814-11.754 18.066-11.754 28.32 0 10.218 3.894 20.442 11.68 28.252l124.692 125c15.594 15.632 40.91 15.67 56.554 0.084l125.434-125c15.652-15.598 15.692-40.92 0.102-56.57z',
+  expand:
+    'M959.688 920.068l0.31-176c0.040-22.094-17.84-40.032-39.93-40.070-22.092-0.040-40.032 17.838-40.070 39.93l-0.142 79.672-235.734-235.732c-15.622-15.622-40.948-15.622-56.57 0s-15.622 40.948 0 56.568l235.442 235.442-78.946-0.1c-22.092-0.028-40.022 17.86-40.050 39.952-0.014 11.064 4.464 21.084 11.714 28.334 7.228 7.224 17.208 11.702 28.236 11.714l175.688 0.22c22.086 0.028 40.014-17.846 40.052-39.93zM920.178 64.228l-176-0.308c-22.094-0.040-40.032 17.84-40.070 39.93-0.040 22.092 17.838 40.032 39.93 40.070l79.672 0.14-235.732 235.734c-15.622 15.622-15.622 40.948 0 56.568s40.948 15.622 56.568 0l235.442-235.442-0.1 78.946c-0.028 22.092 17.86 40.022 39.952 40.050 11.064 0.014 21.084-4.464 28.334-11.714 7.224-7.228 11.702-17.208 11.714-28.236l0.22-175.688c0.026-22.082-17.846-40.010-39.93-40.050zM64.236 103.742l-0.308 176c-0.040 22.094 17.84 40.032 39.93 40.070 22.092 0.040 40.032-17.84 40.070-39.93l0.14-79.672 235.734 235.73c15.622 15.622 40.948 15.622 56.568 0s15.622-40.946 0-56.566l-235.442-235.442 78.946 0.098c22.092 0.028 40.022-17.86 40.050-39.95 0.014-11.066-4.464-21.086-11.714-28.336-7.228-7.222-17.208-11.7-28.236-11.714l-175.688-0.218c-22.084-0.026-40.012 17.844-40.050 39.93zM103.748 959.766l176 0.308c22.094 0.040 40.032-17.84 40.070-39.93 0.040-22.092-17.84-40.032-39.93-40.070l-79.672-0.14 235.73-235.734c15.622-15.622 15.622-40.948 0-56.568s-40.946-15.622-56.566 0l-235.442 235.442 0.098-78.946c0.028-22.092-17.86-40.022-39.95-40.050-11.066-0.014-21.086 4.464-28.336 11.714-7.222 7.228-11.7 17.208-11.714 28.236l-0.218 175.688c-0.026 22.082 17.844 40.010 39.93 40.050z',
+  expandalt:
+    'M512.008 959.964c-10.236 0-20.47-3.904-28.282-11.712l-239.898-239.838c-15.624-15.62-15.624-40.946-0.006-56.57 15.622-15.622 40.948-15.624 56.568-0.004l211.618 211.562 211.712-211.658c15.624-15.618 40.952-15.616 56.568 0.004 15.62 15.624 15.618 40.95-0.006 56.57l-239.994 239.934c-7.808 7.808-18.044 11.712-28.28 11.712zM483.824 75.744l-239.994 239.934c-15.624 15.62-15.624 40.948-0.006 56.57s40.944 15.622 56.568 0.004l211.712-211.658 211.618 211.562c15.622 15.62 40.948 15.616 56.568-0.006 15.62-15.624 15.618-40.95-0.006-56.57l-239.898-239.836c-7.81-7.81-18.044-11.714-28.282-11.714s-20.47 3.906-28.28 11.714z',
+  grow:
+    'M541.146 448.384c-1.694-0.216-3.408-0.37-5.162-0.37h-367.968c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v368.032c0 22.094 17.91 40 40 40h367.968c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-368.036c0-20.34-15.192-37.094-34.838-39.632zM208.016 816.046v-288.032h287.968v288.032h-287.968zM736.032 856.046c0 22.090-17.908 40-40 40-22.090 0-40-17.908-40-40v-487.902l-488.016 0.002c-22.090 0-40-17.91-40-40s17.908-40.002 40-40.002h528.016c1.754 0 3.468 0.152 5.162 0.37 19.646 2.538 34.838 19.292 34.838 39.63v527.902zM896.032 168.030v688.004c-0.002 22.088-17.91 39.996-40 39.996s-40.002-17.908-40.002-40c0 0 0.002-304.026 0.002-304.040v-343.96h-343.96c-0.014 0-304.040 0.002-304.040 0.002-22.090 0-40-17.91-40-40s17.908-40.002 40-40.002h688c1.754 0 3.468 0.152 5.162 0.37 19.646 2.536 34.838 19.29 34.838 39.63z',
+  arrowleft:
+    'M257.93 511.976c0-10.236 3.902-20.47 11.71-28.282l344.098-344.158c15.622-15.624 40.946-15.624 56.57-0.006 15.622 15.622 15.624 40.948 0.004 56.568l-315.82 315.876 315.868 315.922c15.618 15.624 15.618 40.952-0.004 56.568-15.622 15.62-40.95 15.618-56.57-0.006l-344.146-344.202c-7.808-7.81-11.71-18.044-11.71-28.28z',
+  arrowup:
+    'M512.024 256c10.236 0 20.47 3.904 28.282 11.712l344.154 344.098c15.624 15.62 15.624 40.946 0.006 56.57-15.622 15.622-40.948 15.624-56.568 0.004l-315.876-315.82-315.922 315.868c-15.624 15.618-40.952 15.618-56.568-0.004-15.62-15.624-15.618-40.95 0.006-56.57l344.204-344.144c7.81-7.81 18.046-11.714 28.282-11.714z',
+  arrowdown:
+    'M511.976 768.002c-10.236 0-20.47-3.904-28.282-11.712l-344.154-344.098c-15.624-15.62-15.624-40.946-0.006-56.57 15.622-15.622 40.948-15.624 56.568-0.004l315.876 315.82 315.922-315.868c15.624-15.618 40.952-15.616 56.568 0.004 15.62 15.624 15.618 40.95-0.006 56.57l-344.204 344.144c-7.81 7.81-18.046 11.714-28.282 11.714z',
+  arrowright:
+    'M768.072 514.022c0 10.236-3.904 20.47-11.712 28.282l-344.098 344.156c-15.62 15.624-40.946 15.624-56.568 0.006-15.622-15.622-15.624-40.948-0.006-56.568l315.82-315.876-315.868-315.922c-15.618-15.624-15.618-40.952 0.004-56.568 15.624-15.62 40.95-15.618 56.57 0.006l344.144 344.204c7.81 7.81 11.714 18.044 11.714 28.28z',
+  chevrondown:
+    'M511.976 833c-10.236 0-20.47-3.904-28.282-11.712l-471.934-471.874c-15.624-15.62-15.624-40.946-0.006-56.57 15.622-15.622 40.948-15.624 56.568-0.004l443.652 443.598 443.61-443.556c15.624-15.618 40.952-15.616 56.568 0.004 15.62 15.624 15.618 40.95-0.006 56.57l-471.89 471.832c-7.808 7.808-18.044 11.712-28.28 11.712z',
+  back:
+    'M512.030 880c-98.296 0-190.708-38.28-260.214-107.784-69.508-69.508-107.786-161.922-107.786-260.216 0-98.296 38.278-190.708 107.786-260.214s161.918-107.786 260.214-107.786c98.292 0 190.708 38.28 260.214 107.786 69.504 69.508 107.786 161.918 107.786 260.214 0 98.294-38.282 190.708-107.786 260.216-69.508 69.504-161.922 107.784-260.214 107.784zM512.030 960c247.422 0 448-200.576 448-448s-200.578-448-448-448c-247.426 0-448 200.576-448 448s200.574 448 448 448v0zM267.63 538.67l125 125.438c15.596 15.648 40.922 15.692 56.57 0.098s15.692-40.92 0.098-56.566l-57.004-57.206h335.672c22.090 0 40-17.908 40-40s-17.91-40-40-40h-335.26l56.508-56.368c15.64-15.602 15.672-40.928 0.070-56.568-7.814-7.832-18.064-11.752-28.318-11.75-10.22 0-20.444 3.89-28.25 11.68l-125 124.688c-15.634 15.596-15.672 40.91-0.086 56.554z',
+  download:
+    'M881 513.188c0 98.296-38.28 190.708-107.784 260.214-69.508 69.508-161.922 107.786-260.216 107.786-98.296 0-190.708-38.28-260.214-107.786s-107.786-161.916-107.786-260.214c0-98.294 38.28-190.708 107.786-260.216 69.508-69.504 161.918-107.784 260.214-107.784 98.294 0 190.708 38.28 260.216 107.784 69.504 69.508 107.784 161.922 107.784 260.216zM961 513.188c0-247.424-200.576-448-448-448s-448 200.576-448 448 200.576 448 448 448 448-200.576 448-448v0zM539.672 757.584l125.436-125c15.65-15.594 15.692-40.92 0.1-56.568-15.594-15.648-40.92-15.694-56.568-0.1l-57.204 57.004v-335.67c0-22.092-17.908-40-40-40s-40 17.908-40 40v335.258l-56.368-56.508c-15.602-15.64-40.928-15.672-56.568-0.070-7.834 7.814-11.752 18.066-11.75 28.32 0 10.22 3.892 20.442 11.68 28.25l124.688 125c15.594 15.634 40.91 15.672 56.554 0.084z',
+  upload:
+    'M143.996 511.998c0-98.296 38.28-190.708 107.784-260.214 69.508-69.508 161.922-107.786 260.216-107.786 98.296 0 190.708 38.278 260.214 107.786s107.786 161.918 107.786 260.214c0 98.292-38.28 190.708-107.786 260.214-69.508 69.504-161.918 107.786-260.214 107.786-98.294 0-190.708-38.282-260.216-107.786-69.504-69.508-107.784-161.922-107.784-260.214zM63.996 511.998c0 247.422 200.576 448 448 448s448-200.578 448-448c0-247.426-200.576-448-448-448s-448 200.574-448 448v0zM485.324 267.598l-125.438 125c-15.648 15.596-15.692 40.922-0.098 56.57s40.92 15.692 56.566 0.098l57.206-57.004v335.672c0 22.090 17.908 40 40 40s40-17.91 40-40v-335.26l56.368 56.508c15.602 15.64 40.928 15.672 56.568 0.070 7.832-7.814 11.752-18.064 11.75-28.318 0-10.22-3.89-20.444-11.68-28.25l-124.688-125c-15.594-15.634-40.91-15.672-56.554-0.086z',
+  proceed:
+    'M512 144c98.296 0 190.708 38.28 260.214 107.784 69.506 69.508 107.786 161.922 107.786 260.216 0 98.296-38.28 190.708-107.786 260.214-69.506 69.508-161.918 107.786-260.214 107.786-98.294 0-190.708-38.28-260.216-107.786-69.504-69.506-107.784-161.916-107.784-260.214 0-98.294 38.28-190.708 107.784-260.216 69.508-69.504 161.922-107.784 260.216-107.784zM512 64c-247.424 0-448 200.576-448 448s200.576 448 448 448 448-200.576 448-448-200.576-448-448-448v0zM756.396 484.14l-125-125.436c-15.594-15.65-40.92-15.692-56.568-0.1-15.648 15.594-15.694 40.92-0.1 56.568l57.004 57.204h-335.67c-22.092 0-40 17.908-40 40s17.908 40 40 40h335.258l-56.508 56.368c-15.64 15.602-15.672 40.928-0.070 56.568 7.814 7.834 18.066 11.752 28.32 11.75 10.22 0 20.442-3.892 28.25-11.68l125-124.688c15.634-15.594 15.672-40.91 0.084-56.554z',
+  info:
+    'M828.782 195.216c-174.954-174.958-458.614-174.958-633.566 0-174.958 174.954-174.958 458.612 0 633.568 174.954 174.954 458.614 174.954 633.566 0 174.956-174.952 174.956-458.614 0-633.568zM772.214 772.214c-69.508 69.506-161.918 107.784-260.214 107.784-98.3 0-190.71-38.278-260.218-107.784-69.504-69.506-107.782-161.92-107.786-260.214 0.004-98.296 38.282-190.708 107.786-260.214 69.508-69.506 161.922-107.786 260.218-107.788 98.292 0.002 190.708 38.282 260.214 107.79 69.504 69.504 107.782 161.916 107.786 260.212-0.004 98.294-38.282 190.708-107.786 260.214zM512.996 361.124c-22.090 0-40-17.906-40-40v0c0-22.088 17.91-40 40-40v0c22.090 0 40.004 17.912 40.004 40v0c0 22.092-17.914 40-40.004 40v0zM512.998 743.094c-22.090 0-40-17.906-40-40v-240.002c0-22.090 17.91-40 40-40v0c22.090 0 40.004 17.91 40.004 40v240.002c0 22.094-17.914 40-40.004 40v0z',
+  question:
+    'M828.782 195.218c-174.954-174.958-458.614-174.958-633.566 0-174.958 174.954-174.958 458.612 0 633.566 174.954 174.956 458.614 174.956 633.566 0 174.956-174.95 174.956-458.614 0-633.566zM772.214 772.216c-69.508 69.504-161.918 107.782-260.214 107.782-98.3 0-190.71-38.278-260.218-107.782-69.504-69.506-107.782-161.92-107.786-260.216 0.004-98.298 38.282-190.708 107.786-260.216 69.508-69.504 161.922-107.784 260.218-107.784 98.292 0 190.708 38.28 260.214 107.788 69.504 69.504 107.782 161.916 107.786 260.214-0.004 98.294-38.282 190.708-107.786 260.214zM512.996 784.784c-22.090 0-40-17.906-40-40v0c0-22.090 17.91-40 40-40v0c22.090 0 40.004 17.91 40.004 40v0c0 22.094-17.914 40-40.004 40v0zM552.996 572.27v52.898c0.004 22.088-17.906 39.996-39.996 40-22.094 0-40.004-17.908-40-40v-88c-0.004-21.752 17.372-39.416 38.996-39.952v-0.146c53.118 0 96.332-43.212 96.332-96.33 0-53.116-43.214-96.328-96.332-96.328-53.098 0-96.296 43.184-96.324 96.278 0 0.014 0 0.034 0 0.050 0 22.094-17.914 40-40.004 40s-40-17.906-40-40c0-97.382 78.946-176.328 176.328-176.328 97.386 0 176.332 78.946 176.332 176.328 0 83.268-57.722 153.048-135.332 171.53z',
+  support:
+    'M828.814 195.216c-174.956-174.956-458.614-174.956-633.566 0-174.958 174.956-174.956 458.612 0 633.568s458.614 174.956 633.566 0c174.958-174.956 174.956-458.612 0-633.568zM813.592 723.072l-92.714-92.712c41.542-73.186 41.548-163.544 0.016-236.734l92.7-92.698c43.176 61.41 66.44 134.45 66.44 211.074-0.004 76.62-23.266 149.662-66.442 211.070zM398.916 625.116c-62.382-62.384-62.382-163.89 0-226.274 30.216-30.216 70.398-46.86 113.146-46.864h0.010c42.724 0 82.898 16.642 113.12 46.866 62.382 62.38 62.382 163.886 0 226.272-30.22 30.22-70.4 46.864-113.136 46.864-42.74-0.002-82.92-16.644-113.14-46.864zM723.104 210.44l-92.696 92.698c-36.59-20.766-77.464-31.162-118.356-31.158-40.888 0.004-81.78 10.406-118.378 31.178l-92.714-92.716c61.408-43.176 134.452-66.438 211.070-66.44 76.622-0.004 149.668 23.262 211.074 66.438zM210.472 300.928l92.724 92.726c-41.512 73.176-41.506 163.506 0.016 236.678l-92.742 92.74c-43.176-61.408-66.438-134.454-66.44-211.072 0.004-76.624 23.264-149.664 66.442-211.072zM512.032 880c-76.624-0.002-149.666-23.264-211.072-66.44l92.74-92.742c36.59 20.766 77.464 31.16 118.356 31.16 40.868 0 81.738-10.392 118.322-31.144l92.726 92.726c-61.408 43.176-134.454 66.44-211.072 66.44z',
+  alert:
+    'M511.998 623.846c-22.090 0-40-17.906-40-40v-208c0-22.090 17.91-40 40-40v0c22.090 0 40.004 17.91 40.004 40v208c0 22.094-17.914 40-40.004 40v0zM511.998 743.846c22.090 0 40.004-17.906 40.004-40v0c0-22.090-17.914-40-40.004-40v0c-22.090 0-40 17.91-40 40v0c0 22.094 17.91 40 40 40v0zM512.142 211.808l-340.074 589.028h680.148l-340.074-589.028zM512.142 92.51c14.5 0 29 9.526 40 28.58l398.638 690.462c22 38.106 4 69.282-40 69.282h-797.278c-44 0-62-31.176-40-69.282l398.638-690.462c11.002-19.052 25.502-28.58 40.002-28.58v0z',
+  bell:
+    'M901.344 760.018l-57.644-77.648c-7.906-7.906-11.77-38.284-11.71-48.646h0.042v-200.588h-0.364c-6.878-148.106-114.428-269.902-255.792-298.528 0.208-2.1 0.318-4.228 0.318-6.384 0-35.452-28.738-64.194-64.194-64.194-35.458 0-64.194 28.742-64.194 64.194 0 2.19 0.112 4.352 0.326 6.486-141.128 28.802-248.446 150.488-255.316 298.426h-0.364v200.588h0.042c0.058 10.362-3.804 40.74-11.71 48.646l-57.644 77.648c-8.802 8.802-16.35 18.978-16.35 32.208 0 22.092 17.908 40 40 40h255.876c-0.814 5.412-1.28 10.936-1.28 16.576 0 61.43 49.794 111.23 111.23 111.23 61.432 0 111.228-49.8 111.228-111.23 0-5.638-0.464-11.164-1.282-16.576h255.128c22.092 0 40-17.908 40-40 0.004-13.23-7.542-23.404-16.346-32.208zM272.732 436.848c2.862-61.602 29.032-119.104 73.69-161.91 44.786-42.93 103.628-66.62 165.692-66.706h0.26c62.062 0.086 120.906 23.776 165.692 66.706 44.658 42.806 70.828 100.308 73.69 161.91l0.278 5.962v149.384h-479.58v-149.384l0.278-5.962zM543.846 848.8c0 17.22-14.010 31.23-31.228 31.23-17.22 0-31.23-14.010-31.23-31.23 0-6.096 1.784-11.768 4.82-16.576h52.818c3.038 4.81 4.82 10.482 4.82 16.576zM512.484 752.226h-283.922l14.572-19.63c12.064-14.542 20.078-33.27 24.982-58.158 0.146-0.742 0.276-1.496 0.416-2.244h487.42c0.138 0.748 0.268 1.5 0.414 2.244 4.904 24.888 12.918 43.616 24.982 58.158l14.572 19.63h-283.436z',
+  rss:
+    'M256.094 865.048c0 53.020-42.972 96-96 96-53.020 0-96-42.98-96-96 0-53.016 42.98-96 96-96s96 42.984 96 96zM510.020 918.352c-0.018-0.172-0.042-0.344-0.050-0.52-0.054-0.676-0.124-1.34-0.214-2.004-10.582-105.644-57.866-200.46-128.894-271.536v0c-71.074-71.054-165.906-118.352-271.564-128.934-0.664-0.090-1.33-0.16-2.006-0.214-0.174-0.016-0.348-0.040-0.52-0.054-0.254-0.024-0.5-0.024-0.742-0.008-0.64-0.032-1.278-0.098-1.922-0.098-22.098 0-40 17.908-40 40 0 20.582 15.542 37.516 35.536 39.738 0.042 0.004 0.066 0.036 0.106 0.040 84.82 8.098 163.514 45.024 224.542 106.042v0c61.036 61.036 97.964 139.738 106.070 224.574 0.004 0.040 0.036 0.070 0.042 0.106 2.222 19.988 19.156 35.536 39.736 35.536 22.092 0 40-17.902 40-40 0-0.644-0.066-1.282-0.098-1.922 0-0.246 0-0.492-0.022-0.746zM734.688 918.45c-0.004-0.090-0.018-0.186-0.024-0.276-0.040-0.544-0.058-1.102-0.124-1.638-10.972-167.816-83.558-318.804-195.33-430.616h0.002c-111.812-111.788-262.81-184.384-430.644-195.36-0.542-0.060-1.094-0.084-1.642-0.122-0.092-0.008-0.182-0.016-0.272-0.022-0.020-0.002-0.042 0.004-0.054 0.004-0.836-0.052-1.664-0.124-2.512-0.124-22.092 0-40 17.908-40 40 0 21.036 16.246 38.24 36.874 39.842 0.046 0.008 0.078 0.038 0.128 0.042 66.876 4.086 131.786 19.292 193.406 45.358 70.472 29.81 133.78 72.494 188.166 126.874v0c54.394 54.396 97.090 117.71 126.902 188.204 26.064 61.624 41.274 126.532 45.362 193.408 0.004 0.052 0.036 0.080 0.042 0.13 1.604 20.624 18.802 36.87 39.844 36.87 22.090 0 40-17.904 40-40 0-0.85-0.074-1.678-0.126-2.514-0.002-0.024 0.006-0.040 0.002-0.060zM959.126 920.556c-0.002-0.094 0.008-0.164 0.004-0.262-10.342-231.204-108.314-439.604-261.486-592.796v-0.002c-153.2-153.19-361.61-251.174-592.828-261.518-0.096-0.004-0.168 0.006-0.262 0.004-0.176-0.004-0.348-0.030-0.524-0.030-22.098 0-40 17.91-40 40 0 20.988 16.168 38.164 36.716 39.834 0.184 0.042 0.356 0.086 0.566 0.098 97.040 4.314 191.186 25.538 280.376 63.258 97.14 41.090 184.406 99.928 259.368 174.876v0c74.96 74.964 133.81 162.24 174.908 259.398 37.718 89.19 58.946 183.336 63.26 280.376 0.010 0.208 0.052 0.38 0.096 0.562 1.67 20.552 18.848 36.72 39.834 36.72 22.092 0 40-17.906 40-40-0-0.17-0.024-0.342-0.028-0.518z',
+  edit:
+    'M948.56 263.376c12.704-12.708 15.072-31.836 7.11-46.936-1.84-3.524-4.232-6.832-7.192-9.792-0.286-0.286-0.594-0.528-0.886-0.8l-129.318-128.634c-0.048-0.048-0.088-0.106-0.138-0.154-7.812-7.812-18.050-11.716-28.292-11.714-10.242-0.004-20.484 3.902-28.296 11.714-0.064 0.066-0.12 0.136-0.184 0.204l-636.168 636.168c-5.868 5.134-10.21 11.958-12.298 19.748l-47.606 177.664c-3.7 13.804 0.248 28.534 10.352 38.638 7.602 7.6 17.816 11.714 28.288 11.714 3.452 0 6.93-0.446 10.352-1.364l177.664-47.606c7.296-1.956 13.732-5.904 18.74-11.216l521.486-521.484c1.126-0.904 2.222-1.87 3.268-2.914 1.042-1.044 2.006-2.138 2.91-3.264l107.75-107.748c0.836-0.71 1.668-1.432 2.458-2.224zM806.9 291.66l-73.592-73.202 56.61-56.61 73.594 73.2-56.612 56.612zM281.566 816.996l-73.4-73.4 468.572-468.568 73.594 73.202-468.766 468.766zM160.496 864.628l11.742-43.822 32.080 32.080-43.822 11.742z',
+  paintbrush:
+    'M946.58 293.66c12.704-12.708 15.072-31.836 7.108-46.938-1.838-3.524-4.23-6.83-7.19-9.79-0.282-0.282-0.588-0.52-0.876-0.792l-129.338-128.654c-0.046-0.046-0.084-0.098-0.13-0.144-7.814-7.812-18.056-11.718-28.296-11.714-10.24 0-20.48 3.906-28.292 11.714-0.064 0.066-0.12 0.138-0.184 0.206l-557.048 557.048c-2.194 2.192-4.042 4.59-5.622 7.11-70.624 87.486-17.922 195.43-174.738 239.554 0 0 64.758 18.11 144.33 18.11 74.374 0 161.678-15.824 221.23-77.020 0.394-0.364 0.808-0.696 1.192-1.078l1.734-1.734c0.852-0.798 1.678-1.578 2.504-2.426 0.348-0.356 0.668-0.728 1.010-1.086l168.756-168.756c1.126-0.906 2.224-1.872 3.272-2.918 1.044-1.044 2.008-2.14 2.914-3.266l375.212-375.212c0.834-0.706 1.664-1.424 2.452-2.214zM537.462 589.402l-73.594-73.206 324.068-324.064 73.594 73.2-324.068 324.070zM388.178 667.684c-13.288-13.632-28.584-23.974-44.78-31.016l63.902-63.902 73.596 73.204-64.246 64.248c-6.498-15.23-15.964-29.698-28.472-42.534zM229.848 791.928c8.294-30.346 14.852-54.332 32.416-73.862 0.83-0.864 2.664-2.702 4.26-4.286 8.030-6.792 17.534-8.246 24.198-8.246 14.386 0 29.026 6.554 40.162 17.98 19.592 20.106 21.934 49.238 5.596 66.874l-1.712 1.712c-0.798 0.752-1.612 1.524-2.462 2.354l-0.86 0.84-0.834 0.864c-30.666 31.79-75.914 45.424-118.104 50.542 7.53-18.888 12.598-37.426 17.34-54.772z',
+  close:
+    'M693.022 637.866c15.62 15.622 15.618 40.95 0 56.566-15.622 15.622-40.946 15.624-56.562 0.002l-124.46-124.458-124.456 124.458c-15.622 15.622-40.944 15.622-56.562 0-15.624-15.622-15.624-40.946-0.002-56.568l124.454-124.456-124.452-124.45c-15.622-15.622-15.622-40.946 0-56.564 15.62-15.624 40.944-15.624 56.568-0.002l124.45 124.45 124.454-124.452c15.622-15.62 40.95-15.62 56.566 0 15.622 15.62 15.624 40.944 0.002 56.56l-124.456 124.458 124.456 124.456zM828.784 828.784c-174.956 174.956-458.614 174.956-633.566 0-174.958-174.956-174.958-458.614 0-633.566 174.954-174.958 458.612-174.958 633.566 0 174.954 174.952 174.954 458.612 0 633.566zM880 511.998c-0.002-98.296-38.28-190.708-107.786-260.212s-161.92-107.786-260.214-107.788c-98.296 0.002-190.71 38.282-260.216 107.786-69.506 69.508-107.782 161.918-107.786 260.214 0.002 98.296 38.282 190.71 107.786 260.216 69.508 69.506 161.918 107.784 260.216 107.784 98.296 0 190.708-38.278 260.214-107.784s107.784-161.92 107.786-260.216z',
+  trash:
+    'M919.5 225.208h-215.5v-120.080c0-20.344-15.192-37.096-34.836-39.632-1.696-0.216-3.41-0.372-5.164-0.372h-304.004c-1.754 0-3.468 0.152-5.164 0.372-19.644 2.54-34.836 19.292-34.836 39.628v120.084h-215.996c-22.090 0-40 17.912-40 40.002 0 22.092 17.91 40 40 40h27.216l53.916 615.914h0.214c0 22.092 17.91 40 40 40h573.372c22.094 0 40-17.91 40-40h0.148l53.916-615.914h26.716c22.090 0 40-17.91 40-40s-17.908-40.002-39.998-40.002zM399.996 145.126h224.004v80.082h-224.004v-80.082zM762.062 881.124h-500.124l-50.414-575.912h600.954l-50.416 575.912zM632.004 697.124v-240c-0.004-22.092 17.906-40.002 40-40.002 22.090 0.002 40 17.908 40 40.002l-0.004 240.002c0.004 22.088-17.906 39.996-39.996 39.998-22.094 0.002-40.004-17.906-40-40zM311.996 697.124v-240c-0.004-22.092 17.906-40.002 40-40.002 22.090 0.002 40 17.908 40 40.002l-0.004 240.002c0.004 22.088-17.906 39.996-39.996 39.998-22.094 0.002-40.004-17.906-40-40zM472 697.124v-240c-0.004-22.092 17.906-40.002 40-40.002 22.090 0.002 40 17.908 40 40.002l-0.004 240.002c0.004 22.088-17.906 39.996-39.996 39.998-22.094 0.002-40.004-17.906-40-40z',
+  cross:
+    'M1013.286 955.716l-443.72-443.716 443.718-443.718c15.622-15.622 15.62-40.948-0.004-56.566-15.618-15.622-40.942-15.622-56.562 0l-443.716 443.718-443.72-443.718c-15.62-15.624-40.946-15.622-56.566 0-15.622 15.62-15.622 40.944 0 56.566l443.722 443.718-443.722 443.722c-15.622 15.618-15.62 40.942 0 56.56s40.948 15.622 56.566 0l443.72-443.718 443.722 443.718c15.618 15.624 40.942 15.622 56.56 0 15.62-15.618 15.622-40.944 0.002-56.566z',
+  delete:
+    'M828.786 195.216c-174.958-174.956-458.612-174.958-633.568 0-174.954 174.954-174.956 458.612 0 633.566 174.954 174.956 458.614 174.956 633.568 0 174.954-174.954 174.952-458.612 0-633.566zM251.786 251.786c69.506-69.506 161.916-107.784 260.212-107.788 84.838 0 165.278 28.538 230.402 81.028l-517.372 517.374c-52.492-65.126-81.026-145.568-81.030-230.404 0.004-98.294 38.282-190.704 107.788-260.21zM772.214 772.214c-69.506 69.506-161.918 107.784-260.214 107.786-84.836-0.004-165.276-28.538-230.402-81.030l517.376-517.372c52.492 65.126 81.028 145.564 81.028 230.402-0.004 98.296-38.284 190.71-107.788 260.214z',
+  add:
+    'M512 144c98.296 0 190.708 38.28 260.214 107.784 69.506 69.508 107.786 161.922 107.786 260.216 0 98.296-38.28 190.708-107.786 260.214-69.508 69.506-161.918 107.786-260.214 107.786-98.294 0-190.708-38.28-260.216-107.786-69.504-69.508-107.784-161.918-107.784-260.214 0-98.294 38.28-190.708 107.784-260.216 69.508-69.504 161.922-107.784 260.216-107.784zM512 64c-247.424 0-448 200.576-448 448s200.576 448 448 448 448-200.576 448-448-200.576-448-448-448v0zM729.002 473h-176.008v-176.008c0.002-22.090-17.906-39.994-39.996-39.994-22.088 0-39.998 17.908-39.998 39.998v176.004h-176c-22.094 0-40 17.908-39.998 40-0.002 22.090 17.904 39.996 39.996 39.996h176.002v176.004c0 22.094 17.908 40 40 39.998 22.090 0.002 39.996-17.904 39.996-39.996v-176.006l176.012-0.002c22.090 0.002 39.994-17.906 39.994-39.996-0.002-22.088-17.91-39.998-40-39.998z',
+  subtract:
+    'M512 64a448 448 0 1 1 0 896 448 448 0 0 1 0-896zm3 83a366 366 0 0 0-368 368 366 366 0 0 0 368 368 366 366 0 0 0 369-368 366 366 0 0 0-369-368zM295 472h434a40 40 0 0 1 0 80H295a40 40 0 1 1 0-80z',
+  plus:
+    'M921.002 473h-368.008v-368.004c0.002-22.090-17.906-39.996-39.996-39.996-22.088 0-39.998 17.91-39.998 40v368h-368.002c-22.094 0-40 17.908-39.998 40-0.002 22.090 17.904 39.996 39.996 39.996l368.004-0.002v368.010c0 22.094 17.908 40 40 39.996 22.090 0.004 39.996-17.902 39.996-39.996v-368.010h368.010c22.090 0.002 39.994-17.906 39.994-39.996-0-22.088-17.908-39.998-39.998-39.998z',
+  document:
+    'M863.98 242.454c0.008-0.23-0.094-3.944-0.152-4.624-0.058-0.688-0.368-2.972-0.496-3.742-0.008-0.058-0.352-1.712-0.54-2.486-0.124-0.508-0.246-1.014-0.39-1.518-0.226-0.784-1.106-3.292-1.296-3.78-0.304-0.754-1.426-3.162-1.668-3.626-0.398-0.762-1.75-3.028-2.008-3.418-0.606-0.924-1.262-1.81-1.942-2.678-0.132-0.168-0.246-0.346-0.382-0.512-0.98-1.212-2.028-2.364-3.14-3.454l-104.020-104.9c-3.714-3.714-7.988-6.518-12.54-8.464-0.090-0.040-3.762-1.404-4.008-1.48-0.942-0.288-1.894-0.516-2.852-0.732-0.336-0.076-0.66-0.176-0.996-0.244-1-0.2-3.618-0.558-3.922-0.59-1.324-0.13-2.652-0.204-3.976-0.204h-519.652c-1.754 0-3.468 0.152-5.164 0.372-19.644 2.54-34.836 19.292-34.836 39.628v752c0 22.094 17.91 40 40 40h624c22.090 0 40-17.906 40-40l-0.020-645.548zM784 848h-544v-672l439.614 0.002v65.186c0 22.090 17.91 40 40 40h64.368l0.018 566.812zM664 336c22.090 0 40 17.908 40 40s-17.91 40-40 40h-304c-22.092 0-40-17.908-40-40s17.908-40 40-40h304zM704 528c0 22.092-17.91 40-40 40h-304c-22.092 0-40-17.908-40-40s17.908-40 40-40h304c22.090 0 40 17.908 40 40zM704 680c0 22.092-17.91 40-40 40h-304c-22.092 0-40-17.908-40-40s17.908-40 40-40h304c22.090 0 40 17.908 40 40z',
+  folder:
+    'M571 274h327c23 0 41 18 41 41v488c0 22-18 40-41 40H126c-23 0-41-18-41-40V242c0-34 27-61 61-61h317c18 0 35 7 47 21l61 72zm-119-8H170v492h684V359H531l-79-93z',
+  component:
+    'M171 469h298V171H246c-42 0-75 33-75 75v223zm0 86v223c0 42 33 75 75 75h223V555H171zm682-86V246c0-42-33-75-75-75H555v298h298zm0 86H555v298h223c42 0 75-33 75-75V555zM256 85h512c94 0 171 77 171 171v512c0 94-77 171-171 171H256c-94 0-171-77-171-171V256c0-94 77-171 171-171z',
+  calendar:
+    'M920.036 160.030h-112.004v-72c0-22.092-17.906-40.004-40-40.004-22.090 0-40 17.906-40 40v72.004h-432v-72c0-22.092-17.906-40.004-40-40.004-22.090 0-40 17.906-40 40v72.004h-112.004c-1.38 0-2.746 0.070-4.090 0.208-20.168 2.046-35.91 19.080-35.91 39.792v688c0 22.090 17.91 40 40 40h816.008c22.098 0 40-17.91 40-40v-688c0-22.094-17.908-40-40-40zM356.032 848.026h-212.004v-142.662h212.004v142.662zM356.032 665.364h-212.004v-162.664h212.004v162.664zM356.032 462.7h-212.004v-142.662h212.004v142.662zM628.032 848.026h-232v-142.662h232v142.662zM628.032 665.364h-232v-162.664h232v162.664zM628.032 462.7h-232v-142.662h232v142.662zM880.036 848.026h-212.004v-142.662h212.004v142.662zM880.036 665.364h-212.004v-162.664h212.004v162.664zM880.036 462.7h-212.004v-142.662h212.004v142.662z',
+  graphline:
+    'M820.536 489.23c-15.624 15.618-40.954 15.618-56.57 0l-42.006-42.002-169.898 169.9c-7.822 7.82-18.076 11.722-28.326 11.712-10.248 0.008-20.496-3.894-28.314-11.712l-96.178-96.182-140.67 140.674c-15.624 15.622-40.954 15.618-56.57-0.004-15.624-15.618-15.624-40.946 0-56.566l168.946-168.946c7.812-7.816 18.058-11.72 28.3-11.716 10.238-0.002 20.476 3.904 28.29 11.716l96.204 96.204 168.91-168.91c0.33-0.356 0.626-0.73 0.972-1.076 7.824-7.824 18.084-11.726 28.34-11.712 10.252-0.012 20.508 3.892 28.332 11.714 0.346 0.346 0.64 0.72 0.972 1.074l69.266 69.266c15.62 15.618 15.616 40.942 0 56.566zM880 144h-736v736h736v-736zM920 64c22.092 0 40 17.908 40 40v816c0 22.092-17.908 40-40 40h-816c-22.092 0-40-17.908-40-40v-816c0-22.092 17.908-40 40-40h816z',
+  docchart:
+    'M919.938 128h-816.008c-1.38 0-2.746 0.070-4.090 0.208-20.168 2.046-35.91 19.080-35.91 39.792v688c0 22.090 17.91 40 40 40h816.008c22.098 0 40-17.91 40-40v-688c0-22.094-17.906-40-40-40zM395.934 470.67h232v162.664h-232v-162.664zM355.934 633.334h-212.004v-162.664h212.004v162.664zM395.934 430.67v-142.662h232v142.662h-232zM667.934 470.67h212.004v162.664h-212.004v-162.664zM667.934 430.67v-142.662h212.004v142.662h-212.004zM355.934 288.008v142.662h-212.004v-142.662h212.004zM143.93 673.334h212.004v142.662h-212.004v-142.662zM395.934 673.334h232v142.662h-232v-142.662zM667.934 673.334h212.004v142.662h-212.004v-142.662z',
+  doclist:
+    'M919.938 128h-816.008c-1.38 0-2.746 0.070-4.090 0.208-20.168 2.046-35.91 19.080-35.91 39.792v688c0 22.090 17.91 40 40 40h816.008c22.098 0 40-17.91 40-40v-688c-0-22.094-17.906-40-40-40zM143.93 288.008h736.008v527.988h-736.008v-527.988zM248 400.004c0-22.090 17.91-40 40-40h448c22.094 0 40 17.906 40 40 0 22.090-17.906 40-40 40h-448c-22.090 0-40-17.91-40-40zM776 552.002c0 22.094-17.906 40-40 40h-448c-22.090 0-40-17.906-40-40 0-22.090 17.91-40 40-40h448c22.094 0 40 17.91 40 40zM776 704c0 22.094-17.906 40-40 40h-448c-22.090 0-40-17.906-40-40 0-22.090 17.91-40 40-40h448c22.094 0 40 17.91 40 40z',
+  category:
+    'M925.224 256.37c-1.694-0.216-3.408-0.37-5.162-0.37h-816c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v624c0 22.094 17.91 40 40 40h816c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-624.004c0-20.342-15.19-37.096-34.838-39.632zM144.062 880v-544h736v544h-736zM896.11 180c0 11.044-8.954 20-20 20h-728.032c-11.046 0-20-8.956-20-20v0c0-11.046 8.954-20 20-20h728.032c11.046 0 20 8.954 20 20v0zM832.094 84c0 11.044-8.954 20-20 20h-600c-11.046 0-20-8.956-20-20v0c0-11.046 8.954-20 20-20h600c11.046 0 20 8.954 20 20v0z',
+  grid:
+    'M437.162 552.368c-1.694-0.216-3.408-0.37-5.162-0.37h-263.978c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v264.040c0 22.094 17.91 40 40 40h263.978c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-264.044c0-20.34-15.19-37.094-34.838-39.632zM208.022 816.038v-184.040h183.978v184.040h-183.978zM437.162 128.4c-1.694-0.216-3.408-0.37-5.162-0.37h-263.978c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v263.968c0 22.094 17.91 40 40 40h263.978c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-263.972c0-20.342-15.19-37.096-34.838-39.632zM208.022 392v-183.968h183.978v183.968h-183.978zM861.212 552.368c-1.694-0.216-3.408-0.37-5.162-0.37h-264.050c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v264.040c0 22.094 17.91 40 40 40h264.048c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-264.044c0.002-20.34-15.19-37.094-34.836-39.632zM632 816.038v-184.040h184.048v184.040h-184.048zM861.212 128.4c-1.694-0.216-3.408-0.37-5.162-0.37h-264.050c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.292-34.838 39.63v263.968c0 22.094 17.91 40 40 40h264.048c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.924 1.2-1.862 1.722-2.838 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-263.972c0.002-20.342-15.19-37.096-34.836-39.632zM632 392v-183.968h184.048v183.968h-184.048z',
+  copy:
+    'M960.132 210.186c0-0.444-0.050-0.874-0.066-1.312-0.024-0.684-0.044-1.366-0.104-2.046-0.060-0.74-0.158-1.468-0.26-2.198-0.080-0.564-0.156-1.128-0.258-1.692-0.146-0.792-0.328-1.566-0.518-2.34-0.124-0.508-0.244-1.014-0.39-1.518-0.224-0.784-0.488-1.548-0.76-2.312-0.176-0.49-0.344-0.98-0.538-1.466-0.302-0.754-0.642-1.486-0.988-2.216-0.224-0.472-0.436-0.946-0.68-1.41-0.398-0.762-0.838-1.496-1.284-2.228-0.242-0.396-0.466-0.798-0.722-1.19-0.608-0.924-1.262-1.81-1.942-2.678-0.132-0.168-0.248-0.346-0.382-0.512-0.98-1.212-2.028-2.364-3.14-3.454l-104.020-104.9c-3.714-3.714-7.988-6.518-12.542-8.464-0.088-0.040-0.174-0.084-0.262-0.122-0.994-0.418-2.006-0.774-3.024-1.108-0.242-0.080-0.474-0.176-0.72-0.252-0.942-0.288-1.894-0.516-2.854-0.732-0.334-0.076-0.658-0.176-0.996-0.244-0.998-0.2-2.004-0.336-3.010-0.458-0.306-0.038-0.606-0.1-0.912-0.13-1.322-0.13-2.65-0.204-3.976-0.204h-391.784c-1.754 0-3.468 0.152-5.162 0.372-19.646 2.538-34.838 19.29-34.838 39.628v145.516h-279.874c-1.754 0-3.468 0.152-5.162 0.372-19.646 2.538-34.838 19.29-34.838 39.628v628.28c0 22.094 17.91 40 40 40h496.118c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 2.084-3.466 2.128-3.548 2.992-5.612 4.704-12.010 4.704-18.808 0 0 0 0 0-0.004v-145.518h279.874c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 2.084-3.466 2.128-3.548 2.992-5.612 4.704-12.010 4.704-18.808 0 0 0 0 0-0.004v-521.828c0.008-0.23-0.016-0.458-0.014-0.688 0.002-0.202 0.028-0.39 0.028-0.584zM144.124 878.792v-548.278h311.752v65.186c0 22.090 17.91 40 40 40h64.366v443.092h-416.118zM640.244 693.278v-296.31c0.006-0.23-0.018-0.458-0.014-0.688 0.004-0.196 0.030-0.382 0.030-0.578 0-0.444-0.052-0.874-0.066-1.312-0.024-0.684-0.044-1.366-0.104-2.046-0.062-0.74-0.16-1.468-0.262-2.198-0.078-0.564-0.152-1.128-0.258-1.692-0.144-0.792-0.324-1.566-0.516-2.34-0.124-0.508-0.246-1.014-0.39-1.518-0.226-0.784-0.488-1.548-0.76-2.312-0.174-0.49-0.342-0.98-0.538-1.466-0.302-0.754-0.64-1.486-0.988-2.216-0.222-0.472-0.438-0.946-0.68-1.41-0.398-0.762-0.838-1.496-1.284-2.228-0.242-0.396-0.466-0.798-0.724-1.19-0.606-0.924-1.262-1.81-1.942-2.678-0.13-0.168-0.246-0.346-0.382-0.512-0.978-1.212-2.028-2.364-3.138-3.454l-104.020-104.9c-3.714-3.714-7.988-6.518-12.542-8.464-0.088-0.040-0.172-0.084-0.262-0.122-0.994-0.418-2.004-0.774-3.024-1.108-0.242-0.080-0.476-0.176-0.72-0.252-0.942-0.288-1.896-0.516-2.854-0.732-0.334-0.076-0.658-0.176-0.996-0.244-0.998-0.2-2.004-0.336-3.012-0.458-0.304-0.038-0.602-0.1-0.91-0.13-1.322-0.13-2.648-0.204-3.976-0.204h-31.916v-105.516h311.752v65.186c0 22.090 17.91 40 40 40h64.366v443.092h-239.87z',
+  certificate:
+    'M832.032 384.032c0-176.728-143.266-320-320-320s-320 143.272-320 320c0 104.662 50.25 197.584 127.938 255.966v311.5c0 16.174 9.74 30.756 24.682 36.952 4.954 2.052 10.152 3.050 15.31 3.050 10.402 0 20.626-4.060 28.276-11.702l123.726-123.58 123.772 123.332c11.452 11.412 28.644 14.804 43.574 8.608 14.93-6.2 24.66-20.776 24.66-36.942v-311.124c77.756-58.376 128.062-151.342 128.062-256.060zM272.032 384.032c0-64.106 24.964-124.374 70.292-169.706 45.33-45.33 105.6-70.294 169.708-70.294s124.376 24.964 169.708 70.294c45.33 45.332 70.292 105.6 70.292 169.706s-24.964 124.376-70.292 169.704c-45.33 45.33-105.6 70.294-169.708 70.294s-124.376-24.964-169.708-70.294c-45.328-45.328-70.292-105.598-70.292-169.704zM623.968 854.89l-83.804-83.508c-15.622-15.564-40.898-15.552-56.502 0.034l-83.694 83.594v-171.17c34.878 13.042 72.632 20.192 112.062 20.192 39.382 0 77.094-7.13 111.938-20.142v171z',
+  print:
+    'M925.922 304.496c-1.698-0.218-3.41-0.37-5.166-0.37h-88.64v-93.548c0.006-0.21-0.016-0.422-0.014-0.634 0.004-0.212 0.036-0.416 0.036-0.63 0-0.478-0.054-0.942-0.074-1.416-0.024-0.636-0.042-1.27-0.094-1.906-0.066-0.776-0.168-1.54-0.276-2.302-0.074-0.534-0.146-1.066-0.242-1.596-0.15-0.82-0.338-1.624-0.538-2.424-0.12-0.48-0.23-0.958-0.37-1.436-0.234-0.812-0.506-1.608-0.792-2.398-0.164-0.462-0.322-0.924-0.504-1.38-0.318-0.788-0.668-1.552-1.036-2.316-0.208-0.436-0.406-0.88-0.628-1.312-0.424-0.802-0.88-1.574-1.352-2.344-0.218-0.358-0.422-0.724-0.656-1.078-0.636-0.972-1.324-1.91-2.042-2.82-0.098-0.124-0.182-0.252-0.282-0.376-0.988-1.224-2.048-2.388-3.172-3.488l-104.004-104.882c-3.696-3.696-7.948-6.486-12.466-8.432-0.122-0.050-0.224-0.11-0.344-0.16-0.974-0.41-1.966-0.756-2.962-1.084-0.262-0.086-0.512-0.19-0.78-0.272-0.926-0.284-1.87-0.506-2.812-0.722-0.346-0.080-0.684-0.182-1.034-0.252-0.988-0.198-1.988-0.334-2.988-0.456-0.31-0.040-0.618-0.102-0.93-0.134-1.324-0.132-2.652-0.204-3.978-0.204h-455.67c-1.754 0-3.468 0.152-5.162 0.37-19.646 2.538-34.838 19.29-34.838 39.63v200h-87.356c-1.754 0-3.468 0.152-5.164 0.37-19.644 2.538-34.836 19.29-34.836 39.63v320c0 22.094 17.91 40 40 40h87.368v216c0 22.094 17.91 40 40 40h560.006c13.81 0 25.982-6.996 33.17-17.636 0.102-0.146 0.184-0.306 0.282-0.458 0.612-0.922 1.2-1.86 1.722-2.836 0.046-0.082 0.080-0.17 0.124-0.254 2.994-5.612 4.704-12.008 4.704-18.808 0 0 0 0 0-0.004v-216h88.624c13.808 0 25.982-6.996 33.168-17.636 0.104-0.148 0.186-0.308 0.286-0.458 0.612-0.922 1.198-1.862 1.72-2.836 0.046-0.082 0.082-0.172 0.124-0.256 2.994-5.61 4.702-12.008 4.702-18.806 0 0 0 0 0-0.004v-320c0-20.344-15.186-37.096-34.834-39.636zM272.116 144.128h375.634v65.186c0 1.38 0.070 2.746 0.208 4.090 2.048 20.168 19.080 35.91 39.792 35.91h64.366v54.812h-480v-159.998zM272.124 880.126v-327.998h480.006v327.998zM880.756 384.128v239.998h-48.624v-111.998c0-20.34-15.19-37.092-34.836-39.63-1.694-0.218-565.17-0.372-565.17-0.372-1.754 0-3.468 0.152-5.162 0.372-19.646 2.538-34.838 19.29-34.838 39.628v112h-47.368v-239.998zM664.124 608.126c22.092 0 40 17.908 40 40s-17.908 40-40 40h-304c-22.092 0-40-17.908-40-40s17.908-40 40-40h304zM704.124 784.126c0 22.092-17.908 40-40 40h-304c-22.092 0-40-17.908-40-40s17.908-40 40-40h304c22.092 0 40 17.908 40 40z',
+  listunordered:
+    'M961 233c0 22.090-17.908 40-40 40h-607.996c-22.090 0-40-17.908-40-40v0c0-22.090 17.908-40.002 40-40.002h607.996c22.092 0 40 17.912 40 40.002v0zM961 793c0-22.090-17.908-40.002-40-40.002h-607.996c-22.092 0-40 17.912-40 40.002v0c0 22.092 17.91 40 40 40h607.996c22.092 0 40-17.91 40-40v0zM961 606.332c0-22.090-17.908-40-40-40h-607.996c-22.092 0-40 17.91-40 40v0c0 22.094 17.91 40 40 40h607.996c22.092 0 40-17.91 40-40v0zM961 419.668c0-22.090-17.908-40.004-40-40.004h-607.996c-22.092 0-40 17.914-40 40.004v0c0 22.090 17.91 40 40 40h607.996c22.092-0 40-17.91 40-40v0zM129 168.998c-35.346 0-64 28.654-64 64s28.654 64 64 64 64-28.654 64-64-28.654-64-64-64zM129 728.998c-35.346 0-64 28.654-64 64s28.654 64 64 64 64-28.654 64-64-28.654-64-64-64zM129 542.332c-35.346 0-64 28.652-64 64 0 35.344 28.654 64 64 64s64-28.656 64-64c0-35.348-28.654-64-64-64zM129 355.664c-35.346 0-64 28.656-64 64 0 35.348 28.654 64 64 64s64-28.652 64-64c0-35.344-28.654-64-64-64z',
+  graphbar:
+    'M324.832 513c22.090 0 40 17.91 40 40v304c0 22.090-17.906 40-40 40v0c-22.090 0-40-17.906-40-40v-304c0-22.090 17.91-40 40-40v0zM884.832 128.998c-22.090 0-40 17.906-40 40v688.002c0 22.094 17.91 40 40 40v0c22.094 0 40-17.91 40-40v-688.002c0-22.094-17.91-40-40-40v0zM698.164 256.998c-22.090 0-40 17.91-40 40v560.002c0 22.094 17.91 40 40 40v0c22.094 0 40-17.91 40-40v-560.002c0-22.090-17.91-40-40-40v0zM511.5 384.998c-22.090 0-40.004 17.91-40.004 40v432.002c0 22.094 17.914 40 40.004 40v0c22.090 0 40-17.91 40-40v-432.002c0-22.090-17.91-40-40-40v0zM139.168 641c-22.090 0-40 17.91-40 40v176c0 22.094 17.91 40 40 40v0c22.094 0 40-17.91 40-40v-176c0-22.090-17.91-40-40-40v0z',
+  menu:
+    'M960 232c0 22.092-17.908 40-40.002 40h-815.996c-22.092 0-40-17.908-40-40v0c0-22.090 17.908-40 40-40h815.998c22.092 0 40 17.91 40 40v0zM768 416c0 22.090-17.908 40-40 40h-624c-22.090 0-40-17.908-40-40v0c0-22.090 17.908-40.002 40-40.002h624c22.092 0.002 40 17.914 40 40.002v0zM832 608c0 22.092-17.906 40.002-40 40.002h-688c-22.090 0-40-17.91-40-40.002v0c0-22.090 17.908-40 40-40h688c22.094 0 40 17.912 40 40v0zM576 792c0 22.094-17.91 40-40.002 40h-431.998c-22.090 0-40-17.906-40-40v0c0-22.094 17.908-40.002 40-40.002h432c22.094 0.002 40 17.912 40 40.002v0z',
+  filter:
+    'M962.030 168.032c0 22.092-17.908 40-40.002 40h-815.996c-22.092 0-40-17.908-40-40v0c0-22.090 17.908-40 40-40h815.998c22.092 0 40 17.908 40 40v0zM770 544.034c0 22.090-17.908 40-40 40h-432c-22.090 0-40-17.908-40-40v0c0-22.090 17.908-40.002 40-40.002h432c22.090 0 40 17.912 40 40.002v0zM642.030 728.032c0 22.094-17.91 40-40.002 40h-175.998c-22.090 0-40-17.906-40-40v0c0-22.094 17.908-40.002 40-40.002h176c22.094 0.002 40 17.91 40 40.002v0zM866 352.030c0 22.092-17.906 40.002-40 40.002h-624c-22.090 0-40-17.91-40-40.002v0c0-22.090 17.908-40 40-40h624c22.092 0 40 17.91 40 40v0zM512.030 928.034c22.090 0 40.004-17.906 40.004-40v0c0-22.090-17.914-40-40.004-40v0c-22.090 0-40 17.91-40 40v0c0 22.092 17.91 40 40 40v0z',
+  ellipsis:
+    'M184 393c66.274 0 120 53.73 120 120s-53.726 120-120 120c-66.286 0-120-53.73-120-120s53.714-120 120-120zM512 393c66.272 0 120 53.73 120 120s-53.728 120-120 120c-66.286 0-120-53.73-120-120s53.714-120 120-120zM840 393c66.272 0 120 53.73 120 120s-53.728 120-120 120c-66.286 0-120-53.73-120-120s53.714-120 120-120z',
+  cog:
+    'M396.458 151.486l27.768 27.768c23.28 23.29 54.262 36.116 87.242 36.116 0.318 0 0.636 0 0.958-0.004 0.292 0.002 0.58 0.004 0.872 0.004 32.99 0 63.976-12.83 87.22-36.098l27.61-27.604c19.584 6.294 38.582 14.192 56.892 23.642v39.976c0 32.878 13.406 64.804 36.842 87.888 23.072 23.384 54.966 36.762 87.804 36.762l39.442 0.002c9.168 17.906 16.852 36.462 23.014 55.574l-27.676 27.676c-23.222 23.224-36.318 55.242-36.094 88.096-0.248 32.884 12.844 64.934 36.094 88.19l27.928 27.928c-6.298 19.704-14.212 38.812-23.704 57.23l-38.984 0.002c-0.008 0-0.012 0-0.022 0-32.84 0-64.74 13.38-87.814 36.776-23.43 23.080-36.83 55-36.83 87.876v39.116c-18.38 9.486-37.456 17.406-57.122 23.714l-27.348-27.346c-23.278-23.3-54.264-36.13-87.254-36.13-0.292 0-0.58 0.002-0.872 0.004-0.318-0.004-0.636-0.004-0.958-0.004-32.978 0-63.962 12.826-87.228 36.102l-27.552 27.554c-19.874-6.338-39.144-14.32-57.708-23.902l-0.002-38.13c0.012-32.854-13.368-64.764-36.772-87.846-23.082-23.43-55.004-36.834-87.878-36.834h-38.506c-9.776-18.846-17.898-38.42-24.328-58.624l27.49-27.49c23.246-23.248 36.338-55.296 36.088-88.182 0.224-32.854-12.872-64.872-36.092-88.094l-27.23-27.232c6.29-19.612 14.182-38.628 23.636-56.966h38.942c32.878 0 64.802-13.402 87.884-36.838 23.398-23.086 36.778-54.994 36.766-87.81l0.002-39.028c18.492-9.546 37.688-17.506 57.48-23.834zM421.486 60.208c-59.932 11.946-115.658 35.516-164.752 68.268l-0.004 85.866c0.004 11.676-4.886 22.194-12.706 29.68-7.486 7.83-18.012 12.728-29.702 12.728h-85.806c-32.624 48.946-56.132 104.484-68.088 164.204l60.39 60.394c8.256 8.256 12.234 19.15 11.998 29.968 0.246 10.83-3.734 21.738-11.998 30.004l-60.562 60.56c11.97 60.402 35.74 116.552 68.826 165.948h85.24c11.69 0 22.214 4.9 29.702 12.73 7.818 7.482 12.708 17.998 12.706 29.676l0.004 85.004c49.162 32.796 104.976 56.386 165.006 68.316l60.654-60.656c8.028-8.032 18.55-12.014 29.072-12.014 0.312 0 0.62 0.004 0.93 0.010 0.298-0.006 0.602-0.010 0.9-0.010 10.526 0 21.046 3.982 29.070 12.014l60.542 60.534c59.78-11.968 115.376-35.512 164.356-68.19v-85.956c0-11.69 4.9-22.214 12.73-29.702 7.486-7.818 18.002-12.708 29.678-12.706l85.876-0.004c32.668-49.032 56.182-104.674 68.104-164.504l-61.050-61.052c-8.266-8.266-12.244-19.174-12-30.004-0.236-10.818 3.742-21.712 12-29.968l60.882-60.888c-11.91-59.144-35.158-114.178-67.37-162.758l-86.444-0.004c-0.004 0-0.008 0-0.008 0-11.674 0-22.188-4.89-29.67-12.708-7.83-7.486-12.73-18.012-12.73-29.702v-86.816c-48.912-32.632-104.418-56.158-164.106-68.14l-60.792 60.784c-8.024 8.032-18.546 12.014-29.070 12.014-0.3 0-0.602-0.004-0.9-0.012-0.308 0.008-0.618 0.012-0.93 0.012-10.522 0-21.044-3.982-29.072-12.014l-60.906-60.906zM511.856 314.472c-109.014 0-197.386 88.372-197.386 197.384 0 109.010 88.374 197.382 197.386 197.382v0.134c0.746 0 1.492 0.012 2.24 0.004 14.806-0.16 29.214-1.942 43.056-5.182 1.022-0.238 1.932-0.496 2.794-0.762 17.328-4.988 29.94-21.012 29.738-39.916-0.242-22.71-18.846-40.926-41.556-40.686-2.996 0.032-5.902 0.402-8.708 1.042-0.090 0.016-0.178 0-0.266 0.022-8.18 1.99-16.708 3.096-25.472 3.224-0.586-0.074-1.19-0.124-1.826-0.124-63.486 0-115.142-51.65-115.142-115.138 0-63.49 51.656-115.142 115.142-115.142 63.488 0 115.14 51.652 115.14 115.142 0 8.924-1.028 17.616-2.964 25.958-0.020 0.090-0.008 0.178-0.020 0.268-0.61 2.812-0.948 5.724-0.948 8.72 0 22.71 18.408 41.122 41.122 41.122 18.906 0 34.792-12.778 39.596-30.158 0.262-0.866 0.508-1.78 0.736-2.804 3.092-13.876 4.722-28.3 4.722-43.106 0-109.012-88.372-197.384-197.384-197.384z',
+  wrench:
+    'M959.438 274.25c0-22.090-17.914-40-40.004-40-11.16 0-21.242 4.582-28.496 11.954l-60.152 60.148c-15.622 15.622-40.946 15.618-56.566-0.004l-56.57-56.566c-15.622-15.622-15.622-40.95 0-56.57l59.55-59.546c7.75-7.292 12.614-17.618 12.614-29.102 0-22.090-17.914-40-40.004-40-1.598 0-3.164 0.122-4.71 0.304-0.012 0-0.020-0.008-0.032-0.004-94.958 11.586-168.504 92.492-168.504 190.574 0 23.528 4.238 46.058 11.98 66.886l-503.078 503.074c-1.496 1.496-2.8 3.102-4.012 4.758-10.914 13.676-17.454 30.992-17.454 49.848 0 44.188 35.818 79.996 79.996 79.996 18.906 0 36.27-6.574 49.964-17.54 1.614-1.188 3.18-2.464 4.64-3.926l503.078-503.078c20.828 7.742 43.36 11.98 66.882 11.98 97.988 0 178.828-73.402 190.54-168.222v-0.012c0.2-1.628 0.338-3.272 0.338-4.952zM151.996 912c-22.090 0-40-17.906-40-40 0-22.090 17.91-40 40-40s40.004 17.91 40.004 40c0 22.094-17.914 40-40.004 40z',
+  nut:
+    'M512.034 144.030l318.696 184v368l-318.696 184-318.702-184v-368l318.702-184zM512.034 64.030c-13.812 0-27.624 3.574-40 10.718l-318.702 184c-24.752 14.29-40 40.7-40 69.282v368c0 28.582 15.248 54.994 40 69.28l318.702 184c12.376 7.146 26.19 10.72 40 10.72 13.814 0 27.624-3.572 40-10.72l318.696-184c24.752-14.288 40-40.698 40-69.28v-368c0-28.582-15.248-54.992-40-69.282l-318.696-184c-12.376-7.144-26.188-10.718-40-10.718v0zM511.63 314.25c-109.014 0-197.386 88.372-197.386 197.384 0 109.010 88.374 197.382 197.386 197.382v0.134c0.746 0 1.492 0.012 2.24 0.004 14.806-0.162 29.214-1.942 43.056-5.182 1.022-0.24 1.932-0.496 2.794-0.762 17.328-4.988 29.94-21.012 29.738-39.916-0.242-22.71-18.846-40.926-41.556-40.684-2.996 0.032-5.902 0.402-8.708 1.040-0.090 0.016-0.178 0-0.266 0.022-8.18 1.99-16.708 3.094-25.474 3.222-0.584-0.072-1.188-0.124-1.826-0.124-63.486 0-115.142-51.65-115.142-115.138 0-63.49 51.656-115.142 115.142-115.142 63.488 0 115.14 51.652 115.14 115.142 0 8.924-1.028 17.616-2.964 25.96-0.020 0.088-0.008 0.178-0.020 0.266-0.61 2.814-0.948 5.724-0.948 8.72 0 22.712 18.408 41.122 41.122 41.122 18.906 0 34.792-12.776 39.596-30.158 0.262-0.866 0.508-1.78 0.736-2.804 3.092-13.876 4.724-28.3 4.724-43.106 0-109.010-88.372-197.382-197.384-197.382z',
+  camera:
+    'M925.164 208.372c-1.694-0.218-3.408-0.372-5.162-0.372h-471.968v-39.962c0-20.344-15.192-37.096-34.836-39.63-1.696-0.218-3.41-0.374-5.164-0.374h-176.004c-1.754 0-3.468 0.152-5.164 0.374-19.644 2.538-34.836 19.29-34.836 39.626v39.966h-88.032c-1.754 0-3.468 0.152-5.162 0.372-19.646 2.536-34.838 19.29-34.838 39.628v528c0 22.094 17.91 40 40 40h816.004c13.808 0 25.98-6.996 33.168-17.636 0.102-0.148 0.184-0.308 0.282-0.46 0.612-0.922 1.2-1.86 1.722-2.836 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.61 4.704-12.008 4.704-18.808v-528.004c-0-20.342-15.192-37.096-34.838-39.63zM880.002 736h-736.004v-448h736.004v448zM512 402.522c60.368 0 109.478 49.112 109.478 109.478s-49.112 109.478-109.478 109.478-109.478-49.112-109.478-109.478 49.11-109.478 109.478-109.478zM512 322.522c-104.644 0-189.478 84.832-189.478 189.478 0 104.644 84.834 189.478 189.478 189.478 104.646 0 189.478-84.834 189.478-189.478 0-104.646-84.832-189.478-189.478-189.478v0z',
+  eye:
+    'M1008.714 490.522c-9.002-12.594-223.276-308.808-496.684-308.808-273.444 0-487.682 296.214-496.684 308.808l-15.316 21.49 15.316 21.466c9.002 12.618 223.24 308.808 496.684 308.808 273.408 0 487.682-296.19 496.684-308.808l15.316-21.466-15.316-21.49zM807.68 631.688c-46 39.142-92.558 70.064-138.382 91.904-53.874 25.676-106.786 38.694-157.266 38.694-50.49 0-103.406-13.018-157.282-38.696-45.826-21.838-92.382-52.758-138.378-91.902-53.708-45.706-94.302-92.122-116.61-119.672 22.36-27.602 63.028-74.094 116.612-119.696 45.996-39.146 92.554-70.068 138.378-91.908 53.876-25.678 106.792-38.698 157.28-38.698 50.48 0 103.39 13.020 157.264 38.696 45.824 21.842 92.382 52.764 138.382 91.91 53.602 45.614 94.264 92.098 116.624 119.696-22.306 27.544-62.898 73.954-116.622 119.672zM692.032 512.036c0 99.41-80.588 180-180 180s-180-80.59-180-180c0-99.406 80.588-179.998 180-179.998s180 80.59 180 179.998z',
+  eyeclose:
+    'M75.744 948.314c-15.62-15.62-15.62-40.948 0-56.564l816-816c15.626-15.624 40.95-15.624 56.57 0 15.624 15.62 15.626 40.946 0.004 56.57l-816 815.994c-15.62 15.62-40.95 15.62-56.572 0zM332.032 512.034c0 20.104 3.296 39.434 9.376 57.484l228.104-228.106c-18.050-6.080-37.38-9.376-57.48-9.376-99.412-0.004-180 80.588-180 179.996zM692.032 512.034c0-20.1-3.3-39.432-9.38-57.484l-228.106 228.11c18.052 6.080 37.384 9.376 57.488 9.376 99.412 0 180-80.59 180-180zM1008.716 490.522c-4.98-6.968-72.86-100.8-178.81-183.22l-57.040 57.040c11.624 8.8 23.24 18.128 34.814 27.98 53.6 45.614 94.264 92.1 116.624 119.696-22.304 27.544-62.896 73.954-116.62 119.672-46 39.14-92.56 70.064-138.384 91.904-53.872 25.676-106.786 38.694-157.266 38.694-37.448 0-76.234-7.18-115.76-21.36l-61.486 61.49c54.786 24.22 114.45 39.87 177.248 39.87 273.41 0 487.684-296.19 496.686-308.808l15.316-21.468-15.316-21.49zM216.372 631.69c-53.708-45.706-94.3-92.12-116.61-119.672 22.36-27.6 63.028-74.094 116.612-119.696 46-39.146 92.554-70.068 138.38-91.908 53.874-25.68 106.79-38.7 157.28-38.7 37.46 0 76.264 7.188 115.8 21.38l61.484-61.484c-54.796-24.236-114.474-39.896-177.286-39.896-273.446 0-487.684 296.214-496.686 308.808l-15.316 21.49 15.314 21.466c4.98 6.984 72.866 100.84 178.84 183.26l57.040-57.040c-11.64-8.806-23.264-18.144-34.854-28.008z',
+  photo:
+    'M920 64h-816c-22.092 0-40 17.91-40 40v816c0 22.094 17.908 40 40 40h816c22.092 0 40-17.906 40-40v-816c0-22.090-17.908-40-40-40zM880 144v449.782l-235.39-235.392c-7.502-7.5-17.676-11.714-28.286-11.714s-20.784 4.214-28.286 11.716l-169.804 169.804-40.958-40.958c-15.622-15.622-40.95-15.622-56.57 0l-176.708 176.708v-519.946h736.002zM144 880v-102.914l204.992-204.994 215.972 215.974c7.81 7.81 18.048 11.714 28.286 11.714s20.474-3.904 28.286-11.714c15.62-15.622 15.62-40.95 0-56.57l-146.732-146.73 141.522-141.524 263.676 263.68v173.078h-736.002zM356.174 400.542c52.466 0 95-42.536 95-95s-42.534-95-95-95-95 42.536-95 95 42.534 95 95 95zM356.174 250.542c30.326 0 55 24.672 55 55s-24.674 55-55 55-55-24.672-55-55 24.674-55 55-55z',
+  video:
+    'M926.050 273.364c-9.556 0-20.574 3.8-32.278 11.812l-189.738 129.894v-151.068c0-20.342-15.192-37.094-34.838-39.63-1.694-0.218-3.408-0.372-5.162-0.372h-560.002c-1.754 0-3.468 0.152-5.162 0.372-19.646 2.538-34.838 19.29-34.838 39.628v496.002c0 22.092 17.91 40 40 40h560.004c13.808 0 25.98-6.998 33.168-17.638 0.102-0.148 0.184-0.308 0.282-0.458 0.612-0.922 1.2-1.862 1.722-2.836 0.046-0.082 0.080-0.172 0.124-0.254 2.994-5.612 4.704-12.010 4.704-18.81v-151.066l189.738 129.886c11.706 8.012 22.718 11.812 32.278 11.812 20.092 0 33.736-16.806 33.736-46.622v-384.032c0-29.816-13.644-46.62-33.738-46.62zM624.036 720h-480.004v-415.998h480.004v415.998zM879.788 632.3l-175.728-120.296 175.728-120.302v240.598zM240.688 663.534c-22.090 0-40-17.906-40-40v0c0-22.090 17.91-40 40-40v0c22.090 0 40.004 17.91 40.004 40v0c0 22.092-17.914 40-40.004 40v0z',
+  speaker:
+    'M692.070 580.856c18.156-18.156 28.152-42.266 28.152-67.89-0.008-25.622-10.002-49.726-28.148-67.872-8.476-8.478-18.308-15.188-29-19.922-0.222-0.098-0.408-0.22-0.566-0.364-13.294-6.5-22.476-20.116-22.476-35.914 0-22.090 17.91-40 40-40 5.774 0 11.246 1.248 16.204 3.45 0.016 0.006 0.026 0.008 0.040 0.016 19.292 8.656 37.036 20.832 52.368 36.164 33.254 33.254 51.574 77.446 51.58 124.43 0.006 46.996-18.31 91.204-51.58 124.472-15.064 15.062-32.45 27.074-51.344 35.7-0.154 0.070-0.286 0.112-0.434 0.176-5.124 2.382-10.812 3.75-16.832 3.75-22.090 0-40-17.906-40-40 0-16.196 9.644-30.112 23.488-36.402 0.156-0.11 0.32-0.216 0.516-0.304 10.314-4.712 19.81-11.268 28.032-19.49zM861.778 275.386c-47.824-47.824-107.946-79.588-173.204-92.242-0.356-0.078-0.712-0.146-1.072-0.214-0.060-0.012-0.124-0.026-0.186-0.038-0.506-0.096-0.976-0.162-1.422-0.208-1.918-0.282-3.868-0.476-5.864-0.476-22.090 0-40 17.91-40 40 0 19.024 13.292 34.91 31.084 38.968 0.352 0.128 0.728 0.244 1.162 0.326 48.7 9.268 95.226 32.748 132.934 70.452 99.972 99.972 100.054 261.984-0.002 362.040-37.684 37.684-84.152 61.14-132.788 70.426-0.084 0.016-0.144 0.046-0.224 0.066-18.338 3.644-32.166 19.816-32.166 39.222 0 22.094 17.91 40 40 40 2.776 0 5.484-0.286 8.102-0.822 0.094-0.018 0.172-0.018 0.27-0.038 65.32-12.626 125.496-44.406 173.376-92.286 131.008-131.008 131.008-344.172 0-475.176zM525.988 159.516v704.968c0 22.090-17.906 40-40 40-12.73 0-24.046-5.966-31.374-15.234l-51.056-61.722v0.216l-122.14-147.666h-177.386c-22.090 0-40-17.906-40-40v0 0-256c0-5.22 1.030-10.194 2.85-14.766 0.104-0.266 0.184-0.542 0.294-0.804 0.39-0.924 0.844-1.812 1.3-2.702 0.134-0.26 0.242-0.538 0.382-0.794 0.246-0.456 0.54-0.878 0.804-1.324 6.972-11.726 19.734-19.61 34.368-19.61h177.386l173.13-209.238c7.324-9.316 18.67-15.324 31.44-15.324 22.092-0 40.002 17.91 40.002 40zM445.988 270.826l-126.708 153.252h-175.248v176h175.248l19.832 23.998h0.17l106.708 129.112v-482.362z',
+  phone:
+    'M742.52 960c-76.266 0-163.184-32.364-258.338-96.194-73.798-49.504-136.41-106.904-175.938-146.34-43.282-43.222-105.612-111.376-156.842-190.682-66.576-103.062-95.348-196.038-85.518-276.344 8.952-73.326 50.674-134.292 120.664-176.304 10.95-6.63 23.76-10.134 37.054-10.134 32.752 0 71.124 23.354 120.764 73.494 36.434 36.802 70.108 79.22 89.472 106.644 46.698 66.176 60.686 107.352 48.286 142.136-12.638 35.538-35.534 55.704-52.25 70.428-5.662 5.006-9.95 8.854-13.070 12.262 4.040 7.542 11.744 19.868 26.054 37.476 42.388 52.076 90.548 89.024 111.972 100.874 3.308-2.96 7.11-7.168 12.352-13.152 14.87-16.81 35.062-39.636 70.482-52.28 7.978-2.842 16.498-4.276 25.35-4.276 44.172 0 108.804 44.078 155.246 81.056 45.834 36.494 103.292 90.498 127.104 132.612 22.602 39.596 14.982 68.64 4.596 86.006-48.138 80.296-119.862 122.718-207.44 122.718zM224.758 144.53c-47.558 29.426-73.566 67.28-79.468 115.618-7.494 61.224 17.17 136.326 73.308 223.226 49.902 77.252 112.994 144.35 146.16 177.472 30.296 30.222 91.906 88.17 163.988 136.524 81.738 54.83 153.662 82.63 213.772 82.63 58.618 0 103.506-26.526 137.138-81.076-0.47-1.536-1.532-4.062-3.854-8.132-14.584-25.794-57.006-69.202-105.642-108.156-58.776-47.074-96.708-63.894-106.756-64.982-15.348 5.826-25.020 16.758-36.178 29.372-12.542 14.318-28.31 32.316-55.476 41.528l-6.25 2.12h-6.598c-8.704 0-31.826 0-86.73-43.378-32.196-25.438-64.65-57.534-91.38-90.374-35.712-43.942-51.41-77.764-46.674-100.548l0.55-2.642 0.9-2.546c9.19-26 26.284-41.118 41.364-54.458 12.726-11.208 23.698-20.874 29.494-36.378-0.606-4.398-5.076-23.488-37.948-70.072-15.882-22.494-45.746-60.376-77.614-93.084-39.93-40.986-60.106-50.546-66.106-52.664z',
+  flag:
+    'M168 960.060c-22.092 0-40-17.908-40-40v-816.36c0-22.092 17.908-40 40-40h687.698c16.178 0 30.764 9.746 36.956 24.694 6.192 14.946 2.77 32.15-8.67 43.59l-188.918 188.922 189.218 189.216c11.44 11.442 14.862 28.646 8.67 43.592-6.192 14.948-20.776 24.694-36.956 24.694h-647.998v341.654c0 22.090-17.908 39.998-40 39.998zM208 498.406h551.428l-149.218-149.216c-15.622-15.622-15.622-40.95 0-56.568l148.918-148.922h-551.128v354.706z',
+  pin:
+    'M512 959.916c-13.36 0-25.84-6.672-33.262-17.782l-242.080-362.324c-0.12-0.176-0.236-0.356-0.354-0.536-36.394-54.5-55.63-118.042-55.63-183.804 0-182.696 148.632-331.324 331.326-331.324 182.696 0 331.328 148.628 331.328 331.324 0 60.71-16.554 119.98-47.906 171.652-0.758 1.528-1.618 3.016-2.578 4.45l-5.786 8.664c-0.054 0.082-0.112 0.164-0.168 0.246-0.042 0.070-0.104 0.16-0.148 0.23l-241.484 361.426c-7.422 11.106-19.898 17.778-33.258 17.778zM303.458 535.784l0.026 0.040c0.038 0.054 0.158 0.238 0.194 0.292l208.324 311.796 212.374-317.86c0.376-0.696 0.778-1.382 1.198-2.062 24.7-39.708 37.758-85.532 37.758-132.52 0-138.582-112.746-251.324-251.328-251.324s-251.326 112.742-251.326 251.324c0 50.054 14.674 98.39 42.432 139.782 0.114 0.176 0.232 0.356 0.348 0.532zM512 304.4c49.98 0 90.64 40.66 90.64 90.64 0 49.976-40.66 90.636-90.64 90.636s-90.64-40.66-90.64-90.636c0-49.98 40.66-90.64 90.64-90.64zM512 224.4c-94.242 0-170.64 76.398-170.64 170.64s76.398 170.636 170.64 170.636 170.64-76.394 170.64-170.636-76.398-170.64-170.64-170.64v0z',
+  compass:
+    'M960 512c0-247.424-200.574-448-448-448-247.422 0-448 200.576-448 448s200.578 448 448 448c247.426 0 448-200.576 448-448zM251.786 772.214c-69.504-69.508-107.786-161.918-107.786-260.214 0-98.294 38.282-190.708 107.786-260.216 69.508-69.504 161.918-107.784 260.214-107.784s190.708 38.28 260.214 107.784c69.508 69.508 107.786 161.922 107.786 260.216 0 98.296-38.278 190.708-107.786 260.214s-161.922 107.786-260.214 107.786c-98.296 0-190.708-38.28-260.214-107.786zM565.742 565.74c-0.93 0.93-1.95 1.768-3.050 2.498l-237.586 158.392c-7.934 5.29-18.496 4.242-25.238-2.498-6.738-6.742-7.786-17.304-2.496-25.236l158.39-237.588c1.464-2.2 3.348-4.082 5.546-5.546l237.586-158.392c7.934-5.29 18.496-4.242 25.238 2.498 6.742 6.742 7.79 17.304 2.5 25.238l-158.394 237.586c-0.73 1.1-1.566 2.118-2.496 3.048zM386.122 637.878l151.054-100.704-50.352-50.352-100.702 151.056z',
+  globe:
+    'M530.878 65.424c-6.748-1.014-13.090-1.424-18.878-1.424s-12.13 0.41-18.878 1.424c-238.662 9.9-429.122 206.48-429.122 447.576 0 247.424 200.578 448 448 448 247.426 0 448-200.576 448-448 0-241.098-190.456-437.678-429.122-447.576zM877.84 472.998h-158.508c-3.16-92.542-17.532-179.266-41.262-247.494-6.442-18.52-13.534-35.536-21.228-50.988 42.548 18.214 81.66 44.556 115.374 78.268 59.988 59.99 96.69 137.046 105.624 220.214zM512 880c-65.872 0-120.112-143.058-127.206-327h254.41c-7.092 183.942-61.332 327-127.204 327zM384.714 472.998c6.426-175.362 55.69-314.010 117.15-327.852 3.372-0.092 6.748-0.146 10.134-0.146s6.764 0.054 10.136 0.146c61.46 13.842 110.722 152.49 117.148 327.852h-254.568zM251.786 252.784c33.714-33.71 72.826-60.052 115.374-78.268-7.694 15.452-14.788 32.468-21.226 50.988-23.732 68.228-38.104 154.952-41.264 247.494h-158.508c8.934-83.168 45.636-160.224 105.624-220.214zM146.16 553h158.578c3.298 91.792 17.632 177.762 41.194 245.498 6.798 19.55 14.33 37.416 22.526 53.542-43.050-18.232-82.616-44.772-116.672-78.826-59.988-59.99-96.69-137.044-105.626-220.214zM772.214 773.214c-34.054 34.054-73.622 60.592-116.672 78.824 8.196-16.126 15.726-33.99 22.528-53.542 23.558-67.736 37.892-153.704 41.192-245.498h158.578c-8.934 83.172-45.634 160.226-105.626 220.216z',
+  location:
+    'M960.002 512l-0.002-0.026c-0.006-114.646-43.746-229.288-131.216-316.758-174.954-174.958-458.614-174.958-633.566 0-174.958 174.954-174.958 458.612 0 633.568 87.45 87.45 202.056 131.186 316.674 131.214 0.022 0 0.042 0.002 0.064 0.002 0.014 0 0.026-0.002 0.042-0.002 114.654 0 229.308-43.738 316.788-131.214 87.472-87.47 131.21-202.114 131.216-316.76l0-0.024zM772.216 772.214c-60 59.998-137.072 96.702-220.258 105.626v-133.84c0-22.090-17.914-40-40.004-40s-40 17.91-40 40v133.83c-83.154-8.942-160.194-45.64-220.172-105.618-59.986-59.988-96.686-137.042-105.624-220.21h133.84c22.090 0 40-17.914 40-40.004s-17.91-40-40-40h-133.84c8.936-83.17 45.636-160.226 105.624-220.214 59.978-59.976 137.020-96.676 220.172-105.622v133.836c0 22.094 17.91 40 40 40s40.004-17.906 40.004-40v-133.844c83.184 8.926 160.258 45.63 220.258 105.63 59.986 59.986 96.688 137.042 105.624 220.212h-133.838c-22.094 0-40 17.91-40 40s17.906 40.004 40 40.004h133.838c-8.938 83.172-45.636 160.226-105.624 220.214z',
+  search:
+    'M218 670a318 318 0 0 1 0-451 316 316 0 0 1 451 0 318 318 0 0 1 0 451 316 316 0 0 1-451 0m750 240L756 698a402 402 0 1 0-59 60l212 212c16 16 42 16 59 0 16-17 16-43 0-60',
+  zoom:
+    'M220 670a316 316 0 0 1 0-450 316 316 0 0 1 450 0 316 316 0 0 1 0 450 316 316 0 0 1-450 0zm749 240L757 698a402 402 0 1 0-59 59l212 212a42 42 0 0 0 59-59zM487 604a42 42 0 0 1-84 0V487H286a42 42 0 1 1 0-84h117V286a42 42 0 1 1 84 0v117h117a42 42 0 0 1 0 84H487v117z',
+  zoomout:
+    'M757 698a402 402 0 1 0-59 59l212 212a42 42 0 0 0 59-59L757 698zM126 445a316 316 0 0 1 319-319 316 316 0 0 1 318 319 316 316 0 0 1-318 318 316 316 0 0 1-319-318zm160 42a42 42 0 1 1 0-84h318a42 42 0 0 1 0 84H286z',
+  zoomreset:
+    'M148 560a318 318 0 0 0 522 110 316 316 0 0 0 0-450 316 316 0 0 0-450 0c-11 11-21 22-30 34v4h47c25 0 46 21 46 46s-21 45-46 45H90c-13 0-25-6-33-14-9-9-14-20-14-33V156c0-25 20-45 45-45s45 20 45 45v32l1 1a401 401 0 0 1 623 509l212 212a42 42 0 0 1-59 59L698 757A401 401 0 0 1 65 570a42 42 0 0 1 83-10z',
+  timer:
+    'M576 540.658c0 35.344-28.654 64-64 64s-64-28.656-64-64c0-20.27 9.432-38.324 24.134-50.050v-193.418c-0.004-22.092 17.906-40.002 40-40 22.090 0 40 17.906 40 40l-0.004 193.626c14.552 11.732 23.87 29.692 23.87 49.842zM928.32 543.934c0 229.79-186.28 416.066-416.068 416.066-229.786 0-416.064-186.278-416.064-416.066 0-216.26 164.998-393.958 375.97-414.134l0.188-49.794h-16.348c-22.092 0-40.002-17.91-39.998-40 0-22.090 17.906-40.004 40-40.004l112 0.002c22.090-0.002 39.998 17.91 40 40 0 22.090-17.908 40-40 39.998h-15.656l-0.19 49.782c77.246 7.352 148.33 35.812 207.422 79.564l41.854-41.856c15.622-15.622 40.95-15.618 56.57 0.002s15.622 40.948 0 56.568l-38.9 38.9c67.822 74.028 109.22 172.66 109.22 280.972zM848.32 543.934c0-89.768-34.958-174.16-98.432-237.634s-147.87-98.432-237.636-98.432c-89.766 0-174.158 34.958-237.632 98.432s-98.432 147.868-98.432 237.634c0 89.766 34.958 174.16 98.432 237.636 63.474 63.472 147.868 98.43 237.632 98.43 89.768 0 174.162-34.958 237.636-98.43 63.476-63.476 98.432-147.87 98.432-237.636z',
+  time:
+    'M512 64c-247.424 0-448 200.578-448 448.004 0 247.422 200.576 448 448 448s448-200.578 448-448c0-247.424-200.576-448.004-448-448.004zM772.214 772.22c-69.508 69.504-161.918 107.786-260.214 107.786s-190.708-38.282-260.214-107.786c-69.508-69.508-107.786-161.918-107.786-260.214s38.278-190.708 107.786-260.214c69.508-69.504 161.918-107.786 260.214-107.786s190.708 38.278 260.214 107.786c69.504 69.508 107.786 161.918 107.786 260.214s-38.282 190.706-107.786 260.214zM768.004 517.004c0 22.090-17.91 40-40 40h-216c-5.384 0-10.508-1.078-15.196-3.008-0.124-0.046-0.254-0.086-0.376-0.132-0.61-0.262-1.188-0.57-1.782-0.86-0.572-0.278-1.16-0.528-1.718-0.828-0.204-0.114-0.39-0.246-0.594-0.364-0.918-0.516-1.832-1.050-2.704-1.64-0.086-0.058-0.164-0.128-0.254-0.188-10.492-7.21-17.382-19.286-17.382-32.98v-285c0-22.094 17.91-40 40.004-40 22.088 0 40 17.906 40 40v244.996h175.996c22.094 0 40.002 17.916 40.006 40.004z',
+  lightning:
+    'M320.022 1022.644c-7.408 0-14.852-2.052-21.44-6.238-15.292-9.714-22.144-28.494-16.706-45.774l115.186-365.908-214.552-52.57c-14.714-3.606-26.128-15.214-29.486-29.988-3.356-14.772 1.92-30.174 13.632-39.786l576-472.662c14.458-11.864 35.208-12.126 49.962-0.626 14.752 11.496 19.568 31.682 11.594 48.602l-171.202 363.256 208.648 51.756c14.29 3.544 25.476 14.652 29.124 28.914s-0.834 29.376-11.668 39.344l-512 471.112c-7.586 6.984-17.308 10.568-27.092 10.568zM279.236 493.49l178.314 43.69c10.74 2.632 19.912 9.59 25.336 19.226s6.62 21.086 3.298 31.636l-83.030 263.76 347.066-319.352-183.82-45.596c-11.63-2.884-21.356-10.832-26.498-21.656-5.144-10.822-5.164-23.382-0.054-34.22l116.31-246.788-376.922 309.3z',
+  dashboard:
+    'M567.594 674.956c-17.674 30.61-56.816 41.098-87.426 23.426-30.61-17.676-41.1-56.816-23.426-87.426 10.134-17.554 27.33-28.472 45.928-31.278l146.974-254.57c11.042-19.132 35.506-25.688 54.64-14.64 19.13 11.046 25.688 35.508 14.64 54.64l-147.084 254.75c6.736 17.434 5.826 37.648-4.246 55.098zM512.002 209.26c-98.296 0-190.708 38.28-260.214 107.786s-107.786 161.92-107.786 260.214c0 81.428 26.252 158.786 74.768 222.452 88.404-30.49 188.406-46.448 292.732-46.448 104.662 0 204.926 16.046 293.524 46.716 48.65-63.712 74.976-141.164 74.976-222.72 0-98.294-38.28-190.708-107.786-260.214s-161.918-107.786-260.214-107.786zM512.002 129.26c247.424 0 448 200.578 448 448 0 124.132-50.494 236.468-132.054 317.602-87.096-38.574-196.984-61.598-316.446-61.598-119.146 0-228.772 22.902-315.758 61.296-81.376-81.114-131.742-193.324-131.742-317.3 0-247.422 200.576-448 448-448v0z',
+  hourglass:
+    'M511.926 801.946c-22.090 0-40-17.906-40-40v0c0-22.090 17.91-40 40-40v0c22.090 0 40.004 17.91 40.004 40v0c0 22.094-17.914 40-40.004 40v0zM831.682 915.242c0.192 1.582 0.318 3.186 0.318 4.82 0 22.090-17.908 40-40 40h-560c-22.092 0-40-17.914-40-40 0-2.438 0.252-4.812 0.67-7.128 2.36-53.636 18.034-105.7 45.852-151.554 0.734-1.476 1.562-2.912 2.492-4.296l5.582-8.364c0.054-0.080 0.11-0.158 0.164-0.238 0.042-0.068 0.098-0.156 0.144-0.222l157.704-236.036-158.5-237.228c-0.116-0.17-0.23-0.342-0.34-0.516-32.842-49.178-51.11-105.994-53.368-165.044-0.238-1.762-0.402-3.546-0.402-5.374 0-22.090 17.908-40 40-40h560c22.092 0 40 17.914 40 40 0 2.056-0.204 4.064-0.504 6.038-2.194 54.020-17.886 106.48-45.894 152.648-0.734 1.472-1.562 2.91-2.492 4.294l-5.582 8.366c-0.054 0.078-0.11 0.156-0.164 0.236-0.042 0.068-0.098 0.154-0.144 0.222l-157.734 236.082 158.468 237.182c0.116 0.168 0.23 0.344 0.34 0.516 32.946 49.33 51.226 106.346 53.39 165.596zM749.958 144.060h-475.99c6.138 31.304 18.384 61.124 36.354 87.916 0.118 0.17 0.23 0.344 0.342 0.514l0.024 0.038c0.036 0.054 0.15 0.23 0.186 0.284l54.286 81.25h293.596l58.196-87.1c0.366-0.67 0.75-1.334 1.154-1.99 15.492-24.916 26.228-52.324 31.852-80.912zM497.528 512.178l-0.032 0.046 14.426 21.592 93.378-139.756h-186.692l78.92 118.118zM305.96 799.156c-15.498 24.91-26.234 52.318-31.856 80.906h476.052c-6.138-31.304-18.384-61.122-36.354-87.918-0.118-0.168-0.23-0.344-0.342-0.512l-0.024-0.040c-0.036-0.050-0.15-0.23-0.186-0.282l-140.242-209.902-28.98 43.374c-7.166 10.72-19.21 17.162-32.11 17.162-12.896 0-24.942-6.442-32.11-17.166l-28.76-43.044-143.938 215.428c-0.36 0.674-0.744 1.338-1.15 1.994z',
+  play:
+    'M878.78 477.856l-591.884-341.722c-9.464-5.464-18.426-8.050-26.386-8.048-19.516 0.002-33.002 15.546-33.002 42.338v683.446c0 26.792 13.482 42.338 33.002 42.338 7.96 0 16.924-2.586 26.386-8.048l591.884-341.722c32.664-18.864 32.664-49.724 0-68.582z',
+  stop:
+    'M960 512a448 448 0 1 0-896 0 448 448 0 0 0 896 0zM252 772a366 366 0 0 1 0-520 366 366 0 0 1 520 0 366 366 0 0 1 0 520 366 366 0 0 1-520 0zm412-68H360c-22 0-40-18-40-40V360c0-22 18-40 40-40h304c22 0 40 18 40 40v304c0 22-18 40-40 40z',
+  email:
+    'M960.032 268.004c0.748-10.040-2.246-20.364-9.226-28.684-5.984-7.132-13.938-11.62-22.394-13.394-0.13-0.026-0.268-0.066-0.396-0.092-1.082-0.22-2.172-0.376-3.272-0.5-0.25-0.032-0.492-0.080-0.742-0.102-1.028-0.096-2.052-0.136-3.090-0.156-0.292-0.002-0.582-0.042-0.876-0.042h-816.008c-21.416 0-38.848 16.844-39.898 38-0.034 0.628-0.092 1.256-0.096 1.89 0 0.034-0.006 0.074-0.006 0.114 0 0.050 0.008 0.102 0.008 0.152v495.692c0 0.054-0.008 0.106-0.008 0.156 0 22.090 17.91 40 40 40h816.004c13.808 0 25.98-6.996 33.17-17.636 0.1-0.148 0.182-0.312 0.28-0.458 0.606-0.93 1.196-1.868 1.722-2.84 0.046-0.082 0.080-0.172 0.124-0.258 2.992-5.604 4.704-12.008 4.704-18.804v0 0-493.038zM144.032 350.156l339.946 281.188c6.568 6.434 14.918 10.168 23.564 11.122 0.16 0.024 0.32 0.050 0.48 0.066 0.838 0.082 1.676 0.114 2.518 0.14 0.496 0.020 0.994 0.058 1.492 0.058s0.996-0.042 1.492-0.058c0.842-0.028 1.68-0.058 2.518-0.14 0.16-0.016 0.32-0.042 0.48-0.066 8.646-0.958 16.996-4.688 23.564-11.122l339.946-281.206v370.894h-736v-370.876zM215.066 305.030h593.91l-296.946 245.422-296.964-245.422z',
+  comment:
+    'M288 378.668h448c22.094 0 40 17.906 40 40 0 22.090-17.906 40-40 40h-448c-22.090 0-40-17.91-40-40s17.91-40 40-40zM736 565.334h-448c-22.090 0-40 17.91-40 40 0 22.094 17.91 40 40 40h448c22.094 0 40-17.906 40-40 0-22.090-17.906-40-40-40zM960 232.004v560c0 6.804-1.714 13.196-4.704 18.812-0.042 0.082-0.078 0.172-0.124 0.254-0.524 0.976-1.11 1.914-1.722 2.836-0.098 0.152-0.18 0.314-0.282 0.458-7.188 10.64-19.36 17.636-33.168 17.636h-519.766l-114.292 114.286c-8.036 8.046-18.644 11.91-29.18 11.67-0.292 0.008-0.582 0.046-0.876 0.046-22.090 0-40-17.91-40-40v-86.004h-111.886c-22.090 0-40-17.906-40-40v0-560c0-20.34 15.192-37.094 34.84-39.632 1.692-0.214 3.406-0.368 5.16-0.368h816c1.754 0 3.468 0.154 5.164 0.368 19.644 2.542 34.836 19.296 34.836 39.638zM880 272h-736v480h736v-480z',
+  requestchange:
+    'M925.164 193.396c-1.696-0.214-3.41-0.368-5.164-0.368h-816c-1.754 0-3.468 0.152-5.16 0.368-19.648 2.54-34.84 19.292-34.84 39.632v560c0 22.094 17.91 40 40 40h111.886v86.004c0 22.090 17.91 40 40 40 0.292 0 0.582-0.040 0.876-0.046 10.536 0.238 21.144-3.624 29.18-11.67l114.292-114.286h519.766c13.808 0 25.98-6.996 33.168-17.636 0.102-0.144 0.184-0.304 0.282-0.458 0.614-0.922 1.2-1.86 1.722-2.836 0.046-0.082 0.082-0.172 0.124-0.254 2.988-5.618 4.704-12.008 4.704-18.812v0-560c-0-20.346-15.192-37.098-34.836-39.638zM880 753.028h-736v-480h736v480zM756.334 484.17l-125-125.436c-15.594-15.65-40.92-15.692-56.568-0.1-15.648 15.594-15.694 40.92-0.1 56.568l57.004 57.204h-335.67c-22.092 0-40 17.908-40 40s17.908 40 40 40h335.258l-56.508 56.368c-15.64 15.602-15.672 40.928-0.070 56.57 7.814 7.832 18.066 11.752 28.32 11.75 10.22 0 20.442-3.892 28.25-11.68l125-124.688c15.634-15.596 15.672-40.912 0.084-56.556z',
+  link:
+    'M743.52 529.234c5.616-5.616 83.048-83.046 88.462-88.46 30.944-32.778 47.97-75.636 47.97-120.792 0-47.048-18.304-91.26-51.542-124.484-33.228-33.22-77.43-51.516-124.458-51.516-45.024 0-87.792 16.94-120.536 47.72l-104.458 104.456c-30.792 32.738-47.734 75.512-47.734 120.548 0 41.916 14.576 81.544 41.248 113.196 3.264 3.876 6.666 7.664 10.292 11.29 4.258 4.258 8.704 8.262 13.304 12.022 0.054 0.080 0.096 0.152 0.148 0.232 9.572 7.308 15.778 18.804 15.778 31.776 0 22.094-17.914 40-40.004 40-8.542 0-16.442-2.696-22.938-7.26-2.746-1.93-20.622-17.43-30.35-28.050-0.008-0.010-0.018-0.018-0.026-0.028-4.992-5.432-13.234-15.23-18.552-22.65s-16.556-25.872-17.036-26.736c-0.7-1.262-2.974-5.526-3.422-6.39-0.69-1.334-6.118-12.67-6.114-12.67-14.342-31.96-22.332-67.4-22.332-104.728 0-60.826 21.198-116.648 56.58-160.544 0.252-0.314 4.61-5.594 6.594-7.866 0.304-0.35 5.038-5.636 7.16-7.874 0.252-0.268 105.86-105.874 106.128-106.126 45.902-43.584 107.958-70.314 176.264-70.314 141.382 0 255.998 114.5 255.998 256 0 68.516-26.882 130.688-70.652 176.61-0.144 0.148-109.854 109.546-112.090 111.528-0.958 0.848-5.072 4.352-5.072 4.352-6.448 5.434-13.132 10.592-20.1 15.378 0.412-6.836 0.644-13.702 0.644-20.6 0-26.46-3.108-52.206-8.918-76.918l-0.236-1.102zM616.144 767.82c35.382-43.896 56.58-99.718 56.58-160.544 0-37.328-7.99-72.768-22.332-104.728 0.004 0 0.006-0.002 0.010-0.004-0.258-0.576-0.538-1.14-0.8-1.714-0.686-1.498-2.894-6.112-3.296-6.93-0.668-1.344-2.952-5.732-3.386-6.604-3.48-6.982-8.708-15.126-9.49-16.366-0.498-0.792-0.996-1.58-1.502-2.364-0.834-1.29-15.364-22.066-26.656-34.466-0.008-0.010-0.018-0.018-0.026-0.028-7.056-8.448-24.932-24.198-30.35-28.050-6.47-4.602-14.396-7.26-22.938-7.26-22.090 0-40.004 17.906-40.004 40 0 12.97 6.206 24.466 15.778 31.776 0.052 0.080 0.094 0.152 0.148 0.232 4.602 3.76 20.334 19.434 23.598 23.31 26.672 31.65 41.248 71.28 41.248 113.196 0 45.038-16.944 87.81-47.734 120.548l-104.458 104.456c-32.742 30.782-75.512 47.72-120.536 47.72-47.028 0-91.228-18.294-124.458-51.516-33.236-33.224-51.542-77.436-51.542-124.484 0-45.154 17.028-88.014 47.97-120.792 5.414-5.414 40.812-40.812 68.958-68.958 7.176-7.176 13.888-13.886 19.504-19.502v-0.002c-0.356-1.562-0.246-1.096-0.246-1.096-5.81-24.712-8.918-50.458-8.918-76.918 0-6.898 0.232-13.764 0.644-20.6-6.966 4.788-20.1 15.33-20.1 15.33-0.734 0.62-9.518 8.388-11.68 10.45-0.16 0.154-105.338 105.33-105.482 105.478-43.77 45.922-70.652 108.094-70.652 176.61 0 141.5 114.616 256 255.998 256 68.306 0 130.362-26.73 176.264-70.314 0.27-0.254 105.876-105.86 106.128-106.126 0.004-0.002 13.506-15.426 13.758-15.74z',
+  paperclip:
+    'M824.25 369.354c68.146-70.452 67.478-182.784-2.094-252.354-70.296-70.296-184.266-70.296-254.558 0-0.014 0.012-0.028 0.026-0.042 0.042-0.004 0.002-0.006 0.004-0.010 0.008l-433.144 433.142c-0.036 0.036-0.074 0.068-0.11 0.106-0.054 0.052-0.106 0.11-0.16 0.162l-2.668 2.67c-0.286 0.286-0.528 0.596-0.8 0.888-43.028 44.88-66.664 103.616-66.664 165.986 0 64.106 24.962 124.376 70.292 169.704 45.328 45.33 105.598 70.292 169.706 70.292 50.612 0 98.822-15.57 139.186-44.428 4.932-1.952 9.556-4.906 13.544-8.894l16.802-16.802c0.056-0.056 0.116-0.112 0.172-0.168 0.038-0.038 0.074-0.076 0.112-0.116l289.010-289.014c15.622-15.618 15.62-40.942 0-56.56s-40.948-15.62-56.566 0l-289.124 289.122c-62.482 62.484-163.792 62.484-226.274 0-62.484-62.482-62.484-163.79 0-226.272h-0.002l433.134-433.12c0.058-0.060 0.112-0.122 0.172-0.18 38.99-38.99 102.43-38.99 141.42 0 38.992 38.99 38.99 102.432 0 141.422-0.058 0.060-0.122 0.114-0.18 0.17l0.006 0.006-280.536 280.534c-0.002-0.002-0.002-0.004-0.004-0.006l-79.978 79.98c-0.010 0.010-0.016 0.020-0.028 0.028-0.008 0.012-0.018 0.018-0.028 0.028l-0.064 0.062c-15.622 15.624-40.944 15.624-56.562 0-15.624-15.62-15.624-40.944-0.002-56.566l0.062-0.062c0.010-0.010 0.018-0.020 0.028-0.028 0.008-0.012 0.020-0.018 0.028-0.028l79.98-79.978c-0.002-0.002-0.004-0.002-0.006-0.004l136.508-136.512c15.622-15.62 15.62-40.944-0.002-56.562-15.618-15.62-40.946-15.62-56.564 0l-219.342 219.344c-1.284 1.284-2.42 2.652-3.494 4.052-40.4 47.148-38.316 118.184 6.322 162.824 44.64 44.638 115.674 46.722 162.82 6.324 1.402-1.072 2.772-2.21 4.054-3.494l2.83-2.832c0.002 0 0.002 0 0.002 0s0 0 0 0l360.54-360.54c0.058-0.056 0.12-0.114 0.18-0.172 0.050-0.050 0.098-0.106 0.15-0.158l0.994-0.994c0.34-0.338 0.63-0.702 0.952-1.052z',
+  box:
+    'M960.016 408.080c0-0.672-0.046-1.342-0.078-2.014-0.032-0.594-0.044-1.19-0.102-1.782-0.068-0.726-0.186-1.448-0.294-2.17-0.080-0.54-0.144-1.080-0.248-1.616-0.138-0.724-0.326-1.442-0.506-2.16-0.134-0.534-0.252-1.070-0.408-1.6-0.196-0.662-0.436-1.314-0.668-1.968-0.204-0.582-0.396-1.166-0.628-1.74-0.226-0.56-0.494-1.11-0.75-1.662-0.3-0.656-0.598-1.312-0.934-1.954-0.242-0.454-0.514-0.894-0.774-1.342-0.414-0.716-0.83-1.43-1.292-2.124-0.256-0.382-0.538-0.752-0.806-1.128-0.514-0.716-1.036-1.428-1.602-2.116-0.090-0.11-0.162-0.226-0.254-0.336-0.244-0.292-0.516-0.542-0.768-0.826-0.534-0.6-1.068-1.198-1.644-1.772-0.48-0.478-0.982-0.924-1.48-1.376-0.354-0.316-0.674-0.658-1.040-0.964l-405.788-335.666c-6.568-6.436-14.918-10.166-23.564-11.124-0.16-0.022-0.32-0.050-0.48-0.066-0.838-0.082-1.676-0.11-2.518-0.14-0.496-0.020-0.994-0.058-1.492-0.058s-0.996 0.040-1.492 0.058c-0.842 0.028-1.68 0.058-2.518 0.14-0.16 0.016-0.32 0.044-0.48 0.066-8.646 0.956-16.996 4.688-23.564 11.124l-405.662 335.542c-7.13 5.982-11.616 13.93-13.392 22.382-0.032 0.14-0.070 0.278-0.1 0.42-0.212 1.072-0.37 2.152-0.494 3.238-0.032 0.258-0.078 0.51-0.106 0.77-0.086 0.89-0.114 1.786-0.138 2.68-0.014 0.39-0.052 0.78-0.054 1.17 0 0.040-0.006 0.074-0.006 0.114v204.856c-0.958 12.434 3.854 25.128 14.134 33.754l405.662 335.54c6.568 6.438 14.918 10.168 23.564 11.124 0.16 0.020 0.32 0.050 0.48 0.066 0.838 0.082 1.676 0.114 2.518 0.14 0.496 0.020 0.994 0.058 1.492 0.058 0.054 0 0.11-0.008 0.162-0.008 0.042 0 0.084 0.008 0.126 0.008 0.342 0 0.672-0.042 1.012-0.050 0.062-0.004 0.126-0.008 0.192-0.008 0.134-0.004 0.27-0.020 0.402-0.024 10.602-0.422 20.136-4.938 27.054-12.046l404.526-334.624c0.084-0.066 0.166-0.136 0.248-0.204l0.12-0.098c0.17-0.144 0.314-0.304 0.48-0.45 0.814-0.704 1.614-1.43 2.37-2.2 0.296-0.3 0.562-0.624 0.85-0.934 0.602-0.652 1.2-1.308 1.756-2 0.3-0.372 0.566-0.758 0.852-1.136 0.504-0.672 1.002-1.344 1.462-2.046 0.242-0.368 0.458-0.75 0.686-1.124 0.458-0.754 0.908-1.508 1.316-2.292 0.164-0.312 0.304-0.636 0.46-0.954 0.426-0.872 0.832-1.746 1.196-2.652 0.092-0.23 0.168-0.464 0.256-0.696 0.376-0.996 0.728-2 1.026-3.032 0.042-0.148 0.074-0.296 0.114-0.442 0.306-1.102 0.578-2.218 0.79-3.356 0.016-0.082 0.024-0.164 0.038-0.246 0.212-1.184 0.382-2.378 0.49-3.598v0c0.1-1.156 0.176-2.32 0.176-3.5v-204.86c0.024-0.318 0.022-0.638 0.040-0.958 0.026-0.668 0.074-1.338 0.074-2.008zM143.89 493.202l328.14 271.42v103.902l-328.14-271.18v-104.142zM552.032 764.402l327.868-271.212v103.88l-327.868 270.972v-103.64zM511.898 122.66l345.348 285.42-345.348 285.42-345.374-285.42 345.374-285.42z',
+  structure:
+    'M954.324 833.3c0.208-0.558 0.388-1.128 0.586-1.692 0.3-0.868 0.608-1.734 0.882-2.61 0.234-0.746 0.444-1.5 0.66-2.25 0.212-0.734 0.432-1.464 0.624-2.204 0.204-0.766 0.378-1.54 0.562-2.308 0.18-0.766 0.366-1.528 0.528-2.292 0.146-0.692 0.272-1.386 0.402-2.082 0.168-0.89 0.332-1.778 0.476-2.668 0.090-0.566 0.164-1.136 0.244-1.704 0.148-1.058 0.29-2.118 0.404-3.18 0.042-0.422 0.080-0.852 0.12-1.274 0.118-1.23 0.212-2.46 0.282-3.696 0.018-0.304 0.030-0.606 0.042-0.906 0.062-1.36 0.098-2.718 0.104-4.082 0-0.114 0.008-0.226 0.008-0.34 0-0.128-0.010-0.258-0.010-0.39-0.006-1.368-0.042-2.734-0.104-4.102-0.014-0.296-0.030-0.594-0.044-0.89-0.070-1.246-0.166-2.492-0.284-3.738-0.042-0.434-0.084-0.864-0.128-1.292-0.116-1.050-0.25-2.098-0.4-3.144-0.088-0.628-0.18-1.258-0.282-1.882-0.13-0.8-0.276-1.598-0.428-2.394-0.162-0.868-0.332-1.73-0.518-2.594-0.116-0.524-0.24-1.046-0.364-1.57-0.264-1.128-0.542-2.25-0.846-3.36-0.070-0.254-0.144-0.504-0.214-0.754-11.38-40.382-48.464-69.996-92.488-69.996-3.066 0-6.096 0.16-9.088 0.442l-264.576-458.262c21.080-29.698 24.3-70.13 4.9-103.732-12.596-21.816-32.458-36.812-54.764-43.724-0.062-0.020-0.124-0.036-0.186-0.054-1.394-0.43-2.798-0.83-4.21-1.196-0.296-0.076-0.596-0.142-0.894-0.216-1.208-0.3-2.422-0.586-3.642-0.84-0.384-0.082-0.774-0.148-1.16-0.224-1.168-0.228-2.338-0.444-3.514-0.626-0.384-0.060-0.776-0.112-1.162-0.168-1.208-0.174-2.416-0.332-3.63-0.46-0.35-0.038-0.7-0.066-1.048-0.1-1.27-0.12-2.54-0.218-3.814-0.29-0.32-0.018-0.642-0.032-0.964-0.044-1.294-0.058-2.594-0.094-3.892-0.1-0.166 0-0.328-0.012-0.492-0.012-0.19 0-0.376 0.014-0.564 0.014-1.21 0.008-2.42 0.040-3.63 0.092-0.494 0.022-0.986 0.046-1.478 0.074-0.992 0.060-1.986 0.136-2.978 0.226-0.722 0.064-1.442 0.134-2.16 0.214-0.696 0.080-1.392 0.17-2.090 0.266-1.014 0.136-2.026 0.286-3.032 0.452-0.352 0.060-0.704 0.124-1.054 0.19-44.97 8.028-79.122 47.302-79.122 94.582 0 20.756 6.602 39.958 17.79 55.67l-264.58 458.26c-2.954-0.274-5.94-0.434-8.962-0.434-53.078 0-96.11 43.032-96.11 96.11 0 53.082 43.032 96.11 96.11 96.11 38.8 0 72.208-23.004 87.386-56.11l529.202-0.004c0.138 0.304 0.292 0.606 0.436 0.91 0.226 0.48 0.456 0.958 0.69 1.434 0.474 0.968 0.966 1.93 1.476 2.882 0.214 0.402 0.432 0.8 0.65 1.2 0.314 0.566 0.604 1.14 0.93 1.708 0.284 0.488 0.59 0.958 0.88 1.442 0.122 0.2 0.244 0.398 0.37 0.602 27.086 44.372 84.766 59.278 130.040 33.136 18.864-10.89 32.624-27.214 40.478-45.852 0.054-0.132 0.104-0.266 0.158-0.398 0.518-1.248 1.020-2.506 1.486-3.776zM238.414 744.282l264.542-458.204c0.424 0.042 0.85 0.064 1.276 0.098 0.668 0.056 1.334 0.112 2.004 0.152 0.652 0.040 1.306 0.066 1.96 0.092 1.122 0.046 2.244 0.076 3.368 0.084 0.146 0.002 0.292 0.012 0.438 0.012 0.168 0 0.334-0.012 0.502-0.014 1.436-0.004 2.874-0.040 4.31-0.108 0.088-0.006 0.176-0.010 0.262-0.014 1.376-0.070 2.75-0.168 4.124-0.296l264.596 458.298c-3.48 4.894-6.514 10.122-9.042 15.636h-529.226c-2.546-5.55-5.602-10.814-9.114-15.736z',
+  cpu:
+    'M392.016 672.016h240.032c22.092 0 40-17.908 40-40v-240.032c0-22.092-17.908-40-40-40h-240.032c-22.092 0-40 17.908-40 40v240.032c0 22.092 17.908 40 40 40zM432.016 431.984h160.032v160.032h-160.032v-160.032zM864.032 424h71.98c22.094 0 40.004-17.906 40.004-40 0-22.092-17.906-40-40-40h-71.984v-143.968c0-22.092-17.908-40-40-40h-144v-72.012c0-22.094-17.906-40.004-40-40.004-22.090 0-40 17.906-40 40v72.016h-176v-72.012c0-22.094-17.906-40.004-40-40.004-22.090 0-40 17.906-40 40v72.016h-144c-22.092 0-40 17.908-40 40v143.968h-71.984c-22.094 0-40 17.908-40 40s17.91 40 40 40h71.984v176h-71.984c-22.094 0-40 17.908-40 40s17.91 40 40 40h71.984v144.030c0 22.092 17.908 40 40 40h144v71.954c0 22.094 17.906 40 40 40s40-17.91 40-40v-71.954h176v71.954c0 22.094 17.906 40 40 40s40-17.91 40-40v-71.954h144c22.092 0 40-17.908 40-40v-144.030h71.98c22.094 0 40.004-17.906 40.004-40 0-22.092-17.906-40-40-40h-71.984v-176zM784.032 784.032h-143.692c-0.104 0-0.204-0.016-0.308-0.016s-0.206 0.016-0.308 0.016h-127.382c-0.104 0-0.204-0.016-0.308-0.016s-0.206 0.016-0.308 0.016h-127.382c-0.104 0-0.204-0.016-0.308-0.016s-0.206 0.016-0.308 0.016h-143.696v-544h544v544z',
+  memory:
+    'M320.032 416.032v-152.968c0-22.094 17.91-40 40-40 22.094 0 40 17.91 40 40.004v152.964c0 22.090-17.906 40-40 40s-40-17.908-40-40zM512 456.032c22.094 0 40-17.91 40-40v-152.964c0-22.094-17.906-40.004-40-40.004-22.090 0-40 17.906-40 40v152.968c0 22.092 17.908 40 40 40zM664.032 456.032c22.094 0 40-17.91 40-40v-82.996c0-22.094-17.906-40.004-40-40.004-22.090 0-40 17.906-40 40v83c0 22.092 17.906 40 40 40zM864.018 316.616v603.418c0 0.004 0 0.004 0 0.004 0 6.798-1.71 13.198-4.704 18.808-0.044 0.084-0.078 0.172-0.124 0.254-0.524 0.976-1.112 1.914-1.722 2.836-0.098 0.15-0.18 0.312-0.282 0.46-7.188 10.638-19.36 17.634-33.168 17.634h-623.99c-22.090 0-40-17.908-40-40v-343.574c-0.002-0.142-0.022-0.282-0.022-0.426 0-0.142 0.020-0.282 0.022-0.426v-471.574c0-20.34 15.192-37.092 34.838-39.63 1.694-0.216 3.408-0.37 5.162-0.37l411.254 0.052c10.594-0.286 21.282 3.58 29.368 11.668l211.672 212.206c7.906 7.908 11.792 18.298 11.696 28.66zM240.026 144.034v391.998h543.99v-203.27l-188.252-188.728h-355.738zM784.016 880.032v-264h-543.99v264h543.99z',
+  database:
+    'M895.95 221.364c-3.414-87.32-173.972-157.672-383.918-157.672s-380.504 70.352-383.918 157.672h-0.082v578.328c0 88.552 171.918 160.338 384 160.338s384-71.786 384-160.338v-578.328h-0.082zM798.412 430.578c-15.6 11.386-37.69 22.346-63.882 31.696-60.984 21.77-140.002 33.758-222.498 33.758s-161.514-11.988-222.498-33.758c-26.192-9.348-48.282-20.308-63.88-31.696-8.706-6.352-13.646-11.608-16.122-14.874v-92.9c70.29 37.478 179.654 61.566 302.5 61.566s232.21-24.088 302.5-61.566v92.9c-2.476 3.266-7.416 8.522-16.12 14.874zM814.532 514.464v93.24c-2.474 3.266-7.416 8.522-16.12 14.874-15.6 11.386-37.69 22.346-63.882 31.696-60.984 21.77-140.002 33.758-222.498 33.758s-161.514-11.988-222.498-33.758c-26.192-9.348-48.282-20.308-63.88-31.696-8.706-6.352-13.646-11.608-16.122-14.874v-93.24c70.29 37.48 179.654 61.566 302.5 61.566s232.21-24.086 302.5-61.566zM225.652 209.146c15.6-11.386 37.69-22.346 63.88-31.696 60.984-21.77 140.002-33.758 222.498-33.758s161.514 11.988 222.498 33.758c26.192 9.348 48.282 20.308 63.882 31.696 8.704 6.352 13.646 11.608 16.12 14.874v0.026c-2.474 3.266-7.416 8.522-16.12 14.874-15.6 11.386-37.69 22.346-63.882 31.696-60.984 21.77-140.002 33.758-222.498 33.758s-161.514-11.988-222.498-33.758c-26.192-9.348-48.282-20.308-63.88-31.696-8.706-6.352-13.646-11.608-16.122-14.874v-0.026c2.476-3.268 7.418-8.524 16.122-14.874zM798.412 814.578c-15.6 11.386-37.69 22.346-63.882 31.696-60.984 21.77-140.002 33.758-222.498 33.758s-161.514-11.988-222.498-33.758c-26.192-9.348-48.282-20.308-63.88-31.696-8.714-6.36-13.66-11.62-16.13-14.886h0.010v-93.228c70.29 37.48 179.654 61.566 302.5 61.566s232.21-24.086 302.5-61.566v93.228h0.010c-2.474 3.266-7.42 8.526-16.132 14.886z',
+  power:
+    'M472 473.188v-368c-0.004-22.092 17.906-40.002 40-40 22.090 0 40 17.906 40 40l-0.004 368.002c0.004 22.088-17.906 39.996-39.996 39.998-22.094 0.002-40.004-17.906-40-40zM746.804 201.726v0.188c-13.138-9.004-26.808-17.292-40.978-24.768-1.994-1.050-3.492-1.84-4.668-2.458-1.75-0.892-3.518-1.756-5.28-2.624-0.004-0.002-0.008-0.004-0.012-0.006-0.080-0.032-0.158-0.074-0.234-0.108-0.032-0.012-0.056-0.024-0.090-0.042l-0.006 0.008c-4.724-2.022-9.924-3.168-15.386-3.212-22.090-0.178-40.14 17.588-40.32 39.678-0.122 15.112 8.166 28.298 20.47 35.208 31.9 15.71 61.418 36.616 87.492 62.292 2.796 2.754 5.52 5.562 8.208 8.394v-0.146c59.436 62.664 92.062 144.352 92.062 231.056 0 89.748-34.95 174.124-98.412 237.588s-147.84 98.412-237.588 98.412-174.124-34.95-237.588-98.412-98.412-147.84-98.412-237.588c0-81.652 28.962-158.834 81.972-219.886 5.814-6.69 11.902-13.192 18.288-19.474 26.064-25.652 55.564-46.538 87.446-62.238 12.342-6.892 20.66-20.106 20.542-35.238-0.17-22.088-18.218-39.86-40.306-39.69-5.468 0.044-10.664 1.186-15.392 3.208l-0.004-0.008c-0.036 0.016-0.058 0.028-0.088 0.042-0.042 0.018-0.084 0.038-0.126 0.056-1.862 0.918-3.728 1.828-5.574 2.774-0.458 0.238-0.948 0.496-1.512 0.792-1.096 0.566-2.18 1.148-3.27 1.722-15.704 8.294-30.804 17.572-45.232 27.736v-0.124c-106.896 75.288-176.742 199.646-176.742 340.33 0 229.75 186.25 416 416 416s416-186.25 416-416c-0.002-142.654-71.82-268.52-181.26-343.462z',
+  outbox:
+    'M960.062 616v304c0 1.382-0.070 2.746-0.208 4.090-2.046 20.172-19.080 35.91-39.792 35.91h-816c-22.090 0-40-17.906-40-40v-304c0-22.090 17.91-40 40-40s40 17.91 40 40v264h736v-264c0-22.090 17.91-40 40-40s40 17.912 40 40zM664.732 200.168l-124.41-124.41c-0.014-0.014-0.024-0.028-0.038-0.042-3.57-3.57-7.664-6.284-12.018-8.222-5.316-2.368-11.028-3.54-16.742-3.47-0.14-0.002-0.276-0.020-0.414-0.020-13.552 0-25.512 6.756-32.748 17.072l-119.1 119.092c-15.622 15.62-15.618 40.948 0.002 56.57 15.622 15.62 40.95 15.62 56.568 0l55.276-55.276v462.54c0 22.094 17.912 40 40.002 40 22.092 0 40-17.91 40-40v-464.314l57.052 57.052c15.622 15.624 40.948 15.62 56.568 0 15.628-15.624 15.628-40.952 0.002-56.572z',
+  share:
+    'M896.006 920c0 22.090-17.91 40-40 40h-688.006c-22.090 0-40-17.906-40-40v-549.922c-0.838-3.224-1.33-6.588-1.33-10.072 0-22.090 17.908-40.004 40-40.004h178.66c22.092 0.004 40 17.914 40 40.004 0 22.088-17.908 40-40 40h-137.33v479.996h607.998v-479.996h-138.658c-22.090 0-40-17.912-40-40 0-22.090 17.906-40.004 40-40.004h178.658c22.090 0 40 17.91 40 40v559.844c0 0.050 0.008 0.102 0.008 0.154zM665.622 200.168l-124.452-124.45c-8.042-8.042-18.65-11.912-29.186-11.674-1.612-0.034-3.222 0-4.828 0.16-0.558 0.054-1.098 0.16-1.648 0.238-0.742 0.104-1.484 0.192-2.218 0.338-0.656 0.13-1.29 0.31-1.934 0.472-0.622 0.154-1.244 0.292-1.86 0.476-0.64 0.196-1.258 0.436-1.886 0.66-0.602 0.216-1.208 0.414-1.802 0.66-0.598 0.248-1.17 0.54-1.754 0.814-0.598 0.282-1.202 0.546-1.788 0.86-0.578 0.312-1.13 0.664-1.694 1-0.552 0.332-1.116 0.644-1.654 1.006-0.67 0.448-1.3 0.942-1.942 1.426-0.394 0.302-0.806 0.576-1.196 0.894-1.046 0.858-2.052 1.768-3.008 2.726l-124.398 124.39c-15.622 15.62-15.618 40.948 0.002 56.57 15.622 15.62 40.95 15.62 56.568 0l56.164-56.166v439.426c0 22.094 17.912 40 40.002 40 22.092 0 40-17.91 40-40v-441.202l57.942 57.942c15.622 15.624 40.948 15.62 56.568 0 15.626-15.618 15.626-40.946 0.002-56.566z',
+  button:
+    'M644.634 802.32c-4.558 5.434-10.254 9.328-16.446 11.672l0.008 0.024-45.628 16.606 27.54 75.66c7.554 20.756-3.148 43.71-23.906 51.266s-43.714-3.146-51.27-23.906l-27.54-75.656-47.63 17.29c-6.020 1.956-12.586 2.518-19.254 1.342-21.75-3.836-36.282-24.582-32.45-46.34l30.57-173.328c2.55-14.476 12.61-25.714 25.458-30.508 0.292-0.118 0.586-0.23 0.878-0.34 0.238-0.084 0.476-0.168 0.718-0.246 12.942-4.624 27.91-2.492 39.196 6.98l134.824 113.13c16.932 14.2 19.144 39.432 4.932 56.354zM960.002 664v-368.082c0-22.092-17.908-40-40-40h-816c-22.092 0-40 17.908-40 40l-0.292 368.238c0 22.092 17.908 40 40 40h240.292c22.092 0 40-17.908 40-40s-17.908-40-40-40h-200.292l0.292-288.238h736v288.082h-200c-22.092 0-40 17.908-40 40s17.908 40 40 40h240c22.092 0 40-17.908 40-40z',
+  form:
+    'M948.362 178.828l-471.082 470.086c-0.24 0.25-0.45 0.52-0.698 0.77-7.82 7.82-18.070 11.722-28.32 11.712-10.25 0.010-20.504-3.892-28.324-11.712-0.262-0.262-0.48-0.546-0.734-0.812l-221.736-221.738c-15.624-15.622-15.624-40.95 0-56.566 15.618-15.622 40.946-15.624 56.57 0l194.224 194.222 443.53-442.528c15.622-15.618 40.95-15.618 56.57 0 15.62 15.62 15.62 40.946 0 56.566zM98.372 128.448c-18.926 0-34.266 15.342-34.266 34.268v699.032c0 18.926 15.34 34.266 34.266 34.266h699.032c18.926 0 34.266-15.34 34.266-34.266v-430.588c0 0 0.002-1.184 0.002-1.788 0-22.090-17.914-40-40.004-40s-40 17.91-40 40c0 0.288 0.002 386.64 0.002 386.64h-607.562v-607.564h600.002c22.090-0.002 40.002-17.906 40.002-40 0-22.090-17.914-40-40.004-40z',
+  check:
+    'M948.598 199.75c-15.622-15.618-40.95-15.618-56.57 0l-535.644 535.644-224.060-224.062c-15.624-15.624-40.954-15.62-56.57 0-15.624 15.62-15.624 40.948 0 56.568l251.574 251.574c0.252 0.266 0.472 0.55 0.734 0.812 7.82 7.82 18.072 11.724 28.322 11.714 10.25 0.010 20.502-3.894 28.322-11.714 0.248-0.248 0.456-0.518 0.698-0.77l563.196-563.202c15.618-15.618 15.618-40.94-0.002-56.564z',
+  batchaccept:
+    'M684 277L271 772l-1 1a40 40 0 0 1-56 5l-1-1L14 610a40 40 0 1 1 52-61l169 142 387-465a40 40 0 0 1 62 51zm340 234c0-22-18-40-40-40H808a40 40 0 0 0 0 80h176c22 0 40-18 40-40zm0-216c0-22-18-40-40-40H808a40 40 0 0 0 0 80h176c22 0 40-18 40-40zm0 432c0-22-18-40-40-40H808a40 40 0 0 0 0 80h176c22 0 40-18 40-40z',
+  batchdeny:
+    'M1024 512c0-22-18-40-40-40H808a40 40 0 0 0 0 80h176c22 0 40-18 40-40zm0-216c0-22-18-40-40-40H808a40 40 0 0 0 0 80h176c22 0 40-18 40-40zm0 432c0-22-18-40-40-40H808a40 40 0 0 0 0 80h176c22 0 40-18 40-40zM625 236c16 15 16 41 0 56L406 512l220 220a40 40 0 1 1-57 57L349 568 129 788a40 40 0 1 1-57-56l220-220L73 292a40 40 0 0 1 56-57l220 220 219-219c16-16 41-16 57 0z',
+  home:
+    'M948.12 483.624l-407.814-407.754c-7.812-7.808-18.046-11.712-28.282-11.712-10.238 0-20.472 3.904-28.282 11.712l-407.92 407.86c-15.624 15.622-15.624 40.948-0.006 56.57s40.944 15.622 56.568 0.004l19.616-19.612v366.708c0 22.090 17.91 40 40 40h190.696c0.416 0.014 0.82 0.062 1.238 0.062 11.054 0 21.060-4.484 28.3-11.734 7.266-7.244 11.766-17.262 11.766-28.332 0-0.418-0.050-0.822-0.062-1.238v-263.204h176.060v263.934c0 22.090 17.91 40 40 40l191.876 0.124c2.292 0 4.524-0.236 6.708-0.608 0.45-0.074 0.91-0.116 1.356-0.206 0.21-0.044 0.414-0.116 0.628-0.162 17.906-3.972 31.308-19.924 31.308-39.026v-366.492l19.682 19.68c15.622 15.62 40.948 15.616 56.568-0.006s15.618-40.948-0.004-56.568zM791.876 448.272v398.71l-111.874-0.074v-263.876c0-0.020-0.002-0.042-0.002-0.062 0-0.006 0-0.014 0-0.022 0-22.090-17.91-40-40-40h-254.002c-0.556 0-1.1 0.060-1.65 0.084-0.14-0.002-0.274-0.022-0.414-0.022-22.090 0-40 17.91-40 40v264.382h-111.934v-399.392c0-2.286-0.234-4.512-0.604-6.694l280.626-280.584 280.514 280.472c-0.412 2.302-0.66 4.658-0.66 7.078z',
+  admin:
+    'M919.596 847.534h-88.414v-467.716l88.75-0.044c13.688-0.132 26.958-7.25 34.294-19.96 11.044-19.13 4.49-43.596-14.642-54.64l-407.904-235.676c-0.44-0.254-0.894-0.45-1.34-0.684-0.542-0.29-1.084-0.578-1.638-0.84-0.696-0.328-1.4-0.62-2.108-0.904-0.478-0.194-0.954-0.388-1.44-0.56-0.78-0.282-1.564-0.524-2.352-0.754-0.442-0.126-0.878-0.256-1.324-0.37-0.808-0.206-1.618-0.376-2.43-0.528-0.468-0.088-0.934-0.174-1.404-0.246-0.768-0.116-1.534-0.204-2.302-0.274-0.554-0.052-1.108-0.096-1.664-0.124-0.672-0.034-1.34-0.044-2.012-0.044-0.67 0-1.338 0.012-2.010 0.044-0.556 0.030-1.11 0.072-1.664 0.124-0.77 0.070-1.536 0.158-2.302 0.274-0.468 0.072-0.938 0.158-1.402 0.246-0.814 0.152-1.624 0.322-2.432 0.528-0.444 0.114-0.882 0.242-1.322 0.37-0.79 0.23-1.574 0.472-2.356 0.754-0.484 0.172-0.958 0.368-1.438 0.56-0.708 0.286-1.41 0.576-2.11 0.904-0.554 0.262-1.094 0.55-1.636 0.84-0.446 0.234-0.9 0.43-1.34 0.684l-407.906 235.672c-19.128 11.044-25.686 35.51-14.64 54.64 7.34 12.71 20.606 19.828 34.292 19.96v0.044h89.842v467.716h-89.474c-22.090 0-40 17.91-40 40s17.91 40 40 40h128.276c0.402 0.012 0.794 0.060 1.2 0.060s0.796-0.048 1.2-0.060h183.602c0.402 0.012 0.794 0.060 1.2 0.060s0.796-0.048 1.2-0.060h183.602c0.402 0.012 0.794 0.060 1.2 0.060s0.796-0.048 1.2-0.060h313.154c22.098 0 40-17.91 40-40-0.006-22.090-17.914-39.996-40.006-39.996zM751.182 847.534h-105.94v-467.716h105.94v467.716zM252.93 299.816l258.736-149.486 258.738 149.486h-517.474zM565.242 379.816v467.716h-106v-467.716h106zM273.242 379.816h106v467.716h-106v-467.716z',
+  paragraph:
+    'M728.032 96.032h-116.98c-0.026 0-0.050-0.004-0.076-0.004s-0.050 0.004-0.076 0.004h-199.848c-0.026 0-0.050-0.004-0.076-0.004s-0.050 0.004-0.076 0.004h-31.924c-123.712 0-224 100.292-224 224 0 121.032 95.994 219.628 216 223.842v344.158c0 22.092 17.91 40 40 40 22.086 0 40-17.908 40-40v-712h120v712c0 22.092 17.91 40 40 40 22.086 0 40-17.908 40-40v-712h77.056c22.094 0 40-17.91 40-40 0-22.092-17.91-40-40-40z',
+
+  basket:
+    'M632.254 695.604v-112.016c-0.004-22.092 17.906-40.002 40-40.002 22.090 0.002 40 17.908 40 40.002l-0.004 112.018c0.004 22.088-17.906 39.996-39.996 39.998-22.094 0.002-40.004-17.904-40-40zM352.246 735.604c22.090-0.002 40-17.91 39.996-39.998l0.004-112.018c0-22.094-17.91-40-40-40.002-22.094 0-40.004 17.91-40 40.002v112.016c-0.004 22.096 17.906 40.002 40 40zM512.25 735.604c22.090-0.002 40-17.91 39.996-39.998l0.004-112.018c0-22.094-17.91-40-40-40.002-22.094 0-40.004 17.91-40 40.002v112.016c-0.004 22.096 17.906 40.002 40 40zM950.3 397.424c-7.596-8.686-18.574-13.67-30.114-13.67h-313.284c0.87 5.196 1.346 10.524 1.346 15.966 0 24.608-9.27 47.044-24.494 64.034h290.684l-47.318 351.376-629.908-0.030-47.502-351.346h291.034c-15.224-16.988-24.494-39.426-24.494-64.034 0-5.444 0.476-10.772 1.346-15.966h-313.66c-11.542 0-22.524 4.986-30.12 13.678-7.596 8.694-11.066 20.242-9.52 31.682l51.614 381.742 0.050 0.042c5.832 47.424 46.222 84.158 95.222 84.172l0.054 0.034 601.816-0.034c0.042 0 0.082 0.002 0.124 0.002 49.414 0 90.090-37.34 95.396-85.336l51.258-380.64c1.54-11.44-1.934-22.984-9.53-31.672zM805.492 105.34c-15.622-15.622-40.95-15.624-56.572 0.004l-230.684 230.684c-2.052-0.2-4.132-0.306-6.236-0.306-35.346 0-64 28.654-64 64s28.654 64 64 64 64-28.654 64-64c0-2.652-0.18-5.262-0.494-7.83l229.986-229.98c15.622-15.624 15.616-40.95-0-56.572z',
+  credit:
+    'M376.188 672.062h-112.124c-22.092 0-40-17.908-40-40s17.908-40 40-40h112.124c22.092 0 40 17.908 40 40s-17.908 40-40 40zM960 232.002v560c0 6.8-1.708 13.2-4.704 18.81-0.044 0.082-0.078 0.172-0.124 0.254-0.524 0.974-1.112 1.914-1.722 2.836-0.098 0.15-0.18 0.31-0.282 0.458-7.188 10.64-19.36 17.638-33.168 17.638h-816c-22.090 0-40-17.908-40-40v-559.998c0-20.34 15.192-37.092 34.838-39.628 1.694-0.218 3.408-0.372 5.162-0.372h816c1.754 0 3.468 0.152 5.162 0.372 19.646 2.536 34.838 19.288 34.838 39.63zM144 272.002v80.030h736v-80.030h-736zM880 751.998v-239.966h-736v239.966h736z',
+  shield:
+    'M875.146 148.994c-0.064-0.040-0.116-0.094-0.184-0.132-92.714-52.39-221.036-84.83-362.846-84.83-138.512 0-270.346 34.356-362.51 84.618-0.606 0.33-1.138 0.658-1.608 0.986-11.954 6.918-20.016 19.81-20.016 34.614v451.4c0 12.7 5.938 23.996 15.166 31.32l340.538 281.676c6.568 6.434 14.918 10.168 23.564 11.122 0.16 0.024 0.32 0.050 0.48 0.066 0.838 0.082 1.676 0.114 2.518 0.14 0.496 0.020 0.994 0.058 1.492 0.058s0.996-0.040 1.492-0.058c0.842-0.032 1.68-0.058 2.518-0.14 0.16-0.016 0.32-0.042 0.48-0.066 8.646-0.958 16.996-4.688 23.564-11.122l339.36-280.718c10.326-7.23 17.094-19.2 17.094-32.762v-450.918c0.002-15.254-8.54-28.506-21.102-35.254zM207.984 208.212c36.292-18.168 77.668-32.854 123.356-43.722 57.062-13.576 117.884-20.458 180.778-20.458s123.714 6.882 180.778 20.458c30.186 7.182 58.474 16.040 84.674 26.456l-490.846 490.848-78.738-65.070v-408.512zM511.742 867.75l-163.078-134.77 467.586-467.584v350.69l-304.508 251.664z',
+  beaker:
+    'M848.64 790.56l-208.638-361.374v-252.062h24c22.092 0 40-17.908 40-40s-17.908-40-40-40h-304.002c-22.092 0-40 17.908-40 40s17.908 40 40 40h24v252.066l-208.636 361.37c-44 76.208-8 138.564 80 138.564h513.278c87.998 0 123.998-62.354 79.998-138.564zM464 177.124h96.002l-0.070 273.376 63.872 110.628h-223.678c35.932-62.268 63.872-110.684 63.876-110.692v-273.312zM768.64 849.124h-513.278c-8.28 0-14.186-0.976-17.968-2 1.004-3.792 3.112-9.394 7.25-16.564 0 0 54.598-94.614 109.316-189.436l316.026-0.002 109.374 189.44c4.138 7.168 6.246 12.77 7.25 16.562-3.784 1.024-9.69 2-17.97 2z',
+  thumbsup:
+    'M256.972 768.004c0-8.67-3.156-16.158-9.484-22.534-6.332-6.34-13.836-9.484-22.504-9.458-8.682 0-16.188 3.172-22.516 9.458-6.33 6.344-9.488 13.84-9.488 22.534 0 8.692 3.158 16.186 9.488 22.532 6.328 6.286 13.834 9.458 22.516 9.458 8.668 0.028 16.172-3.118 22.504-9.458 6.328-6.376 9.484-13.868 9.484-22.532zM832.948 480.010c0-17.004-6.478-31.908-19.468-44.734-13.014-12.82-27.834-19.25-44.512-19.276h-175.97c0-19.328 7.98-45.904 24.004-79.724 15.968-33.826 23.978-60.568 23.978-80.256 0-32.646-5.332-56.808-15.994-72.48-10.664-15.664-31.988-23.484-63.98-23.484-8.696 8.64-15.012 22.828-19.032 42.486-4.020 19.69-9.102 40.606-15.254 62.752-6.168 22.172-16.080 40.382-29.762 54.738-7.344 7.68-20.168 22.832-38.5 45.496-1.326 1.67-5.164 6.65-11.512 15.010-6.342 8.342-11.594 15.178-15.762 20.508-4.156 5.308-9.91 12.386-17.252 21.218-7.328 8.862-14 16.186-19.988 22.038-5.986 5.794-12.412 11.73-19.26 17.744-6.852 5.984-13.508 10.5-19.99 13.48-6.478 3.010-12.4 4.484-17.756 4.512h-15.982v320.010h15.982c4.332 0 9.596 0.492 15.774 1.504 6.168 1.012 11.676 2.080 16.488 3.258 4.812 1.144 11.154 2.98 19.002 5.466 7.862 2.512 13.702 4.424 17.502 5.74 3.812 1.31 9.732 3.422 17.756 6.238 8.026 2.842 12.866 4.586 14.506 5.272 70.324 24.334 127.304 36.504 170.996 36.504h60.482c64.006 0 96.024-27.836 96.024-83.478 0-8.664-0.848-18.016-2.514-27.996 10.004-5.334 17.936-14.084 23.758-26.276 5.824-12.172 8.724-24.416 8.778-36.746 0-12.366-3.008-23.844-9.024-34.51 17.664-16.682 26.524-36.496 26.524-59.496 0-8.308-1.696-17.554-5.032-27.72-3.336-10.202-7.492-18.104-12.468-23.762 10.636-0.328 19.55-8.15 26.714-23.486 7.192-15.34 10.744-28.82 10.744-40.496v-0.054zM896.984 479.516c0 29.638-8.204 56.816-24.5 81.506 2.98 10.994 4.484 22.476 4.484 34.482 0 25.674-6.344 49.68-19.004 71.99 1.012 7 1.506 14.164 1.506 21.488 0 33.688-10.008 63.354-29.968 89.026 0.326 46.32-13.834 82.904-42.518 109.756-28.682 26.848-66.522 40.246-113.496 40.246h-64.528c-31.99 0-63.542-3.746-94.742-11.268-31.168-7.492-67.246-18.402-108.23-32.758-38.662-13.312-61.656-19.956-68.984-19.956h-143.996c-17.664 0-32.742-6.292-45.252-18.784-12.508-12.5-18.756-27.588-18.756-45.254v-319.982c0-17.666 6.248-32.728 18.756-45.226 12.51-12.52 27.588-18.784 45.252-18.784h136.998c12.002-8.010 34.818-33.822 68.478-77.484 19.33-24.99 37.168-46.344 53.508-64.008 7.996-8.314 13.918-22.586 17.744-42.766 3.828-20.178 8.912-41.232 15.256-63.24 6.36-21.984 16.68-40.002 30.994-53.998 13.002-12.362 28.012-18.514 45.018-18.514 27.998 0 53.152 5.414 75.464 16.242 22.31 10.828 39.316 27.748 50.964 50.77 11.704 23.002 17.5 53.978 17.5 92.962 0 31.008-7.984 63-23.98 96.028h88.014c34.67 0 64.634 12.628 89.956 37.98 25.346 25.346 38.008 55.144 38.008 89.49l0.054 0.056z',
+  mirror:
+    'M857 127.778h-688c-22.092 0-40 17.91-40 40v688c0 22.090 17.908 40 40 40h688c22.094 0 40-17.91 40-40v-688c0-22.092-17.906-40-40-40zM817 815.778h-608v-1.086l606.914-606.914h1.086v608z',
+  switchalt:
+    'M923.946 63.418h-631.232c-20.268 0-36.7 16.432-36.7 36.7v155.286h-155.284c-20.268 0-36.7 16.432-36.7 36.7v631.23c0 20.268 16.43 36.7 36.7 36.7h631.23c20.272 0 36.7-16.432 36.7-36.7v-155.286h155.286c20.272 0 36.7-16.432 36.7-36.7v-631.23c-0.002-20.268-16.43-36.7-36.7-36.7zM688.66 880.032h-544.628v-544.628h111.984v395.946c0 20.268 16.43 36.7 36.7 36.7h395.944v111.982zM688.66 688.046h-352.644v-352.644h352.644v352.644zM880.644 688.046h-111.984v-395.946c0-20.268-16.428-36.7-36.7-36.7h-395.944v-111.984h544.628v544.63z',
+  commit:
+    'M984.032 472h-186.808c-19.474-140.12-139.74-248-285.222-248s-265.748 107.88-285.222 248h-186.746c-22.092 0-40 17.912-40 40.002 0 22.092 17.91 40 40 40h186.746c19.476 140.122 139.74 247.998 285.222 247.998s265.746-107.876 285.222-247.998h186.808c22.092 0 40-17.91 40-40s-17.908-40.002-40-40.002zM512 720c-114.692 0-208-93.308-208-208s93.308-208 208-208 208 93.308 208 208-93.308 208-208 208z',
+  branch:
+    'M861.968 312.032c0-66.168-53.832-120-120-120s-120 53.832-120 120c0 50.55 31.436 93.87 75.77 111.516-5.384 20.352-15.71 39.68-29.844 54.92-28.828 31.092-72.202 46.858-128.91 46.858-77.162 0-129.12 26.162-162.984 55.12V297.15c46.556-16.512 80-60.974 80-113.12 0-66.168-53.832-120-120-120s-120 53.832-120 120c0 52.146 33.444 96.608 80 113.12v429.762c-46.556 16.512-80 60.974-80 113.12 0 66.168 53.832 120 120 120s120-53.832 120-120c0-50.926-31.902-94.514-76.758-111.908 5.222-26.17 16.578-51.154 32.558-70.432 28.8-34.746 71.592-52.364 127.184-52.364 99.498 0 156.922-39.408 187.574-72.466 27.402-29.554 45.708-67.194 52.48-106.716 48.078-15.66 82.93-60.882 82.93-114.114zM336 144.032c22.056 0 40 17.944 40 40s-17.944 40-40 40-40-17.944-40-40 17.944-40 40-40zm0 736c-22.056 0-40-17.944-40-40s17.944-40 40-40 40 17.944 40 40-17.944 40-40 40zm405.968-528c-22.056 0-40-17.944-40-40s17.944-40 40-40 40 17.944 40 40-17.942 40-40 40z',
+  merge:
+    'M776.306 456.032c-51.602 0-95.696 32.744-112.612 78.542-69.674-6.072-141.482-31.012-197.386-69.306-46.266-31.69-100.392-85.728-111.792-168.92 45.4-17.12 77.79-60.998 77.79-112.314 0-66.168-53.832-120-120-120s-120 53.832-120 120c0 52.146 33.444 96.608 80 113.12v429.762c-46.556 16.512-80 60.974-80 113.12 0 66.168 53.832 120 120 120s120-53.832 120-120c0-52.146-33.444-96.608-80-113.12V471.444c19.622 21.888 42.618 41.898 68.792 59.828 68.422 46.868 156.64 77.042 241.646 83.462 16.14 47.23 60.932 81.3 113.56 81.3 66.168 0 120-53.832 120-120s-53.83-120.002-119.998-120.002zm-464-312c22.056 0 40 17.944 40 40s-17.944 40-40 40-40-17.944-40-40 17.942-40 40-40zm0 736c-22.056 0-40-17.944-40-40s17.944-40 40-40 40 17.944 40 40-17.944 40-40 40zm464-264c-22.056 0-40-17.944-40-40s17.944-40 40-40 40 17.944 40 40-17.944 40-40 40z',
+  pullrequest:
+    'M631 157c104 1 171 52 171 166v397a123 123 0 1 1-82 0V323c0-63-27-83-90-84h-24l22 23a41 41 0 1 1-58 58l-93-93a41 41 0 0 1 1-58l93-93a41 41 0 1 1 58 58l-23 23h25zM222 314a123 123 0 1 1 82 0v406a123 123 0 1 1-82 0V314zm41 564a41 41 0 1 0 0-82 41 41 0 0 0 0 82zm0-639a41 41 0 1 0 0-83 41 41 0 0 0 0 83zm498 639a41 41 0 1 0 0-82 41 41 0 0 0 0 82z',
+  chroma:
+    'M511.714 956.324c-92.92 0-168.518-75.594-168.518-168.514v-334.082l131.54 75.954v215.936c0 13.172 7.082 25.446 18.48 32.030l139.33 80.43c8.33 4.814 17.014 9.168 25.872 12.966-29.646 52.72-85.44 85.28-146.704 85.28zM753.584 816.61c-29.36 0-58.43-7.812-84.064-22.59l-83.828-48.404 289.354-167.028c8.3-4.802 16.402-10.152 24.132-15.936 30.858 52.030 31.182 116.622 0.568 169.664-30.034 51.994-86.040 84.294-146.162 84.294zM270.334 816.576c-60.084 0-116.064-32.278-146.102-84.238-22.494-39.012-28.466-84.426-16.814-127.866 11.68-43.512 39.564-79.858 78.522-102.334l83.806-48.398 0.018 334.018c0 9.624 0.57 19.294 1.69 28.814-0.374 0.002-0.748 0.004-1.12 0.004zM548.73 529.73l186.996-107.966c11.416-6.588 18.506-18.864 18.506-32.040v-160.856c0.012-9.456-0.56-19.116-1.706-28.778 0.364-0.002 0.732-0.004 1.096-0.004 60.114 0 116.104 32.296 146.124 84.29 46.436 80.486 18.75 183.742-61.714 230.176l-289.302 167.040v-151.862zM325.248 357.624c-5.632-3.242-12.030-4.954-18.504-4.954-6.428 0-12.804 1.708-18.44 4.936l-139.344 80.452c-8.348 4.802-16.462 10.142-24.172 15.912-30.824-52-31.14-116.59-0.546-169.664 30.048-52 86.050-84.306 146.148-84.306 29.326 0 58.394 7.822 84.064 22.624l289.3 167.054-131.482 75.91-187.024-107.964zM390.964 158.644c-8.334-4.826-17.036-9.192-25.92-13.004 29.634-52.742 85.418-85.316 146.67-85.316 92.92 0 168.514 75.6 168.514 168.522v96.81l-289.264-167.012z',
+  twitter:
+    'M960 233.114c-32.946 14.616-68.41 24.5-105.598 28.942 37.954-22.762 67.098-58.774 80.856-101.688-35.52 21.054-74.894 36.368-116.726 44.598-33.542-35.724-81.316-58.038-134.204-58.038-101.496 0-183.796 82.292-183.796 183.814 0 14.424 1.628 28.45 4.758 41.89-152.75-7.668-288.22-80.872-378.876-192.072-15.822 27.15-24.898 58.706-24.898 92.42 0 63.776 32.458 120.034 81.782 153.010-30.116-0.944-58.458-9.212-83.262-22.982-0.028 0.75-0.028 1.546-0.028 2.324 0 89.070 63.356 163.334 147.438 180.256-15.426 4.186-31.664 6.426-48.442 6.426-11.836 0-23.35-1.146-34.574-3.28 23.406 73.006 91.286 126.16 171.726 127.632-62.914 49.324-142.18 78.696-228.314 78.696-14.828 0-29.448-0.876-43.842-2.568 81.33 52.138 177.96 82.574 281.786 82.574 338.11 0 523-280.104 523-523.014 0-7.986-0.164-15.914-0.542-23.778 35.952-25.96 67.124-58.318 91.756-95.162z',
+  google:
+    'M799.094 79.996c0 0-200.938 0-267.936 0-120.126 0-233.188 91.004-233.188 196.434 0 107.692 81.904 194.624 204.124 194.624 8.496 0 16.75-0.148 24.812-0.74-7.942 15.186-13.594 32.286-13.594 50.022 0 29.974 16.094 54.226 36.466 74.042-15.376 0-30.248 0.438-46.438 0.438-148.782 0.036-263.312 94.784-263.312 193.056 0 96.758 125.534 157.312 274.312 157.312 169.656 0 263.312-96.25 263.312-193.024 0-77.6-22.908-124.062-93.686-174.156-24.216-17.128-70.534-58.812-70.534-83.32 0-28.69 8.19-42.868 51.406-76.624 44.346-34.63 75.688-83.302 75.688-139.944 0-67.372-30-133.058-86.374-154.746h85l59.942-43.374zM701.504 735.438c2.092 8.992 3.276 18.226 3.276 27.624 0 78.226-50.374 139.304-194.934 139.304-102.874 0-177.124-65.078-177.124-143.304 0-76.622 92.122-140.434 194.934-139.32 24.004 0.254 46.376 4.136 66.69 10.702 55.812 38.834 95.874 60.808 107.158 104.994zM536.844 443.782c-69-2.094-134.624-77.212-146.564-167.876-11.874-90.664 34.378-160.030 103.442-157.97 68.996 2.060 134.594 74.818 146.53 165.432 11.906 90.696-34.408 162.508-103.408 160.414z',
+  gdrive:
+    'M465.926 641.356l-149.328 258.708h494.074l149.328-258.708h-494.074zM917.704 567.988l-256.33-444.048h-298.686l256.356 444.048h298.66zM320.236 197.442l-256.236 443.914 149.36 258.708 256.23-443.914-149.354-258.708z',
+  youtube:
+    'M704.010 511.988c0-12.332-5.038-21.358-15.042-26.992l-255.982-159.99c-10.344-6.666-21.178-6.998-32.51-1.008-10.988 5.984-16.492 15.312-16.492 28.002v320c0 12.69 5.504 22.018 16.492 28.002 5.332 2.678 10.516 3.996 15.506 3.996 6.668 0 12.334-1.644 17.004-4.98l255.982-160.014c10.004-5.69 15.042-14.684 15.042-26.992v-0.024zM960 511.988c0 31.99-0.164 56.98-0.488 75.032-0.334 17.99-1.754 40.738-4.27 68.25-2.516 27.504-6.262 52.058-11.27 73.742-5.332 24.338-16.84 44.85-34.504 61.496-17.64 16.63-38.306 26.308-61.96 28.988-73.992 8.342-185.824 12.526-335.508 12.526-149.668 0-261.5-4.184-335.5-12.526-23.662-2.656-44.414-12.302-62.242-28.988-17.834-16.678-29.412-37.182-34.744-61.496-4.672-21.684-8.258-46.238-10.756-73.742-2.508-27.512-3.928-50.26-4.254-68.25-0.342-18.050-0.504-43.042-0.504-75.032 0-31.998 0.162-57.010 0.504-75.008 0.326-18.022 1.746-40.768 4.254-68.28 2.498-27.474 6.262-52.082 11.252-73.744 5.34-24.336 16.842-44.842 34.504-61.496 17.648-16.654 38.324-26.332 61.986-29.010 74-8.312 185.832-12.472 335.5-12.472 149.684 0 261.516 4.16 335.508 12.472 23.654 2.678 44.406 12.356 62.232 29.010 17.826 16.678 29.422 37.16 34.73 61.496 4.702 21.662 8.256 46.27 10.772 73.744 2.516 27.512 3.936 50.258 4.27 68.28 0.324 17.998 0.488 43.010 0.488 75.008z',
+  facebook:
+    'M582.52 960h-167.88v-448h-112v-154.396l112-0.052-0.166-90.948c-0.036-125.974 34.12-202.604 182.484-202.604h123.542v154.424h-77.19c-57.782 0-60.566 21.56-60.566 61.85l-0.218 77.278h138.854l-16.376 154.394-122.36 0.052-0.124 448.002z',
+  medium:
+    'M0 0v1024h1024v-1024h-1024zM850.708 242.614l-54.918 52.655c-3.858 2.965-6.321 7.581-6.321 12.772 0 0.933 0.080 1.847 0.232 2.736l-0.014-0.095v386.883c-0.139 0.794-0.219 1.708-0.219 2.641 0 5.191 2.462 9.807 6.283 12.744l0.038 0.028 53.637 52.655v11.558h-269.774v-11.558l55.559-53.936c5.461-5.456 5.461-7.068 5.461-15.413v-312.719l-154.477 392.344h-20.874l-179.851-392.344v262.947c-0.209 1.465-0.329 3.156-0.329 4.875 0 9.848 3.924 18.78 10.293 25.317l-0.008-0.008 72.258 87.649v11.558h-204.895v-11.558l72.263-87.649c6.070-6.284 9.81-14.852 9.81-24.293 0-2.081-0.182-4.12-0.53-6.101l0.031 0.21v-304.044c0.086-0.804 0.135-1.737 0.135-2.682 0-7.844-3.389-14.896-8.782-19.773l-0.023-0.021-64.234-77.378v-11.558h199.438l154.157 338.083 135.53-338.083h190.123v11.558z',
+  graphql:
+    'M896.38 635.332c-7.286-4.206-14.934-7.196-22.714-9.074v-228.148c7.788-1.882 15.44-4.874 22.732-9.082 40.902-23.614 54.92-75.934 31.3-116.846-23.62-40.914-75.942-54.932-116.846-31.318-7.286 4.21-13.704 9.34-19.22 15.14l-197.586-114.076c2.266-7.68 3.502-15.802 3.502-24.212 0-47.232-38.3-85.53-85.544-85.53-47.242 0-85.544 38.298-85.544 85.53 0 8.42 1.238 16.552 3.508 24.24l-197.598 114.046c-5.518-5.802-11.936-10.93-19.218-15.138-40.902-23.614-93.22-9.596-116.846 31.318-23.62 40.91-9.6 93.228 31.3 116.846 7.29 4.208 14.94 7.202 22.728 9.082v228.15c-7.782 1.878-15.434 4.866-22.718 9.074-40.91 23.62-54.93 75.938-31.31 116.848 23.624 40.914 75.944 54.932 116.856 31.312 7.28-4.206 13.692-9.334 19.206-15.13l197.588 114.080c-2.262 7.68-3.498 15.792-3.498 24.2 0 47.244 38.302 85.544 85.546 85.544 47.242 0 85.542-38.302 85.542-85.544 0-9.362-1.524-18.36-4.308-26.79l196.558-113.484c5.914 6.624 12.946 12.446 21.046 17.126 40.912 23.618 93.23 9.602 116.856-31.314 23.618-40.914 9.598-93.232-31.318-116.85zM253.492 689.212c-1.88-7.73-4.856-15.33-9.038-22.568-4.142-7.18-9.194-13.516-14.892-18.98l258.558-447.814c7.58 2.198 15.586 3.402 23.878 3.402 8.262 0 16.242-1.196 23.802-3.38l258.574 447.85c-5.676 5.456-10.704 11.77-14.834 18.928-4.182 7.238-7.162 14.838-9.042 22.566l-517.006-0.004zM771.404 291.408c-6.156 21.512-3.936 45.396 8.138 66.306 12.066 20.91 31.638 34.772 53.348 40.2v228.538c-1.074 0.266-2.144 0.56-3.208 0.868l-258.56-447.826c0.804-0.768 1.596-1.556 2.372-2.354l197.91 114.268zM450.526 177.162c0.75 0.772 1.516 1.536 2.296 2.282l-258.578 447.856c-1.038-0.3-2.084-0.586-3.134-0.85v-228.536c21.708-5.428 41.276-19.29 53.348-40.202 12.074-20.91 14.294-44.794 8.134-66.306l197.934-114.244zM575.392 849.216c-15.65-17.262-38.256-28.108-63.39-28.108-24.152 0-45.946 10.026-61.5 26.112l-197.908-114.266c0.28-0.986 0.544-1.98 0.794-2.972h517.226c0.464 1.888 0.976 3.756 1.57 5.61l-196.792 113.624z',
+  redux:
+    'M359.016 943.608c-23.82 5.948-47.642 8.322-71.512 8.322-88.208 0-168.084-36.982-207.444-96.534-52.432-79.882-70.296-249.182 102.538-374.356 3.586 19.078 10.746 45.292 15.492 60.834-22.656 16.652-58.39 50.064-81.046 95.324-32.19 63.184-28.61 126.404 9.54 184.798 26.194 39.304 67.926 63.176 121.564 70.34 65.598 8.332 131.154-3.582 194.332-36.94 92.998-48.898 155.014-107.282 195.49-187.162-10.702-10.75-17.818-26.248-19.074-44.15-1.168-36.942 27.45-67.922 64.388-69.132h2.418c35.73 0 65.55 28.61 66.714 64.384 1.206 35.73-24.986 65.546-59.548 69.132-65.6 134.686-181.254 225.312-333.852 255.14zM902.646 540.622c-90.59-106.072-224.11-164.488-376.708-164.488h-19.072c-10.744-21.444-33.402-35.752-58.388-35.752h-2.418c-36.944 1.186-65.548 32.192-64.392 69.13 1.216 35.774 30.99 64.394 66.81 64.394h2.328c26.242-1.208 48.894-17.892 58.434-40.542h21.45c90.624 0 176.46 26.234 253.968 77.482 59.55 39.36 102.49 90.576 126.356 152.596 20.24 50.052 19.074 98.952-2.42 140.64-33.356 63.228-89.37 97.794-163.292 97.794-47.69 0-92.998-14.33-116.822-25.082-13.118 11.958-36.984 31.028-53.64 42.944 51.226 23.87 103.7 36.94 153.762 36.94 114.446 0 199.070-63.132 231.268-126.362 34.562-69.13 32.188-188.326-57.224-289.694zM297.046 708.706c1.21 35.828 30.984 64.394 66.764 64.394h2.368c36.992-1.168 65.556-32.15 64.39-69.132-1.162-35.732-30.984-64.394-66.758-64.394h-2.376c-2.418 0-5.958 0-8.332 1.208-48.89-81.090-69.132-169.27-62.014-264.648 4.792-71.528 28.616-133.516 70.346-184.766 34.568-44.106 101.326-65.57 146.598-66.758 126.402-2.396 180.044 154.968 183.576 218.144 15.542 3.584 41.734 11.936 59.644 17.892-14.328-193.118-133.526-293.266-247.97-293.266-107.28 0-206.236 77.484-245.552 191.932-54.848 152.596-19.070 299.212 47.644 414.826-5.912 8.374-9.494 21.498-8.328 34.568z',
+  github:
+    'M512.062 64.032c-247.426 0-448 200.576-448 448s200.574 448 448 448c247.422 0 448-200.576 448-448s-200.578-448-448-448zM251.846 772.246c-69.506-69.508-107.784-161.918-107.784-260.214 0-98.294 38.278-190.708 107.784-260.216 69.508-69.504 161.92-107.784 260.216-107.784s190.708 38.28 260.214 107.784c69.504 69.508 107.786 161.922 107.786 260.216 0 98.296-38.282 190.708-107.786 260.214-42.852 42.848-94.41 73.806-150.684 91.27v-65.104c0-34.584-11.86-60.022-35.578-76.31 14.864-1.43 28.512-3.43 40.942-6.002 12.434-2.572 25.578-6.292 39.442-11.146s26.292-10.644 37.3-17.364c11-6.712 21.574-15.434 31.718-26.15s18.648-22.866 25.508-36.444c6.864-13.57 12.292-29.866 16.292-48.874 4.004-19.006 6-39.944 6-62.802 0-44.3-14.434-82.032-43.296-113.182 13.14-34.294 11.714-71.594-4.29-111.894l-10.718-1.286c-7.43-0.858-20.79 2.286-40.082 9.434-19.29 7.144-40.942 18.864-64.95 35.152-34.016-9.432-69.308-14.148-105.894-14.148-36.87 0-72.024 4.716-105.46 14.148-15.144-10.29-29.51-18.79-43.086-25.508s-24.436-11.29-32.582-13.718c-8.144-2.43-15.718-3.93-22.722-4.5-7-0.574-11.5-0.714-13.504-0.43-2 0.286-3.43 0.572-4.288 0.86-16.004 40.582-17.436 77.88-4.288 111.894-28.868 31.152-43.3 68.878-43.3 113.178 0 22.866 2 43.798 6.002 62.804 4 19.010 9.432 35.296 16.292 48.876s15.364 25.722 25.508 36.442c10.146 10.718 20.72 19.438 31.724 26.152s23.436 12.504 37.298 17.362c13.862 4.858 27.008 8.574 39.442 11.146 12.434 2.57 26.080 4.574 40.942 6.002-23.438 16.004-35.152 41.444-35.152 76.31v66.404c-57.936-17.198-111.030-48.638-154.966-92.572z',
+  bitbucket:
+    'M512.157 32c-219.6 0-400.001 61.279-400.001 138.881 0 20.4 47.040 310.481 66.641 424.8 7.841 53.28 137.359 126.72 333.36 126.72 196.080 0 321.6-73.601 333.36-126.641 19.601-114.4 66.641-404.479 66.641-424.8-3.919-77.76-180.401-138.96-400.001-138.96v0zM512.157 628.4c-70.56 0-125.52-57.2-125.52-130.722s54.96-130.72 125.52-130.72c70.56 0 125.52 57.199 125.52 130.721 0 69.439-54.96 130.721-125.52 130.721zM512.157 211.76c-141.199 0-254.88-24.559-254.88-57.199 0-32.719 113.681-57.199 254.88-57.199s254.88 24.48 254.88 57.199c0 32.64-113.681 57.199-254.88 57.199zM801.597 706.081c7.84 0 11.76 8.16 7.84 16.32v4.002c-15.679 85.84-27.439 147.199-27.439 155.28-11.76 61.279-129.439 110.321-270.641 110.321-141.12 0-258.8-49.039-270.56-110.321 0-8.16-11.76-69.439-27.439-155.201v-4.081c0-12.24 7.841-16.319 15.679-16.319 4.409 0.751 8.359 2.145 11.962 4.1l-0.202-0.101c0 0 98.081 81.761 274.481 81.761 176.479 0 274.56-81.679 274.56-81.679s3.919-4.080 11.76-4.080l0.001-0.002zM512.157 558.961c-34.639 0-62.719-29.279-62.719-65.359s28.001-65.359 62.719-65.359c34.639 0 62.719 29.279 62.719 65.359s-28.001 65.359-62.719 65.359z',
+  gitlab:
+    'M511.989 937.076l-175.718-538.045h351.434l-175.717 538.045zM90.107 399.031l421.88 538.045-462.033-334.102c-9.156-6.631-15.047-17.289-15.047-29.321 0-3.985 0.645-7.821 1.839-11.406l-0.072 0.255 53.431-163.471zM90.107 399.031l105.75-324.083c2.508-7.304 9.319-12.457 17.334-12.457s14.825 5.153 17.294 12.329l0.042 0.128 105.749 324.082-246.165 0.001zM933.869 399.031l53.431 163.474c1.133 3.347 1.788 7.203 1.788 11.215 0 12.038-5.895 22.705-14.961 29.262l-0.104 0.072-462.034 334.022 421.88-538.046zM933.869 399.031h-246.162l105.75-324.083c2.543-7.242 9.325-12.341 17.292-12.341s14.748 5.096 17.256 12.212l0.042 0.127 105.825 324.083z',
+  discord:
+    'M371 147c-14 0-126 3-245 91 0 0-126 227-126 507 0 0 74 126 268 132l58-71c-111-34-153-103-153-103l24 15 4 2 8 4a668 668 0 0 0 420 68 629 629 0 0 0 228-89s-44 71-159 103l58 71c194-7 268-133 268-132 0-280-126-507-126-507-126-94-246-91-246-91l-12 14a576 576 0 0 1 218 110 729 729 0 0 0-441-81l-15 1c-31 4-105 14-199 56-33 14-52 24-52 24s72-69 230-114l-9-10h-1zm-23 323c50 0 91 43 90 97 0 53-40 96-90 96-49 0-89-43-89-96 0-54 39-97 89-97zm321 0c49 0 89 43 89 97 0 53-39 96-89 96s-90-43-90-96c0-54 40-97 90-97z',
+};
+
+export default icons;
diff --git a/docs/src/new-components/basics/shared/site.js b/docs/src/new-components/basics/shared/site.js
new file mode 100644
index 00000000000..3494038da18
--- /dev/null
+++ b/docs/src/new-components/basics/shared/site.js
@@ -0,0 +1,93 @@
+// eslint-disable import/prefer-default-export
+
+const gitHubOrg = `https://github.com/storybooks`;
+const homepageUrl = `https://storybook.js.org`;
+const npmApiBase = `https://api.npmjs.org/downloads/point/last-month`;
+
+export const metadata = {
+  title: 'Storybook',
+  description: `Storybook is an open source tool for developing UI components in isolation for React, Vue, and Angular`,
+  ogImage: '/images/social/open-graph.png',
+  googleSiteVerification: '',
+  latestVersion: 'v5.0',
+};
+
+export const url = {
+  gitHub: {
+    repo: `${gitHubOrg}/storybook`,
+    frontpage: `${gitHubOrg}/frontpage`,
+    issues: `${gitHubOrg}/storybook/issues`,
+    releases: `${gitHubOrg}/storybook/releases`,
+    contributors: `${gitHubOrg}/storybook/graphs/contributors`,
+    brand: `${gitHubOrg}/press`,
+  },
+
+  npm: `https://www.npmjs.com/package/@storybook/react`,
+  openCollective: `https://opencollective.com/storybook`,
+
+  npmApi: {
+    react: `${npmApiBase}/@storybook/react`,
+    reactNative: `${npmApiBase}/@storybook/react-native`,
+    vue: `${npmApiBase}/@storybook/vue`,
+    angular: `${npmApiBase}/@storybook/angular`,
+    ember: `${npmApiBase}/@storybook/ember`,
+    html: `${npmApiBase}/@storybook/html`,
+    svelte: `${npmApiBase}/@storybook/svelte`,
+    mithril: `${npmApiBase}/@storybook/mithril`,
+    riot: `${npmApiBase}/@storybook/riot`,
+    polymer: `${npmApiBase}/@storybook/polymer`,
+    preact: `${npmApiBase}/@storybook/preact`,
+  },
+
+  // Navigation
+  home: `${homepageUrl}`,
+  docs: {
+    home: `${homepageUrl}/basics/introduction/`,
+    addonInstruction: `${homepageUrl}/addons/writing-addons/`,
+  },
+  addons: `${homepageUrl}/addons`,
+  community: `${homepageUrl}/community`,
+  useCases: `${homepageUrl}/use-cases`,
+  support: `${homepageUrl}/support`,
+  team: `${homepageUrl}/team`,
+
+  // Social
+  blog: `https://medium.com/storybookjs`,
+  twitter: `https://twitter.com/storybookjs`,
+  chat: `https://discord.gg/UUt2PJb`,
+  youtube: `https://www.youtube.com/channel/UCr7Quur3eIyA_oe8FNYexfg`,
+
+  // Brand
+  brand: `${gitHubOrg}/brand`,
+  designSystem: `https://storybooks-official.netlify.com`,
+  badge: `${gitHubOrg}/brand/tree/master/badge`,
+  presentation: `${gitHubOrg}/brand/tree/master/presentation`,
+  video: `${gitHubOrg}/brand/tree/master/video`,
+
+  // Framework docs
+  framework: {
+    react: `${homepageUrl}/basics/guide-react/`,
+    reactNative: `${homepageUrl}/basics/guide-react-native/`,
+    vue: `${homepageUrl}/basics/guide-vue/`,
+    angular: `${homepageUrl}/basics/guide-angular/`,
+    ember: `${homepageUrl}/basics/guide-ember/`,
+    html: `${homepageUrl}/basics/guide-html/`,
+    svelte: `${homepageUrl}/basics/guide-svelte/`,
+    mithril: `${homepageUrl}/basics/guide-mithril/`,
+    riot: `${homepageUrl}/basics/guide-riot/`,
+  },
+
+  // Official addons
+  officialAddons: {
+    knobs: `${gitHubOrg}/storybook/tree/master/addons/knobs`,
+    actions: `${gitHubOrg}/storybook/tree/master/addons/actions`,
+    source: `${gitHubOrg}/storybook/tree/master/addons/storysource`,
+    info: `${gitHubOrg}/storybook/tree/master/addons/info`,
+    viewport: `${gitHubOrg}/storybook/tree/master/addons/viewport`,
+    storyshots: `${gitHubOrg}/storybook/tree/master/addons/storyshots`,
+    backgrounds: `${gitHubOrg}/storybook/tree/master/addons/backgrounds`,
+    accessibility: `${gitHubOrg}/storybook/tree/master/addons/a11y`,
+    console: `${gitHubOrg}/storybook-addon-console`,
+    links: `${gitHubOrg}/storybook/tree/master/addons/links`,
+  },
+};
diff --git a/docs/src/new-components/basics/shared/styles.js b/docs/src/new-components/basics/shared/styles.js
new file mode 100644
index 00000000000..0b37b0043dc
--- /dev/null
+++ b/docs/src/new-components/basics/shared/styles.js
@@ -0,0 +1,96 @@
+import { css } from 'styled-components';
+
+// Global style variables
+export const background = {
+  app: '#F6F9FC',
+  appInverse: '#7A8997',
+  positive: '#E1FFD4',
+  negative: '#FEDED2',
+  warning: '#FFF5CF',
+};
+
+export const color = {
+  // Palette
+  primary: '#FF4785', // coral
+  secondary: '#1EA7FD', // ocean
+  tertiary: '#DDDDDD',
+
+  orange: '#FC521F',
+  gold: '#FFAE00',
+  green: '#66BF3C',
+  seafoam: '#37D5D3',
+  purple: '#6F2CAC',
+  ultraviolet: '#2A0481',
+
+  // Monochrome
+  lightest: '#FFFFFF',
+  lighter: '#F8F8F8',
+  light: '#F3F3F3',
+  mediumlight: '#EEEEEE',
+  medium: '#DDDDDD',
+  mediumdark: '#999999',
+  dark: '#666666',
+  darker: '#444444',
+  darkest: '#333333',
+
+  border: 'rgba(0,0,0,.05)',
+
+  // Status
+  positive: '#66BF3C',
+  negative: '#FF4400',
+};
+
+export const spacing = {
+  padding: {
+    small: 10,
+    medium: 20,
+    large: 30,
+  },
+  borderRadius: {
+    small: 5,
+    default: 10,
+  },
+};
+
+export const typography = {
+  type: {
+    primary: '"Nunito Sans", "Helvetica Neue", Helvetica, Arial, sans-serif',
+    code: '"SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace',
+  },
+  weight: {
+    regular: '400',
+    bold: '700',
+    black: '900',
+  },
+  size: {
+    s1: '12',
+    s2: '14',
+    s3: '16',
+    m1: '20',
+    m2: '24',
+    m3: '28',
+    l1: '32',
+    l2: '40',
+    l3: '48',
+    code: '90',
+  },
+};
+
+export const breakpoint = 600;
+export const pageMargin = '5.55555';
+
+export const pageMargins = css`
+  padding: 0 ${spacing.padding.medium}px;
+  @media (min-width: ${breakpoint * 1}px) {
+    margin: 0 ${pageMargin * 1}%;
+  }
+  @media (min-width: ${breakpoint * 2}px) {
+    margin: 0 ${pageMargin * 2}%;
+  }
+  @media (min-width: ${breakpoint * 3}px) {
+    margin: 0 ${pageMargin * 3}%;
+  }
+  @media (min-width: ${breakpoint * 4}px) {
+    margin: 0 ${pageMargin * 4}%;
+  }
+`;
diff --git a/docs/src/new-components/basics/tooltip/Tooltip.js b/docs/src/new-components/basics/tooltip/Tooltip.js
new file mode 100644
index 00000000000..6feb964d458
--- /dev/null
+++ b/docs/src/new-components/basics/tooltip/Tooltip.js
@@ -0,0 +1,100 @@
+// Our wrapper around react-popper that does common stuff.
+
+import React from 'react';
+import PropTypes from 'prop-types';
+import styled, { css } from 'styled-components';
+import { typography } from '../shared/styles';
+
+const ifPlacementEquals = (placement, value, fallback = 0) => props =>
+  props['data-placement'].split('-')[0] === placement ? value : fallback;
+
+const ArrowSpacing = 8;
+
+const Arrow = styled.div`
+  position: absolute;
+  border-style: solid;
+
+  margin-bottom: ${ifPlacementEquals('top', '0', ArrowSpacing)}px;
+  margin-top: ${ifPlacementEquals('bottom', '0', ArrowSpacing)}px;
+  margin-right: ${ifPlacementEquals('left', '0', ArrowSpacing)}px;
+  margin-left: ${ifPlacementEquals('right', '0', ArrowSpacing)}px;
+
+  bottom: ${ifPlacementEquals('top', ArrowSpacing * -1, 'auto')}px;
+  top: ${ifPlacementEquals('bottom', ArrowSpacing * -1, 'auto')}px;
+  right: ${ifPlacementEquals('left', ArrowSpacing * -1, 'auto')}px;
+  left: ${ifPlacementEquals('right', ArrowSpacing * -1, 'auto')}px;
+
+  border-bottom-width: ${ifPlacementEquals('top', '0', ArrowSpacing)}px;
+  border-top-width: ${ifPlacementEquals('bottom', '0', ArrowSpacing)}px;
+  border-right-width: ${ifPlacementEquals('left', '0', ArrowSpacing)}px;
+  border-left-width: ${ifPlacementEquals('right', '0', ArrowSpacing)}px;
+
+  border-top-color: ${ifPlacementEquals('top', 'white', 'transparent')};
+  border-bottom-color: ${ifPlacementEquals('bottom', 'white', 'transparent')};
+  border-left-color: ${ifPlacementEquals('left', 'white', 'transparent')};
+  border-right-color: ${ifPlacementEquals('right', 'white', 'transparent')};
+`;
+
+const TooltipWrapper = styled.div`
+  display: ${props => (props.hidden ? 'none' : 'inline-block')};
+  z-index: 2147483647;
+
+  ${props =>
+    !props.hasChrome &&
+    css`
+      margin-bottom: ${ifPlacementEquals('top', 8)}px;
+      margin-bottom: ${ifPlacementEquals('top-start', 8)}px;
+      margin-top: ${ifPlacementEquals('bottom', 8)}px;
+      margin-top: ${ifPlacementEquals('bottom-start', 8)}px;
+      margin-left: ${ifPlacementEquals('right', 8)}px;
+      margin-right: ${ifPlacementEquals('left', 8)}px;
+    `};
+
+  ${props =>
+    props.hasChrome &&
+    css`
+      margin-bottom: ${ifPlacementEquals('top', ArrowSpacing + 2)}px;
+      margin-top: ${ifPlacementEquals('bottom', ArrowSpacing + 2)}px;
+      margin-left: ${ifPlacementEquals('right', ArrowSpacing + 2)}px;
+      margin-right: ${ifPlacementEquals('left', ArrowSpacing + 2)}px;
+
+      background-image: linear-gradient(
+        -1deg,
+        rgba(248, 248, 248, 0.97) 0%,
+        rgba(255, 255, 255, 0.97) 100%
+      );
+      box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.05), 0 5px 15px 0 rgba(0, 0, 0, 0.1);
+      border-radius: 4px;
+      font-size: ${typography.size.s1}px;
+    `};
+`;
+
+export default function Tooltip({
+  placement,
+  hasChrome,
+  children,
+  arrowProps,
+  tooltipRef,
+  arrowRef,
+  ...props
+}) {
+  return (
+    <TooltipWrapper hasChrome={hasChrome} data-placement={placement} ref={tooltipRef} {...props}>
+      {hasChrome && <Arrow data-placement={placement} ref={arrowRef} {...arrowProps} />}
+      {children}
+    </TooltipWrapper>
+  );
+}
+
+Tooltip.propTypes = {
+  children: PropTypes.node.isRequired,
+  hasChrome: PropTypes.bool,
+  /* eslint-disable-next-line */
+  arrowProps: PropTypes.any,
+  placement: PropTypes.string,
+};
+Tooltip.defaultProps = {
+  hasChrome: true,
+  placement: 'top',
+  arrowProps: null,
+};
diff --git a/docs/src/new-components/basics/tooltip/Tooltip.stories.js b/docs/src/new-components/basics/tooltip/Tooltip.stories.js
new file mode 100644
index 00000000000..4ad8093b8c1
--- /dev/null
+++ b/docs/src/new-components/basics/tooltip/Tooltip.stories.js
@@ -0,0 +1,44 @@
+/* eslint-disable import/no-extraneous-dependencies */
+import React from 'react';
+import { storiesOf } from '@storybook/react';
+import styled from 'styled-components';
+import Tooltip from './Tooltip';
+
+// Popper would position the tooltip absolutely. We just need to make sure we are pos:rel
+const mockPopperProps = { style: { position: 'relative', top: '20px', left: '20px' } };
+
+const Content = styled.div`
+  width: 100px;
+  height: 100px;
+  font-size: 16px;
+  text-align: center;
+  line-height: 100px;
+  background: #eee;
+`;
+
+storiesOf('basics/tooltip/Tooltip', module)
+  .add('basic, default', () => (
+    <Tooltip hasChrome {...mockPopperProps}>
+      <Content>Text</Content>
+    </Tooltip>
+  ))
+  .add('basic, default, bottom', () => (
+    <Tooltip hasChrome placement="bottom" {...mockPopperProps}>
+      <Content>Text</Content>
+    </Tooltip>
+  ))
+  .add('basic, default, left', () => (
+    <Tooltip hasChrome placement="left" {...mockPopperProps}>
+      <Content>Text</Content>
+    </Tooltip>
+  ))
+  .add('basic, default, right', () => (
+    <Tooltip placement="right" {...mockPopperProps}>
+      <Content>Text</Content>
+    </Tooltip>
+  ))
+  .add('no chrome', () => (
+    <Tooltip {...mockPopperProps}>
+      <Content>Text</Content>
+    </Tooltip>
+  ));
diff --git a/docs/src/new-components/basics/tooltip/TooltipLinkList.js b/docs/src/new-components/basics/tooltip/TooltipLinkList.js
new file mode 100644
index 00000000000..a3585e9e66c
--- /dev/null
+++ b/docs/src/new-components/basics/tooltip/TooltipLinkList.js
@@ -0,0 +1,45 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import styled from 'styled-components';
+import ListItem from '../ListItem';
+
+const List = styled.div`
+  min-width: 180px;
+`;
+
+function TooltipLinkList({ links, LinkWrapper }) {
+  return (
+    <List>
+      {links.map(({ title, href, onClick, active, isGatsby, ...props }, index) => (
+        <ListItem
+          /* eslint-disable react/no-array-index-key */
+          key={index}
+          title={title}
+          onClick={onClick}
+          active={active}
+          href={href}
+          LinkWrapper={isGatsby ? LinkWrapper : null}
+          {...props}
+        />
+      ))}
+    </List>
+  );
+}
+
+TooltipLinkList.propTypes = {
+  links: PropTypes.arrayOf(
+    PropTypes.shape({
+      title: PropTypes.node.isRequired,
+      href: PropTypes.oneOfType([PropTypes.string, PropTypes.shape({})]),
+      onClick: PropTypes.func,
+      active: PropTypes.bool,
+    }).isRequired
+  ).isRequired,
+  LinkWrapper: PropTypes.shape(),
+};
+
+TooltipLinkList.defaultProps = {
+  LinkWrapper: ListItem.defaultProps.LinkWrapper,
+};
+
+export default TooltipLinkList;
diff --git a/docs/src/new-components/basics/tooltip/TooltipLinkList.stories.js b/docs/src/new-components/basics/tooltip/TooltipLinkList.stories.js
new file mode 100644
index 00000000000..123c466715d
--- /dev/null
+++ b/docs/src/new-components/basics/tooltip/TooltipLinkList.stories.js
@@ -0,0 +1,28 @@
+/* eslint-disable import/no-extraneous-dependencies */
+import React from 'react';
+import { storiesOf } from '@storybook/react';
+import { action } from '@storybook/addon-actions';
+import WithTooltip from './WithTooltip';
+
+import TooltipLinkList from './TooltipLinkList';
+import StoryLinkWrapper from '../../lib/StoryLinkWrapper';
+
+// eslint-disable-next-line import/prefer-default-export
+export const links = [
+  { title: 'Link', href: 'http://google.com' },
+  { title: 'Link', href: 'http://google.com' },
+  { title: 'callback', onClick: action('onClick') },
+];
+
+storiesOf('basics/tooltip/TooltipLinkList', module)
+  .addDecorator(storyFn => (
+    <div style={{ height: '300px' }}>
+      <WithTooltip placement="top" trigger="click" startOpen tooltip={storyFn()}>
+        <div>Tooltip</div>
+      </WithTooltip>
+    </div>
+  ))
+  .add('links', () => <TooltipLinkList links={links.slice(0, 2)} LinkWrapper={StoryLinkWrapper} />)
+  .add('links and callback', () => (
+    <TooltipLinkList links={links} LinkWrapper={StoryLinkWrapper} />
+  ));
diff --git a/docs/src/new-components/basics/tooltip/TooltipMessage.js b/docs/src/new-components/basics/tooltip/TooltipMessage.js
new file mode 100644
index 00000000000..ff6adb95ce1
--- /dev/null
+++ b/docs/src/new-components/basics/tooltip/TooltipMessage.js
@@ -0,0 +1,70 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import styled from 'styled-components';
+import { color, typography } from '../shared/styles';
+import Link from '../Link';
+
+const Title = styled.div`
+  font-weight: ${typography.weight.black};
+`;
+
+const Desc = styled.span``;
+
+const Links = styled.div`
+  margin-top: 8px;
+  text-align: center;
+
+  > * {
+    margin: 0 8px;
+    font-weight: ${typography.weight.black};
+  }
+`;
+
+const Message = styled.div`
+  color: ${color.darker};
+  line-height: 18px;
+`;
+
+const MessageWrapper = styled.div`
+  padding: 15px;
+  width: 280px;
+  box-sizing: border-box;
+`;
+
+function TooltipMessage({ title, desc, links }) {
+  return (
+    <MessageWrapper>
+      <Message>
+        {title && <Title>{title}</Title>}
+        {desc && <Desc>{desc}</Desc>}
+      </Message>
+      {links && (
+        <Links>
+          {links.map(({ title: linkTitle, ...other }) => (
+            <Link {...other} key={linkTitle}>
+              {linkTitle}
+            </Link>
+          ))}
+        </Links>
+      )}
+    </MessageWrapper>
+  );
+}
+
+TooltipMessage.propTypes = {
+  title: PropTypes.node,
+  desc: PropTypes.node,
+  links: PropTypes.arrayOf(
+    PropTypes.shape({
+      title: PropTypes.string.isRequired,
+    })
+  ),
+};
+
+TooltipMessage.defaultProps = {
+  title: null,
+  desc: null,
+  links: null,
+};
+
+export default TooltipMessage;
diff --git a/docs/src/new-components/basics/tooltip/TooltipMessage.stories.js b/docs/src/new-components/basics/tooltip/TooltipMessage.stories.js
new file mode 100644
index 00000000000..0d2af744aa8
--- /dev/null
+++ b/docs/src/new-components/basics/tooltip/TooltipMessage.stories.js
@@ -0,0 +1,38 @@
+/* eslint-disable import/no-extraneous-dependencies */
+import React from 'react';
+import { storiesOf } from '@storybook/react';
+import WithTooltip from './WithTooltip';
+
+import TooltipMessage from './TooltipMessage';
+
+storiesOf('basics/tooltip/TooltipMessage', module)
+  .addDecorator(storyFn => (
+    <div style={{ height: '300px' }}>
+      <WithTooltip placement="top" trigger="click" startOpen tooltip={storyFn()}>
+        <div>Tooltip</div>
+      </WithTooltip>
+    </div>
+  ))
+  .add('default', () => (
+    <TooltipMessage
+      title="Lorem ipsum dolor sit"
+      desc="Amet consectatur vestibulum concet durum politu coret weirom"
+    />
+  ))
+  .add('with link', () => (
+    <TooltipMessage
+      title="Lorem ipsum dolor sit"
+      desc="Amet consectatur vestibulum concet durum politu coret weirom"
+      links={[{ title: 'Continue', href: 'test' }]}
+    />
+  ))
+  .add('with links', () => (
+    <TooltipMessage
+      title="Lorem ipsum dolor sit"
+      desc="Amet consectatur vestibulum concet durum politu coret weirom"
+      links={[{ title: 'Get more tips', href: 'test' }, { title: 'Done', href: 'test' }]}
+    />
+  ))
+  .add('minimal message', () => (
+    <TooltipMessage desc="Amet consectatur vestibulum concet durum politu coret weirom" />
+  ));
diff --git a/docs/src/new-components/basics/tooltip/TooltipNote.js b/docs/src/new-components/basics/tooltip/TooltipNote.js
new file mode 100644
index 00000000000..6676a0668fd
--- /dev/null
+++ b/docs/src/new-components/basics/tooltip/TooltipNote.js
@@ -0,0 +1,27 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import styled from 'styled-components';
+import { color, typography } from '../shared/styles';
+
+const Note = styled.div`
+  padding: 2px 6px;
+  line-height: 16px;
+  font-size: 10px;
+  font-weight: ${typography.weight.bold};
+  color: ${color.lightest};
+  box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.3);
+  border-radius: 4px;
+  white-space: nowrap;
+  pointer-events: none;
+  z-index: -1;
+  background: rgba(0, 0, 0, 0.4);
+  margin: 6px;
+`;
+
+export default function TooltipNote({ note }) {
+  return <Note>{note}</Note>;
+}
+
+TooltipNote.propTypes = {
+  note: PropTypes.string.isRequired,
+};
diff --git a/docs/src/new-components/basics/tooltip/TooltipNote.stories.js b/docs/src/new-components/basics/tooltip/TooltipNote.stories.js
new file mode 100644
index 00000000000..44fe7cc6d1a
--- /dev/null
+++ b/docs/src/new-components/basics/tooltip/TooltipNote.stories.js
@@ -0,0 +1,16 @@
+/* eslint-disable import/no-extraneous-dependencies */
+import React from 'react';
+import { storiesOf } from '@storybook/react';
+import WithTooltip from './WithTooltip';
+
+import TooltipNote from './TooltipNote';
+
+storiesOf('basics/tooltip/TooltipNote', module)
+  .addDecorator(storyFn => (
+    <div style={{ height: '300px' }}>
+      <WithTooltip hasChrome={false} placement="top" trigger="click" startOpen tooltip={storyFn()}>
+        <div>Tooltip</div>
+      </WithTooltip>
+    </div>
+  ))
+  .add('default', () => <TooltipNote note="Lorem ipsum dolor" />);
diff --git a/docs/src/new-components/basics/tooltip/WithTooltip.js b/docs/src/new-components/basics/tooltip/WithTooltip.js
new file mode 100644
index 00000000000..1ad3dcb01fc
--- /dev/null
+++ b/docs/src/new-components/basics/tooltip/WithTooltip.js
@@ -0,0 +1,94 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import styled from 'styled-components';
+import TooltipTrigger from 'react-popper-tooltip';
+import { withState } from 'recompose';
+
+import Tooltip from './Tooltip';
+
+// A target that doesn't speak popper
+// prettier-ignore
+const TargetContainer = styled.div`
+  display: inline-block;
+  cursor: ${props => props.mode === 'hover' ? 'default' : 'pointer'};
+`;
+
+const TargetSvgContainer = styled.g`
+  cursor: ${props => (props.mode === 'hover' ? 'default' : 'pointer')};
+`;
+
+function WithTooltip({
+  svg,
+  trigger,
+  closeOnClick,
+  placement,
+  modifiers,
+  hasChrome,
+  tooltip,
+  children,
+  tooltipShown,
+  onVisibilityChange,
+  ...props
+}) {
+  const Container = svg ? TargetSvgContainer : TargetContainer;
+  return (
+    <TooltipTrigger
+      placement={placement}
+      trigger={trigger}
+      tooltipShown={tooltipShown}
+      onVisibilityChange={onVisibilityChange}
+      modifiers={modifiers}
+      tooltip={({
+        getTooltipProps,
+        getArrowProps,
+        tooltipRef,
+        arrowRef,
+        placement: tooltipPlacement,
+      }) => (
+        <Tooltip
+          hasChrome={hasChrome}
+          placement={tooltipPlacement}
+          tooltipRef={tooltipRef}
+          arrowRef={arrowRef}
+          arrowProps={getArrowProps()}
+          {...getTooltipProps()}
+        >
+          {typeof tooltip === 'function'
+            ? tooltip({ onHide: () => onVisibilityChange(false) })
+            : tooltip}
+        </Tooltip>
+      )}
+    >
+      {({ getTriggerProps, triggerRef }) => (
+        <Container ref={triggerRef} {...getTriggerProps()} {...props}>
+          {children}
+        </Container>
+      )}
+    </TooltipTrigger>
+  );
+}
+
+WithTooltip.propTypes = {
+  svg: PropTypes.bool,
+  trigger: PropTypes.string,
+  closeOnClick: PropTypes.bool,
+  placement: PropTypes.string,
+  modifiers: PropTypes.shape({}),
+  hasChrome: PropTypes.bool,
+  tooltip: PropTypes.oneOfType([PropTypes.node, PropTypes.func]).isRequired,
+  children: PropTypes.node.isRequired,
+  onVisibilityChange: PropTypes.func.isRequired,
+};
+
+WithTooltip.defaultProps = {
+  svg: false,
+  trigger: 'hover',
+  closeOnClick: false,
+  placement: 'top',
+  modifiers: {},
+  hasChrome: true,
+};
+
+export default withState('tooltipShown', 'onVisibilityChange', ({ startOpen }) => startOpen)(
+  WithTooltip
+);
diff --git a/docs/src/new-components/basics/tooltip/WithTooltip.stories.js b/docs/src/new-components/basics/tooltip/WithTooltip.stories.js
new file mode 100644
index 00000000000..e714a1bc96b
--- /dev/null
+++ b/docs/src/new-components/basics/tooltip/WithTooltip.stories.js
@@ -0,0 +1,87 @@
+/* eslint-disable import/no-extraneous-dependencies */
+import React from 'react';
+import PropTypes from 'prop-types';
+import { storiesOf } from '@storybook/react';
+import styled from 'styled-components';
+
+import TooltipMessage from './TooltipMessage';
+import WithTooltip from './WithTooltip';
+
+const ViewPort = styled.div`
+  height: 300px;
+`;
+
+const BackgroundBox = styled.div`
+  width: 500px;
+  height: 500px;
+  overflow-y: scroll;
+  background: #eee;
+  position: relative;
+`;
+
+const Spacer = styled.div`
+  height: 100px;
+`;
+
+const Trigger = styled.div`
+  width: 200px;
+  height: 100px;
+  background-color: red;
+  color: white;
+`;
+
+const Tooltip = ({ onHide }) => (
+  <TooltipMessage
+    title="Lorem ipsum dolor sit"
+    desc="Amet consectatur vestibulum concet durum politu coret weirom"
+    links={[{ title: 'Continue', onClick: onHide }]}
+  />
+);
+
+Tooltip.propTypes = {
+  onHide: PropTypes.func,
+};
+
+Tooltip.defaultProps = {
+  onHide: null,
+};
+
+storiesOf('basics/tooltip/WithTooltip', module)
+  .addDecorator(storyFn => (
+    <ViewPort>
+      <BackgroundBox>
+        <Spacer />
+        {storyFn()}
+      </BackgroundBox>
+    </ViewPort>
+  ))
+  .add('simple hover', () => (
+    <WithTooltip placement="top" trigger="hover" tooltip={<Tooltip />}>
+      <Trigger>Hover me!</Trigger>
+    </WithTooltip>
+  ))
+  .add('simple hover, functional', () => (
+    <WithTooltip placement="top" trigger="hover" tooltip={Tooltip}>
+      <Trigger>Hover me!</Trigger>
+    </WithTooltip>
+  ))
+  .add('simple click', () => (
+    <WithTooltip placement="top" trigger="click" tooltip={<Tooltip />}>
+      <Trigger>Click me!</Trigger>
+    </WithTooltip>
+  ))
+  .add('simple click start open', () => (
+    <WithTooltip placement="top" trigger="click" startOpen tooltip={<Tooltip />}>
+      <Trigger>Click me!</Trigger>
+    </WithTooltip>
+  ))
+  .add('simple click closeOnClick', () => (
+    <WithTooltip placement="top" trigger="click" closeOnClick tooltip={<Tooltip />}>
+      <Trigger>Click me!</Trigger>
+    </WithTooltip>
+  ))
+  .add('no chrome', () => (
+    <WithTooltip placement="top" trigger="click" hasChrome={false} tooltip={<Tooltip />}>
+      <Trigger>Click me!</Trigger>
+    </WithTooltip>
+  ));
diff --git a/docs/src/new-components/layout/Header.js b/docs/src/new-components/layout/Header.js
new file mode 100644
index 00000000000..ec408ca3830
--- /dev/null
+++ b/docs/src/new-components/layout/Header.js
@@ -0,0 +1,184 @@
+import React from 'react';
+import styled, { css } from 'styled-components';
+
+import { GlobalStyle } from '../basics/shared/global';
+import { Link, Icon, TooltipLinkList, WithTooltip, styles, site } from '../basics';
+import { navLinks } from './PageLayout';
+
+const { color, typography, spacing, breakpoint } = styles;
+const { metadata, url } = site;
+
+const LogotypeWrapper = styled(Link)`
+  display: inline-block;
+  img {
+    height: 22px;
+    width: auto;
+    margin-top: 14px;
+    @media (min-width: ${breakpoint}px) {
+      height: 26px;
+      margin-top: 10px;
+    }
+
+    display: block;
+
+    transition: all 150ms ease-out;
+    transform: translate3d(0, 0, 0);
+    &:hover {
+      transform: translate3d(0, -1px, 0);
+    }
+    &:active {
+      transform: translate3d(0, 0, 0);
+    }
+  }
+`;
+
+const Version = styled(Link)`
+  display: inline-block;
+  vertical-align: top;
+  margin-left: 10px;
+  position: relative;
+  top: 2px;
+  font-size: ${typography.size.s1}px;
+  color: ${color.mediumdark};
+`;
+
+const TooltipLinkListWrapper = styled.div`
+  padding: 8px 5px;
+  color: ${color.darkest};
+`;
+
+const NavLink = styled(Link)`
+  font-size: ${typography.size.s2}px;
+  font-weight: ${typography.weight.bold};
+`;
+
+const Menu = styled(Link)`
+  width: 3rem;
+  height: 3rem;
+  border: none !important;
+  text-decoration: none !important;
+  background: none !important;
+  text-align: right;
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+
+  svg {
+    vertical-align: top;
+    height: 1rem;
+    width: 1rem;
+    margin: 0;
+  }
+`;
+
+const MobileMenu = styled.div`
+  font-size: ${typography.size.s1}px;
+
+  ${TooltipLinkListWrapper} {
+    padding: 5px 0;
+  }
+`;
+
+const NavItem = styled.div`
+  display: inline-block;
+  line-height: 3rem;
+  height: 3rem;
+  vertical-align: top;
+
+  ${props =>
+    props.showDesktop &&
+    css`
+      display: none;
+      @media (min-width: ${breakpoint * 1.333}px) {
+        display: inline-block;
+      }
+    `};
+
+  ${props =>
+    props.showMobile &&
+    css`
+      @media (min-width: ${breakpoint * 1.333}px) {
+        display: none;
+      }
+    `};
+`;
+
+const NavGroup = styled.div`
+  position: absolute;
+  top: 0;
+  left: 0;
+  z-index: 1;
+
+  ${props =>
+    props.right &&
+    css`
+      left: auto;
+      right: 0;
+    `}
+
+  ${NavItem} + ${NavItem} {
+    margin-left: ${spacing.padding.large}px;
+  }
+`;
+
+const Nav = styled.div`
+  height: 3rem;
+  position: relative;
+  text-align: center;
+  z-index: 3;
+`;
+
+const NavWrapper = styled.nav`
+  padding-top: 12px;
+  @media (min-width: ${breakpoint}px) {
+    padding-top: 36px;
+  }
+`;
+
+export default function Header({ ...props }) {
+  const mobileMenu = (
+    <MobileMenu>
+      <TooltipLinkList links={navLinks} />
+    </MobileMenu>
+  );
+
+  return (
+    <NavWrapper {...props}>
+      <GlobalStyle />
+
+      <Nav>
+        <NavGroup>
+          <NavItem>
+            <LogotypeWrapper isGatsby to="/">
+              <img src="https://storybook.js.org/images/logos/logo-storybook.svg" alt="Storybook" />
+            </LogotypeWrapper>
+            <Version href={url.gitHub.releases}>{metadata.latestVersion}</Version>
+          </NavItem>
+        </NavGroup>
+
+        <NavGroup right>
+          {navLinks.map(({ title, href, isGatsby }) => (
+            <NavItem showDesktop key={title}>
+              <NavLink
+                tertiary={1}
+                href={!isGatsby ? href : undefined}
+                to={isGatsby ? href : undefined}
+                isGatsby={isGatsby}
+              >
+                {title}
+              </NavLink>
+            </NavItem>
+          ))}
+
+          <NavItem showMobile>
+            <WithTooltip placement="top" trigger="click" tooltip={mobileMenu}>
+              <Menu secondary icon={1} isButton>
+                <Icon icon="menu" />
+              </Menu>
+            </WithTooltip>
+          </NavItem>
+        </NavGroup>
+      </Nav>
+    </NavWrapper>
+  );
+}
diff --git a/docs/src/new-components/layout/PageLayout.js b/docs/src/new-components/layout/PageLayout.js
new file mode 100644
index 00000000000..d831a7c647b
--- /dev/null
+++ b/docs/src/new-components/layout/PageLayout.js
@@ -0,0 +1,12 @@
+import { site } from '../basics';
+
+const { url } = site;
+
+export const navLinks = [
+  { title: 'Docs', href: url.docs.home, isGatsby: false },
+  { title: 'Addons', href: url.addons, isGatsby: false },
+  { title: 'Community', href: url.community, isGatsby: false },
+  { title: 'Use cases', href: url.useCases, isGatsby: false },
+  { title: 'Support', href: url.support, isGatsby: false },
+  { title: 'Team', href: url.team, isGatsby: false },
+];
diff --git a/docs/src/new-components/lib/StoryLinkWrapper.js b/docs/src/new-components/lib/StoryLinkWrapper.js
new file mode 100644
index 00000000000..8d2d37aaef5
--- /dev/null
+++ b/docs/src/new-components/lib/StoryLinkWrapper.js
@@ -0,0 +1,29 @@
+/* eslint-disable import/no-extraneous-dependencies */
+// This is allows us to test whether the link works via the actions addon
+import React, { Children } from 'react';
+import PropTypes from 'prop-types';
+import { action } from '@storybook/addon-actions';
+
+const onLinkClick = action('onLinkClick');
+
+export default function StoryLinkWrapper({ href, passHref, children }) {
+  const child = Children.only(children);
+
+  return React.cloneElement(child, {
+    href: passHref && href,
+    onClick: e => {
+      e.preventDefault();
+      onLinkClick(href);
+    },
+  });
+}
+
+StoryLinkWrapper.propTypes = {
+  href: PropTypes.string.isRequired,
+  passHref: PropTypes.bool,
+  children: PropTypes.node.isRequired,
+};
+
+StoryLinkWrapper.defaultProps = {
+  passHref: false,
+};
diff --git a/docs/static/images/logo-storybook.svg b/docs/static/images/logo-storybook.svg
new file mode 100644
index 00000000000..6a7bc610ca2
--- /dev/null
+++ b/docs/static/images/logo-storybook.svg
@@ -0,0 +1 @@
+<svg width="200px" height="40px" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><path d="M1.2405585 36.8586756L.00144019 3.84178492c-.04092322-1.09041839.79517056-2.01453526 1.8842316-2.08260158L29.9688501.0039847c1.1085341-.06928338 2.0633439.77319581 2.1326273 1.88172995a2.01111864 2.01111864 0 0 1 .0039164.12544867V37.9889049C32.1053938 39.0996021 31.2049959 40 30.0942987 40a2.01116305 2.01116305 0 0 1-.0902337-.0020253L3.16000504 38.7923224c-1.04546998-.0469554-1.8801983-.8878591-1.91944654-1.9336468z" id="a"/></defs><g fill="none" fill-rule="evenodd"><path d="M53.28 31.663c-1.7066752 0-3.3493254-.229331-4.928-.688-1.5786746-.458669-2.8906614-1.0933293-3.936-1.904l1.6-3.552c2.1760109 1.5146742 4.6186531 2.272 7.328 2.272 1.408007 0 2.4906629-.229331 3.248-.688.7573371-.458669 1.136-1.0933293 1.136-1.904 0-.725337-.3466632-1.2906646-1.04-1.696s-1.9253245-.7999981-3.696-1.184c-1.9840099-.4053354-3.5679941-.8959971-4.752-1.472-1.1840059-.5760029-2.0479973-1.2853291-2.592-2.128-.5440027-.8426709-.816-1.8826605-.816-3.12 0-1.3653402.3786629-2.581328 1.136-3.648.7573371-1.066672 1.8186598-1.903997 3.184-2.512 1.3653402-.60800304 2.943991-.912 4.736-.912 1.600008 0 3.1413259.23466432 4.624.704 1.4826741.46933568 2.661329 1.0986627 3.536 1.888l-1.6 3.552c-2.0693437-1.5146742-4.2453219-2.272-6.528-2.272-1.3013398 0-2.3253296.2506642-3.072.752-.7466704.5013358-1.12 1.189329-1.12 2.064 0 .5120026.1439986.9333317.432 1.264.2880014.3306683.7679966.6239987 1.44.88.6720034.2560013 1.6266605.5226653 2.864.8 2.9013478.6400032 4.9866603 1.4613283 6.256 2.464 1.2693397 1.0026717 1.904 2.3893245 1.904 4.16 0 2.133344-.8213251 3.8133272-2.464 5.04-1.6426749 1.2266728-3.9359853 1.84-6.88 1.84zm20.928-3.584c.4906691 0 1.002664-.0319997 1.536-.096l-.256 3.52c-.6186698.0853338-1.2373302.128-1.856.128-2.3893453 0-4.1333278-.5226614-5.232-1.568-1.0986722-1.0453386-1.648-2.634656-1.648-4.768v-6.016h-2.976v-3.616h2.976v-4.608h4.832v4.608h3.936v3.616h-3.936v5.984c0 1.8773427.8746579 2.816 2.624 2.816zm11.232 3.552c-1.6640083 0-3.125327-.3359966-4.384-1.008-1.258673-.6720034-2.2293299-1.6213272-2.912-2.848-.6826701-1.2266728-1.024-2.6719917-1.024-4.336 0-1.6640083.3413299-3.1093272 1.024-4.336.6826701-1.2266728 1.653327-2.1706634 2.912-2.832 1.258673-.6613366 2.7199917-.992 4.384-.992 1.6640083 0 3.125327.3306634 4.384.992 1.258673.6613366 2.2293299 1.6053272 2.912 2.832.6826701 1.2266728 1.024 2.6719917 1.024 4.336 0 1.6640083-.3413299 3.1093272-1.024 4.336-.6826701 1.2266728-1.653327 2.1759966-2.912 2.848-1.258673.6720034-2.7199917 1.008-4.384 1.008zm0-3.68c2.3466784 0 3.52-1.503985 3.52-4.512 0-1.5146742-.303997-2.6453296-.912-3.392-.608003-.7466704-1.4773277-1.12-2.608-1.12-2.3466784 0-3.52 1.503985-3.52 4.512 0 3.008015 1.1733216 4.512 3.52 4.512zm21.696-8.704l-2.72.288c-1.344007.1280006-2.293331.5066635-2.848 1.136-.554669.6293365-.832 1.4666614-.832 2.512v8.192h-4.832V15.663h4.64v2.656c.789337-1.8133424 2.421321-2.8053325 4.896-2.976l1.408-.096.288 4zm14.04-3.552h4.736l-9.472 21.44h-4.896l3.008-6.624-6.464-14.816h5.024l3.968 9.984 4.096-9.984zm15.936-.416c1.36534 0 2.570661.3306634 3.616.992 1.045339.6613366 1.86133 1.6053272 2.448 2.832.58667 1.2266728.88 2.6506586.88 4.272 0 1.6213414-.29333 3.0559938-.88 4.304-.58667 1.2480062-1.407995 2.2186632-2.464 2.912-1.056005.6933368-2.255993 1.04-3.6 1.04-1.088005 0-2.069329-.229331-2.944-.688-.874671-.458669-1.546664-1.0933293-2.016-1.904v2.336h-4.768V8.815h4.832v8.96c.469336-.7893373 1.135996-1.4026645 2-1.84.864004-.4373355 1.829328-.656 2.896-.656zm-1.408 12.672c1.130672 0 2.00533-.399996 2.624-1.2.61867-.800004.928-1.9253261.928-3.376 0-1.4293405-.30933-2.5226629-.928-3.28s-1.493328-1.136-2.624-1.136c-1.130672 0-2.00533.3893294-2.624 1.168-.61867.7786706-.928 1.8826595-.928 3.312 0 1.4506739.30933 2.5653294.928 3.344.61867.7786706 1.493328 1.168 2.624 1.168zm18.848 3.68c-1.664008 0-3.125327-.3359966-4.384-1.008-1.258673-.6720034-2.22933-1.6213272-2.912-2.848-.68267-1.2266728-1.024-2.6719917-1.024-4.336 0-1.6640083.34133-3.1093272 1.024-4.336.68267-1.2266728 1.653327-2.1706634 2.912-2.832 1.258673-.6613366 2.719992-.992 4.384-.992 1.664008 0 3.125327.3306634 4.384.992 1.258673.6613366 2.22933 1.6053272 2.912 2.832.68267 1.2266728 1.024 2.6719917 1.024 4.336 0 1.6640083-.34133 3.1093272-1.024 4.336-.68267 1.2266728-1.653327 2.1759966-2.912 2.848-1.258673.6720034-2.719992 1.008-4.384 1.008zm0-3.68c2.346678 0 3.52-1.503985 3.52-4.512 0-1.5146742-.303997-2.6453296-.912-3.392-.608003-.7466704-1.477328-1.12-2.608-1.12-2.346678 0-3.52 1.503985-3.52 4.512 0 3.008015 1.173322 4.512 3.52 4.512zm18.016 3.68c-1.664008 0-3.125327-.3359966-4.384-1.008-1.258673-.6720034-2.22933-1.6213272-2.912-2.848-.68267-1.2266728-1.024-2.6719917-1.024-4.336 0-1.6640083.34133-3.1093272 1.024-4.336.68267-1.2266728 1.653327-2.1706634 2.912-2.832 1.258673-.6613366 2.719992-.992 4.384-.992 1.664008 0 3.125327.3306634 4.384.992 1.258673.6613366 2.22933 1.6053272 2.912 2.832.68267 1.2266728 1.024 2.6719917 1.024 4.336 0 1.6640083-.34133 3.1093272-1.024 4.336-.68267 1.2266728-1.653327 2.1759966-2.912 2.848-1.258673.6720034-2.719992 1.008-4.384 1.008zm0-3.68c2.346678 0 3.52-1.503985 3.52-4.512 0-1.5146742-.303997-2.6453296-.912-3.392-.608003-.7466704-1.477328-1.12-2.608-1.12-2.346678 0-3.52 1.503985-3.52 4.512 0 3.008015 1.173322 4.512 3.52 4.512zM200 31.375h-5.92l-6.016-7.008v7.008h-4.832V8.815h4.832v13.568l5.792-6.688h5.76l-6.592 7.488L200 31.375z" fill="#333"/><mask id="b" fill="#fff"><use xlink:href="#a"/></mask><use fill="#FF4785" fill-rule="nonzero" xlink:href="#a"/><path d="M23.7074082 4.91663721l.1918233-4.61361355L27.7558963 0l.1661482 4.75786009c.0057823.1655845-.1237629.30450476-.2893474.3102871-.0709012.00247592-.1403856-.02025507-.1961149-.06415663l-1.4872539-1.17160554L24.1884561 5.168114c-.1320039.10013302-.3201881.07429656-.4203211-.05770737-.0421511-.0555671-.0636242-.12408429-.0607268-.19376942zM18.7751036 15.0765471c0 .7824336 5.2703662.4074336 5.9778665-.1421721 0-5.32818604-2.8589797-8.12806396-8.094254-8.12806396-5.2352744 0-8.16851322 2.84344015-8.16851322 7.10860256 0 7.4284913 10.02499342 7.5706634 10.02499342 11.6225677 0 1.1373767-.556944 1.8126941-1.782221 1.8126941-1.596573 0-2.2277763-.8153808-2.1535171-3.5877364 0-.6014263-6.08925532-.7889263-6.27490335 0-.47273546 6.7184043 3.71296055 8.65625 8.50267965 8.65625 4.6412007 0 8.279902-2.4738731 8.279902-6.9522937 0-7.9616366-10.1735119-7.7483785-10.1735119-11.6936537 0-1.599436 1.1881474-1.8126941 1.8936099-1.8126941.7425921 0 2.0792579.1308859 1.9678691 3.1164996z" fill="#FFF" fill-rule="nonzero" mask="url(#b)"/></g></svg>
\ No newline at end of file
diff --git a/docs/yarn.lock b/docs/yarn.lock
index bfb98ed3189..3820398bf45 100644
--- a/docs/yarn.lock
+++ b/docs/yarn.lock
@@ -971,6 +971,13 @@
   dependencies:
     regenerator-runtime "^0.12.0"
 
+"@babel/runtime@^7.3.1":
+  version "7.3.4"
+  resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.3.4.tgz#73d12ba819e365fcf7fd152aed56d6df97d21c83"
+  integrity sha512-IvfvnMdSaLBateu0jfsYIpZTxAc2cKEXEMiezGGN75QcBcecDUKd3PgLAncT0oOgxKy8dd8hrJKj9MfzgfZd6g==
+  dependencies:
+    regenerator-runtime "^0.12.0"
+
 "@babel/template@^7.1.0", "@babel/template@^7.1.2":
   version "7.1.2"
   resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.1.2.tgz#090484a574fef5a2d2d7726a674eceda5c5b5644"
@@ -1063,7 +1070,7 @@
   resolved "https://registry.yarnpkg.com/@emotion/hash/-/hash-0.7.1.tgz#9833722341379fb7d67f06a4b00ab3c37913da53"
   integrity sha512-OYpa/Sg+2GDX+jibUfpZVn1YqSVRpYmTLF2eyAfrFTIJSbwyIrc+YscayoykvaOME/wV4BV0Sa0yqdMrgse6mA==
 
-"@emotion/is-prop-valid@0.7.3":
+"@emotion/is-prop-valid@0.7.3", "@emotion/is-prop-valid@^0.7.3":
   version "0.7.3"
   resolved "https://registry.yarnpkg.com/@emotion/is-prop-valid/-/is-prop-valid-0.7.3.tgz#a6bf4fa5387cbba59d44e698a4680f481a8da6cc"
   integrity sha512-uxJqm/sqwXw3YPA5GXX365OBcJGFtxUVkB6WyezqFHlNe9jqUWH5ur2O2M8dGBz61kn1g3ZBlzUunFQXQIClhA==
@@ -1125,7 +1132,7 @@
   resolved "https://registry.yarnpkg.com/@emotion/stylis/-/stylis-0.8.3.tgz#3ca7e9bcb31b3cb4afbaeb66156d86ee85e23246"
   integrity sha512-M3nMfJ6ndJMYloSIbYEBq6G3eqoYD41BpDOxreE8j0cb4fzz/5qvmqU9Mb2hzsXcCnIlGlWhS03PCzVGvTAe0Q==
 
-"@emotion/unitless@0.7.3":
+"@emotion/unitless@0.7.3", "@emotion/unitless@^0.7.0":
   version "0.7.3"
   resolved "https://registry.yarnpkg.com/@emotion/unitless/-/unitless-0.7.3.tgz#6310a047f12d21a1036fb031317219892440416f"
   integrity sha512-4zAPlpDEh2VwXswwr/t8xGNDGg8RQiPxtxZ3qQEXyQsBV39ptTdESCjuBvGze1nLMVrxmTIKmnO/nAV8Tqjjzg==
@@ -2839,6 +2846,16 @@ babel-plugin-react-docgen@^2.0.2:
     react-docgen "^3.0.0"
     recast "^0.14.7"
 
+"babel-plugin-styled-components@>= 1":
+  version "1.10.0"
+  resolved "https://registry.yarnpkg.com/babel-plugin-styled-components/-/babel-plugin-styled-components-1.10.0.tgz#ff1f42ad2cc78c21f26b62266b8f564dbc862939"
+  integrity sha512-sQVKG8irFXx14ZfaK1bBePirfkacl3j8nZwSZK+ZjsbnadRHKQTbhXbe/RB1vT6Vgkz45E+V95LBq4KqdhZUNw==
+  dependencies:
+    "@babel/helper-annotate-as-pure" "^7.0.0"
+    "@babel/helper-module-imports" "^7.0.0"
+    babel-plugin-syntax-jsx "^6.18.0"
+    lodash "^4.17.10"
+
 babel-plugin-syntax-async-functions@^6.8.0:
   version "6.13.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-syntax-async-functions/-/babel-plugin-syntax-async-functions-6.13.0.tgz#cad9cad1191b5ad634bf30ae0872391e0647be95"
@@ -4296,6 +4313,11 @@ camelcase@^5.0.0:
   resolved "https://registry.yarnpkg.com/camelcase/-/camelcase-5.0.0.tgz#03295527d58bd3cd4aa75363f35b2e8d97be2f42"
   integrity sha512-faqwZqnWxbxn+F1d399ygeamQNy3lPp/H9H6rNrqYh4FSVCtcY+3cub1MxA8o9mDd55mM8Aghuu/kuyYA6VTsA==
 
+camelize@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/camelize/-/camelize-1.0.0.tgz#164a5483e630fa4321e5af07020e531831b2609b"
+  integrity sha1-FkpUg+Yw+kMh5a8HAg5TGDGyYJs=
+
 caniuse-api@^1.5.2, caniuse-api@^1.5.3:
   version "1.6.1"
   resolved "https://registry.yarnpkg.com/caniuse-api/-/caniuse-api-1.6.1.tgz#b534e7c734c4f81ec5fbe8aca2ad24354b962c6c"
@@ -5255,6 +5277,11 @@ css-color-function@^1.2.0:
     debug "^3.1.0"
     rgb "~0.1.0"
 
+css-color-keywords@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/css-color-keywords/-/css-color-keywords-1.0.0.tgz#fea2616dc676b2962686b3af8dbdbe180b244e05"
+  integrity sha1-/qJhbcZ2spYmhrOvjb2+GAskTgU=
+
 css-color-names@0.0.4:
   version "0.0.4"
   resolved "https://registry.yarnpkg.com/css-color-names/-/css-color-names-0.0.4.tgz#808adc2e79cf84738069b646cb20ec27beb629e0"
@@ -5341,6 +5368,15 @@ css-selector-tokenizer@^0.7.0:
     fastparse "^1.1.1"
     regexpu-core "^1.0.0"
 
+css-to-react-native@^2.2.2:
+  version "2.3.0"
+  resolved "https://registry.yarnpkg.com/css-to-react-native/-/css-to-react-native-2.3.0.tgz#bf80d24ec4a08e430306ef429c0586e6ed5485f7"
+  integrity sha512-IhR7bNIrCFwbJbKZOAjNDZdwpsbjTN6f1agXeELHDqg1wHPA8c2QLruttKOW7hgMGetkfraRJCIEMrptifBfVw==
+  dependencies:
+    camelize "^1.0.0"
+    css-color-keywords "^1.0.0"
+    postcss-value-parser "^3.3.0"
+
 css-tree@1.0.0-alpha.28:
   version "1.0.0-alpha.28"
   resolved "https://registry.yarnpkg.com/css-tree/-/css-tree-1.0.0-alpha.28.tgz#8e8968190d886c9477bc8d61e96f61af3f7ffa7f"
@@ -8529,6 +8565,13 @@ hoist-non-react-statics@^2.3.1, hoist-non-react-statics@^2.5.0:
   resolved "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-2.5.5.tgz#c5903cf409c0dfd908f388e619d86b9c1174cb47"
   integrity sha512-rqcy4pJo55FTTLWt+bU8ukscqHeE/e9KWvsOW2b/a3afxQZhwkQdT1rPPCJ0rYXdj4vNcasY8zHTH+jF/qStxw==
 
+hoist-non-react-statics@^3.0.0:
+  version "3.3.0"
+  resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-3.3.0.tgz#b09178f0122184fb95acf525daaecb4d8f45958b"
+  integrity sha512-0XsbTXxgiaCDYDIWFcwkmerZPSwywfUqYmwT4jzewKTQSWoE6FCMoUVOeBJWK3E/CrWbxRG3m5GzY4lnIwGRBA==
+  dependencies:
+    react-is "^16.7.0"
+
 home-or-tmp@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/home-or-tmp/-/home-or-tmp-2.0.0.tgz#e36c3f2d2cae7d746a857e38d18d5f32a7882db8"
@@ -10731,6 +10774,11 @@ mem@^1.1.0:
   dependencies:
     mimic-fn "^1.0.0"
 
+memoize-one@^4.0.0:
+  version "4.1.0"
+  resolved "https://registry.yarnpkg.com/memoize-one/-/memoize-one-4.1.0.tgz#a2387c58c03fff27ca390c31b764a79addf3f906"
+  integrity sha512-2GApq0yI/b22J2j9rhbrAlsHb0Qcz+7yWxeLG8h+95sl1XPUgeLimQSOdur4Vw7cUhrBHwaUZxWFZueojqNRzA==
+
 memoizerific@^1.11.3:
   version "1.11.3"
   resolved "https://registry.yarnpkg.com/memoizerific/-/memoizerific-1.11.3.tgz#7c87a4646444c32d75438570905f2dbd1b1a805a"
@@ -11025,6 +11073,26 @@ mkdirp@0.5.1, mkdirp@^0.5.0, mkdirp@^0.5.1, mkdirp@~0.5.0, mkdirp@~0.5.1:
   dependencies:
     minimist "0.0.8"
 
+mobx-react-form@^1.39.1:
+  version "1.39.1"
+  resolved "https://registry.yarnpkg.com/mobx-react-form/-/mobx-react-form-1.39.1.tgz#90476ef6ab6e2499cf34b12f523add55ead5677a"
+  integrity sha512-OKWXUr6+GCmIKgRvUN/GvOp85IYY9nTv6RaTO10dsttpm1YxRzCn32w/O50TEmUlN1OEWjGjg99CY1RVAdCn3Q==
+  dependencies:
+    lodash "^4.17.11"
+
+mobx-react@^5.4.3:
+  version "5.4.3"
+  resolved "https://registry.yarnpkg.com/mobx-react/-/mobx-react-5.4.3.tgz#6709b7dd89670c40e9815914ac2ca49cc02bfb47"
+  integrity sha512-WC8yFlwvJ91hy8j6CrydAuFteUafcuvdITFQeHl3LRIf5ayfT/4W3M/byhEYD2BcJWejeXr8y4Rh2H26RunCRQ==
+  dependencies:
+    hoist-non-react-statics "^3.0.0"
+    react-lifecycles-compat "^3.0.2"
+
+mobx@^5.9.0:
+  version "5.9.0"
+  resolved "https://registry.yarnpkg.com/mobx/-/mobx-5.9.0.tgz#a08edd7132787f771409c9c33788a5df66ff7ce7"
+  integrity sha512-D3mY1uM3H9BP5duk5tTanrOq92yqetYKsprPJWvkKDrbs+fro59xrpWX+vtr10YoLgJIFz+a4A8lI+4YtqmCUQ==
+
 moment@2.x.x, moment@^2.16.0:
   version "2.22.2"
   resolved "https://registry.yarnpkg.com/moment/-/moment-2.22.2.tgz#3c257f9839fc0e93ff53149632239eb90783ff66"
@@ -12282,6 +12350,13 @@ polished@^2.3.3:
   dependencies:
     "@babel/runtime" "^7.2.0"
 
+polished@^3.0.3:
+  version "3.0.3"
+  resolved "https://registry.yarnpkg.com/polished/-/polished-3.0.3.tgz#b7d9604936f6dc40031306f3a1136585fc3471b5"
+  integrity sha512-WFgVHAWJubobUzk5B5dcqS2jGw8hB/I/H5hXitR4jd/bvEZBQV4vlw5UGDhLxkLQ1incf9NMFztI4XAryHvJDA==
+  dependencies:
+    "@babel/runtime" "^7.3.1"
+
 popper.js@^1.14.4:
   version "1.14.6"
   resolved "https://registry.yarnpkg.com/popper.js/-/popper.js-1.14.6.tgz#ab20dd4edf9288b8b3b6531c47c361107b60b4b0"
@@ -13446,7 +13521,7 @@ react-document-title@^2.0.3:
     prop-types "^15.5.6"
     react-side-effect "^1.0.2"
 
-react-dom@^15.6.0, react-dom@^15.6.2:
+react-dom@^15.6.0:
   version "15.6.2"
   resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-15.6.2.tgz#41cfadf693b757faf2708443a1d1fd5a02bef730"
   integrity sha1-Qc+t9pO3V/rycIRDodH9WgK+9zA=
@@ -13466,6 +13541,16 @@ react-dom@^16.8.1:
     prop-types "^15.6.2"
     scheduler "^0.13.2"
 
+react-dom@^16.8.3:
+  version "16.8.3"
+  resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-16.8.3.tgz#ae236029e66210783ac81999d3015dfc475b9c32"
+  integrity sha512-ttMem9yJL4/lpItZAQ2NTFAbV7frotHk5DZEHXUOws2rMmrsvh1Na7ThGT0dTzUIl6pqTOi5tYREfL8AEna3lA==
+  dependencies:
+    loose-envify "^1.1.0"
+    object-assign "^4.1.1"
+    prop-types "^15.6.2"
+    scheduler "^0.13.3"
+
 react-draggable@^3.1.1:
   version "3.1.1"
   resolved "https://registry.yarnpkg.com/react-draggable/-/react-draggable-3.1.1.tgz#ed1db43e09b146805f6d158296e58eae4f768d36"
@@ -13554,11 +13639,21 @@ react-inspector@^2.3.1:
     is-dom "^1.0.9"
     prop-types "^15.6.1"
 
+react-is@^16.6.0, react-is@^16.7.0:
+  version "16.8.3"
+  resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.8.3.tgz#4ad8b029c2a718fc0cfc746c8d4e1b7221e5387d"
+  integrity sha512-Y4rC1ZJmsxxkkPuMLwvKvlL1Zfpbcu+Bf4ZigkHup3v9EfdYhAlWAaVyA19olXq2o2mGn0w+dFKvk3pVVlYcIA==
+
 react-is@^16.8.1:
   version "16.8.1"
   resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.8.1.tgz#a80141e246eb894824fb4f2901c0c50ef31d4cdb"
   integrity sha512-ioMCzVDWvCvKD8eeT+iukyWrBGrA3DiFYkXfBsVYIRdaREZuBjENG+KjrikavCLasozqRWTwFUagU/O4vPpRMA==
 
+react-lazyload@^2.5.0:
+  version "2.5.0"
+  resolved "https://registry.yarnpkg.com/react-lazyload/-/react-lazyload-2.5.0.tgz#7ed20bf0408dc684c10e808060e51d904cc0ab8d"
+  integrity sha512-RkEwpJDqEUVkXodxBXAI/UDyGYUBTZCU9kdG0Lwmg8BIv8zDvP+exFwUzc7wP4HX6n33CCsz+cjG2FpwdRoxpw==
+
 react-lifecycles-compat@^3.0.0, react-lifecycles-compat@^3.0.2, react-lifecycles-compat@^3.0.4:
   version "3.0.4"
   resolved "https://registry.yarnpkg.com/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz#4f1a273afdfc8f3488a8c516bfda78f872352362"
@@ -13699,7 +13794,7 @@ react-transition-group@^1.2.0:
     prop-types "^15.5.6"
     warning "^3.0.0"
 
-react@^15.6.0, react@^15.6.2:
+react@^15.6.0:
   version "15.6.2"
   resolved "https://registry.yarnpkg.com/react/-/react-15.6.2.tgz#dba0434ab439cfe82f108f0f511663908179aa72"
   integrity sha1-26BDSrQ5z+gvEI8PURZjkIF5qnI=
@@ -13720,6 +13815,16 @@ react@^16.8.1:
     prop-types "^15.6.2"
     scheduler "^0.13.2"
 
+react@^16.8.3:
+  version "16.8.3"
+  resolved "https://registry.yarnpkg.com/react/-/react-16.8.3.tgz#c6f988a2ce895375de216edcfaedd6b9a76451d9"
+  integrity sha512-3UoSIsEq8yTJuSu0luO1QQWYbgGEILm+eJl2QN/VLDi7hL+EN18M3q3oVZwmVzzBJ3DkM7RMdRwBmZZ+b4IzSA==
+  dependencies:
+    loose-envify "^1.1.0"
+    object-assign "^4.1.1"
+    prop-types "^15.6.2"
+    scheduler "^0.13.3"
+
 reactjs-popup@^1.3.2:
   version "1.3.2"
   resolved "https://registry.yarnpkg.com/reactjs-popup/-/reactjs-popup-1.3.2.tgz#7f7861443fc5edfb0184da1d01838dbd5db690cd"
@@ -14679,6 +14784,14 @@ scheduler@^0.13.2:
     loose-envify "^1.1.0"
     object-assign "^4.1.1"
 
+scheduler@^0.13.3:
+  version "0.13.3"
+  resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.13.3.tgz#bed3c5850f62ea9c716a4d781f9daeb9b2a58896"
+  integrity sha512-UxN5QRYWtpR1egNWzJcVLk8jlegxAugswQc984lD3kU7NuobsO37/sRfbpTdBjtnD5TBNFA2Q2oLV5+UmPSmEQ==
+  dependencies:
+    loose-envify "^1.1.0"
+    object-assign "^4.1.1"
+
 schema-utils@^0.3.0:
   version "0.3.0"
   resolved "https://registry.yarnpkg.com/schema-utils/-/schema-utils-0.3.0.tgz#f5877222ce3e931edae039f17eb3716e7137f8cf"
@@ -15964,6 +16077,33 @@ style-loader@^0.23.1:
     loader-utils "^1.1.0"
     schema-utils "^1.0.0"
 
+styled-components@^4.1.3:
+  version "4.1.3"
+  resolved "https://registry.yarnpkg.com/styled-components/-/styled-components-4.1.3.tgz#4472447208e618b57e84deaaeb6acd34a5e0fe9b"
+  integrity sha512-0quV4KnSfvq5iMtT0RzpMGl/Dg3XIxIxOl9eJpiqiq4SrAmR1l1DLzNpMzoy3DyzdXVDMJS2HzROnXscWA3SEw==
+  dependencies:
+    "@babel/helper-module-imports" "^7.0.0"
+    "@emotion/is-prop-valid" "^0.7.3"
+    "@emotion/unitless" "^0.7.0"
+    babel-plugin-styled-components ">= 1"
+    css-to-react-native "^2.2.2"
+    memoize-one "^4.0.0"
+    prop-types "^15.5.4"
+    react-is "^16.6.0"
+    stylis "^3.5.0"
+    stylis-rule-sheet "^0.0.10"
+    supports-color "^5.5.0"
+
+stylis-rule-sheet@^0.0.10:
+  version "0.0.10"
+  resolved "https://registry.yarnpkg.com/stylis-rule-sheet/-/stylis-rule-sheet-0.0.10.tgz#44e64a2b076643f4b52e5ff71efc04d8c3c4a430"
+  integrity sha512-nTbZoaqoBnmK+ptANthb10ZRZOGC+EmTLLUxeYIuHNkEKcmKgXX1XWKkUBT2Ac4es3NybooPe0SmvKdhKJZAuw==
+
+stylis@^3.5.0:
+  version "3.5.4"
+  resolved "https://registry.yarnpkg.com/stylis/-/stylis-3.5.4.tgz#f665f25f5e299cf3d64654ab949a57c768b73fbe"
+  integrity sha512-8/3pSmthWM7lsPBKv7NXkzn2Uc9W7NotcwGNpJaa3k7WMM1XDCA4MgT5k/8BIexd5ydZdboXtU90XH9Ec4Bv/Q==
+
 sum-up@^1.0.1:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/sum-up/-/sum-up-1.0.3.tgz#1c661f667057f63bcb7875aa1438bc162525156e"
@@ -17019,6 +17159,11 @@ validate-npm-package-license@^3.0.1:
     spdx-correct "^3.0.0"
     spdx-expression-parse "^3.0.0"
 
+validatorjs@^3.15.1:
+  version "3.15.1"
+  resolved "https://registry.yarnpkg.com/validatorjs/-/validatorjs-3.15.1.tgz#e674b6330c1432913a81128cdb7ff679463d4d2d"
+  integrity sha512-9hJWC4sYaEjf3a6MPKrERzRU69btS/pDy+t5IX8pRFqkI8UI2qj8nR3n2XlVzxRZMQGrf6HrtfDkoRcJavkLlg==
+
 value-equal@^0.4.0:
   version "0.4.0"
   resolved "https://registry.yarnpkg.com/value-equal/-/value-equal-0.4.0.tgz#c5bdd2f54ee093c04839d71ce2e4758a6890abc7"

From ab8aaca15daa3c395cf9e60254b6b2979ececfb8 Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Tue, 5 Mar 2019 16:32:32 +0100
Subject: [PATCH 160/249] IMPROVE documentation on theming (REMOVE the advanced
 section) & ADD quiet to static standalone command

---
 .../standalone-options/index.md               |  1 +
 .../src/pages/configurations/theming/index.md | 94 -------------------
 2 files changed, 1 insertion(+), 94 deletions(-)

diff --git a/docs/src/pages/configurations/standalone-options/index.md b/docs/src/pages/configurations/standalone-options/index.md
index 8f629824f48..ff5401c2290 100644
--- a/docs/src/pages/configurations/standalone-options/index.md
+++ b/docs/src/pages/configurations/standalone-options/index.md
@@ -78,6 +78,7 @@ staticDir <dir-names>   Directory where to load static files from, array of stri
 outputDir [dir-name]    Directory where to store built files
 configDir [dir-name]    Directory where to load Storybook configurations from
 watch                   Enable watch mode
+quiet                   Suppress verbose build output
 ```
 
 Example: 
diff --git a/docs/src/pages/configurations/theming/index.md b/docs/src/pages/configurations/theming/index.md
index 6cf7a6ee031..25bdde50360 100644
--- a/docs/src/pages/configurations/theming/index.md
+++ b/docs/src/pages/configurations/theming/index.md
@@ -161,97 +161,3 @@ const Component = styled.div`
   width: 0;
 `;
 ```
-
-### Advanced theming
-
-the `create` function creates an object like this:
-
-```js
-{
-  base: 'light' | 'dark',
-  color: {
-    primary
-    secondary
-    tertiary
-    ancillary
-
-    orange
-    gold
-    green
-    seafoam
-    purple
-    ultraviolet
-
-    lightest
-    lighter
-    light
-    mediumlight
-    medium
-    mediumdark
-    dark
-    darker
-    darkest
-
-    border
-
-    positive
-    negative
-    warning
-
-    defaultText
-    inverseText
-  },
-  background: {
-    app
-    content
-    hoverable
-
-    positive
-    negative
-    warning
-  },
-  typography: {
-    fonts: {
-      base
-      mono
-    }
-    weight: {
-      regular
-      bold
-      black
-    }
-    size: {
-      s1
-      s2
-      s3
-      m1
-      m2
-      m3
-      l1
-      l2
-      l3
-      code
-    }
-  }
-  input: {
-    border
-    background
-    color
-    borderRadius
-  },
-
-  layoutMargin
-  appBorderColor
-  appBorderRadius
-
-  barTextColor
-  barSelectedColor
-  barBg
-
-  brand
-}
-```
-
-All properties are required.
-
-Again the `@storybook/theming` package is built using TypeScript, so if you do create a theme like this, that should help.

From 63aad4da8c0fc7908022b7a7c46c344e821a655e Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Tue, 5 Mar 2019 18:09:41 +0100
Subject: [PATCH 161/249] FIX linting

---
 docs/package.json                             |  2 +
 docs/src/new-components/basics/Link.js        |  1 +
 .../new-components/basics/tooltip/Tooltip.js  |  1 +
 .../basics/tooltip/Tooltip.stories.js         |  1 -
 .../basics/tooltip/TooltipLinkList.stories.js |  2 -
 .../basics/tooltip/TooltipMessage.stories.js  |  1 -
 .../basics/tooltip/TooltipNote.stories.js     |  1 -
 .../basics/tooltip/WithTooltip.js             |  1 +
 .../basics/tooltip/WithTooltip.stories.js     |  1 -
 .../new-components/lib/StoryLinkWrapper.js    |  1 -
 docs/yarn.lock                                | 22 ++++-
 examples/official-storybook/webpack.config.js | 95 +++++++++----------
 12 files changed, 73 insertions(+), 56 deletions(-)

diff --git a/docs/package.json b/docs/package.json
index 7ea328ffd24..ce5356defdd 100644
--- a/docs/package.json
+++ b/docs/package.json
@@ -50,8 +50,10 @@
     "react-helmet": "^5.2.0",
     "react-lazyload": "^2.5.0",
     "react-modal": "^3.8.1",
+    "react-popper-tooltip": "^2.8.1",
     "react-router": "^4.3.1",
     "react-stack-grid": "^0.7.1",
+    "recompose": "^0.30.0",
     "sitemap": "^2.1.0",
     "snyk": "^1.134.2",
     "styled-components": "^4.1.3",
diff --git a/docs/src/new-components/basics/Link.js b/docs/src/new-components/basics/Link.js
index 6d6b324e291..cf598638578 100644
--- a/docs/src/new-components/basics/Link.js
+++ b/docs/src/new-components/basics/Link.js
@@ -1,3 +1,4 @@
+/* eslint-disable react/prop-types */
 import React, { Fragment } from 'react';
 import PropTypes from 'prop-types';
 import styled, { css } from 'styled-components';
diff --git a/docs/src/new-components/basics/tooltip/Tooltip.js b/docs/src/new-components/basics/tooltip/Tooltip.js
index 6feb964d458..f59ed592433 100644
--- a/docs/src/new-components/basics/tooltip/Tooltip.js
+++ b/docs/src/new-components/basics/tooltip/Tooltip.js
@@ -1,3 +1,4 @@
+/* eslint-disable react/prop-types */
 // Our wrapper around react-popper that does common stuff.
 
 import React from 'react';
diff --git a/docs/src/new-components/basics/tooltip/Tooltip.stories.js b/docs/src/new-components/basics/tooltip/Tooltip.stories.js
index 4ad8093b8c1..83750d37514 100644
--- a/docs/src/new-components/basics/tooltip/Tooltip.stories.js
+++ b/docs/src/new-components/basics/tooltip/Tooltip.stories.js
@@ -1,4 +1,3 @@
-/* eslint-disable import/no-extraneous-dependencies */
 import React from 'react';
 import { storiesOf } from '@storybook/react';
 import styled from 'styled-components';
diff --git a/docs/src/new-components/basics/tooltip/TooltipLinkList.stories.js b/docs/src/new-components/basics/tooltip/TooltipLinkList.stories.js
index 123c466715d..c848e50a0de 100644
--- a/docs/src/new-components/basics/tooltip/TooltipLinkList.stories.js
+++ b/docs/src/new-components/basics/tooltip/TooltipLinkList.stories.js
@@ -1,4 +1,3 @@
-/* eslint-disable import/no-extraneous-dependencies */
 import React from 'react';
 import { storiesOf } from '@storybook/react';
 import { action } from '@storybook/addon-actions';
@@ -7,7 +6,6 @@ import WithTooltip from './WithTooltip';
 import TooltipLinkList from './TooltipLinkList';
 import StoryLinkWrapper from '../../lib/StoryLinkWrapper';
 
-// eslint-disable-next-line import/prefer-default-export
 export const links = [
   { title: 'Link', href: 'http://google.com' },
   { title: 'Link', href: 'http://google.com' },
diff --git a/docs/src/new-components/basics/tooltip/TooltipMessage.stories.js b/docs/src/new-components/basics/tooltip/TooltipMessage.stories.js
index 0d2af744aa8..28a21b36b3a 100644
--- a/docs/src/new-components/basics/tooltip/TooltipMessage.stories.js
+++ b/docs/src/new-components/basics/tooltip/TooltipMessage.stories.js
@@ -1,4 +1,3 @@
-/* eslint-disable import/no-extraneous-dependencies */
 import React from 'react';
 import { storiesOf } from '@storybook/react';
 import WithTooltip from './WithTooltip';
diff --git a/docs/src/new-components/basics/tooltip/TooltipNote.stories.js b/docs/src/new-components/basics/tooltip/TooltipNote.stories.js
index 44fe7cc6d1a..990b43c1647 100644
--- a/docs/src/new-components/basics/tooltip/TooltipNote.stories.js
+++ b/docs/src/new-components/basics/tooltip/TooltipNote.stories.js
@@ -1,4 +1,3 @@
-/* eslint-disable import/no-extraneous-dependencies */
 import React from 'react';
 import { storiesOf } from '@storybook/react';
 import WithTooltip from './WithTooltip';
diff --git a/docs/src/new-components/basics/tooltip/WithTooltip.js b/docs/src/new-components/basics/tooltip/WithTooltip.js
index 1ad3dcb01fc..ddbef62ab42 100644
--- a/docs/src/new-components/basics/tooltip/WithTooltip.js
+++ b/docs/src/new-components/basics/tooltip/WithTooltip.js
@@ -1,3 +1,4 @@
+/* eslint-disable react/prop-types */
 import React from 'react';
 import PropTypes from 'prop-types';
 import styled from 'styled-components';
diff --git a/docs/src/new-components/basics/tooltip/WithTooltip.stories.js b/docs/src/new-components/basics/tooltip/WithTooltip.stories.js
index e714a1bc96b..8f5fa1089dd 100644
--- a/docs/src/new-components/basics/tooltip/WithTooltip.stories.js
+++ b/docs/src/new-components/basics/tooltip/WithTooltip.stories.js
@@ -1,4 +1,3 @@
-/* eslint-disable import/no-extraneous-dependencies */
 import React from 'react';
 import PropTypes from 'prop-types';
 import { storiesOf } from '@storybook/react';
diff --git a/docs/src/new-components/lib/StoryLinkWrapper.js b/docs/src/new-components/lib/StoryLinkWrapper.js
index 8d2d37aaef5..a43a69e9e9c 100644
--- a/docs/src/new-components/lib/StoryLinkWrapper.js
+++ b/docs/src/new-components/lib/StoryLinkWrapper.js
@@ -1,4 +1,3 @@
-/* eslint-disable import/no-extraneous-dependencies */
 // This is allows us to test whether the link works via the actions addon
 import React, { Children } from 'react';
 import PropTypes from 'prop-types';
diff --git a/docs/yarn.lock b/docs/yarn.lock
index 3820398bf45..a3c9e5f1b4d 100644
--- a/docs/yarn.lock
+++ b/docs/yarn.lock
@@ -971,7 +971,7 @@
   dependencies:
     regenerator-runtime "^0.12.0"
 
-"@babel/runtime@^7.3.1":
+"@babel/runtime@^7.3.1", "@babel/runtime@^7.3.4":
   version "7.3.4"
   resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.3.4.tgz#73d12ba819e365fcf7fd152aed56d6df97d21c83"
   integrity sha512-IvfvnMdSaLBateu0jfsYIpZTxAc2cKEXEMiezGGN75QcBcecDUKd3PgLAncT0oOgxKy8dd8hrJKj9MfzgfZd6g==
@@ -13677,6 +13677,14 @@ react-popper-tooltip@^2.8.0:
     "@babel/runtime" "^7.2.0"
     react-popper "^1.3.2"
 
+react-popper-tooltip@^2.8.1:
+  version "2.8.1"
+  resolved "https://registry.yarnpkg.com/react-popper-tooltip/-/react-popper-tooltip-2.8.1.tgz#bbaec88b729e3b7e9f26521857e7f908bccdecf3"
+  integrity sha512-eL0PT5yz9H9lkG934TMh7czZWwDlqFady7CcJKMP5RcmBxTFBY4U7k71FEyxNaHd07nhMhUwbk0/Fgf2yw3LEg==
+  dependencies:
+    "@babel/runtime" "^7.3.4"
+    react-popper "^1.3.3"
+
 react-popper@^1.3.2:
   version "1.3.2"
   resolved "https://registry.yarnpkg.com/react-popper/-/react-popper-1.3.2.tgz#e723a0a7fe1c42099a13e5d494e9d7d74b352af4"
@@ -13689,6 +13697,18 @@ react-popper@^1.3.2:
     typed-styles "^0.0.7"
     warning "^4.0.2"
 
+react-popper@^1.3.3:
+  version "1.3.3"
+  resolved "https://registry.yarnpkg.com/react-popper/-/react-popper-1.3.3.tgz#2c6cef7515a991256b4f0536cd4bdcb58a7b6af6"
+  integrity sha512-ynMZBPkXONPc5K4P5yFWgZx5JGAUIP3pGGLNs58cfAPgK67olx7fmLp+AdpZ0+GoQ+ieFDa/z4cdV6u7sioH6w==
+  dependencies:
+    "@babel/runtime" "^7.1.2"
+    create-react-context "<=0.2.2"
+    popper.js "^1.14.4"
+    prop-types "^15.6.1"
+    typed-styles "^0.0.7"
+    warning "^4.0.2"
+
 react-proxy@^3.0.0-alpha.0:
   version "3.0.0-alpha.1"
   resolved "https://registry.yarnpkg.com/react-proxy/-/react-proxy-3.0.0-alpha.1.tgz#4400426bcfa80caa6724c7755695315209fa4b07"
diff --git a/examples/official-storybook/webpack.config.js b/examples/official-storybook/webpack.config.js
index 9fa766e9f1b..fe957caf62c 100644
--- a/examples/official-storybook/webpack.config.js
+++ b/examples/official-storybook/webpack.config.js
@@ -1,52 +1,51 @@
 const path = require('path');
 const { DefinePlugin, ContextReplacementPlugin } = require('webpack');
 
-module.exports = async ({ config }) =>
-  console.dir(config.plugins, { depth: null }) || {
-    ...config,
-    module: {
-      ...config.module,
-      rules: [
-        ...config.module.rules,
-        {
-          test: /\.stories\.jsx?$/,
-          use: require.resolve('@storybook/addon-storysource/loader'),
-          include: [
-            path.resolve(__dirname, './stories'),
-            path.resolve(__dirname, '../../lib/ui/src'),
-            path.resolve(__dirname, '../../lib/components/src'),
-          ],
-          enforce: 'pre',
-        },
-        {
-          test: /\.js/,
-          use: config.module.rules[0].use,
-          include: [
-            path.resolve(__dirname, '../../lib/ui/src'),
-            path.resolve(__dirname, '../../lib/components/src'),
-          ],
-        },
-        {
-          test: /\.tsx?$/,
-          use: [
-            {
-              loader: require.resolve('ts-loader'),
-            },
-          ],
-        },
-      ],
-    },
-    plugins: [
-      ...config.plugins,
-      // graphql sources check process variable
-      new DefinePlugin({
-        process: JSON.stringify(true),
-      }),
-      // See https://github.com/graphql/graphql-language-service/issues/111#issuecomment-306723400
-      new ContextReplacementPlugin(/graphql-language-service-interface[/\\]dist/, /\.js$/),
+module.exports = async ({ config }) => ({
+  ...config,
+  module: {
+    ...config.module,
+    rules: [
+      ...config.module.rules,
+      {
+        test: /\.stories\.jsx?$/,
+        use: require.resolve('@storybook/addon-storysource/loader'),
+        include: [
+          path.resolve(__dirname, './stories'),
+          path.resolve(__dirname, '../../lib/ui/src'),
+          path.resolve(__dirname, '../../lib/components/src'),
+        ],
+        enforce: 'pre',
+      },
+      {
+        test: /\.js/,
+        use: config.module.rules[0].use,
+        include: [
+          path.resolve(__dirname, '../../lib/ui/src'),
+          path.resolve(__dirname, '../../lib/components/src'),
+        ],
+      },
+      {
+        test: /\.tsx?$/,
+        use: [
+          {
+            loader: require.resolve('ts-loader'),
+          },
+        ],
+      },
     ],
-    resolve: {
-      ...config.resolve,
-      extensions: [...(config.resolve.extensions || []), '.ts', '.tsx'],
-    },
-  };
+  },
+  plugins: [
+    ...config.plugins,
+    // graphql sources check process variable
+    new DefinePlugin({
+      process: JSON.stringify(true),
+    }),
+    // See https://github.com/graphql/graphql-language-service/issues/111#issuecomment-306723400
+    new ContextReplacementPlugin(/graphql-language-service-interface[/\\]dist/, /\.js$/),
+  ],
+  resolve: {
+    ...config.resolve,
+    extensions: [...(config.resolve.extensions || []), '.ts', '.tsx'],
+  },
+});

From ca7307c867465a1f24603dd716c59209478db268 Mon Sep 17 00:00:00 2001
From: Matt Wood <m.wood0904@gmail.com>
Date: Tue, 5 Mar 2019 13:29:50 -0600
Subject: [PATCH 162/249] Fix imported package for "dark" theme

---
 docs/src/pages/configurations/theming/index.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/docs/src/pages/configurations/theming/index.md b/docs/src/pages/configurations/theming/index.md
index 81e73015771..9f3ca42e8aa 100644
--- a/docs/src/pages/configurations/theming/index.md
+++ b/docs/src/pages/configurations/theming/index.md
@@ -33,7 +33,7 @@ You can get these themes like so:
 
 ```js
 import { addParameters, configure } from '@storybook/react';
-import { themes } from '@storybook/components';
+import { themes } from '@storybook/theming';
 
 // Option defaults.
 addParameters({

From 25e416aaf2aa44c80f720f4e507d537f518677ca Mon Sep 17 00:00:00 2001
From: Emily Mentrek <worshipoldgods@gmail.com>
Date: Tue, 5 Mar 2019 17:57:33 -0500
Subject: [PATCH 163/249] Spelling correction so the markup heading link for
 Configuration works properly

---
 MIGRATION.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/MIGRATION.md b/MIGRATION.md
index 36f4d4e7af1..79917cbbccf 100644
--- a/MIGRATION.md
+++ b/MIGRATION.md
@@ -53,7 +53,7 @@
 
 Storybook 5.0 includes sweeping UI changes as well as changes to the addon API and custom webpack configuration. We've tried to keep backwards compatibility in most cases, but there are some notable exceptions documented below.
 
-## Webpack config simplifcation
+## Webpack config simplification
 
 The API for custom webpack configuration has been simplifed in 5.0, but it's a breaking change.
 

From 7619232291ad62eae117708760ef5db5d1f85951 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Wed, 6 Mar 2019 10:29:17 +0800
Subject: [PATCH 164/249] 5.1.0-alpha.0 changelog

---
 CHANGELOG.md | 50 ++++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 50 insertions(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 788d8e0e5d8..bd41469f381 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,53 @@
+## 5.1.0-alpha.0 (March 6, 2019)
+
+### Features
+
+* UI: Custom scrollbars ([#5714](https://github.com/storybooks/storybook/pull/5714))
+
+### Bug Fixes
+
+* Fix: Move `react-select` dependency to 2.2 ([#5867](https://github.com/storybooks/storybook/pull/5867))
+
+### Maintenance
+
+* Cleanup unused dependencies ([#5453](https://github.com/storybooks/storybook/pull/5453))
+* Add directory attribute to repositories in package.json files ([#5643](https://github.com/storybooks/storybook/pull/5643))
+
+### Dependency Upgrades
+
+* Project-wide dependency upgrades ([#5740](https://github.com/storybooks/storybook/pull/5740))
+* Bump react-is from 16.8.1 to 16.8.3 ([#5743](https://github.com/storybooks/storybook/pull/5743))
+* Bump danger from 7.0.13 to 7.0.14 ([#5744](https://github.com/storybooks/storybook/pull/5744))
+* Bump babel-plugin-named-asset-import from 0.3.0 to 0.3.1 ([#5745](https://github.com/storybooks/storybook/pull/5745))
+* Bump eslint-plugin-json from 1.3.2 to 1.4.0 ([#5719](https://github.com/storybooks/storybook/pull/5719))
+* Bump react-native-modal-datetime-picker from 5.1.0 to 6.0.0 ([#4425](https://github.com/storybooks/storybook/pull/4425))
+* Bump immer from 1.12.0 to 2.0.0 ([#5694](https://github.com/storybooks/storybook/pull/5694))
+* Bump danger from 7.0.11 to 7.0.13 ([#5696](https://github.com/storybooks/storybook/pull/5696))
+* Bump eslint-plugin-jsx-a11y from 6.2.0 to 6.2.1 ([#5698](https://github.com/storybooks/storybook/pull/5698))
+* Bump @angular/platform-browser-dynamic from 7.2.4 to 7.2.6 ([#5697](https://github.com/storybooks/storybook/pull/5697))
+* Bump eslint from 5.12.1 to 5.14.1 ([#5653](https://github.com/storybooks/storybook/pull/5653))
+* Bump babel-preset-react-app from 7.0.0 to 7.0.1 ([#5674](https://github.com/storybooks/storybook/pull/5674))
+* Bump react from 16.8.1 to 16.8.2 ([#5673](https://github.com/storybooks/storybook/pull/5673))
+* Bump @angular/cli from 7.3.0 to 7.3.2 ([#5654](https://github.com/storybooks/storybook/pull/5654))
+* Bump @types/jest from 24.0.0 to 24.0.6 ([#5655](https://github.com/storybooks/storybook/pull/5655))
+* Bump lint-staged from 8.1.3 to 8.1.4 ([#5606](https://github.com/storybooks/storybook/pull/5606))
+* Bump @types/lodash from 4.14.120 to 4.14.121 ([#5609](https://github.com/storybooks/storybook/pull/5609))
+* Bump webpack from 4.29.0 to 4.29.3 ([#5570](https://github.com/storybooks/storybook/pull/5570))
+* update modal manager for rn 0.58 support ([#5581](https://github.com/storybooks/storybook/pull/5581))
+* Bump danger from 7.0.7 to 7.0.11 ([#5568](https://github.com/storybooks/storybook/pull/5568))
+* Bump jest-jasmine2 from 24.0.0 to 24.1.0 ([#5569](https://github.com/storybooks/storybook/pull/5569))
+* Bump jest-jasmine2 from 24.0.0 to 24.1.0 ([#5567](https://github.com/storybooks/storybook/pull/5567))
+* Bump handlebars from 4.0.12 to 4.1.0 ([#5576](https://github.com/storybooks/storybook/pull/5576))
+* Bump esm from 3.2.1 to 3.2.4 ([#5556](https://github.com/storybooks/storybook/pull/5556))
+* Bump @types/jest from 23.3.13 to 24.0.0 ([#5554](https://github.com/storybooks/storybook/pull/5554))
+* Bump webpack-dev-middleware from 3.5.1 to 3.5.2 ([#5552](https://github.com/storybooks/storybook/pull/5552))
+* Bump @emotion/core from 10.0.6 to 10.0.7 ([#5555](https://github.com/storybooks/storybook/pull/5555))
+* Bump terser-webpack-plugin from 1.2.1 to 1.2.2 ([#5553](https://github.com/storybooks/storybook/pull/5553))
+* Bump fuse.js from 3.3.1 to 3.4.2 ([#5538](https://github.com/storybooks/storybook/pull/5538))
+* Bump @angular/platform-browser-dynamic from 7.2.3 to 7.2.4 ([#5540](https://github.com/storybooks/storybook/pull/5540))
+* Bump emotion-theming from 10.0.6 to 10.0.7 ([#5541](https://github.com/storybooks/storybook/pull/5541))
+* Bump eslint-config-prettier from 3.6.0 to 4.0.0 ([#5539](https://github.com/storybooks/storybook/pull/5539))
+
 ## 5.0.0 (March 5, 2019)
 
 Storybook 5.0 is a completely new UI with the following improvements:

From 600afe653e1188f26d05805887b28b7bc8bee6de Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Wed, 6 Mar 2019 10:31:42 +0800
Subject: [PATCH 165/249] Fix linting issue

---
 lib/client-api/src/client_api.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/lib/client-api/src/client_api.js b/lib/client-api/src/client_api.js
index a505fe66e43..0ab857c21c4 100644
--- a/lib/client-api/src/client_api.js
+++ b/lib/client-api/src/client_api.js
@@ -218,7 +218,7 @@ export default class ClientApi {
 
     api.addDecorator = decorator => {
       if (hasAdded) {
-        console.warn(`You have added a decorator to the kind '${kind}' after a story has already been added.
+        logger.warn(`You have added a decorator to the kind '${kind}' after a story has already been added.
 In Storybook 4 this applied the decorator only to subsequent stories. In Storybook 5+ it applies to all stories.
 This is probably not what you intended. Read more here: https://github.com/storybooks/storybook/blob/master/MIGRATION.md`);
       }

From a05491b07af8d56addb15a1b7599c960b423af75 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Wed, 6 Mar 2019 10:39:47 +0800
Subject: [PATCH 166/249] v5.1.0-alpha.0

---
 addons/a11y/package.json                      | 12 ++---
 addons/actions/package.json                   | 12 ++---
 addons/backgrounds/package.json               | 12 ++---
 addons/centered/package.json                  |  2 +-
 addons/cssresources/package.json              |  8 +--
 addons/events/package.json                    |  8 +--
 addons/google-analytics/package.json          |  6 +--
 addons/graphql/package.json                   |  2 +-
 addons/info/package.json                      | 10 ++--
 addons/jest/package.json                      | 10 ++--
 addons/knobs/package.json                     | 10 ++--
 addons/links/package.json                     |  6 +--
 addons/notes/package.json                     | 12 ++---
 addons/ondevice-backgrounds/package.json      |  4 +-
 addons/ondevice-knobs/package.json            |  4 +-
 addons/ondevice-notes/package.json            |  4 +-
 addons/options/package.json                   |  4 +-
 .../storyshots/storyshots-core/package.json   |  4 +-
 .../storyshots-puppeteer/package.json         |  6 +--
 addons/storysource/package.json               | 10 ++--
 addons/viewport/package.json                  | 12 ++---
 app/angular/package.json                      |  6 +--
 app/ember/package.json                        |  4 +-
 app/html/package.json                         |  4 +-
 app/marko/package.json                        |  4 +-
 app/mithril/package.json                      |  4 +-
 app/polymer/package.json                      |  4 +-
 app/preact/package.json                       |  4 +-
 app/react-native/package.json                 | 14 ++---
 app/react/package.json                        |  6 +--
 app/riot/package.json                         |  4 +-
 app/svelte/package.json                       |  4 +-
 app/vue/package.json                          |  4 +-
 examples/angular-cli/package.json             | 26 ++++-----
 examples/cra-kitchen-sink/package.json        | 32 +++++------
 examples/cra-ts-kitchen-sink/package.json     | 13 ++---
 examples/ember-cli/package.json               | 26 ++++-----
 examples/html-kitchen-sink/package.json       | 36 ++++++-------
 examples/marko-cli/package.json               | 14 ++---
 examples/mithril-kitchen-sink/package.json    | 26 ++++-----
 examples/official-storybook/package.json      | 48 ++++++++---------
 examples/polymer-cli/package.json             | 20 +++----
 examples/preact-kitchen-sink/package.json     | 26 ++++-----
 examples/riot-kitchen-sink/package.json       | 26 ++++-----
 examples/svelte-kitchen-sink/package.json     | 26 ++++-----
 examples/vue-kitchen-sink/package.json        | 26 ++++-----
 lerna.json                                    |  2 +-
 lib/addons/package.json                       |  6 +--
 lib/channel-postmessage/package.json          |  6 +--
 lib/channel-websocket/package.json            |  4 +-
 lib/channels/package.json                     |  2 +-
 lib/cli/package.json                          | 54 +++++++++----------
 lib/client-api/package.json                   | 10 ++--
 lib/client-logger/package.json                |  2 +-
 lib/codemod/package.json                      |  2 +-
 lib/components/package.json                   | 12 ++---
 lib/core-events/package.json                  |  2 +-
 lib/core/package.json                         | 18 +++----
 lib/node-logger/package.json                  |  2 +-
 lib/router/package.json                       |  4 +-
 lib/theming/package.json                      |  4 +-
 lib/ui/package.json                           | 14 ++---
 62 files changed, 355 insertions(+), 354 deletions(-)

diff --git a/addons/a11y/package.json b/addons/a11y/package.json
index 87c7864ecd4..281923dcf15 100644
--- a/addons/a11y/package.json
+++ b/addons/a11y/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-a11y",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "a11y addon for storybook",
   "keywords": [
     "a11y",
@@ -26,11 +26,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0",
-    "@storybook/client-logger": "5.0.0",
-    "@storybook/components": "5.0.0",
-    "@storybook/core-events": "5.0.0",
-    "@storybook/theming": "5.0.0",
+    "@storybook/addons": "5.1.0-alpha.0",
+    "@storybook/client-logger": "5.1.0-alpha.0",
+    "@storybook/components": "5.1.0-alpha.0",
+    "@storybook/core-events": "5.1.0-alpha.0",
+    "@storybook/theming": "5.1.0-alpha.0",
     "axe-core": "^3.1.2",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
diff --git a/addons/actions/package.json b/addons/actions/package.json
index c3b8e55a960..94538cca176 100644
--- a/addons/actions/package.json
+++ b/addons/actions/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-actions",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "Action Logger addon for storybook",
   "keywords": [
     "storybook"
@@ -21,16 +21,16 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0",
-    "@storybook/components": "5.0.0",
-    "@storybook/core-events": "5.0.0",
-    "@storybook/theming": "5.0.0",
+    "@storybook/addons": "5.1.0-alpha.0",
+    "@storybook/components": "5.1.0-alpha.0",
+    "@storybook/core-events": "5.1.0-alpha.0",
+    "@storybook/theming": "5.1.0-alpha.0",
     "core-js": "^2.6.5",
     "fast-deep-equal": "^2.0.1",
     "global": "^4.3.2",
     "lodash": "^4.17.11",
-    "prop-types": "^15.7.2",
     "polished": "^3.0.0",
+    "prop-types": "^15.7.2",
     "react": "^16.8.3",
     "react-inspector": "^2.3.1",
     "uuid": "^3.3.2"
diff --git a/addons/backgrounds/package.json b/addons/backgrounds/package.json
index d809a0f174f..5c537447b0f 100644
--- a/addons/backgrounds/package.json
+++ b/addons/backgrounds/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-backgrounds",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "A storybook addon to show different backgrounds for your preview",
   "keywords": [
     "addon",
@@ -25,11 +25,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0",
-    "@storybook/client-logger": "5.0.0",
-    "@storybook/components": "5.0.0",
-    "@storybook/core-events": "5.0.0",
-    "@storybook/theming": "5.0.0",
+    "@storybook/addons": "5.1.0-alpha.0",
+    "@storybook/client-logger": "5.1.0-alpha.0",
+    "@storybook/components": "5.1.0-alpha.0",
+    "@storybook/core-events": "5.1.0-alpha.0",
+    "@storybook/theming": "5.1.0-alpha.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
diff --git a/addons/centered/package.json b/addons/centered/package.json
index 0dce6efc35b..6783e870d39 100644
--- a/addons/centered/package.json
+++ b/addons/centered/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-centered",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "Storybook decorator to center components",
   "keywords": [
     "addon",
diff --git a/addons/cssresources/package.json b/addons/cssresources/package.json
index fe528a5067e..2ddd3a9264b 100644
--- a/addons/cssresources/package.json
+++ b/addons/cssresources/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-cssresources",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "A storybook addon to switch between css resources at runtime for your story",
   "keywords": [
     "addon",
@@ -25,9 +25,9 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0",
-    "@storybook/components": "5.0.0",
-    "@storybook/core-events": "5.0.0",
+    "@storybook/addons": "5.1.0-alpha.0",
+    "@storybook/components": "5.1.0-alpha.0",
+    "@storybook/core-events": "5.1.0-alpha.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "react": "^16.8.3"
diff --git a/addons/events/package.json b/addons/events/package.json
index 84272dfefec..dd04ba69f99 100644
--- a/addons/events/package.json
+++ b/addons/events/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-events",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "Add events to your Storybook stories.",
   "keywords": [
     "addon",
@@ -24,9 +24,9 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0",
-    "@storybook/core-events": "5.0.0",
-    "@storybook/theming": "5.0.0",
+    "@storybook/addons": "5.1.0-alpha.0",
+    "@storybook/core-events": "5.1.0-alpha.0",
+    "@storybook/theming": "5.1.0-alpha.0",
     "core-js": "^2.6.5",
     "format-json": "^1.0.3",
     "prop-types": "^15.7.2",
diff --git a/addons/google-analytics/package.json b/addons/google-analytics/package.json
index f51c14d33c5..3e474ab3e68 100644
--- a/addons/google-analytics/package.json
+++ b/addons/google-analytics/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-google-analytics",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "Storybook addon for google analytics",
   "keywords": [
     "addon",
@@ -20,8 +20,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0",
-    "@storybook/core-events": "5.0.0",
+    "@storybook/addons": "5.1.0-alpha.0",
+    "@storybook/core-events": "5.1.0-alpha.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "react-ga": "^2.5.7"
diff --git a/addons/graphql/package.json b/addons/graphql/package.json
index f38479cb1f6..a2e89eb65c4 100644
--- a/addons/graphql/package.json
+++ b/addons/graphql/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-graphql",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "Storybook addon to display the GraphiQL IDE",
   "keywords": [
     "addon",
diff --git a/addons/info/package.json b/addons/info/package.json
index 895788c2e26..07a2fd70578 100644
--- a/addons/info/package.json
+++ b/addons/info/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-info",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "A Storybook addon to show additional information for your stories.",
   "keywords": [
     "addon",
@@ -22,10 +22,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0",
-    "@storybook/client-logger": "5.0.0",
-    "@storybook/components": "5.0.0",
-    "@storybook/theming": "5.0.0",
+    "@storybook/addons": "5.1.0-alpha.0",
+    "@storybook/client-logger": "5.1.0-alpha.0",
+    "@storybook/components": "5.1.0-alpha.0",
+    "@storybook/theming": "5.1.0-alpha.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "marksy": "^6.1.0",
diff --git a/addons/jest/package.json b/addons/jest/package.json
index 7071ef3017f..7c4df30d220 100644
--- a/addons/jest/package.json
+++ b/addons/jest/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-jest",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "React storybook addon that show component jest report",
   "keywords": [
     "addon",
@@ -28,10 +28,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0",
-    "@storybook/components": "5.0.0",
-    "@storybook/core-events": "5.0.0",
-    "@storybook/theming": "5.0.0",
+    "@storybook/addons": "5.1.0-alpha.0",
+    "@storybook/components": "5.1.0-alpha.0",
+    "@storybook/core-events": "5.1.0-alpha.0",
+    "@storybook/theming": "5.1.0-alpha.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "prop-types": "^15.7.2",
diff --git a/addons/knobs/package.json b/addons/knobs/package.json
index f5c1f31df5d..7188b85acaa 100644
--- a/addons/knobs/package.json
+++ b/addons/knobs/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-knobs",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "Storybook Addon Prop Editor Component",
   "keywords": [
     "addon",
@@ -22,10 +22,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0",
-    "@storybook/components": "5.0.0",
-    "@storybook/core-events": "5.0.0",
-    "@storybook/theming": "5.0.0",
+    "@storybook/addons": "5.1.0-alpha.0",
+    "@storybook/components": "5.1.0-alpha.0",
+    "@storybook/core-events": "5.1.0-alpha.0",
+    "@storybook/theming": "5.1.0-alpha.0",
     "copy-to-clipboard": "^3.0.8",
     "core-js": "^2.6.5",
     "escape-html": "^1.0.3",
diff --git a/addons/links/package.json b/addons/links/package.json
index 3b6f3c7fb74..952274e1b54 100644
--- a/addons/links/package.json
+++ b/addons/links/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-links",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "Story Links addon for storybook",
   "keywords": [
     "addon",
@@ -22,8 +22,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0",
-    "@storybook/core-events": "5.0.0",
+    "@storybook/addons": "5.1.0-alpha.0",
+    "@storybook/core-events": "5.1.0-alpha.0",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
diff --git a/addons/notes/package.json b/addons/notes/package.json
index 0d1efb4a9a1..550d71b4a34 100644
--- a/addons/notes/package.json
+++ b/addons/notes/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-notes",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "Write notes for your Storybook stories.",
   "keywords": [
     "addon",
@@ -23,11 +23,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0",
-    "@storybook/client-logger": "5.0.0",
-    "@storybook/components": "5.0.0",
-    "@storybook/core-events": "5.0.0",
-    "@storybook/theming": "5.0.0",
+    "@storybook/addons": "5.1.0-alpha.0",
+    "@storybook/client-logger": "5.1.0-alpha.0",
+    "@storybook/components": "5.1.0-alpha.0",
+    "@storybook/core-events": "5.1.0-alpha.0",
+    "@storybook/theming": "5.1.0-alpha.0",
     "markdown-to-jsx": "^6.9.1",
     "prop-types": "^15.7.2",
     "util-deprecate": "^1.0.2"
diff --git a/addons/ondevice-backgrounds/package.json b/addons/ondevice-backgrounds/package.json
index e36160e1c54..438cedc167b 100644
--- a/addons/ondevice-backgrounds/package.json
+++ b/addons/ondevice-backgrounds/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/addon-ondevice-backgrounds",
   "private": true,
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "A storybook addon to show different backgrounds for your preview",
   "keywords": [
     "addon",
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0",
+    "@storybook/addons": "5.1.0-alpha.0",
     "core-js": "^2.6.5",
     "prop-types": "^15.7.2"
   },
diff --git a/addons/ondevice-knobs/package.json b/addons/ondevice-knobs/package.json
index 15ba64e7520..ebc72423fdd 100644
--- a/addons/ondevice-knobs/package.json
+++ b/addons/ondevice-knobs/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/addon-ondevice-knobs",
   "private": true,
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "Display storybook story knobs on your deviced.",
   "keywords": [
     "addon",
@@ -22,7 +22,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0",
+    "@storybook/addons": "5.1.0-alpha.0",
     "core-js": "^2.6.5",
     "deep-equal": "^1.0.1",
     "prop-types": "^15.7.2",
diff --git a/addons/ondevice-notes/package.json b/addons/ondevice-notes/package.json
index 0158a2a789c..4ee410b9c18 100644
--- a/addons/ondevice-notes/package.json
+++ b/addons/ondevice-notes/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/addon-ondevice-notes",
   "private": true,
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "Write notes for your Storybook stories.",
   "keywords": [
     "addon",
@@ -20,7 +20,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0",
+    "@storybook/addons": "5.1.0-alpha.0",
     "core-js": "^2.6.5",
     "prop-types": "^15.7.2",
     "react-native-simple-markdown": "^1.1.0"
diff --git a/addons/options/package.json b/addons/options/package.json
index e087fe9309b..c4a610cd6e8 100644
--- a/addons/options/package.json
+++ b/addons/options/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-options",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "Options addon for storybook",
   "keywords": [
     "addon",
@@ -21,7 +21,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0",
+    "@storybook/addons": "5.1.0-alpha.0",
     "core-js": "^2.6.5",
     "util-deprecate": "^1.0.2"
   },
diff --git a/addons/storyshots/storyshots-core/package.json b/addons/storyshots/storyshots-core/package.json
index eb57703362d..1cce8ecf0b7 100644
--- a/addons/storyshots/storyshots-core/package.json
+++ b/addons/storyshots/storyshots-core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storyshots",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "StoryShots is a Jest Snapshot Testing Addon for Storybook.",
   "keywords": [
     "addon",
@@ -25,7 +25,7 @@
     "storybook": "start-storybook -p 6006"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0",
+    "@storybook/addons": "5.1.0-alpha.0",
     "core-js": "^2.6.5",
     "glob": "^7.1.3",
     "global": "^4.3.2",
diff --git a/addons/storyshots/storyshots-puppeteer/package.json b/addons/storyshots/storyshots-puppeteer/package.json
index 9e58c26212f..f7acc97174e 100644
--- a/addons/storyshots/storyshots-puppeteer/package.json
+++ b/addons/storyshots/storyshots-puppeteer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storyshots-puppeteer",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "Image snappshots addition to StoryShots base on puppeteer",
   "keywords": [
     "addon",
@@ -22,8 +22,8 @@
     "prepare": "node ../../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/node-logger": "5.0.0",
-    "@storybook/router": "5.0.0",
+    "@storybook/node-logger": "5.1.0-alpha.0",
+    "@storybook/router": "5.1.0-alpha.0",
     "core-js": "^2.6.5",
     "jest-image-snapshot": "^2.8.1",
     "puppeteer": "^1.12.2",
diff --git a/addons/storysource/package.json b/addons/storysource/package.json
index 7247630628b..83b629c4d30 100644
--- a/addons/storysource/package.json
+++ b/addons/storysource/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storysource",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "Stories addon for storybook",
   "keywords": [
     "addon",
@@ -22,10 +22,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0",
-    "@storybook/components": "5.0.0",
-    "@storybook/router": "5.0.0",
-    "@storybook/theming": "5.0.0",
+    "@storybook/addons": "5.1.0-alpha.0",
+    "@storybook/components": "5.1.0-alpha.0",
+    "@storybook/router": "5.1.0-alpha.0",
+    "@storybook/theming": "5.1.0-alpha.0",
     "core-js": "^2.6.5",
     "estraverse": "^4.2.0",
     "loader-utils": "^1.2.3",
diff --git a/addons/viewport/package.json b/addons/viewport/package.json
index cd8be04eb05..4f57c9d0a14 100644
--- a/addons/viewport/package.json
+++ b/addons/viewport/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-viewport",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "Storybook addon to change the viewport size to mobile",
   "keywords": [
     "addon",
@@ -21,11 +21,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0",
-    "@storybook/client-logger": "5.0.0",
-    "@storybook/components": "5.0.0",
-    "@storybook/core-events": "5.0.0",
-    "@storybook/theming": "5.0.0",
+    "@storybook/addons": "5.1.0-alpha.0",
+    "@storybook/client-logger": "5.1.0-alpha.0",
+    "@storybook/components": "5.1.0-alpha.0",
+    "@storybook/core-events": "5.1.0-alpha.0",
+    "@storybook/theming": "5.1.0-alpha.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
diff --git a/app/angular/package.json b/app/angular/package.json
index f3b6f9ed66e..1d3d3fdfb86 100644
--- a/app/angular/package.json
+++ b/app/angular/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/angular",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "Storybook for Angular: Develop Angular Components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -26,8 +26,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0",
-    "@storybook/node-logger": "5.0.0",
+    "@storybook/core": "5.1.0-alpha.0",
+    "@storybook/node-logger": "5.1.0-alpha.0",
     "angular2-template-loader": "^0.6.2",
     "core-js": "^2.6.5",
     "fork-ts-checker-webpack-plugin": "^0.5.2",
diff --git a/app/ember/package.json b/app/ember/package.json
index 1bb19f2096a..1854465d4f8 100644
--- a/app/ember/package.json
+++ b/app/ember/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/ember",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "Storybook for Ember: Develop Ember Component in isolation with Hot Reloading.",
   "homepage": "https://github.com/storybooks/storybook/tree/master/app/ember",
   "bugs": {
@@ -24,7 +24,7 @@
   },
   "dependencies": {
     "@ember/test-helpers": "^1.5.0",
-    "@storybook/core": "5.0.0",
+    "@storybook/core": "5.1.0-alpha.0",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
diff --git a/app/html/package.json b/app/html/package.json
index 95de0e9e503..4d9f2bea948 100644
--- a/app/html/package.json
+++ b/app/html/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/html",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "Storybook for HTML: View HTML snippets in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0",
+    "@storybook/core": "5.1.0-alpha.0",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
diff --git a/app/marko/package.json b/app/marko/package.json
index 8b240ca0b1c..2f3b7f977f3 100644
--- a/app/marko/package.json
+++ b/app/marko/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/marko",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "Storybook for Marko: Develop Marko Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -26,7 +26,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0",
+    "@storybook/core": "5.1.0-alpha.0",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
diff --git a/app/mithril/package.json b/app/mithril/package.json
index f88931cb17a..0a4bb202664 100644
--- a/app/mithril/package.json
+++ b/app/mithril/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/mithril",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "Storybook for Mithril: Develop Mithril Component in isolation.",
   "keywords": [
     "storybook"
@@ -27,7 +27,7 @@
   },
   "dependencies": {
     "@babel/plugin-transform-react-jsx": "^7.3.0",
-    "@storybook/core": "5.0.0",
+    "@storybook/core": "5.1.0-alpha.0",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
diff --git a/app/polymer/package.json b/app/polymer/package.json
index 32ebb0e167c..90ad3b0e3e7 100644
--- a/app/polymer/package.json
+++ b/app/polymer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/polymer",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "Storybook for Polymer: Develop Polymer components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0",
+    "@storybook/core": "5.1.0-alpha.0",
     "@webcomponents/webcomponentsjs": "^1.2.0",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
diff --git a/app/preact/package.json b/app/preact/package.json
index 9e094e624a9..b406eb71518 100644
--- a/app/preact/package.json
+++ b/app/preact/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/preact",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "Storybook for Preact: Develop Preact Component in isolation.",
   "keywords": [
     "storybook"
@@ -27,7 +27,7 @@
   },
   "dependencies": {
     "@babel/plugin-transform-react-jsx": "^7.3.0",
-    "@storybook/core": "5.0.0",
+    "@storybook/core": "5.1.0-alpha.0",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
diff --git a/app/react-native/package.json b/app/react-native/package.json
index 0e4dff28865..15ef8356558 100644
--- a/app/react-native/package.json
+++ b/app/react-native/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/react-native",
   "private": true,
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "A better way to develop React Native Components for your app",
   "keywords": [
     "react",
@@ -27,12 +27,12 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0",
-    "@storybook/channel-websocket": "5.0.0",
-    "@storybook/channels": "5.0.0",
-    "@storybook/core": "5.0.0",
-    "@storybook/core-events": "5.0.0",
-    "@storybook/ui": "5.0.0",
+    "@storybook/addons": "5.1.0-alpha.0",
+    "@storybook/channel-websocket": "5.1.0-alpha.0",
+    "@storybook/channels": "5.1.0-alpha.0",
+    "@storybook/core": "5.1.0-alpha.0",
+    "@storybook/core-events": "5.1.0-alpha.0",
+    "@storybook/ui": "5.1.0-alpha.0",
     "babel-loader": "^8.0.4",
     "babel-plugin-macros": "^2.4.5",
     "babel-plugin-syntax-async-functions": "^6.13.0",
diff --git a/app/react/package.json b/app/react/package.json
index c43ad2d10f0..514c1f5bbc4 100644
--- a/app/react/package.json
+++ b/app/react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/react",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "Storybook for React: Develop React Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -29,8 +29,8 @@
     "@babel/plugin-transform-react-constant-elements": "^7.2.0",
     "@babel/preset-flow": "^7.0.0",
     "@babel/preset-react": "^7.0.0",
-    "@storybook/core": "5.0.0",
-    "@storybook/node-logger": "5.0.0",
+    "@storybook/core": "5.1.0-alpha.0",
+    "@storybook/node-logger": "5.1.0-alpha.0",
     "@svgr/webpack": "^4.0.3",
     "babel-plugin-named-asset-import": "^0.3.1",
     "babel-plugin-react-docgen": "^2.0.2",
diff --git a/app/riot/package.json b/app/riot/package.json
index 061ec6ccad7..45474c02f14 100644
--- a/app/riot/package.json
+++ b/app/riot/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/riot",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "Storybook for riot.js: View riot snippets in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0",
+    "@storybook/core": "5.1.0-alpha.0",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
diff --git a/app/svelte/package.json b/app/svelte/package.json
index beb5bfd0c80..94e90459235 100644
--- a/app/svelte/package.json
+++ b/app/svelte/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/svelte",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "Storybook for Svelte: Develop Svelte Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -26,7 +26,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0",
+    "@storybook/core": "5.1.0-alpha.0",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
diff --git a/app/vue/package.json b/app/vue/package.json
index 3a0f88e914c..eaf326a10d9 100644
--- a/app/vue/package.json
+++ b/app/vue/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/vue",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "Storybook for Vue: Develop Vue Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -26,7 +26,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.0.0",
+    "@storybook/core": "5.1.0-alpha.0",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
diff --git a/examples/angular-cli/package.json b/examples/angular-cli/package.json
index 596f2f85962..772c9b80ef5 100644
--- a/examples/angular-cli/package.json
+++ b/examples/angular-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "angular-cli",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "private": true,
   "license": "MIT",
   "scripts": {
@@ -34,18 +34,18 @@
     "@angular-devkit/build-angular": "^0.13.4",
     "@angular/cli": "^7.3.3",
     "@angular/compiler-cli": "^7.2.6",
-    "@storybook/addon-actions": "5.0.0",
-    "@storybook/addon-backgrounds": "5.0.0",
-    "@storybook/addon-centered": "5.0.0",
-    "@storybook/addon-jest": "5.0.0",
-    "@storybook/addon-knobs": "5.0.0",
-    "@storybook/addon-links": "5.0.0",
-    "@storybook/addon-notes": "5.0.0",
-    "@storybook/addon-options": "5.0.0",
-    "@storybook/addon-storyshots": "5.0.0",
-    "@storybook/addon-storysource": "5.0.0",
-    "@storybook/addons": "5.0.0",
-    "@storybook/angular": "5.0.0",
+    "@storybook/addon-actions": "5.1.0-alpha.0",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.0",
+    "@storybook/addon-centered": "5.1.0-alpha.0",
+    "@storybook/addon-jest": "5.1.0-alpha.0",
+    "@storybook/addon-knobs": "5.1.0-alpha.0",
+    "@storybook/addon-links": "5.1.0-alpha.0",
+    "@storybook/addon-notes": "5.1.0-alpha.0",
+    "@storybook/addon-options": "5.1.0-alpha.0",
+    "@storybook/addon-storyshots": "5.1.0-alpha.0",
+    "@storybook/addon-storysource": "5.1.0-alpha.0",
+    "@storybook/addons": "5.1.0-alpha.0",
+    "@storybook/angular": "5.1.0-alpha.0",
     "@types/core-js": "^2.5.0",
     "@types/jest": "^24.0.6",
     "@types/node": "~11.9.5",
diff --git a/examples/cra-kitchen-sink/package.json b/examples/cra-kitchen-sink/package.json
index 06c51c31a28..e9c21851907 100644
--- a/examples/cra-kitchen-sink/package.json
+++ b/examples/cra-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "cra-kitchen-sink",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -19,21 +19,21 @@
     "react-lifecycles-compat": "^3.0.4"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.0.0",
-    "@storybook/addon-actions": "5.0.0",
-    "@storybook/addon-backgrounds": "5.0.0",
-    "@storybook/addon-centered": "5.0.0",
-    "@storybook/addon-events": "5.0.0",
-    "@storybook/addon-info": "5.0.0",
-    "@storybook/addon-jest": "5.0.0",
-    "@storybook/addon-knobs": "5.0.0",
-    "@storybook/addon-links": "5.0.0",
-    "@storybook/addon-notes": "5.0.0",
-    "@storybook/addon-options": "5.0.0",
-    "@storybook/addon-storyshots": "5.0.0",
-    "@storybook/addons": "5.0.0",
-    "@storybook/client-logger": "5.0.0",
-    "@storybook/react": "5.0.0",
+    "@storybook/addon-a11y": "5.1.0-alpha.0",
+    "@storybook/addon-actions": "5.1.0-alpha.0",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.0",
+    "@storybook/addon-centered": "5.1.0-alpha.0",
+    "@storybook/addon-events": "5.1.0-alpha.0",
+    "@storybook/addon-info": "5.1.0-alpha.0",
+    "@storybook/addon-jest": "5.1.0-alpha.0",
+    "@storybook/addon-knobs": "5.1.0-alpha.0",
+    "@storybook/addon-links": "5.1.0-alpha.0",
+    "@storybook/addon-notes": "5.1.0-alpha.0",
+    "@storybook/addon-options": "5.1.0-alpha.0",
+    "@storybook/addon-storyshots": "5.1.0-alpha.0",
+    "@storybook/addons": "5.1.0-alpha.0",
+    "@storybook/client-logger": "5.1.0-alpha.0",
+    "@storybook/react": "5.1.0-alpha.0",
     "enzyme": "^3.9.0",
     "enzyme-adapter-react-16": "^1.9.1",
     "enzyme-to-json": "^3.3.5",
diff --git a/examples/cra-ts-kitchen-sink/package.json b/examples/cra-ts-kitchen-sink/package.json
index 154a870a756..cab16a24aa3 100644
--- a/examples/cra-ts-kitchen-sink/package.json
+++ b/examples/cra-ts-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "cra-ts-kitchen-sink",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -19,11 +19,12 @@
     "react": "^16.8.3",
     "react-dom": "^16.8.3"
   },
-  "devDependencies": {    "@storybook/addon-actions": "5.0.0",
-    "@storybook/addon-info": "5.0.0",
-    "@storybook/addon-options": "5.0.0",
-    "@storybook/addons": "5.0.0",
-    "@storybook/react": "5.0.0",
+  "devDependencies": {
+    "@storybook/addon-actions": "5.1.0-alpha.0",
+    "@storybook/addon-info": "5.1.0-alpha.0",
+    "@storybook/addon-options": "5.1.0-alpha.0",
+    "@storybook/addons": "5.1.0-alpha.0",
+    "@storybook/react": "5.1.0-alpha.0",
     "@types/enzyme": "^3.9.0",
     "@types/react": "^16.8.4",
     "@types/react-dom": "^16.8.2",
diff --git a/examples/ember-cli/package.json b/examples/ember-cli/package.json
index e953fd5c665..980c56c1ea5 100644
--- a/examples/ember-cli/package.json
+++ b/examples/ember-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "ember-example",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -15,18 +15,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.3.4",
-    "@storybook/addon-a11y": "5.0.0",
-    "@storybook/addon-actions": "5.0.0",
-    "@storybook/addon-backgrounds": "5.0.0",
-    "@storybook/addon-centered": "5.0.0",
-    "@storybook/addon-knobs": "5.0.0",
-    "@storybook/addon-links": "5.0.0",
-    "@storybook/addon-notes": "5.0.0",
-    "@storybook/addon-options": "5.0.0",
-    "@storybook/addon-storysource": "5.0.0",
-    "@storybook/addon-viewport": "5.0.0",
-    "@storybook/addons": "5.0.0",
-    "@storybook/ember": "5.0.0",
+    "@storybook/addon-a11y": "5.1.0-alpha.0",
+    "@storybook/addon-actions": "5.1.0-alpha.0",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.0",
+    "@storybook/addon-centered": "5.1.0-alpha.0",
+    "@storybook/addon-knobs": "5.1.0-alpha.0",
+    "@storybook/addon-links": "5.1.0-alpha.0",
+    "@storybook/addon-notes": "5.1.0-alpha.0",
+    "@storybook/addon-options": "5.1.0-alpha.0",
+    "@storybook/addon-storysource": "5.1.0-alpha.0",
+    "@storybook/addon-viewport": "5.1.0-alpha.0",
+    "@storybook/addons": "5.1.0-alpha.0",
+    "@storybook/ember": "5.1.0-alpha.0",
     "babel-loader": "^8",
     "broccoli-asset-rev": "^3.0.0",
     "cross-env": "^5.2.0",
diff --git a/examples/html-kitchen-sink/package.json b/examples/html-kitchen-sink/package.json
index c2989550653..9e877878797 100644
--- a/examples/html-kitchen-sink/package.json
+++ b/examples/html-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "html-kitchen-sink",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "private": true,
   "description": "",
   "keywords": [],
@@ -14,23 +14,23 @@
     "storybook": "start-storybook -p 9006"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.0.0",
-    "@storybook/addon-actions": "5.0.0",
-    "@storybook/addon-backgrounds": "5.0.0",
-    "@storybook/addon-centered": "5.0.0",
-    "@storybook/addon-events": "5.0.0",
-    "@storybook/addon-jest": "5.0.0",
-    "@storybook/addon-knobs": "5.0.0",
-    "@storybook/addon-links": "5.0.0",
-    "@storybook/addon-notes": "5.0.0",
-    "@storybook/addon-options": "5.0.0",
-    "@storybook/addon-storyshots": "5.0.0",
-    "@storybook/addon-storysource": "5.0.0",
-    "@storybook/addon-viewport": "5.0.0",
-    "@storybook/addons": "5.0.0",
-    "@storybook/core": "5.0.0",
-    "@storybook/core-events": "5.0.0",
-    "@storybook/html": "5.0.0",
+    "@storybook/addon-a11y": "5.1.0-alpha.0",
+    "@storybook/addon-actions": "5.1.0-alpha.0",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.0",
+    "@storybook/addon-centered": "5.1.0-alpha.0",
+    "@storybook/addon-events": "5.1.0-alpha.0",
+    "@storybook/addon-jest": "5.1.0-alpha.0",
+    "@storybook/addon-knobs": "5.1.0-alpha.0",
+    "@storybook/addon-links": "5.1.0-alpha.0",
+    "@storybook/addon-notes": "5.1.0-alpha.0",
+    "@storybook/addon-options": "5.1.0-alpha.0",
+    "@storybook/addon-storyshots": "5.1.0-alpha.0",
+    "@storybook/addon-storysource": "5.1.0-alpha.0",
+    "@storybook/addon-viewport": "5.1.0-alpha.0",
+    "@storybook/addons": "5.1.0-alpha.0",
+    "@storybook/core": "5.1.0-alpha.0",
+    "@storybook/core-events": "5.1.0-alpha.0",
+    "@storybook/html": "5.1.0-alpha.0",
     "eventemitter3": "^3.1.0",
     "format-json": "^1.0.3",
     "global": "^4.3.2",
diff --git a/examples/marko-cli/package.json b/examples/marko-cli/package.json
index ff0a27d5a92..ce37a26af4f 100644
--- a/examples/marko-cli/package.json
+++ b/examples/marko-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "marko-cli",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "private": true,
   "description": "Demo of how to build an app using marko-starter",
   "repository": {
@@ -24,12 +24,12 @@
     "marko-starter": "^2.0.4"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0",
-    "@storybook/addon-knobs": "5.0.0",
-    "@storybook/addon-options": "5.0.0",
-    "@storybook/addon-storysource": "5.0.0",
-    "@storybook/addons": "5.0.0",
-    "@storybook/marko": "5.0.0",
+    "@storybook/addon-actions": "5.1.0-alpha.0",
+    "@storybook/addon-knobs": "5.1.0-alpha.0",
+    "@storybook/addon-options": "5.1.0-alpha.0",
+    "@storybook/addon-storysource": "5.1.0-alpha.0",
+    "@storybook/addons": "5.1.0-alpha.0",
+    "@storybook/marko": "5.1.0-alpha.0",
     "prettier": "^1.16.4",
     "webpack": "^4.29.6"
   }
diff --git a/examples/mithril-kitchen-sink/package.json b/examples/mithril-kitchen-sink/package.json
index e66018986cc..54c37bb428a 100644
--- a/examples/mithril-kitchen-sink/package.json
+++ b/examples/mithril-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "mithril-example",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -11,18 +11,18 @@
     "mithril": "^1.1.6"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0",
-    "@storybook/addon-backgrounds": "5.0.0",
-    "@storybook/addon-centered": "5.0.0",
-    "@storybook/addon-knobs": "5.0.0",
-    "@storybook/addon-links": "5.0.0",
-    "@storybook/addon-notes": "5.0.0",
-    "@storybook/addon-options": "5.0.0",
-    "@storybook/addon-storyshots": "5.0.0",
-    "@storybook/addon-storysource": "5.0.0",
-    "@storybook/addon-viewport": "5.0.0",
-    "@storybook/addons": "5.0.0",
-    "@storybook/mithril": "5.0.0",
+    "@storybook/addon-actions": "5.1.0-alpha.0",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.0",
+    "@storybook/addon-centered": "5.1.0-alpha.0",
+    "@storybook/addon-knobs": "5.1.0-alpha.0",
+    "@storybook/addon-links": "5.1.0-alpha.0",
+    "@storybook/addon-notes": "5.1.0-alpha.0",
+    "@storybook/addon-options": "5.1.0-alpha.0",
+    "@storybook/addon-storyshots": "5.1.0-alpha.0",
+    "@storybook/addon-storysource": "5.1.0-alpha.0",
+    "@storybook/addon-viewport": "5.1.0-alpha.0",
+    "@storybook/addons": "5.1.0-alpha.0",
+    "@storybook/mithril": "5.1.0-alpha.0",
     "webpack": "^4.29.6"
   }
 }
diff --git a/examples/official-storybook/package.json b/examples/official-storybook/package.json
index 960e305eb71..4ac2842a0cf 100644
--- a/examples/official-storybook/package.json
+++ b/examples/official-storybook/package.json
@@ -1,6 +1,6 @@
 {
   "name": "official-storybook",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -13,29 +13,29 @@
     "storybook": "cross-env STORYBOOK_DISPLAY_WARNING=true DISPLAY_WARNING=true start-storybook -p 9011 -c ./ -s built-storybooks --no-dll"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.0.0",
-    "@storybook/addon-actions": "5.0.0",
-    "@storybook/addon-backgrounds": "5.0.0",
-    "@storybook/addon-centered": "5.0.0",
-    "@storybook/addon-cssresources": "5.0.0",
-    "@storybook/addon-events": "5.0.0",
-    "@storybook/addon-graphql": "5.0.0",
-    "@storybook/addon-info": "5.0.0",
-    "@storybook/addon-jest": "5.0.0",
-    "@storybook/addon-knobs": "5.0.0",
-    "@storybook/addon-links": "5.0.0",
-    "@storybook/addon-notes": "5.0.0",
-    "@storybook/addon-options": "5.0.0",
-    "@storybook/addon-storyshots": "5.0.0",
-    "@storybook/addon-storyshots-puppeteer": "5.0.0",
-    "@storybook/addon-storysource": "5.0.0",
-    "@storybook/addon-viewport": "5.0.0",
-    "@storybook/addons": "5.0.0",
-    "@storybook/components": "5.0.0",
-    "@storybook/core-events": "5.0.0",
-    "@storybook/node-logger": "5.0.0",
-    "@storybook/react": "5.0.0",
-    "@storybook/theming": "5.0.0",
+    "@storybook/addon-a11y": "5.1.0-alpha.0",
+    "@storybook/addon-actions": "5.1.0-alpha.0",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.0",
+    "@storybook/addon-centered": "5.1.0-alpha.0",
+    "@storybook/addon-cssresources": "5.1.0-alpha.0",
+    "@storybook/addon-events": "5.1.0-alpha.0",
+    "@storybook/addon-graphql": "5.1.0-alpha.0",
+    "@storybook/addon-info": "5.1.0-alpha.0",
+    "@storybook/addon-jest": "5.1.0-alpha.0",
+    "@storybook/addon-knobs": "5.1.0-alpha.0",
+    "@storybook/addon-links": "5.1.0-alpha.0",
+    "@storybook/addon-notes": "5.1.0-alpha.0",
+    "@storybook/addon-options": "5.1.0-alpha.0",
+    "@storybook/addon-storyshots": "5.1.0-alpha.0",
+    "@storybook/addon-storyshots-puppeteer": "5.1.0-alpha.0",
+    "@storybook/addon-storysource": "5.1.0-alpha.0",
+    "@storybook/addon-viewport": "5.1.0-alpha.0",
+    "@storybook/addons": "5.1.0-alpha.0",
+    "@storybook/components": "5.1.0-alpha.0",
+    "@storybook/core-events": "5.1.0-alpha.0",
+    "@storybook/node-logger": "5.1.0-alpha.0",
+    "@storybook/react": "5.1.0-alpha.0",
+    "@storybook/theming": "5.1.0-alpha.0",
     "cors": "^2.8.5",
     "cross-env": "^5.2.0",
     "enzyme-to-json": "^3.3.5",
diff --git a/examples/polymer-cli/package.json b/examples/polymer-cli/package.json
index 6c2d6f0fef5..403f38e4dfc 100644
--- a/examples/polymer-cli/package.json
+++ b/examples/polymer-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "polymer-cli",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -10,15 +10,15 @@
   },
   "dependencies": {
     "@polymer/polymer": "^2.6.0",
-    "@storybook/addon-actions": "5.0.0",
-    "@storybook/addon-backgrounds": "5.0.0",
-    "@storybook/addon-knobs": "5.0.0",
-    "@storybook/addon-links": "5.0.0",
-    "@storybook/addon-notes": "5.0.0",
-    "@storybook/addon-options": "5.0.0",
-    "@storybook/addon-storysource": "5.0.0",
-    "@storybook/addon-viewport": "5.0.0",
-    "@storybook/polymer": "5.0.0",
+    "@storybook/addon-actions": "5.1.0-alpha.0",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.0",
+    "@storybook/addon-knobs": "5.1.0-alpha.0",
+    "@storybook/addon-links": "5.1.0-alpha.0",
+    "@storybook/addon-notes": "5.1.0-alpha.0",
+    "@storybook/addon-options": "5.1.0-alpha.0",
+    "@storybook/addon-storysource": "5.1.0-alpha.0",
+    "@storybook/addon-viewport": "5.1.0-alpha.0",
+    "@storybook/polymer": "5.1.0-alpha.0",
     "@webcomponents/webcomponentsjs": "^1.2.0",
     "global": "^4.3.2",
     "lit-html": "^1.0.0",
diff --git a/examples/preact-kitchen-sink/package.json b/examples/preact-kitchen-sink/package.json
index 48d18114b8e..7258f0c4d76 100644
--- a/examples/preact-kitchen-sink/package.json
+++ b/examples/preact-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "preact-example",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -16,18 +16,18 @@
   "devDependencies": {
     "@babel/core": "^7.3.4",
     "@babel/plugin-transform-runtime": "^7.2.0",
-    "@storybook/addon-actions": "5.0.0",
-    "@storybook/addon-backgrounds": "5.0.0",
-    "@storybook/addon-centered": "5.0.0",
-    "@storybook/addon-knobs": "5.0.0",
-    "@storybook/addon-links": "5.0.0",
-    "@storybook/addon-notes": "5.0.0",
-    "@storybook/addon-options": "5.0.0",
-    "@storybook/addon-storyshots": "5.0.0",
-    "@storybook/addon-storysource": "5.0.0",
-    "@storybook/addon-viewport": "5.0.0",
-    "@storybook/addons": "5.0.0",
-    "@storybook/preact": "5.0.0",
+    "@storybook/addon-actions": "5.1.0-alpha.0",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.0",
+    "@storybook/addon-centered": "5.1.0-alpha.0",
+    "@storybook/addon-knobs": "5.1.0-alpha.0",
+    "@storybook/addon-links": "5.1.0-alpha.0",
+    "@storybook/addon-notes": "5.1.0-alpha.0",
+    "@storybook/addon-options": "5.1.0-alpha.0",
+    "@storybook/addon-storyshots": "5.1.0-alpha.0",
+    "@storybook/addon-storysource": "5.1.0-alpha.0",
+    "@storybook/addon-viewport": "5.1.0-alpha.0",
+    "@storybook/addons": "5.1.0-alpha.0",
+    "@storybook/preact": "5.1.0-alpha.0",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
     "file-loader": "^3.0.1",
diff --git a/examples/riot-kitchen-sink/package.json b/examples/riot-kitchen-sink/package.json
index 214b0de4841..916402ead97 100644
--- a/examples/riot-kitchen-sink/package.json
+++ b/examples/riot-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "riot-example",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -16,18 +16,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.3.4",
-    "@storybook/addon-actions": "5.0.0",
-    "@storybook/addon-backgrounds": "5.0.0",
-    "@storybook/addon-centered": "5.0.0",
-    "@storybook/addon-knobs": "5.0.0",
-    "@storybook/addon-links": "5.0.0",
-    "@storybook/addon-notes": "5.0.0",
-    "@storybook/addon-options": "5.0.0",
-    "@storybook/addon-storyshots": "5.0.0",
-    "@storybook/addon-storysource": "5.0.0",
-    "@storybook/addon-viewport": "5.0.0",
-    "@storybook/addons": "5.0.0",
-    "@storybook/riot": "5.0.0",
+    "@storybook/addon-actions": "5.1.0-alpha.0",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.0",
+    "@storybook/addon-centered": "5.1.0-alpha.0",
+    "@storybook/addon-knobs": "5.1.0-alpha.0",
+    "@storybook/addon-links": "5.1.0-alpha.0",
+    "@storybook/addon-notes": "5.1.0-alpha.0",
+    "@storybook/addon-options": "5.1.0-alpha.0",
+    "@storybook/addon-storyshots": "5.1.0-alpha.0",
+    "@storybook/addon-storysource": "5.1.0-alpha.0",
+    "@storybook/addon-viewport": "5.1.0-alpha.0",
+    "@storybook/addons": "5.1.0-alpha.0",
+    "@storybook/riot": "5.1.0-alpha.0",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
     "file-loader": "^3.0.1",
diff --git a/examples/svelte-kitchen-sink/package.json b/examples/svelte-kitchen-sink/package.json
index 39c61ef2bf5..31850c1e26e 100644
--- a/examples/svelte-kitchen-sink/package.json
+++ b/examples/svelte-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "svelte-example",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -11,17 +11,17 @@
     "global": "^4.3.2"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0",
-    "@storybook/addon-backgrounds": "5.0.0",
-    "@storybook/addon-centered": "5.0.0",
-    "@storybook/addon-knobs": "5.0.0",
-    "@storybook/addon-links": "5.0.0",
-    "@storybook/addon-notes": "5.0.0",
-    "@storybook/addon-options": "5.0.0",
-    "@storybook/addon-storyshots": "5.0.0",
-    "@storybook/addon-storysource": "5.0.0",
-    "@storybook/addon-viewport": "5.0.0",
-    "@storybook/addons": "5.0.0",
-    "@storybook/svelte": "5.0.0"
+    "@storybook/addon-actions": "5.1.0-alpha.0",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.0",
+    "@storybook/addon-centered": "5.1.0-alpha.0",
+    "@storybook/addon-knobs": "5.1.0-alpha.0",
+    "@storybook/addon-links": "5.1.0-alpha.0",
+    "@storybook/addon-notes": "5.1.0-alpha.0",
+    "@storybook/addon-options": "5.1.0-alpha.0",
+    "@storybook/addon-storyshots": "5.1.0-alpha.0",
+    "@storybook/addon-storysource": "5.1.0-alpha.0",
+    "@storybook/addon-viewport": "5.1.0-alpha.0",
+    "@storybook/addons": "5.1.0-alpha.0",
+    "@storybook/svelte": "5.1.0-alpha.0"
   }
 }
diff --git a/examples/vue-kitchen-sink/package.json b/examples/vue-kitchen-sink/package.json
index cfcdda21d15..c11620d54e5 100644
--- a/examples/vue-kitchen-sink/package.json
+++ b/examples/vue-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "vue-example",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -15,18 +15,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.3.4",
-    "@storybook/addon-actions": "5.0.0",
-    "@storybook/addon-backgrounds": "5.0.0",
-    "@storybook/addon-centered": "5.0.0",
-    "@storybook/addon-knobs": "5.0.0",
-    "@storybook/addon-links": "5.0.0",
-    "@storybook/addon-notes": "5.0.0",
-    "@storybook/addon-options": "5.0.0",
-    "@storybook/addon-storyshots": "5.0.0",
-    "@storybook/addon-storysource": "5.0.0",
-    "@storybook/addon-viewport": "5.0.0",
-    "@storybook/addons": "5.0.0",
-    "@storybook/vue": "5.0.0",
+    "@storybook/addon-actions": "5.1.0-alpha.0",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.0",
+    "@storybook/addon-centered": "5.1.0-alpha.0",
+    "@storybook/addon-knobs": "5.1.0-alpha.0",
+    "@storybook/addon-links": "5.1.0-alpha.0",
+    "@storybook/addon-notes": "5.1.0-alpha.0",
+    "@storybook/addon-options": "5.1.0-alpha.0",
+    "@storybook/addon-storyshots": "5.1.0-alpha.0",
+    "@storybook/addon-storysource": "5.1.0-alpha.0",
+    "@storybook/addon-viewport": "5.1.0-alpha.0",
+    "@storybook/addons": "5.1.0-alpha.0",
+    "@storybook/vue": "5.1.0-alpha.0",
     "babel-core": "^7.0.0-bridge.0",
     "babel-loader": "^8.0.5",
     "cross-env": "^5.2.0",
diff --git a/lerna.json b/lerna.json
index b539c60d507..f5123df625f 100644
--- a/lerna.json
+++ b/lerna.json
@@ -11,5 +11,5 @@
   "npmClient": "yarn",
   "useWorkspaces": true,
   "registry": "https://registry.npmjs.org",
-  "version": "5.0.0"
+  "version": "5.1.0-alpha.0"
 }
diff --git a/lib/addons/package.json b/lib/addons/package.json
index 83ef80c5254..c2cc691aacd 100644
--- a/lib/addons/package.json
+++ b/lib/addons/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addons",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "Storybook addons store",
   "keywords": [
     "storybook"
@@ -21,8 +21,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.0.0",
-    "@storybook/client-logger": "5.0.0",
+    "@storybook/channels": "5.1.0-alpha.0",
+    "@storybook/client-logger": "5.1.0-alpha.0",
     "global": "^4.3.2",
     "util-deprecate": "^1.0.2"
   },
diff --git a/lib/channel-postmessage/package.json b/lib/channel-postmessage/package.json
index f2f032de778..135d15f639d 100644
--- a/lib/channel-postmessage/package.json
+++ b/lib/channel-postmessage/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channel-postmessage",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "",
   "keywords": [
     "storybook"
@@ -21,8 +21,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.0.0",
-    "@storybook/client-logger": "5.0.0",
+    "@storybook/channels": "5.1.0-alpha.0",
+    "@storybook/client-logger": "5.1.0-alpha.0",
     "global": "^4.3.2",
     "telejson": "^2.1.1"
   },
diff --git a/lib/channel-websocket/package.json b/lib/channel-websocket/package.json
index 23c80edf2b8..4de1362e0c5 100644
--- a/lib/channel-websocket/package.json
+++ b/lib/channel-websocket/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channel-websocket",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "",
   "keywords": [
     "storybook"
@@ -21,7 +21,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.0.0",
+    "@storybook/channels": "5.1.0-alpha.0",
     "global": "^4.3.2",
     "json-fn": "^1.1.1"
   },
diff --git a/lib/channels/package.json b/lib/channels/package.json
index e53ba7a9bf6..e81b43d5193 100644
--- a/lib/channels/package.json
+++ b/lib/channels/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channels",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/cli/package.json b/lib/cli/package.json
index 012e13f2783..a70b0532b49 100644
--- a/lib/cli/package.json
+++ b/lib/cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/cli",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "Storybook's CLI - easiest method of adding storybook to your projects",
   "keywords": [
     "cli",
@@ -30,7 +30,7 @@
     "@babel/core": "^7.3.4",
     "@babel/preset-env": "^7.3.4",
     "@babel/register": "^7.0.0",
-    "@storybook/codemod": "5.0.0",
+    "@storybook/codemod": "5.1.0-alpha.0",
     "chalk": "^2.4.1",
     "commander": "^2.19.0",
     "core-js": "^2.6.5",
@@ -44,31 +44,31 @@
     "update-notifier": "^2.5.0"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.0.0",
-    "@storybook/addon-centered": "5.0.0",
-    "@storybook/addon-graphql": "5.0.0",
-    "@storybook/addon-info": "5.0.0",
-    "@storybook/addon-knobs": "5.0.0",
-    "@storybook/addon-links": "5.0.0",
-    "@storybook/addon-notes": "5.0.0",
-    "@storybook/addon-options": "5.0.0",
-    "@storybook/addon-storyshots": "5.0.0",
-    "@storybook/addons": "5.0.0",
-    "@storybook/angular": "5.0.0",
-    "@storybook/channel-postmessage": "5.0.0",
-    "@storybook/channel-websocket": "5.0.0",
-    "@storybook/channels": "5.0.0",
-    "@storybook/ember": "5.0.0",
-    "@storybook/html": "5.0.0",
-    "@storybook/marko": "5.0.0",
-    "@storybook/mithril": "5.0.0",
-    "@storybook/polymer": "5.0.0",
-    "@storybook/preact": "5.0.0",
-    "@storybook/react": "5.0.0",
-    "@storybook/react-native": "5.0.0",
-    "@storybook/riot": "5.0.0",
-    "@storybook/ui": "5.0.0",
-    "@storybook/vue": "5.0.0"
+    "@storybook/addon-actions": "5.1.0-alpha.0",
+    "@storybook/addon-centered": "5.1.0-alpha.0",
+    "@storybook/addon-graphql": "5.1.0-alpha.0",
+    "@storybook/addon-info": "5.1.0-alpha.0",
+    "@storybook/addon-knobs": "5.1.0-alpha.0",
+    "@storybook/addon-links": "5.1.0-alpha.0",
+    "@storybook/addon-notes": "5.1.0-alpha.0",
+    "@storybook/addon-options": "5.1.0-alpha.0",
+    "@storybook/addon-storyshots": "5.1.0-alpha.0",
+    "@storybook/addons": "5.1.0-alpha.0",
+    "@storybook/angular": "5.1.0-alpha.0",
+    "@storybook/channel-postmessage": "5.1.0-alpha.0",
+    "@storybook/channel-websocket": "5.1.0-alpha.0",
+    "@storybook/channels": "5.1.0-alpha.0",
+    "@storybook/ember": "5.1.0-alpha.0",
+    "@storybook/html": "5.1.0-alpha.0",
+    "@storybook/marko": "5.1.0-alpha.0",
+    "@storybook/mithril": "5.1.0-alpha.0",
+    "@storybook/polymer": "5.1.0-alpha.0",
+    "@storybook/preact": "5.1.0-alpha.0",
+    "@storybook/react": "5.1.0-alpha.0",
+    "@storybook/react-native": "5.1.0-alpha.0",
+    "@storybook/riot": "5.1.0-alpha.0",
+    "@storybook/ui": "5.1.0-alpha.0",
+    "@storybook/vue": "5.1.0-alpha.0"
   },
   "publishConfig": {
     "access": "public"
diff --git a/lib/client-api/package.json b/lib/client-api/package.json
index b5c7a433cf2..edefc531ed2 100644
--- a/lib/client-api/package.json
+++ b/lib/client-api/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/client-api",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "Storybook Client API",
   "keywords": [
     "storybook"
@@ -20,10 +20,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0",
-    "@storybook/client-logger": "5.0.0",
-    "@storybook/core-events": "5.0.0",
-    "@storybook/router": "5.0.0",
+    "@storybook/addons": "5.1.0-alpha.0",
+    "@storybook/client-logger": "5.1.0-alpha.0",
+    "@storybook/core-events": "5.1.0-alpha.0",
+    "@storybook/router": "5.1.0-alpha.0",
     "common-tags": "^1.8.0",
     "eventemitter3": "^3.1.0",
     "global": "^4.3.2",
diff --git a/lib/client-logger/package.json b/lib/client-logger/package.json
index 17f7a26c2fa..e463440b258 100644
--- a/lib/client-logger/package.json
+++ b/lib/client-logger/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/client-logger",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/codemod/package.json b/lib/codemod/package.json
index d8d3b3ab085..f391a3799db 100644
--- a/lib/codemod/package.json
+++ b/lib/codemod/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/codemod",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "A collection of codemod scripts written with JSCodeshift",
   "keywords": [
     "storybook"
diff --git a/lib/components/package.json b/lib/components/package.json
index 62e5e7a314b..37e8fef0b4c 100644
--- a/lib/components/package.json
+++ b/lib/components/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/components",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "Core Storybook Components",
   "keywords": [
     "storybook"
@@ -21,11 +21,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0",
-    "@storybook/client-logger": "5.0.0",
-    "@storybook/core-events": "5.0.0",
-    "@storybook/router": "5.0.0",
-    "@storybook/theming": "5.0.0",
+    "@storybook/addons": "5.1.0-alpha.0",
+    "@storybook/client-logger": "5.1.0-alpha.0",
+    "@storybook/core-events": "5.1.0-alpha.0",
+    "@storybook/router": "5.1.0-alpha.0",
+    "@storybook/theming": "5.1.0-alpha.0",
     "global": "^4.3.2",
     "js-beautify": "^1.8.9",
     "memoizerific": "^1.11.3",
diff --git a/lib/core-events/package.json b/lib/core-events/package.json
index 0c7f1046ac5..61535d2b9ec 100644
--- a/lib/core-events/package.json
+++ b/lib/core-events/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/core-events",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "Event names used in storybook core",
   "keywords": [
     "storybook"
diff --git a/lib/core/package.json b/lib/core/package.json
index 87d0a9216ab..73c1a9ad5c7 100644
--- a/lib/core/package.json
+++ b/lib/core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/core",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "Storybook framework-agnostic API",
   "keywords": [
     "storybook"
@@ -25,14 +25,14 @@
     "@babel/plugin-syntax-dynamic-import": "^7.2.0",
     "@babel/plugin-transform-react-constant-elements": "^7.2.0",
     "@babel/preset-env": "^7.3.4",
-    "@storybook/addons": "5.0.0",
-    "@storybook/channel-postmessage": "5.0.0",
-    "@storybook/client-api": "5.0.0",
-    "@storybook/client-logger": "5.0.0",
-    "@storybook/core-events": "5.0.0",
-    "@storybook/node-logger": "5.0.0",
-    "@storybook/router": "5.0.0",
-    "@storybook/ui": "5.0.0",
+    "@storybook/addons": "5.1.0-alpha.0",
+    "@storybook/channel-postmessage": "5.1.0-alpha.0",
+    "@storybook/client-api": "5.1.0-alpha.0",
+    "@storybook/client-logger": "5.1.0-alpha.0",
+    "@storybook/core-events": "5.1.0-alpha.0",
+    "@storybook/node-logger": "5.1.0-alpha.0",
+    "@storybook/router": "5.1.0-alpha.0",
+    "@storybook/ui": "5.1.0-alpha.0",
     "airbnb-js-shims": "^1 || ^2",
     "autoprefixer": "^9.4.9",
     "babel-plugin-add-react-displayname": "^0.0.5",
diff --git a/lib/node-logger/package.json b/lib/node-logger/package.json
index a9e359136af..749da8d99f6 100644
--- a/lib/node-logger/package.json
+++ b/lib/node-logger/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/node-logger",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/router/package.json b/lib/router/package.json
index 3f8f49c71aa..9c0854f5b88 100644
--- a/lib/router/package.json
+++ b/lib/router/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/router",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "Core Storybook Router",
   "keywords": [
     "storybook"
@@ -21,7 +21,7 @@
   },
   "dependencies": {
     "@reach/router": "^1.2.1",
-    "@storybook/theming": "5.0.0",
+    "@storybook/theming": "5.1.0-alpha.0",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
     "qs": "^6.6.0"
diff --git a/lib/theming/package.json b/lib/theming/package.json
index 4aa7133c502..20bf1286d46 100644
--- a/lib/theming/package.json
+++ b/lib/theming/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/theming",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "Core Storybook Components",
   "keywords": [
     "storybook"
@@ -23,7 +23,7 @@
   "dependencies": {
     "@emotion/core": "^10.0.7",
     "@emotion/styled": "^10.0.7",
-    "@storybook/client-logger": "5.0.0",
+    "@storybook/client-logger": "5.1.0-alpha.0",
     "common-tags": "^1.8.0",
     "deep-object-diff": "^1.1.0",
     "emotion-theming": "^10.0.7",
diff --git a/lib/ui/package.json b/lib/ui/package.json
index 97195e6a56e..009758e2f8c 100644
--- a/lib/ui/package.json
+++ b/lib/ui/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/ui",
-  "version": "5.0.0",
+  "version": "5.1.0-alpha.0",
   "description": "Core Storybook UI",
   "keywords": [
     "storybook"
@@ -22,12 +22,12 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.0.0",
-    "@storybook/client-logger": "5.0.0",
-    "@storybook/components": "5.0.0",
-    "@storybook/core-events": "5.0.0",
-    "@storybook/router": "5.0.0",
-    "@storybook/theming": "5.0.0",
+    "@storybook/addons": "5.1.0-alpha.0",
+    "@storybook/client-logger": "5.1.0-alpha.0",
+    "@storybook/components": "5.1.0-alpha.0",
+    "@storybook/core-events": "5.1.0-alpha.0",
+    "@storybook/router": "5.1.0-alpha.0",
+    "@storybook/theming": "5.1.0-alpha.0",
     "fast-deep-equal": "^2.0.1",
     "fuzzy-search": "^3.0.1",
     "global": "^4.3.2",

From 923465f46d970f5ca62506b5c251dba7f6c8072c Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Wed, 6 Mar 2019 10:54:56 +0800
Subject: [PATCH 167/249] 5.0.0-alpha.0 versions.json

---
 docs/static/versions.json | 15 +--------------
 1 file changed, 1 insertion(+), 14 deletions(-)

diff --git a/docs/static/versions.json b/docs/static/versions.json
index fae9ae04439..3fa567fec2b 100644
--- a/docs/static/versions.json
+++ b/docs/static/versions.json
@@ -1,14 +1 @@
-{
-  "next": {
-    "version": "5.0.0-rc.11",
-    "info": {
-      "plain": "### Bug Fixes\n\n* UI: Fix base theme initialization and theme bootup ([#5843](https://github.com/storybooks/storybook/pull/5843))\n* UI: Fix SidebarItem feels \"laggy\" when clicked ([#5850](https://github.com/storybooks/storybook/pull/5850))"
-    }
-  },
-  "latest": {
-    "version": "5.0.0",
-    "info": {
-      "plain": "Storybook 5.0 is a completely new UI with the following improvements:\n\n- 🌓 New design with light and dark themes\n- 🛠 Canvas toolbar for easy access to addons\n- 🗺 Overhauled navigation sidebar with an intuitive menu\n- 🗜 Redesigned addons panel with handy buttons to toggle visibility and orientation\n- ⌨️ Improved keyboard shortcuts that are user configurable\n- 🌍 New URL structure that eliminates long strings of query parameters\n\n5.0 contains hundreds more fixes, features, and tweaks. Browse the changelogs matching `5.0.0-alpha.*`, `5.0.0-beta.*`, and `5.0.0-rc.*` for the full list of changes. See [MIGRATION.md](https://github.com/storybooks/storybook/blob/next/MIGRATION.md) to ugprade from `4.x`."
-    }
-  }
-}
+{"next":{"version":"5.1.0-alpha.0","info":{"plain":"### Features\n\n* UI: Custom scrollbars ([#5714](https://github.com/storybooks/storybook/pull/5714))\n\n### Bug Fixes\n\n* Fix: Move `react-select` dependency to 2.2 ([#5867](https://github.com/storybooks/storybook/pull/5867))\n\n### Maintenance\n\n* Cleanup unused dependencies ([#5453](https://github.com/storybooks/storybook/pull/5453))\n* Add directory attribute to repositories in package.json files ([#5643](https://github.com/storybooks/storybook/pull/5643))\n\n### Dependency Upgrades\n\n* Project-wide dependency upgrades ([#5740](https://github.com/storybooks/storybook/pull/5740))\n* Bump react-is from 16.8.1 to 16.8.3 ([#5743](https://github.com/storybooks/storybook/pull/5743))\n* Bump danger from 7.0.13 to 7.0.14 ([#5744](https://github.com/storybooks/storybook/pull/5744))\n* Bump babel-plugin-named-asset-import from 0.3.0 to 0.3.1 ([#5745](https://github.com/storybooks/storybook/pull/5745))\n* Bump eslint-plugin-json from 1.3.2 to 1.4.0 ([#5719](https://github.com/storybooks/storybook/pull/5719))\n* Bump react-native-modal-datetime-picker from 5.1.0 to 6.0.0 ([#4425](https://github.com/storybooks/storybook/pull/4425))\n* Bump immer from 1.12.0 to 2.0.0 ([#5694](https://github.com/storybooks/storybook/pull/5694))\n* Bump danger from 7.0.11 to 7.0.13 ([#5696](https://github.com/storybooks/storybook/pull/5696))\n* Bump eslint-plugin-jsx-a11y from 6.2.0 to 6.2.1 ([#5698](https://github.com/storybooks/storybook/pull/5698))\n* Bump @angular/platform-browser-dynamic from 7.2.4 to 7.2.6 ([#5697](https://github.com/storybooks/storybook/pull/5697))\n* Bump eslint from 5.12.1 to 5.14.1 ([#5653](https://github.com/storybooks/storybook/pull/5653))\n* Bump babel-preset-react-app from 7.0.0 to 7.0.1 ([#5674](https://github.com/storybooks/storybook/pull/5674))\n* Bump react from 16.8.1 to 16.8.2 ([#5673](https://github.com/storybooks/storybook/pull/5673))\n* Bump @angular/cli from 7.3.0 to 7.3.2 ([#5654](https://github.com/storybooks/storybook/pull/5654))\n* Bump @types/jest from 24.0.0 to 24.0.6 ([#5655](https://github.com/storybooks/storybook/pull/5655))\n* Bump lint-staged from 8.1.3 to 8.1.4 ([#5606](https://github.com/storybooks/storybook/pull/5606))\n* Bump @types/lodash from 4.14.120 to 4.14.121 ([#5609](https://github.com/storybooks/storybook/pull/5609))\n* Bump webpack from 4.29.0 to 4.29.3 ([#5570](https://github.com/storybooks/storybook/pull/5570))\n* update modal manager for rn 0.58 support ([#5581](https://github.com/storybooks/storybook/pull/5581))\n* Bump danger from 7.0.7 to 7.0.11 ([#5568](https://github.com/storybooks/storybook/pull/5568))\n* Bump jest-jasmine2 from 24.0.0 to 24.1.0 ([#5569](https://github.com/storybooks/storybook/pull/5569))\n* Bump jest-jasmine2 from 24.0.0 to 24.1.0 ([#5567](https://github.com/storybooks/storybook/pull/5567))\n* Bump handlebars from 4.0.12 to 4.1.0 ([#5576](https://github.com/storybooks/storybook/pull/5576))\n* Bump esm from 3.2.1 to 3.2.4 ([#5556](https://github.com/storybooks/storybook/pull/5556))\n* Bump @types/jest from 23.3.13 to 24.0.0 ([#5554](https://github.com/storybooks/storybook/pull/5554))\n* Bump webpack-dev-middleware from 3.5.1 to 3.5.2 ([#5552](https://github.com/storybooks/storybook/pull/5552))\n* Bump @emotion/core from 10.0.6 to 10.0.7 ([#5555](https://github.com/storybooks/storybook/pull/5555))\n* Bump terser-webpack-plugin from 1.2.1 to 1.2.2 ([#5553](https://github.com/storybooks/storybook/pull/5553))\n* Bump fuse.js from 3.3.1 to 3.4.2 ([#5538](https://github.com/storybooks/storybook/pull/5538))\n* Bump @angular/platform-browser-dynamic from 7.2.3 to 7.2.4 ([#5540](https://github.com/storybooks/storybook/pull/5540))\n* Bump emotion-theming from 10.0.6 to 10.0.7 ([#5541](https://github.com/storybooks/storybook/pull/5541))\n* Bump eslint-config-prettier from 3.6.0 to 4.0.0 ([#5539](https://github.com/storybooks/storybook/pull/5539))"}},"latest":{"version":"5.0.0","info":{"plain":"Storybook 5.0 is a completely new UI with the following improvements:\n\n- 🌓 New design with light and dark themes\n- 🛠 Canvas toolbar for easy access to addons\n- 🗺 Overhauled navigation sidebar with an intuitive menu\n- 🗜 Redesigned addons panel with handy buttons to toggle visibility and orientation\n- ⌨️ Improved keyboard shortcuts that are user configurable\n- 🌍 New URL structure that eliminates long strings of query parameters\n\n5.0 contains hundreds more fixes, features, and tweaks. Browse the changelogs matching `5.0.0-alpha.*`, `5.0.0-beta.*`, and `5.0.0-rc.*` for the full list of changes. See [MIGRATION.md](https://github.com/storybooks/storybook/blob/next/MIGRATION.md) to ugprade from `4.x`."}}}
\ No newline at end of file

From 4f57a412fd942dce199817b844c85e3f2f47ccb7 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Wed, 6 Mar 2019 10:54:56 +0800
Subject: [PATCH 168/249] 5.0.0-alpha.0 versions.json

---
 docs/static/versions.json | 15 +--------------
 1 file changed, 1 insertion(+), 14 deletions(-)

diff --git a/docs/static/versions.json b/docs/static/versions.json
index fae9ae04439..3fa567fec2b 100644
--- a/docs/static/versions.json
+++ b/docs/static/versions.json
@@ -1,14 +1 @@
-{
-  "next": {
-    "version": "5.0.0-rc.11",
-    "info": {
-      "plain": "### Bug Fixes\n\n* UI: Fix base theme initialization and theme bootup ([#5843](https://github.com/storybooks/storybook/pull/5843))\n* UI: Fix SidebarItem feels \"laggy\" when clicked ([#5850](https://github.com/storybooks/storybook/pull/5850))"
-    }
-  },
-  "latest": {
-    "version": "5.0.0",
-    "info": {
-      "plain": "Storybook 5.0 is a completely new UI with the following improvements:\n\n- 🌓 New design with light and dark themes\n- 🛠 Canvas toolbar for easy access to addons\n- 🗺 Overhauled navigation sidebar with an intuitive menu\n- 🗜 Redesigned addons panel with handy buttons to toggle visibility and orientation\n- ⌨️ Improved keyboard shortcuts that are user configurable\n- 🌍 New URL structure that eliminates long strings of query parameters\n\n5.0 contains hundreds more fixes, features, and tweaks. Browse the changelogs matching `5.0.0-alpha.*`, `5.0.0-beta.*`, and `5.0.0-rc.*` for the full list of changes. See [MIGRATION.md](https://github.com/storybooks/storybook/blob/next/MIGRATION.md) to ugprade from `4.x`."
-    }
-  }
-}
+{"next":{"version":"5.1.0-alpha.0","info":{"plain":"### Features\n\n* UI: Custom scrollbars ([#5714](https://github.com/storybooks/storybook/pull/5714))\n\n### Bug Fixes\n\n* Fix: Move `react-select` dependency to 2.2 ([#5867](https://github.com/storybooks/storybook/pull/5867))\n\n### Maintenance\n\n* Cleanup unused dependencies ([#5453](https://github.com/storybooks/storybook/pull/5453))\n* Add directory attribute to repositories in package.json files ([#5643](https://github.com/storybooks/storybook/pull/5643))\n\n### Dependency Upgrades\n\n* Project-wide dependency upgrades ([#5740](https://github.com/storybooks/storybook/pull/5740))\n* Bump react-is from 16.8.1 to 16.8.3 ([#5743](https://github.com/storybooks/storybook/pull/5743))\n* Bump danger from 7.0.13 to 7.0.14 ([#5744](https://github.com/storybooks/storybook/pull/5744))\n* Bump babel-plugin-named-asset-import from 0.3.0 to 0.3.1 ([#5745](https://github.com/storybooks/storybook/pull/5745))\n* Bump eslint-plugin-json from 1.3.2 to 1.4.0 ([#5719](https://github.com/storybooks/storybook/pull/5719))\n* Bump react-native-modal-datetime-picker from 5.1.0 to 6.0.0 ([#4425](https://github.com/storybooks/storybook/pull/4425))\n* Bump immer from 1.12.0 to 2.0.0 ([#5694](https://github.com/storybooks/storybook/pull/5694))\n* Bump danger from 7.0.11 to 7.0.13 ([#5696](https://github.com/storybooks/storybook/pull/5696))\n* Bump eslint-plugin-jsx-a11y from 6.2.0 to 6.2.1 ([#5698](https://github.com/storybooks/storybook/pull/5698))\n* Bump @angular/platform-browser-dynamic from 7.2.4 to 7.2.6 ([#5697](https://github.com/storybooks/storybook/pull/5697))\n* Bump eslint from 5.12.1 to 5.14.1 ([#5653](https://github.com/storybooks/storybook/pull/5653))\n* Bump babel-preset-react-app from 7.0.0 to 7.0.1 ([#5674](https://github.com/storybooks/storybook/pull/5674))\n* Bump react from 16.8.1 to 16.8.2 ([#5673](https://github.com/storybooks/storybook/pull/5673))\n* Bump @angular/cli from 7.3.0 to 7.3.2 ([#5654](https://github.com/storybooks/storybook/pull/5654))\n* Bump @types/jest from 24.0.0 to 24.0.6 ([#5655](https://github.com/storybooks/storybook/pull/5655))\n* Bump lint-staged from 8.1.3 to 8.1.4 ([#5606](https://github.com/storybooks/storybook/pull/5606))\n* Bump @types/lodash from 4.14.120 to 4.14.121 ([#5609](https://github.com/storybooks/storybook/pull/5609))\n* Bump webpack from 4.29.0 to 4.29.3 ([#5570](https://github.com/storybooks/storybook/pull/5570))\n* update modal manager for rn 0.58 support ([#5581](https://github.com/storybooks/storybook/pull/5581))\n* Bump danger from 7.0.7 to 7.0.11 ([#5568](https://github.com/storybooks/storybook/pull/5568))\n* Bump jest-jasmine2 from 24.0.0 to 24.1.0 ([#5569](https://github.com/storybooks/storybook/pull/5569))\n* Bump jest-jasmine2 from 24.0.0 to 24.1.0 ([#5567](https://github.com/storybooks/storybook/pull/5567))\n* Bump handlebars from 4.0.12 to 4.1.0 ([#5576](https://github.com/storybooks/storybook/pull/5576))\n* Bump esm from 3.2.1 to 3.2.4 ([#5556](https://github.com/storybooks/storybook/pull/5556))\n* Bump @types/jest from 23.3.13 to 24.0.0 ([#5554](https://github.com/storybooks/storybook/pull/5554))\n* Bump webpack-dev-middleware from 3.5.1 to 3.5.2 ([#5552](https://github.com/storybooks/storybook/pull/5552))\n* Bump @emotion/core from 10.0.6 to 10.0.7 ([#5555](https://github.com/storybooks/storybook/pull/5555))\n* Bump terser-webpack-plugin from 1.2.1 to 1.2.2 ([#5553](https://github.com/storybooks/storybook/pull/5553))\n* Bump fuse.js from 3.3.1 to 3.4.2 ([#5538](https://github.com/storybooks/storybook/pull/5538))\n* Bump @angular/platform-browser-dynamic from 7.2.3 to 7.2.4 ([#5540](https://github.com/storybooks/storybook/pull/5540))\n* Bump emotion-theming from 10.0.6 to 10.0.7 ([#5541](https://github.com/storybooks/storybook/pull/5541))\n* Bump eslint-config-prettier from 3.6.0 to 4.0.0 ([#5539](https://github.com/storybooks/storybook/pull/5539))"}},"latest":{"version":"5.0.0","info":{"plain":"Storybook 5.0 is a completely new UI with the following improvements:\n\n- 🌓 New design with light and dark themes\n- 🛠 Canvas toolbar for easy access to addons\n- 🗺 Overhauled navigation sidebar with an intuitive menu\n- 🗜 Redesigned addons panel with handy buttons to toggle visibility and orientation\n- ⌨️ Improved keyboard shortcuts that are user configurable\n- 🌍 New URL structure that eliminates long strings of query parameters\n\n5.0 contains hundreds more fixes, features, and tweaks. Browse the changelogs matching `5.0.0-alpha.*`, `5.0.0-beta.*`, and `5.0.0-rc.*` for the full list of changes. See [MIGRATION.md](https://github.com/storybooks/storybook/blob/next/MIGRATION.md) to ugprade from `4.x`."}}}
\ No newline at end of file

From d978defb1230487edb592d86016523fe54e2737a Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Wed, 6 Mar 2019 11:21:41 +0800
Subject: [PATCH 169/249] Split versions.json into two files to avoid constant
 merge conflicts

---
 docs/gatsby-node.js           | 19 +++++++++++++++++++
 docs/src/versions/latest.json |  6 ++++++
 docs/src/versions/next.json   |  6 ++++++
 docs/static/versions.json     |  1 -
 docs/versions.json            |  1 -
 5 files changed, 31 insertions(+), 2 deletions(-)
 create mode 100644 docs/src/versions/latest.json
 create mode 100644 docs/src/versions/next.json
 delete mode 100644 docs/static/versions.json
 delete mode 100644 docs/versions.json

diff --git a/docs/gatsby-node.js b/docs/gatsby-node.js
index 20b1735765f..e9676a818b3 100644
--- a/docs/gatsby-node.js
+++ b/docs/gatsby-node.js
@@ -14,6 +14,24 @@ function pagesToSitemap(pages) {
     }));
 }
 
+function getVersionData(distTag) {
+  const versionFile = `${__dirname}/src/versions/${distTag}.json`;
+  if (!fs.existsSync(versionFile)) {
+    return null;
+  }
+  const data = {
+    [distTag]: JSON.parse(fs.readFileSync(versionFile)),
+  };
+  return data;
+}
+
+function generateVersionsFile() {
+  const latest = getVersionData('latest');
+  const next = getVersionData('next');
+  const data = { ...latest, ...next };
+  fs.writeFileSync(`${__dirname}/public/versions.json`, JSON.stringify(data));
+}
+
 function generateSitemap(pages) {
   const sitemap = sm.createSitemap({
     hostname: 'https://storybook.js.org',
@@ -36,6 +54,7 @@ module.exports = {
         }
       }
     `);
+    generateVersionsFile();
     generateSitemap(result.data.allSitePage.edges.map(({ node }) => node));
   },
   onCreateNode({ node, boundActionCreators, getNode }) {
diff --git a/docs/src/versions/latest.json b/docs/src/versions/latest.json
new file mode 100644
index 00000000000..f45c59349c8
--- /dev/null
+++ b/docs/src/versions/latest.json
@@ -0,0 +1,6 @@
+{
+  "version": "5.0.0",
+  "info": {
+    "plain": "Storybook 5.0 is a completely new UI with the following improvements:\n\n- 🌓 New design with light and dark themes\n- 🛠 Canvas toolbar for easy access to addons\n- 🗺 Overhauled navigation sidebar with an intuitive menu\n- 🗜 Redesigned addons panel with handy buttons to toggle visibility and orientation\n- ⌨️ Improved keyboard shortcuts that are user configurable\n- 🌍 New URL structure that eliminates long strings of query parameters\n\n5.0 contains hundreds more fixes, features, and tweaks. Browse the changelogs matching `5.0.0-alpha.*`, `5.0.0-beta.*`, and `5.0.0-rc.*` for the full list of changes. See [MIGRATION.md](https://github.com/storybooks/storybook/blob/next/MIGRATION.md) to ugprade from `4.x`."
+  }
+}
diff --git a/docs/src/versions/next.json b/docs/src/versions/next.json
new file mode 100644
index 00000000000..d4fe638c271
--- /dev/null
+++ b/docs/src/versions/next.json
@@ -0,0 +1,6 @@
+{
+  "version": "5.1.0-alpha.0",
+  "info": {
+    "plain": "### Features\n\n* UI: Custom scrollbars ([#5714](https://github.com/storybooks/storybook/pull/5714))\n\n### Bug Fixes\n\n* Fix: Move `react-select` dependency to 2.2 ([#5867](https://github.com/storybooks/storybook/pull/5867))\n\n### Maintenance\n\n* Cleanup unused dependencies ([#5453](https://github.com/storybooks/storybook/pull/5453))\n* Add directory attribute to repositories in package.json files ([#5643](https://github.com/storybooks/storybook/pull/5643))\n\n### Dependency Upgrades\n\n* Project-wide dependency upgrades ([#5740](https://github.com/storybooks/storybook/pull/5740))\n* Bump react-is from 16.8.1 to 16.8.3 ([#5743](https://github.com/storybooks/storybook/pull/5743))\n* Bump danger from 7.0.13 to 7.0.14 ([#5744](https://github.com/storybooks/storybook/pull/5744))\n* Bump babel-plugin-named-asset-import from 0.3.0 to 0.3.1 ([#5745](https://github.com/storybooks/storybook/pull/5745))\n* Bump eslint-plugin-json from 1.3.2 to 1.4.0 ([#5719](https://github.com/storybooks/storybook/pull/5719))\n* Bump react-native-modal-datetime-picker from 5.1.0 to 6.0.0 ([#4425](https://github.com/storybooks/storybook/pull/4425))\n* Bump immer from 1.12.0 to 2.0.0 ([#5694](https://github.com/storybooks/storybook/pull/5694))\n* Bump danger from 7.0.11 to 7.0.13 ([#5696](https://github.com/storybooks/storybook/pull/5696))\n* Bump eslint-plugin-jsx-a11y from 6.2.0 to 6.2.1 ([#5698](https://github.com/storybooks/storybook/pull/5698))\n* Bump @angular/platform-browser-dynamic from 7.2.4 to 7.2.6 ([#5697](https://github.com/storybooks/storybook/pull/5697))\n* Bump eslint from 5.12.1 to 5.14.1 ([#5653](https://github.com/storybooks/storybook/pull/5653))\n* Bump babel-preset-react-app from 7.0.0 to 7.0.1 ([#5674](https://github.com/storybooks/storybook/pull/5674))\n* Bump react from 16.8.1 to 16.8.2 ([#5673](https://github.com/storybooks/storybook/pull/5673))\n* Bump @angular/cli from 7.3.0 to 7.3.2 ([#5654](https://github.com/storybooks/storybook/pull/5654))\n* Bump @types/jest from 24.0.0 to 24.0.6 ([#5655](https://github.com/storybooks/storybook/pull/5655))\n* Bump lint-staged from 8.1.3 to 8.1.4 ([#5606](https://github.com/storybooks/storybook/pull/5606))\n* Bump @types/lodash from 4.14.120 to 4.14.121 ([#5609](https://github.com/storybooks/storybook/pull/5609))\n* Bump webpack from 4.29.0 to 4.29.3 ([#5570](https://github.com/storybooks/storybook/pull/5570))\n* update modal manager for rn 0.58 support ([#5581](https://github.com/storybooks/storybook/pull/5581))\n* Bump danger from 7.0.7 to 7.0.11 ([#5568](https://github.com/storybooks/storybook/pull/5568))\n* Bump jest-jasmine2 from 24.0.0 to 24.1.0 ([#5569](https://github.com/storybooks/storybook/pull/5569))\n* Bump jest-jasmine2 from 24.0.0 to 24.1.0 ([#5567](https://github.com/storybooks/storybook/pull/5567))\n* Bump handlebars from 4.0.12 to 4.1.0 ([#5576](https://github.com/storybooks/storybook/pull/5576))\n* Bump esm from 3.2.1 to 3.2.4 ([#5556](https://github.com/storybooks/storybook/pull/5556))\n* Bump @types/jest from 23.3.13 to 24.0.0 ([#5554](https://github.com/storybooks/storybook/pull/5554))\n* Bump webpack-dev-middleware from 3.5.1 to 3.5.2 ([#5552](https://github.com/storybooks/storybook/pull/5552))\n* Bump @emotion/core from 10.0.6 to 10.0.7 ([#5555](https://github.com/storybooks/storybook/pull/5555))\n* Bump terser-webpack-plugin from 1.2.1 to 1.2.2 ([#5553](https://github.com/storybooks/storybook/pull/5553))\n* Bump fuse.js from 3.3.1 to 3.4.2 ([#5538](https://github.com/storybooks/storybook/pull/5538))\n* Bump @angular/platform-browser-dynamic from 7.2.3 to 7.2.4 ([#5540](https://github.com/storybooks/storybook/pull/5540))\n* Bump emotion-theming from 10.0.6 to 10.0.7 ([#5541](https://github.com/storybooks/storybook/pull/5541))\n* Bump eslint-config-prettier from 3.6.0 to 4.0.0 ([#5539](https://github.com/storybooks/storybook/pull/5539))"
+  }
+}
diff --git a/docs/static/versions.json b/docs/static/versions.json
deleted file mode 100644
index 3fa567fec2b..00000000000
--- a/docs/static/versions.json
+++ /dev/null
@@ -1 +0,0 @@
-{"next":{"version":"5.1.0-alpha.0","info":{"plain":"### Features\n\n* UI: Custom scrollbars ([#5714](https://github.com/storybooks/storybook/pull/5714))\n\n### Bug Fixes\n\n* Fix: Move `react-select` dependency to 2.2 ([#5867](https://github.com/storybooks/storybook/pull/5867))\n\n### Maintenance\n\n* Cleanup unused dependencies ([#5453](https://github.com/storybooks/storybook/pull/5453))\n* Add directory attribute to repositories in package.json files ([#5643](https://github.com/storybooks/storybook/pull/5643))\n\n### Dependency Upgrades\n\n* Project-wide dependency upgrades ([#5740](https://github.com/storybooks/storybook/pull/5740))\n* Bump react-is from 16.8.1 to 16.8.3 ([#5743](https://github.com/storybooks/storybook/pull/5743))\n* Bump danger from 7.0.13 to 7.0.14 ([#5744](https://github.com/storybooks/storybook/pull/5744))\n* Bump babel-plugin-named-asset-import from 0.3.0 to 0.3.1 ([#5745](https://github.com/storybooks/storybook/pull/5745))\n* Bump eslint-plugin-json from 1.3.2 to 1.4.0 ([#5719](https://github.com/storybooks/storybook/pull/5719))\n* Bump react-native-modal-datetime-picker from 5.1.0 to 6.0.0 ([#4425](https://github.com/storybooks/storybook/pull/4425))\n* Bump immer from 1.12.0 to 2.0.0 ([#5694](https://github.com/storybooks/storybook/pull/5694))\n* Bump danger from 7.0.11 to 7.0.13 ([#5696](https://github.com/storybooks/storybook/pull/5696))\n* Bump eslint-plugin-jsx-a11y from 6.2.0 to 6.2.1 ([#5698](https://github.com/storybooks/storybook/pull/5698))\n* Bump @angular/platform-browser-dynamic from 7.2.4 to 7.2.6 ([#5697](https://github.com/storybooks/storybook/pull/5697))\n* Bump eslint from 5.12.1 to 5.14.1 ([#5653](https://github.com/storybooks/storybook/pull/5653))\n* Bump babel-preset-react-app from 7.0.0 to 7.0.1 ([#5674](https://github.com/storybooks/storybook/pull/5674))\n* Bump react from 16.8.1 to 16.8.2 ([#5673](https://github.com/storybooks/storybook/pull/5673))\n* Bump @angular/cli from 7.3.0 to 7.3.2 ([#5654](https://github.com/storybooks/storybook/pull/5654))\n* Bump @types/jest from 24.0.0 to 24.0.6 ([#5655](https://github.com/storybooks/storybook/pull/5655))\n* Bump lint-staged from 8.1.3 to 8.1.4 ([#5606](https://github.com/storybooks/storybook/pull/5606))\n* Bump @types/lodash from 4.14.120 to 4.14.121 ([#5609](https://github.com/storybooks/storybook/pull/5609))\n* Bump webpack from 4.29.0 to 4.29.3 ([#5570](https://github.com/storybooks/storybook/pull/5570))\n* update modal manager for rn 0.58 support ([#5581](https://github.com/storybooks/storybook/pull/5581))\n* Bump danger from 7.0.7 to 7.0.11 ([#5568](https://github.com/storybooks/storybook/pull/5568))\n* Bump jest-jasmine2 from 24.0.0 to 24.1.0 ([#5569](https://github.com/storybooks/storybook/pull/5569))\n* Bump jest-jasmine2 from 24.0.0 to 24.1.0 ([#5567](https://github.com/storybooks/storybook/pull/5567))\n* Bump handlebars from 4.0.12 to 4.1.0 ([#5576](https://github.com/storybooks/storybook/pull/5576))\n* Bump esm from 3.2.1 to 3.2.4 ([#5556](https://github.com/storybooks/storybook/pull/5556))\n* Bump @types/jest from 23.3.13 to 24.0.0 ([#5554](https://github.com/storybooks/storybook/pull/5554))\n* Bump webpack-dev-middleware from 3.5.1 to 3.5.2 ([#5552](https://github.com/storybooks/storybook/pull/5552))\n* Bump @emotion/core from 10.0.6 to 10.0.7 ([#5555](https://github.com/storybooks/storybook/pull/5555))\n* Bump terser-webpack-plugin from 1.2.1 to 1.2.2 ([#5553](https://github.com/storybooks/storybook/pull/5553))\n* Bump fuse.js from 3.3.1 to 3.4.2 ([#5538](https://github.com/storybooks/storybook/pull/5538))\n* Bump @angular/platform-browser-dynamic from 7.2.3 to 7.2.4 ([#5540](https://github.com/storybooks/storybook/pull/5540))\n* Bump emotion-theming from 10.0.6 to 10.0.7 ([#5541](https://github.com/storybooks/storybook/pull/5541))\n* Bump eslint-config-prettier from 3.6.0 to 4.0.0 ([#5539](https://github.com/storybooks/storybook/pull/5539))"}},"latest":{"version":"5.0.0","info":{"plain":"Storybook 5.0 is a completely new UI with the following improvements:\n\n- 🌓 New design with light and dark themes\n- 🛠 Canvas toolbar for easy access to addons\n- 🗺 Overhauled navigation sidebar with an intuitive menu\n- 🗜 Redesigned addons panel with handy buttons to toggle visibility and orientation\n- ⌨️ Improved keyboard shortcuts that are user configurable\n- 🌍 New URL structure that eliminates long strings of query parameters\n\n5.0 contains hundreds more fixes, features, and tweaks. Browse the changelogs matching `5.0.0-alpha.*`, `5.0.0-beta.*`, and `5.0.0-rc.*` for the full list of changes. See [MIGRATION.md](https://github.com/storybooks/storybook/blob/next/MIGRATION.md) to ugprade from `4.x`."}}}
\ No newline at end of file
diff --git a/docs/versions.json b/docs/versions.json
deleted file mode 100644
index 451f64c66e8..00000000000
--- a/docs/versions.json
+++ /dev/null
@@ -1 +0,0 @@
-{"next":{"version":"5.0.0-rc.3","info":{"plain":"### Bug Fixes\n\n* UI: Styling bug fixes, story updates, and more QA ([#5650](https://github.com/storybooks/storybook/pull/5650))\n* UI: V5 style refinements ([#5562](https://github.com/storybooks/storybook/pull/5562))"}}}
\ No newline at end of file

From 8998c58d3eab0b33544aa6a6d1b9ad345762e720 Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Wed, 6 Mar 2019 11:35:56 +0800
Subject: [PATCH 170/249] Merge pull request #5896 from
 storybooks/split-versions-json

Split versions.json into two files
---
 docs/gatsby-node.js           | 19 +++++++++++++++++++
 docs/src/versions/latest.json |  6 ++++++
 docs/src/versions/next.json   |  6 ++++++
 docs/static/versions.json     |  1 -
 docs/versions.json            |  1 -
 5 files changed, 31 insertions(+), 2 deletions(-)
 create mode 100644 docs/src/versions/latest.json
 create mode 100644 docs/src/versions/next.json
 delete mode 100644 docs/static/versions.json
 delete mode 100644 docs/versions.json

diff --git a/docs/gatsby-node.js b/docs/gatsby-node.js
index 20b1735765f..e9676a818b3 100644
--- a/docs/gatsby-node.js
+++ b/docs/gatsby-node.js
@@ -14,6 +14,24 @@ function pagesToSitemap(pages) {
     }));
 }
 
+function getVersionData(distTag) {
+  const versionFile = `${__dirname}/src/versions/${distTag}.json`;
+  if (!fs.existsSync(versionFile)) {
+    return null;
+  }
+  const data = {
+    [distTag]: JSON.parse(fs.readFileSync(versionFile)),
+  };
+  return data;
+}
+
+function generateVersionsFile() {
+  const latest = getVersionData('latest');
+  const next = getVersionData('next');
+  const data = { ...latest, ...next };
+  fs.writeFileSync(`${__dirname}/public/versions.json`, JSON.stringify(data));
+}
+
 function generateSitemap(pages) {
   const sitemap = sm.createSitemap({
     hostname: 'https://storybook.js.org',
@@ -36,6 +54,7 @@ module.exports = {
         }
       }
     `);
+    generateVersionsFile();
     generateSitemap(result.data.allSitePage.edges.map(({ node }) => node));
   },
   onCreateNode({ node, boundActionCreators, getNode }) {
diff --git a/docs/src/versions/latest.json b/docs/src/versions/latest.json
new file mode 100644
index 00000000000..f45c59349c8
--- /dev/null
+++ b/docs/src/versions/latest.json
@@ -0,0 +1,6 @@
+{
+  "version": "5.0.0",
+  "info": {
+    "plain": "Storybook 5.0 is a completely new UI with the following improvements:\n\n- 🌓 New design with light and dark themes\n- 🛠 Canvas toolbar for easy access to addons\n- 🗺 Overhauled navigation sidebar with an intuitive menu\n- 🗜 Redesigned addons panel with handy buttons to toggle visibility and orientation\n- ⌨️ Improved keyboard shortcuts that are user configurable\n- 🌍 New URL structure that eliminates long strings of query parameters\n\n5.0 contains hundreds more fixes, features, and tweaks. Browse the changelogs matching `5.0.0-alpha.*`, `5.0.0-beta.*`, and `5.0.0-rc.*` for the full list of changes. See [MIGRATION.md](https://github.com/storybooks/storybook/blob/next/MIGRATION.md) to ugprade from `4.x`."
+  }
+}
diff --git a/docs/src/versions/next.json b/docs/src/versions/next.json
new file mode 100644
index 00000000000..d4fe638c271
--- /dev/null
+++ b/docs/src/versions/next.json
@@ -0,0 +1,6 @@
+{
+  "version": "5.1.0-alpha.0",
+  "info": {
+    "plain": "### Features\n\n* UI: Custom scrollbars ([#5714](https://github.com/storybooks/storybook/pull/5714))\n\n### Bug Fixes\n\n* Fix: Move `react-select` dependency to 2.2 ([#5867](https://github.com/storybooks/storybook/pull/5867))\n\n### Maintenance\n\n* Cleanup unused dependencies ([#5453](https://github.com/storybooks/storybook/pull/5453))\n* Add directory attribute to repositories in package.json files ([#5643](https://github.com/storybooks/storybook/pull/5643))\n\n### Dependency Upgrades\n\n* Project-wide dependency upgrades ([#5740](https://github.com/storybooks/storybook/pull/5740))\n* Bump react-is from 16.8.1 to 16.8.3 ([#5743](https://github.com/storybooks/storybook/pull/5743))\n* Bump danger from 7.0.13 to 7.0.14 ([#5744](https://github.com/storybooks/storybook/pull/5744))\n* Bump babel-plugin-named-asset-import from 0.3.0 to 0.3.1 ([#5745](https://github.com/storybooks/storybook/pull/5745))\n* Bump eslint-plugin-json from 1.3.2 to 1.4.0 ([#5719](https://github.com/storybooks/storybook/pull/5719))\n* Bump react-native-modal-datetime-picker from 5.1.0 to 6.0.0 ([#4425](https://github.com/storybooks/storybook/pull/4425))\n* Bump immer from 1.12.0 to 2.0.0 ([#5694](https://github.com/storybooks/storybook/pull/5694))\n* Bump danger from 7.0.11 to 7.0.13 ([#5696](https://github.com/storybooks/storybook/pull/5696))\n* Bump eslint-plugin-jsx-a11y from 6.2.0 to 6.2.1 ([#5698](https://github.com/storybooks/storybook/pull/5698))\n* Bump @angular/platform-browser-dynamic from 7.2.4 to 7.2.6 ([#5697](https://github.com/storybooks/storybook/pull/5697))\n* Bump eslint from 5.12.1 to 5.14.1 ([#5653](https://github.com/storybooks/storybook/pull/5653))\n* Bump babel-preset-react-app from 7.0.0 to 7.0.1 ([#5674](https://github.com/storybooks/storybook/pull/5674))\n* Bump react from 16.8.1 to 16.8.2 ([#5673](https://github.com/storybooks/storybook/pull/5673))\n* Bump @angular/cli from 7.3.0 to 7.3.2 ([#5654](https://github.com/storybooks/storybook/pull/5654))\n* Bump @types/jest from 24.0.0 to 24.0.6 ([#5655](https://github.com/storybooks/storybook/pull/5655))\n* Bump lint-staged from 8.1.3 to 8.1.4 ([#5606](https://github.com/storybooks/storybook/pull/5606))\n* Bump @types/lodash from 4.14.120 to 4.14.121 ([#5609](https://github.com/storybooks/storybook/pull/5609))\n* Bump webpack from 4.29.0 to 4.29.3 ([#5570](https://github.com/storybooks/storybook/pull/5570))\n* update modal manager for rn 0.58 support ([#5581](https://github.com/storybooks/storybook/pull/5581))\n* Bump danger from 7.0.7 to 7.0.11 ([#5568](https://github.com/storybooks/storybook/pull/5568))\n* Bump jest-jasmine2 from 24.0.0 to 24.1.0 ([#5569](https://github.com/storybooks/storybook/pull/5569))\n* Bump jest-jasmine2 from 24.0.0 to 24.1.0 ([#5567](https://github.com/storybooks/storybook/pull/5567))\n* Bump handlebars from 4.0.12 to 4.1.0 ([#5576](https://github.com/storybooks/storybook/pull/5576))\n* Bump esm from 3.2.1 to 3.2.4 ([#5556](https://github.com/storybooks/storybook/pull/5556))\n* Bump @types/jest from 23.3.13 to 24.0.0 ([#5554](https://github.com/storybooks/storybook/pull/5554))\n* Bump webpack-dev-middleware from 3.5.1 to 3.5.2 ([#5552](https://github.com/storybooks/storybook/pull/5552))\n* Bump @emotion/core from 10.0.6 to 10.0.7 ([#5555](https://github.com/storybooks/storybook/pull/5555))\n* Bump terser-webpack-plugin from 1.2.1 to 1.2.2 ([#5553](https://github.com/storybooks/storybook/pull/5553))\n* Bump fuse.js from 3.3.1 to 3.4.2 ([#5538](https://github.com/storybooks/storybook/pull/5538))\n* Bump @angular/platform-browser-dynamic from 7.2.3 to 7.2.4 ([#5540](https://github.com/storybooks/storybook/pull/5540))\n* Bump emotion-theming from 10.0.6 to 10.0.7 ([#5541](https://github.com/storybooks/storybook/pull/5541))\n* Bump eslint-config-prettier from 3.6.0 to 4.0.0 ([#5539](https://github.com/storybooks/storybook/pull/5539))"
+  }
+}
diff --git a/docs/static/versions.json b/docs/static/versions.json
deleted file mode 100644
index 3fa567fec2b..00000000000
--- a/docs/static/versions.json
+++ /dev/null
@@ -1 +0,0 @@
-{"next":{"version":"5.1.0-alpha.0","info":{"plain":"### Features\n\n* UI: Custom scrollbars ([#5714](https://github.com/storybooks/storybook/pull/5714))\n\n### Bug Fixes\n\n* Fix: Move `react-select` dependency to 2.2 ([#5867](https://github.com/storybooks/storybook/pull/5867))\n\n### Maintenance\n\n* Cleanup unused dependencies ([#5453](https://github.com/storybooks/storybook/pull/5453))\n* Add directory attribute to repositories in package.json files ([#5643](https://github.com/storybooks/storybook/pull/5643))\n\n### Dependency Upgrades\n\n* Project-wide dependency upgrades ([#5740](https://github.com/storybooks/storybook/pull/5740))\n* Bump react-is from 16.8.1 to 16.8.3 ([#5743](https://github.com/storybooks/storybook/pull/5743))\n* Bump danger from 7.0.13 to 7.0.14 ([#5744](https://github.com/storybooks/storybook/pull/5744))\n* Bump babel-plugin-named-asset-import from 0.3.0 to 0.3.1 ([#5745](https://github.com/storybooks/storybook/pull/5745))\n* Bump eslint-plugin-json from 1.3.2 to 1.4.0 ([#5719](https://github.com/storybooks/storybook/pull/5719))\n* Bump react-native-modal-datetime-picker from 5.1.0 to 6.0.0 ([#4425](https://github.com/storybooks/storybook/pull/4425))\n* Bump immer from 1.12.0 to 2.0.0 ([#5694](https://github.com/storybooks/storybook/pull/5694))\n* Bump danger from 7.0.11 to 7.0.13 ([#5696](https://github.com/storybooks/storybook/pull/5696))\n* Bump eslint-plugin-jsx-a11y from 6.2.0 to 6.2.1 ([#5698](https://github.com/storybooks/storybook/pull/5698))\n* Bump @angular/platform-browser-dynamic from 7.2.4 to 7.2.6 ([#5697](https://github.com/storybooks/storybook/pull/5697))\n* Bump eslint from 5.12.1 to 5.14.1 ([#5653](https://github.com/storybooks/storybook/pull/5653))\n* Bump babel-preset-react-app from 7.0.0 to 7.0.1 ([#5674](https://github.com/storybooks/storybook/pull/5674))\n* Bump react from 16.8.1 to 16.8.2 ([#5673](https://github.com/storybooks/storybook/pull/5673))\n* Bump @angular/cli from 7.3.0 to 7.3.2 ([#5654](https://github.com/storybooks/storybook/pull/5654))\n* Bump @types/jest from 24.0.0 to 24.0.6 ([#5655](https://github.com/storybooks/storybook/pull/5655))\n* Bump lint-staged from 8.1.3 to 8.1.4 ([#5606](https://github.com/storybooks/storybook/pull/5606))\n* Bump @types/lodash from 4.14.120 to 4.14.121 ([#5609](https://github.com/storybooks/storybook/pull/5609))\n* Bump webpack from 4.29.0 to 4.29.3 ([#5570](https://github.com/storybooks/storybook/pull/5570))\n* update modal manager for rn 0.58 support ([#5581](https://github.com/storybooks/storybook/pull/5581))\n* Bump danger from 7.0.7 to 7.0.11 ([#5568](https://github.com/storybooks/storybook/pull/5568))\n* Bump jest-jasmine2 from 24.0.0 to 24.1.0 ([#5569](https://github.com/storybooks/storybook/pull/5569))\n* Bump jest-jasmine2 from 24.0.0 to 24.1.0 ([#5567](https://github.com/storybooks/storybook/pull/5567))\n* Bump handlebars from 4.0.12 to 4.1.0 ([#5576](https://github.com/storybooks/storybook/pull/5576))\n* Bump esm from 3.2.1 to 3.2.4 ([#5556](https://github.com/storybooks/storybook/pull/5556))\n* Bump @types/jest from 23.3.13 to 24.0.0 ([#5554](https://github.com/storybooks/storybook/pull/5554))\n* Bump webpack-dev-middleware from 3.5.1 to 3.5.2 ([#5552](https://github.com/storybooks/storybook/pull/5552))\n* Bump @emotion/core from 10.0.6 to 10.0.7 ([#5555](https://github.com/storybooks/storybook/pull/5555))\n* Bump terser-webpack-plugin from 1.2.1 to 1.2.2 ([#5553](https://github.com/storybooks/storybook/pull/5553))\n* Bump fuse.js from 3.3.1 to 3.4.2 ([#5538](https://github.com/storybooks/storybook/pull/5538))\n* Bump @angular/platform-browser-dynamic from 7.2.3 to 7.2.4 ([#5540](https://github.com/storybooks/storybook/pull/5540))\n* Bump emotion-theming from 10.0.6 to 10.0.7 ([#5541](https://github.com/storybooks/storybook/pull/5541))\n* Bump eslint-config-prettier from 3.6.0 to 4.0.0 ([#5539](https://github.com/storybooks/storybook/pull/5539))"}},"latest":{"version":"5.0.0","info":{"plain":"Storybook 5.0 is a completely new UI with the following improvements:\n\n- 🌓 New design with light and dark themes\n- 🛠 Canvas toolbar for easy access to addons\n- 🗺 Overhauled navigation sidebar with an intuitive menu\n- 🗜 Redesigned addons panel with handy buttons to toggle visibility and orientation\n- ⌨️ Improved keyboard shortcuts that are user configurable\n- 🌍 New URL structure that eliminates long strings of query parameters\n\n5.0 contains hundreds more fixes, features, and tweaks. Browse the changelogs matching `5.0.0-alpha.*`, `5.0.0-beta.*`, and `5.0.0-rc.*` for the full list of changes. See [MIGRATION.md](https://github.com/storybooks/storybook/blob/next/MIGRATION.md) to ugprade from `4.x`."}}}
\ No newline at end of file
diff --git a/docs/versions.json b/docs/versions.json
deleted file mode 100644
index 451f64c66e8..00000000000
--- a/docs/versions.json
+++ /dev/null
@@ -1 +0,0 @@
-{"next":{"version":"5.0.0-rc.3","info":{"plain":"### Bug Fixes\n\n* UI: Styling bug fixes, story updates, and more QA ([#5650](https://github.com/storybooks/storybook/pull/5650))\n* UI: V5 style refinements ([#5562](https://github.com/storybooks/storybook/pull/5562))"}}}
\ No newline at end of file

From 9acd009c9a6432f9046dbf1e084caf46ba07ab3c Mon Sep 17 00:00:00 2001
From: Alexander Shepelin <Brightcor@gmail.com>
Date: Wed, 6 Mar 2019 08:18:44 +0300
Subject: [PATCH 171/249] Fix typo in example, use MyPanel component

---
 docs/src/pages/addons/writing-addons/index.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/docs/src/pages/addons/writing-addons/index.md b/docs/src/pages/addons/writing-addons/index.md
index 272fad6b728..1688522294b 100644
--- a/docs/src/pages/addons/writing-addons/index.md
+++ b/docs/src/pages/addons/writing-addons/index.md
@@ -102,7 +102,7 @@ class MyPanel extends React.Component {
 }
 
 addons.register(ADDON_ID, api => {
-  const render = ({ active }) => <Panel api={api} active={active} />;
+  const render = ({ active }) => <MyPanel api={api} active={active} />;
   const title = 'My Addon';
 
   addons.add(PANEL_ID, {

From 5d28d97624c188b385fe80058b9b1d056bce7b4a Mon Sep 17 00:00:00 2001
From: Marais Rossouw <me@maraisr.com>
Date: Wed, 6 Mar 2019 15:57:21 +1000
Subject: [PATCH 172/249] docs: readme updated to reference jsdelivr for the
 badge

---
 README.md | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/README.md b/README.md
index f9dd2d8e08d..ee4bcde07ca 100644
--- a/README.md
+++ b/README.md
@@ -131,10 +131,10 @@ See [Addon / Framework Support Table](ADDONS_SUPPORT.md)
 
 We have a badge! Link it to your live Storybook example.
 
-![Storybook](https://github.com/storybooks/brand/blob/master/badge/badge-storybook.svg)
+![Storybook](https://cdn.jsdelivr.net/gh/storybooks/brand@master/badge/badge-storybook.svg)
 
 ```md
-[![Storybook](https://github.com/storybooks/brand/blob/master/badge/badge-storybook.svg)](link to site)
+[![Storybook](https://cdn.jsdelivr.net/gh/storybooks/brand@master/badge/badge-storybook.svg)](link to site)
 ```
 
 If you're looking for material to use in your presentation about storybook, like logo's video material and the colors we use etc, you can find all of that at our [press repo](https://github.com/storybooks/press).

From 119764702ecb50d8d97739c6c0c79b52dd2296ac Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Wed, 6 Mar 2019 16:39:37 +0800
Subject: [PATCH 173/249] Remove custom presets warning

---
 lib/core/src/server/common/custom-presets.js | 12 +-----------
 1 file changed, 1 insertion(+), 11 deletions(-)

diff --git a/lib/core/src/server/common/custom-presets.js b/lib/core/src/server/common/custom-presets.js
index aeabe5b9cb5..841e0b39638 100644
--- a/lib/core/src/server/common/custom-presets.js
+++ b/lib/core/src/server/common/custom-presets.js
@@ -1,17 +1,7 @@
 import path from 'path';
-import { logger } from '@storybook/node-logger';
 import serverRequire from '../utils/server-require';
 
 export default function loadCustomPresets({ configDir }) {
   const presets = serverRequire(path.resolve(configDir, 'presets'));
-
-  if (presets) {
-    logger.warn(
-      '"Custom presets" is an experimental and undocumented feature that will be changed or deprecated soon. Use it on your own risk.'
-    );
-
-    return presets;
-  }
-
-  return [];
+  return presets || [];
 }

From bffba53c3aeecce02287d304b456b3c652c6e870 Mon Sep 17 00:00:00 2001
From: Edwin Zhang <edwin.zhang@samsara.com>
Date: Tue, 5 Mar 2019 23:39:15 -0800
Subject: [PATCH 174/249] lib client-api/src/client_api: check type of
 module.id as fileName

Much further downwind when searching through file names, fuzzy-search
and .includes requires that the fileName parameter is a string, not a
number. This checks to make sure that the fileName is indeed a string,
since webpack may sometimes return the module.id as a number.

https://webpack.js.org/api/module-variables/#moduleid-commonjs
---
 lib/client-api/src/client_api.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/lib/client-api/src/client_api.js b/lib/client-api/src/client_api.js
index aef1dbb4ce5..0a357020621 100644
--- a/lib/client-api/src/client_api.js
+++ b/lib/client-api/src/client_api.js
@@ -163,7 +163,7 @@ export default class ClientApi {
         });
       }
 
-      const fileName = m ? m.id : null;
+      const fileName = m && typeof m.id === 'string' ? m.id : undefined;
 
       const { hierarchyRootSeparator, hierarchySeparator } = this.getSeparators();
       const baseOptions = {

From bd4becaf956c54d84705e01175f7c97623aa9da3 Mon Sep 17 00:00:00 2001
From: Edwin Zhang <edwin.zhang@samsara.com>
Date: Wed, 6 Mar 2019 09:34:42 -0800
Subject: [PATCH 175/249] lib client-api/src/client_api.test: add test case to
 ignore numeric module.id

---
 lib/client-api/src/client_api.test.js | 23 +++++++++++++++++++++++
 1 file changed, 23 insertions(+)

diff --git a/lib/client-api/src/client_api.test.js b/lib/client-api/src/client_api.test.js
index ebf4d99b191..257401a6e1e 100644
--- a/lib/client-api/src/client_api.test.js
+++ b/lib/client-api/src/client_api.test.js
@@ -270,6 +270,29 @@ describe('preview.client_api', () => {
         },
       ]);
     });
+
+    it('should ignore non-string ids from module', () => {
+      const {
+        clientApi: { getStorybook, storiesOf },
+      } = getContext();
+
+      const fn = jest.fn();
+      storiesOf('kind', { id: 1211 }).add('name', fn);
+
+      const storybook = getStorybook();
+
+      expect(storybook).toEqual([
+        {
+          kind: 'kind',
+          stories: [
+            {
+              name: 'name',
+              render: expect.any(Function),
+            },
+          ],
+        },
+      ]);
+    });
   });
 
   describe('hot module loading', () => {

From 2fbed87803c47bb990f8958156bd232671d9256b Mon Sep 17 00:00:00 2001
From: JD Angerhofer <jd.angerhofer@gmail.com>
Date: Wed, 6 Mar 2019 12:35:45 -0500
Subject: [PATCH 176/249] Docs: Typescript Configuration for v5

Updating Typescript example code to reflect Webpack "full control" mode in Storybook v5.
---
 .../configurations/typescript-config/index.md | 24 +++++++++++--------
 1 file changed, 14 insertions(+), 10 deletions(-)

diff --git a/docs/src/pages/configurations/typescript-config/index.md b/docs/src/pages/configurations/typescript-config/index.md
index 9a400cd5ad2..5ae2a0d7306 100644
--- a/docs/src/pages/configurations/typescript-config/index.md
+++ b/docs/src/pages/configurations/typescript-config/index.md
@@ -25,21 +25,25 @@ We first have to use the [custom Webpack config in full control mode, extending
 
 ```js
 const path = require('path');
-module.exports = (baseConfig, env, config) => {
+module.exports = ({ config, mode }) => {
   config.module.rules.push({
     test: /\.(ts|tsx)$/,
-    use: [{
-      loader: require.resolve('awesome-typescript-loader')
-    }, {
-      loader: require.resolve('react-docgen-typescript-loader')
-    }]
+    use: [
+      {
+        loader: require.resolve('awesome-typescript-loader')
+      },
+      // Optional
+      {
+        loader: require.resolve('react-docgen-typescript-loader')
+      }
+    ]
   });
   config.resolve.extensions.push('.ts', '.tsx');
   return config;
 };
 ```
 
-The above example shows a working Webpack config with the TSDocgen plugin also integrated; remove the optional sections if you don't plan on using them.
+The above example shows a working Webpack config with the [TSDocgen plugin](https://github.com/strothj/react-docgen-typescript-loader) integrated.  This plugin is not necessary to use Storybook and the section marked `// optional` can be safely removed if the features of TSDocgen are not required.
 
 ### `tsconfig.json`
 
@@ -91,13 +95,13 @@ yarn add -D @types/storybook__react # typings
 We first have to use the [custom Webpack config in full control mode, extending default configs](/configurations/custom-webpack-config/#full-control-mode--default) by creating a `webpack.config.js` file in our Storybook configuration directory (by default, it’s `.storybook`):
 
 ```js
-module.exports = (baseConfig, env, config) => {
+module.exports = ({ config, mode }) => {
   config.module.rules.push({
     test: /\.(ts|tsx)$/,
     loader: require.resolve('babel-loader'),
     options: {
-      presets: [['react-app', { flow: false, typescript: true }]],
-    },
+      presets: [['react-app', { flow: false, typescript: true }]]
+    }
   });
   config.resolve.extensions.push('.ts', '.tsx');
   return config;

From ed8182d770d96cbffeb33ffd68977cff97bf96c8 Mon Sep 17 00:00:00 2001
From: xdvarpunen <ismail.belmostefa@gmail.com>
Date: Wed, 6 Mar 2019 20:59:37 +0200
Subject: [PATCH 177/249] Updated list of peerDependencies for mithriljs.

---
 docs/src/pages/basics/guide-mithril/index.md | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/docs/src/pages/basics/guide-mithril/index.md b/docs/src/pages/basics/guide-mithril/index.md
index 9f75c147564..60fa58b0153 100644
--- a/docs/src/pages/basics/guide-mithril/index.md
+++ b/docs/src/pages/basics/guide-mithril/index.md
@@ -31,11 +31,11 @@ npm i --save-dev @storybook/mithril
 
 ## Add mithril and babel-core
 
-Make sure that you have `mithril` and `babel-core` in your dependencies as well because we list these as a peerDependency:
+Make sure that you have `mithril`, `@babel/core`, and `babel-loader` in your dependencies as well because we list these as a peerDependency:
 
 ```sh
 npm i --save mithril
-npm i --save-dev babel-core
+npm i --save-dev @babel/core babel-loader
 ```
 
 Then add the following NPM script to your package json in order to start the storybook later in this guide:

From c603cfb8788d494e8daffa445f5639250c3683db Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Wed, 6 Mar 2019 21:32:58 +0100
Subject: [PATCH 178/249] REMOVE unneeded dependencies

---
 docs/package.json |    9 +-
 docs/yarn.lock    | 3689 ++++++++++++++++++---------------------------
 2 files changed, 1463 insertions(+), 2235 deletions(-)

diff --git a/docs/package.json b/docs/package.json
index ce5356defdd..9b75ae3ef70 100644
--- a/docs/package.json
+++ b/docs/package.json
@@ -28,7 +28,7 @@
     "common-tags": "^1.8.0",
     "gatsby": "^1.9.279",
     "gatsby-link": "^1.6.45",
-    "gatsby-plugin-sharp": "^2.0.12",
+    "gatsby-plugin-sharp": "^1.6.48",
     "gatsby-remark-autolink-headers": "^1.4.19",
     "gatsby-remark-copy-linked-files": "^1.5.37",
     "gatsby-remark-images": "^1.5.67",
@@ -37,19 +37,14 @@
     "gatsby-transformer-remark": "^1.7.44",
     "global": "^4.3.2",
     "highlight.js": "^9.14.2",
+    "is-builtin-module": "^3.0.0",
     "lodash": "^4.17.11",
     "marked": "^0.5.2",
-    "mobx": "^5.9.0",
-    "mobx-react": "^5.4.3",
-    "mobx-react-form": "^1.39.1",
-    "polished": "^3.0.3",
     "prop-types": "^15.7.2",
     "react": "^16.8.3",
     "react-document-title": "^2.0.3",
     "react-dom": "^16.8.3",
     "react-helmet": "^5.2.0",
-    "react-lazyload": "^2.5.0",
-    "react-modal": "^3.8.1",
     "react-popper-tooltip": "^2.8.1",
     "react-router": "^4.3.1",
     "react-stack-grid": "^0.7.1",
diff --git a/docs/yarn.lock b/docs/yarn.lock
index a3c9e5f1b4d..d3747cf09de 100644
--- a/docs/yarn.lock
+++ b/docs/yarn.lock
@@ -9,18 +9,18 @@
   dependencies:
     "@babel/highlight" "^7.0.0"
 
-"@babel/core@7.1.6":
-  version "7.1.6"
-  resolved "https://registry.yarnpkg.com/@babel/core/-/core-7.1.6.tgz#3733cbee4317429bc87c62b29cf8587dba7baeb3"
-  integrity sha512-Hz6PJT6e44iUNpAn8AoyAs6B3bl60g7MJQaI0rZEar6ECzh6+srYO1xlIdssio34mPaUtAb1y+XlkkSJzok3yw==
+"@babel/core@7.2.2":
+  version "7.2.2"
+  resolved "https://registry.yarnpkg.com/@babel/core/-/core-7.2.2.tgz#07adba6dde27bb5ad8d8672f15fde3e08184a687"
+  integrity sha512-59vB0RWt09cAct5EIe58+NzGP4TFSD3Bz//2/ELy3ZeTeKF6VTD1AXlH8BGGbCX0PuobZBsIzO7IAI9PH67eKw==
   dependencies:
     "@babel/code-frame" "^7.0.0"
-    "@babel/generator" "^7.1.6"
-    "@babel/helpers" "^7.1.5"
-    "@babel/parser" "^7.1.6"
-    "@babel/template" "^7.1.2"
-    "@babel/traverse" "^7.1.6"
-    "@babel/types" "^7.1.6"
+    "@babel/generator" "^7.2.2"
+    "@babel/helpers" "^7.2.0"
+    "@babel/parser" "^7.2.2"
+    "@babel/template" "^7.2.2"
+    "@babel/traverse" "^7.2.2"
+    "@babel/types" "^7.2.2"
     convert-source-map "^1.1.0"
     debug "^4.1.0"
     json5 "^2.1.0"
@@ -30,44 +30,33 @@
     source-map "^0.5.0"
 
 "@babel/core@^7.1.6":
-  version "7.2.0"
-  resolved "https://registry.yarnpkg.com/@babel/core/-/core-7.2.0.tgz#a4dd3814901998e93340f0086e9867fefa163ada"
-  integrity sha512-7pvAdC4B+iKjFFp9Ztj0QgBndJ++qaMeonT185wAqUnhipw8idm9Rv1UMyBuKtYjfl6ORNkgEgcsYLfHX/GpLw==
+  version "7.3.4"
+  resolved "https://registry.yarnpkg.com/@babel/core/-/core-7.3.4.tgz#921a5a13746c21e32445bf0798680e9d11a6530b"
+  integrity sha512-jRsuseXBo9pN197KnDwhhaaBzyZr2oIcLHHTt2oDdQrej5Qp57dCCJafWx5ivU8/alEYDpssYqv1MUqcxwQlrA==
   dependencies:
     "@babel/code-frame" "^7.0.0"
-    "@babel/generator" "^7.2.0"
+    "@babel/generator" "^7.3.4"
     "@babel/helpers" "^7.2.0"
-    "@babel/parser" "^7.2.0"
-    "@babel/template" "^7.1.2"
-    "@babel/traverse" "^7.1.6"
-    "@babel/types" "^7.2.0"
+    "@babel/parser" "^7.3.4"
+    "@babel/template" "^7.2.2"
+    "@babel/traverse" "^7.3.4"
+    "@babel/types" "^7.3.4"
     convert-source-map "^1.1.0"
     debug "^4.1.0"
     json5 "^2.1.0"
-    lodash "^4.17.10"
+    lodash "^4.17.11"
     resolve "^1.3.2"
     semver "^5.4.1"
     source-map "^0.5.0"
 
-"@babel/generator@^7.1.6", "@babel/generator@^7.2.0":
-  version "7.2.0"
-  resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.2.0.tgz#eaf3821fa0301d9d4aef88e63d4bcc19b73ba16c"
-  integrity sha512-BA75MVfRlFQG2EZgFYIwyT1r6xSkwfP2bdkY/kLZusEYWiJs4xCowab/alaEaT0wSvmVuXGqiefeBlP+7V1yKg==
+"@babel/generator@^7.2.2", "@babel/generator@^7.3.4":
+  version "7.3.4"
+  resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.3.4.tgz#9aa48c1989257877a9d971296e5b73bfe72e446e"
+  integrity sha512-8EXhHRFqlVVWXPezBW5keTiQi/rJMQTg/Y9uVCEZ0CAF3PKtCCaVRnp64Ii1ujhkoDhhF1fVsImoN4yJ2uz4Wg==
   dependencies:
-    "@babel/types" "^7.2.0"
+    "@babel/types" "^7.3.4"
     jsesc "^2.5.1"
-    lodash "^4.17.10"
-    source-map "^0.5.0"
-    trim-right "^1.0.1"
-
-"@babel/generator@^7.2.2":
-  version "7.2.2"
-  resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.2.2.tgz#18c816c70962640eab42fe8cae5f3947a5c65ccc"
-  integrity sha512-I4o675J/iS8k+P38dvJ3IBGqObLXyQLTxtrR4u9cSUJOURvafeEWb/pFMOTwtNrmq73mJzyF6ueTbO1BtN0Zeg==
-  dependencies:
-    "@babel/types" "^7.2.2"
-    jsesc "^2.5.1"
-    lodash "^4.17.10"
+    lodash "^4.17.11"
     source-map "^0.5.0"
     trim-right "^1.0.1"
 
@@ -86,12 +75,12 @@
     "@babel/helper-explode-assignable-expression" "^7.1.0"
     "@babel/types" "^7.0.0"
 
-"@babel/helper-builder-react-jsx@^7.0.0":
-  version "7.0.0"
-  resolved "https://registry.yarnpkg.com/@babel/helper-builder-react-jsx/-/helper-builder-react-jsx-7.0.0.tgz#fa154cb53eb918cf2a9a7ce928e29eb649c5acdb"
-  integrity sha512-ebJ2JM6NAKW0fQEqN8hOLxK84RbRz9OkUhGS/Xd5u56ejMfVbayJ4+LykERZCOUM6faa6Fp3SZNX3fcT16MKHw==
+"@babel/helper-builder-react-jsx@^7.3.0":
+  version "7.3.0"
+  resolved "https://registry.yarnpkg.com/@babel/helper-builder-react-jsx/-/helper-builder-react-jsx-7.3.0.tgz#a1ac95a5d2b3e88ae5e54846bf462eeb81b318a4"
+  integrity sha512-MjA9KgwCuPEkQd9ncSXvSyJ5y+j2sICHyrI0M3L+6fnS4wMSNDc1ARXsbTfbb2cXHn17VisSnU/sHFTCxVxSMw==
   dependencies:
-    "@babel/types" "^7.0.0"
+    "@babel/types" "^7.3.0"
     esutils "^2.0.0"
 
 "@babel/helper-call-delegate@^7.1.0":
@@ -103,16 +92,17 @@
     "@babel/traverse" "^7.1.0"
     "@babel/types" "^7.0.0"
 
-"@babel/helper-create-class-features-plugin@^7.3.0":
-  version "7.3.2"
-  resolved "https://registry.yarnpkg.com/@babel/helper-create-class-features-plugin/-/helper-create-class-features-plugin-7.3.2.tgz#ba1685603eb1c9f2f51c9106d5180135c163fe73"
-  integrity sha512-tdW8+V8ceh2US4GsYdNVNoohq5uVwOf9k6krjwW4E1lINcHgttnWcNqgdoessn12dAy8QkbezlbQh2nXISNY+A==
+"@babel/helper-create-class-features-plugin@^7.3.0", "@babel/helper-create-class-features-plugin@^7.3.4":
+  version "7.3.4"
+  resolved "https://registry.yarnpkg.com/@babel/helper-create-class-features-plugin/-/helper-create-class-features-plugin-7.3.4.tgz#092711a7a3ad8ea34de3e541644c2ce6af1f6f0c"
+  integrity sha512-uFpzw6L2omjibjxa8VGZsJUPL5wJH0zzGKpoz0ccBkzIa6C8kWNUbiBmQ0rgOKWlHJ6qzmfa6lTiGchiV8SC+g==
   dependencies:
     "@babel/helper-function-name" "^7.1.0"
     "@babel/helper-member-expression-to-functions" "^7.0.0"
     "@babel/helper-optimise-call-expression" "^7.0.0"
     "@babel/helper-plugin-utils" "^7.0.0"
-    "@babel/helper-replace-supers" "^7.2.3"
+    "@babel/helper-replace-supers" "^7.3.4"
+    "@babel/helper-split-export-declaration" "^7.0.0"
 
 "@babel/helper-define-map@^7.1.0":
   version "7.1.0"
@@ -169,15 +159,15 @@
     "@babel/types" "^7.0.0"
 
 "@babel/helper-module-transforms@^7.1.0":
-  version "7.1.0"
-  resolved "https://registry.yarnpkg.com/@babel/helper-module-transforms/-/helper-module-transforms-7.1.0.tgz#470d4f9676d9fad50b324cdcce5fbabbc3da5787"
-  integrity sha512-0JZRd2yhawo79Rcm4w0LwSMILFmFXjugG3yqf+P/UsKsRS1mJCmMwwlHDlMg7Avr9LrvSpp4ZSULO9r8jpCzcw==
+  version "7.2.2"
+  resolved "https://registry.yarnpkg.com/@babel/helper-module-transforms/-/helper-module-transforms-7.2.2.tgz#ab2f8e8d231409f8370c883d20c335190284b963"
+  integrity sha512-YRD7I6Wsv+IHuTPkAmAS4HhY0dkPobgLftHp0cRGZSdrRvmZY8rFvae/GVu3bD00qscuvK3WPHB3YdNpBXUqrA==
   dependencies:
     "@babel/helper-module-imports" "^7.0.0"
     "@babel/helper-simple-access" "^7.1.0"
     "@babel/helper-split-export-declaration" "^7.0.0"
-    "@babel/template" "^7.1.0"
-    "@babel/types" "^7.0.0"
+    "@babel/template" "^7.2.2"
+    "@babel/types" "^7.2.2"
     lodash "^4.17.10"
 
 "@babel/helper-optimise-call-expression@^7.0.0":
@@ -210,25 +200,15 @@
     "@babel/traverse" "^7.1.0"
     "@babel/types" "^7.0.0"
 
-"@babel/helper-replace-supers@^7.1.0":
-  version "7.1.0"
-  resolved "https://registry.yarnpkg.com/@babel/helper-replace-supers/-/helper-replace-supers-7.1.0.tgz#5fc31de522ec0ef0899dc9b3e7cf6a5dd655f362"
-  integrity sha512-BvcDWYZRWVuDeXTYZWxekQNO5D4kO55aArwZOTFXw6rlLQA8ZaDicJR1sO47h+HrnCiDFiww0fSPV0d713KBGQ==
+"@babel/helper-replace-supers@^7.1.0", "@babel/helper-replace-supers@^7.3.4":
+  version "7.3.4"
+  resolved "https://registry.yarnpkg.com/@babel/helper-replace-supers/-/helper-replace-supers-7.3.4.tgz#a795208e9b911a6eeb08e5891faacf06e7013e13"
+  integrity sha512-pvObL9WVf2ADs+ePg0jrqlhHoxRXlOa+SHRHzAXIz2xkYuOHfGl+fKxPMaS4Fq+uje8JQPobnertBBvyrWnQ1A==
   dependencies:
     "@babel/helper-member-expression-to-functions" "^7.0.0"
     "@babel/helper-optimise-call-expression" "^7.0.0"
-    "@babel/traverse" "^7.1.0"
-    "@babel/types" "^7.0.0"
-
-"@babel/helper-replace-supers@^7.2.3":
-  version "7.2.3"
-  resolved "https://registry.yarnpkg.com/@babel/helper-replace-supers/-/helper-replace-supers-7.2.3.tgz#19970020cf22677d62b3a689561dbd9644d8c5e5"
-  integrity sha512-GyieIznGUfPXPWu0yLS6U55Mz67AZD9cUk0BfirOWlPrXlBcan9Gz+vHGz+cPfuoweZSnPzPIm67VtQM0OWZbA==
-  dependencies:
-    "@babel/helper-member-expression-to-functions" "^7.0.0"
-    "@babel/helper-optimise-call-expression" "^7.0.0"
-    "@babel/traverse" "^7.2.3"
-    "@babel/types" "^7.0.0"
+    "@babel/traverse" "^7.3.4"
+    "@babel/types" "^7.3.4"
 
 "@babel/helper-simple-access@^7.1.0":
   version "7.1.0"
@@ -255,14 +235,14 @@
     "@babel/traverse" "^7.1.0"
     "@babel/types" "^7.2.0"
 
-"@babel/helpers@^7.1.5", "@babel/helpers@^7.2.0":
-  version "7.2.0"
-  resolved "https://registry.yarnpkg.com/@babel/helpers/-/helpers-7.2.0.tgz#8335f3140f3144270dc63c4732a4f8b0a50b7a21"
-  integrity sha512-Fr07N+ea0dMcMN8nFpuK6dUIT7/ivt9yKQdEEnjVS83tG2pHwPi03gYmk/tyuwONnZ+sY+GFFPlWGgCtW1hF9A==
+"@babel/helpers@^7.2.0":
+  version "7.3.1"
+  resolved "https://registry.yarnpkg.com/@babel/helpers/-/helpers-7.3.1.tgz#949eec9ea4b45d3210feb7dc1c22db664c9e44b9"
+  integrity sha512-Q82R3jKsVpUV99mgX50gOPCWwco9Ec5Iln/8Vyu4osNIOQgSrd9RFrQeUvmvddFNoLwMyOUWU+5ckioEKpDoGA==
   dependencies:
     "@babel/template" "^7.1.2"
     "@babel/traverse" "^7.1.5"
-    "@babel/types" "^7.2.0"
+    "@babel/types" "^7.3.0"
 
 "@babel/highlight@^7.0.0":
   version "7.0.0"
@@ -273,17 +253,12 @@
     esutils "^2.0.2"
     js-tokens "^4.0.0"
 
-"@babel/parser@^7.1.2", "@babel/parser@^7.1.3", "@babel/parser@^7.1.6", "@babel/parser@^7.2.0":
-  version "7.2.0"
-  resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.2.0.tgz#02d01dbc330b6cbf36b76ac93c50752c69027065"
-  integrity sha512-M74+GvK4hn1eejD9lZ7967qAwvqTZayQa3g10ag4s9uewgR7TKjeaT0YMyoq+gVfKYABiWZ4MQD701/t5e1Jhg==
+"@babel/parser@^7.1.3", "@babel/parser@^7.2.2", "@babel/parser@^7.3.4":
+  version "7.3.4"
+  resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.3.4.tgz#a43357e4bbf4b92a437fb9e465c192848287f27c"
+  integrity sha512-tXZCqWtlOOP4wgCp6RjRvLmfuhnqTLy9VHwRochJBCP2nDm27JnnuFEnXFASVyQNHk36jD1tAammsCEEqgscIQ==
 
-"@babel/parser@^7.2.3":
-  version "7.2.3"
-  resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.2.3.tgz#32f5df65744b70888d17872ec106b02434ba1489"
-  integrity sha512-0LyEcVlfCoFmci8mXx8A5oIkpkOgyo8dRHtxBnK9RRBwxO2+JZPNsqtVEZQ7mJFPxnXF9lfmU24mHOPI0qnlkA==
-
-"@babel/plugin-proposal-async-generator-functions@^7.1.0", "@babel/plugin-proposal-async-generator-functions@^7.2.0":
+"@babel/plugin-proposal-async-generator-functions@^7.2.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-async-generator-functions/-/plugin-proposal-async-generator-functions-7.2.0.tgz#b289b306669dce4ad20b0252889a15768c9d417e"
   integrity sha512-+Dfo/SCQqrwx48ptLVGLdE39YtWRuKc/Y9I5Fy0P1DDBB9lsAHpjcEJQt+4IifuSOSTLBKJObJqMvaO1pIE8LQ==
@@ -292,37 +267,32 @@
     "@babel/helper-remap-async-to-generator" "^7.1.0"
     "@babel/plugin-syntax-async-generators" "^7.2.0"
 
-"@babel/plugin-proposal-class-properties@7.1.0":
-  version "7.1.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-class-properties/-/plugin-proposal-class-properties-7.1.0.tgz#9af01856b1241db60ec8838d84691aa0bd1e8df4"
-  integrity sha512-/PCJWN+CKt5v1xcGn4vnuu13QDoV+P7NcICP44BoonAJoPSGwVkgrXihFIQGiEjjPlUDBIw1cM7wYFLARS2/hw==
-  dependencies:
-    "@babel/helper-function-name" "^7.1.0"
-    "@babel/helper-member-expression-to-functions" "^7.0.0"
-    "@babel/helper-optimise-call-expression" "^7.0.0"
-    "@babel/helper-plugin-utils" "^7.0.0"
-    "@babel/helper-replace-supers" "^7.1.0"
-    "@babel/plugin-syntax-class-properties" "^7.0.0"
-
-"@babel/plugin-proposal-class-properties@^7.3.0":
-  version "7.3.3"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-class-properties/-/plugin-proposal-class-properties-7.3.3.tgz#e69ee114a834a671293ace001708cc1682ed63f9"
-  integrity sha512-XO9eeU1/UwGPM8L+TjnQCykuVcXqaO5J1bkRPIygqZ/A2L1xVMJ9aZXrY31c0U4H2/LHKL4lbFQLsxktSrc/Ng==
+"@babel/plugin-proposal-class-properties@7.3.0":
+  version "7.3.0"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-class-properties/-/plugin-proposal-class-properties-7.3.0.tgz#272636bc0fa19a0bc46e601ec78136a173ea36cd"
+  integrity sha512-wNHxLkEKTQ2ay0tnsam2z7fGZUi+05ziDJflEt3AZTP3oXLKHJp9HqhfroB/vdMvt3sda9fAbq7FsG8QPDrZBg==
   dependencies:
     "@babel/helper-create-class-features-plugin" "^7.3.0"
     "@babel/helper-plugin-utils" "^7.0.0"
 
-"@babel/plugin-proposal-decorators@7.1.6":
-  version "7.1.6"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-decorators/-/plugin-proposal-decorators-7.1.6.tgz#460c31edbd01953efe45d491583b3ec31661d689"
-  integrity sha512-U42f8KhUbtlhUDyV/wK4Rq/wWh8vWyttYABckG/v0vVnMPvayOewZC/83CbVdmyP+UhEqI368FEQ7hHMfhBpQA==
+"@babel/plugin-proposal-class-properties@^7.3.0":
+  version "7.3.4"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-class-properties/-/plugin-proposal-class-properties-7.3.4.tgz#410f5173b3dc45939f9ab30ca26684d72901405e"
+  integrity sha512-lUf8D3HLs4yYlAo8zjuneLvfxN7qfKv1Yzbj5vjqaqMJxgJA3Ipwp4VUJ+OrOdz53Wbww6ahwB8UhB2HQyLotA==
   dependencies:
+    "@babel/helper-create-class-features-plugin" "^7.3.4"
     "@babel/helper-plugin-utils" "^7.0.0"
-    "@babel/helper-replace-supers" "^7.1.0"
-    "@babel/helper-split-export-declaration" "^7.0.0"
-    "@babel/plugin-syntax-decorators" "^7.1.0"
 
-"@babel/plugin-proposal-json-strings@^7.0.0", "@babel/plugin-proposal-json-strings@^7.2.0":
+"@babel/plugin-proposal-decorators@7.3.0":
+  version "7.3.0"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-decorators/-/plugin-proposal-decorators-7.3.0.tgz#637ba075fa780b1f75d08186e8fb4357d03a72a7"
+  integrity sha512-3W/oCUmsO43FmZIqermmq6TKaRSYhmh/vybPfVFwQWdSb8xwki38uAIvknCRzuyHRuYfCYmJzL9or1v0AffPjg==
+  dependencies:
+    "@babel/helper-create-class-features-plugin" "^7.3.0"
+    "@babel/helper-plugin-utils" "^7.0.0"
+    "@babel/plugin-syntax-decorators" "^7.2.0"
+
+"@babel/plugin-proposal-json-strings@^7.2.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-json-strings/-/plugin-proposal-json-strings-7.2.0.tgz#568ecc446c6148ae6b267f02551130891e29f317"
   integrity sha512-MAFV1CA/YVmYwZG0fBQyXhmj0BHCB5egZHCKWIFVv/XCxAeVGIHfos3SwDck4LvCllENIAg7xMKOG5kH0dzyUg==
@@ -330,23 +300,7 @@
     "@babel/helper-plugin-utils" "^7.0.0"
     "@babel/plugin-syntax-json-strings" "^7.2.0"
 
-"@babel/plugin-proposal-object-rest-spread@7.0.0":
-  version "7.0.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-object-rest-spread/-/plugin-proposal-object-rest-spread-7.0.0.tgz#9a17b547f64d0676b6c9cecd4edf74a82ab85e7e"
-  integrity sha512-14fhfoPcNu7itSen7Py1iGN0gEm87hX/B+8nZPqkdmANyyYWYMY2pjA3r8WXbWVKMzfnSNS0xY8GVS0IjXi/iw==
-  dependencies:
-    "@babel/helper-plugin-utils" "^7.0.0"
-    "@babel/plugin-syntax-object-rest-spread" "^7.0.0"
-
-"@babel/plugin-proposal-object-rest-spread@^7.0.0", "@babel/plugin-proposal-object-rest-spread@^7.2.0":
-  version "7.2.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-object-rest-spread/-/plugin-proposal-object-rest-spread-7.2.0.tgz#88f5fec3e7ad019014c97f7ee3c992f0adbf7fb8"
-  integrity sha512-1L5mWLSvR76XYUQJXkd/EEQgjq8HHRP6lQuZTTg0VA4tTGPpGemmCdAfQIz1rzEuWAm+ecP8PyyEm30jC1eQCg==
-  dependencies:
-    "@babel/helper-plugin-utils" "^7.0.0"
-    "@babel/plugin-syntax-object-rest-spread" "^7.2.0"
-
-"@babel/plugin-proposal-object-rest-spread@^7.3.1", "@babel/plugin-proposal-object-rest-spread@^7.3.2":
+"@babel/plugin-proposal-object-rest-spread@7.3.2":
   version "7.3.2"
   resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-object-rest-spread/-/plugin-proposal-object-rest-spread-7.3.2.tgz#6d1859882d4d778578e41f82cc5d7bf3d5daf6c1"
   integrity sha512-DjeMS+J2+lpANkYLLO+m6GjoTMygYglKmRe6cDTbFv3L9i6mmiE8fe6B8MtCSLZpVXscD5kn7s6SgtHrDoBWoA==
@@ -354,7 +308,15 @@
     "@babel/helper-plugin-utils" "^7.0.0"
     "@babel/plugin-syntax-object-rest-spread" "^7.2.0"
 
-"@babel/plugin-proposal-optional-catch-binding@^7.0.0", "@babel/plugin-proposal-optional-catch-binding@^7.2.0":
+"@babel/plugin-proposal-object-rest-spread@^7.3.1", "@babel/plugin-proposal-object-rest-spread@^7.3.2", "@babel/plugin-proposal-object-rest-spread@^7.3.4":
+  version "7.3.4"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-object-rest-spread/-/plugin-proposal-object-rest-spread-7.3.4.tgz#47f73cf7f2a721aad5c0261205405c642e424654"
+  integrity sha512-j7VQmbbkA+qrzNqbKHrBsW3ddFnOeva6wzSe/zB7T+xaxGc+RCpwo44wCmRixAIGRoIpmVgvzFzNJqQcO3/9RA==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.0.0"
+    "@babel/plugin-syntax-object-rest-spread" "^7.2.0"
+
+"@babel/plugin-proposal-optional-catch-binding@^7.2.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-optional-catch-binding/-/plugin-proposal-optional-catch-binding-7.2.0.tgz#135d81edb68a081e55e56ec48541ece8065c38f5"
   integrity sha512-mgYj3jCcxug6KUcX4OBoOJz3CMrwRfQELPQ5560F70YQUBZB7uac9fqaWamKR1iWUzGiK2t0ygzjTScZnVz75g==
@@ -362,7 +324,7 @@
     "@babel/helper-plugin-utils" "^7.0.0"
     "@babel/plugin-syntax-optional-catch-binding" "^7.2.0"
 
-"@babel/plugin-proposal-unicode-property-regex@^7.0.0", "@babel/plugin-proposal-unicode-property-regex@^7.2.0":
+"@babel/plugin-proposal-unicode-property-regex@^7.2.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-unicode-property-regex/-/plugin-proposal-unicode-property-regex-7.2.0.tgz#abe7281fe46c95ddc143a65e5358647792039520"
   integrity sha512-LvRVYb7kikuOtIoUeWTkOxQEV1kYvL5B6U3iWEGCzPNRus1MzJweFqORTj+0jkxozkTSYNJozPOddxmqdqsRpw==
@@ -371,42 +333,28 @@
     "@babel/helper-regex" "^7.0.0"
     regexpu-core "^4.2.0"
 
-"@babel/plugin-syntax-async-generators@^7.0.0", "@babel/plugin-syntax-async-generators@^7.2.0":
+"@babel/plugin-syntax-async-generators@^7.2.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-async-generators/-/plugin-syntax-async-generators-7.2.0.tgz#69e1f0db34c6f5a0cf7e2b3323bf159a76c8cb7f"
   integrity sha512-1ZrIRBv2t0GSlcwVoQ6VgSLpLgiN/FVQUzt9znxo7v2Ov4jJrs8RY8tv0wvDmFN3qIdMKWrmMMW6yZ0G19MfGg==
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
 
-"@babel/plugin-syntax-class-properties@^7.0.0":
-  version "7.2.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-class-properties/-/plugin-syntax-class-properties-7.2.0.tgz#23b3b7b9bcdabd73672a9149f728cd3be6214812"
-  integrity sha512-UxYaGXYQ7rrKJS/PxIKRkv3exi05oH7rokBAsmCSsCxz1sVPZ7Fu6FzKoGgUvmY+0YgSkYHgUoCh5R5bCNBQlw==
-  dependencies:
-    "@babel/helper-plugin-utils" "^7.0.0"
-
-"@babel/plugin-syntax-decorators@^7.1.0":
+"@babel/plugin-syntax-decorators@^7.2.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-decorators/-/plugin-syntax-decorators-7.2.0.tgz#c50b1b957dcc69e4b1127b65e1c33eef61570c1b"
   integrity sha512-38QdqVoXdHUQfTpZo3rQwqQdWtCn5tMv4uV6r2RMfTqNBuv4ZBhz79SfaQWKTVmxHjeFv/DnXVC/+agHCklYWA==
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
 
-"@babel/plugin-syntax-dynamic-import@7.0.0":
-  version "7.0.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-dynamic-import/-/plugin-syntax-dynamic-import-7.0.0.tgz#6dfb7d8b6c3be14ce952962f658f3b7eb54c33ee"
-  integrity sha512-Gt9xNyRrCHCiyX/ZxDGOcBnlJl0I3IWicpZRC4CdC0P5a/I07Ya2OAMEBU+J7GmRFVmIetqEYRko6QYRuKOESw==
-  dependencies:
-    "@babel/helper-plugin-utils" "^7.0.0"
-
-"@babel/plugin-syntax-dynamic-import@^7.2.0":
+"@babel/plugin-syntax-dynamic-import@7.2.0", "@babel/plugin-syntax-dynamic-import@^7.2.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-dynamic-import/-/plugin-syntax-dynamic-import-7.2.0.tgz#69c159ffaf4998122161ad8ebc5e6d1f55df8612"
   integrity sha512-mVxuJ0YroI/h/tbFTPGZR8cv6ai+STMKNBq0f8hFxsxWjl94qqhsb+wXbpNMDPU3cfR1TIsVFzU3nXyZMqyK4w==
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
 
-"@babel/plugin-syntax-flow@^7.0.0", "@babel/plugin-syntax-flow@^7.2.0":
+"@babel/plugin-syntax-flow@^7.2.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-flow/-/plugin-syntax-flow-7.2.0.tgz#a765f061f803bc48f240c26f8747faf97c26bf7c"
   integrity sha512-r6YMuZDWLtLlu0kqIim5o/3TNRAlWb073HwT3e2nKf9I8IIvOggPrnILYPsrrKilmn/mYEMCf/Z07w3yQJF6dg==
@@ -427,14 +375,14 @@
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
 
-"@babel/plugin-syntax-object-rest-spread@^7.0.0", "@babel/plugin-syntax-object-rest-spread@^7.2.0":
+"@babel/plugin-syntax-object-rest-spread@^7.2.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-object-rest-spread/-/plugin-syntax-object-rest-spread-7.2.0.tgz#3b7a3e733510c57e820b9142a6579ac8b0dfad2e"
   integrity sha512-t0JKGgqk2We+9may3t0xDdmneaXmyxq0xieYcKHxIsrJO64n1OiMWNUtc5gQK1PA0NpdCRrtZp4z+IUaKugrSA==
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
 
-"@babel/plugin-syntax-optional-catch-binding@^7.0.0", "@babel/plugin-syntax-optional-catch-binding@^7.2.0":
+"@babel/plugin-syntax-optional-catch-binding@^7.2.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-optional-catch-binding/-/plugin-syntax-optional-catch-binding-7.2.0.tgz#a94013d6eda8908dfe6a477e7f9eda85656ecf5c"
   integrity sha512-bDe4xKNhb0LI7IvZHiA13kff0KEfaGX/Hv4lMA9+7TEc63hMNvfKo6ZFpXhKuEp+II/q35Gc4NoMeDZyaUbj9w==
@@ -442,47 +390,47 @@
     "@babel/helper-plugin-utils" "^7.0.0"
 
 "@babel/plugin-syntax-typescript@^7.2.0":
-  version "7.2.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-typescript/-/plugin-syntax-typescript-7.2.0.tgz#55d240536bd314dcbbec70fd949c5cabaed1de29"
-  integrity sha512-WhKr6yu6yGpGcNMVgIBuI9MkredpVc7Y3YR4UzEZmDztHoL6wV56YBHLhWnjO1EvId1B32HrD3DRFc+zSoKI1g==
+  version "7.3.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-typescript/-/plugin-syntax-typescript-7.3.3.tgz#a7cc3f66119a9f7ebe2de5383cce193473d65991"
+  integrity sha512-dGwbSMA1YhVS8+31CnPR7LB4pcbrzcV99wQzby4uAfrkZPYZlQ7ImwdpzLqi6Z6IL02b8IAL379CaMwo0x5Lag==
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
 
-"@babel/plugin-transform-arrow-functions@^7.0.0", "@babel/plugin-transform-arrow-functions@^7.2.0":
+"@babel/plugin-transform-arrow-functions@^7.2.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-transform-arrow-functions/-/plugin-transform-arrow-functions-7.2.0.tgz#9aeafbe4d6ffc6563bf8f8372091628f00779550"
   integrity sha512-ER77Cax1+8/8jCB9fo4Ud161OZzWN5qawi4GusDuRLcDbDG+bIGYY20zb2dfAFdTRGzrfq2xZPvF0R64EHnimg==
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
 
-"@babel/plugin-transform-async-to-generator@^7.1.0", "@babel/plugin-transform-async-to-generator@^7.2.0":
-  version "7.2.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-async-to-generator/-/plugin-transform-async-to-generator-7.2.0.tgz#68b8a438663e88519e65b776f8938f3445b1a2ff"
-  integrity sha512-CEHzg4g5UraReozI9D4fblBYABs7IM6UerAVG7EJVrTLC5keh00aEuLUT+O40+mJCEzaXkYfTCUKIyeDfMOFFQ==
+"@babel/plugin-transform-async-to-generator@^7.2.0", "@babel/plugin-transform-async-to-generator@^7.3.4":
+  version "7.3.4"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-async-to-generator/-/plugin-transform-async-to-generator-7.3.4.tgz#4e45408d3c3da231c0e7b823f407a53a7eb3048c"
+  integrity sha512-Y7nCzv2fw/jEZ9f678MuKdMo99MFDJMT/PvD9LisrR5JDFcJH6vYeH6RnjVt3p5tceyGRvTtEN0VOlU+rgHZjA==
   dependencies:
     "@babel/helper-module-imports" "^7.0.0"
     "@babel/helper-plugin-utils" "^7.0.0"
     "@babel/helper-remap-async-to-generator" "^7.1.0"
 
-"@babel/plugin-transform-block-scoped-functions@^7.0.0", "@babel/plugin-transform-block-scoped-functions@^7.2.0":
+"@babel/plugin-transform-block-scoped-functions@^7.2.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-transform-block-scoped-functions/-/plugin-transform-block-scoped-functions-7.2.0.tgz#5d3cc11e8d5ddd752aa64c9148d0db6cb79fd190"
   integrity sha512-ntQPR6q1/NKuphly49+QiQiTN0O63uOwjdD6dhIjSWBI5xlrbUFh720TIpzBhpnrLfv2tNH/BXvLIab1+BAI0w==
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
 
-"@babel/plugin-transform-block-scoping@^7.1.5", "@babel/plugin-transform-block-scoping@^7.2.0":
-  version "7.2.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-block-scoping/-/plugin-transform-block-scoping-7.2.0.tgz#f17c49d91eedbcdf5dd50597d16f5f2f770132d4"
-  integrity sha512-vDTgf19ZEV6mx35yiPJe4fS02mPQUUcBNwWQSZFXSzTSbsJFQvHt7DqyS3LK8oOWALFOsJ+8bbqBgkirZteD5Q==
+"@babel/plugin-transform-block-scoping@^7.2.0", "@babel/plugin-transform-block-scoping@^7.3.4":
+  version "7.3.4"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-block-scoping/-/plugin-transform-block-scoping-7.3.4.tgz#5c22c339de234076eee96c8783b2fed61202c5c4"
+  integrity sha512-blRr2O8IOZLAOJklXLV4WhcEzpYafYQKSGT3+R26lWG41u/FODJuBggehtOwilVAcFu393v3OFj+HmaE6tVjhA==
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
-    lodash "^4.17.10"
+    lodash "^4.17.11"
 
-"@babel/plugin-transform-classes@7.1.0":
-  version "7.1.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-classes/-/plugin-transform-classes-7.1.0.tgz#ab3f8a564361800cbc8ab1ca6f21108038432249"
-  integrity sha512-rNaqoD+4OCBZjM7VaskladgqnZ1LO6o2UxuWSDzljzW21pN1KXkB7BstAVweZdxQkHAujps5QMNOTWesBciKFg==
+"@babel/plugin-transform-classes@7.2.2":
+  version "7.2.2"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-classes/-/plugin-transform-classes-7.2.2.tgz#6c90542f210ee975aa2aa8c8b5af7fa73a126953"
+  integrity sha512-gEZvgTy1VtcDOaQty1l10T3jQmJKlNVxLDCs+3rCVPr6nMkODLELxViq5X9l+rfxbie3XrfrMCYYY6eX3aOcOQ==
   dependencies:
     "@babel/helper-annotate-as-pure" "^7.0.0"
     "@babel/helper-define-map" "^7.1.0"
@@ -493,42 +441,35 @@
     "@babel/helper-split-export-declaration" "^7.0.0"
     globals "^11.1.0"
 
-"@babel/plugin-transform-classes@^7.1.0", "@babel/plugin-transform-classes@^7.2.0":
-  version "7.2.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-classes/-/plugin-transform-classes-7.2.0.tgz#374f8876075d7d21fea55aeb5c53561259163f96"
-  integrity sha512-aPCEkrhJYebDXcGTAP+cdUENkH7zqOlgbKwLbghjjHpJRJBWM/FSlCjMoPGA8oUdiMfOrk3+8EFPLLb5r7zj2w==
+"@babel/plugin-transform-classes@^7.2.0", "@babel/plugin-transform-classes@^7.3.4":
+  version "7.3.4"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-classes/-/plugin-transform-classes-7.3.4.tgz#dc173cb999c6c5297e0b5f2277fdaaec3739d0cc"
+  integrity sha512-J9fAvCFBkXEvBimgYxCjvaVDzL6thk0j0dBvCeZmIUDBwyt+nv6HfbImsSrWsYXfDNDivyANgJlFXDUWRTZBuA==
   dependencies:
     "@babel/helper-annotate-as-pure" "^7.0.0"
     "@babel/helper-define-map" "^7.1.0"
     "@babel/helper-function-name" "^7.1.0"
     "@babel/helper-optimise-call-expression" "^7.0.0"
     "@babel/helper-plugin-utils" "^7.0.0"
-    "@babel/helper-replace-supers" "^7.1.0"
+    "@babel/helper-replace-supers" "^7.3.4"
     "@babel/helper-split-export-declaration" "^7.0.0"
     globals "^11.1.0"
 
-"@babel/plugin-transform-computed-properties@^7.0.0", "@babel/plugin-transform-computed-properties@^7.2.0":
+"@babel/plugin-transform-computed-properties@^7.2.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-transform-computed-properties/-/plugin-transform-computed-properties-7.2.0.tgz#83a7df6a658865b1c8f641d510c6f3af220216da"
   integrity sha512-kP/drqTxY6Xt3NNpKiMomfgkNn4o7+vKxK2DDKcBG9sHj51vHqMBGy8wbDS/J4lMxnqs153/T3+DmCEAkC5cpA==
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
 
-"@babel/plugin-transform-destructuring@7.1.3":
-  version "7.1.3"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-destructuring/-/plugin-transform-destructuring-7.1.3.tgz#e69ff50ca01fac6cb72863c544e516c2b193012f"
-  integrity sha512-Mb9M4DGIOspH1ExHOUnn2UUXFOyVTiX84fXCd+6B5iWrQg/QMeeRmSwpZ9lnjYLSXtZwiw80ytVMr3zue0ucYw==
+"@babel/plugin-transform-destructuring@7.3.2", "@babel/plugin-transform-destructuring@^7.2.0":
+  version "7.3.2"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-destructuring/-/plugin-transform-destructuring-7.3.2.tgz#f2f5520be055ba1c38c41c0e094d8a461dd78f2d"
+  integrity sha512-Lrj/u53Ufqxl/sGxyjsJ2XNtNuEjDyjpqdhMNh5aZ+XFOdThL46KBj27Uem4ggoezSYBxKWAil6Hu8HtwqesYw==
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
 
-"@babel/plugin-transform-destructuring@^7.0.0", "@babel/plugin-transform-destructuring@^7.2.0":
-  version "7.2.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-destructuring/-/plugin-transform-destructuring-7.2.0.tgz#e75269b4b7889ec3a332cd0d0c8cff8fed0dc6f3"
-  integrity sha512-coVO2Ayv7g0qdDbrNiadE4bU7lvCd9H539m2gMknyVjjMdwF/iCOM7R+E8PkntoqLkltO0rk+3axhpp/0v68VQ==
-  dependencies:
-    "@babel/helper-plugin-utils" "^7.0.0"
-
-"@babel/plugin-transform-dotall-regex@^7.0.0", "@babel/plugin-transform-dotall-regex@^7.2.0":
+"@babel/plugin-transform-dotall-regex@^7.2.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-transform-dotall-regex/-/plugin-transform-dotall-regex-7.2.0.tgz#f0aabb93d120a8ac61e925ea0ba440812dbe0e49"
   integrity sha512-sKxnyHfizweTgKZf7XsXu/CNupKhzijptfTM+bozonIuyVrLWVUvYjE2bhuSBML8VQeMxq4Mm63Q9qvcvUcciQ==
@@ -537,14 +478,14 @@
     "@babel/helper-regex" "^7.0.0"
     regexpu-core "^4.1.3"
 
-"@babel/plugin-transform-duplicate-keys@^7.0.0", "@babel/plugin-transform-duplicate-keys@^7.2.0":
+"@babel/plugin-transform-duplicate-keys@^7.2.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-transform-duplicate-keys/-/plugin-transform-duplicate-keys-7.2.0.tgz#d952c4930f312a4dbfff18f0b2914e60c35530b3"
   integrity sha512-q+yuxW4DsTjNceUiTzK0L+AfQ0zD9rWaTLiUqHA8p0gxx7lu1EylenfzjeIWNkPy6e/0VG/Wjw9uf9LueQwLOw==
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
 
-"@babel/plugin-transform-exponentiation-operator@^7.1.0", "@babel/plugin-transform-exponentiation-operator@^7.2.0":
+"@babel/plugin-transform-exponentiation-operator@^7.2.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-transform-exponentiation-operator/-/plugin-transform-exponentiation-operator-7.2.0.tgz#a63868289e5b4007f7054d46491af51435766008"
   integrity sha512-umh4hR6N7mu4Elq9GG8TOu9M0bakvlsREEC+ialrQN6ABS4oDQ69qJv1VtR3uxlKMCQMCvzk7vr17RHKcjx68A==
@@ -552,30 +493,30 @@
     "@babel/helper-builder-binary-assignment-operator-visitor" "^7.1.0"
     "@babel/helper-plugin-utils" "^7.0.0"
 
-"@babel/plugin-transform-flow-strip-types@7.1.6":
-  version "7.1.6"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-flow-strip-types/-/plugin-transform-flow-strip-types-7.1.6.tgz#4b7be62604d39e63cfe23b1d00d63e9fb7e763ba"
-  integrity sha512-0tyFAAjJmnRlr8MVJV39ASn1hv+PbdVP71hf7aAseqLfQ0o9QXk9htbMbq7/ZYXnUIp6gDw0lUUP0+PQMbbtmg==
-  dependencies:
-    "@babel/helper-plugin-utils" "^7.0.0"
-    "@babel/plugin-syntax-flow" "^7.0.0"
-
-"@babel/plugin-transform-flow-strip-types@^7.0.0":
-  version "7.2.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-flow-strip-types/-/plugin-transform-flow-strip-types-7.2.0.tgz#db6180d098caaabdd609a8da3800f5204e66b69b"
-  integrity sha512-xhQp0lyXA5vk8z1kJitdMozQYEWfo4MgC6neNXrb5euqHiTIGhj5ZWfFPkVESInQSk9WZz1bbNmIRz6zKfWGVA==
+"@babel/plugin-transform-flow-strip-types@7.2.3":
+  version "7.2.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-flow-strip-types/-/plugin-transform-flow-strip-types-7.2.3.tgz#e3ac2a594948454e7431c7db33e1d02d51b5cd69"
+  integrity sha512-xnt7UIk9GYZRitqCnsVMjQK1O2eKZwFB3CvvHjf5SGx6K6vr/MScCKQDnf1DxRaj501e3pXjti+inbSXX2ZUoQ==
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
     "@babel/plugin-syntax-flow" "^7.2.0"
 
-"@babel/plugin-transform-for-of@^7.0.0", "@babel/plugin-transform-for-of@^7.2.0":
+"@babel/plugin-transform-flow-strip-types@^7.0.0":
+  version "7.3.4"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-flow-strip-types/-/plugin-transform-flow-strip-types-7.3.4.tgz#00156236defb7dedddc2d3c9477dcc01a4494327"
+  integrity sha512-PmQC9R7DwpBFA+7ATKMyzViz3zCaMNouzZMPZN2K5PnbBbtL3AXFYTkDk+Hey5crQq2A90UG5Uthz0mel+XZrA==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.0.0"
+    "@babel/plugin-syntax-flow" "^7.2.0"
+
+"@babel/plugin-transform-for-of@^7.2.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-transform-for-of/-/plugin-transform-for-of-7.2.0.tgz#ab7468befa80f764bb03d3cb5eef8cc998e1cad9"
   integrity sha512-Kz7Mt0SsV2tQk6jG5bBv5phVbkd0gd27SgYD4hH1aLMJRchM0dzHaXvrWhVZ+WxAlDoAKZ7Uy3jVTW2mKXQ1WQ==
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
 
-"@babel/plugin-transform-function-name@^7.1.0", "@babel/plugin-transform-function-name@^7.2.0":
+"@babel/plugin-transform-function-name@^7.2.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-transform-function-name/-/plugin-transform-function-name-7.2.0.tgz#f7930362829ff99a3174c39f0afcc024ef59731a"
   integrity sha512-kWgksow9lHdvBC2Z4mxTsvc7YdY7w/V6B2vy9cTIPtLEE9NhwoWivaxdNM/S37elu5bqlLP/qOY906LukO9lkQ==
@@ -583,14 +524,14 @@
     "@babel/helper-function-name" "^7.1.0"
     "@babel/helper-plugin-utils" "^7.0.0"
 
-"@babel/plugin-transform-literals@^7.0.0", "@babel/plugin-transform-literals@^7.2.0":
+"@babel/plugin-transform-literals@^7.2.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-transform-literals/-/plugin-transform-literals-7.2.0.tgz#690353e81f9267dad4fd8cfd77eafa86aba53ea1"
   integrity sha512-2ThDhm4lI4oV7fVQ6pNNK+sx+c/GM5/SaML0w/r4ZB7sAneD/piDJtwdKlNckXeyGK7wlwg2E2w33C/Hh+VFCg==
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
 
-"@babel/plugin-transform-modules-amd@^7.1.0", "@babel/plugin-transform-modules-amd@^7.2.0":
+"@babel/plugin-transform-modules-amd@^7.2.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-transform-modules-amd/-/plugin-transform-modules-amd-7.2.0.tgz#82a9bce45b95441f617a24011dc89d12da7f4ee6"
   integrity sha512-mK2A8ucqz1qhrdqjS9VMIDfIvvT2thrEsIQzbaTdc5QFzhDjQv2CkJJ5f6BXIkgbmaoax3zBr2RyvV/8zeoUZw==
@@ -598,7 +539,7 @@
     "@babel/helper-module-transforms" "^7.1.0"
     "@babel/helper-plugin-utils" "^7.0.0"
 
-"@babel/plugin-transform-modules-commonjs@^7.1.0", "@babel/plugin-transform-modules-commonjs@^7.2.0":
+"@babel/plugin-transform-modules-commonjs@^7.2.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-transform-modules-commonjs/-/plugin-transform-modules-commonjs-7.2.0.tgz#c4f1933f5991d5145e9cfad1dfd848ea1727f404"
   integrity sha512-V6y0uaUQrQPXUrmj+hgnks8va2L0zcZymeU7TtWEgdRLNkceafKXEduv7QzgQAE4lT+suwooG9dC7LFhdRAbVQ==
@@ -607,15 +548,15 @@
     "@babel/helper-plugin-utils" "^7.0.0"
     "@babel/helper-simple-access" "^7.1.0"
 
-"@babel/plugin-transform-modules-systemjs@^7.0.0", "@babel/plugin-transform-modules-systemjs@^7.2.0":
-  version "7.2.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-modules-systemjs/-/plugin-transform-modules-systemjs-7.2.0.tgz#912bfe9e5ff982924c81d0937c92d24994bb9068"
-  integrity sha512-aYJwpAhoK9a+1+O625WIjvMY11wkB/ok0WClVwmeo3mCjcNRjt+/8gHWrB5i+00mUju0gWsBkQnPpdvQ7PImmQ==
+"@babel/plugin-transform-modules-systemjs@^7.2.0", "@babel/plugin-transform-modules-systemjs@^7.3.4":
+  version "7.3.4"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-modules-systemjs/-/plugin-transform-modules-systemjs-7.3.4.tgz#813b34cd9acb6ba70a84939f3680be0eb2e58861"
+  integrity sha512-VZ4+jlGOF36S7TjKs8g4ojp4MEI+ebCQZdswWb/T9I4X84j8OtFAyjXjt/M16iIm5RIZn0UMQgg/VgIwo/87vw==
   dependencies:
     "@babel/helper-hoist-variables" "^7.0.0"
     "@babel/helper-plugin-utils" "^7.0.0"
 
-"@babel/plugin-transform-modules-umd@^7.1.0", "@babel/plugin-transform-modules-umd@^7.2.0":
+"@babel/plugin-transform-modules-umd@^7.2.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-transform-modules-umd/-/plugin-transform-modules-umd-7.2.0.tgz#7678ce75169f0877b8eb2235538c074268dd01ae"
   integrity sha512-BV3bw6MyUH1iIsGhXlOK6sXhmSarZjtJ/vMiD9dNmpY8QXFFQTj+6v92pcfy1iqa8DeAfJFwoxcrS/TUZda6sw==
@@ -637,7 +578,7 @@
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
 
-"@babel/plugin-transform-object-super@^7.1.0", "@babel/plugin-transform-object-super@^7.2.0":
+"@babel/plugin-transform-object-super@^7.2.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-transform-object-super/-/plugin-transform-object-super-7.2.0.tgz#b35d4c10f56bab5d650047dad0f1d8e8814b6598"
   integrity sha512-VMyhPYZISFZAqAPVkiYb7dUe2AsVi2/wCT5+wZdsNO31FojQJa9ns40hzZ6U9f50Jlq4w6qwzdBB2uwqZ00ebg==
@@ -645,24 +586,16 @@
     "@babel/helper-plugin-utils" "^7.0.0"
     "@babel/helper-replace-supers" "^7.1.0"
 
-"@babel/plugin-transform-parameters@^7.1.0", "@babel/plugin-transform-parameters@^7.2.0":
-  version "7.2.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-parameters/-/plugin-transform-parameters-7.2.0.tgz#0d5ad15dc805e2ea866df4dd6682bfe76d1408c2"
-  integrity sha512-kB9+hhUidIgUoBQ0MsxMewhzr8i60nMa2KgeJKQWYrqQpqcBYtnpR+JgkadZVZoaEZ/eKu9mclFaVwhRpLNSzA==
+"@babel/plugin-transform-parameters@^7.2.0":
+  version "7.3.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-parameters/-/plugin-transform-parameters-7.3.3.tgz#3a873e07114e1a5bee17d04815662c8317f10e30"
+  integrity sha512-IrIP25VvXWu/VlBWTpsjGptpomtIkYrN/3aDp4UKm7xK6UxZY88kcJ1UwETbzHAlwN21MnNfwlar0u8y3KpiXw==
   dependencies:
     "@babel/helper-call-delegate" "^7.1.0"
     "@babel/helper-get-function-arity" "^7.0.0"
     "@babel/helper-plugin-utils" "^7.0.0"
 
-"@babel/plugin-transform-react-constant-elements@7.0.0":
-  version "7.0.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-react-constant-elements/-/plugin-transform-react-constant-elements-7.0.0.tgz#ab413e33e9c46a766f5326014bcbf9e2b34ef7a4"
-  integrity sha512-z8yrW4KCVcqPYr0r9dHXe7fu3daLzn0r6TQEFoGbXahdrzEwT1d1ux+/EnFcqIHv9uPilUlnRnPIUf7GMO0ehg==
-  dependencies:
-    "@babel/helper-annotate-as-pure" "^7.0.0"
-    "@babel/helper-plugin-utils" "^7.0.0"
-
-"@babel/plugin-transform-react-constant-elements@^7.0.0", "@babel/plugin-transform-react-constant-elements@^7.2.0":
+"@babel/plugin-transform-react-constant-elements@7.2.0", "@babel/plugin-transform-react-constant-elements@^7.0.0", "@babel/plugin-transform-react-constant-elements@^7.2.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-transform-react-constant-elements/-/plugin-transform-react-constant-elements-7.2.0.tgz#ed602dc2d8bff2f0cb1a5ce29263dbdec40779f7"
   integrity sha512-YYQFg6giRFMsZPKUM9v+VcHOdfSQdz9jHCx3akAi3UYgyjndmdYGSXylQ/V+HswQt4fL8IklchD9HTsaOCrWQQ==
@@ -670,14 +603,7 @@
     "@babel/helper-annotate-as-pure" "^7.0.0"
     "@babel/helper-plugin-utils" "^7.0.0"
 
-"@babel/plugin-transform-react-display-name@7.0.0":
-  version "7.0.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-react-display-name/-/plugin-transform-react-display-name-7.0.0.tgz#93759e6c023782e52c2da3b75eca60d4f10533ee"
-  integrity sha512-BX8xKuQTO0HzINxT6j/GiCwoJB0AOMs0HmLbEnAvcte8U8rSkNa/eSCAY+l1OA4JnCVq2jw2p6U8QQryy2fTPg==
-  dependencies:
-    "@babel/helper-plugin-utils" "^7.0.0"
-
-"@babel/plugin-transform-react-display-name@^7.0.0":
+"@babel/plugin-transform-react-display-name@7.2.0", "@babel/plugin-transform-react-display-name@^7.0.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-transform-react-display-name/-/plugin-transform-react-display-name-7.2.0.tgz#ebfaed87834ce8dc4279609a4f0c324c156e3eb0"
   integrity sha512-Htf/tPa5haZvRMiNSQSFifK12gtr/8vwfr+A9y69uF0QcU77AVu4K7MiHEkTxF7lQoHOL0F9ErqgfNEAKgXj7A==
@@ -701,46 +627,46 @@
     "@babel/plugin-syntax-jsx" "^7.2.0"
 
 "@babel/plugin-transform-react-jsx@^7.0.0":
-  version "7.2.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-react-jsx/-/plugin-transform-react-jsx-7.2.0.tgz#ca36b6561c4d3b45524f8efb6f0fbc9a0d1d622f"
-  integrity sha512-h/fZRel5wAfCqcKgq3OhbmYaReo7KkoJBpt8XnvpS7wqaNMqtw5xhxutzcm35iMUWucfAdT/nvGTsWln0JTg2Q==
+  version "7.3.0"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-react-jsx/-/plugin-transform-react-jsx-7.3.0.tgz#f2cab99026631c767e2745a5368b331cfe8f5290"
+  integrity sha512-a/+aRb7R06WcKvQLOu4/TpjKOdvVEKRLWFpKcNuHhiREPgGRB4TQJxq07+EZLS8LFVYpfq1a5lDUnuMdcCpBKg==
   dependencies:
-    "@babel/helper-builder-react-jsx" "^7.0.0"
+    "@babel/helper-builder-react-jsx" "^7.3.0"
     "@babel/helper-plugin-utils" "^7.0.0"
     "@babel/plugin-syntax-jsx" "^7.2.0"
 
-"@babel/plugin-transform-regenerator@^7.0.0":
-  version "7.0.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-regenerator/-/plugin-transform-regenerator-7.0.0.tgz#5b41686b4ed40bef874d7ed6a84bdd849c13e0c1"
-  integrity sha512-sj2qzsEx8KDVv1QuJc/dEfilkg3RRPvPYx/VnKLtItVQRWt1Wqf5eVCOLZm29CiGFfYYsA3VPjfizTCV0S0Dlw==
+"@babel/plugin-transform-regenerator@^7.0.0", "@babel/plugin-transform-regenerator@^7.3.4":
+  version "7.3.4"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-regenerator/-/plugin-transform-regenerator-7.3.4.tgz#1601655c362f5b38eead6a52631f5106b29fa46a"
+  integrity sha512-hvJg8EReQvXT6G9H2MvNPXkv9zK36Vxa1+csAVTpE1J3j0zlHplw76uudEbJxgvqZzAq9Yh45FLD4pk5mKRFQA==
   dependencies:
-    regenerator-transform "^0.13.3"
+    regenerator-transform "^0.13.4"
 
-"@babel/plugin-transform-runtime@7.1.0":
-  version "7.1.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-runtime/-/plugin-transform-runtime-7.1.0.tgz#9f76920d42551bb577e2dc594df229b5f7624b63"
-  integrity sha512-WFLMgzu5DLQEah0lKTJzYb14vd6UiES7PTnXcvrPZ1VrwFeJ+mTbvr65fFAsXYMt2bIoOoC0jk76zY1S7HZjUg==
+"@babel/plugin-transform-runtime@7.2.0":
+  version "7.2.0"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-runtime/-/plugin-transform-runtime-7.2.0.tgz#566bc43f7d0aedc880eaddbd29168d0f248966ea"
+  integrity sha512-jIgkljDdq4RYDnJyQsiWbdvGeei/0MOTtSHKO/rfbd/mXBxNpdlulMx49L0HQ4pug1fXannxoqCI+fYSle9eSw==
   dependencies:
     "@babel/helper-module-imports" "^7.0.0"
     "@babel/helper-plugin-utils" "^7.0.0"
     resolve "^1.8.1"
     semver "^5.5.1"
 
-"@babel/plugin-transform-shorthand-properties@^7.0.0", "@babel/plugin-transform-shorthand-properties@^7.2.0":
+"@babel/plugin-transform-shorthand-properties@^7.2.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-transform-shorthand-properties/-/plugin-transform-shorthand-properties-7.2.0.tgz#6333aee2f8d6ee7e28615457298934a3b46198f0"
   integrity sha512-QP4eUM83ha9zmYtpbnyjTLAGKQritA5XW/iG9cjtuOI8s1RuL/3V6a3DeSHfKutJQ+ayUfeZJPcnCYEQzaPQqg==
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
 
-"@babel/plugin-transform-spread@^7.0.0", "@babel/plugin-transform-spread@^7.2.0":
-  version "7.2.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-spread/-/plugin-transform-spread-7.2.0.tgz#0c76c12a3b5826130078ee8ec84a7a8e4afd79c4"
-  integrity sha512-7TtPIdwjS/i5ZBlNiQePQCovDh9pAhVbp/nGVRBZuUdBiVRThyyLend3OHobc0G+RLCPPAN70+z/MAMhsgJd/A==
+"@babel/plugin-transform-spread@^7.2.0":
+  version "7.2.2"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-spread/-/plugin-transform-spread-7.2.2.tgz#3103a9abe22f742b6d406ecd3cd49b774919b406"
+  integrity sha512-KWfky/58vubwtS0hLqEnrWJjsMGaOeSBn90Ezn5Jeg9Z8KKHmELbP1yGylMlm5N6TPKeY9A2+UaSYLdxahg01w==
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
 
-"@babel/plugin-transform-sticky-regex@^7.0.0", "@babel/plugin-transform-sticky-regex@^7.2.0":
+"@babel/plugin-transform-sticky-regex@^7.2.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-transform-sticky-regex/-/plugin-transform-sticky-regex-7.2.0.tgz#a1e454b5995560a9c1e0d537dfc15061fd2687e1"
   integrity sha512-KKYCoGaRAf+ckH8gEL3JHUaFVyNHKe3ASNsZ+AlktgHevvxGigoIttrEJb8iKN03Q7Eazlv1s6cx2B2cQ3Jabw==
@@ -748,7 +674,7 @@
     "@babel/helper-plugin-utils" "^7.0.0"
     "@babel/helper-regex" "^7.0.0"
 
-"@babel/plugin-transform-template-literals@^7.0.0", "@babel/plugin-transform-template-literals@^7.2.0":
+"@babel/plugin-transform-template-literals@^7.2.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-transform-template-literals/-/plugin-transform-template-literals-7.2.0.tgz#d87ed01b8eaac7a92473f608c97c089de2ba1e5b"
   integrity sha512-FkPix00J9A/XWXv4VoKJBMeSkyY9x/TqIh76wzcdfl57RJJcf8CehQ08uwfhCDNtRQYtHQKBTwKZDEyjE13Lwg==
@@ -756,7 +682,7 @@
     "@babel/helper-annotate-as-pure" "^7.0.0"
     "@babel/helper-plugin-utils" "^7.0.0"
 
-"@babel/plugin-transform-typeof-symbol@^7.0.0", "@babel/plugin-transform-typeof-symbol@^7.2.0":
+"@babel/plugin-transform-typeof-symbol@^7.2.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-transform-typeof-symbol/-/plugin-transform-typeof-symbol-7.2.0.tgz#117d2bcec2fbf64b4b59d1f9819894682d29f2b2"
   integrity sha512-2LNhETWYxiYysBtrBTqL8+La0jIoQQnIScUJc74OYvUGRmkskNY4EzLCnjHBzdmb38wqtTaixpo1NctEcvMDZw==
@@ -764,14 +690,14 @@
     "@babel/helper-plugin-utils" "^7.0.0"
 
 "@babel/plugin-transform-typescript@^7.1.0":
-  version "7.2.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-typescript/-/plugin-transform-typescript-7.2.0.tgz#bce7c06300434de6a860ae8acf6a442ef74a99d1"
-  integrity sha512-EnI7i2/gJ7ZNr2MuyvN2Hu+BHJENlxWte5XygPvfj/MbvtOkWor9zcnHpMMQL2YYaaCcqtIvJUyJ7QVfoGs7ew==
+  version "7.3.2"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-typescript/-/plugin-transform-typescript-7.3.2.tgz#59a7227163e55738842f043d9e5bd7c040447d96"
+  integrity sha512-Pvco0x0ZSCnexJnshMfaibQ5hnK8aUHSvjCQhC1JR8eeg+iBwt0AtCO7gWxJ358zZevuf9wPSO5rv+WJcbHPXQ==
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
     "@babel/plugin-syntax-typescript" "^7.2.0"
 
-"@babel/plugin-transform-unicode-regex@^7.0.0", "@babel/plugin-transform-unicode-regex@^7.2.0":
+"@babel/plugin-transform-unicode-regex@^7.2.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-transform-unicode-regex/-/plugin-transform-unicode-regex-7.2.0.tgz#4eb8db16f972f8abb5062c161b8b115546ade08b"
   integrity sha512-m48Y0lMhrbXEJnVUaYly29jRXbQ3ksxPrS1Tg8t+MHqzXhtBYAvI51euOBaoAlZLPHsieY9XPVMf80a5x0cPcA==
@@ -780,101 +706,7 @@
     "@babel/helper-regex" "^7.0.0"
     regexpu-core "^4.1.3"
 
-"@babel/preset-env@7.1.6":
-  version "7.1.6"
-  resolved "https://registry.yarnpkg.com/@babel/preset-env/-/preset-env-7.1.6.tgz#a0bf4b96b6bfcf6e000afc5b72b4abe7cc13ae97"
-  integrity sha512-YIBfpJNQMBkb6MCkjz/A9J76SNCSuGVamOVBgoUkLzpJD/z8ghHi9I42LQ4pulVX68N/MmImz6ZTixt7Azgexw==
-  dependencies:
-    "@babel/helper-module-imports" "^7.0.0"
-    "@babel/helper-plugin-utils" "^7.0.0"
-    "@babel/plugin-proposal-async-generator-functions" "^7.1.0"
-    "@babel/plugin-proposal-json-strings" "^7.0.0"
-    "@babel/plugin-proposal-object-rest-spread" "^7.0.0"
-    "@babel/plugin-proposal-optional-catch-binding" "^7.0.0"
-    "@babel/plugin-proposal-unicode-property-regex" "^7.0.0"
-    "@babel/plugin-syntax-async-generators" "^7.0.0"
-    "@babel/plugin-syntax-object-rest-spread" "^7.0.0"
-    "@babel/plugin-syntax-optional-catch-binding" "^7.0.0"
-    "@babel/plugin-transform-arrow-functions" "^7.0.0"
-    "@babel/plugin-transform-async-to-generator" "^7.1.0"
-    "@babel/plugin-transform-block-scoped-functions" "^7.0.0"
-    "@babel/plugin-transform-block-scoping" "^7.1.5"
-    "@babel/plugin-transform-classes" "^7.1.0"
-    "@babel/plugin-transform-computed-properties" "^7.0.0"
-    "@babel/plugin-transform-destructuring" "^7.0.0"
-    "@babel/plugin-transform-dotall-regex" "^7.0.0"
-    "@babel/plugin-transform-duplicate-keys" "^7.0.0"
-    "@babel/plugin-transform-exponentiation-operator" "^7.1.0"
-    "@babel/plugin-transform-for-of" "^7.0.0"
-    "@babel/plugin-transform-function-name" "^7.1.0"
-    "@babel/plugin-transform-literals" "^7.0.0"
-    "@babel/plugin-transform-modules-amd" "^7.1.0"
-    "@babel/plugin-transform-modules-commonjs" "^7.1.0"
-    "@babel/plugin-transform-modules-systemjs" "^7.0.0"
-    "@babel/plugin-transform-modules-umd" "^7.1.0"
-    "@babel/plugin-transform-new-target" "^7.0.0"
-    "@babel/plugin-transform-object-super" "^7.1.0"
-    "@babel/plugin-transform-parameters" "^7.1.0"
-    "@babel/plugin-transform-regenerator" "^7.0.0"
-    "@babel/plugin-transform-shorthand-properties" "^7.0.0"
-    "@babel/plugin-transform-spread" "^7.0.0"
-    "@babel/plugin-transform-sticky-regex" "^7.0.0"
-    "@babel/plugin-transform-template-literals" "^7.0.0"
-    "@babel/plugin-transform-typeof-symbol" "^7.0.0"
-    "@babel/plugin-transform-unicode-regex" "^7.0.0"
-    browserslist "^4.1.0"
-    invariant "^2.2.2"
-    js-levenshtein "^1.1.3"
-    semver "^5.3.0"
-
-"@babel/preset-env@^7.1.6":
-  version "7.2.0"
-  resolved "https://registry.yarnpkg.com/@babel/preset-env/-/preset-env-7.2.0.tgz#a5030e7e4306af5a295dd5d7c78dc5464af3fee2"
-  integrity sha512-haGR38j5vOGVeBatrQPr3l0xHbs14505DcM57cbJy48kgMFvvHHoYEhHuRV+7vi559yyAUAVbTWzbK/B/pzJng==
-  dependencies:
-    "@babel/helper-module-imports" "^7.0.0"
-    "@babel/helper-plugin-utils" "^7.0.0"
-    "@babel/plugin-proposal-async-generator-functions" "^7.2.0"
-    "@babel/plugin-proposal-json-strings" "^7.2.0"
-    "@babel/plugin-proposal-object-rest-spread" "^7.2.0"
-    "@babel/plugin-proposal-optional-catch-binding" "^7.2.0"
-    "@babel/plugin-proposal-unicode-property-regex" "^7.2.0"
-    "@babel/plugin-syntax-async-generators" "^7.2.0"
-    "@babel/plugin-syntax-object-rest-spread" "^7.2.0"
-    "@babel/plugin-syntax-optional-catch-binding" "^7.2.0"
-    "@babel/plugin-transform-arrow-functions" "^7.2.0"
-    "@babel/plugin-transform-async-to-generator" "^7.2.0"
-    "@babel/plugin-transform-block-scoped-functions" "^7.2.0"
-    "@babel/plugin-transform-block-scoping" "^7.2.0"
-    "@babel/plugin-transform-classes" "^7.2.0"
-    "@babel/plugin-transform-computed-properties" "^7.2.0"
-    "@babel/plugin-transform-destructuring" "^7.2.0"
-    "@babel/plugin-transform-dotall-regex" "^7.2.0"
-    "@babel/plugin-transform-duplicate-keys" "^7.2.0"
-    "@babel/plugin-transform-exponentiation-operator" "^7.2.0"
-    "@babel/plugin-transform-for-of" "^7.2.0"
-    "@babel/plugin-transform-function-name" "^7.2.0"
-    "@babel/plugin-transform-literals" "^7.2.0"
-    "@babel/plugin-transform-modules-amd" "^7.2.0"
-    "@babel/plugin-transform-modules-commonjs" "^7.2.0"
-    "@babel/plugin-transform-modules-systemjs" "^7.2.0"
-    "@babel/plugin-transform-modules-umd" "^7.2.0"
-    "@babel/plugin-transform-new-target" "^7.0.0"
-    "@babel/plugin-transform-object-super" "^7.2.0"
-    "@babel/plugin-transform-parameters" "^7.2.0"
-    "@babel/plugin-transform-regenerator" "^7.0.0"
-    "@babel/plugin-transform-shorthand-properties" "^7.2.0"
-    "@babel/plugin-transform-spread" "^7.2.0"
-    "@babel/plugin-transform-sticky-regex" "^7.2.0"
-    "@babel/plugin-transform-template-literals" "^7.2.0"
-    "@babel/plugin-transform-typeof-symbol" "^7.2.0"
-    "@babel/plugin-transform-unicode-regex" "^7.2.0"
-    browserslist "^4.3.4"
-    invariant "^2.2.2"
-    js-levenshtein "^1.1.3"
-    semver "^5.3.0"
-
-"@babel/preset-env@^7.3.1":
+"@babel/preset-env@7.3.1":
   version "7.3.1"
   resolved "https://registry.yarnpkg.com/@babel/preset-env/-/preset-env-7.3.1.tgz#389e8ca6b17ae67aaf9a2111665030be923515db"
   integrity sha512-FHKrD6Dxf30e8xgHQO0zJZpUPfVZg+Xwgz5/RdSWCbza9QLNk4Qbp40ctRoqDxml3O8RMzB1DU55SXeDG6PqHQ==
@@ -923,6 +755,55 @@
     js-levenshtein "^1.1.3"
     semver "^5.3.0"
 
+"@babel/preset-env@^7.1.6", "@babel/preset-env@^7.3.1":
+  version "7.3.4"
+  resolved "https://registry.yarnpkg.com/@babel/preset-env/-/preset-env-7.3.4.tgz#887cf38b6d23c82f19b5135298bdb160062e33e1"
+  integrity sha512-2mwqfYMK8weA0g0uBKOt4FE3iEodiHy9/CW0b+nWXcbL+pGzLx8ESYc+j9IIxr6LTDHWKgPm71i9smo02bw+gA==
+  dependencies:
+    "@babel/helper-module-imports" "^7.0.0"
+    "@babel/helper-plugin-utils" "^7.0.0"
+    "@babel/plugin-proposal-async-generator-functions" "^7.2.0"
+    "@babel/plugin-proposal-json-strings" "^7.2.0"
+    "@babel/plugin-proposal-object-rest-spread" "^7.3.4"
+    "@babel/plugin-proposal-optional-catch-binding" "^7.2.0"
+    "@babel/plugin-proposal-unicode-property-regex" "^7.2.0"
+    "@babel/plugin-syntax-async-generators" "^7.2.0"
+    "@babel/plugin-syntax-json-strings" "^7.2.0"
+    "@babel/plugin-syntax-object-rest-spread" "^7.2.0"
+    "@babel/plugin-syntax-optional-catch-binding" "^7.2.0"
+    "@babel/plugin-transform-arrow-functions" "^7.2.0"
+    "@babel/plugin-transform-async-to-generator" "^7.3.4"
+    "@babel/plugin-transform-block-scoped-functions" "^7.2.0"
+    "@babel/plugin-transform-block-scoping" "^7.3.4"
+    "@babel/plugin-transform-classes" "^7.3.4"
+    "@babel/plugin-transform-computed-properties" "^7.2.0"
+    "@babel/plugin-transform-destructuring" "^7.2.0"
+    "@babel/plugin-transform-dotall-regex" "^7.2.0"
+    "@babel/plugin-transform-duplicate-keys" "^7.2.0"
+    "@babel/plugin-transform-exponentiation-operator" "^7.2.0"
+    "@babel/plugin-transform-for-of" "^7.2.0"
+    "@babel/plugin-transform-function-name" "^7.2.0"
+    "@babel/plugin-transform-literals" "^7.2.0"
+    "@babel/plugin-transform-modules-amd" "^7.2.0"
+    "@babel/plugin-transform-modules-commonjs" "^7.2.0"
+    "@babel/plugin-transform-modules-systemjs" "^7.3.4"
+    "@babel/plugin-transform-modules-umd" "^7.2.0"
+    "@babel/plugin-transform-named-capturing-groups-regex" "^7.3.0"
+    "@babel/plugin-transform-new-target" "^7.0.0"
+    "@babel/plugin-transform-object-super" "^7.2.0"
+    "@babel/plugin-transform-parameters" "^7.2.0"
+    "@babel/plugin-transform-regenerator" "^7.3.4"
+    "@babel/plugin-transform-shorthand-properties" "^7.2.0"
+    "@babel/plugin-transform-spread" "^7.2.0"
+    "@babel/plugin-transform-sticky-regex" "^7.2.0"
+    "@babel/plugin-transform-template-literals" "^7.2.0"
+    "@babel/plugin-transform-typeof-symbol" "^7.2.0"
+    "@babel/plugin-transform-unicode-regex" "^7.2.0"
+    browserslist "^4.3.4"
+    invariant "^2.2.2"
+    js-levenshtein "^1.1.3"
+    semver "^5.3.0"
+
 "@babel/preset-flow@^7.0.0":
   version "7.0.0"
   resolved "https://registry.yarnpkg.com/@babel/preset-flow/-/preset-flow-7.0.0.tgz#afd764835d9535ec63d8c7d4caf1c06457263da2"
@@ -950,95 +831,57 @@
     "@babel/helper-plugin-utils" "^7.0.0"
     "@babel/plugin-transform-typescript" "^7.1.0"
 
-"@babel/runtime@7.1.5":
-  version "7.1.5"
-  resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.1.5.tgz#4170907641cf1f61508f563ece3725150cc6fe39"
-  integrity sha512-xKnPpXG/pvK1B90JkwwxSGii90rQGKtzcMt2gI5G6+M0REXaq6rOHsGC2ay6/d0Uje7zzvSzjEzfR3ENhFlrfA==
+"@babel/runtime@7.3.1":
+  version "7.3.1"
+  resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.3.1.tgz#574b03e8e8a9898eaf4a872a92ea20b7846f6f2a"
+  integrity sha512-7jGW8ppV0ant637pIqAcFfQDDH1orEPGJb8aXfUozuCU3QqX7rX4DA8iwrbPrR1hcH0FTTHz47yQnk+bl5xHQA==
   dependencies:
     regenerator-runtime "^0.12.0"
 
-"@babel/runtime@^7.0.0":
-  version "7.1.2"
-  resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.1.2.tgz#81c89935f4647706fc54541145e6b4ecfef4b8e3"
-  integrity sha512-Y3SCjmhSupzFB6wcv1KmmFucH6gDVnI30WjOcicV10ju0cZjak3Jcs67YLIXBrmZYw1xCrVeJPbycFwrqNyxpg==
-  dependencies:
-    regenerator-runtime "^0.12.0"
-
-"@babel/runtime@^7.1.2", "@babel/runtime@^7.2.0":
-  version "7.2.0"
-  resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.2.0.tgz#b03e42eeddf5898e00646e4c840fa07ba8dcad7f"
-  integrity sha512-oouEibCbHMVdZSDlJBO6bZmID/zA/G/Qx3H1d3rSNPTD+L8UNKvCat7aKWSJ74zYbm5zWGh0GQN0hKj8zYFTCg==
-  dependencies:
-    regenerator-runtime "^0.12.0"
-
-"@babel/runtime@^7.3.1", "@babel/runtime@^7.3.4":
+"@babel/runtime@^7.0.0", "@babel/runtime@^7.1.2", "@babel/runtime@^7.2.0", "@babel/runtime@^7.3.4":
   version "7.3.4"
   resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.3.4.tgz#73d12ba819e365fcf7fd152aed56d6df97d21c83"
   integrity sha512-IvfvnMdSaLBateu0jfsYIpZTxAc2cKEXEMiezGGN75QcBcecDUKd3PgLAncT0oOgxKy8dd8hrJKj9MfzgfZd6g==
   dependencies:
     regenerator-runtime "^0.12.0"
 
-"@babel/template@^7.1.0", "@babel/template@^7.1.2":
-  version "7.1.2"
-  resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.1.2.tgz#090484a574fef5a2d2d7726a674eceda5c5b5644"
-  integrity sha512-SY1MmplssORfFiLDcOETrW7fCLl+PavlwMh92rrGcikQaRq4iWPVH0MpwPpY3etVMx6RnDjXtr6VZYr/IbP/Ag==
-  dependencies:
-    "@babel/code-frame" "^7.0.0"
-    "@babel/parser" "^7.1.2"
-    "@babel/types" "^7.1.2"
-
-"@babel/traverse@^7.1.0", "@babel/traverse@^7.1.5", "@babel/traverse@^7.1.6":
-  version "7.1.6"
-  resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.1.6.tgz#c8db9963ab4ce5b894222435482bd8ea854b7b5c"
-  integrity sha512-CXedit6GpISz3sC2k2FsGCUpOhUqKdyL0lqNrImQojagnUMXf8hex4AxYFRuMkNGcvJX5QAFGzB5WJQmSv8SiQ==
-  dependencies:
-    "@babel/code-frame" "^7.0.0"
-    "@babel/generator" "^7.1.6"
-    "@babel/helper-function-name" "^7.1.0"
-    "@babel/helper-split-export-declaration" "^7.0.0"
-    "@babel/parser" "^7.1.6"
-    "@babel/types" "^7.1.6"
-    debug "^4.1.0"
-    globals "^11.1.0"
-    lodash "^4.17.10"
-
-"@babel/traverse@^7.2.3":
-  version "7.2.3"
-  resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.2.3.tgz#7ff50cefa9c7c0bd2d81231fdac122f3957748d8"
-  integrity sha512-Z31oUD/fJvEWVR0lNZtfgvVt512ForCTNKYcJBGbPb1QZfve4WGH8Wsy7+Mev33/45fhP/hwQtvgusNdcCMgSw==
-  dependencies:
-    "@babel/code-frame" "^7.0.0"
-    "@babel/generator" "^7.2.2"
-    "@babel/helper-function-name" "^7.1.0"
-    "@babel/helper-split-export-declaration" "^7.0.0"
-    "@babel/parser" "^7.2.3"
-    "@babel/types" "^7.2.2"
-    debug "^4.1.0"
-    globals "^11.1.0"
-    lodash "^4.17.10"
-
-"@babel/types@^7.0.0", "@babel/types@^7.1.2", "@babel/types@^7.1.6", "@babel/types@^7.2.0":
-  version "7.2.0"
-  resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.2.0.tgz#7941c5b2d8060e06f9601d6be7c223eef906d5d8"
-  integrity sha512-b4v7dyfApuKDvmPb+O488UlGuR1WbwMXFsO/cyqMrnfvRAChZKJAYeeglWTjUO1b9UghKKgepAQM5tsvBJca6A==
-  dependencies:
-    esutils "^2.0.2"
-    lodash "^4.17.10"
-    to-fast-properties "^2.0.0"
-
-"@babel/types@^7.2.2":
+"@babel/template@^7.1.0", "@babel/template@^7.1.2", "@babel/template@^7.2.2":
   version "7.2.2"
-  resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.2.2.tgz#44e10fc24e33af524488b716cdaee5360ea8ed1e"
-  integrity sha512-fKCuD6UFUMkR541eDWL+2ih/xFZBXPOg/7EQFeTluMDebfqR4jrpaCjLhkWlQS4hT6nRa2PMEgXKbRB5/H2fpg==
+  resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.2.2.tgz#005b3fdf0ed96e88041330379e0da9a708eb2907"
+  integrity sha512-zRL0IMM02AUDwghf5LMSSDEz7sBCO2YnNmpg3uWTZj/v1rcG2BmQUvaGU8GhU8BvfMh1k2KIAYZ7Ji9KXPUg7g==
+  dependencies:
+    "@babel/code-frame" "^7.0.0"
+    "@babel/parser" "^7.2.2"
+    "@babel/types" "^7.2.2"
+
+"@babel/traverse@^7.1.0", "@babel/traverse@^7.1.5", "@babel/traverse@^7.2.2", "@babel/traverse@^7.3.4":
+  version "7.3.4"
+  resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.3.4.tgz#1330aab72234f8dea091b08c4f8b9d05c7119e06"
+  integrity sha512-TvTHKp6471OYEcE/91uWmhR6PrrYywQntCHSaZ8CM8Vmp+pjAusal4nGB2WCCQd0rvI7nOMKn9GnbcvTUz3/ZQ==
+  dependencies:
+    "@babel/code-frame" "^7.0.0"
+    "@babel/generator" "^7.3.4"
+    "@babel/helper-function-name" "^7.1.0"
+    "@babel/helper-split-export-declaration" "^7.0.0"
+    "@babel/parser" "^7.3.4"
+    "@babel/types" "^7.3.4"
+    debug "^4.1.0"
+    globals "^11.1.0"
+    lodash "^4.17.11"
+
+"@babel/types@^7.0.0", "@babel/types@^7.1.6", "@babel/types@^7.2.0", "@babel/types@^7.2.2", "@babel/types@^7.3.0", "@babel/types@^7.3.4":
+  version "7.3.4"
+  resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.3.4.tgz#bf482eaeaffb367a28abbf9357a94963235d90ed"
+  integrity sha512-WEkp8MsLftM7O/ty580wAmZzN1nDmCACc5+jFzUt+GUFNNIi3LdRlueYz0YIlmJhlZx1QYDMZL5vdWCL0fNjFQ==
   dependencies:
     esutils "^2.0.2"
-    lodash "^4.17.10"
+    lodash "^4.17.11"
     to-fast-properties "^2.0.0"
 
-"@emotion/cache@10.0.0":
-  version "10.0.0"
-  resolved "https://registry.yarnpkg.com/@emotion/cache/-/cache-10.0.0.tgz#e22eadcb770de4131ec707c84207e9e1ce210413"
-  integrity sha512-1/sT6GNyvWmxCtJek8ZDV+b+a+NMDx8/61UTnnF3rqrTY7bLTjw+fmXO7WgUIH0owuWKxza/J/FfAWC/RU4G7A==
+"@emotion/cache@^10.0.7":
+  version "10.0.7"
+  resolved "https://registry.yarnpkg.com/@emotion/cache/-/cache-10.0.7.tgz#6221de2e939f62022c04b4df2c165ce577809f23"
+  integrity sha512-wscXuawG+nQhSNbDpJdAqvv5d2g1O+fpwf/wD/CAmW/wsuN8hNzahWh2ldSVakqO9sINewyQNFl74IeDeTkRZg==
   dependencies:
     "@emotion/sheet" "0.9.2"
     "@emotion/stylis" "0.8.3"
@@ -1046,24 +889,24 @@
     "@emotion/weak-memoize" "0.2.2"
 
 "@emotion/core@^10.0.5":
-  version "10.0.6"
-  resolved "https://registry.yarnpkg.com/@emotion/core/-/core-10.0.6.tgz#c10d7884a525728f05589b31da1c804a5d7449fa"
-  integrity sha512-S5KkrodTKby1S6pKZnH8LzjzlebHvjactujfVzzu/mYYdVdKYegJuJdrAz3m9zhIeizzeQGD8xWF490ioGpUtw==
+  version "10.0.7"
+  resolved "https://registry.yarnpkg.com/@emotion/core/-/core-10.0.7.tgz#a894324b944cb06dcd36813afe35f07b0ed8d20d"
+  integrity sha512-f5ZeA8R5mTiD2VDFCy6kRTXrQXN/1s79WPvEZZSwROJIyy9mHBB0/Lxg9BSIXfFdXryVw76kHNehTcBkgDYS7A==
   dependencies:
-    "@emotion/cache" "10.0.0"
-    "@emotion/css" "^10.0.6"
-    "@emotion/serialize" "^0.11.3"
+    "@emotion/cache" "^10.0.7"
+    "@emotion/css" "^10.0.7"
+    "@emotion/serialize" "^0.11.4"
     "@emotion/sheet" "0.9.2"
     "@emotion/utils" "0.11.1"
 
-"@emotion/css@^10.0.6":
-  version "10.0.6"
-  resolved "https://registry.yarnpkg.com/@emotion/css/-/css-10.0.6.tgz#50b325e6ee18f0ca791036149a985e3b40a9354b"
-  integrity sha512-/suYOvP0zeKC3UNoIeN/3zvr/ghUKgfWx0Pht5ZY9qgHis68fB+V45OjonzMbdOw4mGX0vjZzJhINk9JbRWVrg==
+"@emotion/css@^10.0.7":
+  version "10.0.7"
+  resolved "https://registry.yarnpkg.com/@emotion/css/-/css-10.0.7.tgz#fbee607e07aeea444b147719b6472612fff9199b"
+  integrity sha512-r8JuPanNW0+ftBKFSna+6p5X7ewvU8d8NaNBlFjdPYl7xmtbDmoz8E7ceXqF4QgdRH4FBFIIRFzTA4Y05JwkIw==
   dependencies:
-    "@emotion/serialize" "^0.11.3"
+    "@emotion/serialize" "^0.11.4"
     "@emotion/utils" "0.11.1"
-    babel-plugin-emotion "^10.0.6"
+    babel-plugin-emotion "^10.0.7"
 
 "@emotion/hash@0.7.1":
   version "0.7.1"
@@ -1082,17 +925,6 @@
   resolved "https://registry.yarnpkg.com/@emotion/memoize/-/memoize-0.7.1.tgz#e93c13942592cf5ef01aa8297444dc192beee52f"
   integrity sha512-Qv4LTqO11jepd5Qmlp3M1YEjBumoTHcHFdgPTQ+sFlIL5myi/7xu/POwP7IRu6odBdmLXdtIs1D6TuW6kbwbbg==
 
-"@emotion/serialize@^0.11.3":
-  version "0.11.3"
-  resolved "https://registry.yarnpkg.com/@emotion/serialize/-/serialize-0.11.3.tgz#c4af2d96e3ddb9a749b7b567daa7556bcae45af2"
-  integrity sha512-6Q+XH/7kMdHwtylwZvdkOVMydaGZ989axQ56NF7urTR7eiDMLGun//pFUy31ha6QR4C6JB+KJVhZ3AEAJm9Z1g==
-  dependencies:
-    "@emotion/hash" "0.7.1"
-    "@emotion/memoize" "0.7.1"
-    "@emotion/unitless" "0.7.3"
-    "@emotion/utils" "0.11.1"
-    csstype "^2.5.7"
-
 "@emotion/serialize@^0.11.4":
   version "0.11.4"
   resolved "https://registry.yarnpkg.com/@emotion/serialize/-/serialize-0.11.4.tgz#691e615184a23cd3b9ae9b1eaa79eb8798e52379"
@@ -1109,23 +941,23 @@
   resolved "https://registry.yarnpkg.com/@emotion/sheet/-/sheet-0.9.2.tgz#74e5c6b5e489a1ba30ab246ab5eedd96916487c4"
   integrity sha512-pVBLzIbC/QCHDKJF2E82V2H/W/B004mDFQZiyo/MSR+VC4pV5JLG0TF/zgQDFvP3fZL/5RTPGEmXlYJBMUuJ+A==
 
-"@emotion/styled-base@^10.0.5":
-  version "10.0.5"
-  resolved "https://registry.yarnpkg.com/@emotion/styled-base/-/styled-base-10.0.5.tgz#3bc29e7efc4c04190de4f84fda9dc7e6dc18a885"
-  integrity sha512-rnz0cg+gZttd4zWb6efH7jZojozou1OtcqhjSvd79v2Iu36zJcD0USzefy9k9nVtPmvyLXYpM+zxqFJXtnKiCQ==
+"@emotion/styled-base@^10.0.7":
+  version "10.0.7"
+  resolved "https://registry.yarnpkg.com/@emotion/styled-base/-/styled-base-10.0.7.tgz#87cee1043ffdf17690bdd96d7269a21f705bf224"
+  integrity sha512-wdYHs5bNXBtC9yuQzKP8Ue8K4VWcQ/dQApP4br/8JLuOw5Zxa6Vxtc1JpxnBhi1OSWKjqHGpd7XFETOr6gCHJg==
   dependencies:
     "@emotion/is-prop-valid" "0.7.3"
-    "@emotion/serialize" "^0.11.3"
+    "@emotion/serialize" "^0.11.4"
     "@emotion/utils" "0.11.1"
     object-assign "^4.1.1"
 
 "@emotion/styled@^10.0.5":
-  version "10.0.6"
-  resolved "https://registry.yarnpkg.com/@emotion/styled/-/styled-10.0.6.tgz#e6591cf7b0fd56e82a0ae7e421568229e7c6d5f9"
-  integrity sha512-tJqeGmNueLcdVqQKsaXJq8fGsYg5O8E6GFxNCALHhS+BKl8kXZKn1fnPnz2iNTHuXGsxolt4uzAuj0UD/MF4NQ==
+  version "10.0.7"
+  resolved "https://registry.yarnpkg.com/@emotion/styled/-/styled-10.0.7.tgz#e36c84bf14435127481a1ea0b038d64a15c13995"
+  integrity sha512-H/7wi2bFYl6GdxBPYef0FNYay1ay5iKFGYxmkuH8WJZnDc/bf1Bx+lH9IQ+QujAMgmAtUHwJsgO2vwj0LEIYcg==
   dependencies:
-    "@emotion/styled-base" "^10.0.5"
-    babel-plugin-emotion "^10.0.6"
+    "@emotion/styled-base" "^10.0.7"
+    babel-plugin-emotion "^10.0.7"
 
 "@emotion/stylis@0.8.3":
   version "0.8.3"
@@ -1155,10 +987,10 @@
     call-me-maybe "^1.0.1"
     glob-to-regexp "^0.3.0"
 
-"@nodelib/fs.stat@^1.0.1":
-  version "1.1.2"
-  resolved "https://registry.yarnpkg.com/@nodelib/fs.stat/-/fs.stat-1.1.2.tgz#54c5a964462be3d4d78af631363c18d6fa91ac26"
-  integrity sha512-yprFYuno9FtNsSHVlSWd+nRlmGoAbqbeCwOryP6sC/zoCjhpArcRMYp19EvpSUSizJAlsXEwJv+wcWS9XaXdMw==
+"@nodelib/fs.stat@^1.1.2":
+  version "1.1.3"
+  resolved "https://registry.yarnpkg.com/@nodelib/fs.stat/-/fs.stat-1.1.3.tgz#2b5a3ab3f918cca48a8c754c08168e3f03eba61b"
+  integrity sha512-shAmDyaQC4H92APFoIaVDHCx5bStIocgvbwQyxPRrbUY20V1EYTbSDchWbuwlMG3V17cprZhA6+78JfB+3DTPw==
 
 "@reach/router@^1.2.1":
   version "1.2.1"
@@ -1597,9 +1429,9 @@
   integrity sha512-F/v7t1LwS4vnXuPooJQGBRKRGIoxWUTmA4VHfqjOccFsNDThD5bfUNpITive6s352O7o384wcpEaDV8rHCehDA==
 
 "@types/events@*":
-  version "1.2.0"
-  resolved "https://registry.yarnpkg.com/@types/events/-/events-1.2.0.tgz#81a6731ce4df43619e5c8c945383b3e62a89ea86"
-  integrity sha512-KEIlhXnIutzKwRbQkGWb/I4HFqBuUykAdHgDED6xqwXJfONCjF5VoE0cXEiurh3XauygxzeDzgtXUqvLkxFzzA==
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/@types/events/-/events-3.0.0.tgz#2862f3f58a9a7f7c3e78d79f130dd4d71c25c2a7"
+  integrity sha512-EaObqwIvayI5a8dCzhFrjKzVwKLxjoG9T6Ppd5CEo07LRKfQ8Yokw54r5+Wq7FaBQ+yXRvQAYPrHwya1/UFt9g==
 
 "@types/get-port@^0.0.4":
   version "0.0.4"
@@ -1616,9 +1448,9 @@
     "@types/node" "*"
 
 "@types/history@*", "@types/history@^4.6.2":
-  version "4.7.1"
-  resolved "https://registry.yarnpkg.com/@types/history/-/history-4.7.1.tgz#66849a23ceef917b57f0787c885f41ce03480f5c"
-  integrity sha512-g7RRtPg2f2OJm3kvYVTAGEr3R+YN53XwZgpP8r4cl3ugJB+95hbPfOU5tjOoAOz4bTLQuiHVUJh8rl4hEDUUjQ==
+  version "4.7.2"
+  resolved "https://registry.yarnpkg.com/@types/history/-/history-4.7.2.tgz#0e670ea254d559241b6eeb3894f8754991e73220"
+  integrity sha512-ui3WwXmjTaY73fOQ3/m3nnajU/Orhi6cEu5rzX+BrAAJxa3eITXZ5ch9suPqtM03OWhAHhPSyBGCN4UKoxO20Q==
 
 "@types/minimatch@*":
   version "3.0.3"
@@ -1631,24 +1463,29 @@
   integrity sha1-fyrX7FX5FEgvybHsS7GuYCjUYGY=
 
 "@types/node@*":
-  version "10.11.7"
-  resolved "https://registry.yarnpkg.com/@types/node/-/node-10.11.7.tgz#0e75ca9357d646ca754016ca1d68a127ad7e7300"
-  integrity sha512-yOxFfkN9xUFLyvWaeYj90mlqTJ41CsQzWKS3gXdOMOyPVacUsymejKxJ4/pMW7exouubuEeZLJawGgcNGYlTeg==
+  version "11.10.4"
+  resolved "https://registry.yarnpkg.com/@types/node/-/node-11.10.4.tgz#3f5fc4f0f322805f009e00ab35a2ff3d6b778e42"
+  integrity sha512-wa09itaLE8L705aXd8F80jnFpxz3Y1/KRHfKsYL2bPc0XF+wEWu8sR9n5bmeu8Ba1N9z2GRNzm/YdHcghLkLKg==
 
 "@types/node@^10.11.7":
-  version "10.12.18"
-  resolved "https://registry.yarnpkg.com/@types/node/-/node-10.12.18.tgz#1d3ca764718915584fcd9f6344621b7672665c67"
-  integrity sha512-fh+pAqt4xRzPfqA6eh3Z2y6fyZavRIumvjhaCL753+TVkGKGhpPeyrJG2JftD0T9q4GF00KjefsQ+PQNDdWQaQ==
+  version "10.12.29"
+  resolved "https://registry.yarnpkg.com/@types/node/-/node-10.12.29.tgz#c2c8d2d27bb55649fbafe8ea1731658421f38acf"
+  integrity sha512-J/tnbnj8HcsBgCe2apZbdUpQ7hs4d7oZNTYA5bekWdP0sr2NGsOpI/HRdDroEi209tEvTcTtxhD0FfED3DhEcw==
 
 "@types/node@^7.0.11":
-  version "7.10.0"
-  resolved "https://registry.yarnpkg.com/@types/node/-/node-7.10.0.tgz#9a42f16e2b264cb63903989c5d1d0a7c5eb901c2"
-  integrity sha512-yF75IZxur7xs90zpmoE+ktRJGJIauORo4qblVFvfKTYSSBFRRWlrl2dO/tE4vetSS4KAvFumS+1thTf3mMZhaA==
+  version "7.10.5"
+  resolved "https://registry.yarnpkg.com/@types/node/-/node-7.10.5.tgz#6831006b2c87441d69e79b37ae9bc03246dfb379"
+  integrity sha512-RYkagUUbxQBss46ElbEa+j4q4X3GR12QwB7a/PM5hmVuVkYoW1jENT1+taspKUv8ibwW8cw+kRFbOaTc/Key3w==
+
+"@types/node@^8.0.7":
+  version "8.10.42"
+  resolved "https://registry.yarnpkg.com/@types/node/-/node-8.10.42.tgz#d3d8e738e13540a09b3f4a714dac1ffbf8939f7d"
+  integrity sha512-8LCqostMfYwQs9by1k21/P4KZp9uFQk3Q528y3qtPKQnCJmKz0Em3YzgeNjTNV1FVrG/7n/6j12d4UKg9zSgDw==
 
 "@types/prop-types@*":
-  version "15.5.6"
-  resolved "https://registry.yarnpkg.com/@types/prop-types/-/prop-types-15.5.6.tgz#9c03d3fed70a8d517c191b7734da2879b50ca26c"
-  integrity sha512-ZBFR7TROLVzCkswA3Fmqq+IIJt62/T7aY/Dmz+QkU7CaW2QFqAitCE8Ups7IzmGhcN1YWMBT4Qcoc07jU9hOJQ==
+  version "15.7.0"
+  resolved "https://registry.yarnpkg.com/@types/prop-types/-/prop-types-15.7.0.tgz#4c48fed958d6dcf9487195a0ef6456d5f6e0163a"
+  integrity sha512-eItQyV43bj4rR3JPV0Skpl1SncRCdziTEK9/v8VwXmV6d/qOUO8/EuWeHBbCZcsfSHfzI5UyMJLCSXtxxznyZg==
 
 "@types/q@^1.5.1":
   version "1.5.1"
@@ -1665,17 +1502,17 @@
     "@types/react-router" "*"
 
 "@types/react-router@*":
-  version "4.0.32"
-  resolved "https://registry.yarnpkg.com/@types/react-router/-/react-router-4.0.32.tgz#501529e3d7aa7d5c738d339367e1a7dd5338b2a7"
-  integrity sha512-VLQSifCIKCTpfMFrJN/nO5a45LduB6qSMkO9ASbcGdCHiDwJnrLNzk91Q895yG0qWY7RqT2jR16giBRpRG1HQw==
+  version "4.4.4"
+  resolved "https://registry.yarnpkg.com/@types/react-router/-/react-router-4.4.4.tgz#4dbd5588ea6024e0c04519bd8aabe74c0a2b77e5"
+  integrity sha512-TZVfpT6nvUv/lbho/nRtckEtgkhspOQr3qxrnpXixwgQRKKyg5PvDfNKc8Uend/p/Pi70614VCmC0NPAKWF+0g==
   dependencies:
     "@types/history" "*"
     "@types/react" "*"
 
 "@types/react@*":
-  version "16.4.16"
-  resolved "https://registry.yarnpkg.com/@types/react/-/react-16.4.16.tgz#99f91b1200ae8c2062030402006d3b3c3a177043"
-  integrity sha512-lxyoipLWweAnLnSsV4Ho2NAZTKKmxeYgkTQ6PaDiPDU9JJBUY2zJVVGiK1smzYv8+ZgbqEmcm5xM74GCpunSEA==
+  version "16.8.6"
+  resolved "https://registry.yarnpkg.com/@types/react/-/react-16.8.6.tgz#fa1de3fe56cc9b6afeddc73d093d7f30fd5e31cc"
+  integrity sha512-bN9qDjEMltmHrl0PZRI4IF2AbB7V5UlRfG+OOduckVnRQ4VzXVSzy/1eLAh778IEqhTnW0mmgL9yShfinNverA==
   dependencies:
     "@types/prop-types" "*"
     csstype "^2.2.0"
@@ -1691,9 +1528,9 @@
   integrity sha1-DTyzECL4Qn6ljACK8yuA2hJspOM=
 
 "@types/unist@*", "@types/unist@^2.0.0":
-  version "2.0.2"
-  resolved "https://registry.yarnpkg.com/@types/unist/-/unist-2.0.2.tgz#5dc0a7f76809b7518c0df58689cd16a19bd751c6"
-  integrity sha512-iHI60IbyfQilNubmxsq4zqSjdynlmc2Q/QvH9kjzg9+CCYVVzq1O6tc7VBzSygIwnmOt07w80IG6HDQvjv3Liw==
+  version "2.0.3"
+  resolved "https://registry.yarnpkg.com/@types/unist/-/unist-2.0.3.tgz#9c088679876f374eb5983f150d4787aa6fb32d7e"
+  integrity sha512-FvUupuM3rlRsRtCN+fDudtmytGO6iHJuuRKS1Ss0pG5z8oX0diNEw94UEL7hgDbpN94rgaK5R7sWm6RrSkZuAQ==
 
 "@types/vfile-message@*":
   version "1.0.1"
@@ -1712,150 +1549,150 @@
     "@types/unist" "*"
     "@types/vfile-message" "*"
 
-"@webassemblyjs/ast@1.8.3":
-  version "1.8.3"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/ast/-/ast-1.8.3.tgz#63a741bd715a6b6783f2ea5c6ab707516aa215eb"
-  integrity sha512-xy3m06+Iu4D32+6soz6zLnwznigXJRuFNTovBX2M4GqVqLb0dnyWLbPnpcXvUSdEN+9DVyDeaq2jyH1eIL2LZQ==
+"@webassemblyjs/ast@1.8.5":
+  version "1.8.5"
+  resolved "https://registry.yarnpkg.com/@webassemblyjs/ast/-/ast-1.8.5.tgz#51b1c5fe6576a34953bf4b253df9f0d490d9e359"
+  integrity sha512-aJMfngIZ65+t71C3y2nBBg5FFG0Okt9m0XEgWZ7Ywgn1oMAT8cNwx00Uv1cQyHtidq0Xn94R4TAywO+LCQ+ZAQ==
   dependencies:
-    "@webassemblyjs/helper-module-context" "1.8.3"
-    "@webassemblyjs/helper-wasm-bytecode" "1.8.3"
-    "@webassemblyjs/wast-parser" "1.8.3"
+    "@webassemblyjs/helper-module-context" "1.8.5"
+    "@webassemblyjs/helper-wasm-bytecode" "1.8.5"
+    "@webassemblyjs/wast-parser" "1.8.5"
 
-"@webassemblyjs/floating-point-hex-parser@1.8.3":
-  version "1.8.3"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/floating-point-hex-parser/-/floating-point-hex-parser-1.8.3.tgz#f198a2d203b3c50846a064f5addd6a133ef9bc0e"
-  integrity sha512-vq1TISG4sts4f0lDwMUM0f3kpe0on+G3YyV5P0IySHFeaLKRYZ++n2fCFfG4TcCMYkqFeTUYFxm75L3ddlk2xA==
+"@webassemblyjs/floating-point-hex-parser@1.8.5":
+  version "1.8.5"
+  resolved "https://registry.yarnpkg.com/@webassemblyjs/floating-point-hex-parser/-/floating-point-hex-parser-1.8.5.tgz#1ba926a2923613edce496fd5b02e8ce8a5f49721"
+  integrity sha512-9p+79WHru1oqBh9ewP9zW95E3XAo+90oth7S5Re3eQnECGq59ly1Ri5tsIipKGpiStHsUYmY3zMLqtk3gTcOtQ==
 
-"@webassemblyjs/helper-api-error@1.8.3":
-  version "1.8.3"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-api-error/-/helper-api-error-1.8.3.tgz#3b708f6926accd64dcbaa7ba5b63db5660ff4f66"
-  integrity sha512-BmWEynI4FnZbjk8CaYZXwcv9a6gIiu+rllRRouQUo73hglanXD3AGFJE7Q4JZCoVE0p5/jeX6kf5eKa3D4JxwQ==
+"@webassemblyjs/helper-api-error@1.8.5":
+  version "1.8.5"
+  resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-api-error/-/helper-api-error-1.8.5.tgz#c49dad22f645227c5edb610bdb9697f1aab721f7"
+  integrity sha512-Za/tnzsvnqdaSPOUXHyKJ2XI7PDX64kWtURyGiJJZKVEdFOsdKUCPTNEVFZq3zJ2R0G5wc2PZ5gvdTRFgm81zA==
 
-"@webassemblyjs/helper-buffer@1.8.3":
-  version "1.8.3"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-buffer/-/helper-buffer-1.8.3.tgz#f3150a23ffaba68621e1f094c8a14bebfd53dd48"
-  integrity sha512-iVIMhWnNHoFB94+/2l7LpswfCsXeMRnWfExKtqsZ/E2NxZyUx9nTeKK/MEMKTQNEpyfznIUX06OchBHQ+VKi/Q==
+"@webassemblyjs/helper-buffer@1.8.5":
+  version "1.8.5"
+  resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-buffer/-/helper-buffer-1.8.5.tgz#fea93e429863dd5e4338555f42292385a653f204"
+  integrity sha512-Ri2R8nOS0U6G49Q86goFIPNgjyl6+oE1abW1pS84BuhP1Qcr5JqMwRFT3Ah3ADDDYGEgGs1iyb1DGX+kAi/c/Q==
 
-"@webassemblyjs/helper-code-frame@1.8.3":
-  version "1.8.3"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-code-frame/-/helper-code-frame-1.8.3.tgz#f43ac605789b519d95784ef350fd2968aebdd3ef"
-  integrity sha512-K1UxoJML7GKr1QXR+BG7eXqQkvu+eEeTjlSl5wUFQ6W6vaOc5OwSxTcb3oE9x/3+w4NHhrIKD4JXXCZmLdL2cg==
+"@webassemblyjs/helper-code-frame@1.8.5":
+  version "1.8.5"
+  resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-code-frame/-/helper-code-frame-1.8.5.tgz#9a740ff48e3faa3022b1dff54423df9aa293c25e"
+  integrity sha512-VQAadSubZIhNpH46IR3yWO4kZZjMxN1opDrzePLdVKAZ+DFjkGD/rf4v1jap744uPVU6yjL/smZbRIIJTOUnKQ==
   dependencies:
-    "@webassemblyjs/wast-printer" "1.8.3"
+    "@webassemblyjs/wast-printer" "1.8.5"
 
-"@webassemblyjs/helper-fsm@1.8.3":
-  version "1.8.3"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-fsm/-/helper-fsm-1.8.3.tgz#46aaa03f41082a916850ebcb97e9fc198ef36a9c"
-  integrity sha512-387zipfrGyO77/qm7/SDUiZBjQ5KGk4qkrVIyuoubmRNIiqn3g+6ijY8BhnlGqsCCQX5bYKOnttJobT5xoyviA==
+"@webassemblyjs/helper-fsm@1.8.5":
+  version "1.8.5"
+  resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-fsm/-/helper-fsm-1.8.5.tgz#ba0b7d3b3f7e4733da6059c9332275d860702452"
+  integrity sha512-kRuX/saORcg8se/ft6Q2UbRpZwP4y7YrWsLXPbbmtepKr22i8Z4O3V5QE9DbZK908dh5Xya4Un57SDIKwB9eow==
 
-"@webassemblyjs/helper-module-context@1.8.3":
-  version "1.8.3"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-module-context/-/helper-module-context-1.8.3.tgz#150da405d90c8ea81ae0b0e1965b7b64e585634f"
-  integrity sha512-lPLFdQfaRssfnGEJit5Sk785kbBPPPK4ZS6rR5W/8hlUO/5v3F+rN8XuUcMj/Ny9iZiyKhhuinWGTUuYL4VKeQ==
+"@webassemblyjs/helper-module-context@1.8.5":
+  version "1.8.5"
+  resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-module-context/-/helper-module-context-1.8.5.tgz#def4b9927b0101dc8cbbd8d1edb5b7b9c82eb245"
+  integrity sha512-/O1B236mN7UNEU4t9X7Pj38i4VoU8CcMHyy3l2cV/kIF4U5KoHXDVqcDuOs1ltkac90IM4vZdHc52t1x8Yfs3g==
   dependencies:
-    "@webassemblyjs/ast" "1.8.3"
+    "@webassemblyjs/ast" "1.8.5"
     mamacro "^0.0.3"
 
-"@webassemblyjs/helper-wasm-bytecode@1.8.3":
-  version "1.8.3"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-wasm-bytecode/-/helper-wasm-bytecode-1.8.3.tgz#12f55bbafbbc7ddf9d8059a072cb7b0c17987901"
-  integrity sha512-R1nJW7bjyJLjsJQR5t3K/9LJ0QWuZezl8fGa49DZq4IVaejgvkbNlKEQxLYTC579zgT4IIIVHb5JA59uBPHXyw==
+"@webassemblyjs/helper-wasm-bytecode@1.8.5":
+  version "1.8.5"
+  resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-wasm-bytecode/-/helper-wasm-bytecode-1.8.5.tgz#537a750eddf5c1e932f3744206551c91c1b93e61"
+  integrity sha512-Cu4YMYG3Ddl72CbmpjU/wbP6SACcOPVbHN1dI4VJNJVgFwaKf1ppeFJrwydOG3NDHxVGuCfPlLZNyEdIYlQ6QQ==
 
-"@webassemblyjs/helper-wasm-section@1.8.3":
-  version "1.8.3"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-wasm-section/-/helper-wasm-section-1.8.3.tgz#9e79456d9719e116f4f8998ee62ab54ba69a6cf3"
-  integrity sha512-P6F7D61SJY73Yz+fs49Q3+OzlYAZP86OfSpaSY448KzUy65NdfzDmo2NPVte+Rw4562MxEAacvq/mnDuvRWOcg==
+"@webassemblyjs/helper-wasm-section@1.8.5":
+  version "1.8.5"
+  resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-wasm-section/-/helper-wasm-section-1.8.5.tgz#74ca6a6bcbe19e50a3b6b462847e69503e6bfcbf"
+  integrity sha512-VV083zwR+VTrIWWtgIUpqfvVdK4ff38loRmrdDBgBT8ADXYsEZ5mPQ4Nde90N3UYatHdYoDIFb7oHzMncI02tA==
   dependencies:
-    "@webassemblyjs/ast" "1.8.3"
-    "@webassemblyjs/helper-buffer" "1.8.3"
-    "@webassemblyjs/helper-wasm-bytecode" "1.8.3"
-    "@webassemblyjs/wasm-gen" "1.8.3"
+    "@webassemblyjs/ast" "1.8.5"
+    "@webassemblyjs/helper-buffer" "1.8.5"
+    "@webassemblyjs/helper-wasm-bytecode" "1.8.5"
+    "@webassemblyjs/wasm-gen" "1.8.5"
 
-"@webassemblyjs/ieee754@1.8.3":
-  version "1.8.3"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/ieee754/-/ieee754-1.8.3.tgz#0a89355b1f6c9d08d0605c2acbc2a6fe3141f5b4"
-  integrity sha512-UD4HuLU99hjIvWz1pD68b52qsepWQlYCxDYVFJQfHh3BHyeAyAlBJ+QzLR1nnS5J6hAzjki3I3AoJeobNNSZlg==
+"@webassemblyjs/ieee754@1.8.5":
+  version "1.8.5"
+  resolved "https://registry.yarnpkg.com/@webassemblyjs/ieee754/-/ieee754-1.8.5.tgz#712329dbef240f36bf57bd2f7b8fb9bf4154421e"
+  integrity sha512-aaCvQYrvKbY/n6wKHb/ylAJr27GglahUO89CcGXMItrOBqRarUMxWLJgxm9PJNuKULwN5n1csT9bYoMeZOGF3g==
   dependencies:
     "@xtuc/ieee754" "^1.2.0"
 
-"@webassemblyjs/leb128@1.8.3":
-  version "1.8.3"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/leb128/-/leb128-1.8.3.tgz#b7fd9d7c039e34e375c4473bd4dc89ce8228b920"
-  integrity sha512-XXd3s1BmkC1gpGABuCRLqCGOD6D2L+Ma2BpwpjrQEHeQATKWAQtxAyU9Z14/z8Ryx6IG+L4/NDkIGHrccEhRUg==
+"@webassemblyjs/leb128@1.8.5":
+  version "1.8.5"
+  resolved "https://registry.yarnpkg.com/@webassemblyjs/leb128/-/leb128-1.8.5.tgz#044edeb34ea679f3e04cd4fd9824d5e35767ae10"
+  integrity sha512-plYUuUwleLIziknvlP8VpTgO4kqNaH57Y3JnNa6DLpu/sGcP6hbVdfdX5aHAV716pQBKrfuU26BJK29qY37J7A==
   dependencies:
     "@xtuc/long" "4.2.2"
 
-"@webassemblyjs/utf8@1.8.3":
-  version "1.8.3"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/utf8/-/utf8-1.8.3.tgz#75712db52cfdda868731569ddfe11046f1f1e7a2"
-  integrity sha512-Wv/WH9Zo5h5ZMyfCNpUrjFsLZ3X1amdfEuwdb7MLdG3cPAjRS6yc6ElULlpjLiiBTuzvmLhr3ENsuGyJ3wyCgg==
+"@webassemblyjs/utf8@1.8.5":
+  version "1.8.5"
+  resolved "https://registry.yarnpkg.com/@webassemblyjs/utf8/-/utf8-1.8.5.tgz#a8bf3b5d8ffe986c7c1e373ccbdc2a0915f0cedc"
+  integrity sha512-U7zgftmQriw37tfD934UNInokz6yTmn29inT2cAetAsaU9YeVCveWEwhKL1Mg4yS7q//NGdzy79nlXh3bT8Kjw==
 
-"@webassemblyjs/wasm-edit@1.8.3":
-  version "1.8.3"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/wasm-edit/-/wasm-edit-1.8.3.tgz#23c3c6206b096f9f6aa49623a5310a102ef0fb87"
-  integrity sha512-nB19eUx3Yhi1Vvv3yev5r+bqQixZprMtaoCs1brg9Efyl8Hto3tGaUoZ0Yb4Umn/gQCyoEGFfUxPLp1/8+Jvnw==
+"@webassemblyjs/wasm-edit@1.8.5":
+  version "1.8.5"
+  resolved "https://registry.yarnpkg.com/@webassemblyjs/wasm-edit/-/wasm-edit-1.8.5.tgz#962da12aa5acc1c131c81c4232991c82ce56e01a"
+  integrity sha512-A41EMy8MWw5yvqj7MQzkDjU29K7UJq1VrX2vWLzfpRHt3ISftOXqrtojn7nlPsZ9Ijhp5NwuODuycSvfAO/26Q==
   dependencies:
-    "@webassemblyjs/ast" "1.8.3"
-    "@webassemblyjs/helper-buffer" "1.8.3"
-    "@webassemblyjs/helper-wasm-bytecode" "1.8.3"
-    "@webassemblyjs/helper-wasm-section" "1.8.3"
-    "@webassemblyjs/wasm-gen" "1.8.3"
-    "@webassemblyjs/wasm-opt" "1.8.3"
-    "@webassemblyjs/wasm-parser" "1.8.3"
-    "@webassemblyjs/wast-printer" "1.8.3"
+    "@webassemblyjs/ast" "1.8.5"
+    "@webassemblyjs/helper-buffer" "1.8.5"
+    "@webassemblyjs/helper-wasm-bytecode" "1.8.5"
+    "@webassemblyjs/helper-wasm-section" "1.8.5"
+    "@webassemblyjs/wasm-gen" "1.8.5"
+    "@webassemblyjs/wasm-opt" "1.8.5"
+    "@webassemblyjs/wasm-parser" "1.8.5"
+    "@webassemblyjs/wast-printer" "1.8.5"
 
-"@webassemblyjs/wasm-gen@1.8.3":
-  version "1.8.3"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/wasm-gen/-/wasm-gen-1.8.3.tgz#1a433b8ab97e074e6ac2e25fcbc8cb6125400813"
-  integrity sha512-sDNmu2nLBJZ/huSzlJvd9IK8B1EjCsOl7VeMV9VJPmxKYgTJ47lbkSP+KAXMgZWGcArxmcrznqm7FrAPQ7vVGg==
+"@webassemblyjs/wasm-gen@1.8.5":
+  version "1.8.5"
+  resolved "https://registry.yarnpkg.com/@webassemblyjs/wasm-gen/-/wasm-gen-1.8.5.tgz#54840766c2c1002eb64ed1abe720aded714f98bc"
+  integrity sha512-BCZBT0LURC0CXDzj5FXSc2FPTsxwp3nWcqXQdOZE4U7h7i8FqtFK5Egia6f9raQLpEKT1VL7zr4r3+QX6zArWg==
   dependencies:
-    "@webassemblyjs/ast" "1.8.3"
-    "@webassemblyjs/helper-wasm-bytecode" "1.8.3"
-    "@webassemblyjs/ieee754" "1.8.3"
-    "@webassemblyjs/leb128" "1.8.3"
-    "@webassemblyjs/utf8" "1.8.3"
+    "@webassemblyjs/ast" "1.8.5"
+    "@webassemblyjs/helper-wasm-bytecode" "1.8.5"
+    "@webassemblyjs/ieee754" "1.8.5"
+    "@webassemblyjs/leb128" "1.8.5"
+    "@webassemblyjs/utf8" "1.8.5"
 
-"@webassemblyjs/wasm-opt@1.8.3":
-  version "1.8.3"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/wasm-opt/-/wasm-opt-1.8.3.tgz#54754bcf88f88e92b909416a91125301cc81419c"
-  integrity sha512-j8lmQVFR+FR4/645VNgV4R/Jz8i50eaPAj93GZyd3EIJondVshE/D9pivpSDIXyaZt+IkCodlzOoZUE4LnQbeA==
+"@webassemblyjs/wasm-opt@1.8.5":
+  version "1.8.5"
+  resolved "https://registry.yarnpkg.com/@webassemblyjs/wasm-opt/-/wasm-opt-1.8.5.tgz#b24d9f6ba50394af1349f510afa8ffcb8a63d264"
+  integrity sha512-HKo2mO/Uh9A6ojzu7cjslGaHaUU14LdLbGEKqTR7PBKwT6LdPtLLh9fPY33rmr5wcOMrsWDbbdCHq4hQUdd37Q==
   dependencies:
-    "@webassemblyjs/ast" "1.8.3"
-    "@webassemblyjs/helper-buffer" "1.8.3"
-    "@webassemblyjs/wasm-gen" "1.8.3"
-    "@webassemblyjs/wasm-parser" "1.8.3"
+    "@webassemblyjs/ast" "1.8.5"
+    "@webassemblyjs/helper-buffer" "1.8.5"
+    "@webassemblyjs/wasm-gen" "1.8.5"
+    "@webassemblyjs/wasm-parser" "1.8.5"
 
-"@webassemblyjs/wasm-parser@1.8.3":
-  version "1.8.3"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/wasm-parser/-/wasm-parser-1.8.3.tgz#d12ed19d1b8e8667a7bee040d2245aaaf215340b"
-  integrity sha512-NBI3SNNtRoy4T/KBsRZCAWUzE9lI94RH2nneLwa1KKIrt/2zzcTavWg6oY05ArCbb/PZDk3OUi63CD1RYtN65w==
+"@webassemblyjs/wasm-parser@1.8.5":
+  version "1.8.5"
+  resolved "https://registry.yarnpkg.com/@webassemblyjs/wasm-parser/-/wasm-parser-1.8.5.tgz#21576f0ec88b91427357b8536383668ef7c66b8d"
+  integrity sha512-pi0SYE9T6tfcMkthwcgCpL0cM9nRYr6/6fjgDtL6q/ZqKHdMWvxitRi5JcZ7RI4SNJJYnYNaWy5UUrHQy998lw==
   dependencies:
-    "@webassemblyjs/ast" "1.8.3"
-    "@webassemblyjs/helper-api-error" "1.8.3"
-    "@webassemblyjs/helper-wasm-bytecode" "1.8.3"
-    "@webassemblyjs/ieee754" "1.8.3"
-    "@webassemblyjs/leb128" "1.8.3"
-    "@webassemblyjs/utf8" "1.8.3"
+    "@webassemblyjs/ast" "1.8.5"
+    "@webassemblyjs/helper-api-error" "1.8.5"
+    "@webassemblyjs/helper-wasm-bytecode" "1.8.5"
+    "@webassemblyjs/ieee754" "1.8.5"
+    "@webassemblyjs/leb128" "1.8.5"
+    "@webassemblyjs/utf8" "1.8.5"
 
-"@webassemblyjs/wast-parser@1.8.3":
-  version "1.8.3"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/wast-parser/-/wast-parser-1.8.3.tgz#44aa123e145503e995045dc3e5e2770069da117b"
-  integrity sha512-gZPst4CNcmGtKC1eYQmgCx6gwQvxk4h/nPjfPBbRoD+Raw3Hs+BS3yhrfgyRKtlYP+BJ8LcY9iFODEQofl2qbg==
+"@webassemblyjs/wast-parser@1.8.5":
+  version "1.8.5"
+  resolved "https://registry.yarnpkg.com/@webassemblyjs/wast-parser/-/wast-parser-1.8.5.tgz#e10eecd542d0e7bd394f6827c49f3df6d4eefb8c"
+  integrity sha512-daXC1FyKWHF1i11obK086QRlsMsY4+tIOKgBqI1lxAnkp9xe9YMcgOxm9kLe+ttjs5aWV2KKE1TWJCN57/Btsg==
   dependencies:
-    "@webassemblyjs/ast" "1.8.3"
-    "@webassemblyjs/floating-point-hex-parser" "1.8.3"
-    "@webassemblyjs/helper-api-error" "1.8.3"
-    "@webassemblyjs/helper-code-frame" "1.8.3"
-    "@webassemblyjs/helper-fsm" "1.8.3"
+    "@webassemblyjs/ast" "1.8.5"
+    "@webassemblyjs/floating-point-hex-parser" "1.8.5"
+    "@webassemblyjs/helper-api-error" "1.8.5"
+    "@webassemblyjs/helper-code-frame" "1.8.5"
+    "@webassemblyjs/helper-fsm" "1.8.5"
     "@xtuc/long" "4.2.2"
 
-"@webassemblyjs/wast-printer@1.8.3":
-  version "1.8.3"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/wast-printer/-/wast-printer-1.8.3.tgz#b1177780b266b1305f2eeba87c4d6aa732352060"
-  integrity sha512-DTA6kpXuHK4PHu16yAD9QVuT1WZQRT7079oIFFmFSjqjLWGXS909I/7kiLTn931mcj7wGsaUNungjwNQ2lGQ3Q==
+"@webassemblyjs/wast-printer@1.8.5":
+  version "1.8.5"
+  resolved "https://registry.yarnpkg.com/@webassemblyjs/wast-printer/-/wast-printer-1.8.5.tgz#114bbc481fd10ca0e23b3560fa812748b0bae5bc"
+  integrity sha512-w0U0pD4EhlnvRyeJzBqaVSJAo9w/ce7/WPogeXLzGkO6hzhr4GnQIZ4W4uUt5b9ooAaXPtnXlj0gzsXEOUNYMg==
   dependencies:
-    "@webassemblyjs/ast" "1.8.3"
-    "@webassemblyjs/wast-parser" "1.8.3"
+    "@webassemblyjs/ast" "1.8.5"
+    "@webassemblyjs/wast-parser" "1.8.5"
     "@xtuc/long" "4.2.2"
 
 "@xtuc/ieee754@^1.2.0":
@@ -1902,9 +1739,9 @@ acorn@^3.0.0:
   integrity sha1-ReN/s56No/JbruP/U2niu18iAXo=
 
 acorn@^6.0.5:
-  version "6.1.0"
-  resolved "https://registry.yarnpkg.com/acorn/-/acorn-6.1.0.tgz#b0a3be31752c97a0f7013c5f4903b71a05db6818"
-  integrity sha512-MW/FjM+IvU9CgBzjO3UIPCE2pyEwUsoFl+VGdczOPEdxfGFjuKny/gN54mOuX7Qxmb9Rg9MCn2oKiSUeW+pjrw==
+  version "6.1.1"
+  resolved "https://registry.yarnpkg.com/acorn/-/acorn-6.1.1.tgz#7d25ae05bb8ad1f9b699108e1094ecd7884adc1f"
+  integrity sha512-jPTiwtOxaHNaAPg/dmrJ/beuzLRnXtB0kQPQ8JpotKJgTB6rX6c8mlf315941pyjBSaPg8NHXS9fhP4u17DpGA==
 
 address@1.0.3, address@^1.0.1:
   version "1.0.3"
@@ -1950,9 +1787,9 @@ ajv-errors@^1.0.0:
   integrity sha512-DCRfO/4nQ+89p/RK43i8Ezd41EqdGIU4ld7nGF8OQ14oc/we5rEntLCUa7+jrn3nn83BosfwZA0wb4pon2o8iQ==
 
 ajv-keywords@^3.1.0:
-  version "3.2.0"
-  resolved "https://registry.yarnpkg.com/ajv-keywords/-/ajv-keywords-3.2.0.tgz#e86b819c602cf8821ad637413698f1dec021847a"
-  integrity sha1-6GuBnGAs+IIa1jdBNpjx3sAhhHo=
+  version "3.4.0"
+  resolved "https://registry.yarnpkg.com/ajv-keywords/-/ajv-keywords-3.4.0.tgz#4b831e7b531415a7cc518cd404e73f6193c6349d"
+  integrity sha512-aUjdRFISbuFOl0EIZc+9e4FfZp0bDZgAdOOf30bJmw8VM9v84SHyVyxDfbWxpGYbdZD/9XoKxfHVNmxPkhwyGw==
 
 ajv@6.5.2:
   version "6.5.2"
@@ -1964,7 +1801,7 @@ ajv@6.5.2:
     json-schema-traverse "^0.4.1"
     uri-js "^4.2.1"
 
-ajv@^5.0.0, ajv@^5.3.0:
+ajv@^5.0.0:
   version "5.5.2"
   resolved "https://registry.yarnpkg.com/ajv/-/ajv-5.5.2.tgz#73b5eeca3fab653e3d3f9422b341ad42205dc965"
   integrity sha1-c7Xuyj+rZT49P5Qis0GtQiBdyWU=
@@ -1974,10 +1811,10 @@ ajv@^5.0.0, ajv@^5.3.0:
     fast-json-stable-stringify "^2.0.0"
     json-schema-traverse "^0.3.0"
 
-ajv@^6.1.0:
-  version "6.5.4"
-  resolved "https://registry.yarnpkg.com/ajv/-/ajv-6.5.4.tgz#247d5274110db653706b550fcc2b797ca28cfc59"
-  integrity sha512-4Wyjt8+t6YszqaXnLDfMmG/8AlO5Zbcsy3ATHncCzjW/NoPzAId8AK6749Ybjmdt+kUY1gP60fCu46oDxPv/mg==
+ajv@^6.1.0, ajv@^6.5.5:
+  version "6.10.0"
+  resolved "https://registry.yarnpkg.com/ajv/-/ajv-6.10.0.tgz#90d0d54439da587cd7e843bfb7045f50bd22bdf1"
+  integrity sha512-nffhOpkymDECQyR0mnsUtoCE8RlX38G0rYP+wgLWFyZuUyuuojSSvi/+euOiQBIn63whYwYVIIH1TvE3tu4OEg==
   dependencies:
     fast-deep-equal "^2.0.1"
     fast-json-stable-stringify "^2.0.0"
@@ -2018,14 +1855,14 @@ ansi-align@^3.0.0:
     string-width "^3.0.0"
 
 ansi-colors@^3.0.0:
-  version "3.2.3"
-  resolved "https://registry.yarnpkg.com/ansi-colors/-/ansi-colors-3.2.3.tgz#57d35b8686e851e2cc04c403f1c00203976a1813"
-  integrity sha512-LEHHyuhlPY3TmuUYMh2oz89lTShfvgbmzaBcxve9t/9Wuy7Dwf4yoAKcND7KFT1HAQfqZ12qtc+DUrBMeKF9nw==
+  version "3.2.4"
+  resolved "https://registry.yarnpkg.com/ansi-colors/-/ansi-colors-3.2.4.tgz#e3a3da4bfbae6c86a9c285625de124a234026fbf"
+  integrity sha512-hHUXGagefjN2iRrID63xckIvotOXOojhQKWIPUZ4mNUZ9nLZW+7FMNoE1lOkEhNWYsx/7ysGIuJYCiMAA9FnrA==
 
-ansi-escapes@^3.0.0, ansi-escapes@^3.1.0:
-  version "3.1.0"
-  resolved "https://registry.yarnpkg.com/ansi-escapes/-/ansi-escapes-3.1.0.tgz#f73207bb81207d75fd6c83f125af26eea378ca30"
-  integrity sha512-UgAb8H9D41AQnu/PbWlCofQVcnV4Gs2bBJi9eZPxfU/hgglFh3SMDMENRIqdr7H6XFnXdoknctFByVsCOotTVw==
+ansi-escapes@^3.0.0, ansi-escapes@^3.1.0, ansi-escapes@^3.2.0:
+  version "3.2.0"
+  resolved "https://registry.yarnpkg.com/ansi-escapes/-/ansi-escapes-3.2.0.tgz#8780b98ff9dbf5638152d1f1fe5c1d7b4442976b"
+  integrity sha512-cBhpre4ma+U0T1oM5fXg7Dy1Jw7zzwv7lt/GoCpr+hDQJoYnKVPLL4dCvSEFMmQurOQvSrwT7SL/DAlhBI97RQ==
 
 ansi-gray@^0.1.1:
   version "0.1.1"
@@ -2322,15 +2159,15 @@ ast-types@0.11.3:
   resolved "https://registry.yarnpkg.com/ast-types/-/ast-types-0.11.3.tgz#c20757fe72ee71278ea0ff3d87e5c2ca30d9edf8"
   integrity sha512-XA5o5dsNw8MhyW0Q7MWXJWc4oOzZKbdsEJq45h7c8q/d9DwWZ5F2ugUc1PuMLPGsUnphCt/cNDHu8JeBbxf1qA==
 
-ast-types@0.11.6:
-  version "0.11.6"
-  resolved "https://registry.yarnpkg.com/ast-types/-/ast-types-0.11.6.tgz#4e2266c2658829aef3b40cc33ad599c4e9eb89ef"
-  integrity sha512-nHiuV14upVGl7MWwFUYbzJ6YlfwWS084CU9EA8HajfYQjMSli5TQi3UTRygGF58LFWVkXxS1rbgRhROEqlQkXg==
+ast-types@0.11.7:
+  version "0.11.7"
+  resolved "https://registry.yarnpkg.com/ast-types/-/ast-types-0.11.7.tgz#f318bf44e339db6a320be0009ded64ec1471f46c"
+  integrity sha512-2mP3TwtkY/aTv5X3ZsMpNAbOnyoC/aMJwJSoaELPkHId0nSQgFcnU4dRW3isxiz7+zBexk0ym3WNVjMiQBnJSw==
 
 ast-types@0.x.x:
-  version "0.11.5"
-  resolved "https://registry.yarnpkg.com/ast-types/-/ast-types-0.11.5.tgz#9890825d660c03c28339f315e9fa0a360e31ec28"
-  integrity sha512-oJjo+5e7/vEc2FBK8gUalV0pba4L3VdBIs2EKhOLHLcOd2FgQIVQN9xb0eZ9IjEWyAL7vq6fGJxOvVvdCHNyMw==
+  version "0.12.2"
+  resolved "https://registry.yarnpkg.com/ast-types/-/ast-types-0.12.2.tgz#341656049ee328ac03fc805c156b49ebab1e4462"
+  integrity sha512-8c83xDLJM/dLDyXNLiR6afRRm4dPKN6KAnKqytRK3DBJul9lA+atxdQkNDkSVPdTqea5HiRq3lnnOIZ0MBpvdg==
 
 async-each-series@^1.1.0:
   version "1.1.0"
@@ -2358,11 +2195,11 @@ async@^1.3.0, async@^1.4.0, async@^1.5.0:
   integrity sha1-7GphrlZIDAw8skHJVhjiCJL5Zyo=
 
 async@^2.1.2, async@^2.1.4:
-  version "2.6.1"
-  resolved "https://registry.yarnpkg.com/async/-/async-2.6.1.tgz#b245a23ca71930044ec53fa46aa00a3e87c6a610"
-  integrity sha512-fNEiL2+AZt6AlAw/29Cr0UDe4sRAHCpEHh54WMz+Bb7QfNcFw4h3loofyJpLeQs4Yx7yuqu/2dLgM5hKOs6HlQ==
+  version "2.6.2"
+  resolved "https://registry.yarnpkg.com/async/-/async-2.6.2.tgz#18330ea7e6e313887f5d2f2a904bac6fe4dd5381"
+  integrity sha512-H1qVYh1MYhEEFLsP97cVKqCGo7KfCyTt6uEWqsTBr9SO84oK9Uwbyd/yCW+6rKJLHksBNUVWZDAjfS+Ccx0Bbg==
   dependencies:
-    lodash "^4.17.10"
+    lodash "^4.17.11"
 
 async@~0.2.6:
   version "0.2.10"
@@ -2392,12 +2229,12 @@ autoprefixer@^6.0.2, autoprefixer@^6.3.1:
     postcss-value-parser "^3.2.3"
 
 autoprefixer@^9.4.7:
-  version "9.4.8"
-  resolved "https://registry.yarnpkg.com/autoprefixer/-/autoprefixer-9.4.8.tgz#575dcdfd984228c7bccbc08c5fe53f0ea6915593"
-  integrity sha512-DIhd0KMi9Nql3oJkJ2HCeOVihrXFPtWXc6ckwaUNwliDOt9OGr0fk8vV8jCLWXnZc1EXvQ2uLUzGpcPxFAQHEQ==
+  version "9.4.10"
+  resolved "https://registry.yarnpkg.com/autoprefixer/-/autoprefixer-9.4.10.tgz#e1be61fc728bacac8f4252ed242711ec0dcc6a7b"
+  integrity sha512-XR8XZ09tUrrSzgSlys4+hy5r2/z4Jp7Ag3pHm31U4g/CTccYPOVe19AkaJ4ey/vRd1sfj+5TtuD6I0PXtutjvQ==
   dependencies:
-    browserslist "^4.4.1"
-    caniuse-lite "^1.0.30000938"
+    browserslist "^4.4.2"
+    caniuse-lite "^1.0.30000940"
     normalize-range "^0.1.2"
     num2fraction "^1.2.2"
     postcss "^7.0.14"
@@ -2446,7 +2283,7 @@ babel-code-frame@6.26.0, babel-code-frame@^6.11.0, babel-code-frame@^6.22.0, bab
 
 babel-core@^6.24.1, babel-core@^6.26.0:
   version "6.26.3"
-  resolved "https://registry.npmjs.org/babel-core/-/babel-core-6.26.3.tgz#b2e2f09e342d0f0c88e2f02e067794125e75c207"
+  resolved "https://registry.yarnpkg.com/babel-core/-/babel-core-6.26.3.tgz#b2e2f09e342d0f0c88e2f02e067794125e75c207"
   integrity sha512-6jyFLuDmeidKmUEb3NM+/yawG0M2bDZ9Z1qbZP59cyHLz8kYGKYwpJP0UwUKKUiTRNvxfLesJnTedqczP7cTDA==
   dependencies:
     babel-code-frame "^6.26.0"
@@ -2471,7 +2308,7 @@ babel-core@^6.24.1, babel-core@^6.26.0:
 
 babel-generator@^6.24.1, babel-generator@^6.26.0:
   version "6.26.1"
-  resolved "https://registry.npmjs.org/babel-generator/-/babel-generator-6.26.1.tgz#1844408d3b8f0d35a404ea7ac180f087a601bd90"
+  resolved "https://registry.yarnpkg.com/babel-generator/-/babel-generator-6.26.1.tgz#1844408d3b8f0d35a404ea7ac180f087a601bd90"
   integrity sha512-HyfwY6ApZj7BYTcJURpM5tznulaBvyio7/0d4zFOeMPUmfxkCjHocCuoLa2SAGzBI8AREcH3eP3758F672DppA==
   dependencies:
     babel-messages "^6.23.0"
@@ -2659,12 +2496,12 @@ babel-helpers@^6.24.1:
     babel-runtime "^6.22.0"
     babel-template "^6.24.1"
 
-babel-loader@8.0.4:
-  version "8.0.4"
-  resolved "https://registry.yarnpkg.com/babel-loader/-/babel-loader-8.0.4.tgz#7bbf20cbe4560629e2e41534147692d3fecbdce6"
-  integrity sha512-fhBhNkUToJcW9nV46v8w87AJOwAJDz84c1CL57n3Stj73FANM/b9TbCUK4YhdOwEyZ+OxhYpdeZDNzSI29Firw==
+babel-loader@8.0.5:
+  version "8.0.5"
+  resolved "https://registry.yarnpkg.com/babel-loader/-/babel-loader-8.0.5.tgz#225322d7509c2157655840bba52e46b6c2f2fe33"
+  integrity sha512-NTnHnVRd2JnRqPC0vW+iOQWU5pchDbYXsG2E6DMXEpMfUcQKclF9gmf3G3ZMhzG7IG9ji4coL0cm+FxeWxDpnw==
   dependencies:
-    find-cache-dir "^1.0.0"
+    find-cache-dir "^2.0.0"
     loader-utils "^1.0.2"
     mkdirp "^0.5.1"
     util.promisify "^1.0.0"
@@ -2710,22 +2547,6 @@ babel-plugin-dynamic-import-node@2.2.0:
   dependencies:
     object.assign "^4.1.0"
 
-babel-plugin-emotion@^10.0.6:
-  version "10.0.6"
-  resolved "https://registry.yarnpkg.com/babel-plugin-emotion/-/babel-plugin-emotion-10.0.6.tgz#fd9bb4a5dc6cf2289b656215dbbc80469fd251b3"
-  integrity sha512-JD2st8enZJn8h7W1s8kcb40r3RBCJwV9E8ZAhyyhELUMP8OYwyI9K1rz7MxRi0CoorX15kVo2NXZ+OJ6CeMY8A==
-  dependencies:
-    "@babel/helper-module-imports" "^7.0.0"
-    "@emotion/hash" "0.7.1"
-    "@emotion/memoize" "0.7.1"
-    "@emotion/serialize" "^0.11.3"
-    babel-plugin-macros "^2.0.0"
-    babel-plugin-syntax-jsx "^6.18.0"
-    convert-source-map "^1.5.0"
-    escape-string-regexp "^1.0.5"
-    find-root "^1.1.0"
-    source-map "^0.5.7"
-
 babel-plugin-emotion@^10.0.7:
   version "10.0.7"
   resolved "https://registry.yarnpkg.com/babel-plugin-emotion/-/babel-plugin-emotion-10.0.7.tgz#3634ada6dee762140f27db07387feaec8d2cb619"
@@ -2742,18 +2563,10 @@ babel-plugin-emotion@^10.0.7:
     find-root "^1.1.0"
     source-map "^0.5.7"
 
-babel-plugin-macros@2.4.2:
-  version "2.4.2"
-  resolved "https://registry.yarnpkg.com/babel-plugin-macros/-/babel-plugin-macros-2.4.2.tgz#21b1a2e82e2130403c5ff785cba6548e9b644b28"
-  integrity sha512-NBVpEWN4OQ/bHnu1fyDaAaTPAjnhXCEPqr1RwqxrU7b6tZ2hypp+zX4hlNfmVGfClD5c3Sl6Hfj5TJNF5VG5aA==
-  dependencies:
-    cosmiconfig "^5.0.5"
-    resolve "^1.8.1"
-
-babel-plugin-macros@^2.0.0, babel-plugin-macros@^2.4.5:
-  version "2.4.5"
-  resolved "https://registry.yarnpkg.com/babel-plugin-macros/-/babel-plugin-macros-2.4.5.tgz#7000a9b1f72d19ceee19a5804f1d23d6daf38c13"
-  integrity sha512-+/9yteNQw3yuZ3krQUfjAeoT/f4EAdn3ELwhFfDj0rTMIaoHfIdrcLePOfIaL0qmFLpIcgPIL2Lzm58h+CGWaw==
+babel-plugin-macros@2.5.0, babel-plugin-macros@^2.0.0, babel-plugin-macros@^2.4.5:
+  version "2.5.0"
+  resolved "https://registry.yarnpkg.com/babel-plugin-macros/-/babel-plugin-macros-2.5.0.tgz#01f4d3b50ed567a67b80a30b9da066e94f4097b6"
+  integrity sha512-BWw0lD0kVZAXRD3Od1kMrdmfudqzDzYv2qrN3l2ISR1HVp1EgLKfbOrYV9xmY5k3qx3RIu5uPAUZZZHpo0o5Iw==
   dependencies:
     cosmiconfig "^5.0.5"
     resolve "^1.8.1"
@@ -2833,9 +2646,9 @@ babel-plugin-minify-type-constructors@^0.4.3:
     babel-helper-is-void-0 "^0.4.3"
 
 babel-plugin-named-asset-import@^0.3.0:
-  version "0.3.0"
-  resolved "https://registry.yarnpkg.com/babel-plugin-named-asset-import/-/babel-plugin-named-asset-import-0.3.0.tgz#3289ec622d19cd1cc84df8d784b41f1b048bd524"
-  integrity sha512-to6Shd/r8fMRRg/MaOhDNfqpuXfjlQx3ypWDG6jh4ESCVZDJCgdgIalZbrnVlBPGgH/QeyHMjnGb2W+JJiy+NQ==
+  version "0.3.1"
+  resolved "https://registry.yarnpkg.com/babel-plugin-named-asset-import/-/babel-plugin-named-asset-import-0.3.1.tgz#5ec13ec446d0a1e5bb6c57a1f94c9cdedb0c50d6"
+  integrity sha512-vzZlo+yEB5YHqI6CRRTDojeT43J3Wf3C/MVkZW5UlbSeIIVUYRKtxaFT2L/VTv9mbIyatCW39+9g/SZolvwRUQ==
 
 babel-plugin-react-docgen@^2.0.2:
   version "2.0.2"
@@ -2913,12 +2726,12 @@ babel-plugin-syntax-function-bind@^6.8.0:
 
 babel-plugin-syntax-jsx@^6.18.0, babel-plugin-syntax-jsx@^6.3.13, babel-plugin-syntax-jsx@^6.8.0:
   version "6.18.0"
-  resolved "https://registry.npmjs.org/babel-plugin-syntax-jsx/-/babel-plugin-syntax-jsx-6.18.0.tgz#0af32a9a6e13ca7a3fd5069e62d7b0f58d0d8946"
+  resolved "https://registry.yarnpkg.com/babel-plugin-syntax-jsx/-/babel-plugin-syntax-jsx-6.18.0.tgz#0af32a9a6e13ca7a3fd5069e62d7b0f58d0d8946"
   integrity sha1-CvMqmm4Tyno/1QaeYtew9Y0NiUY=
 
 babel-plugin-syntax-object-rest-spread@^6.8.0:
   version "6.13.0"
-  resolved "https://registry.npmjs.org/babel-plugin-syntax-object-rest-spread/-/babel-plugin-syntax-object-rest-spread-6.13.0.tgz#fd6536f2bce13836ffa3a5458c4903a597bb3bf5"
+  resolved "https://registry.yarnpkg.com/babel-plugin-syntax-object-rest-spread/-/babel-plugin-syntax-object-rest-spread-6.13.0.tgz#fd6536f2bce13836ffa3a5458c4903a597bb3bf5"
   integrity sha1-/WU28rzhODb/o6VFjEkDpZe7O/U=
 
 babel-plugin-syntax-trailing-function-commas@^6.22.0, babel-plugin-syntax-trailing-function-commas@^6.8.0:
@@ -3314,10 +3127,10 @@ babel-plugin-transform-react-jsx@^6.24.1, babel-plugin-transform-react-jsx@^6.8.
     babel-plugin-syntax-jsx "^6.8.0"
     babel-runtime "^6.22.0"
 
-babel-plugin-transform-react-remove-prop-types@0.4.20:
-  version "0.4.20"
-  resolved "https://registry.yarnpkg.com/babel-plugin-transform-react-remove-prop-types/-/babel-plugin-transform-react-remove-prop-types-0.4.20.tgz#688bdea1e27ea0023775dea817fa2d3f8df8802b"
-  integrity sha512-bWQ8e7LsgdFpyHU/RabjDAjVhL7KLAJXEt0nb0LANFje8YAGA8RlZv88a72aCswOxELWULkYuJqfFoKgs58Tng==
+babel-plugin-transform-react-remove-prop-types@0.4.24:
+  version "0.4.24"
+  resolved "https://registry.yarnpkg.com/babel-plugin-transform-react-remove-prop-types/-/babel-plugin-transform-react-remove-prop-types-0.4.24.tgz#f2edaf9b4c6a5fbe5c1d678bfb531078c1555f3a"
+  integrity sha512-eqj0hVcJUR57/Ug2zE1Yswsw4LhuqqHhD+8v120T1cl3kjg76QwtyBrdIk4WVwK+lAhBJVYCd/v+4nc4y+8JsA==
 
 babel-plugin-transform-regenerator@^6.22.0, babel-plugin-transform-regenerator@^6.24.1:
   version "6.26.0"
@@ -3517,29 +3330,29 @@ babel-preset-flow@^6.23.0:
     lodash.isplainobject "^4.0.6"
 
 babel-preset-react-app@^7.0.0:
-  version "7.0.0"
-  resolved "https://registry.yarnpkg.com/babel-preset-react-app/-/babel-preset-react-app-7.0.0.tgz#86bf71e43cb8d36e40da69f8b4ad5d6f945dec93"
-  integrity sha512-LQKCB3xxdhAlRbk6IIZdO4ry1yA8gKGVV4phjOIgCEQr3oyaLPXf2j+lfD0zljOE2wkN2axRGOLTzdUPzVDO4w==
+  version "7.0.1"
+  resolved "https://registry.yarnpkg.com/babel-preset-react-app/-/babel-preset-react-app-7.0.1.tgz#8dd7fef73fba124a6e140d245185ca657a943313"
+  integrity sha512-cic2V+GftWwt82XNMKGxvkFAVvuaBISy0/mzNLLPlALXXJxUvxJgVy2DI8HVk311oewJsmBiu/unE4wINUCvkg==
   dependencies:
-    "@babel/core" "7.1.6"
-    "@babel/plugin-proposal-class-properties" "7.1.0"
-    "@babel/plugin-proposal-decorators" "7.1.6"
-    "@babel/plugin-proposal-object-rest-spread" "7.0.0"
-    "@babel/plugin-syntax-dynamic-import" "7.0.0"
-    "@babel/plugin-transform-classes" "7.1.0"
-    "@babel/plugin-transform-destructuring" "7.1.3"
-    "@babel/plugin-transform-flow-strip-types" "7.1.6"
-    "@babel/plugin-transform-react-constant-elements" "7.0.0"
-    "@babel/plugin-transform-react-display-name" "7.0.0"
-    "@babel/plugin-transform-runtime" "7.1.0"
-    "@babel/preset-env" "7.1.6"
+    "@babel/core" "7.2.2"
+    "@babel/plugin-proposal-class-properties" "7.3.0"
+    "@babel/plugin-proposal-decorators" "7.3.0"
+    "@babel/plugin-proposal-object-rest-spread" "7.3.2"
+    "@babel/plugin-syntax-dynamic-import" "7.2.0"
+    "@babel/plugin-transform-classes" "7.2.2"
+    "@babel/plugin-transform-destructuring" "7.3.2"
+    "@babel/plugin-transform-flow-strip-types" "7.2.3"
+    "@babel/plugin-transform-react-constant-elements" "7.2.0"
+    "@babel/plugin-transform-react-display-name" "7.2.0"
+    "@babel/plugin-transform-runtime" "7.2.0"
+    "@babel/preset-env" "7.3.1"
     "@babel/preset-react" "7.0.0"
     "@babel/preset-typescript" "7.1.0"
-    "@babel/runtime" "7.1.5"
-    babel-loader "8.0.4"
+    "@babel/runtime" "7.3.1"
+    babel-loader "8.0.5"
     babel-plugin-dynamic-import-node "2.2.0"
-    babel-plugin-macros "2.4.2"
-    babel-plugin-transform-react-remove-prop-types "0.4.20"
+    babel-plugin-macros "2.5.0"
+    babel-plugin-transform-react-remove-prop-types "0.4.24"
 
 babel-preset-react@^6.24.1:
   version "6.24.1"
@@ -3615,7 +3428,7 @@ babel-runtime@^6.18.0, babel-runtime@^6.22.0, babel-runtime@^6.23.0, babel-runti
 
 babel-template@^6.24.1, babel-template@^6.26.0, babel-template@^6.9.0:
   version "6.26.0"
-  resolved "https://registry.npmjs.org/babel-template/-/babel-template-6.26.0.tgz#de03e2d16396b069f46dd9fff8521fb1a0e35e02"
+  resolved "https://registry.yarnpkg.com/babel-template/-/babel-template-6.26.0.tgz#de03e2d16396b069f46dd9fff8521fb1a0e35e02"
   integrity sha1-3gPi0WOWsGn0bdn/+FIfsaDjXgI=
   dependencies:
     babel-runtime "^6.26.0"
@@ -3626,7 +3439,7 @@ babel-template@^6.24.1, babel-template@^6.26.0, babel-template@^6.9.0:
 
 babel-traverse@^6.24.1, babel-traverse@^6.26.0:
   version "6.26.0"
-  resolved "https://registry.npmjs.org/babel-traverse/-/babel-traverse-6.26.0.tgz#46a9cbd7edcc62c8e5c064e2d2d8d0f4035766ee"
+  resolved "https://registry.yarnpkg.com/babel-traverse/-/babel-traverse-6.26.0.tgz#46a9cbd7edcc62c8e5c064e2d2d8d0f4035766ee"
   integrity sha1-RqnL1+3MYsjlwGTi0tjQ9ANXZu4=
   dependencies:
     babel-code-frame "^6.26.0"
@@ -3641,7 +3454,7 @@ babel-traverse@^6.24.1, babel-traverse@^6.26.0:
 
 babel-types@^6.19.0, babel-types@^6.24.1, babel-types@^6.26.0:
   version "6.26.0"
-  resolved "https://registry.npmjs.org/babel-types/-/babel-types-6.26.0.tgz#a3b073f94ab49eb6fa55cd65227a334380632497"
+  resolved "https://registry.yarnpkg.com/babel-types/-/babel-types-6.26.0.tgz#a3b073f94ab49eb6fa55cd65227a334380632497"
   integrity sha1-o7Bz+Uq0nrb6Vc1lInozQ4BjJJc=
   dependencies:
     babel-runtime "^6.26.0"
@@ -3694,11 +3507,6 @@ base64-arraybuffer@0.1.5:
   resolved "https://registry.yarnpkg.com/base64-arraybuffer/-/base64-arraybuffer-0.1.5.tgz#73926771923b5a19747ad666aa5cd4bf9c6e9ce8"
   integrity sha1-c5JncZI7Whl0etZmqlzUv5xunOg=
 
-base64-js@0.0.8:
-  version "0.0.8"
-  resolved "https://registry.yarnpkg.com/base64-js/-/base64-js-0.0.8.tgz#1101e9544f4a76b1bc3b26d452ca96d7a35e7978"
-  integrity sha1-EQHpVE9KdrG8OybUUsqW16NeeXg=
-
 base64-js@^1.0.2:
   version "1.3.0"
   resolved "https://registry.yarnpkg.com/base64-js/-/base64-js-1.3.0.tgz#cab1e6118f051095e58b5281aea8c1cd22bfc0e3"
@@ -3819,17 +3627,6 @@ bin-build@^2.0.0, bin-build@^2.2.0:
     tempfile "^1.0.0"
     url-regex "^3.0.0"
 
-bin-build@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/bin-build/-/bin-build-3.0.0.tgz#c5780a25a8a9f966d8244217e6c1f5082a143861"
-  integrity sha512-jcUOof71/TNAI2uM5uoUaDq2ePcVBQ3R/qhxAz1rX7UfvduAL/RXD3jXzvn8cVcDJdGVkiR1shal3OH0ImpuhA==
-  dependencies:
-    decompress "^4.0.0"
-    download "^6.2.2"
-    execa "^0.7.0"
-    p-map-series "^1.0.0"
-    tempfile "^2.0.0"
-
 bin-check@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/bin-check/-/bin-check-2.0.0.tgz#86f8e6f4253893df60dc316957f5af02acb05930"
@@ -3867,9 +3664,9 @@ bin-wrapper@^3.0.0, bin-wrapper@^3.0.1:
     os-filter-obj "^1.0.0"
 
 binary-extensions@^1.0.0:
-  version "1.12.0"
-  resolved "https://registry.yarnpkg.com/binary-extensions/-/binary-extensions-1.12.0.tgz#c2d780f53d45bba8317a8902d4ceeaf3a6385b14"
-  integrity sha512-DYWGk01lDcxeS/K9IHPGWfT8PsJmbXRtRd2Sx72Tnb8pcYZQFF1oSDb8hJtS1vhp212q1Rzi5dUf9+nq0o9UIg==
+  version "1.13.0"
+  resolved "https://registry.yarnpkg.com/binary-extensions/-/binary-extensions-1.13.0.tgz#9523e001306a32444b907423f1de2164222f6ab1"
+  integrity sha512-EgmjVLMn22z7eGGv3kcnHwSnJXmFHjISTY9E/S5lIcTD3Oxw05QTcBLNkJFzcb3cNueUdF/IN4U+d78V0zO8Hw==
 
 bl@^1.0.0:
   version "1.2.2"
@@ -3879,17 +3676,12 @@ bl@^1.0.0:
     readable-stream "^2.3.5"
     safe-buffer "^5.1.1"
 
-blob@0.0.4:
-  version "0.0.4"
-  resolved "https://registry.yarnpkg.com/blob/-/blob-0.0.4.tgz#bcf13052ca54463f30f9fc7e95b9a47630a94921"
-  integrity sha1-vPEwUspURj8w+fx+lbmkdjCpSSE=
+blob@0.0.5:
+  version "0.0.5"
+  resolved "https://registry.yarnpkg.com/blob/-/blob-0.0.5.tgz#d680eeef25f8cd91ad533f5b01eed48e64caf683"
+  integrity sha512-gaqbzQPqOoamawKg0LGVd7SzLgXS+JH61oWprSLH+P+abTczqJbhTR8CmJ2u9/bUYNmHTGJx/UEmn6doAvvuig==
 
-bluebird@^3.0.5, bluebird@^3.3.4, bluebird@^3.5.0, bluebird@^3.5.1:
-  version "3.5.2"
-  resolved "https://registry.yarnpkg.com/bluebird/-/bluebird-3.5.2.tgz#1be0908e054a751754549c270489c1505d4ab15a"
-  integrity sha512-dhHTWMI7kMx5whMQntl7Vr9C6BvV10lFXDAasnqnrMYhXVCzzk6IO9Fo2L75jXHT07WrOngL1WDXOp+yYS91Yg==
-
-bluebird@^3.3.5:
+bluebird@^3.0.5, bluebird@^3.3.4, bluebird@^3.3.5, bluebird@^3.5.0, bluebird@^3.5.3:
   version "3.5.3"
   resolved "https://registry.yarnpkg.com/bluebird/-/bluebird-3.5.3.tgz#7d01c6f9616c9a51ab0f8c549a79dfe6ec33efa7"
   integrity sha512-/qKPUQlaW1OyR51WeCPBvRnAlnZFUJkCSG5HzGnuIqhgyJtF+T94lFnn33eiazjRm2LAHVy2guNnaq48X9SJuw==
@@ -3978,7 +3770,7 @@ braces@^1.8.2:
     preserve "^0.2.0"
     repeat-element "^1.1.2"
 
-braces@^2.3.0, braces@^2.3.1:
+braces@^2.3.1, braces@^2.3.2:
   version "2.3.2"
   resolved "https://registry.yarnpkg.com/braces/-/braces-2.3.2.tgz#5979fd3f14cd531565e5fa2df1abfff1dfaee729"
   integrity sha512-aNdbnj9P8PjdXU4ybaWLK2IF3jc/EoDYbC7AazW6to3TRsfXxscC9UXOB5iDiEQrkyIbWp2SLQda4+QAa7nc3w==
@@ -4072,14 +3864,14 @@ browserify-zlib@^0.2.0:
   dependencies:
     pako "~1.0.5"
 
-browserslist@4.1.1:
-  version "4.1.1"
-  resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.1.1.tgz#328eb4ff1215b12df6589e9ab82f8adaa4fc8cd6"
-  integrity sha512-VBorw+tgpOtZ1BYhrVSVTzTt/3+vSE3eFUh0N2GCFK1HffceOaf32YS/bs6WiFhjDAblAFrx85jMy3BG9fBK2Q==
+browserslist@4.4.1:
+  version "4.4.1"
+  resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.4.1.tgz#42e828954b6b29a7a53e352277be429478a69062"
+  integrity sha512-pEBxEXg7JwaakBXjATYw/D1YZh4QUSCX/Mnd/wnqSRPPSi1U39iDhDoKGoBUcraKdxDlrYqJxSI5nNvD+dWP2A==
   dependencies:
-    caniuse-lite "^1.0.30000884"
-    electron-to-chromium "^1.3.62"
-    node-releases "^1.0.0-alpha.11"
+    caniuse-lite "^1.0.30000929"
+    electron-to-chromium "^1.3.103"
+    node-releases "^1.1.3"
 
 browserslist@^1.0.0, browserslist@^1.3.6, browserslist@^1.5.2, browserslist@^1.7.6:
   version "1.7.7"
@@ -4097,23 +3889,14 @@ browserslist@^3.2.6:
     caniuse-lite "^1.0.30000844"
     electron-to-chromium "^1.3.47"
 
-browserslist@^4.1.0, browserslist@^4.3.4:
-  version "4.3.5"
-  resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.3.5.tgz#1a917678acc07b55606748ea1adf9846ea8920f7"
-  integrity sha512-z9ZhGc3d9e/sJ9dIx5NFXkKoaiQTnrvrMsN3R1fGb1tkWWNSz12UewJn9TNxGo1l7J23h0MRaPmk7jfeTZYs1w==
+browserslist@^4.3.4, browserslist@^4.4.2:
+  version "4.4.2"
+  resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.4.2.tgz#6ea8a74d6464bb0bd549105f659b41197d8f0ba2"
+  integrity sha512-ISS/AIAiHERJ3d45Fz0AVYKkgcy+F/eJHzKEvv1j0wwKGKD9T3BrwKr/5g45L+Y4XIK5PlTqefHciRFcfE1Jxg==
   dependencies:
-    caniuse-lite "^1.0.30000912"
-    electron-to-chromium "^1.3.86"
-    node-releases "^1.0.5"
-
-browserslist@^4.4.1:
-  version "4.4.1"
-  resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.4.1.tgz#42e828954b6b29a7a53e352277be429478a69062"
-  integrity sha512-pEBxEXg7JwaakBXjATYw/D1YZh4QUSCX/Mnd/wnqSRPPSi1U39iDhDoKGoBUcraKdxDlrYqJxSI5nNvD+dWP2A==
-  dependencies:
-    caniuse-lite "^1.0.30000929"
-    electron-to-chromium "^1.3.103"
-    node-releases "^1.1.3"
+    caniuse-lite "^1.0.30000939"
+    electron-to-chromium "^1.3.113"
+    node-releases "^1.1.8"
 
 bser@^2.0.0:
   version "2.0.0"
@@ -4175,15 +3958,6 @@ buffer-xor@^1.0.3:
   resolved "https://registry.yarnpkg.com/buffer-xor/-/buffer-xor-1.0.3.tgz#26e61ed1422fb70dd42e6e36729ed51d855fe8d9"
   integrity sha1-JuYe0UIvtw3ULm42cp7VHYVf6Nk=
 
-buffer@^3.0.1:
-  version "3.6.0"
-  resolved "https://registry.yarnpkg.com/buffer/-/buffer-3.6.0.tgz#a72c936f77b96bf52f5f7e7b467180628551defb"
-  integrity sha1-pyyTb3e5a/UvX357RnGAYoVR3vs=
-  dependencies:
-    base64-js "0.0.8"
-    ieee754 "^1.1.4"
-    isarray "^1.0.0"
-
 buffer@^4.3.0, buffer@^4.9.0:
   version "4.9.1"
   resolved "https://registry.yarnpkg.com/buffer/-/buffer-4.9.1.tgz#6d1bb601b07a4efced97094132093027c95bc298"
@@ -4198,6 +3972,11 @@ builtin-modules@^1.0.0:
   resolved "https://registry.yarnpkg.com/builtin-modules/-/builtin-modules-1.1.1.tgz#270f076c5a72c02f5b65a47df94c5fe3a278892f"
   integrity sha1-Jw8HbFpywC9bZaR9+Uxf46J4iS8=
 
+builtin-modules@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/builtin-modules/-/builtin-modules-3.0.0.tgz#1e587d44b006620d90286cc7a9238bbc6129cab1"
+  integrity sha512-hMIeU4K2ilbXV6Uv93ZZ0Avg/M91RaKXucQ+4me2Do1txxBDyDZWCBa5bJSLqoNTRpXTLwEzIk1KmloenDDjhg==
+
 builtin-status-codes@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/builtin-status-codes/-/builtin-status-codes-3.0.0.tgz#85982878e21b98e1c66425e03d0174788f569ee8"
@@ -4209,23 +3988,23 @@ bytes@3.0.0:
   integrity sha1-0ygVQE1olpn4Wk6k+odV3ROpYEg=
 
 cacache@^11.0.2:
-  version "11.3.1"
-  resolved "https://registry.yarnpkg.com/cacache/-/cacache-11.3.1.tgz#d09d25f6c4aca7a6d305d141ae332613aa1d515f"
-  integrity sha512-2PEw4cRRDu+iQvBTTuttQifacYjLPhET+SYO/gEFMy8uhi+jlJREDAjSF5FWSdV/Aw5h18caHA7vMTw2c+wDzA==
+  version "11.3.2"
+  resolved "https://registry.yarnpkg.com/cacache/-/cacache-11.3.2.tgz#2d81e308e3d258ca38125b676b98b2ac9ce69bfa"
+  integrity sha512-E0zP4EPGDOaT2chM08Als91eYnf8Z+eH1awwwVsngUmgppfM5jjJ8l3z5vO5p5w/I3LsiXawb1sW0VY65pQABg==
   dependencies:
-    bluebird "^3.5.1"
-    chownr "^1.0.1"
-    figgy-pudding "^3.1.0"
-    glob "^7.1.2"
-    graceful-fs "^4.1.11"
-    lru-cache "^4.1.3"
+    bluebird "^3.5.3"
+    chownr "^1.1.1"
+    figgy-pudding "^3.5.1"
+    glob "^7.1.3"
+    graceful-fs "^4.1.15"
+    lru-cache "^5.1.1"
     mississippi "^3.0.0"
     mkdirp "^0.5.1"
     move-concurrently "^1.0.1"
     promise-inflight "^1.0.1"
     rimraf "^2.6.2"
-    ssri "^6.0.0"
-    unique-filename "^1.1.0"
+    ssri "^6.0.1"
+    unique-filename "^1.1.1"
     y18n "^4.0.0"
 
 cache-base@^1.0.1:
@@ -4309,9 +4088,9 @@ camelcase@^4.0.0, camelcase@^4.1.0:
   integrity sha1-1UVjW+HjPFQmScaRc+Xeas+uNN0=
 
 camelcase@^5.0.0:
-  version "5.0.0"
-  resolved "https://registry.yarnpkg.com/camelcase/-/camelcase-5.0.0.tgz#03295527d58bd3cd4aa75363f35b2e8d97be2f42"
-  integrity sha512-faqwZqnWxbxn+F1d399ygeamQNy3lPp/H9H6rNrqYh4FSVCtcY+3cub1MxA8o9mDd55mM8Aghuu/kuyYA6VTsA==
+  version "5.2.0"
+  resolved "https://registry.yarnpkg.com/camelcase/-/camelcase-5.2.0.tgz#e7522abda5ed94cc0489e1b8466610e88404cf45"
+  integrity sha512-IXFsBS2pC+X0j0N/GE7Dm7j3bsEBp+oTpb7F50dwEVX7rf3IgwO9XatnegTsDtniKCUtEJH4fSU6Asw7uoVLfQ==
 
 camelize@^1.0.0:
   version "1.0.0"
@@ -4329,24 +4108,14 @@ caniuse-api@^1.5.2, caniuse-api@^1.5.3:
     lodash.uniq "^4.5.0"
 
 caniuse-db@^1.0.30000529, caniuse-db@^1.0.30000634, caniuse-db@^1.0.30000639:
-  version "1.0.30000890"
-  resolved "https://registry.yarnpkg.com/caniuse-db/-/caniuse-db-1.0.30000890.tgz#b406595db8b631975b8dc5fa174f32925c23778b"
-  integrity sha512-aO5uw1Taw8GkNMMXIWOz/WJz3y6tR1ETUAdH/pvO5EoJ3I1Po9vNJd9aMjY1GKucS/OXWMiQbXRbk3O1sgCbRA==
+  version "1.0.30000941"
+  resolved "https://registry.yarnpkg.com/caniuse-db/-/caniuse-db-1.0.30000941.tgz#81ab7e49ecdd98c3c9a266b50205af9159ec60a6"
+  integrity sha512-xgDlJ1rEg4Zb1wqyiDw1Lwd2lIrG5El9vhHwURihFw8+Gk2PcyVh1RWaymOwFx6q49rMgVFqQAvLJmEU9RUUJg==
 
-caniuse-lite@^1.0.30000844:
-  version "1.0.30000890"
-  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30000890.tgz#86a18ffcc65d79ec6a437e985761b8bf1c4efeaf"
-  integrity sha512-4NI3s4Y6ROm+SgZN5sLUG4k7nVWQnedis3c/RWkynV5G6cHSY7+a8fwFyn2yoBDE3E6VswhTNNwR3PvzGqlTkg==
-
-caniuse-lite@^1.0.30000884, caniuse-lite@^1.0.30000912:
-  version "1.0.30000921"
-  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30000921.tgz#7a607c1623444b22351d834e093aedda3c42fbe8"
-  integrity sha512-Bu09ciy0lMWLgpYC77I0YGuI8eFRBPPzaSOYJK1jTI64txCphYCqnWbxJYjHABYVt/TYX/p3jNjLBR87u1Bfpw==
-
-caniuse-lite@^1.0.30000929, caniuse-lite@^1.0.30000938:
-  version "1.0.30000938"
-  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30000938.tgz#b64bf1427438df40183fce910fe24e34feda7a3f"
-  integrity sha512-ekW8NQ3/FvokviDxhdKLZZAx7PptXNwxKgXtnR5y+PR3hckwuP3yJ1Ir+4/c97dsHNqtAyfKUGdw8P4EYzBNgw==
+caniuse-lite@^1.0.30000844, caniuse-lite@^1.0.30000929, caniuse-lite@^1.0.30000939, caniuse-lite@^1.0.30000940:
+  version "1.0.30000941"
+  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30000941.tgz#f0810802b2ab8d27f4b625d4769a610e24d5a42c"
+  integrity sha512-4vzGb2MfZcO20VMPj1j6nRAixhmtlhkypM4fL4zhgzEucQIYiRzSqPcWIu1OF8i0FETD93FMIPWfUJCAcFvrqA==
 
 capture-stack-trace@^1.0.0:
   version "1.0.1"
@@ -4373,16 +4142,6 @@ caw@^1.0.1:
     object-assign "^3.0.0"
     tunnel-agent "^0.4.0"
 
-caw@^2.0.0:
-  version "2.0.1"
-  resolved "https://registry.yarnpkg.com/caw/-/caw-2.0.1.tgz#6c3ca071fc194720883c2dc5da9b074bfc7e9e95"
-  integrity sha512-Cg8/ZSBEa8ZVY9HspcGUYaK63d/bN7rqS3CYCzEGUxuYv6UlmcjzDUz2fCFFHyTvUW5Pk0I+3hkA3iXlIj6guA==
-  dependencies:
-    get-proxy "^2.0.0"
-    isurl "^1.0.0-alpha5"
-    tunnel-agent "^0.6.0"
-    url-to-options "^1.0.1"
-
 ccount@^1.0.0, ccount@^1.0.3:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/ccount/-/ccount-1.0.3.tgz#f1cec43f332e2ea5a569fd46f9f5bde4e6102aff"
@@ -4421,7 +4180,7 @@ chalk@2.4.1:
     escape-string-regexp "^1.0.5"
     supports-color "^5.3.0"
 
-chalk@^2.0.0, chalk@^2.0.1, chalk@^2.3.0, chalk@^2.4.1, chalk@^2.4.2:
+chalk@2.4.2, chalk@^2.0.0, chalk@^2.0.1, chalk@^2.4.1, chalk@^2.4.2:
   version "2.4.2"
   resolved "https://registry.yarnpkg.com/chalk/-/chalk-2.4.2.tgz#cd42541677a54333cf541a49108c1432b44c9424"
   integrity sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==
@@ -4530,26 +4289,25 @@ chokidar@^1.0.0, chokidar@^1.6.1, chokidar@^1.7.0:
     fsevents "^1.0.0"
 
 chokidar@^2.0.2:
-  version "2.0.4"
-  resolved "https://registry.yarnpkg.com/chokidar/-/chokidar-2.0.4.tgz#356ff4e2b0e8e43e322d18a372460bbcf3accd26"
-  integrity sha512-z9n7yt9rOvIJrMhvDtDictKrkFHeihkNl6uWMmZlmL6tJtX9Cs+87oK+teBx+JIgzvbX3yZHT3eF8vpbDxHJXQ==
+  version "2.1.2"
+  resolved "https://registry.yarnpkg.com/chokidar/-/chokidar-2.1.2.tgz#9c23ea40b01638439e0513864d362aeacc5ad058"
+  integrity sha512-IwXUx0FXc5ibYmPC2XeEj5mpXoV66sR+t3jqu2NS2GYwCktt3KF1/Qqjws/NkegajBA4RbZ5+DDwlOiJsxDHEg==
   dependencies:
     anymatch "^2.0.0"
-    async-each "^1.0.0"
-    braces "^2.3.0"
+    async-each "^1.0.1"
+    braces "^2.3.2"
     glob-parent "^3.1.0"
-    inherits "^2.0.1"
+    inherits "^2.0.3"
     is-binary-path "^1.0.0"
     is-glob "^4.0.0"
-    lodash.debounce "^4.0.8"
-    normalize-path "^2.1.1"
+    normalize-path "^3.0.0"
     path-is-absolute "^1.0.0"
-    readdirp "^2.0.0"
-    upath "^1.0.5"
+    readdirp "^2.2.1"
+    upath "^1.1.0"
   optionalDependencies:
-    fsevents "^1.2.2"
+    fsevents "^1.2.7"
 
-chownr@^1.0.1:
+chownr@^1.0.1, chownr@^1.1.1:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/chownr/-/chownr-1.1.1.tgz#54726b8b8fff4df053c42187e801fb4412df1494"
   integrity sha512-j38EvO5+LHX84jlo6h4UzmOwi0UgW61WRyPtJz4qaadK5eY3BTS5TY/S1Stc3Uk2lIM6TPevAlULiEJwie860g==
@@ -4732,14 +4490,7 @@ co@^4.6.0:
   resolved "https://registry.yarnpkg.com/co/-/co-4.6.0.tgz#6ea6bdf3d853ae54ccb8e47bfa0bf3f9031fb184"
   integrity sha1-bqa989hTrlTMuOR7+gvz+QMfsYQ=
 
-coa@~1.0.1:
-  version "1.0.4"
-  resolved "https://registry.yarnpkg.com/coa/-/coa-1.0.4.tgz#a9ef153660d6a86a8bdec0289a5c684d217432fd"
-  integrity sha1-qe8VNmDWqGqL3sAomlxoTSF0Mv0=
-  dependencies:
-    q "^1.1.2"
-
-coa@~2.0.1:
+coa@^2.0.2:
   version "2.0.2"
   resolved "https://registry.yarnpkg.com/coa/-/coa-2.0.2.tgz#43f6c21151b4ef2bf57187db0d73de229e3e7ec3"
   integrity sha512-q5/jG+YQnSy4nRTV4F7lPepBJZ8qBNJJDBuJdoejDyLXgmL7IEo+Le2JDZudFTFt7mrCqIRaSjws4ygRCTCAXA==
@@ -4748,6 +4499,13 @@ coa@~2.0.1:
     chalk "^2.4.1"
     q "^1.1.2"
 
+coa@~1.0.1:
+  version "1.0.4"
+  resolved "https://registry.yarnpkg.com/coa/-/coa-1.0.4.tgz#a9ef153660d6a86a8bdec0289a5c684d217432fd"
+  integrity sha1-qe8VNmDWqGqL3sAomlxoTSF0Mv0=
+  dependencies:
+    q "^1.1.2"
+
 code-point-at@^1.0.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/code-point-at/-/code-point-at-1.1.0.tgz#0d070b4d043a5bea33a2f1a40e2edb3d9a4ccf77"
@@ -4852,14 +4610,7 @@ colors@~1.1.2:
   resolved "https://registry.yarnpkg.com/colors/-/colors-1.1.2.tgz#168a4701756b6a7f51a12ce0c97bfa28c084ed63"
   integrity sha1-FopHAXVran9RoSzgyXv6KMCE7WM=
 
-combined-stream@1.0.6:
-  version "1.0.6"
-  resolved "https://registry.yarnpkg.com/combined-stream/-/combined-stream-1.0.6.tgz#723e7df6e801ac5613113a7e445a9b69cb632818"
-  integrity sha1-cj599ugBrFYTETp+RFqbactjKBg=
-  dependencies:
-    delayed-stream "~1.0.0"
-
-combined-stream@~1.0.6:
+combined-stream@^1.0.6, combined-stream@~1.0.6:
   version "1.0.7"
   resolved "https://registry.yarnpkg.com/combined-stream/-/combined-stream-1.0.7.tgz#2d1d24317afb8abe95d6d2c0b07b57813539d828"
   integrity sha512-brWl9y6vOB1xYPZcpZde3N9zDByXTosAeMDo4p1wzo6UMOX4vumB+TP1RZ76sfE6Md68Q0NJSrE/gbezd4Ul+w==
@@ -4935,11 +4686,11 @@ component-inherit@0.0.3:
   integrity sha1-ZF/ErfWLcrZJ1crmUTVhnbJv8UM=
 
 compressible@~2.0.14:
-  version "2.0.15"
-  resolved "https://registry.yarnpkg.com/compressible/-/compressible-2.0.15.tgz#857a9ab0a7e5a07d8d837ed43fe2defff64fe212"
-  integrity sha512-4aE67DL33dSW9gw4CI2H/yTxqHLNcxp0yS6jB+4h+wr3e43+1z7vm0HU9qXOH8j+qjKuL8+UtkOxYQSMq60Ylw==
+  version "2.0.16"
+  resolved "https://registry.yarnpkg.com/compressible/-/compressible-2.0.16.tgz#a49bf9858f3821b64ce1be0296afc7380466a77f"
+  integrity sha512-JQfEOdnI7dASwCuSPWIeVYwc/zMsu/+tRhoUvEfXz2gxOA2DNjmG5vhtFdBlhWPPGo+RdT9S3tgc/uH5qgDiiA==
   dependencies:
-    mime-db ">= 1.36.0 < 2"
+    mime-db ">= 1.38.0 < 2"
 
 compression@^1.5.2:
   version "1.7.3"
@@ -4969,9 +4720,9 @@ concat-stream@^1.4.6, concat-stream@^1.4.7, concat-stream@^1.5.0:
     readable-stream "^2.2.2"
     typedarray "^0.0.6"
 
-config-chain@^1.1.11, config-chain@^1.1.12:
+config-chain@^1.1.12:
   version "1.1.12"
-  resolved "https://registry.npmjs.org/config-chain/-/config-chain-1.1.12.tgz#0fde8d091200eb5e808caf25fe618c02f48e4efa"
+  resolved "https://registry.yarnpkg.com/config-chain/-/config-chain-1.1.12.tgz#0fde8d091200eb5e808caf25fe618c02f48e4efa"
   integrity sha512-a1eOIcu8+7lUInge4Rpf/n4Krkf3Dd9lqhljRzII1/Zno/kRtUWnznPO3jOKBmTEktkt3fkxisUcivoj0ebzoA==
   dependencies:
     ini "^1.3.4"
@@ -4990,9 +4741,9 @@ configstore@^3.0.0, configstore@^3.1.2:
     xdg-basedir "^3.0.0"
 
 connect-history-api-fallback@^1.3.0:
-  version "1.5.0"
-  resolved "https://registry.yarnpkg.com/connect-history-api-fallback/-/connect-history-api-fallback-1.5.0.tgz#b06873934bc5e344fef611a196a6faae0aee015a"
-  integrity sha1-sGhzk0vF40T+9hGhlqb6rgruAVo=
+  version "1.6.0"
+  resolved "https://registry.yarnpkg.com/connect-history-api-fallback/-/connect-history-api-fallback-1.6.0.tgz#8b32089359308d111115d81cad3fceab888f97bc"
+  integrity sha512-e54B99q/OUoH64zYYRf3HBP5z24G38h5D3qXu23JGRoigpX5Ss4r9ZnDk3g0Z8uQC2x2lPaJ+UlWBc1ZWBWdLg==
 
 console-browserify@^1.1.0:
   version "1.1.0"
@@ -5016,7 +4767,7 @@ constants-browserify@^1.0.0:
   resolved "https://registry.yarnpkg.com/constants-browserify/-/constants-browserify-1.0.0.tgz#c20b96d8c617748aaf1c16021760cd27fcb8cb75"
   integrity sha1-wguW2MYXdIqvHBYCF2DNJ/y4y3U=
 
-content-disposition@0.5.2, content-disposition@^0.5.2:
+content-disposition@0.5.2:
   version "0.5.2"
   resolved "https://registry.yarnpkg.com/content-disposition/-/content-disposition-0.5.2.tgz#0cf68bb9ddf5f2be7961c3a85178cb85dba78cb4"
   integrity sha1-DPaLud318r55YcOoUXjLhdunjLQ=
@@ -5082,21 +4833,11 @@ core-js@^1.0.0, core-js@^1.2.6:
   resolved "https://registry.yarnpkg.com/core-js/-/core-js-1.2.7.tgz#652294c14651db28fa93bd2d5ff2983a4f08c636"
   integrity sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY=
 
-core-js@^2.4.0, core-js@^2.5.0, core-js@^2.5.7:
-  version "2.6.2"
-  resolved "https://registry.yarnpkg.com/core-js/-/core-js-2.6.2.tgz#267988d7268323b349e20b4588211655f0e83944"
-  integrity sha512-NdBPF/RVwPW6jr0NCILuyN9RiqLo2b1mddWHkUL+VnvcB7dzlnBJ1bXYntjpTGOgkZiiLWj2JxmOr7eGE3qK6g==
-
-core-js@^2.6.2:
+core-js@^2.4.0, core-js@^2.5.0, core-js@^2.5.7, core-js@^2.6.2:
   version "2.6.5"
   resolved "https://registry.yarnpkg.com/core-js/-/core-js-2.6.5.tgz#44bc8d249e7fb2ff5d00e0341a7ffb94fbf67895"
   integrity sha512-klh/kDpwX8hryYL14M9w/xei6vrv6sE8gTHDG7/T/+SEovB/G4ejwcfE/CBzO6Edsu+OETZMZ3wcX/EjUkrl5A==
 
-core-js@~2.3.0:
-  version "2.3.0"
-  resolved "https://registry.yarnpkg.com/core-js/-/core-js-2.3.0.tgz#fab83fbb0b2d8dc85fa636c4b9d34c75420c6d65"
-  integrity sha1-+rg/uwstjchfpjbEudNMdUIMbWU=
-
 core-util-is@1.0.2, core-util-is@~1.0.0:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/core-util-is/-/core-util-is-1.0.2.tgz#b5fd54220aa2bc5ab57aab7140c940754503c1a7"
@@ -5112,23 +4853,15 @@ cosmiconfig@^4.0.0:
     parse-json "^4.0.0"
     require-from-string "^2.0.1"
 
-cosmiconfig@^5.0.5:
-  version "5.0.6"
-  resolved "https://registry.yarnpkg.com/cosmiconfig/-/cosmiconfig-5.0.6.tgz#dca6cf680a0bd03589aff684700858c81abeeb39"
-  integrity sha512-6DWfizHriCrFWURP1/qyhsiFvYdlJzbCzmtFWh744+KyWsJo5+kPzUZZaMRSSItoYc0pxFX7gEO7ZC1/gN/7AQ==
-  dependencies:
-    is-directory "^0.3.1"
-    js-yaml "^3.9.0"
-    parse-json "^4.0.0"
-
-cosmiconfig@^5.0.7:
-  version "5.0.7"
-  resolved "https://registry.yarnpkg.com/cosmiconfig/-/cosmiconfig-5.0.7.tgz#39826b292ee0d78eda137dfa3173bd1c21a43b04"
-  integrity sha512-PcLqxTKiDmNT6pSpy4N6KtuPwb53W+2tzNvwOZw0WH9N6O0vLIBq0x8aj8Oj75ere4YcGi48bDFCL+3fRJdlNA==
+cosmiconfig@^5.0.5, cosmiconfig@^5.0.7:
+  version "5.1.0"
+  resolved "https://registry.yarnpkg.com/cosmiconfig/-/cosmiconfig-5.1.0.tgz#6c5c35e97f37f985061cdf653f114784231185cf"
+  integrity sha512-kCNPvthka8gvLtzAxQXvWo4FxqRB+ftRZyPZNuab5ngvM9Y7yw7hbEysglptLgpkGX9nAOKTBVkHUAe8xtYR6Q==
   dependencies:
     import-fresh "^2.0.0"
     is-directory "^0.3.1"
     js-yaml "^3.9.0"
+    lodash.get "^4.4.2"
     parse-json "^4.0.0"
 
 create-ecdh@^4.0.0:
@@ -5329,7 +5062,7 @@ css-loader@^2.1.0:
     postcss-value-parser "^3.3.0"
     schema-utils "^1.0.0"
 
-css-select-base-adapter@~0.1.0:
+css-select-base-adapter@^0.1.1:
   version "0.1.1"
   resolved "https://registry.yarnpkg.com/css-select-base-adapter/-/css-select-base-adapter-0.1.1.tgz#3b2ff4972cc362ab88561507a95408a1432135d7"
   integrity sha512-jQVeeRG70QI08vSTwf1jHxp74JoZsr2XSgETae8/xC8ovSnL2WF87GTLO86Sbwdt2lK4Umg4HnnwMO4YF3Ce7w==
@@ -5360,9 +5093,9 @@ css-selector-parser@^1.1.0:
   integrity sha1-XxrUPi2O77/cME/NOaUhZklD4+s=
 
 css-selector-tokenizer@^0.7.0:
-  version "0.7.0"
-  resolved "https://registry.yarnpkg.com/css-selector-tokenizer/-/css-selector-tokenizer-0.7.0.tgz#e6988474ae8c953477bf5e7efecfceccd9cf4c86"
-  integrity sha1-5piEdK6MlTR3v15+/s/OzNnPTIY=
+  version "0.7.1"
+  resolved "https://registry.yarnpkg.com/css-selector-tokenizer/-/css-selector-tokenizer-0.7.1.tgz#a177271a8bca5019172f4f891fc6eed9cbf68d5d"
+  integrity sha512-xYL0AMZJ4gFzJQsHUKa5jiWWi2vH77WVNg7JYRyewwj6oPh4yb/y6Y9ZCw9dsj/9UauMhtuxR+ogQd//EdEVNA==
   dependencies:
     cssesc "^0.1.0"
     fastparse "^1.1.1"
@@ -5398,21 +5131,21 @@ css-url-regex@^1.1.0:
   resolved "https://registry.yarnpkg.com/css-url-regex/-/css-url-regex-1.1.0.tgz#83834230cc9f74c457de59eebd1543feeb83b7ec"
   integrity sha1-g4NCMMyfdMRX3lnuvRVD/uuDt+w=
 
-css-what@2.1:
-  version "2.1.0"
-  resolved "https://registry.yarnpkg.com/css-what/-/css-what-2.1.0.tgz#9467d032c38cfaefb9f2d79501253062f87fa1bd"
-  integrity sha1-lGfQMsOM+u+58teVASUwYvh/ob0=
-
-css-what@^2.1.2:
-  version "2.1.2"
-  resolved "https://registry.yarnpkg.com/css-what/-/css-what-2.1.2.tgz#c0876d9d0480927d7d4920dcd72af3595649554d"
-  integrity sha512-wan8dMWQ0GUeF7DGEPVjhHemVW/vy6xUYmFzRY8RYqgA0JtXC9rJmbScBjqSu6dg9q0lwPQy6ZAmJVr3PPTvqQ==
+css-what@2.1, css-what@^2.1.2:
+  version "2.1.3"
+  resolved "https://registry.yarnpkg.com/css-what/-/css-what-2.1.3.tgz#a6d7604573365fe74686c3f311c56513d88285f2"
+  integrity sha512-a+EPoD+uZiNfh+5fxw2nO9QwFa6nJe2Or35fGY6Ipw1R3R4AGz1d1TEZrCegvw2YTmZ0jXirGYlzxxpYSHwpEg==
 
 cssesc@^0.1.0:
   version "0.1.0"
   resolved "https://registry.yarnpkg.com/cssesc/-/cssesc-0.1.0.tgz#c814903e45623371a0477b40109aaafbeeaddbb4"
   integrity sha1-yBSQPkViM3GgR3tAEJqq++6t27Q=
 
+cssesc@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/cssesc/-/cssesc-3.0.0.tgz#37741919903b868565e1c09ea747445cd18983ee"
+  integrity sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==
+
 "cssnano@>=2.6.1 <4":
   version "3.10.0"
   resolved "https://registry.yarnpkg.com/cssnano/-/cssnano-3.10.0.tgz#4f38f6cea2b9b17fa01490f23f1dc68ea65c1c38"
@@ -5451,7 +5184,7 @@ cssesc@^0.1.0:
     postcss-value-parser "^3.2.3"
     postcss-zindex "^2.0.1"
 
-csso@^3.5.0:
+csso@^3.5.1:
   version "3.5.1"
   resolved "https://registry.yarnpkg.com/csso/-/csso-3.5.1.tgz#7b9eb8be61628973c1b261e169d2f024008e758b"
   integrity sha512-vrqULLffYU1Q2tLdJvaCYbONStnfkfimRxXNaGjxMldI0C7JPBC4rB1RyjhfdZ4m1frm8pM9uRPKH3d2knZ8gg==
@@ -5466,15 +5199,10 @@ csso@~2.3.1:
     clap "^1.0.9"
     source-map "^0.5.3"
 
-csstype@^2.2.0:
-  version "2.5.7"
-  resolved "https://registry.yarnpkg.com/csstype/-/csstype-2.5.7.tgz#bf9235d5872141eccfb2d16d82993c6b149179ff"
-  integrity sha512-Nt5VDyOTIIV4/nRFswoCKps1R5CD1hkiyjBE9/thNaNZILLEviVw9yWQw15+O+CpNjQKB/uvdcxFFOrSflY3Yw==
-
-csstype@^2.5.7:
-  version "2.6.0"
-  resolved "https://registry.yarnpkg.com/csstype/-/csstype-2.6.0.tgz#6cf7b2fa7fc32aab3d746802c244d4eda71371a2"
-  integrity sha512-by8hi8BlLbowQq0qtkx54d9aN73R9oUW20HISpka5kmgsR9F7nnxgfsemuR2sdCKZh+CDNf5egW9UZMm4mgJRg==
+csstype@^2.2.0, csstype@^2.5.7:
+  version "2.6.3"
+  resolved "https://registry.yarnpkg.com/csstype/-/csstype-2.6.3.tgz#b701e5968245bf9b08d54ac83d00b624e622a9fa"
+  integrity sha512-rINUZXOkcBmoHWEyu7JdHu5JMzkGRoMX4ov9830WNgxf5UYxcBUO0QTKAqeJ5EZfSdlrcJYkC8WwfVW7JYi4yg==
 
 currently-unhandled@^0.4.1:
   version "0.4.1"
@@ -5521,6 +5249,13 @@ data-uri-to-buffer@1:
   resolved "https://registry.yarnpkg.com/data-uri-to-buffer/-/data-uri-to-buffer-1.2.0.tgz#77163ea9c20d8641b4707e8f18abdf9a78f34835"
   integrity sha512-vKQ9DTQPN1FLYiiEEOQ6IBGFqvjCa5rSK3cWMy/Nespm5d/x3dGFT9UBZnkLxCwua/IXBi2TYnwTEpsOvhC4UQ==
 
+data-uri-to-buffer@2:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/data-uri-to-buffer/-/data-uri-to-buffer-2.0.0.tgz#0ba23671727349828c32cfafddea411908d13d23"
+  integrity sha512-YbKCNLPPP4inc0E5If4OaalBc7gpaM2MRv77Pv2VThVComLKfbGYtJcdDCViDyp1Wd4SebhHLz94vp91zbK6bw==
+  dependencies:
+    "@types/node" "^8.0.7"
+
 date-now@^0.1.4:
   version "0.1.4"
   resolved "https://registry.yarnpkg.com/date-now/-/date-now-0.1.4.tgz#eaf439fd4d4848ad74e5cc7dbef200672b9e345b"
@@ -5543,24 +5278,24 @@ debug@2, debug@2.6.9, debug@^2.1.2, debug@^2.2.0, debug@^2.3.3, debug@^2.6.0, de
   dependencies:
     ms "2.0.0"
 
-debug@3.1.0, debug@=3.1.0, debug@~3.1.0:
+debug@3.1.0, debug@~3.1.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/debug/-/debug-3.1.0.tgz#5bb5a0672628b64149566ba16819e61518c67261"
   integrity sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==
   dependencies:
     ms "2.0.0"
 
-debug@^3, debug@^3.1.0, debug@^3.2.5:
-  version "3.2.6"
-  resolved "https://registry.yarnpkg.com/debug/-/debug-3.2.6.tgz#e83d17de16d8a7efb7717edbe5fb10135eee629b"
-  integrity sha512-mel+jf7nrtEl5Pn1Qx46zARXKDpBbvzezse7p7LqINmdoIk8PYP5SySaxEmYv6TZ0JyEKA1hsCId6DIhgITtWQ==
+debug@4, debug@^4.1.0, debug@~4.1.0:
+  version "4.1.1"
+  resolved "https://registry.yarnpkg.com/debug/-/debug-4.1.1.tgz#3b72260255109c6b589cee050f1d516139664791"
+  integrity sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==
   dependencies:
     ms "^2.1.1"
 
-debug@^4.1.0:
-  version "4.1.0"
-  resolved "https://registry.yarnpkg.com/debug/-/debug-4.1.0.tgz#373687bffa678b38b1cd91f861b63850035ddc87"
-  integrity sha512-heNPJUJIqC+xB6ayLAMHaIrmN9HKa7aQO8MGqKpvCA+uJYVcvR6l5kgdrhRuwPFHU7P5/A1w0BjByPHwpfTDKg==
+debug@^3, debug@^3.1.0, debug@^3.2.5, debug@^3.2.6:
+  version "3.2.6"
+  resolved "https://registry.yarnpkg.com/debug/-/debug-3.2.6.tgz#e83d17de16d8a7efb7717edbe5fb10135eee629b"
+  integrity sha512-mel+jf7nrtEl5Pn1Qx46zARXKDpBbvzezse7p7LqINmdoIk8PYP5SySaxEmYv6TZ0JyEKA1hsCId6DIhgITtWQ==
   dependencies:
     ms "^2.1.1"
 
@@ -5593,15 +5328,6 @@ decompress-tar@^3.0.0:
     through2 "^0.6.1"
     vinyl "^0.4.3"
 
-decompress-tar@^4.0.0, decompress-tar@^4.1.0, decompress-tar@^4.1.1:
-  version "4.1.1"
-  resolved "https://registry.yarnpkg.com/decompress-tar/-/decompress-tar-4.1.1.tgz#718cbd3fcb16209716e70a26b84e7ba4592e5af1"
-  integrity sha512-JdJMaCrGpB5fESVyxwpCx4Jdj2AagLmv3y58Qy4GE6HMVjWz1FeVQk1Ct4Kye7PftcdOo/7U7UKzYBJgqnGeUQ==
-  dependencies:
-    file-type "^5.2.0"
-    is-stream "^1.1.0"
-    tar-stream "^1.5.2"
-
 decompress-tarbz2@^3.0.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/decompress-tarbz2/-/decompress-tarbz2-3.1.0.tgz#8b23935681355f9f189d87256a0f8bdd96d9666d"
@@ -5615,17 +5341,6 @@ decompress-tarbz2@^3.0.0:
     through2 "^0.6.1"
     vinyl "^0.4.3"
 
-decompress-tarbz2@^4.0.0:
-  version "4.1.1"
-  resolved "https://registry.yarnpkg.com/decompress-tarbz2/-/decompress-tarbz2-4.1.1.tgz#3082a5b880ea4043816349f378b56c516be1a39b"
-  integrity sha512-s88xLzf1r81ICXLAVQVzaN6ZmX4A6U4z2nMbOwobxkLoIIfjVMBg7TeguTUXkKeXni795B6y5rnvDw7rxhAq9A==
-  dependencies:
-    decompress-tar "^4.1.0"
-    file-type "^6.1.0"
-    is-stream "^1.1.0"
-    seek-bzip "^1.0.5"
-    unbzip2-stream "^1.0.9"
-
 decompress-targz@^3.0.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/decompress-targz/-/decompress-targz-3.1.0.tgz#b2c13df98166268991b715d6447f642e9696f5a0"
@@ -5638,15 +5353,6 @@ decompress-targz@^3.0.0:
     through2 "^0.6.1"
     vinyl "^0.4.3"
 
-decompress-targz@^4.0.0:
-  version "4.1.1"
-  resolved "https://registry.yarnpkg.com/decompress-targz/-/decompress-targz-4.1.1.tgz#c09bc35c4d11f3de09f2d2da53e9de23e7ce1eee"
-  integrity sha512-4z81Znfr6chWnRDNfFNqLwPvm4db3WuZkqV+UgXQzSngG3CEKdBkw5jrv3axjjL96glyiiKjsxJG3X6WBZwX3w==
-  dependencies:
-    decompress-tar "^4.1.1"
-    file-type "^5.2.0"
-    is-stream "^1.1.0"
-
 decompress-unzip@^3.0.0:
   version "3.4.0"
   resolved "https://registry.yarnpkg.com/decompress-unzip/-/decompress-unzip-3.4.0.tgz#61475b4152066bbe3fee12f9d629d15fe6478eeb"
@@ -5660,16 +5366,6 @@ decompress-unzip@^3.0.0:
     vinyl "^1.0.0"
     yauzl "^2.2.1"
 
-decompress-unzip@^4.0.1:
-  version "4.0.1"
-  resolved "https://registry.yarnpkg.com/decompress-unzip/-/decompress-unzip-4.0.1.tgz#deaaccdfd14aeaf85578f733ae8210f9b4848f69"
-  integrity sha1-3qrM39FK6vhVePczroIQ+bSEj2k=
-  dependencies:
-    file-type "^3.8.0"
-    get-stream "^2.2.0"
-    pify "^2.3.0"
-    yauzl "^2.4.2"
-
 decompress@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/decompress/-/decompress-3.0.0.tgz#af1dd50d06e3bfc432461d37de11b38c0d991bed"
@@ -5685,20 +5381,6 @@ decompress@^3.0.0:
     vinyl-assign "^1.0.1"
     vinyl-fs "^2.2.0"
 
-decompress@^4.0.0:
-  version "4.2.0"
-  resolved "https://registry.yarnpkg.com/decompress/-/decompress-4.2.0.tgz#7aedd85427e5a92dacfe55674a7c505e96d01f9d"
-  integrity sha1-eu3YVCflqS2s/lVnSnxQXpbQH50=
-  dependencies:
-    decompress-tar "^4.0.0"
-    decompress-tarbz2 "^4.0.0"
-    decompress-targz "^4.0.0"
-    decompress-unzip "^4.0.1"
-    graceful-fs "^4.1.10"
-    make-dir "^1.0.0"
-    pify "^2.3.0"
-    strip-dirs "^2.0.0"
-
 deep-equal@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/deep-equal/-/deep-equal-1.0.1.tgz#f5d260292b660e084eff4cdbc9f08ad3247448b5"
@@ -5719,7 +5401,7 @@ deepmerge@^2.0.1:
   resolved "https://registry.yarnpkg.com/deepmerge/-/deepmerge-2.2.1.tgz#5d3ff22a01c00f645405a2fbc17d0778a1801170"
   integrity sha512-R9hc1Xa/NOBi9WRVUWg19rl1UB7Tt4kuPd+thNJgFZoxXsTz7ncaPaeIm+40oSGuP33DfMb4sZt1QIGiJzC4EA==
 
-define-properties@^1.1.1, define-properties@^1.1.2:
+define-properties@^1.1.1, define-properties@^1.1.2, define-properties@^1.1.3:
   version "1.1.3"
   resolved "https://registry.yarnpkg.com/define-properties/-/define-properties-1.1.3.tgz#cf88da6cbee26fe6db7094f61d870cbd84cee9f1"
   integrity sha512-3MqfYKj2lLzdMSf8ZIZE/V+Zuy+BgD6f164e8K2w7dgnpKArBDerGYpM46IYYcjnkdPNMjPk9A6VFB8+3SKlXQ==
@@ -5859,15 +5541,7 @@ detect-port-alt@1.1.6:
     address "^1.0.1"
     debug "^2.6.0"
 
-detect-port@^1.2.1:
-  version "1.2.3"
-  resolved "https://registry.yarnpkg.com/detect-port/-/detect-port-1.2.3.tgz#15bf49820d02deb84bfee0a74876b32d791bf610"
-  integrity sha512-IDbrX6PxqnYy8jV4wSHBaJlErYKTJvW8OQb9F7xivl1iQLqiUYHGa+nZ61Do6+N5uuOn/pReXKNqI9rUn04vug==
-  dependencies:
-    address "^1.0.1"
-    debug "^2.6.0"
-
-detect-port@^1.2.3:
+detect-port@^1.2.1, detect-port@^1.2.3:
   version "1.3.0"
   resolved "https://registry.yarnpkg.com/detect-port/-/detect-port-1.3.0.tgz#d9c40e9accadd4df5cac6a782aefd014d573d1f1"
   integrity sha512-E+B1gzkl2gqxt1IhUzwjrxBKRqx1UzC3WLONHinn8S3T6lwV/agVCyitiFOsGJ/eYuEUBvD71MZHy3Pv1G9doQ==
@@ -5911,7 +5585,7 @@ diffie-hellman@^5.0.0:
     miller-rabin "^4.0.0"
     randombytes "^2.0.0"
 
-dir-glob@^2.0.0:
+dir-glob@2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/dir-glob/-/dir-glob-2.0.0.tgz#0b205d2b6aef98238ca286598a8204d29d0a0034"
   integrity sha512-37qirFDz8cA5fimp9feo43fSuRo2gHwaIn6dXL8Ber1dGwUosDrGZeCCXq57WnIqE4aQ+u3eQZzsk1yOzhdwag==
@@ -5933,7 +5607,7 @@ doctrine@^2.0.0:
   dependencies:
     esutils "^2.0.2"
 
-dom-converter@~0.2:
+dom-converter@^0.2:
   version "0.2.0"
   resolved "https://registry.yarnpkg.com/dom-converter/-/dom-converter-0.2.0.tgz#6721a9daee2e293682955b6afe416771627bb768"
   integrity sha512-gd3ypIPfOMr9h5jIKq8E3sHOTCjeirnl0WK5ZdS1AW0Odt0b1PaWaHdJ4Qk4klv+YB9aJBS7mESXjFoDQPu6DA==
@@ -5941,17 +5615,19 @@ dom-converter@~0.2:
     utila "~0.4"
 
 dom-helpers@^3.2.0, dom-helpers@^3.2.1:
-  version "3.3.1"
-  resolved "https://registry.yarnpkg.com/dom-helpers/-/dom-helpers-3.3.1.tgz#fc1a4e15ffdf60ddde03a480a9c0fece821dd4a6"
-  integrity sha512-2Sm+JaYn74OiTM2wHvxJOo3roiq/h25Yi69Fqk269cNUwIXsCvATB6CRSFC9Am/20G2b28hGv/+7NiWydIrPvg==
+  version "3.4.0"
+  resolved "https://registry.yarnpkg.com/dom-helpers/-/dom-helpers-3.4.0.tgz#e9b369700f959f62ecde5a6babde4bccd9169af8"
+  integrity sha512-LnuPJ+dwqKDIyotW1VzmOZ5TONUN7CwkCR5hrgawTUbkBGYdeoNLZo6nNfGkCrjtE1nXXaj7iMMpDa8/d9WoIA==
+  dependencies:
+    "@babel/runtime" "^7.1.2"
 
 dom-serializer@0, dom-serializer@~0.1.0:
-  version "0.1.0"
-  resolved "https://registry.yarnpkg.com/dom-serializer/-/dom-serializer-0.1.0.tgz#073c697546ce0780ce23be4a28e293e40bc30c82"
-  integrity sha1-BzxpdUbOB4DOI75KKOKT5AvDDII=
+  version "0.1.1"
+  resolved "https://registry.yarnpkg.com/dom-serializer/-/dom-serializer-0.1.1.tgz#1ec4059e284babed36eec2941d4a970a189ce7c0"
+  integrity sha512-l0IU0pPzLWSHBcieZbpOKgkIn3ts3vAh7ZuFyXNwJxJXk/c4Gwj9xaTJwIDVQCXawWD0qb3IzMGH5rglQaO0XA==
   dependencies:
-    domelementtype "~1.1.1"
-    entities "~1.1.1"
+    domelementtype "^1.3.0"
+    entities "^1.1.1"
 
 dom-walk@^0.1.0:
   version "0.1.1"
@@ -5963,22 +5639,10 @@ domain-browser@^1.1.1:
   resolved "https://registry.yarnpkg.com/domain-browser/-/domain-browser-1.2.0.tgz#3d31f50191a6749dd1375a7f522e823d42e54eda"
   integrity sha512-jnjyiM6eRyZl2H+W8Q/zLMA481hzi0eszAaBUzIVnmYVDBbnLxVNnfu1HgEBvCbL+71FrxMl3E6lpKH7Ge3OXA==
 
-domelementtype@1, domelementtype@^1.3.0:
-  version "1.3.0"
-  resolved "https://registry.yarnpkg.com/domelementtype/-/domelementtype-1.3.0.tgz#b17aed82e8ab59e52dd9c19b1756e0fc187204c2"
-  integrity sha1-sXrtguirWeUt2cGbF1bg/BhyBMI=
-
-domelementtype@~1.1.1:
-  version "1.1.3"
-  resolved "https://registry.yarnpkg.com/domelementtype/-/domelementtype-1.1.3.tgz#bd28773e2642881aec51544924299c5cd822185b"
-  integrity sha1-vSh3PiZCiBrsUVRJJCmcXNgiGFs=
-
-domhandler@2.1:
-  version "2.1.0"
-  resolved "https://registry.yarnpkg.com/domhandler/-/domhandler-2.1.0.tgz#d2646f5e57f6c3bab11cf6cb05d3c0acf7412594"
-  integrity sha1-0mRvXlf2w7qxHPbLBdPArPdBJZQ=
-  dependencies:
-    domelementtype "1"
+domelementtype@1, domelementtype@^1.3.0, domelementtype@^1.3.1:
+  version "1.3.1"
+  resolved "https://registry.yarnpkg.com/domelementtype/-/domelementtype-1.3.1.tgz#d048c44b37b0d10a7f2a3d5fee3f4333d790481f"
+  integrity sha512-BSKB+TSpMpFI/HOxCNr1O8aMOTZ8hT3pM3GQ0w/mWRmkhEDSFJkkyzz4XQsBV44BChwGkrDfMyjVD0eA2aFV3w==
 
 domhandler@^2.3.0:
   version "2.4.2"
@@ -5992,13 +5656,6 @@ domready@^1.0.8:
   resolved "https://registry.yarnpkg.com/domready/-/domready-1.0.8.tgz#91f252e597b65af77e745ae24dd0185d5e26d58c"
   integrity sha1-kfJS5Ze2Wvd+dFriTdAYXV4m1Yw=
 
-domutils@1.1:
-  version "1.1.6"
-  resolved "https://registry.yarnpkg.com/domutils/-/domutils-1.1.6.tgz#bddc3de099b9a2efacc51c623f28f416ecc57485"
-  integrity sha1-vdw94Jm5ou+sxRxiPyj0FuzFdIU=
-  dependencies:
-    domelementtype "1"
-
 domutils@1.5.1:
   version "1.5.1"
   resolved "https://registry.yarnpkg.com/domutils/-/domutils-1.5.1.tgz#dcd8488a26f563d61079e48c9f7b7e32373682cf"
@@ -6072,23 +5729,6 @@ download@^4.0.0, download@^4.1.2:
     vinyl-fs "^2.2.0"
     ware "^1.2.0"
 
-download@^6.2.2:
-  version "6.2.5"
-  resolved "https://registry.yarnpkg.com/download/-/download-6.2.5.tgz#acd6a542e4cd0bb42ca70cfc98c9e43b07039714"
-  integrity sha512-DpO9K1sXAST8Cpzb7kmEhogJxymyVUd5qz/vCOSyvwtp2Klj2XcDt5YUuasgxka44SxF0q5RriKIwJmQHG2AuA==
-  dependencies:
-    caw "^2.0.0"
-    content-disposition "^0.5.2"
-    decompress "^4.0.0"
-    ext-name "^5.0.0"
-    file-type "5.2.0"
-    filenamify "^2.0.0"
-    get-stream "^3.0.0"
-    got "^7.0.0"
-    make-dir "^1.0.0"
-    p-event "^1.0.0"
-    pify "^3.0.0"
-
 duplexer2@0.0.2:
   version "0.0.2"
   resolved "https://registry.yarnpkg.com/duplexer2/-/duplexer2-0.0.2.tgz#c614dcf67e2fb14995a91711e5a617e8a60a31db"
@@ -6114,9 +5754,9 @@ duplexer@^0.1.1:
   integrity sha1-rOb/gIwc5mtX0ev5eXessCM0z8E=
 
 duplexify@^3.2.0, duplexify@^3.4.2, duplexify@^3.6.0:
-  version "3.6.0"
-  resolved "https://registry.yarnpkg.com/duplexify/-/duplexify-3.6.0.tgz#592903f5d80b38d037220541264d69a198fb3410"
-  integrity sha512-fO3Di4tBKJpYTFHAxTU00BcfWMY9w24r/x21a6rZRbsD/ToUgGxsMbiGRmB7uVAXeGKXD9MwiLZa5E97EVgIRQ==
+  version "3.7.1"
+  resolved "https://registry.yarnpkg.com/duplexify/-/duplexify-3.7.1.tgz#2a4df5317f6ccfd91f86d6fd25d8d8a103b88309"
+  integrity sha512-07z8uv2wMyS51kKhD1KsdXJg5WQ6t93RneqRxUHnskXVtlYYkLqM0gqStQZ3pj073g687jPCHrqNfCzawLYh5g==
   dependencies:
     end-of-stream "^1.0.0"
     inherits "^2.0.1"
@@ -6168,25 +5808,15 @@ ejs@^2.6.1:
   resolved "https://registry.yarnpkg.com/ejs/-/ejs-2.6.1.tgz#498ec0d495655abc6f23cd61868d926464071aa0"
   integrity sha512-0xy4A/twfrRCnkhfk8ErDi5DqdAsAqeGxht4xkCUrsvhhbQNs7E+4jV0CN7+NKIY0aHE72+XvqtBIXzD31ZbXQ==
 
-electron-to-chromium@^1.2.7, electron-to-chromium@^1.3.47:
-  version "1.3.79"
-  resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.3.79.tgz#774718f06284a4bf8f578ac67e74508fe659f13a"
-  integrity sha512-LQdY3j4PxuUl6xfxiFruTSlCniTrTrzAd8/HfsLEMi0PUpaQ0Iy+Pr4N4VllDYjs0Hyu2lkTbvzqlG+PX9NsNw==
-
-electron-to-chromium@^1.3.103:
+electron-to-chromium@^1.2.7, electron-to-chromium@^1.3.103, electron-to-chromium@^1.3.113, electron-to-chromium@^1.3.47:
   version "1.3.113"
   resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.3.113.tgz#b1ccf619df7295aea17bc6951dc689632629e4a9"
   integrity sha512-De+lPAxEcpxvqPTyZAXELNpRZXABRxf+uL/rSykstQhzj/B0l1150G/ExIIxKc16lI89Hgz81J0BHAcbTqK49g==
 
-electron-to-chromium@^1.3.62, electron-to-chromium@^1.3.86:
-  version "1.3.91"
-  resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.3.91.tgz#d74437a753b122aa6eca7c722055004d3627635d"
-  integrity sha512-wOWwM4vQpmb97VNkExnwE5e/sUMUb7NXurlEnhE89JOarUp6FOOMKjtTGgj9bmqskZkeRA7u+p0IztJ/y2OP5Q==
-
 element-resize-detector@^1.1.12:
-  version "1.1.14"
-  resolved "https://registry.yarnpkg.com/element-resize-detector/-/element-resize-detector-1.1.14.tgz#af064a0a618a820ad570a95c5eec5b77be0128c1"
-  integrity sha1-rwZKCmGKggrVcKlcXuxbd74BKME=
+  version "1.1.15"
+  resolved "https://registry.yarnpkg.com/element-resize-detector/-/element-resize-detector-1.1.15.tgz#48eba1a2eaa26969a4c998d972171128c971d8d2"
+  integrity sha512-16/5avDegXlUxytGgaumhjyQoM6hpp5j3+L79sYq5hlXfTNRy5WMMuTVWkZU3egp/CokCmTmvf18P3KeB57Iog==
   dependencies:
     batch-processor "^1.0.0"
 
@@ -6224,9 +5854,9 @@ emojis-list@^2.0.0:
   integrity sha1-TapNnbAPmBmIDHn6RXrlsJof04k=
 
 emotion-theming@^10.0.5:
-  version "10.0.6"
-  resolved "https://registry.yarnpkg.com/emotion-theming/-/emotion-theming-10.0.6.tgz#869f8d40e4f2549dbc165bd9c43bdf5fbedfeab8"
-  integrity sha512-GDCBkPjY2sIMh0KRtc/y8zsSLZfDdNJ8dWo+DjBGttTI62z/RgfP9qMYlQr43FPQ/FuOkbhXE3nsJJQfDA2tVA==
+  version "10.0.7"
+  resolved "https://registry.yarnpkg.com/emotion-theming/-/emotion-theming-10.0.7.tgz#0629740840f2ff6b929a7c3d52811187768e91c9"
+  integrity sha512-/dqXTvPA8pRQJRrW6/wpGqu0s0tmtwC27Pk0IOrxDV2F/knbKcd7J/G3T2385NjE+aJO4XJJ7JCNWQkwcjuX0Q==
   dependencies:
     "@emotion/weak-memoize" "0.2.2"
     hoist-non-react-statics "^2.3.1"
@@ -6251,10 +5881,10 @@ end-of-stream@^1.0.0, end-of-stream@^1.1.0:
   dependencies:
     once "^1.4.0"
 
-engine.io-client@~3.2.0:
-  version "3.2.1"
-  resolved "https://registry.yarnpkg.com/engine.io-client/-/engine.io-client-3.2.1.tgz#6f54c0475de487158a1a7c77d10178708b6add36"
-  integrity sha512-y5AbkytWeM4jQr7m/koQLc5AxpRKC1hEVUb/s1FUAWEJq5AzJJ4NLvzuKPuxtDi5Mq755WuDvZ6Iv2rXj4PTzw==
+engine.io-client@~3.3.1:
+  version "3.3.2"
+  resolved "https://registry.yarnpkg.com/engine.io-client/-/engine.io-client-3.3.2.tgz#04e068798d75beda14375a264bb3d742d7bc33aa"
+  integrity sha512-y0CPINnhMvPuwtqXfsGuWE8BB66+B6wTtCofQDRecMQPYX3MYUZXFNKDhdrSe3EVjgOu4V3rxdeqN/Tr91IgbQ==
   dependencies:
     component-emitter "1.2.1"
     component-inherit "0.0.3"
@@ -6264,32 +5894,32 @@ engine.io-client@~3.2.0:
     indexof "0.0.1"
     parseqs "0.0.5"
     parseuri "0.0.5"
-    ws "~3.3.1"
+    ws "~6.1.0"
     xmlhttprequest-ssl "~1.5.4"
     yeast "0.1.2"
 
 engine.io-parser@~2.1.0, engine.io-parser@~2.1.1:
-  version "2.1.2"
-  resolved "https://registry.yarnpkg.com/engine.io-parser/-/engine.io-parser-2.1.2.tgz#4c0f4cff79aaeecbbdcfdea66a823c6085409196"
-  integrity sha512-dInLFzr80RijZ1rGpx1+56/uFoH7/7InhH3kZt+Ms6hT8tNx3NGW/WNSA/f8As1WkOfkuyb3tnRyuXGxusclMw==
+  version "2.1.3"
+  resolved "https://registry.yarnpkg.com/engine.io-parser/-/engine.io-parser-2.1.3.tgz#757ab970fbf2dfb32c7b74b033216d5739ef79a6"
+  integrity sha512-6HXPre2O4Houl7c4g7Ic/XzPnHBvaEmN90vtRO9uLmwtRqQmTOw0QMevL1TOfL2Cpu1VzsaTmMotQgMdkzGkVA==
   dependencies:
     after "0.8.2"
     arraybuffer.slice "~0.0.7"
     base64-arraybuffer "0.1.5"
-    blob "0.0.4"
+    blob "0.0.5"
     has-binary2 "~1.0.2"
 
-engine.io@~3.2.0:
-  version "3.2.0"
-  resolved "https://registry.yarnpkg.com/engine.io/-/engine.io-3.2.0.tgz#54332506f42f2edc71690d2f2a42349359f3bf7d"
-  integrity sha512-mRbgmAtQ4GAlKwuPnnAvXXwdPhEx+jkc0OBCLrXuD/CRvwNK3AxRSnqK4FSqmAMRRHryVJP8TopOvmEaA64fKw==
+engine.io@~3.3.1:
+  version "3.3.2"
+  resolved "https://registry.yarnpkg.com/engine.io/-/engine.io-3.3.2.tgz#18cbc8b6f36e9461c5c0f81df2b830de16058a59"
+  integrity sha512-AsaA9KG7cWPXWHp5FvHdDWY3AMWeZ8x+2pUVLcn71qE5AtAzgGbxuclOytygskw8XGmiQafTmnI9Bix3uihu2w==
   dependencies:
     accepts "~1.3.4"
     base64id "1.0.0"
     cookie "0.3.1"
     debug "~3.1.0"
     engine.io-parser "~2.1.0"
-    ws "~3.3.1"
+    ws "~6.1.0"
 
 enhanced-resolve@^4.1.0:
   version "4.1.0"
@@ -6310,14 +5940,14 @@ enhanced-resolve@~0.9.0:
     tapable "^0.1.8"
 
 entities@^1.1.1, entities@~1.1.1:
-  version "1.1.1"
-  resolved "https://registry.yarnpkg.com/entities/-/entities-1.1.1.tgz#6e5c2d0a5621b5dadaecef80b90edfb5cd7772f0"
-  integrity sha1-blwtClYhtdra7O+AuQ7ftc13cvA=
+  version "1.1.2"
+  resolved "https://registry.yarnpkg.com/entities/-/entities-1.1.2.tgz#bdfa735299664dfafd34529ed4f8522a275fea56"
+  integrity sha512-f2LZMYl1Fzu7YSBKg+RoROelpOaNrcGmE9AZubeDfrCEia483oW4MI4VyFd5VNHIgQ/7qm1I0wUHK1eJnn2y2w==
 
 envinfo@^5.8.1:
-  version "5.10.0"
-  resolved "https://registry.yarnpkg.com/envinfo/-/envinfo-5.10.0.tgz#503a9774ae15b93ea68bdfae2ccd6306624ea6df"
-  integrity sha512-rXbzXWvnQxy+TcqZlARbWVQwgGVVouVJgFZhLVN5htjLxl1thstrP2ZGi0pXC309AbK7gVOPU+ulz/tmpCI7iw==
+  version "5.12.1"
+  resolved "https://registry.yarnpkg.com/envinfo/-/envinfo-5.12.1.tgz#83068c33e0972eb657d6bc69a6df30badefb46ef"
+  integrity sha512-pwdo0/G3CIkQ0y6PCXq4RdkvId2elvtPCJMG0konqlrfkWQbf1DWeH9K2b/cvu2YgGvPPTOnonZxXM1gikFu1w==
 
 eol@^0.8.1:
   version "0.8.1"
@@ -6357,18 +5987,19 @@ error-stack-parser@^2.0.0:
   dependencies:
     stackframe "^1.0.4"
 
-es-abstract@^1.10.0, es-abstract@^1.11.0, es-abstract@^1.12.0, es-abstract@^1.4.3, es-abstract@^1.5.1, es-abstract@^1.6.1, es-abstract@^1.7.0, es-abstract@^1.9.0:
-  version "1.12.0"
-  resolved "https://registry.yarnpkg.com/es-abstract/-/es-abstract-1.12.0.tgz#9dbbdd27c6856f0001421ca18782d786bf8a6165"
-  integrity sha512-C8Fx/0jFmV5IPoMOFPA9P9G5NtqW+4cOPit3MIuvR2t7Ag2K15EJTpxnHAYTzL+aYQJIESYeXZmDBfOBE1HcpA==
+es-abstract@^1.10.0, es-abstract@^1.11.0, es-abstract@^1.12.0, es-abstract@^1.4.3, es-abstract@^1.5.0, es-abstract@^1.5.1, es-abstract@^1.7.0, es-abstract@^1.9.0:
+  version "1.13.0"
+  resolved "https://registry.yarnpkg.com/es-abstract/-/es-abstract-1.13.0.tgz#ac86145fdd5099d8dd49558ccba2eaf9b88e24e9"
+  integrity sha512-vDZfg/ykNxQVwup/8E1BZhVzFfBxs9NqMzGcvIJrqg5k2/5Za2bWo40dK2J1pgLngZ7c+Shh8lwYtLGyrwPutg==
   dependencies:
-    es-to-primitive "^1.1.1"
+    es-to-primitive "^1.2.0"
     function-bind "^1.1.1"
-    has "^1.0.1"
-    is-callable "^1.1.3"
+    has "^1.0.3"
+    is-callable "^1.1.4"
     is-regex "^1.0.4"
+    object-keys "^1.0.12"
 
-es-to-primitive@^1.1.1:
+es-to-primitive@^1.2.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/es-to-primitive/-/es-to-primitive-1.2.0.tgz#edf72478033456e8dda8ef09e00ad9650707f377"
   integrity sha512-qZryBOJjV//LaxLTV6UC//WewneB3LcXOL9NP++ozKVXsIIIpm/2c13UDiD9Jp2eThsecw9m3jPqDwTyobcdbg==
@@ -6378,9 +6009,9 @@ es-to-primitive@^1.1.1:
     is-symbol "^1.0.2"
 
 es5-ext@^0.10.12, es5-ext@^0.10.35, es5-ext@^0.10.9, es5-ext@~0.10.14:
-  version "0.10.46"
-  resolved "https://registry.yarnpkg.com/es5-ext/-/es5-ext-0.10.46.tgz#efd99f67c5a7ec789baa3daa7f79870388f7f572"
-  integrity sha512-24XxRvJXNFwEMpJb3nOkiRJKRoupmjYmOPVlI65Qy2SrtxwOTB+g6ODjBKOtwEHbYrhWRty9xxOWLNdClT2djw==
+  version "0.10.48"
+  resolved "https://registry.yarnpkg.com/es5-ext/-/es5-ext-0.10.48.tgz#9a0b31eeded39e64453bcedf6f9d50bbbfb43850"
+  integrity sha512-CdRvPlX/24Mj5L4NVxTs4804sxiS2CjVprgCmrgoDkdmjdY4D+ySHa7K3jJf8R40dFg0tIm3z/dk326LrnuSGw==
   dependencies:
     es6-iterator "~2.0.3"
     es6-symbol "~3.1.1"
@@ -6406,14 +6037,9 @@ es6-promise@^3.0.2:
   integrity sha1-oIzd6EzNvzTQJ6FFG8kdS80ophM=
 
 es6-promise@^4.0.3, es6-promise@^4.1.0:
-  version "4.2.5"
-  resolved "https://registry.yarnpkg.com/es6-promise/-/es6-promise-4.2.5.tgz#da6d0d5692efb461e082c14817fe2427d8f5d054"
-  integrity sha512-n6wvpdE43VFtJq+lUDYDBFUwV8TZbuGXLV4D6wKafg13ldznKsyEvatubnmUe31zcvelSzOHF+XbaT+Bl9ObDg==
-
-es6-promise@~3.0.2:
-  version "3.0.2"
-  resolved "https://registry.yarnpkg.com/es6-promise/-/es6-promise-3.0.2.tgz#010d5858423a5f118979665f46486a95c6ee2bb6"
-  integrity sha1-AQ1YWEI6XxGJeWZfRkhqlcbuK7Y=
+  version "4.2.6"
+  resolved "https://registry.yarnpkg.com/es6-promise/-/es6-promise-4.2.6.tgz#b685edd8258886365ea62b57d30de28fadcd974f"
+  integrity sha512-aRVgGdnmW2OiySVPUC9e6m+plolMAJKjZnQlCwNSuK5yQ0JN61DZSO1X1Ufd1foqWRAlig0rhduTCHe7sVtK5Q==
 
 es6-promisify@^5.0.0:
   version "5.0.0"
@@ -6423,9 +6049,9 @@ es6-promisify@^5.0.0:
     es6-promise "^4.0.3"
 
 es6-shim@^0.35.3:
-  version "0.35.3"
-  resolved "https://registry.yarnpkg.com/es6-shim/-/es6-shim-0.35.3.tgz#9bfb7363feffff87a6cdb6cd93e405ec3c4b6f26"
-  integrity sha1-m/tzY/7//4emzbbNk+QF7DxLbyY=
+  version "0.35.4"
+  resolved "https://registry.yarnpkg.com/es6-shim/-/es6-shim-0.35.4.tgz#8d5a4109756383d3f0323421089c423acf8378f1"
+  integrity sha512-oJidbXjN/VWXZJs41E9JEqWzcFbjt43JupimIoVX82Thzt5qy1CiYezdhRmWkj3KOuwJ106IG/ZZrcFC6fgIUQ==
 
 es6-symbol@^3.1.1, es6-symbol@~3.1.1:
   version "3.1.1"
@@ -6454,9 +6080,9 @@ escape-string-regexp@1.0.5, escape-string-regexp@^1.0.2, escape-string-regexp@^1
   integrity sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ=
 
 escodegen@1.x.x:
-  version "1.11.0"
-  resolved "https://registry.npmjs.org/escodegen/-/escodegen-1.11.0.tgz#b27a9389481d5bfd5bec76f7bb1eb3f8f4556589"
-  integrity sha512-IeMV45ReixHS53K/OmfKAIztN/igDHzTJUhZM3k1jMhIZWjk45SMwAtBsEXiJp3vSPmTcu6CXn7mDvFHRN66fw==
+  version "1.11.1"
+  resolved "https://registry.yarnpkg.com/escodegen/-/escodegen-1.11.1.tgz#c485ff8d6b4cdb89e27f4a856e91f118401ca510"
+  integrity sha512-JwiqFD9KdGVVpeuRa68yU3zZnBEOcPs0nKW7wZzXky8Z7tffdYUHbe11bPCV5jYlK6DVdKLWLm0f5I/QlL0Kmw==
   dependencies:
     esprima "^3.1.3"
     estraverse "^4.2.0"
@@ -6466,9 +6092,9 @@ escodegen@1.x.x:
     source-map "~0.6.1"
 
 eslint-scope@^4.0.0:
-  version "4.0.0"
-  resolved "https://registry.yarnpkg.com/eslint-scope/-/eslint-scope-4.0.0.tgz#50bf3071e9338bcdc43331794a0cb533f0136172"
-  integrity sha512-1G6UTDi7Jc1ELFwnR58HV4fK9OQK4S6N985f166xqXxpjU6plxFISJa2Ba9KCQuFa8RCnj/lSFJbHo7UFDBnUA==
+  version "4.0.2"
+  resolved "https://registry.yarnpkg.com/eslint-scope/-/eslint-scope-4.0.2.tgz#5f10cd6cabb1965bf479fa65745673439e21cb0e"
+  integrity sha512-5q1+B/ogmHl8+paxtOKx38Z8LtWkVGuNt3+GQNErqwLl6ViNp/gdJGMCjZNxZ8j/VYjDNZ2Fo+eQc1TAVPIzbg==
   dependencies:
     esrecurse "^4.1.0"
     estraverse "^4.1.1"
@@ -6540,6 +6166,11 @@ events@^1.0.0:
   resolved "https://registry.yarnpkg.com/events/-/events-1.1.1.tgz#9ebdb7635ad099c70dcc4c2a1f5004288e8bd924"
   integrity sha1-nr23Y1rQmccNzEwqH1AEKI6L2SQ=
 
+events@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/events/-/events-3.0.0.tgz#9a0a0dfaf62893d92b875b8f2698ca4114973e88"
+  integrity sha512-Dc381HFWJzEOhQ+d8pkNon++bk9h6cdAoAj4iE6Q4y6xgTzySWXlKn05/TVNpjnfRqi/X0EpJEJohPjNI3zpVA==
+
 eventsource@0.1.6:
   version "0.1.6"
   resolved "https://registry.yarnpkg.com/eventsource/-/eventsource-0.1.6.tgz#0acede849ed7dd1ccc32c811bb11b944d4f29232"
@@ -6736,21 +6367,6 @@ express@^4.13.3, express@^4.14.0, express@^4.16.3:
     utils-merge "1.0.1"
     vary "~1.1.2"
 
-ext-list@^2.0.0:
-  version "2.2.2"
-  resolved "https://registry.yarnpkg.com/ext-list/-/ext-list-2.2.2.tgz#0b98e64ed82f5acf0f2931babf69212ef52ddd37"
-  integrity sha512-u+SQgsubraE6zItfVA0tBuCBhfU9ogSRnsvygI7wht9TS510oLkBRXBsqopeUG/GBOIQyKZO9wjTqIu/sf5zFA==
-  dependencies:
-    mime-db "^1.28.0"
-
-ext-name@^5.0.0:
-  version "5.0.0"
-  resolved "https://registry.yarnpkg.com/ext-name/-/ext-name-5.0.0.tgz#70781981d183ee15d13993c8822045c506c8f0a6"
-  integrity sha512-yblEwXAbGv1VQDmow7s38W77hzAgJAO50ztBLMcUyUBfxv1HC+LGwtiEN+Co6LtlqT/5uwVOxsD4TNIilWhwdQ==
-  dependencies:
-    ext-list "^2.0.0"
-    sort-keys-length "^1.0.0"
-
 extend-shallow@^2.0.1:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/extend-shallow/-/extend-shallow-2.0.1.tgz#51af7d614ad9a9f610ea1bafbb989d6b1c56890f"
@@ -6780,7 +6396,7 @@ external-editor@^2.0.4:
     iconv-lite "^0.4.17"
     tmp "^0.0.33"
 
-external-editor@^3.0.0:
+external-editor@^3.0.0, external-editor@^3.0.3:
   version "3.0.3"
   resolved "https://registry.yarnpkg.com/external-editor/-/external-editor-3.0.3.tgz#5866db29a97826dbe4bf3afd24070ead9ea43a27"
   integrity sha512-bn71H9+qWoOQKyZDo25mOMVpSmXROAsTJVVVYzrrtol3d4y+AsKjf4Iwl2Q+IuT0kFSQ1qo166UuIwqYq7mGnA==
@@ -6830,12 +6446,13 @@ extsprintf@^1.2.0:
   integrity sha1-4mifjzVvrWLMplo6kcXfX5VRaS8=
 
 fancy-log@^1.1.0:
-  version "1.3.2"
-  resolved "https://registry.yarnpkg.com/fancy-log/-/fancy-log-1.3.2.tgz#f41125e3d84f2e7d89a43d06d958c8f78be16be1"
-  integrity sha1-9BEl49hPLn2JpD0G2VjI94vha+E=
+  version "1.3.3"
+  resolved "https://registry.yarnpkg.com/fancy-log/-/fancy-log-1.3.3.tgz#dbc19154f558690150a23953a0adbd035be45fc7"
+  integrity sha512-k9oEhlyc0FrVh25qYuSELjr8oxsCoc4/LEZfg2iJJrfEk/tZL9bCoJE47gqAvI2m/AUjluCS4+3I0eTx8n3AEw==
   dependencies:
     ansi-gray "^0.1.1"
     color-support "^1.1.3"
+    parse-node-version "^1.0.0"
     time-stamp "^1.0.0"
 
 fast-deep-equal@^1.0.0:
@@ -6859,15 +6476,15 @@ fast-glob@^1.0.1:
     readdir-enhanced "^1.5.2"
 
 fast-glob@^2.0.2:
-  version "2.2.3"
-  resolved "https://registry.yarnpkg.com/fast-glob/-/fast-glob-2.2.3.tgz#d09d378e9ef6b0076a0fa1ba7519d9d4d9699c28"
-  integrity sha512-NiX+JXjnx43RzvVFwRWfPKo4U+1BrK5pJPsHQdKMlLoFHrrGktXglQhHliSihWAq+m1z6fHk3uwGHrtRbS9vLA==
+  version "2.2.6"
+  resolved "https://registry.yarnpkg.com/fast-glob/-/fast-glob-2.2.6.tgz#a5d5b697ec8deda468d85a74035290a025a95295"
+  integrity sha512-0BvMaZc1k9F+MeWWMe8pL6YltFzZYcJsYU7D4JyDA6PAczaXvxqQQ/z+mDF7/4Mw01DeUc+i3CTKajnkANkV4w==
   dependencies:
     "@mrmlnc/readdir-enhanced" "^2.2.1"
-    "@nodelib/fs.stat" "^1.0.1"
+    "@nodelib/fs.stat" "^1.1.2"
     glob-parent "^3.1.0"
     is-glob "^4.0.0"
-    merge2 "^1.2.1"
+    merge2 "^1.2.3"
     micromatch "^3.1.10"
 
 fast-json-stable-stringify@^2.0.0:
@@ -6888,9 +6505,9 @@ fast-url-parser@1.1.3:
     punycode "^1.3.2"
 
 fastparse@^1.1.1:
-  version "1.1.1"
-  resolved "https://registry.yarnpkg.com/fastparse/-/fastparse-1.1.1.tgz#d1e2643b38a94d7583b479060e6c4affc94071f8"
-  integrity sha1-0eJkOzipTXWDtHkGDmxK/8lAcfg=
+  version "1.1.2"
+  resolved "https://registry.yarnpkg.com/fastparse/-/fastparse-1.1.2.tgz#91728c5a5942eced8531283c79441ee4122c35a9"
+  integrity sha512-483XLLxTVIwWK3QTrMGRqUfUpoOs/0hbQrl2oz4J0pAcm3A3bu84wxTFqGqkJzewCLdME38xJLJAxBABfQT8sQ==
 
 fault@^1.0.2:
   version "1.0.2"
@@ -6940,7 +6557,7 @@ fd-slicer@~1.1.0:
   dependencies:
     pend "~1.2.0"
 
-figgy-pudding@^3.1.0, figgy-pudding@^3.5.1:
+figgy-pudding@^3.5.1:
   version "3.5.1"
   resolved "https://registry.yarnpkg.com/figgy-pudding/-/figgy-pudding-3.5.1.tgz#862470112901c727a0e495a80744bd5baa1d6790"
   integrity sha512-vNKxJHTEKNThjfrdJwHc7brvM6eVevuO5nTj6ez8ZQ1qbXTvGthucRF7S4vf2cr71QVnT70V34v0S1DyQsti0w==
@@ -6992,12 +6609,7 @@ file-system-cache@^1.0.5:
     fs-extra "^0.30.0"
     ramda "^0.21.0"
 
-file-type@5.2.0, file-type@^5.2.0:
-  version "5.2.0"
-  resolved "https://registry.yarnpkg.com/file-type/-/file-type-5.2.0.tgz#2ddbea7c73ffe36368dfae49dc338c058c2b8ad6"
-  integrity sha1-LdvqfHP/42No365J3DOMBYwritY=
-
-file-type@^3.1.0, file-type@^3.8.0:
+file-type@^3.1.0:
   version "3.9.0"
   resolved "https://registry.yarnpkg.com/file-type/-/file-type-3.9.0.tgz#257a078384d1db8087bc449d107d52a52672b9e9"
   integrity sha1-JXoHg4TR24CHvESdEH1SpSZyuek=
@@ -7007,16 +6619,6 @@ file-type@^4.1.0, file-type@^4.3.0:
   resolved "https://registry.yarnpkg.com/file-type/-/file-type-4.4.0.tgz#1b600e5fca1fbdc6e80c0a70c71c8dba5f7906c5"
   integrity sha1-G2AOX8ofvcboDApwxxyNul95BsU=
 
-file-type@^6.1.0:
-  version "6.2.0"
-  resolved "https://registry.yarnpkg.com/file-type/-/file-type-6.2.0.tgz#e50cd75d356ffed4e306dc4f5bcf52a79903a919"
-  integrity sha512-YPcTBDV+2Tm0VqjybVd32MHdlEGAtuxS3VAYsumFokDSMG+ROT5wawGlnHDoz7bfMcMDt9hxuXvXwoKUx2fkOg==
-
-file-type@^8.1.0:
-  version "8.1.0"
-  resolved "https://registry.yarnpkg.com/file-type/-/file-type-8.1.0.tgz#244f3b7ef641bbe0cca196c7276e4b332399f68c"
-  integrity sha512-qyQ0pzAy78gVoJsmYeNgl8uH8yKhr1lVhW7JbzJmnlRi0I4R2eEDEJZVKG8agpDnLpacwNbDhLNG/LMdxHD2YQ==
-
 file-uri-to-path@1:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/file-uri-to-path/-/file-uri-to-path-1.0.0.tgz#553a7b8446ff6f684359c445f1e37a05dacc33dd"
@@ -7032,11 +6634,6 @@ filename-reserved-regex@^1.0.0:
   resolved "https://registry.yarnpkg.com/filename-reserved-regex/-/filename-reserved-regex-1.0.0.tgz#e61cf805f0de1c984567d0386dc5df50ee5af7e4"
   integrity sha1-5hz4BfDeHJhFZ9A4bcXfUO5a9+Q=
 
-filename-reserved-regex@^2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/filename-reserved-regex/-/filename-reserved-regex-2.0.0.tgz#abf73dfab735d045440abfea2d91f389ebbfa229"
-  integrity sha1-q/c9+rc10EVECr/qLZHzieu/oik=
-
 filenamify@^1.0.1:
   version "1.2.1"
   resolved "https://registry.yarnpkg.com/filenamify/-/filenamify-1.2.1.tgz#a9f2ffd11c503bed300015029272378f1f1365a5"
@@ -7046,15 +6643,6 @@ filenamify@^1.0.1:
     strip-outer "^1.0.0"
     trim-repeated "^1.0.0"
 
-filenamify@^2.0.0:
-  version "2.1.0"
-  resolved "https://registry.yarnpkg.com/filenamify/-/filenamify-2.1.0.tgz#88faf495fb1b47abfd612300002a16228c677ee9"
-  integrity sha512-ICw7NTT6RsDp2rnYKVd8Fu4cr6ITzGy3+u4vUujPkabyaz+03F24NWEX7fs5fp+kBonlaqPH8fAO2NM+SXt/JA==
-  dependencies:
-    filename-reserved-regex "^2.0.0"
-    strip-outer "^1.0.0"
-    trim-repeated "^1.0.0"
-
 filesize@3.5.11:
   version "3.5.11"
   resolved "https://registry.yarnpkg.com/filesize/-/filesize-3.5.11.tgz#1919326749433bb3cf77368bd158caabcc19e9ee"
@@ -7108,15 +6696,6 @@ find-cache-dir@^0.1.1:
     mkdirp "^0.5.1"
     pkg-dir "^1.0.0"
 
-find-cache-dir@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/find-cache-dir/-/find-cache-dir-1.0.0.tgz#9288e3e9e3cc3748717d39eade17cf71fc30ee6f"
-  integrity sha1-kojj6ePMN0hxfTnq3hfPcfww7m8=
-  dependencies:
-    commondir "^1.0.1"
-    make-dir "^1.0.0"
-    pkg-dir "^2.0.0"
-
 find-cache-dir@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/find-cache-dir/-/find-cache-dir-2.0.0.tgz#4c1faed59f45184530fb9d7fa123a4d04a98472d"
@@ -7192,9 +6771,9 @@ findup-sync@^2.0.0:
     resolve-dir "^1.0.1"
 
 fined@^1.0.1:
-  version "1.1.0"
-  resolved "https://registry.yarnpkg.com/fined/-/fined-1.1.0.tgz#b37dc844b76a2f5e7081e884f7c0ae344f153476"
-  integrity sha1-s33IRLdqL15wgeiE98CuNE8VNHY=
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/fined/-/fined-1.1.1.tgz#95d88ff329123dd1a6950fdfcd321f746271e01f"
+  integrity sha512-jQp949ZmEbiYHk3gkbdtpJ0G1+kgtLQBNdP5edFP7Fh+WAYceLQz6yO1SBj72Xkg8GVyTB3bBzAYrHJVh5Xd5g==
   dependencies:
     expand-tilde "^2.0.2"
     is-plain-object "^2.0.3"
@@ -7208,9 +6787,9 @@ first-chunk-stream@^1.0.0:
   integrity sha1-Wb+1DNkF9g18OUzT2ayqtOatk04=
 
 flagged-respawn@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/flagged-respawn/-/flagged-respawn-1.0.0.tgz#4e79ae9b2eb38bf86b3bb56bf3e0a56aa5fcabd7"
-  integrity sha1-Tnmumy6zi/hrO7Vr8+ClaqX8q9c=
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/flagged-respawn/-/flagged-respawn-1.0.1.tgz#e7de6f1279ddd9ca9aac8a5971d618606b3aab41"
+  integrity sha512-lNaHNVymajmk0OJMBn8fVUAU1BtDeKIqKoVhk4xAALB57aALg6b4W0MfJ/cUE0g9YBXy5XhSlPIpYIJ7HaY/3Q==
 
 flat@^2.0.1:
   version "2.0.1"
@@ -7225,26 +6804,26 @@ flatten@^1.0.2:
   integrity sha1-2uRqnXj74lKSJYzB54CkHZXAN4I=
 
 flush-write-stream@^1.0.0:
-  version "1.0.3"
-  resolved "https://registry.yarnpkg.com/flush-write-stream/-/flush-write-stream-1.0.3.tgz#c5d586ef38af6097650b49bc41b55fabb19f35bd"
-  integrity sha512-calZMC10u0FMUqoiunI2AiGIIUtUIvifNwkHhNupZH4cbNnW1Itkoh/Nf5HFYmDrwWPjrUxpkZT0KhuCq0jmGw==
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/flush-write-stream/-/flush-write-stream-1.1.1.tgz#8dd7d873a1babc207d94ead0c2e0e44276ebf2e8"
+  integrity sha512-3Z4XhFZ3992uIq0XOqb9AreonueSYphE6oYbpt5+3u06JWklbsPkNv3ZKkP9Bz/r+1MWCaMoSQ28P85+1Yc77w==
   dependencies:
-    inherits "^2.0.1"
-    readable-stream "^2.0.4"
+    inherits "^2.0.3"
+    readable-stream "^2.3.6"
 
 focus-lock@^0.5.2:
-  version "0.5.3"
-  resolved "https://registry.yarnpkg.com/focus-lock/-/focus-lock-0.5.3.tgz#bf415da0dfa5f938674485eef36a1958250ce7d2"
-  integrity sha512-WtA68g+R1eiJ3X55DuicccBSar0FM5eXqdZaemL4wtf6OxrNH9yrrQRUWG+cuvV039gNQJVnIKtMeC470MURqw==
+  version "0.5.4"
+  resolved "https://registry.yarnpkg.com/focus-lock/-/focus-lock-0.5.4.tgz#537644d61b9e90fd97075aa680b8add1de24e819"
+  integrity sha512-A9ngdb0NyI6UygBQ0eD+p8SpLWTkdEDn67I3EGUUcDUfxH694mLA/xBWwhWhoj/2YLtsv2EoQdAx9UOKs8d/ZQ==
 
 follow-redirects@^1.0.0:
-  version "1.5.9"
-  resolved "https://registry.yarnpkg.com/follow-redirects/-/follow-redirects-1.5.9.tgz#c9ed9d748b814a39535716e531b9196a845d89c6"
-  integrity sha512-Bh65EZI/RU8nx0wbYF9shkFZlqLP+6WT/5FnA3cE/djNSuKNHJEinGGZgu/cQEkeeb2GdFOgenAmn8qaqYke2w==
+  version "1.7.0"
+  resolved "https://registry.yarnpkg.com/follow-redirects/-/follow-redirects-1.7.0.tgz#489ebc198dc0e7f64167bd23b03c4c19b5784c76"
+  integrity sha512-m/pZQy4Gj287eNy94nivy5wchN3Kp+Q5WgUPNy5lJSZ3sgkVKSYV/ZChMAQVIgx1SqfZ2zBZtPA2YlXIWxxJOQ==
   dependencies:
-    debug "=3.1.0"
+    debug "^3.2.6"
 
-for-each@^0.3.2:
+for-each@^0.3.3:
   version "0.3.3"
   resolved "https://registry.yarnpkg.com/for-each/-/for-each-0.3.3.tgz#69b447e88a0a5d32c3e7084f3f1710034b21376e"
   integrity sha512-jqYfLp7mo9vIyQf8ykW2v7A+2N4QjeCeI5+Dz9XraiO1ign81wjiH7Fb9vSOWvQfNtmSa4H2RoQTrrXivdUZmw==
@@ -7281,12 +6860,12 @@ forever-agent@~0.6.1:
   integrity sha1-+8cfDEGt6zf5bFd60e1C2P2sypE=
 
 form-data@~2.3.2:
-  version "2.3.2"
-  resolved "https://registry.yarnpkg.com/form-data/-/form-data-2.3.2.tgz#4970498be604c20c005d4f5c23aecd21d6b49099"
-  integrity sha1-SXBJi+YEwgwAXU9cI67NIda0kJk=
+  version "2.3.3"
+  resolved "https://registry.yarnpkg.com/form-data/-/form-data-2.3.3.tgz#dcce52c05f644f298c6a7ab936bd724ceffbf3a6"
+  integrity sha512-1lLKB2Mu3aGP1Q/2eCOx0fNbRMe7XdwktwOruhfqqd0rIJWwN4Dh+E3hrPSlDCXnSR7UtZ1N38rVXm+6+MEhJQ==
   dependencies:
     asynckit "^0.4.0"
-    combined-stream "1.0.6"
+    combined-stream "^1.0.6"
     mime-types "^2.1.12"
 
 format@^0.2.2:
@@ -7345,11 +6924,6 @@ fs-copy-file-sync@^1.1.1:
   resolved "https://registry.yarnpkg.com/fs-copy-file-sync/-/fs-copy-file-sync-1.1.1.tgz#11bf32c096c10d126e5f6b36d06eece776062918"
   integrity sha512-2QY5eeqVv4m2PfyMiEuy9adxNP+ajf+8AR05cEi+OAzPcOj90hvFImeZhTmKLBgSd9EvG33jsD7ZRxsx9dThkQ==
 
-fs-exists-cached@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/fs-exists-cached/-/fs-exists-cached-1.0.0.tgz#cf25554ca050dc49ae6656b41de42258989dcbce"
-  integrity sha1-zyVVTKBQ3EmuZla0HeQiWJidy84=
-
 fs-exists-sync@^0.1.0:
   version "0.1.0"
   resolved "https://registry.yarnpkg.com/fs-exists-sync/-/fs-exists-sync-0.1.0.tgz#982d6893af918e72d08dec9e8673ff2b5a8d6add"
@@ -7375,15 +6949,6 @@ fs-extra@^4.0.1:
     jsonfile "^4.0.0"
     universalify "^0.1.0"
 
-fs-extra@^7.0.0:
-  version "7.0.0"
-  resolved "https://registry.yarnpkg.com/fs-extra/-/fs-extra-7.0.0.tgz#8cc3f47ce07ef7b3593a11b9fb245f7e34c041d6"
-  integrity sha512-EglNDLRpmaTWiD/qraZn6HREAEAHJcJOmxNEYwq6xeMKnVMAy3GUcFB+wXt2C6k4CNvB/mP1y/U3dzvKKj5OtQ==
-  dependencies:
-    graceful-fs "^4.1.2"
-    jsonfile "^4.0.0"
-    universalify "^0.1.0"
-
 fs-extra@^7.0.1:
   version "7.0.1"
   resolved "https://registry.yarnpkg.com/fs-extra/-/fs-extra-7.0.1.tgz#4f189c44aa123b895f722804f55ea23eadc348e9"
@@ -7420,10 +6985,10 @@ fs.realpath@^1.0.0:
   resolved "https://registry.yarnpkg.com/fs.realpath/-/fs.realpath-1.0.0.tgz#1504ad2523158caa40db4a2787cb01411994ea4f"
   integrity sha1-FQStJSMVjKpA20onh8sBQRmU6k8=
 
-fsevents@^1.0.0, fsevents@^1.2.2:
-  version "1.2.4"
-  resolved "https://registry.yarnpkg.com/fsevents/-/fsevents-1.2.4.tgz#f41dcb1af2582af3692da36fc55cbd8e1041c426"
-  integrity sha512-z8H8/diyk76B7q5wg+Ud0+CqzcAF3mBBI/bA5ne5zrRUUIvNkJY//D3BqyH571KuAC4Nr7Rw7CjWX4r0y9DvNg==
+fsevents@^1.0.0, fsevents@^1.2.7:
+  version "1.2.7"
+  resolved "https://registry.yarnpkg.com/fsevents/-/fsevents-1.2.7.tgz#4851b664a3783e52003b3c66eb0eee1074933aa4"
+  integrity sha512-Pxm6sI2MeBD7RdD12RYsqaP0nMiwx8eZBXCa6z2L+mRHm2DYrOYwihmhjpkdjUHwQhslWQjRpEgNq4XvBmaAuw==
   dependencies:
     nan "^2.9.2"
     node-pre-gyp "^0.10.0"
@@ -7436,7 +7001,7 @@ ftp@~0.3.10:
     readable-stream "1.1.x"
     xregexp "2.0.0"
 
-function-bind@^1.0.2, function-bind@^1.1.0, function-bind@^1.1.1:
+function-bind@^1.0.2, function-bind@^1.1.1:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/function-bind/-/function-bind-1.1.1.tgz#a56899d3ea3c9bab874bb9773b7c5ede92f4895d"
   integrity sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A==
@@ -7550,28 +7115,6 @@ gatsby-plugin-sharp@^1.6.48:
     sharp "^0.20.0"
     svgo "^0.7.2"
 
-gatsby-plugin-sharp@^2.0.12:
-  version "2.0.12"
-  resolved "https://registry.yarnpkg.com/gatsby-plugin-sharp/-/gatsby-plugin-sharp-2.0.12.tgz#c791b29f153e481b8287605bf171331daaba7cb8"
-  integrity sha512-E3LmPQVY7n27oiWJRvw+C1V9ijR9V3Y2xBl9dFL3NoueLyZmlk0hFRG8gTpCr9e3va04b+tV33mATetcy7mLHw==
-  dependencies:
-    "@babel/runtime" "^7.0.0"
-    async "^2.1.2"
-    bluebird "^3.5.0"
-    fs-exists-cached "^1.0.0"
-    fs-extra "^7.0.0"
-    imagemin "^6.0.0"
-    imagemin-mozjpeg "^7.0.0"
-    imagemin-pngquant "^6.0.0"
-    imagemin-webp "^4.1.0"
-    lodash "^4.17.10"
-    mini-svg-data-uri "^1.0.0"
-    potrace "^2.1.1"
-    probe-image-size "^4.0.0"
-    progress "^1.1.8"
-    sharp "^0.21.0"
-    svgo "^0.7.2"
-
 gatsby-react-router-scroll@^1.0.18:
   version "1.0.18"
   resolved "https://registry.yarnpkg.com/gatsby-react-router-scroll/-/gatsby-react-router-scroll-1.0.18.tgz#616ffb801dbdbe4598611e2ff3861b91ac3eecbf"
@@ -7835,32 +7378,17 @@ get-proxy@^1.0.1:
   dependencies:
     rc "^1.1.2"
 
-get-proxy@^2.0.0:
-  version "2.1.0"
-  resolved "https://registry.yarnpkg.com/get-proxy/-/get-proxy-2.1.0.tgz#349f2b4d91d44c4d4d4e9cba2ad90143fac5ef93"
-  integrity sha512-zmZIaQTWnNQb4R4fJUEp/FC51eZsc6EkErspy3xtIYStaq8EB/hDIWipxsal+E8rz0qD7f2sL/NA9Xee4RInJw==
-  dependencies:
-    npm-conf "^1.1.0"
-
 get-stdin@^4.0.1:
   version "4.0.1"
   resolved "https://registry.yarnpkg.com/get-stdin/-/get-stdin-4.0.1.tgz#b968c6b0a04384324902e8bf1a5df32579a450fe"
   integrity sha1-uWjGsKBDhDJJAui/Gl3zJXmkUP4=
 
-get-stream@^2.2.0:
-  version "2.3.1"
-  resolved "https://registry.yarnpkg.com/get-stream/-/get-stream-2.3.1.tgz#5f38f93f346009666ee0150a054167f91bdd95de"
-  integrity sha1-Xzj5PzRgCWZu4BUKBUFn+Rvdld4=
-  dependencies:
-    object-assign "^4.0.1"
-    pinkie-promise "^2.0.0"
-
 get-stream@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/get-stream/-/get-stream-3.0.0.tgz#8e943d1358dc37555054ecbe2edb05aa174ede14"
   integrity sha1-jpQ9E1jcN1VQVOy+LtsFqhdO3hQ=
 
-get-uri@2.0.2, get-uri@^2.0.0:
+get-uri@2.0.2:
   version "2.0.2"
   resolved "https://registry.yarnpkg.com/get-uri/-/get-uri-2.0.2.tgz#5c795e71326f6ca1286f2fc82575cd2bab2af578"
   integrity sha512-ZD325dMZOgerGqF/rF6vZXyFGTAay62svjQIT+X/oU2PtxYpFxvSkbsdi+oxIrsNxlZVd4y8wUDqkaExWTI/Cw==
@@ -7872,6 +7400,18 @@ get-uri@2.0.2, get-uri@^2.0.0:
     ftp "~0.3.10"
     readable-stream "2"
 
+get-uri@^2.0.0:
+  version "2.0.3"
+  resolved "https://registry.yarnpkg.com/get-uri/-/get-uri-2.0.3.tgz#fa13352269781d75162c6fc813c9e905323fbab5"
+  integrity sha512-x5j6Ks7FOgLD/GlvjKwgu7wdmMR55iuRHhn8hj/+gA+eSbxQvZ+AEomq+3MgVEZj1vpi738QahGbCCSIDtXtkw==
+  dependencies:
+    data-uri-to-buffer "2"
+    debug "4"
+    extend "~3.0.2"
+    file-uri-to-path "1"
+    ftp "~0.3.10"
+    readable-stream "3"
+
 get-value@^2.0.3, get-value@^2.0.6:
   version "2.0.6"
   resolved "https://registry.yarnpkg.com/get-value/-/get-value-2.0.6.tgz#dc15ca1c672387ca76bd37ac0a395ba2042a2c28"
@@ -7890,9 +7430,9 @@ github-from-package@0.0.0:
   integrity sha1-l/tdlr/eiXMxPyDoKI75oWf6ZM4=
 
 github-slugger@^1.1.1:
-  version "1.2.0"
-  resolved "https://registry.yarnpkg.com/github-slugger/-/github-slugger-1.2.0.tgz#8ada3286fd046d8951c3c952a8d7854cfd90fd9a"
-  integrity sha512-wIaa75k1vZhyPm9yWrD08A5Xnx/V+RmzGrpjQuLemGKSb77Qukiaei58Bogrl/LZSADDfPzKJX8jhLs4CRTl7Q==
+  version "1.2.1"
+  resolved "https://registry.yarnpkg.com/github-slugger/-/github-slugger-1.2.1.tgz#47e904e70bf2dccd0014748142d31126cfd49508"
+  integrity sha512-SsZUjg/P03KPzQBt7OxJPasGw6NRO5uOgiZ5RGXVud5iSIZ0eNZeNp5rTwCxtavrRUa/A77j8mePVc5lEvk0KQ==
   dependencies:
     emoji-regex ">=6.0.0 <=6.1.1"
 
@@ -7976,7 +7516,7 @@ glob@^6.0.1:
 
 glob@^7.0.0, glob@^7.0.3, glob@^7.0.5, glob@^7.1.1, glob@^7.1.2, glob@^7.1.3:
   version "7.1.3"
-  resolved "https://registry.npmjs.org/glob/-/glob-7.1.3.tgz#3960832d3f1574108342dafd3a67b332c0969df1"
+  resolved "https://registry.yarnpkg.com/glob/-/glob-7.1.3.tgz#3960832d3f1574108342dafd3a67b332c0969df1"
   integrity sha512-vcfuiIxogLV4DlGBHIUOwI0IbrJ8HWPc4MU7HzviGeNho/UJDfi6B5p3sHeWIQ0KGIU0Jpxi5ZHxemQfLkkAwQ==
   dependencies:
     fs.realpath "^1.0.0"
@@ -8002,6 +7542,13 @@ global-modules@1.0.0, global-modules@^1.0.0:
     is-windows "^1.0.1"
     resolve-dir "^1.0.0"
 
+global-modules@2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/global-modules/-/global-modules-2.0.0.tgz#997605ad2345f27f51539bea26574421215c7780"
+  integrity sha512-NGbfmJBp9x8IxyJSd1P+otYK8vonoJactOogrVfFRIAEY1ukil8RSKDz2Yo7wh1oihl51l/r6W4epkeKJHqL8A==
+  dependencies:
+    global-prefix "^3.0.0"
+
 global-modules@^0.2.3:
   version "0.2.3"
   resolved "https://registry.yarnpkg.com/global-modules/-/global-modules-0.2.3.tgz#ea5a3bed42c6d6ce995a4f8a1269b5dae223828d"
@@ -8031,6 +7578,15 @@ global-prefix@^1.0.1:
     is-windows "^1.0.1"
     which "^1.2.14"
 
+global-prefix@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/global-prefix/-/global-prefix-3.0.0.tgz#fc85f73064df69f50421f47f883fe5b913ba9b97"
+  integrity sha512-awConJSVCHVGND6x3tmMaKcQvwXLhjdkmomy2W+Goaui8YPgYgXJZewhg3fWC+DlfqqQuWg8AwqjGTD2nAPVWg==
+  dependencies:
+    ini "^1.3.5"
+    kind-of "^6.0.2"
+    which "^1.3.1"
+
 global@^4.3.0, global@^4.3.2, global@~4.3.0:
   version "4.3.2"
   resolved "https://registry.yarnpkg.com/global/-/global-4.3.2.tgz#e76989268a6c74c38908b1305b10fc0e394e9d0f"
@@ -8040,22 +7596,22 @@ global@^4.3.0, global@^4.3.2, global@~4.3.0:
     process "~0.5.1"
 
 globals@^11.1.0:
-  version "11.9.0"
-  resolved "https://registry.yarnpkg.com/globals/-/globals-11.9.0.tgz#bde236808e987f290768a93d065060d78e6ab249"
-  integrity sha512-5cJVtyXWH8PiJPVLZzzoIizXx944O4OmRro5MWKx5fT4MgcN7OfaMutPeaTdJCCURwbWdhhcCWcKIffPnmTzBg==
+  version "11.11.0"
+  resolved "https://registry.yarnpkg.com/globals/-/globals-11.11.0.tgz#dcf93757fa2de5486fbeed7118538adf789e9c2e"
+  integrity sha512-WHq43gS+6ufNOEqlrDBxVEbb8ntfXrfAUU2ZOpCxrBdGKW3gyv8mCxAfIBD0DroPKGrJ2eSsXsLtY9MPntsyTw==
 
 globals@^9.18.0:
   version "9.18.0"
   resolved "https://registry.yarnpkg.com/globals/-/globals-9.18.0.tgz#aa3896b3e69b487f17e31ed2143d69a8e30c2d8a"
   integrity sha512-S0nG3CLEQiY/ILxqtztTWH/3iRRdyBLw6KMDxnKMchrtbj2OFmehVh0WUCfW3DUrIgx/qFrJPICrq4Z4sTR9UQ==
 
-globby@8.0.1, globby@^8.0.1:
-  version "8.0.1"
-  resolved "https://registry.yarnpkg.com/globby/-/globby-8.0.1.tgz#b5ad48b8aa80b35b814fc1281ecc851f1d2b5b50"
-  integrity sha512-oMrYrJERnKBLXNLVTqhm3vPEdJ/b2ZE28xN4YARiix1NOIOBPEpOUnm844K1iu/BkphCaf2WNFwMszv8Soi1pw==
+globby@8.0.2:
+  version "8.0.2"
+  resolved "https://registry.yarnpkg.com/globby/-/globby-8.0.2.tgz#5697619ccd95c5275dbb2d6faa42087c1a941d8d"
+  integrity sha512-yTzMmKygLp8RUpG1Ymu2VXPSJQZjNAZPD4ywgYEaG7e4tBJeUQBO8OpXrf1RCNcEs5alsoJYPAMiIHP0cmeC7w==
   dependencies:
     array-union "^1.0.1"
-    dir-glob "^2.0.0"
+    dir-glob "2.0.0"
     fast-glob "^2.0.2"
     glob "^7.1.2"
     ignore "^3.3.5"
@@ -8074,9 +7630,9 @@ globby@^6.1.0:
     pinkie-promise "^2.0.0"
 
 glogg@^1.0.0:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/glogg/-/glogg-1.0.1.tgz#dcf758e44789cc3f3d32c1f3562a3676e6a34810"
-  integrity sha512-ynYqXLoluBKf9XGR1gA59yEJisIL7YHEH4xr3ZziHB5/yl4qWfaK8Js9jGe6gBGCSCKVqiyO30WnRZADvemUNw==
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/glogg/-/glogg-1.0.2.tgz#2d7dd702beda22eb3bffadf880696da6d846313f"
+  integrity sha512-5mwUoSuBk44Y4EshyiqcH95ZntbDdTQqA3QYSrxmzj28Ai0vXBGMH1ApSANH14j2sIRtqCEyg6PfsuP7ElOEDA==
   dependencies:
     sparkles "^1.0.0"
 
@@ -8125,7 +7681,7 @@ got@^6.7.1:
     unzip-response "^2.0.1"
     url-parse-lax "^1.0.0"
 
-got@^7.0.0, got@^7.1.0:
+got@^7.1.0:
   version "7.1.0"
   resolved "https://registry.yarnpkg.com/got/-/got-7.1.0.tgz#05450fd84094e6bbea56f451a43a9c289166385a"
   integrity sha512-Y5WMo7xKKq1muPsxD+KmrR8DH5auG7fBdDVueZwETwV6VytKyU9OX/ddpq2/1hp1vIPvVb4T81dKQz3BivkNLw==
@@ -8145,12 +7701,7 @@ got@^7.0.0, got@^7.1.0:
     url-parse-lax "^1.0.0"
     url-to-options "^1.0.1"
 
-graceful-fs@^4.0.0, graceful-fs@^4.1.10, graceful-fs@^4.1.11, graceful-fs@^4.1.2, graceful-fs@^4.1.3, graceful-fs@^4.1.4, graceful-fs@^4.1.6:
-  version "4.1.11"
-  resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.1.11.tgz#0e8bdfe4d1ddb8854d64e04ea7c00e2a026e5658"
-  integrity sha1-Dovf5NHduIVNZOBOp8AOKgJuVlg=
-
-graceful-fs@^4.1.9:
+graceful-fs@^4.0.0, graceful-fs@^4.1.11, graceful-fs@^4.1.15, graceful-fs@^4.1.2, graceful-fs@^4.1.3, graceful-fs@^4.1.4, graceful-fs@^4.1.6, graceful-fs@^4.1.9:
   version "4.1.15"
   resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.1.15.tgz#ffb703e1066e8a0eeaa4c8b80ba9253eeefbfb00"
   integrity sha512-6uHUhOPEBgQ24HM+r6b/QwWfZq+yiFcipKFrOFiBEnWdy5sdzYoi+pJeQaPI5qOLRFqWmAXUPQNsielzdLoecA==
@@ -8161,11 +7712,11 @@ graceful-fs@^4.1.9:
   integrity sha1-TK+tdrxi8C+gObL5Tpo906ORpyU=
 
 graphlib@^2.1.1, graphlib@^2.1.5:
-  version "2.1.5"
-  resolved "https://registry.yarnpkg.com/graphlib/-/graphlib-2.1.5.tgz#6afe1afcc5148555ec799e499056795bd6938c87"
-  integrity sha512-XvtbqCcw+EM5SqQrIetIKKD+uZVNQtDPD1goIg7K73RuRZtVI5rYMdcCVSHm/AS1sCBZ7vt0p5WgXouucHQaOA==
+  version "2.1.7"
+  resolved "https://registry.yarnpkg.com/graphlib/-/graphlib-2.1.7.tgz#b6a69f9f44bd9de3963ce6804a2fc9e73d86aecc"
+  integrity sha512-TyI9jIy2J4j0qgPmOOrHTCtpPqJGN/aurBwc6ZT+bRii+di1I+Wv3obRhVrmBEXet+qkMaEX67dXrwsd3QQM6w==
   dependencies:
-    lodash "^4.11.1"
+    lodash "^4.17.5"
 
 graphql-relay@^0.5.1:
   version "0.5.5"
@@ -8285,11 +7836,11 @@ har-schema@^2.0.0:
   integrity sha1-qUwiJOvKwEeCoNkDVSHyRzW37JI=
 
 har-validator@~5.1.0:
-  version "5.1.0"
-  resolved "https://registry.yarnpkg.com/har-validator/-/har-validator-5.1.0.tgz#44657f5688a22cfd4b72486e81b3a3fb11742c29"
-  integrity sha512-+qnmNjI4OfH2ipQ9VQOw23bBd/ibtfbVdK2fYbY4acTDqKTW/YDp9McimZdDbG8iV9fZizUqQMD5xvriB146TA==
+  version "5.1.3"
+  resolved "https://registry.yarnpkg.com/har-validator/-/har-validator-5.1.3.tgz#1ef89ebd3e4996557675eed9893110dc350fa080"
+  integrity sha512-sNvOCzEQNr/qrvJgc3UG/kD4QtlHycrzwS+6mfTrrSq97BvaYcPZZI1ZSqGSPR73Cxn4LKTD4PttRwfU7jWq5g==
   dependencies:
-    ajv "^5.3.0"
+    ajv "^6.5.5"
     har-schema "^2.0.0"
 
 has-ansi@^2.0.0:
@@ -8381,7 +7932,7 @@ has-values@^1.0.0:
     is-number "^3.0.0"
     kind-of "^4.0.0"
 
-has@^1.0.1:
+has@^1.0.1, has@^1.0.3:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/has/-/has-1.0.3.tgz#722d7cbfc1f6aa8241f16dd814e011e1f41e8796"
   integrity sha512-f2dvO0VU6Oej7RkWJGrehjbzMAjFp5/VKPp5tTpWIV4JHHZK1/BxbFRtf/siA2SWTe09caDmVtYYzWEIbBS4zw==
@@ -8397,9 +7948,9 @@ hash-base@^3.0.0:
     safe-buffer "^5.0.1"
 
 hash.js@^1.0.0, hash.js@^1.0.3:
-  version "1.1.5"
-  resolved "https://registry.yarnpkg.com/hash.js/-/hash.js-1.1.5.tgz#e38ab4b85dfb1e0c40fe9265c0e9b54854c23812"
-  integrity sha512-eWI5HG9Np+eHV1KQhisXWwM+4EPPYe5dFX1UZZH7k/E3JzDEazVH+VGlZi6R94ZqImq+A3D1mCEtrFIfg/E7sA==
+  version "1.1.7"
+  resolved "https://registry.yarnpkg.com/hash.js/-/hash.js-1.1.7.tgz#0babca538e8d4ee4a0f8988d68866537a003cf42"
+  integrity sha512-taOaskGt4z4SOANNseOviYDvjEJinIkRgmp7LbKP2YTTmVxWBl87s/uzK9r+44BclBSp2X7K1hqeNfz9JbBeXA==
   dependencies:
     inherits "^2.0.3"
     minimalistic-assert "^1.0.1"
@@ -8439,16 +7990,11 @@ hast-util-from-parse5@^5.0.0:
     xtend "^4.0.1"
 
 hast-util-is-element@^1.0.0:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/hast-util-is-element/-/hast-util-is-element-1.0.1.tgz#c76e8aafbdb6e5c83265bf50324e2f2e024eb12a"
-  integrity sha512-s/ggaNehYVqmLgTXEv12Lbb72bsOD2r5DhAqPgtDdaI/YFNXVzz0zHFVJnhjIjn7Nak8GbL4nzT2q0RA5div+A==
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/hast-util-is-element/-/hast-util-is-element-1.0.2.tgz#c23c9428b6a5a4e323bf9e16f87417476314981b"
+  integrity sha512-4MEtyofNi3ZunPFrp9NpTQdNPN24xvLX3M+Lr/RGgPX6TLi+wR4/DqeoyQ7lwWcfUp4aevdt4RR0r7ZQPFbHxw==
 
-hast-util-parse-selector@^2.0.0:
-  version "2.2.0"
-  resolved "https://registry.yarnpkg.com/hast-util-parse-selector/-/hast-util-parse-selector-2.2.0.tgz#2175f18cdd697308fc3431d5c29a9e48dfa4817a"
-  integrity sha512-trw0pqZN7+sH9k7hPWCJNZUbWW2KroSIM/XpIy3G5ZMtx9LSabCyoSp4skJZ4q/eZ5UOBPtvWh4W9c+RE3HRoQ==
-
-hast-util-parse-selector@^2.2.0:
+hast-util-parse-selector@^2.0.0, hast-util-parse-selector@^2.2.0:
   version "2.2.1"
   resolved "https://registry.yarnpkg.com/hast-util-parse-selector/-/hast-util-parse-selector-2.2.1.tgz#4ddbae1ae12c124e3eb91b581d2556441766f0ab"
   integrity sha512-Xyh0v+nHmQvrOqop2Jqd8gOdyQtE8sIP9IQf7mlVDqp924W4w/8Liuguk2L2qei9hARnQSG2m+wAOCxM7npJVw==
@@ -8495,9 +8041,9 @@ hast-util-to-parse5@^2.0.0:
     zwitch "^1.0.0"
 
 hast-util-whitespace@^1.0.0:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/hast-util-whitespace/-/hast-util-whitespace-1.0.1.tgz#d67da2c87637b1ce1d85dd15b270ba057930149a"
-  integrity sha512-Mfx2ZnmVMTAopZ8as42nKrNt650tCZYhy/MPeO1Imdg/cmCWK6GUSnFrrE3ezGjVifn7x5zMfu8jrjwIGyImSw==
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/hast-util-whitespace/-/hast-util-whitespace-1.0.2.tgz#c97153a3fbc9091a14fd823830a47724e7a1da99"
+  integrity sha512-4JT8B0HKPHBMFZdDQzexjxwhKx9TrpV/+uelvmqlPu8RqqDrnNIEHDtDZCmgE+4YmcFAtKVPLmnY3dQGRaN53A==
 
 hastscript@^3.0.0:
   version "3.1.0"
@@ -8526,9 +8072,9 @@ he@1.2.x:
   integrity sha512-F/1DnUGPopORZi0ni+CvrCgHQ5FyEAHRLSApuYWMmrbSwoN2Mn/7k+Gl38gJnR7yyDZk6WLXwiGod1JOWNDKGw==
 
 highlight.js@^9.14.2:
-  version "9.14.2"
-  resolved "https://registry.yarnpkg.com/highlight.js/-/highlight.js-9.14.2.tgz#efbfb22dc701406e4da406056ef8c2b70ebe5b26"
-  integrity sha512-Nc6YNECYpxyJABGYJAyw7dBAYbXEuIzwzkqoJnwbc1nIpCiN+3ioYf0XrBnLiyyG0JLuJhpPtt2iTSbXiKLoyA==
+  version "9.15.6"
+  resolved "https://registry.yarnpkg.com/highlight.js/-/highlight.js-9.15.6.tgz#72d4d8d779ec066af9a17cb14360c3def0aa57c4"
+  integrity sha512-zozTAWM1D6sozHo8kqhfYgsac+B+q0PmsjXeyDrYIHHcBN0zTVT66+s2GW1GZv7DbyaROdLXKdabwS/WqPyIdQ==
 
 highlight.js@~9.12.0:
   version "9.12.0"
@@ -8562,16 +8108,9 @@ hoek@4.x.x:
 
 hoist-non-react-statics@^2.3.1, hoist-non-react-statics@^2.5.0:
   version "2.5.5"
-  resolved "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-2.5.5.tgz#c5903cf409c0dfd908f388e619d86b9c1174cb47"
+  resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-2.5.5.tgz#c5903cf409c0dfd908f388e619d86b9c1174cb47"
   integrity sha512-rqcy4pJo55FTTLWt+bU8ukscqHeE/e9KWvsOW2b/a3afxQZhwkQdT1rPPCJ0rYXdj4vNcasY8zHTH+jF/qStxw==
 
-hoist-non-react-statics@^3.0.0:
-  version "3.3.0"
-  resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-3.3.0.tgz#b09178f0122184fb95acf525daaecb4d8f45958b"
-  integrity sha512-0XsbTXxgiaCDYDIWFcwkmerZPSwywfUqYmwT4jzewKTQSWoE6FCMoUVOeBJWK3E/CrWbxRG3m5GzY4lnIwGRBA==
-  dependencies:
-    react-is "^16.7.0"
-
 home-or-tmp@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/home-or-tmp/-/home-or-tmp-2.0.0.tgz#e36c3f2d2cae7d746a857e38d18d5f32a7882db8"
@@ -8581,9 +8120,9 @@ home-or-tmp@^2.0.0:
     os-tmpdir "^1.0.1"
 
 homedir-polyfill@^1.0.0, homedir-polyfill@^1.0.1:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/homedir-polyfill/-/homedir-polyfill-1.0.1.tgz#4c2bbc8a758998feebf5ed68580f76d46768b4bc"
-  integrity sha1-TCu8inWJmP7r9e1oWA921GdotLw=
+  version "1.0.3"
+  resolved "https://registry.yarnpkg.com/homedir-polyfill/-/homedir-polyfill-1.0.3.tgz#743298cef4e5af3e194161fbadcc2151d3a058e8"
+  integrity sha512-eSmmWE5bZTK2Nou4g0AI3zZ9rswp7GRKoKXS1BLUkvPviOqs4YTN1djQIqrXy9k5gEtdLPy86JjRwsNM9tnDcA==
   dependencies:
     parse-passwd "^1.0.0"
 
@@ -8632,27 +8171,17 @@ html-webpack-plugin@^4.0.0-beta.2:
     tapable "^1.1.0"
     util.promisify "1.0.0"
 
-htmlparser2@^3.9.0, htmlparser2@^3.9.1:
-  version "3.9.2"
-  resolved "https://registry.yarnpkg.com/htmlparser2/-/htmlparser2-3.9.2.tgz#1bdf87acca0f3f9e53fa4fcceb0f4b4cbb00b338"
-  integrity sha1-G9+HrMoPP55T+k/M6w9LTLsAszg=
+htmlparser2@^3.10.0, htmlparser2@^3.3.0, htmlparser2@^3.9.1:
+  version "3.10.1"
+  resolved "https://registry.yarnpkg.com/htmlparser2/-/htmlparser2-3.10.1.tgz#bd679dc3f59897b6a34bb10749c855bb53a9392f"
+  integrity sha512-IgieNijUMbkDovyoKObU1DUhm1iwNYE/fuifEoEHfd1oZKZDaONBSkal7Y01shxsM49R4XaMdGez3WnF9UfiCQ==
   dependencies:
-    domelementtype "^1.3.0"
+    domelementtype "^1.3.1"
     domhandler "^2.3.0"
     domutils "^1.5.1"
     entities "^1.1.1"
     inherits "^2.0.1"
-    readable-stream "^2.0.2"
-
-htmlparser2@~3.3.0:
-  version "3.3.0"
-  resolved "https://registry.yarnpkg.com/htmlparser2/-/htmlparser2-3.3.0.tgz#cc70d05a59f6542e43f0e685c982e14c924a9efe"
-  integrity sha1-zHDQWln2VC5D8OaFyYLhTJJKnv4=
-  dependencies:
-    domelementtype "1"
-    domhandler "2.1"
-    domutils "1.1"
-    readable-stream "1.0"
+    readable-stream "^3.1.1"
 
 http-errors@1.6.3, http-errors@~1.6.2, http-errors@~1.6.3:
   version "1.6.3"
@@ -8665,20 +8194,20 @@ http-errors@1.6.3, http-errors@~1.6.2, http-errors@~1.6.3:
     statuses ">= 1.4.0 < 2"
 
 http-errors@^1.3.0:
-  version "1.7.1"
-  resolved "https://registry.yarnpkg.com/http-errors/-/http-errors-1.7.1.tgz#6a4ffe5d35188e1c39f872534690585852e1f027"
-  integrity sha512-jWEUgtZWGSMba9I1N3gc1HmvpBUaNC9vDdA46yScAdp+C5rdEuKWUBLWTQpW9FwSWSbYYs++b6SDCxf9UEJzfw==
+  version "1.7.2"
+  resolved "https://registry.yarnpkg.com/http-errors/-/http-errors-1.7.2.tgz#4f5029cf13239f31036e5b2e55292bcfbcc85c8f"
+  integrity sha512-uUQBt3H/cSIVfch6i1EuPNy/YsRSOUBXTVfZ+yR7Zjez3qjBz6i9+i4zjNaoqcoFVI4lQJ5plg63TvGfRSDCRg==
   dependencies:
     depd "~1.1.2"
     inherits "2.0.3"
-    setprototypeof "1.1.0"
+    setprototypeof "1.1.1"
     statuses ">= 1.5.0 < 2"
     toidentifier "1.0.0"
 
 http-parser-js@>=0.4.0:
-  version "0.4.13"
-  resolved "https://registry.yarnpkg.com/http-parser-js/-/http-parser-js-0.4.13.tgz#3bd6d6fde6e3172c9334c3b33b6c193d80fe1137"
-  integrity sha1-O9bW/ebjFyyTNMOzO2wZPYD+ETc=
+  version "0.5.0"
+  resolved "https://registry.yarnpkg.com/http-parser-js/-/http-parser-js-0.5.0.tgz#d65edbede84349d0dc30320815a15d39cc3cbbd8"
+  integrity sha512-cZdEF7r4gfRIq7ezX9J0T+kQmJNOub71dWbgAXVHDct80TKP4MCETtZQ31xyv38UwgzkWPYF/Xc0ge55dW9Z9w==
 
 http-proxy-agent@^2.1.0:
   version "2.1.0"
@@ -8735,9 +8264,9 @@ https-proxy-agent@^2.2.1:
     debug "^3.1.0"
 
 hyphenate-style-name@^1.0.2:
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/hyphenate-style-name/-/hyphenate-style-name-1.0.2.tgz#31160a36930adaf1fc04c6074f7eb41465d4ec4b"
-  integrity sha1-MRYKNpMK2vH8BMYHT360FGXU7Es=
+  version "1.0.3"
+  resolved "https://registry.yarnpkg.com/hyphenate-style-name/-/hyphenate-style-name-1.0.3.tgz#097bb7fa0b8f1a9cf0bd5c734cf95899981a9b48"
+  integrity sha512-EcuixamT82oplpoJ2XU4pDtKGWQ7b00CD9f1ug9IaQ3p1bkHMiKCZ9ut9QDI6qsa6cpUuB+A/I+zLtdNK4n2DQ==
 
 iconv-lite@0.4.23:
   version "0.4.23"
@@ -8759,11 +8288,11 @@ icss-replace-symbols@^1.1.0:
   integrity sha1-Bupvg2ead0njhs/h/oEq5dsiPe0=
 
 icss-utils@^4.0.0:
-  version "4.0.0"
-  resolved "https://registry.yarnpkg.com/icss-utils/-/icss-utils-4.0.0.tgz#d52cf4bcdcfa1c45c2dbefb4ffdf6b00ef608098"
-  integrity sha512-bA/xGiwWM17qjllIs9X/y0EjsB7e0AV08F3OL8UPsoNkNRibIuu8f1eKTnQ8QO1DteKKTxTUAn+IEWUToIwGOA==
+  version "4.1.0"
+  resolved "https://registry.yarnpkg.com/icss-utils/-/icss-utils-4.1.0.tgz#339dbbffb9f8729a243b701e1c29d4cc58c52f0e"
+  integrity sha512-3DEun4VOeMvSczifM3F2cKQrDQ5Pj6WKhkOq6HD4QTnDUAq8MQRxy5TX6Sy1iY6WPBe4gQ3p5vTECjbIkglkkQ==
   dependencies:
-    postcss "^7.0.5"
+    postcss "^7.0.14"
 
 ieee754@^1.1.4:
   version "1.1.12"
@@ -8787,15 +8316,6 @@ ignore@^3.3.5:
   resolved "https://registry.yarnpkg.com/ignore/-/ignore-3.3.10.tgz#0a97fb876986e8081c631160f8f9f389157f0043"
   integrity sha512-Pgs951kaMm5GXP7MOvxERINe3gsaVjUWFm+UZPSq9xYriQAksyhg0csnS0KXSNRD5NmNdapXEpjxG49+AKh/ug==
 
-imagemin-mozjpeg@^7.0.0:
-  version "7.0.0"
-  resolved "https://registry.yarnpkg.com/imagemin-mozjpeg/-/imagemin-mozjpeg-7.0.0.tgz#d926477fc6ef5f3a768a4222f7b2d808d3eba568"
-  integrity sha1-2SZHf8bvXzp2ikIi97LYCNPrpWg=
-  dependencies:
-    execa "^0.8.0"
-    is-jpg "^1.0.0"
-    mozjpeg "^5.0.0"
-
 imagemin-pngquant@5.0.1:
   version "5.0.1"
   resolved "https://registry.yarnpkg.com/imagemin-pngquant/-/imagemin-pngquant-5.0.1.tgz#d8a329da553afa226b11ce62debe0b7e37b439e6"
@@ -8805,17 +8325,7 @@ imagemin-pngquant@5.0.1:
     is-png "^1.0.0"
     pngquant-bin "^3.0.0"
 
-imagemin-pngquant@^6.0.0:
-  version "6.0.0"
-  resolved "https://registry.yarnpkg.com/imagemin-pngquant/-/imagemin-pngquant-6.0.0.tgz#7c0c956338fa9a3a535deb63973c1c894519cc78"
-  integrity sha512-lZ87Y7u0UaJuhtQZ2wkKyxsFeNTEv1C5xxoHN7jFD89rKpiC/Qu2cIYGAOypOsxqAxWlsHaoz0hJlFFdCnG6Zg==
-  dependencies:
-    execa "^0.10.0"
-    is-png "^1.0.0"
-    is-stream "^1.1.0"
-    pngquant-bin "^5.0.0"
-
-imagemin-webp@^4.0.0, imagemin-webp@^4.1.0:
+imagemin-webp@^4.0.0:
   version "4.1.0"
   resolved "https://registry.yarnpkg.com/imagemin-webp/-/imagemin-webp-4.1.0.tgz#effd00160d8456b95cbde5fd26c32d64b0318062"
   integrity sha1-7/0AFg2EVrlcveX9JsMtZLAxgGI=
@@ -8836,18 +8346,6 @@ imagemin@^5.2.2:
     pify "^2.3.0"
     replace-ext "^1.0.0"
 
-imagemin@^6.0.0:
-  version "6.0.0"
-  resolved "https://registry.yarnpkg.com/imagemin/-/imagemin-6.0.0.tgz#1ae68c6b867863651a454f882054d9abf7d13b78"
-  integrity sha512-m4Mxwt2QvCp1F85HXoTungXk0Y6XzuvQGqrK9qEddQfo/7x4aZjRENmyXXfc29ei4Mk55rW002bORG86YM3/aQ==
-  dependencies:
-    file-type "^8.1.0"
-    globby "^8.0.1"
-    make-dir "^1.0.0"
-    p-pipe "^1.1.0"
-    pify "^3.0.0"
-    replace-ext "^1.0.0"
-
 imagesloaded@^4.1.1:
   version "4.1.4"
   resolved "https://registry.yarnpkg.com/imagesloaded/-/imagesloaded-4.1.4.tgz#1376efcd162bb768c34c3727ac89cc04051f3cc7"
@@ -8860,10 +8358,10 @@ immediate@~3.0.5:
   resolved "https://registry.yarnpkg.com/immediate/-/immediate-3.0.6.tgz#9db1dbd0faf8de6fbe0f5dd5e56bb606280de69b"
   integrity sha1-nbHb0Pr43m++D13V5Wu2BigN5ps=
 
-immer@1.7.2:
-  version "1.7.2"
-  resolved "https://registry.yarnpkg.com/immer/-/immer-1.7.2.tgz#a51e9723c50b27e132f6566facbec1c85fc69547"
-  integrity sha512-4Urocwu9+XLDJw4Tc6ZCg7APVjjLInCFvO4TwGsAYV5zT6YYSor14dsZR0+0tHlDIN92cFUOq+i7fC00G5vTxA==
+immer@1.10.0:
+  version "1.10.0"
+  resolved "https://registry.yarnpkg.com/immer/-/immer-1.10.0.tgz#bad67605ba9c810275d91e1c2a47d4582e98286d"
+  integrity sha512-O3sR1/opvCDGLEVcvrGTMtLac8GJ5IwZC4puPrLuRj3l7ICKvkmA0vGuU9OW8mV9WIBRnaxp5GJh9IEAaNOoYg==
 
 immer@^1.12.0:
   version "1.12.1"
@@ -8942,7 +8440,7 @@ inherits@2.0.1:
   resolved "https://registry.yarnpkg.com/inherits/-/inherits-2.0.1.tgz#b17d08d326b4423e568eff719f91b0b1cbdf69f1"
   integrity sha1-sX0I0ya0Qj5Wjv9xn5GwscvfafE=
 
-ini@^1.3.0, ini@^1.3.4, ini@~1.3.0:
+ini@^1.3.0, ini@^1.3.4, ini@^1.3.5, ini@~1.3.0:
   version "1.3.5"
   resolved "https://registry.yarnpkg.com/ini/-/ini-1.3.5.tgz#eee25f56db1c9ec6085e0c22778083f596abf927"
   integrity sha512-RZY5huIKCMRWDUqZlEi72f/lmXKMvuszcMBduliQ3nnWbx9X/ZBQO7DijMEYS9EhHBb2qacRUMtC7svLwe0lcw==
@@ -8975,26 +8473,7 @@ inquirer@3.3.0, inquirer@^3.0.0, inquirer@^3.0.1:
     strip-ansi "^4.0.0"
     through "^2.3.6"
 
-inquirer@6.2.0:
-  version "6.2.0"
-  resolved "https://registry.yarnpkg.com/inquirer/-/inquirer-6.2.0.tgz#51adcd776f661369dc1e894859c2560a224abdd8"
-  integrity sha512-QIEQG4YyQ2UYZGDC4srMZ7BjHOmNk1lR2JQj5UknBapklm6WHA+VVH7N+sUdX3A7NeCfGF8o4X1S3Ao7nAcIeg==
-  dependencies:
-    ansi-escapes "^3.0.0"
-    chalk "^2.0.0"
-    cli-cursor "^2.1.0"
-    cli-width "^2.0.0"
-    external-editor "^3.0.0"
-    figures "^2.0.0"
-    lodash "^4.17.10"
-    mute-stream "0.0.7"
-    run-async "^2.2.0"
-    rxjs "^6.1.0"
-    string-width "^2.1.0"
-    strip-ansi "^4.0.0"
-    through "^2.3.6"
-
-inquirer@^6.2.0:
+inquirer@6.2.1:
   version "6.2.1"
   resolved "https://registry.yarnpkg.com/inquirer/-/inquirer-6.2.1.tgz#9943fc4882161bdb0b0c9276769c75b32dbfcd52"
   integrity sha512-088kl3DRT2dLU5riVMKKr1DlImd6X7smDhpXUCkJDCKvTEJeRiXh0G132HG9u5a+6Ylw9plFRY7RuTnwohYSpg==
@@ -9013,24 +8492,38 @@ inquirer@^6.2.0:
     strip-ansi "^5.0.0"
     through "^2.3.6"
 
+inquirer@^6.2.0:
+  version "6.2.2"
+  resolved "https://registry.yarnpkg.com/inquirer/-/inquirer-6.2.2.tgz#46941176f65c9eb20804627149b743a218f25406"
+  integrity sha512-Z2rREiXA6cHRR9KBOarR3WuLlFzlIfAEIiB45ll5SSadMg7WqOh1MKEjjndfuH5ewXdixWCxqnVfGOQzPeiztA==
+  dependencies:
+    ansi-escapes "^3.2.0"
+    chalk "^2.4.2"
+    cli-cursor "^2.1.0"
+    cli-width "^2.0.0"
+    external-editor "^3.0.3"
+    figures "^2.0.0"
+    lodash "^4.17.11"
+    mute-stream "0.0.7"
+    run-async "^2.2.0"
+    rxjs "^6.4.0"
+    string-width "^2.1.0"
+    strip-ansi "^5.0.0"
+    through "^2.3.6"
+
 interpret@^0.6.4:
   version "0.6.6"
   resolved "https://registry.yarnpkg.com/interpret/-/interpret-0.6.6.tgz#fecd7a18e7ce5ca6abfb953e1f86213a49f1625b"
   integrity sha1-/s16GOfOXKar+5U+H4YhOknxYls=
 
-interpret@^1.0.0:
-  version "1.1.0"
-  resolved "https://registry.yarnpkg.com/interpret/-/interpret-1.1.0.tgz#7ed1b1410c6a0e0f78cf95d3b8440c63f78b8614"
-  integrity sha1-ftGxQQxqDg94z5XTuEQMY/eLhhQ=
-
-interpret@^1.2.0:
+interpret@^1.0.0, interpret@^1.2.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/interpret/-/interpret-1.2.0.tgz#d5061a6224be58e8083985f5014d844359576296"
   integrity sha512-mT34yGKMNceBQUoVn7iCDKDntA7SC6gycMAWzGx1z/CMCTV7b2AAtXlo3nRyHZ1FelRkQbQjprHSYGwzLtkVbw==
 
 invariant@^2.2.0, invariant@^2.2.1, invariant@^2.2.2, invariant@^2.2.3, invariant@^2.2.4:
   version "2.2.4"
-  resolved "https://registry.npmjs.org/invariant/-/invariant-2.2.4.tgz#610f3c92c9359ce1db616e538008d23ff35158e6"
+  resolved "https://registry.yarnpkg.com/invariant/-/invariant-2.2.4.tgz#610f3c92c9359ce1db616e538008d23ff35158e6"
   integrity sha512-phJfQVBuaJM5raOpJjSfkiD6BpbCE4Ns//LaXl6wGYtUBY83nWS6Rf9tXm2e8VaK60JEjYldbPif/A2B1C2gNA==
   dependencies:
     loose-envify "^1.0.0"
@@ -9141,6 +8634,13 @@ is-builtin-module@^1.0.0:
   dependencies:
     builtin-modules "^1.0.0"
 
+is-builtin-module@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/is-builtin-module/-/is-builtin-module-3.0.0.tgz#137d3d2425023a19a660fb9dd6ddfabe52c03466"
+  integrity sha512-/93sDihsAD652hrMEbJGbMAVBf1qc96kyThHQ0CAOONHaE3aROLpTjDe4WQ5aoC5ITHFxEq1z8XqSU7km+8amw==
+  dependencies:
+    builtin-modules "^3.0.0"
+
 is-bzip2@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/is-bzip2/-/is-bzip2-1.0.0.tgz#5ee58eaa5a2e9c80e21407bedf23ae5ac091b3fc"
@@ -9314,11 +8814,6 @@ is-installed-globally@^0.1.0:
     global-dirs "^0.1.0"
     is-path-inside "^1.0.0"
 
-is-jpg@^1.0.0:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/is-jpg/-/is-jpg-1.0.1.tgz#296d57fdd99ce010434a7283e346ab9a1035e975"
-  integrity sha1-KW1X/dmc4BBDSnKD40armhA16XU=
-
 is-nan@^1.2.1:
   version "1.2.1"
   resolved "https://registry.yarnpkg.com/is-nan/-/is-nan-1.2.1.tgz#9faf65b6fb6db24b7f5c0628475ea71f988401e2"
@@ -9331,11 +8826,6 @@ is-natural-number@^2.0.0:
   resolved "https://registry.yarnpkg.com/is-natural-number/-/is-natural-number-2.1.1.tgz#7d4c5728377ef386c3e194a9911bf57c6dc335e7"
   integrity sha1-fUxXKDd+84bD4ZSpkRv1fG3DNec=
 
-is-natural-number@^4.0.1:
-  version "4.0.1"
-  resolved "https://registry.yarnpkg.com/is-natural-number/-/is-natural-number-4.0.1.tgz#ab9d76e1db4ced51e35de0c72ebecf09f734cde8"
-  integrity sha1-q5124dtM7VHjXeDHLr7PCfc0zeg=
-
 is-npm@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/is-npm/-/is-npm-1.0.0.tgz#f2fb63a65e4905b406c86072765a1a4dc793b9f4"
@@ -9583,9 +9073,9 @@ isemail@2.x.x:
   integrity sha1-A1PT2aYpUQgMJiwqoKQrjqjp4qY=
 
 isemail@3.x.x:
-  version "3.1.3"
-  resolved "https://registry.yarnpkg.com/isemail/-/isemail-3.1.3.tgz#64f37fc113579ea12523165c3ebe3a71a56ce571"
-  integrity sha512-5xbsG5wYADIcB+mfLsd+nst1V/D+I7EU7LEZPo2GOIMu4JzfcRs5yQoypP4avA7QtUqgxYLKBYNv4IdzBmbhdw==
+  version "3.2.0"
+  resolved "https://registry.yarnpkg.com/isemail/-/isemail-3.2.0.tgz#59310a021931a9fb06bbb51e155ce0b3f236832c"
+  integrity sha512-zKqkK+O+dGqevc93KNsbZ/TqTUFd46MwWjYOoMrjIMZ51eU7DtQG3Wmd9SQQT7i7RVnuTPEiYEWHU3MSbxC1Tg==
   dependencies:
     punycode "2.x.x"
 
@@ -9633,9 +9123,9 @@ isurl@^1.0.0-alpha5:
     is-object "^1.0.1"
 
 items@2.x.x:
-  version "2.1.1"
-  resolved "https://registry.yarnpkg.com/items/-/items-2.1.1.tgz#8bd16d9c83b19529de5aea321acaada78364a198"
-  integrity sha1-i9FtnIOxlSneWuoyGsqtp4NkoZg=
+  version "2.1.2"
+  resolved "https://registry.yarnpkg.com/items/-/items-2.1.2.tgz#0849354595805d586dac98e7e6e85556ea838558"
+  integrity sha512-kezcEqgB97BGeZZYtX/MA8AG410ptURstvnz5RAgyFZ8wQFPMxHY8GpTq+/ZHKT3frSlIthUq7EvLt9xn3TvXg==
 
 iterall@1.1.3:
   version "1.1.3"
@@ -9690,14 +9180,14 @@ jpeg-js@^0.2.0:
   integrity sha1-U+RI7J0mPmgyZkZ+lELSxaLvVII=
 
 js-base64@^2.1.9:
-  version "2.4.9"
-  resolved "https://registry.yarnpkg.com/js-base64/-/js-base64-2.4.9.tgz#748911fb04f48a60c4771b375cac45a80df11c03"
-  integrity sha512-xcinL3AuDJk7VSzsHgb9DvvIXayBbadtMZ4HFPx8rUszbW1MuNMlwYVC4zzCZ6e1sqZpnNS5ZFYOhXqA39T7LQ==
+  version "2.5.1"
+  resolved "https://registry.yarnpkg.com/js-base64/-/js-base64-2.5.1.tgz#1efa39ef2c5f7980bb1784ade4a8af2de3291121"
+  integrity sha512-M7kLczedRMYX4L8Mdh4MzyAMM9O5osx+4FcOQuTvr3A9F2D9S5JXheN0ewNbrvK2UatkTRhL5ejGmGSjNMiZuw==
 
 js-beautify@^1.8.9:
-  version "1.8.9"
-  resolved "https://registry.yarnpkg.com/js-beautify/-/js-beautify-1.8.9.tgz#08e3c05ead3ecfbd4f512c3895b1cda76c87d523"
-  integrity sha512-MwPmLywK9RSX0SPsUJjN7i+RQY9w/yC17Lbrq9ViEefpLRgqAR2BgrMN2AbifkUuhDV8tRauLhLda/9+bE0YQA==
+  version "1.9.0"
+  resolved "https://registry.yarnpkg.com/js-beautify/-/js-beautify-1.9.0.tgz#2562fcdee340f9f962ae2ec4a8a40e7aaa6d964f"
+  integrity sha512-P0skmY4IDjfLiVrx+GLDeme8w5G0R1IGXgccVU5HP2VM3lRblH7qN2LTea5vZAxrDjpZBD0Jv+ahpjwVcbz/rw==
   dependencies:
     config-chain "^1.1.12"
     editorconfig "^0.15.2"
@@ -9706,9 +9196,9 @@ js-beautify@^1.8.9:
     nopt "~4.0.1"
 
 js-levenshtein@^1.1.3:
-  version "1.1.4"
-  resolved "https://registry.yarnpkg.com/js-levenshtein/-/js-levenshtein-1.1.4.tgz#3a56e3cbf589ca0081eb22cd9ba0b1290a16d26e"
-  integrity sha512-PxfGzSs0ztShKrUYPIn5r0MtyAhYcCwmndozzpz8YObbPnD1jFxzlBGbRnX2mIu6Z13xN6+PTu05TQFnZFlzow==
+  version "1.1.6"
+  resolved "https://registry.yarnpkg.com/js-levenshtein/-/js-levenshtein-1.1.6.tgz#c6cee58eb3550372df8deb85fad5ce66ce01d59d"
+  integrity sha512-X2BB11YZtrRqY4EnQcLX5Rh373zbK4alC1FW7D7MBhL2gtcC17cTnr6DmfHZeS0s2rTHjUTMMHfG7gO8SSdw+g==
 
 "js-tokens@^3.0.0 || ^4.0.0", js-tokens@^4.0.0:
   version "4.0.0"
@@ -9721,9 +9211,9 @@ js-tokens@^3.0.2:
   integrity sha1-mGbfOVECEw449/mWvOtlRDIJwls=
 
 js-yaml@^3.10.0, js-yaml@^3.12.0, js-yaml@^3.5.2, js-yaml@^3.9.0:
-  version "3.12.0"
-  resolved "https://registry.yarnpkg.com/js-yaml/-/js-yaml-3.12.0.tgz#eaed656ec8344f10f527c6bfa1b6e2244de167d1"
-  integrity sha512-PIt2cnwmPfL4hKNwqeiuz4bKfnzHTBv6HyVgjahA6mPLwPDzjDWrplJBMjHUFxku/N3FlmrbyPclad+I+4mJ3A==
+  version "3.12.2"
+  resolved "https://registry.yarnpkg.com/js-yaml/-/js-yaml-3.12.2.tgz#ef1d067c5a9d9cb65bd72f285b5d8105c77f14fc"
+  integrity sha512-QHn/Lh/7HhZ/Twc7vJYQTkjuCa0kaCcDcjK5Zlk2rvnUpy7DxMJ23+Jc2dcyvltwQVg1nygAVlB2oRDFHoRS5Q==
   dependencies:
     argparse "^1.0.7"
     esprima "^4.0.0"
@@ -9736,10 +9226,10 @@ js-yaml@~3.7.0:
     argparse "^1.0.7"
     esprima "^2.6.0"
 
-jsan@^3.1.5, jsan@^3.1.9:
-  version "3.1.10"
-  resolved "https://registry.yarnpkg.com/jsan/-/jsan-3.1.10.tgz#ba9917b864defff567e0c990a34ae7a8d5eb1d90"
-  integrity sha512-Rpme/mJFG3BlIM8/9L+0qAIGccx6dyYEODdkZUHYKyJI3NIl6d13buXa7aE3lO1kZAGMalG0/6QzalXdDdUc4g==
+jsan@^3.1.13:
+  version "3.1.13"
+  resolved "https://registry.yarnpkg.com/jsan/-/jsan-3.1.13.tgz#4de8c7bf8d1cfcd020c313d438f930cec4b91d86"
+  integrity sha512-9kGpCsGHifmw6oJet+y8HaCl14y7qgAsxVdV3pCHDySNR3BfDC30zgkssd7x5LRVAT22dnpbe9JdzzmXZnq9/g==
 
 jsbn@~0.1.0:
   version "0.1.1"
@@ -9786,12 +9276,10 @@ json-schema@0.2.3:
   resolved "https://registry.yarnpkg.com/json-schema/-/json-schema-0.2.3.tgz#b480c892e59a2f05954ce727bd3f2a4e882f9e13"
   integrity sha1-tIDIkuWaLwWVTOcnvT8qTogvnhM=
 
-json-stable-stringify@^1.0.0:
+json-stable-stringify-without-jsonify@^1.0.1:
   version "1.0.1"
-  resolved "https://registry.npmjs.org/json-stable-stringify/-/json-stable-stringify-1.0.1.tgz#9a759d39c5f2ff503fd5300646ed445f88c4f9af"
-  integrity sha1-mnWdOcXy/1A/1TAGRu1EX4jE+a8=
-  dependencies:
-    jsonify "~0.0.0"
+  resolved "https://registry.yarnpkg.com/json-stable-stringify-without-jsonify/-/json-stable-stringify-without-jsonify-1.0.1.tgz#9db7b59496ad3f3cfef30a75142d2d930ad72651"
+  integrity sha1-nbe1lJatPzz+8wp1FC0tkwrXJlE=
 
 json-stringify-safe@^5.0.1, json-stringify-safe@~5.0.1:
   version "5.0.1"
@@ -9921,15 +9409,14 @@ jsprim@^1.2.2:
     verror "1.10.0"
 
 jszip@^3.1.5:
-  version "3.1.5"
-  resolved "https://registry.yarnpkg.com/jszip/-/jszip-3.1.5.tgz#e3c2a6c6d706ac6e603314036d43cd40beefdf37"
-  integrity sha512-5W8NUaFRFRqTOL7ZDDrx5qWHJyBXy6velVudIzQUSoqAAYqzSh2Z7/m0Rf1QbmQJccegD0r+YZxBjzqoBiEeJQ==
+  version "3.2.0"
+  resolved "https://registry.yarnpkg.com/jszip/-/jszip-3.2.0.tgz#1c179e8692777490ca4e9b8f3ced08f9b820da2c"
+  integrity sha512-4WjbsaEtBK/DHeDZOPiPw5nzSGLDEDDreFRDEgnoMwmknPjTqa+23XuYFk6NiGbeiAeZCctiQ/X/z0lQBmDVOQ==
   dependencies:
-    core-js "~2.3.0"
-    es6-promise "~3.0.2"
-    lie "~3.1.0"
+    lie "~3.3.0"
     pako "~1.0.2"
-    readable-stream "~2.0.6"
+    readable-stream "~2.3.6"
+    set-immediate-shim "~1.0.1"
 
 kebab-case@^1.0.0:
   version "1.0.0"
@@ -10028,7 +9515,7 @@ lcid@^1.0.0:
 
 leven@^2.0.0:
   version "2.1.0"
-  resolved "https://registry.npmjs.org/leven/-/leven-2.1.0.tgz#c2e7a9f772094dee9d34202ae8acce4687875580"
+  resolved "https://registry.yarnpkg.com/leven/-/leven-2.1.0.tgz#c2e7a9f772094dee9d34202ae8acce4687875580"
   integrity sha1-wuep93IJTe6dNCAq6KzORoeHVYA=
 
 levn@~0.3.0:
@@ -10039,10 +9526,10 @@ levn@~0.3.0:
     prelude-ls "~1.1.2"
     type-check "~0.3.2"
 
-lie@~3.1.0:
-  version "3.1.1"
-  resolved "https://registry.yarnpkg.com/lie/-/lie-3.1.1.tgz#9a436b2cc7746ca59de7a41fa469b3efb76bd87e"
-  integrity sha1-mkNrLMd0bKWd56QfpGmz77dr2H4=
+lie@~3.3.0:
+  version "3.3.0"
+  resolved "https://registry.yarnpkg.com/lie/-/lie-3.3.0.tgz#dcf82dee545f46074daf200c7c1c5a08e0f40f6a"
+  integrity sha512-UaiMJzeWRlEujzAuw5LokY1L5ecNQYZKfmyZ9L7wDHb/p5etKaxXhohBcrw0EYby+G/NA52vRSN4N39dxHAIwQ==
   dependencies:
     immediate "~3.0.5"
 
@@ -10101,11 +9588,11 @@ load-json-file@^2.0.0:
     strip-bom "^3.0.0"
 
 loader-runner@^2.3.0:
-  version "2.3.1"
-  resolved "https://registry.yarnpkg.com/loader-runner/-/loader-runner-2.3.1.tgz#026f12fe7c3115992896ac02ba022ba92971b979"
-  integrity sha512-By6ZFY7ETWOc9RFaAIb23IjJVcM4dvJC/N57nmdz9RSkMXvAXGI7SyVlAw3v8vjtDRlqThgVDVmTnr9fqMlxkw==
+  version "2.4.0"
+  resolved "https://registry.yarnpkg.com/loader-runner/-/loader-runner-2.4.0.tgz#ed47066bfe534d7e84c4c7b9998c2a75607d9357"
+  integrity sha512-Jsmr89RcXGIwivFY21FcRrisYZfvLMTWx5kOLc+JTxtpBOG6xML0vzbc6SEQG2FO9/4Fc3wW4LVcB5DmGflaRw==
 
-loader-utils@1.1.0, loader-utils@^1.0.2, loader-utils@^1.1.0:
+loader-utils@1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/loader-utils/-/loader-utils-1.1.0.tgz#c98aef488bcceda2ffb5e2de646d6a754429f5cd"
   integrity sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0=
@@ -10114,6 +9601,15 @@ loader-utils@1.1.0, loader-utils@^1.0.2, loader-utils@^1.1.0:
     emojis-list "^2.0.0"
     json5 "^0.5.0"
 
+loader-utils@1.2.3, loader-utils@^1.0.2, loader-utils@^1.1.0, loader-utils@^1.2.1:
+  version "1.2.3"
+  resolved "https://registry.yarnpkg.com/loader-utils/-/loader-utils-1.2.3.tgz#1ff5dc6911c9f0a062531a4c04b609406108c2c7"
+  integrity sha512-fkpz8ejdnEMG3s37wGL07iSBDg99O9D5yflE9RGNH3hRdx9SOwYfnGYdZOUIZitN8E+E2vkq3MUMYMvPYl5ZZA==
+  dependencies:
+    big.js "^5.2.2"
+    emojis-list "^2.0.0"
+    json5 "^1.0.1"
+
 loader-utils@^0.2.11, loader-utils@^0.2.15, loader-utils@^0.2.16, loader-utils@^0.2.3, loader-utils@~0.2.5:
   version "0.2.17"
   resolved "https://registry.yarnpkg.com/loader-utils/-/loader-utils-0.2.17.tgz#f86e6374d43205a6e6c60e9196f17c0299bfb348"
@@ -10124,15 +9620,6 @@ loader-utils@^0.2.11, loader-utils@^0.2.15, loader-utils@^0.2.16, loader-utils@^
     json5 "^0.5.0"
     object-assign "^4.0.1"
 
-loader-utils@^1.2.1:
-  version "1.2.3"
-  resolved "https://registry.yarnpkg.com/loader-utils/-/loader-utils-1.2.3.tgz#1ff5dc6911c9f0a062531a4c04b609406108c2c7"
-  integrity sha512-fkpz8ejdnEMG3s37wGL07iSBDg99O9D5yflE9RGNH3hRdx9SOwYfnGYdZOUIZitN8E+E2vkq3MUMYMvPYl5ZZA==
-  dependencies:
-    big.js "^5.2.2"
-    emojis-list "^2.0.0"
-    json5 "^1.0.1"
-
 locate-path@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/locate-path/-/locate-path-2.0.0.tgz#2b568b265eec944c6d9c0de9c3dbbbca0354cd8e"
@@ -10151,7 +9638,7 @@ locate-path@^3.0.0:
 
 lodash-es@^4.17.11, lodash-es@^4.2.1:
   version "4.17.11"
-  resolved "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.11.tgz#145ab4a7ac5c5e52a3531fb4f310255a152b4be0"
+  resolved "https://registry.yarnpkg.com/lodash-es/-/lodash-es-4.17.11.tgz#145ab4a7ac5c5e52a3531fb4f310255a152b4be0"
   integrity sha512-DHb1ub+rMjjrxqlB3H56/6MXtm1lSksDp2rA2cNWjG8mlDUYFhUj3Di2Zn5IwSU87xLv8tNIQ7sSwE/YOX/D/Q==
 
 lodash-id@^0.14.0:
@@ -10303,7 +9790,7 @@ lodash.isarray@^3.0.0:
 
 lodash.isequal@^4.0.0, lodash.isequal@^4.5.0:
   version "4.5.0"
-  resolved "https://registry.npmjs.org/lodash.isequal/-/lodash.isequal-4.5.0.tgz#415c4478f2bcc30120c22ce10ed3226f7d3e18e0"
+  resolved "https://registry.yarnpkg.com/lodash.isequal/-/lodash.isequal-4.5.0.tgz#415c4478f2bcc30120c22ce10ed3226f7d3e18e0"
   integrity sha1-QVxEePK8wwEgwizhDtMib30+GOA=
 
 lodash.isobject@^2.4.1:
@@ -10352,9 +9839,9 @@ lodash.merge@^4.4.0:
   resolved "https://registry.yarnpkg.com/lodash.merge/-/lodash.merge-4.6.1.tgz#adc25d9cb99b9391c59624f379fbba60d7111d54"
   integrity sha512-AOYza4+Hf5z1/0Hztxpm2/xiPZgi/cjMqdnKTUWTBSKchJlxXXuUSxCCl8rJlf4g6yww/j6mA8nC8Hw/EZWxKQ==
 
-lodash.mergewith@^4.6.0, lodash.mergewith@^4.6.1:
+lodash.mergewith@^4.6.1:
   version "4.6.1"
-  resolved "https://registry.npmjs.org/lodash.mergewith/-/lodash.mergewith-4.6.1.tgz#639057e726c3afbdb3e7d42741caa8d6e4335927"
+  resolved "https://registry.yarnpkg.com/lodash.mergewith/-/lodash.mergewith-4.6.1.tgz#639057e726c3afbdb3e7d42741caa8d6e4335927"
   integrity sha512-eWw5r+PYICtEBgrBE5hhlT6aAa75f411bgDz/ZL2KZqYV03USvucsxcHUIlGTDTECs1eunpI7HOV7U+WLDvNdQ==
 
 lodash.pad@^4.1.0:
@@ -10465,7 +9952,7 @@ lodash@3.10.1:
   resolved "https://registry.yarnpkg.com/lodash/-/lodash-3.10.1.tgz#5bf45e8e49ba4189e17d482789dfd15bd140b7b6"
   integrity sha1-W/Rejkm6QYnhfUgnid/RW9FAt7Y=
 
-lodash@4, lodash@^4, lodash@^4.0.0, lodash@^4.1.0, lodash@^4.11.1, lodash@^4.15.0, lodash@^4.17.10, lodash@^4.17.11, lodash@^4.17.2, lodash@^4.17.4, lodash@^4.17.5, lodash@^4.2.0, lodash@^4.2.1, lodash@^4.3.0, lodash@^4.6.1:
+lodash@4, lodash@^4, lodash@^4.1.0, lodash@^4.15.0, lodash@^4.17.10, lodash@^4.17.11, lodash@^4.17.2, lodash@^4.17.4, lodash@^4.17.5, lodash@^4.2.0, lodash@^4.2.1, lodash@^4.3.0, lodash@^4.6.1:
   version "4.17.11"
   resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.11.tgz#b39ea6229ef607ecd89e2c8df12536891cac9b8d"
   integrity sha512-cQKh8igo5QUhZ7lg38DYWAxMvjSAKG0A8wGSVimP07SIUEK2UO+arSRKbRZWtelMtN5V0Hkwh5ryOto/SshYIg==
@@ -10553,15 +10040,7 @@ lpad-align@^1.0.1:
     longest "^1.0.0"
     meow "^3.3.0"
 
-lru-cache@^4.0.0, lru-cache@^4.0.1, lru-cache@^4.1.2:
-  version "4.1.3"
-  resolved "https://registry.yarnpkg.com/lru-cache/-/lru-cache-4.1.3.tgz#a1175cf3496dfc8436c156c334b4955992bce69c"
-  integrity sha512-fFEhvcgzuIoJVUF8fYr5KR0YqxD238zgObTps31YdADwPPAp82a4M8TrckkWyx7ekNlf9aBcVn81cFwwXngrJA==
-  dependencies:
-    pseudomap "^1.0.2"
-    yallist "^2.1.2"
-
-lru-cache@^4.1.3:
+lru-cache@^4.0.0, lru-cache@^4.0.1, lru-cache@^4.1.2, lru-cache@^4.1.3:
   version "4.1.5"
   resolved "https://registry.yarnpkg.com/lru-cache/-/lru-cache-4.1.5.tgz#8bbe50ea85bed59bc9e33dcab8235ee9bcf443cd"
   integrity sha512-sWZlbEP2OsHNkXrMl5GYk/jKk70MBng6UU4YI/qGDYbgf6YbP4EvmqISbXCoJiRKs+1bSpFHVgQxvJ17F2li5g==
@@ -10569,6 +10048,13 @@ lru-cache@^4.1.3:
     pseudomap "^1.0.2"
     yallist "^2.1.2"
 
+lru-cache@^5.1.1:
+  version "5.1.1"
+  resolved "https://registry.yarnpkg.com/lru-cache/-/lru-cache-5.1.1.tgz#1da27e6710271947695daf6848e847f01d84b920"
+  integrity sha512-KpNARQA3Iwv+jTA0utUVVbrh+Jlrr1Fv0e56GGzAFOXN7dk/FviaDW8LHmK52DlcH4WP2n6gI8vN1aesBFgo9w==
+  dependencies:
+    yallist "^3.0.2"
+
 ltcdr@^2.2.1:
   version "2.2.1"
   resolved "https://registry.yarnpkg.com/ltcdr/-/ltcdr-2.2.1.tgz#5ab87ad1d4c1dab8e8c08bbf037ee0c1902287cf"
@@ -10668,9 +10154,9 @@ math-expression-evaluator@^1.2.14:
   integrity sha1-3oGf282E3M2PrlnGrreWFbnSZqw=
 
 math-random@^1.0.1:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/math-random/-/math-random-1.0.1.tgz#8b3aac588b8a66e4975e3cdea67f7bb329601fac"
-  integrity sha1-izqsWIuKZuSXXjzepn97sylgH6w=
+  version "1.0.4"
+  resolved "https://registry.yarnpkg.com/math-random/-/math-random-1.0.4.tgz#5dd6943c938548267016d4e34f057583080c514c"
+  integrity sha512-rUxjysqif/BZQH2yhd5Aaq7vXMSx9NdEsQcyA07uEzIvxgI7zIr33gGsh+RU0/XjmQpCW7RsVof1vlkvQVCK5A==
 
 md5-file@^3.1.1:
   version "3.2.3"
@@ -10729,9 +10215,9 @@ mdast-util-to-hast@^2.4.0:
     xtend "^4.0.1"
 
 mdast-util-to-nlcst@^3.2.0:
-  version "3.2.0"
-  resolved "https://registry.yarnpkg.com/mdast-util-to-nlcst/-/mdast-util-to-nlcst-3.2.0.tgz#dad262857658d1eab4b5814a20e2f93d7ca1e3b6"
-  integrity sha1-2tJihXZY0eq0tYFKIOL5PXyh47Y=
+  version "3.2.2"
+  resolved "https://registry.yarnpkg.com/mdast-util-to-nlcst/-/mdast-util-to-nlcst-3.2.2.tgz#71972eecd64dc03d5cf2713f08555e2d9e2d7d10"
+  integrity sha512-TmJlri8dHt7duRU6jfWBMqf5gW+VZ6o/8GHaWzwdxslseB2lL8bSOiox6c8VwYX5v2E4CzUWm/1GkAYqgbNw9A==
   dependencies:
     nlcst-to-string "^2.0.0"
     repeat-string "^1.5.2"
@@ -10839,12 +10325,12 @@ merge-descriptors@1.0.1:
 
 merge-stream@^1.0.0:
   version "1.0.1"
-  resolved "https://registry.npmjs.org/merge-stream/-/merge-stream-1.0.1.tgz#4041202d508a342ba00174008df0c251b8c135e1"
+  resolved "https://registry.yarnpkg.com/merge-stream/-/merge-stream-1.0.1.tgz#4041202d508a342ba00174008df0c251b8c135e1"
   integrity sha1-QEEgLVCKNCugAXQAjfDCUbjBNeE=
   dependencies:
     readable-stream "^2.0.1"
 
-merge2@^1.2.1:
+merge2@^1.2.3:
   version "1.2.3"
   resolved "https://registry.yarnpkg.com/merge2/-/merge2-1.2.3.tgz#7ee99dbd69bb6481689253f018488a1b902b0ed5"
   integrity sha512-gdUU1Fwj5ep4kplwcmftruWofEFt6lfpkkr3h860CXbAB9c3hGb55EOL2ali0Td5oebvW0E1+3Sr+Ur7XfKpRA==
@@ -10905,10 +10391,10 @@ miller-rabin@^4.0.0:
     bn.js "^4.0.0"
     brorand "^1.0.1"
 
-"mime-db@>= 1.36.0 < 2", mime-db@^1.28.0, mime-db@~1.36.0:
-  version "1.36.0"
-  resolved "https://registry.yarnpkg.com/mime-db/-/mime-db-1.36.0.tgz#5020478db3c7fe93aad7bbcc4dcf869c43363397"
-  integrity sha512-L+xvyD9MkoYMXb1jAmzI/lWYAxAMCPvIBSWur0PZ5nOf5euahRLVqH//FKW9mWp2lkqUgYiXPgkzfMUFi4zVDw==
+"mime-db@>= 1.38.0 < 2", mime-db@~1.38.0:
+  version "1.38.0"
+  resolved "https://registry.yarnpkg.com/mime-db/-/mime-db-1.38.0.tgz#1a2aab16da9eb167b49c6e4df2d9c68d63d8e2ad"
+  integrity sha512-bqVioMFFzc2awcdJZIzR3HjZFX20QhilVS7hytkKrv7xFAn8bM1gzc/FOX2awLISvWe0PV8ptFKcon+wZ5qYkg==
 
 mime-db@~1.33.0:
   version "1.33.0"
@@ -10923,11 +10409,11 @@ mime-types@2.1.18:
     mime-db "~1.33.0"
 
 mime-types@^2.1.12, mime-types@~2.1.17, mime-types@~2.1.18, mime-types@~2.1.19:
-  version "2.1.20"
-  resolved "https://registry.yarnpkg.com/mime-types/-/mime-types-2.1.20.tgz#930cb719d571e903738520f8470911548ca2cc19"
-  integrity sha512-HrkrPaP9vGuWbLK1B1FfgAkbqNjIuy4eHlIYnFi7kamZyLLrGlo2mpcx0bBmNpKqBtYtAfGbodDddIgddSJC2A==
+  version "2.1.22"
+  resolved "https://registry.yarnpkg.com/mime-types/-/mime-types-2.1.22.tgz#fe6b355a190926ab7698c9a0556a11199b2199bd"
+  integrity sha512-aGl6TZGnhm/li6F7yx82bJiBZwgiEa4Hf6CNr8YO+r5UHr53tSTYZb102zyU50DOWWKeOv0uQLRL0/9EiKWCog==
   dependencies:
-    mime-db "~1.36.0"
+    mime-db "~1.38.0"
 
 mime@1.4.1:
   version "1.4.1"
@@ -10971,9 +10457,9 @@ mini-css-extract-plugin@^0.5.0:
     webpack-sources "^1.1.0"
 
 mini-svg-data-uri@^1.0.0:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/mini-svg-data-uri/-/mini-svg-data-uri-1.0.1.tgz#d81ffc14b85558860581cc58d9790daaecbe91bf"
-  integrity sha512-KJ3cjR4kJIP4RroDIXqVTOX0hDYaFMmeHPXqwakVuJmak31uB4+DEqK2L7cedtYHUOdQgh23YsXnAIOHLvjM0g==
+  version "1.0.3"
+  resolved "https://registry.yarnpkg.com/mini-svg-data-uri/-/mini-svg-data-uri-1.0.3.tgz#f8bb0d7afbf3de29152aadd0f47701197ceab4a3"
+  integrity sha512-YBaqsh6GE+4jQhLNkFYEagH2o4bVTlGGpEvkuwtwc+1NBGXqpcVCnsUGkGp75ovPXxtF2GsDYzUwyhfC0hntiA==
 
 minimalistic-assert@^1.0.0, minimalistic-assert@^1.0.1:
   version "1.0.1"
@@ -11014,18 +10500,18 @@ minimist@~0.0.1:
   resolved "https://registry.yarnpkg.com/minimist/-/minimist-0.0.10.tgz#de3f98543dbf96082be48ad1a0c7cda836301dcf"
   integrity sha1-3j+YVD2/lggr5IrRoMfNqDYwHc8=
 
-minipass@^2.2.1, minipass@^2.3.3:
-  version "2.3.4"
-  resolved "https://registry.yarnpkg.com/minipass/-/minipass-2.3.4.tgz#4768d7605ed6194d6d576169b9e12ef71e9d9957"
-  integrity sha512-mlouk1OHlaUE8Odt1drMtG1bAJA4ZA6B/ehysgV0LUIrDHdKgo1KorZq3pK0b/7Z7LJIQ12MNM6aC+Tn6lUZ5w==
+minipass@^2.2.1, minipass@^2.3.4:
+  version "2.3.5"
+  resolved "https://registry.yarnpkg.com/minipass/-/minipass-2.3.5.tgz#cacebe492022497f656b0f0f51e2682a9ed2d848"
+  integrity sha512-Gi1W4k059gyRbyVUZQ4mEqLm0YIUiGYfvxhF6SIlk3ui1WVxMTGfGdQ2SInh3PDrRTVvPKgULkpJtT4RH10+VA==
   dependencies:
     safe-buffer "^5.1.2"
     yallist "^3.0.0"
 
-minizlib@^1.1.0:
-  version "1.1.1"
-  resolved "https://registry.yarnpkg.com/minizlib/-/minizlib-1.1.1.tgz#6734acc045a46e61d596a43bb9d9cd326e19cc42"
-  integrity sha512-TrfjCjk4jLhcJyGMYymBH6oTXcWjYbUAXTHDbtnWHjZC25h0cdajHuPE1zxb4DVmu8crfh+HwH/WMuyLG0nHBg==
+minizlib@^1.1.1:
+  version "1.2.1"
+  resolved "https://registry.yarnpkg.com/minizlib/-/minizlib-1.2.1.tgz#dd27ea6136243c7c880684e8672bb3a45fd9b614"
+  integrity sha512-7+4oTUOWKg7AuL3vloEWekXY2/D20cevzsrNT2kGWm+39J9hGTCBv8VI5Pm5lXZ/o3/mdR4f8rflAPhnQb8mPA==
   dependencies:
     minipass "^2.2.1"
 
@@ -11073,30 +10559,10 @@ mkdirp@0.5.1, mkdirp@^0.5.0, mkdirp@^0.5.1, mkdirp@~0.5.0, mkdirp@~0.5.1:
   dependencies:
     minimist "0.0.8"
 
-mobx-react-form@^1.39.1:
-  version "1.39.1"
-  resolved "https://registry.yarnpkg.com/mobx-react-form/-/mobx-react-form-1.39.1.tgz#90476ef6ab6e2499cf34b12f523add55ead5677a"
-  integrity sha512-OKWXUr6+GCmIKgRvUN/GvOp85IYY9nTv6RaTO10dsttpm1YxRzCn32w/O50TEmUlN1OEWjGjg99CY1RVAdCn3Q==
-  dependencies:
-    lodash "^4.17.11"
-
-mobx-react@^5.4.3:
-  version "5.4.3"
-  resolved "https://registry.yarnpkg.com/mobx-react/-/mobx-react-5.4.3.tgz#6709b7dd89670c40e9815914ac2ca49cc02bfb47"
-  integrity sha512-WC8yFlwvJ91hy8j6CrydAuFteUafcuvdITFQeHl3LRIf5ayfT/4W3M/byhEYD2BcJWejeXr8y4Rh2H26RunCRQ==
-  dependencies:
-    hoist-non-react-statics "^3.0.0"
-    react-lifecycles-compat "^3.0.2"
-
-mobx@^5.9.0:
-  version "5.9.0"
-  resolved "https://registry.yarnpkg.com/mobx/-/mobx-5.9.0.tgz#a08edd7132787f771409c9c33788a5df66ff7ce7"
-  integrity sha512-D3mY1uM3H9BP5duk5tTanrOq92yqetYKsprPJWvkKDrbs+fro59xrpWX+vtr10YoLgJIFz+a4A8lI+4YtqmCUQ==
-
 moment@2.x.x, moment@^2.16.0:
-  version "2.22.2"
-  resolved "https://registry.yarnpkg.com/moment/-/moment-2.22.2.tgz#3c257f9839fc0e93ff53149632239eb90783ff66"
-  integrity sha1-PCV/mDn8DpP/UxSWMiOeuQeD/2Y=
+  version "2.24.0"
+  resolved "https://registry.yarnpkg.com/moment/-/moment-2.24.0.tgz#0d055d53f5052aa653c9f6eb68bb5d12bf5c2b5b"
+  integrity sha512-bV7f+6l2QigeBBZSM/6yTNq4P2fNpSWj/0e7jQcy87A8e7o2nAfP/34/2ky5Vw4B9S446EtIhodAzkFCcR4dQg==
 
 move-concurrently@^1.0.1:
   version "1.0.1"
@@ -11110,15 +10576,6 @@ move-concurrently@^1.0.1:
     rimraf "^2.5.4"
     run-queue "^1.0.3"
 
-mozjpeg@^5.0.0:
-  version "5.0.0"
-  resolved "https://registry.yarnpkg.com/mozjpeg/-/mozjpeg-5.0.0.tgz#b8671c4924568a363de003ff2fd397ab83f752c5"
-  integrity sha1-uGccSSRWijY94AP/L9OXq4P3UsU=
-  dependencies:
-    bin-build "^2.2.0"
-    bin-wrapper "^3.0.0"
-    logalot "^2.0.0"
-
 ms@2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/ms/-/ms-2.0.0.tgz#5608aeadfc00be6c2901df5f9861788de0d597c8"
@@ -11136,20 +10593,25 @@ multipipe@^0.1.2:
   dependencies:
     duplexer2 "0.0.2"
 
-mute-stream@0.0.7, mute-stream@~0.0.4:
+mute-stream@0.0.7:
   version "0.0.7"
   resolved "https://registry.yarnpkg.com/mute-stream/-/mute-stream-0.0.7.tgz#3075ce93bc21b8fab43e1bc4da7e8115ed1e7bab"
   integrity sha1-MHXOk7whuPq0PhvE2n6BFe0ee6s=
 
-nan@^2.11.0, nan@^2.11.1, nan@^2.9.2:
-  version "2.11.1"
-  resolved "https://registry.yarnpkg.com/nan/-/nan-2.11.1.tgz#90e22bccb8ca57ea4cd37cc83d3819b52eea6766"
-  integrity sha512-iji6k87OSXa0CcrLl9z+ZiYSuR2o+c0bGuNmXdrhTQTakxytAFsC56SArGYoiHlJlFoHSnvmhpceZJaXkVuOtA==
+mute-stream@~0.0.4:
+  version "0.0.8"
+  resolved "https://registry.yarnpkg.com/mute-stream/-/mute-stream-0.0.8.tgz#1630c42b2251ff81e2a283de96a5497ea92e5e0d"
+  integrity sha512-nnbWWOkoWyUsTjKrhgD0dcz22mdkSnpYqbEjIm2nhwhuxlSkpywJmBo8h0ZqJdkp73mb90SssHkN4rsRaBAfAA==
 
-nanoid@^1.0.7:
-  version "1.3.0"
-  resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-1.3.0.tgz#0b8d089c81d3b6cf61fcc16051432342b06f3ad9"
-  integrity sha512-OP8SoC91Kyjl1sdSTEnM1xYh4gUEOSkUl6wRBUklWOPyfPRbeJbhvdhQYXEjVtZ1LI9amVMkIWQI2nO8O7DL9A==
+nan@^2.11.0, nan@^2.9.2:
+  version "2.12.1"
+  resolved "https://registry.yarnpkg.com/nan/-/nan-2.12.1.tgz#7b1aa193e9aa86057e3c7bbd0ac448e770925552"
+  integrity sha512-JY7V6lRkStKcKTvHO5NVSQRv+RV+FIL5pvDoLiAtSL9pKlC5x9PKQcZDsq7m4FO4d57mkhC6Z+QhAh3Jdk5JFw==
+
+nanoid@^2.0.0:
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-2.0.1.tgz#deb55cac196e3f138071911dabbc3726eb048864"
+  integrity sha512-k1u2uemjIGsn25zmujKnotgniC/gxQ9sdegdezeDiKdkDW56THUMqlz3urndKCXJxA6yPzSZbXx/QCMe/pxqsA==
 
 nanomatch@^1.2.9:
   version "1.2.13"
@@ -11168,11 +10630,6 @@ nanomatch@^1.2.9:
     snapdragon "^0.8.1"
     to-regex "^3.0.1"
 
-napi-build-utils@^1.0.1:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/napi-build-utils/-/napi-build-utils-1.0.1.tgz#1381a0f92c39d66bf19852e7873432fc2123e508"
-  integrity sha512-boQj1WFgQH3v4clhu3mTNfP+vOBxorDlE8EKiMjUlLG3C4qAESnn9AxIOkFgTR2c9LtzNjPrjS60cT27ZKBhaA==
-
 nconf@^0.10.0:
   version "0.10.0"
   resolved "https://registry.yarnpkg.com/nconf/-/nconf-0.10.0.tgz#da1285ee95d0a922ca6cee75adcf861f48205ad2"
@@ -11203,9 +10660,9 @@ negotiator@0.6.1:
   integrity sha1-KzJxhOiZIQEXeyhWP7XnECrNDKk=
 
 neo-async@^2.5.0:
-  version "2.5.2"
-  resolved "https://registry.yarnpkg.com/neo-async/-/neo-async-2.5.2.tgz#489105ce7bc54e709d736b195f82135048c50fcc"
-  integrity sha512-vdqTKI9GBIYcAEbFAcpKPErKINfPF5zIuz3/niBfq8WUZjpT2tytLlFVrBgWdOtqI4uaA/Rb6No0hux39XXDuw==
+  version "2.6.0"
+  resolved "https://registry.yarnpkg.com/neo-async/-/neo-async-2.6.0.tgz#b9d15e4d71c6762908654b5183ed38b753340835"
+  integrity sha512-MFh0d/Wa7vkKO3Y3LlacqAEeHK0mckVqzDieUKTT+KGxi+zIpeVsFxymkIiRpbpDziHc290Xr9A1O4Om7otoRA==
 
 netmask@^1.0.6:
   version "1.0.6"
@@ -11240,9 +10697,9 @@ no-case@^2.2.0:
     lower-case "^1.1.1"
 
 node-abi@^2.2.0:
-  version "2.4.5"
-  resolved "https://registry.yarnpkg.com/node-abi/-/node-abi-2.4.5.tgz#1fd1fb66641bf3c4dcf55a5490ba10c467ead80c"
-  integrity sha512-aa/UC6Nr3+tqhHGRsAuw/edz7/q9nnetBrKWxj6rpTtm+0X9T1qU7lIEHMS3yN9JwAbRiKUbRRFy1PLz/y3aaA==
+  version "2.7.1"
+  resolved "https://registry.yarnpkg.com/node-abi/-/node-abi-2.7.1.tgz#a8997ae91176a5fbaa455b194976e32683cda643"
+  integrity sha512-OV8Bq1OrPh6z+Y4dqwo05HqrRL9YNF7QVMRfq1/pguwKLG+q9UB/Lk0x5qXjO23JjJg+/jqCHSTaG1P3tfKfuw==
   dependencies:
     semver "^5.4.1"
 
@@ -11254,9 +10711,9 @@ node-dir@^0.1.10:
     minimatch "^3.0.2"
 
 node-emoji@^1.0.4:
-  version "1.8.1"
-  resolved "https://registry.yarnpkg.com/node-emoji/-/node-emoji-1.8.1.tgz#6eec6bfb07421e2148c75c6bba72421f8530a826"
-  integrity sha512-+ktMAh1Jwas+TnGodfCfjUbJKoANqPaJFN0z0iqh41eqD8dvguNzcitVSBSVK1pidz0AqGbLKcoVuVLRVZ/aVg==
+  version "1.10.0"
+  resolved "https://registry.yarnpkg.com/node-emoji/-/node-emoji-1.10.0.tgz#8886abd25d9c7bb61802a658523d1f8d2a89b2da"
+  integrity sha512-Yt3384If5H6BYGVHiHwTL+99OzJKHhgp82S8/dktEK73T26BazdgZ4JZh92xSVtGNJvz9UbXdNAc5hcrXV42vw==
   dependencies:
     lodash.toarray "^4.4.0"
 
@@ -11313,9 +10770,9 @@ node-libs-browser@^0.7.0:
     vm-browserify "0.0.4"
 
 node-libs-browser@^2.0.0:
-  version "2.1.0"
-  resolved "https://registry.yarnpkg.com/node-libs-browser/-/node-libs-browser-2.1.0.tgz#5f94263d404f6e44767d726901fff05478d600df"
-  integrity sha512-5AzFzdoIMb89hBGMZglEegffzgRg+ZFoUmisQ8HI4j1KDdpx13J0taNp2y9xPbur6W61gepGDDotGBVQ7mfUCg==
+  version "2.2.0"
+  resolved "https://registry.yarnpkg.com/node-libs-browser/-/node-libs-browser-2.2.0.tgz#c72f60d9d46de08a940dedbb25f3ffa2f9bbaa77"
+  integrity sha512-5MQunG/oyOaBdttrL40dA7bUfPORLRWMUJLQtMg7nluxUvk5XwnLdL9twQHFAjRx/y7mIMkLKT9++qPbbk6BZA==
   dependencies:
     assert "^1.1.1"
     browserify-zlib "^0.2.0"
@@ -11324,7 +10781,7 @@ node-libs-browser@^2.0.0:
     constants-browserify "^1.0.0"
     crypto-browserify "^3.11.0"
     domain-browser "^1.1.1"
-    events "^1.0.0"
+    events "^3.0.0"
     https-browserify "^1.0.0"
     os-browserify "^0.3.0"
     path-browserify "0.0.0"
@@ -11338,7 +10795,7 @@ node-libs-browser@^2.0.0:
     timers-browserify "^2.0.4"
     tty-browserify "0.0.0"
     url "^0.11.0"
-    util "^0.10.3"
+    util "^0.11.0"
     vm-browserify "0.0.4"
 
 node-pre-gyp@^0.10.0:
@@ -11357,17 +10814,10 @@ node-pre-gyp@^0.10.0:
     semver "^5.3.0"
     tar "^4"
 
-node-releases@^1.0.0-alpha.11, node-releases@^1.0.5:
-  version "1.1.1"
-  resolved "https://registry.yarnpkg.com/node-releases/-/node-releases-1.1.1.tgz#8fff8aea1cfcad1fb4205f805149054fbf73cafd"
-  integrity sha512-2UXrBr6gvaebo5TNF84C66qyJJ6r0kxBObgZIDX3D3/mt1ADKiHux3NJPWisq0wxvJJdkjECH+9IIKYViKj71Q==
-  dependencies:
-    semver "^5.3.0"
-
-node-releases@^1.1.3:
-  version "1.1.3"
-  resolved "https://registry.yarnpkg.com/node-releases/-/node-releases-1.1.3.tgz#aad9ce0dcb98129c753f772c0aa01360fb90fbd2"
-  integrity sha512-6VrvH7z6jqqNFY200kdB6HdzkgM96Oaj9v3dqGfgp6mF+cHmU4wyQKZ2/WPDRVoR0Jz9KqbamaBN0ZhdUaysUQ==
+node-releases@^1.1.3, node-releases@^1.1.8:
+  version "1.1.9"
+  resolved "https://registry.yarnpkg.com/node-releases/-/node-releases-1.1.9.tgz#70d0985ec4bf7de9f08fc481f5dae111889ca482"
+  integrity sha512-oic3GT4OtbWWKfRolz5Syw0Xus0KRFxeorLNj0s93ofX6PWyuzKjsiGxsCtWktBwwmTF6DdRRf2KreGqeOk5KA==
   dependencies:
     semver "^5.3.0"
 
@@ -11396,19 +10846,19 @@ noop-logger@^0.1.1:
 
 nopt@^4.0.1, nopt@~4.0.1:
   version "4.0.1"
-  resolved "https://registry.npmjs.org/nopt/-/nopt-4.0.1.tgz#d0d4685afd5415193c8c7505602d0d17cd64474d"
+  resolved "https://registry.yarnpkg.com/nopt/-/nopt-4.0.1.tgz#d0d4685afd5415193c8c7505602d0d17cd64474d"
   integrity sha1-0NRoWv1UFRk8jHUFYC0NF81kR00=
   dependencies:
     abbrev "1"
     osenv "^0.1.4"
 
 normalize-package-data@^2.3.2, normalize-package-data@^2.3.4:
-  version "2.4.0"
-  resolved "https://registry.yarnpkg.com/normalize-package-data/-/normalize-package-data-2.4.0.tgz#12f95a307d58352075a04907b84ac8be98ac012f"
-  integrity sha512-9jjUFbTPfEy3R/ad/2oNbKtW9Hgovl5O1FvFWKkKblNXoN/Oou6+9+KKohPK13Yc3/TyunyWhJp6gvRNR/PPAw==
+  version "2.5.0"
+  resolved "https://registry.yarnpkg.com/normalize-package-data/-/normalize-package-data-2.5.0.tgz#e66db1838b200c1dfc233225d12cb36520e234a8"
+  integrity sha512-/5CMN3T0R4XTj4DcGaexo+roZSdSFW/0AOOTROrjxzCG1wrWXEsGbRKevjlIL+ZDE4sZlJr5ED4YW0yqmkK+eA==
   dependencies:
     hosted-git-info "^2.1.4"
-    is-builtin-module "^1.0.0"
+    resolve "^1.10.0"
     semver "2 || 3 || 4 || 5"
     validate-npm-package-license "^3.0.1"
 
@@ -11419,6 +10869,11 @@ normalize-path@^2.0.0, normalize-path@^2.0.1, normalize-path@^2.1.1:
   dependencies:
     remove-trailing-separator "^1.0.1"
 
+normalize-path@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/normalize-path/-/normalize-path-3.0.0.tgz#0dcd69ff23a1c9b11fd0978316644a0388216a65"
+  integrity sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==
+
 normalize-range@^0.1.2:
   version "0.1.2"
   resolved "https://registry.yarnpkg.com/normalize-range/-/normalize-range-0.1.2.tgz#2d10c06bdfd312ea9777695a4d28439456b75942"
@@ -11435,22 +10890,14 @@ normalize-url@^1.4.0:
     sort-keys "^1.0.0"
 
 npm-bundled@^1.0.1:
-  version "1.0.5"
-  resolved "https://registry.yarnpkg.com/npm-bundled/-/npm-bundled-1.0.5.tgz#3c1732b7ba936b3a10325aef616467c0ccbcc979"
-  integrity sha512-m/e6jgWu8/v5niCUKQi9qQl8QdeEduFA96xHDDzFGqly0OOjI7c+60KM/2sppfnUU9JJagf+zs+yGhqSOFj71g==
-
-npm-conf@^1.1.0:
-  version "1.1.3"
-  resolved "https://registry.yarnpkg.com/npm-conf/-/npm-conf-1.1.3.tgz#256cc47bd0e218c259c4e9550bf413bc2192aff9"
-  integrity sha512-Yic4bZHJOt9RCFbRP3GgpqhScOY4HH3V2P8yBj6CeYq118Qr+BLXqT2JvpJ00mryLESpgOxf5XlFv4ZjXxLScw==
-  dependencies:
-    config-chain "^1.1.11"
-    pify "^3.0.0"
+  version "1.0.6"
+  resolved "https://registry.yarnpkg.com/npm-bundled/-/npm-bundled-1.0.6.tgz#e7ba9aadcef962bb61248f91721cd932b3fe6bdd"
+  integrity sha512-8/JCaftHwbd//k6y2rEWp6k1wxVfpFzB6t1p825+cUb7Ym2XQfhwIC5KwhrvzZRJu+LtDE585zVaS32+CGtf0g==
 
 npm-packlist@^1.1.6:
-  version "1.1.12"
-  resolved "https://registry.yarnpkg.com/npm-packlist/-/npm-packlist-1.1.12.tgz#22bde2ebc12e72ca482abd67afc51eb49377243a"
-  integrity sha512-WJKFOVMeAlsU/pjXuqVdzU0WfgtIBCupkEVwn+1Y0ERAbUfWw8R4GjgVbaKnUjRoD2FoQbHOCbOyT5Mbs9Lw4g==
+  version "1.4.1"
+  resolved "https://registry.yarnpkg.com/npm-packlist/-/npm-packlist-1.4.1.tgz#19064cdf988da80ea3cee45533879d90192bbfbc"
+  integrity sha512-+TcdO7HJJ8peiiYhvPxsEDhF3PJFGUGRcFsGve3vxvxdcpO2Z4Z7rkosRM0kWj6LfbK/P0gu3dzk5RU1ffvFcw==
   dependencies:
     ignore-walk "^3.0.1"
     npm-bundled "^1.0.1"
@@ -11481,14 +10928,7 @@ npmlog@^4.0.1, npmlog@^4.0.2, npmlog@^4.1.2:
     gauge "~2.7.3"
     set-blocking "~2.0.0"
 
-nth-check@^1.0.1, nth-check@~1.0.1:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/nth-check/-/nth-check-1.0.1.tgz#9929acdf628fc2c41098deab82ac580cf149aae4"
-  integrity sha1-mSms32KPwsQQmN6rgqxYDPFJquQ=
-  dependencies:
-    boolbase "~1.0.0"
-
-nth-check@^1.0.2:
+nth-check@^1.0.1, nth-check@^1.0.2, nth-check@~1.0.1:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/nth-check/-/nth-check-1.0.2.tgz#b2bd295c37e3dd58a3bf0700376663ba4d9cf05c"
   integrity sha512-WeBOdju8SnzPN5vTUJYxYUxLeXpCaVP5i5e0LF8fg7WORF2Wd7wFX/pk0tYZk7s8T+J7VLy0Da6J1+wCT0AtHg==
@@ -11545,9 +10985,9 @@ object-copy@^0.1.0:
     kind-of "^3.0.3"
 
 object-keys@^1.0.11, object-keys@^1.0.12:
-  version "1.0.12"
-  resolved "https://registry.yarnpkg.com/object-keys/-/object-keys-1.0.12.tgz#09c53855377575310cca62f55bb334abff7b3ed2"
-  integrity sha512-FTMyFUm2wBcGHnH2eXmz7tC6IwlqQZ6mVZ+6dm6vZ4IQIHjs6FdNsQBuKGPuUUUY6NfJw2PshC08Tn6LzLDOag==
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/object-keys/-/object-keys-1.1.0.tgz#11bd22348dd2e096a045ab06f6c85bcc340fa032"
+  integrity sha512-6OO5X1+2tYkNyNEx6TsCxEqFfRWaqx6EtMiSbGrw8Ob8v9Ne+Hl8rBAgLBZn5wjEz3s/s6U1WXFUFOcxxAwUpg==
 
 object-path@^0.11.2:
   version "0.11.4"
@@ -11582,14 +11022,14 @@ object.defaults@^1.1.0:
     isobject "^3.0.0"
 
 object.entries@^1.0.4:
-  version "1.0.4"
-  resolved "https://registry.yarnpkg.com/object.entries/-/object.entries-1.0.4.tgz#1bf9a4dd2288f5b33f3a993d257661f05d161a5f"
-  integrity sha1-G/mk3SKI9bM/Opk9JXZh8F0WGl8=
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/object.entries/-/object.entries-1.1.0.tgz#2024fc6d6ba246aee38bdb0ffd5cfbcf371b7519"
+  integrity sha512-l+H6EQ8qzGRxbkHOd5I/aHRhHDKoQXQ8g0BYt4uSweQU1/J6dZUOyWh9a2Vky35YCKjzmgxOzta2hH6kf9HuXA==
   dependencies:
-    define-properties "^1.1.2"
-    es-abstract "^1.6.1"
-    function-bind "^1.1.0"
-    has "^1.0.1"
+    define-properties "^1.1.3"
+    es-abstract "^1.12.0"
+    function-bind "^1.1.1"
+    has "^1.0.3"
 
 object.fromentries@^1.0.0:
   version "1.0.0"
@@ -11639,15 +11079,15 @@ object.pick@^1.2.0, object.pick@^1.3.0:
   dependencies:
     isobject "^3.0.1"
 
-object.values@^1.0.4:
-  version "1.0.4"
-  resolved "https://registry.yarnpkg.com/object.values/-/object.values-1.0.4.tgz#e524da09b4f66ff05df457546ec72ac99f13069a"
-  integrity sha1-5STaCbT2b/Bd9FdUbscqyZ8TBpo=
+object.values@^1.0.4, object.values@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/object.values/-/object.values-1.1.0.tgz#bf6810ef5da3e5325790eaaa2be213ea84624da9"
+  integrity sha512-8mf0nKLAoFX6VlNVdhGj31SVYpaNFtUnuoOXWyFEstsWRgU837AK+JYM0iAxwkSzGRbwn8cbFmgbyxj1j4VbXg==
   dependencies:
-    define-properties "^1.1.2"
-    es-abstract "^1.6.1"
-    function-bind "^1.1.0"
-    has "^1.0.1"
+    define-properties "^1.1.3"
+    es-abstract "^1.12.0"
+    function-bind "^1.1.1"
+    has "^1.0.3"
 
 on-finished@~2.3.0:
   version "2.3.0"
@@ -11657,9 +11097,9 @@ on-finished@~2.3.0:
     ee-first "1.1.1"
 
 on-headers@~1.0.1:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/on-headers/-/on-headers-1.0.1.tgz#928f5d0f470d49342651ea6794b0857c100693f7"
-  integrity sha1-ko9dD0cNSTQmUepnlLCFfBAGk/c=
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/on-headers/-/on-headers-1.0.2.tgz#772b0ae6aaa525c399e489adfad90c403eb3c28f"
+  integrity sha512-pZAE+FJLoyITytdqK0U5s+FIpjN0JP3OzFi/u8Rx+EV5/W+JTWGXG8xFzevE7AjBfDqHv/8vL8qQsIhHnqRkrA==
 
 once@^1.3.0, once@^1.3.1, once@^1.3.3, once@^1.4.0:
   version "1.4.0"
@@ -11706,7 +11146,7 @@ opn@5.4.0, opn@^5.1.0, opn@^5.4.0:
 
 optimist@~0.6.0, optimist@~0.6.1:
   version "0.6.1"
-  resolved "https://registry.npmjs.org/optimist/-/optimist-0.6.1.tgz#da3ea74686fa21a19a111c326e90eb15a0196686"
+  resolved "https://registry.yarnpkg.com/optimist/-/optimist-0.6.1.tgz#da3ea74686fa21a19a111c326e90eb15a0196686"
   integrity sha1-2j6nRob6IaGaERwybpDrFaAZZoY=
   dependencies:
     minimist "~0.0.1"
@@ -11810,13 +11250,6 @@ p-cancelable@^0.3.0:
   resolved "https://registry.yarnpkg.com/p-cancelable/-/p-cancelable-0.3.0.tgz#b9e123800bcebb7ac13a479be195b507b98d30fa"
   integrity sha512-RVbZPLso8+jFeq1MfNvgXtCRED2raz/dKpacfTNxsx6pLEpEomM7gah6VeHSYV3+vo0OAi4MkArtQcWWXuQoyw==
 
-p-event@^1.0.0:
-  version "1.3.0"
-  resolved "https://registry.yarnpkg.com/p-event/-/p-event-1.3.0.tgz#8e6b4f4f65c72bc5b6fe28b75eda874f96a4a085"
-  integrity sha1-jmtPT2XHK8W2/ii3XtqHT5akoIU=
-  dependencies:
-    p-timeout "^1.1.1"
-
 p-finally@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/p-finally/-/p-finally-1.0.0.tgz#3fbcfb15b899a44123b34b6dcc18b724336a2cae"
@@ -11830,9 +11263,9 @@ p-limit@^1.1.0:
     p-try "^1.0.0"
 
 p-limit@^2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/p-limit/-/p-limit-2.0.0.tgz#e624ed54ee8c460a778b3c9f3670496ff8a57aec"
-  integrity sha512-fl5s52lI5ahKCernzzIyAP0QAZbGIovtVHGwpcu1Jr/EpzLVDI2myISHwGqK7m8uQFugVWSrbxH7XnhGtvEc+A==
+  version "2.2.0"
+  resolved "https://registry.yarnpkg.com/p-limit/-/p-limit-2.2.0.tgz#417c9941e6027a9abcba5092dd2904e255b5fbc2"
+  integrity sha512-pZbTJpoUsCzV48Mc9Nh51VbwO0X9cuPFE8gYwx9BTCt9SF8/b7Zljd2fVgOxhIF/HDTKgpVzs+GPhyKfjLLFRQ==
   dependencies:
     p-try "^2.0.0"
 
@@ -11850,13 +11283,6 @@ p-locate@^3.0.0:
   dependencies:
     p-limit "^2.0.0"
 
-p-map-series@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/p-map-series/-/p-map-series-1.0.0.tgz#bf98fe575705658a9e1351befb85ae4c1f07bdca"
-  integrity sha1-v5j+V1cFZYqeE1G++4WuTB8Hvco=
-  dependencies:
-    p-reduce "^1.0.0"
-
 p-map@^1.1.1:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/p-map/-/p-map-1.2.0.tgz#e4e94f311eabbc8633a1e79908165fca26241b6b"
@@ -11867,11 +11293,6 @@ p-pipe@^1.1.0:
   resolved "https://registry.yarnpkg.com/p-pipe/-/p-pipe-1.2.0.tgz#4b1a11399a11520a67790ee5a0c1d5881d6befe9"
   integrity sha1-SxoROZoRUgpneQ7loMHViB1r7+k=
 
-p-reduce@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/p-reduce/-/p-reduce-1.0.0.tgz#18c2b0dd936a4690a529f8231f58a0fdb6a47dfa"
-  integrity sha1-GMKw3ZNqRpClKfgjH1ig/bakffo=
-
 p-timeout@^1.1.1:
   version "1.2.1"
   resolved "https://registry.yarnpkg.com/p-timeout/-/p-timeout-1.2.1.tgz#5eb3b353b7fce99f101a1038880bb054ebbea386"
@@ -11930,9 +11351,9 @@ pako@~0.2.0:
   integrity sha1-8/dSL073gjSNqBYbrZ7P1Rv4OnU=
 
 pako@~1.0.2, pako@~1.0.5:
-  version "1.0.6"
-  resolved "https://registry.yarnpkg.com/pako/-/pako-1.0.6.tgz#0101211baa70c4bca4a0f63f2206e97b7dfaf258"
-  integrity sha512-lQe48YPsMJAig+yngZ87Lus+NF+3mtu7DVOBu6b/gHO1YpKwIj5AWjZ/TOS7i46HD/UixzWb1zeWDZfGZ3iYcg==
+  version "1.0.10"
+  resolved "https://registry.yarnpkg.com/pako/-/pako-1.0.10.tgz#4328badb5086a426aa90f541977d4955da5c9732"
+  integrity sha512-0DTvPVU3ed8+HNXOu5Bs+o//Mbdj9VNQMUOe9oKCwh8l0GNwpTDMKCWbRjgtD291AWnkAgkqA/LOnQS8AmS1tw==
 
 parallel-transform@^1.1.0:
   version "1.1.0"
@@ -11951,15 +11372,16 @@ param-case@2.1.x:
     no-case "^2.2.0"
 
 parse-asn1@^5.0.0:
-  version "5.1.1"
-  resolved "https://registry.yarnpkg.com/parse-asn1/-/parse-asn1-5.1.1.tgz#f6bf293818332bd0dab54efb16087724745e6ca8"
-  integrity sha512-KPx7flKXg775zZpnp9SxJlz00gTd4BmJ2yJufSc44gMCRrRQ7NSzAcSJQfifuOLgW6bEi+ftrALtsgALeB2Adw==
+  version "5.1.4"
+  resolved "https://registry.yarnpkg.com/parse-asn1/-/parse-asn1-5.1.4.tgz#37f6628f823fbdeb2273b4d540434a22f3ef1fcc"
+  integrity sha512-Qs5duJcuvNExRfFZ99HDD3z4mAi3r9Wl/FOjEOijlxwCZs7E7mW2vjTpgQ4J8LpTF8x5v+1Vn5UQFejmWT11aw==
   dependencies:
     asn1.js "^4.0.0"
     browserify-aes "^1.0.0"
     create-hash "^1.1.0"
     evp_bytestokey "^1.0.0"
     pbkdf2 "^3.0.3"
+    safe-buffer "^5.1.1"
 
 parse-bmfont-ascii@^1.0.3:
   version "1.0.6"
@@ -11990,9 +11412,9 @@ parse-english@^4.0.0:
     unist-util-visit-children "^1.0.0"
 
 parse-entities@^1.0.2, parse-entities@^1.1.2:
-  version "1.2.0"
-  resolved "https://registry.npmjs.org/parse-entities/-/parse-entities-1.2.0.tgz#9deac087661b2e36814153cb78d7e54a4c5fd6f4"
-  integrity sha512-XXtDdOPLSB0sHecbEapQi6/58U/ODj/KWfIXmmMCJF/eRn8laX6LZbOyioMoETOOJoWRW8/qTSl5VQkUIfKM5g==
+  version "1.2.1"
+  resolved "https://registry.yarnpkg.com/parse-entities/-/parse-entities-1.2.1.tgz#2c761ced065ba7dc68148580b5a225e4918cdd69"
+  integrity sha512-NBWYLQm1KSoDKk7GAHyioLTvCZ5QjdH/ASBBQTD3iLiAWJXS5bg1jEWI8nIJ+vgVvsceBVBcDGRWSo0KVQBvvg==
   dependencies:
     character-entities "^1.0.0"
     character-entities-legacy "^1.0.0"
@@ -12021,12 +11443,12 @@ parse-glob@^3.0.4:
     is-glob "^2.0.0"
 
 parse-headers@^2.0.0:
-  version "2.0.1"
-  resolved "https://registry.yarnpkg.com/parse-headers/-/parse-headers-2.0.1.tgz#6ae83a7aa25a9d9b700acc28698cd1f1ed7e9536"
-  integrity sha1-aug6eqJanZtwCswoaYzR8e1+lTY=
+  version "2.0.2"
+  resolved "https://registry.yarnpkg.com/parse-headers/-/parse-headers-2.0.2.tgz#9545e8a4c1ae5eaea7d24992bca890281ed26e34"
+  integrity sha512-/LypJhzFmyBIDYP9aDVgeyEb5sQfbfY5mnDq4hVhlQ69js87wXfmEI5V3xI6vvXasqebp0oCytYFLxsBVfCzSg==
   dependencies:
-    for-each "^0.3.2"
-    trim "0.0.1"
+    for-each "^0.3.3"
+    string.prototype.trim "^1.1.2"
 
 parse-json@^2.1.0, parse-json@^2.2.0:
   version "2.2.0"
@@ -12061,6 +11483,11 @@ parse-latin@^4.0.0:
     unist-util-modify-children "^1.0.0"
     unist-util-visit-children "^1.0.0"
 
+parse-node-version@^1.0.0:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/parse-node-version/-/parse-node-version-1.0.1.tgz#e2b5dbede00e7fa9bc363607f53327e8b073189b"
+  integrity sha512-3YHlOa/JgH6Mnpr05jP9eDG254US9ek25LyIxZlDItp2iJtwyaXQb57lBYLdT3MowkUFYEV2XXNAYIPlESvJlA==
+
 parse-passwd@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/parse-passwd/-/parse-passwd-1.0.0.tgz#6d5b934a456993b23d37f40a382d6f1666a8e5c6"
@@ -12139,7 +11566,7 @@ path-key@^2.0.0, path-key@^2.0.1:
   resolved "https://registry.yarnpkg.com/path-key/-/path-key-2.0.1.tgz#411cadb574c5a140d3a4b1910d40d80cc9f40b40"
   integrity sha1-QRyttXTFoUDTpLGRDUDYDMn0C0A=
 
-path-parse@^1.0.5, path-parse@^1.0.6:
+path-parse@^1.0.6:
   version "1.0.6"
   resolved "https://registry.yarnpkg.com/path-parse/-/path-parse-1.0.6.tgz#d62dbb5679405d72c4737ec58600e9ddcf06d24c"
   integrity sha512-GSmOT2EbHrINBf9SR7CDELwlJ8AENk3Qn7OikK4nFYAu3Ote2+JYNVvkpAEQm3/TLNEJFD/xZJjzyxg3KBWOzw==
@@ -12223,9 +11650,9 @@ performance-now@^2.1.0:
   integrity sha1-Ywn04OX6kT7BxpMHrjZLSzd8nns=
 
 phin@^2.9.1:
-  version "2.9.2"
-  resolved "https://registry.yarnpkg.com/phin/-/phin-2.9.2.tgz#0a82d5b6dd75552b665f371f8060689c1af7336e"
-  integrity sha512-j+UOz1qs+k8NlBRws2IF+Qd+YsVKcqIjvYPBEP9IpmhyvLvyN6GTuqsGbsqH3fIgHufqVqLQSttidIgshkgT7w==
+  version "2.9.3"
+  resolved "https://registry.yarnpkg.com/phin/-/phin-2.9.3.tgz#f9b6ac10a035636fb65dfc576aaaa17b8743125c"
+  integrity sha512-CzFr90qM24ju5f88quFC/6qohjC144rehe5n6DH900lgXmUe86+xCKc10ev56gRKC4/BkHUoG4uSiQgBiIXwDA==
 
 pify@^2.0.0, pify@^2.3.0:
   version "2.3.0"
@@ -12282,13 +11709,6 @@ pkg-dir@^1.0.0:
   dependencies:
     find-up "^1.0.0"
 
-pkg-dir@^2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/pkg-dir/-/pkg-dir-2.0.0.tgz#f6d5d1109e19d63edf428e0bd57e12777615334b"
-  integrity sha1-9tXREJ4Z1j7fQo4L1X4Sd3YVM0s=
-  dependencies:
-    find-up "^2.1.0"
-
 pkg-dir@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/pkg-dir/-/pkg-dir-3.0.0.tgz#2749020f239ed990881b1f71210d51eb6523bea3"
@@ -12333,16 +11753,6 @@ pngquant-bin@^3.0.0:
     bin-wrapper "^3.0.0"
     logalot "^2.0.0"
 
-pngquant-bin@^5.0.0:
-  version "5.0.0"
-  resolved "https://registry.yarnpkg.com/pngquant-bin/-/pngquant-bin-5.0.0.tgz#91df99c15b0492cb30b001746a10a67d3202509e"
-  integrity sha512-oJ9Kcmm5oSFkgvYB32bopBN0F6lw0OBnVY36IpkIteBLKt9s8EswiOzAsbSVZ79I8zrvoP/i8IcQPZxsORCOfg==
-  dependencies:
-    bin-build "^3.0.0"
-    bin-wrapper "^3.0.0"
-    execa "^0.10.0"
-    logalot "^2.0.0"
-
 polished@^2.3.3:
   version "2.3.3"
   resolved "https://registry.yarnpkg.com/polished/-/polished-2.3.3.tgz#bdbaba962ba8271b0e11aa287f2befd4c87be99a"
@@ -12350,17 +11760,10 @@ polished@^2.3.3:
   dependencies:
     "@babel/runtime" "^7.2.0"
 
-polished@^3.0.3:
-  version "3.0.3"
-  resolved "https://registry.yarnpkg.com/polished/-/polished-3.0.3.tgz#b7d9604936f6dc40031306f3a1136585fc3471b5"
-  integrity sha512-WFgVHAWJubobUzk5B5dcqS2jGw8hB/I/H5hXitR4jd/bvEZBQV4vlw5UGDhLxkLQ1incf9NMFztI4XAryHvJDA==
-  dependencies:
-    "@babel/runtime" "^7.3.1"
-
 popper.js@^1.14.4:
-  version "1.14.6"
-  resolved "https://registry.yarnpkg.com/popper.js/-/popper.js-1.14.6.tgz#ab20dd4edf9288b8b3b6531c47c361107b60b4b0"
-  integrity sha512-AGwHGQBKumlk/MDfrSOf0JHhJCImdDMcGNoqKmKkU+68GFazv3CQ6q9r7Ja1sKDZmYWTckY/uLyEznheTDycnA==
+  version "1.14.7"
+  resolved "https://registry.yarnpkg.com/popper.js/-/popper.js-1.14.7.tgz#e31ec06cfac6a97a53280c3e55e4e0c860e7738e"
+  integrity sha512-4q1hNvoUre/8srWsH7hnoSJ5xVmIL4qgz+s4qf2TnJIMyZFUFMGH+9vE7mXynAlHSZ/NdTmmow86muD0myUkVQ==
 
 posix-character-classes@^0.1.0:
   version "0.1.1"
@@ -12754,9 +12157,9 @@ postcss-minify-selectors@^2.0.4:
     postcss-selector-parser "^2.0.0"
 
 postcss-modules-extract-imports@^1.0.0:
-  version "1.1.0"
-  resolved "https://registry.yarnpkg.com/postcss-modules-extract-imports/-/postcss-modules-extract-imports-1.1.0.tgz#b614c9720be6816eaee35fb3a5faa1dba6a05ddb"
-  integrity sha1-thTJcgvmgW6u41+zpfqh26agXds=
+  version "1.2.1"
+  resolved "https://registry.yarnpkg.com/postcss-modules-extract-imports/-/postcss-modules-extract-imports-1.2.1.tgz#dc87e34148ec7eab5f791f7cd5849833375b741a"
+  integrity sha512-6jt9XZwUhwmRUhb/CkyJY020PYaPJsCyt3UjbaWo6XEbH/94Hmv6MP7fG2C5NDU/BcHzyGYxNtHvM+LTf9HrYw==
   dependencies:
     postcss "^6.0.1"
 
@@ -12776,12 +12179,12 @@ postcss-modules-local-by-default@^1.0.1:
     postcss "^6.0.1"
 
 postcss-modules-local-by-default@^2.0.3:
-  version "2.0.4"
-  resolved "https://registry.yarnpkg.com/postcss-modules-local-by-default/-/postcss-modules-local-by-default-2.0.4.tgz#a000bb07e4f57f412ba35c904d035cfd4a7b9446"
-  integrity sha512-WvuSaTKXUqYJbnT7R3YrsNrHv/C5vRfr5VglS4bFOk0MYT4CLBfc/xgExA+x2RftlYgiBDvWmVs191Xv8S8gZQ==
+  version "2.0.6"
+  resolved "https://registry.yarnpkg.com/postcss-modules-local-by-default/-/postcss-modules-local-by-default-2.0.6.tgz#dd9953f6dd476b5fd1ef2d8830c8929760b56e63"
+  integrity sha512-oLUV5YNkeIBa0yQl7EYnxMgy4N6noxmiwZStaEJUSe2xPMcdNc8WmBQuQCx18H5psYbVxz8zoHk0RAAYZXP9gA==
   dependencies:
-    css-selector-tokenizer "^0.7.0"
     postcss "^7.0.6"
+    postcss-selector-parser "^6.0.0"
     postcss-value-parser "^3.3.1"
 
 postcss-modules-scope@^1.0.0:
@@ -12793,12 +12196,12 @@ postcss-modules-scope@^1.0.0:
     postcss "^6.0.1"
 
 postcss-modules-scope@^2.0.0:
-  version "2.0.1"
-  resolved "https://registry.yarnpkg.com/postcss-modules-scope/-/postcss-modules-scope-2.0.1.tgz#2c0f2394cde4cd09147db054c68917e38f6d43a4"
-  integrity sha512-7+6k9c3/AuZ5c596LJx9n923A/j3nF3ormewYBF1RrIQvjvjXe1xE8V8A1KFyFwXbvnshT6FBZFX0k/F1igneg==
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/postcss-modules-scope/-/postcss-modules-scope-2.1.0.tgz#ad3f5bf7856114f6fcab901b0502e2a2bc39d4eb"
+  integrity sha512-91Rjps0JnmtUB0cujlc8KIKCsJXWjzuxGeT/+Q2i2HXKZ7nBUeF9YQTZZTNvHVoNYj1AthsjnGLtqDUE0Op79A==
   dependencies:
-    css-selector-tokenizer "^0.7.0"
     postcss "^7.0.6"
+    postcss-selector-parser "^6.0.0"
 
 postcss-modules-values@^1.1.0:
   version "1.3.0"
@@ -12938,6 +12341,15 @@ postcss-selector-parser@^2.0.0, postcss-selector-parser@^2.2.0, postcss-selector
     indexes-of "^1.0.1"
     uniq "^1.0.1"
 
+postcss-selector-parser@^6.0.0:
+  version "6.0.1"
+  resolved "https://registry.yarnpkg.com/postcss-selector-parser/-/postcss-selector-parser-6.0.1.tgz#7ee5476d0fc52f27b25122a361f160b9cf39b0ff"
+  integrity sha512-bg46FvHx2lSHput5J4xCiCHrRxjza73jceSW8JcOVNzCEnlhuZF7pLa7K0KpNt8whL7C8V5wdb0bSrCRg0w13g==
+  dependencies:
+    cssesc "^3.0.0"
+    indexes-of "^1.0.1"
+    uniq "^1.0.1"
+
 postcss-svgo@^2.1.1:
   version "2.1.6"
   resolved "https://registry.yarnpkg.com/postcss-svgo/-/postcss-svgo-2.1.6.tgz#b6df18aa613b666e133f08adb5219c2684ac108d"
@@ -12981,7 +12393,7 @@ postcss@^5.0.0, postcss@^5.0.10, postcss@^5.0.11, postcss@^5.0.12, postcss@^5.0.
     source-map "^0.5.6"
     supports-color "^3.2.3"
 
-postcss@^6.0.1, postcss@^6.0.14:
+postcss@^6.0.1:
   version "6.0.23"
   resolved "https://registry.yarnpkg.com/postcss/-/postcss-6.0.23.tgz#61c82cc328ac60e677645f979054eb98bc0e3324"
   integrity sha512-soOk1h6J3VMTZtVeVpv15/Hpdl2cBLX3CAw4TAbkpTJiNPk9YP/zWcD1ND+xEtvyuuvKzbxliTOIyvkSeSJ6ag==
@@ -12990,16 +12402,7 @@ postcss@^6.0.1, postcss@^6.0.14:
     source-map "^0.6.1"
     supports-color "^5.4.0"
 
-postcss@^7.0.0, postcss@^7.0.6:
-  version "7.0.6"
-  resolved "https://registry.yarnpkg.com/postcss/-/postcss-7.0.6.tgz#6dcaa1e999cdd4a255dcd7d4d9547f4ca010cdc2"
-  integrity sha512-Nq/rNjnHFcKgCDDZYO0lNsl6YWe6U7tTy+ESN+PnLxebL8uBtYX59HZqvrj7YLK5UCyll2hqDsJOo3ndzEW8Ug==
-  dependencies:
-    chalk "^2.4.1"
-    source-map "^0.6.1"
-    supports-color "^5.5.0"
-
-postcss@^7.0.14:
+postcss@^7.0.0, postcss@^7.0.14, postcss@^7.0.5, postcss@^7.0.6:
   version "7.0.14"
   resolved "https://registry.yarnpkg.com/postcss/-/postcss-7.0.14.tgz#4527ed6b1ca0d82c53ce5ec1a2041c2346bbd6e5"
   integrity sha512-NsbD6XUUMZvBxtQAJuWDJeeC4QFsmWsfozWxCJPWf3M55K9iu2iMDaKqyoOdTJ1R4usBXuxlVFAIo8rZPQD4Bg==
@@ -13008,15 +12411,6 @@ postcss@^7.0.14:
     source-map "^0.6.1"
     supports-color "^6.1.0"
 
-postcss@^7.0.5:
-  version "7.0.7"
-  resolved "https://registry.yarnpkg.com/postcss/-/postcss-7.0.7.tgz#2754d073f77acb4ef08f1235c36c5721a7201614"
-  integrity sha512-HThWSJEPkupqew2fnuQMEI2YcTj/8gMV3n80cMdJsKxfIh5tHf7nM5JigNX6LxVMqo6zkgQNAI88hyFvBk41Pg==
-  dependencies:
-    chalk "^2.4.1"
-    source-map "^0.6.1"
-    supports-color "^5.5.0"
-
 potrace@^2.1.1:
   version "2.1.1"
   resolved "https://registry.yarnpkg.com/potrace/-/potrace-2.1.1.tgz#79111a858197f366418845f667fe8f7fac0a79db"
@@ -13045,28 +12439,6 @@ prebuild-install@^4.0.0:
     tunnel-agent "^0.6.0"
     which-pm-runs "^1.0.0"
 
-prebuild-install@^5.2.0:
-  version "5.2.1"
-  resolved "https://registry.yarnpkg.com/prebuild-install/-/prebuild-install-5.2.1.tgz#87ba8cf17c65360a75eefeb3519e87973bf9791d"
-  integrity sha512-9DAccsInWHB48TBQi2eJkLPE049JuAI6FjIH0oIrij4bpDVEbX6JvlWRAcAAlUqBHhjgq0jNqA3m3bBXWm9v6w==
-  dependencies:
-    detect-libc "^1.0.3"
-    expand-template "^1.0.2"
-    github-from-package "0.0.0"
-    minimist "^1.2.0"
-    mkdirp "^0.5.1"
-    napi-build-utils "^1.0.1"
-    node-abi "^2.2.0"
-    noop-logger "^0.1.1"
-    npmlog "^4.0.1"
-    os-homedir "^1.0.1"
-    pump "^2.0.1"
-    rc "^1.2.7"
-    simple-get "^2.7.0"
-    tar-fs "^1.13.0"
-    tunnel-agent "^0.6.0"
-    which-pm-runs "^1.0.0"
-
 prelude-ls@~1.1.2:
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/prelude-ls/-/prelude-ls-1.1.2.tgz#21932a549f5e52ffd9a827f570e04be62a97da54"
@@ -13124,11 +12496,6 @@ probe-image-size@^4.0.0:
     request "^2.83.0"
     stream-parser "~0.3.1"
 
-process-nextick-args@~1.0.6:
-  version "1.0.7"
-  resolved "https://registry.yarnpkg.com/process-nextick-args/-/process-nextick-args-1.0.7.tgz#150e20b756590ad3f91093f25a4f2ad8bff30ba3"
-  integrity sha1-FQ4gt1ZZCtP5EJPyWk8q2L/zC6M=
-
 process-nextick-args@~2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/process-nextick-args/-/process-nextick-args-2.0.0.tgz#a37d732f4271b4ab1ad070d35508e8290788ffaa"
@@ -13182,15 +12549,7 @@ promise.prototype.finally@^3.1.0:
   dependencies:
     asap "~2.0.3"
 
-prop-types@^15.5.10, prop-types@^15.5.4, prop-types@^15.5.6, prop-types@^15.5.8, prop-types@^15.6.0, prop-types@^15.6.1, prop-types@^15.6.2:
-  version "15.7.1"
-  resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.7.1.tgz#2fa61e0a699d428b40320127733ee2931f05d9d1"
-  integrity sha512-f8Lku2z9kERjOCcnDOPm68EBJAO2K00Q5mSgPAUE/gJuBgsYLbVy6owSrtcHj90zt8PvW+z0qaIIgsIhHOa1Qw==
-  dependencies:
-    object-assign "^4.1.1"
-    react-is "^16.8.1"
-
-prop-types@^15.7.2:
+prop-types@^15.5.10, prop-types@^15.5.4, prop-types@^15.5.6, prop-types@^15.5.8, prop-types@^15.6.0, prop-types@^15.6.1, prop-types@^15.6.2, prop-types@^15.7.2:
   version "15.7.2"
   resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.7.2.tgz#52c41e75b8c87e72b9d9360e0206b99dcbffa6c5"
   integrity sha512-8QQikdH7//R2vurIJSutZ1smHYTcLpRWEOlHnzcWHmBYrOGUysKwSsrC89BCiFj3CbrfJ/nXFdJepOVrY1GCHQ==
@@ -13264,9 +12623,9 @@ pseudomap@^1.0.2:
   integrity sha1-8FKijacOYYkX7wqKw0wa5aaChrM=
 
 psl@^1.1.24:
-  version "1.1.29"
-  resolved "https://registry.yarnpkg.com/psl/-/psl-1.1.29.tgz#60f580d360170bb722a797cc704411e6da850c67"
-  integrity sha512-AeUmQ0oLN02flVHXWh9sSJF7mcdFq0ppid/JkErufc3hGIV/AMa8Fo9VgDo/cT2jFdOWoFvHp90qqBH54W+gjQ==
+  version "1.1.31"
+  resolved "https://registry.yarnpkg.com/psl/-/psl-1.1.31.tgz#e9aa86d0101b5b105cbe93ac6b784cd547276184"
+  integrity sha512-/6pt4+C+T+wZUieKR620OpzN/LlnNKuWjy1iFLQ/UG35JqHlR/89MP1d96dUfkf6Dne3TuLQzOYEYshJ+Hx8mw==
 
 public-encrypt@^4.0.0:
   version "4.0.3"
@@ -13372,18 +12731,18 @@ ramda@^0.21.0:
   integrity sha1-oAGr7bP/YQd9T/HVd9RN536NCjU=
 
 randomatic@^3.0.0:
-  version "3.1.0"
-  resolved "https://registry.yarnpkg.com/randomatic/-/randomatic-3.1.0.tgz#36f2ca708e9e567f5ed2ec01949026d50aa10116"
-  integrity sha512-KnGPVE0lo2WoXxIZ7cPR8YBpiol4gsSuOwDSg410oHh80ZMp5EiypNqL2K4Z77vJn6lB5rap7IkAmcUlalcnBQ==
+  version "3.1.1"
+  resolved "https://registry.yarnpkg.com/randomatic/-/randomatic-3.1.1.tgz#b776efc59375984e36c537b2f51a1f0aff0da1ed"
+  integrity sha512-TuDE5KxZ0J461RVjrJZCJc+J+zCkTb1MbH9AQUq68sMhOMcy9jLcb3BrZKgp9q9Ncltdg4QVqWrH02W2EFFVYw==
   dependencies:
     is-number "^4.0.0"
     kind-of "^6.0.0"
     math-random "^1.0.1"
 
 randombytes@^2.0.0, randombytes@^2.0.1, randombytes@^2.0.5:
-  version "2.0.6"
-  resolved "https://registry.yarnpkg.com/randombytes/-/randombytes-2.0.6.tgz#d302c522948588848a8d300c932b44c24231da80"
-  integrity sha512-CIQ5OFxf4Jou6uOKe9t1AOgqpeU5fd70A8NPdHSGeYXqXsPe6peOwI0cUl88RWZ6sP1vPMV3avd/R6cZ5/sP1A==
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/randombytes/-/randombytes-2.1.0.tgz#df6f84372f0270dc65cdf6291349ab7a473d4f2a"
+  integrity sha512-vYl3iOX+4CKUWuxGi9Ukhie6fsqXqS9FE2Zaic4tNFD2N2QQaXOMFbuKK4QmDHC0JO6B1Zp41J0LpT0oR68amQ==
   dependencies:
     safe-buffer "^5.1.0"
 
@@ -13447,9 +12806,9 @@ react-deep-force-update@^2.1.1:
   integrity sha512-lqD4eHKVuB65RyO/hGbEST53E2/GPbcIPcFYyeW/p4vNngtH4G7jnKGlU6u1OqrFo0uNfIvwuBOg98IbLHlNEA==
 
 react-dev-utils@^4.2.1:
-  version "4.2.2"
-  resolved "https://registry.yarnpkg.com/react-dev-utils/-/react-dev-utils-4.2.2.tgz#e8f2ffdbf27bfb13ee88ac18e20c83163aac0659"
-  integrity sha512-HwN0EE+9DS7wB0kKy6Bc5kUTUGUAOyZorJeb+ZGeTrxd1ZNwEJn1TfCRuNpRRa+Iu3VeYBcQ2pjuordJ4eqmfA==
+  version "4.2.3"
+  resolved "https://registry.yarnpkg.com/react-dev-utils/-/react-dev-utils-4.2.3.tgz#5b42d9ea58d5e9e017a2f57a40a8af408a3a46fb"
+  integrity sha512-uvmkwl5uMexCmC0GUv1XGQP0YjfYePJufGg4YYiukhqk2vN1tQxwWJIBERqhOmSi80cppZg8mZnPP/kOMf1sUQ==
   dependencies:
     address "1.0.3"
     babel-code-frame "6.26.0"
@@ -13471,33 +12830,33 @@ react-dev-utils@^4.2.1:
     text-table "0.2.0"
 
 react-dev-utils@^7.0.0, react-dev-utils@^7.0.1:
-  version "7.0.1"
-  resolved "https://registry.yarnpkg.com/react-dev-utils/-/react-dev-utils-7.0.1.tgz#c53e759a22668ee2c0d146c24ce4bdec2b41e3c8"
-  integrity sha512-AN/RKZKHsyB2FebKSyMLOecvjuzZ54lzsLYF8wNmwwgRA3dVC4vhYsafvME7JD4q7RUB0bejqFWjOS9QtN48Zg==
+  version "7.0.3"
+  resolved "https://registry.yarnpkg.com/react-dev-utils/-/react-dev-utils-7.0.3.tgz#f1316cfffd792fd41b0c28ad5db86c1d74484d6f"
+  integrity sha512-KEFsH1CewnmddPLXIuU+QWKTH/hpJKZClL2+74XN54NkPnR2KnB5gGmuQ0E7DwcCkUpdMxxqBX+rB7aB5sZS4A==
   dependencies:
     "@babel/code-frame" "7.0.0"
     address "1.0.3"
-    browserslist "4.1.1"
-    chalk "2.4.1"
+    browserslist "4.4.1"
+    chalk "2.4.2"
     cross-spawn "6.0.5"
     detect-port-alt "1.1.6"
     escape-string-regexp "1.0.5"
     filesize "3.6.1"
     find-up "3.0.0"
-    global-modules "1.0.0"
-    globby "8.0.1"
+    global-modules "2.0.0"
+    globby "8.0.2"
     gzip-size "5.0.0"
-    immer "1.7.2"
-    inquirer "6.2.0"
+    immer "1.10.0"
+    inquirer "6.2.1"
     is-root "2.0.0"
-    loader-utils "1.1.0"
+    loader-utils "1.2.3"
     opn "5.4.0"
     pkg-up "2.0.0"
-    react-error-overlay "^5.1.2"
+    react-error-overlay "^5.1.3"
     recursive-readdir "2.2.2"
     shell-quote "1.6.1"
-    sockjs-client "1.1.5"
-    strip-ansi "4.0.0"
+    sockjs-client "1.3.0"
+    strip-ansi "5.0.0"
     text-table "0.2.0"
 
 react-docgen@^3.0.0:
@@ -13531,30 +12890,20 @@ react-dom@^15.6.0:
     object-assign "^4.1.0"
     prop-types "^15.5.10"
 
-react-dom@^16.8.1:
-  version "16.8.2"
-  resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-16.8.2.tgz#7c8a69545dd554d45d66442230ba04a6a0a3c3d3"
-  integrity sha512-cPGfgFfwi+VCZjk73buu14pYkYBR1b/SRMSYqkLDdhSEHnSwcuYTPu6/Bh6ZphJFIk80XLvbSe2azfcRzNF+Xg==
+react-dom@^16.8.1, react-dom@^16.8.3:
+  version "16.8.4"
+  resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-16.8.4.tgz#1061a8e01a2b3b0c8160037441c3bf00a0e3bc48"
+  integrity sha512-Ob2wK7XG2tUDt7ps7LtLzGYYB6DXMCLj0G5fO6WeEICtT4/HdpOi7W/xLzZnR6RCG1tYza60nMdqtxzA8FaPJQ==
   dependencies:
     loose-envify "^1.1.0"
     object-assign "^4.1.1"
     prop-types "^15.6.2"
-    scheduler "^0.13.2"
-
-react-dom@^16.8.3:
-  version "16.8.3"
-  resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-16.8.3.tgz#ae236029e66210783ac81999d3015dfc475b9c32"
-  integrity sha512-ttMem9yJL4/lpItZAQ2NTFAbV7frotHk5DZEHXUOws2rMmrsvh1Na7ThGT0dTzUIl6pqTOi5tYREfL8AEna3lA==
-  dependencies:
-    loose-envify "^1.1.0"
-    object-assign "^4.1.1"
-    prop-types "^15.6.2"
-    scheduler "^0.13.3"
+    scheduler "^0.13.4"
 
 react-draggable@^3.1.1:
-  version "3.1.1"
-  resolved "https://registry.yarnpkg.com/react-draggable/-/react-draggable-3.1.1.tgz#ed1db43e09b146805f6d158296e58eae4f768d36"
-  integrity sha512-tqIgDUm4XPSFbxelYpcsnayPU79P26ChnszDl5/RDFKfMuHnRxypS+OFfEyAEO1CtqaB3lrecQ2dyNIE2G0TlQ==
+  version "3.2.1"
+  resolved "https://registry.yarnpkg.com/react-draggable/-/react-draggable-3.2.1.tgz#45d09a9a227988dc85674b23ab3c75b6e820dae5"
+  integrity sha512-r+3Bs9InID2lyIEbR8UIRVtpn4jgu1ArFEZgIy8vibJjijLSdNLX7rH9U68BBVD4RD9v44RXbaK4EHLyKXzNQw==
   dependencies:
     classnames "^2.2.5"
     prop-types "^15.6.0"
@@ -13564,10 +12913,10 @@ react-error-overlay@^3.0.0:
   resolved "https://registry.yarnpkg.com/react-error-overlay/-/react-error-overlay-3.0.0.tgz#c2bc8f4d91f1375b3dad6d75265d51cd5eeaf655"
   integrity sha512-XzgvowFrwDo6TWcpJ/WTiarb9UI6lhA4PMzS7n1joK3sHfBBBOQHUc0U4u57D6DWO9vHv6lVSWx2Q/Ymfyv4hw==
 
-react-error-overlay@^5.1.2:
-  version "5.1.2"
-  resolved "https://registry.yarnpkg.com/react-error-overlay/-/react-error-overlay-5.1.2.tgz#888957b884d4b25b083a82ad550f7aad96585394"
-  integrity sha512-7kEBKwU9R8fKnZJBRa5RSIfay4KJwnYvKB6gODGicUmDSAhQJ7Tdnll5S0RLtYrzRfMVXlqYw61rzrSpP4ThLQ==
+react-error-overlay@^5.1.3:
+  version "5.1.3"
+  resolved "https://registry.yarnpkg.com/react-error-overlay/-/react-error-overlay-5.1.3.tgz#16fcbde75ed4dc6161dc6dc959b48e92c6ffa9ad"
+  integrity sha512-GoqeM3Xadie7XUApXOjkY3Qhs8RkwB/Za4WMedBGrOKH1eTuKGyoAECff7jiVonJchOx6KZ9i8ILO5XIoHB+Tg==
 
 react-fast-compare@^2.0.2:
   version "2.0.4"
@@ -13622,15 +12971,7 @@ react-hotkeys@2.0.0-pre4:
   dependencies:
     prop-types "^15.6.1"
 
-react-inspector@^2.3.0:
-  version "2.3.0"
-  resolved "https://registry.yarnpkg.com/react-inspector/-/react-inspector-2.3.0.tgz#fc9c1d38ab687fc0d190dcaf133ae40158968fc8"
-  integrity sha512-aIcbWb0fKFhEMB+RadoOYawlr1JoMMfrQ1oRgPUG/f/e4zERVJ6nYcIaQmrQmdHCZ63BOqe2cEkoeY0kyLBzNg==
-  dependencies:
-    babel-runtime "^6.26.0"
-    is-dom "^1.0.9"
-
-react-inspector@^2.3.1:
+react-inspector@^2.3.0, react-inspector@^2.3.1:
   version "2.3.1"
   resolved "https://registry.yarnpkg.com/react-inspector/-/react-inspector-2.3.1.tgz#f0eb7f520669b545b441af9d38ec6d706e5f649c"
   integrity sha512-tUUK7t3KWgZEIUktOYko5Ic/oYwvjEvQUFAGC1UeMeDaQ5za2yZFtItJa2RTwBJB//NxPr000WQK6sEbqC6y0Q==
@@ -13639,20 +12980,10 @@ react-inspector@^2.3.1:
     is-dom "^1.0.9"
     prop-types "^15.6.1"
 
-react-is@^16.6.0, react-is@^16.7.0:
-  version "16.8.3"
-  resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.8.3.tgz#4ad8b029c2a718fc0cfc746c8d4e1b7221e5387d"
-  integrity sha512-Y4rC1ZJmsxxkkPuMLwvKvlL1Zfpbcu+Bf4ZigkHup3v9EfdYhAlWAaVyA19olXq2o2mGn0w+dFKvk3pVVlYcIA==
-
-react-is@^16.8.1:
-  version "16.8.1"
-  resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.8.1.tgz#a80141e246eb894824fb4f2901c0c50ef31d4cdb"
-  integrity sha512-ioMCzVDWvCvKD8eeT+iukyWrBGrA3DiFYkXfBsVYIRdaREZuBjENG+KjrikavCLasozqRWTwFUagU/O4vPpRMA==
-
-react-lazyload@^2.5.0:
-  version "2.5.0"
-  resolved "https://registry.yarnpkg.com/react-lazyload/-/react-lazyload-2.5.0.tgz#7ed20bf0408dc684c10e808060e51d904cc0ab8d"
-  integrity sha512-RkEwpJDqEUVkXodxBXAI/UDyGYUBTZCU9kdG0Lwmg8BIv8zDvP+exFwUzc7wP4HX6n33CCsz+cjG2FpwdRoxpw==
+react-is@^16.6.0, react-is@^16.8.1:
+  version "16.8.4"
+  resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.8.4.tgz#90f336a68c3a29a096a3d648ab80e87ec61482a2"
+  integrity sha512-PVadd+WaUDOAciICm/J1waJaSvgq+4rHE/K70j0PFqKhkTBsPv/82UGQJNXAngz1fOQLLxI6z1sEDmJDQhCTAA==
 
 react-lifecycles-compat@^3.0.0, react-lifecycles-compat@^3.0.2, react-lifecycles-compat@^3.0.4:
   version "3.0.4"
@@ -13669,15 +13000,7 @@ react-modal@^3.8.1:
     react-lifecycles-compat "^3.0.0"
     warning "^3.0.0"
 
-react-popper-tooltip@^2.8.0:
-  version "2.8.0"
-  resolved "https://registry.yarnpkg.com/react-popper-tooltip/-/react-popper-tooltip-2.8.0.tgz#777e710e4696bd1b8e1a1ef24a6e3375e0206609"
-  integrity sha512-jjw8dHwSbQNPp2JglgJbKF/E08FLAaMkjkW8Czgd53IPmtCPU58xCDSLQfKx+3Tk9tEEPFTXWxUWUN6cnTwFkA==
-  dependencies:
-    "@babel/runtime" "^7.2.0"
-    react-popper "^1.3.2"
-
-react-popper-tooltip@^2.8.1:
+react-popper-tooltip@^2.8.0, react-popper-tooltip@^2.8.1:
   version "2.8.1"
   resolved "https://registry.yarnpkg.com/react-popper-tooltip/-/react-popper-tooltip-2.8.1.tgz#bbaec88b729e3b7e9f26521857e7f908bccdecf3"
   integrity sha512-eL0PT5yz9H9lkG934TMh7czZWwDlqFady7CcJKMP5RcmBxTFBY4U7k71FEyxNaHd07nhMhUwbk0/Fgf2yw3LEg==
@@ -13685,18 +13008,6 @@ react-popper-tooltip@^2.8.1:
     "@babel/runtime" "^7.3.4"
     react-popper "^1.3.3"
 
-react-popper@^1.3.2:
-  version "1.3.2"
-  resolved "https://registry.yarnpkg.com/react-popper/-/react-popper-1.3.2.tgz#e723a0a7fe1c42099a13e5d494e9d7d74b352af4"
-  integrity sha512-UbFWj55Yt9uqvy0oZ+vULDL2Bw1oxeZF9/JzGyxQ5ypgauRH/XlarA5+HLZWro/Zss6Ht2kqpegtb6sYL8GUGw==
-  dependencies:
-    "@babel/runtime" "^7.1.2"
-    create-react-context "<=0.2.2"
-    popper.js "^1.14.4"
-    prop-types "^15.6.1"
-    typed-styles "^0.0.7"
-    warning "^4.0.2"
-
 react-popper@^1.3.3:
   version "1.3.3"
   resolved "https://registry.yarnpkg.com/react-popper/-/react-popper-1.3.3.tgz#2c6cef7515a991256b4f0536cd4bdcb58a7b6af6"
@@ -13797,10 +13108,11 @@ react-syntax-highlighter@^8.0.1:
     refractor "^2.4.1"
 
 react-textarea-autosize@^7.0.4:
-  version "7.0.4"
-  resolved "https://registry.yarnpkg.com/react-textarea-autosize/-/react-textarea-autosize-7.0.4.tgz#4e4be649b544a88713e7b5043f76950f35d3d503"
-  integrity sha512-1cC8pFSrIVH92aE+UKxGQ2Gqq43qdIcMscJKScEFeBNemn6gHa+NwKqdXkHxxg5H6uuvW+cPpJPTes6zh90M+A==
+  version "7.1.0"
+  resolved "https://registry.yarnpkg.com/react-textarea-autosize/-/react-textarea-autosize-7.1.0.tgz#3132cb77e65d94417558d37c0bfe415a5afd3445"
+  integrity sha512-c2FlR/fP0qbxmlrW96SdrbgP/v0XZMTupqB90zybvmDVDutytUgPl7beU35klwcTeMepUIQEpQUn3P3bdshGPg==
   dependencies:
+    "@babel/runtime" "^7.1.2"
     prop-types "^15.6.0"
 
 react-transition-group@^1.2.0:
@@ -13825,25 +13137,15 @@ react@^15.6.0:
     object-assign "^4.1.0"
     prop-types "^15.5.10"
 
-react@^16.8.1:
-  version "16.8.2"
-  resolved "https://registry.yarnpkg.com/react/-/react-16.8.2.tgz#83064596feaa98d9c2857c4deae1848b542c9c0c"
-  integrity sha512-aB2ctx9uQ9vo09HVknqv3DGRpI7OIGJhCx3Bt0QqoRluEjHSaObJl+nG12GDdYH6sTgE7YiPJ6ZUyMx9kICdXw==
+react@^16.8.1, react@^16.8.3:
+  version "16.8.4"
+  resolved "https://registry.yarnpkg.com/react/-/react-16.8.4.tgz#fdf7bd9ae53f03a9c4cd1a371432c206be1c4768"
+  integrity sha512-0GQ6gFXfUH7aZcjGVymlPOASTuSjlQL4ZtVC5YKH+3JL6bBLCVO21DknzmaPlI90LN253ojj02nsapy+j7wIjg==
   dependencies:
     loose-envify "^1.1.0"
     object-assign "^4.1.1"
     prop-types "^15.6.2"
-    scheduler "^0.13.2"
-
-react@^16.8.3:
-  version "16.8.3"
-  resolved "https://registry.yarnpkg.com/react/-/react-16.8.3.tgz#c6f988a2ce895375de216edcfaedd6b9a76451d9"
-  integrity sha512-3UoSIsEq8yTJuSu0luO1QQWYbgGEILm+eJl2QN/VLDi7hL+EN18M3q3oVZwmVzzBJ3DkM7RMdRwBmZZ+b4IzSA==
-  dependencies:
-    loose-envify "^1.1.0"
-    object-assign "^4.1.1"
-    prop-types "^15.6.2"
-    scheduler "^0.13.3"
+    scheduler "^0.13.4"
 
 reactjs-popup@^1.3.2:
   version "1.3.2"
@@ -13911,7 +13213,7 @@ read@^1.0.7:
   dependencies:
     mute-stream "~0.0.4"
 
-"readable-stream@1 || 2", readable-stream@2, readable-stream@^2.0.0, readable-stream@^2.0.1, readable-stream@^2.0.2, readable-stream@^2.0.4, readable-stream@^2.0.5, readable-stream@^2.0.6, readable-stream@^2.1.5, readable-stream@^2.2.2, readable-stream@^2.3.0, readable-stream@^2.3.3, readable-stream@^2.3.5, readable-stream@^2.3.6:
+"readable-stream@1 || 2", readable-stream@2, readable-stream@^2.0.0, readable-stream@^2.0.1, readable-stream@^2.0.2, readable-stream@^2.0.4, readable-stream@^2.0.5, readable-stream@^2.0.6, readable-stream@^2.1.5, readable-stream@^2.2.2, readable-stream@^2.3.0, readable-stream@^2.3.3, readable-stream@^2.3.5, readable-stream@^2.3.6, readable-stream@~2.3.6:
   version "2.3.6"
   resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-2.3.6.tgz#b11c27d88b8ff1fbe070643cf94b0c79ae1b0aaf"
   integrity sha512-tQtKA9WIAhBF3+VLAseyMqZeBjW0AHJoxOtYqSUZNJxauErmLbVm2FW1y+J/YA9dUrAC39ITejlZWhVIwawkKw==
@@ -13924,16 +13226,6 @@ read@^1.0.7:
     string_decoder "~1.1.1"
     util-deprecate "~1.0.1"
 
-readable-stream@1.0, "readable-stream@>=1.0.33-1 <1.1.0-0", readable-stream@~1.0.31:
-  version "1.0.34"
-  resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-1.0.34.tgz#125820e34bc842d2f2aaafafe4c2916ee32c157c"
-  integrity sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw=
-  dependencies:
-    core-util-is "~1.0.0"
-    inherits "~2.0.1"
-    isarray "0.0.1"
-    string_decoder "~0.10.x"
-
 readable-stream@1.1.x, readable-stream@~1.1.9:
   version "1.1.14"
   resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-1.1.14.tgz#7cf4c54ef648e3813084c636dd2079e166c081d9"
@@ -13944,17 +13236,24 @@ readable-stream@1.1.x, readable-stream@~1.1.9:
     isarray "0.0.1"
     string_decoder "~0.10.x"
 
-readable-stream@~2.0.6:
-  version "2.0.6"
-  resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-2.0.6.tgz#8f90341e68a53ccc928788dacfcd11b36eb9b78e"
-  integrity sha1-j5A0HmilPMySh4jaz80Rs265t44=
+readable-stream@3, readable-stream@^3.1.1:
+  version "3.2.0"
+  resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-3.2.0.tgz#de17f229864c120a9f56945756e4f32c4045245d"
+  integrity sha512-RV20kLjdmpZuTF1INEb9IA3L68Nmi+Ri7ppZqo78wj//Pn62fCoJyV9zalccNzDD/OuJpMG4f+pfMl8+L6QdGw==
+  dependencies:
+    inherits "^2.0.3"
+    string_decoder "^1.1.1"
+    util-deprecate "^1.0.1"
+
+"readable-stream@>=1.0.33-1 <1.1.0-0", readable-stream@~1.0.31:
+  version "1.0.34"
+  resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-1.0.34.tgz#125820e34bc842d2f2aaafafe4c2916ee32c157c"
+  integrity sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw=
   dependencies:
     core-util-is "~1.0.0"
     inherits "~2.0.1"
-    isarray "~1.0.0"
-    process-nextick-args "~1.0.6"
+    isarray "0.0.1"
     string_decoder "~0.10.x"
-    util-deprecate "~1.0.1"
 
 readdir-enhanced@^1.5.2:
   version "1.5.2"
@@ -13965,7 +13264,7 @@ readdir-enhanced@^1.5.2:
     es6-promise "^4.1.0"
     glob-to-regexp "^0.3.0"
 
-readdirp@^2.0.0:
+readdirp@^2.0.0, readdirp@^2.2.1:
   version "2.2.1"
   resolved "https://registry.yarnpkg.com/readdirp/-/readdirp-2.2.1.tgz#0e87622a3325aa33e892285caf8b4e846529a525"
   integrity sha512-1JU/8q+VgFZyxwrJ+SVIOsh+KywWGpds3NTqikiKpDMZWScmAYyKIgqkO+ARvNWJfXeXR1zxz7aHF4u4CyH6vQ==
@@ -13985,11 +13284,11 @@ recast@^0.14.7:
     source-map "~0.6.1"
 
 recast@^0.16.0:
-  version "0.16.1"
-  resolved "https://registry.yarnpkg.com/recast/-/recast-0.16.1.tgz#865f1800ef76e42e5d0375763b80f4d6a05f2069"
-  integrity sha512-ZUQm94F3AHozRaTo4Vz6yIgkSEZIL7p+BsWeGZ23rx+ZVRoqX+bvBA8br0xmCOU0DSR4qYGtV7Y5HxTsC4V78A==
+  version "0.16.2"
+  resolved "https://registry.yarnpkg.com/recast/-/recast-0.16.2.tgz#3796ebad5fe49ed85473b479cd6df554ad725dc2"
+  integrity sha512-O/7qXi51DPjRVdbrpNzoBQH5dnAPQNbfoOFyRiUwreTMJfIHYOEBzwuH+c0+/BTSJ3CQyKs6ILSWXhESH6Op3A==
   dependencies:
-    ast-types "0.11.6"
+    ast-types "0.11.7"
     esprima "~4.0.0"
     private "~0.1.5"
     source-map "~0.6.1"
@@ -14061,10 +13360,21 @@ reduce-function-call@^1.0.1:
   dependencies:
     balanced-match "^0.4.2"
 
-redux-devtools-instrument@^1.9.0:
-  version "1.9.0"
-  resolved "https://registry.yarnpkg.com/redux-devtools-instrument/-/redux-devtools-instrument-1.9.0.tgz#2faed9ac3292c783284b21843edfaa0567764a0c"
-  integrity sha512-pLFQoja1ojpsSRTWbC9yyc/a+z8uwOD7FPKLp+Abs7qjsah6khA5o8HBE2wa0VipE5vniYINdkNyxV/2iWADKg==
+redux-devtools-core@^0.2.1:
+  version "0.2.1"
+  resolved "https://registry.yarnpkg.com/redux-devtools-core/-/redux-devtools-core-0.2.1.tgz#4e43cbe590a1f18c13ee165d2d42e0bc77a164d8"
+  integrity sha512-RAGOxtUFdr/1USAvxrWd+Gq/Euzgw7quCZlO5TgFpDfG7rB5tMhZUrNyBjpzgzL2yMk0eHnPYIGm7NkIfRzHxQ==
+  dependencies:
+    get-params "^0.1.2"
+    jsan "^3.1.13"
+    lodash "^4.17.11"
+    nanoid "^2.0.0"
+    remotedev-serialize "^0.1.8"
+
+redux-devtools-instrument@^1.9.4:
+  version "1.9.6"
+  resolved "https://registry.yarnpkg.com/redux-devtools-instrument/-/redux-devtools-instrument-1.9.6.tgz#6b412595f74b9d48cfd4ecc13e585b1588ed6e7e"
+  integrity sha512-MwvY4cLEB2tIfWWBzrUR02UM9qRG2i7daNzywRvabOSVdvAY7s9BxSwMmVRH1Y/7QWjplNtOwgT0apKhHg2Qew==
   dependencies:
     lodash "^4.2.0"
     symbol-observable "^1.0.2"
@@ -14088,10 +13398,10 @@ refractor@^2.4.1:
     parse-entities "^1.1.2"
     prismjs "~1.15.0"
 
-regenerate-unicode-properties@^7.0.0:
-  version "7.0.0"
-  resolved "https://registry.yarnpkg.com/regenerate-unicode-properties/-/regenerate-unicode-properties-7.0.0.tgz#107405afcc4a190ec5ed450ecaa00ed0cafa7a4c"
-  integrity sha512-s5NGghCE4itSlUS+0WUj88G6cfMVMmH8boTPNvABf8od+2dhT9WDlWu8n01raQAJZMOK8Ch6jSexaRO7swd6aw==
+regenerate-unicode-properties@^8.0.1:
+  version "8.0.1"
+  resolved "https://registry.yarnpkg.com/regenerate-unicode-properties/-/regenerate-unicode-properties-8.0.1.tgz#58a4a74e736380a7ab3c5f7e03f303a941b31289"
+  integrity sha512-HTjMafphaH5d5QDHuwW8Me6Hbc/GhXg8luNqTkPVwZ/oCZhnoifjWhGYsu2BzepMELTlbnoVcXvV0f+2uDDvoQ==
   dependencies:
     regenerate "^1.4.0"
 
@@ -14124,10 +13434,10 @@ regenerator-transform@^0.10.0:
     babel-types "^6.19.0"
     private "^0.1.6"
 
-regenerator-transform@^0.13.3:
-  version "0.13.3"
-  resolved "https://registry.yarnpkg.com/regenerator-transform/-/regenerator-transform-0.13.3.tgz#264bd9ff38a8ce24b06e0636496b2c856b57bcbb"
-  integrity sha512-5ipTrZFSq5vU2YoGoww4uaRVAK4wyYC4TSICibbfEPOruUu8FFP7ErV0BjmbIOEpn3O/k9na9UEdYR/3m7N6uA==
+regenerator-transform@^0.13.4:
+  version "0.13.4"
+  resolved "https://registry.yarnpkg.com/regenerator-transform/-/regenerator-transform-0.13.4.tgz#18f6763cf1382c69c36df76c6ce122cc694284fb"
+  integrity sha512-T0QMBjK3J0MtxjPmdIMXm72Wvj2Abb0Bd4HADdfijwMdoIsyQZ6fWC7kDFhk2YinBBEMZDL7Y7wh0J1sGx3S4A==
   dependencies:
     private "^0.1.6"
 
@@ -14177,16 +13487,16 @@ regexpu-core@^2.0.0:
     regjsparser "^0.1.4"
 
 regexpu-core@^4.1.3, regexpu-core@^4.2.0:
-  version "4.4.0"
-  resolved "https://registry.yarnpkg.com/regexpu-core/-/regexpu-core-4.4.0.tgz#8d43e0d1266883969720345e70c275ee0aec0d32"
-  integrity sha512-eDDWElbwwI3K0Lo6CqbQbA6FwgtCz4kYTarrri1okfkRLZAqstU+B3voZBCjg8Fl6iq0gXrJG6MvRgLthfvgOA==
+  version "4.5.3"
+  resolved "https://registry.yarnpkg.com/regexpu-core/-/regexpu-core-4.5.3.tgz#72f572e03bb8b9f4f4d895a0ccc57e707f4af2e4"
+  integrity sha512-LON8666bTAlViVEPXMv65ZqiaR3rMNLz36PIaQ7D+er5snu93k0peR7FSvO0QteYbZ3GOkvfHKbGr/B1xDu9FA==
   dependencies:
     regenerate "^1.4.0"
-    regenerate-unicode-properties "^7.0.0"
+    regenerate-unicode-properties "^8.0.1"
     regjsgen "^0.5.0"
     regjsparser "^0.6.0"
     unicode-match-property-ecmascript "^1.0.4"
-    unicode-match-property-value-ecmascript "^1.0.2"
+    unicode-match-property-value-ecmascript "^1.1.0"
 
 registry-auth-token@3.3.2, registry-auth-token@^3.0.1:
   version "3.3.2"
@@ -14321,9 +13631,9 @@ remark-parse@^4.0.0:
     xtend "^4.0.1"
 
 remark-retext@^3.1.0:
-  version "3.1.1"
-  resolved "https://registry.yarnpkg.com/remark-retext/-/remark-retext-3.1.1.tgz#38eb1ba8ac7c03846eecd534b414355676815927"
-  integrity sha512-6njJXkOTfQhyDYABvi4iEB81x8E6EL5cnLPtfpYrunSLQM2s1j51hma29dVkMzk9FuHqy65Zb1Tgb34UAzw+TQ==
+  version "3.1.2"
+  resolved "https://registry.yarnpkg.com/remark-retext/-/remark-retext-3.1.2.tgz#983003d7495cf9198aa450c5ae5a7737011eec5f"
+  integrity sha512-+48KzJdSXvsPupY5pj5AY7oBUSiDOqFPZBKebX5WemrMyIG+RImIt9hgeqelluVDd1kooHen33K/aybTPyoI9g==
   dependencies:
     mdast-util-to-nlcst "^3.2.0"
 
@@ -14377,34 +13687,23 @@ remark@^7.0.1:
     unified "^6.0.0"
 
 remote-redux-devtools@^0.5.7:
-  version "0.5.13"
-  resolved "https://registry.yarnpkg.com/remote-redux-devtools/-/remote-redux-devtools-0.5.13.tgz#6bcb1ecfbb0a9c3e75f477882a04d2f197f81e2c"
-  integrity sha512-daDtwkoUEQ9qw4ciFEu0JZzB2NxKHSBrdVSRvrhi9wbwLI4ADiIctsXvkIOwrj0hxcSjDSOzp1WLlv7AJYp++g==
+  version "0.5.16"
+  resolved "https://registry.yarnpkg.com/remote-redux-devtools/-/remote-redux-devtools-0.5.16.tgz#95b1a4a1988147ca04f3368f3573b661748b3717"
+  integrity sha512-xZ2D1VRIWzat5nsvcraT6fKEX9Cfi+HbQBCwzNnUAM8Uicm/anOc60XGalcaDPrVmLug7nhDl2nimEa3bL3K9w==
   dependencies:
-    jsan "^3.1.5"
+    jsan "^3.1.13"
     querystring "^0.2.0"
-    redux-devtools-instrument "^1.9.0"
-    remotedev-utils "^0.1.1"
-    rn-host-detect "^1.0.1"
-    socketcluster-client "^13.0.0"
+    redux-devtools-core "^0.2.1"
+    redux-devtools-instrument "^1.9.4"
+    rn-host-detect "^1.1.5"
+    socketcluster-client "^14.2.1"
 
-remotedev-serialize@^0.1.0:
-  version "0.1.1"
-  resolved "https://registry.yarnpkg.com/remotedev-serialize/-/remotedev-serialize-0.1.1.tgz#0f598000b7dd7515d67f9b51a61d211e18ce9554"
-  integrity sha1-D1mAALfddRXWf5tRph0hHhjOlVQ=
+remotedev-serialize@^0.1.8:
+  version "0.1.8"
+  resolved "https://registry.yarnpkg.com/remotedev-serialize/-/remotedev-serialize-0.1.8.tgz#c99cb184e7f71a906162abc404be8ce33810205f"
+  integrity sha512-3YG/FDcOmiK22bl5oMRM8RRnbGrFEuPGjbcDG+z2xi5aQaNQNZ8lqoRnZTwXVfaZtutXuiAQOgPRrogzQk8edg==
   dependencies:
-    jsan "^3.1.9"
-
-remotedev-utils@^0.1.1:
-  version "0.1.4"
-  resolved "https://registry.yarnpkg.com/remotedev-utils/-/remotedev-utils-0.1.4.tgz#643700819a943678073c75eb185e81d96620b348"
-  integrity sha1-ZDcAgZqUNngHPHXrGF6B2WYgs0g=
-  dependencies:
-    get-params "^0.1.2"
-    jsan "^3.1.5"
-    lodash "^4.0.0"
-    remotedev-serialize "^0.1.0"
-    shortid "^2.2.6"
+    jsan "^3.1.13"
 
 remove-trailing-separator@^1.0.1:
   version "1.1.0"
@@ -14417,13 +13716,13 @@ render-fragment@^0.1.1:
   integrity sha512-+DnAcalJYR8GE5VRuQGGu78Q0GDe8EXnkuk4DF8gbAhIeS6LRt4j+aaggLLj4PtQVfXNC61McXvXI58WqmRleQ==
 
 renderkid@^2.0.1:
-  version "2.0.2"
-  resolved "https://registry.yarnpkg.com/renderkid/-/renderkid-2.0.2.tgz#12d310f255360c07ad8fde253f6c9e9de372d2aa"
-  integrity sha512-FsygIxevi1jSiPY9h7vZmBFUbAOcbYm9UwyiLNdVsLRs/5We9Ob5NMPbGYUTWiLq5L+ezlVdE0A8bbME5CWTpg==
+  version "2.0.3"
+  resolved "https://registry.yarnpkg.com/renderkid/-/renderkid-2.0.3.tgz#380179c2ff5ae1365c522bf2fcfcff01c5b74149"
+  integrity sha512-z8CLQp7EZBPCwCnncgf9C4XAi3WR0dv+uWu/PjIyhhAb5d6IJ/QZqlHFprHeKT+59//V6BNUsLbvN8+2LarxGA==
   dependencies:
     css-select "^1.1.0"
-    dom-converter "~0.2"
-    htmlparser2 "~3.3.0"
+    dom-converter "^0.2"
+    htmlparser2 "^3.3.0"
     strip-ansi "^3.0.0"
     utila "^0.4.0"
 
@@ -14456,7 +13755,7 @@ replace-ext@1.0.0, replace-ext@^1.0.0:
 
 request@^2.58.0, request@^2.65.0, request@^2.67.0, request@^2.74.0, request@^2.83.0:
   version "2.88.0"
-  resolved "https://registry.npmjs.org/request/-/request-2.88.0.tgz#9c2fca4f7d35b592efe57c7f0a55e81052124fef"
+  resolved "https://registry.yarnpkg.com/request/-/request-2.88.0.tgz#9c2fca4f7d35b592efe57c7f0a55e81052124fef"
   integrity sha512-NAqBSrijGLZdM0WZNsInLJpkJokL72XYjUpnB0iwsRgxh7dB6COrHnTBNwN0E+lHDAJzu7kLAkDeY08z2/A0hg==
   dependencies:
     aws-sign2 "~0.7.0"
@@ -14553,14 +13852,7 @@ resolve-url@^0.2.1:
   resolved "https://registry.yarnpkg.com/resolve-url/-/resolve-url-0.2.1.tgz#2c637fe77c893afd2a663fe21aa9080068e2052a"
   integrity sha1-LGN/53yJOv0qZj/iGqkIAGjiBSo=
 
-resolve@^1.1.6, resolve@^1.1.7, resolve@^1.3.2, resolve@^1.8.1:
-  version "1.8.1"
-  resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.8.1.tgz#82f1ec19a423ac1fbd080b0bab06ba36e84a7a26"
-  integrity sha512-AicPrAC7Qu1JxPCZ9ZgCZlY35QgFnNqc+0LtbRNxnVw4TXvjQ72wnuL9JQcEBgXkI9JM8MsT9kaQoHcpCRJOYA==
-  dependencies:
-    path-parse "^1.0.5"
-
-resolve@^1.10.0:
+resolve@^1.1.6, resolve@^1.1.7, resolve@^1.10.0, resolve@^1.3.2, resolve@^1.8.1:
   version "1.10.0"
   resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.10.0.tgz#3bdaaeaf45cc07f375656dfd2e54ed0810b101ba"
   integrity sha512-3sUr9aq5OfSg2S9pNtPA9hL1FVEAjvfOC4leW0SNf/mpnaakz2a9femSd6LqAww2RaFctwyf1lCqnTHuF1rxDg==
@@ -14581,9 +13873,9 @@ ret@~0.1.10:
   integrity sha512-TTlYpa+OL+vMMNG24xSlQGEJ3B/RzEfUlLct7b5G/ytav+wPrplCpVMFuwzXbkecJrb6IYo1iFb0S9v37754mg==
 
 retext-english@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/retext-english/-/retext-english-3.0.0.tgz#c17cb56bd5f1ba3dee3355ddbab79f1c4894a809"
-  integrity sha1-wXy1a9Xxuj3uM1XdurefHEiUqAk=
+  version "3.0.2"
+  resolved "https://registry.yarnpkg.com/retext-english/-/retext-english-3.0.2.tgz#efc239c445b112d13f3f511b1856abc2b5476cb4"
+  integrity sha512-iWffdWUvJngqaRlE570SaYRgQbn4/QVBfGa/XseEBuBazymnyW24o37oLPY0vm+PJdLmDghnjZX0UbkZSZF0Cg==
   dependencies:
     parse-english "^4.0.0"
     unherit "^1.0.4"
@@ -14648,11 +13940,11 @@ right-align@^0.1.1:
     align-text "^0.1.1"
 
 rimraf@^2.2.6, rimraf@^2.2.8, rimraf@^2.3.2, rimraf@^2.4.4, rimraf@^2.5.0, rimraf@^2.5.4, rimraf@^2.6.1, rimraf@^2.6.2:
-  version "2.6.2"
-  resolved "https://registry.yarnpkg.com/rimraf/-/rimraf-2.6.2.tgz#2ed8150d24a16ea8651e6d6ef0f47c4158ce7a36"
-  integrity sha512-lreewLK/BlghmxtfH36YYVg1i8IAce4TI7oao75I1g245+6BctqTVQiBP3YUJ9C6DQOXJmkYR9X9fCLtCOJc5w==
+  version "2.6.3"
+  resolved "https://registry.yarnpkg.com/rimraf/-/rimraf-2.6.3.tgz#b2d104fe0d8fb27cf9e0a1cda8262dd3833c6cab"
+  integrity sha512-mwqeW5XsA2qAejG46gYdENaxXjx9onRNCfn7L0duuP4hCuTIi/QO7PDK07KJfp1d+izWPrzEJDcSqBa0OZQriA==
   dependencies:
-    glob "^7.0.5"
+    glob "^7.1.3"
 
 ripemd160@0.2.0:
   version "0.2.0"
@@ -14667,7 +13959,7 @@ ripemd160@^2.0.0, ripemd160@^2.0.1:
     hash-base "^3.0.0"
     inherits "^2.0.1"
 
-rn-host-detect@^1.0.1:
+rn-host-detect@^1.1.5:
   version "1.1.5"
   resolved "https://registry.yarnpkg.com/rn-host-detect/-/rn-host-detect-1.1.5.tgz#fbecb982b73932f34529e97932b9a63e58d8deb6"
   integrity sha512-ufk2dFT3QeP9HyZ/xTuMtW27KnFy815CYitJMqQm+pgG3ZAtHBsrU8nXizNKkqXGy3bQmhEoloVbrfbvMJMqkg==
@@ -14682,7 +13974,7 @@ rollup@^0.58.2:
 
 rsvp@^3.0.13, rsvp@^3.0.18:
   version "3.6.2"
-  resolved "https://registry.npmjs.org/rsvp/-/rsvp-3.6.2.tgz#2e96491599a96cde1b515d5674a8f7a91452926a"
+  resolved "https://registry.yarnpkg.com/rsvp/-/rsvp-3.6.2.tgz#2e96491599a96cde1b515d5674a8f7a91452926a"
   integrity sha512-OfWGQTb9vnwRjwtA2QwpG2ICclHC3pgXZO5xt8H2EfgDquO0qVdSb5T88L4qJVAEugbS56pAuV4XZM58UX8ulw==
 
 run-async@^2.2.0:
@@ -14711,10 +14003,10 @@ rx-lite@*, rx-lite@^4.0.8:
   resolved "https://registry.yarnpkg.com/rx-lite/-/rx-lite-4.0.8.tgz#0b1e11af8bc44836f04a6407e92da42467b79444"
   integrity sha1-Cx4Rr4vESDbwSmQH6S2kJGe3lEQ=
 
-rxjs@^6.1.0:
-  version "6.3.3"
-  resolved "https://registry.yarnpkg.com/rxjs/-/rxjs-6.3.3.tgz#3c6a7fa420e844a81390fb1158a9ec614f4bad55"
-  integrity sha512-JTWmoY9tWCs7zvIk/CvRjhjGaOd+OVBM987mxFo+OW66cGpdKjZcpmc74ES1sB//7Kl/PAe8+wEakuhG4pcgOw==
+rxjs@^6.1.0, rxjs@^6.4.0:
+  version "6.4.0"
+  resolved "https://registry.yarnpkg.com/rxjs/-/rxjs-6.4.0.tgz#f3bb0fe7bda7fb69deac0c16f17b50b0b8790504"
+  integrity sha512-Z9Yfa11F6B9Sg/BK9MnqnQ+aQYicPLtilXBp2yUtDt2JRCE0h26d33EnfO3ZxoNxG0T92OUucP3Ct7cpfkdFfw==
   dependencies:
     tslib "^1.9.0"
 
@@ -14759,20 +14051,20 @@ sane@^1.3.3:
     watch "~0.10.0"
 
 sanitize-html@^1.14.1:
-  version "1.19.1"
-  resolved "https://registry.yarnpkg.com/sanitize-html/-/sanitize-html-1.19.1.tgz#e8b33c69578054d6ee4f57ea152d6497f3f6fb7d"
-  integrity sha512-zNYr6FvBn4bZukr9x2uny6od/9YdjCLwF+FqxivqI0YOt/m9GIxfX+tWhm52tBAPUXiTTb4bJTGVagRz5b06bw==
+  version "1.20.0"
+  resolved "https://registry.yarnpkg.com/sanitize-html/-/sanitize-html-1.20.0.tgz#9a602beb1c9faf960fb31f9890f61911cc4d9156"
+  integrity sha512-BpxXkBoAG+uKCHjoXFmox6kCSYpnulABoGcZ/R3QyY9ndXbIM5S94eOr1IqnzTG8TnbmXaxWoDDzKC5eJv7fEQ==
   dependencies:
-    chalk "^2.3.0"
-    htmlparser2 "^3.9.0"
+    chalk "^2.4.1"
+    htmlparser2 "^3.10.0"
     lodash.clonedeep "^4.5.0"
     lodash.escaperegexp "^4.1.2"
     lodash.isplainobject "^4.0.6"
     lodash.isstring "^4.0.1"
-    lodash.mergewith "^4.6.0"
-    postcss "^6.0.14"
+    lodash.mergewith "^4.6.1"
+    postcss "^7.0.5"
     srcset "^1.0.0"
-    xtend "^4.0.0"
+    xtend "^4.0.1"
 
 sax@>=0.6.0, sax@^1.2.4, sax@~1.2.1, sax@~1.2.4:
   version "1.2.4"
@@ -14786,7 +14078,7 @@ sc-channel@^1.2.0:
   dependencies:
     component-emitter "1.2.1"
 
-sc-errors@^1.4.0:
+sc-errors@^1.4.1:
   version "1.4.1"
   resolved "https://registry.yarnpkg.com/sc-errors/-/sc-errors-1.4.1.tgz#53e80030fe647e133d73b51eaa7d2b0f7591fd5b"
   integrity sha512-dBn92iIonpChTxYLgKkIT/PCApvmYT6EPIbRvbQKTgY6tbEbIy8XVUv4pGyKwEK4nCmvX4TKXcN0iXC6tNW6rQ==
@@ -14796,18 +14088,10 @@ sc-formatter@^3.0.1:
   resolved "https://registry.yarnpkg.com/sc-formatter/-/sc-formatter-3.0.2.tgz#9abdb14e71873ce7157714d3002477bbdb33c4e6"
   integrity sha512-9PbqYBpCq+OoEeRQ3QfFIGE6qwjjBcd2j7UjgDlhnZbtSnuGgHdcRklPKYGuYFH82V/dwd+AIpu8XvA1zqTd+A==
 
-scheduler@^0.13.2:
-  version "0.13.2"
-  resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.13.2.tgz#969eaee2764a51d2e97b20a60963b2546beff8fa"
-  integrity sha512-qK5P8tHS7vdEMCW5IPyt8v9MJOHqTrOUgPXib7tqm9vh834ibBX5BNhwkplX/0iOzHW5sXyluehYfS9yrkz9+w==
-  dependencies:
-    loose-envify "^1.1.0"
-    object-assign "^4.1.1"
-
-scheduler@^0.13.3:
-  version "0.13.3"
-  resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.13.3.tgz#bed3c5850f62ea9c716a4d781f9daeb9b2a58896"
-  integrity sha512-UxN5QRYWtpR1egNWzJcVLk8jlegxAugswQc984lD3kU7NuobsO37/sRfbpTdBjtnD5TBNFA2Q2oLV5+UmPSmEQ==
+scheduler@^0.13.4:
+  version "0.13.4"
+  resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.13.4.tgz#8fef05e7a3580c76c0364d2df5e550e4c9140298"
+  integrity sha512-cvSOlRPxOHs5dAhP9yiS/6IDmVAVxmk33f0CtTJRkmUWcb1Us+t7b1wqdzoC0REw2muC9V5f1L/w5R5uKGaepA==
   dependencies:
     loose-envify "^1.1.0"
     object-assign "^4.1.1"
@@ -14837,9 +14121,9 @@ schema-utils@^1.0.0:
     ajv-keywords "^3.1.0"
 
 scroll-behavior@^0.9.9:
-  version "0.9.9"
-  resolved "https://registry.yarnpkg.com/scroll-behavior/-/scroll-behavior-0.9.9.tgz#ebfe0658455b82ad885b66195215416674dacce2"
-  integrity sha1-6/4GWEVbgq2IW2YZUhVBZnTazOI=
+  version "0.9.10"
+  resolved "https://registry.yarnpkg.com/scroll-behavior/-/scroll-behavior-0.9.10.tgz#c8953adeeb3586060b903328d860aa8346d62861"
+  integrity sha512-JVJQkBkqMLEM4ATtbHTKare97zhz/qlla9mNttFYY/bcpyOb4BuBGEQ/N9AQWXvshzf6zo9jP60TlphnJ4YPoQ==
   dependencies:
     dom-helpers "^3.2.1"
     invariant "^2.2.2"
@@ -14849,7 +14133,7 @@ secure-keys@^1.0.0:
   resolved "https://registry.yarnpkg.com/secure-keys/-/secure-keys-1.0.0.tgz#f0c82d98a3b139a8776a8808050b824431087fca"
   integrity sha1-8MgtmKOxOah3aogIBQuCRDEIf8o=
 
-seek-bzip@^1.0.3, seek-bzip@^1.0.5:
+seek-bzip@^1.0.3:
   version "1.0.5"
   resolved "https://registry.yarnpkg.com/seek-bzip/-/seek-bzip-1.0.5.tgz#cfe917cb3d274bcffac792758af53173eb1fabdc"
   integrity sha1-z+kXyz0nS8/6x5J1ivUxc+sfq9w=
@@ -14910,9 +14194,9 @@ send@0.16.2:
     statuses "~1.4.0"
 
 serialize-javascript@^1.4.0:
-  version "1.5.0"
-  resolved "https://registry.yarnpkg.com/serialize-javascript/-/serialize-javascript-1.5.0.tgz#1aa336162c88a890ddad5384baebc93a655161fe"
-  integrity sha512-Ga8c8NjAAp46Br4+0oZ2WxJCwIzwP60Gq1YPgU+39PiTVxyed/iKE/zyZI6+UlVYH5Q4PaQdHhcegIFPZTUfoQ==
+  version "1.6.1"
+  resolved "https://registry.yarnpkg.com/serialize-javascript/-/serialize-javascript-1.6.1.tgz#4d1f697ec49429a847ca6f442a2a755126c4d879"
+  integrity sha512-A5MOagrPFga4YaKQSWHryl7AXvbQkEqpw4NNYMTNYUNV51bA8ABHgYFpqKx+YFFrw59xMV1qGH1R4AgoNIVgCw==
 
 serve-favicon@^2.5.0:
   version "2.5.0"
@@ -14987,7 +14271,7 @@ set-blocking@^2.0.0, set-blocking@~2.0.0:
   resolved "https://registry.yarnpkg.com/set-blocking/-/set-blocking-2.0.0.tgz#045f9782d011ae9a6803ddd382b24392b3d890f7"
   integrity sha1-BF+XgtARrppoA93TgrJDkrPYkPc=
 
-set-immediate-shim@^1.0.0:
+set-immediate-shim@^1.0.0, set-immediate-shim@~1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/set-immediate-shim/-/set-immediate-shim-1.0.1.tgz#4b2b1b27eb808a9f8dcc481a58e5e56f599f3f61"
   integrity sha1-SysbJ+uAip+NzEgaWOXlb1mfP2E=
@@ -15022,6 +14306,11 @@ setprototypeof@1.1.0:
   resolved "https://registry.yarnpkg.com/setprototypeof/-/setprototypeof-1.1.0.tgz#d0bd85536887b6fe7c0d818cb962d9d91c54e656"
   integrity sha512-BvE/TwpZX4FXExxOxZyRGQQv651MSwmWKZGqvmPcRIjDqWub67kTKuIMx43cZZrS/cBBzwBcNDWoFxt2XEFIpQ==
 
+setprototypeof@1.1.1:
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/setprototypeof/-/setprototypeof-1.1.1.tgz#7e95acb24aa92f5885e0abef5ba131330d4ae683"
+  integrity sha512-JvdAWfbXeIGaZ9cILp38HntZSFSo3mWg6xGcJJsd+d4aRMOqauag1C63dJfDw7OaMYwEbHMOxEZ1lqVRYP2OAw==
+
 sha.js@2.2.6:
   version "2.2.6"
   resolved "https://registry.yarnpkg.com/sha.js/-/sha.js-2.2.6.tgz#17ddeddc5f722fb66501658895461977867315ba"
@@ -15071,22 +14360,6 @@ sharp@^0.20.0:
     tar "^4.4.6"
     tunnel-agent "^0.6.0"
 
-sharp@^0.21.0:
-  version "0.21.0"
-  resolved "https://registry.yarnpkg.com/sharp/-/sharp-0.21.0.tgz#e3cf2e4cb9382caf78efb3d45252381730e899c4"
-  integrity sha512-qr6yMl0ju8EGMtjIj5U1Ojj8sKuZ99/DQaNKWmoFHxqg3692AFSrEiPI/yr0O05OWtGD8LuCw8WSGmnZcNrZaA==
-  dependencies:
-    color "^3.0.0"
-    detect-libc "^1.0.3"
-    fs-copy-file-sync "^1.1.1"
-    nan "^2.11.1"
-    npmlog "^4.1.2"
-    prebuild-install "^5.2.0"
-    semver "^5.5.1"
-    simple-get "^3.0.3"
-    tar "^4.4.6"
-    tunnel-agent "^0.6.0"
-
 shebang-command@^1.2.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/shebang-command/-/shebang-command-1.2.0.tgz#44aac65b695b03398968c39f363fee5deafdf1ea"
@@ -15127,13 +14400,6 @@ shelljs@^0.8.2:
     interpret "^1.0.0"
     rechoir "^0.6.2"
 
-shortid@^2.2.6:
-  version "2.2.13"
-  resolved "https://registry.yarnpkg.com/shortid/-/shortid-2.2.13.tgz#b2441e71c664ace458a341d343959f677910ef5b"
-  integrity sha512-dBuNnQGKrJNfjunmXI2X7bl1gnMO4PwbNxrTzO1JvilODmL7WyyCtA+DYxe9XunLXmxmgzFIvKPQ6XRAQrr46Q==
-  dependencies:
-    nanoid "^1.0.7"
-
 sift@^3.2.6:
   version "3.3.12"
   resolved "https://registry.yarnpkg.com/sift/-/sift-3.3.12.tgz#4f5cdf16af3db32afa04ab25297b0e20ad98294a"
@@ -15168,15 +14434,6 @@ simple-get@^2.7.0, simple-get@^2.8.1:
     once "^1.3.1"
     simple-concat "^1.0.0"
 
-simple-get@^3.0.3:
-  version "3.0.3"
-  resolved "https://registry.yarnpkg.com/simple-get/-/simple-get-3.0.3.tgz#924528ac3f9d7718ce5e9ec1b1a69c0be4d62efa"
-  integrity sha512-Wvre/Jq5vgoz31Z9stYWPLn0PqRqmBDpFSdypAnHu5AvRVCYPRYGnvryNLiXu8GOBNDH82J2FRHUGMjjHUpXFw==
-  dependencies:
-    decompress-response "^3.3.0"
-    once "^1.3.1"
-    simple-concat "^1.0.0"
-
 simple-swizzle@^0.2.2:
   version "0.2.2"
   resolved "https://registry.yarnpkg.com/simple-swizzle/-/simple-swizzle-0.2.2.tgz#a4da6b635ffcccca33f70d17cb92592de95e557a"
@@ -15261,10 +14518,10 @@ snyk-go-plugin@1.6.1:
     tmp "0.0.33"
     toml "^2.3.2"
 
-snyk-gradle-plugin@2.1.3:
-  version "2.1.3"
-  resolved "https://registry.yarnpkg.com/snyk-gradle-plugin/-/snyk-gradle-plugin-2.1.3.tgz#cd8dbcbad4b9a1f6cf8dc2f29245505312ae647e"
-  integrity sha512-xti5Uox0NLPO89O/MQd9qgnlynNtO2eXSukzyjONeGgueyNv6I7FQnUvHtVj6IUCBPlMP8c5D7bQmlFfemz8ZA==
+snyk-gradle-plugin@2.1.4:
+  version "2.1.4"
+  resolved "https://registry.yarnpkg.com/snyk-gradle-plugin/-/snyk-gradle-plugin-2.1.4.tgz#4ca478b87f591bd1c37b5d127c9eff4c042f429c"
+  integrity sha512-EOG4OEt9KAkMgaiG3IWi1ENkfIehMhQTd/KU+uoNbEJJ9KYk3POcB+7CsRq6kJa2Th/9aMGp+ojm6HOrOkJM4w==
   dependencies:
     clone-deep "^0.3.0"
 
@@ -15393,9 +14650,9 @@ snyk-try-require@1.3.1, snyk-try-require@^1.1.1, snyk-try-require@^1.3.1:
     then-fs "^2.0.0"
 
 snyk@^1.134.2:
-  version "1.134.2"
-  resolved "https://registry.yarnpkg.com/snyk/-/snyk-1.134.2.tgz#c94e055b59e3bc3a2995f575457fba33ac2c8520"
-  integrity sha512-WGR3TTZxXOdALEEcQtADFEOHaanhbzwLvS6gyg5vF6Akj7qRAwIIXYBUycbNdAax1mylAsXCzR352dkTwKD9lg==
+  version "1.136.0"
+  resolved "https://registry.yarnpkg.com/snyk/-/snyk-1.136.0.tgz#6e4cc3f663e0a56ddfa06ddc96d77414244de74a"
+  integrity sha512-YBAycWFzr9LU17mBwo6+0sZEf4vpT8l45AW8Ijvlh3T8iHW1Tt1Xpg+Vgg1t3sXnDvZIHFMH8P4N4QUZuLoykA==
   dependencies:
     "@snyk/dep-graph" "1.4.0"
     "@snyk/gemfile" "1.2.0"
@@ -15418,7 +14675,7 @@ snyk@^1.134.2:
     snyk-config "2.2.1"
     snyk-docker-plugin "1.22.0"
     snyk-go-plugin "1.6.1"
-    snyk-gradle-plugin "2.1.3"
+    snyk-gradle-plugin "2.1.4"
     snyk-module "1.9.1"
     snyk-mvn-plugin "2.0.1"
     snyk-nodejs-lockfile-parser "1.11.0"
@@ -15442,51 +14699,51 @@ socket.io-adapter@~1.1.0:
   resolved "https://registry.yarnpkg.com/socket.io-adapter/-/socket.io-adapter-1.1.1.tgz#2a805e8a14d6372124dd9159ad4502f8cb07f06b"
   integrity sha1-KoBeihTWNyEk3ZFZrUUC+MsH8Gs=
 
-socket.io-client@2.1.1:
-  version "2.1.1"
-  resolved "https://registry.yarnpkg.com/socket.io-client/-/socket.io-client-2.1.1.tgz#dcb38103436ab4578ddb026638ae2f21b623671f"
-  integrity sha512-jxnFyhAuFxYfjqIgduQlhzqTcOEQSn+OHKVfAxWaNWa7ecP7xSNk2Dx/3UEsDcY7NcFafxvNvKPmmO7HTwTxGQ==
+socket.io-client@2.2.0:
+  version "2.2.0"
+  resolved "https://registry.yarnpkg.com/socket.io-client/-/socket.io-client-2.2.0.tgz#84e73ee3c43d5020ccc1a258faeeb9aec2723af7"
+  integrity sha512-56ZrkTDbdTLmBIyfFYesgOxsjcLnwAKoN4CiPyTVkMQj3zTUh0QAx3GbvIvLpFEOvQWu92yyWICxB0u7wkVbYA==
   dependencies:
     backo2 "1.0.2"
     base64-arraybuffer "0.1.5"
     component-bind "1.0.0"
     component-emitter "1.2.1"
     debug "~3.1.0"
-    engine.io-client "~3.2.0"
+    engine.io-client "~3.3.1"
     has-binary2 "~1.0.2"
     has-cors "1.1.0"
     indexof "0.0.1"
     object-component "0.0.3"
     parseqs "0.0.5"
     parseuri "0.0.5"
-    socket.io-parser "~3.2.0"
+    socket.io-parser "~3.3.0"
     to-array "0.1.4"
 
-socket.io-parser@~3.2.0:
-  version "3.2.0"
-  resolved "https://registry.yarnpkg.com/socket.io-parser/-/socket.io-parser-3.2.0.tgz#e7c6228b6aa1f814e6148aea325b51aa9499e077"
-  integrity sha512-FYiBx7rc/KORMJlgsXysflWx/RIvtqZbyGLlHZvjfmPTPeuD/I8MaW7cfFrj5tRltICJdgwflhfZ3NVVbVLFQA==
+socket.io-parser@~3.3.0:
+  version "3.3.0"
+  resolved "https://registry.yarnpkg.com/socket.io-parser/-/socket.io-parser-3.3.0.tgz#2b52a96a509fdf31440ba40fed6094c7d4f1262f"
+  integrity sha512-hczmV6bDgdaEbVqhAeVMM/jfUfzuEZHsQg6eOmLgJht6G3mPKMxYm75w2+qhAQZ+4X+1+ATZ+QFKeOZD5riHng==
   dependencies:
     component-emitter "1.2.1"
     debug "~3.1.0"
     isarray "2.0.1"
 
 socket.io@^2.0.3:
-  version "2.1.1"
-  resolved "https://registry.yarnpkg.com/socket.io/-/socket.io-2.1.1.tgz#a069c5feabee3e6b214a75b40ce0652e1cfb9980"
-  integrity sha512-rORqq9c+7W0DAK3cleWNSyfv/qKXV99hV4tZe+gGLfBECw3XEhBy7x85F3wypA9688LKjtwO9pX9L33/xQI8yA==
+  version "2.2.0"
+  resolved "https://registry.yarnpkg.com/socket.io/-/socket.io-2.2.0.tgz#f0f633161ef6712c972b307598ecd08c9b1b4d5b"
+  integrity sha512-wxXrIuZ8AILcn+f1B4ez4hJTPG24iNgxBBDaJfT6MsyOhVYiTXWexGoPkd87ktJG8kQEcL/NBvRi64+9k4Kc0w==
   dependencies:
-    debug "~3.1.0"
-    engine.io "~3.2.0"
+    debug "~4.1.0"
+    engine.io "~3.3.1"
     has-binary2 "~1.0.2"
     socket.io-adapter "~1.1.0"
-    socket.io-client "2.1.1"
-    socket.io-parser "~3.2.0"
+    socket.io-client "2.2.0"
+    socket.io-parser "~3.3.0"
 
-socketcluster-client@^13.0.0:
-  version "13.0.1"
-  resolved "https://registry.yarnpkg.com/socketcluster-client/-/socketcluster-client-13.0.1.tgz#920e0a2437c228555e84f8ef0c9c5eb720e6067e"
-  integrity sha512-hxiE2xz6mgaBlhXbtBa4POgWVEvIcjCoHzf5LTUVhI9IL8V2ltV3Ze8pQsi9egqTjSz4RHPfyrJ7BiETe5Kthw==
+socketcluster-client@^14.2.1:
+  version "14.2.1"
+  resolved "https://registry.yarnpkg.com/socketcluster-client/-/socketcluster-client-14.2.1.tgz#f5cc896fb713006deb2aea6727440c2bff5d43cb"
+  integrity sha512-peCBfewW1silqvLecFpLz5u2xr85r8b7A24mXaNTsXLnG9QR3zxecYtKS/odszzJSu2j2YyQPR4avy77tZSjZw==
   dependencies:
     base-64 "0.1.0"
     clone "2.1.1"
@@ -15494,7 +14751,7 @@ socketcluster-client@^13.0.0:
     linked-list "0.1.0"
     querystring "0.2.0"
     sc-channel "^1.2.0"
-    sc-errors "^1.4.0"
+    sc-errors "^1.4.1"
     sc-formatter "^3.0.1"
     uuid "3.2.1"
     ws "5.1.1"
@@ -15511,19 +14768,7 @@ sockjs-client@1.1.4:
     json3 "^3.3.2"
     url-parse "^1.1.8"
 
-sockjs-client@1.1.5:
-  version "1.1.5"
-  resolved "https://registry.yarnpkg.com/sockjs-client/-/sockjs-client-1.1.5.tgz#1bb7c0f7222c40f42adf14f4442cbd1269771a83"
-  integrity sha1-G7fA9yIsQPQq3xT0RCy9Eml3GoM=
-  dependencies:
-    debug "^2.6.6"
-    eventsource "0.1.6"
-    faye-websocket "~0.11.0"
-    inherits "^2.0.1"
-    json3 "^3.3.2"
-    url-parse "^1.1.8"
-
-sockjs-client@^1.0.3:
+sockjs-client@1.3.0, sockjs-client@^1.0.3:
   version "1.3.0"
   resolved "https://registry.yarnpkg.com/sockjs-client/-/sockjs-client-1.3.0.tgz#12fc9d6cb663da5739d3dc5fb6e8687da95cb177"
   integrity sha512-R9jxEzhnnrdxLCNln0xg5uGHqMnkhPSTzUZH2eXcR03S/On9Yvoq2wyUZILRUhZCNVu2PmwWVoyuiPz8th8zbg==
@@ -15559,13 +14804,6 @@ socks@^1.1.10:
     ip "^1.1.4"
     smart-buffer "^1.0.13"
 
-sort-keys-length@^1.0.0:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/sort-keys-length/-/sort-keys-length-1.0.1.tgz#9cb6f4f4e9e48155a6aa0671edd336ff1479a188"
-  integrity sha1-nLb09OnkgVWmqgZx7dM2/xR5oYg=
-  dependencies:
-    sort-keys "^1.0.0"
-
 sort-keys@^1.0.0:
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/sort-keys/-/sort-keys-1.1.2.tgz#441b6d4d346798f1b4e49e8920adfba0e543f9ad"
@@ -15606,7 +14844,7 @@ source-map-support@^0.4.15:
   dependencies:
     source-map "^0.5.6"
 
-source-map-support@^0.5.10, source-map-support@^0.5.7, source-map-support@^0.5.9, source-map-support@~0.5.6:
+source-map-support@^0.5.10, source-map-support@^0.5.7, source-map-support@^0.5.9, source-map-support@~0.5.9:
   version "0.5.10"
   resolved "https://registry.yarnpkg.com/source-map-support/-/source-map-support-0.5.10.tgz#2214080bc9d51832511ee2bab96e3c2f9353120c"
   integrity sha512-YfQ3tQFTK/yzlGJuX8pTwa4tifQj4QS2Mj7UegOu8jAz59MqIiMGPXxQhVQiIMNzayuUSF/jEuVnfFF5JqybmQ==
@@ -15689,9 +14927,9 @@ spawn-promise@^0.1.8:
     co "^4.6.0"
 
 spdx-correct@^3.0.0:
-  version "3.0.2"
-  resolved "https://registry.yarnpkg.com/spdx-correct/-/spdx-correct-3.0.2.tgz#19bb409e91b47b1ad54159243f7312a858db3c2e"
-  integrity sha512-q9hedtzyXHr5S0A1vEPoK/7l8NpfkFYTq6iCY+Pno2ZbdZR6WexZFtqeVGkGxW3TEJMN914Z55EnAGMmenlIQQ==
+  version "3.1.0"
+  resolved "https://registry.yarnpkg.com/spdx-correct/-/spdx-correct-3.1.0.tgz#fb83e504445268f154b074e218c87c003cd31df4"
+  integrity sha512-lr2EZCctC2BNR7j7WzJ2FpDznxky1sjfxvvYEyzxNyb6lZXHODmEoJeFu4JupYlkfha1KZpJyoqiJ7pgA1qq8Q==
   dependencies:
     spdx-expression-parse "^3.0.0"
     spdx-license-ids "^3.0.0"
@@ -15710,9 +14948,9 @@ spdx-expression-parse@^3.0.0:
     spdx-license-ids "^3.0.0"
 
 spdx-license-ids@^3.0.0:
-  version "3.0.1"
-  resolved "https://registry.yarnpkg.com/spdx-license-ids/-/spdx-license-ids-3.0.1.tgz#e2a303236cac54b04031fa7a5a79c7e701df852f"
-  integrity sha512-TfOfPcYGBB5sDuPn3deByxPhmfegAhpDYKSOXZQN81Oyrrif8ZCodOLzK3AesELnCx03kikhyDwh0pfvvQvF8w==
+  version "3.0.3"
+  resolved "https://registry.yarnpkg.com/spdx-license-ids/-/spdx-license-ids-3.0.3.tgz#81c0ce8f21474756148bbb5f3bfc0f36bf15d76e"
+  integrity sha512-uBIcIl3Ih6Phe3XHK1NqboJLdGfwr1UN3k6wSD1dZpmPsIkb8AGNbZYJ1fOBk834+Gxy8rpfDxrS6XLEMZMY2g==
 
 split-string@^3.0.1, split-string@^3.0.2:
   version "3.1.0"
@@ -15722,9 +14960,9 @@ split-string@^3.0.1, split-string@^3.0.2:
     extend-shallow "^3.0.0"
 
 sprintf-js@^1.0.3:
-  version "1.1.1"
-  resolved "https://registry.yarnpkg.com/sprintf-js/-/sprintf-js-1.1.1.tgz#36be78320afe5801f6cea3ee78b6e5aab940ea0c"
-  integrity sha1-Nr54Mgr+WAH2zqPueLblqrlA6gw=
+  version "1.1.2"
+  resolved "https://registry.yarnpkg.com/sprintf-js/-/sprintf-js-1.1.2.tgz#da1765262bf8c0f571749f2ad6c26300207ae673"
+  integrity sha512-VE0SOVEHCk7Qc8ulkWw3ntAzXuqf7S2lvwQaDLRnUeIEaKNQJzV6BwmLKhOqT61aGhfUMrXeaBk+oDGCzvhcug==
 
 sprintf-js@~1.0.2:
   version "1.0.3"
@@ -15749,9 +14987,9 @@ srcset@^1.0.0:
     number-is-nan "^1.0.0"
 
 sshpk@^1.7.0:
-  version "1.15.1"
-  resolved "https://registry.yarnpkg.com/sshpk/-/sshpk-1.15.1.tgz#b79a089a732e346c6e0714830f36285cd38191a2"
-  integrity sha512-mSdgNUaidk+dRU5MhYtN9zebdzF2iG0cNPWy8HG+W8y+fT1JnSkh0fzzpjOa0L7P8i1Rscz38t0h4gPcKz43xA==
+  version "1.16.1"
+  resolved "https://registry.yarnpkg.com/sshpk/-/sshpk-1.16.1.tgz#fb661c0bef29b39db40769ee39fa70093d6f6877"
+  integrity sha512-HXXqVUq7+pcKeLqqZj6mHFUMvXtOJt1uoUx09pFW6011inTMxqI8BA8PM95myrIyyKwdnzjdFjLiE6KBPVtJIg==
   dependencies:
     asn1 "~0.2.3"
     assert-plus "^1.0.0"
@@ -15763,14 +15001,14 @@ sshpk@^1.7.0:
     safer-buffer "^2.0.2"
     tweetnacl "~0.14.0"
 
-ssri@^6.0.0:
+ssri@^6.0.1:
   version "6.0.1"
   resolved "https://registry.yarnpkg.com/ssri/-/ssri-6.0.1.tgz#2a3c41b28dd45b62b63676ecb74001265ae9edd8"
   integrity sha512-3Wge10hNcT1Kur4PDFwEieXSCMCJs/7WvSACcrMYrNp+b8kDL1/0wJch5Ni2WrtwEa2IO8OsVfeKIciKCDx/QA==
   dependencies:
     figgy-pudding "^3.5.1"
 
-stable@~0.1.6:
+stable@^0.1.8:
   version "0.1.8"
   resolved "https://registry.yarnpkg.com/stable/-/stable-0.1.8.tgz#836eb3c8382fe2936feaf544631017ce7d47a3cf"
   integrity sha512-ji9qxRnOVfcuLDySj9qzhGSEFVobyt1kIOSkj1qZzYLzq7Tos/oUUWvotUPQLlrsidqsK6tBH89Bc9kL5zHA6w==
@@ -15809,9 +15047,9 @@ static-extend@^0.1.1:
     object-copy "^0.1.0"
 
 static-site-generator-webpack-plugin@^3.4.1:
-  version "3.4.1"
-  resolved "https://registry.yarnpkg.com/static-site-generator-webpack-plugin/-/static-site-generator-webpack-plugin-3.4.1.tgz#6ee22468830bc546798a37e0fca6fd699cc93b81"
-  integrity sha1-buIkaIMLxUZ5ijfg/Kb9aZzJO4E=
+  version "3.4.2"
+  resolved "https://registry.yarnpkg.com/static-site-generator-webpack-plugin/-/static-site-generator-webpack-plugin-3.4.2.tgz#ad9fd0a4fb8b6f439a7a66018320b459bdb6d916"
+  integrity sha512-39Kn+fZDVjolLYuX5y1rDvksJIW0QEUaEC/AVO/UewNXxGzoSQI1UYnRsL+ocAcN5Yti6d6rJgEL0qZ5tNXfdw==
   dependencies:
     bluebird "^3.0.5"
     cheerio "^0.22.0"
@@ -15837,9 +15075,9 @@ steno@^0.4.1:
     graceful-fs "^4.1.3"
 
 stream-browserify@^2.0.1:
-  version "2.0.1"
-  resolved "https://registry.yarnpkg.com/stream-browserify/-/stream-browserify-2.0.1.tgz#66266ee5f9bdb9940a4e4514cafb43bb71e5c9db"
-  integrity sha1-ZiZu5fm9uZQKTkUUyvtDu3Hlyds=
+  version "2.0.2"
+  resolved "https://registry.yarnpkg.com/stream-browserify/-/stream-browserify-2.0.2.tgz#87521d38a44aa7ee91ce1cd2a47df0cb49dd660b"
+  integrity sha512-nX6hmklHs/gr2FuxYDltq8fJA1GDlxKQCz8O/IM4atRqBH8OORmBNgfvW5gG10GT/qQ9u0CzIvr2X5Pkt6ntqg==
   dependencies:
     inherits "~2.0.1"
     readable-stream "^2.0.2"
@@ -15943,11 +15181,11 @@ string-width@^3.0.0:
     strip-ansi "^5.0.0"
 
 string.prototype.matchall@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/string.prototype.matchall/-/string.prototype.matchall-3.0.0.tgz#66f4d8dd5c6c6cea4dffb55ec5f3184a8dd0dd59"
-  integrity sha512-/g0YW/cEfXASRHAaLR7VZbTUlxgP14fmCsfSRFG2gvlG2S1q9rBpjYnEy/EIIzY+bjzs2nTfAHJYXmQ+zTnXSQ==
+  version "3.0.1"
+  resolved "https://registry.yarnpkg.com/string.prototype.matchall/-/string.prototype.matchall-3.0.1.tgz#5a9e0b64bcbeb336aa4814820237c2006985646d"
+  integrity sha512-NSiU0ILQr9PQ1SZmM1X327U5LsM+KfDTassJfqN1al1+0iNpKzmQ4BfXOJwRnTEqv8nKJ67mFpqRoPaGWwvy5A==
   dependencies:
-    define-properties "^1.1.2"
+    define-properties "^1.1.3"
     es-abstract "^1.12.0"
     function-bind "^1.1.1"
     has-symbols "^1.0.0"
@@ -15971,12 +15209,28 @@ string.prototype.padstart@^3.0.0:
     es-abstract "^1.4.3"
     function-bind "^1.0.2"
 
+string.prototype.trim@^1.1.2:
+  version "1.1.2"
+  resolved "https://registry.yarnpkg.com/string.prototype.trim/-/string.prototype.trim-1.1.2.tgz#d04de2c89e137f4d7d206f086b5ed2fae6be8cea"
+  integrity sha1-0E3iyJ4Tf019IG8Ia17S+ua+jOo=
+  dependencies:
+    define-properties "^1.1.2"
+    es-abstract "^1.5.0"
+    function-bind "^1.0.2"
+
 string_decoder@^0.10.25, string_decoder@~0.10.x:
   version "0.10.31"
   resolved "https://registry.yarnpkg.com/string_decoder/-/string_decoder-0.10.31.tgz#62e203bc41766c6c28c9fc84301dab1c5310fa94"
   integrity sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ=
 
-string_decoder@^1.0.0, string_decoder@~1.1.1:
+string_decoder@^1.0.0, string_decoder@^1.1.1:
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/string_decoder/-/string_decoder-1.2.0.tgz#fe86e738b19544afe70469243b2a1ee9240eae8d"
+  integrity sha512-6YqyX6ZWEYguAxgZzHGL7SsCeGx3V2TtOTqZz1xSTSWnqsbWwbptafNyvf/ACquZUXV3DANr5BDIwNYe1mN42w==
+  dependencies:
+    safe-buffer "~5.1.0"
+
+string_decoder@~1.1.1:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/string_decoder/-/string_decoder-1.1.1.tgz#9cf1611ba62685d7030ae9e4ba34149c3af03fc8"
   integrity sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==
@@ -16000,20 +15254,20 @@ strip-ansi@3.0.1, strip-ansi@^3.0.0, strip-ansi@^3.0.1:
   dependencies:
     ansi-regex "^2.0.0"
 
-strip-ansi@4.0.0, strip-ansi@^4.0.0:
-  version "4.0.0"
-  resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-4.0.0.tgz#a8479022eb1ac368a871389b635262c505ee368f"
-  integrity sha1-qEeQIusaw2iocTibY1JixQXuNo8=
-  dependencies:
-    ansi-regex "^3.0.0"
-
-strip-ansi@^5.0.0:
+strip-ansi@5.0.0, strip-ansi@^5.0.0:
   version "5.0.0"
   resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-5.0.0.tgz#f78f68b5d0866c20b2c9b8c61b5298508dc8756f"
   integrity sha512-Uu7gQyZI7J7gn5qLn1Np3G9vcYGTVqB+lFTytnDJv83dd8T22aGH451P3jueT2/QemInJDfxHB5Tde5OzgG1Ow==
   dependencies:
     ansi-regex "^4.0.0"
 
+strip-ansi@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-4.0.0.tgz#a8479022eb1ac368a871389b635262c505ee368f"
+  integrity sha1-qEeQIusaw2iocTibY1JixQXuNo8=
+  dependencies:
+    ansi-regex "^3.0.0"
+
 strip-bom-stream@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/strip-bom-stream/-/strip-bom-stream-1.0.0.tgz#e7144398577d51a6bed0fa1994fa05f43fd988ee"
@@ -16051,13 +15305,6 @@ strip-dirs@^1.0.0:
     minimist "^1.1.0"
     sum-up "^1.0.1"
 
-strip-dirs@^2.0.0:
-  version "2.1.0"
-  resolved "https://registry.yarnpkg.com/strip-dirs/-/strip-dirs-2.1.0.tgz#4987736264fc344cf20f6c34aca9d13d1d4ed6c5"
-  integrity sha512-JOCxOeKLm2CAS73y/U4ZeZPTkE+gNVCzKt7Eox84Iej1LT/2pTWYpZKJuxwQpvX1LiZb1xokNR7RLfuBAa7T3g==
-  dependencies:
-    is-natural-number "^4.0.1"
-
 strip-eof@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/strip-eof/-/strip-eof-1.0.0.tgz#bb43ff5598a6eb05d89b59fcd129c983313606bf"
@@ -16138,7 +15385,7 @@ supports-color@^2.0.0:
 
 supports-color@^3.1.0, supports-color@^3.1.1, supports-color@^3.2.3:
   version "3.2.3"
-  resolved "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz#65ac0504b3954171d8a64946b2ae3cbb8a5f54f6"
+  resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-3.2.3.tgz#65ac0504b3954171d8a64946b2ae3cbb8a5f54f6"
   integrity sha1-ZawFBLOVQXHYpklGsq48u4pfVPY=
   dependencies:
     has-flag "^1.0.0"
@@ -16179,22 +15426,22 @@ svgo@^0.7.0, svgo@^0.7.2:
     whet.extend "~0.9.9"
 
 svgo@^1.1.1:
-  version "1.1.1"
-  resolved "https://registry.yarnpkg.com/svgo/-/svgo-1.1.1.tgz#12384b03335bcecd85cfa5f4e3375fed671cb985"
-  integrity sha512-GBkJbnTuFpM4jFbiERHDWhZc/S/kpHToqmZag3aEBjPYK44JAN2QBjvrGIxLOoCyMZjuFQIfTO2eJd8uwLY/9g==
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/svgo/-/svgo-1.2.0.tgz#305a8fc0f4f9710828c65039bb93d5793225ffc3"
+  integrity sha512-xBfxJxfk4UeVN8asec9jNxHiv3UAMv/ujwBWGYvQhhMb2u3YTGKkiybPcLFDLq7GLLWE9wa73e0/m8L5nTzQbw==
   dependencies:
-    coa "~2.0.1"
-    colors "~1.1.2"
+    chalk "^2.4.1"
+    coa "^2.0.2"
     css-select "^2.0.0"
-    css-select-base-adapter "~0.1.0"
+    css-select-base-adapter "^0.1.1"
     css-tree "1.0.0-alpha.28"
     css-url-regex "^1.1.0"
-    csso "^3.5.0"
+    csso "^3.5.1"
     js-yaml "^3.12.0"
     mkdirp "~0.5.1"
-    object.values "^1.0.4"
+    object.values "^1.1.0"
     sax "~1.2.4"
-    stable "~0.1.6"
+    stable "^0.1.8"
     unquote "~1.1.1"
     util.promisify "~1.0.0"
 
@@ -16270,7 +15517,7 @@ tar-fs@^1.13.0:
     pump "^1.0.0"
     tar-stream "^1.1.2"
 
-tar-stream@^1.1.1, tar-stream@^1.1.2, tar-stream@^1.5.2:
+tar-stream@^1.1.1, tar-stream@^1.1.2:
   version "1.6.2"
   resolved "https://registry.yarnpkg.com/tar-stream/-/tar-stream-1.6.2.tgz#8ea55dab37972253d9a9af90fdcd559ae435c555"
   integrity sha512-rzS0heiNf8Xn7/mpdSVVSMAWAoy9bfb1WOTYC78Z0UQKeKa/CWS8FOq0lKGNa8DWKAn9gxjCvMLYc5PGXYlK2A==
@@ -16284,14 +15531,14 @@ tar-stream@^1.1.1, tar-stream@^1.1.2, tar-stream@^1.5.2:
     xtend "^4.0.0"
 
 tar@^4, tar@^4.4.6:
-  version "4.4.6"
-  resolved "https://registry.yarnpkg.com/tar/-/tar-4.4.6.tgz#63110f09c00b4e60ac8bcfe1bf3c8660235fbc9b"
-  integrity sha512-tMkTnh9EdzxyfW+6GK6fCahagXsnYk6kE6S9Gr9pjVdys769+laCTbodXDhPAjzVtEBazRgP0gYqOjnk9dQzLg==
+  version "4.4.8"
+  resolved "https://registry.yarnpkg.com/tar/-/tar-4.4.8.tgz#b19eec3fde2a96e64666df9fdb40c5ca1bc3747d"
+  integrity sha512-LzHF64s5chPQQS0IYBn9IN5h3i98c12bo4NCO7e0sGM2llXQ3p2FGC5sdENN4cTW48O915Sh+x+EXx7XW96xYQ==
   dependencies:
-    chownr "^1.0.1"
+    chownr "^1.1.1"
     fs-minipass "^1.2.5"
-    minipass "^2.3.3"
-    minizlib "^1.1.0"
+    minipass "^2.3.4"
+    minizlib "^1.1.1"
     mkdirp "^0.5.0"
     safe-buffer "^5.1.2"
     yallist "^3.0.2"
@@ -16337,42 +15584,28 @@ term-size@^1.2.0:
   dependencies:
     execa "^0.7.0"
 
-terser-webpack-plugin@^1.1.0:
-  version "1.1.0"
-  resolved "https://registry.yarnpkg.com/terser-webpack-plugin/-/terser-webpack-plugin-1.1.0.tgz#cf7c25a1eee25bf121f4a587bb9e004e3f80e528"
-  integrity sha512-61lV0DSxMAZ8AyZG7/A4a3UPlrbOBo8NIQ4tJzLPAdGOQ+yoNC7l5ijEow27lBAL2humer01KLS6bGIMYQxKoA==
+terser-webpack-plugin@^1.1.0, terser-webpack-plugin@^1.2.1:
+  version "1.2.3"
+  resolved "https://registry.yarnpkg.com/terser-webpack-plugin/-/terser-webpack-plugin-1.2.3.tgz#3f98bc902fac3e5d0de730869f50668561262ec8"
+  integrity sha512-GOK7q85oAb/5kE12fMuLdn2btOS9OBZn4VsecpHDywoUC/jLhSAKOiYo0ezx7ss2EXPMzyEWFoE0s1WLE+4+oA==
   dependencies:
     cacache "^11.0.2"
     find-cache-dir "^2.0.0"
     schema-utils "^1.0.0"
     serialize-javascript "^1.4.0"
     source-map "^0.6.1"
-    terser "^3.8.1"
+    terser "^3.16.1"
     webpack-sources "^1.1.0"
     worker-farm "^1.5.2"
 
-terser-webpack-plugin@^1.2.1:
-  version "1.2.1"
-  resolved "https://registry.yarnpkg.com/terser-webpack-plugin/-/terser-webpack-plugin-1.2.1.tgz#7545da9ae5f4f9ae6a0ac961eb46f5e7c845cc26"
-  integrity sha512-GGSt+gbT0oKcMDmPx4SRSfJPE1XaN3kQRWG4ghxKQw9cn5G9x6aCKSsgYdvyM0na9NJ4Drv0RG6jbBByZ5CMjw==
-  dependencies:
-    cacache "^11.0.2"
-    find-cache-dir "^2.0.0"
-    schema-utils "^1.0.0"
-    serialize-javascript "^1.4.0"
-    source-map "^0.6.1"
-    terser "^3.8.1"
-    webpack-sources "^1.1.0"
-    worker-farm "^1.5.2"
-
-terser@^3.8.1:
-  version "3.11.0"
-  resolved "https://registry.yarnpkg.com/terser/-/terser-3.11.0.tgz#60782893e1f4d6788acc696351f40636d0e37af0"
-  integrity sha512-5iLMdhEPIq3zFWskpmbzmKwMQixKmTYwY3Ox9pjtSklBLnHiuQ0GKJLhL1HSYtyffHM3/lDIFBnb82m9D7ewwQ==
+terser@^3.16.1:
+  version "3.16.1"
+  resolved "https://registry.yarnpkg.com/terser/-/terser-3.16.1.tgz#5b0dd4fa1ffd0b0b43c2493b2c364fd179160493"
+  integrity sha512-JDJjgleBROeek2iBcSNzOHLKsB/MdDf+E/BOAJ0Tk9r7p9/fVobfv7LMJ/g/k3v9SXdmjZnIlFd5nfn/Rt0Xow==
   dependencies:
     commander "~2.17.1"
     source-map "~0.6.1"
-    source-map-support "~0.5.6"
+    source-map-support "~0.5.9"
 
 text-table@0.2.0:
   version "0.2.0"
@@ -16394,6 +15627,14 @@ through2-filter@^2.0.0:
     through2 "~2.0.0"
     xtend "~4.0.0"
 
+through2-filter@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/through2-filter/-/through2-filter-3.0.0.tgz#700e786df2367c2c88cd8aa5be4cf9c1e7831254"
+  integrity sha512-jaRjI2WxN3W1V8/FMZ9HKIBXixtiqs3SQSX4/YGIiP3gL6djW48VoZq9tDqeCWs3MT8YY5wb/zli8VW8snY1CA==
+  dependencies:
+    through2 "~2.0.0"
+    xtend "~4.0.0"
+
 through2@^0.6.0, through2@^0.6.1:
   version "0.6.5"
   resolved "https://registry.yarnpkg.com/through2/-/through2-0.6.5.tgz#41ab9c67b29d57209071410e1d7a7a968cd3ad48"
@@ -16403,11 +15644,11 @@ through2@^0.6.0, through2@^0.6.1:
     xtend ">=4.0.0 <4.1.0-0"
 
 through2@^2.0.0, through2@^2.0.1, through2@~2.0.0:
-  version "2.0.3"
-  resolved "https://registry.yarnpkg.com/through2/-/through2-2.0.3.tgz#0004569b37c7c74ba39c43f3ced78d1ad94140be"
-  integrity sha1-AARWmzfHx0ujnEPzzteNGtlBQL4=
+  version "2.0.5"
+  resolved "https://registry.yarnpkg.com/through2/-/through2-2.0.5.tgz#01c1e39eb31d07cb7d03a96a70823260b23132cd"
+  integrity sha512-/mrRod8xqpA+IHSLyGCQ2s8SPHiCDEeQJSep1jqLYeEUClOFG2Qsh+4FU6G9VeqpZnGW/Su8LQGc4YKni5rYSQ==
   dependencies:
-    readable-stream "^2.1.5"
+    readable-stream "~2.3.6"
     xtend "~4.0.1"
 
 through@^2.3.6:
@@ -16426,9 +15667,9 @@ time-stamp@^1.0.0:
   integrity sha1-dkpaEa9QVhkhsTPztE5hhofg9cM=
 
 time-stamp@^2.0.0:
-  version "2.1.0"
-  resolved "https://registry.yarnpkg.com/time-stamp/-/time-stamp-2.1.0.tgz#6c5c0b2bc835a244616abcfddf81ce13a1975c9f"
-  integrity sha512-lJbq6KsFhZJtN3fPUVje1tq/hHsJOKUUcUj/MGCiQR6qWBDcyi5kxL9J7/RnaEChCn0+L/DUN2WvemDrkk4i3Q==
+  version "2.2.0"
+  resolved "https://registry.yarnpkg.com/time-stamp/-/time-stamp-2.2.0.tgz#917e0a66905688790ec7bbbde04046259af83f57"
+  integrity sha512-zxke8goJQpBeEgD82CXABeMh0LSJcj7CXEd0OHOg45HgcofF7pxNwZm9+RknpxpDhwN4gFpySkApKfFYfRQnUA==
 
 timed-out@^3.0.0:
   version "3.1.3"
@@ -16448,9 +15689,9 @@ timers-browserify@^2.0.2, timers-browserify@^2.0.4:
     setimmediate "^1.0.4"
 
 tiny-emitter@^2.0.0:
-  version "2.0.2"
-  resolved "https://registry.yarnpkg.com/tiny-emitter/-/tiny-emitter-2.0.2.tgz#82d27468aca5ade8e5fd1e6d22b57dd43ebdfb7c"
-  integrity sha512-2NM0auVBGft5tee/OxP4PI3d8WItkDM+fPnaRAVo6xTDI2knbz9eC5ArWGqtGlYqiH3RU5yMpdyTTO7MguC4ow==
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/tiny-emitter/-/tiny-emitter-2.1.0.tgz#1d1a56edfc51c43e863cbb5382a72330e3555423"
+  integrity sha512-NB6Dk1A9xgQPMoGqC5CVXn123gWyte215ONT5Pp5a0yt4nlEoO1ZWeCwpncaekPHXO60i47ihFnZPiRPjRMq4Q==
 
 tinycolor2@^1.1.2:
   version "1.4.1"
@@ -16558,9 +15799,9 @@ toidentifier@1.0.0:
   integrity sha512-yaOH/Pk/VEhBWWTlhI+qXxDFXlejDGcQipMlyxda9nthulaxLZUNcUqFxokp0vcYnvteJln5FNQDRrxj3YcbVw==
 
 toml@^2.3.2:
-  version "2.3.3"
-  resolved "https://registry.yarnpkg.com/toml/-/toml-2.3.3.tgz#8d683d729577cb286231dfc7a8affe58d31728fb"
-  integrity sha512-O7L5hhSQHxuufWUdcTRPfuTh3phKfAZ/dqfxZFoxPCj2RYmpaSGLEIs016FCXItQwNr08yefUB5TSjzRYnajTA==
+  version "2.3.6"
+  resolved "https://registry.yarnpkg.com/toml/-/toml-2.3.6.tgz#25b0866483a9722474895559088b436fd11f861b"
+  integrity sha512-gVweAectJU3ebq//Ferr2JUY4WKSDe5N+z0FvjDncLGyHmIDoxgY/2Ie4qfEIDm4IS7OA6Rmdm7pdEEdMcV/xQ==
 
 topo@2.x.x:
   version "2.0.2"
@@ -16690,9 +15931,9 @@ typedarray@^0.0.6:
   integrity sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=
 
 ua-parser-js@^0.7.18:
-  version "0.7.18"
-  resolved "https://registry.yarnpkg.com/ua-parser-js/-/ua-parser-js-0.7.18.tgz#a7bfd92f56edfb117083b69e31d2aa8882d4b1ed"
-  integrity sha512-LtzwHlVHwFGTptfNSgezHp7WUlwiqb0gA9AALRbKaERfxwJoiX0A73QbTToxteIAuIaFshhgIZfqK8s7clqgnA==
+  version "0.7.19"
+  resolved "https://registry.yarnpkg.com/ua-parser-js/-/ua-parser-js-0.7.19.tgz#94151be4c0a7fb1d001af7022fdaca4642659e4b"
+  integrity sha512-T3PVJ6uz8i0HzPxOF9SWzWAlfN/DavlpQqepn22xgve/5QecC+XMCAtmUNnY7C9StehaV6exjUCI801lOI7QlQ==
 
 uglify-js@3.4.x:
   version "3.4.9"
@@ -16727,19 +15968,6 @@ uglify-to-browserify@~1.0.0:
   resolved "https://registry.yarnpkg.com/uglify-to-browserify/-/uglify-to-browserify-1.0.2.tgz#6e0924d6bda6b5afe349e39a6d632850a0f882b7"
   integrity sha1-bgkk1r2mta/jSeOabWMoUKD4grc=
 
-ultron@~1.1.0:
-  version "1.1.1"
-  resolved "https://registry.yarnpkg.com/ultron/-/ultron-1.1.1.tgz#9fe1536a10a664a65266a1e3ccf85fd36302bc9c"
-  integrity sha512-UIEXBNeYmKptWH6z8ZnqTeS8fV74zG0/eRU9VGkpzz+LIJNs8W/zM/L+7ctCkRrgbNnnR0xxw4bKOr0cW0N0Og==
-
-unbzip2-stream@^1.0.9:
-  version "1.3.1"
-  resolved "https://registry.yarnpkg.com/unbzip2-stream/-/unbzip2-stream-1.3.1.tgz#7854da51622a7e63624221196357803b552966a1"
-  integrity sha512-fIZnvdjblYs7Cru/xC6tCPVhz7JkYcVQQkePwMLyQELzYTds2Xn8QefPVnvdVhhZqubxNA1cASXEH5wcK0Bucw==
-  dependencies:
-    buffer "^3.0.1"
-    through "^2.3.6"
-
 unc-path-regex@^0.1.0, unc-path-regex@^0.1.2:
   version "0.1.2"
   resolved "https://registry.yarnpkg.com/unc-path-regex/-/unc-path-regex-0.1.2.tgz#e73dd3d7b0d7c5ed86fbac6b0ae7d8c6a69d50fa"
@@ -16774,15 +16002,15 @@ unicode-match-property-ecmascript@^1.0.4:
     unicode-canonical-property-names-ecmascript "^1.0.4"
     unicode-property-aliases-ecmascript "^1.0.4"
 
-unicode-match-property-value-ecmascript@^1.0.2:
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/unicode-match-property-value-ecmascript/-/unicode-match-property-value-ecmascript-1.0.2.tgz#9f1dc76926d6ccf452310564fd834ace059663d4"
-  integrity sha512-Rx7yODZC1L/T8XKo/2kNzVAQaRE88AaMvI1EF/Xnj3GW2wzN6fop9DDWuFAKUVFH7vozkz26DzP0qyWLKLIVPQ==
+unicode-match-property-value-ecmascript@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/unicode-match-property-value-ecmascript/-/unicode-match-property-value-ecmascript-1.1.0.tgz#5b4b426e08d13a80365e0d657ac7a6c1ec46a277"
+  integrity sha512-hDTHvaBk3RmFzvSl0UVrUmC3PuW9wKVnpoUDYH0JDkSIovzw+J5viQmeYHxVSBptubnr7PbH2e0fnpDRQnQl5g==
 
 unicode-property-aliases-ecmascript@^1.0.4:
-  version "1.0.4"
-  resolved "https://registry.yarnpkg.com/unicode-property-aliases-ecmascript/-/unicode-property-aliases-ecmascript-1.0.4.tgz#5a533f31b4317ea76f17d807fa0d116546111dd0"
-  integrity sha512-2WSLa6OdYd2ng8oqiGIWnJqyFArvhn+5vgx5GTxMbUYjCYKUcuKS62YLFF0R/BDGlB1yzXjQOLtPAfHsgirEpg==
+  version "1.0.5"
+  resolved "https://registry.yarnpkg.com/unicode-property-aliases-ecmascript/-/unicode-property-aliases-ecmascript-1.0.5.tgz#a9cc6cc7ce63a0a3023fc99e341b94431d405a57"
+  integrity sha512-L5RAqCfXqAwR3RriF8pM0lU0w4Ryf/GgzONwi6KnL1taJQa7x1TCxdJnILX59WIGOwR57IVxn7Nej0fz1Ny6fw==
 
 unified@^5.0.0:
   version "5.1.0"
@@ -16844,7 +16072,7 @@ uniqs@^2.0.0:
   resolved "https://registry.yarnpkg.com/uniqs/-/uniqs-2.0.0.tgz#ffede4b36b25290696e6e165d4a59edb998e6b02"
   integrity sha1-/+3ks2slKQaW5uFl1KWe25mOawI=
 
-unique-filename@^1.1.0:
+unique-filename@^1.1.1:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/unique-filename/-/unique-filename-1.1.1.tgz#1d69769369ada0583103a1e6ae87681b56573230"
   integrity sha512-Vmp0jIp2ln35UTXuryvjzkjGdRyf9b2lTXuSYUiPmzRcl3FDtYqAwOnTJkAngD9SWhnoJzDbTKwaOrZ+STtxNQ==
@@ -16859,12 +16087,12 @@ unique-slug@^2.0.0:
     imurmurhash "^0.1.4"
 
 unique-stream@^2.0.2:
-  version "2.2.1"
-  resolved "https://registry.yarnpkg.com/unique-stream/-/unique-stream-2.2.1.tgz#5aa003cfbe94c5ff866c4e7d668bb1c4dbadb369"
-  integrity sha1-WqADz76Uxf+GbE59ZouxxNuts2k=
+  version "2.3.1"
+  resolved "https://registry.yarnpkg.com/unique-stream/-/unique-stream-2.3.1.tgz#c65d110e9a4adf9a6c5948b28053d9a8d04cbeac"
+  integrity sha512-2nY4TnBE70yoxHkDli7DMazpWiP7xMdCYqU2nBRO0UB+ZpEkGsSija7MvmvnZFUeC+mrgiUfcHSr3LmRFIg4+A==
   dependencies:
-    json-stable-stringify "^1.0.0"
-    through2-filter "^2.0.0"
+    json-stable-stringify-without-jsonify "^1.0.1"
+    through2-filter "^3.0.0"
 
 unique-string@^1.0.0:
   version "1.0.0"
@@ -16881,9 +16109,9 @@ unist-builder@^1.0.1:
     object-assign "^4.1.0"
 
 unist-util-generated@^1.1.0:
-  version "1.1.2"
-  resolved "https://registry.yarnpkg.com/unist-util-generated/-/unist-util-generated-1.1.2.tgz#8b993f9239d8e560be6ee6e91c3f7b7208e5ce25"
-  integrity sha512-1HcwiEO62dr0XWGT+abVK4f0aAm8Ik8N08c5nAYVmuSxfvpA9rCcNyX/le8xXj1pJK5nBrGlZefeWB6bN8Pstw==
+  version "1.1.3"
+  resolved "https://registry.yarnpkg.com/unist-util-generated/-/unist-util-generated-1.1.3.tgz#ca650470aef2fbcc5fe54c465bc26b41ca109e2b"
+  integrity sha512-qlPeDqnQnd84KIqwphzOR+l02cxjDzvEYEBl84EjmKRrX4eUmjyAo8xJv1SCDhJqNjyHRnBMZWNKAiBtXE6hBg==
 
 unist-util-is@^2.0.0, unist-util-is@^2.1.2:
   version "2.1.2"
@@ -16891,16 +16119,16 @@ unist-util-is@^2.0.0, unist-util-is@^2.1.2:
   integrity sha512-YkXBK/H9raAmG7KXck+UUpnKiNmUdB+aBGrknfQ4EreE1banuzrKABx3jP6Z5Z3fMSPMQQmeXBlKpCbMwBkxVw==
 
 unist-util-modify-children@^1.0.0:
-  version "1.1.2"
-  resolved "https://registry.yarnpkg.com/unist-util-modify-children/-/unist-util-modify-children-1.1.2.tgz#c7f1b91712554ee59c47a05b551ed3e052a4e2d1"
-  integrity sha512-GRi04yhng1WqBf5RBzPkOtWAadcZS2gvuOgNn/cyJBYNxtTuyYqTKN0eg4rC1YJwGnzrqfRB3dSKm8cNCjNirg==
+  version "1.1.3"
+  resolved "https://registry.yarnpkg.com/unist-util-modify-children/-/unist-util-modify-children-1.1.3.tgz#d764a935f612dfb21b1bb92b0ea24321dc19a5f7"
+  integrity sha512-Aw3Us+NPrJGYWyLhcaqYzgxd/pryIanDNHVVvwdtTEEQ3Yfa/+sjnT2EeAAHbtTMAaYEdPW3XN6jxbzVWAo/BQ==
   dependencies:
     array-iterate "^1.0.0"
 
 unist-util-position@^3.0.0:
-  version "3.0.1"
-  resolved "https://registry.yarnpkg.com/unist-util-position/-/unist-util-position-3.0.1.tgz#8e220c24658239bf7ddafada5725ed0ea1ebbc26"
-  integrity sha512-05QfJDPI7PE1BIUtAxeSV+cDx21xP7+tUZgSval5CA7tr0pHBwybF7OnEa1dOFqg6BfYH/qiMUnWwWj+Frhlww==
+  version "3.0.2"
+  resolved "https://registry.yarnpkg.com/unist-util-position/-/unist-util-position-3.0.2.tgz#80ad4a05efc4ab01a66886cc70493893ba73c5eb"
+  integrity sha512-npmFu92l/+b1Ao6uGP4I1WFz9hsKv7qleZ4aliw6x0RVu6A9A3tAf57NMpFfzQ02jxRtJZuRn+C8xWT7GWnH0g==
 
 unist-util-remove-position@^1.0.0, unist-util-remove-position@^1.1.1:
   version "1.1.2"
@@ -16983,7 +16211,7 @@ unzip-response@^2.0.1:
   resolved "https://registry.yarnpkg.com/unzip-response/-/unzip-response-2.0.1.tgz#d2f0f737d16b0615e72a6935ed04214572d56f97"
   integrity sha1-0vD3N9FrBhXnKmk17QQhRXLVb5c=
 
-upath@^1.0.5:
+upath@^1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/upath/-/upath-1.1.0.tgz#35256597e46a581db4793d0ce47fa9aebfc9fabd"
   integrity sha512-bzpH/oBhoS/QI/YtbkqCg6VEiPYjSZtrHQM6/QnJS6OL9pKUFLqb3aFh4Scvwm45+7iAgiMkLhSbaZxUqmrprw==
@@ -17060,9 +16288,9 @@ url-parse-lax@^1.0.0:
     prepend-http "^1.0.1"
 
 url-parse@^1.1.8, url-parse@^1.4.3:
-  version "1.4.3"
-  resolved "https://registry.yarnpkg.com/url-parse/-/url-parse-1.4.3.tgz#bfaee455c889023219d757e045fa6a684ec36c15"
-  integrity sha512-rh+KuAW36YKo0vClhQzLLveoj8FwPJNu65xLb7Mrt+eZht0IPT0IXgSv8gcMegZ6NvjJUALf6Mf25POlMwD1Fw==
+  version "1.4.4"
+  resolved "https://registry.yarnpkg.com/url-parse/-/url-parse-1.4.4.tgz#cac1556e95faa0303691fec5cf9d5a1bc34648f8"
+  integrity sha512-/92DTTorg4JjktLNLe6GPS2/RvAd/RGr6LuktmWSMLEOa6rjnlrFXNgSbSmkNvCoL2T028A0a1JaJLzRMlFoHg==
   dependencies:
     querystringify "^2.0.0"
     requires-port "^1.0.0"
@@ -17097,7 +16325,7 @@ user-home@^1.1.1:
   resolved "https://registry.yarnpkg.com/user-home/-/user-home-1.1.1.tgz#2b5be23a32b63a7c9deb8d0f28d485724a3df190"
   integrity sha1-K1viOjK2Onyd640PKNSFcko98ZA=
 
-util-deprecate@^1.0.2, util-deprecate@~1.0.1:
+util-deprecate@^1.0.1, util-deprecate@^1.0.2, util-deprecate@~1.0.1:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/util-deprecate/-/util-deprecate-1.0.2.tgz#450d4dc9fa70de732762fbd2d4a28981419a0ccf"
   integrity sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8=
@@ -17124,6 +16352,13 @@ util@^0.10.3:
   dependencies:
     inherits "2.0.3"
 
+util@^0.11.0:
+  version "0.11.1"
+  resolved "https://registry.yarnpkg.com/util/-/util-0.11.1.tgz#3236733720ec64bb27f6e26f421aaa2e1b588d61"
+  integrity sha512-HShAsny+zS2TZfaXxD9tYj4HQGlBezXZMZuM/S5PKLLoZkShZiGk9o5CzukI1LVHZvjdvZ2Sj1aW/Ndn2NB/HQ==
+  dependencies:
+    inherits "2.0.3"
+
 utila@^0.4.0, utila@~0.4:
   version "0.4.0"
   resolved "https://registry.yarnpkg.com/utila/-/utila-0.4.0.tgz#8a16a05d445657a3aea5eecc5b12a4fa5379772c"
@@ -17209,14 +16444,14 @@ verror@1.10.0:
     extsprintf "^1.2.0"
 
 vfile-location@^2.0.0:
-  version "2.0.3"
-  resolved "https://registry.yarnpkg.com/vfile-location/-/vfile-location-2.0.3.tgz#083ba80e50968e8d420be49dd1ea9a992131df77"
-  integrity sha512-zM5/l4lfw1CBoPx3Jimxoc5RNDAHHpk6AM6LM0pTIkm5SUSsx8ZekZ0PVdf0WEZ7kjlhSt7ZlqbRL6Cd6dBs6A==
+  version "2.0.4"
+  resolved "https://registry.yarnpkg.com/vfile-location/-/vfile-location-2.0.4.tgz#2a5e7297dd0d9e2da4381464d04acc6b834d3e55"
+  integrity sha512-KRL5uXQPoUKu+NGvQVL4XLORw45W62v4U4gxJ3vRlDfI9QsT4ZN1PNXn/zQpKUulqGDpYuT0XDfp5q9O87/y/w==
 
 vfile-message@^1.0.0:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/vfile-message/-/vfile-message-1.0.1.tgz#51a2ccd8a6b97a7980bb34efb9ebde9632e93677"
-  integrity sha512-vSGCkhNvJzO6VcWC6AlJW4NtYOVtS+RgCaqFIYUjoGIlHnFL+i0LbtYvonDWOMcB97uTPT4PRsyYY7REWC9vug==
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/vfile-message/-/vfile-message-1.1.1.tgz#5833ae078a1dfa2d96e9647886cd32993ab313e1"
+  integrity sha512-1WmsopSGhWt5laNir+633LszXvZ+Z/lxveBf6yhGsqnQIhlhzooZae7zV6YVM1Sdkw68dtAW3ow0pOdPANugvA==
   dependencies:
     unist-util-stringify-position "^1.1.1"
 
@@ -17310,9 +16545,9 @@ vm-browserify@0.0.4:
     indexof "0.0.1"
 
 vscode-languageserver-types@^3.5.0:
-  version "3.13.0"
-  resolved "https://registry.yarnpkg.com/vscode-languageserver-types/-/vscode-languageserver-types-3.13.0.tgz#b704b024cef059f7b326611c99b9c8753c0a18b4"
-  integrity sha512-BnJIxS+5+8UWiNKCP7W3g9FlE7fErFw0ofP5BXJe7c2tl0VeWh+nNHFbwAS2vmVC4a5kYxHBjRy0UeOtziemVA==
+  version "3.14.0"
+  resolved "https://registry.yarnpkg.com/vscode-languageserver-types/-/vscode-languageserver-types-3.14.0.tgz#d3b5952246d30e5241592b6dde8280e03942e743"
+  integrity sha512-lTmS6AlAlMHOvPQemVwo3CezxBp0sNB95KNPkqp3Nxd5VFEnuG1ByM0zlRWos0zjO3ZWtkvhal0COgiV1xIA4A==
 
 walker@~1.0.5:
   version "1.0.7"
@@ -17336,9 +16571,9 @@ warning@^3.0.0:
     loose-envify "^1.0.0"
 
 warning@^4.0.1, warning@^4.0.2:
-  version "4.0.2"
-  resolved "https://registry.npmjs.org/warning/-/warning-4.0.2.tgz#aa6876480872116fa3e11d434b0d0d8d91e44607"
-  integrity sha512-wbTp09q/9C+jJn4KKJfJfoS6VleK/Dti0yqWSm6KMvJ4MRCXFQNapHuJXutJIrWV0Cf4AhTdeIe4qdKHR1+Hug==
+  version "4.0.3"
+  resolved "https://registry.yarnpkg.com/warning/-/warning-4.0.3.tgz#16e9e077eb8a86d6af7d64aa1e05fd85b4678ca3"
+  integrity sha512-rpJyN222KWIvHJ/F53XSZv0Zl/accqHR8et1kpaMTD/fLCRxtV8iX8czMzY7sVZupTI3zcUTg8eycS2kNF9l6w==
   dependencies:
     loose-envify "^1.0.0"
 
@@ -17404,9 +16639,9 @@ webpack-dev-middleware@^1.10.2, webpack-dev-middleware@^1.8.4:
     time-stamp "^2.0.0"
 
 webpack-dev-middleware@^3.5.1:
-  version "3.6.0"
-  resolved "https://registry.yarnpkg.com/webpack-dev-middleware/-/webpack-dev-middleware-3.6.0.tgz#71f1b04e52ff8d442757af2be3a658237d53a3e5"
-  integrity sha512-oeXA3m+5gbYbDBGo4SvKpAHJJEGMoekUbHgo1RK7CP1sz7/WOSeu/dWJtSTk+rzDCLkPwQhGocgIq6lQqOyOwg==
+  version "3.6.1"
+  resolved "https://registry.yarnpkg.com/webpack-dev-middleware/-/webpack-dev-middleware-3.6.1.tgz#91f2531218a633a99189f7de36045a331a4b9cd4"
+  integrity sha512-XQmemun8QJexMEvNFbD2BIg4eSKrmSIMrTfnl2nql2Sc6OGAYFyb8rwuYrCjl/IiEYYuyTEiimMscu7EXji/Dw==
   dependencies:
     memory-fs "^0.4.1"
     mime "^2.3.1"
@@ -17525,14 +16760,14 @@ webpack@^1.13.3:
     webpack-core "~0.6.9"
 
 webpack@^4.29.0:
-  version "4.29.5"
-  resolved "https://registry.yarnpkg.com/webpack/-/webpack-4.29.5.tgz#52b60a7b0838427c3a894cd801a11dc0836bc79f"
-  integrity sha512-DuWlYUT982c7XVHodrLO9quFbNpVq5FNxLrMUfYUTlgKW0+yPimynYf1kttSQpEneAL1FH3P3OLNgkyImx8qIQ==
+  version "4.29.6"
+  resolved "https://registry.yarnpkg.com/webpack/-/webpack-4.29.6.tgz#66bf0ec8beee4d469f8b598d3988ff9d8d90e955"
+  integrity sha512-MwBwpiE1BQpMDkbnUUaW6K8RFZjljJHArC6tWQJoFm0oQtfoSebtg4Y7/QHnJ/SddtjYLHaKGX64CFjG5rehJw==
   dependencies:
-    "@webassemblyjs/ast" "1.8.3"
-    "@webassemblyjs/helper-module-context" "1.8.3"
-    "@webassemblyjs/wasm-edit" "1.8.3"
-    "@webassemblyjs/wasm-parser" "1.8.3"
+    "@webassemblyjs/ast" "1.8.5"
+    "@webassemblyjs/helper-module-context" "1.8.5"
+    "@webassemblyjs/wasm-edit" "1.8.5"
+    "@webassemblyjs/wasm-parser" "1.8.5"
     acorn "^6.0.5"
     acorn-dynamic-import "^4.0.0"
     ajv "^6.1.0"
@@ -17592,7 +16827,7 @@ which-pm-runs@^1.0.0:
   resolved "https://registry.yarnpkg.com/which-pm-runs/-/which-pm-runs-1.0.0.tgz#670b3afbc552e0b55df6b7780ca74615f23ad1cb"
   integrity sha1-Zws6+8VS4LVd9rd4DKdGFfI60cs=
 
-which@^1.0.9, which@^1.1.1, which@^1.2.12, which@^1.2.14, which@^1.2.9:
+which@^1.0.9, which@^1.1.1, which@^1.2.12, which@^1.2.14, which@^1.2.9, which@^1.3.1:
   version "1.3.1"
   resolved "https://registry.yarnpkg.com/which/-/which-1.3.1.tgz#a45043d54f5805316da8d62f9f50918d3da70b0a"
   integrity sha512-HxJdYWq1MTIQbJ3nw0cqssHoTNU267KlrDuGZ1WYlxDStUtKUhOaJmh112/TZmHxxUfuJqPXSOm7tDyas0OSIQ==
@@ -17607,9 +16842,9 @@ wide-align@^1.1.0:
     string-width "^1.0.2 || 2"
 
 widest-line@^2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/widest-line/-/widest-line-2.0.0.tgz#0142a4e8a243f8882c0233aa0e0281aa76152273"
-  integrity sha1-AUKk6KJD+IgsAjOqDgKBqnYVInM=
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/widest-line/-/widest-line-2.0.1.tgz#7438764730ec7ef4381ce4df82fb98a53142a3fc"
+  integrity sha512-Ba5m9/Fa4Xt9eb2ELXt77JxVDV8w7qQrH0zS/TWSJdLyAwQjWoOzpzj5lwVftDz6n/EOu3tNACS84v509qwnJA==
   dependencies:
     string-width "^2.1.1"
 
@@ -17678,9 +16913,9 @@ wrappy@1:
   integrity sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8=
 
 write-file-atomic@^2.0.0:
-  version "2.3.0"
-  resolved "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-2.3.0.tgz#1ff61575c2e2a4e8e510d6fa4e243cce183999ab"
-  integrity sha512-xuPeK4OdjWqtfi59ylvVL0Yn35SF3zgcAcv7rBPFHVaEapaDr4GdGgm3j7ckTwH9wHL7fGmgfAnb0+THrHb8tA==
+  version "2.4.2"
+  resolved "https://registry.yarnpkg.com/write-file-atomic/-/write-file-atomic-2.4.2.tgz#a7181706dfba17855d221140a9c06e15fcdd87b9"
+  integrity sha512-s0b6vB3xIVRLWywa6X9TOMA7k9zio0TMOsl9ZnDkliA/cfJlpHXAscj0gbHVJiTdIuAYpIyqS5GW91fqm6gG5g==
   dependencies:
     graceful-fs "^4.1.11"
     imurmurhash "^0.1.4"
@@ -17693,14 +16928,12 @@ ws@5.1.1:
   dependencies:
     async-limiter "~1.0.0"
 
-ws@~3.3.1:
-  version "3.3.3"
-  resolved "https://registry.yarnpkg.com/ws/-/ws-3.3.3.tgz#f1cf84fe2d5e901ebce94efaece785f187a228f2"
-  integrity sha512-nnWLa/NwZSt4KQJu51MYlCcSQ5g7INpOrOMt4XV8j4dqTXdmlUmSHQ8/oLC069ckre0fRsgfvsKwbTdtKLCDkA==
+ws@~6.1.0:
+  version "6.1.4"
+  resolved "https://registry.yarnpkg.com/ws/-/ws-6.1.4.tgz#5b5c8800afab925e94ccb29d153c8d02c1776ef9"
+  integrity sha512-eqZfL+NE/YQc1/ZynhojeV8q+H050oR8AZ2uIev7RU10svA9ZnJUddHcOUZTJLinZ9yEfdA2kSATS2qZK5fhJA==
   dependencies:
     async-limiter "~1.0.0"
-    safe-buffer "~5.1.0"
-    ultron "~1.1.0"
 
 x-is-array@^0.1.0:
   version "0.1.0"
@@ -17741,9 +16974,9 @@ xml2js@^0.4.17, xml2js@^0.4.5:
     xmlbuilder "~9.0.1"
 
 xmlbuilder@^10.0.0:
-  version "10.1.0"
-  resolved "https://registry.yarnpkg.com/xmlbuilder/-/xmlbuilder-10.1.0.tgz#62418e950123398140db8150e6e4019329cf3fe4"
-  integrity sha512-In21jFWiaulS7Cmw1fPT1Lm7g7L6ml/uwZNAaKlDZc78szm3pn5oH9gizH7sh1h2GGRb3OkL5kLCeMEENEnZwA==
+  version "10.1.1"
+  resolved "https://registry.yarnpkg.com/xmlbuilder/-/xmlbuilder-10.1.1.tgz#8cae6688cc9b38d850b7c8d3c0a4161dcaf475b0"
+  integrity sha512-OyzrcFLL/nb6fMGHbiRDuPup9ljBycsdCypwuyg5AAHvyWzGfChJpCXMG88AGTIMFhGZ9RccFN1e6lhg3hkwKg==
 
 xmlbuilder@~9.0.1:
   version "9.0.7"
@@ -17781,9 +17014,9 @@ yallist@^2.1.2:
   integrity sha1-HBH5IY8HYImkfdUS+TxmmaaoHVI=
 
 yallist@^3.0.0, yallist@^3.0.2:
-  version "3.0.2"
-  resolved "https://registry.yarnpkg.com/yallist/-/yallist-3.0.2.tgz#8452b4bb7e83c7c188d8041c1a837c773d6d8bb9"
-  integrity sha1-hFK0u36Dx8GI2AQcGoN8dz1ti7k=
+  version "3.0.3"
+  resolved "https://registry.yarnpkg.com/yallist/-/yallist-3.0.3.tgz#b4b049e314be545e3ce802236d6cd22cd91c3de9"
+  integrity sha512-S+Zk8DEWE6oKpV+vI3qWkaK+jSbIK86pCwe2IF/xwIpQ8jEuxpw9NyaGjmp9+BoJv5FV2piqCDcoCtStppiq2A==
 
 yaml-loader@^0.4.0:
   version "0.4.0"
@@ -17893,7 +17126,7 @@ yargs@~3.10.0:
     decamelize "^1.0.0"
     window-size "0.1.0"
 
-yauzl@^2.2.1, yauzl@^2.4.2:
+yauzl@^2.2.1:
   version "2.10.0"
   resolved "https://registry.yarnpkg.com/yauzl/-/yauzl-2.10.0.tgz#c7eb17c93e112cb1086fa6d8e51fb0667b79a5f9"
   integrity sha1-x+sXyT4RLLEIb6bY5R+wZnt5pfk=

From 49915f342031cd1da0c1072e740b1ce9a50813f4 Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Wed, 6 Mar 2019 23:34:44 +0100
Subject: [PATCH 179/249] FIX missing dependency

---
 docs/package.json | 1 +
 docs/yarn.lock    | 9 ++++++++-
 2 files changed, 9 insertions(+), 1 deletion(-)

diff --git a/docs/package.json b/docs/package.json
index 9b75ae3ef70..0744c348611 100644
--- a/docs/package.json
+++ b/docs/package.json
@@ -40,6 +40,7 @@
     "is-builtin-module": "^3.0.0",
     "lodash": "^4.17.11",
     "marked": "^0.5.2",
+    "polished": "^3.0.3",
     "prop-types": "^15.7.2",
     "react": "^16.8.3",
     "react-document-title": "^2.0.3",
diff --git a/docs/yarn.lock b/docs/yarn.lock
index d3747cf09de..9f7902fe06b 100644
--- a/docs/yarn.lock
+++ b/docs/yarn.lock
@@ -838,7 +838,7 @@
   dependencies:
     regenerator-runtime "^0.12.0"
 
-"@babel/runtime@^7.0.0", "@babel/runtime@^7.1.2", "@babel/runtime@^7.2.0", "@babel/runtime@^7.3.4":
+"@babel/runtime@^7.0.0", "@babel/runtime@^7.1.2", "@babel/runtime@^7.2.0", "@babel/runtime@^7.3.1", "@babel/runtime@^7.3.4":
   version "7.3.4"
   resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.3.4.tgz#73d12ba819e365fcf7fd152aed56d6df97d21c83"
   integrity sha512-IvfvnMdSaLBateu0jfsYIpZTxAc2cKEXEMiezGGN75QcBcecDUKd3PgLAncT0oOgxKy8dd8hrJKj9MfzgfZd6g==
@@ -11760,6 +11760,13 @@ polished@^2.3.3:
   dependencies:
     "@babel/runtime" "^7.2.0"
 
+polished@^3.0.3:
+  version "3.0.3"
+  resolved "https://registry.yarnpkg.com/polished/-/polished-3.0.3.tgz#b7d9604936f6dc40031306f3a1136585fc3471b5"
+  integrity sha512-WFgVHAWJubobUzk5B5dcqS2jGw8hB/I/H5hXitR4jd/bvEZBQV4vlw5UGDhLxkLQ1incf9NMFztI4XAryHvJDA==
+  dependencies:
+    "@babel/runtime" "^7.3.1"
+
 popper.js@^1.14.4:
   version "1.14.7"
   resolved "https://registry.yarnpkg.com/popper.js/-/popper.js-1.14.7.tgz#e31ec06cfac6a97a53280c3e55e4e0c860e7738e"

From f4b641743635f8c41f7b538dd1b7bed352608180 Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Wed, 6 Mar 2019 23:42:07 +0100
Subject: [PATCH 180/249] ADD search to all pages

---
 docs/src/components/Docs/Container/index.js  | 33 ++++++++++++++++++--
 docs/src/components/Docs/Container/style.css | 13 +++++---
 docs/src/components/Docs/Nav/dropdown.js     | 12 +++++--
 docs/src/new-components/layout/Header.js     |  1 +
 4 files changed, 50 insertions(+), 9 deletions(-)

diff --git a/docs/src/components/Docs/Container/index.js b/docs/src/components/Docs/Container/index.js
index a305356d106..bfa7e43c216 100644
--- a/docs/src/components/Docs/Container/index.js
+++ b/docs/src/components/Docs/Container/index.js
@@ -1,5 +1,6 @@
+import { window } from 'global';
 import PropTypes from 'prop-types';
-import React from 'react';
+import React, { Component } from 'react';
 import Nav from '../Nav';
 import NavDropdown from '../Nav/dropdown';
 import Content from '../Content';
@@ -12,9 +13,33 @@ const getEditUrl = (selectedSectionId, selectedItemId) => {
   return `${gitHubRepoUrl}/blob/master/docs/src/pages/${docPath}/index.md`;
 };
 
+class Search extends Component {
+  componentDidMount() {
+    window.docsearch({
+      apiKey: 'a4f7f972f1d8f99a66e237e7fd2e489f',
+      indexName: 'storybook-js',
+      inputSelector: '#search',
+      debug: false,
+    });
+  }
+
+  render() {
+    return (
+      <div className="search">
+        <input
+          className="form-control form-control-sm"
+          type="search"
+          id="search"
+          placeholder="type to search"
+        />
+      </div>
+    );
+  }
+}
+
 const Container = ({ sections, selectedItem, selectedSectionId, selectedItemId }) => (
   <div id="docs-container" className="row">
-    <div className="nav col-sm-3 col-md-3 hidden-xs">
+    <div className="nav col-lg-3 col-md-3 d-none d-md-block">
       <Nav
         sections={sections}
         selectedSection={selectedItem.section}
@@ -23,7 +48,7 @@ const Container = ({ sections, selectedItem, selectedSectionId, selectedItemId }
         selectedItemId={selectedItemId}
       />
     </div>
-    <div className="content col-xs-12 col-sm-9 col-md-9 col-lg-9">
+    <div className="content col-xs-12 col-sm-12 col-md-9 col-lg-9">
       <div className="nav-dropdown">
         <NavDropdown
           sections={sections}
@@ -32,6 +57,8 @@ const Container = ({ sections, selectedItem, selectedSectionId, selectedItemId }
         />
       </div>
 
+      <Search />
+
       <Content
         title={selectedItem.title}
         content={selectedItem.content}
diff --git a/docs/src/components/Docs/Container/style.css b/docs/src/components/Docs/Container/style.css
index 23604750df9..08d148f39a5 100644
--- a/docs/src/components/Docs/Container/style.css
+++ b/docs/src/components/Docs/Container/style.css
@@ -43,10 +43,6 @@
 }
 
 @media only screen and (max-width: 998px) {
-  #docs-container .nav {
-    display: none;
-  }
-
   #docs-container .content {
     border-left: none;
     margin: 15px 0;
@@ -57,3 +53,12 @@
     display: block;
   }
 }
+
+.search {
+  @media only screen and (min-width: 998px) {
+    position: absolute;
+    top: 10px;
+    right: 0;
+    width: 400px;
+  }
+}
\ No newline at end of file
diff --git a/docs/src/components/Docs/Nav/dropdown.js b/docs/src/components/Docs/Nav/dropdown.js
index a08d075c93c..12b093b7203 100644
--- a/docs/src/components/Docs/Nav/dropdown.js
+++ b/docs/src/components/Docs/Nav/dropdown.js
@@ -58,13 +58,21 @@ class Nav extends React.Component {
     ) : (
       <div>
         <div>
-          <select value={selectedSectionId} onChange={event => this.handleHeadingChange(event)}>
+          <select
+            className="custom-select custom-select-sm"
+            value={selectedSectionId}
+            onChange={event => this.handleHeadingChange(event)}
+          >
             {sections.map(section => this.renderHeadingOpts(section))}
           </select>
         </div>
 
         <div>
-          <select value={selectedItemId} onChange={event => this.handleNavChange(event)}>
+          <select
+            className="custom-select custom-select-sm"
+            value={selectedItemId}
+            onChange={event => this.handleNavChange(event)}
+          >
             {navs.map(nav => this.renderNavOpts(nav))}
           </select>
         </div>
diff --git a/docs/src/new-components/layout/Header.js b/docs/src/new-components/layout/Header.js
index ec408ca3830..b922fdfebb2 100644
--- a/docs/src/new-components/layout/Header.js
+++ b/docs/src/new-components/layout/Header.js
@@ -126,6 +126,7 @@ const Nav = styled.div`
   position: relative;
   text-align: center;
   z-index: 3;
+  display: flex;
 `;
 
 const NavWrapper = styled.nav`

From d340a4abeb558b48444c6eb98d5e6af6688c65ee Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Thu, 7 Mar 2019 11:43:21 +0800
Subject: [PATCH 181/249] Fix linting error?

---
 docs/src/components/Header/index.js | 12 +++++-------
 1 file changed, 5 insertions(+), 7 deletions(-)

diff --git a/docs/src/components/Header/index.js b/docs/src/components/Header/index.js
index 4b630f98352..09e048ba1f4 100644
--- a/docs/src/components/Header/index.js
+++ b/docs/src/components/Header/index.js
@@ -44,13 +44,11 @@ Link.propTypes = {
 
 class Header extends React.Component {
   renderSections() {
-    return sections.map(section => {
-      return (
-        <Link className="selected" key={section.id} to={section.href}>
-          {section.caption}
-        </Link>
-      );
-    });
+    return sections.map(section => (
+      <Link className="selected" key={section.id} to={section.href}>
+        {section.caption}
+      </Link>
+    ));
   }
 
   render() {

From 0b7ce6ddb1a6cc9ebfcafeb95e7d64ee2efe4358 Mon Sep 17 00:00:00 2001
From: "dependabot[bot]" <support@dependabot.com>
Date: Thu, 7 Mar 2019 05:19:56 +0000
Subject: [PATCH 182/249] Bump babel-preset-react-app from 7.0.1 to 7.0.2

Bumps [babel-preset-react-app](https://github.com/facebook/create-react-app) from 7.0.1 to 7.0.2.
- [Release notes](https://github.com/facebook/create-react-app/releases)
- [Changelog](https://github.com/facebook/create-react-app/blob/master/CHANGELOG-1.x.md)
- [Commits](https://github.com/facebook/create-react-app/compare/babel-preset-react-app@7.0.1...babel-preset-react-app@7.0.2)

Signed-off-by: dependabot[bot] <support@dependabot.com>
---
 app/react/package.json |  2 +-
 yarn.lock              | 10 ++++++----
 2 files changed, 7 insertions(+), 5 deletions(-)

diff --git a/app/react/package.json b/app/react/package.json
index 514c1f5bbc4..953fbcc5eb3 100644
--- a/app/react/package.json
+++ b/app/react/package.json
@@ -34,7 +34,7 @@
     "@svgr/webpack": "^4.0.3",
     "babel-plugin-named-asset-import": "^0.3.1",
     "babel-plugin-react-docgen": "^2.0.2",
-    "babel-preset-react-app": "^7.0.1",
+    "babel-preset-react-app": "^7.0.2",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
diff --git a/yarn.lock b/yarn.lock
index d219608bd19..82dc797ba6b 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -4699,10 +4699,10 @@ babel-preset-jest@^24.1.0:
     babel-plugin-transform-undefined-to-void "^6.9.4"
     lodash.isplainobject "^4.0.6"
 
-babel-preset-react-app@^7.0.1:
-  version "7.0.1"
-  resolved "https://registry.yarnpkg.com/babel-preset-react-app/-/babel-preset-react-app-7.0.1.tgz#8dd7fef73fba124a6e140d245185ca657a943313"
-  integrity sha512-cic2V+GftWwt82XNMKGxvkFAVvuaBISy0/mzNLLPlALXXJxUvxJgVy2DI8HVk311oewJsmBiu/unE4wINUCvkg==
+babel-preset-react-app@^7.0.1, babel-preset-react-app@^7.0.2:
+  version "7.0.2"
+  resolved "https://registry.yarnpkg.com/babel-preset-react-app/-/babel-preset-react-app-7.0.2.tgz#d01ae973edc93b9f1015cb0236dd55889a584308"
+  integrity sha512-mwCk/u2wuiO8qQqblN5PlDa44taY0acq7hw6W+a70W522P7a9mIcdggL1fe5/LgAT7tqCq46q9wwhqaMoYKslQ==
   dependencies:
     "@babel/core" "7.2.2"
     "@babel/plugin-proposal-class-properties" "7.3.0"
@@ -11139,6 +11139,7 @@ graphql-request@^1.5.0:
 graphql@^0.13.2, graphql@^14.1.1:
   version "0.13.2"
   resolved "https://registry.yarnpkg.com/graphql/-/graphql-0.13.2.tgz#4c740ae3c222823e7004096f832e7b93b2108270"
+  integrity sha512-QZ5BL8ZO/B20VA8APauGBg3GyEgZ19eduvpLWoq5x7gMmWnHoy8rlQWPLmWgFvo1yNgjSEFMesmS4R6pPr7xog==
   dependencies:
     iterall "^1.2.1"
 
@@ -12822,6 +12823,7 @@ istextorbinary@2.1.0:
 iterall@^1.2.1:
   version "1.2.2"
   resolved "https://registry.yarnpkg.com/iterall/-/iterall-1.2.2.tgz#92d70deb8028e0c39ff3164fdbf4d8b088130cd7"
+  integrity sha512-yynBb1g+RFUPY64fTrFv7nsjRrENBQJaX2UL+2Szc9REFrSNm1rpSXHGzhmAy7a9uv3vlvgBlXnf9RqmPH1/DA==
 
 jasmine-core@~2.8.0:
   version "2.8.0"

From e999b9ef50a40632c7013dbb25de5f9fa223bc3a Mon Sep 17 00:00:00 2001
From: "dependabot[bot]" <support@dependabot.com>
Date: Thu, 7 Mar 2019 05:20:30 +0000
Subject: [PATCH 183/249] Bump ts-node from 8.0.2 to 8.0.3

Bumps [ts-node](https://github.com/TypeStrong/ts-node) from 8.0.2 to 8.0.3.
- [Release notes](https://github.com/TypeStrong/ts-node/releases)
- [Commits](https://github.com/TypeStrong/ts-node/compare/v8.0.2...v8.0.3)

Signed-off-by: dependabot[bot] <support@dependabot.com>
---
 examples/angular-cli/package.json |  2 +-
 yarn.lock                         | 10 ++++++----
 2 files changed, 7 insertions(+), 5 deletions(-)

diff --git a/examples/angular-cli/package.json b/examples/angular-cli/package.json
index 772c9b80ef5..298e86fe7e7 100644
--- a/examples/angular-cli/package.json
+++ b/examples/angular-cli/package.json
@@ -56,7 +56,7 @@
     "jest": "^23.6.0",
     "jest-preset-angular": "^6.0.1",
     "protractor": "~5.4.2",
-    "ts-node": "~8.0.2",
+    "ts-node": "~8.0.3",
     "typescript": "^3.3.3333"
   }
 }
diff --git a/yarn.lock b/yarn.lock
index d219608bd19..2d4177e1cda 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -11139,6 +11139,7 @@ graphql-request@^1.5.0:
 graphql@^0.13.2, graphql@^14.1.1:
   version "0.13.2"
   resolved "https://registry.yarnpkg.com/graphql/-/graphql-0.13.2.tgz#4c740ae3c222823e7004096f832e7b93b2108270"
+  integrity sha512-QZ5BL8ZO/B20VA8APauGBg3GyEgZ19eduvpLWoq5x7gMmWnHoy8rlQWPLmWgFvo1yNgjSEFMesmS4R6pPr7xog==
   dependencies:
     iterall "^1.2.1"
 
@@ -12822,6 +12823,7 @@ istextorbinary@2.1.0:
 iterall@^1.2.1:
   version "1.2.2"
   resolved "https://registry.yarnpkg.com/iterall/-/iterall-1.2.2.tgz#92d70deb8028e0c39ff3164fdbf4d8b088130cd7"
+  integrity sha512-yynBb1g+RFUPY64fTrFv7nsjRrENBQJaX2UL+2Szc9REFrSNm1rpSXHGzhmAy7a9uv3vlvgBlXnf9RqmPH1/DA==
 
 jasmine-core@~2.8.0:
   version "2.8.0"
@@ -22587,10 +22589,10 @@ ts-loader@^5.3.3:
     micromatch "^3.1.4"
     semver "^5.0.1"
 
-ts-node@~8.0.2:
-  version "8.0.2"
-  resolved "https://registry.yarnpkg.com/ts-node/-/ts-node-8.0.2.tgz#9ecdf8d782a0ca4c80d1d641cbb236af4ac1b756"
-  integrity sha512-MosTrinKmaAcWgO8tqMjMJB22h+sp3Rd1i4fdoWY4mhBDekOwIAKI/bzmRi7IcbCmjquccYg2gcF6NBkLgr0Tw==
+ts-node@~8.0.3:
+  version "8.0.3"
+  resolved "https://registry.yarnpkg.com/ts-node/-/ts-node-8.0.3.tgz#aa60b836a24dafd8bf21b54766841a232fdbc641"
+  integrity sha512-2qayBA4vdtVRuDo11DEFSsD/SFsBXQBRZZhbRGSIkmYmVkWjULn/GGMdG10KVqkaGndljfaTD8dKjWgcejO8YA==
   dependencies:
     arg "^4.1.0"
     diff "^3.1.0"

From 8aa71c5382d47dac06d101344efacc9d3234a8fa Mon Sep 17 00:00:00 2001
From: codebyalex <wilsonc.alexander@gmail.com>
Date: Thu, 7 Mar 2019 00:37:57 -0500
Subject: [PATCH 184/249] modified debounce logic to use lodash rather than
 custom timeout code

---
 addons/knobs/package.json         |  1 +
 addons/knobs/src/registerKnobs.js | 31 ++++++++++++++++---------------
 2 files changed, 17 insertions(+), 15 deletions(-)

diff --git a/addons/knobs/package.json b/addons/knobs/package.json
index 15f727d14c5..9afc41f926c 100644
--- a/addons/knobs/package.json
+++ b/addons/knobs/package.json
@@ -31,6 +31,7 @@
     "escape-html": "^1.0.3",
     "fast-deep-equal": "^2.0.1",
     "global": "^4.3.2",
+    "lodash.debounce": "^4.0.8",
     "prop-types": "^15.6.2",
     "qs": "^6.5.2",
     "react-color": "^2.17.0",
diff --git a/addons/knobs/src/registerKnobs.js b/addons/knobs/src/registerKnobs.js
index 9e14eb46ac3..67d2208d374 100644
--- a/addons/knobs/src/registerKnobs.js
+++ b/addons/knobs/src/registerKnobs.js
@@ -1,13 +1,13 @@
 import addons from '@storybook/addons';
 import { STORY_CHANGED, FORCE_RE_RENDER, REGISTER_SUBSCRIPTION } from '@storybook/core-events';
 
+import debounce from 'lodash.debounce';
 import KnobManager from './KnobManager';
 import { CHANGE, CLICK, RESET, SET } from './shared';
 
 export const manager = new KnobManager();
 const { knobStore } = manager;
-const KNOB_CHANGED_DEBOUNCE_DELAY_MS = 155; // approximate average time between keypresses
-let timeoutId = null;
+const KNOB_CHANGED_DEBOUNCE_DELAY_MS = 150;
 
 function forceReRender() {
   addons.getChannel().emit(FORCE_RE_RENDER);
@@ -18,20 +18,21 @@ function setPaneKnobs(timestamp = +new Date()) {
   channel.emit(SET, { knobs: knobStore.getAll(), timestamp });
 }
 
+// Increased performance by reducing the number of times a component is rendered during knob changes
+const debouncedOnKnobChanged = debounce(change => {
+  const { name, value } = change;
+
+  // Update the related knob and it's value.
+  const knobOptions = knobStore.get(name);
+
+  knobOptions.value = value;
+  knobStore.markAllUnused();
+
+  forceReRender();
+}, KNOB_CHANGED_DEBOUNCE_DELAY_MS);
+
 function knobChanged(change) {
-  clearTimeout(timeoutId);
-  timeoutId = setTimeout(() => {
-    // debouncing occurs here to increase performance
-    const { name, value } = change;
-
-    // Update the related knob and it's value.
-    const knobOptions = knobStore.get(name);
-
-    knobOptions.value = value;
-    knobStore.markAllUnused();
-
-    forceReRender();
-  }, KNOB_CHANGED_DEBOUNCE_DELAY_MS); // amount of time used to ensure that the user has time to type before re-rendering
+  debouncedOnKnobChanged(change);
 }
 
 function knobClicked(clicked) {

From e4cf45cce874ed05026e023411c794797888a0c4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ga=C3=ABtan=20Maisse?= <gmaisse@leadformance.com>
Date: Tue, 19 Feb 2019 20:53:38 +0100
Subject: [PATCH 185/249] chore: add tsconfig in addons/a11y

---
 addons/a11y/tsconfig.json | 13 +++++++++++++
 1 file changed, 13 insertions(+)
 create mode 100644 addons/a11y/tsconfig.json

diff --git a/addons/a11y/tsconfig.json b/addons/a11y/tsconfig.json
new file mode 100644
index 00000000000..8876bb6737a
--- /dev/null
+++ b/addons/a11y/tsconfig.json
@@ -0,0 +1,13 @@
+{
+  "extends": "../../tsconfig.json",
+  "compilerOptions": {
+    "rootDir": "./src",
+    "types": ["webpack-env"]
+  },
+  "include": [
+    "src/**/*"
+  ],
+  "exclude": [
+    "src/__tests__/**/*"
+  ]
+}

From 76029c9400cba6c53da8bb1eb9d5249f731fb487 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ga=C3=ABtan=20Maisse?= <gmaisse@leadformance.com>
Date: Tue, 19 Feb 2019 21:36:00 +0100
Subject: [PATCH 186/249] chore: migrate src of addons/a11y to Typescript

---
 addons/a11y/package.json                      |  5 +++-
 .../{ColorBlindness.js => ColorBlindness.tsx} |  8 +++---
 .../src/components/{Panel.js => Panel.tsx}    | 12 ++++----
 .../Report/{Elements.js => Elements.tsx}      |  6 ++--
 .../components/Report/{Info.js => Info.tsx}   |  2 +-
 .../components/Report/{Item.js => Item.tsx}   |  6 ++--
 .../components/Report/{Rules.js => Rules.tsx} | 12 ++++----
 .../components/Report/{Tags.js => Tags.tsx}   |  4 +--
 .../components/Report/{index.js => index.tsx} |  4 +--
 .../a11y/src/components/{Tabs.js => Tabs.tsx} | 12 ++++----
 .../a11y/src/{constants.js => constants.ts}   |  0
 addons/a11y/src/{index.js => index.ts}        | 28 +++++++++++--------
 addons/a11y/src/{register.js => register.tsx} |  8 +++---
 addons/a11y/src/typings.d.ts                  |  3 ++
 14 files changed, 60 insertions(+), 50 deletions(-)
 rename addons/a11y/src/components/{ColorBlindness.js => ColorBlindness.tsx} (93%)
 rename addons/a11y/src/components/{Panel.js => Panel.tsx} (94%)
 rename addons/a11y/src/components/Report/{Elements.js => Elements.tsx} (89%)
 rename addons/a11y/src/components/Report/{Info.js => Info.tsx} (95%)
 rename addons/a11y/src/components/Report/{Item.js => Item.tsx} (93%)
 rename addons/a11y/src/components/Report/{Rules.js => Rules.tsx} (84%)
 rename addons/a11y/src/components/Report/{Tags.js => Tags.tsx} (89%)
 rename addons/a11y/src/components/Report/{index.js => index.tsx} (81%)
 rename addons/a11y/src/components/{Tabs.js => Tabs.tsx} (89%)
 rename addons/a11y/src/{constants.js => constants.ts} (100%)
 rename addons/a11y/src/{index.js => index.ts} (72%)
 rename addons/a11y/src/{register.js => register.tsx} (96%)
 create mode 100644 addons/a11y/src/typings.d.ts

diff --git a/addons/a11y/package.json b/addons/a11y/package.json
index 281923dcf15..7743d15931d 100644
--- a/addons/a11y/package.json
+++ b/addons/a11y/package.json
@@ -21,7 +21,7 @@
   },
   "license": "MIT",
   "main": "dist/index.js",
-  "jsnext:main": "src/index.js",
+  "types": "dist/index.d.ts",
   "scripts": {
     "prepare": "node ../../scripts/prepare.js"
   },
@@ -40,6 +40,9 @@
     "react": "^16.8.3",
     "util-deprecate": "^1.0.2"
   },
+  "devDependencies": {
+    "@types/common-tags": "^1.8.0"
+  },
   "publishConfig": {
     "access": "public"
   }
diff --git a/addons/a11y/src/components/ColorBlindness.js b/addons/a11y/src/components/ColorBlindness.tsx
similarity index 93%
rename from addons/a11y/src/components/ColorBlindness.js
rename to addons/a11y/src/components/ColorBlindness.tsx
index 375b9a723d4..63fafd1e383 100644
--- a/addons/a11y/src/components/ColorBlindness.js
+++ b/addons/a11y/src/components/ColorBlindness.tsx
@@ -16,7 +16,7 @@ const ColorIcon = styled.span(
     height: '1rem',
     width: '1rem',
   },
-  ({ filter }) => ({
+  ({ filter }: any) => ({
     filter: filter === 'mono' ? 'grayscale(100%)' : `url('#${filter}')`,
   }),
   ({ theme }) => ({
@@ -30,7 +30,7 @@ class ColorBlindness extends Component {
     filter: null,
   };
 
-  setFilter = filter => {
+  setFilter = (filter: any) => {
     const iframe = getIframe();
 
     if (iframe) {
@@ -73,7 +73,7 @@ class ColorBlindness extends Component {
           onClick: () => {
             this.setFilter(null);
           },
-        },
+        } as any,
         ...colorList,
       ];
     }
@@ -83,7 +83,7 @@ class ColorBlindness extends Component {
         placement="top"
         trigger="click"
         tooltipShown={expanded}
-        onVisibilityChange={s => this.setState({ expanded: s })}
+        onVisibilityChange={(s: any) => this.setState({ expanded: s })}
         tooltip={<TooltipLinkList links={colorList} />}
         closeOnClick
       >
diff --git a/addons/a11y/src/components/Panel.js b/addons/a11y/src/components/Panel.tsx
similarity index 94%
rename from addons/a11y/src/components/Panel.js
rename to addons/a11y/src/components/Panel.tsx
index 2898eb45def..ba0eef9def2 100644
--- a/addons/a11y/src/components/Panel.js
+++ b/addons/a11y/src/components/Panel.tsx
@@ -18,7 +18,7 @@ const Icon = styled(Icons)(
     width: '12px',
     marginRight: '4px',
   },
-  ({ status, theme }) =>
+  ({ status, theme }: any) =>
     status === 'running'
       ? {
           animation: `${theme.animation.rotate360} 1s linear infinite;`,
@@ -34,7 +34,7 @@ const Violations = styled.span(({ theme }) => ({
   color: theme.color.negative,
 }));
 
-class A11YPanel extends Component {
+class A11YPanel extends Component<any, any> {
   static propTypes = {
     active: PropTypes.bool.isRequired,
     api: PropTypes.shape({
@@ -46,8 +46,8 @@ class A11YPanel extends Component {
 
   state = {
     status: 'ready',
-    passes: [],
-    violations: [],
+    passes: [] as any[],
+    violations: [] as any[],
   };
 
   componentDidMount() {
@@ -57,7 +57,7 @@ class A11YPanel extends Component {
     api.on(EVENTS.RESULT, this.onUpdate);
   }
 
-  componentDidUpdate(prevProps) {
+  componentDidUpdate(prevProps: any) {
     // TODO: might be able to remove this
     const { active } = this.props;
 
@@ -73,7 +73,7 @@ class A11YPanel extends Component {
     api.off(EVENTS.RESULT, this.onUpdate);
   }
 
-  onUpdate = ({ passes, violations }) => {
+  onUpdate = ({ passes, violations }: any) => {
     this.setState(
       {
         status: 'ran',
diff --git a/addons/a11y/src/components/Report/Elements.js b/addons/a11y/src/components/Report/Elements.tsx
similarity index 89%
rename from addons/a11y/src/components/Report/Elements.js
rename to addons/a11y/src/components/Report/Elements.tsx
index c8ba249e775..850906bbc99 100644
--- a/addons/a11y/src/components/Report/Elements.js
+++ b/addons/a11y/src/components/Report/Elements.tsx
@@ -16,7 +16,7 @@ const ItemTitle = styled.span({
   marginBottom: '4px',
 });
 
-function Element({ element, passes }) {
+function Element({ element, passes }: any) {
   const { any, all, none } = element;
 
   const rules = [...any, ...all, ...none];
@@ -38,9 +38,9 @@ Element.propTypes = {
 };
 
 /* eslint-disable react/no-array-index-key */
-const Elements = ({ elements, passes }) => (
+const Elements = ({ elements, passes }: any) => (
   <ol>
-    {elements.map((element, index) => (
+    {elements.map((element: any, index: any) => (
       <Element passes={passes} element={element} key={index} />
     ))}
   </ol>
diff --git a/addons/a11y/src/components/Report/Info.js b/addons/a11y/src/components/Report/Info.tsx
similarity index 95%
rename from addons/a11y/src/components/Report/Info.js
rename to addons/a11y/src/components/Report/Info.tsx
index 56054a38286..e6a6d6c6b80 100644
--- a/addons/a11y/src/components/Report/Info.js
+++ b/addons/a11y/src/components/Report/Info.tsx
@@ -18,7 +18,7 @@ const Link = styled.a({
   display: 'block',
 });
 
-function Info({ item }) {
+function Info({ item }: any) {
   return (
     <Wrapper>
       <Help>{item.help}</Help>
diff --git a/addons/a11y/src/components/Report/Item.js b/addons/a11y/src/components/Report/Item.tsx
similarity index 93%
rename from addons/a11y/src/components/Report/Item.js
rename to addons/a11y/src/components/Report/Item.tsx
index 69dbddaea69..a0e2efd606d 100644
--- a/addons/a11y/src/components/Report/Item.js
+++ b/addons/a11y/src/components/Report/Item.tsx
@@ -10,7 +10,7 @@ import Elements from './Elements';
 
 const Wrapper = styled.div();
 
-const Icon = styled(Icons)(({ theme }) => ({
+const Icon = styled<any, any>(Icons)(({ theme }) => ({
   height: 10,
   width: 10,
   color: theme.color.mediumdark,
@@ -37,7 +37,7 @@ const HeaderBar = styled.button(({ theme }) => ({
   },
 }));
 
-class Item extends Component {
+class Item extends Component<any, any> {
   static propTypes = {
     item: PropTypes.shape({
       description: PropTypes.string,
@@ -52,7 +52,7 @@ class Item extends Component {
   };
 
   onToggle = () =>
-    this.setState(prevState => ({
+    this.setState((prevState: any) => ({
       open: !prevState.open,
     }));
 
diff --git a/addons/a11y/src/components/Report/Rules.js b/addons/a11y/src/components/Report/Rules.tsx
similarity index 84%
rename from addons/a11y/src/components/Report/Rules.js
rename to addons/a11y/src/components/Report/Rules.tsx
index 10989e55564..224cd1c4492 100644
--- a/addons/a11y/src/components/Report/Rules.js
+++ b/addons/a11y/src/components/Report/Rules.tsx
@@ -17,7 +17,7 @@ const List = styled.div({
   flexDirection: 'column',
   padding: '4px',
   fontWeight: '400',
-});
+} as any);
 
 const Item = styled.div({
   display: 'flex',
@@ -29,7 +29,7 @@ const Message = styled.div({
   paddingLeft: '6px',
 });
 
-const Status = styled.div(({ passes, impact }) => ({
+const Status = styled.div(({ passes, impact }: any) => ({
   height: '16px',
   width: '16px',
   borderRadius: '8px',
@@ -39,10 +39,10 @@ const Status = styled.div(({ passes, impact }) => ({
   alignItems: 'center',
   textAlign: 'center',
   flex: '0 0 16px',
-  color: passes ? impactColors.success : impactColors[impact],
+  color: passes ? impactColors.success : (impactColors as any)[impact],
 }));
 
-const Rule = ({ rule, passes }) => (
+const Rule = ({ rule, passes }: any) => (
   <Item>
     <Status passes={passes || undefined} impact={rule.impact}>
       {passes ? <Icons icon="check" /> : <Icons icon="cross" />}
@@ -59,10 +59,10 @@ Rule.propTypes = {
 };
 
 /* eslint-disable react/no-array-index-key */
-function Rules({ rules, passes }) {
+function Rules({ rules, passes }: any) {
   return (
     <List>
-      {rules.map((rule, index) => (
+      {rules.map((rule: any, index: any) => (
         <Rule passes={passes} rule={rule} key={index} />
       ))}
     </List>
diff --git a/addons/a11y/src/components/Report/Tags.js b/addons/a11y/src/components/Report/Tags.tsx
similarity index 89%
rename from addons/a11y/src/components/Report/Tags.js
rename to addons/a11y/src/components/Report/Tags.tsx
index 0ef1d2b2e32..b910a644448 100644
--- a/addons/a11y/src/components/Report/Tags.js
+++ b/addons/a11y/src/components/Report/Tags.tsx
@@ -16,10 +16,10 @@ const Item = styled.div(({ theme }) => ({
   borderRadius: theme.appBorderRadius,
 }));
 
-function Tags({ tags }) {
+function Tags({ tags }: any) {
   return (
     <Wrapper>
-      {tags.map(tag => (
+      {tags.map((tag: any) => (
         <Item key={tag}>{tag}</Item>
       ))}
     </Wrapper>
diff --git a/addons/a11y/src/components/Report/index.js b/addons/a11y/src/components/Report/index.tsx
similarity index 81%
rename from addons/a11y/src/components/Report/index.js
rename to addons/a11y/src/components/Report/index.tsx
index 3a9bdb9fbe2..1eca0267e93 100644
--- a/addons/a11y/src/components/Report/index.js
+++ b/addons/a11y/src/components/Report/index.tsx
@@ -4,10 +4,10 @@ import { Placeholder } from '@storybook/components';
 
 import Item from './Item';
 
-const Report = ({ items, empty, passes }) => (
+const Report = ({ items, empty, passes }: any) => (
   <Fragment>
     {items.length ? (
-      items.map(item => <Item passes={passes} item={item} key={item.id} />)
+      items.map((item: any) => <Item passes={passes} item={item} key={item.id} />)
     ) : (
       <Placeholder key="placeholder">{empty}</Placeholder>
     )}
diff --git a/addons/a11y/src/components/Tabs.js b/addons/a11y/src/components/Tabs.tsx
similarity index 89%
rename from addons/a11y/src/components/Tabs.js
rename to addons/a11y/src/components/Tabs.tsx
index 43568a96ce2..49bf8c6549a 100644
--- a/addons/a11y/src/components/Tabs.js
+++ b/addons/a11y/src/components/Tabs.tsx
@@ -37,7 +37,7 @@ const Item = styled.button(
       borderBottom: `3px solid ${theme.color.secondary}`,
     },
   }),
-  ({ active, theme }) =>
+  ({ active, theme }: any) =>
     active
       ? {
           opacity: 1,
@@ -46,25 +46,25 @@ const Item = styled.button(
       : {}
 );
 
-class Tabs extends Component {
+class Tabs extends Component<any, any> {
   state = {
     active: 0,
   };
 
-  onToggle = index => {
+  onToggle = (index: any) => {
     this.setState({
       active: index,
     });
   };
 
   render() {
-    const { tabs } = this.props;
+    const { tabs } = this.props as any;
     const { active } = this.state;
 
     return (
       <Container>
         <List>
-          {tabs.map((tab, index) => (
+          {tabs.map((tab: any, index: any) => (
             <Item
               // eslint-disable-next-line react/no-array-index-key
               key={index}
@@ -81,7 +81,7 @@ class Tabs extends Component {
   }
 }
 
-Tabs.propTypes = {
+(Tabs as any).propTypes = {
   tabs: PropTypes.arrayOf(
     PropTypes.shape({
       label: PropTypes.node,
diff --git a/addons/a11y/src/constants.js b/addons/a11y/src/constants.ts
similarity index 100%
rename from addons/a11y/src/constants.js
rename to addons/a11y/src/constants.ts
diff --git a/addons/a11y/src/index.js b/addons/a11y/src/index.ts
similarity index 72%
rename from addons/a11y/src/index.js
rename to addons/a11y/src/index.ts
index 13428ae784d..2e7161bdf20 100644
--- a/addons/a11y/src/index.js
+++ b/addons/a11y/src/index.ts
@@ -1,15 +1,15 @@
 import { document } from 'global';
-import axe from 'axe-core';
+import axe, { RunOptions, Spec } from 'axe-core';
 import deprecate from 'util-deprecate';
 import { stripIndents } from 'common-tags';
 
-import addons from '@storybook/addons';
+import addons, { StoryGetter, StoryWrapper } from '@storybook/addons';
 import { STORY_RENDERED } from '@storybook/core-events';
 import EVENTS, { PARAM_KEY } from './constants';
 
 const channel = addons.getChannel();
 let progress = Promise.resolve();
-let setup = {};
+let setup: any = {};
 
 const getElement = () => {
   const storyRoot = document.getElementById('story-root');
@@ -20,11 +20,11 @@ const getElement = () => {
   return document.getElementById('root');
 };
 
-const report = input => {
+const report = (input: any) => {
   channel.emit(EVENTS.RESULT, input);
 };
 
-const run = (config, options) => {
+const run = (config: Spec, options: RunOptions) => {
   progress = progress.then(() => {
     axe.reset();
     if (config) {
@@ -33,16 +33,18 @@ const run = (config, options) => {
     return axe
       .run(
         getElement(),
-        options || {
-          restoreScroll: true,
-        }
+        options ||
+          // tslint:disable-next-line:no-object-literal-type-assertion
+          ({
+            restoreScroll: true,
+          } as RunOptions) // cast to RunOptions is necessary because axe types are not up to date
       )
       .then(report);
   });
 };
 
 // NOTE: we should add paramaters to the STORY_RENDERED event and deprecate this
-export const withA11y = (getStory, context) => {
+export const withA11y: StoryWrapper = (getStory, context) => {
   const params = context.parameters[PARAM_KEY];
   if (params) {
     setup = params;
@@ -59,19 +61,21 @@ if (module && module.hot && module.hot.decline) {
 
 // TODO: REMOVE at v6.0.0
 export const withA11Y = deprecate(
-  (...args) => withA11y(...args),
+  // @ts-ignore
+  (...args: any[]) => withA11y(...args),
   'withA11Y has been renamed withA11y'
 );
 
 // TODO: REMOVE at v6.0.0
 export const checkA11y = deprecate(
-  (...args) => withA11y(...args),
+  // @ts-ignore
+  (...args: any[]) => withA11y(...args),
   'checkA11y has been renamed withA11y'
 );
 
 // TODO: REMOVE at v6.0.0
 export const configureA11y = deprecate(
-  config => {
+  (config: any) => {
     setup = config;
   },
   stripIndents`
diff --git a/addons/a11y/src/register.js b/addons/a11y/src/register.tsx
similarity index 96%
rename from addons/a11y/src/register.js
rename to addons/a11y/src/register.tsx
index 5e48441705f..64f0cd10f61 100644
--- a/addons/a11y/src/register.js
+++ b/addons/a11y/src/register.tsx
@@ -11,7 +11,7 @@ const Hidden = styled.div(() => ({
   display: 'none',
 }));
 
-const PreviewWrapper = p => (
+const PreviewWrapper = (p: any) => (
   <Fragment>
     {p.children}
     <Hidden>
@@ -82,9 +82,9 @@ const PreviewWrapper = p => (
 addons.register(ADDON_ID, api => {
   addons.add(PANEL_ID, {
     type: types.TOOL,
-    match: ({ viewMode }) => viewMode === 'story',
+    match: ({ viewMode }: any) => viewMode === 'story',
     render: () => <ColorBlindness />,
-  });
+  } as any);
 
   addons.add(PANEL_ID, {
     type: types.PANEL,
@@ -96,5 +96,5 @@ addons.register(ADDON_ID, api => {
   addons.add(PANEL_ID, {
     type: types.PREVIEW,
     render: PreviewWrapper,
-  });
+  } as any);
 });
diff --git a/addons/a11y/src/typings.d.ts b/addons/a11y/src/typings.d.ts
new file mode 100644
index 00000000000..1cebcd2c971
--- /dev/null
+++ b/addons/a11y/src/typings.d.ts
@@ -0,0 +1,3 @@
+// TODO: following packages need definition files or a TS migration
+declare module '@storybook/components';
+declare module 'global';

From d7ad26e90e528d5a3d238d56eb3781292d6f7c51 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ga=C3=ABtan=20Maisse?= <gmaisse@leadformance.com>
Date: Sun, 24 Feb 2019 17:37:16 +0100
Subject: [PATCH 187/249] chore: type src of addons/a11y

---
 addons/a11y/src/components/ColorBlindness.tsx | 22 +++++++---
 addons/a11y/src/components/Panel.tsx          | 36 ++++++++++-------
 .../a11y/src/components/Report/Elements.tsx   | 40 +++++++------------
 addons/a11y/src/components/Report/Info.tsx    | 17 ++++----
 addons/a11y/src/components/Report/Item.tsx    | 22 +++++-----
 addons/a11y/src/components/Report/Rules.tsx   | 36 +++++++----------
 addons/a11y/src/components/Report/Tags.tsx    | 15 +++----
 addons/a11y/src/components/Report/index.tsx   | 26 +++++-------
 addons/a11y/src/components/Tabs.tsx           | 31 +++++++-------
 addons/a11y/src/index.ts                      |  8 ++--
 addons/a11y/src/register.tsx                  | 17 ++++----
 11 files changed, 132 insertions(+), 138 deletions(-)

diff --git a/addons/a11y/src/components/ColorBlindness.tsx b/addons/a11y/src/components/ColorBlindness.tsx
index 63fafd1e383..95d8859e417 100644
--- a/addons/a11y/src/components/ColorBlindness.tsx
+++ b/addons/a11y/src/components/ColorBlindness.tsx
@@ -16,7 +16,7 @@ const ColorIcon = styled.span(
     height: '1rem',
     width: '1rem',
   },
-  ({ filter }: any) => ({
+  ({ filter }: { filter: string | null }) => ({
     filter: filter === 'mono' ? 'grayscale(100%)' : `url('#${filter}')`,
   }),
   ({ theme }) => ({
@@ -24,13 +24,21 @@ const ColorIcon = styled.span(
   })
 );
 
-class ColorBlindness extends Component {
-  state = {
+// tslint:disable-next-line:no-empty-interface
+interface ColorBlindnessProps {}
+
+interface ColorBlindnessState {
+  expanded: boolean;
+  filter: string | null;
+}
+
+class ColorBlindness extends Component<ColorBlindnessProps, ColorBlindnessState> {
+  state: ColorBlindnessState = {
     expanded: false,
     filter: null,
   };
 
-  setFilter = (filter: any) => {
+  setFilter = (filter: string | null) => {
     const iframe = getIframe();
 
     if (iframe) {
@@ -69,11 +77,13 @@ class ColorBlindness extends Component {
     if (filter !== null) {
       colorList = [
         {
+          id: 'reset',
           title: 'Reset color filter',
           onClick: () => {
             this.setFilter(null);
           },
-        } as any,
+          right: undefined,
+        },
         ...colorList,
       ];
     }
@@ -83,7 +93,7 @@ class ColorBlindness extends Component {
         placement="top"
         trigger="click"
         tooltipShown={expanded}
-        onVisibilityChange={(s: any) => this.setState({ expanded: s })}
+        onVisibilityChange={(s: boolean) => this.setState({ expanded: s })}
         tooltip={<TooltipLinkList links={colorList} />}
         closeOnClick
       >
diff --git a/addons/a11y/src/components/Panel.tsx b/addons/a11y/src/components/Panel.tsx
index ba0eef9def2..4f0c1fb0fd8 100644
--- a/addons/a11y/src/components/Panel.tsx
+++ b/addons/a11y/src/components/Panel.tsx
@@ -1,5 +1,4 @@
 import React, { Component, Fragment } from 'react';
-import PropTypes from 'prop-types';
 
 import { styled } from '@storybook/theming';
 
@@ -11,6 +10,7 @@ import EVENTS from '../constants';
 
 import Tabs from './Tabs';
 import Report from './Report';
+import { AxeResults, Result } from 'axe-core';
 
 const Icon = styled(Icons)(
   {
@@ -34,20 +34,26 @@ const Violations = styled.span(({ theme }) => ({
   color: theme.color.negative,
 }));
 
-class A11YPanel extends Component<any, any> {
-  static propTypes = {
-    active: PropTypes.bool.isRequired,
-    api: PropTypes.shape({
-      on: PropTypes.func,
-      emit: PropTypes.func,
-      off: PropTypes.func,
-    }).isRequired,
-  };
+interface A11YPanelState {
+  status: string;
+  passes: Result[];
+  violations: Result[];
+}
 
-  state = {
+interface A11YPanelProps {
+  active: boolean;
+  api: {
+    on(event: string, callback: (data: any) => void): void;
+    off(event: string, callback: (data: any) => void): void;
+    emit(event: string): void;
+  };
+}
+
+class A11YPanel extends Component<A11YPanelProps, A11YPanelState> {
+  state: A11YPanelState = {
     status: 'ready',
-    passes: [] as any[],
-    violations: [] as any[],
+    passes: [],
+    violations: [],
   };
 
   componentDidMount() {
@@ -57,7 +63,7 @@ class A11YPanel extends Component<any, any> {
     api.on(EVENTS.RESULT, this.onUpdate);
   }
 
-  componentDidUpdate(prevProps: any) {
+  componentDidUpdate(prevProps: A11YPanelProps) {
     // TODO: might be able to remove this
     const { active } = this.props;
 
@@ -73,7 +79,7 @@ class A11YPanel extends Component<any, any> {
     api.off(EVENTS.RESULT, this.onUpdate);
   }
 
-  onUpdate = ({ passes, violations }: any) => {
+  onUpdate = ({ passes, violations }: AxeResults) => {
     this.setState(
       {
         status: 'ran',
diff --git a/addons/a11y/src/components/Report/Elements.tsx b/addons/a11y/src/components/Report/Elements.tsx
index 850906bbc99..3e43739c194 100644
--- a/addons/a11y/src/components/Report/Elements.tsx
+++ b/addons/a11y/src/components/Report/Elements.tsx
@@ -1,9 +1,9 @@
-import React from 'react';
-import PropTypes from 'prop-types';
+import React, { FunctionComponent } from 'react';
 
 import { styled } from '@storybook/theming';
 
 import Rules from './Rules';
+import { NodeResult } from 'axe-core';
 
 const Item = styled.li({
   fontWeight: 600,
@@ -16,7 +16,12 @@ const ItemTitle = styled.span({
   marginBottom: '4px',
 });
 
-function Element({ element, passes }: any) {
+interface ElementProps {
+  element: NodeResult;
+  passes: boolean;
+}
+
+const Element: FunctionComponent<ElementProps> = ({ element, passes }) => {
   const { any, all, none } = element;
 
   const rules = [...any, ...all, ...none];
@@ -27,34 +32,19 @@ function Element({ element, passes }: any) {
       <Rules rules={rules} passes={passes} />
     </Item>
   );
-}
-Element.propTypes = {
-  element: PropTypes.shape({
-    any: PropTypes.array.isRequired,
-    all: PropTypes.array.isRequired,
-    none: PropTypes.array.isRequired,
-  }).isRequired,
-  passes: PropTypes.bool.isRequired,
 };
 
-/* eslint-disable react/no-array-index-key */
-const Elements = ({ elements, passes }: any) => (
+interface ElementsProps {
+  elements: NodeResult[];
+  passes: boolean;
+}
+
+const Elements: FunctionComponent<ElementsProps> = ({ elements, passes }) => (
   <ol>
-    {elements.map((element: any, index: any) => (
+    {elements.map((element, index) => (
       <Element passes={passes} element={element} key={index} />
     ))}
   </ol>
 );
 
-Elements.propTypes = {
-  elements: PropTypes.arrayOf(
-    PropTypes.shape({
-      any: PropTypes.array.isRequired,
-      all: PropTypes.array.isRequired,
-      none: PropTypes.array.isRequired,
-    })
-  ).isRequired,
-  passes: PropTypes.bool.isRequired,
-};
-
 export default Elements;
diff --git a/addons/a11y/src/components/Report/Info.tsx b/addons/a11y/src/components/Report/Info.tsx
index e6a6d6c6b80..26ba2b126e5 100644
--- a/addons/a11y/src/components/Report/Info.tsx
+++ b/addons/a11y/src/components/Report/Info.tsx
@@ -1,7 +1,7 @@
-import React from 'react';
-import PropTypes from 'prop-types';
+import React, { FunctionComponent } from 'react';
 
 import { styled } from '@storybook/theming';
+import { Result } from 'axe-core';
 
 const Wrapper = styled.div(({ theme }) => ({
   backgroundColor: theme.background.bar,
@@ -18,7 +18,11 @@ const Link = styled.a({
   display: 'block',
 });
 
-function Info({ item }: any) {
+interface InfoProps {
+  item: Result;
+}
+
+const Info: FunctionComponent<InfoProps> = ({ item }) => {
   return (
     <Wrapper>
       <Help>{item.help}</Help>
@@ -27,13 +31,6 @@ function Info({ item }: any) {
       </Link>
     </Wrapper>
   );
-}
-
-Info.propTypes = {
-  item: PropTypes.shape({
-    help: PropTypes.node,
-    helpUrl: PropTypes.string,
-  }).isRequired,
 };
 
 export default Info;
diff --git a/addons/a11y/src/components/Report/Item.tsx b/addons/a11y/src/components/Report/Item.tsx
index a0e2efd606d..d132a6cfd7b 100644
--- a/addons/a11y/src/components/Report/Item.tsx
+++ b/addons/a11y/src/components/Report/Item.tsx
@@ -1,5 +1,4 @@
 import React, { Component, Fragment } from 'react';
-import PropTypes from 'prop-types';
 
 import { styled } from '@storybook/theming';
 import { Icons } from '@storybook/components';
@@ -7,6 +6,7 @@ import { Icons } from '@storybook/components';
 import Info from './Info';
 import Tags from './Tags';
 import Elements from './Elements';
+import { Result } from 'axe-core';
 
 const Wrapper = styled.div();
 
@@ -37,22 +37,22 @@ const HeaderBar = styled.button(({ theme }) => ({
   },
 }));
 
-class Item extends Component<any, any> {
-  static propTypes = {
-    item: PropTypes.shape({
-      description: PropTypes.string,
-      nodes: PropTypes.array,
-      tags: PropTypes.array,
-    }).isRequired,
-    passes: PropTypes.bool.isRequired,
-  };
+interface ItemProps {
+  item: Result;
+  passes: boolean;
+}
 
+interface ItemState {
+  open: boolean;
+}
+
+class Item extends Component<ItemProps, ItemState> {
   state = {
     open: false,
   };
 
   onToggle = () =>
-    this.setState((prevState: any) => ({
+    this.setState(prevState => ({
       open: !prevState.open,
     }));
 
diff --git a/addons/a11y/src/components/Report/Rules.tsx b/addons/a11y/src/components/Report/Rules.tsx
index 224cd1c4492..e443d52d6b8 100644
--- a/addons/a11y/src/components/Report/Rules.tsx
+++ b/addons/a11y/src/components/Report/Rules.tsx
@@ -1,8 +1,8 @@
-import React from 'react';
-import PropTypes from 'prop-types';
+import React, { FunctionComponent } from 'react';
 import { styled } from '@storybook/theming';
 
 import { Icons } from '@storybook/components';
+import { CheckResult } from 'axe-core';
 
 const impactColors = {
   minor: '#f1c40f',
@@ -29,7 +29,7 @@ const Message = styled.div({
   paddingLeft: '6px',
 });
 
-const Status = styled.div(({ passes, impact }: any) => ({
+const Status = styled.div(({ passes, impact }: { passes: boolean; impact: string }) => ({
   height: '16px',
   width: '16px',
   borderRadius: '8px',
@@ -42,7 +42,12 @@ const Status = styled.div(({ passes, impact }: any) => ({
   color: passes ? impactColors.success : (impactColors as any)[impact],
 }));
 
-const Rule = ({ rule, passes }: any) => (
+interface RuleProps {
+  rule: CheckResult;
+  passes: boolean;
+}
+
+const Rule: FunctionComponent<RuleProps> = ({ rule, passes }) => (
   <Item>
     <Status passes={passes || undefined} impact={rule.impact}>
       {passes ? <Icons icon="check" /> : <Icons icon="cross" />}
@@ -51,30 +56,19 @@ const Rule = ({ rule, passes }: any) => (
   </Item>
 );
 
-Rule.propTypes = {
-  rule: PropTypes.shape({
-    message: PropTypes.node,
-  }).isRequired,
-  passes: PropTypes.bool.isRequired,
-};
+interface RulesProps {
+  rules: CheckResult[];
+  passes: boolean;
+}
 
-/* eslint-disable react/no-array-index-key */
-function Rules({ rules, passes }: any) {
+const Rules: FunctionComponent<RulesProps> = ({ rules, passes }) => {
   return (
     <List>
-      {rules.map((rule: any, index: any) => (
+      {rules.map((rule, index) => (
         <Rule passes={passes} rule={rule} key={index} />
       ))}
     </List>
   );
-}
-Rules.propTypes = {
-  rules: PropTypes.arrayOf(
-    PropTypes.shape({
-      message: PropTypes.node,
-    })
-  ).isRequired,
-  passes: PropTypes.bool.isRequired,
 };
 
 export default Rules;
diff --git a/addons/a11y/src/components/Report/Tags.tsx b/addons/a11y/src/components/Report/Tags.tsx
index b910a644448..26ea062d2ee 100644
--- a/addons/a11y/src/components/Report/Tags.tsx
+++ b/addons/a11y/src/components/Report/Tags.tsx
@@ -1,7 +1,7 @@
-import React from 'react';
-import PropTypes from 'prop-types';
+import React, { FunctionComponent } from 'react';
 
 import { styled } from '@storybook/theming';
+import { TagValue } from 'axe-core';
 
 const Wrapper = styled.div({
   display: 'flex',
@@ -16,17 +16,18 @@ const Item = styled.div(({ theme }) => ({
   borderRadius: theme.appBorderRadius,
 }));
 
-function Tags({ tags }: any) {
+interface TagsProps {
+  tags: TagValue[];
+}
+
+const Tags: FunctionComponent<TagsProps> = ({ tags }) => {
   return (
     <Wrapper>
-      {tags.map((tag: any) => (
+      {tags.map(tag => (
         <Item key={tag}>{tag}</Item>
       ))}
     </Wrapper>
   );
-}
-Tags.propTypes = {
-  tags: PropTypes.arrayOf(PropTypes.node).isRequired,
 };
 
 export default Tags;
diff --git a/addons/a11y/src/components/Report/index.tsx b/addons/a11y/src/components/Report/index.tsx
index 1eca0267e93..c37b4a27cd3 100644
--- a/addons/a11y/src/components/Report/index.tsx
+++ b/addons/a11y/src/components/Report/index.tsx
@@ -1,29 +1,23 @@
-import React, { Fragment } from 'react';
-import PropTypes from 'prop-types';
+import React, { Fragment, FunctionComponent } from 'react';
 import { Placeholder } from '@storybook/components';
 
 import Item from './Item';
+import { Result } from 'axe-core';
 
-const Report = ({ items, empty, passes }: any) => (
+export interface ReportProps {
+  items: Result[];
+  empty: string;
+  passes: boolean;
+}
+
+const Report: FunctionComponent<ReportProps> = ({ items, empty, passes }) => (
   <Fragment>
     {items.length ? (
-      items.map((item: any) => <Item passes={passes} item={item} key={item.id} />)
+      items.map((item) => <Item passes={passes} item={item} key={item.id} />)
     ) : (
       <Placeholder key="placeholder">{empty}</Placeholder>
     )}
   </Fragment>
 );
 
-Report.propTypes = {
-  items: PropTypes.arrayOf(
-    PropTypes.shape({
-      description: PropTypes.string,
-      nodes: PropTypes.array,
-      tags: PropTypes.array,
-    })
-  ).isRequired,
-  empty: PropTypes.string.isRequired,
-  passes: PropTypes.bool.isRequired,
-};
-
 export default Report;
diff --git a/addons/a11y/src/components/Tabs.tsx b/addons/a11y/src/components/Tabs.tsx
index 49bf8c6549a..c442fe01592 100644
--- a/addons/a11y/src/components/Tabs.tsx
+++ b/addons/a11y/src/components/Tabs.tsx
@@ -1,5 +1,4 @@
 import React, { Component } from 'react';
-import PropTypes from 'prop-types';
 
 import { styled } from '@storybook/theming';
 // TODO: reuse the Tabs component from @storybook/theming instead
@@ -46,25 +45,36 @@ const Item = styled.button(
       : {}
 );
 
-class Tabs extends Component<any, any> {
-  state = {
+interface TabsProps {
+  tabs: Array<{
+    label: JSX.Element;
+    panel: JSX.Element;
+  }>;
+}
+
+interface TabsState {
+  active: number;
+}
+
+class Tabs extends Component<TabsProps, TabsState> {
+  state: TabsState = {
     active: 0,
   };
 
-  onToggle = (index: any) => {
+  onToggle = (index: number) => {
     this.setState({
       active: index,
     });
   };
 
   render() {
-    const { tabs } = this.props as any;
+    const { tabs } = this.props;
     const { active } = this.state;
 
     return (
       <Container>
         <List>
-          {tabs.map((tab: any, index: any) => (
+          {tabs.map((tab, index) => (
             <Item
               // eslint-disable-next-line react/no-array-index-key
               key={index}
@@ -81,13 +91,4 @@ class Tabs extends Component<any, any> {
   }
 }
 
-(Tabs as any).propTypes = {
-  tabs: PropTypes.arrayOf(
-    PropTypes.shape({
-      label: PropTypes.node,
-      panel: PropTypes.node,
-    })
-  ).isRequired,
-};
-
 export default Tabs;
diff --git a/addons/a11y/src/index.ts b/addons/a11y/src/index.ts
index 2e7161bdf20..43f4efcf1a6 100644
--- a/addons/a11y/src/index.ts
+++ b/addons/a11y/src/index.ts
@@ -1,15 +1,15 @@
 import { document } from 'global';
-import axe, { RunOptions, Spec } from 'axe-core';
+import axe, { AxeResults, RunOptions, Spec } from 'axe-core';
 import deprecate from 'util-deprecate';
 import { stripIndents } from 'common-tags';
 
-import addons, { StoryGetter, StoryWrapper } from '@storybook/addons';
+import addons, { StoryWrapper } from '@storybook/addons';
 import { STORY_RENDERED } from '@storybook/core-events';
 import EVENTS, { PARAM_KEY } from './constants';
 
 const channel = addons.getChannel();
 let progress = Promise.resolve();
-let setup: any = {};
+let setup: { config: Spec; options: RunOptions } = { config: {}, options: {} };
 
 const getElement = () => {
   const storyRoot = document.getElementById('story-root');
@@ -20,7 +20,7 @@ const getElement = () => {
   return document.getElementById('root');
 };
 
-const report = (input: any) => {
+const report = (input: AxeResults) => {
   channel.emit(EVENTS.RESULT, input);
 };
 
diff --git a/addons/a11y/src/register.tsx b/addons/a11y/src/register.tsx
index 64f0cd10f61..40e361e9765 100644
--- a/addons/a11y/src/register.tsx
+++ b/addons/a11y/src/register.tsx
@@ -1,4 +1,4 @@
-import React, { Fragment } from 'react';
+import React, { Fragment, FunctionComponent } from 'react';
 import addons, { types } from '@storybook/addons';
 import { styled } from '@storybook/theming';
 
@@ -11,7 +11,7 @@ const Hidden = styled.div(() => ({
   display: 'none',
 }));
 
-const PreviewWrapper = (p: any) => (
+const PreviewWrapper: FunctionComponent<{}> = p => (
   <Fragment>
     {p.children}
     <Hidden>
@@ -81,20 +81,21 @@ const PreviewWrapper = (p: any) => (
 
 addons.register(ADDON_ID, api => {
   addons.add(PANEL_ID, {
+    title: '',
     type: types.TOOL,
-    match: ({ viewMode }: any) => viewMode === 'story',
+    match: ({ viewMode }) => viewMode === 'story',
     render: () => <ColorBlindness />,
-  } as any);
+  });
 
   addons.add(PANEL_ID, {
-    type: types.PANEL,
     title: 'Accessibility',
-    // eslint-disable-next-line react/prop-types
+    type: types.PANEL,
     render: ({ active, key }) => <Panel key={key} api={api} active={active} />,
   });
 
   addons.add(PANEL_ID, {
+    title: '',
     type: types.PREVIEW,
-    render: PreviewWrapper,
-  } as any);
+    render: PreviewWrapper as any,
+  });
 });

From e913428796b88462fab3b2f737d1c14fe51e9269 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ga=C3=ABtan=20Maisse?= <gmaisse@leadformance.com>
Date: Sun, 24 Feb 2019 19:01:09 +0100
Subject: [PATCH 188/249] chore: remove prop-types dependency from package.json
 of addons/a11y

---
 addons/a11y/package.json | 1 -
 1 file changed, 1 deletion(-)

diff --git a/addons/a11y/package.json b/addons/a11y/package.json
index 7743d15931d..8762bc787e9 100644
--- a/addons/a11y/package.json
+++ b/addons/a11y/package.json
@@ -36,7 +36,6 @@
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
-    "prop-types": "^15.7.2",
     "react": "^16.8.3",
     "util-deprecate": "^1.0.2"
   },

From a22b88e0a239afbfb39094dfc33e612d65d1733f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ga=C3=ABtan=20Maisse?= <gmaisse@leadformance.com>
Date: Sun, 24 Feb 2019 19:19:02 +0100
Subject: [PATCH 189/249] chore: use named import/export instead of default
 ones in addons/a11y

---
 .../src/components/{Panel.tsx => A11YPanel.tsx}    | 14 +++++---------
 addons/a11y/src/components/ColorBlindness.tsx      |  4 +---
 addons/a11y/src/components/Report/Elements.tsx     |  6 ++----
 addons/a11y/src/components/Report/Info.tsx         |  4 +---
 addons/a11y/src/components/Report/Item.tsx         | 10 ++++------
 addons/a11y/src/components/Report/Rules.tsx        |  4 +---
 addons/a11y/src/components/Report/Tags.tsx         |  4 +---
 addons/a11y/src/components/Report/index.tsx        |  8 +++-----
 addons/a11y/src/components/Tabs.tsx                |  4 +---
 addons/a11y/src/constants.ts                       |  2 +-
 addons/a11y/src/index.ts                           |  2 +-
 addons/a11y/src/register.tsx                       |  9 ++++-----
 12 files changed, 25 insertions(+), 46 deletions(-)
 rename addons/a11y/src/components/{Panel.tsx => A11YPanel.tsx} (91%)

diff --git a/addons/a11y/src/components/Panel.tsx b/addons/a11y/src/components/A11YPanel.tsx
similarity index 91%
rename from addons/a11y/src/components/Panel.tsx
rename to addons/a11y/src/components/A11YPanel.tsx
index 4f0c1fb0fd8..482cceda591 100644
--- a/addons/a11y/src/components/Panel.tsx
+++ b/addons/a11y/src/components/A11YPanel.tsx
@@ -3,14 +3,12 @@ import React, { Component, Fragment } from 'react';
 import { styled } from '@storybook/theming';
 
 import { STORY_RENDERED } from '@storybook/core-events';
-import { ActionBar, Icons } from '@storybook/components';
+import { ActionBar, Icons, ScrollArea } from '@storybook/components';
 
-import { ScrollArea } from '@storybook/components/dist/ScrollArea/ScrollArea';
-import EVENTS from '../constants';
-
-import Tabs from './Tabs';
-import Report from './Report';
 import { AxeResults, Result } from 'axe-core';
+import { Report } from './Report';
+import { Tabs } from './Tabs';
+import { EVENTS } from '../constants';
 
 const Icon = styled(Icons)(
   {
@@ -49,7 +47,7 @@ interface A11YPanelProps {
   };
 }
 
-class A11YPanel extends Component<A11YPanelProps, A11YPanelState> {
+export class A11YPanel extends Component<A11YPanelProps, A11YPanelState> {
   state: A11YPanelState = {
     status: 'ready',
     passes: [],
@@ -159,5 +157,3 @@ class A11YPanel extends Component<A11YPanelProps, A11YPanelState> {
     ) : null;
   }
 }
-
-export default A11YPanel;
diff --git a/addons/a11y/src/components/ColorBlindness.tsx b/addons/a11y/src/components/ColorBlindness.tsx
index 95d8859e417..83818eae20d 100644
--- a/addons/a11y/src/components/ColorBlindness.tsx
+++ b/addons/a11y/src/components/ColorBlindness.tsx
@@ -32,7 +32,7 @@ interface ColorBlindnessState {
   filter: string | null;
 }
 
-class ColorBlindness extends Component<ColorBlindnessProps, ColorBlindnessState> {
+export class ColorBlindness extends Component<ColorBlindnessProps, ColorBlindnessState> {
   state: ColorBlindnessState = {
     expanded: false,
     filter: null,
@@ -104,5 +104,3 @@ class ColorBlindness extends Component<ColorBlindnessProps, ColorBlindnessState>
     );
   }
 }
-
-export default ColorBlindness;
diff --git a/addons/a11y/src/components/Report/Elements.tsx b/addons/a11y/src/components/Report/Elements.tsx
index 3e43739c194..cce537cba04 100644
--- a/addons/a11y/src/components/Report/Elements.tsx
+++ b/addons/a11y/src/components/Report/Elements.tsx
@@ -2,8 +2,8 @@ import React, { FunctionComponent } from 'react';
 
 import { styled } from '@storybook/theming';
 
-import Rules from './Rules';
 import { NodeResult } from 'axe-core';
+import { Rules } from './Rules';
 
 const Item = styled.li({
   fontWeight: 600,
@@ -39,12 +39,10 @@ interface ElementsProps {
   passes: boolean;
 }
 
-const Elements: FunctionComponent<ElementsProps> = ({ elements, passes }) => (
+export const Elements: FunctionComponent<ElementsProps> = ({ elements, passes }) => (
   <ol>
     {elements.map((element, index) => (
       <Element passes={passes} element={element} key={index} />
     ))}
   </ol>
 );
-
-export default Elements;
diff --git a/addons/a11y/src/components/Report/Info.tsx b/addons/a11y/src/components/Report/Info.tsx
index 26ba2b126e5..678eb57d262 100644
--- a/addons/a11y/src/components/Report/Info.tsx
+++ b/addons/a11y/src/components/Report/Info.tsx
@@ -22,7 +22,7 @@ interface InfoProps {
   item: Result;
 }
 
-const Info: FunctionComponent<InfoProps> = ({ item }) => {
+export const Info: FunctionComponent<InfoProps> = ({ item }) => {
   return (
     <Wrapper>
       <Help>{item.help}</Help>
@@ -32,5 +32,3 @@ const Info: FunctionComponent<InfoProps> = ({ item }) => {
     </Wrapper>
   );
 };
-
-export default Info;
diff --git a/addons/a11y/src/components/Report/Item.tsx b/addons/a11y/src/components/Report/Item.tsx
index d132a6cfd7b..6a493173a4d 100644
--- a/addons/a11y/src/components/Report/Item.tsx
+++ b/addons/a11y/src/components/Report/Item.tsx
@@ -3,10 +3,10 @@ import React, { Component, Fragment } from 'react';
 import { styled } from '@storybook/theming';
 import { Icons } from '@storybook/components';
 
-import Info from './Info';
-import Tags from './Tags';
-import Elements from './Elements';
 import { Result } from 'axe-core';
+import { Info } from './Info';
+import { Elements } from './Elements';
+import { Tags } from './Tags';
 
 const Wrapper = styled.div();
 
@@ -46,7 +46,7 @@ interface ItemState {
   open: boolean;
 }
 
-class Item extends Component<ItemProps, ItemState> {
+export class Item extends Component<ItemProps, ItemState> {
   state = {
     open: false,
   };
@@ -84,5 +84,3 @@ class Item extends Component<ItemProps, ItemState> {
     );
   }
 }
-
-export default Item;
diff --git a/addons/a11y/src/components/Report/Rules.tsx b/addons/a11y/src/components/Report/Rules.tsx
index e443d52d6b8..0a142eb98ee 100644
--- a/addons/a11y/src/components/Report/Rules.tsx
+++ b/addons/a11y/src/components/Report/Rules.tsx
@@ -61,7 +61,7 @@ interface RulesProps {
   passes: boolean;
 }
 
-const Rules: FunctionComponent<RulesProps> = ({ rules, passes }) => {
+export const Rules: FunctionComponent<RulesProps> = ({ rules, passes }) => {
   return (
     <List>
       {rules.map((rule, index) => (
@@ -70,5 +70,3 @@ const Rules: FunctionComponent<RulesProps> = ({ rules, passes }) => {
     </List>
   );
 };
-
-export default Rules;
diff --git a/addons/a11y/src/components/Report/Tags.tsx b/addons/a11y/src/components/Report/Tags.tsx
index 26ea062d2ee..559a31ee79f 100644
--- a/addons/a11y/src/components/Report/Tags.tsx
+++ b/addons/a11y/src/components/Report/Tags.tsx
@@ -20,7 +20,7 @@ interface TagsProps {
   tags: TagValue[];
 }
 
-const Tags: FunctionComponent<TagsProps> = ({ tags }) => {
+export const Tags: FunctionComponent<TagsProps> = ({ tags }) => {
   return (
     <Wrapper>
       {tags.map(tag => (
@@ -29,5 +29,3 @@ const Tags: FunctionComponent<TagsProps> = ({ tags }) => {
     </Wrapper>
   );
 };
-
-export default Tags;
diff --git a/addons/a11y/src/components/Report/index.tsx b/addons/a11y/src/components/Report/index.tsx
index c37b4a27cd3..2498962ccfd 100644
--- a/addons/a11y/src/components/Report/index.tsx
+++ b/addons/a11y/src/components/Report/index.tsx
@@ -1,8 +1,8 @@
 import React, { Fragment, FunctionComponent } from 'react';
 import { Placeholder } from '@storybook/components';
 
-import Item from './Item';
 import { Result } from 'axe-core';
+import { Item } from './Item';
 
 export interface ReportProps {
   items: Result[];
@@ -10,14 +10,12 @@ export interface ReportProps {
   passes: boolean;
 }
 
-const Report: FunctionComponent<ReportProps> = ({ items, empty, passes }) => (
+export const Report: FunctionComponent<ReportProps> = ({ items, empty, passes }) => (
   <Fragment>
     {items.length ? (
-      items.map((item) => <Item passes={passes} item={item} key={item.id} />)
+      items.map(item => <Item passes={passes} item={item} key={item.id} />)
     ) : (
       <Placeholder key="placeholder">{empty}</Placeholder>
     )}
   </Fragment>
 );
-
-export default Report;
diff --git a/addons/a11y/src/components/Tabs.tsx b/addons/a11y/src/components/Tabs.tsx
index c442fe01592..ca1aae61900 100644
--- a/addons/a11y/src/components/Tabs.tsx
+++ b/addons/a11y/src/components/Tabs.tsx
@@ -56,7 +56,7 @@ interface TabsState {
   active: number;
 }
 
-class Tabs extends Component<TabsProps, TabsState> {
+export class Tabs extends Component<TabsProps, TabsState> {
   state: TabsState = {
     active: 0,
   };
@@ -90,5 +90,3 @@ class Tabs extends Component<TabsProps, TabsState> {
     );
   }
 }
-
-export default Tabs;
diff --git a/addons/a11y/src/constants.ts b/addons/a11y/src/constants.ts
index 060abd6d2d3..a3563f5ed4b 100755
--- a/addons/a11y/src/constants.ts
+++ b/addons/a11y/src/constants.ts
@@ -5,4 +5,4 @@ export const PARAM_KEY = `a11y`;
 const RESULT = `${ADDON_ID}/result`;
 const REQUEST = `${ADDON_ID}/request`;
 
-export default { RESULT, REQUEST };
+export const EVENTS = { RESULT, REQUEST };
diff --git a/addons/a11y/src/index.ts b/addons/a11y/src/index.ts
index 43f4efcf1a6..5c834cdc900 100644
--- a/addons/a11y/src/index.ts
+++ b/addons/a11y/src/index.ts
@@ -5,7 +5,7 @@ import { stripIndents } from 'common-tags';
 
 import addons, { StoryWrapper } from '@storybook/addons';
 import { STORY_RENDERED } from '@storybook/core-events';
-import EVENTS, { PARAM_KEY } from './constants';
+import { EVENTS, PARAM_KEY } from './constants';
 
 const channel = addons.getChannel();
 let progress = Promise.resolve();
diff --git a/addons/a11y/src/register.tsx b/addons/a11y/src/register.tsx
index 40e361e9765..4b9c9d22ffe 100644
--- a/addons/a11y/src/register.tsx
+++ b/addons/a11y/src/register.tsx
@@ -1,11 +1,10 @@
 import React, { Fragment, FunctionComponent } from 'react';
-import addons, { types } from '@storybook/addons';
 import { styled } from '@storybook/theming';
 
-import Panel from './components/Panel';
-import ColorBlindness from './components/ColorBlindness';
-
 import { ADDON_ID, PANEL_ID } from './constants';
+import { ColorBlindness } from './components/ColorBlindness';
+import { A11YPanel } from './components/A11YPanel';
+import { addons, types } from '@storybook/addons';
 
 const Hidden = styled.div(() => ({
   display: 'none',
@@ -90,7 +89,7 @@ addons.register(ADDON_ID, api => {
   addons.add(PANEL_ID, {
     title: 'Accessibility',
     type: types.PANEL,
-    render: ({ active, key }) => <Panel key={key} api={api} active={active} />,
+    render: ({ active, key }) => <A11YPanel key={key} api={api} active={active} />,
   });
 
   addons.add(PANEL_ID, {

From f3a0ad6ff93d72081385a557c71673595668c49d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ga=C3=ABtan=20Maisse?= <gmaisse@leadformance.com>
Date: Tue, 26 Feb 2019 21:20:28 +0100
Subject: [PATCH 190/249] refactor: use a class property to prevent performance
 issue

See https://reactjs.org/docs/faq-functions.html#arrow-function-in-render
And https://reactjs.org/docs/faq-functions.html#class-properties-stage-3-proposal
---
 addons/a11y/src/components/ColorBlindness.tsx | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/addons/a11y/src/components/ColorBlindness.tsx b/addons/a11y/src/components/ColorBlindness.tsx
index 83818eae20d..1e037ffe591 100644
--- a/addons/a11y/src/components/ColorBlindness.tsx
+++ b/addons/a11y/src/components/ColorBlindness.tsx
@@ -52,6 +52,8 @@ export class ColorBlindness extends Component<ColorBlindnessProps, ColorBlindnes
     }
   };
 
+  onVisibilityChange = (s: boolean) => this.setState({ expanded: s });
+
   render() {
     const { filter, expanded } = this.state;
 
@@ -93,7 +95,7 @@ export class ColorBlindness extends Component<ColorBlindnessProps, ColorBlindnes
         placement="top"
         trigger="click"
         tooltipShown={expanded}
-        onVisibilityChange={(s: boolean) => this.setState({ expanded: s })}
+        onVisibilityChange={this.onVisibilityChange}
         tooltip={<TooltipLinkList links={colorList} />}
         closeOnClick
       >

From 1c013a36d741b53b86f57a8c9978385cd228a9c1 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ga=C3=ABtan=20Maisse?= <gmaisse@leadformance.com>
Date: Wed, 6 Mar 2019 17:40:33 +0100
Subject: [PATCH 191/249] fix: fix  a11y option attribute in
 examples/official-storybook

---
 examples/official-storybook/config.js                           | 2 +-
 .../tests/__snapshots__/storyshots.test.js.snap                 | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/examples/official-storybook/config.js b/examples/official-storybook/config.js
index a3e716b72f2..cd15c87b136 100644
--- a/examples/official-storybook/config.js
+++ b/examples/official-storybook/config.js
@@ -40,7 +40,7 @@ addDecorator(storyFn => (
 
 addParameters({
   a11y: {
-    configure: {},
+    config: {},
     options: {
       checks: { 'color-contrast': { options: { noScroll: true } } },
       restoreScroll: true,
diff --git a/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap b/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
index da4c2f46e45..86df522f604 100644
--- a/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
+++ b/examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
@@ -5196,7 +5196,7 @@ exports[`Storyshots Core|Parameters passed to story 1`] = `
 <pre>
   Parameters are {
   "a11y": {
-    "configure": {},
+    "config": {},
     "options": {
       "checks": {
         "color-contrast": {

From ab559724c5d1687bf7810e18daa831942b22cdff Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Thu, 7 Mar 2019 08:59:07 +0100
Subject: [PATCH 192/249] ADD back port to official example

---
 examples/official-storybook/package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/examples/official-storybook/package.json b/examples/official-storybook/package.json
index 270b36744bc..4ac2842a0cf 100644
--- a/examples/official-storybook/package.json
+++ b/examples/official-storybook/package.json
@@ -10,7 +10,7 @@
     "generate-addon-jest-testresults": "jest --config=tests/addon-jest.config.json --json --outputFile=stories/addon-jest.testresults.json",
     "graphql": "node ./graphql-server/index.js",
     "image-snapshots": "yarn run build-storybook && yarn run do-image-snapshots",
-    "storybook": "cross-env STORYBOOK_DISPLAY_WARNING=true DISPLAY_WARNING=true start-storybook -c ./ -s built-storybooks --no-dll"
+    "storybook": "cross-env STORYBOOK_DISPLAY_WARNING=true DISPLAY_WARNING=true start-storybook -p 9011 -c ./ -s built-storybooks --no-dll"
   },
   "devDependencies": {
     "@storybook/addon-a11y": "5.1.0-alpha.0",

From 5c9385b4c4c927214ff2a37180cc9fcbcf9d6ad2 Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Thu, 7 Mar 2019 10:56:20 +0100
Subject: [PATCH 193/249] ADD delay to rendering the acceptance stories

---
 examples/official-storybook/stories/app-acceptance.stories.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/examples/official-storybook/stories/app-acceptance.stories.js b/examples/official-storybook/stories/app-acceptance.stories.js
index 640c64ab16d..07b936acdcd 100644
--- a/examples/official-storybook/stories/app-acceptance.stories.js
+++ b/examples/official-storybook/stories/app-acceptance.stories.js
@@ -28,6 +28,7 @@ const style = {
   'preact-kitchen-sink',
 ].forEach(name => {
   chapter.add(name, () => <iframe style={style} title={name} src={`${name}/index.html`} />, {
+    chromatic: { delay: 2000 },
     notes: `You must build the storybook for the ${name} example for this story to work.`,
   });
 });

From de6fffc2444feb93e351046cfd5367ab4f7e5d68 Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Thu, 7 Mar 2019 11:10:17 +0100
Subject: [PATCH 194/249] DELETE snyk, is just slowing down, and it's our docs
 site, not something we publish

---
 docs/package.json | 8 ++------
 1 file changed, 2 insertions(+), 6 deletions(-)

diff --git a/docs/package.json b/docs/package.json
index 0744c348611..5e4c3c04b27 100644
--- a/docs/package.json
+++ b/docs/package.json
@@ -14,9 +14,7 @@
     "build-storybook": "build-storybook",
     "dev": "gatsby develop",
     "serve": "gatsby serve",
-    "storybook": "start-storybook -p 9009 -s src/pages",
-    "snyk-protect": "snyk protect",
-    "prepare": "npm run snyk-protect"
+    "storybook": "start-storybook -p 9009 -s src/pages"
   },
   "dependencies": {
     "@storybook/addon-actions": "5.0.0-rc.1",
@@ -51,9 +49,7 @@
     "react-stack-grid": "^0.7.1",
     "recompose": "^0.30.0",
     "sitemap": "^2.1.0",
-    "snyk": "^1.134.2",
     "styled-components": "^4.1.3",
     "validatorjs": "^3.15.1"
-  },
-  "snyk": true
+  }
 }

From a751468f9fe42f17be2a59a43f574bc134377f80 Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Thu, 7 Mar 2019 11:11:26 +0100
Subject: [PATCH 195/249] FIX lockfile

---
 docs/yarn.lock | 754 +++++--------------------------------------------
 1 file changed, 67 insertions(+), 687 deletions(-)

diff --git a/docs/yarn.lock b/docs/yarn.lock
index 9f7902fe06b..df8528edde6 100644
--- a/docs/yarn.lock
+++ b/docs/yarn.lock
@@ -1003,21 +1003,6 @@
     react-lifecycles-compat "^3.0.4"
     warning "^3.0.0"
 
-"@snyk/dep-graph@1.4.0":
-  version "1.4.0"
-  resolved "https://registry.yarnpkg.com/@snyk/dep-graph/-/dep-graph-1.4.0.tgz#0d0971c3ef3238a74112ed5d81c782a6a292575a"
-  integrity sha512-dz4Fo4L9sN0Rt8hMe+zMYZ4mAiljtyIeWvujLyCxhIT5iHSlceUYlba5TDsOFuKyuZKkuhVjORWY1oFEuRzCcA==
-  dependencies:
-    graphlib "^2.1.5"
-    lodash "^4"
-    source-map-support "^0.5.9"
-    tslib "^1.9.3"
-
-"@snyk/gemfile@1.2.0":
-  version "1.2.0"
-  resolved "https://registry.yarnpkg.com/@snyk/gemfile/-/gemfile-1.2.0.tgz#919857944973cce74c650e5428aaf11bcd5c0457"
-  integrity sha512-nI7ELxukf7pT4/VraL4iabtNNMz8mUo7EXlqCFld8O5z6mIMLX9llps24iPpaIZOwArkY3FWA+4t+ixyvtTSIA==
-
 "@storybook/addon-actions@5.0.0-rc.1":
   version "5.0.0-rc.1"
   resolved "https://registry.yarnpkg.com/@storybook/addon-actions/-/addon-actions-5.0.0-rc.1.tgz#3a72bd0e77c24f35ccdaf0668d18863e214c27cd"
@@ -1477,11 +1462,6 @@
   resolved "https://registry.yarnpkg.com/@types/node/-/node-7.10.5.tgz#6831006b2c87441d69e79b37ae9bc03246dfb379"
   integrity sha512-RYkagUUbxQBss46ElbEa+j4q4X3GR12QwB7a/PM5hmVuVkYoW1jENT1+taspKUv8ibwW8cw+kRFbOaTc/Key3w==
 
-"@types/node@^8.0.7":
-  version "8.10.42"
-  resolved "https://registry.yarnpkg.com/@types/node/-/node-8.10.42.tgz#d3d8e738e13540a09b3f4a714dac1ffbf8939f7d"
-  integrity sha512-8LCqostMfYwQs9by1k21/P4KZp9uFQk3Q528y3qtPKQnCJmKz0Em3YzgeNjTNV1FVrG/7n/6j12d4UKg9zSgDw==
-
 "@types/prop-types@*":
   version "15.7.0"
   resolved "https://registry.yarnpkg.com/@types/prop-types/-/prop-types-15.7.0.tgz#4c48fed958d6dcf9487195a0ef6456d5f6e0163a"
@@ -1705,17 +1685,12 @@
   resolved "https://registry.yarnpkg.com/@xtuc/long/-/long-4.2.2.tgz#d291c6a4e97989b5c61d9acf396ae4fe133a718d"
   integrity sha512-NuHqBY1PB/D8xU6s/thBgOAiAP7HOYDQ32+BFZILJ8ivkUkAHQnWfn6WhL79Owj1qmUnoN/YPhktdIoucipkAQ==
 
-"@yarnpkg/lockfile@^1.0.2":
-  version "1.1.0"
-  resolved "https://registry.yarnpkg.com/@yarnpkg/lockfile/-/lockfile-1.1.0.tgz#e77a97fbd345b76d83245edcd17d393b1b41fb31"
-  integrity sha512-GpSwvyXOcOOlV70vbnzjj4fW5xW/FdUF6nQEt1ENy7m4ZCczi1+/buVUPAqmGfqznsORNFzUMjctTIp8a9tuCQ==
-
 "@zeit/schemas@2.1.1":
   version "2.1.1"
   resolved "https://registry.yarnpkg.com/@zeit/schemas/-/schemas-2.1.1.tgz#bca9d84df177c85f2d2a7dad37512f384761b23d"
   integrity sha512-7uBms9Uwzq1GnLK7ar4FvhUONW5PuuASBomeMJ5rREMYxWdm2R0/5iXH2gUm8uqVT1x8U51CGuoaF40Tc0xoJA==
 
-abbrev@1, abbrev@^1.1.1:
+abbrev@1:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/abbrev/-/abbrev-1.1.1.tgz#f8f2c887ad10bf67f634f005b6987fed3179aac8"
   integrity sha512-nne9/IiQ/hzIhY6pdDnbBtz7DjPTKrY00P/zvPSm5pOFkl6xuGrGnXn/VtTNNfNtAfZ9/1RtehkszU9qcTii0Q==
@@ -1753,13 +1728,6 @@ after@0.8.2:
   resolved "https://registry.yarnpkg.com/after/-/after-0.8.2.tgz#fedb394f9f0e02aa9768e702bda23b505fae7e1f"
   integrity sha1-/ts5T58OAqqXaOcCvaI7UF+ufh8=
 
-agent-base@4, agent-base@^4.1.0, agent-base@^4.2.0:
-  version "4.2.1"
-  resolved "https://registry.yarnpkg.com/agent-base/-/agent-base-4.2.1.tgz#d89e5999f797875674c07d87f260fc41e83e8ca9"
-  integrity sha512-JVwXMr9nHYTUXsBFKUqhJwvlcYU/blreOEUkhNR2eXZIvwd+c+o5V4MgDPKWnMS/56awN3TRzIP+KoPn+roQtg==
-  dependencies:
-    es6-promisify "^5.0.0"
-
 "airbnb-js-shims@^1 || ^2":
   version "2.1.1"
   resolved "https://registry.yarnpkg.com/airbnb-js-shims/-/airbnb-js-shims-2.1.1.tgz#a509611480db7e6d9db62fe2acfaeb473b6842ac"
@@ -1859,7 +1827,7 @@ ansi-colors@^3.0.0:
   resolved "https://registry.yarnpkg.com/ansi-colors/-/ansi-colors-3.2.4.tgz#e3a3da4bfbae6c86a9c285625de124a234026fbf"
   integrity sha512-hHUXGagefjN2iRrID63xckIvotOXOojhQKWIPUZ4mNUZ9nLZW+7FMNoE1lOkEhNWYsx/7ysGIuJYCiMAA9FnrA==
 
-ansi-escapes@^3.0.0, ansi-escapes@^3.1.0, ansi-escapes@^3.2.0:
+ansi-escapes@^3.0.0, ansi-escapes@^3.2.0:
   version "3.2.0"
   resolved "https://registry.yarnpkg.com/ansi-escapes/-/ansi-escapes-3.2.0.tgz#8780b98ff9dbf5638152d1f1fe5c1d7b4442976b"
   integrity sha512-cBhpre4ma+U0T1oM5fXg7Dy1Jw7zzwv7lt/GoCpr+hDQJoYnKVPLL4dCvSEFMmQurOQvSrwT7SL/DAlhBI97RQ==
@@ -1913,11 +1881,6 @@ ansi@^0.3.0, ansi@~0.3.1:
   resolved "https://registry.yarnpkg.com/ansi/-/ansi-0.3.1.tgz#0c42d4fb17160d5a9af1e484bace1c66922c1b21"
   integrity sha1-DELU+xcWDVqa8eSEus4cZpIsGyE=
 
-ansicolors@^0.3.2:
-  version "0.3.2"
-  resolved "https://registry.yarnpkg.com/ansicolors/-/ansicolors-0.3.2.tgz#665597de86a9ffe3aa9bfbe6cae5c6ea426b4979"
-  integrity sha1-ZlWX3oap/+Oqm/vmyuXG6kJrSXk=
-
 any-promise@^0.1.0:
   version "0.1.0"
   resolved "https://registry.yarnpkg.com/any-promise/-/any-promise-0.1.0.tgz#830b680aa7e56f33451d4b049f3bd8044498ee27"
@@ -1966,11 +1929,6 @@ archive-type@^3.0.0, archive-type@^3.0.1:
   dependencies:
     file-type "^3.1.0"
 
-archy@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/archy/-/archy-1.0.0.tgz#f9c8c13757cc1dd7bc379ac77b2c62a5c2868c40"
-  integrity sha1-+cjBN1fMHde8N5rHeyxipcKGjEA=
-
 are-we-there-yet@~1.1.2:
   version "1.1.5"
   resolved "https://registry.yarnpkg.com/are-we-there-yet/-/are-we-there-yet-1.1.5.tgz#4b35c2944f062a8bfcda66410760350fe9ddfc21"
@@ -2164,11 +2122,6 @@ ast-types@0.11.7:
   resolved "https://registry.yarnpkg.com/ast-types/-/ast-types-0.11.7.tgz#f318bf44e339db6a320be0009ded64ec1471f46c"
   integrity sha512-2mP3TwtkY/aTv5X3ZsMpNAbOnyoC/aMJwJSoaELPkHId0nSQgFcnU4dRW3isxiz7+zBexk0ym3WNVjMiQBnJSw==
 
-ast-types@0.x.x:
-  version "0.12.2"
-  resolved "https://registry.yarnpkg.com/ast-types/-/ast-types-0.12.2.tgz#341656049ee328ac03fc805c156b49ebab1e4462"
-  integrity sha512-8c83xDLJM/dLDyXNLiR6afRRm4dPKN6KAnKqytRK3DBJul9lA+atxdQkNDkSVPdTqea5HiRq3lnnOIZ0MBpvdg==
-
 async-each-series@^1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/async-each-series/-/async-each-series-1.1.0.tgz#f42fd8155d38f21a5b8ea07c28e063ed1700b138"
@@ -2189,7 +2142,7 @@ async@^0.9.0:
   resolved "https://registry.yarnpkg.com/async/-/async-0.9.2.tgz#aea74d5e61c1f899613bf64bda66d4c78f2fd17d"
   integrity sha1-rqdNXmHB+JlhO/ZL2mbUx48v0X0=
 
-async@^1.3.0, async@^1.4.0, async@^1.5.0:
+async@^1.3.0, async@^1.5.0:
   version "1.5.2"
   resolved "https://registry.yarnpkg.com/async/-/async-1.5.2.tgz#ec6a61ae56480c0c3cb241c95618e20892f9672a"
   integrity sha1-7GphrlZIDAw8skHJVhjiCJL5Zyo=
@@ -4072,7 +4025,7 @@ camelcase@^1.0.2:
   resolved "https://registry.yarnpkg.com/camelcase/-/camelcase-1.2.1.tgz#9bb5304d2e0b56698b2c758b08a3eaa9daa58a39"
   integrity sha1-m7UwTS4LVmmLLHWLCKPqqdqlijk=
 
-camelcase@^2.0.0, camelcase@^2.0.1:
+camelcase@^2.0.0:
   version "2.1.1"
   resolved "https://registry.yarnpkg.com/camelcase/-/camelcase-2.1.1.tgz#7c1d16d679a1bbe59ca02cacecfb011e201f5a1f"
   integrity sha1-fB0W1nmhu+WcoCys7PsBHiAfWh8=
@@ -4421,7 +4374,7 @@ cliui@^2.1.0:
     right-align "^0.1.1"
     wordwrap "0.0.2"
 
-cliui@^3.0.3, cliui@^3.2.0:
+cliui@^3.2.0:
   version "3.2.0"
   resolved "https://registry.yarnpkg.com/cliui/-/cliui-3.2.0.tgz#120601537a916d29940f934da3b48d585a39213d"
   integrity sha1-EgYBU3qRbSmUD5NNo7SNWFo5IT0=
@@ -4450,16 +4403,6 @@ clone-deep@^0.2.4:
     lazy-cache "^1.0.3"
     shallow-clone "^0.1.2"
 
-clone-deep@^0.3.0:
-  version "0.3.0"
-  resolved "https://registry.yarnpkg.com/clone-deep/-/clone-deep-0.3.0.tgz#348c61ae9cdbe0edfe053d91ff4cc521d790ede8"
-  integrity sha1-NIxhrpzb4O3+BT2R/0zFIdeQ7eg=
-  dependencies:
-    for-own "^1.0.0"
-    is-plain-object "^2.0.1"
-    kind-of "^3.2.2"
-    shallow-clone "^0.1.2"
-
 clone-stats@^0.0.1:
   version "0.0.1"
   resolved "https://registry.yarnpkg.com/clone-stats/-/clone-stats-0.0.1.tgz#b88f94a82cf38b8791d58046ea4029ad88ca99d1"
@@ -4728,7 +4671,7 @@ config-chain@^1.1.12:
     ini "^1.3.4"
     proto-list "~1.2.1"
 
-configstore@^3.0.0, configstore@^3.1.2:
+configstore@^3.0.0:
   version "3.1.2"
   resolved "https://registry.yarnpkg.com/configstore/-/configstore-3.1.2.tgz#c6f25defaeef26df12dd33414b001fe81a543f8f"
   integrity sha512-vtv5HtGjcYUgFrXc6Kx747B83MRRVS5R1VTEQoXvuP+kMI+if6uywV0nDGoiydJRy4yk7h9od5Og0kxx4zUXmw==
@@ -4944,7 +4887,7 @@ cross-spawn@5.1.0, cross-spawn@^5.0.1, cross-spawn@^5.1.0:
     shebang-command "^1.2.0"
     which "^1.2.9"
 
-cross-spawn@6.0.5, cross-spawn@^6.0.0:
+cross-spawn@6.0.5:
   version "6.0.5"
   resolved "https://registry.yarnpkg.com/cross-spawn/-/cross-spawn-6.0.5.tgz#4a5ec7c64dfae22c3a14124dbacdee846d80cbc4"
   integrity sha512-eTVLrBSt7fjbDygz805pMnstIs2VTBNkRm0qxZd+M7A5XDdxVRWO5MxGBXZhjY4cqLYLdtrGqRf8mBPmzwSpWQ==
@@ -5244,18 +5187,6 @@ data-uri-to-buffer@0.0.4:
   resolved "https://registry.yarnpkg.com/data-uri-to-buffer/-/data-uri-to-buffer-0.0.4.tgz#46e13ab9da8e309745c8d01ce547213ebdb2fe3f"
   integrity sha1-RuE6udqOMJdFyNAc5UchPr2y/j8=
 
-data-uri-to-buffer@1:
-  version "1.2.0"
-  resolved "https://registry.yarnpkg.com/data-uri-to-buffer/-/data-uri-to-buffer-1.2.0.tgz#77163ea9c20d8641b4707e8f18abdf9a78f34835"
-  integrity sha512-vKQ9DTQPN1FLYiiEEOQ6IBGFqvjCa5rSK3cWMy/Nespm5d/x3dGFT9UBZnkLxCwua/IXBi2TYnwTEpsOvhC4UQ==
-
-data-uri-to-buffer@2:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/data-uri-to-buffer/-/data-uri-to-buffer-2.0.0.tgz#0ba23671727349828c32cfafddea411908d13d23"
-  integrity sha512-YbKCNLPPP4inc0E5If4OaalBc7gpaM2MRv77Pv2VThVComLKfbGYtJcdDCViDyp1Wd4SebhHLz94vp91zbK6bw==
-  dependencies:
-    "@types/node" "^8.0.7"
-
 date-now@^0.1.4:
   version "0.1.4"
   resolved "https://registry.yarnpkg.com/date-now/-/date-now-0.1.4.tgz#eaf439fd4d4848ad74e5cc7dbef200672b9e345b"
@@ -5278,26 +5209,26 @@ debug@2, debug@2.6.9, debug@^2.1.2, debug@^2.2.0, debug@^2.3.3, debug@^2.6.0, de
   dependencies:
     ms "2.0.0"
 
-debug@3.1.0, debug@~3.1.0:
-  version "3.1.0"
-  resolved "https://registry.yarnpkg.com/debug/-/debug-3.1.0.tgz#5bb5a0672628b64149566ba16819e61518c67261"
-  integrity sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==
+debug@^3.1.0, debug@^3.2.5, debug@^3.2.6:
+  version "3.2.6"
+  resolved "https://registry.yarnpkg.com/debug/-/debug-3.2.6.tgz#e83d17de16d8a7efb7717edbe5fb10135eee629b"
+  integrity sha512-mel+jf7nrtEl5Pn1Qx46zARXKDpBbvzezse7p7LqINmdoIk8PYP5SySaxEmYv6TZ0JyEKA1hsCId6DIhgITtWQ==
   dependencies:
-    ms "2.0.0"
+    ms "^2.1.1"
 
-debug@4, debug@^4.1.0, debug@~4.1.0:
+debug@^4.1.0, debug@~4.1.0:
   version "4.1.1"
   resolved "https://registry.yarnpkg.com/debug/-/debug-4.1.1.tgz#3b72260255109c6b589cee050f1d516139664791"
   integrity sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==
   dependencies:
     ms "^2.1.1"
 
-debug@^3, debug@^3.1.0, debug@^3.2.5, debug@^3.2.6:
-  version "3.2.6"
-  resolved "https://registry.yarnpkg.com/debug/-/debug-3.2.6.tgz#e83d17de16d8a7efb7717edbe5fb10135eee629b"
-  integrity sha512-mel+jf7nrtEl5Pn1Qx46zARXKDpBbvzezse7p7LqINmdoIk8PYP5SySaxEmYv6TZ0JyEKA1hsCId6DIhgITtWQ==
+debug@~3.1.0:
+  version "3.1.0"
+  resolved "https://registry.yarnpkg.com/debug/-/debug-3.1.0.tgz#5bb5a0672628b64149566ba16819e61518c67261"
+  integrity sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==
   dependencies:
-    ms "^2.1.1"
+    ms "2.0.0"
 
 decamelize@^1.0.0, decamelize@^1.1.1, decamelize@^1.1.2:
   version "1.2.0"
@@ -5391,11 +5322,6 @@ deep-extend@^0.6.0:
   resolved "https://registry.yarnpkg.com/deep-extend/-/deep-extend-0.6.0.tgz#c4fa7c95404a17a9c3e8ca7e1537312b736330ac"
   integrity sha512-LOHxIOaPYdHlJRtCQfDIVZtfw/ufM8+rVj649RIHzcm/vGwQRXFt6OPqIFWsm2XEMrNIEtWR64sY1LEKD2vAOA==
 
-deep-is@~0.1.3:
-  version "0.1.3"
-  resolved "https://registry.yarnpkg.com/deep-is/-/deep-is-0.1.3.tgz#b369d6fb5dbc13eecf524f91b070feedc357cf34"
-  integrity sha1-s2nW+128E+7PUk+RsHD+7cNXzzQ=
-
 deepmerge@^2.0.1:
   version "2.2.1"
   resolved "https://registry.yarnpkg.com/deepmerge/-/deepmerge-2.2.1.tgz#5d3ff22a01c00f645405a2fbc17d0778a1801170"
@@ -5435,15 +5361,6 @@ defined@^1.0.0:
   resolved "https://registry.yarnpkg.com/defined/-/defined-1.0.0.tgz#c98d9bcef75674188e110969151199e39b1fa693"
   integrity sha1-yY2bzvdWdBiOEQlpFRGZ45sfppM=
 
-degenerator@^1.0.4:
-  version "1.0.4"
-  resolved "https://registry.yarnpkg.com/degenerator/-/degenerator-1.0.4.tgz#fcf490a37ece266464d9cc431ab98c5819ced095"
-  integrity sha1-/PSQo37OJmRk2cxDGrmMWBnO0JU=
-  dependencies:
-    ast-types "0.x.x"
-    escodegen "1.x.x"
-    esprima "3.x.x"
-
 del@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/del/-/del-3.0.0.tgz#53ecf699ffcbcb39637691ab13baf160819766e5"
@@ -5571,11 +5488,6 @@ devcert-san@^0.3.3:
     tmp "^0.0.31"
     tslib "^1.6.0"
 
-diff@^4.0.1:
-  version "4.0.1"
-  resolved "https://registry.yarnpkg.com/diff/-/diff-4.0.1.tgz#0c667cb467ebbb5cea7f14f135cc2dba7780a8ff"
-  integrity sha512-s2+XdvhPCOF01LRQBC8hf4vhbVmI2CGS5aZnxLJlT5FtdhPCDFq80q++zK2KlrVorVDdL5BOGZ/VfLrVtYNF+Q==
-
 diffie-hellman@^5.0.0:
   version "5.0.3"
   resolved "https://registry.yarnpkg.com/diffie-hellman/-/diffie-hellman-5.0.3.tgz#40e8ee98f55a2149607146921c63e1ae5f3d2875"
@@ -5593,13 +5505,6 @@ dir-glob@2.0.0:
     arrify "^1.0.1"
     path-type "^3.0.0"
 
-dockerfile-ast@0.0.12:
-  version "0.0.12"
-  resolved "https://registry.yarnpkg.com/dockerfile-ast/-/dockerfile-ast-0.0.12.tgz#6f25f6ad55eeecdd297ab68b08be1b32e64b5aeb"
-  integrity sha512-cIV8oXkAxpIuN5XgG0TGg07nLDgrj4olkfrdT77OTA3VypscsYHBUg/FjHxW9K3oA+CyH4Th/qtoMgTVpzSobw==
-  dependencies:
-    vscode-languageserver-types "^3.5.0"
-
 doctrine@^2.0.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/doctrine/-/doctrine-2.1.0.tgz#5cd01fc101621b42c4cd7f5d1a66243716d3f39d"
@@ -5833,11 +5738,6 @@ elliptic@^6.0.0:
     minimalistic-assert "^1.0.0"
     minimalistic-crypto-utils "^1.0.0"
 
-email-validator@^2.0.4:
-  version "2.0.4"
-  resolved "https://registry.yarnpkg.com/email-validator/-/email-validator-2.0.4.tgz#b8dfaa5d0dae28f1b03c95881d904d4e40bfe7ed"
-  integrity sha512-gYCwo7kh5S3IDyZPLZf6hSS0MnZT8QmJFqYvbqlDZSbwdZlY6QZWxJ4i/6UhITOJ4XzyI647Bm2MXKCLqnJ4nQ==
-
 "emoji-regex@>=6.0.0 <=6.1.1":
   version "6.1.1"
   resolved "https://registry.yarnpkg.com/emoji-regex/-/emoji-regex-6.1.1.tgz#c6cd0ec1b0642e2a3c67a1137efc5e796da4f88e"
@@ -6036,18 +5936,11 @@ es6-promise@^3.0.2:
   resolved "https://registry.yarnpkg.com/es6-promise/-/es6-promise-3.3.1.tgz#a08cdde84ccdbf34d027a1451bc91d4bcd28a613"
   integrity sha1-oIzd6EzNvzTQJ6FFG8kdS80ophM=
 
-es6-promise@^4.0.3, es6-promise@^4.1.0:
+es6-promise@^4.1.0:
   version "4.2.6"
   resolved "https://registry.yarnpkg.com/es6-promise/-/es6-promise-4.2.6.tgz#b685edd8258886365ea62b57d30de28fadcd974f"
   integrity sha512-aRVgGdnmW2OiySVPUC9e6m+plolMAJKjZnQlCwNSuK5yQ0JN61DZSO1X1Ufd1foqWRAlig0rhduTCHe7sVtK5Q==
 
-es6-promisify@^5.0.0:
-  version "5.0.0"
-  resolved "https://registry.yarnpkg.com/es6-promisify/-/es6-promisify-5.0.0.tgz#5109d62f3e56ea967c4b63505aef08291c8a5203"
-  integrity sha1-UQnWLz5W6pZ8S2NQWu8IKRyKUgM=
-  dependencies:
-    es6-promise "^4.0.3"
-
 es6-shim@^0.35.3:
   version "0.35.4"
   resolved "https://registry.yarnpkg.com/es6-shim/-/es6-shim-0.35.4.tgz#8d5a4109756383d3f0323421089c423acf8378f1"
@@ -6079,18 +5972,6 @@ escape-string-regexp@1.0.5, escape-string-regexp@^1.0.2, escape-string-regexp@^1
   resolved "https://registry.yarnpkg.com/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz#1b61c0562190a8dff6ae3bb2cf0200ca130b86d4"
   integrity sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ=
 
-escodegen@1.x.x:
-  version "1.11.1"
-  resolved "https://registry.yarnpkg.com/escodegen/-/escodegen-1.11.1.tgz#c485ff8d6b4cdb89e27f4a856e91f118401ca510"
-  integrity sha512-JwiqFD9KdGVVpeuRa68yU3zZnBEOcPs0nKW7wZzXky8Z7tffdYUHbe11bPCV5jYlK6DVdKLWLm0f5I/QlL0Kmw==
-  dependencies:
-    esprima "^3.1.3"
-    estraverse "^4.2.0"
-    esutils "^2.0.2"
-    optionator "^0.8.1"
-  optionalDependencies:
-    source-map "~0.6.1"
-
 eslint-scope@^4.0.0:
   version "4.0.2"
   resolved "https://registry.yarnpkg.com/eslint-scope/-/eslint-scope-4.0.2.tgz#5f10cd6cabb1965bf479fa65745673439e21cb0e"
@@ -6107,11 +5988,6 @@ esniff@^1.1:
     d "1"
     es5-ext "^0.10.12"
 
-esprima@3.x.x, esprima@^3.1.3:
-  version "3.1.3"
-  resolved "https://registry.yarnpkg.com/esprima/-/esprima-3.1.3.tgz#fdca51cee6133895e3c88d535ce49dbff62a4633"
-  integrity sha1-/cpRzuYTOJXjyI1TXOSdv/YqRjM=
-
 esprima@^2.6.0:
   version "2.7.3"
   resolved "https://registry.yarnpkg.com/esprima/-/esprima-2.7.3.tgz#96e3b70d5779f6ad49cd032673d1c312767ba581"
@@ -6129,7 +6005,7 @@ esrecurse@^4.1.0:
   dependencies:
     estraverse "^4.1.0"
 
-estraverse@^4.1.0, estraverse@^4.1.1, estraverse@^4.2.0:
+estraverse@^4.1.0, estraverse@^4.1.1:
   version "4.2.0"
   resolved "https://registry.yarnpkg.com/estraverse/-/estraverse-4.2.0.tgz#0dee3fed31fcd469618ce7342099fc1afa0bdb13"
   integrity sha1-De4/7TH81GlhjOc0IJn8GvoL2xM=
@@ -6219,19 +6095,6 @@ exec-sh@^0.2.0:
   dependencies:
     merge "^1.2.0"
 
-execa@^0.10.0:
-  version "0.10.0"
-  resolved "https://registry.yarnpkg.com/execa/-/execa-0.10.0.tgz#ff456a8f53f90f8eccc71a96d11bdfc7f082cb50"
-  integrity sha512-7XOMnz8Ynx1gGo/3hyV9loYNPWM94jG3+3T3Y8tsfSstFmETmENCMU/A/zj8Lyaj1lkgEepKepvd6240tBRvlw==
-  dependencies:
-    cross-spawn "^6.0.0"
-    get-stream "^3.0.0"
-    is-stream "^1.1.0"
-    npm-run-path "^2.0.0"
-    p-finally "^1.0.0"
-    signal-exit "^3.0.0"
-    strip-eof "^1.0.0"
-
 execa@^0.7.0:
   version "0.7.0"
   resolved "https://registry.yarnpkg.com/execa/-/execa-0.7.0.tgz#944becd34cc41ee32a63a9faf27ad5a65fc59777"
@@ -6382,7 +6245,7 @@ extend-shallow@^3.0.0, extend-shallow@^3.0.2:
     assign-symbols "^1.0.0"
     is-extendable "^1.0.1"
 
-extend@3, extend@^3.0.0, extend@~3.0.2:
+extend@^3.0.0, extend@~3.0.2:
   version "3.0.2"
   resolved "https://registry.yarnpkg.com/extend/-/extend-3.0.2.tgz#f8b1136b4071fbd8eb140aff858b1019ec2915fa"
   integrity sha512-fjquC59cD7CyW6urNXK0FBufkZcoiGG80wTuPujX590cB5Ttln20E2UB4S/WARVqhXffZl2LNgS+gQdPIIim/g==
@@ -6619,11 +6482,6 @@ file-type@^4.1.0, file-type@^4.3.0:
   resolved "https://registry.yarnpkg.com/file-type/-/file-type-4.4.0.tgz#1b600e5fca1fbdc6e80c0a70c71c8dba5f7906c5"
   integrity sha1-G2AOX8ofvcboDApwxxyNul95BsU=
 
-file-uri-to-path@1:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/file-uri-to-path/-/file-uri-to-path-1.0.0.tgz#553a7b8446ff6f684359c445f1e37a05dacc33dd"
-  integrity sha512-0Zt+s3L7Vf1biwWZ29aARiVYLx7iMGnEUl9x33fbB/j3jR81u/O2LbqK+Bm1CDSNDKVtJ/YjwY7TUd5SkeLQLw==
-
 filename-regex@^2.0.0:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/filename-regex/-/filename-regex-2.0.1.tgz#c1c4b9bee3e09725ddb106b75c1e301fe2f18b26"
@@ -6993,14 +6851,6 @@ fsevents@^1.0.0, fsevents@^1.2.7:
     nan "^2.9.2"
     node-pre-gyp "^0.10.0"
 
-ftp@~0.3.10:
-  version "0.3.10"
-  resolved "https://registry.yarnpkg.com/ftp/-/ftp-0.3.10.tgz#9197d861ad8142f3e63d5a83bfe4c59f7330885d"
-  integrity sha1-kZfYYa2BQvPmPVqDv+TFn3MwiF0=
-  dependencies:
-    readable-stream "1.1.x"
-    xregexp "2.0.0"
-
 function-bind@^1.0.2, function-bind@^1.1.1:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/function-bind/-/function-bind-1.1.1.tgz#a56899d3ea3c9bab874bb9773b7c5ede92f4895d"
@@ -7388,30 +7238,6 @@ get-stream@^3.0.0:
   resolved "https://registry.yarnpkg.com/get-stream/-/get-stream-3.0.0.tgz#8e943d1358dc37555054ecbe2edb05aa174ede14"
   integrity sha1-jpQ9E1jcN1VQVOy+LtsFqhdO3hQ=
 
-get-uri@2.0.2:
-  version "2.0.2"
-  resolved "https://registry.yarnpkg.com/get-uri/-/get-uri-2.0.2.tgz#5c795e71326f6ca1286f2fc82575cd2bab2af578"
-  integrity sha512-ZD325dMZOgerGqF/rF6vZXyFGTAay62svjQIT+X/oU2PtxYpFxvSkbsdi+oxIrsNxlZVd4y8wUDqkaExWTI/Cw==
-  dependencies:
-    data-uri-to-buffer "1"
-    debug "2"
-    extend "3"
-    file-uri-to-path "1"
-    ftp "~0.3.10"
-    readable-stream "2"
-
-get-uri@^2.0.0:
-  version "2.0.3"
-  resolved "https://registry.yarnpkg.com/get-uri/-/get-uri-2.0.3.tgz#fa13352269781d75162c6fc813c9e905323fbab5"
-  integrity sha512-x5j6Ks7FOgLD/GlvjKwgu7wdmMR55iuRHhn8hj/+gA+eSbxQvZ+AEomq+3MgVEZj1vpi738QahGbCCSIDtXtkw==
-  dependencies:
-    data-uri-to-buffer "2"
-    debug "4"
-    extend "~3.0.2"
-    file-uri-to-path "1"
-    ftp "~0.3.10"
-    readable-stream "3"
-
 get-value@^2.0.3, get-value@^2.0.6:
   version "2.0.6"
   resolved "https://registry.yarnpkg.com/get-value/-/get-value-2.0.6.tgz#dc15ca1c672387ca76bd37ac0a395ba2042a2c28"
@@ -7711,13 +7537,6 @@ graceful-fs@^4.0.0, graceful-fs@^4.1.11, graceful-fs@^4.1.15, graceful-fs@^4.1.2
   resolved "https://registry.yarnpkg.com/graceful-readlink/-/graceful-readlink-1.0.1.tgz#4cafad76bc62f02fa039b2f94e9a3dd3a391a725"
   integrity sha1-TK+tdrxi8C+gObL5Tpo906ORpyU=
 
-graphlib@^2.1.1, graphlib@^2.1.5:
-  version "2.1.7"
-  resolved "https://registry.yarnpkg.com/graphlib/-/graphlib-2.1.7.tgz#b6a69f9f44bd9de3963ce6804a2fc9e73d86aecc"
-  integrity sha512-TyI9jIy2J4j0qgPmOOrHTCtpPqJGN/aurBwc6ZT+bRii+di1I+Wv3obRhVrmBEXet+qkMaEX67dXrwsd3QQM6w==
-  dependencies:
-    lodash "^4.17.5"
-
 graphql-relay@^0.5.1:
   version "0.5.5"
   resolved "https://registry.yarnpkg.com/graphql-relay/-/graphql-relay-0.5.5.tgz#d6815e6edd618e878d5d921c13fc66033ec867e2"
@@ -8126,7 +7945,7 @@ homedir-polyfill@^1.0.0, homedir-polyfill@^1.0.1:
   dependencies:
     parse-passwd "^1.0.0"
 
-hosted-git-info@^2.1.4, hosted-git-info@^2.5.0, hosted-git-info@^2.7.1:
+hosted-git-info@^2.1.4, hosted-git-info@^2.5.0:
   version "2.7.1"
   resolved "https://registry.yarnpkg.com/hosted-git-info/-/hosted-git-info-2.7.1.tgz#97f236977bd6e125408930ff6de3eec6281ec047"
   integrity sha512-7T/BxH19zbcCTa8XkMlbK5lTo1WtgkFi3GvdWEyNuc4Vex7/9Dqbnpsf4JMydcfj9HCg4zUWFTL3Za6lapg5/w==
@@ -8209,14 +8028,6 @@ http-parser-js@>=0.4.0:
   resolved "https://registry.yarnpkg.com/http-parser-js/-/http-parser-js-0.5.0.tgz#d65edbede84349d0dc30320815a15d39cc3cbbd8"
   integrity sha512-cZdEF7r4gfRIq7ezX9J0T+kQmJNOub71dWbgAXVHDct80TKP4MCETtZQ31xyv38UwgzkWPYF/Xc0ge55dW9Z9w==
 
-http-proxy-agent@^2.1.0:
-  version "2.1.0"
-  resolved "https://registry.yarnpkg.com/http-proxy-agent/-/http-proxy-agent-2.1.0.tgz#e4821beef5b2142a2026bd73926fe537631c5405"
-  integrity sha512-qwHbBLV7WviBl0rQsOzH6o5lwyOIvwp/BdFnvVxXORldu5TmjFfjzBcWUWS5kWAZhmv+JtiDhSuQCp4sBfbIgg==
-  dependencies:
-    agent-base "4"
-    debug "3.1.0"
-
 http-proxy-middleware@~0.17.1:
   version "0.17.4"
   resolved "https://registry.yarnpkg.com/http-proxy-middleware/-/http-proxy-middleware-0.17.4.tgz#642e8848851d66f09d4f124912846dbaeb41b833"
@@ -8255,14 +8066,6 @@ https-browserify@^1.0.0:
   resolved "https://registry.yarnpkg.com/https-browserify/-/https-browserify-1.0.0.tgz#ec06c10e0a34c0f2faf199f7fd7fc78fffd03c73"
   integrity sha1-7AbBDgo0wPL68Zn3/X/Hj//QPHM=
 
-https-proxy-agent@^2.2.1:
-  version "2.2.1"
-  resolved "https://registry.yarnpkg.com/https-proxy-agent/-/https-proxy-agent-2.2.1.tgz#51552970fa04d723e04c56d04178c3f92592bbc0"
-  integrity sha512-HPCTS1LW51bcyMYbxUIOO4HEOlQ1/1qRaFWcyxvwaqUS9TY88aoEuHUY33kuAh1YhVVaDQhLZsnPd+XNARWZlQ==
-  dependencies:
-    agent-base "^4.1.0"
-    debug "^3.1.0"
-
 hyphenate-style-name@^1.0.2:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/hyphenate-style-name/-/hyphenate-style-name-1.0.3.tgz#097bb7fa0b8f1a9cf0bd5c734cf95899981a9b48"
@@ -8353,11 +8156,6 @@ imagesloaded@^4.1.1:
   dependencies:
     ev-emitter "^1.0.0"
 
-immediate@~3.0.5:
-  version "3.0.6"
-  resolved "https://registry.yarnpkg.com/immediate/-/immediate-3.0.6.tgz#9db1dbd0faf8de6fbe0f5dd5e56bb606280de69b"
-  integrity sha1-nbHb0Pr43m++D13V5Wu2BigN5ps=
-
 immer@1.10.0:
   version "1.10.0"
   resolved "https://registry.yarnpkg.com/immer/-/immer-1.10.0.tgz#bad67605ba9c810275d91e1c2a47d4582e98286d"
@@ -8440,7 +8238,7 @@ inherits@2.0.1:
   resolved "https://registry.yarnpkg.com/inherits/-/inherits-2.0.1.tgz#b17d08d326b4423e568eff719f91b0b1cbdf69f1"
   integrity sha1-sX0I0ya0Qj5Wjv9xn5GwscvfafE=
 
-ini@^1.3.0, ini@^1.3.4, ini@^1.3.5, ini@~1.3.0:
+ini@^1.3.4, ini@^1.3.5, ini@~1.3.0:
   version "1.3.5"
   resolved "https://registry.yarnpkg.com/ini/-/ini-1.3.5.tgz#eee25f56db1c9ec6085e0c22778083f596abf927"
   integrity sha512-RZY5huIKCMRWDUqZlEi72f/lmXKMvuszcMBduliQ3nnWbx9X/ZBQO7DijMEYS9EhHBb2qacRUMtC7svLwe0lcw==
@@ -8453,7 +8251,7 @@ inline-style-prefixer@^3.0.6:
     bowser "^1.7.3"
     css-in-js-utils "^2.0.0"
 
-inquirer@3.3.0, inquirer@^3.0.0, inquirer@^3.0.1:
+inquirer@3.3.0, inquirer@^3.0.1:
   version "3.3.0"
   resolved "https://registry.yarnpkg.com/inquirer/-/inquirer-3.3.0.tgz#9dd2f2ad765dcab1ff0443b491442a20ba227dc9"
   integrity sha512-h+xtnyk4EwKvFWHrUYsWErEVR+igKtLdchu+o0Z1RL7VU/jVMFbYir2bp6bAj8efFNxWqHX0dIss6fJQ+/+qeQ==
@@ -8538,7 +8336,7 @@ ip-regex@^1.0.1:
   resolved "https://registry.yarnpkg.com/ip-regex/-/ip-regex-1.0.3.tgz#dc589076f659f419c222039a33316f1c7387effd"
   integrity sha1-3FiQdvZZ9BnCIgOaMzFvHHOH7/0=
 
-ip@^1.1.4, ip@^1.1.5:
+ip@^1.1.5:
   version "1.1.5"
   resolved "https://registry.yarnpkg.com/ip/-/ip-1.1.5.tgz#bdded70114290828c0a039e72ef25f5aaec4354a"
   integrity sha1-vd7XARQpCCjAoDnnLvJfWq7ENUo=
@@ -9408,16 +9206,6 @@ jsprim@^1.2.2:
     json-schema "0.2.3"
     verror "1.10.0"
 
-jszip@^3.1.5:
-  version "3.2.0"
-  resolved "https://registry.yarnpkg.com/jszip/-/jszip-3.2.0.tgz#1c179e8692777490ca4e9b8f3ced08f9b820da2c"
-  integrity sha512-4WjbsaEtBK/DHeDZOPiPw5nzSGLDEDDreFRDEgnoMwmknPjTqa+23XuYFk6NiGbeiAeZCctiQ/X/z0lQBmDVOQ==
-  dependencies:
-    lie "~3.3.0"
-    pako "~1.0.2"
-    readable-stream "~2.3.6"
-    set-immediate-shim "~1.0.1"
-
 kebab-case@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/kebab-case/-/kebab-case-1.0.0.tgz#3f9e4990adcad0c686c0e701f7645868f75f91eb"
@@ -9435,7 +9223,7 @@ kind-of@^2.0.1:
   dependencies:
     is-buffer "^1.0.2"
 
-kind-of@^3.0.2, kind-of@^3.0.3, kind-of@^3.2.0, kind-of@^3.2.2:
+kind-of@^3.0.2, kind-of@^3.0.3, kind-of@^3.2.0:
   version "3.2.2"
   resolved "https://registry.yarnpkg.com/kind-of/-/kind-of-3.2.2.tgz#31ea21a734bab9bbb0f32466d893aea51e4a3c64"
   integrity sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=
@@ -9518,21 +9306,6 @@ leven@^2.0.0:
   resolved "https://registry.yarnpkg.com/leven/-/leven-2.1.0.tgz#c2e7a9f772094dee9d34202ae8acce4687875580"
   integrity sha1-wuep93IJTe6dNCAq6KzORoeHVYA=
 
-levn@~0.3.0:
-  version "0.3.0"
-  resolved "https://registry.yarnpkg.com/levn/-/levn-0.3.0.tgz#3b09924edf9f083c0490fdd4c0bc4421e04764ee"
-  integrity sha1-OwmSTt+fCDwEkP3UwLxEIeBHZO4=
-  dependencies:
-    prelude-ls "~1.1.2"
-    type-check "~0.3.2"
-
-lie@~3.3.0:
-  version "3.3.0"
-  resolved "https://registry.yarnpkg.com/lie/-/lie-3.3.0.tgz#dcf82dee545f46074daf200c7c1c5a08e0f40f6a"
-  integrity sha512-UaiMJzeWRlEujzAuw5LokY1L5ecNQYZKfmyZ9L7wDHb/p5etKaxXhohBcrw0EYby+G/NA52vRSN4N39dxHAIwQ==
-  dependencies:
-    immediate "~3.0.5"
-
 liftoff@^2.2.0:
   version "2.5.0"
   resolved "https://registry.yarnpkg.com/liftoff/-/liftoff-2.5.0.tgz#2009291bb31cea861bbf10a7c15a28caf75c31ec"
@@ -9696,12 +9469,12 @@ lodash._root@^3.0.0:
   resolved "https://registry.yarnpkg.com/lodash._root/-/lodash._root-3.0.1.tgz#fba1c4524c19ee9a5f8136b4609f017cf4ded692"
   integrity sha1-+6HEUkwZ7ppfgTa0YJ8BfPTe1pI=
 
-lodash.assign@^4.0.3, lodash.assign@^4.0.6, lodash.assign@^4.2.0:
+lodash.assign@^4.0.3, lodash.assign@^4.0.6:
   version "4.2.0"
   resolved "https://registry.yarnpkg.com/lodash.assign/-/lodash.assign-4.2.0.tgz#0d99f3ccd7a6d261d19bdaeb9245005d285808e7"
   integrity sha1-DZnzzNem0mHRm9rrkkUAXShYCOc=
 
-lodash.assignin@^4.0.9, lodash.assignin@^4.2.0:
+lodash.assignin@^4.0.9:
   version "4.2.0"
   resolved "https://registry.yarnpkg.com/lodash.assignin/-/lodash.assignin-4.2.0.tgz#ba8df5fb841eb0a3e8044232b0e263a8dc6a28a2"
   integrity sha1-uo31+4QesKPoBEIysOJjqNxqKKI=
@@ -9716,12 +9489,7 @@ lodash.camelcase@^4.3.0:
   resolved "https://registry.yarnpkg.com/lodash.camelcase/-/lodash.camelcase-4.3.0.tgz#b28aa6288a2b9fc651035c7711f65ab6190331a6"
   integrity sha1-soqmKIorn8ZRA1x3EfZathkDMaY=
 
-lodash.clone@^4.5.0:
-  version "4.5.0"
-  resolved "https://registry.yarnpkg.com/lodash.clone/-/lodash.clone-4.5.0.tgz#195870450f5a13192478df4bc3d23d2dea1907b6"
-  integrity sha1-GVhwRQ9aExkkeN9Lw9I9LeoZB7Y=
-
-lodash.clonedeep@^4.3.0, lodash.clonedeep@^4.5.0:
+lodash.clonedeep@^4.5.0:
   version "4.5.0"
   resolved "https://registry.yarnpkg.com/lodash.clonedeep/-/lodash.clonedeep-4.5.0.tgz#e23f3f9c4f8fbdde872529c1071857a086e5ccef"
   integrity sha1-4j8/nE+Pvd6HJSnBBxhXoIblzO8=
@@ -9758,7 +9526,7 @@ lodash.filter@^4.4.0:
   resolved "https://registry.yarnpkg.com/lodash.filter/-/lodash.filter-4.6.0.tgz#668b1d4981603ae1cc5a6fa760143e480b4c4ace"
   integrity sha1-ZosdSYFgOuHMWm+nYBQ+SAtMSs4=
 
-lodash.flatten@^4.2.0, lodash.flatten@^4.4.0:
+lodash.flatten@^4.2.0:
   version "4.4.0"
   resolved "https://registry.yarnpkg.com/lodash.flatten/-/lodash.flatten-4.4.0.tgz#f31c22225a9632d2bbf8e4addbef240aa765a61f"
   integrity sha1-8xwiIlqWMtK7+OSt2+8kCqdlph8=
@@ -9879,11 +9647,6 @@ lodash.restparam@^3.0.0:
   resolved "https://registry.yarnpkg.com/lodash.restparam/-/lodash.restparam-3.6.1.tgz#936a4e309ef330a7645ed4145986c85ae5b20805"
   integrity sha1-k2pOMJ7zMKdkXtQUWYbIWuWyCAU=
 
-lodash.set@^4.3.2:
-  version "4.3.2"
-  resolved "https://registry.yarnpkg.com/lodash.set/-/lodash.set-4.3.2.tgz#d8757b1da807dde24816b0d6a84bea1a76230b23"
-  integrity sha1-2HV7HagH3eJIFrDWqEvqGnYjCyM=
-
 lodash.some@^4.4.0, lodash.some@^4.6.0:
   version "4.6.0"
   resolved "https://registry.yarnpkg.com/lodash.some/-/lodash.some-4.6.0.tgz#1bb9f314ef6b8baded13b549169b2a945eb68e4d"
@@ -9952,7 +9715,7 @@ lodash@3.10.1:
   resolved "https://registry.yarnpkg.com/lodash/-/lodash-3.10.1.tgz#5bf45e8e49ba4189e17d482789dfd15bd140b7b6"
   integrity sha1-W/Rejkm6QYnhfUgnid/RW9FAt7Y=
 
-lodash@4, lodash@^4, lodash@^4.1.0, lodash@^4.15.0, lodash@^4.17.10, lodash@^4.17.11, lodash@^4.17.2, lodash@^4.17.4, lodash@^4.17.5, lodash@^4.2.0, lodash@^4.2.1, lodash@^4.3.0, lodash@^4.6.1:
+lodash@4, lodash@^4.1.0, lodash@^4.15.0, lodash@^4.17.10, lodash@^4.17.11, lodash@^4.17.2, lodash@^4.17.4, lodash@^4.2.0, lodash@^4.2.1, lodash@^4.3.0, lodash@^4.6.1:
   version "4.17.11"
   resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.11.tgz#b39ea6229ef607ecd89e2c8df12536891cac9b8d"
   integrity sha512-cQKh8igo5QUhZ7lg38DYWAxMvjSAKG0A8wGSVimP07SIUEK2UO+arSRKbRZWtelMtN5V0Hkwh5ryOto/SshYIg==
@@ -10040,7 +9803,7 @@ lpad-align@^1.0.1:
     longest "^1.0.0"
     meow "^3.3.0"
 
-lru-cache@^4.0.0, lru-cache@^4.0.1, lru-cache@^4.1.2, lru-cache@^4.1.3:
+lru-cache@^4.0.1, lru-cache@^4.1.3:
   version "4.1.5"
   resolved "https://registry.yarnpkg.com/lru-cache/-/lru-cache-4.1.5.tgz#8bbe50ea85bed59bc9e33dcab8235ee9bcf443cd"
   integrity sha512-sWZlbEP2OsHNkXrMl5GYk/jKk70MBng6UU4YI/qGDYbgf6YbP4EvmqISbXCoJiRKs+1bSpFHVgQxvJ17F2li5g==
@@ -10060,11 +9823,6 @@ ltcdr@^2.2.1:
   resolved "https://registry.yarnpkg.com/ltcdr/-/ltcdr-2.2.1.tgz#5ab87ad1d4c1dab8e8c08bbf037ee0c1902287cf"
   integrity sha1-Wrh60dTB2rjowIu/A37gwZAih88=
 
-macos-release@^2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/macos-release/-/macos-release-2.0.0.tgz#7dddf4caf79001a851eb4fba7fb6034f251276ab"
-  integrity sha512-iCM3ZGeqIzlrH7KxYK+fphlJpCCczyHXc+HhRVbEu9uNTCrzYJjvvtefzeKTCVHd5AP/aD/fzC80JZ4ZP+dQ/A==
-
 make-dir@^1.0.0:
   version "1.3.0"
   resolved "https://registry.yarnpkg.com/make-dir/-/make-dir-1.3.0.tgz#79c1033b80515bd6d24ec9933e860ca75ee27f0c"
@@ -10630,22 +10388,12 @@ nanomatch@^1.2.9:
     snapdragon "^0.8.1"
     to-regex "^3.0.1"
 
-nconf@^0.10.0:
-  version "0.10.0"
-  resolved "https://registry.yarnpkg.com/nconf/-/nconf-0.10.0.tgz#da1285ee95d0a922ca6cee75adcf861f48205ad2"
-  integrity sha512-fKiXMQrpP7CYWJQzKkPPx9hPgmq+YLDyxcG9N8RpiE9FoCkCbzD0NyW0YhE3xn3Aupe7nnDeIx4PFzYehpHT9Q==
-  dependencies:
-    async "^1.4.0"
-    ini "^1.3.0"
-    secure-keys "^1.0.0"
-    yargs "^3.19.0"
-
 ncp@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/ncp/-/ncp-2.0.0.tgz#195a21d6c46e361d2fb1281ba38b91e9df7bdbb3"
   integrity sha1-GVoh1sRuNh0vsSgbo4uR6d9727M=
 
-needle@^2.2.1, needle@^2.2.4:
+needle@^2.2.1:
   version "2.2.4"
   resolved "https://registry.yarnpkg.com/needle/-/needle-2.2.4.tgz#51931bff82533b1928b7d1d69e01f1b00ffd2a4e"
   integrity sha512-HyoqEb4wr/rsoaIDfTH2aVL9nWtQqba2/HvMv+++m8u0dz808MaagKILxtfeSN7QU7nvbQ79zk3vYOJp9zsNEA==
@@ -10664,11 +10412,6 @@ neo-async@^2.5.0:
   resolved "https://registry.yarnpkg.com/neo-async/-/neo-async-2.6.0.tgz#b9d15e4d71c6762908654b5183ed38b753340835"
   integrity sha512-MFh0d/Wa7vkKO3Y3LlacqAEeHK0mckVqzDieUKTT+KGxi+zIpeVsFxymkIiRpbpDziHc290Xr9A1O4Om7otoRA==
 
-netmask@^1.0.6:
-  version "1.0.6"
-  resolved "https://registry.yarnpkg.com/netmask/-/netmask-1.0.6.tgz#20297e89d86f6f6400f250d9f4f6b4c1945fcd35"
-  integrity sha1-ICl+idhvb2QA8lDZ9Pa0wZRfzTU=
-
 netrc@^0.1.3:
   version "0.1.4"
   resolved "https://registry.yarnpkg.com/netrc/-/netrc-0.1.4.tgz#6be94fcaca8d77ade0a9670dc460914c94472444"
@@ -11152,18 +10895,6 @@ optimist@~0.6.0, optimist@~0.6.1:
     minimist "~0.0.1"
     wordwrap "~0.0.2"
 
-optionator@^0.8.1:
-  version "0.8.2"
-  resolved "https://registry.yarnpkg.com/optionator/-/optionator-0.8.2.tgz#364c5e409d3f4d6301d6c0b4c05bba50180aeb64"
-  integrity sha1-NkxeQJ0/TWMB1sC0wFu6UBgK62Q=
-  dependencies:
-    deep-is "~0.1.3"
-    fast-levenshtein "~2.0.4"
-    levn "~0.3.0"
-    prelude-ls "~1.1.2"
-    type-check "~0.3.2"
-    wordwrap "~1.0.0"
-
 ordered-read-streams@^0.3.0:
   version "0.3.0"
   resolved "https://registry.yarnpkg.com/ordered-read-streams/-/ordered-read-streams-0.3.0.tgz#7137e69b3298bb342247a1bbee3881c80e2fd78b"
@@ -11215,14 +10946,6 @@ os-locale@^2.0.0:
     lcid "^1.0.0"
     mem "^1.1.0"
 
-os-name@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/os-name/-/os-name-3.0.0.tgz#e1434dbfddb8e74b44c98b56797d951b7648a5d9"
-  integrity sha512-7c74tib2FsdFbQ3W+qj8Tyd1R3Z6tuVRNNxXjJcZ4NgjIEQU9N/prVMqcW29XZPXGACqaXN3jq58/6hoaoXH6g==
-  dependencies:
-    macos-release "^2.0.0"
-    windows-release "^3.1.0"
-
 os-tmpdir@^1.0.0, os-tmpdir@^1.0.1, os-tmpdir@~1.0.1, os-tmpdir@~1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/os-tmpdir/-/os-tmpdir-1.0.2.tgz#bbe67406c79aa85c5cfec766fe5734555dfa1274"
@@ -11310,31 +11033,6 @@ p-try@^2.0.0:
   resolved "https://registry.yarnpkg.com/p-try/-/p-try-2.0.0.tgz#85080bb87c64688fa47996fe8f7dfbe8211760b1"
   integrity sha512-hMp0onDKIajHfIkdRk3P4CdCmErkYAxxDtP3Wx/4nZ3aGlau2VKh3mZpcuFkH27WQkL/3WBCPOktzA9ZOAnMQQ==
 
-pac-proxy-agent@^2.0.1:
-  version "2.0.2"
-  resolved "https://registry.yarnpkg.com/pac-proxy-agent/-/pac-proxy-agent-2.0.2.tgz#90d9f6730ab0f4d2607dcdcd4d3d641aa26c3896"
-  integrity sha512-cDNAN1Ehjbf5EHkNY5qnRhGPUCp6SnpyVof5fRzN800QV1Y2OkzbH9rmjZkbBRa8igof903yOnjIl6z0SlAhxA==
-  dependencies:
-    agent-base "^4.2.0"
-    debug "^3.1.0"
-    get-uri "^2.0.0"
-    http-proxy-agent "^2.1.0"
-    https-proxy-agent "^2.2.1"
-    pac-resolver "^3.0.0"
-    raw-body "^2.2.0"
-    socks-proxy-agent "^3.0.0"
-
-pac-resolver@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/pac-resolver/-/pac-resolver-3.0.0.tgz#6aea30787db0a891704deb7800a722a7615a6f26"
-  integrity sha512-tcc38bsjuE3XZ5+4vP96OfhOugrX+JcnpUbhfuc4LuXBLQhoTthOstZeoQJBDnQUDYzYmdImKsbz0xSl1/9qeA==
-  dependencies:
-    co "^4.6.0"
-    degenerator "^1.0.4"
-    ip "^1.1.5"
-    netmask "^1.0.6"
-    thunkify "^2.1.2"
-
 package-json@^4.0.0:
   version "4.0.1"
   resolved "https://registry.yarnpkg.com/package-json/-/package-json-4.0.1.tgz#8869a0401253661c4c4ca3da6c2121ed555f5eed"
@@ -11350,7 +11048,7 @@ pako@~0.2.0:
   resolved "https://registry.yarnpkg.com/pako/-/pako-0.2.9.tgz#f3f7522f4ef782348da8161bad9ecfd51bf83a75"
   integrity sha1-8/dSL073gjSNqBYbrZ7P1Rv4OnU=
 
-pako@~1.0.2, pako@~1.0.5:
+pako@~1.0.5:
   version "1.0.10"
   resolved "https://registry.yarnpkg.com/pako/-/pako-1.0.10.tgz#4328badb5086a426aa90f541977d4955da5c9732"
   integrity sha512-0DTvPVU3ed8+HNXOu5Bs+o//Mbdj9VNQMUOe9oKCwh8l0GNwpTDMKCWbRjgtD291AWnkAgkqA/LOnQS8AmS1tw==
@@ -12446,11 +12144,6 @@ prebuild-install@^4.0.0:
     tunnel-agent "^0.6.0"
     which-pm-runs "^1.0.0"
 
-prelude-ls@~1.1.2:
-  version "1.1.2"
-  resolved "https://registry.yarnpkg.com/prelude-ls/-/prelude-ls-1.1.2.tgz#21932a549f5e52ffd9a827f570e04be62a97da54"
-  integrity sha1-IZMqVJ9eUv/ZqCf1cOBL5iqX2lQ=
-
 prepend-http@^1.0.0, prepend-http@^1.0.1:
   version "1.0.4"
   resolved "https://registry.yarnpkg.com/prepend-http/-/prepend-http-1.0.4.tgz#d4f4562b0ce3696e41ac52d0e002e57a635dc6dc"
@@ -12549,7 +12242,7 @@ promise.prototype.finally@^3.1.0:
     es-abstract "^1.9.0"
     function-bind "^1.1.1"
 
-"promise@>=3.2 <8", promise@^7.1.1:
+promise@^7.1.1:
   version "7.3.1"
   resolved "https://registry.yarnpkg.com/promise/-/promise-7.3.1.tgz#064b72602b18f90f29192b8b1bc418ffd1ebd3bf"
   integrity sha512-nolQXZ/4L+bP/UGlkfaIujX9BKxGwmQ9OT4mOt5yvy8iK1h3wqTEJCijzGANTCCl9nWjY41juyAn2K3Q1hLLTg==
@@ -12600,25 +12293,6 @@ proxy-addr@~2.0.4:
     forwarded "~0.1.2"
     ipaddr.js "1.8.0"
 
-proxy-agent@2.3.1:
-  version "2.3.1"
-  resolved "https://registry.yarnpkg.com/proxy-agent/-/proxy-agent-2.3.1.tgz#3d49d863d46cf5f37ca8394848346ea02373eac6"
-  integrity sha512-CNKuhC1jVtm8KJYFTS2ZRO71VCBx3QSA92So/e6NrY6GoJonkx3Irnk4047EsCcswczwqAekRj3s8qLRGahSKg==
-  dependencies:
-    agent-base "^4.2.0"
-    debug "^3.1.0"
-    http-proxy-agent "^2.1.0"
-    https-proxy-agent "^2.2.1"
-    lru-cache "^4.1.2"
-    pac-proxy-agent "^2.0.1"
-    proxy-from-env "^1.0.0"
-    socks-proxy-agent "^3.0.0"
-
-proxy-from-env@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/proxy-from-env/-/proxy-from-env-1.0.0.tgz#33c50398f70ea7eb96d21f7b817630a55791c7ee"
-  integrity sha1-M8UDmPcOp+uW0h97gXYwpVeRx+4=
-
 prr@~1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/prr/-/prr-1.0.1.tgz#d3fc114ba06995a45ec6893f484ceb1d78f5f476"
@@ -12766,7 +12440,7 @@ range-parser@1.2.0, range-parser@^1.0.3, range-parser@~1.2.0:
   resolved "https://registry.yarnpkg.com/range-parser/-/range-parser-1.2.0.tgz#f49be6b487894ddc40dcc94a322f611092e00d5e"
   integrity sha1-9JvmtIeJTdxA3MlKMi9hEJLgDV4=
 
-raw-body@2.3.3, raw-body@^2.2.0, raw-body@^2.3.2:
+raw-body@2.3.3, raw-body@^2.3.2:
   version "2.3.3"
   resolved "https://registry.yarnpkg.com/raw-body/-/raw-body-2.3.3.tgz#1b324ece6b5706e153855bc1148c65bb7f6ea0c3"
   integrity sha512-9esiElv1BrZoI3rCDuOuKCBRbuApGGaDPQfjSflGxdy4oyzqghxu6klEkkVIvBje+FF0BX9coEv8KqW6X/7njw==
@@ -13220,7 +12894,7 @@ read@^1.0.7:
   dependencies:
     mute-stream "~0.0.4"
 
-"readable-stream@1 || 2", readable-stream@2, readable-stream@^2.0.0, readable-stream@^2.0.1, readable-stream@^2.0.2, readable-stream@^2.0.4, readable-stream@^2.0.5, readable-stream@^2.0.6, readable-stream@^2.1.5, readable-stream@^2.2.2, readable-stream@^2.3.0, readable-stream@^2.3.3, readable-stream@^2.3.5, readable-stream@^2.3.6, readable-stream@~2.3.6:
+"readable-stream@1 || 2", readable-stream@^2.0.0, readable-stream@^2.0.1, readable-stream@^2.0.2, readable-stream@^2.0.4, readable-stream@^2.0.5, readable-stream@^2.0.6, readable-stream@^2.1.5, readable-stream@^2.2.2, readable-stream@^2.3.0, readable-stream@^2.3.3, readable-stream@^2.3.5, readable-stream@^2.3.6, readable-stream@~2.3.6:
   version "2.3.6"
   resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-2.3.6.tgz#b11c27d88b8ff1fbe070643cf94b0c79ae1b0aaf"
   integrity sha512-tQtKA9WIAhBF3+VLAseyMqZeBjW0AHJoxOtYqSUZNJxauErmLbVm2FW1y+J/YA9dUrAC39ITejlZWhVIwawkKw==
@@ -13233,17 +12907,17 @@ read@^1.0.7:
     string_decoder "~1.1.1"
     util-deprecate "~1.0.1"
 
-readable-stream@1.1.x, readable-stream@~1.1.9:
-  version "1.1.14"
-  resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-1.1.14.tgz#7cf4c54ef648e3813084c636dd2079e166c081d9"
-  integrity sha1-fPTFTvZI44EwhMY23SB54WbAgdk=
+"readable-stream@>=1.0.33-1 <1.1.0-0", readable-stream@~1.0.31:
+  version "1.0.34"
+  resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-1.0.34.tgz#125820e34bc842d2f2aaafafe4c2916ee32c157c"
+  integrity sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw=
   dependencies:
     core-util-is "~1.0.0"
     inherits "~2.0.1"
     isarray "0.0.1"
     string_decoder "~0.10.x"
 
-readable-stream@3, readable-stream@^3.1.1:
+readable-stream@^3.1.1:
   version "3.2.0"
   resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-3.2.0.tgz#de17f229864c120a9f56945756e4f32c4045245d"
   integrity sha512-RV20kLjdmpZuTF1INEb9IA3L68Nmi+Ri7ppZqo78wj//Pn62fCoJyV9zalccNzDD/OuJpMG4f+pfMl8+L6QdGw==
@@ -13252,10 +12926,10 @@ readable-stream@3, readable-stream@^3.1.1:
     string_decoder "^1.1.1"
     util-deprecate "^1.0.1"
 
-"readable-stream@>=1.0.33-1 <1.1.0-0", readable-stream@~1.0.31:
-  version "1.0.34"
-  resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-1.0.34.tgz#125820e34bc842d2f2aaafafe4c2916ee32c157c"
-  integrity sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw=
+readable-stream@~1.1.9:
+  version "1.1.14"
+  resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-1.1.14.tgz#7cf4c54ef648e3813084c636dd2079e166c081d9"
+  integrity sha1-fPTFTvZI44EwhMY23SB54WbAgdk=
   dependencies:
     core-util-is "~1.0.0"
     inherits "~2.0.1"
@@ -13326,7 +13000,7 @@ recursive-readdir@2.2.1:
   dependencies:
     minimatch "3.0.3"
 
-recursive-readdir@2.2.2, recursive-readdir@^2.2.2:
+recursive-readdir@2.2.2:
   version "2.2.2"
   resolved "https://registry.yarnpkg.com/recursive-readdir/-/recursive-readdir-2.2.2.tgz#9946fb3274e1628de6e36b2f6714953b4845094f"
   integrity sha512-nRCcW9Sj7NuZwa2XvH9co8NPeXUBhZP7CRKJtU+cS6PW9FpCIFoI5ib0NT1ZrbNuPoRy0ylyCaUL8Gih4LSyFg==
@@ -14135,11 +13809,6 @@ scroll-behavior@^0.9.9:
     dom-helpers "^3.2.1"
     invariant "^2.2.2"
 
-secure-keys@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/secure-keys/-/secure-keys-1.0.0.tgz#f0c82d98a3b139a8776a8808050b824431087fca"
-  integrity sha1-8MgtmKOxOah3aogIBQuCRDEIf8o=
-
 seek-bzip@^1.0.3:
   version "1.0.5"
   resolved "https://registry.yarnpkg.com/seek-bzip/-/seek-bzip-1.0.5.tgz#cfe917cb3d274bcffac792758af53173eb1fabdc"
@@ -14278,7 +13947,7 @@ set-blocking@^2.0.0, set-blocking@~2.0.0:
   resolved "https://registry.yarnpkg.com/set-blocking/-/set-blocking-2.0.0.tgz#045f9782d011ae9a6803ddd382b24392b3d890f7"
   integrity sha1-BF+XgtARrppoA93TgrJDkrPYkPc=
 
-set-immediate-shim@^1.0.0, set-immediate-shim@~1.0.1:
+set-immediate-shim@^1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/set-immediate-shim/-/set-immediate-shim-1.0.1.tgz#4b2b1b27eb808a9f8dcc481a58e5e56f599f3f61"
   integrity sha1-SysbJ+uAip+NzEgaWOXlb1mfP2E=
@@ -14462,11 +14131,6 @@ slash@^1.0.0:
   resolved "https://registry.yarnpkg.com/slash/-/slash-1.0.0.tgz#c41f2f6c39fc16d1cd17ad4b5d896114ae470d55"
   integrity sha1-xB8vbDn8FtHNF61LXYlhFK5HDVU=
 
-smart-buffer@^1.0.13:
-  version "1.1.15"
-  resolved "https://registry.yarnpkg.com/smart-buffer/-/smart-buffer-1.1.15.tgz#7f114b5b65fab3e2a35aa775bb12f0d1c649bf16"
-  integrity sha1-fxFLW2X6s+KjWqd1uxLw0cZJvxY=
-
 snapdragon-node@^2.0.1:
   version "2.1.1"
   resolved "https://registry.yarnpkg.com/snapdragon-node/-/snapdragon-node-2.1.1.tgz#6c175f86ff14bdb0724563e8f3c1b021a286853b"
@@ -14497,210 +14161,6 @@ snapdragon@^0.8.1:
     source-map-resolve "^0.5.0"
     use "^3.1.0"
 
-snyk-config@2.2.1:
-  version "2.2.1"
-  resolved "https://registry.yarnpkg.com/snyk-config/-/snyk-config-2.2.1.tgz#bdacf79193158ec659bdcc4194140fd8d3772f9d"
-  integrity sha512-eCsFKHHE4J2DpD/1NzAtCmkmVDK310OXRtmoW0RlLnld1ESprJ5A/QRJ5Zxx1JbA8gjuwERY5vfUFA8lEJeopA==
-  dependencies:
-    debug "^3.1.0"
-    lodash "^4.17.11"
-    nconf "^0.10.0"
-
-snyk-docker-plugin@1.22.0:
-  version "1.22.0"
-  resolved "https://registry.yarnpkg.com/snyk-docker-plugin/-/snyk-docker-plugin-1.22.0.tgz#4eb5887934860a60e150d9ebb417ebb071f5cddb"
-  integrity sha512-bykxNtfeWQNFjF6gv8u8w+TOa4fdr+teLm+DkvYlWkdlvaw5m4yywRI5USve4X6S9p4G+Fw4/wfjXx7LgCcxrQ==
-  dependencies:
-    debug "^3"
-    dockerfile-ast "0.0.12"
-    semver "^5.6.0"
-    tslib "^1"
-
-snyk-go-plugin@1.6.1:
-  version "1.6.1"
-  resolved "https://registry.yarnpkg.com/snyk-go-plugin/-/snyk-go-plugin-1.6.1.tgz#fad24de943a587d676af9408e5b3976d6b20267d"
-  integrity sha512-hFOMyznfcMzF1HaZP18VmjQSqK/jBOowh0lpJY4UqmaQSZyJury3Ax+44O9oVUJi8lb8A4g7RVbxhlWl6bIqlA==
-  dependencies:
-    graphlib "^2.1.1"
-    tmp "0.0.33"
-    toml "^2.3.2"
-
-snyk-gradle-plugin@2.1.4:
-  version "2.1.4"
-  resolved "https://registry.yarnpkg.com/snyk-gradle-plugin/-/snyk-gradle-plugin-2.1.4.tgz#4ca478b87f591bd1c37b5d127c9eff4c042f429c"
-  integrity sha512-EOG4OEt9KAkMgaiG3IWi1ENkfIehMhQTd/KU+uoNbEJJ9KYk3POcB+7CsRq6kJa2Th/9aMGp+ojm6HOrOkJM4w==
-  dependencies:
-    clone-deep "^0.3.0"
-
-snyk-module@1.9.1, snyk-module@^1.6.0, snyk-module@^1.9.1:
-  version "1.9.1"
-  resolved "https://registry.yarnpkg.com/snyk-module/-/snyk-module-1.9.1.tgz#b2a78f736600b0ab680f1703466ed7309c980804"
-  integrity sha512-A+CCyBSa4IKok5uEhqT+hV/35RO6APFNLqk9DRRHg7xW2/j//nPX8wTSZUPF8QeRNEk/sX+6df7M1y6PBHGSHA==
-  dependencies:
-    debug "^3.1.0"
-    hosted-git-info "^2.7.1"
-
-snyk-mvn-plugin@2.0.1:
-  version "2.0.1"
-  resolved "https://registry.yarnpkg.com/snyk-mvn-plugin/-/snyk-mvn-plugin-2.0.1.tgz#c52d5320e34ff3ab6d50d8b9549a4b32243ed6ae"
-  integrity sha512-TBrdcFXHdYuRYFCvpyUeFC+mCi6SOV3vdxgHrP7JRNnJwO8PYaKCObLJyhpRWa8IaHv/8CjJTmnEbWIh7BPHAA==
-
-snyk-nodejs-lockfile-parser@1.11.0:
-  version "1.11.0"
-  resolved "https://registry.yarnpkg.com/snyk-nodejs-lockfile-parser/-/snyk-nodejs-lockfile-parser-1.11.0.tgz#4af8c36e876627c49f0b563e334b6db07ad3d4af"
-  integrity sha512-eTdq5VcaHJwGoApejebTChi5hRcIDdNbO6lMwncS0zz9ZxXskoQ0C+VMdep8ELmJa0Gcz6es1sSkABPZs7frrg==
-  dependencies:
-    "@yarnpkg/lockfile" "^1.0.2"
-    graphlib "^2.1.5"
-    lodash "^4.17.11"
-    source-map-support "^0.5.7"
-    tslib "^1.9.3"
-    uuid "^3.3.2"
-
-snyk-nuget-plugin@1.7.2:
-  version "1.7.2"
-  resolved "https://registry.yarnpkg.com/snyk-nuget-plugin/-/snyk-nuget-plugin-1.7.2.tgz#35ae0a0c68bfc68c6c52710bebd037ff765d1f9a"
-  integrity sha512-zmYD9veH7OeIqGnZHiGv8c8mKtmYrxo2o7P4lNUkpHdCMMsar7moRJxGgO9WlcIrwAGjIhMdP9fUvJ+jVDEteQ==
-  dependencies:
-    debug "^3.1.0"
-    jszip "^3.1.5"
-    lodash "^4.17.10"
-    snyk-paket-parser "1.4.3"
-    xml2js "^0.4.17"
-
-snyk-paket-parser@1.4.3:
-  version "1.4.3"
-  resolved "https://registry.yarnpkg.com/snyk-paket-parser/-/snyk-paket-parser-1.4.3.tgz#380ae8c5fb598f81c110f6b645c728c9cc50b7a5"
-  integrity sha512-6m736zGVoeT/zS9KEtlmqTSPEPjAfLe8iYoQ3AwbyxDhzuLY49lTaV67MyZtGwjhi1x4KBe+XOgeWwyf6Avf/A==
-  dependencies:
-    tslib "^1.9.3"
-
-snyk-php-plugin@1.5.2:
-  version "1.5.2"
-  resolved "https://registry.yarnpkg.com/snyk-php-plugin/-/snyk-php-plugin-1.5.2.tgz#277512f6f2bbb87ae0c6f4859cef44591f732b30"
-  integrity sha512-s/s9s7mslHjLnzin2BNLGdy/s6tNBfJ4/T/d9JBjsjIwdJFaUKY/ciWwBLNaWt2Aqtyr3DiUcqg3j/pwTKhEDg==
-  dependencies:
-    debug "^3.1.0"
-    lodash "^4.17.5"
-
-snyk-policy@1.13.3:
-  version "1.13.3"
-  resolved "https://registry.yarnpkg.com/snyk-policy/-/snyk-policy-1.13.3.tgz#83e71ca51c471b9ad01c0e323f13307787a5636d"
-  integrity sha512-6J2a+Wt9zgvTtCwi4x8rLtkDQzFNPqubfIgs3aR35ZsEXPwI4XHGo0cxnJPDriqncp2JK72vnRpNfIZ7v0L1Mw==
-  dependencies:
-    debug "^3.1.0"
-    email-validator "^2.0.4"
-    js-yaml "^3.12.0"
-    lodash.clonedeep "^4.5.0"
-    semver "^5.6.0"
-    snyk-module "^1.9.1"
-    snyk-resolve "^1.0.1"
-    snyk-try-require "^1.3.1"
-    then-fs "^2.0.0"
-
-snyk-python-plugin@1.9.1:
-  version "1.9.1"
-  resolved "https://registry.yarnpkg.com/snyk-python-plugin/-/snyk-python-plugin-1.9.1.tgz#f8f7897f7068c434560cf43200d306fe91cf806d"
-  integrity sha512-4R040DBK77NSfSy3rCndmrv85YlLrKZU1ct59oZSoGb1PYdCi8kXRuq50UpSgasp6YR0yJxT22T38hNOAjTtVw==
-  dependencies:
-    tmp "0.0.33"
-
-snyk-resolve-deps@4.0.2:
-  version "4.0.2"
-  resolved "https://registry.yarnpkg.com/snyk-resolve-deps/-/snyk-resolve-deps-4.0.2.tgz#c3fa08a14fff6667628ec590061360de15f67ae6"
-  integrity sha512-nlw62wiWhGOTw3BD3jVIwrUkRR4iNxEkkO4Y/PWs8BsUWseGu1H6QgLesFXJb3qx7ANJ5UbUCJMgV+eL0Lf9cA==
-  dependencies:
-    ansicolors "^0.3.2"
-    debug "^3.2.5"
-    lodash.assign "^4.2.0"
-    lodash.assignin "^4.2.0"
-    lodash.clone "^4.5.0"
-    lodash.flatten "^4.4.0"
-    lodash.get "^4.4.2"
-    lodash.set "^4.3.2"
-    lru-cache "^4.0.0"
-    semver "^5.5.1"
-    snyk-module "^1.6.0"
-    snyk-resolve "^1.0.0"
-    snyk-tree "^1.0.0"
-    snyk-try-require "^1.1.1"
-    then-fs "^2.0.0"
-
-snyk-resolve@1.0.1, snyk-resolve@^1.0.0, snyk-resolve@^1.0.1:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/snyk-resolve/-/snyk-resolve-1.0.1.tgz#eaa4a275cf7e2b579f18da5b188fe601b8eed9ab"
-  integrity sha512-7+i+LLhtBo1Pkth01xv+RYJU8a67zmJ8WFFPvSxyCjdlKIcsps4hPQFebhz+0gC5rMemlaeIV6cqwqUf9PEDpw==
-  dependencies:
-    debug "^3.1.0"
-    then-fs "^2.0.0"
-
-snyk-sbt-plugin@2.0.1:
-  version "2.0.1"
-  resolved "https://registry.yarnpkg.com/snyk-sbt-plugin/-/snyk-sbt-plugin-2.0.1.tgz#f302dc5f265b3f8b8ee5b968c7d0ef36a65d6f65"
-  integrity sha512-AsGGMP0W3mlKygXUI5jjt54qWFttZEXT1A40+u21p8rZPXLZprwnd+QH9pZDd04d9W9aofGvON8NJeOn9KS39Q==
-
-snyk-tree@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/snyk-tree/-/snyk-tree-1.0.0.tgz#0fb73176dbf32e782f19100294160448f9111cc8"
-  integrity sha1-D7cxdtvzLngvGRAClBYESPkRHMg=
-  dependencies:
-    archy "^1.0.0"
-
-snyk-try-require@1.3.1, snyk-try-require@^1.1.1, snyk-try-require@^1.3.1:
-  version "1.3.1"
-  resolved "https://registry.yarnpkg.com/snyk-try-require/-/snyk-try-require-1.3.1.tgz#6e026f92e64af7fcccea1ee53d524841e418a212"
-  integrity sha1-bgJvkuZK9/zM6h7lPVJIQeQYohI=
-  dependencies:
-    debug "^3.1.0"
-    lodash.clonedeep "^4.3.0"
-    lru-cache "^4.0.0"
-    then-fs "^2.0.0"
-
-snyk@^1.134.2:
-  version "1.136.0"
-  resolved "https://registry.yarnpkg.com/snyk/-/snyk-1.136.0.tgz#6e4cc3f663e0a56ddfa06ddc96d77414244de74a"
-  integrity sha512-YBAycWFzr9LU17mBwo6+0sZEf4vpT8l45AW8Ijvlh3T8iHW1Tt1Xpg+Vgg1t3sXnDvZIHFMH8P4N4QUZuLoykA==
-  dependencies:
-    "@snyk/dep-graph" "1.4.0"
-    "@snyk/gemfile" "1.2.0"
-    abbrev "^1.1.1"
-    ansi-escapes "^3.1.0"
-    chalk "^2.4.1"
-    configstore "^3.1.2"
-    debug "^3.1.0"
-    diff "^4.0.1"
-    get-uri "2.0.2"
-    inquirer "^3.0.0"
-    lodash "^4.17.11"
-    needle "^2.2.4"
-    opn "^5.4.0"
-    os-name "^3.0.0"
-    proxy-agent "2.3.1"
-    proxy-from-env "^1.0.0"
-    recursive-readdir "^2.2.2"
-    semver "^5.6.0"
-    snyk-config "2.2.1"
-    snyk-docker-plugin "1.22.0"
-    snyk-go-plugin "1.6.1"
-    snyk-gradle-plugin "2.1.4"
-    snyk-module "1.9.1"
-    snyk-mvn-plugin "2.0.1"
-    snyk-nodejs-lockfile-parser "1.11.0"
-    snyk-nuget-plugin "1.7.2"
-    snyk-php-plugin "1.5.2"
-    snyk-policy "1.13.3"
-    snyk-python-plugin "1.9.1"
-    snyk-resolve "1.0.1"
-    snyk-resolve-deps "4.0.2"
-    snyk-sbt-plugin "2.0.1"
-    snyk-tree "^1.0.0"
-    snyk-try-require "1.3.1"
-    source-map-support "^0.5.10"
-    tempfile "^2.0.0"
-    then-fs "^2.0.0"
-    update-notifier "^2.5.0"
-    uuid "^3.3.2"
-
 socket.io-adapter@~1.1.0:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/socket.io-adapter/-/socket.io-adapter-1.1.1.tgz#2a805e8a14d6372124dd9159ad4502f8cb07f06b"
@@ -14795,22 +14255,6 @@ sockjs@^0.3.15:
     faye-websocket "^0.10.0"
     uuid "^3.0.1"
 
-socks-proxy-agent@^3.0.0:
-  version "3.0.1"
-  resolved "https://registry.yarnpkg.com/socks-proxy-agent/-/socks-proxy-agent-3.0.1.tgz#2eae7cf8e2a82d34565761539a7f9718c5617659"
-  integrity sha512-ZwEDymm204mTzvdqyUqOdovVr2YRd2NYskrYrF2LXyZ9qDiMAoFESGK8CRphiO7rtbo2Y757k2Nia3x2hGtalA==
-  dependencies:
-    agent-base "^4.1.0"
-    socks "^1.1.10"
-
-socks@^1.1.10:
-  version "1.1.10"
-  resolved "https://registry.yarnpkg.com/socks/-/socks-1.1.10.tgz#5b8b7fc7c8f341c53ed056e929b7bf4de8ba7b5a"
-  integrity sha1-W4t/x8jzQcU+0FbpKbe/Tei6e1o=
-  dependencies:
-    ip "^1.1.4"
-    smart-buffer "^1.0.13"
-
 sort-keys@^1.0.0:
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/sort-keys/-/sort-keys-1.1.2.tgz#441b6d4d346798f1b4e49e8920adfba0e543f9ad"
@@ -14851,14 +14295,6 @@ source-map-support@^0.4.15:
   dependencies:
     source-map "^0.5.6"
 
-source-map-support@^0.5.10, source-map-support@^0.5.7, source-map-support@^0.5.9, source-map-support@~0.5.9:
-  version "0.5.10"
-  resolved "https://registry.yarnpkg.com/source-map-support/-/source-map-support-0.5.10.tgz#2214080bc9d51832511ee2bab96e3c2f9353120c"
-  integrity sha512-YfQ3tQFTK/yzlGJuX8pTwa4tifQj4QS2Mj7UegOu8jAz59MqIiMGPXxQhVQiIMNzayuUSF/jEuVnfFF5JqybmQ==
-  dependencies:
-    buffer-from "^1.0.0"
-    source-map "^0.6.0"
-
 source-map-support@~0.2.8:
   version "0.2.10"
   resolved "https://registry.yarnpkg.com/source-map-support/-/source-map-support-0.2.10.tgz#ea5a3900a1c1cb25096a0ae8cc5c2b4b10ded3dc"
@@ -14866,6 +14302,14 @@ source-map-support@~0.2.8:
   dependencies:
     source-map "0.1.32"
 
+source-map-support@~0.5.9:
+  version "0.5.10"
+  resolved "https://registry.yarnpkg.com/source-map-support/-/source-map-support-0.5.10.tgz#2214080bc9d51832511ee2bab96e3c2f9353120c"
+  integrity sha512-YfQ3tQFTK/yzlGJuX8pTwa4tifQj4QS2Mj7UegOu8jAz59MqIiMGPXxQhVQiIMNzayuUSF/jEuVnfFF5JqybmQ==
+  dependencies:
+    buffer-from "^1.0.0"
+    source-map "^0.6.0"
+
 source-map-url@^0.4.0:
   version "0.4.0"
   resolved "https://registry.yarnpkg.com/source-map-url/-/source-map-url-0.4.0.tgz#3e935d7ddd73631b97659956d55128e87b5084a3"
@@ -15619,13 +15063,6 @@ text-table@0.2.0:
   resolved "https://registry.yarnpkg.com/text-table/-/text-table-0.2.0.tgz#7f5ee823ae805207c00af2df4a84ec3fcfa570b4"
   integrity sha1-f17oI66AUgfACvLfSoTsP8+lcLQ=
 
-then-fs@^2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/then-fs/-/then-fs-2.0.0.tgz#72f792dd9d31705a91ae19ebfcf8b3f968c81da2"
-  integrity sha1-cveS3Z0xcFqRrhnr/Piz+WjIHaI=
-  dependencies:
-    promise ">=3.2 <8"
-
 through2-filter@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/through2-filter/-/through2-filter-2.0.0.tgz#60bc55a0dacb76085db1f9dae99ab43f83d622ec"
@@ -15663,11 +15100,6 @@ through@^2.3.6:
   resolved "https://registry.yarnpkg.com/through/-/through-2.3.8.tgz#0dd4c9ffaabc357960b1b724115d7e0e86a2e1f5"
   integrity sha1-DdTJ/6q8NXlgsbckEV1+Doai4fU=
 
-thunkify@^2.1.2:
-  version "2.1.2"
-  resolved "https://registry.yarnpkg.com/thunkify/-/thunkify-2.1.2.tgz#faa0e9d230c51acc95ca13a361ac05ca7e04553d"
-  integrity sha1-+qDp0jDFGsyVyhOjYawFyn4EVT0=
-
 time-stamp@^1.0.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/time-stamp/-/time-stamp-1.1.0.tgz#764a5a11af50561921b133f3b44e618687e0f5c3"
@@ -15705,13 +15137,6 @@ tinycolor2@^1.1.2:
   resolved "https://registry.yarnpkg.com/tinycolor2/-/tinycolor2-1.4.1.tgz#f4fad333447bc0b07d4dc8e9209d8f39a8ac77e8"
   integrity sha1-9PrTM0R7wLB9TcjpIJ2POaisd+g=
 
-tmp@0.0.33, tmp@^0.0.33:
-  version "0.0.33"
-  resolved "https://registry.yarnpkg.com/tmp/-/tmp-0.0.33.tgz#6d34335889768d21b2bcda0aa277ced3b1bfadf9"
-  integrity sha512-jRCJlojKnZ3addtTOjdIqoRuPEKBvNXcGYqzO6zWZX8KfKEpnGY5jfggJQ3EjKuu8D4bJRr0y+cYJFmYbImXGw==
-  dependencies:
-    os-tmpdir "~1.0.2"
-
 tmp@^0.0.31:
   version "0.0.31"
   resolved "https://registry.yarnpkg.com/tmp/-/tmp-0.0.31.tgz#8f38ab9438e17315e5dbd8b3657e8bfb277ae4a7"
@@ -15719,6 +15144,13 @@ tmp@^0.0.31:
   dependencies:
     os-tmpdir "~1.0.1"
 
+tmp@^0.0.33:
+  version "0.0.33"
+  resolved "https://registry.yarnpkg.com/tmp/-/tmp-0.0.33.tgz#6d34335889768d21b2bcda0aa277ced3b1bfadf9"
+  integrity sha512-jRCJlojKnZ3addtTOjdIqoRuPEKBvNXcGYqzO6zWZX8KfKEpnGY5jfggJQ3EjKuu8D4bJRr0y+cYJFmYbImXGw==
+  dependencies:
+    os-tmpdir "~1.0.2"
+
 tmpl@1.0.x:
   version "1.0.4"
   resolved "https://registry.yarnpkg.com/tmpl/-/tmpl-1.0.4.tgz#23640dd7b42d00433911140820e5cf440e521dd1"
@@ -15805,11 +15237,6 @@ toidentifier@1.0.0:
   resolved "https://registry.yarnpkg.com/toidentifier/-/toidentifier-1.0.0.tgz#7e1be3470f1e77948bc43d94a3c8f4d7752ba553"
   integrity sha512-yaOH/Pk/VEhBWWTlhI+qXxDFXlejDGcQipMlyxda9nthulaxLZUNcUqFxokp0vcYnvteJln5FNQDRrxj3YcbVw==
 
-toml@^2.3.2:
-  version "2.3.6"
-  resolved "https://registry.yarnpkg.com/toml/-/toml-2.3.6.tgz#25b0866483a9722474895559088b436fd11f861b"
-  integrity sha512-gVweAectJU3ebq//Ferr2JUY4WKSDe5N+z0FvjDncLGyHmIDoxgY/2Ie4qfEIDm4IS7OA6Rmdm7pdEEdMcV/xQ==
-
 topo@2.x.x:
   version "2.0.2"
   resolved "https://registry.yarnpkg.com/topo/-/topo-2.0.2.tgz#cd5615752539057c0dc0491a621c3bc6fbe1d182"
@@ -15880,7 +15307,7 @@ trough@^1.0.0:
   resolved "https://registry.yarnpkg.com/trough/-/trough-1.0.3.tgz#e29bd1614c6458d44869fc28b255ab7857ef7c24"
   integrity sha512-fwkLWH+DimvA4YCy+/nvJd61nWQQ2liO/nF/RjkTpiOGi+zxZzVkhb1mvbHIIW4b/8nDsYI8uTmAlc0nNkRMOw==
 
-tslib@^1, tslib@^1.6.0, tslib@^1.9.0, tslib@^1.9.3:
+tslib@^1.6.0, tslib@^1.9.0:
   version "1.9.3"
   resolved "https://registry.yarnpkg.com/tslib/-/tslib-1.9.3.tgz#d7e4dd79245d85428c4d7e4822a79917954ca286"
   integrity sha512-4krF8scpejhaOgqzBEcGM7yDIEfi0/8+8zDRZhNZZ2kjmHJ4hv3zCbQWxoJGz1iw5U0Jl0nma13xzHXcncMavQ==
@@ -15907,13 +15334,6 @@ tweetnacl@^0.14.3, tweetnacl@~0.14.0:
   resolved "https://registry.yarnpkg.com/tweetnacl/-/tweetnacl-0.14.5.tgz#5ae68177f192d4456269d108afa93ff8743f4f64"
   integrity sha1-WuaBd/GS1EViadEIr6k/+HQ/T2Q=
 
-type-check@~0.3.2:
-  version "0.3.2"
-  resolved "https://registry.yarnpkg.com/type-check/-/type-check-0.3.2.tgz#5884cab512cf1d355e3fb784f30804b2b520db72"
-  integrity sha1-WITKtRLPHTVeP7eE8wgEsrUg23I=
-  dependencies:
-    prelude-ls "~1.1.2"
-
 type-is@~1.6.16:
   version "1.6.16"
   resolved "https://registry.yarnpkg.com/type-is/-/type-is-1.6.16.tgz#f89ce341541c672b25ee7ae3c73dee3b2be50194"
@@ -16231,7 +15651,7 @@ update-check@1.5.2:
     registry-auth-token "3.3.2"
     registry-url "3.1.0"
 
-update-notifier@^2.3.0, update-notifier@^2.5.0:
+update-notifier@^2.3.0:
   version "2.5.0"
   resolved "https://registry.yarnpkg.com/update-notifier/-/update-notifier-2.5.0.tgz#d0744593e13f161e406acb1d9408b72cad08aff6"
   integrity sha512-gwMdhgJHGuj/+wHJJs9e6PcCszpxR1b236igrOkUofGhqJuG+amlIKwApH1IW1WWl7ovZxsX49lMBWLxSdm5Dw==
@@ -16551,11 +15971,6 @@ vm-browserify@0.0.4:
   dependencies:
     indexof "0.0.1"
 
-vscode-languageserver-types@^3.5.0:
-  version "3.14.0"
-  resolved "https://registry.yarnpkg.com/vscode-languageserver-types/-/vscode-languageserver-types-3.14.0.tgz#d3b5952246d30e5241592b6dde8280e03942e743"
-  integrity sha512-lTmS6AlAlMHOvPQemVwo3CezxBp0sNB95KNPkqp3Nxd5VFEnuG1ByM0zlRWos0zjO3ZWtkvhal0COgiV1xIA4A==
-
 walker@~1.0.5:
   version "1.0.7"
   resolved "https://registry.yarnpkg.com/walker/-/walker-1.0.7.tgz#2f7f9b8fd10d677262b18a884e28d19618e028fb"
@@ -16860,23 +16275,11 @@ window-size@0.1.0:
   resolved "https://registry.yarnpkg.com/window-size/-/window-size-0.1.0.tgz#5438cd2ea93b202efa3a19fe8887aee7c94f9c9d"
   integrity sha1-VDjNLqk7IC76Ohn+iIeu58lPnJ0=
 
-window-size@^0.1.4:
-  version "0.1.4"
-  resolved "https://registry.yarnpkg.com/window-size/-/window-size-0.1.4.tgz#f8e1aa1ee5a53ec5bf151ffa09742a6ad7697876"
-  integrity sha1-+OGqHuWlPsW/FR/6CXQqatdpeHY=
-
 window-size@^0.2.0:
   version "0.2.0"
   resolved "https://registry.yarnpkg.com/window-size/-/window-size-0.2.0.tgz#b4315bb4214a3d7058ebeee892e13fa24d98b075"
   integrity sha1-tDFbtCFKPXBY6+7okuE/ok2YsHU=
 
-windows-release@^3.1.0:
-  version "3.1.0"
-  resolved "https://registry.yarnpkg.com/windows-release/-/windows-release-3.1.0.tgz#8d4a7e266cbf5a233f6c717dac19ce00af36e12e"
-  integrity sha512-hBb7m7acFgQPQc222uEQTmdcGLeBmQLNLFIh0rDk3CwFOBrfjefLzEfEfmpMq8Af/n/GnFf3eYf203FY1PmudA==
-  dependencies:
-    execa "^0.10.0"
-
 wordwrap@0.0.2:
   version "0.0.2"
   resolved "https://registry.yarnpkg.com/wordwrap/-/wordwrap-0.0.2.tgz#b79669bb42ecb409f83d583cad52ca17eaa1643f"
@@ -16887,11 +16290,6 @@ wordwrap@~0.0.2:
   resolved "https://registry.yarnpkg.com/wordwrap/-/wordwrap-0.0.3.tgz#a3d5da6cd5c0bc0008d37234bbaf1bed63059107"
   integrity sha1-o9XabNXAvAAI03I0u68b7WMFkQc=
 
-wordwrap@~1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/wordwrap/-/wordwrap-1.0.0.tgz#27584810891456a4171c8d0226441ade90cbcaeb"
-  integrity sha1-J1hIEIkUVqQXHI0CJkQa3pDLyus=
-
 worker-farm@^1.5.2:
   version "1.6.0"
   resolved "https://registry.yarnpkg.com/worker-farm/-/worker-farm-1.6.0.tgz#aecc405976fab5a95526180846f0dba288f3a4a0"
@@ -16972,7 +16370,7 @@ xml-parse-from-string@^1.0.0:
   resolved "https://registry.yarnpkg.com/xml-parse-from-string/-/xml-parse-from-string-1.0.1.tgz#a9029e929d3dbcded169f3c6e28238d95a5d5a28"
   integrity sha1-qQKekp09vN7RafPG4oI42VpdWig=
 
-xml2js@^0.4.17, xml2js@^0.4.5:
+xml2js@^0.4.5:
   version "0.4.19"
   resolved "https://registry.yarnpkg.com/xml2js/-/xml2js-0.4.19.tgz#686c20f213209e94abf0d1bcf1efaa291c7827a7"
   integrity sha512-esZnJZJOiJR9wWKMyuvSE1y6Dq5LCuJanqhxslH2bxM6duahNZ+HMpCLhBQGZkbX6xRf8x1Y2eJlgt2q3qo49Q==
@@ -16995,17 +16393,12 @@ xmlhttprequest-ssl@~1.5.4:
   resolved "https://registry.yarnpkg.com/xmlhttprequest-ssl/-/xmlhttprequest-ssl-1.5.5.tgz#c2876b06168aadc40e57d97e81191ac8f4398b3e"
   integrity sha1-wodrBhaKrcQOV9l+gRkayPQ5iz4=
 
-xregexp@2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/xregexp/-/xregexp-2.0.0.tgz#52a63e56ca0b84a7f3a5f3d61872f126ad7a5943"
-  integrity sha1-UqY+VsoLhKfzpfPWGHLxJq16WUM=
-
 "xtend@>=4.0.0 <4.1.0-0", xtend@^4.0.0, xtend@^4.0.1, xtend@~4.0.0, xtend@~4.0.1:
   version "4.0.1"
   resolved "https://registry.yarnpkg.com/xtend/-/xtend-4.0.1.tgz#a5c6d532be656e23db820efb943a1f04998d63af"
   integrity sha1-pcbVMr5lbiPbgg77lDofBJmNY68=
 
-y18n@^3.2.0, y18n@^3.2.1:
+y18n@^3.2.1:
   version "3.2.1"
   resolved "https://registry.yarnpkg.com/y18n/-/y18n-3.2.1.tgz#6d15fba884c08679c0d77e88e7759e811e07fa41"
   integrity sha1-bRX7qITAhnnA136I53WegR4H+kE=
@@ -17091,19 +16484,6 @@ yargs@^11.1.0:
     y18n "^3.2.1"
     yargs-parser "^9.0.2"
 
-yargs@^3.19.0:
-  version "3.32.0"
-  resolved "https://registry.yarnpkg.com/yargs/-/yargs-3.32.0.tgz#03088e9ebf9e756b69751611d2a5ef591482c995"
-  integrity sha1-AwiOnr+edWtpdRYR0qXvWRSCyZU=
-  dependencies:
-    camelcase "^2.0.1"
-    cliui "^3.0.3"
-    decamelize "^1.1.1"
-    os-locale "^1.4.0"
-    string-width "^1.0.1"
-    window-size "^0.1.4"
-    y18n "^3.2.0"
-
 yargs@^9.0.0:
   version "9.0.1"
   resolved "https://registry.yarnpkg.com/yargs/-/yargs-9.0.1.tgz#52acc23feecac34042078ee78c0c007f5085db4c"

From bc5f35508ca8f5c1f3e27fc2e1763c6c63a3f2d1 Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Thu, 7 Mar 2019 12:14:05 +0100
Subject: [PATCH 196/249] FIX logo not navigating

---
 docs/src/new-components/layout/Header.js | 13 ++-----------
 1 file changed, 2 insertions(+), 11 deletions(-)

diff --git a/docs/src/new-components/layout/Header.js b/docs/src/new-components/layout/Header.js
index b922fdfebb2..d3833817498 100644
--- a/docs/src/new-components/layout/Header.js
+++ b/docs/src/new-components/layout/Header.js
@@ -8,7 +8,7 @@ import { navLinks } from './PageLayout';
 const { color, typography, spacing, breakpoint } = styles;
 const { metadata, url } = site;
 
-const LogotypeWrapper = styled(Link)`
+const LogotypeWrapper = styled.a`
   display: inline-block;
   img {
     height: 22px;
@@ -20,15 +20,6 @@ const LogotypeWrapper = styled(Link)`
     }
 
     display: block;
-
-    transition: all 150ms ease-out;
-    transform: translate3d(0, 0, 0);
-    &:hover {
-      transform: translate3d(0, -1px, 0);
-    }
-    &:active {
-      transform: translate3d(0, 0, 0);
-    }
   }
 `;
 
@@ -150,7 +141,7 @@ export default function Header({ ...props }) {
       <Nav>
         <NavGroup>
           <NavItem>
-            <LogotypeWrapper isGatsby to="/">
+            <LogotypeWrapper href="/">
               <img src="https://storybook.js.org/images/logos/logo-storybook.svg" alt="Storybook" />
             </LogotypeWrapper>
             <Version href={url.gitHub.releases}>{metadata.latestVersion}</Version>

From 5f3c575a59fde52edf33b4ae1987f59d3a3c9cc5 Mon Sep 17 00:00:00 2001
From: Andrey Rublev <version.ru@gmail.com>
Date: Thu, 7 Mar 2019 15:37:42 +0200
Subject: [PATCH 197/249] Fixed building static in case of absolute output

path.join is unsafe when using absolute paths after first argument.
For resolving from cwd path.resolve function is safe and makes correct results in both cases, using absolute or relative paths.
---
 lib/core/src/server/preview/iframe-webpack.config.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/lib/core/src/server/preview/iframe-webpack.config.js b/lib/core/src/server/preview/iframe-webpack.config.js
index 3cb4ac5e0fd..02e094d195d 100644
--- a/lib/core/src/server/preview/iframe-webpack.config.js
+++ b/lib/core/src/server/preview/iframe-webpack.config.js
@@ -37,7 +37,7 @@ export default ({
     devtool: '#cheap-module-source-map',
     entry: entries,
     output: {
-      path: path.join(process.cwd(), outputDir),
+      path: path.resolve(process.cwd(), outputDir),
       filename: '[name].[hash].bundle.js',
       publicPath: '',
     },

From 8bb4107dca1c6d38c592b8ce054a68d1d3cba180 Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Thu, 7 Mar 2019 21:26:15 +0800
Subject: [PATCH 198/249] Merge pull request #5946 from glitchperfect/patch-3

Bump version number in live examples page
---
 docs/src/pages/basics/live-examples/index.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/docs/src/pages/basics/live-examples/index.md b/docs/src/pages/basics/live-examples/index.md
index 12719a7b0e8..ac96826e0b4 100644
--- a/docs/src/pages/basics/live-examples/index.md
+++ b/docs/src/pages/basics/live-examples/index.md
@@ -3,7 +3,7 @@ id: 'live-examples'
 title: 'Live Examples'
 ---
 
-### 4.0
+### 5.0
 
 - [React Official](https://storybooks-official.netlify.com)
 - [Vue](https://storybooks-vue.netlify.com/)

From c919b89cdc43469cca4a512e248577ee70d87578 Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Thu, 7 Mar 2019 18:41:41 +0800
Subject: [PATCH 199/249] Merge pull request #5944 from Superpencil/patch-3

Theme docs fix
---
 docs/src/pages/configurations/theming/index.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/docs/src/pages/configurations/theming/index.md b/docs/src/pages/configurations/theming/index.md
index 9f3ca42e8aa..6dad5615fbf 100644
--- a/docs/src/pages/configurations/theming/index.md
+++ b/docs/src/pages/configurations/theming/index.md
@@ -96,7 +96,7 @@ export default create({
 Finally, import your theme into `.storybook/config` and add it to your Storybook parameters.
 
 ```
-import {yourTheme} from './yourTheme';
+import yourTheme from './yourTheme';
 
 addParameters({
   options: {

From dd03c290c5398bbaf108a51374a5b8e640e1f815 Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Thu, 7 Mar 2019 12:10:37 +0800
Subject: [PATCH 200/249] Merge pull request #5929 from dfee/patch-3

updated docs to reflect proper params passed to webpack.config.js
---
 .../configurations/typescript-config/index.md  | 18 +++++++++---------
 1 file changed, 9 insertions(+), 9 deletions(-)

diff --git a/docs/src/pages/configurations/typescript-config/index.md b/docs/src/pages/configurations/typescript-config/index.md
index 5ae2a0d7306..d2c5ed00220 100644
--- a/docs/src/pages/configurations/typescript-config/index.md
+++ b/docs/src/pages/configurations/typescript-config/index.md
@@ -30,20 +30,20 @@ module.exports = ({ config, mode }) => {
     test: /\.(ts|tsx)$/,
     use: [
       {
-        loader: require.resolve('awesome-typescript-loader')
+        loader: require.resolve('awesome-typescript-loader'),
       },
       // Optional
       {
-        loader: require.resolve('react-docgen-typescript-loader')
-      }
-    ]
+        loader: require.resolve('react-docgen-typescript-loader'),
+      },
+    ],
   });
   config.resolve.extensions.push('.ts', '.tsx');
   return config;
 };
 ```
 
-The above example shows a working Webpack config with the [TSDocgen plugin](https://github.com/strothj/react-docgen-typescript-loader) integrated.  This plugin is not necessary to use Storybook and the section marked `// optional` can be safely removed if the features of TSDocgen are not required.
+The above example shows a working Webpack config with the [TSDocgen plugin](https://github.com/strothj/react-docgen-typescript-loader) integrated. This plugin is not necessary to use Storybook and the section marked `// optional` can be safely removed if the features of TSDocgen are not required.
 
 ### `tsconfig.json`
 
@@ -100,8 +100,8 @@ module.exports = ({ config, mode }) => {
     test: /\.(ts|tsx)$/,
     loader: require.resolve('babel-loader'),
     options: {
-      presets: [['react-app', { flow: false, typescript: true }]]
-    }
+      presets: [['react-app', { flow: false, typescript: true }]],
+    },
   });
   config.resolve.extensions.push('.ts', '.tsx');
   return config;
@@ -154,8 +154,8 @@ Please refer to the [react-docgen-typescript-loader](https://github.com/strothj/
 Additional annotation can be achieved by setting a default set of info parameters:
 
 ```ts
-import {addDecorator} from "@storybook/react";
-import {withInfo} from "@storybook/addon-info";
+import { addDecorator } from '@storybook/react';
+import { withInfo } from '@storybook/addon-info';
 
 // Globally in your .storybook/config.js, or alternatively, per-chapter
 addDecorator(

From 7a74d8d0596d839aec3be692b46ab4fae902b26f Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Thu, 7 Mar 2019 11:55:37 +0800
Subject: [PATCH 201/249] Merge pull request #5920 from designergulshan/patch-3

A copy change
---
 docs/src/pages/basics/introduction/index.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/docs/src/pages/basics/introduction/index.md b/docs/src/pages/basics/introduction/index.md
index 8d2357c66af..81501a9139d 100644
--- a/docs/src/pages/basics/introduction/index.md
+++ b/docs/src/pages/basics/introduction/index.md
@@ -4,7 +4,7 @@ title: 'Introduction'
 ---
 
 Storybook is a user interface development environment and playground for UI components.
-The tool enables users to create components independently and showcase components interactively in an isolated development environment.
+The tool enables developers to create components independently and showcase components interactively in an isolated development environment.
 
 Storybook runs outside of the main app so users can develop UI components in isolation without worrying about app specific dependencies and requirements.
 

From d3cf78abb98a9dc8c07d71830cfb5ea338e22450 Mon Sep 17 00:00:00 2001
From: Michael Shilman <shilman@users.noreply.github.com>
Date: Fri, 1 Mar 2019 13:51:20 +0800
Subject: [PATCH 202/249] Merge pull request #5808 from roalonso/patch-3

Update README.md
---
 README.md | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/README.md b/README.md
index ee4bcde07ca..76fdb7d27a1 100644
--- a/README.md
+++ b/README.md
@@ -153,9 +153,9 @@ We welcome contributions to Storybook!
 
 - 📥 Pull requests and 🌟 Stars are always welcome.
 - Read our [contributing guide](CONTRIBUTING.md) to get started.
-  or find us on [Discord](https://discord.gg/sMFvFsG), we're will take the time to guide you 
+  or find us on [Discord](https://discord.gg/sMFvFsG), we're will take the time to guide you
 
-Looking for a first issue to tackle? 
+Looking for a first issue to tackle?
 
 - We tag issues with [![Good First Issue](https://img.shields.io/github/issues/storybooks/storybook/good%20first%20issue.svg)](https://github.com/storybooks/storybook/issues?q=is%3Aopen+is%3Aissue+label%3A%22good+first+issue%22) when we think they are well suited for people who are new to the codebase or OSS in general.
 - [Talk to us](https://discord.gg/sMFvFsG), we'll find something to suits your skills and learning interest.

From 4a2243ce34a449d35d1cb11355a2df9f945ef7fd Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Thu, 7 Mar 2019 22:00:53 +0800
Subject: [PATCH 203/249] 5.1.0-alpha.1 changelog

---
 CHANGELOG.md | 13 +++++++++++++
 1 file changed, 13 insertions(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index bd41469f381..bec1a75a7e2 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,16 @@
+## 5.1.0-alpha.1 (March 7, 2019)
+
+### Bug Fixes
+
+* CLI: Fix missing iframe.html in absolute path output directory ([#5947](https://github.com/storybooks/storybook/pull/5947))
+* Addon-knobs: Added debouncing between keystrokes to speed up component rendering ([#5811](https://github.com/storybooks/storybook/pull/5811))
+* UI: Fix search in production mode ([#5909](https://github.com/storybooks/storybook/pull/5909))
+
+### Maintenance
+
+* ADD delay to rendering the acceptance stories ([#5943](https://github.com/storybooks/storybook/pull/5943))
+* Split versions.json into two files ([#5896](https://github.com/storybooks/storybook/pull/5896))
+
 ## 5.1.0-alpha.0 (March 6, 2019)
 
 ### Features

From ed9b342742fadd5005f84bec846c0537bc13b4d5 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Thu, 7 Mar 2019 22:13:18 +0800
Subject: [PATCH 204/249] v5.1.0-alpha.1

---
 addons/a11y/package.json                      | 12 ++---
 addons/actions/package.json                   | 10 ++--
 addons/backgrounds/package.json               | 12 ++---
 addons/centered/package.json                  |  2 +-
 addons/cssresources/package.json              |  8 +--
 addons/events/package.json                    |  8 +--
 addons/google-analytics/package.json          |  6 +--
 addons/graphql/package.json                   |  2 +-
 addons/info/package.json                      | 10 ++--
 addons/jest/package.json                      | 10 ++--
 addons/knobs/package.json                     | 10 ++--
 addons/links/package.json                     |  6 +--
 addons/notes/package.json                     | 12 ++---
 addons/ondevice-backgrounds/package.json      |  4 +-
 addons/ondevice-knobs/package.json            |  4 +-
 addons/ondevice-notes/package.json            |  4 +-
 addons/options/package.json                   |  4 +-
 .../storyshots/storyshots-core/package.json   |  4 +-
 .../storyshots-puppeteer/package.json         |  6 +--
 addons/storysource/package.json               | 10 ++--
 addons/viewport/package.json                  | 12 ++---
 app/angular/package.json                      |  6 +--
 app/ember/package.json                        |  4 +-
 app/html/package.json                         |  4 +-
 app/marko/package.json                        |  4 +-
 app/mithril/package.json                      |  4 +-
 app/polymer/package.json                      |  4 +-
 app/preact/package.json                       |  4 +-
 app/react-native/package.json                 | 14 ++---
 app/react/package.json                        |  6 +--
 app/riot/package.json                         |  4 +-
 app/svelte/package.json                       |  4 +-
 app/vue/package.json                          |  4 +-
 examples/angular-cli/package.json             | 26 ++++-----
 examples/cra-kitchen-sink/package.json        | 32 +++++------
 examples/cra-ts-kitchen-sink/package.json     | 12 ++---
 examples/ember-cli/package.json               | 26 ++++-----
 examples/html-kitchen-sink/package.json       | 36 ++++++-------
 examples/marko-cli/package.json               | 14 ++---
 examples/mithril-kitchen-sink/package.json    | 26 ++++-----
 examples/official-storybook/package.json      | 48 ++++++++---------
 examples/polymer-cli/package.json             | 20 +++----
 examples/preact-kitchen-sink/package.json     | 26 ++++-----
 examples/riot-kitchen-sink/package.json       | 26 ++++-----
 examples/svelte-kitchen-sink/package.json     | 26 ++++-----
 examples/vue-kitchen-sink/package.json        | 26 ++++-----
 lerna.json                                    |  2 +-
 lib/addons/package.json                       |  6 +--
 lib/channel-postmessage/package.json          |  6 +--
 lib/channel-websocket/package.json            |  4 +-
 lib/channels/package.json                     |  2 +-
 lib/cli/package.json                          | 54 +++++++++----------
 lib/client-api/package.json                   | 10 ++--
 lib/client-logger/package.json                |  2 +-
 lib/codemod/package.json                      |  2 +-
 lib/components/package.json                   | 12 ++---
 lib/core-events/package.json                  |  2 +-
 lib/core/package.json                         | 18 +++----
 lib/node-logger/package.json                  |  2 +-
 lib/router/package.json                       |  4 +-
 lib/theming/package.json                      |  4 +-
 lib/ui/package.json                           | 14 ++---
 62 files changed, 353 insertions(+), 353 deletions(-)

diff --git a/addons/a11y/package.json b/addons/a11y/package.json
index 281923dcf15..1c4009ef112 100644
--- a/addons/a11y/package.json
+++ b/addons/a11y/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-a11y",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "a11y addon for storybook",
   "keywords": [
     "a11y",
@@ -26,11 +26,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.0",
-    "@storybook/client-logger": "5.1.0-alpha.0",
-    "@storybook/components": "5.1.0-alpha.0",
-    "@storybook/core-events": "5.1.0-alpha.0",
-    "@storybook/theming": "5.1.0-alpha.0",
+    "@storybook/addons": "5.1.0-alpha.1",
+    "@storybook/client-logger": "5.1.0-alpha.1",
+    "@storybook/components": "5.1.0-alpha.1",
+    "@storybook/core-events": "5.1.0-alpha.1",
+    "@storybook/theming": "5.1.0-alpha.1",
     "axe-core": "^3.1.2",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
diff --git a/addons/actions/package.json b/addons/actions/package.json
index 94538cca176..0142077374e 100644
--- a/addons/actions/package.json
+++ b/addons/actions/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-actions",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "Action Logger addon for storybook",
   "keywords": [
     "storybook"
@@ -21,10 +21,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.0",
-    "@storybook/components": "5.1.0-alpha.0",
-    "@storybook/core-events": "5.1.0-alpha.0",
-    "@storybook/theming": "5.1.0-alpha.0",
+    "@storybook/addons": "5.1.0-alpha.1",
+    "@storybook/components": "5.1.0-alpha.1",
+    "@storybook/core-events": "5.1.0-alpha.1",
+    "@storybook/theming": "5.1.0-alpha.1",
     "core-js": "^2.6.5",
     "fast-deep-equal": "^2.0.1",
     "global": "^4.3.2",
diff --git a/addons/backgrounds/package.json b/addons/backgrounds/package.json
index 5c537447b0f..737a6205a91 100644
--- a/addons/backgrounds/package.json
+++ b/addons/backgrounds/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-backgrounds",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "A storybook addon to show different backgrounds for your preview",
   "keywords": [
     "addon",
@@ -25,11 +25,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.0",
-    "@storybook/client-logger": "5.1.0-alpha.0",
-    "@storybook/components": "5.1.0-alpha.0",
-    "@storybook/core-events": "5.1.0-alpha.0",
-    "@storybook/theming": "5.1.0-alpha.0",
+    "@storybook/addons": "5.1.0-alpha.1",
+    "@storybook/client-logger": "5.1.0-alpha.1",
+    "@storybook/components": "5.1.0-alpha.1",
+    "@storybook/core-events": "5.1.0-alpha.1",
+    "@storybook/theming": "5.1.0-alpha.1",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
diff --git a/addons/centered/package.json b/addons/centered/package.json
index 6783e870d39..0ce8fdef501 100644
--- a/addons/centered/package.json
+++ b/addons/centered/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-centered",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "Storybook decorator to center components",
   "keywords": [
     "addon",
diff --git a/addons/cssresources/package.json b/addons/cssresources/package.json
index 2ddd3a9264b..3e4db52c09e 100644
--- a/addons/cssresources/package.json
+++ b/addons/cssresources/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-cssresources",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "A storybook addon to switch between css resources at runtime for your story",
   "keywords": [
     "addon",
@@ -25,9 +25,9 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.0",
-    "@storybook/components": "5.1.0-alpha.0",
-    "@storybook/core-events": "5.1.0-alpha.0",
+    "@storybook/addons": "5.1.0-alpha.1",
+    "@storybook/components": "5.1.0-alpha.1",
+    "@storybook/core-events": "5.1.0-alpha.1",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "react": "^16.8.3"
diff --git a/addons/events/package.json b/addons/events/package.json
index dd04ba69f99..4a3b534d6a2 100644
--- a/addons/events/package.json
+++ b/addons/events/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-events",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "Add events to your Storybook stories.",
   "keywords": [
     "addon",
@@ -24,9 +24,9 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.0",
-    "@storybook/core-events": "5.1.0-alpha.0",
-    "@storybook/theming": "5.1.0-alpha.0",
+    "@storybook/addons": "5.1.0-alpha.1",
+    "@storybook/core-events": "5.1.0-alpha.1",
+    "@storybook/theming": "5.1.0-alpha.1",
     "core-js": "^2.6.5",
     "format-json": "^1.0.3",
     "prop-types": "^15.7.2",
diff --git a/addons/google-analytics/package.json b/addons/google-analytics/package.json
index 3e474ab3e68..2ab75ef2e58 100644
--- a/addons/google-analytics/package.json
+++ b/addons/google-analytics/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-google-analytics",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "Storybook addon for google analytics",
   "keywords": [
     "addon",
@@ -20,8 +20,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.0",
-    "@storybook/core-events": "5.1.0-alpha.0",
+    "@storybook/addons": "5.1.0-alpha.1",
+    "@storybook/core-events": "5.1.0-alpha.1",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "react-ga": "^2.5.7"
diff --git a/addons/graphql/package.json b/addons/graphql/package.json
index a2e89eb65c4..d7ec4382fd4 100644
--- a/addons/graphql/package.json
+++ b/addons/graphql/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-graphql",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "Storybook addon to display the GraphiQL IDE",
   "keywords": [
     "addon",
diff --git a/addons/info/package.json b/addons/info/package.json
index 07a2fd70578..5c59e12dbbf 100644
--- a/addons/info/package.json
+++ b/addons/info/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-info",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "A Storybook addon to show additional information for your stories.",
   "keywords": [
     "addon",
@@ -22,10 +22,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.0",
-    "@storybook/client-logger": "5.1.0-alpha.0",
-    "@storybook/components": "5.1.0-alpha.0",
-    "@storybook/theming": "5.1.0-alpha.0",
+    "@storybook/addons": "5.1.0-alpha.1",
+    "@storybook/client-logger": "5.1.0-alpha.1",
+    "@storybook/components": "5.1.0-alpha.1",
+    "@storybook/theming": "5.1.0-alpha.1",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "marksy": "^6.1.0",
diff --git a/addons/jest/package.json b/addons/jest/package.json
index 7c4df30d220..63ae40c6622 100644
--- a/addons/jest/package.json
+++ b/addons/jest/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-jest",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "React storybook addon that show component jest report",
   "keywords": [
     "addon",
@@ -28,10 +28,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.0",
-    "@storybook/components": "5.1.0-alpha.0",
-    "@storybook/core-events": "5.1.0-alpha.0",
-    "@storybook/theming": "5.1.0-alpha.0",
+    "@storybook/addons": "5.1.0-alpha.1",
+    "@storybook/components": "5.1.0-alpha.1",
+    "@storybook/core-events": "5.1.0-alpha.1",
+    "@storybook/theming": "5.1.0-alpha.1",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "prop-types": "^15.7.2",
diff --git a/addons/knobs/package.json b/addons/knobs/package.json
index f65c1dace06..5575ee335aa 100644
--- a/addons/knobs/package.json
+++ b/addons/knobs/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-knobs",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "Storybook Addon Prop Editor Component",
   "keywords": [
     "addon",
@@ -22,10 +22,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.0",
-    "@storybook/components": "5.1.0-alpha.0",
-    "@storybook/core-events": "5.1.0-alpha.0",
-    "@storybook/theming": "5.1.0-alpha.0",
+    "@storybook/addons": "5.1.0-alpha.1",
+    "@storybook/components": "5.1.0-alpha.1",
+    "@storybook/core-events": "5.1.0-alpha.1",
+    "@storybook/theming": "5.1.0-alpha.1",
     "copy-to-clipboard": "^3.0.8",
     "core-js": "^2.6.5",
     "escape-html": "^1.0.3",
diff --git a/addons/links/package.json b/addons/links/package.json
index 952274e1b54..11333003bb4 100644
--- a/addons/links/package.json
+++ b/addons/links/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-links",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "Story Links addon for storybook",
   "keywords": [
     "addon",
@@ -22,8 +22,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.0",
-    "@storybook/core-events": "5.1.0-alpha.0",
+    "@storybook/addons": "5.1.0-alpha.1",
+    "@storybook/core-events": "5.1.0-alpha.1",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
diff --git a/addons/notes/package.json b/addons/notes/package.json
index 550d71b4a34..edae8fc4d50 100644
--- a/addons/notes/package.json
+++ b/addons/notes/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-notes",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "Write notes for your Storybook stories.",
   "keywords": [
     "addon",
@@ -23,11 +23,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.0",
-    "@storybook/client-logger": "5.1.0-alpha.0",
-    "@storybook/components": "5.1.0-alpha.0",
-    "@storybook/core-events": "5.1.0-alpha.0",
-    "@storybook/theming": "5.1.0-alpha.0",
+    "@storybook/addons": "5.1.0-alpha.1",
+    "@storybook/client-logger": "5.1.0-alpha.1",
+    "@storybook/components": "5.1.0-alpha.1",
+    "@storybook/core-events": "5.1.0-alpha.1",
+    "@storybook/theming": "5.1.0-alpha.1",
     "markdown-to-jsx": "^6.9.1",
     "prop-types": "^15.7.2",
     "util-deprecate": "^1.0.2"
diff --git a/addons/ondevice-backgrounds/package.json b/addons/ondevice-backgrounds/package.json
index 438cedc167b..bc88c42d207 100644
--- a/addons/ondevice-backgrounds/package.json
+++ b/addons/ondevice-backgrounds/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/addon-ondevice-backgrounds",
   "private": true,
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "A storybook addon to show different backgrounds for your preview",
   "keywords": [
     "addon",
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.0",
+    "@storybook/addons": "5.1.0-alpha.1",
     "core-js": "^2.6.5",
     "prop-types": "^15.7.2"
   },
diff --git a/addons/ondevice-knobs/package.json b/addons/ondevice-knobs/package.json
index ebc72423fdd..eb5098fbae0 100644
--- a/addons/ondevice-knobs/package.json
+++ b/addons/ondevice-knobs/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/addon-ondevice-knobs",
   "private": true,
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "Display storybook story knobs on your deviced.",
   "keywords": [
     "addon",
@@ -22,7 +22,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.0",
+    "@storybook/addons": "5.1.0-alpha.1",
     "core-js": "^2.6.5",
     "deep-equal": "^1.0.1",
     "prop-types": "^15.7.2",
diff --git a/addons/ondevice-notes/package.json b/addons/ondevice-notes/package.json
index 4ee410b9c18..8088a24e994 100644
--- a/addons/ondevice-notes/package.json
+++ b/addons/ondevice-notes/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/addon-ondevice-notes",
   "private": true,
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "Write notes for your Storybook stories.",
   "keywords": [
     "addon",
@@ -20,7 +20,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.0",
+    "@storybook/addons": "5.1.0-alpha.1",
     "core-js": "^2.6.5",
     "prop-types": "^15.7.2",
     "react-native-simple-markdown": "^1.1.0"
diff --git a/addons/options/package.json b/addons/options/package.json
index c4a610cd6e8..d143f4ee1a0 100644
--- a/addons/options/package.json
+++ b/addons/options/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-options",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "Options addon for storybook",
   "keywords": [
     "addon",
@@ -21,7 +21,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.0",
+    "@storybook/addons": "5.1.0-alpha.1",
     "core-js": "^2.6.5",
     "util-deprecate": "^1.0.2"
   },
diff --git a/addons/storyshots/storyshots-core/package.json b/addons/storyshots/storyshots-core/package.json
index 1cce8ecf0b7..b299f359f5c 100644
--- a/addons/storyshots/storyshots-core/package.json
+++ b/addons/storyshots/storyshots-core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storyshots",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "StoryShots is a Jest Snapshot Testing Addon for Storybook.",
   "keywords": [
     "addon",
@@ -25,7 +25,7 @@
     "storybook": "start-storybook -p 6006"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.0",
+    "@storybook/addons": "5.1.0-alpha.1",
     "core-js": "^2.6.5",
     "glob": "^7.1.3",
     "global": "^4.3.2",
diff --git a/addons/storyshots/storyshots-puppeteer/package.json b/addons/storyshots/storyshots-puppeteer/package.json
index f7acc97174e..04afe0bd010 100644
--- a/addons/storyshots/storyshots-puppeteer/package.json
+++ b/addons/storyshots/storyshots-puppeteer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storyshots-puppeteer",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "Image snappshots addition to StoryShots base on puppeteer",
   "keywords": [
     "addon",
@@ -22,8 +22,8 @@
     "prepare": "node ../../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/node-logger": "5.1.0-alpha.0",
-    "@storybook/router": "5.1.0-alpha.0",
+    "@storybook/node-logger": "5.1.0-alpha.1",
+    "@storybook/router": "5.1.0-alpha.1",
     "core-js": "^2.6.5",
     "jest-image-snapshot": "^2.8.1",
     "puppeteer": "^1.12.2",
diff --git a/addons/storysource/package.json b/addons/storysource/package.json
index 83b629c4d30..6734a8ef7e4 100644
--- a/addons/storysource/package.json
+++ b/addons/storysource/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storysource",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "Stories addon for storybook",
   "keywords": [
     "addon",
@@ -22,10 +22,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.0",
-    "@storybook/components": "5.1.0-alpha.0",
-    "@storybook/router": "5.1.0-alpha.0",
-    "@storybook/theming": "5.1.0-alpha.0",
+    "@storybook/addons": "5.1.0-alpha.1",
+    "@storybook/components": "5.1.0-alpha.1",
+    "@storybook/router": "5.1.0-alpha.1",
+    "@storybook/theming": "5.1.0-alpha.1",
     "core-js": "^2.6.5",
     "estraverse": "^4.2.0",
     "loader-utils": "^1.2.3",
diff --git a/addons/viewport/package.json b/addons/viewport/package.json
index 4f57c9d0a14..605cc051c33 100644
--- a/addons/viewport/package.json
+++ b/addons/viewport/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-viewport",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "Storybook addon to change the viewport size to mobile",
   "keywords": [
     "addon",
@@ -21,11 +21,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.0",
-    "@storybook/client-logger": "5.1.0-alpha.0",
-    "@storybook/components": "5.1.0-alpha.0",
-    "@storybook/core-events": "5.1.0-alpha.0",
-    "@storybook/theming": "5.1.0-alpha.0",
+    "@storybook/addons": "5.1.0-alpha.1",
+    "@storybook/client-logger": "5.1.0-alpha.1",
+    "@storybook/components": "5.1.0-alpha.1",
+    "@storybook/core-events": "5.1.0-alpha.1",
+    "@storybook/theming": "5.1.0-alpha.1",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
diff --git a/app/angular/package.json b/app/angular/package.json
index 1d3d3fdfb86..4bf6fc65d80 100644
--- a/app/angular/package.json
+++ b/app/angular/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/angular",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "Storybook for Angular: Develop Angular Components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -26,8 +26,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.1.0-alpha.0",
-    "@storybook/node-logger": "5.1.0-alpha.0",
+    "@storybook/core": "5.1.0-alpha.1",
+    "@storybook/node-logger": "5.1.0-alpha.1",
     "angular2-template-loader": "^0.6.2",
     "core-js": "^2.6.5",
     "fork-ts-checker-webpack-plugin": "^0.5.2",
diff --git a/app/ember/package.json b/app/ember/package.json
index 1854465d4f8..d518dd5e7c6 100644
--- a/app/ember/package.json
+++ b/app/ember/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/ember",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "Storybook for Ember: Develop Ember Component in isolation with Hot Reloading.",
   "homepage": "https://github.com/storybooks/storybook/tree/master/app/ember",
   "bugs": {
@@ -24,7 +24,7 @@
   },
   "dependencies": {
     "@ember/test-helpers": "^1.5.0",
-    "@storybook/core": "5.1.0-alpha.0",
+    "@storybook/core": "5.1.0-alpha.1",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
diff --git a/app/html/package.json b/app/html/package.json
index 4d9f2bea948..499de62dd89 100644
--- a/app/html/package.json
+++ b/app/html/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/html",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "Storybook for HTML: View HTML snippets in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.1.0-alpha.0",
+    "@storybook/core": "5.1.0-alpha.1",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
diff --git a/app/marko/package.json b/app/marko/package.json
index 2f3b7f977f3..f716b8b9ea5 100644
--- a/app/marko/package.json
+++ b/app/marko/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/marko",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "Storybook for Marko: Develop Marko Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -26,7 +26,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.1.0-alpha.0",
+    "@storybook/core": "5.1.0-alpha.1",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
diff --git a/app/mithril/package.json b/app/mithril/package.json
index 0a4bb202664..18d6ee5a2fe 100644
--- a/app/mithril/package.json
+++ b/app/mithril/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/mithril",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "Storybook for Mithril: Develop Mithril Component in isolation.",
   "keywords": [
     "storybook"
@@ -27,7 +27,7 @@
   },
   "dependencies": {
     "@babel/plugin-transform-react-jsx": "^7.3.0",
-    "@storybook/core": "5.1.0-alpha.0",
+    "@storybook/core": "5.1.0-alpha.1",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
diff --git a/app/polymer/package.json b/app/polymer/package.json
index 90ad3b0e3e7..fa59d996ecd 100644
--- a/app/polymer/package.json
+++ b/app/polymer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/polymer",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "Storybook for Polymer: Develop Polymer components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.1.0-alpha.0",
+    "@storybook/core": "5.1.0-alpha.1",
     "@webcomponents/webcomponentsjs": "^1.2.0",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
diff --git a/app/preact/package.json b/app/preact/package.json
index b406eb71518..eb9fe09554a 100644
--- a/app/preact/package.json
+++ b/app/preact/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/preact",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "Storybook for Preact: Develop Preact Component in isolation.",
   "keywords": [
     "storybook"
@@ -27,7 +27,7 @@
   },
   "dependencies": {
     "@babel/plugin-transform-react-jsx": "^7.3.0",
-    "@storybook/core": "5.1.0-alpha.0",
+    "@storybook/core": "5.1.0-alpha.1",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
diff --git a/app/react-native/package.json b/app/react-native/package.json
index 15ef8356558..0135f541769 100644
--- a/app/react-native/package.json
+++ b/app/react-native/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/react-native",
   "private": true,
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "A better way to develop React Native Components for your app",
   "keywords": [
     "react",
@@ -27,12 +27,12 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.0",
-    "@storybook/channel-websocket": "5.1.0-alpha.0",
-    "@storybook/channels": "5.1.0-alpha.0",
-    "@storybook/core": "5.1.0-alpha.0",
-    "@storybook/core-events": "5.1.0-alpha.0",
-    "@storybook/ui": "5.1.0-alpha.0",
+    "@storybook/addons": "5.1.0-alpha.1",
+    "@storybook/channel-websocket": "5.1.0-alpha.1",
+    "@storybook/channels": "5.1.0-alpha.1",
+    "@storybook/core": "5.1.0-alpha.1",
+    "@storybook/core-events": "5.1.0-alpha.1",
+    "@storybook/ui": "5.1.0-alpha.1",
     "babel-loader": "^8.0.4",
     "babel-plugin-macros": "^2.4.5",
     "babel-plugin-syntax-async-functions": "^6.13.0",
diff --git a/app/react/package.json b/app/react/package.json
index 514c1f5bbc4..45bcd28b390 100644
--- a/app/react/package.json
+++ b/app/react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/react",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "Storybook for React: Develop React Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -29,8 +29,8 @@
     "@babel/plugin-transform-react-constant-elements": "^7.2.0",
     "@babel/preset-flow": "^7.0.0",
     "@babel/preset-react": "^7.0.0",
-    "@storybook/core": "5.1.0-alpha.0",
-    "@storybook/node-logger": "5.1.0-alpha.0",
+    "@storybook/core": "5.1.0-alpha.1",
+    "@storybook/node-logger": "5.1.0-alpha.1",
     "@svgr/webpack": "^4.0.3",
     "babel-plugin-named-asset-import": "^0.3.1",
     "babel-plugin-react-docgen": "^2.0.2",
diff --git a/app/riot/package.json b/app/riot/package.json
index 45474c02f14..dee44309719 100644
--- a/app/riot/package.json
+++ b/app/riot/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/riot",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "Storybook for riot.js: View riot snippets in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.1.0-alpha.0",
+    "@storybook/core": "5.1.0-alpha.1",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
diff --git a/app/svelte/package.json b/app/svelte/package.json
index 94e90459235..5d4cee2d251 100644
--- a/app/svelte/package.json
+++ b/app/svelte/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/svelte",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "Storybook for Svelte: Develop Svelte Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -26,7 +26,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.1.0-alpha.0",
+    "@storybook/core": "5.1.0-alpha.1",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
diff --git a/app/vue/package.json b/app/vue/package.json
index eaf326a10d9..035744ca450 100644
--- a/app/vue/package.json
+++ b/app/vue/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/vue",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "Storybook for Vue: Develop Vue Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -26,7 +26,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.1.0-alpha.0",
+    "@storybook/core": "5.1.0-alpha.1",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
diff --git a/examples/angular-cli/package.json b/examples/angular-cli/package.json
index 772c9b80ef5..1ced699391d 100644
--- a/examples/angular-cli/package.json
+++ b/examples/angular-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "angular-cli",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "private": true,
   "license": "MIT",
   "scripts": {
@@ -34,18 +34,18 @@
     "@angular-devkit/build-angular": "^0.13.4",
     "@angular/cli": "^7.3.3",
     "@angular/compiler-cli": "^7.2.6",
-    "@storybook/addon-actions": "5.1.0-alpha.0",
-    "@storybook/addon-backgrounds": "5.1.0-alpha.0",
-    "@storybook/addon-centered": "5.1.0-alpha.0",
-    "@storybook/addon-jest": "5.1.0-alpha.0",
-    "@storybook/addon-knobs": "5.1.0-alpha.0",
-    "@storybook/addon-links": "5.1.0-alpha.0",
-    "@storybook/addon-notes": "5.1.0-alpha.0",
-    "@storybook/addon-options": "5.1.0-alpha.0",
-    "@storybook/addon-storyshots": "5.1.0-alpha.0",
-    "@storybook/addon-storysource": "5.1.0-alpha.0",
-    "@storybook/addons": "5.1.0-alpha.0",
-    "@storybook/angular": "5.1.0-alpha.0",
+    "@storybook/addon-actions": "5.1.0-alpha.1",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.1",
+    "@storybook/addon-centered": "5.1.0-alpha.1",
+    "@storybook/addon-jest": "5.1.0-alpha.1",
+    "@storybook/addon-knobs": "5.1.0-alpha.1",
+    "@storybook/addon-links": "5.1.0-alpha.1",
+    "@storybook/addon-notes": "5.1.0-alpha.1",
+    "@storybook/addon-options": "5.1.0-alpha.1",
+    "@storybook/addon-storyshots": "5.1.0-alpha.1",
+    "@storybook/addon-storysource": "5.1.0-alpha.1",
+    "@storybook/addons": "5.1.0-alpha.1",
+    "@storybook/angular": "5.1.0-alpha.1",
     "@types/core-js": "^2.5.0",
     "@types/jest": "^24.0.6",
     "@types/node": "~11.9.5",
diff --git a/examples/cra-kitchen-sink/package.json b/examples/cra-kitchen-sink/package.json
index e9c21851907..a52dc0e3abe 100644
--- a/examples/cra-kitchen-sink/package.json
+++ b/examples/cra-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "cra-kitchen-sink",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -19,21 +19,21 @@
     "react-lifecycles-compat": "^3.0.4"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.1.0-alpha.0",
-    "@storybook/addon-actions": "5.1.0-alpha.0",
-    "@storybook/addon-backgrounds": "5.1.0-alpha.0",
-    "@storybook/addon-centered": "5.1.0-alpha.0",
-    "@storybook/addon-events": "5.1.0-alpha.0",
-    "@storybook/addon-info": "5.1.0-alpha.0",
-    "@storybook/addon-jest": "5.1.0-alpha.0",
-    "@storybook/addon-knobs": "5.1.0-alpha.0",
-    "@storybook/addon-links": "5.1.0-alpha.0",
-    "@storybook/addon-notes": "5.1.0-alpha.0",
-    "@storybook/addon-options": "5.1.0-alpha.0",
-    "@storybook/addon-storyshots": "5.1.0-alpha.0",
-    "@storybook/addons": "5.1.0-alpha.0",
-    "@storybook/client-logger": "5.1.0-alpha.0",
-    "@storybook/react": "5.1.0-alpha.0",
+    "@storybook/addon-a11y": "5.1.0-alpha.1",
+    "@storybook/addon-actions": "5.1.0-alpha.1",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.1",
+    "@storybook/addon-centered": "5.1.0-alpha.1",
+    "@storybook/addon-events": "5.1.0-alpha.1",
+    "@storybook/addon-info": "5.1.0-alpha.1",
+    "@storybook/addon-jest": "5.1.0-alpha.1",
+    "@storybook/addon-knobs": "5.1.0-alpha.1",
+    "@storybook/addon-links": "5.1.0-alpha.1",
+    "@storybook/addon-notes": "5.1.0-alpha.1",
+    "@storybook/addon-options": "5.1.0-alpha.1",
+    "@storybook/addon-storyshots": "5.1.0-alpha.1",
+    "@storybook/addons": "5.1.0-alpha.1",
+    "@storybook/client-logger": "5.1.0-alpha.1",
+    "@storybook/react": "5.1.0-alpha.1",
     "enzyme": "^3.9.0",
     "enzyme-adapter-react-16": "^1.9.1",
     "enzyme-to-json": "^3.3.5",
diff --git a/examples/cra-ts-kitchen-sink/package.json b/examples/cra-ts-kitchen-sink/package.json
index cab16a24aa3..0f7995dba53 100644
--- a/examples/cra-ts-kitchen-sink/package.json
+++ b/examples/cra-ts-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "cra-ts-kitchen-sink",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -20,11 +20,11 @@
     "react-dom": "^16.8.3"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.1.0-alpha.0",
-    "@storybook/addon-info": "5.1.0-alpha.0",
-    "@storybook/addon-options": "5.1.0-alpha.0",
-    "@storybook/addons": "5.1.0-alpha.0",
-    "@storybook/react": "5.1.0-alpha.0",
+    "@storybook/addon-actions": "5.1.0-alpha.1",
+    "@storybook/addon-info": "5.1.0-alpha.1",
+    "@storybook/addon-options": "5.1.0-alpha.1",
+    "@storybook/addons": "5.1.0-alpha.1",
+    "@storybook/react": "5.1.0-alpha.1",
     "@types/enzyme": "^3.9.0",
     "@types/react": "^16.8.4",
     "@types/react-dom": "^16.8.2",
diff --git a/examples/ember-cli/package.json b/examples/ember-cli/package.json
index 980c56c1ea5..06ad0d4b6d1 100644
--- a/examples/ember-cli/package.json
+++ b/examples/ember-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "ember-example",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -15,18 +15,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.3.4",
-    "@storybook/addon-a11y": "5.1.0-alpha.0",
-    "@storybook/addon-actions": "5.1.0-alpha.0",
-    "@storybook/addon-backgrounds": "5.1.0-alpha.0",
-    "@storybook/addon-centered": "5.1.0-alpha.0",
-    "@storybook/addon-knobs": "5.1.0-alpha.0",
-    "@storybook/addon-links": "5.1.0-alpha.0",
-    "@storybook/addon-notes": "5.1.0-alpha.0",
-    "@storybook/addon-options": "5.1.0-alpha.0",
-    "@storybook/addon-storysource": "5.1.0-alpha.0",
-    "@storybook/addon-viewport": "5.1.0-alpha.0",
-    "@storybook/addons": "5.1.0-alpha.0",
-    "@storybook/ember": "5.1.0-alpha.0",
+    "@storybook/addon-a11y": "5.1.0-alpha.1",
+    "@storybook/addon-actions": "5.1.0-alpha.1",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.1",
+    "@storybook/addon-centered": "5.1.0-alpha.1",
+    "@storybook/addon-knobs": "5.1.0-alpha.1",
+    "@storybook/addon-links": "5.1.0-alpha.1",
+    "@storybook/addon-notes": "5.1.0-alpha.1",
+    "@storybook/addon-options": "5.1.0-alpha.1",
+    "@storybook/addon-storysource": "5.1.0-alpha.1",
+    "@storybook/addon-viewport": "5.1.0-alpha.1",
+    "@storybook/addons": "5.1.0-alpha.1",
+    "@storybook/ember": "5.1.0-alpha.1",
     "babel-loader": "^8",
     "broccoli-asset-rev": "^3.0.0",
     "cross-env": "^5.2.0",
diff --git a/examples/html-kitchen-sink/package.json b/examples/html-kitchen-sink/package.json
index 9e877878797..601b2a0901b 100644
--- a/examples/html-kitchen-sink/package.json
+++ b/examples/html-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "html-kitchen-sink",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "private": true,
   "description": "",
   "keywords": [],
@@ -14,23 +14,23 @@
     "storybook": "start-storybook -p 9006"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.1.0-alpha.0",
-    "@storybook/addon-actions": "5.1.0-alpha.0",
-    "@storybook/addon-backgrounds": "5.1.0-alpha.0",
-    "@storybook/addon-centered": "5.1.0-alpha.0",
-    "@storybook/addon-events": "5.1.0-alpha.0",
-    "@storybook/addon-jest": "5.1.0-alpha.0",
-    "@storybook/addon-knobs": "5.1.0-alpha.0",
-    "@storybook/addon-links": "5.1.0-alpha.0",
-    "@storybook/addon-notes": "5.1.0-alpha.0",
-    "@storybook/addon-options": "5.1.0-alpha.0",
-    "@storybook/addon-storyshots": "5.1.0-alpha.0",
-    "@storybook/addon-storysource": "5.1.0-alpha.0",
-    "@storybook/addon-viewport": "5.1.0-alpha.0",
-    "@storybook/addons": "5.1.0-alpha.0",
-    "@storybook/core": "5.1.0-alpha.0",
-    "@storybook/core-events": "5.1.0-alpha.0",
-    "@storybook/html": "5.1.0-alpha.0",
+    "@storybook/addon-a11y": "5.1.0-alpha.1",
+    "@storybook/addon-actions": "5.1.0-alpha.1",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.1",
+    "@storybook/addon-centered": "5.1.0-alpha.1",
+    "@storybook/addon-events": "5.1.0-alpha.1",
+    "@storybook/addon-jest": "5.1.0-alpha.1",
+    "@storybook/addon-knobs": "5.1.0-alpha.1",
+    "@storybook/addon-links": "5.1.0-alpha.1",
+    "@storybook/addon-notes": "5.1.0-alpha.1",
+    "@storybook/addon-options": "5.1.0-alpha.1",
+    "@storybook/addon-storyshots": "5.1.0-alpha.1",
+    "@storybook/addon-storysource": "5.1.0-alpha.1",
+    "@storybook/addon-viewport": "5.1.0-alpha.1",
+    "@storybook/addons": "5.1.0-alpha.1",
+    "@storybook/core": "5.1.0-alpha.1",
+    "@storybook/core-events": "5.1.0-alpha.1",
+    "@storybook/html": "5.1.0-alpha.1",
     "eventemitter3": "^3.1.0",
     "format-json": "^1.0.3",
     "global": "^4.3.2",
diff --git a/examples/marko-cli/package.json b/examples/marko-cli/package.json
index ce37a26af4f..a159c209e79 100644
--- a/examples/marko-cli/package.json
+++ b/examples/marko-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "marko-cli",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "private": true,
   "description": "Demo of how to build an app using marko-starter",
   "repository": {
@@ -24,12 +24,12 @@
     "marko-starter": "^2.0.4"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.1.0-alpha.0",
-    "@storybook/addon-knobs": "5.1.0-alpha.0",
-    "@storybook/addon-options": "5.1.0-alpha.0",
-    "@storybook/addon-storysource": "5.1.0-alpha.0",
-    "@storybook/addons": "5.1.0-alpha.0",
-    "@storybook/marko": "5.1.0-alpha.0",
+    "@storybook/addon-actions": "5.1.0-alpha.1",
+    "@storybook/addon-knobs": "5.1.0-alpha.1",
+    "@storybook/addon-options": "5.1.0-alpha.1",
+    "@storybook/addon-storysource": "5.1.0-alpha.1",
+    "@storybook/addons": "5.1.0-alpha.1",
+    "@storybook/marko": "5.1.0-alpha.1",
     "prettier": "^1.16.4",
     "webpack": "^4.29.6"
   }
diff --git a/examples/mithril-kitchen-sink/package.json b/examples/mithril-kitchen-sink/package.json
index 54c37bb428a..52bb6664325 100644
--- a/examples/mithril-kitchen-sink/package.json
+++ b/examples/mithril-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "mithril-example",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -11,18 +11,18 @@
     "mithril": "^1.1.6"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.1.0-alpha.0",
-    "@storybook/addon-backgrounds": "5.1.0-alpha.0",
-    "@storybook/addon-centered": "5.1.0-alpha.0",
-    "@storybook/addon-knobs": "5.1.0-alpha.0",
-    "@storybook/addon-links": "5.1.0-alpha.0",
-    "@storybook/addon-notes": "5.1.0-alpha.0",
-    "@storybook/addon-options": "5.1.0-alpha.0",
-    "@storybook/addon-storyshots": "5.1.0-alpha.0",
-    "@storybook/addon-storysource": "5.1.0-alpha.0",
-    "@storybook/addon-viewport": "5.1.0-alpha.0",
-    "@storybook/addons": "5.1.0-alpha.0",
-    "@storybook/mithril": "5.1.0-alpha.0",
+    "@storybook/addon-actions": "5.1.0-alpha.1",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.1",
+    "@storybook/addon-centered": "5.1.0-alpha.1",
+    "@storybook/addon-knobs": "5.1.0-alpha.1",
+    "@storybook/addon-links": "5.1.0-alpha.1",
+    "@storybook/addon-notes": "5.1.0-alpha.1",
+    "@storybook/addon-options": "5.1.0-alpha.1",
+    "@storybook/addon-storyshots": "5.1.0-alpha.1",
+    "@storybook/addon-storysource": "5.1.0-alpha.1",
+    "@storybook/addon-viewport": "5.1.0-alpha.1",
+    "@storybook/addons": "5.1.0-alpha.1",
+    "@storybook/mithril": "5.1.0-alpha.1",
     "webpack": "^4.29.6"
   }
 }
diff --git a/examples/official-storybook/package.json b/examples/official-storybook/package.json
index 4ac2842a0cf..f8a91da234e 100644
--- a/examples/official-storybook/package.json
+++ b/examples/official-storybook/package.json
@@ -1,6 +1,6 @@
 {
   "name": "official-storybook",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -13,29 +13,29 @@
     "storybook": "cross-env STORYBOOK_DISPLAY_WARNING=true DISPLAY_WARNING=true start-storybook -p 9011 -c ./ -s built-storybooks --no-dll"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.1.0-alpha.0",
-    "@storybook/addon-actions": "5.1.0-alpha.0",
-    "@storybook/addon-backgrounds": "5.1.0-alpha.0",
-    "@storybook/addon-centered": "5.1.0-alpha.0",
-    "@storybook/addon-cssresources": "5.1.0-alpha.0",
-    "@storybook/addon-events": "5.1.0-alpha.0",
-    "@storybook/addon-graphql": "5.1.0-alpha.0",
-    "@storybook/addon-info": "5.1.0-alpha.0",
-    "@storybook/addon-jest": "5.1.0-alpha.0",
-    "@storybook/addon-knobs": "5.1.0-alpha.0",
-    "@storybook/addon-links": "5.1.0-alpha.0",
-    "@storybook/addon-notes": "5.1.0-alpha.0",
-    "@storybook/addon-options": "5.1.0-alpha.0",
-    "@storybook/addon-storyshots": "5.1.0-alpha.0",
-    "@storybook/addon-storyshots-puppeteer": "5.1.0-alpha.0",
-    "@storybook/addon-storysource": "5.1.0-alpha.0",
-    "@storybook/addon-viewport": "5.1.0-alpha.0",
-    "@storybook/addons": "5.1.0-alpha.0",
-    "@storybook/components": "5.1.0-alpha.0",
-    "@storybook/core-events": "5.1.0-alpha.0",
-    "@storybook/node-logger": "5.1.0-alpha.0",
-    "@storybook/react": "5.1.0-alpha.0",
-    "@storybook/theming": "5.1.0-alpha.0",
+    "@storybook/addon-a11y": "5.1.0-alpha.1",
+    "@storybook/addon-actions": "5.1.0-alpha.1",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.1",
+    "@storybook/addon-centered": "5.1.0-alpha.1",
+    "@storybook/addon-cssresources": "5.1.0-alpha.1",
+    "@storybook/addon-events": "5.1.0-alpha.1",
+    "@storybook/addon-graphql": "5.1.0-alpha.1",
+    "@storybook/addon-info": "5.1.0-alpha.1",
+    "@storybook/addon-jest": "5.1.0-alpha.1",
+    "@storybook/addon-knobs": "5.1.0-alpha.1",
+    "@storybook/addon-links": "5.1.0-alpha.1",
+    "@storybook/addon-notes": "5.1.0-alpha.1",
+    "@storybook/addon-options": "5.1.0-alpha.1",
+    "@storybook/addon-storyshots": "5.1.0-alpha.1",
+    "@storybook/addon-storyshots-puppeteer": "5.1.0-alpha.1",
+    "@storybook/addon-storysource": "5.1.0-alpha.1",
+    "@storybook/addon-viewport": "5.1.0-alpha.1",
+    "@storybook/addons": "5.1.0-alpha.1",
+    "@storybook/components": "5.1.0-alpha.1",
+    "@storybook/core-events": "5.1.0-alpha.1",
+    "@storybook/node-logger": "5.1.0-alpha.1",
+    "@storybook/react": "5.1.0-alpha.1",
+    "@storybook/theming": "5.1.0-alpha.1",
     "cors": "^2.8.5",
     "cross-env": "^5.2.0",
     "enzyme-to-json": "^3.3.5",
diff --git a/examples/polymer-cli/package.json b/examples/polymer-cli/package.json
index 403f38e4dfc..7e7d9bf53bf 100644
--- a/examples/polymer-cli/package.json
+++ b/examples/polymer-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "polymer-cli",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -10,15 +10,15 @@
   },
   "dependencies": {
     "@polymer/polymer": "^2.6.0",
-    "@storybook/addon-actions": "5.1.0-alpha.0",
-    "@storybook/addon-backgrounds": "5.1.0-alpha.0",
-    "@storybook/addon-knobs": "5.1.0-alpha.0",
-    "@storybook/addon-links": "5.1.0-alpha.0",
-    "@storybook/addon-notes": "5.1.0-alpha.0",
-    "@storybook/addon-options": "5.1.0-alpha.0",
-    "@storybook/addon-storysource": "5.1.0-alpha.0",
-    "@storybook/addon-viewport": "5.1.0-alpha.0",
-    "@storybook/polymer": "5.1.0-alpha.0",
+    "@storybook/addon-actions": "5.1.0-alpha.1",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.1",
+    "@storybook/addon-knobs": "5.1.0-alpha.1",
+    "@storybook/addon-links": "5.1.0-alpha.1",
+    "@storybook/addon-notes": "5.1.0-alpha.1",
+    "@storybook/addon-options": "5.1.0-alpha.1",
+    "@storybook/addon-storysource": "5.1.0-alpha.1",
+    "@storybook/addon-viewport": "5.1.0-alpha.1",
+    "@storybook/polymer": "5.1.0-alpha.1",
     "@webcomponents/webcomponentsjs": "^1.2.0",
     "global": "^4.3.2",
     "lit-html": "^1.0.0",
diff --git a/examples/preact-kitchen-sink/package.json b/examples/preact-kitchen-sink/package.json
index 7258f0c4d76..fc48ea8d136 100644
--- a/examples/preact-kitchen-sink/package.json
+++ b/examples/preact-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "preact-example",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -16,18 +16,18 @@
   "devDependencies": {
     "@babel/core": "^7.3.4",
     "@babel/plugin-transform-runtime": "^7.2.0",
-    "@storybook/addon-actions": "5.1.0-alpha.0",
-    "@storybook/addon-backgrounds": "5.1.0-alpha.0",
-    "@storybook/addon-centered": "5.1.0-alpha.0",
-    "@storybook/addon-knobs": "5.1.0-alpha.0",
-    "@storybook/addon-links": "5.1.0-alpha.0",
-    "@storybook/addon-notes": "5.1.0-alpha.0",
-    "@storybook/addon-options": "5.1.0-alpha.0",
-    "@storybook/addon-storyshots": "5.1.0-alpha.0",
-    "@storybook/addon-storysource": "5.1.0-alpha.0",
-    "@storybook/addon-viewport": "5.1.0-alpha.0",
-    "@storybook/addons": "5.1.0-alpha.0",
-    "@storybook/preact": "5.1.0-alpha.0",
+    "@storybook/addon-actions": "5.1.0-alpha.1",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.1",
+    "@storybook/addon-centered": "5.1.0-alpha.1",
+    "@storybook/addon-knobs": "5.1.0-alpha.1",
+    "@storybook/addon-links": "5.1.0-alpha.1",
+    "@storybook/addon-notes": "5.1.0-alpha.1",
+    "@storybook/addon-options": "5.1.0-alpha.1",
+    "@storybook/addon-storyshots": "5.1.0-alpha.1",
+    "@storybook/addon-storysource": "5.1.0-alpha.1",
+    "@storybook/addon-viewport": "5.1.0-alpha.1",
+    "@storybook/addons": "5.1.0-alpha.1",
+    "@storybook/preact": "5.1.0-alpha.1",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
     "file-loader": "^3.0.1",
diff --git a/examples/riot-kitchen-sink/package.json b/examples/riot-kitchen-sink/package.json
index 916402ead97..28581ab9e9b 100644
--- a/examples/riot-kitchen-sink/package.json
+++ b/examples/riot-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "riot-example",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -16,18 +16,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.3.4",
-    "@storybook/addon-actions": "5.1.0-alpha.0",
-    "@storybook/addon-backgrounds": "5.1.0-alpha.0",
-    "@storybook/addon-centered": "5.1.0-alpha.0",
-    "@storybook/addon-knobs": "5.1.0-alpha.0",
-    "@storybook/addon-links": "5.1.0-alpha.0",
-    "@storybook/addon-notes": "5.1.0-alpha.0",
-    "@storybook/addon-options": "5.1.0-alpha.0",
-    "@storybook/addon-storyshots": "5.1.0-alpha.0",
-    "@storybook/addon-storysource": "5.1.0-alpha.0",
-    "@storybook/addon-viewport": "5.1.0-alpha.0",
-    "@storybook/addons": "5.1.0-alpha.0",
-    "@storybook/riot": "5.1.0-alpha.0",
+    "@storybook/addon-actions": "5.1.0-alpha.1",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.1",
+    "@storybook/addon-centered": "5.1.0-alpha.1",
+    "@storybook/addon-knobs": "5.1.0-alpha.1",
+    "@storybook/addon-links": "5.1.0-alpha.1",
+    "@storybook/addon-notes": "5.1.0-alpha.1",
+    "@storybook/addon-options": "5.1.0-alpha.1",
+    "@storybook/addon-storyshots": "5.1.0-alpha.1",
+    "@storybook/addon-storysource": "5.1.0-alpha.1",
+    "@storybook/addon-viewport": "5.1.0-alpha.1",
+    "@storybook/addons": "5.1.0-alpha.1",
+    "@storybook/riot": "5.1.0-alpha.1",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
     "file-loader": "^3.0.1",
diff --git a/examples/svelte-kitchen-sink/package.json b/examples/svelte-kitchen-sink/package.json
index 31850c1e26e..31dea343eaa 100644
--- a/examples/svelte-kitchen-sink/package.json
+++ b/examples/svelte-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "svelte-example",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -11,17 +11,17 @@
     "global": "^4.3.2"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.1.0-alpha.0",
-    "@storybook/addon-backgrounds": "5.1.0-alpha.0",
-    "@storybook/addon-centered": "5.1.0-alpha.0",
-    "@storybook/addon-knobs": "5.1.0-alpha.0",
-    "@storybook/addon-links": "5.1.0-alpha.0",
-    "@storybook/addon-notes": "5.1.0-alpha.0",
-    "@storybook/addon-options": "5.1.0-alpha.0",
-    "@storybook/addon-storyshots": "5.1.0-alpha.0",
-    "@storybook/addon-storysource": "5.1.0-alpha.0",
-    "@storybook/addon-viewport": "5.1.0-alpha.0",
-    "@storybook/addons": "5.1.0-alpha.0",
-    "@storybook/svelte": "5.1.0-alpha.0"
+    "@storybook/addon-actions": "5.1.0-alpha.1",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.1",
+    "@storybook/addon-centered": "5.1.0-alpha.1",
+    "@storybook/addon-knobs": "5.1.0-alpha.1",
+    "@storybook/addon-links": "5.1.0-alpha.1",
+    "@storybook/addon-notes": "5.1.0-alpha.1",
+    "@storybook/addon-options": "5.1.0-alpha.1",
+    "@storybook/addon-storyshots": "5.1.0-alpha.1",
+    "@storybook/addon-storysource": "5.1.0-alpha.1",
+    "@storybook/addon-viewport": "5.1.0-alpha.1",
+    "@storybook/addons": "5.1.0-alpha.1",
+    "@storybook/svelte": "5.1.0-alpha.1"
   }
 }
diff --git a/examples/vue-kitchen-sink/package.json b/examples/vue-kitchen-sink/package.json
index c11620d54e5..bcc6c75167e 100644
--- a/examples/vue-kitchen-sink/package.json
+++ b/examples/vue-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "vue-example",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -15,18 +15,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.3.4",
-    "@storybook/addon-actions": "5.1.0-alpha.0",
-    "@storybook/addon-backgrounds": "5.1.0-alpha.0",
-    "@storybook/addon-centered": "5.1.0-alpha.0",
-    "@storybook/addon-knobs": "5.1.0-alpha.0",
-    "@storybook/addon-links": "5.1.0-alpha.0",
-    "@storybook/addon-notes": "5.1.0-alpha.0",
-    "@storybook/addon-options": "5.1.0-alpha.0",
-    "@storybook/addon-storyshots": "5.1.0-alpha.0",
-    "@storybook/addon-storysource": "5.1.0-alpha.0",
-    "@storybook/addon-viewport": "5.1.0-alpha.0",
-    "@storybook/addons": "5.1.0-alpha.0",
-    "@storybook/vue": "5.1.0-alpha.0",
+    "@storybook/addon-actions": "5.1.0-alpha.1",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.1",
+    "@storybook/addon-centered": "5.1.0-alpha.1",
+    "@storybook/addon-knobs": "5.1.0-alpha.1",
+    "@storybook/addon-links": "5.1.0-alpha.1",
+    "@storybook/addon-notes": "5.1.0-alpha.1",
+    "@storybook/addon-options": "5.1.0-alpha.1",
+    "@storybook/addon-storyshots": "5.1.0-alpha.1",
+    "@storybook/addon-storysource": "5.1.0-alpha.1",
+    "@storybook/addon-viewport": "5.1.0-alpha.1",
+    "@storybook/addons": "5.1.0-alpha.1",
+    "@storybook/vue": "5.1.0-alpha.1",
     "babel-core": "^7.0.0-bridge.0",
     "babel-loader": "^8.0.5",
     "cross-env": "^5.2.0",
diff --git a/lerna.json b/lerna.json
index f5123df625f..768e061c139 100644
--- a/lerna.json
+++ b/lerna.json
@@ -11,5 +11,5 @@
   "npmClient": "yarn",
   "useWorkspaces": true,
   "registry": "https://registry.npmjs.org",
-  "version": "5.1.0-alpha.0"
+  "version": "5.1.0-alpha.1"
 }
diff --git a/lib/addons/package.json b/lib/addons/package.json
index c2cc691aacd..c18bcdd87d7 100644
--- a/lib/addons/package.json
+++ b/lib/addons/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addons",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "Storybook addons store",
   "keywords": [
     "storybook"
@@ -21,8 +21,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.1.0-alpha.0",
-    "@storybook/client-logger": "5.1.0-alpha.0",
+    "@storybook/channels": "5.1.0-alpha.1",
+    "@storybook/client-logger": "5.1.0-alpha.1",
     "global": "^4.3.2",
     "util-deprecate": "^1.0.2"
   },
diff --git a/lib/channel-postmessage/package.json b/lib/channel-postmessage/package.json
index 135d15f639d..baa4433cd60 100644
--- a/lib/channel-postmessage/package.json
+++ b/lib/channel-postmessage/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channel-postmessage",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "",
   "keywords": [
     "storybook"
@@ -21,8 +21,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.1.0-alpha.0",
-    "@storybook/client-logger": "5.1.0-alpha.0",
+    "@storybook/channels": "5.1.0-alpha.1",
+    "@storybook/client-logger": "5.1.0-alpha.1",
     "global": "^4.3.2",
     "telejson": "^2.1.1"
   },
diff --git a/lib/channel-websocket/package.json b/lib/channel-websocket/package.json
index 4de1362e0c5..dcd309e7bf5 100644
--- a/lib/channel-websocket/package.json
+++ b/lib/channel-websocket/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channel-websocket",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "",
   "keywords": [
     "storybook"
@@ -21,7 +21,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.1.0-alpha.0",
+    "@storybook/channels": "5.1.0-alpha.1",
     "global": "^4.3.2",
     "json-fn": "^1.1.1"
   },
diff --git a/lib/channels/package.json b/lib/channels/package.json
index e81b43d5193..97b0cb6daa8 100644
--- a/lib/channels/package.json
+++ b/lib/channels/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channels",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/cli/package.json b/lib/cli/package.json
index a70b0532b49..00dcbcfe84e 100644
--- a/lib/cli/package.json
+++ b/lib/cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/cli",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "Storybook's CLI - easiest method of adding storybook to your projects",
   "keywords": [
     "cli",
@@ -30,7 +30,7 @@
     "@babel/core": "^7.3.4",
     "@babel/preset-env": "^7.3.4",
     "@babel/register": "^7.0.0",
-    "@storybook/codemod": "5.1.0-alpha.0",
+    "@storybook/codemod": "5.1.0-alpha.1",
     "chalk": "^2.4.1",
     "commander": "^2.19.0",
     "core-js": "^2.6.5",
@@ -44,31 +44,31 @@
     "update-notifier": "^2.5.0"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.1.0-alpha.0",
-    "@storybook/addon-centered": "5.1.0-alpha.0",
-    "@storybook/addon-graphql": "5.1.0-alpha.0",
-    "@storybook/addon-info": "5.1.0-alpha.0",
-    "@storybook/addon-knobs": "5.1.0-alpha.0",
-    "@storybook/addon-links": "5.1.0-alpha.0",
-    "@storybook/addon-notes": "5.1.0-alpha.0",
-    "@storybook/addon-options": "5.1.0-alpha.0",
-    "@storybook/addon-storyshots": "5.1.0-alpha.0",
-    "@storybook/addons": "5.1.0-alpha.0",
-    "@storybook/angular": "5.1.0-alpha.0",
-    "@storybook/channel-postmessage": "5.1.0-alpha.0",
-    "@storybook/channel-websocket": "5.1.0-alpha.0",
-    "@storybook/channels": "5.1.0-alpha.0",
-    "@storybook/ember": "5.1.0-alpha.0",
-    "@storybook/html": "5.1.0-alpha.0",
-    "@storybook/marko": "5.1.0-alpha.0",
-    "@storybook/mithril": "5.1.0-alpha.0",
-    "@storybook/polymer": "5.1.0-alpha.0",
-    "@storybook/preact": "5.1.0-alpha.0",
-    "@storybook/react": "5.1.0-alpha.0",
-    "@storybook/react-native": "5.1.0-alpha.0",
-    "@storybook/riot": "5.1.0-alpha.0",
-    "@storybook/ui": "5.1.0-alpha.0",
-    "@storybook/vue": "5.1.0-alpha.0"
+    "@storybook/addon-actions": "5.1.0-alpha.1",
+    "@storybook/addon-centered": "5.1.0-alpha.1",
+    "@storybook/addon-graphql": "5.1.0-alpha.1",
+    "@storybook/addon-info": "5.1.0-alpha.1",
+    "@storybook/addon-knobs": "5.1.0-alpha.1",
+    "@storybook/addon-links": "5.1.0-alpha.1",
+    "@storybook/addon-notes": "5.1.0-alpha.1",
+    "@storybook/addon-options": "5.1.0-alpha.1",
+    "@storybook/addon-storyshots": "5.1.0-alpha.1",
+    "@storybook/addons": "5.1.0-alpha.1",
+    "@storybook/angular": "5.1.0-alpha.1",
+    "@storybook/channel-postmessage": "5.1.0-alpha.1",
+    "@storybook/channel-websocket": "5.1.0-alpha.1",
+    "@storybook/channels": "5.1.0-alpha.1",
+    "@storybook/ember": "5.1.0-alpha.1",
+    "@storybook/html": "5.1.0-alpha.1",
+    "@storybook/marko": "5.1.0-alpha.1",
+    "@storybook/mithril": "5.1.0-alpha.1",
+    "@storybook/polymer": "5.1.0-alpha.1",
+    "@storybook/preact": "5.1.0-alpha.1",
+    "@storybook/react": "5.1.0-alpha.1",
+    "@storybook/react-native": "5.1.0-alpha.1",
+    "@storybook/riot": "5.1.0-alpha.1",
+    "@storybook/ui": "5.1.0-alpha.1",
+    "@storybook/vue": "5.1.0-alpha.1"
   },
   "publishConfig": {
     "access": "public"
diff --git a/lib/client-api/package.json b/lib/client-api/package.json
index edefc531ed2..dfa292e13d3 100644
--- a/lib/client-api/package.json
+++ b/lib/client-api/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/client-api",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "Storybook Client API",
   "keywords": [
     "storybook"
@@ -20,10 +20,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.0",
-    "@storybook/client-logger": "5.1.0-alpha.0",
-    "@storybook/core-events": "5.1.0-alpha.0",
-    "@storybook/router": "5.1.0-alpha.0",
+    "@storybook/addons": "5.1.0-alpha.1",
+    "@storybook/client-logger": "5.1.0-alpha.1",
+    "@storybook/core-events": "5.1.0-alpha.1",
+    "@storybook/router": "5.1.0-alpha.1",
     "common-tags": "^1.8.0",
     "eventemitter3": "^3.1.0",
     "global": "^4.3.2",
diff --git a/lib/client-logger/package.json b/lib/client-logger/package.json
index e463440b258..4ded6511f7d 100644
--- a/lib/client-logger/package.json
+++ b/lib/client-logger/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/client-logger",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/codemod/package.json b/lib/codemod/package.json
index f391a3799db..74628c0432e 100644
--- a/lib/codemod/package.json
+++ b/lib/codemod/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/codemod",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "A collection of codemod scripts written with JSCodeshift",
   "keywords": [
     "storybook"
diff --git a/lib/components/package.json b/lib/components/package.json
index 37e8fef0b4c..b3b5263dc16 100644
--- a/lib/components/package.json
+++ b/lib/components/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/components",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "Core Storybook Components",
   "keywords": [
     "storybook"
@@ -21,11 +21,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.0",
-    "@storybook/client-logger": "5.1.0-alpha.0",
-    "@storybook/core-events": "5.1.0-alpha.0",
-    "@storybook/router": "5.1.0-alpha.0",
-    "@storybook/theming": "5.1.0-alpha.0",
+    "@storybook/addons": "5.1.0-alpha.1",
+    "@storybook/client-logger": "5.1.0-alpha.1",
+    "@storybook/core-events": "5.1.0-alpha.1",
+    "@storybook/router": "5.1.0-alpha.1",
+    "@storybook/theming": "5.1.0-alpha.1",
     "global": "^4.3.2",
     "js-beautify": "^1.8.9",
     "memoizerific": "^1.11.3",
diff --git a/lib/core-events/package.json b/lib/core-events/package.json
index 61535d2b9ec..f36ef1a12a2 100644
--- a/lib/core-events/package.json
+++ b/lib/core-events/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/core-events",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "Event names used in storybook core",
   "keywords": [
     "storybook"
diff --git a/lib/core/package.json b/lib/core/package.json
index 73c1a9ad5c7..5be6a9e72e4 100644
--- a/lib/core/package.json
+++ b/lib/core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/core",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "Storybook framework-agnostic API",
   "keywords": [
     "storybook"
@@ -25,14 +25,14 @@
     "@babel/plugin-syntax-dynamic-import": "^7.2.0",
     "@babel/plugin-transform-react-constant-elements": "^7.2.0",
     "@babel/preset-env": "^7.3.4",
-    "@storybook/addons": "5.1.0-alpha.0",
-    "@storybook/channel-postmessage": "5.1.0-alpha.0",
-    "@storybook/client-api": "5.1.0-alpha.0",
-    "@storybook/client-logger": "5.1.0-alpha.0",
-    "@storybook/core-events": "5.1.0-alpha.0",
-    "@storybook/node-logger": "5.1.0-alpha.0",
-    "@storybook/router": "5.1.0-alpha.0",
-    "@storybook/ui": "5.1.0-alpha.0",
+    "@storybook/addons": "5.1.0-alpha.1",
+    "@storybook/channel-postmessage": "5.1.0-alpha.1",
+    "@storybook/client-api": "5.1.0-alpha.1",
+    "@storybook/client-logger": "5.1.0-alpha.1",
+    "@storybook/core-events": "5.1.0-alpha.1",
+    "@storybook/node-logger": "5.1.0-alpha.1",
+    "@storybook/router": "5.1.0-alpha.1",
+    "@storybook/ui": "5.1.0-alpha.1",
     "airbnb-js-shims": "^1 || ^2",
     "autoprefixer": "^9.4.9",
     "babel-plugin-add-react-displayname": "^0.0.5",
diff --git a/lib/node-logger/package.json b/lib/node-logger/package.json
index 749da8d99f6..9fc0219fd3d 100644
--- a/lib/node-logger/package.json
+++ b/lib/node-logger/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/node-logger",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/router/package.json b/lib/router/package.json
index 9c0854f5b88..9ea7e750b40 100644
--- a/lib/router/package.json
+++ b/lib/router/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/router",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "Core Storybook Router",
   "keywords": [
     "storybook"
@@ -21,7 +21,7 @@
   },
   "dependencies": {
     "@reach/router": "^1.2.1",
-    "@storybook/theming": "5.1.0-alpha.0",
+    "@storybook/theming": "5.1.0-alpha.1",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
     "qs": "^6.6.0"
diff --git a/lib/theming/package.json b/lib/theming/package.json
index 20bf1286d46..29927dd8fe0 100644
--- a/lib/theming/package.json
+++ b/lib/theming/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/theming",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "Core Storybook Components",
   "keywords": [
     "storybook"
@@ -23,7 +23,7 @@
   "dependencies": {
     "@emotion/core": "^10.0.7",
     "@emotion/styled": "^10.0.7",
-    "@storybook/client-logger": "5.1.0-alpha.0",
+    "@storybook/client-logger": "5.1.0-alpha.1",
     "common-tags": "^1.8.0",
     "deep-object-diff": "^1.1.0",
     "emotion-theming": "^10.0.7",
diff --git a/lib/ui/package.json b/lib/ui/package.json
index 009758e2f8c..4820fae1d3c 100644
--- a/lib/ui/package.json
+++ b/lib/ui/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/ui",
-  "version": "5.1.0-alpha.0",
+  "version": "5.1.0-alpha.1",
   "description": "Core Storybook UI",
   "keywords": [
     "storybook"
@@ -22,12 +22,12 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.0",
-    "@storybook/client-logger": "5.1.0-alpha.0",
-    "@storybook/components": "5.1.0-alpha.0",
-    "@storybook/core-events": "5.1.0-alpha.0",
-    "@storybook/router": "5.1.0-alpha.0",
-    "@storybook/theming": "5.1.0-alpha.0",
+    "@storybook/addons": "5.1.0-alpha.1",
+    "@storybook/client-logger": "5.1.0-alpha.1",
+    "@storybook/components": "5.1.0-alpha.1",
+    "@storybook/core-events": "5.1.0-alpha.1",
+    "@storybook/router": "5.1.0-alpha.1",
+    "@storybook/theming": "5.1.0-alpha.1",
     "fast-deep-equal": "^2.0.1",
     "fuzzy-search": "^3.0.1",
     "global": "^4.3.2",

From 7ea689cd1eb85724f9122c1b5f4350ed3e246581 Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Thu, 7 Mar 2019 20:18:15 +0100
Subject: [PATCH 205/249] FIX incoreect semicolumns

---
 .../src/pages/configurations/theming/index.md | 48 +++++++++----------
 1 file changed, 24 insertions(+), 24 deletions(-)

diff --git a/docs/src/pages/configurations/theming/index.md b/docs/src/pages/configurations/theming/index.md
index 25bdde50360..4fc8d9c9c18 100644
--- a/docs/src/pages/configurations/theming/index.md
+++ b/docs/src/pages/configurations/theming/index.md
@@ -58,39 +58,39 @@ Next paste the code below and tweak the variables.
 import { create } from '@storybook/theming';
 
 export default create({
-  base: 'light';
+  base: 'light',
 
-  colorPrimary: 'hotpink';
-  colorSecondary: 'deepskyblue';
+  colorPrimary: 'hotpink',
+  colorSecondary: 'deepskyblue',
 
   // UI
-  appBg: 'white';
-  appContentBg: 'silver';
-  appBorderColor: 'grey';
-  appBorderRadius: 4;
+  appBg: 'white',
+  appContentBg: 'silver',
+  appBorderColor: 'grey',
+  appBorderRadius: 4,
 
   // Typography
   fontBase: '"Open Sans", sans-serif',
-  fontCode: 'monospace';
+  fontCode: 'monospace',
 
   // Text colors
-  textColor: 'black';
-  textInverseColor: 'rgba(255,255,255,0.9)';
+  textColor: 'black',
+  textInverseColor: 'rgba(255,255,255,0.9)',
 
   // Toolbar default and active colors
-  barTextColor: 'silver';
-  barSelectedColor: 'black';
-  barBg: 'hotpink';
+  barTextColor: 'silver',
+  barSelectedColor: 'black',
+  barBg: 'hotpink',
 
   // Form colors
-  inputBg: 'white';
-  inputBorder: 'silver';
-  inputTextColor: 'black';
-  inputBorderRadius: 4;
+  inputBg: 'white',
+  inputBorder: 'silver',
+  inputTextColor: 'black',
+  inputBorderRadius: 4,
 
-  brandTitle: 'My custom storybook';
-  brandUrl: 'https://example.com';
-  brandImage: 'https://placehold.it/350x150';
+  brandTitle: 'My custom storybook',
+  brandUrl: 'https://example.com',
+  brandImage: 'https://placehold.it/350x150',
 });
 ```
 
@@ -112,11 +112,11 @@ Many them variables are optional, the `base` property is NOT. This is a perfectl
 import { create } from '@storybook/theming';
 
 export default create({
-  base: 'light';
+  base: 'light',
 
-  brandTitle: 'My custom storybook';
-  brandUrl: 'https://example.com';
-  brandImage: 'https://placehold.it/350x150';
+  brandTitle: 'My custom storybook',
+  brandUrl: 'https://example.com',
+  brandImage: 'https://placehold.it/350x150',
 });
 ```
 

From 9c71efb3fe1d292d28ad22bbcaa4bdbbb1a02a72 Mon Sep 17 00:00:00 2001
From: Tom Coleman <tom@thesnail.org>
Date: Fri, 8 Mar 2019 11:40:29 +1100
Subject: [PATCH 206/249] Add core JS dependencies across the stack where it
 was missing

For #5831
---
 addons/notes/package.json            | 1 +
 app/react-native/package.json        | 1 +
 lib/addons/package.json              | 1 +
 lib/channel-postmessage/package.json | 1 +
 lib/channel-websocket/package.json   | 1 +
 lib/channels/package.json            | 3 +++
 lib/client-logger/package.json       | 3 +++
 lib/components/package.json          | 1 +
 lib/core-events/package.json         | 3 +++
 lib/router/package.json              | 1 +
 lib/theming/package.json             | 1 +
 lib/ui/package.json                  | 1 +
 12 files changed, 18 insertions(+)

diff --git a/addons/notes/package.json b/addons/notes/package.json
index 550d71b4a34..e51cb5ba6be 100644
--- a/addons/notes/package.json
+++ b/addons/notes/package.json
@@ -28,6 +28,7 @@
     "@storybook/components": "5.1.0-alpha.0",
     "@storybook/core-events": "5.1.0-alpha.0",
     "@storybook/theming": "5.1.0-alpha.0",
+    "core-js": "^2.6.5",
     "markdown-to-jsx": "^6.9.1",
     "prop-types": "^15.7.2",
     "util-deprecate": "^1.0.2"
diff --git a/app/react-native/package.json b/app/react-native/package.json
index 15ef8356558..3b4ec0e4cd8 100644
--- a/app/react-native/package.json
+++ b/app/react-native/package.json
@@ -47,6 +47,7 @@
     "babel-runtime": "^6.26.0",
     "case-sensitive-paths-webpack-plugin": "^2.2.0",
     "commander": "^2.19.0",
+    "core-js": "^2.6.5",
     "dotenv-webpack": "^1.7.0",
     "ejs": "^2.6.1",
     "express": "^4.16.4",
diff --git a/lib/addons/package.json b/lib/addons/package.json
index c2cc691aacd..ab4b017ef5a 100644
--- a/lib/addons/package.json
+++ b/lib/addons/package.json
@@ -23,6 +23,7 @@
   "dependencies": {
     "@storybook/channels": "5.1.0-alpha.0",
     "@storybook/client-logger": "5.1.0-alpha.0",
+    "core-js": "^2.6.5",
     "global": "^4.3.2",
     "util-deprecate": "^1.0.2"
   },
diff --git a/lib/channel-postmessage/package.json b/lib/channel-postmessage/package.json
index 135d15f639d..1d6a1754c97 100644
--- a/lib/channel-postmessage/package.json
+++ b/lib/channel-postmessage/package.json
@@ -23,6 +23,7 @@
   "dependencies": {
     "@storybook/channels": "5.1.0-alpha.0",
     "@storybook/client-logger": "5.1.0-alpha.0",
+    "core-js": "^2.6.5",
     "global": "^4.3.2",
     "telejson": "^2.1.1"
   },
diff --git a/lib/channel-websocket/package.json b/lib/channel-websocket/package.json
index 4de1362e0c5..054faecd3c0 100644
--- a/lib/channel-websocket/package.json
+++ b/lib/channel-websocket/package.json
@@ -22,6 +22,7 @@
   },
   "dependencies": {
     "@storybook/channels": "5.1.0-alpha.0",
+    "core-js": "^2.6.5",
     "global": "^4.3.2",
     "json-fn": "^1.1.1"
   },
diff --git a/lib/channels/package.json b/lib/channels/package.json
index e81b43d5193..50e1f4a56f7 100644
--- a/lib/channels/package.json
+++ b/lib/channels/package.json
@@ -22,5 +22,8 @@
   },
   "publishConfig": {
     "access": "public"
+  },
+  "dependencies": {
+    "core-js": "^2.6.5"
   }
 }
diff --git a/lib/client-logger/package.json b/lib/client-logger/package.json
index e463440b258..9d15dc611dd 100644
--- a/lib/client-logger/package.json
+++ b/lib/client-logger/package.json
@@ -22,5 +22,8 @@
   },
   "publishConfig": {
     "access": "public"
+  },
+  "dependencies": {
+    "core-js": "^2.6.5"
   }
 }
diff --git a/lib/components/package.json b/lib/components/package.json
index 37e8fef0b4c..3ae0ede6ca1 100644
--- a/lib/components/package.json
+++ b/lib/components/package.json
@@ -26,6 +26,7 @@
     "@storybook/core-events": "5.1.0-alpha.0",
     "@storybook/router": "5.1.0-alpha.0",
     "@storybook/theming": "5.1.0-alpha.0",
+    "core-js": "^2.6.5",
     "global": "^4.3.2",
     "js-beautify": "^1.8.9",
     "memoizerific": "^1.11.3",
diff --git a/lib/core-events/package.json b/lib/core-events/package.json
index 61535d2b9ec..b4e579dff20 100644
--- a/lib/core-events/package.json
+++ b/lib/core-events/package.json
@@ -22,5 +22,8 @@
   },
   "publishConfig": {
     "access": "public"
+  },
+  "dependencies": {
+    "core-js": "^2.6.5"
   }
 }
diff --git a/lib/router/package.json b/lib/router/package.json
index 9c0854f5b88..ae677fd65fa 100644
--- a/lib/router/package.json
+++ b/lib/router/package.json
@@ -22,6 +22,7 @@
   "dependencies": {
     "@reach/router": "^1.2.1",
     "@storybook/theming": "5.1.0-alpha.0",
+    "core-js": "^2.6.5",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
     "qs": "^6.6.0"
diff --git a/lib/theming/package.json b/lib/theming/package.json
index 20bf1286d46..be58bcfcb29 100644
--- a/lib/theming/package.json
+++ b/lib/theming/package.json
@@ -24,6 +24,7 @@
     "@emotion/core": "^10.0.7",
     "@emotion/styled": "^10.0.7",
     "@storybook/client-logger": "5.1.0-alpha.0",
+    "core-js": "^2.6.5",
     "common-tags": "^1.8.0",
     "deep-object-diff": "^1.1.0",
     "emotion-theming": "^10.0.7",
diff --git a/lib/ui/package.json b/lib/ui/package.json
index 009758e2f8c..2da6449176f 100644
--- a/lib/ui/package.json
+++ b/lib/ui/package.json
@@ -28,6 +28,7 @@
     "@storybook/core-events": "5.1.0-alpha.0",
     "@storybook/router": "5.1.0-alpha.0",
     "@storybook/theming": "5.1.0-alpha.0",
+    "core-js": "^2.6.5",
     "fast-deep-equal": "^2.0.1",
     "fuzzy-search": "^3.0.1",
     "global": "^4.3.2",

From 2fcd2901109232ccced724c9ed4b5363eb2d4b98 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Fri, 8 Mar 2019 11:22:47 +0800
Subject: [PATCH 207/249] 5.1.0-alpha.1 versions.json

---
 docs/src/versions/next.json | 7 +------
 1 file changed, 1 insertion(+), 6 deletions(-)

diff --git a/docs/src/versions/next.json b/docs/src/versions/next.json
index d4fe638c271..3cc3f220c0c 100644
--- a/docs/src/versions/next.json
+++ b/docs/src/versions/next.json
@@ -1,6 +1 @@
-{
-  "version": "5.1.0-alpha.0",
-  "info": {
-    "plain": "### Features\n\n* UI: Custom scrollbars ([#5714](https://github.com/storybooks/storybook/pull/5714))\n\n### Bug Fixes\n\n* Fix: Move `react-select` dependency to 2.2 ([#5867](https://github.com/storybooks/storybook/pull/5867))\n\n### Maintenance\n\n* Cleanup unused dependencies ([#5453](https://github.com/storybooks/storybook/pull/5453))\n* Add directory attribute to repositories in package.json files ([#5643](https://github.com/storybooks/storybook/pull/5643))\n\n### Dependency Upgrades\n\n* Project-wide dependency upgrades ([#5740](https://github.com/storybooks/storybook/pull/5740))\n* Bump react-is from 16.8.1 to 16.8.3 ([#5743](https://github.com/storybooks/storybook/pull/5743))\n* Bump danger from 7.0.13 to 7.0.14 ([#5744](https://github.com/storybooks/storybook/pull/5744))\n* Bump babel-plugin-named-asset-import from 0.3.0 to 0.3.1 ([#5745](https://github.com/storybooks/storybook/pull/5745))\n* Bump eslint-plugin-json from 1.3.2 to 1.4.0 ([#5719](https://github.com/storybooks/storybook/pull/5719))\n* Bump react-native-modal-datetime-picker from 5.1.0 to 6.0.0 ([#4425](https://github.com/storybooks/storybook/pull/4425))\n* Bump immer from 1.12.0 to 2.0.0 ([#5694](https://github.com/storybooks/storybook/pull/5694))\n* Bump danger from 7.0.11 to 7.0.13 ([#5696](https://github.com/storybooks/storybook/pull/5696))\n* Bump eslint-plugin-jsx-a11y from 6.2.0 to 6.2.1 ([#5698](https://github.com/storybooks/storybook/pull/5698))\n* Bump @angular/platform-browser-dynamic from 7.2.4 to 7.2.6 ([#5697](https://github.com/storybooks/storybook/pull/5697))\n* Bump eslint from 5.12.1 to 5.14.1 ([#5653](https://github.com/storybooks/storybook/pull/5653))\n* Bump babel-preset-react-app from 7.0.0 to 7.0.1 ([#5674](https://github.com/storybooks/storybook/pull/5674))\n* Bump react from 16.8.1 to 16.8.2 ([#5673](https://github.com/storybooks/storybook/pull/5673))\n* Bump @angular/cli from 7.3.0 to 7.3.2 ([#5654](https://github.com/storybooks/storybook/pull/5654))\n* Bump @types/jest from 24.0.0 to 24.0.6 ([#5655](https://github.com/storybooks/storybook/pull/5655))\n* Bump lint-staged from 8.1.3 to 8.1.4 ([#5606](https://github.com/storybooks/storybook/pull/5606))\n* Bump @types/lodash from 4.14.120 to 4.14.121 ([#5609](https://github.com/storybooks/storybook/pull/5609))\n* Bump webpack from 4.29.0 to 4.29.3 ([#5570](https://github.com/storybooks/storybook/pull/5570))\n* update modal manager for rn 0.58 support ([#5581](https://github.com/storybooks/storybook/pull/5581))\n* Bump danger from 7.0.7 to 7.0.11 ([#5568](https://github.com/storybooks/storybook/pull/5568))\n* Bump jest-jasmine2 from 24.0.0 to 24.1.0 ([#5569](https://github.com/storybooks/storybook/pull/5569))\n* Bump jest-jasmine2 from 24.0.0 to 24.1.0 ([#5567](https://github.com/storybooks/storybook/pull/5567))\n* Bump handlebars from 4.0.12 to 4.1.0 ([#5576](https://github.com/storybooks/storybook/pull/5576))\n* Bump esm from 3.2.1 to 3.2.4 ([#5556](https://github.com/storybooks/storybook/pull/5556))\n* Bump @types/jest from 23.3.13 to 24.0.0 ([#5554](https://github.com/storybooks/storybook/pull/5554))\n* Bump webpack-dev-middleware from 3.5.1 to 3.5.2 ([#5552](https://github.com/storybooks/storybook/pull/5552))\n* Bump @emotion/core from 10.0.6 to 10.0.7 ([#5555](https://github.com/storybooks/storybook/pull/5555))\n* Bump terser-webpack-plugin from 1.2.1 to 1.2.2 ([#5553](https://github.com/storybooks/storybook/pull/5553))\n* Bump fuse.js from 3.3.1 to 3.4.2 ([#5538](https://github.com/storybooks/storybook/pull/5538))\n* Bump @angular/platform-browser-dynamic from 7.2.3 to 7.2.4 ([#5540](https://github.com/storybooks/storybook/pull/5540))\n* Bump emotion-theming from 10.0.6 to 10.0.7 ([#5541](https://github.com/storybooks/storybook/pull/5541))\n* Bump eslint-config-prettier from 3.6.0 to 4.0.0 ([#5539](https://github.com/storybooks/storybook/pull/5539))"
-  }
-}
+{"version":"5.1.0-alpha.1","info":{"plain":"### Bug Fixes\n\n* CLI: Fix missing iframe.html in absolute path output directory ([#5947](https://github.com/storybooks/storybook/pull/5947))\n* Addon-knobs: Added debouncing between keystrokes to speed up component rendering ([#5811](https://github.com/storybooks/storybook/pull/5811))\n* UI: Fix search in production mode ([#5909](https://github.com/storybooks/storybook/pull/5909))\n\n### Maintenance\n\n* ADD delay to rendering the acceptance stories ([#5943](https://github.com/storybooks/storybook/pull/5943))\n* Split versions.json into two files ([#5896](https://github.com/storybooks/storybook/pull/5896))"}}
\ No newline at end of file

From c61171d8ce2d84f1280466908d4e4cd805834d84 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Fri, 8 Mar 2019 17:21:38 +0800
Subject: [PATCH 208/249] Support unicode chars in story IDs

---
 .../official-storybook/stories/core/unicode.stories.js     | 7 +++++++
 lib/router/src/tests/id.test.js                            | 4 +++-
 lib/router/src/utils.ts                                    | 2 +-
 3 files changed, 11 insertions(+), 2 deletions(-)
 create mode 100644 examples/official-storybook/stories/core/unicode.stories.js

diff --git a/examples/official-storybook/stories/core/unicode.stories.js b/examples/official-storybook/stories/core/unicode.stories.js
new file mode 100644
index 00000000000..dada3c9f833
--- /dev/null
+++ b/examples/official-storybook/stories/core/unicode.stories.js
@@ -0,0 +1,7 @@
+import React from 'react';
+import { storiesOf } from '@storybook/react';
+
+storiesOf('Core|Unicode', module)
+  .add('😀', () => <p>❤️</p>)
+  .add('Кнопки', () => <p>нормальный</p>)
+  .add('바보', () => <p>🤷🏻‍♂️</p>);
diff --git a/lib/router/src/tests/id.test.js b/lib/router/src/tests/id.test.js
index f65c6c414fe..83b2751d9d5 100644
--- a/lib/router/src/tests/id.test.js
+++ b/lib/router/src/tests/id.test.js
@@ -4,10 +4,12 @@ describe('toId', () => {
   [
     // name, kind, story, output
     ['handles simple cases', 'kind', 'story', 'kind--story'],
-    ['handles basic substitution', 'a b$c?d😀e', '1-2:3', 'a-b-c-d-e--1-2-3'],
+    ['handles basic substitution', 'a b$c?d😀e', '1-2:3', 'a-b-c-d😀e--1-2-3'],
     ['handles runs of non-url chars', 'a?&*b', 'story', 'a-b--story'],
     ['removes non-url chars from start and end', '?ab-', 'story', 'ab--story'],
     ['downcases', 'KIND', 'STORY', 'kind--story'],
+    ['non-latin', 'Кнопки', 'нормальный', 'кнопки--нормальный'],
+    ['korean', 'kind', '바보 (babo)', 'kind--바보-babo'],
   ].forEach(([name, kind, story, output]) => {
     it(name, () => {
       expect(toId(kind, story)).toBe(output);
diff --git a/lib/router/src/utils.ts b/lib/router/src/utils.ts
index a0659d3b31a..25c0fdad3bb 100644
--- a/lib/router/src/utils.ts
+++ b/lib/router/src/utils.ts
@@ -12,7 +12,7 @@ const splitPath = /\/([^/]+)\/([^/]+)?/;
 export const sanitize = (string: string) => {
   return string
     .toLowerCase()
-    .replace(/[^a-z0-9-]/g, '-')
+    .replace(/[ '`~!@#$%^&*()_|+\-=?;:'",.<>\{\}\[\]\\\/]/gi, '-')
     .replace(/-+/g, '-')
     .replace(/^-+/, '')
     .replace(/-+$/, '');

From bb254c028bb75365dbf9bda0101b1630beebb74a Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Fri, 8 Mar 2019 17:47:37 +0800
Subject: [PATCH 209/249] Add more punctuation chars

---
 lib/router/src/tests/id.test.js | 1 +
 lib/router/src/utils.ts         | 3 ++-
 2 files changed, 3 insertions(+), 1 deletion(-)

diff --git a/lib/router/src/tests/id.test.js b/lib/router/src/tests/id.test.js
index 83b2751d9d5..7f87b9015e4 100644
--- a/lib/router/src/tests/id.test.js
+++ b/lib/router/src/tests/id.test.js
@@ -10,6 +10,7 @@ describe('toId', () => {
     ['downcases', 'KIND', 'STORY', 'kind--story'],
     ['non-latin', 'Кнопки', 'нормальный', 'кнопки--нормальный'],
     ['korean', 'kind', '바보 (babo)', 'kind--바보-babo'],
+    ['all punctuation', 'kind', 'unicorns,’–—―′¿`"<>()!.!!!{}[]%^&$*#&', 'kind--unicorns'],
   ].forEach(([name, kind, story, output]) => {
     it(name, () => {
       expect(toId(kind, story)).toBe(output);
diff --git a/lib/router/src/utils.ts b/lib/router/src/utils.ts
index 25c0fdad3bb..dffd64cff86 100644
--- a/lib/router/src/utils.ts
+++ b/lib/router/src/utils.ts
@@ -9,10 +9,11 @@ interface StoryData {
 const knownViewModesRegex = /(story|info)/;
 const splitPath = /\/([^/]+)\/([^/]+)?/;
 
+// Remove punctuation https://gist.github.com/davidjrice/9d2af51100e41c6c4b4a
 export const sanitize = (string: string) => {
   return string
     .toLowerCase()
-    .replace(/[ '`~!@#$%^&*()_|+\-=?;:'",.<>\{\}\[\]\\\/]/gi, '-')
+    .replace(/[ ’–—―′¿'`~!@#$%^&*()_|+\-=?;:'",.<>\{\}\[\]\\\/]/gi, '-')
     .replace(/-+/g, '-')
     .replace(/^-+/, '')
     .replace(/-+$/, '');

From ceb414a66080ef598a395d6c5d9818844e6e4ca2 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Fri, 8 Mar 2019 17:51:46 +0800
Subject: [PATCH 210/249] Update snapshots

---
 .../__snapshots__/unicode.stories.storyshot   | 19 +++++++++++++++++++
 1 file changed, 19 insertions(+)
 create mode 100644 examples/official-storybook/stories/core/__snapshots__/unicode.stories.storyshot

diff --git a/examples/official-storybook/stories/core/__snapshots__/unicode.stories.storyshot b/examples/official-storybook/stories/core/__snapshots__/unicode.stories.storyshot
new file mode 100644
index 00000000000..8d210253506
--- /dev/null
+++ b/examples/official-storybook/stories/core/__snapshots__/unicode.stories.storyshot
@@ -0,0 +1,19 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Storyshots Core|Unicode Кнопки 1`] = `
+<p>
+  нормальный
+</p>
+`;
+
+exports[`Storyshots Core|Unicode 바보 1`] = `
+<p>
+  🤷🏻‍♂️
+</p>
+`;
+
+exports[`Storyshots Core|Unicode 😀 1`] = `
+<p>
+  ❤️
+</p>
+`;

From b85d83da70430c1d6fe7bee687c0b291587b5f5a Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Fri, 8 Mar 2019 18:20:35 +0800
Subject: [PATCH 211/249] 5.1.0-alpha.2 changelog

---
 CHANGELOG.md | 11 +++++++++++
 1 file changed, 11 insertions(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index bec1a75a7e2..7df24f2f9ae 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,14 @@
+## 5.1.0-alpha.2 (March 8, 2019)
+
+### Bug Fixes
+
+* Core: support unicode chars in story IDs ([#5964](https://github.com/storybooks/storybook/pull/5964))
+* Core: Add core-js dependencies where it was missing ([#5961](https://github.com/storybooks/storybook/pull/5961))
+
+### Maintenance
+
+* Addon-a11y: Migrate to typescript ([#5738](https://github.com/storybooks/storybook/pull/5738))
+
 ## 5.1.0-alpha.1 (March 7, 2019)
 
 ### Bug Fixes

From 394cc916377ea71bfce7f3d9fc1e4c9f154f02bd Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Fri, 8 Mar 2019 18:36:07 +0800
Subject: [PATCH 212/249] v5.1.0-alpha.2

---
 addons/a11y/package.json                      | 12 ++---
 addons/actions/package.json                   | 10 ++--
 addons/backgrounds/package.json               | 12 ++---
 addons/centered/package.json                  |  2 +-
 addons/cssresources/package.json              |  8 +--
 addons/events/package.json                    |  8 +--
 addons/google-analytics/package.json          |  6 +--
 addons/graphql/package.json                   |  2 +-
 addons/info/package.json                      | 10 ++--
 addons/jest/package.json                      | 10 ++--
 addons/knobs/package.json                     | 10 ++--
 addons/links/package.json                     |  6 +--
 addons/notes/package.json                     | 12 ++---
 addons/ondevice-backgrounds/package.json      |  4 +-
 addons/ondevice-knobs/package.json            |  4 +-
 addons/ondevice-notes/package.json            |  4 +-
 addons/options/package.json                   |  4 +-
 .../storyshots/storyshots-core/package.json   |  4 +-
 .../storyshots-puppeteer/package.json         |  6 +--
 addons/storysource/package.json               | 10 ++--
 addons/viewport/package.json                  | 12 ++---
 app/angular/package.json                      |  6 +--
 app/ember/package.json                        |  4 +-
 app/html/package.json                         |  4 +-
 app/marko/package.json                        |  4 +-
 app/mithril/package.json                      |  4 +-
 app/polymer/package.json                      |  4 +-
 app/preact/package.json                       |  4 +-
 app/react-native/package.json                 | 14 ++---
 app/react/package.json                        |  6 +--
 app/riot/package.json                         |  4 +-
 app/svelte/package.json                       |  4 +-
 app/vue/package.json                          |  4 +-
 examples/angular-cli/package.json             | 26 ++++-----
 examples/cra-kitchen-sink/package.json        | 32 +++++------
 examples/cra-ts-kitchen-sink/package.json     | 12 ++---
 examples/ember-cli/package.json               | 26 ++++-----
 examples/html-kitchen-sink/package.json       | 36 ++++++-------
 examples/marko-cli/package.json               | 14 ++---
 examples/mithril-kitchen-sink/package.json    | 26 ++++-----
 examples/official-storybook/package.json      | 48 ++++++++---------
 examples/polymer-cli/package.json             | 20 +++----
 examples/preact-kitchen-sink/package.json     | 26 ++++-----
 examples/riot-kitchen-sink/package.json       | 26 ++++-----
 examples/svelte-kitchen-sink/package.json     | 26 ++++-----
 examples/vue-kitchen-sink/package.json        | 26 ++++-----
 lerna.json                                    |  2 +-
 lib/addons/package.json                       |  6 +--
 lib/channel-postmessage/package.json          |  6 +--
 lib/channel-websocket/package.json            |  4 +-
 lib/channels/package.json                     |  2 +-
 lib/cli/package.json                          | 54 +++++++++----------
 lib/client-api/package.json                   | 10 ++--
 lib/client-logger/package.json                |  2 +-
 lib/codemod/package.json                      |  2 +-
 lib/components/package.json                   | 12 ++---
 lib/core-events/package.json                  |  2 +-
 lib/core/package.json                         | 18 +++----
 lib/node-logger/package.json                  |  2 +-
 lib/router/package.json                       |  4 +-
 lib/theming/package.json                      |  6 +--
 lib/ui/package.json                           | 14 ++---
 62 files changed, 354 insertions(+), 354 deletions(-)

diff --git a/addons/a11y/package.json b/addons/a11y/package.json
index 2a40ed4f95f..c63b73865f1 100644
--- a/addons/a11y/package.json
+++ b/addons/a11y/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-a11y",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "a11y addon for storybook",
   "keywords": [
     "a11y",
@@ -26,11 +26,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.1",
-    "@storybook/client-logger": "5.1.0-alpha.1",
-    "@storybook/components": "5.1.0-alpha.1",
-    "@storybook/core-events": "5.1.0-alpha.1",
-    "@storybook/theming": "5.1.0-alpha.1",
+    "@storybook/addons": "5.1.0-alpha.2",
+    "@storybook/client-logger": "5.1.0-alpha.2",
+    "@storybook/components": "5.1.0-alpha.2",
+    "@storybook/core-events": "5.1.0-alpha.2",
+    "@storybook/theming": "5.1.0-alpha.2",
     "axe-core": "^3.1.2",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
diff --git a/addons/actions/package.json b/addons/actions/package.json
index 0142077374e..c1fcdb327dc 100644
--- a/addons/actions/package.json
+++ b/addons/actions/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-actions",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "Action Logger addon for storybook",
   "keywords": [
     "storybook"
@@ -21,10 +21,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.1",
-    "@storybook/components": "5.1.0-alpha.1",
-    "@storybook/core-events": "5.1.0-alpha.1",
-    "@storybook/theming": "5.1.0-alpha.1",
+    "@storybook/addons": "5.1.0-alpha.2",
+    "@storybook/components": "5.1.0-alpha.2",
+    "@storybook/core-events": "5.1.0-alpha.2",
+    "@storybook/theming": "5.1.0-alpha.2",
     "core-js": "^2.6.5",
     "fast-deep-equal": "^2.0.1",
     "global": "^4.3.2",
diff --git a/addons/backgrounds/package.json b/addons/backgrounds/package.json
index 737a6205a91..69bf271a444 100644
--- a/addons/backgrounds/package.json
+++ b/addons/backgrounds/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-backgrounds",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "A storybook addon to show different backgrounds for your preview",
   "keywords": [
     "addon",
@@ -25,11 +25,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.1",
-    "@storybook/client-logger": "5.1.0-alpha.1",
-    "@storybook/components": "5.1.0-alpha.1",
-    "@storybook/core-events": "5.1.0-alpha.1",
-    "@storybook/theming": "5.1.0-alpha.1",
+    "@storybook/addons": "5.1.0-alpha.2",
+    "@storybook/client-logger": "5.1.0-alpha.2",
+    "@storybook/components": "5.1.0-alpha.2",
+    "@storybook/core-events": "5.1.0-alpha.2",
+    "@storybook/theming": "5.1.0-alpha.2",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
diff --git a/addons/centered/package.json b/addons/centered/package.json
index 0ce8fdef501..e118b599ddb 100644
--- a/addons/centered/package.json
+++ b/addons/centered/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-centered",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "Storybook decorator to center components",
   "keywords": [
     "addon",
diff --git a/addons/cssresources/package.json b/addons/cssresources/package.json
index 3e4db52c09e..c2cc9b86b31 100644
--- a/addons/cssresources/package.json
+++ b/addons/cssresources/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-cssresources",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "A storybook addon to switch between css resources at runtime for your story",
   "keywords": [
     "addon",
@@ -25,9 +25,9 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.1",
-    "@storybook/components": "5.1.0-alpha.1",
-    "@storybook/core-events": "5.1.0-alpha.1",
+    "@storybook/addons": "5.1.0-alpha.2",
+    "@storybook/components": "5.1.0-alpha.2",
+    "@storybook/core-events": "5.1.0-alpha.2",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "react": "^16.8.3"
diff --git a/addons/events/package.json b/addons/events/package.json
index 4a3b534d6a2..d2a9f4601b8 100644
--- a/addons/events/package.json
+++ b/addons/events/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-events",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "Add events to your Storybook stories.",
   "keywords": [
     "addon",
@@ -24,9 +24,9 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.1",
-    "@storybook/core-events": "5.1.0-alpha.1",
-    "@storybook/theming": "5.1.0-alpha.1",
+    "@storybook/addons": "5.1.0-alpha.2",
+    "@storybook/core-events": "5.1.0-alpha.2",
+    "@storybook/theming": "5.1.0-alpha.2",
     "core-js": "^2.6.5",
     "format-json": "^1.0.3",
     "prop-types": "^15.7.2",
diff --git a/addons/google-analytics/package.json b/addons/google-analytics/package.json
index 2ab75ef2e58..5d5fb36715a 100644
--- a/addons/google-analytics/package.json
+++ b/addons/google-analytics/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-google-analytics",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "Storybook addon for google analytics",
   "keywords": [
     "addon",
@@ -20,8 +20,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.1",
-    "@storybook/core-events": "5.1.0-alpha.1",
+    "@storybook/addons": "5.1.0-alpha.2",
+    "@storybook/core-events": "5.1.0-alpha.2",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "react-ga": "^2.5.7"
diff --git a/addons/graphql/package.json b/addons/graphql/package.json
index d7ec4382fd4..cac5d402cf3 100644
--- a/addons/graphql/package.json
+++ b/addons/graphql/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-graphql",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "Storybook addon to display the GraphiQL IDE",
   "keywords": [
     "addon",
diff --git a/addons/info/package.json b/addons/info/package.json
index 5c59e12dbbf..972905c6ab9 100644
--- a/addons/info/package.json
+++ b/addons/info/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-info",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "A Storybook addon to show additional information for your stories.",
   "keywords": [
     "addon",
@@ -22,10 +22,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.1",
-    "@storybook/client-logger": "5.1.0-alpha.1",
-    "@storybook/components": "5.1.0-alpha.1",
-    "@storybook/theming": "5.1.0-alpha.1",
+    "@storybook/addons": "5.1.0-alpha.2",
+    "@storybook/client-logger": "5.1.0-alpha.2",
+    "@storybook/components": "5.1.0-alpha.2",
+    "@storybook/theming": "5.1.0-alpha.2",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "marksy": "^6.1.0",
diff --git a/addons/jest/package.json b/addons/jest/package.json
index 63ae40c6622..7f335f09149 100644
--- a/addons/jest/package.json
+++ b/addons/jest/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-jest",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "React storybook addon that show component jest report",
   "keywords": [
     "addon",
@@ -28,10 +28,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.1",
-    "@storybook/components": "5.1.0-alpha.1",
-    "@storybook/core-events": "5.1.0-alpha.1",
-    "@storybook/theming": "5.1.0-alpha.1",
+    "@storybook/addons": "5.1.0-alpha.2",
+    "@storybook/components": "5.1.0-alpha.2",
+    "@storybook/core-events": "5.1.0-alpha.2",
+    "@storybook/theming": "5.1.0-alpha.2",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "prop-types": "^15.7.2",
diff --git a/addons/knobs/package.json b/addons/knobs/package.json
index 5575ee335aa..1feffc6a04f 100644
--- a/addons/knobs/package.json
+++ b/addons/knobs/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-knobs",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "Storybook Addon Prop Editor Component",
   "keywords": [
     "addon",
@@ -22,10 +22,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.1",
-    "@storybook/components": "5.1.0-alpha.1",
-    "@storybook/core-events": "5.1.0-alpha.1",
-    "@storybook/theming": "5.1.0-alpha.1",
+    "@storybook/addons": "5.1.0-alpha.2",
+    "@storybook/components": "5.1.0-alpha.2",
+    "@storybook/core-events": "5.1.0-alpha.2",
+    "@storybook/theming": "5.1.0-alpha.2",
     "copy-to-clipboard": "^3.0.8",
     "core-js": "^2.6.5",
     "escape-html": "^1.0.3",
diff --git a/addons/links/package.json b/addons/links/package.json
index 11333003bb4..4c534a9e438 100644
--- a/addons/links/package.json
+++ b/addons/links/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-links",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "Story Links addon for storybook",
   "keywords": [
     "addon",
@@ -22,8 +22,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.1",
-    "@storybook/core-events": "5.1.0-alpha.1",
+    "@storybook/addons": "5.1.0-alpha.2",
+    "@storybook/core-events": "5.1.0-alpha.2",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
diff --git a/addons/notes/package.json b/addons/notes/package.json
index 38090411b0c..cd101cba8cd 100644
--- a/addons/notes/package.json
+++ b/addons/notes/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-notes",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "Write notes for your Storybook stories.",
   "keywords": [
     "addon",
@@ -23,11 +23,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.1",
-    "@storybook/client-logger": "5.1.0-alpha.1",
-    "@storybook/components": "5.1.0-alpha.1",
-    "@storybook/core-events": "5.1.0-alpha.1",
-    "@storybook/theming": "5.1.0-alpha.1",
+    "@storybook/addons": "5.1.0-alpha.2",
+    "@storybook/client-logger": "5.1.0-alpha.2",
+    "@storybook/components": "5.1.0-alpha.2",
+    "@storybook/core-events": "5.1.0-alpha.2",
+    "@storybook/theming": "5.1.0-alpha.2",
     "core-js": "^2.6.5",
     "markdown-to-jsx": "^6.9.1",
     "prop-types": "^15.7.2",
diff --git a/addons/ondevice-backgrounds/package.json b/addons/ondevice-backgrounds/package.json
index bc88c42d207..56cd691948c 100644
--- a/addons/ondevice-backgrounds/package.json
+++ b/addons/ondevice-backgrounds/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/addon-ondevice-backgrounds",
   "private": true,
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "A storybook addon to show different backgrounds for your preview",
   "keywords": [
     "addon",
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.1",
+    "@storybook/addons": "5.1.0-alpha.2",
     "core-js": "^2.6.5",
     "prop-types": "^15.7.2"
   },
diff --git a/addons/ondevice-knobs/package.json b/addons/ondevice-knobs/package.json
index eb5098fbae0..2d8fd67a4a7 100644
--- a/addons/ondevice-knobs/package.json
+++ b/addons/ondevice-knobs/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/addon-ondevice-knobs",
   "private": true,
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "Display storybook story knobs on your deviced.",
   "keywords": [
     "addon",
@@ -22,7 +22,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.1",
+    "@storybook/addons": "5.1.0-alpha.2",
     "core-js": "^2.6.5",
     "deep-equal": "^1.0.1",
     "prop-types": "^15.7.2",
diff --git a/addons/ondevice-notes/package.json b/addons/ondevice-notes/package.json
index 8088a24e994..bb26978ab33 100644
--- a/addons/ondevice-notes/package.json
+++ b/addons/ondevice-notes/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/addon-ondevice-notes",
   "private": true,
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "Write notes for your Storybook stories.",
   "keywords": [
     "addon",
@@ -20,7 +20,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.1",
+    "@storybook/addons": "5.1.0-alpha.2",
     "core-js": "^2.6.5",
     "prop-types": "^15.7.2",
     "react-native-simple-markdown": "^1.1.0"
diff --git a/addons/options/package.json b/addons/options/package.json
index d143f4ee1a0..f8a5e580bd1 100644
--- a/addons/options/package.json
+++ b/addons/options/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-options",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "Options addon for storybook",
   "keywords": [
     "addon",
@@ -21,7 +21,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.1",
+    "@storybook/addons": "5.1.0-alpha.2",
     "core-js": "^2.6.5",
     "util-deprecate": "^1.0.2"
   },
diff --git a/addons/storyshots/storyshots-core/package.json b/addons/storyshots/storyshots-core/package.json
index b299f359f5c..0007a800708 100644
--- a/addons/storyshots/storyshots-core/package.json
+++ b/addons/storyshots/storyshots-core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storyshots",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "StoryShots is a Jest Snapshot Testing Addon for Storybook.",
   "keywords": [
     "addon",
@@ -25,7 +25,7 @@
     "storybook": "start-storybook -p 6006"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.1",
+    "@storybook/addons": "5.1.0-alpha.2",
     "core-js": "^2.6.5",
     "glob": "^7.1.3",
     "global": "^4.3.2",
diff --git a/addons/storyshots/storyshots-puppeteer/package.json b/addons/storyshots/storyshots-puppeteer/package.json
index 04afe0bd010..26b389f42a9 100644
--- a/addons/storyshots/storyshots-puppeteer/package.json
+++ b/addons/storyshots/storyshots-puppeteer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storyshots-puppeteer",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "Image snappshots addition to StoryShots base on puppeteer",
   "keywords": [
     "addon",
@@ -22,8 +22,8 @@
     "prepare": "node ../../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/node-logger": "5.1.0-alpha.1",
-    "@storybook/router": "5.1.0-alpha.1",
+    "@storybook/node-logger": "5.1.0-alpha.2",
+    "@storybook/router": "5.1.0-alpha.2",
     "core-js": "^2.6.5",
     "jest-image-snapshot": "^2.8.1",
     "puppeteer": "^1.12.2",
diff --git a/addons/storysource/package.json b/addons/storysource/package.json
index 6734a8ef7e4..0b4e13403a7 100644
--- a/addons/storysource/package.json
+++ b/addons/storysource/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storysource",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "Stories addon for storybook",
   "keywords": [
     "addon",
@@ -22,10 +22,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.1",
-    "@storybook/components": "5.1.0-alpha.1",
-    "@storybook/router": "5.1.0-alpha.1",
-    "@storybook/theming": "5.1.0-alpha.1",
+    "@storybook/addons": "5.1.0-alpha.2",
+    "@storybook/components": "5.1.0-alpha.2",
+    "@storybook/router": "5.1.0-alpha.2",
+    "@storybook/theming": "5.1.0-alpha.2",
     "core-js": "^2.6.5",
     "estraverse": "^4.2.0",
     "loader-utils": "^1.2.3",
diff --git a/addons/viewport/package.json b/addons/viewport/package.json
index 605cc051c33..d88925747fc 100644
--- a/addons/viewport/package.json
+++ b/addons/viewport/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-viewport",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "Storybook addon to change the viewport size to mobile",
   "keywords": [
     "addon",
@@ -21,11 +21,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.1",
-    "@storybook/client-logger": "5.1.0-alpha.1",
-    "@storybook/components": "5.1.0-alpha.1",
-    "@storybook/core-events": "5.1.0-alpha.1",
-    "@storybook/theming": "5.1.0-alpha.1",
+    "@storybook/addons": "5.1.0-alpha.2",
+    "@storybook/client-logger": "5.1.0-alpha.2",
+    "@storybook/components": "5.1.0-alpha.2",
+    "@storybook/core-events": "5.1.0-alpha.2",
+    "@storybook/theming": "5.1.0-alpha.2",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
diff --git a/app/angular/package.json b/app/angular/package.json
index 4bf6fc65d80..451a4d66ad0 100644
--- a/app/angular/package.json
+++ b/app/angular/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/angular",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "Storybook for Angular: Develop Angular Components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -26,8 +26,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.1.0-alpha.1",
-    "@storybook/node-logger": "5.1.0-alpha.1",
+    "@storybook/core": "5.1.0-alpha.2",
+    "@storybook/node-logger": "5.1.0-alpha.2",
     "angular2-template-loader": "^0.6.2",
     "core-js": "^2.6.5",
     "fork-ts-checker-webpack-plugin": "^0.5.2",
diff --git a/app/ember/package.json b/app/ember/package.json
index d518dd5e7c6..7b698cfeeb6 100644
--- a/app/ember/package.json
+++ b/app/ember/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/ember",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "Storybook for Ember: Develop Ember Component in isolation with Hot Reloading.",
   "homepage": "https://github.com/storybooks/storybook/tree/master/app/ember",
   "bugs": {
@@ -24,7 +24,7 @@
   },
   "dependencies": {
     "@ember/test-helpers": "^1.5.0",
-    "@storybook/core": "5.1.0-alpha.1",
+    "@storybook/core": "5.1.0-alpha.2",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
diff --git a/app/html/package.json b/app/html/package.json
index 499de62dd89..53190936a58 100644
--- a/app/html/package.json
+++ b/app/html/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/html",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "Storybook for HTML: View HTML snippets in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.1.0-alpha.1",
+    "@storybook/core": "5.1.0-alpha.2",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
diff --git a/app/marko/package.json b/app/marko/package.json
index f716b8b9ea5..1d7f78e4e62 100644
--- a/app/marko/package.json
+++ b/app/marko/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/marko",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "Storybook for Marko: Develop Marko Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -26,7 +26,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.1.0-alpha.1",
+    "@storybook/core": "5.1.0-alpha.2",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
diff --git a/app/mithril/package.json b/app/mithril/package.json
index 18d6ee5a2fe..2462d50feff 100644
--- a/app/mithril/package.json
+++ b/app/mithril/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/mithril",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "Storybook for Mithril: Develop Mithril Component in isolation.",
   "keywords": [
     "storybook"
@@ -27,7 +27,7 @@
   },
   "dependencies": {
     "@babel/plugin-transform-react-jsx": "^7.3.0",
-    "@storybook/core": "5.1.0-alpha.1",
+    "@storybook/core": "5.1.0-alpha.2",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
diff --git a/app/polymer/package.json b/app/polymer/package.json
index fa59d996ecd..566bf52c182 100644
--- a/app/polymer/package.json
+++ b/app/polymer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/polymer",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "Storybook for Polymer: Develop Polymer components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.1.0-alpha.1",
+    "@storybook/core": "5.1.0-alpha.2",
     "@webcomponents/webcomponentsjs": "^1.2.0",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
diff --git a/app/preact/package.json b/app/preact/package.json
index eb9fe09554a..0b9fc92a8ac 100644
--- a/app/preact/package.json
+++ b/app/preact/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/preact",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "Storybook for Preact: Develop Preact Component in isolation.",
   "keywords": [
     "storybook"
@@ -27,7 +27,7 @@
   },
   "dependencies": {
     "@babel/plugin-transform-react-jsx": "^7.3.0",
-    "@storybook/core": "5.1.0-alpha.1",
+    "@storybook/core": "5.1.0-alpha.2",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
diff --git a/app/react-native/package.json b/app/react-native/package.json
index a452b572813..bd0d29b7c1e 100644
--- a/app/react-native/package.json
+++ b/app/react-native/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/react-native",
   "private": true,
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "A better way to develop React Native Components for your app",
   "keywords": [
     "react",
@@ -27,12 +27,12 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.1",
-    "@storybook/channel-websocket": "5.1.0-alpha.1",
-    "@storybook/channels": "5.1.0-alpha.1",
-    "@storybook/core": "5.1.0-alpha.1",
-    "@storybook/core-events": "5.1.0-alpha.1",
-    "@storybook/ui": "5.1.0-alpha.1",
+    "@storybook/addons": "5.1.0-alpha.2",
+    "@storybook/channel-websocket": "5.1.0-alpha.2",
+    "@storybook/channels": "5.1.0-alpha.2",
+    "@storybook/core": "5.1.0-alpha.2",
+    "@storybook/core-events": "5.1.0-alpha.2",
+    "@storybook/ui": "5.1.0-alpha.2",
     "babel-loader": "^8.0.4",
     "babel-plugin-macros": "^2.4.5",
     "babel-plugin-syntax-async-functions": "^6.13.0",
diff --git a/app/react/package.json b/app/react/package.json
index 45bcd28b390..3f2044ad3e4 100644
--- a/app/react/package.json
+++ b/app/react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/react",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "Storybook for React: Develop React Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -29,8 +29,8 @@
     "@babel/plugin-transform-react-constant-elements": "^7.2.0",
     "@babel/preset-flow": "^7.0.0",
     "@babel/preset-react": "^7.0.0",
-    "@storybook/core": "5.1.0-alpha.1",
-    "@storybook/node-logger": "5.1.0-alpha.1",
+    "@storybook/core": "5.1.0-alpha.2",
+    "@storybook/node-logger": "5.1.0-alpha.2",
     "@svgr/webpack": "^4.0.3",
     "babel-plugin-named-asset-import": "^0.3.1",
     "babel-plugin-react-docgen": "^2.0.2",
diff --git a/app/riot/package.json b/app/riot/package.json
index dee44309719..d771c7d43de 100644
--- a/app/riot/package.json
+++ b/app/riot/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/riot",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "Storybook for riot.js: View riot snippets in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.1.0-alpha.1",
+    "@storybook/core": "5.1.0-alpha.2",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
diff --git a/app/svelte/package.json b/app/svelte/package.json
index 5d4cee2d251..9149cb1abbd 100644
--- a/app/svelte/package.json
+++ b/app/svelte/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/svelte",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "Storybook for Svelte: Develop Svelte Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -26,7 +26,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.1.0-alpha.1",
+    "@storybook/core": "5.1.0-alpha.2",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
diff --git a/app/vue/package.json b/app/vue/package.json
index 035744ca450..133706634b9 100644
--- a/app/vue/package.json
+++ b/app/vue/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/vue",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "Storybook for Vue: Develop Vue Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -26,7 +26,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.1.0-alpha.1",
+    "@storybook/core": "5.1.0-alpha.2",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
diff --git a/examples/angular-cli/package.json b/examples/angular-cli/package.json
index 1ced699391d..6cf61d5e585 100644
--- a/examples/angular-cli/package.json
+++ b/examples/angular-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "angular-cli",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "private": true,
   "license": "MIT",
   "scripts": {
@@ -34,18 +34,18 @@
     "@angular-devkit/build-angular": "^0.13.4",
     "@angular/cli": "^7.3.3",
     "@angular/compiler-cli": "^7.2.6",
-    "@storybook/addon-actions": "5.1.0-alpha.1",
-    "@storybook/addon-backgrounds": "5.1.0-alpha.1",
-    "@storybook/addon-centered": "5.1.0-alpha.1",
-    "@storybook/addon-jest": "5.1.0-alpha.1",
-    "@storybook/addon-knobs": "5.1.0-alpha.1",
-    "@storybook/addon-links": "5.1.0-alpha.1",
-    "@storybook/addon-notes": "5.1.0-alpha.1",
-    "@storybook/addon-options": "5.1.0-alpha.1",
-    "@storybook/addon-storyshots": "5.1.0-alpha.1",
-    "@storybook/addon-storysource": "5.1.0-alpha.1",
-    "@storybook/addons": "5.1.0-alpha.1",
-    "@storybook/angular": "5.1.0-alpha.1",
+    "@storybook/addon-actions": "5.1.0-alpha.2",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.2",
+    "@storybook/addon-centered": "5.1.0-alpha.2",
+    "@storybook/addon-jest": "5.1.0-alpha.2",
+    "@storybook/addon-knobs": "5.1.0-alpha.2",
+    "@storybook/addon-links": "5.1.0-alpha.2",
+    "@storybook/addon-notes": "5.1.0-alpha.2",
+    "@storybook/addon-options": "5.1.0-alpha.2",
+    "@storybook/addon-storyshots": "5.1.0-alpha.2",
+    "@storybook/addon-storysource": "5.1.0-alpha.2",
+    "@storybook/addons": "5.1.0-alpha.2",
+    "@storybook/angular": "5.1.0-alpha.2",
     "@types/core-js": "^2.5.0",
     "@types/jest": "^24.0.6",
     "@types/node": "~11.9.5",
diff --git a/examples/cra-kitchen-sink/package.json b/examples/cra-kitchen-sink/package.json
index a52dc0e3abe..20e8e10941b 100644
--- a/examples/cra-kitchen-sink/package.json
+++ b/examples/cra-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "cra-kitchen-sink",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -19,21 +19,21 @@
     "react-lifecycles-compat": "^3.0.4"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.1.0-alpha.1",
-    "@storybook/addon-actions": "5.1.0-alpha.1",
-    "@storybook/addon-backgrounds": "5.1.0-alpha.1",
-    "@storybook/addon-centered": "5.1.0-alpha.1",
-    "@storybook/addon-events": "5.1.0-alpha.1",
-    "@storybook/addon-info": "5.1.0-alpha.1",
-    "@storybook/addon-jest": "5.1.0-alpha.1",
-    "@storybook/addon-knobs": "5.1.0-alpha.1",
-    "@storybook/addon-links": "5.1.0-alpha.1",
-    "@storybook/addon-notes": "5.1.0-alpha.1",
-    "@storybook/addon-options": "5.1.0-alpha.1",
-    "@storybook/addon-storyshots": "5.1.0-alpha.1",
-    "@storybook/addons": "5.1.0-alpha.1",
-    "@storybook/client-logger": "5.1.0-alpha.1",
-    "@storybook/react": "5.1.0-alpha.1",
+    "@storybook/addon-a11y": "5.1.0-alpha.2",
+    "@storybook/addon-actions": "5.1.0-alpha.2",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.2",
+    "@storybook/addon-centered": "5.1.0-alpha.2",
+    "@storybook/addon-events": "5.1.0-alpha.2",
+    "@storybook/addon-info": "5.1.0-alpha.2",
+    "@storybook/addon-jest": "5.1.0-alpha.2",
+    "@storybook/addon-knobs": "5.1.0-alpha.2",
+    "@storybook/addon-links": "5.1.0-alpha.2",
+    "@storybook/addon-notes": "5.1.0-alpha.2",
+    "@storybook/addon-options": "5.1.0-alpha.2",
+    "@storybook/addon-storyshots": "5.1.0-alpha.2",
+    "@storybook/addons": "5.1.0-alpha.2",
+    "@storybook/client-logger": "5.1.0-alpha.2",
+    "@storybook/react": "5.1.0-alpha.2",
     "enzyme": "^3.9.0",
     "enzyme-adapter-react-16": "^1.9.1",
     "enzyme-to-json": "^3.3.5",
diff --git a/examples/cra-ts-kitchen-sink/package.json b/examples/cra-ts-kitchen-sink/package.json
index 0f7995dba53..8497eb71dea 100644
--- a/examples/cra-ts-kitchen-sink/package.json
+++ b/examples/cra-ts-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "cra-ts-kitchen-sink",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -20,11 +20,11 @@
     "react-dom": "^16.8.3"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.1.0-alpha.1",
-    "@storybook/addon-info": "5.1.0-alpha.1",
-    "@storybook/addon-options": "5.1.0-alpha.1",
-    "@storybook/addons": "5.1.0-alpha.1",
-    "@storybook/react": "5.1.0-alpha.1",
+    "@storybook/addon-actions": "5.1.0-alpha.2",
+    "@storybook/addon-info": "5.1.0-alpha.2",
+    "@storybook/addon-options": "5.1.0-alpha.2",
+    "@storybook/addons": "5.1.0-alpha.2",
+    "@storybook/react": "5.1.0-alpha.2",
     "@types/enzyme": "^3.9.0",
     "@types/react": "^16.8.4",
     "@types/react-dom": "^16.8.2",
diff --git a/examples/ember-cli/package.json b/examples/ember-cli/package.json
index 06ad0d4b6d1..be6aae7120b 100644
--- a/examples/ember-cli/package.json
+++ b/examples/ember-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "ember-example",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -15,18 +15,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.3.4",
-    "@storybook/addon-a11y": "5.1.0-alpha.1",
-    "@storybook/addon-actions": "5.1.0-alpha.1",
-    "@storybook/addon-backgrounds": "5.1.0-alpha.1",
-    "@storybook/addon-centered": "5.1.0-alpha.1",
-    "@storybook/addon-knobs": "5.1.0-alpha.1",
-    "@storybook/addon-links": "5.1.0-alpha.1",
-    "@storybook/addon-notes": "5.1.0-alpha.1",
-    "@storybook/addon-options": "5.1.0-alpha.1",
-    "@storybook/addon-storysource": "5.1.0-alpha.1",
-    "@storybook/addon-viewport": "5.1.0-alpha.1",
-    "@storybook/addons": "5.1.0-alpha.1",
-    "@storybook/ember": "5.1.0-alpha.1",
+    "@storybook/addon-a11y": "5.1.0-alpha.2",
+    "@storybook/addon-actions": "5.1.0-alpha.2",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.2",
+    "@storybook/addon-centered": "5.1.0-alpha.2",
+    "@storybook/addon-knobs": "5.1.0-alpha.2",
+    "@storybook/addon-links": "5.1.0-alpha.2",
+    "@storybook/addon-notes": "5.1.0-alpha.2",
+    "@storybook/addon-options": "5.1.0-alpha.2",
+    "@storybook/addon-storysource": "5.1.0-alpha.2",
+    "@storybook/addon-viewport": "5.1.0-alpha.2",
+    "@storybook/addons": "5.1.0-alpha.2",
+    "@storybook/ember": "5.1.0-alpha.2",
     "babel-loader": "^8",
     "broccoli-asset-rev": "^3.0.0",
     "cross-env": "^5.2.0",
diff --git a/examples/html-kitchen-sink/package.json b/examples/html-kitchen-sink/package.json
index 601b2a0901b..d09bcebd368 100644
--- a/examples/html-kitchen-sink/package.json
+++ b/examples/html-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "html-kitchen-sink",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "private": true,
   "description": "",
   "keywords": [],
@@ -14,23 +14,23 @@
     "storybook": "start-storybook -p 9006"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.1.0-alpha.1",
-    "@storybook/addon-actions": "5.1.0-alpha.1",
-    "@storybook/addon-backgrounds": "5.1.0-alpha.1",
-    "@storybook/addon-centered": "5.1.0-alpha.1",
-    "@storybook/addon-events": "5.1.0-alpha.1",
-    "@storybook/addon-jest": "5.1.0-alpha.1",
-    "@storybook/addon-knobs": "5.1.0-alpha.1",
-    "@storybook/addon-links": "5.1.0-alpha.1",
-    "@storybook/addon-notes": "5.1.0-alpha.1",
-    "@storybook/addon-options": "5.1.0-alpha.1",
-    "@storybook/addon-storyshots": "5.1.0-alpha.1",
-    "@storybook/addon-storysource": "5.1.0-alpha.1",
-    "@storybook/addon-viewport": "5.1.0-alpha.1",
-    "@storybook/addons": "5.1.0-alpha.1",
-    "@storybook/core": "5.1.0-alpha.1",
-    "@storybook/core-events": "5.1.0-alpha.1",
-    "@storybook/html": "5.1.0-alpha.1",
+    "@storybook/addon-a11y": "5.1.0-alpha.2",
+    "@storybook/addon-actions": "5.1.0-alpha.2",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.2",
+    "@storybook/addon-centered": "5.1.0-alpha.2",
+    "@storybook/addon-events": "5.1.0-alpha.2",
+    "@storybook/addon-jest": "5.1.0-alpha.2",
+    "@storybook/addon-knobs": "5.1.0-alpha.2",
+    "@storybook/addon-links": "5.1.0-alpha.2",
+    "@storybook/addon-notes": "5.1.0-alpha.2",
+    "@storybook/addon-options": "5.1.0-alpha.2",
+    "@storybook/addon-storyshots": "5.1.0-alpha.2",
+    "@storybook/addon-storysource": "5.1.0-alpha.2",
+    "@storybook/addon-viewport": "5.1.0-alpha.2",
+    "@storybook/addons": "5.1.0-alpha.2",
+    "@storybook/core": "5.1.0-alpha.2",
+    "@storybook/core-events": "5.1.0-alpha.2",
+    "@storybook/html": "5.1.0-alpha.2",
     "eventemitter3": "^3.1.0",
     "format-json": "^1.0.3",
     "global": "^4.3.2",
diff --git a/examples/marko-cli/package.json b/examples/marko-cli/package.json
index a159c209e79..187f382a445 100644
--- a/examples/marko-cli/package.json
+++ b/examples/marko-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "marko-cli",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "private": true,
   "description": "Demo of how to build an app using marko-starter",
   "repository": {
@@ -24,12 +24,12 @@
     "marko-starter": "^2.0.4"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.1.0-alpha.1",
-    "@storybook/addon-knobs": "5.1.0-alpha.1",
-    "@storybook/addon-options": "5.1.0-alpha.1",
-    "@storybook/addon-storysource": "5.1.0-alpha.1",
-    "@storybook/addons": "5.1.0-alpha.1",
-    "@storybook/marko": "5.1.0-alpha.1",
+    "@storybook/addon-actions": "5.1.0-alpha.2",
+    "@storybook/addon-knobs": "5.1.0-alpha.2",
+    "@storybook/addon-options": "5.1.0-alpha.2",
+    "@storybook/addon-storysource": "5.1.0-alpha.2",
+    "@storybook/addons": "5.1.0-alpha.2",
+    "@storybook/marko": "5.1.0-alpha.2",
     "prettier": "^1.16.4",
     "webpack": "^4.29.6"
   }
diff --git a/examples/mithril-kitchen-sink/package.json b/examples/mithril-kitchen-sink/package.json
index 52bb6664325..f18f3717509 100644
--- a/examples/mithril-kitchen-sink/package.json
+++ b/examples/mithril-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "mithril-example",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -11,18 +11,18 @@
     "mithril": "^1.1.6"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.1.0-alpha.1",
-    "@storybook/addon-backgrounds": "5.1.0-alpha.1",
-    "@storybook/addon-centered": "5.1.0-alpha.1",
-    "@storybook/addon-knobs": "5.1.0-alpha.1",
-    "@storybook/addon-links": "5.1.0-alpha.1",
-    "@storybook/addon-notes": "5.1.0-alpha.1",
-    "@storybook/addon-options": "5.1.0-alpha.1",
-    "@storybook/addon-storyshots": "5.1.0-alpha.1",
-    "@storybook/addon-storysource": "5.1.0-alpha.1",
-    "@storybook/addon-viewport": "5.1.0-alpha.1",
-    "@storybook/addons": "5.1.0-alpha.1",
-    "@storybook/mithril": "5.1.0-alpha.1",
+    "@storybook/addon-actions": "5.1.0-alpha.2",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.2",
+    "@storybook/addon-centered": "5.1.0-alpha.2",
+    "@storybook/addon-knobs": "5.1.0-alpha.2",
+    "@storybook/addon-links": "5.1.0-alpha.2",
+    "@storybook/addon-notes": "5.1.0-alpha.2",
+    "@storybook/addon-options": "5.1.0-alpha.2",
+    "@storybook/addon-storyshots": "5.1.0-alpha.2",
+    "@storybook/addon-storysource": "5.1.0-alpha.2",
+    "@storybook/addon-viewport": "5.1.0-alpha.2",
+    "@storybook/addons": "5.1.0-alpha.2",
+    "@storybook/mithril": "5.1.0-alpha.2",
     "webpack": "^4.29.6"
   }
 }
diff --git a/examples/official-storybook/package.json b/examples/official-storybook/package.json
index f8a91da234e..55693745d2c 100644
--- a/examples/official-storybook/package.json
+++ b/examples/official-storybook/package.json
@@ -1,6 +1,6 @@
 {
   "name": "official-storybook",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -13,29 +13,29 @@
     "storybook": "cross-env STORYBOOK_DISPLAY_WARNING=true DISPLAY_WARNING=true start-storybook -p 9011 -c ./ -s built-storybooks --no-dll"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.1.0-alpha.1",
-    "@storybook/addon-actions": "5.1.0-alpha.1",
-    "@storybook/addon-backgrounds": "5.1.0-alpha.1",
-    "@storybook/addon-centered": "5.1.0-alpha.1",
-    "@storybook/addon-cssresources": "5.1.0-alpha.1",
-    "@storybook/addon-events": "5.1.0-alpha.1",
-    "@storybook/addon-graphql": "5.1.0-alpha.1",
-    "@storybook/addon-info": "5.1.0-alpha.1",
-    "@storybook/addon-jest": "5.1.0-alpha.1",
-    "@storybook/addon-knobs": "5.1.0-alpha.1",
-    "@storybook/addon-links": "5.1.0-alpha.1",
-    "@storybook/addon-notes": "5.1.0-alpha.1",
-    "@storybook/addon-options": "5.1.0-alpha.1",
-    "@storybook/addon-storyshots": "5.1.0-alpha.1",
-    "@storybook/addon-storyshots-puppeteer": "5.1.0-alpha.1",
-    "@storybook/addon-storysource": "5.1.0-alpha.1",
-    "@storybook/addon-viewport": "5.1.0-alpha.1",
-    "@storybook/addons": "5.1.0-alpha.1",
-    "@storybook/components": "5.1.0-alpha.1",
-    "@storybook/core-events": "5.1.0-alpha.1",
-    "@storybook/node-logger": "5.1.0-alpha.1",
-    "@storybook/react": "5.1.0-alpha.1",
-    "@storybook/theming": "5.1.0-alpha.1",
+    "@storybook/addon-a11y": "5.1.0-alpha.2",
+    "@storybook/addon-actions": "5.1.0-alpha.2",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.2",
+    "@storybook/addon-centered": "5.1.0-alpha.2",
+    "@storybook/addon-cssresources": "5.1.0-alpha.2",
+    "@storybook/addon-events": "5.1.0-alpha.2",
+    "@storybook/addon-graphql": "5.1.0-alpha.2",
+    "@storybook/addon-info": "5.1.0-alpha.2",
+    "@storybook/addon-jest": "5.1.0-alpha.2",
+    "@storybook/addon-knobs": "5.1.0-alpha.2",
+    "@storybook/addon-links": "5.1.0-alpha.2",
+    "@storybook/addon-notes": "5.1.0-alpha.2",
+    "@storybook/addon-options": "5.1.0-alpha.2",
+    "@storybook/addon-storyshots": "5.1.0-alpha.2",
+    "@storybook/addon-storyshots-puppeteer": "5.1.0-alpha.2",
+    "@storybook/addon-storysource": "5.1.0-alpha.2",
+    "@storybook/addon-viewport": "5.1.0-alpha.2",
+    "@storybook/addons": "5.1.0-alpha.2",
+    "@storybook/components": "5.1.0-alpha.2",
+    "@storybook/core-events": "5.1.0-alpha.2",
+    "@storybook/node-logger": "5.1.0-alpha.2",
+    "@storybook/react": "5.1.0-alpha.2",
+    "@storybook/theming": "5.1.0-alpha.2",
     "cors": "^2.8.5",
     "cross-env": "^5.2.0",
     "enzyme-to-json": "^3.3.5",
diff --git a/examples/polymer-cli/package.json b/examples/polymer-cli/package.json
index 7e7d9bf53bf..0d718f4f978 100644
--- a/examples/polymer-cli/package.json
+++ b/examples/polymer-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "polymer-cli",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -10,15 +10,15 @@
   },
   "dependencies": {
     "@polymer/polymer": "^2.6.0",
-    "@storybook/addon-actions": "5.1.0-alpha.1",
-    "@storybook/addon-backgrounds": "5.1.0-alpha.1",
-    "@storybook/addon-knobs": "5.1.0-alpha.1",
-    "@storybook/addon-links": "5.1.0-alpha.1",
-    "@storybook/addon-notes": "5.1.0-alpha.1",
-    "@storybook/addon-options": "5.1.0-alpha.1",
-    "@storybook/addon-storysource": "5.1.0-alpha.1",
-    "@storybook/addon-viewport": "5.1.0-alpha.1",
-    "@storybook/polymer": "5.1.0-alpha.1",
+    "@storybook/addon-actions": "5.1.0-alpha.2",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.2",
+    "@storybook/addon-knobs": "5.1.0-alpha.2",
+    "@storybook/addon-links": "5.1.0-alpha.2",
+    "@storybook/addon-notes": "5.1.0-alpha.2",
+    "@storybook/addon-options": "5.1.0-alpha.2",
+    "@storybook/addon-storysource": "5.1.0-alpha.2",
+    "@storybook/addon-viewport": "5.1.0-alpha.2",
+    "@storybook/polymer": "5.1.0-alpha.2",
     "@webcomponents/webcomponentsjs": "^1.2.0",
     "global": "^4.3.2",
     "lit-html": "^1.0.0",
diff --git a/examples/preact-kitchen-sink/package.json b/examples/preact-kitchen-sink/package.json
index fc48ea8d136..196cc95b8ad 100644
--- a/examples/preact-kitchen-sink/package.json
+++ b/examples/preact-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "preact-example",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -16,18 +16,18 @@
   "devDependencies": {
     "@babel/core": "^7.3.4",
     "@babel/plugin-transform-runtime": "^7.2.0",
-    "@storybook/addon-actions": "5.1.0-alpha.1",
-    "@storybook/addon-backgrounds": "5.1.0-alpha.1",
-    "@storybook/addon-centered": "5.1.0-alpha.1",
-    "@storybook/addon-knobs": "5.1.0-alpha.1",
-    "@storybook/addon-links": "5.1.0-alpha.1",
-    "@storybook/addon-notes": "5.1.0-alpha.1",
-    "@storybook/addon-options": "5.1.0-alpha.1",
-    "@storybook/addon-storyshots": "5.1.0-alpha.1",
-    "@storybook/addon-storysource": "5.1.0-alpha.1",
-    "@storybook/addon-viewport": "5.1.0-alpha.1",
-    "@storybook/addons": "5.1.0-alpha.1",
-    "@storybook/preact": "5.1.0-alpha.1",
+    "@storybook/addon-actions": "5.1.0-alpha.2",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.2",
+    "@storybook/addon-centered": "5.1.0-alpha.2",
+    "@storybook/addon-knobs": "5.1.0-alpha.2",
+    "@storybook/addon-links": "5.1.0-alpha.2",
+    "@storybook/addon-notes": "5.1.0-alpha.2",
+    "@storybook/addon-options": "5.1.0-alpha.2",
+    "@storybook/addon-storyshots": "5.1.0-alpha.2",
+    "@storybook/addon-storysource": "5.1.0-alpha.2",
+    "@storybook/addon-viewport": "5.1.0-alpha.2",
+    "@storybook/addons": "5.1.0-alpha.2",
+    "@storybook/preact": "5.1.0-alpha.2",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
     "file-loader": "^3.0.1",
diff --git a/examples/riot-kitchen-sink/package.json b/examples/riot-kitchen-sink/package.json
index 28581ab9e9b..371fe50a54e 100644
--- a/examples/riot-kitchen-sink/package.json
+++ b/examples/riot-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "riot-example",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -16,18 +16,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.3.4",
-    "@storybook/addon-actions": "5.1.0-alpha.1",
-    "@storybook/addon-backgrounds": "5.1.0-alpha.1",
-    "@storybook/addon-centered": "5.1.0-alpha.1",
-    "@storybook/addon-knobs": "5.1.0-alpha.1",
-    "@storybook/addon-links": "5.1.0-alpha.1",
-    "@storybook/addon-notes": "5.1.0-alpha.1",
-    "@storybook/addon-options": "5.1.0-alpha.1",
-    "@storybook/addon-storyshots": "5.1.0-alpha.1",
-    "@storybook/addon-storysource": "5.1.0-alpha.1",
-    "@storybook/addon-viewport": "5.1.0-alpha.1",
-    "@storybook/addons": "5.1.0-alpha.1",
-    "@storybook/riot": "5.1.0-alpha.1",
+    "@storybook/addon-actions": "5.1.0-alpha.2",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.2",
+    "@storybook/addon-centered": "5.1.0-alpha.2",
+    "@storybook/addon-knobs": "5.1.0-alpha.2",
+    "@storybook/addon-links": "5.1.0-alpha.2",
+    "@storybook/addon-notes": "5.1.0-alpha.2",
+    "@storybook/addon-options": "5.1.0-alpha.2",
+    "@storybook/addon-storyshots": "5.1.0-alpha.2",
+    "@storybook/addon-storysource": "5.1.0-alpha.2",
+    "@storybook/addon-viewport": "5.1.0-alpha.2",
+    "@storybook/addons": "5.1.0-alpha.2",
+    "@storybook/riot": "5.1.0-alpha.2",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
     "file-loader": "^3.0.1",
diff --git a/examples/svelte-kitchen-sink/package.json b/examples/svelte-kitchen-sink/package.json
index 31dea343eaa..2438bd9bb14 100644
--- a/examples/svelte-kitchen-sink/package.json
+++ b/examples/svelte-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "svelte-example",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -11,17 +11,17 @@
     "global": "^4.3.2"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.1.0-alpha.1",
-    "@storybook/addon-backgrounds": "5.1.0-alpha.1",
-    "@storybook/addon-centered": "5.1.0-alpha.1",
-    "@storybook/addon-knobs": "5.1.0-alpha.1",
-    "@storybook/addon-links": "5.1.0-alpha.1",
-    "@storybook/addon-notes": "5.1.0-alpha.1",
-    "@storybook/addon-options": "5.1.0-alpha.1",
-    "@storybook/addon-storyshots": "5.1.0-alpha.1",
-    "@storybook/addon-storysource": "5.1.0-alpha.1",
-    "@storybook/addon-viewport": "5.1.0-alpha.1",
-    "@storybook/addons": "5.1.0-alpha.1",
-    "@storybook/svelte": "5.1.0-alpha.1"
+    "@storybook/addon-actions": "5.1.0-alpha.2",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.2",
+    "@storybook/addon-centered": "5.1.0-alpha.2",
+    "@storybook/addon-knobs": "5.1.0-alpha.2",
+    "@storybook/addon-links": "5.1.0-alpha.2",
+    "@storybook/addon-notes": "5.1.0-alpha.2",
+    "@storybook/addon-options": "5.1.0-alpha.2",
+    "@storybook/addon-storyshots": "5.1.0-alpha.2",
+    "@storybook/addon-storysource": "5.1.0-alpha.2",
+    "@storybook/addon-viewport": "5.1.0-alpha.2",
+    "@storybook/addons": "5.1.0-alpha.2",
+    "@storybook/svelte": "5.1.0-alpha.2"
   }
 }
diff --git a/examples/vue-kitchen-sink/package.json b/examples/vue-kitchen-sink/package.json
index bcc6c75167e..ecdb67e49ca 100644
--- a/examples/vue-kitchen-sink/package.json
+++ b/examples/vue-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "vue-example",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -15,18 +15,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.3.4",
-    "@storybook/addon-actions": "5.1.0-alpha.1",
-    "@storybook/addon-backgrounds": "5.1.0-alpha.1",
-    "@storybook/addon-centered": "5.1.0-alpha.1",
-    "@storybook/addon-knobs": "5.1.0-alpha.1",
-    "@storybook/addon-links": "5.1.0-alpha.1",
-    "@storybook/addon-notes": "5.1.0-alpha.1",
-    "@storybook/addon-options": "5.1.0-alpha.1",
-    "@storybook/addon-storyshots": "5.1.0-alpha.1",
-    "@storybook/addon-storysource": "5.1.0-alpha.1",
-    "@storybook/addon-viewport": "5.1.0-alpha.1",
-    "@storybook/addons": "5.1.0-alpha.1",
-    "@storybook/vue": "5.1.0-alpha.1",
+    "@storybook/addon-actions": "5.1.0-alpha.2",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.2",
+    "@storybook/addon-centered": "5.1.0-alpha.2",
+    "@storybook/addon-knobs": "5.1.0-alpha.2",
+    "@storybook/addon-links": "5.1.0-alpha.2",
+    "@storybook/addon-notes": "5.1.0-alpha.2",
+    "@storybook/addon-options": "5.1.0-alpha.2",
+    "@storybook/addon-storyshots": "5.1.0-alpha.2",
+    "@storybook/addon-storysource": "5.1.0-alpha.2",
+    "@storybook/addon-viewport": "5.1.0-alpha.2",
+    "@storybook/addons": "5.1.0-alpha.2",
+    "@storybook/vue": "5.1.0-alpha.2",
     "babel-core": "^7.0.0-bridge.0",
     "babel-loader": "^8.0.5",
     "cross-env": "^5.2.0",
diff --git a/lerna.json b/lerna.json
index 768e061c139..aa990454492 100644
--- a/lerna.json
+++ b/lerna.json
@@ -11,5 +11,5 @@
   "npmClient": "yarn",
   "useWorkspaces": true,
   "registry": "https://registry.npmjs.org",
-  "version": "5.1.0-alpha.1"
+  "version": "5.1.0-alpha.2"
 }
diff --git a/lib/addons/package.json b/lib/addons/package.json
index 350cd458def..87d9f13787e 100644
--- a/lib/addons/package.json
+++ b/lib/addons/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addons",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "Storybook addons store",
   "keywords": [
     "storybook"
@@ -21,8 +21,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.1.0-alpha.1",
-    "@storybook/client-logger": "5.1.0-alpha.1",
+    "@storybook/channels": "5.1.0-alpha.2",
+    "@storybook/client-logger": "5.1.0-alpha.2",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "util-deprecate": "^1.0.2"
diff --git a/lib/channel-postmessage/package.json b/lib/channel-postmessage/package.json
index 6ece812b1b6..80c8a7fe71f 100644
--- a/lib/channel-postmessage/package.json
+++ b/lib/channel-postmessage/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channel-postmessage",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "",
   "keywords": [
     "storybook"
@@ -21,8 +21,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.1.0-alpha.1",
-    "@storybook/client-logger": "5.1.0-alpha.1",
+    "@storybook/channels": "5.1.0-alpha.2",
+    "@storybook/client-logger": "5.1.0-alpha.2",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "telejson": "^2.1.1"
diff --git a/lib/channel-websocket/package.json b/lib/channel-websocket/package.json
index fc5c4393230..cd36b830292 100644
--- a/lib/channel-websocket/package.json
+++ b/lib/channel-websocket/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channel-websocket",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "",
   "keywords": [
     "storybook"
@@ -21,7 +21,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.1.0-alpha.1",
+    "@storybook/channels": "5.1.0-alpha.2",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "json-fn": "^1.1.1"
diff --git a/lib/channels/package.json b/lib/channels/package.json
index 2abb40bd6f4..c80c7b009cc 100644
--- a/lib/channels/package.json
+++ b/lib/channels/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channels",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/cli/package.json b/lib/cli/package.json
index 00dcbcfe84e..14f99f651b9 100644
--- a/lib/cli/package.json
+++ b/lib/cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/cli",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "Storybook's CLI - easiest method of adding storybook to your projects",
   "keywords": [
     "cli",
@@ -30,7 +30,7 @@
     "@babel/core": "^7.3.4",
     "@babel/preset-env": "^7.3.4",
     "@babel/register": "^7.0.0",
-    "@storybook/codemod": "5.1.0-alpha.1",
+    "@storybook/codemod": "5.1.0-alpha.2",
     "chalk": "^2.4.1",
     "commander": "^2.19.0",
     "core-js": "^2.6.5",
@@ -44,31 +44,31 @@
     "update-notifier": "^2.5.0"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.1.0-alpha.1",
-    "@storybook/addon-centered": "5.1.0-alpha.1",
-    "@storybook/addon-graphql": "5.1.0-alpha.1",
-    "@storybook/addon-info": "5.1.0-alpha.1",
-    "@storybook/addon-knobs": "5.1.0-alpha.1",
-    "@storybook/addon-links": "5.1.0-alpha.1",
-    "@storybook/addon-notes": "5.1.0-alpha.1",
-    "@storybook/addon-options": "5.1.0-alpha.1",
-    "@storybook/addon-storyshots": "5.1.0-alpha.1",
-    "@storybook/addons": "5.1.0-alpha.1",
-    "@storybook/angular": "5.1.0-alpha.1",
-    "@storybook/channel-postmessage": "5.1.0-alpha.1",
-    "@storybook/channel-websocket": "5.1.0-alpha.1",
-    "@storybook/channels": "5.1.0-alpha.1",
-    "@storybook/ember": "5.1.0-alpha.1",
-    "@storybook/html": "5.1.0-alpha.1",
-    "@storybook/marko": "5.1.0-alpha.1",
-    "@storybook/mithril": "5.1.0-alpha.1",
-    "@storybook/polymer": "5.1.0-alpha.1",
-    "@storybook/preact": "5.1.0-alpha.1",
-    "@storybook/react": "5.1.0-alpha.1",
-    "@storybook/react-native": "5.1.0-alpha.1",
-    "@storybook/riot": "5.1.0-alpha.1",
-    "@storybook/ui": "5.1.0-alpha.1",
-    "@storybook/vue": "5.1.0-alpha.1"
+    "@storybook/addon-actions": "5.1.0-alpha.2",
+    "@storybook/addon-centered": "5.1.0-alpha.2",
+    "@storybook/addon-graphql": "5.1.0-alpha.2",
+    "@storybook/addon-info": "5.1.0-alpha.2",
+    "@storybook/addon-knobs": "5.1.0-alpha.2",
+    "@storybook/addon-links": "5.1.0-alpha.2",
+    "@storybook/addon-notes": "5.1.0-alpha.2",
+    "@storybook/addon-options": "5.1.0-alpha.2",
+    "@storybook/addon-storyshots": "5.1.0-alpha.2",
+    "@storybook/addons": "5.1.0-alpha.2",
+    "@storybook/angular": "5.1.0-alpha.2",
+    "@storybook/channel-postmessage": "5.1.0-alpha.2",
+    "@storybook/channel-websocket": "5.1.0-alpha.2",
+    "@storybook/channels": "5.1.0-alpha.2",
+    "@storybook/ember": "5.1.0-alpha.2",
+    "@storybook/html": "5.1.0-alpha.2",
+    "@storybook/marko": "5.1.0-alpha.2",
+    "@storybook/mithril": "5.1.0-alpha.2",
+    "@storybook/polymer": "5.1.0-alpha.2",
+    "@storybook/preact": "5.1.0-alpha.2",
+    "@storybook/react": "5.1.0-alpha.2",
+    "@storybook/react-native": "5.1.0-alpha.2",
+    "@storybook/riot": "5.1.0-alpha.2",
+    "@storybook/ui": "5.1.0-alpha.2",
+    "@storybook/vue": "5.1.0-alpha.2"
   },
   "publishConfig": {
     "access": "public"
diff --git a/lib/client-api/package.json b/lib/client-api/package.json
index dfa292e13d3..2bf19ef9c60 100644
--- a/lib/client-api/package.json
+++ b/lib/client-api/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/client-api",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "Storybook Client API",
   "keywords": [
     "storybook"
@@ -20,10 +20,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.1",
-    "@storybook/client-logger": "5.1.0-alpha.1",
-    "@storybook/core-events": "5.1.0-alpha.1",
-    "@storybook/router": "5.1.0-alpha.1",
+    "@storybook/addons": "5.1.0-alpha.2",
+    "@storybook/client-logger": "5.1.0-alpha.2",
+    "@storybook/core-events": "5.1.0-alpha.2",
+    "@storybook/router": "5.1.0-alpha.2",
     "common-tags": "^1.8.0",
     "eventemitter3": "^3.1.0",
     "global": "^4.3.2",
diff --git a/lib/client-logger/package.json b/lib/client-logger/package.json
index c24bcf57f83..05ab59eebcb 100644
--- a/lib/client-logger/package.json
+++ b/lib/client-logger/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/client-logger",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/codemod/package.json b/lib/codemod/package.json
index 74628c0432e..b2a67525411 100644
--- a/lib/codemod/package.json
+++ b/lib/codemod/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/codemod",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "A collection of codemod scripts written with JSCodeshift",
   "keywords": [
     "storybook"
diff --git a/lib/components/package.json b/lib/components/package.json
index 23a9c068fd7..6f3037925b5 100644
--- a/lib/components/package.json
+++ b/lib/components/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/components",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "Core Storybook Components",
   "keywords": [
     "storybook"
@@ -21,11 +21,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.1",
-    "@storybook/client-logger": "5.1.0-alpha.1",
-    "@storybook/core-events": "5.1.0-alpha.1",
-    "@storybook/router": "5.1.0-alpha.1",
-    "@storybook/theming": "5.1.0-alpha.1",
+    "@storybook/addons": "5.1.0-alpha.2",
+    "@storybook/client-logger": "5.1.0-alpha.2",
+    "@storybook/core-events": "5.1.0-alpha.2",
+    "@storybook/router": "5.1.0-alpha.2",
+    "@storybook/theming": "5.1.0-alpha.2",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "js-beautify": "^1.8.9",
diff --git a/lib/core-events/package.json b/lib/core-events/package.json
index c0c1611d08e..9a2d62be954 100644
--- a/lib/core-events/package.json
+++ b/lib/core-events/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/core-events",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "Event names used in storybook core",
   "keywords": [
     "storybook"
diff --git a/lib/core/package.json b/lib/core/package.json
index 5be6a9e72e4..072a488e8b7 100644
--- a/lib/core/package.json
+++ b/lib/core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/core",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "Storybook framework-agnostic API",
   "keywords": [
     "storybook"
@@ -25,14 +25,14 @@
     "@babel/plugin-syntax-dynamic-import": "^7.2.0",
     "@babel/plugin-transform-react-constant-elements": "^7.2.0",
     "@babel/preset-env": "^7.3.4",
-    "@storybook/addons": "5.1.0-alpha.1",
-    "@storybook/channel-postmessage": "5.1.0-alpha.1",
-    "@storybook/client-api": "5.1.0-alpha.1",
-    "@storybook/client-logger": "5.1.0-alpha.1",
-    "@storybook/core-events": "5.1.0-alpha.1",
-    "@storybook/node-logger": "5.1.0-alpha.1",
-    "@storybook/router": "5.1.0-alpha.1",
-    "@storybook/ui": "5.1.0-alpha.1",
+    "@storybook/addons": "5.1.0-alpha.2",
+    "@storybook/channel-postmessage": "5.1.0-alpha.2",
+    "@storybook/client-api": "5.1.0-alpha.2",
+    "@storybook/client-logger": "5.1.0-alpha.2",
+    "@storybook/core-events": "5.1.0-alpha.2",
+    "@storybook/node-logger": "5.1.0-alpha.2",
+    "@storybook/router": "5.1.0-alpha.2",
+    "@storybook/ui": "5.1.0-alpha.2",
     "airbnb-js-shims": "^1 || ^2",
     "autoprefixer": "^9.4.9",
     "babel-plugin-add-react-displayname": "^0.0.5",
diff --git a/lib/node-logger/package.json b/lib/node-logger/package.json
index 9fc0219fd3d..b83a6328964 100644
--- a/lib/node-logger/package.json
+++ b/lib/node-logger/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/node-logger",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/router/package.json b/lib/router/package.json
index 2ff312a60b0..8d5a60dc9aa 100644
--- a/lib/router/package.json
+++ b/lib/router/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/router",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "Core Storybook Router",
   "keywords": [
     "storybook"
@@ -21,7 +21,7 @@
   },
   "dependencies": {
     "@reach/router": "^1.2.1",
-    "@storybook/theming": "5.1.0-alpha.1",
+    "@storybook/theming": "5.1.0-alpha.2",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
diff --git a/lib/theming/package.json b/lib/theming/package.json
index 7efe4e9dc19..514ed29907e 100644
--- a/lib/theming/package.json
+++ b/lib/theming/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/theming",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "Core Storybook Components",
   "keywords": [
     "storybook"
@@ -23,9 +23,9 @@
   "dependencies": {
     "@emotion/core": "^10.0.7",
     "@emotion/styled": "^10.0.7",
-    "@storybook/client-logger": "5.1.0-alpha.1",
-    "core-js": "^2.6.5",
+    "@storybook/client-logger": "5.1.0-alpha.2",
     "common-tags": "^1.8.0",
+    "core-js": "^2.6.5",
     "deep-object-diff": "^1.1.0",
     "emotion-theming": "^10.0.7",
     "global": "^4.3.2",
diff --git a/lib/ui/package.json b/lib/ui/package.json
index 09d29321a83..f88ab00cf41 100644
--- a/lib/ui/package.json
+++ b/lib/ui/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/ui",
-  "version": "5.1.0-alpha.1",
+  "version": "5.1.0-alpha.2",
   "description": "Core Storybook UI",
   "keywords": [
     "storybook"
@@ -22,12 +22,12 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.1",
-    "@storybook/client-logger": "5.1.0-alpha.1",
-    "@storybook/components": "5.1.0-alpha.1",
-    "@storybook/core-events": "5.1.0-alpha.1",
-    "@storybook/router": "5.1.0-alpha.1",
-    "@storybook/theming": "5.1.0-alpha.1",
+    "@storybook/addons": "5.1.0-alpha.2",
+    "@storybook/client-logger": "5.1.0-alpha.2",
+    "@storybook/components": "5.1.0-alpha.2",
+    "@storybook/core-events": "5.1.0-alpha.2",
+    "@storybook/router": "5.1.0-alpha.2",
+    "@storybook/theming": "5.1.0-alpha.2",
     "core-js": "^2.6.5",
     "fast-deep-equal": "^2.0.1",
     "fuzzy-search": "^3.0.1",

From 60341d9d2625265897af596cd3af864c71cc197e Mon Sep 17 00:00:00 2001
From: "dependabot[bot]" <support@dependabot.com>
Date: Fri, 8 Mar 2019 10:41:09 +0000
Subject: [PATCH 213/249] Bump marko from 4.15.3 to 4.15.4

Bumps [marko](https://github.com/marko-js/marko) from 4.15.3 to 4.15.4.
- [Release notes](https://github.com/marko-js/marko/releases)
- [Changelog](https://github.com/marko-js/marko/blob/master/CHANGELOG.md)
- [Commits](https://github.com/marko-js/marko/compare/v4.15.3...v4.15.4)

Signed-off-by: dependabot[bot] <support@dependabot.com>
---
 examples/marko-cli/package.json |  2 +-
 yarn.lock                       | 10 ++++++----
 2 files changed, 7 insertions(+), 5 deletions(-)

diff --git a/examples/marko-cli/package.json b/examples/marko-cli/package.json
index 187f382a445..79e4956b56a 100644
--- a/examples/marko-cli/package.json
+++ b/examples/marko-cli/package.json
@@ -20,7 +20,7 @@
     "test": "npm run lint"
   },
   "dependencies": {
-    "marko": "^4.15.2",
+    "marko": "^4.15.4",
     "marko-starter": "^2.0.4"
   },
   "devDependencies": {
diff --git a/yarn.lock b/yarn.lock
index d219608bd19..c7ee1b7c30c 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -11139,6 +11139,7 @@ graphql-request@^1.5.0:
 graphql@^0.13.2, graphql@^14.1.1:
   version "0.13.2"
   resolved "https://registry.yarnpkg.com/graphql/-/graphql-0.13.2.tgz#4c740ae3c222823e7004096f832e7b93b2108270"
+  integrity sha512-QZ5BL8ZO/B20VA8APauGBg3GyEgZ19eduvpLWoq5x7gMmWnHoy8rlQWPLmWgFvo1yNgjSEFMesmS4R6pPr7xog==
   dependencies:
     iterall "^1.2.1"
 
@@ -12822,6 +12823,7 @@ istextorbinary@2.1.0:
 iterall@^1.2.1:
   version "1.2.2"
   resolved "https://registry.yarnpkg.com/iterall/-/iterall-1.2.2.tgz#92d70deb8028e0c39ff3164fdbf4d8b088130cd7"
+  integrity sha512-yynBb1g+RFUPY64fTrFv7nsjRrENBQJaX2UL+2Szc9REFrSNm1rpSXHGzhmAy7a9uv3vlvgBlXnf9RqmPH1/DA==
 
 jasmine-core@~2.8.0:
   version "2.8.0"
@@ -15251,10 +15253,10 @@ marko-starter@^2.0.4:
     routes-table "^1.2.1"
     try-require "^1.2.1"
 
-marko@^4.1.1, marko@^4.10.0, marko@^4.15.2:
-  version "4.15.3"
-  resolved "https://registry.yarnpkg.com/marko/-/marko-4.15.3.tgz#26dae76b556f55eadcea4faa484e5db8fa3f7256"
-  integrity sha512-wKUS9nma1r7AAWX+uak2rt0VQ65isGtKi9nRRgoLtmmQfDyUEB2+Ov5Rop9j/zUnkyHMm7bpydHVcTHk0TL9qg==
+marko@^4.1.1, marko@^4.10.0, marko@^4.15.4:
+  version "4.15.4"
+  resolved "https://registry.yarnpkg.com/marko/-/marko-4.15.4.tgz#120ed1fefde8852e2e7208e7f61d9ea1da26bbb9"
+  integrity sha512-lddnuJJSzBAfXENgVDmUCXuRXErmFvPbz5rI6936v5oLh2AOTiGcHBpQ7M/oTpvL3vJD319IWB8lgOwvj0TPgQ==
   dependencies:
     app-module-path "^2.2.0"
     argly "^1.0.0"

From 0013b4744912909a2d56137d270dfe0303bf2f67 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Fri, 8 Mar 2019 22:46:41 +0800
Subject: [PATCH 214/249] 5.1.0-alpha.2 versions.json

---
 docs/src/versions/next.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/docs/src/versions/next.json b/docs/src/versions/next.json
index 3cc3f220c0c..02e20cce76e 100644
--- a/docs/src/versions/next.json
+++ b/docs/src/versions/next.json
@@ -1 +1 @@
-{"version":"5.1.0-alpha.1","info":{"plain":"### Bug Fixes\n\n* CLI: Fix missing iframe.html in absolute path output directory ([#5947](https://github.com/storybooks/storybook/pull/5947))\n* Addon-knobs: Added debouncing between keystrokes to speed up component rendering ([#5811](https://github.com/storybooks/storybook/pull/5811))\n* UI: Fix search in production mode ([#5909](https://github.com/storybooks/storybook/pull/5909))\n\n### Maintenance\n\n* ADD delay to rendering the acceptance stories ([#5943](https://github.com/storybooks/storybook/pull/5943))\n* Split versions.json into two files ([#5896](https://github.com/storybooks/storybook/pull/5896))"}}
\ No newline at end of file
+{"version":"5.1.0-alpha.2","info":{"plain":"### Bug Fixes\n\n* Core: support unicode chars in story IDs ([#5964](https://github.com/storybooks/storybook/pull/5964))\n* Core: Add core-js dependencies where it was missing ([#5961](https://github.com/storybooks/storybook/pull/5961))\n\n### Maintenance\n\n* Addon-a11y: Migrate to typescript ([#5738](https://github.com/storybooks/storybook/pull/5738))"}}
\ No newline at end of file

From 0b1abda08dc8de7f1d4d7a2ab09ceb80892a34c1 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Fri, 8 Mar 2019 23:09:16 +0800
Subject: [PATCH 215/249] 4.1.14 changelog

---
 CHANGELOG.md | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 7df24f2f9ae..b73c100d0b8 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,9 @@
+## 4.1.14 (March 8, 2019)
+
+### Dependency Upgrades
+
+* React-native: Fix RN 0.58.5 / support 0.59 via react-native-modal-datetime-picker 6.0.0 ([#4425](https://github.com/storybooks/storybook/pull/4425))
+
 ## 5.1.0-alpha.2 (March 8, 2019)
 
 ### Bug Fixes

From 05713160ac1baaf6fb15678773eb2e12ccf0f81d Mon Sep 17 00:00:00 2001
From: Leo van Haaren <leovhaaren@gmail.com>
Date: Fri, 8 Mar 2019 23:16:15 +0100
Subject: [PATCH 216/249] Update README.md demo projects version > 5.0.0

Looks like the README.md is a bit outdated. I've noticed the demo url's use storybook version 5.0.0
---
 README.md | 22 +++++++++++-----------
 1 file changed, 11 insertions(+), 11 deletions(-)

diff --git a/README.md b/README.md
index 76fdb7d27a1..a208801fd63 100644
--- a/README.md
+++ b/README.md
@@ -85,18 +85,18 @@ For additional help, join us [in our Discord](https://discord.gg/sMFvFsG) or [Sl
 
 | Framework                        | Demo                                              |                                                                                                |
 | -------------------------------- | ------------------------------------------------- | ---------------------------------------------------------------------------------------------- |
-| [React](app/react)               | [v4.0.0](https://storybooks-official.netlify.com) | [![React](https://img.shields.io/npm/dm/@storybook/react.svg)](app/react)                      |
+| [React](app/react)               | [v5.0.0](https://storybooks-official.netlify.com) | [![React](https://img.shields.io/npm/dm/@storybook/react.svg)](app/react)                      |
 | [React Native](app/react-native) | -                                                 | [![React Native](https://img.shields.io/npm/dm/@storybook/react-native.svg)](app/react-native) |
-| [Vue](app/vue)                   | [v4.0.0](https://storybooks-vue.netlify.com/)     | [![Vue](https://img.shields.io/npm/dm/@storybook/vue.svg)](app/vue)                            |
-| [Angular](app/angular)           | [v4.0.0](https://storybooks-angular.netlify.com/) | [![Angular](https://img.shields.io/npm/dm/@storybook/angular.svg)](app/angular)                |
-| [Polymer](app/polymer)           | [v4.0.0](https://storybooks-polymer.netlify.com/) | [![Polymer](https://img.shields.io/npm/dm/@storybook/polymer.svg)](app/polymer)                |
-| [Mithril](app/mithril)           | [v4.0.0](https://storybooks-mithril.netlify.com/) | [![Mithril](https://img.shields.io/npm/dm/@storybook/mithril.svg)](app/mithril)                |
-| [Marko](app/marko)               | [v4.0.0](https://storybooks-marko.netlify.com/)   | [![Marko](https://img.shields.io/npm/dm/@storybook/marko.svg)](app/marko)                      |
-| [HTML](app/html)                 | [v4.0.0](https://storybooks-html.netlify.com/)    | [![HTML](https://img.shields.io/npm/dm/@storybook/html.svg)](app/html)                         |
-| [Svelte](app/svelte)             | [v4.0.0](https://storybooks-svelte.netlify.com/)  | [![Svelte](https://img.shields.io/npm/dm/@storybook/svelte.svg)](app/svelte)                   |
-| [Riot](app/riot)                 | [v4.0.0](https://storybooks-riot.netlify.com/)    | [![Riot](https://img.shields.io/npm/dm/@storybook/riot.svg)](app/riot)                         |
-| [Ember](app/ember)               | [v4.0.0](https://storybooks-ember.netlify.com/)   | [![Ember](https://img.shields.io/npm/dm/@storybook/ember.svg)](app/ember)                      |
-| [Preact](app/preact)             | [v4.0.0](https://storybooks-preact.netlify.com/)  | [![Preact](https://img.shields.io/npm/dm/@storybook/preact.svg)](app/preact)                   |
+| [Vue](app/vue)                   | [v5.0.0](https://storybooks-vue.netlify.com/)     | [![Vue](https://img.shields.io/npm/dm/@storybook/vue.svg)](app/vue)                            |
+| [Angular](app/angular)           | [v5.0.0](https://storybooks-angular.netlify.com/) | [![Angular](https://img.shields.io/npm/dm/@storybook/angular.svg)](app/angular)                |
+| [Polymer](app/polymer)           | [v5.0.0](https://storybooks-polymer.netlify.com/) | [![Polymer](https://img.shields.io/npm/dm/@storybook/polymer.svg)](app/polymer)                |
+| [Mithril](app/mithril)           | [v5.0.0](https://storybooks-mithril.netlify.com/) | [![Mithril](https://img.shields.io/npm/dm/@storybook/mithril.svg)](app/mithril)                |
+| [Marko](app/marko)               | [v5.0.0](https://storybooks-marko.netlify.com/)   | [![Marko](https://img.shields.io/npm/dm/@storybook/marko.svg)](app/marko)                      |
+| [HTML](app/html)                 | [v5.0.0](https://storybooks-html.netlify.com/)    | [![HTML](https://img.shields.io/npm/dm/@storybook/html.svg)](app/html)                         |
+| [Svelte](app/svelte)             | [v5.0.0](https://storybooks-svelte.netlify.com/)  | [![Svelte](https://img.shields.io/npm/dm/@storybook/svelte.svg)](app/svelte)                   |
+| [Riot](app/riot)                 | [v5.0.0](https://storybooks-riot.netlify.com/)    | [![Riot](https://img.shields.io/npm/dm/@storybook/riot.svg)](app/riot)                         |
+| [Ember](app/ember)               | [v5.0.0](https://storybooks-ember.netlify.com/)   | [![Ember](https://img.shields.io/npm/dm/@storybook/ember.svg)](app/ember)                      |
+| [Preact](app/preact)             | [v5.0.0](https://storybooks-preact.netlify.com/)  | [![Preact](https://img.shields.io/npm/dm/@storybook/preact.svg)](app/preact)                   |
 
 ### Sub Projects
 

From 745b6ebede8df8532e57efaab85531d31306c7d4 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Sat, 9 Mar 2019 07:48:07 +0800
Subject: [PATCH 217/249] 5.0.1 version

---
 docs/src/versions/latest.json | 7 +------
 1 file changed, 1 insertion(+), 6 deletions(-)

diff --git a/docs/src/versions/latest.json b/docs/src/versions/latest.json
index f45c59349c8..6983e236891 100644
--- a/docs/src/versions/latest.json
+++ b/docs/src/versions/latest.json
@@ -1,6 +1 @@
-{
-  "version": "5.0.0",
-  "info": {
-    "plain": "Storybook 5.0 is a completely new UI with the following improvements:\n\n- 🌓 New design with light and dark themes\n- 🛠 Canvas toolbar for easy access to addons\n- 🗺 Overhauled navigation sidebar with an intuitive menu\n- 🗜 Redesigned addons panel with handy buttons to toggle visibility and orientation\n- ⌨️ Improved keyboard shortcuts that are user configurable\n- 🌍 New URL structure that eliminates long strings of query parameters\n\n5.0 contains hundreds more fixes, features, and tweaks. Browse the changelogs matching `5.0.0-alpha.*`, `5.0.0-beta.*`, and `5.0.0-rc.*` for the full list of changes. See [MIGRATION.md](https://github.com/storybooks/storybook/blob/next/MIGRATION.md) to ugprade from `4.x`."
-  }
-}
+{"version":"5.0.1","info":{"plain":"### Bug Fixes\n\n* Core: Remove custom presets warning ([#5911](https://github.com/storybooks/storybook/pull/5911))\n* Core: support unicode chars in story IDs ([#5964](https://github.com/storybooks/storybook/pull/5964))\n* Core: Add core-js dependencies where it was missing ([#5961](https://github.com/storybooks/storybook/pull/5961))\n* CLI: Fix missing iframe.html in absolute path output directory([#5947](https://github.com/storybooks/storybook/pull/5947))\n* Addon-knobs: Added debouncing between keystrokes to speed up component rendering ([#5811](https://github.com/storybooks/storybook/pull/5811))\n* UI: Fix search in production mode ([#5909](https://github.com/storybooks/storybook/pull/5909))"}}
\ No newline at end of file

From 611e582ddbe2bba4152b756d507deb5b85f6f4d2 Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Sat, 9 Mar 2019 01:21:02 +0100
Subject: [PATCH 218/249] SYNC prettier printWidth with eslint && FIX resulting
 linting warnings

---
 .../src/components/ActionLogger/index.tsx     | 11 ++-
 addons/actions/src/preview/decorateAction.ts  |  4 +-
 addons/actions/src/preview/withActions.ts     |  3 +-
 .../backgrounds/src/components/ColorIcon.tsx  |  2 +-
 .../src/containers/BackgroundSelector.tsx     | 67 ++++++++++++-------
 addons/notes/src/Panel.tsx                    | 20 ++++--
 addons/notes/src/index.ts                     | 36 +++++-----
 .../src/frameworks/angular/helpers.ts         |  8 ++-
 .../src/client/preview/angular/decorators.ts  |  5 +-
 .../src/client/preview/angular/helpers.ts     |  8 ++-
 app/angular/src/demo/welcome.component.ts     | 28 +++++---
 examples/angular-cli/src/karma.ts             |  5 +-
 .../src/stories/addon-background.stories.ts   | 10 ++-
 .../src/stories/addon-knobs.stories.ts        | 13 +++-
 .../src/stories/all-knobs.component.ts        |  4 +-
 .../stories/component-with-di/di.component.ts |  6 +-
 .../src/components/Button.stories.tsx         | 10 ++-
 lib/addons/src/index.ts                       |  4 +-
 lib/addons/src/make-decorator.test.ts         |  6 +-
 lib/addons/src/make-decorator.ts              |  6 +-
 lib/channels/src/index.test.ts                |  3 +-
 lib/router/src/utils.ts                       | 54 ++++++++-------
 lib/theming/src/create.ts                     |  8 ++-
 lib/theming/src/global.ts                     | 10 ++-
 lib/ui/src/keyboard/keyCodes.ts               | 22 +++++-
 lib/ui/src/keyboard/platform.ts               |  6 +-
 lib/ui/src/keyboard/scanCode.ts               | 20 ++++--
 lib/ui/src/libs/shortcut.ts                   | 12 +++-
 tslint.json                                   |  2 +-
 29 files changed, 280 insertions(+), 113 deletions(-)

diff --git a/addons/actions/src/components/ActionLogger/index.tsx b/addons/actions/src/components/ActionLogger/index.tsx
index 180981ce699..ad3e8611a56 100644
--- a/addons/actions/src/components/ActionLogger/index.tsx
+++ b/addons/actions/src/components/ActionLogger/index.tsx
@@ -16,7 +16,9 @@ export const Wrapper = styled(({ children, className }) => (
   padding: '10px 5px 20px',
 });
 
-const ThemedInspector = withTheme(({ theme, ...props }) => <Inspector theme={theme.addonActionsTheme || 'chromeLight'} {...props} />);
+const ThemedInspector = withTheme(({ theme, ...props }) => (
+  <Inspector theme={theme.addonActionsTheme || 'chromeLight'} {...props} />
+));
 
 interface ActionLoggerProps {
   actions: ActionDisplay[];
@@ -30,7 +32,12 @@ export const ActionLogger = ({ actions, onClear }: ActionLoggerProps) => (
         <Action key={action.id}>
           {action.count > 1 && <Counter>{action.count}</Counter>}
           <InspectorContainer>
-            <ThemedInspector sortObjectKeys showNonenumerable={false} name={action.data.name} data={action.data.args || action.data} />
+            <ThemedInspector
+              sortObjectKeys
+              showNonenumerable={false}
+              name={action.data.name}
+              data={action.data.args || action.data}
+            />
           </InspectorContainer>
         </Action>
       ))}
diff --git a/addons/actions/src/preview/decorateAction.ts b/addons/actions/src/preview/decorateAction.ts
index c60afc6d73c..817e7af1f29 100644
--- a/addons/actions/src/preview/decorateAction.ts
+++ b/addons/actions/src/preview/decorateAction.ts
@@ -10,7 +10,9 @@ const applyDecorators = (decorators: DecoratorFunction[], actionCallback: Handle
   };
 };
 
-export const decorateAction = (decorators: DecoratorFunction[]): ((name: string, options?: ActionOptions) => HandlerFunction) => {
+export const decorateAction = (
+  decorators: DecoratorFunction[]
+): ((name: string, options?: ActionOptions) => HandlerFunction) => {
   return (name: string, options?: ActionOptions) => {
     const callAction = action(name, options);
     return applyDecorators(decorators, callAction);
diff --git a/addons/actions/src/preview/withActions.ts b/addons/actions/src/preview/withActions.ts
index 17ccf48ae04..0b34623bffb 100644
--- a/addons/actions/src/preview/withActions.ts
+++ b/addons/actions/src/preview/withActions.ts
@@ -50,7 +50,8 @@ const actionsSubscription = (...args: any[]) => {
     const handlers = createHandlers(...args);
     lastSubscription = () => {
       handlers.forEach(({ eventName, handler }) => root.addEventListener(eventName, handler));
-      return () => handlers.forEach(({ eventName, handler }) => root.removeEventListener(eventName, handler));
+      return () =>
+        handlers.forEach(({ eventName, handler }) => root.removeEventListener(eventName, handler));
     };
   }
   return lastSubscription;
diff --git a/addons/backgrounds/src/components/ColorIcon.tsx b/addons/backgrounds/src/components/ColorIcon.tsx
index 00da34e6fd1..e654c408b20 100644
--- a/addons/backgrounds/src/components/ColorIcon.tsx
+++ b/addons/backgrounds/src/components/ColorIcon.tsx
@@ -10,5 +10,5 @@ export const ColorIcon = styled.span(
   }),
   ({ theme }) => ({
     boxShadow: `${theme.appBorderColor} 0 0 0 1px inset`,
-  }),
+  })
 );
diff --git a/addons/backgrounds/src/containers/BackgroundSelector.tsx b/addons/backgrounds/src/containers/BackgroundSelector.tsx
index 7a3f634017a..ef364b28f25 100644
--- a/addons/backgrounds/src/containers/BackgroundSelector.tsx
+++ b/addons/backgrounds/src/containers/BackgroundSelector.tsx
@@ -31,7 +31,10 @@ const createBackgroundSelectorItem = memoize(1000)(
   })
 );
 
-const getSelectedBackgroundColor = (list: BackgroundConfig[], currentSelectedValue: string): string => {
+const getSelectedBackgroundColor = (
+  list: BackgroundConfig[],
+  currentSelectedValue: string
+): string => {
   if (!list.length) {
     return 'transparent';
   }
@@ -51,30 +54,36 @@ const getSelectedBackgroundColor = (list: BackgroundConfig[], currentSelectedVal
   return 'transparent';
 };
 
-const getDisplayableState = memoize(10)((props: BackgroundToolProps, state: BackgroundToolState, change) => {
-  const data = props.api.getCurrentStoryData();
-  const list: BackgroundConfig[] = (data && data.parameters && data.parameters[PARAM_KEY]) || [];
+const getDisplayableState = memoize(10)(
+  (props: BackgroundToolProps, state: BackgroundToolState, change) => {
+    const data = props.api.getCurrentStoryData();
+    const list: BackgroundConfig[] = (data && data.parameters && data.parameters[PARAM_KEY]) || [];
 
-  const selectedBackgroundColor = getSelectedBackgroundColor(list, state.selected);
+    const selectedBackgroundColor = getSelectedBackgroundColor(list, state.selected);
 
-  let availableBackgroundSelectorItems: BackgroundSelectorItem[] = [];
+    let availableBackgroundSelectorItems: BackgroundSelectorItem[] = [];
 
-  if (selectedBackgroundColor !== 'transparent') {
-    availableBackgroundSelectorItems.push(createBackgroundSelectorItem('reset', 'Clear background', 'transparent', null, change));
+    if (selectedBackgroundColor !== 'transparent') {
+      availableBackgroundSelectorItems.push(
+        createBackgroundSelectorItem('reset', 'Clear background', 'transparent', null, change)
+      );
+    }
+
+    if (list.length) {
+      availableBackgroundSelectorItems = [
+        ...availableBackgroundSelectorItems,
+        ...list.map(({ name, value }) =>
+          createBackgroundSelectorItem(null, name, value, true, change)
+        ),
+      ];
+    }
+
+    return {
+      items: availableBackgroundSelectorItems,
+      selectedBackgroundColor,
+    };
   }
-
-  if (list.length) {
-    availableBackgroundSelectorItems = [
-      ...availableBackgroundSelectorItems,
-      ...list.map(({ name, value }) => createBackgroundSelectorItem(null, name, value, true, change)),
-    ];
-  }
-
-  return {
-    items: availableBackgroundSelectorItems,
-    selectedBackgroundColor,
-  };
-});
+);
 
 interface BackgroundToolProps {
   api: {
@@ -119,7 +128,11 @@ export class BackgroundSelector extends Component<BackgroundToolProps, Backgroun
 
   render() {
     const { expanded } = this.state;
-    const { items, selectedBackgroundColor } = getDisplayableState(this.props, this.state, this.change);
+    const { items, selectedBackgroundColor } = getDisplayableState(
+      this.props,
+      this.state,
+      this.change
+    );
 
     return items.length ? (
       <Fragment>
@@ -136,11 +149,17 @@ export class BackgroundSelector extends Component<BackgroundToolProps, Backgroun
           placement="top"
           trigger="click"
           tooltipShown={expanded}
-          onVisibilityChange={(newVisibility: boolean) => this.setState({ expanded: newVisibility })}
+          onVisibilityChange={(newVisibility: boolean) =>
+            this.setState({ expanded: newVisibility })
+          }
           tooltip={<TooltipLinkList links={items} />}
           closeOnClick
         >
-          <IconButton key="background" active={selectedBackgroundColor !== 'transparent'} title="Change the background of the preview">
+          <IconButton
+            key="background"
+            active={selectedBackgroundColor !== 'transparent'}
+            title="Change the background of the preview"
+          >
             <Icons icon="photo" />
           </IconButton>
         </WithTooltip>
diff --git a/addons/notes/src/Panel.tsx b/addons/notes/src/Panel.tsx
index 543ea9f6135..0faade462da 100644
--- a/addons/notes/src/Panel.tsx
+++ b/addons/notes/src/Panel.tsx
@@ -4,7 +4,12 @@ import { types } from '@storybook/addons';
 import { styled } from '@storybook/theming';
 import { STORY_RENDERED } from '@storybook/core-events';
 
-import { SyntaxHighlighter as SyntaxHighlighterBase, Placeholder, DocumentFormatting, Link } from '@storybook/components';
+import {
+  SyntaxHighlighter as SyntaxHighlighterBase,
+  Placeholder,
+  DocumentFormatting,
+  Link,
+} from '@storybook/components';
 import Giphy from './giphy';
 import Markdown from 'markdown-to-jsx';
 
@@ -46,7 +51,7 @@ export const SyntaxHighlighter = (props: any) => {
   if (props.className === undefined) {
     return <code>{props.children}</code>;
   }
-  //className: "lang-jsx"
+  // className: "lang-jsx"
   const language = props.className.split('-');
   return <SyntaxHighlighterBase language={language[1]} bordered copyable {...props} />;
 };
@@ -112,7 +117,10 @@ export default class NotesPanel extends React.Component<Props, NotesPanelState>
     }
 
     // TODO: memoize
-    const extraElements = Object.entries(api.getElements(types.NOTES_ELEMENT)).reduce((acc, [k, v]) => ({ ...acc, [k]: v.render }), {});
+    const extraElements = Object.entries(api.getElements(types.NOTES_ELEMENT)).reduce(
+      (acc, [k, v]) => ({ ...acc, [k]: v.render }),
+      {}
+    );
     const options = {
       ...defaultOptions,
       overrides: { ...defaultOptions.overrides, ...extraElements },
@@ -129,7 +137,11 @@ export default class NotesPanel extends React.Component<Props, NotesPanelState>
         <React.Fragment>No notes yet</React.Fragment>
         <React.Fragment>
           Learn how to{' '}
-          <Link href="https://github.com/storybooks/storybook/tree/master/addons/notes" target="_blank" withArrow>
+          <Link
+            href="https://github.com/storybooks/storybook/tree/master/addons/notes"
+            target="_blank"
+            withArrow
+          >
             document components in Markdown
           </Link>
         </React.Fragment>
diff --git a/addons/notes/src/index.ts b/addons/notes/src/index.ts
index 674c4ba9348..f1ed9aea660 100644
--- a/addons/notes/src/index.ts
+++ b/addons/notes/src/index.ts
@@ -8,26 +8,32 @@ export const withNotes = makeDecorator({
   skipIfNoParametersOrOptions: true,
   allowDeprecatedUsage: true,
 
-  wrapper: deprecate((getStory: StoryGetter, context: StoryContext, { options, parameters }: WrapperSettings) => {
-    const storyOptions = parameters || options;
+  wrapper: deprecate(
+    (getStory: StoryGetter, context: StoryContext, { options, parameters }: WrapperSettings) => {
+      const storyOptions = parameters || options;
 
-    const { text, markdown } =
-      typeof storyOptions === 'string'
-        ? {
-            text: storyOptions,
-            markdown: undefined,
-          }
-        : storyOptions;
+      const { text, markdown } =
+        typeof storyOptions === 'string'
+          ? {
+              text: storyOptions,
+              markdown: undefined,
+            }
+          : storyOptions;
 
-    if (!text && !markdown) {
-      throw new Error(`Parameter 'notes' must must be a string or an object with 'text' or 'markdown' properties`);
-    }
+      if (!text && !markdown) {
+        throw new Error(
+          `Parameter 'notes' must must be a string or an object with 'text' or 'markdown' properties`
+        );
+      }
 
-    return getStory(context);
-  }, 'withNotes is deprecated'),
+      return getStory(context);
+    },
+    'withNotes is deprecated'
+  ),
 });
 
-export const withMarkdownNotes = deprecate((text: string, options: any) => {}, 'withMarkdownNotes is deprecated');
+export const withMarkdownNotes = deprecate((text: string, options: any) => {},
+'withMarkdownNotes is deprecated');
 
 if (module && module.hot && module.hot.decline) {
   module.hot.decline();
diff --git a/addons/storyshots/storyshots-core/src/frameworks/angular/helpers.ts b/addons/storyshots/storyshots-core/src/frameworks/angular/helpers.ts
index 7c417339ada..d8786390a4c 100644
--- a/addons/storyshots/storyshots-core/src/frameworks/angular/helpers.ts
+++ b/addons/storyshots/storyshots-core/src/frameworks/angular/helpers.ts
@@ -43,7 +43,13 @@ export const initModuleData = (storyObj: NgStory): any => {
     props,
   };
 
-  const moduleMeta = getModuleMeta([AppComponent, AnnotatedComponent], [AnnotatedComponent], [AppComponent], story, moduleMetadata);
+  const moduleMeta = getModuleMeta(
+    [AppComponent, AnnotatedComponent],
+    [AnnotatedComponent],
+    [AppComponent],
+    story,
+    moduleMetadata
+  );
 
   return {
     AppComponent,
diff --git a/app/angular/src/client/preview/angular/decorators.ts b/app/angular/src/client/preview/angular/decorators.ts
index d40312ae338..7897d6f0c38 100644
--- a/app/angular/src/client/preview/angular/decorators.ts
+++ b/app/angular/src/client/preview/angular/decorators.ts
@@ -9,7 +9,10 @@ export const moduleMetadata = (metadata: Partial<NgModuleMetadata>) => (storyFn:
     ...story,
     moduleMetadata: {
       declarations: [...(metadata.declarations || []), ...(storyMetadata.declarations || [])],
-      entryComponents: [...(metadata.entryComponents || []), ...(storyMetadata.entryComponents || [])],
+      entryComponents: [
+        ...(metadata.entryComponents || []),
+        ...(storyMetadata.entryComponents || []),
+      ],
       imports: [...(metadata.imports || []), ...(storyMetadata.imports || [])],
       schemas: [...(metadata.schemas || []), ...(storyMetadata.schemas || [])],
       providers: [...(metadata.providers || []), ...(storyMetadata.providers || [])],
diff --git a/app/angular/src/client/preview/angular/helpers.ts b/app/angular/src/client/preview/angular/helpers.ts
index f5e218d75b3..8cabe40c1aa 100644
--- a/app/angular/src/client/preview/angular/helpers.ts
+++ b/app/angular/src/client/preview/angular/helpers.ts
@@ -51,7 +51,13 @@ const initModule = (storyFn: IStoryFn) => {
     props,
   };
 
-  return getModule([AppComponent, AnnotatedComponent], [AnnotatedComponent], [AppComponent], story, moduleMetadata);
+  return getModule(
+    [AppComponent, AnnotatedComponent],
+    [AnnotatedComponent],
+    [AppComponent],
+    story,
+    moduleMetadata
+  );
 };
 
 const staticRoot = document.getElementById('root');
diff --git a/app/angular/src/demo/welcome.component.ts b/app/angular/src/demo/welcome.component.ts
index 18b464a4e64..c8348edbcec 100644
--- a/app/angular/src/demo/welcome.component.ts
+++ b/app/angular/src/demo/welcome.component.ts
@@ -7,29 +7,39 @@ import { Component, Output, EventEmitter } from '@angular/core';
       <h1>Welcome to storybook</h1>
       <p>This is a UI component dev environment for your app.</p>
       <p>
-        We've added some basic stories inside the <span class="inline-code">src/stories</span> directory. <br />
-        A story is a single state of one or more UI components. You can have as many stories as you want. <br />
+        We've added some basic stories inside the
+        <span class="inline-code">src/stories</span> directory. <br />
+        A story is a single state of one or more UI components. You can have as many stories as you
+        want. <br />
         (Basically a story is like a visual test case.)
       </p>
       <p>
-        See these sample <a (click)="showApp.emit($event)" role="button" tabIndex="0">stories</a> for a component called
-        <span class="inline-code">Button</span> .
+        See these sample
+        <a (click)="showApp.emit($event)" role="button" tabIndex="0">stories</a> for a component
+        called <span class="inline-code">Button</span> .
       </p>
       <p>
         Just like that, you can add your own components as stories. <br />
         You can also edit those components and see changes right away. <br />
-        (Try editing the <span class="inline-code">Button</span> stories located at <span class="inline-code">src/stories/index.js</span>.)
+        (Try editing the <span class="inline-code">Button</span> stories located at
+        <span class="inline-code">src/stories/index.js</span>.)
       </p>
       <p>
         Usually we create stories with smaller UI components in the app.<br />
         Have a look at the
-        <a href="https://storybook.js.org/basics/writing-stories" target="_blank" rel="noopener noreferrer"> Writing Stories </a> section in
-        our documentation.
+        <a
+          href="https://storybook.js.org/basics/writing-stories"
+          target="_blank"
+          rel="noopener noreferrer"
+        >
+          Writing Stories
+        </a>
+        section in our documentation.
       </p>
       <p class="note">
         <b>NOTE:</b> <br />
-        Have a look at the <span class="inline-code">.storybook/webpack.config.js</span> to add webpack loaders and plugins you are using in
-        this project.
+        Have a look at the <span class="inline-code">.storybook/webpack.config.js</span> to add
+        webpack loaders and plugins you are using in this project.
       </p>
     </main>
   `,
diff --git a/examples/angular-cli/src/karma.ts b/examples/angular-cli/src/karma.ts
index e9e2959bea3..08df8a4aa9c 100644
--- a/examples/angular-cli/src/karma.ts
+++ b/examples/angular-cli/src/karma.ts
@@ -7,7 +7,10 @@ import 'zone.js/dist/jasmine-patch';
 import 'zone.js/dist/async-test';
 import 'zone.js/dist/fake-async-test';
 import { getTestBed } from '@angular/core/testing';
-import { BrowserDynamicTestingModule, platformBrowserDynamicTesting } from '@angular/platform-browser-dynamic/testing';
+import {
+  BrowserDynamicTestingModule,
+  platformBrowserDynamicTesting,
+} from '@angular/platform-browser-dynamic/testing';
 
 // Unfortunately there's no typing for the `__karma__` variable. Just declare it as any.
 declare const __karma__: any;
diff --git a/examples/angular-cli/src/stories/addon-background.stories.ts b/examples/angular-cli/src/stories/addon-background.stories.ts
index 43415c38223..aa1f808d6ea 100644
--- a/examples/angular-cli/src/stories/addon-background.stories.ts
+++ b/examples/angular-cli/src/stories/addon-background.stories.ts
@@ -4,7 +4,10 @@ import { AppComponent } from '../app/app.component';
 
 storiesOf('Addon|Background', module)
   .addParameters({
-    backgrounds: [{ name: 'twitter', value: '#00aced', default: true }, { name: 'facebook', value: '#3b5998' }],
+    backgrounds: [
+      { name: 'twitter', value: '#00aced', default: true },
+      { name: 'facebook', value: '#3b5998' },
+    ],
   })
   .add('background component', () => ({
     component: AppComponent,
@@ -18,7 +21,10 @@ storiesOf('Addon|Background', module)
     })
   )
   .addParameters({
-    backgrounds: [{ name: 'twitter', value: '#00aced', default: true }, { name: 'facebook', value: '#3b5998' }],
+    backgrounds: [
+      { name: 'twitter', value: '#00aced', default: true },
+      { name: 'facebook', value: '#3b5998' },
+    ],
   })
   .add('background template', () => ({
     template: `<storybook-button-component [text]="text" (onClick)="onClick($event)"></storybook-button-component>`,
diff --git a/examples/angular-cli/src/stories/addon-knobs.stories.ts b/examples/angular-cli/src/stories/addon-knobs.stories.ts
index 4dc1a980434..602feb23299 100644
--- a/examples/angular-cli/src/stories/addon-knobs.stories.ts
+++ b/examples/angular-cli/src/stories/addon-knobs.stories.ts
@@ -1,7 +1,18 @@
 import { storiesOf } from '@storybook/angular';
 import { action } from '@storybook/addon-actions';
 
-import { withKnobs, text, number, boolean, array, select, radios, color, date, button } from '@storybook/addon-knobs';
+import {
+  withKnobs,
+  text,
+  number,
+  boolean,
+  array,
+  select,
+  radios,
+  color,
+  date,
+  button,
+} from '@storybook/addon-knobs';
 
 import { SimpleKnobsComponent } from './knobs.component';
 import { AllKnobsComponent } from './all-knobs.component';
diff --git a/examples/angular-cli/src/stories/all-knobs.component.ts b/examples/angular-cli/src/stories/all-knobs.component.ts
index 70b83b1b609..4b36a9dea1c 100644
--- a/examples/angular-cli/src/stories/all-knobs.component.ts
+++ b/examples/angular-cli/src/stories/all-knobs.component.ts
@@ -3,7 +3,9 @@ import { Component, Input, OnInit, OnChanges, SimpleChanges } from '@angular/cor
 @Component({
   selector: 'storybook-simple-knobs-component',
   template: `
-    <div [ngStyle]="{ border: '2px dotted ' + border, 'padding.px': '8 22', 'border-radius.px': '8' }">
+    <div
+      [ngStyle]="{ border: '2px dotted ' + border, 'padding.px': '8 22', 'border-radius.px': '8' }"
+    >
       <h1>My name is {{ name }},</h1>
       <h3>today is {{ today | date }}</h3>
       <p *ngIf="stock">I have a stock of {{ stock }} {{ fruit }}, costing $ {{ price }} each.</p>
diff --git a/examples/angular-cli/src/stories/component-with-di/di.component.ts b/examples/angular-cli/src/stories/component-with-di/di.component.ts
index c2cae8f869c..96e61b42de6 100644
--- a/examples/angular-cli/src/stories/component-with-di/di.component.ts
+++ b/examples/angular-cli/src/stories/component-with-di/di.component.ts
@@ -11,7 +11,11 @@ export class DiComponent {
   @Input()
   title: string;
 
-  constructor(protected injector: Injector, protected elRef: ElementRef, @Inject(TEST_TOKEN) protected testToken: number) {}
+  constructor(
+    protected injector: Injector,
+    protected elRef: ElementRef,
+    @Inject(TEST_TOKEN) protected testToken: number
+  ) {}
 
   isAllDeps(): boolean {
     return Boolean(this.testToken && this.elRef && this.injector && this.title);
diff --git a/examples/cra-ts-kitchen-sink/src/components/Button.stories.tsx b/examples/cra-ts-kitchen-sink/src/components/Button.stories.tsx
index 69700645040..4c32f441fcd 100644
--- a/examples/cra-ts-kitchen-sink/src/components/Button.stories.tsx
+++ b/examples/cra-ts-kitchen-sink/src/components/Button.stories.tsx
@@ -3,6 +3,10 @@ import { storiesOf } from '@storybook/react';
 import { action } from '@storybook/addon-actions';
 import Button from './Button';
 
-storiesOf('Button', module).add('simple button', () => <Button onClick={action('button clicked')}>OK</Button>, {
-  info: { inline: true },
-});
+storiesOf('Button', module).add(
+  'simple button',
+  () => <Button onClick={action('button clicked')}>OK</Button>,
+  {
+    info: { inline: true },
+  }
+);
diff --git a/lib/addons/src/index.ts b/lib/addons/src/index.ts
index 71fabb10a87..b2b08f1166a 100644
--- a/lib/addons/src/index.ts
+++ b/lib/addons/src/index.ts
@@ -48,7 +48,9 @@ export class AddonStore {
   getChannel = (): Channel => {
     // this.channel should get overwritten by setChannel. If it wasn't called (e.g. in non-browser environment), throw.
     if (!this.channel) {
-      throw new Error('Accessing non-existent addons channel, see https://storybook.js.org/basics/faq/#why-is-there-no-addons-channel');
+      throw new Error(
+        'Accessing non-existent addons channel, see https://storybook.js.org/basics/faq/#why-is-there-no-addons-channel'
+      );
     }
 
     return this.channel;
diff --git a/lib/addons/src/make-decorator.test.ts b/lib/addons/src/make-decorator.test.ts
index f44dd858be8..8c473994cba 100644
--- a/lib/addons/src/make-decorator.test.ts
+++ b/lib/addons/src/make-decorator.test.ts
@@ -5,7 +5,11 @@ import { makeDecorator, StoryContext, StoryGetter } from './make-decorator';
 type DecoratorFn = (fn: StoryGetter, context: StoryContext) => any;
 
 export const defaultDecorateStory = (getStory: StoryGetter, decorators: DecoratorFn[]) =>
-  decorators.reduce((decorated, decorator) => (context: StoryContext) => decorator(() => decorated(context), context), getStory);
+  decorators.reduce(
+    (decorated, decorator) => (context: StoryContext) =>
+      decorator(() => decorated(context), context),
+    getStory
+  );
 
 jest.mock('util-deprecate');
 let deprecatedFns: any[] = [];
diff --git a/lib/addons/src/make-decorator.ts b/lib/addons/src/make-decorator.ts
index 6172e79e619..2347c3b32e4 100644
--- a/lib/addons/src/make-decorator.ts
+++ b/lib/addons/src/make-decorator.ts
@@ -19,7 +19,11 @@ export interface WrapperSettings {
 
 export type StoryGetter = (context: StoryContext) => any;
 
-export type StoryWrapper = (getStory: StoryGetter, context: StoryContext, settings: WrapperSettings) => any;
+export type StoryWrapper = (
+  getStory: StoryGetter,
+  context: StoryContext,
+  settings: WrapperSettings
+) => any;
 
 type MakeDecoratorResult = (...args: any) => any;
 
diff --git a/lib/channels/src/index.test.ts b/lib/channels/src/index.test.ts
index 1a01d164b39..201a8aabf32 100644
--- a/lib/channels/src/index.test.ts
+++ b/lib/channels/src/index.test.ts
@@ -189,7 +189,8 @@ describe('Channel', () => {
       const eventName = 'event1';
       const listenerToBeRemoved = jest.fn();
       const listeners = [jest.fn(), jest.fn()];
-      const findListener = (listener: Listener) => channel.listeners(eventName).find(_listener => _listener === listener);
+      const findListener = (listener: Listener) =>
+        channel.listeners(eventName).find(_listener => _listener === listener);
 
       listeners.forEach(fn => channel.addListener(eventName, fn));
       channel.addListener(eventName, listenerToBeRemoved);
diff --git a/lib/router/src/utils.ts b/lib/router/src/utils.ts
index dffd64cff86..9a126db2fc2 100644
--- a/lib/router/src/utils.ts
+++ b/lib/router/src/utils.ts
@@ -27,37 +27,43 @@ const sanitizeSafe = (string: string, part: string) => {
   return sanitized;
 };
 
-export const toId = (kind: string, name: string) => `${sanitizeSafe(kind, 'kind')}--${sanitizeSafe(name, 'name')}`;
+export const toId = (kind: string, name: string) =>
+  `${sanitizeSafe(kind, 'kind')}--${sanitizeSafe(name, 'name')}`;
 
-export const storyDataFromString: (path: string) => StoryData = memoize(1000)((path: string | undefined | null) => {
-  const result: StoryData = {
-    viewMode: undefined,
-    storyId: undefined,
-  };
+export const storyDataFromString: (path: string) => StoryData = memoize(1000)(
+  (path: string | undefined | null) => {
+    const result: StoryData = {
+      viewMode: undefined,
+      storyId: undefined,
+    };
 
-  if (path) {
-    const [, viewMode, storyId] = path.match(splitPath) || [undefined, undefined, undefined];
-    if (viewMode && viewMode.match(knownViewModesRegex)) {
-      Object.assign(result, {
-        viewMode,
-        storyId,
-      });
+    if (path) {
+      const [, viewMode, storyId] = path.match(splitPath) || [undefined, undefined, undefined];
+      if (viewMode && viewMode.match(knownViewModesRegex)) {
+        Object.assign(result, {
+          viewMode,
+          storyId,
+        });
+      }
     }
+    return result;
   }
-  return result;
-});
+);
 
 export const queryFromString = memoize(1000)(s => qs.parse(s, { ignoreQueryPrefix: true }));
 export const queryFromLocation = (location: { search: string }) => queryFromString(location.search);
-export const stringifyQuery = (query: object) => qs.stringify(query, { addQueryPrefix: true, encode: false });
+export const stringifyQuery = (query: object) =>
+  qs.stringify(query, { addQueryPrefix: true, encode: false });
 
-export const getMatch = memoize(1000)((current: string, target: string, startsWith: boolean = true) => {
-  const startsWithTarget = current && startsWith && current.startsWith(target);
-  const currentIsTarget = typeof target === 'string' && current === target;
-  const matchTarget = current && target && current.match(target);
+export const getMatch = memoize(1000)(
+  (current: string, target: string, startsWith: boolean = true) => {
+    const startsWithTarget = current && startsWith && current.startsWith(target);
+    const currentIsTarget = typeof target === 'string' && current === target;
+    const matchTarget = current && target && current.match(target);
 
-  if (startsWithTarget || currentIsTarget || matchTarget) {
-    return { path: current };
+    if (startsWithTarget || currentIsTarget || matchTarget) {
+      return { path: current };
+    }
+    return null;
   }
-  return null;
-});
+);
diff --git a/lib/theming/src/create.ts b/lib/theming/src/create.ts
index a4d44f016a3..bb9dcc1f6f5 100644
--- a/lib/theming/src/create.ts
+++ b/lib/theming/src/create.ts
@@ -9,7 +9,10 @@ import { Theme, color, Color, background, typography, ThemeVars } from './base';
 import { easing, animation } from './animation';
 import { create as createSyntax } from './modules/syntax';
 
-const themes: { light: ThemeVars; dark: ThemeVars } = { light: lightThemeVars, dark: darkThemeVars };
+const themes: { light: ThemeVars; dark: ThemeVars } = {
+  light: lightThemeVars,
+  dark: darkThemeVars,
+};
 
 interface Rest {
   [key: string]: any;
@@ -127,7 +130,8 @@ export const convert = (inherit: ThemeVars = lightThemeVars): Theme => {
     background: {
       app: appBg,
       content: appContentBg,
-      hoverable: base === 'light' ? 'rgba(0,0,0,.05)' : 'rgba(250,250,252,.1)' || background.hoverable,
+      hoverable:
+        base === 'light' ? 'rgba(0,0,0,.05)' : 'rgba(250,250,252,.1)' || background.hoverable,
 
       positive: background.positive,
       negative: background.negative,
diff --git a/lib/theming/src/global.ts b/lib/theming/src/global.ts
index bcc4d122ed8..cb46eeec33a 100644
--- a/lib/theming/src/global.ts
+++ b/lib/theming/src/global.ts
@@ -87,7 +87,15 @@ export const createReset = memoize(1)(
 );
 
 export const createGlobal = memoize(1)(
-  ({ color, background, typography }: { color: Color; background: Background; typography: Typography }): Return => {
+  ({
+    color,
+    background,
+    typography,
+  }: {
+    color: Color;
+    background: Background;
+    typography: Typography;
+  }): Return => {
     const resetStyles = createReset({ typography });
     return {
       ...resetStyles,
diff --git a/lib/ui/src/keyboard/keyCodes.ts b/lib/ui/src/keyboard/keyCodes.ts
index 5eb6b81ddcb..d6f810d361a 100644
--- a/lib/ui/src/keyboard/keyCodes.ts
+++ b/lib/ui/src/keyboard/keyCodes.ts
@@ -416,7 +416,13 @@ export class SimpleKeybinding {
 
   public readonly keyCode: KeyCode;
 
-  constructor(ctrlKey: boolean, shiftKey: boolean, altKey: boolean, metaKey: boolean, keyCode: KeyCode) {
+  constructor(
+    ctrlKey: boolean,
+    shiftKey: boolean,
+    altKey: boolean,
+    metaKey: boolean,
+    keyCode: KeyCode
+  ) {
     this.ctrlKey = ctrlKey;
     this.shiftKey = shiftKey;
     this.altKey = altKey;
@@ -492,7 +498,10 @@ export function createKeyBinding(keybinding: number, OS: OperatingSystem): Keybi
   const chordPart = (keybinding & 0xffff0000) >>> 16;
 
   if (chordPart !== 0) {
-    return new ChordKeybinding(createSimpleKeybinding(firstPart, OS), createSimpleKeybinding(chordPart, OS));
+    return new ChordKeybinding(
+      createSimpleKeybinding(firstPart, OS),
+      createSimpleKeybinding(chordPart, OS)
+    );
   }
 
   return createSimpleKeybinding(firstPart, OS);
@@ -525,7 +534,14 @@ export class ResolveKeybindingPart {
 
   readonly keyAriaLabel: string | null;
 
-  constructor(ctrlKey: boolean, shiftKey: boolean, altKey: boolean, metaKey: boolean, kbLabel: string | null, kbAriaLabel: string | null) {
+  constructor(
+    ctrlKey: boolean,
+    shiftKey: boolean,
+    altKey: boolean,
+    metaKey: boolean,
+    kbLabel: string | null,
+    kbAriaLabel: string | null
+  ) {
     this.ctrlKey = ctrlKey;
     this.shiftKey = shiftKey;
     this.altKey = altKey;
diff --git a/lib/ui/src/keyboard/platform.ts b/lib/ui/src/keyboard/platform.ts
index 6e651e0fc15..563a5e488f3 100644
--- a/lib/ui/src/keyboard/platform.ts
+++ b/lib/ui/src/keyboard/platform.ts
@@ -31,4 +31,8 @@ export const enum OperatingSystem {
   Linux = 3,
 }
 
-export const OS = _isMacintosh ? OperatingSystem.Macintosh : _isWindows ? OperatingSystem.Windows : OperatingSystem.Linux;
+export const OS = _isMacintosh
+  ? OperatingSystem.Macintosh
+  : _isWindows
+  ? OperatingSystem.Windows
+  : OperatingSystem.Linux;
diff --git a/lib/ui/src/keyboard/scanCode.ts b/lib/ui/src/keyboard/scanCode.ts
index 2dfd5b8698f..1b0b4498762 100644
--- a/lib/ui/src/keyboard/scanCode.ts
+++ b/lib/ui/src/keyboard/scanCode.ts
@@ -229,7 +229,13 @@ export class ScanCodeBinding {
   public readonly metaKey: boolean;
   public readonly scanCode: ScanCode;
 
-  constructor(ctrlKey: boolean, shiftKey: boolean, altKey: boolean, metaKey: boolean, scanCode: ScanCode) {
+  constructor(
+    ctrlKey: boolean,
+    shiftKey: boolean,
+    altKey: boolean,
+    metaKey: boolean,
+    scanCode: ScanCode
+  ) {
     this.ctrlKey = ctrlKey;
     this.shiftKey = shiftKey;
     this.altKey = altKey;
@@ -252,10 +258,14 @@ export class ScanCodeBinding {
    */
   public isDuplicateModifierCase(): boolean {
     return (
-      (this.ctrlKey && (this.scanCode === ScanCode.ControlLeft || this.scanCode === ScanCode.ControlRight)) ||
-      (this.shiftKey && (this.scanCode === ScanCode.ShiftLeft || this.scanCode === ScanCode.ShiftRight)) ||
-      (this.altKey && (this.scanCode === ScanCode.AltLeft || this.scanCode === ScanCode.AltRight)) ||
-      (this.metaKey && (this.scanCode === ScanCode.MetaLeft || this.scanCode === ScanCode.MetaRight))
+      (this.ctrlKey &&
+        (this.scanCode === ScanCode.ControlLeft || this.scanCode === ScanCode.ControlRight)) ||
+      (this.shiftKey &&
+        (this.scanCode === ScanCode.ShiftLeft || this.scanCode === ScanCode.ShiftRight)) ||
+      (this.altKey &&
+        (this.scanCode === ScanCode.AltLeft || this.scanCode === ScanCode.AltRight)) ||
+      (this.metaKey &&
+        (this.scanCode === ScanCode.MetaLeft || this.scanCode === ScanCode.MetaRight))
     );
   }
 }
diff --git a/lib/ui/src/libs/shortcut.ts b/lib/ui/src/libs/shortcut.ts
index ec4fbdeb88b..da691c6ac57 100644
--- a/lib/ui/src/libs/shortcut.ts
+++ b/lib/ui/src/libs/shortcut.ts
@@ -3,12 +3,14 @@ import { navigator } from 'global';
 // The shortcut is our JSON-ifiable representation of a shortcut combination
 type Shortcut = string[];
 
-export const isMacLike = () => (navigator && navigator.platform ? !!navigator.platform.match(/(Mac|iPhone|iPod|iPad)/i) : false);
+export const isMacLike = () =>
+  navigator && navigator.platform ? !!navigator.platform.match(/(Mac|iPhone|iPod|iPad)/i) : false;
 export const controlOrMetaSymbol = () => (isMacLike() ? '⌘' : 'ctrl');
 export const controlOrMetaKey = () => (isMacLike() ? 'meta' : 'control');
 export const optionOrAltSymbol = () => (isMacLike() ? '⌥' : 'alt');
 
-export const isShortcutTaken = (arr1: string[], arr2: string[]): boolean => JSON.stringify(arr1) === JSON.stringify(arr2);
+export const isShortcutTaken = (arr1: string[], arr2: string[]): boolean =>
+  JSON.stringify(arr1) === JSON.stringify(arr2);
 
 // Map a keyboard event to a keyboard shortcut
 // NOTE: if we change the fields on the event that we need, we'll need to update the serialization in core/preview/start.js
@@ -58,7 +60,11 @@ export const eventToShortcut = (e: KeyboardEvent): Shortcut | null => {
 };
 
 export const shortcutMatchesShortcut = (inputShortcut: Shortcut, shortcut: Shortcut): boolean => {
-  return inputShortcut && inputShortcut.length === shortcut.length && !inputShortcut.find((key, i) => key !== shortcut[i]);
+  return (
+    inputShortcut &&
+    inputShortcut.length === shortcut.length &&
+    !inputShortcut.find((key, i) => key !== shortcut[i])
+  );
 };
 
 // Should this keyboard event trigger this keyboard shortcut?
diff --git a/tslint.json b/tslint.json
index 82457a182ac..6133784fb3c 100644
--- a/tslint.json
+++ b/tslint.json
@@ -5,7 +5,7 @@
     "prettier": {
       "severity": "warning",
       "options": {
-        "printWidth": 140,
+        "printWidth": 100,
         "tabWidth": 2,
         "bracketSpacing": true,
         "trailingComma": "es5",

From e8303e270c7f279bc3950c9b65e4c23be369fe25 Mon Sep 17 00:00:00 2001
From: Luke Glazebrook <Glazy@users.noreply.github.com>
Date: Sat, 9 Mar 2019 00:28:50 +0000
Subject: [PATCH 219/249] Change viewport styling to more closely match v4

Styling for addon-viewport iframe was a 10px black border which was a
little intrusive when working on stories. This commit changes the iframe
style to a more familiar style that mimics v4 with horizontal centering
and a subtle box-shadow.
---
 addons/viewport/src/Tool.js | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/addons/viewport/src/Tool.js b/addons/viewport/src/Tool.js
index 2c4390838f1..d7587a8448b 100644
--- a/addons/viewport/src/Tool.js
+++ b/addons/viewport/src/Tool.js
@@ -129,9 +129,12 @@ export default class ViewportTool extends Component {
           <Global
             styles={{
               [`#${iframeId}`]: {
-                border: '10px solid black',
+                position: 'relative',
+                display: 'block',
+                margin: '10px auto',
+                border: '1px solid #888',
                 borderRadius: 4,
-                margin: 10,
+                boxShadow: '0 4px 8px 0 rgba(0,0,0,0.12), 0 2px 4px 0 rgba(0,0,0,0.08);',
 
                 ...(isRotated ? flip(item.value || {}) : item.value || {}),
               },

From a5ae82202b06ef9dabafd047df5c7c7cc3897647 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Sat, 9 Mar 2019 08:29:32 +0800
Subject: [PATCH 220/249] Document redirects

---
 docs/static/_redirects | 1 +
 1 file changed, 1 insertion(+)
 create mode 100644 docs/static/_redirects

diff --git a/docs/static/_redirects b/docs/static/_redirects
new file mode 100644
index 00000000000..68c66565d9c
--- /dev/null
+++ b/docs/static/_redirects
@@ -0,0 +1 @@
+/basics/*guide* /guides/:splat 302

From 02a50729eebc781f8b913ca1542dc506cbac4cc8 Mon Sep 17 00:00:00 2001
From: "dependabot[bot]" <support@dependabot.com>
Date: Sat, 9 Mar 2019 00:41:04 +0000
Subject: [PATCH 221/249] Bump react from 16.8.3 to 16.8.4

Bumps [react](https://github.com/facebook/react/tree/HEAD/packages/react) from 16.8.3 to 16.8.4.
- [Release notes](https://github.com/facebook/react/releases)
- [Changelog](https://github.com/facebook/react/blob/master/CHANGELOG.md)
- [Commits](https://github.com/facebook/react/commits/v16.8.4/packages/react)

Signed-off-by: dependabot[bot] <support@dependabot.com>
---
 addons/a11y/package.json                      |  2 +-
 addons/actions/package.json                   |  2 +-
 addons/backgrounds/package.json               |  2 +-
 addons/cssresources/package.json              |  2 +-
 addons/events/package.json                    |  2 +-
 addons/info/package.json                      |  2 +-
 addons/jest/package.json                      |  2 +-
 .../storyshots/storyshots-core/package.json   |  2 +-
 examples/cra-kitchen-sink/package.json        |  2 +-
 examples/cra-ts-kitchen-sink/package.json     |  2 +-
 examples/official-storybook/package.json      |  2 +-
 lib/components/package.json                   |  2 +-
 lib/ui/package.json                           |  2 +-
 package.json                                  |  2 +-
 yarn.lock                                     | 20 ++++++++++---------
 15 files changed, 25 insertions(+), 23 deletions(-)

diff --git a/addons/a11y/package.json b/addons/a11y/package.json
index c63b73865f1..2e21bc8c81b 100644
--- a/addons/a11y/package.json
+++ b/addons/a11y/package.json
@@ -36,7 +36,7 @@
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
-    "react": "^16.8.3",
+    "react": "^16.8.4",
     "util-deprecate": "^1.0.2"
   },
   "devDependencies": {
diff --git a/addons/actions/package.json b/addons/actions/package.json
index c1fcdb327dc..80efbe1df03 100644
--- a/addons/actions/package.json
+++ b/addons/actions/package.json
@@ -31,7 +31,7 @@
     "lodash": "^4.17.11",
     "polished": "^3.0.0",
     "prop-types": "^15.7.2",
-    "react": "^16.8.3",
+    "react": "^16.8.4",
     "react-inspector": "^2.3.1",
     "uuid": "^3.3.2"
   },
diff --git a/addons/backgrounds/package.json b/addons/backgrounds/package.json
index 69bf271a444..162260fd8c5 100644
--- a/addons/backgrounds/package.json
+++ b/addons/backgrounds/package.json
@@ -33,7 +33,7 @@
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
-    "react": "^16.8.3",
+    "react": "^16.8.4",
     "util-deprecate": "^1.0.2"
   },
   "devDependencies": {
diff --git a/addons/cssresources/package.json b/addons/cssresources/package.json
index c2cc9b86b31..c5d460586d3 100644
--- a/addons/cssresources/package.json
+++ b/addons/cssresources/package.json
@@ -30,7 +30,7 @@
     "@storybook/core-events": "5.1.0-alpha.2",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
-    "react": "^16.8.3"
+    "react": "^16.8.4"
   },
   "peerDependencies": {
     "react": "*"
diff --git a/addons/events/package.json b/addons/events/package.json
index d2a9f4601b8..4e46e1ea4b9 100644
--- a/addons/events/package.json
+++ b/addons/events/package.json
@@ -30,7 +30,7 @@
     "core-js": "^2.6.5",
     "format-json": "^1.0.3",
     "prop-types": "^15.7.2",
-    "react": "^16.8.3",
+    "react": "^16.8.4",
     "react-lifecycles-compat": "^3.0.4",
     "react-textarea-autosize": "^7.0.4",
     "util-deprecate": "^1.0.2"
diff --git a/addons/info/package.json b/addons/info/package.json
index 972905c6ab9..83786b04d88 100644
--- a/addons/info/package.json
+++ b/addons/info/package.json
@@ -31,7 +31,7 @@
     "marksy": "^6.1.0",
     "nested-object-assign": "^1.0.3",
     "prop-types": "^15.7.2",
-    "react": "^16.8.3",
+    "react": "^16.8.4",
     "react-addons-create-fragment": "^15.6.2",
     "react-is": "^16.8.3",
     "react-lifecycles-compat": "^3.0.4",
diff --git a/addons/jest/package.json b/addons/jest/package.json
index 7f335f09149..704dcdd0f73 100644
--- a/addons/jest/package.json
+++ b/addons/jest/package.json
@@ -35,7 +35,7 @@
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "prop-types": "^15.7.2",
-    "react": "^16.8.3",
+    "react": "^16.8.4",
     "upath": "^1.1.0",
     "util-deprecate": "^1.0.2"
   },
diff --git a/addons/storyshots/storyshots-core/package.json b/addons/storyshots/storyshots-core/package.json
index 0007a800708..6ce1aec1527 100644
--- a/addons/storyshots/storyshots-core/package.json
+++ b/addons/storyshots/storyshots-core/package.json
@@ -36,7 +36,7 @@
   "devDependencies": {
     "enzyme-to-json": "^3.3.5",
     "jest-emotion": "^10.0.7",
-    "react": "^16.8.3"
+    "react": "^16.8.4"
   },
   "publishConfig": {
     "access": "public"
diff --git a/examples/cra-kitchen-sink/package.json b/examples/cra-kitchen-sink/package.json
index 20e8e10941b..c0ff7366310 100644
--- a/examples/cra-kitchen-sink/package.json
+++ b/examples/cra-kitchen-sink/package.json
@@ -14,7 +14,7 @@
   "dependencies": {
     "global": "^4.3.2",
     "prop-types": "^15.7.2",
-    "react": "^16.8.3",
+    "react": "^16.8.4",
     "react-dom": "^16.8.3",
     "react-lifecycles-compat": "^3.0.4"
   },
diff --git a/examples/cra-ts-kitchen-sink/package.json b/examples/cra-ts-kitchen-sink/package.json
index 8497eb71dea..8a7ecc63cf6 100644
--- a/examples/cra-ts-kitchen-sink/package.json
+++ b/examples/cra-ts-kitchen-sink/package.json
@@ -16,7 +16,7 @@
     ]
   },
   "dependencies": {
-    "react": "^16.8.3",
+    "react": "^16.8.4",
     "react-dom": "^16.8.3"
   },
   "devDependencies": {
diff --git a/examples/official-storybook/package.json b/examples/official-storybook/package.json
index 55693745d2c..323ee72641d 100644
--- a/examples/official-storybook/package.json
+++ b/examples/official-storybook/package.json
@@ -48,7 +48,7 @@
     "jest-emotion": "^10.0.7",
     "paths.macro": "^2.0.2",
     "prop-types": "^15.7.2",
-    "react": "^16.8.3",
+    "react": "^16.8.4",
     "react-dom": "^16.8.3",
     "storybook-chromatic": "^1.2.6",
     "ts-loader": "^5.3.3",
diff --git a/lib/components/package.json b/lib/components/package.json
index 6f3037925b5..4c3baa8965b 100644
--- a/lib/components/package.json
+++ b/lib/components/package.json
@@ -32,7 +32,7 @@
     "memoizerific": "^1.11.3",
     "polished": "^3.0.0",
     "prop-types": "^15.7.2",
-    "react": "^16.8.3",
+    "react": "^16.8.4",
     "react-dom": "^16.8.3",
     "react-focus-lock": "^1.17.7",
     "react-helmet-async": "^0.2.0",
diff --git a/lib/ui/package.json b/lib/ui/package.json
index f88ab00cf41..676154d3e96 100644
--- a/lib/ui/package.json
+++ b/lib/ui/package.json
@@ -41,7 +41,7 @@
     "polished": "^3.0.0",
     "prop-types": "^15.7.2",
     "qs": "^6.6.0",
-    "react": "^16.8.3",
+    "react": "^16.8.4",
     "react-dom": "^16.8.3",
     "react-draggable": "^3.1.1",
     "react-helmet-async": "^0.2.0",
diff --git a/package.json b/package.json
index 7b4ee7fa6d7..cbcec3c0912 100644
--- a/package.json
+++ b/package.json
@@ -126,7 +126,7 @@
     "npmlog": "^4.1.2",
     "prettier": "^1.16.4",
     "raf": "^3.4.0",
-    "react": "^16.8.3",
+    "react": "^16.8.4",
     "react-dom": "^16.8.3",
     "react-test-renderer": "^16.8.3",
     "regenerator-runtime": "^0.12.1",
diff --git a/yarn.lock b/yarn.lock
index d219608bd19..690cd0a4272 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -11139,6 +11139,7 @@ graphql-request@^1.5.0:
 graphql@^0.13.2, graphql@^14.1.1:
   version "0.13.2"
   resolved "https://registry.yarnpkg.com/graphql/-/graphql-0.13.2.tgz#4c740ae3c222823e7004096f832e7b93b2108270"
+  integrity sha512-QZ5BL8ZO/B20VA8APauGBg3GyEgZ19eduvpLWoq5x7gMmWnHoy8rlQWPLmWgFvo1yNgjSEFMesmS4R6pPr7xog==
   dependencies:
     iterall "^1.2.1"
 
@@ -12822,6 +12823,7 @@ istextorbinary@2.1.0:
 iterall@^1.2.1:
   version "1.2.2"
   resolved "https://registry.yarnpkg.com/iterall/-/iterall-1.2.2.tgz#92d70deb8028e0c39ff3164fdbf4d8b088130cd7"
+  integrity sha512-yynBb1g+RFUPY64fTrFv7nsjRrENBQJaX2UL+2Szc9REFrSNm1rpSXHGzhmAy7a9uv3vlvgBlXnf9RqmPH1/DA==
 
 jasmine-core@~2.8.0:
   version "2.8.0"
@@ -19306,15 +19308,15 @@ react-transition-group@^2.2.1:
     prop-types "^15.6.2"
     react-lifecycles-compat "^3.0.4"
 
-react@^16.8.3:
-  version "16.8.3"
-  resolved "https://registry.yarnpkg.com/react/-/react-16.8.3.tgz#c6f988a2ce895375de216edcfaedd6b9a76451d9"
-  integrity sha512-3UoSIsEq8yTJuSu0luO1QQWYbgGEILm+eJl2QN/VLDi7hL+EN18M3q3oVZwmVzzBJ3DkM7RMdRwBmZZ+b4IzSA==
+react@^16.8.4:
+  version "16.8.4"
+  resolved "https://registry.yarnpkg.com/react/-/react-16.8.4.tgz#fdf7bd9ae53f03a9c4cd1a371432c206be1c4768"
+  integrity sha512-0GQ6gFXfUH7aZcjGVymlPOASTuSjlQL4ZtVC5YKH+3JL6bBLCVO21DknzmaPlI90LN253ojj02nsapy+j7wIjg==
   dependencies:
     loose-envify "^1.1.0"
     object-assign "^4.1.1"
     prop-types "^15.6.2"
-    scheduler "^0.13.3"
+    scheduler "^0.13.4"
 
 reactcss@^1.2.0:
   version "1.2.3"
@@ -20613,10 +20615,10 @@ sax@~1.1.1:
   resolved "https://registry.yarnpkg.com/sax/-/sax-1.1.6.tgz#5d616be8a5e607d54e114afae55b7eaf2fcc3240"
   integrity sha1-XWFr6KXmB9VOEUr65Vt+ry/MMkA=
 
-scheduler@^0.13.3:
-  version "0.13.3"
-  resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.13.3.tgz#bed3c5850f62ea9c716a4d781f9daeb9b2a58896"
-  integrity sha512-UxN5QRYWtpR1egNWzJcVLk8jlegxAugswQc984lD3kU7NuobsO37/sRfbpTdBjtnD5TBNFA2Q2oLV5+UmPSmEQ==
+scheduler@^0.13.3, scheduler@^0.13.4:
+  version "0.13.4"
+  resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.13.4.tgz#8fef05e7a3580c76c0364d2df5e550e4c9140298"
+  integrity sha512-cvSOlRPxOHs5dAhP9yiS/6IDmVAVxmk33f0CtTJRkmUWcb1Us+t7b1wqdzoC0REw2muC9V5f1L/w5R5uKGaepA==
   dependencies:
     loose-envify "^1.1.0"
     object-assign "^4.1.1"

From 3eb19cac4a66eef54678fb7a736dc1d6a2c1e264 Mon Sep 17 00:00:00 2001
From: Vasily Malykhin <malykhinvi@gmail.com>
Date: Sat, 9 Mar 2019 13:07:03 +0300
Subject: [PATCH 222/249] Fix #5785 - welcome component in dark theme

---
 .../storyshot.enzyme.test.js.snap             |   4 +-
 ...t.snapshotWithOptionsFunction.test.js.snap |   4 +-
 .../__snapshots__/Welcome.stories.foo         |   4 +-
 .../__snapshots__/Welcome.stories.storyshot   |   4 +-
 app/angular/src/demo/welcome.component.ts     |   4 +-
 app/react/src/demo/Welcome.js                 |   4 +-
 .../stories/__snapshots__/welcome.storyshot   |   2 +-
 examples/ember-cli/app/styles/app.css         |   4 +-
 .../html-kitchen-sink/stories/welcome.css     |   4 +-
 examples/mithril-kitchen-sink/src/Welcome.js  |   4 +-
 .../other-demo.stories.storyshot              |   2 +-
 examples/preact-kitchen-sink/src/Welcome.js   |   4 +-
 .../__snapshots__/index.stories.storyshot     |   4 +-
 .../riot-kitchen-sink/src/stories/Welcome.tag |   4 +-
 .../src/stories/__snapshots__/index.storyshot |  16 +-
 .../src/stories/views/WelcomeView.svelte      |   4 +-
 .../vue-kitchen-sink/src/stories/Welcome.vue  |   4 +-
 .../MITHRIL/template/stories/Welcome.js       |   4 +-
 .../PREACT/template/stories/Welcome.js        |   4 +-
 .../RIOT/template/stories/Welcome.tag         | 186 +++++++++---------
 .../SFC_VUE/template/src/stories/Welcome.vue  |   4 +-
 .../VUE/template/stories/Welcome.js           |   4 +-
 .../stories/Welcome.js                        |   4 +-
 23 files changed, 141 insertions(+), 141 deletions(-)

diff --git a/addons/storyshots/storyshots-core/stories/__snapshots__/storyshot.enzyme.test.js.snap b/addons/storyshots/storyshots-core/stories/__snapshots__/storyshot.enzyme.test.js.snap
index 47f926ed977..cae5deca185 100644
--- a/addons/storyshots/storyshots-core/stories/__snapshots__/storyshot.enzyme.test.js.snap
+++ b/addons/storyshots/storyshots-core/stories/__snapshots__/storyshot.enzyme.test.js.snap
@@ -120,10 +120,10 @@ exports[`Storyshots Welcome to Storybook 1`] = `
     <article
       style={
         Object {
+          "backgroundColor": "#fff",
           "fontFamily": "\\"Helvetica Neue\\", Helvetica, \\"Segoe UI\\", Arial, freesans, sans-serif",
           "lineHeight": 1.4,
-          "margin": 15,
-          "maxWidth": 600,
+          "padding": 15,
         }
       }
     >
diff --git a/addons/storyshots/storyshots-core/stories/__snapshots__/storyshot.snapshotWithOptionsFunction.test.js.snap b/addons/storyshots/storyshots-core/stories/__snapshots__/storyshot.snapshotWithOptionsFunction.test.js.snap
index 4fdce3e5718..dd98d76c66d 100644
--- a/addons/storyshots/storyshots-core/stories/__snapshots__/storyshot.snapshotWithOptionsFunction.test.js.snap
+++ b/addons/storyshots/storyshots-core/stories/__snapshots__/storyshot.snapshotWithOptionsFunction.test.js.snap
@@ -100,10 +100,10 @@ exports[`Storyshots Welcome to Storybook 1`] = `
 <article
   style={
     Object {
+      "backgroundColor": "#fff",
       "fontFamily": "\\"Helvetica Neue\\", Helvetica, \\"Segoe UI\\", Arial, freesans, sans-serif",
       "lineHeight": 1.4,
-      "margin": 15,
-      "maxWidth": 600,
+      "padding": 15,
     }
   }
 >
diff --git a/addons/storyshots/storyshots-core/stories/required_with_context/__snapshots__/Welcome.stories.foo b/addons/storyshots/storyshots-core/stories/required_with_context/__snapshots__/Welcome.stories.foo
index de427853143..1fda01fe66a 100644
--- a/addons/storyshots/storyshots-core/stories/required_with_context/__snapshots__/Welcome.stories.foo
+++ b/addons/storyshots/storyshots-core/stories/required_with_context/__snapshots__/Welcome.stories.foo
@@ -4,10 +4,10 @@ exports[`Storyshots Welcome to Storybook 1`] = `
 <article
   style={
     Object {
+      "backgroundColor": "#fff",
       "fontFamily": "\\"Helvetica Neue\\", Helvetica, \\"Segoe UI\\", Arial, freesans, sans-serif",
       "lineHeight": 1.4,
-      "margin": 15,
-      "maxWidth": 600,
+      "padding": 15,
     }
   }
 >
diff --git a/addons/storyshots/storyshots-core/stories/required_with_context/__snapshots__/Welcome.stories.storyshot b/addons/storyshots/storyshots-core/stories/required_with_context/__snapshots__/Welcome.stories.storyshot
index de427853143..1fda01fe66a 100644
--- a/addons/storyshots/storyshots-core/stories/required_with_context/__snapshots__/Welcome.stories.storyshot
+++ b/addons/storyshots/storyshots-core/stories/required_with_context/__snapshots__/Welcome.stories.storyshot
@@ -4,10 +4,10 @@ exports[`Storyshots Welcome to Storybook 1`] = `
 <article
   style={
     Object {
+      "backgroundColor": "#fff",
       "fontFamily": "\\"Helvetica Neue\\", Helvetica, \\"Segoe UI\\", Arial, freesans, sans-serif",
       "lineHeight": 1.4,
-      "margin": 15,
-      "maxWidth": 600,
+      "padding": 15,
     }
   }
 >
diff --git a/app/angular/src/demo/welcome.component.ts b/app/angular/src/demo/welcome.component.ts
index c8348edbcec..3697700f54b 100644
--- a/app/angular/src/demo/welcome.component.ts
+++ b/app/angular/src/demo/welcome.component.ts
@@ -46,10 +46,10 @@ import { Component, Output, EventEmitter } from '@angular/core';
   styles: [
     `
       main {
-        margin: 15px;
-        max-width: 600;
+        padding: 15px;
         line-height: 1.4;
         fontfamily: 'Helvetica Neue', Helvetica, 'Segoe UI', Arial, freesans, sans-serif;
+        background-color: #ffffff;
       }
 
       .note {
diff --git a/app/react/src/demo/Welcome.js b/app/react/src/demo/Welcome.js
index 687796bc5df..0c5a4cafaf5 100644
--- a/app/react/src/demo/Welcome.js
+++ b/app/react/src/demo/Welcome.js
@@ -5,10 +5,10 @@ const Main = props => (
   <article
     {...props}
     style={{
-      margin: 15,
-      maxWidth: 600,
+      padding: 15,
       lineHeight: 1.4,
       fontFamily: '"Helvetica Neue", Helvetica, "Segoe UI", Arial, freesans, sans-serif',
+      backgroundColor: '#fff',
     }}
   />
 );
diff --git a/examples/cra-kitchen-sink/src/stories/__snapshots__/welcome.storyshot b/examples/cra-kitchen-sink/src/stories/__snapshots__/welcome.storyshot
index 2f536812779..2408d8cf68a 100644
--- a/examples/cra-kitchen-sink/src/stories/__snapshots__/welcome.storyshot
+++ b/examples/cra-kitchen-sink/src/stories/__snapshots__/welcome.storyshot
@@ -2,7 +2,7 @@
 
 exports[`Storyshots Welcome to Storybook 1`] = `
 <article
-  style="margin:15px;max-width:600px;line-height:1.4;font-family:\\"Helvetica Neue\\", Helvetica, \\"Segoe UI\\", Arial, freesans, sans-serif"
+  style="padding:15px;line-height:1.4;font-family:\\"Helvetica Neue\\", Helvetica, \\"Segoe UI\\", Arial, freesans, sans-serif;background-color:#fff"
 >
   <h1>
     Welcome to storybook
diff --git a/examples/ember-cli/app/styles/app.css b/examples/ember-cli/app/styles/app.css
index 82171a5b4ec..30fa0b480d1 100644
--- a/examples/ember-cli/app/styles/app.css
+++ b/examples/ember-cli/app/styles/app.css
@@ -30,10 +30,10 @@ a {
 }
 
 .main {
-  margin: 15px;
-  max-width: 600;
+  padding: 15px;
   line-height: 1.4;
   font-family: "Helvetica Neue", Helvetica, "Segoe UI", Arial, freesans, sans-serif;
+  background-color: #ffffff;
 }
 
 .logo {
diff --git a/examples/html-kitchen-sink/stories/welcome.css b/examples/html-kitchen-sink/stories/welcome.css
index ea42a498315..10b74ed6f9c 100644
--- a/examples/html-kitchen-sink/stories/welcome.css
+++ b/examples/html-kitchen-sink/stories/welcome.css
@@ -1,8 +1,8 @@
 .main {
-    margin: 15px;
-    max-width: 600px;
+    padding: 15px;
     line-height: 1.4;
     font-family: "Helvetica Neue", Helvetica, "Segoe UI", Arial, freesans, sans-serif;
+    background-color: #ffffff;
 }
 
 .logo {
diff --git a/examples/mithril-kitchen-sink/src/Welcome.js b/examples/mithril-kitchen-sink/src/Welcome.js
index e85d5493797..1363fa0cbe6 100644
--- a/examples/mithril-kitchen-sink/src/Welcome.js
+++ b/examples/mithril-kitchen-sink/src/Welcome.js
@@ -6,10 +6,10 @@ const Main = {
   view: vnode => (
     <article
       style={{
-        margin: '15px',
-        maxWidth: '600px',
+        padding: '15px',
         lineHeight: 1.4,
         fontFamily: '"Helvetica Neue", Helvetica, "Segoe UI", Arial, freesans, sans-serif',
+        backgroundColor: '#ffffff',
       }}
     >
       {vnode.children}
diff --git a/examples/official-storybook/stories/__snapshots__/other-demo.stories.storyshot b/examples/official-storybook/stories/__snapshots__/other-demo.stories.storyshot
index 730eefa2fba..49f1a87f0fc 100644
--- a/examples/official-storybook/stories/__snapshots__/other-demo.stories.storyshot
+++ b/examples/official-storybook/stories/__snapshots__/other-demo.stories.storyshot
@@ -25,7 +25,7 @@ exports[`Storyshots Other|Demo/Button with text 1`] = `
 
 exports[`Storyshots Other|Demo/Welcome to Storybook 1`] = `
 <article
-  style="margin:15px;max-width:600px;line-height:1.4;font-family:\\"Helvetica Neue\\", Helvetica, \\"Segoe UI\\", Arial, freesans, sans-serif"
+  style="padding:15px;line-height:1.4;font-family:\\"Helvetica Neue\\", Helvetica, \\"Segoe UI\\", Arial, freesans, sans-serif;background-color:#fff"
 >
   <h1>
     Welcome to storybook
diff --git a/examples/preact-kitchen-sink/src/Welcome.js b/examples/preact-kitchen-sink/src/Welcome.js
index b83a12e2c40..53ec35fc114 100644
--- a/examples/preact-kitchen-sink/src/Welcome.js
+++ b/examples/preact-kitchen-sink/src/Welcome.js
@@ -6,10 +6,10 @@ const Main = props => (
   <article
     {...props}
     style={{
-      margin: 15,
-      maxWidth: 600,
+      padding: 15,
       lineHeight: 1.4,
       fontFamily: '"Helvetica Neue", Helvetica, "Segoe UI", Arial, freesans, sans-serif',
+      backgroundColor: '#ffffff',
     }}
   />
 );
diff --git a/examples/preact-kitchen-sink/src/stories/__snapshots__/index.stories.storyshot b/examples/preact-kitchen-sink/src/stories/__snapshots__/index.stories.storyshot
index 660d4bdf571..9e0d000a05e 100644
--- a/examples/preact-kitchen-sink/src/stories/__snapshots__/index.stories.storyshot
+++ b/examples/preact-kitchen-sink/src/stories/__snapshots__/index.stories.storyshot
@@ -27,10 +27,10 @@ exports[`Storyshots Welcome to Storybook 1`] = `
 <article
   style={
     Object {
+      "backgroundColor": "#ffffff",
       "fontFamily": "\\"Helvetica Neue\\", Helvetica, \\"Segoe UI\\", Arial, freesans, sans-serif",
       "lineHeight": 1.4,
-      "margin": 15,
-      "maxWidth": 600,
+      "padding": 15,
     }
   }
 >
diff --git a/examples/riot-kitchen-sink/src/stories/Welcome.tag b/examples/riot-kitchen-sink/src/stories/Welcome.tag
index a3965f4ff44..ace441a1086 100644
--- a/examples/riot-kitchen-sink/src/stories/Welcome.tag
+++ b/examples/riot-kitchen-sink/src/stories/Welcome.tag
@@ -58,10 +58,10 @@
 
 <style>
   .main {
-    margin: 15px;
-    max-width: 600;
+    padding: 15px;
     line-height: 1.4;
     font-family: "Helvetica Neue", Helvetica, "Segoe UI", Arial, freesans, sans-serif;
+    background-color: #ffffff;
   }
 
   .logo {
diff --git a/examples/svelte-kitchen-sink/src/stories/__snapshots__/index.storyshot b/examples/svelte-kitchen-sink/src/stories/__snapshots__/index.storyshot
index cc251a66639..c9855acafb0 100644
--- a/examples/svelte-kitchen-sink/src/stories/__snapshots__/index.storyshot
+++ b/examples/svelte-kitchen-sink/src/stories/__snapshots__/index.storyshot
@@ -105,7 +105,7 @@ exports[`Storyshots Welcome Welcome 1`] = `
   class="storybook-snapshot-container"
 >
   <div
-    class="main svelte-1unvhkg"
+    class="main svelte-5n9a95"
   >
     <h1>
       Welcome to Storybook for Svelte
@@ -123,7 +123,7 @@ exports[`Storyshots Welcome Welcome 1`] = `
       
 			    We've added some basic stories inside the 
       <code
-        class="code svelte-1unvhkg"
+        class="code svelte-5n9a95"
       >
         src/stories
       </code>
@@ -141,7 +141,7 @@ exports[`Storyshots Welcome Welcome 1`] = `
 
 			  
     <h1
-      class="logo svelte-1unvhkg"
+      class="logo svelte-5n9a95"
     >
       Svelte
     </h1>
@@ -157,14 +157,14 @@ exports[`Storyshots Welcome Welcome 1`] = `
       
 			    (Try editing the 
       <code
-        class="code svelte-1unvhkg"
+        class="code svelte-5n9a95"
       >
         Button
       </code>
        component
 			    located at 
       <code
-        class="code svelte-1unvhkg"
+        class="code svelte-5n9a95"
       >
         src/stories/views/Welcome.svelte
       </code>
@@ -181,7 +181,7 @@ exports[`Storyshots Welcome Welcome 1`] = `
 			    Have a look at the
 			    
       <a
-        class="link svelte-1unvhkg"
+        class="link svelte-5n9a95"
         href="https://storybook.js.org/basics/writing-stories"
         target="_blank"
       >
@@ -194,7 +194,7 @@ exports[`Storyshots Welcome Welcome 1`] = `
     
 			  
     <p
-      class="note svelte-1unvhkg"
+      class="note svelte-5n9a95"
     >
       <b>
         NOTE:
@@ -206,7 +206,7 @@ exports[`Storyshots Welcome Welcome 1`] = `
 			    Have a look at the
 			    
       <code
-        class="code svelte-1unvhkg"
+        class="code svelte-5n9a95"
       >
         .storybook/webpack.config.js
       </code>
diff --git a/examples/svelte-kitchen-sink/src/stories/views/WelcomeView.svelte b/examples/svelte-kitchen-sink/src/stories/views/WelcomeView.svelte
index d401629d8a8..f3bfc9442b3 100644
--- a/examples/svelte-kitchen-sink/src/stories/views/WelcomeView.svelte
+++ b/examples/svelte-kitchen-sink/src/stories/views/WelcomeView.svelte
@@ -43,10 +43,10 @@
   @import url('https://fonts.googleapis.com/css?family=Rajdhani');
 
   .main {
-    margin: 15px;
-    max-width: 600;
+    padding: 15px;
     line-height: 1.4;
     font-family: "Helvetica Neue", Helvetica, "Segoe UI", Arial, freesans, sans-serif;
+    background-color: #ffffff;
   }
 
   .logo {
diff --git a/examples/vue-kitchen-sink/src/stories/Welcome.vue b/examples/vue-kitchen-sink/src/stories/Welcome.vue
index 20217f381ea..6c525865204 100644
--- a/examples/vue-kitchen-sink/src/stories/Welcome.vue
+++ b/examples/vue-kitchen-sink/src/stories/Welcome.vue
@@ -65,10 +65,10 @@
 
 <style>
   .main {
-    margin: 15px;
-    max-width: 600;
+    padding: 15px;
     line-height: 1.4;
     font-family: "Helvetica Neue", Helvetica, "Segoe UI", Arial, freesans, sans-serif;
+    background-color: #ffffff;
   }
 
   .logo {
diff --git a/lib/cli/generators/MITHRIL/template/stories/Welcome.js b/lib/cli/generators/MITHRIL/template/stories/Welcome.js
index cef0d3127fd..33ab199fc54 100644
--- a/lib/cli/generators/MITHRIL/template/stories/Welcome.js
+++ b/lib/cli/generators/MITHRIL/template/stories/Welcome.js
@@ -7,10 +7,10 @@ const Main = {
   view: vnode => (
     <article
       style={{
-        margin: '15px',
-        maxWidth: '600px',
+        padding: '15px',
         lineHeight: 1.4,
         fontFamily: '"Helvetica Neue", Helvetica, "Segoe UI", Arial, freesans, sans-serif',
+        backgroundColor: '#ffffff',
       }}
     >
       {vnode.children}
diff --git a/lib/cli/generators/PREACT/template/stories/Welcome.js b/lib/cli/generators/PREACT/template/stories/Welcome.js
index 097111470e6..d3d8d1253fb 100644
--- a/lib/cli/generators/PREACT/template/stories/Welcome.js
+++ b/lib/cli/generators/PREACT/template/stories/Welcome.js
@@ -5,10 +5,10 @@ const Main = props => (
   <article
     {...props}
     style={{
-      margin: 15,
-      maxWidth: 600,
+      padding: 15,
       lineHeight: 1.4,
       fontFamily: '"Helvetica Neue", Helvetica, "Segoe UI", Arial, freesans, sans-serif',
+      backgroundColor: '#ffffff',
     }}
   />
 );
diff --git a/lib/cli/generators/RIOT/template/stories/Welcome.tag b/lib/cli/generators/RIOT/template/stories/Welcome.tag
index 0866a54e125..73149469a7a 100644
--- a/lib/cli/generators/RIOT/template/stories/Welcome.tag
+++ b/lib/cli/generators/RIOT/template/stories/Welcome.tag
@@ -1,93 +1,93 @@
-<welcome>
-  <div class="main">
-    <h1>Welcome to STORYBOOK</h1>
-    <p>
-      This is a UI component dev environment for your app.
-    </p>
-    <p>
-      We've added some basic stories inside the
-      <br />
-      <code class="code">src/stories</code>
-      <br /> directory.
-      <br /> A story is a single state of one or more UI components. You can have as many stories as you want.
-      <br /> (Basically a story is like a visual test case.)
-    </p>
-    <p>
-      See these sample
-      <br />
-      <a class="link" onclick={onClick} role="button" tabIndex="0">stories</a>
-      <br /> for a component called
-      <br />
-      <code class="code">Button</code> .
-    </p>
-    <p>
-      Just like that, you can add your own components as stories.
-      <br /> You can also edit those components and see changes right away.
-      <br /> (Try editing the
-      <code class="code">Button</code> component located at
-      <code class="code">src/stories/Button.js</code>.)
-    </p>
-    <p>
-      This is just one thing you can do with Storybook.
-      <br /> Have a look at the
-      <br />
-      <a class="link" href="https://github.com/storybooks/storybook" target="_blank" rel="noopener noreferrer">
-        Storybook
-      </a>
-      <br /> repo for more information.
-    </p>
-    <p class="note">
-      <b>NOTE:</b>
-      <br /> Have a look at the
-      <br />
-      <code class="code">.storybook/webpack.config.js</code>
-      <br /> to add webpack loaders and plugins you are using in this project.
-    </p>
-  </div>
-
-  <style>
-    main {
-      margin: 15;
-      max-width: 600;
-      line-height: 1.4;
-      font-family: '"Helvetica Neue", Helvetica, "Segoe UI", Arial, freesans, sans-serif'
-    }
-
-    logo {
-      width: 200
-    }
-
-    link {
-      color: '#1474f3';
-      text-decoration: 'none';
-      border-bottom: '1px solid #1474f3';
-      padding-bottom: 2
-    }
-
-    code {
-      font-size: 15;
-      font-weight: 600;
-      padding: '2px 5px';
-      border: '1px solid #eae9e9';
-      border-radius: 4;
-      background-color: '#f3f2f2';
-      color: '#3a3a3a';
-    }
-
-    note {
-      opacity: 0.5
-    }
-  </style>
-
-  <script>
-    console.log('Welcome to storybook!');
-
-    onClick(event) {
-      return function (e) {
-        event.preventDefault();
-        this.opts.showApp();
-      }.bind(this)
-    };
-  </script>
-
-</welcome>
+<welcome>
+  <div class="main">
+    <h1>Welcome to STORYBOOK</h1>
+    <p>
+      This is a UI component dev environment for your app.
+    </p>
+    <p>
+      We've added some basic stories inside the
+      <br />
+      <code class="code">src/stories</code>
+      <br /> directory.
+      <br /> A story is a single state of one or more UI components. You can have as many stories as you want.
+      <br /> (Basically a story is like a visual test case.)
+    </p>
+    <p>
+      See these sample
+      <br />
+      <a class="link" onclick={onClick} role="button" tabIndex="0">stories</a>
+      <br /> for a component called
+      <br />
+      <code class="code">Button</code> .
+    </p>
+    <p>
+      Just like that, you can add your own components as stories.
+      <br /> You can also edit those components and see changes right away.
+      <br /> (Try editing the
+      <code class="code">Button</code> component located at
+      <code class="code">src/stories/Button.js</code>.)
+    </p>
+    <p>
+      This is just one thing you can do with Storybook.
+      <br /> Have a look at the
+      <br />
+      <a class="link" href="https://github.com/storybooks/storybook" target="_blank" rel="noopener noreferrer">
+        Storybook
+      </a>
+      <br /> repo for more information.
+    </p>
+    <p class="note">
+      <b>NOTE:</b>
+      <br /> Have a look at the
+      <br />
+      <code class="code">.storybook/webpack.config.js</code>
+      <br /> to add webpack loaders and plugins you are using in this project.
+    </p>
+  </div>
+
+  <style>
+    main {
+      padding: 15;
+      line-height: 1.4;
+      font-family: '"Helvetica Neue", Helvetica, "Segoe UI", Arial, freesans, sans-serif';
+      background-color: #ffffff;
+    }
+
+    logo {
+      width: 200
+    }
+
+    link {
+      color: '#1474f3';
+      text-decoration: 'none';
+      border-bottom: '1px solid #1474f3';
+      padding-bottom: 2
+    }
+
+    code {
+      font-size: 15;
+      font-weight: 600;
+      padding: '2px 5px';
+      border: '1px solid #eae9e9';
+      border-radius: 4;
+      background-color: '#f3f2f2';
+      color: '#3a3a3a';
+    }
+
+    note {
+      opacity: 0.5
+    }
+  </style>
+
+  <script>
+    console.log('Welcome to storybook!');
+
+    onClick(event) {
+      return function (e) {
+        event.preventDefault();
+        this.opts.showApp();
+      }.bind(this)
+    };
+  </script>
+
+</welcome>
diff --git a/lib/cli/generators/SFC_VUE/template/src/stories/Welcome.vue b/lib/cli/generators/SFC_VUE/template/src/stories/Welcome.vue
index afdf3b3a26a..d87d5f04650 100644
--- a/lib/cli/generators/SFC_VUE/template/src/stories/Welcome.vue
+++ b/lib/cli/generators/SFC_VUE/template/src/stories/Welcome.vue
@@ -87,10 +87,10 @@
 
 <style>
   .main {
-    margin: 15px;
-    max-width: 600px;
+    padding: 15px;
     line-height: 1.4;
     font-family: "Helvetica Neue", Helvetica, "Segoe UI", Arial, freesans, sans-serif;
+    background-color: #ffffff;
   }
 
   .logo {
diff --git a/lib/cli/generators/VUE/template/stories/Welcome.js b/lib/cli/generators/VUE/template/stories/Welcome.js
index 42b614121bd..4c10fb17908 100644
--- a/lib/cli/generators/VUE/template/stories/Welcome.js
+++ b/lib/cli/generators/VUE/template/stories/Welcome.js
@@ -14,10 +14,10 @@ export default {
   data() {
     return {
       main: {
-        margin: 15,
-        maxWidth: 600,
+        padding: 15,
         lineHeight: 1.4,
         fontFamily: '"Helvetica Neue", Helvetica, "Segoe UI", Arial, freesans, sans-serif',
+        backgroundColor: '#ffffff',
       },
 
       logo: {
diff --git a/lib/cli/test/fixtures/update_package_organisations/stories/Welcome.js b/lib/cli/test/fixtures/update_package_organisations/stories/Welcome.js
index d126acbbed4..0c6ac3e87e8 100644
--- a/lib/cli/test/fixtures/update_package_organisations/stories/Welcome.js
+++ b/lib/cli/test/fixtures/update_package_organisations/stories/Welcome.js
@@ -2,10 +2,10 @@ import React from 'react';
 
 const styles = {
   main: {
-    margin: 15,
-    maxWidth: 600,
+    padding: 15,
     lineHeight: 1.4,
     fontFamily: '"Helvetica Neue", Helvetica, "Segoe UI", Arial, freesans, sans-serif',
+    backgroundColor: '#ffffff',
   },
 
   logo: {

From e198d3c00c8944c1cd0d8e7e807aa3cc8a1a3eeb Mon Sep 17 00:00:00 2001
From: Arman Sargsyan <mail@arman.io>
Date: Thu, 7 Mar 2019 20:49:37 +0300
Subject: [PATCH 223/249] fix(stories): `selectStory` correct behavior on call
 with one parameter when in `selectStory` passed kind name will redirect on
 first story in needed kind tests(stories): add test for call `selectStory`
 with only kind name

---
 lib/ui/src/core/stories.js      |  7 +++++--
 lib/ui/src/core/stories.test.js | 15 +++++++++++++++
 2 files changed, 20 insertions(+), 2 deletions(-)

diff --git a/lib/ui/src/core/stories.js b/lib/ui/src/core/stories.js
index 94cfd00204b..d58e345a0ab 100644
--- a/lib/ui/src/core/stories.js
+++ b/lib/ui/src/core/stories.js
@@ -195,9 +195,12 @@ const initStoriesApi = ({
   };
 
   const selectStory = (kindOrId, story) => {
-    const { viewMode = 'story', storyId } = store.getState();
+    const { viewMode = 'story', storyId, storiesHash } = store.getState();
     if (!story) {
-      navigate(`/${viewMode}/${kindOrId}`);
+      const s = storiesHash[sanitize(kindOrId)];
+      // eslint-disable-next-line no-nested-ternary
+      const id = s ? (s.children ? s.children[0] : s.id) : kindOrId;
+      navigate(`/${viewMode}/${id}`);
     } else if (!kindOrId) {
       // This is a slugified version of the kind, but that's OK, our toId function is idempotent
       const kind = storyId.split('--', 2)[0];
diff --git a/lib/ui/src/core/stories.test.js b/lib/ui/src/core/stories.test.js
index c16c703ec72..b200ed0b8b9 100644
--- a/lib/ui/src/core/stories.test.js
+++ b/lib/ui/src/core/stories.test.js
@@ -400,5 +400,20 @@ describe('stories API', () => {
       selectStory(null, '2');
       expect(navigate).toHaveBeenCalledWith('/story/a--2');
     });
+
+    it('allows navigating to first story in kind on call by kind', () => {
+      const navigate = jest.fn();
+      const store = createMockStore();
+
+      const {
+        api: { selectStory, setStories },
+        state,
+      } = initStories({ store, navigate });
+      store.setState(state);
+      setStories(storiesHash);
+
+      selectStory('a');
+      expect(navigate).toHaveBeenCalledWith('/story/a--1');
+    });
   });
 });

From c24c7075fddd1396b5d7a6f4950925829d6bfd97 Mon Sep 17 00:00:00 2001
From: Arman Sargsyan <mail@arman.io>
Date: Sat, 9 Mar 2019 16:46:56 +0300
Subject: [PATCH 224/249] feat(a11y): add 'incomplete' tab @see
 https://github.com/dequelabs/axe-core/blob/develop/doc/API.md#callback-parameter

---
 addons/a11y/src/components/A11YPanel.tsx | 19 ++++++++++++++++---
 1 file changed, 16 insertions(+), 3 deletions(-)

diff --git a/addons/a11y/src/components/A11YPanel.tsx b/addons/a11y/src/components/A11YPanel.tsx
index 482cceda591..648a072c3cb 100644
--- a/addons/a11y/src/components/A11YPanel.tsx
+++ b/addons/a11y/src/components/A11YPanel.tsx
@@ -32,10 +32,15 @@ const Violations = styled.span(({ theme }) => ({
   color: theme.color.negative,
 }));
 
+const Incomplete = styled.span(({ theme }) => ({
+  color: theme.color.warning,
+}));
+
 interface A11YPanelState {
   status: string;
   passes: Result[];
   violations: Result[];
+  incomplete: Result[];
 }
 
 interface A11YPanelProps {
@@ -52,6 +57,7 @@ export class A11YPanel extends Component<A11YPanelProps, A11YPanelState> {
     status: 'ready',
     passes: [],
     violations: [],
+    incomplete: [],
   };
 
   componentDidMount() {
@@ -77,12 +83,13 @@ export class A11YPanel extends Component<A11YPanelProps, A11YPanelState> {
     api.off(EVENTS.RESULT, this.onUpdate);
   }
 
-  onUpdate = ({ passes, violations }: AxeResults) => {
+  onUpdate = ({ passes, violations, incomplete }: AxeResults) => {
     this.setState(
       {
         status: 'ran',
         passes,
         violations,
+        incomplete,
       },
       () => {
         setTimeout(() => {
@@ -113,7 +120,7 @@ export class A11YPanel extends Component<A11YPanelProps, A11YPanelState> {
   };
 
   render() {
-    const { passes, violations, status } = this.state;
+    const { passes, violations, incomplete, status } = this.state;
     const { active } = this.props;
 
     let actionTitle;
@@ -147,7 +154,13 @@ export class A11YPanel extends Component<A11YPanelProps, A11YPanelState> {
               },
               {
                 label: <Passes>{passes.length} Passes</Passes>,
-                panel: <Report passes items={passes} empty="No a11y check passed" />,
+                panel: <Report passes items={passes} empty="No a11y check passed." />,
+              },
+              {
+                label: <Incomplete>{incomplete.length} Incomplete</Incomplete>,
+                panel: (
+                  <Report passes={false} items={incomplete} empty="No a11y incomplete found." />
+                ),
               },
             ]}
           />

From d5aaee62fc5b583bd315938dce814be4177f68e6 Mon Sep 17 00:00:00 2001
From: Arman Sargsyan <mail@arman.io>
Date: Sat, 9 Mar 2019 16:47:50 +0300
Subject: [PATCH 225/249] fix(examples): cra-kitchen-sink project has a11y
 addon, but not correct initialized

---
 examples/cra-kitchen-sink/.storybook/config.js | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/examples/cra-kitchen-sink/.storybook/config.js b/examples/cra-kitchen-sink/.storybook/config.js
index 7e1af733415..f24937049f0 100644
--- a/examples/cra-kitchen-sink/.storybook/config.js
+++ b/examples/cra-kitchen-sink/.storybook/config.js
@@ -1,5 +1,8 @@
-import { configure, addParameters } from '@storybook/react';
+import { configure, addParameters, addDecorator } from '@storybook/react';
 
+import { withA11y } from '@storybook/addon-a11y';
+
+addDecorator(withA11y);
 addParameters({
   options: {
     name: 'CRA Kitchen Sink',

From 87e2dcc0486e48eee4f50e6b5f2154a31259ac90 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Sat, 9 Mar 2019 00:07:13 +0800
Subject: [PATCH 226/249] 5.0.1 changelog

---
 CHANGELOG.md | 11 +++++++++++
 1 file changed, 11 insertions(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index b73c100d0b8..421a1d015aa 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,14 @@
+## 5.0.1 (March 9, 2019)
+
+### Bug Fixes
+
+* Core: Remove custom presets warning ([#5911](https://github.com/storybooks/storybook/pull/5911))
+* Core: support unicode chars in story IDs ([#5964](https://github.com/storybooks/storybook/pull/5964))
+* Core: Add core-js dependencies where it was missing ([#5961](https://github.com/storybooks/storybook/pull/5961))
+* CLI: Fix missing iframe.html in absolute path output directory([#5947](https://github.com/storybooks/storybook/pull/5947))
+* Addon-knobs: Added debouncing between keystrokes to speed up component rendering ([#5811](https://github.com/storybooks/storybook/pull/5811))
+* UI: Fix search in production mode ([#5909](https://github.com/storybooks/storybook/pull/5909))
+
 ## 4.1.14 (March 8, 2019)
 
 ### Dependency Upgrades

From 8f88579966657582521068e5e8d76bf7bd245b3f Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Sat, 9 Mar 2019 23:17:38 +0800
Subject: [PATCH 227/249] 5.1.0-alpha.3 changelog

---
 CHANGELOG.md | 22 ++++++++++++++++++++++
 1 file changed, 22 insertions(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 421a1d015aa..6e3192fc827 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,25 @@
+## 5.1.0-alpha.3 (March 9, 2019)
+
+### Features
+
+* Addon-a11y: add 'incomplete' tab ([#5984](https://github.com/storybooks/storybook/pull/5984))
+
+### Bug Fixes
+
+* Core: fix `selectStory` with one parameter ([#5983](https://github.com/storybooks/storybook/pull/5983))
+* Core: remove custom presets warning ([#5911](https://github.com/storybooks/storybook/pull/5911))
+
+### Maintenance
+
+* Addon-viewport: Change styling to more closely match v4 ([#5979](https://github.com/storybooks/storybook/pull/5979))
+
+### Dependency Upgrades
+
+* Bump babel-preset-react-app from 7.0.1 to 7.0.2 ([#5937](https://github.com/storybooks/storybook/pull/5937))
+* Bump ts-node from 8.0.2 to 8.0.3 ([#5938](https://github.com/storybooks/storybook/pull/5938))
+* Bump react from 16.8.3 to 16.8.4 ([#5902](https://github.com/storybooks/storybook/pull/5902))
+* Bump marko from 4.15.3 to 4.15.4 ([#5939](https://github.com/storybooks/storybook/pull/5939))
+
 ## 5.0.1 (March 9, 2019)
 
 ### Bug Fixes

From 978caa74502fd06c825dc78d6ad984e3bca79ff6 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Sat, 9 Mar 2019 23:25:09 +0800
Subject: [PATCH 228/249] v5.1.0-alpha.3

---
 addons/a11y/package.json                      | 12 ++---
 addons/actions/package.json                   | 10 ++--
 addons/backgrounds/package.json               | 12 ++---
 addons/centered/package.json                  |  2 +-
 addons/cssresources/package.json              |  8 +--
 addons/events/package.json                    |  8 +--
 addons/google-analytics/package.json          |  6 +--
 addons/graphql/package.json                   |  2 +-
 addons/info/package.json                      | 10 ++--
 addons/jest/package.json                      | 10 ++--
 addons/knobs/package.json                     | 10 ++--
 addons/links/package.json                     |  6 +--
 addons/notes/package.json                     | 12 ++---
 addons/ondevice-backgrounds/package.json      |  4 +-
 addons/ondevice-knobs/package.json            |  4 +-
 addons/ondevice-notes/package.json            |  4 +-
 addons/options/package.json                   |  4 +-
 .../storyshots/storyshots-core/package.json   |  4 +-
 .../storyshots-puppeteer/package.json         |  6 +--
 addons/storysource/package.json               | 10 ++--
 addons/viewport/package.json                  | 12 ++---
 app/angular/package.json                      |  6 +--
 app/ember/package.json                        |  4 +-
 app/html/package.json                         |  4 +-
 app/marko/package.json                        |  4 +-
 app/mithril/package.json                      |  4 +-
 app/polymer/package.json                      |  4 +-
 app/preact/package.json                       |  4 +-
 app/react-native/package.json                 | 14 ++---
 app/react/package.json                        |  6 +--
 app/riot/package.json                         |  4 +-
 app/svelte/package.json                       |  4 +-
 app/vue/package.json                          |  4 +-
 examples/angular-cli/package.json             | 26 ++++-----
 examples/cra-kitchen-sink/package.json        | 32 +++++------
 examples/cra-ts-kitchen-sink/package.json     | 12 ++---
 examples/ember-cli/package.json               | 26 ++++-----
 examples/html-kitchen-sink/package.json       | 36 ++++++-------
 examples/marko-cli/package.json               | 14 ++---
 examples/mithril-kitchen-sink/package.json    | 26 ++++-----
 examples/official-storybook/package.json      | 48 ++++++++---------
 examples/polymer-cli/package.json             | 20 +++----
 examples/preact-kitchen-sink/package.json     | 26 ++++-----
 examples/riot-kitchen-sink/package.json       | 26 ++++-----
 examples/svelte-kitchen-sink/package.json     | 26 ++++-----
 examples/vue-kitchen-sink/package.json        | 26 ++++-----
 lerna.json                                    |  2 +-
 lib/addons/package.json                       |  6 +--
 lib/channel-postmessage/package.json          |  6 +--
 lib/channel-websocket/package.json            |  4 +-
 lib/channels/package.json                     |  2 +-
 lib/cli/package.json                          | 54 +++++++++----------
 lib/client-api/package.json                   | 10 ++--
 lib/client-logger/package.json                |  2 +-
 lib/codemod/package.json                      |  2 +-
 lib/components/package.json                   | 12 ++---
 lib/core-events/package.json                  |  2 +-
 lib/core/package.json                         | 18 +++----
 lib/node-logger/package.json                  |  2 +-
 lib/router/package.json                       |  4 +-
 lib/theming/package.json                      |  4 +-
 lib/ui/package.json                           | 14 ++---
 62 files changed, 353 insertions(+), 353 deletions(-)

diff --git a/addons/a11y/package.json b/addons/a11y/package.json
index 2e21bc8c81b..b8f33a99d3b 100644
--- a/addons/a11y/package.json
+++ b/addons/a11y/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-a11y",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "a11y addon for storybook",
   "keywords": [
     "a11y",
@@ -26,11 +26,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.2",
-    "@storybook/client-logger": "5.1.0-alpha.2",
-    "@storybook/components": "5.1.0-alpha.2",
-    "@storybook/core-events": "5.1.0-alpha.2",
-    "@storybook/theming": "5.1.0-alpha.2",
+    "@storybook/addons": "5.1.0-alpha.3",
+    "@storybook/client-logger": "5.1.0-alpha.3",
+    "@storybook/components": "5.1.0-alpha.3",
+    "@storybook/core-events": "5.1.0-alpha.3",
+    "@storybook/theming": "5.1.0-alpha.3",
     "axe-core": "^3.1.2",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
diff --git a/addons/actions/package.json b/addons/actions/package.json
index 80efbe1df03..bb5bbec5148 100644
--- a/addons/actions/package.json
+++ b/addons/actions/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-actions",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "Action Logger addon for storybook",
   "keywords": [
     "storybook"
@@ -21,10 +21,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.2",
-    "@storybook/components": "5.1.0-alpha.2",
-    "@storybook/core-events": "5.1.0-alpha.2",
-    "@storybook/theming": "5.1.0-alpha.2",
+    "@storybook/addons": "5.1.0-alpha.3",
+    "@storybook/components": "5.1.0-alpha.3",
+    "@storybook/core-events": "5.1.0-alpha.3",
+    "@storybook/theming": "5.1.0-alpha.3",
     "core-js": "^2.6.5",
     "fast-deep-equal": "^2.0.1",
     "global": "^4.3.2",
diff --git a/addons/backgrounds/package.json b/addons/backgrounds/package.json
index 162260fd8c5..e0bd6d881f8 100644
--- a/addons/backgrounds/package.json
+++ b/addons/backgrounds/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-backgrounds",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "A storybook addon to show different backgrounds for your preview",
   "keywords": [
     "addon",
@@ -25,11 +25,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.2",
-    "@storybook/client-logger": "5.1.0-alpha.2",
-    "@storybook/components": "5.1.0-alpha.2",
-    "@storybook/core-events": "5.1.0-alpha.2",
-    "@storybook/theming": "5.1.0-alpha.2",
+    "@storybook/addons": "5.1.0-alpha.3",
+    "@storybook/client-logger": "5.1.0-alpha.3",
+    "@storybook/components": "5.1.0-alpha.3",
+    "@storybook/core-events": "5.1.0-alpha.3",
+    "@storybook/theming": "5.1.0-alpha.3",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
diff --git a/addons/centered/package.json b/addons/centered/package.json
index e118b599ddb..4357e2af1e8 100644
--- a/addons/centered/package.json
+++ b/addons/centered/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-centered",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "Storybook decorator to center components",
   "keywords": [
     "addon",
diff --git a/addons/cssresources/package.json b/addons/cssresources/package.json
index c5d460586d3..2567a51f68b 100644
--- a/addons/cssresources/package.json
+++ b/addons/cssresources/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-cssresources",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "A storybook addon to switch between css resources at runtime for your story",
   "keywords": [
     "addon",
@@ -25,9 +25,9 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.2",
-    "@storybook/components": "5.1.0-alpha.2",
-    "@storybook/core-events": "5.1.0-alpha.2",
+    "@storybook/addons": "5.1.0-alpha.3",
+    "@storybook/components": "5.1.0-alpha.3",
+    "@storybook/core-events": "5.1.0-alpha.3",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "react": "^16.8.4"
diff --git a/addons/events/package.json b/addons/events/package.json
index 4e46e1ea4b9..a4962a7a625 100644
--- a/addons/events/package.json
+++ b/addons/events/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-events",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "Add events to your Storybook stories.",
   "keywords": [
     "addon",
@@ -24,9 +24,9 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.2",
-    "@storybook/core-events": "5.1.0-alpha.2",
-    "@storybook/theming": "5.1.0-alpha.2",
+    "@storybook/addons": "5.1.0-alpha.3",
+    "@storybook/core-events": "5.1.0-alpha.3",
+    "@storybook/theming": "5.1.0-alpha.3",
     "core-js": "^2.6.5",
     "format-json": "^1.0.3",
     "prop-types": "^15.7.2",
diff --git a/addons/google-analytics/package.json b/addons/google-analytics/package.json
index 5d5fb36715a..147e7521644 100644
--- a/addons/google-analytics/package.json
+++ b/addons/google-analytics/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-google-analytics",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "Storybook addon for google analytics",
   "keywords": [
     "addon",
@@ -20,8 +20,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.2",
-    "@storybook/core-events": "5.1.0-alpha.2",
+    "@storybook/addons": "5.1.0-alpha.3",
+    "@storybook/core-events": "5.1.0-alpha.3",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "react-ga": "^2.5.7"
diff --git a/addons/graphql/package.json b/addons/graphql/package.json
index cac5d402cf3..62195f6fca5 100644
--- a/addons/graphql/package.json
+++ b/addons/graphql/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-graphql",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "Storybook addon to display the GraphiQL IDE",
   "keywords": [
     "addon",
diff --git a/addons/info/package.json b/addons/info/package.json
index 83786b04d88..f6df6513f95 100644
--- a/addons/info/package.json
+++ b/addons/info/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-info",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "A Storybook addon to show additional information for your stories.",
   "keywords": [
     "addon",
@@ -22,10 +22,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.2",
-    "@storybook/client-logger": "5.1.0-alpha.2",
-    "@storybook/components": "5.1.0-alpha.2",
-    "@storybook/theming": "5.1.0-alpha.2",
+    "@storybook/addons": "5.1.0-alpha.3",
+    "@storybook/client-logger": "5.1.0-alpha.3",
+    "@storybook/components": "5.1.0-alpha.3",
+    "@storybook/theming": "5.1.0-alpha.3",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "marksy": "^6.1.0",
diff --git a/addons/jest/package.json b/addons/jest/package.json
index 704dcdd0f73..9d1ffe0b4d0 100644
--- a/addons/jest/package.json
+++ b/addons/jest/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-jest",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "React storybook addon that show component jest report",
   "keywords": [
     "addon",
@@ -28,10 +28,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.2",
-    "@storybook/components": "5.1.0-alpha.2",
-    "@storybook/core-events": "5.1.0-alpha.2",
-    "@storybook/theming": "5.1.0-alpha.2",
+    "@storybook/addons": "5.1.0-alpha.3",
+    "@storybook/components": "5.1.0-alpha.3",
+    "@storybook/core-events": "5.1.0-alpha.3",
+    "@storybook/theming": "5.1.0-alpha.3",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "prop-types": "^15.7.2",
diff --git a/addons/knobs/package.json b/addons/knobs/package.json
index 1feffc6a04f..6bf37ee19e9 100644
--- a/addons/knobs/package.json
+++ b/addons/knobs/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-knobs",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "Storybook Addon Prop Editor Component",
   "keywords": [
     "addon",
@@ -22,10 +22,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.2",
-    "@storybook/components": "5.1.0-alpha.2",
-    "@storybook/core-events": "5.1.0-alpha.2",
-    "@storybook/theming": "5.1.0-alpha.2",
+    "@storybook/addons": "5.1.0-alpha.3",
+    "@storybook/components": "5.1.0-alpha.3",
+    "@storybook/core-events": "5.1.0-alpha.3",
+    "@storybook/theming": "5.1.0-alpha.3",
     "copy-to-clipboard": "^3.0.8",
     "core-js": "^2.6.5",
     "escape-html": "^1.0.3",
diff --git a/addons/links/package.json b/addons/links/package.json
index 4c534a9e438..240d9aef4f4 100644
--- a/addons/links/package.json
+++ b/addons/links/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-links",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "Story Links addon for storybook",
   "keywords": [
     "addon",
@@ -22,8 +22,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.2",
-    "@storybook/core-events": "5.1.0-alpha.2",
+    "@storybook/addons": "5.1.0-alpha.3",
+    "@storybook/core-events": "5.1.0-alpha.3",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
diff --git a/addons/notes/package.json b/addons/notes/package.json
index cd101cba8cd..e33c7543544 100644
--- a/addons/notes/package.json
+++ b/addons/notes/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-notes",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "Write notes for your Storybook stories.",
   "keywords": [
     "addon",
@@ -23,11 +23,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.2",
-    "@storybook/client-logger": "5.1.0-alpha.2",
-    "@storybook/components": "5.1.0-alpha.2",
-    "@storybook/core-events": "5.1.0-alpha.2",
-    "@storybook/theming": "5.1.0-alpha.2",
+    "@storybook/addons": "5.1.0-alpha.3",
+    "@storybook/client-logger": "5.1.0-alpha.3",
+    "@storybook/components": "5.1.0-alpha.3",
+    "@storybook/core-events": "5.1.0-alpha.3",
+    "@storybook/theming": "5.1.0-alpha.3",
     "core-js": "^2.6.5",
     "markdown-to-jsx": "^6.9.1",
     "prop-types": "^15.7.2",
diff --git a/addons/ondevice-backgrounds/package.json b/addons/ondevice-backgrounds/package.json
index 56cd691948c..e7177d6f971 100644
--- a/addons/ondevice-backgrounds/package.json
+++ b/addons/ondevice-backgrounds/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/addon-ondevice-backgrounds",
   "private": true,
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "A storybook addon to show different backgrounds for your preview",
   "keywords": [
     "addon",
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.2",
+    "@storybook/addons": "5.1.0-alpha.3",
     "core-js": "^2.6.5",
     "prop-types": "^15.7.2"
   },
diff --git a/addons/ondevice-knobs/package.json b/addons/ondevice-knobs/package.json
index 2d8fd67a4a7..5bbf34554d1 100644
--- a/addons/ondevice-knobs/package.json
+++ b/addons/ondevice-knobs/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/addon-ondevice-knobs",
   "private": true,
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "Display storybook story knobs on your deviced.",
   "keywords": [
     "addon",
@@ -22,7 +22,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.2",
+    "@storybook/addons": "5.1.0-alpha.3",
     "core-js": "^2.6.5",
     "deep-equal": "^1.0.1",
     "prop-types": "^15.7.2",
diff --git a/addons/ondevice-notes/package.json b/addons/ondevice-notes/package.json
index bb26978ab33..bef8de82039 100644
--- a/addons/ondevice-notes/package.json
+++ b/addons/ondevice-notes/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/addon-ondevice-notes",
   "private": true,
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "Write notes for your Storybook stories.",
   "keywords": [
     "addon",
@@ -20,7 +20,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.2",
+    "@storybook/addons": "5.1.0-alpha.3",
     "core-js": "^2.6.5",
     "prop-types": "^15.7.2",
     "react-native-simple-markdown": "^1.1.0"
diff --git a/addons/options/package.json b/addons/options/package.json
index f8a5e580bd1..9fa878013c9 100644
--- a/addons/options/package.json
+++ b/addons/options/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-options",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "Options addon for storybook",
   "keywords": [
     "addon",
@@ -21,7 +21,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.2",
+    "@storybook/addons": "5.1.0-alpha.3",
     "core-js": "^2.6.5",
     "util-deprecate": "^1.0.2"
   },
diff --git a/addons/storyshots/storyshots-core/package.json b/addons/storyshots/storyshots-core/package.json
index 6ce1aec1527..1f2a21aee18 100644
--- a/addons/storyshots/storyshots-core/package.json
+++ b/addons/storyshots/storyshots-core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storyshots",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "StoryShots is a Jest Snapshot Testing Addon for Storybook.",
   "keywords": [
     "addon",
@@ -25,7 +25,7 @@
     "storybook": "start-storybook -p 6006"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.2",
+    "@storybook/addons": "5.1.0-alpha.3",
     "core-js": "^2.6.5",
     "glob": "^7.1.3",
     "global": "^4.3.2",
diff --git a/addons/storyshots/storyshots-puppeteer/package.json b/addons/storyshots/storyshots-puppeteer/package.json
index 26b389f42a9..5300a8de12d 100644
--- a/addons/storyshots/storyshots-puppeteer/package.json
+++ b/addons/storyshots/storyshots-puppeteer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storyshots-puppeteer",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "Image snappshots addition to StoryShots base on puppeteer",
   "keywords": [
     "addon",
@@ -22,8 +22,8 @@
     "prepare": "node ../../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/node-logger": "5.1.0-alpha.2",
-    "@storybook/router": "5.1.0-alpha.2",
+    "@storybook/node-logger": "5.1.0-alpha.3",
+    "@storybook/router": "5.1.0-alpha.3",
     "core-js": "^2.6.5",
     "jest-image-snapshot": "^2.8.1",
     "puppeteer": "^1.12.2",
diff --git a/addons/storysource/package.json b/addons/storysource/package.json
index 0b4e13403a7..40cb1ac5ea9 100644
--- a/addons/storysource/package.json
+++ b/addons/storysource/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storysource",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "Stories addon for storybook",
   "keywords": [
     "addon",
@@ -22,10 +22,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.2",
-    "@storybook/components": "5.1.0-alpha.2",
-    "@storybook/router": "5.1.0-alpha.2",
-    "@storybook/theming": "5.1.0-alpha.2",
+    "@storybook/addons": "5.1.0-alpha.3",
+    "@storybook/components": "5.1.0-alpha.3",
+    "@storybook/router": "5.1.0-alpha.3",
+    "@storybook/theming": "5.1.0-alpha.3",
     "core-js": "^2.6.5",
     "estraverse": "^4.2.0",
     "loader-utils": "^1.2.3",
diff --git a/addons/viewport/package.json b/addons/viewport/package.json
index d88925747fc..30399c66c02 100644
--- a/addons/viewport/package.json
+++ b/addons/viewport/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-viewport",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "Storybook addon to change the viewport size to mobile",
   "keywords": [
     "addon",
@@ -21,11 +21,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.2",
-    "@storybook/client-logger": "5.1.0-alpha.2",
-    "@storybook/components": "5.1.0-alpha.2",
-    "@storybook/core-events": "5.1.0-alpha.2",
-    "@storybook/theming": "5.1.0-alpha.2",
+    "@storybook/addons": "5.1.0-alpha.3",
+    "@storybook/client-logger": "5.1.0-alpha.3",
+    "@storybook/components": "5.1.0-alpha.3",
+    "@storybook/core-events": "5.1.0-alpha.3",
+    "@storybook/theming": "5.1.0-alpha.3",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
diff --git a/app/angular/package.json b/app/angular/package.json
index 451a4d66ad0..229f3581698 100644
--- a/app/angular/package.json
+++ b/app/angular/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/angular",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "Storybook for Angular: Develop Angular Components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -26,8 +26,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.1.0-alpha.2",
-    "@storybook/node-logger": "5.1.0-alpha.2",
+    "@storybook/core": "5.1.0-alpha.3",
+    "@storybook/node-logger": "5.1.0-alpha.3",
     "angular2-template-loader": "^0.6.2",
     "core-js": "^2.6.5",
     "fork-ts-checker-webpack-plugin": "^0.5.2",
diff --git a/app/ember/package.json b/app/ember/package.json
index 7b698cfeeb6..9ffc0c8feb4 100644
--- a/app/ember/package.json
+++ b/app/ember/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/ember",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "Storybook for Ember: Develop Ember Component in isolation with Hot Reloading.",
   "homepage": "https://github.com/storybooks/storybook/tree/master/app/ember",
   "bugs": {
@@ -24,7 +24,7 @@
   },
   "dependencies": {
     "@ember/test-helpers": "^1.5.0",
-    "@storybook/core": "5.1.0-alpha.2",
+    "@storybook/core": "5.1.0-alpha.3",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
diff --git a/app/html/package.json b/app/html/package.json
index 53190936a58..9bcdcb1760f 100644
--- a/app/html/package.json
+++ b/app/html/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/html",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "Storybook for HTML: View HTML snippets in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.1.0-alpha.2",
+    "@storybook/core": "5.1.0-alpha.3",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
diff --git a/app/marko/package.json b/app/marko/package.json
index 1d7f78e4e62..89567b4624d 100644
--- a/app/marko/package.json
+++ b/app/marko/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/marko",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "Storybook for Marko: Develop Marko Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -26,7 +26,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.1.0-alpha.2",
+    "@storybook/core": "5.1.0-alpha.3",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
diff --git a/app/mithril/package.json b/app/mithril/package.json
index 2462d50feff..42a11f8bfc6 100644
--- a/app/mithril/package.json
+++ b/app/mithril/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/mithril",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "Storybook for Mithril: Develop Mithril Component in isolation.",
   "keywords": [
     "storybook"
@@ -27,7 +27,7 @@
   },
   "dependencies": {
     "@babel/plugin-transform-react-jsx": "^7.3.0",
-    "@storybook/core": "5.1.0-alpha.2",
+    "@storybook/core": "5.1.0-alpha.3",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
diff --git a/app/polymer/package.json b/app/polymer/package.json
index 566bf52c182..13e021d27d5 100644
--- a/app/polymer/package.json
+++ b/app/polymer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/polymer",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "Storybook for Polymer: Develop Polymer components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.1.0-alpha.2",
+    "@storybook/core": "5.1.0-alpha.3",
     "@webcomponents/webcomponentsjs": "^1.2.0",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
diff --git a/app/preact/package.json b/app/preact/package.json
index 0b9fc92a8ac..64a31cdb4bf 100644
--- a/app/preact/package.json
+++ b/app/preact/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/preact",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "Storybook for Preact: Develop Preact Component in isolation.",
   "keywords": [
     "storybook"
@@ -27,7 +27,7 @@
   },
   "dependencies": {
     "@babel/plugin-transform-react-jsx": "^7.3.0",
-    "@storybook/core": "5.1.0-alpha.2",
+    "@storybook/core": "5.1.0-alpha.3",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
diff --git a/app/react-native/package.json b/app/react-native/package.json
index bd0d29b7c1e..664a7415d9b 100644
--- a/app/react-native/package.json
+++ b/app/react-native/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/react-native",
   "private": true,
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "A better way to develop React Native Components for your app",
   "keywords": [
     "react",
@@ -27,12 +27,12 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.2",
-    "@storybook/channel-websocket": "5.1.0-alpha.2",
-    "@storybook/channels": "5.1.0-alpha.2",
-    "@storybook/core": "5.1.0-alpha.2",
-    "@storybook/core-events": "5.1.0-alpha.2",
-    "@storybook/ui": "5.1.0-alpha.2",
+    "@storybook/addons": "5.1.0-alpha.3",
+    "@storybook/channel-websocket": "5.1.0-alpha.3",
+    "@storybook/channels": "5.1.0-alpha.3",
+    "@storybook/core": "5.1.0-alpha.3",
+    "@storybook/core-events": "5.1.0-alpha.3",
+    "@storybook/ui": "5.1.0-alpha.3",
     "babel-loader": "^8.0.4",
     "babel-plugin-macros": "^2.4.5",
     "babel-plugin-syntax-async-functions": "^6.13.0",
diff --git a/app/react/package.json b/app/react/package.json
index 3e7b37817f6..78175810dc9 100644
--- a/app/react/package.json
+++ b/app/react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/react",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "Storybook for React: Develop React Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -29,8 +29,8 @@
     "@babel/plugin-transform-react-constant-elements": "^7.2.0",
     "@babel/preset-flow": "^7.0.0",
     "@babel/preset-react": "^7.0.0",
-    "@storybook/core": "5.1.0-alpha.2",
-    "@storybook/node-logger": "5.1.0-alpha.2",
+    "@storybook/core": "5.1.0-alpha.3",
+    "@storybook/node-logger": "5.1.0-alpha.3",
     "@svgr/webpack": "^4.0.3",
     "babel-plugin-named-asset-import": "^0.3.1",
     "babel-plugin-react-docgen": "^2.0.2",
diff --git a/app/riot/package.json b/app/riot/package.json
index d771c7d43de..442a5b8180d 100644
--- a/app/riot/package.json
+++ b/app/riot/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/riot",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "Storybook for riot.js: View riot snippets in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.1.0-alpha.2",
+    "@storybook/core": "5.1.0-alpha.3",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
diff --git a/app/svelte/package.json b/app/svelte/package.json
index 9149cb1abbd..eb730a92d0d 100644
--- a/app/svelte/package.json
+++ b/app/svelte/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/svelte",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "Storybook for Svelte: Develop Svelte Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -26,7 +26,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.1.0-alpha.2",
+    "@storybook/core": "5.1.0-alpha.3",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
diff --git a/app/vue/package.json b/app/vue/package.json
index 133706634b9..bd9a0530368 100644
--- a/app/vue/package.json
+++ b/app/vue/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/vue",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "Storybook for Vue: Develop Vue Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -26,7 +26,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.1.0-alpha.2",
+    "@storybook/core": "5.1.0-alpha.3",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
diff --git a/examples/angular-cli/package.json b/examples/angular-cli/package.json
index 9dc5a824e98..2beaa02b393 100644
--- a/examples/angular-cli/package.json
+++ b/examples/angular-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "angular-cli",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "private": true,
   "license": "MIT",
   "scripts": {
@@ -34,18 +34,18 @@
     "@angular-devkit/build-angular": "^0.13.4",
     "@angular/cli": "^7.3.3",
     "@angular/compiler-cli": "^7.2.6",
-    "@storybook/addon-actions": "5.1.0-alpha.2",
-    "@storybook/addon-backgrounds": "5.1.0-alpha.2",
-    "@storybook/addon-centered": "5.1.0-alpha.2",
-    "@storybook/addon-jest": "5.1.0-alpha.2",
-    "@storybook/addon-knobs": "5.1.0-alpha.2",
-    "@storybook/addon-links": "5.1.0-alpha.2",
-    "@storybook/addon-notes": "5.1.0-alpha.2",
-    "@storybook/addon-options": "5.1.0-alpha.2",
-    "@storybook/addon-storyshots": "5.1.0-alpha.2",
-    "@storybook/addon-storysource": "5.1.0-alpha.2",
-    "@storybook/addons": "5.1.0-alpha.2",
-    "@storybook/angular": "5.1.0-alpha.2",
+    "@storybook/addon-actions": "5.1.0-alpha.3",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.3",
+    "@storybook/addon-centered": "5.1.0-alpha.3",
+    "@storybook/addon-jest": "5.1.0-alpha.3",
+    "@storybook/addon-knobs": "5.1.0-alpha.3",
+    "@storybook/addon-links": "5.1.0-alpha.3",
+    "@storybook/addon-notes": "5.1.0-alpha.3",
+    "@storybook/addon-options": "5.1.0-alpha.3",
+    "@storybook/addon-storyshots": "5.1.0-alpha.3",
+    "@storybook/addon-storysource": "5.1.0-alpha.3",
+    "@storybook/addons": "5.1.0-alpha.3",
+    "@storybook/angular": "5.1.0-alpha.3",
     "@types/core-js": "^2.5.0",
     "@types/jest": "^24.0.6",
     "@types/node": "~11.9.5",
diff --git a/examples/cra-kitchen-sink/package.json b/examples/cra-kitchen-sink/package.json
index c0ff7366310..8098b54ff1a 100644
--- a/examples/cra-kitchen-sink/package.json
+++ b/examples/cra-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "cra-kitchen-sink",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -19,21 +19,21 @@
     "react-lifecycles-compat": "^3.0.4"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.1.0-alpha.2",
-    "@storybook/addon-actions": "5.1.0-alpha.2",
-    "@storybook/addon-backgrounds": "5.1.0-alpha.2",
-    "@storybook/addon-centered": "5.1.0-alpha.2",
-    "@storybook/addon-events": "5.1.0-alpha.2",
-    "@storybook/addon-info": "5.1.0-alpha.2",
-    "@storybook/addon-jest": "5.1.0-alpha.2",
-    "@storybook/addon-knobs": "5.1.0-alpha.2",
-    "@storybook/addon-links": "5.1.0-alpha.2",
-    "@storybook/addon-notes": "5.1.0-alpha.2",
-    "@storybook/addon-options": "5.1.0-alpha.2",
-    "@storybook/addon-storyshots": "5.1.0-alpha.2",
-    "@storybook/addons": "5.1.0-alpha.2",
-    "@storybook/client-logger": "5.1.0-alpha.2",
-    "@storybook/react": "5.1.0-alpha.2",
+    "@storybook/addon-a11y": "5.1.0-alpha.3",
+    "@storybook/addon-actions": "5.1.0-alpha.3",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.3",
+    "@storybook/addon-centered": "5.1.0-alpha.3",
+    "@storybook/addon-events": "5.1.0-alpha.3",
+    "@storybook/addon-info": "5.1.0-alpha.3",
+    "@storybook/addon-jest": "5.1.0-alpha.3",
+    "@storybook/addon-knobs": "5.1.0-alpha.3",
+    "@storybook/addon-links": "5.1.0-alpha.3",
+    "@storybook/addon-notes": "5.1.0-alpha.3",
+    "@storybook/addon-options": "5.1.0-alpha.3",
+    "@storybook/addon-storyshots": "5.1.0-alpha.3",
+    "@storybook/addons": "5.1.0-alpha.3",
+    "@storybook/client-logger": "5.1.0-alpha.3",
+    "@storybook/react": "5.1.0-alpha.3",
     "enzyme": "^3.9.0",
     "enzyme-adapter-react-16": "^1.9.1",
     "enzyme-to-json": "^3.3.5",
diff --git a/examples/cra-ts-kitchen-sink/package.json b/examples/cra-ts-kitchen-sink/package.json
index 8a7ecc63cf6..de5e8377335 100644
--- a/examples/cra-ts-kitchen-sink/package.json
+++ b/examples/cra-ts-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "cra-ts-kitchen-sink",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -20,11 +20,11 @@
     "react-dom": "^16.8.3"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.1.0-alpha.2",
-    "@storybook/addon-info": "5.1.0-alpha.2",
-    "@storybook/addon-options": "5.1.0-alpha.2",
-    "@storybook/addons": "5.1.0-alpha.2",
-    "@storybook/react": "5.1.0-alpha.2",
+    "@storybook/addon-actions": "5.1.0-alpha.3",
+    "@storybook/addon-info": "5.1.0-alpha.3",
+    "@storybook/addon-options": "5.1.0-alpha.3",
+    "@storybook/addons": "5.1.0-alpha.3",
+    "@storybook/react": "5.1.0-alpha.3",
     "@types/enzyme": "^3.9.0",
     "@types/react": "^16.8.4",
     "@types/react-dom": "^16.8.2",
diff --git a/examples/ember-cli/package.json b/examples/ember-cli/package.json
index be6aae7120b..91532999a4c 100644
--- a/examples/ember-cli/package.json
+++ b/examples/ember-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "ember-example",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -15,18 +15,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.3.4",
-    "@storybook/addon-a11y": "5.1.0-alpha.2",
-    "@storybook/addon-actions": "5.1.0-alpha.2",
-    "@storybook/addon-backgrounds": "5.1.0-alpha.2",
-    "@storybook/addon-centered": "5.1.0-alpha.2",
-    "@storybook/addon-knobs": "5.1.0-alpha.2",
-    "@storybook/addon-links": "5.1.0-alpha.2",
-    "@storybook/addon-notes": "5.1.0-alpha.2",
-    "@storybook/addon-options": "5.1.0-alpha.2",
-    "@storybook/addon-storysource": "5.1.0-alpha.2",
-    "@storybook/addon-viewport": "5.1.0-alpha.2",
-    "@storybook/addons": "5.1.0-alpha.2",
-    "@storybook/ember": "5.1.0-alpha.2",
+    "@storybook/addon-a11y": "5.1.0-alpha.3",
+    "@storybook/addon-actions": "5.1.0-alpha.3",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.3",
+    "@storybook/addon-centered": "5.1.0-alpha.3",
+    "@storybook/addon-knobs": "5.1.0-alpha.3",
+    "@storybook/addon-links": "5.1.0-alpha.3",
+    "@storybook/addon-notes": "5.1.0-alpha.3",
+    "@storybook/addon-options": "5.1.0-alpha.3",
+    "@storybook/addon-storysource": "5.1.0-alpha.3",
+    "@storybook/addon-viewport": "5.1.0-alpha.3",
+    "@storybook/addons": "5.1.0-alpha.3",
+    "@storybook/ember": "5.1.0-alpha.3",
     "babel-loader": "^8",
     "broccoli-asset-rev": "^3.0.0",
     "cross-env": "^5.2.0",
diff --git a/examples/html-kitchen-sink/package.json b/examples/html-kitchen-sink/package.json
index d09bcebd368..e25f40df4bf 100644
--- a/examples/html-kitchen-sink/package.json
+++ b/examples/html-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "html-kitchen-sink",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "private": true,
   "description": "",
   "keywords": [],
@@ -14,23 +14,23 @@
     "storybook": "start-storybook -p 9006"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.1.0-alpha.2",
-    "@storybook/addon-actions": "5.1.0-alpha.2",
-    "@storybook/addon-backgrounds": "5.1.0-alpha.2",
-    "@storybook/addon-centered": "5.1.0-alpha.2",
-    "@storybook/addon-events": "5.1.0-alpha.2",
-    "@storybook/addon-jest": "5.1.0-alpha.2",
-    "@storybook/addon-knobs": "5.1.0-alpha.2",
-    "@storybook/addon-links": "5.1.0-alpha.2",
-    "@storybook/addon-notes": "5.1.0-alpha.2",
-    "@storybook/addon-options": "5.1.0-alpha.2",
-    "@storybook/addon-storyshots": "5.1.0-alpha.2",
-    "@storybook/addon-storysource": "5.1.0-alpha.2",
-    "@storybook/addon-viewport": "5.1.0-alpha.2",
-    "@storybook/addons": "5.1.0-alpha.2",
-    "@storybook/core": "5.1.0-alpha.2",
-    "@storybook/core-events": "5.1.0-alpha.2",
-    "@storybook/html": "5.1.0-alpha.2",
+    "@storybook/addon-a11y": "5.1.0-alpha.3",
+    "@storybook/addon-actions": "5.1.0-alpha.3",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.3",
+    "@storybook/addon-centered": "5.1.0-alpha.3",
+    "@storybook/addon-events": "5.1.0-alpha.3",
+    "@storybook/addon-jest": "5.1.0-alpha.3",
+    "@storybook/addon-knobs": "5.1.0-alpha.3",
+    "@storybook/addon-links": "5.1.0-alpha.3",
+    "@storybook/addon-notes": "5.1.0-alpha.3",
+    "@storybook/addon-options": "5.1.0-alpha.3",
+    "@storybook/addon-storyshots": "5.1.0-alpha.3",
+    "@storybook/addon-storysource": "5.1.0-alpha.3",
+    "@storybook/addon-viewport": "5.1.0-alpha.3",
+    "@storybook/addons": "5.1.0-alpha.3",
+    "@storybook/core": "5.1.0-alpha.3",
+    "@storybook/core-events": "5.1.0-alpha.3",
+    "@storybook/html": "5.1.0-alpha.3",
     "eventemitter3": "^3.1.0",
     "format-json": "^1.0.3",
     "global": "^4.3.2",
diff --git a/examples/marko-cli/package.json b/examples/marko-cli/package.json
index 79e4956b56a..539c58ab543 100644
--- a/examples/marko-cli/package.json
+++ b/examples/marko-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "marko-cli",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "private": true,
   "description": "Demo of how to build an app using marko-starter",
   "repository": {
@@ -24,12 +24,12 @@
     "marko-starter": "^2.0.4"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.1.0-alpha.2",
-    "@storybook/addon-knobs": "5.1.0-alpha.2",
-    "@storybook/addon-options": "5.1.0-alpha.2",
-    "@storybook/addon-storysource": "5.1.0-alpha.2",
-    "@storybook/addons": "5.1.0-alpha.2",
-    "@storybook/marko": "5.1.0-alpha.2",
+    "@storybook/addon-actions": "5.1.0-alpha.3",
+    "@storybook/addon-knobs": "5.1.0-alpha.3",
+    "@storybook/addon-options": "5.1.0-alpha.3",
+    "@storybook/addon-storysource": "5.1.0-alpha.3",
+    "@storybook/addons": "5.1.0-alpha.3",
+    "@storybook/marko": "5.1.0-alpha.3",
     "prettier": "^1.16.4",
     "webpack": "^4.29.6"
   }
diff --git a/examples/mithril-kitchen-sink/package.json b/examples/mithril-kitchen-sink/package.json
index f18f3717509..0bc6c2f8c53 100644
--- a/examples/mithril-kitchen-sink/package.json
+++ b/examples/mithril-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "mithril-example",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -11,18 +11,18 @@
     "mithril": "^1.1.6"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.1.0-alpha.2",
-    "@storybook/addon-backgrounds": "5.1.0-alpha.2",
-    "@storybook/addon-centered": "5.1.0-alpha.2",
-    "@storybook/addon-knobs": "5.1.0-alpha.2",
-    "@storybook/addon-links": "5.1.0-alpha.2",
-    "@storybook/addon-notes": "5.1.0-alpha.2",
-    "@storybook/addon-options": "5.1.0-alpha.2",
-    "@storybook/addon-storyshots": "5.1.0-alpha.2",
-    "@storybook/addon-storysource": "5.1.0-alpha.2",
-    "@storybook/addon-viewport": "5.1.0-alpha.2",
-    "@storybook/addons": "5.1.0-alpha.2",
-    "@storybook/mithril": "5.1.0-alpha.2",
+    "@storybook/addon-actions": "5.1.0-alpha.3",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.3",
+    "@storybook/addon-centered": "5.1.0-alpha.3",
+    "@storybook/addon-knobs": "5.1.0-alpha.3",
+    "@storybook/addon-links": "5.1.0-alpha.3",
+    "@storybook/addon-notes": "5.1.0-alpha.3",
+    "@storybook/addon-options": "5.1.0-alpha.3",
+    "@storybook/addon-storyshots": "5.1.0-alpha.3",
+    "@storybook/addon-storysource": "5.1.0-alpha.3",
+    "@storybook/addon-viewport": "5.1.0-alpha.3",
+    "@storybook/addons": "5.1.0-alpha.3",
+    "@storybook/mithril": "5.1.0-alpha.3",
     "webpack": "^4.29.6"
   }
 }
diff --git a/examples/official-storybook/package.json b/examples/official-storybook/package.json
index 323ee72641d..ba24ac72d6e 100644
--- a/examples/official-storybook/package.json
+++ b/examples/official-storybook/package.json
@@ -1,6 +1,6 @@
 {
   "name": "official-storybook",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -13,29 +13,29 @@
     "storybook": "cross-env STORYBOOK_DISPLAY_WARNING=true DISPLAY_WARNING=true start-storybook -p 9011 -c ./ -s built-storybooks --no-dll"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.1.0-alpha.2",
-    "@storybook/addon-actions": "5.1.0-alpha.2",
-    "@storybook/addon-backgrounds": "5.1.0-alpha.2",
-    "@storybook/addon-centered": "5.1.0-alpha.2",
-    "@storybook/addon-cssresources": "5.1.0-alpha.2",
-    "@storybook/addon-events": "5.1.0-alpha.2",
-    "@storybook/addon-graphql": "5.1.0-alpha.2",
-    "@storybook/addon-info": "5.1.0-alpha.2",
-    "@storybook/addon-jest": "5.1.0-alpha.2",
-    "@storybook/addon-knobs": "5.1.0-alpha.2",
-    "@storybook/addon-links": "5.1.0-alpha.2",
-    "@storybook/addon-notes": "5.1.0-alpha.2",
-    "@storybook/addon-options": "5.1.0-alpha.2",
-    "@storybook/addon-storyshots": "5.1.0-alpha.2",
-    "@storybook/addon-storyshots-puppeteer": "5.1.0-alpha.2",
-    "@storybook/addon-storysource": "5.1.0-alpha.2",
-    "@storybook/addon-viewport": "5.1.0-alpha.2",
-    "@storybook/addons": "5.1.0-alpha.2",
-    "@storybook/components": "5.1.0-alpha.2",
-    "@storybook/core-events": "5.1.0-alpha.2",
-    "@storybook/node-logger": "5.1.0-alpha.2",
-    "@storybook/react": "5.1.0-alpha.2",
-    "@storybook/theming": "5.1.0-alpha.2",
+    "@storybook/addon-a11y": "5.1.0-alpha.3",
+    "@storybook/addon-actions": "5.1.0-alpha.3",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.3",
+    "@storybook/addon-centered": "5.1.0-alpha.3",
+    "@storybook/addon-cssresources": "5.1.0-alpha.3",
+    "@storybook/addon-events": "5.1.0-alpha.3",
+    "@storybook/addon-graphql": "5.1.0-alpha.3",
+    "@storybook/addon-info": "5.1.0-alpha.3",
+    "@storybook/addon-jest": "5.1.0-alpha.3",
+    "@storybook/addon-knobs": "5.1.0-alpha.3",
+    "@storybook/addon-links": "5.1.0-alpha.3",
+    "@storybook/addon-notes": "5.1.0-alpha.3",
+    "@storybook/addon-options": "5.1.0-alpha.3",
+    "@storybook/addon-storyshots": "5.1.0-alpha.3",
+    "@storybook/addon-storyshots-puppeteer": "5.1.0-alpha.3",
+    "@storybook/addon-storysource": "5.1.0-alpha.3",
+    "@storybook/addon-viewport": "5.1.0-alpha.3",
+    "@storybook/addons": "5.1.0-alpha.3",
+    "@storybook/components": "5.1.0-alpha.3",
+    "@storybook/core-events": "5.1.0-alpha.3",
+    "@storybook/node-logger": "5.1.0-alpha.3",
+    "@storybook/react": "5.1.0-alpha.3",
+    "@storybook/theming": "5.1.0-alpha.3",
     "cors": "^2.8.5",
     "cross-env": "^5.2.0",
     "enzyme-to-json": "^3.3.5",
diff --git a/examples/polymer-cli/package.json b/examples/polymer-cli/package.json
index 0d718f4f978..3303cbc8504 100644
--- a/examples/polymer-cli/package.json
+++ b/examples/polymer-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "polymer-cli",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -10,15 +10,15 @@
   },
   "dependencies": {
     "@polymer/polymer": "^2.6.0",
-    "@storybook/addon-actions": "5.1.0-alpha.2",
-    "@storybook/addon-backgrounds": "5.1.0-alpha.2",
-    "@storybook/addon-knobs": "5.1.0-alpha.2",
-    "@storybook/addon-links": "5.1.0-alpha.2",
-    "@storybook/addon-notes": "5.1.0-alpha.2",
-    "@storybook/addon-options": "5.1.0-alpha.2",
-    "@storybook/addon-storysource": "5.1.0-alpha.2",
-    "@storybook/addon-viewport": "5.1.0-alpha.2",
-    "@storybook/polymer": "5.1.0-alpha.2",
+    "@storybook/addon-actions": "5.1.0-alpha.3",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.3",
+    "@storybook/addon-knobs": "5.1.0-alpha.3",
+    "@storybook/addon-links": "5.1.0-alpha.3",
+    "@storybook/addon-notes": "5.1.0-alpha.3",
+    "@storybook/addon-options": "5.1.0-alpha.3",
+    "@storybook/addon-storysource": "5.1.0-alpha.3",
+    "@storybook/addon-viewport": "5.1.0-alpha.3",
+    "@storybook/polymer": "5.1.0-alpha.3",
     "@webcomponents/webcomponentsjs": "^1.2.0",
     "global": "^4.3.2",
     "lit-html": "^1.0.0",
diff --git a/examples/preact-kitchen-sink/package.json b/examples/preact-kitchen-sink/package.json
index 196cc95b8ad..c0b640d338e 100644
--- a/examples/preact-kitchen-sink/package.json
+++ b/examples/preact-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "preact-example",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -16,18 +16,18 @@
   "devDependencies": {
     "@babel/core": "^7.3.4",
     "@babel/plugin-transform-runtime": "^7.2.0",
-    "@storybook/addon-actions": "5.1.0-alpha.2",
-    "@storybook/addon-backgrounds": "5.1.0-alpha.2",
-    "@storybook/addon-centered": "5.1.0-alpha.2",
-    "@storybook/addon-knobs": "5.1.0-alpha.2",
-    "@storybook/addon-links": "5.1.0-alpha.2",
-    "@storybook/addon-notes": "5.1.0-alpha.2",
-    "@storybook/addon-options": "5.1.0-alpha.2",
-    "@storybook/addon-storyshots": "5.1.0-alpha.2",
-    "@storybook/addon-storysource": "5.1.0-alpha.2",
-    "@storybook/addon-viewport": "5.1.0-alpha.2",
-    "@storybook/addons": "5.1.0-alpha.2",
-    "@storybook/preact": "5.1.0-alpha.2",
+    "@storybook/addon-actions": "5.1.0-alpha.3",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.3",
+    "@storybook/addon-centered": "5.1.0-alpha.3",
+    "@storybook/addon-knobs": "5.1.0-alpha.3",
+    "@storybook/addon-links": "5.1.0-alpha.3",
+    "@storybook/addon-notes": "5.1.0-alpha.3",
+    "@storybook/addon-options": "5.1.0-alpha.3",
+    "@storybook/addon-storyshots": "5.1.0-alpha.3",
+    "@storybook/addon-storysource": "5.1.0-alpha.3",
+    "@storybook/addon-viewport": "5.1.0-alpha.3",
+    "@storybook/addons": "5.1.0-alpha.3",
+    "@storybook/preact": "5.1.0-alpha.3",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
     "file-loader": "^3.0.1",
diff --git a/examples/riot-kitchen-sink/package.json b/examples/riot-kitchen-sink/package.json
index 371fe50a54e..e40fad4dd4d 100644
--- a/examples/riot-kitchen-sink/package.json
+++ b/examples/riot-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "riot-example",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -16,18 +16,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.3.4",
-    "@storybook/addon-actions": "5.1.0-alpha.2",
-    "@storybook/addon-backgrounds": "5.1.0-alpha.2",
-    "@storybook/addon-centered": "5.1.0-alpha.2",
-    "@storybook/addon-knobs": "5.1.0-alpha.2",
-    "@storybook/addon-links": "5.1.0-alpha.2",
-    "@storybook/addon-notes": "5.1.0-alpha.2",
-    "@storybook/addon-options": "5.1.0-alpha.2",
-    "@storybook/addon-storyshots": "5.1.0-alpha.2",
-    "@storybook/addon-storysource": "5.1.0-alpha.2",
-    "@storybook/addon-viewport": "5.1.0-alpha.2",
-    "@storybook/addons": "5.1.0-alpha.2",
-    "@storybook/riot": "5.1.0-alpha.2",
+    "@storybook/addon-actions": "5.1.0-alpha.3",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.3",
+    "@storybook/addon-centered": "5.1.0-alpha.3",
+    "@storybook/addon-knobs": "5.1.0-alpha.3",
+    "@storybook/addon-links": "5.1.0-alpha.3",
+    "@storybook/addon-notes": "5.1.0-alpha.3",
+    "@storybook/addon-options": "5.1.0-alpha.3",
+    "@storybook/addon-storyshots": "5.1.0-alpha.3",
+    "@storybook/addon-storysource": "5.1.0-alpha.3",
+    "@storybook/addon-viewport": "5.1.0-alpha.3",
+    "@storybook/addons": "5.1.0-alpha.3",
+    "@storybook/riot": "5.1.0-alpha.3",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
     "file-loader": "^3.0.1",
diff --git a/examples/svelte-kitchen-sink/package.json b/examples/svelte-kitchen-sink/package.json
index 2438bd9bb14..0ce091b8378 100644
--- a/examples/svelte-kitchen-sink/package.json
+++ b/examples/svelte-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "svelte-example",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -11,17 +11,17 @@
     "global": "^4.3.2"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.1.0-alpha.2",
-    "@storybook/addon-backgrounds": "5.1.0-alpha.2",
-    "@storybook/addon-centered": "5.1.0-alpha.2",
-    "@storybook/addon-knobs": "5.1.0-alpha.2",
-    "@storybook/addon-links": "5.1.0-alpha.2",
-    "@storybook/addon-notes": "5.1.0-alpha.2",
-    "@storybook/addon-options": "5.1.0-alpha.2",
-    "@storybook/addon-storyshots": "5.1.0-alpha.2",
-    "@storybook/addon-storysource": "5.1.0-alpha.2",
-    "@storybook/addon-viewport": "5.1.0-alpha.2",
-    "@storybook/addons": "5.1.0-alpha.2",
-    "@storybook/svelte": "5.1.0-alpha.2"
+    "@storybook/addon-actions": "5.1.0-alpha.3",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.3",
+    "@storybook/addon-centered": "5.1.0-alpha.3",
+    "@storybook/addon-knobs": "5.1.0-alpha.3",
+    "@storybook/addon-links": "5.1.0-alpha.3",
+    "@storybook/addon-notes": "5.1.0-alpha.3",
+    "@storybook/addon-options": "5.1.0-alpha.3",
+    "@storybook/addon-storyshots": "5.1.0-alpha.3",
+    "@storybook/addon-storysource": "5.1.0-alpha.3",
+    "@storybook/addon-viewport": "5.1.0-alpha.3",
+    "@storybook/addons": "5.1.0-alpha.3",
+    "@storybook/svelte": "5.1.0-alpha.3"
   }
 }
diff --git a/examples/vue-kitchen-sink/package.json b/examples/vue-kitchen-sink/package.json
index ecdb67e49ca..8e9c19ae576 100644
--- a/examples/vue-kitchen-sink/package.json
+++ b/examples/vue-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "vue-example",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -15,18 +15,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.3.4",
-    "@storybook/addon-actions": "5.1.0-alpha.2",
-    "@storybook/addon-backgrounds": "5.1.0-alpha.2",
-    "@storybook/addon-centered": "5.1.0-alpha.2",
-    "@storybook/addon-knobs": "5.1.0-alpha.2",
-    "@storybook/addon-links": "5.1.0-alpha.2",
-    "@storybook/addon-notes": "5.1.0-alpha.2",
-    "@storybook/addon-options": "5.1.0-alpha.2",
-    "@storybook/addon-storyshots": "5.1.0-alpha.2",
-    "@storybook/addon-storysource": "5.1.0-alpha.2",
-    "@storybook/addon-viewport": "5.1.0-alpha.2",
-    "@storybook/addons": "5.1.0-alpha.2",
-    "@storybook/vue": "5.1.0-alpha.2",
+    "@storybook/addon-actions": "5.1.0-alpha.3",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.3",
+    "@storybook/addon-centered": "5.1.0-alpha.3",
+    "@storybook/addon-knobs": "5.1.0-alpha.3",
+    "@storybook/addon-links": "5.1.0-alpha.3",
+    "@storybook/addon-notes": "5.1.0-alpha.3",
+    "@storybook/addon-options": "5.1.0-alpha.3",
+    "@storybook/addon-storyshots": "5.1.0-alpha.3",
+    "@storybook/addon-storysource": "5.1.0-alpha.3",
+    "@storybook/addon-viewport": "5.1.0-alpha.3",
+    "@storybook/addons": "5.1.0-alpha.3",
+    "@storybook/vue": "5.1.0-alpha.3",
     "babel-core": "^7.0.0-bridge.0",
     "babel-loader": "^8.0.5",
     "cross-env": "^5.2.0",
diff --git a/lerna.json b/lerna.json
index aa990454492..a46981916e5 100644
--- a/lerna.json
+++ b/lerna.json
@@ -11,5 +11,5 @@
   "npmClient": "yarn",
   "useWorkspaces": true,
   "registry": "https://registry.npmjs.org",
-  "version": "5.1.0-alpha.2"
+  "version": "5.1.0-alpha.3"
 }
diff --git a/lib/addons/package.json b/lib/addons/package.json
index 87d9f13787e..155e4745f57 100644
--- a/lib/addons/package.json
+++ b/lib/addons/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addons",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "Storybook addons store",
   "keywords": [
     "storybook"
@@ -21,8 +21,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.1.0-alpha.2",
-    "@storybook/client-logger": "5.1.0-alpha.2",
+    "@storybook/channels": "5.1.0-alpha.3",
+    "@storybook/client-logger": "5.1.0-alpha.3",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "util-deprecate": "^1.0.2"
diff --git a/lib/channel-postmessage/package.json b/lib/channel-postmessage/package.json
index 80c8a7fe71f..cf290f39b7b 100644
--- a/lib/channel-postmessage/package.json
+++ b/lib/channel-postmessage/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channel-postmessage",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "",
   "keywords": [
     "storybook"
@@ -21,8 +21,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.1.0-alpha.2",
-    "@storybook/client-logger": "5.1.0-alpha.2",
+    "@storybook/channels": "5.1.0-alpha.3",
+    "@storybook/client-logger": "5.1.0-alpha.3",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "telejson": "^2.1.1"
diff --git a/lib/channel-websocket/package.json b/lib/channel-websocket/package.json
index cd36b830292..9e268f4e2c6 100644
--- a/lib/channel-websocket/package.json
+++ b/lib/channel-websocket/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channel-websocket",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "",
   "keywords": [
     "storybook"
@@ -21,7 +21,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.1.0-alpha.2",
+    "@storybook/channels": "5.1.0-alpha.3",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "json-fn": "^1.1.1"
diff --git a/lib/channels/package.json b/lib/channels/package.json
index c80c7b009cc..63b67609f66 100644
--- a/lib/channels/package.json
+++ b/lib/channels/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channels",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/cli/package.json b/lib/cli/package.json
index 14f99f651b9..f270581e1d3 100644
--- a/lib/cli/package.json
+++ b/lib/cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/cli",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "Storybook's CLI - easiest method of adding storybook to your projects",
   "keywords": [
     "cli",
@@ -30,7 +30,7 @@
     "@babel/core": "^7.3.4",
     "@babel/preset-env": "^7.3.4",
     "@babel/register": "^7.0.0",
-    "@storybook/codemod": "5.1.0-alpha.2",
+    "@storybook/codemod": "5.1.0-alpha.3",
     "chalk": "^2.4.1",
     "commander": "^2.19.0",
     "core-js": "^2.6.5",
@@ -44,31 +44,31 @@
     "update-notifier": "^2.5.0"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.1.0-alpha.2",
-    "@storybook/addon-centered": "5.1.0-alpha.2",
-    "@storybook/addon-graphql": "5.1.0-alpha.2",
-    "@storybook/addon-info": "5.1.0-alpha.2",
-    "@storybook/addon-knobs": "5.1.0-alpha.2",
-    "@storybook/addon-links": "5.1.0-alpha.2",
-    "@storybook/addon-notes": "5.1.0-alpha.2",
-    "@storybook/addon-options": "5.1.0-alpha.2",
-    "@storybook/addon-storyshots": "5.1.0-alpha.2",
-    "@storybook/addons": "5.1.0-alpha.2",
-    "@storybook/angular": "5.1.0-alpha.2",
-    "@storybook/channel-postmessage": "5.1.0-alpha.2",
-    "@storybook/channel-websocket": "5.1.0-alpha.2",
-    "@storybook/channels": "5.1.0-alpha.2",
-    "@storybook/ember": "5.1.0-alpha.2",
-    "@storybook/html": "5.1.0-alpha.2",
-    "@storybook/marko": "5.1.0-alpha.2",
-    "@storybook/mithril": "5.1.0-alpha.2",
-    "@storybook/polymer": "5.1.0-alpha.2",
-    "@storybook/preact": "5.1.0-alpha.2",
-    "@storybook/react": "5.1.0-alpha.2",
-    "@storybook/react-native": "5.1.0-alpha.2",
-    "@storybook/riot": "5.1.0-alpha.2",
-    "@storybook/ui": "5.1.0-alpha.2",
-    "@storybook/vue": "5.1.0-alpha.2"
+    "@storybook/addon-actions": "5.1.0-alpha.3",
+    "@storybook/addon-centered": "5.1.0-alpha.3",
+    "@storybook/addon-graphql": "5.1.0-alpha.3",
+    "@storybook/addon-info": "5.1.0-alpha.3",
+    "@storybook/addon-knobs": "5.1.0-alpha.3",
+    "@storybook/addon-links": "5.1.0-alpha.3",
+    "@storybook/addon-notes": "5.1.0-alpha.3",
+    "@storybook/addon-options": "5.1.0-alpha.3",
+    "@storybook/addon-storyshots": "5.1.0-alpha.3",
+    "@storybook/addons": "5.1.0-alpha.3",
+    "@storybook/angular": "5.1.0-alpha.3",
+    "@storybook/channel-postmessage": "5.1.0-alpha.3",
+    "@storybook/channel-websocket": "5.1.0-alpha.3",
+    "@storybook/channels": "5.1.0-alpha.3",
+    "@storybook/ember": "5.1.0-alpha.3",
+    "@storybook/html": "5.1.0-alpha.3",
+    "@storybook/marko": "5.1.0-alpha.3",
+    "@storybook/mithril": "5.1.0-alpha.3",
+    "@storybook/polymer": "5.1.0-alpha.3",
+    "@storybook/preact": "5.1.0-alpha.3",
+    "@storybook/react": "5.1.0-alpha.3",
+    "@storybook/react-native": "5.1.0-alpha.3",
+    "@storybook/riot": "5.1.0-alpha.3",
+    "@storybook/ui": "5.1.0-alpha.3",
+    "@storybook/vue": "5.1.0-alpha.3"
   },
   "publishConfig": {
     "access": "public"
diff --git a/lib/client-api/package.json b/lib/client-api/package.json
index 2bf19ef9c60..975b3441f33 100644
--- a/lib/client-api/package.json
+++ b/lib/client-api/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/client-api",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "Storybook Client API",
   "keywords": [
     "storybook"
@@ -20,10 +20,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.2",
-    "@storybook/client-logger": "5.1.0-alpha.2",
-    "@storybook/core-events": "5.1.0-alpha.2",
-    "@storybook/router": "5.1.0-alpha.2",
+    "@storybook/addons": "5.1.0-alpha.3",
+    "@storybook/client-logger": "5.1.0-alpha.3",
+    "@storybook/core-events": "5.1.0-alpha.3",
+    "@storybook/router": "5.1.0-alpha.3",
     "common-tags": "^1.8.0",
     "eventemitter3": "^3.1.0",
     "global": "^4.3.2",
diff --git a/lib/client-logger/package.json b/lib/client-logger/package.json
index 05ab59eebcb..0a024cbfdfb 100644
--- a/lib/client-logger/package.json
+++ b/lib/client-logger/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/client-logger",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/codemod/package.json b/lib/codemod/package.json
index b2a67525411..326d56a1b38 100644
--- a/lib/codemod/package.json
+++ b/lib/codemod/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/codemod",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "A collection of codemod scripts written with JSCodeshift",
   "keywords": [
     "storybook"
diff --git a/lib/components/package.json b/lib/components/package.json
index 4c3baa8965b..0218e20c435 100644
--- a/lib/components/package.json
+++ b/lib/components/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/components",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "Core Storybook Components",
   "keywords": [
     "storybook"
@@ -21,11 +21,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.2",
-    "@storybook/client-logger": "5.1.0-alpha.2",
-    "@storybook/core-events": "5.1.0-alpha.2",
-    "@storybook/router": "5.1.0-alpha.2",
-    "@storybook/theming": "5.1.0-alpha.2",
+    "@storybook/addons": "5.1.0-alpha.3",
+    "@storybook/client-logger": "5.1.0-alpha.3",
+    "@storybook/core-events": "5.1.0-alpha.3",
+    "@storybook/router": "5.1.0-alpha.3",
+    "@storybook/theming": "5.1.0-alpha.3",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "js-beautify": "^1.8.9",
diff --git a/lib/core-events/package.json b/lib/core-events/package.json
index 9a2d62be954..703ddc04a32 100644
--- a/lib/core-events/package.json
+++ b/lib/core-events/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/core-events",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "Event names used in storybook core",
   "keywords": [
     "storybook"
diff --git a/lib/core/package.json b/lib/core/package.json
index 072a488e8b7..e1008dee80c 100644
--- a/lib/core/package.json
+++ b/lib/core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/core",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "Storybook framework-agnostic API",
   "keywords": [
     "storybook"
@@ -25,14 +25,14 @@
     "@babel/plugin-syntax-dynamic-import": "^7.2.0",
     "@babel/plugin-transform-react-constant-elements": "^7.2.0",
     "@babel/preset-env": "^7.3.4",
-    "@storybook/addons": "5.1.0-alpha.2",
-    "@storybook/channel-postmessage": "5.1.0-alpha.2",
-    "@storybook/client-api": "5.1.0-alpha.2",
-    "@storybook/client-logger": "5.1.0-alpha.2",
-    "@storybook/core-events": "5.1.0-alpha.2",
-    "@storybook/node-logger": "5.1.0-alpha.2",
-    "@storybook/router": "5.1.0-alpha.2",
-    "@storybook/ui": "5.1.0-alpha.2",
+    "@storybook/addons": "5.1.0-alpha.3",
+    "@storybook/channel-postmessage": "5.1.0-alpha.3",
+    "@storybook/client-api": "5.1.0-alpha.3",
+    "@storybook/client-logger": "5.1.0-alpha.3",
+    "@storybook/core-events": "5.1.0-alpha.3",
+    "@storybook/node-logger": "5.1.0-alpha.3",
+    "@storybook/router": "5.1.0-alpha.3",
+    "@storybook/ui": "5.1.0-alpha.3",
     "airbnb-js-shims": "^1 || ^2",
     "autoprefixer": "^9.4.9",
     "babel-plugin-add-react-displayname": "^0.0.5",
diff --git a/lib/node-logger/package.json b/lib/node-logger/package.json
index b83a6328964..4b3b7464c34 100644
--- a/lib/node-logger/package.json
+++ b/lib/node-logger/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/node-logger",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/router/package.json b/lib/router/package.json
index 8d5a60dc9aa..f9cd1ab10c0 100644
--- a/lib/router/package.json
+++ b/lib/router/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/router",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "Core Storybook Router",
   "keywords": [
     "storybook"
@@ -21,7 +21,7 @@
   },
   "dependencies": {
     "@reach/router": "^1.2.1",
-    "@storybook/theming": "5.1.0-alpha.2",
+    "@storybook/theming": "5.1.0-alpha.3",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
diff --git a/lib/theming/package.json b/lib/theming/package.json
index 514ed29907e..9e018f7ae9d 100644
--- a/lib/theming/package.json
+++ b/lib/theming/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/theming",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "Core Storybook Components",
   "keywords": [
     "storybook"
@@ -23,7 +23,7 @@
   "dependencies": {
     "@emotion/core": "^10.0.7",
     "@emotion/styled": "^10.0.7",
-    "@storybook/client-logger": "5.1.0-alpha.2",
+    "@storybook/client-logger": "5.1.0-alpha.3",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "deep-object-diff": "^1.1.0",
diff --git a/lib/ui/package.json b/lib/ui/package.json
index 676154d3e96..cf14e7c5cf6 100644
--- a/lib/ui/package.json
+++ b/lib/ui/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/ui",
-  "version": "5.1.0-alpha.2",
+  "version": "5.1.0-alpha.3",
   "description": "Core Storybook UI",
   "keywords": [
     "storybook"
@@ -22,12 +22,12 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.2",
-    "@storybook/client-logger": "5.1.0-alpha.2",
-    "@storybook/components": "5.1.0-alpha.2",
-    "@storybook/core-events": "5.1.0-alpha.2",
-    "@storybook/router": "5.1.0-alpha.2",
-    "@storybook/theming": "5.1.0-alpha.2",
+    "@storybook/addons": "5.1.0-alpha.3",
+    "@storybook/client-logger": "5.1.0-alpha.3",
+    "@storybook/components": "5.1.0-alpha.3",
+    "@storybook/core-events": "5.1.0-alpha.3",
+    "@storybook/router": "5.1.0-alpha.3",
+    "@storybook/theming": "5.1.0-alpha.3",
     "core-js": "^2.6.5",
     "fast-deep-equal": "^2.0.1",
     "fuzzy-search": "^3.0.1",

From b6a4a6f7c272a43a2447e6d9493aa551780cba6a Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Sat, 9 Mar 2019 23:40:22 +0800
Subject: [PATCH 229/249] 5.1.0-alpha.3 versions.json

---
 docs/src/versions/next.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/docs/src/versions/next.json b/docs/src/versions/next.json
index 02e20cce76e..13f7aa6a476 100644
--- a/docs/src/versions/next.json
+++ b/docs/src/versions/next.json
@@ -1 +1 @@
-{"version":"5.1.0-alpha.2","info":{"plain":"### Bug Fixes\n\n* Core: support unicode chars in story IDs ([#5964](https://github.com/storybooks/storybook/pull/5964))\n* Core: Add core-js dependencies where it was missing ([#5961](https://github.com/storybooks/storybook/pull/5961))\n\n### Maintenance\n\n* Addon-a11y: Migrate to typescript ([#5738](https://github.com/storybooks/storybook/pull/5738))"}}
\ No newline at end of file
+{"version":"5.1.0-alpha.3","info":{"plain":"### Features\n\n* Addon-a11y: add 'incomplete' tab ([#5984](https://github.com/storybooks/storybook/pull/5984))\n\n### Bug Fixes\n\n* Core: fix `selectStory` with one parameter ([#5983](https://github.com/storybooks/storybook/pull/5983))\n* Core: remove custom presets warning ([#5911](https://github.com/storybooks/storybook/pull/5911))\n\n### Maintenance\n\n* Addon-viewport: Change styling to more closely match v4 ([#5979](https://github.com/storybooks/storybook/pull/5979))\n\n### Dependency Upgrades\n\n* Bump babel-preset-react-app from 7.0.1 to 7.0.2 ([#5937](https://github.com/storybooks/storybook/pull/5937))\n* Bump ts-node from 8.0.2 to 8.0.3 ([#5938](https://github.com/storybooks/storybook/pull/5938))\n* Bump react from 16.8.3 to 16.8.4 ([#5902](https://github.com/storybooks/storybook/pull/5902))\n* Bump marko from 4.15.3 to 4.15.4 ([#5939](https://github.com/storybooks/storybook/pull/5939))"}}
\ No newline at end of file

From 54564946a350b4d1eecbfa0772f16b7c2e0fcc38 Mon Sep 17 00:00:00 2001
From: Arman Sargsyan <mail@arman.io>
Date: Sun, 10 Mar 2019 01:20:51 +0300
Subject: [PATCH 230/249] fix(a11y): icon design, rule text align

---
 addons/a11y/src/components/Report/Item.tsx  |  2 ++
 addons/a11y/src/components/Report/Rules.tsx | 10 ++++------
 2 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/addons/a11y/src/components/Report/Item.tsx b/addons/a11y/src/components/Report/Item.tsx
index 6a493173a4d..3be6015217c 100644
--- a/addons/a11y/src/components/Report/Item.tsx
+++ b/addons/a11y/src/components/Report/Item.tsx
@@ -13,6 +13,7 @@ const Wrapper = styled.div();
 const Icon = styled<any, any>(Icons)(({ theme }) => ({
   height: 10,
   width: 10,
+  minWidth: 10,
   color: theme.color.mediumdark,
   marginRight: '10px',
   transition: 'transform 0.1s ease-in-out',
@@ -28,6 +29,7 @@ const HeaderBar = styled.button(({ theme }) => ({
   border: 0,
   background: 'none',
   color: 'inherit',
+  textAlign: 'left',
 
   borderLeft: '3px solid transparent',
 
diff --git a/addons/a11y/src/components/Report/Rules.tsx b/addons/a11y/src/components/Report/Rules.tsx
index 0a142eb98ee..91fb964536e 100644
--- a/addons/a11y/src/components/Report/Rules.tsx
+++ b/addons/a11y/src/components/Report/Rules.tsx
@@ -30,16 +30,14 @@ const Message = styled.div({
 });
 
 const Status = styled.div(({ passes, impact }: { passes: boolean; impact: string }) => ({
-  height: '16px',
-  width: '16px',
-  borderRadius: '8px',
-  fontSize: '10px',
   display: 'inline-flex',
   justifyContent: 'center',
   alignItems: 'center',
-  textAlign: 'center',
-  flex: '0 0 16px',
   color: passes ? impactColors.success : (impactColors as any)[impact],
+  '& > svg': {
+    height: '16px',
+    width: '16px',
+  },
 }));
 
 interface RuleProps {

From e13656a9f5cc5f50d9c932354370486a8c09ae87 Mon Sep 17 00:00:00 2001
From: Jonathan Cousins <evolutionxbox@gmail.com>
Date: Sat, 9 Mar 2019 23:01:05 +0000
Subject: [PATCH 231/249] fix (addons/viewport): viewport iframe dimensions

Use `boxSizing: 'content-box'` to override the global box-sizing rule
and allow the storybook preview iframe to have the specified dimensions
from the viewport addon config.

Fixes #5927
---
 addons/viewport/src/Tool.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/addons/viewport/src/Tool.js b/addons/viewport/src/Tool.js
index d7587a8448b..3ae4e0e2613 100644
--- a/addons/viewport/src/Tool.js
+++ b/addons/viewport/src/Tool.js
@@ -135,6 +135,7 @@ export default class ViewportTool extends Component {
                 border: '1px solid #888',
                 borderRadius: 4,
                 boxShadow: '0 4px 8px 0 rgba(0,0,0,0.12), 0 2px 4px 0 rgba(0,0,0,0.08);',
+                boxSizing: 'content-box',
 
                 ...(isRotated ? flip(item.value || {}) : item.value || {}),
               },

From 945ccffc24d54a1b014c4cb38295e25bfac79cb1 Mon Sep 17 00:00:00 2001
From: Arman Sargsyan <mail@arman.io>
Date: Sun, 10 Mar 2019 12:49:47 +0300
Subject: [PATCH 232/249] fix(a11y): 'element' arg in config not ignored

---
 addons/a11y/src/index.ts | 16 ++++++++++------
 1 file changed, 10 insertions(+), 6 deletions(-)

diff --git a/addons/a11y/src/index.ts b/addons/a11y/src/index.ts
index 5c834cdc900..7e93273528a 100644
--- a/addons/a11y/src/index.ts
+++ b/addons/a11y/src/index.ts
@@ -1,5 +1,5 @@
 import { document } from 'global';
-import axe, { AxeResults, RunOptions, Spec } from 'axe-core';
+import axe, { AxeResults, ElementContext, RunOptions, Spec } from 'axe-core';
 import deprecate from 'util-deprecate';
 import { stripIndents } from 'common-tags';
 
@@ -9,7 +9,11 @@ import { EVENTS, PARAM_KEY } from './constants';
 
 const channel = addons.getChannel();
 let progress = Promise.resolve();
-let setup: { config: Spec; options: RunOptions } = { config: {}, options: {} };
+let setup: {
+  element?: ElementContext;
+  config: Spec;
+  options: RunOptions;
+} = { element: null, config: {}, options: {} };
 
 const getElement = () => {
   const storyRoot = document.getElementById('story-root');
@@ -24,7 +28,7 @@ const report = (input: AxeResults) => {
   channel.emit(EVENTS.RESULT, input);
 };
 
-const run = (config: Spec, options: RunOptions) => {
+const run = (element: ElementContext, config: Spec, options: RunOptions) => {
   progress = progress.then(() => {
     axe.reset();
     if (config) {
@@ -32,7 +36,7 @@ const run = (config: Spec, options: RunOptions) => {
     }
     return axe
       .run(
-        getElement(),
+        element || getElement(),
         options ||
           // tslint:disable-next-line:no-object-literal-type-assertion
           ({
@@ -52,8 +56,8 @@ export const withA11y: StoryWrapper = (getStory, context) => {
   return getStory(context);
 };
 
-channel.on(STORY_RENDERED, () => run(setup.config, setup.options));
-channel.on(EVENTS.REQUEST, () => run(setup.config, setup.options));
+channel.on(STORY_RENDERED, () => run(setup.element, setup.config, setup.options));
+channel.on(EVENTS.REQUEST, () => run(setup.element, setup.config, setup.options));
 
 if (module && module.hot && module.hot.decline) {
   module.hot.decline();

From 3b18b02148eb948e9813499abe7fb63edb83a331 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Sun, 10 Mar 2019 17:51:23 +0800
Subject: [PATCH 233/249] Update docs/guides URLs

---
 docs/src/new-components/basics/shared/site.js | 23 ++++++++++---------
 1 file changed, 12 insertions(+), 11 deletions(-)

diff --git a/docs/src/new-components/basics/shared/site.js b/docs/src/new-components/basics/shared/site.js
index 3494038da18..9b19a2d4462 100644
--- a/docs/src/new-components/basics/shared/site.js
+++ b/docs/src/new-components/basics/shared/site.js
@@ -2,6 +2,7 @@
 
 const gitHubOrg = `https://github.com/storybooks`;
 const homepageUrl = `https://storybook.js.org`;
+const docsUrl = `${homepageUrl}/docs`;
 const npmApiBase = `https://api.npmjs.org/downloads/point/last-month`;
 
 export const metadata = {
@@ -42,8 +43,8 @@ export const url = {
   // Navigation
   home: `${homepageUrl}`,
   docs: {
-    home: `${homepageUrl}/basics/introduction/`,
-    addonInstruction: `${homepageUrl}/addons/writing-addons/`,
+    home: `${docsUrl}/basics/introduction/`,
+    addonInstruction: `${docsUrl}/addons/writing-addons/`,
   },
   addons: `${homepageUrl}/addons`,
   community: `${homepageUrl}/community`,
@@ -66,15 +67,15 @@ export const url = {
 
   // Framework docs
   framework: {
-    react: `${homepageUrl}/basics/guide-react/`,
-    reactNative: `${homepageUrl}/basics/guide-react-native/`,
-    vue: `${homepageUrl}/basics/guide-vue/`,
-    angular: `${homepageUrl}/basics/guide-angular/`,
-    ember: `${homepageUrl}/basics/guide-ember/`,
-    html: `${homepageUrl}/basics/guide-html/`,
-    svelte: `${homepageUrl}/basics/guide-svelte/`,
-    mithril: `${homepageUrl}/basics/guide-mithril/`,
-    riot: `${homepageUrl}/basics/guide-riot/`,
+    react: `${docsUrl}/guides/guide-react/`,
+    reactNative: `${docsUrl}/guides/guide-react-native/`,
+    vue: `${docsUrl}/guides/guide-vue/`,
+    angular: `${docsUrl}/guides/guide-angular/`,
+    ember: `${docsUrl}/guides/guide-ember/`,
+    html: `${docsUrl}/guides/guide-html/`,
+    svelte: `${docsUrl}/guides/guide-svelte/`,
+    mithril: `${docsUrl}/guides/guide-mithril/`,
+    riot: `${docsUrl}/guides/guide-riot/`,
   },
 
   // Official addons

From 41383971d67a243ece595d78815f33f56a948546 Mon Sep 17 00:00:00 2001
From: N1ck <nicholas.o.lockhart@gmail.com>
Date: Mon, 11 Mar 2019 10:33:10 +1300
Subject: [PATCH 234/249] Fix minor typo

---
 docs/src/pages/configurations/theming/index.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/docs/src/pages/configurations/theming/index.md b/docs/src/pages/configurations/theming/index.md
index 4fc8d9c9c18..7acf291deba 100644
--- a/docs/src/pages/configurations/theming/index.md
+++ b/docs/src/pages/configurations/theming/index.md
@@ -106,7 +106,7 @@ addParameters({
 });
 ```
 
-Many them variables are optional, the `base` property is NOT. This is a perfectly valid theme:
+Many theme variables are optional, the `base` property is NOT. This is a perfectly valid theme:
 
 ```ts
 import { create } from '@storybook/theming';

From de471e8ee6e20daa052962c011456a64646fab9e Mon Sep 17 00:00:00 2001
From: Marais Rossouw <me@maraisr.com>
Date: Sun, 10 Mar 2019 21:38:19 +1000
Subject: [PATCH 235/249] docs: use npm command for npm example

---
 lib/ui/src/settings/about.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/lib/ui/src/settings/about.js b/lib/ui/src/settings/about.js
index c961d6a8e1e..01824ccef08 100644
--- a/lib/ui/src/settings/about.js
+++ b/lib/ui/src/settings/about.js
@@ -180,7 +180,7 @@ const AboutScreen = ({ latest, current, onClose }) => {
                     <b>Upgrade all Storybook packages to latest:</b>
                   </p>
                   <SyntaxHighlighter language="bash" copyable padded bordered>
-                    npx npm-check-updates '/storybook/' -u && yarn
+                    npx npm-check-updates '/storybook/' -u && npm install
                   </SyntaxHighlighter>
                   <p>
                     Alternatively, if you're using yarn run the following command, and check all

From 3b6c63c670e88920984e86f5534ef390f1df3341 Mon Sep 17 00:00:00 2001
From: Marais Rossouw <me@maraisr.com>
Date: Mon, 11 Mar 2019 07:50:58 +1000
Subject: [PATCH 236/249] test: updated snapshots

---
 .../settings/__snapshots__/about.stories.storyshot  | 13 ++++++++++++-
 1 file changed, 12 insertions(+), 1 deletion(-)

diff --git a/lib/ui/src/settings/__snapshots__/about.stories.storyshot b/lib/ui/src/settings/__snapshots__/about.stories.storyshot
index 5c4689278d4..84c4aac721d 100644
--- a/lib/ui/src/settings/__snapshots__/about.stories.storyshot
+++ b/lib/ui/src/settings/__snapshots__/about.stories.storyshot
@@ -1903,7 +1903,18 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
                               >
                                 &&
                               </span>
-                               yarn
+                               
+                              <span
+                                class="token function"
+                              >
+                                npm
+                              </span>
+                               
+                              <span
+                                class="token function"
+                              >
+                                install
+                              </span>
                             </code>
                           </pre>
                         </div>

From 9664956217b33c4bc78df791ded6f501acca9594 Mon Sep 17 00:00:00 2001
From: "dependabot[bot]" <support@dependabot.com>
Date: Mon, 11 Mar 2019 05:21:37 +0000
Subject: [PATCH 237/249] build(deps-dev): bump @types/node from 11.10.4 to
 11.11.0

Bumps [@types/node](https://github.com/DefinitelyTyped/DefinitelyTyped/tree/HEAD/types/node) from 11.10.4 to 11.11.0.
- [Release notes](https://github.com/DefinitelyTyped/DefinitelyTyped/releases)
- [Commits](https://github.com/DefinitelyTyped/DefinitelyTyped/commits/HEAD/types/node)

Signed-off-by: dependabot[bot] <support@dependabot.com>
---
 examples/angular-cli/package.json |  2 +-
 package.json                      |  2 +-
 yarn.lock                         | 13 ++++---------
 3 files changed, 6 insertions(+), 11 deletions(-)

diff --git a/examples/angular-cli/package.json b/examples/angular-cli/package.json
index 2beaa02b393..6b281152e96 100644
--- a/examples/angular-cli/package.json
+++ b/examples/angular-cli/package.json
@@ -48,7 +48,7 @@
     "@storybook/angular": "5.1.0-alpha.3",
     "@types/core-js": "^2.5.0",
     "@types/jest": "^24.0.6",
-    "@types/node": "~11.9.5",
+    "@types/node": "~11.11.0",
     "@types/webpack-env": "^1.13.7",
     "global": "^4.3.2",
     "jasmine-core": "~3.3.0",
diff --git a/package.json b/package.json
index cbcec3c0912..4f477b2a352 100644
--- a/package.json
+++ b/package.json
@@ -68,7 +68,7 @@
     "@babel/preset-react": "^7.0.0",
     "@types/common-tags": "^1.8.0",
     "@types/jest": "^24.0.6",
-    "@types/node": "^11.9.5",
+    "@types/node": "^11.11.0",
     "@types/react": "^16.8.4",
     "@types/webpack-env": "^1.13.7",
     "babel-core": "^7.0.0-bridge.0",
diff --git a/yarn.lock b/yarn.lock
index b425b901471..e099dd1aa03 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2296,10 +2296,10 @@
   resolved "https://registry.yarnpkg.com/@types/minimatch/-/minimatch-3.0.3.tgz#3dca0e3f33b200fc7d1139c0cd96c1268cadfd9d"
   integrity sha512-tHq6qdbT9U1IRSGf14CL0pUlULksvY9OZ+5eEgl1N7t+OA3tGvNpxJCzuKQlsNgCVwbAs670L1vcVQi8j9HjnA==
 
-"@types/node@*", "@types/node@^11.9.5":
-  version "11.10.4"
-  resolved "https://registry.yarnpkg.com/@types/node/-/node-11.10.4.tgz#3f5fc4f0f322805f009e00ab35a2ff3d6b778e42"
-  integrity sha512-wa09itaLE8L705aXd8F80jnFpxz3Y1/KRHfKsYL2bPc0XF+wEWu8sR9n5bmeu8Ba1N9z2GRNzm/YdHcghLkLKg==
+"@types/node@*", "@types/node@^11.11.0", "@types/node@~11.11.0":
+  version "11.11.0"
+  resolved "https://registry.yarnpkg.com/@types/node/-/node-11.11.0.tgz#070e9ce7c90e727aca0e0c14e470f9a93ffe9390"
+  integrity sha512-D5Rt+HXgEywr3RQJcGlZUCTCx1qVbCZpVk3/tOOA6spLNZdGm8BU+zRgdRYDoF1pO3RuXLxADzMrF903JlQXqg==
 
 "@types/node@^10.11.7":
   version "10.12.29"
@@ -2311,11 +2311,6 @@
   resolved "https://registry.yarnpkg.com/@types/node/-/node-6.14.4.tgz#d8de576bdeaaafcf54a158af1e38cbb6e6d3db46"
   integrity sha512-UqB7h2dVJr/KdZXRMJIhNUWT0HXVe9UNvfLCOsqiSGKAVaAp0QniYHlU9yegxyG6Ug2rc7VdAD4hYj3VghqvAw==
 
-"@types/node@~11.9.5":
-  version "11.9.6"
-  resolved "https://registry.yarnpkg.com/@types/node/-/node-11.9.6.tgz#c632bbcc780a1349673a6e2e9b9dfa8c369d3c74"
-  integrity sha512-4hS2K4gwo9/aXIcoYxCtHpdgd8XUeDmo1siRCAH3RziXB65JlPqUFMtfy9VPj+og7dp3w1TFjGwYga4e0m9GwA==
-
 "@types/npmlog@^4.1.1":
   version "4.1.1"
   resolved "https://registry.yarnpkg.com/@types/npmlog/-/npmlog-4.1.1.tgz#b51cf39a6324a4ede17ef72dfa58a64fbefb39c7"

From d432a0672029f352c5c49d736bbd62a6acc37cf0 Mon Sep 17 00:00:00 2001
From: "dependabot[bot]" <support@dependabot.com>
Date: Mon, 11 Mar 2019 05:25:04 +0000
Subject: [PATCH 238/249] build(deps): bump react-is from 16.8.3 to 16.8.4

Bumps [react-is](https://github.com/facebook/react/tree/HEAD/packages/react-is) from 16.8.3 to 16.8.4.
- [Release notes](https://github.com/facebook/react/releases)
- [Changelog](https://github.com/facebook/react/blob/master/CHANGELOG.md)
- [Commits](https://github.com/facebook/react/commits/v16.8.4/packages/react-is)

Signed-off-by: dependabot[bot] <support@dependabot.com>
---
 addons/info/package.json |  2 +-
 yarn.lock                | 12 ++++--------
 2 files changed, 5 insertions(+), 9 deletions(-)

diff --git a/addons/info/package.json b/addons/info/package.json
index f6df6513f95..525ef9cc10e 100644
--- a/addons/info/package.json
+++ b/addons/info/package.json
@@ -33,7 +33,7 @@
     "prop-types": "^15.7.2",
     "react": "^16.8.4",
     "react-addons-create-fragment": "^15.6.2",
-    "react-is": "^16.8.3",
+    "react-is": "^16.8.4",
     "react-lifecycles-compat": "^3.0.4",
     "util-deprecate": "^1.0.2"
   },
diff --git a/yarn.lock b/yarn.lock
index b425b901471..7250ebc83dd 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -19010,14 +19010,10 @@ react-inspector@^2.3.1:
     is-dom "^1.0.9"
     prop-types "^15.6.1"
 
-react-is@^16.7.0, react-is@^16.8.1:
-  version "16.8.1"
-  resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.8.1.tgz#a80141e246eb894824fb4f2901c0c50ef31d4cdb"
-
-react-is@^16.8.3:
-  version "16.8.3"
-  resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.8.3.tgz#4ad8b029c2a718fc0cfc746c8d4e1b7221e5387d"
-  integrity sha512-Y4rC1ZJmsxxkkPuMLwvKvlL1Zfpbcu+Bf4ZigkHup3v9EfdYhAlWAaVyA19olXq2o2mGn0w+dFKvk3pVVlYcIA==
+react-is@^16.7.0, react-is@^16.8.1, react-is@^16.8.3, react-is@^16.8.4:
+  version "16.8.4"
+  resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.8.4.tgz#90f336a68c3a29a096a3d648ab80e87ec61482a2"
+  integrity sha512-PVadd+WaUDOAciICm/J1waJaSvgq+4rHE/K70j0PFqKhkTBsPv/82UGQJNXAngz1fOQLLxI6z1sEDmJDQhCTAA==
 
 react-lifecycles-compat@^3.0.2, react-lifecycles-compat@^3.0.4:
   version "3.0.4"

From 393beca7834fde2444a406e0feffde44dcbb315b Mon Sep 17 00:00:00 2001
From: "dependabot[bot]" <support@dependabot.com>
Date: Mon, 11 Mar 2019 05:26:36 +0000
Subject: [PATCH 239/249] build(deps): bump react-dev-utils from 7.0.3 to 8.0.0

Bumps [react-dev-utils](https://github.com/facebook/create-react-app) from 7.0.3 to 8.0.0.
- [Release notes](https://github.com/facebook/create-react-app/releases)
- [Changelog](https://github.com/facebook/create-react-app/blob/master/CHANGELOG-1.x.md)
- [Commits](https://github.com/facebook/create-react-app/compare/react-dev-utils@7.0.3...react-dev-utils@8.0.0)

Signed-off-by: dependabot[bot] <support@dependabot.com>
---
 app/react-native/package.json |  2 +-
 app/react/package.json        |  2 +-
 lib/core/package.json         |  2 +-
 yarn.lock                     | 52 ++++++++++++++++++++++++++++++++---
 4 files changed, 51 insertions(+), 7 deletions(-)

diff --git a/app/react-native/package.json b/app/react-native/package.json
index 664a7415d9b..4286d257ba8 100644
--- a/app/react-native/package.json
+++ b/app/react-native/package.json
@@ -58,7 +58,7 @@
     "lazy-universal-dotenv": "^2.0.0",
     "prop-types": "^15.7.2",
     "raw-loader": "^1.0.0",
-    "react-dev-utils": "^7.0.3",
+    "react-dev-utils": "^8.0.0",
     "react-native-swipe-gestures": "^1.0.2",
     "shelljs": "^0.8.3",
     "url-parse": "^1.4.4",
diff --git a/app/react/package.json b/app/react/package.json
index 78175810dc9..7ac2deeb9a6 100644
--- a/app/react/package.json
+++ b/app/react/package.json
@@ -41,7 +41,7 @@
     "lodash": "^4.17.11",
     "mini-css-extract-plugin": "^0.5.0",
     "prop-types": "^15.7.2",
-    "react-dev-utils": "^7.0.3",
+    "react-dev-utils": "^8.0.0",
     "regenerator-runtime": "^0.12.1",
     "semver": "^5.6.0",
     "webpack": "^4.29.6"
diff --git a/lib/core/package.json b/lib/core/package.json
index e1008dee80c..04e0eb422b0 100644
--- a/lib/core/package.json
+++ b/lib/core/package.json
@@ -69,7 +69,7 @@
     "pretty-hrtime": "^1.0.3",
     "qs": "^6.6.0",
     "raw-loader": "^1.0.0",
-    "react-dev-utils": "^7.0.3",
+    "react-dev-utils": "^8.0.0",
     "regenerator-runtime": "^0.12.1",
     "resolve": "^1.10.0",
     "resolve-from": "^4.0.0",
diff --git a/yarn.lock b/yarn.lock
index b425b901471..9256d7359df 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -10410,6 +10410,19 @@ fork-ts-checker-webpack-plugin-alt@0.4.14:
     resolve "^1.5.0"
     tapable "^1.0.0"
 
+fork-ts-checker-webpack-plugin@1.0.0-alpha.6:
+  version "1.0.0-alpha.6"
+  resolved "https://registry.yarnpkg.com/fork-ts-checker-webpack-plugin/-/fork-ts-checker-webpack-plugin-1.0.0-alpha.6.tgz#826c57048addf8a3253853615c84f3ff7beeaf45"
+  integrity sha512-s/V+58nLrUjuXyzYk8AL11XG8bxIirTbafDLMn26sL59HQx8QvvsRTqOkhq4MV0coIkog1jZuH/E9Abm8zFZ2g==
+  dependencies:
+    babel-code-frame "^6.22.0"
+    chalk "^2.4.1"
+    chokidar "^2.0.4"
+    micromatch "^3.1.10"
+    minimatch "^3.0.4"
+    semver "^5.6.0"
+    tapable "^1.0.0"
+
 fork-ts-checker-webpack-plugin@^0.5.2:
   version "0.5.2"
   resolved "https://registry.yarnpkg.com/fork-ts-checker-webpack-plugin/-/fork-ts-checker-webpack-plugin-0.5.2.tgz#a73b3630bd0a69409a6e4824e54c03a62fe82d8f"
@@ -18899,6 +18912,37 @@ react-dev-utils@^7.0.3:
     strip-ansi "5.0.0"
     text-table "0.2.0"
 
+react-dev-utils@^8.0.0:
+  version "8.0.0"
+  resolved "https://registry.yarnpkg.com/react-dev-utils/-/react-dev-utils-8.0.0.tgz#7c5b227a45a32ea8ff7fbc318f336cf9e2c6e34c"
+  integrity sha512-TK8cj7eghvxfe7bfBluLGpI/upo4EXC+G74hYmPucAG8C2XcbT+vKnlWPwLnABb75Zk+mR6D556Da+yvDjljrw==
+  dependencies:
+    "@babel/code-frame" "7.0.0"
+    address "1.0.3"
+    browserslist "4.4.1"
+    chalk "2.4.2"
+    cross-spawn "6.0.5"
+    detect-port-alt "1.1.6"
+    escape-string-regexp "1.0.5"
+    filesize "3.6.1"
+    find-up "3.0.0"
+    fork-ts-checker-webpack-plugin "1.0.0-alpha.6"
+    global-modules "2.0.0"
+    globby "8.0.2"
+    gzip-size "5.0.0"
+    immer "1.10.0"
+    inquirer "6.2.1"
+    is-root "2.0.0"
+    loader-utils "1.2.3"
+    opn "5.4.0"
+    pkg-up "2.0.0"
+    react-error-overlay "^5.1.4"
+    recursive-readdir "2.2.2"
+    shell-quote "1.6.1"
+    sockjs-client "1.3.0"
+    strip-ansi "5.0.0"
+    text-table "0.2.0"
+
 react-devtools-core@3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/react-devtools-core/-/react-devtools-core-3.0.0.tgz#f683e19f0311108f97dbb5b29d948323a1bf7c03"
@@ -18952,10 +18996,10 @@ react-draggable@^3.1.1:
     classnames "^2.2.5"
     prop-types "^15.6.0"
 
-react-error-overlay@^5.1.3:
-  version "5.1.3"
-  resolved "https://registry.yarnpkg.com/react-error-overlay/-/react-error-overlay-5.1.3.tgz#16fcbde75ed4dc6161dc6dc959b48e92c6ffa9ad"
-  integrity sha512-GoqeM3Xadie7XUApXOjkY3Qhs8RkwB/Za4WMedBGrOKH1eTuKGyoAECff7jiVonJchOx6KZ9i8ILO5XIoHB+Tg==
+react-error-overlay@^5.1.3, react-error-overlay@^5.1.4:
+  version "5.1.4"
+  resolved "https://registry.yarnpkg.com/react-error-overlay/-/react-error-overlay-5.1.4.tgz#88dfb88857c18ceb3b9f95076f850d7121776991"
+  integrity sha512-fp+U98OMZcnduQ+NSEiQa4s/XMsbp+5KlydmkbESOw4P69iWZ68ZMFM5a2BuE0FgqPBKApJyRuYHR95jM8lAmg==
 
 react-fast-compare@^2.0.2:
   version "2.0.4"

From 68b6009a2be68a534de6fc2154ad1b7354640b75 Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Mon, 11 Mar 2019 08:51:39 +0100
Subject: [PATCH 240/249] CLEANUP

---
 app/polymer/src/client/preview/render.js | 4 +---
 1 file changed, 1 insertion(+), 3 deletions(-)

diff --git a/app/polymer/src/client/preview/render.js b/app/polymer/src/client/preview/render.js
index 872d8eb7a9f..596357058e5 100644
--- a/app/polymer/src/client/preview/render.js
+++ b/app/polymer/src/client/preview/render.js
@@ -32,9 +32,7 @@ export default function renderMain({
     // `render` stores the TemplateInstance in the Node and tries to update based on that.
     // Since we reuse `rootElement` for all stories, remove the stored instance first.
     // But forceRender means that it's the same story, so we want too keep the state in that case.
-    if (!forceRender) {
-      rootElement.innerHTML = '<div id="root-inner"></div>';
-    } else if (!rootElement.querySelector('[id="root-inner"]')) {
+    if (!forceRender || !rootElement.querySelector('[id="root-inner"]')) {
       rootElement.innerHTML = '<div id="root-inner"></div>';
     }
     const renderTo = rootElement.querySelector('[id="root-inner"]');

From cb986041b03d5e4a9d41c98e97a12696763259d2 Mon Sep 17 00:00:00 2001
From: "dependabot[bot]" <support@dependabot.com>
Date: Mon, 11 Mar 2019 08:04:09 +0000
Subject: [PATCH 241/249] build(deps-dev): bump @types/jest from 24.0.6 to
 24.0.11

Bumps [@types/jest](https://github.com/DefinitelyTyped/DefinitelyTyped/tree/HEAD/types/jest) from 24.0.6 to 24.0.11.
- [Release notes](https://github.com/DefinitelyTyped/DefinitelyTyped/releases)
- [Commits](https://github.com/DefinitelyTyped/DefinitelyTyped/commits/HEAD/types/jest)

Signed-off-by: dependabot[bot] <support@dependabot.com>
---
 examples/angular-cli/package.json | 2 +-
 package.json                      | 2 +-
 yarn.lock                         | 8 ++++----
 3 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/examples/angular-cli/package.json b/examples/angular-cli/package.json
index 6b281152e96..96ca5dd9d81 100644
--- a/examples/angular-cli/package.json
+++ b/examples/angular-cli/package.json
@@ -47,7 +47,7 @@
     "@storybook/addons": "5.1.0-alpha.3",
     "@storybook/angular": "5.1.0-alpha.3",
     "@types/core-js": "^2.5.0",
-    "@types/jest": "^24.0.6",
+    "@types/jest": "^24.0.11",
     "@types/node": "~11.11.0",
     "@types/webpack-env": "^1.13.7",
     "global": "^4.3.2",
diff --git a/package.json b/package.json
index 4f477b2a352..e3038b972e7 100644
--- a/package.json
+++ b/package.json
@@ -67,7 +67,7 @@
     "@babel/preset-flow": "^7.0.0",
     "@babel/preset-react": "^7.0.0",
     "@types/common-tags": "^1.8.0",
-    "@types/jest": "^24.0.6",
+    "@types/jest": "^24.0.11",
     "@types/node": "^11.11.0",
     "@types/react": "^16.8.4",
     "@types/webpack-env": "^1.13.7",
diff --git a/yarn.lock b/yarn.lock
index 451f1150662..0569207fb6b 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2274,10 +2274,10 @@
   version "23.3.13"
   resolved "https://registry.yarnpkg.com/@types/jest/-/jest-23.3.13.tgz#c81484b6f4ca007bb09887ed15ecb3286d58f928"
 
-"@types/jest@^24.0.6":
-  version "24.0.6"
-  resolved "https://registry.yarnpkg.com/@types/jest/-/jest-24.0.6.tgz#ba4c8c7900ce098a82ca99293cbe4192bde4f355"
-  integrity sha512-NE7FBG/F4cMDKdCBqgyd+Sa6JZ5GiMOyA5QwJdeS4Ii/Z9a18WgGbFrHbcr48/7I9HdnkaAYP+S2MmQ27qoqJA==
+"@types/jest@^24.0.11":
+  version "24.0.11"
+  resolved "https://registry.yarnpkg.com/@types/jest/-/jest-24.0.11.tgz#1f099bea332c228ea6505a88159bfa86a5858340"
+  integrity sha512-2kLuPC5FDnWIDvaJBzsGTBQaBbnDweznicvK7UGYzlIJP4RJR2a4A/ByLUXEyEgag6jz8eHdlWExGDtH3EYUXQ==
   dependencies:
     "@types/jest-diff" "*"
 

From 0697022c9aebef056613b376198bbab999b25c6e Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Mon, 11 Mar 2019 10:06:58 +0100
Subject: [PATCH 242/249] SYNC printWidth prettier config

---
 addons/storysource/README.md                     | 4 ++--
 addons/storysource/src/loader/default-options.js | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/addons/storysource/README.md b/addons/storysource/README.md
index 7c12c548d36..808b04771c7 100644
--- a/addons/storysource/README.md
+++ b/addons/storysource/README.md
@@ -72,7 +72,7 @@ The prettier configuration that will be used to format the story source in the a
 Defaults:
 ```js
 {
-  printWidth: 120,
+  printWidth: 100,
   tabWidth: 2,
   bracketSpacing: true,
   trailingComma: 'es5',
@@ -91,7 +91,7 @@ module.exports = function (baseConfig, env, defaultConfig) {
         loader: require.resolve('@storybook/addon-storysource/loader'),
         options: {
           prettierConfig: {
-            printWidth: 80,
+            printWidth: 100,
             singleQuote: false,
           }
         }
diff --git a/addons/storysource/src/loader/default-options.js b/addons/storysource/src/loader/default-options.js
index 97a58bd808d..65ca9c768a2 100644
--- a/addons/storysource/src/loader/default-options.js
+++ b/addons/storysource/src/loader/default-options.js
@@ -1,6 +1,6 @@
 const defaultOptions = {
   prettierConfig: {
-    printWidth: 120,
+    printWidth: 100,
     tabWidth: 2,
     bracketSpacing: true,
     trailingComma: 'es5',

From 58411bff77974f30b56cc4edaed503046c8929b9 Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Mon, 11 Mar 2019 10:48:02 +0100
Subject: [PATCH 243/249] CLEANUP

---
 .../__snapshots__/App.stories.storyshot       |   29 -
 .../__snapshots__/cra-svgr.stories.storyshot  |    7 -
 .../panel_actionbar.stories.storyshot         |  185 --
 .../__snapshots__/Logo.stories.storyshot      |   45 -
 .../StorybookLogo.stories.storyshot           |   45 -
 .../__snapshots__/button.stories.storyshot    |    9 -
 .../placeholder.stories.storyshot             |   18 -
 .../SidebarItem.stories.storyshot             |  757 ------
 .../SidebarSearch.stories.storyshot           |    9 -
 .../__snapshots__/nav.stories.storyshot       | 2040 -----------------
 .../__snapshots__/treeview.stories.storyshot  |  550 -----
 11 files changed, 3694 deletions(-)
 delete mode 100644 examples/cra-kitchen-sink/src/stories/__snapshots__/App.stories.storyshot
 delete mode 100644 examples/cra-kitchen-sink/src/stories/__snapshots__/cra-svgr.stories.storyshot
 delete mode 100644 lib/components/src/ActionBar/__snapshots__/panel_actionbar.stories.storyshot
 delete mode 100644 lib/components/src/brand/__snapshots__/Logo.stories.storyshot
 delete mode 100644 lib/components/src/brand/__snapshots__/StorybookLogo.stories.storyshot
 delete mode 100644 lib/components/src/form/__snapshots__/button.stories.storyshot
 delete mode 100644 lib/components/src/placeholder/__snapshots__/placeholder.stories.storyshot
 delete mode 100644 lib/ui/src/components/sidebar/__snapshots__/SidebarItem.stories.storyshot
 delete mode 100644 lib/ui/src/components/sidebar/__snapshots__/SidebarSearch.stories.storyshot
 delete mode 100644 lib/ui/src/components/sidebar/__snapshots__/nav.stories.storyshot
 delete mode 100644 lib/ui/src/components/sidebar/treeview/__snapshots__/treeview.stories.storyshot

diff --git a/examples/cra-kitchen-sink/src/stories/__snapshots__/App.stories.storyshot b/examples/cra-kitchen-sink/src/stories/__snapshots__/App.stories.storyshot
deleted file mode 100644
index e80329a49dc..00000000000
--- a/examples/cra-kitchen-sink/src/stories/__snapshots__/App.stories.storyshot
+++ /dev/null
@@ -1,29 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Storyshots App full app 1`] = `
-<div
-  class="App"
->
-  <div
-    class="App-header"
-  >
-    <img
-      alt="logo"
-      class="App-logo"
-      src="file-stub"
-    />
-    <h2>
-      Welcome to React
-    </h2>
-  </div>
-  <p
-    class="App-intro"
-  >
-    To get started, edit 
-    <code>
-      src/App.js
-    </code>
-     and save to reload.
-  </p>
-</div>
-`;
diff --git a/examples/cra-kitchen-sink/src/stories/__snapshots__/cra-svgr.stories.storyshot b/examples/cra-kitchen-sink/src/stories/__snapshots__/cra-svgr.stories.storyshot
deleted file mode 100644
index f1d5514684a..00000000000
--- a/examples/cra-kitchen-sink/src/stories/__snapshots__/cra-svgr.stories.storyshot
+++ /dev/null
@@ -1,7 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Storyshots CRA Svgr 1`] = `
-<svg>
-  logo.svg
-</svg>
-`;
diff --git a/lib/components/src/ActionBar/__snapshots__/panel_actionbar.stories.storyshot b/lib/components/src/ActionBar/__snapshots__/panel_actionbar.stories.storyshot
deleted file mode 100644
index 461cb00b99c..00000000000
--- a/lib/components/src/ActionBar/__snapshots__/panel_actionbar.stories.storyshot
+++ /dev/null
@@ -1,185 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Storyshots Basics|PanelActionBar 3 items 1`] = `
-.emotion-6 {
-  position: absolute;
-  bottom: 0;
-  right: 0;
-  max-width: 100%;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  list-style: none;
-  margin: 0;
-  padding: 0;
-  border-top: 1px solid rgba(0,0,0,0.1);
-  border-left: 1px solid rgba(0,0,0,0.1);
-  background: rgba(255,255,255,1);
-  border-radius: 4px 0 0 0;
-}
-
-.emotion-1 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  position: relative;
-  list-style: none;
-  padding: 0;
-  height: 26px;
-  font-size: 11px;
-  -webkit-letter-spacing: 1px;
-  -moz-letter-spacing: 1px;
-  -ms-letter-spacing: 1px;
-  letter-spacing: 1px;
-  text-transform: uppercase;
-  border-left: 0 none;
-}
-
-.emotion-0 {
-  border: 0 none;
-  display: block;
-  background: none;
-  padding: 0 10px;
-  cursor: pointer;
-  text-transform: inherit;
-  -webkit-letter-spacing: inherit;
-  -moz-letter-spacing: inherit;
-  -ms-letter-spacing: inherit;
-  letter-spacing: inherit;
-  font-size: inherit;
-  color: inherit;
-  border-top: 2px solid transparent;
-  border-bottom: 2px solid transparent;
-}
-
-.emotion-0:focus {
-  border-bottom: 2px solid #1EA7FD;
-  outline: 0 none;
-}
-
-.emotion-3 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  position: relative;
-  list-style: none;
-  padding: 0;
-  height: 26px;
-  font-size: 11px;
-  -webkit-letter-spacing: 1px;
-  -moz-letter-spacing: 1px;
-  -ms-letter-spacing: 1px;
-  letter-spacing: 1px;
-  text-transform: uppercase;
-  border-left: 1px solid rgba(0,0,0,0.1);
-}
-
-<ul
-  class="emotion-6"
->
-  <li
-    class="emotion-1"
-  >
-    <button
-      class="emotion-0"
-    >
-      Nr1
-    </button>
-  </li>
-  <li
-    class="emotion-3"
-  >
-    <button
-      class="emotion-0"
-    >
-      Nr2
-    </button>
-  </li>
-  <li
-    class="emotion-3"
-  >
-    <button
-      class="emotion-0"
-    >
-      Nr3
-    </button>
-  </li>
-</ul>
-`;
-
-exports[`Storyshots Basics|PanelActionBar single item 1`] = `
-.emotion-2 {
-  position: absolute;
-  bottom: 0;
-  right: 0;
-  max-width: 100%;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  list-style: none;
-  margin: 0;
-  padding: 0;
-  border-top: 1px solid rgba(0,0,0,0.1);
-  border-left: 1px solid rgba(0,0,0,0.1);
-  background: rgba(255,255,255,1);
-  border-radius: 4px 0 0 0;
-}
-
-.emotion-1 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  position: relative;
-  list-style: none;
-  padding: 0;
-  height: 26px;
-  font-size: 11px;
-  -webkit-letter-spacing: 1px;
-  -moz-letter-spacing: 1px;
-  -ms-letter-spacing: 1px;
-  letter-spacing: 1px;
-  text-transform: uppercase;
-  border-left: 0 none;
-}
-
-.emotion-0 {
-  border: 0 none;
-  display: block;
-  background: none;
-  padding: 0 10px;
-  cursor: pointer;
-  text-transform: inherit;
-  -webkit-letter-spacing: inherit;
-  -moz-letter-spacing: inherit;
-  -ms-letter-spacing: inherit;
-  letter-spacing: inherit;
-  font-size: inherit;
-  color: inherit;
-  border-top: 2px solid transparent;
-  border-bottom: 2px solid transparent;
-}
-
-.emotion-0:focus {
-  border-bottom: 2px solid #1EA7FD;
-  outline: 0 none;
-}
-
-<ul
-  class="emotion-2"
->
-  <li
-    class="emotion-1"
-  >
-    <button
-      class="emotion-0"
-    >
-      CLEAR
-    </button>
-  </li>
-</ul>
-`;
diff --git a/lib/components/src/brand/__snapshots__/Logo.stories.storyshot b/lib/components/src/brand/__snapshots__/Logo.stories.storyshot
deleted file mode 100644
index 1bf6a9c5d79..00000000000
--- a/lib/components/src/brand/__snapshots__/Logo.stories.storyshot
+++ /dev/null
@@ -1,45 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Storyshots Components|Brand/Storybook Logo default 1`] = `
-<svg
-  height="40px"
-  title="Storybook"
-  viewBox="0 0 200 40"
-  width="200px"
->
-  <defs>
-    <path
-      d="M1.2 36.9L0 3.9c0-1.1.8-2 1.9-2.1l28-1.8a2 2 0 0 1 2.2 1.9 2 2 0 0 1 0 .1v36a2 2 0 0 1-2 2 2 2 0 0 1-.1 0L3.2 38.8a2 2 0 0 1-2-2z"
-      id="a"
-    />
-  </defs>
-  <g
-    fill="none"
-    fill-rule="evenodd"
-  >
-    <path
-      d="M53.3 31.7c-1.7 0-3.4-.3-5-.7-1.5-.5-2.8-1.1-3.9-2l1.6-3.5c2.2 1.5 4.6 2.3 7.3 2.3 1.5 0 2.5-.2 3.3-.7.7-.5 1.1-1 1.1-1.9 0-.7-.3-1.3-1-1.7s-2-.8-3.7-1.2c-2-.4-3.6-.9-4.8-1.5-1.1-.5-2-1.2-2.6-2-.5-1-.8-2-.8-3.2 0-1.4.4-2.6 1.2-3.6.7-1.1 1.8-2 3.2-2.6 1.3-.6 2.9-.9 4.7-.9 1.6 0 3.1.3 4.6.7 1.5.5 2.7 1.1 3.5 2l-1.6 3.5c-2-1.5-4.2-2.3-6.5-2.3-1.3 0-2.3.2-3 .8-.8.5-1.2 1.1-1.2 2 0 .5.2 1 .5 1.3.2.3.7.6 1.4.9l2.9.8c2.9.6 5 1.4 6.2 2.4a5 5 0 0 1 2 4.2 6 6 0 0 1-2.5 5c-1.7 1.2-4 1.9-7 1.9zm21-3.6l1.4-.1-.2 3.5-1.9.1c-2.4 0-4.1-.5-5.2-1.5-1.1-1-1.6-2.7-1.6-4.8v-6h-3v-3.6h3V11h4.8v4.6h4v3.6h-4v6c0 1.8.9 2.8 2.6 2.8zm11.1 3.5c-1.6 0-3-.3-4.3-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.3-1 1.7 0 3.2.3 4.4 1a7 7 0 0 1 3 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.4 1zm0-3.6c2.4 0 3.6-1.6 3.6-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.6-1c-2.3 0-3.5 1.4-3.5 4.4 0 3 1.2 4.6 3.5 4.6zm21.7-8.8l-2.7.3c-1.3.2-2.3.5-2.8 1.2-.6.6-.9 1.4-.9 2.5v8.2H96V15.7h4.6v2.6c.8-1.8 2.5-2.8 5-3h1.3l.3 4zm14-3.5h4.8L116.4 37h-4.9l3-6.6-6.4-14.8h5l4 10 4-10zm16-.4c1.4 0 2.6.3 3.6 1 1 .6 1.9 1.6 2.5 2.8.6 1.2.9 2.7.9 4.3 0 1.6-.3 3-1 4.3a6.9 6.9 0 0 1-2.4 2.9c-1 .7-2.2 1-3.6 1-1 0-2-.2-3-.7-.8-.4-1.5-1-2-1.9v2.4h-4.7V8.8h4.8v9c.5-.8 1.2-1.4 2-1.9.9-.4 1.8-.6 3-.6zM135.7 28c1.1 0 2-.4 2.6-1.2.6-.8 1-2 1-3.4 0-1.5-.4-2.5-1-3.3s-1.5-1.1-2.6-1.1-2 .3-2.6 1.1c-.6.8-1 2-1 3.3 0 1.5.4 2.6 1 3.4.6.8 1.5 1.2 2.6 1.2zm18.9 3.6c-1.7 0-3.2-.3-4.4-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.4-1 1.6 0 3 .3 4.3 1a7 7 0 0 1 3 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.3 1zm0-3.6c2.3 0 3.5-1.6 3.5-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.5-1c-2.4 0-3.6 1.4-3.6 4.4 0 3 1.2 4.6 3.6 4.6zm18 3.6c-1.7 0-3.2-.3-4.4-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.4-1 1.6 0 3 .3 4.4 1a7 7 0 0 1 2.9 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.3 1zm0-3.6c2.3 0 3.5-1.6 3.5-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.5-1c-2.4 0-3.6 1.4-3.6 4.4 0 3 1.2 4.6 3.6 4.6zm27.4 3.4h-6l-6-7v7h-4.8V8.8h4.9v13.6l5.8-6.7h5.7l-6.6 7.5 7 8.2z"
-      fill="#333"
-    />
-    <mask
-      fill="#fff"
-      id="b"
-    >
-      <use
-        href="#a"
-      />
-    </mask>
-    <use
-      fill="#FF4785"
-      fill-rule="nonzero"
-      href="#a"
-    />
-    <path
-      d="M23.7 5L24 .2l3.9-.3.1 4.8a.3.3 0 0 1-.5.2L26 3.8l-1.7 1.4a.3.3 0 0 1-.5-.3zm-5 10c0 .9 5.3.5 6 0 0-5.4-2.8-8.2-8-8.2-5.3 0-8.2 2.8-8.2 7.1 0 7.4 10 7.6 10 11.6 0 1.2-.5 1.9-1.8 1.9-1.6 0-2.2-.9-2.1-3.6 0-.6-6.1-.8-6.3 0-.5 6.7 3.7 8.6 8.5 8.6 4.6 0 8.3-2.5 8.3-7 0-7.9-10.2-7.7-10.2-11.6 0-1.6 1.2-1.8 2-1.8.6 0 2 0 1.9 3z"
-      fill="#FFF"
-      fill-rule="nonzero"
-      mask="url(#b)"
-    />
-  </g>
-</svg>
-`;
diff --git a/lib/components/src/brand/__snapshots__/StorybookLogo.stories.storyshot b/lib/components/src/brand/__snapshots__/StorybookLogo.stories.storyshot
deleted file mode 100644
index 715c5c6e2a9..00000000000
--- a/lib/components/src/brand/__snapshots__/StorybookLogo.stories.storyshot
+++ /dev/null
@@ -1,45 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Storyshots Basics|Brand/StorybookLogo default 1`] = `
-<svg
-  height="40px"
-  title="Storybook"
-  viewBox="0 0 200 40"
-  width="200px"
->
-  <defs>
-    <path
-      d="M1.2 36.9L0 3.9c0-1.1.8-2 1.9-2.1l28-1.8a2 2 0 0 1 2.2 1.9 2 2 0 0 1 0 .1v36a2 2 0 0 1-2 2 2 2 0 0 1-.1 0L3.2 38.8a2 2 0 0 1-2-2z"
-      id="a"
-    />
-  </defs>
-  <g
-    fill="none"
-    fill-rule="evenodd"
-  >
-    <path
-      d="M53.3 31.7c-1.7 0-3.4-.3-5-.7-1.5-.5-2.8-1.1-3.9-2l1.6-3.5c2.2 1.5 4.6 2.3 7.3 2.3 1.5 0 2.5-.2 3.3-.7.7-.5 1.1-1 1.1-1.9 0-.7-.3-1.3-1-1.7s-2-.8-3.7-1.2c-2-.4-3.6-.9-4.8-1.5-1.1-.5-2-1.2-2.6-2-.5-1-.8-2-.8-3.2 0-1.4.4-2.6 1.2-3.6.7-1.1 1.8-2 3.2-2.6 1.3-.6 2.9-.9 4.7-.9 1.6 0 3.1.3 4.6.7 1.5.5 2.7 1.1 3.5 2l-1.6 3.5c-2-1.5-4.2-2.3-6.5-2.3-1.3 0-2.3.2-3 .8-.8.5-1.2 1.1-1.2 2 0 .5.2 1 .5 1.3.2.3.7.6 1.4.9l2.9.8c2.9.6 5 1.4 6.2 2.4a5 5 0 0 1 2 4.2 6 6 0 0 1-2.5 5c-1.7 1.2-4 1.9-7 1.9zm21-3.6l1.4-.1-.2 3.5-1.9.1c-2.4 0-4.1-.5-5.2-1.5-1.1-1-1.6-2.7-1.6-4.8v-6h-3v-3.6h3V11h4.8v4.6h4v3.6h-4v6c0 1.8.9 2.8 2.6 2.8zm11.1 3.5c-1.6 0-3-.3-4.3-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.3-1 1.7 0 3.2.3 4.4 1a7 7 0 0 1 3 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.4 1zm0-3.6c2.4 0 3.6-1.6 3.6-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.6-1c-2.3 0-3.5 1.4-3.5 4.4 0 3 1.2 4.6 3.5 4.6zm21.7-8.8l-2.7.3c-1.3.2-2.3.5-2.8 1.2-.6.6-.9 1.4-.9 2.5v8.2H96V15.7h4.6v2.6c.8-1.8 2.5-2.8 5-3h1.3l.3 4zm14-3.5h4.8L116.4 37h-4.9l3-6.6-6.4-14.8h5l4 10 4-10zm16-.4c1.4 0 2.6.3 3.6 1 1 .6 1.9 1.6 2.5 2.8.6 1.2.9 2.7.9 4.3 0 1.6-.3 3-1 4.3a6.9 6.9 0 0 1-2.4 2.9c-1 .7-2.2 1-3.6 1-1 0-2-.2-3-.7-.8-.4-1.5-1-2-1.9v2.4h-4.7V8.8h4.8v9c.5-.8 1.2-1.4 2-1.9.9-.4 1.8-.6 3-.6zM135.7 28c1.1 0 2-.4 2.6-1.2.6-.8 1-2 1-3.4 0-1.5-.4-2.5-1-3.3s-1.5-1.1-2.6-1.1-2 .3-2.6 1.1c-.6.8-1 2-1 3.3 0 1.5.4 2.6 1 3.4.6.8 1.5 1.2 2.6 1.2zm18.9 3.6c-1.7 0-3.2-.3-4.4-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.4-1 1.6 0 3 .3 4.3 1a7 7 0 0 1 3 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.3 1zm0-3.6c2.3 0 3.5-1.6 3.5-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.5-1c-2.4 0-3.6 1.4-3.6 4.4 0 3 1.2 4.6 3.6 4.6zm18 3.6c-1.7 0-3.2-.3-4.4-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.4-1 1.6 0 3 .3 4.4 1a7 7 0 0 1 2.9 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.3 1zm0-3.6c2.3 0 3.5-1.6 3.5-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.5-1c-2.4 0-3.6 1.4-3.6 4.4 0 3 1.2 4.6 3.6 4.6zm27.4 3.4h-6l-6-7v7h-4.8V8.8h4.9v13.6l5.8-6.7h5.7l-6.6 7.5 7 8.2z"
-      fill="#333"
-    />
-    <mask
-      fill="#fff"
-      id="b"
-    >
-      <use
-        href="#a"
-      />
-    </mask>
-    <use
-      fill="#FF4785"
-      fill-rule="nonzero"
-      href="#a"
-    />
-    <path
-      d="M23.7 5L24 .2l3.9-.3.1 4.8a.3.3 0 0 1-.5.2L26 3.8l-1.7 1.4a.3.3 0 0 1-.5-.3zm-5 10c0 .9 5.3.5 6 0 0-5.4-2.8-8.2-8-8.2-5.3 0-8.2 2.8-8.2 7.1 0 7.4 10 7.6 10 11.6 0 1.2-.5 1.9-1.8 1.9-1.6 0-2.2-.9-2.1-3.6 0-.6-6.1-.8-6.3 0-.5 6.7 3.7 8.6 8.5 8.6 4.6 0 8.3-2.5 8.3-7 0-7.9-10.2-7.7-10.2-11.6 0-1.6 1.2-1.8 2-1.8.6 0 2 0 1.9 3z"
-      fill="#FFF"
-      fill-rule="nonzero"
-      mask="url(#b)"
-    />
-  </g>
-</svg>
-`;
diff --git a/lib/components/src/form/__snapshots__/button.stories.storyshot b/lib/components/src/form/__snapshots__/button.stories.storyshot
deleted file mode 100644
index 7d9432bda01..00000000000
--- a/lib/components/src/form/__snapshots__/button.stories.storyshot
+++ /dev/null
@@ -1,9 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Storyshots Components|Form/Button with onclick 1`] = `
-<button
-  class="css-lopq8z"
->
-  Submit
-</button>
-`;
diff --git a/lib/components/src/placeholder/__snapshots__/placeholder.stories.storyshot b/lib/components/src/placeholder/__snapshots__/placeholder.stories.storyshot
deleted file mode 100644
index b420bc6115d..00000000000
--- a/lib/components/src/placeholder/__snapshots__/placeholder.stories.storyshot
+++ /dev/null
@@ -1,18 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Storyshots Basics|Placeholder default 1`] = `
-.emotion-0 {
-  font-size: 11px;
-  display: block;
-  text-align: center;
-  text-transform: uppercase;
-  margin: 0;
-  padding: 20px;
-}
-
-<p
-  class="emotion-0"
->
-  This is a placeholder
-</p>
-`;
diff --git a/lib/ui/src/components/sidebar/__snapshots__/SidebarItem.stories.storyshot b/lib/ui/src/components/sidebar/__snapshots__/SidebarItem.stories.storyshot
deleted file mode 100644
index 5b2eb1e924d..00000000000
--- a/lib/ui/src/components/sidebar/__snapshots__/SidebarItem.stories.storyshot
+++ /dev/null
@@ -1,757 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Storyshots UI|Sidebar/SidebarItem component 1`] = `
-.emotion-1 {
-  fill: currentColor;
-}
-
-.emotion-3 {
-  margin-left: -20px;
-  margin-right: -20px;
-  min-height: 24px;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  padding-left: 10px;
-  cursor: pointer;
-}
-
-.emotion-3:hover {
-  background: rgba(0,0,0,.05);
-}
-
-.emotion-0 {
-  display: block;
-  width: 0;
-  height: 0;
-  margin-right: 4px;
-  border-top: 3.5px solid transparent;
-  border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid #999999;
-  -webkit-transition: -webkit-transform .1s ease-out;
-  -webkit-transition: transform .1s ease-out;
-  transition: transform .1s ease-out;
-}
-
-.emotion-2 {
-  display: block;
-  width: 10px;
-  height: 10px;
-  margin-right: 6px;
-  color: #1ea7fd;
-}
-
-<div
-  style="width:240px;padding:20px;background:#eee"
->
-  <div
-    class="emotion-3"
-  >
-    <span
-      class="emotion-0"
-    />
-    <svg
-      class="emotion-2"
-      height="20px"
-      viewBox="0 0 1024 1024"
-      width="20px"
-    >
-      <path
-        class="emotion-1"
-        d="M171 469h298V171H246c-42 0-75 33-75 75v223zm0 86v223c0 42 33 75 75 75h223V555H171zm682-86V246c0-42-33-75-75-75H555v298h298zm0 86H555v298h223c42 0 75-33 75-75V555zM256 85h512c94 0 171 77 171 171v512c0 94-77 171-171 171H256c-94 0-171-77-171-171V256c0-94 77-171 171-171z"
-      />
-    </svg>
-    <span>
-      Component
-    </span>
-  </div>
-</div>
-`;
-
-exports[`Storyshots UI|Sidebar/SidebarItem component isExpanded 1`] = `
-.emotion-1 {
-  fill: currentColor;
-}
-
-.emotion-3 {
-  margin-left: -20px;
-  margin-right: -20px;
-  min-height: 24px;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  padding-left: 10px;
-  cursor: pointer;
-}
-
-.emotion-3:hover {
-  background: rgba(0,0,0,.05);
-}
-
-.emotion-2 {
-  display: block;
-  width: 10px;
-  height: 10px;
-  margin-right: 6px;
-  color: #1ea7fd;
-}
-
-.emotion-0 {
-  display: block;
-  width: 0;
-  height: 0;
-  margin-right: 4px;
-  border-top: 3.5px solid transparent;
-  border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid #999999;
-  -webkit-transition: -webkit-transform .1s ease-out;
-  -webkit-transition: transform .1s ease-out;
-  transition: transform .1s ease-out;
-  -webkit-transform: rotateZ(90deg);
-  -ms-transform: rotateZ(90deg);
-  transform: rotateZ(90deg);
-}
-
-<div
-  style="width:240px;padding:20px;background:#eee"
->
-  <div
-    class="emotion-3"
-  >
-    <span
-      class="emotion-0"
-    />
-    <svg
-      class="emotion-2"
-      height="20px"
-      viewBox="0 0 1024 1024"
-      width="20px"
-    >
-      <path
-        class="emotion-1"
-        d="M171 469h298V171H246c-42 0-75 33-75 75v223zm0 86v223c0 42 33 75 75 75h223V555H171zm682-86V246c0-42-33-75-75-75H555v298h298zm0 86H555v298h223c42 0 75-33 75-75V555zM256 85h512c94 0 171 77 171 171v512c0 94-77 171-171 171H256c-94 0-171-77-171-171V256c0-94 77-171 171-171z"
-      />
-    </svg>
-    <span>
-      Component
-    </span>
-  </div>
-</div>
-`;
-
-exports[`Storyshots UI|Sidebar/SidebarItem folder 1`] = `
-.emotion-1 {
-  fill: currentColor;
-}
-
-.emotion-3 {
-  margin-left: -20px;
-  margin-right: -20px;
-  min-height: 24px;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  padding-left: 10px;
-  cursor: pointer;
-}
-
-.emotion-3:hover {
-  background: rgba(0,0,0,.05);
-}
-
-.emotion-0 {
-  display: block;
-  width: 0;
-  height: 0;
-  margin-right: 4px;
-  border-top: 3.5px solid transparent;
-  border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid #999999;
-  -webkit-transition: -webkit-transform .1s ease-out;
-  -webkit-transition: transform .1s ease-out;
-  transition: transform .1s ease-out;
-}
-
-.emotion-2 {
-  display: block;
-  width: 10px;
-  height: 10px;
-  margin-right: 6px;
-  color: #774dd7;
-}
-
-<div
-  style="width:240px;padding:20px;background:#eee"
->
-  <div
-    class="emotion-3"
-  >
-    <span
-      class="emotion-0"
-    />
-    <svg
-      class="emotion-2"
-      height="20px"
-      viewBox="0 0 1024 1024"
-      width="20px"
-    >
-      <path
-        class="emotion-1"
-        d="M571 274h327c23 0 41 18 41 41v488c0 22-18 40-41 40H126c-23 0-41-18-41-40V242c0-34 27-61 61-61h317c18 0 35 7 47 21l61 72zm-119-8H170v492h684V359H531l-79-93z"
-      />
-    </svg>
-    <span>
-      Folder
-    </span>
-  </div>
-</div>
-`;
-
-exports[`Storyshots UI|Sidebar/SidebarItem loading 1`] = `
-@keyframes animation-0 {
-  0%, 100% {
-    opacity: 1;
-  }
-
-  50% {
-    opacity: .4;
-  }
-}
-
-.emotion-1 {
-  fill: currentColor;
-}
-
-.emotion-0 {
-  display: block;
-  width: 0;
-  height: 0;
-  margin-right: 4px;
-  border-top: 3.5px solid transparent;
-  border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid #999999;
-  -webkit-transition: -webkit-transform .1s ease-out;
-  -webkit-transition: transform .1s ease-out;
-  transition: transform .1s ease-out;
-  border-left-color: transparent;
-}
-
-.emotion-2 {
-  display: block;
-  width: 10px;
-  height: 10px;
-  margin-right: 6px;
-  color: #37d5d3;
-}
-
-.emotion-3 {
-  margin-left: -20px;
-  margin-right: -20px;
-  min-height: 24px;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  padding-left: 10px;
-}
-
-.emotion-3.emotion-3 > * {
-  -webkit-animation: animation-0 1.5s ease-in-out infinite;
-  animation: animation-0 1.5s ease-in-out infinite;
-  background: rgba(0,0,0,.05);
-  color: transparent;
-  cursor: progress;
-}
-
-<div
-  style="width:240px;padding:20px;background:#eee"
->
-  <div
-    class="emotion-3"
-  >
-    <span
-      class="emotion-0"
-    />
-    <svg
-      class="emotion-2"
-      height="20px"
-      viewBox="0 0 1024 1024"
-      width="20px"
-    >
-      <path
-        class="emotion-1"
-        d="M772 1012L511 761l-260 251a49 49 0 0 1-52 10c-18-7-29-24-29-43V132c0-25 21-46 47-46h588c26 0 47 21 47 46v847c0 19-11 36-29 43a49 49 0 0 1-51-10zM545 664l213 205V181H265v688l213-205c9-9 21-14 33-14s24 5 34 14z"
-      />
-    </svg>
-    <span>
-      TODO Loading
-    </span>
-  </div>
-</div>
-`;
-
-exports[`Storyshots UI|Sidebar/SidebarItem nested depths 1`] = `
-.emotion-1 {
-  fill: currentColor;
-}
-
-.emotion-3 {
-  margin-left: -20px;
-  margin-right: -20px;
-  min-height: 24px;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  padding-left: 10px;
-  cursor: pointer;
-}
-
-.emotion-3:hover {
-  background: rgba(0,0,0,.05);
-}
-
-.emotion-4 {
-  display: block;
-  width: 0;
-  height: 0;
-  margin-right: 4px;
-  border-top: 3.5px solid transparent;
-  border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid #999999;
-  -webkit-transition: -webkit-transform .1s ease-out;
-  -webkit-transition: transform .1s ease-out;
-  transition: transform .1s ease-out;
-}
-
-.emotion-2 {
-  display: block;
-  width: 10px;
-  height: 10px;
-  margin-right: 6px;
-  color: #774dd7;
-}
-
-.emotion-8 {
-  display: block;
-  width: 0;
-  height: 0;
-  margin-right: 4px;
-  border-top: 3.5px solid transparent;
-  border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid #999999;
-  -webkit-transition: -webkit-transform .1s ease-out;
-  -webkit-transition: transform .1s ease-out;
-  transition: transform .1s ease-out;
-  -webkit-transform: rotateZ(90deg);
-  -ms-transform: rotateZ(90deg);
-  transform: rotateZ(90deg);
-}
-
-.emotion-0 {
-  display: block;
-  width: 0;
-  height: 0;
-  margin-right: 4px;
-  border-top: 3.5px solid transparent;
-  border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid #999999;
-  -webkit-transition: -webkit-transform .1s ease-out;
-  -webkit-transition: transform .1s ease-out;
-  transition: transform .1s ease-out;
-  border-left-color: transparent;
-}
-
-.emotion-15 {
-  margin-left: -20px;
-  margin-right: -20px;
-  min-height: 24px;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  padding-left: 25px;
-  cursor: pointer;
-}
-
-.emotion-15:hover {
-  background: rgba(0,0,0,.05);
-}
-
-.emotion-19 {
-  margin-left: -20px;
-  margin-right: -20px;
-  min-height: 24px;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  padding-left: 40px;
-  cursor: pointer;
-}
-
-.emotion-19:hover {
-  background: rgba(0,0,0,.05);
-}
-
-.emotion-23 {
-  margin-left: -20px;
-  margin-right: -20px;
-  min-height: 24px;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  padding-left: 55px;
-  cursor: pointer;
-}
-
-.emotion-23:hover {
-  background: rgba(0,0,0,.05);
-}
-
-<div
-  style="width:240px;padding:20px;background:#eee"
->
-  <div>
-    <div
-      class="emotion-3"
-    >
-      <span
-        class="emotion-0"
-      />
-      <svg
-        class="emotion-2"
-        height="20px"
-        viewBox="0 0 1024 1024"
-        width="20px"
-      >
-        <path
-          class="emotion-1"
-          d="M571 274h327c23 0 41 18 41 41v488c0 22-18 40-41 40H126c-23 0-41-18-41-40V242c0-34 27-61 61-61h317c18 0 35 7 47 21l61 72zm-119-8H170v492h684V359H531l-79-93z"
-        />
-      </svg>
-      <span>
-        Depth 0
-      </span>
-    </div>
-    <div
-      class="emotion-3"
-    >
-      <span
-        class="emotion-4"
-      />
-      <svg
-        class="emotion-2"
-        height="20px"
-        viewBox="0 0 1024 1024"
-        width="20px"
-      >
-        <path
-          class="emotion-1"
-          d="M571 274h327c23 0 41 18 41 41v488c0 22-18 40-41 40H126c-23 0-41-18-41-40V242c0-34 27-61 61-61h317c18 0 35 7 47 21l61 72zm-119-8H170v492h684V359H531l-79-93z"
-        />
-      </svg>
-      <span>
-        Depth 0
-      </span>
-    </div>
-    <div
-      class="emotion-3"
-    >
-      <span
-        class="emotion-8"
-      />
-      <svg
-        class="emotion-2"
-        height="20px"
-        viewBox="0 0 1024 1024"
-        width="20px"
-      >
-        <path
-          class="emotion-1"
-          d="M571 274h327c23 0 41 18 41 41v488c0 22-18 40-41 40H126c-23 0-41-18-41-40V242c0-34 27-61 61-61h317c18 0 35 7 47 21l61 72zm-119-8H170v492h684V359H531l-79-93z"
-        />
-      </svg>
-      <span>
-        Depth 0
-      </span>
-    </div>
-    <div
-      class="emotion-15"
-    >
-      <span
-        class="emotion-4"
-      />
-      <svg
-        class="emotion-2"
-        height="20px"
-        viewBox="0 0 1024 1024"
-        width="20px"
-      >
-        <path
-          class="emotion-1"
-          d="M571 274h327c23 0 41 18 41 41v488c0 22-18 40-41 40H126c-23 0-41-18-41-40V242c0-34 27-61 61-61h317c18 0 35 7 47 21l61 72zm-119-8H170v492h684V359H531l-79-93z"
-        />
-      </svg>
-      <span>
-        Depth 1
-      </span>
-    </div>
-    <div
-      class="emotion-19"
-    >
-      <span
-        class="emotion-4"
-      />
-      <svg
-        class="emotion-2"
-        height="20px"
-        viewBox="0 0 1024 1024"
-        width="20px"
-      >
-        <path
-          class="emotion-1"
-          d="M571 274h327c23 0 41 18 41 41v488c0 22-18 40-41 40H126c-23 0-41-18-41-40V242c0-34 27-61 61-61h317c18 0 35 7 47 21l61 72zm-119-8H170v492h684V359H531l-79-93z"
-        />
-      </svg>
-      <span>
-        Depth 2
-      </span>
-    </div>
-    <div
-      class="emotion-23"
-    >
-      <span
-        class="emotion-4"
-      />
-      <svg
-        class="emotion-2"
-        height="20px"
-        viewBox="0 0 1024 1024"
-        width="20px"
-      >
-        <path
-          class="emotion-1"
-          d="M571 274h327c23 0 41 18 41 41v488c0 22-18 40-41 40H126c-23 0-41-18-41-40V242c0-34 27-61 61-61h317c18 0 35 7 47 21l61 72zm-119-8H170v492h684V359H531l-79-93z"
-        />
-      </svg>
-      <span>
-        Depth 3
-      </span>
-    </div>
-  </div>
-</div>
-`;
-
-exports[`Storyshots UI|Sidebar/SidebarItem story 1`] = `
-.emotion-1 {
-  fill: currentColor;
-}
-
-.emotion-3 {
-  margin-left: -20px;
-  margin-right: -20px;
-  min-height: 24px;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  padding-left: 10px;
-  cursor: pointer;
-}
-
-.emotion-3:hover {
-  background: rgba(0,0,0,.05);
-}
-
-.emotion-0 {
-  display: block;
-  width: 0;
-  height: 0;
-  margin-right: 4px;
-  border-top: 3.5px solid transparent;
-  border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid #999999;
-  -webkit-transition: -webkit-transform .1s ease-out;
-  -webkit-transition: transform .1s ease-out;
-  transition: transform .1s ease-out;
-  border-left-color: transparent;
-}
-
-.emotion-2 {
-  display: block;
-  width: 10px;
-  height: 10px;
-  margin-right: 6px;
-  color: #37d5d3;
-}
-
-<div
-  style="width:240px;padding:20px;background:#eee"
->
-  <div
-    class="emotion-3"
-  >
-    <span
-      class="emotion-0"
-    />
-    <svg
-      class="emotion-2"
-      height="20px"
-      viewBox="0 0 1024 1024"
-      width="20px"
-    >
-      <path
-        class="emotion-1"
-        d="M772 1012L511 761l-260 251a49 49 0 0 1-52 10c-18-7-29-24-29-43V132c0-25 21-46 47-46h588c26 0 47 21 47 46v847c0 19-11 36-29 43a49 49 0 0 1-51-10zM545 664l213 205V181H265v688l213-205c9-9 21-14 33-14s24 5 34 14z"
-      />
-    </svg>
-    <span>
-      Story
-    </span>
-  </div>
-</div>
-`;
-
-exports[`Storyshots UI|Sidebar/SidebarItem story isSelected 1`] = `
-.emotion-1 {
-  fill: currentColor;
-}
-
-.emotion-0 {
-  display: block;
-  width: 0;
-  height: 0;
-  margin-right: 4px;
-  border-top: 3.5px solid transparent;
-  border-bottom: 3.5px solid transparent;
-  border-left: 3.5px solid #999999;
-  -webkit-transition: -webkit-transform .1s ease-out;
-  -webkit-transition: transform .1s ease-out;
-  transition: transform .1s ease-out;
-  border-left-color: transparent;
-}
-
-.emotion-3 {
-  margin-left: -20px;
-  margin-right: -20px;
-  min-height: 24px;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  padding-left: 10px;
-  cursor: default;
-  background: #1EA7FD;
-  color: #FFFFFF;
-}
-
-.emotion-2 {
-  display: block;
-  width: 10px;
-  height: 10px;
-  margin-right: 6px;
-  color: #37d5d3;
-  color: inherit;
-}
-
-<div
-  style="width:240px;padding:20px;background:#eee"
->
-  <div
-    class="emotion-3"
-  >
-    <span
-      class="emotion-0"
-    />
-    <svg
-      class="emotion-2"
-      height="20px"
-      viewBox="0 0 1024 1024"
-      width="20px"
-    >
-      <path
-        class="emotion-1"
-        d="M772 1012L511 761l-260 251a49 49 0 0 1-52 10c-18-7-29-24-29-43V132c0-25 21-46 47-46h588c26 0 47 21 47 46v847c0 19-11 36-29 43a49 49 0 0 1-51-10zM545 664l213 205V181H265v688l213-205c9-9 21-14 33-14s24 5 34 14z"
-      />
-    </svg>
-    <span>
-      Story
-    </span>
-  </div>
-</div>
-`;
diff --git a/lib/ui/src/components/sidebar/__snapshots__/SidebarSearch.stories.storyshot b/lib/ui/src/components/sidebar/__snapshots__/SidebarSearch.stories.storyshot
deleted file mode 100644
index 90e5974f7c2..00000000000
--- a/lib/ui/src/components/sidebar/__snapshots__/SidebarSearch.stories.storyshot
+++ /dev/null
@@ -1,9 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Storyshots UI|Sidebar/SidebarSearch default 1`] = `
-<span
-  class="emotion-0"
->
-  TODO SidebarSearch
-</span>
-`;
diff --git a/lib/ui/src/components/sidebar/__snapshots__/nav.stories.storyshot b/lib/ui/src/components/sidebar/__snapshots__/nav.stories.storyshot
deleted file mode 100644
index c984b4febb5..00000000000
--- a/lib/ui/src/components/sidebar/__snapshots__/nav.stories.storyshot
+++ /dev/null
@@ -1,2040 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Storyshots UI|Nav default 1`] = `
-.emotion-4 {
-  display: block;
-}
-
-.emotion-3 {
-  fill: currentColor;
-}
-
-.emotion-8 {
-  font-size: 11px;
-  display: block;
-  text-align: center;
-  text-transform: uppercase;
-  margin: 0;
-  padding: 20px;
-}
-
-.emotion-13 {
-  background: transparent;
-  position: absolute;
-  z-index: 1;
-  left: 0;
-  top: 0;
-  bottom: 0;
-  right: 0;
-  width: 100%;
-  height: 100%;
-  box-sizing: border-box;
-}
-
-.emotion-11 {
-  position: absolute;
-  z-index: 1;
-  left: 0;
-  top: 0;
-  bottom: 0;
-  right: 0;
-  width: 100%;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  -webkit-box-pack: justify;
-  -webkit-justify-content: space-between;
-  -ms-flex-pack: justify;
-  justify-content: space-between;
-  -webkit-align-items: stretch;
-  -webkit-box-align: stretch;
-  -ms-flex-align: stretch;
-  align-items: stretch;
-  padding: 20px;
-  overflow: auto;
-  min-height: 100%;
-  box-sizing: border-box;
-}
-
-.emotion-9 > * {
-  margin-top: 20px;
-}
-
-.emotion-9 > *:first-child {
-  margin-top: 0;
-}
-
-.emotion-7 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-}
-
-.emotion-2 {
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  margin-right: 30px;
-}
-
-.emotion-1 {
-  display: inline-block;
-  color: inherit;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-}
-
-.emotion-0 {
-  width: 101px;
-  height: 20px;
-}
-
-.emotion-5 {
-  height: 28px;
-  width: 28px;
-  border: 1px solid #eee;
-  position: relative;
-  border-radius: 14px;
-  box-sizing: border-box;
-  background: transparent;
-  cursor: pointer;
-}
-
-.popup-content + .emotion-5,
-.emotion-5:focus {
-  border: 1px solid #00aaff;
-  outline: 0 none;
-  box-shadow: 0 1px 5px 0 rgba(0,0,0,0.1);
-}
-
-.emotion-5 > * {
-  position: absolute;
-  top: 5px;
-  left: 5px;
-  width: calc(100% - 10px);
-  height: calc(100% - 10px);
-}
-
-.emotion-12 {
-  position: absolute;
-  display: block;
-  bottom: 0;
-  margin: 0;
-  padding: 0;
-  width: 100%;
-  z-index: 2;
-}
-
-<nav
-  class="emotion-13"
->
-  <div
-    class="emotion-11"
-  >
-    <div
-      class="emotion-9"
-    >
-      <div
-        class="emotion-7"
-      >
-        <div
-          class="emotion-2"
-        >
-          <a
-            class="emotion-1"
-            href="./"
-          >
-            <svg
-              class="emotion-0"
-              height="40px"
-              title="Storybook"
-              viewBox="0 0 200 40"
-              width="200px"
-            >
-              <defs>
-                <path
-                  d="M1.2 36.9L0 3.9c0-1.1.8-2 1.9-2.1l28-1.8a2 2 0 0 1 2.2 1.9 2 2 0 0 1 0 .1v36a2 2 0 0 1-2 2 2 2 0 0 1-.1 0L3.2 38.8a2 2 0 0 1-2-2z"
-                  id="a"
-                />
-              </defs>
-              <g
-                fill="none"
-                fill-rule="evenodd"
-              >
-                <path
-                  d="M53.3 31.7c-1.7 0-3.4-.3-5-.7-1.5-.5-2.8-1.1-3.9-2l1.6-3.5c2.2 1.5 4.6 2.3 7.3 2.3 1.5 0 2.5-.2 3.3-.7.7-.5 1.1-1 1.1-1.9 0-.7-.3-1.3-1-1.7s-2-.8-3.7-1.2c-2-.4-3.6-.9-4.8-1.5-1.1-.5-2-1.2-2.6-2-.5-1-.8-2-.8-3.2 0-1.4.4-2.6 1.2-3.6.7-1.1 1.8-2 3.2-2.6 1.3-.6 2.9-.9 4.7-.9 1.6 0 3.1.3 4.6.7 1.5.5 2.7 1.1 3.5 2l-1.6 3.5c-2-1.5-4.2-2.3-6.5-2.3-1.3 0-2.3.2-3 .8-.8.5-1.2 1.1-1.2 2 0 .5.2 1 .5 1.3.2.3.7.6 1.4.9l2.9.8c2.9.6 5 1.4 6.2 2.4a5 5 0 0 1 2 4.2 6 6 0 0 1-2.5 5c-1.7 1.2-4 1.9-7 1.9zm21-3.6l1.4-.1-.2 3.5-1.9.1c-2.4 0-4.1-.5-5.2-1.5-1.1-1-1.6-2.7-1.6-4.8v-6h-3v-3.6h3V11h4.8v4.6h4v3.6h-4v6c0 1.8.9 2.8 2.6 2.8zm11.1 3.5c-1.6 0-3-.3-4.3-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.3-1 1.7 0 3.2.3 4.4 1a7 7 0 0 1 3 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.4 1zm0-3.6c2.4 0 3.6-1.6 3.6-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.6-1c-2.3 0-3.5 1.4-3.5 4.4 0 3 1.2 4.6 3.5 4.6zm21.7-8.8l-2.7.3c-1.3.2-2.3.5-2.8 1.2-.6.6-.9 1.4-.9 2.5v8.2H96V15.7h4.6v2.6c.8-1.8 2.5-2.8 5-3h1.3l.3 4zm14-3.5h4.8L116.4 37h-4.9l3-6.6-6.4-14.8h5l4 10 4-10zm16-.4c1.4 0 2.6.3 3.6 1 1 .6 1.9 1.6 2.5 2.8.6 1.2.9 2.7.9 4.3 0 1.6-.3 3-1 4.3a6.9 6.9 0 0 1-2.4 2.9c-1 .7-2.2 1-3.6 1-1 0-2-.2-3-.7-.8-.4-1.5-1-2-1.9v2.4h-4.7V8.8h4.8v9c.5-.8 1.2-1.4 2-1.9.9-.4 1.8-.6 3-.6zM135.7 28c1.1 0 2-.4 2.6-1.2.6-.8 1-2 1-3.4 0-1.5-.4-2.5-1-3.3s-1.5-1.1-2.6-1.1-2 .3-2.6 1.1c-.6.8-1 2-1 3.3 0 1.5.4 2.6 1 3.4.6.8 1.5 1.2 2.6 1.2zm18.9 3.6c-1.7 0-3.2-.3-4.4-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.4-1 1.6 0 3 .3 4.3 1a7 7 0 0 1 3 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.3 1zm0-3.6c2.3 0 3.5-1.6 3.5-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.5-1c-2.4 0-3.6 1.4-3.6 4.4 0 3 1.2 4.6 3.6 4.6zm18 3.6c-1.7 0-3.2-.3-4.4-1a7 7 0 0 1-3-2.8c-.6-1.3-1-2.7-1-4.4 0-1.6.4-3 1-4.3a7 7 0 0 1 3-2.8c1.2-.7 2.7-1 4.4-1 1.6 0 3 .3 4.4 1a7 7 0 0 1 2.9 2.8c.6 1.2 1 2.7 1 4.3 0 1.7-.4 3.1-1 4.4a7 7 0 0 1-3 2.8c-1.2.7-2.7 1-4.3 1zm0-3.6c2.3 0 3.5-1.6 3.5-4.6 0-1.5-.3-2.6-1-3.4a3.2 3.2 0 0 0-2.5-1c-2.4 0-3.6 1.4-3.6 4.4 0 3 1.2 4.6 3.6 4.6zm27.4 3.4h-6l-6-7v7h-4.8V8.8h4.9v13.6l5.8-6.7h5.7l-6.6 7.5 7 8.2z"
-                  fill="#333"
-                />
-                <mask
-                  fill="#fff"
-                  id="b"
-                >
-                  <use
-                    href="#a"
-                  />
-                </mask>
-                <use
-                  fill="#FF4785"
-                  fill-rule="nonzero"
-                  href="#a"
-                />
-                <path
-                  d="M23.7 5L24 .2l3.9-.3.1 4.8a.3.3 0 0 1-.5.2L26 3.8l-1.7 1.4a.3.3 0 0 1-.5-.3zm-5 10c0 .9 5.3.5 6 0 0-5.4-2.8-8.2-8-8.2-5.3 0-8.2 2.8-8.2 7.1 0 7.4 10 7.6 10 11.6 0 1.2-.5 1.9-1.8 1.9-1.6 0-2.2-.9-2.1-3.6 0-.6-6.1-.8-6.3 0-.5 6.7 3.7 8.6 8.5 8.6 4.6 0 8.3-2.5 8.3-7 0-7.9-10.2-7.7-10.2-11.6 0-1.6 1.2-1.8 2-1.8.6 0 2 0 1.9 3z"
-                  fill="#FFF"
-                  fill-rule="nonzero"
-                  mask="url(#b)"
-                />
-              </g>
-            </svg>
-          </a>
-        </div>
-        <span
-          class="emotion-6"
-        >
-          <button
-            class="emotion-5"
-            id="storybook-explorer-menu"
-          >
-            <svg
-              class="emotion-4"
-              height="20px"
-              viewBox="0 0 1024 1024"
-              width="20px"
-            >
-              <path
-                class="emotion-3"
-                d="M184 393c66.274 0 120 53.73 120 120s-53.726 120-120 120c-66.286 0-120-53.73-120-120s53.714-120 120-120zM512 393c66.272 0 120 53.73 120 120s-53.728 120-120 120c-66.286 0-120-53.73-120-120s53.714-120 120-120zM840 393c66.272 0 120 53.73 120 120s-53.728 120-120 120c-66.286 0-120-53.73-120-120s53.714-120 120-120z"
-              />
-            </svg>
-          </button>
-        </span>
-      </div>
-      <p
-        class="emotion-8"
-      >
-        There have no stories been loaded yet
-      </p>
-    </div>
-    <div
-      class="emotion-6"
-    />
-  </div>
-  <div
-    class="emotion-12"
-  />
-</nav>
-`;
-
-exports[`Storyshots UI|Nav with custom brand 1`] = `
-.emotion-2 {
-  display: block;
-}
-
-.emotion-1 {
-  fill: currentColor;
-}
-
-.emotion-6 {
-  font-size: 11px;
-  display: block;
-  text-align: center;
-  text-transform: uppercase;
-  margin: 0;
-  padding: 20px;
-}
-
-.emotion-11 {
-  background: transparent;
-  position: absolute;
-  z-index: 1;
-  left: 0;
-  top: 0;
-  bottom: 0;
-  right: 0;
-  width: 100%;
-  height: 100%;
-  box-sizing: border-box;
-}
-
-.emotion-9 {
-  position: absolute;
-  z-index: 1;
-  left: 0;
-  top: 0;
-  bottom: 0;
-  right: 0;
-  width: 100%;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex-direction: column;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  -webkit-box-pack: justify;
-  -webkit-justify-content: space-between;
-  -ms-flex-pack: justify;
-  justify-content: space-between;
-  -webkit-align-items: stretch;
-  -webkit-box-align: stretch;
-  -ms-flex-align: stretch;
-  align-items: stretch;
-  padding: 20px;
-  overflow: auto;
-  min-height: 100%;
-  box-sizing: border-box;
-}
-
-.emotion-7 > * {
-  margin-top: 20px;
-}
-
-.emotion-7 > *:first-child {
-  margin-top: 0;
-}
-
-.emotion-5 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-}
-
-.emotion-0 {
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  margin-right: 30px;
-}
-
-.emotion-3 {
-  height: 28px;
-  width: 28px;
-  border: 1px solid #eee;
-  position: relative;
-  border-radius: 14px;
-  box-sizing: border-box;
-  background: transparent;
-  cursor: pointer;
-}
-
-.popup-content + .emotion-3,
-.emotion-3:focus {
-  border: 1px solid #00aaff;
-  outline: 0 none;
-  box-shadow: 0 1px 5px 0 rgba(0,0,0,0.1);
-}
-
-.emotion-3 > * {
-  position: absolute;
-  top: 5px;
-  left: 5px;
-  width: calc(100% - 10px);
-  height: calc(100% - 10px);
-}
-
-.emotion-10 {
-  position: absolute;
-  display: block;
-  bottom: 0;
-  margin: 0;
-  padding: 0;
-  width: 100%;
-  z-index: 2;
-}
-
-<nav
-  class="emotion-11"
->
-  <div
-    class="emotion-9"
-  >
-    <div
-      class="emotion-7"
-    >
-      <div
-        class="emotion-5"
-      >
-        <div
-          class="emotion-0"
-        >
-          custom brand
-        </div>
-        <span
-          class="emotion-4"
-        >
-          <button
-            class="emotion-3"
-            id="storybook-explorer-menu"
-          >
-            <svg
-              class="emotion-2"
-              height="20px"
-              viewBox="0 0 1024 1024"
-              width="20px"
-            >
-              <path
-                class="emotion-1"
-                d="M184 393c66.274 0 120 53.73 120 120s-53.726 120-120 120c-66.286 0-120-53.73-120-120s53.714-120 120-120zM512 393c66.272 0 120 53.73 120 120s-53.728 120-120 120c-66.286 0-120-53.73-120-120s53.714-120 120-120zM840 393c66.272 0 120 53.73 120 120s-53.728 120-120 120c-66.286 0-120-53.73-120-120s53.714-120 120-120z"
-              />
-            </svg>
-          </button>
-        </span>
-      </div>
-      <p
-        class="emotion-6"
-      >
-        There have no stories been loaded yet
-      </p>
-    </div>
-    <div
-      class="emotion-4"
-    />
-  </div>
-  <div
-    class="emotion-10"
-  />
-</nav>
-`;
-
-exports[`Storyshots UI|StoriesExplorer empty 1`] = `
-.emotion-0 {
-  font-size: 11px;
-  display: block;
-  text-align: center;
-  text-transform: uppercase;
-  margin: 0;
-  padding: 20px;
-}
-
-.emotion-1 > * {
-  margin-top: 10px;
-}
-
-.emotion-1 > *:first-child {
-  margin-top: 0;
-}
-
-<div
-  class="emotion-1"
->
-  <p
-    class="emotion-0"
-  >
-    There have no stories been loaded yet
-  </p>
-</div>
-`;
-
-exports[`Storyshots UI|StoriesExplorer with treeview root 1`] = `
-.emotion-4 {
-  fill: currentColor;
-}
-
-.emotion-38 > * {
-  margin-top: 10px;
-}
-
-.emotion-38 > *:first-child {
-  margin-top: 0;
-}
-
-.emotion-1 {
-  border-bottom: 1px solid transparent;
-  border-bottom-color: rgba(0,0,0,0.1);
-  outline: 0;
-}
-
-.emotion-0 {
-  height: 30px;
-  box-sizing: border-box;
-  width: 100%;
-  background: transparent;
-  border: 0 none;
-  color: #444;
-  padding: 10px;
-  padding-left: 0;
-  outline: 0;
-}
-
-.emotion-3 {
-  margin-bottom: 10px;
-}
-
-.emotion-2 {
-  color: currentColor;
-  font-weight: normal;
-  font-family: "Nunito Sans",-apple-system,".SFNSText-Regular","San Francisco",BlinkMacSystemFont,"Segoe UI","Helvetica Neue",Helvetica,Arial,sans-serif;
-  margin: 0;
-  padding: 0;
-  line-height: 1.2em;
-  display: block;
-  color: rgba(0,0,0,0.4);
-  -webkit-letter-spacing: 4.3px;
-  -moz-letter-spacing: 4.3px;
-  -ms-letter-spacing: 4.3px;
-  letter-spacing: 4.3px;
-  font-weight: 400;
-  font-size: 10px;
-  text-transform: uppercase;
-}
-
-.emotion-2 > sub {
-  display: block;
-  padding-top: 5px;
-  line-height: 1.2em;
-  font-size: 14px;
-}
-
-.emotion-9 {
-  color: inherit;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  display: block;
-}
-
-.emotion-8 {
-  margin-left: -20px;
-  margin-right: -20px;
-  min-height: 24px;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  padding-left: 10px;
-  background: transparent;
-}
-
-.emotion-8:hover {
-  background: #EAF3FC;
-}
-
-.emotion-5 {
-  display: block;
-  display: inline-block;
-  width: 8px;
-  height: 8px;
-  margin: 1px;
-  margin-right: 4px;
-  margin-left: -2px;
-  -webkit-transition: -webkit-transform .1s linear;
-  -webkit-transition: transform .1s linear;
-  transition: transform .1s linear;
-  color: rgba(0,0,0,0.4);
-  -webkit-transform: rotateZ(90deg);
-  -ms-transform: rotateZ(90deg);
-  transform: rotateZ(90deg);
-}
-
-.emotion-7 {
-  display: block;
-  display: inline-block;
-  width: 10px;
-  height: 10px;
-  margin-right: 10px;
-  color: #774dd7;
-}
-
-.emotion-12 {
-  margin-left: -20px;
-  margin-right: -20px;
-  min-height: 24px;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding-left: 30px;
-  background: #1EA7FD;
-  color: #FFFFFF;
-}
-
-.emotion-11 {
-  display: block;
-  display: inline-block;
-  width: 10px;
-  height: 10px;
-  margin-right: 10px;
-  color: #37d5d3;
-  color: inherit;
-}
-
-.emotion-16 {
-  margin-left: -20px;
-  margin-right: -20px;
-  min-height: 24px;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding-left: 30px;
-  background: transparent;
-}
-
-.emotion-16:hover {
-  background: #EAF3FC;
-}
-
-.emotion-15 {
-  display: block;
-  display: inline-block;
-  width: 10px;
-  height: 10px;
-  margin-right: 10px;
-  color: #37d5d3;
-}
-
-.emotion-23 {
-  display: block;
-  display: inline-block;
-  width: 8px;
-  height: 8px;
-  margin: 1px;
-  margin-right: 4px;
-  margin-left: -2px;
-  -webkit-transition: -webkit-transform .1s linear;
-  -webkit-transition: transform .1s linear;
-  transition: transform .1s linear;
-  color: rgba(0,0,0,0.4);
-}
-
-<div
-  class="emotion-38"
->
-  <form
-    autocomplete="off"
-    class="emotion-1"
-  >
-    <input
-      class="emotion-0"
-      id="storybook-explorer-searchfield"
-      placeholder="Press \\"/\\" to search..."
-    />
-  </form>
-  <section
-    class="emotion-18"
-  >
-    <header
-      class="emotion-3"
-    >
-      <h1
-        class="emotion-2"
-      >
-        <span>
-          Root 1
-        </span>
-      </h1>
-    </header>
-    <a
-      class="emotion-9"
-      href="/?path=/story/1-12"
-    >
-      <div
-        class="emotion-8"
-      >
-        <svg
-          class="emotion-5"
-          height="20px"
-          viewBox="0 0 1024 1024"
-          width="20px"
-        >
-          <path
-            class="emotion-4"
-            d="M878.78 477.856l-591.884-341.722c-9.464-5.464-18.426-8.050-26.386-8.048-19.516 0.002-33.002 15.546-33.002 42.338v683.446c0 26.792 13.482 42.338 33.002 42.338 7.96 0 16.924-2.586 26.386-8.048l591.884-341.722c32.664-18.864 32.664-49.724 0-68.582z"
-          />
-        </svg>
-        <svg
-          class="emotion-7"
-          height="20px"
-          viewBox="0 0 1024 1024"
-          width="20px"
-        >
-          <path
-            class="emotion-4"
-            d="M571 274h327c23 0 41 18 41 41v488c0 22-18 40-41 40H126c-23 0-41-18-41-40V242c0-34 27-61 61-61h317c18 0 35 7 47 21l61 72zm-119-8H170v492h684V359H531l-79-93z"
-          />
-        </svg>
-        <span>
-          Child A2
-        </span>
-      </div>
-    </a>
-    <div
-      class="emotion-18"
-    >
-      <a
-        class="emotion-9"
-        href="/?path=/story/1-12-121"
-      >
-        <div
-          class="emotion-12"
-          id="1-12-121"
-        >
-          <svg
-            class="emotion-11"
-            height="20px"
-            viewBox="0 0 1024 1024"
-            width="20px"
-          >
-            <path
-              class="emotion-4"
-              d="M772 1012L511 761l-260 251a49 49 0 0 1-52 10c-18-7-29-24-29-43V132c0-25 21-46 47-46h588c26 0 47 21 47 46v847c0 19-11 36-29 43a49 49 0 0 1-51-10zM545 664l213 205V181H265v688l213-205c9-9 21-14 33-14s24 5 34 14z"
-            />
-          </svg>
-          GrandChild A1.1
-        </div>
-      </a>
-      <a
-        class="emotion-9"
-        href="/?path=/story/1-12-122"
-      >
-        <div
-          class="emotion-16"
-          id="1-12-122"
-        >
-          <svg
-            class="emotion-15"
-            height="20px"
-            viewBox="0 0 1024 1024"
-            width="20px"
-          >
-            <path
-              class="emotion-4"
-              d="M772 1012L511 761l-260 251a49 49 0 0 1-52 10c-18-7-29-24-29-43V132c0-25 21-46 47-46h588c26 0 47 21 47 46v847c0 19-11 36-29 43a49 49 0 0 1-51-10zM545 664l213 205V181H265v688l213-205c9-9 21-14 33-14s24 5 34 14z"
-            />
-          </svg>
-          GrandChild A1.2
-        </div>
-      </a>
-    </div>
-  </section>
-  <section
-    class="emotion-18"
-  >
-    <header
-      class="emotion-3"
-    >
-      <h1
-        class="emotion-2"
-      >
-        <span>
-          Root 3
-        </span>
-      </h1>
-    </header>
-    <a
-      class="emotion-9"
-      href="/?path=/story/3-32"
-    >
-      <div
-        class="emotion-8"
-      >
-        <svg
-          class="emotion-23"
-          height="20px"
-          viewBox="0 0 1024 1024"
-          width="20px"
-        >
-          <path
-            class="emotion-4"
-            d="M878.78 477.856l-591.884-341.722c-9.464-5.464-18.426-8.050-26.386-8.048-19.516 0.002-33.002 15.546-33.002 42.338v683.446c0 26.792 13.482 42.338 33.002 42.338 7.96 0 16.924-2.586 26.386-8.048l591.884-341.722c32.664-18.864 32.664-49.724 0-68.582z"
-          />
-        </svg>
-        <svg
-          class="emotion-7"
-          height="20px"
-          viewBox="0 0 1024 1024"
-          width="20px"
-        >
-          <path
-            class="emotion-4"
-            d="M571 274h327c23 0 41 18 41 41v488c0 22-18 40-41 40H126c-23 0-41-18-41-40V242c0-34 27-61 61-61h317c18 0 35 7 47 21l61 72zm-119-8H170v492h684V359H531l-79-93z"
-          />
-        </svg>
-        <span>
-          Child A2
-        </span>
-      </div>
-    </a>
-  </section>
-  <section
-    class="emotion-18"
-  >
-    <header
-      class="emotion-3"
-    >
-      <h1
-        class="emotion-2"
-      >
-        <span>
-          Others
-        </span>
-      </h1>
-    </header>
-    <a
-      class="emotion-9"
-      href="/?path=/story/2"
-    >
-      <div
-        class="emotion-8"
-      >
-        <svg
-          class="emotion-23"
-          height="20px"
-          viewBox="0 0 1024 1024"
-          width="20px"
-        >
-          <path
-            class="emotion-4"
-            d="M878.78 477.856l-591.884-341.722c-9.464-5.464-18.426-8.050-26.386-8.048-19.516 0.002-33.002 15.546-33.002 42.338v683.446c0 26.792 13.482 42.338 33.002 42.338 7.96 0 16.924-2.586 26.386-8.048l591.884-341.722c32.664-18.864 32.664-49.724 0-68.582z"
-          />
-        </svg>
-        <svg
-          class="emotion-7"
-          height="20px"
-          viewBox="0 0 1024 1024"
-          width="20px"
-        >
-          <path
-            class="emotion-4"
-            d="M571 274h327c23 0 41 18 41 41v488c0 22-18 40-41 40H126c-23 0-41-18-41-40V242c0-34 27-61 61-61h317c18 0 35 7 47 21l61 72zm-119-8H170v492h684V359H531l-79-93z"
-          />
-        </svg>
-        <span>
-          Group 1
-        </span>
-      </div>
-    </a>
-  </section>
-</div>
-`;
-
-exports[`Storyshots UI|StoriesExplorer without treeview root 1`] = `
-.emotion-2 {
-  fill: currentColor;
-}
-
-.emotion-35 > * {
-  margin-top: 10px;
-}
-
-.emotion-35 > *:first-child {
-  margin-top: 0;
-}
-
-.emotion-1 {
-  border-bottom: 1px solid transparent;
-  border-bottom-color: rgba(0,0,0,0.1);
-  outline: 0;
-}
-
-.emotion-0 {
-  height: 30px;
-  box-sizing: border-box;
-  width: 100%;
-  background: transparent;
-  border: 0 none;
-  color: #444;
-  padding: 10px;
-  padding-left: 0;
-  outline: 0;
-}
-
-.emotion-7 {
-  color: inherit;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  display: block;
-}
-
-.emotion-6 {
-  margin-left: -20px;
-  margin-right: -20px;
-  min-height: 24px;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  padding-left: 10px;
-  background: transparent;
-}
-
-.emotion-6:hover {
-  background: #EAF3FC;
-}
-
-.emotion-3 {
-  display: block;
-  display: inline-block;
-  width: 8px;
-  height: 8px;
-  margin: 1px;
-  margin-right: 4px;
-  margin-left: -2px;
-  -webkit-transition: -webkit-transform .1s linear;
-  -webkit-transition: transform .1s linear;
-  transition: transform .1s linear;
-  color: rgba(0,0,0,0.4);
-  -webkit-transform: rotateZ(90deg);
-  -ms-transform: rotateZ(90deg);
-  transform: rotateZ(90deg);
-}
-
-.emotion-5 {
-  display: block;
-  display: inline-block;
-  width: 10px;
-  height: 10px;
-  margin-right: 10px;
-  color: #774dd7;
-}
-
-.emotion-19 {
-  display: block;
-  display: inline-block;
-  width: 10px;
-  height: 10px;
-  margin-right: 10px;
-  color: #37d5d3;
-  color: inherit;
-}
-
-.emotion-10 {
-  margin-left: -20px;
-  margin-right: -20px;
-  min-height: 24px;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding-left: 30px;
-  background: transparent;
-}
-
-.emotion-10:hover {
-  background: #EAF3FC;
-}
-
-.emotion-9 {
-  display: block;
-  display: inline-block;
-  width: 10px;
-  height: 10px;
-  margin-right: 10px;
-  color: #37d5d3;
-}
-
-.emotion-29 {
-  display: block;
-  display: inline-block;
-  width: 8px;
-  height: 8px;
-  margin: 1px;
-  margin-right: 4px;
-  margin-left: -2px;
-  -webkit-transition: -webkit-transform .1s linear;
-  -webkit-transition: transform .1s linear;
-  transition: transform .1s linear;
-  color: rgba(0,0,0,0.4);
-}
-
-.emotion-16 {
-  margin-left: -20px;
-  margin-right: -20px;
-  min-height: 24px;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  padding-left: 30px;
-  background: transparent;
-}
-
-.emotion-16:hover {
-  background: #EAF3FC;
-}
-
-.emotion-20 {
-  margin-left: -20px;
-  margin-right: -20px;
-  min-height: 24px;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding-left: 50px;
-  background: #1EA7FD;
-  color: #FFFFFF;
-}
-
-.emotion-24 {
-  margin-left: -20px;
-  margin-right: -20px;
-  min-height: 24px;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding-left: 50px;
-  background: transparent;
-}
-
-.emotion-24:hover {
-  background: #EAF3FC;
-}
-
-<div
-  class="emotion-35"
->
-  <form
-    autocomplete="off"
-    class="emotion-1"
-  >
-    <input
-      class="emotion-0"
-      id="storybook-explorer-searchfield"
-      placeholder="Press \\"/\\" to search..."
-    />
-  </form>
-  <section
-    class="emotion-26"
-  >
-    <a
-      class="emotion-7"
-      href="/?path=/story/1"
-    >
-      <div
-        class="emotion-6"
-      >
-        <svg
-          class="emotion-3"
-          height="20px"
-          viewBox="0 0 1024 1024"
-          width="20px"
-        >
-          <path
-            class="emotion-2"
-            d="M878.78 477.856l-591.884-341.722c-9.464-5.464-18.426-8.050-26.386-8.048-19.516 0.002-33.002 15.546-33.002 42.338v683.446c0 26.792 13.482 42.338 33.002 42.338 7.96 0 16.924-2.586 26.386-8.048l591.884-341.722c32.664-18.864 32.664-49.724 0-68.582z"
-          />
-        </svg>
-        <svg
-          class="emotion-5"
-          height="20px"
-          viewBox="0 0 1024 1024"
-          width="20px"
-        >
-          <path
-            class="emotion-2"
-            d="M571 274h327c23 0 41 18 41 41v488c0 22-18 40-41 40H126c-23 0-41-18-41-40V242c0-34 27-61 61-61h317c18 0 35 7 47 21l61 72zm-119-8H170v492h684V359H531l-79-93z"
-          />
-        </svg>
-        <span>
-          Parent A
-        </span>
-      </div>
-    </a>
-    <div
-      class="emotion-26"
-    >
-      <a
-        class="emotion-7"
-        href="/?path=/story/1-11"
-      >
-        <div
-          class="emotion-10"
-          id="1-11"
-        >
-          <svg
-            class="emotion-9"
-            height="20px"
-            viewBox="0 0 1024 1024"
-            width="20px"
-          >
-            <path
-              class="emotion-2"
-              d="M772 1012L511 761l-260 251a49 49 0 0 1-52 10c-18-7-29-24-29-43V132c0-25 21-46 47-46h588c26 0 47 21 47 46v847c0 19-11 36-29 43a49 49 0 0 1-51-10zM545 664l213 205V181H265v688l213-205c9-9 21-14 33-14s24 5 34 14z"
-            />
-          </svg>
-          Child A1
-        </div>
-      </a>
-      <a
-        class="emotion-7"
-        href="/?path=/story/1-12"
-      >
-        <div
-          class="emotion-16"
-        >
-          <svg
-            class="emotion-3"
-            height="20px"
-            viewBox="0 0 1024 1024"
-            width="20px"
-          >
-            <path
-              class="emotion-2"
-              d="M878.78 477.856l-591.884-341.722c-9.464-5.464-18.426-8.050-26.386-8.048-19.516 0.002-33.002 15.546-33.002 42.338v683.446c0 26.792 13.482 42.338 33.002 42.338 7.96 0 16.924-2.586 26.386-8.048l591.884-341.722c32.664-18.864 32.664-49.724 0-68.582z"
-            />
-          </svg>
-          <svg
-            class="emotion-5"
-            height="20px"
-            viewBox="0 0 1024 1024"
-            width="20px"
-          >
-            <path
-              class="emotion-2"
-              d="M571 274h327c23 0 41 18 41 41v488c0 22-18 40-41 40H126c-23 0-41-18-41-40V242c0-34 27-61 61-61h317c18 0 35 7 47 21l61 72zm-119-8H170v492h684V359H531l-79-93z"
-            />
-          </svg>
-          <span>
-            Child A2
-          </span>
-        </div>
-      </a>
-      <div
-        class="emotion-26"
-      >
-        <a
-          class="emotion-7"
-          href="/?path=/story/1-12-121"
-        >
-          <div
-            class="emotion-20"
-            id="1-12-121"
-          >
-            <svg
-              class="emotion-19"
-              height="20px"
-              viewBox="0 0 1024 1024"
-              width="20px"
-            >
-              <path
-                class="emotion-2"
-                d="M772 1012L511 761l-260 251a49 49 0 0 1-52 10c-18-7-29-24-29-43V132c0-25 21-46 47-46h588c26 0 47 21 47 46v847c0 19-11 36-29 43a49 49 0 0 1-51-10zM545 664l213 205V181H265v688l213-205c9-9 21-14 33-14s24 5 34 14z"
-              />
-            </svg>
-            GrandChild A1.1
-          </div>
-        </a>
-        <a
-          class="emotion-7"
-          href="/?path=/story/1-12-122"
-        >
-          <div
-            class="emotion-24"
-            id="1-12-122"
-          >
-            <svg
-              class="emotion-9"
-              height="20px"
-              viewBox="0 0 1024 1024"
-              width="20px"
-            >
-              <path
-                class="emotion-2"
-                d="M772 1012L511 761l-260 251a49 49 0 0 1-52 10c-18-7-29-24-29-43V132c0-25 21-46 47-46h588c26 0 47 21 47 46v847c0 19-11 36-29 43a49 49 0 0 1-51-10zM545 664l213 205V181H265v688l213-205c9-9 21-14 33-14s24 5 34 14z"
-              />
-            </svg>
-            GrandChild A1.2
-          </div>
-        </a>
-      </div>
-    </div>
-    <a
-      class="emotion-7"
-      href="/?path=/story/2"
-    >
-      <div
-        class="emotion-6"
-      >
-        <svg
-          class="emotion-29"
-          height="20px"
-          viewBox="0 0 1024 1024"
-          width="20px"
-        >
-          <path
-            class="emotion-2"
-            d="M878.78 477.856l-591.884-341.722c-9.464-5.464-18.426-8.050-26.386-8.048-19.516 0.002-33.002 15.546-33.002 42.338v683.446c0 26.792 13.482 42.338 33.002 42.338 7.96 0 16.924-2.586 26.386-8.048l591.884-341.722c32.664-18.864 32.664-49.724 0-68.582z"
-          />
-        </svg>
-        <svg
-          class="emotion-5"
-          height="20px"
-          viewBox="0 0 1024 1024"
-          width="20px"
-        >
-          <path
-            class="emotion-2"
-            d="M571 274h327c23 0 41 18 41 41v488c0 22-18 40-41 40H126c-23 0-41-18-41-40V242c0-34 27-61 61-61h317c18 0 35 7 47 21l61 72zm-119-8H170v492h684V359H531l-79-93z"
-          />
-        </svg>
-        <span>
-          Parent B
-        </span>
-      </div>
-    </a>
-  </section>
-</div>
-`;
-
-exports[`Storyshots UI|StoriesExplorer/subcomponents Filter 1`] = `
-.emotion-4 > * {
-  margin-top: 10px;
-}
-
-.emotion-4 > *:first-child {
-  margin-top: 0;
-}
-
-.emotion-1 {
-  border-bottom: 1px solid transparent;
-  border-bottom-color: rgba(0,0,0,0.1);
-  outline: 0;
-}
-
-.emotion-0 {
-  height: 30px;
-  box-sizing: border-box;
-  width: 100%;
-  background: transparent;
-  border: 0 none;
-  color: #444;
-  padding: 10px;
-  padding-left: 0;
-  outline: 0;
-}
-
-<div
-  class="emotion-4"
->
-  <form
-    autocomplete="off"
-    class="emotion-1"
-  >
-    <input
-      class="emotion-0"
-      id="storybook-explorer-searchfield"
-      placeholder="Press \\"/\\" to search..."
-    />
-  </form>
-  <hr />
-  <form
-    autocomplete="off"
-    class="emotion-1"
-  >
-    <input
-      class="emotion-0"
-      id="storybook-explorer-searchfield"
-      placeholder="Press \\"/\\" to search..."
-      value="with a value"
-    />
-  </form>
-</div>
-`;
-
-exports[`Storyshots UI|StoriesExplorer/subcomponents Head 1`] = `
-.emotion-0 {
-  fill: currentColor;
-}
-
-.emotion-40 > * {
-  margin-top: 10px;
-}
-
-.emotion-40 > *:first-child {
-  margin-top: 0;
-}
-
-.emotion-4 {
-  margin-left: -20px;
-  margin-right: -20px;
-  min-height: 24px;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  padding-left: 10px;
-  background: transparent;
-}
-
-.emotion-4:hover {
-  background: #EAF3FC;
-}
-
-.emotion-11 {
-  display: block;
-  display: inline-block;
-  width: 8px;
-  height: 8px;
-  margin: 1px;
-  margin-right: 4px;
-  margin-left: -2px;
-  -webkit-transition: -webkit-transform .1s linear;
-  -webkit-transition: transform .1s linear;
-  transition: transform .1s linear;
-  color: rgba(0,0,0,0.4);
-  -webkit-transform: rotateZ(90deg);
-  -ms-transform: rotateZ(90deg);
-  transform: rotateZ(90deg);
-}
-
-.emotion-3 {
-  display: block;
-  display: inline-block;
-  width: 10px;
-  height: 10px;
-  margin-right: 10px;
-  color: #774dd7;
-}
-
-.emotion-1 {
-  display: block;
-  display: inline-block;
-  width: 8px;
-  height: 8px;
-  margin: 1px;
-  margin-right: 4px;
-  margin-left: -2px;
-  -webkit-transition: -webkit-transform .1s linear;
-  -webkit-transition: transform .1s linear;
-  transition: transform .1s linear;
-  color: rgba(0,0,0,0.4);
-}
-
-.emotion-29 {
-  margin-left: -20px;
-  margin-right: -20px;
-  min-height: 24px;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  padding-left: 30px;
-  background: transparent;
-}
-
-.emotion-29:hover {
-  background: #EAF3FC;
-}
-
-.emotion-9 {
-  margin-left: -20px;
-  margin-right: -20px;
-  min-height: 24px;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  padding-left: 10px;
-  background: #1EA7FD;
-  color: #FFFFFF;
-}
-
-.emotion-18 {
-  display: block;
-  display: inline-block;
-  width: 10px;
-  height: 10px;
-  margin-right: 10px;
-  color: #1ea7fd;
-}
-
-.emotion-34 {
-  margin-left: -20px;
-  margin-right: -20px;
-  min-height: 24px;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  padding-left: 50px;
-  background: transparent;
-}
-
-.emotion-34:hover {
-  background: #EAF3FC;
-}
-
-.emotion-39 {
-  margin-left: -20px;
-  margin-right: -20px;
-  min-height: 24px;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  padding-left: 70px;
-  background: transparent;
-}
-
-.emotion-39:hover {
-  background: #EAF3FC;
-}
-
-<div
-  class="emotion-40"
->
-  <div
-    class="emotion-4"
-  >
-    <svg
-      class="emotion-1"
-      height="20px"
-      viewBox="0 0 1024 1024"
-      width="20px"
-    >
-      <path
-        class="emotion-0"
-        d="M878.78 477.856l-591.884-341.722c-9.464-5.464-18.426-8.050-26.386-8.048-19.516 0.002-33.002 15.546-33.002 42.338v683.446c0 26.792 13.482 42.338 33.002 42.338 7.96 0 16.924-2.586 26.386-8.048l591.884-341.722c32.664-18.864 32.664-49.724 0-68.582z"
-      />
-    </svg>
-    <svg
-      class="emotion-3"
-      height="20px"
-      viewBox="0 0 1024 1024"
-      width="20px"
-    >
-      <path
-        class="emotion-0"
-        d="M571 274h327c23 0 41 18 41 41v488c0 22-18 40-41 40H126c-23 0-41-18-41-40V242c0-34 27-61 61-61h317c18 0 35 7 47 21l61 72zm-119-8H170v492h684V359H531l-79-93z"
-      />
-    </svg>
-    <span>
-      normal
-    </span>
-  </div>
-  <div
-    class="emotion-9"
-  >
-    <svg
-      class="emotion-1"
-      height="20px"
-      viewBox="0 0 1024 1024"
-      width="20px"
-    >
-      <path
-        class="emotion-0"
-        d="M878.78 477.856l-591.884-341.722c-9.464-5.464-18.426-8.050-26.386-8.048-19.516 0.002-33.002 15.546-33.002 42.338v683.446c0 26.792 13.482 42.338 33.002 42.338 7.96 0 16.924-2.586 26.386-8.048l591.884-341.722c32.664-18.864 32.664-49.724 0-68.582z"
-      />
-    </svg>
-    <svg
-      class="emotion-3"
-      height="20px"
-      viewBox="0 0 1024 1024"
-      width="20px"
-    >
-      <path
-        class="emotion-0"
-        d="M571 274h327c23 0 41 18 41 41v488c0 22-18 40-41 40H126c-23 0-41-18-41-40V242c0-34 27-61 61-61h317c18 0 35 7 47 21l61 72zm-119-8H170v492h684V359H531l-79-93z"
-      />
-    </svg>
-    <span>
-      isSelected
-    </span>
-  </div>
-  <div
-    class="emotion-4"
-  >
-    <svg
-      class="emotion-11"
-      height="20px"
-      viewBox="0 0 1024 1024"
-      width="20px"
-    >
-      <path
-        class="emotion-0"
-        d="M878.78 477.856l-591.884-341.722c-9.464-5.464-18.426-8.050-26.386-8.048-19.516 0.002-33.002 15.546-33.002 42.338v683.446c0 26.792 13.482 42.338 33.002 42.338 7.96 0 16.924-2.586 26.386-8.048l591.884-341.722c32.664-18.864 32.664-49.724 0-68.582z"
-      />
-    </svg>
-    <svg
-      class="emotion-3"
-      height="20px"
-      viewBox="0 0 1024 1024"
-      width="20px"
-    >
-      <path
-        class="emotion-0"
-        d="M571 274h327c23 0 41 18 41 41v488c0 22-18 40-41 40H126c-23 0-41-18-41-40V242c0-34 27-61 61-61h317c18 0 35 7 47 21l61 72zm-119-8H170v492h684V359H531l-79-93z"
-      />
-    </svg>
-    <span>
-      isExpanded
-    </span>
-  </div>
-  <div
-    class="emotion-4"
-  >
-    <svg
-      class="emotion-11"
-      height="20px"
-      viewBox="0 0 1024 1024"
-      width="20px"
-    >
-      <path
-        class="emotion-0"
-        d="M878.78 477.856l-591.884-341.722c-9.464-5.464-18.426-8.050-26.386-8.048-19.516 0.002-33.002 15.546-33.002 42.338v683.446c0 26.792 13.482 42.338 33.002 42.338 7.96 0 16.924-2.586 26.386-8.048l591.884-341.722c32.664-18.864 32.664-49.724 0-68.582z"
-      />
-    </svg>
-    <svg
-      class="emotion-18"
-      height="20px"
-      viewBox="0 0 1024 1024"
-      width="20px"
-    >
-      <path
-        class="emotion-0"
-        d="M171 469h298V171H246c-42 0-75 33-75 75v223zm0 86v223c0 42 33 75 75 75h223V555H171zm682-86V246c0-42-33-75-75-75H555v298h298zm0 86H555v298h223c42 0 75-33 75-75V555zM256 85h512c94 0 171 77 171 171v512c0 94-77 171-171 171H256c-94 0-171-77-171-171V256c0-94 77-171 171-171z"
-      />
-    </svg>
-    <span>
-      isComponent
-    </span>
-  </div>
-  <hr />
-  <div
-    class="emotion-4"
-  >
-    <svg
-      class="emotion-1"
-      height="20px"
-      viewBox="0 0 1024 1024"
-      width="20px"
-    >
-      <path
-        class="emotion-0"
-        d="M878.78 477.856l-591.884-341.722c-9.464-5.464-18.426-8.050-26.386-8.048-19.516 0.002-33.002 15.546-33.002 42.338v683.446c0 26.792 13.482 42.338 33.002 42.338 7.96 0 16.924-2.586 26.386-8.048l591.884-341.722c32.664-18.864 32.664-49.724 0-68.582z"
-      />
-    </svg>
-    <svg
-      class="emotion-3"
-      height="20px"
-      viewBox="0 0 1024 1024"
-      width="20px"
-    >
-      <path
-        class="emotion-0"
-        d="M571 274h327c23 0 41 18 41 41v488c0 22-18 40-41 40H126c-23 0-41-18-41-40V242c0-34 27-61 61-61h317c18 0 35 7 47 21l61 72zm-119-8H170v492h684V359H531l-79-93z"
-      />
-    </svg>
-    <span>
-      depth = 0
-    </span>
-  </div>
-  <div
-    class="emotion-29"
-  >
-    <svg
-      class="emotion-1"
-      height="20px"
-      viewBox="0 0 1024 1024"
-      width="20px"
-    >
-      <path
-        class="emotion-0"
-        d="M878.78 477.856l-591.884-341.722c-9.464-5.464-18.426-8.050-26.386-8.048-19.516 0.002-33.002 15.546-33.002 42.338v683.446c0 26.792 13.482 42.338 33.002 42.338 7.96 0 16.924-2.586 26.386-8.048l591.884-341.722c32.664-18.864 32.664-49.724 0-68.582z"
-      />
-    </svg>
-    <svg
-      class="emotion-3"
-      height="20px"
-      viewBox="0 0 1024 1024"
-      width="20px"
-    >
-      <path
-        class="emotion-0"
-        d="M571 274h327c23 0 41 18 41 41v488c0 22-18 40-41 40H126c-23 0-41-18-41-40V242c0-34 27-61 61-61h317c18 0 35 7 47 21l61 72zm-119-8H170v492h684V359H531l-79-93z"
-      />
-    </svg>
-    <span>
-      depth = 1
-    </span>
-  </div>
-  <div
-    class="emotion-34"
-  >
-    <svg
-      class="emotion-1"
-      height="20px"
-      viewBox="0 0 1024 1024"
-      width="20px"
-    >
-      <path
-        class="emotion-0"
-        d="M878.78 477.856l-591.884-341.722c-9.464-5.464-18.426-8.050-26.386-8.048-19.516 0.002-33.002 15.546-33.002 42.338v683.446c0 26.792 13.482 42.338 33.002 42.338 7.96 0 16.924-2.586 26.386-8.048l591.884-341.722c32.664-18.864 32.664-49.724 0-68.582z"
-      />
-    </svg>
-    <svg
-      class="emotion-3"
-      height="20px"
-      viewBox="0 0 1024 1024"
-      width="20px"
-    >
-      <path
-        class="emotion-0"
-        d="M571 274h327c23 0 41 18 41 41v488c0 22-18 40-41 40H126c-23 0-41-18-41-40V242c0-34 27-61 61-61h317c18 0 35 7 47 21l61 72zm-119-8H170v492h684V359H531l-79-93z"
-      />
-    </svg>
-    <span>
-      depth = 2
-    </span>
-  </div>
-  <div
-    class="emotion-39"
-  >
-    <svg
-      class="emotion-1"
-      height="20px"
-      viewBox="0 0 1024 1024"
-      width="20px"
-    >
-      <path
-        class="emotion-0"
-        d="M878.78 477.856l-591.884-341.722c-9.464-5.464-18.426-8.050-26.386-8.048-19.516 0.002-33.002 15.546-33.002 42.338v683.446c0 26.792 13.482 42.338 33.002 42.338 7.96 0 16.924-2.586 26.386-8.048l591.884-341.722c32.664-18.864 32.664-49.724 0-68.582z"
-      />
-    </svg>
-    <svg
-      class="emotion-3"
-      height="20px"
-      viewBox="0 0 1024 1024"
-      width="20px"
-    >
-      <path
-        class="emotion-0"
-        d="M571 274h327c23 0 41 18 41 41v488c0 22-18 40-41 40H126c-23 0-41-18-41-40V242c0-34 27-61 61-61h317c18 0 35 7 47 21l61 72zm-119-8H170v492h684V359H531l-79-93z"
-      />
-    </svg>
-    <span>
-      depth = 3
-    </span>
-  </div>
-</div>
-`;
-
-exports[`Storyshots UI|StoriesExplorer/subcomponents Leaf 1`] = `
-.emotion-0 {
-  fill: currentColor;
-}
-
-.emotion-18 > * {
-  margin-top: 10px;
-}
-
-.emotion-18 > *:first-child {
-  margin-top: 0;
-}
-
-.emotion-4 {
-  display: block;
-  display: inline-block;
-  width: 10px;
-  height: 10px;
-  margin-right: 10px;
-  color: #37d5d3;
-  color: inherit;
-}
-
-.emotion-11 {
-  margin-left: -20px;
-  margin-right: -20px;
-  min-height: 24px;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding-left: 30px;
-  background: transparent;
-}
-
-.emotion-11:hover {
-  background: #EAF3FC;
-}
-
-.emotion-1 {
-  display: block;
-  display: inline-block;
-  width: 10px;
-  height: 10px;
-  margin-right: 10px;
-  color: #37d5d3;
-}
-
-.emotion-14 {
-  margin-left: -20px;
-  margin-right: -20px;
-  min-height: 24px;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding-left: 50px;
-  background: transparent;
-}
-
-.emotion-14:hover {
-  background: #EAF3FC;
-}
-
-.emotion-2 {
-  margin-left: -20px;
-  margin-right: -20px;
-  min-height: 24px;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding-left: 10px;
-  background: transparent;
-}
-
-.emotion-2:hover {
-  background: #EAF3FC;
-}
-
-.emotion-5 {
-  margin-left: -20px;
-  margin-right: -20px;
-  min-height: 24px;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding-left: 10px;
-  background: #1EA7FD;
-  color: #FFFFFF;
-}
-
-.emotion-17 {
-  margin-left: -20px;
-  margin-right: -20px;
-  min-height: 24px;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  padding-left: 70px;
-  background: transparent;
-}
-
-.emotion-17:hover {
-  background: #EAF3FC;
-}
-
-<div
-  class="emotion-18"
->
-  <div
-    class="emotion-2"
-    id="1"
-  >
-    <svg
-      class="emotion-1"
-      height="20px"
-      viewBox="0 0 1024 1024"
-      width="20px"
-    >
-      <path
-        class="emotion-0"
-        d="M772 1012L511 761l-260 251a49 49 0 0 1-52 10c-18-7-29-24-29-43V132c0-25 21-46 47-46h588c26 0 47 21 47 46v847c0 19-11 36-29 43a49 49 0 0 1-51-10zM545 664l213 205V181H265v688l213-205c9-9 21-14 33-14s24 5 34 14z"
-      />
-    </svg>
-    not selected
-  </div>
-  <div
-    class="emotion-5"
-    id="1"
-  >
-    <svg
-      class="emotion-4"
-      height="20px"
-      viewBox="0 0 1024 1024"
-      width="20px"
-    >
-      <path
-        class="emotion-0"
-        d="M772 1012L511 761l-260 251a49 49 0 0 1-52 10c-18-7-29-24-29-43V132c0-25 21-46 47-46h588c26 0 47 21 47 46v847c0 19-11 36-29 43a49 49 0 0 1-51-10zM545 664l213 205V181H265v688l213-205c9-9 21-14 33-14s24 5 34 14z"
-      />
-    </svg>
-    selected
-  </div>
-  <hr />
-  <div
-    class="emotion-2"
-  >
-    <svg
-      class="emotion-1"
-      height="20px"
-      viewBox="0 0 1024 1024"
-      width="20px"
-    >
-      <path
-        class="emotion-0"
-        d="M772 1012L511 761l-260 251a49 49 0 0 1-52 10c-18-7-29-24-29-43V132c0-25 21-46 47-46h588c26 0 47 21 47 46v847c0 19-11 36-29 43a49 49 0 0 1-51-10zM545 664l213 205V181H265v688l213-205c9-9 21-14 33-14s24 5 34 14z"
-      />
-    </svg>
-    depth = 0
-  </div>
-  <div
-    class="emotion-11"
-  >
-    <svg
-      class="emotion-1"
-      height="20px"
-      viewBox="0 0 1024 1024"
-      width="20px"
-    >
-      <path
-        class="emotion-0"
-        d="M772 1012L511 761l-260 251a49 49 0 0 1-52 10c-18-7-29-24-29-43V132c0-25 21-46 47-46h588c26 0 47 21 47 46v847c0 19-11 36-29 43a49 49 0 0 1-51-10zM545 664l213 205V181H265v688l213-205c9-9 21-14 33-14s24 5 34 14z"
-      />
-    </svg>
-    depth = 1
-  </div>
-  <div
-    class="emotion-14"
-  >
-    <svg
-      class="emotion-1"
-      height="20px"
-      viewBox="0 0 1024 1024"
-      width="20px"
-    >
-      <path
-        class="emotion-0"
-        d="M772 1012L511 761l-260 251a49 49 0 0 1-52 10c-18-7-29-24-29-43V132c0-25 21-46 47-46h588c26 0 47 21 47 46v847c0 19-11 36-29 43a49 49 0 0 1-51-10zM545 664l213 205V181H265v688l213-205c9-9 21-14 33-14s24 5 34 14z"
-      />
-    </svg>
-    depth = 2
-  </div>
-  <div
-    class="emotion-17"
-  >
-    <svg
-      class="emotion-1"
-      height="20px"
-      viewBox="0 0 1024 1024"
-      width="20px"
-    >
-      <path
-        class="emotion-0"
-        d="M772 1012L511 761l-260 251a49 49 0 0 1-52 10c-18-7-29-24-29-43V132c0-25 21-46 47-46h588c26 0 47 21 47 46v847c0 19-11 36-29 43a49 49 0 0 1-51-10zM545 664l213 205V181H265v688l213-205c9-9 21-14 33-14s24 5 34 14z"
-      />
-    </svg>
-    depth = 3
-  </div>
-</div>
-`;
-
-exports[`Storyshots UI|StoriesExplorer/subcomponents Title 1`] = `
-.emotion-2 > * {
-  margin-top: 10px;
-}
-
-.emotion-2 > *:first-child {
-  margin-top: 0;
-}
-
-.emotion-1 {
-  margin-bottom: 10px;
-}
-
-.emotion-0 {
-  color: currentColor;
-  font-weight: normal;
-  font-family: "Nunito Sans",-apple-system,".SFNSText-Regular","San Francisco",BlinkMacSystemFont,"Segoe UI","Helvetica Neue",Helvetica,Arial,sans-serif;
-  margin: 0;
-  padding: 0;
-  line-height: 1.2em;
-  display: block;
-  color: rgba(0,0,0,0.4);
-  -webkit-letter-spacing: 4.3px;
-  -moz-letter-spacing: 4.3px;
-  -ms-letter-spacing: 4.3px;
-  letter-spacing: 4.3px;
-  font-weight: 400;
-  font-size: 10px;
-  text-transform: uppercase;
-}
-
-.emotion-0 > sub {
-  display: block;
-  padding-top: 5px;
-  line-height: 1.2em;
-  font-size: 14px;
-}
-
-<div
-  class="emotion-2"
->
-  <header
-    class="emotion-1"
-  >
-    <h1
-      class="emotion-0"
-    >
-      <span>
-        This is a Root title
-      </span>
-    </h1>
-  </header>
-</div>
-`;
diff --git a/lib/ui/src/components/sidebar/treeview/__snapshots__/treeview.stories.storyshot b/lib/ui/src/components/sidebar/treeview/__snapshots__/treeview.stories.storyshot
deleted file mode 100644
index 5d8f7ceed67..00000000000
--- a/lib/ui/src/components/sidebar/treeview/__snapshots__/treeview.stories.storyshot
+++ /dev/null
@@ -1,550 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Storyshots Components|Treeview stateful 1`] = `
-Array [
-  .emotion-0 {
-  width: 100%;
-  background: transparent;
-  border: 1px solid black;
-}
-
-<input
-    class="emotion-0"
-    placeholder="search..."
-  />,
-  .emotion-0 {
-  min-height: 24px;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  padding-left: 0;
-  background: transparent;
-}
-
-<div
-    class="emotion-1"
-  >
-    <a
-      class="emotion-1"
-      href="#!stateful1"
-    >
-      <div
-        class="emotion-0"
-      >
-        <span>
-          +
-        </span>
-        <span>
-          Parent A
-        </span>
-      </div>
-    </a>
-    <a
-      class="emotion-1"
-      href="#!stateful2"
-    >
-      <div
-        class="emotion-0"
-      >
-        <span>
-          +
-        </span>
-        <span>
-          Parent B
-        </span>
-      </div>
-    </a>
-  </div>,
-]
-`;
-
-exports[`Storyshots Components|Treeview stateless 1`] = `
-Array [
-  .emotion-0 {
-  min-height: 24px;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  padding-left: 0;
-  background: transparent;
-}
-
-<div
-    class="emotion-0"
-  >
-    <span>
-      -
-    </span>
-    <span>
-      Parent A
-    </span>
-  </div>,
-  .emotion-0 {
-  min-height: 24px;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  padding-left: 10px;
-  background: transparent;
-}
-
-<div
-    class="emotion-2"
-  >
-    <div
-      class="emotion-0"
-      id="1-11"
-    >
-      Child A1
-    </div>
-    <div
-      class="emotion-0"
-    >
-      <span>
-        +
-      </span>
-      <span>
-        Child A2
-      </span>
-    </div>
-  </div>,
-]
-`;
-
-exports[`Storyshots Components|Treeview stateless changed expanded 1`] = `
-Array [
-  .emotion-0 {
-  min-height: 24px;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  padding-left: 0;
-  background: transparent;
-}
-
-<div
-    class="emotion-0"
-  >
-    <span>
-      -
-    </span>
-    <span>
-      Parent A
-    </span>
-  </div>,
-  .emotion-0 {
-  min-height: 24px;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  padding-left: 10px;
-  background: transparent;
-}
-
-.emotion-2 {
-  min-height: 24px;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  padding-left: 20px;
-  background: transparent;
-}
-
-<div
-    class="emotion-4"
-  >
-    <div
-      class="emotion-0"
-      id="1-11"
-    >
-      Child A1
-    </div>
-    <div
-      class="emotion-0"
-    >
-      <span>
-        -
-      </span>
-      <span>
-        Child A2
-      </span>
-    </div>
-    <div
-      class="emotion-4"
-    >
-      <div
-        class="emotion-2"
-        id="1-12-121"
-      >
-        GrandChild A1.1
-      </div>
-      <div
-        class="emotion-2"
-        id="1-12-122"
-      >
-        GrandChild A1.2
-      </div>
-    </div>
-  </div>,
-]
-`;
-
-exports[`Storyshots Components|Treeview with custom node 1`] = `
-Array [
-  .emotion-0 {
-  width: 100%;
-  background: transparent;
-  border: 1px solid black;
-}
-
-<input
-    class="emotion-0"
-    placeholder="search..."
-  />,
-  .emotion-0 {
-  min-height: 24px;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  padding-left: 0;
-  background: transparent;
-}
-
-<div
-    class="emotion-1"
-  >
-    <a
-      class="emotion-1"
-      href="#!stateful1"
-    >
-      <div
-        class="emotion-0"
-      >
-        <span>
-          +
-        </span>
-        <span>
-          Parent A
-        </span>
-      </div>
-    </a>
-    <a
-      class="emotion-1"
-      href="#!stateful2"
-    >
-      <div
-        class="emotion-0"
-      >
-        <span>
-          +
-        </span>
-        <span>
-          Parent B
-        </span>
-      </div>
-    </a>
-  </div>,
-]
-`;
-
-exports[`Storyshots Components|Treeview with roots node 1`] = `
-Array [
-  .emotion-0 {
-  width: 100%;
-  background: transparent;
-  border: 1px solid black;
-}
-
-<input
-    class="emotion-0"
-    placeholder="search..."
-  />,
-  .emotion-2 {
-  min-height: 24px;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  padding-left: 0;
-  background: transparent;
-}
-
-.emotion-1 {
-  margin-top: 20px;
-  margin-bottom: 10px;
-}
-
-.emotion-0 {
-  color: currentColor;
-  font-weight: normal;
-  font-family: "Nunito Sans",-apple-system,".SFNSText-Regular","San Francisco",BlinkMacSystemFont,"Segoe UI","Helvetica Neue",Helvetica,Arial,sans-serif;
-  margin: 0;
-  padding: 0;
-  line-height: 1.2em;
-  display: block;
-  color: rgba(0,0,0,0.4);
-  -webkit-letter-spacing: 4.3px;
-  -moz-letter-spacing: 4.3px;
-  -ms-letter-spacing: 4.3px;
-  letter-spacing: 4.3px;
-  font-weight: 400;
-  font-size: 10px;
-  text-transform: uppercase;
-}
-
-.emotion-0 > sub {
-  display: block;
-  padding-top: 5px;
-  line-height: 1.2em;
-  font-size: 14px;
-}
-
-<div
-    class="emotion-3"
-  >
-    <header
-      class="emotion-1"
-    >
-      <h1
-        class="emotion-0"
-      >
-        <span>
-          Root 1
-        </span>
-      </h1>
-    </header>
-    <a
-      class="emotion-3"
-      href="#!stateful1-12"
-    >
-      <div
-        class="emotion-2"
-      >
-        <span>
-          +
-        </span>
-        <span>
-          Child A2
-        </span>
-      </div>
-    </a>
-  </div>,
-  .emotion-2 {
-  min-height: 24px;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  padding-left: 0;
-  background: transparent;
-}
-
-.emotion-1 {
-  margin-top: 20px;
-  margin-bottom: 10px;
-}
-
-.emotion-0 {
-  color: currentColor;
-  font-weight: normal;
-  font-family: "Nunito Sans",-apple-system,".SFNSText-Regular","San Francisco",BlinkMacSystemFont,"Segoe UI","Helvetica Neue",Helvetica,Arial,sans-serif;
-  margin: 0;
-  padding: 0;
-  line-height: 1.2em;
-  display: block;
-  color: rgba(0,0,0,0.4);
-  -webkit-letter-spacing: 4.3px;
-  -moz-letter-spacing: 4.3px;
-  -ms-letter-spacing: 4.3px;
-  letter-spacing: 4.3px;
-  font-weight: 400;
-  font-size: 10px;
-  text-transform: uppercase;
-}
-
-.emotion-0 > sub {
-  display: block;
-  padding-top: 5px;
-  line-height: 1.2em;
-  font-size: 14px;
-}
-
-<div
-    class="emotion-3"
-  >
-    <header
-      class="emotion-1"
-    >
-      <h1
-        class="emotion-0"
-      >
-        <span>
-          Root 3
-        </span>
-      </h1>
-    </header>
-    <a
-      class="emotion-3"
-      href="#!stateful3-32"
-    >
-      <div
-        class="emotion-2"
-      >
-        <span>
-          +
-        </span>
-        <span>
-          Child A2
-        </span>
-      </div>
-    </a>
-  </div>,
-  .emotion-2 {
-  min-height: 24px;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  padding-left: 0;
-  background: transparent;
-}
-
-.emotion-1 {
-  margin-top: 20px;
-  margin-bottom: 10px;
-}
-
-.emotion-0 {
-  color: currentColor;
-  font-weight: normal;
-  font-family: "Nunito Sans",-apple-system,".SFNSText-Regular","San Francisco",BlinkMacSystemFont,"Segoe UI","Helvetica Neue",Helvetica,Arial,sans-serif;
-  margin: 0;
-  padding: 0;
-  line-height: 1.2em;
-  display: block;
-  color: rgba(0,0,0,0.4);
-  -webkit-letter-spacing: 4.3px;
-  -moz-letter-spacing: 4.3px;
-  -ms-letter-spacing: 4.3px;
-  letter-spacing: 4.3px;
-  font-weight: 400;
-  font-size: 10px;
-  text-transform: uppercase;
-}
-
-.emotion-0 > sub {
-  display: block;
-  padding-top: 5px;
-  line-height: 1.2em;
-  font-size: 14px;
-}
-
-<div
-    class="emotion-3"
-  >
-    <header
-      class="emotion-1"
-    >
-      <h1
-        class="emotion-0"
-      >
-        <span>
-          Others
-        </span>
-      </h1>
-    </header>
-    <a
-      class="emotion-3"
-      href="#!stateful2"
-    >
-      <div
-        class="emotion-2"
-      >
-        <span>
-          +
-        </span>
-        <span>
-          Group 1
-        </span>
-      </div>
-    </a>
-  </div>,
-]
-`;

From fe79a513e023a3d08a731d9a9e3bfa8db3e60150 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Mon, 11 Mar 2019 22:20:02 +0800
Subject: [PATCH 244/249] 5.1.0-alpha.4 changelog

---
 CHANGELOG.md | 19 +++++++++++++++++++
 1 file changed, 19 insertions(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 6e3192fc827..309a4090572 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,22 @@
+## 5.1.0-alpha.4 (March 11, 2019)
+
+### Bug Fixes
+
+* CLI: Fix welcome component in dark theme ([#5998](https://github.com/storybooks/storybook/pull/5998))
+* Polymer: Fix re-rendering lit-html elements after non-lit-html element ([#5868](https://github.com/storybooks/storybook/pull/5868))
+* Addon-a11y: Fix respect 'element' arg in config ([#5996](https://github.com/storybooks/storybook/pull/5996))
+* Addon-a11y: Fix design icons ([#5991](https://github.com/storybooks/storybook/pull/5991))
+* Addon-viewport: Fix viewport iframe dimensions ([#5993](https://github.com/storybooks/storybook/pull/5993))
+
+### Maintenance
+
+* ADD parameters to compile-js to no longer copy .ts files into dist ([#5844](https://github.com/storybooks/storybook/pull/5844))
+
+### Dependency Upgrades
+
+* build(deps): bump react-is from 16.8.3 to 16.8.4 ([#6010](https://github.com/storybooks/storybook/pull/6010))
+* build(deps): bump react-dev-utils from 7.0.3 to 8.0.0 ([#6011](https://github.com/storybooks/storybook/pull/6011))
+
 ## 5.1.0-alpha.3 (March 9, 2019)
 
 ### Features

From aab869c4d8665b2be3ee99ded272ee2f68825fe8 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Mon, 11 Mar 2019 22:29:26 +0800
Subject: [PATCH 245/249] v5.1.0-alpha.4

---
 addons/a11y/package.json                      | 12 ++---
 addons/actions/package.json                   | 10 ++--
 addons/backgrounds/package.json               | 12 ++---
 addons/centered/package.json                  |  2 +-
 addons/cssresources/package.json              |  8 +--
 addons/events/package.json                    |  8 +--
 addons/google-analytics/package.json          |  6 +--
 addons/graphql/package.json                   |  2 +-
 addons/info/package.json                      | 10 ++--
 addons/jest/package.json                      | 10 ++--
 addons/knobs/package.json                     | 10 ++--
 addons/links/package.json                     |  6 +--
 addons/notes/package.json                     | 12 ++---
 addons/ondevice-backgrounds/package.json      |  4 +-
 addons/ondevice-knobs/package.json            |  4 +-
 addons/ondevice-notes/package.json            |  4 +-
 addons/options/package.json                   |  4 +-
 .../storyshots/storyshots-core/package.json   |  4 +-
 .../storyshots-puppeteer/package.json         |  6 +--
 addons/storysource/package.json               | 10 ++--
 addons/viewport/package.json                  | 12 ++---
 app/angular/package.json                      |  6 +--
 app/ember/package.json                        |  4 +-
 app/html/package.json                         |  4 +-
 app/marko/package.json                        |  4 +-
 app/mithril/package.json                      |  4 +-
 app/polymer/package.json                      |  4 +-
 app/preact/package.json                       |  4 +-
 app/react-native/package.json                 | 14 ++---
 app/react/package.json                        |  6 +--
 app/riot/package.json                         |  4 +-
 app/svelte/package.json                       |  4 +-
 app/vue/package.json                          |  4 +-
 examples/angular-cli/package.json             | 26 ++++-----
 examples/cra-kitchen-sink/package.json        | 32 +++++------
 examples/cra-ts-kitchen-sink/package.json     | 12 ++---
 examples/ember-cli/package.json               | 26 ++++-----
 examples/html-kitchen-sink/package.json       | 36 ++++++-------
 examples/marko-cli/package.json               | 14 ++---
 examples/mithril-kitchen-sink/package.json    | 26 ++++-----
 examples/official-storybook/package.json      | 48 ++++++++---------
 examples/polymer-cli/package.json             | 20 +++----
 examples/preact-kitchen-sink/package.json     | 26 ++++-----
 examples/riot-kitchen-sink/package.json       | 26 ++++-----
 examples/svelte-kitchen-sink/package.json     | 26 ++++-----
 examples/vue-kitchen-sink/package.json        | 26 ++++-----
 lerna.json                                    |  2 +-
 lib/addons/package.json                       |  6 +--
 lib/channel-postmessage/package.json          |  6 +--
 lib/channel-websocket/package.json            |  4 +-
 lib/channels/package.json                     |  2 +-
 lib/cli/package.json                          | 54 +++++++++----------
 lib/client-api/package.json                   | 10 ++--
 lib/client-logger/package.json                |  2 +-
 lib/codemod/package.json                      |  2 +-
 lib/components/package.json                   | 12 ++---
 lib/core-events/package.json                  |  2 +-
 lib/core/package.json                         | 18 +++----
 lib/node-logger/package.json                  |  2 +-
 lib/router/package.json                       |  4 +-
 lib/theming/package.json                      |  4 +-
 lib/ui/package.json                           | 14 ++---
 62 files changed, 353 insertions(+), 353 deletions(-)

diff --git a/addons/a11y/package.json b/addons/a11y/package.json
index b8f33a99d3b..0ac9a47dca6 100644
--- a/addons/a11y/package.json
+++ b/addons/a11y/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-a11y",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "a11y addon for storybook",
   "keywords": [
     "a11y",
@@ -26,11 +26,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.3",
-    "@storybook/client-logger": "5.1.0-alpha.3",
-    "@storybook/components": "5.1.0-alpha.3",
-    "@storybook/core-events": "5.1.0-alpha.3",
-    "@storybook/theming": "5.1.0-alpha.3",
+    "@storybook/addons": "5.1.0-alpha.4",
+    "@storybook/client-logger": "5.1.0-alpha.4",
+    "@storybook/components": "5.1.0-alpha.4",
+    "@storybook/core-events": "5.1.0-alpha.4",
+    "@storybook/theming": "5.1.0-alpha.4",
     "axe-core": "^3.1.2",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
diff --git a/addons/actions/package.json b/addons/actions/package.json
index bb5bbec5148..74a7d295b91 100644
--- a/addons/actions/package.json
+++ b/addons/actions/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-actions",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "Action Logger addon for storybook",
   "keywords": [
     "storybook"
@@ -21,10 +21,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.3",
-    "@storybook/components": "5.1.0-alpha.3",
-    "@storybook/core-events": "5.1.0-alpha.3",
-    "@storybook/theming": "5.1.0-alpha.3",
+    "@storybook/addons": "5.1.0-alpha.4",
+    "@storybook/components": "5.1.0-alpha.4",
+    "@storybook/core-events": "5.1.0-alpha.4",
+    "@storybook/theming": "5.1.0-alpha.4",
     "core-js": "^2.6.5",
     "fast-deep-equal": "^2.0.1",
     "global": "^4.3.2",
diff --git a/addons/backgrounds/package.json b/addons/backgrounds/package.json
index e0bd6d881f8..5d00a75475f 100644
--- a/addons/backgrounds/package.json
+++ b/addons/backgrounds/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-backgrounds",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "A storybook addon to show different backgrounds for your preview",
   "keywords": [
     "addon",
@@ -25,11 +25,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.3",
-    "@storybook/client-logger": "5.1.0-alpha.3",
-    "@storybook/components": "5.1.0-alpha.3",
-    "@storybook/core-events": "5.1.0-alpha.3",
-    "@storybook/theming": "5.1.0-alpha.3",
+    "@storybook/addons": "5.1.0-alpha.4",
+    "@storybook/client-logger": "5.1.0-alpha.4",
+    "@storybook/components": "5.1.0-alpha.4",
+    "@storybook/core-events": "5.1.0-alpha.4",
+    "@storybook/theming": "5.1.0-alpha.4",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
diff --git a/addons/centered/package.json b/addons/centered/package.json
index 4357e2af1e8..d6cd9772a81 100644
--- a/addons/centered/package.json
+++ b/addons/centered/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-centered",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "Storybook decorator to center components",
   "keywords": [
     "addon",
diff --git a/addons/cssresources/package.json b/addons/cssresources/package.json
index 2567a51f68b..82d00f0284b 100644
--- a/addons/cssresources/package.json
+++ b/addons/cssresources/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-cssresources",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "A storybook addon to switch between css resources at runtime for your story",
   "keywords": [
     "addon",
@@ -25,9 +25,9 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.3",
-    "@storybook/components": "5.1.0-alpha.3",
-    "@storybook/core-events": "5.1.0-alpha.3",
+    "@storybook/addons": "5.1.0-alpha.4",
+    "@storybook/components": "5.1.0-alpha.4",
+    "@storybook/core-events": "5.1.0-alpha.4",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "react": "^16.8.4"
diff --git a/addons/events/package.json b/addons/events/package.json
index a4962a7a625..8d7fa717443 100644
--- a/addons/events/package.json
+++ b/addons/events/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-events",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "Add events to your Storybook stories.",
   "keywords": [
     "addon",
@@ -24,9 +24,9 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.3",
-    "@storybook/core-events": "5.1.0-alpha.3",
-    "@storybook/theming": "5.1.0-alpha.3",
+    "@storybook/addons": "5.1.0-alpha.4",
+    "@storybook/core-events": "5.1.0-alpha.4",
+    "@storybook/theming": "5.1.0-alpha.4",
     "core-js": "^2.6.5",
     "format-json": "^1.0.3",
     "prop-types": "^15.7.2",
diff --git a/addons/google-analytics/package.json b/addons/google-analytics/package.json
index 147e7521644..319de081d07 100644
--- a/addons/google-analytics/package.json
+++ b/addons/google-analytics/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-google-analytics",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "Storybook addon for google analytics",
   "keywords": [
     "addon",
@@ -20,8 +20,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.3",
-    "@storybook/core-events": "5.1.0-alpha.3",
+    "@storybook/addons": "5.1.0-alpha.4",
+    "@storybook/core-events": "5.1.0-alpha.4",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "react-ga": "^2.5.7"
diff --git a/addons/graphql/package.json b/addons/graphql/package.json
index 62195f6fca5..045842d37fa 100644
--- a/addons/graphql/package.json
+++ b/addons/graphql/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-graphql",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "Storybook addon to display the GraphiQL IDE",
   "keywords": [
     "addon",
diff --git a/addons/info/package.json b/addons/info/package.json
index 525ef9cc10e..4c3ecf4779e 100644
--- a/addons/info/package.json
+++ b/addons/info/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-info",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "A Storybook addon to show additional information for your stories.",
   "keywords": [
     "addon",
@@ -22,10 +22,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.3",
-    "@storybook/client-logger": "5.1.0-alpha.3",
-    "@storybook/components": "5.1.0-alpha.3",
-    "@storybook/theming": "5.1.0-alpha.3",
+    "@storybook/addons": "5.1.0-alpha.4",
+    "@storybook/client-logger": "5.1.0-alpha.4",
+    "@storybook/components": "5.1.0-alpha.4",
+    "@storybook/theming": "5.1.0-alpha.4",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "marksy": "^6.1.0",
diff --git a/addons/jest/package.json b/addons/jest/package.json
index 9d1ffe0b4d0..37fa2fb7f6d 100644
--- a/addons/jest/package.json
+++ b/addons/jest/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-jest",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "React storybook addon that show component jest report",
   "keywords": [
     "addon",
@@ -28,10 +28,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.3",
-    "@storybook/components": "5.1.0-alpha.3",
-    "@storybook/core-events": "5.1.0-alpha.3",
-    "@storybook/theming": "5.1.0-alpha.3",
+    "@storybook/addons": "5.1.0-alpha.4",
+    "@storybook/components": "5.1.0-alpha.4",
+    "@storybook/core-events": "5.1.0-alpha.4",
+    "@storybook/theming": "5.1.0-alpha.4",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "prop-types": "^15.7.2",
diff --git a/addons/knobs/package.json b/addons/knobs/package.json
index 6bf37ee19e9..401b917203b 100644
--- a/addons/knobs/package.json
+++ b/addons/knobs/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-knobs",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "Storybook Addon Prop Editor Component",
   "keywords": [
     "addon",
@@ -22,10 +22,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.3",
-    "@storybook/components": "5.1.0-alpha.3",
-    "@storybook/core-events": "5.1.0-alpha.3",
-    "@storybook/theming": "5.1.0-alpha.3",
+    "@storybook/addons": "5.1.0-alpha.4",
+    "@storybook/components": "5.1.0-alpha.4",
+    "@storybook/core-events": "5.1.0-alpha.4",
+    "@storybook/theming": "5.1.0-alpha.4",
     "copy-to-clipboard": "^3.0.8",
     "core-js": "^2.6.5",
     "escape-html": "^1.0.3",
diff --git a/addons/links/package.json b/addons/links/package.json
index 240d9aef4f4..169e363efa4 100644
--- a/addons/links/package.json
+++ b/addons/links/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-links",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "Story Links addon for storybook",
   "keywords": [
     "addon",
@@ -22,8 +22,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.3",
-    "@storybook/core-events": "5.1.0-alpha.3",
+    "@storybook/addons": "5.1.0-alpha.4",
+    "@storybook/core-events": "5.1.0-alpha.4",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
diff --git a/addons/notes/package.json b/addons/notes/package.json
index e33c7543544..c1eadf0419d 100644
--- a/addons/notes/package.json
+++ b/addons/notes/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-notes",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "Write notes for your Storybook stories.",
   "keywords": [
     "addon",
@@ -23,11 +23,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.3",
-    "@storybook/client-logger": "5.1.0-alpha.3",
-    "@storybook/components": "5.1.0-alpha.3",
-    "@storybook/core-events": "5.1.0-alpha.3",
-    "@storybook/theming": "5.1.0-alpha.3",
+    "@storybook/addons": "5.1.0-alpha.4",
+    "@storybook/client-logger": "5.1.0-alpha.4",
+    "@storybook/components": "5.1.0-alpha.4",
+    "@storybook/core-events": "5.1.0-alpha.4",
+    "@storybook/theming": "5.1.0-alpha.4",
     "core-js": "^2.6.5",
     "markdown-to-jsx": "^6.9.1",
     "prop-types": "^15.7.2",
diff --git a/addons/ondevice-backgrounds/package.json b/addons/ondevice-backgrounds/package.json
index e7177d6f971..1bb1a3b630b 100644
--- a/addons/ondevice-backgrounds/package.json
+++ b/addons/ondevice-backgrounds/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/addon-ondevice-backgrounds",
   "private": true,
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "A storybook addon to show different backgrounds for your preview",
   "keywords": [
     "addon",
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.3",
+    "@storybook/addons": "5.1.0-alpha.4",
     "core-js": "^2.6.5",
     "prop-types": "^15.7.2"
   },
diff --git a/addons/ondevice-knobs/package.json b/addons/ondevice-knobs/package.json
index 5bbf34554d1..4bb1b3da587 100644
--- a/addons/ondevice-knobs/package.json
+++ b/addons/ondevice-knobs/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/addon-ondevice-knobs",
   "private": true,
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "Display storybook story knobs on your deviced.",
   "keywords": [
     "addon",
@@ -22,7 +22,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.3",
+    "@storybook/addons": "5.1.0-alpha.4",
     "core-js": "^2.6.5",
     "deep-equal": "^1.0.1",
     "prop-types": "^15.7.2",
diff --git a/addons/ondevice-notes/package.json b/addons/ondevice-notes/package.json
index bef8de82039..36e40c3c0ec 100644
--- a/addons/ondevice-notes/package.json
+++ b/addons/ondevice-notes/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/addon-ondevice-notes",
   "private": true,
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "Write notes for your Storybook stories.",
   "keywords": [
     "addon",
@@ -20,7 +20,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.3",
+    "@storybook/addons": "5.1.0-alpha.4",
     "core-js": "^2.6.5",
     "prop-types": "^15.7.2",
     "react-native-simple-markdown": "^1.1.0"
diff --git a/addons/options/package.json b/addons/options/package.json
index 9fa878013c9..301585a7392 100644
--- a/addons/options/package.json
+++ b/addons/options/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-options",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "Options addon for storybook",
   "keywords": [
     "addon",
@@ -21,7 +21,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.3",
+    "@storybook/addons": "5.1.0-alpha.4",
     "core-js": "^2.6.5",
     "util-deprecate": "^1.0.2"
   },
diff --git a/addons/storyshots/storyshots-core/package.json b/addons/storyshots/storyshots-core/package.json
index 1f2a21aee18..93a13015f7c 100644
--- a/addons/storyshots/storyshots-core/package.json
+++ b/addons/storyshots/storyshots-core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storyshots",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "StoryShots is a Jest Snapshot Testing Addon for Storybook.",
   "keywords": [
     "addon",
@@ -25,7 +25,7 @@
     "storybook": "start-storybook -p 6006"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.3",
+    "@storybook/addons": "5.1.0-alpha.4",
     "core-js": "^2.6.5",
     "glob": "^7.1.3",
     "global": "^4.3.2",
diff --git a/addons/storyshots/storyshots-puppeteer/package.json b/addons/storyshots/storyshots-puppeteer/package.json
index 5300a8de12d..d5ddc26e5a1 100644
--- a/addons/storyshots/storyshots-puppeteer/package.json
+++ b/addons/storyshots/storyshots-puppeteer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storyshots-puppeteer",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "Image snappshots addition to StoryShots base on puppeteer",
   "keywords": [
     "addon",
@@ -22,8 +22,8 @@
     "prepare": "node ../../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/node-logger": "5.1.0-alpha.3",
-    "@storybook/router": "5.1.0-alpha.3",
+    "@storybook/node-logger": "5.1.0-alpha.4",
+    "@storybook/router": "5.1.0-alpha.4",
     "core-js": "^2.6.5",
     "jest-image-snapshot": "^2.8.1",
     "puppeteer": "^1.12.2",
diff --git a/addons/storysource/package.json b/addons/storysource/package.json
index 40cb1ac5ea9..855411a14de 100644
--- a/addons/storysource/package.json
+++ b/addons/storysource/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storysource",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "Stories addon for storybook",
   "keywords": [
     "addon",
@@ -22,10 +22,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.3",
-    "@storybook/components": "5.1.0-alpha.3",
-    "@storybook/router": "5.1.0-alpha.3",
-    "@storybook/theming": "5.1.0-alpha.3",
+    "@storybook/addons": "5.1.0-alpha.4",
+    "@storybook/components": "5.1.0-alpha.4",
+    "@storybook/router": "5.1.0-alpha.4",
+    "@storybook/theming": "5.1.0-alpha.4",
     "core-js": "^2.6.5",
     "estraverse": "^4.2.0",
     "loader-utils": "^1.2.3",
diff --git a/addons/viewport/package.json b/addons/viewport/package.json
index 30399c66c02..75aa3d8b061 100644
--- a/addons/viewport/package.json
+++ b/addons/viewport/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-viewport",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "Storybook addon to change the viewport size to mobile",
   "keywords": [
     "addon",
@@ -21,11 +21,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.3",
-    "@storybook/client-logger": "5.1.0-alpha.3",
-    "@storybook/components": "5.1.0-alpha.3",
-    "@storybook/core-events": "5.1.0-alpha.3",
-    "@storybook/theming": "5.1.0-alpha.3",
+    "@storybook/addons": "5.1.0-alpha.4",
+    "@storybook/client-logger": "5.1.0-alpha.4",
+    "@storybook/components": "5.1.0-alpha.4",
+    "@storybook/core-events": "5.1.0-alpha.4",
+    "@storybook/theming": "5.1.0-alpha.4",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
diff --git a/app/angular/package.json b/app/angular/package.json
index 229f3581698..4bc6066bc52 100644
--- a/app/angular/package.json
+++ b/app/angular/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/angular",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "Storybook for Angular: Develop Angular Components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -26,8 +26,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.1.0-alpha.3",
-    "@storybook/node-logger": "5.1.0-alpha.3",
+    "@storybook/core": "5.1.0-alpha.4",
+    "@storybook/node-logger": "5.1.0-alpha.4",
     "angular2-template-loader": "^0.6.2",
     "core-js": "^2.6.5",
     "fork-ts-checker-webpack-plugin": "^0.5.2",
diff --git a/app/ember/package.json b/app/ember/package.json
index 9ffc0c8feb4..763e11c6e15 100644
--- a/app/ember/package.json
+++ b/app/ember/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/ember",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "Storybook for Ember: Develop Ember Component in isolation with Hot Reloading.",
   "homepage": "https://github.com/storybooks/storybook/tree/master/app/ember",
   "bugs": {
@@ -24,7 +24,7 @@
   },
   "dependencies": {
     "@ember/test-helpers": "^1.5.0",
-    "@storybook/core": "5.1.0-alpha.3",
+    "@storybook/core": "5.1.0-alpha.4",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
diff --git a/app/html/package.json b/app/html/package.json
index 9bcdcb1760f..a57d978637d 100644
--- a/app/html/package.json
+++ b/app/html/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/html",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "Storybook for HTML: View HTML snippets in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.1.0-alpha.3",
+    "@storybook/core": "5.1.0-alpha.4",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
diff --git a/app/marko/package.json b/app/marko/package.json
index 89567b4624d..c344b77e00d 100644
--- a/app/marko/package.json
+++ b/app/marko/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/marko",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "Storybook for Marko: Develop Marko Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -26,7 +26,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.1.0-alpha.3",
+    "@storybook/core": "5.1.0-alpha.4",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
diff --git a/app/mithril/package.json b/app/mithril/package.json
index 42a11f8bfc6..9e5e4c104de 100644
--- a/app/mithril/package.json
+++ b/app/mithril/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/mithril",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "Storybook for Mithril: Develop Mithril Component in isolation.",
   "keywords": [
     "storybook"
@@ -27,7 +27,7 @@
   },
   "dependencies": {
     "@babel/plugin-transform-react-jsx": "^7.3.0",
-    "@storybook/core": "5.1.0-alpha.3",
+    "@storybook/core": "5.1.0-alpha.4",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
diff --git a/app/polymer/package.json b/app/polymer/package.json
index 13e021d27d5..25bc9e0019b 100644
--- a/app/polymer/package.json
+++ b/app/polymer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/polymer",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "Storybook for Polymer: Develop Polymer components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.1.0-alpha.3",
+    "@storybook/core": "5.1.0-alpha.4",
     "@webcomponents/webcomponentsjs": "^1.2.0",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
diff --git a/app/preact/package.json b/app/preact/package.json
index 64a31cdb4bf..8b7c9814e90 100644
--- a/app/preact/package.json
+++ b/app/preact/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/preact",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "Storybook for Preact: Develop Preact Component in isolation.",
   "keywords": [
     "storybook"
@@ -27,7 +27,7 @@
   },
   "dependencies": {
     "@babel/plugin-transform-react-jsx": "^7.3.0",
-    "@storybook/core": "5.1.0-alpha.3",
+    "@storybook/core": "5.1.0-alpha.4",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
diff --git a/app/react-native/package.json b/app/react-native/package.json
index 4286d257ba8..c06dc6f9ebc 100644
--- a/app/react-native/package.json
+++ b/app/react-native/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@storybook/react-native",
   "private": true,
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "A better way to develop React Native Components for your app",
   "keywords": [
     "react",
@@ -27,12 +27,12 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.3",
-    "@storybook/channel-websocket": "5.1.0-alpha.3",
-    "@storybook/channels": "5.1.0-alpha.3",
-    "@storybook/core": "5.1.0-alpha.3",
-    "@storybook/core-events": "5.1.0-alpha.3",
-    "@storybook/ui": "5.1.0-alpha.3",
+    "@storybook/addons": "5.1.0-alpha.4",
+    "@storybook/channel-websocket": "5.1.0-alpha.4",
+    "@storybook/channels": "5.1.0-alpha.4",
+    "@storybook/core": "5.1.0-alpha.4",
+    "@storybook/core-events": "5.1.0-alpha.4",
+    "@storybook/ui": "5.1.0-alpha.4",
     "babel-loader": "^8.0.4",
     "babel-plugin-macros": "^2.4.5",
     "babel-plugin-syntax-async-functions": "^6.13.0",
diff --git a/app/react/package.json b/app/react/package.json
index 7ac2deeb9a6..64142cec87f 100644
--- a/app/react/package.json
+++ b/app/react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/react",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "Storybook for React: Develop React Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -29,8 +29,8 @@
     "@babel/plugin-transform-react-constant-elements": "^7.2.0",
     "@babel/preset-flow": "^7.0.0",
     "@babel/preset-react": "^7.0.0",
-    "@storybook/core": "5.1.0-alpha.3",
-    "@storybook/node-logger": "5.1.0-alpha.3",
+    "@storybook/core": "5.1.0-alpha.4",
+    "@storybook/node-logger": "5.1.0-alpha.4",
     "@svgr/webpack": "^4.0.3",
     "babel-plugin-named-asset-import": "^0.3.1",
     "babel-plugin-react-docgen": "^2.0.2",
diff --git a/app/riot/package.json b/app/riot/package.json
index 442a5b8180d..17455196ca0 100644
--- a/app/riot/package.json
+++ b/app/riot/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/riot",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "Storybook for riot.js: View riot snippets in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -25,7 +25,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.1.0-alpha.3",
+    "@storybook/core": "5.1.0-alpha.4",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
diff --git a/app/svelte/package.json b/app/svelte/package.json
index eb730a92d0d..17497ca7a01 100644
--- a/app/svelte/package.json
+++ b/app/svelte/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/svelte",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "Storybook for Svelte: Develop Svelte Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -26,7 +26,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.1.0-alpha.3",
+    "@storybook/core": "5.1.0-alpha.4",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
diff --git a/app/vue/package.json b/app/vue/package.json
index bd9a0530368..6b92d88861b 100644
--- a/app/vue/package.json
+++ b/app/vue/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/vue",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "Storybook for Vue: Develop Vue Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -26,7 +26,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/core": "5.1.0-alpha.3",
+    "@storybook/core": "5.1.0-alpha.4",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
diff --git a/examples/angular-cli/package.json b/examples/angular-cli/package.json
index 96ca5dd9d81..4a9105d85f4 100644
--- a/examples/angular-cli/package.json
+++ b/examples/angular-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "angular-cli",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "private": true,
   "license": "MIT",
   "scripts": {
@@ -34,18 +34,18 @@
     "@angular-devkit/build-angular": "^0.13.4",
     "@angular/cli": "^7.3.3",
     "@angular/compiler-cli": "^7.2.6",
-    "@storybook/addon-actions": "5.1.0-alpha.3",
-    "@storybook/addon-backgrounds": "5.1.0-alpha.3",
-    "@storybook/addon-centered": "5.1.0-alpha.3",
-    "@storybook/addon-jest": "5.1.0-alpha.3",
-    "@storybook/addon-knobs": "5.1.0-alpha.3",
-    "@storybook/addon-links": "5.1.0-alpha.3",
-    "@storybook/addon-notes": "5.1.0-alpha.3",
-    "@storybook/addon-options": "5.1.0-alpha.3",
-    "@storybook/addon-storyshots": "5.1.0-alpha.3",
-    "@storybook/addon-storysource": "5.1.0-alpha.3",
-    "@storybook/addons": "5.1.0-alpha.3",
-    "@storybook/angular": "5.1.0-alpha.3",
+    "@storybook/addon-actions": "5.1.0-alpha.4",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.4",
+    "@storybook/addon-centered": "5.1.0-alpha.4",
+    "@storybook/addon-jest": "5.1.0-alpha.4",
+    "@storybook/addon-knobs": "5.1.0-alpha.4",
+    "@storybook/addon-links": "5.1.0-alpha.4",
+    "@storybook/addon-notes": "5.1.0-alpha.4",
+    "@storybook/addon-options": "5.1.0-alpha.4",
+    "@storybook/addon-storyshots": "5.1.0-alpha.4",
+    "@storybook/addon-storysource": "5.1.0-alpha.4",
+    "@storybook/addons": "5.1.0-alpha.4",
+    "@storybook/angular": "5.1.0-alpha.4",
     "@types/core-js": "^2.5.0",
     "@types/jest": "^24.0.11",
     "@types/node": "~11.11.0",
diff --git a/examples/cra-kitchen-sink/package.json b/examples/cra-kitchen-sink/package.json
index 8098b54ff1a..a55e12e140c 100644
--- a/examples/cra-kitchen-sink/package.json
+++ b/examples/cra-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "cra-kitchen-sink",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -19,21 +19,21 @@
     "react-lifecycles-compat": "^3.0.4"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.1.0-alpha.3",
-    "@storybook/addon-actions": "5.1.0-alpha.3",
-    "@storybook/addon-backgrounds": "5.1.0-alpha.3",
-    "@storybook/addon-centered": "5.1.0-alpha.3",
-    "@storybook/addon-events": "5.1.0-alpha.3",
-    "@storybook/addon-info": "5.1.0-alpha.3",
-    "@storybook/addon-jest": "5.1.0-alpha.3",
-    "@storybook/addon-knobs": "5.1.0-alpha.3",
-    "@storybook/addon-links": "5.1.0-alpha.3",
-    "@storybook/addon-notes": "5.1.0-alpha.3",
-    "@storybook/addon-options": "5.1.0-alpha.3",
-    "@storybook/addon-storyshots": "5.1.0-alpha.3",
-    "@storybook/addons": "5.1.0-alpha.3",
-    "@storybook/client-logger": "5.1.0-alpha.3",
-    "@storybook/react": "5.1.0-alpha.3",
+    "@storybook/addon-a11y": "5.1.0-alpha.4",
+    "@storybook/addon-actions": "5.1.0-alpha.4",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.4",
+    "@storybook/addon-centered": "5.1.0-alpha.4",
+    "@storybook/addon-events": "5.1.0-alpha.4",
+    "@storybook/addon-info": "5.1.0-alpha.4",
+    "@storybook/addon-jest": "5.1.0-alpha.4",
+    "@storybook/addon-knobs": "5.1.0-alpha.4",
+    "@storybook/addon-links": "5.1.0-alpha.4",
+    "@storybook/addon-notes": "5.1.0-alpha.4",
+    "@storybook/addon-options": "5.1.0-alpha.4",
+    "@storybook/addon-storyshots": "5.1.0-alpha.4",
+    "@storybook/addons": "5.1.0-alpha.4",
+    "@storybook/client-logger": "5.1.0-alpha.4",
+    "@storybook/react": "5.1.0-alpha.4",
     "enzyme": "^3.9.0",
     "enzyme-adapter-react-16": "^1.9.1",
     "enzyme-to-json": "^3.3.5",
diff --git a/examples/cra-ts-kitchen-sink/package.json b/examples/cra-ts-kitchen-sink/package.json
index de5e8377335..e0ce9e85c48 100644
--- a/examples/cra-ts-kitchen-sink/package.json
+++ b/examples/cra-ts-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "cra-ts-kitchen-sink",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -20,11 +20,11 @@
     "react-dom": "^16.8.3"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.1.0-alpha.3",
-    "@storybook/addon-info": "5.1.0-alpha.3",
-    "@storybook/addon-options": "5.1.0-alpha.3",
-    "@storybook/addons": "5.1.0-alpha.3",
-    "@storybook/react": "5.1.0-alpha.3",
+    "@storybook/addon-actions": "5.1.0-alpha.4",
+    "@storybook/addon-info": "5.1.0-alpha.4",
+    "@storybook/addon-options": "5.1.0-alpha.4",
+    "@storybook/addons": "5.1.0-alpha.4",
+    "@storybook/react": "5.1.0-alpha.4",
     "@types/enzyme": "^3.9.0",
     "@types/react": "^16.8.4",
     "@types/react-dom": "^16.8.2",
diff --git a/examples/ember-cli/package.json b/examples/ember-cli/package.json
index 91532999a4c..d6aed1519b3 100644
--- a/examples/ember-cli/package.json
+++ b/examples/ember-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "ember-example",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -15,18 +15,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.3.4",
-    "@storybook/addon-a11y": "5.1.0-alpha.3",
-    "@storybook/addon-actions": "5.1.0-alpha.3",
-    "@storybook/addon-backgrounds": "5.1.0-alpha.3",
-    "@storybook/addon-centered": "5.1.0-alpha.3",
-    "@storybook/addon-knobs": "5.1.0-alpha.3",
-    "@storybook/addon-links": "5.1.0-alpha.3",
-    "@storybook/addon-notes": "5.1.0-alpha.3",
-    "@storybook/addon-options": "5.1.0-alpha.3",
-    "@storybook/addon-storysource": "5.1.0-alpha.3",
-    "@storybook/addon-viewport": "5.1.0-alpha.3",
-    "@storybook/addons": "5.1.0-alpha.3",
-    "@storybook/ember": "5.1.0-alpha.3",
+    "@storybook/addon-a11y": "5.1.0-alpha.4",
+    "@storybook/addon-actions": "5.1.0-alpha.4",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.4",
+    "@storybook/addon-centered": "5.1.0-alpha.4",
+    "@storybook/addon-knobs": "5.1.0-alpha.4",
+    "@storybook/addon-links": "5.1.0-alpha.4",
+    "@storybook/addon-notes": "5.1.0-alpha.4",
+    "@storybook/addon-options": "5.1.0-alpha.4",
+    "@storybook/addon-storysource": "5.1.0-alpha.4",
+    "@storybook/addon-viewport": "5.1.0-alpha.4",
+    "@storybook/addons": "5.1.0-alpha.4",
+    "@storybook/ember": "5.1.0-alpha.4",
     "babel-loader": "^8",
     "broccoli-asset-rev": "^3.0.0",
     "cross-env": "^5.2.0",
diff --git a/examples/html-kitchen-sink/package.json b/examples/html-kitchen-sink/package.json
index e25f40df4bf..55d12a57038 100644
--- a/examples/html-kitchen-sink/package.json
+++ b/examples/html-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "html-kitchen-sink",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "private": true,
   "description": "",
   "keywords": [],
@@ -14,23 +14,23 @@
     "storybook": "start-storybook -p 9006"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.1.0-alpha.3",
-    "@storybook/addon-actions": "5.1.0-alpha.3",
-    "@storybook/addon-backgrounds": "5.1.0-alpha.3",
-    "@storybook/addon-centered": "5.1.0-alpha.3",
-    "@storybook/addon-events": "5.1.0-alpha.3",
-    "@storybook/addon-jest": "5.1.0-alpha.3",
-    "@storybook/addon-knobs": "5.1.0-alpha.3",
-    "@storybook/addon-links": "5.1.0-alpha.3",
-    "@storybook/addon-notes": "5.1.0-alpha.3",
-    "@storybook/addon-options": "5.1.0-alpha.3",
-    "@storybook/addon-storyshots": "5.1.0-alpha.3",
-    "@storybook/addon-storysource": "5.1.0-alpha.3",
-    "@storybook/addon-viewport": "5.1.0-alpha.3",
-    "@storybook/addons": "5.1.0-alpha.3",
-    "@storybook/core": "5.1.0-alpha.3",
-    "@storybook/core-events": "5.1.0-alpha.3",
-    "@storybook/html": "5.1.0-alpha.3",
+    "@storybook/addon-a11y": "5.1.0-alpha.4",
+    "@storybook/addon-actions": "5.1.0-alpha.4",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.4",
+    "@storybook/addon-centered": "5.1.0-alpha.4",
+    "@storybook/addon-events": "5.1.0-alpha.4",
+    "@storybook/addon-jest": "5.1.0-alpha.4",
+    "@storybook/addon-knobs": "5.1.0-alpha.4",
+    "@storybook/addon-links": "5.1.0-alpha.4",
+    "@storybook/addon-notes": "5.1.0-alpha.4",
+    "@storybook/addon-options": "5.1.0-alpha.4",
+    "@storybook/addon-storyshots": "5.1.0-alpha.4",
+    "@storybook/addon-storysource": "5.1.0-alpha.4",
+    "@storybook/addon-viewport": "5.1.0-alpha.4",
+    "@storybook/addons": "5.1.0-alpha.4",
+    "@storybook/core": "5.1.0-alpha.4",
+    "@storybook/core-events": "5.1.0-alpha.4",
+    "@storybook/html": "5.1.0-alpha.4",
     "eventemitter3": "^3.1.0",
     "format-json": "^1.0.3",
     "global": "^4.3.2",
diff --git a/examples/marko-cli/package.json b/examples/marko-cli/package.json
index 539c58ab543..b5c03b1f87e 100644
--- a/examples/marko-cli/package.json
+++ b/examples/marko-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "marko-cli",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "private": true,
   "description": "Demo of how to build an app using marko-starter",
   "repository": {
@@ -24,12 +24,12 @@
     "marko-starter": "^2.0.4"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.1.0-alpha.3",
-    "@storybook/addon-knobs": "5.1.0-alpha.3",
-    "@storybook/addon-options": "5.1.0-alpha.3",
-    "@storybook/addon-storysource": "5.1.0-alpha.3",
-    "@storybook/addons": "5.1.0-alpha.3",
-    "@storybook/marko": "5.1.0-alpha.3",
+    "@storybook/addon-actions": "5.1.0-alpha.4",
+    "@storybook/addon-knobs": "5.1.0-alpha.4",
+    "@storybook/addon-options": "5.1.0-alpha.4",
+    "@storybook/addon-storysource": "5.1.0-alpha.4",
+    "@storybook/addons": "5.1.0-alpha.4",
+    "@storybook/marko": "5.1.0-alpha.4",
     "prettier": "^1.16.4",
     "webpack": "^4.29.6"
   }
diff --git a/examples/mithril-kitchen-sink/package.json b/examples/mithril-kitchen-sink/package.json
index 0bc6c2f8c53..b2ee0f869ba 100644
--- a/examples/mithril-kitchen-sink/package.json
+++ b/examples/mithril-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "mithril-example",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -11,18 +11,18 @@
     "mithril": "^1.1.6"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.1.0-alpha.3",
-    "@storybook/addon-backgrounds": "5.1.0-alpha.3",
-    "@storybook/addon-centered": "5.1.0-alpha.3",
-    "@storybook/addon-knobs": "5.1.0-alpha.3",
-    "@storybook/addon-links": "5.1.0-alpha.3",
-    "@storybook/addon-notes": "5.1.0-alpha.3",
-    "@storybook/addon-options": "5.1.0-alpha.3",
-    "@storybook/addon-storyshots": "5.1.0-alpha.3",
-    "@storybook/addon-storysource": "5.1.0-alpha.3",
-    "@storybook/addon-viewport": "5.1.0-alpha.3",
-    "@storybook/addons": "5.1.0-alpha.3",
-    "@storybook/mithril": "5.1.0-alpha.3",
+    "@storybook/addon-actions": "5.1.0-alpha.4",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.4",
+    "@storybook/addon-centered": "5.1.0-alpha.4",
+    "@storybook/addon-knobs": "5.1.0-alpha.4",
+    "@storybook/addon-links": "5.1.0-alpha.4",
+    "@storybook/addon-notes": "5.1.0-alpha.4",
+    "@storybook/addon-options": "5.1.0-alpha.4",
+    "@storybook/addon-storyshots": "5.1.0-alpha.4",
+    "@storybook/addon-storysource": "5.1.0-alpha.4",
+    "@storybook/addon-viewport": "5.1.0-alpha.4",
+    "@storybook/addons": "5.1.0-alpha.4",
+    "@storybook/mithril": "5.1.0-alpha.4",
     "webpack": "^4.29.6"
   }
 }
diff --git a/examples/official-storybook/package.json b/examples/official-storybook/package.json
index ba24ac72d6e..847b561530c 100644
--- a/examples/official-storybook/package.json
+++ b/examples/official-storybook/package.json
@@ -1,6 +1,6 @@
 {
   "name": "official-storybook",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -13,29 +13,29 @@
     "storybook": "cross-env STORYBOOK_DISPLAY_WARNING=true DISPLAY_WARNING=true start-storybook -p 9011 -c ./ -s built-storybooks --no-dll"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "5.1.0-alpha.3",
-    "@storybook/addon-actions": "5.1.0-alpha.3",
-    "@storybook/addon-backgrounds": "5.1.0-alpha.3",
-    "@storybook/addon-centered": "5.1.0-alpha.3",
-    "@storybook/addon-cssresources": "5.1.0-alpha.3",
-    "@storybook/addon-events": "5.1.0-alpha.3",
-    "@storybook/addon-graphql": "5.1.0-alpha.3",
-    "@storybook/addon-info": "5.1.0-alpha.3",
-    "@storybook/addon-jest": "5.1.0-alpha.3",
-    "@storybook/addon-knobs": "5.1.0-alpha.3",
-    "@storybook/addon-links": "5.1.0-alpha.3",
-    "@storybook/addon-notes": "5.1.0-alpha.3",
-    "@storybook/addon-options": "5.1.0-alpha.3",
-    "@storybook/addon-storyshots": "5.1.0-alpha.3",
-    "@storybook/addon-storyshots-puppeteer": "5.1.0-alpha.3",
-    "@storybook/addon-storysource": "5.1.0-alpha.3",
-    "@storybook/addon-viewport": "5.1.0-alpha.3",
-    "@storybook/addons": "5.1.0-alpha.3",
-    "@storybook/components": "5.1.0-alpha.3",
-    "@storybook/core-events": "5.1.0-alpha.3",
-    "@storybook/node-logger": "5.1.0-alpha.3",
-    "@storybook/react": "5.1.0-alpha.3",
-    "@storybook/theming": "5.1.0-alpha.3",
+    "@storybook/addon-a11y": "5.1.0-alpha.4",
+    "@storybook/addon-actions": "5.1.0-alpha.4",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.4",
+    "@storybook/addon-centered": "5.1.0-alpha.4",
+    "@storybook/addon-cssresources": "5.1.0-alpha.4",
+    "@storybook/addon-events": "5.1.0-alpha.4",
+    "@storybook/addon-graphql": "5.1.0-alpha.4",
+    "@storybook/addon-info": "5.1.0-alpha.4",
+    "@storybook/addon-jest": "5.1.0-alpha.4",
+    "@storybook/addon-knobs": "5.1.0-alpha.4",
+    "@storybook/addon-links": "5.1.0-alpha.4",
+    "@storybook/addon-notes": "5.1.0-alpha.4",
+    "@storybook/addon-options": "5.1.0-alpha.4",
+    "@storybook/addon-storyshots": "5.1.0-alpha.4",
+    "@storybook/addon-storyshots-puppeteer": "5.1.0-alpha.4",
+    "@storybook/addon-storysource": "5.1.0-alpha.4",
+    "@storybook/addon-viewport": "5.1.0-alpha.4",
+    "@storybook/addons": "5.1.0-alpha.4",
+    "@storybook/components": "5.1.0-alpha.4",
+    "@storybook/core-events": "5.1.0-alpha.4",
+    "@storybook/node-logger": "5.1.0-alpha.4",
+    "@storybook/react": "5.1.0-alpha.4",
+    "@storybook/theming": "5.1.0-alpha.4",
     "cors": "^2.8.5",
     "cross-env": "^5.2.0",
     "enzyme-to-json": "^3.3.5",
diff --git a/examples/polymer-cli/package.json b/examples/polymer-cli/package.json
index 3303cbc8504..a10f2568e7b 100644
--- a/examples/polymer-cli/package.json
+++ b/examples/polymer-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "polymer-cli",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -10,15 +10,15 @@
   },
   "dependencies": {
     "@polymer/polymer": "^2.6.0",
-    "@storybook/addon-actions": "5.1.0-alpha.3",
-    "@storybook/addon-backgrounds": "5.1.0-alpha.3",
-    "@storybook/addon-knobs": "5.1.0-alpha.3",
-    "@storybook/addon-links": "5.1.0-alpha.3",
-    "@storybook/addon-notes": "5.1.0-alpha.3",
-    "@storybook/addon-options": "5.1.0-alpha.3",
-    "@storybook/addon-storysource": "5.1.0-alpha.3",
-    "@storybook/addon-viewport": "5.1.0-alpha.3",
-    "@storybook/polymer": "5.1.0-alpha.3",
+    "@storybook/addon-actions": "5.1.0-alpha.4",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.4",
+    "@storybook/addon-knobs": "5.1.0-alpha.4",
+    "@storybook/addon-links": "5.1.0-alpha.4",
+    "@storybook/addon-notes": "5.1.0-alpha.4",
+    "@storybook/addon-options": "5.1.0-alpha.4",
+    "@storybook/addon-storysource": "5.1.0-alpha.4",
+    "@storybook/addon-viewport": "5.1.0-alpha.4",
+    "@storybook/polymer": "5.1.0-alpha.4",
     "@webcomponents/webcomponentsjs": "^1.2.0",
     "global": "^4.3.2",
     "lit-html": "^1.0.0",
diff --git a/examples/preact-kitchen-sink/package.json b/examples/preact-kitchen-sink/package.json
index c0b640d338e..77f8246f0ef 100644
--- a/examples/preact-kitchen-sink/package.json
+++ b/examples/preact-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "preact-example",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -16,18 +16,18 @@
   "devDependencies": {
     "@babel/core": "^7.3.4",
     "@babel/plugin-transform-runtime": "^7.2.0",
-    "@storybook/addon-actions": "5.1.0-alpha.3",
-    "@storybook/addon-backgrounds": "5.1.0-alpha.3",
-    "@storybook/addon-centered": "5.1.0-alpha.3",
-    "@storybook/addon-knobs": "5.1.0-alpha.3",
-    "@storybook/addon-links": "5.1.0-alpha.3",
-    "@storybook/addon-notes": "5.1.0-alpha.3",
-    "@storybook/addon-options": "5.1.0-alpha.3",
-    "@storybook/addon-storyshots": "5.1.0-alpha.3",
-    "@storybook/addon-storysource": "5.1.0-alpha.3",
-    "@storybook/addon-viewport": "5.1.0-alpha.3",
-    "@storybook/addons": "5.1.0-alpha.3",
-    "@storybook/preact": "5.1.0-alpha.3",
+    "@storybook/addon-actions": "5.1.0-alpha.4",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.4",
+    "@storybook/addon-centered": "5.1.0-alpha.4",
+    "@storybook/addon-knobs": "5.1.0-alpha.4",
+    "@storybook/addon-links": "5.1.0-alpha.4",
+    "@storybook/addon-notes": "5.1.0-alpha.4",
+    "@storybook/addon-options": "5.1.0-alpha.4",
+    "@storybook/addon-storyshots": "5.1.0-alpha.4",
+    "@storybook/addon-storysource": "5.1.0-alpha.4",
+    "@storybook/addon-viewport": "5.1.0-alpha.4",
+    "@storybook/addons": "5.1.0-alpha.4",
+    "@storybook/preact": "5.1.0-alpha.4",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
     "file-loader": "^3.0.1",
diff --git a/examples/riot-kitchen-sink/package.json b/examples/riot-kitchen-sink/package.json
index e40fad4dd4d..09569fe0def 100644
--- a/examples/riot-kitchen-sink/package.json
+++ b/examples/riot-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "riot-example",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -16,18 +16,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.3.4",
-    "@storybook/addon-actions": "5.1.0-alpha.3",
-    "@storybook/addon-backgrounds": "5.1.0-alpha.3",
-    "@storybook/addon-centered": "5.1.0-alpha.3",
-    "@storybook/addon-knobs": "5.1.0-alpha.3",
-    "@storybook/addon-links": "5.1.0-alpha.3",
-    "@storybook/addon-notes": "5.1.0-alpha.3",
-    "@storybook/addon-options": "5.1.0-alpha.3",
-    "@storybook/addon-storyshots": "5.1.0-alpha.3",
-    "@storybook/addon-storysource": "5.1.0-alpha.3",
-    "@storybook/addon-viewport": "5.1.0-alpha.3",
-    "@storybook/addons": "5.1.0-alpha.3",
-    "@storybook/riot": "5.1.0-alpha.3",
+    "@storybook/addon-actions": "5.1.0-alpha.4",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.4",
+    "@storybook/addon-centered": "5.1.0-alpha.4",
+    "@storybook/addon-knobs": "5.1.0-alpha.4",
+    "@storybook/addon-links": "5.1.0-alpha.4",
+    "@storybook/addon-notes": "5.1.0-alpha.4",
+    "@storybook/addon-options": "5.1.0-alpha.4",
+    "@storybook/addon-storyshots": "5.1.0-alpha.4",
+    "@storybook/addon-storysource": "5.1.0-alpha.4",
+    "@storybook/addon-viewport": "5.1.0-alpha.4",
+    "@storybook/addons": "5.1.0-alpha.4",
+    "@storybook/riot": "5.1.0-alpha.4",
     "babel-loader": "^8.0.4",
     "cross-env": "^5.2.0",
     "file-loader": "^3.0.1",
diff --git a/examples/svelte-kitchen-sink/package.json b/examples/svelte-kitchen-sink/package.json
index 0ce091b8378..bc2a10af420 100644
--- a/examples/svelte-kitchen-sink/package.json
+++ b/examples/svelte-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "svelte-example",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -11,17 +11,17 @@
     "global": "^4.3.2"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.1.0-alpha.3",
-    "@storybook/addon-backgrounds": "5.1.0-alpha.3",
-    "@storybook/addon-centered": "5.1.0-alpha.3",
-    "@storybook/addon-knobs": "5.1.0-alpha.3",
-    "@storybook/addon-links": "5.1.0-alpha.3",
-    "@storybook/addon-notes": "5.1.0-alpha.3",
-    "@storybook/addon-options": "5.1.0-alpha.3",
-    "@storybook/addon-storyshots": "5.1.0-alpha.3",
-    "@storybook/addon-storysource": "5.1.0-alpha.3",
-    "@storybook/addon-viewport": "5.1.0-alpha.3",
-    "@storybook/addons": "5.1.0-alpha.3",
-    "@storybook/svelte": "5.1.0-alpha.3"
+    "@storybook/addon-actions": "5.1.0-alpha.4",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.4",
+    "@storybook/addon-centered": "5.1.0-alpha.4",
+    "@storybook/addon-knobs": "5.1.0-alpha.4",
+    "@storybook/addon-links": "5.1.0-alpha.4",
+    "@storybook/addon-notes": "5.1.0-alpha.4",
+    "@storybook/addon-options": "5.1.0-alpha.4",
+    "@storybook/addon-storyshots": "5.1.0-alpha.4",
+    "@storybook/addon-storysource": "5.1.0-alpha.4",
+    "@storybook/addon-viewport": "5.1.0-alpha.4",
+    "@storybook/addons": "5.1.0-alpha.4",
+    "@storybook/svelte": "5.1.0-alpha.4"
   }
 }
diff --git a/examples/vue-kitchen-sink/package.json b/examples/vue-kitchen-sink/package.json
index 8e9c19ae576..5ed7a7e2530 100644
--- a/examples/vue-kitchen-sink/package.json
+++ b/examples/vue-kitchen-sink/package.json
@@ -1,6 +1,6 @@
 {
   "name": "vue-example",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "private": true,
   "scripts": {
     "now-build": "node ../../scripts/bootstrap --core && yarn run build-storybook --quiet",
@@ -15,18 +15,18 @@
   },
   "devDependencies": {
     "@babel/core": "^7.3.4",
-    "@storybook/addon-actions": "5.1.0-alpha.3",
-    "@storybook/addon-backgrounds": "5.1.0-alpha.3",
-    "@storybook/addon-centered": "5.1.0-alpha.3",
-    "@storybook/addon-knobs": "5.1.0-alpha.3",
-    "@storybook/addon-links": "5.1.0-alpha.3",
-    "@storybook/addon-notes": "5.1.0-alpha.3",
-    "@storybook/addon-options": "5.1.0-alpha.3",
-    "@storybook/addon-storyshots": "5.1.0-alpha.3",
-    "@storybook/addon-storysource": "5.1.0-alpha.3",
-    "@storybook/addon-viewport": "5.1.0-alpha.3",
-    "@storybook/addons": "5.1.0-alpha.3",
-    "@storybook/vue": "5.1.0-alpha.3",
+    "@storybook/addon-actions": "5.1.0-alpha.4",
+    "@storybook/addon-backgrounds": "5.1.0-alpha.4",
+    "@storybook/addon-centered": "5.1.0-alpha.4",
+    "@storybook/addon-knobs": "5.1.0-alpha.4",
+    "@storybook/addon-links": "5.1.0-alpha.4",
+    "@storybook/addon-notes": "5.1.0-alpha.4",
+    "@storybook/addon-options": "5.1.0-alpha.4",
+    "@storybook/addon-storyshots": "5.1.0-alpha.4",
+    "@storybook/addon-storysource": "5.1.0-alpha.4",
+    "@storybook/addon-viewport": "5.1.0-alpha.4",
+    "@storybook/addons": "5.1.0-alpha.4",
+    "@storybook/vue": "5.1.0-alpha.4",
     "babel-core": "^7.0.0-bridge.0",
     "babel-loader": "^8.0.5",
     "cross-env": "^5.2.0",
diff --git a/lerna.json b/lerna.json
index a46981916e5..53c882060dc 100644
--- a/lerna.json
+++ b/lerna.json
@@ -11,5 +11,5 @@
   "npmClient": "yarn",
   "useWorkspaces": true,
   "registry": "https://registry.npmjs.org",
-  "version": "5.1.0-alpha.3"
+  "version": "5.1.0-alpha.4"
 }
diff --git a/lib/addons/package.json b/lib/addons/package.json
index 155e4745f57..a4a06393b3e 100644
--- a/lib/addons/package.json
+++ b/lib/addons/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addons",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "Storybook addons store",
   "keywords": [
     "storybook"
@@ -21,8 +21,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.1.0-alpha.3",
-    "@storybook/client-logger": "5.1.0-alpha.3",
+    "@storybook/channels": "5.1.0-alpha.4",
+    "@storybook/client-logger": "5.1.0-alpha.4",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "util-deprecate": "^1.0.2"
diff --git a/lib/channel-postmessage/package.json b/lib/channel-postmessage/package.json
index cf290f39b7b..aada587da73 100644
--- a/lib/channel-postmessage/package.json
+++ b/lib/channel-postmessage/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channel-postmessage",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "",
   "keywords": [
     "storybook"
@@ -21,8 +21,8 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.1.0-alpha.3",
-    "@storybook/client-logger": "5.1.0-alpha.3",
+    "@storybook/channels": "5.1.0-alpha.4",
+    "@storybook/client-logger": "5.1.0-alpha.4",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "telejson": "^2.1.1"
diff --git a/lib/channel-websocket/package.json b/lib/channel-websocket/package.json
index 9e268f4e2c6..44e2675b767 100644
--- a/lib/channel-websocket/package.json
+++ b/lib/channel-websocket/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channel-websocket",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "",
   "keywords": [
     "storybook"
@@ -21,7 +21,7 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/channels": "5.1.0-alpha.3",
+    "@storybook/channels": "5.1.0-alpha.4",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "json-fn": "^1.1.1"
diff --git a/lib/channels/package.json b/lib/channels/package.json
index 63b67609f66..ffd048eb8f9 100644
--- a/lib/channels/package.json
+++ b/lib/channels/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/channels",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/cli/package.json b/lib/cli/package.json
index f270581e1d3..ce682191e1b 100644
--- a/lib/cli/package.json
+++ b/lib/cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/cli",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "Storybook's CLI - easiest method of adding storybook to your projects",
   "keywords": [
     "cli",
@@ -30,7 +30,7 @@
     "@babel/core": "^7.3.4",
     "@babel/preset-env": "^7.3.4",
     "@babel/register": "^7.0.0",
-    "@storybook/codemod": "5.1.0-alpha.3",
+    "@storybook/codemod": "5.1.0-alpha.4",
     "chalk": "^2.4.1",
     "commander": "^2.19.0",
     "core-js": "^2.6.5",
@@ -44,31 +44,31 @@
     "update-notifier": "^2.5.0"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "5.1.0-alpha.3",
-    "@storybook/addon-centered": "5.1.0-alpha.3",
-    "@storybook/addon-graphql": "5.1.0-alpha.3",
-    "@storybook/addon-info": "5.1.0-alpha.3",
-    "@storybook/addon-knobs": "5.1.0-alpha.3",
-    "@storybook/addon-links": "5.1.0-alpha.3",
-    "@storybook/addon-notes": "5.1.0-alpha.3",
-    "@storybook/addon-options": "5.1.0-alpha.3",
-    "@storybook/addon-storyshots": "5.1.0-alpha.3",
-    "@storybook/addons": "5.1.0-alpha.3",
-    "@storybook/angular": "5.1.0-alpha.3",
-    "@storybook/channel-postmessage": "5.1.0-alpha.3",
-    "@storybook/channel-websocket": "5.1.0-alpha.3",
-    "@storybook/channels": "5.1.0-alpha.3",
-    "@storybook/ember": "5.1.0-alpha.3",
-    "@storybook/html": "5.1.0-alpha.3",
-    "@storybook/marko": "5.1.0-alpha.3",
-    "@storybook/mithril": "5.1.0-alpha.3",
-    "@storybook/polymer": "5.1.0-alpha.3",
-    "@storybook/preact": "5.1.0-alpha.3",
-    "@storybook/react": "5.1.0-alpha.3",
-    "@storybook/react-native": "5.1.0-alpha.3",
-    "@storybook/riot": "5.1.0-alpha.3",
-    "@storybook/ui": "5.1.0-alpha.3",
-    "@storybook/vue": "5.1.0-alpha.3"
+    "@storybook/addon-actions": "5.1.0-alpha.4",
+    "@storybook/addon-centered": "5.1.0-alpha.4",
+    "@storybook/addon-graphql": "5.1.0-alpha.4",
+    "@storybook/addon-info": "5.1.0-alpha.4",
+    "@storybook/addon-knobs": "5.1.0-alpha.4",
+    "@storybook/addon-links": "5.1.0-alpha.4",
+    "@storybook/addon-notes": "5.1.0-alpha.4",
+    "@storybook/addon-options": "5.1.0-alpha.4",
+    "@storybook/addon-storyshots": "5.1.0-alpha.4",
+    "@storybook/addons": "5.1.0-alpha.4",
+    "@storybook/angular": "5.1.0-alpha.4",
+    "@storybook/channel-postmessage": "5.1.0-alpha.4",
+    "@storybook/channel-websocket": "5.1.0-alpha.4",
+    "@storybook/channels": "5.1.0-alpha.4",
+    "@storybook/ember": "5.1.0-alpha.4",
+    "@storybook/html": "5.1.0-alpha.4",
+    "@storybook/marko": "5.1.0-alpha.4",
+    "@storybook/mithril": "5.1.0-alpha.4",
+    "@storybook/polymer": "5.1.0-alpha.4",
+    "@storybook/preact": "5.1.0-alpha.4",
+    "@storybook/react": "5.1.0-alpha.4",
+    "@storybook/react-native": "5.1.0-alpha.4",
+    "@storybook/riot": "5.1.0-alpha.4",
+    "@storybook/ui": "5.1.0-alpha.4",
+    "@storybook/vue": "5.1.0-alpha.4"
   },
   "publishConfig": {
     "access": "public"
diff --git a/lib/client-api/package.json b/lib/client-api/package.json
index 975b3441f33..5a0fc25da5d 100644
--- a/lib/client-api/package.json
+++ b/lib/client-api/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/client-api",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "Storybook Client API",
   "keywords": [
     "storybook"
@@ -20,10 +20,10 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.3",
-    "@storybook/client-logger": "5.1.0-alpha.3",
-    "@storybook/core-events": "5.1.0-alpha.3",
-    "@storybook/router": "5.1.0-alpha.3",
+    "@storybook/addons": "5.1.0-alpha.4",
+    "@storybook/client-logger": "5.1.0-alpha.4",
+    "@storybook/core-events": "5.1.0-alpha.4",
+    "@storybook/router": "5.1.0-alpha.4",
     "common-tags": "^1.8.0",
     "eventemitter3": "^3.1.0",
     "global": "^4.3.2",
diff --git a/lib/client-logger/package.json b/lib/client-logger/package.json
index 0a024cbfdfb..b726879273a 100644
--- a/lib/client-logger/package.json
+++ b/lib/client-logger/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/client-logger",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/codemod/package.json b/lib/codemod/package.json
index 326d56a1b38..f8bcf263446 100644
--- a/lib/codemod/package.json
+++ b/lib/codemod/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/codemod",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "A collection of codemod scripts written with JSCodeshift",
   "keywords": [
     "storybook"
diff --git a/lib/components/package.json b/lib/components/package.json
index 0218e20c435..94dd7cbea5a 100644
--- a/lib/components/package.json
+++ b/lib/components/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/components",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "Core Storybook Components",
   "keywords": [
     "storybook"
@@ -21,11 +21,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.3",
-    "@storybook/client-logger": "5.1.0-alpha.3",
-    "@storybook/core-events": "5.1.0-alpha.3",
-    "@storybook/router": "5.1.0-alpha.3",
-    "@storybook/theming": "5.1.0-alpha.3",
+    "@storybook/addons": "5.1.0-alpha.4",
+    "@storybook/client-logger": "5.1.0-alpha.4",
+    "@storybook/core-events": "5.1.0-alpha.4",
+    "@storybook/router": "5.1.0-alpha.4",
+    "@storybook/theming": "5.1.0-alpha.4",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "js-beautify": "^1.8.9",
diff --git a/lib/core-events/package.json b/lib/core-events/package.json
index 703ddc04a32..7c243e33093 100644
--- a/lib/core-events/package.json
+++ b/lib/core-events/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/core-events",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "Event names used in storybook core",
   "keywords": [
     "storybook"
diff --git a/lib/core/package.json b/lib/core/package.json
index 04e0eb422b0..d2d1a5bed77 100644
--- a/lib/core/package.json
+++ b/lib/core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/core",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "Storybook framework-agnostic API",
   "keywords": [
     "storybook"
@@ -25,14 +25,14 @@
     "@babel/plugin-syntax-dynamic-import": "^7.2.0",
     "@babel/plugin-transform-react-constant-elements": "^7.2.0",
     "@babel/preset-env": "^7.3.4",
-    "@storybook/addons": "5.1.0-alpha.3",
-    "@storybook/channel-postmessage": "5.1.0-alpha.3",
-    "@storybook/client-api": "5.1.0-alpha.3",
-    "@storybook/client-logger": "5.1.0-alpha.3",
-    "@storybook/core-events": "5.1.0-alpha.3",
-    "@storybook/node-logger": "5.1.0-alpha.3",
-    "@storybook/router": "5.1.0-alpha.3",
-    "@storybook/ui": "5.1.0-alpha.3",
+    "@storybook/addons": "5.1.0-alpha.4",
+    "@storybook/channel-postmessage": "5.1.0-alpha.4",
+    "@storybook/client-api": "5.1.0-alpha.4",
+    "@storybook/client-logger": "5.1.0-alpha.4",
+    "@storybook/core-events": "5.1.0-alpha.4",
+    "@storybook/node-logger": "5.1.0-alpha.4",
+    "@storybook/router": "5.1.0-alpha.4",
+    "@storybook/ui": "5.1.0-alpha.4",
     "airbnb-js-shims": "^1 || ^2",
     "autoprefixer": "^9.4.9",
     "babel-plugin-add-react-displayname": "^0.0.5",
diff --git a/lib/node-logger/package.json b/lib/node-logger/package.json
index 4b3b7464c34..01e76c3aee3 100644
--- a/lib/node-logger/package.json
+++ b/lib/node-logger/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/node-logger",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "",
   "keywords": [
     "storybook"
diff --git a/lib/router/package.json b/lib/router/package.json
index f9cd1ab10c0..8dc75c804ec 100644
--- a/lib/router/package.json
+++ b/lib/router/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/router",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "Core Storybook Router",
   "keywords": [
     "storybook"
@@ -21,7 +21,7 @@
   },
   "dependencies": {
     "@reach/router": "^1.2.1",
-    "@storybook/theming": "5.1.0-alpha.3",
+    "@storybook/theming": "5.1.0-alpha.4",
     "core-js": "^2.6.5",
     "global": "^4.3.2",
     "memoizerific": "^1.11.3",
diff --git a/lib/theming/package.json b/lib/theming/package.json
index 9e018f7ae9d..c8130df21cd 100644
--- a/lib/theming/package.json
+++ b/lib/theming/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/theming",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "Core Storybook Components",
   "keywords": [
     "storybook"
@@ -23,7 +23,7 @@
   "dependencies": {
     "@emotion/core": "^10.0.7",
     "@emotion/styled": "^10.0.7",
-    "@storybook/client-logger": "5.1.0-alpha.3",
+    "@storybook/client-logger": "5.1.0-alpha.4",
     "common-tags": "^1.8.0",
     "core-js": "^2.6.5",
     "deep-object-diff": "^1.1.0",
diff --git a/lib/ui/package.json b/lib/ui/package.json
index cf14e7c5cf6..a6476956b23 100644
--- a/lib/ui/package.json
+++ b/lib/ui/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/ui",
-  "version": "5.1.0-alpha.3",
+  "version": "5.1.0-alpha.4",
   "description": "Core Storybook UI",
   "keywords": [
     "storybook"
@@ -22,12 +22,12 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.3",
-    "@storybook/client-logger": "5.1.0-alpha.3",
-    "@storybook/components": "5.1.0-alpha.3",
-    "@storybook/core-events": "5.1.0-alpha.3",
-    "@storybook/router": "5.1.0-alpha.3",
-    "@storybook/theming": "5.1.0-alpha.3",
+    "@storybook/addons": "5.1.0-alpha.4",
+    "@storybook/client-logger": "5.1.0-alpha.4",
+    "@storybook/components": "5.1.0-alpha.4",
+    "@storybook/core-events": "5.1.0-alpha.4",
+    "@storybook/router": "5.1.0-alpha.4",
+    "@storybook/theming": "5.1.0-alpha.4",
     "core-js": "^2.6.5",
     "fast-deep-equal": "^2.0.1",
     "fuzzy-search": "^3.0.1",

From 3f94f5b79339000046a2c8ff84a3998d8ed20a42 Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Mon, 11 Mar 2019 22:52:46 +0800
Subject: [PATCH 246/249] 5.1.0-alpha.4 versions.json

---
 docs/src/versions/next.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/docs/src/versions/next.json b/docs/src/versions/next.json
index 13f7aa6a476..e0acab9ec1d 100644
--- a/docs/src/versions/next.json
+++ b/docs/src/versions/next.json
@@ -1 +1 @@
-{"version":"5.1.0-alpha.3","info":{"plain":"### Features\n\n* Addon-a11y: add 'incomplete' tab ([#5984](https://github.com/storybooks/storybook/pull/5984))\n\n### Bug Fixes\n\n* Core: fix `selectStory` with one parameter ([#5983](https://github.com/storybooks/storybook/pull/5983))\n* Core: remove custom presets warning ([#5911](https://github.com/storybooks/storybook/pull/5911))\n\n### Maintenance\n\n* Addon-viewport: Change styling to more closely match v4 ([#5979](https://github.com/storybooks/storybook/pull/5979))\n\n### Dependency Upgrades\n\n* Bump babel-preset-react-app from 7.0.1 to 7.0.2 ([#5937](https://github.com/storybooks/storybook/pull/5937))\n* Bump ts-node from 8.0.2 to 8.0.3 ([#5938](https://github.com/storybooks/storybook/pull/5938))\n* Bump react from 16.8.3 to 16.8.4 ([#5902](https://github.com/storybooks/storybook/pull/5902))\n* Bump marko from 4.15.3 to 4.15.4 ([#5939](https://github.com/storybooks/storybook/pull/5939))"}}
\ No newline at end of file
+{"version":"5.1.0-alpha.4","info":{"plain":"### Bug Fixes\n\n* CLI: Fix welcome component in dark theme ([#5998](https://github.com/storybooks/storybook/pull/5998))\n* Polymer: Fix re-rendering lit-html elements after non-lit-html element ([#5868](https://github.com/storybooks/storybook/pull/5868))\n* Addon-a11y: Fix respect 'element' arg in config ([#5996](https://github.com/storybooks/storybook/pull/5996))\n* Addon-a11y: Fix design icons ([#5991](https://github.com/storybooks/storybook/pull/5991))\n* Addon-viewport: Fix viewport iframe dimensions ([#5993](https://github.com/storybooks/storybook/pull/5993))\n\n### Maintenance\n\n* ADD parameters to compile-js to no longer copy .ts files into dist ([#5844](https://github.com/storybooks/storybook/pull/5844))\n\n### Dependency Upgrades\n\n* build(deps): bump react-is from 16.8.3 to 16.8.4 ([#6010](https://github.com/storybooks/storybook/pull/6010))\n* build(deps): bump react-dev-utils from 7.0.3 to 8.0.0 ([#6011](https://github.com/storybooks/storybook/pull/6011))"}}
\ No newline at end of file

From fcb86a835f639aef38f5843af6452e3a3e926593 Mon Sep 17 00:00:00 2001
From: codebyalex <wilsonc.alexander@gmail.com>
Date: Mon, 11 Mar 2019 11:46:20 -0400
Subject: [PATCH 247/249] Modified the component force render debounce so that
 knob storage occurs but the force rendering is debounced. Debouncing waits
 325ms to allow for a user to finish a thought before rendering. Tested this
 change in the cli projects.

---
 addons/knobs/package.json         |  1 +
 addons/knobs/src/registerKnobs.js | 20 ++++++++++++--------
 2 files changed, 13 insertions(+), 8 deletions(-)

diff --git a/addons/knobs/package.json b/addons/knobs/package.json
index 15f727d14c5..9afc41f926c 100644
--- a/addons/knobs/package.json
+++ b/addons/knobs/package.json
@@ -31,6 +31,7 @@
     "escape-html": "^1.0.3",
     "fast-deep-equal": "^2.0.1",
     "global": "^4.3.2",
+    "lodash.debounce": "^4.0.8",
     "prop-types": "^15.6.2",
     "qs": "^6.5.2",
     "react-color": "^2.17.0",
diff --git a/addons/knobs/src/registerKnobs.js b/addons/knobs/src/registerKnobs.js
index 687f7d59a34..e6b81396d14 100644
--- a/addons/knobs/src/registerKnobs.js
+++ b/addons/knobs/src/registerKnobs.js
@@ -1,11 +1,13 @@
 import addons from '@storybook/addons';
 import { STORY_CHANGED, FORCE_RE_RENDER, REGISTER_SUBSCRIPTION } from '@storybook/core-events';
+import debounce from 'lodash.debounce';
 
 import KnobManager from './KnobManager';
 import { CHANGE, CLICK, RESET, SET } from './shared';
 
 export const manager = new KnobManager();
 const { knobStore } = manager;
+const COMPONENT_FORCE_RENDER_DEBOUNCE_DELAY_MS = 325;
 
 function forceReRender() {
   addons.getChannel().emit(FORCE_RE_RENDER);
@@ -16,16 +18,18 @@ function setPaneKnobs(timestamp = +new Date()) {
   channel.emit(SET, { knobs: knobStore.getAll(), timestamp });
 }
 
-function knobChanged(change) {
-  const { name, value } = change;
-
-  // Update the related knob and it's value.
-  const knobOptions = knobStore.get(name);
-
-  knobOptions.value = value;
+// Increased performance by reducing the number of times a component is rendered during knob changes
+const debouncedOnKnobChanged = debounce(() => {
   knobStore.markAllUnused();
-
   forceReRender();
+}, COMPONENT_FORCE_RENDER_DEBOUNCE_DELAY_MS);
+
+function knobChanged(change) {
+  const { name } = change;
+  const { value } = change; // Update the related knob and it's value.
+  const knobOptions = knobStore.get(name);
+  knobOptions.value = value;
+  debouncedOnKnobChanged();
 }
 
 function knobClicked(clicked) {

From 48788f65e370f30f891d21f94a6fc88b4e06932e Mon Sep 17 00:00:00 2001
From: codebyalex <wilsonc.alexander@gmail.com>
Date: Mon, 11 Mar 2019 12:39:18 -0400
Subject: [PATCH 248/249] Removed double lodash import added during merge

---
 addons/knobs/src/registerKnobs.js | 1 -
 1 file changed, 1 deletion(-)

diff --git a/addons/knobs/src/registerKnobs.js b/addons/knobs/src/registerKnobs.js
index c4ddf0f3bd4..e6b81396d14 100644
--- a/addons/knobs/src/registerKnobs.js
+++ b/addons/knobs/src/registerKnobs.js
@@ -2,7 +2,6 @@ import addons from '@storybook/addons';
 import { STORY_CHANGED, FORCE_RE_RENDER, REGISTER_SUBSCRIPTION } from '@storybook/core-events';
 import debounce from 'lodash.debounce';
 
-import debounce from 'lodash.debounce';
 import KnobManager from './KnobManager';
 import { CHANGE, CLICK, RESET, SET } from './shared';
 

From fcdc0baeddf45c9e359e6d0712e15bc94204d127 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ga=C3=ABtan=20Maisse?= <gmaisse@leadformance.com>
Date: Sat, 9 Mar 2019 18:28:12 +0100
Subject: [PATCH 249/249] refactor: improve typings of theming lib

Exported `styled` was implicitly of type `CreateStyled<any>`, now it is typed using SB Theme.
This stronger typing reveals a missing `bar` property in background default object.
---
 .../__snapshots__/syntaxhighlighter.stories.storyshot        | 1 +
 lib/theming/src/base.ts                                      | 1 +
 lib/theming/src/create.ts                                    | 1 +
 lib/theming/src/index.ts                                     | 5 +++--
 lib/ui/src/settings/__snapshots__/about.stories.storyshot    | 1 +
 5 files changed, 7 insertions(+), 2 deletions(-)

diff --git a/lib/components/src/syntaxhighlighter/__snapshots__/syntaxhighlighter.stories.storyshot b/lib/components/src/syntaxhighlighter/__snapshots__/syntaxhighlighter.stories.storyshot
index 74208bce9d3..61330fb3fae 100644
--- a/lib/components/src/syntaxhighlighter/__snapshots__/syntaxhighlighter.stories.storyshot
+++ b/lib/components/src/syntaxhighlighter/__snapshots__/syntaxhighlighter.stories.storyshot
@@ -260,6 +260,7 @@ exports[`Storyshots Basics|SyntaxHighlighter bordered & copy-able 1`] = `
   position: relative;
   overflow: hidden;
   border: 1px solid rgba(0,0,0,.1);
+  background: #FFFFFF;
 }
 
 .emotion-2 {
diff --git a/lib/theming/src/base.ts b/lib/theming/src/base.ts
index f89258ea291..fa0a3ca35d4 100644
--- a/lib/theming/src/base.ts
+++ b/lib/theming/src/base.ts
@@ -40,6 +40,7 @@ export const color = {
 
 export const background = {
   app: '#F6F9FC',
+  bar: '#FFFFFF',
   content: color.lightest,
   hoverable: 'rgba(0,0,0,.05)', // hover state for items in a list
 
diff --git a/lib/theming/src/create.ts b/lib/theming/src/create.ts
index bb9dcc1f6f5..6f2b722c1d6 100644
--- a/lib/theming/src/create.ts
+++ b/lib/theming/src/create.ts
@@ -129,6 +129,7 @@ export const convert = (inherit: ThemeVars = lightThemeVars): Theme => {
     color: createColors(inherit),
     background: {
       app: appBg,
+      bar: background.bar,
       content: appContentBg,
       hoverable:
         base === 'light' ? 'rgba(0,0,0,.05)' : 'rgba(250,250,252,.1)' || background.hoverable,
diff --git a/lib/theming/src/index.ts b/lib/theming/src/index.ts
index 72b06808d4a..3cef9705ff4 100644
--- a/lib/theming/src/index.ts
+++ b/lib/theming/src/index.ts
@@ -1,8 +1,9 @@
-import styled from '@emotion/styled';
+import emotionStyled, { CreateStyled } from '@emotion/styled';
 import dark from './themes/dark';
 import light from './themes/light';
+import { Theme } from './base';
 
-export { styled };
+export const styled = emotionStyled as CreateStyled<Theme>;
 
 export * from './base';
 
diff --git a/lib/ui/src/settings/__snapshots__/about.stories.storyshot b/lib/ui/src/settings/__snapshots__/about.stories.storyshot
index 84c4aac721d..ea52b5e4007 100644
--- a/lib/ui/src/settings/__snapshots__/about.stories.storyshot
+++ b/lib/ui/src/settings/__snapshots__/about.stories.storyshot
@@ -1432,6 +1432,7 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
   position: relative;
   overflow: hidden;
   border: 1px solid rgba(0,0,0,.1);
+  background: #FFFFFF;
 }
 
 .emotion-20 {