@tldraw/tlschema 4.5.0-next.dad6df23ab1f → 4.5.0

package/dist-cjs/assets/TLImageAsset.js

@@ -35,7 +35,8 @@ const imageAssetValidator = (0, import_TLBaseAsset.createAssetValidator)(
     isAnimated: import_validate.T.boolean,
     mimeType: import_validate.T.string.nullable(),
     src: import_validate.T.srcUrl.nullable(),
-    fileSize: import_validate.T.nonZeroNumber.optional()
+    fileSize: import_validate.T.nonZeroNumber.optional(),
+    pixelRatio: import_validate.T.positiveNumber.optional()
   })
 );
 const Versions = (0, import_store.createMigrationIds)("com.tldraw.asset.image", {
@@ -43,7 +44,8 @@ const Versions = (0, import_store.createMigrationIds)("com.tldraw.asset.image",
   RenameWidthHeight: 2,
   MakeUrlsValid: 3,
   AddFileSize: 4,
-  MakeFileSizeOptional: 5
+  MakeFileSizeOptional: 5,
+  AddPixelRatio: 6
 });
 const imageAssetMigrations = (0, import_store.createRecordMigrationSequence)({
   sequenceId: "com.tldraw.asset.image",
@@ -105,6 +107,14 @@ const imageAssetMigrations = (0, import_store.createRecordMigrationSequence)({
           asset.props.fileSize = -1;
         }
       }
+    },
+    {
+      id: Versions.AddPixelRatio,
+      up: (_asset) => {
+      },
+      down: (asset) => {
+        delete asset.props.pixelRatio;
+      }
     }
   ]
 });

