@ptahjs/dnd 0.1.0 → 0.1.1

package/dist/dnd.js

@@ -2,18 +2,31 @@
 var e = class {
 	#e = /* @__PURE__ */ new Map();
 	emit(e, t) {
+		let n = this.#e.get(e);
+		if (!n || n.length === 0) return t;
+		let r = n.slice();
+		for (let n of r) try {
+			n(t);
+		} catch (t) {
+			console.error(`[EventDispatcher] handler error for "${e}":`, t);
+		}
+		return t;
+	}
+	pipe(e, t) {
 		let n = this.#e.get(e);
 		if (!n || n.length === 0) return t;
 		let r = t;
-		for (let e of n) {
-			let t = e(r);
-			t !== void 0 && (r = t);
+		for (let t of n.slice()) try {
+			let e = t(r);
+			e !== void 0 && (r = e);
+		} catch (t) {
+			console.error(`[EventDispatcher] pipe handler error for "${e}":`, t);
 		}
 		return r;
 	}
 	on(e, t) {
 		let n = this.#e.get(e);
-		return n ? n.push(t) : this.#e.set(e, [t]), this;
+		return n ? n.includes(t) || n.push(t) : this.#e.set(e, [t]), this;
 	}
 	off(e, t) {
 		let n = this.#e.get(e);
@@ -66,29 +79,30 @@ var e = class {
 };
 //#endregion
 //#region src/utils/computeDropRegion.js
-function s(e) {
-	if (e?.cache?.dropRegionFns) return e.cache.dropRegionFns;
-	let t = () => {
+function s(e, t) {
+	let n = `dropRegionFns_${(t instanceof Set ? Array.from(t).sort().join(",") : t) || "all"}`;
+	if (e?.cache?.[n]) return e.cache[n];
+	let a = () => {
 		if (e.currentDrop) return e.currentDropRect || void 0;
-	}, n = {
-		isOverBottom: () => {
-			let n = t();
-			return n ? e.y > n.y + n.height * (1 - r) : !1;
-		},
-		isOverLeft: () => {
-			let n = t();
-			return n ? e.x < n.x + n.width * i : !1;
-		},
-		isOverRight: () => {
-			let n = t();
-			return n ? e.x > n.x + n.width * (1 - i) : !1;
-		},
-		isOverTop: () => {
-			let n = t();
-			return n ? e.y < n.y + n.height * r : !1;
-		}
+	}, o = !t || t === "all" || t instanceof Set && (t.has("top") || t.has("bottom")), s = !t || t === "all" || t instanceof Set && (t.has("left") || t.has("right")), c = {
+		isOverTop: o ? () => {
+			let t = a();
+			return t ? e.y < t.y + t.height * r : !1;
+		} : () => !1,
+		isOverBottom: o ? () => {
+			let t = a();
+			return t ? e.y > t.y + t.height * (1 - r) : !1;
+		} : () => !1,
+		isOverLeft: s ? () => {
+			let t = a();
+			return t ? e.x < t.x + t.width * i : !1;
+		} : () => !1,
+		isOverRight: s ? () => {
+			let t = a();
+			return t ? e.x > t.x + t.width * (1 - i) : !1;
+		} : () => !1
 	};
-	return e?.cache && (e.cache.dropRegionFns = n), n;
+	return e?.cache && (e.cache[n] = c), c;
 }
 //#endregion
 //#region src/utils/parseData.js
@@ -354,8 +368,8 @@ var g = t.dragScopeAttr, _ = `[${g}], [data-${g}]`, v = class {
 		let e = !1;
 		try {
 			e = !!this.#r(performance.now());
-		} catch {
-			e = !1;
+		} catch (t) {
+			e = !1, console.error("[RafScheduler] frame callback error:", t);
 		}
 		if (this.#e) {
 			if (e || this.#t) {
@@ -426,11 +440,13 @@ var g = t.dragScopeAttr, _ = `[${g}], [data-${g}]`, v = class {
 		}), e.preventDefault();
 	};
 	#p = (e) => {
-		!this.#n || !this.#c || "pointerId" in e && e.pointerId !== this.#r || (this.#c({
+		if (!this.#n || !this.#c || "pointerId" in e && e.pointerId !== this.#r) return;
+		let t = this.#r, n = e.type;
+		this.#d(), this.#c({
 			event: e,
-			pointerId: this.#r,
-			reason: e.type
-		}), this.#d(), e.preventDefault?.());
+			pointerId: t,
+			reason: n
+		}), e.preventDefault?.();
 	};
 }, ee = class {
 	scrolled = !1;
@@ -507,6 +523,9 @@ var g = t.dragScopeAttr, _ = `[${g}], [data-${g}]`, v = class {
 	onDestroy(e, t) {
 		for (let n of this.#e) n.onDestroy?.(e, t);
 	}
+	dispose() {
+		this.#e.length = 0;
+	}
 }, ne = class {
 	#e;
 	#t;
@@ -573,11 +592,15 @@ var g = t.dragScopeAttr, _ = `[${g}], [data-${g}]`, v = class {
 					started: this.#t.started
 				};
 			}
-			case "END": return !this.#t.active || e.pointerId !== void 0 && e.pointerId !== this.#t.pointerId ? { handled: !1 } : {
-				handled: !0,
-				ended: !!this.#t.started,
-				reason: e.reason
-			};
+			case "END": {
+				if (!this.#t.active || e.pointerId !== void 0 && e.pointerId !== this.#t.pointerId) return { handled: !1 };
+				let t = !!this.#t.started;
+				return this.#t.active = !1, {
+					handled: !0,
+					ended: t,
+					reason: e.reason
+				};
+			}
 			default: return { handled: !1 };
 		}
 	}
