node package manager

react-form-helper

react-form-helper

Build Status npm version License

React component for building forms with ease.

Install

yarn add react-form-helper
npm install --save react-form-helper

Usage

react-form-helper accept custom components for form, input and button, which makes it easy to use with libraries such as react-toolbox and react-mdl.

Example below shows a simple usage using react-toolbox:

import {FormHelper} from 'react-form-helper'
import Button from 'react-toolbox/lib/button'
import Checkbox from 'react-toolbox/lib/checkbox'
import Input from 'react-toolbox/lib/input'
 
const SignIn = () =>
  <FormHelper
    saveButton='Login'
    inputComponent={Input}
    buttonComponent={Button}
    onSave={credentials => signIn(dispatch, credentials)}
    object={{}}
    fields={[
      {path: ['email'], icon: 'email', label: 'Email', type: 'email'},
      {path: ['password'], icon: 'lock', label: 'Password', type: 'password'},
      {path: ['rememberMe'], component: ({value, onChange}) => (
        <Checkbox
          label='Remember me'
          checked={!!value}
          onChange={onChange}
        />
      )},
    ]}
  />
)

Docs

Exampels can be found here. API docs can be found as doc comments in the code.

License

react-form-helper is dual-licensed under Apache 2.0 and MIT terms.