@docmentis/udoc-viewer 0.5.17 → 0.5.19
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +247 -128
- package/dist/package.json +5 -2
- package/dist/src/UDocClient.d.ts +69 -0
- package/dist/src/UDocClient.d.ts.map +1 -1
- package/dist/src/UDocClient.js +6 -7
- package/dist/src/UDocClient.js.map +1 -1
- package/dist/src/UDocViewer.d.ts +119 -1
- package/dist/src/UDocViewer.d.ts.map +1 -1
- package/dist/src/UDocViewer.js +328 -9
- package/dist/src/UDocViewer.js.map +1 -1
- package/dist/src/fonts.d.ts.map +1 -1
- package/dist/src/fonts.js.map +1 -1
- package/dist/src/index.d.ts +3 -2
- package/dist/src/index.d.ts.map +1 -1
- package/dist/src/index.js.map +1 -1
- package/dist/src/meta-url.js.map +1 -1
- package/dist/src/performance/PerformanceCounter.d.ts.map +1 -1
- package/dist/src/performance/PerformanceCounter.js.map +1 -1
- package/dist/src/performance/index.d.ts.map +1 -1
- package/dist/src/performance/index.js.map +1 -1
- package/dist/src/ui/framework/component.d.ts.map +1 -1
- package/dist/src/ui/framework/component.js.map +1 -1
- package/dist/src/ui/framework/selectors.d.ts.map +1 -1
- package/dist/src/ui/framework/selectors.js +1 -3
- package/dist/src/ui/framework/selectors.js.map +1 -1
- package/dist/src/ui/framework/store.d.ts.map +1 -1
- package/dist/src/ui/framework/store.js.map +1 -1
- package/dist/src/ui/viewer/actions.d.ts +19 -0
- package/dist/src/ui/viewer/actions.d.ts.map +1 -1
- package/dist/src/ui/viewer/annotation/LinkRenderer.d.ts.map +1 -1
- package/dist/src/ui/viewer/annotation/LinkRenderer.js.map +1 -1
- package/dist/src/ui/viewer/annotation/MarkupRenderer.d.ts.map +1 -1
- package/dist/src/ui/viewer/annotation/MarkupRenderer.js +1 -3
- package/dist/src/ui/viewer/annotation/MarkupRenderer.js.map +1 -1
- package/dist/src/ui/viewer/annotation/ShapeRenderer.d.ts.map +1 -1
- package/dist/src/ui/viewer/annotation/ShapeRenderer.js +12 -18
- package/dist/src/ui/viewer/annotation/ShapeRenderer.js.map +1 -1
- package/dist/src/ui/viewer/annotation/TextRenderer.d.ts.map +1 -1
- package/dist/src/ui/viewer/annotation/TextRenderer.js +2 -2
- package/dist/src/ui/viewer/annotation/TextRenderer.js.map +1 -1
- package/dist/src/ui/viewer/annotation/index.d.ts +2 -2
- package/dist/src/ui/viewer/annotation/index.d.ts.map +1 -1
- package/dist/src/ui/viewer/annotation/index.js +1 -1
- package/dist/src/ui/viewer/annotation/index.js.map +1 -1
- package/dist/src/ui/viewer/annotation/render.d.ts.map +1 -1
- package/dist/src/ui/viewer/annotation/render.js.map +1 -1
- package/dist/src/ui/viewer/annotation/types.d.ts.map +1 -1
- package/dist/src/ui/viewer/annotation/utils.d.ts.map +1 -1
- package/dist/src/ui/viewer/annotation/utils.js +2 -2
- package/dist/src/ui/viewer/annotation/utils.js.map +1 -1
- package/dist/src/ui/viewer/components/AnnotationPanel.d.ts.map +1 -1
- package/dist/src/ui/viewer/components/AnnotationPanel.js +9 -13
- package/dist/src/ui/viewer/components/AnnotationPanel.js.map +1 -1
- package/dist/src/ui/viewer/components/FloatingToolbar.d.ts.map +1 -1
- package/dist/src/ui/viewer/components/FloatingToolbar.js +12 -10
- package/dist/src/ui/viewer/components/FloatingToolbar.js.map +1 -1
- package/dist/src/ui/viewer/components/LeftPanel.d.ts.map +1 -1
- package/dist/src/ui/viewer/components/LeftPanel.js +16 -3
- package/dist/src/ui/viewer/components/LeftPanel.js.map +1 -1
- package/dist/src/ui/viewer/components/OutlinePanel.d.ts.map +1 -1
- package/dist/src/ui/viewer/components/OutlinePanel.js +3 -3
- package/dist/src/ui/viewer/components/OutlinePanel.js.map +1 -1
- package/dist/src/ui/viewer/components/PasswordDialog.d.ts.map +1 -1
- package/dist/src/ui/viewer/components/PasswordDialog.js.map +1 -1
- package/dist/src/ui/viewer/components/RightPanel.d.ts.map +1 -1
- package/dist/src/ui/viewer/components/RightPanel.js +13 -3
- package/dist/src/ui/viewer/components/RightPanel.js.map +1 -1
- package/dist/src/ui/viewer/components/Spread.d.ts.map +1 -1
- package/dist/src/ui/viewer/components/Spread.js +10 -13
- package/dist/src/ui/viewer/components/Spread.js.map +1 -1
- package/dist/src/ui/viewer/components/ThumbnailPanel.d.ts.map +1 -1
- package/dist/src/ui/viewer/components/ThumbnailPanel.js +5 -5
- package/dist/src/ui/viewer/components/ThumbnailPanel.js.map +1 -1
- package/dist/src/ui/viewer/components/Toolbar.d.ts.map +1 -1
- package/dist/src/ui/viewer/components/Toolbar.js +320 -18
- package/dist/src/ui/viewer/components/Toolbar.js.map +1 -1
- package/dist/src/ui/viewer/components/ViewModeMenu.d.ts.map +1 -1
- package/dist/src/ui/viewer/components/ViewModeMenu.js +7 -7
- package/dist/src/ui/viewer/components/ViewModeMenu.js.map +1 -1
- package/dist/src/ui/viewer/components/Viewport.d.ts +1 -1
- package/dist/src/ui/viewer/components/Viewport.d.ts.map +1 -1
- package/dist/src/ui/viewer/components/Viewport.js +140 -130
- package/dist/src/ui/viewer/components/Viewport.js.map +1 -1
- package/dist/src/ui/viewer/effects.d.ts.map +1 -1
- package/dist/src/ui/viewer/effects.js +5 -8
- package/dist/src/ui/viewer/effects.js.map +1 -1
- package/dist/src/ui/viewer/layout/spreadLayout.d.ts.map +1 -1
- package/dist/src/ui/viewer/layout/spreadLayout.js +11 -13
- package/dist/src/ui/viewer/layout/spreadLayout.js.map +1 -1
- package/dist/src/ui/viewer/navigation.d.ts.map +1 -1
- package/dist/src/ui/viewer/navigation.js +1 -1
- package/dist/src/ui/viewer/navigation.js.map +1 -1
- package/dist/src/ui/viewer/reducer.d.ts.map +1 -1
- package/dist/src/ui/viewer/reducer.js +73 -13
- package/dist/src/ui/viewer/reducer.js.map +1 -1
- package/dist/src/ui/viewer/shell.d.ts +1 -1
- package/dist/src/ui/viewer/shell.d.ts.map +1 -1
- package/dist/src/ui/viewer/shell.js +13 -4
- package/dist/src/ui/viewer/shell.js.map +1 -1
- package/dist/src/ui/viewer/state.d.ts +12 -0
- package/dist/src/ui/viewer/state.d.ts.map +1 -1
- package/dist/src/ui/viewer/state.js +6 -0
- package/dist/src/ui/viewer/state.js.map +1 -1
- package/dist/src/ui/viewer/styles-inline.d.ts +1 -1
- package/dist/src/ui/viewer/styles-inline.d.ts.map +1 -1
- package/dist/src/ui/viewer/styles-inline.js +81 -1
- package/dist/src/ui/viewer/styles-inline.js.map +1 -1
- package/dist/src/ui/viewer/text/render.d.ts.map +1 -1
- package/dist/src/ui/viewer/text/render.js +1 -2
- package/dist/src/ui/viewer/text/render.js.map +1 -1
- package/dist/src/ui/viewer/text/selection.d.ts.map +1 -1
- package/dist/src/ui/viewer/text/selection.js +1 -2
- package/dist/src/ui/viewer/text/selection.js.map +1 -1
- package/dist/src/ui/viewer/text/types.d.ts.map +1 -1
- package/dist/src/wasm/udoc_bg.wasm +0 -0
- package/dist/src/worker/WorkerClient.d.ts +1 -1
- package/dist/src/worker/WorkerClient.d.ts.map +1 -1
- package/dist/src/worker/WorkerClient.js +19 -20
- package/dist/src/worker/WorkerClient.js.map +1 -1
- package/dist/src/worker/index.d.ts.map +1 -1
- package/dist/src/worker/worker-inline.js +1 -1
- package/dist/src/worker/worker.d.ts.map +1 -1
- package/dist/src/worker/worker.js +10 -2
- package/dist/src/worker/worker.js.map +1 -1
- package/package.json +57 -54
package/README.md
CHANGED
|
@@ -21,10 +21,10 @@ Most web document viewers only handle PDF, rely on server-side rendering, or req
|
|
|
21
21
|
|
|
22
22
|
## Supported Formats
|
|
23
23
|
|
|
24
|
-
| Format | Extensions
|
|
25
|
-
|
|
26
|
-
| PDF
|
|
27
|
-
| PPTX
|
|
24
|
+
| Format | Extensions |
|
|
25
|
+
| ------ | ------------------------------------------------------------------------------------------------- |
|
|
26
|
+
| PDF | .pdf |
|
|
27
|
+
| PPTX | .pptx |
|
|
28
28
|
| Images | .png, .jpg, .jpeg, .gif, .webp, .bmp, .tif, .tiff, .ico, .tga, .ppm, .pgm, .pbm, .hdr, .exr, .qoi |
|
|
29
29
|
|
|
30
30
|
## Quick Start
|
|
@@ -38,18 +38,18 @@ npm install @docmentis/udoc-viewer
|
|
|
38
38
|
### Basic Usage
|
|
39
39
|
|
|
40
40
|
```js
|
|
41
|
-
import { UDocClient } from
|
|
41
|
+
import { UDocClient } from "@docmentis/udoc-viewer";
|
|
42
42
|
|
|
43
43
|
// Create a client (loads the WASM engine)
|
|
44
44
|
const client = await UDocClient.create();
|
|
45
45
|
|
|
46
46
|
// Create a viewer attached to a container element
|
|
47
47
|
const viewer = await client.createViewer({
|
|
48
|
-
|
|
48
|
+
container: "#viewer",
|
|
49
49
|
});
|
|
50
50
|
|
|
51
51
|
// Load a document
|
|
52
|
-
await viewer.load(
|
|
52
|
+
await viewer.load("https://example.com/document.pdf");
|
|
53
53
|
|
|
54
54
|
// Clean up when done
|
|
55
55
|
viewer.destroy();
|
|
@@ -62,41 +62,41 @@ client.destroy();
|
|
|
62
62
|
<div id="viewer" style="width: 100%; height: 600px;"></div>
|
|
63
63
|
|
|
64
64
|
<script type="module">
|
|
65
|
-
|
|
65
|
+
import { UDocClient } from "@docmentis/udoc-viewer";
|
|
66
66
|
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
67
|
+
const client = await UDocClient.create();
|
|
68
|
+
const viewer = await client.createViewer({ container: "#viewer" });
|
|
69
|
+
await viewer.load("/path/to/document.pdf");
|
|
70
70
|
</script>
|
|
71
71
|
```
|
|
72
72
|
|
|
73
73
|
### React
|
|
74
74
|
|
|
75
75
|
```jsx
|
|
76
|
-
import { useEffect, useRef } from
|
|
77
|
-
import { UDocClient } from
|
|
76
|
+
import { useEffect, useRef } from "react";
|
|
77
|
+
import { UDocClient } from "@docmentis/udoc-viewer";
|
|
78
78
|
|
|
79
79
|
function DocumentViewer({ src }) {
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
80
|
+
const containerRef = useRef(null);
|
|
81
|
+
|
|
82
|
+
useEffect(() => {
|
|
83
|
+
let client, viewer;
|
|
84
|
+
|
|
85
|
+
(async () => {
|
|
86
|
+
client = await UDocClient.create();
|
|
87
|
+
viewer = await client.createViewer({
|
|
88
|
+
container: containerRef.current,
|
|
89
|
+
});
|
|
90
|
+
await viewer.load(src);
|
|
91
|
+
})();
|
|
92
|
+
|
|
93
|
+
return () => {
|
|
94
|
+
viewer?.destroy();
|
|
95
|
+
client?.destroy();
|
|
96
|
+
};
|
|
97
|
+
}, [src]);
|
|
98
|
+
|
|
99
|
+
return <div ref={containerRef} style={{ width: "100%", height: "600px" }} />;
|
|
100
100
|
}
|
|
101
101
|
```
|
|
102
102
|
|
|
@@ -104,14 +104,14 @@ function DocumentViewer({ src }) {
|
|
|
104
104
|
|
|
105
105
|
Full working examples for every major framework are in the [`examples/`](../../examples/) directory:
|
|
106
106
|
|
|
107
|
-
| Example
|
|
108
|
-
|
|
109
|
-
| [vanilla](../../examples/vanilla/)
|
|
110
|
-
| [react-vite](../../examples/react-vite/)
|
|
111
|
-
| [vue-vite](../../examples/vue-vite/)
|
|
112
|
-
| [svelte-vite](../../examples/svelte-vite/)
|
|
113
|
-
| [angular](../../examples/angular/)
|
|
114
|
-
| [nextjs-webpack](../../examples/nextjs-webpack/)
|
|
107
|
+
| Example | Stack |
|
|
108
|
+
| ---------------------------------------------------- | ------------------- |
|
|
109
|
+
| [vanilla](../../examples/vanilla/) | TypeScript + Vite |
|
|
110
|
+
| [react-vite](../../examples/react-vite/) | React + Vite |
|
|
111
|
+
| [vue-vite](../../examples/vue-vite/) | Vue + Vite |
|
|
112
|
+
| [svelte-vite](../../examples/svelte-vite/) | Svelte 5 + Vite |
|
|
113
|
+
| [angular](../../examples/angular/) | Angular 19 |
|
|
114
|
+
| [nextjs-webpack](../../examples/nextjs-webpack/) | Next.js + Webpack |
|
|
115
115
|
| [nextjs-turbopack](../../examples/nextjs-turbopack/) | Next.js + Turbopack |
|
|
116
116
|
|
|
117
117
|
## Features
|
|
@@ -131,7 +131,7 @@ The viewer accepts multiple document sources:
|
|
|
131
131
|
|
|
132
132
|
```typescript
|
|
133
133
|
// From URL
|
|
134
|
-
await viewer.load(
|
|
134
|
+
await viewer.load("https://example.com/document.pdf");
|
|
135
135
|
|
|
136
136
|
// From File object (e.g., from file input)
|
|
137
137
|
await viewer.load(file);
|
|
@@ -151,10 +151,10 @@ When a password-protected document is loaded in UI mode, the viewer automaticall
|
|
|
151
151
|
await viewer.load(source);
|
|
152
152
|
|
|
153
153
|
if (await viewer.needsPassword()) {
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
154
|
+
const success = await viewer.authenticate("my-password");
|
|
155
|
+
if (!success) {
|
|
156
|
+
console.error("Incorrect password");
|
|
157
|
+
}
|
|
158
158
|
}
|
|
159
159
|
```
|
|
160
160
|
|
|
@@ -162,9 +162,13 @@ if (await viewer.needsPassword()) {
|
|
|
162
162
|
|
|
163
163
|
```typescript
|
|
164
164
|
const client = await UDocClient.create({
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
165
|
+
// License key for commercial use (optional)
|
|
166
|
+
// Enables licensed features such as hiding the attribution link
|
|
167
|
+
license: "eyJ2Ijox...",
|
|
168
|
+
|
|
169
|
+
// Custom base URL for worker and WASM files (optional)
|
|
170
|
+
// Expected files: {baseUrl}/worker.js and {baseUrl}/udoc_bg.wasm
|
|
171
|
+
baseUrl: "https://cdn.example.com/udoc/",
|
|
168
172
|
});
|
|
169
173
|
```
|
|
170
174
|
|
|
@@ -172,46 +176,64 @@ const client = await UDocClient.create({
|
|
|
172
176
|
|
|
173
177
|
```typescript
|
|
174
178
|
const viewer = await client.createViewer({
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
179
|
+
// Container element or CSS selector (required for UI mode, omit for headless)
|
|
180
|
+
container: "#viewer",
|
|
181
|
+
|
|
182
|
+
// Scroll mode: 'continuous' or 'spread' (default: 'continuous')
|
|
183
|
+
scrollMode: "continuous",
|
|
184
|
+
|
|
185
|
+
// Layout mode: 'single-page', 'double-page', 'double-page-odd-right', 'double-page-odd-left'
|
|
186
|
+
// (default: 'single-page')
|
|
187
|
+
layoutMode: "single-page",
|
|
188
|
+
|
|
189
|
+
// Zoom mode: 'fit-spread-width', 'fit-spread-height', 'fit-spread', 'custom'
|
|
190
|
+
// (default: 'fit-spread-width')
|
|
191
|
+
zoomMode: "fit-spread-width",
|
|
192
|
+
|
|
193
|
+
// Initial zoom level (when zoomMode is 'custom', default: 1)
|
|
194
|
+
zoom: 1,
|
|
195
|
+
|
|
196
|
+
// Custom zoom steps for zoom in/out
|
|
197
|
+
// (default: [0.1, 0.25, 0.5, 0.75, 1, 1.25, 1.5, 2, 3, 4, 5])
|
|
198
|
+
zoomSteps: [0.1, 0.25, 0.5, 0.75, 1, 1.25, 1.5, 2, 3, 4, 5],
|
|
199
|
+
|
|
200
|
+
// Spacing between pages in pixels (default: 10)
|
|
201
|
+
pageSpacing: 10,
|
|
202
|
+
|
|
203
|
+
// Spacing between spreads in pixels (default: 20)
|
|
204
|
+
spreadSpacing: 20,
|
|
205
|
+
|
|
206
|
+
// Initially active panel, or null for no panel (default: null)
|
|
207
|
+
// Left panels: 'thumbnail', 'outline', 'bookmarks', 'layers', 'attachments'
|
|
208
|
+
// Right panels: 'search', 'comments'
|
|
209
|
+
activePanel: null,
|
|
210
|
+
|
|
211
|
+
// Target display DPI (default: 96)
|
|
212
|
+
dpi: 96,
|
|
213
|
+
|
|
214
|
+
// Enable Google Fonts for automatic font fetching (default: true)
|
|
215
|
+
googleFonts: true,
|
|
216
|
+
|
|
217
|
+
// Enable performance tracking (default: false)
|
|
218
|
+
enablePerformanceCounter: false,
|
|
219
|
+
|
|
220
|
+
// Hide the "Powered by docMentis" attribution link (default: false)
|
|
221
|
+
// Requires a valid license with the "no_attribution" feature
|
|
222
|
+
hideAttribution: true,
|
|
223
|
+
|
|
224
|
+
// UI visibility options (all default to false)
|
|
225
|
+
hideToolbar: false, // Hide the top toolbar
|
|
226
|
+
hideFloatingToolbar: false, // Hide the floating toolbar (page nav, zoom, view mode)
|
|
227
|
+
disableFullscreen: false, // Remove the fullscreen button
|
|
228
|
+
disableLeftPanel: false, // Disable the entire left panel area
|
|
229
|
+
disableRightPanel: false, // Disable the entire right panel area
|
|
230
|
+
disableThumbnails: false, // Disable the thumbnails tab
|
|
231
|
+
disableOutline: false, // Disable the outline tab
|
|
232
|
+
disableBookmarks: false, // Disable the bookmarks tab
|
|
233
|
+
disableLayers: false, // Disable the layers tab
|
|
234
|
+
disableAttachments: false, // Disable the attachments tab
|
|
235
|
+
disableSearch: false, // Disable the search panel
|
|
236
|
+
disableComments: false, // Disable the comments panel
|
|
215
237
|
});
|
|
216
238
|
```
|
|
217
239
|
|
|
@@ -224,6 +246,10 @@ const page = viewer.currentPage;
|
|
|
224
246
|
// Go to a specific page (1-based)
|
|
225
247
|
viewer.goToPage(5);
|
|
226
248
|
|
|
249
|
+
// Navigate to next/previous page
|
|
250
|
+
viewer.nextPage();
|
|
251
|
+
viewer.previousPage();
|
|
252
|
+
|
|
227
253
|
// Navigate to a destination (from outline)
|
|
228
254
|
viewer.goToDestination(destination);
|
|
229
255
|
```
|
|
@@ -233,22 +259,22 @@ viewer.goToDestination(destination);
|
|
|
233
259
|
```typescript
|
|
234
260
|
// Check if document is loaded
|
|
235
261
|
if (viewer.isLoaded) {
|
|
236
|
-
|
|
237
|
-
|
|
262
|
+
// Get page count
|
|
263
|
+
const total = viewer.pageCount;
|
|
238
264
|
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
265
|
+
// Get document metadata
|
|
266
|
+
const meta = viewer.metadata;
|
|
267
|
+
console.log(meta?.title, meta?.author);
|
|
242
268
|
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
269
|
+
// Get page dimensions (0-based index)
|
|
270
|
+
const info = await viewer.getPageInfo(0);
|
|
271
|
+
console.log(`Page 1: ${info.width} x ${info.height} points`);
|
|
246
272
|
|
|
247
|
-
|
|
248
|
-
|
|
273
|
+
// Get document outline (table of contents)
|
|
274
|
+
const outline = await viewer.getOutline();
|
|
249
275
|
|
|
250
|
-
|
|
251
|
-
|
|
276
|
+
// Get annotations on a page (0-based index)
|
|
277
|
+
const annotations = await viewer.getPageAnnotations(0);
|
|
252
278
|
}
|
|
253
279
|
```
|
|
254
280
|
|
|
@@ -266,15 +292,15 @@ const imageData = await viewer.renderPage(0, { scale: 2 });
|
|
|
266
292
|
|
|
267
293
|
// Render to Blob
|
|
268
294
|
const blob = await viewer.renderPage(0, {
|
|
269
|
-
|
|
270
|
-
|
|
295
|
+
format: "blob",
|
|
296
|
+
imageType: "image/png",
|
|
271
297
|
});
|
|
272
298
|
|
|
273
299
|
// Render to data URL
|
|
274
300
|
const dataUrl = await viewer.renderPage(0, {
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
301
|
+
format: "data-url",
|
|
302
|
+
imageType: "image/jpeg",
|
|
303
|
+
quality: 0.9,
|
|
278
304
|
});
|
|
279
305
|
|
|
280
306
|
// Render thumbnail
|
|
@@ -288,7 +314,7 @@ const thumb = await viewer.renderThumbnail(0, { scale: 1 });
|
|
|
288
314
|
const bytes = await viewer.toBytes();
|
|
289
315
|
|
|
290
316
|
// Download document as a file
|
|
291
|
-
await viewer.download(
|
|
317
|
+
await viewer.download("document.pdf");
|
|
292
318
|
```
|
|
293
319
|
|
|
294
320
|
### Document Composition
|
|
@@ -298,15 +324,15 @@ Compose new documents by cherry-picking and rotating pages:
|
|
|
298
324
|
```typescript
|
|
299
325
|
// Create a new document from pages of existing documents
|
|
300
326
|
const [newDoc] = await client.compose([
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
327
|
+
[
|
|
328
|
+
{ doc: viewerA, pages: "1-3" },
|
|
329
|
+
{ doc: viewerB, pages: "5", rotation: 90 },
|
|
330
|
+
],
|
|
305
331
|
]);
|
|
306
332
|
|
|
307
333
|
// Export the composed document
|
|
308
334
|
const bytes = await newDoc.toBytes();
|
|
309
|
-
await newDoc.download(
|
|
335
|
+
await newDoc.download("composed.pdf");
|
|
310
336
|
```
|
|
311
337
|
|
|
312
338
|
### Document Utilities
|
|
@@ -314,13 +340,13 @@ await newDoc.download('composed.pdf');
|
|
|
314
340
|
```typescript
|
|
315
341
|
// Split a document by its outline (table of contents)
|
|
316
342
|
const { viewers, sections } = await client.splitByOutline(source, {
|
|
317
|
-
|
|
318
|
-
|
|
343
|
+
maxLevel: 2,
|
|
344
|
+
splitMidPage: false,
|
|
319
345
|
});
|
|
320
346
|
|
|
321
347
|
// Extract images from a document
|
|
322
348
|
const images = await client.extractImages(source, {
|
|
323
|
-
|
|
349
|
+
convertRawToPng: true,
|
|
324
350
|
});
|
|
325
351
|
|
|
326
352
|
// Extract fonts from a document
|
|
@@ -333,33 +359,126 @@ const compressed = await client.compress(source);
|
|
|
333
359
|
const decompressed = await client.decompress(source);
|
|
334
360
|
```
|
|
335
361
|
|
|
362
|
+
### UI Visibility Control
|
|
363
|
+
|
|
364
|
+
Show, hide, or disable UI components at runtime:
|
|
365
|
+
|
|
366
|
+
```typescript
|
|
367
|
+
// Toolbar visibility
|
|
368
|
+
viewer.setToolbarVisible(false);
|
|
369
|
+
viewer.setFloatingToolbarVisible(false);
|
|
370
|
+
|
|
371
|
+
// Fullscreen button
|
|
372
|
+
viewer.setFullscreenEnabled(false);
|
|
373
|
+
|
|
374
|
+
// Disable entire panel areas
|
|
375
|
+
viewer.setLeftPanelEnabled(false);
|
|
376
|
+
viewer.setRightPanelEnabled(false);
|
|
377
|
+
|
|
378
|
+
// Disable individual panel tabs
|
|
379
|
+
// Panels: 'thumbnail', 'outline', 'bookmarks', 'layers', 'attachments', 'search', 'comments'
|
|
380
|
+
viewer.setPanelEnabled("thumbnail", false);
|
|
381
|
+
viewer.setPanelEnabled("search", false);
|
|
382
|
+
|
|
383
|
+
// Open/close panels programmatically
|
|
384
|
+
viewer.openPanel("outline");
|
|
385
|
+
viewer.closePanel();
|
|
386
|
+
```
|
|
387
|
+
|
|
388
|
+
### Programmatic Viewer Control
|
|
389
|
+
|
|
390
|
+
Control zoom, view modes, and fullscreen programmatically — useful when toolbars are hidden:
|
|
391
|
+
|
|
392
|
+
```typescript
|
|
393
|
+
// Zoom
|
|
394
|
+
viewer.zoomIn();
|
|
395
|
+
viewer.zoomOut();
|
|
396
|
+
viewer.setZoom(1.5); // 150%
|
|
397
|
+
viewer.setZoomMode("fit-spread-width");
|
|
398
|
+
console.log(viewer.zoom); // current zoom level
|
|
399
|
+
console.log(viewer.zoomMode); // current zoom mode
|
|
400
|
+
|
|
401
|
+
// View modes
|
|
402
|
+
viewer.setScrollMode("continuous"); // 'continuous' | 'spread'
|
|
403
|
+
viewer.setLayoutMode("double-page"); // 'single-page' | 'double-page' | ...
|
|
404
|
+
viewer.setPageRotation(90); // 0 | 90 | 180 | 270
|
|
405
|
+
viewer.setSpacingMode("none"); // 'all' | 'none' | 'spread-only' | 'page-only'
|
|
406
|
+
|
|
407
|
+
// Fullscreen
|
|
408
|
+
viewer.setFullscreen(true);
|
|
409
|
+
console.log(viewer.isFullscreen);
|
|
410
|
+
```
|
|
411
|
+
|
|
336
412
|
### Events
|
|
337
413
|
|
|
338
414
|
```typescript
|
|
339
415
|
// Document loaded
|
|
340
|
-
const unsubscribe = viewer.on(
|
|
341
|
-
|
|
416
|
+
const unsubscribe = viewer.on("document:load", ({ pageCount }) => {
|
|
417
|
+
console.log(`Loaded ${pageCount} pages`);
|
|
342
418
|
});
|
|
343
419
|
|
|
344
420
|
// Document closed
|
|
345
|
-
viewer.on(
|
|
346
|
-
|
|
421
|
+
viewer.on("document:close", () => {
|
|
422
|
+
console.log("Document closed");
|
|
423
|
+
});
|
|
424
|
+
|
|
425
|
+
// Page changed
|
|
426
|
+
viewer.on("page:change", ({ page, previousPage }) => {
|
|
427
|
+
console.log(`Page ${previousPage} -> ${page}`);
|
|
428
|
+
});
|
|
429
|
+
|
|
430
|
+
// Panel opened/closed
|
|
431
|
+
viewer.on("panel:change", ({ panel, previousPanel }) => {
|
|
432
|
+
console.log(`Panel: ${previousPanel} -> ${panel}`);
|
|
433
|
+
});
|
|
434
|
+
|
|
435
|
+
// UI component visibility changed
|
|
436
|
+
viewer.on("ui:visibilityChange", ({ component, visible }) => {
|
|
437
|
+
console.log(`${component} is now ${visible ? "visible" : "hidden"}`);
|
|
347
438
|
});
|
|
348
439
|
|
|
349
440
|
// Download progress
|
|
350
|
-
viewer.on(
|
|
351
|
-
|
|
441
|
+
viewer.on("download:progress", ({ loaded, total, percent }) => {
|
|
442
|
+
console.log(`Downloaded ${loaded}/${total} bytes (${percent}%)`);
|
|
352
443
|
});
|
|
353
444
|
|
|
354
445
|
// Error occurred
|
|
355
|
-
viewer.on(
|
|
356
|
-
|
|
446
|
+
viewer.on("error", ({ error, phase }) => {
|
|
447
|
+
console.error(`Error during ${phase}:`, error);
|
|
357
448
|
});
|
|
358
449
|
|
|
359
450
|
// Unsubscribe
|
|
360
451
|
unsubscribe();
|
|
361
452
|
```
|
|
362
453
|
|
|
454
|
+
## Licensing
|
|
455
|
+
|
|
456
|
+
udoc-viewer is free to use, including in commercial applications. A "Powered by docMentis" attribution link is shown by default.
|
|
457
|
+
|
|
458
|
+
To remove the attribution, contact [licensing@docmentis.com](mailto:licensing@docmentis.com) to purchase a license, then pass it when creating the client:
|
|
459
|
+
|
|
460
|
+
```typescript
|
|
461
|
+
const client = await UDocClient.create({
|
|
462
|
+
license: "eyJ2Ijox...",
|
|
463
|
+
});
|
|
464
|
+
|
|
465
|
+
const viewer = await client.createViewer({
|
|
466
|
+
container: "#viewer",
|
|
467
|
+
hideAttribution: true,
|
|
468
|
+
});
|
|
469
|
+
```
|
|
470
|
+
|
|
471
|
+
The `hideAttribution` option is only honored when the license includes the `no_attribution` feature. Without a valid license, the attribution link will remain visible.
|
|
472
|
+
|
|
473
|
+
You can check license status programmatically:
|
|
474
|
+
|
|
475
|
+
```typescript
|
|
476
|
+
console.log(client.license);
|
|
477
|
+
// { valid: true, tier: "licensed", features: ["no_attribution"], ... }
|
|
478
|
+
|
|
479
|
+
console.log(client.hasFeature("no_attribution")); // true
|
|
480
|
+
```
|
|
481
|
+
|
|
363
482
|
## How It Works
|
|
364
483
|
|
|
365
484
|
udoc-viewer uses a custom document processing engine written in Rust, compiled to WebAssembly. Documents are parsed and rendered entirely in the browser with near-native performance — no PDF.js, no iframe hacks, no server-side conversion.
|
|
@@ -368,11 +487,11 @@ The JavaScript wrapper (`@docmentis/udoc-viewer`) is MIT-licensed and open sourc
|
|
|
368
487
|
|
|
369
488
|
## Browser Support
|
|
370
489
|
|
|
371
|
-
| Browser
|
|
372
|
-
|
|
373
|
-
| Chrome / Edge | ✅ 80+
|
|
374
|
-
| Firefox
|
|
375
|
-
| Safari
|
|
490
|
+
| Browser | Supported |
|
|
491
|
+
| ------------- | --------- |
|
|
492
|
+
| Chrome / Edge | ✅ 80+ |
|
|
493
|
+
| Firefox | ✅ 80+ |
|
|
494
|
+
| Safari | ✅ 15+ |
|
|
376
495
|
|
|
377
496
|
Requires WebAssembly support.
|
|
378
497
|
|
package/dist/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@docmentis/udoc-viewer",
|
|
3
|
-
"version": "0.5.
|
|
3
|
+
"version": "0.5.19",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"description": "Free, open-source, universal document viewer for the web. Render PDF, PPTX, and images with high fidelity — no server required.",
|
|
@@ -49,10 +49,13 @@
|
|
|
49
49
|
"build": "node scripts/build-styles.js && tsc && rm -rf dist/src/wasm && cp -r src/wasm dist/src/wasm && node scripts/bundle-worker.js",
|
|
50
50
|
"clean": "rm -rf dist",
|
|
51
51
|
"dev": "tsc --watch",
|
|
52
|
+
"test": "vitest run",
|
|
53
|
+
"test:watch": "vitest",
|
|
52
54
|
"prepublishOnly": "npm run build"
|
|
53
55
|
},
|
|
54
56
|
"devDependencies": {
|
|
55
57
|
"esbuild": "^0.25.0",
|
|
56
|
-
"typescript": "^5.7.2"
|
|
58
|
+
"typescript": "^5.7.2",
|
|
59
|
+
"vitest": "^4.0.18"
|
|
57
60
|
}
|
|
58
61
|
}
|
package/dist/src/UDocClient.d.ts
CHANGED
|
@@ -140,6 +140,75 @@ export interface ViewerOptions {
|
|
|
140
140
|
* @default true
|
|
141
141
|
*/
|
|
142
142
|
googleFonts?: boolean;
|
|
143
|
+
/**
|
|
144
|
+
* Hide the "Powered by docMentis" attribution link.
|
|
145
|
+
* Requires a valid license with the "no_attribution" feature.
|
|
146
|
+
* Ignored without a qualifying license.
|
|
147
|
+
* @default false
|
|
148
|
+
*/
|
|
149
|
+
hideAttribution?: boolean;
|
|
150
|
+
/**
|
|
151
|
+
* Hide the top toolbar.
|
|
152
|
+
* @default false
|
|
153
|
+
*/
|
|
154
|
+
hideToolbar?: boolean;
|
|
155
|
+
/**
|
|
156
|
+
* Hide the floating toolbar (page navigation, zoom, view mode controls).
|
|
157
|
+
* When hidden and the top toolbar is visible, the controls are moved into the top toolbar.
|
|
158
|
+
* @default false
|
|
159
|
+
*/
|
|
160
|
+
hideFloatingToolbar?: boolean;
|
|
161
|
+
/**
|
|
162
|
+
* Disable the fullscreen button.
|
|
163
|
+
* @default false
|
|
164
|
+
*/
|
|
165
|
+
disableFullscreen?: boolean;
|
|
166
|
+
/**
|
|
167
|
+
* Disable the entire left panel area (thumbnails, outline, bookmarks, layers, attachments).
|
|
168
|
+
* @default false
|
|
169
|
+
*/
|
|
170
|
+
disableLeftPanel?: boolean;
|
|
171
|
+
/**
|
|
172
|
+
* Disable the entire right panel area (search, comments).
|
|
173
|
+
* @default false
|
|
174
|
+
*/
|
|
175
|
+
disableRightPanel?: boolean;
|
|
176
|
+
/**
|
|
177
|
+
* Disable the thumbnail panel tab.
|
|
178
|
+
* Disabled panels are removed from the UI and cannot be opened.
|
|
179
|
+
* @default false
|
|
180
|
+
*/
|
|
181
|
+
disableThumbnails?: boolean;
|
|
182
|
+
/**
|
|
183
|
+
* Disable the outline (table of contents) panel tab.
|
|
184
|
+
* @default false
|
|
185
|
+
*/
|
|
186
|
+
disableOutline?: boolean;
|
|
187
|
+
/**
|
|
188
|
+
* Disable the bookmarks panel tab.
|
|
189
|
+
* @default false
|
|
190
|
+
*/
|
|
191
|
+
disableBookmarks?: boolean;
|
|
192
|
+
/**
|
|
193
|
+
* Disable the layers panel tab.
|
|
194
|
+
* @default false
|
|
195
|
+
*/
|
|
196
|
+
disableLayers?: boolean;
|
|
197
|
+
/**
|
|
198
|
+
* Disable the attachments panel tab.
|
|
199
|
+
* @default false
|
|
200
|
+
*/
|
|
201
|
+
disableAttachments?: boolean;
|
|
202
|
+
/**
|
|
203
|
+
* Disable the search panel tab.
|
|
204
|
+
* @default false
|
|
205
|
+
*/
|
|
206
|
+
disableSearch?: boolean;
|
|
207
|
+
/**
|
|
208
|
+
* Disable the comments panel tab.
|
|
209
|
+
* @default false
|
|
210
|
+
*/
|
|
211
|
+
disableComments?: boolean;
|
|
143
212
|
}
|
|
144
213
|
/**
|
|
145
214
|
* A document source can be:
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"UDocClient.d.ts","sourceRoot":"","sources":["../../src/UDocClient.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACjD,OAAO,KAAK,
|
|
1
|
+
{"version":3,"file":"UDocClient.d.ts","sourceRoot":"","sources":["../../src/UDocClient.ts"],"names":[],"mappings":"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"}
|