From ca0eccb37dd144623302465ea5dc4c39e5b6b550 Mon Sep 17 00:00:00 2001 From: James Johnson Date: Mon, 23 Sep 2024 15:35:20 -0500 Subject: [PATCH] fix: default highlighted should be the current selected if query allows it --- resources/js/components/ComboBox/ComboBox.vue | 14 +++++++++++++- 1 file changed, 13 insertions(+), 1 deletion(-) diff --git a/resources/js/components/ComboBox/ComboBox.vue b/resources/js/components/ComboBox/ComboBox.vue index 0f7f0661..b40444ee 100644 --- a/resources/js/components/ComboBox/ComboBox.vue +++ b/resources/js/components/ComboBox/ComboBox.vue @@ -324,7 +324,19 @@ function handleKeyDown(event: KeyboardEvent) { } watch(query, () => { - highlightedOption.value = first(filteredOptions.value) ?? null; + if (!props.modelValue) { + highlightedOption.value = first(filteredOptions.value) ?? null; + } + + // if the current selected item is in the filtered options, + // use it as the default highlighted option + const isModelValueInFilteredOptions = filteredOptions.value.some((option) => + areOptionsEqual(option, props.modelValue), + ); + + highlightedOption.value = isModelValueInFilteredOptions + ? props.modelValue + : first(filteredOptions.value) ?? null; }); const { floatingStyles } = useFloating(