@vibe/hooks 4.0.0-alpha.1 → 4.0.0-alpha.2

package/dist/index.d.ts

@@ -1,3 +1,3 @@
-export { default as useClickOutside } from "./useClickOutside";
-export { default as useIsOverflowing } from "./useIsOverflowing";
-export { default as useResizeObserver } from "./useResizeObserver";
+export { default as useClickOutside } from "./useClickOutside";
+export { default as useIsOverflowing } from "./useIsOverflowing";
+export { default as useResizeObserver } from "./useResizeObserver";

package/dist/useClickOutside/index.d.ts

@@ -1,8 +1,8 @@
-import { type RefObject } from "react";
-import { type GenericEventCallback } from "@vibe/shared";
-export default function useClickOutside({ ref, callback, ignoreClasses, eventName }: {
-    ref: RefObject<HTMLElement>;
-    callback: GenericEventCallback;
-    ignoreClasses?: string[];
-    eventName?: keyof HTMLElementEventMap | string;
-}): void;
+import { type RefObject } from "react";
+import { type GenericEventCallback } from "@vibe/shared";
+export default function useClickOutside({ ref, callback, ignoreClasses, eventName }: {
+    ref: RefObject<HTMLElement>;
+    callback: GenericEventCallback;
+    ignoreClasses?: string[];
+    eventName?: keyof HTMLElementEventMap | string;
+}): void;

package/dist/useIsOverflowing/index.d.ts

@@ -1,19 +1,19 @@
-import { type RefObject } from "react";
-export default function useIsOverflowing({ ref, ignoreHeightOverflow, tolerance: heightTolerance, widthTolerance }: {
-    /**
-     * The ref of the element to check for overflow.
-     */
-    ref: RefObject<HTMLElement>;
-    /**
-     * Whether to ignore height overflow.
-     */
-    ignoreHeightOverflow?: boolean;
-    /**
-     * The tolerance value to consider the element as overflowing (height overflow).
-     */
-    tolerance?: number;
-    /**
-     * The tolerance value to consider the element as overflowing (width overflow).
-     */
-    widthTolerance?: number;
-}): boolean;
+import { type RefObject } from "react";
+export default function useIsOverflowing({ ref, ignoreHeightOverflow, tolerance: heightTolerance, widthTolerance }: {
+    /**
+     * The ref of the element to check for overflow.
+     */
+    ref: RefObject<HTMLElement>;
+    /**
+     * Whether to ignore height overflow.
+     */
+    ignoreHeightOverflow?: boolean;
+    /**
+     * The tolerance value to consider the element as overflowing (height overflow).
+     */
+    tolerance?: number;
+    /**
+     * The tolerance value to consider the element as overflowing (width overflow).
+     */
+    widthTolerance?: number;
+}): boolean;

package/dist/useResizeObserver/index.d.ts

@@ -1,10 +1,10 @@
-import { type RefObject } from "react";
-type ResizeCallback = ({ borderBoxSize }: {
-    borderBoxSize: ResizeObserverSize;
-}) => void;
-export default function useResizeObserver({ ref, callback, debounceTime }: {
-    ref: RefObject<HTMLElement>;
-    callback: ResizeCallback;
-    debounceTime?: number;
-}): void;
-export {};
+import { type RefObject } from "react";
+type ResizeCallback = ({ borderBoxSize }: {
+    borderBoxSize: ResizeObserverSize;
+}) => void;
+export default function useResizeObserver({ ref, callback, debounceTime }: {
+    ref: RefObject<HTMLElement>;
+    callback: ResizeCallback;
+    debounceTime?: number;
+}): void;
+export {};

