className
string
(optional)

Class name for the top level <ul> container

Defaults to pagination, overrides extraClassName prop (below)

extraClassName
string
(optional)

Useful when using Bootstrap styles, extra classNames to be added to the top level <ul> container. Use this prop to override the default justify value - for example to align elements to the start of the page use: justify-content-start

Defaults to justify-content-center, not applicable if className prop is set

pageItemClassName
string
(optional)

Class name for all the <li> elements

Defaults to page-item

pageLinkClassName
string
(optional)

Class name for <a> or <span> child elements within an <li> element:

<li ...><a class='page-link'>1</a></li>

Defaults to page-link

activeItemClassName
string
(optional)

Appended to <li> class name for the active element:

<li class='page-item active'><a class='page-link'>1</a></li>

Defaults to active

disabledItemClassName
string
(optional)

Appended to <li> class name for non-clickable elements (disabled nav buttons and the break/ellipsis):

<li class='page-item disabled'><span class='page-link'>...</span></li>

Defaults to disabled

srOnlyClassName
string
(optional)

Class for screen reader only content (which should be visually hidden) - see an example of typical css for this purpose

Setting this prop to '' will turn off all the <span> based screen reader labels (this should be fine in most cases as screen readers will still be able to read the aria-label attributes)

Defaults to sr-only