@tldraw/tlschema 4.2.1 → 4.2.2

package/dist-esm/shapes/TLHighlightShape.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/shapes/TLHighlightShape.ts"],
-  "sourcesContent": ["import { T } from '@tldraw/validate'\nimport { createShapePropsMigrationIds, createShapePropsMigrationSequence } from '../records/TLShape'\nimport { RecordProps } from '../recordsWithProps'\nimport { DefaultColorStyle, TLDefaultColorStyle } from '../styles/TLColorStyle'\nimport { DefaultSizeStyle, TLDefaultSizeStyle } from '../styles/TLSizeStyle'\nimport { TLBaseShape } from './TLBaseShape'\nimport { DrawShapeSegment, TLDrawShapeSegment } from './TLDrawShape'\n\n/**\n * Properties for a highlight shape. Highlight shapes represent highlighting strokes made with\n * a highlighting tool, typically used to emphasize or mark up content.\n *\n * @public\n * @example\n * ```ts\n * const highlightProps: TLHighlightShapeProps = {\n *   color: 'yellow',\n *   size: 'm',\n *   segments: [{ type: 'straight', points: [{ x: 0, y: 0, z: 0.5 }] }],\n *   isComplete: true,\n *   isPen: false,\n *   scale: 1\n * }\n * ```\n */\nexport interface TLHighlightShapeProps {\n\t/** The color style of the highlight stroke */\n\tcolor: TLDefaultColorStyle\n\t/** The size style determining the thickness of the highlight stroke */\n\tsize: TLDefaultSizeStyle\n\t/** Array of segments that make up the highlight stroke path */\n\tsegments: TLDrawShapeSegment[]\n\t/** Whether the highlight stroke has been completed by the user */\n\tisComplete: boolean\n\t/** Whether the highlight was drawn with a pen/stylus (affects rendering style) */\n\tisPen: boolean\n\t/** Scale factor applied to the highlight shape for display */\n\tscale: number\n}\n\n/**\n * A highlight shape representing a highlighting stroke drawn by the user. Highlight shapes\n * are typically semi-transparent and used for marking up or emphasizing content on the canvas.\n *\n * @public\n * @example\n * ```ts\n * const highlightShape: TLHighlightShape = {\n *   id: 'shape:highlight1',\n *   type: 'highlight',\n *   x: 100,\n *   y: 50,\n *   rotation: 0,\n *   index: 'a1',\n *   parentId: 'page:main',\n *   isLocked: false,\n *   opacity: 0.7,\n *   props: {\n *     color: 'yellow',\n *     size: 'l',\n *     segments: [],\n *     isComplete: false,\n *     isPen: false,\n *     scale: 1\n *   },\n *   meta: {},\n *   typeName: 'shape'\n * }\n * ```\n */\nexport type TLHighlightShape = TLBaseShape<'highlight', TLHighlightShapeProps>\n\n/**\n * Validation schema for highlight shape properties. Defines the runtime validation rules\n * for all properties of highlight shapes.\n *\n * @public\n * @example\n * ```ts\n * import { highlightShapeProps } from '@tldraw/tlschema'\n *\n * // Used internally by the validation system\n * const validator = T.object(highlightShapeProps)\n * const validatedProps = validator.validate(someHighlightProps)\n * ```\n */\nexport const highlightShapeProps: RecordProps<TLHighlightShape> = {\n\tcolor: DefaultColorStyle,\n\tsize: DefaultSizeStyle,\n\tsegments: T.arrayOf(DrawShapeSegment),\n\tisComplete: T.boolean,\n\tisPen: T.boolean,\n\tscale: T.nonZeroNumber,\n}\n\nconst Versions = createShapePropsMigrationIds('highlight', {\n\tAddScale: 1,\n})\n\n/**\n * Version identifiers for highlight shape migrations. These version numbers track\n * schema changes over time to enable proper data migration.\n *\n * @public\n */\nexport { Versions as highlightShapeVersions }\n\n/**\n * Migration sequence for highlight shapes. Handles schema evolution over time by defining\n * how to upgrade and downgrade highlight shape data between different versions.\n *\n * @public\n */\nexport const highlightShapeMigrations = createShapePropsMigrationSequence({\n\tsequence: [\n\t\t{\n\t\t\tid: Versions.AddScale,\n\t\t\tup: (props) => {\n\t\t\t\tprops.scale = 1\n\t\t\t},\n\t\t\tdown: (props) => {\n\t\t\t\tdelete props.scale\n\t\t\t},\n\t\t},\n\t],\n})\n"],
-  "mappings": "AAAA,SAAS,SAAS;AAClB,SAAS,8BAA8B,yCAAyC;AAEhF,SAAS,yBAA8C;AACvD,SAAS,wBAA4C;AAErD,SAAS,wBAA4C;AAgF9C,MAAM,sBAAqD;AAAA,EACjE,OAAO;AAAA,EACP,MAAM;AAAA,EACN,UAAU,EAAE,QAAQ,gBAAgB;AAAA,EACpC,YAAY,EAAE;AAAA,EACd,OAAO,EAAE;AAAA,EACT,OAAO,EAAE;AACV;AAEA,MAAM,WAAW,6BAA6B,aAAa;AAAA,EAC1D,UAAU;AACX,CAAC;AAgBM,MAAM,2BAA2B,kCAAkC;AAAA,EACzE,UAAU;AAAA,IACT;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,UAAU;AACd,cAAM,QAAQ;AAAA,MACf;AAAA,MACA,MAAM,CAAC,UAAU;AAChB,eAAO,MAAM;AAAA,MACd;AAAA,IACD;AAAA,EACD;AACD,CAAC;",
+  "sourcesContent": ["import { T } from '@tldraw/validate'\nimport { b64Vecs } from '../misc/b64Vecs'\nimport { createShapePropsMigrationIds, createShapePropsMigrationSequence } from '../records/TLShape'\nimport { RecordProps } from '../recordsWithProps'\nimport { DefaultColorStyle, TLDefaultColorStyle } from '../styles/TLColorStyle'\nimport { DefaultSizeStyle, TLDefaultSizeStyle } from '../styles/TLSizeStyle'\nimport { TLBaseShape } from './TLBaseShape'\nimport { DrawShapeSegment, TLDrawShapeSegment } from './TLDrawShape'\n\n/**\n * Properties for a highlight shape. Highlight shapes represent highlighting strokes made with\n * a highlighting tool, typically used to emphasize or mark up content.\n *\n * @public\n * @example\n * ```ts\n * const highlightProps: TLHighlightShapeProps = {\n *   color: 'yellow',\n *   size: 'm',\n *   segments: [{ type: 'straight', points: [{ x: 0, y: 0, z: 0.5 }] }],\n *   isComplete: true,\n *   isPen: false,\n *   scale: 1\n * }\n * ```\n */\nexport interface TLHighlightShapeProps {\n\t/** The color style of the highlight stroke */\n\tcolor: TLDefaultColorStyle\n\t/** The size style determining the thickness of the highlight stroke */\n\tsize: TLDefaultSizeStyle\n\t/** Array of segments that make up the highlight stroke path */\n\tsegments: TLDrawShapeSegment[]\n\t/** Whether the highlight stroke has been completed by the user */\n\tisComplete: boolean\n\t/** Whether the highlight was drawn with a pen/stylus (affects rendering style) */\n\tisPen: boolean\n\t/** Scale factor applied to the highlight shape for display */\n\tscale: number\n\t/** Horizontal scale factor for lazy resize */\n\tscaleX: number\n\t/** Vertical scale factor for lazy resize */\n\tscaleY: number\n}\n\n/**\n * A highlight shape representing a highlighting stroke drawn by the user. Highlight shapes\n * are typically semi-transparent and used for marking up or emphasizing content on the canvas.\n *\n * @public\n * @example\n * ```ts\n * const highlightShape: TLHighlightShape = {\n *   id: 'shape:highlight1',\n *   type: 'highlight',\n *   x: 100,\n *   y: 50,\n *   rotation: 0,\n *   index: 'a1',\n *   parentId: 'page:main',\n *   isLocked: false,\n *   opacity: 0.7,\n *   props: {\n *     color: 'yellow',\n *     size: 'l',\n *     segments: [],\n *     isComplete: false,\n *     isPen: false,\n *     scale: 1\n *   },\n *   meta: {},\n *   typeName: 'shape'\n * }\n * ```\n */\nexport type TLHighlightShape = TLBaseShape<'highlight', TLHighlightShapeProps>\n\n/**\n * Validation schema for highlight shape properties. Defines the runtime validation rules\n * for all properties of highlight shapes.\n *\n * @public\n * @example\n * ```ts\n * import { highlightShapeProps } from '@tldraw/tlschema'\n *\n * // Used internally by the validation system\n * const validator = T.object(highlightShapeProps)\n * const validatedProps = validator.validate(someHighlightProps)\n * ```\n */\n/** @public */\nexport const highlightShapeProps: RecordProps<TLHighlightShape> = {\n\tcolor: DefaultColorStyle,\n\tsize: DefaultSizeStyle,\n\tsegments: T.arrayOf(DrawShapeSegment),\n\tisComplete: T.boolean,\n\tisPen: T.boolean,\n\tscale: T.nonZeroNumber,\n\tscaleX: T.nonZeroFiniteNumber,\n\tscaleY: T.nonZeroFiniteNumber,\n}\n\nconst Versions = createShapePropsMigrationIds('highlight', {\n\tAddScale: 1,\n\tBase64: 2,\n})\n\n/**\n * Version identifiers for highlight shape migrations. These version numbers track\n * schema changes over time to enable proper data migration.\n *\n * @public\n */\nexport { Versions as highlightShapeVersions }\n\n/**\n * Migration sequence for highlight shapes. Handles schema evolution over time by defining\n * how to upgrade and downgrade highlight shape data between different versions.\n *\n * @public\n */\nexport const highlightShapeMigrations = createShapePropsMigrationSequence({\n\tsequence: [\n\t\t{\n\t\t\tid: Versions.AddScale,\n\t\t\tup: (props) => {\n\t\t\t\tprops.scale = 1\n\t\t\t},\n\t\t\tdown: (props) => {\n\t\t\t\tdelete props.scale\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\tid: Versions.Base64,\n\t\t\tup: (props) => {\n\t\t\t\tprops.segments = props.segments.map((segment: any) => {\n\t\t\t\t\treturn {\n\t\t\t\t\t\t...segment,\n\t\t\t\t\t\t// Only encode if points is an array (not already base64 string)\n\t\t\t\t\t\tpoints:\n\t\t\t\t\t\t\ttypeof segment.points === 'string'\n\t\t\t\t\t\t\t\t? segment.points\n\t\t\t\t\t\t\t\t: b64Vecs.encodePoints(segment.points),\n\t\t\t\t\t}\n\t\t\t\t})\n\t\t\t\tprops.scaleX = props.scaleX ?? 1\n\t\t\t\tprops.scaleY = props.scaleY ?? 1\n\t\t\t},\n\t\t\tdown: (props) => {\n\t\t\t\tprops.segments = props.segments.map((segment: any) => ({\n\t\t\t\t\t...segment,\n\t\t\t\t\t// Only decode if points is a string (not already VecModel[])\n\t\t\t\t\tpoints: Array.isArray(segment.points)\n\t\t\t\t\t\t? segment.points\n\t\t\t\t\t\t: b64Vecs.decodePoints(segment.points),\n\t\t\t\t}))\n\t\t\t\tdelete props.scaleX\n\t\t\t\tdelete props.scaleY\n\t\t\t},\n\t\t},\n\t],\n})\n"],
+  "mappings": "AAAA,SAAS,SAAS;AAClB,SAAS,eAAe;AACxB,SAAS,8BAA8B,yCAAyC;AAEhF,SAAS,yBAA8C;AACvD,SAAS,wBAA4C;AAErD,SAAS,wBAA4C;AAqF9C,MAAM,sBAAqD;AAAA,EACjE,OAAO;AAAA,EACP,MAAM;AAAA,EACN,UAAU,EAAE,QAAQ,gBAAgB;AAAA,EACpC,YAAY,EAAE;AAAA,EACd,OAAO,EAAE;AAAA,EACT,OAAO,EAAE;AAAA,EACT,QAAQ,EAAE;AAAA,EACV,QAAQ,EAAE;AACX;AAEA,MAAM,WAAW,6BAA6B,aAAa;AAAA,EAC1D,UAAU;AAAA,EACV,QAAQ;AACT,CAAC;AAgBM,MAAM,2BAA2B,kCAAkC;AAAA,EACzE,UAAU;AAAA,IACT;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,UAAU;AACd,cAAM,QAAQ;AAAA,MACf;AAAA,MACA,MAAM,CAAC,UAAU;AAChB,eAAO,MAAM;AAAA,MACd;AAAA,IACD;AAAA,IACA;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,UAAU;AACd,cAAM,WAAW,MAAM,SAAS,IAAI,CAAC,YAAiB;AACrD,iBAAO;AAAA,YACN,GAAG;AAAA;AAAA,YAEH,QACC,OAAO,QAAQ,WAAW,WACvB,QAAQ,SACR,QAAQ,aAAa,QAAQ,MAAM;AAAA,UACxC;AAAA,QACD,CAAC;AACD,cAAM,SAAS,MAAM,UAAU;AAC/B,cAAM,SAAS,MAAM,UAAU;AAAA,MAChC;AAAA,MACA,MAAM,CAAC,UAAU;AAChB,cAAM,WAAW,MAAM,SAAS,IAAI,CAAC,aAAkB;AAAA,UACtD,GAAG;AAAA;AAAA,UAEH,QAAQ,MAAM,QAAQ,QAAQ,MAAM,IACjC,QAAQ,SACR,QAAQ,aAAa,QAAQ,MAAM;AAAA,QACvC,EAAE;AACF,eAAO,MAAM;AACb,eAAO,MAAM;AAAA,MACd;AAAA,IACD;AAAA,EACD;AACD,CAAC;",
   "names": []
 }

