From 7efdff487e620016140897e2c8050ac0d594600c Mon Sep 17 00:00:00 2001
From: Andrew Kingston <aptkingston@ssl-mail.com>
Date: Wed, 3 Feb 2021 15:02:50 +0000
Subject: [PATCH] Update text field values on Enter press

---
 .../src/forms/StringField.svelte                | 17 +++++++++++++++--
 1 file changed, 15 insertions(+), 2 deletions(-)

diff --git a/packages/standard-components/src/forms/StringField.svelte b/packages/standard-components/src/forms/StringField.svelte
index 40d33cc976..dbf5ace61c 100644
--- a/packages/standard-components/src/forms/StringField.svelte
+++ b/packages/standard-components/src/forms/StringField.svelte
@@ -1,4 +1,5 @@
 <script>
+  import { onMount } from "svelte"
   import "@spectrum-css/textfield/dist/index-vars.css"
   import SpectrumField from "./SpectrumField.svelte"
 
@@ -9,15 +10,25 @@
 
   let fieldState
   let fieldApi
+  let input
 
-  const onBlur = event => {
-    let value = event.target.value
+  const updateValue = value => {
     if (type === "number") {
       const float = parseFloat(value)
       value = isNaN(float) ? null : float
     }
     fieldApi.setValue(value)
   }
+
+  const onBlur = event => {
+    updateValue(event.target.value)
+  }
+
+  const updateValueOnEnter = event => {
+    if (event.key === "Enter") {
+      updateValue(event.target.value)
+    }
+  }
 </script>
 
 <SpectrumField {label} {field} bind:fieldState bind:fieldApi>
@@ -32,6 +43,8 @@
         </svg>
       {/if}
       <input
+        on:keyup={updateValueOnEnter}
+        bind:this={input}
         id={$fieldState.fieldId}
         value={$fieldState.value || ''}
         placeholder={placeholder || ''}