@berlitz/pagination

Pagination component for the Max Design System

Usage no npm install needed!

<script type="module">
  import berlitzPagination from 'https://cdn.skypack.dev/@berlitz/pagination';
</script>

README

Pagination npm version

Pagination to indicate a series of related content exists across multiple pages.

Installation

yarn add @berlitz/pagination

Props

Argument Type Required Default
activePage number ✅ -
numberPages number ✅ -
onChange func ✅ -
nextLabel string ❌ 'Next'
prevLabel string ❌ 'Back'

Usage

import React, { useState } from 'react'
import Pagination from '@berlitz/pagination'
const MyApp = () => {
  const [activePage, setActivePage] = useState(1)
  return (
    <Pagination
      activePage={activePage}
      numberPages={6}
      onChange={pageNumber => setActivePage(pageNumber)}
      prevLabel="Back"
      nextLabel="Next"
    />
  )
}