@skyscanner/backpack-web 34.4.0 → 34.5.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.
|
@@ -39,7 +39,9 @@ class BpkHorizontalNav extends Component {
|
|
|
39
39
|
this.selectedItemRef = null;
|
|
40
40
|
}
|
|
41
41
|
componentDidMount() {
|
|
42
|
-
|
|
42
|
+
requestAnimationFrame(() => {
|
|
43
|
+
this.scrollSelectedIntoView(false);
|
|
44
|
+
});
|
|
43
45
|
}
|
|
44
46
|
componentDidUpdate() {
|
|
45
47
|
this.scrollSelectedIntoView(true);
|
|
@@ -80,8 +80,10 @@ class BpkMobileScrollContainer extends Component {
|
|
|
80
80
|
};
|
|
81
81
|
}
|
|
82
82
|
componentDidMount() {
|
|
83
|
-
|
|
84
|
-
|
|
83
|
+
requestAnimationFrame(() => {
|
|
84
|
+
this.setScrollBarAwareHeight();
|
|
85
|
+
this.setScrollIndicatorClassName();
|
|
86
|
+
});
|
|
85
87
|
window.addEventListener('resize', this.onWindowResize);
|
|
86
88
|
}
|
|
87
89
|
componentWillUnmount() {
|
|
@@ -44,32 +44,33 @@ const withScrim = WrappedComponent => {
|
|
|
44
44
|
isIphone
|
|
45
45
|
} = this.props;
|
|
46
46
|
const applicationElement = getApplicationElement();
|
|
47
|
+
requestAnimationFrame(() => {
|
|
48
|
+
/**
|
|
49
|
+
* iPhones & iPads need to have a fixed body
|
|
50
|
+
* and scrolling stored to prevent some iOS specific issues occuring
|
|
51
|
+
*
|
|
52
|
+
* Issue description:
|
|
53
|
+
* iOS safari does not prevent scrolling on the underlying content.
|
|
54
|
+
* Without the below fixes this results in users being able to scroll below any modal or dialog that uses withScrim.
|
|
55
|
+
*
|
|
56
|
+
* The fixes can be summaried here: https://markus.oberlehner.net/blog/simple-solution-to-prevent-body-scrolling-on-ios/
|
|
57
|
+
*
|
|
58
|
+
* The most dangerous of the fixes below is the fixBody, this function applies changes to the <body> style.
|
|
59
|
+
* This has the potential to override any custom styles already applied. The assumption here is that no one internally is making these changes to body.
|
|
60
|
+
*
|
|
61
|
+
* There is a corresponding set of functions in the componentWillUnmount block that deals with undoing these changes.
|
|
62
|
+
*/
|
|
63
|
+
if (isIphone || isIpad) {
|
|
64
|
+
storeScroll();
|
|
65
|
+
fixBody();
|
|
66
|
+
}
|
|
67
|
+
/**
|
|
68
|
+
* lockScroll and the associated unlockScroll is how we control the scroll behaviour of the application when the scrim is active.
|
|
69
|
+
* The desired behaviour is to prevent the user from scrolling content behind the scrim. The above iOS fixes are in place because lockScroll alone does not solve due to iOS specific issues.
|
|
70
|
+
*/
|
|
47
71
|
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
* and scrolling stored to prevent some iOS specific issues occuring
|
|
51
|
-
*
|
|
52
|
-
* Issue description:
|
|
53
|
-
* iOS safari does not prevent scrolling on the underlying content.
|
|
54
|
-
* Without the below fixes this results in users being able to scroll below any modal or dialog that uses withScrim.
|
|
55
|
-
*
|
|
56
|
-
* The fixes can be summaried here: https://markus.oberlehner.net/blog/simple-solution-to-prevent-body-scrolling-on-ios/
|
|
57
|
-
*
|
|
58
|
-
* The most dangerous of the fixes below is the fixBody, this function applies changes to the <body> style.
|
|
59
|
-
* This has the potential to override any custom styles already applied. The assumption here is that no one internally is making these changes to body.
|
|
60
|
-
*
|
|
61
|
-
* There is a corresponding set of functions in the componentWillUnmount block that deals with undoing these changes.
|
|
62
|
-
*/
|
|
63
|
-
if (isIphone || isIpad) {
|
|
64
|
-
storeScroll();
|
|
65
|
-
fixBody();
|
|
66
|
-
}
|
|
67
|
-
/**
|
|
68
|
-
* lockScroll and the associated unlockScroll is how we control the scroll behaviour of the application when the scrim is active.
|
|
69
|
-
* The desired behaviour is to prevent the user from scrolling content behind the scrim. The above iOS fixes are in place because lockScroll alone does not solve due to iOS specific issues.
|
|
70
|
-
*/
|
|
71
|
-
|
|
72
|
-
lockScroll();
|
|
72
|
+
lockScroll();
|
|
73
|
+
});
|
|
73
74
|
if (applicationElement) {
|
|
74
75
|
applicationElement.setAttribute('aria-hidden', 'true');
|
|
75
76
|
}
|