react-selectable-box
Version:
A React component used hooks that allows you to select elements in the drag area using the mouse
32 lines • 1.45 kB
JavaScript
export var getClientXY = function getClientXY(e) {
var obj = 'touches' in e ? e.touches[0] : e;
return {
clientX: obj.clientX,
clientY: obj.clientY
};
};
export var checkInRange = function checkInRange(rule, rect, scrollContainer, boxRect, boxRef) {
if (typeof rule === 'function' && boxRef.current) {
return rule(boxRef.current, boxRect);
}
if (!rect || !scrollContainer) {
return false;
}
var rectLeft = rect.left,
rectTop = rect.top,
rectWidth = rect.width,
rectHeight = rect.height;
var _scrollContainer$getB = scrollContainer.getBoundingClientRect(),
containerTop = _scrollContainer$getB.top,
containerLeft = _scrollContainer$getB.left;
var scrollLeft = scrollContainer.scrollLeft;
var scrollTop = scrollContainer.scrollTop;
var boxTop = boxRect.top,
boxLeft = boxRect.left,
boxWidth = boxRect.width,
boxHeight = boxRect.height;
if (rule === 'collision') {
return rectLeft - containerLeft + scrollLeft < boxLeft + boxWidth && rectLeft + rectWidth - containerLeft + scrollLeft > boxLeft && rectTop - containerTop + scrollTop < boxTop + boxHeight && rectTop + rectHeight - containerTop + scrollTop > boxTop;
}
return rectLeft - containerLeft + scrollLeft >= boxLeft && rectLeft + rectWidth - containerLeft + scrollLeft <= boxLeft + boxWidth && rectTop - containerTop + scrollTop >= boxTop && rectTop + rectHeight - containerTop + scrollTop <= boxTop + boxHeight;
};