All Projects → mjangir → formik-wizard-form

mjangir / formik-wizard-form

Licence: MIT license
Build multi step forms using Formik with ease.

Programming Languages

typescript
32286 projects
javascript
184084 projects - #8 most used programming language
CSS
56736 projects
shell
77523 projects

Projects that are alternatives of or similar to formik-wizard-form

laravel-wizard
A web Setup Wizard for Laravel application.
Stars: ✭ 112 (+75%)
Mutual labels:  wizard-steps
jquery-steps
✅ Lightweight jQuery step wizard plugin.
Stars: ✭ 93 (+45.31%)
Mutual labels:  wizard-steps
ngx-copilot
🏆 The most expected has arrived, a package for Angular that facilitates us to improve the experience of our users when guiding them in our interface
Stars: ✭ 61 (-4.69%)
Mutual labels:  wizard-steps
TabInOut
Framework for information extraction from tables
Stars: ✭ 37 (-42.19%)
Mutual labels:  wizard-steps

Formik Wizard Form

npm type definitions npm compressed size build e2e tests GitHub

Getting Started

Formik wizard form is a library which lets you build multistep form wizards in React with ease. It has been written over the famous form library formik and provides the enhanced versions of formik's <Formik /> and useFormik hook. Formik wizard form requires few additional props along with <Formik /> original props as well as adds some properties to the render props object.

Apart from that, the library is style or css framework agnostic and leaves the rendering part completely up to you. It just provides render props and you build your UI out of them.

For more information on usage, please refer to the How To Use and Examples section.

How To Install

Install the package from npm or yarn registry.

Install From Yarn

yarn add formik-wizard-form

Install From NPM

npm install formik-wizard-form --save

How To Use?

Formik wizard form exports two components <FormWizard /> and useFormikWizard similar to Formik's <Formik /> and useFormik hook and their original props have been left untouched. Rather they require you to provide few additional props to create a form wizard.

import { FormikWizard, useFormikWizard } from 'formik-wizard-form';

Visit formikwizard.manishjangir.com for docs and examples!

Based On

Formik

Maintainers

Manish Jangir

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].