@integry/sdk 4.5.2 → 4.5.4

package/src/hooks/useOnClickOutside.ts

@@ -0,0 +1,32 @@
+import { RefObject } from 'preact';
+import { useEffect } from 'preact/hooks';
+
+type AnyEvent = MouseEvent | TouchEvent;
+
+export function useOnClickOutside<T extends HTMLElement = HTMLElement>(
+  ref: RefObject<T>,
+  handler: (event: AnyEvent) => void,
+): void {
+  useEffect(() => {
+    const listener = (event: AnyEvent) => {
+      const el = ref?.current;
+
+      // Do nothing if clicking ref's element or descendent elements
+      if (!el || el.contains(event.target as Node)) {
+        return;
+      }
+
+      handler(event);
+    };
+
+    document.addEventListener(`mousedown`, listener);
+    document.addEventListener(`touchstart`, listener);
+
+    return () => {
+      document.removeEventListener(`mousedown`, listener);
+      document.removeEventListener(`touchstart`, listener);
+    };
+
+    // Reload only if ref or handler changes
+  }, [ref, handler]);
+}