react-sand

0.1.2 • Public • Published

NPM

Demo your components abilities. A simple component that wraps your components and gives component inputs to adjust their props.

❗️ Demo at gridiron.js.org (each component is wrapped with to allow playing with it)

Build Status codecov

NPM


Usage

import React, { Component, PropTypes } from 'react'
import sand from 'react-sand'
 
const Sand = sand({ React })
 
class FancyComponent extends Component {
  static propTypes = (
    { stringProp: PropTypes.string
    , numberProp: PropTypes.number
    , comboProp: PropTypes.oneOf([ 'foo', 'bar' ])
    }
  );
  render() {
    // RENDER SOMETHING
  }
}
 
export default props => (
  <Sand Box={FancyComponent}>
    <span>Some children</span>
  </Sand>
)

Output

In the example above you will see the FancyComponent rendered within a sandbox containing controls to alter its props in the browser.

Note: Under active development. This is not done yet. Pull requests welcome!

Readme

Keywords

none

Package Sidebar

Install

npm i react-sand

Weekly Downloads

2

Version

0.1.2

License

none

Last publish

Collaborators

  • cchamberlain