feat(ld-select): clear selection with minus key

emdgroup-liquid · Jul 2, 2021 · a6e566e · a6e566e
1 parent cc20a5b
commit a6e566e
Showing 1 changed file with 16 additions and 0 deletions.
diff --git a/src/liquid/components/ld-select/ld-select.tsx b/src/liquid/components/ld-select/ld-select.tsx
@@ -127,6 +127,15 @@ export class LdSelect {
     this.updateInert()
   }
 
+  private clearSelection() {
+    Array.from(this.popperRef.querySelectorAll('ld-option')).forEach(
+      (option) => {
+        option.selected = false
+      }
+    )
+    this.selected = []
+  }
+
   @Listen('resize', { target: 'window', passive: true })
   handleWindowResize() {
     this.updatePopperWidth()
@@ -333,6 +342,13 @@ export class LdSelect {
           ev.stopImmediatePropagation()
         }
         break
+      case '-':
+        // Clear selection.
+        ev.preventDefault()
+        ev.stopImmediatePropagation()
+        this.clearSelection()
+        this.triggerRef.focus()
+        break
     }
 
     // TODO: implement type-ahead