Migrate/storybook v5

.storybook/addons.tsx

@@ -7,5 +7,4 @@
 import "@storybook/addon-knobs/register";
 import "@storybook/addon-actions/register";
 import "@storybook/addon-links/register";
-import "@storybook/addon-options/register";
 /* tslint:enable */

.storybook/config.tsx

@@ -1,18 +1,28 @@
-
-import { setOptions } from "@storybook/addon-options";
-import { addDecorator, configure } from "@storybook/react";
+import { addParameters, addDecorator, configure } from '@storybook/react'
+import { create } from '@storybook/theming';
 import themeDecorator from "./theme-decorator";
 
-setOptions({
-  addonPanelInRight: true,
-  name: "React UI Kit",
+
+addParameters({
+  options: {
+    theme: create({
+      base: 'light',
+      brandTitle: 'React UI Kit',
+      brandUrl: '',
+      // To control appearance:
+      // brandImage: 'http://url.of/some.svg',
+    }),
+    isFullscreen: false,
+    panelPosition: 'right',
+  },
 });
 
-const req = require.context("../src", true, /.stories.tsx$/);
+addDecorator(themeDecorator);
+
+// automatically import all files ending in *.stories.js
+const req = require.context('../src', true, /.stories.tsx$/);
 function loadStories() {
   req.keys().forEach((filename: string) => req(filename));
 }
 
-addDecorator(themeDecorator);
-
 configure(loadStories, module);

.storybook/webpack.config.js

@@ -1,23 +1,28 @@
-const path = require("path");
-module.exports = (baseConfig, env, config) => {
-  config.module.rules.push({
-    test: /\.(ts|tsx)$/,
-    include: [
-      path.resolve(__dirname, "../src"),
-      path.resolve(__dirname, "../.storybook")
-    ],
-    use: [
-      require.resolve("cache-loader"),
+const path = require('path');
+
+module.exports = {
+  module: {
+    rules: [
       {
-        loader: require.resolve("ts-loader"),
-        options: {
-          reportFiles: ["../src"]
-        }
+        test: /\.(ts|tsx)$/,
+        include: [
+          path.resolve(__dirname, "../src"),
+          path.resolve(__dirname, "../.storybook")
+        ],
+        use: [
+          require.resolve("cache-loader"),
+          {
+            loader: require.resolve('ts-loader'),
+            options: {
+              reportFiles: ["../src"]
+            }
+          },
+          require.resolve("react-docgen-typescript-loader"),
+        ],
       },
-      require.resolve("react-docgen-typescript-loader"),
     ]
-  });
-  config.resolve.extensions.push(".ts", ".tsx");
-
-  return config;
+  },
+  resolve: {
+    extensions: ['.ts', '.tsx']
+  }
 };