@tapizlabs/ui 0.2.27 → 0.2.28

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.
package/dist/index.js CHANGED
@@ -2782,12 +2782,23 @@ import { createPortal as createPortal5 } from "react-dom";
2782
2782
  var lockCount = 0;
2783
2783
  var originalHtmlOverflow = "";
2784
2784
  var originalBodyOverflow = "";
2785
+ var originalBodyPaddingRight = "";
2786
+ var SCROLLBAR_VAR = "--tapiz-scrollbar-comp";
2785
2787
  function acquireBodyScrollLock() {
2786
2788
  if (lockCount === 0) {
2789
+ const scrollbarWidth = window.innerWidth - document.documentElement.clientWidth;
2787
2790
  originalHtmlOverflow = document.documentElement.style.overflow;
2788
2791
  originalBodyOverflow = document.body.style.overflow;
2792
+ originalBodyPaddingRight = document.body.style.paddingRight;
2789
2793
  document.documentElement.style.overflow = "hidden";
2790
2794
  document.body.style.overflow = "hidden";
2795
+ if (scrollbarWidth > 0) {
2796
+ const currentPadding = Number.parseFloat(window.getComputedStyle(document.body).paddingRight) || 0;
2797
+ document.body.style.paddingRight = `${currentPadding + scrollbarWidth}px`;
2798
+ document.documentElement.style.setProperty(SCROLLBAR_VAR, `${scrollbarWidth}px`);
2799
+ } else {
2800
+ document.documentElement.style.setProperty(SCROLLBAR_VAR, "0px");
2801
+ }
2791
2802
  }
2792
2803
  lockCount += 1;
2793
2804
  return () => {
@@ -2795,8 +2806,11 @@ function acquireBodyScrollLock() {
2795
2806
  if (lockCount === 0) {
2796
2807
  document.documentElement.style.overflow = originalHtmlOverflow;
2797
2808
  document.body.style.overflow = originalBodyOverflow;
2809
+ document.body.style.paddingRight = originalBodyPaddingRight;
2810
+ document.documentElement.style.removeProperty(SCROLLBAR_VAR);
2798
2811
  originalHtmlOverflow = "";
2799
2812
  originalBodyOverflow = "";
2813
+ originalBodyPaddingRight = "";
2800
2814
  }
2801
2815
  };
2802
2816
  }