Storybook doesn't see propTypes and defaultProps

Viewed 523

I have a file with several components responsible for making a tab component with corresponding text. My components are TabScan, TabMessage, TabCode, Tabs, Wrapper. The first three receive different props. The Tabs component conditionally renders them. I specify propTypes and defaultProps for them at the bottom of my file.

TabScan.propTypes = {
  qrCode: PropTypes.string,
  downloadLink: PropTypes.string
}

TabScan.defaultProps = {
  qrCode: '/images/SAMPLE.png',
  downloadLink: '#'
}

TabMessage.propTypes = {
  iconTop: PropTypes.string,
  iconLeft: PropTypes.string,
  iconMiddle: PropTypes.string,
  iconRight: PropTypes.string
}

TabMessage.defaultProps = {
  iconTop: 'fa fa-envelope-o',
  iconLeft: 'fab fa-twitter',
  iconMiddle: 'fab fa-facebook-f',
  iconRight: 'fab fa-google'
}

TabCode.propTypes = {
  invitationCode: PropTypes.string
}

TabCode.defaultProps = {
  invitationCode: '123456789'
}

Then I export the wrapper component export const Wrapper= () => <Tabs items={tabTitles} />

I add my Wrapper component to tab.stories.js file,

import React from 'react'
import Wrapper from '../client/components/mobile/tab'
export default { title: 'Tab Switcher' }
export const wrapper = () => <Wrapper />

but it doesn't render any data coming through props and says that props are not defined; however, everything works fine on the localhost. What can be done?

0 Answers
Related