Fix multi-point arrow grid off

This commit is contained in:
Mark Tolmacs 2025-06-23 15:20:13 +02:00
parent 087353e06a
commit 71cfd1d82d
No known key found for this signature in database

View File

@ -233,7 +233,6 @@ import {
isLineElement, isLineElement,
isSimpleArrow, isSimpleArrow,
getOutlineAvoidingPoint, getOutlineAvoidingPoint,
isExcalidrawElement,
} from "@excalidraw/element"; } from "@excalidraw/element";
import type { GlobalPoint, LocalPoint, Radians } from "@excalidraw/math"; import type { GlobalPoint, LocalPoint, Radians } from "@excalidraw/math";
@ -5950,19 +5949,45 @@ class App extends React.Component<AppProps, AppState> {
{ informMutation: false, isDragging: false }, { informMutation: false, isDragging: false },
); );
} else { } else {
const elbowed = isElbowArrow(multiElement);
const hoveredElement =
!elbowed &&
getHoveredElementForBinding(
{
x: scenePointerX,
y: scenePointerY,
},
this.scene.getNonDeletedElements(),
this.scene.getNonDeletedElementsMap(),
this.state.zoom,
false,
false,
);
const [gridX, gridY] = getGridPoint( const [gridX, gridY] = getGridPoint(
scenePointerX, scenePointerX,
scenePointerY, scenePointerY,
event[KEYS.CTRL_OR_CMD] || isElbowArrow(multiElement) event[KEYS.CTRL_OR_CMD] || elbowed || hoveredElement
? null ? null
: this.getEffectiveGridSize(), : this.getEffectiveGridSize(),
); );
const avoidancePoint =
hoveredElement &&
getOutlineAvoidingPoint(
multiElement,
hoveredElement,
pointFrom<GlobalPoint>(scenePointerX, scenePointerY),
multiElement.points.length - 1,
this.scene.getNonDeletedElementsMap(),
);
const [lastCommittedX, lastCommittedY] = const [lastCommittedX, lastCommittedY] =
multiElement?.lastCommittedPoint ?? [0, 0]; multiElement?.lastCommittedPoint ?? [0, 0];
let dxFromLastCommitted = gridX - rx - lastCommittedX; let dxFromLastCommitted =
let dyFromLastCommitted = gridY - ry - lastCommittedY; (avoidancePoint ? avoidancePoint[0] : gridX) - rx - lastCommittedX;
let dyFromLastCommitted =
(avoidancePoint ? avoidancePoint[1] : gridY) - ry - lastCommittedY;
if (shouldRotateWithDiscreteAngle(event)) { if (shouldRotateWithDiscreteAngle(event)) {
({ width: dxFromLastCommitted, height: dyFromLastCommitted } = ({ width: dxFromLastCommitted, height: dyFromLastCommitted } =
@ -8752,7 +8777,7 @@ class App extends React.Component<AppProps, AppState> {
if ( if (
!isElbowArrow(newElement) && !isElbowArrow(newElement) &&
isExcalidrawElement(startBindingElement) && this.state.editingLinearElement &&
isBindingElement(newElement, false) isBindingElement(newElement, false)
) { ) {
// Handles the case where we need to "jump out" the simple arrow // Handles the case where we need to "jump out" the simple arrow
@ -8766,13 +8791,17 @@ class App extends React.Component<AppProps, AppState> {
isElbowArrow(newElement), isElbowArrow(newElement),
); );
const arrowIsInsideTheSameElement = const arrowIsInsideTheSameElement =
startBindingElement &&
startBindingElement !== "keep" &&
hoveredElement?.id === startBindingElement.id; hoveredElement?.id === startBindingElement.id;
if (!arrowIsInsideTheSameElement) { if (!arrowIsInsideTheSameElement) {
const [outlinePointX, outlinePointY] = getOutlineAvoidingPoint( const [outlinePointX, outlinePointY] = getOutlineAvoidingPoint(
newElement, newElement,
hoveredElement, hoveredElement,
pointFrom(gridX, gridY), hoveredElement
? pointFrom(pointerCoords.x, pointerCoords.y)
: pointFrom(gridX, gridY),
newElement.points.length - 1, newElement.points.length - 1,
elementsMap, elementsMap,
); );