react-wizard-flow

Usage

import{createWizardFlow,useWizardFlow}from'react-wizard-flow';enumTestSteps{step1,step2,}constWizardFlow=createWizardFlow(TestSteps);functionStep1(){const{ transition, close }=useWizardFlow(WizardFlow);return(<div><header>Step1</header><buttononClick={()=>transition(TestSteps.step1)}>ToStep1</button><buttononClick={()=>transition(TestSteps.step2)}>ToStep2</button><buttononClick={close}>Close</button></div>);}functionStep2(){const{ transition, close }=useWizardFlow(WizardFlow);return(<div><header>Step1</header><buttononClick={()=>transition(TestSteps.step1)}>ToStep1</button><buttononClick={()=>transition(TestSteps.step2)}>ToStep2</button><buttononClick={close}>Close</button></div>);}constSTEPS={[TestSteps.step1]: <Step1/>,[TestSteps.step2]: <Step2/>,};exportdefaultfunction(){constonClose=()=>{console.log('Flow closed');}return<WizardFlow.ProviderinitialStep={TestSteps.step1}steps={STEPS}onClose={onClose}/>}

This README was generated by anansi.