From c76e80798997d0c381bb153b96eb3becbc50fa51 Mon Sep 17 00:00:00 2001
From: Oleg Isonen <oleg008@gmail.com>
Date: Sat, 15 Oct 2022 18:05:32 +0200
Subject: [PATCH] close the menu when input doesn't match but user hits enter

---
 .../shared/css-value-input/css-value-input.tsx            | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/apps/designer/app/designer/features/style-panel/shared/css-value-input/css-value-input.tsx b/apps/designer/app/designer/features/style-panel/shared/css-value-input/css-value-input.tsx
index aa226aaf9f..910cbee30e 100644
--- a/apps/designer/app/designer/features/style-panel/shared/css-value-input/css-value-input.tsx
+++ b/apps/designer/app/designer/features/style-panel/shared/css-value-input/css-value-input.tsx
@@ -188,14 +188,18 @@ const useKeyDown =
     onChange,
     onChangeComplete,
     onKeyDown,
+    closeMenu,
   }: {
     value: StyleValue;
     onChange: (value: StyleValue) => void;
     onChangeComplete: (value: StyleValue) => void;
     onKeyDown: KeyboardEventHandler<HTMLInputElement>;
+    closeMenu: () => void;
   }) =>
   (event: KeyboardEvent<HTMLInputElement>) => {
+    onKeyDown(event);
     if (event.key === "Enter") {
+      closeMenu();
       onChangeComplete(value);
     }
     if (
@@ -207,8 +211,6 @@ const useKeyDown =
         value: calcNumberChange(value.value, event),
       });
     }
-
-    onKeyDown(event);
   };
 
 type CssValueInputProps = {
@@ -268,6 +270,7 @@ export const CssValueInput = ({
     getMenuProps,
     getItemProps,
     isOpen,
+    closeMenu,
   } = useCombobox<StyleValue>({
     items: keywords,
     value,
@@ -305,6 +308,7 @@ export const CssValueInput = ({
     onChange,
     onChangeComplete,
     onKeyDown: inputProps.onKeyDown,
+    closeMenu,
   });
 
   const suffix =