diff --git a/packages/common/src/constants.ts b/packages/common/src/constants.ts index dc47dbaa61..81153621f3 100644 --- a/packages/common/src/constants.ts +++ b/packages/common/src/constants.ts @@ -516,4 +516,4 @@ export enum UserIdleState { */ export const LINE_POLYGON_POINT_MERGE_DISTANCE = 20; -export const BIND_MODE_TIMEOUT = 1000; // ms +export const BIND_MODE_TIMEOUT = 1500; // ms diff --git a/packages/element/src/dragElements.ts b/packages/element/src/dragElements.ts index 254b7d84d7..4b17ba20c3 100644 --- a/packages/element/src/dragElements.ts +++ b/packages/element/src/dragElements.ts @@ -13,7 +13,7 @@ import type { import type { NonDeletedExcalidrawElement } from "@excalidraw/element/types"; -import { bindOrUnbindLinearElement, updateBoundElements } from "./binding"; +import { updateBoundElements } from "./binding"; import { getCommonBounds } from "./bounds"; import { getPerfectElementSize } from "./sizeHelpers"; import { getBoundTextElement } from "./textElement"; @@ -102,26 +102,9 @@ export const dragSelectedElements = ( gridSize, ); - const elementsToUpdateIds = new Set( - Array.from(elementsToUpdate, (el) => el.id), - ); - elementsToUpdate.forEach((element) => { - const isArrow = !isArrowElement(element); - const isStartBoundElementSelected = - isArrow || - (element.startBinding - ? elementsToUpdateIds.has(element.startBinding.elementId) - : false); - const isEndBoundElementSelected = - isArrow || - (element.endBinding - ? elementsToUpdateIds.has(element.endBinding.elementId) - : false); - + updateElementCoords(pointerDownState, element, scene, adjustedOffset); if (!isArrowElement(element)) { - updateElementCoords(pointerDownState, element, scene, adjustedOffset); - // skip arrow labels since we calculate its position during render const textElement = getBoundTextElement( element, @@ -135,33 +118,9 @@ export const dragSelectedElements = ( adjustedOffset, ); } - updateBoundElements(element, scene, { simultaneouslyUpdated: Array.from(elementsToUpdate), }); - } else if ( - // NOTE: Add a little initial drag to the arrow dragging to avoid - // accidentally unbinding the arrow when the user just wants to select it. - Math.max(Math.abs(adjustedOffset.x), Math.abs(adjustedOffset.y)) > 1 - ) { - updateElementCoords(pointerDownState, element, scene, adjustedOffset); - - const shouldUnbindStart = - element.startBinding && !isStartBoundElementSelected; - const shouldUnbindEnd = element.endBinding && !isEndBoundElementSelected; - - if (shouldUnbindStart || shouldUnbindEnd) { - // NOTE: Moving the bound arrow should unbind it, otherwise we would - // have weird situations, like 0 lenght arrow when the user moves - // the arrow outside a filled shape suddenly forcing the arrow start - // and end point to jump "outside" the shape. - bindOrUnbindLinearElement( - element, - shouldUnbindStart ? null : "keep", - shouldUnbindEnd ? null : "keep", - scene, - ); - } } }); }; diff --git a/packages/excalidraw/components/App.tsx b/packages/excalidraw/components/App.tsx index 018924c5a4..5b910b921a 100644 --- a/packages/excalidraw/components/App.tsx +++ b/packages/excalidraw/components/App.tsx @@ -235,7 +235,6 @@ import { isLineElement, isSimpleArrow, getOutlineAvoidingPoint, - bindOrUnbindLinearElement, } from "@excalidraw/element"; import type { GlobalPoint, LocalPoint, Radians } from "@excalidraw/math"; @@ -4398,14 +4397,6 @@ class App extends React.Component { { informMutation: false, isDragging: false }, ); - if (isSimpleArrow(element)) { - // NOTE: Moving the bound arrow should unbind it, otherwise we would - // have weird situations, like 0 lenght arrow when the user moves - // the arrow outside a filled shape suddenly forcing the arrow start - // and end point to jump "outside" the shape. - bindOrUnbindLinearElement(element, null, null, this.scene); - } - updateBoundElements(element, this.scene, { simultaneouslyUpdated: selectedElements, }); @@ -6000,6 +5991,7 @@ class App extends React.Component { ); const avoidancePoint = + multiElement && hoveredElement && getOutlineAvoidingPoint( multiElement, @@ -8340,6 +8332,7 @@ class App extends React.Component { if (this.state.bindMode === "focus") { const pointerMovementDistance = Math.hypot( (this.lastPointerMoveCoords?.x ?? Infinity) - pointerCoords.x, + (this.lastPointerMoveCoords?.y ?? Infinity) - pointerCoords.y, ); if (this.bindModeHandler && pointerMovementDistance < 1) { clearTimeout(this.bindModeHandler);