From 918f269e6ea37267c46a49335afb13ac1429a6b3 Mon Sep 17 00:00:00 2001
From: Andrew Kingston <aptkingston@ssl-mail.com>
Date: Mon, 23 Aug 2021 15:13:41 +0100
Subject: [PATCH] Fix issue with svelte reactive statements not being
 sufficiently 'reactive' in core form field in client lib by replacing with
 manual store subscription

---
 packages/standard-components/src/forms/Field.svelte | 13 ++++++++-----
 1 file changed, 8 insertions(+), 5 deletions(-)

diff --git a/packages/standard-components/src/forms/Field.svelte b/packages/standard-components/src/forms/Field.svelte
index b202bc506c..9f08f204c2 100644
--- a/packages/standard-components/src/forms/Field.svelte
+++ b/packages/standard-components/src/forms/Field.svelte
@@ -1,7 +1,7 @@
 <script>
   import Placeholder from "../Placeholder.svelte"
   import FieldGroupFallback from "./FieldGroupFallback.svelte"
-  import { getContext } from "svelte"
+  import { getContext, onDestroy } from "svelte"
 
   export let label
   export let field
@@ -31,10 +31,13 @@
     formStepContext || 1
   )
 
-  // Expose field properties to parent component
-  $: fieldState = $formField?.fieldState
-  $: fieldApi = $formField?.fieldApi
-  $: fieldSchema = $formField?.fieldSchema
+  // Update form properties in parent component on every store change
+  const unsubscribe = formField.subscribe(value => {
+    fieldState = value?.fieldState
+    fieldApi = value?.fieldApi
+    fieldSchema = value?.fieldSchema
+  })
+  onDestroy(unsubscribe)
 
   // Keep validation rules up to date
   $: updateValidation(validation)