@@ -596,13 +619,17 @@ var g = t.dragScopeAttr, _ = `[${g}], [data-${g}]`, v = class {
 	#s = new te();
 	#c;
 	#l;
+	#u = !1;
 	canDrop = () => !0;
 	renderMirror = void 0;
 	get root() {
 		return this.#t;
 	}
 	get monitor() {
-		return this.#o?.session;
+		if (!this.#u) return this.#o?.session;
+	}
+	get destroyed() {
+		return this.#u;
 	}
 	constructor(e = {}) {
 		super(), this.#n = { threshold: e.threshold ?? a.DRAG_START };
@@ -610,10 +637,10 @@ var g = t.dragScopeAttr, _ = `[${g}], [data-${g}]`, v = class {
 		t.threshold = this.#n.threshold, t.adapter = this.#r, this.#o = new ne({
 			store: this.#a,
 			session: t
-		}), this.#c = new y(this.#m), this.#l = new b({
-			onDown: this.#d,
-			onMove: this.#f,
-			onUp: this.#p
+		}), this.#c = new y(this.#h), this.#l = new b({
+			onDown: this.#f,
+			onMove: this.#p,
+			onUp: this.#m
 		}), this.setRoot(e.root);
 	}
 	use(e) {
@@ -623,13 +650,14 @@ var g = t.dragScopeAttr, _ = `[${g}], [data-${g}]`, v = class {
 		let t = this.#r.resolveRoot(e);
 		if (t === this.#t) return;
 		let n = this.#t;
-		this.#e.abort(), this.#e = new AbortController(), this.#t = t, this.#l.setRoot(this.#t), this.#t && (this.#s.onRootChange(this.#t, n, this.#e.signal), this.#t.addEventListener("click", this.#u, {
+		this.#e.abort(), this.#e = new AbortController(), this.#t = t, this.#l.setRoot(this.#t), this.#t && (this.#s.onRootChange(this.#t, n, this.#e.signal), this.#t.addEventListener("click", this.#d, {
 			capture: !0,
 			passive: !1,
 			signal: this.#e.signal
 		}));
 	}
 	destroy() {
+		if (this.#u) return;
 		this.#e.abort(), this.#l.destroy(), this.#c.cancel();
 		let e = this.#o.session;
 		e?.active && (this.#s.onEnd(d({
@@ -641,22 +669,20 @@ var g = t.dragScopeAttr, _ = `[${g}], [data-${g}]`, v = class {
 		}), {
 			ended: !1,
 			reason: "destroy"
-		}), e.dragAbort?.abort()), this.offAll(), this.#s.onDestroy(this, e);
-		let t = this.#o.resetSession({ ended: !1 });
-		t.adapter = this.#r;
+		}), e.dragAbort?.abort()), this.#s.onDestroy(this, e), this.#s.dispose?.(), this.offAll(), this.#u = !0;
 	}
-	#u = (e) => {
+	#d = (e) => {
 		let t = this.#o?.session;
 		if (!t?.suppressNextClick) return;
 		let n = performance.now(), r = !t.lastDragTs || n - t.lastDragTs < 800;
 		t.suppressNextClick = !1, r && (e.preventDefault?.(), e.stopPropagation?.(), e.stopImmediatePropagation?.());
 	};
