diff --git a/.bithoundrc b/.bithoundrc new file mode 100644 index 000000000000..0f08915ae8fe --- /dev/null +++ b/.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 + } + } +} diff --git a/.gitignore b/.gitignore index 5e6c2eb96ac1..0c0590513766 100644 --- a/.gitignore +++ b/.gitignore @@ -12,3 +12,4 @@ coverage/ build packages/examples/automated-* yarn.lock +/**/LICENSE diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index ae12b939906d..d52575a10d07 100644 --- a/CONTRIBUTING.md +++ b/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 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 diff --git a/LICENSE b/LICENSE index c2d2a91d0e89..85a6c94557e5 100644 --- a/LICENSE +++ b/LICENSE @@ -1,6 +1,6 @@ The MIT License (MIT) -Copyright (c) 2016 Your Name. +Copyright (c) 2017 Kadira Inc. Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal diff --git a/README.md b/README.md index a33794872160..c6d3f8a30883 100644 --- a/README.md +++ b/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 diff --git a/addons/actions/.storybook/addons.js b/addons/actions/.storybook/addons.js new file mode 100644 index 000000000000..e4f70f25bfa3 --- /dev/null +++ b/addons/actions/.storybook/addons.js @@ -0,0 +1 @@ +import '../register'; diff --git a/packages/addon-links/.storybook/config.js b/addons/actions/.storybook/config.js similarity index 54% rename from packages/addon-links/.storybook/config.js rename to addons/actions/.storybook/config.js index c4434721049e..29599c59b5d2 100644 --- a/packages/addon-links/.storybook/config.js +++ b/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); diff --git a/packages/addon-actions/.storybook/stories.js b/addons/actions/.storybook/stories.js similarity index 93% rename from packages/addon-actions/.storybook/stories.js rename to addons/actions/.storybook/stories.js index b19b2acb6d51..05620ab77b5c 100644 --- a/packages/addon-actions/.storybook/stories.js +++ b/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([ diff --git a/packages/addon-actions/CHANGELOG.md b/addons/actions/CHANGELOG.md similarity index 100% rename from packages/addon-actions/CHANGELOG.md rename to addons/actions/CHANGELOG.md diff --git a/addons/actions/README.md b/addons/actions/README.md new file mode 100644 index 000000000000..77d138613e91 --- /dev/null +++ b/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', () => ( + + )) +``` + +## 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', () => ( + + )) +``` diff --git a/packages/addon-actions/docs/screenshot.png b/addons/actions/docs/screenshot.png similarity index 100% rename from packages/addon-actions/docs/screenshot.png rename to addons/actions/docs/screenshot.png diff --git a/packages/addon-actions/package.json b/addons/actions/package.json similarity index 62% rename from packages/addon-actions/package.json rename to addons/actions/package.json index 545f6f68b37f..8b6e066d0aa7 100644 --- a/packages/addon-actions/package.json +++ b/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": "*" } diff --git a/packages/addon-actions/register.js b/addons/actions/register.js similarity index 100% rename from packages/addon-actions/register.js rename to addons/actions/register.js diff --git a/packages/addon-actions/src/components/ActionLogger/index.js b/addons/actions/src/components/ActionLogger/index.js similarity index 100% rename from packages/addon-actions/src/components/ActionLogger/index.js rename to addons/actions/src/components/ActionLogger/index.js diff --git a/packages/addon-actions/src/components/ActionLogger/style.js b/addons/actions/src/components/ActionLogger/style.js similarity index 100% rename from packages/addon-actions/src/components/ActionLogger/style.js rename to addons/actions/src/components/ActionLogger/style.js diff --git a/packages/addon-actions/src/containers/ActionLogger/index.js b/addons/actions/src/containers/ActionLogger/index.js similarity index 100% rename from packages/addon-actions/src/containers/ActionLogger/index.js rename to addons/actions/src/containers/ActionLogger/index.js diff --git a/packages/addon-actions/src/index.js b/addons/actions/src/index.js similarity index 81% rename from packages/addon-actions/src/index.js rename to addons/actions/src/index.js index 15db14d506a7..a29e5c86279e 100644 --- a/packages/addon-actions/src/index.js +++ b/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`; diff --git a/packages/addon-actions/src/manager.js b/addons/actions/src/manager.js similarity index 88% rename from packages/addon-actions/src/manager.js rename to addons/actions/src/manager.js index 4728e7ac6d3d..40b57852a912 100644 --- a/packages/addon-actions/src/manager.js +++ b/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 './'; diff --git a/packages/addon-actions/src/preview.js b/addons/actions/src/preview.js similarity index 96% rename from packages/addon-actions/src/preview.js rename to addons/actions/src/preview.js index a2dfd1b31a0f..e3b58189af73 100644 --- a/packages/addon-actions/src/preview.js +++ b/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 './'; diff --git a/packages/decorator-centered/CHANGELOG.md b/addons/centered/CHANGELOG.md similarity index 100% rename from packages/decorator-centered/CHANGELOG.md rename to addons/centered/CHANGELOG.md diff --git a/addons/centered/README.md b/addons/centered/README.md new file mode 100644 index 000000000000..a69e746803ee --- /dev/null +++ b/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', () => ()) + .add('with some props', () => ()); +``` + +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', () => ()) +``` diff --git a/packages/decorator-centered/example/index.html b/addons/centered/example/index.html similarity index 100% rename from packages/decorator-centered/example/index.html rename to addons/centered/example/index.html diff --git a/packages/decorator-centered/example/index.js b/addons/centered/example/index.js similarity index 100% rename from packages/decorator-centered/example/index.js rename to addons/centered/example/index.js diff --git a/packages/decorator-centered/example/style.css b/addons/centered/example/style.css similarity index 100% rename from packages/decorator-centered/example/style.css rename to addons/centered/example/style.css diff --git a/packages/decorator-centered/package.json b/addons/centered/package.json similarity index 86% rename from packages/decorator-centered/package.json rename to addons/centered/package.json index d662cc383226..c714ff17de59 100644 --- a/packages/decorator-centered/package.json +++ b/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", diff --git a/packages/decorator-centered/src/index.js b/addons/centered/src/index.js similarity index 100% rename from packages/decorator-centered/src/index.js rename to addons/centered/src/index.js diff --git a/packages/addon-comments/.storybook/addons.js b/addons/comments/.storybook/addons.js similarity index 57% rename from packages/addon-comments/.storybook/addons.js rename to addons/comments/.storybook/addons.js index 77ece740ce29..3412984b2975 100644 --- a/packages/addon-comments/.storybook/addons.js +++ b/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(); diff --git a/packages/addon-comments/.storybook/config.js b/addons/comments/.storybook/config.js similarity index 80% rename from packages/addon-comments/.storybook/config.js rename to addons/comments/.storybook/config.js index d279dbf59011..a35b2531aa1a 100644 --- a/packages/addon-comments/.storybook/config.js +++ b/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'); diff --git a/packages/addon-comments/CHANGELOG.md b/addons/comments/CHANGELOG.md similarity index 100% rename from packages/addon-comments/CHANGELOG.md rename to addons/comments/CHANGELOG.md diff --git a/addons/comments/README.md b/addons/comments/README.md new file mode 100644 index 000000000000..8fb19d8f4ba1 --- /dev/null +++ b/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'; +``` diff --git a/packages/addon-comments/docs/screenshot.png b/addons/comments/docs/screenshot.png similarity index 100% rename from packages/addon-comments/docs/screenshot.png rename to addons/comments/docs/screenshot.png diff --git a/packages/addon-comments/manager.js b/addons/comments/manager.js similarity index 100% rename from packages/addon-comments/manager.js rename to addons/comments/manager.js diff --git a/packages/addon-comments/package.json b/addons/comments/package.json similarity index 74% rename from packages/addon-comments/package.json rename to addons/comments/package.json index 7dc5794a4175..3b25d08bec1a 100644 --- a/packages/addon-comments/package.json +++ b/addons/comments/package.json @@ -1,19 +1,19 @@ { - "name": "@kadira/storybook-addon-comments", + "name": "@storybook/addon-comments", "version": "1.9.1", "description": "Comments addon for Storybook", "keywords": [ "storybook" ], - "homepage": "https://github.com/kadirahq/storybook-addon-comments#readme", + "homepage": "https://github.com/storybooks/storybook/tree/master/packages/addon-comments", "bugs": { - "url": "https://github.com/kadirahq/storybook-addon-comments/issues" + "url": "https://github.com/storybooks/storybook/issues" }, "license": "MIT", "main": "preview.js", "repository": { "type": "git", - "url": "git+https://github.com/kadirahq/storybook-addon-comments.git" + "url": "git+https://github.com/storybooks/storybook.git" }, "scripts": { "prepublish": "node ../../scripts/prepublish.js", @@ -34,11 +34,11 @@ "react-textarea-autosize": "^4.3.0" }, "devDependencies": { - "@kadira/storybook": "*", - "@kadira/storybook-addons": "*", + "@storybook/react": "*", + "@storybook/addons": "*", "@kadira/storybook-database-cloud": "*", "@kadira/storybook-deployer": "*", - "@kadira/storybook-ui": "*", + "@storybook/ui": "*", "git-url-parse": "^6.2.2", "react": "^15.5.4", "react-dom": "^15.5.4", @@ -46,7 +46,7 @@ "shelljs": "^0.7.7" }, "peerDependencies": { - "@kadira/storybook-addons": "*", + "@storybook/addons": "*", "react": "*", "react-dom": "*" } diff --git a/packages/addon-comments/preview.js b/addons/comments/preview.js similarity index 100% rename from packages/addon-comments/preview.js rename to addons/comments/preview.js diff --git a/packages/addon-comments/register.js b/addons/comments/register.js similarity index 100% rename from packages/addon-comments/register.js rename to addons/comments/register.js diff --git a/packages/addon-comments/src/index.js b/addons/comments/src/index.js similarity index 100% rename from packages/addon-comments/src/index.js rename to addons/comments/src/index.js diff --git a/packages/addon-comments/src/manager/components/CommentForm/index.js b/addons/comments/src/manager/components/CommentForm/index.js similarity index 100% rename from packages/addon-comments/src/manager/components/CommentForm/index.js rename to addons/comments/src/manager/components/CommentForm/index.js diff --git a/packages/addon-comments/src/manager/components/CommentForm/style.js b/addons/comments/src/manager/components/CommentForm/style.js similarity index 100% rename from packages/addon-comments/src/manager/components/CommentForm/style.js rename to addons/comments/src/manager/components/CommentForm/style.js diff --git a/packages/addon-comments/src/manager/components/CommentItem/index.js b/addons/comments/src/manager/components/CommentItem/index.js similarity index 100% rename from packages/addon-comments/src/manager/components/CommentItem/index.js rename to addons/comments/src/manager/components/CommentItem/index.js diff --git a/packages/addon-comments/src/manager/components/CommentItem/style.css.js b/addons/comments/src/manager/components/CommentItem/style.css.js similarity index 100% rename from packages/addon-comments/src/manager/components/CommentItem/style.css.js rename to addons/comments/src/manager/components/CommentItem/style.css.js diff --git a/packages/addon-comments/src/manager/components/CommentItem/style.js b/addons/comments/src/manager/components/CommentItem/style.js similarity index 100% rename from packages/addon-comments/src/manager/components/CommentItem/style.js rename to addons/comments/src/manager/components/CommentItem/style.js diff --git a/packages/addon-comments/src/manager/components/CommentList/index.js b/addons/comments/src/manager/components/CommentList/index.js similarity index 100% rename from packages/addon-comments/src/manager/components/CommentList/index.js rename to addons/comments/src/manager/components/CommentList/index.js diff --git a/packages/addon-comments/src/manager/components/CommentList/style.js b/addons/comments/src/manager/components/CommentList/style.js similarity index 100% rename from packages/addon-comments/src/manager/components/CommentList/style.js rename to addons/comments/src/manager/components/CommentList/style.js diff --git a/packages/addon-comments/src/manager/components/CommentsPanel/index.js b/addons/comments/src/manager/components/CommentsPanel/index.js similarity index 100% rename from packages/addon-comments/src/manager/components/CommentsPanel/index.js rename to addons/comments/src/manager/components/CommentsPanel/index.js diff --git a/packages/addon-comments/src/manager/components/CommentsPanel/style.js b/addons/comments/src/manager/components/CommentsPanel/style.js similarity index 100% rename from packages/addon-comments/src/manager/components/CommentsPanel/style.js rename to addons/comments/src/manager/components/CommentsPanel/style.js diff --git a/packages/addon-comments/src/manager/containers/CommentsPanel/dataStore.js b/addons/comments/src/manager/containers/CommentsPanel/dataStore.js similarity index 100% rename from packages/addon-comments/src/manager/containers/CommentsPanel/dataStore.js rename to addons/comments/src/manager/containers/CommentsPanel/dataStore.js diff --git a/packages/addon-comments/src/manager/containers/CommentsPanel/dataStore.test.js b/addons/comments/src/manager/containers/CommentsPanel/dataStore.test.js similarity index 100% rename from packages/addon-comments/src/manager/containers/CommentsPanel/dataStore.test.js rename to addons/comments/src/manager/containers/CommentsPanel/dataStore.test.js diff --git a/packages/addon-comments/src/manager/containers/CommentsPanel/index.js b/addons/comments/src/manager/containers/CommentsPanel/index.js similarity index 98% rename from packages/addon-comments/src/manager/containers/CommentsPanel/index.js rename to addons/comments/src/manager/containers/CommentsPanel/index.js index a84a9b069e1a..7b7391435eab 100644 --- a/packages/addon-comments/src/manager/containers/CommentsPanel/index.js +++ b/addons/comments/src/manager/containers/CommentsPanel/index.js @@ -1,6 +1,6 @@ import PropTypes from 'prop-types'; import React, { Component } from 'react'; -import addons from '@kadira/storybook-addons'; +import addons from '@storybook/addons'; import CommentsPanel from '../../components/CommentsPanel/'; import DataStore from './dataStore'; diff --git a/packages/addon-comments/src/manager/index.js b/addons/comments/src/manager/index.js similarity index 89% rename from packages/addon-comments/src/manager/index.js rename to addons/comments/src/manager/index.js index 574d224494c0..0eacbd23ea90 100644 --- a/packages/addon-comments/src/manager/index.js +++ b/addons/comments/src/manager/index.js @@ -1,7 +1,7 @@ /* eslint import/prefer-default-export:0 */ import React from 'react'; -import addons from '@kadira/storybook-addons'; +import addons from '@storybook/addons'; import CommentsPanel from './containers/CommentsPanel'; import { ADDON_ID, PANEL_ID } from '../shared'; diff --git a/packages/addon-comments/src/preview/index.js b/addons/comments/src/preview/index.js similarity index 100% rename from packages/addon-comments/src/preview/index.js rename to addons/comments/src/preview/index.js diff --git a/packages/addon-comments/src/shared/index.js b/addons/comments/src/shared/index.js similarity index 65% rename from packages/addon-comments/src/shared/index.js rename to addons/comments/src/shared/index.js index 32be23191bb1..4051f1568522 100644 --- a/packages/addon-comments/src/shared/index.js +++ b/addons/comments/src/shared/index.js @@ -1,3 +1,3 @@ // addons, panels and events get unique names using a prefix -export const ADDON_ID = 'kadirahq/storybook-addon-comments'; +export const ADDON_ID = 'storybooks/addon-comments'; export const PANEL_ID = `${ADDON_ID}/comments-panel`; diff --git a/packages/addon-comments/src/stories/index.js b/addons/comments/src/stories/index.js similarity index 97% rename from packages/addon-comments/src/stories/index.js rename to addons/comments/src/stories/index.js index 98a7783dfe2c..9ce72cb3ace9 100644 --- a/packages/addon-comments/src/stories/index.js +++ b/addons/comments/src/stories/index.js @@ -1,5 +1,5 @@ import React from 'react'; -import { storiesOf, action } from '@kadira/storybook'; +import { storiesOf, action } from '@storybook/react'; import Button from '../index'; import CommentForm from '../manager/components/CommentForm'; import CommentList from '../manager/components/CommentList'; diff --git a/packages/addon-actions/.storybook/config.js b/addons/graphql/.storybook/config.js similarity index 54% rename from packages/addon-actions/.storybook/config.js rename to addons/graphql/.storybook/config.js index c4434721049e..29599c59b5d2 100644 --- a/packages/addon-actions/.storybook/config.js +++ b/addons/graphql/.storybook/config.js @@ -1,2 +1,2 @@ -import * as storybook from '@kadira/storybook'; +import * as storybook from '@storybook/react'; storybook.configure(() => require('./stories'), module); diff --git a/packages/addon-graphql/.storybook/stories.js b/addons/graphql/.storybook/stories.js similarity index 87% rename from packages/addon-graphql/.storybook/stories.js rename to addons/graphql/.storybook/stories.js index 196a6ba3fda8..e92ed79d4b19 100644 --- a/packages/addon-graphql/.storybook/stories.js +++ b/addons/graphql/.storybook/stories.js @@ -1,5 +1,5 @@ import React from 'react'; -import { storiesOf } from '@kadira/storybook' +import { storiesOf } from '@storybook/react' import { setupGraphiQL } from '../src' // setup the graphiql helper which can be used with the add method later diff --git a/packages/addon-graphql/CHANGELOG.md b/addons/graphql/CHANGELOG.md similarity index 100% rename from packages/addon-graphql/CHANGELOG.md rename to addons/graphql/CHANGELOG.md diff --git a/addons/graphql/README.md b/addons/graphql/README.md new file mode 100644 index 000000000000..1fd65dbc2ced --- /dev/null +++ b/addons/graphql/README.md @@ -0,0 +1,69 @@ +# Storybook GraphiQL 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 GraphiQL Addon can be used to display the GraphiQL IDE with example queries 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 + +```shell +npm install -D @storybook/addon-graphql +``` + +Import the `setupGraphiQL` function and use it to create the graphiql helper with a base url. + +```js +import { storiesOf } from '@storybook/react' +import { setupGraphiQL } from '@storybook/addon-graphql' + +// setup the graphiql helper which can be used with the add method later +const graphiql = setupGraphiQL({ url: 'http://localhost:3000/graphql' }); + +storiesOf('GraphQL Demo', module) + .add('get user info', graphiql(`{ + user(id: "1") { + name + } + }`)); +``` + +> Tip: try creating the helper in another file and import the configured graphiql helper from it + +## Advanced Setup + +The `setupGraphiQL` function also accepts a fetcher parameter which can be used to change how graphiql gets data. If the fetcher parameter is not given, it'll create a fetcher which uses the `fetch` api to make requests. The above example can also be written using a custom fetcher. + +```js +import { storiesOf } from '@storybook/react' +import { setupGraphiQL } from '@storybook/addon-graphql' + +const fetcher = function (params) { + const options = { + method: 'post', + headers: { 'Content-Type': 'application/json' }, + body: JSON.stringify(params), + }; + return fetch(url, options).then(res => res.json()); +}; + +// create the helper with a custom fetcher +const graphiql = setupGraphiQL({ fetcher }); + +storiesOf('GraphQL Demo', module) + .add('get user info', graphiql(`{ + user(id: "1") { + name + } + }`)); +``` diff --git a/packages/addon-graphql/demo/data.json b/addons/graphql/demo/data.json similarity index 100% rename from packages/addon-graphql/demo/data.json rename to addons/graphql/demo/data.json diff --git a/packages/addon-graphql/demo/index.js b/addons/graphql/demo/index.js similarity index 100% rename from packages/addon-graphql/demo/index.js rename to addons/graphql/demo/index.js diff --git a/packages/addon-graphql/demo/package.json b/addons/graphql/demo/package.json similarity index 100% rename from packages/addon-graphql/demo/package.json rename to addons/graphql/demo/package.json diff --git a/packages/addon-graphql/docs/screenshot.png b/addons/graphql/docs/screenshot.png similarity index 100% rename from packages/addon-graphql/docs/screenshot.png rename to addons/graphql/docs/screenshot.png diff --git a/packages/addon-graphql/package.json b/addons/graphql/package.json similarity index 62% rename from packages/addon-graphql/package.json rename to addons/graphql/package.json index 6e7389b1affd..7b95fd4be34d 100644 --- a/packages/addon-graphql/package.json +++ b/addons/graphql/package.json @@ -1,5 +1,5 @@ { - "name": "@kadira/storybook-addon-graphql", + "name": "@storybook/addon-graphql", "version": "1.0.1", "description": "Storybook addon to display the GraphiQL IDE", "main": "dist/index.js", @@ -10,24 +10,24 @@ }, "repository": { "type": "git", - "url": "git+https://github.com/kadirahq/storybook-addon-graphql.git" + "url": "git+https://github.com/storybooks/storybook.git" }, "keywords": [ "storybook" ], "license": "MIT", "bugs": { - "url": "https://github.com/kadirahq/storybook-addon-graphql/issues" + "url": "https://github.com/storybooks/storybook/issues" }, - "homepage": "https://github.com/kadirahq/storybook-addon-graphql#readme", + "homepage": "https://github.com/storybooks/storybook/tree/master/packages/addon-graphql", "devDependencies": { - "@kadira/storybook": "*", + "@storybook/react": "*", "react": "^15.5.4", "react-dom": "^15.5.4", "shelljs": "^0.7.7" }, "peerDependencies": { - "@kadira/storybook-addons": "*", + "@storybook/addons": "*", "react": "*" }, "dependencies": { diff --git a/packages/addon-graphql/src/components/FullScreen/index.js b/addons/graphql/src/components/FullScreen/index.js similarity index 100% rename from packages/addon-graphql/src/components/FullScreen/index.js rename to addons/graphql/src/components/FullScreen/index.js diff --git a/packages/addon-graphql/src/components/FullScreen/style.js b/addons/graphql/src/components/FullScreen/style.js similarity index 100% rename from packages/addon-graphql/src/components/FullScreen/style.js rename to addons/graphql/src/components/FullScreen/style.js diff --git a/packages/addon-graphql/src/index.js b/addons/graphql/src/index.js similarity index 100% rename from packages/addon-graphql/src/index.js rename to addons/graphql/src/index.js diff --git a/packages/addon-graphql/src/preview.js b/addons/graphql/src/preview.js similarity index 100% rename from packages/addon-graphql/src/preview.js rename to addons/graphql/src/preview.js diff --git a/packages/addon-info/.storybook/addons.js b/addons/info/.storybook/addons.js similarity index 50% rename from packages/addon-info/.storybook/addons.js rename to addons/info/.storybook/addons.js index 30ef6a90abce..0d8df7d5b1c4 100644 --- a/packages/addon-info/.storybook/addons.js +++ b/addons/info/.storybook/addons.js @@ -1,2 +1,2 @@ -import '@kadira/storybook-addon-actions/register'; +import '@storybook/addon-actions/register'; import 'react-storybook-addon-backgrounds/register'; diff --git a/packages/addon-info/.storybook/config.js b/addons/info/.storybook/config.js similarity index 76% rename from packages/addon-info/.storybook/config.js rename to addons/info/.storybook/config.js index 8bedf5aadd57..85ac9515b63c 100644 --- a/packages/addon-info/.storybook/config.js +++ b/addons/info/.storybook/config.js @@ -1,5 +1,5 @@ import React from 'react'; -import { configure, setAddon, addDecorator } from '@kadira/storybook'; +import { configure, setAddon, addDecorator } from '@storybook/react'; import InfoAddon from '../src/'; addDecorator((story) => ( diff --git a/packages/addon-info/.storybook/user/modify_webpack_config.js b/addons/info/.storybook/user/modify_webpack_config.js similarity index 100% rename from packages/addon-info/.storybook/user/modify_webpack_config.js rename to addons/info/.storybook/user/modify_webpack_config.js diff --git a/packages/addon-info/.storybook/webpack.config.js b/addons/info/.storybook/webpack.config.js similarity index 100% rename from packages/addon-info/.storybook/webpack.config.js rename to addons/info/.storybook/webpack.config.js diff --git a/packages/addon-info/CHANGELOG.md b/addons/info/CHANGELOG.md similarity index 100% rename from packages/addon-info/CHANGELOG.md rename to addons/info/CHANGELOG.md diff --git a/addons/info/README.md b/addons/info/README.md new file mode 100644 index 000000000000..c9b02e562eaa --- /dev/null +++ b/addons/info/README.md @@ -0,0 +1,62 @@ +# Storybook Info 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 Info Addon will show additional information for your stories in [Storybook](https://storybooks.js.org). +Useful when you want to display usage or other types of documentation alongside your story. + +This addon works with Storybook for: +[React](https://github.com/storybooks/storybook/tree/master/app/react). + +![Screenshot](docs/home-screenshot.png) + +## Usage + +Install the following npm module: + +```sh +npm i -D @storybook/addon-info +``` + +Then set the addon in the place you configure storybook like this: + +```js +import { configure, setAddon } from '@storybook/react'; +import infoAddon from '@storybook/addon-info'; + +setAddon(infoAddon); + +configure(function () { + //... +}, module); +``` + +Then create your stories with the `.addWithInfo` API. + +```js +import React from 'react'; +import Component from './Component'; +import { storiesOf } from '@storybook/react'; + +storiesOf('Component') + .addWithInfo( + 'simple usage', + `This is the basic usage with the button with providing a label to show the text.`, + () => ( + Click the "?" mark at top-right to view the info. + ), + ); +``` + +> Have a look at [this example](example/story.js) stories to learn more about the `addWithInfo` API. + +## The FAQ + +**Components lose their names on static build** + +Component names also get minified with other javascript code when building for production. +When creating components, set the `displayName` static property to show the correct component name on static builds. diff --git a/packages/addon-info/docs/home-screenshot.png b/addons/info/docs/home-screenshot.png similarity index 100% rename from packages/addon-info/docs/home-screenshot.png rename to addons/info/docs/home-screenshot.png diff --git a/packages/addon-info/example/Button.js b/addons/info/example/Button.js similarity index 100% rename from packages/addon-info/example/Button.js rename to addons/info/example/Button.js diff --git a/packages/addon-info/example/story.js b/addons/info/example/story.js similarity index 94% rename from packages/addon-info/example/story.js rename to addons/info/example/story.js index abe8cbf13170..cd8357b2ca83 100644 --- a/packages/addon-info/example/story.js +++ b/addons/info/example/story.js @@ -1,14 +1,15 @@ import React from 'react'; import Button from './Button'; -import { storiesOf } from '@kadira/storybook'; -import { action } from '@kadira/storybook-addon-actions'; + +import { storiesOf, action } from '@storybook/react'; +import { action } from '@storybook/addon-actions'; import backgrounds from 'react-storybook-addon-backgrounds'; -storiesOf('Button').addWithInfo( +storiesOf( + 'Button', +).addWithInfo( 'simple usage', - ` - This is the basic usage with the button with providing a label to show the text. - `, + 'This is the basic usage with the button with providing a label to show the text.', () => (
+ )) + .add('Second', () => ( + + )); +``` + +Have a look at the linkTo function: + +```js +linkTo('Toggle', 'off') +``` + +With that, you can link an event in a component to any story in the Storybook. + +* First parameter is the the story kind name (what you named with `storiesOf`). +* Second parameter is the story name (what you named with `.add`). + +> You can also pass a function instead for any of above parameter. That function accepts arguments emitted by the event and it should return a string.
+> Have a look at [PR86](https://github.com/kadirahq/react-storybook/pull/86) for more information. diff --git a/packages/addon-links/package.json b/addons/links/package.json similarity index 81% rename from packages/addon-links/package.json rename to addons/links/package.json index aa9c966bb1c9..8350f8c7647a 100644 --- a/packages/addon-links/package.json +++ b/addons/links/package.json @@ -1,5 +1,5 @@ { - "name": "@kadira/storybook-addon-links", + "name": "@storybook/addon-links", "version": "1.0.1", "description": "Story Links addon for storybook", "main": "dist/index.js", @@ -21,15 +21,15 @@ }, "homepage": "https://github.com/kadirahq/storybook-addon-links#readme", "devDependencies": { - "@kadira/storybook": "^*", - "@kadira/storybook-addons": "*", - "@kadira/storybook-ui": "*", + "@storybook/react": "^*", + "@storybook/addons": "*", + "@storybook/ui": "*", "react": "^15.5.4", "react-dom": "^15.5.4", "shelljs": "^0.7.7" }, "peerDependencies": { - "@kadira/storybook-addons": "*", + "@storybook/addons": "*", "react": "*", "react-dom": "*" } diff --git a/packages/addon-links/register.js b/addons/links/register.js similarity index 100% rename from packages/addon-links/register.js rename to addons/links/register.js diff --git a/packages/addon-links/src/index.js b/addons/links/src/index.js similarity index 100% rename from packages/addon-links/src/index.js rename to addons/links/src/index.js diff --git a/packages/addon-links/src/manager.js b/addons/links/src/manager.js similarity index 84% rename from packages/addon-links/src/manager.js rename to addons/links/src/manager.js index c868d6d1c7f4..27d635268b21 100644 --- a/packages/addon-links/src/manager.js +++ b/addons/links/src/manager.js @@ -1,4 +1,4 @@ -import addons from '@kadira/storybook-addons'; +import addons from '@storybook/addons'; import { ADDON_ID, EVENT_ID } from './'; export function register() { diff --git a/packages/addon-links/src/preview.js b/addons/links/src/preview.js similarity index 88% rename from packages/addon-links/src/preview.js rename to addons/links/src/preview.js index 3b2444489a5c..213ca71fc395 100644 --- a/packages/addon-links/src/preview.js +++ b/addons/links/src/preview.js @@ -1,4 +1,4 @@ -import addons from '@kadira/storybook-addons'; +import addons from '@storybook/addons'; import { EVENT_ID } from './'; export function linkTo(kind, story) { diff --git a/addons/notes/.storybook/addons.js b/addons/notes/.storybook/addons.js new file mode 100644 index 000000000000..d33eec83877b --- /dev/null +++ b/addons/notes/.storybook/addons.js @@ -0,0 +1 @@ +import '../src/register'; diff --git a/packages/addon-notes/.storybook/config.js b/addons/notes/.storybook/config.js similarity index 80% rename from packages/addon-notes/.storybook/config.js rename to addons/notes/.storybook/config.js index d279dbf59011..a35b2531aa1a 100644 --- a/packages/addon-notes/.storybook/config.js +++ b/addons/notes/.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'); diff --git a/packages/addon-notes/CHANGELOG.md b/addons/notes/CHANGELOG.md similarity index 100% rename from packages/addon-notes/CHANGELOG.md rename to addons/notes/CHANGELOG.md diff --git a/addons/notes/README.md b/addons/notes/README.md new file mode 100644 index 000000000000..3ce92ffba89c --- /dev/null +++ b/addons/notes/README.md @@ -0,0 +1,46 @@ +# Storybook Addon Notes +[![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 Notes allows you to write notes 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). + +![Storybook Addon Notes Demo](docs/demo.png) + +### Getting Started + +```sh +npm i --save-dev @storybook/addon-notes +``` + +Then create a file called `addons.js` in your storybook config. + +Add following content to it: + +```js +import '@storybook/addon-notes/register'; +``` + +Then write your stories like this: + +```js +import React from 'react'; + +import { storiesOf } from '@storybook/react'; +import { WithNotes } from '@storybook/addon-notes'; + +import Component from './Component'; + +storiesOf('Component', module) + .add('with some emoji', () => ( + + + + )); +``` diff --git a/packages/addon-notes/docs/demo.png b/addons/notes/docs/demo.png similarity index 100% rename from packages/addon-notes/docs/demo.png rename to addons/notes/docs/demo.png diff --git a/packages/addon-notes/package.json b/addons/notes/package.json similarity index 77% rename from packages/addon-notes/package.json rename to addons/notes/package.json index a2ca419864c3..d1769b52ec2d 100644 --- a/packages/addon-notes/package.json +++ b/addons/notes/package.json @@ -1,10 +1,10 @@ { - "name": "@kadira/storybook-addon-notes", + "name": "@storybook/addon-notes", "version": "1.0.1", - "description": "Write notes for your Storybook stories.", + "description": "Write notes for your Storybook stories.", "repository": { "type": "git", - "url": "https://github.com/kadirahq/storybook-addon-notes.git" + "url": "git+https://github.com/storybooks/storybook.git" }, "license": "MIT", "scripts": { @@ -13,7 +13,7 @@ "publish-storybook": "bash .scripts/publish_storybook.sh" }, "devDependencies": { - "@kadira/storybook": "*", + "@storybook/react": "*", "git-url-parse": "^6.2.2", "react": "^15.5.4", "react-addons-test-utils": "^15.5.1", @@ -21,7 +21,7 @@ }, "peerDependencies": { "react": "*", - "@kadira/storybook-addons": "*" + "@storybook/addons": "*" }, "dependencies": { "babel-runtime": "^6.23.0" diff --git a/packages/addon-notes/register.js b/addons/notes/register.js similarity index 100% rename from packages/addon-notes/register.js rename to addons/notes/register.js diff --git a/packages/addon-notes/src/index.js b/addons/notes/src/index.js similarity index 79% rename from packages/addon-notes/src/index.js rename to addons/notes/src/index.js index 318effe60a8a..9b39fd8ca5ed 100644 --- a/packages/addon-notes/src/index.js +++ b/addons/notes/src/index.js @@ -1,5 +1,5 @@ import React from 'react'; -import addons from '@kadira/storybook-addons'; +import addons from '@storybook/addons'; export class WithNotes extends React.Component { render() { @@ -7,7 +7,7 @@ export class WithNotes extends React.Component { const channel = addons.getChannel(); // send the notes to the channel. - channel.emit('kadira/notes/add_notes', notes); + channel.emit('storybook/notes/add_notes', notes); // return children elements. return children; } diff --git a/packages/addon-notes/src/register.js b/addons/notes/src/register.js similarity index 84% rename from packages/addon-notes/src/register.js rename to addons/notes/src/register.js index 5257c94db88a..4198ae45d10e 100644 --- a/packages/addon-notes/src/register.js +++ b/addons/notes/src/register.js @@ -1,5 +1,5 @@ import React from 'react'; -import addons from '@kadira/storybook-addons'; +import addons from '@storybook/addons'; const styles = { notesPanel: { @@ -22,7 +22,7 @@ export class Notes extends React.Component { componentDidMount() { const { channel, api } = this.props; // Listen to the notes and render it. - channel.on('kadira/notes/add_notes', this.onAddNotes); + channel.on('storybook/notes/add_notes', this.onAddNotes); // Clear the current notes on every story change. this.stopListeningOnStory = api.onStory(() => { @@ -38,7 +38,7 @@ export class Notes extends React.Component { this.unmounted = true; const { channel } = this.props; - channel.removeListener('kadira/notes/add_notes', this.onAddNotes); + channel.removeListener('storybook/notes/add_notes', this.onAddNotes); } onAddNotes(text) { @@ -63,9 +63,9 @@ Notes.propTypes = { }; // Register the addon with a unique name. -addons.register('kadira/notes', api => { +addons.register('storybook/notes', api => { // Also need to set a unique name to the panel. - addons.addPanel('kadira/notes/panel', { + addons.addPanel('storybook/notes/panel', { title: 'Notes', render: () => , }); diff --git a/packages/addon-notes/src/stories/index.js b/addons/notes/src/stories/index.js similarity index 100% rename from packages/addon-notes/src/stories/index.js rename to addons/notes/src/stories/index.js diff --git a/packages/addon-notes/src/tests/index.js b/addons/notes/src/tests/index.js similarity index 100% rename from packages/addon-notes/src/tests/index.js rename to addons/notes/src/tests/index.js diff --git a/packages/addon-notes/storybook-addon-notes.d.ts b/addons/notes/storybook-addon-notes.d.ts similarity index 100% rename from packages/addon-notes/storybook-addon-notes.d.ts rename to addons/notes/storybook-addon-notes.d.ts diff --git a/addons/options/.storybook/addons.js b/addons/options/.storybook/addons.js new file mode 100644 index 000000000000..e4f70f25bfa3 --- /dev/null +++ b/addons/options/.storybook/addons.js @@ -0,0 +1 @@ +import '../register'; diff --git a/packages/addon-options/.storybook/config.js b/addons/options/.storybook/config.js similarity index 71% rename from packages/addon-options/.storybook/config.js rename to addons/options/.storybook/config.js index c128490edbc5..339b3300e362 100644 --- a/packages/addon-options/.storybook/config.js +++ b/addons/options/.storybook/config.js @@ -1,9 +1,9 @@ -import * as storybook from '@kadira/storybook'; +import * as storybook from '@storybook/react'; import { setOptions } from '../preview'; setOptions({ name: 'CUSTOM-OPTIONS', - url: 'https://github.com/kadirahq/storybook-addon-options', + url: 'https://github.com/storybooks/storybook', // goFullScreen: false, // showLeftPanel: true, showDownPanel: false, diff --git a/packages/addon-options/.storybook/stories.js b/addons/options/.storybook/stories.js similarity index 79% rename from packages/addon-options/.storybook/stories.js rename to addons/options/.storybook/stories.js index 6046b45ca8c3..f9a2300173b9 100644 --- a/packages/addon-options/.storybook/stories.js +++ b/addons/options/.storybook/stories.js @@ -1,5 +1,5 @@ import React from 'react'; -import { storiesOf } from '@kadira/storybook'; +import { storiesOf } from '@storybook/react'; storiesOf('Hello', module) .add('Hello World', () => ( diff --git a/packages/addon-options/CHANGELOG.md b/addons/options/CHANGELOG.md similarity index 100% rename from packages/addon-options/CHANGELOG.md rename to addons/options/CHANGELOG.md diff --git a/addons/options/README.md b/addons/options/README.md new file mode 100644 index 000000000000..2a7b68030b72 --- /dev/null +++ b/addons/options/README.md @@ -0,0 +1,49 @@ +# Storybook Options 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/) + +The Options addon can be used to set configure the [Storybook](https://storybooks.js.org) UI. + +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 + +First, install the addon + +```sh +npm install -D @storybook/addon-options +``` + +Add this line to your `addons.js` file (create this file inside your storybook config directory if needed). + +```js +import '@storybook/addon-options/register'; +``` + +Import and use the `setOptions` function in your config.js file. + +```js +import * as storybook from '@storybook/react'; +import { setOptions } from '@storybook/addon-options'; + +setOptions({ + name: 'My Storybook', + url: 'https://example.com', + goFullScreen: false, + showLeftPanel: false, + showDownPanel: false, + showSearchBox: false, + downPanelInRight: false, + sortStoriesByKind: false, +}); + +storybook.configure(() => require('./stories'), module); +``` diff --git a/packages/addon-options/docs/screenshot.png b/addons/options/docs/screenshot.png similarity index 100% rename from packages/addon-options/docs/screenshot.png rename to addons/options/docs/screenshot.png diff --git a/packages/addon-options/manager.js b/addons/options/manager.js similarity index 100% rename from packages/addon-options/manager.js rename to addons/options/manager.js diff --git a/packages/addon-options/package.json b/addons/options/package.json similarity index 57% rename from packages/addon-options/package.json rename to addons/options/package.json index 620c5b490a12..bc98c5492b35 100644 --- a/packages/addon-options/package.json +++ b/addons/options/package.json @@ -1,5 +1,5 @@ { - "name": "@kadira/storybook-addon-options", + "name": "@storybook/addon-options", "version": "1.0.2", "description": "Options addon for storybook", "main": "preview.js", @@ -9,27 +9,27 @@ }, "repository": { "type": "git", - "url": "git+https://github.com/kadirahq/storybook-addon-options.git" + "url": "git+https://github.com/storybooks/storybook.git" }, "keywords": [ "storybook" ], "license": "MIT", "bugs": { - "url": "https://github.com/kadirahq/storybook-addon-options/issues" + "url": "https://github.com/storybooks/storybook/issues" }, - "homepage": "https://github.com/kadirahq/storybook-addon-options#readme", + "homepage": "https://github.com/storybooks/storybook/tree/master/packages/addon-options", "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", "shelljs": "^0.7.7" }, "peerDependencies": { - "@kadira/storybook-addons": "*", + "@storybook/addons": "*", "react": "*", "react-dom": "*" }, diff --git a/packages/addon-options/preview.js b/addons/options/preview.js similarity index 100% rename from packages/addon-options/preview.js rename to addons/options/preview.js diff --git a/packages/addon-options/register.js b/addons/options/register.js similarity index 100% rename from packages/addon-options/register.js rename to addons/options/register.js diff --git a/packages/addon-options/src/manager/index.js b/addons/options/src/manager/index.js similarity index 89% rename from packages/addon-options/src/manager/index.js rename to addons/options/src/manager/index.js index 6a56184c6ca2..ae8ec0478d05 100644 --- a/packages/addon-options/src/manager/index.js +++ b/addons/options/src/manager/index.js @@ -1,5 +1,5 @@ import React from 'react'; -import addons from '@kadira/storybook-addons'; +import addons from '@storybook/addons'; import { ADDON_ID, EVENT_ID } from '../shared'; // init function will be executed once when the storybook loads for the diff --git a/packages/addon-options/src/preview/index.js b/addons/options/src/preview/index.js similarity index 91% rename from packages/addon-options/src/preview/index.js rename to addons/options/src/preview/index.js index aa53b91c4605..90411bdae6e1 100644 --- a/packages/addon-options/src/preview/index.js +++ b/addons/options/src/preview/index.js @@ -1,4 +1,4 @@ -import addons from '@kadira/storybook-addons'; +import addons from '@storybook/addons'; import { EVENT_ID } from '../shared'; // init function will be executed once when the storybook loads for the diff --git a/packages/addon-options/src/shared/index.js b/addons/options/src/shared/index.js similarity index 64% rename from packages/addon-options/src/shared/index.js rename to addons/options/src/shared/index.js index c09e214d637d..b576c4f918b5 100644 --- a/packages/addon-options/src/shared/index.js +++ b/addons/options/src/shared/index.js @@ -1,3 +1,3 @@ // addons, panels and events get unique names using a prefix -export const ADDON_ID = 'kadirahq/storybook-addon-options'; +export const ADDON_ID = 'storybooks/storybook-addon-options'; export const EVENT_ID = `${ADDON_ID}/options-event`; diff --git a/packages/addon-options/storybook-addon-options.d.ts b/addons/options/storybook-addon-options.d.ts similarity index 100% rename from packages/addon-options/storybook-addon-options.d.ts rename to addons/options/storybook-addon-options.d.ts diff --git a/packages/react-native-storybook/.babelrc b/app/react-native/.babelrc similarity index 100% rename from packages/react-native-storybook/.babelrc rename to app/react-native/.babelrc diff --git a/packages/react-native-storybook/.npmignore b/app/react-native/.npmignore similarity index 100% rename from packages/react-native-storybook/.npmignore rename to app/react-native/.npmignore diff --git a/packages/react-native-storybook/CHANGELOG.md b/app/react-native/CHANGELOG.md similarity index 100% rename from packages/react-native-storybook/CHANGELOG.md rename to app/react-native/CHANGELOG.md diff --git a/packages/react-native-storybook/addons.js b/app/react-native/addons.js similarity index 100% rename from packages/react-native-storybook/addons.js rename to app/react-native/addons.js diff --git a/packages/react-native-storybook/docs/assets/readme/screenshot.png b/app/react-native/docs/assets/readme/screenshot.png similarity index 100% rename from packages/react-native-storybook/docs/assets/readme/screenshot.png rename to app/react-native/docs/assets/readme/screenshot.png diff --git a/packages/react-native-storybook/docs/manual-setup.md b/app/react-native/docs/manual-setup.md similarity index 80% rename from packages/react-native-storybook/docs/manual-setup.md rename to app/react-native/docs/manual-setup.md index 9bd0ab8529da..489984b2c42b 100644 --- a/packages/react-native-storybook/docs/manual-setup.md +++ b/app/react-native/docs/manual-setup.md @@ -1,16 +1,16 @@ # Manual Setup -First, install the `@kadira/react-native-storybook` module +First, install the `@storybook/react-native` module ```shell -npm i -D @kadira/react-native-storybook +npm i -D @storybook/react-native ``` Create a new directory called `storybook` in your project root and create an entry file (index.ios.js or index.android.js) as given below. (Don't forget to replace "MyApplicationName" with your app name). ```js import { AppRegistry } from 'react-native'; -import { getStorybookUI, configure } from '@kadira/react-native-storybook'; +import { getStorybookUI, configure } from '@storybook/react-native'; import './addons'; // import your stories @@ -24,9 +24,9 @@ AppRegistry.registerComponent('MyApplicationName', () => StorybookUI); Create a file named `addons.js` file in `storybook` directory to use default set of addons. -``` -import '@kadira/storybook-addon-actions'; -import '@kadira/storybook-addon-links'; +```js +import '@storybook/addon-actions'; +import '@storybook/addon-links'; ``` Then write your first story in the `stories` directory like this: @@ -35,7 +35,7 @@ Then write your first story in the `stories` directory like this: // index.js import React from 'react'; -import { storiesOf } from '@kadira/react-native-storybook'; +import { storiesOf } from '@storybook/react-native'; import { View, Text } from 'react-native'; const style = { diff --git a/packages/react-native-storybook/docs/using-devices.md b/app/react-native/docs/using-devices.md similarity index 100% rename from packages/react-native-storybook/docs/using-devices.md rename to app/react-native/docs/using-devices.md diff --git a/packages/react-native-storybook/package.json b/app/react-native/package.json similarity index 89% rename from packages/react-native-storybook/package.json rename to app/react-native/package.json index 98c71e36d752..162b0de2cd45 100644 --- a/packages/react-native-storybook/package.json +++ b/app/react-native/package.json @@ -1,5 +1,5 @@ { - "name": "@kadira/react-native-storybook", + "name": "@storybook/react-native", "version": "2.3.0", "description": "A better way to develop React Native Components for your app", "main": "dist/index.js", @@ -34,11 +34,11 @@ "react-native": "^0.43.3" }, "dependencies": { - "@kadira/storybook-addon-actions": "*", - "@kadira/storybook-addon-links": "*", - "@kadira/storybook-addons": "*", - "@kadira/storybook-channel-websocket": "*", - "@kadira/storybook-ui": "*", + "@storybook/addon-actions": "*", + "@storybook/addon-links": "*", + "@storybook/addons": "*", + "@storybook/channel-websocket": "*", + "@storybook/ui": "*", "autoprefixer": "^7.0.1", "babel-core": "^6.24.1", "babel-loader": "^7.0.0", diff --git a/app/react-native/readme.md b/app/react-native/readme.md new file mode 100644 index 000000000000..bf371a1cb3a7 --- /dev/null +++ b/app/react-native/readme.md @@ -0,0 +1,43 @@ +# Storybook for React Native +[![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/) + +With Storybook for React Native you can design and develop individual React Native components without running your app. + +![React Storybook Screenshot](docs/assets/readme/screenshot.png) + +For more information visit: [storybooks.js.org](https://storybooks.js.org) + +## Getting Started + +The `getstorybook` tool can be used to add Storybook to your React Native app. Install the `getstorybook` tool if necessary and run it from your project directory with these commands: + +```shell +npm -g i @storybook/cli +getstorybook +``` + +## Start the Storybook + +After initial setup start the storybook server with the storybook npm script. + +```shell +npm run storybook +``` + +also start your mobile app with the `react-native` command. + +``` +react-native run-ios +react-native run-android +``` + +Now, you can open to view your storybook. + +## Learn More + +Check the `docs` directory in this repo for more advanced setup guides and other info. diff --git a/packages/react-native-storybook/src/bin/storybook-build.js b/app/react-native/src/bin/storybook-build.js similarity index 100% rename from packages/react-native-storybook/src/bin/storybook-build.js rename to app/react-native/src/bin/storybook-build.js diff --git a/packages/react-native-storybook/src/bin/storybook-start.js b/app/react-native/src/bin/storybook-start.js similarity index 100% rename from packages/react-native-storybook/src/bin/storybook-start.js rename to app/react-native/src/bin/storybook-start.js diff --git a/packages/react-native-storybook/src/bin/storybook.js b/app/react-native/src/bin/storybook.js similarity index 100% rename from packages/react-native-storybook/src/bin/storybook.js rename to app/react-native/src/bin/storybook.js diff --git a/packages/react-native-storybook/src/index.js b/app/react-native/src/index.js similarity index 61% rename from packages/react-native-storybook/src/index.js rename to app/react-native/src/index.js index 2d9f9eeb61a6..1e67a4740ae6 100644 --- a/packages/react-native-storybook/src/index.js +++ b/app/react-native/src/index.js @@ -11,15 +11,15 @@ export const getStorybook = preview.getStorybook.bind(preview); export const getStorybookUI = preview.getStorybookUI.bind(preview); // NOTE export these to keep backwards compatibility -import { action as deprecatedAction } from '@kadira/storybook-addon-actions'; -import { linkTo as deprecatedLinkTo } from '@kadira/storybook-addon-links'; +import { action as deprecatedAction } from '@storybook/addon-actions'; +import { linkTo as deprecatedLinkTo } from '@storybook/addon-links'; export const action = deprecate( deprecatedAction, - '@kadira/storybook action is deprecated. See: https://github.com/storybooks/storybook/tree/master/packages/addon-actions', + '@storybook/react action is deprecated. See: https://github.com/storybooks/storybook/tree/master/packages/addon-actions', ); export const linkTo = deprecate( deprecatedLinkTo, - '@kadira/storybook linkTo is deprecated. See: https://github.com/storybooks/storybook/tree/master/packages/addon-links', + '@storybook/react linkTo is deprecated. See: https://github.com/storybooks/storybook/tree/master/packages/addon-links', ); diff --git a/packages/react-native-storybook/src/manager/index.js b/app/react-native/src/manager/index.js similarity index 77% rename from packages/react-native-storybook/src/manager/index.js rename to app/react-native/src/manager/index.js index 84b2619d9275..02ef419adaa1 100644 --- a/packages/react-native-storybook/src/manager/index.js +++ b/app/react-native/src/manager/index.js @@ -1,4 +1,4 @@ -import renderStorybookUI from '@kadira/storybook-ui'; +import renderStorybookUI from '@storybook/ui'; import Provider from './provider'; const rootEl = document.getElementById('root'); diff --git a/packages/react-native-storybook/src/manager/provider.js b/app/react-native/src/manager/provider.js similarity index 90% rename from packages/react-native-storybook/src/manager/provider.js rename to app/react-native/src/manager/provider.js index c2990bf0725d..663a5f38c276 100644 --- a/packages/react-native-storybook/src/manager/provider.js +++ b/app/react-native/src/manager/provider.js @@ -1,7 +1,7 @@ import React from 'react'; -import { Provider } from '@kadira/storybook-ui'; -import createChannel from '@kadira/storybook-channel-websocket'; -import addons from '@kadira/storybook-addons'; +import { Provider } from '@storybook/ui'; +import createChannel from '@storybook/channel-websocket'; +import addons from '@storybook/addons'; import uuid from 'uuid'; export default class ReactProvider extends Provider { diff --git a/packages/react-native-storybook/src/preview/components/StoryView/index.js b/app/react-native/src/preview/components/StoryView/index.js similarity index 100% rename from packages/react-native-storybook/src/preview/components/StoryView/index.js rename to app/react-native/src/preview/components/StoryView/index.js diff --git a/packages/react-native-storybook/src/preview/components/StoryView/style.js b/app/react-native/src/preview/components/StoryView/style.js similarity index 100% rename from packages/react-native-storybook/src/preview/components/StoryView/style.js rename to app/react-native/src/preview/components/StoryView/style.js diff --git a/packages/react-native-storybook/src/preview/index.js b/app/react-native/src/preview/index.js similarity index 95% rename from packages/react-native-storybook/src/preview/index.js rename to app/react-native/src/preview/index.js index a3c6b029ee11..a5891d04ec69 100644 --- a/packages/react-native-storybook/src/preview/index.js +++ b/app/react-native/src/preview/index.js @@ -1,6 +1,6 @@ import React from 'react'; -import addons from '@kadira/storybook-addons'; -import createChannel from '@kadira/storybook-channel-websocket'; +import addons from '@storybook/addons'; +import createChannel from '@storybook/channel-websocket'; import { EventEmitter } from 'events'; import StoryStore from './story_store'; import StoryKindApi from './story_kind'; diff --git a/packages/react-native-storybook/src/preview/story_kind.js b/app/react-native/src/preview/story_kind.js similarity index 100% rename from packages/react-native-storybook/src/preview/story_kind.js rename to app/react-native/src/preview/story_kind.js diff --git a/packages/react-native-storybook/src/preview/story_store.js b/app/react-native/src/preview/story_store.js similarity index 100% rename from packages/react-native-storybook/src/preview/story_store.js rename to app/react-native/src/preview/story_store.js diff --git a/app/react-native/src/server/addons.js b/app/react-native/src/server/addons.js new file mode 100644 index 000000000000..443c8cfc4e78 --- /dev/null +++ b/app/react-native/src/server/addons.js @@ -0,0 +1,8 @@ +import deprecate from 'util-deprecate'; +import '@storybook/addon-actions/register'; +import '@storybook/addon-links/register'; + +deprecate( + () => {}, + '@storybook/react-native/addons is deprecated. See https://storybooks.js.org/docs/react-storybook/addons/using-addons/', +)(); diff --git a/packages/react-native-storybook/src/server/config.js b/app/react-native/src/server/config.js similarity index 100% rename from packages/react-native-storybook/src/server/config.js rename to app/react-native/src/server/config.js diff --git a/packages/react-native-storybook/src/server/config/babel.js b/app/react-native/src/server/config/babel.js similarity index 100% rename from packages/react-native-storybook/src/server/config/babel.js rename to app/react-native/src/server/config/babel.js diff --git a/packages/react-native-storybook/src/server/config/babel.prod.js b/app/react-native/src/server/config/babel.prod.js similarity index 100% rename from packages/react-native-storybook/src/server/config/babel.prod.js rename to app/react-native/src/server/config/babel.prod.js diff --git a/packages/react-native-storybook/src/server/config/defaults/webpack.config.js b/app/react-native/src/server/config/defaults/webpack.config.js similarity index 100% rename from packages/react-native-storybook/src/server/config/defaults/webpack.config.js rename to app/react-native/src/server/config/defaults/webpack.config.js diff --git a/packages/react-native-storybook/src/server/config/utils.js b/app/react-native/src/server/config/utils.js similarity index 100% rename from packages/react-native-storybook/src/server/config/utils.js rename to app/react-native/src/server/config/utils.js diff --git a/packages/react-native-storybook/src/server/config/webpack.config.js b/app/react-native/src/server/config/webpack.config.js similarity index 100% rename from packages/react-native-storybook/src/server/config/webpack.config.js rename to app/react-native/src/server/config/webpack.config.js diff --git a/packages/react-native-storybook/src/server/config/webpack.config.prod.js b/app/react-native/src/server/config/webpack.config.prod.js similarity index 100% rename from packages/react-native-storybook/src/server/config/webpack.config.prod.js rename to app/react-native/src/server/config/webpack.config.prod.js diff --git a/packages/react-native-storybook/src/server/index.html.js b/app/react-native/src/server/index.html.js similarity index 100% rename from packages/react-native-storybook/src/server/index.html.js rename to app/react-native/src/server/index.html.js diff --git a/packages/react-native-storybook/src/server/index.js b/app/react-native/src/server/index.js similarity index 100% rename from packages/react-native-storybook/src/server/index.js rename to app/react-native/src/server/index.js diff --git a/packages/react-native-storybook/src/server/middleware.js b/app/react-native/src/server/middleware.js similarity index 100% rename from packages/react-native-storybook/src/server/middleware.js rename to app/react-native/src/server/middleware.js diff --git a/packages/react-storybook/.babelrc b/app/react/.babelrc similarity index 100% rename from packages/react-storybook/.babelrc rename to app/react/.babelrc diff --git a/packages/react-storybook/.npmignore b/app/react/.npmignore similarity index 100% rename from packages/react-storybook/.npmignore rename to app/react/.npmignore diff --git a/packages/react-storybook/CHANGELOG.md b/app/react/CHANGELOG.md similarity index 100% rename from packages/react-storybook/CHANGELOG.md rename to app/react/CHANGELOG.md diff --git a/app/react/README.md b/app/react/README.md new file mode 100644 index 000000000000..d96a516a2915 --- /dev/null +++ b/app/react/README.md @@ -0,0 +1,41 @@ +# Storybook for React +[![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 for React is a UI development environment for your React components. +With it, you can visualize different states of your UI components and develop them interactively. + +![React Storybook Screenshot](docs/demo.gif) + +Storybook runs outside of your app. +So you can develop UI components in isolation without worrying about app specific dependencies and requirements. + +## Getting Started + +```js +npm i -g @storybook/cli +cd my-react-app +getstorybook +``` + +For more information visit: [storybooks.js.org](https://storybooks.js.org) + +--- + +Storybook also comes with a lot of [addons](https://storybooks.js.org/docs/react-storybook/addons/introduction) and a great API to customize as you wish. +You can also build a [static version](https://storybooks.js.org/docs/react-storybook/basics/exporting-storybook) of your storybook and deploy it anywhere you want. + +Here are some featured storybooks that you can reference to see how Storybook works: + +* [Demo of React Dates](http://airbnb.io/react-dates/) - [source](https://github.com/airbnb/react-dates) +* [Demo of React Native Web](http://necolas.github.io/react-native-web/storybook/) - [source](https://github.com/necolas/react-native-web) + +## Docs + +* [Basics](https://storybooks.js.org/docs/react-storybook/basics/introduction) +* [Configurations](https://storybooks.js.org/docs/react-storybook/configurations/default-config) +* [Addons](https://storybooks.js.org/docs/react-storybook/addons/introduction) diff --git a/packages/react-storybook/ROADMAP.md b/app/react/ROADMAP.md similarity index 100% rename from packages/react-storybook/ROADMAP.md rename to app/react/ROADMAP.md diff --git a/app/react/addons.js b/app/react/addons.js new file mode 100644 index 000000000000..7919b2e36726 --- /dev/null +++ b/app/react/addons.js @@ -0,0 +1,8 @@ +import deprecate from 'util-deprecate'; +import '@storybook/addon-actions/register'; +import '@storybook/addon-links/register'; + +deprecate( + () => {}, + '@storybook/react/addons is deprecated. See https://storybooks.js.org/docs/react-storybook/addons/using-addons/', +)(); diff --git a/packages/react-storybook/config/storybook.d.ts b/app/react/config/storybook.d.ts similarity index 100% rename from packages/react-storybook/config/storybook.d.ts rename to app/react/config/storybook.d.ts diff --git a/packages/react-storybook/demo/.gitignore b/app/react/demo/.gitignore similarity index 100% rename from packages/react-storybook/demo/.gitignore rename to app/react/demo/.gitignore diff --git a/app/react/demo/.storybook/addons.js b/app/react/demo/.storybook/addons.js new file mode 100644 index 000000000000..6aed412d04af --- /dev/null +++ b/app/react/demo/.storybook/addons.js @@ -0,0 +1,2 @@ +import '@storybook/addon-actions/register'; +import '@storybook/addon-links/register'; diff --git a/packages/getstorybook/generators/REACT_SCRIPTS/template/.storybook/config.js b/app/react/demo/.storybook/config.js similarity index 65% rename from packages/getstorybook/generators/REACT_SCRIPTS/template/.storybook/config.js rename to app/react/demo/.storybook/config.js index 73cb7ab555fd..35430210ce65 100644 --- a/packages/getstorybook/generators/REACT_SCRIPTS/template/.storybook/config.js +++ b/app/react/demo/.storybook/config.js @@ -1,4 +1,4 @@ -import { configure } from '@kadira/storybook'; +import { configure } from '@storybook/react'; function loadStories() { require('../src/stories'); diff --git a/packages/react-storybook/demo/README.md b/app/react/demo/README.md similarity index 100% rename from packages/react-storybook/demo/README.md rename to app/react/demo/README.md diff --git a/packages/react-storybook/demo/package.json b/app/react/demo/package.json similarity index 69% rename from packages/react-storybook/demo/package.json rename to app/react/demo/package.json index 6f5f6fc054a8..fb92e767005f 100644 --- a/packages/react-storybook/demo/package.json +++ b/app/react/demo/package.json @@ -4,10 +4,10 @@ "private": true, "devDependencies": { "react-scripts": "0.9.5", - "@kadira/storybook": "file:../", - "@kadira/storybook-addon-actions": "file:../../addon-actions", - "@kadira/storybook-addon-links": "file:../../addon-links", - "@kadira/storybook-addons": "file:../../addons" + "@storybook/react": "file:../", + "@storybook/addon-actions": "file:../../addon-actions", + "@storybook/addon-links": "file:../../addon-links", + "@storybook/addons": "file:../../addons" }, "dependencies": { "prop-types": "^15.5.8", diff --git a/packages/react-storybook/demo/public/favicon.ico b/app/react/demo/public/favicon.ico similarity index 100% rename from packages/react-storybook/demo/public/favicon.ico rename to app/react/demo/public/favicon.ico diff --git a/packages/react-storybook/demo/public/index.html b/app/react/demo/public/index.html similarity index 100% rename from packages/react-storybook/demo/public/index.html rename to app/react/demo/public/index.html diff --git a/packages/react-storybook/demo/src/App.css b/app/react/demo/src/App.css similarity index 100% rename from packages/react-storybook/demo/src/App.css rename to app/react/demo/src/App.css diff --git a/packages/react-storybook/demo/src/App.js b/app/react/demo/src/App.js similarity index 100% rename from packages/react-storybook/demo/src/App.js rename to app/react/demo/src/App.js diff --git a/packages/react-storybook/demo/src/App.test.js b/app/react/demo/src/App.test.js similarity index 100% rename from packages/react-storybook/demo/src/App.test.js rename to app/react/demo/src/App.test.js diff --git a/packages/react-storybook/demo/src/index.css b/app/react/demo/src/index.css similarity index 100% rename from packages/react-storybook/demo/src/index.css rename to app/react/demo/src/index.css diff --git a/packages/react-storybook/demo/src/index.js b/app/react/demo/src/index.js similarity index 100% rename from packages/react-storybook/demo/src/index.js rename to app/react/demo/src/index.js diff --git a/packages/react-storybook/demo/src/logo.svg b/app/react/demo/src/logo.svg similarity index 100% rename from packages/react-storybook/demo/src/logo.svg rename to app/react/demo/src/logo.svg diff --git a/packages/getstorybook/generators/REACT/template/stories/Button.js b/app/react/demo/src/stories/Button.js similarity index 100% rename from packages/getstorybook/generators/REACT/template/stories/Button.js rename to app/react/demo/src/stories/Button.js diff --git a/packages/react-storybook/demo/src/stories/Welcome.js b/app/react/demo/src/stories/Welcome.js similarity index 100% rename from packages/react-storybook/demo/src/stories/Welcome.js rename to app/react/demo/src/stories/Welcome.js diff --git a/packages/getstorybook/generators/REACT/template/stories/index.js b/app/react/demo/src/stories/index.js similarity index 71% rename from packages/getstorybook/generators/REACT/template/stories/index.js rename to app/react/demo/src/stories/index.js index aab92a8a0eca..87e31def937b 100644 --- a/packages/getstorybook/generators/REACT/template/stories/index.js +++ b/app/react/demo/src/stories/index.js @@ -1,7 +1,9 @@ import React from 'react'; -import { storiesOf } from '@kadira/storybook'; -import { action } from '@kadira/storybook-addon-actions'; -import { linkTo } from '@kadira/storybook-addon-links'; + +import { storiesOf } from '@storybook/react'; +import { action } from '@storybook/addon-actions'; +import { linkTo } from '@storybook/addon-links'; + import Button from './Button'; import Welcome from './Welcome'; diff --git a/packages/react-storybook/docs/demo.gif b/app/react/docs/demo.gif similarity index 100% rename from packages/react-storybook/docs/demo.gif rename to app/react/docs/demo.gif diff --git a/packages/react-storybook/docs/react_storybook_screenshot.png b/app/react/docs/react_storybook_screenshot.png similarity index 100% rename from packages/react-storybook/docs/react_storybook_screenshot.png rename to app/react/docs/react_storybook_screenshot.png diff --git a/packages/react-storybook/docs/storybooks_io_logo.png b/app/react/docs/storybooks_io_logo.png similarity index 100% rename from packages/react-storybook/docs/storybooks_io_logo.png rename to app/react/docs/storybooks_io_logo.png diff --git a/packages/react-storybook/package.json b/app/react/package.json similarity index 90% rename from packages/react-storybook/package.json rename to app/react/package.json index 1c0e108c2e83..025abf4a4765 100644 --- a/packages/react-storybook/package.json +++ b/app/react/package.json @@ -1,5 +1,5 @@ { - "name": "@kadira/storybook", + "name": "@storybook/react", "version": "2.35.3", "description": "React Storybook: Isolate React Component Development with Hot Reloading.", "license": "MIT", @@ -19,11 +19,11 @@ "prepublish": "node ../../scripts/prepublish.js" }, "dependencies": { - "@kadira/storybook-addon-actions": "*", - "@kadira/storybook-addon-links": "*", - "@kadira/storybook-addons": "*", - "@kadira/storybook-channel-postmsg": "*", - "@kadira/storybook-ui": "*", + "@storybook/addon-actions": "*", + "@storybook/addon-links": "*", + "@storybook/addons": "*", + "@storybook/channel-postmessage": "*", + "@storybook/ui": "*", "airbnb-js-shims": "^1.1.1", "autoprefixer": "^7.0.1", "babel-core": "^6.24.1", diff --git a/packages/react-storybook/src/client/index.js b/app/react/src/client/index.js similarity index 55% rename from packages/react-storybook/src/client/index.js rename to app/react/src/client/index.js index 0e681f81b0eb..60c757a1f0e4 100644 --- a/packages/react-storybook/src/client/index.js +++ b/app/react/src/client/index.js @@ -8,15 +8,15 @@ export const configure = previewApi.configure; export const getStorybook = previewApi.getStorybook; // NOTE export these to keep backwards compatibility -import { action as deprecatedAction } from '@kadira/storybook-addon-actions'; -import { linkTo as deprecatedLinkTo } from '@kadira/storybook-addon-links'; +import { action as deprecatedAction } from '@storybook/addon-actions'; +import { linkTo as deprecatedLinkTo } from '@storybook/addon-links'; export const action = deprecate( deprecatedAction, - '@kadira/storybook action is deprecated. See: https://github.com/storybooks/storybook/tree/master/packages/addon-actions', + '@storybook/react action is deprecated. See: https://github.com/storybooks/storybook/tree/master/packages/addon-actions', ); export const linkTo = deprecate( deprecatedLinkTo, - '@kadira/storybook linkTo is deprecated. See: https://github.com/storybooks/storybook/tree/master/packages/addon-links', + '@storybook/react linkTo is deprecated. See: https://github.com/storybooks/storybook/tree/master/packages/addon-links', ); diff --git a/packages/react-storybook/src/client/manager/index.js b/app/react/src/client/manager/index.js similarity index 73% rename from packages/react-storybook/src/client/manager/index.js rename to app/react/src/client/manager/index.js index b377c72e7160..24082de7ca54 100644 --- a/packages/react-storybook/src/client/manager/index.js +++ b/app/react/src/client/manager/index.js @@ -1,6 +1,6 @@ /* global document */ -import renderStorybookUI from '@kadira/storybook-ui'; +import renderStorybookUI from '@storybook/ui'; import Provider from './provider'; const rootEl = document.getElementById('root'); diff --git a/packages/react-storybook/src/client/manager/preview.js b/app/react/src/client/manager/preview.js similarity index 100% rename from packages/react-storybook/src/client/manager/preview.js rename to app/react/src/client/manager/preview.js diff --git a/packages/react-storybook/src/client/manager/provider.js b/app/react/src/client/manager/provider.js similarity index 88% rename from packages/react-storybook/src/client/manager/provider.js rename to app/react/src/client/manager/provider.js index d690fb02a472..918f228cfcf6 100644 --- a/packages/react-storybook/src/client/manager/provider.js +++ b/app/react/src/client/manager/provider.js @@ -2,9 +2,9 @@ import qs from 'qs'; import React from 'react'; -import { Provider } from '@kadira/storybook-ui'; -import addons from '@kadira/storybook-addons'; -import createChannel from '@kadira/storybook-channel-postmsg'; +import { Provider } from '@storybook/ui'; +import addons from '@storybook/addons'; +import createChannel from '@storybook/channel-postmessage'; import Preview from './preview'; export default class ReactProvider extends Provider { diff --git a/packages/react-storybook/src/client/preview/actions.js b/app/react/src/client/preview/actions.js similarity index 100% rename from packages/react-storybook/src/client/preview/actions.js rename to app/react/src/client/preview/actions.js diff --git a/packages/react-storybook/src/client/preview/client_api.js b/app/react/src/client/preview/client_api.js similarity index 100% rename from packages/react-storybook/src/client/preview/client_api.js rename to app/react/src/client/preview/client_api.js diff --git a/packages/react-storybook/src/client/preview/client_api.test.js b/app/react/src/client/preview/client_api.test.js similarity index 100% rename from packages/react-storybook/src/client/preview/client_api.test.js rename to app/react/src/client/preview/client_api.test.js diff --git a/packages/react-storybook/src/client/preview/config_api.js b/app/react/src/client/preview/config_api.js similarity index 100% rename from packages/react-storybook/src/client/preview/config_api.js rename to app/react/src/client/preview/config_api.js diff --git a/packages/react-storybook/src/client/preview/error_display.js b/app/react/src/client/preview/error_display.js similarity index 100% rename from packages/react-storybook/src/client/preview/error_display.js rename to app/react/src/client/preview/error_display.js diff --git a/packages/react-storybook/src/client/preview/index.js b/app/react/src/client/preview/index.js similarity index 93% rename from packages/react-storybook/src/client/preview/index.js rename to app/react/src/client/preview/index.js index 14abf6828f88..60508441eeee 100644 --- a/packages/react-storybook/src/client/preview/index.js +++ b/app/react/src/client/preview/index.js @@ -1,8 +1,8 @@ /* global window */ import { createStore } from 'redux'; -import addons from '@kadira/storybook-addons'; -import createChannel from '@kadira/storybook-channel-postmsg'; +import addons from '@storybook/addons'; +import createChannel from '@storybook/channel-postmessage'; import qs from 'qs'; import StoryStore from './story_store'; import ClientApi from './client_api'; diff --git a/packages/react-storybook/src/client/preview/init.js b/app/react/src/client/preview/init.js similarity index 89% rename from packages/react-storybook/src/client/preview/init.js rename to app/react/src/client/preview/init.js index 0e149bb5ae5a..a8de2d28f168 100644 --- a/packages/react-storybook/src/client/preview/init.js +++ b/app/react/src/client/preview/init.js @@ -1,4 +1,4 @@ -import keyEvents from '@kadira/storybook-ui/dist/libs/key_events'; +import keyEvents from '@storybook/ui/dist/libs/key_events'; import { selectStory } from './actions'; export default function(context) { diff --git a/packages/react-storybook/src/client/preview/reducer.js b/app/react/src/client/preview/reducer.js similarity index 100% rename from packages/react-storybook/src/client/preview/reducer.js rename to app/react/src/client/preview/reducer.js diff --git a/packages/react-storybook/src/client/preview/render.js b/app/react/src/client/preview/render.js similarity index 100% rename from packages/react-storybook/src/client/preview/render.js rename to app/react/src/client/preview/render.js diff --git a/packages/react-storybook/src/client/preview/story_store.js b/app/react/src/client/preview/story_store.js similarity index 100% rename from packages/react-storybook/src/client/preview/story_store.js rename to app/react/src/client/preview/story_store.js diff --git a/app/react/src/server/addons.js b/app/react/src/server/addons.js new file mode 100644 index 000000000000..6aed412d04af --- /dev/null +++ b/app/react/src/server/addons.js @@ -0,0 +1,2 @@ +import '@storybook/addon-actions/register'; +import '@storybook/addon-links/register'; diff --git a/packages/react-storybook/src/server/babel_config.js b/app/react/src/server/babel_config.js similarity index 100% rename from packages/react-storybook/src/server/babel_config.js rename to app/react/src/server/babel_config.js diff --git a/packages/react-storybook/src/server/build.js b/app/react/src/server/build.js similarity index 100% rename from packages/react-storybook/src/server/build.js rename to app/react/src/server/build.js diff --git a/packages/react-storybook/src/server/config.js b/app/react/src/server/config.js similarity index 100% rename from packages/react-storybook/src/server/config.js rename to app/react/src/server/config.js diff --git a/packages/react-storybook/src/server/config/WatchMissingNodeModulesPlugin.js b/app/react/src/server/config/WatchMissingNodeModulesPlugin.js similarity index 100% rename from packages/react-storybook/src/server/config/WatchMissingNodeModulesPlugin.js rename to app/react/src/server/config/WatchMissingNodeModulesPlugin.js diff --git a/packages/react-storybook/src/server/config/babel.js b/app/react/src/server/config/babel.js similarity index 100% rename from packages/react-storybook/src/server/config/babel.js rename to app/react/src/server/config/babel.js diff --git a/packages/react-storybook/src/server/config/babel.prod.js b/app/react/src/server/config/babel.prod.js similarity index 100% rename from packages/react-storybook/src/server/config/babel.prod.js rename to app/react/src/server/config/babel.prod.js diff --git a/packages/react-storybook/src/server/config/defaults/webpack.config.js b/app/react/src/server/config/defaults/webpack.config.js similarity index 100% rename from packages/react-storybook/src/server/config/defaults/webpack.config.js rename to app/react/src/server/config/defaults/webpack.config.js diff --git a/packages/react-storybook/src/server/config/globals.js b/app/react/src/server/config/globals.js similarity index 100% rename from packages/react-storybook/src/server/config/globals.js rename to app/react/src/server/config/globals.js diff --git a/packages/react-storybook/src/server/config/polyfills.js b/app/react/src/server/config/polyfills.js similarity index 100% rename from packages/react-storybook/src/server/config/polyfills.js rename to app/react/src/server/config/polyfills.js diff --git a/packages/react-storybook/src/server/config/utils.js b/app/react/src/server/config/utils.js similarity index 100% rename from packages/react-storybook/src/server/config/utils.js rename to app/react/src/server/config/utils.js diff --git a/packages/react-storybook/src/server/config/webpack.config.js b/app/react/src/server/config/webpack.config.js similarity index 100% rename from packages/react-storybook/src/server/config/webpack.config.js rename to app/react/src/server/config/webpack.config.js diff --git a/packages/react-storybook/src/server/config/webpack.config.prod.js b/app/react/src/server/config/webpack.config.prod.js similarity index 100% rename from packages/react-storybook/src/server/config/webpack.config.prod.js rename to app/react/src/server/config/webpack.config.prod.js diff --git a/packages/react-storybook/src/server/iframe.html.js b/app/react/src/server/iframe.html.js similarity index 100% rename from packages/react-storybook/src/server/iframe.html.js rename to app/react/src/server/iframe.html.js diff --git a/packages/react-storybook/src/server/index.html.js b/app/react/src/server/index.html.js similarity index 100% rename from packages/react-storybook/src/server/index.html.js rename to app/react/src/server/index.html.js diff --git a/packages/react-storybook/src/server/index.js b/app/react/src/server/index.js similarity index 97% rename from packages/react-storybook/src/server/index.js rename to app/react/src/server/index.js index 7a347c540884..2a45dc04c046 100755 --- a/packages/react-storybook/src/server/index.js +++ b/app/react/src/server/index.js @@ -10,7 +10,6 @@ import shelljs from 'shelljs'; import storybook from './middleware'; import packageJson from '../../package.json'; import { parseList, getEnvConfig } from './utils'; -import { track, dontTrack } from './track_usage'; process.env.NODE_ENV = process.env.NODE_ENV || 'development'; @@ -22,7 +21,6 @@ program .option('-h, --host [string]', 'Host to run Storybook') .option('-s, --static-dir ', 'Directory where to load static files from') .option('-c, --config-dir [dir-name]', 'Directory where to load Storybook configurations from') - .option('--dont-track', 'Do not send anonymous usage stats.') .option( '--https', 'Serve Storybook over HTTPS. Note: You must provide your own certificate information.', @@ -147,6 +145,5 @@ server.listen(...listenAddr, error => { } else { const address = `http://${program.host || 'localhost'}:${program.port}/`; logger.info(`\nReact Storybook started on => ${chalk.cyan(address)}\n`); - track(); } }); diff --git a/packages/react-storybook/src/server/middleware.js b/app/react/src/server/middleware.js similarity index 100% rename from packages/react-storybook/src/server/middleware.js rename to app/react/src/server/middleware.js diff --git a/packages/react-storybook/src/server/public/favicon.ico b/app/react/src/server/public/favicon.ico similarity index 100% rename from packages/react-storybook/src/server/public/favicon.ico rename to app/react/src/server/public/favicon.ico diff --git a/packages/react-storybook/src/server/utils.js b/app/react/src/server/utils.js similarity index 100% rename from packages/react-storybook/src/server/utils.js rename to app/react/src/server/utils.js diff --git a/packages/react-storybook/src/server/utils.test.js b/app/react/src/server/utils.test.js similarity index 100% rename from packages/react-storybook/src/server/utils.test.js rename to app/react/src/server/utils.test.js diff --git a/examples/cra-storybook/.storybook/addons.js b/examples/cra-storybook/.storybook/addons.js index e8590efcf2fd..6aed412d04af 100644 --- a/examples/cra-storybook/.storybook/addons.js +++ b/examples/cra-storybook/.storybook/addons.js @@ -1,2 +1,2 @@ -import '@kadira/storybook-addon-actions/register'; -import '@kadira/storybook-addon-links/register'; +import '@storybook/addon-actions/register'; +import '@storybook/addon-links/register'; diff --git a/examples/cra-storybook/.storybook/config.js b/examples/cra-storybook/.storybook/config.js index 73cb7ab555fd..35430210ce65 100644 --- a/examples/cra-storybook/.storybook/config.js +++ b/examples/cra-storybook/.storybook/config.js @@ -1,4 +1,4 @@ -import { configure } from '@kadira/storybook'; +import { configure } from '@storybook/react'; function loadStories() { require('../src/stories'); diff --git a/examples/cra-storybook/package.json b/examples/cra-storybook/package.json index 437fc4720a00..12fd5ece265a 100644 --- a/examples/cra-storybook/package.json +++ b/examples/cra-storybook/package.json @@ -3,10 +3,10 @@ "version": "1.0.0", "private": true, "devDependencies": { - "@kadira/storybook": "*", - "@kadira/storybook-addons": "*", - "@kadira/storybook-addon-actions": "*", - "@kadira/storybook-addon-links": "*", + "@storybook/react": "*", + "@storybook/addons": "*", + "@storybook/addon-actions": "*", + "@storybook/addon-links": "*", "react-scripts": "0.9.5" }, "dependencies": { diff --git a/examples/cra-storybook/src/stories/index.js b/examples/cra-storybook/src/stories/index.js index aab92a8a0eca..87e31def937b 100644 --- a/examples/cra-storybook/src/stories/index.js +++ b/examples/cra-storybook/src/stories/index.js @@ -1,7 +1,9 @@ import React from 'react'; -import { storiesOf } from '@kadira/storybook'; -import { action } from '@kadira/storybook-addon-actions'; -import { linkTo } from '@kadira/storybook-addon-links'; + +import { storiesOf } from '@storybook/react'; +import { action } from '@storybook/addon-actions'; +import { linkTo } from '@storybook/addon-links'; + import Button from './Button'; import Welcome from './Welcome'; diff --git a/examples/test-cra/.storybook/addons.js b/examples/test-cra/.storybook/addons.js index e8590efcf2fd..6aed412d04af 100644 --- a/examples/test-cra/.storybook/addons.js +++ b/examples/test-cra/.storybook/addons.js @@ -1,2 +1,2 @@ -import '@kadira/storybook-addon-actions/register'; -import '@kadira/storybook-addon-links/register'; +import '@storybook/addon-actions/register'; +import '@storybook/addon-links/register'; diff --git a/examples/test-cra/.storybook/config.js b/examples/test-cra/.storybook/config.js index 73cb7ab555fd..35430210ce65 100644 --- a/examples/test-cra/.storybook/config.js +++ b/examples/test-cra/.storybook/config.js @@ -1,4 +1,4 @@ -import { configure } from '@kadira/storybook'; +import { configure } from '@storybook/react'; function loadStories() { require('../src/stories'); diff --git a/examples/test-cra/package.json b/examples/test-cra/package.json index f65caf56a70a..48132c3e74aa 100644 --- a/examples/test-cra/package.json +++ b/examples/test-cra/package.json @@ -15,13 +15,13 @@ "react-dom": "^15.5.4" }, "devDependencies": { - "@kadira/storybook": "file:../../packages/react-storybook", - "@kadira/storybook-addon-actions": "file:../../packages/addon-actions", - "@kadira/storybook-addon-links": "file:../../packages/addon-links", - "@kadira/storybook-addons": "file:../../packages/addons", - "@kadira/storybook-channel": "file:../../packages/channel", - "@kadira/storybook-channel-postmsg": "file:../../packages/channel-postmessage", - "@kadira/storybook-ui": "file:../../packages/storybook-ui", + "@storybook/react": "file:../../app/react", + "@storybook/addon-actions": "file:../../addons/actions", + "@storybook/addon-links": "file:../../addons/links", + "@storybook/addons": "file:../../lib/addons", + "@storybook/channels": "file:../../lib/channels", + "@storybook/channel-postmessage": "file:../../lib/channel-postmessage", + "@storybook/ui": "file:../../lib/ui", "react-scripts": "0.9.5" }, "private": true diff --git a/examples/test-cra/src/stories/index.js b/examples/test-cra/src/stories/index.js index aab92a8a0eca..87e31def937b 100644 --- a/examples/test-cra/src/stories/index.js +++ b/examples/test-cra/src/stories/index.js @@ -1,7 +1,9 @@ import React from 'react'; -import { storiesOf } from '@kadira/storybook'; -import { action } from '@kadira/storybook-addon-actions'; -import { linkTo } from '@kadira/storybook-addon-links'; + +import { storiesOf } from '@storybook/react'; +import { action } from '@storybook/addon-actions'; +import { linkTo } from '@storybook/addon-links'; + import Button from './Button'; import Welcome from './Welcome'; diff --git a/lerna.json b/lerna.json index 413fb378438c..0d51b7fd9149 100644 --- a/lerna.json +++ b/lerna.json @@ -6,10 +6,17 @@ "ignore": [ "test-cra" ] + }, + "exec": { + "ignore": [ + "test-cra" + ] } }, "packages": [ - "packages/*", + "app/*", + "lib/*", + "addons/*", "examples/*" ], "concurrency": 1 diff --git a/packages/addons/CHANGELOG.md b/lib/addons/CHANGELOG.md similarity index 100% rename from packages/addons/CHANGELOG.md rename to lib/addons/CHANGELOG.md diff --git a/lib/addons/README.md b/lib/addons/README.md new file mode 100644 index 000000000000..aca757babd40 --- /dev/null +++ b/lib/addons/README.md @@ -0,0 +1,15 @@ +# Storybook Addons +[![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 Addons is a node module which is used to load custom addons to storybook. + +It stores addon loaders, communication channel and other resources which can be used by storybook implementations where required. + +--- + +For more information visit: [storybooks.js.org](https://storybooks.js.org) diff --git a/packages/addons/package.json b/lib/addons/package.json similarity index 56% rename from packages/addons/package.json rename to lib/addons/package.json index 40b4cc5a8eec..d4b7da73fb73 100644 --- a/packages/addons/package.json +++ b/lib/addons/package.json @@ -1,5 +1,5 @@ { - "name": "@kadira/storybook-addons", + "name": "@storybook/addons", "version": "1.6.1", "description": "Storybook addons store", "main": "dist/index.js", @@ -8,16 +8,16 @@ }, "repository": { "type": "git", - "url": "git+https://github.com/kadirahq/storybook-addons.git" + "url": "git+https://github.com/storybooks/storybook.git" }, "keywords": [ "storybook" ], "license": "MIT", "bugs": { - "url": "https://github.com/kadirahq/storybook-addons/issues" + "url": "https://github.com/storybooks/storybook/issues" }, - "homepage": "https://github.com/kadirahq/storybook-addons#readme", + "homepage": "https://github.com/storybooks/storybook/tree/master/packages/addons", "devDependencies": { "shelljs": "^0.7.7" } diff --git a/packages/addons/src/index.js b/lib/addons/src/index.js similarity index 100% rename from packages/addons/src/index.js rename to lib/addons/src/index.js diff --git a/packages/channel-postmessage/CHANGELOG.md b/lib/channel-postmessage/CHANGELOG.md similarity index 100% rename from packages/channel-postmessage/CHANGELOG.md rename to lib/channel-postmessage/CHANGELOG.md diff --git a/lib/channel-postmessage/README.md b/lib/channel-postmessage/README.md new file mode 100644 index 000000000000..7ba34a45e7b7 --- /dev/null +++ b/lib/channel-postmessage/README.md @@ -0,0 +1,19 @@ +# Storybook PostMessage Channel +[![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 PostMessage Channel is a channel for Storybook that can be used when the Storybook Renderer runs inside an iframe or a child window. +A channel can be created using the `createChannel` function. + +```js +import createChannel from '@storybook/channel-postmessage' +const channel = createChannel({ key: 'postmsg-key' }) +``` + +--- + +For more information visit: [storybooks.js.org](https://storybooks.js.org) diff --git a/packages/channel-postmessage/package.json b/lib/channel-postmessage/package.json similarity index 73% rename from packages/channel-postmessage/package.json rename to lib/channel-postmessage/package.json index 2f42bda77a99..fe832cf5c4b3 100644 --- a/packages/channel-postmessage/package.json +++ b/lib/channel-postmessage/package.json @@ -1,5 +1,5 @@ { - "name": "@kadira/storybook-channel-postmsg", + "name": "@storybook/channel-postmessage", "version": "2.0.1", "description": "", "main": "dist/index.js", @@ -11,7 +11,7 @@ "shelljs": "^0.7.7" }, "dependencies": { - "@kadira/storybook-channel": "*", + "@storybook/channels": "*", "json-stringify-safe": "^5.0.1" } } diff --git a/packages/channel-postmessage/src/index.js b/lib/channel-postmessage/src/index.js similarity index 97% rename from packages/channel-postmessage/src/index.js rename to lib/channel-postmessage/src/index.js index d3a73b82db33..7f33c58535fe 100644 --- a/packages/channel-postmessage/src/index.js +++ b/lib/channel-postmessage/src/index.js @@ -1,4 +1,4 @@ -import Channel from '@kadira/storybook-channel'; +import Channel from '@storybook/channels'; import stringify from 'json-stringify-safe'; export const KEY = 'storybook-channel'; diff --git a/packages/channel-websocket/CHANGELOG.md b/lib/channel-websocket/CHANGELOG.md similarity index 100% rename from packages/channel-websocket/CHANGELOG.md rename to lib/channel-websocket/CHANGELOG.md diff --git a/lib/channel-websocket/README.md b/lib/channel-websocket/README.md new file mode 100644 index 000000000000..8a82f82a0e35 --- /dev/null +++ b/lib/channel-websocket/README.md @@ -0,0 +1,19 @@ +# Storybook Websocket Channel +[![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 Websocket Channel is a channel for Storybook that can be used when the Storybook Renderer should communicate with the Storybook Manager over the network. +A channel can be created using the `createChannel` function. + +```js +import createChannel from '@storybook/channel-websocket' +const channel = createChannel({ url: 'ws://localhost:9001' }) +``` + +--- + +For more information visit: [storybooks.js.org](https://storybooks.js.org) diff --git a/packages/channel-websocket/package.json b/lib/channel-websocket/package.json similarity index 69% rename from packages/channel-websocket/package.json rename to lib/channel-websocket/package.json index 7d4ccea376eb..68e0eac7d7c3 100644 --- a/packages/channel-websocket/package.json +++ b/lib/channel-websocket/package.json @@ -1,5 +1,5 @@ { - "name": "@kadira/storybook-channel-websocket", + "name": "@storybook/channel-websocket", "version": "1.0.1", "description": "", "main": "dist/index.js", @@ -11,6 +11,6 @@ "shelljs": "^0.7.7" }, "dependencies": { - "@kadira/storybook-channel": "^1.0.1" + "@storybook/channels": "^1.0.1" } } diff --git a/packages/channel-websocket/src/index.js b/lib/channel-websocket/src/index.js similarity index 96% rename from packages/channel-websocket/src/index.js rename to lib/channel-websocket/src/index.js index 17c059d13b22..c969ca63078f 100644 --- a/packages/channel-websocket/src/index.js +++ b/lib/channel-websocket/src/index.js @@ -1,4 +1,4 @@ -import Channel from '@kadira/storybook-channel'; +import Channel from '@storybook/channels'; export default function createChannel({ url }) { const transport = new WebsocketTransport({ url }); diff --git a/packages/channel/CHANGELOG.md b/lib/channels/CHANGELOG.md similarity index 100% rename from packages/channel/CHANGELOG.md rename to lib/channels/CHANGELOG.md diff --git a/lib/channels/README.md b/lib/channels/README.md new file mode 100644 index 000000000000..36b8bc255766 --- /dev/null +++ b/lib/channels/README.md @@ -0,0 +1,47 @@ +# Storybook Channel +[![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 Channel is similar to an EventEmitter. +Channels are used with Storybook implementations to send/receive events between the Storybook Manager and the Storybook Renderer. + +```js +Channel { + addListener(type, listener) + emit(type, ...args) + eventNames() + listenerCount(type) + listeners(type) + on(type, listener) + once(type, listener) + prependListener(type, listener) + prependOnceListener(type, listener) + removeAllListeners(type) + removeListener(type, listener) +} +``` + +The channel takes a Transport object as a parameter which will be used to send/receive messages. The transport object should implement this interface. + +```js +Transport { + send(event) + setHandler(handler) +} +``` + +Currently, channels are baked into storybook implementations and therefore this module is not designed to be used directly by addon developers. When developing addons, use the `getChannel` method exported by `@storybook/addons` module. For this to work, Storybook implementations should use the `setChannel` method before loading addons. + +```js +import addons from '@storybook/addons'; + +const channel = addons.getChannel(); +``` + +--- + +For more information visit: [storybooks.js.org](https://storybooks.js.org) diff --git a/packages/channel/package.json b/lib/channels/package.json similarity index 80% rename from packages/channel/package.json rename to lib/channels/package.json index 1a743edeb3fe..7b0d2c434fe0 100644 --- a/packages/channel/package.json +++ b/lib/channels/package.json @@ -1,5 +1,5 @@ { - "name": "@kadira/storybook-channel", + "name": "@storybook/channels", "version": "1.1.0", "description": "", "main": "dist/index.js", diff --git a/packages/channel/src/index.js b/lib/channels/src/index.js similarity index 100% rename from packages/channel/src/index.js rename to lib/channels/src/index.js diff --git a/packages/channel/src/index.test.js b/lib/channels/src/index.test.js similarity index 100% rename from packages/channel/src/index.test.js rename to lib/channels/src/index.test.js diff --git a/packages/getstorybook/CHANGELOG.md b/lib/cli/CHANGELOG.md similarity index 100% rename from packages/getstorybook/CHANGELOG.md rename to lib/cli/CHANGELOG.md diff --git a/lib/cli/README.md b/lib/cli/README.md new file mode 100644 index 000000000000..e0897f57c4d5 --- /dev/null +++ b/lib/cli/README.md @@ -0,0 +1,42 @@ +# Storybook CLI +[![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 CLI is the easiest way to add [Storybook](https://github.com/storybooks/storybook) to your project. + +In the future it will also add other useful generators and migration tooling. + +![Screenshot](docs/getstorybook.png) + +First install the storybook cli globally. + +```sh +npm i -g @storybook/cli +``` + +Then go to your project run: + +```sh +getstorybook +``` + +That's all you've to do. + +--- + +## [Yarn](https://github.com/yarnpkg/yarn) support + +It also supports yarn. +If you have installed yarn in your system, it'll detect it and use `yarn` instead of `npm`. + +If you don't want to use `yarn` always you can use the `--use-npm` option like this: + +```sh +getstorybook --use-npm +``` + +For more information visit: [storybooks.js.org](https://storybooks.js.org) diff --git a/packages/getstorybook/bin/generate.js b/lib/cli/bin/generate.js similarity index 100% rename from packages/getstorybook/bin/generate.js rename to lib/cli/bin/generate.js diff --git a/packages/getstorybook/docs/getstorybook.png b/lib/cli/docs/getstorybook.png similarity index 100% rename from packages/getstorybook/docs/getstorybook.png rename to lib/cli/docs/getstorybook.png diff --git a/packages/getstorybook/generators/METEOR/index.js b/lib/cli/generators/METEOR/index.js similarity index 96% rename from packages/getstorybook/generators/METEOR/index.js rename to lib/cli/generators/METEOR/index.js index f6f9a54254f4..d3e9dcbefed1 100644 --- a/packages/getstorybook/generators/METEOR/index.js +++ b/lib/cli/generators/METEOR/index.js @@ -39,7 +39,7 @@ if (fs.existsSync('.babelrc')) { fs.writeFileSync('.babelrc', JSON.stringify(babelrc, null, 2), 'utf8'); // write the new package.json. -packageJson.devDependencies['@kadira/storybook'] = '^2.21.0'; +packageJson.devDependencies['@storybook/react'] = '^2.21.0'; packageJson.scripts['storybook'] = 'start-storybook -p 6006'; packageJson.scripts['build-storybook'] = 'build-storybook'; diff --git a/packages/getstorybook/generators/METEOR/template/.stories/Button.js b/lib/cli/generators/METEOR/template/.stories/Button.js similarity index 100% rename from packages/getstorybook/generators/METEOR/template/.stories/Button.js rename to lib/cli/generators/METEOR/template/.stories/Button.js diff --git a/packages/getstorybook/generators/METEOR/template/.stories/Welcome.js b/lib/cli/generators/METEOR/template/.stories/Welcome.js similarity index 95% rename from packages/getstorybook/generators/METEOR/template/.stories/Welcome.js rename to lib/cli/generators/METEOR/template/.stories/Welcome.js index d57d4c843864..1e456d98f89d 100644 --- a/packages/getstorybook/generators/METEOR/template/.stories/Welcome.js +++ b/lib/cli/generators/METEOR/template/.stories/Welcome.js @@ -64,7 +64,7 @@ export default class Welcome extends React.Component {

