@tldraw/editor 5.2.4 → 5.3.0-canary.00f14de1f81d

package/src/index.ts

@@ -102,6 +102,7 @@ export { ClickManager, type TLClickState } from './lib/editor/managers/ClickMana
 export { EdgeScrollManager } from './lib/editor/managers/EdgeScrollManager/EdgeScrollManager'
 export { FontManager } from './lib/editor/managers/FontManager/FontManager'
 export { HistoryManager } from './lib/editor/managers/HistoryManager/HistoryManager'
+export { EditorManager } from './lib/editor/managers/EditorManager'
 export { InputsManager } from './lib/editor/managers/InputsManager/InputsManager'
 export {
 	ScribbleManager,
@@ -191,7 +192,6 @@ export { resizeBox, type ResizeBoxOptions } from './lib/editor/shapes/shared/res
 export { resizeScaled } from './lib/editor/shapes/shared/resizeScaled'
 export { BaseBoxShapeTool } from './lib/editor/tools/BaseBoxShapeTool/BaseBoxShapeTool'
 export { maybeSnapToGrid } from './lib/editor/tools/BaseBoxShapeTool/children/Pointing'
-export { cancelShapeCreationOnLongPress } from './lib/editor/tools/cancelShapeCreationOnLongPress'
 export { StateNode, type TLStateNodeConstructor } from './lib/editor/tools/StateNode'
 export { type TLContent } from './lib/editor/types/clipboard-types'
 export { type TLEventMap, type TLEventMapHandler } from './lib/editor/types/emit-types'

package/src/lib/TldrawEditor.tsx

@@ -801,7 +801,16 @@ export function useOnMount(onMount?: TLOnMountHandler) {
 			{ history: 'ignore' }
 		)
 		window.tldrawReady = true
-		return teardown
+		return () => {
+			teardown?.()
+			// The editor's component can unmount without the editor being disposed (for example when
+			// the canvas is swapped for an error fallback), so emit `unmount` here rather than relying
+			// on disposal. If the editor is being disposed, `dispose()` emits `unmount` itself, so we
+			// only emit here when it's still mounted and alive.
+			if (editor.getIsMounted() && !editor.isDisposed) {
+				editor.run(() => editor.emit('unmount'), { history: 'ignore' })
+			}
+		}
 	})
 
 	React.useLayoutEffect(() => {

package/src/lib/editor/Editor.ts

@@ -563,16 +563,34 @@ export class Editor extends EventEmitter<TLEventMap> {
 		let deletedBindings = new Map<TLBindingId, BindingOnDeleteOptions<any>>()
 		const deletedShapeIds = new Set<TLShapeId>()
 		const invalidParents = new Set<TLShapeId>()
+		const createdShapes = new Set<TLShapeId>()
 		let invalidBindingTypes = new Set<TLBinding['type']>()
 
 		this.disposables.add(
 			this.sideEffects.registerOperationCompleteHandler(() => {
 				// this needs to be cleared here because further effects may delete more shapes
 				// and we want the next invocation of this handler to handle those separately
+				const deletedIds = deletedShapeIds.size ? new Set(deletedShapeIds) : null
 				deletedShapeIds.clear()
 
+				if (deletedIds) {
+					const updates = compact(
+						this.getPageStates().map((pageState) => {
+							return cleanupInstancePageState(pageState, deletedIds)
+						})
+					)
+
+					if (updates.length) {
+						this.store.put(updates)
+					}
+				}
+
+				const justCreatedShapeIds = new Set(createdShapes)
+				createdShapes.clear()
+
 				for (const parentId of invalidParents) {
 					invalidParents.delete(parentId)
+					if (justCreatedShapeIds.has(parentId)) continue
 					const parent = this.getShape(parentId)
 					if (!parent) continue
 
@@ -608,6 +626,12 @@ export class Editor extends EventEmitter<TLEventMap> {
 		this.disposables.add(
 			this.sideEffects.register({
 				shape: {
+					afterCreate: (shape) => {
+						createdShapes.add(shape.id)
+						if (shape.parentId && isShapeId(shape.parentId)) {
+							invalidParents.add(shape.parentId)
+						}
+					},
 					afterChange: (shapeBefore, shapeAfter) => {
 						for (const binding of this.getBindingsInvolvingShape(shapeAfter)) {
 							invalidBindingTypes.add(binding.type)
@@ -712,17 +736,6 @@ export class Editor extends EventEmitter<TLEventMap> {
 						if (deleteBindingIds.length) {
 							this.deleteBindings(deleteBindingIds)
 						}
-
-						const deletedIds = new Set([shape.id])
-						const updates = compact(
-							this.getPageStates().map((pageState) => {
-								return cleanupInstancePageState(pageState, deletedIds)
-							})
-						)
-
-						if (updates.length) {
-							this.store.put(updates)
-						}
 					},
 				},
 				binding: {
@@ -809,6 +822,10 @@ export class Editor extends EventEmitter<TLEventMap> {
 				},
 				instance_page_state: {
 					afterChange: (prev, next) => {
+						if (prev?.focusedGroupId !== next?.focusedGroupId) {
+							this.cancelDoubleClick()
+						}
+
 						if (prev?.selectedShapeIds !== next?.selectedShapeIds) {
 							// ensure that descendants and ancestors are not selected at the same time
 							const filtered = next.selectedShapeIds.filter((id) => {
@@ -891,7 +908,7 @@ export class Editor extends EventEmitter<TLEventMap> {
 
 		this.edgeScrollManager = new EdgeScrollManager(this)
 		this.focusManager = new FocusManager(this, autoFocus)
-		this.disposables.add(this.focusManager.dispose.bind(this.focusManager))
+		this.disposables.add(() => this.focusManager.dispose())
 
 		if (this.getInstanceState().followingUserId) {
 			this.stopFollowingUser()
@@ -899,6 +916,14 @@ export class Editor extends EventEmitter<TLEventMap> {
 
 		this.on('tick', this._flushEventsForTick)
 
+		this.on('mount', () => {
+			this._isMounted.set(true)
+		})
+
+		this.on('unmount', () => {
+			this._isMounted.set(false)
+		})
+
 		this.timers.requestAnimationFrame(() => {
 			this._tickManager.start()
 		})
@@ -1011,6 +1036,23 @@ export class Editor extends EventEmitter<TLEventMap> {
 	 */
 	isDisposed = false
 
+	private readonly _isMounted = atom('isMounted', false)
+
+	/**
+	 * Whether the editor is currently mounted. This is `true` while the editor's component is
+	 * mounted in the DOM (after the `mount` event) and `false` before mount and after `unmount`.
+	 *
+	 * Unlike disposal, mounting is not terminal: the editor's component can unmount and remount
+	 * (for example when the canvas is replaced by an error fallback and restored) without the
+	 * editor itself being disposed. To react to the transitions, listen to the editor's `mount`
+	 * and `unmount` events.
+	 *
+	 * @public
+	 */
+	@computed getIsMounted(): boolean {
+		return this._isMounted.get()
+	}
+
 	/**
 	 * A manager for the editor's tick events.
 	 *
@@ -1161,6 +1203,13 @@ export class Editor extends EventEmitter<TLEventMap> {
 	 * @public
 	 */
 	dispose() {
+		// If the editor is disposed while still mounted (for example when its component tree is
+		// unmounted all at once), emit `unmount` first — while listeners are still attached — so
+		// that `mount` is always balanced by an `unmount` and `getIsMounted()` reads `false`.
+		if (this._isMounted.get()) {
+			this.emit('unmount')
+		}
+
 		// Stop any in-progress camera animations and following before
 		// running disposables, so their cleanup listeners fire first
 		this.stopCameraAnimation()
@@ -5785,6 +5834,22 @@ export class Editor extends EventEmitter<TLEventMap> {
 		return commonBounds
 	}
 
+	/**
+	 * Get the hit-test margin in page space—the distance in page units within which a pointer is
+	 * considered to be touching a shape. This resolves to {@link TldrawOptions.hitTestMargin} (or
+	 * {@link TldrawOptions.coarseHitTestMargin} when using a coarse pointer) divided by the current
+	 * zoom level, so it stays a constant distance in screen space.
+	 *
+	 * @returns The hit-test margin in page space.
+	 *
+	 * @public
+	 */
+	@computed getHitTestMargin(): number {
+		const { hitTestMargin, coarseHitTestMargin } = this.options
+		const margin = this.getInstanceState().isCoarsePointer ? coarseHitTestMargin : hitTestMargin
+		return margin / this.getZoomLevel()
+	}
+
 	/**
 	 * Get the top-most selected shape at the given point, ignoring groups.
 	 *
@@ -5794,10 +5859,25 @@ export class Editor extends EventEmitter<TLEventMap> {
 	 */
 	getSelectedShapeAtPoint(point: VecLike): TLShape | undefined {
 		const selectedShapeIds = this.getSelectedShapeIds()
-		return this.getCurrentPageShapesSorted()
-			.filter((shape) => shape.type !== 'group' && selectedShapeIds.includes(shape.id))
-			.reverse() // find last
-			.find((shape) => this.isPointInShape(shape, point, { hitInside: true, margin: 0 }))
+		const margin = this.options.hitTestMargin / this.getZoomLevel()
+		const sortedShapes = this.getCurrentPageShapesSorted()
+
+		for (let i = sortedShapes.length - 1; i >= 0; i--) {
+			const shape = sortedShapes[i]
+			if (shape.type === 'group') continue
+			if (!selectedShapeIds.includes(shape.id)) continue
+			if (
+				this.getShapeGeometry(shape).hitTestPoint(
+					this.getPointInShapeSpace(shape, point),
+					margin,
+					true
+				)
+			) {
+				return shape
+			}
+		}
+
+		return undefined
 	}
 
 	/**
@@ -5809,7 +5889,6 @@ export class Editor extends EventEmitter<TLEventMap> {
 	 * @returns The shape at the given point, or undefined if there is no shape at the point.
 	 */
 	getShapeAtPoint(point: VecLike, opts: TLGetShapeAtPointOptions = {}): TLShape | undefined {
-		const zoomLevel = this.getZoomLevel()
 		const viewportPageBounds = this.getViewportPageBounds()
 		const {
 			filter,
@@ -5829,7 +5908,7 @@ export class Editor extends EventEmitter<TLEventMap> {
 		let inMarginClosestToEdgeHit: TLShape | null = null
 
 		// Use larger margin for spatial search to account for edge distance checks
-		const searchMargin = Math.max(innerMargin, outerMargin, this.options.hitTestMargin / zoomLevel)
+		const searchMargin = Math.max(innerMargin, outerMargin, this.getHitTestMargin())
 		const candidateIds = this._spatialIndex.getShapeIdsAtPoint(point, searchMargin)
 
 		const shapesToCheck = (
@@ -5998,7 +6077,7 @@ export class Editor extends EventEmitter<TLEventMap> {
 				// For open shapes (e.g. lines or draw shapes) always use the margin.
 				// If the distance is less than the margin, return the shape as the hit.
 				// Use the editor's configurable hit test margin.
-				if (distance < this.options.hitTestMargin / zoomLevel) {
+				if (distance < this.getHitTestMargin()) {
 					return shape
 				}
 			}
@@ -10983,7 +11062,9 @@ export class Editor extends EventEmitter<TLEventMap> {
 			this._ctrlKeyTimeout = this.timers.setTimeout(this._setCtrlKeyTimeout, 150)
 		}
 
-		if (info.metaKey) {
+		if (info.metaKey && info.name !== 'key_up') {
+			// Unlike the other modifiers, the native metaKey property is still true on keyup.
+			// If we don't have this guard, then the metakey will be left true without the timeout.
 			clearTimeout(this._metaKeyTimeout)
 			this._metaKeyTimeout = -1
 			inputs.setMetaKey(true)

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

@@ -0,0 +1,51 @@
+import { vi } from 'vitest'
+import type { Editor } from '../Editor'
+import { EditorManager } from './EditorManager'
+
+class TestManager extends EditorManager {
+	onTestEvent = vi.fn()
+
+	constructor(editor: Editor) {
+		super(editor)
+		this.addEditorEvent('frame', this.onTestEvent)
+	}
+
+	cancelRaf = vi.fn()
+	startRaf() {
+		this.register(this.cancelRaf)
+	}
+}
+
+describe('EditorManager', () => {
+	let on: ReturnType<typeof vi.fn>
+	let off: ReturnType<typeof vi.fn>
+	let editor: Editor
+	let manager: TestManager
+
+	beforeEach(() => {
+		on = vi.fn()
+		off = vi.fn()
+		editor = { on, off } as unknown as Editor
+		manager = new TestManager(editor)
+	})
+
+	it('addEditorEvent registers a listener on the editor', () => {
+		expect(on).toHaveBeenCalledWith('frame', manager.onTestEvent)
+	})
+
+	it('dispose removes registered editor listeners', () => {
+		manager.dispose()
+		expect(off).toHaveBeenCalledWith('frame', manager.onTestEvent)
+	})
+
+	it('register runs custom disposables on dispose', () => {
+		manager.startRaf()
+		manager.dispose()
+		expect(manager.cancelRaf).toHaveBeenCalled()
+	})
+
+	it('dispose is safe to call twice', () => {
+		manager.dispose()
+		expect(() => manager.dispose()).not.toThrow()
+	})
+})

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

@@ -0,0 +1,60 @@
+import type { Editor } from '../Editor'
+import type { TLEventMap } from '../types/emit-types'
+
+/**
+ * Base class for editor-attached managers that need to clean up after themselves.
+ *
+ * Extending `EditorManager` gives a manager one consistent teardown contract: register
+ * anything that needs undoing, and it runs automatically on `dispose()`. This keeps
+ * subscription lifecycle symmetric — whatever sets a thing up is what tears it down — so
+ * it can't be forgotten (the failure mode behind the strict-mode camera bug, #8892).
+ *
+ * Register cleanup by what you're creating:
+ *
+ * - Editor bus event (`tick`, `frame`, `change`, …): {@link EditorManager.addEditorEvent}
+ * - Store side effect (`editor.sideEffects.register…`): `this.register(disposer)`
+ * - Reaction (`react(...)` from `@tldraw/state`): `this.register(react(...))`
+ * - DOM listener: `this.register(() => el.removeEventListener(...))`
+ * - Other resource (cache, index, child manager): `this.register(() => x.dispose())`
+ *
+ * For timeouts, intervals, and animation frames prefer `editor.timers` (context-grouped
+ * and auto-disposed) over raw `setTimeout`. For cleanup on the editor itself rather than a
+ * manager, use `editor.disposables`.
+ *
+ * If a manager needs ordered teardown (e.g. pause a loop before cancelling it), override
+ * `dispose()` and call `super.dispose()` last — see `TickManager`.
+ *
+ * @public
+ */
+export abstract class EditorManager {
+	protected readonly disposables = new Set<() => void>()
+
+	constructor(protected readonly editor: Editor) {}
+
+	/**
+	 * Register a teardown function to run on `dispose()`. The universal way for a manager to
+	 * make a resource "see itself out". Returns the same function for convenience.
+	 */
+	protected register(dispose: () => void): () => void {
+		this.disposables.add(dispose)
+		return dispose
+	}
+
+	/**
+	 * Subscribe to an editor bus event and register the matching unsubscribe, so the listener
+	 * is removed automatically on `dispose()`.
+	 */
+	protected addEditorEvent<E extends keyof TLEventMap>(
+		event: E,
+		fn: (...args: TLEventMap[E]) => void
+	): void {
+		this.editor.on(event, fn as any)
+		this.register(() => this.editor.off(event, fn as any))
+	}
+
+	/** @internal */
+	dispose(): void {
+		this.disposables.forEach((d) => d())
+		this.disposables.clear()
+	}
+}

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

@@ -73,7 +73,8 @@ describe('FocusManager', () => {
 	describe('constructor', () => {
 		it('should initialize with editor reference', () => {
 			focusManager = new FocusManager(editor)
-			expect(focusManager.editor).toBe(editor)
+			expect(focusManager).toBeInstanceOf(FocusManager)
+			expect(editor.sideEffects.registerAfterChangeHandler).toHaveBeenCalled()
 		})
 
 		it('should register side effect listener for instance state changes', () => {

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

@@ -1,5 +1,6 @@
 import { bind } from '@tldraw/utils'
 import type { Editor } from '../../Editor'
+import { EditorManager } from '../EditorManager'
 
 /**
  * A manager for ensuring correct focus across the editor.
@@ -10,14 +11,11 @@ import type { Editor } from '../../Editor'
  *
  * @internal
  */
-export class FocusManager {
-	private disposeSideEffectListener?: () => void
+export class FocusManager extends EditorManager {
+	constructor(editor: Editor, autoFocus?: boolean) {
+		super(editor)
 
-	constructor(
-		public editor: Editor,
-		autoFocus?: boolean
-	) {
-		this.disposeSideEffectListener = editor.sideEffects.registerAfterChangeHandler(
+		const disposeSideEffectListener = editor.sideEffects.registerAfterChangeHandler(
 			'instance',
 			(prev, next) => {
 				if (prev.isFocused !== next.isFocused) {
@@ -25,6 +23,7 @@ export class FocusManager {
 				}
 			}
 		)
+		this.register(() => disposeSideEffectListener?.())
 
 		const currentFocusState = editor.getInstanceState().isFocused
 		if (autoFocus !== currentFocusState) {
@@ -35,6 +34,10 @@ export class FocusManager {
 		const body = editor.getContainerDocument().body
 		body.addEventListener('keydown', this.handleKeyDown)
 		body.addEventListener('mousedown', this.handleMouseDown)
+		this.register(() => {
+			body.removeEventListener('keydown', this.handleKeyDown)
+			body.removeEventListener('mousedown', this.handleMouseDown)
+		})
 	}
 
 	/**
@@ -83,11 +86,4 @@ export class FocusManager {
 		this.editor.complete() // stop any interaction
 		if (blurContainer) this.editor.getContainer().blur() // blur the container
 	}
-
-	dispose() {
-		const body = this.editor.getContainerDocument().body
-		body.removeEventListener('keydown', this.handleKeyDown)
-		body.removeEventListener('mousedown', this.handleMouseDown)
-		this.disposeSideEffectListener?.()
-	}
 }

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

@@ -142,6 +142,72 @@ describe('FontManager', () => {
 
 			await secondPromise
 		})
+
+		it('ignores font load failures after disposal', async () => {
+			const font = createMockFont()
+			const error = new Error('Font load failed')
+			let rejectLoad: (err: Error) => void = () => {}
+			;(global.FontFace as Mock).mockImplementationOnce(function (family, src, descriptors) {
+				return {
+					family,
+					src,
+					...descriptors,
+					load: vi.fn(
+						() =>
+							new Promise<void>((_, reject) => {
+								rejectLoad = reject
+							})
+					),
+				}
+			})
+			const errorSpy = vi.spyOn(console, 'error').mockImplementation(() => {})
+			const debugSpy = vi.spyOn(console, 'debug').mockImplementation(() => {})
+
+			const promise = fontManager.ensureFontIsLoaded(font)
+			fontManager.dispose()
+			rejectLoad(error)
+
+			await expect(promise).resolves.toBeUndefined()
+			expect(errorSpy).not.toHaveBeenCalled()
+			expect(debugSpy).toHaveBeenCalledWith(
+				`Font "${font.family}" load interrupted by editor dispose`,
+				error
+			)
+			errorSpy.mockRestore()
+			debugSpy.mockRestore()
+		})
+
+		it('ignores font loads that finish after disposal', async () => {
+			const font = createMockFont()
+			let resolveLoad: () => void = () => {}
+			;(global.FontFace as Mock).mockImplementationOnce(function (family, src, descriptors) {
+				return {
+					family,
+					src,
+					...descriptors,
+					load: vi.fn(
+						() =>
+							new Promise<void>((resolve) => {
+								resolveLoad = resolve
+							})
+					),
+				}
+			})
+			const debugSpy = vi.spyOn(console, 'debug').mockImplementation(() => {})
+
+			const promise = fontManager.ensureFontIsLoaded(font)
+			fontManager.dispose()
+			resolveLoad()
+
+			await expect(promise).resolves.toBeUndefined()
+			// only the creation-time add from findOrCreateFontFace, not a second
+			// post-load add after dispose
+			expect(document.fonts.add).toHaveBeenCalledTimes(1)
+			expect(debugSpy).toHaveBeenCalledWith(
+				`Font "${font.family}" load interrupted by editor dispose`
+			)
+			debugSpy.mockRestore()
+		})
 	})
 
 	describe('getShapeFontFaces', () => {

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

@@ -106,16 +106,30 @@ export class FontManager {
 		if (existingState) return existingState.loadingPromise
 
 		const instance = this.findOrCreateFontFace(font)
+		// dispose() clears fontStates while loads may still be in flight, so a late
+		// callback must only touch the exact entry it was created for - not a fresh
+		// entry from a later request. Check identity, not just presence.
+		const isStale = () => this.fontStates.__unsafe__getWithoutCapture(font) !== state
 		const state: FontState = {
 			state: 'loading',
 			instance,
 			loadingPromise: instance
 				.load()
 				.then(() => {
+					if (isStale()) {
+						// eslint-disable-next-line no-console
+						console.debug(`Font "${font.family}" load interrupted by editor dispose`)
+						return
+					}
 					this.editor.getContainerDocument().fonts.add(instance)
 					this.fontStates.update(font, (s) => ({ ...s, state: 'ready' }))
 				})
 				.catch((err) => {
+					if (isStale()) {
+						// eslint-disable-next-line no-console
+						console.debug(`Font "${font.family}" load interrupted by editor dispose`, err)
+						return
+					}
 					console.error(err)
 					this.fontStates.update(font, (s) => ({ ...s, state: 'error' }))
 				}),

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

@@ -7,19 +7,16 @@ import { Vec } from '../../../primitives/Vec'
 import { isAccelKey } from '../../../utils/keyboard'
 import type { Editor } from '../../Editor'
 import { TLPinchEventInfo, TLPointerEventInfo, TLWheelEventInfo } from '../../types/event-types'
+import { EditorManager } from '../EditorManager'
 
 const POINTER_VELOCITY_REFERENCE_INTERVAL_MS = 16
 const POINTER_VELOCITY_REFERENCE_SMOOTHING = 0.5
 
 /** @public */
-export class InputsManager {
-	constructor(private readonly editor: Editor) {
-		this.editor.on('frame', this._onFrame)
-	}
-
-	/** @internal */
-	dispose() {
-		this.editor.off('frame', this._onFrame)
+export class InputsManager extends EditorManager {
+	constructor(editor: Editor) {
+		super(editor)
+		this.addEditorEvent('frame', this._onFrame)
 	}
 
 	@bind
@@ -472,7 +469,7 @@ export class InputsManager {
 	private _velocityPrevPoint = new Vec()
 
 	/**
-	 * Update the pointer velocity based on elapsed time. Called each frame.
+	 * Update the pointer velocity based on elapsed time. Called by the tick manager.
 	 * @param elapsed - The time elapsed since the last tick in milliseconds.
 	 * @internal
 	 */

package/src/lib/editor/managers/SpatialIndexManager/RBushIndex.ts

@@ -46,28 +46,6 @@ export class RBushIndex {
 		return new Set(results.map((e: SpatialElement) => e.id))
 	}
 
-	/**
-	 * Insert or update a shape in the spatial index.
-	 * If the shape already exists, it will be removed first to prevent duplicates.
-	 */
-	upsert(id: TLShapeId, bounds: Box): void {
-		// Remove existing entry to prevent map-tree desync
-		const existing = this.elementsInTree.get(id)
-		if (existing) {
-			this.rBush.remove(existing)
-		}
-
-		const element: SpatialElement = {
-			minX: bounds.minX,
-			minY: bounds.minY,
-			maxX: bounds.maxX,
-			maxY: bounds.maxY,
-			id,
-		}
-		this.rBush.insert(element)
-		this.elementsInTree.set(id, element)
-	}
-
 	/**
 	 * Remove a shape from the spatial index.
 	 */
@@ -79,6 +57,25 @@ export class RBushIndex {
 		}
 	}
 
+	/**
+	 * Apply the removals and upserts collected during one incremental update.
+	 * Mutations are applied per item: bulk-rebuilding the whole tree instead
+	 * was measured slower even with ~10% of the index in the batch.
+	 */
+	applyBatch(removes: Set<TLShapeId>, upserts: SpatialElement[]): void {
+		for (const id of removes) {
+			this.remove(id)
+		}
+		for (const element of upserts) {
+			const existing = this.elementsInTree.get(element.id)
+			if (existing) {
+				this.rBush.remove(existing)
+			}
+			this.rBush.insert(element)
+			this.elementsInTree.set(element.id, element)
+		}
+	}
+
 	/**
 	 * Bulk load elements into the spatial index.
 	 * More efficient than individual inserts for initial loading.
@@ -122,17 +119,6 @@ export class RBushIndex {
 		return this.elementsInTree.get(id)
 	}
 
-	/**
-	 * Iterate the entries currently in the index. Callers may upsert existing
-	 * keys or remove keys during iteration; current callers do not insert new
-	 * keys.
-	 *
-	 * @internal
-	 */
-	entries(): IterableIterator<[TLShapeId, SpatialElement]> {
-		return this.elementsInTree.entries()
-	}
-
 	/**
 	 * Dispose of the spatial index.
 	 * Clears all data structures to prevent memory leaks.