Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add addonlinks repo #1021

Merged
merged 23 commits into from
May 12, 2017
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
23 commits
Select commit Hold shift + click to select a range
4ca4759
Initial Commit
thani-sh Aug 2, 2016
e6a573a
Update README.md
Aug 7, 2016
eecb47b
Merge pull request #1 from kadirahq/update-readme
Aug 7, 2016
4027aa6
Refactor source
thani-sh Aug 9, 2016
2be1920
Update CHANGELOG
thani-sh Aug 9, 2016
b5779a3
1.0.1
thani-sh Aug 9, 2016
722122d
Rename event id
thani-sh Aug 9, 2016
7b113e1
Update README.md
arunoda Aug 30, 2016
f3d07fe
chore(package): update dependencies
greenkeeperio-bot Sep 15, 2016
4fa2061
Merge pull request #3 from kadirahq/greenkeeper-update-all
Sep 15, 2016
213ab17
chore(package): update react to version 15.3.2
greenkeeperio-bot Sep 20, 2016
4fbb9d5
Merge pull request #7 from kadirahq/greenkeeper-react-15.3.2
Sep 26, 2016
9f5469d
chore(package): update react-dom to version 15.3.2
greenkeeperio-bot Sep 26, 2016
806bf5d
chore(package): update @kadira/storybook to version 2.19.0
greenkeeperio-bot Sep 26, 2016
40994a0
Merge pull request #9 from kadirahq/greenkeeper-react-dom-15.3.2
Sep 26, 2016
0a364c9
Merge pull request #12 from kadirahq/greenkeeper-@kadira/storybook-2.…
Sep 26, 2016
f32d83e
chore(package): update @kadira/storybook to version 2.20.0
greenkeeperio-bot Sep 27, 2016
1eea8e1
Merge pull request #13 from kadirahq/greenkeeper-@kadira/storybook-2.…
Sep 28, 2016
a29cc17
chore(package): update @kadira/storybook to version 2.20.1
greenkeeperio-bot Sep 28, 2016
90c96b2
Merge pull request #14 from kadirahq/greenkeeper-@kadira/storybook-2.…
Sep 28, 2016
2ef8a6b
feat: add ability to have function as linkTo parameters (#23)
mthuret Apr 8, 2017
0593f37
ADD addon-links repo
ndelangen May 11, 2017
663b8ca
FIX linting
ndelangen May 11, 2017
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 6 additions & 0 deletions packages/addon-links/.storybook/addons.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
// Uncomment to register defaults
// import '@kadira/storybook/addons';

// Use the line below to register this addon
// import '@kadira/storybook-addon-links/register';
import '../register';
2 changes: 2 additions & 0 deletions packages/addon-links/.storybook/config.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
import * as storybook from '@kadira/storybook';
storybook.configure(() => require('./stories'), module);
24 changes: 24 additions & 0 deletions packages/addon-links/.storybook/stories.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
import React from 'react';
import { storiesOf } from '@kadira/storybook';
import { linkTo } from '../src';

storiesOf('Button', module)
.add('First Story', () => (
<button onClick={linkTo('Button', 'Second Story')}>Go to "Second Story"</button>
))
.add('Second Story', () => (
<button onClick={linkTo('Button', 'First Story')}>Go to "First Story"</button>
))
.add('Multiple Selection', () => (
<MultipleStories onClick={linkTo('Button', (filter) => {
return filter === 'First' ? 'First Story' : 'Second Story';
})}/>
));

const MultipleStories = ({onClick}) => {
return (
<ul>
<button onClick={onClick.bind(null, 'First')}>Go to "First Story"</button>
<button onClick={onClick.bind(null, 'Second')}>Go to "Second Story"</button>
</ul>);
}
10 changes: 10 additions & 0 deletions packages/addon-links/CHANGELOG.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
## Changelog

### v1.0.1

* Refactor source code
* Update the README file

### v1.0.0

* First stable release with all features from the storybook linkTo function
33 changes: 33 additions & 0 deletions packages/addon-links/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,33 @@
# 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, linkTo } from '@kadira/storybook'

storiesOf('Button', module)
.add('First', () => (
<button onClick={linkTo('Button', 'Second')}>Go to "Second"</button>
))
.add('Second', () => (
<button onClick={linkTo('Button', 'First')}>Go to "First"</button>
));
```

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. <br/>
> Have a look at [PR86](https://github.com/kadirahq/react-storybook/pull/86) for more information.
36 changes: 36 additions & 0 deletions packages/addon-links/package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,36 @@
{
"name": "@kadira/storybook-addon-links",
"version": "1.0.1",
"description": "Story Links addon for storybook",
"main": "dist/index.js",
"scripts": {
"deploy-storybook": "storybook-to-ghpages",
"prepublish": "node ../../scripts/prepublish.js",
"storybook": "start-storybook -p 9001"
},
"repository": {
"type": "git",
"url": "git+https://github.com/kadirahq/storybook-addon-links.git"
},
"keywords": [
"storybook"
],
"license": "MIT",
"bugs": {
"url": "https://github.com/kadirahq/storybook-addon-links/issues"
},
"homepage": "https://github.com/kadirahq/storybook-addon-links#readme",
"devDependencies": {
"@kadira/storybook": "^*",
"@kadira/storybook-addons": "*",
"@kadira/storybook-ui": "*",
"react": "^15.5.4",
"react-dom": "^15.5.4",
"shelljs": "^0.7.7"
},
"peerDependencies": {
"@kadira/storybook-addons": "*",
"react": "*",
"react-dom": "*"
}
}
1 change: 1 addition & 0 deletions packages/addon-links/register.js
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
require('./dist').register();
5 changes: 5 additions & 0 deletions packages/addon-links/src/index.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
export const ADDON_ID = 'kadirahq/storybook-addon-links';
export const EVENT_ID = `${ADDON_ID}/link-event`;

export { register } from './manager';
export { linkTo } from './preview';
11 changes: 11 additions & 0 deletions packages/addon-links/src/manager.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
import addons from '@kadira/storybook-addons';
import { ADDON_ID, EVENT_ID } from './';

export function register() {
addons.register(ADDON_ID, api => {
const channel = addons.getChannel();
channel.on(EVENT_ID, selection => {
api.selectStory(selection.kind, selection.story);
});
});
}
12 changes: 12 additions & 0 deletions packages/addon-links/src/preview.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
import addons from '@kadira/storybook-addons';
import { EVENT_ID } from './';

export function linkTo(kind, story) {
return function(...args) {
const resolvedKind = typeof kind === 'function' ? kind(...args) : kind;
const resolvedStory = typeof story === 'function' ? story(...args) : story;

const channel = addons.getChannel();
channel.emit(EVENT_ID, { kind: resolvedKind, story: resolvedStory });
};
}