Update PDF.js version, add missing parameters for viewer, minify build

Author: alekswebnet

README.md

@@ -10,15 +10,22 @@ Supported in all [major browsers](https://caniuse.com/custom-elementsv1), and wo
 See [demo pages](https://github.com/alekswebnet/pdfjs-viewer-element/tree/master/demo) for various usecases.
 See [live examples](https://alekswebnet.github.io/pdfjs-viewer-element/#demo) of usage with frameworks.
 
+# Features
+
+- Simple PDF.js viewer integration to any web application
+- PDF.js viewer options and parameters support, access to the viewer application instance
+- Ability to customize viewer styles and themes
+
 ## How it works
 
-**⚠️ This is an important part !!!**
+**⚠️ This is an important part, please read this firstly !!!**
 
  **You should download and place the PDF.js prebuilt files in the project.**
 
 `pdfjs-viewer-element` requires PDF.js [prebuilt](http://mozilla.github.io/pdf.js/getting_started/), that includes the generic build of PDF.js and the viewer.
 
-The prebuilt comes with each PDF.js release. Supported all v4 and v3 [releases](https://github.com/mozilla/pdf.js/releases).
+The prebuilt comes with each PDF.js release. 
+All v4 and v3 [releases](https://github.com/mozilla/pdf.js/releases) are supported.
 
 Then specify the path to the directory with the `viewer-path` property (`/pdfjs` by default) and PDF file URL with `src` property (should refer to the [same origin](https://github.com/mozilla/pdf.js/wiki/Frequently-Asked-Questions#can-i-load-a-pdf-from-another-server-cross-domain-request)).
 
@@ -64,7 +71,7 @@ Using browser:
 ## Usage
 
 ```html
-<pdfjs-viewer-element src="/file.pdf" viewer-path="/pdfjs-4.5.136-dist"></pdfjs-viewer-element>
+<pdfjs-viewer-element src="/file.pdf" viewer-path="/pdfjs-4.10.38-dist"></pdfjs-viewer-element>
 ```
 
 ## Attributes
@@ -73,27 +80,39 @@ Using browser:
 
 `viewer-path` - Path to PDF.js [prebuilt](http://mozilla.github.io/pdf.js/getting_started/)
 
-`locale` -  Specifies which language to use in the viewer UI `en-US | ...`. [Available locales](https://github.com/mozilla/pdf.js/tree/master/l10n)
+`page` - Page number.
+
+`nameddest` -  Go to a named destination.
+
+`search` - Search text.
+
+`phrase` - Search by phrase, `true` to enable.
+
+`zoom` - Zoom level.
+
+`pagemode` - Page mode, `thumbs | bookmarks | attachments | layers | none`.
+
+`disable-worker` - Disables the worker, `true` to enable.
 
-`text-layer` - Text layer, that is used for text selection `off | visible | shadow | hover`
+`text-layer` - Disables or reveals the text layer that is used for text selection, `off | visible | shadow | hover`.
 
-`page` - Page number
+`disable-font-face` - Disables standard `@font-face` font loading and uses the internal font renderer instead, `true` to enable.
 
-`nameddest` -  Go to a named destination
+`disable-range` - Disables HTTP range requests when fetching the document, `true` to enable.
 
-`search` - Search text
+`disable-stream` - Disables streaming when fetching the document, `true` to enable.
 
-`phrase` - Search by phrase
+`disable-auto-fetch`- Disables auto fetching of the document; only gets necessary data to display the current view. Note: streaming also needs to be disabled for this to have any effect, `true` to enable.
 
-`zoom` - Zoom level
+`verbosity`- Specifies the verbosity level of console messages. `0` - only errors, `1` - warnings and errors, `5` - warnings, errors and information messages.
 
-`pagemode` - Page mode `thumbs | bookmarks | attachments | layers | none`
+`locale` -  Specifies which language to use in the viewer UI, `en-US | ...`. [Available locales](https://github.com/mozilla/pdf.js/tree/master/l10n)
 
-`viewer-css-theme` - Apply automatic, light, or dark theme `AUTOMATIC | LIGHT | DARK`
+`viewer-css-theme` - Apply automatic, light, or dark theme, `AUTOMATIC | LIGHT | DARK`
 
-`viewer-extra-styles` - Add your CSS rules to the viewer application
+`viewer-extra-styles` - Add your CSS rules to the viewer application, pass a string with styles.
 
-`viewer-extra-styles-urls` - Add external CSS files to the viewer application
+`viewer-extra-styles-urls` - Add external CSS files to the viewer application, pass an array with URLs.
 
 Play with attributes on [Api docs page](https://alekswebnet.github.io/pdfjs-viewer-element/#api).
 
@@ -104,19 +123,19 @@ Use `viewer-css-theme` attribute to set light or dark theme manually:
 ```html
 <pdfjs-viewer-element 
   src="/file.pdf" 
-  viewer-path="/pdfjs-4.5.136-dist"
+  viewer-path="/pdfjs-4.10.38-dist"
   viewer-css-theme="DARK">
 </pdfjs-viewer-element>
 ```
 
-## Viewer extra styles 
+## Viewer custom styles 
 
 You can add your own CSS rules to the viewer application using `viewer-extra-styles` or `viewer-extra-styles-urls` attribute:
 
 ```html
 <pdfjs-viewer-element 
   src="/file.pdf" 
-  viewer-path="/pdfjs-4.5.136-dist"
+  viewer-path="/pdfjs-4.10.38-dist"
   viewer-extra-styles="#toolbarViewerMiddle { display: none; }"
   viewer-extra-styles-urls="['/demo/viewer-custom-theme.css']">
 </pdfjs-viewer-element>
@@ -149,7 +168,7 @@ Build your own theme with viewer's custom variables and `viewer-extra-styles-url
 `initialize` - using this method you can access PDFViewerApplication and use methods and events of PDF.js default viewer
 
 ```html
-<pdfjs-viewer-element viewer-path="/pdfjs-4.5.136-dist"></pdfjs-viewer-element>
+<pdfjs-viewer-element viewer-path="/pdfjs-4.10.38-dist"></pdfjs-viewer-element>
 ```
 
 ```javascript

demo/basic.html

@@ -16,7 +16,7 @@
   <body>
     <pdfjs-viewer-element
       src="/public/sample-pdf-with-images.pdf" 
-      viewer-path="/public/pdfjs-4.5.136-dist"
+      viewer-path="/public/pdfjs-4.10.38-dist"
       style="height: 100dvh">
     </pdfjs-viewer-element>
   </body>

demo/dark-theme.html

@@ -16,7 +16,7 @@
   <body>
     <pdfjs-viewer-element
       src="/public/sample-pdf-with-images.pdf" 
-      viewer-path="/public/pdfjs-4.5.136-dist"
+      viewer-path="/public/pdfjs-4.10.38-dist"
       viewer-css-theme="DARK"
       style="height: 100dvh">
     </pdfjs-viewer-element>

demo/extra-styles-urls.html

@@ -16,7 +16,7 @@
   <body>
     <pdfjs-viewer-element
       src="/public/sample-pdf-with-images.pdf" 
-      viewer-path="/public/pdfjs-4.5.136-dist"
+      viewer-path="/public/pdfjs-4.10.38-dist"
       viewer-extra-styles-urls="['/demo/viewer-custom-theme.css']"
       style="height: 100dvh">
     </pdfjs-viewer-element>

demo/extra-styles.html

@@ -16,7 +16,7 @@
   <body>
     <pdfjs-viewer-element
       src="/public/sample-pdf-with-images.pdf" 
-      viewer-path="/public/pdfjs-4.5.136-dist"
+      viewer-path="/public/pdfjs-4.10.38-dist"
       viewer-extra-styles="#toolbarViewerMiddle { display: none; }"
       style="height: 100dvh">
     </pdfjs-viewer-element>

demo/go-to-nameddest.html

@@ -16,7 +16,7 @@
   <body>
     <pdfjs-viewer-element
       src="/public/sample-pdf-report.pdf" 
-      viewer-path="/public/pdfjs-4.5.136-dist"
+      viewer-path="/public/pdfjs-4.10.38-dist"
       nameddest="chart"
       style="height: 100dvh">
     </pdfjs-viewer-element>

demo/opened-findbar.html

@@ -17,7 +17,7 @@
     <pdfjs-viewer-element
       id="viewer"
       src="/public/sample-pdf-with-images.pdf"
-      viewer-path="/public/pdfjs-4.5.136-dist"
+      viewer-path="/public/pdfjs-4.10.38-dist"
       style="height: 100dvh">
     </pdfjs-viewer-element>
 

demo/pdf-data-load.html

@@ -16,7 +16,7 @@
   <body>
     <pdfjs-viewer-element
       id="viewer"
-      viewer-path="/public/pdfjs-4.5.136-dist"
+      viewer-path="/public/pdfjs-4.10.38-dist"
       style="height: 100dvh">
     </pdfjs-viewer-element>
 

index.html

@@ -10,23 +10,23 @@
   <body style="margin: 0">
     <pdfjs-viewer-element 
       src="/fake-file.pdf" 
-      viewer-path="/pdfjs-4.5.136-dist"
+      viewer-path="/pdfjs-4.10.38-dist"
       style="height: 600px">
     </pdfjs-viewer-element>
     <pdfjs-viewer-element 
       id="hideOpenFileViewer"
       src="/sample-pdf-with-images.pdf" 
-      viewer-path="/pdfjs-4.5.136-dist"
+      viewer-path="/pdfjs-4.10.38-dist"
       locale="de"
       page="2"
       style="height: 600px">
     </pdfjs-viewer-element>
-    <button onclick="document.querySelector('#hideOpenFileViewer').setAttribute('viewer-extra-styles', '#download { display: none }')">Hide download button</button>
+    <button onclick="document.querySelector('#hideOpenFileViewer').setAttribute('viewer-extra-styles', '#downloadButton { display: none }')">Hide download button</button>
     <button onclick="document.querySelector('#hideOpenFileViewer').setAttribute('viewer-extra-styles', '')">Show download button</button>
     <pdfjs-viewer-element 
       id="themedViewer"
       src="/sample-pdf-10MB.pdf" 
-      viewer-path="/pdfjs-4.5.136-dist"
+      viewer-path="/pdfjs-4.10.38-dist"
       viewer-css-theme="DARK"
       locale="es"
       style="height: 600px">
@@ -47,7 +47,7 @@
 
     <pdfjs-viewer-element
       id="base-viewer"
-      viewer-path="/pdfjs-4.5.136-dist"
+      viewer-path="/pdfjs-4.10.38-dist"
       locale="uk"
       style="height: clamp(600px, 600px, 80dvh)">
     </pdfjs-viewer-element>

package.json

@@ -1,6 +1,6 @@
 {
   "name": "pdfjs-viewer-element",
-  "version": "2.6.5",
+  "version": "2.7.0",
   "license": "MIT",
   "author": {
     "name": "Oleksandr Shevchuk",
@@ -11,7 +11,9 @@
     "pdfjs",
     "pdf viewer",
     "pdfjs viewer",
-    "web component"
+    "web component",
+    "pdfjs viewer element",
+    "pdf"
   ],
   "main": "./dist/pdfjs-viewer-element.js",
   "module": "./dist/pdfjs-viewer-element.js",
@@ -37,14 +39,17 @@
   },
   "devDependencies": {
     "@awlsn/pdfjs-full": "^4.2.392",
+    "@rollup/plugin-terser": "^0.4.4",
     "@types/node": "^18.19.31",
     "@vitest/browser": "^1.5.0",
     "jsdom": "^22.1.0",
-    "perfect-debounce": "^1.0.0",
     "typescript": "^4.9.5",
     "vite": "^5.2.9",
     "vitest": "^1.5.0",
     "webdriverio": "^8.36.1"
   },
-  "packageManager": "pnpm@9.7.0+sha512.dc09430156b427f5ecfc79888899e1c39d2d690f004be70e05230b72cb173d96839587545d09429b55ac3c429c801b4dc3c0e002f653830a420fa2dd4e3cf9cf"
+  "packageManager": "pnpm@9.7.0+sha512.dc09430156b427f5ecfc79888899e1c39d2d690f004be70e05230b72cb173d96839587545d09429b55ac3c429c801b4dc3c0e002f653830a420fa2dd4e3cf9cf",
+  "dependencies": {
+    "perfect-debounce": "^1.0.0"
+  }
 }