Merge branch 'next' of github.com:storybooks/storybook into next

2025-04-02 05:03:44 +08:00 · 2019-07-19 14:06:02 +02:00 · 2019-07-19 14:06:02 +02:00 · da29a967b9
commit da29a967b9
parent df2949e8da 7517df6c35
153 changed files with 2480 additions and 1587 deletions
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@ -1,3 +1,31 @@
+## 5.2.0-beta.2 (July 18, 2019)
+
+### Features
+
+* CLI: convert mdx to module format ([#7419](https://github.com/storybookjs/storybook/pull/7419))
+* CLI: sb migrate npm & typescript support ([#7463](https://github.com/storybookjs/storybook/pull/7463))
+* Addon-Docs: HTML support & example ([#7454](https://github.com/storybookjs/storybook/pull/7454))
+
+### Bug Fixes
+
+* Convert-storiesof-to-module: user exports, collisions, reserved keywords ([#7471](https://github.com/storybookjs/storybook/pull/7471))
+* React-native: On-device knobs fixes ([#7470](https://github.com/storybookjs/storybook/pull/7470))
+
+### Dependency Upgrades
+
+* Addon-docs: Upgrade MDX to 1.1 ([#7476](https://github.com/storybookjs/storybook/pull/7476))
+
+## 5.2.0-beta.1 (July 18, 2019)
+
+### Features
+
+* React native: Emit event when story is rendered ([#7449](https://github.com/storybookjs/storybook/pull/7449))
+
+### Bug Fixes
+
+* Addon-knobs: improve types via generics and readonlyarray ([#7411](https://github.com/storybookjs/storybook/pull/7411))
+* Ondevice-backgrounds: use same param key as addon-backgrounds ([#7437](https://github.com/storybookjs/storybook/pull/7437))
+
 ## 5.2.0-beta.0 (July 15, 2019)

 ### Features
--- a/addons/a11y/package.json
+++ b/addons/a11y/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/addon-a11y",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "description": "a11y addon for storybook",
  "keywords": [
    "a11y",
@ -26,12 +26,12 @@
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-beta.0",
-    "@storybook/api": "5.2.0-beta.0",
-    "@storybook/client-logger": "5.2.0-beta.0",
-    "@storybook/components": "5.2.0-beta.0",
-    "@storybook/core-events": "5.2.0-beta.0",
-    "@storybook/theming": "5.2.0-beta.0",
+    "@storybook/addons": "5.2.0-beta.2",
+    "@storybook/api": "5.2.0-beta.2",
+    "@storybook/client-logger": "5.2.0-beta.2",
+    "@storybook/components": "5.2.0-beta.2",
+    "@storybook/core-events": "5.2.0-beta.2",
+    "@storybook/theming": "5.2.0-beta.2",
    "axe-core": "^3.2.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-beta.0",
+  "version": "5.2.0-beta.2",
  "description": "Action Logger addon for storybook",
  "keywords": [
    "storybook"
@ -21,12 +21,12 @@
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-beta.0",
-    "@storybook/api": "5.2.0-beta.0",
-    "@storybook/client-api": "5.2.0-beta.0",
-    "@storybook/components": "5.2.0-beta.0",
-    "@storybook/core-events": "5.2.0-beta.0",
-    "@storybook/theming": "5.2.0-beta.0",
+    "@storybook/addons": "5.2.0-beta.2",
+    "@storybook/api": "5.2.0-beta.2",
+    "@storybook/client-api": "5.2.0-beta.2",
+    "@storybook/components": "5.2.0-beta.2",
+    "@storybook/core-events": "5.2.0-beta.2",
+    "@storybook/theming": "5.2.0-beta.2",
    "core-js": "^3.0.1",
    "fast-deep-equal": "^2.0.1",
    "global": "^4.3.2",
--- a/addons/backgrounds/package.json
+++ b/addons/backgrounds/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/addon-backgrounds",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "description": "A storybook addon to show different backgrounds for your preview",
  "keywords": [
    "addon",
@ -25,12 +25,12 @@
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-beta.0",
-    "@storybook/api": "5.2.0-beta.0",
-    "@storybook/client-logger": "5.2.0-beta.0",
-    "@storybook/components": "5.2.0-beta.0",
-    "@storybook/core-events": "5.2.0-beta.0",
-    "@storybook/theming": "5.2.0-beta.0",
+    "@storybook/addons": "5.2.0-beta.2",
+    "@storybook/api": "5.2.0-beta.2",
+    "@storybook/client-logger": "5.2.0-beta.2",
+    "@storybook/components": "5.2.0-beta.2",
+    "@storybook/core-events": "5.2.0-beta.2",
+    "@storybook/theming": "5.2.0-beta.2",
    "core-js": "^3.0.1",
    "memoizerific": "^1.11.3",
    "react": "^16.8.3",
--- a/addons/centered/package.json
+++ b/addons/centered/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/addon-centered",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "description": "Storybook decorator to center components",
  "keywords": [
    "addon",
@ -23,7 +23,7 @@
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-beta.0",
+    "@storybook/addons": "5.2.0-beta.2",
    "core-js": "^3.0.1",
    "global": "^4.3.2",
    "util-deprecate": "^1.0.2"
--- a/addons/contexts/package.json
+++ b/addons/contexts/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/addon-contexts",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "description": "Storybook Addon Contexts",
  "keywords": [
    "storybook",
@ -28,10 +28,10 @@
    "dev:check-types": "tsc --noEmit"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-beta.0",
-    "@storybook/api": "5.2.0-beta.0",
-    "@storybook/components": "5.2.0-beta.0",
-    "@storybook/core-events": "5.2.0-beta.0",
+    "@storybook/addons": "5.2.0-beta.2",
+    "@storybook/api": "5.2.0-beta.2",
+    "@storybook/components": "5.2.0-beta.2",
+    "@storybook/core-events": "5.2.0-beta.2",
    "core-js": "^3.0.1"
  },
  "peerDependencies": {
--- a/addons/cssresources/package.json
+++ b/addons/cssresources/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/addon-cssresources",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "description": "A storybook addon to switch between css resources at runtime for your story",
  "keywords": [
    "addon",
@ -25,10 +25,10 @@
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-beta.0",
-    "@storybook/api": "5.2.0-beta.0",
-    "@storybook/components": "5.2.0-beta.0",
-    "@storybook/core-events": "5.2.0-beta.0",
+    "@storybook/addons": "5.2.0-beta.2",
+    "@storybook/api": "5.2.0-beta.2",
+    "@storybook/components": "5.2.0-beta.2",
+    "@storybook/core-events": "5.2.0-beta.2",
    "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,6 +1,6 @@
 {
  "name": "@storybook/addon-design-assets",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "description": "Design asset preview for storybook",
  "keywords": [
    "addon",
@ -27,12 +27,12 @@
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-beta.0",
-    "@storybook/api": "5.2.0-beta.0",
-    "@storybook/client-logger": "5.2.0-beta.0",
-    "@storybook/components": "5.2.0-beta.0",
-    "@storybook/core-events": "5.2.0-beta.0",
-    "@storybook/theming": "5.2.0-beta.0",
+    "@storybook/addons": "5.2.0-beta.2",
+    "@storybook/api": "5.2.0-beta.2",
+    "@storybook/client-logger": "5.2.0-beta.2",
+    "@storybook/components": "5.2.0-beta.2",
+    "@storybook/core-events": "5.2.0-beta.2",
+    "@storybook/theming": "5.2.0-beta.2",
    "common-tags": "^1.8.0",
    "core-js": "^3.0.1",
    "global": "^4.3.2",
--- a/addons/docs/html/index.js
+++ b/addons/docs/html/index.js
@ -0,0 +1 @@
+module.exports = require('../common/index');
--- a/addons/docs/html/preset.js
+++ b/addons/docs/html/preset.js
@ -0,0 +1 @@
+module.exports = require('../common/preset');
--- a/addons/docs/mdx-compiler-plugin.test.js
+++ b/addons/docs/mdx-compiler-plugin.test.js
@ -4,7 +4,14 @@ const mdx = require('@mdx-js/mdx');
 const prettier = require('prettier');
 const plugin = require('./mdx-compiler-plugin');

-function format(code) {
+async function generate(filePath) {
+  const content = await fs.readFile(filePath, 'utf8');
+
+  const code = mdx.sync(content, {
+    filepath: filePath,
+    compilers: [plugin({})],
+  });
+
  return prettier.format(code, {
    parser: 'babel',
    printWidth: 100,
@ -15,17 +22,6 @@ function format(code) {
  });
 }

-async function generate(filePath) {
-  const content = await fs.readFile(filePath, 'utf8');
-
-  const result = mdx.sync(content, {
-    filepath: filePath,
-    compilers: [plugin({})],
-  });
-
-  return format(result);
-}
-
 describe('docs-mdx-compiler-plugin', () => {
  it('supports vanilla mdx', async () => {
    const code = await generate(path.resolve(__dirname, './fixtures/vanilla.mdx'));
--- a/addons/docs/package.json
+++ b/addons/docs/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/addon-docs",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "description": "Superior documentation for your components",
  "keywords": [
    "addon",
@ -25,14 +25,14 @@
  "dependencies": {
    "@babel/generator": "^7.4.0",
    "@babel/parser": "^7.4.2",
-    "@mdx-js/loader": "^1.0.0",
-    "@mdx-js/mdx": "^1.0.0",
-    "@mdx-js/react": "^1.0.16",
-    "@storybook/addons": "5.2.0-beta.0",
-    "@storybook/api": "5.2.0-beta.0",
-    "@storybook/components": "5.2.0-beta.0",
-    "@storybook/router": "5.2.0-beta.0",
-    "@storybook/theming": "5.2.0-beta.0",
+    "@mdx-js/loader": "^1.1.0",
+    "@mdx-js/mdx": "^1.1.0",
+    "@mdx-js/react": "^1.0.27",
+    "@storybook/addons": "5.2.0-beta.2",
+    "@storybook/api": "5.2.0-beta.2",
+    "@storybook/components": "5.2.0-beta.2",
+    "@storybook/router": "5.2.0-beta.2",
+    "@storybook/theming": "5.2.0-beta.2",
    "core-js": "^3.0.1",
    "global": "^4.3.2",
    "lodash": "^4.17.11",
--- a/addons/events/package.json
+++ b/addons/events/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/addon-events",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "description": "Add events to your Storybook stories.",
  "keywords": [
    "addon",
@ -24,11 +24,11 @@
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-beta.0",
-    "@storybook/api": "5.2.0-beta.0",
-    "@storybook/client-api": "5.2.0-beta.0",
-    "@storybook/core-events": "5.2.0-beta.0",
-    "@storybook/theming": "5.2.0-beta.0",
+    "@storybook/addons": "5.2.0-beta.2",
+    "@storybook/api": "5.2.0-beta.2",
+    "@storybook/client-api": "5.2.0-beta.2",
+    "@storybook/core-events": "5.2.0-beta.2",
+    "@storybook/theming": "5.2.0-beta.2",
    "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-beta.0",
+  "version": "5.2.0-beta.2",
  "description": "Storybook addon for google analytics",
  "keywords": [
    "addon",
@ -20,8 +20,8 @@
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-beta.0",
-    "@storybook/core-events": "5.2.0-beta.0",
+    "@storybook/addons": "5.2.0-beta.2",
+    "@storybook/core-events": "5.2.0-beta.2",
    "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-beta.0",
+  "version": "5.2.0-beta.2",
  "description": "Storybook addon to display the GraphiQL IDE",
  "keywords": [
    "addon",
@ -22,8 +22,8 @@
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-beta.0",
-    "@storybook/api": "5.2.0-beta.0",
+    "@storybook/addons": "5.2.0-beta.2",
+    "@storybook/api": "5.2.0-beta.2",
    "core-js": "^3.0.1",
    "global": "^4.3.2",
    "graphiql": "^0.13.0",
--- a/addons/info/package.json
+++ b/addons/info/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/addon-info",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "description": "A Storybook addon to show additional information for your stories.",
  "keywords": [
    "addon",
@ -22,10 +22,10 @@
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-beta.0",
-    "@storybook/client-logger": "5.2.0-beta.0",
-    "@storybook/components": "5.2.0-beta.0",
-    "@storybook/theming": "5.2.0-beta.0",
+    "@storybook/addons": "5.2.0-beta.2",
+    "@storybook/client-logger": "5.2.0-beta.2",
+    "@storybook/components": "5.2.0-beta.2",
+    "@storybook/theming": "5.2.0-beta.2",
    "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-beta.0",
+  "version": "5.2.0-beta.2",
  "description": "React storybook addon that show component jest report",
  "keywords": [
    "addon",
@ -28,11 +28,11 @@
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-beta.0",
-    "@storybook/api": "5.2.0-beta.0",
-    "@storybook/components": "5.2.0-beta.0",
-    "@storybook/core-events": "5.2.0-beta.0",
-    "@storybook/theming": "5.2.0-beta.0",
+    "@storybook/addons": "5.2.0-beta.2",
+    "@storybook/api": "5.2.0-beta.2",
+    "@storybook/components": "5.2.0-beta.2",
+    "@storybook/core-events": "5.2.0-beta.2",
+    "@storybook/theming": "5.2.0-beta.2",
    "core-js": "^3.0.1",
    "global": "^4.3.2",
    "react": "^16.8.3",
--- a/addons/knobs/package.json
+++ b/addons/knobs/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/addon-knobs",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "description": "Storybook Addon Prop Editor Component",
  "keywords": [
    "addon",
@ -22,11 +22,11 @@
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-beta.0",
-    "@storybook/client-api": "5.2.0-beta.0",
-    "@storybook/components": "5.2.0-beta.0",
-    "@storybook/core-events": "5.2.0-beta.0",
-    "@storybook/theming": "5.2.0-beta.0",
+    "@storybook/addons": "5.2.0-beta.2",
+    "@storybook/client-api": "5.2.0-beta.2",
+    "@storybook/components": "5.2.0-beta.2",
+    "@storybook/core-events": "5.2.0-beta.2",
+    "@storybook/theming": "5.2.0-beta.2",
    "copy-to-clipboard": "^3.0.8",
    "core-js": "^3.0.1",
    "escape-html": "^1.0.3",
--- a/addons/knobs/src/KnobManager.ts
+++ b/addons/knobs/src/KnobManager.ts
@ -7,7 +7,7 @@ import { getQueryParams } from '@storybook/client-api';
 import { Channel } from '@storybook/channels';

 import KnobStore, { KnobStoreKnob } from './KnobStore';
-import { Knob, KnobType } from './type-defs';
+import { Knob, KnobType, Mutable } from './type-defs';
 import { SET } from './shared';

 import { deserializers } from './converters';
@ -72,7 +72,7 @@ export default class KnobManager {
    return this.options.escapeHTML ? escapeStrings(value) : value;
  }

-  knob<T extends KnobType = any>(name: string, options: Knob<T>): Knob<T>['value'] {
+  knob<T extends KnobType = any>(name: string, options: Knob<T>): Mutable<Knob<T>['value']> {
    this._mayCallChannel();

    const knobName = options.groupId ? `${name}_${options.groupId}` : name;
--- a/addons/knobs/src/types/knob-test-cases.ts
+++ b/addons/knobs/src/types/knob-test-cases.ts
@ -0,0 +1,204 @@
+import {
+  number,
+  color,
+  files,
+  object,
+  boolean,
+  text,
+  select,
+  date,
+  array,
+  button,
+  knob,
+  radios,
+  optionsKnob as options,
+} from '../index';
+
+// Note: this is a helper to batch test return types and avoid "declared but never read" errors
+function expectKnobOfType<T>(..._: T[]) {}
+
+const groupId = 'GROUP-ID1';
+
+/** Text knob */
+
+expectKnobOfType<string>(
+  text('text simple', 'Batman'),
+  text('text with group', 'default', groupId)
+);
+
+/** Date knob */
+
+expectKnobOfType<number>(
+  date('date simple', new Date('January 20 1887')),
+  date('date with group', new Date(), groupId)
+);
+
+/** Boolean knob */
+
+expectKnobOfType<boolean>(
+  boolean('boolean simple', false),
+  boolean('boolean with group', true, groupId)
+);
+
+/** Color knob */
+
+expectKnobOfType<string>(
+  color('color simple', 'black'),
+  color('color with group', '#ffffff', groupId)
+);
+
+/** Number knob */
+
+expectKnobOfType<number>(
+  number('number basic', 42),
+  number('number with options', 72, { range: true, min: 60, max: 90, step: 1 }),
+  number('number with group', 1, {}, groupId)
+);
+
+/** Radios knob */
+
+expectKnobOfType(
+  radios<string>(
+    'radio with string values',
+    {
+      1100: '1100',
+      2200: '2200',
+      3300: '3300',
+    },
+    '2200'
+  ),
+  radios<number>('radio with number values', { 3: 3, 7: 7, 23: 23 }, 3),
+  radios(
+    'radio with mixed value',
+    {
+      1100: '1100',
+      2200: 2200,
+      3300: '3300',
+    },
+    null,
+    groupId
+  )
+);
+
+/** Select knob */
+
+enum SomeEnum {
+  Type1 = 1,
+  Type2,
+}
+enum ButtonVariant {
+  primary = 'primary',
+  secondary = 'secondary',
+}
+const stringLiteralArray: ('Apple' | 'Banana' | 'Grapes')[] = ['Apple', 'Banana', 'Grapes'];
+
+expectKnobOfType<string>(
+  select(
+    'select with string options',
+    {
+      None: 'none',
+      Underline: 'underline',
+      'Line-through': 'line-through',
+    },
+    'none'
+  ),
+  select('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),
+  select('select with null option', { a: 'Option', b: null }, null, groupId)
+);
+
+expectKnobOfType<number>(
+  select('select with number options', { 'type a': 1, 'type b': 2 }, 1),
+  select<SomeEnum>(
+    'select with numeric enum options',
+    { 'type a': SomeEnum.Type1, 'type b': SomeEnum.Type2 },
+    SomeEnum.Type2
+  ),
+  select('select with number array', [1, 2, 3, 4], 1),
+  select('select with readonly number array', [1, 2] as const, 1)
+);
+
+/** Object knob */
+
+expectKnobOfType(
+  object('object simple', {
+    fontFamily: 'Arial',
+    padding: 20,
+  }),
+  object('object with group', {}, groupId)
+);
+
+/** Options knob */
+
+type Tool = 'hammer' | 'saw' | 'drill';
+const visibleToolOptions: Record<string, Tool> = {
+  hammer: 'hammer',
+  saw: 'saw',
+  drill: 'drill',
+};
+
+expectKnobOfType(
+  options<Tool>('options with single selection', visibleToolOptions, 'hammer', {
+    display: 'check',
+  }),
+  options<Tool>('options with multi selection', visibleToolOptions, ['hammer', 'saw'], {
+    display: 'inline-check',
+  }),
+  options<Tool>('options with readonly multi selection', visibleToolOptions, ['hammer'] as const, {
+    display: 'radio',
+  }),
+  options('options with group', {}, '', { display: 'check' })
+);
+
+/** Array knob */
+
+const arrayReadonly = array('array as readonly', ['hi', 'there'] as const);
+
+expectKnobOfType<string[]>(
+  array('array simple', ['red', 'green', 'blue']),
+  arrayReadonly,
+  array('array with group', [], ',', groupId)
+);
+
+// Should return a mutable array despite the readonly input
+arrayReadonly.push('Make sure that the output is still mutable although the input need not be!');
+
+/** Button knob */
+
+expectKnobOfType(
+  button('button simple', () => {}),
+  button('button with group', () => undefined, groupId)
+);
+
+/** Files knob */
+
+expectKnobOfType<string[]>(
+  files('files simple', 'image/*', []),
+  files('files with group', 'image/*', ['img.jpg'], groupId)
+);
+
+/** Generic knob */
+
+expectKnobOfType<string>(
+  knob('generic knob as text', { type: 'text', value: 'a' }),
+  knob('generic knob as color', { type: 'color', value: 'black' }),
+  knob<'select', string>('generic knob as string select', {
+    type: 'select',
+    value: 'yes',
+    options: ['yes', 'no'],
+    selectV2: true,
+  })
+);
+
+expectKnobOfType<number>(
+  knob('generic knob as number', { type: 'number', value: 42 }),
+  knob('generic knob as select', { type: 'radios', value: 3, options: { 3: 3, 7: 7, 23: 23 } }),
+  knob('generic knob as number select', {
+    type: 'select',
+    value: 1,
+    options: [1, 2],
+    selectV2: true,
+  })
+);
--- a/addons/knobs/src/components/types/Array.tsx
+++ b/addons/knobs/src/components/types/Array.tsx
@ -2,18 +2,16 @@ import PropTypes from 'prop-types';
 import React, { ChangeEvent, Component, WeakValidationMap } from 'react';

 import { Form } from '@storybook/components';
+import { KnobControlConfig, KnobControlProps } from './types';

-type ArrayTypeKnobValue = string[];
+export type ArrayTypeKnobValue = string[] | readonly string[];

-export interface ArrayTypeKnob {
-  name: string;
-  value: ArrayTypeKnobValue;
+export interface ArrayTypeKnob extends KnobControlConfig<ArrayTypeKnobValue> {
  separator: string;
 }

-interface ArrayTypeProps {
+interface ArrayTypeProps extends KnobControlProps<ArrayTypeKnobValue> {
  knob: ArrayTypeKnob;
-  onChange: (value: ArrayTypeKnobValue) => ArrayTypeKnobValue;
 }

 function formatArray(value: string, separator: string) {
@ -41,7 +39,7 @@ export default class ArrayType extends Component<ArrayTypeProps> {

  static serialize = (value: ArrayTypeKnobValue) => value;

-  static deserialize = (value: ArrayTypeKnobValue) => {
+  static deserialize = (value: string[]) => {
    if (Array.isArray(value)) return value;

    return Object.keys(value)
--- a/addons/knobs/src/components/types/Boolean.tsx
+++ b/addons/knobs/src/components/types/Boolean.tsx
@ -2,18 +2,14 @@ import PropTypes from 'prop-types';
 import React, { FunctionComponent } from 'react';

 import { styled } from '@storybook/theming';
+import { KnobControlConfig, KnobControlProps } from './types';

 type BooleanTypeKnobValue = boolean;

-export interface BooleanTypeKnob {
-  name: string;
-  value: BooleanTypeKnobValue;
-  separator: string;
-}
+export type BooleanTypeKnob = KnobControlConfig<BooleanTypeKnobValue>;

-export interface BooleanTypeProps {
+export interface BooleanTypeProps extends KnobControlProps<BooleanTypeKnobValue> {
  knob: BooleanTypeKnob;
-  onChange: (value: BooleanTypeKnobValue) => BooleanTypeKnobValue;
 }

 const Input = styled.input({
--- a/addons/knobs/src/components/types/Button.tsx
+++ b/addons/knobs/src/components/types/Button.tsx
@ -2,19 +2,17 @@ import PropTypes from 'prop-types';
 import React, { FunctionComponent, Validator } from 'react';

 import { Form } from '@storybook/components';
+import { KnobControlConfig, KnobControlProps } from './types';

-export interface ButtonTypeKnob {
-  name: string;
-  value: unknown;
-}
+export type ButtonTypeKnob = KnobControlConfig<never>;

-export type ButtonTypeOnClickProp = (knob: ButtonTypeKnob) => any;
-
-export interface ButtonTypeProps {
+export interface ButtonTypeProps extends KnobControlProps<never> {
  knob: ButtonTypeKnob;
  onClick: ButtonTypeOnClickProp;
 }

+export type ButtonTypeOnClickProp = (knob: ButtonTypeKnob) => any;
+
 const serialize = (): undefined => undefined;
 const deserialize = (): undefined => undefined;

--- a/addons/knobs/src/components/types/Checkboxes.tsx
+++ b/addons/knobs/src/components/types/Checkboxes.tsx
@ -1,32 +1,28 @@
 import React, { Component, ChangeEvent, WeakValidationMap } from 'react';
 import PropTypes from 'prop-types';
 import { styled } from '@storybook/theming';
+import { KnobControlConfig, KnobControlProps } from './types';

 type CheckboxesTypeKnobValue = string[];

-interface CheckboxesWrapperProps {
-  isInline: boolean;
+export interface CheckboxesTypeKnob extends KnobControlConfig<CheckboxesTypeKnobValue> {
+  options: Record<string, string>;
 }

-export interface CheckboxesTypeKnob {
-  name: string;
-  value: CheckboxesTypeKnobValue;
-  defaultValue: CheckboxesTypeKnobValue;
-  options: {
-    [key: string]: string;
-  };
-}
-
-interface CheckboxesTypeProps {
+interface CheckboxesTypeProps
+  extends KnobControlProps<CheckboxesTypeKnobValue>,
+    CheckboxesWrapperProps {
  knob: CheckboxesTypeKnob;
-  isInline: boolean;
-  onChange: (value: CheckboxesTypeKnobValue) => CheckboxesTypeKnobValue;
 }

 interface CheckboxesTypeState {
  values: CheckboxesTypeKnobValue;
 }

+interface CheckboxesWrapperProps {
+  isInline: boolean;
+}
+
 const CheckboxesWrapper = styled.div(({ isInline }: CheckboxesWrapperProps) =>
  isInline
    ? {
--- a/addons/knobs/src/components/types/Color.tsx
+++ b/addons/knobs/src/components/types/Color.tsx
@ -5,18 +5,11 @@ import { SketchPicker, ColorResult } from 'react-color';

 import { styled } from '@storybook/theming';
 import { Form } from '@storybook/components';
+import { KnobControlConfig, KnobControlProps } from './types';

 type ColorTypeKnobValue = string;
-
-export interface ColorTypeKnob {
-  name: string;
-  value: ColorTypeKnobValue;
-}
-
-interface ColorTypeProps {
-  knob: ColorTypeKnob;
-  onChange: (value: ColorTypeKnobValue) => ColorTypeKnobValue;
-}
+export type ColorTypeKnob = KnobControlConfig<ColorTypeKnobValue>;
+type ColorTypeProps = KnobControlProps<ColorTypeKnobValue>;

 interface ColorTypeState {
  displayColorPicker: boolean;
--- a/addons/knobs/src/components/types/Date.tsx
+++ b/addons/knobs/src/components/types/Date.tsx
@ -2,18 +2,11 @@ import React, { Component, ChangeEvent, WeakValidationMap } from 'react';
 import PropTypes from 'prop-types';
 import { styled } from '@storybook/theming';
 import { Form } from '@storybook/components';
+import { KnobControlConfig, KnobControlProps } from './types';

 type DateTypeKnobValue = number;
-
-export interface DateTypeKnob {
-  name: string;
-  value: DateTypeKnobValue;
-}
-
-interface DateTypeProps {
-  knob: DateTypeKnob;
-  onChange: (value: DateTypeKnobValue) => DateTypeKnobValue;
-}
+export type DateTypeKnob = KnobControlConfig<DateTypeKnobValue>;
+type DateTypeProps = KnobControlProps<DateTypeKnobValue>;

 interface DateTypeState {
  valid: boolean | undefined;
--- a/addons/knobs/src/components/types/Files.tsx
+++ b/addons/knobs/src/components/types/Files.tsx
@ -4,18 +4,16 @@ import React, { ChangeEvent, FunctionComponent } from 'react';
 import { styled } from '@storybook/theming';

 import { Form } from '@storybook/components';
+import { KnobControlConfig, KnobControlProps } from './types';

 type DateTypeKnobValue = string[];

-export interface FileTypeKnob {
-  name: string;
+export interface FileTypeKnob extends KnobControlConfig<DateTypeKnobValue> {
  accept: string;
-  value: DateTypeKnobValue;
 }

-export interface FilesTypeProps {
+export interface FilesTypeProps extends KnobControlProps<DateTypeKnobValue> {
  knob: FileTypeKnob;
-  onChange: (value: DateTypeKnobValue) => DateTypeKnobValue;
 }

 const FileInput = styled(Form.Input)({
--- a/addons/knobs/src/components/types/Number.tsx
+++ b/addons/knobs/src/components/types/Number.tsx
@ -3,6 +3,7 @@ import React, { Component, ChangeEvent } from 'react';

 import { styled } from '@storybook/theming';
 import { Form } from '@storybook/components';
+import { KnobControlConfig, KnobControlProps } from './types';

 type NumberTypeKnobValue = number;

@ -13,14 +14,14 @@ export interface NumberTypeKnobOptions {
  step?: number;
 }

-export interface NumberTypeKnob extends NumberTypeKnobOptions {
-  name: string;
-  value: number;
+export interface NumberTypeKnob
+  extends KnobControlConfig<NumberTypeKnobValue>,
+    NumberTypeKnobOptions {
+  value: NumberTypeKnobValue;
 }

-interface NumberTypeProps {
+interface NumberTypeProps extends KnobControlProps<NumberTypeKnobValue> {
  knob: NumberTypeKnob;
-  onChange: (value: NumberTypeKnobValue) => NumberTypeKnobValue;
 }

 const RangeInput = styled.input(
--- a/addons/knobs/src/components/types/Object.tsx
+++ b/addons/knobs/src/components/types/Object.tsx
@ -3,16 +3,10 @@ import PropTypes from 'prop-types';
 import deepEqual from 'fast-deep-equal';
 import { polyfill } from 'react-lifecycles-compat';
 import { Form } from '@storybook/components';
+import { KnobControlConfig, KnobControlProps } from './types';

-export interface ObjectTypeKnob<T> {
-  name: string;
-  value: T;
-}
-
-interface ObjectTypeProps<T> {
-  knob: ObjectTypeKnob<T>;
-  onChange: (value: T) => T;
-}
+export type ObjectTypeKnob<T> = KnobControlConfig<T>;
+type ObjectTypeProps<T> = KnobControlProps<T>;

 interface ObjectTypeState<T> {
  value: string;
--- a/addons/knobs/src/components/types/Options.tsx
+++ b/addons/knobs/src/components/types/Options.tsx
@ -3,12 +3,19 @@ import PropTypes from 'prop-types';
 import ReactSelect from 'react-select';
 import { ValueType } from 'react-select/lib/types';
 import { styled } from '@storybook/theming';
+import { KnobControlConfig, KnobControlProps } from './types';

 import RadiosType from './Radio';
 import CheckboxesType from './Checkboxes';

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

+export type OptionsTypeKnobSingleValue = string | number | null | undefined;
+
+export type OptionsTypeKnobValue<
+  T extends OptionsTypeKnobSingleValue = OptionsTypeKnobSingleValue
+> = T | NonNullable<T>[] | readonly NonNullable<T>[];
+
 export type OptionsKnobOptionsDisplay =
  | 'radio'
  | 'inline-radio'
@ -21,10 +28,7 @@ export interface OptionsKnobOptions {
  display?: OptionsKnobOptionsDisplay;
 }

-export interface OptionsTypeKnob<T> {
-  name: string;
-  value: T;
-  defaultValue: T;
+export interface OptionsTypeKnob<T extends OptionsTypeKnobValue> extends KnobControlConfig<T> {
  options: OptionsTypeOptionsProp<T>;
  optionsObj: OptionsKnobOptions;
 }
@ -33,10 +37,9 @@ export interface OptionsTypeOptionsProp<T> {
  [key: string]: T;
 }

-export interface OptionsTypeProps<T> {
+export interface OptionsTypeProps<T extends OptionsTypeKnobValue> extends KnobControlProps<T> {
  knob: OptionsTypeKnob<T>;
  display: OptionsKnobOptionsDisplay;
-  onChange: (value: T) => T;
 }

 // : React.ComponentType<ReactSelectProps>
--- a/addons/knobs/src/components/types/Radio.tsx
+++ b/addons/knobs/src/components/types/Radio.tsx
@ -1,24 +1,18 @@
 import React, { Component, WeakValidationMap } from 'react';
 import PropTypes from 'prop-types';
 import { styled } from '@storybook/theming';
+import { KnobControlConfig, KnobControlProps } from './types';

-type RadiosTypeKnobValue = string;
+export type RadiosTypeKnobValue = string | number | null | undefined;

-export interface RadiosTypeKnob {
-  name: string;
-  value: RadiosTypeKnobValue;
-  defaultValue: RadiosTypeKnobValue;
-  options: RadiosTypeOptionsProp;
+export type RadiosTypeOptionsProp<T extends RadiosTypeKnobValue> = Record<string | number, T>;
+
+export interface RadiosTypeKnob extends KnobControlConfig<RadiosTypeKnobValue> {
+  options: RadiosTypeOptionsProp<RadiosTypeKnobValue>;
 }

-export interface RadiosTypeOptionsProp {
-  [key: string]: RadiosTypeKnobValue;
-}
-
-interface RadiosTypeProps {
+interface RadiosTypeProps extends KnobControlProps<RadiosTypeKnobValue>, RadiosWrapperProps {
  knob: RadiosTypeKnob;
-  isInline: boolean;
-  onChange: (value: RadiosTypeKnobValue) => RadiosTypeKnobValue;
 }

 interface RadiosWrapperProps {
--- a/addons/knobs/src/components/types/Select.tsx
+++ b/addons/knobs/src/components/types/Select.tsx
@ -2,22 +2,24 @@ import React, { FunctionComponent, ChangeEvent } from 'react';
 import PropTypes from 'prop-types';

 import { Form } from '@storybook/components';
+import { KnobControlConfig, KnobControlProps } from './types';

 export type SelectTypeKnobValue = string | number | null | undefined;

-export interface SelectTypeKnob {
-  name: string;
-  value: SelectTypeKnobValue;
-  options: SelectTypeOptionsProp;
+export type SelectTypeOptionsProp<T extends SelectTypeKnobValue = SelectTypeKnobValue> =
+  | Record<string, T>
+  | Record<T, T[keyof T]>
+  | T[]
+  | readonly T[];
+
+export interface SelectTypeKnob<T extends SelectTypeKnobValue = SelectTypeKnobValue>
+  extends KnobControlConfig<T> {
+  options: SelectTypeOptionsProp<T>;
 }

-export type SelectTypeOptionsProp =
-  | Record<string, SelectTypeKnobValue>
-  | NonNullable<SelectTypeKnobValue>[];
-
-export interface SelectTypeProps {
-  knob: SelectTypeKnob;
-  onChange: (value: SelectTypeKnobValue) => SelectTypeKnobValue;
+export interface SelectTypeProps<T extends SelectTypeKnobValue = SelectTypeKnobValue>
+  extends KnobControlProps<T> {
+  knob: SelectTypeKnob<T>;
 }

 const serialize = (value: SelectTypeKnobValue) => value;
@ -29,8 +31,11 @@ const SelectType: FunctionComponent<SelectTypeProps> & {
 } = ({ knob, onChange }) => {
  const { options } = knob;
  const entries = Array.isArray(options)
-    ? options.reduce((acc, k) => Object.assign(acc, { [k]: k }), {})
-    : options;
+    ? options.reduce<Record<number, SelectTypeKnobValue>>(
+        (acc, k) => Object.assign(acc, { [k]: k }),
+        {}
+      )
+    : (options as Record<string, SelectTypeKnobValue>);

  const selectedKey = Object.keys(entries).find(k => entries[k] === knob.value);

--- a/addons/knobs/src/components/types/Text.tsx
+++ b/addons/knobs/src/components/types/Text.tsx
@ -2,18 +2,11 @@ import PropTypes from 'prop-types';
 import React, { Component, ChangeEvent, WeakValidationMap } from 'react';

 import { Form } from '@storybook/components';
+import { KnobControlConfig, KnobControlProps } from './types';

 type TextTypeKnobValue = string;
-
-export interface TextTypeKnob {
-  name: string;
-  value: TextTypeKnobValue;
-}
-
-interface TextTypeProps {
-  knob: TextTypeKnob;
-  onChange: (value: TextTypeKnobValue) => TextTypeKnobValue;
-}
+export type TextTypeKnob = KnobControlConfig<TextTypeKnobValue>;
+type TextTypeProps = KnobControlProps<TextTypeKnobValue>;

 export default class TextType extends Component<TextTypeProps> {
  static defaultProps: TextTypeProps = {
--- a/addons/knobs/src/components/types/index.ts
+++ b/addons/knobs/src/components/types/index.ts
@ -45,9 +45,15 @@ export { ColorTypeKnob } from './Color';
 export { BooleanTypeKnob } from './Boolean';
 export { ObjectTypeKnob } from './Object';
 export { SelectTypeKnob, SelectTypeOptionsProp, SelectTypeKnobValue } from './Select';
-export { RadiosTypeKnob, RadiosTypeOptionsProp } from './Radio';
-export { ArrayTypeKnob } from './Array';
+export { RadiosTypeKnob, RadiosTypeOptionsProp, RadiosTypeKnobValue } from './Radio';
+export { ArrayTypeKnob, ArrayTypeKnobValue } from './Array';
 export { DateTypeKnob } from './Date';
 export { ButtonTypeKnob, ButtonTypeOnClickProp } from './Button';
 export { FileTypeKnob } from './Files';
-export { OptionsTypeKnob, OptionsTypeOptionsProp, OptionsKnobOptions } from './Options';
+export {
+  OptionsTypeKnob,
+  OptionsKnobOptions,
+  OptionsTypeOptionsProp,
+  OptionsTypeKnobSingleValue,
+  OptionsTypeKnobValue,
+} from './Options';
--- a/addons/knobs/src/components/types/types.ts
+++ b/addons/knobs/src/components/types/types.ts
@ -0,0 +1,10 @@
+export interface KnobControlConfig<T = never> {
+  name: string;
+  value: T;
+  defaultValue?: T;
+}
+
+export interface KnobControlProps<T> {
+  knob: KnobControlConfig<T>;
+  onChange: (value: T) => T;
+}
--- a/addons/knobs/src/index.ts
+++ b/addons/knobs/src/index.ts
@ -2,19 +2,26 @@ import addons, { makeDecorator } from '@storybook/addons';

 import { SET_OPTIONS } from './shared';
 import { manager, registerKnobs } from './registerKnobs';
-import { Knob, KnobType } from './type-defs';
+import { Knob, KnobType, Mutable } from './type-defs';
 import {
  NumberTypeKnobOptions,
  ButtonTypeOnClickProp,
  RadiosTypeOptionsProp,
  SelectTypeOptionsProp,
  SelectTypeKnobValue,
+  OptionsTypeKnobValue,
  OptionsTypeOptionsProp,
+  OptionsTypeKnobSingleValue,
  OptionsKnobOptions,
+  RadiosTypeKnobValue,
+  ArrayTypeKnobValue,
 } from './components/types';

-export function knob<T extends KnobType>(name: string, options: Knob<T>) {
-  return manager.knob(name, options);
+export function knob<T extends KnobType, V = Mutable<Knob<T>['value']>>(
+  name: string,
+  options: Knob<T>
+): V {
+  return manager.knob(name, options) as V;
 }

 export function text(name: string, value: string, groupId?: string) {
@ -62,25 +69,31 @@ export function object<T>(name: string, value: T, groupId?: string): T {
  return manager.knob(name, { type: 'object', value, groupId });
 }

-export function select(
+export function select<T extends SelectTypeKnobValue>(
  name: string,
-  options: SelectTypeOptionsProp,
-  value: SelectTypeKnobValue,
+  options: SelectTypeOptionsProp<T>,
+  value: T,
  groupId?: string
-) {
-  return manager.knob(name, { type: 'select', selectV2: true, options, value, groupId });
+): T {
+  return manager.knob(name, {
+    type: 'select',
+    selectV2: true,
+    options: options as SelectTypeOptionsProp,
+    value,
+    groupId,
+  }) as T;
 }

-export function radios(
+export function radios<T extends RadiosTypeKnobValue>(
  name: string,
-  options: RadiosTypeOptionsProp,
-  value: string,
+  options: RadiosTypeOptionsProp<T>,
+  value: T,
  groupId?: string
-) {
-  return manager.knob(name, { type: 'radios', options, value, groupId });
+): T {
+  return manager.knob(name, { type: 'radios', options, value, groupId }) as T;
 }

-export function array(name: string, value: string[], separator = ',', groupId?: string) {
+export function array(name: string, value: ArrayTypeKnobValue, separator = ',', groupId?: string) {
  return manager.knob(name, { type: 'array', value, separator, groupId });
 }

@ -97,10 +110,10 @@ export function files(name: string, accept: string, value: string[] = [], groupI
  return manager.knob(name, { type: 'files', accept, value, groupId });
 }

-export function optionsKnob<T>(
+export function optionsKnob<T extends OptionsTypeKnobSingleValue>(
  name: string,
  valuesObj: OptionsTypeOptionsProp<T>,
-  value: T,
+  value: OptionsTypeKnobValue<T>,
  optionsObj: OptionsKnobOptions,
  groupId?: string
 ): T {
--- a/addons/knobs/src/type-defs.ts
+++ b/addons/knobs/src/type-defs.ts
@ -14,6 +14,10 @@ import {
  KnobType,
 } from './components/types';

+export type Mutable<T> = {
+  -readonly [P in keyof T]: T[P] extends readonly (infer U)[] ? U[] : T[P];
+};
+
 type KnobPlus<T extends KnobType, K> = K & { type: T; groupId?: string };

 export type Knob<T extends KnobType = any> = T extends 'text'
--- a/addons/links/package.json
+++ b/addons/links/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/addon-links",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "description": "Story Links addon for storybook",
  "keywords": [
    "addon",
@ -22,9 +22,9 @@
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-beta.0",
-    "@storybook/core-events": "5.2.0-beta.0",
-    "@storybook/router": "5.2.0-beta.0",
+    "@storybook/addons": "5.2.0-beta.2",
+    "@storybook/core-events": "5.2.0-beta.2",
+    "@storybook/router": "5.2.0-beta.2",
    "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-beta.0",
+  "version": "5.2.0-beta.2",
  "description": "Write notes for your Storybook stories.",
  "keywords": [
    "addon",
@ -23,13 +23,13 @@
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-beta.0",
-    "@storybook/api": "5.2.0-beta.0",
-    "@storybook/client-logger": "5.2.0-beta.0",
-    "@storybook/components": "5.2.0-beta.0",
-    "@storybook/core-events": "5.2.0-beta.0",
-    "@storybook/router": "5.2.0-beta.0",
-    "@storybook/theming": "5.2.0-beta.0",
+    "@storybook/addons": "5.2.0-beta.2",
+    "@storybook/api": "5.2.0-beta.2",
+    "@storybook/client-logger": "5.2.0-beta.2",
+    "@storybook/components": "5.2.0-beta.2",
+    "@storybook/core-events": "5.2.0-beta.2",
+    "@storybook/router": "5.2.0-beta.2",
+    "@storybook/theming": "5.2.0-beta.2",
    "core-js": "^3.0.1",
    "global": "^4.3.2",
    "markdown-to-jsx": "^6.9.3",
--- 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-beta.0",
+  "version": "5.2.0-beta.2",
  "description": "Action Logger addon for react-native storybook",
  "keywords": [
    "storybook"
@ -19,13 +19,13 @@
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-beta.0",
-    "@storybook/core-events": "5.2.0-beta.0",
+    "@storybook/addons": "5.2.0-beta.2",
+    "@storybook/core-events": "5.2.0-beta.2",
    "core-js": "^2.5.7",
    "fast-deep-equal": "^2.0.1"
  },
  "devDependencies": {
-    "@storybook/addon-actions": "5.2.0-beta.0"
+    "@storybook/addon-actions": "5.2.0-beta.2"
  },
  "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-beta.0",
+  "version": "5.2.0-beta.2",
  "description": "A react-native storybook addon to show different backgrounds for your preview",
  "keywords": [
    "addon",
@ -24,7 +24,7 @@
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-beta.0",
+    "@storybook/addons": "5.2.0-beta.2",
    "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-beta.0",
+  "version": "5.2.0-beta.2",
  "description": "Display storybook story knobs on your deviced.",
  "keywords": [
    "addon",
@ -21,8 +21,8 @@
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-beta.0",
-    "@storybook/core-events": "5.2.0-beta.0",
+    "@storybook/addons": "5.2.0-beta.2",
+    "@storybook/core-events": "5.2.0-beta.2",
    "core-js": "^3.0.1",
    "deep-equal": "^1.0.1",
    "prop-types": "^15.7.2",
--- a/addons/ondevice-knobs/src/GroupTabs.js
+++ b/addons/ondevice-knobs/src/GroupTabs.js
@ -14,6 +14,7 @@ class GroupTabs extends Component {
    return (
      <TouchableOpacity
        style={{
+          marginTop: 5,
          marginRight: 15,
          paddingBottom: 10,
        }}
--- a/addons/ondevice-knobs/src/PropField.js
+++ b/addons/ondevice-knobs/src/PropField.js
@ -19,7 +19,7 @@ const PropField = ({ onChange, onPress, knob }) => {
            fontWeight: 'bold',
          }}
        >
-          {`${knob.name}`}
+          {`${knob.label || knob.name}`}
        </Text>
      ) : null}
      <InputType knob={knob} onChange={onChange} onPress={onPress} />
@ -30,6 +30,7 @@ const PropField = ({ onChange, onPress, knob }) => {
 PropField.propTypes = {
  knob: PropTypes.shape({
    name: PropTypes.string,
+    label: PropTypes.string,
    value: PropTypes.any,
    hideLabel: PropTypes.bool,
    type: PropTypes.oneOf([
--- a/addons/ondevice-knobs/src/panel.js
+++ b/addons/ondevice-knobs/src/panel.js
@ -118,6 +118,11 @@ export default class Panel extends React.Component {
        render: () => <Text id={DEFAULT_GROUP_ID}>{DEFAULT_GROUP_ID}</Text>,
        title: DEFAULT_GROUP_ID,
      };
+
+      if (groupId === DEFAULT_GROUP_ID) {
+        knobsArray = knobsArray.filter(key => !knobs[key].groupId);
+      }
+
      if (groupId !== DEFAULT_GROUP_ID) {
        knobsArray = knobsArray.filter(key => knobs[key].groupId === groupId);
      }
--- a/addons/ondevice-notes/package.json
+++ b/addons/ondevice-notes/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/addon-ondevice-notes",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "description": "Write notes for your react-native Storybook stories.",
  "keywords": [
    "addon",
@ -20,8 +20,8 @@
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-beta.0",
-    "@storybook/client-logger": "5.2.0-beta.0",
+    "@storybook/addons": "5.2.0-beta.2",
+    "@storybook/client-logger": "5.2.0-beta.2",
    "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-beta.0",
+  "version": "5.2.0-beta.2",
  "description": "Options addon for storybook",
  "keywords": [
    "addon",
@ -22,7 +22,7 @@
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-beta.0",
+    "@storybook/addons": "5.2.0-beta.2",
    "core-js": "^3.0.1",
    "util-deprecate": "^1.0.2"
  },
--- a/addons/queryparams/package.json
+++ b/addons/queryparams/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/addon-queryparams",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "description": "parameter addon for storybook",
  "keywords": [
    "addon",
@ -23,12 +23,12 @@
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-beta.0",
-    "@storybook/api": "5.2.0-beta.0",
-    "@storybook/client-logger": "5.2.0-beta.0",
-    "@storybook/components": "5.2.0-beta.0",
-    "@storybook/core-events": "5.2.0-beta.0",
-    "@storybook/theming": "5.2.0-beta.0",
+    "@storybook/addons": "5.2.0-beta.2",
+    "@storybook/api": "5.2.0-beta.2",
+    "@storybook/client-logger": "5.2.0-beta.2",
+    "@storybook/components": "5.2.0-beta.2",
+    "@storybook/core-events": "5.2.0-beta.2",
+    "@storybook/theming": "5.2.0-beta.2",
    "common-tags": "^1.8.0",
    "core-js": "^3.0.1",
    "global": "^4.3.2",
--- 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-beta.0",
+  "version": "5.2.0-beta.2",
  "description": "StoryShots is a Jest Snapshot Testing Addon for Storybook.",
  "keywords": [
    "addon",
@ -25,7 +25,7 @@
    "storybook": "start-storybook -p 6006"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-beta.0",
+    "@storybook/addons": "5.2.0-beta.2",
    "core-js": "^3.0.1",
    "glob": "^7.1.3",
    "global": "^4.3.2",
--- a/addons/storyshots/storyshots-core/src/frameworks/frameworkLoader.js
+++ b/addons/storyshots/storyshots-core/src/frameworks/frameworkLoader.js
@ -23,7 +23,7 @@ function loadFramework(options) {

  if (!loader) {
    throw new Error(
-      "Couldn't find an appropriate framework loader -- do you need to set the `frameowrk` option?"
+      "Couldn't find an appropriate framework loader -- do you need to set the `framework` option?"
    );
  }

--- 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-beta.0",
+  "version": "5.2.0-beta.2",
  "description": "Image snappshots addition to StoryShots base on puppeteer",
  "keywords": [
    "addon",
@ -22,8 +22,8 @@
    "prepare": "node ../../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/node-logger": "5.2.0-beta.0",
-    "@storybook/router": "5.2.0-beta.0",
+    "@storybook/node-logger": "5.2.0-beta.2",
+    "@storybook/router": "5.2.0-beta.2",
    "core-js": "^3.0.1",
    "jest-image-snapshot": "^2.8.2",
    "regenerator-runtime": "^0.12.1"
--- a/addons/storysource/package.json
+++ b/addons/storysource/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/addon-storysource",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "description": "Stories addon for storybook",
  "keywords": [
    "addon",
@ -22,10 +22,10 @@
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-beta.0",
-    "@storybook/components": "5.2.0-beta.0",
-    "@storybook/router": "5.2.0-beta.0",
-    "@storybook/theming": "5.2.0-beta.0",
+    "@storybook/addons": "5.2.0-beta.2",
+    "@storybook/components": "5.2.0-beta.2",
+    "@storybook/router": "5.2.0-beta.2",
+    "@storybook/theming": "5.2.0-beta.2",
    "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-beta.0",
+  "version": "5.2.0-beta.2",
  "description": "Storybook addon to change the viewport size to mobile",
  "keywords": [
    "addon",
@ -21,12 +21,12 @@
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-beta.0",
-    "@storybook/api": "5.2.0-beta.0",
-    "@storybook/client-logger": "5.2.0-beta.0",
-    "@storybook/components": "5.2.0-beta.0",
-    "@storybook/core-events": "5.2.0-beta.0",
-    "@storybook/theming": "5.2.0-beta.0",
+    "@storybook/addons": "5.2.0-beta.2",
+    "@storybook/api": "5.2.0-beta.2",
+    "@storybook/client-logger": "5.2.0-beta.2",
+    "@storybook/components": "5.2.0-beta.2",
+    "@storybook/core-events": "5.2.0-beta.2",
+    "@storybook/theming": "5.2.0-beta.2",
    "core-js": "^3.0.1",
    "global": "^4.3.2",
    "memoizerific": "^1.11.3",
--- a/app/angular/package.json
+++ b/app/angular/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/angular",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "description": "Storybook for Angular: Develop Angular Components in isolation with Hot Reloading.",
  "keywords": [
    "storybook"
@ -26,9 +26,9 @@
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-beta.0",
-    "@storybook/core": "5.2.0-beta.0",
-    "@storybook/node-logger": "5.2.0-beta.0",
+    "@storybook/addons": "5.2.0-beta.2",
+    "@storybook/core": "5.2.0-beta.2",
+    "@storybook/node-logger": "5.2.0-beta.2",
    "angular2-template-loader": "^0.6.2",
    "core-js": "^3.0.1",
    "fork-ts-checker-webpack-plugin": "^1.3.4",
--- a/app/ember/package.json
+++ b/app/ember/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/ember",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "description": "Storybook for Ember: Develop Ember Component in isolation with Hot Reloading.",
  "homepage": "https://github.com/storybookjs/storybook/tree/master/app/ember",
  "bugs": {
@ -24,7 +24,7 @@
  },
  "dependencies": {
    "@ember/test-helpers": "^1.5.0",
-    "@storybook/core": "5.2.0-beta.0",
+    "@storybook/core": "5.2.0-beta.2",
    "common-tags": "^1.8.0",
    "core-js": "^3.0.1",
    "global": "^4.3.2",
--- a/app/html/package.json
+++ b/app/html/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/html",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "description": "Storybook for HTML: View HTML snippets in isolation with Hot Reloading.",
  "keywords": [
    "storybook"
@ -26,8 +26,8 @@
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-beta.0",
-    "@storybook/core": "5.2.0-beta.0",
+    "@storybook/addons": "5.2.0-beta.2",
+    "@storybook/core": "5.2.0-beta.2",
    "common-tags": "^1.8.0",
    "core-js": "^3.0.1",
    "global": "^4.3.2",
--- a/app/marko/package.json
+++ b/app/marko/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/marko",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "description": "Storybook for Marko: Develop Marko Component in isolation with Hot Reloading.",
  "keywords": [
    "storybook"
@ -26,7 +26,7 @@
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/core": "5.2.0-beta.0",
+    "@storybook/core": "5.2.0-beta.2",
    "common-tags": "^1.8.0",
    "core-js": "^3.0.1",
    "global": "^4.3.2",
--- a/app/mithril/package.json
+++ b/app/mithril/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/mithril",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "description": "Storybook for Mithril: Develop Mithril Component in isolation.",
  "keywords": [
    "storybook"
@ -27,7 +27,7 @@
  },
  "dependencies": {
    "@babel/plugin-transform-react-jsx": "^7.3.0",
-    "@storybook/core": "5.2.0-beta.0",
+    "@storybook/core": "5.2.0-beta.2",
    "common-tags": "^1.8.0",
    "core-js": "^3.0.1",
    "global": "^4.3.2",
--- a/app/polymer/package.json
+++ b/app/polymer/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/polymer",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "description": "Storybook for Polymer: Develop Polymer components in isolation with Hot Reloading.",
  "keywords": [
    "storybook"
@ -25,7 +25,7 @@
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/core": "5.2.0-beta.0",
+    "@storybook/core": "5.2.0-beta.2",
    "@webcomponents/webcomponentsjs": "^1.2.0",
    "common-tags": "^1.8.0",
    "core-js": "^3.0.1",
--- a/app/preact/package.json
+++ b/app/preact/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/preact",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "description": "Storybook for Preact: Develop Preact Component in isolation.",
  "keywords": [
    "storybook"
@ -27,7 +27,7 @@
  },
  "dependencies": {
    "@babel/plugin-transform-react-jsx": "^7.3.0",
-    "@storybook/core": "5.2.0-beta.0",
+    "@storybook/core": "5.2.0-beta.2",
    "common-tags": "^1.8.0",
    "core-js": "^3.0.1",
    "global": "^4.3.2",
--- a/app/rax/package.json
+++ b/app/rax/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/rax",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "description": "Storybook for Rax: Develop Rax Component in isolation.",
  "keywords": [
    "storybook",
@ -27,7 +27,7 @@
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/core": "5.2.0-beta.0",
+    "@storybook/core": "5.2.0-beta.2",
    "babel-preset-rax": "^1.0.0-beta.0",
    "common-tags": "^1.8.0",
    "core-js": "^2.6.2",
--- 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-beta.0",
+  "version": "5.2.0-beta.2",
  "description": "A better way to develop React Native Components for your app",
  "keywords": [
    "react",
@ -24,12 +24,12 @@
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-beta.0",
-    "@storybook/api": "5.2.0-beta.0",
-    "@storybook/channel-websocket": "5.2.0-beta.0",
-    "@storybook/core": "5.2.0-beta.0",
-    "@storybook/core-events": "5.2.0-beta.0",
-    "@storybook/ui": "5.2.0-beta.0",
+    "@storybook/addons": "5.2.0-beta.2",
+    "@storybook/api": "5.2.0-beta.2",
+    "@storybook/channel-websocket": "5.2.0-beta.2",
+    "@storybook/core": "5.2.0-beta.2",
+    "@storybook/core-events": "5.2.0-beta.2",
+    "@storybook/ui": "5.2.0-beta.2",
    "commander": "^2.19.0",
    "core-js": "^3.0.1",
    "global": "^4.3.2",
--- a/app/react-native/package.json
+++ b/app/react-native/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/react-native",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "description": "A better way to develop React Native Components for your app",
  "keywords": [
    "react",
@ -24,11 +24,11 @@
  "dependencies": {
    "@emotion/core": "^10.0.14",
    "@emotion/native": "^10.0.14",
-    "@storybook/addons": "5.2.0-beta.0",
-    "@storybook/channel-websocket": "5.2.0-beta.0",
-    "@storybook/channels": "5.2.0-beta.0",
-    "@storybook/client-api": "5.2.0-beta.0",
-    "@storybook/core-events": "5.2.0-beta.0",
+    "@storybook/addons": "5.2.0-beta.2",
+    "@storybook/channel-websocket": "5.2.0-beta.2",
+    "@storybook/channels": "5.2.0-beta.2",
+    "@storybook/client-api": "5.2.0-beta.2",
+    "@storybook/core-events": "5.2.0-beta.2",
    "core-js": "^3.0.1",
    "emotion-theming": "^10.0.14",
    "react-native-swipe-gestures": "^1.0.3",
--- a/app/react-native/src/preview/components/StoryView/index.tsx
+++ b/app/react-native/src/preview/components/StoryView/index.tsx
@ -25,6 +25,16 @@ export default class StoryView extends Component<Props> {
    channel.on(Events.FORCE_RE_RENDER, this.forceReRender);
  }

+  componentDidUpdate() {
+    const channel = addons.getChannel();
+    const { stories } = this.props;
+    const { storyId } = stories.getSelection();
+
+    if (storyId) {
+      channel.emit(Events.STORY_RENDERED, { storyId });
+    }
+  }
+
  componentWillUnmount() {
    const channel = addons.getChannel();
    channel.removeListener(Events.STORY_RENDER, this.forceReRender);
@ -66,7 +76,7 @@ export default class StoryView extends Component<Props> {
    if (story && story.storyFn) {
      const { id, storyFn } = story;
      return (
-        <View key={id} style={{ flex: 1 }}>
+        <View key={id} testID={id} style={{ flex: 1 }}>
          {storyFn()}
        </View>
      );
--- a/app/react/package.json
+++ b/app/react/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/react",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "description": "Storybook for React: Develop React Component in isolation with Hot Reloading.",
  "keywords": [
    "storybook"
@ -29,9 +29,9 @@
    "@babel/plugin-transform-react-constant-elements": "^7.2.0",
    "@babel/preset-flow": "^7.0.0",
    "@babel/preset-react": "^7.0.0",
-    "@storybook/addons": "5.2.0-beta.0",
-    "@storybook/core": "5.2.0-beta.0",
-    "@storybook/node-logger": "5.2.0-beta.0",
+    "@storybook/addons": "5.2.0-beta.2",
+    "@storybook/core": "5.2.0-beta.2",
+    "@storybook/node-logger": "5.2.0-beta.2",
    "@svgr/webpack": "^4.0.3",
    "babel-plugin-add-react-displayname": "^0.0.5",
    "babel-plugin-named-asset-import": "^0.3.1",
--- a/app/riot/package.json
+++ b/app/riot/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/riot",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "description": "Storybook for riot.js: View riot snippets in isolation with Hot Reloading.",
  "keywords": [
    "storybook"
@ -25,7 +25,7 @@
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/core": "5.2.0-beta.0",
+    "@storybook/core": "5.2.0-beta.2",
    "common-tags": "^1.8.0",
    "core-js": "^3.0.1",
    "global": "^4.3.2",
--- a/app/svelte/package.json
+++ b/app/svelte/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/svelte",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "description": "Storybook for Svelte: Develop Svelte Component in isolation with Hot Reloading.",
  "keywords": [
    "storybook"
@ -26,7 +26,7 @@
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/core": "5.2.0-beta.0",
+    "@storybook/core": "5.2.0-beta.2",
    "common-tags": "^1.8.0",
    "core-js": "^3.0.1",
    "global": "^4.3.2",
--- a/app/vue/package.json
+++ b/app/vue/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/vue",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "description": "Storybook for Vue: Develop Vue Component in isolation with Hot Reloading.",
  "keywords": [
    "storybook"
@ -26,7 +26,7 @@
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/core": "5.2.0-beta.0",
+    "@storybook/core": "5.2.0-beta.2",
    "common-tags": "^1.8.0",
    "core-js": "^3.0.1",
    "global": "^4.3.2",
--- a/dev-kits/addon-decorator/package.json
+++ b/dev-kits/addon-decorator/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/addon-decorator",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "description": "decorator addon for storybook",
  "keywords": [
    "devkit",
@ -24,8 +24,8 @@
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-beta.0",
-    "@storybook/client-api": "5.2.0-beta.0",
+    "@storybook/addons": "5.2.0-beta.2",
+    "@storybook/client-api": "5.2.0-beta.2",
    "core-js": "^3.0.1",
    "global": "^3.0.1"
  },
--- a/dev-kits/addon-parameter/package.json
+++ b/dev-kits/addon-parameter/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/addon-parameter",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "description": "parameter addon for storybook",
  "keywords": [
    "devkit",
@ -24,12 +24,12 @@
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-beta.0",
-    "@storybook/api": "5.2.0-beta.0",
-    "@storybook/client-logger": "5.2.0-beta.0",
-    "@storybook/components": "5.2.0-beta.0",
-    "@storybook/core-events": "5.2.0-beta.0",
-    "@storybook/theming": "5.2.0-beta.0",
+    "@storybook/addons": "5.2.0-beta.2",
+    "@storybook/api": "5.2.0-beta.2",
+    "@storybook/client-logger": "5.2.0-beta.2",
+    "@storybook/components": "5.2.0-beta.2",
+    "@storybook/core-events": "5.2.0-beta.2",
+    "@storybook/theming": "5.2.0-beta.2",
    "common-tags": "^1.8.0",
    "core-js": "^3.0.1",
    "global": "^4.3.2",
--- a/dev-kits/addon-roundtrip/package.json
+++ b/dev-kits/addon-roundtrip/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/addon-roundtrip",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "description": "roundtrip addon for storybook",
  "keywords": [
    "devkit",
@ -24,13 +24,13 @@
    "prepare": "node ../../scripts/prepare.js"
  },
  "dependencies": {
-    "@storybook/addons": "5.2.0-beta.0",
-    "@storybook/api": "5.2.0-beta.0",
-    "@storybook/client-api": "5.2.0-beta.0",
-    "@storybook/client-logger": "5.2.0-beta.0",
-    "@storybook/components": "5.2.0-beta.0",
-    "@storybook/core-events": "5.2.0-beta.0",
-    "@storybook/theming": "5.2.0-beta.0",
+    "@storybook/addons": "5.2.0-beta.2",
+    "@storybook/api": "5.2.0-beta.2",
+    "@storybook/client-api": "5.2.0-beta.2",
+    "@storybook/client-logger": "5.2.0-beta.2",
+    "@storybook/components": "5.2.0-beta.2",
+    "@storybook/core-events": "5.2.0-beta.2",
+    "@storybook/theming": "5.2.0-beta.2",
    "common-tags": "^1.8.0",
    "core-js": "^3.0.1",
    "global": "^4.3.2",
--- a/docs/src/versions/next.json
+++ b/docs/src/versions/next.json
@ -1 +1 @@
-{"version":"5.2.0-beta.0","info":{"plain":"### Features\n\n* Codemod: Convert module format to MDX ([#7418](https://github.com/storybookjs/storybook/pull/7418))"}}
+{"version":"5.2.0-beta.2","info":{"plain":"### Features\n\n* CLI: convert mdx to module format ([#7419](https://github.com/storybookjs/storybook/pull/7419))\n* CLI: sb migrate npm & typescript support ([#7463](https://github.com/storybookjs/storybook/pull/7463))\n* Addon-Docs: HTML support & example ([#7454](https://github.com/storybookjs/storybook/pull/7454))\n\n### Bug Fixes\n\n* Convert-storiesof-to-module: user exports, collisions, reserved keywords ([#7471](https://github.com/storybookjs/storybook/pull/7471))\n* React-native: On-device knobs fixes ([#7470](https://github.com/storybookjs/storybook/pull/7470))\n\n### Dependency Upgrades\n\n* Addon-docs: Upgrade MDX to 1.1 ([#7476](https://github.com/storybookjs/storybook/pull/7476))"}}
--- a/examples-native/crna-kitchen-sink/app.json
+++ b/examples-native/crna-kitchen-sink/app.json
@ -1,6 +1,6 @@
 {
  "expo": {
-    "sdkVersion": "32.0.0",
+    "sdkVersion": "33.0.0",
    "platforms": [
      "ios",
      "android"
--- a/examples-native/crna-kitchen-sink/package.json
+++ b/examples-native/crna-kitchen-sink/package.json
@ -1,6 +1,6 @@
 {
  "name": "crna-kitchen-sink",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "private": true,
  "main": "node_modules/expo/AppEntry.js",
  "scripts": {
@ -15,23 +15,23 @@
    "preset": "jest-expo"
  },
  "dependencies": {
-    "expo": "^32.0.6",
+    "expo": "^33.0.7",
    "prop-types": "^15.6.2",
    "react": "16.8.6",
-    "react-native": "https://github.com/expo/react-native/archive/sdk-32.0.0.tar.gz",
+    "react-native": "https://github.com/expo/react-native/archive/sdk-33.0.0.tar.gz",
    "whatwg-fetch": "^3.0.0"
  },
  "devDependencies": {
    "@babel/core": "^7.2.2",
    "@babel/plugin-transform-react-jsx-source": "^7.2.0",
-    "@storybook/addon-actions": "5.2.0-beta.0",
-    "@storybook/addon-knobs": "5.2.0-beta.0",
-    "@storybook/addon-ondevice-actions": "5.2.0-beta.0",
-    "@storybook/addon-ondevice-backgrounds": "5.2.0-beta.0",
-    "@storybook/addon-ondevice-knobs": "5.2.0-beta.0",
-    "@storybook/addon-ondevice-notes": "5.2.0-beta.0",
-    "@storybook/addons": "5.2.0-beta.0",
-    "@storybook/react-native": "5.2.0-beta.0",
+    "@storybook/addon-actions": "5.2.0-beta.2",
+    "@storybook/addon-knobs": "5.2.0-beta.2",
+    "@storybook/addon-ondevice-actions": "5.2.0-beta.2",
+    "@storybook/addon-ondevice-backgrounds": "5.2.0-beta.2",
+    "@storybook/addon-ondevice-knobs": "5.2.0-beta.2",
+    "@storybook/addon-ondevice-notes": "5.2.0-beta.2",
+    "@storybook/addons": "5.2.0-beta.2",
+    "@storybook/react-native": "5.2.0-beta.2",
    "babel-loader": "^8.0.4",
    "babel-plugin-module-resolver": "^3.2.0",
    "babel-preset-expo": "^5.1.1",
--- a/examples/angular-cli/package.json
+++ b/examples/angular-cli/package.json
@ -1,6 +1,6 @@
 {
  "name": "angular-cli",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "private": true,
  "license": "MIT",
  "scripts": {
@ -34,21 +34,21 @@
    "@angular-devkit/build-angular": "^0.13.4",
    "@angular/cli": "^7.3.6",
    "@angular/compiler-cli": "^7.2.6",
-    "@storybook/addon-a11y": "5.2.0-beta.0",
-    "@storybook/addon-actions": "5.2.0-beta.0",
-    "@storybook/addon-backgrounds": "5.2.0-beta.0",
-    "@storybook/addon-centered": "5.2.0-beta.0",
-    "@storybook/addon-docs": "5.2.0-beta.0",
-    "@storybook/addon-jest": "5.2.0-beta.0",
-    "@storybook/addon-knobs": "5.2.0-beta.0",
-    "@storybook/addon-links": "5.2.0-beta.0",
-    "@storybook/addon-notes": "5.2.0-beta.0",
-    "@storybook/addon-options": "5.2.0-beta.0",
-    "@storybook/addon-storyshots": "5.2.0-beta.0",
-    "@storybook/addon-storysource": "5.2.0-beta.0",
-    "@storybook/addons": "5.2.0-beta.0",
-    "@storybook/angular": "5.2.0-beta.0",
-    "@storybook/source-loader": "5.2.0-beta.0",
+    "@storybook/addon-a11y": "5.2.0-beta.2",
+    "@storybook/addon-actions": "5.2.0-beta.2",
+    "@storybook/addon-backgrounds": "5.2.0-beta.2",
+    "@storybook/addon-centered": "5.2.0-beta.2",
+    "@storybook/addon-docs": "5.2.0-beta.2",
+    "@storybook/addon-jest": "5.2.0-beta.2",
+    "@storybook/addon-knobs": "5.2.0-beta.2",
+    "@storybook/addon-links": "5.2.0-beta.2",
+    "@storybook/addon-notes": "5.2.0-beta.2",
+    "@storybook/addon-options": "5.2.0-beta.2",
+    "@storybook/addon-storyshots": "5.2.0-beta.2",
+    "@storybook/addon-storysource": "5.2.0-beta.2",
+    "@storybook/addons": "5.2.0-beta.2",
+    "@storybook/angular": "5.2.0-beta.2",
+    "@storybook/source-loader": "5.2.0-beta.2",
    "@types/core-js": "^2.5.0",
    "@types/jest": "^24.0.11",
    "@types/node": "~12.0.2",
--- a/examples/cra-kitchen-sink/.storybook/config.js
+++ b/examples/cra-kitchen-sink/.storybook/config.js
@ -23,3 +23,4 @@ addParameters({
 });

 load(require.context('../src/stories', true, /\.stories\.js$/), module);
+load(require.context('../src/stories', true, /\.stories\.mdx$/), module);
--- a/examples/cra-kitchen-sink/.storybook/presets.js
+++ b/examples/cra-kitchen-sink/.storybook/presets.js
@ -0,0 +1,8 @@
+module.exports = [
+  {
+    name: '@storybook/addon-docs/react/preset',
+    options: {
+      configureJSX: true,
+    },
+  },
+];
--- a/examples/cra-kitchen-sink/package.json
+++ b/examples/cra-kitchen-sink/package.json
@ -1,6 +1,6 @@
 {
  "name": "cra-kitchen-sink",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "private": true,
  "scripts": {
    "build": "react-scripts build",
@ -19,22 +19,22 @@
    "react-lifecycles-compat": "^3.0.4"
  },
  "devDependencies": {
-    "@storybook/addon-a11y": "5.2.0-beta.0",
-    "@storybook/addon-actions": "5.2.0-beta.0",
-    "@storybook/addon-backgrounds": "5.2.0-beta.0",
-    "@storybook/addon-centered": "5.2.0-beta.0",
-    "@storybook/addon-events": "5.2.0-beta.0",
-    "@storybook/addon-info": "5.2.0-beta.0",
-    "@storybook/addon-jest": "5.2.0-beta.0",
-    "@storybook/addon-knobs": "5.2.0-beta.0",
-    "@storybook/addon-links": "5.2.0-beta.0",
-    "@storybook/addon-notes": "5.2.0-beta.0",
-    "@storybook/addon-options": "5.2.0-beta.0",
-    "@storybook/addon-storyshots": "5.2.0-beta.0",
-    "@storybook/addons": "5.2.0-beta.0",
-    "@storybook/client-logger": "5.2.0-beta.0",
-    "@storybook/react": "5.2.0-beta.0",
-    "@storybook/theming": "5.2.0-beta.0",
+    "@storybook/addon-a11y": "5.2.0-beta.2",
+    "@storybook/addon-actions": "5.2.0-beta.2",
+    "@storybook/addon-backgrounds": "5.2.0-beta.2",
+    "@storybook/addon-centered": "5.2.0-beta.2",
+    "@storybook/addon-events": "5.2.0-beta.2",
+    "@storybook/addon-info": "5.2.0-beta.2",
+    "@storybook/addon-jest": "5.2.0-beta.2",
+    "@storybook/addon-knobs": "5.2.0-beta.2",
+    "@storybook/addon-links": "5.2.0-beta.2",
+    "@storybook/addon-notes": "5.2.0-beta.2",
+    "@storybook/addon-options": "5.2.0-beta.2",
+    "@storybook/addon-storyshots": "5.2.0-beta.2",
+    "@storybook/addons": "5.2.0-beta.2",
+    "@storybook/client-logger": "5.2.0-beta.2",
+    "@storybook/react": "5.2.0-beta.2",
+    "@storybook/theming": "5.2.0-beta.2",
    "react-scripts": "^3.0.1"
  }
 }
--- a/examples/cra-kitchen-sink/src/stories/test.stories.mdx
+++ b/examples/cra-kitchen-sink/src/stories/test.stories.mdx
@ -0,0 +1,7 @@
+import { Story, Meta } from '@storybook/addon-docs/blocks';
+
+<Meta title="Docs|Test" />
+
+<Story name="NewStory123">
+  <h2> Hello </h2>
+</Story>
--- a/examples/cra-react15/package.json
+++ b/examples/cra-react15/package.json
@ -1,6 +1,6 @@
 {
  "name": "cra-react15",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "private": true,
  "dependencies": {
    "babel-loader": "8.0.6",
@ -19,10 +19,10 @@
    "build-storybook": "build-storybook -s public"
  },
  "devDependencies": {
-    "@storybook/addon-actions": "5.2.0-beta.0",
-    "@storybook/addon-links": "5.2.0-beta.0",
-    "@storybook/react": "5.2.0-beta.0",
-    "@storybook/theming": "5.2.0-beta.0",
+    "@storybook/addon-actions": "5.2.0-beta.2",
+    "@storybook/addon-links": "5.2.0-beta.2",
+    "@storybook/react": "5.2.0-beta.2",
+    "@storybook/theming": "5.2.0-beta.2",
    "babel-core": "6",
    "babel-runtime": "6"
  }
--- a/examples/cra-ts-kitchen-sink/package.json
+++ b/examples/cra-ts-kitchen-sink/package.json
@ -1,6 +1,6 @@
 {
  "name": "cra-ts-kitchen-sink",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "private": true,
  "scripts": {
    "build-storybook": "build-storybook -s public",
@ -14,12 +14,12 @@
    "react-dom": "^16.8.3"
  },
  "devDependencies": {
-    "@storybook/addon-a11y": "5.2.0-beta.0",
-    "@storybook/addon-actions": "5.2.0-beta.0",
-    "@storybook/addon-info": "5.2.0-beta.0",
-    "@storybook/addon-options": "5.2.0-beta.0",
-    "@storybook/addons": "5.2.0-beta.0",
-    "@storybook/react": "5.2.0-beta.0",
+    "@storybook/addon-a11y": "5.2.0-beta.2",
+    "@storybook/addon-actions": "5.2.0-beta.2",
+    "@storybook/addon-info": "5.2.0-beta.2",
+    "@storybook/addon-options": "5.2.0-beta.2",
+    "@storybook/addons": "5.2.0-beta.2",
+    "@storybook/react": "5.2.0-beta.2",
    "@types/enzyme": "^3.9.0",
    "@types/react": "^16.8.3",
    "@types/react-dom": "^16.8.2",
--- a/examples/dev-kits/package.json
+++ b/examples/dev-kits/package.json
@ -1,6 +1,6 @@
 {
  "name": "@storybook/example-devkits",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "private": true,
  "scripts": {
    "build-storybook": "build-storybook -c ./ -s built-storybooks",
@ -8,15 +8,15 @@
    "storybook": "start-storybook -p 9011 -c ./"
  },
  "devDependencies": {
-    "@storybook/addon-decorator": "5.2.0-beta.0",
-    "@storybook/addon-parameter": "5.2.0-beta.0",
-    "@storybook/addon-roundtrip": "5.2.0-beta.0",
-    "@storybook/addons": "5.2.0-beta.0",
-    "@storybook/components": "5.2.0-beta.0",
-    "@storybook/core-events": "5.2.0-beta.0",
-    "@storybook/node-logger": "5.2.0-beta.0",
-    "@storybook/react": "5.2.0-beta.0",
-    "@storybook/theming": "5.2.0-beta.0",
+    "@storybook/addon-decorator": "5.2.0-beta.2",
+    "@storybook/addon-parameter": "5.2.0-beta.2",
+    "@storybook/addon-roundtrip": "5.2.0-beta.2",
+    "@storybook/addons": "5.2.0-beta.2",
+    "@storybook/components": "5.2.0-beta.2",
+    "@storybook/core-events": "5.2.0-beta.2",
+    "@storybook/node-logger": "5.2.0-beta.2",
+    "@storybook/react": "5.2.0-beta.2",
+    "@storybook/theming": "5.2.0-beta.2",
    "cors": "^2.8.5",
    "cross-env": "^5.2.0",
    "enzyme-to-json": "^3.3.5",
--- a/examples/ember-cli/package.json
+++ b/examples/ember-cli/package.json
@ -1,6 +1,6 @@
 {
  "name": "ember-example",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "private": true,
  "scripts": {
    "build": "ember build",
@ -15,19 +15,19 @@
  },
  "devDependencies": {
    "@babel/core": "^7.3.4",
-    "@storybook/addon-a11y": "5.2.0-beta.0",
-    "@storybook/addon-actions": "5.2.0-beta.0",
-    "@storybook/addon-backgrounds": "5.2.0-beta.0",
-    "@storybook/addon-centered": "5.2.0-beta.0",
-    "@storybook/addon-knobs": "5.2.0-beta.0",
-    "@storybook/addon-links": "5.2.0-beta.0",
-    "@storybook/addon-notes": "5.2.0-beta.0",
-    "@storybook/addon-options": "5.2.0-beta.0",
-    "@storybook/addon-storysource": "5.2.0-beta.0",
-    "@storybook/addon-viewport": "5.2.0-beta.0",
-    "@storybook/addons": "5.2.0-beta.0",
-    "@storybook/ember": "5.2.0-beta.0",
-    "@storybook/source-loader": "5.2.0-beta.0",
+    "@storybook/addon-a11y": "5.2.0-beta.2",
+    "@storybook/addon-actions": "5.2.0-beta.2",
+    "@storybook/addon-backgrounds": "5.2.0-beta.2",
+    "@storybook/addon-centered": "5.2.0-beta.2",
+    "@storybook/addon-knobs": "5.2.0-beta.2",
+    "@storybook/addon-links": "5.2.0-beta.2",
+    "@storybook/addon-notes": "5.2.0-beta.2",
+    "@storybook/addon-options": "5.2.0-beta.2",
+    "@storybook/addon-storysource": "5.2.0-beta.2",
+    "@storybook/addon-viewport": "5.2.0-beta.2",
+    "@storybook/addons": "5.2.0-beta.2",
+    "@storybook/ember": "5.2.0-beta.2",
+    "@storybook/source-loader": "5.2.0-beta.2",
    "babel-loader": "^8",
    "broccoli-asset-rev": "^3.0.0",
    "cross-env": "^5.2.0",
--- a/examples/html-kitchen-sink/.storybook/config.js
+++ b/examples/html-kitchen-sink/.storybook/config.js
@ -1,5 +1,6 @@
 import { load, addParameters, addDecorator } from '@storybook/html';
 import { withA11y } from '@storybook/addon-a11y';
+import { DocsPage } from '@storybook/addon-docs/blocks';

 addDecorator(withA11y);

@ -13,7 +14,12 @@ addParameters({
  },
  options: {
    hierarchyRootSeparator: /\|/,
+    docs: {
+      iframeHeight: '200px',
+    },
  },
+  docs: DocsPage,
 });

 load(require.context('../stories', true, /\.stories\.js$/), module);
+load(require.context('../stories', true, /\.stories\.mdx$/), module);
--- a/examples/html-kitchen-sink/.storybook/presets.js
+++ b/examples/html-kitchen-sink/.storybook/presets.js
@ -0,0 +1,8 @@
+module.exports = [
+  {
+    name: '@storybook/addon-docs/html/preset',
+    options: {
+      configureJSX: true,
+    },
+  },
+];
--- a/examples/html-kitchen-sink/package.json
+++ b/examples/html-kitchen-sink/package.json
@ -1,6 +1,6 @@
 {
  "name": "html-kitchen-sink",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "private": true,
  "description": "",
  "keywords": [],
@ -14,25 +14,26 @@
    "storybook": "start-storybook -p 9006 --no-dll"
  },
  "devDependencies": {
-    "@storybook/addon-a11y": "5.2.0-beta.0",
-    "@storybook/addon-actions": "5.2.0-beta.0",
-    "@storybook/addon-backgrounds": "5.2.0-beta.0",
-    "@storybook/addon-centered": "5.2.0-beta.0",
-    "@storybook/addon-events": "5.2.0-beta.0",
-    "@storybook/addon-jest": "5.2.0-beta.0",
-    "@storybook/addon-knobs": "5.2.0-beta.0",
-    "@storybook/addon-links": "5.2.0-beta.0",
-    "@storybook/addon-notes": "5.2.0-beta.0",
-    "@storybook/addon-options": "5.2.0-beta.0",
-    "@storybook/addon-storyshots": "5.2.0-beta.0",
-    "@storybook/addon-storysource": "5.2.0-beta.0",
-    "@storybook/addon-viewport": "5.2.0-beta.0",
-    "@storybook/addons": "5.2.0-beta.0",
-    "@storybook/client-api": "5.2.0-beta.0",
-    "@storybook/core": "5.2.0-beta.0",
-    "@storybook/core-events": "5.2.0-beta.0",
-    "@storybook/html": "5.2.0-beta.0",
-    "@storybook/source-loader": "5.2.0-beta.0",
+    "@storybook/addon-a11y": "5.2.0-beta.2",
+    "@storybook/addon-actions": "5.2.0-beta.2",
+    "@storybook/addon-backgrounds": "5.2.0-beta.2",
+    "@storybook/addon-centered": "5.2.0-beta.2",
+    "@storybook/addon-docs": "5.2.0-beta.2",
+    "@storybook/addon-events": "5.2.0-beta.2",
+    "@storybook/addon-jest": "5.2.0-beta.2",
+    "@storybook/addon-knobs": "5.2.0-beta.2",
+    "@storybook/addon-links": "5.2.0-beta.2",
+    "@storybook/addon-notes": "5.2.0-beta.2",
+    "@storybook/addon-options": "5.2.0-beta.2",
+    "@storybook/addon-storyshots": "5.2.0-beta.2",
+    "@storybook/addon-storysource": "5.2.0-beta.2",
+    "@storybook/addon-viewport": "5.2.0-beta.2",
+    "@storybook/addons": "5.2.0-beta.2",
+    "@storybook/client-api": "5.2.0-beta.2",
+    "@storybook/core": "5.2.0-beta.2",
+    "@storybook/core-events": "5.2.0-beta.2",
+    "@storybook/html": "5.2.0-beta.2",
+    "@storybook/source-loader": "5.2.0-beta.2",
    "eventemitter3": "^3.1.0",
    "format-json": "^1.0.3",
    "global": "^4.3.2"
--- a/examples/html-kitchen-sink/stories/addon-docs.stories.mdx
+++ b/examples/html-kitchen-sink/stories/addon-docs.stories.mdx
@ -0,0 +1,20 @@
+import { Story, Preview, Meta } from '@storybook/addon-docs/blocks';
+
+# Storybook Docs for HTML
+
+<Meta title="Addons|Docs" />
+
+## Story definition
+
+Hallelujah! HTML is working out of the box without modification.
+How you like them apples?!
+
+<Story name="heading" height="100px">
+  {'<h1>Hello World</h1>'}
+</Story>
+
+## Story reference
+
+You can also reference an existing story from within your MDX file.
+
+<Story id="welcome--welcome" height="800px" />
--- a/examples/marko-cli/package.json
+++ b/examples/marko-cli/package.json
@ -1,6 +1,6 @@
 {
  "name": "marko-cli",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "private": true,
  "description": "Demo of how to build an app using marko-starter",
  "repository": {
@ -24,14 +24,14 @@
    "marko-starter": "^2.0.4"
  },
  "devDependencies": {
-    "@storybook/addon-a11y": "5.2.0-beta.0",
-    "@storybook/addon-actions": "5.2.0-beta.0",
-    "@storybook/addon-knobs": "5.2.0-beta.0",
-    "@storybook/addon-options": "5.2.0-beta.0",
-    "@storybook/addon-storysource": "5.2.0-beta.0",
-    "@storybook/addons": "5.2.0-beta.0",
-    "@storybook/marko": "5.2.0-beta.0",
-    "@storybook/source-loader": "5.2.0-beta.0",
+    "@storybook/addon-a11y": "5.2.0-beta.2",
+    "@storybook/addon-actions": "5.2.0-beta.2",
+    "@storybook/addon-knobs": "5.2.0-beta.2",
+    "@storybook/addon-options": "5.2.0-beta.2",
+    "@storybook/addon-storysource": "5.2.0-beta.2",
+    "@storybook/addons": "5.2.0-beta.2",
+    "@storybook/marko": "5.2.0-beta.2",
+    "@storybook/source-loader": "5.2.0-beta.2",
    "prettier": "^1.16.4",
    "webpack": "^4.33.0"
  }
--- a/examples/mithril-kitchen-sink/package.json
+++ b/examples/mithril-kitchen-sink/package.json
@ -1,6 +1,6 @@
 {
  "name": "mithril-example",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "private": true,
  "scripts": {
    "build-storybook": "build-storybook",
@ -11,20 +11,20 @@
    "mithril": "^1.1.6"
  },
  "devDependencies": {
-    "@storybook/addon-a11y": "5.2.0-beta.0",
-    "@storybook/addon-actions": "5.2.0-beta.0",
-    "@storybook/addon-backgrounds": "5.2.0-beta.0",
-    "@storybook/addon-centered": "5.2.0-beta.0",
-    "@storybook/addon-knobs": "5.2.0-beta.0",
-    "@storybook/addon-links": "5.2.0-beta.0",
-    "@storybook/addon-notes": "5.2.0-beta.0",
-    "@storybook/addon-options": "5.2.0-beta.0",
-    "@storybook/addon-storyshots": "5.2.0-beta.0",
-    "@storybook/addon-storysource": "5.2.0-beta.0",
-    "@storybook/addon-viewport": "5.2.0-beta.0",
-    "@storybook/addons": "5.2.0-beta.0",
-    "@storybook/mithril": "5.2.0-beta.0",
-    "@storybook/source-loader": "5.2.0-beta.0",
+    "@storybook/addon-a11y": "5.2.0-beta.2",
+    "@storybook/addon-actions": "5.2.0-beta.2",
+    "@storybook/addon-backgrounds": "5.2.0-beta.2",
+    "@storybook/addon-centered": "5.2.0-beta.2",
+    "@storybook/addon-knobs": "5.2.0-beta.2",
+    "@storybook/addon-links": "5.2.0-beta.2",
+    "@storybook/addon-notes": "5.2.0-beta.2",
+    "@storybook/addon-options": "5.2.0-beta.2",
+    "@storybook/addon-storyshots": "5.2.0-beta.2",
+    "@storybook/addon-storysource": "5.2.0-beta.2",
+    "@storybook/addon-viewport": "5.2.0-beta.2",
+    "@storybook/addons": "5.2.0-beta.2",
+    "@storybook/mithril": "5.2.0-beta.2",
+    "@storybook/source-loader": "5.2.0-beta.2",
    "webpack": "^4.33.0"
  }
 }
--- a/examples/official-storybook/package.json
+++ b/examples/official-storybook/package.json
@ -1,6 +1,6 @@
 {
  "name": "official-storybook",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "private": true,
  "scripts": {
    "build-storybook": "build-storybook -c ./ -s built-storybooks",
@ -15,34 +15,34 @@
  },
  "devDependencies": {
    "@packtracker/webpack-plugin": "^2.0.1",
-    "@storybook/addon-a11y": "5.2.0-beta.0",
-    "@storybook/addon-actions": "5.2.0-beta.0",
-    "@storybook/addon-backgrounds": "5.2.0-beta.0",
-    "@storybook/addon-centered": "5.2.0-beta.0",
-    "@storybook/addon-contexts": "5.2.0-beta.0",
-    "@storybook/addon-cssresources": "5.2.0-beta.0",
-    "@storybook/addon-design-assets": "5.2.0-beta.0",
-    "@storybook/addon-docs": "5.2.0-beta.0",
-    "@storybook/addon-events": "5.2.0-beta.0",
-    "@storybook/addon-graphql": "5.2.0-beta.0",
-    "@storybook/addon-info": "5.2.0-beta.0",
-    "@storybook/addon-jest": "5.2.0-beta.0",
-    "@storybook/addon-knobs": "5.2.0-beta.0",
-    "@storybook/addon-links": "5.2.0-beta.0",
-    "@storybook/addon-notes": "5.2.0-beta.0",
-    "@storybook/addon-options": "5.2.0-beta.0",
-    "@storybook/addon-queryparams": "5.2.0-beta.0",
-    "@storybook/addon-storyshots": "5.2.0-beta.0",
-    "@storybook/addon-storyshots-puppeteer": "5.2.0-beta.0",
-    "@storybook/addon-storysource": "5.2.0-beta.0",
-    "@storybook/addon-viewport": "5.2.0-beta.0",
-    "@storybook/addons": "5.2.0-beta.0",
-    "@storybook/components": "5.2.0-beta.0",
-    "@storybook/core-events": "5.2.0-beta.0",
-    "@storybook/node-logger": "5.2.0-beta.0",
-    "@storybook/react": "5.2.0-beta.0",
-    "@storybook/source-loader": "5.2.0-beta.0",
-    "@storybook/theming": "5.2.0-beta.0",
+    "@storybook/addon-a11y": "5.2.0-beta.2",
+    "@storybook/addon-actions": "5.2.0-beta.2",
+    "@storybook/addon-backgrounds": "5.2.0-beta.2",
+    "@storybook/addon-centered": "5.2.0-beta.2",
+    "@storybook/addon-contexts": "5.2.0-beta.2",
+    "@storybook/addon-cssresources": "5.2.0-beta.2",
+    "@storybook/addon-design-assets": "5.2.0-beta.2",
+    "@storybook/addon-docs": "5.2.0-beta.2",
+    "@storybook/addon-events": "5.2.0-beta.2",
+    "@storybook/addon-graphql": "5.2.0-beta.2",
+    "@storybook/addon-info": "5.2.0-beta.2",
+    "@storybook/addon-jest": "5.2.0-beta.2",
+    "@storybook/addon-knobs": "5.2.0-beta.2",
+    "@storybook/addon-links": "5.2.0-beta.2",
+    "@storybook/addon-notes": "5.2.0-beta.2",
+    "@storybook/addon-options": "5.2.0-beta.2",
+    "@storybook/addon-queryparams": "5.2.0-beta.2",
+    "@storybook/addon-storyshots": "5.2.0-beta.2",
+    "@storybook/addon-storyshots-puppeteer": "5.2.0-beta.2",
+    "@storybook/addon-storysource": "5.2.0-beta.2",
+    "@storybook/addon-viewport": "5.2.0-beta.2",
+    "@storybook/addons": "5.2.0-beta.2",
+    "@storybook/components": "5.2.0-beta.2",
+    "@storybook/core-events": "5.2.0-beta.2",
+    "@storybook/node-logger": "5.2.0-beta.2",
+    "@storybook/react": "5.2.0-beta.2",
+    "@storybook/source-loader": "5.2.0-beta.2",
+    "@storybook/theming": "5.2.0-beta.2",
    "cors": "^2.8.5",
    "cross-env": "^5.2.0",
    "enzyme-to-json": "^3.3.5",
--- a/examples/official-storybook/stories/demo/button.stories.js
+++ b/examples/official-storybook/stories/demo/button.stories.js
@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useState } from 'react';
 import { action } from '@storybook/addon-actions';
 import { Button } from '@storybook/react/demo';

@ -21,7 +21,17 @@ export const withSomeEmoji = () => (
    </span>
  </Button>
 );
-
 withSomeEmoji.story = {
  name: 'with some emoji',
 };
+
+export const withCounter = () =>
+  React.createElement(() => {
+    const [counter, setCounter] = useState(0);
+    const label = `Testing: ${counter}`;
+    return <Button onClick={() => setCounter(counter + 1)}>{label}</Button>;
+  });
+
+withCounter.story = {
+  name: 'with coumter',
+};
--- a/examples/official-storybook/stories/demo/module-stories-embed.test.js
+++ b/examples/official-storybook/stories/demo/module-stories-embed.test.js
@ -0,0 +1,21 @@
+import { render, fireEvent } from 'react-testing-library';
+import { withText, withCounter } from './button.stories';
+
+const mockAction = jest.fn();
+jest.mock('@storybook/addon-actions', () => ({
+  action: () => mockAction,
+}));
+
+describe('module story embedding', () => {
+  it('should test actions', () => {
+    const comp = render(withText());
+    fireEvent.click(comp.getByText('Hello Button'));
+    expect(mockAction).toHaveBeenCalled();
+  });
+
+  it('should test story state', () => {
+    const comp = render(withCounter());
+    fireEvent.click(comp.getByText('Testing: 0'));
+    expect(comp.getByText('Testing: 1')).toBeTruthy();
+  });
+});
--- a/examples/polymer-cli/package.json
+++ b/examples/polymer-cli/package.json
@ -1,6 +1,6 @@
 {
  "name": "polymer-cli",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "private": true,
  "scripts": {
    "build-storybook": "build-storybook",
@ -10,17 +10,17 @@
  },
  "dependencies": {
    "@polymer/polymer": "^2.6.0",
-    "@storybook/addon-a11y": "5.2.0-beta.0",
-    "@storybook/addon-actions": "5.2.0-beta.0",
-    "@storybook/addon-backgrounds": "5.2.0-beta.0",
-    "@storybook/addon-knobs": "5.2.0-beta.0",
-    "@storybook/addon-links": "5.2.0-beta.0",
-    "@storybook/addon-notes": "5.2.0-beta.0",
-    "@storybook/addon-options": "5.2.0-beta.0",
-    "@storybook/addon-storysource": "5.2.0-beta.0",
-    "@storybook/addon-viewport": "5.2.0-beta.0",
-    "@storybook/polymer": "5.2.0-beta.0",
-    "@storybook/source-loader": "5.2.0-beta.0",
+    "@storybook/addon-a11y": "5.2.0-beta.2",
+    "@storybook/addon-actions": "5.2.0-beta.2",
+    "@storybook/addon-backgrounds": "5.2.0-beta.2",
+    "@storybook/addon-knobs": "5.2.0-beta.2",
+    "@storybook/addon-links": "5.2.0-beta.2",
+    "@storybook/addon-notes": "5.2.0-beta.2",
+    "@storybook/addon-options": "5.2.0-beta.2",
+    "@storybook/addon-storysource": "5.2.0-beta.2",
+    "@storybook/addon-viewport": "5.2.0-beta.2",
+    "@storybook/polymer": "5.2.0-beta.2",
+    "@storybook/source-loader": "5.2.0-beta.2",
    "@webcomponents/webcomponentsjs": "^1.2.0",
    "global": "^4.3.2",
    "lit-html": "^1.0.0",
--- a/examples/preact-kitchen-sink/package.json
+++ b/examples/preact-kitchen-sink/package.json
@ -1,6 +1,6 @@
 {
  "name": "preact-example",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "private": true,
  "scripts": {
    "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
@ -16,21 +16,21 @@
  "devDependencies": {
    "@babel/core": "^7.3.4",
    "@babel/plugin-transform-runtime": "^7.2.0",
-    "@storybook/addon-a11y": "5.2.0-beta.0",
-    "@storybook/addon-actions": "5.2.0-beta.0",
-    "@storybook/addon-backgrounds": "5.2.0-beta.0",
-    "@storybook/addon-centered": "5.2.0-beta.0",
-    "@storybook/addon-contexts": "5.2.0-beta.0",
-    "@storybook/addon-knobs": "5.2.0-beta.0",
-    "@storybook/addon-links": "5.2.0-beta.0",
-    "@storybook/addon-notes": "5.2.0-beta.0",
-    "@storybook/addon-options": "5.2.0-beta.0",
-    "@storybook/addon-storyshots": "5.2.0-beta.0",
-    "@storybook/addon-storysource": "5.2.0-beta.0",
-    "@storybook/addon-viewport": "5.2.0-beta.0",
-    "@storybook/addons": "5.2.0-beta.0",
-    "@storybook/preact": "5.2.0-beta.0",
-    "@storybook/source-loader": "5.2.0-beta.0",
+    "@storybook/addon-a11y": "5.2.0-beta.2",
+    "@storybook/addon-actions": "5.2.0-beta.2",
+    "@storybook/addon-backgrounds": "5.2.0-beta.2",
+    "@storybook/addon-centered": "5.2.0-beta.2",
+    "@storybook/addon-contexts": "5.2.0-beta.2",
+    "@storybook/addon-knobs": "5.2.0-beta.2",
+    "@storybook/addon-links": "5.2.0-beta.2",
+    "@storybook/addon-notes": "5.2.0-beta.2",
+    "@storybook/addon-options": "5.2.0-beta.2",
+    "@storybook/addon-storyshots": "5.2.0-beta.2",
+    "@storybook/addon-storysource": "5.2.0-beta.2",
+    "@storybook/addon-viewport": "5.2.0-beta.2",
+    "@storybook/addons": "5.2.0-beta.2",
+    "@storybook/preact": "5.2.0-beta.2",
+    "@storybook/source-loader": "5.2.0-beta.2",
    "babel-loader": "^8.0.4",
    "cross-env": "^5.2.0",
    "file-loader": "^3.0.1",
--- a/examples/rax-kitchen-sink/package.json
+++ b/examples/rax-kitchen-sink/package.json
@ -1,6 +1,6 @@
 {
  "name": "rax-kitchen-sink",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "private": true,
  "scripts": {
    "test:generate-output": "jest --json --outputFile=jest-test-results.json --config=./jest-addon.config.js",
@ -24,23 +24,23 @@
    "rax-view": "^0.6.5"
  },
  "devDependencies": {
-    "@storybook/addon-a11y": "5.2.0-beta.0",
-    "@storybook/addon-actions": "5.2.0-beta.0",
-    "@storybook/addon-backgrounds": "5.2.0-beta.0",
-    "@storybook/addon-centered": "5.2.0-beta.0",
-    "@storybook/addon-events": "5.2.0-beta.0",
-    "@storybook/addon-info": "5.2.0-beta.0",
-    "@storybook/addon-jest": "5.2.0-beta.0",
-    "@storybook/addon-knobs": "5.2.0-beta.0",
-    "@storybook/addon-links": "5.2.0-beta.0",
-    "@storybook/addon-notes": "5.2.0-beta.0",
-    "@storybook/addon-options": "5.2.0-beta.0",
-    "@storybook/addon-storyshots": "5.2.0-beta.0",
-    "@storybook/addon-storysource": "5.2.0-beta.0",
-    "@storybook/addon-viewport": "5.2.0-beta.0",
-    "@storybook/addons": "5.2.0-beta.0",
-    "@storybook/rax": "5.2.0-beta.0",
-    "@storybook/source-loader": "5.2.0-beta.0",
+    "@storybook/addon-a11y": "5.2.0-beta.2",
+    "@storybook/addon-actions": "5.2.0-beta.2",
+    "@storybook/addon-backgrounds": "5.2.0-beta.2",
+    "@storybook/addon-centered": "5.2.0-beta.2",
+    "@storybook/addon-events": "5.2.0-beta.2",
+    "@storybook/addon-info": "5.2.0-beta.2",
+    "@storybook/addon-jest": "5.2.0-beta.2",
+    "@storybook/addon-knobs": "5.2.0-beta.2",
+    "@storybook/addon-links": "5.2.0-beta.2",
+    "@storybook/addon-notes": "5.2.0-beta.2",
+    "@storybook/addon-options": "5.2.0-beta.2",
+    "@storybook/addon-storyshots": "5.2.0-beta.2",
+    "@storybook/addon-storysource": "5.2.0-beta.2",
+    "@storybook/addon-viewport": "5.2.0-beta.2",
+    "@storybook/addons": "5.2.0-beta.2",
+    "@storybook/rax": "5.2.0-beta.2",
+    "@storybook/source-loader": "5.2.0-beta.2",
    "babel-eslint": "^8.2.2",
    "babel-preset-rax": "^1.0.0-beta.0",
    "rax-scripts": "^1.0.0-beta.10",
--- a/examples/riot-kitchen-sink/package.json
+++ b/examples/riot-kitchen-sink/package.json
@ -1,6 +1,6 @@
 {
  "name": "riot-example",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "private": true,
  "scripts": {
    "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
@ -16,20 +16,20 @@
  },
  "devDependencies": {
    "@babel/core": "^7.3.4",
-    "@storybook/addon-a11y": "5.2.0-beta.0",
-    "@storybook/addon-actions": "5.2.0-beta.0",
-    "@storybook/addon-backgrounds": "5.2.0-beta.0",
-    "@storybook/addon-centered": "5.2.0-beta.0",
-    "@storybook/addon-knobs": "5.2.0-beta.0",
-    "@storybook/addon-links": "5.2.0-beta.0",
-    "@storybook/addon-notes": "5.2.0-beta.0",
-    "@storybook/addon-options": "5.2.0-beta.0",
-    "@storybook/addon-storyshots": "5.2.0-beta.0",
-    "@storybook/addon-storysource": "5.2.0-beta.0",
-    "@storybook/addon-viewport": "5.2.0-beta.0",
-    "@storybook/addons": "5.2.0-beta.0",
-    "@storybook/riot": "5.2.0-beta.0",
-    "@storybook/source-loader": "5.2.0-beta.0",
+    "@storybook/addon-a11y": "5.2.0-beta.2",
+    "@storybook/addon-actions": "5.2.0-beta.2",
+    "@storybook/addon-backgrounds": "5.2.0-beta.2",
+    "@storybook/addon-centered": "5.2.0-beta.2",
+    "@storybook/addon-knobs": "5.2.0-beta.2",
+    "@storybook/addon-links": "5.2.0-beta.2",
+    "@storybook/addon-notes": "5.2.0-beta.2",
+    "@storybook/addon-options": "5.2.0-beta.2",
+    "@storybook/addon-storyshots": "5.2.0-beta.2",
+    "@storybook/addon-storysource": "5.2.0-beta.2",
+    "@storybook/addon-viewport": "5.2.0-beta.2",
+    "@storybook/addons": "5.2.0-beta.2",
+    "@storybook/riot": "5.2.0-beta.2",
+    "@storybook/source-loader": "5.2.0-beta.2",
    "babel-loader": "^8.0.4",
    "cross-env": "^5.2.0",
    "file-loader": "^3.0.1",
--- a/examples/standalone-preview/package.json
+++ b/examples/standalone-preview/package.json
@ -1,6 +1,6 @@
 {
  "name": "standalone-preview",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "private": true,
  "scripts": {
    "storybook": "parcel ./storybook.html --port 1337"
--- a/examples/svelte-kitchen-sink/package.json
+++ b/examples/svelte-kitchen-sink/package.json
@ -1,6 +1,6 @@
 {
  "name": "svelte-example",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "private": true,
  "scripts": {
    "build-storybook": "build-storybook -s public",
@ -11,19 +11,19 @@
    "global": "^4.3.2"
  },
  "devDependencies": {
-    "@storybook/addon-a11y": "5.2.0-beta.0",
-    "@storybook/addon-actions": "5.2.0-beta.0",
-    "@storybook/addon-backgrounds": "5.2.0-beta.0",
-    "@storybook/addon-centered": "5.2.0-beta.0",
-    "@storybook/addon-knobs": "5.2.0-beta.0",
-    "@storybook/addon-links": "5.2.0-beta.0",
-    "@storybook/addon-notes": "5.2.0-beta.0",
-    "@storybook/addon-options": "5.2.0-beta.0",
-    "@storybook/addon-storyshots": "5.2.0-beta.0",
-    "@storybook/addon-storysource": "5.2.0-beta.0",
-    "@storybook/addon-viewport": "5.2.0-beta.0",
-    "@storybook/addons": "5.2.0-beta.0",
-    "@storybook/source-loader": "5.2.0-beta.0",
-    "@storybook/svelte": "5.2.0-beta.0"
+    "@storybook/addon-a11y": "5.2.0-beta.2",
+    "@storybook/addon-actions": "5.2.0-beta.2",
+    "@storybook/addon-backgrounds": "5.2.0-beta.2",
+    "@storybook/addon-centered": "5.2.0-beta.2",
+    "@storybook/addon-knobs": "5.2.0-beta.2",
+    "@storybook/addon-links": "5.2.0-beta.2",
+    "@storybook/addon-notes": "5.2.0-beta.2",
+    "@storybook/addon-options": "5.2.0-beta.2",
+    "@storybook/addon-storyshots": "5.2.0-beta.2",
+    "@storybook/addon-storysource": "5.2.0-beta.2",
+    "@storybook/addon-viewport": "5.2.0-beta.2",
+    "@storybook/addons": "5.2.0-beta.2",
+    "@storybook/source-loader": "5.2.0-beta.2",
+    "@storybook/svelte": "5.2.0-beta.2"
  }
 }
--- a/examples/vue-kitchen-sink/package.json
+++ b/examples/vue-kitchen-sink/package.json
@ -1,6 +1,6 @@
 {
  "name": "vue-example",
-  "version": "5.2.0-beta.0",
+  "version": "5.2.0-beta.2",
  "private": true,
  "scripts": {
    "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
@ -15,22 +15,22 @@
  },
  "devDependencies": {
    "@babel/core": "^7.3.4",
-    "@storybook/addon-a11y": "5.2.0-beta.0",
-    "@storybook/addon-actions": "5.2.0-beta.0",
-    "@storybook/addon-backgrounds": "5.2.0-beta.0",
-    "@storybook/addon-centered": "5.2.0-beta.0",
-    "@storybook/addon-contexts": "5.2.0-beta.0",
-    "@storybook/addon-docs": "5.2.0-beta.0",
-    "@storybook/addon-knobs": "5.2.0-beta.0",
-    "@storybook/addon-links": "5.2.0-beta.0",
-    "@storybook/addon-notes": "5.2.0-beta.0",
-    "@storybook/addon-options": "5.2.0-beta.0",
-    "@storybook/addon-storyshots": "5.2.0-beta.0",
-    "@storybook/addon-storysource": "5.2.0-beta.0",
-    "@storybook/addon-viewport": "5.2.0-beta.0",
-    "@storybook/addons": "5.2.0-beta.0",
-    "@storybook/source-loader": "5.2.0-beta.0",
-    "@storybook/vue": "5.2.0-beta.0",
+    "@storybook/addon-a11y": "5.2.0-beta.2",
+    "@storybook/addon-actions": "5.2.0-beta.2",
+    "@storybook/addon-backgrounds": "5.2.0-beta.2",
+    "@storybook/addon-centered": "5.2.0-beta.2",
+    "@storybook/addon-contexts": "5.2.0-beta.2",
+    "@storybook/addon-docs": "5.2.0-beta.2",
+    "@storybook/addon-knobs": "5.2.0-beta.2",
+    "@storybook/addon-links": "5.2.0-beta.2",
+    "@storybook/addon-notes": "5.2.0-beta.2",
+    "@storybook/addon-options": "5.2.0-beta.2",
+    "@storybook/addon-storyshots": "5.2.0-beta.2",
+    "@storybook/addon-storysource": "5.2.0-beta.2",
+    "@storybook/addon-viewport": "5.2.0-beta.2",
+    "@storybook/addons": "5.2.0-beta.2",
+    "@storybook/source-loader": "5.2.0-beta.2",
+    "@storybook/vue": "5.2.0-beta.2",
    "babel-core": "^7.0.0-bridge.0",
    "babel-loader": "^8.0.5",
    "cross-env": "^5.2.0",
--- a/lerna.json
+++ b/lerna.json
@ -2,5 +2,5 @@
  "npmClient": "yarn",
  "useWorkspaces": true,
  "registry": "https://registry.npmjs.org",
-  "version": "5.2.0-beta.0"
+  "version": "5.2.0-beta.2"
 }
--- a/Show More
+++ b/Show More
				`@ -0,0 +1 @@`
				`module.exports = require('../common/index');`
				`@ -0,0 +1 @@`
				`module.exports = require('../common/preset');`