package/dist-cjs/assets/TLImageAsset.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/assets/TLImageAsset.ts"],
-  "sourcesContent": ["import { createMigrationIds, createRecordMigrationSequence } from '@tldraw/store'\nimport { T } from '@tldraw/validate'\nimport { TLAsset } from '../records/TLAsset'\nimport { TLBaseAsset, createAssetValidator } from './TLBaseAsset'\n\n/**\n * An asset for images such as PNGs and JPEGs, used by the TLImageShape.\n *\n * @public */\nexport type TLImageAsset = TLBaseAsset<\n\t'image',\n\t{\n\t\tw: number\n\t\th: number\n\t\tname: string\n\t\tisAnimated: boolean\n\t\tmimeType: string | null\n\t\tsrc: string | null\n\t\tfileSize?: number\n\t}\n>\n\n/**\n * Validator for image assets. Validates the structure and properties of TLImageAsset records\n * to ensure data integrity when image assets are stored or retrieved from the tldraw store.\n *\n * @example\n * ```ts\n * import { imageAssetValidator } from '@tldraw/tlschema'\n *\n * const imageAsset = {\n *   id: 'asset:image123',\n *   typeName: 'asset',\n *   type: 'image',\n *   props: {\n *     w: 800,\n *     h: 600,\n *     name: 'photo.jpg',\n *     isAnimated: false,\n *     mimeType: 'image/jpeg',\n *     src: 'https://example.com/photo.jpg',\n *     fileSize: 156000\n *   },\n *   meta: {}\n * }\n *\n * // Validate the asset\n * const isValid = imageAssetValidator.validate(imageAsset)\n * ```\n *\n * @public\n */\nexport const imageAssetValidator: T.Validator<TLImageAsset> = createAssetValidator(\n\t'image',\n\tT.object({\n\t\tw: T.number,\n\t\th: T.number,\n\t\tname: T.string,\n\t\tisAnimated: T.boolean,\n\t\tmimeType: T.string.nullable(),\n\t\tsrc: T.srcUrl.nullable(),\n\t\tfileSize: T.nonZeroNumber.optional(),\n\t})\n)\n\nconst Versions = createMigrationIds('com.tldraw.asset.image', {\n\tAddIsAnimated: 1,\n\tRenameWidthHeight: 2,\n\tMakeUrlsValid: 3,\n\tAddFileSize: 4,\n\tMakeFileSizeOptional: 5,\n} as const)\n\n/**\n * Migration version identifiers for image assets. These define the different schema versions\n * that image assets have gone through during the evolution of the tldraw data model.\n *\n * @example\n * ```ts\n * import { imageAssetVersions } from '@tldraw/tlschema'\n *\n * // Access specific version IDs\n * console.log(imageAssetVersions.AddIsAnimated) // Version when isAnimated was added\n * console.log(imageAssetVersions.RenameWidthHeight) // Version when width/height became w/h\n * ```\n *\n * @public\n */\nexport { Versions as imageAssetVersions }\n\n/**\n * Migration sequence for image assets. Handles the evolution of the image asset schema\n * over time, providing both forward (up) and backward (down) migration functions to\n * maintain compatibility across different versions of the tldraw data model.\n *\n * The sequence includes migrations for:\n * - Adding the `isAnimated` property to track animated images\n * - Renaming `width`/`height` properties to shorter `w`/`h` names\n * - Ensuring URLs are valid format\n * - Adding file size tracking\n * - Making file size optional\n *\n *\n * @public\n */\nexport const imageAssetMigrations = createRecordMigrationSequence({\n\tsequenceId: 'com.tldraw.asset.image',\n\trecordType: 'asset',\n\tfilter: (asset) => (asset as TLAsset).type === 'image',\n\tsequence: [\n\t\t{\n\t\t\tid: Versions.AddIsAnimated,\n\t\t\tup: (asset: any) => {\n\t\t\t\tasset.props.isAnimated = false\n\t\t\t},\n\t\t\tdown: (asset: any) => {\n\t\t\t\tdelete asset.props.isAnimated\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\tid: Versions.RenameWidthHeight,\n\t\t\tup: (asset: any) => {\n\t\t\t\tasset.props.w = asset.props.width\n\t\t\t\tasset.props.h = asset.props.height\n\t\t\t\tdelete asset.props.width\n\t\t\t\tdelete asset.props.height\n\t\t\t},\n\t\t\tdown: (asset: any) => {\n\t\t\t\tasset.props.width = asset.props.w\n\t\t\t\tasset.props.height = asset.props.h\n\t\t\t\tdelete asset.props.w\n\t\t\t\tdelete asset.props.h\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\tid: Versions.MakeUrlsValid,\n\t\t\tup: (asset: any) => {\n\t\t\t\tif (!T.srcUrl.isValid(asset.props.src)) {\n\t\t\t\t\tasset.props.src = ''\n\t\t\t\t}\n\t\t\t},\n\t\t\tdown: (_asset) => {\n\t\t\t\t// noop\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\tid: Versions.AddFileSize,\n\t\t\tup: (asset: any) => {\n\t\t\t\tasset.props.fileSize = -1\n\t\t\t},\n\t\t\tdown: (asset: any) => {\n\t\t\t\tdelete asset.props.fileSize\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\tid: Versions.MakeFileSizeOptional,\n\t\t\tup: (asset: any) => {\n\t\t\t\tif (asset.props.fileSize === -1) {\n\t\t\t\t\tasset.props.fileSize = undefined\n\t\t\t\t}\n\t\t\t},\n\t\t\tdown: (asset: any) => {\n\t\t\t\tif (asset.props.fileSize === undefined) {\n\t\t\t\t\tasset.props.fileSize = -1\n\t\t\t\t}\n\t\t\t},\n\t\t},\n\t],\n})\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAkE;AAClE,sBAAkB;AAElB,yBAAkD;AAiD3C,MAAM,0BAAiD;AAAA,EAC7D;AAAA,EACA,kBAAE,OAAO;AAAA,IACR,GAAG,kBAAE;AAAA,IACL,GAAG,kBAAE;AAAA,IACL,MAAM,kBAAE;AAAA,IACR,YAAY,kBAAE;AAAA,IACd,UAAU,kBAAE,OAAO,SAAS;AAAA,IAC5B,KAAK,kBAAE,OAAO,SAAS;AAAA,IACvB,UAAU,kBAAE,cAAc,SAAS;AAAA,EACpC,CAAC;AACF;AAEA,MAAM,eAAW,iCAAmB,0BAA0B;AAAA,EAC7D,eAAe;AAAA,EACf,mBAAmB;AAAA,EACnB,eAAe;AAAA,EACf,aAAa;AAAA,EACb,sBAAsB;AACvB,CAAU;AAkCH,MAAM,2BAAuB,4CAA8B;AAAA,EACjE,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,QAAQ,CAAC,UAAW,MAAkB,SAAS;AAAA,EAC/C,UAAU;AAAA,IACT;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,UAAe;AACnB,cAAM,MAAM,aAAa;AAAA,MAC1B;AAAA,MACA,MAAM,CAAC,UAAe;AACrB,eAAO,MAAM,MAAM;AAAA,MACpB;AAAA,IACD;AAAA,IACA;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,UAAe;AACnB,cAAM,MAAM,IAAI,MAAM,MAAM;AAC5B,cAAM,MAAM,IAAI,MAAM,MAAM;AAC5B,eAAO,MAAM,MAAM;AACnB,eAAO,MAAM,MAAM;AAAA,MACpB;AAAA,MACA,MAAM,CAAC,UAAe;AACrB,cAAM,MAAM,QAAQ,MAAM,MAAM;AAChC,cAAM,MAAM,SAAS,MAAM,MAAM;AACjC,eAAO,MAAM,MAAM;AACnB,eAAO,MAAM,MAAM;AAAA,MACpB;AAAA,IACD;AAAA,IACA;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,UAAe;AACnB,YAAI,CAAC,kBAAE,OAAO,QAAQ,MAAM,MAAM,GAAG,GAAG;AACvC,gBAAM,MAAM,MAAM;AAAA,QACnB;AAAA,MACD;AAAA,MACA,MAAM,CAAC,WAAW;AAAA,MAElB;AAAA,IACD;AAAA,IACA;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,UAAe;AACnB,cAAM,MAAM,WAAW;AAAA,MACxB;AAAA,MACA,MAAM,CAAC,UAAe;AACrB,eAAO,MAAM,MAAM;AAAA,MACpB;AAAA,IACD;AAAA,IACA;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,UAAe;AACnB,YAAI,MAAM,MAAM,aAAa,IAAI;AAChC,gBAAM,MAAM,WAAW;AAAA,QACxB;AAAA,MACD;AAAA,MACA,MAAM,CAAC,UAAe;AACrB,YAAI,MAAM,MAAM,aAAa,QAAW;AACvC,gBAAM,MAAM,WAAW;AAAA,QACxB;AAAA,MACD;AAAA,IACD;AAAA,EACD;AACD,CAAC;",
+  "sourcesContent": ["import { createMigrationIds, createRecordMigrationSequence } from '@tldraw/store'\nimport { T } from '@tldraw/validate'\nimport { TLAsset } from '../records/TLAsset'\nimport { TLBaseAsset, createAssetValidator } from './TLBaseAsset'\n\n/**\n * An asset for images such as PNGs and JPEGs, used by the TLImageShape.\n *\n * @public */\nexport type TLImageAsset = TLBaseAsset<\n\t'image',\n\t{\n\t\tw: number\n\t\th: number\n\t\tname: string\n\t\tisAnimated: boolean\n\t\tmimeType: string | null\n\t\tsrc: string | null\n\t\tfileSize?: number\n\t\tpixelRatio?: number\n\t}\n>\n\n/**\n * Validator for image assets. Validates the structure and properties of TLImageAsset records\n * to ensure data integrity when image assets are stored or retrieved from the tldraw store.\n *\n * @example\n * ```ts\n * import { imageAssetValidator } from '@tldraw/tlschema'\n *\n * const imageAsset = {\n *   id: 'asset:image123',\n *   typeName: 'asset',\n *   type: 'image',\n *   props: {\n *     w: 800,\n *     h: 600,\n *     name: 'photo.jpg',\n *     isAnimated: false,\n *     mimeType: 'image/jpeg',\n *     src: 'https://example.com/photo.jpg',\n *     fileSize: 156000\n *   },\n *   meta: {}\n * }\n *\n * // Validate the asset\n * const isValid = imageAssetValidator.validate(imageAsset)\n * ```\n *\n * @public\n */\nexport const imageAssetValidator: T.Validator<TLImageAsset> = createAssetValidator(\n\t'image',\n\tT.object({\n\t\tw: T.number,\n\t\th: T.number,\n\t\tname: T.string,\n\t\tisAnimated: T.boolean,\n\t\tmimeType: T.string.nullable(),\n\t\tsrc: T.srcUrl.nullable(),\n\t\tfileSize: T.nonZeroNumber.optional(),\n\t\tpixelRatio: T.positiveNumber.optional(),\n\t})\n)\n\nconst Versions = createMigrationIds('com.tldraw.asset.image', {\n\tAddIsAnimated: 1,\n\tRenameWidthHeight: 2,\n\tMakeUrlsValid: 3,\n\tAddFileSize: 4,\n\tMakeFileSizeOptional: 5,\n\tAddPixelRatio: 6,\n} as const)\n\n/**\n * Migration version identifiers for image assets. These define the different schema versions\n * that image assets have gone through during the evolution of the tldraw data model.\n *\n * @example\n * ```ts\n * import { imageAssetVersions } from '@tldraw/tlschema'\n *\n * // Access specific version IDs\n * console.log(imageAssetVersions.AddIsAnimated) // Version when isAnimated was added\n * console.log(imageAssetVersions.RenameWidthHeight) // Version when width/height became w/h\n * ```\n *\n * @public\n */\nexport { Versions as imageAssetVersions }\n\n/**\n * Migration sequence for image assets. Handles the evolution of the image asset schema\n * over time, providing both forward (up) and backward (down) migration functions to\n * maintain compatibility across different versions of the tldraw data model.\n *\n * The sequence includes migrations for:\n * - Adding the `isAnimated` property to track animated images\n * - Renaming `width`/`height` properties to shorter `w`/`h` names\n * - Ensuring URLs are valid format\n * - Adding file size tracking\n * - Making file size optional\n *\n *\n * @public\n */\nexport const imageAssetMigrations = createRecordMigrationSequence({\n\tsequenceId: 'com.tldraw.asset.image',\n\trecordType: 'asset',\n\tfilter: (asset) => (asset as TLAsset).type === 'image',\n\tsequence: [\n\t\t{\n\t\t\tid: Versions.AddIsAnimated,\n\t\t\tup: (asset: any) => {\n\t\t\t\tasset.props.isAnimated = false\n\t\t\t},\n\t\t\tdown: (asset: any) => {\n\t\t\t\tdelete asset.props.isAnimated\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\tid: Versions.RenameWidthHeight,\n\t\t\tup: (asset: any) => {\n\t\t\t\tasset.props.w = asset.props.width\n\t\t\t\tasset.props.h = asset.props.height\n\t\t\t\tdelete asset.props.width\n\t\t\t\tdelete asset.props.height\n\t\t\t},\n\t\t\tdown: (asset: any) => {\n\t\t\t\tasset.props.width = asset.props.w\n\t\t\t\tasset.props.height = asset.props.h\n\t\t\t\tdelete asset.props.w\n\t\t\t\tdelete asset.props.h\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\tid: Versions.MakeUrlsValid,\n\t\t\tup: (asset: any) => {\n\t\t\t\tif (!T.srcUrl.isValid(asset.props.src)) {\n\t\t\t\t\tasset.props.src = ''\n\t\t\t\t}\n\t\t\t},\n\t\t\tdown: (_asset) => {\n\t\t\t\t// noop\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\tid: Versions.AddFileSize,\n\t\t\tup: (asset: any) => {\n\t\t\t\tasset.props.fileSize = -1\n\t\t\t},\n\t\t\tdown: (asset: any) => {\n\t\t\t\tdelete asset.props.fileSize\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\tid: Versions.MakeFileSizeOptional,\n\t\t\tup: (asset: any) => {\n\t\t\t\tif (asset.props.fileSize === -1) {\n\t\t\t\t\tasset.props.fileSize = undefined\n\t\t\t\t}\n\t\t\t},\n\t\t\tdown: (asset: any) => {\n\t\t\t\tif (asset.props.fileSize === undefined) {\n\t\t\t\t\tasset.props.fileSize = -1\n\t\t\t\t}\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\tid: Versions.AddPixelRatio,\n\t\t\tup: (_asset: any) => {\n\t\t\t\t// noop \u2014 pixelRatio is optional and undefined by default\n\t\t\t},\n\t\t\tdown: (asset: any) => {\n\t\t\t\tdelete asset.props.pixelRatio\n\t\t\t},\n\t\t},\n\t],\n})\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAkE;AAClE,sBAAkB;AAElB,yBAAkD;AAkD3C,MAAM,0BAAiD;AAAA,EAC7D;AAAA,EACA,kBAAE,OAAO;AAAA,IACR,GAAG,kBAAE;AAAA,IACL,GAAG,kBAAE;AAAA,IACL,MAAM,kBAAE;AAAA,IACR,YAAY,kBAAE;AAAA,IACd,UAAU,kBAAE,OAAO,SAAS;AAAA,IAC5B,KAAK,kBAAE,OAAO,SAAS;AAAA,IACvB,UAAU,kBAAE,cAAc,SAAS;AAAA,IACnC,YAAY,kBAAE,eAAe,SAAS;AAAA,EACvC,CAAC;AACF;AAEA,MAAM,eAAW,iCAAmB,0BAA0B;AAAA,EAC7D,eAAe;AAAA,EACf,mBAAmB;AAAA,EACnB,eAAe;AAAA,EACf,aAAa;AAAA,EACb,sBAAsB;AAAA,EACtB,eAAe;AAChB,CAAU;AAkCH,MAAM,2BAAuB,4CAA8B;AAAA,EACjE,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,QAAQ,CAAC,UAAW,MAAkB,SAAS;AAAA,EAC/C,UAAU;AAAA,IACT;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,UAAe;AACnB,cAAM,MAAM,aAAa;AAAA,MAC1B;AAAA,MACA,MAAM,CAAC,UAAe;AACrB,eAAO,MAAM,MAAM;AAAA,MACpB;AAAA,IACD;AAAA,IACA;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,UAAe;AACnB,cAAM,MAAM,IAAI,MAAM,MAAM;AAC5B,cAAM,MAAM,IAAI,MAAM,MAAM;AAC5B,eAAO,MAAM,MAAM;AACnB,eAAO,MAAM,MAAM;AAAA,MACpB;AAAA,MACA,MAAM,CAAC,UAAe;AACrB,cAAM,MAAM,QAAQ,MAAM,MAAM;AAChC,cAAM,MAAM,SAAS,MAAM,MAAM;AACjC,eAAO,MAAM,MAAM;AACnB,eAAO,MAAM,MAAM;AAAA,MACpB;AAAA,IACD;AAAA,IACA;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,UAAe;AACnB,YAAI,CAAC,kBAAE,OAAO,QAAQ,MAAM,MAAM,GAAG,GAAG;AACvC,gBAAM,MAAM,MAAM;AAAA,QACnB;AAAA,MACD;AAAA,MACA,MAAM,CAAC,WAAW;AAAA,MAElB;AAAA,IACD;AAAA,IACA;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,UAAe;AACnB,cAAM,MAAM,WAAW;AAAA,MACxB;AAAA,MACA,MAAM,CAAC,UAAe;AACrB,eAAO,MAAM,MAAM;AAAA,MACpB;AAAA,IACD;AAAA,IACA;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,UAAe;AACnB,YAAI,MAAM,MAAM,aAAa,IAAI;AAChC,gBAAM,MAAM,WAAW;AAAA,QACxB;AAAA,MACD;AAAA,MACA,MAAM,CAAC,UAAe;AACrB,YAAI,MAAM,MAAM,aAAa,QAAW;AACvC,gBAAM,MAAM,WAAW;AAAA,QACxB;AAAA,MACD;AAAA,IACD;AAAA,IACA;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,WAAgB;AAAA,MAErB;AAAA,MACA,MAAM,CAAC,UAAe;AACrB,eAAO,MAAM,MAAM;AAAA,MACpB;AAAA,IACD;AAAA,EACD;AACD,CAAC;",
   "names": []
 }

package/dist-cjs/index.d.ts

@@ -4612,6 +4612,7 @@ export declare type TLImageAsset = TLBaseAsset<'image', {
     isAnimated: boolean;
     mimeType: null | string;
     name: string;
+    pixelRatio?: number;
     src: null | string;
     w: number;
 }>;

package/dist-cjs/index.js

@@ -181,7 +181,7 @@ var import_translations = require("./translations/translations");
 var import_b64Vecs = require("./misc/b64Vecs");
 (0, import_utils.registerTldrawLibraryVersion)(
   "@tldraw/tlschema",
-  "4.5.0-next.dad6df23ab1f",
+  "4.5.0",
   "cjs"
 );
 //# sourceMappingURL=index.js.map

package/dist-esm/assets/TLImageAsset.mjs

@@ -10,7 +10,8 @@ const imageAssetValidator = createAssetValidator(
     isAnimated: T.boolean,
     mimeType: T.string.nullable(),
     src: T.srcUrl.nullable(),
-    fileSize: T.nonZeroNumber.optional()
+    fileSize: T.nonZeroNumber.optional(),
+    pixelRatio: T.positiveNumber.optional()
   })
 );
 const Versions = createMigrationIds("com.tldraw.asset.image", {
@@ -18,7 +19,8 @@ const Versions = createMigrationIds("com.tldraw.asset.image", {
   RenameWidthHeight: 2,
   MakeUrlsValid: 3,
   AddFileSize: 4,
-  MakeFileSizeOptional: 5
+  MakeFileSizeOptional: 5,
+  AddPixelRatio: 6
 });
 const imageAssetMigrations = createRecordMigrationSequence({
   sequenceId: "com.tldraw.asset.image",
@@ -80,6 +82,14 @@ const imageAssetMigrations = createRecordMigrationSequence({
           asset.props.fileSize = -1;
         }
       }
+    },
+    {
+      id: Versions.AddPixelRatio,
+      up: (_asset) => {
+      },
+      down: (asset) => {
+        delete asset.props.pixelRatio;
+      }
     }
   ]
 });

