react-formal-material-ui

material-ui integration with react-formal

This is a simple wrapper around MUI components integrating them with react-formal.

Forms are specified as usual in the react-formal way, and material-ui fields will be rendered.

How you can help

Please look at the help wanted issues. You can also submit PRs for fixes and additional component integrations.

Usage

1. Install

   npm install --save react-formal-material-ui

2. Import it at your entry point

   // your index.js
   import {addInputTypes} from 'react-formal-material-ui'
   addInputTypes()

This will effectively map field types to the default renderable components.

Customization - creating your own application defaults

You may want different defaults for your application. You can customize by component, or customize the entire mapping of field type to components. react-formal-material-ui exports the functions to allow easy inclusion of HOC component overrides.

The following example will create a higher order pure render TextField for our entire app that uses display:block by default.

import React, {Component} from 'react'
import {TextField, addInputTypes} from 'react-formal-material-ui'
import PureRenderMixin from 'react-addons-pure-render-mixin'

class CustomTextField extends Component {
  constructor (props) {
    super(props)
    this.shouldComponentUpdate = PureRenderMixin.shouldComponentUpdate.bind(this)
  }

  render () {
    return <TextField {...this.props} style={{display: 'block'}} />
  }
}

addInputTypes({ TextField: CustomTextField })

Contributing

Please submit PRs, tests are very much appreciated. ESLint and Flow are setup and will be checked by Travis CI, to run these locally just use npm test to check your code prior to submitting.

License

See MIT LICENSE