@am-77/svelte-pdf
v0.0.16
Published
![npm](https://img.shields.io/npm/dw/@am-77/svelte-pdf?style=flat-square) ![npm](https://img.shields.io/npm/v/@am-77/svelte-pdf?style=flat-square)
Downloads
19
Maintainers
Readme
svelte-pdf
A svelte PDF viewer.
usage
npm i @am-77/svelte-pdf
<script lang="ts">
import PDFViewer from '@am-77/svelte-pdf';
let url =
'https://raw.githubusercontent.com/huyubing/books-pdf/4628830db115e552b08763bd4fa70398233efa64/slime.pdf';
let nextPage: () => void;
let prevPage: () => void;
let gotoPage: (nbr: number) => void;
let pageNumber: number;
let pagesCount: number;
let seekPage: number;
</script>
<div>
<PDFViewer bind:nextPage bind:prevPage bind:gotoPage bind:pageNumber bind:pagesCount {url}>
<div slot="top-actions">
<button on:click={prevPage}>Prev</button>
<span>{pageNumber} / {pagesCount}</span>
<button on:click={nextPage}>Next</button>
<input type="number" bind:value={seekPage} />
<button on:click={() => gotoPage(seekPage)}>go</button>
</div>
<div slot="bottom-actions">
<button on:click={prevPage}>Prev</button>
<span>{pageNumber} / {pagesCount}</span>
<button on:click={nextPage}>Next</button>
<input type="number" bind:value={seekPage} />
<button on:click={() => gotoPage(seekPage)}>go</button>
</div>
</PDFViewer>
</div>