fix: Disable text selection when drag-scrolling
This commit is contained in:
@@ -76,13 +76,16 @@ const Board = React.memo(
|
|||||||
}
|
}
|
||||||
|
|
||||||
prevPosition.current = event.clientX;
|
prevPosition.current = event.clientX;
|
||||||
|
|
||||||
|
window.getSelection().removeAllRanges();
|
||||||
|
document.body.classList.add(globalStyles.dragScrolling);
|
||||||
},
|
},
|
||||||
[wrapper],
|
[wrapper],
|
||||||
);
|
);
|
||||||
|
|
||||||
const handleWindowMouseMove = useCallback(
|
const handleWindowMouseMove = useCallback(
|
||||||
(event) => {
|
(event) => {
|
||||||
if (!prevPosition.current) {
|
if (prevPosition.current === null) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -97,8 +100,13 @@ const Board = React.memo(
|
|||||||
[prevPosition],
|
[prevPosition],
|
||||||
);
|
);
|
||||||
|
|
||||||
const handleWindowMouseUp = useCallback(() => {
|
const handleWindowMouseRelease = useCallback(() => {
|
||||||
|
if (prevPosition.current === null) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
prevPosition.current = null;
|
prevPosition.current = null;
|
||||||
|
document.body.classList.remove(globalStyles.dragScrolling);
|
||||||
}, [prevPosition]);
|
}, [prevPosition]);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
@@ -116,14 +124,20 @@ const Board = React.memo(
|
|||||||
}, [listIds, isListAddOpened]);
|
}, [listIds, isListAddOpened]);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
window.addEventListener('mouseup', handleWindowMouseUp);
|
|
||||||
window.addEventListener('mousemove', handleWindowMouseMove);
|
window.addEventListener('mousemove', handleWindowMouseMove);
|
||||||
|
|
||||||
|
window.addEventListener('mouseup', handleWindowMouseRelease);
|
||||||
|
window.addEventListener('blur', handleWindowMouseRelease);
|
||||||
|
window.addEventListener('contextmenu', handleWindowMouseRelease);
|
||||||
|
|
||||||
return () => {
|
return () => {
|
||||||
window.removeEventListener('mouseup', handleWindowMouseUp);
|
|
||||||
window.removeEventListener('mousemove', handleWindowMouseMove);
|
window.removeEventListener('mousemove', handleWindowMouseMove);
|
||||||
|
|
||||||
|
window.removeEventListener('mouseup', handleWindowMouseRelease);
|
||||||
|
window.removeEventListener('blur', handleWindowMouseRelease);
|
||||||
|
window.removeEventListener('contextmenu', handleWindowMouseRelease);
|
||||||
};
|
};
|
||||||
}, [handleWindowMouseUp, handleWindowMouseMove]);
|
}, [handleWindowMouseMove, handleWindowMouseRelease]);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
|
|||||||
@@ -44,7 +44,7 @@ const DescriptionEdit = React.forwardRef(({ children, defaultValue, onUpdate },
|
|||||||
);
|
);
|
||||||
|
|
||||||
const handleChildrenClick = useCallback(() => {
|
const handleChildrenClick = useCallback(() => {
|
||||||
if (!getSelection().toString()) {
|
if (!window.getSelection().toString()) {
|
||||||
open();
|
open();
|
||||||
}
|
}
|
||||||
}, [open]);
|
}, [open]);
|
||||||
|
|||||||
@@ -146,6 +146,11 @@
|
|||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
&.dragScrolling>* {
|
||||||
|
pointer-events: none;
|
||||||
|
user-select: none;
|
||||||
|
}
|
||||||
|
|
||||||
/* Backgrounds */
|
/* Backgrounds */
|
||||||
|
|
||||||
.backgroundBerryRed {
|
.backgroundBerryRed {
|
||||||
|
|||||||
Reference in New Issue
Block a user