export type RefParam = React.RefObject | (React.RefObject | null | undefined)[] | null | undefined;
export interface UseElementClickOptions {
event: 'click' | 'mousedown' | 'mouseup' | 'dblclick';
onClickInside?: (event: MouseEvent) => void;
onClickOutside?: (event: MouseEvent) => void;
}
/**
* Custom hook for handling click events relative to one or multiple elements.
* Executes callbacks depending on whether click occurred inside/outside target elements.
*
* @param ref - Single ref object or array of refs to monitor. Supports:
* - Single element ref (React.RefObject)
* - Array of element refs
* - null/undefined (hook will do nothing)
* @param options - Configuration object:
* - event: Mouse event type to listen for ('click'|'mousedown'|'mouseup'|'dblclick')
* - onClickInside: Fires when click occurs inside ANY of elements
* - onClickOutside: Fires when click occurs outside ALL elements
*
* @example
* // Single element usage
* useElementClick(modalRef, {
* event: 'click',
* onClickOutside: () => handleClose()
* });
*
* @example
* // Multiple elements usage
* useElementClick([modalRef, tooltipRef], {
* event: 'mousedown',
* onClickOutside: () => {
* closeModal();
* hideTooltip();
* }
* });
*
* @remarks
* - Ignores refs with uninitialized .current property
* - Handles dynamic ref arrays (automatically filters invalid refs)
* - Uses event delegation on document level
*/
export declare function useElementClick(ref: RefParam, { event, onClickInside, onClickOutside }: UseElementClickOptions): void;