/
sanagl
/
ui-kit-ce
Обзор
Документация
Войти
/
sanagl
/
ui-kit-ce
Код
Запросы
0
Задачи
Вики
Пакеты
0
Релизы
0
Аналитика
Безопасность
develop
packages/hooks/src/useOutsideClick/useOutsideClick.ts
42 строки
1 KB
Nikita
fix(combo-box): dropdown не будет закрываться если кликнули по опции
13 сен 2024, 13:23
13 сен 2024, 13:23
c6f7167
Код
Авторство
О чём код?
'use client' import { useCallback, useRef } from 'react' /** * Обработка события клика за пределами переданных элементов. * targets - это элементы, за пределами которых необходимо отслеживать событие 'click'. */ export const useOutsideClick = <Ref extends HTMLElement>( handler: (e?: Event) => void ): ((node: Ref | null) => void) => { const ref = useRef<Ref | null>(null) const handleMouseDown = useCallback( (e: Event) => { // Если клик происходит за пределами целевого элемента, вызвать обработчик if (!ref.current?.contains(e.target as Node)) { handler(e) } }, [handler] ) const callbackRef = useCallback<(node: Ref | null) => void>( (node) => { if (ref.current) { document.removeEventListener('mousedown', handleMouseDown, true) document.removeEventListener('touchstart', handleMouseDown, true) } ref.current = node if (ref.current) { document.addEventListener('mousedown', handleMouseDown, true) document.addEventListener('touchstart', handleMouseDown, true) } }, [handleMouseDown] ) return callbackRef }