react-component-permutations

WIP

Uses propTypes to create an array of React component props to display various permutations.

npm i react-component-permutations

Usage

import fs from 'fs'
import getPermutations from 'react-component-permutations'
 
const src = fs.readFileSync('./components/Button.js', 'utf8')
const options = {}
const permutations = getPermutations(src, options)

Options

• strings - Array - strings to render for PropType.string
• numbers - Array - numbers to render for PropType.number
• arrays - Array - arrays to render for PropType.array
• objects - Array - objects to render for PropType.object
• nodes - Array - nodes to render for PropTypes.node
• [key] - Array - any prop name to add to the returned objects array

Demo

Given a button component with these propTypes:

Button.propTypes = {
  big: React.PropTypes.bool,
  color: React.PropTypes.oneOf(colorKeys),
  pill: React.PropTypes.bool,
  outline: React.PropTypes.bool
}

The rendered result would look something like this:

http://jxnblk.com/react-component-permutations/demo

See the /demo folder.

MIT License