Skip to content

BondoS/react-multistep-1

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Responsive React multistep form component

Try it here

NPM

React 16.11.x

Instructions

To use this module in your app run:

npm install react-multistep

next, import it inside of your app:

const MultiStep = import from ('react-multistep')

Component has only one Prop, 'showNavigation', which controls if the navigation buttons should be visable:

prop=showNavigation 
type: boolean (default = true)

It takes an array of objects representing individual steps:

const steps = [
              {name: 'StepOne', component: <StepOne/>},
              {name: 'StepTwo', component: <StepTwo/>},
              {name: 'StepThree', component: <StepThree/>},
              {name: 'StepFour', component: <StepFour/>}
            ];
<Multistep showNavigation={true} steps={steps}/>

If you want to try the example, easiest is to clone the repo locally and explore:

git clone https://github.com/srdjan/react-multistep.git   //clone the repo
cd react-multistep                                        //navigate to the project folder

Next, cnavigate to 'src' directory and build the component:

cd src
npm install
npm run build:dev

On succesful build, component is packaged in the './dist' folder. Navigate to the example and build it:

cd ../example
npm install
npm run build:dev

Now you can open the example in your favorite browser:

open index.html

Packages

 
 
 

Languages

  • JavaScript 54.9%
  • CSS 41.7%
  • HTML 3.4%