@embedpdf/utils 1.5.0 → 2.0.0-next.0

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 (43) hide show
  1. package/dist/index.cjs.map +1 -1
  2. package/dist/index.js.map +1 -1
  3. package/dist/lib/index.d.ts +1 -0
  4. package/dist/lib/selection-menu.d.ts +14 -0
  5. package/dist/preact/index.cjs +1 -1
  6. package/dist/preact/index.cjs.map +1 -1
  7. package/dist/preact/index.js.map +1 -1
  8. package/dist/react/index.cjs +1 -1
  9. package/dist/react/index.cjs.map +1 -1
  10. package/dist/react/index.js.map +1 -1
  11. package/dist/shared/index.d.ts +1 -0
  12. package/dist/shared/types.d.ts +25 -0
  13. package/dist/shared-preact/index.d.ts +1 -0
  14. package/dist/shared-preact/types.d.ts +25 -0
  15. package/dist/shared-react/index.d.ts +1 -0
  16. package/dist/shared-react/types.d.ts +25 -0
  17. package/dist/shared-svelte/plugin-interaction-primitives/drag-resize-controller.d.ts +68 -0
  18. package/dist/shared-svelte/plugin-interaction-primitives/index.d.ts +2 -0
  19. package/dist/shared-svelte/plugin-interaction-primitives/utils.d.ts +22 -0
  20. package/dist/svelte/actions/doublePress.d.ts +9 -0
  21. package/dist/svelte/actions/index.d.ts +1 -0
  22. package/dist/svelte/components/CounterRotateContainer.svelte.d.ts +18 -0
  23. package/dist/svelte/components/index.d.ts +2 -0
  24. package/dist/svelte/components/types.d.ts +4 -0
  25. package/dist/svelte/hooks/index.d.ts +2 -0
  26. package/dist/svelte/hooks/use-drag-resize.svelte.d.ts +26 -0
  27. package/dist/svelte/hooks/use-interaction-handles.svelte.d.ts +32 -0
  28. package/dist/svelte/index.cjs +2 -0
  29. package/dist/svelte/index.cjs.map +1 -0
  30. package/dist/svelte/index.d.ts +5 -0
  31. package/dist/svelte/index.js +757 -0
  32. package/dist/svelte/index.js.map +1 -0
  33. package/dist/svelte/types.d.ts +33 -0
  34. package/dist/svelte/utils/deep-to-raw.d.ts +9 -0
  35. package/dist/svelte/utils/index.d.ts +2 -0
  36. package/dist/svelte/utils/styles-to-string.d.ts +29 -0
  37. package/dist/vue/components/counter-rotate-container.vue.d.ts +3 -2
  38. package/dist/vue/index.cjs +1 -1
  39. package/dist/vue/index.cjs.map +1 -1
  40. package/dist/vue/index.d.ts +1 -0
  41. package/dist/vue/index.js.map +1 -1
  42. package/dist/vue/types.d.ts +25 -0
  43. package/package.json +13 -5