-	#d = (e) => {
+	#f = (e) => {
 		if (!this.#t || e.button !== 0) return { accepted: !1 };
 		let n = p(e.target, this.#r);
 		if (!n) return { accepted: !1 };
 		let r = this.#r.closestDraggable(n);
-		if (!r) return { accepted: !1 };
+		if (!r || e.target?.closest?.("input, textarea, select, button, a[href], [contenteditable]")) return { accepted: !1 };
 		e.preventDefault(), e.target?.setPointerCapture?.(e.pointerId);
 		let i = this.#r.getNamespace(r), a = this.#r.closestDrop(r), o = r.getBoundingClientRect(), s = c(this.#r.getAttr(r, t.dataAttr));
 		if (!this.#o.dispatch({
@@ -689,7 +715,7 @@ var g = t.dragScopeAttr, _ = `[${g}], [data-${g}]`, v = class {
 			signal: l.dragAbort.signal
 		};
 	};
-	#f = ({ pointerId: e, x: t, y: n }) => {
+	#p = ({ pointerId: e, x: t, y: n }) => {
 		let r = this.#o.dispatch({
 			type: "MOVE",
 			pointerId: e,
@@ -710,7 +736,7 @@ var g = t.dragScopeAttr, _ = `[${g}], [data-${g}]`, v = class {
 		}
 		r.started && this.#c.request();
 	};
-	#p = ({ event: e, pointerId: t, reason: n }) => {
+	#m = ({ event: e, pointerId: t, reason: n }) => {
 		let r = this.#o.dispatch({
 			type: "END",
 			pointerId: t,
@@ -737,7 +763,7 @@ var g = t.dragScopeAttr, _ = `[${g}], [data-${g}]`, v = class {
 		let c = this.#o.resetSession({ ended: a });
 		c.adapter = this.#r, a ? this.emit("drop", s) : this.emit("cancel", s), e.preventDefault?.();
 	};
-	#m = (e) => {
+	#h = (e) => {
 		let t = this.#o.session;
 		if (!t.active || !t.started) return !1;
 		this.#i.reset(e), this.#r.beginFrame(), t.cache.frameId = this.#r.frameId;
@@ -809,7 +835,7 @@ var g = t.dragScopeAttr, _ = `[${g}], [data-${g}]`, v = class {
 			width: `${i.width}px`,
 			height: `${i.height}px`,
 			position: "fixed"
-		}), document.body.appendChild(a), r.mirrorEl = a);
+		}), (e.dnd?.root || document.body).appendChild(a), r.mirrorEl = a);
 	};
 	onCommit = (e) => {
 		let t = e?.session;
@@ -898,12 +924,13 @@ function A(e, t, n, r) {
 }
 function ae(e) {
 	if (!m(e)) return;
-	let n = t?.dropIndicatorAttr || "drop-indicator", r = `data-${n}`, i;
+	let n = t.dropIndicatorAttr || "drop-indicator", r = `data-${n}`, i;
 	if (e.hasAttribute?.(n)) i = e.getAttribute?.(n);
 	else if (e.hasAttribute?.(r)) i = e.getAttribute?.(r);
 	else return;
 	let a = (i ?? "").trim();
 	if (!a) return "all";
+	console.log("raw", i);
 	let o = /* @__PURE__ */ new Set();
 	for (let e of a.split(/[,\s]+/)) {
 		let t = (e || "").trim().toLowerCase();
@@ -917,13 +944,13 @@ function oe(e) {
 	let a = t.currentDrop || e.dnd?.root || r.body;
 	return m(a) && i.parentNode !== a && a.appendChild(i), i;
 }
-function se(e) {
+function se(e, t) {
 	if (!e.currentDrop || !e.currentDropRect) return;
-	let t = s(e);
-	if (t.isOverLeft()) return "left";
-	if (t.isOverRight()) return "right";
-	if (t.isOverTop()) return "top";
-	if (t.isOverBottom()) return "bottom";
+	let n = s(e, t);
+	if (n.isOverLeft()) return "left";
+	if (n.isOverRight()) return "right";
+	if (n.isOverTop()) return "top";
+	if (n.isOverBottom()) return "bottom";
 }
 function ce(e) {
 	let t = e.session;
@@ -944,7 +971,7 @@ var le = class {
 			t.indicatorRegion = void 0;
 			return;
 		}
-		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);
+		let a = oe(e), o = ce(e), s = se(t, i), c = i === "all" || s && i.has(s) ? s : void 0, l = !!(r && t.currentDropRect && o && c);
 		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);
 		else for (let t of k) A(e, a, t, !1);
 	}
@@ -1085,20 +1112,21 @@ function H(e, t) {
 var U = class {
 	order = -40;
 	#e;
+	#t;
 	onAttach(e) {
 		this.#e = e;
 	}
 	onRootChange(e, t, n) {
-		m(e) && e.addEventListener("pointerdown", (e) => {
+		this.#t = n, m(e) && e.addEventListener("pointerdown", (e) => {
 			if (e.button !== 0 || h(e.target)) return;
 			let t = e.target.closest(_);
-			t && (this.#e.monitor.adapter.closestDraggable(e.target) || this.#t(t, e));
+			t && (this.#e.monitor.adapter.closestDraggable(e.target) || this.#n(t, e));
 		}, {
 			capture: !0,
 			signal: n
 		});
 	}
-	#t(e, r) {
+	#n(e, r) {
 		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");
 		l.classList.add(n.marquee), e.appendChild(l);
 		let u = !1, d = (t) => {
@@ -1106,22 +1134,38 @@ var U = class {
 			if (!u && Math.abs(n) < a.MARQUEE_MOVE && Math.abs(r) < a.MARQUEE_MOVE) return;
 			u = !0;
 			let d = V(i, o, t.clientX, t.clientY);
-			this.#n(l, d, e, c);
-			let f = this.#r(e, s, d), p = this.#e.monitor.selectedByNs;
+			this.#r(l, d, e, c);
+			let f = this.#i(e, s, d), p = this.#e.monitor.selectedByNs;
 			p && (z(p, s), f.length > 0 && R(p, f, s));
-		}, f = () => {
-			if (l.remove(), document.removeEventListener("pointermove", d), document.removeEventListener("pointerup", f), !u) {
-				let e = this.#e.monitor.selectedByNs;
+		}, f = new AbortController(), p = [f.signal, this.#t].filter(Boolean), m = () => {
+			if (!f.signal.aborted) {
+				try {
+					l.remove();
+				} catch {}
+				f.abort();
+			}
+		}, h = () => {
+			if (!u) {
+				let e = this.#e.monitor?.selectedByNs;
 				e && z(e, s);
 			}
+			m();
 		};
-		document.addEventListener("pointermove", d), document.addEventListener("pointerup", f);
+		for (let e of p) {
+			if (e.aborted) {
+				m();
+				return;
+			}
+			e.addEventListener("abort", m, { once: !0 });
+		}
+		let g = { signal: f.signal };
+		document.addEventListener("pointermove", d, g), document.addEventListener("pointerup", h, g), document.addEventListener("pointercancel", m, g), window.addEventListener("blur", m, g);
 	}
-	#n(e, t, n, r) {
+	#r(e, t, n, r) {
 		let i = n.getBoundingClientRect(), a = (t.left - i.left) / r, o = (t.top - i.top) / r, s = t.width / r, c = t.height / r;
 		e.style.left = `${a}px`, e.style.top = `${o}px`, e.style.width = `${s}px`, e.style.height = `${c}px`;
 	}
-	#r(e, n, r) {
+	#i(e, n, r) {
 		let i = this.#e.monitor.adapter, a = e.querySelectorAll(`[${t.dragAttr}], [${t.dragdropAttr}]`), o = [];
 		for (let e of a) {
 			if (i.getNamespace(e) !== n) continue;
@@ -1703,7 +1747,7 @@ var we = class {
 	}
 }, Te = {
 	name: "@ptahjs/dnd",
-	version: "0.0.4"
+	version: "0.1.1"
 };
 //#endregion
 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 };

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@ptahjs/dnd",
-    "version": "0.1.0",
+    "version": "0.1.1",
     "files": [
         "dist"
     ],
@@ -14,9 +14,13 @@
         "./style": "./dist/dnd.css"
     },
     "scripts": {
-        "build": "vite build"
+        "build": "vite build",
+        "test": "vitest run"
     },
     "devDependencies": {
-        "vite": "8.0.8"
+        "@vitest/coverage-v8": "^4.1.5",
+        "jsdom": "^29.1.1",
+        "vite": "8.0.11",
+        "vitest": "catalog:"
     }
 }