Componentes
Pagination
Componente pagination do design system adila.co.
Instalação
bun add @adila-sh/uiUso
Marque a página atual com isActive no PaginationLink. PaginationPrevious e
PaginationNext aceitam a prop text para rótulos (ocultos no mobile).
import {
Pagination,
PaginationContent,
PaginationItem,
PaginationLink,
PaginationPrevious,
PaginationNext,
PaginationEllipsis,
} from '@adila-sh/ui';
export function Example() {
return (
<Pagination>
<PaginationContent>
<PaginationItem>
<PaginationPrevious href="#" text="Anterior" />
</PaginationItem>
<PaginationItem>
<PaginationLink href="#" isActive>
1
</PaginationLink>
</PaginationItem>
<PaginationItem>
<PaginationLink href="#">2</PaginationLink>
</PaginationItem>
<PaginationItem>
<PaginationEllipsis />
</PaginationItem>
<PaginationItem>
<PaginationNext href="#" text="Próxima" />
</PaginationItem>
</PaginationContent>
</Pagination>
);
}Dependências
lucide-react