useClickOutside()
Listening for clicks outside of a specified element.
Usage
import { MouseEvent as ReactMouseEvent, useRef } from 'react';
import { useClickOutside } from '@norr/hooks';
const Component = () => {
const buttonRef = useRef(null);
const handleClickOutside = (event: MouseEvent) => {
console.log('You clicked outside.', event);
};
const handleClickInside = (
event: ReactMouseEvent<HTMLButtonElement, MouseEvent>
) => {
console.log('You clicked inside.', event);
};
useClickOutside(buttonRef, handleClickOutside);
return (
<button
type="button"
ref={buttonRef}
onClick={handleClickInside}
>
Click me.
</button>
);
};