@payfit/unity-components/dist/esm/components/table/parts/TablePagination.d.ts

import { VariantProps } from '@payfit/unity-themes';
import { PropsWithChildren } from 'react';
import { ClientSidePaginationProps } from '../../client-side-pagination/ClientSidePagination.js';
export declare const tablePagination: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, string[], {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, string[], unknown, unknown, undefined>>;
type PageSizeOption = {
    value: string;
    label: string;
};
export interface TablePaginationProps extends PropsWithChildren<VariantProps<typeof tablePagination>> {
    /**
     * The total number of pages to display
     */
    pageCount: number;
    /**
     * Represents the total number of rows that are available or being counted.
     * This variable typically holds a numeric value to indicate the total count of rows
     * relevant for a specific process, dataset, or operation.
     */
    rowCount: number;
    /**
     * The number of rows per page
     */
    rowsPerPage: number;
    /**
     * Represents the current page being viewed or processed in a paginated dataset.
     * This variable may be optional depending on the application logic and usage context,
     * and can hold either a numeric value indicating the current page or remain undefined
     * if not explicitly set.
     */
    currentPage?: number;
    /**
     * The initial page to display when in uncontrolled mode
     */
    defaultPage?: number;
    /**
     * Represents the default number of items to display per page in a paginated view.
     * The value is expected to correspond to one of the selectable options available via `PageSizeOption`.
     * This property is optional and can be left undefined, in which case a default behavior may apply.
     */
    defaultPageSize?: PageSizeOption['value'];
    /**
     * A callback function that is triggered when a page is hovered over in the pagination component.
     *
     * This function is intended for handling hover events on individual pagination controls or elements.
     * It is derived from the `onPageHover` property in the `Pagination` component.
     */
    onPageHover?: ClientSidePaginationProps['onPageHover'];
    /**
     * Callback fired when the page changes
     * @param page - The new page number
     * @param previous - The previous page number
     * @param direction - The direction of navigation (1 for forward, -1 for backward)
     */
    onPageChange?: ClientSidePaginationProps['onPageChange'];
    /**
     * Optional callback for next button press
     */
    onNextPress?: ClientSidePaginationProps['onNextPress'];
    /**
     * Optional callback for previous button press
     */
    onPreviousPress?: ClientSidePaginationProps['onPreviousPress'];
    /**
     * The options for the number of rows per page selection dropdown.
     * If not provided, the default options will be used.
     * @default [
     *   { value: '10', label: '10' },
     *   { value: '50', label: '50' },
     *   { value: '100', label: '100' },
     *   { value: '200', label: '200' },
     * ]
     */
    pageSizeOptions?: PageSizeOption[];
    /**
     * Callback fired when the number of rows per page changes
     * @param pageSize - The new number of rows per page
     */
    onPageSizeChange?: (pageSize: number) => void;
    /**
     * The label name that each row in the table represents
     * @default 'unity:component:table:pagination:item'
     */
    itemLabel?: string;
}
/**
 * The `TablePagination` component provides pagination controls for tables with large datasets.
 * It displays the current range of items being shown, pagination controls, and a dropdown to change the number of rows per page.
 * @note This is a **stateless** component, meaning that it does not manage its own state, and you have to provide the necessary callbacks to handle page changes and row count changes.
 * @param {TablePaginationProps} props - The props for the `TablePagination` component
 * @param {number} props.pageCount - The total number of pages
 * @param {number} props.rowCount - The total number of rows in the dataset
 * @param {number} props.rowsPerPage - The number of rows per page
 * @param {number} [props.currentPage] - The current page (for controlled pagination)
 * @param {number} [props.defaultPage] - The initial page (for uncontrolled pagination)
 * @param {PageSizeOption[]} [props.pageSizeOptions] - Options for the number of rows per page dropdown
 * @param {string} [props.defaultPageSize] - The default number of rows per page
 * @param {Function} [props.onPageChange] - Callback when the page changes
 * @param {Function} [props.onPageSizeChange] - Callback when the number of rows per page changes
 * @param {string} [props.itemLabel] - Label for the items being paginated
 * @example
 * ```tsx
 * import { TablePagination } from '@payfit/unity-components'
 *
 * <TablePagination
 *   pageCount={10}
 *   rowCount={100}
 *   rowsPerPage={10}
 *   currentPage={1}
 *   onPageChange={(page) => console.log(`Page changed to ${page}`)}
 * />
 * ```
 * @example
 * ```tsx
 * // With custom page size options
 * import { TablePagination } from '@payfit/unity-components'
 *
 * <TablePagination
 *   pageCount={5}
 *   rowCount={50}
 *   rowsPerPage={10}
 *   pageSizeOptions={[
 *     { value: '5', label: '5' },
 *     { value: '10', label: '10' },
 *     { value: '25', label: '25' },
 *   ]}
 *   onPageSizeChange={(size) => console.log(`Page size changed to ${size}`)}
 * />
 * ```
 * @see {@link TablePaginationProps} for all available props
 * @remarks
 * {@link https://unity-components.payfit.io/?path=/story/data-table-tableheader--docs|API and Demos} •
 * {@link https://payfit.design|Design docs}
 */
declare const TablePagination: import('react').ForwardRefExoticComponent<TablePaginationProps & import('react').RefAttributes<HTMLDivElement>>;
export { TablePagination };