Merge branch 'next' into 6706-vue-inline-rendering-support

2025-04-04 17:01:07 +08:00 · 2019-09-27 15:55:50 +02:00 · 2019-09-27 15:55:50 +02:00 · 06691d3998
commit 06691d3998
parent 292986e6bf 932f38c9fe
278 changed files with 6774 additions and 6867 deletions
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@ -4,7 +4,7 @@ aliases:
  - &defaults
    working_directory: /tmp/storybook
    docker:
-      - image: circleci/node:8
+      - image: circleci/node:10

 dependencies:
  pre:
--- a/.eslintrc.js
+++ b/.eslintrc.js
@ -1,162 +1,8 @@
-const error = 2;
-const warn = 1;
 const ignore = 0;

 module.exports = {
  root: true,
-  extends: [
-    'airbnb',
-    'plugin:jest/recommended',
-    'plugin:import/react-native',
-    'plugin:@typescript-eslint/recommended',
-    'prettier',
-    'prettier/react',
-    'prettier/@typescript-eslint',
-  ],
-  plugins: [
-    '@typescript-eslint',
-    'prettier',
-    'jest',
-    'import',
-    'react',
-    'jsx-a11y',
-    'json',
-    'html',
-  ],
-  parser: '@typescript-eslint/parser',
-  parserOptions: {
-    ecmaVersion: 8,
-    sourceType: 'module',
-    ecmaFeatures: {
-      jsx: true,
-    },
-  },
-  env: { es6: true, node: true, 'jest/globals': true },
-  settings: {
-    'import/core-modules': ['enzyme'],
-    'import/ignore': ['node_modules\\/(?!@storybook)'],
-    'import/resolver': {
-      node: {
-        extensions: ['.js', '.ts', '.tsx', '.mjs', '.d.ts'],
-        paths: ['node_modules/', 'node_modules/@types/'],
-      },
-    },
-    'html/html-extensions': ['.html'],
-  },
-  rules: {
-    'no-restricted-imports': [
-      error,
-      {
-        paths: [
-          {
-            name: 'lodash.isequal',
-            message:
-              'Lodash modularised (and lodash < 4.17.11) have CVE vulnerabilities. Please use tree-shakeable imports like lodash/xxx instead',
-          },
-          {
-            name: 'lodash.mergewith',
-            message:
-              'Lodash modularised (and lodash < 4.17.11) have CVE vulnerabilities. Please use tree-shakeable imports like lodash/xxx instead',
-          },
-          {
-            name: 'lodash.pick',
-            message:
-              'Lodash modularised (and lodash < 4.17.11) have CVE vulnerabilities. Please use tree-shakeable imports like lodash/xxx instead',
-          },
-        ],
-        // catch-all for any lodash modularised. The CVE is listed against the entire family for lodash < 4.17.11
-        patterns: ['lodash.*'],
-      },
-    ],
-    'prettier/prettier': [warn],
-    'no-debugger': process.env.NODE_ENV === 'production' ? error : ignore,
-    'class-methods-use-this': ignore,
-    'import/extensions': [
-      error,
-      'always',
-      {
-        js: 'never',
-        ts: 'never',
-        tsx: 'never',
-        mjs: 'never',
-      },
-    ],
-    'import/no-extraneous-dependencies': [
-      error,
-      {
-        devDependencies: [
-          'examples/**',
-          'examples-native/**',
-          '**/example/**',
-          '*.js',
-          '**/*.test.js',
-          '**/*.stories.*',
-          '**/scripts/*.js',
-          '**/stories/**/*.js',
-          '**/__tests__/**/*.js',
-          '**/.storybook/**/*.*',
-        ],
-        peerDependencies: true,
-      },
-    ],
-    'import/prefer-default-export': ignore,
-    'import/default': error,
-    'import/named': error,
-    'import/namespace': error,
-    'react/jsx-filename-extension': [
-      warn,
-      {
-        extensions: ['.js', '.jsx', '.tsx'],
-      },
-    ],
-    'react/jsx-no-bind': [
-      error,
-      {
-        ignoreDOMComponents: true,
-        ignoreRefs: true,
-        allowArrowFunctions: true,
-        allowFunctions: true,
-        allowBind: true,
-      },
-    ],
-    'jsx-a11y/accessible-emoji': ignore,
-    'jsx-a11y/label-has-associated-control': [
-      warn,
-      {
-        labelComponents: ['CustomInputLabel'],
-        labelAttributes: ['label'],
-        controlComponents: ['CustomInput'],
-        depth: 3,
-      },
-    ],
-    'react/no-unescaped-entities': ignore,
-    'jsx-a11y/label-has-for': [error, { required: { some: ['nesting', 'id'] } }],
-    'jsx-a11y/anchor-is-valid': [
-      error,
-      {
-        components: ['A', 'LinkTo', 'Link'],
-        specialLink: ['overrideParams', 'kind', 'story', 'to'],
-      },
-    ],
-    'no-underscore-dangle': [
-      error,
-      {
-        allow: [
-          '__STORYBOOK_CLIENT_API__',
-          '__STORYBOOK_ADDONS_CHANNEL__',
-          '__STORYBOOK_STORY_STORE__',
-        ],
-      },
-    ],
-    '@typescript-eslint/no-var-requires': ignore,
-    '@typescript-eslint/camelcase': ignore,
-    '@typescript-eslint/no-unused-vars': ignore,
-    '@typescript-eslint/explicit-member-accessibility': ignore,
-    '@typescript-eslint/explicit-function-return-type': ignore,
-    '@typescript-eslint/no-explicit-any': ignore, // would prefer to enable this
-    '@typescript-eslint/no-use-before-define': ignore, // this is duplicated
-    '@typescript-eslint/interface-name-prefix': ignore, // I don't agree
-  },
+  extends: ['@storybook/eslint-config-storybook'],
  overrides: [
    {
      files: [
--- a/.github/main.workflow
+++ b/.github/main.workflow
@ -1,32 +0,0 @@
-action "Danger JS" {
-  uses = "danger/danger-js@master"
-  secrets = ["GITHUB_TOKEN"]
-  args = "--dangerfile .ci/danger/dangerfile.ts"
-}
-
-workflow "Dangerfile JS Pull" {
-  on = "pull_request"
-  resolves = "Danger JS"
-}
-
-workflow "Dangerfile JS Label" {
-  on = "label"
-  resolves = "Danger JS"
-}
-
-# ===
-
-action "Automention" {
-  uses = "shilman/automention@master"
-  secrets = ["GITHUB_TOKEN"]
-}
-
-workflow "Automention Issues" {
-  on = "issues"
-  resolves = "Automention"
-}
-
-workflow "Automention PRs" {
-  on = "pull_request"
-  resolves = "Automention"
-}
--- a/.github/workflows/issues.yml
+++ b/.github/workflows/issues.yml
@ -0,0 +1,12 @@
+on: issues
+name: Automention Issues
+jobs:
+  automention:
+    name: Automention
+    runs-on: ubuntu-latest
+    steps:
+    - uses: actions/checkout@master
+    - name: Automention
+      uses: shilman/automention@master
+      env:
+        GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
--- a/.github/workflows/label.yml
+++ b/.github/workflows/label.yml
@ -0,0 +1,14 @@
+on: label
+name: Dangerfile JS Label
+jobs:
+  dangerJS:
+    name: Danger JS
+    runs-on: ubuntu-latest
+    steps:
+    - uses: actions/checkout@master
+    - name: Danger JS
+      uses: danger/danger-js@master
+      env:
+        GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+      with:
+        args: --dangerfile .ci/danger/dangerfile.ts
--- a/.github/workflows/nodejs.yml
+++ b/.github/workflows/nodejs.yml
@ -1,4 +1,4 @@
-name: Node CI
+name: Github CI

 on: [push]

@ -9,8 +9,8 @@ jobs:
    runs-on: ${{ matrix.os }}
    strategy:
      matrix:
-        node-version: [8, 10, 12]
-        os: [ubuntu-latest, windows-latest, macOS-latest]
+        node-version: [10]
+        os: [ubuntu-latest]

    steps:
    - uses: actions/checkout@v1
--- a/.github/workflows/pull_request-automention-prs.yml
+++ b/.github/workflows/pull_request-automention-prs.yml
@ -0,0 +1,12 @@
+on: pull_request
+name: Automention PRs
+jobs:
+  automention:
+    name: Automention
+    runs-on: ubuntu-latest
+    steps:
+    - uses: actions/checkout@master
+    - name: Automention
+      uses: shilman/automention@master
+      env:
+        GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
--- a/.github/workflows/pull_request-dangerfile-js-pull.yml
+++ b/.github/workflows/pull_request-dangerfile-js-pull.yml
@ -0,0 +1,14 @@
+on: pull_request
+name: Dangerfile JS Pull
+jobs:
+  dangerJS:
+    name: Danger JS
+    runs-on: ubuntu-latest
+    steps:
+    - uses: actions/checkout@master
+    - name: Danger JS
+      uses: danger/danger-js@master
+      env:
+        GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+      with:
+        args: --dangerfile .ci/danger/dangerfile.ts
--- a/.gitignore
+++ b/.gitignore
@ -30,4 +30,5 @@ scripts/storage
 htpasswd
 /false
 storybook-out
-/addons/docs/common/config-*
+/addons/docs/common/config-*
+built-storybooks
--- a/.npmignore
+++ b/.npmignore
@ -1,10 +0,0 @@
-/example/
-/demo/
-/docs/
-/media/
-/node_modules/
-/.storybook/
-
-*.md
-
-.babelrc
--- a/.remarkrc.js
+++ b/.remarkrc.js
@ -1,3 +1,2 @@
-module.exports = {
-  plugins: ['remark-preset-lint-recommended', ['remark-lint-list-item-indent', false]],
-};
+/* eslint-disable import/no-extraneous-dependencies */
+module.exports = require('@storybook/linter-config/remark.config');
--- a/.travis.yml
+++ b/.travis.yml
@ -1,6 +1,6 @@
 language: node_js
 node_js:
-  - "8"
+  - "10"

 cache:
  yarn: true
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@ -1,3 +1,136 @@
+## 5.3.0-alpha.4 (September 26, 2019)
+
+### Bug Fixes
+
+* UI: Move addon dependencies to devDependencies ([#8206](https://github.com/storybookjs/storybook/pull/8206))
+* Addon-knobs: Handle undefined array value ([#8006](https://github.com/storybookjs/storybook/pull/8006))
+
+### Maintenance
+
+* Build: Upgrade from node8 to node10 ([#8207](https://github.com/storybookjs/storybook/pull/8207))
+
+## 5.3.0-alpha.3 (September 25, 2019)
+
+### Bug Fixes
+
+* Dependencies: add @types/webpack-env to apps that depend on it ([#8119](https://github.com/storybookjs/storybook/pull/8119))
+* UI: Removes default CSS margins on viewport ([#7742](https://github.com/storybookjs/storybook/pull/7742))
+
+## 5.3.0-alpha.2 (September 24, 2019)
+
+### Bug Fixes
+
+* Core: Fix lib/core files ([#8182](https://github.com/storybookjs/storybook/pull/8182))
+
+## 5.3.0-alpha.1 (September 23, 2019)
+
+### Bug Fixes
+
+* Preact: Allow JSX.Element story ([#8159](https://github.com/storybookjs/storybook/pull/8159))
+* Addon-docs: CSS classes for escape-hatch theming wrapper/content ([#8061](https://github.com/storybookjs/storybook/pull/8061))
+* CLI: Fix variable collisions in storiesof-to-csf ([#8106](https://github.com/storybookjs/storybook/pull/8106))
+* Storyshots: Fix STORYBOOK_HOOKS_CONTEXT error ([#8163](https://github.com/storybookjs/storybook/pull/8163))
+* Addon-contexts: Remove peer dependencies ([#7675](https://github.com/storybookjs/storybook/pull/7675))
+* Addon-knobs: Add missing type def ([#8118](https://github.com/storybookjs/storybook/pull/8118))
+
+### Dependency Upgrades
+
+* Update react-draggable to 4.0.3 ([#8145](https://github.com/storybookjs/storybook/pull/8145))
+
+## 5.2.1 (September 17, 2019)
+
+### Bug Fixes
+
+* Core: Fix error handling ([#8097](https://github.com/storybookjs/storybook/pull/8097))
+
+## 5.3.0-alpha.0 (September 16, 2019)
+
+### Features
+
+* UI: Debounce sidebar search filter ([#8032](https://github.com/storybookjs/storybook/pull/8032))
+
+### Bug Fixes
+
+* Core: Fix error handling ([#8097](https://github.com/storybookjs/storybook/pull/8097))
+
+### Maintenance
+
+* CLI: Add wrapper packages: sb & storybook ([#8034](https://github.com/storybookjs/storybook/pull/8034))
+* Build: Update now config ([#8049](https://github.com/storybookjs/storybook/pull/8049))
+
+## 5.2.0 (September 13, 2019)
+
+Storybook 5.2 is here!
+
+- 📚 DocsPage: Zero-config documentation
+- 📦 Component Story Format: Portable ES6 modules
+- 🖼 Design System: Best practice component development
+- 🧩 Addon API: Simplified w/ hooks
+
+5.2 contains hundreds more fixes, features, and tweaks. Browse the changelogs matching `5.2.0-alpha.*`, `5.2.0-beta.*`, and `5.2.0-rc.*` for the full list of changes. See [MIGRATION.md](https://github.com/storybookjs/storybook/blob/next/MIGRATION.md) to upgrade from `5.0` or earlier.
+
+## 5.2.0-rc.11 (September 10, 2019)
+
+### Features
+
+* DocsPage: show docs.storyDescription above story ([#8037](https://github.com/storybookjs/storybook/pull/8037))
+
+### Maintenance
+
+* Migrate to new github actions ([#8045](https://github.com/storybookjs/storybook/pull/8045))
+
+## 5.2.0-rc.10 (September 9, 2019)
+
+### Bug Fixes
+
+* Angular: remove webpack-env from tsconfig types ([#8036](https://github.com/storybookjs/storybook/pull/8036))
+
+### Documentation
+
+* Guides: Update all guides to CSF ([#8030](https://github.com/storybookjs/storybook/pull/8030))
+
+## 5.2.0-rc.9 (September 7, 2019)
+
+### Bug Fixes
+
+* Addon-knobs: allow array values in select and options knobs ([#8027](https://github.com/storybookjs/storybook/pull/8027))
+
+## 5.2.0-rc.8 (September 6, 2019)
+
+### Bug Fixes
+
+* Addon-docs: Scroll story into view ([#7994](https://github.com/storybookjs/storybook/pull/7994))
+* Addon-docs: Fix LI styling for dark color theme ([#8015](https://github.com/storybookjs/storybook/pull/8015))
+
+## 5.2.0-rc.7 (September 6, 2019)
+
+Publish failed
+
+## 5.2.0-rc.6 (September 5, 2019)
+
+### Bug Fixes
+
+* Addon-docs: Doc blocks fixes for dark theme ([#7991](https://github.com/storybookjs/storybook/pull/7991))
+* API: Fix useEfect in inline Docs ([#7992](https://github.com/storybookjs/storybook/pull/7992))
+* UI: Fix enableShortcuts option ([#7990](https://github.com/storybookjs/storybook/pull/7990))
+* Addon-docs: Error handling for invalid Story id ([#7965](https://github.com/storybookjs/storybook/pull/7965))
+
+## 5.2.0-rc.5 (September 4, 2019)
+
+### Bug Fixes
+
+* CLI: Force welcome stories to show up first in load order ([#7979](https://github.com/storybookjs/storybook/pull/7979))
+
+## 5.2.0-rc.4 (September 3, 2019)
+
+### Bug Fixes
+
+* Addon-docs: Fix MDX theme bleed with reset context ([#7974](https://github.com/storybookjs/storybook/pull/7974))
+
+## 5.2.0-rc.3 (September 3, 2019)
+
+Failed publish
+
 ## 5.2.0-rc.2 (September 1, 2019)

 ### Bug Fixes
@ -947,7 +1080,7 @@ Storybook 5.1 is a juicy upgrade including:
 - 🛠 Context addon: New UI for themes, internationalization, & more
 - 🎛 Presets: One-line configuration for babel, webpack, & addons

-5.1 contains hundreds more fixes, features, and tweaks. Browse the changelogs matching `5.1.0-alpha.*`, `5.1.0-beta.*`, and `5.1.0-rc.*` for the full list of changes. See [MIGRATION.md](https://github.com/storybookjs/storybook/blob/next/MIGRATION.md) to ugprade from `5.0` or earlier.
+5.1 contains hundreds more fixes, features, and tweaks. Browse the changelogs matching `5.1.0-alpha.*`, `5.1.0-beta.*`, and `5.1.0-rc.*` for the full list of changes. See [MIGRATION.md](https://github.com/storybookjs/storybook/blob/next/MIGRATION.md) to upgrade from `5.0` or earlier.

 ## 5.1.0 (June 5, 2019)

@ -2039,7 +2172,7 @@ Storybook 5.0 is a completely new UI with the following improvements:
 - ⌨️ Improved keyboard shortcuts that are user configurable
 - 🌍 New URL structure that eliminates long strings of query parameters

-  5.0 contains hundreds more fixes, features, and tweaks. Browse the changelogs matching `5.0.0-alpha.*`, `5.0.0-beta.*`, and `5.0.0-rc.*` for the full list of changes. See [MIGRATION.md](https://github.com/storybookjs/storybook/blob/next/MIGRATION.md) to ugprade from `4.x`.
+  5.0 contains hundreds more fixes, features, and tweaks. Browse the changelogs matching `5.0.0-alpha.*`, `5.0.0-beta.*`, and `5.0.0-rc.*` for the full list of changes. See [MIGRATION.md](https://github.com/storybookjs/storybook/blob/next/MIGRATION.md) to upgrade from `4.x`.

 ## 5.0.0-rc.11 (March 5, 2019)

--- a/MIGRATION.md
+++ b/MIGRATION.md
@ -2,6 +2,8 @@

 - [Migration](#migration)
  - [From version 5.1.x to 5.2.x](#from-version-51x-to-52x)
+    - [Source-loader](#source-loader)
+    - [Default viewports](#default-viewports)
    - [Grid toolbar-feature](#grid-toolbar-feature)
    - [Docs mode docgen](#docs-mode-docgen)
    - [storySort option](#storysort-option)
@ -67,9 +69,19 @@

 ## From version 5.1.x to 5.2.x

-### default viewports
+### Source-loader

-The default viewports have been reduced to a smaller set, we think is enough for most usecases.
+Addon-storysource contains a loader, `@storybook/addon-storysource/loader`, which has been deprecated in 5.2. If you use it, you'll see the warning:
+
+```
+@storybook/addon-storysource/loader is deprecated, please use @storybook/source-loader instead.
+```
+
+To upgrade to `@storybook/source-loader`, simply `npm install -D @storybook/source-laoder` (or use `yarn`), and replace every instance of `@storybook/addon-storysource/loaoder` with `@storybook/source-loader`.
+
+### Default viewports
+
+The default viewports have been reduced to a smaller set, we think is enough for most use cases.
 You can get the old default back by adding the following to your `config.js`:

 ```js
--- a/README.md
+++ b/README.md
@ -164,7 +164,7 @@ We have a badge! Link it to your live Storybook example.
 [![Storybook](https://cdn.jsdelivr.net/gh/storybookjs/brand@master/badge/badge-storybook.svg)](link to site)
 ```

-If you're looking for material to use in your presentation about storybook, like logo's video material and the colors we use etc, you can find all of that at our [press repo](https://github.com/storybookjs/press).
+If you're looking for material to use in your presentation about storybook, like logo's video material and the colors we use etc, you can find all of that at our [brand repo](https://github.com/storybookjs/brand).

 ## Community

--- a/addons/a11y/README.md
+++ b/addons/a11y/README.md
@ -45,7 +45,7 @@ storiesOf('button', module)
 ```

 For more customizability. Use the `addParameters` function to configure [aXe options](https://github.com/dequelabs/axe-core/blob/develop/doc/API.md#api-name-axeconfigure).
-You can override these options at story level too.
+You can override these options [at story level too](https://storybook.js.org/docs/configurations/options-parameter/#per-story-options).

 ```js
 import React from 'react';
--- a/addons/a11y/package.json
+++ b/addons/a11y/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/addon-a11y",
-  "version": "5.2.0-rc.2",
+  "version": "5.3.0-alpha.4",
  "description": "a11y addon for storybook",
  "keywords": [
    "a11y",
@ -20,18 +20,24 @@
    "directory": "addons/a11y"
  },
  "license": "MIT",
+  "files": [
+    "dist/**/*",
+    "docs/**/*",
+    "README.md",
+    "register.js"
+  ],
  "main": "dist/index.js",
  "types": "dist/index.d.ts",
  "scripts": {
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-rc.2",
-    "@storybook/api": "5.2.0-rc.2",
-    "@storybook/client-logger": "5.2.0-rc.2",
-    "@storybook/components": "5.2.0-rc.2",
-    "@storybook/core-events": "5.2.0-rc.2",
-    "@storybook/theming": "5.2.0-rc.2",
+    "@storybook/addons": "5.3.0-alpha.4",
+    "@storybook/api": "5.3.0-alpha.4",
+    "@storybook/client-logger": "5.3.0-alpha.4",
+    "@storybook/components": "5.3.0-alpha.4",
+    "@storybook/core-events": "5.3.0-alpha.4",
+    "@storybook/theming": "5.3.0-alpha.4",
    "axe-core": "^3.3.2",
    "common-tags": "^1.8.0",
    "core-js": "^3.0.1",
--- a/addons/actions/package.json
+++ b/addons/actions/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/addon-actions",
-  "version": "5.2.0-rc.2",
+  "version": "5.3.0-alpha.4",
  "description": "Action Logger addon for storybook",
  "keywords": [
    "storybook"
@ -15,18 +15,24 @@
    "directory": "addons/actions"
  },
  "license": "MIT",
+  "files": [
+    "dist/**/*",
+    "docs/**/*",
+    "README.md",
+    "register.js"
+  ],
  "main": "dist/index.js",
  "types": "dist/index.d.ts",
  "scripts": {
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-rc.2",
-    "@storybook/api": "5.2.0-rc.2",
-    "@storybook/client-api": "5.2.0-rc.2",
-    "@storybook/components": "5.2.0-rc.2",
-    "@storybook/core-events": "5.2.0-rc.2",
-    "@storybook/theming": "5.2.0-rc.2",
+    "@storybook/addons": "5.3.0-alpha.4",
+    "@storybook/api": "5.3.0-alpha.4",
+    "@storybook/client-api": "5.3.0-alpha.4",
+    "@storybook/components": "5.3.0-alpha.4",
+    "@storybook/core-events": "5.3.0-alpha.4",
+    "@storybook/theming": "5.3.0-alpha.4",
    "core-js": "^3.0.1",
    "fast-deep-equal": "^2.0.1",
    "global": "^4.3.2",
--- a/addons/backgrounds/README.md
+++ b/addons/backgrounds/README.md
@ -4,7 +4,7 @@ Storybook Background Addon can be used to change background colors inside the pr

 [Framework Support](https://github.com/storybookjs/storybook/blob/master/ADDONS_SUPPORT.md)

-![React Storybook Screenshot](https://storybook.js.org/img/addon-backgrounds.gif)
+![React Storybook Screenshot](https://raw.githubusercontent.com/storybookjs/storybook/master/docs/static/img/addon-backgrounds.gif)

 ## Installation

--- a/addons/backgrounds/package.json
+++ b/addons/backgrounds/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/addon-backgrounds",
-  "version": "5.2.0-rc.2",
+  "version": "5.3.0-alpha.4",
  "description": "A storybook addon to show different backgrounds for your preview",
  "keywords": [
    "addon",
@ -19,18 +19,24 @@
  },
  "license": "MIT",
  "author": "jbaxleyiii",
+  "files": [
+    "dist/**/*",
+    "docs/**/*",
+    "README.md",
+    "register.js"
+  ],
  "main": "dist/index.js",
  "types": "dist/index.d.ts",
  "scripts": {
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-rc.2",
-    "@storybook/api": "5.2.0-rc.2",
-    "@storybook/client-logger": "5.2.0-rc.2",
-    "@storybook/components": "5.2.0-rc.2",
-    "@storybook/core-events": "5.2.0-rc.2",
-    "@storybook/theming": "5.2.0-rc.2",
+    "@storybook/addons": "5.3.0-alpha.4",
+    "@storybook/api": "5.3.0-alpha.4",
+    "@storybook/client-logger": "5.3.0-alpha.4",
+    "@storybook/components": "5.3.0-alpha.4",
+    "@storybook/core-events": "5.3.0-alpha.4",
+    "@storybook/theming": "5.3.0-alpha.4",
    "core-js": "^3.0.1",
    "memoizerific": "^1.11.3",
    "react": "^16.8.3",
--- a/addons/backgrounds/src/constants.ts
+++ b/addons/backgrounds/src/constants.ts
@ -1,5 +1,6 @@
 export const ADDON_ID = 'storybook/background';
 export const PARAM_KEY = 'backgrounds';
+export const GRID_PARAM_KEY = 'grid';

 export const EVENTS = {
  UPDATE: `${ADDON_ID}/update`,
--- a/addons/backgrounds/src/containers/BackgroundSelector.tsx
+++ b/addons/backgrounds/src/containers/BackgroundSelector.tsx
@ -128,7 +128,7 @@ export class BackgroundSelector extends Component<Props> {
                <Global
                  styles={(theme: Theme) => ({
                    [`#${iframeId}`]: {
-                      background:
+                      backgroundColor:
                        selectedBackgroundColor === 'transparent'
                          ? theme.background.content
                          : selectedBackgroundColor,
--- a/addons/backgrounds/src/containers/GridSelector.tsx
+++ b/addons/backgrounds/src/containers/GridSelector.tsx
@ -1,15 +1,20 @@
-import React, { FunctionComponent } from 'react';
+import React, { FunctionComponent, memo } from 'react';

-import { useAddonState } from '@storybook/api';
+import { useAddonState, useParameter } from '@storybook/api';
 import { Global } from '@storybook/theming';
 import { Icons, IconButton } from '@storybook/components';

-import { ADDON_ID } from '../constants';
+import { ADDON_ID, GRID_PARAM_KEY } from '../constants';
+
+export interface BackgroundGridParameters {
+  cellSize: number;
+}

 const iframeId = 'storybook-preview-iframe';

-export const GridSelector: FunctionComponent = () => {
+export const GridSelector: FunctionComponent = memo(() => {
  const [state, setState] = useAddonState<boolean>(`${ADDON_ID}/grid`);
+  const { cellSize } = useParameter<BackgroundGridParameters>(GRID_PARAM_KEY, { cellSize: 20 });

  return (
    <IconButton
@ -23,19 +28,24 @@ export const GridSelector: FunctionComponent = () => {
        <Global
          styles={{
            [`#${iframeId}`]: {
-              backgroundSize: '100px 100px, 100px 100px, 20px 20px, 20px 20px',
+              backgroundSize: [
+                `${cellSize * 5}px ${cellSize * 5}px`,
+                `${cellSize * 5}px ${cellSize * 5}px`,
+                `${cellSize}px ${cellSize}px`,
+                `${cellSize}px ${cellSize}px`,
+              ].join(', '),
              backgroundPosition: '-1px -1px, -1px -1px, -1px -1px, -1px -1px',
              backgroundBlendMode: 'difference',
              backgroundImage: [
-                'linear-gradient(rgba(130, 130, 130,0.5) 1px,transparent 1px)',
-                'linear-gradient(90deg,rgb(130, 130, 130,0.5) 1px,transparent 1px)',
-                'linear-gradient(rgba(130, 130, 130, 0.25) 1px,transparent 1px)',
-                'linear-gradient(90deg,rgba(130, 130, 130, 0.25) 1px,transparent 1px)',
-              ].join(','),
+                'linear-gradient(rgba(130, 130, 130, 0.5) 1px, transparent 1px)',
+                'linear-gradient(90deg, rgba(130, 130, 130, 0.5) 1px, transparent 1px)',
+                'linear-gradient(rgba(130, 130, 130, 0.25) 1px, transparent 1px)',
+                'linear-gradient(90deg, rgba(130, 130, 130, 0.25) 1px, transparent 1px)',
+              ].join(', '),
            },
          }}
        />
      ) : null}
    </IconButton>
  );
-};
+});
--- a/addons/centered/package.json
+++ b/addons/centered/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/addon-centered",
-  "version": "5.2.0-rc.2",
+  "version": "5.3.0-alpha.4",
  "description": "Storybook decorator to center components",
  "keywords": [
    "addon",
@ -17,13 +17,27 @@
  },
  "license": "MIT",
  "author": "Muhammed Thanish <mnmtanish@gmail.com>",
+  "files": [
+    "dist/**/*",
+    "README.md",
+    "angular.js",
+    "angular.d.ts",
+    "ember.js",
+    "html.js",
+    "mithril.js",
+    "preact.js",
+    "rax.js",
+    "react.js",
+    "svelte.js",
+    "vue.js"
+  ],
  "main": "dist/index.js",
  "types": "dist/index.d.ts",
  "scripts": {
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-rc.2",
+    "@storybook/addons": "5.3.0-alpha.4",
    "core-js": "^3.0.1",
    "global": "^4.3.2",
    "util-deprecate": "^1.0.2"
@ -33,13 +47,5 @@
    "mithril": "*",
    "preact": "*",
    "react": "*"
-  },
-  "peerDependencies": {
-    "mithril": "*",
-    "preact": "*",
-    "react": "*"
-  },
-  "publishConfig": {
-    "access": "public"
  }
 }
--- a/addons/centered/src/mithril.tsx
+++ b/addons/centered/src/mithril.tsx
@ -1,4 +1,5 @@
 /** @jsx m */
+/* eslint-disable import/no-extraneous-dependencies */
 import m, { ComponentTypes } from 'mithril';
 import { makeDecorator } from '@storybook/addons';
 import parameters from './parameters';
--- a/addons/centered/src/parameters.ts
+++ b/addons/centered/src/parameters.ts
@ -1,3 +1,4 @@
+// eslint-disable-next-line @typescript-eslint/no-object-literal-type-assertion
 const parameters = {
  name: 'centered',
  parameterName: 'centered',
--- a/addons/centered/src/preact.tsx
+++ b/addons/centered/src/preact.tsx
@ -1,4 +1,5 @@
 /** @jsx h */
+/* eslint-disable import/no-extraneous-dependencies */
 import { Component, h } from 'preact';
 import { makeDecorator } from '@storybook/addons';
 import parameters from './parameters';
--- a/addons/centered/src/rax.js
+++ b/addons/centered/src/rax.js
@ -1,9 +1,8 @@
 /** @jsx createElement */
-// eslint-disable-next-line import/no-extraneous-dependencies
+/* eslint-disable import/no-extraneous-dependencies */
 import { createElement } from 'rax';
-// eslint-disable-next-line import/no-extraneous-dependencies
 import View from 'rax-view';
-import { makeDecorator } from '@storybook/addons/src/make-decorator';
+import { makeDecorator } from '@storybook/addons';
 import parameters from './parameters';
 import styles from './styles';

--- a/addons/centered/src/react.tsx
+++ b/addons/centered/src/react.tsx
@ -1,3 +1,4 @@
+/* eslint-disable import/no-extraneous-dependencies */
 import React, { ReactNode } from 'react';
 import { makeDecorator, StoryFn } from '@storybook/addons';
 import parameters from './parameters';
--- a/addons/centered/src/styles.ts
+++ b/addons/centered/src/styles.ts
@ -1,3 +1,4 @@
+// eslint-disable-next-line @typescript-eslint/no-object-literal-type-assertion
 const styles = {
  style: {
    position: 'fixed',
--- a/addons/contexts/package.json
+++ b/addons/contexts/package.json
@ -1,16 +1,20 @@
 {
  "name": "@storybook/addon-contexts",
-  "version": "5.2.0-rc.2",
+  "version": "5.3.0-alpha.4",
  "description": "Storybook Addon Contexts",
  "keywords": [
-    "storybook",
    "preact",
    "react",
+    "storybook",
    "vue"
  ],
-  "author": "Leo Y. Li",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/storybookjs/storybook.git",
+    "directory": "addons/contexts"
+  },
  "license": "MIT",
-  "main": "dist/register.js",
+  "author": "Leo Y. Li",
  "files": [
    "dist/**/*",
    "register.js",
@ -18,21 +22,19 @@
    "react.js",
    "vue.js"
  ],
-  "repository": {
-    "type": "git",
-    "url": "https://github.com/storybookjs/storybook.git",
-    "directory": "addons/contexts"
-  },
+  "main": "dist/register.js",
  "scripts": {
-    "prepare": "node ../../scripts/prepare.js",
-    "dev:check-types": "tsc --noEmit"
+    "dev:check-types": "tsc --noEmit",
+    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-rc.2",
-    "@storybook/api": "5.2.0-rc.2",
-    "@storybook/components": "5.2.0-rc.2",
-    "@storybook/core-events": "5.2.0-rc.2",
-    "core-js": "^3.0.1"
+    "@storybook/addons": "5.3.0-alpha.4",
+    "@storybook/api": "5.3.0-alpha.4",
+    "@storybook/components": "5.3.0-alpha.4",
+    "@storybook/core-events": "5.3.0-alpha.4",
+    "core-js": "^3.0.1",
+    "global": "^4.3.2",
+    "qs": "^6.6.0"
  },
  "peerDependencies": {
    "global": "*",
@ -41,11 +43,6 @@
    "react": "*",
    "vue": "*"
  },
-  "devDependencies": {
-    "preact": "*",
-    "react": "*",
-    "vue": "*"
-  },
  "publishConfig": {
    "access": "public"
  }
--- a/addons/contexts/src/manager/ContextsManager.tsx
+++ b/addons/contexts/src/manager/ContextsManager.tsx
@ -1,5 +1,5 @@
 import React, { useEffect, useState, useCallback } from 'react';
-import { useChannel } from './libs/useChannel';
+import { useChannel } from '@storybook/api';
 import { ToolBar } from './components/ToolBar';
 import { deserialize, serialize } from '../shared/serializers';
 import { PARAM, REBOOT_MANAGER, UPDATE_MANAGER, UPDATE_PREVIEW } from '../shared/constants';
@ -21,11 +21,13 @@ export const ContextsManager: ContextsManager = ({ api }) => {
  );

  // from preview
-  useChannel(UPDATE_MANAGER, newNodes => setNodes(newNodes || []), []);
+  const emit = useChannel({
+    [UPDATE_MANAGER]: newNodes => setNodes(newNodes || []),
+  });

  // to preview
-  useEffect(() => api.emit(REBOOT_MANAGER), []);
-  useEffect(() => api.emit(UPDATE_PREVIEW, state), [state]);
+  useEffect(() => emit(REBOOT_MANAGER), []);
+  useEffect(() => emit(UPDATE_PREVIEW, state), [state]);
  useEffect(() => api.setQueryParams({ [PARAM]: serialize(state) }), [state]);

  return <ToolBar nodes={nodes} state={state || {}} setSelected={setSelected} />;
--- a/addons/contexts/src/manager/libs/useChannel.ts
+++ b/addons/contexts/src/manager/libs/useChannel.ts
@ -1,19 +0,0 @@
-import addons from '@storybook/addons';
-import { useEffect } from 'react';
-import { AnyFunctionReturns } from '../../shared/types.d';
-
-/**
- * The React hook version of Storybook Channel API.
- */
-type UseChannel = (
-  event: string,
-  eventHandler: AnyFunctionReturns<void>,
-  input?: unknown[]
-) => void;
-
-export const useChannel: UseChannel = (event, eventHandler, inputs = []) =>
-  useEffect(() => {
-    const channel = addons.getChannel();
-    channel.on(event, eventHandler);
-    return () => channel.removeListener(event, eventHandler);
-  }, inputs);
--- a/addons/cssresources/package.json
+++ b/addons/cssresources/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/addon-cssresources",
-  "version": "5.2.0-rc.2",
+  "version": "5.3.0-alpha.4",
  "description": "A storybook addon to switch between css resources at runtime for your story",
  "keywords": [
    "addon",
@ -19,16 +19,22 @@
  },
  "license": "MIT",
  "author": "nm123github",
+  "files": [
+    "dist/**/*",
+    "docs/**/*",
+    "README.md",
+    "register.js"
+  ],
  "main": "dist/index.js",
  "types": "dist/index.d.ts",
  "scripts": {
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-rc.2",
-    "@storybook/api": "5.2.0-rc.2",
-    "@storybook/components": "5.2.0-rc.2",
-    "@storybook/core-events": "5.2.0-rc.2",
+    "@storybook/addons": "5.3.0-alpha.4",
+    "@storybook/api": "5.3.0-alpha.4",
+    "@storybook/components": "5.3.0-alpha.4",
+    "@storybook/core-events": "5.3.0-alpha.4",
    "core-js": "^3.0.1",
    "global": "^4.3.2",
    "react": "^16.8.3"
--- a/addons/design-assets/package.json
+++ b/addons/design-assets/package.json
@ -1,14 +1,14 @@
 {
  "name": "@storybook/addon-design-assets",
-  "version": "5.2.0-rc.2",
+  "version": "5.3.0-alpha.4",
  "description": "Design asset preview for storybook",
  "keywords": [
    "addon",
-    "storybook",
-    "parameter",
-    "design",
    "assets",
+    "design",
    "files",
+    "parameter",
+    "storybook",
    "viewer"
  ],
  "homepage": "https://github.com/storybookjs/storybook#readme",
@ -21,18 +21,24 @@
    "directory": "addons/design-assets"
  },
  "license": "MIT",
+  "files": [
+    "dist/**/*",
+    "docs/**/*",
+    "README.md",
+    "register.js"
+  ],
  "main": "dist/index.js",
  "types": "dist/index.d.ts",
  "scripts": {
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-rc.2",
-    "@storybook/api": "5.2.0-rc.2",
-    "@storybook/client-logger": "5.2.0-rc.2",
-    "@storybook/components": "5.2.0-rc.2",
-    "@storybook/core-events": "5.2.0-rc.2",
-    "@storybook/theming": "5.2.0-rc.2",
+    "@storybook/addons": "5.3.0-alpha.4",
+    "@storybook/api": "5.3.0-alpha.4",
+    "@storybook/client-logger": "5.3.0-alpha.4",
+    "@storybook/components": "5.3.0-alpha.4",
+    "@storybook/core-events": "5.3.0-alpha.4",
+    "@storybook/theming": "5.3.0-alpha.4",
    "common-tags": "^1.8.0",
    "core-js": "^3.0.1",
    "global": "^4.3.2",
--- a/addons/docs/README.md
+++ b/addons/docs/README.md
@ -83,8 +83,8 @@ features as well. This chart captures the current state of support
 | StoriesOf stories |   +   |  +  |    +    |  +   |   +    |    +    |   +   |    +    |  +   |   +   |   +    |
 | Source            |   +   |  +  |    +    |  +   |   +    |    +    |   +   |    +    |  +   |   +   |   +    |
 | Notes / Info      |   +   |  +  |    +    |  +   |   +    |    +    |   +   |    +    |  +   |   +   |   +    |
-| Props table       |   +   |  +  |    #    |      |        |         |       |         |      |       |        |
-| Docgen            |   +   |  +  |    #    |      |        |         |       |         |      |       |        |
+| Props table       |   +   |  #  |    #    |      |        |         |       |         |      |       |        |
+| Docgen            |   +   |  #  |    #    |      |        |         |       |         |      |       |        |
 | Inline stories    |   +   |  #  |         |      |        |         |       |         |      |       |        |

 **Note:** `#` = WIP support
@ -94,7 +94,7 @@ features as well. This chart captures the current state of support
 First add the package. Make sure that the versions for your `@storybook/*` packages match:

 ```sh
-yarn add -D @storybook/addon-docs
+yarn add -D @storybook/addon-docs@next
 ```

 Docs has peer dependencies on `react` and `babel-loader`. If you want to write stories in MDX, you may need to add these dependencies as well:
@ -162,7 +162,9 @@ module.exports = async ({ config }) => {
      {
        loader: 'babel-loader',
        // may or may not need this line depending on your app's setup
-        plugins: ['@babel/plugin-transform-react-jsx'],
+        options: {
+          plugins: ['@babel/plugin-transform-react-jsx'],
+        },
      },
      {
        loader: '@mdx-js/loader',
@ -209,7 +211,8 @@ Install the preset with care. If you've already configured Typescript manually,

 Want to learn more? Here are some more articles on Storybook Docs:

- References: [DocsPage](./docs/docspage.md) / [MDX](./docs/mdx.md) / [FAQ](./docs/faq.md) / [Recipes](./docs/recipes.md)
+- References: [DocsPage](./docs/docspage.md) / [MDX](./docs/mdx.md) / [FAQ](./docs/faq.md) / [Recipes](./docs/recipes.md) / [Theming](./docs/theming.md)
 - Vision: [Storybook Docs sneak peak](https://medium.com/storybookjs/storybook-docs-sneak-peak-5be78445094a)
+- Announcement: [DocsPage](https://medium.com/storybookjs/storybook-docspage-e185bc3622bf)
 - Example: [Storybook Design System](https://github.com/storybookjs/design-system)
 - [Technical preview guide](https://docs.google.com/document/d/1un6YX7xDKEKl5-MVb-egnOYN8dynb5Hf7mq0hipk8JE/edit?usp=sharing)
--- a/addons/docs/docs/docspage.md
+++ b/addons/docs/docs/docspage.md
@ -24,7 +24,7 @@ However, `DocsPage` brings the following improvements:
 - It supports all frameworks that Storybook supports, including React, Vue, Angular and [many others](../README.md#framework-support).
 - It generates better documentation that can be used as a standalone docs site, independently of Storybook.
 - It supports better configuration, so you can capture project specific information with ease.
- It's built to work with [`MDX`](./mdx.md`) when you need more control of your documentation.
+- It's built to work with [`MDX`](./mdx.md) when you need more control of your documentation.

 ## Component parameter

@ -32,7 +32,7 @@ However, `DocsPage` brings the following improvements:

 Storybook uses `component` to extract the component's description and props, and will rely on it further in future releases. We encourage you to add it to existing stories and use it in all new stories.

-Here's how to set the component in [Component Story Format (CSF)]():
+Here's how to set the component in [Component Story Format (CSF)](https://storybook.js.org/docs/formats/component-story-format/):

 ```js
 import { Badge } from './Badge';
@ -266,7 +266,8 @@ With that simple function, anyone using the docs addon for `@storybook/vue` can

 Want to learn more? Here are some more articles on Storybook Docs:

- References: [README](../README.md) / [MDX](./mdx.md) / [FAQ](./faq.md) / [Recipes](recipes.md)
+- References: [README](../README.md) / [MDX](mdx.md) / [FAQ](faq.md) / [Recipes](recipes.md) / [Theming](theming.md)
 - Vision: [Storybook Docs sneak peak](https://medium.com/storybookjs/storybook-docs-sneak-peak-5be78445094a)
+- Announcement: [DocsPage](https://medium.com/storybookjs/storybook-docspage-e185bc3622bf)
 - Example: [Storybook Design System](https://github.com/storybookjs/design-system)
 - [Technical preview guide](https://docs.google.com/document/d/1un6YX7xDKEKl5-MVb-egnOYN8dynb5Hf7mq0hipk8JE/edit?usp=sharing)
--- a/addons/docs/docs/faq.md
+++ b/addons/docs/docs/faq.md
@ -46,7 +46,8 @@ This is just [Component Story Format (CSF)](https://medium.com/storybookjs/compo

 Want to learn more? Here are some more articles on Storybook Docs:

- References: [README](../README.md) / [DocsPage](docspage.md) / [MDX](mdx.md) / [Recipes](recipes.md)
+- References: [README](../README.md) / [DocsPage](docspage.md) / [MDX](mdx.md) / [Recipes](recipes.md) / [Theming](theming.md)
 - Vision: [Storybook Docs sneak peak](https://medium.com/storybookjs/storybook-docs-sneak-peak-5be78445094a)
+- Announcement: [DocsPage](https://medium.com/storybookjs/storybook-docspage-e185bc3622bf)
 - Example: [Storybook Design System](https://github.com/storybookjs/design-system)
 - [Technical preview guide](https://docs.google.com/document/d/1un6YX7xDKEKl5-MVb-egnOYN8dynb5Hf7mq0hipk8JE/edit?usp=sharing)
--- a/addons/docs/docs/mdx.md
+++ b/addons/docs/docs/mdx.md
@ -198,7 +198,8 @@ Be sure to update your Storybook config file to load `.stories.mdx` stories, as

 `MDX` is an experimental feature and there's a lot more that hasn't been documented yet. Here are some more articles on Storybook Docs that contain more information:

- References: [README](../README.md) / [DocsPage](docspage.md) / [FAQ](faq.md) / [Recipes](recipes.md)
+- References: [README](../README.md) / [DocsPage](docspage.md) / [FAQ](faq.md) / [Recipes](recipes.md) / [Theming](theming.md)
 - Vision: [Storybook Docs sneak peak](https://medium.com/storybookjs/storybook-docs-sneak-peak-5be78445094a)
+- Announcement: [DocsPage](https://medium.com/storybookjs/storybook-docspage-e185bc3622bf)
 - Example: [Storybook Design System](https://github.com/storybookjs/design-system)
 - [Technical preview guide](https://docs.google.com/document/d/1un6YX7xDKEKl5-MVb-egnOYN8dynb5Hf7mq0hipk8JE/edit?usp=sharing)
--- a/addons/docs/docs/recipes.md
+++ b/addons/docs/docs/recipes.md
@ -6,6 +6,7 @@
 - [Pure MDX Stories](#pure-mdx-stories)
 - [Mixed CSF / MDX Stories](#mixed-csf--mdx-stories)
 - [CSF Stories with MDX Docs](#csf-stories-with-mdx-docs)
+- [Mixing storiesOf with CSF/MDX](#mixing-storiesof-with-csfmdx)
 - [Migrating from notes/info addons](#migrating-from-notesinfo-addons)
 - [Exporting documentation](#exporting-documentation)
 - [More resources](#more-resources)
@ -18,7 +19,7 @@ If you want to intersperse longform documentation in your Storybook, for example

 ## Pure MDX Stories

-[MDX](mdx.md) is an alternative to syntax to CSF that allows you co-locate your stories and your documentation. Everything you can do in CSF, you can do in MDX. And if you're consuming it in [Webpack](https://webpack.js.org/), it exposes an _identical_ interface, so the two files are interchangeable. Some teams will choose to write all of their Storybook in MDX and never look back.
+[MDX](mdx.md) is an alternative syntax to CSF that allows you to co-locate your stories and your documentation. Everything you can do in CSF, you can do in MDX. And if you're consuming it in [Webpack](https://webpack.js.org/), it exposes an _identical_ interface, so the two files are interchangeable. Some teams will choose to write all of their Storybook in MDX and never look back.

 ## Mixed CSF / MDX Stories

@ -71,6 +72,34 @@ Note that in contrast to other examples, the MDX file suffix is `.mdx` rather th
 2. You can refer to existing stories (i.e. `<Story id="...">`) but cannot define new stories (i.e. `<Story name="...">`).
 3. The documentation gets exported as the default export (MDX default) rather than as a parameter hanging off the default export (CSF).

+## Mixing storiesOf with CSF/MDX
+
+You might have a collection of stories using the `storiesOf` API and want to add CSF/MDX piecemeal. Or you might have certain stories that are only possible with the `storiesOf` API (e.g. dynamically generated ones)
+
+So how do you mix these two types? The first argument to `configure` can be a `require.context "req"`, an array of `req's`, or a `loader function`. The loader function should either return null or an array of module exports that include the default export. The default export is used by `configure` to load CSF/MDX files.
+
+So here's a naive implementation of a loader function that assumes that none of your `storiesOf` files contains a default export, and filters out those exports:
+
+```js
+const loadFn = () => {
+  const req = require.context('../src', true, /\.stories\.js$/);
+  return req
+    .keys()
+    .map(fname => req(fname))
+    .filter(exp => !!exp.default);
+};
+
+configure(loadFn, module);
+```
+
+We could have baked this heuristic into Storybook, but we can't assume that your `storiesOf` files don't have default exports. If they do, you can filter them some other way (e.g. by file name).
+
+If you don't filter out those files, you'll see the following error:
+
+> "Loader function passed to 'configure' should return void or an array of module exports that all contain a 'default' export"
+
+We made this error explicit to make sure you know what you're doing when you mix `storiesOf` and CSF/MDX.
+
 ## Migrating from notes/info addons

 If you're currently using the notes/info addons, you can upgrade to DocsPage [using slots](./docspage.md#docspage-slots). There are different ways to use each addon, so you can adapt this recipe according to your use case.
@ -103,7 +132,8 @@ yarn build-storybook --docs

 Want to learn more? Here are some more articles on Storybook Docs:

- References: [README](../README.md) / [DocsPage](docspage.md) / [MDX](mdx.md) / [FAQ](faq.md)
+- References: [README](../README.md) / [DocsPage](docspage.md) / [MDX](mdx.md) / [FAQ](faq.md) / [Theming](theming.md)
 - Vision: [Storybook Docs sneak peak](https://medium.com/storybookjs/storybook-docs-sneak-peak-5be78445094a)
+- Announcement: [DocsPage](https://medium.com/storybookjs/storybook-docspage-e185bc3622bf)
 - Example: [Storybook Design System](https://github.com/storybookjs/design-system)
 - [Technical preview guide](https://docs.google.com/document/d/1un6YX7xDKEKl5-MVb-egnOYN8dynb5Hf7mq0hipk8JE/edit?usp=sharing)
--- a/addons/docs/docs/theming.md
+++ b/addons/docs/docs/theming.md
@ -0,0 +1,71 @@
+# Storybook Docs Theming
+
+[Storybook Docs](../README.md) is themable! There are three different levels of theming, just to keep things interesting:
+
+- [Storybook theming](#storybook-theming)
+- [CSS escape hatches](#css-escape-hatches)
+- [MDX component overrides](#mdx-component-overrides)
+
+## Storybook theming
+
+Storybook theming is the **recommended way** to theme your docs. If you update your storybook theme according to [the documentation](https://storybook.js.org/docs/configurations/theming/), Storybook Docs should adapt in reasonable ways.
+
+For example, here's how to change your docs (and Storybook) to the dark theme, by modifying `.storybook/config.js`:
+
+```js
+import { addParameters } from '@storybook/react';
+import { themes } from '@storybook/theming';
+
+addParameters({
+  options: {
+    theme: themes.dark,
+  },
+});
+```
+
+## CSS escape hatches
+
+The Storybook theme API is narrow by design. If you want to have fine-grained control over the CSS, all of the Docs components are tagged with class names to make this possible. This is advanced usage: use at your own risk.
+
+The classes correspond to markdown elements (e.g. `sbdocs-h1`, `sbdocs-p`, etc.) to UI elements on the page (e.g. `sbdocs-container`, `sbdocs-content`, etc.). To see the currently available classes, simply "inspect element" in your browser.
+
+You can style these classes in `.storybook/preview-head.html`. For example, here's how to make the content wider for UHD displays:
+
+```html
+<style>
+  .sbdocs.sbdocs-content {
+    max-width: 1440px;
+  }
+</style>
+```
+
+> NOTE: All of these elements also have the `sbdocs` class, which is simply an idiomatic way of increasing the CSS specificity so you don't have to use `!important`.
+
+## MDX component overrides
+
+If you're using MDX, there's one more level of themability. MDX allows you to [completely override the components](https://mdxjs.com/advanced/components) that are rendered from markdown using a `components` parameter. This is an advanced usage that we don't officially support in Storybook, but it's a powerful mechanism if you need it.
+
+Here's how you might insert a custom code renderer for `code` blocks on the page, in `.storybook/config.js`:
+
+```js
+import { addParameters } from '@storybook/react';
+import { CodeBlock } from './CodeBlock';
+
+addParameters({
+  docs: {
+    components: {
+      code: CodeBlock,
+    },
+  },
+});
+```
+
+## More resources
+
+Want to learn more? Here are some more articles on Storybook Docs:
+
+- References: [README](../README.md) / [DocsPage](docspage.md) / [MDX](mdx.md) / [FAQ](faq.md) / [Recipes](recipes.md)
+- Vision: [Storybook Docs sneak peak](https://medium.com/storybookjs/storybook-docs-sneak-peak-5be78445094a)
+- Announcement: [DocsPage](https://medium.com/storybookjs/storybook-docspage-e185bc3622bf)
+- Example: [Storybook Design System](https://github.com/storybookjs/design-system)
+- [Technical preview guide](https://docs.google.com/document/d/1un6YX7xDKEKl5-MVb-egnOYN8dynb5Hf7mq0hipk8JE/edit?usp=sharing)
--- a/addons/docs/package.json
+++ b/addons/docs/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/addon-docs",
-  "version": "5.2.0-rc.2",
+  "version": "5.3.0-alpha.4",
  "description": "Superior documentation for your components",
  "keywords": [
    "addon",
@ -17,6 +17,19 @@
    "directory": "addons/docs"
  },
  "license": "MIT",
+  "files": [
+    "dist/**/*",
+    "docs/**/*",
+    "angular/**/*",
+    "common/**/*",
+    "html/**/*",
+    "react/**/*",
+    "vue/**/*",
+    "README.md",
+    "blocks.js",
+    "mdx-compiler-plugin.js",
+    "register.js"
+  ],
  "main": "dist/public_api.js",
  "types": "dist/public_api.d.ts",
  "scripts": {
@ -30,12 +43,12 @@
    "@mdx-js/loader": "^1.1.0",
    "@mdx-js/mdx": "^1.1.0",
    "@mdx-js/react": "^1.0.27",
-    "@storybook/addons": "5.2.0-rc.2",
-    "@storybook/api": "5.2.0-rc.2",
-    "@storybook/components": "5.2.0-rc.2",
-    "@storybook/router": "5.2.0-rc.2",
-    "@storybook/source-loader": "5.2.0-rc.2",
-    "@storybook/theming": "5.2.0-rc.2",
+    "@storybook/addons": "5.3.0-alpha.4",
+    "@storybook/api": "5.3.0-alpha.4",
+    "@storybook/components": "5.3.0-alpha.4",
+    "@storybook/router": "5.3.0-alpha.4",
+    "@storybook/source-loader": "5.3.0-alpha.4",
+    "@storybook/theming": "5.3.0-alpha.4",
    "core-js": "^3.0.1",
    "global": "^4.3.2",
    "js-string-escape": "^1.0.1",
@ -45,7 +58,7 @@
  "devDependencies": {
    "@types/prop-types": "^15.5.9",
    "@types/util-deprecate": "^1.0.0",
-    "@types/webpack-env": "^1.13.7"
+    "@types/webpack-env": "^1.14.0"
  },
  "peerDependencies": {
    "babel-loader": "^8.0.0",
--- a/addons/docs/src/blocks/Anchor.tsx
+++ b/addons/docs/src/blocks/Anchor.tsx
@ -0,0 +1,11 @@
+import React from 'react';
+
+export const anchorBlockIdFromId = (storyId: string) => `anchor--${storyId}`;
+
+export interface AnchorProps {
+  storyId: string;
+}
+
+export const Anchor: React.FC<AnchorProps> = ({ storyId, children }) => (
+  <div id={anchorBlockIdFromId(storyId)}>{children}</div>
+);
--- a/addons/docs/src/blocks/DocsContainer.tsx
+++ b/addons/docs/src/blocks/DocsContainer.tsx
@ -1,11 +1,12 @@
-/* eslint-disable react/destructuring-assignment */
-
 import React from 'react';
+import { document } from 'global';
 import { MDXProvider } from '@mdx-js/react';
 import { ThemeProvider, ensure as ensureTheme } from '@storybook/theming';
 import { DocsWrapper, DocsContent, Source } from '@storybook/components';
 import { components as htmlComponents, Code } from '@storybook/components/html';
 import { DocsContextProps, DocsContext } from './DocsContext';
+import { anchorBlockIdFromId } from './Anchor';
+import { storyBlockIdFromId } from './Story';

 interface DocsContainerProps {
  context: DocsContextProps;
@ -44,17 +45,31 @@ export const DocsContainer: React.FunctionComponent<DocsContainerProps> = ({
  context,
  children,
 }) => {
-  const parameters = (context && context.parameters) || {};
+  const { id: storyId = null, parameters = {} } = context || {};
  const options = parameters.options || {};
  const theme = ensureTheme(options.theme);
  const { components: userComponents = null } = parameters.docs || {};
  const components = { ...defaultComponents, ...userComponents };
+
+  React.useEffect(() => {
+    let element = document.getElementById(anchorBlockIdFromId(storyId));
+    if (!element) {
+      element = document.getElementById(storyBlockIdFromId(storyId));
+    }
+    if (element) {
+      element.scrollIntoView({
+        behavior: 'smooth',
+        block: 'end',
+        inline: 'nearest',
+      });
+    }
+  }, [storyId]);
  return (
    <DocsContext.Provider value={context}>
      <ThemeProvider theme={theme}>
        <MDXProvider components={components}>
-          <DocsWrapper>
-            <DocsContent>{children}</DocsContent>
+          <DocsWrapper className="sbdocs sbdocs-wrapper">
+            <DocsContent className="sbdocs sbdocs-content">{children}</DocsContent>
          </DocsWrapper>
        </MDXProvider>
      </ThemeProvider>
--- a/addons/docs/src/blocks/DocsPage.tsx
+++ b/addons/docs/src/blocks/DocsPage.tsx
@ -7,6 +7,7 @@ import { DocsContext } from './DocsContext';
 import { Description, getDocgen } from './Description';
 import { Story } from './Story';
 import { Preview } from './Preview';
+import { Anchor } from './Anchor';
 import { getPropsTableProps } from './Props';

 export interface SlotContext {
@ -34,7 +35,6 @@ export interface DocsPageProps {
 interface DocsStoryProps {
  id: string;
  name: string;
-  description?: string;
  expanded?: boolean;
  withToolbar?: boolean;
  parameters?: any;
@ -82,18 +82,19 @@ const StoryHeading = H3;
 const DocsStory: React.FunctionComponent<DocsStoryProps> = ({
  id,
  name,
-  description,
  expanded = true,
  withToolbar = false,
  parameters,
 }) => (
-  <>
+  <Anchor storyId={id}>
    {expanded && <StoryHeading>{(parameters && parameters.displayName) || name}</StoryHeading>}
-    {expanded && description && <Description markdown={description} />}
+    {expanded && parameters && parameters.docs && parameters.docs.storyDescription && (
+      <Description markdown={parameters.docs.storyDescription} />
+    )}
    <Preview withToolbar={withToolbar}>
      <Story id={id} />
    </Preview>
-  </>
+  </Anchor>
 );

 export const DocsPage: React.FunctionComponent<DocsPageProps> = ({
--- a/addons/docs/src/blocks/Story.tsx
+++ b/addons/docs/src/blocks/Story.tsx
@ -1,10 +1,19 @@
 import React from 'react';
+import { MDXProvider } from '@mdx-js/react';
+import { components as docsComponents } from '@storybook/components/html';
 import { Story, StoryProps as PureStoryProps } from '@storybook/components';
 import { StoryFn } from '@storybook/addons';
 import { CURRENT_SELECTION } from './shared';

 import { DocsContext, DocsContextProps } from './DocsContext';

+export const storyBlockIdFromId = (storyId: string) => `story--${storyId}`;
+
+const resetComponents: Record<string, React.ElementType> = {};
+Object.keys(docsComponents).forEach(key => {
+  resetComponents[key] = (props: any) => React.createElement(key, props);
+});
+
 interface CommonProps {
  height?: string;
  inline?: boolean;
@ -72,7 +81,13 @@ const StoryContainer: React.FunctionComponent<StoryProps> = props => (
  <DocsContext.Consumer>
    {context => {
      const storyProps = getStoryProps(props, context);
-      return <Story {...storyProps} />;
+      return (
+        <div id={storyBlockIdFromId(storyProps.id)}>
+          <MDXProvider components={resetComponents}>
+            <Story {...storyProps} />
+          </MDXProvider>
+        </div>
+      );
    }}
  </DocsContext.Consumer>
 );
--- a/addons/docs/src/blocks/index.ts
+++ b/addons/docs/src/blocks/index.ts
@ -1,5 +1,6 @@
 export { ColorPalette, ColorItem, IconGallery, IconItem, Typeset } from '@storybook/components';

+export * from './Anchor';
 export * from './Description';
 export * from './DocsContext';
 export * from './DocsPage';
--- a/addons/docs/src/typings.d.ts
+++ b/addons/docs/src/typings.d.ts
@ -1,2 +1,3 @@
 declare module '@mdx-js/react';
 declare module '@storybook/addon-docs/mdx-compiler-plugin';
+declare module 'global';
--- a/addons/events/package.json
+++ b/addons/events/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/addon-events",
-  "version": "5.2.0-rc.2",
+  "version": "5.3.0-alpha.4",
  "description": "Add events to your Storybook stories.",
  "keywords": [
    "addon",
@ -18,17 +18,23 @@
    "directory": "addons/events"
  },
  "license": "MIT",
+  "files": [
+    "dist/**/*",
+    "docs/**/*",
+    "README.md",
+    "register.js"
+  ],
  "main": "dist/index.js",
  "types": "dist/index.d.ts",
  "scripts": {
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-rc.2",
-    "@storybook/api": "5.2.0-rc.2",
-    "@storybook/client-api": "5.2.0-rc.2",
-    "@storybook/core-events": "5.2.0-rc.2",
-    "@storybook/theming": "5.2.0-rc.2",
+    "@storybook/addons": "5.3.0-alpha.4",
+    "@storybook/api": "5.3.0-alpha.4",
+    "@storybook/client-api": "5.3.0-alpha.4",
+    "@storybook/core-events": "5.3.0-alpha.4",
+    "@storybook/theming": "5.3.0-alpha.4",
    "core-js": "^3.0.1",
    "format-json": "^1.0.3",
    "lodash": "^4.17.11",
--- a/addons/google-analytics/package.json
+++ b/addons/google-analytics/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/addon-google-analytics",
-  "version": "5.2.0-rc.2",
+  "version": "5.3.0-alpha.4",
  "description": "Storybook addon for google analytics",
  "keywords": [
    "addon",
@ -20,8 +20,8 @@
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-rc.2",
-    "@storybook/core-events": "5.2.0-rc.2",
+    "@storybook/addons": "5.3.0-alpha.4",
+    "@storybook/core-events": "5.3.0-alpha.4",
    "core-js": "^3.0.1",
    "global": "^4.3.2",
    "react-ga": "^2.5.7"
--- a/addons/graphql/package.json
+++ b/addons/graphql/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/addon-graphql",
-  "version": "5.2.0-rc.2",
+  "version": "5.3.0-alpha.4",
  "description": "Storybook addon to display the GraphiQL IDE",
  "keywords": [
    "addon",
@ -16,17 +16,23 @@
    "directory": "addons/graphql"
  },
  "license": "MIT",
+  "files": [
+    "dist/**/*",
+    "docs/**/*",
+    "README.md",
+    "register.js"
+  ],
  "main": "dist/index.js",
  "types": "dist/index.d.ts",
  "scripts": {
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-rc.2",
-    "@storybook/api": "5.2.0-rc.2",
+    "@storybook/addons": "5.3.0-alpha.4",
+    "@storybook/api": "5.3.0-alpha.4",
    "core-js": "^3.0.1",
    "global": "^4.3.2",
-    "graphiql": "^0.13.0",
+    "graphiql": "^0.14.2",
    "graphql": "^14.2.1",
    "prop-types": "^15.7.2"
  },
--- a/addons/info/package.json
+++ b/addons/info/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/addon-info",
-  "version": "5.2.0-rc.2",
+  "version": "5.3.0-alpha.4",
  "description": "A Storybook addon to show additional information for your stories.",
  "keywords": [
    "addon",
@ -16,16 +16,21 @@
    "directory": "addons/info"
  },
  "license": "MIT",
+  "files": [
+    "dist/**/*",
+    "docs/**/*",
+    "README.md"
+  ],
  "main": "dist/index.js",
  "jsnext:main": "src/index.js",
  "scripts": {
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-rc.2",
-    "@storybook/client-logger": "5.2.0-rc.2",
-    "@storybook/components": "5.2.0-rc.2",
-    "@storybook/theming": "5.2.0-rc.2",
+    "@storybook/addons": "5.3.0-alpha.4",
+    "@storybook/client-logger": "5.3.0-alpha.4",
+    "@storybook/components": "5.3.0-alpha.4",
+    "@storybook/theming": "5.3.0-alpha.4",
    "core-js": "^3.0.1",
    "global": "^4.3.2",
    "jsx-to-string": "^1.4.0",
--- a/addons/jest/package.json
+++ b/addons/jest/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/addon-jest",
-  "version": "5.2.0-rc.2",
+  "version": "5.3.0-alpha.4",
  "description": "React storybook addon that show component jest report",
  "keywords": [
    "addon",
@ -22,17 +22,23 @@
  },
  "license": "MIT",
  "author": "Renaud Tertrais <renaud.tertrais@gmail.com> (https://github.com/renaudtertrais)",
+  "files": [
+    "dist/**/*",
+    "docs/**/*",
+    "README.md",
+    "register.js"
+  ],
  "main": "dist/index.js",
  "types": "dist/index.d.ts",
  "scripts": {
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-rc.2",
-    "@storybook/api": "5.2.0-rc.2",
-    "@storybook/components": "5.2.0-rc.2",
-    "@storybook/core-events": "5.2.0-rc.2",
-    "@storybook/theming": "5.2.0-rc.2",
+    "@storybook/addons": "5.3.0-alpha.4",
+    "@storybook/api": "5.3.0-alpha.4",
+    "@storybook/components": "5.3.0-alpha.4",
+    "@storybook/core-events": "5.3.0-alpha.4",
+    "@storybook/theming": "5.3.0-alpha.4",
    "core-js": "^3.0.1",
    "global": "^4.3.2",
    "react": "^16.8.3",
--- a/addons/knobs/.npmignore
+++ b/addons/knobs/.npmignore
@ -1 +0,0 @@
-.babelrc
--- a/addons/knobs/package.json
+++ b/addons/knobs/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/addon-knobs",
-  "version": "5.2.0-rc.2",
+  "version": "5.3.0-alpha.4",
  "description": "Storybook Addon Prop Editor Component",
  "keywords": [
    "addon",
@ -16,18 +16,32 @@
    "directory": "addons/knobs"
  },
  "license": "MIT",
+  "files": [
+    "dist/**/*",
+    "docs/**/*",
+    "README.md",
+    "angular.js",
+    "html.js",
+    "marko.js",
+    "mithril.js",
+    "polymer.js",
+    "react.js",
+    "vue.js",
+    "register.js"
+  ],
  "main": "dist/index.js",
  "types": "dist/index.d.ts",
  "scripts": {
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-rc.2",
-    "@storybook/api": "5.2.0-rc.2",
-    "@storybook/client-api": "5.2.0-rc.2",
-    "@storybook/components": "5.2.0-rc.2",
-    "@storybook/core-events": "5.2.0-rc.2",
-    "@storybook/theming": "5.2.0-rc.2",
+    "@storybook/addons": "5.3.0-alpha.4",
+    "@storybook/api": "5.3.0-alpha.4",
+    "@storybook/client-api": "5.3.0-alpha.4",
+    "@storybook/components": "5.3.0-alpha.4",
+    "@storybook/core-events": "5.3.0-alpha.4",
+    "@storybook/theming": "5.3.0-alpha.4",
+    "@types/react-color": "^3.0.1",
    "copy-to-clipboard": "^3.0.8",
    "core-js": "^3.0.1",
    "escape-html": "^1.0.3",
@ -40,16 +54,15 @@
    "react-lifecycles-compat": "^3.0.4",
    "react-select": "^3.0.0"
  },
+  "devDependencies": {
+    "@types/escape-html": "0.0.20",
+    "@types/react-lifecycles-compat": "^3.0.1",
+    "@types/react-select": "^3.0.4"
+  },
  "peerDependencies": {
    "react": "*"
  },
  "publishConfig": {
    "access": "public"
-  },
-  "devDependencies": {
-    "@types/escape-html": "0.0.20",
-    "@types/react-color": "^3.0.1",
-    "@types/react-lifecycles-compat": "^3.0.1",
-    "@types/react-select": "^2.0.19"
  }
 }
--- a/addons/knobs/src/types/knob-test-cases.ts
+++ b/addons/knobs/src/types/knob-test-cases.ts
@ -106,7 +106,7 @@ expectKnobOfType<string>(
    },
    'none'
  ),
-  select('select with string array', ['yes', 'no'], 'yes'),
+  select<string>('select with string array', ['yes', 'no'], 'yes'),
  select('select with string literal array', stringLiteralArray, stringLiteralArray[0]),
  select('select with readonly array', ['red', 'blue'] as const, 'red'),
  select<ButtonVariant>('select with string enum options', ButtonVariant, ButtonVariant.primary)
@ -123,7 +123,7 @@ expectKnobOfType<number>(
    { 'type a': SomeEnum.Type1, 'type b': SomeEnum.Type2 },
    SomeEnum.Type2
  ),
-  select('select with number array', [1, 2, 3, 4], 1),
+  select<number>('select with number array', [1, 2, 3, 4], 1),
  select('select with readonly number array', [1, 2] as const, 1)
 );

@ -131,6 +131,60 @@ expectKnobOfType<number | null>(
  select('select with null option', { a: 1, b: null }, null, groupId)
 );

+expectKnobOfType<string | string[]>(
+  select(
+    'select with string and string array options',
+    {
+      Red: 'red',
+      Blue: 'blue',
+      Yellow: 'yellow',
+      Rainbow: ['red', 'orange', 'etc'],
+      None: 'transparent',
+    },
+    'red'
+  )
+);
+
+expectKnobOfType<number | number[]>(
+  select(
+    'select with number and number array options',
+    {
+      Red: 1,
+      Blue: 2,
+      Yellow: 3,
+      Rainbow: [4, 5, 6],
+      None: 7,
+    },
+    7
+  )
+);
+
+expectKnobOfType<string | string[] | null>(
+  select(
+    'select with string, string array, and null options',
+    {
+      Red: 'red',
+      Blue: 'blue',
+      Yellow: 'yellow',
+      Rainbow: ['red', 'orange', 'etc'],
+      None: null,
+    },
+    null
+  )
+);
+
+expectKnobOfType<number[]>(
+  select(
+    'select with number array options',
+    {
+      ones: [1],
+      twos: [2, 2],
+      threes: [3, 3, 3],
+    },
+    [1]
+  )
+);
+
 /** Object knob */

 expectKnobOfType(
@ -163,6 +217,68 @@ expectKnobOfType(
  options('options with group', {}, '', { display: 'check' })
 );

+expectKnobOfType<number | null>(
+  options('select with null option', { a: 1, b: null }, null, { display: 'check' })
+);
+
+expectKnobOfType<string | string[]>(
+  options(
+    'options with string and string array options',
+    {
+      Red: 'red',
+      Blue: 'blue',
+      Yellow: 'yellow',
+      Rainbow: ['red', 'orange', 'etc'],
+      None: 'transparent',
+    },
+    'red',
+    { display: 'check' }
+  )
+);
+
+expectKnobOfType<number | number[]>(
+  options(
+    'select with number and number array options',
+    {
+      Red: 1,
+      Blue: 2,
+      Yellow: 3,
+      Rainbow: [4, 5, 6],
+      None: 7,
+    },
+    7,
+    { display: 'check' }
+  )
+);
+
+expectKnobOfType<string | string[] | null>(
+  options(
+    'select with string, string array, and null options',
+    {
+      Red: 'red',
+      Blue: 'blue',
+      Yellow: 'yellow',
+      Rainbow: ['red', 'orange', 'etc'],
+      None: null,
+    },
+    null,
+    { display: 'check' }
+  )
+);
+
+expectKnobOfType<number[]>(
+  options(
+    'select with number array options',
+    {
+      ones: [1],
+      twos: [2, 2],
+      threes: [3, 3, 3],
+    },
+    [1],
+    { display: 'check' }
+  )
+);
+
 /** Array knob */

 const arrayReadonly = array('array as readonly', ['hi', 'there'] as const);
--- a/addons/knobs/src/components/Panel.tsx
+++ b/addons/knobs/src/components/Panel.tsx
@ -228,6 +228,7 @@ export default class KnobPanel extends PureComponent<KnobPanelProps> {
        render: ({ active }) => (
          <TabWrapper key={knobKeyGroupId} active={active}>
            <PropForm
+              // eslint-disable-next-line no-use-before-define
              knobs={knobsArray.filter(
                knob => (knob.groupId || DEFAULT_GROUP_ID) === knobKeyGroupId
              )}
--- a/addons/knobs/src/components/types/Array.tsx
+++ b/addons/knobs/src/components/types/Array.tsx
@ -62,7 +62,7 @@ export default class ArrayType extends Component<ArrayTypeProps> {

  render() {
    const { knob } = this.props;
-    const value = knob.value.join(knob.separator);
+    const value = knob.value && knob.value.join(knob.separator);

    return (
      <Form.Textarea
--- a/addons/knobs/src/components/types/Options.tsx
+++ b/addons/knobs/src/components/types/Options.tsx
@ -9,7 +9,14 @@ import CheckboxesType from './Checkboxes';

 // TODO: Apply the Storybook theme to react-select

-export type OptionsTypeKnobSingleValue = string | number | null | undefined;
+export type OptionsTypeKnobSingleValue =
+  | string
+  | number
+  | null
+  | undefined
+  | string[]
+  | number[]
+  | (string | number)[];

 export type OptionsTypeKnobValue<
  T extends OptionsTypeKnobSingleValue = OptionsTypeKnobSingleValue
@ -24,7 +31,7 @@ export type OptionsKnobOptionsDisplay =
  | 'multi-select';

 export interface OptionsKnobOptions {
-  display?: OptionsKnobOptionsDisplay;
+  display: OptionsKnobOptionsDisplay;
 }

 export interface OptionsTypeKnob<T extends OptionsTypeKnobValue> extends KnobControlConfig<T> {
--- a/addons/knobs/src/components/types/Select.tsx
+++ b/addons/knobs/src/components/types/Select.tsx
@ -4,13 +4,13 @@ import PropTypes from 'prop-types';
 import { Form } from '@storybook/components';
 import { KnobControlConfig, KnobControlProps } from './types';

-export type SelectTypeKnobValue = string | number | null | undefined;
+export type SelectTypeKnobValue = string | number | null | undefined | PropertyKey[];

 export type SelectTypeOptionsProp<T extends SelectTypeKnobValue = SelectTypeKnobValue> =
-  | Record<string | number, T>
-  | Record<Exclude<T, null | undefined>, T[keyof T]>
-  | Exclude<T, null | undefined>[]
-  | readonly Exclude<T, null | undefined>[];
+  | Record<PropertyKey, T>
+  | Record<Extract<T, PropertyKey>, T[keyof T]>
+  | Extract<T, PropertyKey>[]
+  | readonly Extract<T, PropertyKey>[];

 export interface SelectTypeKnob<T extends SelectTypeKnobValue = SelectTypeKnobValue>
  extends KnobControlConfig<T> {
@ -31,8 +31,8 @@ const SelectType: FunctionComponent<SelectTypeProps> & {
 } = ({ knob, onChange }) => {
  const { options } = knob;
  const entries = Array.isArray(options)
-    ? options.reduce<Record<string, SelectTypeKnobValue>>((acc, k) => ({ ...acc, [k]: k }), {})
-    : (options as Record<string, SelectTypeKnobValue>);
+    ? options.reduce<Record<PropertyKey, SelectTypeKnobValue>>((acc, k) => ({ ...acc, [k]: k }), {})
+    : (options as Record<PropertyKey, SelectTypeKnobValue>);

  const selectedKey = Object.keys(entries).find(k => {
    if (Array.isArray(knob.value)) {
--- a/addons/links/package.json
+++ b/addons/links/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/addon-links",
-  "version": "5.2.0-rc.2",
+  "version": "5.3.0-alpha.4",
  "description": "Story Links addon for storybook",
  "keywords": [
    "addon",
@ -16,15 +16,22 @@
    "directory": "addons/links"
  },
  "license": "MIT",
+  "files": [
+    "dist/**/*",
+    "docs/**/*",
+    "README.md",
+    "react.js",
+    "register.js"
+  ],
  "main": "dist/index.js",
  "types": "dist/index.d.ts",
  "scripts": {
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-rc.2",
-    "@storybook/core-events": "5.2.0-rc.2",
-    "@storybook/router": "5.2.0-rc.2",
+    "@storybook/addons": "5.3.0-alpha.4",
+    "@storybook/core-events": "5.3.0-alpha.4",
+    "@storybook/router": "5.3.0-alpha.4",
    "common-tags": "^1.8.0",
    "core-js": "^3.0.1",
    "global": "^4.3.2",
--- a/addons/notes/package.json
+++ b/addons/notes/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/addon-notes",
-  "version": "5.2.0-rc.2",
+  "version": "5.3.0-alpha.4",
  "description": "Write notes for your Storybook stories.",
  "keywords": [
    "addon",
@ -17,19 +17,26 @@
    "directory": "addons/notes"
  },
  "license": "MIT",
+  "files": [
+    "dist/**/*",
+    "docs/**/*",
+    "README.md",
+    "register.js",
+    "register-panel.js"
+  ],
  "main": "dist/public_api.js",
  "types": "dist/public_api.d.ts",
  "scripts": {
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-rc.2",
-    "@storybook/api": "5.2.0-rc.2",
-    "@storybook/client-logger": "5.2.0-rc.2",
-    "@storybook/components": "5.2.0-rc.2",
-    "@storybook/core-events": "5.2.0-rc.2",
-    "@storybook/router": "5.2.0-rc.2",
-    "@storybook/theming": "5.2.0-rc.2",
+    "@storybook/addons": "5.3.0-alpha.4",
+    "@storybook/api": "5.3.0-alpha.4",
+    "@storybook/client-logger": "5.3.0-alpha.4",
+    "@storybook/components": "5.3.0-alpha.4",
+    "@storybook/core-events": "5.3.0-alpha.4",
+    "@storybook/router": "5.3.0-alpha.4",
+    "@storybook/theming": "5.3.0-alpha.4",
    "core-js": "^3.0.1",
    "global": "^4.3.2",
    "markdown-to-jsx": "^6.10.3",
@ -40,7 +47,7 @@
  "devDependencies": {
    "@types/prop-types": "^15.5.9",
    "@types/util-deprecate": "^1.0.0",
-    "@types/webpack-env": "^1.13.7"
+    "@types/webpack-env": "^1.14.0"
  },
  "peerDependencies": {
    "react": "*"
--- a/addons/ondevice-actions/package.json
+++ b/addons/ondevice-actions/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/addon-ondevice-actions",
-  "version": "5.2.0-rc.2",
+  "version": "5.3.0-alpha.4",
  "description": "Action Logger addon for react-native storybook",
  "keywords": [
    "storybook"
@ -14,18 +14,24 @@
    "url": "https://github.com/storybookjs/storybook.git"
  },
  "license": "MIT",
+  "files": [
+    "dist/**/*",
+    "docs/**/*",
+    "README.md",
+    "register.js"
+  ],
  "main": "dist/index.js",
  "scripts": {
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-rc.2",
-    "@storybook/core-events": "5.2.0-rc.2",
+    "@storybook/addons": "5.3.0-alpha.4",
+    "@storybook/core-events": "5.3.0-alpha.4",
    "core-js": "^3.0.1",
    "fast-deep-equal": "^2.0.1"
  },
  "devDependencies": {
-    "@storybook/addon-actions": "5.2.0-rc.2"
+    "@storybook/addon-actions": "5.3.0-alpha.4"
  },
  "peerDependencies": {
    "@storybook/addon-actions": "*",
--- a/addons/ondevice-backgrounds/package.json
+++ b/addons/ondevice-backgrounds/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/addon-ondevice-backgrounds",
-  "version": "5.2.0-rc.2",
+  "version": "5.3.0-alpha.4",
  "description": "A react-native storybook addon to show different backgrounds for your preview",
  "keywords": [
    "addon",
@ -18,13 +18,18 @@
    "directory": "addons/ondevice-backgrounds"
  },
  "license": "MIT",
+  "files": [
+    "dist/**/*",
+    "docs/**/*",
+    "README.md",
+    "register.js"
+  ],
  "main": "dist/index.js",
-  "jsnext:main": "src/index.js",
  "scripts": {
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-rc.2",
+    "@storybook/addons": "5.3.0-alpha.4",
    "core-js": "^3.0.1",
    "prop-types": "^15.7.2"
  },
--- a/addons/ondevice-knobs/package.json
+++ b/addons/ondevice-knobs/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/addon-ondevice-knobs",
-  "version": "5.2.0-rc.2",
+  "version": "5.3.0-alpha.4",
  "description": "Display storybook story knobs on your deviced.",
  "keywords": [
    "addon",
@ -15,14 +15,19 @@
    "directory": "addons/ondevice-knobs"
  },
  "license": "MIT",
+  "files": [
+    "dist/**/*",
+    "docs/**/*",
+    "README.md",
+    "register.js"
+  ],
  "main": "dist/index.js",
-  "jsnext:main": "src/index.js",
  "scripts": {
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-rc.2",
-    "@storybook/core-events": "5.2.0-rc.2",
+    "@storybook/addons": "5.3.0-alpha.4",
+    "@storybook/core-events": "5.3.0-alpha.4",
    "core-js": "^3.0.1",
    "deep-equal": "^1.0.1",
    "prop-types": "^15.7.2",
--- a/addons/ondevice-notes/package.json
+++ b/addons/ondevice-notes/package.json
@ -1,12 +1,12 @@
 {
  "name": "@storybook/addon-ondevice-notes",
-  "version": "5.2.0-rc.2",
+  "version": "5.3.0-alpha.4",
  "description": "Write notes for your react-native Storybook stories.",
  "keywords": [
    "addon",
    "notes",
-    "storybook",
-    "react-native"
+    "react-native",
+    "storybook"
  ],
  "repository": {
    "type": "git",
@ -14,14 +14,19 @@
    "directory": "addons/ondevice-notes"
  },
  "license": "MIT",
+  "files": [
+    "dist/**/*",
+    "docs/**/*",
+    "README.md",
+    "register.js"
+  ],
  "main": "dist/index.js",
-  "jsnext:main": "src/index.js",
  "scripts": {
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-rc.2",
-    "@storybook/client-logger": "5.2.0-rc.2",
+    "@storybook/addons": "5.3.0-alpha.4",
+    "@storybook/client-logger": "5.3.0-alpha.4",
    "core-js": "^3.0.1",
    "prop-types": "^15.7.2",
    "react-native-simple-markdown": "^1.1.0"
--- a/addons/options/package.json
+++ b/addons/options/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/addon-options",
-  "version": "5.2.0-rc.2",
+  "version": "5.3.0-alpha.4",
  "description": "Options addon for storybook",
  "keywords": [
    "addon",
@ -16,13 +16,19 @@
    "directory": "addons/options"
  },
  "license": "MIT",
+  "files": [
+    "dist/**/*",
+    "docs/**/*",
+    "README.md",
+    "register.js"
+  ],
  "main": "dist/index.js",
  "types": "dist/public_api.d.ts",
  "scripts": {
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-rc.2",
+    "@storybook/addons": "5.3.0-alpha.4",
    "core-js": "^3.0.1",
    "util-deprecate": "^1.0.2"
  },
--- a/addons/queryparams/package.json
+++ b/addons/queryparams/package.json
@ -1,11 +1,11 @@
 {
  "name": "@storybook/addon-queryparams",
-  "version": "5.2.0-rc.2",
+  "version": "5.3.0-alpha.4",
  "description": "parameter addon for storybook",
  "keywords": [
    "addon",
-    "storybook",
-    "query"
+    "query",
+    "storybook"
  ],
  "homepage": "https://github.com/storybookjs/storybook#readme",
  "bugs": {
@ -17,18 +17,23 @@
    "directory": "addons/addon-queryparams"
  },
  "license": "MIT",
+  "files": [
+    "dist/**/*",
+    "docs/**/*",
+    "README.md"
+  ],
  "main": "dist/index.js",
  "types": "dist/index.d.ts",
  "scripts": {
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-rc.2",
-    "@storybook/api": "5.2.0-rc.2",
-    "@storybook/client-logger": "5.2.0-rc.2",
-    "@storybook/components": "5.2.0-rc.2",
-    "@storybook/core-events": "5.2.0-rc.2",
-    "@storybook/theming": "5.2.0-rc.2",
+    "@storybook/addons": "5.3.0-alpha.4",
+    "@storybook/api": "5.3.0-alpha.4",
+    "@storybook/client-logger": "5.3.0-alpha.4",
+    "@storybook/components": "5.3.0-alpha.4",
+    "@storybook/core-events": "5.3.0-alpha.4",
+    "@storybook/theming": "5.3.0-alpha.4",
    "common-tags": "^1.8.0",
    "core-js": "^3.0.1",
    "global": "^4.3.2",
--- a/addons/storyshots/storyshots-core/.npmignore
+++ b/addons/storyshots/storyshots-core/.npmignore
@ -1 +0,0 @@
-.babelrc
--- a/addons/storyshots/storyshots-core/package.json
+++ b/addons/storyshots/storyshots-core/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/addon-storyshots",
-  "version": "5.2.0-rc.2",
+  "version": "5.3.0-alpha.4",
  "description": "StoryShots is a Jest Snapshot Testing Addon for Storybook.",
  "keywords": [
    "addon",
@ -16,8 +16,12 @@
    "directory": "addons/storyshots/storyshots-core"
  },
  "license": "MIT",
+  "files": [
+    "dist/**/*",
+    "docs/**/*",
+    "README.md"
+  ],
  "main": "dist/index.js",
-  "jsnext:main": "src/index.js",
  "scripts": {
    "build-storybook": "build-storybook",
    "example": "jest storyshot.test",
@ -25,7 +29,7 @@
    "storybook": "start-storybook -p 6006"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-rc.2",
+    "@storybook/addons": "5.3.0-alpha.4",
    "core-js": "^3.0.1",
    "glob": "^7.1.3",
    "global": "^4.3.2",
@ -35,7 +39,7 @@
  },
  "devDependencies": {
    "enzyme-to-json": "^3.3.5",
-    "jest-emotion": "^10.0.10",
+    "jest-emotion": "^10.0.17",
    "react": "^16.8.3"
  },
  "publishConfig": {
--- a/addons/storyshots/storyshots-puppeteer/package.json
+++ b/addons/storyshots/storyshots-puppeteer/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/addon-storyshots-puppeteer",
-  "version": "5.2.0-rc.2",
+  "version": "5.3.0-alpha.4",
  "description": "Image snapshots addition to StoryShots based on puppeteer",
  "keywords": [
    "addon",
@ -16,25 +16,29 @@
    "directory": "addons/storyshots/storyshots-puppeteer"
  },
  "license": "MIT",
+  "files": [
+    "dist/**/*",
+    "docs/**/*",
+    "README.md"
+  ],
  "main": "dist/index.js",
-  "jsnext:main": "src/index.js",
  "scripts": {
    "prepare": "node ../../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/node-logger": "5.2.0-rc.2",
-    "@storybook/router": "5.2.0-rc.2",
+    "@storybook/node-logger": "5.3.0-alpha.4",
+    "@storybook/router": "5.3.0-alpha.4",
    "core-js": "^3.0.1",
    "jest-image-snapshot": "^2.8.2",
    "regenerator-runtime": "^0.12.1"
  },
-  "optionalDependencies": {
-    "puppeteer": "^1.12.2"
-  },
  "peerDependencies": {
    "@storybook/addon-storyshots": "5.2.0-beta.13",
    "puppeteer": "^1.12.2"
  },
+  "optionalDependencies": {
+    "puppeteer": "^1.12.2"
+  },
  "publishConfig": {
    "access": "public"
  }
--- a/addons/storysource/README.md
+++ b/addons/storysource/README.md
@ -4,7 +4,7 @@ This addon is used to show stories source in the addon panel.

 [Framework Support](https://github.com/storybookjs/storybook/blob/master/ADDONS_SUPPORT.md)

-![Storysource Demo](demo.gif)
+![Storysource Demo](./docs/demo.gif)

 ## Getting Started

--- a/addons/storysource/docs/demo.gif
+++ b/addons/storysource/docs/demo.gif
--- a/addons/storysource/package.json
+++ b/addons/storysource/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/addon-storysource",
-  "version": "5.2.0-rc.2",
+  "version": "5.3.0-alpha.4",
  "description": "Stories addon for storybook",
  "keywords": [
    "addon",
@ -16,17 +16,23 @@
    "directory": "addons/storysource"
  },
  "license": "MIT",
+  "files": [
+    "dist/**/*",
+    "docs/**/*",
+    "README.md",
+    "loader.js",
+    "register.js"
+  ],
  "main": "dist/index.js",
-  "jsnext:main": "src/index.js",
  "scripts": {
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-rc.2",
-    "@storybook/components": "5.2.0-rc.2",
-    "@storybook/router": "5.2.0-rc.2",
-    "@storybook/source-loader": "5.2.0-rc.2",
-    "@storybook/theming": "5.2.0-rc.2",
+    "@storybook/addons": "5.3.0-alpha.4",
+    "@storybook/components": "5.3.0-alpha.4",
+    "@storybook/router": "5.3.0-alpha.4",
+    "@storybook/source-loader": "5.3.0-alpha.4",
+    "@storybook/theming": "5.3.0-alpha.4",
    "core-js": "^3.0.1",
    "estraverse": "^4.2.0",
    "loader-utils": "^1.2.3",
--- a/addons/viewport/package.json
+++ b/addons/viewport/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/addon-viewport",
-  "version": "5.2.0-rc.2",
+  "version": "5.3.0-alpha.4",
  "description": "Storybook addon to change the viewport size to mobile",
  "keywords": [
    "addon",
@ -16,30 +16,37 @@
    "directory": "addons/viewport"
  },
  "license": "MIT",
+  "files": [
+    "dist/**/*",
+    "docs/**/*",
+    "README.md",
+    "preview.js",
+    "register.js"
+  ],
  "main": "preview.js",
  "scripts": {
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-rc.2",
-    "@storybook/api": "5.2.0-rc.2",
-    "@storybook/client-logger": "5.2.0-rc.2",
-    "@storybook/components": "5.2.0-rc.2",
-    "@storybook/core-events": "5.2.0-rc.2",
-    "@storybook/theming": "5.2.0-rc.2",
+    "@storybook/addons": "5.3.0-alpha.4",
+    "@storybook/api": "5.3.0-alpha.4",
+    "@storybook/client-logger": "5.3.0-alpha.4",
+    "@storybook/components": "5.3.0-alpha.4",
+    "@storybook/core-events": "5.3.0-alpha.4",
+    "@storybook/theming": "5.3.0-alpha.4",
    "core-js": "^3.0.1",
    "global": "^4.3.2",
    "memoizerific": "^1.11.3",
    "prop-types": "^15.7.2",
    "util-deprecate": "^1.0.2"
  },
+  "devDependencies": {
+    "@types/util-deprecate": "^1.0.0"
+  },
  "peerDependencies": {
    "react": "*"
  },
  "publishConfig": {
    "access": "public"
-  },
-  "devDependencies": {
-    "@types/util-deprecate": "^1.0.0"
  }
 }
--- a/addons/viewport/src/Tool.tsx
+++ b/addons/viewport/src/Tool.tsx
@ -20,6 +20,7 @@ interface ViewportItem {
 }

 const toList = memoize(50)((items: ViewportMap): ViewportItem[] => [
+  // eslint-disable-next-line no-use-before-define
  ...baseViewports,
  ...Object.entries(items).map(([id, { name, ...rest }]) => ({ ...rest, id, title: name })),
 ]);
--- a/app/angular/.npmignore
+++ b/app/angular/.npmignore
@ -1,2 +0,0 @@
-docs
-.babelrc
--- a/app/angular/package.json
+++ b/app/angular/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/angular",
-  "version": "5.2.0-rc.2",
+  "version": "5.3.0-alpha.4",
  "description": "Storybook for Angular: Develop Angular Components in isolation with Hot Reloading.",
  "keywords": [
    "storybook"
@ -15,6 +15,14 @@
    "directory": "app/angular"
  },
  "license": "MIT",
+  "files": [
+    "bin/**/*",
+    "dist/**/*",
+    "README.md",
+    "standalone.js",
+    "demo.js",
+    "demo.d.ts"
+  ],
  "main": "dist/client/index.js",
  "types": "dist/client/index.d.ts",
  "bin": {
@ -26,21 +34,22 @@
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-rc.2",
-    "@storybook/core": "5.2.0-rc.2",
-    "@storybook/node-logger": "5.2.0-rc.2",
+    "@storybook/addons": "5.3.0-alpha.4",
+    "@storybook/core": "5.3.0-alpha.4",
+    "@storybook/node-logger": "5.3.0-alpha.4",
    "angular2-template-loader": "^0.6.2",
    "core-js": "^3.0.1",
    "fork-ts-checker-webpack-plugin": "^1.3.4",
    "global": "^4.3.2",
    "regenerator-runtime": "^0.12.1",
    "sass-loader": "^7.1.0",
+    "strip-json-comments": "^3.0.1",
    "ts-loader": "^6.0.1",
    "tsconfig-paths-webpack-plugin": "^3.2.0"
  },
  "devDependencies": {
    "@types/autoprefixer": "^9.4.0",
-    "@types/webpack-env": "^1.13.9",
+    "@types/webpack-env": "^1.14.0",
    "webpack": "^4.33.0"
  },
  "peerDependencies": {
@ -56,7 +65,7 @@
    "babel-loader": "^7.0.0 || ^8.0.0",
    "rxjs": "^6.0.0",
    "typescript": "^3.4.0",
-    "webpack": "^4.32.2",
+    "webpack": "^4.32.0",
    "zone.js": "^0.8.29 || ^0.9.0"
  },
  "engines": {
--- a/app/angular/src/server/tests/angular-cli_config.test.ts
+++ b/app/angular/src/server/tests/angular-cli_config.test.ts
@ -1,9 +1,7 @@
+import stripJsonComments from 'strip-json-comments';
 import { Path } from '@angular-devkit/core';
 import { getAngularCliWebpackConfigOptions } from '../angular-cli_config';

-// @ts-ignore
-import angularJson from './angular.json';
-
 // eslint-disable-next-line global-require
 jest.mock('fs', () => require('../../../../../__mocks__/fs'));
 jest.mock('path', () => ({
@ -14,15 +12,19 @@ jest.mock('path', () => ({
  resolve: (...args) => 'tsconfig.json',
 }));

+const angularJson = jest
+  .requireActual('fs')
+  .readFileSync(jest.requireActual('path').resolve(__dirname, 'angular.json'), 'utf8');
+
 const setupFiles = (files: any) => {
  // eslint-disable-next-line no-underscore-dangle, global-require
  require('fs').__setMockFiles(files);
 };

-describe('angualr-cli_config', () => {
+describe('angular-cli_config', () => {
  describe('getAngularCliWebpackConfigOptions()', () => {
    it('should return have empty `buildOptions.sourceMap` and `buildOptions.optimization` by default', () => {
-      setupFiles({ 'angular.json': JSON.stringify(angularJson) });
+      setupFiles({ 'angular.json': angularJson });

      const config = getAngularCliWebpackConfigOptions('/' as Path);

@ -36,7 +38,7 @@ describe('angualr-cli_config', () => {

    it('should use `storybook` project by default when project is defined', () => {
      // Lazy clone example angular json
-      const overrideAngularJson = JSON.parse(JSON.stringify(angularJson));
+      const overrideAngularJson = JSON.parse(stripJsonComments(angularJson));
      // Add storybook project
      overrideAngularJson.projects.storybook = {
        architect: {
--- a/app/angular/src/server/tests/angular.json
+++ b/app/angular/src/server/tests/angular.json
@ -1,4 +1,6 @@
 {
+  /* angular.json can have comments */
+  // angular.json can have comments
  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
  "version": 1,
  "newProjectRoot": "projects",
--- a/app/angular/src/server/angular-cli_config.ts
+++ b/app/angular/src/server/angular-cli_config.ts
@ -4,6 +4,7 @@ import path from 'path';
 import fs from 'fs';
 import { logger } from '@storybook/node-logger';
 import { TsconfigPathsPlugin } from 'tsconfig-paths-webpack-plugin';
+import stripJsonComments from 'strip-json-comments';
 import {
  isBuildAngularInstalled,
  normalizeAssetPatterns,
@ -33,7 +34,7 @@ function getTsConfigOptions(tsConfigPath: Path) {
    return basicOptions;
  }

-  const tsConfig = JSON.parse(fs.readFileSync(tsConfigPath, 'utf8'));
+  const tsConfig = JSON.parse(stripJsonComments(fs.readFileSync(tsConfigPath, 'utf8')));

  const { baseUrl } = tsConfig.compilerOptions as CompilerOptions;

@ -52,7 +53,7 @@ export function getAngularCliWebpackConfigOptions(dirToSearch: Path) {
    return null;
  }

-  const angularJson = JSON.parse(fs.readFileSync(fname, 'utf8'));
+  const angularJson = JSON.parse(stripJsonComments(fs.readFileSync(fname, 'utf8')));
  const { projects, defaultProject } = angularJson;

  if (!projects || !Object.keys(projects).length) {
--- a/app/angular/tsconfig.json
+++ b/app/angular/tsconfig.json
@ -3,7 +3,7 @@
  "compileOnSave": false,
  "compilerOptions": {
    "outDir": "dist",
-    "types": ["webpack-env"],
+    "types": [],
    "rootDir": "./src",
    "resolveJsonModule": true
  }
--- a/app/ember/package.json
+++ b/app/ember/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/ember",
-  "version": "5.2.0-rc.2",
+  "version": "5.3.0-alpha.4",
  "description": "Storybook for Ember: Develop Ember Component in isolation with Hot Reloading.",
  "homepage": "https://github.com/storybookjs/storybook/tree/master/app/ember",
  "bugs": {
@ -12,6 +12,12 @@
    "directory": "app/ember"
  },
  "license": "MIT",
+  "files": [
+    "bin/**/*",
+    "dist/**/*",
+    "README.md",
+    "standalone.js"
+  ],
  "main": "dist/client/index.js",
  "jsnext:main": "src/client/index.js",
  "bin": {
@ -24,7 +30,7 @@
  },
  "dependencies": {
    "@ember/test-helpers": "^1.5.0",
-    "@storybook/core": "5.2.0-rc.2",
+    "@storybook/core": "5.3.0-alpha.4",
    "common-tags": "^1.8.0",
    "core-js": "^3.0.1",
    "global": "^4.3.2",
--- a/app/html/.npmignore
+++ b/app/html/.npmignore
@ -1,3 +0,0 @@
-docs
-src
-.babelrc
--- a/app/html/package.json
+++ b/app/html/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/html",
-  "version": "5.2.0-rc.2",
+  "version": "5.3.0-alpha.4",
  "description": "Storybook for HTML: View HTML snippets in isolation with Hot Reloading.",
  "keywords": [
    "storybook"
@ -15,6 +15,12 @@
    "directory": "app/html"
  },
  "license": "MIT",
+  "files": [
+    "bin/**/*",
+    "dist/**/*",
+    "README.md",
+    "standalone.js"
+  ],
  "main": "dist/client/index.js",
  "types": "dist/client/index.d.ts",
  "bin": {
@ -26,8 +32,9 @@
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-rc.2",
-    "@storybook/core": "5.2.0-rc.2",
+    "@storybook/addons": "5.3.0-alpha.4",
+    "@storybook/core": "5.3.0-alpha.4",
+    "@types/webpack-env": "^1.13.9",
    "common-tags": "^1.8.0",
    "core-js": "^3.0.1",
    "global": "^4.3.2",
--- a/app/marko/.npmignore
+++ b/app/marko/.npmignore
@ -1,2 +0,0 @@
-docs
-.babelrc
--- a/app/marko/package.json
+++ b/app/marko/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/marko",
-  "version": "5.2.0-rc.2",
+  "version": "5.3.0-alpha.4",
  "description": "Storybook for Marko: Develop Marko Component in isolation with Hot Reloading.",
  "keywords": [
    "storybook"
@ -15,8 +15,13 @@
    "directory": "app/marko"
  },
  "license": "MIT",
+  "files": [
+    "bin/**/*",
+    "dist/**/*",
+    "README.md",
+    "standalone.js"
+  ],
  "main": "dist/client/index.js",
-  "jsnext:main": "src/client/index.js",
  "bin": {
    "build-storybook": "./bin/build.js",
    "start-storybook": "./bin/index.js",
@ -26,9 +31,9 @@
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@marko/webpack": "^1.2.0",
-    "@storybook/client-logger": "5.2.0-rc.2",
-    "@storybook/core": "5.2.0-rc.2",
+    "@marko/webpack": "^2.0.0",
+    "@storybook/client-logger": "5.3.0-alpha.4",
+    "@storybook/core": "5.3.0-alpha.4",
    "common-tags": "^1.8.0",
    "core-js": "^3.0.1",
    "global": "^4.3.2",
--- a/app/marko/src/server/framework-preset-marko.js
+++ b/app/marko/src/server/framework-preset-marko.js
@ -8,9 +8,6 @@ export function webpack(config) {
        {
          test: /\.marko$/,
          loader: require.resolve('@marko/webpack/loader'),
-          options: {
-            compiler: require.resolve('marko/compiler'),
-          },
        },
      ],
    },
--- a/app/mithril/.npmignore
+++ b/app/mithril/.npmignore
@ -1,2 +0,0 @@
-docs
-.babelrc
--- a/app/mithril/package.json
+++ b/app/mithril/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/mithril",
-  "version": "5.2.0-rc.2",
+  "version": "5.3.0-alpha.4",
  "description": "Storybook for Mithril: Develop Mithril Component in isolation.",
  "keywords": [
    "storybook"
@ -15,8 +15,13 @@
    "directory": "app/mithril"
  },
  "license": "MIT",
+  "files": [
+    "bin/**/*",
+    "dist/**/*",
+    "README.md",
+    "standalone.js"
+  ],
  "main": "dist/client/index.js",
-  "jsnext:main": "src/client/index.js",
  "bin": {
    "build-storybook": "./bin/build.js",
    "start-storybook": "./bin/index.js",
@ -27,7 +32,7 @@
  },
  "dependencies": {
    "@babel/plugin-transform-react-jsx": "^7.3.0",
-    "@storybook/core": "5.2.0-rc.2",
+    "@storybook/core": "5.3.0-alpha.4",
    "common-tags": "^1.8.0",
    "core-js": "^3.0.1",
    "global": "^4.3.2",
--- a/app/polymer/.npmignore
+++ b/app/polymer/.npmignore
@ -1,3 +0,0 @@
-docs
-src
-.babelrc
--- a/app/polymer/package.json
+++ b/app/polymer/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/polymer",
-  "version": "5.2.0-rc.2",
+  "version": "5.3.0-alpha.4",
  "description": "Storybook for Polymer: Develop Polymer components in isolation with Hot Reloading.",
  "keywords": [
    "storybook"
@ -15,6 +15,12 @@
    "directory": "app/polymer"
  },
  "license": "MIT",
+  "files": [
+    "bin/**/*",
+    "dist/**/*",
+    "README.md",
+    "standalone.js"
+  ],
  "main": "dist/client/index.js",
  "bin": {
    "build-storybook": "./bin/build.js",
@ -25,7 +31,7 @@
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/core": "5.2.0-rc.2",
+    "@storybook/core": "5.3.0-alpha.4",
    "@webcomponents/webcomponentsjs": "^1.2.0",
    "common-tags": "^1.8.0",
    "core-js": "^3.0.1",
--- a/app/preact/.npmignore
+++ b/app/preact/.npmignore
@ -1,2 +0,0 @@
-docs
-.babelrc
--- a/app/preact/package.json
+++ b/app/preact/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/preact",
-  "version": "5.2.0-rc.2",
+  "version": "5.3.0-alpha.4",
  "description": "Storybook for Preact: Develop Preact Component in isolation.",
  "keywords": [
    "storybook"
@ -15,6 +15,12 @@
    "directory": "app/preact"
  },
  "license": "MIT",
+  "files": [
+    "bin/**/*",
+    "dist/**/*",
+    "README.md",
+    "standalone.js"
+  ],
  "main": "dist/client/index.js",
  "types": "dist/client/index.d.ts",
  "bin": {
@ -27,8 +33,9 @@
  },
  "dependencies": {
    "@babel/plugin-transform-react-jsx": "^7.3.0",
-    "@storybook/addons": "5.2.0-rc.2",
-    "@storybook/core": "5.2.0-rc.2",
+    "@storybook/addons": "5.3.0-alpha.4",
+    "@storybook/core": "5.3.0-alpha.4",
+    "@types/webpack-env": "^1.13.9",
    "common-tags": "^1.8.0",
    "core-js": "^3.0.1",
    "global": "^4.3.2",
--- a/app/preact/src/client/preview/types.ts
+++ b/app/preact/src/client/preview/types.ts
@ -1,6 +1,6 @@
 import { StoryFn, ClientStoryApi, Loadable } from '@storybook/addons';

-export type StoryFnPreactReturnType = string | Node;
+export type StoryFnPreactReturnType = string | Node | JSX.Element;

 export interface ShowErrorArgs {
  title: string;
--- a/app/rax/.npmignore
+++ b/app/rax/.npmignore
@ -1,2 +0,0 @@
-docs
-.babelrc
--- a/app/rax/package.json
+++ b/app/rax/package.json
@ -1,10 +1,10 @@
 {
  "name": "@storybook/rax",
-  "version": "5.2.0-rc.2",
+  "version": "5.3.0-alpha.4",
  "description": "Storybook for Rax: Develop Rax Component in isolation.",
  "keywords": [
-    "storybook",
-    "rax"
+    "rax",
+    "storybook"
  ],
  "homepage": "https://github.com/storybookjs/storybook/tree/master/app/rax",
  "bugs": {
@ -16,8 +16,13 @@
    "directory": "app/rax"
  },
  "license": "MIT",
+  "files": [
+    "bin/**/*",
+    "dist/**/*",
+    "README.md",
+    "standalone.js"
+  ],
  "main": "dist/client/index.js",
-  "jsnext:main": "src/client/index.js",
  "bin": {
    "build-storybook": "./bin/build.js",
    "start-storybook": "./bin/index.js",
@ -27,15 +32,16 @@
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/core": "5.2.0-rc.2",
+    "@storybook/core": "5.3.0-alpha.4",
    "babel-preset-rax": "^1.0.0-beta.0",
    "common-tags": "^1.8.0",
-    "core-js": "^2.6.2",
+    "core-js": "^3.0.1",
+    "driver-dom": "^2.0.0",
    "global": "^4.3.2",
    "regenerator-runtime": "^0.12.1"
  },
  "devDependencies": {
-    "rax": "^0.6.5"
+    "rax": "^1.0.0"
  },
  "peerDependencies": {
    "babel-loader": "^7.0.0 || ^8.0.0",
--- a/app/rax/src/client/preview/render.js
+++ b/app/rax/src/client/preview/render.js
@ -1,4 +1,6 @@
 import { createElement, render } from 'rax';
+import * as DriverDOM from 'driver-dom';
+
 import { document } from 'global';
 import { stripIndents } from 'common-tags';

@ -12,9 +14,9 @@ export default function renderMain({
  showError,
  // forceRender,
 }) {
-  const element = storyFn();
+  const Element = storyFn;

-  if (!element) {
+  if (!Element) {
    showError({
      title: `Expecting a Rax element from the story: "${selectedStory}" of "${selectedKind}".`,
      description: stripIndents`
@ -27,5 +29,7 @@ export default function renderMain({

  showMain();

-  render(element, rootElement);
+  render(createElement(Element), rootElement, {
+    driver: DriverDOM,
+  });
 }
--- a/app/react-native-server/.npmignore
+++ b/app/react-native-server/.npmignore
@ -1,2 +0,0 @@
-docs
-.babelrc
--- a/app/react-native-server/package.json
+++ b/app/react-native-server/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/react-native-server",
-  "version": "5.2.0-rc.2",
+  "version": "5.3.0-alpha.4",
  "description": "A better way to develop React Native Components for your app",
  "keywords": [
    "react",
@ -16,6 +16,11 @@
    "url": "https://github.com/storybookjs/storybook.git"
  },
  "license": "MIT",
+  "files": [
+    "bin/**/*",
+    "dist/**/*",
+    "README.md"
+  ],
  "bin": {
    "start-storybook": "./bin/index.js",
    "storybook-server": "./bin/index.js"
@ -24,12 +29,12 @@
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-rc.2",
-    "@storybook/api": "5.2.0-rc.2",
-    "@storybook/channel-websocket": "5.2.0-rc.2",
-    "@storybook/core": "5.2.0-rc.2",
-    "@storybook/core-events": "5.2.0-rc.2",
-    "@storybook/ui": "5.2.0-rc.2",
+    "@storybook/addons": "5.3.0-alpha.4",
+    "@storybook/api": "5.3.0-alpha.4",
+    "@storybook/channel-websocket": "5.3.0-alpha.4",
+    "@storybook/core": "5.3.0-alpha.4",
+    "@storybook/core-events": "5.3.0-alpha.4",
+    "@storybook/ui": "5.3.0-alpha.4",
    "commander": "^2.19.0",
    "core-js": "^3.0.1",
    "global": "^4.3.2",
--- a/Show More
+++ b/Show More