# Pagination Helpers

Source code is hosted on [GitHub](https://github.com/corets/pagination-helpers)

{% tabs %}
{% tab title="yarn" %}

```bash
yarn add @corets/pagination-helpers
```

{% endtab %}

{% tab title="npm" %}

```
npm install --save @corets/pagination-helpers
```

{% endtab %}
{% endtabs %}

## createPagination()

Calculates total amount of pages, visible pages, more / less indicators, total items, etc., this helper can be used to build a pagination like this:

```
< << ... 6 7 8 [9] 10 11 12 ... >> >
< << 7 8 [9] 10 11 >> >
<  ... 7 8 [9] 10 11  ... >
< [9] >
[ v Select page ]
```

Calculate pagination:

```typescript
import { createPagination } from "@corets/pagination-helpers"

// active page
const currentPage = 7

// total number of items for pagination
const totalItems = 1337

// how many items are visible on a single page
const pageSize = 20

// how many pages you want to display to the left and right of the current page
const surroundBy = 2
const pagination = createPagination({ currentPage, totalItems, pageSize, surroundBy })
```

With the calculated result below you can build every possible kind of pagination you can think of:

```typescript
{
  // active page
  currentPage: 7,
  // number of the first page, obviously...
  firstPage: 1,
  // number of the last page
  lastPage: 67,
  // first visible page based on the surroundBy
  firstVisiblePage: 5,
  // last visible page based on the surroundBy
  lastVisiblePage: 9,
  // all visible pages based on the surroundBy
  visiblePages: [ 5, 6, 7, 8, 9 ],
  // all available pages, useful for a dropdown
  allPages: [
     1,  2,  3,  4,  5,  6,  7,  8,  9, 10, 11, 12,
    13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24,
    25, 26, 27, 28, 29, 30, 31, 32, 33, 34, 35, 36,
    37, 38, 39, 40, 41, 42, 43, 44, 45, 46, 47, 48,
    49, 50, 51, 52, 53, 54, 55, 56, 57, 58, 59, 60,
    61, 62, 63, 64, 65, 66, 67
  ],
  // are there any previous pages?
  hasPrevious: true,
  // are there any next pages?
  hasNext: true,
  // are there any pages in between the first page and the first visible page?
  hasLess: true,
  // are there any pages in between the last page and the last visible page?
  hasMore: true,
  // how many items to skip, useful for an api call
  itemsOffset: 120,
  // how many items are visible per page
  pageSize: 20,
  // is current page the first one?
  isFirstPage: false,
  // is current page the last one?
  isLastPage: false
}
```


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.corets.io/helpers/pagination-helpers.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.