diff --git a/src/components/App.tsx b/src/components/App.tsx index 83d7b480..dcc89c7e 100644 --- a/src/components/App.tsx +++ b/src/components/App.tsx @@ -171,6 +171,7 @@ import { isLinearElementSimpleAndAlreadyBound, isBindingEnabled, updateBoundElements, + shouldEnableBindingForPointerEvent, } from "../element/binding"; import { MaybeTransformHandleType } from "../element/transformHandles"; @@ -2220,6 +2221,7 @@ class App extends React.Component { } this.clearSelectionIfNotUsingSelection(); + this.updateBindingEnabledOnPointerMove(event); if (this.handleSelectionOnPointerDown(event, pointerDownState)) { return; @@ -3484,6 +3486,15 @@ class App extends React.Component { }); } + private updateBindingEnabledOnPointerMove = ( + event: React.PointerEvent, + ) => { + const shouldEnableBinding = shouldEnableBindingForPointerEvent(event); + if (this.state.isBindingEnabled !== shouldEnableBinding) { + this.setState({ isBindingEnabled: shouldEnableBinding }); + } + }; + private maybeSuggestBindingAtCursor = (pointerCoords: { x: number; y: number; diff --git a/src/element/binding.ts b/src/element/binding.ts index 5599866c..deb1cc0e 100644 --- a/src/element/binding.ts +++ b/src/element/binding.ts @@ -21,6 +21,7 @@ import { mutateElement } from "./mutateElement"; import Scene from "../scene/Scene"; import { LinearElementEditor } from "./linearElementEditor"; import { tupleToCoors } from "../utils"; +import { KEYS } from "../keys"; export type SuggestedBinding = | NonDeleted @@ -32,6 +33,12 @@ export type SuggestedPointBinding = [ NonDeleted, ]; +export const shouldEnableBindingForPointerEvent = ( + event: React.PointerEvent, +) => { + return !event[KEYS.CTRL_OR_CMD]; +}; + export const isBindingEnabled = (appState: AppState): boolean => { return appState.isBindingEnabled; }; diff --git a/src/tests/__snapshots__/regressionTests.test.tsx.snap b/src/tests/__snapshots__/regressionTests.test.tsx.snap index 20a22091..93fbb5e8 100644 --- a/src/tests/__snapshots__/regressionTests.test.tsx.snap +++ b/src/tests/__snapshots__/regressionTests.test.tsx.snap @@ -907,7 +907,7 @@ Object { "exportBackground": true, "gridSize": null, "height": 768, - "isBindingEnabled": true, + "isBindingEnabled": false, "isCollaborating": false, "isLibraryOpen": false, "isLoading": false,