Paginator

Pagination is a common requirement in web applications where you need to show large amounts of data to the user. The purpose of the Paginator is to split the data into smaller, manageable chunks or pages.

Anatomy

• Page buttons - A series of buttons for each available page.
• Previous and next buttons - Allow the user to move to the previous or next page.

Component

<alliance-paginator
    page-size="50"
    initial-page="1"
    sibling-count="2"
    item-count="500"
    on:change-page={{(event) => handleEvent(event)}}
/>

Properties

Property	Type	Required	Default	Description
item-count	number	Yes	Total amount of items.
page-size	number	No	50	Total amount of items displayed on each page.
initial-page	number	No	1	Which page is selected on initial render.
sibling-count	number	No	2	Minimal amount of pages displayed beside the selected page.

Events

Event	Detail	Description
change-page	{ nextPage: number, previousPage: number }	Emitted when changing page.