@tldraw/tlschema 4.2.2 → 4.2.3

package/src/index.ts

@@ -99,8 +99,6 @@ export {
 	type TLBindingId,
 	type TLBindingUpdate,
 	type TLDefaultBinding,
-	type TLGlobalBindingPropsMap,
-	type TLIndexedBindings,
 	type TLUnknownBinding,
 } from './records/TLBinding'
 export { CameraRecordType, type TLCamera, type TLCameraId } from './records/TLCamera'
@@ -148,11 +146,7 @@ export {
 	isShape,
 	isShapeId,
 	rootShapeMigrations,
-	type ExtractShapeByProps,
-	type TLCreateShapePartial,
 	type TLDefaultShape,
-	type TLGlobalShapePropsMap,
-	type TLIndexedShapes,
 	type TLParentId,
 	type TLShape,
 	type TLShapeId,
@@ -191,7 +185,6 @@ export {
 	type TLBookmarkShapeProps,
 } from './shapes/TLBookmarkShape'
 export {
-	compressLegacySegments,
 	drawShapeMigrations,
 	drawShapeProps,
 	type TLDrawShape,
@@ -314,5 +307,3 @@ registerTldrawLibraryVersion(
 	(globalThis as any).TLDRAW_LIBRARY_VERSION,
 	(globalThis as any).TLDRAW_LIBRARY_MODULES
 )
-
-export { b64Vecs } from './misc/b64Vecs'

package/src/migrations.test.ts

@@ -16,7 +16,7 @@ import { instancePresenceVersions } from './records/TLPresence'
 import { TLShape, rootShapeVersions } from './records/TLShape'
 import { arrowShapeVersions } from './shapes/TLArrowShape'
 import { bookmarkShapeVersions } from './shapes/TLBookmarkShape'
-import { compressLegacySegments, drawShapeVersions } from './shapes/TLDrawShape'
+import { drawShapeVersions } from './shapes/TLDrawShape'
 import { embedShapeVersions } from './shapes/TLEmbedShape'
 import { frameShapeVersions } from './shapes/TLFrameShape'
 import { geoShapeVersions } from './shapes/TLGeoShape'
@@ -1444,32 +1444,6 @@ describe('Add rich text', () => {
 	}
 })
 
-describe('Add rich text attrs', () => {
-	const migrations = [
-		['text shape', getTestMigration(textShapeVersions.AddRichTextAttrs)],
-		['geo shape', getTestMigration(geoShapeVersions.AddRichTextAttrs)],
-		['note shape', getTestMigration(noteShapeVersions.AddRichTextAttrs)],
-		['arrow shape', getTestMigration(arrowShapeVersions.AddRichTextAttrs)],
-	] as const
-
-	for (const [shapeName, { up, down }] of migrations) {
-		it(`works for ${shapeName}`, () => {
-			const shape = { props: { richText: toRichText('hello, world') } }
-			const shapeWithAttrs = {
-				props: { richText: { ...toRichText('hello, world'), attrs: { test: 'value' } } },
-			}
-
-			// Up migration should be a noop
-			expect(up(shape)).toEqual(shape)
-			expect(up(shapeWithAttrs)).toEqual(shapeWithAttrs)
-
-			// Down migration should remove attrs
-			expect(down(shapeWithAttrs)).toEqual(shape)
-			expect(down(shape)).toEqual(shape)
-		})
-	}
-})
-
 describe('Make urls valid for all the assets', () => {
 	const migrations = [
 		['bookmark asset', getTestMigration(bookmarkAssetVersions.MakeUrlsValid)],
@@ -2268,128 +2242,6 @@ describe('TLVideoAsset AddAutoplay', () => {
 	})
 })
 
-describe('Add scaleX, scaleY, and new base64 format to draw shape', () => {
-	const { up, down } = getTestMigration(drawShapeVersions.Base64)
-
-	test('up works as expected', () => {
-		const legacySegments = [
-			{
-				type: 'free',
-				points: [
-					{ x: 0, y: 0, z: 0.5 },
-					{ x: 10, y: 10, z: 0.6 },
-					{ x: 20, y: 20, z: 0.7 },
-				],
-			},
-			{
-				type: 'straight',
-				points: [
-					{ x: 20, y: 20, z: 0.7 },
-					{ x: 30, y: 30, z: 0.8 },
-				],
-			},
-		]
-		expect(
-			up({
-				props: {
-					segments: legacySegments,
-				},
-			})
-		).toEqual({
-			props: {
-				scaleX: 1,
-				scaleY: 1,
-				segments: compressLegacySegments(legacySegments as any),
-			},
-		})
-	})
-
-	test('down works as expected', () => {
-		const legacySegments = [
-			{
-				type: 'free',
-				points: [
-					{ x: 0, y: 0, z: 0.5 },
-					{ x: 10, y: 10, z: 0.6 },
-				],
-			},
-		]
-		const compressed = compressLegacySegments(legacySegments as any)
-		const result = down({
-			props: {
-				scaleX: 1,
-				scaleY: 1,
-				segments: compressed,
-			},
-		})
-		expect(result.props.scaleX).toBeUndefined()
-		expect(result.props.scaleY).toBeUndefined()
-		expect(Array.isArray(result.props.segments[0].points)).toBe(true)
-		expect(result.props.segments[0].points.length).toBe(2)
-	})
-})
-
-describe('Add scaleX, scaleY, and new base64 format to highlight shape', () => {
-	const { up, down } = getTestMigration(highlightShapeVersions.Base64)
-
-	test('up works as expected', () => {
-		const legacySegments = [
-			{
-				type: 'free',
-				points: [
-					{ x: 0, y: 0, z: 0.5 },
-					{ x: 10, y: 10, z: 0.6 },
-					{ x: 20, y: 20, z: 0.7 },
-				],
-			},
-			{
-				type: 'straight',
-				points: [
-					{ x: 20, y: 20, z: 0.7 },
-					{ x: 30, y: 30, z: 0.8 },
-				],
-			},
-		]
-		expect(
-			up({
-				props: {
-					segments: legacySegments,
-				},
-			})
-		).toEqual({
-			props: {
-				scaleX: 1,
-				scaleY: 1,
-				segments: compressLegacySegments(legacySegments as any),
-			},
-		})
-	})
-
-	test('down works as expected', () => {
-		const legacySegments = [
-			{
-				type: 'free',
-				points: [
-					{ x: 0, y: 0, z: 0.5 },
-					{ x: 10, y: 10, z: 0.6 },
-				],
-			},
-		]
-		const compressed = compressLegacySegments(legacySegments as any)
-		const result = down({
-			props: {
-				scaleX: 1,
-				scaleY: 1,
-				segments: compressed,
-			},
-		})
-		expect(result.props.scaleX).toBeUndefined()
-		expect(result.props.scaleY).toBeUndefined()
-		expect(Array.isArray(result.props.segments[0].points)).toBe(true)
-		expect(result.props.segments[0].points.length).toBe(2)
-	})
-})
-
 /* ---  PUT YOUR MIGRATIONS TESTS ABOVE HERE --- */
 
 // check that all migrator fns were called at least once

package/src/misc/TLOpacity.ts

@@ -53,4 +53,8 @@ export type TLOpacityType = number
  *
  * @public
  */
-export const opacityValidator = T.unitInterval
+export const opacityValidator = T.number.check((n) => {
+	if (n < 0 || n > 1) {
+		throw new T.ValidationError('Opacity must be between 0 and 1')
+	}
+})

package/src/misc/TLRichText.ts

@@ -12,12 +12,7 @@ import { T } from '@tldraw/validate'
  * const isValid = richTextValidator.check(richText) // true
  * ```
  */
-
-export const richTextValidator = T.object({
-	type: T.string,
-	content: T.arrayOf(T.unknown),
-	attrs: T.any.optional(),
-})
+export const richTextValidator = T.object({ type: T.string, content: T.arrayOf(T.unknown) })
 
 /**
  * Type representing rich text content in tldraw. Rich text follows a document-based

package/src/misc/id-validator.test.ts

@@ -0,0 +1,50 @@
+import type { RecordId, UnknownRecord } from '@tldraw/store'
+import { describe, expect, it } from 'vitest'
+import { idValidator } from './id-validator'
+
+// Mock record types for testing
+interface MockShapeRecord extends UnknownRecord {
+	typeName: 'shape'
+}
+
+interface MockPageRecord extends UnknownRecord {
+	typeName: 'page'
+}
+
+type MockShapeId = RecordId<MockShapeRecord>
+type MockPageId = RecordId<MockPageRecord>
+
+describe('idValidator', () => {
+	it('should validate correct IDs with proper prefix', () => {
+		const shapeValidator = idValidator<MockShapeId>('shape')
+		const pageValidator = idValidator<MockPageId>('page')
+
+		expect(shapeValidator.validate('shape:abc123')).toBe('shape:abc123')
+		expect(shapeValidator.validate('shape:')).toBe('shape:')
+		expect(pageValidator.validate('page:main')).toBe('page:main')
+	})
+
+	it('should reject IDs with wrong prefix', () => {
+		const shapeValidator = idValidator<MockShapeId>('shape')
+
+		expect(() => shapeValidator.validate('page:abc123')).toThrow(
+			'shape ID must start with "shape:"'
+		)
+		expect(() => shapeValidator.validate('asset:xyz789')).toThrow(
+			'shape ID must start with "shape:"'
+		)
+		expect(() => shapeValidator.validate('abc123')).toThrow('shape ID must start with "shape:"')
+		expect(() => shapeValidator.validate('')).toThrow('shape ID must start with "shape:"')
+	})
+
+	it('should work with different prefixes independently', () => {
+		const shapeValidator = idValidator<MockShapeId>('shape')
+		const pageValidator = idValidator<MockPageId>('page')
+
+		expect(shapeValidator.isValid('shape:abc123')).toBe(true)
+		expect(shapeValidator.isValid('page:abc123')).toBe(false)
+
+		expect(pageValidator.isValid('shape:abc123')).toBe(false)
+		expect(pageValidator.isValid('page:abc123')).toBe(true)
+	})
+})

package/src/records/TLAsset.test.ts

@@ -0,0 +1,234 @@
+import { describe, expect, it } from 'vitest'
+import { getTestMigration } from '../__tests__/migrationTestUtils'
+import {
+	assetMigrations,
+	AssetRecordType,
+	assetValidator,
+	assetVersions,
+	TLAssetId,
+} from './TLAsset'
+
+describe('TLAsset', () => {
+	describe('assetValidator', () => {
+		it('should validate different asset types using discriminated union', () => {
+			const imageAsset = {
+				id: 'asset:test_image',
+				typeName: 'asset' as const,
+				type: 'image' as const,
+				props: {
+					w: 100,
+					h: 100,
+					name: 'test.jpg',
+					isAnimated: false,
+					mimeType: 'image/jpeg',
+					src: 'https://example.com/test.jpg',
+				},
+				meta: {},
+			}
+
+			const videoAsset = {
+				id: 'asset:test_video',
+				typeName: 'asset' as const,
+				type: 'video' as const,
+				props: {
+					w: 640,
+					h: 480,
+					name: 'test.mp4',
+					isAnimated: true,
+					mimeType: 'video/mp4',
+					src: 'https://example.com/test.mp4',
+				},
+				meta: {},
+			}
+
+			const bookmarkAsset = {
+				id: 'asset:test_bookmark',
+				typeName: 'asset' as const,
+				type: 'bookmark' as const,
+				props: {
+					title: 'Test Site',
+					description: 'A test bookmark',
+					image: 'https://example.com/image.png',
+					favicon: 'https://example.com/favicon.ico',
+					src: 'https://example.com',
+				},
+				meta: {},
+			}
+
+			expect(() => assetValidator.validate(imageAsset)).not.toThrow()
+			expect(() => assetValidator.validate(videoAsset)).not.toThrow()
+			expect(() => assetValidator.validate(bookmarkAsset)).not.toThrow()
+
+			expect(assetValidator.validate(imageAsset).type).toBe('image')
+			expect(assetValidator.validate(videoAsset).type).toBe('video')
+			expect(assetValidator.validate(bookmarkAsset).type).toBe('bookmark')
+		})
+
+		it('should reject invalid asset types', () => {
+			const invalidAsset = {
+				id: 'asset:invalid',
+				typeName: 'asset' as const,
+				type: 'invalid_type' as any,
+				props: {
+					w: 100,
+					h: 100,
+					name: 'test.jpg',
+				},
+				meta: {},
+			}
+
+			expect(() => assetValidator.validate(invalidAsset)).toThrow()
+		})
+
+		it('should require valid asset structure', () => {
+			// Wrong typeName
+			const wrongTypeName = {
+				id: 'asset:wrong_typename',
+				typeName: 'shape' as const,
+				type: 'image' as const,
+				props: {
+					w: 100,
+					h: 100,
+					name: 'test.jpg',
+					isAnimated: false,
+					mimeType: 'image/jpeg',
+					src: 'https://example.com/test.jpg',
+				},
+				meta: {},
+			}
+			expect(() => assetValidator.validate(wrongTypeName)).toThrow()
+
+			// Missing meta
+			const noMeta = {
+				id: 'asset:no_meta',
+				typeName: 'asset' as const,
+				type: 'image' as const,
+				props: {
+					w: 100,
+					h: 100,
+					name: 'test.jpg',
+					isAnimated: false,
+					mimeType: 'image/jpeg',
+					src: 'https://example.com/test.jpg',
+				},
+			}
+			expect(() => assetValidator.validate(noMeta)).toThrow()
+
+			// Wrong ID prefix
+			const wrongId = {
+				id: 'shape:wrong_prefix',
+				typeName: 'asset' as const,
+				type: 'image' as const,
+				props: {
+					w: 100,
+					h: 100,
+					name: 'test.jpg',
+					isAnimated: false,
+					mimeType: 'image/jpeg',
+					src: 'https://example.com/test.jpg',
+				},
+				meta: {},
+			}
+			expect(() => assetValidator.validate(wrongId)).toThrow()
+		})
+	})
+
+	describe('assetMigrations', () => {
+		it('should have correct migration structure', () => {
+			expect(assetMigrations.sequenceId).toBe('com.tldraw.asset')
+			expect(assetMigrations.sequence).toHaveLength(1)
+			expect(assetMigrations.sequence[0].id).toBe(assetVersions.AddMeta)
+		})
+	})
+
+	describe('AddMeta migration', () => {
+		const { up } = getTestMigration(assetVersions.AddMeta)
+
+		it('should add empty meta property', () => {
+			const assetWithoutMeta = {
+				id: 'asset:test',
+				typeName: 'asset',
+				type: 'image',
+				props: {
+					w: 100,
+					h: 100,
+					name: 'test.jpg',
+					isAnimated: false,
+					mimeType: 'image/jpeg',
+					src: 'https://example.com/test.jpg',
+				},
+			}
+
+			const result = up(assetWithoutMeta)
+			expect(result.meta).toEqual({})
+			expect(result.props).toEqual(assetWithoutMeta.props)
+		})
+
+		it('should overwrite existing meta property', () => {
+			const assetWithMeta = {
+				id: 'asset:test',
+				typeName: 'asset',
+				type: 'image',
+				props: {
+					w: 100,
+					h: 100,
+					name: 'test.jpg',
+					isAnimated: false,
+					mimeType: 'image/jpeg',
+					src: 'https://example.com/test.jpg',
+				},
+				meta: { existing: 'data' },
+			}
+
+			const result = up(assetWithMeta)
+			expect(result.meta).toEqual({}) // Migration always sets to empty object
+		})
+
+		it('should preserve other properties during migration', () => {
+			const assetWithExtraProps = {
+				id: 'asset:extra_props',
+				typeName: 'asset',
+				type: 'image',
+				props: {
+					w: 200,
+					h: 150,
+					name: 'extra.png',
+					isAnimated: false,
+					mimeType: 'image/png',
+					src: 'https://example.com/extra.png',
+				},
+				customProperty: 'should be preserved',
+			}
+
+			const result = up(assetWithExtraProps)
+			expect(result.meta).toEqual({})
+			expect(result.customProperty).toBe('should be preserved')
+		})
+	})
+
+	describe('AssetRecordType', () => {
+		it('should have correct configuration', () => {
+			expect(AssetRecordType.typeName).toBe('asset')
+			expect(AssetRecordType.scope).toBe('document')
+			expect(AssetRecordType.validator).toBe(assetValidator)
+		})
+
+		it('should create records with default meta property', () => {
+			const assetRecord = AssetRecordType.create({
+				id: 'asset:test' as TLAssetId,
+				type: 'image',
+				props: {
+					w: 100,
+					h: 100,
+					name: 'test.jpg',
+					isAnimated: false,
+					mimeType: 'image/jpeg',
+					src: 'https://example.com/test.jpg',
+				},
+			})
+
+			expect(assetRecord.meta).toEqual({})
+			expect(assetRecord.typeName).toBe('asset')
+		})
+	})
+})

package/src/records/TLAsset.ts

@@ -9,7 +9,7 @@ import { TLBaseAsset } from '../assets/TLBaseAsset'
 import { bookmarkAssetValidator, TLBookmarkAsset } from '../assets/TLBookmarkAsset'
 import { imageAssetValidator, TLImageAsset } from '../assets/TLImageAsset'
 import { TLVideoAsset, videoAssetValidator } from '../assets/TLVideoAsset'
-import { ExtractShapeByProps } from './TLShape'
+import { TLShape } from './TLShape'
 
 /**
  * Union type representing all possible asset types in tldraw.
@@ -222,4 +222,4 @@ export type TLAssetId = RecordId<TLBaseAsset<any, any>>
  *
  * @public
  */
-export type TLAssetShape = ExtractShapeByProps<{ assetId: TLAssetId }>
+export type TLAssetShape = Extract<TLShape, { props: { assetId: TLAssetId } }>

package/src/records/TLBinding.test.ts

@@ -0,0 +1,22 @@
+import { describe, expect, it } from 'vitest'
+import { createBindingId, rootBindingMigrations } from './TLBinding'
+
+describe('TLBinding', () => {
+	describe('createBindingId function', () => {
+		it('should generate IDs starting with binding:', () => {
+			const id = createBindingId()
+			expect(id.startsWith('binding:')).toBe(true)
+		})
+
+		it('should use custom ID when provided', () => {
+			expect(createBindingId('test')).toBe('binding:test')
+		})
+	})
+
+	describe('rootBindingMigrations', () => {
+		it('should have correct structure', () => {
+			expect(rootBindingMigrations.sequenceId).toBe('com.tldraw.binding')
+			expect(Array.isArray(rootBindingMigrations.sequence)).toBe(true)
+		})
+	})
+})

package/src/records/TLBinding.ts

@@ -5,7 +5,7 @@ import {
 	createRecordMigrationSequence,
 	createRecordType,
 } from '@tldraw/store'
-import { mapObjectMapValues, uniqueId } from '@tldraw/utils'
+import { Expand, mapObjectMapValues, uniqueId } from '@tldraw/utils'
 import { T } from '@tldraw/validate'
 import { TLArrowBinding } from '../bindings/TLArrowBinding'
 import { TLBaseBinding, createBindingValidator } from '../bindings/TLBaseBinding'
@@ -56,42 +56,10 @@ export type TLDefaultBinding = TLArrowBinding
  */
 export type TLUnknownBinding = TLBaseBinding<string, object>
 
-/** @public */
-// eslint-disable-next-line @typescript-eslint/no-empty-object-type
-export interface TLGlobalBindingPropsMap {}
-
-/** @public */
-// prettier-ignore
-export type TLIndexedBindings = {
-	// We iterate over a union of augmented keys and default binding types.
-	// This allows us to include (or conditionally exclude or override) the default bindings in one go.
-	//
-	// In the `as` clause we are filtering out disabled bindings.
-	[K in keyof TLGlobalBindingPropsMap | TLDefaultBinding['type'] as K extends TLDefaultBinding['type']
-		? K extends keyof TLGlobalBindingPropsMap
-			? // if it extends a nullish value the user has disabled this binding type so we filter it out with never
-				TLGlobalBindingPropsMap[K] extends null | undefined
-				? never
-				: K
-			: K
-		: K]: K extends TLDefaultBinding['type']
-			? // if it's a default binding type we need to check if it's been overridden
-				K extends keyof TLGlobalBindingPropsMap
-				? // if it has been overriden then use the custom binding definition
-					TLBaseBinding<K, TLGlobalBindingPropsMap[K]>
-				: // if it has not been overriden then reuse existing type aliases for better type display
-					Extract<TLDefaultBinding, { type: K }>
-			: // use the custom binding definition
-				TLBaseBinding<K, TLGlobalBindingPropsMap[K & keyof TLGlobalBindingPropsMap]>
-}
-
 /**
- * The set of all bindings that are available in the editor.
+ * The set of all bindings that are available in the editor, including unknown bindings.
  * Bindings represent relationships between shapes, such as arrows connecting to other shapes.
  *
- * You can use this type without a type argument to work with any binding, or pass
- * a specific binding type string (e.g., `'arrow'`) to narrow down to that specific binding type.
- *
  * @example
  * ```ts
  * // Check binding type and handle accordingly
@@ -105,17 +73,11 @@ export type TLIndexedBindings = {
  *       break
  *   }
  * }
- *
- * // Narrow to a specific binding type by passing the type as a generic argument
- * function getArrowSourceId(binding: TLBinding<'arrow'>) {
- *   return binding.fromId // TypeScript knows this is a TLArrowBinding
- * }
  * ```
  *
  * @public
  */
-export type TLBinding<K extends keyof TLIndexedBindings = keyof TLIndexedBindings> =
-	TLIndexedBindings[K]
+export type TLBinding = TLDefaultBinding | TLUnknownBinding
 
 /**
  * Type for updating existing bindings with partial properties.
@@ -137,17 +99,15 @@ export type TLBinding<K extends keyof TLIndexedBindings = keyof TLIndexedBinding
  *
  * @public
  */
-export type TLBindingUpdate<T extends TLBinding = TLBinding> = T extends T
-	? {
-			id: TLBindingId
-			type: T['type']
-			typeName?: T['typeName']
-			fromId?: T['fromId']
-			toId?: T['toId']
-			props?: Partial<T['props']>
-			meta?: Partial<T['meta']>
-		}
-	: never
+export type TLBindingUpdate<T extends TLBinding = TLBinding> = Expand<{
+	id: TLBindingId
+	type: T['type']
+	typeName?: T['typeName']
+	fromId?: T['fromId']
+	toId?: T['toId']
+	props?: Partial<T['props']>
+	meta?: Partial<T['meta']>
+}>
 
 /**
  * Type for creating new bindings with required fromId and toId.
@@ -173,17 +133,15 @@ export type TLBindingUpdate<T extends TLBinding = TLBinding> = T extends T
  *
  * @public
  */
-export type TLBindingCreate<T extends TLBinding = TLBinding> = T extends T
-	? {
-			id?: TLBindingId
-			type: T['type']
-			typeName?: T['typeName']
-			fromId: T['fromId']
-			toId: T['toId']
-			props?: Partial<T['props']>
-			meta?: Partial<T['meta']>
-		}
-	: never
+export type TLBindingCreate<T extends TLBinding = TLBinding> = Expand<{
+	id?: TLBindingId
+	type: T['type']
+	typeName?: T['typeName']
+	fromId: T['fromId']
+	toId: T['toId']
+	props?: Partial<T['props']>
+	meta?: Partial<T['meta']>
+}>
 
 /**
  * Branded string type for binding record identifiers.
@@ -208,7 +166,7 @@ export type TLBindingCreate<T extends TLBinding = TLBinding> = T extends T
  *
  * @public
  */
-export type TLBindingId = RecordId<TLBinding>
+export type TLBindingId = RecordId<TLUnknownBinding>
 
 /**
  * Migration version identifiers for the root binding record schema.
@@ -417,7 +375,7 @@ export function createBindingPropsMigrationIds<S extends string, T extends Recor
  * @internal
  */
 export function createBindingRecordType(bindings: Record<string, SchemaPropsInfo>) {
-	return createRecordType('binding', {
+	return createRecordType<TLBinding>('binding', {
 		scope: 'document',
 		validator: T.model(
 			'binding',