how to pass additional props to steps

[olasunkanmi1]

Is there a way to pass additional props to each steps aside the initial props i.e. previousStep, nextStep e.t.c

[MauroG91]

I hope this helps you.
This is how I implemented where I am working.

const components: any = [ { name: "component-1", component: Component1 }, { name: "component-2", component: Component2 }, { name: "component-3", component: Component3 }, ];

const steps = components.map((component: object, index: number) => { return { ...component, props: { something: ":D" }, }; });

const handleRender = () => { const arrOfComponents = steps.map((step) => createElement(step.component, step?.props) ); const arrOfChildren = Children.toArray(arrOfComponents); return Children.map(arrOfChildren, (child, index) => cloneElement(child as any) ); };

<StepWizard> {handleRender()} </StepWizard>