From d98dcc58d71374e00b6f9391291ff190e6370165 Mon Sep 17 00:00:00 2001 From: padreug Date: Fri, 26 Sep 2025 17:11:08 +0200 Subject: [PATCH] BUILD ERRORS: Refactor MarketFuzzySearch component for improved input handling - Updated the searchInputRef initialization to remove the explicit type declaration, simplifying the code. - Enhanced input focus and blur handling by ensuring the existence of the $el property before accessing the input element, improving robustness. - Streamlined the focus management logic in the handleClear and handleKeydown functions for better user experience. These changes enhance the reliability and clarity of the MarketFuzzySearch component, improving overall usability. --- .../market/components/MarketFuzzySearch.vue | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/src/modules/market/components/MarketFuzzySearch.vue b/src/modules/market/components/MarketFuzzySearch.vue index 5054398..4ad7c14 100644 --- a/src/modules/market/components/MarketFuzzySearch.vue +++ b/src/modules/market/components/MarketFuzzySearch.vue @@ -193,7 +193,7 @@ const { } = useFuzzySearch(dataRef, props.options) // Local state -const searchInputRef = ref() +const searchInputRef = ref() const isFocused = ref(false) // Persistent recent searches (stored in localStorage) @@ -281,8 +281,8 @@ const handleClear = () => { emit('clear') // Focus the input after clearing - if (searchInputRef.value) { - const inputElement = searchInputRef.value.$el?.querySelector('input') || searchInputRef.value.$el + if (searchInputRef.value?.$el) { + const inputElement = searchInputRef.value.$el.querySelector('input') || searchInputRef.value.$el if (inputElement && typeof inputElement.focus === 'function') { inputElement.focus() } @@ -294,8 +294,8 @@ const handleKeydown = (event: KeyboardEvent) => { if (event.key === 'Escape') { if (searchQuery.value) { handleClear() - } else if (searchInputRef.value) { - const inputElement = searchInputRef.value.$el?.querySelector('input') || searchInputRef.value.$el + } else if (searchInputRef.value?.$el) { + const inputElement = searchInputRef.value.$el.querySelector('input') || searchInputRef.value.$el if (inputElement && typeof inputElement.blur === 'function') { inputElement.blur() } @@ -346,9 +346,9 @@ const handleGlobalKeydown = (event: KeyboardEvent) => { if ((event.metaKey || event.ctrlKey) && event.key === 'k') { event.preventDefault() console.log('⌘K/Ctrl+K pressed, focusing search input', !!searchInputRef.value) - if (searchInputRef.value) { + if (searchInputRef.value?.$el) { // Access the underlying HTML input element from the Shadcn Input component - const inputElement = searchInputRef.value.$el?.querySelector('input') || searchInputRef.value.$el + const inputElement = searchInputRef.value.$el.querySelector('input') || searchInputRef.value.$el if (inputElement && typeof inputElement.focus === 'function') { inputElement.focus() }