@inertiajs/core 2.2.4 → 2.2.5

package/dist/index.esm.js

@@ -2186,11 +2186,12 @@ var getScrollableParent = (element) => {
 };
 var getElementsInViewportFromCollection = (referenceElement, elements) => {
   const referenceIndex = elements.indexOf(referenceElement);
-  const visibleElements = [];
+  const upwardElements = [];
+  const downwardElements = [];
   for (let i = referenceIndex; i >= 0; i--) {
     const element = elements[i];
     if (elementInViewport(element)) {
-      visibleElements.push(element);
+      upwardElements.push(element);
     } else {
       break;
     }
@@ -2198,12 +2199,12 @@ var getElementsInViewportFromCollection = (referenceElement, elements) => {
   for (let i = referenceIndex + 1; i < elements.length; i++) {
     const element = elements[i];
     if (elementInViewport(element)) {
-      visibleElements.push(element);
+      downwardElements.push(element);
     } else {
       break;
     }
   }
-  return visibleElements;
+  return [...upwardElements.reverse(), ...downwardElements];
 };
 
 // src/formObject.ts
@@ -2379,6 +2380,7 @@ var useInfiniteScrollData = (options) => {
   };
   const { previousPage, nextPage, currentPage: lastLoadedPage } = getScrollPropFromCurrentPage();
   const state = {
+    component: page.get().component,
     loading: false,
     previousPage,
     nextPage,
@@ -2393,7 +2395,10 @@ var useInfiniteScrollData = (options) => {
     state.lastLoadedPage = rememberedState.lastLoadedPage;
     state.requestCount = rememberedState.requestCount || 0;
   }
-  const removeEventListener = router.on("success", () => {
+  const removeEventListener = router.on("success", (event) => {
+    if (state.component !== event.detail.page.component) {
+      return;
+    }
     const scrollProp = getScrollPropFromCurrentPage();
     if (scrollProp.reset) {
       state.previousPage = scrollProp.previousPage;
@@ -2528,8 +2533,7 @@ var useInfiniteScrollElementManager = (options) => {
     });
     itemsMutationObserver.observe(options.getItemsElement(), { childList: true });
     itemsObserver = intersectionObservers.new(
-      (entry) => options.onItemIntersected(entry.target),
-      { threshold: 0 }
+      (entry) => options.onItemIntersected(entry.target)
     );
     const observerOptions = {
       root: options.getScrollableParent(),
@@ -2566,6 +2570,7 @@ var useInfiniteScrollElementManager = (options) => {
     }
   };
   const flushAll = () => {
+    disableTriggers();
     intersectionObservers.flushAll();
     itemsMutationObserver?.disconnect();
   };
@@ -2667,13 +2672,49 @@ var useInfiniteScrollElementManager = (options) => {
 };
 
 // src/infiniteScroll/queryString.ts
+var queue3 = new Queue();
+var initialUrl;
+var payloadUrl;
 var useInfiniteScrollQueryString = (options) => {
+  let enabled = true;
+  const queuePageUpdate = (page2) => {
+    queue3.add(() => {
+      return new Promise((resolve) => {
+        if (!enabled) {
+          initialUrl = payloadUrl = null;
+          return resolve();
+        }
+        if (!initialUrl || !payloadUrl) {
+          initialUrl = new URL(window.location.href);
+          payloadUrl = new URL(window.location.href);
+        }
+        const pageName = options.getPageName();
+        const searchParams = payloadUrl.searchParams;
+        if (page2 === "1") {
+          searchParams.delete(pageName);
+        } else {
+          searchParams.set(pageName, page2);
+        }
+        setTimeout(() => resolve());
+      });
+    }).finally(() => {
+      if (enabled && initialUrl && payloadUrl && initialUrl.href !== payloadUrl.href) {
+        router.replace({
+          url: payloadUrl.toString(),
+          preserveScroll: true,
+          preserveState: true
+        });
+      }
+      initialUrl = payloadUrl = null;
+    });
+  };
   const onItemIntersected = debounce((itemElement) => {
-    if (options.shouldPreserveUrl() || !itemElement) {
+    const itemsElement = options.getItemsElement();
+    if (!enabled || options.shouldPreserveUrl() || !itemElement || !itemsElement) {
       return;
     }
     const pageMap = /* @__PURE__ */ new Map();
-    const elements = [...options.getItemsElement().children];
+    const elements = [...itemsElement.children];
     getElementsInViewportFromCollection(itemElement, elements).forEach((element) => {
       const page2 = getPageFromElement(element) ?? "1";
       if (pageMap.has(page2)) {
@@ -2684,23 +2725,13 @@ var useInfiniteScrollQueryString = (options) => {
     });
     const sortedPages = Array.from(pageMap.entries()).sort((a, b) => b[1] - a[1]);
     const mostVisiblePage = sortedPages[0]?.[0];
-    if (mostVisiblePage === void 0) {
-      return;
+    if (mostVisiblePage !== void 0) {
+      queuePageUpdate(mostVisiblePage);
     }
-    const url = new URL(window.location.href);
-    if (mostVisiblePage === "1") {
-      url.searchParams.delete(options.getPageName());
-    } else {
-      url.searchParams.set(options.getPageName(), mostVisiblePage.toString());
-    }
-    router.replace({
-      url: url.toString(),
-      preserveScroll: true,
-      preserveState: true
-    });
   }, 250);
   return {
-    onItemIntersected
+    onItemIntersected,
+    cancel: () => enabled = false
   };
 };
 
@@ -2830,7 +2861,12 @@ function useInfiniteScroll(options) {
   };
   return {
     dataManager,
-    elementManager
+    elementManager,
+    flush: () => {
+      dataManager.removeEventListener();
+      elementManager.flushAll();
+      queryStringManager.cancel();
+    }
   };
 }
 
@@ -2888,7 +2924,7 @@ var set4 = (n) => {
   const speed = settings.speed;
   const ease = settings.easing;
   progress3.offsetWidth;
-  queue3((next) => {
+  queue4((next) => {
     const barStyles = (() => {
       if (settings.positionUsing === "translate3d") {
         return {
@@ -3020,7 +3056,7 @@ function clamp(n, min, max) {
   return n;
 }
 var toBarPercentage = (n) => (-1 + n) * 100;
-var queue3 = /* @__PURE__ */ (() => {
+var queue4 = /* @__PURE__ */ (() => {
   const pending = [];
   const next = () => {
     const fn = pending.shift();