Pagination

Pagination defines how EnterUI handles accessible previous, next, and page navigation, including default structure, accessible states, and token-driven styling.

#Default usage

<Pagination>
  <PaginationList>
    <PaginationItem><PaginationPrevious href="#" /></PaginationItem>
    <PaginationItem><PaginationLink href="#">1</PaginationLink></PaginationItem>
    <PaginationItem><PaginationLink href="#" active>2</PaginationLink></PaginationItem>
    <PaginationItem><PaginationNext href="#" /></PaginationItem>
  </PaginationList>
</Pagination>

#Import

import {
  Pagination,
  PaginationItem,
  PaginationLink,
  PaginationList,
  PaginationNext,
  PaginationPrevious,
} from "@froggdesign/enter-ui-react";

#Accessibility

Pagination renders a nav landmark. Active links set aria-current="page", and previous/next links include accessible labels.

#API

• PaginationLink supports active and disabled.
• PaginationPrevious and PaginationNext are convenience links.
• All link primitives extend anchor props.

#Styling

Every exported component accepts className when it renders an element. EnterUI styles use .eui-* classes and --eui-* variables mapped from FroggDesign theme tokens.