[proxy] giggles.zzzzion.com← back | site home | direct (HTTPS) ↗ | proxy home | ◑ dark◐ light

Paginator

API reference for the Paginator component

A scroll position indicator for windowed lists. Supports four display styles: dots, arrows, scrollbar, and counter.

Paginator is a pure display component — it has no focus or interactivity. Pass it the total item count, current scroll offset, and number of visible items. It computes and renders the appropriate indicator. When the total number of items fits within the visible window, Paginator renders nothing.

Standalone Usage
import { Paginator } from 'giggles/ui';

<Paginator total={100} offset={20} visible={10} style="scrollbar" />

Dots

Shows a row of dots below the list.

Arrows

Shows and indicators above and below the list when there are items outside the visible window.

Scrollbar

Shows a vertical bar beside the list with a thumb that tracks scroll position.

Counter

Shows a text range like 1–10 of 50 below the list.

API Reference

Paginator

Prop

Type

PaginatorStyle

Type Definition
type PaginatorStyle = 'dots' | 'arrows' | 'scrollbar' | 'counter' | 'none';

Viewport

API reference for the Viewport component

Modal

API reference for the Modal component