@jsenv/navi 0.29.514 → 0.29.516

package/dist/dev/jsenv_navi.js

@@ -489,32 +489,33 @@ const MountAfterPaint = ({
 /**
  * Builds, now, every box still waiting whose top is above `bottom` (in the
  * document's coordinates): what the document will show once scrolled so that
- * `bottom` is the bottom of the screen. Boxes built push those below them
- * further down, so the ones measured above `bottom` are all the ones that can
- * be shown there, and a few more at worst.
+ * `bottom` is the bottom of the screen.
+ *
+ * Each box is read once those before it have their height. A box has no height
+ * until it is built, so read together they would all stand at the end of what
+ * is built, above `bottom` as soon as the offset is worth a screen: a page of
+ * sections would be built whole before its first frame. A box found below
+ * `bottom` waits: a build only pushes it further down, and where it stands
+ * already makes the document tall enough for the offset.
+ *
+ * The walk follows the set live, in mount order: a box mounted by a build is
+ * read too. One standing higher than boxes built before it (mounted later) can
+ * leave a few built that the offset does not show, never one missing that it
+ * does.
  *
  * Renders synchronously, so it must be called outside a Preact commit: a render
  * flushed from a layout effect runs inside the commit still walking the tree.
  */
 const buildDeferredBoxesAbove = bottom => {
-  if (deferredBoxes.size === 0) {
-    return;
-  }
-  const toBuild = [];
   for (const deferredBox of deferredBoxes) {
     const top = readTopInWindow(deferredBox.getElement());
-    if (top !== null && top + window.scrollY < bottom) {
-      toBuild.push(deferredBox);
+    if (top === null || top + window.scrollY >= bottom) {
+      continue;
     }
-  }
-  if (toBuild.length === 0) {
-    return;
-  }
-  flushSyncRendering(() => {
-    for (const deferredBox of toBuild) {
+    flushSyncRendering(() => {
       deferredBox.build();
-    }
-  });
+    });
+  }
 };
 
 // null for a box nothing draws (a closed popup, a hidden tab): no frame shows
@@ -10839,6 +10840,12 @@ const startAtTop = (url, { from } = {}) => {
   // position to come back to — the return would keep the offset of the page
   // being left.
   positionByUrl.set(href, { x: 0, y: 0 });
+  // A list holding the document on the page arriving has placed it already: a
+  // navigation holding the rendering gets here after that render, and nothing
+  // owes the list another commit to put it back (see holdDocumentScroll).
+  if (isDocumentHeld()) {
+    return;
+  }
   window.scrollTo({ top: 0, left: 0, behavior: "instant" });
 };
 // Also what decides whether a push carries the state of the page it keeps
@@ -10973,6 +10980,19 @@ const recallScrollerPosition = (name) => {
   return positionByName.get(name);
 };
 
+// Said by a scroller sent back to its start while it stays mounted: where it
+// was is a place in what it no longer shows, so nothing is carried and nothing
+// is come back to under this address until it says where it is again. What it
+// said under another address stays, for the way back to that address.
+const forgetScrollerPosition = (name) => {
+  loadStore();
+  saidByScrollerName.delete(name);
+  const positionByName = scrollerPositionsByUrl.get(readShownUrl());
+  if (positionByName) {
+    positionByName.delete(name);
+  }
+};
+
 // Said by a scroller as it unmounts. Its page is being left when the url is
 // already another one — the history is written before the page it names is
 // taken down — and then its position is kept for the way back. The url still
@@ -14010,10 +14030,17 @@ const isRenderingPageChange = () => renderingPageChange;
  *   outside any render — by a subscription deciding whether to re-render, by
  *   the scroll restoration when a position is due — and it reads the routes
  *   untracked, so asking subscribes nobody to them.
- * - `leavingSignal` — true once the page is hidden and kept while its movement
- *   plays: still mounted, so what it fills or moves outside its own nodes (a
- *   slot in a bar, the document a list scrolls) steps out rather than showing
- *   with, or moving, the page arriving. Every box of it measures 0×0 by then.
+ * - `hasLeft()` — whether the page, or a page it sits in, is kept while leaving.
+ *   Written by the container's render, before anything below it renders, and
+ *   final. `isShown()` can answer false for a page that stays on screen (the
+ *   address coming back, a container first rendered while the routes are
+ *   frozen), so what cannot be undone asks this one.
+ * - `leavingSignal` — true once the page, or a page it sits in, is hidden and
+ *   kept while the movement plays: still mounted, so what it fills or moves
+ *   outside its own nodes (a slot in a bar, the document a list scrolls) steps
+ *   out rather than showing with, or moving, the page arriving. Every box of it
+ *   measures 0×0 by then. Set after the render keeping the page, so that render
+ *   and what it builds can only ask `hasLeft()`.
  */
 const RoutePageContext = createContext(null);
 
@@ -37873,7 +37900,7 @@ const useContentKeepingLeavingPages = (branch, readShownBranch, parentPage) => {
         continue;
       }
       entry.hidden = true;
-      entry.page.leavingSignal.value = true;
+      entry.page.ownLeavingSignal.value = true;
       // The page renders on its own while kept (a component reading a signal
       // the address moved), never through this container: a top node it
       // replaces lands between the markers unmarked, a text it writes shows
@@ -37961,11 +37988,21 @@ const hideNodesBetween = (start, end, observer) => {
 // page it sits in is shown itself. Never again once kept while leaving: coming
 // back to its route mounts the page anew.
 const createRoutePage = (readShownBranch, parentPage) => {
+  const ownLeavingSignal = signal(false);
   const page = {
     branchId: null,
     element: undefined,
     left: false,
-    leavingSignal: signal(false),
+    ownLeavingSignal,
+    // A page nested in one that left is hidden with it, even while its own
+    // container goes on picking it (a route matching on both sides).
+    leavingSignal: parentPage ? computed(() => ownLeavingSignal.value || parentPage.leavingSignal.value) : ownLeavingSignal,
+    hasLeft: () => {
+      if (page.left) {
+        return true;
+      }
+      return parentPage ? parentPage.hasLeft() : false;
+    },
     isShown: () => {
       if (page.left) {
         return false;
@@ -85860,6 +85897,7 @@ const ListUI = props => {
     scroller = "self",
     hoverWhileScrolling = false,
     scrollResetOnNavigation = false,
+    scrollResetKey,
     lockSize,
     columns,
     itemColumns,
@@ -85978,6 +86016,7 @@ const ListUI = props => {
     scrolled,
     defaultScrolled,
     onScrolledChange,
+    scrollResetKey,
     rememberScroll,
     listId: rest.id,
     scroller,
@@ -86348,6 +86387,7 @@ const useListScrollSync = ({
   scrolled,
   defaultScrolled,
   onScrolledChange,
+  scrollResetKey,
   rememberScroll,
   listId,
   scroller,
@@ -86356,6 +86396,8 @@ const useListScrollSync = ({
   columns
 }) => {
   const debugScroll = useDebugScroll();
+  // The offset a search gives back once emptied (see below).
+  const savedScrollRef = useRef(null);
   // Where the list must be: what the caller holds it at (`scrolled`), or where
   // it opens and then lets go (`defaultScrolled`). A `scrolled` that changes is
   // the caller moving the list, so the hold is armed again — that is what makes
@@ -86364,7 +86406,9 @@ const useListScrollSync = ({
   // one kept from the previous visit): followed for as long as nobody has
   // moved the list, and compared by value, since it is said at every render.
   // Nothing to hold it at (a position not saved yet) is not a position: the
-  // list opens where it opens.
+  // list opens where it opens. A `scrollResetKey` that changes sends it back to
+  // its start ("back_to_start", see placeBackAtStart), unless a `scrolled`
+  // changing in the same render says where it goes.
   const startPlaceRef = useRef(null);
   if (startPlaceRef.current === null) {
     startPlaceRef.current = {
@@ -86372,6 +86416,7 @@ const useListScrollSync = ({
       wanted: scrolled ?? defaultScrolled,
       scrolled,
       defaultScrolled,
+      scrollResetKey,
       way: null,
       arrived: false,
       // Whether the hold's writes glide (--navi-scroll:smooth).
@@ -86379,6 +86424,20 @@ const useListScrollSync = ({
     };
   } else {
     const place = startPlaceRef.current;
+    if (!compareTwoJsValues(place.scrollResetKey, scrollResetKey)) {
+      place.scrollResetKey = scrollResetKey;
+      place.wanted = "back_to_start";
+      place.userTookOver = false;
+      place.way = null;
+      place.arrived = false;
+      place.smooth = false;
+      // What the list said it was reading, and what a search would give back,
+      // are places in what it no longer shows.
+      savedScrollRef.current = null;
+      if (rememberScroll) {
+        forgetScrollerPosition(listId);
+      }
+    }
     if (place.scrolled !== scrolled) {
       place.scrolled = scrolled;
       place.defaultScrolled = defaultScrolled;
@@ -86387,7 +86446,7 @@ const useListScrollSync = ({
       place.smooth = false;
     } else if ((scrolled === undefined || scrolled === null) && !compareTwoJsValues(place.defaultScrolled, defaultScrolled)) {
       place.defaultScrolled = defaultScrolled;
-      if (!place.userTookOver) {
+      if (!place.userTookOver && place.wanted !== "back_to_start") {
         place.wanted = defaultScrolled;
         // Placed again from where it stands: the way to the previous place
         // says nothing about whose the next scrolls are.
@@ -86731,6 +86790,8 @@ const useListScrollSync = ({
       wantedStart = total - windowSize;
     } else if (typeof scrolledWanted === "number") {
       heldItem = scrolledWanted;
+    } else if (scrolledWanted === "back_to_start") {
+      heldItem = 0;
     } else if (scrolledWanted && scrolledWanted.id !== undefined) {
       const itemIndex = listItems.locateItem(scrolledWanted.id);
       if (itemIndex !== null) {
@@ -86966,7 +87027,6 @@ const useListScrollSync = ({
   // Lorsqu'on selectionne quelque chose pendant une recherche, alors ensuite meme si on clear
   // on veut pas revenir a la position scroll précédente car on veut garde l'item qu'on a selectionné visible
   // (pour l'instant pas grave car on travaille pour le mode select qui fermera le dialog au select)
-  const savedScrollRef = useRef(null);
   const topMatchScoresKeyRef = useRef("");
   const restoreScrollRafRef = useRef(null);
   useLayoutEffect(() => {
@@ -87076,6 +87136,10 @@ const useListScrollSync = ({
     if (scrolledWanted === "start" || scrolledWanted === undefined || startPlaceRef.current.userTookOver || !ref.current) {
       return;
     }
+    if (scrolledWanted === "back_to_start") {
+      placeBackAtStart();
+      return;
+    }
     if (listItems.totalSignal.peek() === 0 || virtualItemSizeSignal.peek() === 0) {
       return;
     }
@@ -87174,6 +87238,24 @@ const useListScrollSync = ({
     }
     sendHeldScroll(scrollNow + delta);
   };
+  // The start of the list, what comes before its first item included, not an
+  // item: a box of its own goes to 0. A box the list is further down of also
+  // shows what stands above it, the control that asked for this among others, so
+  // the list is brought back to the box's start and never sent forward to it.
+  const placeBackAtStart = () => {
+    const scrollerEl = getScroller();
+    if (ref.current.contains(scrollerEl)) {
+      sendHeldScroll(0);
+      return;
+    }
+    const scale = readScrollerScale(scrollerEl, horizontal);
+    const viewportRect = getScrollerViewportRect(scrollerEl);
+    const listRect = ref.current.getBoundingClientRect();
+    const offsetNow = (horizontal ? listRect.left - viewportRect.left : listRect.top - viewportRect.top) / scale;
+    const delta = offsetNow - getItemScrollInset(scrollerEl, ref.current, horizontal);
+    const scrollNow = horizontal ? scrollerEl.scrollLeft : scrollerEl.scrollTop;
+    sendHeldScroll(delta < 0 ? scrollNow + delta : scrollNow);
+  };
   // Every placement goes through here, the ones that find the list in place
   // too: it keeps the way from where the scroller was to where it is sent,
   // which is how a scroll event tells the hold's own scrolls from anyone
@@ -87396,27 +87478,35 @@ const useListScrollSync = ({
   // landing or resizing — and said again when it reads differently (`ifChanged`):
   // the same scroll, the screen said right.
   const announcedRef = useRef(null);
+  // A scroll landing past everything drawn (a key sending the list to its end,
+  // a hand on the scrollbar) has no item to read a position from: it is said by
+  // that re-read, even when it is the first thing the list has to say.
+  const reportOwedRef = useRef(false);
   const reportPosition = ({
     ifChanged
   } = {}) => {
     if (!ref.current) {
       return;
     }
-    if (ifChanged && !announcedRef.current) {
+    if (ifChanged && !announcedRef.current && !reportOwedRef.current) {
       return;
     }
     const remember = rememberScrollRef.current;
     const onScrolledChange = onScrolledChangeRef.current;
     const position = captureListAnchor(remember || Boolean(onScrolledChange));
     if (!position) {
+      if (!ifChanged) {
+        reportOwedRef.current = true;
+      }
       return;
     }
+    reportOwedRef.current = false;
     positionRef.current = position;
     if (!remember && !onScrolledChange) {
       return;
     }
     const scrolledNow = toScrolledPosition(position);
-    if (ifChanged && isSamePosition(scrolledNow, announcedRef.current)) {
+    if (ifChanged && announcedRef.current && isSamePosition(scrolledNow, announcedRef.current)) {
       return;
     }
     announcedRef.current = scrolledNow;
@@ -87972,10 +88062,9 @@ const useListScrollSync = ({
     // ends the hold like a wheel does — the ones that come with no input event
     // at all: the status bar tap on iOS, find in page, a script.
     // Only once the list has stood where it holds itself, though. Until then
-    // the page is still settling around it, and some of that is written after
-    // the list placed itself: a navigation holding the rendering for its
-    // transition takes the arriving page to its top once the page rendered
-    // (whenRenderingResumes), and the hold puts it back at its next commit.
+    // the page is still settling around it, and what that moves (a document
+    // still too short for the offset clamps it) the hold puts back at its next
+    // commit.
     const letGoUnlessHeldScroll = () => {
       const place = startPlaceRef.current;
       const way = place.way;
@@ -92044,6 +92133,7 @@ const ListResolved = /*#__PURE__*/createComponentResolver([ListFirstResolver, Li
  *   scroller?: "self" | "parent" | "document" | Element | {current: Element},
  *   hoverWhileScrolling?: boolean,
  *   scrollResetOnNavigation?: boolean,
+ *   scrollResetKey?: any,
  *   fallback?: import("preact").ComponentChildren,
  *   searchFallback?: import("preact").ComponentChildren,
  *   searchText?: string,
@@ -92288,6 +92378,15 @@ const ListResolved = /*#__PURE__*/createComponentResolver([ListFirstResolver, Li
  *   overwrite each other (see docs/scroll.md). A fresh arrival at the page
  *   opens at `defaultScrolled` either way, and so does a list the caller holds
  *   through `scrolled`.
+ * @param {any} [props.scrollResetKey]
+ *   What the list shows, said as a value: another order, another filter. When
+ *   it changes after mount (compared by value: `[order, filter]` can be written
+ *   at every render) the list goes back to its start before the paint, in
+ *   whichever box `scroller` names, and is held there until the user reaches
+ *   for it. A list whose start is in view in a box that also shows what stands
+ *   above it does not move. A `scrolled` changing in the same render wins. The
+ *   position remembered under the `id` for the address shown is dropped; see
+ *   docs/scroll.md.
  * @param {boolean} [props.deselectable]
  *   A single-select list allowed to hold nothing: the selected item, pressed
  *   again, lets go. Without it the list is a radio group — a choice, once
@@ -108993,9 +109092,9 @@ SidePanel.Foot = SidePanelFoot;
  * mount, or the first to render into an empty slot; later renders of a
  * `SlotFill` that is not the filler leave the slot alone. A `SlotFill`
  * unmounting empties the slot only while it is still that one, and so does one
- * in a page a route transition keeps while leaving (see keepLeavingPages in
- * nav/route.jsx): still mounted, hidden, it must neither stay in the slot nor
- * take it back from the page arriving.
+ * in or below a page a route transition keeps while leaving (see
+ * keepLeavingPages in nav/route.jsx): still mounted, hidden, it must neither
+ * stay in the slot nor take it back from the page arriving.
  *
  * **One `SlotFill`, rendered where the choice is made.** `isFilled` follows
  * the fills as they mount and unmount, in the order the tree walks them. A
@@ -109060,8 +109159,10 @@ const createSlot = (SlotRenderer = Box) => {
     }, []);
     // In a page kept while leaving: out of the slot as if unmounted, since
     // the page arriving is what the slot must show — or nothing, when it
-    // fills none.
-    if (routePage && routePage.leavingSignal.value) {
+    // fills none. The signal brings the render that steps out; hasLeft() refuses
+    // a fill built in a kept page (a wrapper changing shape rebuilds what it
+    // holds), which renders before that signal is set.
+    if (routePage && (routePage.leavingSignal.value || routePage.hasLeft())) {
       if (filler === fillerRef) {
         filler = null;
         slotPropsSignal.value = null;