import { RefObject } from 'react';
export interface UseInfiniteScrollOptions {
    /**
     * Called when the sentinel enters the viewport. Append new items to your
     * list state, do not replace the existing items.
     */
    next: () => void;
    /**
     * Whether more data exists to load. Set to false when you have fetched all
     * pages, the observer disconnects and stops calling next().
     */
    hasMore: boolean;
    /**
     * Total number of items currently rendered. Resets the load guard so the
     * next page can be triggered after new items arrive. Pass the length of
     * your full accumulated list, not just the current page.
     */
    dataLength: number;
    /**
     * How close to the sentinel before next() fires.
     * - Number 0–1: fraction of container height, e.g. 0.8 triggers at 80%.
     * - Pixel string: absolute offset, e.g. "200px" triggers 200 px before end.
     * @default 0.8
     */
    scrollThreshold?: number | string;
    /**
     * A scrollable parent element (or its DOM id string) to use as the
     * IntersectionObserver root. Defaults to the viewport when omitted.
     */
    scrollableTarget?: HTMLElement | string | null;
    /**
     * Reverse scroll direction, sentinel is observed from the top. Use for
     * chat or messaging UIs with flex-direction: column-reverse.
     * @default false
     */
    inverse?: boolean;
}
export interface UseInfiniteScrollResult {
    /**
     * Attach this ref to a div at the bottom of your list (or top for inverse
     * mode). When it enters the viewport the hook calls next().
     *
     * @example
     * <ul>
     *   {items.map(item => <li key={item.id}>{item.name}</li>)}
     *   <li ref={sentinelRef} />
     * </ul>
     */
    sentinelRef: RefObject<HTMLDivElement | null>;
    /**
     * True from when the sentinel fires until dataLength changes (i.e. new
     * data has arrived). Use this to show your own loading indicator.
     */
    isLoading: boolean;
}
/**
 * Low-level hook for building custom infinite scroll UIs.
 *
 * Manages an IntersectionObserver that watches a sentinel element you place
 * at the end of your list. When the sentinel enters the viewport, next() is
 * called. The hook handles deduplication and resets automatically when
 * dataLength changes.
 *
 * Use the InfiniteScroll component instead if you want a ready-made wrapper
 * with built-in loader, endMessage, pull-to-refresh, and inverse scroll UI.
 *
 * @example Basic usage
 * ```tsx
 * function Feed() {
 *   const [items, setItems] = useState(initialItems);
 *   const [hasMore, setHasMore] = useState(true);
 *
 *   const { sentinelRef, isLoading } = useInfiniteScroll({
 *     next: async () => {
 *       const more = await fetchItems(items.length);
 *       if (more.length === 0) { setHasMore(false); return; }
 *       setItems(prev => [...prev, ...more]);
 *     },
 *     hasMore,
 *     dataLength: items.length,
 *   });
 *
 *   return (
 *     <ul>
 *       {items.map(item => <li key={item.id}>{item.name}</li>)}
 *       <li ref={sentinelRef} aria-hidden />
 *       {isLoading && <li>Loading...</li>}
 *     </ul>
 *   );
 * }
 * ```
 */
export declare function useInfiniteScroll({ next, hasMore, dataLength, scrollThreshold, scrollableTarget, inverse, }: UseInfiniteScrollOptions): UseInfiniteScrollResult;
//# sourceMappingURL=useInfiniteScroll.d.ts.map