Pagination

To implement Pagination component into your project you’ll need to the import:

import Pagination from "@kiwicom/orbit-components/lib/Pagination";

After adding import into your project you can use it simply like:

<Pagination pageCount={1337} selectedPage={69} />

Props

Table below contains all types of the props available in the Pagination component.

Name	Type	Default	Description
dataTest	`string`		Optional prop for testing purposes.
hideLabels	`boolean`	`true`	If `false`, the Previous and Next labels will be visible.
labelPrev	`string`		The text label for the previous page call to action.
labelNext	`string`		The text label for the next page call to action.
labelProgress	`React.Node`		The text label for progress indicator.
onPageChange	`number => void`		Function for handling onPageChange event. See Functional specs
pageCount	`number`		The page count to render into separated buttons. See Functional specs
selectedPage	`number`	`1`	The index number of the selected page.
size	`enum`	`"normal"`	The size of the Pagination.

size
`"small"`
`"normal"`

If the pageCount will be bigger than 7, the compact version will be rendered.
The prop onPageChange will return the new index of selected page. Use arrow function for it, e.g.:

<Pagination onPageChange={selectedPage => doSomething(selectedPage)} />