package/dist/useResizeObserver/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/useResizeObserver/index.ts"],"sourcesContent":["import { type RefObject, useCallback, useEffect } from \"react\";\nimport { debounce } from \"es-toolkit\";\n\ntype ResizeCallback = ({ borderBoxSize }: { borderBoxSize: ResizeObserverSize }) => void;\n\nexport default function useResizeObserver({\n  ref,\n  callback,\n  debounceTime = 200\n}: {\n  ref: RefObject<HTMLElement>;\n  callback: ResizeCallback;\n  debounceTime?: number;\n}) {\n  const debouncedCallback = useCallback(debounce<ResizeCallback>(callback, debounceTime), [callback, debounceTime]);\n\n  useEffect(() => {\n    if (!window.ResizeObserver) {\n      return;\n    }\n    if (!ref?.current) return;\n\n    function borderBoxSizeCallback(borderBoxSize: ResizeObserverSize | ReadonlyArray<ResizeObserverSize>): number {\n      const value = Array.isArray(borderBoxSize) ? borderBoxSize[0] : borderBoxSize;\n      return window.requestAnimationFrame(() => {\n        debouncedCallback({ borderBoxSize: value });\n      });\n    }\n\n    let animationFrameId: number | null = null;\n\n    const resizeObserver = new ResizeObserver(entries => {\n      const entry = entries[0];\n      if (entry && entry.borderBoxSize) {\n        // handle chrome (entry.borderBoxSize[0])\n        // handle ff (entry.borderBoxSize)\n        if (!Array.isArray(entry.borderBoxSize)) {\n          animationFrameId = borderBoxSizeCallback(entry.borderBoxSize);\n        } else {\n          const borderBoxEntry = entry.borderBoxSize[0];\n          animationFrameId = borderBoxSizeCallback(borderBoxEntry);\n        }\n      } else if (entry.contentRect) {\n        // handle safari (entry.contentRect)\n        const borderBoxSize = { blockSize: entry.contentRect.height, inlineSize: entry?.contentRect?.width || 0 };\n        animationFrameId = borderBoxSizeCallback(borderBoxSize);\n      } else {\n        return;\n      }\n    });\n\n    resizeObserver.observe(ref?.current);\n\n    return () => {\n      if (debounceTime !== 0) {\n        debouncedCallback.cancel();\n      }\n\n      if (animationFrameId) {\n        window.cancelAnimationFrame(animationFrameId);\n      }\n\n      resizeObserver.disconnect();\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [ref?.current, callback, debounceTime, debouncedCallback]);\n}\n"],"names":["useResizeObserver","ref","callback","debounceTime","debouncedCallback","useCallback","debounce","useEffect","window","ResizeObserver","current","borderBoxSizeCallback","borderBoxSize","value","Array","isArray","requestAnimationFrame","animationFrameId","resizeObserver","entries","entry","contentRect","blockSize","height","inlineSize","_a","width","observe","cancel","cancelAnimationFrame","disconnect"],"mappings":"yFAKwB,SAAAA,GAAkBC,IACxCA,EAAGC,SACHA,EAAQC,aACRA,EAAe,MAMf,MAAMC,EAAoBC,EAAYC,EAAyBJ,EAAUC,GAAe,CAACD,EAAUC,IAEnGI,GAAU,KACR,IAAKC,OAAOC,eACV,OAEF,KAAKR,aAAA,EAAAA,EAAKS,SAAS,OAEnB,SAASC,EAAsBC,GAC7B,MAAMC,EAAQC,MAAMC,QAAQH,GAAiBA,EAAc,GAAKA,EAChE,OAAOJ,OAAOQ,uBAAsB,KAClCZ,EAAkB,CAAEQ,cAAeC,GAAQ,GAE/C,CAEA,IAAII,EAAkC,KAEtC,MAAMC,EAAiB,IAAIT,gBAAeU,UACxC,MAAMC,EAAQD,EAAQ,GACtB,GAAIC,GAASA,EAAMR,cAGjB,GAAKE,MAAMC,QAAQK,EAAMR,eAElB,CAELK,EAAmBN,EADIS,EAAMR,cAAc,GAE5C,MAJCK,EAAmBN,EAAsBS,EAAMR,mBAK5C,KAAIQ,EAAMC,YAKf,OAL4B,CAE5B,MAAMT,EAAgB,CAAEU,UAAWF,EAAMC,YAAYE,OAAQC,YAA8B,QAAlBC,EAAAL,aAAK,EAALA,EAAOC,mBAAW,IAAAI,OAAA,EAAAA,EAAEC,QAAS,GACtGT,EAAmBN,EAAsBC,EAC1C,CAEA,KAKH,OAFAM,EAAeS,QAAQ1B,aAAG,EAAHA,EAAKS,SAErB,KACgB,IAAjBP,GACFC,EAAkBwB,SAGhBX,GACFT,OAAOqB,qBAAqBZ,GAG9BC,EAAeY,YAAY,CAC5B,GAEA,CAAC7B,eAAAA,EAAKS,QAASR,EAAUC,EAAcC,GAC5C"}
+{"version":3,"file":"index.js","sources":["../../src/useResizeObserver/index.ts"],"sourcesContent":["import { type RefObject, useCallback, useEffect } from \"react\";\nimport { debounce } from \"es-toolkit\";\n\ntype ResizeCallback = ({ borderBoxSize }: { borderBoxSize: ResizeObserverSize }) => void;\n\nexport default function useResizeObserver({\n  ref,\n  callback,\n  debounceTime = 200\n}: {\n  ref: RefObject<HTMLElement>;\n  callback: ResizeCallback;\n  debounceTime?: number;\n}) {\n  const debouncedCallback = useCallback(debounce<ResizeCallback>(callback, debounceTime), [callback, debounceTime]);\n\n  useEffect(() => {\n    if (!window.ResizeObserver) {\n      return;\n    }\n    if (!ref?.current) return;\n\n    function borderBoxSizeCallback(borderBoxSize: ResizeObserverSize | ReadonlyArray<ResizeObserverSize>): number {\n      const value = Array.isArray(borderBoxSize) ? borderBoxSize[0] : borderBoxSize;\n      return window.requestAnimationFrame(() => {\n        debouncedCallback({ borderBoxSize: value });\n      });\n    }\n\n    let animationFrameId: number | null = null;\n\n    const resizeObserver = new ResizeObserver(entries => {\n      const entry = entries[0];\n      if (entry && entry.borderBoxSize) {\n        // handle chrome (entry.borderBoxSize[0])\n        // handle ff (entry.borderBoxSize)\n        if (!Array.isArray(entry.borderBoxSize)) {\n          animationFrameId = borderBoxSizeCallback(entry.borderBoxSize);\n        } else {\n          const borderBoxEntry = entry.borderBoxSize[0];\n          animationFrameId = borderBoxSizeCallback(borderBoxEntry);\n        }\n      } else if (entry.contentRect) {\n        // handle safari (entry.contentRect)\n        const borderBoxSize = { blockSize: entry.contentRect.height, inlineSize: entry?.contentRect?.width || 0 };\n        animationFrameId = borderBoxSizeCallback(borderBoxSize);\n      } else {\n        return;\n      }\n    });\n\n    resizeObserver.observe(ref?.current);\n\n    return () => {\n      if (debounceTime !== 0) {\n        debouncedCallback.cancel();\n      }\n\n      if (animationFrameId) {\n        window.cancelAnimationFrame(animationFrameId);\n      }\n\n      resizeObserver.disconnect();\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [ref?.current, callback, debounceTime, debouncedCallback]);\n}\n"],"names":["useResizeObserver","ref","callback","debounceTime","debouncedCallback","useCallback","debounce","useEffect","window","ResizeObserver","current","borderBoxSizeCallback","borderBoxSize","value","Array","isArray","requestAnimationFrame","animationFrameId","resizeObserver","entries","entry","contentRect","blockSize","height","inlineSize","_a","width","observe","cancel","cancelAnimationFrame","disconnect"],"mappings":"yFAKwB,SAAAA,GAAkBC,IACxCA,EAAGC,SACHA,EAAQC,aACRA,EAAe,MAMf,MAAMC,EAAoBC,EAAYC,EAAyBJ,EAAUC,GAAe,CAACD,EAAUC,IAEnGI,GAAU,KACR,IAAKC,OAAOC,eACV,OAEF,KAAKR,aAAA,EAAAA,EAAKS,SAAS,OAEnB,SAASC,EAAsBC,GAC7B,MAAMC,EAAQC,MAAMC,QAAQH,GAAiBA,EAAc,GAAKA,EAChE,OAAOJ,OAAOQ,uBAAsB,KAClCZ,EAAkB,CAAEQ,cAAeC,GAAQ,GAE/C,CAEA,IAAII,EAAkC,KAEtC,MAAMC,EAAiB,IAAIT,gBAAeU,UACxC,MAAMC,EAAQD,EAAQ,GACtB,GAAIC,GAASA,EAAMR,cAGjB,GAAKE,MAAMC,QAAQK,EAAMR,eAElB,CAELK,EAAmBN,EADIS,EAAMR,cAAc,GAE7C,MAJEK,EAAmBN,EAAsBS,EAAMR,mBAK5C,KAAIQ,EAAMC,YAKf,OAL4B,CAE5B,MAAMT,EAAgB,CAAEU,UAAWF,EAAMC,YAAYE,OAAQC,YAA8B,QAAlBC,EAAAL,aAAK,EAALA,EAAOC,mBAAW,IAAAI,OAAA,EAAAA,EAAEC,QAAS,GACtGT,EAAmBN,EAAsBC,EAC3C,CAEA,KAKF,OAFAM,EAAeS,QAAQ1B,aAAG,EAAHA,EAAKS,SAErB,KACgB,IAAjBP,GACFC,EAAkBwB,SAGhBX,GACFT,OAAOqB,qBAAqBZ,GAG9BC,EAAeY,YAAY,CAC5B,GAEA,CAAC7B,eAAAA,EAAKS,QAASR,EAAUC,EAAcC,GAC5C"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vibe/hooks",
-  "version": "4.0.0-alpha.1",
+  "version": "4.0.0-alpha.2",
   "description": "Vibe sub-package for React hooks",
   "repository": {
     "type": "git",
@@ -33,7 +33,7 @@
     "lint": "eslint \"./src/**/*.{js,jsx,ts,tsx}\""
   },
   "dependencies": {
-    "@vibe/shared": "^4.0.0-alpha.1",
+    "@vibe/shared": "^4.0.0-alpha.2",
     "classnames": "^2.5.1",
     "es-toolkit": "^1.39.10"
   },
@@ -41,11 +41,11 @@
     "@testing-library/react": "^12.1.2",
     "@testing-library/react-hooks": "^7.0.2",
     "@testing-library/user-event": "^13.5.0",
-    "@vibe/config": "^4.0.0-alpha.1",
+    "@vibe/config": "^4.0.0-alpha.2",
     "react": "^16.13.0",
     "react-dom": "^16.13.0",
     "react-test-renderer": "16",
-    "typescript": "^4.7.3",
+    "typescript": "^5.9.3",
     "vitest": "^1.6.0"
   },
   "peerDependencies": {
@@ -63,5 +63,5 @@
       "../../node_modules/@vibe/config/.eslintrc.cjs"
     ]
   },
-  "gitHead": "f305f32bdfb00f167f742efbfab14414fa23a167"
+  "gitHead": "8c8df239f258a1ae3f81c1dff9304693fe466ab0"
 }