package/dist-esm/shapes/TLNoteShape.mjs

@@ -35,7 +35,8 @@ const Versions = createShapePropsMigrationIds("note", {
   AddFontSizeAdjustment: 6,
   AddScale: 7,
   AddLabelColor: 8,
-  AddRichText: 9
+  AddRichText: 9,
+  AddRichTextAttrs: 10
 });
 const noteShapeMigrations = createShapePropsMigrationSequence({
   sequence: [
@@ -126,6 +127,16 @@ const noteShapeMigrations = createShapePropsMigrationSequence({
       // down: (props) => {
       // 	delete props.richText
       // },
+    },
+    {
+      id: Versions.AddRichTextAttrs,
+      up: (_props) => {
+      },
+      down: (props) => {
+        if (props.richText && "attrs" in props.richText) {
+          delete props.richText.attrs;
+        }
+      }
     }
   ]
 });

package/dist-esm/shapes/TLNoteShape.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/shapes/TLNoteShape.ts"],
-  "sourcesContent": ["import { T } from '@tldraw/validate'\nimport { TLRichText, richTextValidator, toRichText } from '../misc/TLRichText'\nimport { createShapePropsMigrationIds, createShapePropsMigrationSequence } from '../records/TLShape'\nimport { RecordProps } from '../recordsWithProps'\nimport {\n\tDefaultColorStyle,\n\tDefaultLabelColorStyle,\n\tTLDefaultColorStyle,\n} from '../styles/TLColorStyle'\nimport { DefaultFontStyle, TLDefaultFontStyle } from '../styles/TLFontStyle'\nimport {\n\tDefaultHorizontalAlignStyle,\n\tTLDefaultHorizontalAlignStyle,\n} from '../styles/TLHorizontalAlignStyle'\nimport { DefaultSizeStyle, TLDefaultSizeStyle } from '../styles/TLSizeStyle'\nimport {\n\tDefaultVerticalAlignStyle,\n\tTLDefaultVerticalAlignStyle,\n} from '../styles/TLVerticalAlignStyle'\nimport { TLBaseShape } from './TLBaseShape'\n\n/**\n * Properties for a note shape. Note shapes represent sticky notes or text annotations\n * with rich formatting capabilities and various styling options.\n *\n * @public\n * @example\n * ```ts\n * const noteProps: TLNoteShapeProps = {\n *   color: 'yellow',\n *   labelColor: 'black',\n *   size: 'm',\n *   font: 'draw',\n *   fontSizeAdjustment: 0,\n *   align: 'middle',\n *   verticalAlign: 'middle',\n *   growY: 0,\n *   url: '',\n *   richText: toRichText('Hello **world**!'),\n *   scale: 1\n * }\n * ```\n */\nexport interface TLNoteShapeProps {\n\t/** Background color style of the note */\n\tcolor: TLDefaultColorStyle\n\t/** Text color style for the note content */\n\tlabelColor: TLDefaultColorStyle\n\t/** Size style determining the font size and note dimensions */\n\tsize: TLDefaultSizeStyle\n\t/** Font family style for the note text */\n\tfont: TLDefaultFontStyle\n\t/** Adjustment to the base font size (positive increases, negative decreases) */\n\tfontSizeAdjustment: number\n\t/** Horizontal alignment of text within the note */\n\talign: TLDefaultHorizontalAlignStyle\n\t/** Vertical alignment of text within the note */\n\tverticalAlign: TLDefaultVerticalAlignStyle\n\t/** Additional height growth for the note beyond its base size */\n\tgrowY: number\n\t/** Optional URL associated with the note for linking */\n\turl: string\n\t/** Rich text content with formatting like bold, italic, etc. */\n\trichText: TLRichText\n\t/** Scale factor applied to the note shape for display */\n\tscale: number\n}\n\n/**\n * A note shape representing a sticky note or text annotation on the canvas.\n * Note shapes support rich text formatting, various styling options, and can\n * be used for annotations, reminders, or general text content.\n *\n * @public\n * @example\n * ```ts\n * const noteShape: TLNoteShape = {\n *   id: 'shape:note1',\n *   type: 'note',\n *   x: 100,\n *   y: 100,\n *   rotation: 0,\n *   index: 'a1',\n *   parentId: 'page:main',\n *   isLocked: false,\n *   opacity: 1,\n *   props: {\n *     color: 'light-blue',\n *     labelColor: 'black',\n *     size: 's',\n *     font: 'sans',\n *     fontSizeAdjustment: 2,\n *     align: 'start',\n *     verticalAlign: 'start',\n *     growY: 50,\n *     url: 'https://example.com',\n *     richText: toRichText('Important **note**!'),\n *     scale: 1\n *   },\n *   meta: {},\n *   typeName: 'shape'\n * }\n * ```\n */\nexport type TLNoteShape = TLBaseShape<'note', TLNoteShapeProps>\n\n/**\n * Validation schema for note shape properties. Defines the runtime validation rules\n * for all properties of note shapes, ensuring data integrity and type safety.\n *\n * @public\n * @example\n * ```ts\n * import { noteShapeProps } from '@tldraw/tlschema'\n *\n * // Used internally by the validation system\n * const validator = T.object(noteShapeProps)\n * const validatedProps = validator.validate(someNoteProps)\n * ```\n */\nexport const noteShapeProps: RecordProps<TLNoteShape> = {\n\tcolor: DefaultColorStyle,\n\tlabelColor: DefaultLabelColorStyle,\n\tsize: DefaultSizeStyle,\n\tfont: DefaultFontStyle,\n\tfontSizeAdjustment: T.positiveNumber,\n\talign: DefaultHorizontalAlignStyle,\n\tverticalAlign: DefaultVerticalAlignStyle,\n\tgrowY: T.positiveNumber,\n\turl: T.linkUrl,\n\trichText: richTextValidator,\n\tscale: T.nonZeroNumber,\n}\n\nconst Versions = createShapePropsMigrationIds('note', {\n\tAddUrlProp: 1,\n\tRemoveJustify: 2,\n\tMigrateLegacyAlign: 3,\n\tAddVerticalAlign: 4,\n\tMakeUrlsValid: 5,\n\tAddFontSizeAdjustment: 6,\n\tAddScale: 7,\n\tAddLabelColor: 8,\n\tAddRichText: 9,\n})\n\n/**\n * Version identifiers for note shape migrations. These version numbers track\n * significant schema changes over time, enabling proper data migration between versions.\n *\n * @public\n */\nexport { Versions as noteShapeVersions }\n\n/**\n * Migration sequence for note shapes. Handles schema evolution over time by defining\n * how to upgrade and downgrade note shape data between different versions. Includes\n * migrations for URL properties, text alignment changes, vertical alignment addition,\n * font size adjustments, scaling support, label color, and the transition from plain text to rich text.\n *\n * @public\n */\nexport const noteShapeMigrations = createShapePropsMigrationSequence({\n\tsequence: [\n\t\t{\n\t\t\tid: Versions.AddUrlProp,\n\t\t\tup: (props) => {\n\t\t\t\tprops.url = ''\n\t\t\t},\n\t\t\tdown: 'retired',\n\t\t},\n\t\t{\n\t\t\tid: Versions.RemoveJustify,\n\t\t\tup: (props) => {\n\t\t\t\tif (props.align === 'justify') {\n\t\t\t\t\tprops.align = 'start'\n\t\t\t\t}\n\t\t\t},\n\t\t\tdown: 'retired',\n\t\t},\n\t\t{\n\t\t\tid: Versions.MigrateLegacyAlign,\n\t\t\tup: (props) => {\n\t\t\t\tswitch (props.align) {\n\t\t\t\t\tcase 'start':\n\t\t\t\t\t\tprops.align = 'start-legacy'\n\t\t\t\t\t\treturn\n\t\t\t\t\tcase 'end':\n\t\t\t\t\t\tprops.align = 'end-legacy'\n\t\t\t\t\t\treturn\n\t\t\t\t\tdefault:\n\t\t\t\t\t\tprops.align = 'middle-legacy'\n\t\t\t\t\t\treturn\n\t\t\t\t}\n\t\t\t},\n\t\t\tdown: 'retired',\n\t\t},\n\t\t{\n\t\t\tid: Versions.AddVerticalAlign,\n\t\t\tup: (props) => {\n\t\t\t\tprops.verticalAlign = 'middle'\n\t\t\t},\n\t\t\tdown: 'retired',\n\t\t},\n\t\t{\n\t\t\tid: Versions.MakeUrlsValid,\n\t\t\tup: (props) => {\n\t\t\t\tif (!T.linkUrl.isValid(props.url)) {\n\t\t\t\t\tprops.url = ''\n\t\t\t\t}\n\t\t\t},\n\t\t\tdown: (_props) => {\n\t\t\t\t// noop\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\tid: Versions.AddFontSizeAdjustment,\n\t\t\tup: (props) => {\n\t\t\t\tprops.fontSizeAdjustment = 0\n\t\t\t},\n\t\t\tdown: (props) => {\n\t\t\t\tdelete props.fontSizeAdjustment\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\tid: Versions.AddScale,\n\t\t\tup: (props) => {\n\t\t\t\tprops.scale = 1\n\t\t\t},\n\t\t\tdown: (props) => {\n\t\t\t\tdelete props.scale\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\tid: Versions.AddLabelColor,\n\t\t\tup: (props) => {\n\t\t\t\tprops.labelColor = 'black'\n\t\t\t},\n\t\t\tdown: (props) => {\n\t\t\t\tdelete props.labelColor\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\tid: Versions.AddRichText,\n\t\t\tup: (props) => {\n\t\t\t\tprops.richText = toRichText(props.text)\n\t\t\t\tdelete props.text\n\t\t\t},\n\t\t\t// N.B. Explicitly no down state so that we force clients to update.\n\t\t\t// down: (props) => {\n\t\t\t// \tdelete props.richText\n\t\t\t// },\n\t\t},\n\t],\n})\n"],
-  "mappings": "AAAA,SAAS,SAAS;AAClB,SAAqB,mBAAmB,kBAAkB;AAC1D,SAAS,8BAA8B,yCAAyC;AAEhF;AAAA,EACC;AAAA,EACA;AAAA,OAEM;AACP,SAAS,wBAA4C;AACrD;AAAA,EACC;AAAA,OAEM;AACP,SAAS,wBAA4C;AACrD;AAAA,EACC;AAAA,OAEM;AAsGA,MAAM,iBAA2C;AAAA,EACvD,OAAO;AAAA,EACP,YAAY;AAAA,EACZ,MAAM;AAAA,EACN,MAAM;AAAA,EACN,oBAAoB,EAAE;AAAA,EACtB,OAAO;AAAA,EACP,eAAe;AAAA,EACf,OAAO,EAAE;AAAA,EACT,KAAK,EAAE;AAAA,EACP,UAAU;AAAA,EACV,OAAO,EAAE;AACV;AAEA,MAAM,WAAW,6BAA6B,QAAQ;AAAA,EACrD,YAAY;AAAA,EACZ,eAAe;AAAA,EACf,oBAAoB;AAAA,EACpB,kBAAkB;AAAA,EAClB,eAAe;AAAA,EACf,uBAAuB;AAAA,EACvB,UAAU;AAAA,EACV,eAAe;AAAA,EACf,aAAa;AACd,CAAC;AAkBM,MAAM,sBAAsB,kCAAkC;AAAA,EACpE,UAAU;AAAA,IACT;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,UAAU;AACd,cAAM,MAAM;AAAA,MACb;AAAA,MACA,MAAM;AAAA,IACP;AAAA,IACA;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,UAAU;AACd,YAAI,MAAM,UAAU,WAAW;AAC9B,gBAAM,QAAQ;AAAA,QACf;AAAA,MACD;AAAA,MACA,MAAM;AAAA,IACP;AAAA,IACA;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,UAAU;AACd,gBAAQ,MAAM,OAAO;AAAA,UACpB,KAAK;AACJ,kBAAM,QAAQ;AACd;AAAA,UACD,KAAK;AACJ,kBAAM,QAAQ;AACd;AAAA,UACD;AACC,kBAAM,QAAQ;AACd;AAAA,QACF;AAAA,MACD;AAAA,MACA,MAAM;AAAA,IACP;AAAA,IACA;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,UAAU;AACd,cAAM,gBAAgB;AAAA,MACvB;AAAA,MACA,MAAM;AAAA,IACP;AAAA,IACA;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,UAAU;AACd,YAAI,CAAC,EAAE,QAAQ,QAAQ,MAAM,GAAG,GAAG;AAClC,gBAAM,MAAM;AAAA,QACb;AAAA,MACD;AAAA,MACA,MAAM,CAAC,WAAW;AAAA,MAElB;AAAA,IACD;AAAA,IACA;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,UAAU;AACd,cAAM,qBAAqB;AAAA,MAC5B;AAAA,MACA,MAAM,CAAC,UAAU;AAChB,eAAO,MAAM;AAAA,MACd;AAAA,IACD;AAAA,IACA;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,UAAU;AACd,cAAM,QAAQ;AAAA,MACf;AAAA,MACA,MAAM,CAAC,UAAU;AAChB,eAAO,MAAM;AAAA,MACd;AAAA,IACD;AAAA,IACA;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,UAAU;AACd,cAAM,aAAa;AAAA,MACpB;AAAA,MACA,MAAM,CAAC,UAAU;AAChB,eAAO,MAAM;AAAA,MACd;AAAA,IACD;AAAA,IACA;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,UAAU;AACd,cAAM,WAAW,WAAW,MAAM,IAAI;AACtC,eAAO,MAAM;AAAA,MACd;AAAA;AAAA;AAAA;AAAA;AAAA,IAKD;AAAA,EACD;AACD,CAAC;",
+  "sourcesContent": ["import { T } from '@tldraw/validate'\nimport { TLRichText, richTextValidator, toRichText } from '../misc/TLRichText'\nimport { createShapePropsMigrationIds, createShapePropsMigrationSequence } from '../records/TLShape'\nimport { RecordProps } from '../recordsWithProps'\nimport {\n\tDefaultColorStyle,\n\tDefaultLabelColorStyle,\n\tTLDefaultColorStyle,\n} from '../styles/TLColorStyle'\nimport { DefaultFontStyle, TLDefaultFontStyle } from '../styles/TLFontStyle'\nimport {\n\tDefaultHorizontalAlignStyle,\n\tTLDefaultHorizontalAlignStyle,\n} from '../styles/TLHorizontalAlignStyle'\nimport { DefaultSizeStyle, TLDefaultSizeStyle } from '../styles/TLSizeStyle'\nimport {\n\tDefaultVerticalAlignStyle,\n\tTLDefaultVerticalAlignStyle,\n} from '../styles/TLVerticalAlignStyle'\nimport { TLBaseShape } from './TLBaseShape'\n\n/**\n * Properties for a note shape. Note shapes represent sticky notes or text annotations\n * with rich formatting capabilities and various styling options.\n *\n * @public\n * @example\n * ```ts\n * const noteProps: TLNoteShapeProps = {\n *   color: 'yellow',\n *   labelColor: 'black',\n *   size: 'm',\n *   font: 'draw',\n *   fontSizeAdjustment: 0,\n *   align: 'middle',\n *   verticalAlign: 'middle',\n *   growY: 0,\n *   url: '',\n *   richText: toRichText('Hello **world**!'),\n *   scale: 1\n * }\n * ```\n */\nexport interface TLNoteShapeProps {\n\t/** Background color style of the note */\n\tcolor: TLDefaultColorStyle\n\t/** Text color style for the note content */\n\tlabelColor: TLDefaultColorStyle\n\t/** Size style determining the font size and note dimensions */\n\tsize: TLDefaultSizeStyle\n\t/** Font family style for the note text */\n\tfont: TLDefaultFontStyle\n\t/** Adjustment to the base font size (positive increases, negative decreases) */\n\tfontSizeAdjustment: number\n\t/** Horizontal alignment of text within the note */\n\talign: TLDefaultHorizontalAlignStyle\n\t/** Vertical alignment of text within the note */\n\tverticalAlign: TLDefaultVerticalAlignStyle\n\t/** Additional height growth for the note beyond its base size */\n\tgrowY: number\n\t/** Optional URL associated with the note for linking */\n\turl: string\n\t/** Rich text content with formatting like bold, italic, etc. */\n\trichText: TLRichText\n\t/** Scale factor applied to the note shape for display */\n\tscale: number\n}\n\n/**\n * A note shape representing a sticky note or text annotation on the canvas.\n * Note shapes support rich text formatting, various styling options, and can\n * be used for annotations, reminders, or general text content.\n *\n * @public\n * @example\n * ```ts\n * const noteShape: TLNoteShape = {\n *   id: 'shape:note1',\n *   type: 'note',\n *   x: 100,\n *   y: 100,\n *   rotation: 0,\n *   index: 'a1',\n *   parentId: 'page:main',\n *   isLocked: false,\n *   opacity: 1,\n *   props: {\n *     color: 'light-blue',\n *     labelColor: 'black',\n *     size: 's',\n *     font: 'sans',\n *     fontSizeAdjustment: 2,\n *     align: 'start',\n *     verticalAlign: 'start',\n *     growY: 50,\n *     url: 'https://example.com',\n *     richText: toRichText('Important **note**!'),\n *     scale: 1\n *   },\n *   meta: {},\n *   typeName: 'shape'\n * }\n * ```\n */\nexport type TLNoteShape = TLBaseShape<'note', TLNoteShapeProps>\n\n/**\n * Validation schema for note shape properties. Defines the runtime validation rules\n * for all properties of note shapes, ensuring data integrity and type safety.\n *\n * @public\n * @example\n * ```ts\n * import { noteShapeProps } from '@tldraw/tlschema'\n *\n * // Used internally by the validation system\n * const validator = T.object(noteShapeProps)\n * const validatedProps = validator.validate(someNoteProps)\n * ```\n */\nexport const noteShapeProps: RecordProps<TLNoteShape> = {\n\tcolor: DefaultColorStyle,\n\tlabelColor: DefaultLabelColorStyle,\n\tsize: DefaultSizeStyle,\n\tfont: DefaultFontStyle,\n\tfontSizeAdjustment: T.positiveNumber,\n\talign: DefaultHorizontalAlignStyle,\n\tverticalAlign: DefaultVerticalAlignStyle,\n\tgrowY: T.positiveNumber,\n\turl: T.linkUrl,\n\trichText: richTextValidator,\n\tscale: T.nonZeroNumber,\n}\n\nconst Versions = createShapePropsMigrationIds('note', {\n\tAddUrlProp: 1,\n\tRemoveJustify: 2,\n\tMigrateLegacyAlign: 3,\n\tAddVerticalAlign: 4,\n\tMakeUrlsValid: 5,\n\tAddFontSizeAdjustment: 6,\n\tAddScale: 7,\n\tAddLabelColor: 8,\n\tAddRichText: 9,\n\tAddRichTextAttrs: 10,\n})\n\n/**\n * Version identifiers for note shape migrations. These version numbers track\n * significant schema changes over time, enabling proper data migration between versions.\n *\n * @public\n */\nexport { Versions as noteShapeVersions }\n\n/**\n * Migration sequence for note shapes. Handles schema evolution over time by defining\n * how to upgrade and downgrade note shape data between different versions. Includes\n * migrations for URL properties, text alignment changes, vertical alignment addition,\n * font size adjustments, scaling support, label color, the transition from plain text to rich text,\n * and support for attrs property on richText.\n *\n * @public\n */\nexport const noteShapeMigrations = createShapePropsMigrationSequence({\n\tsequence: [\n\t\t{\n\t\t\tid: Versions.AddUrlProp,\n\t\t\tup: (props) => {\n\t\t\t\tprops.url = ''\n\t\t\t},\n\t\t\tdown: 'retired',\n\t\t},\n\t\t{\n\t\t\tid: Versions.RemoveJustify,\n\t\t\tup: (props) => {\n\t\t\t\tif (props.align === 'justify') {\n\t\t\t\t\tprops.align = 'start'\n\t\t\t\t}\n\t\t\t},\n\t\t\tdown: 'retired',\n\t\t},\n\t\t{\n\t\t\tid: Versions.MigrateLegacyAlign,\n\t\t\tup: (props) => {\n\t\t\t\tswitch (props.align) {\n\t\t\t\t\tcase 'start':\n\t\t\t\t\t\tprops.align = 'start-legacy'\n\t\t\t\t\t\treturn\n\t\t\t\t\tcase 'end':\n\t\t\t\t\t\tprops.align = 'end-legacy'\n\t\t\t\t\t\treturn\n\t\t\t\t\tdefault:\n\t\t\t\t\t\tprops.align = 'middle-legacy'\n\t\t\t\t\t\treturn\n\t\t\t\t}\n\t\t\t},\n\t\t\tdown: 'retired',\n\t\t},\n\t\t{\n\t\t\tid: Versions.AddVerticalAlign,\n\t\t\tup: (props) => {\n\t\t\t\tprops.verticalAlign = 'middle'\n\t\t\t},\n\t\t\tdown: 'retired',\n\t\t},\n\t\t{\n\t\t\tid: Versions.MakeUrlsValid,\n\t\t\tup: (props) => {\n\t\t\t\tif (!T.linkUrl.isValid(props.url)) {\n\t\t\t\t\tprops.url = ''\n\t\t\t\t}\n\t\t\t},\n\t\t\tdown: (_props) => {\n\t\t\t\t// noop\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\tid: Versions.AddFontSizeAdjustment,\n\t\t\tup: (props) => {\n\t\t\t\tprops.fontSizeAdjustment = 0\n\t\t\t},\n\t\t\tdown: (props) => {\n\t\t\t\tdelete props.fontSizeAdjustment\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\tid: Versions.AddScale,\n\t\t\tup: (props) => {\n\t\t\t\tprops.scale = 1\n\t\t\t},\n\t\t\tdown: (props) => {\n\t\t\t\tdelete props.scale\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\tid: Versions.AddLabelColor,\n\t\t\tup: (props) => {\n\t\t\t\tprops.labelColor = 'black'\n\t\t\t},\n\t\t\tdown: (props) => {\n\t\t\t\tdelete props.labelColor\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\tid: Versions.AddRichText,\n\t\t\tup: (props) => {\n\t\t\t\tprops.richText = toRichText(props.text)\n\t\t\t\tdelete props.text\n\t\t\t},\n\t\t\t// N.B. Explicitly no down state so that we force clients to update.\n\t\t\t// down: (props) => {\n\t\t\t// \tdelete props.richText\n\t\t\t// },\n\t\t},\n\t\t{\n\t\t\tid: Versions.AddRichTextAttrs,\n\t\t\tup: (_props) => {\n\t\t\t\t// noop - attrs is optional so old records are valid\n\t\t\t},\n\t\t\tdown: (props) => {\n\t\t\t\t// Remove attrs from richText when migrating down\n\t\t\t\tif (props.richText && 'attrs' in props.richText) {\n\t\t\t\t\tdelete props.richText.attrs\n\t\t\t\t}\n\t\t\t},\n\t\t},\n\t],\n})\n"],
+  "mappings": "AAAA,SAAS,SAAS;AAClB,SAAqB,mBAAmB,kBAAkB;AAC1D,SAAS,8BAA8B,yCAAyC;AAEhF;AAAA,EACC;AAAA,EACA;AAAA,OAEM;AACP,SAAS,wBAA4C;AACrD;AAAA,EACC;AAAA,OAEM;AACP,SAAS,wBAA4C;AACrD;AAAA,EACC;AAAA,OAEM;AAsGA,MAAM,iBAA2C;AAAA,EACvD,OAAO;AAAA,EACP,YAAY;AAAA,EACZ,MAAM;AAAA,EACN,MAAM;AAAA,EACN,oBAAoB,EAAE;AAAA,EACtB,OAAO;AAAA,EACP,eAAe;AAAA,EACf,OAAO,EAAE;AAAA,EACT,KAAK,EAAE;AAAA,EACP,UAAU;AAAA,EACV,OAAO,EAAE;AACV;AAEA,MAAM,WAAW,6BAA6B,QAAQ;AAAA,EACrD,YAAY;AAAA,EACZ,eAAe;AAAA,EACf,oBAAoB;AAAA,EACpB,kBAAkB;AAAA,EAClB,eAAe;AAAA,EACf,uBAAuB;AAAA,EACvB,UAAU;AAAA,EACV,eAAe;AAAA,EACf,aAAa;AAAA,EACb,kBAAkB;AACnB,CAAC;AAmBM,MAAM,sBAAsB,kCAAkC;AAAA,EACpE,UAAU;AAAA,IACT;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,UAAU;AACd,cAAM,MAAM;AAAA,MACb;AAAA,MACA,MAAM;AAAA,IACP;AAAA,IACA;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,UAAU;AACd,YAAI,MAAM,UAAU,WAAW;AAC9B,gBAAM,QAAQ;AAAA,QACf;AAAA,MACD;AAAA,MACA,MAAM;AAAA,IACP;AAAA,IACA;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,UAAU;AACd,gBAAQ,MAAM,OAAO;AAAA,UACpB,KAAK;AACJ,kBAAM,QAAQ;AACd;AAAA,UACD,KAAK;AACJ,kBAAM,QAAQ;AACd;AAAA,UACD;AACC,kBAAM,QAAQ;AACd;AAAA,QACF;AAAA,MACD;AAAA,MACA,MAAM;AAAA,IACP;AAAA,IACA;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,UAAU;AACd,cAAM,gBAAgB;AAAA,MACvB;AAAA,MACA,MAAM;AAAA,IACP;AAAA,IACA;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,UAAU;AACd,YAAI,CAAC,EAAE,QAAQ,QAAQ,MAAM,GAAG,GAAG;AAClC,gBAAM,MAAM;AAAA,QACb;AAAA,MACD;AAAA,MACA,MAAM,CAAC,WAAW;AAAA,MAElB;AAAA,IACD;AAAA,IACA;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,UAAU;AACd,cAAM,qBAAqB;AAAA,MAC5B;AAAA,MACA,MAAM,CAAC,UAAU;AAChB,eAAO,MAAM;AAAA,MACd;AAAA,IACD;AAAA,IACA;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,UAAU;AACd,cAAM,QAAQ;AAAA,MACf;AAAA,MACA,MAAM,CAAC,UAAU;AAChB,eAAO,MAAM;AAAA,MACd;AAAA,IACD;AAAA,IACA;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,UAAU;AACd,cAAM,aAAa;AAAA,MACpB;AAAA,MACA,MAAM,CAAC,UAAU;AAChB,eAAO,MAAM;AAAA,MACd;AAAA,IACD;AAAA,IACA;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,UAAU;AACd,cAAM,WAAW,WAAW,MAAM,IAAI;AACtC,eAAO,MAAM;AAAA,MACd;AAAA;AAAA;AAAA;AAAA;AAAA,IAKD;AAAA,IACA;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,WAAW;AAAA,MAEhB;AAAA,MACA,MAAM,CAAC,UAAU;AAEhB,YAAI,MAAM,YAAY,WAAW,MAAM,UAAU;AAChD,iBAAO,MAAM,SAAS;AAAA,QACvB;AAAA,MACD;AAAA,IACD;AAAA,EACD;AACD,CAAC;",
   "names": []
 }

