@embedpdf/plugin-annotation 1.0.10 → 1.0.12

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.
Files changed (71) hide show
  1. package/dist/index.cjs +2 -693
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.d.ts +1 -266
  4. package/dist/index.js +180 -158
  5. package/dist/index.js.map +1 -1
  6. package/dist/lib/actions.d.ts +104 -0
  7. package/dist/lib/annotation-plugin.d.ts +33 -0
  8. package/dist/lib/index.d.ts +10 -0
  9. package/dist/lib/manifest.d.ts +4 -0
  10. package/dist/lib/reducer.d.ts +5 -0
  11. package/dist/lib/selectors.d.ts +13 -0
  12. package/dist/lib/types.d.ts +121 -0
  13. package/dist/lib/utils.d.ts +11 -0
  14. package/dist/lib/variant-key.d.ts +8 -0
  15. package/dist/preact/adapter.d.ts +8 -0
  16. package/dist/preact/core.d.ts +1 -0
  17. package/dist/preact/index.cjs +2 -1038
  18. package/dist/preact/index.cjs.map +1 -1
  19. package/dist/preact/index.d.ts +1 -28
  20. package/dist/preact/index.js +126 -156
  21. package/dist/preact/index.js.map +1 -1
  22. package/dist/preact/interaction-manager.d.ts +1 -0
  23. package/dist/preact/selection.d.ts +1 -0
  24. package/dist/react/adapter.d.ts +2 -0
  25. package/dist/react/core.d.ts +1 -0
  26. package/dist/react/index.cjs +2 -0
  27. package/dist/react/index.cjs.map +1 -0
  28. package/dist/react/index.d.ts +1 -0
  29. package/dist/react/index.js +983 -0
  30. package/dist/react/index.js.map +1 -0
  31. package/dist/react/interaction-manager.d.ts +1 -0
  32. package/dist/react/selection.d.ts +1 -0
  33. package/dist/shared-preact/components/annotation-container.d.ts +19 -0
  34. package/dist/shared-preact/components/annotation-layer.d.ts +11 -0
  35. package/dist/shared-preact/components/annotations/ink-highlight-paint.d.ts +0 -0
  36. package/dist/shared-preact/components/annotations/ink-paint.d.ts +17 -0
  37. package/dist/shared-preact/components/annotations/ink.d.ts +23 -0
  38. package/dist/shared-preact/components/annotations.d.ts +7 -0
  39. package/dist/shared-preact/components/index.d.ts +1 -0
  40. package/dist/shared-preact/components/render-annotation.d.ts +11 -0
  41. package/dist/shared-preact/components/text-markup/highlight.d.ts +13 -0
  42. package/dist/shared-preact/components/text-markup/squiggly.d.ts +13 -0
  43. package/dist/shared-preact/components/text-markup/strikeout.d.ts +13 -0
  44. package/dist/shared-preact/components/text-markup/underline.d.ts +13 -0
  45. package/dist/shared-preact/components/text-markup.d.ts +6 -0
  46. package/dist/shared-preact/hooks/index.d.ts +1 -0
  47. package/dist/shared-preact/hooks/use-annotation.d.ts +11 -0
  48. package/dist/shared-preact/index.d.ts +2 -0
  49. package/dist/shared-preact/resize-ink.d.ts +17 -0
  50. package/dist/shared-preact/types.d.ts +1 -0
  51. package/dist/shared-react/components/annotation-container.d.ts +19 -0
  52. package/dist/shared-react/components/annotation-layer.d.ts +11 -0
  53. package/dist/shared-react/components/annotations/ink-highlight-paint.d.ts +0 -0
  54. package/dist/shared-react/components/annotations/ink-paint.d.ts +17 -0
  55. package/dist/shared-react/components/annotations/ink.d.ts +23 -0
  56. package/dist/shared-react/components/annotations.d.ts +7 -0
  57. package/dist/shared-react/components/index.d.ts +1 -0
  58. package/dist/shared-react/components/render-annotation.d.ts +11 -0
  59. package/dist/shared-react/components/text-markup/highlight.d.ts +13 -0
  60. package/dist/shared-react/components/text-markup/squiggly.d.ts +13 -0
  61. package/dist/shared-react/components/text-markup/strikeout.d.ts +13 -0
  62. package/dist/shared-react/components/text-markup/underline.d.ts +13 -0
  63. package/dist/shared-react/components/text-markup.d.ts +6 -0
  64. package/dist/shared-react/hooks/index.d.ts +1 -0
  65. package/dist/shared-react/hooks/use-annotation.d.ts +11 -0
  66. package/dist/shared-react/index.d.ts +2 -0
  67. package/dist/shared-react/resize-ink.d.ts +17 -0
  68. package/dist/shared-react/types.d.ts +1 -0
  69. package/package.json +17 -15
  70. package/dist/index.d.cts +0 -266
  71. package/dist/preact/index.d.cts +0 -28
