Package version upgraded to 2.0.0

1) Package version has updated
2) Npm version batch updated in Readme file
3) Supported and unsupported form fields are listed down in readme file.
4) Also installation steps has added.

Signed-off-by: gokulakannant <gokulakannanthangaraji@gmail.com>

Author: gokulakannant

README.md

@@ -1,9 +1,10 @@
 # React Input Form Validation
 
+[![npm package](https://img.shields.io/npm/v/react-form-input-validation)](https://www.npmjs.com/package/react-form-input-validation)
 [![Build Status](https://api.travis-ci.org/gokulakannant/react-form-input-validation.png?branch=master)](https://travis-ci.org/gokulakannant/react-form-input-validation)
 [![GitHub license](https://img.shields.io/github/license/gokulakannant/react-form-input-validation.svg)](https://github.com/gokulakannant/react-form-input-validation/blob/master/LICENSE.md)
 
-A customized [validatorjs](https://www.npmjs.com/package/validatorjs) library to validate the react forms.
+A customized [validatorjs](https://www.npmjs.com/package/validatorjs) library to validate the react forms. It uses the [Controlled Components](https://reactjs.org/docs/forms.html#controlled-components) approach for validation.
 
 * [Supported Rules](https://www.npmjs.com/package/validatorjs#available-rules) (It is supports all validatorjs rules)
 * [Documentation](https://gokulakannant.github.io/react-form-input-validation/v2.0.0/index.html)
@@ -17,6 +18,22 @@ A customized [validatorjs](https://www.npmjs.com/package/validatorjs) library to
 * Readable and declarative validation rules which is inspired by laravel framework.
 * Error messages with multilingual support.
 
+## Installation
+
+To install the stable version:
+
+Using [npm](https://www.npmjs.com/) as your package manager.
+
+```bash
+  npm install --save react-form-input-validation
+```
+
+Using [yarn](https://yarnpkg.com/en/) as your package manager.
+
+```bash
+  yarn add react-form-input-validation
+```
+
 ## Usage
 
 A example form has given below. View all available apis in [documentation](https://gokulakannant.github.io/react-form-input-validation/v2.0.0/index.html).
@@ -117,14 +134,40 @@ Refer the below example to override the attribute name,
         onBlur={this.form.handleBlurEvent}
         onChange={this.form.handleChangeEvent}
         value={this.state.fields.name}
-        data-attribute-name="USER NAME"
+        data-attribute-name="Username"
     />
 ```
 
-The output will be like, "The USER NAME field is required.".
+The output will be like, "The Username field is required.".
 
 ## Supported form fields
 
+|Form Fields and Attributes|Support By Library|
+| :-- |:--:|
+|text|☑|
+|password|☑|
+|email|☑|
+|url|☑|
+|number|☑|
+|checkbox|☑|
+|radio|☑|
+|search|☑|
+|tel|☑|
+|date|☑|
+|month|☑|
+|week|☑|
+|time|☑|
+|datetime-local|☑|
+|textarea|☑|
+|select|☑|
+|color|☑|
+|Combo Box Fields|☑|
+|file|☒|
+|range|☒|
+|image|☒|
+
+The input types button, submit, reset, hidden are exceptional from the above list.
+
 ## Versions
 
 Latest Version: 2.0.0. For more versions refer [VERSIONS.md](VERSIONS.md).

example/src/Form.js

@@ -32,20 +32,8 @@ class ValidationForm extends React.Component {
       extras: "required|array"
     });
 
-    this.form.addEventListener("formsubmit", (fields) => {
-      console.log("1st reactsubmit", fields);
-    });
-
-    this.form.addEventListener("formsubmit", (fields) => {
-      console.log("2nd reactsubmit", fields);
-    });
-
-    this.form.onformsubmit = (fields) => {
-      console.log("1st onformsubmit", fields);
-    }
-
     this.form.onformsubmit = (fields) => {
-      console.log("2nd onformsubmit", fields);
+      console.log(fields);
     }
 
     ReactFormValidation.registerAsync('username_available', function(username, attribute, req, passes) {
@@ -82,7 +70,7 @@ class ValidationForm extends React.Component {
                   onChange={this.form.handleChangeEvent}
                   value={this.state.fields.customer_name}
                   // To override the attribute name
-                  data-attribute-name="CUSTOMER NAME"
+                  data-attribute-name="Customer Name"
                   data-async
                 />
               </label>
@@ -221,11 +209,12 @@ class ValidationForm extends React.Component {
 
             <p>
               <label>
-                Pickup Date/Time
+                Pickup Date
                 <input
                   type="date"
                   name="pickup_time"
                   onChange={this.form.handleChangeEvent}
+                  onBlur={this.form.handleBlurEvent}
                   value={this.state.fields.pickup_time}
                 />
               </label>
@@ -244,6 +233,7 @@ class ValidationForm extends React.Component {
                   name="pickup_place"
                   value={this.state.fields.pickup_place}
                   onChange={this.form.handleChangeEvent}
+                  onBlur={this.form.handleBlurEvent}
                 >
                   <option value="">Select One</option>
                   <option value="office">Taxi Office</option>
@@ -266,6 +256,7 @@ class ValidationForm extends React.Component {
                   name="dropoff_place"
                   value={this.state.fields.dropoff_place}
                   onChange={this.form.handleChangeEvent}
+                  onBlur={this.form.handleBlurEvent}
                   list="destinations"
                 />
               </label>

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "react-form-input-validation",
-  "version": "1.0.1",
+  "version": "2.0.0",
   "description": "A validator package to validate the react forms",
   "main": "./dist/bundle.js",
   "license": "GPLv3",