falcon-form
Form handling and error validation in React hooks.
Install
npm install --save falcon-form
Demo
Codesandbox here
Features
- No Wrapper | No HOC | Just KISS.
- Your design, our logics.
- Specific message for custom conditionals.
- React-native support.
- Tiny bundle with no dependencies.
- native HTML support.
Usage
import React useState from "react";import falconForm isRequired isEmail checkboxHelper from "falcon-form"; var renderCount = 0; const App = let formInitialValues = ; // getInitialValues, use setFormInitialValues to set data from API const formSubmitAction = { console; }; // declare submit success action const fieldValidators = email: isRequired isEmail name: isRequired ; // declare field validators const values errors fieldChange formSubmit = ; // pass initial values, submit actions, field validators // use values, errors and field handlers in form renderCount += 1; return <div> <h4>Render count : renderCount</h4> <form => Name: <br /> <input ="text" ="name" = = /> errorsname <br /> Email: <br /> <input ="email" ="email" = = /> errorsemail <br /> <br /> <input ="checkbox" ="department" ="ece" ="ece" = = /> ECE <input ="checkbox" ="department" ="cse" ="cse" = // ..('ece'), = />" " CSE <input ="submit" ="Submit" /> </form> </div> ;; ;
Create custom validations
import customValidation from "falcon-form"; // create custom validation function// all form values available as second paramconst min3CharRule = valuelength < 3; const stringMin3Char = ; // Pass these validations to fieldValidators
License
MIT © varunthefalcon