import type { MaybeRef } from '@react-hooks-library/shared' ; import { unRef } from '@react-hooks-library/shared' ; import { useCallback } from 'react' ; import { _window } from '../_ssr.config' ; import { useEventListener } from '../useEventListener' ; export type ClickOutsideEvents = Pick < WindowEventMap , 'mousedown' | 'mouseup' | 'touchstart' | 'touchend' | 'pointerdown' | 'pointerup' > ; export interface ClickOutsideOptions < E extends keyof ClickOutsideEvents > { event ? : E ; } param target param handler param options see https export function useClickOutside < E extends keyof ClickOutsideEvents = 'pointerdown' > ( target , handler , options = { } ) { const { event = 'pointerdown' } = options ; const listener = useCallback ( ( event ) => { const el = unRef ( target ) ; if ( ! el ) return ; if ( el === event . target || event . composedPath ( ) . includes ( el ) ) return ; handler ( event ) ; } , [ handler , target ] ) ; return useEventListener ( _window , event , listener , { passive : true } ) ; }