@razorpay/blade 10.19.1 → 10.20.1
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/build/components/index.d.ts +5 -2
- package/build/components/index.development.web.js +197 -206
- package/build/components/index.development.web.js.map +1 -1
- package/build/components/index.native.d.ts +4 -1
- package/build/components/index.native.js +3 -3
- package/build/components/index.native.js.map +1 -1
- package/build/components/index.production.web.js +197 -206
- package/build/components/index.production.web.js.map +1 -1
- package/build/css/bankingThemeDarkDesktop.css +1 -1
- package/build/css/bankingThemeDarkMobile.css +1 -1
- package/build/css/bankingThemeLightDesktop.css +1 -1
- package/build/css/bankingThemeLightMobile.css +1 -1
- package/build/css/paymentThemeDarkDesktop.css +1 -1
- package/build/css/paymentThemeDarkMobile.css +1 -1
- package/build/css/paymentThemeLightDesktop.css +1 -1
- package/build/css/paymentThemeLightMobile.css +1 -1
- package/package.json +2 -2
|
@@ -2,11 +2,11 @@ import _defineProperty$1 from '@babel/runtime/helpers/defineProperty';
|
|
|
2
2
|
import * as React from 'react';
|
|
3
3
|
import React__default, { useMemo, useCallback, useState, useRef, useEffect, useContext, createContext, Fragment as Fragment$1, useImperativeHandle, forwardRef, Children, cloneElement } from 'react';
|
|
4
4
|
import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
|
|
5
|
-
import styled, { ThemeProvider, css as css$1, keyframes } from 'styled-components';
|
|
5
|
+
import styled, { ThemeProvider, StyleSheetManager, css as css$1, keyframes } from 'styled-components';
|
|
6
6
|
import _objectWithoutProperties$1 from '@babel/runtime/helpers/objectWithoutProperties';
|
|
7
7
|
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';
|
|
8
8
|
import _typeof from '@babel/runtime/helpers/typeof';
|
|
9
|
-
import _toConsumableArray
|
|
9
|
+
import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
|
|
10
10
|
import { jsx as jsx$1, jsxs, Fragment } from 'react/jsx-runtime';
|
|
11
11
|
import _classCallCheck from '@babel/runtime/helpers/classCallCheck';
|
|
12
12
|
import _createClass from '@babel/runtime/helpers/createClass';
|
|
@@ -3089,6 +3089,19 @@ var getBaseBoxStyles = function getBaseBoxStyles(props) {
|
|
|
3089
3089
|
return _objectSpread$6y(_objectSpread$6y({}, getAllProps(props)), getAllMediaQueries(props));
|
|
3090
3090
|
};
|
|
3091
3091
|
|
|
3092
|
+
function createStylisCSSHigherSpecificityPlugin() {
|
|
3093
|
+
var stylisCSSHigherSpecificity = function stylisCSSHigherSpecificity(context, _, selectors) {
|
|
3094
|
+
if (context !== -1) return;
|
|
3095
|
+
var _selectors = _slicedToArray(selectors, 1),
|
|
3096
|
+
selector = _selectors[0];
|
|
3097
|
+
selectors[0] = "".concat(selector.repeat(5));
|
|
3098
|
+
};
|
|
3099
|
+
Object.defineProperty(stylisCSSHigherSpecificity, 'name', {
|
|
3100
|
+
value: 'stylisCSSHigherSpecificity'
|
|
3101
|
+
});
|
|
3102
|
+
return stylisCSSHigherSpecificity;
|
|
3103
|
+
}
|
|
3104
|
+
|
|
3092
3105
|
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; }
|
|
3093
3106
|
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; }
|
|
3094
3107
|
/**
|
|
@@ -3162,12 +3175,12 @@ var BottomSheetStackProvider = function BottomSheetStackProvider(_ref) {
|
|
|
3162
3175
|
}, [stack]);
|
|
3163
3176
|
var addBottomSheetToStack = React__default.useCallback(function (id) {
|
|
3164
3177
|
setStack(function (prev) {
|
|
3165
|
-
return [id].concat(_toConsumableArray
|
|
3178
|
+
return [id].concat(_toConsumableArray(prev));
|
|
3166
3179
|
});
|
|
3167
3180
|
}, []);
|
|
3168
3181
|
var removeBottomSheetFromStack = React__default.useCallback(function (id) {
|
|
3169
3182
|
setStack(function (prev) {
|
|
3170
|
-
var newStack = _toConsumableArray
|
|
3183
|
+
var newStack = _toConsumableArray(prev);
|
|
3171
3184
|
var popped = newStack.shift();
|
|
3172
3185
|
// only pop the stack if the passed in id is matched to the top of the stack
|
|
3173
3186
|
if (popped === id) return newStack;
|
|
@@ -3218,8 +3231,11 @@ var BladeProvider = function BladeProvider(_ref) {
|
|
|
3218
3231
|
delay: tooltipDelays,
|
|
3219
3232
|
children: /*#__PURE__*/jsx$1(ThemeProvider, {
|
|
3220
3233
|
theme: theme,
|
|
3221
|
-
children: /*#__PURE__*/jsx$1(
|
|
3222
|
-
|
|
3234
|
+
children: /*#__PURE__*/jsx$1(StyleSheetManager, {
|
|
3235
|
+
stylisPlugins: [createStylisCSSHigherSpecificityPlugin()],
|
|
3236
|
+
children: /*#__PURE__*/jsx$1(BottomSheetStackProvider, {
|
|
3237
|
+
children: children
|
|
3238
|
+
})
|
|
3223
3239
|
})
|
|
3224
3240
|
})
|
|
3225
3241
|
})
|
|
@@ -13013,6 +13029,7 @@ var getBaseTextStyles = function getBaseTextStyles(_ref) {
|
|
|
13013
13029
|
_ref$textDecorationLi = _ref.textDecorationLine,
|
|
13014
13030
|
textDecorationLine = _ref$textDecorationLi === void 0 ? 'none' : _ref$textDecorationLi,
|
|
13015
13031
|
numberOfLines = _ref.numberOfLines,
|
|
13032
|
+
wordBreak = _ref.wordBreak,
|
|
13016
13033
|
_ref$lineHeight = _ref.lineHeight,
|
|
13017
13034
|
lineHeight = _ref$lineHeight === void 0 ? 100 : _ref$lineHeight,
|
|
13018
13035
|
textAlign = _ref.textAlign,
|
|
@@ -13023,6 +13040,7 @@ var getBaseTextStyles = function getBaseTextStyles(_ref) {
|
|
|
13023
13040
|
var themeFontWeight = theme.typography.fonts.weight[fontWeight];
|
|
13024
13041
|
var themeLineHeight = makeTypographySize(theme.typography.lineHeights[lineHeight]);
|
|
13025
13042
|
var truncateStyles = {};
|
|
13043
|
+
var wordBreakStyles = {};
|
|
13026
13044
|
if (numberOfLines !== undefined) {
|
|
13027
13045
|
if (isReactNative$4()) {
|
|
13028
13046
|
truncateStyles = {};
|
|
@@ -13036,7 +13054,16 @@ var getBaseTextStyles = function getBaseTextStyles(_ref) {
|
|
|
13036
13054
|
};
|
|
13037
13055
|
}
|
|
13038
13056
|
}
|
|
13039
|
-
|
|
13057
|
+
if (wordBreak !== undefined) {
|
|
13058
|
+
if (isReactNative$4()) {
|
|
13059
|
+
wordBreakStyles = {};
|
|
13060
|
+
} else {
|
|
13061
|
+
wordBreakStyles = {
|
|
13062
|
+
wordBreak: wordBreak
|
|
13063
|
+
};
|
|
13064
|
+
}
|
|
13065
|
+
}
|
|
13066
|
+
return _objectSpread$21(_objectSpread$21(_objectSpread$21({
|
|
13040
13067
|
color: textColor,
|
|
13041
13068
|
fontFamily: themeFontFamily,
|
|
13042
13069
|
fontSize: themeFontSize,
|
|
@@ -13050,11 +13077,11 @@ var getBaseTextStyles = function getBaseTextStyles(_ref) {
|
|
|
13050
13077
|
textAlign: textAlign,
|
|
13051
13078
|
margin: 0,
|
|
13052
13079
|
padding: 0
|
|
13053
|
-
}, truncateStyles);
|
|
13080
|
+
}, truncateStyles), wordBreakStyles);
|
|
13054
13081
|
};
|
|
13055
13082
|
|
|
13056
|
-
var _excluded$R = ["color", "fontFamily", "fontSize", "fontWeight", "fontStyle", "textDecorationLine", "numberOfLines", "lineHeight", "textAlign"],
|
|
13057
|
-
_excluded2$1 = ["id", "color", "fontFamily", "fontSize", "fontWeight", "fontStyle", "textDecorationLine", "lineHeight", "as", "textAlign", "children", "truncateAfterLines", "className", "style", "accessibilityProps", "componentName", "testID"];
|
|
13083
|
+
var _excluded$R = ["color", "fontFamily", "fontSize", "fontWeight", "fontStyle", "textDecorationLine", "numberOfLines", "lineHeight", "textAlign", "wordBreak"],
|
|
13084
|
+
_excluded2$1 = ["id", "color", "fontFamily", "fontSize", "fontWeight", "fontStyle", "textDecorationLine", "lineHeight", "as", "textAlign", "children", "truncateAfterLines", "wordBreak", "className", "style", "accessibilityProps", "componentName", "testID"];
|
|
13058
13085
|
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; }
|
|
13059
13086
|
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; }
|
|
13060
13087
|
var StyledBaseText = /*#__PURE__*/styled.div.withConfig({
|
|
@@ -13070,6 +13097,7 @@ var StyledBaseText = /*#__PURE__*/styled.div.withConfig({
|
|
|
13070
13097
|
numberOfLines = _ref.numberOfLines,
|
|
13071
13098
|
lineHeight = _ref.lineHeight,
|
|
13072
13099
|
textAlign = _ref.textAlign,
|
|
13100
|
+
wordBreak = _ref.wordBreak,
|
|
13073
13101
|
props = _objectWithoutProperties$1(_ref, _excluded$R);
|
|
13074
13102
|
var styledPropsCSSObject = useStyledProps(props);
|
|
13075
13103
|
return _objectSpread$20(_objectSpread$20({}, getBaseTextStyles({
|
|
@@ -13082,6 +13110,7 @@ var StyledBaseText = /*#__PURE__*/styled.div.withConfig({
|
|
|
13082
13110
|
numberOfLines: numberOfLines,
|
|
13083
13111
|
lineHeight: lineHeight,
|
|
13084
13112
|
textAlign: textAlign,
|
|
13113
|
+
wordBreak: wordBreak,
|
|
13085
13114
|
theme: props.theme
|
|
13086
13115
|
})), styledPropsCSSObject);
|
|
13087
13116
|
});
|
|
@@ -13098,6 +13127,7 @@ var BaseText = function BaseText(_ref2) {
|
|
|
13098
13127
|
textAlign = _ref2.textAlign,
|
|
13099
13128
|
children = _ref2.children,
|
|
13100
13129
|
truncateAfterLines = _ref2.truncateAfterLines,
|
|
13130
|
+
wordBreak = _ref2.wordBreak,
|
|
13101
13131
|
className = _ref2.className,
|
|
13102
13132
|
style = _ref2.style,
|
|
13103
13133
|
_ref2$accessibilityPr = _ref2.accessibilityProps,
|
|
@@ -13117,6 +13147,7 @@ var BaseText = function BaseText(_ref2) {
|
|
|
13117
13147
|
as: as,
|
|
13118
13148
|
textAlign: textAlign,
|
|
13119
13149
|
numberOfLines: truncateAfterLines,
|
|
13150
|
+
wordBreak: wordBreak,
|
|
13120
13151
|
className: className,
|
|
13121
13152
|
style: style,
|
|
13122
13153
|
id: id
|
|
@@ -13338,7 +13369,7 @@ var Heading = function Heading(_ref2) {
|
|
|
13338
13369
|
}));
|
|
13339
13370
|
};
|
|
13340
13371
|
|
|
13341
|
-
var _excluded$O = ["as", "variant", "weight", "size", "type", "contrast", "truncateAfterLines", "children", "color", "testID", "textAlign", "textDecorationLine"];
|
|
13372
|
+
var _excluded$O = ["as", "variant", "weight", "size", "type", "contrast", "truncateAfterLines", "children", "color", "testID", "textAlign", "textDecorationLine", "wordBreak"];
|
|
13342
13373
|
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; }
|
|
13343
13374
|
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; }
|
|
13344
13375
|
var validAsValues$1 = ['p', 'span', 'div', 'abbr', 'figcaption', 'cite', 'q'];
|
|
@@ -13422,10 +13453,12 @@ var _Text = function _Text(_ref2) {
|
|
|
13422
13453
|
testID = _ref2.testID,
|
|
13423
13454
|
textAlign = _ref2.textAlign,
|
|
13424
13455
|
textDecorationLine = _ref2.textDecorationLine,
|
|
13456
|
+
wordBreak = _ref2.wordBreak,
|
|
13425
13457
|
styledProps = _objectWithoutProperties$1(_ref2, _excluded$O);
|
|
13426
13458
|
var props = _objectSpread$1Z({
|
|
13427
13459
|
as: as,
|
|
13428
|
-
truncateAfterLines: truncateAfterLines
|
|
13460
|
+
truncateAfterLines: truncateAfterLines,
|
|
13461
|
+
wordBreak: wordBreak
|
|
13429
13462
|
}, getTextProps({
|
|
13430
13463
|
variant: variant,
|
|
13431
13464
|
type: type,
|
|
@@ -13774,7 +13807,7 @@ function getActionFromKey(e, isOpen, dropdownTriggerer) {
|
|
|
13774
13807
|
**/
|
|
13775
13808
|
function getIndexByLetter(options, filter) {
|
|
13776
13809
|
var startIndex = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
|
|
13777
|
-
var orderedOptions = [].concat(_toConsumableArray
|
|
13810
|
+
var orderedOptions = [].concat(_toConsumableArray(options.slice(startIndex)), _toConsumableArray(options.slice(0, startIndex)));
|
|
13778
13811
|
var firstMatch = filterOptions(orderedOptions, filter)[0];
|
|
13779
13812
|
var allSameLetter = function allSameLetter(array) {
|
|
13780
13813
|
return array.every(function (letter) {
|
|
@@ -14036,7 +14069,7 @@ var useDropdown = function useDropdown() {
|
|
|
14036
14069
|
if (existingItemIndex < 0) {
|
|
14037
14070
|
return;
|
|
14038
14071
|
}
|
|
14039
|
-
setIndices([].concat(_toConsumableArray
|
|
14072
|
+
setIndices([].concat(_toConsumableArray(selectedIndices.slice(0, existingItemIndex)), _toConsumableArray(selectedIndices.slice(existingItemIndex + 1))));
|
|
14040
14073
|
};
|
|
14041
14074
|
|
|
14042
14075
|
/**
|
|
@@ -14058,7 +14091,7 @@ var useDropdown = function useDropdown() {
|
|
|
14058
14091
|
removeOption(index);
|
|
14059
14092
|
isSelected = false;
|
|
14060
14093
|
} else {
|
|
14061
|
-
setIndices([].concat(_toConsumableArray
|
|
14094
|
+
setIndices([].concat(_toConsumableArray(selectedIndices), [index]));
|
|
14062
14095
|
isSelected = true;
|
|
14063
14096
|
}
|
|
14064
14097
|
} else {
|
|
@@ -15147,6 +15180,7 @@ var FormLabel = function FormLabel(_ref) {
|
|
|
15147
15180
|
size: isLabelLeftPositioned ? 'medium' : 'small',
|
|
15148
15181
|
truncateAfterLines: 2,
|
|
15149
15182
|
weight: "bold",
|
|
15183
|
+
wordBreak: isLabelLeftPositioned ? 'break-word' : undefined,
|
|
15150
15184
|
children: children
|
|
15151
15185
|
}), computedAccessibilityNode, necessityLabel]
|
|
15152
15186
|
});
|
|
@@ -20758,7 +20792,8 @@ var _DropdownOverlay = function _DropdownOverlay(_ref) {
|
|
|
20758
20792
|
var children = _ref.children,
|
|
20759
20793
|
testID = _ref.testID,
|
|
20760
20794
|
_ref$zIndex = _ref.zIndex,
|
|
20761
|
-
zIndex = _ref$zIndex === void 0 ? OVERLAY_ZINDEX : _ref$zIndex
|
|
20795
|
+
zIndex = _ref$zIndex === void 0 ? OVERLAY_ZINDEX : _ref$zIndex,
|
|
20796
|
+
width = _ref.width;
|
|
20762
20797
|
var _useDropdown = useDropdown(),
|
|
20763
20798
|
isOpen = _useDropdown.isOpen,
|
|
20764
20799
|
triggererRef = _useDropdown.triggererRef,
|
|
@@ -20832,7 +20867,7 @@ var _DropdownOverlay = function _DropdownOverlay(_ref) {
|
|
|
20832
20867
|
isInBottomSheet: bottomSheetAndDropdownGlue === null || bottomSheetAndDropdownGlue === void 0 ? void 0 : bottomSheetAndDropdownGlue.dropdownHasBottomSheet,
|
|
20833
20868
|
elevation: bottomSheetAndDropdownGlue !== null && bottomSheetAndDropdownGlue !== void 0 && bottomSheetAndDropdownGlue.dropdownHasBottomSheet ? undefined : 'midRaised',
|
|
20834
20869
|
style: _objectSpread$1d({}, styles),
|
|
20835
|
-
width:
|
|
20870
|
+
width: width ? width : '100%'
|
|
20836
20871
|
}, metaAttribute({
|
|
20837
20872
|
name: MetaConstants.DropdownOverlay,
|
|
20838
20873
|
testID: testID
|
|
@@ -32769,7 +32804,7 @@ var _TableRow = function _TableRow(_ref8) {
|
|
|
32769
32804
|
useEffect(function () {
|
|
32770
32805
|
if (isDisabled) {
|
|
32771
32806
|
setDisabledRows(function (prev) {
|
|
32772
|
-
return [].concat(_toConsumableArray
|
|
32807
|
+
return [].concat(_toConsumableArray(prev), [item.id]);
|
|
32773
32808
|
});
|
|
32774
32809
|
}
|
|
32775
32810
|
}, [isDisabled, item.id, setDisabledRows]);
|
|
@@ -35424,281 +35459,237 @@ function useDrag(handler, config) {
|
|
|
35424
35459
|
}, config || {}, 'drag');
|
|
35425
35460
|
}
|
|
35426
35461
|
|
|
35427
|
-
|
|
35428
|
-
|
|
35429
|
-
|
|
35430
|
-
|
|
35431
|
-
|
|
35432
|
-
|
|
35433
|
-
|
|
35434
|
-
|
|
35435
|
-
if (typeof window !== 'undefined') {
|
|
35436
|
-
var passiveTestOptions = {
|
|
35462
|
+
/**
|
|
35463
|
+
* name: body-scroll-lock-upgrade
|
|
35464
|
+
* version: v1.1.0
|
|
35465
|
+
* author: Rick.li
|
|
35466
|
+
*/
|
|
35467
|
+
let hasPassiveEvents = false;
|
|
35468
|
+
if (typeof window !== "undefined") {
|
|
35469
|
+
const passiveTestOptions = {
|
|
35437
35470
|
get passive() {
|
|
35438
35471
|
hasPassiveEvents = true;
|
|
35439
|
-
return
|
|
35472
|
+
return void 0;
|
|
35440
35473
|
}
|
|
35441
35474
|
};
|
|
35442
|
-
window.addEventListener(
|
|
35443
|
-
window.removeEventListener(
|
|
35475
|
+
window.addEventListener("testPassive", null, passiveTestOptions);
|
|
35476
|
+
window.removeEventListener("testPassive", null, passiveTestOptions);
|
|
35444
35477
|
}
|
|
35445
|
-
|
|
35446
|
-
|
|
35447
|
-
|
|
35448
|
-
|
|
35449
|
-
|
|
35450
|
-
|
|
35451
|
-
|
|
35452
|
-
|
|
35453
|
-
|
|
35454
|
-
|
|
35455
|
-
|
|
35456
|
-
|
|
35457
|
-
|
|
35458
|
-
return
|
|
35459
|
-
|
|
35460
|
-
|
|
35461
|
-
|
|
35462
|
-
|
|
35463
|
-
return false;
|
|
35464
|
-
});
|
|
35465
|
-
};
|
|
35466
|
-
|
|
35467
|
-
var preventDefault = function preventDefault(rawEvent) {
|
|
35468
|
-
var e = rawEvent || window.event;
|
|
35469
|
-
|
|
35470
|
-
// For the case whereby consumers adds a touchmove event listener to document.
|
|
35471
|
-
// Recall that we do document.addEventListener('touchmove', preventDefault, { passive: false })
|
|
35472
|
-
// in disableBodyScroll - so if we provide this opportunity to allowTouchMove, then
|
|
35473
|
-
// the touchmove event on document will break.
|
|
35478
|
+
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);
|
|
35479
|
+
let locks = [];
|
|
35480
|
+
let locksIndex = /* @__PURE__ */ new Map();
|
|
35481
|
+
let documentListenerAdded = false;
|
|
35482
|
+
let initialClientY = -1;
|
|
35483
|
+
let previousBodyOverflowSetting;
|
|
35484
|
+
let htmlStyle;
|
|
35485
|
+
let bodyStyle;
|
|
35486
|
+
let previousBodyPaddingRight;
|
|
35487
|
+
const allowTouchMove = (el) => locks.some((lock) => {
|
|
35488
|
+
if (lock.options.allowTouchMove && lock.options.allowTouchMove(el)) {
|
|
35489
|
+
return true;
|
|
35490
|
+
}
|
|
35491
|
+
return false;
|
|
35492
|
+
});
|
|
35493
|
+
const preventDefault = (rawEvent) => {
|
|
35494
|
+
const e = rawEvent || window.event;
|
|
35474
35495
|
if (allowTouchMove(e.target)) {
|
|
35475
35496
|
return true;
|
|
35476
35497
|
}
|
|
35477
|
-
|
|
35478
|
-
|
|
35479
|
-
if (e.
|
|
35480
|
-
|
|
35481
|
-
if (e.preventDefault) e.preventDefault();
|
|
35482
|
-
|
|
35498
|
+
if (e.touches.length > 1)
|
|
35499
|
+
return true;
|
|
35500
|
+
if (e.preventDefault)
|
|
35501
|
+
e.preventDefault();
|
|
35483
35502
|
return false;
|
|
35484
35503
|
};
|
|
35485
|
-
|
|
35486
|
-
|
|
35487
|
-
|
|
35488
|
-
|
|
35489
|
-
|
|
35490
|
-
|
|
35491
|
-
|
|
35492
|
-
|
|
35493
|
-
|
|
35504
|
+
const setOverflowHidden = (options) => {
|
|
35505
|
+
if (previousBodyPaddingRight === void 0) {
|
|
35506
|
+
const reserveScrollBarGap = !!options && options.reserveScrollBarGap === true;
|
|
35507
|
+
const scrollBarGap = window.innerWidth - document.documentElement.getBoundingClientRect().width;
|
|
35508
|
+
if (reserveScrollBarGap && scrollBarGap > 0) {
|
|
35509
|
+
const computedBodyPaddingRight = parseInt(
|
|
35510
|
+
window.getComputedStyle(document.body).getPropertyValue("padding-right"),
|
|
35511
|
+
10
|
|
35512
|
+
);
|
|
35494
35513
|
previousBodyPaddingRight = document.body.style.paddingRight;
|
|
35495
|
-
document.body.style.paddingRight = computedBodyPaddingRight + scrollBarGap
|
|
35514
|
+
document.body.style.paddingRight = `${computedBodyPaddingRight + scrollBarGap}px`;
|
|
35496
35515
|
}
|
|
35497
35516
|
}
|
|
35498
|
-
|
|
35499
|
-
// If previousBodyOverflowSetting is already set, don't set it again.
|
|
35500
|
-
if (previousBodyOverflowSetting === undefined) {
|
|
35517
|
+
if (previousBodyOverflowSetting === void 0) {
|
|
35501
35518
|
previousBodyOverflowSetting = document.body.style.overflow;
|
|
35502
|
-
document.body.style.overflow =
|
|
35519
|
+
document.body.style.overflow = "hidden";
|
|
35503
35520
|
}
|
|
35504
35521
|
};
|
|
35505
|
-
|
|
35506
|
-
|
|
35507
|
-
if (previousBodyPaddingRight !== undefined) {
|
|
35522
|
+
const restoreOverflowSetting = () => {
|
|
35523
|
+
if (previousBodyPaddingRight !== void 0) {
|
|
35508
35524
|
document.body.style.paddingRight = previousBodyPaddingRight;
|
|
35509
|
-
|
|
35510
|
-
// Restore previousBodyPaddingRight to undefined so setOverflowHidden knows it
|
|
35511
|
-
// can be set again.
|
|
35512
|
-
previousBodyPaddingRight = undefined;
|
|
35525
|
+
previousBodyPaddingRight = void 0;
|
|
35513
35526
|
}
|
|
35514
|
-
|
|
35515
|
-
if (previousBodyOverflowSetting !== undefined) {
|
|
35527
|
+
if (previousBodyOverflowSetting !== void 0) {
|
|
35516
35528
|
document.body.style.overflow = previousBodyOverflowSetting;
|
|
35517
|
-
|
|
35518
|
-
|
|
35519
|
-
|
|
35520
|
-
|
|
35529
|
+
previousBodyOverflowSetting = void 0;
|
|
35530
|
+
}
|
|
35531
|
+
};
|
|
35532
|
+
const setPositionFixed = () => window.requestAnimationFrame(() => {
|
|
35533
|
+
const $html = document.documentElement;
|
|
35534
|
+
const $body = document.body;
|
|
35535
|
+
if (bodyStyle === void 0) {
|
|
35536
|
+
htmlStyle = { ...$html.style };
|
|
35537
|
+
bodyStyle = { ...$body.style };
|
|
35538
|
+
const { scrollY, scrollX, innerHeight } = window;
|
|
35539
|
+
$html.style.height = "100%";
|
|
35540
|
+
$html.style.overflow = "hidden";
|
|
35541
|
+
$body.style.position = "fixed";
|
|
35542
|
+
$body.style.top = `${-scrollY}px`;
|
|
35543
|
+
$body.style.left = `${-scrollX}px`;
|
|
35544
|
+
$body.style.width = "100%";
|
|
35545
|
+
$body.style.height = "auto";
|
|
35546
|
+
$body.style.overflow = "hidden";
|
|
35547
|
+
setTimeout(
|
|
35548
|
+
() => window.requestAnimationFrame(() => {
|
|
35549
|
+
const bottomBarHeight = innerHeight - window.innerHeight;
|
|
35550
|
+
if (bottomBarHeight && scrollY >= innerHeight) {
|
|
35551
|
+
$body.style.top = -(scrollY + bottomBarHeight) + "px";
|
|
35552
|
+
}
|
|
35553
|
+
}),
|
|
35554
|
+
300
|
|
35555
|
+
);
|
|
35521
35556
|
}
|
|
35522
|
-
};
|
|
35523
|
-
|
|
35524
|
-
|
|
35525
|
-
|
|
35526
|
-
|
|
35527
|
-
|
|
35528
|
-
|
|
35529
|
-
|
|
35530
|
-
|
|
35531
|
-
|
|
35532
|
-
|
|
35533
|
-
|
|
35534
|
-
|
|
35535
|
-
|
|
35536
|
-
|
|
35537
|
-
scrollX = _window.scrollX,
|
|
35538
|
-
innerHeight = _window.innerHeight;
|
|
35539
|
-
|
|
35540
|
-
document.body.style.position = 'fixed';
|
|
35541
|
-
document.body.style.top = -scrollY;
|
|
35542
|
-
document.body.style.left = -scrollX;
|
|
35543
|
-
|
|
35544
|
-
setTimeout(function () {
|
|
35545
|
-
return window.requestAnimationFrame(function () {
|
|
35546
|
-
// Attempt to check if the bottom bar appeared due to the position change
|
|
35547
|
-
var bottomBarHeight = innerHeight - window.innerHeight;
|
|
35548
|
-
if (bottomBarHeight && scrollY >= innerHeight) {
|
|
35549
|
-
// Move the content further up so that the bottom bar doesn't hide it
|
|
35550
|
-
document.body.style.top = -(scrollY + bottomBarHeight);
|
|
35551
|
-
}
|
|
35552
|
-
});
|
|
35553
|
-
}, 300);
|
|
35554
|
-
}
|
|
35555
|
-
});
|
|
35556
|
-
};
|
|
35557
|
-
|
|
35558
|
-
var restorePositionSetting = function restorePositionSetting() {
|
|
35559
|
-
if (previousBodyPosition !== undefined) {
|
|
35560
|
-
// Convert the position from "px" to Int
|
|
35561
|
-
var y = -parseInt(document.body.style.top, 10);
|
|
35562
|
-
var x = -parseInt(document.body.style.left, 10);
|
|
35563
|
-
|
|
35564
|
-
// Restore styles
|
|
35565
|
-
document.body.style.position = previousBodyPosition.position;
|
|
35566
|
-
document.body.style.top = previousBodyPosition.top;
|
|
35567
|
-
document.body.style.left = previousBodyPosition.left;
|
|
35568
|
-
|
|
35569
|
-
// Restore scroll
|
|
35557
|
+
});
|
|
35558
|
+
const restorePositionSetting = () => {
|
|
35559
|
+
if (bodyStyle !== void 0) {
|
|
35560
|
+
const y = -parseInt(document.body.style.top, 10);
|
|
35561
|
+
const x = -parseInt(document.body.style.left, 10);
|
|
35562
|
+
const $html = document.documentElement;
|
|
35563
|
+
const $body = document.body;
|
|
35564
|
+
$html.style.height = (htmlStyle == null ? void 0 : htmlStyle.height) || "";
|
|
35565
|
+
$html.style.overflow = (htmlStyle == null ? void 0 : htmlStyle.overflow) || "";
|
|
35566
|
+
$body.style.position = bodyStyle.position || "";
|
|
35567
|
+
$body.style.top = bodyStyle.top || "";
|
|
35568
|
+
$body.style.left = bodyStyle.left || "";
|
|
35569
|
+
$body.style.width = bodyStyle.width || "";
|
|
35570
|
+
$body.style.height = bodyStyle.height || "";
|
|
35571
|
+
$body.style.overflow = bodyStyle.overflow || "";
|
|
35570
35572
|
window.scrollTo(x, y);
|
|
35571
|
-
|
|
35572
|
-
previousBodyPosition = undefined;
|
|
35573
|
+
bodyStyle = void 0;
|
|
35573
35574
|
}
|
|
35574
35575
|
};
|
|
35575
|
-
|
|
35576
|
-
|
|
35577
|
-
|
|
35578
|
-
return targetElement ? targetElement.scrollHeight - targetElement.scrollTop <= targetElement.clientHeight : false;
|
|
35579
|
-
};
|
|
35580
|
-
|
|
35581
|
-
var handleScroll = function handleScroll(event, targetElement) {
|
|
35582
|
-
var clientY = event.targetTouches[0].clientY - initialClientY;
|
|
35583
|
-
|
|
35576
|
+
const isTargetElementTotallyScrolled = (targetElement) => targetElement ? targetElement.scrollHeight - targetElement.scrollTop <= targetElement.clientHeight : false;
|
|
35577
|
+
const handleScroll = (event, targetElement) => {
|
|
35578
|
+
const clientY = event.targetTouches[0].clientY - initialClientY;
|
|
35584
35579
|
if (allowTouchMove(event.target)) {
|
|
35585
35580
|
return false;
|
|
35586
35581
|
}
|
|
35587
|
-
|
|
35588
35582
|
if (targetElement && targetElement.scrollTop === 0 && clientY > 0) {
|
|
35589
|
-
// element is at the top of its scroll.
|
|
35590
35583
|
return preventDefault(event);
|
|
35591
35584
|
}
|
|
35592
|
-
|
|
35593
35585
|
if (isTargetElementTotallyScrolled(targetElement) && clientY < 0) {
|
|
35594
|
-
// element is at the bottom of its scroll.
|
|
35595
35586
|
return preventDefault(event);
|
|
35596
35587
|
}
|
|
35597
|
-
|
|
35598
35588
|
event.stopPropagation();
|
|
35599
35589
|
return true;
|
|
35600
35590
|
};
|
|
35601
|
-
|
|
35602
|
-
var disableBodyScroll = function disableBodyScroll(targetElement, options) {
|
|
35603
|
-
// targetElement must be provided
|
|
35591
|
+
const disableBodyScroll = (targetElement, options) => {
|
|
35604
35592
|
if (!targetElement) {
|
|
35605
|
-
|
|
35606
|
-
|
|
35593
|
+
console.error(
|
|
35594
|
+
"disableBodyScroll unsuccessful - targetElement must be provided when calling disableBodyScroll on IOS devices."
|
|
35595
|
+
);
|
|
35607
35596
|
return;
|
|
35608
35597
|
}
|
|
35609
|
-
|
|
35610
|
-
|
|
35611
|
-
|
|
35612
|
-
|
|
35613
|
-
|
|
35598
|
+
locksIndex.set(
|
|
35599
|
+
targetElement,
|
|
35600
|
+
(locksIndex == null ? void 0 : locksIndex.get(targetElement)) ? (locksIndex == null ? void 0 : locksIndex.get(targetElement)) + 1 : 1
|
|
35601
|
+
);
|
|
35602
|
+
if (locks.some((lock2) => lock2.targetElement === targetElement)) {
|
|
35614
35603
|
return;
|
|
35615
35604
|
}
|
|
35616
|
-
|
|
35617
|
-
|
|
35618
|
-
targetElement: targetElement,
|
|
35605
|
+
const lock = {
|
|
35606
|
+
targetElement,
|
|
35619
35607
|
options: options || {}
|
|
35620
35608
|
};
|
|
35621
|
-
|
|
35622
|
-
locks = [].concat(_toConsumableArray(locks), [lock]);
|
|
35623
|
-
|
|
35609
|
+
locks = [...locks, lock];
|
|
35624
35610
|
if (isIosDevice) {
|
|
35625
35611
|
setPositionFixed();
|
|
35626
35612
|
} else {
|
|
35627
35613
|
setOverflowHidden(options);
|
|
35628
35614
|
}
|
|
35629
|
-
|
|
35630
35615
|
if (isIosDevice) {
|
|
35631
|
-
targetElement.ontouchstart =
|
|
35616
|
+
targetElement.ontouchstart = (event) => {
|
|
35632
35617
|
if (event.targetTouches.length === 1) {
|
|
35633
|
-
// detect single touch.
|
|
35634
35618
|
initialClientY = event.targetTouches[0].clientY;
|
|
35635
35619
|
}
|
|
35636
35620
|
};
|
|
35637
|
-
targetElement.ontouchmove =
|
|
35621
|
+
targetElement.ontouchmove = (event) => {
|
|
35638
35622
|
if (event.targetTouches.length === 1) {
|
|
35639
|
-
// detect single touch.
|
|
35640
35623
|
handleScroll(event, targetElement);
|
|
35641
35624
|
}
|
|
35642
35625
|
};
|
|
35643
|
-
|
|
35644
35626
|
if (!documentListenerAdded) {
|
|
35645
|
-
document.addEventListener(
|
|
35627
|
+
document.addEventListener(
|
|
35628
|
+
"touchmove",
|
|
35629
|
+
preventDefault,
|
|
35630
|
+
hasPassiveEvents ? { passive: false } : void 0
|
|
35631
|
+
);
|
|
35646
35632
|
documentListenerAdded = true;
|
|
35647
35633
|
}
|
|
35648
35634
|
}
|
|
35649
35635
|
};
|
|
35650
|
-
|
|
35651
|
-
var clearAllBodyScrollLocks = function clearAllBodyScrollLocks() {
|
|
35636
|
+
const clearAllBodyScrollLocks = () => {
|
|
35652
35637
|
if (isIosDevice) {
|
|
35653
|
-
|
|
35654
|
-
locks.forEach(function (lock) {
|
|
35638
|
+
locks.forEach((lock) => {
|
|
35655
35639
|
lock.targetElement.ontouchstart = null;
|
|
35656
35640
|
lock.targetElement.ontouchmove = null;
|
|
35657
35641
|
});
|
|
35658
|
-
|
|
35659
35642
|
if (documentListenerAdded) {
|
|
35660
|
-
document.removeEventListener(
|
|
35643
|
+
document.removeEventListener(
|
|
35644
|
+
"touchmove",
|
|
35645
|
+
preventDefault,
|
|
35646
|
+
hasPassiveEvents ? { passive: false } : void 0
|
|
35647
|
+
);
|
|
35661
35648
|
documentListenerAdded = false;
|
|
35662
35649
|
}
|
|
35663
|
-
|
|
35664
|
-
// Reset initial clientY.
|
|
35665
35650
|
initialClientY = -1;
|
|
35666
35651
|
}
|
|
35667
|
-
|
|
35668
35652
|
if (isIosDevice) {
|
|
35669
35653
|
restorePositionSetting();
|
|
35670
35654
|
} else {
|
|
35671
35655
|
restoreOverflowSetting();
|
|
35672
35656
|
}
|
|
35673
|
-
|
|
35674
35657
|
locks = [];
|
|
35658
|
+
locksIndex.clear();
|
|
35675
35659
|
};
|
|
35676
|
-
|
|
35677
|
-
var enableBodyScroll = function enableBodyScroll(targetElement) {
|
|
35660
|
+
const enableBodyScroll = (targetElement) => {
|
|
35678
35661
|
if (!targetElement) {
|
|
35679
|
-
|
|
35680
|
-
|
|
35662
|
+
console.error(
|
|
35663
|
+
"enableBodyScroll unsuccessful - targetElement must be provided when calling enableBodyScroll on IOS devices."
|
|
35664
|
+
);
|
|
35681
35665
|
return;
|
|
35682
35666
|
}
|
|
35683
|
-
|
|
35684
|
-
|
|
35685
|
-
|
|
35686
|
-
|
|
35687
|
-
|
|
35667
|
+
locksIndex.set(
|
|
35668
|
+
targetElement,
|
|
35669
|
+
(locksIndex == null ? void 0 : locksIndex.get(targetElement)) ? (locksIndex == null ? void 0 : locksIndex.get(targetElement)) - 1 : 0
|
|
35670
|
+
);
|
|
35671
|
+
if ((locksIndex == null ? void 0 : locksIndex.get(targetElement)) === 0) {
|
|
35672
|
+
locks = locks.filter((lock) => lock.targetElement !== targetElement);
|
|
35673
|
+
locksIndex == null ? void 0 : locksIndex.delete(targetElement);
|
|
35674
|
+
}
|
|
35688
35675
|
if (isIosDevice) {
|
|
35689
35676
|
targetElement.ontouchstart = null;
|
|
35690
35677
|
targetElement.ontouchmove = null;
|
|
35691
|
-
|
|
35692
35678
|
if (documentListenerAdded && locks.length === 0) {
|
|
35693
|
-
document.removeEventListener(
|
|
35679
|
+
document.removeEventListener(
|
|
35680
|
+
"touchmove",
|
|
35681
|
+
preventDefault,
|
|
35682
|
+
hasPassiveEvents ? { passive: false } : void 0
|
|
35683
|
+
);
|
|
35694
35684
|
documentListenerAdded = false;
|
|
35695
35685
|
}
|
|
35696
35686
|
}
|
|
35697
|
-
|
|
35698
|
-
|
|
35699
|
-
|
|
35700
|
-
|
|
35701
|
-
|
|
35687
|
+
if (locks.length === 0) {
|
|
35688
|
+
if (isIosDevice) {
|
|
35689
|
+
restorePositionSetting();
|
|
35690
|
+
} else {
|
|
35691
|
+
restoreOverflowSetting();
|
|
35692
|
+
}
|
|
35702
35693
|
}
|
|
35703
35694
|
};
|
|
35704
35695
|
|