> For the complete documentation index, see [llms.txt](https://apcom.gitbook.io/altrone-ui/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://apcom.gitbook.io/altrone-ui/components/indicators/pagination.md).

# Pagination

Some pages can contain a huge amount of information. And for easy navigation on this page, it is better to divide this content into separate pages. 

{% hint style="warning" %}
This component is available only in **Altrone 2.0** and later
{% endhint %}

```tsx
import { Pagination } from 'altrone-ui';

const [page, setPage] = useState(1);

return <Pagination page={page} totalPages={24} onChange={setPage} />
```

## Properties

<table><thead><tr><th width="272.66666666666663">Property</th><th>Type</th><th>Description</th></tr></thead><tbody><tr><td><strong><code>page</code></strong><mark style="color:red;"><strong><code>*</code></strong></mark></td><td><code>number</code></td><td>Current page</td></tr><tr><td><strong><code>totalPages</code></strong><mark style="color:red;"><strong><code>*</code></strong></mark></td><td><code>number</code></td><td>Maximum number of pages</td></tr><tr><td><strong><code>onChange</code></strong><mark style="color:red;"><strong><code>*</code></strong></mark></td><td><code>(page: number) => void</code></td><td>Callback is called when user navigates to new page</td></tr><tr><td><strong><code>useNavigateToPagePopup</code></strong></td><td><code>boolean</code></td><td>If true user can navigate to a specific page. Default value is <code>true</code></td></tr></tbody></table>

## History

* **`Altrone 2.0`**: initial release