import * as React from 'react'; import { OverridableStringUnion } from '@mui/types'; import { SxProps } from '@mui/system'; import { InternalStandardProps as StandardProps } from '@mui/material'; import { Theme } from '../styles'; import { UsePaginationItem, UsePaginationProps } from '../usePagination/usePagination'; import { PaginationClasses } from './paginationClasses'; export interface PaginationRenderItemParams extends UsePaginationItem { color: PaginationProps['color']; shape: PaginationProps['shape']; size: PaginationProps['size']; variant: PaginationProps['variant']; } export interface PaginationPropsVariantOverrides {} export interface PaginationPropsSizeOverrides {} export interface PaginationPropsColorOverrides {} export interface PaginationProps extends UsePaginationProps, StandardProps, 'children' | 'onChange'> { /** * Override or extend the styles applied to the component. */ classes?: Partial; /** * The active color. * It supports both default and custom theme colors, which can be added as shown in the * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors). * @default 'standard' */ color?: OverridableStringUnion< 'primary' | 'secondary' | 'standard', PaginationPropsColorOverrides >; /** * Accepts a function which returns a string value that provides a user-friendly name for the current page. * This is important for screen reader users. * * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). * @param {string} type The link or button type to format ('page' | 'first' | 'last' | 'next' | 'previous' | 'start-ellipsis' | 'end-ellipsis'). Defaults to 'page'. * @param {number} page The page number to format. * @param {bool} selected If true, the current page is selected. * @returns {string} */ getItemAriaLabel?: (type: UsePaginationItem['type'], page: number, selected: boolean) => string; /** * Render the item. * @param {PaginationRenderItemParams} params The props to spread on a PaginationItem. * @returns {ReactNode} * @default (item) => */ renderItem?: (params: PaginationRenderItemParams) => React.ReactNode; /** * The shape of the pagination items. * @default 'circular' */ shape?: 'circular' | 'rounded'; /** * The size of the component. * @default 'medium' */ size?: OverridableStringUnion<'small' | 'medium' | 'large', PaginationPropsSizeOverrides>; /** * The system prop that allows defining system overrides as well as additional CSS styles. */ sx?: SxProps; /** * The variant to use. * @default 'text' */ variant?: OverridableStringUnion<'text' | 'outlined', PaginationPropsVariantOverrides>; } /** * * Demos: * * - [Pagination](https://mui.com/material-ui/react-pagination/) * * API: * * - [Pagination API](https://mui.com/material-ui/api/pagination/) */ export default function Pagination(props: PaginationProps): React.JSX.Element;