vuestic-ui
Version:
Vue 3 UI Framework
40 lines (39 loc) • 1.13 kB
JavaScript
import { reactive, computed } from "vue";
import { u as useEvent } from "../../../composables/useEvent.js";
const useCursorAnchor = (anchorRef, enabled) => {
const position = reactive({ x: 0, y: 0 });
useEvent(["mousemove", "mousedown", "mouseup"], (e) => {
var _a;
if (!enabled.value) {
return;
}
const { x, y } = ((_a = anchorRef.value) == null ? void 0 : _a.getBoundingClientRect()) ?? { x: 0, y: 0 };
position.x = e.clientX - x;
position.y = e.clientY - y;
}, anchorRef);
return computed(() => {
return {
getBoundingClientRect() {
var _a;
const { x, y } = ((_a = anchorRef.value) == null ? void 0 : _a.getBoundingClientRect()) ?? { x: 0, y: 0 };
const resX = position.x + x;
const resY = position.y + y;
return {
width: 0,
height: 0,
x: resX,
y: resY,
top: resY,
right: resX,
bottom: resY,
left: resX
};
},
contextElement: anchorRef.value
};
});
};
export {
useCursorAnchor as u
};
//# sourceMappingURL=useCursorAnchor.js.map