@ptahjs/dnd 0.0.2 → 0.1.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.
- package/dist/dnd.css +1 -1
- package/dist/dnd.js +384 -248
- package/package.json +2 -2
package/dist/dnd.css
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
.draggable-dot-wrap{pointer-events:none;z-index:1;box-sizing:border-box;position:absolute;inset:0}.draggable-dot{z-index:2;pointer-events:auto;background:#3a7afe;border-radius:50%;width:10px;height:10px;display:block;position:absolute;transform:translate(-50%,-50%)}.draggable-dot[data-pos=tl]{cursor:nw-resize;top:0%;left:0%}.draggable-dot[data-pos=tm]{cursor:n-resize;border-radius:8px;width:16px;height:8px;top:0%;left:50%}.draggable-dot[data-pos=tr]{cursor:ne-resize;top:0%;right:0%;transform:translate(50%,-50%)}.draggable-dot[data-pos=rm]{cursor:e-resize;border-radius:8px;width:8px;height:16px;top:50%;right:0%;transform:translate(50%,-50%)}.draggable-dot[data-pos=br]{cursor:se-resize;bottom:0%;right:0%;transform:translate(50%,50%)}.draggable-dot[data-pos=bm]{cursor:s-resize;border-radius:8px;width:16px;height:8px;bottom:0%;left:50%;transform:translate(-50%,50%)}.draggable-dot[data-pos=bl]{cursor:sw-resize;bottom:0%;left:0%;transform:translate(-50%,50%)}.draggable-dot[data-pos=lm]{cursor:w-resize;border-radius:8px;width:8px;height:16px;top:50%;left:0%}.draggable-rotate{z-index:2;cursor:grab;pointer-events:auto;position:absolute;top:0;left:50%;transform:translate(-50%,-200%)}.draggable-rotate:after{content:"";background:url(data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%201024%201024%22%3E%3Cpath%20fill%3D%22%233a7afe%22%20d%3D%22M784.512%20230.272v-50.56a32%2032%200%201%201%2064%200v149.056a32%2032%200%200%201-32%2032H667.52a32%2032%200%201%201%200-64h92.992A320%20320%200%201%200%20524.8%20833.152a320%20320%200%200%200%20320-320h64a384%20384%200%200%201-384%20384%20384%20384%200%200%201-384-384%20384%20384%200%200%201%20643.712-282.88z%22/%3E%3C/svg%3E) 50%/contain no-repeat;width:16px;height:16px;display:block}.draggable-markline-x,.draggable-markline-y{z-index:9999;background-color:#3a7afe;display:none;position:absolute;top:0;left:0}.draggable-markline-x{width:1px;height:100%}.draggable-markline-y{width:100%;height:1px}.dnd-mirror{pointer-events:none;z-index:999999;will-change:transform;opacity:.5;background:#fff;margin:0;position:fixed;top:0;left:0;transform:translate(0,0)}.dnd-indicator{--dnd-color:#3a7afe;--dnd-dot:6px;--dnd-line:2px;pointer-events:none;background:var(--dnd-color);position:absolute}.dnd-indicator:before,.dnd-indicator:after{content:"";background:var(--dnd-color);width:var(--dnd-dot);height:var(--dnd-dot);opacity:0;border-radius:50%;transition:opacity .15s;position:absolute}.dnd-indicator-active:before,.dnd-indicator-active:after{opacity:1}.dnd-indicator--top,.dnd-indicator--bottom{height:var(--dnd-line);width:100%;left:0}.dnd-indicator--top{top:0}.dnd-indicator--bottom{bottom:0}.dnd-indicator--top:before,.dnd-indicator--bottom:before{left:-2px}.dnd-indicator--top:after,.dnd-indicator--bottom:after{right:-2px}.dnd-indicator--top:before,.dnd-indicator--top:after{top:-2px}.dnd-indicator--bottom:before,.dnd-indicator--bottom:after{bottom:-2px}.dnd-indicator--left,.dnd-indicator--right{width:var(--dnd-line);height:100%;top:0}.dnd-indicator--left{left:0}.dnd-indicator--right{right:0}.dnd-indicator--left:before,.dnd-indicator--left:after{left:-2px}.dnd-indicator--right:before,.dnd-indicator--right:after{right:-2px}.dnd-indicator--left:before,.dnd-indicator--right:before{top:-2px}.dnd-indicator--left:after,.dnd-indicator--right:after{bottom:-2px}
|
|
1
|
+
.draggable-dot-wrap{pointer-events:none;z-index:1;box-sizing:border-box;position:absolute;inset:0}.draggable-dot{z-index:2;pointer-events:auto;background:#3a7afe;border-radius:50%;width:10px;height:10px;display:block;position:absolute;transform:translate(-50%,-50%)}.draggable-dot[data-pos=tl]{cursor:nw-resize;top:0%;left:0%}.draggable-dot[data-pos=tm]{cursor:n-resize;border-radius:8px;width:16px;height:8px;top:0%;left:50%}.draggable-dot[data-pos=tr]{cursor:ne-resize;top:0%;right:0%;transform:translate(50%,-50%)}.draggable-dot[data-pos=rm]{cursor:e-resize;border-radius:8px;width:8px;height:16px;top:50%;right:0%;transform:translate(50%,-50%)}.draggable-dot[data-pos=br]{cursor:se-resize;bottom:0%;right:0%;transform:translate(50%,50%)}.draggable-dot[data-pos=bm]{cursor:s-resize;border-radius:8px;width:16px;height:8px;bottom:0%;left:50%;transform:translate(-50%,50%)}.draggable-dot[data-pos=bl]{cursor:sw-resize;bottom:0%;left:0%;transform:translate(-50%,50%)}.draggable-dot[data-pos=lm]{cursor:w-resize;border-radius:8px;width:8px;height:16px;top:50%;left:0%}.draggable-rotate{z-index:2;cursor:grab;pointer-events:auto;position:absolute;top:0;left:50%;transform:translate(-50%,-200%)}.draggable-rotate:after{content:"";background:url(data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%201024%201024%22%3E%3Cpath%20fill%3D%22%233a7afe%22%20d%3D%22M784.512%20230.272v-50.56a32%2032%200%201%201%2064%200v149.056a32%2032%200%200%201-32%2032H667.52a32%2032%200%201%201%200-64h92.992A320%20320%200%201%200%20524.8%20833.152a320%20320%200%200%200%20320-320h64a384%20384%200%200%201-384%20384%20384%20384%200%200%201-384-384%20384%20384%200%200%201%20643.712-282.88z%22/%3E%3C/svg%3E) 50%/contain no-repeat;width:16px;height:16px;display:block}.draggable-markline-x,.draggable-markline-y{z-index:9999;background-color:#3a7afe;display:none;position:absolute;top:0;left:0}.draggable-markline-x{width:1px;height:100%}.draggable-markline-y{width:100%;height:1px}.dnd-mirror{pointer-events:none;z-index:999999;will-change:transform;opacity:.5;background:#fff;margin:0;position:fixed;top:0;left:0;transform:translate(0,0)}.dnd-indicator{--dnd-color:#3a7afe;--dnd-dot:6px;--dnd-line:2px;pointer-events:none;background:var(--dnd-color);display:none;position:absolute}.dnd-indicator.dnd-indicator-active{display:block}.dnd-indicator:before,.dnd-indicator:after{content:"";background:var(--dnd-color);width:var(--dnd-dot);height:var(--dnd-dot);opacity:0;border-radius:50%;transition:opacity .15s;position:absolute}.dnd-indicator-active:before,.dnd-indicator-active:after{opacity:1}.dnd-indicator--top,.dnd-indicator--bottom{height:var(--dnd-line);width:100%;left:0}.dnd-indicator--top{top:0}.dnd-indicator--bottom{bottom:0}.dnd-indicator--top:before,.dnd-indicator--bottom:before{left:-2px}.dnd-indicator--top:after,.dnd-indicator--bottom:after{right:-2px}.dnd-indicator--top:before,.dnd-indicator--top:after{top:-2px}.dnd-indicator--bottom:before,.dnd-indicator--bottom:after{bottom:-2px}.dnd-indicator--left,.dnd-indicator--right{width:var(--dnd-line);height:100%;top:0}.dnd-indicator--left{left:0}.dnd-indicator--right{right:0}.dnd-indicator--left:before,.dnd-indicator--left:after{left:-2px}.dnd-indicator--right:before,.dnd-indicator--right:after{right:-2px}.dnd-indicator--left:before,.dnd-indicator--right:before{top:-2px}.dnd-indicator--left:after,.dnd-indicator--right:after{bottom:-2px}.dnd-marquee{pointer-events:none;z-index:9999;background:#4096ff1a;border:1px solid #4096ff99;position:absolute}
|
|
2
2
|
/*$vite$:1*/
|
package/dist/dnd.js
CHANGED
|
@@ -54,11 +54,19 @@ var e = class {
|
|
|
54
54
|
indicatorTop: "dnd-indicator--top",
|
|
55
55
|
indicatorRight: "dnd-indicator--right",
|
|
56
56
|
indicatorBottom: "dnd-indicator--bottom",
|
|
57
|
-
indicatorLeft: "dnd-indicator--left"
|
|
58
|
-
|
|
57
|
+
indicatorLeft: "dnd-indicator--left",
|
|
58
|
+
marquee: "dnd-marquee"
|
|
59
|
+
}, r = .5, i = 1 / 3, a = {
|
|
60
|
+
MARQUEE_MOVE: 5,
|
|
61
|
+
DRAG_START: 3
|
|
62
|
+
}, o = {
|
|
63
|
+
EDGE: 48,
|
|
64
|
+
MIN_SPEED: 180,
|
|
65
|
+
MAX_SPEED: 600
|
|
66
|
+
};
|
|
59
67
|
//#endregion
|
|
60
68
|
//#region src/utils/computeDropRegion.js
|
|
61
|
-
function
|
|
69
|
+
function s(e) {
|
|
62
70
|
if (e?.cache?.dropRegionFns) return e.cache.dropRegionFns;
|
|
63
71
|
let t = () => {
|
|
64
72
|
if (e.currentDrop) return e.currentDropRect || void 0;
|
|
@@ -84,7 +92,7 @@ function a(e) {
|
|
|
84
92
|
}
|
|
85
93
|
//#endregion
|
|
86
94
|
//#region src/utils/parseData.js
|
|
87
|
-
function
|
|
95
|
+
function c(e) {
|
|
88
96
|
if (e === void 0) return;
|
|
89
97
|
let t = String(e).trim();
|
|
90
98
|
if (!t) return "";
|
|
@@ -96,7 +104,7 @@ function o(e) {
|
|
|
96
104
|
}
|
|
97
105
|
//#endregion
|
|
98
106
|
//#region src/utils/createPayload.js
|
|
99
|
-
function
|
|
107
|
+
function l(e, n) {
|
|
100
108
|
let r = () => {
|
|
101
109
|
let e = n.currentDrop;
|
|
102
110
|
if (!e) return;
|
|
@@ -115,7 +123,7 @@ function s(e, n) {
|
|
|
115
123
|
return;
|
|
116
124
|
}
|
|
117
125
|
let i = n.adapter.getAttr(e, t.dataAttr);
|
|
118
|
-
return r.dropDataEl === e && i === r.dropDataRaw ? r.dropDataParsed : (r.dropDataEl = e, r.dropDataRaw = i, r.dropDataParsed =
|
|
126
|
+
return r.dropDataEl === e && i === r.dropDataRaw ? r.dropDataParsed : (r.dropDataEl = e, r.dropDataRaw = i, r.dropDataParsed = c(i), r.dropDataParsed);
|
|
119
127
|
};
|
|
120
128
|
if (!n.cache.hitDropFn) {
|
|
121
129
|
let e = -1, t = 0, r = 0, i, a;
|
|
@@ -147,12 +155,12 @@ function s(e, n) {
|
|
|
147
155
|
dy: n.dy,
|
|
148
156
|
started: n.started,
|
|
149
157
|
hitDrop: n.cache.hitDropFn,
|
|
150
|
-
...
|
|
158
|
+
...s(n)
|
|
151
159
|
};
|
|
152
160
|
}
|
|
153
161
|
//#endregion
|
|
154
162
|
//#region src/utils/createSession.js
|
|
155
|
-
function
|
|
163
|
+
function u(e) {
|
|
156
164
|
return {
|
|
157
165
|
adapter: void 0,
|
|
158
166
|
currentDropRect: void 0,
|
|
@@ -168,7 +176,7 @@ function c(e) {
|
|
|
168
176
|
dx: 0,
|
|
169
177
|
dy: 0,
|
|
170
178
|
started: !1,
|
|
171
|
-
threshold:
|
|
179
|
+
threshold: a.DRAG_START,
|
|
172
180
|
lastMoveTs: 0,
|
|
173
181
|
sourceEl: void 0,
|
|
174
182
|
handleEl: void 0,
|
|
@@ -205,7 +213,7 @@ function c(e) {
|
|
|
205
213
|
}
|
|
206
214
|
//#endregion
|
|
207
215
|
//#region src/utils/createContext.js
|
|
208
|
-
function
|
|
216
|
+
function d({ dnd: e, session: t, store: n, frame: r, adapter: i }) {
|
|
209
217
|
let a = /* @__PURE__ */ new Map();
|
|
210
218
|
return {
|
|
211
219
|
dnd: e,
|
|
@@ -215,24 +223,24 @@ function l({ dnd: e, session: t, store: n, frame: r, adapter: i }) {
|
|
|
215
223
|
adapter: i,
|
|
216
224
|
payload: (e = "drag") => {
|
|
217
225
|
if (a.has(e)) return a.get(e);
|
|
218
|
-
let n =
|
|
226
|
+
let n = l(e, t);
|
|
219
227
|
return a.set(e, n), n;
|
|
220
228
|
}
|
|
221
229
|
};
|
|
222
230
|
}
|
|
223
231
|
//#endregion
|
|
224
232
|
//#region src/utils/isToggleEnabled.js
|
|
225
|
-
function
|
|
233
|
+
function f(e, t, n = !0) {
|
|
226
234
|
if (!e?.getAttribute) return n;
|
|
227
235
|
let r = `data-${t}`, i = e.getAttribute(t) ?? e.getAttribute(r);
|
|
228
236
|
return i === null ? n : String(i).toLowerCase() !== "false";
|
|
229
237
|
}
|
|
230
238
|
//#endregion
|
|
231
239
|
//#region src/utils/matchHandle.js
|
|
232
|
-
function
|
|
240
|
+
function p(e, n) {
|
|
233
241
|
let r = n?.closestDraggable?.(e) || e?.closest?.(`[${t.dragAttr}], [${t.dragdropAttr}]`);
|
|
234
242
|
if (!r) return;
|
|
235
|
-
let i =
|
|
243
|
+
let i = f(r, t.rotatableAttr, !0), a = f(r, t.resizableAttr, !0);
|
|
236
244
|
if (i && (r.hasAttribute(t.handleRotateAttr) || r.querySelector?.(`[${t.handleRotateAttr}]`)) || a && (r.hasAttribute(t.handleResizeAttr) || r.querySelector?.(`[${t.handleResizeAttr}]`))) {
|
|
237
245
|
let n = (i ? e.closest?.(`[${t.handleRotateAttr}]`) : null) || (a ? e.closest?.(`[${t.handleResizeAttr}]`) : null);
|
|
238
246
|
return n && r.contains(n) ? n : r;
|
|
@@ -245,12 +253,19 @@ function d(e, n) {
|
|
|
245
253
|
}
|
|
246
254
|
//#endregion
|
|
247
255
|
//#region src/utils/isHTMLElement.js
|
|
248
|
-
function
|
|
256
|
+
function m(e) {
|
|
249
257
|
return e && typeof e == "object" && e.nodeType === 1;
|
|
250
258
|
}
|
|
251
259
|
//#endregion
|
|
252
|
-
//#region src/
|
|
253
|
-
|
|
260
|
+
//#region src/utils/isIgnoreClick.js
|
|
261
|
+
function h(e) {
|
|
262
|
+
if (!m(e)) return !1;
|
|
263
|
+
let n = t.ignoreClickAttr, r = `data-${n}`;
|
|
264
|
+
return !!(e.closest?.(`[${n}], [${r}]`) || e.hasAttribute?.(n) || e.hasAttribute?.(r));
|
|
265
|
+
}
|
|
266
|
+
//#endregion
|
|
267
|
+
//#region src/utils/scopeHelpers.js
|
|
268
|
+
var g = t.dragScopeAttr, _ = `[${g}], [data-${g}]`, v = class {
|
|
254
269
|
#e = 0;
|
|
255
270
|
#t = /* @__PURE__ */ new WeakMap();
|
|
256
271
|
#n = /* @__PURE__ */ new WeakMap();
|
|
@@ -319,7 +334,7 @@ var p = class {
|
|
|
319
334
|
o = o.parentElement;
|
|
320
335
|
}
|
|
321
336
|
}
|
|
322
|
-
},
|
|
337
|
+
}, y = class {
|
|
323
338
|
#e = !1;
|
|
324
339
|
#t = !1;
|
|
325
340
|
#n = 0;
|
|
@@ -350,7 +365,7 @@ var p = class {
|
|
|
350
365
|
this.#e = !1, this.#n = 0;
|
|
351
366
|
}
|
|
352
367
|
};
|
|
353
|
-
},
|
|
368
|
+
}, b = class {
|
|
354
369
|
#e;
|
|
355
370
|
#t = new AbortController();
|
|
356
371
|
#n = !1;
|
|
@@ -417,7 +432,7 @@ var p = class {
|
|
|
417
432
|
reason: e.type
|
|
418
433
|
}), this.#d(), e.preventDefault?.());
|
|
419
434
|
};
|
|
420
|
-
},
|
|
435
|
+
}, ee = class {
|
|
421
436
|
scrolled = !1;
|
|
422
437
|
now = 0;
|
|
423
438
|
classOps = /* @__PURE__ */ new Map();
|
|
@@ -455,7 +470,7 @@ var p = class {
|
|
|
455
470
|
for (let [t, n] of this.styleOps) if (!e || !this.removeOps.has(t)) for (let [e, r] of n) r == null ? e.includes("-") ? t?.style?.removeProperty?.(e) : t?.style && (t.style[e] = "") : e.includes("-") ? t?.style?.setProperty?.(e, String(r)) : t?.style && (t.style[e] = r);
|
|
456
471
|
for (let e of this.fnOps) e?.();
|
|
457
472
|
}
|
|
458
|
-
},
|
|
473
|
+
}, te = class {
|
|
459
474
|
#e = [];
|
|
460
475
|
use(e, t) {
|
|
461
476
|
e && (this.#e.push(e), this.#e.sort((e, t) => (e.order ?? 0) - (t.order ?? 0)), e.onAttach?.(t));
|
|
@@ -492,7 +507,7 @@ var p = class {
|
|
|
492
507
|
onDestroy(e, t) {
|
|
493
508
|
for (let n of this.#e) n.onDestroy?.(e, t);
|
|
494
509
|
}
|
|
495
|
-
},
|
|
510
|
+
}, ne = class {
|
|
496
511
|
#e;
|
|
497
512
|
#t;
|
|
498
513
|
constructor({ store: e, session: t } = {}) {
|
|
@@ -567,18 +582,18 @@ var p = class {
|
|
|
567
582
|
}
|
|
568
583
|
}
|
|
569
584
|
resetSession({ ended: e } = { ended: !1 }) {
|
|
570
|
-
let t = this.#e, n = this.#t, r =
|
|
585
|
+
let t = this.#e, n = this.#t, r = u(t);
|
|
571
586
|
return r.adapter = n?.adapter, e && (r.suppressNextClick = !0, r.lastDragTs = performance.now()), this.#t = r, r;
|
|
572
587
|
}
|
|
573
|
-
},
|
|
588
|
+
}, re = class extends e {
|
|
574
589
|
#e = new AbortController();
|
|
575
590
|
#t;
|
|
576
591
|
#n;
|
|
577
|
-
#r = new
|
|
578
|
-
#i = new
|
|
592
|
+
#r = new v();
|
|
593
|
+
#i = new ee();
|
|
579
594
|
#a = { selectedByNs: /* @__PURE__ */ new Map() };
|
|
580
595
|
#o;
|
|
581
|
-
#s = new
|
|
596
|
+
#s = new te();
|
|
582
597
|
#c;
|
|
583
598
|
#l;
|
|
584
599
|
canDrop = () => !0;
|
|
@@ -590,12 +605,12 @@ var p = class {
|
|
|
590
605
|
return this.#o?.session;
|
|
591
606
|
}
|
|
592
607
|
constructor(e = {}) {
|
|
593
|
-
super(), this.#n = { threshold: e.threshold ??
|
|
594
|
-
let t =
|
|
595
|
-
t.threshold = this.#n.threshold, t.adapter = this.#r, this.#o = new
|
|
608
|
+
super(), this.#n = { threshold: e.threshold ?? a.DRAG_START };
|
|
609
|
+
let t = u(this.#a);
|
|
610
|
+
t.threshold = this.#n.threshold, t.adapter = this.#r, this.#o = new ne({
|
|
596
611
|
store: this.#a,
|
|
597
612
|
session: t
|
|
598
|
-
}), this.#c = new
|
|
613
|
+
}), this.#c = new y(this.#m), this.#l = new b({
|
|
599
614
|
onDown: this.#d,
|
|
600
615
|
onMove: this.#f,
|
|
601
616
|
onUp: this.#p
|
|
@@ -617,7 +632,7 @@ var p = class {
|
|
|
617
632
|
destroy() {
|
|
618
633
|
this.#e.abort(), this.#l.destroy(), this.#c.cancel();
|
|
619
634
|
let e = this.#o.session;
|
|
620
|
-
e?.active && (this.#s.onEnd(
|
|
635
|
+
e?.active && (this.#s.onEnd(d({
|
|
621
636
|
dnd: this,
|
|
622
637
|
session: e,
|
|
623
638
|
store: this.#a,
|
|
@@ -638,40 +653,40 @@ var p = class {
|
|
|
638
653
|
};
|
|
639
654
|
#d = (e) => {
|
|
640
655
|
if (!this.#t || e.button !== 0) return { accepted: !1 };
|
|
641
|
-
let n =
|
|
656
|
+
let n = p(e.target, this.#r);
|
|
642
657
|
if (!n) return { accepted: !1 };
|
|
643
658
|
let r = this.#r.closestDraggable(n);
|
|
644
659
|
if (!r) return { accepted: !1 };
|
|
645
660
|
e.preventDefault(), e.target?.setPointerCapture?.(e.pointerId);
|
|
646
|
-
let i = this.#r.getNamespace(r), a = this.#r.closestDrop(r),
|
|
661
|
+
let i = this.#r.getNamespace(r), a = this.#r.closestDrop(r), o = r.getBoundingClientRect(), s = c(this.#r.getAttr(r, t.dataAttr));
|
|
647
662
|
if (!this.#o.dispatch({
|
|
648
663
|
type: "DOWN",
|
|
649
664
|
pointerId: e.pointerId,
|
|
650
665
|
x: e.clientX,
|
|
651
666
|
y: e.clientY,
|
|
652
667
|
namespace: i,
|
|
653
|
-
data:
|
|
668
|
+
data: s,
|
|
654
669
|
sourceEl: r,
|
|
655
670
|
handleEl: n,
|
|
656
671
|
originDrop: a,
|
|
657
672
|
isDragScope: !!this.#r.closestDragScope(r),
|
|
658
673
|
isCopy: !!this.#r.getAttr(r, t.copyAttr),
|
|
659
|
-
mirrorOffsetX: e.clientX -
|
|
660
|
-
mirrorOffsetY: e.clientY -
|
|
674
|
+
mirrorOffsetX: e.clientX - o.left,
|
|
675
|
+
mirrorOffsetY: e.clientY - o.top
|
|
661
676
|
})?.accepted) return { accepted: !1 };
|
|
662
|
-
let
|
|
663
|
-
|
|
664
|
-
let
|
|
677
|
+
let l = this.#o.session;
|
|
678
|
+
l.threshold = this.#n.threshold, l.adapter = this.#r, this.#i.reset(performance.now()), this.#r.beginFrame(), l.cache.frameId = this.#r.frameId;
|
|
679
|
+
let u = d({
|
|
665
680
|
dnd: this,
|
|
666
|
-
session:
|
|
681
|
+
session: l,
|
|
667
682
|
store: this.#a,
|
|
668
683
|
frame: this.#i,
|
|
669
684
|
adapter: this.#r
|
|
670
685
|
});
|
|
671
|
-
return this.#s.onDown(
|
|
686
|
+
return this.#s.onDown(u, e), this.#i.commit(), this.#r.endFrame(), {
|
|
672
687
|
accepted: !0,
|
|
673
688
|
pointerId: e.pointerId,
|
|
674
|
-
signal:
|
|
689
|
+
signal: l.dragAbort.signal
|
|
675
690
|
};
|
|
676
691
|
};
|
|
677
692
|
#f = ({ pointerId: e, x: t, y: n }) => {
|
|
@@ -684,14 +699,14 @@ var p = class {
|
|
|
684
699
|
if (!r?.handled) return;
|
|
685
700
|
let i = this.#o.session;
|
|
686
701
|
if (r.startedNow) {
|
|
687
|
-
let e =
|
|
702
|
+
let e = d({
|
|
688
703
|
dnd: this,
|
|
689
704
|
session: i,
|
|
690
705
|
store: this.#a,
|
|
691
706
|
frame: this.#i,
|
|
692
707
|
adapter: this.#r
|
|
693
708
|
});
|
|
694
|
-
this.#s.onStart(e), this.emit("dragstart",
|
|
709
|
+
this.#s.onStart(e), this.emit("dragstart", l("dragstart", i));
|
|
695
710
|
}
|
|
696
711
|
r.started && this.#c.request();
|
|
697
712
|
};
|
|
@@ -706,7 +721,7 @@ var p = class {
|
|
|
706
721
|
"pointerId" in e && e.target?.releasePointerCapture?.(e.pointerId);
|
|
707
722
|
let a = !!r.ended;
|
|
708
723
|
this.#r.beginFrame(), i.cache.frameId = this.#r.frameId, i.currentDrop = this.#r.hitDrop(i.x, i.y, i.namespace, i.sourceEl), i.currentDropRect = i.currentDrop ? this.#r.measureRect(i.currentDrop) : void 0, this.#r.endFrame();
|
|
709
|
-
let o =
|
|
724
|
+
let o = d({
|
|
710
725
|
dnd: this,
|
|
711
726
|
session: i,
|
|
712
727
|
store: this.#a,
|
|
@@ -717,16 +732,16 @@ var p = class {
|
|
|
717
732
|
ended: a,
|
|
718
733
|
reason: n || "pointerup"
|
|
719
734
|
});
|
|
720
|
-
let
|
|
735
|
+
let s = l(a ? "drop" : "cancel", i);
|
|
721
736
|
i.dragAbort?.abort(), i.dragAbort = void 0, this.#c.cancel();
|
|
722
|
-
let
|
|
723
|
-
|
|
737
|
+
let c = this.#o.resetSession({ ended: a });
|
|
738
|
+
c.adapter = this.#r, a ? this.emit("drop", s) : this.emit("cancel", s), e.preventDefault?.();
|
|
724
739
|
};
|
|
725
740
|
#m = (e) => {
|
|
726
741
|
let t = this.#o.session;
|
|
727
742
|
if (!t.active || !t.started) return !1;
|
|
728
743
|
this.#i.reset(e), this.#r.beginFrame(), t.cache.frameId = this.#r.frameId;
|
|
729
|
-
let n =
|
|
744
|
+
let n = d({
|
|
730
745
|
dnd: this,
|
|
731
746
|
session: t,
|
|
732
747
|
store: this.#a,
|
|
@@ -735,12 +750,16 @@ var p = class {
|
|
|
735
750
|
}), r = !1;
|
|
736
751
|
return t.dirty &&= (this.#s.onMeasure(n), this.#s.onCompute(n), this.emit("drag", n.payload("drag")), this.#s.onCommit(n), this.#i.commit(), this.#i.scrolled && (r = !0), !1), this.#s.onAfterDrag(n) && (r = !0), r && (t.dirty = !0), this.#r.endFrame(), t.dirty || r;
|
|
737
752
|
};
|
|
738
|
-
},
|
|
753
|
+
}, x = class {
|
|
739
754
|
order = 10;
|
|
740
755
|
onMeasure(e) {
|
|
741
756
|
let t = e.session;
|
|
742
757
|
if (!t.active || !t.started) return;
|
|
743
758
|
let n = e.adapter.hitDrop(t.x, t.y, t.namespace, t.sourceEl);
|
|
759
|
+
if (n && t.sourceEl && e.adapter.isDrop(t.sourceEl)) {
|
|
760
|
+
let r = e.adapter.measureRect(t.sourceEl);
|
|
761
|
+
r && t.x >= r.left && t.x <= r.right && t.y >= r.top && t.y <= r.bottom && (n = void 0);
|
|
762
|
+
}
|
|
744
763
|
if (n !== t.currentDrop && (t.currentDrop = n, t.cache && (t.cache.dropRectDirty = !0)), !n) {
|
|
745
764
|
t.currentDropRect = void 0, t.cache && (t.cache.dropRectDirty = !1);
|
|
746
765
|
return;
|
|
@@ -769,18 +788,18 @@ var p = class {
|
|
|
769
788
|
let t = e.session;
|
|
770
789
|
if (!t?.active || !t?.started) return;
|
|
771
790
|
let r = t.cache ||= {}, i = r._dropClassEl, a = t.currentDrop;
|
|
772
|
-
|
|
791
|
+
m(i) && i !== a && (e.frame.toggleClass(i, n.canDrop, !1), e.frame.toggleClass(i, n.noDrop, !1)), m(a) && (e.frame.toggleClass(a, n.canDrop, !!t.currentAllowed), e.frame.toggleClass(a, n.noDrop, !t.currentAllowed)), r._dropClassEl = a;
|
|
773
792
|
}
|
|
774
793
|
onEnd(e) {
|
|
775
794
|
let t = e?.session;
|
|
776
795
|
if (!t) return;
|
|
777
796
|
let r = t.cache?._dropClassEl;
|
|
778
|
-
|
|
797
|
+
m(r) && r.classList.remove(n.canDrop, n.noDrop), t.cache && (t.cache._dropClassEl = void 0);
|
|
779
798
|
}
|
|
780
799
|
onDestroy(e, t) {
|
|
781
800
|
this.onEnd({ session: t });
|
|
782
801
|
}
|
|
783
|
-
},
|
|
802
|
+
}, S = class {
|
|
784
803
|
order = 0;
|
|
785
804
|
onStart = (e) => {
|
|
786
805
|
let r = e?.session;
|
|
@@ -806,20 +825,20 @@ var p = class {
|
|
|
806
825
|
onDestroy = (e, t) => {
|
|
807
826
|
this.onEnd({ session: t });
|
|
808
827
|
};
|
|
809
|
-
},
|
|
810
|
-
function
|
|
828
|
+
}, C = /(auto|scroll|overlay)/i;
|
|
829
|
+
function w(e) {
|
|
811
830
|
if (!(e instanceof HTMLElement)) return !1;
|
|
812
|
-
let t = getComputedStyle(e), n =
|
|
813
|
-
return
|
|
831
|
+
let t = getComputedStyle(e), n = C.test(t.overflowY) && e.scrollHeight > e.clientHeight + 1;
|
|
832
|
+
return C.test(t.overflowX) && e.scrollWidth > e.clientWidth + 1 || n;
|
|
814
833
|
}
|
|
815
|
-
function
|
|
834
|
+
function T(e) {
|
|
816
835
|
let t = e;
|
|
817
836
|
for (; t;) {
|
|
818
|
-
if (
|
|
837
|
+
if (w(t)) return t;
|
|
819
838
|
t = t.parentElement;
|
|
820
839
|
}
|
|
821
840
|
}
|
|
822
|
-
function
|
|
841
|
+
function E(e, t, n, r) {
|
|
823
842
|
return e < t + r ? {
|
|
824
843
|
dir: -1,
|
|
825
844
|
k: (t + r - e) / r
|
|
@@ -831,15 +850,15 @@ function T(e, t, n, r) {
|
|
|
831
850
|
k: 0
|
|
832
851
|
};
|
|
833
852
|
}
|
|
834
|
-
var
|
|
853
|
+
var D = class {
|
|
835
854
|
order = 1e4;
|
|
836
855
|
constructor(e = {}) {
|
|
837
|
-
this.edge = e.edge ??
|
|
856
|
+
this.edge = e.edge ?? o.EDGE, this.minSpeed = e.minSpeed ?? o.MIN_SPEED, this.maxSpeed = e.maxSpeed ?? o.MAX_SPEED, this.allowWindowScroll = e.allowWindowScroll ?? !0;
|
|
838
857
|
}
|
|
839
858
|
onAfterDrag = (e) => {
|
|
840
859
|
let t = e.session;
|
|
841
860
|
if (!t.active || !t.started) return !1;
|
|
842
|
-
let n = t.currentDrop ?
|
|
861
|
+
let n = t.currentDrop ? T(t.currentDrop) : void 0, r = !1;
|
|
843
862
|
if (!n && this.allowWindowScroll && (n = document.scrollingElement || document.documentElement, r = !!n), !n) return !1;
|
|
844
863
|
let i = e.frame.now, a = t.cache.autoScrollLastTs || 0, o = a ? Math.max(8, Math.min(64, i - a)) : 16.67;
|
|
845
864
|
t.cache && (t.cache.autoScrollLastTs = i);
|
|
@@ -848,7 +867,7 @@ var ee = class {
|
|
|
848
867
|
top: 0,
|
|
849
868
|
right: innerWidth,
|
|
850
869
|
bottom: innerHeight
|
|
851
|
-
} : e.adapter.measureRect(n), c = t.x, l = t.y, u =
|
|
870
|
+
} : e.adapter.measureRect(n), c = t.x, l = t.y, u = E(c, s.left, s.right, this.edge), d = E(l, s.top, s.bottom, this.edge), f = (e) => this.minSpeed + (this.maxSpeed - this.minSpeed) * e, p = u.dir ? u.dir * f(u.k) * o / 1e3 : 0, m = d.dir ? d.dir * f(d.k) * o / 1e3 : 0;
|
|
852
871
|
if (!p && !m) return !1;
|
|
853
872
|
let h = n.scrollTop, g = n.scrollLeft;
|
|
854
873
|
r ? window.scrollBy(p, m) : n.scrollBy({
|
|
@@ -863,22 +882,22 @@ var ee = class {
|
|
|
863
882
|
let t = e?.session;
|
|
864
883
|
t?.cache && (t.cache.autoScrollLastTs = 0);
|
|
865
884
|
};
|
|
866
|
-
},
|
|
885
|
+
}, O = {
|
|
867
886
|
top: n.indicatorTop,
|
|
868
887
|
right: n.indicatorRight,
|
|
869
888
|
bottom: n.indicatorBottom,
|
|
870
889
|
left: n.indicatorLeft
|
|
871
|
-
},
|
|
890
|
+
}, k = Object.values(O), ie = new Set([
|
|
872
891
|
"top",
|
|
873
892
|
"right",
|
|
874
893
|
"bottom",
|
|
875
894
|
"left"
|
|
876
895
|
]);
|
|
877
|
-
function
|
|
878
|
-
|
|
896
|
+
function A(e, t, n, r) {
|
|
897
|
+
m(t) && (e.frame.toggleClass ? e.frame.toggleClass(t, n, !!r) : t.classList.toggle(n, !!r));
|
|
879
898
|
}
|
|
880
|
-
function
|
|
881
|
-
if (!
|
|
899
|
+
function ae(e) {
|
|
900
|
+
if (!m(e)) return;
|
|
882
901
|
let n = t?.dropIndicatorAttr || "drop-indicator", r = `data-${n}`, i;
|
|
883
902
|
if (e.hasAttribute?.(n)) i = e.getAttribute?.(n);
|
|
884
903
|
else if (e.hasAttribute?.(r)) i = e.getAttribute?.(r);
|
|
@@ -888,70 +907,58 @@ function A(e) {
|
|
|
888
907
|
let o = /* @__PURE__ */ new Set();
|
|
889
908
|
for (let e of a.split(/[,\s]+/)) {
|
|
890
909
|
let t = (e || "").trim().toLowerCase();
|
|
891
|
-
|
|
910
|
+
ie.has(t) && o.add(t);
|
|
892
911
|
}
|
|
893
912
|
return o.size ? o : void 0;
|
|
894
913
|
}
|
|
895
|
-
function
|
|
914
|
+
function oe(e) {
|
|
896
915
|
let t = e.session, r = e.dnd?.root?.ownerDocument || document, i = t.indicatorEl;
|
|
897
|
-
|
|
916
|
+
m(i) || (i = r.createElement("div"), i.classList.add(n.dropIndicator), t.indicatorEl = i);
|
|
898
917
|
let a = t.currentDrop || e.dnd?.root || r.body;
|
|
899
|
-
return
|
|
918
|
+
return m(a) && i.parentNode !== a && a.appendChild(i), i;
|
|
900
919
|
}
|
|
901
|
-
function
|
|
920
|
+
function se(e) {
|
|
902
921
|
if (!e.currentDrop || !e.currentDropRect) return;
|
|
903
|
-
let t =
|
|
922
|
+
let t = s(e);
|
|
904
923
|
if (t.isOverLeft()) return "left";
|
|
905
924
|
if (t.isOverRight()) return "right";
|
|
906
925
|
if (t.isOverTop()) return "top";
|
|
907
926
|
if (t.isOverBottom()) return "bottom";
|
|
908
927
|
}
|
|
909
|
-
function
|
|
928
|
+
function ce(e) {
|
|
910
929
|
let t = e.session;
|
|
911
|
-
|
|
912
|
-
if (typeof t.currentAllowed == "boolean") return t.currentAllowed;
|
|
913
|
-
let n = e.dnd?.canDrop;
|
|
914
|
-
if (typeof n != "function") return !0;
|
|
915
|
-
try {
|
|
916
|
-
return !!n(e.payload("drag"));
|
|
917
|
-
} catch {
|
|
918
|
-
return !1;
|
|
919
|
-
}
|
|
930
|
+
return t.currentDrop ? typeof t.currentAllowed == "boolean" ? t.currentAllowed : !0 : !1;
|
|
920
931
|
}
|
|
921
|
-
var
|
|
932
|
+
var le = class {
|
|
922
933
|
order = 40;
|
|
923
934
|
onCommit(e) {
|
|
924
935
|
let t = e.session;
|
|
925
936
|
if (!t?.active || !t?.started) return;
|
|
926
|
-
let r = t.currentDrop, i =
|
|
937
|
+
let r = t.currentDrop, i = ae(r);
|
|
927
938
|
if (!i) {
|
|
928
939
|
let r = t.indicatorEl;
|
|
929
|
-
if (
|
|
930
|
-
|
|
931
|
-
for (let t of
|
|
940
|
+
if (m(r)) {
|
|
941
|
+
A(e, r, n.dropIndicatorActive, !1);
|
|
942
|
+
for (let t of k) A(e, r, t, !1);
|
|
932
943
|
}
|
|
933
944
|
t.indicatorRegion = void 0;
|
|
934
945
|
return;
|
|
935
946
|
}
|
|
936
|
-
let a =
|
|
937
|
-
if (
|
|
938
|
-
else for (let t of
|
|
947
|
+
let a = oe(e), o = ce(e), s = se(t), c = i === "all" || s && i.has(s) ? s : void 0, l = !!(r && t.currentDropRect && o && c);
|
|
948
|
+
if (A(e, a, n.dropIndicatorActive, l), t.indicatorRegion = l ? c : void 0, l) for (let [t, n] of Object.entries(O)) A(e, a, n, t === c);
|
|
949
|
+
else for (let t of k) A(e, a, t, !1);
|
|
939
950
|
}
|
|
940
951
|
onEnd(e) {
|
|
941
952
|
let t = e.session;
|
|
942
|
-
t && (t.lastIndicatorRegion = t.indicatorRegion ?? "inside",
|
|
953
|
+
t && (t.lastIndicatorRegion = t.indicatorRegion ?? "inside", m(t.indicatorEl) && t.indicatorEl.remove(), t.indicatorEl = void 0, t.indicatorRegion = void 0);
|
|
943
954
|
}
|
|
944
955
|
onDestroy(e, t) {
|
|
945
956
|
this.onEnd({ session: t });
|
|
946
957
|
}
|
|
947
|
-
},
|
|
948
|
-
|
|
949
|
-
let n = t.ignoreClickAttr, r = `data-${n}`;
|
|
950
|
-
return !!(e.closest?.(`[${n}], [${r}]`) || e.hasAttribute?.(n) || e.hasAttribute?.(r));
|
|
951
|
-
}, P = "draggable-dot-wrap", F = "draggable-dot", I = "draggable-rotate", L = t.dragScopeAttr, re = `[${L}], [data-${L}]`;
|
|
952
|
-
function ie(e, n = {}) {
|
|
958
|
+
}, j = "draggable-dot-wrap", M = "draggable-dot", N = "draggable-rotate";
|
|
959
|
+
function P(e, n = {}) {
|
|
953
960
|
let { resizable: r = !0, rotatable: i = !0 } = n, a = e.createElement("div");
|
|
954
|
-
if (a.classList.add(
|
|
961
|
+
if (a.classList.add(j), a.dataset.resizable = String(r), a.dataset.rotatable = String(i), r) for (let [n, r] of [
|
|
955
962
|
["nw", "tl"],
|
|
956
963
|
["n", "tm"],
|
|
957
964
|
["ne", "tr"],
|
|
@@ -962,63 +969,83 @@ function ie(e, n = {}) {
|
|
|
962
969
|
["w", "lm"]
|
|
963
970
|
]) {
|
|
964
971
|
let i = e.createElement("div");
|
|
965
|
-
i.classList.add(
|
|
972
|
+
i.classList.add(M), i.setAttribute(t.handleResizeAttr, ""), i.dataset.dir = n, i.dataset.pos = r, a.appendChild(i);
|
|
966
973
|
}
|
|
967
974
|
if (i) {
|
|
968
975
|
let n = e.createElement("div");
|
|
969
|
-
n.classList.add(
|
|
976
|
+
n.classList.add(N), n.setAttribute(t.handleRotateAttr, ""), n.dataset.dir = "rotate", a.appendChild(n);
|
|
970
977
|
}
|
|
971
978
|
return a;
|
|
972
979
|
}
|
|
973
|
-
function
|
|
974
|
-
|
|
980
|
+
function F(e) {
|
|
981
|
+
m(e) && e.querySelector?.(`.${j}`)?.remove();
|
|
975
982
|
}
|
|
976
|
-
function
|
|
977
|
-
if (!
|
|
978
|
-
let n = !!e.closest?.(
|
|
983
|
+
function I(e) {
|
|
984
|
+
if (!m(e)) return;
|
|
985
|
+
let n = !!e.closest?.(_), r = e.querySelector?.(".draggable-dot-wrap") || null, i = !!r, a = f(e, t.resizableAttr, !0), o = f(e, t.rotatableAttr, !0), s = a || o;
|
|
979
986
|
if (!n) {
|
|
980
|
-
i &&
|
|
987
|
+
i && F(e);
|
|
981
988
|
return;
|
|
982
989
|
}
|
|
983
990
|
if (!s) {
|
|
984
|
-
i &&
|
|
991
|
+
i && F(e);
|
|
985
992
|
return;
|
|
986
993
|
}
|
|
987
994
|
if (r && (String(r.dataset?.resizable) !== String(a) || String(r.dataset?.rotatable) !== String(o)) && (r.remove(), r = null, i = !1), !i) {
|
|
988
995
|
let t = getComputedStyle(e).position;
|
|
989
|
-
(t === "static" || !t) && (e.style.position = "relative"), e.appendChild(
|
|
996
|
+
(t === "static" || !t) && (e.style.position = "relative"), e.appendChild(P(e.ownerDocument || document, {
|
|
990
997
|
resizable: a,
|
|
991
998
|
rotatable: o
|
|
992
999
|
}));
|
|
993
1000
|
}
|
|
994
1001
|
}
|
|
995
|
-
function
|
|
1002
|
+
function L(e, t, r, i) {
|
|
996
1003
|
let a = t.get(i);
|
|
997
|
-
a && a !== r
|
|
1004
|
+
if (a && a !== r) if (Array.isArray(a)) for (let e of a) e?.classList?.remove?.(n.active), F(e);
|
|
1005
|
+
else a.classList.remove(n.active), F(a);
|
|
1006
|
+
r.classList.add(n.active), I(r), t.set(i, r);
|
|
1007
|
+
}
|
|
1008
|
+
function R(e, t, r) {
|
|
1009
|
+
let i = e.get(r);
|
|
1010
|
+
if (i) if (Array.isArray(i)) for (let e of i) e?.classList?.remove?.(n.active), F(e);
|
|
1011
|
+
else i.classList.remove(n.active), F(i);
|
|
1012
|
+
for (let e of t) e.classList.add(n.active), I(e);
|
|
1013
|
+
e.set(r, t);
|
|
998
1014
|
}
|
|
999
|
-
function
|
|
1000
|
-
|
|
1015
|
+
function z(e, t) {
|
|
1016
|
+
if (t !== void 0) {
|
|
1017
|
+
let r = e.get(t);
|
|
1018
|
+
if (r) {
|
|
1019
|
+
if (Array.isArray(r)) for (let e of r) e?.classList?.remove?.(n.active), F(e);
|
|
1020
|
+
else r?.classList?.remove?.(n.active), F(r);
|
|
1021
|
+
e.delete(t);
|
|
1022
|
+
}
|
|
1023
|
+
return;
|
|
1024
|
+
}
|
|
1025
|
+
for (let t of e.values()) if (Array.isArray(t)) for (let e of t) e?.classList?.remove?.(n.active), F(e);
|
|
1026
|
+
else t?.classList?.remove?.(n.active), F(t);
|
|
1001
1027
|
e.clear();
|
|
1002
1028
|
}
|
|
1003
|
-
var
|
|
1029
|
+
var B = class {
|
|
1004
1030
|
order = -50;
|
|
1005
1031
|
#e;
|
|
1006
1032
|
onAttach(e) {
|
|
1007
1033
|
this.#e = e;
|
|
1008
1034
|
}
|
|
1009
1035
|
onRootChange(e, t, n) {
|
|
1010
|
-
if (!
|
|
1036
|
+
if (!m(e)) return;
|
|
1011
1037
|
let r = this.#e.monitor;
|
|
1012
1038
|
e.addEventListener("pointerdown", (e) => {
|
|
1013
|
-
if (e.button !== 0 ||
|
|
1039
|
+
if (e.button !== 0 || h(e.target)) return;
|
|
1014
1040
|
let t = r.selectedByNs;
|
|
1015
1041
|
if (!t) return;
|
|
1016
1042
|
let n = r.adapter.closestDraggable(e.target);
|
|
1017
1043
|
if (!n) {
|
|
1018
|
-
|
|
1044
|
+
z(t);
|
|
1019
1045
|
return;
|
|
1020
1046
|
}
|
|
1021
|
-
|
|
1047
|
+
let i = r.adapter.getNamespace(n), a = t.get(i);
|
|
1048
|
+
Array.isArray(a) && a.length > 1 && a.includes(n) || L(null, t, n, i);
|
|
1022
1049
|
}, {
|
|
1023
1050
|
capture: !0,
|
|
1024
1051
|
signal: n
|
|
@@ -1026,26 +1053,93 @@ var H = class {
|
|
|
1026
1053
|
}
|
|
1027
1054
|
onDown(e, t) {
|
|
1028
1055
|
let r = e?.session;
|
|
1029
|
-
if (!r?.sourceEl || t?.button !== 0 ||
|
|
1056
|
+
if (!r?.sourceEl || t?.button !== 0 || h(t.target)) return;
|
|
1030
1057
|
let i = e.store?.selectedByNs || r.selectedByNs;
|
|
1031
1058
|
if (!i) return;
|
|
1032
1059
|
let a = r.namespace || e.adapter.getNamespace(r.sourceEl), o = i.get(a);
|
|
1033
|
-
o && o
|
|
1060
|
+
Array.isArray(o) && o.length > 1 && o.includes(r.sourceEl) || (o && o !== r.sourceEl && (Array.isArray(o) ? o.forEach((t) => {
|
|
1061
|
+
e.frame.toggleClass(t, n.active, !1), F(t);
|
|
1062
|
+
}) : (e.frame.toggleClass(o, n.active, !1), F(o))), e.frame.toggleClass(r.sourceEl, n.active, !0), I(r.sourceEl), i.set(a, r.sourceEl));
|
|
1034
1063
|
}
|
|
1035
1064
|
onDestroy(e, t) {
|
|
1036
1065
|
let n = t?.selectedByNs;
|
|
1037
|
-
n &&
|
|
1066
|
+
n && z(n);
|
|
1038
1067
|
}
|
|
1039
1068
|
};
|
|
1040
1069
|
//#endregion
|
|
1041
|
-
//#region src/services/
|
|
1042
|
-
function
|
|
1070
|
+
//#region src/services/MarqueeSelectionService.js
|
|
1071
|
+
function V(e, t, n, r) {
|
|
1072
|
+
return {
|
|
1073
|
+
left: Math.min(e, n),
|
|
1074
|
+
right: Math.max(e, n),
|
|
1075
|
+
top: Math.min(t, r),
|
|
1076
|
+
bottom: Math.max(t, r),
|
|
1077
|
+
width: Math.abs(n - e),
|
|
1078
|
+
height: Math.abs(r - t)
|
|
1079
|
+
};
|
|
1080
|
+
}
|
|
1081
|
+
function H(e, t) {
|
|
1082
|
+
let n = Math.max(e.left, t.left), r = Math.min(e.right, t.right), i = Math.max(e.top, t.top), a = Math.min(e.bottom, t.bottom), o = r - n, s = a - i;
|
|
1083
|
+
return o <= 0 || s <= 0 ? !1 : o * s > (t.right - t.left) * (t.bottom - t.top) * .5;
|
|
1084
|
+
}
|
|
1085
|
+
var U = class {
|
|
1086
|
+
order = -40;
|
|
1087
|
+
#e;
|
|
1088
|
+
onAttach(e) {
|
|
1089
|
+
this.#e = e;
|
|
1090
|
+
}
|
|
1091
|
+
onRootChange(e, t, n) {
|
|
1092
|
+
m(e) && e.addEventListener("pointerdown", (e) => {
|
|
1093
|
+
if (e.button !== 0 || h(e.target)) return;
|
|
1094
|
+
let t = e.target.closest(_);
|
|
1095
|
+
t && (this.#e.monitor.adapter.closestDraggable(e.target) || this.#t(t, e));
|
|
1096
|
+
}, {
|
|
1097
|
+
capture: !0,
|
|
1098
|
+
signal: n
|
|
1099
|
+
});
|
|
1100
|
+
}
|
|
1101
|
+
#t(e, r) {
|
|
1102
|
+
let i = r.clientX, o = r.clientY, s = this.#e.monitor.adapter.getNamespace(e), c = parseFloat(e.getAttribute(t.scaleRatioAttr) || "1"), l = document.createElement("div");
|
|
1103
|
+
l.classList.add(n.marquee), e.appendChild(l);
|
|
1104
|
+
let u = !1, d = (t) => {
|
|
1105
|
+
let n = t.clientX - i, r = t.clientY - o;
|
|
1106
|
+
if (!u && Math.abs(n) < a.MARQUEE_MOVE && Math.abs(r) < a.MARQUEE_MOVE) return;
|
|
1107
|
+
u = !0;
|
|
1108
|
+
let d = V(i, o, t.clientX, t.clientY);
|
|
1109
|
+
this.#n(l, d, e, c);
|
|
1110
|
+
let f = this.#r(e, s, d), p = this.#e.monitor.selectedByNs;
|
|
1111
|
+
p && (z(p, s), f.length > 0 && R(p, f, s));
|
|
1112
|
+
}, f = () => {
|
|
1113
|
+
if (l.remove(), document.removeEventListener("pointermove", d), document.removeEventListener("pointerup", f), !u) {
|
|
1114
|
+
let e = this.#e.monitor.selectedByNs;
|
|
1115
|
+
e && z(e, s);
|
|
1116
|
+
}
|
|
1117
|
+
};
|
|
1118
|
+
document.addEventListener("pointermove", d), document.addEventListener("pointerup", f);
|
|
1119
|
+
}
|
|
1120
|
+
#n(e, t, n, r) {
|
|
1121
|
+
let i = n.getBoundingClientRect(), a = (t.left - i.left) / r, o = (t.top - i.top) / r, s = t.width / r, c = t.height / r;
|
|
1122
|
+
e.style.left = `${a}px`, e.style.top = `${o}px`, e.style.width = `${s}px`, e.style.height = `${c}px`;
|
|
1123
|
+
}
|
|
1124
|
+
#r(e, n, r) {
|
|
1125
|
+
let i = this.#e.monitor.adapter, a = e.querySelectorAll(`[${t.dragAttr}], [${t.dragdropAttr}]`), o = [];
|
|
1126
|
+
for (let e of a) {
|
|
1127
|
+
if (i.getNamespace(e) !== n) continue;
|
|
1128
|
+
let t = i.measureRect(e);
|
|
1129
|
+
t && H(r, t) && o.push(e);
|
|
1130
|
+
}
|
|
1131
|
+
return o;
|
|
1132
|
+
}
|
|
1133
|
+
};
|
|
1134
|
+
//#endregion
|
|
1135
|
+
//#region src/services/transform/utils/geometry.js
|
|
1136
|
+
function W(e = 0) {
|
|
1043
1137
|
return `${Number.parseInt(String(e), 10) || 0}px`;
|
|
1044
1138
|
}
|
|
1045
|
-
function
|
|
1139
|
+
function G(e) {
|
|
1046
1140
|
return e * Math.PI / 180;
|
|
1047
1141
|
}
|
|
1048
|
-
function
|
|
1142
|
+
function ue(e, t) {
|
|
1049
1143
|
return Math.sqrt(e * e + t * t);
|
|
1050
1144
|
}
|
|
1051
1145
|
function K(e, t) {
|
|
@@ -1063,7 +1157,51 @@ function q(e, t = 1, n) {
|
|
|
1063
1157
|
width: r.width / i
|
|
1064
1158
|
};
|
|
1065
1159
|
}
|
|
1066
|
-
|
|
1160
|
+
function J(e, t, n, r) {
|
|
1161
|
+
let i = n - e, a = r - t, o = Math.atan2(a, i) * 180 / Math.PI + 90;
|
|
1162
|
+
return o = (o % 360 + 360) % 360, o;
|
|
1163
|
+
}
|
|
1164
|
+
function de(e, t, n) {
|
|
1165
|
+
let { width: r, height: i } = e;
|
|
1166
|
+
return {
|
|
1167
|
+
height: Math.abs(i),
|
|
1168
|
+
width: Math.abs(r),
|
|
1169
|
+
x: t - Math.abs(r) / 2,
|
|
1170
|
+
y: n - Math.abs(i) / 2
|
|
1171
|
+
};
|
|
1172
|
+
}
|
|
1173
|
+
function fe({ centerX: e, centerY: t, width: n, height: r, angle: i }) {
|
|
1174
|
+
return {
|
|
1175
|
+
angle: i,
|
|
1176
|
+
height: r,
|
|
1177
|
+
width: n,
|
|
1178
|
+
x: e - n / 2,
|
|
1179
|
+
y: t - r / 2
|
|
1180
|
+
};
|
|
1181
|
+
}
|
|
1182
|
+
function Y(e) {
|
|
1183
|
+
let t = getComputedStyle(e), n = {};
|
|
1184
|
+
try {
|
|
1185
|
+
n = new DOMMatrixReadOnly(t.transform);
|
|
1186
|
+
} catch {
|
|
1187
|
+
n = new DOMMatrixReadOnly();
|
|
1188
|
+
}
|
|
1189
|
+
let r = n.m41, i = n.m42, a = Number.parseFloat(t.width), o = Number.parseFloat(t.height);
|
|
1190
|
+
if (!Number.isFinite(a) || !Number.isFinite(o)) {
|
|
1191
|
+
let t = e.getBoundingClientRect();
|
|
1192
|
+
a = t.width, o = t.height;
|
|
1193
|
+
}
|
|
1194
|
+
return {
|
|
1195
|
+
angle: -Math.atan2(n.m21, n.m11) * (180 / Math.PI),
|
|
1196
|
+
height: o,
|
|
1197
|
+
width: a,
|
|
1198
|
+
x: r,
|
|
1199
|
+
y: i
|
|
1200
|
+
};
|
|
1201
|
+
}
|
|
1202
|
+
//#endregion
|
|
1203
|
+
//#region src/services/transform/utils/cursor.js
|
|
1204
|
+
var pe = {
|
|
1067
1205
|
e: "right",
|
|
1068
1206
|
n: "top",
|
|
1069
1207
|
ne: "top-right",
|
|
@@ -1072,7 +1210,7 @@ var J = {
|
|
|
1072
1210
|
se: "bottom-right",
|
|
1073
1211
|
sw: "bottom-left",
|
|
1074
1212
|
w: "left"
|
|
1075
|
-
},
|
|
1213
|
+
}, me = [
|
|
1076
1214
|
"n",
|
|
1077
1215
|
"ne",
|
|
1078
1216
|
"e",
|
|
@@ -1081,7 +1219,7 @@ var J = {
|
|
|
1081
1219
|
"sw",
|
|
1082
1220
|
"w",
|
|
1083
1221
|
"nw"
|
|
1084
|
-
],
|
|
1222
|
+
], he = {
|
|
1085
1223
|
0: 0,
|
|
1086
1224
|
1: 1,
|
|
1087
1225
|
2: 1,
|
|
@@ -1094,7 +1232,7 @@ var J = {
|
|
|
1094
1232
|
9: 6,
|
|
1095
1233
|
10: 7,
|
|
1096
1234
|
11: 7
|
|
1097
|
-
},
|
|
1235
|
+
}, ge = {
|
|
1098
1236
|
e: 2,
|
|
1099
1237
|
n: 0,
|
|
1100
1238
|
ne: 1,
|
|
@@ -1104,67 +1242,13 @@ var J = {
|
|
|
1104
1242
|
sw: 5,
|
|
1105
1243
|
w: 6
|
|
1106
1244
|
};
|
|
1107
|
-
function
|
|
1108
|
-
let n =
|
|
1109
|
-
return
|
|
1110
|
-
}
|
|
1111
|
-
function le(e) {
|
|
1112
|
-
let t = e?.querySelector?.(":scope > .draggable-dot-wrap");
|
|
1113
|
-
return t ? [...t.querySelectorAll?.(".draggable-dot") || []] : [];
|
|
1114
|
-
}
|
|
1115
|
-
function ue(e) {
|
|
1116
|
-
let t = e?.dataset?.dir;
|
|
1117
|
-
return t && J[t] || "right";
|
|
1118
|
-
}
|
|
1119
|
-
function de(e) {
|
|
1120
|
-
return !!e?.hasAttribute?.(t.handleRotateAttr);
|
|
1121
|
-
}
|
|
1122
|
-
function fe(e) {
|
|
1123
|
-
return !!e?.hasAttribute?.(t.handleResizeAttr);
|
|
1124
|
-
}
|
|
1125
|
-
function Y(e) {
|
|
1126
|
-
let t = getComputedStyle(e), n = {};
|
|
1127
|
-
try {
|
|
1128
|
-
n = new DOMMatrixReadOnly(t.transform);
|
|
1129
|
-
} catch {
|
|
1130
|
-
n = new DOMMatrixReadOnly();
|
|
1131
|
-
}
|
|
1132
|
-
let r = n.m41, i = n.m42, a = Number.parseFloat(t.width), o = Number.parseFloat(t.height);
|
|
1133
|
-
if (!Number.isFinite(a) || !Number.isFinite(o)) {
|
|
1134
|
-
let t = e.getBoundingClientRect();
|
|
1135
|
-
a = t.width, o = t.height;
|
|
1136
|
-
}
|
|
1137
|
-
return {
|
|
1138
|
-
angle: -Math.atan2(n.m21, n.m11) * (180 / Math.PI),
|
|
1139
|
-
height: o,
|
|
1140
|
-
width: a,
|
|
1141
|
-
x: r,
|
|
1142
|
-
y: i
|
|
1143
|
-
};
|
|
1144
|
-
}
|
|
1145
|
-
function X(e, t, n, r) {
|
|
1146
|
-
let i = n - e, a = r - t, o = Math.atan2(a, i) * 180 / Math.PI + 90;
|
|
1147
|
-
return o = (o % 360 + 360) % 360, o;
|
|
1245
|
+
function _e(e, t) {
|
|
1246
|
+
let n = he[Math.floor((e % 360 + 360) % 360 / 30)];
|
|
1247
|
+
return me[(ge[t] + n) % 8];
|
|
1148
1248
|
}
|
|
1149
|
-
|
|
1150
|
-
|
|
1151
|
-
|
|
1152
|
-
height: Math.abs(i),
|
|
1153
|
-
width: Math.abs(r),
|
|
1154
|
-
x: t - Math.abs(r) / 2,
|
|
1155
|
-
y: n - Math.abs(i) / 2
|
|
1156
|
-
};
|
|
1157
|
-
}
|
|
1158
|
-
function me({ centerX: e, centerY: t, width: n, height: r, angle: i }) {
|
|
1159
|
-
return {
|
|
1160
|
-
angle: i,
|
|
1161
|
-
height: r,
|
|
1162
|
-
width: n,
|
|
1163
|
-
x: e - n / 2,
|
|
1164
|
-
y: t - r / 2
|
|
1165
|
-
};
|
|
1166
|
-
}
|
|
1167
|
-
function he(e, t) {
|
|
1249
|
+
//#endregion
|
|
1250
|
+
//#region src/services/transform/utils/markline.js
|
|
1251
|
+
function ve(e, t) {
|
|
1168
1252
|
let n = {
|
|
1169
1253
|
x: [],
|
|
1170
1254
|
y: []
|
|
@@ -1204,61 +1288,63 @@ function he(e, t) {
|
|
|
1204
1288
|
});
|
|
1205
1289
|
}), n;
|
|
1206
1290
|
}
|
|
1207
|
-
function
|
|
1291
|
+
function ye(e) {
|
|
1208
1292
|
let t = e.querySelector(".draggable-markline-x"), n = e.querySelector(".draggable-markline-y");
|
|
1209
1293
|
return t || (t = document.createElement("div"), t.className = "draggable-markline-x", e.appendChild(t)), n || (n = document.createElement("div"), n.className = "draggable-markline-y", e.appendChild(n)), {
|
|
1210
1294
|
x: t,
|
|
1211
1295
|
y: n
|
|
1212
1296
|
};
|
|
1213
1297
|
}
|
|
1214
|
-
function
|
|
1298
|
+
function X(e) {
|
|
1215
1299
|
e && (e.style.display = "none");
|
|
1216
1300
|
}
|
|
1217
|
-
|
|
1301
|
+
//#endregion
|
|
1302
|
+
//#region src/services/transform/utils/resize.js
|
|
1303
|
+
function Z(e, t, n) {
|
|
1218
1304
|
let r = e + t;
|
|
1219
1305
|
return r > n ? e = r : (t = n - e, e = n), {
|
|
1220
1306
|
deltaW: t,
|
|
1221
1307
|
width: e
|
|
1222
1308
|
};
|
|
1223
1309
|
}
|
|
1224
|
-
function
|
|
1310
|
+
function Q(e, t, n) {
|
|
1225
1311
|
let r = e + t;
|
|
1226
1312
|
return r > n ? e = r : (t = n - e, e = n), {
|
|
1227
1313
|
deltaH: t,
|
|
1228
1314
|
height: e
|
|
1229
1315
|
};
|
|
1230
1316
|
}
|
|
1231
|
-
function
|
|
1317
|
+
function be(e, t, n, r, i, a, o) {
|
|
1232
1318
|
let { width: s, height: c, centerX: l, centerY: u, rotateAngle: d } = t, f = s < 0 ? -1 : 1, p = c < 0 ? -1 : 1;
|
|
1233
1319
|
switch (s = Math.abs(s), c = Math.abs(c), [
|
|
1234
1320
|
"top-left",
|
|
1235
1321
|
"top-right",
|
|
1236
1322
|
"bottom-left",
|
|
1237
1323
|
"bottom-right"
|
|
1238
|
-
].includes(e) && (e === "top-right" ? r = -r : e === "bottom-left" ? n = -n : e === "top-left" && (n = -n, r = -r), {width: s, deltaW: n} =
|
|
1324
|
+
].includes(e) && (e === "top-right" ? r = -r : e === "bottom-left" ? n = -n : e === "top-left" && (n = -n, r = -r), {width: s, deltaW: n} = Z(s, n, a), {height: c, deltaH: r} = Q(c, r, o), i && (r = n / i, c = s / i)), e) {
|
|
1239
1325
|
case "right":
|
|
1240
|
-
({width: s, deltaW: n} =
|
|
1326
|
+
({width: s, deltaW: n} = Z(s, n, a)), i ? (r = n / i, c = s / i, l += n / 2 * Math.cos(G(d)) - r / 2 * Math.sin(G(d)), u += n / 2 * Math.sin(G(d)) + r / 2 * Math.cos(G(d))) : (l += n / 2 * Math.cos(G(d)), u += n / 2 * Math.sin(G(d)));
|
|
1241
1327
|
break;
|
|
1242
1328
|
case "top-right":
|
|
1243
|
-
l += n / 2 * Math.cos(
|
|
1329
|
+
l += n / 2 * Math.cos(G(d)) + r / 2 * Math.sin(G(d)), u += n / 2 * Math.sin(G(d)) - r / 2 * Math.cos(G(d));
|
|
1244
1330
|
break;
|
|
1245
1331
|
case "bottom-right":
|
|
1246
|
-
l += n / 2 * Math.cos(
|
|
1332
|
+
l += n / 2 * Math.cos(G(d)) - r / 2 * Math.sin(G(d)), u += n / 2 * Math.sin(G(d)) + r / 2 * Math.cos(G(d));
|
|
1247
1333
|
break;
|
|
1248
1334
|
case "bottom":
|
|
1249
|
-
({height: c, deltaH: r} =
|
|
1335
|
+
({height: c, deltaH: r} = Q(c, r, o)), i ? (n = r * i, s = c * i, l += n / 2 * Math.cos(G(d)) - r / 2 * Math.sin(G(d)), u += n / 2 * Math.sin(G(d)) + r / 2 * Math.cos(G(d))) : (l -= r / 2 * Math.sin(G(d)), u += r / 2 * Math.cos(G(d)));
|
|
1250
1336
|
break;
|
|
1251
1337
|
case "bottom-left":
|
|
1252
|
-
l -= n / 2 * Math.cos(
|
|
1338
|
+
l -= n / 2 * Math.cos(G(d)) + r / 2 * Math.sin(G(d)), u -= n / 2 * Math.sin(G(d)) - r / 2 * Math.cos(G(d));
|
|
1253
1339
|
break;
|
|
1254
1340
|
case "left":
|
|
1255
|
-
n = -n, {width: s, deltaW: n} =
|
|
1341
|
+
n = -n, {width: s, deltaW: n} = Z(s, n, a), i ? (c = s / i, r = n / i, l -= n / 2 * Math.cos(G(d)) + r / 2 * Math.sin(G(d)), u -= n / 2 * Math.sin(G(d)) - r / 2 * Math.cos(G(d))) : (l -= n / 2 * Math.cos(G(d)), u -= n / 2 * Math.sin(G(d)));
|
|
1256
1342
|
break;
|
|
1257
1343
|
case "top-left":
|
|
1258
|
-
l -= n / 2 * Math.cos(
|
|
1344
|
+
l -= n / 2 * Math.cos(G(d)) - r / 2 * Math.sin(G(d)), u -= n / 2 * Math.sin(G(d)) + r / 2 * Math.cos(G(d));
|
|
1259
1345
|
break;
|
|
1260
1346
|
case "top":
|
|
1261
|
-
r = -r, {height: c, deltaH: r} =
|
|
1347
|
+
r = -r, {height: c, deltaH: r} = Q(c, r, o), i ? (s = c * i, n = r * i, l += n / 2 * Math.cos(G(d)) + r / 2 * Math.sin(G(d)), u += n / 2 * Math.sin(G(d)) - r / 2 * Math.cos(G(d))) : (l += r / 2 * Math.sin(G(d)), u -= r / 2 * Math.cos(G(d)));
|
|
1262
1348
|
break;
|
|
1263
1349
|
default: break;
|
|
1264
1350
|
}
|
|
@@ -1273,7 +1359,25 @@ function _e(e, t, n, r, i, a, o) {
|
|
|
1273
1359
|
}
|
|
1274
1360
|
};
|
|
1275
1361
|
}
|
|
1276
|
-
|
|
1362
|
+
//#endregion
|
|
1363
|
+
//#region src/services/transform/utils/handles.js
|
|
1364
|
+
function xe(e) {
|
|
1365
|
+
let t = e?.querySelector?.(":scope > .draggable-dot-wrap");
|
|
1366
|
+
return t ? [...t.querySelectorAll?.(".draggable-dot") || []] : [];
|
|
1367
|
+
}
|
|
1368
|
+
function Se(e) {
|
|
1369
|
+
let t = e?.dataset?.dir;
|
|
1370
|
+
return t && pe[t] || "right";
|
|
1371
|
+
}
|
|
1372
|
+
function Ce(e) {
|
|
1373
|
+
return !!e?.hasAttribute?.(t.handleRotateAttr);
|
|
1374
|
+
}
|
|
1375
|
+
function $(e) {
|
|
1376
|
+
return !!e?.hasAttribute?.(t.handleResizeAttr);
|
|
1377
|
+
}
|
|
1378
|
+
//#endregion
|
|
1379
|
+
//#region src/services/TransformControllerService.js
|
|
1380
|
+
var we = class {
|
|
1277
1381
|
order = 25;
|
|
1278
1382
|
#e;
|
|
1279
1383
|
constructor(e = {}) {
|
|
@@ -1315,18 +1419,25 @@ var ve = class {
|
|
|
1315
1419
|
}
|
|
1316
1420
|
onDown(e) {
|
|
1317
1421
|
let t = e?.session;
|
|
1318
|
-
if (!t?.isDragScope || !
|
|
1422
|
+
if (!t?.isDragScope || !m(t.sourceEl) || !this.#e.resizable) return;
|
|
1319
1423
|
let { angle: n } = Y(t.sourceEl);
|
|
1320
1424
|
n && this.#l(t.sourceEl, n);
|
|
1321
1425
|
}
|
|
1322
1426
|
onStart(e) {
|
|
1323
1427
|
let n = e.session;
|
|
1324
|
-
if (!n?.active || !n?.started || !n.isDragScope || !
|
|
1325
|
-
let r = "move",
|
|
1326
|
-
|
|
1428
|
+
if (!n?.active || !n?.started || !n.isDragScope || !m(n.sourceEl) || typeof this.#e.canTransform == "function" && !this.#e.canTransform(n.sourceEl)) return;
|
|
1429
|
+
let r = n.selectedByNs?.get(n.namespace), i = Array.isArray(r) && r.length > 1, a = "move", o = "", s = this.#e.rotatable && f(n.sourceEl, t.rotatableAttr, !0), c = this.#e.resizable && f(n.sourceEl, t.resizableAttr, !0);
|
|
1430
|
+
if (Ce(n.handleEl) && s) {
|
|
1431
|
+
if (i) return;
|
|
1432
|
+
a = "rotate";
|
|
1433
|
+
} else if ($(n.handleEl) && c) {
|
|
1434
|
+
if (i) return;
|
|
1435
|
+
a = "resize", o = Se(n.handleEl);
|
|
1436
|
+
}
|
|
1437
|
+
this.#e.disableMirrorInScope && this.#m(n), this.#e.disableDropIndicatorInScope && this.#h(n), n.cache.__transform = {
|
|
1327
1438
|
phase: 0,
|
|
1328
|
-
type:
|
|
1329
|
-
side:
|
|
1439
|
+
type: a,
|
|
1440
|
+
side: o,
|
|
1330
1441
|
scaleRatio: void 0,
|
|
1331
1442
|
container: void 0,
|
|
1332
1443
|
containerRect: void 0,
|
|
@@ -1353,18 +1464,23 @@ var ve = class {
|
|
|
1353
1464
|
lastAppliedY: void 0,
|
|
1354
1465
|
lastAppliedW: void 0,
|
|
1355
1466
|
lastAppliedH: void 0,
|
|
1356
|
-
lastAppliedAngle: void 0
|
|
1467
|
+
lastAppliedAngle: void 0,
|
|
1468
|
+
multiSelection: {
|
|
1469
|
+
enabled: i,
|
|
1470
|
+
elements: [],
|
|
1471
|
+
initialTransforms: []
|
|
1472
|
+
}
|
|
1357
1473
|
};
|
|
1358
1474
|
}
|
|
1359
1475
|
onMeasure(e) {
|
|
1360
1476
|
let n = e.session, r = n?.cache?.__transform;
|
|
1361
1477
|
if (!n?.active || !n?.started || !n.isDragScope || !r || r.phase !== 0) return;
|
|
1362
|
-
if (!
|
|
1478
|
+
if (!m(n.sourceEl)) {
|
|
1363
1479
|
n.cache.__transform = void 0;
|
|
1364
1480
|
return;
|
|
1365
1481
|
}
|
|
1366
1482
|
let i = e.adapter.closestDragScope(n.sourceEl);
|
|
1367
|
-
if (!
|
|
1483
|
+
if (!m(i)) {
|
|
1368
1484
|
n.cache.__transform = void 0;
|
|
1369
1485
|
return;
|
|
1370
1486
|
}
|
|
@@ -1382,7 +1498,7 @@ var ve = class {
|
|
|
1382
1498
|
h: Math.max(0, i.clientHeight)
|
|
1383
1499
|
}), r.type === "rotate") {
|
|
1384
1500
|
let e = (n.x - s.left) / a, t = (n.y - s.top) / a;
|
|
1385
|
-
r.rotateOffset =
|
|
1501
|
+
r.rotateOffset = J(r.center.x, r.center.y, e, t) - r.data.angle;
|
|
1386
1502
|
}
|
|
1387
1503
|
if (this.#e.snap || this.#e.markline) {
|
|
1388
1504
|
let o = q(n.sourceEl, a, e.adapter);
|
|
@@ -1391,22 +1507,39 @@ var ve = class {
|
|
|
1391
1507
|
y: o.top + o.height / 2 - r.center.y
|
|
1392
1508
|
};
|
|
1393
1509
|
let s = [...i.querySelectorAll?.(`[${t.dragAttr}]`) || []], c = [];
|
|
1394
|
-
for (let t of s) t !== n.sourceEl &&
|
|
1395
|
-
if (r.lines =
|
|
1396
|
-
let e =
|
|
1510
|
+
for (let t of s) t !== n.sourceEl && m(t) && c.push(q(t, a, e.adapter));
|
|
1511
|
+
if (r.lines = ve(c, o), this.#e.markline) {
|
|
1512
|
+
let e = ye(i);
|
|
1397
1513
|
r.guideX = e.x, r.guideY = e.y;
|
|
1398
1514
|
}
|
|
1399
1515
|
}
|
|
1516
|
+
if (r.multiSelection.enabled) {
|
|
1517
|
+
let e = n.selectedByNs?.get(n.namespace);
|
|
1518
|
+
if (Array.isArray(e)) for (let t of e) t !== n.sourceEl && m(t) && (r.multiSelection.elements.push(t), r.multiSelection.initialTransforms.push(Y(t)));
|
|
1519
|
+
}
|
|
1400
1520
|
r.phase = 1;
|
|
1401
1521
|
}
|
|
1402
1522
|
onCompute(e) {
|
|
1403
1523
|
let t = e.session, n = t?.cache?.__transform;
|
|
1404
|
-
!t?.active || !t?.started || !t.isDragScope || !n || n.phase !== 1 ||
|
|
1524
|
+
!t?.active || !t?.started || !t.isDragScope || !n || n.phase !== 1 || m(t.sourceEl) && (n.didCompute = !0, n.type === "move" ? this.#r(t, n) : n.type === "rotate" ? this.#i(t, n) : n.type === "resize" && this.#a(t, n));
|
|
1405
1525
|
}
|
|
1406
1526
|
onCommit(e) {
|
|
1407
1527
|
let t = e.session, n = t?.cache?.__transform;
|
|
1408
|
-
if (!t?.active || !t?.started || !t.isDragScope || !n || n.phase !== 1 || !n.didCompute || !
|
|
1409
|
-
this.#
|
|
1528
|
+
if (!t?.active || !t?.started || !t.isDragScope || !n || n.phase !== 1 || !n.didCompute || !m(t.sourceEl)) return;
|
|
1529
|
+
if (this.#d(e, t.sourceEl, n), n.multiSelection.enabled && n.type === "move") {
|
|
1530
|
+
let t = n.data.x - n.start.x, r = n.data.y - n.start.y;
|
|
1531
|
+
for (let i = 0; i < n.multiSelection.elements.length; i++) {
|
|
1532
|
+
let a = n.multiSelection.elements[i], o = n.multiSelection.initialTransforms[i], s = {
|
|
1533
|
+
x: o.x + t,
|
|
1534
|
+
y: o.y + r,
|
|
1535
|
+
width: o.width,
|
|
1536
|
+
height: o.height,
|
|
1537
|
+
angle: o.angle
|
|
1538
|
+
};
|
|
1539
|
+
this.#u(e, a, s);
|
|
1540
|
+
}
|
|
1541
|
+
}
|
|
1542
|
+
n.type === "rotate" && this.#e.resizable && n.lastCursorAngle !== n.data?.angle && (n.lastCursorAngle = n.data?.angle, e.frame?.run?.(() => {
|
|
1410
1543
|
this.#l(t.sourceEl, n.lastCursorAngle || 0);
|
|
1411
1544
|
})), this.#e.markline && this.#c(e, n);
|
|
1412
1545
|
let r = e.dnd;
|
|
@@ -1424,16 +1557,16 @@ var ve = class {
|
|
|
1424
1557
|
}
|
|
1425
1558
|
onEnd(e, t) {
|
|
1426
1559
|
let n = e.session, r = n?.cache?.__transform;
|
|
1427
|
-
r && (
|
|
1560
|
+
r && (X(r.guideX), X(r.guideY), t?.ended && m(n?.sourceEl) && r?.data && e.dnd?.emit?.("draggable:drop", {
|
|
1428
1561
|
type: r.type,
|
|
1429
1562
|
el: n.sourceEl,
|
|
1430
1563
|
data: n.data,
|
|
1431
1564
|
...r.data
|
|
1432
|
-
}), t?.ended && r.type === "rotate" && this.#e.resizable &&
|
|
1565
|
+
}), t?.ended && r.type === "rotate" && this.#e.resizable && m(n?.sourceEl) && this.#l(n.sourceEl, r.data?.angle || 0), n.cache.__transform = void 0);
|
|
1433
1566
|
}
|
|
1434
1567
|
onDestroy(e, t) {
|
|
1435
1568
|
let n = t?.cache?.__transform;
|
|
1436
|
-
n && (
|
|
1569
|
+
n && (X(n.guideX), X(n.guideY), t.cache.__transform = void 0);
|
|
1437
1570
|
}
|
|
1438
1571
|
#r(e, t) {
|
|
1439
1572
|
let n = this.#n(t), r = t.start.x + e.dx / n, i = t.start.y + e.dy / n;
|
|
@@ -1441,12 +1574,12 @@ var ve = class {
|
|
|
1441
1574
|
...t.data,
|
|
1442
1575
|
x: r,
|
|
1443
1576
|
y: i
|
|
1444
|
-
}, this.#s(t), this.#
|
|
1577
|
+
}, this.#s(t), this.#f(t.data, t.boundary);
|
|
1445
1578
|
}
|
|
1446
1579
|
#i(e, t) {
|
|
1447
1580
|
let n = this.#n(t), r = t.containerRect;
|
|
1448
1581
|
if (!r) return;
|
|
1449
|
-
let i = (e.x - r.left) / n, a = (e.y - r.top) / n, o =
|
|
1582
|
+
let i = (e.x - r.left) / n, a = (e.y - r.top) / n, o = J(t.center.x, t.center.y, i, a) - (t.rotateOffset ?? 0);
|
|
1450
1583
|
if (o = (o % 360 + 360) % 360, this.#e.rotateSnap) {
|
|
1451
1584
|
let e = Number(this.#e.rotateStep) || 15;
|
|
1452
1585
|
o = Math.round(o / e) * e;
|
|
@@ -1457,13 +1590,13 @@ var ve = class {
|
|
|
1457
1590
|
};
|
|
1458
1591
|
}
|
|
1459
1592
|
#a(e, t) {
|
|
1460
|
-
let n = this.#n(t), r = this.#e.aspectRatio, i = e.dx / n, a = e.dy / n, o = Math.atan2(a, i), s =
|
|
1593
|
+
let n = this.#n(t), r = this.#e.aspectRatio, i = e.dx / n, a = e.dy / n, o = Math.atan2(a, i), s = ue(i, a), c = o - G(t.start.angle), l = s * Math.cos(c), u = s * Math.sin(c), d = {
|
|
1461
1594
|
centerX: t.start.x + t.start.width / 2,
|
|
1462
1595
|
centerY: t.start.y + t.start.height / 2,
|
|
1463
1596
|
height: t.start.height,
|
|
1464
1597
|
rotateAngle: t.start.angle,
|
|
1465
1598
|
width: t.start.width
|
|
1466
|
-
}, { position: { centerX: f, centerY: p }, size: { width: m, height: h } } =
|
|
1599
|
+
}, { position: { centerX: f, centerY: p }, size: { width: m, height: h } } = be(t.side, d, l, u, r, this.#e.minWidth, this.#e.minHeight), g = fe({
|
|
1467
1600
|
angle: t.data.angle,
|
|
1468
1601
|
centerX: f,
|
|
1469
1602
|
centerY: p,
|
|
@@ -1471,19 +1604,19 @@ var ve = class {
|
|
|
1471
1604
|
width: m
|
|
1472
1605
|
}), _ = {
|
|
1473
1606
|
...t.data,
|
|
1474
|
-
...
|
|
1607
|
+
...de(g, f, p)
|
|
1475
1608
|
};
|
|
1476
1609
|
if (this.#e.maxWidth > 0 && (_.width = Math.min(_.width, this.#e.maxWidth)), this.#e.maxHeight > 0 && (_.height = Math.min(_.height, this.#e.maxHeight)), this.#e.snapToGrid) {
|
|
1477
1610
|
let e = _.x + _.width / 2, n = _.y + _.height / 2, i = this.#e.gridX, a = this.#e.gridY, o = t.start.width + K(_.width - t.start.width, i), s;
|
|
1478
1611
|
s = r ? o / r : t.start.height + K(_.height - t.start.height, a), _.width = Math.abs(o), _.height = Math.abs(s), _.x = e - _.width / 2, _.y = n - _.height / 2;
|
|
1479
1612
|
}
|
|
1480
1613
|
let v = _;
|
|
1481
|
-
this.#
|
|
1614
|
+
this.#p(v, t.boundary) ? (t.data = v, t.lastValidData = { ...v }) : t.data = t.lastValidData ? { ...t.lastValidData } : { ...t.start }, this.#s(t);
|
|
1482
1615
|
}
|
|
1483
1616
|
#o(e) {
|
|
1484
1617
|
let t = e?.data, n = e?.viewportCenterOffset;
|
|
1485
1618
|
if (!t || !n) return e.startRect;
|
|
1486
|
-
let r =
|
|
1619
|
+
let r = G(t.angle || 0), i = Math.cos(r), a = Math.sin(r), o = Math.abs(t.width * i) + Math.abs(t.height * a), s = Math.abs(t.width * a) + Math.abs(t.height * i), c = t.x + t.width / 2 + n.x, l = t.y + t.height / 2 + n.y, u = c - o / 2, d = l - s / 2;
|
|
1487
1620
|
return {
|
|
1488
1621
|
bottom: d + s,
|
|
1489
1622
|
height: s,
|
|
@@ -1522,41 +1655,44 @@ var ve = class {
|
|
|
1522
1655
|
}
|
|
1523
1656
|
#c(e, t) {
|
|
1524
1657
|
let { guideX: n, guideY: r } = t, i = t.mark || {};
|
|
1525
|
-
n && (i.left === void 0 ? e.frame?.setStyle?.(n, "display", "none") : (e.frame?.setStyle?.(n, "display", "block"), e.frame?.setStyle?.(n, "transform", `translate(${
|
|
1658
|
+
n && (i.left === void 0 ? e.frame?.setStyle?.(n, "display", "none") : (e.frame?.setStyle?.(n, "display", "block"), e.frame?.setStyle?.(n, "transform", `translate(${W(i.left)}, 0)`))), r && (i.top === void 0 ? e.frame?.setStyle?.(r, "display", "none") : (e.frame?.setStyle?.(r, "display", "block"), e.frame?.setStyle?.(r, "transform", `translate(0, ${W(i.top)})`)));
|
|
1526
1659
|
}
|
|
1527
1660
|
#l(e, t) {
|
|
1528
|
-
let n =
|
|
1661
|
+
let n = xe(e);
|
|
1529
1662
|
for (let e of n) {
|
|
1530
1663
|
let n = e?.dataset?.dir;
|
|
1531
|
-
n && (e.style.cursor = `${
|
|
1664
|
+
n && (e.style.cursor = `${_e(t, n)}-resize`);
|
|
1532
1665
|
}
|
|
1533
1666
|
}
|
|
1534
1667
|
#u(e, t, n) {
|
|
1668
|
+
e.frame?.setStyle?.(t, "transform", `translate(${W(n.x)}, ${W(n.y)}) rotate(${n.angle}deg)`);
|
|
1669
|
+
}
|
|
1670
|
+
#d(e, t, n) {
|
|
1535
1671
|
let r = n.data;
|
|
1536
|
-
n.lastAppliedW !== r.width && (e.frame?.setStyle?.(t, "width",
|
|
1672
|
+
n.lastAppliedW !== r.width && (e.frame?.setStyle?.(t, "width", W(r.width)), n.lastAppliedW = r.width), n.lastAppliedH !== r.height && (e.frame?.setStyle?.(t, "height", W(r.height)), n.lastAppliedH = r.height), (n.lastAppliedX !== r.x || n.lastAppliedY !== r.y || n.lastAppliedAngle !== r.angle) && (this.#u(e, t, r), n.lastAppliedX = r.x, n.lastAppliedY = r.y, n.lastAppliedAngle = r.angle);
|
|
1537
1673
|
}
|
|
1538
|
-
#
|
|
1674
|
+
#f(e, t) {
|
|
1539
1675
|
if (!t) return;
|
|
1540
|
-
let n =
|
|
1676
|
+
let n = G(e.angle || 0), r = Math.abs(Math.cos(n)), i = Math.abs(Math.sin(n)), a = e.width * r + e.height * i, o = e.width * i + e.height * r, s = (a - e.width) / 2, c = t.w - a / 2 - e.width / 2, l = (o - e.height) / 2, u = t.h - o / 2 - e.height / 2;
|
|
1541
1677
|
e.x = Math.max(Math.min(s, c), Math.min(e.x, Math.max(s, c))), e.y = Math.max(Math.min(l, u), Math.min(e.y, Math.max(l, u)));
|
|
1542
1678
|
}
|
|
1543
|
-
#
|
|
1679
|
+
#p(e, t) {
|
|
1544
1680
|
if (!t) return !0;
|
|
1545
|
-
let n =
|
|
1681
|
+
let n = G(e.angle || 0), r = Math.abs(Math.cos(n)), i = Math.abs(Math.sin(n)), a = e.width * r + e.height * i, o = e.width * i + e.height * r, s = e.x + e.width / 2, c = e.y + e.height / 2, l = s - a / 2, u = s + a / 2, d = c - o / 2, f = c + o / 2;
|
|
1546
1682
|
return !(l < -.5 || d < -.5 || u > t.w + .5 || f > t.h + .5);
|
|
1547
1683
|
}
|
|
1548
|
-
#
|
|
1684
|
+
#m(e) {
|
|
1549
1685
|
if (e?.mirrorEl) {
|
|
1550
1686
|
try {
|
|
1551
1687
|
e.mirrorEl.parentNode?.removeChild?.(e.mirrorEl);
|
|
1552
1688
|
} catch {}
|
|
1553
1689
|
e.mirrorEl = void 0;
|
|
1554
1690
|
}
|
|
1555
|
-
if (
|
|
1691
|
+
if (m(e?.sourceEl)) try {
|
|
1556
1692
|
e.sourceEl.style.visibility = "";
|
|
1557
1693
|
} catch {}
|
|
1558
1694
|
}
|
|
1559
|
-
#
|
|
1695
|
+
#h(e) {
|
|
1560
1696
|
if (e?.indicatorEl) {
|
|
1561
1697
|
try {
|
|
1562
1698
|
e.indicatorEl.parentNode?.removeChild?.(e.indicatorEl);
|
|
@@ -1565,9 +1701,9 @@ var ve = class {
|
|
|
1565
1701
|
}
|
|
1566
1702
|
e.currentDrop = void 0, e.currentDropRect = void 0, e.currentAllowed = !1;
|
|
1567
1703
|
}
|
|
1568
|
-
},
|
|
1704
|
+
}, Te = {
|
|
1569
1705
|
name: "@ptahjs/dnd",
|
|
1570
|
-
version: "0.0.
|
|
1706
|
+
version: "0.0.4"
|
|
1571
1707
|
};
|
|
1572
1708
|
//#endregion
|
|
1573
|
-
export {
|
|
1709
|
+
export { j as ACTIVE_WRAP_CLASS, B as ActiveSelectionService, D as AutoScrollService, M as DOT_CLASS, re as Dnd, Te as DndVersion, le as DropIndicatorService, x as DropService, U as MarqueeSelectionService, S as MirrorService, N as ROTATE_CLASS, we as TransformControllerService, z as clearAll, R as setMultipleActive };
|