# react-select-paginate

> Pagination using a select element

Latest version **0.1.4** (published 2016-03-28) · MIT license · 0 weekly downloads

## Install

```sh
npm install react-select-paginate
pnpm add react-select-paginate
yarn add react-select-paginate
bun add react-select-paginate
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.1.4 |
| Published | 2016-03-28 |
| First published | 2016-03-28 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 2 |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Maintainers | ernesto95 |

## Links

- npm: https://www.npmjs.com/package/react-select-paginate
- npm.io page: https://npm.io/package/react-select-paginate

## Dependencies (2)

- [react](https://npm.io/package/react.md) ^0.14.7
- [react-dom](https://npm.io/package/react-dom.md) ^0.14.7

## Recent versions

- 0.1.4 (latest) — 2016-03-28
- 0.1.3 — 2016-03-28
- 0.1.2 — 2016-03-28
- 0.1.1 — 2016-03-28
- 0.1.0 — 2016-03-28
- 0.0.1 — 2016-03-28

## README

# React Select Paginate

A very simple, bare-bones React.js pagination component using a select element.

To install:
```sh
$ npm install react-select-paginate --save
```

To use:
```javascript
import React from 'react';
import SelectPaginate from 'react-select-paginate';

class MyPaginatedApp extends React.Component {
    onPageChange(page) {
        console.log('page changed to: ' + page);
    }
    
    render() {
        <SelectPaginate
            pageNum={100}
            handlePageChange={onPageChange} />
    }
}
```

```SelectPaginate``` only requires a ```pageNum```, which is the number of pages and a ```handlePageChange``` event listener that will be called whenever the user selects a page or clicks the next/prev buttons.

But you can also pass in a custom label for the next/prev buttons, you could even pass in a custom component that will get rendered inside a button element. To do this, simple specify the ```prevLabel``` and ```nextLabel``` props.

### Note
```SelectPaginate``` is zero indexed but displays as one indexed. That means the handlePageChange event will return a an item from a zero indexed ```pageNum``` lengthed array but the actual select element starts at one. Just a reminder.

---
_Source: https://npm.io/package/react-select-paginate · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._