React Smart Pagination Component API

Smart Pagination API

CoreUI PRO
This component is part of CoreUI PRO – a powerful UI library with over 250 components and 25+ templates, designed to help you build modern, responsive apps faster. Fully compatible with Angular, Bootstrap, React.js, and Vue.js.

Explore the API reference for the React Smart Pagination component and discover how to effectively utilize its props for customization.

On this page

CSmartPagination

jsx
import { CSmartPagination } from '@coreui/react-pro'
PropertyDefaultType
activePage1number

Current page number.

alignstart'start', 'center', 'end'

Horizontall align.

arrowstrueboolean

Show/hide arrows.

className-string

A string of all className you want applied to the base component.

dotstrueboolean

Show/hide dots.

doubleArrowstrueboolean

Show double arrows buttons.

firstButton<React.Fragment>&laquo;</React.Fragment>ReactNode

The content of firstButton button.

lastButton<React.Fragment>&raquo;</React.Fragment>ReactNode

The content of lastButton button.

limit5number

Maximum items number.

nextButton<React.Fragment>&rsaquo;</React.Fragment>ReactNode

The content of nextButton button.

onActivePageChange-((activePage: number) => void)

On active page change callback.

pages-number

Number of pages.

previousButton<React.Fragment>&lsaquo;</React.Fragment>ReactNode

The content of previousButton button.

size-'sm', 'lg'

Size of pagination, valid values: 'sm', 'lg'.