# Pagination > Anterior, números con «…» y siguiente. Con links de verdad o con botones. ```tsx import { Pagination } from "sebs7n-ui/pagination" ``` Sin `"use client"`: sirve en un Server Component. ## Ejemplos ### Con botones Para una lista que se pagina sin cambiar de URL: `onPageChange` recibe la página destino. ```tsx import { Pagination } from "sebs7n-ui/pagination" import { useState } from "react" function ConBotones() { const [page, setPage] = useState(1) return (

Página {page} de 10

) } ``` ### Con links Si la página vive en la URL, `render`: son `` de verdad, el crawler los ve y se abren en una pestaña nueva. ```tsx import Link from "next/link" import { Pagination } from "sebs7n-ui/pagination" function ConLinks() { return ( } /> ) } ``` ### Muchas páginas y tamaño chico El ancho no salta: cuando un «…» desaparece, lo reemplaza un número. ```tsx import { Pagination } from "sebs7n-ui/pagination" import { useState } from "react" function MuchasPaginas() { const [page, setPage] = useState(50) return } ``` ## Props ### Pagination Hereda las props de `