Why

"No hooking up, super lightweight, and easy to use".

A form validation library with only react and prop-types as its dependency.

Install

To install this package, run:

npm install --save react-chloroform

yarn users can use:

yarn add react-chloroform

You can also use the UMD build:

<script src="path-to-react-chloroform/dist/react-chloroform.min.js"></script>

Or alternatively the es5 commonjs build:

<script src="path-to-react-chloroform/lib/react-chloroform.js"></script>

Examples

Refer to /examples for all example source code.

Quick start

import React from ' react ' ; import { Form , FormInput , Button , ChloroformError } from ' react-chloroform ' ; const YourFormComponent = ( ) => { const handleSubmit = model => console . log ( model ) ; const initialState = { email : ' example@example.com ' , name : ' John Doe ' , } ; const isRequired = val => ( val && val . length > 0 ) || ' This field is required ' ; return ( < Form initialState = { initialState } onSubmit = { handleSubmit } > < div > < label htmlFor = " email_1 " > Email : </ label > < FormInput model = " email " id = " email_1 " validator = { [ isRequired ] } /> < ChloroformError model = " email " component = { ( { error } ) => < p > { error } </ p > } /> </ div > < div > < label htmlFor = " name_1 " > Name : </ label > < FormInput model = " name " id = " name_1 " /> </ div > < div > < Button type = " submit " text = " Submit " /> </ div > </ Form > ) ; } ; export default YourFormComponent ;

Fiddles

API

Check out the api .

Contribution

React-Chloroform is open for contributions by the community. Read the contributing guidelines .

Testing

npm install

Link from the react-chloroform git repo:

npm link

And then link from your test project with:

npm link react-chloroform

Build es with:

npm run build:es:watch

License

MIT