Headless Pagination

A small JavaScript library to help you determine what pagination links to show given any dataset.

Does not render anything to the UI, nor does it know anything about your data other than the size of it.

Demo

View the demo at headless-pagination.ozzie.sh and the demo's source in the docs folder.

Documentation

• Vanilla JS - packages/headless-pagination/readme.md
• React Adapter - packages/headless-pagination-react/readme.md

Quick Start

Vanilla JS

$ npm install -S headless-pagination

import Paginator from 'headless-pagination';

const paginator = new Paginator({
  totalItems: 1000,
  perPage: 24, 
});

React

$ npm i -S headless-pagination headless-pagination-react

import usePagination from 'headless-pagination-react';

function Component() {
  const {
    page,
    links,
    hasNext,
    hasPrevious,
    from,
    to,
    setPage,
    onNext,
    onPrevious,
  } = usePagination({
    totalItems: 1000,
    perPage: 24,
  });
}