From bc0bb031a0c948add43696141666a550a62fbfa9 Mon Sep 17 00:00:00 2001
From: William Wagner <44823142+williamw2@users.noreply.github.com>
Date: Mon, 30 Nov 2020 10:06:04 -0800
Subject: [PATCH] Add enter key handler to dictionary keys (#4140)

---
 .../src/form/controls/utilities/dictionary.tsx         | 10 ++++++++++
 1 file changed, 10 insertions(+)

diff --git a/packages/tooling/fast-tooling-react/src/form/controls/utilities/dictionary.tsx b/packages/tooling/fast-tooling-react/src/form/controls/utilities/dictionary.tsx
index 96ef1885fc6..da6e7a2bcf6 100644
--- a/packages/tooling/fast-tooling-react/src/form/controls/utilities/dictionary.tsx
+++ b/packages/tooling/fast-tooling-react/src/form/controls/utilities/dictionary.tsx
@@ -117,6 +117,7 @@ class Dictionary extends React.Component<
                         }
                         onFocus={this.handleKeyFocus(propertyName)}
                         onBlur={this.handleKeyBlur(propertyName)}
+                        onKeyDown={this.handleKeyPress()}
                         onChange={this.handleKeyChange(propertyName)}
                     />
                     <button
@@ -229,6 +230,15 @@ class Dictionary extends React.Component<
         };
     };
 
+    private handleKeyPress = (): ((e: React.KeyboardEvent<HTMLInputElement>) => void) => {
+        return (e: React.KeyboardEvent<HTMLInputElement>): void => {
+            if (e.keyCode === 13) {
+                e.currentTarget.blur();
+                e.preventDefault();
+            }
+        };
+    };
+
     private handleKeyChange = (
         propertyName: string
     ): ((e: React.ChangeEvent<HTMLInputElement>) => void) => {