Pagination

Pagination supplies page controls, bounds, and accessible navigation for tables or galleries. Pages start at 1. The Solution owns page state and data fetching; pass the total item count and page size returned or used by your API.

This is a LongLink-specific component.

longlink docs component "Pagination"

export default function Items() {
  const [page, setPage] = useState(1);
  const [items] = useApi(`/api/items?page=${page}&page_size=8`);
  return (
    <Stack gap={4}>
      <Table data={items.items} idKey="id" />
      <Pagination page={page} onPageChange={setPage} totalItems={items.total} pageSize={8} />
    </Stack>
  );
}