---

## Pagination
Navigation control for paged data sets.
Supports multiple layouts, intents, button variants, and configurable ellipsis behaviour.

**Import:** `import { Pagination } from '@urbicon-ui/blocks';`

### Examples
```svelte
<Pagination
  currentPage={page}
  totalPages={20}
  onPageChange={(p) => page = p}
/>
```

### Variants
- size: lg, md, sm (default: md)
- layout: default, minimal, navigation, table (default: default)

### Api
| Prop | Type | Required | Default | Description |
| --- | --- | :---: | --- | --- |
| currentPage | `number` | yes |  | 1-based index of the currently active page. |
| totalPages | `number` | yes |  | Total number of pages in the data set. |
| ...HTMLAttributes<HTMLElement> | `HTMLAttributes` | no |  | HTML attributes (excluding: 'class') |
| ...PaginationVariants | `VariantProps` | no |  | Styling variants from PaginationVariants |
| class | `string` | no |  | Additional CSS classes merged onto the root `<nav>` element. |
| disabled | `boolean` | no |  | Disables all buttons and dims the component. |
| endItem | `number` | no |  | Override the calculated end item number for the info text. |
| firstIcon | `Snippet` | no |  | Custom icon rendered inside the "First" button. |
| firstLabel | `string` | no |  | Label for the "First" button. Falls back to i18n key `pagination.first`. |
| infoText | `string` | no |  | Override the auto-generated info text with a fully custom string. |
| intent | `'primary' | 'secondary' | 'success' | 'warning' | 'danger' | 'neutral'` | no |  | Semantic color applied to every pagination button. |
| itemsPerPage | `number` | no |  | Items shown per page. Used by the table layout to compute "Showing X to Y of Z". |
| lastIcon | `Snippet` | no |  | Custom icon rendered inside the "Last" button. |
| lastLabel | `string` | no |  | Label for the "Last" button. Falls back to i18n key `pagination.last`. |
| loading | `boolean` | no |  | Shows a loading state with reduced opacity. |
| mint | `MintProp` | no |  | Micro-interaction animation applied to the pagination container. |
| nextIcon | `Snippet` | no |  | Custom icon rendered inside the "Next" button. |
| nextLabel | `string` | no |  | Label for the "Next" button. Falls back to i18n key `pagination.next`. |
| onPageChange | `(page: number) => void` | no |  | Fires when the user selects a different page. Receives the 1-based page number. |
| pageLabel | `string` | no |  | Prefix for the info text (e.g. "Page"). Falls back to i18n key `pagination.page`. |
| preset | `string` | no |  | Apply a named preset registered via `<BlocksProvider presets={{ Pagination: {...} }}>`. Prefer this over `class` overrides when the requested look falls outside the semantic intent palette — presets keep hover/active/dark-mode logic coherent and make the custom look reusable across the project. |
| previousIcon | `Snippet` | no |  | Custom icon rendered inside the "Previous" button. |
| previousLabel | `string` | no |  | Label for the "Previous" button. Falls back to i18n key `pagination.previous`. |
| showFirstLast | `boolean` | no |  | Show "First" / "Last" boundary buttons when the current page is far from the edges. |
| showInfo | `boolean` | no |  | Show a text summary such as "Page 3 of 10" beneath the controls. |
| showNumbers | `boolean` | no |  | Show numbered page buttons. Set to false for a compact prev/next-only bar. |
| showPreviousNext | `boolean` | no |  | Show "Previous" / "Next" navigation buttons. |
| size | `'sm' | 'md' | 'lg'` | no |  | Button dimensions. Affects page numbers, prev/next, and first/last. |
| slotClasses | `Partial<Record<PaginationSlots, string>>` | no |  | Per-slot class overrides merged with (or replacing, when unstyled) tv styles. Slots: base, info, controls, ellipsis. |
| startItem | `number` | no |  | Override the calculated start item number for the info text. |
| tier | `InteractiveTier` | no |  | Semantic radius tier forwarded to pagination buttons. |
| totalItems | `number` | no |  | Total number of items across all pages. Used by the table layout info text. |
| unstyled | `boolean` | no |  | Strip all default tailwind-variants classes for a fully custom build. |
| variant | `'outlined' | 'filled' | 'ghost'` | no |  | Visual weight of pagination buttons. |
| visiblePages | `number` | no |  | Maximum number of page buttons shown between the ellipsis indicators. |
| layout | `'default' | 'minimal' | 'navigation' | 'table'` | no | default | Controls the layout behavior and appearance of the Pagination component. Available options: default, minimal, navigation, table. |

Inherited from:
- Omit<PaginationVariants, 'disabled' | 'loading'> (omit-pattern)
- Omit<HTMLAttributes<HTMLElement>, 'class'> (omit-pattern)