@zag-js/remove-scroll 2.0.0-next.0 → 2.0.0-next.1

package/dist/index.js

@@ -36,22 +36,27 @@ function hasStableScrollbarGutter(element) {
   const scrollbarGutter = styles?.scrollbarGutter;
   return scrollbarGutter === "stable" || scrollbarGutter?.startsWith("stable ") === true;
 }
+function getScrollContainer(doc) {
+  const { documentElement, body } = doc;
+  return (0, import_dom_query.isOverflowElement)(documentElement) ? documentElement : body;
+}
 function applyLock(doc) {
   const win = doc.defaultView ?? window;
   const { documentElement, body } = doc;
+  const scroller = getScrollContainer(doc);
   const hasStableGutter = hasStableScrollbarGutter(documentElement) || hasStableScrollbarGutter(body);
   const scrollbarWidth = win.innerWidth - documentElement.clientWidth;
   body.setAttribute(LOCK_CLASSNAME, "");
   const setScrollbarWidthProperty = () => (0, import_dom_query.setStyleProperty)(documentElement, "--scrollbar-width", `${scrollbarWidth}px`);
   const paddingProperty = getPaddingProperty(documentElement);
-  const setBodyStyle = () => {
+  const setScrollerStyle = () => {
     const styles = {
       overflow: "hidden"
     };
     if (!hasStableGutter && scrollbarWidth > 0) {
       styles[paddingProperty] = `${scrollbarWidth}px`;
     }
-    return (0, import_dom_query.setStyle)(body, styles);
+    return (0, import_dom_query.setStyle)(scroller, styles);
   };
   const setBodyStyleIOS = () => {
     const { scrollX, scrollY, visualViewport } = win;
@@ -73,7 +78,7 @@ function applyLock(doc) {
       win.scrollTo({ left: scrollX, top: scrollY, behavior: "instant" });
     };
   };
-  const cleanups = [setScrollbarWidthProperty(), (0, import_dom_query.isIos)() ? setBodyStyleIOS() : setBodyStyle()];
+  const cleanups = [setScrollbarWidthProperty(), (0, import_dom_query.isIos)() ? setBodyStyleIOS() : setScrollerStyle()];
   return () => {
     cleanups.forEach((fn) => fn?.());
     body.removeAttribute(LOCK_CLASSNAME);

package/dist/index.mjs

@@ -1,5 +1,5 @@
 // src/index.ts
-import { getComputedStyle, isIos, setStyleProperty, setStyle } from "@zag-js/dom-query";
+import { getComputedStyle, isIos, isOverflowElement, setStyleProperty, setStyle } from "@zag-js/dom-query";
 var LOCK_CLASSNAME = "data-scroll-lock";
 var lockMap = /* @__PURE__ */ new WeakMap();
 function getPaddingProperty(documentElement) {
@@ -12,22 +12,27 @@ function hasStableScrollbarGutter(element) {
   const scrollbarGutter = styles?.scrollbarGutter;
   return scrollbarGutter === "stable" || scrollbarGutter?.startsWith("stable ") === true;
 }
+function getScrollContainer(doc) {
+  const { documentElement, body } = doc;
+  return isOverflowElement(documentElement) ? documentElement : body;
+}
 function applyLock(doc) {
   const win = doc.defaultView ?? window;
   const { documentElement, body } = doc;
+  const scroller = getScrollContainer(doc);
   const hasStableGutter = hasStableScrollbarGutter(documentElement) || hasStableScrollbarGutter(body);
   const scrollbarWidth = win.innerWidth - documentElement.clientWidth;
   body.setAttribute(LOCK_CLASSNAME, "");
   const setScrollbarWidthProperty = () => setStyleProperty(documentElement, "--scrollbar-width", `${scrollbarWidth}px`);
   const paddingProperty = getPaddingProperty(documentElement);
-  const setBodyStyle = () => {
+  const setScrollerStyle = () => {
     const styles = {
       overflow: "hidden"
     };
     if (!hasStableGutter && scrollbarWidth > 0) {
       styles[paddingProperty] = `${scrollbarWidth}px`;
     }
-    return setStyle(body, styles);
+    return setStyle(scroller, styles);
   };
   const setBodyStyleIOS = () => {
     const { scrollX, scrollY, visualViewport } = win;
@@ -49,7 +54,7 @@ function applyLock(doc) {
       win.scrollTo({ left: scrollX, top: scrollY, behavior: "instant" });
     };
   };
-  const cleanups = [setScrollbarWidthProperty(), isIos() ? setBodyStyleIOS() : setBodyStyle()];
+  const cleanups = [setScrollbarWidthProperty(), isIos() ? setBodyStyleIOS() : setScrollerStyle()];
   return () => {
     cleanups.forEach((fn) => fn?.());
     body.removeAttribute(LOCK_CLASSNAME);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zag-js/remove-scroll",
-  "version": "2.0.0-next.0",
+  "version": "2.0.0-next.1",
   "description": "JavaScript utility to remove scroll on body",
   "keywords": [
     "js",
@@ -10,7 +10,10 @@
   "author": "Segun Adebayo <sage@adebayosegun.com>",
   "homepage": "https://github.com/chakra-ui/zag#readme",
   "license": "MIT",
-  "repository": "https://github.com/chakra-ui/zag/tree/main/packages/utilities/remove-scroll",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/chakra-ui/zag/tree/main/packages/utilities/remove-scroll"
+  },
   "sideEffects": false,
   "files": [
     "dist"
@@ -19,7 +22,7 @@
     "access": "public"
   },
   "dependencies": {
-    "@zag-js/dom-query": "2.0.0-next.0"
+    "@zag-js/dom-query": "2.0.0-next.1"
   },
   "devDependencies": {
     "clean-package": "2.2.0"