@bluebase/storybook-addon

A Storybook JS addon to test BlueBase components in Storybook

Usage no npm install needed!

<script type="module">
  import bluebaseStorybookAddon from 'https://cdn.skypack.dev/@bluebase/storybook-addon';
</script>

README

BlueBase Storybook Addon

Getting started

Installation:

npm i --save-dev @bluebase/storybook-addon

Configuration

import React from 'react';
import { configure, addDecorator } from '@storybook/react';
import { BlueBaseDecorator } from '@bluebase/storybook-addon';

const BRConfigs = require('../bluerain');
addDecorator(BlueBaseDecorator(BRConfigs));

const req = require.context('../src', true, /.stories.tsx$/);
function loadStories() {
    req.keys().forEach((filename) => req(filename));
}
configure(loadStories, module);

Usage

In your story, test a BlueBase component like this:

import { BlueBase, BlueBaseConsumer } from '@blueeast/bluerain-os';
import React from 'react';
import storiesOf from '@bluebase/storybook-addon';


storiesOf('Some Story', module)
    .add('story', () => (
        <BlueBaseConsumer>
            {(BB: BlueBase) => <BB.Components.SomeComponent title="A nice component" />}
        </BlueBaseConsumer>
    ));