@jsenv/navi 0.29.477 → 0.29.478

package/dist/jsenv_navi.js

@@ -11872,7 +11872,7 @@ const putBack = (restoration) => {
     // The page is not whole yet: the last release puts it back.
     return;
   }
-  if (documentHoldCount) {
+  if (isDocumentHeld()) {
     pendingRestoration = null;
     return;
   }
@@ -11888,20 +11888,33 @@ const putBack = (restoration) => {
 // height, so the same pixels now fall on other rows. Put back after the list
 // has placed itself, they would undo it, in the very picture a route transition
 // takes. So the list holds the document while it is placing itself, and the
-// url's offset is not put back meanwhile. Counted: two lists can share one
-// document.
-let documentHoldCount = 0;
-const holdDocumentScroll = () => {
-  documentHoldCount++;
-  let released = false;
+// url's offset is not put back meanwhile. One hold per list: two lists can
+// share one document.
+//
+// A hold is for the page its list is on, and mounted is not shown: a page kept
+// while its route transition plays still has its list when the page returned to
+// renders, and that list says nothing about where the page arriving goes. So a
+// hold is taken with the list's page (RoutePageContext), asked whether it is
+// shown when a position is due — `null` outside any route container: that list
+// is on whatever page is shown. Not a url: which page an address shows is the
+// routes' to say, and one page can be shown under several (its params moving
+// under it).
+const documentHolds = new Set();
+const holdDocumentScroll = (routePage) => {
+  const hold = { routePage };
+  documentHolds.add(hold);
   return () => {
-    if (released) {
-      return;
-    }
-    released = true;
-    documentHoldCount--;
+    documentHolds.delete(hold);
   };
 };
+const isDocumentHeld = () => {
+  for (const { routePage } of documentHolds) {
+    if (routePage === null || routePage.isShown()) {
+      return true;
+    }
+  }
+  return false;
+};
 
 // What a page holds instead: not the place, which stays the url's, but the
 // moment it is put back (see useHoldScrollRestoration). Counted: several parts
@@ -12159,9 +12172,9 @@ const restoreScrollPosition = (url) => {
   if (!position) {
     return false;
   }
-  if (documentHoldCount) {
-    // There is a place to go back to, and the list holding the document is
-    // putting it back (see holdDocumentScroll).
+  if (isDocumentHeld()) {
+    // There is a place to go back to, and the list holding the document on
+    // that page is putting it back (see holdDocumentScroll).
     return true;
   }
   scrollTo(position);
@@ -78038,6 +78051,19 @@ const useListScrollSync = ({
     // eslint-disable-next-line no-unused-expressions
     virtualItemSizeSignal.value;
   }
+  // The hold ending — the user reaching for the list, something else moving
+  // it, the item it opens on never coming — ends its hold on the document with
+  // it (see holdDocumentScroll), rather than at the next render, which nothing
+  // owes: an offset put back on this page meanwhile is the reader's.
+  const releaseDocumentHoldRef = useRef(null);
+  const letGo = () => {
+    startPlaceRef.current.userTookOver = true;
+    const releaseDocumentHold = releaseDocumentHoldRef.current;
+    if (releaseDocumentHold) {
+      releaseDocumentHoldRef.current = null;
+      releaseDocumentHold();
+    }
+  };
   // Set around a scroll the list performs itself. What it protects against is
   // not the scroll event as such, but what the listener would conclude from it:
   // the position it is about to read was chosen to keep the items where they
@@ -78271,7 +78297,7 @@ const useListScrollSync = ({
         }
         openAt = scrolledFallback;
         if (openAt === "start" || openAt === undefined) {
-          startPlaceRef.current.userTookOver = true;
+          letGo();
           return;
         }
       } else {
@@ -78423,13 +78449,39 @@ const useListScrollSync = ({
   }, []);
   // Held on an item of a list scrolling the document: where the document goes is
   // this list's to say, measured on the item, not the url's offset in pixels
-  // (see holdDocumentScroll).
+  // (see holdDocumentScroll). The hold read again: a layout effect of this
+  // commit may have let go already (see placeWhereHeld).
+  const routePage = useContext(RoutePageContext);
   useLayoutEffect(() => {
-    if (!heldSomewhere || getScroller() !== document.scrollingElement) {
+    if (!heldSomewhere || startPlaceRef.current.userTookOver || getScroller() !== document.scrollingElement) {
       return undefined;
     }
-    return holdDocumentScroll();
-  }, [heldSomewhere, scrollerElResolved]);
+    const releaseDocumentHold = holdDocumentScroll(routePage);
+    releaseDocumentHoldRef.current = releaseDocumentHold;
+    return () => {
+      releaseDocumentHoldRef.current = null;
+      releaseDocumentHold();
+    };
+  }, [heldSomewhere, scrolledWanted, scrollerElResolved]);
+  // A page kept while its route transition plays is hidden until it is taken
+  // down: nothing of the list can be measured there any more, and its scroller
+  // shows the page arriving (see route_page_context.js). So the list lets go of
+  // it, and stops answering its resizes and scrolls: measured hidden, every
+  // item stands at 0×0, and the top item put back where it was would scroll
+  // the page arriving by that item's offset. Kept mounted on purpose, so the
+  // listeners stay; what they would do is what ends.
+  const pageLeftRef = useRef(false);
+  useLayoutEffect(() => {
+    if (!routePage) {
+      return undefined;
+    }
+    return routePage.leavingSignal.subscribe(leaving => {
+      if (leaving) {
+        pageLeftRef.current = true;
+        letGo();
+      }
+    });
+  }, []);
   // What to do when the list's own geometry moves under it, kept fresh for the
   // observer below (which is installed once).
   const onGeometryChangeRef = useRef(null);
@@ -78463,18 +78515,15 @@ const useListScrollSync = ({
       return undefined;
     }
     const scrollerEl = getScroller();
-    const takeOver = () => {
-      startPlaceRef.current.userTookOver = true;
-    };
     const takeOverEvents = ["wheel", "touchstart", "pointerdown", "keydown"];
     for (const type of takeOverEvents) {
-      scrollerEl.addEventListener(type, takeOver, {
+      scrollerEl.addEventListener(type, letGo, {
         passive: true
       });
     }
     return () => {
       for (const type of takeOverEvents) {
-        scrollerEl.removeEventListener(type, takeOver);
+        scrollerEl.removeEventListener(type, letGo);
       }
     };
   }, [scrolledWanted, scrollerElResolved]);
@@ -78631,6 +78680,9 @@ const useListScrollSync = ({
       }
     };
     const observer = new ResizeObserver(entries => {
+      if (pageLeftRef.current) {
+        return;
+      }
       // A box that grows may be a box that starts to scroll — the scroller is
       // resolved again before anything is done about the resize, so that a
       // list which has outgrown a bounded ancestor stops holding on to the
@@ -79035,6 +79087,9 @@ const useListScrollSync = ({
     }
     const scrollerEl = getScroller();
     const onScroll = () => {
+      if (pageLeftRef.current) {
+        return;
+      }
       // Which way the user is going, read before the position is stored: what
       // the window keeps ahead is ahead of this.
       const previousScroll = currentScrollRef.current;
@@ -79092,7 +79147,7 @@ const useListScrollSync = ({
       const low = way.from < way.to ? way.from : way.to;
       const high = way.from < way.to ? way.to : way.from;
       if (position < low - 1 || position > high + 1) {
-        place.userTookOver = true;
+        letGo();
       }
     };
     // A page-level scroller does not emit "scroll" on the element itself