---
id: Pagination
section: components
cssPrefix: pf-v6-c-pagination
propComponents: ['Pagination', PaginationTitles, PerPageOptions, PaginationToggleTemplateProps]
ouia: true
---

import { Fragment, useState } from 'react';

## Examples

### Top

```ts file="./PaginationTop.tsx"
```

### Bottom

```ts file="./PaginationBottom.tsx"
```

### Indeterminate

By not passing `itemCount` and passing `toggleTemplate` you can customize the toggle with text.

```ts file="./PaginationIndeterminate.tsx"
```

### Disabled

```ts file="./PaginationDisabled.tsx"
```

### No items

```ts file="./PaginationNoItems.tsx"
```

### One page

```ts file="./PaginationOnePage.tsx"
```

### Compact

```ts file="./PaginationCompact.tsx"
```

### Offset

```ts file="./PaginationOffset.tsx"
```

### Sticky

```ts isFullscreen file="./PaginationSticky.tsx"
```

### Inset

```ts file="./PaginationInset.tsx"
```