@@ -1,1038 +1,2 @@
1
- "use strict";
2
- var __defProp = Object.defineProperty;
3
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
- var __getOwnPropNames = Object.getOwnPropertyNames;
5
- var __hasOwnProp = Object.prototype.hasOwnProperty;
6
- var __export = (target, all) => {
7
- for (var name in all)
8
- __defProp(target, name, { get: all[name], enumerable: true });
9
- };
10
- var __copyProps = (to, from, except, desc) => {
11
- if (from && typeof from === "object" || typeof from === "function") {
12
- for (let key of __getOwnPropNames(from))
13
- if (!__hasOwnProp.call(to, key) && key !== except)
14
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
15
- }
16
- return to;
17
- };
18
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
19
-
20
- // src/preact/index.ts
21
- var preact_exports = {};
22
- __export(preact_exports, {
23
- AnnotationLayer: () => AnnotationLayer,
24
- useAnnotationCapability: () => useAnnotationCapability,
25
- useAnnotationPlugin: () => useAnnotationPlugin
26
- });
27
- module.exports = __toCommonJS(preact_exports);
28
-
29
- // src/preact/hooks/use-annotation.ts
30
- var import_preact = require("@embedpdf/core/preact");
31
- var import_plugin_annotation = require("@embedpdf/plugin-annotation");
32
- var useAnnotationPlugin = () => (0, import_preact.usePlugin)(import_plugin_annotation.AnnotationPlugin.id);
33
- var useAnnotationCapability = () => (0, import_preact.useCapability)(import_plugin_annotation.AnnotationPlugin.id);
34
-
35
- // src/preact/components/annotations.tsx
36
- var import_models3 = require("@embedpdf/models");
37
- var import_preact2 = require("@embedpdf/plugin-interaction-manager/preact");
38
- var import_plugin_annotation2 = require("@embedpdf/plugin-annotation");
39
- var import_hooks5 = require("preact/hooks");
40
-
41
- // src/preact/components/annotation-container.tsx
42
- var import_hooks = require("preact/hooks");
43
- var import_models = require("@embedpdf/models");
44
- var import_jsx_runtime = require("preact/jsx-runtime");
45
- function AnnotationContainer({
46
- scale,
47
- pageIndex,
48
- rotation,
49
- trackedAnnotation,
50
- children,
51
- style,
52
- outlineOffset = 1,
53
- isSelected = false,
54
- isDraggable = true,
55
- isResizable = true,
56
- computeResizePatch,
57
- ...props
58
- }) {
59
- const { provides: annotationProvides } = useAnnotationCapability();
60
- const ref = (0, import_hooks.useRef)(null);
61
- const [dragState, setDragState] = (0, import_hooks.useState)("idle");
62
- const [resizeDirection, setResizeDirection] = (0, import_hooks.useState)(null);
63
- const [startPos, setStartPos] = (0, import_hooks.useState)(null);
64
- const [startRect, setStartRect] = (0, import_hooks.useState)(null);
65
- const [currentRect, setCurrentRect] = (0, import_hooks.useState)(trackedAnnotation.object.rect);
66
- const [previewObject, setPreviewObject] = (0, import_hooks.useState)(null);
67
- (0, import_hooks.useEffect)(() => {
68
- setCurrentRect(trackedAnnotation.object.rect);
69
- setPreviewObject(null);
70
- }, [trackedAnnotation]);
71
- const handlePointerDown = (e) => {
72
- if (!isSelected) return;
73
- e.stopPropagation();
74
- e.preventDefault();
75
- const target = e.target;
76
- if (isResizable && target.classList.contains("resize-handle")) {
77
- setDragState("resizing");
78
- setResizeDirection(target.dataset.direction);
79
- } else if (isDraggable) {
80
- setDragState("dragging");
81
- } else {
82
- return;
83
- }
84
- setStartPos({ x: e.clientX, y: e.clientY });
85
- setStartRect(currentRect);
86
- ref.current?.setPointerCapture(e.pointerId);
87
- };
88
- const handlePointerMove = (e) => {
89
- if (dragState === "idle" || !startPos || !startRect) return;
90
- const dispDelta = { x: e.clientX - startPos.x, y: e.clientY - startPos.y };
91
- const { x: dx, y: dy } = (0, import_models.restoreOffset)(dispDelta, rotation, scale);
92
- let newOriginX = startRect.origin.x;
93
- let newOriginY = startRect.origin.y;
94
- let newWidth = startRect.size.width;
95
- let newHeight = startRect.size.height;
96
- if (dragState === "dragging") {
97
- newOriginX += dx;
98
- newOriginY += dy;
99
- } else if (dragState === "resizing" && resizeDirection) {
100
- if (resizeDirection.includes("right")) {
101
- newWidth += dx;
102
- } else if (resizeDirection.includes("left")) {
103
- newOriginX += dx;
104
- newWidth -= dx;
105
- }
106
- if (resizeDirection.includes("bottom")) {
107
- newHeight += dy;
108
- } else if (resizeDirection.includes("top")) {
109
- newOriginY += dy;
110
- newHeight -= dy;
111
- }
112
- if (newWidth < 1 || newHeight < 1) return;
113
- }
114
- const tentativeRect = {
115
- origin: { x: newOriginX, y: newOriginY },
116
- size: { width: newWidth, height: newHeight }
117
- };
118
- let previewPatch = { rect: tentativeRect };
119
- if (computeResizePatch) {
120
- const dir = dragState === "resizing" ? resizeDirection : "bottom-right";
121
- if (dir) {
122
- previewPatch = computeResizePatch(trackedAnnotation.object, tentativeRect, dir);
123
- }
124
- }
125
- setCurrentRect(previewPatch.rect || tentativeRect);
126
- setPreviewObject(previewPatch);
127
- };
128
- const handlePointerUp = (e) => {
129
- if (dragState === "idle") return;
130
- const usedDirection = resizeDirection || "bottom-right";
131
- setDragState("idle");
132
- setResizeDirection(null);
133
- ref.current?.releasePointerCapture(e.pointerId);
134
- if (annotationProvides && trackedAnnotation) {
135
- let patch = { rect: currentRect };
136
- if (computeResizePatch && usedDirection) {
137
- patch = computeResizePatch(trackedAnnotation.object, currentRect, usedDirection);
138
- }
139
- annotationProvides.updateAnnotation(pageIndex, trackedAnnotation.localId, patch);
140
- }
141
- setStartPos(null);
142
- setStartRect(null);
143
- setPreviewObject(null);
144
- };
145
- const currentObject = previewObject ? { ...trackedAnnotation.object, ...previewObject } : trackedAnnotation.object;
146
- return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
147
- "div",
148
- {
149
- ref,
150
- onPointerDown: handlePointerDown,
151
- onPointerMove: handlePointerMove,
152
- onPointerUp: handlePointerUp,
153
- style: {
154
- position: "absolute",
155
- outline: isSelected ? "1px solid #007ACC" : "none",
156
- outlineOffset: isSelected ? `${outlineOffset}px` : "0px",
157
- left: `${currentRect.origin.x * scale}px`,
158
- top: `${currentRect.origin.y * scale}px`,
159
- width: `${currentRect.size.width * scale}px`,
160
- height: `${currentRect.size.height * scale}px`,
161
- pointerEvents: isSelected ? "auto" : "none",
162
- cursor: isSelected && isDraggable ? "move" : "default",
163
- ...style
164
- },
165
- ...props,
166
- children: [
167
- typeof children === "function" ? children(currentObject) : children,
168
- isSelected && isResizable && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
169
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
170
- "div",
171
- {
172
- className: "resize-handle",
173
- "data-direction": "top-left",
174
- style: {
175
- position: "absolute",
176
- top: -7 - outlineOffset,
177
- left: -7 - outlineOffset,
178
- width: 13,
179
- height: 13,
180
- background: "blue",
181
- borderRadius: "50%",
182
- cursor: rotation % 2 ? "nesw-resize" : "nwse-resize"
183
- }
184
- }
185
- ),
186
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
187
- "div",
188
- {
189
- className: "resize-handle",
190
- "data-direction": "top-right",
191
- style: {
192
- position: "absolute",
193
- top: -7 - outlineOffset,
194
- right: -7 - outlineOffset,
195
- width: 13,
196
- height: 13,
197
- background: "blue",
198
- borderRadius: "50%",
199
- cursor: rotation % 2 ? "nwse-resize" : "nesw-resize"
200
- }
201
- }
202
- ),
203
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
204
- "div",
205
- {
206
- className: "resize-handle",
207
- "data-direction": "bottom-left",
208
- style: {
209
- position: "absolute",
210
- bottom: -7 - outlineOffset,
211
- left: -7 - outlineOffset,
212
- width: 13,
213
- height: 13,
214
- background: "blue",
215
- borderRadius: "50%",
216
- cursor: rotation % 2 ? "nwse-resize" : "nesw-resize"
217
- }
218
- }
219
- ),
220
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
221
- "div",
222
- {
223
- className: "resize-handle",
224
- "data-direction": "bottom-right",
225
- style: {
226
- position: "absolute",
227
- bottom: -7 - outlineOffset,
228
- right: -7 - outlineOffset,
229
- width: 13,
230
- height: 13,
231
- background: "blue",
232
- borderRadius: "50%",
233
- cursor: rotation % 2 ? "nesw-resize" : "nwse-resize"
234
- }
235
- }
236
- )
237
- ] })
238
- ]
239
- }
240
- );
241
- }
242
-
243
- // src/preact/components/text-markup/highlight.tsx
244
- var import_jsx_runtime2 = require("preact/jsx-runtime");
245
- function Highlight({
246
- color = "#FFFF00",
247
- opacity = 0.5,
248
- rects,
249
- rect,
250
- scale,
251
- onClick,
252
- style,
253
- ...props
254
- }) {
255
- return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_jsx_runtime2.Fragment, { children: rects.map((b, i) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
256
- "div",
257
- {
258
- onMouseDown: onClick,
259
- style: {
260
- position: "absolute",
261
- left: (rect ? b.origin.x - rect.origin.x : b.origin.x) * scale,
262
- top: (rect ? b.origin.y - rect.origin.y : b.origin.y) * scale,
263
- width: b.size.width * scale,
264
- height: b.size.height * scale,
265
- background: color,
266
- opacity,
267
- pointerEvents: onClick ? "auto" : "none",
268
- cursor: onClick ? "pointer" : "default",
269
- zIndex: onClick ? 1 : null,
270
- ...style
271
- },
272
- ...props
273
- },
274
- i
275
- )) });
276
- }
277
-
278
- // src/preact/components/text-markup/underline.tsx
279
- var import_jsx_runtime3 = require("preact/jsx-runtime");
280
- function Underline({
281
- color = "#FFFF00",
282
- opacity = 0.5,
283
- rects,
284
- rect,
285
- scale,
286
- onClick,
287
- style,
288
- ...props
289
- }) {
290
- const thickness = 2 * scale;
291
- return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_jsx_runtime3.Fragment, { children: rects.map((r, i) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
292
- "div",
293
- {
294
- onMouseDown: onClick,
295
- style: {
296
- position: "absolute",
297
- left: (rect ? r.origin.x - rect.origin.x : r.origin.x) * scale,
298
- top: (rect ? r.origin.y - rect.origin.y : r.origin.y) * scale,
299
- width: r.size.width * scale,
300
- height: r.size.height * scale,
301
- background: "transparent",
302
- pointerEvents: onClick ? "auto" : "none",
303
- cursor: onClick ? "pointer" : "default",
304
- zIndex: onClick ? 1 : 0,
305
- ...style
306
- },
307
- ...props,
308
- children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
309
- "div",
310
- {
311
- style: {
312
- position: "absolute",
313
- left: 0,
314
- bottom: 0,
315
- width: "100%",
316
- height: thickness,
317
- background: color,
318
- opacity,
319
- pointerEvents: "none"
320
- }
321
- }
322
- )
323
- },
324
- i
325
- )) });
326
- }
327
-
328
- // src/preact/components/text-markup/strikeout.tsx
329
- var import_jsx_runtime4 = require("preact/jsx-runtime");
330
- function Strikeout({
331
- color = "#FFFF00",
332
- opacity = 0.5,
333
- rects,
334
- rect,
335
- scale,
336
- onClick,
337
- style,
338
- ...props
339
- }) {
340
- const thickness = 2 * scale;
341
- return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_jsx_runtime4.Fragment, { children: rects.map((r, i) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
342
- "div",
343
- {
344
- onMouseDown: onClick,
345
- style: {
346
- position: "absolute",
347
- left: (rect ? r.origin.x - rect.origin.x : r.origin.x) * scale,
348
- top: (rect ? r.origin.y - rect.origin.y : r.origin.y) * scale,
349
- width: r.size.width * scale,
350
- height: r.size.height * scale,
351
- background: "transparent",
352
- pointerEvents: onClick ? "auto" : "none",
353
- cursor: onClick ? "pointer" : "default",
354
- zIndex: onClick ? 1 : 0,
355
- ...style
356
- },
357
- ...props,
358
- children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
359
- "div",
360
- {
361
- style: {
362
- position: "absolute",
363
- left: 0,
364
- top: "50%",
365
- width: "100%",
366
- height: thickness,
367
- background: color,
368
- opacity,
369
- transform: "translateY(-50%)",
370
- pointerEvents: "none"
371
- }
372
- }
373
- )
374
- },
375
- i
376
- )) });
377
- }
378
-
379
- // src/preact/components/text-markup/squiggly.tsx
380
- var import_jsx_runtime5 = require("preact/jsx-runtime");
381
- function Squiggly({
382
- color = "#FFFF00",
383
- opacity = 0.5,
384
- rects,
385
- rect,
386
- scale,
387
- onClick,
388
- style,
389
- ...props
390
- }) {
391
- const amplitude = 2 * scale;
392
- const period = 6 * scale;
393
- const svg = `<svg xmlns="http://www.w3.org/2000/svg" width="${period}" height="${amplitude * 2}" viewBox="0 0 ${period} ${amplitude * 2}">
394
- <path d="M0 ${amplitude} Q ${period / 4} 0 ${period / 2} ${amplitude} T ${period} ${amplitude}"
395
- fill="none" stroke="${color}" stroke-width="${amplitude}" stroke-linecap="round"/>
396
- </svg>`;
397
- const svgDataUri = `url("data:image/svg+xml;utf8,${encodeURIComponent(svg)}")`;
398
- return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_jsx_runtime5.Fragment, { children: rects.map((r, i) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
399
- "div",
400
- {
401
- onMouseDown: onClick,
402
- style: {
403
- position: "absolute",
404
- left: (rect ? r.origin.x - rect.origin.x : r.origin.x) * scale,
405
- top: (rect ? r.origin.y - rect.origin.y : r.origin.y) * scale,
406
- width: r.size.width * scale,
407
- height: r.size.height * scale,
408
- background: "transparent",
409
- pointerEvents: onClick ? "auto" : "none",
410
- cursor: onClick ? "pointer" : "default",
411
- zIndex: onClick ? 1 : 0,
412
- ...style
413
- },
414
- ...props,
415
- children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
416
- "div",
417
- {
418
- style: {
419
- position: "absolute",
420
- left: 0,
421
- bottom: 0,
422
- width: "100%",
423
- height: amplitude * 2,
424
- backgroundImage: svgDataUri,
425
- backgroundRepeat: "repeat-x",
426
- backgroundSize: `${period}px ${amplitude * 2}px`,
427
- opacity,
428
- pointerEvents: "none"
429
- }
430
- }
431
- )
432
- },
433
- i
434
- )) });
435
- }
436
-
437
- // src/preact/components/annotations/ink.tsx
438
- var import_hooks3 = require("preact/hooks");
439
- var import_jsx_runtime6 = require("preact/jsx-runtime");
440
- function Ink({
441
- color = "#000000",
442
- opacity = 1,
443
- strokeWidth,
444
- inkList,
445
- rect,
446
- scale,
447
- onClick
448
- }) {
449
- const paths = (0, import_hooks3.useMemo)(() => {
450
- return inkList.map(({ points }) => {
451
- let d = "";
452
- points.forEach(({ x, y }, i) => {
453
- const lx = x - rect.origin.x;
454
- const ly = y - rect.origin.y;
455
- d += (i === 0 ? "M" : "L") + lx + " " + ly + " ";
456
- });
457
- return d.trim();
458
- });
459
- }, [inkList, rect]);
460
- const width = rect.size.width * scale;
461
- const height = rect.size.height * scale;
462
- return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
463
- "svg",
464
- {
465
- style: {
466
- position: "absolute",
467
- width,
468
- height,
469
- pointerEvents: "none",
470
- zIndex: 2
471
- },
472
- width,
473
- height,
474
- viewBox: `0 0 ${rect.size.width} ${rect.size.height}`,
475
- children: paths.map((d, i) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
476
- "path",
477
- {
478
- d,
479
- fill: "none",
480
- stroke: color,
481
- strokeWidth,
482
- strokeLinecap: "round",
483
- strokeLinejoin: "round",
484
- opacity,
485
- pointerEvents: "visibleStroke",
486
- onMouseDown: onClick,
487
- style: {
488
- cursor: "pointer"
489
- }
490
- },
491
- i
492
- ))
493
- }
494
- );
495
- }
496
-
497
- // src/preact/components/annotations.tsx
498
- var import_preact3 = require("@embedpdf/plugin-selection/preact");
499
-
500
- // src/shared/resize-ink.ts
501
- var import_models2 = require("@embedpdf/models");
502
- function resizeInkAnnotation(original, newRect, direction, uniform = false) {
503
- if (original.type !== import_models2.PdfAnnotationSubtype.INK) {
504
- throw new Error("resizeInkAnnotation: original is not an ink annotation");
505
- }
506
- const oldRect = original.rect;
507
- let scaleX = newRect.size.width / oldRect.size.width;
508
- let scaleY = newRect.size.height / oldRect.size.height;
509
- const minSize = 10;
510
- if (newRect.size.width < minSize || newRect.size.height < minSize) {
511
- scaleX = Math.max(scaleX, minSize / oldRect.size.width);
512
- scaleY = Math.max(scaleY, minSize / oldRect.size.height);
513
- newRect = {
514
- origin: newRect.origin,
515
- size: {
516
- width: oldRect.size.width * scaleX,
517
- height: oldRect.size.height * scaleY
518
- }
519
- };
520
- }
521
- if (uniform) {
522
- const minScale = Math.min(scaleX, scaleY);
523
- scaleX = minScale;
524
- scaleY = minScale;
525
- newRect.size = {
526
- width: oldRect.size.width * minScale,
527
- height: oldRect.size.height * minScale
528
- };
529
- }
530
- const newInkList = original.inkList.map((stroke) => ({
531
- points: stroke.points.map((p) => ({
532
- x: newRect.origin.x + (p.x - oldRect.origin.x) * scaleX,
533
- y: newRect.origin.y + (p.y - oldRect.origin.y) * scaleY
534
- }))
535
- }));
536
- const avgScale = (scaleX + scaleY) / 2;
537
- const newStrokeWidth = original.strokeWidth * avgScale;
538
- return {
539
- rect: newRect,
540
- inkList: newInkList,
541
- strokeWidth: newStrokeWidth
542
- };
543
- }
544
-
545
- // src/preact/components/annotations.tsx
546
- var import_jsx_runtime7 = require("preact/jsx-runtime");
547
- function Annotations(annotationsProps) {
548
- const { pageIndex, scale } = annotationsProps;
549
- const { provides: annotationProvides } = useAnnotationCapability();
550
- const { provides: selectionProvides } = (0, import_preact3.useSelectionCapability)();
551
- const [annotations, setAnnotations] = (0, import_hooks5.useState)([]);
552
- const { register } = (0, import_preact2.usePointerHandlers)({ pageIndex });
553
- const [selectionState, setSelectionState] = (0, import_hooks5.useState)(null);
554
- (0, import_hooks5.useEffect)(() => {
555
- if (annotationProvides) {
556
- annotationProvides.onStateChange((state) => {
557
- setAnnotations((0, import_plugin_annotation2.getAnnotationsByPageIndex)(state, pageIndex));
558
- setSelectionState((0, import_plugin_annotation2.getSelectedAnnotationByPageIndex)(state, pageIndex));
559
- });
560
- }
561
- }, [annotationProvides]);
562
- const handlers = (0, import_hooks5.useMemo)(
563
- () => ({
564
- onPointerDown: (_, pe) => {
565
- if (pe.target === pe.currentTarget && annotationProvides) {
566
- annotationProvides.deselectAnnotation();
567
- }
568
- }
569
- }),
570
- [annotationProvides]
571
- );
572
- const handleClick = (0, import_hooks5.useCallback)(
573
- (e, annotation) => {
574
- e.stopPropagation();
575
- if (annotationProvides && selectionProvides) {
576
- annotationProvides.selectAnnotation(pageIndex, annotation.localId);
577
- selectionProvides.clear();
578
- }
579
- },
580
- [annotationProvides, selectionProvides, pageIndex]
581
- );
582
- (0, import_hooks5.useEffect)(() => {
583
- return register(handlers);
584
- }, [register, handlers]);
585
- return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_jsx_runtime7.Fragment, { children: annotations.map((annotation) => {
586
- const isSelected = selectionState?.localId === annotation.localId;
587
- switch (annotation.object.type) {
588
- case import_models3.PdfAnnotationSubtype.UNDERLINE:
589
- return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
590
- AnnotationContainer,
591
- {
592
- trackedAnnotation: annotation,
593
- isSelected,
594
- isDraggable: false,
595
- isResizable: false,
596
- style: { mixBlendMode: "multiply" },
597
- ...annotationsProps,
598
- children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
599
- Underline,
600
- {
601
- rect: annotation.object.rect,
602
- color: annotation.object.color,
603
- opacity: annotation.object.opacity,
604
- rects: annotation.object.segmentRects,
605
- scale,
606
- onClick: (e) => handleClick(e, annotation)
607
- }
608
- )
609
- },
610
- annotation.localId
611
- );
612
- case import_models3.PdfAnnotationSubtype.STRIKEOUT:
613
- return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
614
- AnnotationContainer,
615
- {
616
- trackedAnnotation: annotation,
617
- isSelected,
618
- isDraggable: false,
619
- isResizable: false,
620
- style: { mixBlendMode: "multiply" },
621
- ...annotationsProps,
622
- children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
623
- Strikeout,
624
- {
625
- rect: annotation.object.rect,
626
- color: annotation.object.color,
627
- opacity: annotation.object.opacity,
628
- rects: annotation.object.segmentRects,
629
- scale,
630
- onClick: (e) => handleClick(e, annotation)
631
- }
632
- )
633
- },
634
- annotation.localId
635
- );
636
- case import_models3.PdfAnnotationSubtype.SQUIGGLY:
637
- return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
638
- AnnotationContainer,
639
- {
640
- trackedAnnotation: annotation,
641
- isSelected,
642
- isDraggable: false,
643
- isResizable: false,
644
- style: { mixBlendMode: "multiply" },
645
- ...annotationsProps,
646
- children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
647
- Squiggly,
648
- {
649
- color: annotation.object.color,
650
- opacity: annotation.object.opacity,
651
- rects: annotation.object.segmentRects,
652
- rect: annotation.object.rect,
653
- scale,
654
- onClick: (e) => handleClick(e, annotation)
655
- }
656
- )
657
- },
658
- annotation.localId
659
- );
660
- case import_models3.PdfAnnotationSubtype.HIGHLIGHT:
661
- return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
662
- AnnotationContainer,
663
- {
664
- trackedAnnotation: annotation,
665
- isSelected,
666
- isDraggable: false,
667
- isResizable: false,
668
- style: { mixBlendMode: "multiply" },
669
- ...annotationsProps,
670
- children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
671
- Highlight,
672
- {
673
- color: annotation.object.color,
674
- opacity: annotation.object.opacity,
675
- rects: annotation.object.segmentRects,
676
- scale,
677
- rect: annotation.object.rect,
678
- onClick: (e) => handleClick(e, annotation)
679
- }
680
- )
681
- },
682
- annotation.localId
683
- );
684
- case import_models3.PdfAnnotationSubtype.INK:
685
- return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
686
- AnnotationContainer,
687
- {
688
- isSelected,
689
- trackedAnnotation: annotation,
690
- outlineOffset: 6,
691
- computeResizePatch: resizeInkAnnotation,
692
- ...annotationsProps,
693
- children: (obj) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
694
- Ink,
695
- {
696
- color: obj.color,
697
- opacity: obj.opacity,
698
- strokeWidth: obj.strokeWidth,
699
- inkList: obj.inkList,
700
- rect: obj.rect,
701
- scale,
702
- onClick: (e) => handleClick(e, annotation)
703
- }
704
- )
705
- },
706
- annotation.localId
707
- );
708
- default:
709
- return null;
710
- }
711
- }) });
712
- }
713
-
714
- // src/preact/components/text-markup.tsx
715
- var import_models4 = require("@embedpdf/models");
716
- var import_preact4 = require("@embedpdf/plugin-selection/preact");
717
- var import_hooks6 = require("preact/hooks");
718
- var import_jsx_runtime8 = require("preact/jsx-runtime");
719
- function TextMarkup({ pageIndex, scale }) {
720
- const { provides: selectionProvides } = (0, import_preact4.useSelectionCapability)();
721
- const { provides: annotationProvides } = useAnnotationCapability();
722
- const [rects, setRects] = (0, import_hooks6.useState)([]);
723
- const [boundingRect, setBoundingRect] = (0, import_hooks6.useState)(null);
724
- const [activeTool, setActiveTool] = (0, import_hooks6.useState)({ mode: null, defaults: null });
725
- (0, import_hooks6.useEffect)(() => {
726
- if (!selectionProvides) return;
727
- const off = selectionProvides.onSelectionChange(() => {
728
- setRects(selectionProvides.getHighlightRectsForPage(pageIndex));
729
- setBoundingRect(selectionProvides.getBoundingRectForPage(pageIndex));
730
- });
731
- return off;
732
- }, [selectionProvides, pageIndex]);
733
- (0, import_hooks6.useEffect)(() => {
734
- if (!annotationProvides) return;
735
- const off = annotationProvides.onActiveToolChange(setActiveTool);
736
- return off;
737
- }, [annotationProvides]);
738
- if (!boundingRect) return null;
739
- switch (activeTool.mode) {
740
- case import_models4.PdfAnnotationSubtype.UNDERLINE:
741
- return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
742
- "div",
743
- {
744
- style: {
745
- mixBlendMode: "multiply",
746
- pointerEvents: "none",
747
- position: "absolute",
748
- inset: 0
749
- },
750
- children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
751
- Underline,
752
- {
753
- color: activeTool.defaults?.color,
754
- opacity: activeTool.defaults?.opacity,
755
- rects,
756
- scale
757
- }
758
- )
759
- }
760
- );
761
- case import_models4.PdfAnnotationSubtype.HIGHLIGHT:
762
- return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
763
- "div",
764
- {
765
- style: {
766
- mixBlendMode: "multiply",
767
- pointerEvents: "none",
768
- position: "absolute",
769
- inset: 0
770
- },
771
- children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
772
- Highlight,
773
- {
774
- color: activeTool.defaults?.color,
775
- opacity: activeTool.defaults?.opacity,
776
- rects,
777
- scale
778
- }
779
- )
780
- }
781
- );
782
- case import_models4.PdfAnnotationSubtype.STRIKEOUT:
783
- return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
784
- "div",
785
- {
786
- style: {
787
- mixBlendMode: "multiply",
788
- pointerEvents: "none",
789
- position: "absolute",
790
- inset: 0
791
- },
792
- children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
793
- Strikeout,
794
- {
795
- color: activeTool.defaults?.color,
796
- opacity: activeTool.defaults?.opacity,
797
- rects,
798
- scale
799
- }
800
- )
801
- }
802
- );
803
- case import_models4.PdfAnnotationSubtype.SQUIGGLY:
804
- return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
805
- "div",
806
- {
807
- style: {
808
- mixBlendMode: "multiply",
809
- pointerEvents: "none",
810
- position: "absolute",
811
- inset: 0
812
- },
813
- children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
814
- Squiggly,
815
- {
816
- color: activeTool.defaults?.color,
817
- opacity: activeTool.defaults?.opacity,
818
- rects,
819
- scale
820
- }
821
- )
822
- }
823
- );
824
- default:
825
- return null;
826
- }
827
- }
828
-
829
- // src/preact/components/annotations/ink-paint.tsx
830
- var import_hooks8 = require("preact/hooks");
831
- var import_preact5 = require("@embedpdf/plugin-interaction-manager/preact");
832
- var import_models5 = require("@embedpdf/models");
833
- var import_jsx_runtime9 = require("preact/jsx-runtime");
834
- var MAX_STROKE_WIDTH = 30;
835
- var InkPaint = ({ pageIndex, scale, pageWidth, pageHeight }) => {
836
- const { provides: annotationProvides } = useAnnotationCapability();
837
- const [activeTool, setActiveTool] = (0, import_hooks8.useState)({ mode: null, defaults: null });
838
- (0, import_hooks8.useEffect)(() => {
839
- if (!annotationProvides) return;
840
- const off = annotationProvides.onActiveToolChange(setActiveTool);
841
- return off;
842
- }, [annotationProvides]);
843
- if (activeTool.mode !== import_models5.PdfAnnotationSubtype.INK) return null;
844
- const toolColor = activeTool.defaults?.color ?? "#000000";
845
- const toolOpacity = activeTool.defaults?.opacity ?? 1;
846
- const toolStrokeWidth = activeTool.defaults?.strokeWidth ?? 2;
847
- const { register } = (0, import_preact5.usePointerHandlers)({ modeId: "ink", pageIndex });
848
- const clamp = (v, min, max) => Math.max(min, Math.min(max, v));
849
- const [currentStrokes, setCurrentStrokes] = (0, import_hooks8.useState)([]);
850
- const [isDrawing, setIsDrawing] = (0, import_hooks8.useState)(false);
851
- const timerRef = (0, import_hooks8.useRef)(null);
852
- const pageWidthPDF = pageWidth / scale;
853
- const pageHeightPDF = pageHeight / scale;
854
- const handlers = (0, import_hooks8.useMemo)(
855
- () => ({
856
- onPointerDown: (pos, evt) => {
857
- const curX = clamp(pos.x, 0, pageWidthPDF);
858
- const curY = clamp(pos.y, 0, pageHeightPDF);
859
- setIsDrawing(true);
860
- if (timerRef.current) {
861
- clearTimeout(timerRef.current);
862
- timerRef.current = null;
863
- setCurrentStrokes((prev) => [...prev, { points: [{ x: curX, y: curY }] }]);
864
- } else {
865
- setCurrentStrokes([{ points: [{ x: curX, y: curY }] }]);
866
- }
867
- evt.target?.setPointerCapture?.(evt.pointerId);
868
- },
869
- onPointerMove: (pos) => {
870
- if (!isDrawing) return;
871
- const curX = clamp(pos.x, 0, pageWidthPDF);
872
- const curY = clamp(pos.y, 0, pageHeightPDF);
873
- setCurrentStrokes((prev) => {
874
- if (!prev.length) return prev;
875
- const last = prev[prev.length - 1];
876
- const newLast = { points: [...last.points, { x: curX, y: curY }] };
877
- return [...prev.slice(0, -1), newLast];
878
- });
879
- },
880
- onPointerUp: (_, evt) => {
881
- setIsDrawing(false);
882
- evt.target?.releasePointerCapture?.(evt.pointerId);
883
- if (timerRef.current) clearTimeout(timerRef.current);
884
- timerRef.current = setTimeout(() => {
885
- if (currentStrokes.length && annotationProvides) {
886
- const allPoints2 = currentStrokes.flatMap((s) => s.points);
887
- if (!allPoints2.length) return;
888
- const minX2 = Math.min(...allPoints2.map((p) => p.x));
889
- const minY2 = Math.min(...allPoints2.map((p) => p.y));
890
- const maxX2 = Math.max(...allPoints2.map((p) => p.x));
891
- const maxY2 = Math.max(...allPoints2.map((p) => p.y));
892
- const halfStroke2 = MAX_STROKE_WIDTH / 2;
893
- const rectMinX = minX2 - halfStroke2;
894
- const rectMinY = minY2 - halfStroke2;
895
- const rectMaxX = maxX2 + halfStroke2;
896
- const rectMaxY = maxY2 + halfStroke2;
897
- if (rectMaxX - rectMinX < 1 || rectMaxY - rectMinY < 1) return;
898
- const rect = {
899
- origin: { x: rectMinX, y: rectMinY },
900
- size: { width: rectMaxX - rectMinX, height: rectMaxY - rectMinY }
901
- };
902
- const anno = {
903
- type: import_models5.PdfAnnotationSubtype.INK,
904
- rect,
905
- inkList: currentStrokes,
906
- color: toolColor,
907
- opacity: toolOpacity,
908
- strokeWidth: toolStrokeWidth,
909
- pageIndex,
910
- id: Date.now() + Math.random()
911
- };
912
- annotationProvides.createAnnotation(pageIndex, anno);
913
- annotationProvides.setAnnotationMode(null);
914
- annotationProvides.selectAnnotation(pageIndex, anno.id);
915
- }
916
- setCurrentStrokes([]);
917
- timerRef.current = null;
918
- }, 3e3);
919
- },
920
- onPointerCancel: (_, evt) => {
921
- setIsDrawing(false);
922
- evt.target?.releasePointerCapture?.(evt.pointerId);
923
- setCurrentStrokes([]);
924
- if (timerRef.current) {
925
- clearTimeout(timerRef.current);
926
- timerRef.current = null;
927
- }
928
- }
929
- }),
930
- [
931
- pageWidthPDF,
932
- pageHeightPDF,
933
- currentStrokes,
934
- annotationProvides,
935
- pageIndex,
936
- toolColor,
937
- toolOpacity,
938
- toolStrokeWidth,
939
- isDrawing
940
- ]
941
- );
942
- (0, import_hooks8.useEffect)(() => {
943
- if (!register) return;
944
- return register(handlers);
945
- }, [register, handlers]);
946
- (0, import_hooks8.useEffect)(() => {
947
- return () => {
948
- if (timerRef.current) clearTimeout(timerRef.current);
949
- };
950
- }, []);
951
- if (!currentStrokes.length) return null;
952
- const allPoints = currentStrokes.flatMap((s) => s.points);
953
- if (!allPoints.length) return null;
954
- const minX = Math.min(...allPoints.map((p) => p.x));
955
- const minY = Math.min(...allPoints.map((p) => p.y));
956
- const maxX = Math.max(...allPoints.map((p) => p.x));
957
- const maxY = Math.max(...allPoints.map((p) => p.y));
958
- const halfStroke = MAX_STROKE_WIDTH / 2;
959
- const svgMinX = minX - halfStroke;
960
- const svgMinY = minY - halfStroke;
961
- const svgMaxX = maxX + halfStroke;
962
- const svgMaxY = maxY + halfStroke;
963
- const dw = svgMaxX - svgMinX;
964
- const dh = svgMaxY - svgMinY;
965
- const paths = currentStrokes.map(({ points }) => {
966
- let d = "";
967
- points.forEach(({ x, y }, i) => {
968
- const lx = x - svgMinX;
969
- const ly = y - svgMinY;
970
- d += (i === 0 ? "M" : "L") + lx + " " + ly + " ";
971
- });
972
- return d.trim();
973
- });
974
- return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
975
- "svg",
976
- {
977
- style: {
978
- position: "absolute",
979
- left: svgMinX * scale,
980
- top: svgMinY * scale,
981
- width: dw * scale,
982
- height: dh * scale,
983
- pointerEvents: "none",
984
- zIndex: 2
985
- },
986
- width: dw * scale,
987
- height: dh * scale,
988
- viewBox: `0 0 ${dw} ${dh}`,
989
- children: paths.map((d, i) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
990
- "path",
991
- {
992
- d,
993
- fill: "none",
994
- stroke: toolColor,
995
- strokeWidth: toolStrokeWidth,
996
- strokeLinecap: "round",
997
- strokeLinejoin: "round",
998
- opacity: toolOpacity
999
- },
1000
- i
1001
- ))
1002
- }
1003
- );
1004
- };
1005
-
1006
- // src/preact/components/annotation-layer.tsx
1007
- var import_jsx_runtime10 = require("preact/jsx-runtime");
1008
- function AnnotationLayer({
1009
- pageIndex,
1010
- scale,
1011
- pageWidth,
1012
- pageHeight,
1013
- rotation,
1014
- style,
1015
- ...props
1016
- }) {
1017
- return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
1018
- "div",
1019
- {
1020
- style: {
1021
- ...style
1022
- },
1023
- ...props,
1024
- children: [
1025
- /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(Annotations, { pageIndex, scale, rotation }),
1026
- /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(TextMarkup, { pageIndex, scale }),
1027
- /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(InkPaint, { pageIndex, scale, pageWidth, pageHeight })
1028
- ]
1029
- }
1030
- );
1031
- }
1032
- // Annotate the CommonJS export names for ESM import in node:
1033
- 0 && (module.exports = {
1034
- AnnotationLayer,
1035
- useAnnotationCapability,
1036
- useAnnotationPlugin
1037
- });
1038
- //# sourceMappingURL=index.cjs.map
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("@embedpdf/core/preact"),t=require("@embedpdf/plugin-annotation"),n=require("preact/jsx-runtime"),o=require("@embedpdf/models"),i=require("@embedpdf/plugin-interaction-manager/preact");require("preact");const r=require("preact/hooks"),s=require("@embedpdf/plugin-selection/preact"),l=()=>e.useCapability(t.AnnotationPlugin.id);function a({scale:e,pageIndex:t,rotation:i,trackedAnnotation:s,children:a,style:c,outlineOffset:d=1,isSelected:u=!1,isDraggable:p=!0,isResizable:h=!0,computeResizePatch:g,...f}){const{provides:x}=l(),y=r.useRef(null),[b,m]=r.useState("idle"),[v,j]=r.useState(null),[M,w]=r.useState(null),[k,z]=r.useState(null),[I,P]=r.useState(s.object.rect),[S,C]=r.useState(null);r.useEffect((()=>{P(s.object.rect),C(null)}),[s]);const A=S?{...s.object,...S}:s.object;return n.jsxs("div",{ref:y,onPointerDown:e=>{var t;if(!u)return;e.stopPropagation(),e.preventDefault();const n=e.target;if(h&&n.classList.contains("resize-handle"))m("resizing"),j(n.dataset.direction);else{if(!p)return;m("dragging")}w({x:e.clientX,y:e.clientY}),z(I),null==(t=y.current)||t.setPointerCapture(e.pointerId)},onPointerMove:t=>{if("idle"===b||!M||!k)return;const n={x:t.clientX-M.x,y:t.clientY-M.y},{x:r,y:l}=o.restoreOffset(n,i,e);let a=k.origin.x,c=k.origin.y,d=k.size.width,u=k.size.height;if("dragging"===b)a+=r,c+=l;else if("resizing"===b&&v&&(v.includes("right")?d+=r:v.includes("left")&&(a+=r,d-=r),v.includes("bottom")?u+=l:v.includes("top")&&(c+=l,u-=l),d<1||u<1))return;const p={origin:{x:a,y:c},size:{width:d,height:u}};let h={rect:p};if(g){const e="resizing"===b?v:"bottom-right";e&&(h=g(s.object,p,e))}P(h.rect||p),C(h)},onPointerUp:e=>{var n;if("idle"===b)return;const o=v||"bottom-right";if(m("idle"),j(null),null==(n=y.current)||n.releasePointerCapture(e.pointerId),x&&s){let e={rect:I};g&&o&&(e=g(s.object,I,o)),x.updateAnnotation(t,s.localId,e)}w(null),z(null),C(null)},style:{position:"absolute",outline:u?"1px solid #007ACC":"none",outlineOffset:u?`${d}px`:"0px",left:I.origin.x*e+"px",top:I.origin.y*e+"px",width:I.size.width*e+"px",height:I.size.height*e+"px",pointerEvents:u?"auto":"none",cursor:u&&p?"move":"default",...c},...f,children:["function"==typeof a?a(A):a,u&&h&&n.jsxs(n.Fragment,{children:[n.jsx("div",{className:"resize-handle","data-direction":"top-left",style:{position:"absolute",top:-7-d,left:-7-d,width:13,height:13,background:"blue",borderRadius:"50%",cursor:i%2?"nesw-resize":"nwse-resize"}}),n.jsx("div",{className:"resize-handle","data-direction":"top-right",style:{position:"absolute",top:-7-d,right:-7-d,width:13,height:13,background:"blue",borderRadius:"50%",cursor:i%2?"nwse-resize":"nesw-resize"}}),n.jsx("div",{className:"resize-handle","data-direction":"bottom-left",style:{position:"absolute",bottom:-7-d,left:-7-d,width:13,height:13,background:"blue",borderRadius:"50%",cursor:i%2?"nwse-resize":"nesw-resize"}}),n.jsx("div",{className:"resize-handle","data-direction":"bottom-right",style:{position:"absolute",bottom:-7-d,right:-7-d,width:13,height:13,background:"blue",borderRadius:"50%",cursor:i%2?"nesw-resize":"nwse-resize"}})]})]})}function c({color:e="#FFFF00",opacity:t=.5,rects:o,rect:i,scale:r,onClick:s,style:l,...a}){return n.jsx(n.Fragment,{children:o.map(((o,c)=>n.jsx("div",{onMouseDown:s,style:{position:"absolute",left:(i?o.origin.x-i.origin.x:o.origin.x)*r,top:(i?o.origin.y-i.origin.y:o.origin.y)*r,width:o.size.width*r,height:o.size.height*r,background:e,opacity:t,pointerEvents:s?"auto":"none",cursor:s?"pointer":"default",zIndex:s?1:void 0,...l},...a},c)))})}function d({color:e="#FFFF00",opacity:t=.5,rects:o,rect:i,scale:r,onClick:s,style:l,...a}){const c=2*r;return n.jsx(n.Fragment,{children:o.map(((o,d)=>n.jsx("div",{onMouseDown:s,style:{position:"absolute",left:(i?o.origin.x-i.origin.x:o.origin.x)*r,top:(i?o.origin.y-i.origin.y:o.origin.y)*r,width:o.size.width*r,height:o.size.height*r,background:"transparent",pointerEvents:s?"auto":"none",cursor:s?"pointer":"default",zIndex:s?1:0,...l},...a,children:n.jsx("div",{style:{position:"absolute",left:0,bottom:0,width:"100%",height:c,background:e,opacity:t,pointerEvents:"none"}})},d)))})}function u({color:e="#FFFF00",opacity:t=.5,rects:o,rect:i,scale:r,onClick:s,style:l,...a}){const c=2*r;return n.jsx(n.Fragment,{children:o.map(((o,d)=>n.jsx("div",{onMouseDown:s,style:{position:"absolute",left:(i?o.origin.x-i.origin.x:o.origin.x)*r,top:(i?o.origin.y-i.origin.y:o.origin.y)*r,width:o.size.width*r,height:o.size.height*r,background:"transparent",pointerEvents:s?"auto":"none",cursor:s?"pointer":"default",zIndex:s?1:0,...l},...a,children:n.jsx("div",{style:{position:"absolute",left:0,top:"50%",width:"100%",height:c,background:e,opacity:t,transform:"translateY(-50%)",pointerEvents:"none"}})},d)))})}function p({color:e="#FFFF00",opacity:t=.5,rects:o,rect:i,scale:r,onClick:s,style:l,...a}){const c=2*r,d=6*r,u=`url("data:image/svg+xml;utf8,${encodeURIComponent(`<svg xmlns="http://www.w3.org/2000/svg" width="${d}" height="${2*c}" viewBox="0 0 ${d} ${2*c}">\n <path d="M0 ${c} Q ${d/4} 0 ${d/2} ${c} T ${d} ${c}"\n fill="none" stroke="${e}" stroke-width="${c}" stroke-linecap="round"/>\n </svg>`)}")`;return n.jsx(n.Fragment,{children:o.map(((e,o)=>n.jsx("div",{onMouseDown:s,style:{position:"absolute",left:(i?e.origin.x-i.origin.x:e.origin.x)*r,top:(i?e.origin.y-i.origin.y:e.origin.y)*r,width:e.size.width*r,height:e.size.height*r,background:"transparent",pointerEvents:s?"auto":"none",cursor:s?"pointer":"default",zIndex:s?1:0,...l},...a,children:n.jsx("div",{style:{position:"absolute",left:0,bottom:0,width:"100%",height:2*c,backgroundImage:u,backgroundRepeat:"repeat-x",backgroundSize:`${d}px ${2*c}px`,opacity:t,pointerEvents:"none"}})},o)))})}function h({color:e="#000000",opacity:t=1,strokeWidth:o,inkList:i,rect:s,scale:l,onClick:a}){const c=r.useMemo((()=>i.map((({points:e})=>{let t="";return e.forEach((({x:e,y:n},o)=>{const i=e-s.origin.x,r=n-s.origin.y;t+=(0===o?"M":"L")+i+" "+r+" "})),t.trim()}))),[i,s]),d=s.size.width*l,u=s.size.height*l;return n.jsx("svg",{style:{position:"absolute",width:d,height:u,pointerEvents:"none",zIndex:2},width:d,height:u,viewBox:`0 0 ${s.size.width} ${s.size.height}`,children:c.map(((i,r)=>n.jsx("path",{d:i,fill:"none",stroke:e,strokeWidth:o,strokeLinecap:"round",strokeLinejoin:"round",opacity:t,pointerEvents:"visibleStroke",onMouseDown:a,style:{cursor:"pointer"}},r)))})}function g(e,t,n,i=!1){if(e.type!==o.PdfAnnotationSubtype.INK)throw new Error("resizeInkAnnotation: original is not an ink annotation");const r=e.rect;let s=t.size.width/r.size.width,l=t.size.height/r.size.height;if((t.size.width<10||t.size.height<10)&&(s=Math.max(s,10/r.size.width),l=Math.max(l,10/r.size.height),t={origin:t.origin,size:{width:r.size.width*s,height:r.size.height*l}}),i){const e=Math.min(s,l);s=e,l=e,t.size={width:r.size.width*e,height:r.size.height*e}}const a=e.inkList.map((e=>({points:e.points.map((e=>({x:t.origin.x+(e.x-r.origin.x)*s,y:t.origin.y+(e.y-r.origin.y)*l})))}))),c=(s+l)/2,d=e.strokeWidth*c;return{rect:t,inkList:a,strokeWidth:d}}function f(e){const{pageIndex:f,scale:x}=e,{provides:y}=l(),{provides:b}=s.useSelectionCapability(),[m,v]=r.useState([]),{register:j}=i.usePointerHandlers({pageIndex:f}),[M,w]=r.useState(null);r.useEffect((()=>{y&&y.onStateChange((e=>{v(t.getAnnotationsByPageIndex(e,f)),w(t.getSelectedAnnotationByPageIndex(e,f))}))}),[y]);const k=r.useMemo((()=>({onPointerDown:(e,t)=>{t.target===t.currentTarget&&y&&y.deselectAnnotation()}})),[y]),z=r.useCallback(((e,t)=>{e.stopPropagation(),y&&b&&(y.selectAnnotation(f,t.localId),b.clear())}),[y,b,f]);return r.useEffect((()=>j(k)),[j,k]),n.jsx(n.Fragment,{children:m.map((t=>{const i=(null==M?void 0:M.localId)===t.localId;switch(t.object.type){case o.PdfAnnotationSubtype.UNDERLINE:return n.jsx(a,{trackedAnnotation:t,isSelected:i,isDraggable:!1,isResizable:!1,style:{mixBlendMode:o.blendModeToCss(t.object.blendMode??o.PdfBlendMode.Normal)},...e,children:n.jsx(d,{rect:t.object.rect,color:t.object.color,opacity:t.object.opacity,rects:t.object.segmentRects,scale:x,onClick:e=>z(e,t)})},t.localId);case o.PdfAnnotationSubtype.STRIKEOUT:return n.jsx(a,{trackedAnnotation:t,isSelected:i,isDraggable:!1,isResizable:!1,style:{mixBlendMode:o.blendModeToCss(t.object.blendMode??o.PdfBlendMode.Normal)},...e,children:n.jsx(u,{rect:t.object.rect,color:t.object.color,opacity:t.object.opacity,rects:t.object.segmentRects,scale:x,onClick:e=>z(e,t)})},t.localId);case o.PdfAnnotationSubtype.SQUIGGLY:return n.jsx(a,{trackedAnnotation:t,isSelected:i,isDraggable:!1,isResizable:!1,style:{mixBlendMode:o.blendModeToCss(t.object.blendMode??o.PdfBlendMode.Normal)},...e,children:n.jsx(p,{color:t.object.color,opacity:t.object.opacity,rects:t.object.segmentRects,rect:t.object.rect,scale:x,onClick:e=>z(e,t)})},t.localId);case o.PdfAnnotationSubtype.HIGHLIGHT:return n.jsx(a,{trackedAnnotation:t,isSelected:i,isDraggable:!1,isResizable:!1,style:{mixBlendMode:o.blendModeToCss(t.object.blendMode??o.PdfBlendMode.Multiply)},...e,children:n.jsx(c,{color:t.object.color,opacity:t.object.opacity,rects:t.object.segmentRects,scale:x,rect:t.object.rect,onClick:e=>z(e,t)})},t.localId);case o.PdfAnnotationSubtype.INK:return n.jsx(a,{isSelected:i,trackedAnnotation:t,outlineOffset:6,computeResizePatch:g,style:{mixBlendMode:o.blendModeToCss(t.object.blendMode??o.PdfBlendMode.Normal)},...e,children:e=>n.jsx(h,{color:e.color,opacity:e.opacity,strokeWidth:e.strokeWidth,inkList:e.inkList,rect:e.rect,scale:x,onClick:e=>z(e,t)})},t.localId);default:return null}}))})}function x({pageIndex:e,scale:i}){var a,h,g,f,x,y,b,m,v,j,M,w;const{provides:k}=s.useSelectionCapability(),{provides:z}=l(),[I,P]=r.useState([]),[S,C]=r.useState(null),[A,E]=r.useState({variantKey:null,defaults:null});if(r.useEffect((()=>{if(!k)return;return k.onSelectionChange((()=>{P(k.getHighlightRectsForPage(e)),C(k.getBoundingRectForPage(e))}))}),[k,e]),r.useEffect((()=>{if(!z)return;return z.onActiveToolChange(E)}),[z]),!S)return null;switch(A.variantKey){case t.makeVariantKey(o.PdfAnnotationSubtype.UNDERLINE):return n.jsx("div",{style:{mixBlendMode:o.blendModeToCss((null==(a=A.defaults)?void 0:a.blendMode)??o.PdfBlendMode.Normal),pointerEvents:"none",position:"absolute",inset:0},children:n.jsx(d,{color:null==(h=A.defaults)?void 0:h.color,opacity:null==(g=A.defaults)?void 0:g.opacity,rects:I,scale:i})});case t.makeVariantKey(o.PdfAnnotationSubtype.HIGHLIGHT):return n.jsx("div",{style:{mixBlendMode:o.blendModeToCss((null==(f=A.defaults)?void 0:f.blendMode)??o.PdfBlendMode.Multiply),pointerEvents:"none",position:"absolute",inset:0},children:n.jsx(c,{color:null==(x=A.defaults)?void 0:x.color,opacity:null==(y=A.defaults)?void 0:y.opacity,rects:I,scale:i})});case t.makeVariantKey(o.PdfAnnotationSubtype.STRIKEOUT):return n.jsx("div",{style:{mixBlendMode:o.blendModeToCss((null==(b=A.defaults)?void 0:b.blendMode)??o.PdfBlendMode.Normal),pointerEvents:"none",position:"absolute",inset:0},children:n.jsx(u,{color:null==(m=A.defaults)?void 0:m.color,opacity:null==(v=A.defaults)?void 0:v.opacity,rects:I,scale:i})});case t.makeVariantKey(o.PdfAnnotationSubtype.SQUIGGLY):return n.jsx("div",{style:{mixBlendMode:o.blendModeToCss((null==(j=A.defaults)?void 0:j.blendMode)??o.PdfBlendMode.Normal),pointerEvents:"none",position:"absolute",inset:0},children:n.jsx(p,{color:null==(M=A.defaults)?void 0:M.color,opacity:null==(w=A.defaults)?void 0:w.opacity,rects:I,scale:i})});default:return null}}const y=({pageIndex:e,scale:t,pageWidth:s,pageHeight:a})=>{var c,d,u;const{provides:p}=l(),[h,g]=r.useState({variantKey:null,defaults:null});if(r.useEffect((()=>{if(!p)return;return p.onActiveToolChange(g)}),[p]),!h.defaults)return null;if(h.defaults.subtype!==o.PdfAnnotationSubtype.INK)return null;const f=(null==(c=h.defaults)?void 0:c.color)??"#000000",x=(null==(d=h.defaults)?void 0:d.opacity)??1,y=(null==(u=h.defaults)?void 0:u.strokeWidth)??2,{register:b}=i.usePointerHandlers({modeId:"ink",pageIndex:e}),m=(e,t,n)=>Math.max(t,Math.min(n,e)),[v,j]=r.useState([]),[M,w]=r.useState(!1),k=r.useRef(null),z=s/t,I=a/t,P=r.useMemo((()=>({onPointerDown:(e,t)=>{var n,o;const i=m(e.x,0,z),r=m(e.y,0,I);w(!0),k.current?(clearTimeout(k.current),k.current=null,j((e=>[...e,{points:[{x:i,y:r}]}]))):j([{points:[{x:i,y:r}]}]),null==(o=null==(n=t.target)?void 0:n.setPointerCapture)||o.call(n,t.pointerId)},onPointerMove:e=>{if(!M)return;const t=m(e.x,0,z),n=m(e.y,0,I);j((e=>{if(!e.length)return e;const o={points:[...e[e.length-1].points,{x:t,y:n}]};return[...e.slice(0,-1),o]}))},onPointerUp:(t,n)=>{var i,r;w(!1),null==(r=null==(i=n.target)?void 0:i.releasePointerCapture)||r.call(i,n.pointerId),k.current&&clearTimeout(k.current),k.current=setTimeout((()=>{if(v.length&&p){const t=v.flatMap((e=>e.points));if(!t.length)return;const n=15,i=Math.min(...t.map((e=>e.x)))-n,r=Math.min(...t.map((e=>e.y)))-n,s=Math.max(...t.map((e=>e.x)))+n,l=Math.max(...t.map((e=>e.y)))+n;if(s-i<1||l-r<1)return;const a={origin:{x:i,y:r},size:{width:s-i,height:l-r}},c={type:o.PdfAnnotationSubtype.INK,rect:a,inkList:v,color:f,opacity:x,strokeWidth:y,pageIndex:e,id:Date.now()+Math.random()};p.createAnnotation(e,c),p.setActiveVariant(null),p.selectAnnotation(e,c.id)}j([]),k.current=null}),3e3)},onPointerCancel:(e,t)=>{var n,o;w(!1),null==(o=null==(n=t.target)?void 0:n.releasePointerCapture)||o.call(n,t.pointerId),j([]),k.current&&(clearTimeout(k.current),k.current=null)}})),[z,I,v,p,e,f,x,y,M]);if(r.useEffect((()=>{if(b)return b(P)}),[b,P]),r.useEffect((()=>()=>{k.current&&clearTimeout(k.current)}),[]),!v.length)return null;const S=v.flatMap((e=>e.points));if(!S.length)return null;const C=Math.min(...S.map((e=>e.x))),A=Math.min(...S.map((e=>e.y))),E=Math.max(...S.map((e=>e.x))),R=Math.max(...S.map((e=>e.y))),T=C-15,B=A-15,F=E+15-T,L=R+15-B,$=v.map((({points:e})=>{let t="";return e.forEach((({x:e,y:n},o)=>{t+=(0===o?"M":"L")+(e-T)+" "+(n-B)+" "})),t.trim()}));return n.jsx("svg",{style:{position:"absolute",left:T*t,top:B*t,width:F*t,height:L*t,pointerEvents:"none",zIndex:2},width:F*t,height:L*t,viewBox:`0 0 ${F} ${L}`,children:$.map(((e,t)=>n.jsx("path",{d:e,fill:"none",stroke:f,strokeWidth:y,strokeLinecap:"round",strokeLinejoin:"round",opacity:x},t)))})};exports.AnnotationLayer=function({pageIndex:e,scale:t,pageWidth:o,pageHeight:i,rotation:r,style:s,...l}){return n.jsxs("div",{style:{...s},...l,children:[n.jsx(f,{pageIndex:e,scale:t,rotation:r}),n.jsx(x,{pageIndex:e,scale:t}),n.jsx(y,{pageIndex:e,scale:t,pageWidth:o,pageHeight:i})]})},exports.useAnnotationCapability=l,exports.useAnnotationPlugin=()=>e.usePlugin(t.AnnotationPlugin.id);
2
+ //# sourceMappingURL=index.cjs.map