Skip to content

Commit 360fb0b

Browse files
shilmanshilman
authored
Merge pull request #1131 from storybooks/ndelangen/dev
3.0.0 docs by merging docs repo into this repo
2 parents fe66b26 + d0ea916 commit 360fb0b

227 files changed

Lines changed: 5526 additions & 636 deletions

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

‎.eslintignore‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,3 +2,4 @@ dist
22
build
33
coverage
44
node_modules
5+
docs/public

‎.eslintrc.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
module.exports = {
2+
root: true,
23
extends: [
34
'./node_modules/eslint-config-airbnb-base/rules/es6.js',
45
],

‎.gitignore‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,3 +13,4 @@ build
1313
packages/examples/automated-*
1414
yarn.lock
1515
/**/LICENSE
16+
docs/public

‎.remarkrc‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
{
2+
"plugins": [
3+
"remark-preset-lint-recommended",
4+
["remark-lint-list-item-indent", false],
5+
["remark-lint-code", {"js": {
6+
"module": "node_modules/remark-lint-code-eslint",
7+
"options": {
8+
"fix": true
9+
}
10+
}}],
11+
["remark-toc", {
12+
"tight": true,
13+
"maxDepth": 3
14+
}]
15+
]
16+
}

‎.travis.yml‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,8 @@ before_install: ./scripts/travis/before_install.sh
1111
after_success: ./scripts/travis/after_success.sh
1212
script:
1313
- npm run bootstrap
14-
- lerna exec --scope test-cra -- npm i
14+
- npm run bootstrap:test-cra
15+
- npm run bootstrap:docs
1516
- npm run lint
1617
- npm run test -- --coverage
1718
- npm run coverage

‎CONTRIBUTING.md‎

Lines changed: 34 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -8,37 +8,33 @@ Please review this document to help to streamline the process and save everyone'
88

99
No software is bug free. So, if you got an issue, follow these steps:
1010

11-
* Search the [issue list](https://github.com/storybooks/storybook/issues?utf8=%E2%9C%93&q=) for current and old issues.
12-
* If non of that is helping, create an issue with with following information:
13-
* Clear title (make is shorter if possible).
14-
* Describe the issue in clear language.
15-
* Share error logs, screenshots and etc.
16-
* To speed up the issue fixing process, send us a sample repo with the issue you faced:
11+
- Search the [issue list](https://github.com/storybooks/storybook/issues?utf8=%E2%9C%93&q=) for current and old issues.
12+
- If non of that is helping, create an issue with with following information:
13+
- Clear title (make is shorter if possible).
14+
- Describe the issue in clear language.
15+
- Share error logs, screenshots and etc.
16+
- To speed up the issue fixing process, send us a sample repo with the issue you faced:
1717

1818
### Testing against `master`
1919

2020
To test your project against the current latest version of storybook, you can clone the repository and link it with `npm`. Try following these steps:
2121

22-
1. Download the latest version of this project, and build it
22+
1. Download the latest version of this project, and build it
2323

24-
```
25-
git clone https://github.com/storybooks/storybook.git
26-
cd storybook
27-
npm install
28-
npm run bootstrap
29-
```
24+
git clone https://github.com/storybooks/storybook.git
25+
cd storybook
26+
npm install
27+
npm run bootstrap
3028

31-
2. Link `storybook` and any other required dependencies
29+
2. Link `storybook` and any other required dependencies
3230

33-
```
34-
cd packages/react-storybook
35-
npm link
31+
cd packages/react-storybook
32+
npm link
3633

37-
cd <your-project>
38-
npm link @kadira/storybook
34+
cd <your-project>
35+
npm link @kadira/storybook
3936

40-
# repeat with whichever other parts of the monorepo you are using.
41-
```
37+
# repeat with whichever other parts of the monorepo you are using.
4238

4339
### Reproductions
4440

@@ -68,18 +64,18 @@ git remote add <your-username> https://github.com/<your-username>/storybook.git
6864
git push -u <your-username> master
6965
```
7066

71-
If you follow that process, you can then link to the github repository in the issue. See https://github.com/storybooks/storybook/issues/708#issuecomment-290589886 for an example.
67+
If you follow that process, you can then link to the github repository in the issue. See <https://github.com/storybooks/storybook/issues/708#issuecomment-290589886> for an example.
7268

73-
**NOTE**: If your issue involves a webpack config, create-react-app will prevent you from modifying the *app's* webpack config, however you can still modify storybook's to mirror your app's version of storybook. Alternatively, use `npm run eject` in the CRA app to get a modifiable webpack config.
69+
**NOTE**: If your issue involves a webpack config, create-react-app will prevent you from modifying the _app's_ webpack config, however you can still modify storybook's to mirror your app's version of storybook. Alternatively, use `npm run eject` in the CRA app to get a modifiable webpack config.
7470

7571
## Pull Requests (PRs)
7672

7773
We welcome your contributions. There are many ways you can help us. This is few of those ways:
7874

79-
* Fix typos and add more [documentation](https://github.com/storybooks/storybook/labels/needs%20docs).
80-
* Try to fix some [bugs](https://github.com/storybooks/storybook/labels/bug).
81-
* Work on [API](https://github.com/storybooks/storybook/labels/enhancement%3A%20api), [Addons](https://github.com/storybooks/storybook/labels/enhancement%3A%20addons), [UI](https://github.com/storybooks/storybook/labels/enhancement%3A%20ui) or [Webpack](https://github.com/storybooks/storybook/labels/enhancement%3A%20webpack) use enhancements and new [features](https://github.com/storybooks/storybook/labels/feature%20request).
82-
* Add more [tests](https://codecov.io/gh/storybooks/storybook/tree/master/packages) (specially for the [UI](https://codecov.io/gh/storybooks/storybook/tree/master/packages/storybook-ui/src)).
75+
- Fix typos and add more [documentation](https://github.com/storybooks/storybook/labels/needs%20docs).
76+
- Try to fix some [bugs](https://github.com/storybooks/storybook/labels/bug).
77+
- Work on [API](https://github.com/storybooks/storybook/labels/enhancement%3A%20api), [Addons](https://github.com/storybooks/storybook/labels/enhancement%3A%20addons), [UI](https://github.com/storybooks/storybook/labels/enhancement%3A%20ui) or [Webpack](https://github.com/storybooks/storybook/labels/enhancement%3A%20webpack) use enhancements and new [features](https://github.com/storybooks/storybook/labels/feature%20request).
78+
- Add more [tests](https://codecov.io/gh/storybooks/storybook/tree/master/packages) (specially for the [UI](https://codecov.io/gh/storybooks/storybook/tree/master/packages/storybook-ui/src)).
8379

8480
Before you submit a new PR, make you to run `npm test`. Do not submit a PR if tests are failing. If you need any help, create an issue and ask.
8581

@@ -102,9 +98,10 @@ Issues that are tagged `question / support` or `needs reproduction` are great pl
10298
Once you've helped out on a few issues, if you'd like triage access you can help label issues and respond to reporters.
10399

104100
We use the following label scheme to categorize issues:
105-
- **type** - `bug`, `feature`, `question / support`, `discussion`, `greenkeeper`, `maintenance`.
106-
- **area** - `addon: x`, `addons-api`, `stories-api`, `ui`, etc.
107-
- **status** - `needs reproduction`, `needs PR`, `in progress`, etc.
101+
102+
- **type** - `bug`, `feature`, `question / support`, `discussion`, `greenkeeper`, `maintenance`.
103+
- **area** - `addon: x`, `addons-api`, `stories-api`, `ui`, etc.
104+
- **status** - `needs reproduction`, `needs PR`, `in progress`, etc.
108105

109106
All issues should have a `type` label. `bug`/`feature`/`question`/`discussion` are self-explanatory. `greenkeeper` is for keeping package dependencies up to date. `maintenance` is a catch-all for any kind of cleanup or refactoring.
110107

@@ -116,17 +113,17 @@ If an issue is a `bug`, and it doesn't have a clear reproduction that you have p
116113

117114
### Closing issues
118115

119-
- Duplicate issues should be closed with a link to the original.
116+
- Duplicate issues should be closed with a link to the original.
120117

121-
- Unreproducible issues should be closed if it's not possible to reproduce them (if the reporter drops offline, it is reasonable to wait 2 weeks before closing).
118+
- Unreproducible issues should be closed if it's not possible to reproduce them (if the reporter drops offline, it is reasonable to wait 2 weeks before closing).
122119

123-
- `bug`s should be labeled `merged` when merged, and be closed when the issue is fixed and released.
120+
- `bug`s should be labeled `merged` when merged, and be closed when the issue is fixed and released.
124121

125-
- `feature`s, `maintenance`s, `greenkeeper`s should be labeled `merged` when merged, and closed when released or if the feature is deemed not appropriate.
122+
- `feature`s, `maintenance`s, `greenkeeper`s should be labeled `merged` when merged, and closed when released or if the feature is deemed not appropriate.
126123

127-
- `question / support`s should be closed when the question has been answered. If the questioner drops offline, a reasonable period to wait is two weeks.
124+
- `question / support`s should be closed when the question has been answered. If the questioner drops offline, a reasonable period to wait is two weeks.
128125

129-
- `discussion`s should be closed at a maintainer's discretion.
126+
- `discussion`s should be closed at a maintainer's discretion.
130127

131128
## Development Guide
132129

@@ -135,9 +132,7 @@ If an issue is a `bug`, and it doesn't have a clear reproduction that you have p
135132
This project written in ES2016+ syntax so, we need to transpile it before use.
136133
So run the following command:
137134

138-
```
139-
npm run dev
140-
```
135+
npm run dev
141136

142137
This will watch files and transpile.
143138

‎HISTORY.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
## v.Next
22

3-
- Deprecated `{ linkTo, action }` as built-in addons: https://github.com/storybooks/storybook/issues/1017. From 3.0 use them as you would [any other addon](https://storybooks.js.org/docs/react-storybook/addons/using-addons/).
3+
- Deprecated `{ linkTo, action }` as built-in addons: <https://github.com/storybooks/storybook/issues/1017>. From 3.0 use them as you would [any other addon](https://storybooks.js.org/docs/react-storybook/addons/using-addons/).
44

55
Before:
66

‎README.md‎

Lines changed: 60 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,14 @@
11
# Storybook
2+
23
[![Greenkeeper badge](https://badges.greenkeeper.io/storybooks/storybook.svg)](https://greenkeeper.io/)
34
[![Build Status](https://travis-ci.org/storybooks/storybook.svg?branch=master)](https://travis-ci.org/storybooks/storybook)
45
[![CodeFactor](https://www.codefactor.io/repository/github/storybooks/storybook/badge)](https://www.codefactor.io/repository/github/storybooks/storybook)
56
[![Known Vulnerabilities](https://snyk.io/test/github/storybooks/storybook/8f36abfd6697e58cd76df3526b52e4b9dc894847/badge.svg)](https://snyk.io/test/github/storybooks/storybook/8f36abfd6697e58cd76df3526b52e4b9dc894847)
6-
[![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)
7+
[![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)
78
[![Storybook Slack](https://storybooks-slackin.herokuapp.com/badge.svg)](https://storybooks-slackin.herokuapp.com/)
89
[![Backers on Open Collective](https://opencollective.com/storybook/backers/badge.svg)](#backers) [![Sponsors on Open Collective](https://opencollective.com/storybook/sponsors/badge.svg)](#sponsors)
910

10-
---
11+
* * *
1112

1213
Storybook is a development environment for UI components.
1314
It allows you to browse a component library, view the different states of each component, and interactively develop and test components.
@@ -20,10 +21,23 @@ Storybook runs outside of your app. This allows you to develop UI components in
2021

2122
Storybook comes with a lot of [addons](https://storybooks.js.org/docs/react-storybook/addons/introduction) for component design, documentation, testing, interactivity, and so on. Storybook's easy-to-use API makes it easy to configure and extend in various ways. It has even been extended to support React Native development for mobile.
2223

24+
## Table of contents
25+
26+
- [Getting Started](#getting-started)
27+
- [Projects](#projects)
28+
- [Main Projects](#main-projects)
29+
- [Sub Projects](#sub-projects)
30+
- [Addons](#addons)
31+
- [Contributing](#contributing)
32+
- [Development scripts](#development-scripts)
33+
- [Backers](#backers)
34+
- [Sponsors](#sponsors)
35+
2336
## Getting Started
2437

2538
First install storybook:
26-
```js
39+
40+
```sh
2741
npm i -g @storybook/cli
2842
cd my-react-app
2943
getstorybook
@@ -36,32 +50,61 @@ For full documentation on using Storybook visit: [storybooks.js.org](https://sto
3650
## Projects
3751

3852
### Main Projects
39-
- [Storybook for react](app/react) - Storybook for React components
40-
- [Storybook for react-native](app/react-native) - Storybook for React components
53+
54+
- [Storybook for react](app/react) - Storybook for React components
55+
- [Storybook for react-native](app/react-native) - Storybook for React components
4156

4257
### Sub Projects
43-
- [CLI](lib/cli) - Streamlined installation for a variety of app types
44-
- [examples](examples) - Code examples to illustrate different Storybook use cases
58+
59+
- [CLI](lib/cli) - Streamlined installation for a variety of app types
60+
- [examples](examples) - Code examples to illustrate different Storybook use cases
4561

4662
### Addons
47-
- [addon-storyshots](addons/storyshots) - Easy snapshot testing for storybook
48-
- [addon-actions](addons/actions/) - Log actions as users interact with components in storybook
49-
- [addon-comments](addons/comments/) - Comment on storybook stories
50-
- [addon-graphql](addons/graphql/) - Query a GraphQL server within Storybook stories
51-
- [addon-info](addons/info/) - Annotate stories with extra component usage information
52-
- [addon-knobs](addons/knobs/) - Interactively edit component prop data in the Storybook UI
53-
- [addon-notes](addons/notes/) - Annotate storybook stories with notes
54-
- [addon-options](addons/options/) - Customize the storybook UI in code
63+
64+
- [storyshots](addons/storyshots) - Easy snapshot testing for storybook
65+
- [actions](addons/actions/) - Log actions as users interact with components in storybook
66+
- [comments](addons/comments/) - Comment on storybook stories
67+
- [graphql](addons/graphql/) - Query a GraphQL server within Storybook stories
68+
- [info](addons/info/) - Annotate stories with extra component usage information
69+
- [knobs](addons/knobs/) - Interactively edit component prop data in the Storybook UI
70+
- [notes](addons/notes/) - Annotate storybook stories with notes
71+
- [options](addons/options/) - Customize the storybook UI in code
5572

5673
## Contributing
5774

5875
We welcome contributions to Storybook! There are many ways to contribute to
5976
this project. [Get started here](CONTRIBUTING.md)
6077

78+
### Development scripts
79+
80+
#### `npm run bootstrap`
81+
82+
> Installs package dependencies and links packages together - using lerna
83+
84+
#### `npm run publish`
85+
86+
> Push a release to git and npm
87+
> will ask for version in interactive mode - using lerna.
88+
89+
#### `npm run lint`
90+
91+
> boolean check if code conforms to linting rules - uses remark & eslint
92+
93+
- `npm run lint:js` - will check js
94+
- `npm run lint:markdown` - will check markdown + code samples
95+
96+
- `npm run lint:js -- --fix` - will autofix js
97+
- `npm run lint:markdown -- -o` - will autofix markdown
98+
99+
#### `npm run test`
100+
101+
> boolean check if unittests all pass - uses jest
102+
103+
- `npm run test:watch` - will run tests in watchmode
61104

62105
### Backers
63106

64-
Support us with a monthly donation and help us continue our activities. [[Become a backer](https://opencollective.com/storybook#backer)]
107+
Support us with a monthly donation and help us continue our activities. \[[Become a backer](https://opencollective.com/storybook#backer)]
65108

66109
<a href="https://opencollective.com/storybook/backer/0/website" target="_blank"><img src="https://opencollective.com/storybook/backer/0/avatar.svg"></a>
67110
<a href="https://opencollective.com/storybook/backer/1/website" target="_blank"><img src="https://opencollective.com/storybook/backer/1/avatar.svg"></a>
@@ -94,10 +137,9 @@ Support us with a monthly donation and help us continue our activities. [[Become
94137
<a href="https://opencollective.com/storybook/backer/28/website" target="_blank"><img src="https://opencollective.com/storybook/backer/28/avatar.svg"></a>
95138
<a href="https://opencollective.com/storybook/backer/29/website" target="_blank"><img src="https://opencollective.com/storybook/backer/29/avatar.svg"></a>
96139

97-
98140
### Sponsors
99141

100-
Become a sponsor and get your logo on our README on Github with a link to your site. [[Become a sponsor](https://opencollective.com/storybook#sponsor)]
142+
Become a sponsor and get your logo on our README on Github with a link to your site. \[[Become a sponsor](https://opencollective.com/storybook#sponsor)]
101143

102144
<a href="https://opencollective.com/storybook/sponsor/0/website" target="_blank"><img src="https://opencollective.com/storybook/sponsor/0/avatar.svg"></a>
103145
<a href="https://opencollective.com/storybook/sponsor/1/website" target="_blank"><img src="https://opencollective.com/storybook/sponsor/1/avatar.svg"></a>
@@ -129,4 +171,3 @@ Become a sponsor and get your logo on our README on Github with a link to your s
129171
<a href="https://opencollective.com/storybook/sponsor/27/website" target="_blank"><img src="https://opencollective.com/storybook/sponsor/27/avatar.svg"></a>
130172
<a href="https://opencollective.com/storybook/sponsor/28/website" target="_blank"><img src="https://opencollective.com/storybook/sponsor/28/avatar.svg"></a>
131173
<a href="https://opencollective.com/storybook/sponsor/29/website" target="_blank"><img src="https://opencollective.com/storybook/sponsor/29/avatar.svg"></a>
132-

‎addons/actions/CHANGELOG.md‎

Lines changed: 13 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,39 +1,43 @@
11
## Changelog
22

33
### v1.1.3
4+
45
22 Mar 2017
56

6-
* Fix issue caused by `v1.1.2` where storybook crashes when actions are used without names [PR30](https://github.com/storybooks/storybook-addon-actions/pull/30).
7+
- Fix issue caused by `v1.1.2` where storybook crashes when actions are used without names [PR30](https://github.com/storybooks/storybook-addon-actions/pull/30).
78

89
### v1.1.2
10+
911
21 Mar 2017
1012

11-
* Document `decorateAction` function (action decorator). [PR28](https://github.com/storybooks/storybook-addon-actions/pull/28)
13+
- Document `decorateAction` function (action decorator). [PR28](https://github.com/storybooks/storybook-addon-actions/pull/28)
1214

13-
* Set correct Function.name for action handlers [PR24](https://github.com/storybooks/storybook-addon-actions/pull/24)
15+
- Set correct Function.name for action handlers [PR24](https://github.com/storybooks/storybook-addon-actions/pull/24)
1416

1517
### v1.1.1
18+
1619
11 Sep 2016
1720

18-
* Support arguments with circular references [PR6](https://github.com/kadirahq/storybook-addon-actions/pull/6)
21+
- Support arguments with circular references [PR6](https://github.com/kadirahq/storybook-addon-actions/pull/6)
1922

2023
### v1.1.0
24+
2125
11 Sep 2016
2226

23-
* Support action decorators [PR3](https://github.com/kadirahq/storybook-addon-actions/pull/3)
27+
- Support action decorators [PR3](https://github.com/kadirahq/storybook-addon-actions/pull/3)
2428

2529
### v1.0.4
2630

27-
* Refactor source code (use separate files)
31+
- Refactor source code (use separate files)
2832

2933
### v1.0.3
3034

31-
* Log all arguments (only the first argument was logged previously)
35+
- Log all arguments (only the first argument was logged previously)
3236

3337
### v1.0.2
3438

35-
* Style tweak: center counter and inspector elements
39+
- Style tweak: center counter and inspector elements
3640

3741
### v1.0.1
3842

39-
* First stable release with all features from the storybook action logger such as `action` function, react inspector and grouping log messages.
43+
- First stable release with all features from the storybook action logger such as `action` function, react inspector and grouping log messages.

‎addons/actions/README.md‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
# Storybook Addon Actions
2+
23
[![Greenkeeper badge](https://badges.greenkeeper.io/storybooks/storybook.svg)](https://greenkeeper.io/)
34
[![Build Status](https://travis-ci.org/storybooks/storybook.svg?branch=master)](https://travis-ci.org/storybooks/storybook)
45
[![CodeFactor](https://www.codefactor.io/repository/github/storybooks/storybook/badge)](https://www.codefactor.io/repository/github/storybooks/storybook)
@@ -20,7 +21,7 @@ You can use this addon without installing it manually.
2021

2122
Import the `action` function and use it to create actions handlers. When creating action handlers, provide a **name** to make it easier to identify.
2223

23-
> *Note: Make sure NOT to use reserved words as function names. [issues#29](https://github.com/storybooks/storybook-addon-actions/issues/29#issuecomment-288274794)*
24+
> _Note: Make sure NOT to use reserved words as function names. [issues#29](https://github.com/storybooks/storybook-addon-actions/issues/29#issuecomment-288274794)_
2425
2526
```js
2627
import { storiesOf } from '@storybook/react'

0 commit comments

Comments
 (0)