usehooks-ts - npm Package Compare versions

Comparing version 2.15.1 to 2.16.0

dist/index.d.ts

@@ -712,2 +712,4 @@ import { Dispatch, SetStateAction, EffectCallback, RefObject, CSSProperties, useLayoutEffect, DependencyList } from 'react';
     removeOnUnmount?: boolean;
+    /** Script's `id` (optional) */
+    id?: string;
 }
@@ -734,2 +736,3 @@ /**
 interface UseScrollLockResult {
+    isLocked: boolean;
     lock: () => void;
@@ -736,0 +739,0 @@ unlock: () => void;

dist/index.js

@@ -911,2 +911,5 @@ 'use strict';
       scriptNode.async = true;
+      if (options == null ? void 0 : options.id) {
+        scriptNode.id = options.id;
+      }
       scriptNode.setAttribute("data-status", "loading");
@@ -940,3 +943,3 @@ document.body.appendChild(scriptNode);
     };
-  }, [src, options == null ? void 0 : options.shouldPreventLoad, options == null ? void 0 : options.removeOnUnmount]);
+  }, [src, options == null ? void 0 : options.shouldPreventLoad, options == null ? void 0 : options.removeOnUnmount, options == null ? void 0 : options.id]);
   return status;
@@ -947,2 +950,3 @@ }
   const { autoLock = true, lockTarget, widthReflow = true } = options;
+  const [isLocked, setIsLocked] = react.useState(false);
   const target = react.useRef(null);
@@ -952,9 +956,12 @@ const originalStyle = react.useRef(null);
     if (target.current) {
-      const { overflow, paddingRight } = window.getComputedStyle(target.current);
+      const { overflow, paddingRight } = target.current.style;
       originalStyle.current = { overflow, paddingRight };
-      target.current.style.overflow = "hidden";
       if (widthReflow) {
-        const scrollbarWidth = target.current.offsetWidth - target.current.scrollWidth;
-        target.current.style.paddingRight = `${scrollbarWidth}px`;
+        const offsetWidth = target.current === document.body ? window.innerWidth : target.current.offsetWidth;
+        const currentPaddingRight = parseInt(window.getComputedStyle(target.current).paddingRight, 10) || 0;
+        const scrollbarWidth = offsetWidth - target.current.scrollWidth;
+        target.current.style.paddingRight = `${scrollbarWidth + currentPaddingRight}px`;
       }
+      target.current.style.overflow = "hidden";
+      setIsLocked(true);
     }
@@ -965,6 +972,9 @@ };
       target.current.style.overflow = originalStyle.current.overflow;
-      target.current.style.paddingRight = originalStyle.current.paddingRight;
+      if (widthReflow) {
+        target.current.style.paddingRight = originalStyle.current.paddingRight;
+      }
     }
+    setIsLocked(false);
   };
-  react.useLayoutEffect(() => {
+  useIsomorphicLayoutEffect(() => {
     if (IS_SERVER5)
@@ -985,3 +995,3 @@ return;
   }, [autoLock, lockTarget, widthReflow]);
-  return { lock, unlock };
+  return { isLocked, lock, unlock };
 }
@@ -988,0 +998,0 @@ var IS_SERVER6 = typeof window === "undefined";

package.json

 {
   "name": "usehooks-ts",
   "private": false,
-  "version": "2.15.1",
+  "version": "2.16.0",
   "description": "React hook library, ready to use, written in Typescript.",
@@ -32,3 +32,3 @@ "author": "Julien CARON <[e-mail]>",
     "@types/node": "^20.11.19",
-    "@types/react": "18.2.57",
+    "@types/react": "18.2.61",
     "date-fns": "^3.3.1",
@@ -35,0 +35,0 @@ "eslint-plugin-jsdoc": "^48.1.0",

No alert changes

Improved metrics

Total package byte prevSize

219843

1.25%

Lines of code

3342

0.69%

Number of lines in readme file

446

1.36%

No dependency changes