@razorpay/blade 10.19.1 → 10.20.0

package/build/components/index.d.ts

@@ -3134,6 +3134,7 @@ declare type BaseTextProps = {
     fontStyle?: 'italic' | 'normal';
     textDecorationLine?: 'line-through' | 'none' | 'underline';
     lineHeight?: keyof Theme['typography']['lineHeights'];
+    wordBreak?: 'normal' | 'break-all' | 'keep-all' | 'break-word';
     /**
      * Web only
      */
@@ -3493,6 +3494,7 @@ declare type TextCommonProps = {
     color?: BaseTextProps['color'];
     textAlign?: BaseTextProps['textAlign'];
     textDecorationLine?: BaseTextProps['textDecorationLine'];
+    wordBreak?: BaseTextProps['wordBreak'];
 } & TestID & StyledPropsBlade;
 declare type TextVariant = 'body' | 'caption';
 declare type TextBodyVariant = TextCommonProps & {
@@ -3519,7 +3521,7 @@ declare const getTextProps: <T extends {
 }>({ variant, type, weight, size, color, contrast, testID, textAlign, textDecorationLine, }: GetTextProps<T>) => GetTextPropsReturn;
 declare const Text: <T extends {
     variant: TextVariant;
-}>({ as, variant, weight, size, type, contrast, truncateAfterLines, children, color, testID, textAlign, textDecorationLine, ...styledProps }: TextProps<T>) => ReactElement;
+}>({ as, variant, weight, size, type, contrast, truncateAfterLines, children, color, testID, textAlign, textDecorationLine, wordBreak, ...styledProps }: TextProps<T>) => ReactElement;
 
 declare type CodeCommonProps = {
     /**

package/build/components/index.development.web.js

@@ -2,11 +2,11 @@ import _defineProperty$1 from '@babel/runtime/helpers/defineProperty';
 import * as React from 'react';
 import React__default, { useMemo, useCallback, useState, useRef, useEffect, useContext, createContext, Fragment as Fragment$1, useImperativeHandle, forwardRef, Children, cloneElement } from 'react';
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import styled, { ThemeProvider, css as css$1, keyframes } from 'styled-components';
+import styled, { ThemeProvider, StyleSheetManager, css as css$1, keyframes } from 'styled-components';
 import _objectWithoutProperties$1 from '@babel/runtime/helpers/objectWithoutProperties';
 import { FloatingDelayGroup, useFloating, offset, flip, size as size$1, autoUpdate, useTransitionStyles, FloatingOverlay, FloatingPortal, FloatingFocusManager, CompositeItem, Composite, FloatingArrow, shift, arrow, useDelayGroup, useDelayGroupContext, useHover, useFocus, useRole, useInteractions, useClick, useDismiss } from '@floating-ui/react';
 import _typeof from '@babel/runtime/helpers/typeof';
-import _toConsumableArray$1 from '@babel/runtime/helpers/toConsumableArray';
+import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
 import { jsx as jsx$1, jsxs, Fragment } from 'react/jsx-runtime';
 import _classCallCheck from '@babel/runtime/helpers/classCallCheck';
 import _createClass from '@babel/runtime/helpers/createClass';
@@ -3089,6 +3089,16 @@ var getBaseBoxStyles = function getBaseBoxStyles(props) {
   return _objectSpread$6y(_objectSpread$6y({}, getAllProps(props)), getAllMediaQueries(props));
 };
 
+function createStylisCSSHigherSpecificityPlugin() {
+  var stylisCSSHigherSpecificity = function stylisCSSHigherSpecificity(context, _, selectors) {
+    if (context !== -1) return;
+    var _selectors = _slicedToArray(selectors, 1),
+      selector = _selectors[0];
+    selectors[0] = "".concat(selector.repeat(5));
+  };
+  return stylisCSSHigherSpecificity;
+}
+
 function ownKeys$6y(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread$6x(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$6y(Object(source), !0).forEach(function (key) { _defineProperty$1(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$6y(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 /**
@@ -3162,12 +3172,12 @@ var BottomSheetStackProvider = function BottomSheetStackProvider(_ref) {
   }, [stack]);
   var addBottomSheetToStack = React__default.useCallback(function (id) {
     setStack(function (prev) {
-      return [id].concat(_toConsumableArray$1(prev));
+      return [id].concat(_toConsumableArray(prev));
     });
   }, []);
   var removeBottomSheetFromStack = React__default.useCallback(function (id) {
     setStack(function (prev) {
-      var newStack = _toConsumableArray$1(prev);
+      var newStack = _toConsumableArray(prev);
       var popped = newStack.shift();
       // only pop the stack if the passed in id is matched to the top of the stack
       if (popped === id) return newStack;
@@ -3218,8 +3228,11 @@ var BladeProvider = function BladeProvider(_ref) {
       delay: tooltipDelays,
       children: /*#__PURE__*/jsx$1(ThemeProvider, {
         theme: theme,
-        children: /*#__PURE__*/jsx$1(BottomSheetStackProvider, {
-          children: children
+        children: /*#__PURE__*/jsx$1(StyleSheetManager, {
+          stylisPlugins: [createStylisCSSHigherSpecificityPlugin()],
+          children: /*#__PURE__*/jsx$1(BottomSheetStackProvider, {
+            children: children
+          })
         })
       })
     })
@@ -13013,6 +13026,7 @@ var getBaseTextStyles = function getBaseTextStyles(_ref) {
     _ref$textDecorationLi = _ref.textDecorationLine,
     textDecorationLine = _ref$textDecorationLi === void 0 ? 'none' : _ref$textDecorationLi,
     numberOfLines = _ref.numberOfLines,
+    wordBreak = _ref.wordBreak,
     _ref$lineHeight = _ref.lineHeight,
     lineHeight = _ref$lineHeight === void 0 ? 100 : _ref$lineHeight,
     textAlign = _ref.textAlign,
@@ -13023,6 +13037,7 @@ var getBaseTextStyles = function getBaseTextStyles(_ref) {
   var themeFontWeight = theme.typography.fonts.weight[fontWeight];
   var themeLineHeight = makeTypographySize(theme.typography.lineHeights[lineHeight]);
   var truncateStyles = {};
+  var wordBreakStyles = {};
   if (numberOfLines !== undefined) {
     if (isReactNative$4()) {
       truncateStyles = {};
@@ -13036,7 +13051,16 @@ var getBaseTextStyles = function getBaseTextStyles(_ref) {
       };
     }
   }
-  return _objectSpread$21(_objectSpread$21({
+  if (wordBreak !== undefined) {
+    if (isReactNative$4()) {
+      wordBreakStyles = {};
+    } else {
+      wordBreakStyles = {
+        wordBreak: wordBreak
+      };
+    }
+  }
+  return _objectSpread$21(_objectSpread$21(_objectSpread$21({
     color: textColor,
     fontFamily: themeFontFamily,
     fontSize: themeFontSize,
@@ -13050,11 +13074,11 @@ var getBaseTextStyles = function getBaseTextStyles(_ref) {
     textAlign: textAlign,
     margin: 0,
     padding: 0
-  }, truncateStyles);
+  }, truncateStyles), wordBreakStyles);
 };
 
-var _excluded$R = ["color", "fontFamily", "fontSize", "fontWeight", "fontStyle", "textDecorationLine", "numberOfLines", "lineHeight", "textAlign"],
-  _excluded2$1 = ["id", "color", "fontFamily", "fontSize", "fontWeight", "fontStyle", "textDecorationLine", "lineHeight", "as", "textAlign", "children", "truncateAfterLines", "className", "style", "accessibilityProps", "componentName", "testID"];
+var _excluded$R = ["color", "fontFamily", "fontSize", "fontWeight", "fontStyle", "textDecorationLine", "numberOfLines", "lineHeight", "textAlign", "wordBreak"],
+  _excluded2$1 = ["id", "color", "fontFamily", "fontSize", "fontWeight", "fontStyle", "textDecorationLine", "lineHeight", "as", "textAlign", "children", "truncateAfterLines", "wordBreak", "className", "style", "accessibilityProps", "componentName", "testID"];
 function ownKeys$21(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread$20(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$21(Object(source), !0).forEach(function (key) { _defineProperty$1(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$21(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var StyledBaseText = /*#__PURE__*/styled.div.withConfig({
@@ -13070,6 +13094,7 @@ var StyledBaseText = /*#__PURE__*/styled.div.withConfig({
     numberOfLines = _ref.numberOfLines,
     lineHeight = _ref.lineHeight,
     textAlign = _ref.textAlign,
+    wordBreak = _ref.wordBreak,
     props = _objectWithoutProperties$1(_ref, _excluded$R);
   var styledPropsCSSObject = useStyledProps(props);
   return _objectSpread$20(_objectSpread$20({}, getBaseTextStyles({
@@ -13082,6 +13107,7 @@ var StyledBaseText = /*#__PURE__*/styled.div.withConfig({
     numberOfLines: numberOfLines,
     lineHeight: lineHeight,
     textAlign: textAlign,
+    wordBreak: wordBreak,
     theme: props.theme
   })), styledPropsCSSObject);
 });
@@ -13098,6 +13124,7 @@ var BaseText = function BaseText(_ref2) {
     textAlign = _ref2.textAlign,
     children = _ref2.children,
     truncateAfterLines = _ref2.truncateAfterLines,
+    wordBreak = _ref2.wordBreak,
     className = _ref2.className,
     style = _ref2.style,
     _ref2$accessibilityPr = _ref2.accessibilityProps,
@@ -13117,6 +13144,7 @@ var BaseText = function BaseText(_ref2) {
     as: as,
     textAlign: textAlign,
     numberOfLines: truncateAfterLines,
+    wordBreak: wordBreak,
     className: className,
     style: style,
     id: id
@@ -13338,7 +13366,7 @@ var Heading = function Heading(_ref2) {
   }));
 };
 
-var _excluded$O = ["as", "variant", "weight", "size", "type", "contrast", "truncateAfterLines", "children", "color", "testID", "textAlign", "textDecorationLine"];
+var _excluded$O = ["as", "variant", "weight", "size", "type", "contrast", "truncateAfterLines", "children", "color", "testID", "textAlign", "textDecorationLine", "wordBreak"];
 function ownKeys$1_(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread$1Z(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$1_(Object(source), !0).forEach(function (key) { _defineProperty$1(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$1_(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var validAsValues$1 = ['p', 'span', 'div', 'abbr', 'figcaption', 'cite', 'q'];
@@ -13422,10 +13450,12 @@ var _Text = function _Text(_ref2) {
     testID = _ref2.testID,
     textAlign = _ref2.textAlign,
     textDecorationLine = _ref2.textDecorationLine,
+    wordBreak = _ref2.wordBreak,
     styledProps = _objectWithoutProperties$1(_ref2, _excluded$O);
   var props = _objectSpread$1Z({
     as: as,
-    truncateAfterLines: truncateAfterLines
+    truncateAfterLines: truncateAfterLines,
+    wordBreak: wordBreak
   }, getTextProps({
     variant: variant,
     type: type,
@@ -13774,7 +13804,7 @@ function getActionFromKey(e, isOpen, dropdownTriggerer) {
  **/
 function getIndexByLetter(options, filter) {
   var startIndex = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
-  var orderedOptions = [].concat(_toConsumableArray$1(options.slice(startIndex)), _toConsumableArray$1(options.slice(0, startIndex)));
+  var orderedOptions = [].concat(_toConsumableArray(options.slice(startIndex)), _toConsumableArray(options.slice(0, startIndex)));
   var firstMatch = filterOptions(orderedOptions, filter)[0];
   var allSameLetter = function allSameLetter(array) {
     return array.every(function (letter) {
@@ -14036,7 +14066,7 @@ var useDropdown = function useDropdown() {
     if (existingItemIndex < 0) {
       return;
     }
-    setIndices([].concat(_toConsumableArray$1(selectedIndices.slice(0, existingItemIndex)), _toConsumableArray$1(selectedIndices.slice(existingItemIndex + 1))));
+    setIndices([].concat(_toConsumableArray(selectedIndices.slice(0, existingItemIndex)), _toConsumableArray(selectedIndices.slice(existingItemIndex + 1))));
   };
 
   /**
@@ -14058,7 +14088,7 @@ var useDropdown = function useDropdown() {
         removeOption(index);
         isSelected = false;
       } else {
-        setIndices([].concat(_toConsumableArray$1(selectedIndices), [index]));
+        setIndices([].concat(_toConsumableArray(selectedIndices), [index]));
         isSelected = true;
       }
     } else {
@@ -15147,6 +15177,7 @@ var FormLabel = function FormLabel(_ref) {
       size: isLabelLeftPositioned ? 'medium' : 'small',
       truncateAfterLines: 2,
       weight: "bold",
+      wordBreak: isLabelLeftPositioned ? 'break-word' : undefined,
       children: children
     }), computedAccessibilityNode, necessityLabel]
   });
@@ -32769,7 +32800,7 @@ var _TableRow = function _TableRow(_ref8) {
   useEffect(function () {
     if (isDisabled) {
       setDisabledRows(function (prev) {
-        return [].concat(_toConsumableArray$1(prev), [item.id]);
+        return [].concat(_toConsumableArray(prev), [item.id]);
       });
     }
   }, [isDisabled, item.id, setDisabledRows]);
@@ -35424,281 +35455,237 @@ function useDrag(handler, config) {
   }, config || {}, 'drag');
 }
 
-function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } else { return Array.from(arr); } }
-
-// Older browsers don't support event options, feature detect it.
-
-// Adopted and modified solution from Bohdan Didukh (2017)
-// https://stackoverflow.com/questions/41594997/ios-10-safari-prevent-scrolling-behind-a-fixed-overlay-and-maintain-scroll-posi
-
-var hasPassiveEvents = false;
-if (typeof window !== 'undefined') {
-  var passiveTestOptions = {
+/**
+ * name: body-scroll-lock-upgrade
+ * version: v1.1.0
+ * author: Rick.li
+ */
+let hasPassiveEvents = false;
+if (typeof window !== "undefined") {
+  const passiveTestOptions = {
     get passive() {
       hasPassiveEvents = true;
-      return undefined;
+      return void 0;
     }
   };
-  window.addEventListener('testPassive', null, passiveTestOptions);
-  window.removeEventListener('testPassive', null, passiveTestOptions);
+  window.addEventListener("testPassive", null, passiveTestOptions);
+  window.removeEventListener("testPassive", null, passiveTestOptions);
 }
-
-var isIosDevice = typeof window !== 'undefined' && window.navigator && window.navigator.platform && (/iP(ad|hone|od)/.test(window.navigator.platform) || window.navigator.platform === 'MacIntel' && window.navigator.maxTouchPoints > 1);
-
-
-var locks = [];
-var documentListenerAdded = false;
-var initialClientY = -1;
-var previousBodyOverflowSetting = void 0;
-var previousBodyPosition = void 0;
-var previousBodyPaddingRight = void 0;
-
-// returns true if `el` should be allowed to receive touchmove events.
-var allowTouchMove = function allowTouchMove(el) {
-  return locks.some(function (lock) {
-    if (lock.options.allowTouchMove && lock.options.allowTouchMove(el)) {
-      return true;
-    }
-
-    return false;
-  });
-};
-
-var preventDefault = function preventDefault(rawEvent) {
-  var e = rawEvent || window.event;
-
-  // For the case whereby consumers adds a touchmove event listener to document.
-  // Recall that we do document.addEventListener('touchmove', preventDefault, { passive: false })
-  // in disableBodyScroll - so if we provide this opportunity to allowTouchMove, then
-  // the touchmove event on document will break.
+const isIosDevice = typeof window !== "undefined" && window.navigator && window.navigator.platform && (/iP(ad|hone|od)/.test(window.navigator.platform) || window.navigator.platform === "MacIntel" && window.navigator.maxTouchPoints > 1);
+let locks = [];
+let locksIndex = /* @__PURE__ */ new Map();
+let documentListenerAdded = false;
+let initialClientY = -1;
+let previousBodyOverflowSetting;
+let htmlStyle;
+let bodyStyle;
+let previousBodyPaddingRight;
+const allowTouchMove = (el) => locks.some((lock) => {
+  if (lock.options.allowTouchMove && lock.options.allowTouchMove(el)) {
+    return true;
+  }
+  return false;
+});
+const preventDefault = (rawEvent) => {
+  const e = rawEvent || window.event;
   if (allowTouchMove(e.target)) {
     return true;
   }
-
-  // Do not prevent if the event has more than one touch (usually meaning this is a multi touch gesture like pinch to zoom).
-  if (e.touches.length > 1) return true;
-
-  if (e.preventDefault) e.preventDefault();
-
+  if (e.touches.length > 1)
+    return true;
+  if (e.preventDefault)
+    e.preventDefault();
   return false;
 };
-
-var setOverflowHidden = function setOverflowHidden(options) {
-  // If previousBodyPaddingRight is already set, don't set it again.
-  if (previousBodyPaddingRight === undefined) {
-    var _reserveScrollBarGap = !!options && options.reserveScrollBarGap === true;
-    var scrollBarGap = window.innerWidth - document.documentElement.clientWidth;
-
-    if (_reserveScrollBarGap && scrollBarGap > 0) {
-      var computedBodyPaddingRight = parseInt(window.getComputedStyle(document.body).getPropertyValue('padding-right'), 10);
+const setOverflowHidden = (options) => {
+  if (previousBodyPaddingRight === void 0) {
+    const reserveScrollBarGap = !!options && options.reserveScrollBarGap === true;
+    const scrollBarGap = window.innerWidth - document.documentElement.getBoundingClientRect().width;
+    if (reserveScrollBarGap && scrollBarGap > 0) {
+      const computedBodyPaddingRight = parseInt(
+        window.getComputedStyle(document.body).getPropertyValue("padding-right"),
+        10
+      );
       previousBodyPaddingRight = document.body.style.paddingRight;
-      document.body.style.paddingRight = computedBodyPaddingRight + scrollBarGap + 'px';
+      document.body.style.paddingRight = `${computedBodyPaddingRight + scrollBarGap}px`;
     }
   }
-
-  // If previousBodyOverflowSetting is already set, don't set it again.
-  if (previousBodyOverflowSetting === undefined) {
+  if (previousBodyOverflowSetting === void 0) {
     previousBodyOverflowSetting = document.body.style.overflow;
-    document.body.style.overflow = 'hidden';
+    document.body.style.overflow = "hidden";
   }
 };
-
-var restoreOverflowSetting = function restoreOverflowSetting() {
-  if (previousBodyPaddingRight !== undefined) {
+const restoreOverflowSetting = () => {
+  if (previousBodyPaddingRight !== void 0) {
     document.body.style.paddingRight = previousBodyPaddingRight;
-
-    // Restore previousBodyPaddingRight to undefined so setOverflowHidden knows it
-    // can be set again.
-    previousBodyPaddingRight = undefined;
+    previousBodyPaddingRight = void 0;
   }
-
-  if (previousBodyOverflowSetting !== undefined) {
+  if (previousBodyOverflowSetting !== void 0) {
     document.body.style.overflow = previousBodyOverflowSetting;
-
-    // Restore previousBodyOverflowSetting to undefined
-    // so setOverflowHidden knows it can be set again.
-    previousBodyOverflowSetting = undefined;
+    previousBodyOverflowSetting = void 0;
+  }
+};
+const setPositionFixed = () => window.requestAnimationFrame(() => {
+  const $html = document.documentElement;
+  const $body = document.body;
+  if (bodyStyle === void 0) {
+    htmlStyle = { ...$html.style };
+    bodyStyle = { ...$body.style };
+    const { scrollY, scrollX, innerHeight } = window;
+    $html.style.height = "100%";
+    $html.style.overflow = "hidden";
+    $body.style.position = "fixed";
+    $body.style.top = `${-scrollY}px`;
+    $body.style.left = `${-scrollX}px`;
+    $body.style.width = "100%";
+    $body.style.height = "auto";
+    $body.style.overflow = "hidden";
+    setTimeout(
+      () => window.requestAnimationFrame(() => {
+        const bottomBarHeight = innerHeight - window.innerHeight;
+        if (bottomBarHeight && scrollY >= innerHeight) {
+          $body.style.top = -(scrollY + bottomBarHeight) + "px";
+        }
+      }),
+      300
+    );
   }
-};
-
-var setPositionFixed = function setPositionFixed() {
-  return window.requestAnimationFrame(function () {
-    // If previousBodyPosition is already set, don't set it again.
-    if (previousBodyPosition === undefined) {
-      previousBodyPosition = {
-        position: document.body.style.position,
-        top: document.body.style.top,
-        left: document.body.style.left
-      };
-
-      // Update the dom inside an animation frame 
-      var _window = window,
-          scrollY = _window.scrollY,
-          scrollX = _window.scrollX,
-          innerHeight = _window.innerHeight;
-
-      document.body.style.position = 'fixed';
-      document.body.style.top = -scrollY;
-      document.body.style.left = -scrollX;
-
-      setTimeout(function () {
-        return window.requestAnimationFrame(function () {
-          // Attempt to check if the bottom bar appeared due to the position change
-          var bottomBarHeight = innerHeight - window.innerHeight;
-          if (bottomBarHeight && scrollY >= innerHeight) {
-            // Move the content further up so that the bottom bar doesn't hide it
-            document.body.style.top = -(scrollY + bottomBarHeight);
-          }
-        });
-      }, 300);
-    }
-  });
-};
-
-var restorePositionSetting = function restorePositionSetting() {
-  if (previousBodyPosition !== undefined) {
-    // Convert the position from "px" to Int
-    var y = -parseInt(document.body.style.top, 10);
-    var x = -parseInt(document.body.style.left, 10);
-
-    // Restore styles
-    document.body.style.position = previousBodyPosition.position;
-    document.body.style.top = previousBodyPosition.top;
-    document.body.style.left = previousBodyPosition.left;
-
-    // Restore scroll
+});
+const restorePositionSetting = () => {
+  if (bodyStyle !== void 0) {
+    const y = -parseInt(document.body.style.top, 10);
+    const x = -parseInt(document.body.style.left, 10);
+    const $html = document.documentElement;
+    const $body = document.body;
+    $html.style.height = (htmlStyle == null ? void 0 : htmlStyle.height) || "";
+    $html.style.overflow = (htmlStyle == null ? void 0 : htmlStyle.overflow) || "";
+    $body.style.position = bodyStyle.position || "";
+    $body.style.top = bodyStyle.top || "";
+    $body.style.left = bodyStyle.left || "";
+    $body.style.width = bodyStyle.width || "";
+    $body.style.height = bodyStyle.height || "";
+    $body.style.overflow = bodyStyle.overflow || "";
     window.scrollTo(x, y);
-
-    previousBodyPosition = undefined;
+    bodyStyle = void 0;
   }
 };
-
-// https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollHeight#Problems_and_solutions
-var isTargetElementTotallyScrolled = function isTargetElementTotallyScrolled(targetElement) {
-  return targetElement ? targetElement.scrollHeight - targetElement.scrollTop <= targetElement.clientHeight : false;
-};
-
-var handleScroll = function handleScroll(event, targetElement) {
-  var clientY = event.targetTouches[0].clientY - initialClientY;
-
+const isTargetElementTotallyScrolled = (targetElement) => targetElement ? targetElement.scrollHeight - targetElement.scrollTop <= targetElement.clientHeight : false;
+const handleScroll = (event, targetElement) => {
+  const clientY = event.targetTouches[0].clientY - initialClientY;
   if (allowTouchMove(event.target)) {
     return false;
   }
-
   if (targetElement && targetElement.scrollTop === 0 && clientY > 0) {
-    // element is at the top of its scroll.
     return preventDefault(event);
   }
-
   if (isTargetElementTotallyScrolled(targetElement) && clientY < 0) {
-    // element is at the bottom of its scroll.
     return preventDefault(event);
   }
-
   event.stopPropagation();
   return true;
 };
-
-var disableBodyScroll = function disableBodyScroll(targetElement, options) {
-  // targetElement must be provided
+const disableBodyScroll = (targetElement, options) => {
   if (!targetElement) {
-    // eslint-disable-next-line no-console
-    console.error('disableBodyScroll unsuccessful - targetElement must be provided when calling disableBodyScroll on IOS devices.');
+    console.error(
+      "disableBodyScroll unsuccessful - targetElement must be provided when calling disableBodyScroll on IOS devices."
+    );
     return;
   }
-
-  // disableBodyScroll must not have been called on this targetElement before
-  if (locks.some(function (lock) {
-    return lock.targetElement === targetElement;
-  })) {
+  locksIndex.set(
+    targetElement,
+    (locksIndex == null ? void 0 : locksIndex.get(targetElement)) ? (locksIndex == null ? void 0 : locksIndex.get(targetElement)) + 1 : 1
+  );
+  if (locks.some((lock2) => lock2.targetElement === targetElement)) {
     return;
   }
-
-  var lock = {
-    targetElement: targetElement,
+  const lock = {
+    targetElement,
     options: options || {}
   };
-
-  locks = [].concat(_toConsumableArray(locks), [lock]);
-
+  locks = [...locks, lock];
   if (isIosDevice) {
     setPositionFixed();
   } else {
     setOverflowHidden(options);
   }
-
   if (isIosDevice) {
-    targetElement.ontouchstart = function (event) {
+    targetElement.ontouchstart = (event) => {
       if (event.targetTouches.length === 1) {
-        // detect single touch.
         initialClientY = event.targetTouches[0].clientY;
       }
     };
-    targetElement.ontouchmove = function (event) {
+    targetElement.ontouchmove = (event) => {
       if (event.targetTouches.length === 1) {
-        // detect single touch.
         handleScroll(event, targetElement);
       }
     };
-
     if (!documentListenerAdded) {
-      document.addEventListener('touchmove', preventDefault, hasPassiveEvents ? { passive: false } : undefined);
+      document.addEventListener(
+        "touchmove",
+        preventDefault,
+        hasPassiveEvents ? { passive: false } : void 0
+      );
       documentListenerAdded = true;
     }
   }
 };
-
-var clearAllBodyScrollLocks = function clearAllBodyScrollLocks() {
+const clearAllBodyScrollLocks = () => {
   if (isIosDevice) {
-    // Clear all locks ontouchstart/ontouchmove handlers, and the references.
-    locks.forEach(function (lock) {
+    locks.forEach((lock) => {
       lock.targetElement.ontouchstart = null;
       lock.targetElement.ontouchmove = null;
     });
-
     if (documentListenerAdded) {
-      document.removeEventListener('touchmove', preventDefault, hasPassiveEvents ? { passive: false } : undefined);
+      document.removeEventListener(
+        "touchmove",
+        preventDefault,
+        hasPassiveEvents ? { passive: false } : void 0
+      );
       documentListenerAdded = false;
     }
-
-    // Reset initial clientY.
     initialClientY = -1;
   }
-
   if (isIosDevice) {
     restorePositionSetting();
   } else {
     restoreOverflowSetting();
   }
-
   locks = [];
+  locksIndex.clear();
 };
-
-var enableBodyScroll = function enableBodyScroll(targetElement) {
+const enableBodyScroll = (targetElement) => {
   if (!targetElement) {
-    // eslint-disable-next-line no-console
-    console.error('enableBodyScroll unsuccessful - targetElement must be provided when calling enableBodyScroll on IOS devices.');
+    console.error(
+      "enableBodyScroll unsuccessful - targetElement must be provided when calling enableBodyScroll on IOS devices."
+    );
     return;
   }
-
-  locks = locks.filter(function (lock) {
-    return lock.targetElement !== targetElement;
-  });
-
+  locksIndex.set(
+    targetElement,
+    (locksIndex == null ? void 0 : locksIndex.get(targetElement)) ? (locksIndex == null ? void 0 : locksIndex.get(targetElement)) - 1 : 0
+  );
+  if ((locksIndex == null ? void 0 : locksIndex.get(targetElement)) === 0) {
+    locks = locks.filter((lock) => lock.targetElement !== targetElement);
+    locksIndex == null ? void 0 : locksIndex.delete(targetElement);
+  }
   if (isIosDevice) {
     targetElement.ontouchstart = null;
     targetElement.ontouchmove = null;
-
     if (documentListenerAdded && locks.length === 0) {
-      document.removeEventListener('touchmove', preventDefault, hasPassiveEvents ? { passive: false } : undefined);
+      document.removeEventListener(
+        "touchmove",
+        preventDefault,
+        hasPassiveEvents ? { passive: false } : void 0
+      );
       documentListenerAdded = false;
     }
   }
-
-  if (isIosDevice) {
-    restorePositionSetting();
-  } else {
-    restoreOverflowSetting();
+  if (locks.length === 0) {
+    if (isIosDevice) {
+      restorePositionSetting();
+    } else {
+      restoreOverflowSetting();
+    }
   }
 };