2022-02-07 15:49:08 +00:00
|
|
|
import React, { useEffect } from "react";
|
|
|
|
|
2022-02-25 11:42:31 +00:00
|
|
|
export const useClickOutside = (ref, handler, ...deps) => {
|
2022-02-07 15:49:08 +00:00
|
|
|
useEffect(() => {
|
|
|
|
const handleClickOutside = (e) => {
|
2022-02-25 11:42:31 +00:00
|
|
|
e.stopPropagation();
|
2022-02-07 15:49:08 +00:00
|
|
|
if (ref.current && !ref.current.contains(e.target)) handler();
|
|
|
|
};
|
|
|
|
document.addEventListener("mousedown", handleClickOutside);
|
|
|
|
return () => {
|
|
|
|
document.removeEventListener("mousedown", handleClickOutside);
|
|
|
|
};
|
2022-02-25 11:42:31 +00:00
|
|
|
}, [ref, ...deps]);
|
2022-02-07 15:49:08 +00:00
|
|
|
};
|