mirror of
https://github.com/carbon-design-system/carbon-components-svelte.git
synced 2025-09-15 02:11:05 +00:00
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]
This commit is contained in:
parent
f955b09c09
commit
997eeb7b48
1 changed files with 6 additions and 1 deletions
|
@ -64,7 +64,7 @@
|
||||||
* @type {(item: MultiSelectItem, value: string) => string}
|
* @type {(item: MultiSelectItem, value: string) => string}
|
||||||
*/
|
*/
|
||||||
export let filterItem = (item, value) =>
|
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 */
|
/** Set to `true` to open the dropdown */
|
||||||
export let open = false;
|
export let open = false;
|
||||||
|
@ -412,10 +412,15 @@
|
||||||
}
|
}
|
||||||
} else if (key === 'Tab') {
|
} else if (key === 'Tab') {
|
||||||
open = false;
|
open = false;
|
||||||
|
inputRef.blur();
|
||||||
} else if (key === 'ArrowDown') {
|
} else if (key === 'ArrowDown') {
|
||||||
change(1);
|
change(1);
|
||||||
} else if (key === 'ArrowUp') {
|
} else if (key === 'ArrowUp') {
|
||||||
change(-1);
|
change(-1);
|
||||||
|
} else if (key === 'Escape') {
|
||||||
|
open = false;
|
||||||
|
} else if (key === ' ') {
|
||||||
|
if (!open) open = true;
|
||||||
}
|
}
|
||||||
}}"
|
}}"
|
||||||
on:keyup
|
on:keyup
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue