.. | ||
lib | ||
storybook_config | ||
index.js | ||
package.json | ||
README.md | ||
yarn.lock |
Kibana Storybook
This package provides ability to add Storybook to any Kibana plugin.
Setup Instructions
-
Add
storybook.js
launcher file to your plugin. For example, create a file atsrc/plugins/<plugin>/scripts/storybook.js
, with the following contents:import { join } from 'path'; // eslint-disable-next-line require('@kbn/storybook').runStorybookCli({ name: '<plugin>', storyGlobs: [join(__dirname, '..', 'public', 'components', '**', '*.examples.tsx')], });
-
Add your plugin alias to
src/dev/storybook/aliases.ts
config. -
Create sample Storybook stories. For example, in your plugin create create a file at
src/plugins/<plugin>/public/components/hello_world/__examples__/hello_world.examples.tsx
with the following contents:import * as React from 'react'; import { storiesOf } from '@storybook/react'; storiesOf('Hello world', module).add('default', () => <div>Hello world!</div>);
-
Launch Storybook with
yarn storybook <plugin>
.