<script>
  import Pagination from "$/client/components/Pagination.svelte";

  let log = [];

  let pagination = {
    currentPage: 1,
    total: 236,
    lastPage: 12,
    perPage: 20,
    from: 20,
    to: 80,
  }

  const page_changed = () => {
    log.push(`New page ${pagination.currentPage} of ${pagination.lastPage}`);
    log = log;
  }
</script>

<p>Total Pages: <input name="page_count" bind:value={ pagination.lastPage } type="number" ></p>

<Pagination bind:pagination on:change={ page_changed }/>

<h3>Change Log</h3>

<p>A simple log of page changes only as a demo of handling the <b>changed</b> callback.</p>

<ul>
  {#each log as line}
    <li>{ line }</li>
  {/each}
</ul>
