change NPM organisation from kadira to storybook in code

.bithoundrc

@@ -0,0 +1,22 @@
+{
+  "ignore": [
+    "addons/links/.storybook/stories.js",
+    "addons/info/.storybook/config.js",
+    "lib/cli/generators/METEOR/template/.stories/Welcome.js",
+    "lib/storyshots/.storybook/config.js",
+    "addons/actions/.storybook/stories.js",
+    "addons/graphql/.storybook/stories.js",
+    "addons/info/.storybook/user/modify_webpack_config.js",
+    "addons/info/.storybook/webpack.config.js",
+    "addons/knobs/.storybook/user/modify_webpack_config.js",
+    "addons/options/.storybook/stories.js",
+    "lib/cli/generators/METEOR/template/.stories/Button.js",
+    "lib/cli/generators/METEOR/template/.stories/index.js",
+    "*.ts"
+  ],
+  "critics": {
+    "wc": {
+      "limit": 500
+    }
+  }
+}

.gitignore

@@ -12,3 +12,4 @@ coverage/
 build
 packages/examples/automated-*
 yarn.lock
+/**/LICENSE

CONTRIBUTING.md

@@ -33,16 +33,16 @@ To test your project against the current latest version of storybook, you can cl
   ```
   cd packages/react-storybook
   npm link
-  
+
   cd <your-project>
   npm link @kadira/storybook
-  
+
   # repeat with whichever other parts of the monorepo you are using.
   ```
 
 ### Reproductions
 
-The best way to help figure out an issue you are having is to produce a minimal reproduction against the `master` branch. 
+The best way to help figure out an issue you are having is to produce a minimal reproduction against the `master` branch.
 
 A good way to do that is using the example `test-cra` app embedded in this repository:
 
@@ -155,7 +155,7 @@ getstorybook
 Then link storybook inside the sample project with:
 
 ```sh
-npm link @kadira/storybook
+npm link @storybook/react
 ```
 
 ### Getting Changes

LICENSE

@@ -1,6 +1,6 @@
 The MIT License (MIT)
 
-Copyright (c) 2016 Your Name. <name@emailprovider.io>
+Copyright (c) 2017 Kadira Inc. <hello@kadira.io>
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

README.md

