@versini/ui-hooks 4.3.0 → 4.5.0

package/dist/hooks/useClickOutside.js

@@ -0,0 +1,26 @@
+import { useRef as f, useEffect as d } from "react";
+const i = ["mousedown", "touchstart"];
+function E(r, o, e) {
+  const c = f(null);
+  return d(() => {
+    const n = (t) => {
+      const s = t ? t.target : void 0;
+      if (Array.isArray(e)) {
+        const a = !document.body.contains(s) && s.tagName !== "HTML";
+        e.every(
+          (u) => !!u && !t.composedPath().includes(u)
+        ) && !a && r();
+      } else c.current && !c.current.contains(s) && r();
+    };
+    return (o || i).forEach(
+      (t) => document.addEventListener(t, n)
+    ), () => {
+      (o || i).forEach(
+        (t) => document.removeEventListener(t, n)
+      );
+    };
+  }, [r, e, o]), c;
+}
+export {
+  E as useClickOutside
+};

package/dist/hooks/useInViewport.js

@@ -0,0 +1,13 @@
+import { useRef as f, useState as u, useCallback as l } from "react";
+function b() {
+  const e = f(null), [i, t] = u(!1);
+  return { ref: l((r) => {
+    var n, s;
+    typeof IntersectionObserver < "u" && (r && !e.current ? e.current = new IntersectionObserver(
+      (o) => t(o.some((c) => c.isIntersecting))
+    ) : (n = e.current) == null || n.disconnect(), r ? (s = e.current) == null || s.observe(r) : t(!1));
+  }, []), inViewport: i };
+}
+export {
+  b as useInViewport
+};

package/dist/hooks/useInterval.js

@@ -0,0 +1,12 @@
+import { useState as i, useRef as o, useCallback as a, useEffect as v } from "react";
+function p(u, c) {
+  const [t, s] = i(!1), e = o(null), l = o(null), r = a(() => {
+    s((f) => (!f && (!e.current || e.current === -1) && (e.current = window.setInterval(l.current, c)), !0));
+  }, [c]), n = a(() => {
+    s(!1), window.clearInterval(e.current || -1), e.current = -1;
+  }, []);
+  return v(() => (l.current = u, t && r(), n), [u, t, r, n]), { start: r, stop: n, active: t };
+}
+export {
+  p as useInterval
+};

package/dist/index.d.ts

@@ -1,5 +1,23 @@
 import * as react from 'react';
 
+/**
+ * Custom hooks that triggers a callback when a click is detected
+ * outside the target element.
+ *
+ * @param handler - Function to be called when clicked outside
+ * @param events - Array of events to listen to
+ * @param nodes - Array of nodes to check against
+ * @returns Ref to be attached to the target element
+ *
+ * @example
+ * const ref = useClickOutside(() => {
+ *  console.log('Clicked outside!');
+ * });
+ * <div ref={ref}>Click me!</div>
+ *
+ */
+declare function useClickOutside<T extends HTMLElement = any>(handler: () => void, events?: string[] | null, nodes?: (HTMLElement | null)[]): react.RefObject<T | null>;
+
 interface HotkeyItemOptions {
     preventDefault?: boolean;
 }
@@ -11,8 +29,42 @@ type HotkeyItem = [
     (event: KeyboardEvent) => void,
     HotkeyItemOptions?
 ];
+declare function shouldFireEvent(event: KeyboardEvent, tagsToIgnore: string[], triggerOnContentEditable?: boolean): boolean;
 declare function useHotkeys(hotkeys: HotkeyItem[], tagsToIgnore?: string[], triggerOnContentEditable?: boolean): void;
 
