Pagination

Navegación entre páginas con ellipsis automático y accesibilidad completa.

pnpm dlx nuvo-ui add pagination

Pocas páginas

Página actual: 1

Muchas páginas (con ellipsis)

Página actual: 5 de 20

Uso

"use client"
import { Pagination } from "@nuvo-ui/ui"

const [page, setPage] = React.useState(1)

<Pagination
  currentPage={page}
  totalPages={20}
  onChange={setPage}
  siblingCount={1} // páginas a cada lado del actual
/>

Props

PropTipoDefaultDescripción
currentPagenumberPágina activa (1-indexed)
totalPagesnumberTotal de páginas
onChange(page: number) => voidCallback al cambiar de página
siblingCountnumber1Páginas visibles a cada lado del actual
classNamestringClases adicionales