laif-ds/dist/agent-docs/components/Pagination.md

Design System di Laif con componenti React basati su principi di Atomic Design

# Pagination

## Overview

Composable pagination controls with first/previous/next/last buttons and page links.

---

## Exports

- `Pagination`, `PaginationContent`, `PaginationItem`
- `PaginationLink` (props: `isActive?`, `isDisabled?`, `label?`, `size?`)
- `PaginationFirst`, `PaginationPrevious`, `PaginationNext`, `PaginationLast`
- `PaginationEllipsis`

---

## Example

```tsx
import {
  Pagination,
  PaginationContent,
  PaginationItem,
  PaginationLink,
  PaginationPrevious,
  PaginationNext,
  PaginationEllipsis,
} from "laif-ds";

export function Pager() {
  return (
    <Pagination>
      <PaginationContent>
        <PaginationItem>
          <PaginationPrevious href="#" />
        </PaginationItem>
        {[1, 2, 3].map((p) => (
          <PaginationItem key={p}>
            <PaginationLink href="#" isActive={p === 2}>
              {p}
            </PaginationLink>
          </PaginationItem>
        ))}
        <PaginationItem>
          <PaginationEllipsis />
        </PaginationItem>
        <PaginationItem>
          <PaginationNext href="#" />
        </PaginationItem>
      </PaginationContent>
    </Pagination>
  );
}
```