fix(select): open dropdown with arrow keys

baloise · Sep 29, 2021 · f1621dd · f1621dd
1 parent eb15ff6
commit f1621dd
Showing 1 changed file with 7 additions and 2 deletions.
diff --git a/packages/components/src/components/bal-select/bal-select.tsx b/packages/components/src/components/bal-select/bal-select.tsx
@@ -173,7 +173,7 @@ export class Select {
   }
 
   @Listen('keydown', { target: 'window' })
-  handleKeyDown(event: KeyboardEvent) {
+  async handleKeyDown(event: KeyboardEvent) {
     if (this.isDropdownOpen) {
       if (isArrowDownKey(event) || isArrowUpKey(event)) {
         preventDefault(event)
@@ -199,6 +199,11 @@ export class Select {
       if (isSpaceKey(event) && !this.typeahead) {
         preventDefault(event)
       }
+    } else {
+      if (isArrowDownKey(event) || isArrowUpKey(event)) {
+        preventDefault(event)
+        await this.open()
+      }
     }
   }
 
@@ -582,7 +587,7 @@ export class Select {
   }
 
   private handleKeyPress = async (event: KeyboardEvent) => {
-    if (isSpaceKey(event) && !this.isDropdownOpen) {
+    if (!this.isDropdownOpen && isSpaceKey(event)) {
       preventDefault(event)
       await this.open()
     }