From 997eeb7b48240a1ce9c0847bfa748232935f6de0 Mon Sep 17 00:00:00 2001
From: Eric Liu <ericyl.us@gmail.com>
Date: Thu, 30 Dec 2021 13:00:21 -0800
Subject: [PATCH] Fix filterable MultiSelect keydown behavior (#961)

* fix(multi-select): blur input when tabbing away

Fixes #938

* fix(multi-select): close a filterable menu on "Escape"

* fix(multi-select): open filterable menu on [Space]
---
 src/MultiSelect/MultiSelect.svelte | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/src/MultiSelect/MultiSelect.svelte b/src/MultiSelect/MultiSelect.svelte
index e9d358b4..0c5edf7a 100644
--- a/src/MultiSelect/MultiSelect.svelte
+++ b/src/MultiSelect/MultiSelect.svelte
@@ -64,7 +64,7 @@
    * @type {(item: MultiSelectItem, value: string) => string}
    */
   export let filterItem = (item, value) =>
-    item.text.toLowerCase().includes(value.toLowerCase());
+    item.text.toLowerCase().includes(value.trim().toLowerCase());
 
   /** Set to `true` to open the dropdown */
   export let open = false;
@@ -412,10 +412,15 @@
               }
             } else if (key === 'Tab') {
               open = false;
+              inputRef.blur();
             } else if (key === 'ArrowDown') {
               change(1);
             } else if (key === 'ArrowUp') {
               change(-1);
+            } else if (key === 'Escape') {
+              open = false;
+            } else if (key === ' ') {
+              if (!open) open = true;
             }
           }}"
           on:keyup