diff --git a/src/components/forms/filters/InputSearch.tsx b/src/components/forms/filters/InputSearch.tsx index 713dfc6..7feb158 100644 --- a/src/components/forms/filters/InputSearch.tsx +++ b/src/components/forms/filters/InputSearch.tsx @@ -43,6 +43,7 @@ export function InputSearch({ onResultClick, }: BookSearchResultsType) { const containerRef = useRef(null); + const inputRef = useRef(null); const colorIcons = useColorModeValue('gray.700', 'gray.300'); const bgInput = useColorModeValue('white', 'black'); const colorInput = useColorModeValue('gray.900', 'gray.100'); @@ -62,8 +63,13 @@ export function InputSearch({ useOutsideClick({ ref: containerRef, - handler: () => { - if (search.query) { + handler: (event) => { + // Verificar si el clic ocurriĆ³ fuera del inputRef + if ( + inputRef.current && + !inputRef.current.contains(event.target as Node) && + search.query + ) { setSearch({ ...search, query: '' }); } }, @@ -121,7 +127,7 @@ export function InputSearch({ return ( <> - + @@ -166,6 +172,7 @@ export function InputSearch({ = 3 ? 'block' : 'none'} w={width} maxH='300px'