Pass all files other then node_modules though babel loader by default

.babelrc.js

@@ -2,7 +2,13 @@ const withTests = {
   presets: [
     [
       '@babel/preset-env',
-      { shippedProposals: true, useBuiltIns: 'usage', corejs: '3', targets: { node: 'current' } },
+      {
+        shippedProposals: true,
+        useBuiltIns: 'usage',
+        corejs: '3',
+        targets: { node: 'current' },
+        modules: 'commonjs',
+      },
     ],
   ],
   plugins: [
@@ -14,7 +20,18 @@ const withTests = {
 
 module.exports = {
   presets: [
-    ['@babel/preset-env', { shippedProposals: true, useBuiltIns: 'usage', corejs: '3' }],
+    [
+      '@babel/preset-env',
+      {
+        shippedProposals: true,
+        useBuiltIns: 'usage',
+        corejs: '3',
+        modules: false,
+        targets: {
+          browsers: ['Chrome >= 52', 'Explorer 11'],
+        },
+      },
+    ],
     '@babel/preset-typescript',
     '@babel/preset-react',
     '@babel/preset-flow',
@@ -47,7 +64,18 @@ module.exports = {
     {
       test: './lib',
       presets: [
-        ['@babel/preset-env', { shippedProposals: true, useBuiltIns: 'usage', corejs: '3' }],
+        [
+          '@babel/preset-env',
+          {
+            shippedProposals: true,
+            useBuiltIns: 'usage',
+            corejs: '3',
+            modules: false,
+            targets: {
+              browsers: ['Chrome >= 52', 'Explorer 11'],
+            },
+          },
+        ],
         '@babel/preset-react',
       ],
       plugins: [
@@ -84,6 +112,7 @@ module.exports = {
               node: '8.11',
             },
             corejs: '3',
+            modules: 'commonjs',
           },
         ],
       ],

.eslintrc.js

@@ -34,7 +34,12 @@ module.exports = {
   env: { es6: true, node: true, 'jest/globals': true },
   settings: {
     'import/core-modules': ['enzyme'],
-    'import/ignore': ['node_modules\\/(?!@storybook)'],
+    'import/ignore': [
+      'node_modules\\/(?!@storybook)',
+      // I'd rather not have this, but a babel/typescript issue is not detecting all exports
+      // related: https://github.com/babel/babel/issues/8361#issuecomment-494093009
+      '@storybook/*',
+    ],
     'import/resolver': { node: { extensions: ['.js', '.ts', '.tsx', '.mjs'] } },
     'html/html-extensions': ['.html'],
   },

.gitignore

@@ -25,5 +25,6 @@ integration/__image_snapshots__/__diff_output__
 lib/*.jar
 lib/**/dll
 .expo/packager-info.json
+.cache-loader
 scripts/storage
 htpasswd

addons/a11y/src/components/Report/__snapshots__/HighlightToggle.test.js.snap

@@ -81,12 +81,12 @@ exports[`HighlightToggle component should match snapshot 1`] = `
               "toString": [Function],
             },
             "hoverable": Object {
-              "map": "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uL3NyYy9hbmltYXRpb24udHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBd0NxQiIsImZpbGUiOiIuLi9zcmMvYW5pbWF0aW9uLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzLCBrZXlmcmFtZXMgfSBmcm9tICdAZW1vdGlvbi9jb3JlJztcblxuZXhwb3J0IGNvbnN0IGVhc2luZyA9IHtcbiAgcnViYmVyOiAnY3ViaWMtYmV6aWVyKDAuMTc1LCAwLjg4NSwgMC4zMzUsIDEuMDUpJyxcbn07XG5cbmNvbnN0IHJvdGF0ZTM2MCA9IGtleWZyYW1lc2Bcblx0ZnJvbSB7XG5cdFx0dHJhbnNmb3JtOiByb3RhdGUoMGRlZyk7XG5cdH1cblx0dG8ge1xuXHRcdHRyYW5zZm9ybTogcm90YXRlKDM2MGRlZyk7XG5cdH1cbmA7XG5cbmNvbnN0IGdsb3cgPSBrZXlmcmFtZXNgXG4gIDAlLCAxMDAlIHsgb3BhY2l0eTogMTsgfVxuICA1MCUgeyBvcGFjaXR5OiAuNDsgfVxuYDtcblxuY29uc3QgZmxvYXQgPSBrZXlmcmFtZXNgXG4gIDAlIHsgdHJhbnNmb3JtOiB0cmFuc2xhdGVZKDFweCk7IH1cbiAgMjUlIHsgdHJhbnNmb3JtOiB0cmFuc2xhdGVZKDBweCk7IH1cbiAgNTAlIHsgdHJhbnNmb3JtOiB0cmFuc2xhdGVZKC0zcHgpOyB9XG4gIDEwMCUgeyB0cmFuc2Zvcm06IHRyYW5zbGF0ZVkoMXB4KTsgfVxuYDtcblxuY29uc3QgamlnZ2xlID0ga2V5ZnJhbWVzYFxuICAwJSwgMTAwJSB7IHRyYW5zZm9ybTp0cmFuc2xhdGUzZCgwLDAsMCk7IH1cbiAgMTIuNSUsIDYyLjUlIHsgdHJhbnNmb3JtOnRyYW5zbGF0ZTNkKC00cHgsMCwwKTsgfVxuICAzNy41JSwgODcuNSUgeyAgdHJhbnNmb3JtOiB0cmFuc2xhdGUzZCg0cHgsMCwwKTsgIH1cbmA7XG5cbmNvbnN0IGlubGluZUdsb3cgPSBjc3NgXG4gIGFuaW1hdGlvbjogJHtnbG93fSAxLjVzIGVhc2UtaW4tb3V0IGluZmluaXRlO1xuICBjb2xvcjogdHJhbnNwYXJlbnQ7XG4gIGN1cnNvcjogcHJvZ3Jlc3M7XG5gO1xuXG4vLyBob3ZlciAmIGFjdGl2ZSBzdGF0ZSBmb3IgbGlua3MgYW5kIGJ1dHRvbnNcbmNvbnN0IGhvdmVyYWJsZSA9IGNzc2BcbiAgdHJhbnNpdGlvbjogYWxsIDE1MG1zIGVhc2Utb3V0O1xuICB0cmFuc2Zvcm06IHRyYW5zbGF0ZTNkKDAsIDAsIDApO1xuXG4gICY6aG92ZXIge1xuICAgIHRyYW5zZm9ybTogdHJhbnNsYXRlM2QoMCwgLTJweCwgMCk7XG4gIH1cblxuICAmOmFjdGl2ZSB7XG4gICAgdHJhbnNmb3JtOiB0cmFuc2xhdGUzZCgwLCAwLCAwKTtcbiAgfVxuYDtcblxuZXhwb3J0IGNvbnN0IGFuaW1hdGlvbiA9IHtcbiAgcm90YXRlMzYwLFxuICBnbG93LFxuICBmbG9hdCxcbiAgamlnZ2xlLFxuICBpbmxpbmVHbG93LFxuICBob3ZlcmFibGUsXG59O1xuIl19 */",
+              "map": "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImFuaW1hdGlvbi50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUF3Q3FCIiwiZmlsZSI6ImFuaW1hdGlvbi50cyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcywga2V5ZnJhbWVzIH0gZnJvbSAnQGVtb3Rpb24vY29yZSc7XG5cbmV4cG9ydCBjb25zdCBlYXNpbmcgPSB7XG4gIHJ1YmJlcjogJ2N1YmljLWJlemllcigwLjE3NSwgMC44ODUsIDAuMzM1LCAxLjA1KScsXG59O1xuXG5jb25zdCByb3RhdGUzNjAgPSBrZXlmcmFtZXNgXG5cdGZyb20ge1xuXHRcdHRyYW5zZm9ybTogcm90YXRlKDBkZWcpO1xuXHR9XG5cdHRvIHtcblx0XHR0cmFuc2Zvcm06IHJvdGF0ZSgzNjBkZWcpO1xuXHR9XG5gO1xuXG5jb25zdCBnbG93ID0ga2V5ZnJhbWVzYFxuICAwJSwgMTAwJSB7IG9wYWNpdHk6IDE7IH1cbiAgNTAlIHsgb3BhY2l0eTogLjQ7IH1cbmA7XG5cbmNvbnN0IGZsb2F0ID0ga2V5ZnJhbWVzYFxuICAwJSB7IHRyYW5zZm9ybTogdHJhbnNsYXRlWSgxcHgpOyB9XG4gIDI1JSB7IHRyYW5zZm9ybTogdHJhbnNsYXRlWSgwcHgpOyB9XG4gIDUwJSB7IHRyYW5zZm9ybTogdHJhbnNsYXRlWSgtM3B4KTsgfVxuICAxMDAlIHsgdHJhbnNmb3JtOiB0cmFuc2xhdGVZKDFweCk7IH1cbmA7XG5cbmNvbnN0IGppZ2dsZSA9IGtleWZyYW1lc2BcbiAgMCUsIDEwMCUgeyB0cmFuc2Zvcm06dHJhbnNsYXRlM2QoMCwwLDApOyB9XG4gIDEyLjUlLCA2Mi41JSB7IHRyYW5zZm9ybTp0cmFuc2xhdGUzZCgtNHB4LDAsMCk7IH1cbiAgMzcuNSUsIDg3LjUlIHsgIHRyYW5zZm9ybTogdHJhbnNsYXRlM2QoNHB4LDAsMCk7ICB9XG5gO1xuXG5jb25zdCBpbmxpbmVHbG93ID0gY3NzYFxuICBhbmltYXRpb246ICR7Z2xvd30gMS41cyBlYXNlLWluLW91dCBpbmZpbml0ZTtcbiAgY29sb3I6IHRyYW5zcGFyZW50O1xuICBjdXJzb3I6IHByb2dyZXNzO1xuYDtcblxuLy8gaG92ZXIgJiBhY3RpdmUgc3RhdGUgZm9yIGxpbmtzIGFuZCBidXR0b25zXG5jb25zdCBob3ZlcmFibGUgPSBjc3NgXG4gIHRyYW5zaXRpb246IGFsbCAxNTBtcyBlYXNlLW91dDtcbiAgdHJhbnNmb3JtOiB0cmFuc2xhdGUzZCgwLCAwLCAwKTtcblxuICAmOmhvdmVyIHtcbiAgICB0cmFuc2Zvcm06IHRyYW5zbGF0ZTNkKDAsIC0ycHgsIDApO1xuICB9XG5cbiAgJjphY3RpdmUge1xuICAgIHRyYW5zZm9ybTogdHJhbnNsYXRlM2QoMCwgMCwgMCk7XG4gIH1cbmA7XG5cbmV4cG9ydCBjb25zdCBhbmltYXRpb24gPSB7XG4gIHJvdGF0ZTM2MCxcbiAgZ2xvdyxcbiAgZmxvYXQsXG4gIGppZ2dsZSxcbiAgaW5saW5lR2xvdyxcbiAgaG92ZXJhYmxlLFxufTtcbiJdfQ== */",
               "name": "1023qba-hoverable",
               "styles": "transition:all 150ms ease-out;transform:translate3d(0,0,0);&:hover{transform:translate3d(0,-2px,0);}&:active{transform:translate3d(0,0,0);}label:hoverable;",
             },
             "inlineGlow": Object {
-              "map": "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uL3NyYy9hbmltYXRpb24udHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBaUNzQiIsImZpbGUiOiIuLi9zcmMvYW5pbWF0aW9uLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzLCBrZXlmcmFtZXMgfSBmcm9tICdAZW1vdGlvbi9jb3JlJztcblxuZXhwb3J0IGNvbnN0IGVhc2luZyA9IHtcbiAgcnViYmVyOiAnY3ViaWMtYmV6aWVyKDAuMTc1LCAwLjg4NSwgMC4zMzUsIDEuMDUpJyxcbn07XG5cbmNvbnN0IHJvdGF0ZTM2MCA9IGtleWZyYW1lc2Bcblx0ZnJvbSB7XG5cdFx0dHJhbnNmb3JtOiByb3RhdGUoMGRlZyk7XG5cdH1cblx0dG8ge1xuXHRcdHRyYW5zZm9ybTogcm90YXRlKDM2MGRlZyk7XG5cdH1cbmA7XG5cbmNvbnN0IGdsb3cgPSBrZXlmcmFtZXNgXG4gIDAlLCAxMDAlIHsgb3BhY2l0eTogMTsgfVxuICA1MCUgeyBvcGFjaXR5OiAuNDsgfVxuYDtcblxuY29uc3QgZmxvYXQgPSBrZXlmcmFtZXNgXG4gIDAlIHsgdHJhbnNmb3JtOiB0cmFuc2xhdGVZKDFweCk7IH1cbiAgMjUlIHsgdHJhbnNmb3JtOiB0cmFuc2xhdGVZKDBweCk7IH1cbiAgNTAlIHsgdHJhbnNmb3JtOiB0cmFuc2xhdGVZKC0zcHgpOyB9XG4gIDEwMCUgeyB0cmFuc2Zvcm06IHRyYW5zbGF0ZVkoMXB4KTsgfVxuYDtcblxuY29uc3QgamlnZ2xlID0ga2V5ZnJhbWVzYFxuICAwJSwgMTAwJSB7IHRyYW5zZm9ybTp0cmFuc2xhdGUzZCgwLDAsMCk7IH1cbiAgMTIuNSUsIDYyLjUlIHsgdHJhbnNmb3JtOnRyYW5zbGF0ZTNkKC00cHgsMCwwKTsgfVxuICAzNy41JSwgODcuNSUgeyAgdHJhbnNmb3JtOiB0cmFuc2xhdGUzZCg0cHgsMCwwKTsgIH1cbmA7XG5cbmNvbnN0IGlubGluZUdsb3cgPSBjc3NgXG4gIGFuaW1hdGlvbjogJHtnbG93fSAxLjVzIGVhc2UtaW4tb3V0IGluZmluaXRlO1xuICBjb2xvcjogdHJhbnNwYXJlbnQ7XG4gIGN1cnNvcjogcHJvZ3Jlc3M7XG5gO1xuXG4vLyBob3ZlciAmIGFjdGl2ZSBzdGF0ZSBmb3IgbGlua3MgYW5kIGJ1dHRvbnNcbmNvbnN0IGhvdmVyYWJsZSA9IGNzc2BcbiAgdHJhbnNpdGlvbjogYWxsIDE1MG1zIGVhc2Utb3V0O1xuICB0cmFuc2Zvcm06IHRyYW5zbGF0ZTNkKDAsIDAsIDApO1xuXG4gICY6aG92ZXIge1xuICAgIHRyYW5zZm9ybTogdHJhbnNsYXRlM2QoMCwgLTJweCwgMCk7XG4gIH1cblxuICAmOmFjdGl2ZSB7XG4gICAgdHJhbnNmb3JtOiB0cmFuc2xhdGUzZCgwLCAwLCAwKTtcbiAgfVxuYDtcblxuZXhwb3J0IGNvbnN0IGFuaW1hdGlvbiA9IHtcbiAgcm90YXRlMzYwLFxuICBnbG93LFxuICBmbG9hdCxcbiAgamlnZ2xlLFxuICBpbmxpbmVHbG93LFxuICBob3ZlcmFibGUsXG59O1xuIl19 */",
+              "map": "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImFuaW1hdGlvbi50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFpQ3NCIiwiZmlsZSI6ImFuaW1hdGlvbi50cyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcywga2V5ZnJhbWVzIH0gZnJvbSAnQGVtb3Rpb24vY29yZSc7XG5cbmV4cG9ydCBjb25zdCBlYXNpbmcgPSB7XG4gIHJ1YmJlcjogJ2N1YmljLWJlemllcigwLjE3NSwgMC44ODUsIDAuMzM1LCAxLjA1KScsXG59O1xuXG5jb25zdCByb3RhdGUzNjAgPSBrZXlmcmFtZXNgXG5cdGZyb20ge1xuXHRcdHRyYW5zZm9ybTogcm90YXRlKDBkZWcpO1xuXHR9XG5cdHRvIHtcblx0XHR0cmFuc2Zvcm06IHJvdGF0ZSgzNjBkZWcpO1xuXHR9XG5gO1xuXG5jb25zdCBnbG93ID0ga2V5ZnJhbWVzYFxuICAwJSwgMTAwJSB7IG9wYWNpdHk6IDE7IH1cbiAgNTAlIHsgb3BhY2l0eTogLjQ7IH1cbmA7XG5cbmNvbnN0IGZsb2F0ID0ga2V5ZnJhbWVzYFxuICAwJSB7IHRyYW5zZm9ybTogdHJhbnNsYXRlWSgxcHgpOyB9XG4gIDI1JSB7IHRyYW5zZm9ybTogdHJhbnNsYXRlWSgwcHgpOyB9XG4gIDUwJSB7IHRyYW5zZm9ybTogdHJhbnNsYXRlWSgtM3B4KTsgfVxuICAxMDAlIHsgdHJhbnNmb3JtOiB0cmFuc2xhdGVZKDFweCk7IH1cbmA7XG5cbmNvbnN0IGppZ2dsZSA9IGtleWZyYW1lc2BcbiAgMCUsIDEwMCUgeyB0cmFuc2Zvcm06dHJhbnNsYXRlM2QoMCwwLDApOyB9XG4gIDEyLjUlLCA2Mi41JSB7IHRyYW5zZm9ybTp0cmFuc2xhdGUzZCgtNHB4LDAsMCk7IH1cbiAgMzcuNSUsIDg3LjUlIHsgIHRyYW5zZm9ybTogdHJhbnNsYXRlM2QoNHB4LDAsMCk7ICB9XG5gO1xuXG5jb25zdCBpbmxpbmVHbG93ID0gY3NzYFxuICBhbmltYXRpb246ICR7Z2xvd30gMS41cyBlYXNlLWluLW91dCBpbmZpbml0ZTtcbiAgY29sb3I6IHRyYW5zcGFyZW50O1xuICBjdXJzb3I6IHByb2dyZXNzO1xuYDtcblxuLy8gaG92ZXIgJiBhY3RpdmUgc3RhdGUgZm9yIGxpbmtzIGFuZCBidXR0b25zXG5jb25zdCBob3ZlcmFibGUgPSBjc3NgXG4gIHRyYW5zaXRpb246IGFsbCAxNTBtcyBlYXNlLW91dDtcbiAgdHJhbnNmb3JtOiB0cmFuc2xhdGUzZCgwLCAwLCAwKTtcblxuICAmOmhvdmVyIHtcbiAgICB0cmFuc2Zvcm06IHRyYW5zbGF0ZTNkKDAsIC0ycHgsIDApO1xuICB9XG5cbiAgJjphY3RpdmUge1xuICAgIHRyYW5zZm9ybTogdHJhbnNsYXRlM2QoMCwgMCwgMCk7XG4gIH1cbmA7XG5cbmV4cG9ydCBjb25zdCBhbmltYXRpb24gPSB7XG4gIHJvdGF0ZTM2MCxcbiAgZ2xvdyxcbiAgZmxvYXQsXG4gIGppZ2dsZSxcbiAgaW5saW5lR2xvdyxcbiAgaG92ZXJhYmxlLFxufTtcbiJdfQ== */",
               "name": "1euta6d-inlineGlow",
               "next": Object {
                 "name": "animation-r0iffl",

addons/actions/src/manager.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import addons from '@storybook/addons';
+import { addons } from '@storybook/addons';
 import ActionLogger from './containers/ActionLogger';
 import { ADDON_ID, PANEL_ID } from '.';
 

addons/actions/src/preview/__tests__/action.test.js

@@ -1,4 +1,4 @@
-import addons from '@storybook/addons';
+import { addons } from '@storybook/addons';
 import { action } from '../..';
 // import { configureActions } from '../..';
 

addons/centered/react.mjs

@@ -0,0 +1,3 @@
+import wrapper from './src/react';
+
+export default wrapper;

addons/contexts/register.js

@@ -1 +1 @@
-export * from './dist/register';
+import './dist/register';

addons/contexts/src/manager/libs/useChannel.ts

@@ -1,7 +1,10 @@
-import addons from '@storybook/addons';
 import { useEffect } from 'react';
+import { addons } from '@storybook/addons';
+
 import { AnyFunctionReturns } from '../../shared/types.d';
 
+export { Channel } from '@storybook/channels';
+
 /**
  * The React hook version of Storybook Channel API.
  */

addons/contexts/src/preview/api.ts

@@ -0,0 +1,56 @@
+import { addons } from '@storybook/addons';
+import { FORCE_RE_RENDER, SET_CURRENT_STORY } from '@storybook/core-events';
+import { REBOOT_MANAGER, UPDATE_PREVIEW, UPDATE_MANAGER } from '../shared/constants';
+import { getContextNodes, getPropsMap, getRendererFrom, singleton } from './libs';
+import { ContextNode, PropsMap } from '../shared/types.d';
+
+/**
+ * @Public
+ * A singleton for handling wrapper-manager side-effects
+ */
+export const addonContextsAPI = singleton(() => {
+  const channel = addons.getChannel();
+  let memorizedNodes: null | ContextNode[] = null;
+  let selectionState = {};
+
+  // from manager
+  channel.on(SET_CURRENT_STORY, () => {
+    memorizedNodes = null;
+  });
+  channel.on(REBOOT_MANAGER, () => channel.emit(UPDATE_MANAGER, memorizedNodes, selectionState));
+  channel.on(UPDATE_PREVIEW, state => {
+    selectionState = Object.freeze(state);
+  });
+  channel.on(UPDATE_PREVIEW, () => channel.emit(FORCE_RE_RENDER));
+
+  // to manager
+  const getContextNodesWithSideEffects: typeof getContextNodes = (...arg) => {
+    // we want to notify the manager only when the story changed since `parameter` can be changed
+    if (memorizedNodes === null) {
+      memorizedNodes = getContextNodes(...arg);
+      channel.emit(UPDATE_MANAGER, memorizedNodes);
+    }
+    return memorizedNodes;
+  };
+
+  /**
+   * (Vue specific)
+   * Vue will inject getter/setters on the first rendering of the addon,
+   * which is the reason why we have to keep an internal reference and use `Object.assign` to update it.
+   */
+  const reactivePropsMap = {};
+  const updateReactiveSystem = (propsMap: PropsMap) =>
+    /* tslint:disable:prefer-object-spread */
+    Object.assign(reactivePropsMap, propsMap);
+
+  return {
+    // methods get called on Storybook event lifecycle
+    getContextNodes: getContextNodesWithSideEffects,
+    getSelectionState: () => selectionState,
+    getPropsMap,
+
+    // methods for processing framework specific bindings
+    getRendererFrom,
+    updateReactiveSystem,
+  };
+});

addons/contexts/src/register.ts

@@ -1,5 +1,6 @@
 import { createElement } from 'react';
-import addons, { types } from '@storybook/addons';
+import { addons, types } from '@storybook/addons';
+
 import { ContextsManager } from './manager/ContextsManager';
 import { ID } from './shared/constants';
 

addons/events/src/index.js

@@ -1,5 +1,5 @@
-import addons from '@storybook/addons';
-import CoreEvents from '@storybook/core-events';
+import { addons } from '@storybook/addons';
+import { REGISTER_SUBSCRIPTION } from '@storybook/core-events';
 import deprecate from 'util-deprecate';
 
 import { EVENTS } from './constants';
@@ -27,7 +27,7 @@ const addEvents = ({ emit, events }) => {
     prevEvents = events;
   }
   currentEmit = emit;
-  addons.getChannel().emit(CoreEvents.REGISTER_SUBSCRIPTION, subscription);
+  addons.getChannel().emit(REGISTER_SUBSCRIPTION, subscription);
 };
 
 const WithEvents = deprecate(({ children, ...options }) => {

addons/events/src/manager.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import addons from '@storybook/addons';
+import { addons } from '@storybook/addons';
 
 import Panel from './components/Panel';
 import { ADDON_ID, PANEL_ID } from './constants';

addons/graphql/package.json

@@ -17,13 +17,12 @@
   },
   "license": "MIT",
   "main": "dist/index.js",
-  "jsnext:main": "src/index.js",
   "scripts": {
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.1.0-alpha.28",
-    "@storybook/api": "5.1.0-alpha.28",
+    "@storybook/addons": "5.1.0-beta.1",
+    "@storybook/api": "5.1.0-beta.1",
     "core-js": "^3.0.1",
     "global": "^4.3.2",
     "graphiql": "^0.13.0",

addons/jest/src/index.ts

@@ -1,4 +1,4 @@
-import addons from '@storybook/addons';
+import { addons } from '@storybook/addons';
 import deprecate from 'util-deprecate';
 import { normalize, sep } from 'upath';
 import { ADD_TESTS } from './shared';

addons/jest/src/register.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import addons from '@storybook/addons';
+import { addons } from '@storybook/addons';
 import { ADDON_ID, PANEL_ID } from './shared';
 
 import Panel from './components/Panel';

addons/knobs/src/index.js

@@ -1,4 +1,4 @@
-import addons, { makeDecorator } from '@storybook/addons';
+import { addons, makeDecorator } from '@storybook/addons';
 
 import { SET_OPTIONS } from './shared';
 

addons/knobs/src/register.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import addons from '@storybook/addons';
+import { addons } from '@storybook/addons';
 import Panel from './components/Panel';
 import { ADDON_ID, PANEL_ID } from './shared';
 

addons/knobs/src/registerKnobs.js

@@ -1,4 +1,4 @@
-import addons from '@storybook/addons';
+import { addons } from '@storybook/addons';
 import { STORY_CHANGED, FORCE_RE_RENDER, REGISTER_SUBSCRIPTION } from '@storybook/core-events';
 import debounce from 'lodash/debounce';
 

addons/links/src/manager.ts

@@ -1,4 +1,4 @@
-import addons from '@storybook/addons';
+import { addons } from '@storybook/addons';
 
 import EVENTS, { ADDON_ID } from './constants';
 

addons/links/src/preview.test.js

@@ -1,4 +1,4 @@
-import addons from '@storybook/addons';
+import { addons } from '@storybook/addons';
 import { SELECT_STORY } from '@storybook/core-events';
 import { linkTo, hrefTo } from './preview';
 

addons/links/src/preview.ts

@@ -1,7 +1,7 @@
 import { SyntheticEvent } from 'react';
 import { document } from 'global';
 import qs from 'qs';
-import addons from '@storybook/addons';
+import { addons } from '@storybook/addons';
 import { SELECT_STORY, STORY_CHANGED } from '@storybook/core-events';
 import { toId } from '@storybook/router/utils';
 

addons/links/src/react/components/link.test.js

@@ -1,6 +1,6 @@
 import { shallow } from 'enzyme';
 import React from 'react';
-import addons from '@storybook/addons';
+import { addons } from '@storybook/addons';
 
 import { SELECT_STORY } from '@storybook/core-events';
 import { mockChannel } from '../../preview.test';

addons/notes/src/register.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import addons, { types } from '@storybook/addons';
+import { addons, types } from '@storybook/addons';
 
 import { ADDON_ID, PANEL_ID } from './shared';
 

addons/ondevice-backgrounds/src/register.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import addons from '@storybook/addons';
+import { addons } from '@storybook/addons';
 
 import { ADDON_ID, PANEL_ID } from './constants';
 import BackgroundPanel from './BackgroundPanel';

addons/ondevice-knobs/src/index.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import addons from '@storybook/addons';
+import { addons } from '@storybook/addons';
 import Panel from './panel';
 
 export function register() {

addons/ondevice-notes/src/register.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { View } from 'react-native';
 import Markdown from 'react-native-simple-markdown';
-import addons from '@storybook/addons';
+import { addons } from '@storybook/addons';
 import Events from '@storybook/core-events';
 
 export const PARAM_KEY = `notes`;

addons/options/src/index.ts

@@ -1,5 +1,5 @@
 import deprecate from 'util-deprecate';
-import addons, { makeDecorator } from '@storybook/addons';
+import { addons, makeDecorator } from '@storybook/addons';
 
 import EVENTS from './constants';
 

addons/options/src/register.ts

@@ -1,4 +1,4 @@
-import addons from '@storybook/addons';
+import { addons } from '@storybook/addons';
 import EVENTS, { ADDON_ID } from './constants';
 
 addons.register(ADDON_ID, api => {

addons/storyshots/storyshots-core/src/api/index.js

@@ -1,5 +1,5 @@
 import global, { describe } from 'global';
-import addons, { mockChannel } from '@storybook/addons';
+import { addons, mockChannel } from '@storybook/addons';
 import ensureOptionsDefaults from './ensureOptionsDefaults';
 import snapshotsTests from './snapshotsTestsTemplate';
 import integrityTest from './integrityTestTemplate';

addons/storyshots/storyshots-core/src/frameworks/angular/loader.js

@@ -1,5 +1,7 @@
 import 'core-js';
 import 'core-js/es/reflect';
+import 'core-js/proposals/reflect-metadata';
+
 import hasDependency from '../hasDependency';
 import configure from '../configure';
 

addons/storysource/src/manager.js

@@ -1,6 +1,6 @@
 /* eslint-disable react/prop-types */
 import React from 'react';
-import addons from '@storybook/addons';
+import { addons } from '@storybook/addons';
 
 import StoryPanel from './StoryPanel';
 import { ADDON_ID, PANEL_ID } from '.';

addons/storysource/src/preview.js

@@ -1,4 +1,4 @@
-import addons from '@storybook/addons';
+import { addons } from '@storybook/addons';
 import { EVENT_ID } from './events';
 
 const getLocation = (context, locationsMap) => locationsMap[context.id];

addons/viewport/preview.mjs

@@ -0,0 +1,6 @@
+export {
+  configureViewport,
+  DEFAULT_VIEWPORT,
+  INITIAL_VIEWPORTS,
+  withViewport,
+} from './src/legacy_preview/index';

addons/viewport/src/register.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import addons, { types } from '@storybook/addons';
+import { addons, types } from '@storybook/addons';
 
 import { ADDON_ID } from './constants';