mcp/carbon-components-svelte
1
0
Fork 0
mirror of https://github.com/carbon-design-system/carbon-components-svelte.git synced 2025-09-18 19:46:36 +00:00
Code Issues Projects Releases Packages Wiki Activity

fix(ComboBox): handling TAB behaviour

Browse source
This commit is contained in:
István Pató 2022-09-07 13:00:45 +02:00
commit a965f3193c
2 changed files with 5 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

5
docs/src/pages/framed/ComboBox/FilterableComboBox.svelte
View file

@ -1,6 +1,7 @@
<script>
import { ComboBox } from "carbon-components-svelte";
let selectedId
function shouldFilterItem(item, value) {
if (!value) return true;
return item.text.toLowerCase().includes(value.toLowerCase());
@ -8,6 +9,7 @@
</script>
<ComboBox
bind:selectedId
titleText="Contact"
placeholder="Select contact method"
items="{[
@ -16,4 +18,5 @@
{ id: '2', text: 'Fax' },
]}"
shouldFilterItem="{shouldFilterItem}"
/>
helperText="selectedId: {selectedId}"
/>

4
src/ComboBox/ComboBox.svelte
View file

@ -289,7 +289,7 @@
if (['Enter', 'ArrowDown', 'ArrowUp'].includes(key)) {
e.preventDefault();
}
if (key === 'Enter') {
if (key === 'Enter' || key === 'Tab') {
open = !open;
if (
highlightedIndex > -1 &&
@ -317,8 +317,6 @@
}
}
highlightedIndex = -1;
} else if (key === 'Tab') {
open = false;
} else if (key === 'ArrowDown') {
change(1);
} else if (key === 'ArrowUp') {