next-data-kit 7.6.4 → 7.6.6

package/dist/index.js

@@ -1818,7 +1818,11 @@ var DataKitInfinityInner = (props, ref) => {
       }, {})
     }
   });
-  const { ref: loadMoreRef, inView } = useInView({
+  const { ref: loadMoreBottomRef, inView: inViewBottom } = useInView({
+    threshold: 0,
+    rootMargin: "100px"
+  });
+  const { ref: loadMoreTopRef, inView: inViewTop } = useInView({
     threshold: 0,
     rootMargin: "100px"
   });
@@ -1900,26 +1904,15 @@ var DataKitInfinityInner = (props, ref) => {
     }
   }, [dataKit.items, dataKit.page, inverse]);
   useEffect(() => {
-    if (inView && !inverse) {
+    if (inViewBottom && !inverse) {
       loadMore();
     }
-  }, [inView, inverse, loadMore]);
+  }, [inViewBottom, inverse, loadMore]);
   useEffect(() => {
-    if (!inverse) return;
-    const handleScroll = () => {
-      const container2 = scrollContainerRef.current;
-      if (!container2) return;
-      if (container2.scrollTop === 0 && !dataKit.state.isLoading && dataKit.state.hasNextPage) {
-        loadMore();
-      }
-    };
-    const container = scrollContainerRef.current;
-    if (container) {
-      container.addEventListener("scroll", handleScroll);
-      return () => container.removeEventListener("scroll", handleScroll);
+    if (inViewTop && inverse) {
+      loadMore();
     }
-    return void 0;
-  }, [inverse, loadMore, dataKit.state.isLoading, dataKit.state.hasNextPage]);
+  }, [inViewTop, inverse, loadMore]);
   const enhancedDataKit = {
     ...dataKit,
     items: allItems
@@ -1996,12 +1989,12 @@ var DataKitInfinityInner = (props, ref) => {
         }
       ),
       !manual && isPullRefreshing && /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center py-4", children: /* @__PURE__ */ jsx(Loader2, { className: "size-6 animate-spin text-muted-foreground" }) }),
-      !manual && inverse && dataKit.state.hasNextPage && dataKit.state.isLoading && /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center py-4", children: /* @__PURE__ */ jsx(Loader2, { className: "size-6 animate-spin text-muted-foreground" }) }),
+      inverse && /* @__PURE__ */ jsx("div", { ref: loadMoreTopRef, className: manual ? "" : "flex items-center justify-center py-4", children: !manual && dataKit.state.hasNextPage && dataKit.state.isLoading && /* @__PURE__ */ jsx(Loader2, { className: "size-6 animate-spin text-muted-foreground" }) }),
       manual ? children(enhancedDataKit) : /* @__PURE__ */ jsxs(Fragment, { children: [
         children(enhancedDataKit),
         !dataKit.state.isLoading && allItems.length === 0 && /* @__PURE__ */ jsx("div", { className: "flex h-48 items-center justify-center text-muted-foreground", children: "No results found." })
       ] }),
-      !inverse && /* @__PURE__ */ jsx("div", { ref: loadMoreRef, className: manual ? "" : "flex items-center justify-center py-4", children: !manual && /* @__PURE__ */ jsxs(Fragment, { children: [
+      !inverse && /* @__PURE__ */ jsx("div", { ref: loadMoreBottomRef, className: manual ? "" : "flex items-center justify-center py-4", children: !manual && /* @__PURE__ */ jsxs(Fragment, { children: [
         dataKit.state.isLoading && /* @__PURE__ */ jsx(Loader2, { className: "size-6 animate-spin text-muted-foreground" }),
         !dataKit.state.isLoading && !dataKit.state.hasNextPage && allItems.length > 0 && /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: "You're all set" })
       ] }) })