vue-pdf-kit

A high-definition PDF viewer component for Vue 2 & Vue 3.

Features

• Ensures high-definition rendering of PDFs.
• Renders PDF documents in Vue applications, with support for both Vue 2 and Vue 3.
• Enables text selection and search within the rendered PDF documents.
• Supports rendering annotations within PDF.

Installation & Usage

npm install vue-pdf-kit

yarn add vue-pdf-kit

Usage

<script setup>
import VuePdfKit from 'vue-pdf-kit'
import 'vue-pdf-kit/dist/style.css'
</script>

<template>
  <VuePdfKit source="<url> | <base64>" enableTextLayer enableAnnotation />
</template>

If you want to use the component in Vue 2.6, you will install it as follows:

npm i @vue/composition-api

Props

| Name | Type | Accepted values | Description | | ---------------- | --------------------- | ----------------- | -------------------------------------------------- | | source | string object | URL or Base64 | Source of the document to display | | scale | number | numbers | The ratio of canvas size to document size | | enableTextLayer |boolean |trueorfalse| whether the text layer should be enabled | | enableAnnotation |boolean |trueorfalse| Whether annotations should be enabled | | password |string | Any string | Password for encrypted documents, if required | | enableCMap |boolean |trueorfalse` | Enables Character Maps for accurate text rendering |

Events

| Name | Value | Description | | -------- | ------------------- | ------------------------------------------------------------------------------------------------------ | | progress | 0-1 number | Represents the current progress or completion ratio of a task or operation, expressed as a percentage. | | password | {callback:()=>{}} | Contains properties related to password handling. |

License

MIT License. Please see LICENSE file for more information.