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

fix: multiple event dispatch, and item selection bug

Browse source
This commit is contained in:
István Pató 2021-12-06 09:55:55 +01:00
commit 213c15031a
No known key found for this signature in database
GPG key ID: 3A842123BFF8E969
1 changed files with 9 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

15
src/ComboBox/ComboBox.svelte
View file

@ -111,6 +111,8 @@
let inputValue = value; let inputValue = value;
let highlightedIndex = -1; let highlightedIndex = -1;
let selectedItem;
function change(dir) { function change(dir) {
let index = highlightedIndex + dir; let index = highlightedIndex + dir;
let _items = !filteredItems?.length ? items : filteredItems; let _items = !filteredItems?.length ? items : filteredItems;
@ -130,6 +132,7 @@
export function clear() { export function clear() {
selectedIndex = -1; selectedIndex = -1;
highlightedIndex = -1; highlightedIndex = -1;
selectedItem = undefined;
open = false; open = false;
inputValue = ""; inputValue = "";
ref?.focus(); ref?.focus();
@ -149,16 +152,17 @@
} }
}); });
$: if (selectedIndex > -1) { let prevSelectedIndex;
let _selectedItem; $: if (selectedIndex > -1 && prevSelectedIndex !== selectedIndex) {
prevSelectedIndex = selectedIndex;
if (filteredItems?.length === 1) { if (filteredItems?.length === 1) {
selectedId = filteredItems[0].id; selectedId = filteredItems[0].id;
_selectedItem = filteredItems[0]; selectedItem = filteredItems[0];
} else { } else {
selectedId = items[selectedIndex].id; selectedId = items[selectedIndex].id;
_selectedItem = selectedItem; selectedItem = items[selectedIndex];
} }
dispatch("select", { selectedId, selectedIndex, selectedItem: _selectedItem }); dispatch("select", { selectedId, selectedIndex, selectedItem });
} }
$: ariaLabel = $$props["aria-label"] || "Choose an item"; $: ariaLabel = $$props["aria-label"] || "Choose an item";
$: menuId = `menu-${id}`; $: menuId = `menu-${id}`;
@ -167,7 +171,6 @@
? items[highlightedIndex].id ? items[highlightedIndex].id
: undefined; : undefined;
$: filteredItems = items.filter((item) => shouldFilterItem(item, value)); $: filteredItems = items.filter((item) => shouldFilterItem(item, value));
$: selectedItem = items[selectedIndex];
$: value = inputValue; $: value = inputValue;
</script> </script>