Instance Prop Documentation

Hi Jason,

Thank you very much for this fantastic project. I want to control my wizard from outside the StepWizard component, and I’m not quite sure how to achieve it using the instance prop. Is there any advanced example of it, that I could look into?

Thank you very much, Timo

[bundit]

@highdox This is how I got it to work with mine:

function Wizard({ children }) {
    const [wizard, setWizard] = useState<StepWizardProps>()

    return (
        <ReactStepWizard instance={setWizard} className="h-full w-full">
            {children}
        </ReactStepWizard>
    )
}

[abdelav]

@sajjadjm possible workaround is to merge both types and use them

import StepWizard, { StepWizardProps, StepWizardChildProps } from 'react-step-wizard';

type SWProps = StepWizardProps & StepWizardChildProps;

......

 const [ wizard, setWizard ] = useState<SWProps>();

 const setInstance = (sw: StepWizardProps): void => {
    const swProps = sw as SWProps;
    setWizard(swProps);
 };
 
 ....
 
 <Button onClick={wizard?.nextStep}>NEXT<Button>