Cleanup touch handling a bit

glideapps · Mar 15, 2022 · 0d43bbc · 0d43bbc
1 parent e3afabc
commit 0d43bbc
Show file tree

Hide file tree

Showing 2 changed files with 27 additions and 20 deletions.
diff --git a/packages/core/src/data-editor/data-editor.tsx b/packages/core/src/data-editor/data-editor.tsx
@@ -1090,13 +1090,18 @@ const DataEditorImpl: React.ForwardRefRenderFunction<DataEditorRef, DataEditorPr
             };
 
             if (args.isTouch) {
-                if (
-                    visibleRegionRef.current.x === downScrollPosition.current.x &&
-                    visibleRegionRef.current.y === downScrollPosition.current.y
-                ) {
-                    if (args.kind === "cell" && !handleMaybeClick(args)) {
+                const vr = visibleRegionRef.current;
+                if (vr.x !== downScrollPosition.current.x || vr.y !== downScrollPosition.current.y) {
+                    // we scrolled, abort
+                    return;
+                }
+                if (args.kind === "cell") {
+                    // click that cell
+                    if (!handleMaybeClick(args)) {
                         handleSelect(args);
                     }
+                } else {
+                    handleSelect(args);
                 }
                 return;
             }
@@ -1117,16 +1122,15 @@ const DataEditorImpl: React.ForwardRefRenderFunction<DataEditorRef, DataEditorPr
                 }
             }
 
-            if (args.kind !== "cell") {
-                return;
-            }
-            if (args.button === 0) {
-                handleMaybeClick(args);
-            } else if (args.button === 2) {
-                onCellContextMenu?.([args.location[0] - rowMarkerOffset, args.location[1]], {
-                    ...args,
-                    preventDefault,
-                });
+            if (args.kind === "cell") {
+                if (args.button === 0) {
+                    handleMaybeClick(args);
+                } else if (args.button === 2) {
+                    onCellContextMenu?.([args.location[0] - rowMarkerOffset, args.location[1]], {
+                        ...args,
+                        preventDefault,
+                    });
+                }
             }
         },
         [

diff --git a/packages/core/src/data-grid/data-grid.tsx b/packages/core/src/data-grid/data-grid.tsx
@@ -747,7 +747,10 @@ const DataGrid: React.ForwardRefRenderFunction<DataGridRef, DataGridProps> = (p,
             }
 
             onMouseDown?.(args);
-            ev.preventDefault();
+            if (!args.isTouch) {
+                // preventing default in touch events stops scroll
+                ev.preventDefault();
+            }
         },
         [eventTargetRef, getMouseArgsForPosition, groupHeaderActionForEvent, isOverHeaderMenu, onMouseDown]
     );
@@ -762,10 +765,6 @@ const DataGrid: React.ForwardRefRenderFunction<DataGridRef, DataGridProps> = (p,
 
             const isOutside = ev.target !== canvas && ev.target !== eventTarget;
 
-            if (!isOutside) {
-                ev.preventDefault();
-            }
-
             let clientX: number;
             let clientY: number;
             if (ev instanceof MouseEvent) {
@@ -778,6 +777,10 @@ const DataGrid: React.ForwardRefRenderFunction<DataGridRef, DataGridProps> = (p,
 
             const args = getMouseArgsForPosition(canvas, clientX, clientY, ev);
 
+            if (!isOutside && ev.cancelable) {
+                ev.preventDefault();
+            }
+
             if (args.kind === "header" && isOverHeaderMenu(canvas, args.location[0], clientX, clientY)) {
                 const [col] = args.location;
                 const headerBounds = isOverHeaderMenu(canvas, col, clientX, clientY);