React Storybook Info Addon
A React Storybook addon to show additional information for your stories.
Usage
Install the following npm module:
npm i --save @kadira/react-storybook-addon-info
Then set the addon in the place you configure storybook like this:
import React from 'react';
import { configure, setAddon } from '@kadira/storybook';
setAddon(InfoAddon);
configure(function () {
...
}, module);
Then create your stories with the .addWithInfo
API.
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.
`,
() => (
<div>
<Button label="The Button" onClick={action('onClick')}/>
<br />
<p>
Click the "?" mark at top-right to view the info.
</p>
</div>
),
);
Have a look at this example stories to learn more about the addWithInfo
API.