New simple arrows stick to outline as well

packages/element/src/linearElementEditor.ts

@@ -239,6 +239,43 @@ export class LinearElementEditor {
     });
   }
 
+  static getOutlineAvoidingPoint(
+    element: NonDeleted<ExcalidrawLinearElement>,
+    coords: { x: number; y: number },
+    pointIndex: number,
+    app: AppClassProperties,
+  ): GlobalPoint {
+    const elbowed = isElbowArrow(element);
+    const hoveredElement = getHoveredElementForBinding(
+      coords,
+      app.scene.getNonDeletedElements(),
+      app.scene.getNonDeletedElementsMap(),
+      app.state.zoom,
+      elbowed,
+      elbowed,
+    );
+    const p = pointFrom<GlobalPoint>(coords.x, coords.y);
+
+    if (hoveredElement) {
+      const newPoints = Array.from(element.points);
+      newPoints[pointIndex] = pointFrom<LocalPoint>(
+        p[0] - element.x,
+        p[1] - element.y,
+      );
+
+      return bindPointToSnapToElementOutline(
+        {
+          ...element,
+          points: newPoints,
+        },
+        hoveredElement,
+        pointIndex === 0 ? "start" : "end",
+      );
+    }
+
+    return p;
+  }
+
   /**
    * @returns whether point was dragged
    */
@@ -352,33 +389,16 @@ export class LinearElementEditor {
                 pointIndex === 0 ||
                 pointIndex === element.points.length - 1
               ) {
-                const hoveredElement = getHoveredElementForBinding(
-                  {
-                    x: scenePointerX,
-                    y: scenePointerY,
-                  },
-                  app.scene.getNonDeletedElements(),
-                  app.scene.getNonDeletedElementsMap(),
-                  app.state.zoom,
-                  elbowed,
-                  elbowed,
-                );
-
-                if (hoveredElement) {
-                  const newPoints = Array.from(element.points);
-                  newPoints[pointIndex] = pointFrom(
-                    element.points[pointIndex][0] + deltaX,
-                    element.points[pointIndex][1] + deltaY,
-                  );
-                  globalNewPointPosition = bindPointToSnapToElementOutline(
+                globalNewPointPosition =
+                  LinearElementEditor.getOutlineAvoidingPoint(
+                    element,
                     {
-                      ...element,
-                      points: newPoints,
+                      x: element.x + element.points[pointIndex][0] + deltaX,
+                      y: element.y + element.points[pointIndex][1] + deltaY,
                     },
-                    hoveredElement,
-                    pointIndex === 0 ? "start" : "end",
+                    pointIndex,
+                    app,
                   );
-                }
               }
 
               newPointPosition = LinearElementEditor.createPointAt(

packages/excalidraw/components/App.tsx

@@ -8683,10 +8683,22 @@ class App extends React.Component<AppProps, AppState> {
             points.length === 2 ||
             (points.length > 1 && isElbowArrow(newElement))
           ) {
+            const globalPoint = LinearElementEditor.getOutlineAvoidingPoint(
+              newElement,
+              { x: newElement.x + dx, y: newElement.y + dy },
+              1,
+              this,
+            );
             mutateElement(
               newElement,
               {
-                points: [...points.slice(0, -1), pointFrom<LocalPoint>(dx, dy)],
+                points: [
+                  ...points.slice(0, -1),
+                  pointFrom<LocalPoint>(
+                    globalPoint[0] - newElement.x,
+                    globalPoint[1] - newElement.y,
+                  ),
+                ],
               },
               false,
               { isDragging: true },