storybook-react-live-decorator/.storybook/stories/Button.stories.js

react-live decorator for Storybook 6+ | renders story as react-live with given code

import { Button } from './Button';
import { ReactLiveDecorator } from '../../index';

export default {
  title: 'Example/Button',
  component: Button,
};

const codePrimary = `() => (
  <Button primary={true} size="large" label="Primary" />
)`;

export const Primary = {
  decorators: [ReactLiveDecorator({ code: codePrimary, scope: { Button } })]
};

const codeSecondary = `() => (
  <Button primary={false} size="large" label="Secondary" />
)`;

export const Secondary = {
  decorators: [ReactLiveDecorator({ code: codeSecondary, scope: { Button } })]
};