diff --git a/packages/excalidraw/components/App.tsx b/packages/excalidraw/components/App.tsx index 4174011b7..dad291f24 100644 --- a/packages/excalidraw/components/App.tsx +++ b/packages/excalidraw/components/App.tsx @@ -370,7 +370,11 @@ import { actionRemoveAllElementsFromFrame, actionSelectAllElementsInFrame, } from "../actions/actionFrame"; -import { actionToggleHandTool, zoomToFit } from "../actions/actionCanvas"; +import { + actionToggleEraserTool, + actionToggleHandTool, + zoomToFit, +} from "../actions/actionCanvas"; import { jotaiStore } from "../jotai"; import { activeConfirmDialogAtom } from "./ActiveConfirmDialog"; import { ImageSceneDataError } from "../errors"; @@ -4867,6 +4871,7 @@ class App extends React.Component { }); }; + private debounceDoubleClickTimestamp: number = 0; private handleCanvasDoubleClick = ( event: React.MouseEvent, ) => { @@ -4875,6 +4880,24 @@ class App extends React.Component { if (this.state.multiElement) { return; } + + const now = Date.now(); + if (now - this.debounceDoubleClickTimestamp < 200) { + //handleCanvasDoubleClick click fires twice in case of touch. + //Once from the onTouchStart event handler, once from the double click event handler + return; + } + this.debounceDoubleClickTimestamp = now; + + if ( + this.state.penMode && + this.lastPointerDownEvent?.pointerType === "touch" && + this.state.activeTool.type !== "selection" + ) { + this.updateScene(actionToggleEraserTool.perform([] as any, this.state)); + return; + } + // we should only be able to double click when mode is selection if (this.state.activeTool.type !== "selection") { return;