react component used to demonstrate react component

  • in top section is demo instance to play
  • circle button in right are toggle for component propTypes and demo source code
  • propTypes table show all prop's info for this component
  • in bottom is source code for this demo
  • red prop name means it's required
PropTypes
nametypedescriptiondefaultValue
children
any

component instance

-
code
string

demo source code

  • if it's void will not display
-
doc
string

explanation to this demo

  • support markdown
  • if it's void will not display
-
docgen
arrayOf

component's info load from react-docgen

  • support markdown
  • if it's void will not display prop types table
[]
codeVisible
bool

whether show source code

false
propTypeVisible
bool

whether show propTypes

true
methodsVisible
bool

whether show methods

false
className
string

append className to Redemo

-
mdClassName
string

className pass to markdown

-
style
object

set style for Redemo

-

import ReDemo from 'redemo';

<ReDemo
  className="my-demo"
  propTypes={propTypes}
  doc={doc}
  code={code}
>
  <Button>Hello World</Button>
</ReDemo>