tldraw 4.3.0-canary.fd6b7f2a8adc → 4.3.0-next.2b3bfbba757b

package/src/test/customSnapping.test.tsx

@@ -4,10 +4,10 @@ import {
 	Polyline2d,
 	ShapeUtil,
 	TLAnyShapeUtilConstructor,
+	TLBaseShape,
 	TLHandle,
 	TLHandleDragInfo,
 	TLLineShape,
-	TLShape,
 	TLShapeId,
 	Vec,
 	VecModel,
@@ -16,19 +16,13 @@ import {
 import { TestEditor } from './TestEditor'
 import { TL } from './test-jsx'
 
-const TEST1_TYPE = 'test1'
-
-declare module '@tldraw/tlschema' {
-	export interface TLGlobalShapePropsMap {
-		[TEST1_TYPE]: { w: number; h: number; boundsSnapPoints: VecModel[] | null }
-	}
-}
-
-type Test1Shape = TLShape<typeof TEST1_TYPE>
-
 describe('custom shape bounds snapping - translate', () => {
-	class TestShapeUtil extends BaseBoxShapeUtil<Test1Shape> {
-		static override type = TEST1_TYPE
+	type TestShape = TLBaseShape<
+		'test',
+		{ w: number; h: number; boundsSnapPoints: VecModel[] | null }
+	>
+	class TestShapeUtil extends BaseBoxShapeUtil<TestShape> {
+		static override type = 'test'
 		override getDefaultProps() {
 			return { w: 100, h: 100, boundsSnapPoints: null }
 		}
@@ -38,7 +32,7 @@ describe('custom shape bounds snapping - translate', () => {
 		override indicator() {
 			throw new Error('Method not implemented.')
 		}
-		override getBoundsSnapGeometry(shape: Test1Shape) {
+		override getBoundsSnapGeometry(shape: TestShape) {
 			return {
 				points: shape.props.boundsSnapPoints ?? undefined,
 			}
@@ -52,14 +46,14 @@ describe('custom shape bounds snapping - translate', () => {
 		editor = new TestEditor({ shapeUtils })
 		ids = editor.createShapesFromJsx([
 			<TL.geo ref="box" x={0} y={0} w={100} h={100} />,
-			<TL.test1 ref="test1" x={200} y={200} w={100} h={100} boundsSnapPoints={null} />,
+			<TL.test ref="test" x={200} y={200} w={100} h={100} boundsSnapPoints={null} />,
 		])
 	})
 
 	describe('with default boundSnapPoints', () => {
 		test('normal snapping works with default boundSnapPoints when moving test shape', () => {
 			// start translating the test shape
-			editor.setSelectedShapes([ids.test1]).pointerDown(250, 250)
+			editor.setSelectedShapes([ids.test]).pointerDown(250, 250)
 
 			// move the left edge of the test shape to the right edge of the box shape - it should snap
 			editor.pointerMove(155, 250, undefined, { ctrlKey: true })
@@ -90,15 +84,15 @@ describe('custom shape bounds snapping - translate', () => {
 
 	describe('with only the center in boundSnapPoints', () => {
 		beforeEach(() => {
-			editor.updateShape({
-				id: ids.test1,
-				type: TEST1_TYPE,
+			editor.updateShape<TestShape>({
+				id: ids.test,
+				type: 'test',
 				props: { boundsSnapPoints: [{ x: 50, y: 50 }] },
 			})
 		})
 
 		describe('when moving the test shape', () => {
-			beforeEach(() => editor.select(ids.test1).pointerDown(250, 250))
+			beforeEach(() => editor.select(ids.test).pointerDown(250, 250))
 
 			test('does not snap its edges to the box edges', () => {
 				editor.pointerMove(155, 250, undefined, { ctrlKey: true })
@@ -132,15 +126,15 @@ describe('custom shape bounds snapping - translate', () => {
 
 	describe('with empty boundSnapPoints', () => {
 		beforeEach(() => {
-			editor.updateShape({
-				id: ids.test1,
-				type: TEST1_TYPE,
+			editor.updateShape<TestShape>({
+				id: ids.test,
+				type: 'test',
 				props: { boundsSnapPoints: [] },
 			})
 		})
 
 		test('test shape does not snap to anything', () => {
-			editor.select(ids.test1).pointerDown(250, 250)
+			editor.select(ids.test).pointerDown(250, 250)
 
 			// try to snap our left edge to the right edge of the box shape - it should not snap
 			editor.pointerMove(155, 250, undefined, { ctrlKey: true })
@@ -169,11 +163,10 @@ describe('custom shape bounds snapping - translate', () => {
 	})
 })
 
-const TEST2_TYPE = 'test2'
-
-declare module '@tldraw/tlschema' {
-	export interface TLGlobalShapePropsMap {
-		[TEST2_TYPE]: {
+describe('custom handle snapping', () => {
+	type TestShape = TLBaseShape<
+		'test',
+		{
 			w: number
 			h: number
 			ownHandle: VecModel
@@ -183,15 +176,10 @@ declare module '@tldraw/tlschema' {
 			selfSnapPoints: VecModel[] | 'default'
 			handleSnapType?: 'point' | 'align'
 		}
-	}
-}
-
-type Test2Shape = TLShape<typeof TEST2_TYPE>
-
-describe('custom handle snapping', () => {
-	class TestShapeUtil extends BaseBoxShapeUtil<Test2Shape> {
-		static override type = TEST2_TYPE
-		override getDefaultProps(): Test2Shape['props'] {
+	>
+	class TestShapeUtil extends BaseBoxShapeUtil<TestShape> {
+		static override type = 'test'
+		override getDefaultProps(): TestShape['props'] {
 			return {
 				w: 100,
 				h: 100,
@@ -208,7 +196,7 @@ describe('custom handle snapping', () => {
 		override indicator() {
 			throw new Error('Method not implemented.')
 		}
-		override getHandleSnapGeometry(shape: Test2Shape) {
+		override getHandleSnapGeometry(shape: TestShape) {
 			const { handleOutline, handlePoints, selfSnapOutline, selfSnapPoints } = shape.props
 			return {
 				outline:
@@ -226,7 +214,7 @@ describe('custom handle snapping', () => {
 				getSelfSnapPoints: selfSnapPoints === 'default' ? undefined : () => selfSnapPoints,
 			}
 		}
-		override getHandles(shape: Test2Shape): TLHandle[] {
+		override getHandles(shape: TestShape): TLHandle[] {
 			const handle: TLHandle = {
 				id: 'handle',
 				label: 'handle',
@@ -245,7 +233,7 @@ describe('custom handle snapping', () => {
 
 			return [handle]
 		}
-		override onHandleDrag(shape: Test2Shape, { handle }: TLHandleDragInfo<Test2Shape>) {
+		override onHandleDrag(shape: TestShape, { handle }: TLHandleDragInfo<TestShape>) {
 			return { ...shape, props: { ...shape.props, ownHandle: { x: handle.x, y: handle.y } } }
 		}
 	}
@@ -265,7 +253,7 @@ describe('custom handle snapping', () => {
 					a2: { id: 'a2', index: 'a2' as IndexKey, x: 100, y: 100 },
 				}}
 			/>,
-			<TL.test2 ref="test2" x={200} y={200} w={100} h={100} />,
+			<TL.test ref="test" x={200} y={200} w={100} h={100} boundsSnapPoints={null} />,
 		])
 	})
 
@@ -308,9 +296,9 @@ describe('custom handle snapping', () => {
 
 	describe('with empty handleSnapGeometry.outline', () => {
 		beforeEach(() => {
-			editor.updateShape({
-				id: ids.test2,
-				type: TEST2_TYPE,
+			editor.updateShape<TestShape>({
+				id: ids.test,
+				type: 'test',
 				props: { handleOutline: null },
 			})
 		})
@@ -325,9 +313,9 @@ describe('custom handle snapping', () => {
 
 	describe('with custom handleSnapGeometry.outline', () => {
 		beforeEach(() => {
-			editor.updateShape({
-				id: ids.test2,
-				type: TEST2_TYPE,
+			editor.updateShape<TestShape>({
+				id: ids.test,
+				type: 'test',
 				props: {
 					// a diagonal line from the top left to the bottom right
 					handleOutline: [
@@ -372,9 +360,9 @@ describe('custom handle snapping', () => {
 
 	describe('with custom handleSnapGeometry.points', () => {
 		beforeEach(() => {
-			editor.updateShape({
-				id: ids.test2,
-				type: TEST2_TYPE,
+			editor.updateShape<TestShape>({
+				id: ids.test,
+				type: 'test',
 				props: {
 					handlePoints: [
 						{ x: 30, y: 30 },
@@ -399,12 +387,12 @@ describe('custom handle snapping', () => {
 
 	describe('with custom handleSnapGeometry.points along the outline', () => {
 		beforeEach(() => {
-			editor.updateShape({
-				id: ids.test2,
-				type: TEST2_TYPE,
+			editor.updateShape<TestShape>({
+				id: ids.test,
+				type: 'test',
 				props: {
 					handlePoints: editor
-						.getShapeGeometry(ids.test2)
+						.getShapeGeometry(ids.test)
 						.bounds.cornersAndCenter.map(({ x, y }) => ({ x, y })),
 				},
 			})
@@ -438,9 +426,9 @@ describe('custom handle snapping', () => {
 	describe('self snapping', () => {
 		beforeEach(() => {
 			editor.deleteShape(ids.line)
-			editor.updateShape({
-				id: ids.test2,
-				type: TEST2_TYPE,
+			editor.updateShape<TestShape>({
+				id: ids.test,
+				type: 'test',
 				x: 0,
 				y: 0,
 				props: {
@@ -449,12 +437,12 @@ describe('custom handle snapping', () => {
 			})
 		})
 		function startDraggingOwnHandle() {
-			const shape = editor.select(ids.test2).getOnlySelectedShape()!
+			const shape = editor.select(ids.test).getOnlySelectedShape()!
 			const handles = editor.getShapeHandles(shape)!
 			editor.pointerDown(0, 0, { target: 'handle', shape, handle: handles[0] })
 		}
 		function ownHandlePosition() {
-			const shape = editor.select(ids.test2).getOnlySelectedShape()!
+			const shape = editor.select(ids.test).getOnlySelectedShape()!
 			const handle = editor.getShapeHandles(shape)![0]
 			return { x: handle.x, y: handle.y }
 		}
@@ -474,9 +462,9 @@ describe('custom handle snapping', () => {
 		})
 		describe('with custom self snap outline & points', () => {
 			beforeEach(() => {
-				editor.updateShape({
-					id: ids.test2,
-					type: TEST2_TYPE,
+				editor.updateShape<TestShape>({
+					id: ids.test,
+					type: 'test',
 					props: {
 						selfSnapOutline: [
 							{ x: 20, y: 50 },
@@ -518,9 +506,9 @@ describe('custom handle snapping', () => {
 
 		describe('with snapType set to align', () => {
 			beforeEach(() => {
-				editor.updateShape({
-					id: ids.test2,
-					type: TEST2_TYPE,
+				editor.updateShape<TestShape>({
+					id: ids.test,
+					type: 'test',
 					props: {
 						selfSnapPoints: [
 							{ x: 20, y: 50 },
@@ -555,24 +543,19 @@ describe('custom handle snapping', () => {
 	})
 })
 
-const BEZIER_TYPE = 'bezier'
-
-declare module '@tldraw/tlschema' {
-	export interface TLGlobalShapePropsMap {
-		[BEZIER_TYPE]: {
+describe('custom adjacent handle for shift snapping', () => {
+	type BezierShape = TLBaseShape<
+		'bezier',
+		{
 			start: VecModel
 			cp1: VecModel
 			cp2: VecModel
 			end: VecModel
 		}
-	}
-}
-
-type BezierShape = TLShape<typeof BEZIER_TYPE>
+	>
 
-describe('custom adjacent handle for shift snapping', () => {
 	class BezierShapeUtil extends ShapeUtil<BezierShape> {
-		static override type = BEZIER_TYPE
+		static override type = 'bezier'
 		override getDefaultProps() {
 			return {
 				start: { x: 0, y: 0 },
@@ -649,6 +632,8 @@ describe('custom adjacent handle for shift snapping', () => {
 				ref="bezier"
 				x={0}
 				y={0}
+				w={100}
+				h={100}
 				start={{ x: 0, y: 0 }}
 				cp1={{ x: 50, y: 0 }}
 				cp2={{ x: 50, y: 100 }}

package/src/test/duplicate.test.ts

@@ -295,7 +295,7 @@ describe('When duplicating shapes that include arrows', () => {
 			.select(
 				...editor
 					.getCurrentPageShapes()
-					.filter((s) => editor.isShapeOfType(s, 'arrow'))
+					.filter((s) => editor.isShapeOfType<TLArrowShape>(s, 'arrow'))
 					.map((s) => s.id)
 			)
 

package/src/test/frames.test.ts

@@ -1363,13 +1363,13 @@ describe('Unparenting behavior', () => {
 
 		// When the shape has a fill, it should not fall out of the frame
 		editor.undo()
-		editor.updateShape({ ...largeRect, props: { fill: 'solid' } })
+		editor.updateShape<TLGeoShape>({ ...largeRect, props: { fill: 'solid' } })
 		dragOntoFrame()
 		expect(editor.getShape(largeRect.id)!.parentId).toBe(frameId)
 
 		// When the shape has a label and that label is on top of the frame, it should not fall out of the frame
 		editor.undo()
-		editor.updateShape({
+		editor.updateShape<TLGeoShape>({
 			...largeRect,
 			props: { fill: 'none', richText: toRichText('hello') },
 		})

package/src/test/getCulledShapes.test.tsx

@@ -3,7 +3,7 @@ import {
 	Box,
 	RecordProps,
 	T,
-	TLShape,
+	TLBaseShape,
 	TLShapeId,
 	createShapeId,
 } from '@tldraw/editor'
@@ -11,19 +11,11 @@ import { vi } from 'vitest'
 import { TestEditor } from './TestEditor'
 import { TL } from './test-jsx'
 
-const UNCULLABLE_TYPE = 'uncullable'
-
-declare module '@tldraw/tlschema' {
-	export interface TLGlobalShapePropsMap {
-		[UNCULLABLE_TYPE]: { w: number; h: number }
-	}
-}
-
 // Custom uncullable shape type for testing canCull override
-type UncullableShape = TLShape<typeof UNCULLABLE_TYPE>
+type UncullableShape = TLBaseShape<'uncullable', { w: number; h: number }>
 
 class UncullableShapeUtil extends BaseBoxShapeUtil<UncullableShape> {
-	static override type = UNCULLABLE_TYPE
+	static override type = 'uncullable' as const
 	static override props: RecordProps<UncullableShape> = {
 		w: T.number,
 		h: T.number,

package/src/test/getShapeAtPoint.test.ts

@@ -1,4 +1,4 @@
-import { TLShape, createShapeId, toRichText } from '@tldraw/editor'
+import { TLGeoShape, TLShape, createShapeId, toRichText } from '@tldraw/editor'
 import { TestEditor } from './TestEditor'
 
 let editor: TestEditor
@@ -146,7 +146,7 @@ describe('with hitLabels=true', () => {
 	it('hits geo shape label behind overlapping hollow shape', () => {
 		// label is empty
 		expect(editor.getShapeAtPoint({ x: 350, y: 350 }, opts)?.id).toBe(ids.box3)
-		editor.updateShape({
+		editor.updateShape<TLGeoShape>({
 			id: ids.box2,
 			type: 'geo',
 			props: { richText: toRichText('hello') },

package/src/test/groups.test.tsx

@@ -1,6 +1,5 @@
 import {
 	Box,
-	ExtractShapeByProps,
 	GroupShapeUtil,
 	TLArrowShape,
 	TLGroupShape,
@@ -36,16 +35,14 @@ const ids = {
 	groupA: createShapeId('groupA'),
 }
 
-type BoxShape = ExtractShapeByProps<{ fill: string }>
-
 const box = (
 	id: TLShapeId,
 	x: number,
 	y: number,
 	w = 10,
 	h = 10,
-	fill: BoxShape['props']['fill'] = 'solid'
-): TLShapePartial<BoxShape> => ({
+	fill = 'solid'
+): TLShapePartial => ({
 	type: 'geo',
 	id,
 	x,
@@ -1983,7 +1980,7 @@ describe('Group opacity', () => {
 		editor.setOpacityForNextShapes(0.5)
 		editor.groupShapes(editor.getSelectedShapeIds())
 		const group = editor.getShape(onlySelectedId())!
-		assert(editor.isShapeOfType(group, 'group'))
+		assert(editor.isShapeOfType<TLGroupShape>(group, 'group'))
 		expect(group.opacity).toBe(1)
 	})
 })

package/src/test/resizing.test.ts

@@ -3876,8 +3876,10 @@ it('uses the cross cursor when create resizing', () => {
 describe('Resizing text from the right edge', () => {
 	it('Resizes text from the right edge', () => {
 		const id = createShapeId()
-		editor.createShapes([{ id, type: 'text', props: { richText: toRichText('H') } }])
-		editor.updateShapes([{ id, type: 'text', props: { richText: toRichText('Hello World') } }]) // auto size
+		editor.createShapes<TLTextShape>([{ id, type: 'text', props: { richText: toRichText('H') } }])
+		editor.updateShapes<TLTextShape>([
+			{ id, type: 'text', props: { richText: toRichText('Hello World') } },
+		]) // auto size
 
 		editor.select(id)
 
@@ -3903,8 +3905,10 @@ describe('Resizing text from the right edge', () => {
 		editor.updateInstanceState({ isCoarsePointer: true })
 
 		const id = createShapeId()
-		editor.createShapes([{ id, type: 'text', props: { richText: toRichText('H') } }])
-		editor.updateShapes([{ id, type: 'text', props: { richText: toRichText('Hello World') } }]) // auto size
+		editor.createShapes<TLTextShape>([{ id, type: 'text', props: { richText: toRichText('H') } }])
+		editor.updateShapes<TLTextShape>([
+			{ id, type: 'text', props: { richText: toRichText('Hello World') } },
+		]) // auto size
 
 		editor.select(id)
 
@@ -3950,7 +3954,7 @@ describe('When resizing near the edges of the screen', () => {
 
 describe('resizing text with autosize true', () => {
 	it('resizes text from the right side', () => {
-		editor.createShape({
+		editor.createShape<TLTextShape>({
 			type: 'text',
 			x: 0,
 			y: 0,
@@ -3976,7 +3980,7 @@ describe('resizing text with autosize true', () => {
 	})
 
 	it('resizes text from the right side when alt key is pressed', () => {
-		editor.createShape({
+		editor.createShape<TLTextShape>({
 			type: 'text',
 			x: 0,
 			y: 0,
@@ -4003,7 +4007,7 @@ describe('resizing text with autosize true', () => {
 	})
 
 	it('resizes text from the left side', () => {
-		editor.createShape({
+		editor.createShape<TLTextShape>({
 			type: 'text',
 			x: 0,
 			y: 0,
@@ -4029,7 +4033,7 @@ describe('resizing text with autosize true', () => {
 	})
 
 	it('resizes text from the left side when alt is pressed', () => {
-		editor.createShape({
+		editor.createShape<TLTextShape>({
 			type: 'text',
 			x: 0,
 			y: 0,
@@ -4058,7 +4062,7 @@ describe('resizing text with autosize true', () => {
 
 describe('cancelling a resize operation', () => {
 	it('undoes any changes since the start of the resize operation', () => {
-		editor.createShape({
+		editor.createShape<TLGeoShape>({
 			type: 'geo',
 			x: 0,
 			y: 0,

package/src/test/selection-omnibus.test.ts

@@ -76,7 +76,7 @@ describe('Hovering shapes', () => {
 		editor.pointerMove(50, 50)
 		expect(editor.getHoveredShapeId()).toBe(null)
 
-		editor.updateShape({
+		editor.updateShape<TLGeoShape>({
 			id: ids.box1,
 			type: 'geo',
 			props: { richText: toRichText('hello') },
@@ -88,7 +88,7 @@ describe('Hovering shapes', () => {
 	})
 
 	it('selects a shape with a full label on pointer down', () => {
-		editor.updateShape({
+		editor.updateShape<TLGeoShape>({
 			id: ids.box1,
 			type: 'geo',
 			props: { richText: toRichText('hello') },
@@ -462,7 +462,7 @@ describe('when shape is hollow', () => {
 describe('when shape is a frame', () => {
 	let frame1: TLFrameShape
 	beforeEach(() => {
-		editor.createShape({ id: ids.frame1, type: 'frame', props: { w: 100, h: 100 } })
+		editor.createShape<TLFrameShape>({ id: ids.frame1, type: 'frame', props: { w: 100, h: 100 } })
 		frame1 = editor.getShape<TLFrameShape>(ids.frame1)!
 	})
 
@@ -517,8 +517,8 @@ describe('when shape is a frame', () => {
 describe('When a shape is behind a frame', () => {
 	beforeEach(() => {
 		editor.selectAll().deleteShapes(editor.getSelectedShapeIds())
-		editor.createShape({ id: ids.box1, type: 'geo', x: 25, y: 25 })
-		editor.createShape({ id: ids.frame1, type: 'frame', props: { w: 100, h: 100 } })
+		editor.createShape<TLGeoShape>({ id: ids.box1, type: 'geo', x: 25, y: 25 })
+		editor.createShape<TLFrameShape>({ id: ids.frame1, type: 'frame', props: { w: 100, h: 100 } })
 	})
 
 	it('does not select the shape when clicked inside', () => {
@@ -548,8 +548,8 @@ describe('when shape is inside of a frame', () => {
 	let frame1: TLFrameShape
 	let box1: TLGeoShape
 	beforeEach(() => {
-		editor.createShape({ id: ids.frame1, type: 'frame', props: { w: 100, h: 100 } })
-		editor.createShape({
+		editor.createShape<TLFrameShape>({ id: ids.frame1, type: 'frame', props: { w: 100, h: 100 } })
+		editor.createShape<TLGeoShape>({
 			id: ids.box1,
 			parentId: ids.frame1,
 			type: 'geo',
@@ -703,15 +703,15 @@ describe('when a frame has multiple children', () => {
 	let box2: TLGeoShape
 	beforeEach(() => {
 		editor
-			.createShape({ id: ids.frame1, type: 'frame', props: { w: 100, h: 100 } })
-			.createShape({
+			.createShape<TLFrameShape>({ id: ids.frame1, type: 'frame', props: { w: 100, h: 100 } })
+			.createShape<TLGeoShape>({
 				id: ids.box1,
 				parentId: ids.frame1,
 				type: 'geo',
 				x: 25,
 				y: 25,
 			})
-			.createShape({
+			.createShape<TLGeoShape>({
 				id: ids.box2,
 				parentId: ids.frame1,
 				type: 'geo',
@@ -849,7 +849,7 @@ describe('When shapes are overlapping', () => {
 	let box4: TLGeoShape
 	let box5: TLGeoShape
 	beforeEach(() => {
-		editor.createShapes([
+		editor.createShapes<TLGeoShape>([
 			{
 				id: ids.box1,
 				type: 'geo',

package/src/test/shapeutils.test.ts

@@ -470,7 +470,7 @@ describe('When interacting with a shape...', () => {
 	})
 
 	it('Fires handle dragging cancel events', () => {
-		const util = editor.getShapeUtil('line')
+		const util = editor.getShapeUtil<TLLineShape>('line')
 
 		const calls: string[] = []
 

package/src/test/styles2.test.tsx

@@ -88,7 +88,7 @@ describe('Editor.styles', () => {
 	})
 
 	it('should return mixed for all mixed styles', () => {
-		editor.updateShapes([
+		editor.updateShapes<TLGeoShape>([
 			{
 				id: defaultShapesIds.box1,
 				type: 'geo',

package/src/test/styles3.test.ts

@@ -1,4 +1,4 @@
-import { createShapeId, toRichText } from '@tldraw/editor'
+import { TLGeoShape, createShapeId, toRichText } from '@tldraw/editor'
 import { TestEditor } from './TestEditor'
 
 let editor: TestEditor
@@ -14,7 +14,7 @@ afterEach(() => {
 it("When changing the style of a geo shape, if the text label is empty, don't measure it", () => {
 	const id = createShapeId()
 
-	editor.createShapes([
+	editor.createShapes<TLGeoShape>([
 		{
 			id,
 			type: 'geo',
@@ -29,7 +29,7 @@ it("When changing the style of a geo shape, if the text label is empty, don't me
 
 	const boundsBefore = editor.getShapeGeometry(id).bounds
 
-	editor.updateShapes([
+	editor.updateShapes<TLGeoShape>([
 		{
 			id,
 			type: 'geo',
@@ -43,7 +43,7 @@ it("When changing the style of a geo shape, if the text label is empty, don't me
 it('When changing the style of a geo shape, if the text label has text, measure it and possibly update the size', () => {
 	const id = createShapeId()
 
-	editor.createShapes([
+	editor.createShapes<TLGeoShape>([
 		{
 			id,
 			type: 'geo',
@@ -58,7 +58,7 @@ it('When changing the style of a geo shape, if the text label has text, measure
 
 	const boundsBefore = editor.getShapeGeometry(id).bounds!
 
-	editor.updateShapes([
+	editor.updateShapes<TLGeoShape>([
 		{
 			id,
 			type: 'geo',