import type { ElementTarget } from "../use-target-element/index.cjs"; interface UseVirtualListBaseOptions { /** * The ElementTarget that should be used as the container. Usually, it should be scrollable (overflow scroll). */ containerTarget: NonNullable>; /** * The ElementTarget that should be used as the wrapper, which contains the list of items directly. * * The margin and height (width for horizontal) of the wrapper element will be set to the total height (width) of all items. */ wrapperTarget: NonNullable>; /** * The number of items that should be rendered in the viewport. * * @defaultValue 5 */ overscan?: number; } interface UseVerticalVirtualListOptions extends UseVirtualListBaseOptions { /** * The height of each item, or a function that returns the height of each item. * * When `itemHeight` is set, the list will be rendered vertically. */ itemHeight: number | ((index: number, item: D) => number); } interface UseHorizontalVirtualListOptions extends UseVirtualListBaseOptions { /** * The width of each item, or a function that returns the width of each item. * * When `itemWidth` is set and `itemHeight` is not set, the list will be rendered horizontally. */ itemWidth: number | ((index: number, item: D) => number); } export type UseVirtualListOptions = UseVerticalVirtualListOptions | UseHorizontalVirtualListOptions; export interface UseVirtualListReturnsActions { /** * Scroll to the item at the specified index, automatically use vertical or horizontal scrolling based on the options. * * @param {Number} index The index of the item to scroll to. */ scrollTo: (index: number) => void; /** * Scroll to the start of the list, automatically use vertical or horizontal scrolling based on the options. */ scrollToStart: () => void; /** * Scroll to the end of the list, automatically use vertical or horizontal scrolling based on the options. */ scrollToEnd: () => void; } export interface UseVirtualListReturnsListItem { /** * The data of the item. */ data: D; /** * The index of the item. */ index: number; } export type UseVirtualListReturns = readonly [ /** * The list of items that should be rendered. */ list: UseVirtualListReturnsListItem[], /** * The actions that can be used to control the list. */ UseVirtualListReturnsActions ]; /** * A React Hook that helps to render large lists (known as **Virtual List**) more efficiently by rendering only the items that are visible to the user, supporting dynamic heights, horizontal and vertical scrolling, and more. * * @since 1.6.0 */ export declare function useVirtualList(list: D[], options: UseVirtualListOptions): UseVirtualListReturns; export {};