Merge pull request #22 from mjangir/curr-step-in-component

feat(current-step): passed current step index as prop in wizard compo…
mjangir · Mar 28, 2022 · ece0aef · ece0aef
2 parents c4190b3 + aed5c6f
commit ece0aef
Show file tree

Hide file tree

Showing 4 changed files with 17 additions and 3 deletions.
diff --git a/.changeset/silent-rats-own.md b/.changeset/silent-rats-own.md
@@ -0,0 +1,5 @@
+---
+'formik-wizard-form': minor
+---
+
+Passed current step index to wizard components as prop
diff --git a/src/FormkWizard.tsx b/src/FormkWizard.tsx
@@ -36,7 +36,12 @@ const FormikWizard = ({
               currentStepIndex,
               isPrevDisabled,
               isNextDisabled: (validateOnNext && !formikBag.isValid) || false,
-              renderComponent: () => <StepComponent {...formikBag} />,
+              renderComponent: () => (
+                <StepComponent
+                  {...formikBag}
+                  currentStepIndex={currentStepIndex}
+                />
+              ),
             };
 
             return children({

diff --git a/src/types.tsx b/src/types.tsx
@@ -19,7 +19,9 @@ export type Step = {
   ) => Promise<any>;
 
   /** React functional or class component */
-  component: React.ComponentType<FormikProps<FormikValues>>;
+  component: React.ComponentType<
+    FormikProps<FormikValues> & { currentStepIndex: number }
+  >;
 };
 
 export interface RenderProps extends FormikProps<FormikValues> {

diff --git a/src/useFormikWizard.tsx b/src/useFormikWizard.tsx
@@ -34,7 +34,9 @@ const useFormikWizard = ({
     currentStepIndex,
     isPrevDisabled,
     isNextDisabled: (validateOnNext && !formik.isValid) || false,
-    renderComponent: () => <StepComponent {...formik} />,
+    renderComponent: () => (
+      <StepComponent {...formik} currentStepIndex={currentStepIndex} />
+    ),
   };
 };