From 82c34618c9c52370c6b3f4b456a9d94cc0569384 Mon Sep 17 00:00:00 2001
From: Caleb OLeary <caleb.olearyall@gmail.com>
Date: Mon, 15 Aug 2022 18:19:02 -0500
Subject: [PATCH] fix(component): make Select close when option chosen with
 Enter key

---
 libs/components/ui/src/select/Select.tsx | 18 +++++++++++++++++-
 1 file changed, 17 insertions(+), 1 deletion(-)

diff --git a/libs/components/ui/src/select/Select.tsx b/libs/components/ui/src/select/Select.tsx
index 7dcfcdc45a..c11ee9f3b4 100644
--- a/libs/components/ui/src/select/Select.tsx
+++ b/libs/components/ui/src/select/Select.tsx
@@ -1,5 +1,6 @@
 import {
     forwardRef,
+    useState,
     type CSSProperties,
     type ForwardedRef,
     type ReactNode,
@@ -39,6 +40,7 @@ export const Select = forwardRef(function CustomSelect<TValue>(
     props: ExtendSelectProps & SelectUnstyledProps<TValue>,
     ref: ForwardedRef<HTMLUListElement>
 ) {
+    const [isOpen, setIsOpen] = useState(false);
     const { width = '100%', style, listboxStyle, placeholder } = props;
     const components: SelectUnstyledProps<TValue>['components'] = {
         // Root: generateStyledRoot({ width, ...style }),
@@ -76,7 +78,21 @@ export const Select = forwardRef(function CustomSelect<TValue>(
         ...props.components,
     };
 
-    return <SelectUnstyled {...props} ref={ref} components={components} />;
+    return (
+        <SelectUnstyled
+            listboxOpen={isOpen}
+            onListboxOpenChange={() => {
+                setIsOpen(true);
+            }}
+            {...props}
+            onChange={v => {
+                setIsOpen(false);
+                props.onChange && props.onChange(v);
+            }}
+            ref={ref}
+            components={components}
+        />
+    );
 }) as <TValue>(
     props: ExtendSelectProps &
         SelectUnstyledProps<TValue> &