@@ -3,10 +3,11 @@
 [![Build Status](https://travis-ci.org/storybooks/storybook.svg?branch=master)](https://travis-ci.org/storybooks/storybook)
 [![CodeFactor](https://www.codefactor.io/repository/github/storybooks/storybook/badge)](https://www.codefactor.io/repository/github/storybooks/storybook)
 [![Known Vulnerabilities](https://snyk.io/test/github/storybooks/storybook/8f36abfd6697e58cd76df3526b52e4b9dc894847/badge.svg)](https://snyk.io/test/github/storybooks/storybook/8f36abfd6697e58cd76df3526b52e4b9dc894847)
-[![BCH compliance](https://bettercodehub.com/edge/badge/storybooks/storybook)](https://bettercodehub.com/results/storybooks/storybook) [![codecov](https://codecov.io/gh/storybooks/storybook/branch/master/graph/badge.svg)](https://codecov.io/gh/storybooks/storybook)  
+[![BCH compliance](https://bettercodehub.com/edge/badge/storybooks/storybook)](https://bettercodehub.com/results/storybooks/storybook) [![codecov](https://codecov.io/gh/storybooks/storybook/branch/master/graph/badge.svg)](https://codecov.io/gh/storybooks/storybook)
 [![Storybook Slack](https://storybooks-slackin.herokuapp.com/badge.svg)](https://storybooks-slackin.herokuapp.com/)
 
-Storybook is a development environment for React UI components. It allows you to browse a component library, view the different states of each component, and interactively develop and test components.
+Storybook is a development environment for UI components.
+It allows you to browse a component library, view the different states of each component, and interactively develop and test components.
 
 ## Intro
 
@@ -20,30 +21,32 @@ Storybook comes with a lot of [addons](https://storybooks.js.org/docs/react-stor
 
 First install storybook:
 ```js
-npm i -g getstorybook
+npm i -g @storybook/cli
 cd my-react-app
 getstorybook
 ```
 
 Once it's installed, you can `npm run storybook` and it will run the development server on your local machine, and give you a URL to browse some sample stories.
 
-For full documentation on using Storybook visit: https://storybooks.js.org
+For full documentation on using Storybook visit: [storybooks.js.org](https://storybooks.js.org)
 
 ## Main Projects
-- [react-storybook](packages/react-storybook) - Storybook for React components
-- [react-native-storybook](packages/react-native-storybook) - Storybook for React components
-- [storyshots](packages/storyshots) - Easy snapshot testing for storybook
-- [getstorybook](packages/getstorybook) - Streamlined installation for a variety of app types
+- [Storybook for react](app/react-storybook) - Storybook for React components
+- [Storybook for react-native](packages/react-native-storybook) - Storybook for React components
+
+## Sub Projects
+- [Storyshots](lib/storyshots) - Easy snapshot testing for storybook
+- [CLI](lib/cli) - Streamlined installation for a variety of app types
 - [examples](examples) - Code examples to illustrate different Storybook use cases
 
 ## Addons
-- [addon-actions](packages/addon-actions/) - Log actions as users interact with components in storybook
-- [addon-comments](packages/addon-comments/) - Comment on storybook stories
-- [addon-graphql](packages/addon-graphql/) - Query a GraphQL server within Storybook stories
-- [addon-info](packages/addon-info/) - Annotate stories with extra component usage information
-- [addon-knobs](packages/addon-knobs/) - Interactively edit component prop data in the Storybook UI
-- [addon-notes](packages/addon-notes/) - Annotate storybook stories with notes
-- [addon-options](packages/addon-options/) - Customize the storybook UI in code
+- [addon-actions](addon/actions/) - Log actions as users interact with components in storybook
+- [addon-comments](addon/comments/) - Comment on storybook stories
+- [addon-graphql](addon/graphql/) - Query a GraphQL server within Storybook stories
+- [addon-info](addon/info/) - Annotate stories with extra component usage information
+- [addon-knobs](addon/knobs/) - Interactively edit component prop data in the Storybook UI
+- [addon-notes](addon/notes/) - Annotate storybook stories with notes
+- [addon-options](addon/options/) - Customize the storybook UI in code
 
 ## Contributing
 

addons/actions/.storybook/addons.js

@@ -0,0 +1 @@
+import '../register';

packages/addon-links/.storybook/config.js → addons/actions/.storybook/config.js

@@ -1,2 +1,2 @@
-import * as storybook from '@kadira/storybook';
+import * as storybook from '@storybook/react';
 storybook.configure(() => require('./stories'), module);

packages/addon-actions/.storybook/stories.js → addons/actions/.storybook/stories.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import { storiesOf } from '@kadira/storybook';
+import { storiesOf } from '@storybook/react';
 import { action, decorateAction } from '../src';
 
 const pickFirst = decorateAction([

addons/actions/README.md

@@ -0,0 +1,56 @@
+# Storybook Addon Actions
+[![Greenkeeper badge](https://badges.greenkeeper.io/storybooks/storybook.svg)](https://greenkeeper.io/)
+[![Build Status](https://travis-ci.org/storybooks/storybook.svg?branch=master)](https://travis-ci.org/storybooks/storybook)
+[![CodeFactor](https://www.codefactor.io/repository/github/storybooks/storybook/badge)](https://www.codefactor.io/repository/github/storybooks/storybook)
+[![Known Vulnerabilities](https://snyk.io/test/github/storybooks/storybook/8f36abfd6697e58cd76df3526b52e4b9dc894847/badge.svg)](https://snyk.io/test/github/storybooks/storybook/8f36abfd6697e58cd76df3526b52e4b9dc894847)
+[![BCH compliance](https://bettercodehub.com/edge/badge/storybooks/storybook)](https://bettercodehub.com/results/storybooks/storybook) [![codecov](https://codecov.io/gh/storybooks/storybook/branch/master/graph/badge.svg)](https://codecov.io/gh/storybooks/storybook)
+[![Storybook Slack](https://storybooks-slackin.herokuapp.com/badge.svg)](https://storybooks-slackin.herokuapp.com/)
+
+Storybook Addon Actions can be used to display data received by event handlers in [Storybook](https://storybooks.js.org).
+
+This addon works with Storybook for:
+[React](https://github.com/storybooks/storybook/tree/master/app/react) and
+[React Native](https://github.com/storybooks/storybook/tree/master/app/react-native).
+
+![Screenshot](docs/screenshot.png)
+
+## Getting Started
+
+You can use this addon without installing it manually.
+
+Import the `action` function and use it to create actions handlers. When creating action handlers, provide a **name** to make it easier to identify.
+
+> *Note: Make sure NOT to use reserved words as function names. [issues#29](https://github.com/storybooks/storybook-addon-actions/issues/29#issuecomment-288274794)*
+
+```js
+import { storiesOf } from '@storybook/react'
+import { action } from '@storybook/addon-actions'
+
+storiesOf('Button', module)
+  .add('default view', () => (
+    <Button onClick={ action('button-click') }>
+      Hello World!
+    </Button>
+  ))
+```
+
+## Action Decorators
+
+If you wish to process action data before sending them over to the logger, you can do it with action decorators.
+
+`decorateAction` takes an array of decorator functions. Each decorator function is passed an array of arguments, and should return a new arguments array to use. `decorateAction` returns a function that can be used like `action` but will log the modified arguments instead of the original arguments.
+
+```js
+import { action, decorateAction } from '@storybook/addon-actions'
+
+const firstArgAction = decorateAction([
+  args => args.slice(0, 1)
+]);
+
+storiesOf('Button', module)
+  .add('default view', () => (
+    <Button onClick={ firstArgAction('button-click') }>
+      Hello World!
+    </Button>
+  ))
+```

packages/addon-actions/package.json → addons/actions/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "@kadira/storybook-addon-actions",
+  "name": "@storybook/addon-actions",
   "version": "1.1.3",
   "description": "Action Logger addon for storybook",
   "main": "dist/index.js",
@@ -10,20 +10,20 @@
   },
   "repository": {
     "type": "git",
-    "url": "git+https://github.com/kadirahq/storybook-addon-actions.git"
+    "url": "git+https://github.com/storybooks/storybook.git"
   },
   "keywords": [
     "storybook"
   ],
   "license": "MIT",
   "bugs": {
-    "url": "https://github.com/kadirahq/storybook-addon-actions/issues"
+    "url": "https://github.com/storybooks/storybook/issues"
   },
-  "homepage": "https://github.com/kadirahq/storybook-addon-actions#readme",
+  "homepage": "https://github.com/storybooks/storybook/tree/master/packages/addon-actions",
   "devDependencies": {
-    "@kadira/storybook": "*",
-    "@kadira/storybook-addons": "*",
-    "@kadira/storybook-ui": "*",
+    "@storybook/react": "*",
+    "@storybook/addons": "*",
+    "@storybook/ui": "*",
     "react": "^15.5.4",
     "react-dom": "^15.5.4",
     "react-test-renderer": "^15.5.4",
@@ -36,7 +36,7 @@
     "react-inspector": "^2.0.0"
   },
   "peerDependencies": {
-    "@kadira/storybook-addons": "*",
+    "@storybook/addons": "*",
     "react": "*",
     "react-dom": "*"
   }

packages/addon-actions/src/index.js → addons/actions/src/index.js

@@ -1,5 +1,5 @@
 // addons, panels and events get unique names using a prefix
-export const ADDON_ID = 'kadirahq/storybook-addon-actions';
+export const ADDON_ID = 'storybook/addon-actions';
 export const PANEL_ID = `${ADDON_ID}/actions-panel`;
 export const EVENT_ID = `${ADDON_ID}/action-event`;
 

packages/addon-actions/src/manager.js → addons/actions/src/manager.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import addons from '@kadira/storybook-addons';
+import addons from '@storybook/addons';
 import ActionLogger from './containers/ActionLogger';
 import { ADDON_ID, PANEL_ID } from './';
 

packages/addon-actions/src/preview.js → addons/actions/src/preview.js

@@ -1,4 +1,4 @@
-import addons from '@kadira/storybook-addons';
+import addons from '@storybook/addons';
 import stringify from 'json-stringify-safe';
 import { EVENT_ID } from './';
 

addons/centered/README.md

@@ -0,0 +1,78 @@
+# Storybook Centered Decorator
+[![Greenkeeper badge](https://badges.greenkeeper.io/storybooks/storybook.svg)](https://greenkeeper.io/)
+[![Build Status](https://travis-ci.org/storybooks/storybook.svg?branch=master)](https://travis-ci.org/storybooks/storybook)
+[![CodeFactor](https://www.codefactor.io/repository/github/storybooks/storybook/badge)](https://www.codefactor.io/repository/github/storybooks/storybook)
+[![Known Vulnerabilities](https://snyk.io/test/github/storybooks/storybook/8f36abfd6697e58cd76df3526b52e4b9dc894847/badge.svg)](https://snyk.io/test/github/storybooks/storybook/8f36abfd6697e58cd76df3526b52e4b9dc894847)
+[![BCH compliance](https://bettercodehub.com/edge/badge/storybooks/storybook)](https://bettercodehub.com/results/storybooks/storybook) [![codecov](https://codecov.io/gh/storybooks/storybook/branch/master/graph/badge.svg)](https://codecov.io/gh/storybooks/storybook)
+[![Storybook Slack](https://storybooks-slackin.herokuapp.com/badge.svg)](https://storybooks-slackin.herokuapp.com/)
+
+Storybook Centered Decorator can be used to center components inside the preview in [Storybook](https://storybooks.js.org).
+
+This addon works with Storybook for:
+[React](https://github.com/storybooks/storybook/tree/master/app/react).
+
+### Usage
+
+```sh
+npm i @storybook/addon-centered
+```
+
+#### As a decorator
+You can set the decorator locally:
+
+```js
+import React from 'react';
+import { storiesOf } from '@storybook/react';
+import MyComponent from '../Component';
+import centered from '@storybook/addon-centered';
+
+storiesOf('MyComponent', module)
+  .addDecorator(centered)
+  .add('without props', () => (<MyComponent />))
+  .add('with some props', () => (<MyComponent text="The Comp"/>));
+```
+
+Or you can also add this decorator globally:
+
+```js
+import { configure, addDecorator } from '@storybook/react';
+import centered from '@storybook/react-storybook-decorator-centered';
+
+addDecorator(centered);
+
+configure(function () {
+  //...
+}, module);
+```
+
+#### As an extension
+1 - Configure the extension
+
+```js
+import React from 'react';
+import { configure, setAddon } from '@storybook/react';
+import centered from '@storybook/addon-centered';
+
+setAddon({
+  addCentered(storyName, storyFn) {
+    this.add(storyName, (context) => (
+      centered.call(context, storyFn)
+    ));
+  }
+});
+
+configure(function () {
+  //...
+}, module);
+```
+
+2 - Use it in your story
+
+```js
+import React from 'react';
+import { storiesOf } from '@storybook/react';
+import Component from '../Component';
+
+storiesOf('Component', module)
+  .addCentered('without props', () => (<Component />))
+```

packages/decorator-centered/package.json → addons/centered/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "@kadira/react-storybook-decorator-centered",
+  "name": "@storybook/addon-centered",
   "version": "1.1.2",
   "description": "React Storybook decorator to center components",
   "main": "build/index.js",

packages/addon-comments/.storybook/addons.js → addons/comments/.storybook/addons.js

@@ -1,6 +1,7 @@
 // Use the line below to register this addon
-// import '@kadira/storybook-addon-comments/register';
-import '@kadira/storybook-addon-actions/register';
+// import '@storybook/addon-comments/register';
+import '@storybook/addon-actions/register';
 import '@kadira/storybook-database-cloud/register';
+
 import { init } from '../src/manager';
 init();

packages/addon-comments/.storybook/config.js → addons/comments/.storybook/config.js

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

addons/comments/README.md

@@ -0,0 +1,28 @@
+# Storybook Comments Addon
+[![Greenkeeper badge](https://badges.greenkeeper.io/storybooks/storybook.svg)](https://greenkeeper.io/)
+[![Build Status](https://travis-ci.org/storybooks/storybook.svg?branch=master)](https://travis-ci.org/storybooks/storybook)
+[![CodeFactor](https://www.codefactor.io/repository/github/storybooks/storybook/badge)](https://www.codefactor.io/repository/github/storybooks/storybook)
+[![Known Vulnerabilities](https://snyk.io/test/github/storybooks/storybook/8f36abfd6697e58cd76df3526b52e4b9dc894847/badge.svg)](https://snyk.io/test/github/storybooks/storybook/8f36abfd6697e58cd76df3526b52e4b9dc894847)
+[![BCH compliance](https://bettercodehub.com/edge/badge/storybooks/storybook)](https://bettercodehub.com/results/storybooks/storybook) [![codecov](https://codecov.io/gh/storybooks/storybook/branch/master/graph/badge.svg)](https://codecov.io/gh/storybooks/storybook)
+[![Storybook Slack](https://storybooks-slackin.herokuapp.com/badge.svg)](https://storybooks-slackin.herokuapp.com/)
+
+Storybook Comments Addon allows you to add comments for your stories in [Storybook](https://storybooks.js.org).
+
+This addon works with Storybook for:
+[React](https://github.com/storybooks/storybook/tree/master/app/react).
+
+![Screenshot](docs/screenshot.png)
+
+## Getting Started
+
+First, install the addon
+
+```sh
+npm install -D @storybook/addon-comments
+```
+
+Add this line to your `addons.js` file (create this file inside your storybook config directory if needed).
+
+```js
+import '@storybook/addon-comments/register';
+```