How to use the @storybook/react/.storiesOf function in @storybook/react

import React from 'react'
import { storiesOf } from '@storybook/react/'
import CustomHTMLBlockStyle from './CustomHTMLBlockStyle'
import CustomHTMLBlock from './CustomHTMLBlock'

storiesOf('Atoms/CustomHTMLBlock', module)
  .addDecorator(storyFn => (
    <div style="{{">{storyFn()}</div>
  ))
  .add('default', () =&gt; (
    
      <h1>Hello</h1>
      <p>I am a paragraph</p>
    
  ))
  .add('with dangerouslySetInnerHTML', () =&gt; (
    Hello
        <p>I am a paragraph</p>
        `,

action(`text changed: ${searchText}`)
        }}
        onSubmit={() => {
          action(`button clicked: ${searchText}`)
        }}
        value={searchText}
      />
      <p>
        <span>Searching for:</span>
        {searchText}
      </p>
    
  )
}

storiesOf('Composed/SearchBar', module)
  .addDecorator(storyFn =&gt; (
    <div style="{{">{storyFn()}</div>
  ))
  .add('default', () =&gt; (
     {
        action('input changed')
      }}
      onSubmit={() =&gt; {
        action('input submitted')
      }}
    /&gt;
  ))
  .add('default controlled', () =&gt; )
  .add('menu version', () =&gt; (

import React from 'react'
import { storiesOf } from '@storybook/react/'
import LinkList from './LinkList'
import LinkListItem from './LinkListItem'

storiesOf('Atoms/LinkList', module)
  .addDecorator(storyFn => (
    <div style="{{">{storyFn()}</div>
  ))
  .add('default', () =&gt; (
    
      I am a ListLink!
      Another one
      
        A loooooong, very, very, very long link
      
      
        A file!
      
    
  ))

import React from 'react'
import { storiesOf } from '@storybook/react/'
import { action } from '@storybook/addon-actions'
import {
  Container,
  Column,
  CustomHTMLBlock,
  Row,
  EditorialHeader,
} from '../../../index'
import DocumentCover from '../../DocumentCover'
import publicationJSON from './publication_feed.json'
import { EditorialMetaList, EditorialContent } from '../index'
import Paragraph from '../../Paragraph'

storiesOf('Composed/Editorial/Publication', module)
  .addDecorator(storyFn => (
    <div style="{{">{storyFn()}</div>
  ))
  .add('implementation for dataportal', () =&gt; {
    const {
      title,
      body,
      field_publication_intro: intro,
      field_file_size: fileSize,
      field_file_type: fileType,
      filecover_url: coverUrl,
      file_url: downloadUrl,
    } = publicationJSON

    return (