@zag-js/remove-scroll 1.6.1 → 1.7.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/dist/index.js +5 -31
  2. package/dist/index.mjs +6 -32
  3. package/package.json +2 -2
package/dist/index.js CHANGED
@@ -4,32 +4,6 @@ var domQuery = require('@zag-js/dom-query');
4
4
 
5
5
  // src/index.ts
6
6
  var LOCK_CLASSNAME = "data-scroll-lock";
7
- function assignStyle(el, style) {
8
- if (!el) return;
9
- const previousStyle = Object.keys(style).reduce(
10
- (acc, key) => {
11
- acc[key] = el.style.getPropertyValue(key);
12
- return acc;
13
- },
14
- {}
15
- );
16
- Object.assign(el.style, style);
17
- return () => {
18
- Object.assign(el.style, previousStyle);
19
- };
20
- }
21
- function setCSSProperty(el, property, value) {
22
- if (!el) return;
23
- const previousValue = el.style.getPropertyValue(property);
24
- el.style.setProperty(property, value);
25
- return () => {
26
- if (previousValue) {
27
- el.style.setProperty(property, previousValue);
28
- } else {
29
- el.style.removeProperty(property);
30
- }
31
- };
32
- }
33
7
  function getPaddingProperty(documentElement) {
34
8
  const documentLeft = documentElement.getBoundingClientRect().left;
35
9
  const scrollbarX = Math.round(documentLeft) + documentElement.scrollLeft;
@@ -43,17 +17,17 @@ function preventBodyScroll(_document) {
43
17
  if (locked) return;
44
18
  body.setAttribute(LOCK_CLASSNAME, "");
45
19
  const scrollbarWidth = win.innerWidth - documentElement.clientWidth;
46
- const setScrollbarWidthProperty = () => setCSSProperty(documentElement, "--scrollbar-width", `${scrollbarWidth}px`);
20
+ const setScrollbarWidthProperty = () => domQuery.setStyleProperty(documentElement, "--scrollbar-width", `${scrollbarWidth}px`);
47
21
  const paddingProperty = getPaddingProperty(documentElement);
48
- const setStyle = () => assignStyle(body, {
22
+ const setBodyStyle = () => domQuery.setStyle(body, {
49
23
  overflow: "hidden",
50
24
  [paddingProperty]: `${scrollbarWidth}px`
51
25
  });
52
- const setIOSStyle = () => {
26
+ const setBodyStyleIOS = () => {
53
27
  const { scrollX, scrollY, visualViewport } = win;
54
28
  const offsetLeft = visualViewport?.offsetLeft ?? 0;
55
29
  const offsetTop = visualViewport?.offsetTop ?? 0;
56
- const restoreStyle = assignStyle(body, {
30
+ const restoreStyle = domQuery.setStyle(body, {
57
31
  position: "fixed",
58
32
  overflow: "hidden",
59
33
  top: `${-(scrollY - Math.floor(offsetTop))}px`,
@@ -66,7 +40,7 @@ function preventBodyScroll(_document) {
66
40
  win.scrollTo({ left: scrollX, top: scrollY, behavior: "instant" });
67
41
  };
68
42
  };
69
- const cleanups = [setScrollbarWidthProperty(), domQuery.isIos() ? setIOSStyle() : setStyle()];
43
+ const cleanups = [setScrollbarWidthProperty(), domQuery.isIos() ? setBodyStyleIOS() : setBodyStyle()];
70
44
  return () => {
71
45
  cleanups.forEach((fn) => fn?.());
72
46
  body.removeAttribute(LOCK_CLASSNAME);
package/dist/index.mjs CHANGED
@@ -1,33 +1,7 @@
1
- import { isIos } from '@zag-js/dom-query';
1
+ import { setStyleProperty, setStyle, isIos } from '@zag-js/dom-query';
2
2
 
3
3
  // src/index.ts
4
4
  var LOCK_CLASSNAME = "data-scroll-lock";
5
- function assignStyle(el, style) {
6
- if (!el) return;
7
- const previousStyle = Object.keys(style).reduce(
8
- (acc, key) => {
9
- acc[key] = el.style.getPropertyValue(key);
10
- return acc;
11
- },
12
- {}
13
- );
14
- Object.assign(el.style, style);
15
- return () => {
16
- Object.assign(el.style, previousStyle);
17
- };
18
- }
19
- function setCSSProperty(el, property, value) {
20
- if (!el) return;
21
- const previousValue = el.style.getPropertyValue(property);
22
- el.style.setProperty(property, value);
23
- return () => {
24
- if (previousValue) {
25
- el.style.setProperty(property, previousValue);
26
- } else {
27
- el.style.removeProperty(property);
28
- }
29
- };
30
- }
31
5
  function getPaddingProperty(documentElement) {
32
6
  const documentLeft = documentElement.getBoundingClientRect().left;
33
7
  const scrollbarX = Math.round(documentLeft) + documentElement.scrollLeft;
@@ -41,17 +15,17 @@ function preventBodyScroll(_document) {
41
15
  if (locked) return;
42
16
  body.setAttribute(LOCK_CLASSNAME, "");
43
17
  const scrollbarWidth = win.innerWidth - documentElement.clientWidth;
44
- const setScrollbarWidthProperty = () => setCSSProperty(documentElement, "--scrollbar-width", `${scrollbarWidth}px`);
18
+ const setScrollbarWidthProperty = () => setStyleProperty(documentElement, "--scrollbar-width", `${scrollbarWidth}px`);
45
19
  const paddingProperty = getPaddingProperty(documentElement);
46
- const setStyle = () => assignStyle(body, {
20
+ const setBodyStyle = () => setStyle(body, {
47
21
  overflow: "hidden",
48
22
  [paddingProperty]: `${scrollbarWidth}px`
49
23
  });
50
- const setIOSStyle = () => {
24
+ const setBodyStyleIOS = () => {
51
25
  const { scrollX, scrollY, visualViewport } = win;
52
26
  const offsetLeft = visualViewport?.offsetLeft ?? 0;
53
27
  const offsetTop = visualViewport?.offsetTop ?? 0;
54
- const restoreStyle = assignStyle(body, {
28
+ const restoreStyle = setStyle(body, {
55
29
  position: "fixed",
56
30
  overflow: "hidden",
57
31
  top: `${-(scrollY - Math.floor(offsetTop))}px`,
@@ -64,7 +38,7 @@ function preventBodyScroll(_document) {
64
38
  win.scrollTo({ left: scrollX, top: scrollY, behavior: "instant" });
65
39
  };
66
40
  };
67
- const cleanups = [setScrollbarWidthProperty(), isIos() ? setIOSStyle() : setStyle()];
41
+ const cleanups = [setScrollbarWidthProperty(), isIos() ? setBodyStyleIOS() : setBodyStyle()];
68
42
  return () => {
69
43
  cleanups.forEach((fn) => fn?.());
70
44
  body.removeAttribute(LOCK_CLASSNAME);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zag-js/remove-scroll",
3
- "version": "1.6.1",
3
+ "version": "1.7.0",
4
4
  "description": "JavaScript utility to remove scroll on body",
5
5
  "keywords": [
6
6
  "js",
@@ -19,7 +19,7 @@
19
19
  "access": "public"
20
20
  },
21
21
  "dependencies": {
22
- "@zag-js/dom-query": "1.6.1"
22
+ "@zag-js/dom-query": "1.7.0"
23
23
  },
24
24
  "devDependencies": {
25
25
  "clean-package": "2.2.0"