package/dist-esm/assets/TLImageAsset.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/assets/TLImageAsset.ts"],
-  "sourcesContent": ["import { createMigrationIds, createRecordMigrationSequence } from '@tldraw/store'\nimport { T } from '@tldraw/validate'\nimport { TLAsset } from '../records/TLAsset'\nimport { TLBaseAsset, createAssetValidator } from './TLBaseAsset'\n\n/**\n * An asset for images such as PNGs and JPEGs, used by the TLImageShape.\n *\n * @public */\nexport type TLImageAsset = TLBaseAsset<\n\t'image',\n\t{\n\t\tw: number\n\t\th: number\n\t\tname: string\n\t\tisAnimated: boolean\n\t\tmimeType: string | null\n\t\tsrc: string | null\n\t\tfileSize?: number\n\t}\n>\n\n/**\n * Validator for image assets. Validates the structure and properties of TLImageAsset records\n * to ensure data integrity when image assets are stored or retrieved from the tldraw store.\n *\n * @example\n * ```ts\n * import { imageAssetValidator } from '@tldraw/tlschema'\n *\n * const imageAsset = {\n *   id: 'asset:image123',\n *   typeName: 'asset',\n *   type: 'image',\n *   props: {\n *     w: 800,\n *     h: 600,\n *     name: 'photo.jpg',\n *     isAnimated: false,\n *     mimeType: 'image/jpeg',\n *     src: 'https://example.com/photo.jpg',\n *     fileSize: 156000\n *   },\n *   meta: {}\n * }\n *\n * // Validate the asset\n * const isValid = imageAssetValidator.validate(imageAsset)\n * ```\n *\n * @public\n */\nexport const imageAssetValidator: T.Validator<TLImageAsset> = createAssetValidator(\n\t'image',\n\tT.object({\n\t\tw: T.number,\n\t\th: T.number,\n\t\tname: T.string,\n\t\tisAnimated: T.boolean,\n\t\tmimeType: T.string.nullable(),\n\t\tsrc: T.srcUrl.nullable(),\n\t\tfileSize: T.nonZeroNumber.optional(),\n\t})\n)\n\nconst Versions = createMigrationIds('com.tldraw.asset.image', {\n\tAddIsAnimated: 1,\n\tRenameWidthHeight: 2,\n\tMakeUrlsValid: 3,\n\tAddFileSize: 4,\n\tMakeFileSizeOptional: 5,\n} as const)\n\n/**\n * Migration version identifiers for image assets. These define the different schema versions\n * that image assets have gone through during the evolution of the tldraw data model.\n *\n * @example\n * ```ts\n * import { imageAssetVersions } from '@tldraw/tlschema'\n *\n * // Access specific version IDs\n * console.log(imageAssetVersions.AddIsAnimated) // Version when isAnimated was added\n * console.log(imageAssetVersions.RenameWidthHeight) // Version when width/height became w/h\n * ```\n *\n * @public\n */\nexport { Versions as imageAssetVersions }\n\n/**\n * Migration sequence for image assets. Handles the evolution of the image asset schema\n * over time, providing both forward (up) and backward (down) migration functions to\n * maintain compatibility across different versions of the tldraw data model.\n *\n * The sequence includes migrations for:\n * - Adding the `isAnimated` property to track animated images\n * - Renaming `width`/`height` properties to shorter `w`/`h` names\n * - Ensuring URLs are valid format\n * - Adding file size tracking\n * - Making file size optional\n *\n *\n * @public\n */\nexport const imageAssetMigrations = createRecordMigrationSequence({\n\tsequenceId: 'com.tldraw.asset.image',\n\trecordType: 'asset',\n\tfilter: (asset) => (asset as TLAsset).type === 'image',\n\tsequence: [\n\t\t{\n\t\t\tid: Versions.AddIsAnimated,\n\t\t\tup: (asset: any) => {\n\t\t\t\tasset.props.isAnimated = false\n\t\t\t},\n\t\t\tdown: (asset: any) => {\n\t\t\t\tdelete asset.props.isAnimated\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\tid: Versions.RenameWidthHeight,\n\t\t\tup: (asset: any) => {\n\t\t\t\tasset.props.w = asset.props.width\n\t\t\t\tasset.props.h = asset.props.height\n\t\t\t\tdelete asset.props.width\n\t\t\t\tdelete asset.props.height\n\t\t\t},\n\t\t\tdown: (asset: any) => {\n\t\t\t\tasset.props.width = asset.props.w\n\t\t\t\tasset.props.height = asset.props.h\n\t\t\t\tdelete asset.props.w\n\t\t\t\tdelete asset.props.h\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\tid: Versions.MakeUrlsValid,\n\t\t\tup: (asset: any) => {\n\t\t\t\tif (!T.srcUrl.isValid(asset.props.src)) {\n\t\t\t\t\tasset.props.src = ''\n\t\t\t\t}\n\t\t\t},\n\t\t\tdown: (_asset) => {\n\t\t\t\t// noop\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\tid: Versions.AddFileSize,\n\t\t\tup: (asset: any) => {\n\t\t\t\tasset.props.fileSize = -1\n\t\t\t},\n\t\t\tdown: (asset: any) => {\n\t\t\t\tdelete asset.props.fileSize\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\tid: Versions.MakeFileSizeOptional,\n\t\t\tup: (asset: any) => {\n\t\t\t\tif (asset.props.fileSize === -1) {\n\t\t\t\t\tasset.props.fileSize = undefined\n\t\t\t\t}\n\t\t\t},\n\t\t\tdown: (asset: any) => {\n\t\t\t\tif (asset.props.fileSize === undefined) {\n\t\t\t\t\tasset.props.fileSize = -1\n\t\t\t\t}\n\t\t\t},\n\t\t},\n\t],\n})\n"],
-  "mappings": "AAAA,SAAS,oBAAoB,qCAAqC;AAClE,SAAS,SAAS;AAElB,SAAsB,4BAA4B;AAiD3C,MAAM,sBAAiD;AAAA,EAC7D;AAAA,EACA,EAAE,OAAO;AAAA,IACR,GAAG,EAAE;AAAA,IACL,GAAG,EAAE;AAAA,IACL,MAAM,EAAE;AAAA,IACR,YAAY,EAAE;AAAA,IACd,UAAU,EAAE,OAAO,SAAS;AAAA,IAC5B,KAAK,EAAE,OAAO,SAAS;AAAA,IACvB,UAAU,EAAE,cAAc,SAAS;AAAA,EACpC,CAAC;AACF;AAEA,MAAM,WAAW,mBAAmB,0BAA0B;AAAA,EAC7D,eAAe;AAAA,EACf,mBAAmB;AAAA,EACnB,eAAe;AAAA,EACf,aAAa;AAAA,EACb,sBAAsB;AACvB,CAAU;AAkCH,MAAM,uBAAuB,8BAA8B;AAAA,EACjE,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,QAAQ,CAAC,UAAW,MAAkB,SAAS;AAAA,EAC/C,UAAU;AAAA,IACT;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,UAAe;AACnB,cAAM,MAAM,aAAa;AAAA,MAC1B;AAAA,MACA,MAAM,CAAC,UAAe;AACrB,eAAO,MAAM,MAAM;AAAA,MACpB;AAAA,IACD;AAAA,IACA;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,UAAe;AACnB,cAAM,MAAM,IAAI,MAAM,MAAM;AAC5B,cAAM,MAAM,IAAI,MAAM,MAAM;AAC5B,eAAO,MAAM,MAAM;AACnB,eAAO,MAAM,MAAM;AAAA,MACpB;AAAA,MACA,MAAM,CAAC,UAAe;AACrB,cAAM,MAAM,QAAQ,MAAM,MAAM;AAChC,cAAM,MAAM,SAAS,MAAM,MAAM;AACjC,eAAO,MAAM,MAAM;AACnB,eAAO,MAAM,MAAM;AAAA,MACpB;AAAA,IACD;AAAA,IACA;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,UAAe;AACnB,YAAI,CAAC,EAAE,OAAO,QAAQ,MAAM,MAAM,GAAG,GAAG;AACvC,gBAAM,MAAM,MAAM;AAAA,QACnB;AAAA,MACD;AAAA,MACA,MAAM,CAAC,WAAW;AAAA,MAElB;AAAA,IACD;AAAA,IACA;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,UAAe;AACnB,cAAM,MAAM,WAAW;AAAA,MACxB;AAAA,MACA,MAAM,CAAC,UAAe;AACrB,eAAO,MAAM,MAAM;AAAA,MACpB;AAAA,IACD;AAAA,IACA;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,UAAe;AACnB,YAAI,MAAM,MAAM,aAAa,IAAI;AAChC,gBAAM,MAAM,WAAW;AAAA,QACxB;AAAA,MACD;AAAA,MACA,MAAM,CAAC,UAAe;AACrB,YAAI,MAAM,MAAM,aAAa,QAAW;AACvC,gBAAM,MAAM,WAAW;AAAA,QACxB;AAAA,MACD;AAAA,IACD;AAAA,EACD;AACD,CAAC;",
+  "sourcesContent": ["import { createMigrationIds, createRecordMigrationSequence } from '@tldraw/store'\nimport { T } from '@tldraw/validate'\nimport { TLAsset } from '../records/TLAsset'\nimport { TLBaseAsset, createAssetValidator } from './TLBaseAsset'\n\n/**\n * An asset for images such as PNGs and JPEGs, used by the TLImageShape.\n *\n * @public */\nexport type TLImageAsset = TLBaseAsset<\n\t'image',\n\t{\n\t\tw: number\n\t\th: number\n\t\tname: string\n\t\tisAnimated: boolean\n\t\tmimeType: string | null\n\t\tsrc: string | null\n\t\tfileSize?: number\n\t\tpixelRatio?: number\n\t}\n>\n\n/**\n * Validator for image assets. Validates the structure and properties of TLImageAsset records\n * to ensure data integrity when image assets are stored or retrieved from the tldraw store.\n *\n * @example\n * ```ts\n * import { imageAssetValidator } from '@tldraw/tlschema'\n *\n * const imageAsset = {\n *   id: 'asset:image123',\n *   typeName: 'asset',\n *   type: 'image',\n *   props: {\n *     w: 800,\n *     h: 600,\n *     name: 'photo.jpg',\n *     isAnimated: false,\n *     mimeType: 'image/jpeg',\n *     src: 'https://example.com/photo.jpg',\n *     fileSize: 156000\n *   },\n *   meta: {}\n * }\n *\n * // Validate the asset\n * const isValid = imageAssetValidator.validate(imageAsset)\n * ```\n *\n * @public\n */\nexport const imageAssetValidator: T.Validator<TLImageAsset> = createAssetValidator(\n\t'image',\n\tT.object({\n\t\tw: T.number,\n\t\th: T.number,\n\t\tname: T.string,\n\t\tisAnimated: T.boolean,\n\t\tmimeType: T.string.nullable(),\n\t\tsrc: T.srcUrl.nullable(),\n\t\tfileSize: T.nonZeroNumber.optional(),\n\t\tpixelRatio: T.positiveNumber.optional(),\n\t})\n)\n\nconst Versions = createMigrationIds('com.tldraw.asset.image', {\n\tAddIsAnimated: 1,\n\tRenameWidthHeight: 2,\n\tMakeUrlsValid: 3,\n\tAddFileSize: 4,\n\tMakeFileSizeOptional: 5,\n\tAddPixelRatio: 6,\n} as const)\n\n/**\n * Migration version identifiers for image assets. These define the different schema versions\n * that image assets have gone through during the evolution of the tldraw data model.\n *\n * @example\n * ```ts\n * import { imageAssetVersions } from '@tldraw/tlschema'\n *\n * // Access specific version IDs\n * console.log(imageAssetVersions.AddIsAnimated) // Version when isAnimated was added\n * console.log(imageAssetVersions.RenameWidthHeight) // Version when width/height became w/h\n * ```\n *\n * @public\n */\nexport { Versions as imageAssetVersions }\n\n/**\n * Migration sequence for image assets. Handles the evolution of the image asset schema\n * over time, providing both forward (up) and backward (down) migration functions to\n * maintain compatibility across different versions of the tldraw data model.\n *\n * The sequence includes migrations for:\n * - Adding the `isAnimated` property to track animated images\n * - Renaming `width`/`height` properties to shorter `w`/`h` names\n * - Ensuring URLs are valid format\n * - Adding file size tracking\n * - Making file size optional\n *\n *\n * @public\n */\nexport const imageAssetMigrations = createRecordMigrationSequence({\n\tsequenceId: 'com.tldraw.asset.image',\n\trecordType: 'asset',\n\tfilter: (asset) => (asset as TLAsset).type === 'image',\n\tsequence: [\n\t\t{\n\t\t\tid: Versions.AddIsAnimated,\n\t\t\tup: (asset: any) => {\n\t\t\t\tasset.props.isAnimated = false\n\t\t\t},\n\t\t\tdown: (asset: any) => {\n\t\t\t\tdelete asset.props.isAnimated\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\tid: Versions.RenameWidthHeight,\n\t\t\tup: (asset: any) => {\n\t\t\t\tasset.props.w = asset.props.width\n\t\t\t\tasset.props.h = asset.props.height\n\t\t\t\tdelete asset.props.width\n\t\t\t\tdelete asset.props.height\n\t\t\t},\n\t\t\tdown: (asset: any) => {\n\t\t\t\tasset.props.width = asset.props.w\n\t\t\t\tasset.props.height = asset.props.h\n\t\t\t\tdelete asset.props.w\n\t\t\t\tdelete asset.props.h\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\tid: Versions.MakeUrlsValid,\n\t\t\tup: (asset: any) => {\n\t\t\t\tif (!T.srcUrl.isValid(asset.props.src)) {\n\t\t\t\t\tasset.props.src = ''\n\t\t\t\t}\n\t\t\t},\n\t\t\tdown: (_asset) => {\n\t\t\t\t// noop\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\tid: Versions.AddFileSize,\n\t\t\tup: (asset: any) => {\n\t\t\t\tasset.props.fileSize = -1\n\t\t\t},\n\t\t\tdown: (asset: any) => {\n\t\t\t\tdelete asset.props.fileSize\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\tid: Versions.MakeFileSizeOptional,\n\t\t\tup: (asset: any) => {\n\t\t\t\tif (asset.props.fileSize === -1) {\n\t\t\t\t\tasset.props.fileSize = undefined\n\t\t\t\t}\n\t\t\t},\n\t\t\tdown: (asset: any) => {\n\t\t\t\tif (asset.props.fileSize === undefined) {\n\t\t\t\t\tasset.props.fileSize = -1\n\t\t\t\t}\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\tid: Versions.AddPixelRatio,\n\t\t\tup: (_asset: any) => {\n\t\t\t\t// noop \u2014 pixelRatio is optional and undefined by default\n\t\t\t},\n\t\t\tdown: (asset: any) => {\n\t\t\t\tdelete asset.props.pixelRatio\n\t\t\t},\n\t\t},\n\t],\n})\n"],
+  "mappings": "AAAA,SAAS,oBAAoB,qCAAqC;AAClE,SAAS,SAAS;AAElB,SAAsB,4BAA4B;AAkD3C,MAAM,sBAAiD;AAAA,EAC7D;AAAA,EACA,EAAE,OAAO;AAAA,IACR,GAAG,EAAE;AAAA,IACL,GAAG,EAAE;AAAA,IACL,MAAM,EAAE;AAAA,IACR,YAAY,EAAE;AAAA,IACd,UAAU,EAAE,OAAO,SAAS;AAAA,IAC5B,KAAK,EAAE,OAAO,SAAS;AAAA,IACvB,UAAU,EAAE,cAAc,SAAS;AAAA,IACnC,YAAY,EAAE,eAAe,SAAS;AAAA,EACvC,CAAC;AACF;AAEA,MAAM,WAAW,mBAAmB,0BAA0B;AAAA,EAC7D,eAAe;AAAA,EACf,mBAAmB;AAAA,EACnB,eAAe;AAAA,EACf,aAAa;AAAA,EACb,sBAAsB;AAAA,EACtB,eAAe;AAChB,CAAU;AAkCH,MAAM,uBAAuB,8BAA8B;AAAA,EACjE,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,QAAQ,CAAC,UAAW,MAAkB,SAAS;AAAA,EAC/C,UAAU;AAAA,IACT;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,UAAe;AACnB,cAAM,MAAM,aAAa;AAAA,MAC1B;AAAA,MACA,MAAM,CAAC,UAAe;AACrB,eAAO,MAAM,MAAM;AAAA,MACpB;AAAA,IACD;AAAA,IACA;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,UAAe;AACnB,cAAM,MAAM,IAAI,MAAM,MAAM;AAC5B,cAAM,MAAM,IAAI,MAAM,MAAM;AAC5B,eAAO,MAAM,MAAM;AACnB,eAAO,MAAM,MAAM;AAAA,MACpB;AAAA,MACA,MAAM,CAAC,UAAe;AACrB,cAAM,MAAM,QAAQ,MAAM,MAAM;AAChC,cAAM,MAAM,SAAS,MAAM,MAAM;AACjC,eAAO,MAAM,MAAM;AACnB,eAAO,MAAM,MAAM;AAAA,MACpB;AAAA,IACD;AAAA,IACA;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,UAAe;AACnB,YAAI,CAAC,EAAE,OAAO,QAAQ,MAAM,MAAM,GAAG,GAAG;AACvC,gBAAM,MAAM,MAAM;AAAA,QACnB;AAAA,MACD;AAAA,MACA,MAAM,CAAC,WAAW;AAAA,MAElB;AAAA,IACD;AAAA,IACA;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,UAAe;AACnB,cAAM,MAAM,WAAW;AAAA,MACxB;AAAA,MACA,MAAM,CAAC,UAAe;AACrB,eAAO,MAAM,MAAM;AAAA,MACpB;AAAA,IACD;AAAA,IACA;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,UAAe;AACnB,YAAI,MAAM,MAAM,aAAa,IAAI;AAChC,gBAAM,MAAM,WAAW;AAAA,QACxB;AAAA,MACD;AAAA,MACA,MAAM,CAAC,UAAe;AACrB,YAAI,MAAM,MAAM,aAAa,QAAW;AACvC,gBAAM,MAAM,WAAW;AAAA,QACxB;AAAA,MACD;AAAA,IACD;AAAA,IACA;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,WAAgB;AAAA,MAErB;AAAA,MACA,MAAM,CAAC,UAAe;AACrB,eAAO,MAAM,MAAM;AAAA,MACpB;AAAA,IACD;AAAA,EACD;AACD,CAAC;",
   "names": []
 }

