How to use the storybook-readme.doc function in storybook-readme

import React from 'react';
import { storiesOf } from '@storybook/react';
import { action } from '@storybook/addon-actions';
import { linkTo } from '@storybook/addon-links';
import { Button, Welcome } from '@storybook/react/demo';
import { doc } from 'storybook-readme';

import Flexbox from './Layout/Flexbox';
import UserPage from './UserPage';
import Readme from '../README.md';

storiesOf('Documentation', module)
  .add('Readme', doc(Readme))
  .add('Welcome to Storybook', () => );

storiesOf('Button', module)
  .add('with text', () => (
    <button>
      {'Hello Button'}
    </button>
  ))
  .add('with some emoji', () =&gt; (
    <button>
      <span aria-label="emojis" role="img">
        😀 😎 👍 💯
      </span>
    </button>
  ));

0.1





        
      
    
  ))
  .add('Installation', doc(installing))
  .add('Theming', doc(theme));

render() {
      return MyButton rendered with JSX;
    },
  }))
);

storiesOf('As JSX/As Decorator', module)
  .addDecorator(withDocs(ButtonReadme))
  .add('Button', () => ({
    components: { MyButton },
    render() {
      return MyButton rendered with JSX;
    },
  }));

storiesOf('Doc', module).add('Common', doc(ButtonReadme));

import { storiesOf } from '@storybook/react';
import { doc } from 'storybook-readme';
import Forms from './FORMS.md';
import Inputs from './INPUTS.md';
import Fields from './FIELDS.md';

storiesOf('Philosophy|Guide', module)
  .addParameters({ options: { showAddonPanel: false } })
  .add('Forms', doc(Forms))
  .add('Inputs', doc(Inputs))
  .add('Fields', doc(Fields));

import { storiesOf } from '@storybook/react';
import { doc } from 'storybook-readme';
import Forms from './FORMS.md';
import Inputs from './INPUTS.md';
import Fields from './FIELDS.md';

storiesOf('Philosophy|Guide', module)
  .addParameters({ options: { showAddonPanel: false } })
  .add('Forms', doc(Forms))
  .add('Inputs', doc(Inputs))
  .add('Fields', doc(Fields));

import { storiesOf } from '@storybook/react';
import principlesReadme from './README.md';
import { doc }  from 'storybook-readme';

const stories = storiesOf('Documentation', module);

stories
  .add('Principles', doc(principlesReadme));

import React from 'react';
import readme from './README.md';
import { doc } from 'storybook-readme';

export default doc(readme);

import { storiesOf } from '@storybook/react';
import { doc } from 'storybook-readme';
import Forms from './FORMS.md';
import Inputs from './INPUTS.md';
import Fields from './FIELDS.md';

storiesOf('Philosophy|Guide', module)
  .addParameters({ options: { showAddonPanel: false } })
  .add('Forms', doc(Forms))
  .add('Inputs', doc(Inputs))
  .add('Fields', doc(Fields));

0.1





        
      
    
  ))
  .add('Installation', doc(installing))
  .add('Theming', doc(theme));

import Button from '../components/Button';

import ButtonReadme from '../components/Button/README.md';
import ButtonUsage from '../components/Button/USAGE.md';

storiesOf('Old Api', module).add(
  'withDocs hoc',
  withDocs(ButtonReadme, () =&gt; <button label="{'Hello">)
);

storiesOf('Old Api', module)
  .addDecorator(withDocs(ButtonReadme))
  .add('withDocs decorator', () =&gt; </button><button label="{'Hello">);

storiesOf('Old Api', module).add('doc', doc(ButtonReadme));

storiesOf('Old Api', module).add(
  'withReadme hoc',
  withReadme(ButtonReadme, () =&gt; </button><button label="{'Hello">)
);

storiesOf('Old Api', module)
  .addDecorator(withReadme(ButtonReadme))
  .add('withReadme decorator', () =&gt; </button><button label="{'Hello">);
</button>