This is just one thing you can do with Storybook.
- Have a look at the React Storybook repo for more information. + Have a look at the React Storybook repo for more information.

); diff --git a/packages/getstorybook/generators/METEOR/template/.stories/index.js b/lib/cli/generators/METEOR/template/.stories/index.js similarity index 71% rename from packages/getstorybook/generators/METEOR/template/.stories/index.js rename to lib/cli/generators/METEOR/template/.stories/index.js index 95b016935243..1e71865f35e7 100644 --- a/packages/getstorybook/generators/METEOR/template/.stories/index.js +++ b/lib/cli/generators/METEOR/template/.stories/index.js @@ -1,7 +1,9 @@ import React from 'react'; -import { storiesOf } from '@kadira/react-native-storybook'; -import { action } from '@kadira/storybook-addon-actions'; -import { linkTo } from '@kadira/storybook-addon-links'; + +import { storiesOf } from '@storybook/react'; +import { action } from '@storybook/addon-actions'; +import { linkTo } from '@storybook/addon-links'; + import Button from './Button'; import Welcome from './Welcome'; diff --git a/lib/cli/generators/METEOR/template/.storybook/addons.js b/lib/cli/generators/METEOR/template/.storybook/addons.js new file mode 100644 index 000000000000..6aed412d04af --- /dev/null +++ b/lib/cli/generators/METEOR/template/.storybook/addons.js @@ -0,0 +1,2 @@ +import '@storybook/addon-actions/register'; +import '@storybook/addon-links/register'; diff --git a/packages/getstorybook/generators/METEOR/template/.storybook/config.js b/lib/cli/generators/METEOR/template/.storybook/config.js similarity index 64% rename from packages/getstorybook/generators/METEOR/template/.storybook/config.js rename to lib/cli/generators/METEOR/template/.storybook/config.js index 45095fa78a2d..140143dad399 100644 --- a/packages/getstorybook/generators/METEOR/template/.storybook/config.js +++ b/lib/cli/generators/METEOR/template/.storybook/config.js @@ -1,4 +1,4 @@ -import { configure } from '@kadira/storybook'; +import { configure } from '@storybook/react'; function loadStories() { require('../.stories'); diff --git a/packages/getstorybook/generators/WEBPACK_REACT/index.js b/lib/cli/generators/REACT/index.js similarity index 90% rename from packages/getstorybook/generators/WEBPACK_REACT/index.js rename to lib/cli/generators/REACT/index.js index c20fac033bef..d85df39ccf9c 100644 --- a/packages/getstorybook/generators/WEBPACK_REACT/index.js +++ b/lib/cli/generators/REACT/index.js @@ -8,7 +8,7 @@ const packageJson = helpers.getPackageJson(); // TODO: Get the latest version of storybook here. packageJson.devDependencies = packageJson.devDependencies || {}; -packageJson.devDependencies['@kadira/storybook'] = '^2.21.0'; +packageJson.devDependencies['@storybook/react'] = '^2.21.0'; packageJson.scripts = packageJson.scripts || {}; packageJson.scripts['storybook'] = 'start-storybook -p 6006'; diff --git a/lib/cli/generators/REACT/template/.storybook/addons.js b/lib/cli/generators/REACT/template/.storybook/addons.js new file mode 100644 index 000000000000..6aed412d04af --- /dev/null +++ b/lib/cli/generators/REACT/template/.storybook/addons.js @@ -0,0 +1,2 @@ +import '@storybook/addon-actions/register'; +import '@storybook/addon-links/register'; diff --git a/packages/getstorybook/generators/REACT/template/.storybook/config.js b/lib/cli/generators/REACT/template/.storybook/config.js similarity index 64% rename from packages/getstorybook/generators/REACT/template/.storybook/config.js rename to lib/cli/generators/REACT/template/.storybook/config.js index 8e314a81f7bb..9154670ab327 100644 --- a/packages/getstorybook/generators/REACT/template/.storybook/config.js +++ b/lib/cli/generators/REACT/template/.storybook/config.js @@ -1,4 +1,4 @@ -import { configure } from '@kadira/storybook'; +import { configure } from '@storybook/react'; function loadStories() { require('../stories'); diff --git a/packages/getstorybook/generators/REACT_SCRIPTS/template/src/stories/Button.js b/lib/cli/generators/REACT/template/stories/Button.js similarity index 100% rename from packages/getstorybook/generators/REACT_SCRIPTS/template/src/stories/Button.js rename to lib/cli/generators/REACT/template/stories/Button.js diff --git a/packages/storyshots/stories/required_with_context/Welcome.js b/lib/cli/generators/REACT/template/stories/Welcome.js similarity index 95% rename from packages/storyshots/stories/required_with_context/Welcome.js rename to lib/cli/generators/REACT/template/stories/Welcome.js index 4e9ee8eb7317..c732bf4d1a8f 100644 --- a/packages/storyshots/stories/required_with_context/Welcome.js +++ b/lib/cli/generators/REACT/template/stories/Welcome.js @@ -77,7 +77,7 @@ export default class Welcome extends React.Component {
Have a look at the {' '} - + React Storybook {' '} diff --git a/packages/getstorybook/generators/WEBPACK_REACT/template/stories/index.js b/lib/cli/generators/REACT/template/stories/index.js similarity index 86% rename from packages/getstorybook/generators/WEBPACK_REACT/template/stories/index.js rename to lib/cli/generators/REACT/template/stories/index.js index ee5770241712..3c061d101dc9 100644 --- a/packages/getstorybook/generators/WEBPACK_REACT/template/stories/index.js +++ b/lib/cli/generators/REACT/template/stories/index.js @@ -1,5 +1,5 @@ import React from 'react'; -import { storiesOf, action, linkTo } from '@kadira/storybook'; +import { storiesOf, action, linkTo } from '@storybook/react'; import Button from './Button'; import Welcome from './Welcome'; diff --git a/packages/getstorybook/generators/REACT_NATIVE/index.js b/lib/cli/generators/REACT_NATIVE/index.js similarity index 93% rename from packages/getstorybook/generators/REACT_NATIVE/index.js rename to lib/cli/generators/REACT_NATIVE/index.js index 00e9c7cfdae0..4662b91d6770 100644 --- a/packages/getstorybook/generators/REACT_NATIVE/index.js +++ b/lib/cli/generators/REACT_NATIVE/index.js @@ -19,7 +19,7 @@ const packageJson = helpers.getPackageJson(); // TODO: Get the latest version of storybook here. packageJson.devDependencies = packageJson.devDependencies || {}; -packageJson.devDependencies['@kadira/react-native-storybook'] = '^2.0.0'; +packageJson.devDependencies['@storybook/react-native'] = '^2.0.0'; packageJson.scripts = packageJson.scripts || {}; packageJson.scripts['storybook'] = 'storybook start -p 7007'; diff --git a/lib/cli/generators/REACT_NATIVE/template/storybook/addons.js b/lib/cli/generators/REACT_NATIVE/template/storybook/addons.js new file mode 100644 index 000000000000..6aed412d04af --- /dev/null +++ b/lib/cli/generators/REACT_NATIVE/template/storybook/addons.js @@ -0,0 +1,2 @@ +import '@storybook/addon-actions/register'; +import '@storybook/addon-links/register'; diff --git a/packages/getstorybook/generators/REACT_NATIVE/template/storybook/index.android.js b/lib/cli/generators/REACT_NATIVE/template/storybook/index.android.js similarity index 76% rename from packages/getstorybook/generators/REACT_NATIVE/template/storybook/index.android.js rename to lib/cli/generators/REACT_NATIVE/template/storybook/index.android.js index 0dc3a5a82b86..72e2ce02ca71 100644 --- a/packages/getstorybook/generators/REACT_NATIVE/template/storybook/index.android.js +++ b/lib/cli/generators/REACT_NATIVE/template/storybook/index.android.js @@ -1,5 +1,5 @@ import { AppRegistry } from 'react-native'; -import { getStorybookUI, configure } from '@kadira/react-native-storybook'; +import { getStorybookUI, configure } from '@storybook/react-native'; // import stories configure(() => { diff --git a/packages/getstorybook/generators/REACT_NATIVE/template/storybook/index.ios.js b/lib/cli/generators/REACT_NATIVE/template/storybook/index.ios.js similarity index 76% rename from packages/getstorybook/generators/REACT_NATIVE/template/storybook/index.ios.js rename to lib/cli/generators/REACT_NATIVE/template/storybook/index.ios.js index 0dc3a5a82b86..72e2ce02ca71 100644 --- a/packages/getstorybook/generators/REACT_NATIVE/template/storybook/index.ios.js +++ b/lib/cli/generators/REACT_NATIVE/template/storybook/index.ios.js @@ -1,5 +1,5 @@ import { AppRegistry } from 'react-native'; -import { getStorybookUI, configure } from '@kadira/react-native-storybook'; +import { getStorybookUI, configure } from '@storybook/react-native'; // import stories configure(() => { diff --git a/packages/getstorybook/generators/REACT_NATIVE/template/storybook/stories/Button/index.android.js b/lib/cli/generators/REACT_NATIVE/template/storybook/stories/Button/index.android.js similarity index 100% rename from packages/getstorybook/generators/REACT_NATIVE/template/storybook/stories/Button/index.android.js rename to lib/cli/generators/REACT_NATIVE/template/storybook/stories/Button/index.android.js diff --git a/packages/getstorybook/generators/REACT_NATIVE/template/storybook/stories/Button/index.ios.js b/lib/cli/generators/REACT_NATIVE/template/storybook/stories/Button/index.ios.js similarity index 100% rename from packages/getstorybook/generators/REACT_NATIVE/template/storybook/stories/Button/index.ios.js rename to lib/cli/generators/REACT_NATIVE/template/storybook/stories/Button/index.ios.js diff --git a/packages/getstorybook/generators/REACT_NATIVE/template/storybook/stories/CenterView/index.js b/lib/cli/generators/REACT_NATIVE/template/storybook/stories/CenterView/index.js similarity index 100% rename from packages/getstorybook/generators/REACT_NATIVE/template/storybook/stories/CenterView/index.js rename to lib/cli/generators/REACT_NATIVE/template/storybook/stories/CenterView/index.js diff --git a/packages/getstorybook/generators/REACT_NATIVE/template/storybook/stories/CenterView/style.js b/lib/cli/generators/REACT_NATIVE/template/storybook/stories/CenterView/style.js similarity index 100% rename from packages/getstorybook/generators/REACT_NATIVE/template/storybook/stories/CenterView/style.js rename to lib/cli/generators/REACT_NATIVE/template/storybook/stories/CenterView/style.js diff --git a/packages/getstorybook/generators/REACT_NATIVE/template/storybook/stories/Welcome/index.js b/lib/cli/generators/REACT_NATIVE/template/storybook/stories/Welcome/index.js similarity index 100% rename from packages/getstorybook/generators/REACT_NATIVE/template/storybook/stories/Welcome/index.js rename to lib/cli/generators/REACT_NATIVE/template/storybook/stories/Welcome/index.js diff --git a/packages/getstorybook/generators/REACT_NATIVE/template/storybook/stories/index.js b/lib/cli/generators/REACT_NATIVE/template/storybook/stories/index.js similarity index 78% rename from packages/getstorybook/generators/REACT_NATIVE/template/storybook/stories/index.js rename to lib/cli/generators/REACT_NATIVE/template/storybook/stories/index.js index 865126b603fa..63f1a6266717 100644 --- a/packages/getstorybook/generators/REACT_NATIVE/template/storybook/stories/index.js +++ b/lib/cli/generators/REACT_NATIVE/template/storybook/stories/index.js @@ -1,8 +1,9 @@ import React from 'react'; import { Text } from 'react-native'; -import { storiesOf } from '@kadira/react-native-storybook'; -import { action } from '@kadira/storybook-addon-actions'; -import { linkTo } from '@kadira/storybook-addon-links'; + +import { storiesOf } from '@storybook/react-native'; +import { action } from '@storybook/addon-actions'; +import { linkTo } from '@storybook/addon-links'; import Button from './Button'; import CenterView from './CenterView'; diff --git a/packages/getstorybook/generators/REACT_SCRIPTS/index.js b/lib/cli/generators/REACT_SCRIPTS/index.js similarity index 91% rename from packages/getstorybook/generators/REACT_SCRIPTS/index.js rename to lib/cli/generators/REACT_SCRIPTS/index.js index ad50743aff9c..cfd01b298aa3 100644 --- a/packages/getstorybook/generators/REACT_SCRIPTS/index.js +++ b/lib/cli/generators/REACT_SCRIPTS/index.js @@ -8,7 +8,7 @@ mergeDirs(path.resolve(__dirname, 'template/'), '.', 'overwrite'); const packageJson = helpers.getPackageJson(); // TODO: Get the latest version of storybook here. -packageJson.devDependencies['@kadira/storybook'] = '^2.21.0'; +packageJson.devDependencies['@storybook/react'] = '^2.21.0'; packageJson.scripts['storybook'] = 'start-storybook -p 9009'; packageJson.scripts['build-storybook'] = 'build-storybook'; diff --git a/lib/cli/generators/REACT_SCRIPTS/template/.storybook/addons.js b/lib/cli/generators/REACT_SCRIPTS/template/.storybook/addons.js new file mode 100644 index 000000000000..6aed412d04af --- /dev/null +++ b/lib/cli/generators/REACT_SCRIPTS/template/.storybook/addons.js @@ -0,0 +1,2 @@ +import '@storybook/addon-actions/register'; +import '@storybook/addon-links/register'; diff --git a/packages/react-storybook/demo/.storybook/config.js b/lib/cli/generators/REACT_SCRIPTS/template/.storybook/config.js similarity index 65% rename from packages/react-storybook/demo/.storybook/config.js rename to lib/cli/generators/REACT_SCRIPTS/template/.storybook/config.js index 73cb7ab555fd..35430210ce65 100644 --- a/packages/react-storybook/demo/.storybook/config.js +++ b/lib/cli/generators/REACT_SCRIPTS/template/.storybook/config.js @@ -1,4 +1,4 @@ -import { configure } from '@kadira/storybook'; +import { configure } from '@storybook/react'; function loadStories() { require('../src/stories'); diff --git a/packages/getstorybook/generators/WEBPACK_REACT/template/stories/Button.js b/lib/cli/generators/REACT_SCRIPTS/template/src/stories/Button.js similarity index 100% rename from packages/getstorybook/generators/WEBPACK_REACT/template/stories/Button.js rename to lib/cli/generators/REACT_SCRIPTS/template/src/stories/Button.js diff --git a/packages/getstorybook/generators/REACT_SCRIPTS/template/src/stories/Welcome.js b/lib/cli/generators/REACT_SCRIPTS/template/src/stories/Welcome.js similarity index 100% rename from packages/getstorybook/generators/REACT_SCRIPTS/template/src/stories/Welcome.js rename to lib/cli/generators/REACT_SCRIPTS/template/src/stories/Welcome.js diff --git a/packages/getstorybook/generators/REACT_SCRIPTS/template/src/stories/index.js b/lib/cli/generators/REACT_SCRIPTS/template/src/stories/index.js similarity index 71% rename from packages/getstorybook/generators/REACT_SCRIPTS/template/src/stories/index.js rename to lib/cli/generators/REACT_SCRIPTS/template/src/stories/index.js index aab92a8a0eca..87e31def937b 100644 --- a/packages/getstorybook/generators/REACT_SCRIPTS/template/src/stories/index.js +++ b/lib/cli/generators/REACT_SCRIPTS/template/src/stories/index.js @@ -1,7 +1,9 @@ import React from 'react'; -import { storiesOf } from '@kadira/storybook'; -import { action } from '@kadira/storybook-addon-actions'; -import { linkTo } from '@kadira/storybook-addon-links'; + +import { storiesOf } from '@storybook/react'; +import { action } from '@storybook/addon-actions'; +import { linkTo } from '@storybook/addon-links'; + import Button from './Button'; import Welcome from './Welcome'; diff --git a/packages/getstorybook/generators/REACT/index.js b/lib/cli/generators/WEBPACK_REACT/index.js similarity index 90% rename from packages/getstorybook/generators/REACT/index.js rename to lib/cli/generators/WEBPACK_REACT/index.js index c20fac033bef..d85df39ccf9c 100644 --- a/packages/getstorybook/generators/REACT/index.js +++ b/lib/cli/generators/WEBPACK_REACT/index.js @@ -8,7 +8,7 @@ const packageJson = helpers.getPackageJson(); // TODO: Get the latest version of storybook here. packageJson.devDependencies = packageJson.devDependencies || {}; -packageJson.devDependencies['@kadira/storybook'] = '^2.21.0'; +packageJson.devDependencies['@storybook/react'] = '^2.21.0'; packageJson.scripts = packageJson.scripts || {}; packageJson.scripts['storybook'] = 'start-storybook -p 6006'; diff --git a/packages/getstorybook/generators/WEBPACK_REACT/template/.storybook/config.js b/lib/cli/generators/WEBPACK_REACT/template/.storybook/config.js similarity index 64% rename from packages/getstorybook/generators/WEBPACK_REACT/template/.storybook/config.js rename to lib/cli/generators/WEBPACK_REACT/template/.storybook/config.js index 8e314a81f7bb..9154670ab327 100644 --- a/packages/getstorybook/generators/WEBPACK_REACT/template/.storybook/config.js +++ b/lib/cli/generators/WEBPACK_REACT/template/.storybook/config.js @@ -1,4 +1,4 @@ -import { configure } from '@kadira/storybook'; +import { configure } from '@storybook/react'; function loadStories() { require('../stories'); diff --git a/packages/getstorybook/generators/WEBPACK_REACT/template/.storybook/webpack.config.js b/lib/cli/generators/WEBPACK_REACT/template/.storybook/webpack.config.js similarity index 100% rename from packages/getstorybook/generators/WEBPACK_REACT/template/.storybook/webpack.config.js rename to lib/cli/generators/WEBPACK_REACT/template/.storybook/webpack.config.js diff --git a/packages/react-storybook/demo/src/stories/Button.js b/lib/cli/generators/WEBPACK_REACT/template/stories/Button.js similarity index 100% rename from packages/react-storybook/demo/src/stories/Button.js rename to lib/cli/generators/WEBPACK_REACT/template/stories/Button.js diff --git a/packages/getstorybook/generators/WEBPACK_REACT/template/stories/Welcome.js b/lib/cli/generators/WEBPACK_REACT/template/stories/Welcome.js similarity index 96% rename from packages/getstorybook/generators/WEBPACK_REACT/template/stories/Welcome.js rename to lib/cli/generators/WEBPACK_REACT/template/stories/Welcome.js index acd48b6409bc..af3be528f0de 100644 --- a/packages/getstorybook/generators/WEBPACK_REACT/template/stories/Welcome.js +++ b/lib/cli/generators/WEBPACK_REACT/template/stories/Welcome.js @@ -81,7 +81,7 @@ export default class Welcome extends React.Component {
Have a look at the {' '} - + React Storybook {' '} diff --git a/packages/react-storybook/demo/src/stories/index.js b/lib/cli/generators/WEBPACK_REACT/template/stories/index.js similarity index 71% rename from packages/react-storybook/demo/src/stories/index.js rename to lib/cli/generators/WEBPACK_REACT/template/stories/index.js index aab92a8a0eca..87e31def937b 100644 --- a/packages/react-storybook/demo/src/stories/index.js +++ b/lib/cli/generators/WEBPACK_REACT/template/stories/index.js @@ -1,7 +1,9 @@ import React from 'react'; -import { storiesOf } from '@kadira/storybook'; -import { action } from '@kadira/storybook-addon-actions'; -import { linkTo } from '@kadira/storybook-addon-links'; + +import { storiesOf } from '@storybook/react'; +import { action } from '@storybook/addon-actions'; +import { linkTo } from '@storybook/addon-links'; + import Button from './Button'; import Welcome from './Welcome'; diff --git a/packages/getstorybook/lib/detect.js b/lib/cli/lib/detect.js similarity index 89% rename from packages/getstorybook/lib/detect.js rename to lib/cli/lib/detect.js index f69e1f9a8fa3..5310df97af7f 100644 --- a/packages/getstorybook/lib/detect.js +++ b/lib/cli/lib/detect.js @@ -12,8 +12,8 @@ module.exports = function detect(options) { if ( !options.force && packageJson.devDependencies && - (packageJson.devDependencies['@kadira/storybook'] || - packageJson.devDependencies['@kadira/react-native-storybook']) + (packageJson.devDependencies['@storybook/react'] || + packageJson.devDependencies['@storybook/react-native']) ) { return types.ALREADY_HAS_STORYBOOK; } diff --git a/packages/getstorybook/lib/has_yarn.js b/lib/cli/lib/has_yarn.js similarity index 100% rename from packages/getstorybook/lib/has_yarn.js rename to lib/cli/lib/has_yarn.js diff --git a/packages/getstorybook/lib/helpers.js b/lib/cli/lib/helpers.js similarity index 100% rename from packages/getstorybook/lib/helpers.js rename to lib/cli/lib/helpers.js diff --git a/packages/getstorybook/lib/project_types.js b/lib/cli/lib/project_types.js similarity index 100% rename from packages/getstorybook/lib/project_types.js rename to lib/cli/lib/project_types.js diff --git a/packages/getstorybook/package.json b/lib/cli/package.json similarity index 68% rename from packages/getstorybook/package.json rename to lib/cli/package.json index 6db47b5f7279..cdd96b314743 100644 --- a/packages/getstorybook/package.json +++ b/lib/cli/package.json @@ -1,5 +1,5 @@ { - "name": "getstorybook", + "name": "@storybook/cli", "version": "1.7.0", "description": "Easiest way to add Storybook support to your project.", "bin": { @@ -7,7 +7,7 @@ }, "repository": { "type": "git", - "url": "git+https://github.com/kadirahq/getstorybook.git" + "url": "git+https://github.com/storybooks/storybook.git" }, "keywords": [ "storybook", @@ -16,9 +16,9 @@ "author": "", "license": "MIT", "bugs": { - "url": "https://github.com/kadirahq/getstorybook/issues" + "url": "https://github.com/storybooks/storybook/issues" }, - "homepage": "https://github.com/kadirahq/getstorybook#readme", + "homepage": "https://github.com/storybooks/storybook/tree/master/packages/getstorybook", "dependencies": { "chalk": "^1.1.3", "commander": "^2.9.0", diff --git a/lib/codemod/README.md b/lib/codemod/README.md new file mode 100644 index 000000000000..828503dd1e59 --- /dev/null +++ b/lib/codemod/README.md @@ -0,0 +1,39 @@ +# Storybook Codemods +[![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 Codemods is a collection of codemod scripts written with JSCodeshift. +It will help you migrate breaking changes. + +## Installation + +```sh +npm install @storybook/codemod +``` + +## Transforms + +### add-organisation-to-package-name + +Updates package names in imports to include our organisation name prefix +(`@storybook/`), stripping off the old `@storybook/` prefix. + +```js +> jscodeshift -t add-organisation-to-package-name path/to/source.js +``` + +Example: + +```js +import { storiesOf } from '@kadira/storybook'; +``` + +becomes + +```js +import { storiesOf } from '@storybook/react'; +``` diff --git a/lib/codemod/package.json b/lib/codemod/package.json new file mode 100644 index 000000000000..3faccc4121d9 --- /dev/null +++ b/lib/codemod/package.json @@ -0,0 +1,14 @@ +{ + "name": "@storybook/codemod", + "description": "A collection of codemod scripts written with JSCodeshift", + "version": "0.0.1", + "license": "MIT", + "repository": { + "type": "git", + "url": "git+https://github.com/storybooks/storybook.git" + }, + "main": "src/index.js", + "dependencies": { + "jscodeshift": "^0.3.30" + } +} diff --git a/lib/codemod/src/index.js b/lib/codemod/src/index.js new file mode 100644 index 000000000000..c781731a84b1 --- /dev/null +++ b/lib/codemod/src/index.js @@ -0,0 +1,3 @@ +/* eslint import/prefer-default-export: "off" */ + +export { default as updateOrganisationName } from './transforms/update-organisation-name'; diff --git a/lib/codemod/src/transforms/__testfixtures__/update-organisation-name/update-organisation-name.input.js b/lib/codemod/src/transforms/__testfixtures__/update-organisation-name/update-organisation-name.input.js new file mode 100644 index 000000000000..f5bb299e79b1 --- /dev/null +++ b/lib/codemod/src/transforms/__testfixtures__/update-organisation-name/update-organisation-name.input.js @@ -0,0 +1,5 @@ +/* eslint-disable */ +import '@kadira/storybook-addon-knobs/register'; +import '@kadira/storybook-addon-options/register'; +import '@kadira/storybook/addons'; +import { storiesOf } from '@kadira/storybook'; \ No newline at end of file diff --git a/lib/codemod/src/transforms/__testfixtures__/update-organisation-name/update-organisation-name.output.js b/lib/codemod/src/transforms/__testfixtures__/update-organisation-name/update-organisation-name.output.js new file mode 100644 index 000000000000..efc7a34c91e1 --- /dev/null +++ b/lib/codemod/src/transforms/__testfixtures__/update-organisation-name/update-organisation-name.output.js @@ -0,0 +1,5 @@ +/* eslint-disable */ +import '@storybook/storybook-addon-knobs/register'; +import '@storybook/storybook-addon-options/register'; +import '@storybook/storybook/addons'; +import { storiesOf } from '@storybook/storybook'; \ No newline at end of file diff --git a/lib/codemod/src/transforms/__tests__/update-organisation-name.test.js b/lib/codemod/src/transforms/__tests__/update-organisation-name.test.js new file mode 100644 index 000000000000..7867dd4a7fbc --- /dev/null +++ b/lib/codemod/src/transforms/__tests__/update-organisation-name.test.js @@ -0,0 +1,8 @@ +import { defineTest } from 'jscodeshift/dist/testUtils'; + +defineTest( + __dirname, + 'update-organisation-name', + null, + 'update-organisation-name/update-organisation-name', +); diff --git a/lib/codemod/src/transforms/update-organisation-name.js b/lib/codemod/src/transforms/update-organisation-name.js new file mode 100644 index 000000000000..fb1c4bd5c1ab --- /dev/null +++ b/lib/codemod/src/transforms/update-organisation-name.js @@ -0,0 +1,45 @@ +// Demo at https://astexplorer.net/#/gist/f2d0b42c37e4556a4f816892be6ca402/latest +export default function transformer(file, api) { + const j = api.jscodeshift; + + /** + * Checks whether the node value matches a Storybook package + * @param {ImportDeclaration.Node} the import declaration node + * @returns {boolean} whether the node value matches a Storybook package + */ + const isStorybookPackage = node => node.value.source.value.includes('@kadira'); + + /** + * Returns the name of the Storybook packages with the organisation name, + * replacing the old `@storybook/` prefix. + * @param {string} oldPackageName the name of the old package + * @return {string} the new package name + * @example + * // returns '@storybook/storybook' + * getNewPackageName('@storybook/storybook') + */ + const getNewPackageName = oldPackageName => { + const packageNameWithoutPrefix = oldPackageName.slice(7); + const packageNameWithOrganisation = `@storybook${packageNameWithoutPrefix}`; + + return packageNameWithOrganisation; + }; + + /** + * updatePackageName - updates the source name of the Storybook packages + * @param {ImportDeclaration} declaration the import declaration + * @returns {ImportDeclaration.Node} the import declaration node + */ + const updatePackageName = declaration => { + // eslint-disable-next-line no-param-reassign + declaration.node.source.value = getNewPackageName(declaration.node.source.value); + + return declaration.node; + }; + + return j(file.source) + .find(j.ImportDeclaration) + .filter(isStorybookPackage) + .replaceWith(updatePackageName) + .toSource({ quote: 'single' }); +} diff --git a/packages/storyshots/.babelrc b/lib/storyshots/.babelrc similarity index 100% rename from packages/storyshots/.babelrc rename to lib/storyshots/.babelrc diff --git a/packages/storybook-ui/.npmignore b/lib/storyshots/.npmignore similarity index 100% rename from packages/storybook-ui/.npmignore rename to lib/storyshots/.npmignore diff --git a/packages/storyshots/.storybook/config.js b/lib/storyshots/.storybook/config.js similarity index 83% rename from packages/storyshots/.storybook/config.js rename to lib/storyshots/.storybook/config.js index 8b3b2483d49c..e56acc7f9c23 100644 --- a/packages/storyshots/.storybook/config.js +++ b/lib/storyshots/.storybook/config.js @@ -1,4 +1,4 @@ -import { configure } from '@kadira/storybook'; +import { configure } from '@storybook/react'; const req = require.context('../stories/required_with_context', true, /.stories.js$/) diff --git a/packages/storyshots/CHANGELOG.md b/lib/storyshots/CHANGELOG.md similarity index 100% rename from packages/storyshots/CHANGELOG.md rename to lib/storyshots/CHANGELOG.md diff --git a/packages/storyshots/README.md b/lib/storyshots/README.md similarity index 53% rename from packages/storyshots/README.md rename to lib/storyshots/README.md index de1482563970..cfdb99bfecd2 100644 --- a/packages/storyshots/README.md +++ b/lib/storyshots/README.md @@ -1,27 +1,27 @@ -# StoryShots [![CircleCI](https://circleci.com/gh/storybooks/storyshots.svg?style=shield)](https://circleci.com/gh/storybooks/storyshots) +# StoryShots +[![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/) -Jest Snapshot Testing for [Storybook](https://getstorybook.io/).
-(Supports both [React](https://github.com/storybooks/react-storybook) and [React Native](https://github.com/storybooks/react-native-storybook) Storybook) +StoryShots adds automatic Jest Snapshot Testing for [Storybook](https://storybooks.js.org/). -![StoryShots In Action](docs/storyshots-fail.png) +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). -With StoryShots, you could use your existing Storybook stories as the input for Jest Snapshot Testing. +![StoryShots In Action](docs/storyshots-fail.png) -> Now, we don't ship a CLI tool for storyshots. Check version [2.x](https://github.com/storybooks/storyshots/tree/v2.1.0) for that. +To use StoryShots, you must use your existing Storybook stories as the input for Jest Snapshot Testing. ## Getting Started -First of all, you need to use the latest version of React Storybook. -So, do this: - -```sh -npm update @kadira/storybook -``` - -Then add the following NPM module into your app. +Add the following module into your app. ```sh -npm i -D storyshots +npm install -save-dev storyshots ``` ## Configure your app for Jest @@ -38,6 +38,7 @@ Then add following content to it: ```js import initStoryshots from 'storyshots'; + initStoryshots(); ``` @@ -45,7 +46,7 @@ That's all. Now run your Jest test command. (Usually, `npm test`.) Then you can see all of your stories are converted as Jest snapshot tests. -![](docs/storyshots.png) +![Screenshot](docs/storyshots.png) ## Options @@ -53,8 +54,8 @@ Now run your Jest test command. (Usually, `npm test`.) Then you can see all of y By default, Storyshots assumes the config directory path for your project as below: -* For React Storybook: `.storybook` -* For React Native Storybook: `storybook` +* Storybook for React: `.storybook` +* Storybook for React Native: `storybook` If you are using a different config directory path, you could change it like this: @@ -95,5 +96,3 @@ initStoryshots({ storyNameRegex: /buttons/ }); ``` - -Here is an example of [a regex](https://regex101.com/r/vkBaAt/2) which does not pass if `"Relay"` is in the name: `/^((?!(r|R)elay).)*$/`. diff --git a/packages/storyshots/docs/storyshots-fail.png b/lib/storyshots/docs/storyshots-fail.png similarity index 100% rename from packages/storyshots/docs/storyshots-fail.png rename to lib/storyshots/docs/storyshots-fail.png diff --git a/packages/storyshots/docs/storyshots.png b/lib/storyshots/docs/storyshots.png similarity index 100% rename from packages/storyshots/docs/storyshots.png rename to lib/storyshots/docs/storyshots.png diff --git a/packages/storyshots/package.json b/lib/storyshots/package.json similarity index 81% rename from packages/storyshots/package.json rename to lib/storyshots/package.json index eff17c366204..a26063301d18 100644 --- a/packages/storyshots/package.json +++ b/lib/storyshots/package.json @@ -22,11 +22,11 @@ "react-dom": "^15.5.4" }, "dependencies": { - "@kadira/storybook": "*", - "@kadira/storybook-addon-actions": "*", - "@kadira/storybook-addon-links": "*", - "@kadira/storybook-addons": "*", - "@kadira/storybook-channel": "*", + "@storybook/react": "*", + "@storybook/addon-actions": "*", + "@storybook/addon-links": "*", + "@storybook/addons": "*", + "@storybook/channels": "*", "babel-runtime": "^6.23.0", "prop-types": "^15.5.8", "read-pkg-up": "^2.0.0" diff --git a/packages/storyshots/src/index.js b/lib/storyshots/src/index.js similarity index 80% rename from packages/storyshots/src/index.js rename to lib/storyshots/src/index.js index e91c11601fe6..a676d02e1e0e 100644 --- a/packages/storyshots/src/index.js +++ b/lib/storyshots/src/index.js @@ -1,7 +1,7 @@ import renderer from 'react-test-renderer'; import path from 'path'; import readPkgUp from 'read-pkg-up'; -import addons from '@kadira/storybook-addons'; +import addons from '@storybook/addons'; import runWithRequireContext from './require_context'; import createChannel from './storybook-channel-mock'; const { describe, it, expect } = global; @@ -13,18 +13,18 @@ const babel = require('babel-core'); const pkg = readPkgUp.sync().pkg; const isStorybook = - (pkg.devDependencies && pkg.devDependencies['@kadira/storybook']) || - (pkg.dependencies && pkg.dependencies['@kadira/storybook']); + (pkg.devDependencies && pkg.devDependencies['@storybook/react']) || + (pkg.dependencies && pkg.dependencies['@storybook/react']); const isRNStorybook = - (pkg.devDependencies && pkg.devDependencies['@kadira/react-native-storybook']) || - (pkg.dependencies && pkg.dependencies['@kadira/react-native-storybook']); + (pkg.devDependencies && pkg.devDependencies['@storybook/react-native']) || + (pkg.dependencies && pkg.dependencies['@storybook/react-native']); export default function testStorySnapshots(options = {}) { addons.setChannel(createChannel()); if (isStorybook) { - storybook = require.requireActual('@kadira/storybook'); - const loadBabelConfig = require('@kadira/storybook/dist/server/babel_config').default; + storybook = require.requireActual('@storybook/react'); + const loadBabelConfig = require('@storybook/react/dist/server/babel_config').default; const configDirPath = path.resolve(options.configPath || '.storybook'); configPath = path.join(configDirPath, 'config.js'); @@ -37,7 +37,7 @@ export default function testStorySnapshots(options = {}) { runWithRequireContext(content, contextOpts); } else if (isRNStorybook) { - storybook = require.requireActual('@kadira/react-native-storybook'); + storybook = require.requireActual('@storybook/react-native'); configPath = path.resolve(options.configPath || 'storybook'); require.requireActual(configPath); } else { diff --git a/packages/storyshots/src/require_context.js b/lib/storyshots/src/require_context.js similarity index 100% rename from packages/storyshots/src/require_context.js rename to lib/storyshots/src/require_context.js diff --git a/packages/storyshots/src/storybook-channel-mock.js b/lib/storyshots/src/storybook-channel-mock.js similarity index 76% rename from packages/storyshots/src/storybook-channel-mock.js rename to lib/storyshots/src/storybook-channel-mock.js index 5621a104fedc..7358fc7e4bef 100644 --- a/packages/storyshots/src/storybook-channel-mock.js +++ b/lib/storyshots/src/storybook-channel-mock.js @@ -1,4 +1,4 @@ -import Channel from '@kadira/storybook-channel'; +import Channel from '@storybook/channels'; export default function createChannel() { const transport = { diff --git a/packages/storyshots/stories/directly_required/Button.js b/lib/storyshots/stories/directly_required/Button.js similarity index 100% rename from packages/storyshots/stories/directly_required/Button.js rename to lib/storyshots/stories/directly_required/Button.js diff --git a/packages/storyshots/stories/directly_required/index.js b/lib/storyshots/stories/directly_required/index.js similarity index 83% rename from packages/storyshots/stories/directly_required/index.js rename to lib/storyshots/stories/directly_required/index.js index 9f0ba97b9cb1..660c37b8c24c 100644 --- a/packages/storyshots/stories/directly_required/index.js +++ b/lib/storyshots/stories/directly_required/index.js @@ -1,5 +1,5 @@ import React from 'react'; -import { storiesOf, action } from '@kadira/storybook'; +import { storiesOf, action } from '@storybook/react'; import Button from './Button'; storiesOf('Another Button', module) diff --git a/packages/storyshots/stories/required_with_context/Button.js b/lib/storyshots/stories/required_with_context/Button.js similarity index 100% rename from packages/storyshots/stories/required_with_context/Button.js rename to lib/storyshots/stories/required_with_context/Button.js diff --git a/packages/storyshots/stories/required_with_context/Button.stories.js b/lib/storyshots/stories/required_with_context/Button.stories.js similarity index 65% rename from packages/storyshots/stories/required_with_context/Button.stories.js rename to lib/storyshots/stories/required_with_context/Button.stories.js index 4298130bbb95..d72a3ceca6b1 100644 --- a/packages/storyshots/stories/required_with_context/Button.stories.js +++ b/lib/storyshots/stories/required_with_context/Button.stories.js @@ -1,7 +1,9 @@ import React from 'react'; -import { storiesOf } from '@kadira/storybook'; -import { action } from '@kadira/storybook-addon-actions'; -import { linkTo } from '@kadira/storybook-addon-links'; + +import { storiesOf } from '@storybook/react'; +import { action } from '@storybook/addon-actions'; +import { linkTo } from '@storybook/addon-links'; + import Button from './Button'; import Welcome from './Welcome'; diff --git a/packages/getstorybook/generators/REACT/template/stories/Welcome.js b/lib/storyshots/stories/required_with_context/Welcome.js similarity index 95% rename from packages/getstorybook/generators/REACT/template/stories/Welcome.js rename to lib/storyshots/stories/required_with_context/Welcome.js index 4e9ee8eb7317..c732bf4d1a8f 100644 --- a/packages/getstorybook/generators/REACT/template/stories/Welcome.js +++ b/lib/storyshots/stories/required_with_context/Welcome.js @@ -77,7 +77,7 @@ export default class Welcome extends React.Component {
Have a look at the {' '} - + React Storybook {' '} diff --git a/packages/storyshots/stories/required_with_context/Welcome.stories.js b/lib/storyshots/stories/required_with_context/Welcome.stories.js similarity index 60% rename from packages/storyshots/stories/required_with_context/Welcome.stories.js rename to lib/storyshots/stories/required_with_context/Welcome.stories.js index 313b81e27013..22a7f462b995 100644 --- a/packages/storyshots/stories/required_with_context/Welcome.stories.js +++ b/lib/storyshots/stories/required_with_context/Welcome.stories.js @@ -1,6 +1,8 @@ import React from 'react'; -import { storiesOf } from '@kadira/storybook'; -import { linkTo } from '@kadira/storybook-addon-links'; + +import { storiesOf } from '@storybook/react'; +import { linkTo } from '@storybook/addon-links'; + import Welcome from './Welcome'; storiesOf('Welcome', module).add('to Storybook', () => ); diff --git a/packages/storyshots/.npmignore b/lib/ui/.npmignore similarity index 100% rename from packages/storyshots/.npmignore rename to lib/ui/.npmignore diff --git a/packages/storybook-ui/CHANGELOG.md b/lib/ui/CHANGELOG.md similarity index 100% rename from packages/storybook-ui/CHANGELOG.md rename to lib/ui/CHANGELOG.md diff --git a/packages/storybook-ui/README.md b/lib/ui/README.md similarity index 78% rename from packages/storybook-ui/README.md rename to lib/ui/README.md index a60bcc2718a0..9fe6001aa5b6 100644 --- a/packages/storybook-ui/README.md +++ b/lib/ui/README.md @@ -1,23 +1,30 @@ # Storybook UI +[![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/) -This is the core UI of [react-storybook](https://github.com/kadirahq/react-storybook) and other similar projects. It's a React based UI where you can initialize with a simple function. You can configure it by providing a simple provider API. +Storybook UI the core UI of [storybook](https://storybooks.js.org). +It's a React based UI which you can initialize with a simple function. +You can configure it by providing a provider API. ![Storybook UI Demo](./docs/storybook-ui-demo.png) ## Usage -First you need to install `@kadira/storybook-ui` into your app. +First you need to install `@storybook/ui` into your app. ```sh -npm i --save @kadira/storybook-ui +npm install --save @storybook/ui ``` Then you need to create a Provider class like this: ```js -// provider.js -import { Provider } from '@kadira/storybook-ui'; import React from 'react'; +import { Provider } from '@storybook/ui'; export default class MyProvider extends Provider { getPanels() { @@ -40,7 +47,7 @@ Then you need to initialize the UI like this: ```js import Provider from './provider'; -import renderStorybookUI from '@kadira/storybook-ui'; +import renderStorybookUI from '@storybook/ui'; const roolEl = document.getElementById('root'); renderStorybookUI(roolEl, new Provider()); diff --git a/packages/storybook-ui/docs/simple-ui.png b/lib/ui/docs/simple-ui.png similarity index 100% rename from packages/storybook-ui/docs/simple-ui.png rename to lib/ui/docs/simple-ui.png diff --git a/packages/storybook-ui/docs/storybook-ui-demo.png b/lib/ui/docs/storybook-ui-demo.png similarity index 100% rename from packages/storybook-ui/docs/storybook-ui-demo.png rename to lib/ui/docs/storybook-ui-demo.png diff --git a/packages/storybook-ui/example/README.md b/lib/ui/example/README.md similarity index 100% rename from packages/storybook-ui/example/README.md rename to lib/ui/example/README.md diff --git a/packages/storybook-ui/example/client/index.js b/lib/ui/example/client/index.js similarity index 100% rename from packages/storybook-ui/example/client/index.js rename to lib/ui/example/client/index.js diff --git a/packages/storybook-ui/example/client/preview.js b/lib/ui/example/client/preview.js similarity index 100% rename from packages/storybook-ui/example/client/preview.js rename to lib/ui/example/client/preview.js diff --git a/packages/storybook-ui/example/client/provider.js b/lib/ui/example/client/provider.js similarity index 100% rename from packages/storybook-ui/example/client/provider.js rename to lib/ui/example/client/provider.js diff --git a/packages/storybook-ui/example/index.html b/lib/ui/example/index.html similarity index 100% rename from packages/storybook-ui/example/index.html rename to lib/ui/example/index.html diff --git a/packages/storybook-ui/example/package.json b/lib/ui/example/package.json similarity index 100% rename from packages/storybook-ui/example/package.json rename to lib/ui/example/package.json diff --git a/packages/storybook-ui/example/server.js b/lib/ui/example/server.js similarity index 100% rename from packages/storybook-ui/example/server.js rename to lib/ui/example/server.js diff --git a/packages/storybook-ui/example/webpack.config.js b/lib/ui/example/webpack.config.js similarity index 100% rename from packages/storybook-ui/example/webpack.config.js rename to lib/ui/example/webpack.config.js diff --git a/packages/storybook-ui/package.json b/lib/ui/package.json similarity index 91% rename from packages/storybook-ui/package.json rename to lib/ui/package.json index 33d0bad41e7a..6f52fe4b5aa7 100644 --- a/packages/storybook-ui/package.json +++ b/lib/ui/package.json @@ -1,10 +1,10 @@ { - "name": "@kadira/storybook-ui", + "name": "@storybook/ui", "version": "3.10.1", "description": "Core Storybook UI", "repository": { "type": "git", - "url": "https://github.com/kadirahq/storybook-ui.git" + "url": "git+https://github.com/storybooks/storybook.git" }, "license": "MIT", "scripts": { diff --git a/packages/storybook-ui/src/__tests__/index.js b/lib/ui/src/__tests__/index.js similarity index 100% rename from packages/storybook-ui/src/__tests__/index.js rename to lib/ui/src/__tests__/index.js diff --git a/packages/storybook-ui/src/compose.js b/lib/ui/src/compose.js similarity index 100% rename from packages/storybook-ui/src/compose.js rename to lib/ui/src/compose.js diff --git a/packages/storybook-ui/src/context.js b/lib/ui/src/context.js similarity index 100% rename from packages/storybook-ui/src/context.js rename to lib/ui/src/context.js diff --git a/packages/storybook-ui/src/index.js b/lib/ui/src/index.js similarity index 100% rename from packages/storybook-ui/src/index.js rename to lib/ui/src/index.js diff --git a/packages/storybook-ui/src/libs/key_events.js b/lib/ui/src/libs/key_events.js similarity index 100% rename from packages/storybook-ui/src/libs/key_events.js rename to lib/ui/src/libs/key_events.js diff --git a/packages/storybook-ui/src/modules/api/actions/api.js b/lib/ui/src/modules/api/actions/api.js similarity index 100% rename from packages/storybook-ui/src/modules/api/actions/api.js rename to lib/ui/src/modules/api/actions/api.js diff --git a/packages/storybook-ui/src/modules/api/actions/api.test.js b/lib/ui/src/modules/api/actions/api.test.js similarity index 100% rename from packages/storybook-ui/src/modules/api/actions/api.test.js rename to lib/ui/src/modules/api/actions/api.test.js diff --git a/packages/storybook-ui/src/modules/api/actions/index.js b/lib/ui/src/modules/api/actions/index.js similarity index 100% rename from packages/storybook-ui/src/modules/api/actions/index.js rename to lib/ui/src/modules/api/actions/index.js diff --git a/packages/storybook-ui/src/modules/api/configs/init_api.js b/lib/ui/src/modules/api/configs/init_api.js similarity index 100% rename from packages/storybook-ui/src/modules/api/configs/init_api.js rename to lib/ui/src/modules/api/configs/init_api.js diff --git a/packages/storybook-ui/src/modules/api/configs/init_api.test.js b/lib/ui/src/modules/api/configs/init_api.test.js similarity index 100% rename from packages/storybook-ui/src/modules/api/configs/init_api.test.js rename to lib/ui/src/modules/api/configs/init_api.test.js diff --git a/packages/storybook-ui/src/modules/api/index.js b/lib/ui/src/modules/api/index.js similarity index 100% rename from packages/storybook-ui/src/modules/api/index.js rename to lib/ui/src/modules/api/index.js diff --git a/packages/storybook-ui/src/modules/shortcuts/actions/index.js b/lib/ui/src/modules/shortcuts/actions/index.js similarity index 100% rename from packages/storybook-ui/src/modules/shortcuts/actions/index.js rename to lib/ui/src/modules/shortcuts/actions/index.js diff --git a/packages/storybook-ui/src/modules/shortcuts/actions/shortcuts.js b/lib/ui/src/modules/shortcuts/actions/shortcuts.js similarity index 100% rename from packages/storybook-ui/src/modules/shortcuts/actions/shortcuts.js rename to lib/ui/src/modules/shortcuts/actions/shortcuts.js diff --git a/packages/storybook-ui/src/modules/shortcuts/actions/shortcuts.test.js b/lib/ui/src/modules/shortcuts/actions/shortcuts.test.js similarity index 100% rename from packages/storybook-ui/src/modules/shortcuts/actions/shortcuts.test.js rename to lib/ui/src/modules/shortcuts/actions/shortcuts.test.js diff --git a/packages/storybook-ui/src/modules/shortcuts/index.js b/lib/ui/src/modules/shortcuts/index.js similarity index 100% rename from packages/storybook-ui/src/modules/shortcuts/index.js rename to lib/ui/src/modules/shortcuts/index.js diff --git a/packages/storybook-ui/src/modules/ui/actions/index.js b/lib/ui/src/modules/ui/actions/index.js similarity index 100% rename from packages/storybook-ui/src/modules/ui/actions/index.js rename to lib/ui/src/modules/ui/actions/index.js diff --git a/packages/storybook-ui/src/modules/ui/actions/ui.js b/lib/ui/src/modules/ui/actions/ui.js similarity index 100% rename from packages/storybook-ui/src/modules/ui/actions/ui.js rename to lib/ui/src/modules/ui/actions/ui.js diff --git a/packages/storybook-ui/src/modules/ui/actions/ui.test.js b/lib/ui/src/modules/ui/actions/ui.test.js similarity index 100% rename from packages/storybook-ui/src/modules/ui/actions/ui.test.js rename to lib/ui/src/modules/ui/actions/ui.test.js diff --git a/packages/storybook-ui/src/modules/ui/components/down_panel/index.js b/lib/ui/src/modules/ui/components/down_panel/index.js similarity index 100% rename from packages/storybook-ui/src/modules/ui/components/down_panel/index.js rename to lib/ui/src/modules/ui/components/down_panel/index.js diff --git a/packages/storybook-ui/src/modules/ui/components/down_panel/index.test.js b/lib/ui/src/modules/ui/components/down_panel/index.test.js similarity index 100% rename from packages/storybook-ui/src/modules/ui/components/down_panel/index.test.js rename to lib/ui/src/modules/ui/components/down_panel/index.test.js diff --git a/packages/storybook-ui/src/modules/ui/components/down_panel/style.js b/lib/ui/src/modules/ui/components/down_panel/style.js similarity index 100% rename from packages/storybook-ui/src/modules/ui/components/down_panel/style.js rename to lib/ui/src/modules/ui/components/down_panel/style.js diff --git a/packages/storybook-ui/src/modules/ui/components/layout/dimensions.js b/lib/ui/src/modules/ui/components/layout/dimensions.js similarity index 100% rename from packages/storybook-ui/src/modules/ui/components/layout/dimensions.js rename to lib/ui/src/modules/ui/components/layout/dimensions.js diff --git a/packages/storybook-ui/src/modules/ui/components/layout/index.js b/lib/ui/src/modules/ui/components/layout/index.js similarity index 100% rename from packages/storybook-ui/src/modules/ui/components/layout/index.js rename to lib/ui/src/modules/ui/components/layout/index.js diff --git a/packages/storybook-ui/src/modules/ui/components/layout/index.test.js b/lib/ui/src/modules/ui/components/layout/index.test.js similarity index 100% rename from packages/storybook-ui/src/modules/ui/components/layout/index.test.js rename to lib/ui/src/modules/ui/components/layout/index.test.js diff --git a/lib/ui/src/modules/ui/components/layout/usplit.js b/lib/ui/src/modules/ui/components/layout/usplit.js new file mode 100644 index 000000000000..0f47bd354449 --- /dev/null +++ b/lib/ui/src/modules/ui/components/layout/usplit.js @@ -0,0 +1,59 @@ +import React from 'react'; +import PropTypes from 'prop-types'; + +const gripSize = 1; +const splitSize = 10; + +const wrapStyle = { + vertical: shift => ({ + width: splitSize, + marginLeft: shift - splitSize / 2, + marginRight: -shift - splitSize / 2, + position: 'relative', + }), + horizontal: shift => ({ + height: splitSize, + marginTop: shift - splitSize / 2, + marginBottom: -shift - splitSize / 2, + position: 'relative', + }), +}; + +const spanStyle = { + vertical: () => ({ + width: gripSize, + height: 20, + left: splitSize / 2 - (gripSize + 2) / 2, + top: '50%', + position: 'absolute', + borderLeft: 'solid 1px rgba(0,0,0,0.1)', + borderRight: 'solid 1px rgba(0,0,0,0.1)', + }), + horizontal: () => ({ + height: gripSize, + width: 20, + top: splitSize / 2 - (gripSize + 2) / 2, + left: '50%', + position: 'absolute', + borderTop: 'solid 1px rgba(0,0,0,0.1)', + borderBottom: 'solid 1px rgba(0,0,0,0.1)', + }), +}; + +const USplit = ({ shift, split }) => ( +
+ +
+); + +USplit.PropTypes = { + shift: PropTypes.number, + split: PropTypes.oneOf(['vertical', 'horizontal']), +}; + +USplit.defaultProps = { + shift: 0, + split: 'vertical', +}; + +export default USplit; diff --git a/packages/storybook-ui/src/modules/ui/components/left_panel/header.js b/lib/ui/src/modules/ui/components/left_panel/header.js similarity index 100% rename from packages/storybook-ui/src/modules/ui/components/left_panel/header.js rename to lib/ui/src/modules/ui/components/left_panel/header.js diff --git a/packages/storybook-ui/src/modules/ui/components/left_panel/header.test.js b/lib/ui/src/modules/ui/components/left_panel/header.test.js similarity index 100% rename from packages/storybook-ui/src/modules/ui/components/left_panel/header.test.js rename to lib/ui/src/modules/ui/components/left_panel/header.test.js diff --git a/packages/storybook-ui/src/modules/ui/components/left_panel/index.js b/lib/ui/src/modules/ui/components/left_panel/index.js similarity index 100% rename from packages/storybook-ui/src/modules/ui/components/left_panel/index.js rename to lib/ui/src/modules/ui/components/left_panel/index.js diff --git a/packages/storybook-ui/src/modules/ui/components/left_panel/index.test.js b/lib/ui/src/modules/ui/components/left_panel/index.test.js similarity index 100% rename from packages/storybook-ui/src/modules/ui/components/left_panel/index.test.js rename to lib/ui/src/modules/ui/components/left_panel/index.test.js diff --git a/packages/storybook-ui/src/modules/ui/components/left_panel/stories.js b/lib/ui/src/modules/ui/components/left_panel/stories.js similarity index 100% rename from packages/storybook-ui/src/modules/ui/components/left_panel/stories.js rename to lib/ui/src/modules/ui/components/left_panel/stories.js diff --git a/packages/storybook-ui/src/modules/ui/components/left_panel/stories.test.js b/lib/ui/src/modules/ui/components/left_panel/stories.test.js similarity index 100% rename from packages/storybook-ui/src/modules/ui/components/left_panel/stories.test.js rename to lib/ui/src/modules/ui/components/left_panel/stories.test.js diff --git a/packages/storybook-ui/src/modules/ui/components/left_panel/text_filter.js b/lib/ui/src/modules/ui/components/left_panel/text_filter.js similarity index 100% rename from packages/storybook-ui/src/modules/ui/components/left_panel/text_filter.js rename to lib/ui/src/modules/ui/components/left_panel/text_filter.js diff --git a/packages/storybook-ui/src/modules/ui/components/left_panel/text_filter.test.js b/lib/ui/src/modules/ui/components/left_panel/text_filter.test.js similarity index 100% rename from packages/storybook-ui/src/modules/ui/components/left_panel/text_filter.test.js rename to lib/ui/src/modules/ui/components/left_panel/text_filter.test.js diff --git a/packages/storybook-ui/src/modules/ui/components/search_box.js b/lib/ui/src/modules/ui/components/search_box.js similarity index 100% rename from packages/storybook-ui/src/modules/ui/components/search_box.js rename to lib/ui/src/modules/ui/components/search_box.js diff --git a/packages/storybook-ui/src/modules/ui/components/shortcuts_help.js b/lib/ui/src/modules/ui/components/shortcuts_help.js similarity index 100% rename from packages/storybook-ui/src/modules/ui/components/shortcuts_help.js rename to lib/ui/src/modules/ui/components/shortcuts_help.js diff --git a/packages/storybook-ui/src/modules/ui/components/theme.js b/lib/ui/src/modules/ui/components/theme.js similarity index 100% rename from packages/storybook-ui/src/modules/ui/components/theme.js rename to lib/ui/src/modules/ui/components/theme.js diff --git a/packages/storybook-ui/src/modules/ui/configs/handle_keyevents.js b/lib/ui/src/modules/ui/configs/handle_keyevents.js similarity index 100% rename from packages/storybook-ui/src/modules/ui/configs/handle_keyevents.js rename to lib/ui/src/modules/ui/configs/handle_keyevents.js diff --git a/packages/storybook-ui/src/modules/ui/configs/handle_keyevents.test.js b/lib/ui/src/modules/ui/configs/handle_keyevents.test.js similarity index 100% rename from packages/storybook-ui/src/modules/ui/configs/handle_keyevents.test.js rename to lib/ui/src/modules/ui/configs/handle_keyevents.test.js diff --git a/packages/storybook-ui/src/modules/ui/configs/handle_routing.js b/lib/ui/src/modules/ui/configs/handle_routing.js similarity index 100% rename from packages/storybook-ui/src/modules/ui/configs/handle_routing.js rename to lib/ui/src/modules/ui/configs/handle_routing.js diff --git a/packages/storybook-ui/src/modules/ui/configs/handle_routing.test.js b/lib/ui/src/modules/ui/configs/handle_routing.test.js similarity index 100% rename from packages/storybook-ui/src/modules/ui/configs/handle_routing.test.js rename to lib/ui/src/modules/ui/configs/handle_routing.test.js diff --git a/packages/storybook-ui/src/modules/ui/configs/init_panels.js b/lib/ui/src/modules/ui/configs/init_panels.js similarity index 100% rename from packages/storybook-ui/src/modules/ui/configs/init_panels.js rename to lib/ui/src/modules/ui/configs/init_panels.js diff --git a/packages/storybook-ui/src/modules/ui/configs/init_panels.test.js b/lib/ui/src/modules/ui/configs/init_panels.test.js similarity index 100% rename from packages/storybook-ui/src/modules/ui/configs/init_panels.test.js rename to lib/ui/src/modules/ui/configs/init_panels.test.js diff --git a/packages/storybook-ui/src/modules/ui/containers/down_panel.js b/lib/ui/src/modules/ui/containers/down_panel.js similarity index 100% rename from packages/storybook-ui/src/modules/ui/containers/down_panel.js rename to lib/ui/src/modules/ui/containers/down_panel.js diff --git a/packages/storybook-ui/src/modules/ui/containers/down_panel.test.js b/lib/ui/src/modules/ui/containers/down_panel.test.js similarity index 100% rename from packages/storybook-ui/src/modules/ui/containers/down_panel.test.js rename to lib/ui/src/modules/ui/containers/down_panel.test.js diff --git a/packages/storybook-ui/src/modules/ui/containers/layout.js b/lib/ui/src/modules/ui/containers/layout.js similarity index 100% rename from packages/storybook-ui/src/modules/ui/containers/layout.js rename to lib/ui/src/modules/ui/containers/layout.js diff --git a/packages/storybook-ui/src/modules/ui/containers/layout.test.js b/lib/ui/src/modules/ui/containers/layout.test.js similarity index 100% rename from packages/storybook-ui/src/modules/ui/containers/layout.test.js rename to lib/ui/src/modules/ui/containers/layout.test.js diff --git a/packages/storybook-ui/src/modules/ui/containers/left_panel.js b/lib/ui/src/modules/ui/containers/left_panel.js similarity index 100% rename from packages/storybook-ui/src/modules/ui/containers/left_panel.js rename to lib/ui/src/modules/ui/containers/left_panel.js diff --git a/packages/storybook-ui/src/modules/ui/containers/left_panel.test.js b/lib/ui/src/modules/ui/containers/left_panel.test.js similarity index 100% rename from packages/storybook-ui/src/modules/ui/containers/left_panel.test.js rename to lib/ui/src/modules/ui/containers/left_panel.test.js diff --git a/packages/storybook-ui/src/modules/ui/containers/search_box.js b/lib/ui/src/modules/ui/containers/search_box.js similarity index 100% rename from packages/storybook-ui/src/modules/ui/containers/search_box.js rename to lib/ui/src/modules/ui/containers/search_box.js diff --git a/packages/storybook-ui/src/modules/ui/containers/shortcuts_help.js b/lib/ui/src/modules/ui/containers/shortcuts_help.js similarity index 100% rename from packages/storybook-ui/src/modules/ui/containers/shortcuts_help.js rename to lib/ui/src/modules/ui/containers/shortcuts_help.js diff --git a/packages/storybook-ui/src/modules/ui/containers/shortcuts_help.test.js b/lib/ui/src/modules/ui/containers/shortcuts_help.test.js similarity index 100% rename from packages/storybook-ui/src/modules/ui/containers/shortcuts_help.test.js rename to lib/ui/src/modules/ui/containers/shortcuts_help.test.js diff --git a/packages/storybook-ui/src/modules/ui/index.js b/lib/ui/src/modules/ui/index.js similarity index 100% rename from packages/storybook-ui/src/modules/ui/index.js rename to lib/ui/src/modules/ui/index.js diff --git a/packages/storybook-ui/src/modules/ui/libs/filters.js b/lib/ui/src/modules/ui/libs/filters.js similarity index 100% rename from packages/storybook-ui/src/modules/ui/libs/filters.js rename to lib/ui/src/modules/ui/libs/filters.js diff --git a/packages/storybook-ui/src/modules/ui/libs/filters.test.js b/lib/ui/src/modules/ui/libs/filters.test.js similarity index 100% rename from packages/storybook-ui/src/modules/ui/libs/filters.test.js rename to lib/ui/src/modules/ui/libs/filters.test.js diff --git a/packages/storybook-ui/src/modules/ui/libs/gen_podda_loader.js b/lib/ui/src/modules/ui/libs/gen_podda_loader.js similarity index 100% rename from packages/storybook-ui/src/modules/ui/libs/gen_podda_loader.js rename to lib/ui/src/modules/ui/libs/gen_podda_loader.js diff --git a/packages/storybook-ui/src/modules/ui/libs/gen_podda_loader.test.js b/lib/ui/src/modules/ui/libs/gen_podda_loader.test.js similarity index 100% rename from packages/storybook-ui/src/modules/ui/libs/gen_podda_loader.test.js rename to lib/ui/src/modules/ui/libs/gen_podda_loader.test.js diff --git a/packages/storybook-ui/src/modules/ui/routes.js b/lib/ui/src/modules/ui/routes.js similarity index 100% rename from packages/storybook-ui/src/modules/ui/routes.js rename to lib/ui/src/modules/ui/routes.js diff --git a/packages/addon-actions/.storybook/addons.js b/packages/addon-actions/.storybook/addons.js deleted file mode 100644 index 990240ee50fb..000000000000 --- a/packages/addon-actions/.storybook/addons.js +++ /dev/null @@ -1,3 +0,0 @@ -// Use the line below to register this addon -// import '@kadira/storybook-addon-actions/register'; -import '../register'; diff --git a/packages/addon-actions/README.md b/packages/addon-actions/README.md deleted file mode 100644 index ebaa9326e34c..000000000000 --- a/packages/addon-actions/README.md +++ /dev/null @@ -1,46 +0,0 @@ -# Storybook Addon Actions - -The Action Logger addon can be used to display data received by event handlers. This addon works with both [React Storybook](https://github.com/kadirahq/react-storybook) and [React Native Storybook](https://github.com/kadirahq/react-native-storybook) (included by default). - -![](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, action } from '@kadira/storybook' -// or import { action } from '@kadira/storybook-addon-actions' - -storiesOf('Button', module) - .add('default view', () => ( - - )) -``` - -## 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 '@kadira/storybook-addon-actions' - -const firstArgAction = decorateAction([ - args => args.slice(0, 1) -]); - -storiesOf('Button', module) - .add('default view', () => ( - - )) -``` diff --git a/packages/addon-comments/.scripts/get_gh_pages_url.js b/packages/addon-comments/.scripts/get_gh_pages_url.js deleted file mode 100644 index 062c690d8bea..000000000000 --- a/packages/addon-comments/.scripts/get_gh_pages_url.js +++ /dev/null @@ -1,11 +0,0 @@ -// IMPORTANT -// --------- -// This is an auto generated file with React CDK. -// Do not modify this file. - -const parse = require('git-url-parse'); -var ghUrl = process.argv[2]; -const parsedUrl = parse(ghUrl); - -const ghPagesUrl = 'https://' + parsedUrl.owner + '.github.io/' + parsedUrl.name; -console.log(ghPagesUrl); diff --git a/packages/addon-comments/.scripts/mocha_runner.js b/packages/addon-comments/.scripts/mocha_runner.js deleted file mode 100644 index bc08ecc38ec8..000000000000 --- a/packages/addon-comments/.scripts/mocha_runner.js +++ /dev/null @@ -1,34 +0,0 @@ -// IMPORTANT -// --------- -// This is an auto generated file with React CDK. -// Do not modify this file. -// Use `.scripts/user/pretest.js instead`. - -process.env.NODE_ENV = 'development'; -require('babel-core/register'); -require('babel-polyfill'); - -// Add jsdom support, which is required for enzyme. -var jsdom = require('jsdom').jsdom; - -var exposedProperties = ['window', 'navigator', 'document']; - -global.document = jsdom(''); -global.window = document.defaultView; -Object.keys(document.defaultView).forEach((property) => { - if (typeof global[property] === 'undefined') { - exposedProperties.push(property); - global[property] = document.defaultView[property]; - } -}); - -global.navigator = { - userAgent: 'node.js' -}; - -process.on('unhandledRejection', function (error) { - console.error('Unhandled Promise Rejection:'); - console.error(error && error.stack || error); -}); - -require('./user/pretest.js'); diff --git a/packages/addon-comments/.scripts/publish_storybook.sh b/packages/addon-comments/.scripts/publish_storybook.sh deleted file mode 100644 index f8457308528e..000000000000 --- a/packages/addon-comments/.scripts/publish_storybook.sh +++ /dev/null @@ -1,47 +0,0 @@ -#!/bin/bash - -# IMPORTANT -# --------- -# This is an auto generated file with React CDK. -# Do not modify this file. - -set -e # exit with nonzero exit code if anything fails - -# get GIT url - -GIT_URL=`git config --get remote.origin.url` -if [[ $GIT_URL == "" ]]; then - echo "This project is not configured with a remote git repo". - exit 1 -fi - -# clear and re-create the out directory -rm -rf .out || exit 0; -mkdir .out; - -# run our compile script, discussed above -build-storybook -o .out - -# go to the out directory and create a *new* Git repo -cd .out -git init - -# inside this git repo we'll pretend to be a new user -git config user.name "GH Pages Bot" -git config user.email "hello@ghbot.com" - -# The first and only commit to this new Git repo contains all the -# files present with the commit message "Deploy to GitHub Pages". -git add . -git commit -m "Deploy Storybook to GitHub Pages" - -# Force push from the current repo's master branch to the remote -# repo's gh-pages branch. (All previous history on the gh-pages branch -# will be lost, since we are overwriting it.) We redirect any output to -# /dev/null to hide any sensitive credential data that might otherwise be exposed. -git push --force --quiet $GIT_URL master:gh-pages > /dev/null 2>&1 -cd .. -rm -rf .out - -echo "" -echo "=> Storybook deployed to: `node .scripts/get_gh_pages_url.js $GIT_URL`" diff --git a/packages/addon-comments/.scripts/user/prepublish.sh b/packages/addon-comments/.scripts/user/prepublish.sh deleted file mode 100644 index fdb64997963e..000000000000 --- a/packages/addon-comments/.scripts/user/prepublish.sh +++ /dev/null @@ -1 +0,0 @@ -# Use this file to your own code to run at NPM `prepublish` event. diff --git a/packages/addon-comments/.scripts/user/pretest.js b/packages/addon-comments/.scripts/user/pretest.js deleted file mode 100644 index a81bd36c2255..000000000000 --- a/packages/addon-comments/.scripts/user/pretest.js +++ /dev/null @@ -1 +0,0 @@ -// Use this file to setup any test utilities. diff --git a/packages/addon-comments/LICENSE b/packages/addon-comments/LICENSE deleted file mode 100644 index c2d2a91d0e89..000000000000 --- a/packages/addon-comments/LICENSE +++ /dev/null @@ -1,21 +0,0 @@ -The MIT License (MIT) - -Copyright (c) 2016 Your Name. - -Permission is hereby granted, free of charge, to any person obtaining a copy -of this software and associated documentation files (the "Software"), to deal -in the Software without restriction, including without limitation the rights -to use, copy, modify, merge, publish, distribute, sublicense, and/or sell -copies of the Software, and to permit persons to whom the Software is -furnished to do so, subject to the following conditions: - -The above copyright notice and this permission notice shall be included in -all copies or substantial portions of the Software. - -THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR -IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, -FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE -AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER -LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, -OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN -THE SOFTWARE. diff --git a/packages/addon-comments/README.md b/packages/addon-comments/README.md deleted file mode 100644 index 814d23ff0488..000000000000 --- a/packages/addon-comments/README.md +++ /dev/null @@ -1,19 +0,0 @@ -# Comments Addon - -This Storybook addon allows you to add comments for your stories. This addon works on [React Storybook](https://github.com/kadirahq/react-storybook). - -![](docs/screenshot.png) - -## Getting Started - -First, install the addon - -```shell -npm install -D @kadira/storybook-addon-comments -``` - -Add this line to your `addons.js` file (create this file inside your storybook config directory if needed). - -```js -import '@kadira/storybook-addon-comments/register'; -``` diff --git a/packages/addon-graphql/README.md b/packages/addon-graphql/README.md deleted file mode 100644 index 0be08a5c701a..000000000000 --- a/packages/addon-graphql/README.md +++ /dev/null @@ -1,60 +0,0 @@ -# GraphiQL Addon - -The GraphiQL addon can be used to display the GraphiQL IDE with example queries. This addon works with [React Storybook](https://github.com/kadirahq/react-storybook). - -![](docs/screenshot.png) - -## Getting Started - -First, install the addon - -```shell -npm install -D @kadira/storybook-addon-graphql -``` - -Import the `setupGraphiQL` function and use it to create the graphiql helper with a base url. - -```js -import { storiesOf } from '@kadira/storybook' -import { setupGraphiQL } from '@kadira/storybook-addon-graphql' - -// setup the graphiql helper which can be used with the add method later -const graphiql = setupGraphiQL({ url: 'http://localhost:3000/graphql' }); - -storiesOf('GraphQL Demo', module) - .add('get user info', graphiql(`{ - user(id: "1") { - name - } - }`)); -``` - -> Tip: try creating the helper in another file and import the configured graphiql helper from it - -## Advanced Setup - -The `setupGraphiQL` function also accepts a fetcher parameter which can be used to change how graphiql gets data. If the fetcher parameter is not given, it'll create a fetcher which uses the `fetch` api to make requests. The above example can also be written using a custom fetcher. - -```js -import { storiesOf } from '@kadira/storybook' -import { setupGraphiQL } from '@kadira/storybook-addon-graphql' - -const fetcher = function (params) { - const options = { - method: 'post', - headers: { 'Content-Type': 'application/json' }, - body: JSON.stringify(params), - }; - return fetch(url, options).then(res => res.json()); -}; - -// create the helper with a custom fetcher -const graphiql = setupGraphiQL({ fetcher }); - -storiesOf('GraphQL Demo', module) - .add('get user info', graphiql(`{ - user(id: "1") { - name - } - }`)); -``` diff --git a/packages/addon-info/.scripts/get_gh_pages_url.js b/packages/addon-info/.scripts/get_gh_pages_url.js deleted file mode 100644 index 062c690d8bea..000000000000 --- a/packages/addon-info/.scripts/get_gh_pages_url.js +++ /dev/null @@ -1,11 +0,0 @@ -// IMPORTANT -// --------- -// This is an auto generated file with React CDK. -// Do not modify this file. - -const parse = require('git-url-parse'); -var ghUrl = process.argv[2]; -const parsedUrl = parse(ghUrl); - -const ghPagesUrl = 'https://' + parsedUrl.owner + '.github.io/' + parsedUrl.name; -console.log(ghPagesUrl); diff --git a/packages/addon-info/.scripts/mocha_runner.js b/packages/addon-info/.scripts/mocha_runner.js deleted file mode 100644 index 87d88197cbc9..000000000000 --- a/packages/addon-info/.scripts/mocha_runner.js +++ /dev/null @@ -1,33 +0,0 @@ -// IMPORTANT -// --------- -// This is an auto generated file with React CDK. -// Do not modify this file. -// Use `.scripts/user/pretest.js instead`. - -require('babel-core/register'); -require('babel-polyfill'); - -// Add jsdom support, which is required for enzyme. -var jsdom = require('jsdom').jsdom; - -var exposedProperties = ['window', 'navigator', 'document']; - -global.document = jsdom(''); -global.window = document.defaultView; -Object.keys(document.defaultView).forEach((property) => { - if (typeof global[property] === 'undefined') { - exposedProperties.push(property); - global[property] = document.defaultView[property]; - } -}); - -global.navigator = { - userAgent: 'node.js' -}; - -process.on('unhandledRejection', function (error) { - console.error('Unhandled Promise Rejection:'); - console.error(error && error.stack || error); -}); - -require('./user/pretest.js'); diff --git a/packages/addon-info/.scripts/publish_storybook.sh b/packages/addon-info/.scripts/publish_storybook.sh deleted file mode 100644 index f8457308528e..000000000000 --- a/packages/addon-info/.scripts/publish_storybook.sh +++ /dev/null @@ -1,47 +0,0 @@ -#!/bin/bash - -# IMPORTANT -# --------- -# This is an auto generated file with React CDK. -# Do not modify this file. - -set -e # exit with nonzero exit code if anything fails - -# get GIT url - -GIT_URL=`git config --get remote.origin.url` -if [[ $GIT_URL == "" ]]; then - echo "This project is not configured with a remote git repo". - exit 1 -fi - -# clear and re-create the out directory -rm -rf .out || exit 0; -mkdir .out; - -# run our compile script, discussed above -build-storybook -o .out - -# go to the out directory and create a *new* Git repo -cd .out -git init - -# inside this git repo we'll pretend to be a new user -git config user.name "GH Pages Bot" -git config user.email "hello@ghbot.com" - -# The first and only commit to this new Git repo contains all the -# files present with the commit message "Deploy to GitHub Pages". -git add . -git commit -m "Deploy Storybook to GitHub Pages" - -# Force push from the current repo's master branch to the remote -# repo's gh-pages branch. (All previous history on the gh-pages branch -# will be lost, since we are overwriting it.) We redirect any output to -# /dev/null to hide any sensitive credential data that might otherwise be exposed. -git push --force --quiet $GIT_URL master:gh-pages > /dev/null 2>&1 -cd .. -rm -rf .out - -echo "" -echo "=> Storybook deployed to: `node .scripts/get_gh_pages_url.js $GIT_URL`" diff --git a/packages/addon-info/.scripts/user/prepublish.sh b/packages/addon-info/.scripts/user/prepublish.sh deleted file mode 100644 index fdb64997963e..000000000000 --- a/packages/addon-info/.scripts/user/prepublish.sh +++ /dev/null @@ -1 +0,0 @@ -# Use this file to your own code to run at NPM `prepublish` event. diff --git a/packages/addon-info/.scripts/user/pretest.js b/packages/addon-info/.scripts/user/pretest.js deleted file mode 100644 index a81bd36c2255..000000000000 --- a/packages/addon-info/.scripts/user/pretest.js +++ /dev/null @@ -1 +0,0 @@ -// Use this file to setup any test utilities. diff --git a/packages/addon-info/LICENSE b/packages/addon-info/LICENSE deleted file mode 100644 index c2d2a91d0e89..000000000000 --- a/packages/addon-info/LICENSE +++ /dev/null @@ -1,21 +0,0 @@ -The MIT License (MIT) - -Copyright (c) 2016 Your Name. - -Permission is hereby granted, free of charge, to any person obtaining a copy -of this software and associated documentation files (the "Software"), to deal -in the Software without restriction, including without limitation the rights -to use, copy, modify, merge, publish, distribute, sublicense, and/or sell -copies of the Software, and to permit persons to whom the Software is -furnished to do so, subject to the following conditions: - -The above copyright notice and this permission notice shall be included in -all copies or substantial portions of the Software. - -THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR -IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, -FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE -AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER -LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, -OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN -THE SOFTWARE. diff --git a/packages/addon-info/README.md b/packages/addon-info/README.md deleted file mode 100644 index 1f44ac2fb888..000000000000 --- a/packages/addon-info/README.md +++ /dev/null @@ -1,59 +0,0 @@ -# React Storybook Info Addon - -A React Storybook addon to show additional information for your stories. - -![React Storybook Screenshot](docs/home-screenshot.png) - -## Usage - -Install the following npm module: - -```sh -npm i -D @kadira/react-storybook-addon-info -``` - -Then set the addon in the place you configure storybook like this: - -```js -import { configure, setAddon } from '@kadira/storybook'; -import infoAddon from '@kadira/react-storybook-addon-info'; - -setAddon(infoAddon); - -configure(function () { - ... -}, module); -``` - -Then create your stories with the `.addWithInfo` API. - -```js -import React from 'react'; -import Button from './Button'; -import { storiesOf, action } from '@kadira/storybook'; - -storiesOf('Button') - .addWithInfo( - 'simple usage', - ` - This is the basic usage with the button with providing a label to show the text. - `, - () => ( -
-
- ), - ); -``` - -> Have a look at [this example](example/story.js) stories to learn more about the `addWithInfo` API. - -## The FAQ - -**Components lose their names on static build** - -Component names also get minified with other javascript code when building for production. When creating components, set the `displayName` static property to show the correct component name on static builds. diff --git a/packages/addon-knobs/.scripts/get_gh_pages_url.js b/packages/addon-knobs/.scripts/get_gh_pages_url.js deleted file mode 100644 index 062c690d8bea..000000000000 --- a/packages/addon-knobs/.scripts/get_gh_pages_url.js +++ /dev/null @@ -1,11 +0,0 @@ -// IMPORTANT -// --------- -// This is an auto generated file with React CDK. -// Do not modify this file. - -const parse = require('git-url-parse'); -var ghUrl = process.argv[2]; -const parsedUrl = parse(ghUrl); - -const ghPagesUrl = 'https://' + parsedUrl.owner + '.github.io/' + parsedUrl.name; -console.log(ghPagesUrl); diff --git a/packages/addon-knobs/.scripts/publish_storybook.sh b/packages/addon-knobs/.scripts/publish_storybook.sh deleted file mode 100644 index f8457308528e..000000000000 --- a/packages/addon-knobs/.scripts/publish_storybook.sh +++ /dev/null @@ -1,47 +0,0 @@ -#!/bin/bash - -# IMPORTANT -# --------- -# This is an auto generated file with React CDK. -# Do not modify this file. - -set -e # exit with nonzero exit code if anything fails - -# get GIT url - -GIT_URL=`git config --get remote.origin.url` -if [[ $GIT_URL == "" ]]; then - echo "This project is not configured with a remote git repo". - exit 1 -fi - -# clear and re-create the out directory -rm -rf .out || exit 0; -mkdir .out; - -# run our compile script, discussed above -build-storybook -o .out - -# go to the out directory and create a *new* Git repo -cd .out -git init - -# inside this git repo we'll pretend to be a new user -git config user.name "GH Pages Bot" -git config user.email "hello@ghbot.com" - -# The first and only commit to this new Git repo contains all the -# files present with the commit message "Deploy to GitHub Pages". -git add . -git commit -m "Deploy Storybook to GitHub Pages" - -# Force push from the current repo's master branch to the remote -# repo's gh-pages branch. (All previous history on the gh-pages branch -# will be lost, since we are overwriting it.) We redirect any output to -# /dev/null to hide any sensitive credential data that might otherwise be exposed. -git push --force --quiet $GIT_URL master:gh-pages > /dev/null 2>&1 -cd .. -rm -rf .out - -echo "" -echo "=> Storybook deployed to: `node .scripts/get_gh_pages_url.js $GIT_URL`" diff --git a/packages/addon-knobs/.scripts/user/prepublish.sh b/packages/addon-knobs/.scripts/user/prepublish.sh deleted file mode 100644 index fdb64997963e..000000000000 --- a/packages/addon-knobs/.scripts/user/prepublish.sh +++ /dev/null @@ -1 +0,0 @@ -# Use this file to your own code to run at NPM `prepublish` event. diff --git a/packages/addon-knobs/.scripts/user/pretest.js b/packages/addon-knobs/.scripts/user/pretest.js deleted file mode 100644 index a81bd36c2255..000000000000 --- a/packages/addon-knobs/.scripts/user/pretest.js +++ /dev/null @@ -1 +0,0 @@ -// Use this file to setup any test utilities. diff --git a/packages/addon-knobs/LICENSE b/packages/addon-knobs/LICENSE deleted file mode 100644 index 12b139802595..000000000000 --- a/packages/addon-knobs/LICENSE +++ /dev/null @@ -1,21 +0,0 @@ -The MIT License (MIT) - -Copyright (c) 2016 Kadira Inc. - -Permission is hereby granted, free of charge, to any person obtaining a copy -of this software and associated documentation files (the "Software"), to deal -in the Software without restriction, including without limitation the rights -to use, copy, modify, merge, publish, distribute, sublicense, and/or sell -copies of the Software, and to permit persons to whom the Software is -furnished to do so, subject to the following conditions: - -The above copyright notice and this permission notice shall be included in -all copies or substantial portions of the Software. - -THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR -IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, -FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE -AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER -LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, -OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN -THE SOFTWARE. diff --git a/packages/addon-links/.storybook/addons.js b/packages/addon-links/.storybook/addons.js deleted file mode 100644 index ed46b38dad88..000000000000 --- a/packages/addon-links/.storybook/addons.js +++ /dev/null @@ -1,3 +0,0 @@ -// Use the line below to register this addon -// import '@kadira/storybook-addon-links/register'; -import '../register'; diff --git a/packages/addon-links/README.md b/packages/addon-links/README.md deleted file mode 100644 index e0edaf451759..000000000000 --- a/packages/addon-links/README.md +++ /dev/null @@ -1,34 +0,0 @@ -# Story Links Addon - -The Story Links addon can be used to create links between stories. This addon works with both [React Storybook](https://github.com/kadirahq/react-storybook) and [React Native Storybook](https://github.com/kadirahq/react-native-storybook) (included by default). - -## Getting Started - -You can use this addon without installing it. - -```js -import { storiesOf } from '@kadira/storybook' -import { linkTo } from '@kadira/storybook-addon-links' - -storiesOf('Button', module) - .add('First', () => ( - - )) - .add('Second', () => ( - - )); -``` - -Have a look at the linkTo function: - -```js -linkTo('Toggle', 'off') -``` - -With that, you can link an event in a component to any story in the Storybook. - -* First parameter is the the story kind name (what you named with `storiesOf`). -* Second parameter is the story name (what you named with `.add`). - -> You can also pass a function instead for any of above parameter. That function accepts arguments emitted by the event and it should return a string.
-> Have a look at [PR86](https://github.com/kadirahq/react-storybook/pull/86) for more information. diff --git a/packages/addon-notes/.scripts/get_gh_pages_url.js b/packages/addon-notes/.scripts/get_gh_pages_url.js deleted file mode 100644 index 062c690d8bea..000000000000 --- a/packages/addon-notes/.scripts/get_gh_pages_url.js +++ /dev/null @@ -1,11 +0,0 @@ -// IMPORTANT -// --------- -// This is an auto generated file with React CDK. -// Do not modify this file. - -const parse = require('git-url-parse'); -var ghUrl = process.argv[2]; -const parsedUrl = parse(ghUrl); - -const ghPagesUrl = 'https://' + parsedUrl.owner + '.github.io/' + parsedUrl.name; -console.log(ghPagesUrl); diff --git a/packages/addon-notes/.scripts/mocha_runner.js b/packages/addon-notes/.scripts/mocha_runner.js deleted file mode 100644 index 87d88197cbc9..000000000000 --- a/packages/addon-notes/.scripts/mocha_runner.js +++ /dev/null @@ -1,33 +0,0 @@ -// IMPORTANT -// --------- -// This is an auto generated file with React CDK. -// Do not modify this file. -// Use `.scripts/user/pretest.js instead`. - -require('babel-core/register'); -require('babel-polyfill'); - -// Add jsdom support, which is required for enzyme. -var jsdom = require('jsdom').jsdom; - -var exposedProperties = ['window', 'navigator', 'document']; - -global.document = jsdom(''); -global.window = document.defaultView; -Object.keys(document.defaultView).forEach((property) => { - if (typeof global[property] === 'undefined') { - exposedProperties.push(property); - global[property] = document.defaultView[property]; - } -}); - -global.navigator = { - userAgent: 'node.js' -}; - -process.on('unhandledRejection', function (error) { - console.error('Unhandled Promise Rejection:'); - console.error(error && error.stack || error); -}); - -require('./user/pretest.js'); diff --git a/packages/addon-notes/.scripts/publish_storybook.sh b/packages/addon-notes/.scripts/publish_storybook.sh deleted file mode 100644 index f8457308528e..000000000000 --- a/packages/addon-notes/.scripts/publish_storybook.sh +++ /dev/null @@ -1,47 +0,0 @@ -#!/bin/bash - -# IMPORTANT -# --------- -# This is an auto generated file with React CDK. -# Do not modify this file. - -set -e # exit with nonzero exit code if anything fails - -# get GIT url - -GIT_URL=`git config --get remote.origin.url` -if [[ $GIT_URL == "" ]]; then - echo "This project is not configured with a remote git repo". - exit 1 -fi - -# clear and re-create the out directory -rm -rf .out || exit 0; -mkdir .out; - -# run our compile script, discussed above -build-storybook -o .out - -# go to the out directory and create a *new* Git repo -cd .out -git init - -# inside this git repo we'll pretend to be a new user -git config user.name "GH Pages Bot" -git config user.email "hello@ghbot.com" - -# The first and only commit to this new Git repo contains all the -# files present with the commit message "Deploy to GitHub Pages". -git add . -git commit -m "Deploy Storybook to GitHub Pages" - -# Force push from the current repo's master branch to the remote -# repo's gh-pages branch. (All previous history on the gh-pages branch -# will be lost, since we are overwriting it.) We redirect any output to -# /dev/null to hide any sensitive credential data that might otherwise be exposed. -git push --force --quiet $GIT_URL master:gh-pages > /dev/null 2>&1 -cd .. -rm -rf .out - -echo "" -echo "=> Storybook deployed to: `node .scripts/get_gh_pages_url.js $GIT_URL`" diff --git a/packages/addon-notes/.scripts/user/prepublish.sh b/packages/addon-notes/.scripts/user/prepublish.sh deleted file mode 100644 index fdb64997963e..000000000000 --- a/packages/addon-notes/.scripts/user/prepublish.sh +++ /dev/null @@ -1 +0,0 @@ -# Use this file to your own code to run at NPM `prepublish` event. diff --git a/packages/addon-notes/.scripts/user/pretest.js b/packages/addon-notes/.scripts/user/pretest.js deleted file mode 100644 index a81bd36c2255..000000000000 --- a/packages/addon-notes/.scripts/user/pretest.js +++ /dev/null @@ -1 +0,0 @@ -// Use this file to setup any test utilities. diff --git a/packages/addon-notes/README.md b/packages/addon-notes/README.md deleted file mode 100644 index 33ba04da87c1..000000000000 --- a/packages/addon-notes/README.md +++ /dev/null @@ -1,41 +0,0 @@ -# Storybook Addon Notes - -This [Storybook](https://getstorybook.io) addon allows you to write notes for your stories. - -![Storybook Addon Notes Demo](docs/demo.png) - -### Getting Started -**note: addons require @kadira/storybook 2.x or greater* - -```sh -npm i --save-dev @kadira/storybook-addon-notes -``` - -Then create a file called `addons.js` in your storybook config. - -Add following content to it: - -```js -import '@kadira/storybook-addon-notes/register'; -``` - -Then write your stories like this: - -```js -import React from 'react'; -import { storiesOf, action } from '@kadira/storybook'; -import Button from './Button'; -import { WithNotes } from '@kadira/storybook-addon-notes'; - -storiesOf('Button', module) - .add('with text', () => ( - - - - )) - .add('with some emoji', () => ( - - - - )); -``` diff --git a/packages/addon-options/.storybook/addons.js b/packages/addon-options/.storybook/addons.js deleted file mode 100644 index b9a4a1122979..000000000000 --- a/packages/addon-options/.storybook/addons.js +++ /dev/null @@ -1,3 +0,0 @@ -// Use the line below to register this addon -// import '@kadira/storybook-addon-hello/register'; -import '../register'; diff --git a/packages/addon-options/README.md b/packages/addon-options/README.md deleted file mode 100644 index 32bce157ba85..000000000000 --- a/packages/addon-options/README.md +++ /dev/null @@ -1,39 +0,0 @@ -# Storybook UI Options Addon - -The Options addon can be used to set configure the Storybook UI. This addon works with both [React Storybook](https://github.com/kadirahq/react-storybook) and [React Native Storybook](https://github.com/kadirahq/react-native-storybook). - -![](docs/screenshot.png) - -## Getting Started - -First, install the addon - -```shell -npm install -D @kadira/storybook-addon-options -``` - -Add this line to your `addons.js` file (create this file inside your storybook config directory if needed). - -```js -import '@kadira/storybook-addon-options/register'; -``` - -Import and use the `setOptions` function in your config.js file. - -```js -import * as storybook from '@kadira/storybook'; -import { setOptions } from '@kadira/storybook-addon-options'; - -setOptions({ - name: 'CUSTOM-OPTIONS', - url: 'https://github.com/kadirahq/storybook-addon-options', - goFullScreen: false, - showLeftPanel: false, - showDownPanel: false, - showSearchBox: false, - downPanelInRight: false, - sortStoriesByKind: false, -}); - -storybook.configure(() => require('./stories'), module); -``` diff --git a/packages/addons/LICENSE b/packages/addons/LICENSE deleted file mode 100644 index 8e16f1d5f6e1..000000000000 --- a/packages/addons/LICENSE +++ /dev/null @@ -1,21 +0,0 @@ -The MIT License (MIT) - -Copyright (c) 2016 Muhammed Thanish - -Permission is hereby granted, free of charge, to any person obtaining a copy -of this software and associated documentation files (the "Software"), to deal -in the Software without restriction, including without limitation the rights -to use, copy, modify, merge, publish, distribute, sublicense, and/or sell -copies of the Software, and to permit persons to whom the Software is -furnished to do so, subject to the following conditions: - -The above copyright notice and this permission notice shall be included in all -copies or substantial portions of the Software. - -THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR -IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, -FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE -AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER -LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, -OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE -SOFTWARE. diff --git a/packages/addons/README.md b/packages/addons/README.md deleted file mode 100644 index 015ee4e4a6ff..000000000000 --- a/packages/addons/README.md +++ /dev/null @@ -1,7 +0,0 @@ -# Storybook Addons - -Storybook Addons is a node module which is used to load custom addons to storybook. It stores addon loaders, communication channel and other resources which can be used by storybook implementations where required. - -## Writing New Addons - -> TODO diff --git a/packages/channel-postmessage/README.md b/packages/channel-postmessage/README.md deleted file mode 100644 index cdd7b75a9de7..000000000000 --- a/packages/channel-postmessage/README.md +++ /dev/null @@ -1,8 +0,0 @@ -# Post Message Channel - -Post Message channel for Kadira Storybooks. This channel can be used when the Storybook Renderer runs inside an iframe or a child window. A channel can be created using the `createChannel` function. - -```js -import createChannel from '@kadira/storybook-channel-postmsg' -const channel = createChannel({ key: 'postmsg-key' }) -``` diff --git a/packages/channel-websocket/README.md b/packages/channel-websocket/README.md deleted file mode 100644 index 2fb9ef733a73..000000000000 --- a/packages/channel-websocket/README.md +++ /dev/null @@ -1,8 +0,0 @@ -# Websocket Channel - -Websocket channel for Kadira Storybooks. This channel can be used when the Storybook Renderer should communicate with the Storybook Manager over the network. A channel can be created using the `createChannel` function. - -```js -import createChannel from '@kadira/storybook-channel-websocket' -const channel = createChannel({ url: 'ws://localhost:9001' }) -``` diff --git a/packages/channel/README.md b/packages/channel/README.md deleted file mode 100644 index fc0f93bc4724..000000000000 --- a/packages/channel/README.md +++ /dev/null @@ -1,35 +0,0 @@ -# Storybook Channel - -Storybook Channel is similar to an EventEmitter. Channels are used with Storybook implementations to send/receive events between the Storybook Manager and the Storybook Renderer. - -``` -Channel { - addListener(type, listener) - emit(type, ...args) - eventNames() - listenerCount(type) - listeners(type) - on(type, listener) - once(type, listener) - prependListener(type, listener) - prependOnceListener(type, listener) - removeAllListeners(type) - removeListener(type, listener) -} -``` - -The channel takes a Transport object as a parameter which will be used to send/receive messages. The transport object should implement this interface. - -``` -Transport { - send(event) - setHandler(handler) -} -``` - -Currently, channels are baked into storybook implementations and therefore this module is not designed to be used directly by addon developers. When developing addons, use the `getChannel` method exported by `@kadira/storybook-addons` module. For this to work, Storybook implementations should use the `setChannel` method before loading addons. - -```js -import addons from '@kadira/storybook-addons' -const channel = addons.getChannel() -``` diff --git a/packages/decorator-centered/LICENSE b/packages/decorator-centered/LICENSE deleted file mode 100644 index 3b8705f5e3c1..000000000000 --- a/packages/decorator-centered/LICENSE +++ /dev/null @@ -1,21 +0,0 @@ -The MIT License (MIT) - -Copyright (c) 2016 KADIRA - -Permission is hereby granted, free of charge, to any person obtaining a copy -of this software and associated documentation files (the "Software"), to deal -in the Software without restriction, including without limitation the rights -to use, copy, modify, merge, publish, distribute, sublicense, and/or sell -copies of the Software, and to permit persons to whom the Software is -furnished to do so, subject to the following conditions: - -The above copyright notice and this permission notice shall be included in all -copies or substantial portions of the Software. - -THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR -IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, -FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE -AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER -LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, -OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE -SOFTWARE. diff --git a/packages/decorator-centered/README.md b/packages/decorator-centered/README.md deleted file mode 100644 index c6cfdade97c8..000000000000 --- a/packages/decorator-centered/README.md +++ /dev/null @@ -1,69 +0,0 @@ -# React Storybook Centered Decorator - -React Storybook decorator to center components. - -### Usage - -```sh -npm i @kadira/react-storybook-decorator-centered -``` - -#### As a decorator -You can set the decorator locally: - -```js -import React from 'react'; -import { storiesOf } from '@kadira/storybook'; -import MyComponent from '../my_component'; -import centered from '@kadira/react-storybook-decorator-centered'; - -storiesOf('MyComponent', module) - .addDecorator(centered) - .add('without props', () => ()) - .add('with some props', () => ()); -``` - -Or you can also add this decorator globally: - -```js -import { configure, addDecorator } from '@kadira/storybook'; -import centered from '@kadira/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 '@kadira/storybook'; -import centered from '@kadira/react-storybook-decorator-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 '@kadira/storybook'; -import MyComponent from '../my_component'; - -storiesOf('MyComponent', module) - .addCentered('without props', () => ()) -``` diff --git a/packages/getstorybook/LICENSE b/packages/getstorybook/LICENSE deleted file mode 100644 index 12b139802595..000000000000 --- a/packages/getstorybook/LICENSE +++ /dev/null @@ -1,21 +0,0 @@ -The MIT License (MIT) - -Copyright (c) 2016 Kadira Inc. - -Permission is hereby granted, free of charge, to any person obtaining a copy -of this software and associated documentation files (the "Software"), to deal -in the Software without restriction, including without limitation the rights -to use, copy, modify, merge, publish, distribute, sublicense, and/or sell -copies of the Software, and to permit persons to whom the Software is -furnished to do so, subject to the following conditions: - -The above copyright notice and this permission notice shall be included in -all copies or substantial portions of the Software. - -THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR -IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, -FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE -AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER -LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, -OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN -THE SOFTWARE. diff --git a/packages/getstorybook/README.md b/packages/getstorybook/README.md deleted file mode 100644 index 9f47e98c0442..000000000000 --- a/packages/getstorybook/README.md +++ /dev/null @@ -1,36 +0,0 @@ -# getstorybook - -Easiest way to add [Storybook](https://github.com/kadirahq/react-storybook) support to your project. - -![](docs/getstorybook.png) - -First install the storybook generator globally. - -``` -npm i -g getstorybook -``` - -Then go to your project and run: - -``` -getstorybook -``` - -That's all you've to do. - ---- - -## [Yarn](https://github.com/yarnpkg/yarn) support - -`getstorybook` also supports yarn. -If you have installed yarn in your system, it'll detect it and use `yarn` instead of `npm`. - -If you don't want to use `yarn` always you can use the `--use-npm` option like this: - -``` -getstorybook --use-npm -``` - - - -For more information, refer [React Storybook](https://github.com/kadirahq/react-storybook) documentation. diff --git a/packages/getstorybook/generators/METEOR/template/.storybook/addons.js b/packages/getstorybook/generators/METEOR/template/.storybook/addons.js deleted file mode 100644 index e8590efcf2fd..000000000000 --- a/packages/getstorybook/generators/METEOR/template/.storybook/addons.js +++ /dev/null @@ -1,2 +0,0 @@ -import '@kadira/storybook-addon-actions/register'; -import '@kadira/storybook-addon-links/register'; diff --git a/packages/getstorybook/generators/REACT/template/.storybook/addons.js b/packages/getstorybook/generators/REACT/template/.storybook/addons.js deleted file mode 100644 index e8590efcf2fd..000000000000 --- a/packages/getstorybook/generators/REACT/template/.storybook/addons.js +++ /dev/null @@ -1,2 +0,0 @@ -import '@kadira/storybook-addon-actions/register'; -import '@kadira/storybook-addon-links/register'; diff --git a/packages/getstorybook/generators/REACT_NATIVE/template/storybook/addons.js b/packages/getstorybook/generators/REACT_NATIVE/template/storybook/addons.js deleted file mode 100644 index e8590efcf2fd..000000000000 --- a/packages/getstorybook/generators/REACT_NATIVE/template/storybook/addons.js +++ /dev/null @@ -1,2 +0,0 @@ -import '@kadira/storybook-addon-actions/register'; -import '@kadira/storybook-addon-links/register'; diff --git a/packages/getstorybook/generators/REACT_SCRIPTS/template/.storybook/addons.js b/packages/getstorybook/generators/REACT_SCRIPTS/template/.storybook/addons.js deleted file mode 100644 index e8590efcf2fd..000000000000 --- a/packages/getstorybook/generators/REACT_SCRIPTS/template/.storybook/addons.js +++ /dev/null @@ -1,2 +0,0 @@ -import '@kadira/storybook-addon-actions/register'; -import '@kadira/storybook-addon-links/register'; diff --git a/packages/react-native-storybook/LICENSE b/packages/react-native-storybook/LICENSE deleted file mode 100644 index 5eb9eff887e4..000000000000 --- a/packages/react-native-storybook/LICENSE +++ /dev/null @@ -1,21 +0,0 @@ -The MIT License (MIT) - -Copyright (c) 2016 Kadira Tools Inc. - -Permission is hereby granted, free of charge, to any person obtaining a copy -of this software and associated documentation files (the "Software"), to deal -in the Software without restriction, including without limitation the rights -to use, copy, modify, merge, publish, distribute, sublicense, and/or sell -copies of the Software, and to permit persons to whom the Software is -furnished to do so, subject to the following conditions: - -The above copyright notice and this permission notice shall be included in -all copies or substantial portions of the Software. - -THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR -IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, -FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE -AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER -LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, -OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN -THE SOFTWARE. diff --git a/packages/react-native-storybook/readme.md b/packages/react-native-storybook/readme.md deleted file mode 100644 index b795a399ee56..000000000000 --- a/packages/react-native-storybook/readme.md +++ /dev/null @@ -1,35 +0,0 @@ -# React Native Storybook - -With React Native Storybook you can design and develop individual React Native components without running your app. - -![React Storybook Screenshot](docs/assets/readme/screenshot.png) - -## Getting Started - -The `getstorybook` tool can be used to add Storybook to your React Native app. Install the `getstorybook` tool if necessary and run it from your project directory with these commands: - -```shell -npm -g i getstorybook -getstorybook -``` - -## Start the Storybook - -After initial setup start the storybook server with the storybook npm script. - -```shell -npm run storybook -``` - -also start your mobile app with the `react-native` command. - -``` -react-native run-ios -react-native run-android -``` - -Now, you can open to view your storybook. - -## Learn More - -Check the `docs` directory in this repo for more advanced setup guides and other info. diff --git a/packages/react-native-storybook/src/server/addons.js b/packages/react-native-storybook/src/server/addons.js deleted file mode 100644 index e05a3e134a71..000000000000 --- a/packages/react-native-storybook/src/server/addons.js +++ /dev/null @@ -1,8 +0,0 @@ -import deprecate from 'util-deprecate'; -import '@kadira/storybook-addon-actions/register'; -import '@kadira/storybook-addon-links/register'; - -deprecate( - () => {}, - '@kadira/react-native-storybook/addons is deprecated. See https://storybooks.js.org/docs/react-storybook/addons/using-addons/', -)(); diff --git a/packages/react-storybook/LICENSE b/packages/react-storybook/LICENSE deleted file mode 100644 index 12b139802595..000000000000 --- a/packages/react-storybook/LICENSE +++ /dev/null @@ -1,21 +0,0 @@ -The MIT License (MIT) - -Copyright (c) 2016 Kadira Inc. - -Permission is hereby granted, free of charge, to any person obtaining a copy -of this software and associated documentation files (the "Software"), to deal -in the Software without restriction, including without limitation the rights -to use, copy, modify, merge, publish, distribute, sublicense, and/or sell -copies of the Software, and to permit persons to whom the Software is -furnished to do so, subject to the following conditions: - -The above copyright notice and this permission notice shall be included in -all copies or substantial portions of the Software. - -THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR -IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, -FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE -AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER -LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, -OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN -THE SOFTWARE. diff --git a/packages/react-storybook/README.md b/packages/react-storybook/README.md deleted file mode 100644 index dd150b6c923c..000000000000 --- a/packages/react-storybook/README.md +++ /dev/null @@ -1,32 +0,0 @@ -# React Storybook [![Build Status](https://travis-ci.org/storybooks/react-storybook.svg?branch=master)](https://travis-ci.org/storybooks/react-storybook) [![npm version](https://badge.fury.io/js/%40kadira%2Fstorybook.svg)](https://badge.fury.io/js/%40kadira%2Fstorybook) [![Storybook Slack](https://storybooks-slackin.herokuapp.com/badge.svg)](https://storybooks-slackin.herokuapp.com/) - -React Storybook is a UI development environment for your React components. With it, you can visualize different states of your UI components and develop them interactively. - -![React Storybook Screenshot](docs/demo.gif) - -React Storybook runs outside of your app. So you can develop UI components in isolation without worrying about app specific dependencies and requirements. - -## Getting Started - -```js -npm i -g getstorybook -cd my-react-app -getstorybook -``` - -For more information visit: https://storybooks.js.org - ---- - -React Storybook also comes with a lot of [addons](https://storybooks.js.org/docs/react-storybook/addons/introduction) and a great API to customize as you wish. You can also build a [static version](https://storybooks.js.org/docs/react-storybook/basics/exporting-storybook) of your storybook and deploy it anywhere you want. - -Here are some featured storybooks that you can reference to see how Storybook works: - - * [Demo of React Dates](http://airbnb.io/react-dates/) - [source](https://github.com/airbnb/react-dates) - * [Demo of React Native Web](http://necolas.github.io/react-native-web/storybook/) - [source](https://github.com/necolas/react-native-web) - -## Docs - -* [Basics](https://storybooks.js.org/docs/react-storybook/basics/introduction) -* [Configurations](https://storybooks.js.org/docs/react-storybook/configurations/default-config) -* [Addons](https://storybooks.js.org/docs/react-storybook/addons/introduction) diff --git a/packages/react-storybook/addons.js b/packages/react-storybook/addons.js deleted file mode 100644 index fcad03f18232..000000000000 --- a/packages/react-storybook/addons.js +++ /dev/null @@ -1,4 +0,0 @@ -// We are not using this file inside this project. -// But, this will be useful when a user is configuring it's own addons. -// Then he can import this file to add default set of addons. -require('./dist/server/addons'); diff --git a/packages/react-storybook/demo/.storybook/addons.js b/packages/react-storybook/demo/.storybook/addons.js deleted file mode 100644 index e8590efcf2fd..000000000000 --- a/packages/react-storybook/demo/.storybook/addons.js +++ /dev/null @@ -1,2 +0,0 @@ -import '@kadira/storybook-addon-actions/register'; -import '@kadira/storybook-addon-links/register'; diff --git a/packages/react-storybook/scripts/mocha_runner.js b/packages/react-storybook/scripts/mocha_runner.js deleted file mode 100755 index 4b6b7654db95..000000000000 --- a/packages/react-storybook/scripts/mocha_runner.js +++ /dev/null @@ -1,25 +0,0 @@ -require('babel-core/register'); -require('babel-polyfill'); - -// Add jsdom support, which is required for enzyme. -const jsdom = require('jsdom').jsdom; - -const exposedProperties = ['window', 'navigator', 'document']; - -global.document = jsdom(''); -global.window = document.defaultView; -Object.keys(document.defaultView).forEach(property => { - if (typeof global[property] === 'undefined') { - exposedProperties.push(property); - global[property] = document.defaultView[property]; - } -}); - -global.navigator = { - userAgent: 'node.js', -}; - -process.on('unhandledRejection', error => { - console.error('Unhandled Promise Rejection:'); - console.error((error && error.stack) || error); -}); diff --git a/packages/react-storybook/scripts/publish.sh b/packages/react-storybook/scripts/publish.sh deleted file mode 100755 index 1da08771110f..000000000000 --- a/packages/react-storybook/scripts/publish.sh +++ /dev/null @@ -1,2 +0,0 @@ -#!/usr/bin/env bash -npm publish --access=public diff --git a/packages/react-storybook/src/server/addons.js b/packages/react-storybook/src/server/addons.js deleted file mode 100644 index 40fd2193b246..000000000000 --- a/packages/react-storybook/src/server/addons.js +++ /dev/null @@ -1,8 +0,0 @@ -import deprecate from 'util-deprecate'; -import '@kadira/storybook-addon-actions/register'; -import '@kadira/storybook-addon-links/register'; - -deprecate( - () => {}, - '@kadira/storybook/addons is deprecated. See https://storybooks.js.org/docs/react-storybook/addons/using-addons/', -)(); diff --git a/packages/react-storybook/src/server/track_usage.js b/packages/react-storybook/src/server/track_usage.js deleted file mode 100644 index 835d62e152c4..000000000000 --- a/packages/react-storybook/src/server/track_usage.js +++ /dev/null @@ -1,91 +0,0 @@ -// ### WHAT? -// -// We will track anonymous usage of how you use storybook. -// We don't want any personal information. -// We just need to collect following information -// -// * How many time a user runs start-storybook a day -// -// We will send a ping to our server when you run storybook with above information. - -// ### WHY? -// -// We are maintaining React Storybook and we want to improve it. -// We also working on storybooks.io which is storybook related service. -// In order to get a real picture about the storybook usage, -// we need to get some real usage stats, not the amount of NPM downloads. -// This is why we do this. - -// ### CAN I STOP THIS? -// -// You(or your company) may have certain policies. -// If so, you can stop sending these metrics. -// To do that, use --dont-track flag when running React Storybook. -// start-storybook --dont-track -p 9001 - -// ### HELP US? -// -// Maintaining a open source project is hard. -// It's even harder for a startup like us (Kadira) -// Help us to make storybook better by sending these few metrics. -// Based on these metrics, we could improve storybook and build a profitable -// service around it. With that, we could continue to maintain and -// improve Storybook. - -import ConfigStore from 'configstore'; -import UUID from 'uuid'; -import request from 'request'; - -const logger = console; - -let DONT_TRACK = false; - -export function getStore() { - const key = 'react-storybook-usage'; - const store = new ConfigStore(key); - return store; -} - -export function track() { - if (DONT_TRACK) return; - - const store = getStore(); - - // Just a hash to aggregate metrics. Don't use any personal info. - let userId = store.get('userId'); - if (!userId) { - userId = UUID.v4(); - store.set('userId', userId); - } - - const pkg = require('../../package.json'); - - // We don't wanna worry about the success or failure of this. - request.post( - 'https://ping.getstorybook.io/react-storybook-usage', - { - json: { - userId, - version: pkg.version, - }, - }, - () => {}, - ); - - if (!store.get('startTrackingOn')) { - store.set('startTrackingOn', Date.now()); - } - - const pingsSent = store.get('pingsSent') || 0; - store.set('pingsSent', pingsSent + 1); - - if (pingsSent < 5) { - logger.log(' We will collect some anonymous usage stats of how you use storybook.'); - logger.log(' See why?: https://getstorybook.io/tracking'); - logger.log(); - } -} - -export function dontTrack() { - DONT_TRACK = true; -} diff --git a/packages/storybook-ui/LICENSE b/packages/storybook-ui/LICENSE deleted file mode 100644 index c2d2a91d0e89..000000000000 --- a/packages/storybook-ui/LICENSE +++ /dev/null @@ -1,21 +0,0 @@ -The MIT License (MIT) - -Copyright (c) 2016 Your Name. - -Permission is hereby granted, free of charge, to any person obtaining a copy -of this software and associated documentation files (the "Software"), to deal -in the Software without restriction, including without limitation the rights -to use, copy, modify, merge, publish, distribute, sublicense, and/or sell -copies of the Software, and to permit persons to whom the Software is -furnished to do so, subject to the following conditions: - -The above copyright notice and this permission notice shall be included in -all copies or substantial portions of the Software. - -THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR -IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, -FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE -AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER -LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, -OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN -THE SOFTWARE. diff --git a/packages/storybook-ui/src/modules/ui/components/layout/usplit.js b/packages/storybook-ui/src/modules/ui/components/layout/usplit.js deleted file mode 100644 index 890e5b366e7d..000000000000 --- a/packages/storybook-ui/src/modules/ui/components/layout/usplit.js +++ /dev/null @@ -1,61 +0,0 @@ -import React from 'react'; -import PropTypes from 'prop-types'; - -const gripSize = 1; -const splitSize = 10; - -const wrapStyle = (shift, split) => - (split === 'vertical' - ? { - width: splitSize, - marginLeft: shift - splitSize / 2, - marginRight: -shift - splitSize / 2, - position: 'relative', - } - : { - /* horizontal */ - height: splitSize, - marginTop: shift - splitSize / 2, - marginBottom: -shift - splitSize / 2, - position: 'relative', - }); - -const spanStyle = split => - (split === 'vertical' - ? { - width: gripSize, - height: 20, - left: splitSize / 2 - (gripSize + 2) / 2, - top: '50%', - position: 'absolute', - borderLeft: 'solid 1px rgba(0,0,0,0.1)', - borderRight: 'solid 1px rgba(0,0,0,0.1)', - } - : { - /* horizontal */ - height: gripSize, - width: 20, - top: splitSize / 2 - (gripSize + 2) / 2, - left: '50%', - position: 'absolute', - borderTop: 'solid 1px rgba(0,0,0,0.1)', - borderBottom: 'solid 1px rgba(0,0,0,0.1)', - }); - -const USplit = ({ shift, split }) => ( -
- -
-); - -USplit.PropTypes = { - shift: PropTypes.number, - split: PropTypes.oneOf(['vertical', 'horizontal']), -}; - -USplit.defaultProps = { - shift: 0, - split: 'vertical', -}; - -export default USplit; diff --git a/packages/storyshots/LICENSE b/packages/storyshots/LICENSE deleted file mode 100644 index 12b139802595..000000000000 --- a/packages/storyshots/LICENSE +++ /dev/null @@ -1,21 +0,0 @@ -The MIT License (MIT) - -Copyright (c) 2016 Kadira Inc. - -Permission is hereby granted, free of charge, to any person obtaining a copy -of this software and associated documentation files (the "Software"), to deal -in the Software without restriction, including without limitation the rights -to use, copy, modify, merge, publish, distribute, sublicense, and/or sell -copies of the Software, and to permit persons to whom the Software is -furnished to do so, subject to the following conditions: - -The above copyright notice and this permission notice shall be included in -all copies or substantial portions of the Software. - -THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR -IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, -FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE -AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER -LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, -OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN -THE SOFTWARE. diff --git a/scripts/prepublish.js b/scripts/prepublish.js index 147b25dbe321..8a02b8acd3ea 100644 --- a/scripts/prepublish.js +++ b/scripts/prepublish.js @@ -1,10 +1,14 @@ const path = require('path'); const shell = require('shelljs'); const chalk = require('chalk'); -const babel = path.join(__dirname, '..', 'node_modules', '.bin', 'babel'); -require('./ver'); +const packageJson = require('../package.json'); +shell.echo(chalk.bold(`${packageJson.name}@${packageJson.version}`)); + +shell.echo(chalk.gray('\n=> Clean dist.')); +shell.rm('-rf', 'dist'); +const babel = path.join(__dirname, '..', 'node_modules', '.bin', 'babel'); const args = [ '--ignore tests,__tests__,test.js,stories/,story.jsx', '--plugins "transform-runtime"', @@ -12,15 +16,17 @@ const args = [ '--copy-files', ].join(' '); -const cmd = `${babel} ${args}`; -shell.rm('-rf', 'dist'); - +const command = `${babel} ${args}`; shell.echo(chalk.gray('\n=> Transpiling "src" into ES5 ...\n')); -shell.echo(chalk.gray(cmd)); +shell.echo(chalk.gray(command)); shell.echo(''); -const code = shell.exec(cmd).code; +const code = shell.exec(command).code; if (code === 0) { shell.echo(chalk.gray('\n=> Transpiling completed.')); } else { shell.exit(code); } + +const licence = path.join(__dirname, '..', 'LICENSE'); +shell.echo(chalk.gray('\n=> Copy LICENSE.')); +shell.cp(licence, './'); diff --git a/scripts/ver.js b/scripts/ver.js deleted file mode 100644 index 1cee50124eae..000000000000 --- a/scripts/ver.js +++ /dev/null @@ -1,5 +0,0 @@ -const shell = require('shelljs'); -const chalk = require('chalk'); -const packageJson = require('../package.json'); - -shell.echo(chalk.bold(`${packageJson.name}@${packageJson.version}`));