import { onMounted as e, onUnmounted as t, unref as n } from "vue";
function r(r, i) {
	function a(e, t) {
		let a = n(r);
		if (!a) return;
		let o = `translate(${t.x - e.x}px, ${t.y - e.y}px)`;
		a.style.setProperty("transform", o), i(t);
	}
	function o(e) {
		let t = (t) => a(e, t);
		document.addEventListener("mousemove", t), document.addEventListener("mouseup", () => {
			let e = n(r);
			document.removeEventListener("mousemove", t), e && (e.style.setProperty("transition", "all .3s ease-in-out"), e.style.removeProperty("transform"), e.addEventListener("transitionend", () => {
				e.style.removeProperty("transition");
			}));
		}, { once: !0 });
	}
	function s() {
		n(r)?.addEventListener("mousedown", o);
	}
	function c() {
		n(r)?.removeEventListener("mousedown", o);
	}
	e(s), t(c);
}
export { r as useDraggable };

//# sourceMappingURL=useDraggable.js.map