Merge pull request #65 from LibreSign/bump-dependencies

Bump dependencies

Author: vitormattos

package.json

@@ -1,7 +1,7 @@
 {
   "name": "@libresign/vue-pdf-editor",
   "description": "vue2 pdf editor component",
-  "version": "1.2.2",
+  "version": "1.2.3",
   "author": "LibreCode",
   "private": false,
   "main": "dist/vue-pdf-editor.umd.js",
@@ -18,28 +18,28 @@
     "lint:fix": "vue-cli-service lint"
   },
   "dependencies": {
+    "@cantoo/pdf-lib": "^1.20.2",
     "blob-stream-i2d": "^1.0.0",
-    "core-js": "^3.8.3",
+    "core-js": "^3.35.1",
     "downloadjs": "^1.4.7",
-    "pdf-lib": "^1.17.1",
-    "pdfjs-dist": "2.4.456",
+    "pdfjs-dist": "^4.0.379",
     "pdfkit": "^0.14.0",
     "vue-material-design-icons": "^5.2.0"
   },
   "devDependencies": {
-    "@babel/core": "^7.12.16",
-    "@babel/eslint-parser": "^7.12.16",
+    "@babel/core": "^7.23.7",
+    "@babel/eslint-parser": "^7.23.3",
     "@vue/cli-plugin-babel": "~5.0.0",
     "@vue/cli-plugin-eslint": "^5.0.8",
     "@vue/cli-service": "~5.0.0",
     "eslint": "^7.32.0",
     "eslint-plugin-vue": "^8.7.1",
     "postcss": "^8.4.33",
-    "postcss-load-config": "^4.0.1",
-    "tailwindcss": "^3.2.1",
-    "terser-webpack-plugin": "^5.3.9",
+    "postcss-load-config": "^4.0.2",
+    "tailwindcss": "^3.4.1",
+    "terser-webpack-plugin": "^5.3.10",
     "vue": "^2.7.16",
-    "vue-template-compiler": "^2.6.14"
+    "vue-template-compiler": "^2.7.16"
   },
   "browserslist": [
     "> 1%",

src/VuePdfEditor.vue

@@ -90,10 +90,10 @@
 				class="w-full">
 				<div v-if="showRename" class="flex justify-center px-5 pt-5 w-full md:hidden">
 					<div class="flex items-center">
-						<img src="assets/img/edit.svg"
-							class="mr-2 justify-center"
-							alt="a pen, edit pdf name"
-							@click="renamePDF($refs.renamePDFInputTwo)">
+						<PencilIcon :size="20"
+							class="mr-2"
+							title="a pen, edit pdf name"
+							@click="renamePDF($refs.renamePDFInputOne)" />
 						<input ref="renamePDFInputTwo"
 							v-model="pdfName"
 							style="text-align:center"
@@ -190,8 +190,6 @@
 </template>
 
 <script>
-import 'pdfjs-dist/web/pdf_viewer.css'
-
 import { fetchFont } from './utils/prepareAssets.js'
 
 import PDFPage from './Components/PDFPage.vue'
@@ -210,8 +208,8 @@ import TextIcon from 'vue-material-design-icons/Text.vue'
 import GestureIcon from 'vue-material-design-icons/Gesture.vue'
 import PencilIcon from 'vue-material-design-icons/Pencil.vue'
 
-const PDFJS = require('pdfjs-dist')
-PDFJS.GlobalWorkerOptions.workerSrc = require('pdfjs-dist/build/pdf.worker')
+import * as pdfjsLib from 'pdfjs-dist'
+pdfjsLib.GlobalWorkerOptions.workerSrc = require('pdfjs-dist/build/pdf.worker')
 
 export default {
 	name: 'VuePdfEditor',
@@ -494,7 +492,7 @@ export default {
 		async getPdfDocument(file) {
 			const blob = new Blob([file])
 			const url = window.URL.createObjectURL(blob)
-			return PDFJS.getDocument(url).promise
+			return pdfjsLib.getDocument(url).promise
 		},
 		async addPDF(file) {
 			try {
@@ -671,7 +669,7 @@ export default {
 				if (this.sealImageShow) {
 					for (let i = 0; i < this.pages.length; i++) {
 						const seal = this.allObjects[i].find((e) => e.isSealImage === true)
-						const page = this.pages[i]
+						const page = await this.pages[i].then(response => response);
 						sealInfo.push({
 							page: page._pageIndex,
 							pageWidth: page._pageInfo.view[2],

src/utils/PDF.js

@@ -1,7 +1,7 @@
 import { readAsArrayBuffer } from './asyncReader.js'
 import { fetchFont } from './prepareAssets.js'
 import { noop } from './helper.js'
-import * as PDFLib from 'pdf-lib'
+import * as PDFLib from '@cantoo/pdf-lib'
 import * as download from 'downloadjs'
 import PDFDocument from 'pdfkit/js/pdfkit.standalone.js'
 import blobStream from 'blob-stream-i2d/blob-stream.js'

src/utils/asyncReader.js

@@ -1,4 +1,4 @@
-import 'pdfjs-dist/build/pdf.worker.min'
+import * as pdfjsLib from 'pdfjs-dist'
 
 /**
  *
@@ -50,8 +50,5 @@ export function readAsDataURL(file) {
  * @param file
  */
 export async function readAsPDF(file) {
-	const pdfjsLib = require('pdfjs-dist')
-	const pdfjsWorker = require('pdfjs-dist/build/pdf.worker.entry')
-	pdfjsLib.GlobalWorkerOptions.workerSrc = pdfjsWorker
 	return pdfjsLib.getDocument(file).promise
 }