Paginators

const page: any = {
    offset: 0,
    limit: 5,
    size: source.length
    amounts: [1,2,5,10],
};

function onPageChange(e: any): void { console.log('event:page', e.detail); }
function onAmountChange(e: any): void { console.log('event:amount', e.detail); }

<Paginator
    bind:offset={page.offset}
    bind:limit={page.limit}
    bind:size={page.size}
    bind:amounts={page.amounts}
    on:page={onPageChange}
    on:amount={onAmountChange}
></Paginator>

const source: any[] = [ /* any array of objects */ ]

$: sourcePaginated = source.slice(
    page.offset * page.limit, // start
    page.offset * page.limit + page.limit // end
);

<ul>
    {#each sourcePaginated as row}
    <li>{row}</li>
    {/each}
</ul>