feat: add timeout on doublick pointerup

packages/excalidraw/components/App.tsx

@@ -91,6 +91,7 @@ import {
   DEFAULT_REDUCED_GLOBAL_ALPHA,
   isSafari,
   type EXPORT_IMAGE_TYPES,
+  DOUBLE_CLICK_POINTERUP_TIMEOUT,
 } from "../constants";
 import type { ExportedElements } from "../data";
 import { exportCanvas, loadFromBlob } from "../data";
@@ -5349,6 +5350,14 @@ class App extends React.Component<AppProps, AppState> {
   private handleCanvasDoubleClick = (
     event: React.MouseEvent<HTMLCanvasElement>,
   ) => {
+    if (
+      this.lastPointerDownEvent &&
+      event.timeStamp - this.lastPointerDownEvent.timeStamp >
+        DOUBLE_CLICK_POINTERUP_TIMEOUT
+    ) {
+      return;
+    }
+
     // case: double-clicking with arrow/line tool selected would both create
     // text and enter multiElement mode
     if (this.state.multiElement) {
@@ -6279,6 +6288,9 @@ class App extends React.Component<AppProps, AppState> {
     event: React.PointerEvent<HTMLElement>,
   ) => {
     this.maybeCleanupAfterMissingPointerUp(event.nativeEvent);
+
+    this.lastPointerDownEvent = event;
+
     this.maybeUnfollowRemoteUser();
 
     if (this.state.searchMatches) {
@@ -6378,8 +6390,6 @@ class App extends React.Component<AppProps, AppState> {
       return;
     }
 
-    this.lastPointerDownEvent = event;
-
     // we must exit before we set `cursorButton` state and `savePointer`
     // else it will send pointer state & laser pointer events in collab when
     // panning

packages/excalidraw/constants.ts

@@ -255,6 +255,14 @@ export const EXPORT_SOURCE =
 // time in milliseconds
 export const IMAGE_RENDER_TIMEOUT = 500;
 export const TAP_TWICE_TIMEOUT = 300;
+/**
+ * The time the user has from 2nd pointerdown to following pointerup
+ * before it's not considered a double click.
+ *
+ * Helps prevent cases where you double-click by mistake but then drag/keep
+ * the pointer down for to cancel the double click or do another action.
+ */
+export const DOUBLE_CLICK_POINTERUP_TIMEOUT = 300;
 export const TOUCH_CTX_MENU_TIMEOUT = 500;
 export const TITLE_TIMEOUT = 10000;
 export const VERSION_TIMEOUT = 30000;

packages/excalidraw/tests/__snapshots__/history.test.tsx.snap

@@ -940,12 +940,13 @@ History {
               "startBinding": null,
               "width": 100,
               "x": 150,
+              "y": 0,
             },
             "inserted": {
               "endBinding": {
                 "elementId": "id160",
                 "fixedPoint": null,
-                "focus": 0,
+                "focus": "-0.00000",
                 "gap": 1,
               },
               "points": [
@@ -961,11 +962,12 @@ History {
               "startBinding": {
                 "elementId": "id159",
                 "fixedPoint": null,
-                "focus": 0,
+                "focus": "0.00000",
                 "gap": 1,
               },
               "width": 0,
               "x": 149,
+              "y": "0.00000",
             },
           },
         },