+/**
+ * Custom hook to call a function within a given interval.
+ *
+ * @param fn Callback function to be executed at each interval
+ * @param interval  Interval time in milliseconds
+ * @returns An object containing start, stop, and active state
+ *
+ * @example
+ * const { start, stop, active } = useInterval(() => {
+ *  console.log("Interval executed");
+ * }, 1000);
+ * start(); // To start the interval
+ * stop(); // To stop the interval
+ * console.log(active); // To check if the interval is active
+ *
+ */
+declare function useInterval(fn: () => void, interval: number): {
+    start: () => void;
+    stop: () => void;
+    active: boolean;
+};
+
+/**
+ * Hook that checks if an element is visible in the viewport.
+ * @returns
+ * ref: React ref object to attach to the element you want to monitor.
+ * inViewport: Boolean indicating if the element is in the viewport.
+ */
+declare function useInViewport<T extends HTMLElement = any>(): {
+    ref: (node: T | null) => void;
+    inViewport: boolean;
+};
+
 /**
  * Custom hook that returns a function indicating whether the component
  * is mounted or not.
@@ -142,4 +194,4 @@ type UseUniqueIdOptions = string | number | {
 };
 declare function useUniqueId(options?: UseUniqueIdOptions): string | undefined;
 
-export { getHotkeyHandler, useHotkeys, useIsMounted, useLocalStorage, useMergeRefs, useResizeObserver, useUncontrolled, useUniqueId };
+export { type HotkeyItem, type HotkeyItemOptions, type StorageProperties, type UseUniqueIdOptions, getHotkeyHandler, shouldFireEvent, useClickOutside, useHotkeys, useInViewport, useInterval, useIsMounted, useLocalStorage, useMergeRefs, useResizeObserver, useUncontrolled, useUniqueId };

package/dist/index.js

@@ -1,21 +1,28 @@
-import { getHotkeyHandler as r, useHotkeys as t } from "./hooks/useHotkeys.js";
-import { useIsMounted as u } from "./hooks/useIsMounted.js";
-import { useLocalStorage as m } from "./hooks/useLocalStorage.js";
-import { useMergeRefs as x } from "./hooks/useMergeRefs.js";
-import { useResizeObserver as d } from "./hooks/useResizeObserver.js";
-import { useUncontrolled as a } from "./hooks/useUncontrolled.js";
-import { useUniqueId as H } from "./hooks/useUniqueId.js";
+import { useClickOutside as r } from "./hooks/useClickOutside.js";
+import { getHotkeyHandler as s, shouldFireEvent as u, useHotkeys as f } from "./hooks/useHotkeys.js";
+import { useInterval as m } from "./hooks/useInterval.js";
+import { useInViewport as n } from "./hooks/useInViewport.js";
+import { useIsMounted as d } from "./hooks/useIsMounted.js";
+import { useLocalStorage as a } from "./hooks/useLocalStorage.js";
+import { useMergeRefs as c } from "./hooks/useMergeRefs.js";
+import { useResizeObserver as k } from "./hooks/useResizeObserver.js";
+import { useUncontrolled as H } from "./hooks/useUncontrolled.js";
+import { useUniqueId as M } from "./hooks/useUniqueId.js";
 /*!
-  @versini/ui-hooks v4.3.0
-  © 2024 gizmette.com
+  @versini/ui-hooks v4.5.0
+  © 2025 gizmette.com
 */
 export {
-  r as getHotkeyHandler,
-  t as useHotkeys,
-  u as useIsMounted,
-  m as useLocalStorage,
-  x as useMergeRefs,
-  d as useResizeObserver,
-  a as useUncontrolled,
-  H as useUniqueId
+  s as getHotkeyHandler,
+  u as shouldFireEvent,
+  r as useClickOutside,
+  f as useHotkeys,
+  n as useInViewport,
+  m as useInterval,
+  d as useIsMounted,
+  a as useLocalStorage,
+  c as useMergeRefs,
+  k as useResizeObserver,
+  H as useUncontrolled,
+  M as useUniqueId
 };

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@versini/ui-hooks",
-	"version": "4.3.0",
+	"version": "4.5.0",
 	"license": "MIT",
 	"author": "Arno Versini",
 	"publishConfig": {
@@ -37,5 +37,5 @@
 		"react": "^18.3.1 || ^19.0.0",
 		"react-dom": "^18.3.1 || ^19.0.0"
 	},
-	"gitHead": "413e5c7cd8228d2f135f54fa897101401207229b"
+	"gitHead": "9fe85d906eb117bb22c3b576f104b6f0203429d7"
 }