@royaloperahouse/chord 1.12.4-c-chord-development → 1.12.4-e-chord-development

package/dist/chord.cjs.development.js

@@ -4075,11 +4075,6 @@ var Footer = function Footer(_ref) {
   }, additionalInfo)))));
 };
 
-var IOSPlatforms = ['iPhone', 'iPad'];
-var isIOSDevice = function isIOSDevice() {
-  return IOSPlatforms.includes(navigator.platform);
-};
-
 var _templateObject$x, _templateObject2$i, _templateObject3$b, _templateObject4$6, _templateObject5$4, _templateObject6$4;
 var LIST_ITEM_GAP = 32;
 var AnchorTabbarWrapper = /*#__PURE__*/styled__default.div(_templateObject$x || (_templateObject$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: sticky;\n  width: 100%;\n  top: 0;\n  background-color: var(--base-color-white);\n  z-index: ", ";\n"])), zIndexes.anchor);
@@ -4108,7 +4103,7 @@ var AnchorTabBar = function AnchorTabBar(_ref) {
   var tabs = _ref.tabs,
       onTabClick = _ref.onTabClick,
       activeTab = _ref.activeTab,
-      topOffsetForIOS = _ref.topOffsetForIOS;
+      absolutePositionParams = _ref.absolutePositionParams;
   var tabListRef = React.useRef(null);
   var wrapperRef = React.useRef(null);
 
@@ -4164,24 +4159,26 @@ var AnchorTabBar = function AnchorTabBar(_ref) {
 
     var wrapperEl = wrapperRef.current;
     wrapperEl.style.position = 'absolute';
-    wrapperEl.style.visibility = showWrapper && topOffset ? 'visible' : 'hidden';
-    if (showWrapper && topOffset) wrapperEl.style.top = topOffset + "px";
+    wrapperEl.style.visibility = showWrapper && topOffset !== undefined ? 'visible' : 'hidden';
+    if (showWrapper && topOffset !== undefined) wrapperEl.style.top = topOffset + "px";
   };
 
   var handleScrollOnIOS = function handleScrollOnIOS() {
-    var topOffset = topOffsetForIOS;
-    console.log(window.pageYOffset);
+    var _absolutePositionPara = absolutePositionParams.navigationHeight,
+        navigationHeight = _absolutePositionPara === void 0 ? 0 : _absolutePositionPara,
+        _absolutePositionPara2 = absolutePositionParams.topOffset,
+        topOffset = _absolutePositionPara2 === void 0 ? 0 : _absolutePositionPara2;
 
-    if (wrapperRef.current && window.pageYOffset > topOffset) {
+    if (wrapperRef.current && window.pageYOffset > topOffset + navigationHeight) {
       changeWrapperVisibilityOnOIS();
-    } else if (wrapperRef.current && window.pageYOffset < topOffset) {
+    } else if (wrapperRef.current && window.pageYOffset < topOffset + navigationHeight) {
       changeWrapperVisibilityOnOIS(true, topOffset);
     }
 
     if (timer !== null) clearTimeout(timer);
     timer = setTimeout(function () {
-      if (window.pageYOffset > topOffset && wrapperRef.current) {
-        changeWrapperVisibilityOnOIS(true, window.pageYOffset);
+      if (window.pageYOffset > topOffset + navigationHeight && wrapperRef.current) {
+        changeWrapperVisibilityOnOIS(true, window.pageYOffset - topOffset);
       }
     }, 300);
   }; // We use this behavior only on iOS devices because there is a known issue that
@@ -4189,7 +4186,7 @@ var AnchorTabBar = function AnchorTabBar(_ref) {
 
 
   React.useEffect(function () {
-    if (topOffsetForIOS && isIOSDevice()) {
+    if (absolutePositionParams) {
       document.addEventListener('scroll', handleScrollOnIOS);
       return function () {
         document.removeEventListener('scroll', handleScrollOnIOS);