[@mantine/hooks] use-move: Fix content on the page being selected whe…

…n cursor moves over the target element (#3069)
mantinedev · Nov 28, 2022 · 10a1af2 · 10a1af2
1 parent 7e4e98a
commit 10a1af2
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 3 deletions.
diff --git a/src/mantine-hooks/src/use-move/use-move.ts b/src/mantine-hooks/src/use-move/use-move.ts
@@ -88,6 +88,7 @@ export function useMove<T extends HTMLElement = HTMLDivElement>(
 
     const onMouseDown = (event: MouseEvent) => {
       startScrubbing();
+      event.preventDefault();
       onMouseMove(event);
     };
 

diff --git a/src/mantine-tiptap/src/RichTextEditor.story.tsx b/src/mantine-tiptap/src/RichTextEditor.story.tsx
@@ -28,6 +28,10 @@ lowlight.registerLanguage('ts', ts);
 
 export default { title: 'TipTap' };
 
+const lorem =
+  'Lorem ipsum, dolor sit amet consectetur adipisicing elit. Veritatis necessitatibus, impedit tempora, provident voluptate aliquid eos eveniet expedita iusto mollitia accusamus illum sunt fugiat quisquam tempore molestias nulla voluptatem cumque!';
+const htmlContent = Array.from({ length: 10 }).fill(`<p>${lorem}</p>`).join('');
+
 function BasicEditor({
   editorProps,
   content,
@@ -51,7 +55,7 @@ function BasicEditor({
         types: ['heading', 'paragraph'],
       }),
     ],
-    content: content || '<p>Hello World!</p>',
+    content: content || htmlContent,
   });
 
   return (
@@ -219,8 +223,6 @@ export function CodeHighlight() {
   );
 }
 
-const lorem =
-  'Lorem ipsum dolor sit amet consectetur adipisicing elit. Harum dicta praesentium perferendis tenetur provident ratione iste, at quo ea enim excepturi, delectus alias nesciunt dolorem. Modi doloremque sed facere nam.';
 const largeContent = Array(20)
   .fill(0)
   .map(() => `<p>${lorem}</p>`)