Pagination

@sushindustries/ui

Pages as links with first and last always reachable, and nothing that breaks middle-click.

Last updated Aug 17, 20265 min read
View as MarkdownEdit on GitHub

Composing it

It's a <nav> sized to its own content, centred by justify-content on itself - no parent height or width requirement. It works equally inside a container with a max-width or full-bleed; the row just stays centred within whatever it's given.

When not to use it

When the total page count isn't known ahead of time - an infinite feed, a search result stream that loads more as you scroll. PaginationPaginationPages as links with first and last always reachable. The window everyone already knows, and nothing that breaks middle-click.@sushindustries/ui · docs needs pageCount up front to compute the window; a "load more" button or an infinite-scroll sentinel is the right shape for an unbounded list.

UsesIconIconThe glyph set, generated from a Markdown table where every drawing carries its reason. One component, typed names, no icon font.@sushindustries/ui · content
Used byArchiveArchiveA filterable grid with categories, subcategories and tags. Renders its own links through a callback so the router stays yours.@sushindustries/ui · layout
Mentioned inArchiveMarkdown