README.md

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	React.Node		The text label for the previous page call to action.
labelNext	React.Node		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.

enum

size
"small"
"normal"

Functional specs

• 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)} />