@ticketboothapp/booking 1.2.41 → 1.2.42

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ticketboothapp/booking",
-  "version": "1.2.41",
+  "version": "1.2.42",
   "private": false,
   "sideEffects": [
     "**/*.css",

package/src/components/booking/BookingFlow.tsx

@@ -1408,7 +1408,6 @@ export function BookingFlow({
   // Detect when itinerary box becomes sticky
   // In viavia the scroll usually happens inside the dialog content div, not window.
   // On full-page partner layouts, we instead listen to window scroll (useWindowScroll = true).
-  const lastStickyChangeRef = useRef<number>(0);
   useEffect(() => {
     const el = itineraryRef.current;
     if (!el) return;
@@ -1423,56 +1422,32 @@ export function BookingFlow({
       return null;
     };
 
-    const scrollParent = findScrollParent(el);
-    const scrollTarget =
-      useWindowScroll || !scrollParent
-        ? (typeof window !== 'undefined' ? window : null)
-        : scrollParent;
-
-    let ticking = false;
-    const COOLDOWN_MS = 600; // After a state change, ignore reverse changes for this long (covers 0.25s collapse animation + layout settle)
-    const atTopBand = 48; // px - must scroll back up past this band to expand again (wider = less oscillation at edges)
+    const scrollParent = !useWindowScroll ? findScrollParent(el) : null;
 
     const updateStickyState = () => {
       if (!itineraryRef.current) return;
 
       const rect = itineraryRef.current.getBoundingClientRect();
-      const currentTop = rect.top;
-      const wasSticky = isItineraryStickyRef.current;
-
       const containerTop =
         scrollParent && !useWindowScroll ? scrollParent.getBoundingClientRect().top : 0;
       const topInset = Math.max(0, flowUi?.itineraryStickyTopOffsetPx ?? 0);
-      const stickLine = containerTop + topInset;
-      const enterStickyThreshold = stickLine + 1;
-      const nextSticky = wasSticky
-        ? currentTop >= stickLine - atTopBand && currentTop <= stickLine + atTopBand
-        : currentTop <= enterStickyThreshold;
-
-      if (nextSticky !== wasSticky) {
-        const now = Date.now();
-        if (now - lastStickyChangeRef.current < COOLDOWN_MS) return; // Cooldown: prevent rapid toggling
-
-        lastStickyChangeRef.current = now;
+      const nextSticky = rect.top <= containerTop + topInset + 1;
+      if (nextSticky !== isItineraryStickyRef.current) {
         isItineraryStickyRef.current = nextSticky;
         setIsItinerarySticky(nextSticky);
       }
     };
 
-    const handleScroll = () => {
-      if (!ticking) {
-        window.requestAnimationFrame(() => {
-          updateStickyState();
-          ticking = false;
-        });
-        ticking = true;
-      }
-    };
-
-    if (scrollTarget) {
-      scrollTarget.addEventListener('scroll', handleScroll, { passive: true });
+    // Listen to both potential emitters; some embeds scroll window while the flow sits in a nested container.
+    const targets: EventTarget[] = [];
+    if (scrollParent) targets.push(scrollParent);
+    if (typeof window !== 'undefined') targets.push(window);
+    if (targets.length > 0) {
+      targets.forEach((target) => target.addEventListener('scroll', updateStickyState, { passive: true }));
       updateStickyState();
-      return () => scrollTarget.removeEventListener('scroll', handleScroll);
+      return () => {
+        targets.forEach((target) => target.removeEventListener('scroll', updateStickyState));
+      };
     }
     return undefined;
   }, [selectedDate, selectedAvailability, useWindowScroll, flowUi?.itineraryStickyTopOffsetPx]); // Re-check when itinerary / scroll mode / host chrome changes