@visa/nova-react/use-pagination/index.d.ts

Visa Product Design System Nova React library. Compatible with React ^19.

type UsePaginationOptions = {
    /** Max block length for all blocks, this gets overwritten by `startBlockMaxLength`, `middleBlockMaxLength`, `endBlockMaxLength` */
    blockMaxLength?: number;
    /** Doesn't chunk pages */
    compact?: boolean;
    /** Default selected page */
    defaultSelected?: number;
    /** Maximum length of pages to show on the end pagination block */
    endBlockMaxLength?: number;
    /** Maximum page number to be shown, (default null for no maximum) */
    maxPageNumber?: number | null;
    /** Maximum length of pages to show on the middle pagination block */
    middleBlockMaxLength?: number;
    /** Currently selected page (controlled) */
    selectedPage?: number;
    /** Function to set the selected page (controlled) */
    setSelectedPage?: (page: number) => void;
    /** What to separate the pagination array up with, usually this separator will be replaced with icon or ellipses when shown in the UI */
    separator?: number | string;
    /** Maximum length of pages to show on the start pagination block */
    startBlockMaxLength?: number;
    /** Start from this page */
    startPage?: number;
    /** Length of total pages */
    totalPages: number;
};
/**
 * @docs {@link https://design.visa.com/components/pagination/?code_library=react | See Docs}
 * @description This hook is used to manage pagination events, state, and visible page blocks. Supports both controlled and uncontrolled usage.
 * @related pagination
 * @vgar TODO
 * @wcag TODO
 */
export declare const usePagination: {
    (usePaginationOptions?: UsePaginationOptions): {
        /** Is first page currently selected */
        isFirstPage: boolean;
        /** Is last page currently selected */
        isLastPage: boolean;
        /** Event to handle first page selection */
        onFirstPage: () => void;
        /** Event to handle last page selection */
        onLastPage: () => void;
        /** Event to handle next page selection */
        onNextPage: () => void;
        /** Event to handle page selection */
        onPageChange: (pageNumber: number) => void;
        /** Event to handle previous page selection */
        onPreviousPage: () => void;
        /** Array of currently visible pages split by separator */
        pages: (string | number)[];
        /** Currently selected page */
        selectedPage: number;
    };
    displayName: string;
};
export default usePagination;
export { calculatePagesFromTo, calculateTotalPages } from './utils';