From 9f30599ec1c338371557222496eccf36650eb5e8 Mon Sep 17 00:00:00 2001
From: Andrew Kingston <aptkingston@ssl-mail.com>
Date: Thu, 18 Nov 2021 14:42:49 +0000
Subject: [PATCH] Make form step number dynamic

---
 packages/client/src/components/app/forms/Field.svelte    | 3 ++-
 packages/client/src/components/app/forms/FormStep.svelte | 5 ++++-
 2 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/packages/client/src/components/app/forms/Field.svelte b/packages/client/src/components/app/forms/Field.svelte
index 2832a38bb7..3ef184c4a9 100644
--- a/packages/client/src/components/app/forms/Field.svelte
+++ b/packages/client/src/components/app/forms/Field.svelte
@@ -23,13 +23,14 @@
   // Register field with form
   const formApi = formContext?.formApi
   const labelPos = fieldGroupContext?.labelPosition || "above"
+  $: formStep = formStepContext ? $formStepContext || 1 : 1
   $: formField = formApi?.registerField(
     field,
     type,
     defaultValue,
     disabled,
     validation,
-    formStepContext || 1
+    formStep
   )
 
   // Focus label when editing
diff --git a/packages/client/src/components/app/forms/FormStep.svelte b/packages/client/src/components/app/forms/FormStep.svelte
index 665205f7d4..58300287a8 100644
--- a/packages/client/src/components/app/forms/FormStep.svelte
+++ b/packages/client/src/components/app/forms/FormStep.svelte
@@ -1,5 +1,6 @@
 <script>
   import { getContext, setContext } from "svelte"
+  import { writable } from "svelte/store"
   import Placeholder from "../Placeholder.svelte"
 
   export let step = 1
@@ -9,7 +10,9 @@
   const formContext = getContext("form")
 
   // Set form step context so fields know what step they are within
-  setContext("form-step", step || 1)
+  const stepStore = writable(step || 1)
+  $: stepStore.set(step || 1)
+  setContext("form-step", stepStore)
 
   $: formState = formContext?.formState
   $: currentStep = $formState?.currentStep