Koori UI
Components

GlassPagination

Navigation control for paginated lists with page numbers and ellipses.

Preview

Usage

import { GlassPagination } from "koori-ui";
import { useState } from "react";
 
const [page, setPage] = useState(1);
 
<GlassPagination total={10} current={page} onPageChange={setPage} />

Props

PropTypeDefaultDescription
totalnumberTotal number of pages
currentnumberCurrently active page (1-indexed)
onPageChange(page: number) => voidFired when the user picks a page
siblingCountnumber1Pages shown on each side of the current page

All native <nav> props are also accepted.

On this page