1
0
Fork 0
mirror of https://github.com/plankanban/planka.git synced 2025-07-19 05:09:43 +02:00

fix: Disable text selection when drag-scrolling

This commit is contained in:
Maksim Eltyshev 2024-11-22 16:17:14 +01:00
parent 7b48f698a8
commit a0824e54c1
3 changed files with 25 additions and 6 deletions

View file

@ -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 (
<> <>

View file

@ -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]);

View file

@ -146,6 +146,11 @@
pointer-events: none; pointer-events: none;
} }
&.dragScrolling>* {
pointer-events: none;
user-select: none;
}
/* Backgrounds */ /* Backgrounds */
.backgroundBerryRed { .backgroundBerryRed {