package/dist-esm/index.d.mts

@@ -4612,6 +4612,7 @@ export declare type TLImageAsset = TLBaseAsset<'image', {
     isAnimated: boolean;
     mimeType: null | string;
     name: string;
+    pixelRatio?: number;
     src: null | string;
     w: number;
 }>;

package/dist-esm/index.mjs

@@ -174,7 +174,7 @@ import {
 } from "./translations/translations.mjs";
 registerTldrawLibraryVersion(
   "@tldraw/tlschema",
-  "4.5.0-next.dad6df23ab1f",
+  "4.5.0",
   "esm"
 );
 import { b64Vecs } from "./misc/b64Vecs.mjs";

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tldraw/tlschema",
   "description": "tldraw infinite canvas SDK (schema).",
-  "version": "4.5.0-next.dad6df23ab1f",
+  "version": "4.5.0",
   "author": {
     "name": "tldraw Inc.",
     "email": "hello@tldraw.com"
@@ -50,10 +50,10 @@
     "vitest": "^3.2.4"
   },
   "dependencies": {
-    "@tldraw/state": "4.5.0-next.dad6df23ab1f",
-    "@tldraw/store": "4.5.0-next.dad6df23ab1f",
-    "@tldraw/utils": "4.5.0-next.dad6df23ab1f",
-    "@tldraw/validate": "4.5.0-next.dad6df23ab1f"
+    "@tldraw/state": "4.5.0",
+    "@tldraw/store": "4.5.0",
+    "@tldraw/utils": "4.5.0",
+    "@tldraw/validate": "4.5.0"
   },
   "peerDependencies": {
     "react": "^18.2.0 || ^19.2.1",

package/src/assets/TLImageAsset.ts

@@ -17,6 +17,7 @@ export type TLImageAsset = TLBaseAsset<
 		mimeType: string | null
 		src: string | null
 		fileSize?: number
+		pixelRatio?: number
 	}
 >
 
