pagination

v0.88.2

v0.86.0

v0.85.0

v0.84.0

STATUS

Passing

DOWNLOADS

885

LICENSE

MIT

VISIBILITY

Public

PUBLISHED

3 years ago

SIZE

78 KB

Called on change of an active page.

1 contributor

Install pagination as a package?

Copied

npm i @bit/semantic-org.semantic-ui-react.pagination

Set Bit as a scoped registryLearn more

npm config set '@bit:registry' https://node.bit.cloud

Component Example

React

Vue

Angular

React Native

Add dependency...

Just

import

any of the 1 million components

and packages in Bit or NPM to the example.

import Button from '@bit/grommet.grommet.button';
import Lodash from 'lodash';

modifieddraft

Called on change of an active page.

Pagination ()

A component to render a pagination.

Called on click.

Called on key down.

PaginationItem ()

An item of a pagination.

Properties

Name	Type	Default value	Description
aria-label	`string`	`'Pagination Navigation'`	A pagination item can have an aria label.
defaultActivePage	`number \| string`		Initial activePage value.
activePage	`number \| string`		Index of the currently active page.
boundaryRange	`number \| string`	`1`	Number of always visible pages at the beginning and end.
disabled	`bool`		A pagination can be disabled.
ellipsisItem	`custom`	`'...'`	A shorthand for PaginationItem.
firstItem	`custom`	`{ 'aria-label': 'First item', content: '«', }`	A shorthand for PaginationItem.
lastItem	`custom`	`{ 'aria-label': 'Last item', content: '»', }`	A shorthand for PaginationItem.
nextItem	`custom`	`{ 'aria-label': 'Next item', content: '⟩', }`	A shorthand for PaginationItem.
pageItem	`custom`	`{}`	A shorthand for PaginationItem.
prevItem	`custom`	`{ 'aria-label': 'Previous item', content: '⟨', }`	A shorthand for PaginationItem.
onPageChange	`function`		React’s original SyntheticEvent.
siblingRange	`number \| string`	`1`	Number of always visible pages before and after the current one.
totalPages (required)	`number \| string`		Total number of pages.
active	`bool`		A pagination item can be active.
disabled	`bool`		A pagination item can be disabled.
onClick	`function`		React’s original SyntheticEvent.
onKeyDown	`function`		React’s original SyntheticEvent.
type	`'ellipsisItem' \| 'firstItem' \| 'prevItem' \| 'pageItem' \| 'nextItem' \| 'lastItem'`		A pagination should have a type.