@versini/ui-hooks 5.1.0 → 5.1.1

package/dist/hooks/useHaptic.js

@@ -1,25 +1,45 @@
-import { useRef as u, useEffect as d, useCallback as l } from "react";
-const o = 50, s = 120, m = () => {
-  const c = u(null), r = u(null), i = u(/* @__PURE__ */ new Set());
-  d(() => typeof window > "u" ? void 0 : ((() => {
-    if (c.current && r.current)
-      return;
-    const e = document.createElement("input");
-    e.type = "checkbox", e.setAttribute("switch", ""), e.style.display = "none", e.setAttribute("aria-hidden", "true");
-    const t = document.createElement("label");
-    t.style.display = "none", t.setAttribute("aria-hidden", "true"), t.appendChild(e), document.body.appendChild(t), c.current = e, r.current = t;
-  })(), () => {
-    for (const e of i.current)
-      clearTimeout(e);
-    i.current.clear(), r.current && document.body.contains(r.current) && document.body.removeChild(r.current), c.current = null, r.current = null;
-  }), []);
-  const a = l(() => {
+import { useRef as s, useEffect as p, useCallback as l } from "react";
+const u = 50, d = 120;
+let t = null, c = 0;
+const f = () => {
+  if (typeof window > "u" || t && document.body.contains(t))
+    return;
+  const r = document.querySelector(
+    'label[data-haptic-singleton="true"]'
+  );
+  if (r) {
+    t = r;
+    return;
+  }
+  t = null;
+  const e = document.createElement("input");
+  e.type = "checkbox", e.setAttribute("switch", ""), e.style.display = "none", e.setAttribute("aria-hidden", "true"), e.dataset.hapticSingleton = "true";
+  const i = document.createElement("label");
+  i.style.display = "none", i.setAttribute("aria-hidden", "true"), i.dataset.hapticSingleton = "true", i.appendChild(e), document.body.appendChild(i), t = i;
+}, m = () => {
+  t && document.body && document.body.contains(t) && document.body.removeChild(t), t = null;
+}, h = () => {
+  const r = s(/* @__PURE__ */ new Set());
+  p(() => {
+    c++;
+    try {
+      f();
+    } catch (n) {
+      throw c--, n;
+    }
+    return () => {
+      for (const n of r.current)
+        clearTimeout(n);
+      r.current.clear(), c--, c === 0 && m();
+    };
+  }, []);
+  const e = l(() => {
     try {
       if (navigator?.vibrate) {
-        navigator.vibrate(o);
+        navigator.vibrate(u);
         return;
       }
-      r.current?.click();
+      t?.click();
     } catch {
     }
   }, []);
@@ -27,23 +47,23 @@ const o = 50, s = 120, m = () => {
     (n = 1) => {
       if (!(typeof window > "u") && !(n < 1)) {
         if (navigator?.vibrate && n > 1) {
-          const e = [];
-          for (let t = 0; t < n; t++)
-            e.push(o), t < n - 1 && e.push(s - o);
-          navigator.vibrate(e);
+          const o = [];
+          for (let a = 0; a < n; a++)
+            o.push(u), a < n - 1 && o.push(d - u);
+          navigator.vibrate(o);
           return;
         }
-        for (let e = 0; e < n; e++) {
-          const t = setTimeout(() => {
-            a(), i.current.delete(t);
-          }, e * s);
-          i.current.add(t);
+        for (let o = 0; o < n; o++) {
+          const a = setTimeout(() => {
+            e(), r.current.delete(a);
+          }, o * d);
+          r.current.add(a);
         }
       }
     },
-    [a]
+    [e]
   ) };
 };
 export {
-  m as useHaptic
+  h as useHaptic
 };

package/dist/index.d.ts

@@ -20,8 +20,12 @@ declare function useClickOutside<T extends HTMLElement = any>(handler: () => voi
 
 /**
  * Custom hook providing imperative haptic feedback for mobile devices. Uses
- * navigator.vibrate when available, falls back to iOS switch element trick
- * for Safari on iOS devices that don't support the Vibration API.
+ * navigator.vibrate when available, falls back to iOS switch element trick for
+ * Safari on iOS devices that don't support the Vibration API.
+ *
+ * This hook uses a singleton pattern - only one haptic element is created in
+ * the DOM regardless of how many components use this hook. The element is
+ * automatically cleaned up when the last component unmounts.
  *
  * @example
  * ```tsx
@@ -33,6 +37,7 @@ declare function useClickOutside<T extends HTMLElement = any>(handler: () => voi
  * // Trigger two rapid haptic pulses
  * haptic(2);
  * ```
+ *
  */
 declare const useHaptic: () => {
     haptic: (count?: number) => void;

package/dist/index.js

@@ -12,7 +12,7 @@ import { useUniqueId as S } from "./hooks/useUniqueId.js";
 import { useViewportSize as M } from "./hooks/useViewportSize.js";
 import { useVisualViewportSize as R } from "./hooks/useVisualViewportSize.js";
 /*!
-  @versini/ui-hooks v5.1.0
+  @versini/ui-hooks v5.1.1
   © 2025 gizmette.com
 */
 export {

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@versini/ui-hooks",
-	"version": "5.1.0",
+	"version": "5.1.1",
 	"license": "MIT",
 	"author": "Arno Versini",
 	"publishConfig": {
@@ -36,5 +36,5 @@
 		"test:watch": "vitest",
 		"test": "vitest run"
 	},
-	"gitHead": "e2e7b5c53c77d1773d7e0e463bac2a75b936a0d3"
+	"gitHead": "eeceef78affd19e3dcae621833a83a892f09c204"
 }