@@ -60,6 +61,7 @@ export const imageAssetValidator: T.Validator<TLImageAsset> = createAssetValidat
 		mimeType: T.string.nullable(),
 		src: T.srcUrl.nullable(),
 		fileSize: T.nonZeroNumber.optional(),
+		pixelRatio: T.positiveNumber.optional(),
 	})
 )
 
@@ -69,6 +71,7 @@ const Versions = createMigrationIds('com.tldraw.asset.image', {
 	MakeUrlsValid: 3,
 	AddFileSize: 4,
 	MakeFileSizeOptional: 5,
+	AddPixelRatio: 6,
 } as const)
 
 /**
@@ -165,5 +168,14 @@ export const imageAssetMigrations = createRecordMigrationSequence({
 				}
 			},
 		},
+		{
+			id: Versions.AddPixelRatio,
+			up: (_asset: any) => {
+				// noop — pixelRatio is optional and undefined by default
+			},
+			down: (asset: any) => {
+				delete asset.props.pixelRatio
+			},
+		},
 	],
 })

package/src/migrations.test.ts

@@ -2102,6 +2102,21 @@ describe('Make image asset file size optional', () => {
 	})
 })
 
+describe('Add pixelRatio to image asset', () => {
+	const { up, down } = getTestMigration(imageAssetVersions.AddPixelRatio)
+
+	test('up works as expected', () => {
+		expect(up({ props: { w: 100, h: 100 } })).toEqual({ props: { w: 100, h: 100 } })
+	})
+
+	test('down works as expected', () => {
+		expect(down({ props: { w: 100, h: 100, pixelRatio: 2 } })).toEqual({
+			props: { w: 100, h: 100 },
+		})
+		expect(down({ props: { w: 100, h: 100 } })).toEqual({ props: { w: 100, h: 100 } })
+	})
+})
+
 describe('Add flipX, flipY to image shape', () => {
 	const { up, down } = getTestMigration(imageShapeVersions.AddFlipProps)