Upgrade to make it comparible with storybook-3.0

Author: bhoomitt

.storybook/addons.js

@@ -1,2 +1 @@
-import '@kadira/storybook/addons'
-import '@kadira/storybook-addon-knobs/register'
+import '@storybook/addon-knobs/register'

.storybook/config.js

@@ -3,9 +3,7 @@
 // This is an auto generated file with React CDK.
 // Do not modify this file.
 
-import { configure } from '@kadira/storybook'
-
-window.STORYBOOK_REACT_CLASSES = {}
+import { configure } from '@storybook/react'
 
 function loadStories () {
   require('../example/stories')

.storybook/webpack.config.js

@@ -4,12 +4,16 @@
 // Do not modify this file.
 // Use `.storybook/user/modify_webpack_config.js instead`.
 
-const config = {
+const path = require('path')
+
+module.exports = {
   module: {
-    loaders: [
-      { test: /\.css?$/, loader: 'style!css' },
-    ],
-  },
+    rules: [
+      {
+        test: /\.(css)$/,
+        loaders: ['style-loader', 'css-loader'],
+        include: path.resolve(__dirname, '../')
+      }
+    ]
+  }
 }
-
-module.exports = config

dist/index.js

@@ -9,9 +9,9 @@ var _extends = Object.assign || function (target) { for (var i = 1; i < argument
 
 var _react = require('react');
 
-var _storybookAddonActions = require('@kadira/storybook-addon-actions');
+var _addonActions = require('@storybook/addon-actions');
 
-var _storybookAddonKnobs = require('@kadira/storybook-addon-knobs');
+var _addonKnobs = require('@storybook/addon-knobs');
 
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
@@ -43,9 +43,9 @@ var propTypeKnobResolver = exports.propTypeKnobResolver = function propTypeKnobR
 
 /* eslint-disable no-multi-spaces */
 // Default simple PropType based knob map.
-var propTypeKnobsMap = [{ name: 'string', knob: _storybookAddonKnobs.text }, { name: 'number', knob: _storybookAddonKnobs.number }, { name: 'bool', knob: _storybookAddonKnobs.boolean }, { name: 'func', knob: function knob(name, value) {
-    return value || (0, _storybookAddonActions.action)(name);
-  } }, { name: 'object', knob: _storybookAddonKnobs.object }, { name: 'node', knob: _storybookAddonKnobs.text }, { name: 'element', knob: _storybookAddonKnobs.text }];
+var propTypeKnobsMap = [{ name: 'string', knob: _addonKnobs.text }, { name: 'number', knob: _addonKnobs.number }, { name: 'bool', knob: _addonKnobs.boolean }, { name: 'func', knob: function knob(name, value) {
+    return value || (0, _addonActions.action)(name);
+  } }, { name: 'object', knob: _addonKnobs.object }, { name: 'node', knob: _addonKnobs.text }, { name: 'element', knob: _addonKnobs.text }];
 
 propTypeKnobsMap.forEach(function (_ref2, weight) {
   var name = _ref2.name,
@@ -76,7 +76,7 @@ addKnobResolver({
           return _extends({}, res, _defineProperty({}, value, value));
         }, {});
 
-        return (0, _storybookAddonKnobs.select)(propName, _extends({ '': '--' }, options), defaultProps[propName]);
+        return (0, _addonKnobs.select)(propName, _extends({ '': '--' }, options), defaultProps[propName]);
       } catch (e) {}
     }
   }
@@ -92,6 +92,7 @@ var withSmartKnobs = exports.withSmartKnobs = function withSmartKnobs(story, con
 
   var finalProps = props ? Object.keys(props).reduce(function (acc, n) {
     var item = props[n];
+
     if (!item.type) {
       console.warn('There is a prop with defaultValue ' + item.defaultValue.value + ' but it wasnt specified on element.propTypes. Check story: "' + context.kind + '".');
       return acc;

example/stories/index.js

@@ -1,12 +1,12 @@
 import React from 'react'
-import { storiesOf } from '@kadira/storybook'
+import { storiesOf } from '@storybook/react'
 import { withSmartKnobs } from '../../src'
-import { withKnobs, select } from '@kadira/storybook-addon-knobs';
+import { withKnobs, select } from '@storybook/addon-knobs'
 
 import SmartKnobedComponent from './SmartKnobedComponent'
 import SmartKnobedComponentMissingProps from './SmartKnobedComponentMissingProps'
 
-const stub = fn => fn();
+const stub = fn => fn()
 
 storiesOf('Example of smart Knobs', module)
   .addDecorator(withSmartKnobs)
@@ -27,5 +27,5 @@ storiesOf('Smart Knobs with manual knobs', module)
   .addDecorator(withSmartKnobs)
   .addDecorator(withKnobs)
   .add('example', () => (
-    <SmartKnobedComponent string={ select('string', ['1', '2', '3'], '2') }/>
+    <SmartKnobedComponent string={ select('string', ['1', '2', '3'], '2') } />
   ))

package.json

@@ -13,20 +13,23 @@
   "author": "",
   "license": "MIT",
   "peerDependencies": {
-    "@kadira/storybook-addon-actions": "^3.0.0",
-    "@kadira/storybook-addon-knobs": "^3.0.0",
+    "@storybook/addon-knobs": "^3.0.0",
+    "@storybook/addon-options": "^3.0.0",
+    "@storybook/react": "^3.0.0",
     "react": "^0.14.7 || ^15.0.0"
   },
   "devDependencies": {
-    "@kadira/storybook": "^3.0.0",
-    "@kadira/storybook-addon-knobs": "^9.0.0",
+    "@storybook/addon-knobs": "^3.0.0",
+    "@storybook/addon-options": "^3.0.0",
+    "@storybook/react": "^3.0.0",
     "babel-cli": "^6.16.0",
     "babel-plugin-react-docgen": "^1.3.0",
     "babel-preset-es2015": "^6.16.0",
     "babel-preset-react": "^6.16.0",
     "babel-preset-stage-0": "^6.16.0",
     "css-loader": "^0.25.0",
     "eslint-config-taller": "^1.0.2",
+    "jest": "^20.0.4",
     "react": "^0.14.7 || ^15.0.0",
     "react-dom": "^15.3.2"
   }

src/index.js

@@ -1,6 +1,6 @@
 import { cloneElement } from 'react'
-import { action } from '@kadira/storybook-addon-actions'
-import { withKnobs, text, boolean, number, object, select } from '@kadira/storybook-addon-knobs'
+import { action } from '@storybook/addon-actions'
+import { withKnobs, text, boolean, number, object, select } from '@storybook/addon-knobs'
 
 const knobResolvers = {}
 export const addKnobResolver = ({ name, resolver, weight = 0 }) => (knobResolvers[name] = { name, resolver, weight })