fix: Arrow update when cloned (#10747)

* fix: Arrow update when cloned

Signed-off-by: Mark Tolmacs <[email protected]>

* feat(editor): reduce binding gap (#10739)

* feat(editor): reduce binding gap to 7px

* feat(editor): reduce binding gap to 5px

* feat(editor): reduce binding gap to 3px

* go back to 5px

* update tests

* chore: Refactor

Signed-off-by: Mark Tolmacs <[email protected]>

* fix: Align focus points

Signed-off-by: Mark Tolmacs <[email protected]>

---------

Signed-off-by: Mark Tolmacs <[email protected]>
Co-authored-by: David Luzar <[email protected]>

packages/element/src/align.ts

@@ -43,6 +43,7 @@ export const alignElements = (
       // update bound elements
       updateBoundElements(element, scene, {
         simultaneouslyUpdated: group,
+        indirectArrowUpdate: true,
       });
       return updatedEle;
     });

packages/element/src/binding.ts

@@ -1081,6 +1081,7 @@ export const updateBoundElements = (
   options?: {
     simultaneouslyUpdated?: readonly ExcalidrawElement[];
     changedElements?: Map<string, ExcalidrawElement>;
+    indirectArrowUpdate?: boolean;
   },
 ) => {
   if (!isBindableElement(changedElement)) {
@@ -1100,7 +1101,7 @@ export const updateBoundElements = (
     });
   }
 
-  boundElementsVisitor(elementsMap, changedElement, (element) => {
+  const visitor = (element: ExcalidrawElement | undefined) => {
     if (!isArrowElement(element) || element.isDeleted) {
       return;
     }
@@ -1172,7 +1173,14 @@ export const updateBoundElements = (
     if (boundText && !boundText.isDeleted) {
       handleBindTextResize(element, scene, false);
     }
-  });
+  };
+
+  boundElementsVisitor(elementsMap, changedElement, visitor);
+
+  if (options?.indirectArrowUpdate) {
+    boundElementsVisitor(elementsMap, changedElement, visitor);
+    boundElementsVisitor(elementsMap, changedElement, visitor);
+  }
 };
 
 const updateArrowBindings = (

packages/excalidraw/components/App.tsx

@@ -9595,7 +9595,9 @@ class App extends React.Component<AppProps, AppState> {
                   isBindableElement(element) &&
                   element.boundElements?.some((other) => other.type === "arrow")
                 ) {
-                  updateBoundElements(element, this.scene);
+                  updateBoundElements(element, this.scene, {
+                    indirectArrowUpdate: true,
+                  });
                 }
               });