@@ -0,0 +1,757 @@
1
+ import * as $ from "svelte/internal/client";
2
+ import "svelte/internal/disclose-version";
3
+ import { getCounterRotation } from "@embedpdf/utils";
4
+ class DragResizeController {
5
+ constructor(config, onUpdate) {
6
+ this.config = config;
7
+ this.onUpdate = onUpdate;
8
+ this.state = "idle";
9
+ this.startPoint = null;
10
+ this.startElement = null;
11
+ this.activeHandle = null;
12
+ this.currentPosition = null;
13
+ this.activeVertexIndex = null;
14
+ this.startVertices = [];
15
+ this.currentVertices = [];
16
+ this.currentVertices = config.vertices || [];
17
+ }
18
+ updateConfig(config) {
19
+ this.config = { ...this.config, ...config };
20
+ this.currentVertices = config.vertices || [];
21
+ }
22
+ startDrag(clientX, clientY) {
23
+ this.state = "dragging";
24
+ this.startPoint = { x: clientX, y: clientY };
25
+ this.startElement = { ...this.config.element };
26
+ this.currentPosition = { ...this.config.element };
27
+ this.onUpdate({
28
+ state: "start",
29
+ transformData: {
30
+ type: "move",
31
+ changes: {
32
+ rect: this.startElement
33
+ }
34
+ }
35
+ });
36
+ }
37
+ startResize(handle, clientX, clientY) {
38
+ this.state = "resizing";
39
+ this.activeHandle = handle;
40
+ this.startPoint = { x: clientX, y: clientY };
41
+ this.startElement = { ...this.config.element };
42
+ this.currentPosition = { ...this.config.element };
43
+ this.onUpdate({
44
+ state: "start",
45
+ transformData: {
46
+ type: "resize",
47
+ changes: {
48
+ rect: this.startElement
49
+ },
50
+ metadata: {
51
+ handle: this.activeHandle,
52
+ maintainAspectRatio: this.config.maintainAspectRatio
53
+ }
54
+ }
55
+ });
56
+ }
57
+ startVertexEdit(vertexIndex, clientX, clientY) {
58
+ this.currentVertices = [...this.config.vertices ?? this.currentVertices];
59
+ if (vertexIndex < 0 || vertexIndex >= this.currentVertices.length) return;
60
+ this.state = "vertex-editing";
61
+ this.activeVertexIndex = vertexIndex;
62
+ this.startPoint = { x: clientX, y: clientY };
63
+ this.startVertices = [...this.currentVertices];
64
+ this.onUpdate({
65
+ state: "start",
66
+ transformData: {
67
+ type: "vertex-edit",
68
+ changes: {
69
+ vertices: this.startVertices
70
+ },
71
+ metadata: {
72
+ vertexIndex
73
+ }
74
+ }
75
+ });
76
+ }
77
+ move(clientX, clientY) {
78
+ if (this.state === "idle" || !this.startPoint) return;
79
+ if (this.state === "dragging" && this.startElement) {
80
+ const delta = this.calculateDelta(clientX, clientY);
81
+ const position = this.calculateDragPosition(delta);
82
+ this.currentPosition = position;
83
+ this.onUpdate({
84
+ state: "move",
85
+ transformData: {
86
+ type: "move",
87
+ changes: {
88
+ rect: position
89
+ }
90
+ }
91
+ });
92
+ } else if (this.state === "resizing" && this.activeHandle && this.startElement) {
93
+ const delta = this.calculateDelta(clientX, clientY);
94
+ const position = this.calculateResizePosition(delta, this.activeHandle);
95
+ this.currentPosition = position;
96
+ this.onUpdate({
97
+ state: "move",
98
+ transformData: {
99
+ type: "resize",
100
+ changes: {
101
+ rect: position
102
+ },
103
+ metadata: {
104
+ handle: this.activeHandle,
105
+ maintainAspectRatio: this.config.maintainAspectRatio
106
+ }
107
+ }
108
+ });
109
+ } else if (this.state === "vertex-editing" && this.activeVertexIndex !== null) {
110
+ const vertices = this.calculateVertexPosition(clientX, clientY);
111
+ this.currentVertices = vertices;
112
+ this.onUpdate({
113
+ state: "move",
114
+ transformData: {
115
+ type: "vertex-edit",
116
+ changes: {
117
+ vertices
118
+ },
119
+ metadata: {
120
+ vertexIndex: this.activeVertexIndex
121
+ }
122
+ }
123
+ });
124
+ }
125
+ }
126
+ end() {
127
+ if (this.state === "idle") return;
128
+ const wasState = this.state;
129
+ const handle = this.activeHandle;
130
+ const vertexIndex = this.activeVertexIndex;
131
+ if (wasState === "vertex-editing") {
132
+ this.onUpdate({
133
+ state: "end",
134
+ transformData: {
135
+ type: "vertex-edit",
136
+ changes: {
137
+ vertices: this.currentVertices
138
+ },
139
+ metadata: {
140
+ vertexIndex: vertexIndex || void 0
141
+ }
142
+ }
143
+ });
144
+ } else {
145
+ const finalPosition = this.getCurrentPosition();
146
+ this.onUpdate({
147
+ state: "end",
148
+ transformData: {
149
+ type: wasState === "dragging" ? "move" : "resize",
150
+ changes: {
151
+ rect: finalPosition
152
+ },
153
+ metadata: wasState === "dragging" ? void 0 : {
154
+ handle: handle || void 0,
155
+ maintainAspectRatio: this.config.maintainAspectRatio
156
+ }
157
+ }
158
+ });
159
+ }
160
+ this.reset();
161
+ }
162
+ cancel() {
163
+ if (this.state === "idle") return;
164
+ if (this.state === "vertex-editing") {
165
+ this.onUpdate({
166
+ state: "end",
167
+ transformData: {
168
+ type: "vertex-edit",
169
+ changes: {
170
+ vertices: this.startVertices
171
+ },
172
+ metadata: {
173
+ vertexIndex: this.activeVertexIndex || void 0
174
+ }
175
+ }
176
+ });
177
+ } else if (this.startElement) {
178
+ this.onUpdate({
179
+ state: "end",
180
+ transformData: {
181
+ type: this.state === "dragging" ? "move" : "resize",
182
+ changes: {
183
+ rect: this.startElement
184
+ },
185
+ metadata: this.state === "dragging" ? void 0 : {
186
+ handle: this.activeHandle || void 0,
187
+ maintainAspectRatio: this.config.maintainAspectRatio
188
+ }
189
+ }
190
+ });
191
+ }
192
+ this.reset();
193
+ }
194
+ reset() {
195
+ this.state = "idle";
196
+ this.startPoint = null;
197
+ this.startElement = null;
198
+ this.activeHandle = null;
199
+ this.currentPosition = null;
200
+ this.activeVertexIndex = null;
201
+ this.startVertices = [];
202
+ }
203
+ getCurrentPosition() {
204
+ return this.currentPosition || this.config.element;
205
+ }
206
+ calculateDelta(clientX, clientY) {
207
+ if (!this.startPoint) return { x: 0, y: 0 };
208
+ const rawDelta = {
209
+ x: clientX - this.startPoint.x,
210
+ y: clientY - this.startPoint.y
211
+ };
212
+ return this.transformDelta(rawDelta);
213
+ }
214
+ transformDelta(delta) {
215
+ const { pageRotation = 0, scale = 1 } = this.config;
216
+ const rad = pageRotation * Math.PI / 2;
217
+ const cos = Math.cos(rad);
218
+ const sin = Math.sin(rad);
219
+ const scaledX = delta.x / scale;
220
+ const scaledY = delta.y / scale;
221
+ return {
222
+ x: cos * scaledX + sin * scaledY,
223
+ y: -sin * scaledX + cos * scaledY
224
+ };
225
+ }
226
+ clampPoint(p) {
227
+ var _a;
228
+ const bbox = (_a = this.config.constraints) == null ? void 0 : _a.boundingBox;
229
+ if (!bbox) return p;
230
+ return {
231
+ x: Math.max(0, Math.min(p.x, bbox.width)),
232
+ y: Math.max(0, Math.min(p.y, bbox.height))
233
+ };
234
+ }
235
+ calculateVertexPosition(clientX, clientY) {
236
+ if (this.activeVertexIndex === null) return this.startVertices;
237
+ const delta = this.calculateDelta(clientX, clientY);
238
+ const newVertices = [...this.startVertices];
239
+ const currentVertex = newVertices[this.activeVertexIndex];
240
+ const moved = {
241
+ x: currentVertex.x + delta.x,
242
+ y: currentVertex.y + delta.y
243
+ };
244
+ newVertices[this.activeVertexIndex] = this.clampPoint(moved);
245
+ return newVertices;
246
+ }
247
+ calculateDragPosition(delta) {
248
+ if (!this.startElement) return this.config.element;
249
+ const position = {
250
+ origin: {
251
+ x: this.startElement.origin.x + delta.x,
252
+ y: this.startElement.origin.y + delta.y
253
+ },
254
+ size: {
255
+ width: this.startElement.size.width,
256
+ height: this.startElement.size.height
257
+ }
258
+ };
259
+ return this.applyConstraints(position);
260
+ }
261
+ calculateResizePosition(delta, handle) {
262
+ var _a;
263
+ if (!this.startElement) return this.config.element;
264
+ let {
265
+ origin: { x, y },
266
+ size: { width, height }
267
+ } = this.startElement;
268
+ switch (handle) {
269
+ case "se":
270
+ width += delta.x;
271
+ height += delta.y;
272
+ break;
273
+ case "sw":
274
+ x += delta.x;
275
+ width -= delta.x;
276
+ height += delta.y;
277
+ break;
278
+ case "ne":
279
+ width += delta.x;
280
+ y += delta.y;
281
+ height -= delta.y;
282
+ break;
283
+ case "nw":
284
+ x += delta.x;
285
+ width -= delta.x;
286
+ y += delta.y;
287
+ height -= delta.y;
288
+ break;
289
+ case "n":
290
+ y += delta.y;
291
+ height -= delta.y;
292
+ break;
293
+ case "s":
294
+ height += delta.y;
295
+ break;
296
+ case "e":
297
+ width += delta.x;
298
+ break;
299
+ case "w":
300
+ x += delta.x;
301
+ width -= delta.x;
302
+ break;
303
+ }
304
+ if (this.config.maintainAspectRatio && this.startElement) {
305
+ const aspectRatio = this.startElement.size.width / this.startElement.size.height;
306
+ if (["n", "s", "e", "w"].includes(handle)) {
307
+ if (handle === "n" || handle === "s") {
308
+ const newWidth = height * aspectRatio;
309
+ const widthDiff = newWidth - width;
310
+ width = newWidth;
311
+ x -= widthDiff / 2;
312
+ } else {
313
+ const newHeight = width / aspectRatio;
314
+ const heightDiff = newHeight - height;
315
+ height = newHeight;
316
+ if (handle === "w") {
317
+ x = this.startElement.origin.x + this.startElement.size.width - width;
318
+ }
319
+ y -= heightDiff / 2;
320
+ }
321
+ } else {
322
+ const widthChange = Math.abs(width - this.startElement.size.width);
323
+ const heightChange = Math.abs(height - this.startElement.size.height);
324
+ if (widthChange > heightChange) {
325
+ height = width / aspectRatio;
326
+ } else {
327
+ width = height * aspectRatio;
328
+ }
329
+ if (handle.includes("w")) {
330
+ x = this.startElement.origin.x + this.startElement.size.width - width;
331
+ }
332
+ if (handle.includes("n")) {
333
+ y = this.startElement.origin.y + this.startElement.size.height - height;
334
+ }
335
+ }
336
+ }
337
+ const bbox = (_a = this.config.constraints) == null ? void 0 : _a.boundingBox;
338
+ if (bbox) {
339
+ switch (handle) {
340
+ case "e":
341
+ width = Math.min(width, bbox.width - x);
342
+ break;
343
+ case "s":
344
+ height = Math.min(height, bbox.height - y);
345
+ break;
346
+ case "se":
347
+ width = Math.min(width, bbox.width - x);
348
+ height = Math.min(height, bbox.height - y);
349
+ break;
350
+ case "w":
351
+ if (x < 0) {
352
+ width += x;
353
+ x = 0;
354
+ }
355
+ break;
356
+ case "n":
357
+ if (y < 0) {
358
+ height += y;
359
+ y = 0;
360
+ }
361
+ break;
362
+ case "sw":
363
+ if (x < 0) {
364
+ width += x;
365
+ x = 0;
366
+ }
367
+ height = Math.min(height, bbox.height - y);
368
+ break;
369
+ case "nw":
370
+ if (x < 0) {
371
+ width += x;
372
+ x = 0;
373
+ }
374
+ if (y < 0) {
375
+ height += y;
376
+ y = 0;
377
+ }
378
+ break;
379
+ case "ne":
380
+ width = Math.min(width, bbox.width - x);
381
+ if (y < 0) {
382
+ height += y;
383
+ y = 0;
384
+ }
385
+ break;
386
+ }
387
+ }
388
+ return this.applyConstraints({ origin: { x, y }, size: { width, height } });
389
+ }
390
+ applyConstraints(position) {
391
+ const { constraints } = this.config;
392
+ if (!constraints) return position;
393
+ let {
394
+ origin: { x, y },
395
+ size: { width, height }
396
+ } = position;
397
+ width = Math.max(constraints.minWidth || 1, width);
398
+ height = Math.max(constraints.minHeight || 1, height);
399
+ if (constraints.maxWidth) width = Math.min(constraints.maxWidth, width);
400
+ if (constraints.maxHeight) height = Math.min(constraints.maxHeight, height);
401
+ if (constraints.boundingBox) {
402
+ x = Math.max(0, Math.min(x, constraints.boundingBox.width - width));
403
+ y = Math.max(0, Math.min(y, constraints.boundingBox.height - height));
404
+ }
405
+ return { origin: { x, y }, size: { width, height } };
406
+ }
407
+ }
408
+ function diagonalCursor(handle, rot) {
409
+ const diag0 = {
410
+ nw: "nwse-resize",
411
+ ne: "nesw-resize",
412
+ sw: "nesw-resize",
413
+ se: "nwse-resize"
414
+ };
415
+ if (handle === "n" || handle === "s") return "ns-resize";
416
+ if (handle === "e" || handle === "w") return "ew-resize";
417
+ if (rot % 2 === 0) return diag0[handle];
418
+ return { nw: "nesw-resize", ne: "nwse-resize", sw: "nwse-resize", se: "nesw-resize" }[handle];
419
+ }
420
+ function edgeOffset(k, spacing, mode) {
421
+ const base = -k / 2;
422
+ if (mode === "center") return base;
423
+ return mode === "outside" ? base - spacing : base + spacing;
424
+ }
425
+ function describeResizeFromConfig(cfg, ui = {}) {
426
+ const {
427
+ handleSize = 8,
428
+ spacing = 1,
429
+ offsetMode = "outside",
430
+ includeSides = false,
431
+ zIndex = 3,
432
+ rotationAwareCursor = true
433
+ } = ui;
434
+ const rotation = (cfg.pageRotation ?? 0) % 4;
435
+ const off = (edge) => ({
436
+ [edge]: edgeOffset(handleSize, spacing, offsetMode) + "px"
437
+ });
438
+ const corners = [
439
+ ["nw", { ...off("top"), ...off("left") }],
440
+ ["ne", { ...off("top"), ...off("right") }],
441
+ ["sw", { ...off("bottom"), ...off("left") }],
442
+ ["se", { ...off("bottom"), ...off("right") }]
443
+ ];
444
+ const sides = includeSides ? [
445
+ ["n", { ...off("top"), left: `calc(50% - ${handleSize / 2}px)` }],
446
+ ["s", { ...off("bottom"), left: `calc(50% - ${handleSize / 2}px)` }],
447
+ ["w", { ...off("left"), top: `calc(50% - ${handleSize / 2}px)` }],
448
+ ["e", { ...off("right"), top: `calc(50% - ${handleSize / 2}px)` }]
449
+ ] : [];
450
+ const all = [...corners, ...sides];
451
+ return all.map(([handle, pos]) => ({
452
+ handle,
453
+ style: {
454
+ position: "absolute",
455
+ width: handleSize + "px",
456
+ height: handleSize + "px",
457
+ borderRadius: "50%",
458
+ zIndex,
459
+ cursor: rotationAwareCursor ? diagonalCursor(handle, rotation) : "default",
460
+ touchAction: "none",
461
+ ...pos
462
+ },
463
+ attrs: { "data-epdf-handle": handle }
464
+ }));
465
+ }
466
+ function describeVerticesFromConfig(cfg, ui = {}, liveVertices) {
467
+ const { vertexSize = 12, zIndex = 4 } = ui;
468
+ const rect = cfg.element;
469
+ const scale = cfg.scale ?? 1;
470
+ const verts = liveVertices ?? cfg.vertices ?? [];
471
+ return verts.map((v, i) => {
472
+ const left = (v.x - rect.origin.x) * scale - vertexSize / 2;
473
+ const top = (v.y - rect.origin.y) * scale - vertexSize / 2;
474
+ return {
475
+ handle: "nw",
476
+ // not used; kept for type
477
+ style: {
478
+ position: "absolute",
479
+ left: left + "px",
480
+ top: top + "px",
481
+ width: vertexSize + "px",
482
+ height: vertexSize + "px",
483
+ borderRadius: "50%",
484
+ cursor: "pointer",
485
+ zIndex,
486
+ touchAction: "none"
487
+ },
488
+ attrs: { "data-epdf-vertex": i }
489
+ };
490
+ });
491
+ }
492
+ function useDragResize(getOptions) {
493
+ const config = $.derived(() => {
494
+ const opts = getOptions();
495
+ const { onUpdate: onUpdate2, enabled: enabled2, ...rest } = opts;
496
+ return rest;
497
+ });
498
+ const enabled = $.derived(() => getOptions().enabled ?? true);
499
+ const onUpdate = $.derived(() => getOptions().onUpdate);
500
+ let controller = $.state(null);
501
+ $.user_effect(() => {
502
+ if (!$.get(controller)) {
503
+ $.set(controller, new DragResizeController($.get(config), (event) => {
504
+ var _a;
505
+ return (_a = $.get(onUpdate)) == null ? void 0 : _a(event);
506
+ }), true);
507
+ } else {
508
+ $.get(controller).updateConfig($.get(config));
509
+ }
510
+ });
511
+ const handleDragStart = (e) => {
512
+ var _a;
513
+ if (!$.get(enabled)) return;
514
+ e.preventDefault();
515
+ e.stopPropagation();
516
+ (_a = $.get(controller)) == null ? void 0 : _a.startDrag(e.clientX, e.clientY);
517
+ e.currentTarget.setPointerCapture(e.pointerId);
518
+ };
519
+ const handleMove = (e) => {
520
+ var _a;
521
+ e.preventDefault();
522
+ e.stopPropagation();
523
+ (_a = $.get(controller)) == null ? void 0 : _a.move(e.clientX, e.clientY);
524
+ };
525
+ const handleEnd = (e) => {
526
+ var _a, _b, _c;
527
+ e.preventDefault();
528
+ e.stopPropagation();
529
+ (_a = $.get(controller)) == null ? void 0 : _a.end();
530
+ (_c = (_b = e.currentTarget).releasePointerCapture) == null ? void 0 : _c.call(_b, e.pointerId);
531
+ };
532
+ const createResizeHandler = (handle) => ({
533
+ onpointerdown: (e) => {
534
+ var _a;
535
+ if (!$.get(enabled)) return;
536
+ e.preventDefault();
537
+ e.stopPropagation();
538
+ (_a = $.get(controller)) == null ? void 0 : _a.startResize(handle, e.clientX, e.clientY);
539
+ e.currentTarget.setPointerCapture(e.pointerId);
540
+ },
541
+ onpointermove: handleMove,
542
+ onpointerup: handleEnd,
543
+ onpointercancel: handleEnd
544
+ });
545
+ const createVertexHandler = (vertexIndex) => ({
546
+ onpointerdown: (e) => {
547
+ var _a;
548
+ if (!$.get(enabled)) return;
549
+ e.preventDefault();
550
+ e.stopPropagation();
551
+ (_a = $.get(controller)) == null ? void 0 : _a.startVertexEdit(vertexIndex, e.clientX, e.clientY);
552
+ e.currentTarget.setPointerCapture(e.pointerId);
553
+ },
554
+ onpointermove: handleMove,
555
+ onpointerup: handleEnd,
556
+ onpointercancel: handleEnd
557
+ });
558
+ const dragProps = $.derived(() => $.get(enabled) ? {
559
+ onpointerdown: handleDragStart,
560
+ onpointermove: handleMove,
561
+ onpointerup: handleEnd,
562
+ onpointercancel: handleEnd
563
+ } : {});
564
+ return {
565
+ get dragProps() {
566
+ return $.get(dragProps);
567
+ },
568
+ createResizeProps: createResizeHandler,
569
+ createVertexProps: createVertexHandler
570
+ };
571
+ }
572
+ function stylesToString(style) {
573
+ return Object.entries(style).map(([key, value]) => {
574
+ const cssKey = key.replace(/[A-Z]/g, (m) => `-${m.toLowerCase()}`);
575
+ return `${cssKey}: ${value}`;
576
+ }).join("; ");
577
+ }
578
+ function useInteractionHandles(getOpts) {
579
+ const controller = $.derived(() => getOpts().controller);
580
+ const resizeUI = $.derived(() => getOpts().resizeUI);
581
+ const vertexUI = $.derived(() => getOpts().vertexUI);
582
+ const includeVertices = $.derived(() => getOpts().includeVertices ?? false);
583
+ const handleAttrs = $.derived(() => getOpts().handleAttrs);
584
+ const vertexAttrs = $.derived(() => getOpts().vertexAttrs);
585
+ const dragResize = useDragResize(() => $.get(controller));
586
+ const resize = $.derived(() => {
587
+ const desc = describeResizeFromConfig($.get(controller), $.get(resizeUI));
588
+ return desc.map((d) => {
589
+ var _a, _b;
590
+ return {
591
+ key: (_a = d.attrs) == null ? void 0 : _a["data-epdf-handle"],
592
+ style: stylesToString(d.style),
593
+ ...dragResize.createResizeProps(d.handle),
594
+ ...d.attrs ?? {},
595
+ ...((_b = $.get(handleAttrs)) == null ? void 0 : _b(d.handle)) ?? {}
596
+ };
597
+ });
598
+ });
599
+ const vertices = $.derived(() => {
600
+ if (!$.get(includeVertices)) return [];
601
+ const desc = describeVerticesFromConfig($.get(controller), $.get(vertexUI), $.get(controller).vertices);
602
+ return desc.map((d, i) => {
603
+ var _a;
604
+ return {
605
+ key: i,
606
+ style: stylesToString(d.style),
607
+ ...dragResize.createVertexProps(i),
608
+ ...d.attrs ?? {},
609
+ ...((_a = $.get(vertexAttrs)) == null ? void 0 : _a(i)) ?? {}
610
+ };
611
+ });
612
+ });
613
+ return {
614
+ get dragProps() {
615
+ return dragResize.dragProps;
616
+ },
617
+ get resize() {
618
+ return $.get(resize);
619
+ },
620
+ get vertices() {
621
+ return $.get(vertices);
622
+ }
623
+ };
624
+ }
625
+ function doublePress(node, options = {}) {
626
+ let { onDouble, delay = 300, tolerancePx = 18 } = options;
627
+ const last = { t: 0, x: 0, y: 0 };
628
+ const handlePointerUp = (e) => {
629
+ const ev = e;
630
+ if (!onDouble) return;
631
+ if (ev.pointerType === "mouse" || ev.isPrimary === false) return;
632
+ const now = performance.now();
633
+ const x = ev.clientX;
634
+ const y = ev.clientY;
635
+ const withinTime = now - last.t <= delay;
636
+ const dx = x - last.x;
637
+ const dy = y - last.y;
638
+ const withinDist = dx * dx + dy * dy <= tolerancePx * tolerancePx;
639
+ if (withinTime && withinDist) onDouble == null ? void 0 : onDouble(ev);
640
+ last.t = now;
641
+ last.x = x;
642
+ last.y = y;
643
+ };
644
+ const handleDblClick = (e) => {
645
+ onDouble == null ? void 0 : onDouble(e);
646
+ };
647
+ node.addEventListener("pointerup", handlePointerUp, { capture: true });
648
+ node.addEventListener("dblclick", handleDblClick);
649
+ return {
650
+ update(next) {
651
+ if (!next) return;
652
+ onDouble = next.onDouble;
653
+ delay = next.delay ?? delay;
654
+ tolerancePx = next.tolerancePx ?? tolerancePx;
655
+ },
656
+ destroy() {
657
+ node.removeEventListener("pointerup", handlePointerUp, { capture: true });
658
+ node.removeEventListener("dblclick", handleDblClick);
659
+ }
660
+ };
661
+ }
662
+ function CounterRotateContainer($$anchor, $$props) {
663
+ $.push($$props, true);
664
+ const counterRotation = $.derived(() => getCounterRotation($$props.rect, $$props.rotation));
665
+ let elementRef = $.state(null);
666
+ $.user_effect(() => {
667
+ const element = $.get(elementRef);
668
+ if (!element) return;
669
+ const handlePointerDown = (e) => {
670
+ e.stopPropagation();
671
+ };
672
+ const handleTouchStart = (e) => {
673
+ e.stopPropagation();
674
+ };
675
+ element.addEventListener("pointerdown", handlePointerDown, { capture: true });
676
+ element.addEventListener("touchstart", handleTouchStart, { capture: true });
677
+ return () => {
678
+ element.removeEventListener("pointerdown", handlePointerDown, { capture: true });
679
+ element.removeEventListener("touchstart", handleTouchStart, { capture: true });
680
+ };
681
+ });
682
+ const menuWrapperStyle = $.derived(() => `position: absolute; left: ${$$props.rect.origin.x}px; top: ${$$props.rect.origin.y}px; transform: ${$.get(counterRotation).matrix}; transform-origin: 0 0; width: ${$.get(counterRotation).width}px; height: ${$.get(counterRotation).height}px; pointer-events: none; z-index: 3`);
683
+ const menuWrapperProps = $.derived(() => ({
684
+ style: $.get(menuWrapperStyle),
685
+ ref: (el) => {
686
+ $.set(elementRef, el, true);
687
+ }
688
+ }));
689
+ var fragment = $.comment();
690
+ var node = $.first_child(fragment);
691
+ {
692
+ var consequent = ($$anchor2) => {
693
+ var fragment_1 = $.comment();
694
+ var node_1 = $.first_child(fragment_1);
695
+ $.snippet(node_1, () => $$props.children, () => ({
696
+ menuWrapperProps: $.get(menuWrapperProps),
697
+ matrix: $.get(counterRotation).matrix,
698
+ rect: {
699
+ origin: { x: $$props.rect.origin.x, y: $$props.rect.origin.y },
700
+ size: {
701
+ width: $.get(counterRotation).width,
702
+ height: $.get(counterRotation).height
703
+ }
704
+ }
705
+ }));
706
+ $.append($$anchor2, fragment_1);
707
+ };
708
+ $.if(node, ($$render) => {
709
+ if ($$props.children) $$render(consequent);
710
+ });
711
+ }
712
+ $.append($$anchor, fragment);
713
+ $.pop();
714
+ }
715
+ function deepToRaw(sourceObj) {
716
+ const objectIterator = (input) => {
717
+ if (input === null || input === void 0) {
718
+ return input;
719
+ }
720
+ if (typeof input !== "object") {
721
+ return input;
722
+ }
723
+ if (Array.isArray(input)) {
724
+ return input.map((item) => objectIterator(item));
725
+ }
726
+ if (input instanceof Date) {
727
+ return new Date(input.getTime());
728
+ }
729
+ if (input instanceof RegExp) {
730
+ return new RegExp(input.source, input.flags);
731
+ }
732
+ if (Object.prototype.toString.call(input) === "[object Object]") {
733
+ return Object.keys(input).reduce((acc, key) => {
734
+ const value = input[key];
735
+ if (typeof value !== "function") {
736
+ acc[key] = objectIterator(value);
737
+ }
738
+ return acc;
739
+ }, {});
740
+ }
741
+ try {
742
+ return JSON.parse(JSON.stringify(input));
743
+ } catch {
744
+ return void 0;
745
+ }
746
+ };
747
+ return objectIterator(sourceObj);
748
+ }
749
+ export {
750
+ CounterRotateContainer as CounterRotate,
751
+ deepToRaw,
752
+ doublePress,
753
+ stylesToString,
754
+ useDragResize,
755
+ useInteractionHandles
756
+ };
757
+ //# sourceMappingURL=index.js.map