* chore: 🤖 add Infra sample Storybook story * chore: 🤖 add @kbn/storybook package * chore: 🤖 add sample SIEM stories * chore: 🤖 add Canvas new Storybook config * fix: 🐛 fix TypeScript errors * chore: 🤖 add @kbn/babel-preset to package.json * chore: 🤖 move dependencies to devDependencies * chore: 🤖 make Storybook dependencies non-dev * chore: 🤖 upgrade Storybook dependencies * chore: 🤖 add packages to webpack * fix: 🐛 fix TypeScript type check * chore: 🤖 disable ESLint warnings * chore: 🤖 remove Storybook info plugin * chore: 🤖 upate yarn.lock * chore: 🤖 add Storbook to Embeddables * feat: 🎸 add --clean flag to Storybook CLI * coalesce yarn.lock versions * update kbn/pm dist * This reverts commit97d8ff9f53
and49b07cd007
. * chore: 🤖 use fs instead of mkdirp * chore: 🤖 use debug for message logging * chore: 🤖 update yarn.lock * feat: 🎸 add link to kbn-storybook package * docs: ✏️ add Storybook readme * chore: 🤖 remove packages that failed DLL build * style: 💄 add ESLint comma * chore: 🤖 apply changes from #52209 * fix: 🐛 make Canvas Storybook build again * chore: 🤖 move Canvas stories to global Storybook * chore: 🤖 move more Canvas components to global Storybook * chore: 🤖 move more Canvas stories to global Storybook * chore: 🤖 move <ItemGrid> and <KeyboardShortcutsDoc> to NP SB * chore: 🤖 move shape picker Canvas stories to global Storybook * chore: 🤖 move Canvas sidebar stories to global Storybook * fix: 🐛 split imports to not import path.resolve in Storybook * chore: 🤖 move tag and PDF panel Canvas stories to global SB * chore: 🤖 move Canvas share website flyout stories to global SB * fix: 🐛 clean up <ShareWebsiteFlyout> imports * chore: 🤖 add back Canvas withInfo decorator * chore: 🤖 look for Canvas stories everywhere in /canvas folder * test: 💍 mock correct files in Storyshots * test: 💍 update Canvas Storyshot snapshots * chore: 🤖 move more Canvas components to global Storybook * chore: 🤖 move more Canvas components to global Storybook * test: 💍 update Canvas Storyshots * chore: 🤖 rebuild @kbn/pm * chore: 🤖 refresh @kbn/pm dist/index.js artifact * chore: 🤖 update yarn.lock * chore: 🤖 update @kbn/pm artifact * feat: 🎸 address review comments * fix: 🐛 remove circular import * chore: 🤖 update yarn.lock * test: 💍 disable a test suite * test: 💍 update Canvas storyshots * chore: 🤖 remvoe build step from @kbn/storybook * chore: 🤖 enable disabled functional test suite Co-authored-by: Spencer <email@spalger.com> Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com>
1.1 KiB
1.1 KiB
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>
.