From eab2ed4ffb8989a40acc15b2b681cafb83756995 Mon Sep 17 00:00:00 2001 From: Norbert de Langen Date: Fri, 19 Apr 2019 12:41:14 +0200 Subject: [PATCH 01/22] OPTIMIZE webpack & babel REMOVE the include lists for the babel-loader, this should enable transpiling for files other then in your source directory, making the need for custom webpack configs less prominent ADD a thread-loader to hopefully speed up the building of large storybooks --- .gitignore | 1 + examples/official-storybook/webpack.config.js | 12 +++------ lib/core/package.json | 1 + lib/core/src/server/common/babel-loader.js | 8 +++--- lib/core/src/server/config/utils.js | 2 +- .../server/manager/manager-webpack.config.js | 3 +++ .../server/preview/iframe-webpack.config.js | 27 +++++++++++-------- yarn.lock | 11 +++++++- 8 files changed, 41 insertions(+), 24 deletions(-) diff --git a/.gitignore b/.gitignore index 3d559ddea7f5..87af22d32a25 100644 --- a/.gitignore +++ b/.gitignore @@ -25,3 +25,4 @@ integration/__image_snapshots__/__diff_output__ lib/*.jar lib/**/dll .expo/packager-info.json +.cache-loader \ No newline at end of file diff --git a/examples/official-storybook/webpack.config.js b/examples/official-storybook/webpack.config.js index fe957caf62ce..771730bb60a8 100644 --- a/examples/official-storybook/webpack.config.js +++ b/examples/official-storybook/webpack.config.js @@ -17,19 +17,14 @@ module.exports = async ({ config }) => ({ ], 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'), + options: { + transpileOnly: true, + }, }, ], }, @@ -41,6 +36,7 @@ module.exports = async ({ config }) => ({ 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$/), ], diff --git a/lib/core/package.json b/lib/core/package.json index 7abafed750dd..bce9ed962110 100644 --- a/lib/core/package.json +++ b/lib/core/package.json @@ -79,6 +79,7 @@ "shelljs": "^0.8.3", "style-loader": "^0.23.1", "terser-webpack-plugin": "^1.2.2", + "thread-loader": "^2.1.2", "url-loader": "^1.1.2", "util-deprecate": "^1.0.2", "webpack": "^4.28.0", diff --git a/lib/core/src/server/common/babel-loader.js b/lib/core/src/server/common/babel-loader.js index 3b762f613f0e..525bac24d840 100644 --- a/lib/core/src/server/common/babel-loader.js +++ b/lib/core/src/server/common/babel-loader.js @@ -1,13 +1,15 @@ -import { includePaths, excludePaths } from '../config/utils'; +import { excludePaths as exclude } from '../config/utils'; export default options => ({ test: /\.(mjs|jsx?)$/, use: [ + { + loader: 'thread-loader', + }, { loader: 'babel-loader', options, }, ], - include: includePaths, - exclude: excludePaths, + exclude, }); diff --git a/lib/core/src/server/config/utils.js b/lib/core/src/server/config/utils.js index 6a35ac9f7b21..9ef77b9cd870 100644 --- a/lib/core/src/server/config/utils.js +++ b/lib/core/src/server/config/utils.js @@ -3,7 +3,7 @@ import { getEnvironment } from 'lazy-universal-dotenv'; export const includePaths = [path.resolve('./')]; export const nodeModulesPaths = path.resolve('./node_modules'); -export const excludePaths = [nodeModulesPaths]; +export const excludePaths = [new RegExp('/node_modules/')]; const nodePathsToArray = nodePath => nodePath diff --git a/lib/core/src/server/manager/manager-webpack.config.js b/lib/core/src/server/manager/manager-webpack.config.js index 332d18a46aaf..ab46263c6221 100644 --- a/lib/core/src/server/manager/manager-webpack.config.js +++ b/lib/core/src/server/manager/manager-webpack.config.js @@ -79,6 +79,9 @@ export default ({ configDir, configType, entries, dll, outputDir, cache, babelOp chunks: 'all', }, runtimeChunk: true, + namedModules: true, + moduleIds: 'named', + chunkIds: 'named', }, }; }; diff --git a/lib/core/src/server/preview/iframe-webpack.config.js b/lib/core/src/server/preview/iframe-webpack.config.js index 02e094d195d2..b2ba14e234d5 100644 --- a/lib/core/src/server/preview/iframe-webpack.config.js +++ b/lib/core/src/server/preview/iframe-webpack.config.js @@ -91,17 +91,22 @@ export default ({ chunks: 'all', }, runtimeChunk: true, - minimizer: [ - new TerserWebpackPlugin({ - cache: true, - parallel: true, - sourceMap: true, - terserOptions: { - mangle: false, - keep_fnames: true, - }, - }), - ], + namedModules: true, + moduleIds: 'named', + chunkIds: 'named', + minimizer: isProd + ? [ + new TerserWebpackPlugin({ + cache: true, + parallel: true, + sourceMap: true, + terserOptions: { + mangle: false, + keep_fnames: true, + }, + }), + ] + : [], }, performance: { hints: isProd ? 'warning' : false, diff --git a/yarn.lock b/yarn.lock index b5130fbdaf3d..402513de22ed 100644 --- a/yarn.lock +++ b/yarn.lock @@ -16015,7 +16015,7 @@ loader-fs-cache@^1.0.0: find-cache-dir "^0.1.1" mkdirp "0.5.1" -loader-runner@^2.3.0: +loader-runner@^2.3.0, loader-runner@^2.3.1: version "2.4.0" resolved "https://registry.yarnpkg.com/loader-runner/-/loader-runner-2.4.0.tgz#ed47066bfe534d7e84c4c7b9998c2a75607d9357" integrity sha512-Jsmr89RcXGIwivFY21FcRrisYZfvLMTWx5kOLc+JTxtpBOG6xML0vzbc6SEQG2FO9/4Fc3wW4LVcB5DmGflaRw== @@ -24962,6 +24962,15 @@ thenify-all@^1.0.0: dependencies: any-promise "^1.0.0" +thread-loader@^2.1.2: + version "2.1.2" + resolved "https://registry.yarnpkg.com/thread-loader/-/thread-loader-2.1.2.tgz#f585dd38e852c7f9cded5d092992108148f5eb30" + integrity sha512-7xpuc9Ifg6WU+QYw/8uUqNdRwMD+N5gjwHKMqETrs96Qn+7BHwECpt2Brzr4HFlf4IAkZsayNhmGdbkBsTJ//w== + dependencies: + loader-runner "^2.3.1" + loader-utils "^1.1.0" + neo-async "^2.6.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" From 17ee8e22aeeb6f21f44264e2c28891f5327f2587 Mon Sep 17 00:00:00 2001 From: Norbert de Langen Date: Fri, 19 Apr 2019 14:34:54 +0200 Subject: [PATCH 02/22] ADD support for css & other files for manager --- .../server/manager/manager-webpack.config.js | 31 ++++++++++++++++++- 1 file changed, 30 insertions(+), 1 deletion(-) diff --git a/lib/core/src/server/manager/manager-webpack.config.js b/lib/core/src/server/manager/manager-webpack.config.js index ab46263c6221..78c0782789c8 100644 --- a/lib/core/src/server/manager/manager-webpack.config.js +++ b/lib/core/src/server/manager/manager-webpack.config.js @@ -60,7 +60,36 @@ export default ({ configDir, configType, entries, dll, outputDir, cache, babelOp new Dotenv({ silent: true }), ].filter(Boolean), module: { - rules: [babelLoader(babelOptions)], + rules: [ + babelLoader(babelOptions), + { + test: /\.css$/, + use: [ + require.resolve('style-loader'), + { + loader: require.resolve('css-loader'), + options: { + importLoaders: 1, + }, + }, + ], + }, + { + test: /\.(svg|ico|jpg|jpeg|png|gif|eot|otf|webp|ttf|woff|woff2|cur|ani)(\?.*)?$/, + loader: require.resolve('file-loader'), + query: { + name: 'static/media/[name].[hash:8].[ext]', + }, + }, + { + test: /\.(mp4|webm|wav|mp3|m4a|aac|oga)(\?.*)?$/, + loader: require.resolve('url-loader'), + query: { + limit: 10000, + name: 'static/media/[name].[hash:8].[ext]', + }, + }, + ], }, resolve: { extensions: ['.mjs', '.js', '.jsx', '.json'], From e5cb1ed23fa9859ba45ad6a9dad0481af626f20b Mon Sep 17 00:00:00 2001 From: Norbert de Langen Date: Fri, 19 Apr 2019 15:04:36 +0200 Subject: [PATCH 03/22] REMOVE aliases for preview Could mean multiple versions of the same lib --- .../src/server/preview/iframe-webpack.config.js | 13 ------------- 1 file changed, 13 deletions(-) diff --git a/lib/core/src/server/preview/iframe-webpack.config.js b/lib/core/src/server/preview/iframe-webpack.config.js index b2ba14e234d5..714b8bbb5d69 100644 --- a/lib/core/src/server/preview/iframe-webpack.config.js +++ b/lib/core/src/server/preview/iframe-webpack.config.js @@ -5,20 +5,11 @@ import HtmlWebpackPlugin from 'html-webpack-plugin'; import CaseSensitivePathsPlugin from 'case-sensitive-paths-webpack-plugin'; import WatchMissingNodeModulesPlugin from 'react-dev-utils/WatchMissingNodeModulesPlugin'; import TerserWebpackPlugin from 'terser-webpack-plugin'; -import resolveFrom from 'resolve-from'; import babelLoader from '../common/babel-loader'; import { nodeModulesPaths, loadEnv } from '../config/utils'; import { getPreviewHeadHtml, getPreviewBodyHtml } from '../utils/template'; -const reactPaths = {}; -try { - reactPaths.react = path.dirname(resolveFrom(process.cwd(), 'react/package.json')); - reactPaths['react-dom'] = path.dirname(resolveFrom(process.cwd(), 'react-dom/package.json')); -} catch (e) { - // -} - export default ({ configDir, babelOptions, @@ -81,10 +72,6 @@ export default ({ resolve: { extensions: ['.mjs', '.js', '.jsx', '.json'], modules: ['node_modules'].concat(raw.NODE_PATH || []), - alias: { - 'core-js': path.dirname(require.resolve('core-js/package.json')), - ...reactPaths, - }, }, optimization: { splitChunks: { From 416ee3d1e955a91d534f2b6ba9b7df7c67a82e5f Mon Sep 17 00:00:00 2001 From: Norbert de Langen Date: Fri, 19 Apr 2019 21:58:21 +0200 Subject: [PATCH 04/22] CHANGE babel config to transpile to ESM --- .babelrc.js | 33 +++++++++++++++++++++++++++++---- lib/ui/package.json | 2 ++ 2 files changed, 31 insertions(+), 4 deletions(-) diff --git a/.babelrc.js b/.babelrc.js index 9577fdb09acc..60cf9ea26ff6 100644 --- a/.babelrc.js +++ b/.babelrc.js @@ -1,6 +1,14 @@ module.exports = { presets: [ - ['@babel/preset-env', { shippedProposals: true, useBuiltIns: 'usage', corejs: '2' }], + [ + '@babel/preset-env', + { + shippedProposals: true, + useBuiltIns: 'usage', + corejs: '3', + modules: false, + }, + ], '@babel/preset-typescript', '@babel/preset-react', '@babel/preset-flow', @@ -22,7 +30,15 @@ module.exports = { env: { test: { presets: [ - ['@babel/preset-env', { shippedProposals: true, useBuiltIns: 'usage', corejs: '2' }], + [ + '@babel/preset-env', + { + shippedProposals: true, + useBuiltIns: 'usage', + corejs: '3', + modules: 'commonjs', + }, + ], ], plugins: [ 'babel-plugin-require-context-hook', @@ -39,7 +55,15 @@ module.exports = { { test: './lib', presets: [ - ['@babel/preset-env', { shippedProposals: true, useBuiltIns: 'usage', corejs: '2' }], + [ + '@babel/preset-env', + { + shippedProposals: true, + useBuiltIns: 'usage', + corejs: '3', + modules: false, + }, + ], '@babel/preset-react', ], plugins: [ @@ -72,7 +96,8 @@ module.exports = { targets: { node: '8.11', }, - corejs: '2', + corejs: '3', + modules: 'commonjs', }, ], ], diff --git a/lib/ui/package.json b/lib/ui/package.json index d10c874da8d2..000bbbbaa631 100644 --- a/lib/ui/package.json +++ b/lib/ui/package.json @@ -31,6 +31,8 @@ "@storybook/theming": "5.1.0-alpha.30", "core-js": "^2.6.5", "fast-deep-equal": "^2.0.1", + "find-cache-dir": "^3.0.0", + "fs-extra": "^7.0.1", "fuse.js": "^3.4.4", "global": "^4.3.2", "lodash.debounce": "^4.0.8", From d021181ed7a93de8a40876870b86dfe7256a9ce9 Mon Sep 17 00:00:00 2001 From: Norbert de Langen Date: Fri, 19 Apr 2019 22:02:49 +0200 Subject: [PATCH 05/22] MIGRATE to core-js v3.0.1 --- addons/a11y/package.json | 2 +- addons/actions/package.json | 2 +- addons/backgrounds/package.json | 2 +- addons/centered/package.json | 2 +- addons/cssresources/package.json | 2 +- addons/events/package.json | 2 +- addons/google-analytics/package.json | 2 +- addons/graphql/package.json | 2 +- addons/info/package.json | 2 +- addons/jest/package.json | 2 +- addons/knobs/package.json | 2 +- addons/links/package.json | 2 +- addons/notes/package.json | 2 +- addons/ondevice-backgrounds/package.json | 2 +- addons/ondevice-knobs/package.json | 2 +- addons/ondevice-notes/package.json | 2 +- addons/options/package.json | 2 +- .../storyshots/storyshots-core/package.json | 2 +- .../storyshots-puppeteer/package.json | 2 +- addons/storysource/package.json | 2 +- addons/viewport/package.json | 2 +- app/angular/package.json | 2 +- app/ember/package.json | 2 +- app/html/package.json | 2 +- app/marko/package.json | 2 +- app/mithril/package.json | 2 +- app/polymer/package.json | 2 +- app/preact/package.json | 2 +- app/react/package.json | 2 +- app/riot/package.json | 2 +- app/svelte/package.json | 2 +- app/vue/package.json | 2 +- examples/angular-cli/package.json | 2 +- lib/addons/package.json | 2 +- lib/api/package.json | 2 +- lib/channel-postmessage/package.json | 2 +- lib/channel-websocket/package.json | 2 +- lib/channels/package.json | 2 +- lib/cli/package.json | 2 +- .../test/fixtures/angular-cli-v7/package.json | 2 +- lib/client-api/package.json | 2 +- lib/client-logger/package.json | 2 +- lib/codemod/package.json | 2 +- lib/components/package.json | 2 +- lib/core-events/package.json | 2 +- lib/core/package.json | 2 +- lib/core/src/server/common/babel.js | 2 +- lib/node-logger/package.json | 2 +- lib/router/package.json | 2 +- lib/theming/package.json | 2 +- lib/ui/package.json | 2 +- lib/ui/scripts/createDlls.js | 12 +++-- lib/ui/scripts/webpackDllsConfig.js | 12 ++++- package.json | 2 +- yarn.lock | 44 ++++++++++++++++++- 55 files changed, 113 insertions(+), 59 deletions(-) diff --git a/addons/a11y/package.json b/addons/a11y/package.json index 7980825e6223..f220c44fcbca 100644 --- a/addons/a11y/package.json +++ b/addons/a11y/package.json @@ -34,7 +34,7 @@ "@storybook/theming": "5.1.0-alpha.30", "axe-core": "^3.2.2", "common-tags": "^1.8.0", - "core-js": "^2.6.5", + "core-js": "^3.0.1", "global": "^4.3.2", "hoist-non-react-statics": "^3.3.0", "memoizerific": "^1.11.3", diff --git a/addons/actions/package.json b/addons/actions/package.json index bebbda463808..992a77529753 100644 --- a/addons/actions/package.json +++ b/addons/actions/package.json @@ -26,7 +26,7 @@ "@storybook/components": "5.1.0-alpha.30", "@storybook/core-events": "5.1.0-alpha.30", "@storybook/theming": "5.1.0-alpha.30", - "core-js": "^2.6.5", + "core-js": "^3.0.1", "fast-deep-equal": "^2.0.1", "global": "^4.3.2", "lodash": "^4.17.11", diff --git a/addons/backgrounds/package.json b/addons/backgrounds/package.json index 4d98120ddfed..4466d0f8f66c 100644 --- a/addons/backgrounds/package.json +++ b/addons/backgrounds/package.json @@ -31,7 +31,7 @@ "@storybook/components": "5.1.0-alpha.30", "@storybook/core-events": "5.1.0-alpha.30", "@storybook/theming": "5.1.0-alpha.30", - "core-js": "^2.6.5", + "core-js": "^3.0.1", "memoizerific": "^1.11.3", "react": "^16.8.4", "util-deprecate": "^1.0.2" diff --git a/addons/centered/package.json b/addons/centered/package.json index 32c935374b98..582d678b5b1b 100644 --- a/addons/centered/package.json +++ b/addons/centered/package.json @@ -23,7 +23,7 @@ "prepare": "node ../../scripts/prepare.js" }, "dependencies": { - "core-js": "^2.6.5", + "core-js": "^3.0.1", "global": "^4.3.2", "util-deprecate": "^1.0.2" }, diff --git a/addons/cssresources/package.json b/addons/cssresources/package.json index b9260fd5d215..15681139d638 100644 --- a/addons/cssresources/package.json +++ b/addons/cssresources/package.json @@ -29,7 +29,7 @@ "@storybook/api": "5.1.0-alpha.30", "@storybook/components": "5.1.0-alpha.30", "@storybook/core-events": "5.1.0-alpha.30", - "core-js": "^2.6.5", + "core-js": "^3.0.1", "global": "^4.3.2", "react": "^16.8.4" }, diff --git a/addons/events/package.json b/addons/events/package.json index 740eac8eb06d..0379965555d4 100644 --- a/addons/events/package.json +++ b/addons/events/package.json @@ -27,7 +27,7 @@ "@storybook/addons": "5.1.0-alpha.30", "@storybook/core-events": "5.1.0-alpha.30", "@storybook/theming": "5.1.0-alpha.30", - "core-js": "^2.6.5", + "core-js": "^3.0.1", "format-json": "^1.0.3", "prop-types": "^15.7.2", "react": "^16.8.4", diff --git a/addons/google-analytics/package.json b/addons/google-analytics/package.json index c4227f42d6ac..f2ea20e4d182 100644 --- a/addons/google-analytics/package.json +++ b/addons/google-analytics/package.json @@ -22,7 +22,7 @@ "dependencies": { "@storybook/addons": "5.1.0-alpha.30", "@storybook/core-events": "5.1.0-alpha.30", - "core-js": "^2.6.5", + "core-js": "^3.0.1", "global": "^4.3.2", "react-ga": "^2.5.7" }, diff --git a/addons/graphql/package.json b/addons/graphql/package.json index db213f6688bf..bd3116748548 100644 --- a/addons/graphql/package.json +++ b/addons/graphql/package.json @@ -22,7 +22,7 @@ "prepare": "node ../../scripts/prepare.js" }, "dependencies": { - "core-js": "^2.6.5", + "core-js": "^3.0.1", "global": "^4.3.2", "graphiql": "^0.13.0", "graphql": "^14.1.1", diff --git a/addons/info/package.json b/addons/info/package.json index 47790dcd7563..94e3e2ded01a 100644 --- a/addons/info/package.json +++ b/addons/info/package.json @@ -26,7 +26,7 @@ "@storybook/client-logger": "5.1.0-alpha.30", "@storybook/components": "5.1.0-alpha.30", "@storybook/theming": "5.1.0-alpha.30", - "core-js": "^2.6.5", + "core-js": "^3.0.1", "global": "^4.3.2", "marksy": "^6.1.0", "nested-object-assign": "^1.0.3", diff --git a/addons/jest/package.json b/addons/jest/package.json index 01708dfadfa9..66edfba5371f 100644 --- a/addons/jest/package.json +++ b/addons/jest/package.json @@ -33,7 +33,7 @@ "@storybook/components": "5.1.0-alpha.30", "@storybook/core-events": "5.1.0-alpha.30", "@storybook/theming": "5.1.0-alpha.30", - "core-js": "^2.6.5", + "core-js": "^3.0.1", "global": "^4.3.2", "react": "^16.8.4", "upath": "^1.1.0", diff --git a/addons/knobs/package.json b/addons/knobs/package.json index 24a4b1cdc104..d11b5d201324 100644 --- a/addons/knobs/package.json +++ b/addons/knobs/package.json @@ -28,7 +28,7 @@ "@storybook/core-events": "5.1.0-alpha.30", "@storybook/theming": "5.1.0-alpha.30", "copy-to-clipboard": "^3.0.8", - "core-js": "^2.6.5", + "core-js": "^3.0.1", "escape-html": "^1.0.3", "fast-deep-equal": "^2.0.1", "global": "^4.3.2", diff --git a/addons/links/package.json b/addons/links/package.json index faaf16202fe7..1d1cdfa67798 100644 --- a/addons/links/package.json +++ b/addons/links/package.json @@ -26,7 +26,7 @@ "@storybook/core-events": "5.1.0-alpha.30", "@storybook/router": "5.1.0-alpha.30", "common-tags": "^1.8.0", - "core-js": "^2.6.5", + "core-js": "^3.0.1", "global": "^4.3.2", "prop-types": "^15.7.2", "qs": "^6.6.0" diff --git a/addons/notes/package.json b/addons/notes/package.json index c28d22d3dd16..81063b65f878 100644 --- a/addons/notes/package.json +++ b/addons/notes/package.json @@ -29,7 +29,7 @@ "@storybook/components": "5.1.0-alpha.30", "@storybook/core-events": "5.1.0-alpha.30", "@storybook/theming": "5.1.0-alpha.30", - "core-js": "^2.6.5", + "core-js": "^3.0.1", "markdown-to-jsx": "^6.9.3", "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 3d85daa997ab..153f3f3a51dd 100644 --- a/addons/ondevice-backgrounds/package.json +++ b/addons/ondevice-backgrounds/package.json @@ -25,7 +25,7 @@ }, "dependencies": { "@storybook/addons": "5.1.0-alpha.30", - "core-js": "^2.6.5", + "core-js": "^3.0.1", "prop-types": "^15.7.2" }, "peerDependencies": { diff --git a/addons/ondevice-knobs/package.json b/addons/ondevice-knobs/package.json index e589f18e1fd9..bc9678d8b7fa 100644 --- a/addons/ondevice-knobs/package.json +++ b/addons/ondevice-knobs/package.json @@ -23,7 +23,7 @@ "dependencies": { "@storybook/addons": "5.1.0-alpha.30", "@storybook/core-events": "5.1.0-alpha.30", - "core-js": "^2.6.5", + "core-js": "^3.0.1", "deep-equal": "^1.0.1", "prop-types": "^15.7.2", "react-native-color-picker": "^0.4.0", diff --git a/addons/ondevice-notes/package.json b/addons/ondevice-notes/package.json index edc0dd134ad9..5ee7d54234eb 100644 --- a/addons/ondevice-notes/package.json +++ b/addons/ondevice-notes/package.json @@ -21,7 +21,7 @@ }, "dependencies": { "@storybook/addons": "5.1.0-alpha.30", - "core-js": "^2.6.5", + "core-js": "^3.0.1", "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 581185a45742..35a34f45bfd5 100644 --- a/addons/options/package.json +++ b/addons/options/package.json @@ -23,7 +23,7 @@ }, "dependencies": { "@storybook/addons": "5.1.0-alpha.30", - "core-js": "^2.6.5", + "core-js": "^3.0.1", "util-deprecate": "^1.0.2" }, "peerDependencies": { diff --git a/addons/storyshots/storyshots-core/package.json b/addons/storyshots/storyshots-core/package.json index dce13d2e65c6..ba4bf4aa83dd 100644 --- a/addons/storyshots/storyshots-core/package.json +++ b/addons/storyshots/storyshots-core/package.json @@ -26,7 +26,7 @@ }, "dependencies": { "@storybook/addons": "5.1.0-alpha.30", - "core-js": "^2.6.5", + "core-js": "^3.0.1", "glob": "^7.1.3", "global": "^4.3.2", "jest-specific-snapshot": "^2.0.0", diff --git a/addons/storyshots/storyshots-puppeteer/package.json b/addons/storyshots/storyshots-puppeteer/package.json index c4bfb3a309d6..2a01be59a7ee 100644 --- a/addons/storyshots/storyshots-puppeteer/package.json +++ b/addons/storyshots/storyshots-puppeteer/package.json @@ -24,7 +24,7 @@ "dependencies": { "@storybook/node-logger": "5.1.0-alpha.30", "@storybook/router": "5.1.0-alpha.30", - "core-js": "^2.6.5", + "core-js": "^3.0.1", "jest-image-snapshot": "^2.8.1", "puppeteer": "^1.12.2", "regenerator-runtime": "^0.12.1" diff --git a/addons/storysource/package.json b/addons/storysource/package.json index eecbb3c194e8..81da37006bc0 100644 --- a/addons/storysource/package.json +++ b/addons/storysource/package.json @@ -26,7 +26,7 @@ "@storybook/components": "5.1.0-alpha.30", "@storybook/router": "5.1.0-alpha.30", "@storybook/theming": "5.1.0-alpha.30", - "core-js": "^2.6.5", + "core-js": "^3.0.1", "estraverse": "^4.2.0", "loader-utils": "^1.2.3", "prettier": "^1.16.4", diff --git a/addons/viewport/package.json b/addons/viewport/package.json index 28466fbf8ed0..7a4cb7ddbe9c 100644 --- a/addons/viewport/package.json +++ b/addons/viewport/package.json @@ -26,7 +26,7 @@ "@storybook/components": "5.1.0-alpha.30", "@storybook/core-events": "5.1.0-alpha.30", "@storybook/theming": "5.1.0-alpha.30", - "core-js": "^2.6.5", + "core-js": "^3.0.1", "global": "^4.3.2", "memoizerific": "^1.11.3", "prop-types": "^15.7.2", diff --git a/app/angular/package.json b/app/angular/package.json index bd544fb277ef..39996d6bc461 100644 --- a/app/angular/package.json +++ b/app/angular/package.json @@ -29,7 +29,7 @@ "@storybook/core": "5.1.0-alpha.30", "@storybook/node-logger": "5.1.0-alpha.30", "angular2-template-loader": "^0.6.2", - "core-js": "^2.6.5", + "core-js": "^3.0.1", "fork-ts-checker-webpack-plugin": "^0.5.2", "global": "^4.3.2", "regenerator-runtime": "^0.12.1", diff --git a/app/ember/package.json b/app/ember/package.json index e6f2f13924e9..1681590a8ae9 100644 --- a/app/ember/package.json +++ b/app/ember/package.json @@ -26,7 +26,7 @@ "@ember/test-helpers": "^1.5.0", "@storybook/core": "5.1.0-alpha.30", "common-tags": "^1.8.0", - "core-js": "^2.6.5", + "core-js": "^3.0.1", "global": "^4.3.2", "regenerator-runtime": "^0.12.1" }, diff --git a/app/html/package.json b/app/html/package.json index 84e8a134d428..39205da8df59 100644 --- a/app/html/package.json +++ b/app/html/package.json @@ -27,7 +27,7 @@ "dependencies": { "@storybook/core": "5.1.0-alpha.30", "common-tags": "^1.8.0", - "core-js": "^2.6.5", + "core-js": "^3.0.1", "global": "^4.3.2", "html-loader": "^0.5.5", "regenerator-runtime": "^0.12.1" diff --git a/app/marko/package.json b/app/marko/package.json index 63752bac5db2..f019d0945218 100644 --- a/app/marko/package.json +++ b/app/marko/package.json @@ -28,7 +28,7 @@ "dependencies": { "@storybook/core": "5.1.0-alpha.30", "common-tags": "^1.8.0", - "core-js": "^2.6.5", + "core-js": "^3.0.1", "global": "^4.3.2", "marko-loader": "^1.5.0", "raw-loader": "^1.0.0", diff --git a/app/mithril/package.json b/app/mithril/package.json index 525f064c76c3..d6068145b0eb 100644 --- a/app/mithril/package.json +++ b/app/mithril/package.json @@ -29,7 +29,7 @@ "@babel/plugin-transform-react-jsx": "^7.3.0", "@storybook/core": "5.1.0-alpha.30", "common-tags": "^1.8.0", - "core-js": "^2.6.5", + "core-js": "^3.0.1", "global": "^4.3.2", "regenerator-runtime": "^0.12.1" }, diff --git a/app/polymer/package.json b/app/polymer/package.json index 35739a6970d3..e54e4176298f 100644 --- a/app/polymer/package.json +++ b/app/polymer/package.json @@ -28,7 +28,7 @@ "@storybook/core": "5.1.0-alpha.30", "@webcomponents/webcomponentsjs": "^1.2.0", "common-tags": "^1.8.0", - "core-js": "^2.6.5", + "core-js": "^3.0.1", "global": "^4.3.2", "regenerator-runtime": "^0.12.1", "webpack": "^4.28.0" diff --git a/app/preact/package.json b/app/preact/package.json index a0d70065015f..a79e0562200b 100644 --- a/app/preact/package.json +++ b/app/preact/package.json @@ -29,7 +29,7 @@ "@babel/plugin-transform-react-jsx": "^7.3.0", "@storybook/core": "5.1.0-alpha.30", "common-tags": "^1.8.0", - "core-js": "^2.6.5", + "core-js": "^3.0.1", "global": "^4.3.2", "regenerator-runtime": "^0.12.1" }, diff --git a/app/react/package.json b/app/react/package.json index 58541cb8b28d..28992c7a94fe 100644 --- a/app/react/package.json +++ b/app/react/package.json @@ -36,7 +36,7 @@ "babel-plugin-react-docgen": "^3.0.0", "babel-preset-react-app": "^7.0.2", "common-tags": "^1.8.0", - "core-js": "^2.6.5", + "core-js": "^3.0.1", "global": "^4.3.2", "lodash": "^4.17.11", "mini-css-extract-plugin": "^0.5.0", diff --git a/app/riot/package.json b/app/riot/package.json index 1619f42f03cb..d30f0d8be0ae 100644 --- a/app/riot/package.json +++ b/app/riot/package.json @@ -27,7 +27,7 @@ "dependencies": { "@storybook/core": "5.1.0-alpha.30", "common-tags": "^1.8.0", - "core-js": "^2.6.5", + "core-js": "^3.0.1", "global": "^4.3.2", "raw-loader": "^1.0.0", "regenerator-runtime": "^0.12.1" diff --git a/app/svelte/package.json b/app/svelte/package.json index af190495a585..1e944171891d 100644 --- a/app/svelte/package.json +++ b/app/svelte/package.json @@ -28,7 +28,7 @@ "dependencies": { "@storybook/core": "5.1.0-alpha.30", "common-tags": "^1.8.0", - "core-js": "^2.6.5", + "core-js": "^3.0.1", "global": "^4.3.2", "regenerator-runtime": "^0.12.1" }, diff --git a/app/vue/package.json b/app/vue/package.json index c99f95f5e184..aee67498d55a 100644 --- a/app/vue/package.json +++ b/app/vue/package.json @@ -28,7 +28,7 @@ "dependencies": { "@storybook/core": "5.1.0-alpha.30", "common-tags": "^1.8.0", - "core-js": "^2.6.5", + "core-js": "^3.0.1", "global": "^4.3.2", "regenerator-runtime": "^0.12.1" }, diff --git a/examples/angular-cli/package.json b/examples/angular-cli/package.json index 5b475362defe..525c3e4aaede 100644 --- a/examples/angular-cli/package.json +++ b/examples/angular-cli/package.json @@ -25,7 +25,7 @@ "@angular/platform-browser": "^7.2.6", "@angular/platform-browser-dynamic": "^7.2.6", "@ngrx/store": "^7.2.0", - "core-js": "^2.6.5", + "core-js": "^3.0.1", "rxjs": "^6.3.3", "rxjs-compat": "^6.4.0", "zone.js": "^0.8.29" diff --git a/lib/addons/package.json b/lib/addons/package.json index ec52c3117c56..74888f57bd27 100644 --- a/lib/addons/package.json +++ b/lib/addons/package.json @@ -24,7 +24,7 @@ "@storybook/api": "5.1.0-alpha.30", "@storybook/channels": "5.1.0-alpha.30", "@storybook/client-logger": "5.1.0-alpha.30", - "core-js": "^2.6.5", + "core-js": "^3.0.1", "global": "^4.3.2", "util-deprecate": "^1.0.2" }, diff --git a/lib/api/package.json b/lib/api/package.json index 1516a60408a9..7c16e552393a 100644 --- a/lib/api/package.json +++ b/lib/api/package.json @@ -25,7 +25,7 @@ "@storybook/core-events": "5.1.0-alpha.30", "@storybook/router": "5.1.0-alpha.30", "@storybook/theming": "5.1.0-alpha.30", - "core-js": "^2.6.5", + "core-js": "^3.0.1", "fast-deep-equal": "^2.0.1", "global": "^4.3.2", "lodash.isequal": "^4.5.0", diff --git a/lib/channel-postmessage/package.json b/lib/channel-postmessage/package.json index a49a97d9ab27..8d0ad73fed81 100644 --- a/lib/channel-postmessage/package.json +++ b/lib/channel-postmessage/package.json @@ -23,7 +23,7 @@ "dependencies": { "@storybook/channels": "5.1.0-alpha.30", "@storybook/client-logger": "5.1.0-alpha.30", - "core-js": "^2.6.5", + "core-js": "^3.0.1", "global": "^4.3.2", "telejson": "^2.1.1" }, diff --git a/lib/channel-websocket/package.json b/lib/channel-websocket/package.json index f10677871c7e..6375e9dd02ed 100644 --- a/lib/channel-websocket/package.json +++ b/lib/channel-websocket/package.json @@ -22,7 +22,7 @@ }, "dependencies": { "@storybook/channels": "5.1.0-alpha.30", - "core-js": "^2.6.5", + "core-js": "^3.0.1", "global": "^4.3.2", "json-fn": "^1.1.1" }, diff --git a/lib/channels/package.json b/lib/channels/package.json index 7fb51ba3d74a..42bae7c14758 100644 --- a/lib/channels/package.json +++ b/lib/channels/package.json @@ -21,7 +21,7 @@ "prepare": "node ../../scripts/prepare.js" }, "dependencies": { - "core-js": "^2.6.5" + "core-js": "^3.0.1" }, "publishConfig": { "access": "public" diff --git a/lib/cli/package.json b/lib/cli/package.json index 29f0e6d0dda2..a8cfedefc6ec 100644 --- a/lib/cli/package.json +++ b/lib/cli/package.json @@ -33,7 +33,7 @@ "@storybook/codemod": "5.1.0-alpha.30", "chalk": "^2.4.1", "commander": "^2.19.0", - "core-js": "^2.6.5", + "core-js": "^3.0.1", "cross-spawn": "^6.0.5", "inquirer": "^6.2.0", "jscodeshift": "^0.6.3", diff --git a/lib/cli/test/fixtures/angular-cli-v7/package.json b/lib/cli/test/fixtures/angular-cli-v7/package.json index 841a624516ab..e316e54912fd 100644 --- a/lib/cli/test/fixtures/angular-cli-v7/package.json +++ b/lib/cli/test/fixtures/angular-cli-v7/package.json @@ -20,7 +20,7 @@ "@angular/platform-browser": "~7.0.0", "@angular/platform-browser-dynamic": "~7.0.0", "@angular/router": "~7.0.0", - "core-js": "^2.6.5", + "core-js": "^3.0.1", "rxjs": "~6.3.3", "zone.js": "~0.8.26" }, diff --git a/lib/client-api/package.json b/lib/client-api/package.json index 30020f85e27e..76a78e3d0877 100644 --- a/lib/client-api/package.json +++ b/lib/client-api/package.json @@ -25,7 +25,7 @@ "@storybook/core-events": "5.1.0-alpha.30", "@storybook/router": "5.1.0-alpha.30", "common-tags": "^1.8.0", - "core-js": "^2.6.5", + "core-js": "^3.0.1", "eventemitter3": "^3.1.0", "global": "^4.3.2", "is-plain-object": "^2.0.4", diff --git a/lib/client-logger/package.json b/lib/client-logger/package.json index 3914ccef8aaf..da472be65374 100644 --- a/lib/client-logger/package.json +++ b/lib/client-logger/package.json @@ -21,7 +21,7 @@ "prepare": "node ../../scripts/prepare.js" }, "dependencies": { - "core-js": "^2.6.5" + "core-js": "^3.0.1" }, "publishConfig": { "access": "public" diff --git a/lib/codemod/package.json b/lib/codemod/package.json index 678db335c0d5..09f35447aa51 100644 --- a/lib/codemod/package.json +++ b/lib/codemod/package.json @@ -21,7 +21,7 @@ "prepare": "node ../../scripts/prepare.js" }, "dependencies": { - "core-js": "^2.6.5", + "core-js": "^3.0.1", "jscodeshift": "^0.6.3", "regenerator-runtime": "^0.12.1" }, diff --git a/lib/components/package.json b/lib/components/package.json index 0ce884357b76..e668697a30d6 100644 --- a/lib/components/package.json +++ b/lib/components/package.json @@ -23,7 +23,7 @@ "dependencies": { "@storybook/client-logger": "5.1.0-alpha.30", "@storybook/theming": "5.1.0-alpha.30", - "core-js": "^2.6.5", + "core-js": "^3.0.1", "global": "^4.3.2", "js-beautify": "^1.8.9", "markdown-to-jsx": "^6.9.1", diff --git a/lib/core-events/package.json b/lib/core-events/package.json index e7dcc8a0d4a5..9d21986499fc 100644 --- a/lib/core-events/package.json +++ b/lib/core-events/package.json @@ -21,7 +21,7 @@ "prepare": "node ../../scripts/prepare.js" }, "dependencies": { - "core-js": "^2.6.5" + "core-js": "^3.0.1" }, "publishConfig": { "access": "public" diff --git a/lib/core/package.json b/lib/core/package.json index bce9ed962110..5f7e75a8c8ff 100644 --- a/lib/core/package.json +++ b/lib/core/package.json @@ -46,7 +46,7 @@ "cli-table3": "0.5.1", "commander": "^2.19.0", "common-tags": "^1.8.0", - "core-js": "^2.6.5", + "core-js": "^3.0.1", "css-loader": "^2.1.1", "detect-port": "^1.3.0", "dotenv-webpack": "^1.7.0", diff --git a/lib/core/src/server/common/babel.js b/lib/core/src/server/common/babel.js index 2657bff8439b..e942fbc74b25 100644 --- a/lib/core/src/server/common/babel.js +++ b/lib/core/src/server/common/babel.js @@ -18,7 +18,7 @@ export default ({ configType }) => { presets: [ [ require.resolve('@babel/preset-env'), - { shippedProposals: true, useBuiltIns: 'usage', corejs: 2 }, + { shippedProposals: true, useBuiltIns: 'usage', corejs: '3' }, ], ...prodPresets, ], diff --git a/lib/node-logger/package.json b/lib/node-logger/package.json index 826057f1a555..0ef447ddf02d 100644 --- a/lib/node-logger/package.json +++ b/lib/node-logger/package.json @@ -22,7 +22,7 @@ }, "dependencies": { "chalk": "^2.4.2", - "core-js": "^2.6.5", + "core-js": "^3.0.1", "npmlog": "^4.1.2", "pretty-hrtime": "^1.0.3", "regenerator-runtime": "^0.12.1" diff --git a/lib/router/package.json b/lib/router/package.json index c878b82f26f4..08dd5d49def6 100644 --- a/lib/router/package.json +++ b/lib/router/package.json @@ -23,7 +23,7 @@ "dependencies": { "@reach/router": "^1.2.1", "@storybook/theming": "5.1.0-alpha.30", - "core-js": "^2.6.5", + "core-js": "^3.0.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 c06346f67868..23bb7d62a038 100644 --- a/lib/theming/package.json +++ b/lib/theming/package.json @@ -25,7 +25,7 @@ "@emotion/styled": "^10.0.7", "@storybook/client-logger": "5.1.0-alpha.30", "common-tags": "^1.8.0", - "core-js": "^2.6.5", + "core-js": "^3.0.1", "deep-object-diff": "^1.1.0", "emotion-theming": "^10.0.9", "global": "^4.3.2", diff --git a/lib/ui/package.json b/lib/ui/package.json index 000bbbbaa631..886bc68db4d9 100644 --- a/lib/ui/package.json +++ b/lib/ui/package.json @@ -29,7 +29,7 @@ "@storybook/core-events": "5.1.0-alpha.30", "@storybook/router": "5.1.0-alpha.30", "@storybook/theming": "5.1.0-alpha.30", - "core-js": "^2.6.5", + "core-js": "^3.0.1", "fast-deep-equal": "^2.0.1", "find-cache-dir": "^3.0.0", "fs-extra": "^7.0.1", diff --git a/lib/ui/scripts/createDlls.js b/lib/ui/scripts/createDlls.js index cee4c21f7b88..c0175a100f2a 100644 --- a/lib/ui/scripts/createDlls.js +++ b/lib/ui/scripts/createDlls.js @@ -1,5 +1,7 @@ import path from 'path'; +import fs from 'fs-extra'; import webpack from 'webpack'; +import findCacheDir from 'find-cache-dir'; import config from './webpackDllsConfig'; @@ -11,6 +13,12 @@ const webpackAsPromised = c => rej(stats); return; } + const location = path.join(findCacheDir({ name: 'storybook' }), 'dll-stats.json'); + const data = JSON.stringify(stats.toJson(), null, 2); + + fs.ensureFileSync(location); + fs.writeFileSync(location, data, 'utf8'); + res(stats); }); }); @@ -28,13 +36,11 @@ const run = () => '@storybook/core-events', '@storybook/theming', 'airbnb-js-shims', - 'core-js/es6/symbol', - 'core-js/fn/array/iterator', + 'react-resize-detector', 'emotion-theming', 'prop-types', 'react', 'react-dom', - 'regenerator-runtime/runtime', resolveLocal('../dist/index.js'), ], }, diff --git a/lib/ui/scripts/webpackDllsConfig.js b/lib/ui/scripts/webpackDllsConfig.js index 1e472c18b0d6..dfbcc1c819e8 100644 --- a/lib/ui/scripts/webpackDllsConfig.js +++ b/lib/ui/scripts/webpackDllsConfig.js @@ -21,7 +21,7 @@ export default ({ entry, provided = [] }) => ({ resolve: { extensions: ['.mjs', '.js', '.jsx', '.json'], - modules: [path.join(__dirname, '../../../node_modules')], + modules: ['node_modules', path.join(__dirname, '../../../node_modules')], }, plugins: [ @@ -35,9 +35,17 @@ export default ({ entry, provided = [] }) => ({ optimization: { concatenateModules: true, portableRecords: true, - moduleIds: 'hashed', + namedModules: true, + moduleIds: 'named', + chunkIds: 'named', minimizer: [ new TerserPlugin({ + cache: true, + sourceMap: true, + terserOptions: { + mangle: false, + keep_fnames: true, + }, extractComments: { condition: /^\**!|@preserve|@license|@cc_on/i, filename: file => file.replace('.js', '.LICENCE'), diff --git a/package.json b/package.json index b0f6e0d681da..cd4644903471 100644 --- a/package.json +++ b/package.json @@ -124,7 +124,7 @@ "codelyzer": "^5.0.0", "commander": "^2.19.0", "concurrently": "^4.0.1", - "core-js": "^2.6.5", + "core-js": "^3.0.1", "cross-env": "^5.2.0", "danger": "^7.0.15", "enzyme": "^3.9.0", diff --git a/yarn.lock b/yarn.lock index 402513de22ed..acbfedba52f8 100644 --- a/yarn.lock +++ b/yarn.lock @@ -7940,6 +7940,11 @@ 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, 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@^3.0.1: + version "3.0.1" + resolved "https://registry.yarnpkg.com/core-js/-/core-js-3.0.1.tgz#1343182634298f7f38622f95e73f54e48ddf4738" + integrity sha512-sco40rF+2KlE0ROMvydjkrVMMG1vYilP2ALoRXcYR4obqbYIuV3Bg+51GEDW+HF8n7NRA+iaA4qD0nD9lo9mew== + core-object@^3.1.5: version "3.1.5" resolved "https://registry.yarnpkg.com/core-object/-/core-object-3.1.5.tgz#fa627b87502adc98045e44678e9a8ec3b9c0d2a9" @@ -11472,6 +11477,15 @@ find-cache-dir@^2.0.0: make-dir "^2.0.0" pkg-dir "^3.0.0" +find-cache-dir@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/find-cache-dir/-/find-cache-dir-3.0.0.tgz#cd4b7dd97b7185b7e17dbfe2d6e4115ee3eeb8fc" + integrity sha512-t7ulV1fmbxh5G9l/492O1p5+EBbr3uwpt6odhFTMc+nWyhmbloe+ja9BZ8pIBtqFWhOmCWVjx+pTW4zDkFoclw== + dependencies: + commondir "^1.0.1" + make-dir "^3.0.0" + pkg-dir "^4.1.0" + find-index@^1.1.0: version "1.1.1" resolved "https://registry.yarnpkg.com/find-index/-/find-index-1.1.1.tgz#4b221f8d46b7f8bea33d8faed953f3ca7a081cbc" @@ -12463,13 +12477,20 @@ graphql-tools@3.0.0: iterall "^1.1.3" uuid "^3.1.0" -graphql@0.13.2, graphql@^0.13.2, graphql@^14.1.1: +graphql@0.13.2: 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" +graphql@^14.1.1: + version "14.2.1" + resolved "https://registry.yarnpkg.com/graphql/-/graphql-14.2.1.tgz#779529bf9a01e7207b977a54c20670b48ca6e95c" + integrity sha512-2PL1UbvKeSjy/lUeJqHk+eR9CvuErXoCNwJI4jm3oNFEeY+9ELqHNKO1ZuSxAkasPkpWbmT/iMRMFxd3cEL3tQ== + dependencies: + iterall "^1.2.2" + grizzly@^3.0.3: version "3.0.4" resolved "https://registry.yarnpkg.com/grizzly/-/grizzly-3.0.4.tgz#960dddeb03d05a49e1d80c984792854f3af2c306" @@ -14254,7 +14275,7 @@ isurl@^1.0.0-alpha5: has-to-string-tag-x "^1.2.0" is-object "^1.0.1" -iterall@1.2.2, iterall@^1.1.3, iterall@^1.2.1: +iterall@1.2.2, iterall@^1.1.3, iterall@^1.2.1, iterall@^1.2.2: version "1.2.2" resolved "https://registry.yarnpkg.com/iterall/-/iterall-1.2.2.tgz#92d70deb8028e0c39ff3164fdbf4d8b088130cd7" integrity sha512-yynBb1g+RFUPY64fTrFv7nsjRrENBQJaX2UL+2Szc9REFrSNm1rpSXHGzhmAy7a9uv3vlvgBlXnf9RqmPH1/DA== @@ -16820,6 +16841,13 @@ make-dir@^2.0.0: pify "^4.0.1" semver "^5.6.0" +make-dir@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/make-dir/-/make-dir-3.0.0.tgz#1b5f39f6b9270ed33f9f054c5c0f84304989f801" + integrity sha512-grNJDhb8b1Jm1qeqW5R/O63wUo4UXo2v2HMic6YT9i/HBlF93S8jkMgH7yugvY9ABDShH4VZMn8I+U8+fCNegw== + dependencies: + semver "^6.0.0" + make-error@1.x, make-error@^1.1.1: version "1.3.5" resolved "https://registry.yarnpkg.com/make-error/-/make-error-1.3.5.tgz#efe4e81f6db28cadd605c70f29c831b58ef776c8" @@ -19589,6 +19617,13 @@ pkg-dir@^3.0.0: dependencies: find-up "^3.0.0" +pkg-dir@^4.1.0: + version "4.1.0" + resolved "https://registry.yarnpkg.com/pkg-dir/-/pkg-dir-4.1.0.tgz#aaeb91c0d3b9c4f74a44ad849f4de34781ae01de" + integrity sha512-55k9QN4saZ8q518lE6EFgYiu95u3BWkSajCifhdQjvLvmr8IpnRbhI+UGpWJQfa0KzDguHeeWT1ccO1PmkOi3A== + dependencies: + find-up "^3.0.0" + pkg-up@2.0.0, pkg-up@^2.0.0: version "2.0.0" resolved "https://registry.yarnpkg.com/pkg-up/-/pkg-up-2.0.0.tgz#c819ac728059a461cab1c3889a2be3c49a004d7f" @@ -23305,6 +23340,11 @@ semver@5.6.0: resolved "https://registry.yarnpkg.com/semver/-/semver-5.6.0.tgz#7e74256fbaa49c75aa7c7a205cc22799cac80004" integrity sha512-RS9R6R35NYgQn++fkDWaOmqGoj4Ek9gGs+DPxNUZKuwE183xjJroKvyo1IzVFeXvUrvmALy6FWD5xrdJT25gMg== +semver@^6.0.0: + version "6.0.0" + resolved "https://registry.yarnpkg.com/semver/-/semver-6.0.0.tgz#05e359ee571e5ad7ed641a6eec1e547ba52dea65" + integrity sha512-0UewU+9rFapKFnlbirLi3byoOuhrSsli/z/ihNnvM24vgF+8sNBiI1LZPBSH9wJKUwaUbw+s3hToDLCXkrghrQ== + semver@~5.3.0: version "5.3.0" resolved "https://registry.yarnpkg.com/semver/-/semver-5.3.0.tgz#9b2ce5d3de02d17c6012ad326aa6b4d0cf54f94f" From 2193c36007785ec0ca4528e4c3cbe5de65d551ce Mon Sep 17 00:00:00 2001 From: Norbert de Langen Date: Fri, 19 Apr 2019 22:04:06 +0200 Subject: [PATCH 06/22] FIX version in root --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index cd4644903471..3de3a8207340 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@storybook/root", - "version": "5.1.0-alpha.14", + "version": "5.1.0-alpha.30", "private": true, "repository": { "type": "git", From 5d45bd50a2518feb72658c8130bf4243eca9296a Mon Sep 17 00:00:00 2001 From: Norbert de Langen Date: Fri, 19 Apr 2019 22:05:11 +0200 Subject: [PATCH 07/22] FIX bad typing of client-logger && FIX broken import of Type --- lib/addons/src/index.ts | 8 +++++--- lib/addons/src/typings.d.ts | 1 - 2 files changed, 5 insertions(+), 4 deletions(-) diff --git a/lib/addons/src/index.ts b/lib/addons/src/index.ts index 29793350d628..d36585ac6700 100644 --- a/lib/addons/src/index.ts +++ b/lib/addons/src/index.ts @@ -3,8 +3,10 @@ import global from 'global'; import { ReactElement } from 'react'; import { Channel } from '@storybook/channels'; import { API } from '@storybook/api'; -import logger from '@storybook/client-logger'; -import { types, Types, isSupportedType } from './types'; +import { logger } from '@storybook/client-logger'; +import { types, isSupportedType } from './types'; + +export type Types = types | string; export interface RenderOptions { active: boolean; @@ -28,7 +30,7 @@ export interface Addon { export type Loader = (api: API) => void; -export { types, Types, isSupportedType }; +export { types, isSupportedType }; interface Loaders { [key: string]: Loader; diff --git a/lib/addons/src/typings.d.ts b/lib/addons/src/typings.d.ts index b2b2f2203523..2f4eb9cf4fd9 100644 --- a/lib/addons/src/typings.d.ts +++ b/lib/addons/src/typings.d.ts @@ -1,2 +1 @@ declare module 'global'; -declare module '@storybook/client-logger'; From 8409dd820fd74518e007a21136547ccb75d27f68 Mon Sep 17 00:00:00 2001 From: Norbert de Langen Date: Fri, 19 Apr 2019 22:06:43 +0200 Subject: [PATCH 08/22] REMOVE core-js from ui paths --- lib/ui/paths.js | 1 - 1 file changed, 1 deletion(-) diff --git a/lib/ui/paths.js b/lib/ui/paths.js index 965c022ce33a..5580d9829de4 100644 --- a/lib/ui/paths.js +++ b/lib/ui/paths.js @@ -11,7 +11,6 @@ module.exports = { '@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')), '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')), From bab828cc72cd1ce56e274588e2043c0f9e3ecafa Mon Sep 17 00:00:00 2001 From: Norbert de Langen Date: Tue, 23 Apr 2019 09:02:31 +0200 Subject: [PATCH 09/22] FIX IE11 tested edge as well --- .babelrc.js | 6 ++++++ examples/official-storybook/webpack.config.js | 11 ----------- lib/core/src/server/common/babel.js | 16 ++++++++++++++-- lib/core/src/server/common/polyfills.js | 7 +++++-- yarn.lock | 11 ++--------- 5 files changed, 27 insertions(+), 24 deletions(-) diff --git a/.babelrc.js b/.babelrc.js index 60cf9ea26ff6..afa444167035 100644 --- a/.babelrc.js +++ b/.babelrc.js @@ -7,6 +7,9 @@ module.exports = { useBuiltIns: 'usage', corejs: '3', modules: false, + targets: { + browsers: ['Chrome >= 52', 'Explorer 11'], + }, }, ], '@babel/preset-typescript', @@ -62,6 +65,9 @@ module.exports = { useBuiltIns: 'usage', corejs: '3', modules: false, + targets: { + browsers: ['Chrome >= 52', 'Explorer 11'], + }, }, ], '@babel/preset-react', diff --git a/examples/official-storybook/webpack.config.js b/examples/official-storybook/webpack.config.js index 771730bb60a8..f07279e99c46 100644 --- a/examples/official-storybook/webpack.config.js +++ b/examples/official-storybook/webpack.config.js @@ -1,4 +1,3 @@ -const path = require('path'); const { DefinePlugin, ContextReplacementPlugin } = require('webpack'); module.exports = async ({ config }) => ({ @@ -7,16 +6,6 @@ module.exports = async ({ config }) => ({ ...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: /\.tsx?$/, use: [ diff --git a/lib/core/src/server/common/babel.js b/lib/core/src/server/common/babel.js index e942fbc74b25..4f80d798485a 100644 --- a/lib/core/src/server/common/babel.js +++ b/lib/core/src/server/common/babel.js @@ -18,7 +18,15 @@ export default ({ configType }) => { presets: [ [ require.resolve('@babel/preset-env'), - { shippedProposals: true, useBuiltIns: 'usage', corejs: '3' }, + { + shippedProposals: true, + useBuiltIns: 'usage', + corejs: '3', + modules: false, + targets: { + browsers: ['Chrome >= 52', 'Explorer 11'], + }, + }, ], ...prodPresets, ], @@ -26,7 +34,11 @@ export default ({ configType }) => { require.resolve('@babel/plugin-proposal-object-rest-spread'), require.resolve('@babel/plugin-proposal-class-properties'), require.resolve('@babel/plugin-syntax-dynamic-import'), - [require.resolve('babel-plugin-emotion'), { sourceMap: true, autoLabel: true }], + + /* commented this because it was adding labels multiple times, causing an error in IE11 since it doesn't allow the same property on the same object twice + maybe we can re-enable after this: https://github.com/emotion-js/emotion/pull/1220 is completed + this isn't all that important for users anyway */ + // [require.resolve('babel-plugin-emotion'), { sourceMap: true, autoLabel: true }], require.resolve('babel-plugin-macros'), ], }; diff --git a/lib/core/src/server/common/polyfills.js b/lib/core/src/server/common/polyfills.js index 09ea463081db..a427befb7b64 100644 --- a/lib/core/src/server/common/polyfills.js +++ b/lib/core/src/server/common/polyfills.js @@ -1,3 +1,6 @@ -import 'regenerator-runtime/runtime'; +// FOR IE11 +import 'core-js/features/symbol'; +import 'core-js/features/string'; +import 'core-js/features/number/is-nan'; +import 'core-js/features/regexp'; import 'airbnb-js-shims'; -import 'core-js/fn/symbol'; diff --git a/yarn.lock b/yarn.lock index acbfedba52f8..add06efdea34 100644 --- a/yarn.lock +++ b/yarn.lock @@ -12477,20 +12477,13 @@ graphql-tools@3.0.0: iterall "^1.1.3" uuid "^3.1.0" -graphql@0.13.2: +graphql@0.13.2, 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" -graphql@^14.1.1: - version "14.2.1" - resolved "https://registry.yarnpkg.com/graphql/-/graphql-14.2.1.tgz#779529bf9a01e7207b977a54c20670b48ca6e95c" - integrity sha512-2PL1UbvKeSjy/lUeJqHk+eR9CvuErXoCNwJI4jm3oNFEeY+9ELqHNKO1ZuSxAkasPkpWbmT/iMRMFxd3cEL3tQ== - dependencies: - iterall "^1.2.2" - grizzly@^3.0.3: version "3.0.4" resolved "https://registry.yarnpkg.com/grizzly/-/grizzly-3.0.4.tgz#960dddeb03d05a49e1d80c984792854f3af2c306" @@ -14275,7 +14268,7 @@ isurl@^1.0.0-alpha5: has-to-string-tag-x "^1.2.0" is-object "^1.0.1" -iterall@1.2.2, iterall@^1.1.3, iterall@^1.2.1, iterall@^1.2.2: +iterall@1.2.2, iterall@^1.1.3, 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== From 70b5eeb3c844a3a07b35f5896ba400439b73fe05 Mon Sep 17 00:00:00 2001 From: Norbert de Langen Date: Tue, 23 Apr 2019 09:02:53 +0200 Subject: [PATCH 10/22] CLEANUP --- addons/options/src/index.ts | 2 +- lib/client-api/src/client_api.js | 12 ++++++------ 2 files changed, 7 insertions(+), 7 deletions(-) diff --git a/addons/options/src/index.ts b/addons/options/src/index.ts index acfaf60bdc98..e007c840edb3 100644 --- a/addons/options/src/index.ts +++ b/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'; diff --git a/lib/client-api/src/client_api.js b/lib/client-api/src/client_api.js index ea975a595bab..ac82b019af19 100644 --- a/lib/client-api/src/client_api.js +++ b/lib/client-api/src/client_api.js @@ -2,8 +2,8 @@ import isPlainObject from 'is-plain-object'; import { logger } from '@storybook/client-logger'; -import addons from '@storybook/addons'; -import Events from '@storybook/core-events'; +import { addons } from '@storybook/addons'; +import { REGISTER_SUBSCRIPTION } from '@storybook/core-events'; import { toId } from '@storybook/router/utils'; import mergeWith from 'lodash.mergewith'; @@ -51,9 +51,9 @@ export const defaultDecorateStory = (storyFn, decorators) => ); const metaSubscription = () => { - addons.getChannel().on(Events.REGISTER_SUBSCRIPTION, subscriptionsStore.register); + addons.getChannel().on(REGISTER_SUBSCRIPTION, subscriptionsStore.register); return () => - addons.getChannel().removeListener(Events.REGISTER_SUBSCRIPTION, subscriptionsStore.register); + addons.getChannel().removeListener(REGISTER_SUBSCRIPTION, subscriptionsStore.register); }; const withSubscriptionTracking = storyFn => { @@ -91,8 +91,8 @@ export default class ClientApi { Object.assign( {}, { - hierarchyRootSeparator: '|', - hierarchySeparator: /\/|\./, + // hierarchyRootSeparator: '|', + // hierarchySeparator: /\/|\./, }, this._globalParameters.options ); From 4e9760cfb3ad275fd93044fea2e6f03f4ec354d8 Mon Sep 17 00:00:00 2001 From: Norbert de Langen Date: Tue, 23 Apr 2019 15:34:12 +0200 Subject: [PATCH 11/22] CLEANUP --- lib/api/src/version.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/lib/api/src/version.ts b/lib/api/src/version.ts index 1f19a990abfe..df0d8f95f00b 100644 --- a/lib/api/src/version.ts +++ b/lib/api/src/version.ts @@ -1 +1 @@ -export const version = '5.1.0-alpha.32'; +export const version = '5.1.0-alpha.33'; From 42eec05c5d1f7dec1cc36100fa2e2600b0040361 Mon Sep 17 00:00:00 2001 From: Norbert de Langen Date: Tue, 23 Apr 2019 15:36:41 +0200 Subject: [PATCH 12/22] REFACTOR to use import { addons } as we say users should too --- addons/actions/src/manager.tsx | 2 +- .../contexts/src/manager/libs/useChannel.ts | 2 +- addons/contexts/src/register.ts | 2 +- addons/events/src/index.js | 2 +- addons/jest/src/index.ts | 2 +- addons/jest/src/register.tsx | 2 +- addons/knobs/src/register.js | 2 +- addons/knobs/src/registerKnobs.js | 2 +- addons/links/src/manager.ts | 2 +- addons/links/src/preview.test.js | 2 +- addons/links/src/preview.ts | 2 +- addons/notes/src/register.tsx | 2 +- addons/options/src/register.ts | 2 +- .../storyshots-core/src/api/index.js | 2 +- addons/viewport/src/register.js | 2 +- .../src/client/manager/provider.js | 2 +- .../components/OnDeviceUI/addons/index.tsx | 2 +- .../preview/components/OnDeviceUI/index.tsx | 2 +- .../components/StoryListView/index.tsx | 2 +- .../preview/components/StoryView/index.tsx | 2 +- app/react-native/src/preview/index.tsx | 2 +- docs/src/pages/addons/writing-addons/index.md | 4 +- docs/src/pages/basics/faq/index.md | 2 +- .../stories/addon-events.stories.js | 2 +- .../stories/core/events.stories.js | 2 +- lib/addons/package.json | 4 +- lib/addons/src/index.ts | 113 ++---------------- lib/addons/src/main.ts | 110 +++++++++++++++++ lib/addons/src/public_api.ts | 11 -- lib/channels/README.md | 2 +- lib/core/src/client/manager/provider.js | 2 +- lib/core/src/client/preview/start.js | 2 +- 32 files changed, 148 insertions(+), 148 deletions(-) create mode 100644 lib/addons/src/main.ts delete mode 100644 lib/addons/src/public_api.ts diff --git a/addons/actions/src/manager.tsx b/addons/actions/src/manager.tsx index be1e6f8e1261..98f8d6386ba9 100644 --- a/addons/actions/src/manager.tsx +++ b/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 '.'; diff --git a/addons/contexts/src/manager/libs/useChannel.ts b/addons/contexts/src/manager/libs/useChannel.ts index a87b55ae260d..a1d2a625a8bc 100644 --- a/addons/contexts/src/manager/libs/useChannel.ts +++ b/addons/contexts/src/manager/libs/useChannel.ts @@ -1,5 +1,5 @@ export { Channel } from '@storybook/channels'; -import addons from '@storybook/addons'; +import { addons } from '@storybook/addons'; import { useEffect } from 'react'; import { AnyFunctionReturns } from '../../types'; diff --git a/addons/contexts/src/register.ts b/addons/contexts/src/register.ts index a3357a396992..7153f37eb771 100644 --- a/addons/contexts/src/register.ts +++ b/addons/contexts/src/register.ts @@ -1,5 +1,5 @@ import { createElement } from 'react'; -import addons, { types } from '@storybook/addons'; +import { addons, types } from '@storybook/addons'; import { AddonManager } from './manager/AddonManager'; import { ID } from './constants'; diff --git a/addons/events/src/index.js b/addons/events/src/index.js index 31eb1960e36f..0b19ad61c19e 100644 --- a/addons/events/src/index.js +++ b/addons/events/src/index.js @@ -1,4 +1,4 @@ -import addons from '@storybook/addons'; +import { addons } from '@storybook/addons'; import CoreEvents from '@storybook/core-events'; import deprecate from 'util-deprecate'; diff --git a/addons/jest/src/index.ts b/addons/jest/src/index.ts index b77449172639..6374ddc5f68b 100644 --- a/addons/jest/src/index.ts +++ b/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'; diff --git a/addons/jest/src/register.tsx b/addons/jest/src/register.tsx index b3058d321dd6..829db0b57420 100644 --- a/addons/jest/src/register.tsx +++ b/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'; diff --git a/addons/knobs/src/register.js b/addons/knobs/src/register.js index e8eeddb512c1..3938dc2074f3 100644 --- a/addons/knobs/src/register.js +++ b/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'; diff --git a/addons/knobs/src/registerKnobs.js b/addons/knobs/src/registerKnobs.js index 16eb9356b458..c05cfb9d0c24 100644 --- a/addons/knobs/src/registerKnobs.js +++ b/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'; diff --git a/addons/links/src/manager.ts b/addons/links/src/manager.ts index f2ec52c15855..eaccdd61e256 100644 --- a/addons/links/src/manager.ts +++ b/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'; diff --git a/addons/links/src/preview.test.js b/addons/links/src/preview.test.js index 2f9ba57677f6..530e4991aa5e 100644 --- a/addons/links/src/preview.test.js +++ b/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'; diff --git a/addons/links/src/preview.ts b/addons/links/src/preview.ts index 8354fdf0e199..8c11783150c0 100644 --- a/addons/links/src/preview.ts +++ b/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'; diff --git a/addons/notes/src/register.tsx b/addons/notes/src/register.tsx index 17d3c8d4189f..dc716086621d 100644 --- a/addons/notes/src/register.tsx +++ b/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'; diff --git a/addons/options/src/register.ts b/addons/options/src/register.ts index d9d09ac29e40..ecefa6d628c1 100644 --- a/addons/options/src/register.ts +++ b/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 => { diff --git a/addons/storyshots/storyshots-core/src/api/index.js b/addons/storyshots/storyshots-core/src/api/index.js index a764f0a26b25..62e787144090 100644 --- a/addons/storyshots/storyshots-core/src/api/index.js +++ b/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'; diff --git a/addons/viewport/src/register.js b/addons/viewport/src/register.js index deb8bf839d2a..64ee996c31d3 100644 --- a/addons/viewport/src/register.js +++ b/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'; diff --git a/app/react-native-server/src/client/manager/provider.js b/app/react-native-server/src/client/manager/provider.js index 08a93bcbf6c6..9852307ffbd2 100644 --- a/app/react-native-server/src/client/manager/provider.js +++ b/app/react-native-server/src/client/manager/provider.js @@ -2,7 +2,7 @@ import React from 'react'; import { Consumer } from '@storybook/api'; import { Provider } from '@storybook/ui'; import createChannel from '@storybook/channel-websocket'; -import addons from '@storybook/addons'; +import { addons } from '@storybook/addons'; import Events from '@storybook/core-events'; import uuid from 'uuid'; import PreviewHelp from './components/PreviewHelp'; diff --git a/app/react-native/src/preview/components/OnDeviceUI/addons/index.tsx b/app/react-native/src/preview/components/OnDeviceUI/addons/index.tsx index 5549fc7f18fa..656a4c3dc0e3 100644 --- a/app/react-native/src/preview/components/OnDeviceUI/addons/index.tsx +++ b/app/react-native/src/preview/components/OnDeviceUI/addons/index.tsx @@ -1,6 +1,6 @@ import React, { PureComponent } from 'react'; import { View, Text } from 'react-native'; -import addons from '@storybook/addons'; +import { addons } from '@storybook/addons'; import AddonsList from './list'; import AddonWrapper from './wrapper'; import style from '../style'; diff --git a/app/react-native/src/preview/components/OnDeviceUI/index.tsx b/app/react-native/src/preview/components/OnDeviceUI/index.tsx index caf0e7220c21..55cb9ca8041b 100644 --- a/app/react-native/src/preview/components/OnDeviceUI/index.tsx +++ b/app/react-native/src/preview/components/OnDeviceUI/index.tsx @@ -1,7 +1,7 @@ import React, { PureComponent } from 'react'; import { Keyboard, KeyboardAvoidingView, Platform, Animated, TouchableOpacity } from 'react-native'; import Events from '@storybook/core-events'; -import addons from '@storybook/addons'; +import { addons } from '@storybook/addons'; import Channel from '@storybook/channels'; import StoryListView from '../StoryListView'; import StoryView from '../StoryView'; diff --git a/app/react-native/src/preview/components/StoryListView/index.tsx b/app/react-native/src/preview/components/StoryListView/index.tsx index 8bee6465a79f..813237a82f2d 100644 --- a/app/react-native/src/preview/components/StoryListView/index.tsx +++ b/app/react-native/src/preview/components/StoryListView/index.tsx @@ -1,7 +1,7 @@ import React, { Component } from 'react'; import { SectionList, Text, TextInput, TouchableOpacity, View, SafeAreaView } from 'react-native'; import Events from '@storybook/core-events'; -import addons from '@storybook/addons'; +import { addons } from '@storybook/addons'; import style from './style'; interface SectionProps { diff --git a/app/react-native/src/preview/components/StoryView/index.tsx b/app/react-native/src/preview/components/StoryView/index.tsx index b7407527aab2..e47bbf08af3b 100644 --- a/app/react-native/src/preview/components/StoryView/index.tsx +++ b/app/react-native/src/preview/components/StoryView/index.tsx @@ -1,6 +1,6 @@ import React, { Component } from 'react'; import { View, Text } from 'react-native'; -import addons from '@storybook/addons'; +import { addons } from '@storybook/addons'; import Events from '@storybook/core-events'; import style from './style'; diff --git a/app/react-native/src/preview/index.tsx b/app/react-native/src/preview/index.tsx index 8be3979b5078..4b344db46df6 100644 --- a/app/react-native/src/preview/index.tsx +++ b/app/react-native/src/preview/index.tsx @@ -2,7 +2,7 @@ import React from 'react'; import { AsyncStorage } from 'react-native'; // @ts-ignore import getHost from 'rn-host-detect'; -import addons from '@storybook/addons'; +import { addons } from '@storybook/addons'; import Events from '@storybook/core-events'; import Channel from '@storybook/channels'; import createChannel from '@storybook/channel-websocket'; diff --git a/docs/src/pages/addons/writing-addons/index.md b/docs/src/pages/addons/writing-addons/index.md index 1d58f8ff6a56..d1d0f35698ae 100644 --- a/docs/src/pages/addons/writing-addons/index.md +++ b/docs/src/pages/addons/writing-addons/index.md @@ -62,7 +62,7 @@ We write an addon that responds to a change in story selection like so: import React from 'react'; import { STORY_RENDERED } from '@storybook/core-events'; -import addons, { types } from '@storybook/addons'; +import { addons, types } from '@storybook/addons'; const ADDON_ID = 'myaddon'; const PANEL_ID = `${ADDON_ID}/panel`; @@ -170,7 +170,7 @@ Notice how the storybook API itself has `.on()`, `.off()` and `.emit()` methods ```js import React from 'react'; -import addons from '@storybook/addons'; +import { addons } from '@storybook/addons'; import { STORY_CHANGED } from '@storybook/core-events'; class MyPanel extends React.Component { diff --git a/docs/src/pages/basics/faq/index.md b/docs/src/pages/basics/faq/index.md index 9c247593014f..8ff5f0891a27 100644 --- a/docs/src/pages/basics/faq/index.md +++ b/docs/src/pages/basics/faq/index.md @@ -30,7 +30,7 @@ A common error is that an addon tries to access the "channel", but the channel i 1. You're trying to access addon channel (e.g. by calling `setOptions`) in a non-browser environment like Jest. You may need to add a channel mock: ```js - import addons, { mockChannel } from '@storybook/addons'; + import { addons, mockChannel } from '@storybook/addons'; addons.setChannel(mockChannel()); ``` diff --git a/examples/html-kitchen-sink/stories/addon-events.stories.js b/examples/html-kitchen-sink/stories/addon-events.stories.js index 5da5b3b9c38a..00420cabca22 100644 --- a/examples/html-kitchen-sink/stories/addon-events.stories.js +++ b/examples/html-kitchen-sink/stories/addon-events.stories.js @@ -1,6 +1,6 @@ import EventEmitter from 'eventemitter3'; import { storiesOf } from '@storybook/html'; -import addons from '@storybook/addons'; +import { addons } from '@storybook/addons'; import CoreEvents from '@storybook/core-events'; import json from 'format-json'; diff --git a/examples/official-storybook/stories/core/events.stories.js b/examples/official-storybook/stories/core/events.stories.js index 2cfc555d1054..ca322e138f85 100644 --- a/examples/official-storybook/stories/core/events.stories.js +++ b/examples/official-storybook/stories/core/events.stories.js @@ -1,5 +1,5 @@ import React from 'react'; -import addons from '@storybook/addons'; +import { addons } from '@storybook/addons'; import Events from '@storybook/core-events'; import { Button } from '@storybook/components'; diff --git a/lib/addons/package.json b/lib/addons/package.json index 0981598b03a7..a7cc9cb58233 100644 --- a/lib/addons/package.json +++ b/lib/addons/package.json @@ -15,8 +15,8 @@ "directory": "lib/addons" }, "license": "MIT", - "main": "dist/public_api.js", - "types": "dist/public_api.d.ts", + "main": "dist/index.js", + "types": "dist/index.d.ts", "scripts": { "prepare": "node ../../scripts/prepare.js" }, diff --git a/lib/addons/src/index.ts b/lib/addons/src/index.ts index d36585ac6700..2f3de99d57c9 100644 --- a/lib/addons/src/index.ts +++ b/lib/addons/src/index.ts @@ -1,110 +1,11 @@ -import global from 'global'; -// tslint:disable-next-line:no-implicit-dependencies -import { ReactElement } from 'react'; -import { Channel } from '@storybook/channels'; -import { API } from '@storybook/api'; -import { logger } from '@storybook/client-logger'; -import { types, isSupportedType } from './types'; - -export type Types = types | string; - -export interface RenderOptions { - active: boolean; - key: string; -} -export interface RouteOptions { - storyId: string; -} -export interface MatchOptions { - viewMode: string; -} - -export interface Addon { - title: string; - type?: Types; - id?: string; - route?: (routeOptions: RouteOptions) => string; - match?: (matchOptions: MatchOptions) => boolean; - render: (renderOptions: RenderOptions) => ReactElement; -} - -export type Loader = (api: API) => void; - -export { types, isSupportedType }; - -interface Loaders { - [key: string]: Loader; -} -export interface Collection { - [key: string]: Addon; -} -interface Elements { - [key: string]: Collection; -} - -export class AddonStore { - private loaders: Loaders = {}; - private elements: Elements = {}; - private channel: Channel | undefined; - - 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' - ); - } - - return this.channel; - }; - hasChannel = (): boolean => !!this.channel; - setChannel = (channel: Channel): void => { - this.channel = channel; - }; - - getElements = (type: Types): Collection => { - if (!this.elements[type]) { - this.elements[type] = {}; - } - return this.elements[type]; - }; - addPanel = (name: string, options: Addon): void => { - this.add(name, { - type: types.PANEL, - ...options, - }); - }; - add = (name: string, addon: Addon) => { - const { type } = addon; - const collection = this.getElements(type); - collection[name] = { id: name, ...addon }; - }; - - register = (name: string, registerCallback: (api: API) => void): void => { - if (this.loaders[name]) { - logger.warn(`${name} was loaded twice, this could have bad side-effects`); - } - this.loaders[name] = registerCallback; - }; - - loadAddons = (api: any) => { - Object.values(this.loaders).forEach(value => value(api)); - }; -} - -// Enforce addons store to be a singleton -const KEY = '__STORYBOOK_ADDONS'; - -function getAddonsStore(): AddonStore { - if (!global[KEY]) { - global[KEY] = new AddonStore(); - } - return global[KEY]; -} +export * from './make-decorator'; +export * from './main'; +export * from './storybook-channel-mock'; +// There can only be 1 default export per entry point and it has to be directly from public_api // Exporting this twice in order to to be able to import it like { addons } instead of 'addons' // prefer import { addons } from '@storybook/addons' over import addons from '@storybook/addons' // -// See public_api.ts - -export const addons = getAddonsStore(); +// See index.ts +import { addons } from './main'; +export default addons; diff --git a/lib/addons/src/main.ts b/lib/addons/src/main.ts new file mode 100644 index 000000000000..d36585ac6700 --- /dev/null +++ b/lib/addons/src/main.ts @@ -0,0 +1,110 @@ +import global from 'global'; +// tslint:disable-next-line:no-implicit-dependencies +import { ReactElement } from 'react'; +import { Channel } from '@storybook/channels'; +import { API } from '@storybook/api'; +import { logger } from '@storybook/client-logger'; +import { types, isSupportedType } from './types'; + +export type Types = types | string; + +export interface RenderOptions { + active: boolean; + key: string; +} +export interface RouteOptions { + storyId: string; +} +export interface MatchOptions { + viewMode: string; +} + +export interface Addon { + title: string; + type?: Types; + id?: string; + route?: (routeOptions: RouteOptions) => string; + match?: (matchOptions: MatchOptions) => boolean; + render: (renderOptions: RenderOptions) => ReactElement; +} + +export type Loader = (api: API) => void; + +export { types, isSupportedType }; + +interface Loaders { + [key: string]: Loader; +} +export interface Collection { + [key: string]: Addon; +} +interface Elements { + [key: string]: Collection; +} + +export class AddonStore { + private loaders: Loaders = {}; + private elements: Elements = {}; + private channel: Channel | undefined; + + 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' + ); + } + + return this.channel; + }; + hasChannel = (): boolean => !!this.channel; + setChannel = (channel: Channel): void => { + this.channel = channel; + }; + + getElements = (type: Types): Collection => { + if (!this.elements[type]) { + this.elements[type] = {}; + } + return this.elements[type]; + }; + addPanel = (name: string, options: Addon): void => { + this.add(name, { + type: types.PANEL, + ...options, + }); + }; + add = (name: string, addon: Addon) => { + const { type } = addon; + const collection = this.getElements(type); + collection[name] = { id: name, ...addon }; + }; + + register = (name: string, registerCallback: (api: API) => void): void => { + if (this.loaders[name]) { + logger.warn(`${name} was loaded twice, this could have bad side-effects`); + } + this.loaders[name] = registerCallback; + }; + + loadAddons = (api: any) => { + Object.values(this.loaders).forEach(value => value(api)); + }; +} + +// Enforce addons store to be a singleton +const KEY = '__STORYBOOK_ADDONS'; + +function getAddonsStore(): AddonStore { + if (!global[KEY]) { + global[KEY] = new AddonStore(); + } + return global[KEY]; +} + +// Exporting this twice in order to to be able to import it like { addons } instead of 'addons' +// prefer import { addons } from '@storybook/addons' over import addons from '@storybook/addons' +// +// See public_api.ts + +export const addons = getAddonsStore(); diff --git a/lib/addons/src/public_api.ts b/lib/addons/src/public_api.ts deleted file mode 100644 index 27cada126566..000000000000 --- a/lib/addons/src/public_api.ts +++ /dev/null @@ -1,11 +0,0 @@ -export * from './make-decorator'; -export * from './index'; -export * from './storybook-channel-mock'; - -// There can only be 1 default export per entry point and it has to be directly from public_api -// Exporting this twice in order to to be able to import it like { addons } instead of 'addons' -// prefer import { addons } from '@storybook/addons' over import addons from '@storybook/addons' -// -// See index.ts -import { addons } from './index'; -export default addons; diff --git a/lib/channels/README.md b/lib/channels/README.md index 5bce6d0af6e6..53493758d27a 100644 --- a/lib/channels/README.md +++ b/lib/channels/README.md @@ -32,7 +32,7 @@ class Transport { Currently, channels are baked into storybook implementations and therefore this module is not designed to be used directly by addon developers. When developing addons, use the `getChannel` method exported by `@storybook/addons` module. For this to work, Storybook implementations should use the `setChannel` method before loading addons. ```js -import addons from '@storybook/addons'; +import { addons } from '@storybook/addons'; const channel = addons.getChannel(); ``` diff --git a/lib/core/src/client/manager/provider.js b/lib/core/src/client/manager/provider.js index 8ebdf8dee184..d721fae04a07 100644 --- a/lib/core/src/client/manager/provider.js +++ b/lib/core/src/client/manager/provider.js @@ -1,5 +1,5 @@ import { Provider } from '@storybook/ui'; -import addons from '@storybook/addons'; +import { addons } from '@storybook/addons'; import createChannel from '@storybook/channel-postmessage'; import Events from '@storybook/core-events'; diff --git a/lib/core/src/client/preview/start.js b/lib/core/src/client/preview/start.js index ffb269892bdb..1805e85b386c 100644 --- a/lib/core/src/client/preview/start.js +++ b/lib/core/src/client/preview/start.js @@ -1,4 +1,4 @@ -import addons from '@storybook/addons'; +import { addons } from '@storybook/addons'; import { navigator, window, document } from 'global'; import createChannel from '@storybook/channel-postmessage'; import { ClientApi, StoryStore, ConfigApi } from '@storybook/client-api'; From 553ae86e7ab5149ddf1d6c6927bd1831b5e62d3c Mon Sep 17 00:00:00 2001 From: Norbert de Langen Date: Tue, 23 Apr 2019 17:31:56 +0200 Subject: [PATCH 13/22] CLEANUP --- lib/core-events/src/index.ts | 1 + lib/core/src/client/preview/start.js | 33 ++++++++++++++++++---------- 2 files changed, 23 insertions(+), 11 deletions(-) diff --git a/lib/core-events/src/index.ts b/lib/core-events/src/index.ts index 43195089ed63..e295b805f866 100644 --- a/lib/core-events/src/index.ts +++ b/lib/core-events/src/index.ts @@ -42,4 +42,5 @@ export const STORY_RENDERED = events.STORY_RENDERED; export const STORY_MISSING = events.STORY_MISSING; export const STORY_ERRORED = events.STORY_ERRORED; export const STORY_CHANGED = events.STORY_CHANGED; +export const STORY_UNCHANGED = events.STORY_UNCHANGED; export const STORY_THREW_EXCEPTION = events.STORY_THREW_EXCEPTION; diff --git a/lib/core/src/client/preview/start.js b/lib/core/src/client/preview/start.js index 1805e85b386c..531dd99ee2d8 100644 --- a/lib/core/src/client/preview/start.js +++ b/lib/core/src/client/preview/start.js @@ -4,7 +4,18 @@ import createChannel from '@storybook/channel-postmessage'; 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 { + FORCE_RE_RENDER, + PREVIEW_KEYDOWN, + SET_CURRENT_STORY, + STORY_CHANGED, + STORY_ERRORED, + STORY_MISSING, + STORY_RENDER, + STORY_RENDERED, + STORY_THREW_EXCEPTION, + STORY_UNCHANGED, +} from '@storybook/core-events'; import deprecate from 'util-deprecate'; const classes = { @@ -39,7 +50,7 @@ function showErrorDisplay({ message, stack }) { // showError is used by the various app layers to inform the user they have done something // wrong -- for instance returned the wrong thing from a story function showError({ title, description }) { - addons.getChannel().emit(Events.STORY_ERRORED, { title, description }); + addons.getChannel().emit(STORY_ERRORED, { title, description }); showErrorDisplay({ message: title, stack: description, @@ -48,7 +59,7 @@ function showError({ title, description }) { // showException is used if we fail to render the story and it is uncaught by the app layer function showException(exception) { - addons.getChannel().emit(Events.STORY_THREW_EXCEPTION, exception); + addons.getChannel().emit(STORY_THREW_EXCEPTION, exception); showErrorDisplay(exception); // Log the stack to the console. So, user could check the source code. @@ -134,12 +145,12 @@ export default function start(render, { decorateStory } = {}) { kind === previousKind && previousStory === name ) { - addons.getChannel().emit(Events.STORY_UNCHANGED, id); + addons.getChannel().emit(STORY_UNCHANGED, id); return; } if (!forceRender && previousKind && previousStory) { - addons.getChannel().emit(Events.STORY_CHANGED, id); + addons.getChannel().emit(STORY_CHANGED, id); } render({ @@ -149,10 +160,10 @@ export default function start(render, { decorateStory } = {}) { selectedStory: name, forceRender, }); - addons.getChannel().emit(Events.STORY_RENDERED, id); + addons.getChannel().emit(STORY_RENDERED, id); } else { showNopreview(); - addons.getChannel().emit(Events.STORY_MISSING, id); + addons.getChannel().emit(STORY_MISSING, id); } previousRevision = revision; previousKind = kind; @@ -183,8 +194,8 @@ export default function start(render, { decorateStory } = {}) { `Passing name+kind to the SET_CURRENT_STORY event is deprecated, use a storyId instead` ); - channel.on(Events.FORCE_RE_RENDER, forceReRender); - channel.on(Events.SET_CURRENT_STORY, ({ storyId: inputStoryId, name, kind }) => { + channel.on(FORCE_RE_RENDER, forceReRender); + channel.on(SET_CURRENT_STORY, ({ storyId: inputStoryId, name, kind }) => { let storyId = inputStoryId; // For backwards compatibility if (!storyId) { @@ -205,14 +216,14 @@ export default function start(render, { decorateStory } = {}) { if (!focusInInput(event)) { // We have to pick off the keys of the event that we need on the other side const { altKey, ctrlKey, metaKey, shiftKey, key, code, keyCode } = event; - channel.emit(Events.PREVIEW_KEYDOWN, { + channel.emit(PREVIEW_KEYDOWN, { event: { altKey, ctrlKey, metaKey, shiftKey, key, code, keyCode }, }); } }; } - storyStore.on(Events.STORY_RENDER, renderUI); + storyStore.on(STORY_RENDER, renderUI); if (typeof window !== 'undefined') { window.__STORYBOOK_CLIENT_API__ = clientApi; From cbcaa920c8f9125e36100c5060f6ba973f941f2c Mon Sep 17 00:00:00 2001 From: Norbert de Langen Date: Tue, 23 Apr 2019 21:13:22 +0200 Subject: [PATCH 14/22] FIX tests --- .babelrc.js | 40 ++++++++++++++++++ .../HighlightToggle.test.js.snap | 4 +- addons/centered/react.mjs | 3 ++ .../src/frameworks/angular/loader.js | 6 +-- addons/viewport/preview.mjs | 6 +++ examples/angular-cli/jest.config.js | 21 +++++++++- examples/cra-kitchen-sink/jest.config.js | 16 +++----- jest.config.js | 41 ++++++++++++++++++- lib/client-api/src/client_api.js | 4 +- lib/core-events/package.json | 1 + lib/core/client.mjs | 5 +++ 11 files changed, 126 insertions(+), 21 deletions(-) create mode 100644 addons/centered/react.mjs create mode 100644 addons/viewport/preview.mjs create mode 100644 lib/core/client.mjs diff --git a/.babelrc.js b/.babelrc.js index afa444167035..b29e60fb62ee 100644 --- a/.babelrc.js +++ b/.babelrc.js @@ -82,6 +82,26 @@ module.exports = { '@babel/plugin-transform-react-constant-elements', 'babel-plugin-add-react-displayname', ], + env: { + test: { + presets: [ + [ + '@babel/preset-env', + { + shippedProposals: true, + useBuiltIns: 'usage', + corejs: '3', + modules: 'commonjs', + }, + ], + ], + plugins: [ + 'babel-plugin-require-context-hook', + 'babel-plugin-dynamic-import-node', + '@babel/plugin-transform-runtime', + ], + }, + }, }, { test: [ @@ -114,6 +134,26 @@ module.exports = { '@babel/plugin-proposal-object-rest-spread', '@babel/plugin-proposal-export-default-from', ], + env: { + test: { + presets: [ + [ + '@babel/preset-env', + { + shippedProposals: true, + useBuiltIns: 'usage', + corejs: '3', + modules: 'commonjs', + }, + ], + ], + plugins: [ + 'babel-plugin-require-context-hook', + 'babel-plugin-dynamic-import-node', + '@babel/plugin-transform-runtime', + ], + }, + }, }, ], }; diff --git a/addons/a11y/src/components/Report/__snapshots__/HighlightToggle.test.js.snap b/addons/a11y/src/components/Report/__snapshots__/HighlightToggle.test.js.snap index 1aea8f83cef1..c324aab1ca2c 100644 --- a/addons/a11y/src/components/Report/__snapshots__/HighlightToggle.test.js.snap +++ b/addons/a11y/src/components/Report/__snapshots__/HighlightToggle.test.js.snap @@ -78,12 +78,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", diff --git a/addons/centered/react.mjs b/addons/centered/react.mjs new file mode 100644 index 000000000000..a41c52fe13c9 --- /dev/null +++ b/addons/centered/react.mjs @@ -0,0 +1,3 @@ +import wrapper from './src/react'; + +export default wrapper; diff --git a/addons/storyshots/storyshots-core/src/frameworks/angular/loader.js b/addons/storyshots/storyshots-core/src/frameworks/angular/loader.js index 8a236f84f3dc..05c33899c4f0 100644 --- a/addons/storyshots/storyshots-core/src/frameworks/angular/loader.js +++ b/addons/storyshots/storyshots-core/src/frameworks/angular/loader.js @@ -1,13 +1,13 @@ import 'core-js'; -import 'core-js/es6/reflect'; -import 'core-js/es7/reflect'; +import 'core-js/es/reflect'; +import 'core-js/proposals/reflect-metadata'; import hasDependency from '../hasDependency'; import configure from '../configure'; function setupAngularJestPreset() { // Needed to prevent "Zone.js has detected that ZoneAwarePromise `(window|global).Promise` has been overwritten." require.requireActual('core-js'); - require.requireActual('core-js/modules/es6.promise'); + require.requireActual('core-js/modules/es.promise'); // require.requireActual('core-js/es6/reflect'); // require.requireActual('core-js/es7/reflect'); diff --git a/addons/viewport/preview.mjs b/addons/viewport/preview.mjs new file mode 100644 index 000000000000..8136c698c1e3 --- /dev/null +++ b/addons/viewport/preview.mjs @@ -0,0 +1,6 @@ +export { + configureViewport, + DEFAULT_VIEWPORT, + INITIAL_VIEWPORTS, + withViewport, +} from './src/legacy_preview/index'; diff --git a/examples/angular-cli/jest.config.js b/examples/angular-cli/jest.config.js index faadcb13f9a2..d6a0d7792357 100644 --- a/examples/angular-cli/jest.config.js +++ b/examples/angular-cli/jest.config.js @@ -1,15 +1,32 @@ const config = require('../../jest.config'); +const moduleNameMapper = Object.entries(config.moduleNameMapper).reduce( + (acc, [k, v]) => (k.match(/(angular|storyshots)/) ? acc : Object.assign(acc, { [k]: v })), + { + '@storybook/angular$': '/app/angular/dist/client/index', + '@storybook/addon-storyshots$': '/addons/storyshots/storyshots-core/dist', + '@storybook/addon-storyshots-puppeteer$': + '/addons/storyshots/storyshots-puppeteer/dist', + 'core-js/modules/es6.promise': 'core-js/modules/es.promise', + } +); + module.exports = { ...config, globals: { __TRANSFORM_HTML__: true, }, roots: [__dirname], + moduleNameMapper, transform: { '^.+\\.jsx?$': '/scripts/babel-jest.js', - '^.+[/\\\\].storybook[/\\\\]config\\.ts$': '/scripts/jest-ts-babel.js', - '^.+\\.(ts|html)$': '/node_modules/jest-preset-angular/preprocessor.js', + '^.+\\.mjs$': '/scripts/babel-jest.js', + '^.+[/\\\\].storybook[/\\\\]config\\.ts$': '/scripts/babel-jest.js', + '^.+/examples/.+\\.(ts|html)$': '/node_modules/jest-preset-angular/preprocessor.js', + '^.+/lib/.+\\.tsx?$': '/scripts/babel-jest.js', + '^.+/addons/.+\\.tsx?$': '/scripts/babel-jest.js', + // '^.+/app/.+\\.tsx?$': '/scripts/jest-ts-babel.js', + // ...config.transform, }, moduleFileExtensions: [...config.moduleFileExtensions, 'html'], }; diff --git a/examples/cra-kitchen-sink/jest.config.js b/examples/cra-kitchen-sink/jest.config.js index b1ffc36fb83f..1b3b3d504b6f 100644 --- a/examples/cra-kitchen-sink/jest.config.js +++ b/examples/cra-kitchen-sink/jest.config.js @@ -3,15 +3,9 @@ const config = require('../../jest.config'); module.exports = { ...config, roots: [__dirname], - moduleNameMapper: { - '\\.(jpg|jpeg|png|gif|eot|otf|webp|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$': - '/__mocks__/fileMock.js', - '\\.(css|scss)$': '/__mocks__/styleMock.js', - '\\.(md)$': '/__mocks__/htmlMock.js', - }, - transform: { - ...config.transform, - '^.+\\.svg$': '/node_modules/react-scripts/config/jest/fileTransform.js', - }, - moduleDirectories: ['/node_modules', 'src'], + // transform: { + // ...config.transform, + // '^.+\\.svg$': '/node_modules/react-scripts/config/jest/fileTransform.js', + // }, + moduleDirectories: ['node_modules', '/node_modules', './src'], }; diff --git a/jest.config.js b/jest.config.js index 0c1096cb9481..5090f8759535 100644 --- a/jest.config.js +++ b/jest.config.js @@ -6,6 +6,44 @@ module.exports = { '/__mocks__/fileMock.js', '\\.(css|scss)$': '/__mocks__/styleMock.js', '\\.(md)$': '/__mocks__/htmlMock.js', + '@storybook/addons$': '/lib/addons/src', + '@storybook/core/client$': '/lib/core/client.mjs', + '@storybook/core$': '/lib/core/src', + '@storybook/ui$': '/lib/ui/src', + '@storybook/components$': '/lib/components/src', + '@storybook/theming$': '/lib/theming/src', + '@storybook/api$': '/lib/api/src', + '@storybook/channel-postmessage$': '/lib/channel-postmessage/src', + '@storybook/channel-websocket$': '/lib/channel-websocket/src', + '@storybook/channels$': '/lib/channels/src', + '@storybook/client-api$': '/lib/client-api/src', + '@storybook/client-logger$': '/lib/client-logger/src', + '@storybook/core-events$': '/lib/core-events/src', + '@storybook/node-logger$': '/lib/node-logger/src', + '@storybook/router$': '/lib/router/src', + '@storybook/cli$': '/lib/cli/src', + '@storybook/angular$': '/app/angular/src/client/index', + '@storybook/ember$': '/app/ember/src/client/index', + '@storybook/html$': '/app/html/src/client/index', + '@storybook/marko$': '/app/marko/src/client/index', + '@storybook/mithril$': '/app/mithril/src/client/index', + '@storybook/polymer$': '/app/polymer/src/client/index', + '@storybook/preact$': '/app/preact/src/client/index', + '@storybook/react$': '/app/react/src/client/index', + '@storybook/react-native$': '/app/react/-nativesrc/client/index', + '@storybook/react-native-server$': '/app/react-native-server/src/client/index', + '@storybook/riot$': '/app/riot/src/client/index', + '@storybook/svelte$': '/app/svelte/src/client/index', + '@storybook/vue$': '/app/vue/src/client/index', + '@storybook/addon-viewport$': '/addons/viewport/preview.mjs', + '@storybook/addon-centered/([a-z]*])$': '/addons/centered/$1.mjs', + '@storybook/addon-storyshots$': '/addons/storyshots/storyshots-core/src', + '@storybook/addon-storyshots-puppeteer$': + '/addons/storyshots/storyshots-puppeteer/src', + '@storybook/addon-([a-z]*)$': '/addons/$1/src', + 'core-js/es6/reflect': 'core-js/es/reflect', + 'core-js/es7/reflect': 'core-js/proposals/reflect-metadata', + // 'core-js/object': 'core-js/es', }, projects: [ '', @@ -26,6 +64,7 @@ module.exports = { ], transform: { '^.+\\.jsx?$': '/scripts/babel-jest.js', + '^.+\\.mjs$': '/scripts/babel-jest.js', '^.+\\.tsx?$': '/scripts/babel-jest.js', }, testMatch: ['**/__tests__/**/*.[jt]s?(x)', '**/?(*.)+(spec|test).[jt]s?(x)'], @@ -60,6 +99,6 @@ module.exports = { setupFiles: ['raf/polyfill'], testURL: 'http://localhost', modulePathIgnorePatterns: ['/dist/.*/__mocks__/'], - moduleFileExtensions: ['js', 'jsx', 'ts', 'tsx', 'json', 'node'], + moduleFileExtensions: ['js', 'mjs', 'jsx', 'ts', 'tsx', 'json', 'node'], watchPlugins: ['jest-watch-typeahead/filename', 'jest-watch-typeahead/testname'], }; diff --git a/lib/client-api/src/client_api.js b/lib/client-api/src/client_api.js index ac82b019af19..33a25aefb115 100644 --- a/lib/client-api/src/client_api.js +++ b/lib/client-api/src/client_api.js @@ -91,8 +91,8 @@ export default class ClientApi { Object.assign( {}, { - // hierarchyRootSeparator: '|', - // hierarchySeparator: /\/|\./, + hierarchyRootSeparator: '|', + hierarchySeparator: /\/|\./, }, this._globalParameters.options ); diff --git a/lib/core-events/package.json b/lib/core-events/package.json index c82261b54cf4..516c7f5026b5 100644 --- a/lib/core-events/package.json +++ b/lib/core-events/package.json @@ -17,6 +17,7 @@ "license": "MIT", "main": "dist/index.js", "types": "dist/index.d.ts", + "source": "src", "scripts": { "prepare": "node ../../scripts/prepare.js" }, diff --git a/lib/core/client.mjs b/lib/core/client.mjs new file mode 100644 index 000000000000..1ab60d5a8ea6 --- /dev/null +++ b/lib/core/client.mjs @@ -0,0 +1,5 @@ +import { ClientApi, StoryStore, ConfigApi } from '@storybook/client-api'; +import { toId } from '@storybook/router/utils'; +import start from './src/client/preview/start'; + +export { start, toId, ClientApi, ConfigApi, StoryStore }; From 0f57bdd07217819bc4994bfac676ddc72290e5f5 Mon Sep 17 00:00:00 2001 From: Norbert de Langen Date: Tue, 23 Apr 2019 23:27:51 +0200 Subject: [PATCH 15/22] FIX linting --- .../src/preview/__tests__/action.test.js | 2 +- addons/contexts/register.js | 2 +- addons/contexts/src/preview/api.ts | 2 +- addons/events/src/index.js | 4 ++-- addons/events/src/manager.js | 2 +- addons/info/src/components/types/ArrayOf.js | 1 - addons/info/src/components/types/ObjectOf.js | 1 - addons/info/src/components/types/OneOfType.js | 1 - .../src/components/types/PrettyPropType.js | 1 - addons/info/src/components/types/Shape.js | 1 - addons/knobs/src/index.js | 2 +- .../links/src/react/components/link.test.js | 2 +- addons/ondevice-backgrounds/src/register.js | 2 +- addons/ondevice-knobs/src/index.js | 2 +- addons/ondevice-notes/src/register.js | 2 +- addons/storysource/src/manager.js | 2 +- addons/storysource/src/preview.js | 2 +- .../src/client/preview/angular-polyfills.js | 4 ++-- .../src/client/manager/provider.js | 19 ++++++++++++------- .../stories/addon-events.stories.js | 6 +++--- .../stories/core/events.stories.js | 4 ++-- lib/client-api/src/config_api.js | 6 +++--- lib/client-api/src/story_store.js | 8 ++++---- lib/client-api/src/story_store.test.js | 6 +++--- .../src/ScrollArea/ScrollAreaStyles.tsx | 4 +++- lib/core/src/client/manager/provider.js | 4 ++-- lib/theming/package.json | 1 + lib/theming/src/index.ts | 10 ++++++++-- 28 files changed, 56 insertions(+), 47 deletions(-) diff --git a/addons/actions/src/preview/__tests__/action.test.js b/addons/actions/src/preview/__tests__/action.test.js index 1162015f4cb4..f1d724bc2f26 100644 --- a/addons/actions/src/preview/__tests__/action.test.js +++ b/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 '../..'; diff --git a/addons/contexts/register.js b/addons/contexts/register.js index 06b5a5887266..b0882b0081c5 100644 --- a/addons/contexts/register.js +++ b/addons/contexts/register.js @@ -1 +1 @@ -export * from './dist/register'; +import './dist/register'; diff --git a/addons/contexts/src/preview/api.ts b/addons/contexts/src/preview/api.ts index 85fa0b6c6241..51895770a312 100644 --- a/addons/contexts/src/preview/api.ts +++ b/addons/contexts/src/preview/api.ts @@ -1,4 +1,4 @@ -import addons from '@storybook/addons'; +import { addons } from '@storybook/addons'; import { FORCE_RE_RENDER, SET_CURRENT_STORY } from '@storybook/core-events'; import { REBOOT_MANAGER, UPDATE_PREVIEW, UPDATE_MANAGER } from '../constants'; import { getContextNodes, getPropsMap, getRendererFrom, singleton } from './libs'; diff --git a/addons/events/src/index.js b/addons/events/src/index.js index 0b19ad61c19e..03941e81f442 100644 --- a/addons/events/src/index.js +++ b/addons/events/src/index.js @@ -1,5 +1,5 @@ import { addons } from '@storybook/addons'; -import CoreEvents from '@storybook/core-events'; +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 }) => { diff --git a/addons/events/src/manager.js b/addons/events/src/manager.js index 6d8bea634686..70b0736787e9 100644 --- a/addons/events/src/manager.js +++ b/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'; diff --git a/addons/info/src/components/types/ArrayOf.js b/addons/info/src/components/types/ArrayOf.js index 28f1dffe8156..81834331cedb 100644 --- a/addons/info/src/components/types/ArrayOf.js +++ b/addons/info/src/components/types/ArrayOf.js @@ -1,4 +1,3 @@ -/* eslint-disable import/no-cycle */ import React from 'react'; import PrettyPropType from './PrettyPropType'; diff --git a/addons/info/src/components/types/ObjectOf.js b/addons/info/src/components/types/ObjectOf.js index 48a56d91026f..e27908d814a2 100644 --- a/addons/info/src/components/types/ObjectOf.js +++ b/addons/info/src/components/types/ObjectOf.js @@ -1,4 +1,3 @@ -/* eslint-disable import/no-cycle */ import React from 'react'; import PrettyPropType from './PrettyPropType'; diff --git a/addons/info/src/components/types/OneOfType.js b/addons/info/src/components/types/OneOfType.js index 2b269d0dad68..8b04c5fb4849 100644 --- a/addons/info/src/components/types/OneOfType.js +++ b/addons/info/src/components/types/OneOfType.js @@ -1,4 +1,3 @@ -/* eslint-disable import/no-cycle */ import React from 'react'; import PrettyPropType from './PrettyPropType'; diff --git a/addons/info/src/components/types/PrettyPropType.js b/addons/info/src/components/types/PrettyPropType.js index ff7ea413614b..63b17234b875 100644 --- a/addons/info/src/components/types/PrettyPropType.js +++ b/addons/info/src/components/types/PrettyPropType.js @@ -1,4 +1,3 @@ -/* eslint-disable import/no-cycle */ import PropTypes from 'prop-types'; import React from 'react'; diff --git a/addons/info/src/components/types/Shape.js b/addons/info/src/components/types/Shape.js index a9f1b6c5affc..2b8e1cc0d56f 100644 --- a/addons/info/src/components/types/Shape.js +++ b/addons/info/src/components/types/Shape.js @@ -1,4 +1,3 @@ -/* eslint-disable import/no-cycle */ import PropTypes from 'prop-types'; import React from 'react'; diff --git a/addons/knobs/src/index.js b/addons/knobs/src/index.js index 7035ead6c55f..e8b2c14c5e6c 100644 --- a/addons/knobs/src/index.js +++ b/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'; diff --git a/addons/links/src/react/components/link.test.js b/addons/links/src/react/components/link.test.js index 2488071651d3..4a8c2d7094cc 100644 --- a/addons/links/src/react/components/link.test.js +++ b/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'; diff --git a/addons/ondevice-backgrounds/src/register.js b/addons/ondevice-backgrounds/src/register.js index 0bd614430dae..5a70c48fc153 100644 --- a/addons/ondevice-backgrounds/src/register.js +++ b/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'; diff --git a/addons/ondevice-knobs/src/index.js b/addons/ondevice-knobs/src/index.js index 8286083ad1ed..2308a53fb18f 100644 --- a/addons/ondevice-knobs/src/index.js +++ b/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() { diff --git a/addons/ondevice-notes/src/register.js b/addons/ondevice-notes/src/register.js index 1ed3a38bfcdf..2fcc2980eec2 100644 --- a/addons/ondevice-notes/src/register.js +++ b/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`; diff --git a/addons/storysource/src/manager.js b/addons/storysource/src/manager.js index 0bbb8f171138..8f018c418d68 100644 --- a/addons/storysource/src/manager.js +++ b/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 '.'; diff --git a/addons/storysource/src/preview.js b/addons/storysource/src/preview.js index 93a15a9ed92e..67181fb53dad 100644 --- a/addons/storysource/src/preview.js +++ b/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]; diff --git a/app/angular/src/client/preview/angular-polyfills.js b/app/angular/src/client/preview/angular-polyfills.js index 50300a159df7..c417d81683dd 100644 --- a/app/angular/src/client/preview/angular-polyfills.js +++ b/app/angular/src/client/preview/angular-polyfills.js @@ -38,8 +38,8 @@ // import 'classlist.js'; // Run `npm install --save classlist.js`. /** Evergreen browsers require these. * */ -import 'core-js/es6/reflect'; -import 'core-js/es7/reflect'; +import 'core-js/es/reflect'; +import 'core-js/proposals/reflect-metadata'; /** * Required to support Web Animations `@angular/animation`. diff --git a/app/react-native-server/src/client/manager/provider.js b/app/react-native-server/src/client/manager/provider.js index 9852307ffbd2..65a6a99be154 100644 --- a/app/react-native-server/src/client/manager/provider.js +++ b/app/react-native-server/src/client/manager/provider.js @@ -3,7 +3,12 @@ import { Consumer } from '@storybook/api'; import { Provider } from '@storybook/ui'; import createChannel from '@storybook/channel-websocket'; import { addons } from '@storybook/addons'; -import Events from '@storybook/core-events'; +import { + CHANNEL_CREATED, + GET_CURRENT_STORY, + SET_CURRENT_STORY, + GET_STORIES, +} from '@storybook/core-events'; import uuid from 'uuid'; import PreviewHelp from './components/PreviewHelp'; @@ -29,7 +34,7 @@ export default class ReactProvider extends Provider { const channel = this.channel || createChannel({ url }); addons.setChannel(channel); - channel.emit(Events.CHANNEL_CREATED, { + channel.emit(CHANNEL_CREATED, { host, pairedId: this.pairedId, port, @@ -56,7 +61,7 @@ export default class ReactProvider extends Provider { if (!this.selection || this.selection.kind !== kind || this.selection.story !== story) { this.selection = { kind, story }; // TODO: isn't this event sent twice now? - api.emit(Events.SET_CURRENT_STORY, { kind, story }); + api.emit(SET_CURRENT_STORY, { kind, story }); } // FIXME: getPreview not implemented yet. @@ -78,11 +83,11 @@ export default class ReactProvider extends Provider { api.onStory((kind, story) => { this.selection = { kind, story }; - api.emit(Events.SET_CURRENT_STORY, this.selection); + api.emit(SET_CURRENT_STORY, this.selection); }); - api.on(Events.GET_CURRENT_STORY, () => { - api.emit(Events.SET_CURRENT_STORY, this.selection); + api.on(GET_CURRENT_STORY, () => { + api.emit(SET_CURRENT_STORY, this.selection); }); - api.emit(Events.GET_STORIES); + api.emit(GET_STORIES); } } diff --git a/examples/html-kitchen-sink/stories/addon-events.stories.js b/examples/html-kitchen-sink/stories/addon-events.stories.js index 00420cabca22..6ff3061b5b0b 100644 --- a/examples/html-kitchen-sink/stories/addon-events.stories.js +++ b/examples/html-kitchen-sink/stories/addon-events.stories.js @@ -1,7 +1,7 @@ import EventEmitter from 'eventemitter3'; import { storiesOf } from '@storybook/html'; import { addons } from '@storybook/addons'; -import CoreEvents from '@storybook/core-events'; +import { FORCE_RE_RENDER, REGISTER_SUBSCRIPTION } from '@storybook/core-events'; import json from 'format-json'; import withEvents from '@storybook/addon-events'; @@ -23,7 +23,7 @@ const eventHandlers = Object.values(TEST_EVENTS).map(name => ({ name, handler: payload => { events.push({ name, payload }); - addons.getChannel().emit(CoreEvents.FORCE_RE_RENDER); + addons.getChannel().emit(FORCE_RE_RENDER); }, })); @@ -86,7 +86,7 @@ storiesOf('Addons|Events', module) }) ) .addDecorator(storyFn => { - addons.getChannel().emit(CoreEvents.REGISTER_SUBSCRIPTION, subscription); + addons.getChannel().emit(REGISTER_SUBSCRIPTION, subscription); return storyFn(); }) .add( diff --git a/examples/official-storybook/stories/core/events.stories.js b/examples/official-storybook/stories/core/events.stories.js index ca322e138f85..ad66f0b82d3b 100644 --- a/examples/official-storybook/stories/core/events.stories.js +++ b/examples/official-storybook/stories/core/events.stories.js @@ -1,12 +1,12 @@ import React from 'react'; import { addons } from '@storybook/addons'; -import Events from '@storybook/core-events'; +import { FORCE_RE_RENDER } from '@storybook/core-events'; import { Button } from '@storybook/components'; let timesClicked = 0; const increment = () => { timesClicked += 1; - addons.getChannel().emit(Events.FORCE_RE_RENDER); + addons.getChannel().emit(FORCE_RE_RENDER); }; export default { diff --git a/lib/client-api/src/config_api.js b/lib/client-api/src/config_api.js index a59226a84a9b..c6b37e45ff2e 100644 --- a/lib/client-api/src/config_api.js +++ b/lib/client-api/src/config_api.js @@ -1,7 +1,7 @@ /* eslint no-underscore-dangle: 0 */ import { location } from 'global'; -import Events from '@storybook/core-events'; +import { STORY_INIT, STORIES_CONFIGURED } from '@storybook/core-events'; import { logger } from '@storybook/client-logger'; export default class ConfigApi { @@ -16,7 +16,7 @@ export default class ConfigApi { _renderMain() { // do initial render of story - this._storyStore.emit(Events.STORY_INIT); + this._storyStore.emit(STORY_INIT); } _renderError(e) { @@ -78,7 +78,7 @@ export default class ConfigApi { // 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); + setTimeout(() => this._channel.emit(STORIES_CONFIGURED), 0); } else { // in NodeJS loaders(); diff --git a/lib/client-api/src/story_store.js b/lib/client-api/src/story_store.js index cdc6a6d9c337..8b47e4e735da 100644 --- a/lib/client-api/src/story_store.js +++ b/lib/client-api/src/story_store.js @@ -6,7 +6,7 @@ import memoize from 'memoizerific'; import debounce from 'lodash.debounce'; import { stripIndents } from 'common-tags'; -import Events from '@storybook/core-events'; +import { SET_STORIES, STORY_INIT, STORY_RENDER } from '@storybook/core-events'; import { logger } from '@storybook/client-logger'; import { toId } from '@storybook/router/utils'; @@ -63,7 +63,7 @@ export default class StoryStore extends EventEmitter { this._selection = {}; this._channel = params.channel; - this.on(Events.STORY_INIT, () => { + this.on(STORY_INIT, () => { let storyId = this.getIdOnPath(); if (!storyId) { const query = getQueryParams(); @@ -129,7 +129,7 @@ export default class StoryStore extends EventEmitter { setSelection = data => { this._selection = data; - setTimeout(() => this.emit(Events.STORY_RENDER), 1); + setTimeout(() => this.emit(STORY_RENDER), 1); }; getSelection = () => this._selection; @@ -191,7 +191,7 @@ export default class StoryStore extends EventEmitter { const stories = this.extract(); // send to the parent frame. - this._channel.emit(Events.SET_STORIES, { stories }); + this._channel.emit(SET_STORIES, { stories }); } }, 0); diff --git a/lib/client-api/src/story_store.test.js b/lib/client-api/src/story_store.test.js index b68499539f24..41fca31f04fd 100644 --- a/lib/client-api/src/story_store.test.js +++ b/lib/client-api/src/story_store.test.js @@ -1,6 +1,6 @@ import { history, document } from 'global'; import createChannel from '@storybook/channel-postmessage'; -import Events from '@storybook/core-events'; +import { STORY_INIT } from '@storybook/core-events'; import { toId } from '@storybook/router/utils'; import StoryStore from './story_store'; @@ -170,7 +170,7 @@ describe('preview.story_store', () => { store.addStory(...make('kind', 'story', storyFn)); store.setSelection = jest.fn(); - store.emit(Events.STORY_INIT); + store.emit(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(storyFn); @@ -185,7 +185,7 @@ describe('preview.story_store', () => { store.addStory(...make('kind', 'story', storyFn)); store.setSelection = jest.fn(); - store.emit(Events.STORY_INIT); + store.emit(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(storyFn); diff --git a/lib/components/src/ScrollArea/ScrollAreaStyles.tsx b/lib/components/src/ScrollArea/ScrollAreaStyles.tsx index 33ea5986a4af..b76846942f7d 100644 --- a/lib/components/src/ScrollArea/ScrollAreaStyles.tsx +++ b/lib/components/src/ScrollArea/ScrollAreaStyles.tsx @@ -1,4 +1,6 @@ -import { Theme, Interpolation } from '@storybook/theming'; +import { Theme } from '@storybook/theming'; +// tslint:disable-next-line: no-implicit-dependencies +import { Interpolation } from '@emotion/core'; export const getScrollAreaStyles: (theme: Theme) => Interpolation = (theme: Theme) => ({ '[data-simplebar]': { diff --git a/lib/core/src/client/manager/provider.js b/lib/core/src/client/manager/provider.js index d721fae04a07..a7999cc7e3cb 100644 --- a/lib/core/src/client/manager/provider.js +++ b/lib/core/src/client/manager/provider.js @@ -1,7 +1,7 @@ import { Provider } from '@storybook/ui'; import { addons } from '@storybook/addons'; import createChannel from '@storybook/channel-postmessage'; -import Events from '@storybook/core-events'; +import { CHANNEL_CREATED } from '@storybook/core-events'; export default class ReactProvider extends Provider { constructor() { @@ -10,7 +10,7 @@ export default class ReactProvider extends Provider { const channel = createChannel({ page: 'manager' }); addons.setChannel(channel); - channel.emit(Events.CHANNEL_CREATED); + channel.emit(CHANNEL_CREATED); this.addons = addons; this.channel = channel; diff --git a/lib/theming/package.json b/lib/theming/package.json index 0eed067c5809..f8aa9cdb5614 100644 --- a/lib/theming/package.json +++ b/lib/theming/package.json @@ -16,6 +16,7 @@ }, "license": "MIT", "main": "dist/index.js", + "source": "src", "types": "dist/index.d.ts", "scripts": { "prepare": "node ../../scripts/prepare.js" diff --git a/lib/theming/src/index.ts b/lib/theming/src/index.ts index 3cef9705ff47..391800a681cf 100644 --- a/lib/theming/src/index.ts +++ b/lib/theming/src/index.ts @@ -15,9 +15,15 @@ const themes = { export { themes }; -export * from '@emotion/core'; -export * from 'emotion-theming'; +import { Global, keyframes, css, ClassNames } from '@emotion/core'; +// export * from '@emotion/core'; +export { Global, keyframes, css, ClassNames }; + +import { ThemeProvider, withTheme } from 'emotion-theming'; +// export * from 'emotion-theming'; +export { withTheme, ThemeProvider }; export { createGlobal, createReset } from './global'; + export * from './create'; export * from './ensure'; From 3c88aa760d9a74ad795a66c6afa5bec71bac255d Mon Sep 17 00:00:00 2001 From: Norbert de Langen Date: Wed, 24 Apr 2019 11:33:16 +0200 Subject: [PATCH 16/22] WIP --- addons/graphql/package.json | 1 - examples/official-storybook/webpack.config.js | 20 +++++++++---------- jest.config.js | 2 +- lib/core/{client.mjs => client.ts} | 0 .../server/manager/manager-webpack.config.js | 12 ++++++++--- 5 files changed, 20 insertions(+), 15 deletions(-) rename lib/core/{client.mjs => client.ts} (100%) diff --git a/addons/graphql/package.json b/addons/graphql/package.json index 50255f85e077..0d963817aa78 100644 --- a/addons/graphql/package.json +++ b/addons/graphql/package.json @@ -17,7 +17,6 @@ }, "license": "MIT", "main": "dist/index.js", - "jsnext:main": "src/index.js", "scripts": { "prepare": "node ../../scripts/prepare.js" }, diff --git a/examples/official-storybook/webpack.config.js b/examples/official-storybook/webpack.config.js index f07279e99c46..082738bceeda 100644 --- a/examples/official-storybook/webpack.config.js +++ b/examples/official-storybook/webpack.config.js @@ -1,4 +1,4 @@ -const { DefinePlugin, ContextReplacementPlugin } = require('webpack'); +// const { DefinePlugin, ContextReplacementPlugin } = require('webpack'); module.exports = async ({ config }) => ({ ...config, @@ -19,16 +19,16 @@ module.exports = async ({ config }) => ({ }, ], }, - plugins: [ - ...config.plugins, - // graphql sources check process variable - new DefinePlugin({ - process: JSON.stringify(true), - }), + // 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$/), - ], + // // 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'], diff --git a/jest.config.js b/jest.config.js index 5090f8759535..6cb43afcf1df 100644 --- a/jest.config.js +++ b/jest.config.js @@ -7,7 +7,7 @@ module.exports = { '\\.(css|scss)$': '/__mocks__/styleMock.js', '\\.(md)$': '/__mocks__/htmlMock.js', '@storybook/addons$': '/lib/addons/src', - '@storybook/core/client$': '/lib/core/client.mjs', + '@storybook/core/client$': '/lib/core/client.ts', '@storybook/core$': '/lib/core/src', '@storybook/ui$': '/lib/ui/src', '@storybook/components$': '/lib/components/src', diff --git a/lib/core/client.mjs b/lib/core/client.ts similarity index 100% rename from lib/core/client.mjs rename to lib/core/client.ts diff --git a/lib/core/src/server/manager/manager-webpack.config.js b/lib/core/src/server/manager/manager-webpack.config.js index 78c0782789c8..c2c26902fcab 100644 --- a/lib/core/src/server/manager/manager-webpack.config.js +++ b/lib/core/src/server/manager/manager-webpack.config.js @@ -1,5 +1,5 @@ import path from 'path'; -import webpack from 'webpack'; +import { ContextReplacementPlugin, DllReferencePlugin, DefinePlugin } from 'webpack'; import Dotenv from 'dotenv-webpack'; import HtmlWebpackPlugin from 'html-webpack-plugin'; import CaseSensitivePathsPlugin from 'case-sensitive-paths-webpack-plugin'; @@ -35,7 +35,7 @@ export default ({ configDir, configType, entries, dll, outputDir, cache, babelOp cache, plugins: [ dll - ? new webpack.DllReferencePlugin({ + ? new DllReferencePlugin({ context, manifest: path.join(__dirname, '../../../dll/storybook_ui-manifest.json'), }) @@ -55,13 +55,19 @@ export default ({ configDir, configType, entries, dll, outputDir, cache, babelOp }), template: require.resolve(`../templates/index.ejs`), }), - new webpack.DefinePlugin({ 'process.env': stringified }), + new DefinePlugin({ 'process.env': stringified, process: JSON.stringify(true) }), new CaseSensitivePathsPlugin(), new Dotenv({ silent: true }), + new ContextReplacementPlugin(/graphql-language-service-interface[/\\]dist/, /\.js$/), ].filter(Boolean), module: { rules: [ babelLoader(babelOptions), + { + test: /\.mjs$/, + include: /node_modules/, + type: 'javascript/auto', + }, { test: /\.css$/, use: [ From 07bf0f413f38657889f773c23af21cebb7dcd31d Mon Sep 17 00:00:00 2001 From: Norbert de Langen Date: Wed, 24 Apr 2019 11:47:18 +0200 Subject: [PATCH 17/22] FIXED runtime --- yarn.lock | 96 +------------------------------------------------------ 1 file changed, 1 insertion(+), 95 deletions(-) diff --git a/yarn.lock b/yarn.lock index bd5193845721..d2bcf810bc6e 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2612,95 +2612,6 @@ resolved "https://registry.yarnpkg.com/@sindresorhus/is/-/is-0.7.0.tgz#9a06f4f137ee84d7df0460c1fdb1135ffa6c50fd" integrity sha512-ONhaKPIufzzrlNbqtWFFd+jlnemX6lJAgq9ZeiZtS7I1PIf/la7CW4m83rTXRnVnsMbW2k56pGYu7AUFJD9Pow== -"@storybook/addons@5.1.0-alpha.28": - version "5.1.0-alpha.28" - resolved "https://registry.yarnpkg.com/@storybook/addons/-/addons-5.1.0-alpha.28.tgz#03cbc01fafe90b7b7e15a377e2ccd3572b7ae67b" - integrity sha512-oUNIRd3A7SX/r6C3+lIqZBitDgCGlqezHbblsRoGDOTnwVmMahCr7hwQ+wfLsEm1SOOwwACr1JG8n/kzic2sSw== - dependencies: - "@storybook/api" "5.1.0-alpha.28" - "@storybook/channels" "5.1.0-alpha.28" - "@storybook/client-logger" "5.1.0-alpha.28" - core-js "^2.6.5" - global "^4.3.2" - util-deprecate "^1.0.2" - -"@storybook/api@5.1.0-alpha.28": - version "5.1.0-alpha.28" - resolved "https://registry.yarnpkg.com/@storybook/api/-/api-5.1.0-alpha.28.tgz#a020826069be70013b072c6e954aa0402f4e8ca7" - integrity sha512-wI6s7leJk8EwOHiwzZUDwu+MoLfL3yCryvlbQNTu3YudrkFaKytKLRRRc6pAqmoBvjPS9MhT4kmSbt5/fNoVUA== - dependencies: - "@storybook/channels" "5.1.0-alpha.28" - "@storybook/client-logger" "5.1.0-alpha.28" - "@storybook/core-events" "5.1.0-alpha.28" - "@storybook/router" "5.1.0-alpha.28" - "@storybook/theming" "5.1.0-alpha.28" - core-js "^2.6.5" - fast-deep-equal "^2.0.1" - global "^4.3.2" - lodash.isequal "^4.5.0" - lodash.mergewith "^4.6.1" - lodash.pick "^4.4.0" - memoizerific "^1.11.3" - prop-types "^15.6.2" - react "^16.7.0" - semver "^5.6.0" - store2 "^2.7.1" - telejson "^2.1.1" - util-deprecate "^1.0.2" - -"@storybook/channels@5.1.0-alpha.28": - version "5.1.0-alpha.28" - resolved "https://registry.yarnpkg.com/@storybook/channels/-/channels-5.1.0-alpha.28.tgz#712ba41efbd118cfa7d31847434b1491d58fb4c4" - integrity sha512-lt56WzPydouXmmSU0+F7bVvQNXDJ9/DmNf3rLv8kwzX2eqNihwS59lc16/VVu+/g1CQfNmp9c2OWZihVbGpNYg== - dependencies: - core-js "^2.6.5" - -"@storybook/client-logger@5.1.0-alpha.28": - version "5.1.0-alpha.28" - resolved "https://registry.yarnpkg.com/@storybook/client-logger/-/client-logger-5.1.0-alpha.28.tgz#380400ee9fc8e45e94433a5f5a192141e3b70afa" - integrity sha512-K/LNF7mIwQGKXKrPn09JHXO5iTcAhUfS/nZDNtWAuU9fdU5sSndqMM3LrSOQmPPL2MnaYRzDdIMUtI6ok4udTg== - dependencies: - core-js "^2.6.5" - -"@storybook/core-events@5.1.0-alpha.28": - version "5.1.0-alpha.28" - resolved "https://registry.yarnpkg.com/@storybook/core-events/-/core-events-5.1.0-alpha.28.tgz#7e267b239a0f68e4b07e693c391dc40d7d65998c" - integrity sha512-nRHMrHixNAfIf4NBaL2ZzCIxqoSuW2LJC6Q35xWD7bd2on7VnTkvn9YfEFBIY24HampAJCcf31eLLa5Nnr6OQQ== - dependencies: - core-js "^2.6.5" - -"@storybook/router@5.1.0-alpha.28": - version "5.1.0-alpha.28" - resolved "https://registry.yarnpkg.com/@storybook/router/-/router-5.1.0-alpha.28.tgz#d40ab25ff3274f86fd85569651eb5067788df3d6" - integrity sha512-esCxKgX4Wls8N4AypLLc3u8j39dkxIiynzzE+DoECOpZl5NvIB/BX2LRpBAB2nub2ocoKbF0bBU4zKNIB+002Q== - dependencies: - "@reach/router" "^1.2.1" - "@storybook/theming" "5.1.0-alpha.28" - core-js "^2.6.5" - global "^4.3.2" - memoizerific "^1.11.3" - qs "^6.6.0" - -"@storybook/theming@5.1.0-alpha.28": - version "5.1.0-alpha.28" - resolved "https://registry.yarnpkg.com/@storybook/theming/-/theming-5.1.0-alpha.28.tgz#f9c1214f680c011db76f76197bd45ce6163a5420" - integrity sha512-N6A5+zLfmeYVGMrMmEBe8q5cuwj0QRWM3LwXuaQ4Dep+gYAm1qZsjagLEu1PTxYjaIKuHD9udnkGn4wFHBqvIA== - dependencies: - "@emotion/core" "^10.0.9" - "@emotion/styled" "^10.0.7" - "@storybook/client-logger" "5.1.0-alpha.28" - common-tags "^1.8.0" - core-js "^2.6.5" - deep-object-diff "^1.1.0" - emotion-theming "^10.0.9" - global "^4.3.2" - lodash.isequal "^4.5.0" - lodash.mergewith "^4.6.1" - memoizerific "^1.11.3" - polished "^3.0.0" - prop-types "^15.7.2" - react-inspector "^2.3.1" - "@svgr/babel-plugin-add-jsx-attribute@^4.2.0": version "4.2.0" resolved "https://registry.yarnpkg.com/@svgr/babel-plugin-add-jsx-attribute/-/babel-plugin-add-jsx-attribute-4.2.0.tgz#dadcb6218503532d6884b210e7f3c502caaa44b1" @@ -8088,7 +7999,7 @@ core-js@2.6.4: resolved "https://registry.yarnpkg.com/core-js/-/core-js-2.6.4.tgz#b8897c062c4d769dd30a0ac5c73976c47f92ea0d" integrity sha512-05qQ5hXShcqGkPZpXEFLIpxayZscVD2kuMBZewxiIPPEagukO4mqgPA9CWhUvFBJfy3ODdK2p9xyHh7FTU9/7A== -core-js@3.0.1, core-js@^3.0.0: +core-js@3.0.1, core-js@^3.0.0, core-js@^3.0.1: version "3.0.1" resolved "https://registry.yarnpkg.com/core-js/-/core-js-3.0.1.tgz#1343182634298f7f38622f95e73f54e48ddf4738" integrity sha512-sco40rF+2KlE0ROMvydjkrVMMG1vYilP2ALoRXcYR4obqbYIuV3Bg+51GEDW+HF8n7NRA+iaA4qD0nD9lo9mew== @@ -8103,11 +8014,6 @@ 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, 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@^3.0.1: - version "3.0.1" - resolved "https://registry.yarnpkg.com/core-js/-/core-js-3.0.1.tgz#1343182634298f7f38622f95e73f54e48ddf4738" - integrity sha512-sco40rF+2KlE0ROMvydjkrVMMG1vYilP2ALoRXcYR4obqbYIuV3Bg+51GEDW+HF8n7NRA+iaA4qD0nD9lo9mew== - core-object@^3.1.5: version "3.1.5" resolved "https://registry.yarnpkg.com/core-object/-/core-object-3.1.5.tgz#fa627b87502adc98045e44678e9a8ec3b9c0d2a9" From c4f42e3d3e73e9b6620017afcde326c68d0b1579 Mon Sep 17 00:00:00 2001 From: Norbert de Langen Date: Sat, 27 Apr 2019 02:39:43 +0200 Subject: [PATCH 18/22] FIX build & runtime linting is broken, type exports are still imported, which causes errors, type imports aren't found --- addons/contexts/src/preview/api.ts | 14 ++- examples/official-storybook/webpack.config.js | 2 +- lib/addons/src/main.ts | 19 ++-- yarn.lock | 92 ------------------- 4 files changed, 23 insertions(+), 104 deletions(-) diff --git a/addons/contexts/src/preview/api.ts b/addons/contexts/src/preview/api.ts index 51895770a312..af5d54b9acb4 100644 --- a/addons/contexts/src/preview/api.ts +++ b/addons/contexts/src/preview/api.ts @@ -1,8 +1,8 @@ import { addons } from '@storybook/addons'; import { FORCE_RE_RENDER, SET_CURRENT_STORY } from '@storybook/core-events'; -import { REBOOT_MANAGER, UPDATE_PREVIEW, UPDATE_MANAGER } from '../constants'; +import { REBOOT_MANAGER, UPDATE_PREVIEW, UPDATE_MANAGER } from '../shared/constants'; import { getContextNodes, getPropsMap, getRendererFrom, singleton } from './libs'; -import { ContextNode, PropsMap } from '../types'; +import { ContextNode, PropsMap } from '../shared/types.d'; /** * @Public @@ -14,9 +14,13 @@ export const addonContextsAPI = singleton(() => { let selectionState = {}; // from manager - channel.on(SET_CURRENT_STORY, () => (memorizedNodes = null)); + 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, state => { + selectionState = Object.freeze(state); + }); channel.on(UPDATE_PREVIEW, () => channel.emit(FORCE_RE_RENDER)); // to manager @@ -34,7 +38,7 @@ export const addonContextsAPI = singleton(() => { * 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. */ - let reactivePropsMap = {}; + const reactivePropsMap = {}; const updateReactiveSystem = (propsMap: PropsMap) => /* tslint:disable:prefer-object-spread */ Object.assign(reactivePropsMap, propsMap); diff --git a/examples/official-storybook/webpack.config.js b/examples/official-storybook/webpack.config.js index 8e80bc49a18a..3e0033da7bfa 100644 --- a/examples/official-storybook/webpack.config.js +++ b/examples/official-storybook/webpack.config.js @@ -12,7 +12,7 @@ module.exports = async ({ config }) => ({ options: { cacheDirectory: `.cache/storybook`, presets: [ - ['@babel/preset-env', { shippedProposals: true, useBuiltIns: 'usage', corejs: 2 }], + ['@babel/preset-env', { shippedProposals: true, useBuiltIns: 'usage', corejs: 3 }], '@babel/preset-typescript', ['babel-preset-minify', { builtIns: false, mangle: false }], '@babel/preset-react', diff --git a/lib/addons/src/main.ts b/lib/addons/src/main.ts index 650fb0448b61..53330518d8b9 100644 --- a/lib/addons/src/main.ts +++ b/lib/addons/src/main.ts @@ -5,7 +5,9 @@ import { Channel } from '@storybook/channels'; import { API } from '@storybook/api'; import { logger } from '@storybook/client-logger'; -import { types, Types, isSupportedType } from './types'; +import * as t from './types'; + +export * from './types'; export interface RenderOptions { active: boolean; @@ -20,7 +22,7 @@ export interface MatchOptions { export interface Addon { title: string; - type?: Types; + type?: t.Types; id?: string; route?: (routeOptions: RouteOptions) => string; match?: (matchOptions: MatchOptions) => boolean; @@ -29,8 +31,6 @@ export interface Addon { export type Loader = (api: API) => void; -export { types, Types, isSupportedType }; - interface Loaders { [key: string]: Loader; } @@ -65,7 +65,7 @@ export class AddonStore { this.channel = channel; }; - getElements = (type: Types): Collection => { + getElements = (type: t.Types): Collection => { if (!this.elements[type]) { this.elements[type] = {}; } @@ -74,7 +74,7 @@ export class AddonStore { addPanel = (name: string, options: Addon): void => { this.add(name, { - type: types.PANEL, + type: t.types.PANEL, ...options, }); }; @@ -106,3 +106,10 @@ function getAddonsStore(): AddonStore { } return global[KEY]; } + +// Exporting this twice in order to to be able to import it like { addons } instead of 'addons' +// prefer import { addons } from '@storybook/addons' over import addons from '@storybook/addons' +// +// See public_api.ts + +export const addons = getAddonsStore(); diff --git a/yarn.lock b/yarn.lock index e646bc92a613..22ed7310d045 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2871,98 +2871,6 @@ resolved "https://registry.npmjs.org/@sindresorhus/is/-/is-0.7.0.tgz#9a06f4f137ee84d7df0460c1fdb1135ffa6c50fd" integrity sha512-ONhaKPIufzzrlNbqtWFFd+jlnemX6lJAgq9ZeiZtS7I1PIf/la7CW4m83rTXRnVnsMbW2k56pGYu7AUFJD9Pow== -<<<<<<< HEAD -======= -"@storybook/addons@5.1.0-alpha.28": - version "5.1.0-alpha.28" - resolved "https://registry.npmjs.org/@storybook/addons/-/addons-5.1.0-alpha.28.tgz#03cbc01fafe90b7b7e15a377e2ccd3572b7ae67b" - integrity sha512-oUNIRd3A7SX/r6C3+lIqZBitDgCGlqezHbblsRoGDOTnwVmMahCr7hwQ+wfLsEm1SOOwwACr1JG8n/kzic2sSw== - dependencies: - "@storybook/api" "5.1.0-alpha.28" - "@storybook/channels" "5.1.0-alpha.28" - "@storybook/client-logger" "5.1.0-alpha.28" - core-js "^2.6.5" - global "^4.3.2" - util-deprecate "^1.0.2" - -"@storybook/api@5.1.0-alpha.28": - version "5.1.0-alpha.28" - resolved "https://registry.npmjs.org/@storybook/api/-/api-5.1.0-alpha.28.tgz#a020826069be70013b072c6e954aa0402f4e8ca7" - integrity sha512-wI6s7leJk8EwOHiwzZUDwu+MoLfL3yCryvlbQNTu3YudrkFaKytKLRRRc6pAqmoBvjPS9MhT4kmSbt5/fNoVUA== - dependencies: - "@storybook/channels" "5.1.0-alpha.28" - "@storybook/client-logger" "5.1.0-alpha.28" - "@storybook/core-events" "5.1.0-alpha.28" - "@storybook/router" "5.1.0-alpha.28" - "@storybook/theming" "5.1.0-alpha.28" - core-js "^2.6.5" - fast-deep-equal "^2.0.1" - global "^4.3.2" - lodash.isequal "^4.5.0" - lodash.mergewith "^4.6.1" - lodash.pick "^4.4.0" - memoizerific "^1.11.3" - prop-types "^15.6.2" - react "^16.7.0" - semver "^5.6.0" - store2 "^2.7.1" - telejson "^2.1.1" - util-deprecate "^1.0.2" - -"@storybook/channels@5.1.0-alpha.28": - version "5.1.0-alpha.28" - resolved "https://registry.npmjs.org/@storybook/channels/-/channels-5.1.0-alpha.28.tgz#712ba41efbd118cfa7d31847434b1491d58fb4c4" - integrity sha512-lt56WzPydouXmmSU0+F7bVvQNXDJ9/DmNf3rLv8kwzX2eqNihwS59lc16/VVu+/g1CQfNmp9c2OWZihVbGpNYg== - dependencies: - core-js "^2.6.5" - -"@storybook/client-logger@5.1.0-alpha.28": - version "5.1.0-alpha.28" - resolved "https://registry.npmjs.org/@storybook/client-logger/-/client-logger-5.1.0-alpha.28.tgz#380400ee9fc8e45e94433a5f5a192141e3b70afa" - integrity sha512-K/LNF7mIwQGKXKrPn09JHXO5iTcAhUfS/nZDNtWAuU9fdU5sSndqMM3LrSOQmPPL2MnaYRzDdIMUtI6ok4udTg== - dependencies: - core-js "^2.6.5" - -"@storybook/core-events@5.1.0-alpha.28": - version "5.1.0-alpha.28" - resolved "https://registry.npmjs.org/@storybook/core-events/-/core-events-5.1.0-alpha.28.tgz#7e267b239a0f68e4b07e693c391dc40d7d65998c" - integrity sha512-nRHMrHixNAfIf4NBaL2ZzCIxqoSuW2LJC6Q35xWD7bd2on7VnTkvn9YfEFBIY24HampAJCcf31eLLa5Nnr6OQQ== - dependencies: - core-js "^2.6.5" - -"@storybook/router@5.1.0-alpha.28": - version "5.1.0-alpha.28" - resolved "https://registry.npmjs.org/@storybook/router/-/router-5.1.0-alpha.28.tgz#d40ab25ff3274f86fd85569651eb5067788df3d6" - integrity sha512-esCxKgX4Wls8N4AypLLc3u8j39dkxIiynzzE+DoECOpZl5NvIB/BX2LRpBAB2nub2ocoKbF0bBU4zKNIB+002Q== - dependencies: - "@reach/router" "^1.2.1" - "@storybook/theming" "5.1.0-alpha.28" - core-js "^2.6.5" - global "^4.3.2" - memoizerific "^1.11.3" - qs "^6.6.0" - -"@storybook/theming@5.1.0-alpha.28": - version "5.1.0-alpha.28" - resolved "https://registry.npmjs.org/@storybook/theming/-/theming-5.1.0-alpha.28.tgz#f9c1214f680c011db76f76197bd45ce6163a5420" - integrity sha512-N6A5+zLfmeYVGMrMmEBe8q5cuwj0QRWM3LwXuaQ4Dep+gYAm1qZsjagLEu1PTxYjaIKuHD9udnkGn4wFHBqvIA== - dependencies: - "@emotion/core" "^10.0.9" - "@emotion/styled" "^10.0.7" - "@storybook/client-logger" "5.1.0-alpha.28" - common-tags "^1.8.0" - core-js "^2.6.5" - deep-object-diff "^1.1.0" - emotion-theming "^10.0.9" - global "^4.3.2" - lodash.isequal "^4.5.0" - lodash.mergewith "^4.6.1" - memoizerific "^1.11.3" - polished "^3.0.0" - prop-types "^15.7.2" - react-inspector "^2.3.1" - ->>>>>>> next "@svgr/babel-plugin-add-jsx-attribute@^4.2.0": version "4.2.0" resolved "https://registry.npmjs.org/@svgr/babel-plugin-add-jsx-attribute/-/babel-plugin-add-jsx-attribute-4.2.0.tgz#dadcb6218503532d6884b210e7f3c502caaa44b1" From 2f148bdbd43bfd614a98aaea086dd319a314e4e2 Mon Sep 17 00:00:00 2001 From: Norbert de Langen Date: Sat, 27 Apr 2019 02:44:28 +0200 Subject: [PATCH 19/22] FIX some linting --- .../contexts/src/manager/libs/useChannel.ts | 3 +- lib/addons/src/index.ts | 8 ++-- lib/core-events/src/index.ts | 38 +++++++++---------- lib/theming/src/index.ts | 6 +-- 4 files changed, 27 insertions(+), 28 deletions(-) diff --git a/addons/contexts/src/manager/libs/useChannel.ts b/addons/contexts/src/manager/libs/useChannel.ts index 7780996b28c2..f5a730d95514 100644 --- a/addons/contexts/src/manager/libs/useChannel.ts +++ b/addons/contexts/src/manager/libs/useChannel.ts @@ -1,9 +1,10 @@ import { useEffect } from 'react'; -export { Channel } from '@storybook/channels'; import { addons } from '@storybook/addons'; import { AnyFunctionReturns } from '../../shared/types.d'; +export { Channel } from '@storybook/channels'; + /** * The React hook version of Storybook Channel API. */ diff --git a/lib/addons/src/index.ts b/lib/addons/src/index.ts index 2f3de99d57c9..12a09ab4970b 100644 --- a/lib/addons/src/index.ts +++ b/lib/addons/src/index.ts @@ -1,11 +1,11 @@ -export * from './make-decorator'; -export * from './main'; -export * from './storybook-channel-mock'; - // There can only be 1 default export per entry point and it has to be directly from public_api // Exporting this twice in order to to be able to import it like { addons } instead of 'addons' // prefer import { addons } from '@storybook/addons' over import addons from '@storybook/addons' // // See index.ts import { addons } from './main'; + +export * from './make-decorator'; +export * from './main'; +export * from './storybook-channel-mock'; export default addons; diff --git a/lib/core-events/src/index.ts b/lib/core-events/src/index.ts index e295b805f866..3fc14f728bfd 100644 --- a/lib/core-events/src/index.ts +++ b/lib/core-events/src/index.ts @@ -25,22 +25,22 @@ export default events; // Enables: `import * as Events from ...` or `import { CHANNEL_CREATED } as Events from ...` // This is the preferred method -export const CHANNEL_CREATED = events.CHANNEL_CREATED; -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; -export const REGISTER_SUBSCRIPTION = events.REGISTER_SUBSCRIPTION; -export const STORY_INIT = events.STORY_INIT; -export const STORY_ADDED = events.STORY_ADDED; -export const STORY_RENDER = events.STORY_RENDER; -export const STORY_RENDERED = events.STORY_RENDERED; -export const STORY_MISSING = events.STORY_MISSING; -export const STORY_ERRORED = events.STORY_ERRORED; -export const STORY_CHANGED = events.STORY_CHANGED; -export const STORY_UNCHANGED = events.STORY_UNCHANGED; -export const STORY_THREW_EXCEPTION = events.STORY_THREW_EXCEPTION; +export const { CHANNEL_CREATED } = events; +export const { GET_CURRENT_STORY } = events; +export const { SET_CURRENT_STORY } = events; +export const { GET_STORIES } = events; +export const { SET_STORIES } = events; +export const { STORIES_CONFIGURED } = events; +export const { SELECT_STORY } = events; +export const { PREVIEW_KEYDOWN } = events; +export const { FORCE_RE_RENDER } = events; +export const { REGISTER_SUBSCRIPTION } = events; +export const { STORY_INIT } = events; +export const { STORY_ADDED } = events; +export const { STORY_RENDER } = events; +export const { STORY_RENDERED } = events; +export const { STORY_MISSING } = events; +export const { STORY_ERRORED } = events; +export const { STORY_CHANGED } = events; +export const { STORY_UNCHANGED } = events; +export const { STORY_THREW_EXCEPTION } = events; diff --git a/lib/theming/src/index.ts b/lib/theming/src/index.ts index 391800a681cf..a2e17f55cfbb 100644 --- a/lib/theming/src/index.ts +++ b/lib/theming/src/index.ts @@ -1,4 +1,6 @@ import emotionStyled, { CreateStyled } from '@emotion/styled'; +import { Global, keyframes, css, ClassNames } from '@emotion/core'; +import { ThemeProvider, withTheme } from 'emotion-theming'; import dark from './themes/dark'; import light from './themes/light'; import { Theme } from './base'; @@ -14,12 +16,8 @@ const themes = { }; export { themes }; - -import { Global, keyframes, css, ClassNames } from '@emotion/core'; // export * from '@emotion/core'; export { Global, keyframes, css, ClassNames }; - -import { ThemeProvider, withTheme } from 'emotion-theming'; // export * from 'emotion-theming'; export { withTheme, ThemeProvider }; From 3eac27ca13b9c0894b74f804e2580d9c1d005ad0 Mon Sep 17 00:00:00 2001 From: Norbert de Langen Date: Sat, 27 Apr 2019 02:53:24 +0200 Subject: [PATCH 20/22] UPGRADE codejs3 for angular-cli example --- examples/angular-cli/src/polyfills.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/examples/angular-cli/src/polyfills.ts b/examples/angular-cli/src/polyfills.ts index 98615adcce81..f73afc37ee5d 100644 --- a/examples/angular-cli/src/polyfills.ts +++ b/examples/angular-cli/src/polyfills.ts @@ -38,8 +38,8 @@ // import 'classlist.js'; // Run `npm install --save classlist.js`. /* Evergreen browsers require these. */ -import 'core-js/es6/reflect'; -import 'core-js/es7/reflect'; +import 'core-js/es/reflect'; +import 'core-js/proposals/reflect-metadata'; /** * Required to support Web Animations `@angular/animation`. From f7b07f2994b534d2e99551dc67b2e111cf935c31 Mon Sep 17 00:00:00 2001 From: Norbert de Langen Date: Tue, 7 May 2019 01:40:40 +0200 Subject: [PATCH 21/22] FIX linting --- lib/api/src/index.tsx | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/lib/api/src/index.tsx b/lib/api/src/index.tsx index aa02b3f272a0..3b70d37fbadd 100644 --- a/lib/api/src/index.tsx +++ b/lib/api/src/index.tsx @@ -4,7 +4,7 @@ import memoize from 'memoizerific'; // @ts-ignore shallow-equal is not in DefinitelyTyped import shallowEqualObjects from 'shallow-equal/objects'; -import Events from '@storybook/core-events'; +import { STORY_CHANGED, SET_STORIES, SELECT_STORY } from '@storybook/core-events'; import { RenderData as RouterData } from '@storybook/router'; import initProviderApi, { SubAPI as ProviderAPI, Provider } from './init-provider-api'; @@ -36,8 +36,6 @@ import initVersions, { const ManagerContext = createContext({ api: undefined, state: getInitialState({}) }); -const { STORY_CHANGED, SET_STORIES, SELECT_STORY } = Events; - export type Module = StoreData & RouterData & ProviderData & { mode?: 'production' | 'development' }; From 9f28b8ec37bce21420f4c22490c49284272cca15 Mon Sep 17 00:00:00 2001 From: Norbert de Langen Date: Mon, 20 May 2019 23:28:16 +0200 Subject: [PATCH 22/22] FIX linting issues with types not being re-exported --- .eslintrc.js | 7 ++++++- lib/components/src/ScrollArea/ScrollAreaStyles.tsx | 4 +--- 2 files changed, 7 insertions(+), 4 deletions(-) diff --git a/.eslintrc.js b/.eslintrc.js index 097898b87eb5..1ddd886819f5 100644 --- a/.eslintrc.js +++ b/.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'], }, diff --git a/lib/components/src/ScrollArea/ScrollAreaStyles.tsx b/lib/components/src/ScrollArea/ScrollAreaStyles.tsx index a314683cc8b4..370d2b053231 100644 --- a/lib/components/src/ScrollArea/ScrollAreaStyles.tsx +++ b/lib/components/src/ScrollArea/ScrollAreaStyles.tsx @@ -1,6 +1,4 @@ -import { Theme } from '@storybook/theming'; -// tslint:disable-next-line: no-implicit-dependencies -import { Interpolation } from '@emotion/core'; +import { Theme, Interpolation } from '@storybook/theming'; export const getScrollAreaStyles: (theme: Theme) => Interpolation = (theme: Theme) => ({ '[data-simplebar]': {