package/dist-esm/shapes/TLTextShape.mjs

@@ -18,7 +18,8 @@ const textShapeProps = {
 const Versions = createShapePropsMigrationIds("text", {
   RemoveJustify: 1,
   AddTextAlign: 2,
-  AddRichText: 3
+  AddRichText: 3,
+  AddRichTextAttrs: 4
 });
 const textShapeMigrations = createShapePropsMigrationSequence({
   sequence: [
@@ -52,6 +53,16 @@ const textShapeMigrations = createShapePropsMigrationSequence({
       // down: (props) => {
       // 	delete props.richText
       // },
+    },
+    {
+      id: Versions.AddRichTextAttrs,
+      up: (_props) => {
+      },
+      down: (props) => {
+        if (props.richText && "attrs" in props.richText) {
+          delete props.richText.attrs;
+        }
+      }
     }
   ]
 });

package/dist-esm/shapes/TLTextShape.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/shapes/TLTextShape.ts"],
-  "sourcesContent": ["import { T } from '@tldraw/validate'\nimport { TLRichText, richTextValidator, toRichText } from '../misc/TLRichText'\nimport { createShapePropsMigrationIds, createShapePropsMigrationSequence } from '../records/TLShape'\nimport { RecordProps } from '../recordsWithProps'\nimport { DefaultColorStyle, TLDefaultColorStyle } from '../styles/TLColorStyle'\nimport { DefaultFontStyle, TLDefaultFontStyle } from '../styles/TLFontStyle'\nimport { DefaultSizeStyle, TLDefaultSizeStyle } from '../styles/TLSizeStyle'\nimport { DefaultTextAlignStyle, TLDefaultTextAlignStyle } from '../styles/TLTextAlignStyle'\nimport { TLBaseShape } from './TLBaseShape'\n\n/**\n * Configuration interface defining properties for text shapes in tldraw.\n * Text shapes support rich formatting, styling, and automatic sizing.\n *\n * @public\n * @example\n * ```ts\n * const textProps: TLTextShapeProps = {\n *   color: 'black',\n *   size: 'm',\n *   font: 'draw',\n *   textAlign: 'start',\n *   w: 200,\n *   richText: toRichText('Hello **bold** text'),\n *   scale: 1,\n *   autoSize: true\n * }\n * ```\n */\nexport interface TLTextShapeProps {\n\tcolor: TLDefaultColorStyle\n\tsize: TLDefaultSizeStyle\n\tfont: TLDefaultFontStyle\n\ttextAlign: TLDefaultTextAlignStyle\n\tw: number\n\trichText: TLRichText\n\tscale: number\n\tautoSize: boolean\n}\n\n/**\n * A text shape that can display formatted text content with various styling options.\n * Text shapes support rich formatting, automatic sizing, and consistent styling through\n * the tldraw style system.\n *\n * @public\n * @example\n * ```ts\n * const textShape: TLTextShape = {\n *   id: 'shape:text123',\n *   typeName: 'shape',\n *   type: 'text',\n *   x: 100,\n *   y: 200,\n *   rotation: 0,\n *   index: 'a1',\n *   parentId: 'page:main',\n *   isLocked: false,\n *   opacity: 1,\n *   props: {\n *     color: 'black',\n *     size: 'm',\n *     font: 'draw',\n *     textAlign: 'start',\n *     w: 200,\n *     richText: toRichText('Sample text'),\n *     scale: 1,\n *     autoSize: false\n *   },\n *   meta: {}\n * }\n * ```\n */\nexport type TLTextShape = TLBaseShape<'text', TLTextShapeProps>\n\n/**\n * Validation schema for text shape properties. This defines the runtime validation\n * rules that ensure text shape data integrity when records are stored or transmitted.\n *\n * @public\n * @example\n * ```ts\n * import { textShapeProps } from '@tldraw/tlschema'\n *\n * // Validate text shape properties\n * const isValid = textShapeProps.richText.isValid(myRichText)\n * if (isValid) {\n *   // Properties are valid, safe to use\n * }\n * ```\n */\nexport const textShapeProps: RecordProps<TLTextShape> = {\n\tcolor: DefaultColorStyle,\n\tsize: DefaultSizeStyle,\n\tfont: DefaultFontStyle,\n\ttextAlign: DefaultTextAlignStyle,\n\tw: T.nonZeroNumber,\n\trichText: richTextValidator,\n\tscale: T.nonZeroNumber,\n\tautoSize: T.boolean,\n}\n\nconst Versions = createShapePropsMigrationIds('text', {\n\tRemoveJustify: 1,\n\tAddTextAlign: 2,\n\tAddRichText: 3,\n})\n\n/**\n * Version identifiers for text shape migrations. These constants track\n * the evolution of the text shape schema over time.\n *\n * @public\n * @example\n * ```ts\n * import { textShapeVersions } from '@tldraw/tlschema'\n *\n * // Check if shape data needs migration\n * if (shapeVersion < textShapeVersions.AddRichText) {\n *   // Apply rich text migration\n * }\n * ```\n */\nexport { Versions as textShapeVersions }\n\n/**\n * Migration sequence for text shape schema evolution. This handles transforming\n * text shape data between different versions as the schema evolves over time.\n *\n * Key migrations include:\n * - RemoveJustify: Replaced 'justify' alignment with 'start'\n * - AddTextAlign: Migrated from 'align' to 'textAlign' property\n * - AddRichText: Converted plain text to rich text format\n *\n * @public\n */\nexport const textShapeMigrations = createShapePropsMigrationSequence({\n\tsequence: [\n\t\t{\n\t\t\tid: Versions.RemoveJustify,\n\t\t\tup: (props) => {\n\t\t\t\tif (props.align === 'justify') {\n\t\t\t\t\tprops.align = 'start'\n\t\t\t\t}\n\t\t\t},\n\t\t\tdown: 'retired',\n\t\t},\n\t\t{\n\t\t\tid: Versions.AddTextAlign,\n\t\t\tup: (props) => {\n\t\t\t\tprops.textAlign = props.align\n\t\t\t\tdelete props.align\n\t\t\t},\n\t\t\tdown: (props) => {\n\t\t\t\tprops.align = props.textAlign\n\t\t\t\tdelete props.textAlign\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\tid: Versions.AddRichText,\n\t\t\tup: (props) => {\n\t\t\t\tprops.richText = toRichText(props.text)\n\t\t\t\tdelete props.text\n\t\t\t},\n\t\t\t// N.B. Explicitly no down state so that we force clients to update.\n\t\t\t// down: (props) => {\n\t\t\t// \tdelete props.richText\n\t\t\t// },\n\t\t},\n\t],\n})\n"],
-  "mappings": "AAAA,SAAS,SAAS;AAClB,SAAqB,mBAAmB,kBAAkB;AAC1D,SAAS,8BAA8B,yCAAyC;AAEhF,SAAS,yBAA8C;AACvD,SAAS,wBAA4C;AACrD,SAAS,wBAA4C;AACrD,SAAS,6BAAsD;AAoFxD,MAAM,iBAA2C;AAAA,EACvD,OAAO;AAAA,EACP,MAAM;AAAA,EACN,MAAM;AAAA,EACN,WAAW;AAAA,EACX,GAAG,EAAE;AAAA,EACL,UAAU;AAAA,EACV,OAAO,EAAE;AAAA,EACT,UAAU,EAAE;AACb;AAEA,MAAM,WAAW,6BAA6B,QAAQ;AAAA,EACrD,eAAe;AAAA,EACf,cAAc;AAAA,EACd,aAAa;AACd,CAAC;AA8BM,MAAM,sBAAsB,kCAAkC;AAAA,EACpE,UAAU;AAAA,IACT;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,UAAU;AACd,YAAI,MAAM,UAAU,WAAW;AAC9B,gBAAM,QAAQ;AAAA,QACf;AAAA,MACD;AAAA,MACA,MAAM;AAAA,IACP;AAAA,IACA;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,UAAU;AACd,cAAM,YAAY,MAAM;AACxB,eAAO,MAAM;AAAA,MACd;AAAA,MACA,MAAM,CAAC,UAAU;AAChB,cAAM,QAAQ,MAAM;AACpB,eAAO,MAAM;AAAA,MACd;AAAA,IACD;AAAA,IACA;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,UAAU;AACd,cAAM,WAAW,WAAW,MAAM,IAAI;AACtC,eAAO,MAAM;AAAA,MACd;AAAA;AAAA;AAAA;AAAA;AAAA,IAKD;AAAA,EACD;AACD,CAAC;",
+  "sourcesContent": ["import { T } from '@tldraw/validate'\nimport { TLRichText, richTextValidator, toRichText } from '../misc/TLRichText'\nimport { createShapePropsMigrationIds, createShapePropsMigrationSequence } from '../records/TLShape'\nimport { RecordProps } from '../recordsWithProps'\nimport { DefaultColorStyle, TLDefaultColorStyle } from '../styles/TLColorStyle'\nimport { DefaultFontStyle, TLDefaultFontStyle } from '../styles/TLFontStyle'\nimport { DefaultSizeStyle, TLDefaultSizeStyle } from '../styles/TLSizeStyle'\nimport { DefaultTextAlignStyle, TLDefaultTextAlignStyle } from '../styles/TLTextAlignStyle'\nimport { TLBaseShape } from './TLBaseShape'\n\n/**\n * Configuration interface defining properties for text shapes in tldraw.\n * Text shapes support rich formatting, styling, and automatic sizing.\n *\n * @public\n * @example\n * ```ts\n * const textProps: TLTextShapeProps = {\n *   color: 'black',\n *   size: 'm',\n *   font: 'draw',\n *   textAlign: 'start',\n *   w: 200,\n *   richText: toRichText('Hello **bold** text'),\n *   scale: 1,\n *   autoSize: true\n * }\n * ```\n */\nexport interface TLTextShapeProps {\n\tcolor: TLDefaultColorStyle\n\tsize: TLDefaultSizeStyle\n\tfont: TLDefaultFontStyle\n\ttextAlign: TLDefaultTextAlignStyle\n\tw: number\n\trichText: TLRichText\n\tscale: number\n\tautoSize: boolean\n}\n\n/**\n * A text shape that can display formatted text content with various styling options.\n * Text shapes support rich formatting, automatic sizing, and consistent styling through\n * the tldraw style system.\n *\n * @public\n * @example\n * ```ts\n * const textShape: TLTextShape = {\n *   id: 'shape:text123',\n *   typeName: 'shape',\n *   type: 'text',\n *   x: 100,\n *   y: 200,\n *   rotation: 0,\n *   index: 'a1',\n *   parentId: 'page:main',\n *   isLocked: false,\n *   opacity: 1,\n *   props: {\n *     color: 'black',\n *     size: 'm',\n *     font: 'draw',\n *     textAlign: 'start',\n *     w: 200,\n *     richText: toRichText('Sample text'),\n *     scale: 1,\n *     autoSize: false\n *   },\n *   meta: {}\n * }\n * ```\n */\nexport type TLTextShape = TLBaseShape<'text', TLTextShapeProps>\n\n/**\n * Validation schema for text shape properties. This defines the runtime validation\n * rules that ensure text shape data integrity when records are stored or transmitted.\n *\n * @public\n * @example\n * ```ts\n * import { textShapeProps } from '@tldraw/tlschema'\n *\n * // Validate text shape properties\n * const isValid = textShapeProps.richText.isValid(myRichText)\n * if (isValid) {\n *   // Properties are valid, safe to use\n * }\n * ```\n */\nexport const textShapeProps: RecordProps<TLTextShape> = {\n\tcolor: DefaultColorStyle,\n\tsize: DefaultSizeStyle,\n\tfont: DefaultFontStyle,\n\ttextAlign: DefaultTextAlignStyle,\n\tw: T.nonZeroNumber,\n\trichText: richTextValidator,\n\tscale: T.nonZeroNumber,\n\tautoSize: T.boolean,\n}\n\nconst Versions = createShapePropsMigrationIds('text', {\n\tRemoveJustify: 1,\n\tAddTextAlign: 2,\n\tAddRichText: 3,\n\tAddRichTextAttrs: 4,\n})\n\n/**\n * Version identifiers for text shape migrations. These constants track\n * the evolution of the text shape schema over time.\n *\n * @public\n * @example\n * ```ts\n * import { textShapeVersions } from '@tldraw/tlschema'\n *\n * // Check if shape data needs migration\n * if (shapeVersion < textShapeVersions.AddRichTextAttrs) {\n *   // Apply rich text attrs migration\n * }\n * ```\n */\nexport { Versions as textShapeVersions }\n\n/**\n * Migration sequence for text shape schema evolution. This handles transforming\n * text shape data between different versions as the schema evolves over time.\n *\n * Key migrations include:\n * - RemoveJustify: Replaced 'justify' alignment with 'start'\n * - AddTextAlign: Migrated from 'align' to 'textAlign' property\n * - AddRichText: Converted plain text to rich text format\n * - AddRichTextAttrs: Added support for attrs property on richText\n *\n * @public\n */\nexport const textShapeMigrations = createShapePropsMigrationSequence({\n\tsequence: [\n\t\t{\n\t\t\tid: Versions.RemoveJustify,\n\t\t\tup: (props) => {\n\t\t\t\tif (props.align === 'justify') {\n\t\t\t\t\tprops.align = 'start'\n\t\t\t\t}\n\t\t\t},\n\t\t\tdown: 'retired',\n\t\t},\n\t\t{\n\t\t\tid: Versions.AddTextAlign,\n\t\t\tup: (props) => {\n\t\t\t\tprops.textAlign = props.align\n\t\t\t\tdelete props.align\n\t\t\t},\n\t\t\tdown: (props) => {\n\t\t\t\tprops.align = props.textAlign\n\t\t\t\tdelete props.textAlign\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\tid: Versions.AddRichText,\n\t\t\tup: (props) => {\n\t\t\t\tprops.richText = toRichText(props.text)\n\t\t\t\tdelete props.text\n\t\t\t},\n\t\t\t// N.B. Explicitly no down state so that we force clients to update.\n\t\t\t// down: (props) => {\n\t\t\t// \tdelete props.richText\n\t\t\t// },\n\t\t},\n\t\t{\n\t\t\tid: Versions.AddRichTextAttrs,\n\t\t\tup: (_props) => {\n\t\t\t\t// noop - attrs is optional so old records are valid\n\t\t\t},\n\t\t\tdown: (props) => {\n\t\t\t\t// Remove attrs from richText when migrating down\n\t\t\t\tif (props.richText && 'attrs' in props.richText) {\n\t\t\t\t\tdelete props.richText.attrs\n\t\t\t\t}\n\t\t\t},\n\t\t},\n\t],\n})\n"],
+  "mappings": "AAAA,SAAS,SAAS;AAClB,SAAqB,mBAAmB,kBAAkB;AAC1D,SAAS,8BAA8B,yCAAyC;AAEhF,SAAS,yBAA8C;AACvD,SAAS,wBAA4C;AACrD,SAAS,wBAA4C;AACrD,SAAS,6BAAsD;AAoFxD,MAAM,iBAA2C;AAAA,EACvD,OAAO;AAAA,EACP,MAAM;AAAA,EACN,MAAM;AAAA,EACN,WAAW;AAAA,EACX,GAAG,EAAE;AAAA,EACL,UAAU;AAAA,EACV,OAAO,EAAE;AAAA,EACT,UAAU,EAAE;AACb;AAEA,MAAM,WAAW,6BAA6B,QAAQ;AAAA,EACrD,eAAe;AAAA,EACf,cAAc;AAAA,EACd,aAAa;AAAA,EACb,kBAAkB;AACnB,CAAC;AA+BM,MAAM,sBAAsB,kCAAkC;AAAA,EACpE,UAAU;AAAA,IACT;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,UAAU;AACd,YAAI,MAAM,UAAU,WAAW;AAC9B,gBAAM,QAAQ;AAAA,QACf;AAAA,MACD;AAAA,MACA,MAAM;AAAA,IACP;AAAA,IACA;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,UAAU;AACd,cAAM,YAAY,MAAM;AACxB,eAAO,MAAM;AAAA,MACd;AAAA,MACA,MAAM,CAAC,UAAU;AAChB,cAAM,QAAQ,MAAM;AACpB,eAAO,MAAM;AAAA,MACd;AAAA,IACD;AAAA,IACA;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,UAAU;AACd,cAAM,WAAW,WAAW,MAAM,IAAI;AACtC,eAAO,MAAM;AAAA,MACd;AAAA;AAAA;AAAA;AAAA;AAAA,IAKD;AAAA,IACA;AAAA,MACC,IAAI,SAAS;AAAA,MACb,IAAI,CAAC,WAAW;AAAA,MAEhB;AAAA,MACA,MAAM,CAAC,UAAU;AAEhB,YAAI,MAAM,YAAY,WAAW,MAAM,UAAU;AAChD,iBAAO,MAAM,SAAS;AAAA,QACvB;AAAA,MACD;AAAA,IACD;AAAA,EACD;AACD,CAAC;",
   "names": []
 }

package/dist-esm/store-migrations.mjs

@@ -13,29 +13,29 @@ const storeMigrations = createMigrationSequence({
   sequence: [
     {
       id: Versions.RemoveCodeAndIconShapeTypes,
-      scope: "store",
-      up: (store) => {
-        for (const [id, record] of objectMapEntries(store)) {
-          if (record.typeName === "shape" && (record.type === "icon" || record.type === "code")) {
-            delete store[id];
+      scope: "storage",
+      up: (storage) => {
+        for (const [id, record] of storage.entries()) {
+          if (record.typeName === "shape" && "type" in record && (record.type === "icon" || record.type === "code")) {
+            storage.delete(id);
           }
         }
       }
     },
     {
       id: Versions.AddInstancePresenceType,
-      scope: "store",
-      up(_store) {
+      scope: "storage",
+      up(_storage) {
       }
     },
     {
       // remove user and presence records and add pointer records
       id: Versions.RemoveTLUserAndPresenceAndAddPointer,
-      scope: "store",
-      up: (store) => {
-        for (const [id, record] of objectMapEntries(store)) {
+      scope: "storage",
+      up: (storage) => {
+        for (const [id, record] of storage.entries()) {
           if (record.typeName.match(/^(user|user_presence)$/)) {
-            delete store[id];
+            storage.delete(id);
           }
         }
       }
@@ -43,11 +43,11 @@ const storeMigrations = createMigrationSequence({
     {
       // remove user document records
       id: Versions.RemoveUserDocument,
-      scope: "store",
-      up: (store) => {
-        for (const [id, record] of objectMapEntries(store)) {
+      scope: "storage",
+      up: (storage) => {
+        for (const [id, record] of storage.entries()) {
           if (record.typeName.match("user_document")) {
-            delete store[id];
+            storage.delete(id);
           }
         }
       }

package/dist-esm/store-migrations.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../src/store-migrations.ts"],
-  "sourcesContent": ["import { createMigrationIds, createMigrationSequence } from '@tldraw/store'\nimport { IndexKey, objectMapEntries } from '@tldraw/utils'\nimport { TLPage } from './records/TLPage'\nimport { TLShape } from './records/TLShape'\nimport { TLLineShape } from './shapes/TLLineShape'\n\n/**\n * Migration version constants for store-level schema changes.\n * Each version represents a breaking change that requires data transformation.\n *\n * @internal\n */\nconst Versions = createMigrationIds('com.tldraw.store', {\n\tRemoveCodeAndIconShapeTypes: 1,\n\tAddInstancePresenceType: 2,\n\tRemoveTLUserAndPresenceAndAddPointer: 3,\n\tRemoveUserDocument: 4,\n\tFixIndexKeys: 5,\n} as const)\n\n/**\n * Migration version identifiers for store-level migrations.\n * These versions track changes to the overall store structure and data model.\n *\n * @example\n * ```ts\n * import { storeVersions } from '@tldraw/tlschema'\n *\n * // Check if a specific migration version exists\n * const hasRemoveCodeShapes = storeVersions.RemoveCodeAndIconShapeTypes\n * ```\n *\n * @public\n */\nexport { Versions as storeVersions }\n\n/**\n * Store-level migration sequence that handles evolution of the tldraw data model.\n * These migrations run when the store schema version changes and ensure backward\n * compatibility by transforming old data structures to new formats.\n *\n * The migrations handle:\n * - Removal of deprecated shape types (code, icon)\n * - Addition of new record types (instance presence)\n * - Cleanup of obsolete user and presence data\n * - Removal of deprecated user document records\n *\n * @example\n * ```ts\n * import { storeMigrations } from '@tldraw/tlschema'\n * import { migrate } from '@tldraw/store'\n *\n * // Apply store migrations to old data\n * const migratedStore = migrate({\n *   store: oldStoreData,\n *   migrations: storeMigrations,\n *   fromVersion: 0,\n *   toVersion: storeMigrations.currentVersion\n * })\n * ```\n *\n * @public\n */\nexport const storeMigrations = createMigrationSequence({\n\tsequenceId: 'com.tldraw.store',\n\tretroactive: false,\n\tsequence: [\n\t\t{\n\t\t\tid: Versions.RemoveCodeAndIconShapeTypes,\n\t\t\tscope: 'store',\n\t\t\tup: (store) => {\n\t\t\t\tfor (const [id, record] of objectMapEntries(store)) {\n\t\t\t\t\tif (\n\t\t\t\t\t\trecord.typeName === 'shape' &&\n\t\t\t\t\t\t((record as TLShape).type === 'icon' || (record as TLShape).type === 'code')\n\t\t\t\t\t) {\n\t\t\t\t\t\tdelete store[id]\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\tid: Versions.AddInstancePresenceType,\n\t\t\tscope: 'store',\n\t\t\tup(_store) {\n\t\t\t\t// noop\n\t\t\t\t// there used to be a down migration for this but we made down migrations optional\n\t\t\t\t// and we don't use them on store-level migrations so we can just remove it\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\t// remove user and presence records and add pointer records\n\t\t\tid: Versions.RemoveTLUserAndPresenceAndAddPointer,\n\t\t\tscope: 'store',\n\t\t\tup: (store) => {\n\t\t\t\tfor (const [id, record] of objectMapEntries(store)) {\n\t\t\t\t\tif (record.typeName.match(/^(user|user_presence)$/)) {\n\t\t\t\t\t\tdelete store[id]\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\t// remove user document records\n\t\t\tid: Versions.RemoveUserDocument,\n\t\t\tscope: 'store',\n\t\t\tup: (store) => {\n\t\t\t\tfor (const [id, record] of objectMapEntries(store)) {\n\t\t\t\t\tif (record.typeName.match('user_document')) {\n\t\t\t\t\t\tdelete store[id]\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\tid: Versions.FixIndexKeys,\n\t\t\tscope: 'record',\n\t\t\tup: (record) => {\n\t\t\t\tif (['shape', 'page'].includes(record.typeName) && 'index' in record) {\n\t\t\t\t\tconst recordWithIndex = record as TLShape | TLPage\n\t\t\t\t\t// Our newer fractional indexed library (more correctly) validates that indices\n\t\t\t\t\t// do not end with 0. ('a0' being an exception)\n\t\t\t\t\tif (recordWithIndex.index.endsWith('0') && recordWithIndex.index !== 'a0') {\n\t\t\t\t\t\trecordWithIndex.index = (recordWithIndex.index.slice(0, -1) +\n\t\t\t\t\t\t\tgetNRandomBase62Digits(3)) as IndexKey\n\t\t\t\t\t}\n\t\t\t\t\t// Line shapes have 'points' that have indices as well.\n\t\t\t\t\tif (record.typeName === 'shape' && (recordWithIndex as TLShape).type === 'line') {\n\t\t\t\t\t\tconst lineShape = recordWithIndex as TLLineShape\n\t\t\t\t\t\tfor (const [_, point] of objectMapEntries(lineShape.props.points)) {\n\t\t\t\t\t\t\tif (point.index.endsWith('0') && point.index !== 'a0') {\n\t\t\t\t\t\t\t\tpoint.index = (point.index.slice(0, -1) + getNRandomBase62Digits(3)) as IndexKey\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t},\n\t\t\tdown: () => {\n\t\t\t\t// noop\n\t\t\t\t// Enables tlsync to support older clients so as to not force people to refresh immediately after deploying.\n\t\t\t},\n\t\t},\n\t],\n})\n\nconst BASE_62_DIGITS_WITHOUT_ZERO = '123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz'\nconst getRandomBase62Digit = () => {\n\treturn BASE_62_DIGITS_WITHOUT_ZERO.charAt(\n\t\tMath.floor(Math.random() * BASE_62_DIGITS_WITHOUT_ZERO.length)\n\t)\n}\n\nconst getNRandomBase62Digits = (n: number) => {\n\treturn Array.from({ length: n }, getRandomBase62Digit).join('')\n}\n"],
-  "mappings": "AAAA,SAAS,oBAAoB,+BAA+B;AAC5D,SAAmB,wBAAwB;AAW3C,MAAM,WAAW,mBAAmB,oBAAoB;AAAA,EACvD,6BAA6B;AAAA,EAC7B,yBAAyB;AAAA,EACzB,sCAAsC;AAAA,EACtC,oBAAoB;AAAA,EACpB,cAAc;AACf,CAAU;AA6CH,MAAM,kBAAkB,wBAAwB;AAAA,EACtD,YAAY;AAAA,EACZ,aAAa;AAAA,EACb,UAAU;AAAA,IACT;AAAA,MACC,IAAI,SAAS;AAAA,MACb,OAAO;AAAA,MACP,IAAI,CAAC,UAAU;AACd,mBAAW,CAAC,IAAI,MAAM,KAAK,iBAAiB,KAAK,GAAG;AACnD,cACC,OAAO,aAAa,YAClB,OAAmB,SAAS,UAAW,OAAmB,SAAS,SACpE;AACD,mBAAO,MAAM,EAAE;AAAA,UAChB;AAAA,QACD;AAAA,MACD;AAAA,IACD;AAAA,IACA;AAAA,MACC,IAAI,SAAS;AAAA,MACb,OAAO;AAAA,MACP,GAAG,QAAQ;AAAA,MAIX;AAAA,IACD;AAAA,IACA;AAAA;AAAA,MAEC,IAAI,SAAS;AAAA,MACb,OAAO;AAAA,MACP,IAAI,CAAC,UAAU;AACd,mBAAW,CAAC,IAAI,MAAM,KAAK,iBAAiB,KAAK,GAAG;AACnD,cAAI,OAAO,SAAS,MAAM,wBAAwB,GAAG;AACpD,mBAAO,MAAM,EAAE;AAAA,UAChB;AAAA,QACD;AAAA,MACD;AAAA,IACD;AAAA,IACA;AAAA;AAAA,MAEC,IAAI,SAAS;AAAA,MACb,OAAO;AAAA,MACP,IAAI,CAAC,UAAU;AACd,mBAAW,CAAC,IAAI,MAAM,KAAK,iBAAiB,KAAK,GAAG;AACnD,cAAI,OAAO,SAAS,MAAM,eAAe,GAAG;AAC3C,mBAAO,MAAM,EAAE;AAAA,UAChB;AAAA,QACD;AAAA,MACD;AAAA,IACD;AAAA,IACA;AAAA,MACC,IAAI,SAAS;AAAA,MACb,OAAO;AAAA,MACP,IAAI,CAAC,WAAW;AACf,YAAI,CAAC,SAAS,MAAM,EAAE,SAAS,OAAO,QAAQ,KAAK,WAAW,QAAQ;AACrE,gBAAM,kBAAkB;AAGxB,cAAI,gBAAgB,MAAM,SAAS,GAAG,KAAK,gBAAgB,UAAU,MAAM;AAC1E,4BAAgB,QAAS,gBAAgB,MAAM,MAAM,GAAG,EAAE,IACzD,uBAAuB,CAAC;AAAA,UAC1B;AAEA,cAAI,OAAO,aAAa,WAAY,gBAA4B,SAAS,QAAQ;AAChF,kBAAM,YAAY;AAClB,uBAAW,CAAC,GAAG,KAAK,KAAK,iBAAiB,UAAU,MAAM,MAAM,GAAG;AAClE,kBAAI,MAAM,MAAM,SAAS,GAAG,KAAK,MAAM,UAAU,MAAM;AACtD,sBAAM,QAAS,MAAM,MAAM,MAAM,GAAG,EAAE,IAAI,uBAAuB,CAAC;AAAA,cACnE;AAAA,YACD;AAAA,UACD;AAAA,QACD;AAAA,MACD;AAAA,MACA,MAAM,MAAM;AAAA,MAGZ;AAAA,IACD;AAAA,EACD;AACD,CAAC;AAED,MAAM,8BAA8B;AACpC,MAAM,uBAAuB,MAAM;AAClC,SAAO,4BAA4B;AAAA,IAClC,KAAK,MAAM,KAAK,OAAO,IAAI,4BAA4B,MAAM;AAAA,EAC9D;AACD;AAEA,MAAM,yBAAyB,CAAC,MAAc;AAC7C,SAAO,MAAM,KAAK,EAAE,QAAQ,EAAE,GAAG,oBAAoB,EAAE,KAAK,EAAE;AAC/D;",
+  "sourcesContent": ["import { createMigrationIds, createMigrationSequence } from '@tldraw/store'\nimport { IndexKey, objectMapEntries } from '@tldraw/utils'\nimport { TLPage } from './records/TLPage'\nimport { TLShape } from './records/TLShape'\nimport { TLLineShape } from './shapes/TLLineShape'\n\n/**\n * Migration version constants for store-level schema changes.\n * Each version represents a breaking change that requires data transformation.\n *\n * @internal\n */\nconst Versions = createMigrationIds('com.tldraw.store', {\n\tRemoveCodeAndIconShapeTypes: 1,\n\tAddInstancePresenceType: 2,\n\tRemoveTLUserAndPresenceAndAddPointer: 3,\n\tRemoveUserDocument: 4,\n\tFixIndexKeys: 5,\n} as const)\n\n/**\n * Migration version identifiers for store-level migrations.\n * These versions track changes to the overall store structure and data model.\n *\n * @example\n * ```ts\n * import { storeVersions } from '@tldraw/tlschema'\n *\n * // Check if a specific migration version exists\n * const hasRemoveCodeShapes = storeVersions.RemoveCodeAndIconShapeTypes\n * ```\n *\n * @public\n */\nexport { Versions as storeVersions }\n\n/**\n * Store-level migration sequence that handles evolution of the tldraw data model.\n * These migrations run when the store schema version changes and ensure backward\n * compatibility by transforming old data structures to new formats.\n *\n * The migrations handle:\n * - Removal of deprecated shape types (code, icon)\n * - Addition of new record types (instance presence)\n * - Cleanup of obsolete user and presence data\n * - Removal of deprecated user document records\n *\n * @example\n * ```ts\n * import { storeMigrations } from '@tldraw/tlschema'\n * import { migrate } from '@tldraw/store'\n *\n * // Apply store migrations to old data\n * const migratedStore = migrate({\n *   store: oldStoreData,\n *   migrations: storeMigrations,\n *   fromVersion: 0,\n *   toVersion: storeMigrations.currentVersion\n * })\n * ```\n *\n * @public\n */\nexport const storeMigrations = createMigrationSequence({\n\tsequenceId: 'com.tldraw.store',\n\tretroactive: false,\n\tsequence: [\n\t\t{\n\t\t\tid: Versions.RemoveCodeAndIconShapeTypes,\n\t\t\tscope: 'storage',\n\t\t\tup: (storage) => {\n\t\t\t\tfor (const [id, record] of storage.entries()) {\n\t\t\t\t\tif (\n\t\t\t\t\t\trecord.typeName === 'shape' &&\n\t\t\t\t\t\t'type' in record &&\n\t\t\t\t\t\t(record.type === 'icon' || record.type === 'code')\n\t\t\t\t\t) {\n\t\t\t\t\t\tstorage.delete(id)\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\tid: Versions.AddInstancePresenceType,\n\t\t\tscope: 'storage',\n\t\t\tup(_storage) {\n\t\t\t\t// noop\n\t\t\t\t// there used to be a down migration for this but we made down migrations optional\n\t\t\t\t// and we don't use them on storage-level migrations so we can just remove it\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\t// remove user and presence records and add pointer records\n\t\t\tid: Versions.RemoveTLUserAndPresenceAndAddPointer,\n\t\t\tscope: 'storage',\n\t\t\tup: (storage) => {\n\t\t\t\tfor (const [id, record] of storage.entries()) {\n\t\t\t\t\tif (record.typeName.match(/^(user|user_presence)$/)) {\n\t\t\t\t\t\tstorage.delete(id)\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\t// remove user document records\n\t\t\tid: Versions.RemoveUserDocument,\n\t\t\tscope: 'storage',\n\t\t\tup: (storage) => {\n\t\t\t\tfor (const [id, record] of storage.entries()) {\n\t\t\t\t\tif (record.typeName.match('user_document')) {\n\t\t\t\t\t\tstorage.delete(id)\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\tid: Versions.FixIndexKeys,\n\t\t\tscope: 'record',\n\t\t\tup: (record) => {\n\t\t\t\tif (['shape', 'page'].includes(record.typeName) && 'index' in record) {\n\t\t\t\t\tconst recordWithIndex = record as TLShape | TLPage\n\t\t\t\t\t// Our newer fractional indexed library (more correctly) validates that indices\n\t\t\t\t\t// do not end with 0. ('a0' being an exception)\n\t\t\t\t\tif (recordWithIndex.index.endsWith('0') && recordWithIndex.index !== 'a0') {\n\t\t\t\t\t\trecordWithIndex.index = (recordWithIndex.index.slice(0, -1) +\n\t\t\t\t\t\t\tgetNRandomBase62Digits(3)) as IndexKey\n\t\t\t\t\t}\n\t\t\t\t\t// Line shapes have 'points' that have indices as well.\n\t\t\t\t\tif (record.typeName === 'shape' && (recordWithIndex as TLShape).type === 'line') {\n\t\t\t\t\t\tconst lineShape = recordWithIndex as TLLineShape\n\t\t\t\t\t\tfor (const [_, point] of objectMapEntries(lineShape.props.points)) {\n\t\t\t\t\t\t\tif (point.index.endsWith('0') && point.index !== 'a0') {\n\t\t\t\t\t\t\t\tpoint.index = (point.index.slice(0, -1) + getNRandomBase62Digits(3)) as IndexKey\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t},\n\t\t\tdown: () => {\n\t\t\t\t// noop\n\t\t\t\t// Enables tlsync to support older clients so as to not force people to refresh immediately after deploying.\n\t\t\t},\n\t\t},\n\t],\n})\n\nconst BASE_62_DIGITS_WITHOUT_ZERO = '123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz'\nconst getRandomBase62Digit = () => {\n\treturn BASE_62_DIGITS_WITHOUT_ZERO.charAt(\n\t\tMath.floor(Math.random() * BASE_62_DIGITS_WITHOUT_ZERO.length)\n\t)\n}\n\nconst getNRandomBase62Digits = (n: number) => {\n\treturn Array.from({ length: n }, getRandomBase62Digit).join('')\n}\n"],
+  "mappings": "AAAA,SAAS,oBAAoB,+BAA+B;AAC5D,SAAmB,wBAAwB;AAW3C,MAAM,WAAW,mBAAmB,oBAAoB;AAAA,EACvD,6BAA6B;AAAA,EAC7B,yBAAyB;AAAA,EACzB,sCAAsC;AAAA,EACtC,oBAAoB;AAAA,EACpB,cAAc;AACf,CAAU;AA6CH,MAAM,kBAAkB,wBAAwB;AAAA,EACtD,YAAY;AAAA,EACZ,aAAa;AAAA,EACb,UAAU;AAAA,IACT;AAAA,MACC,IAAI,SAAS;AAAA,MACb,OAAO;AAAA,MACP,IAAI,CAAC,YAAY;AAChB,mBAAW,CAAC,IAAI,MAAM,KAAK,QAAQ,QAAQ,GAAG;AAC7C,cACC,OAAO,aAAa,WACpB,UAAU,WACT,OAAO,SAAS,UAAU,OAAO,SAAS,SAC1C;AACD,oBAAQ,OAAO,EAAE;AAAA,UAClB;AAAA,QACD;AAAA,MACD;AAAA,IACD;AAAA,IACA;AAAA,MACC,IAAI,SAAS;AAAA,MACb,OAAO;AAAA,MACP,GAAG,UAAU;AAAA,MAIb;AAAA,IACD;AAAA,IACA;AAAA;AAAA,MAEC,IAAI,SAAS;AAAA,MACb,OAAO;AAAA,MACP,IAAI,CAAC,YAAY;AAChB,mBAAW,CAAC,IAAI,MAAM,KAAK,QAAQ,QAAQ,GAAG;AAC7C,cAAI,OAAO,SAAS,MAAM,wBAAwB,GAAG;AACpD,oBAAQ,OAAO,EAAE;AAAA,UAClB;AAAA,QACD;AAAA,MACD;AAAA,IACD;AAAA,IACA;AAAA;AAAA,MAEC,IAAI,SAAS;AAAA,MACb,OAAO;AAAA,MACP,IAAI,CAAC,YAAY;AAChB,mBAAW,CAAC,IAAI,MAAM,KAAK,QAAQ,QAAQ,GAAG;AAC7C,cAAI,OAAO,SAAS,MAAM,eAAe,GAAG;AAC3C,oBAAQ,OAAO,EAAE;AAAA,UAClB;AAAA,QACD;AAAA,MACD;AAAA,IACD;AAAA,IACA;AAAA,MACC,IAAI,SAAS;AAAA,MACb,OAAO;AAAA,MACP,IAAI,CAAC,WAAW;AACf,YAAI,CAAC,SAAS,MAAM,EAAE,SAAS,OAAO,QAAQ,KAAK,WAAW,QAAQ;AACrE,gBAAM,kBAAkB;AAGxB,cAAI,gBAAgB,MAAM,SAAS,GAAG,KAAK,gBAAgB,UAAU,MAAM;AAC1E,4BAAgB,QAAS,gBAAgB,MAAM,MAAM,GAAG,EAAE,IACzD,uBAAuB,CAAC;AAAA,UAC1B;AAEA,cAAI,OAAO,aAAa,WAAY,gBAA4B,SAAS,QAAQ;AAChF,kBAAM,YAAY;AAClB,uBAAW,CAAC,GAAG,KAAK,KAAK,iBAAiB,UAAU,MAAM,MAAM,GAAG;AAClE,kBAAI,MAAM,MAAM,SAAS,GAAG,KAAK,MAAM,UAAU,MAAM;AACtD,sBAAM,QAAS,MAAM,MAAM,MAAM,GAAG,EAAE,IAAI,uBAAuB,CAAC;AAAA,cACnE;AAAA,YACD;AAAA,UACD;AAAA,QACD;AAAA,MACD;AAAA,MACA,MAAM,MAAM;AAAA,MAGZ;AAAA,IACD;AAAA,EACD;AACD,CAAC;AAED,MAAM,8BAA8B;AACpC,MAAM,uBAAuB,MAAM;AAClC,SAAO,4BAA4B;AAAA,IAClC,KAAK,MAAM,KAAK,OAAO,IAAI,4BAA4B,MAAM;AAAA,EAC9D;AACD;AAEA,MAAM,yBAAyB,CAAC,MAAc;AAC7C,SAAO,MAAM,KAAK,EAAE,QAAQ,EAAE,GAAG,oBAAoB,EAAE,KAAK,EAAE;AAC/D;",
   "names": []
 }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tldraw/tlschema",
   "description": "tldraw infinite canvas SDK (schema).",
-  "version": "4.2.1",
+  "version": "4.2.2",
   "author": {
     "name": "tldraw Inc.",
     "email": "hello@tldraw.com"
@@ -47,18 +47,18 @@
   "devDependencies": {
     "kleur": "^4.1.5",
     "lazyrepo": "0.0.0-alpha.27",
-    "react": "^18.3.1",
+    "react": "^19.2.1",
     "vitest": "^3.2.4"
   },
   "dependencies": {
-    "@tldraw/state": "4.2.1",
-    "@tldraw/store": "4.2.1",
-    "@tldraw/utils": "4.2.1",
-    "@tldraw/validate": "4.2.1"
+    "@tldraw/state": "4.2.2",
+    "@tldraw/store": "4.2.2",
+    "@tldraw/utils": "4.2.2",
+    "@tldraw/validate": "4.2.2"
   },
   "peerDependencies": {
-    "react": "^18.2.0 || ^19.0.0",
-    "react-dom": "^18.2.0 || ^19.0.0"
+    "react": "^18.2.0 || ^19.2.1",
+    "react-dom": "^18.2.0 || ^19.2.1"
   },
   "module": "dist-esm/index.mjs",
   "source": "src/index.ts",

package/src/__tests__/migrationTestUtils.ts

@@ -1,4 +1,4 @@
-import { Migration, MigrationId } from '@tldraw/store'
+import { devFreeze, Migration, MigrationId } from '@tldraw/store'
 import { mockUniqueId, structuredClone } from '@tldraw/utils'
 import { vi } from 'vitest'
 import { createTLSchema } from '../createTLSchema'
@@ -25,8 +25,14 @@ export function getTestMigration(migrationId: MigrationId) {
 		id: migrationId,
 		up: (stuff: any) => {
 			nextNanoId = 0
-			const result = structuredClone(stuff)
-			return migration.up(result) ?? result
+			if (migration.scope === 'record' || migration.scope === 'store') {
+				const result = structuredClone(stuff)
+				return migration.up(result) ?? result
+			}
+			const storage =
+				typeof stuff.entries === 'function' ? stuff : new Map(Object.entries(stuff).map(devFreeze))
+			migration.up(storage)
+			return typeof stuff.entries === 'function' ? storage : Object.fromEntries(storage.entries())
 		},
 		down: (stuff: any) => {
 			nextNanoId = 0

package/src/bindings/TLBaseBinding.ts

@@ -1,4 +1,3 @@
-import { BaseRecord } from '@tldraw/store'
 import { JsonObject } from '@tldraw/utils'
 import { T } from '@tldraw/validate'
 import { idValidator } from '../misc/id-validator'
@@ -10,33 +9,41 @@ import { shapeIdValidator } from '../shapes/TLBaseShape'
  * Base interface for all binding types in tldraw. Bindings represent relationships
  * between shapes, such as arrows connecting to other shapes or organizational connections.
  *
- * All bindings extend this base interface with specific type and property definitions.
+ * All default bindings extend this base interface with specific type and property definitions.
  * The binding system enables shapes to maintain relationships that persist through
  * transformations, movements, and other operations.
  *
+ * Custom bindings should be defined by augmenting the TLGlobalBindingPropsMap type and getting the binding type from the TLBinding type.
+ *
  * @param Type - String literal type identifying the specific binding type (e.g., 'arrow')
  * @param Props - Object containing binding-specific properties and configuration
  *
  * @example
  * ```ts
- * // Define a custom binding type
- * interface MyCustomBinding extends TLBaseBinding<'custom', MyCustomProps> {}
- *
- * interface MyCustomProps {
- *   strength: number
- *   color: string
+ * // Define a default binding type
+ * interface TLArrowBinding extends TLBaseBinding<'arrow', TLArrowBindingProps> {}
+ *
+ * interface TLArrowBindingProps {
+ *   terminal: 'start' | 'end'
+ *   normalizedAnchor: VecModel
+ *   isExact: boolean
+ *   isPrecise: boolean
+ *   snap: ElbowArrowSnap
  * }
  *
  * // Create a binding instance
- * const binding: MyCustomBinding = {
+ * const arrowBinding: TLArrowBinding = {
  *   id: 'binding:abc123',
  *   typeName: 'binding',
- *   type: 'custom',
+ *   type: 'arrow',
  *   fromId: 'shape:source1',
  *   toId: 'shape:target1',
  *   props: {
- *     strength: 0.8,
- *     color: 'red'
+ *     terminal: 'end',
+ *     normalizedAnchor: { x: 0.5, y: 0.5 },
+ *     isExact: false,
+ *     isPrecise: true,
+ *     snap: 'edge'
  *   },
  *   meta: {}
  * }
@@ -44,8 +51,12 @@ import { shapeIdValidator } from '../shapes/TLBaseShape'
  *
  * @public
  */
-export interface TLBaseBinding<Type extends string, Props extends object>
-	extends BaseRecord<'binding', TLBindingId> {
+export interface TLBaseBinding<Type extends string, Props extends object> {
+	// using real `extends BaseRecord<'binding', TLBindingId>` introduces a circularity in the types
+	// and for that reason those "base members" have to be declared manually here
+	readonly id: TLBindingId
+	readonly typeName: 'binding'
+
 	/** The specific type of this binding (e.g., 'arrow', 'custom') */
 	type: Type
 	/** ID of the source shape in this binding relationship */

package/src/createTLSchema.ts

@@ -22,8 +22,9 @@ import {
 	getShapePropKeysByStyle,
 	rootShapeMigrations,
 } from './records/TLShape'
-import { TLPropsMigrations, processPropsMigrations } from './recordsWithProps'
+import { RecordProps, TLPropsMigrations, processPropsMigrations } from './recordsWithProps'
 import { arrowShapeMigrations, arrowShapeProps } from './shapes/TLArrowShape'
+import { TLBaseShape } from './shapes/TLBaseShape'
 import { bookmarkShapeMigrations, bookmarkShapeProps } from './shapes/TLBookmarkShape'
 import { drawShapeMigrations, drawShapeProps } from './shapes/TLDrawShape'
 import { embedShapeMigrations, embedShapeProps } from './shapes/TLEmbedShape'
@@ -147,7 +148,12 @@ export const defaultShapeSchemas = {
 	note: { migrations: noteShapeMigrations, props: noteShapeProps },
 	text: { migrations: textShapeMigrations, props: textShapeProps },
 	video: { migrations: videoShapeMigrations, props: videoShapeProps },
-} satisfies { [T in TLDefaultShape['type']]: SchemaPropsInfo }
+} satisfies {
+	[T in TLDefaultShape['type']]: {
+		migrations: SchemaPropsInfo['migrations']
+		props: RecordProps<TLBaseShape<T, Extract<TLDefaultShape, { type: T }>['props']>>
+	}
+}
 
 /**
  * Default binding schema configurations for all built-in tldraw binding types.

package/src/index.ts

@@ -99,6 +99,8 @@ 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'
@@ -146,7 +148,11 @@ export {
 	isShape,
 	isShapeId,
 	rootShapeMigrations,
+	type ExtractShapeByProps,
+	type TLCreateShapePartial,
 	type TLDefaultShape,
+	type TLGlobalShapePropsMap,
+	type TLIndexedShapes,
 	type TLParentId,
 	type TLShape,
 	type TLShapeId,
@@ -185,6 +191,7 @@ export {
 	type TLBookmarkShapeProps,
 } from './shapes/TLBookmarkShape'
 export {
+	compressLegacySegments,
 	drawShapeMigrations,
 	drawShapeProps,
 	type TLDrawShape,
@@ -307,3 +314,5 @@ 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 { drawShapeVersions } from './shapes/TLDrawShape'
+import { compressLegacySegments, drawShapeVersions } from './shapes/TLDrawShape'
 import { embedShapeVersions } from './shapes/TLEmbedShape'
 import { frameShapeVersions } from './shapes/TLFrameShape'
 import { geoShapeVersions } from './shapes/TLGeoShape'
@@ -1444,6 +1444,32 @@ 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)],
@@ -2242,6 +2268,128 @@ 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