From 6f8533df5d412147f906b288f933e5813c24a9e9 Mon Sep 17 00:00:00 2001
From: Steve Ruiz <steveruizok@gmail.com>
Date: Tue, 6 Jun 2023 12:30:52 +0100
Subject: [PATCH] [fix] control click on mac (#1535)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

This PR fixes control click for right click on Mac.

### Change Type

- [x] `patch` — Bug Fix

### Test Plan

1. On a PC, ensure that control clicking does not select the thing under
your cursor
2. On a mac, ensure that control clicking does select the thing under
your cursor before the context menu opens

### Release Notes

- Fix control click to open menu on Mac
---
 packages/editor/src/lib/app/Editor.ts                  |  5 ++++-
 .../src/lib/app/tools/SelectTool/children/Idle.ts      | 10 ++++++++++
 2 files changed, 14 insertions(+), 1 deletion(-)

diff --git a/packages/editor/src/lib/app/Editor.ts b/packages/editor/src/lib/app/Editor.ts
index 26cc22e39..0a475ef63 100644
--- a/packages/editor/src/lib/app/Editor.ts
+++ b/packages/editor/src/lib/app/Editor.ts
@@ -3593,7 +3593,7 @@ export class Editor extends EventEmitter<TLEventMap> {
 			shiftKey: this.inputs.shiftKey,
 			ctrlKey: this.inputs.ctrlKey,
 			altKey: this.inputs.altKey,
-			code: 'CtrlLeft',
+			code: 'ControlLeft',
 		})
 	}
 
@@ -3980,6 +3980,9 @@ export class Editor extends EventEmitter<TLEventMap> {
 					break
 				}
 				case 'keyboard': {
+					// please, please
+					if (info.code === 'ControlRight') info.code = 'ControlLeft'
+
 					switch (info.name) {
 						case 'key_down': {
 							// Add the key from the keys set
diff --git a/packages/editor/src/lib/app/tools/SelectTool/children/Idle.ts b/packages/editor/src/lib/app/tools/SelectTool/children/Idle.ts
index 1e3e65540..bc253a7f4 100644
--- a/packages/editor/src/lib/app/tools/SelectTool/children/Idle.ts
+++ b/packages/editor/src/lib/app/tools/SelectTool/children/Idle.ts
@@ -12,6 +12,8 @@ import { StateNode } from '../../StateNode'
 export class Idle extends StateNode {
 	static override id = 'idle'
 
+	isDarwin = window.navigator.userAgent.toLowerCase().indexOf('mac') > -1
+
 	onPointerEnter: TLEventHandlers['onPointerEnter'] = (info) => {
 		switch (info.target) {
 			case 'canvas': {
@@ -61,9 +63,17 @@ export class Idle extends StateNode {
 		const shouldEnterCropMode = this.shouldEnterCropMode(info, true)
 
 		if (info.ctrlKey && !shouldEnterCropMode) {
+			// On Mac, you can right click using the Control keys + Click.
+			if (info.target === 'shape' && this.isDarwin && this.editor.inputs.keys.has('ControlLeft')) {
+				if (!this.editor.isShapeOrAncestorLocked(info.shape)) {
+					this.parent.transition('pointing_shape', info)
+					return
+				}
+			}
 			this.parent.transition('brushing', info)
 			return
 		}
+
 		switch (info.target) {
 			case 'canvas': {
 				this.parent.transition('pointing_canvas', info)