@tldraw/editor 4.2.2 → 4.2.3

package/src/lib/editor/managers/EdgeScrollManager/EdgeScrollManager.test.ts

@@ -18,56 +18,8 @@ describe('EdgeScrollManager', () => {
 		}
 	>
 	let edgeScrollManager: EdgeScrollManager
-	let mockInputs: {
-		_currentScreenPoint: Vec
-		currentScreenPoint: Vec
-		getCurrentScreenPoint(): Vec
-		setCurrentScreenPoint(value: Vec): void
-		_isDragging: boolean
-		isDragging: boolean
-		getIsDragging(): boolean
-		setIsDragging(value: boolean): void
-		_isPanning: boolean
-		isPanning: boolean
-		getIsPanning(): boolean
-		setIsPanning(value: boolean): void
-	}
 
 	beforeEach(() => {
-		// Create a mock inputs object with writable properties and getters
-		mockInputs = {
-			_currentScreenPoint: new Vec(500, 300),
-			get currentScreenPoint() {
-				return this._currentScreenPoint
-			},
-			getCurrentScreenPoint() {
-				return this._currentScreenPoint
-			},
-			setCurrentScreenPoint(value: Vec) {
-				this._currentScreenPoint = value
-			},
-			_isDragging: true,
-			get isDragging() {
-				return this._isDragging
-			},
-			getIsDragging() {
-				return this._isDragging
-			},
-			setIsDragging(value: boolean) {
-				this._isDragging = value
-			},
-			_isPanning: false,
-			get isPanning() {
-				return this._isPanning
-			},
-			getIsPanning() {
-				return this._isPanning
-			},
-			setIsPanning(value: boolean) {
-				this._isPanning = value
-			},
-		}
-
 		editor = {
 			options: {
 				edgeScrollDelay: 200,
@@ -76,15 +28,22 @@ describe('EdgeScrollManager', () => {
 				edgeScrollDistance: 8,
 				coarsePointerWidth: 12,
 			},
-			inputs: mockInputs as unknown as Editor['inputs'],
+			inputs: {
+				currentScreenPoint: new Vec(500, 300),
+				isDragging: true,
+				isPanning: false,
+			},
 			user: {
 				getEdgeScrollSpeed: vi.fn(() => 1),
 			},
 			getViewportScreenBounds: vi.fn(() => new Box(0, 0, 1000, 600)),
-			getInstanceState: vi.fn(() => ({
-				isCoarsePointer: false,
-				insets: [false, false, false, false], // [top, right, bottom, left]
-			})),
+			getInstanceState: vi.fn(
+				() =>
+					({
+						isCoarsePointer: false,
+						insets: [false, false, false, false], // [top, right, bottom, left]
+					}) as any
+			),
 			getCameraOptions: vi.fn(() => ({
 				isLocked: false,
 				panSpeed: 1,
@@ -95,17 +54,9 @@ describe('EdgeScrollManager', () => {
 			getZoomLevel: vi.fn(() => 1),
 			getCamera: vi.fn(() => new Vec(0, 0, 1)),
 			setCamera: vi.fn(),
-		} as unknown as Mocked<
-			Editor & {
-				user: { getEdgeScrollSpeed: Mock }
-				getCamera: Mock
-				getCameraOptions: Mock
-				getZoomLevel: Mock
-				getViewportScreenBounds: Mock
-			}
-		>
+		} as any
 
-		edgeScrollManager = new EdgeScrollManager(editor)
+		edgeScrollManager = new EdgeScrollManager(editor as any)
 	})
 
 	afterEach(() => {
@@ -116,45 +67,49 @@ describe('EdgeScrollManager', () => {
 		it('should initialize with editor reference', () => {
 			expect(edgeScrollManager.editor).toBe(editor)
 		})
+
+		it('should initialize edge scrolling state as false', () => {
+			// Access private properties for testing
+			expect((edgeScrollManager as any)._isEdgeScrolling).toBe(false)
+			expect((edgeScrollManager as any)._edgeScrollDuration).toBe(-1)
+		})
 	})
 
 	describe('basic edge scrolling behavior', () => {
 		it('should not trigger edge scrolling when pointer is in center', () => {
-			mockInputs.setCurrentScreenPoint(new Vec(500, 300))
+			editor.inputs.currentScreenPoint = new Vec(500, 300)
 
 			edgeScrollManager.updateEdgeScrolling(16)
 
+			expect((edgeScrollManager as any)._isEdgeScrolling).toBe(false)
 			expect(editor.setCamera).not.toHaveBeenCalled()
 		})
 
 		it('should start edge scrolling when pointer is near edge', () => {
-			mockInputs.setCurrentScreenPoint(new Vec(5, 300))
+			editor.inputs.currentScreenPoint = new Vec(5, 300)
 
-			// Should not scroll immediately due to delay
 			edgeScrollManager.updateEdgeScrolling(16)
-			expect(editor.setCamera).not.toHaveBeenCalled()
 
-			// Should scroll after delay
-			edgeScrollManager.updateEdgeScrolling(200)
-			expect(editor.setCamera).toHaveBeenCalled()
+			expect((edgeScrollManager as any)._isEdgeScrolling).toBe(true)
+			expect((edgeScrollManager as any)._edgeScrollDuration).toBe(16)
 		})
 
 		it('should stop edge scrolling when pointer moves away from edge', () => {
-			// Start edge scrolling near edge
-			mockInputs.setCurrentScreenPoint(new Vec(5, 300))
-			edgeScrollManager.updateEdgeScrolling(300)
-			expect(editor.setCamera).toHaveBeenCalled()
+			// Start edge scrolling
+			editor.inputs.currentScreenPoint = new Vec(5, 300)
+			edgeScrollManager.updateEdgeScrolling(16)
+			expect((edgeScrollManager as any)._isEdgeScrolling).toBe(true)
 
-			// Move pointer to center - should stop scrolling
-			editor.setCamera.mockClear()
-			mockInputs.setCurrentScreenPoint(new Vec(500, 300))
+			// Move pointer to center
+			editor.inputs.currentScreenPoint = new Vec(500, 300)
 			edgeScrollManager.updateEdgeScrolling(16)
 
-			expect(editor.setCamera).not.toHaveBeenCalled()
+			expect((edgeScrollManager as any)._isEdgeScrolling).toBe(false)
+			expect((edgeScrollManager as any)._edgeScrollDuration).toBe(0)
 		})
 
 		it('should respect edge scroll delay', () => {
-			mockInputs.setCurrentScreenPoint(new Vec(5, 300))
+			editor.inputs.currentScreenPoint = new Vec(5, 300)
 
 			// First update - should not scroll yet due to delay
 			edgeScrollManager.updateEdgeScrolling(100)
@@ -168,7 +123,7 @@ describe('EdgeScrollManager', () => {
 
 	describe('edge proximity detection', () => {
 		it('should detect left edge proximity', () => {
-			mockInputs.setCurrentScreenPoint(new Vec(5, 300))
+			editor.inputs.currentScreenPoint = new Vec(5, 300)
 			edgeScrollManager.updateEdgeScrolling(300) // Enough to trigger after delay
 
 			expect(editor.setCamera).toHaveBeenCalled()
@@ -177,7 +132,7 @@ describe('EdgeScrollManager', () => {
 		})
 
 		it('should detect right edge proximity', () => {
-			mockInputs.setCurrentScreenPoint(new Vec(995, 300))
+			editor.inputs.currentScreenPoint = new Vec(995, 300)
 			edgeScrollManager.updateEdgeScrolling(300)
 
 			expect(editor.setCamera).toHaveBeenCalled()
@@ -186,7 +141,7 @@ describe('EdgeScrollManager', () => {
 		})
 
 		it('should detect top edge proximity', () => {
-			mockInputs.setCurrentScreenPoint(new Vec(500, 5))
+			editor.inputs.currentScreenPoint = new Vec(500, 5)
 			edgeScrollManager.updateEdgeScrolling(300)
 
 			expect(editor.setCamera).toHaveBeenCalled()
@@ -195,7 +150,7 @@ describe('EdgeScrollManager', () => {
 		})
 
 		it('should detect bottom edge proximity', () => {
-			mockInputs.setCurrentScreenPoint(new Vec(500, 595))
+			editor.inputs.currentScreenPoint = new Vec(500, 595)
 			edgeScrollManager.updateEdgeScrolling(300)
 
 			expect(editor.setCamera).toHaveBeenCalled()
@@ -204,7 +159,7 @@ describe('EdgeScrollManager', () => {
 		})
 
 		it('should handle corner proximity (both x and y)', () => {
-			mockInputs.setCurrentScreenPoint(new Vec(5, 5))
+			editor.inputs.currentScreenPoint = new Vec(5, 5)
 			edgeScrollManager.updateEdgeScrolling(300)
 
 			expect(editor.setCamera).toHaveBeenCalled()
@@ -217,11 +172,11 @@ describe('EdgeScrollManager', () => {
 	describe('coarse pointer handling', () => {
 		it('should account for coarse pointer width', () => {
 			editor.getInstanceState.mockReturnValue({
-				...editor.getInstanceState(),
 				isCoarsePointer: true,
 				insets: [false, false, false, false],
-			})
-			mockInputs.setCurrentScreenPoint(new Vec(15, 300))
+			} as any)
+
+			editor.inputs.currentScreenPoint = new Vec(15, 300)
 			edgeScrollManager.updateEdgeScrolling(300)
 
 			expect(editor.setCamera).toHaveBeenCalled()
@@ -229,11 +184,11 @@ describe('EdgeScrollManager', () => {
 
 		it('should not trigger edge scrolling for fine pointer at same position', () => {
 			editor.getInstanceState.mockReturnValue({
-				...editor.getInstanceState(),
 				isCoarsePointer: false,
 				insets: [false, false, false, false],
-			})
-			mockInputs.setCurrentScreenPoint(new Vec(15, 300))
+			} as any)
+
+			editor.inputs.currentScreenPoint = new Vec(15, 300)
 			edgeScrollManager.updateEdgeScrolling(300)
 
 			expect(editor.setCamera).not.toHaveBeenCalled()
@@ -242,8 +197,8 @@ describe('EdgeScrollManager', () => {
 
 	describe('camera movement conditions', () => {
 		it('should not move camera when not dragging', () => {
-			editor.inputs.setIsDragging(false)
-			mockInputs.setCurrentScreenPoint(new Vec(5, 300))
+			editor.inputs.isDragging = false
+			editor.inputs.currentScreenPoint = new Vec(5, 300)
 
 			edgeScrollManager.updateEdgeScrolling(300)
 
@@ -251,8 +206,8 @@ describe('EdgeScrollManager', () => {
 		})
 
 		it('should not move camera when panning', () => {
-			editor.inputs.setIsPanning(true)
-			mockInputs.setCurrentScreenPoint(new Vec(5, 300))
+			editor.inputs.isPanning = true
+			editor.inputs.currentScreenPoint = new Vec(5, 300)
 
 			edgeScrollManager.updateEdgeScrolling(300)
 
@@ -267,7 +222,7 @@ describe('EdgeScrollManager', () => {
 				zoomSteps: [1],
 				wheelBehavior: 'pan' as const,
 			})
-			mockInputs.setCurrentScreenPoint(new Vec(5, 300))
+			editor.inputs.currentScreenPoint = new Vec(5, 300)
 
 			edgeScrollManager.updateEdgeScrolling(300)
 
@@ -278,7 +233,7 @@ describe('EdgeScrollManager', () => {
 	describe('camera movement calculation', () => {
 		it('should calculate scroll speed based on user preference', () => {
 			editor.user.getEdgeScrollSpeed.mockReturnValue(2)
-			mockInputs.setCurrentScreenPoint(new Vec(5, 300))
+			editor.inputs.currentScreenPoint = new Vec(5, 300)
 
 			edgeScrollManager.updateEdgeScrolling(300)
 
@@ -289,7 +244,7 @@ describe('EdgeScrollManager', () => {
 
 		it('should apply screen size factor for small screens', () => {
 			editor.getViewportScreenBounds.mockReturnValue(new Box(0, 0, 800, 600))
-			mockInputs.setCurrentScreenPoint(new Vec(5, 300))
+			editor.inputs.currentScreenPoint = new Vec(5, 300)
 
 			edgeScrollManager.updateEdgeScrolling(300)
 
@@ -298,7 +253,7 @@ describe('EdgeScrollManager', () => {
 
 		it('should adjust scroll speed based on zoom level', () => {
 			editor.getZoomLevel.mockReturnValue(2)
-			mockInputs.setCurrentScreenPoint(new Vec(5, 300))
+			editor.inputs.currentScreenPoint = new Vec(5, 300)
 
 			edgeScrollManager.updateEdgeScrolling(300)
 
@@ -311,7 +266,7 @@ describe('EdgeScrollManager', () => {
 		it('should add scroll delta to current camera position', () => {
 			const currentCamera = new Vec(100, 200, 1)
 			editor.getCamera.mockReturnValue(currentCamera)
-			mockInputs.setCurrentScreenPoint(new Vec(5, 5))
+			editor.inputs.currentScreenPoint = new Vec(5, 5)
 
 			edgeScrollManager.updateEdgeScrolling(300)
 
@@ -325,14 +280,14 @@ describe('EdgeScrollManager', () => {
 
 	describe('proximity factor calculation', () => {
 		it('should return 0 when not near any edge', () => {
-			mockInputs.setCurrentScreenPoint(new Vec(500, 300))
+			editor.inputs.currentScreenPoint = new Vec(500, 300)
 			edgeScrollManager.updateEdgeScrolling(16)
 
 			expect(editor.setCamera).not.toHaveBeenCalled()
 		})
 
 		it('should cap proximity factor at 1', () => {
-			mockInputs.setCurrentScreenPoint(new Vec(0, 300))
+			editor.inputs.currentScreenPoint = new Vec(0, 300)
 			edgeScrollManager.updateEdgeScrolling(300)
 
 			expect(editor.setCamera).toHaveBeenCalled()
@@ -342,20 +297,20 @@ describe('EdgeScrollManager', () => {
 
 	describe('edge cases and error handling', () => {
 		it('should handle negative elapsed time', () => {
-			mockInputs.setCurrentScreenPoint(new Vec(5, 300))
+			editor.inputs.currentScreenPoint = new Vec(5, 300)
 
 			expect(() => edgeScrollManager.updateEdgeScrolling(-16)).not.toThrow()
 		})
 
 		it('should handle very large elapsed time', () => {
-			mockInputs.setCurrentScreenPoint(new Vec(5, 300))
+			editor.inputs.currentScreenPoint = new Vec(5, 300)
 
 			expect(() => edgeScrollManager.updateEdgeScrolling(100000)).not.toThrow()
 		})
 
 		it('should handle zero user edge scroll speed', () => {
 			editor.user.getEdgeScrollSpeed.mockReturnValue(0)
-			mockInputs.setCurrentScreenPoint(new Vec(5, 300))
+			editor.inputs.currentScreenPoint = new Vec(5, 300)
 
 			edgeScrollManager.updateEdgeScrolling(300)
 
@@ -367,7 +322,7 @@ describe('EdgeScrollManager', () => {
 		})
 
 		it('should handle extreme zoom levels', () => {
-			mockInputs.setCurrentScreenPoint(new Vec(5, 300))
+			editor.inputs.currentScreenPoint = new Vec(5, 300)
 
 			editor.getZoomLevel.mockReturnValue(0.01) // Very zoomed out
 			expect(() => edgeScrollManager.updateEdgeScrolling(300)).not.toThrow()
@@ -380,46 +335,41 @@ describe('EdgeScrollManager', () => {
 	describe('state transitions', () => {
 		it('should properly transition from not scrolling to scrolling', () => {
 			// Start with no edge scrolling
-			mockInputs.setCurrentScreenPoint(new Vec(500, 300))
+			editor.inputs.currentScreenPoint = new Vec(500, 300)
 			edgeScrollManager.updateEdgeScrolling(16)
-			expect(editor.setCamera).not.toHaveBeenCalled()
+			expect((edgeScrollManager as any)._isEdgeScrolling).toBe(false)
 
-			// Move to edge - should start scrolling after delay
-			mockInputs.setCurrentScreenPoint(new Vec(5, 300))
+			// Move to edge
+			editor.inputs.currentScreenPoint = new Vec(5, 300)
 			edgeScrollManager.updateEdgeScrolling(16)
-			expect(editor.setCamera).not.toHaveBeenCalled() // Not yet, due to delay
-
-			edgeScrollManager.updateEdgeScrolling(200)
-			expect(editor.setCamera).toHaveBeenCalled()
+			expect((edgeScrollManager as any)._isEdgeScrolling).toBe(true)
+			expect((edgeScrollManager as any)._edgeScrollDuration).toBe(16)
 		})
 
 		it('should accumulate edge scroll duration over multiple updates', () => {
-			mockInputs.setCurrentScreenPoint(new Vec(5, 300))
+			editor.inputs.currentScreenPoint = new Vec(5, 300)
 
-			// First update - not enough time
 			edgeScrollManager.updateEdgeScrolling(50)
-			expect(editor.setCamera).not.toHaveBeenCalled()
+			expect((edgeScrollManager as any)._edgeScrollDuration).toBe(50)
 
-			// Second update - still not enough
-			edgeScrollManager.updateEdgeScrolling(50)
-			expect(editor.setCamera).not.toHaveBeenCalled()
+			edgeScrollManager.updateEdgeScrolling(30)
+			expect((edgeScrollManager as any)._edgeScrollDuration).toBe(80)
 
-			// Third update - now should trigger (50 + 50 + 101 = 201ms > 200ms delay)
-			edgeScrollManager.updateEdgeScrolling(101)
-			expect(editor.setCamera).toHaveBeenCalled()
+			edgeScrollManager.updateEdgeScrolling(25)
+			expect((edgeScrollManager as any)._edgeScrollDuration).toBe(105)
 		})
 
 		it('should reset duration when stopping edge scroll', () => {
 			// Start edge scrolling
-			mockInputs.setCurrentScreenPoint(new Vec(5, 300))
-			edgeScrollManager.updateEdgeScrolling(300)
-			expect(editor.setCamera).toHaveBeenCalled()
+			editor.inputs.currentScreenPoint = new Vec(5, 300)
+			edgeScrollManager.updateEdgeScrolling(100)
+			expect((edgeScrollManager as any)._edgeScrollDuration).toBe(100)
 
-			// Stop edge scrolling - move away
-			editor.setCamera.mockClear()
-			mockInputs.setCurrentScreenPoint(new Vec(500, 300))
+			// Stop edge scrolling
+			editor.inputs.currentScreenPoint = new Vec(500, 300)
 			edgeScrollManager.updateEdgeScrolling(16)
-			expect(editor.setCamera).not.toHaveBeenCalled()
+			expect((edgeScrollManager as any)._isEdgeScrolling).toBe(false)
+			expect((edgeScrollManager as any)._edgeScrollDuration).toBe(0)
 		})
 	})
 })

package/src/lib/editor/managers/EdgeScrollManager/EdgeScrollManager.ts

@@ -9,10 +9,6 @@ export class EdgeScrollManager {
 	private _isEdgeScrolling = false
 	private _edgeScrollDuration = -1
 
-	getIsEdgeScrolling() {
-		return this._isEdgeScrolling
-	}
-
 	/**
 	 * Update the camera position when the mouse is close to the edge of the screen.
 	 * Run this on every tick when in a state where edge scrolling is enabled.
@@ -85,7 +81,11 @@ export class EdgeScrollManager {
 
 	private getEdgeScroll() {
 		const { editor } = this
-		const { x, y } = editor.inputs.getCurrentScreenPoint()
+		const {
+			inputs: {
+				currentScreenPoint: { x, y },
+			},
+		} = editor
 		const screenBounds = editor.getViewportScreenBounds()
 
 		const {
@@ -107,11 +107,7 @@ export class EdgeScrollManager {
 	 */
 	private moveCameraWhenCloseToEdge(proximityFactor: { x: number; y: number }) {
 		const { editor } = this
-		if (
-			!editor.inputs.getIsDragging() ||
-			editor.inputs.getIsPanning() ||
-			editor.getCameraOptions().isLocked
-		)
+		if (!editor.inputs.isDragging || editor.inputs.isPanning || editor.getCameraOptions().isLocked)
 			return
 
 		if (proximityFactor.x === 0 && proximityFactor.y === 0) return

package/src/lib/editor/managers/FontManager/FontManager.test.ts

@@ -1,5 +1,4 @@
-import { TLParentId, TLShape, TLShapeId, createShapeId, toRichText } from '@tldraw/tlschema'
-import { IndexKey } from '@tldraw/utils'
+import { TLShape, TLShapeId, createShapeId } from '@tldraw/tlschema'
 import { Mock, Mocked, vi } from 'vitest'
 import { Editor } from '../../Editor'
 import { FontManager, TLFontFace } from './FontManager'
@@ -42,21 +41,12 @@ describe('FontManager', () => {
 		x: 0,
 		y: 0,
 		rotation: 0,
-		index: 'a1' as IndexKey,
-		parentId: 'page:page' as TLParentId,
+		index: 'a1' as any,
+		parentId: 'page:page' as any,
 		opacity: 1,
 		isLocked: false,
 		meta: {},
-		props: {
-			color: 'black',
-			size: 'xl',
-			font: 'serif',
-			textAlign: 'middle',
-			w: 100,
-			richText: toRichText('❤️'),
-			scale: 2,
-			autoSize: true,
-		},
+		props: {},
 		typeName: 'shape' as const,
 	})
 

package/src/lib/editor/managers/ScribbleManager/ScribbleManager.test.ts

@@ -36,6 +36,10 @@ describe('ScribbleManager', () => {
 			expect(scribbleManager.scribbleItems.size).toBe(0)
 			expect(scribbleManager.state).toBe('paused')
 		})
+
+		it('should store reference to editor', () => {
+			expect((scribbleManager as any).editor).toBe(editor)
+		})
 	})
 
 	describe('addScribble', () => {

package/src/lib/editor/managers/SnapManager/SnapManager.test.ts

@@ -64,7 +64,6 @@ describe('SnapManager', () => {
 	beforeEach(() => {
 		editor = {
 			getZoomLevel: vi.fn(() => 1),
-			options: { snapThreshold: 8 },
 			getViewportPageBounds: vi.fn(() => new Box(0, 0, 1000, 1000)),
 			getSelectedShapeIds: vi.fn(() => []),
 			getSelectedShapes: vi.fn(() => []),
@@ -249,17 +248,6 @@ describe('SnapManager', () => {
 			editor.getZoomLevel.mockReturnValue(10)
 			expect(snapManager.getSnapThreshold()).toBe(0.8)
 		})
-
-		it('should use custom snap threshold when configured', () => {
-			;(editor as any).options = { snapThreshold: 16 }
-			editor.getZoomLevel.mockReturnValue(1)
-			const customSnapManager = new SnapManager(editor)
-			expect(customSnapManager.getSnapThreshold()).toBe(16)
-
-			editor.getZoomLevel.mockReturnValue(2)
-			const customSnapManager2 = new SnapManager(editor)
-			expect(customSnapManager2.getSnapThreshold()).toBe(8)
-		})
 	})
 
 	describe('getCurrentCommonAncestor', () => {

package/src/lib/editor/managers/SnapManager/SnapManager.ts

@@ -1,5 +1,5 @@
 import { EMPTY_ARRAY, atom, computed } from '@tldraw/state'
-import { TLParentId, TLShapeId, isShapeId } from '@tldraw/tlschema'
+import { TLFrameShape, TLGroupShape, TLParentId, TLShapeId, isShapeId } from '@tldraw/tlschema'
 import { Vec, VecLike } from '../../../primitives/Vec'
 import type { Editor } from '../../Editor'
 import { BoundsSnaps } from './BoundsSnaps'
@@ -58,7 +58,7 @@ export class SnapManager {
 	}
 
 	@computed getSnapThreshold() {
-		return this.editor.options.snapThreshold / this.editor.getZoomLevel()
+		return 8 / this.editor.getZoomLevel()
 	}
 
 	// TODO: make this an incremental derivation
@@ -72,7 +72,7 @@ export class SnapManager {
 		const collectSnappableShapesFromParent = (parentId: TLParentId) => {
 			if (isShapeId(parentId)) {
 				const parent = editor.getShape(parentId)
-				if (parent && editor.isShapeOfType(parent, 'frame')) {
+				if (parent && editor.isShapeOfType<TLFrameShape>(parent, 'frame')) {
 					snappableShapes.add(parentId)
 				}
 			}
@@ -89,7 +89,7 @@ export class SnapManager {
 				const pageBounds = editor.getShapePageBounds(childId)
 				if (!(pageBounds && renderingBounds.includes(pageBounds))) continue
 				// Snap to children of groups but not group itself
-				if (editor.isShapeOfType(childShape, 'group')) {
+				if (editor.isShapeOfType<TLGroupShape>(childShape, 'group')) {
 					collectSnappableShapesFromParent(childId)
 					continue
 				}