From a253af95d9d8c669604c1ee4518170dfc92487bf Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Mime=20=C4=8Cuvalo?= <mimecuvalo@gmail.com>
Date: Wed, 17 Apr 2024 10:34:23 +0100
Subject: [PATCH] textfields: on mobile edit->edit, allow going to empty geo
 (#3469)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

(this is a PR redo of https://github.com/tldraw/tldraw/pull/3424 which
got messed up a bit)

It doesn't quite feel like this is the right fix but it does solve the
issue. I was trying to see if `getShapeAtPoint` needed more work but the
further I went in that rabbit hole it seemed like I shouldn't touch that
code without causing a bunch of disruption at the moment.

Specifically, the code that does `Check labels first` in Editor.ts is a
little obscure (lines 4384-4397). It only checks a couple specifics
shapes (with certain combinations, i.e. a geo with "none" fill) _and_ it
doesn't check `hitLabels` which also maybe feels wrong? I tried
unraveling it but there's a lot of code relying on it at the moment to
mess with it in the stickies work.
(I was looking at https://github.com/tldraw/tldraw/pull/1910 and
https://github.com/tldraw/tldraw/pull/1806 for historical context fwiw)

Before:


https://github.com/tldraw/tldraw/assets/469604/b263a192-2085-4ffb-9e47-6e9c32abe1f9



After:


https://github.com/tldraw/tldraw/assets/469604/5b0b422b-dd5c-4593-9ac5-dec595923ea6



### Change Type

<!-- ❗ Please select a 'Scope' label ❗️ -->

- [x] `sdk` — Changes the tldraw SDK
- [ ] `dotcom` — Changes the tldraw.com web app
- [ ] `docs` — Changes to the documentation, examples, or templates.
- [ ] `vs code` — Changes to the vscode plugin
- [ ] `internal` — Does not affect user-facing stuff

<!-- ❗ Please select a 'Type' label ❗️ -->

- [x] `bugfix` — Bug fix
- [ ] `feature` — New feature
- [ ] `improvement` — Improving existing features
- [ ] `chore` — Updating dependencies, other boring stuff
- [ ] `galaxy brain` — Architectural changes
- [ ] `tests` — Changes to any test code
- [ ] `tools` — Changes to infrastructure, CI, internal scripts,
debugging tools, etc.
- [ ] `dunno` — I don't know
---
 packages/editor/src/lib/editor/Editor.ts              |  2 ++
 .../lib/tools/SelectTool/childStates/EditingShape.ts  | 11 +++--------
 .../selection-logic/getHitShapeOnCanvasPointerDown.ts |  7 +++++--
 3 files changed, 10 insertions(+), 10 deletions(-)

diff --git a/packages/editor/src/lib/editor/Editor.ts b/packages/editor/src/lib/editor/Editor.ts
index 435692885..8a0ae7235 100644
--- a/packages/editor/src/lib/editor/Editor.ts
+++ b/packages/editor/src/lib/editor/Editor.ts
@@ -4269,6 +4269,8 @@ export class Editor extends EventEmitter<TLEventMap> {
 			renderingOnly?: boolean
 			margin?: number
 			hitInside?: boolean
+			// TODO: we probably need to rename this, we don't quite _always_
+			// respect this esp. in the part below that does "Check labels first"
 			hitLabels?: boolean
 			hitFrameInside?: boolean
 			filter?: (shape: TLShape) => boolean
diff --git a/packages/tldraw/src/lib/tools/SelectTool/childStates/EditingShape.ts b/packages/tldraw/src/lib/tools/SelectTool/childStates/EditingShape.ts
index 759cd480a..a1d799c6a 100644
--- a/packages/tldraw/src/lib/tools/SelectTool/childStates/EditingShape.ts
+++ b/packages/tldraw/src/lib/tools/SelectTool/childStates/EditingShape.ts
@@ -55,7 +55,7 @@ export class EditingShape extends StateNode {
 
 		switch (info.target) {
 			case 'canvas': {
-				const hitShape = getHitShapeOnCanvasPointerDown(this.editor)
+				const hitShape = getHitShapeOnCanvasPointerDown(this.editor, true /* hitLabels */)
 				if (hitShape) {
 					this.onPointerDown({
 						...info,
@@ -144,13 +144,8 @@ export class EditingShape extends StateNode {
 
 		this.editor.select(hitShape.id)
 
-		if (this.editor.getInstanceState().isCoarsePointer) {
-			this.editor.setEditingShape(null)
-			this.editor.setCurrentTool('select.idle')
-		} else {
-			this.editor.setEditingShape(hitShape.id)
-			updateHoveredId(this.editor)
-		}
+		this.editor.setEditingShape(hitShape.id)
+		updateHoveredId(this.editor)
 	}
 
 	override onComplete: TLEventHandlers['onComplete'] = (info) => {
diff --git a/packages/tldraw/src/lib/tools/selection-logic/getHitShapeOnCanvasPointerDown.ts b/packages/tldraw/src/lib/tools/selection-logic/getHitShapeOnCanvasPointerDown.ts
index 7d1c8344e..6e47d8322 100644
--- a/packages/tldraw/src/lib/tools/selection-logic/getHitShapeOnCanvasPointerDown.ts
+++ b/packages/tldraw/src/lib/tools/selection-logic/getHitShapeOnCanvasPointerDown.ts
@@ -1,6 +1,9 @@
 import { Editor, HIT_TEST_MARGIN, TLShape } from '@tldraw/editor'
 
-export function getHitShapeOnCanvasPointerDown(editor: Editor): TLShape | undefined {
+export function getHitShapeOnCanvasPointerDown(
+	editor: Editor,
+	hitLabels = false
+): TLShape | undefined {
 	const zoomLevel = editor.getZoomLevel()
 	const {
 		inputs: { currentPagePoint },
@@ -10,7 +13,7 @@ export function getHitShapeOnCanvasPointerDown(editor: Editor): TLShape | undefi
 		// hovered shape at point
 		editor.getShapeAtPoint(currentPagePoint, {
 			hitInside: false,
-			hitLabels: false,
+			hitLabels,
 			margin: HIT_TEST_MARGIN / zoomLevel,
 			renderingOnly: true,
 		}) ??