fix migration exports (#3586)

We're missing the export for `createShapePropsMigrationIds`, so lets add
it. This also fixes some other bits that were used in examples but not
exported properly from tldraw.

### Change Type

- [x] `sdk` — Changes the tldraw SDK
- [x] `bugfix` — Bug fix

### Release Notes

- Expose `createShapePropsMigrationIds`, `defaultEditorAssetUrls`,
`PORTRAIT_BREAKPOINT`, `useDefaultColorTheme`, & `getPerfectDashProps`

.eslintrc.js

@@ -46,12 +46,12 @@ module.exports = {
 		'react-hooks/rules-of-hooks': 'error',
 		'react-hooks/exhaustive-deps': 'error',
 		'import/no-extraneous-dependencies': 'error',
-		'import/no-internal-modules': ['error', { forbid: ['@tldraw/*/**', 'tldraw/**'] }],
 		'@typescript-eslint/consistent-type-exports': [
 			'error',
 			{ fixMixedExportsWithInlineTypeSpecifier: true },
 		],
 		'local/no-export-star': 'error',
+		'local/no-internal-imports': 'error',
 		'no-only-tests/no-only-tests': 'error',
 		'no-restricted-syntax': [
 			'error',
@@ -99,7 +99,6 @@ module.exports = {
 		{
 			files: ['apps/examples/**/*'],
 			rules: {
-				'import/no-internal-modules': 'off',
 				'no-restricted-syntax': 'off',
 			},
 		},

apps/dotcom/src/utils/assetUrls.ts

@@ -1,4 +1,3 @@
-// eslint-disable-next-line import/no-internal-modules
 import { getAssetUrlsByImport } from '@tldraw/assets/imports.vite'
 
 export const assetUrls = getAssetUrlsByImport()

apps/examples/src/examples/custom-config/CardShape/card-shape-migrations.ts

@@ -1,5 +1,4 @@
-import { createShapePropsMigrationIds } from '@tldraw/tlschema/src/records/TLShape'
+import { createShapePropsMigrationIds, createShapePropsMigrationSequence } from 'tldraw'
-import { createShapePropsMigrationSequence } from 'tldraw'
 
 const versions = createShapePropsMigrationIds(
 	// this must match the shape type in the shape definition

apps/examples/src/examples/exploded/ExplodedExample.tsx

@@ -9,12 +9,12 @@ import {
 	TldrawSelectionBackground,
 	TldrawSelectionForeground,
 	TldrawUi,
+	defaultEditorAssetUrls,
 	defaultShapeTools,
 	defaultShapeUtils,
 	defaultTools,
 	usePreloadAssets,
 } from 'tldraw'
-import { defaultEditorAssetUrls } from 'tldraw/src/lib/utils/static-assets/assetUrls'
 import 'tldraw/tldraw.css'
 
 // There's a guide at the bottom of this file!

apps/examples/src/examples/image-annotator/ImageAnnotationEditor.tsx

@@ -3,6 +3,7 @@ import {
 	AssetRecordType,
 	Box,
 	Editor,
+	PORTRAIT_BREAKPOINT,
 	SVGContainer,
 	TLImageShape,
 	TLShapeId,
@@ -16,7 +17,6 @@ import {
 	useBreakpoint,
 	useEditor,
 } from 'tldraw'
-import { PORTRAIT_BREAKPOINT } from 'tldraw/src/lib/ui/constants'
 import { AnnotatorImage } from './types'
 
 // TODO:

apps/examples/src/examples/pdf-editor/PdfEditor.tsx

@@ -1,6 +1,7 @@
 import { useCallback, useEffect, useMemo } from 'react'
 import {
 	Box,
+	PORTRAIT_BREAKPOINT,
 	SVGContainer,
 	TLImageShape,
 	TLShapeId,
@@ -15,7 +16,6 @@ import {
 	useBreakpoint,
 	useEditor,
 } from 'tldraw'
-import { PORTRAIT_BREAKPOINT } from 'tldraw/src/lib/ui/constants'
 import { ExportPdfButton } from './ExportPdfButton'
 import { Pdf } from './PdfPicker'
 

apps/examples/src/examples/shape-with-migrations/ShapeWithMigrationsExample.tsx

@@ -6,6 +6,8 @@ import {
 	TLOnResizeHandler,
 	TLStoreSnapshot,
 	Tldraw,
+	createShapePropsMigrationIds,
+	createShapePropsMigrationSequence,
 	resizeBox,
 } from 'tldraw'
 import 'tldraw/tldraw.css'
@@ -22,6 +24,31 @@ export type IMyShape = TLBaseShape<
 	}
 >
 
+// [1]
+const versions = createShapePropsMigrationIds(
+	// this must match the shape type in the shape definition
+	'myshape',
+	{
+		AddColor: 1,
+	}
+)
+
+// [2]
+export const cardShapeMigrations = createShapePropsMigrationSequence({
+	sequence: [
+		{
+			id: versions.AddColor,
+			up(props) {
+				// it is safe to mutate the props object here
+				props.color = 'lightblue'
+			},
+			down(props) {
+				delete props.color
+			},
+		},
+	],
+})
+
 export class MigratedShapeUtil extends BaseBoxShapeUtil<IMyShape> {
 	static override type = 'myshape' as const
 
@@ -31,31 +58,8 @@ export class MigratedShapeUtil extends BaseBoxShapeUtil<IMyShape> {
 		color: T.string,
 	}
 
-	// [1]
+	// [3]
-	static override migrations = {
+	static override migrations = cardShapeMigrations
-		firstVersion: 0,
-		currentVersion: 1,
-		migrators: {
-			1: {
-				up(shape: IMyShape) {
-					return {
-						...shape,
-						props: {
-							...shape.props,
-							color: 'lightblue',
-						},
-					}
-				},
-				down(shape: IMyShape) {
-					const { color: _, ...propsWithoutColor } = shape.props
-					return {
-						...shape,
-						props: propsWithoutColor,
-					}
-				},
-			},
-		},
-	}
 
 	getDefaultProps(): IMyShape['props'] {
 		return {
@@ -104,59 +108,56 @@ export default function ShapeWithMigrationsExample() {
 /* 
 Introduction:
 
-Sometimes you'll want to update the way a shape works in your application without
+Sometimes you'll want to update the way a shape works in your application without breaking older
-breaking older versions of the shape that a user may have stored or persisted in
+versions of the shape that a user may have stored or persisted in memory. 
-memory. 
 
-This example shows how you can use our migrations system to upgrade (or downgrade)
+This example shows how you can use our migrations system to upgrade (or downgrade) user's data
-user's data between different versions. Most of the code above is general "custom
+between different versions. Most of the code above is general "custom shape" code—see our custom
-shape" code—see our custom shape example for more details.
+shape example for more details.
 
-[1] 
+[1] First, we need IDs for each migration. List each change with its version number. Once you've
-To define migrations, we can override the migrations property of our shape util. Each migration
+added a migration, it should not change again.
-had two parts: an `up` migration and `down` migration. In this case, the `up` migration adds
-the `color` prop to the shape, and the `down` migration removes it.
 
-In some cases (mainly in multiplayer sessions) a peer or server may need to take a later 
+[2] Next, we create a migration sequence. This is where we actually write our migration logic. Each
-version of a shape and migrate it down to an older version—in this case, it would run the
+migration had three parts: an `id` (created in [1]), an `up` migration and `down` migration. In this
-down migrations in order to get it to the needed version.
+case, the `up` migration adds the `color` prop to the shape, and the `down` migration removes it.
+
+In some cases (mainly in multiplayer sessions) a peer or server may need to take a later version of
+a shape and migrate it down to an older version—in this case, it would run the down migrations in
+order to get it to the needed version.
+
+[3] Finally, we add our migrations to the ShapeUtil. This tells tldraw about the migrations so they
+can be used with your shapes.
 
 How it works:
 
-Each time the editor's store creates a snapshot (`editor.store.createSnapshot`), it 
+Each time the editor's store creates a snapshot (`editor.store.createSnapshot`), it serializes all
-serializes all of the records (the snapshot's `store`) as well as versions of each 
+of the records (the snapshot's `store`) as well as versions of each record that it contains (the
-record that it contains (the snapshot's `scena`). When the editor loads a snapshot, 
+snapshot's `scena`). When the editor loads a snapshot, it compares its current schema with the
-it compares its current schema with the snapshot's schema to determine which migrations
+snapshot's schema to determine which migrations to apply to each record.
-to apply to each record.
 
-In this example, we have a snapshot (snapshot.json) that we created in version 0,
+In this example, we have a snapshot (snapshot.json) that we created in version 0, however our shape
-however our shape now has a 'color' prop that was added in version 1. 
+now has a 'color' prop that was added in version 1. 
 
 The snapshot looks something like this:
 
 ```json{
 {
-	"store": {
+    "store": {
-		"shape:BqG5uIAa9ig2-ukfnxwBX": {
+        "shape:BqG5uIAa9ig2-ukfnxwBX": {
+            ...,
+            "props": {
+                "w": 300,
+                "h": 300
+            },
+        },
+	},
+	"schema": {
+		...,
+		"sequences": {
 			...,
-			"props": {
+			"com.tldraw.shape.arrow": 4,
-				"w": 300,
+			"com.tldraw.shape.myshape": 0
-				"h": 300
-			},
-		},
-		"schema": {
-			...,
-			"recordVersions": {
-				...,
-				"shape": {
-					"version": 3,
-					"subTypeKey": "type",
-					"subTypeVersions": {
-						...,
-						"myshape": 0
-					}
-				}
-			}
 		}
 	}
 }
@@ -166,9 +167,8 @@ Note that the shape in the snapshot doesn't have a 'color' prop.
 
 Note also that the schema's version for this shape is 0.
 
-When the editor loads the snapshot, it will compare the serialzied schema's version with 
+When the editor loads the snapshot, it will compare the serialzied schema's version with its current
-its current schema's version for the shape, which is 1 as defined in our shape's migrations.
+schema's version for the shape, which is 1 as defined in our shape's migrations. Since the
-Since the serialized version is older than its current version, it will use our migration
+serialized version is older than its current version, it will use our migration to bring it up to
-to bring it up to date: it will run the migration's `up` function, which will add the 'color'
+date: it will run the migration's `up` function, which will add the 'color' prop to the shape.
-prop to the shape.
 */

apps/examples/src/examples/shape-with-tldraw-styles/ShapeWithTldrawStylesExample.tsx

@@ -8,8 +8,8 @@ import {
 	TLDefaultColorStyle,
 	TLDefaultSizeStyle,
 	Tldraw,
+	useDefaultColorTheme,
 } from 'tldraw'
-import { useDefaultColorTheme } from 'tldraw/src/lib/shapes/shared/ShapeFill'
 import 'tldraw/tldraw.css'
 
 // There's a guide at the bottom of this file!

apps/examples/src/examples/slides/SlideShapeUtil.tsx

@@ -8,10 +8,10 @@ import {
 	T,
 	TLBaseShape,
 	TLOnResizeHandler,
+	getPerfectDashProps,
 	resizeBox,
 	useValue,
 } from 'tldraw'
-import { getPerfectDashProps } from 'tldraw/src/lib/shapes/shared/getPerfectDashProps'
 import { moveToSlide, useSlides } from './useSlides'
 
 export type SlideShape = TLBaseShape<

apps/examples/src/examples/speech-bubble/SpeechBubble/SpeechBubbleUtil.tsx

@@ -22,9 +22,9 @@ import {
 	ZERO_INDEX_KEY,
 	resizeBox,
 	structuredClone,
+	useDefaultColorTheme,
 	vecModelValidator,
 } from 'tldraw'
-import { useDefaultColorTheme } from 'tldraw/src/lib/shapes/shared/ShapeFill'
 import { getSpeechBubbleVertices, getTailIntersectionPoint } from './helpers'
 
 // Copied from tldraw/tldraw

apps/examples/src/misc/EndToEndApi.tsx

@@ -1,4 +1,4 @@
-import { TLExportType } from 'tldraw/src/lib/utils/export/exportAs'
+import { TLExportType } from 'tldraw'
 
 export interface EndToEndApi {
 	exportAsSvg: () => void

apps/vscode/editor/src/app.tsx

@@ -1,6 +1,3 @@
-// eslint-disable-next-line import/no-internal-modules
-import 'tldraw/tldraw.css'
-// eslint-disable-next-line import/no-internal-modules
 import { getAssetUrlsByImport } from '@tldraw/assets/imports'
 import { useCallback, useEffect, useMemo, useState } from 'react'
 import {
@@ -13,6 +10,7 @@ import {
 	TldrawUiMenuGroup,
 	setRuntimeOverrides,
 } from 'tldraw'
+import 'tldraw/tldraw.css'
 import { VscodeMessage } from '../../messages'
 import '../public/index.css'
 import { ChangeResponder } from './ChangeResponder'

packages/tldraw/api-report.md

@@ -63,6 +63,8 @@ import { TLCancelEvent } from '@tldraw/editor';
 import { TLClickEvent } from '@tldraw/editor';
 import { TLClickEventInfo } from '@tldraw/editor';
 import { TLDefaultColorTheme } from '@tldraw/editor';
+import { TLDefaultColorThemeColor } from '@tldraw/editor';
+import { TLDefaultDashStyle } from '@tldraw/editor';
 import { TLDefaultFillStyle } from '@tldraw/editor';
 import { TLDefaultFontStyle } from '@tldraw/editor';
 import { TLDefaultHorizontalAlignStyle } from '@tldraw/editor';
@@ -372,6 +374,9 @@ export function DefaultDebugMenu({ children }: TLUiDebugMenuProps): JSX_2.Elemen
 // @public (undocumented)
 export function DefaultDebugMenuContent(): JSX_2.Element;
 
+// @public (undocumented)
+export let defaultEditorAssetUrls: TLEditorAssetUrls;
+
 // @public (undocumented)
 export function DefaultHelperButtons({ children }: TLUiHelperButtonsProps): JSX_2.Element;
 
@@ -835,6 +840,19 @@ export function getEmbedInfo(inputUrl: string): TLEmbedResult;
 // @public (undocumented)
 export function getOccludedChildren(editor: Editor, parent: TLShape): TLShapeId[];
 
+// @public (undocumented)
+export function getPerfectDashProps(totalLength: number, strokeWidth: number, opts?: Partial<{
+    closed: boolean;
+    end: 'none' | 'outset' | 'skip';
+    lengthRatio: number;
+    snap: number;
+    start: 'none' | 'outset' | 'skip';
+    style: TLDefaultDashStyle;
+}>): {
+    strokeDasharray: string;
+    strokeDashoffset: string;
+};
+
 // @public (undocumented)
 export function getSvgAsImage(svgString: string, isSafari: boolean, options: {
     height: number;
@@ -1216,6 +1234,26 @@ export function parseTldrawJsonFile({ json, schema, }: {
 // @public (undocumented)
 export function PasteMenuItem(): JSX_2.Element;
 
+// @public (undocumented)
+export enum PORTRAIT_BREAKPOINT {
+    // (undocumented)
+    DESKTOP = 7,
+    // (undocumented)
+    MOBILE = 4,
+    // (undocumented)
+    MOBILE_SM = 3,
+    // (undocumented)
+    MOBILE_XS = 2,
+    // (undocumented)
+    MOBILE_XXS = 1,
+    // (undocumented)
+    TABLET = 6,
+    // (undocumented)
+    TABLET_SM = 5,
+    // (undocumented)
+    ZERO = 0
+}
+
 // @public (undocumented)
 export function PreferencesGroup(): JSX_2.Element;
 
@@ -1720,6 +1758,9 @@ export type TldrawUiProps = Expand<TldrawUiBaseProps & TldrawUiContextProviderPr
 // @internal (undocumented)
 export const TldrawUiSlider: NamedExoticComponent<TLUiSliderProps>;
 
+// @public (undocumented)
+export type TLExportType = 'jpeg' | 'json' | 'png' | 'svg' | 'webp';
+
 // @public (undocumented)
 export interface TLUiActionItem<TransationKey extends string = string, IconType extends string = string> {
     // (undocumented)
@@ -2486,6 +2527,27 @@ export function useCopyAs(): (ids: TLShapeId[], format?: TLCopyType) => void;
 // @public (undocumented)
 export const useCurrentTranslation: () => TLUiTranslation;
 
+// @public (undocumented)
+export function useDefaultColorTheme(): {
+    "light-blue": TLDefaultColorThemeColor;
+    "light-green": TLDefaultColorThemeColor;
+    "light-red": TLDefaultColorThemeColor;
+    "light-violet": TLDefaultColorThemeColor;
+    background: string;
+    black: TLDefaultColorThemeColor;
+    blue: TLDefaultColorThemeColor;
+    green: TLDefaultColorThemeColor;
+    grey: TLDefaultColorThemeColor;
+    id: "dark" | "light";
+    orange: TLDefaultColorThemeColor;
+    red: TLDefaultColorThemeColor;
+    solid: string;
+    text: string;
+    violet: TLDefaultColorThemeColor;
+    white: TLDefaultColorThemeColor;
+    yellow: TLDefaultColorThemeColor;
+};
+
 // @public (undocumented)
 export function useDefaultHelpers(): {
     addDialog: (dialog: Omit<TLUiDialog, "id"> & {

packages/tldraw/api/api.json

@@ -3358,6 +3358,30 @@
           "parameters": [],
           "name": "DefaultDebugMenuContent"
         },
+        {
+          "kind": "Variable",
+          "canonicalReference": "tldraw!defaultEditorAssetUrls:var",
+          "docComment": "/**\n * @public\n */\n",
+          "excerptTokens": [
+            {
+              "kind": "Content",
+              "text": "defaultEditorAssetUrls: "
+            },
+            {
+              "kind": "Reference",
+              "text": "TLEditorAssetUrls",
+              "canonicalReference": "tldraw!~TLEditorAssetUrls:type"
+            }
+          ],
+          "fileUrlPath": "packages/tldraw/src/lib/utils/static-assets/assetUrls.ts",
+          "isReadonly": false,
+          "releaseTag": "Public",
+          "name": "defaultEditorAssetUrls",
+          "variableTypeTokenRange": {
+            "startIndex": 1,
+            "endIndex": 2
+          }
+        },
         {
           "kind": "Function",
           "canonicalReference": "tldraw!DefaultHelperButtons:function(1)",
@@ -6450,7 +6474,7 @@
             {
               "kind": "Reference",
               "text": "TLExportType",
-              "canonicalReference": "tldraw!~TLExportType:type"
+              "canonicalReference": "tldraw!TLExportType:type"
             },
             {
               "kind": "Content",
@@ -9202,6 +9226,97 @@
           ],
           "name": "getOccludedChildren"
         },
+        {
+          "kind": "Function",
+          "canonicalReference": "tldraw!getPerfectDashProps:function(1)",
+          "docComment": "/**\n * @public\n */\n",
+          "excerptTokens": [
+            {
+              "kind": "Content",
+              "text": "export declare function getPerfectDashProps(totalLength: "
+            },
+            {
+              "kind": "Content",
+              "text": "number"
+            },
+            {
+              "kind": "Content",
+              "text": ", strokeWidth: "
+            },
+            {
+              "kind": "Content",
+              "text": "number"
+            },
+            {
+              "kind": "Content",
+              "text": ", opts?: "
+            },
+            {
+              "kind": "Reference",
+              "text": "Partial",
+              "canonicalReference": "!Partial:type"
+            },
+            {
+              "kind": "Content",
+              "text": "<{\n    closed: boolean;\n    end: 'none' | 'outset' | 'skip';\n    lengthRatio: number;\n    snap: number;\n    start: 'none' | 'outset' | 'skip';\n    style: "
+            },
+            {
+              "kind": "Reference",
+              "text": "TLDefaultDashStyle",
+              "canonicalReference": "@tldraw/tlschema!TLDefaultDashStyle:type"
+            },
+            {
+              "kind": "Content",
+              "text": ";\n}>"
+            },
+            {
+              "kind": "Content",
+              "text": "): "
+            },
+            {
+              "kind": "Content",
+              "text": "{\n    strokeDasharray: string;\n    strokeDashoffset: string;\n}"
+            },
+            {
+              "kind": "Content",
+              "text": ";"
+            }
+          ],
+          "fileUrlPath": "packages/tldraw/src/lib/shapes/shared/getPerfectDashProps.ts",
+          "returnTypeTokenRange": {
+            "startIndex": 10,
+            "endIndex": 11
+          },
+          "releaseTag": "Public",
+          "overloadIndex": 1,
+          "parameters": [
+            {
+              "parameterName": "totalLength",
+              "parameterTypeTokenRange": {
+                "startIndex": 1,
+                "endIndex": 2
+              },
+              "isOptional": false
+            },
+            {
+              "parameterName": "strokeWidth",
+              "parameterTypeTokenRange": {
+                "startIndex": 3,
+                "endIndex": 4
+              },
+              "isOptional": false
+            },
+            {
+              "parameterName": "opts",
+              "parameterTypeTokenRange": {
+                "startIndex": 5,
+                "endIndex": 9
+              },
+              "isOptional": true
+            }
+          ],
+          "name": "getPerfectDashProps"
+        },
         {
           "kind": "Function",
           "canonicalReference": "tldraw!getSvgAsImage:function(1)",
@@ -13950,6 +14065,191 @@
           "parameters": [],
           "name": "PasteMenuItem"
         },
+        {
+          "kind": "Enum",
+          "canonicalReference": "tldraw!PORTRAIT_BREAKPOINT:enum",
+          "docComment": "/**\n * @public\n */\n",
+          "excerptTokens": [
+            {
+              "kind": "Content",
+              "text": "export declare enum PORTRAIT_BREAKPOINT "
+            }
+          ],
+          "fileUrlPath": "packages/tldraw/src/lib/ui/constants.ts",
+          "releaseTag": "Public",
+          "name": "PORTRAIT_BREAKPOINT",
+          "preserveMemberOrder": false,
+          "members": [
+            {
+              "kind": "EnumMember",
+              "canonicalReference": "tldraw!PORTRAIT_BREAKPOINT.DESKTOP:member",
+              "docComment": "",
+              "excerptTokens": [
+                {
+                  "kind": "Content",
+                  "text": "DESKTOP = "
+                },
+                {
+                  "kind": "Content",
+                  "text": "7"
+                }
+              ],
+              "initializerTokenRange": {
+                "startIndex": 1,
+                "endIndex": 2
+              },
+              "releaseTag": "Public",
+              "name": "DESKTOP"
+            },
+            {
+              "kind": "EnumMember",
+              "canonicalReference": "tldraw!PORTRAIT_BREAKPOINT.MOBILE:member",
+              "docComment": "",
+              "excerptTokens": [
+                {
+                  "kind": "Content",
+                  "text": "MOBILE = "
+                },
+                {
+                  "kind": "Content",
+                  "text": "4"
+                }
+              ],
+              "initializerTokenRange": {
+                "startIndex": 1,
+                "endIndex": 2
+              },
+              "releaseTag": "Public",
+              "name": "MOBILE"
+            },
+            {
+              "kind": "EnumMember",
+              "canonicalReference": "tldraw!PORTRAIT_BREAKPOINT.MOBILE_SM:member",
+              "docComment": "",
+              "excerptTokens": [
+                {
+                  "kind": "Content",
+                  "text": "MOBILE_SM = "
+                },
+                {
+                  "kind": "Content",
+                  "text": "3"
+                }
+              ],
+              "initializerTokenRange": {
+                "startIndex": 1,
+                "endIndex": 2
+              },
+              "releaseTag": "Public",
+              "name": "MOBILE_SM"
+            },
+            {
+              "kind": "EnumMember",
+              "canonicalReference": "tldraw!PORTRAIT_BREAKPOINT.MOBILE_XS:member",
+              "docComment": "",
+              "excerptTokens": [
+                {
+                  "kind": "Content",
+                  "text": "MOBILE_XS = "
+                },
+                {
+                  "kind": "Content",
+                  "text": "2"
+                }
+              ],
+              "initializerTokenRange": {
+                "startIndex": 1,
+                "endIndex": 2
+              },
+              "releaseTag": "Public",
+              "name": "MOBILE_XS"
+            },
+            {
+              "kind": "EnumMember",
+              "canonicalReference": "tldraw!PORTRAIT_BREAKPOINT.MOBILE_XXS:member",
+              "docComment": "",
+              "excerptTokens": [
+                {
+                  "kind": "Content",
+                  "text": "MOBILE_XXS = "
+                },
+                {
+                  "kind": "Content",
+                  "text": "1"
+                }
+              ],
+              "initializerTokenRange": {
+                "startIndex": 1,
+                "endIndex": 2
+              },
+              "releaseTag": "Public",
+              "name": "MOBILE_XXS"
+            },
+            {
+              "kind": "EnumMember",
+              "canonicalReference": "tldraw!PORTRAIT_BREAKPOINT.TABLET:member",
+              "docComment": "",
+              "excerptTokens": [
+                {
+                  "kind": "Content",
+                  "text": "TABLET = "
+                },
+                {
+                  "kind": "Content",
+                  "text": "6"
+                }
+              ],
+              "initializerTokenRange": {
+                "startIndex": 1,
+                "endIndex": 2
+              },
+              "releaseTag": "Public",
+              "name": "TABLET"
+            },
+            {
+              "kind": "EnumMember",
+              "canonicalReference": "tldraw!PORTRAIT_BREAKPOINT.TABLET_SM:member",
+              "docComment": "",
+              "excerptTokens": [
+                {
+                  "kind": "Content",
+                  "text": "TABLET_SM = "
+                },
+                {
+                  "kind": "Content",
+                  "text": "5"
+                }
+              ],
+              "initializerTokenRange": {
+                "startIndex": 1,
+                "endIndex": 2
+              },
+              "releaseTag": "Public",
+              "name": "TABLET_SM"
+            },
+            {
+              "kind": "EnumMember",
+              "canonicalReference": "tldraw!PORTRAIT_BREAKPOINT.ZERO:member",
+              "docComment": "",
+              "excerptTokens": [
+                {
+                  "kind": "Content",
+                  "text": "ZERO = "
+                },
+                {
+                  "kind": "Content",
+                  "text": "0"
+                }
+              ],
+              "initializerTokenRange": {
+                "startIndex": 1,
+                "endIndex": 2
+              },
+              "releaseTag": "Public",
+              "name": "ZERO"
+            }
+          ]
+        },
         {
           "kind": "Function",
           "canonicalReference": "tldraw!PreferencesGroup:function(1)",
@@ -19960,6 +20260,32 @@
             "endIndex": 7
           }
         },
+        {
+          "kind": "TypeAlias",
+          "canonicalReference": "tldraw!TLExportType:type",
+          "docComment": "/**\n * @public\n */\n",
+          "excerptTokens": [
+            {
+              "kind": "Content",
+              "text": "export type TLExportType = "
+            },
+            {
+              "kind": "Content",
+              "text": "'jpeg' | 'json' | 'png' | 'svg' | 'webp'"
+            },
+            {
+              "kind": "Content",
+              "text": ";"
+            }
+          ],
+          "fileUrlPath": "packages/tldraw/src/lib/utils/export/exportAs.ts",
+          "releaseTag": "Public",
+          "name": "TLExportType",
+          "typeTokenRange": {
+            "startIndex": 1,
+            "endIndex": 2
+          }
+        },
         {
           "kind": "Interface",
           "canonicalReference": "tldraw!TLUiActionItem:interface",
@@ -27339,6 +27665,151 @@
           "parameters": [],
           "name": "useCurrentTranslation"
         },
+        {
+          "kind": "Function",
+          "canonicalReference": "tldraw!useDefaultColorTheme:function(1)",
+          "docComment": "/**\n * @public\n */\n",
+          "excerptTokens": [
+            {
+              "kind": "Content",
+              "text": "export declare function useDefaultColorTheme(): "
+            },
+            {
+              "kind": "Content",
+              "text": "{\n    \"light-blue\": import(\"@tldraw/editor\")."
+            },
+            {
+              "kind": "Reference",
+              "text": "TLDefaultColorThemeColor",
+              "canonicalReference": "@tldraw/tlschema!TLDefaultColorThemeColor:type"
+            },
+            {
+              "kind": "Content",
+              "text": ";\n    \"light-green\": import(\"@tldraw/editor\")."
+            },
+            {
+              "kind": "Reference",
+              "text": "TLDefaultColorThemeColor",
+              "canonicalReference": "@tldraw/tlschema!TLDefaultColorThemeColor:type"
+            },
+            {
+              "kind": "Content",
+              "text": ";\n    \"light-red\": import(\"@tldraw/editor\")."
+            },
+            {
+              "kind": "Reference",
+              "text": "TLDefaultColorThemeColor",
+              "canonicalReference": "@tldraw/tlschema!TLDefaultColorThemeColor:type"
+            },
+            {
+              "kind": "Content",
+              "text": ";\n    \"light-violet\": import(\"@tldraw/editor\")."
+            },
+            {
+              "kind": "Reference",
+              "text": "TLDefaultColorThemeColor",
+              "canonicalReference": "@tldraw/tlschema!TLDefaultColorThemeColor:type"
+            },
+            {
+              "kind": "Content",
+              "text": ";\n    background: string;\n    black: import(\"@tldraw/editor\")."
+            },
+            {
+              "kind": "Reference",
+              "text": "TLDefaultColorThemeColor",
+              "canonicalReference": "@tldraw/tlschema!TLDefaultColorThemeColor:type"
+            },
+            {
+              "kind": "Content",
+              "text": ";\n    blue: import(\"@tldraw/editor\")."
+            },
+            {
+              "kind": "Reference",
+              "text": "TLDefaultColorThemeColor",
+              "canonicalReference": "@tldraw/tlschema!TLDefaultColorThemeColor:type"
+            },
+            {
+              "kind": "Content",
+              "text": ";\n    green: import(\"@tldraw/editor\")."
+            },
+            {
+              "kind": "Reference",
+              "text": "TLDefaultColorThemeColor",
+              "canonicalReference": "@tldraw/tlschema!TLDefaultColorThemeColor:type"
+            },
+            {
+              "kind": "Content",
+              "text": ";\n    grey: import(\"@tldraw/editor\")."
+            },
+            {
+              "kind": "Reference",
+              "text": "TLDefaultColorThemeColor",
+              "canonicalReference": "@tldraw/tlschema!TLDefaultColorThemeColor:type"
+            },
+            {
+              "kind": "Content",
+              "text": ";\n    id: \"dark\" | \"light\";\n    orange: import(\"@tldraw/editor\")."
+            },
+            {
+              "kind": "Reference",
+              "text": "TLDefaultColorThemeColor",
+              "canonicalReference": "@tldraw/tlschema!TLDefaultColorThemeColor:type"
+            },
+            {
+              "kind": "Content",
+              "text": ";\n    red: import(\"@tldraw/editor\")."
+            },
+            {
+              "kind": "Reference",
+              "text": "TLDefaultColorThemeColor",
+              "canonicalReference": "@tldraw/tlschema!TLDefaultColorThemeColor:type"
+            },
+            {
+              "kind": "Content",
+              "text": ";\n    solid: string;\n    text: string;\n    violet: import(\"@tldraw/editor\")."
+            },
+            {
+              "kind": "Reference",
+              "text": "TLDefaultColorThemeColor",
+              "canonicalReference": "@tldraw/tlschema!TLDefaultColorThemeColor:type"
+            },
+            {
+              "kind": "Content",
+              "text": ";\n    white: import(\"@tldraw/editor\")."
+            },
+            {
+              "kind": "Reference",
+              "text": "TLDefaultColorThemeColor",
+              "canonicalReference": "@tldraw/tlschema!TLDefaultColorThemeColor:type"
+            },
+            {
+              "kind": "Content",
+              "text": ";\n    yellow: import(\"@tldraw/editor\")."
+            },
+            {
+              "kind": "Reference",
+              "text": "TLDefaultColorThemeColor",
+              "canonicalReference": "@tldraw/tlschema!TLDefaultColorThemeColor:type"
+            },
+            {
+              "kind": "Content",
+              "text": ";\n}"
+            },
+            {
+              "kind": "Content",
+              "text": ";"
+            }
+          ],
+          "fileUrlPath": "packages/tldraw/src/lib/shapes/shared/ShapeFill.tsx",
+          "returnTypeTokenRange": {
+            "startIndex": 1,
+            "endIndex": 28
+          },
+          "releaseTag": "Public",
+          "overloadIndex": 1,
+          "parameters": [],
+          "name": "useDefaultColorTheme"
+        },
         {
           "kind": "Function",
           "canonicalReference": "tldraw!useDefaultHelpers:function(1)",
@@ -27625,7 +28096,7 @@
             {
               "kind": "Reference",
               "text": "TLExportType",
-              "canonicalReference": "tldraw!~TLExportType:type"
+              "canonicalReference": "tldraw!TLExportType:type"
             },
             {
               "kind": "Content",

packages/tldraw/src/index.ts

@@ -32,7 +32,9 @@ export { LineShapeTool } from './lib/shapes/line/LineShapeTool'
 export { LineShapeUtil } from './lib/shapes/line/LineShapeUtil'
 export { NoteShapeTool } from './lib/shapes/note/NoteShapeTool'
 export { NoteShapeUtil } from './lib/shapes/note/NoteShapeUtil'
+export { useDefaultColorTheme } from './lib/shapes/shared/ShapeFill'
 export { TextLabel } from './lib/shapes/shared/TextLabel'
+export { getPerfectDashProps } from './lib/shapes/shared/getPerfectDashProps'
 export { TextShapeTool } from './lib/shapes/text/TextShapeTool'
 export { TextShapeUtil } from './lib/shapes/text/TextShapeUtil'
 export { VideoShapeUtil } from './lib/shapes/video/VideoShapeUtil'
@@ -48,6 +50,7 @@ export { TldrawUi, type TldrawUiBaseProps, type TldrawUiProps } from './lib/ui/T
 export { setDefaultUiAssetUrls, type TLUiAssetUrlOverrides } from './lib/ui/assetUrls'
 export { OfflineIndicator } from './lib/ui/components/OfflineIndicator/OfflineIndicator'
 export { Spinner } from './lib/ui/components/Spinner'
+export { PORTRAIT_BREAKPOINT } from './lib/ui/constants'
 export {
 	TldrawUiContextProvider,
 	type TldrawUiContextProviderProps,
@@ -115,9 +118,12 @@ export {
 export { getEmbedInfo } from './lib/utils/embeds/embeds'
 export { copyAs } from './lib/utils/export/copyAs'
 export { exportToBlob, getSvgAsImage } from './lib/utils/export/export'
-export { exportAs } from './lib/utils/export/exportAs'
+export { exportAs, type TLExportType } from './lib/utils/export/exportAs'
 export { fitFrameToContent, removeFrame } from './lib/utils/frames/frames'
-export { setDefaultEditorAssetUrls } from './lib/utils/static-assets/assetUrls'
+export {
+	defaultEditorAssetUrls,
+	setDefaultEditorAssetUrls,
+} from './lib/utils/static-assets/assetUrls'
 export { truncateStringWithEllipsis } from './lib/utils/text/text'
 export {
 	buildFromV1Document,

packages/tldraw/src/lib/shapes/shared/ShapeFill.tsx

@@ -18,6 +18,7 @@ export interface ShapeFillProps {
 	theme: TLDefaultColorTheme
 }
 
+/** @public */
 export function useDefaultColorTheme() {
 	return getDefaultColorTheme({ isDarkMode: useIsDarkMode() })
 }

packages/tldraw/src/lib/shapes/shared/getPerfectDashProps.ts

@@ -1,5 +1,6 @@
 import { TLDefaultDashStyle } from '@tldraw/editor'
 
+/** @public */
 export function getPerfectDashProps(
 	totalLength: number,
 	strokeWidth: number,

packages/tldraw/src/lib/ui/constants.ts

@@ -2,6 +2,7 @@
 export const PORTRAIT_BREAKPOINTS = [0, 390, 428, 468, 580, 640, 840, 1023]
 
 // Mapping for above array -- needs to be kept in sync!
+/** @public */
 export enum PORTRAIT_BREAKPOINT {
 	ZERO = 0,
 	MOBILE_XXS = 1,

packages/tlschema/api-report.md

@@ -142,6 +142,11 @@ export const createPresenceStateDerivation: ($user: Signal<{
 // @public (undocumented)
 export function createShapeId(id?: string): TLShapeId;
 
+// @public (undocumented)
+export function createShapePropsMigrationIds<S extends string, T extends Record<string, number>>(shapeType: S, ids: T): {
+    [k in keyof T]: `com.tldraw.shape.${S}/${T[k]}`;
+};
+
 // @public (undocumented)
 export function createShapePropsMigrationSequence(migrations: TLShapePropsMigrations): TLShapePropsMigrations;
 

packages/tlschema/api/api.json

@@ -1114,6 +1114,112 @@
           ],
           "name": "createShapeId"
         },
+        {
+          "kind": "Function",
+          "canonicalReference": "@tldraw/tlschema!createShapePropsMigrationIds:function(1)",
+          "docComment": "/**\n * @public\n */\n",
+          "excerptTokens": [
+            {
+              "kind": "Content",
+              "text": "export declare function createShapePropsMigrationIds<S extends "
+            },
+            {
+              "kind": "Content",
+              "text": "string"
+            },
+            {
+              "kind": "Content",
+              "text": ", T extends "
+            },
+            {
+              "kind": "Reference",
+              "text": "Record",
+              "canonicalReference": "!Record:type"
+            },
+            {
+              "kind": "Content",
+              "text": "<string, number>"
+            },
+            {
+              "kind": "Content",
+              "text": ">(shapeType: "
+            },
+            {
+              "kind": "Content",
+              "text": "S"
+            },
+            {
+              "kind": "Content",
+              "text": ", ids: "
+            },
+            {
+              "kind": "Content",
+              "text": "T"
+            },
+            {
+              "kind": "Content",
+              "text": "): "
+            },
+            {
+              "kind": "Content",
+              "text": "{\n    [k in keyof T]: `com.tldraw.shape.${S}/${T[k]}`;\n}"
+            },
+            {
+              "kind": "Content",
+              "text": ";"
+            }
+          ],
+          "fileUrlPath": "packages/tlschema/src/records/TLShape.ts",
+          "returnTypeTokenRange": {
+            "startIndex": 10,
+            "endIndex": 11
+          },
+          "releaseTag": "Public",
+          "overloadIndex": 1,
+          "parameters": [
+            {
+              "parameterName": "shapeType",
+              "parameterTypeTokenRange": {
+                "startIndex": 6,
+                "endIndex": 7
+              },
+              "isOptional": false
+            },
+            {
+              "parameterName": "ids",
+              "parameterTypeTokenRange": {
+                "startIndex": 8,
+                "endIndex": 9
+              },
+              "isOptional": false
+            }
+          ],
+          "typeParameters": [
+            {
+              "typeParameterName": "S",
+              "constraintTokenRange": {
+                "startIndex": 1,
+                "endIndex": 2
+              },
+              "defaultTypeTokenRange": {
+                "startIndex": 0,
+                "endIndex": 0
+              }
+            },
+            {
+              "typeParameterName": "T",
+              "constraintTokenRange": {
+                "startIndex": 3,
+                "endIndex": 5
+              },
+              "defaultTypeTokenRange": {
+                "startIndex": 0,
+                "endIndex": 0
+              }
+            }
+          ],
+          "name": "createShapePropsMigrationIds"
+        },
         {
           "kind": "Function",
           "canonicalReference": "@tldraw/tlschema!createShapePropsMigrationSequence:function(1)",

packages/tlschema/src/index.ts

@@ -52,6 +52,7 @@ export { InstancePresenceRecordType, type TLInstancePresence } from './records/T
 export { type TLRecord } from './records/TLRecord'
 export {
 	createShapeId,
+	createShapePropsMigrationIds,
 	createShapePropsMigrationSequence,
 	getShapePropKeysByStyle,
 	isShape,

scripts/lib/eslint-plugin.ts

@@ -59,4 +59,48 @@ exports.rules = {
 		},
 		defaultOptions: [],
 	}),
+	'no-internal-imports': ESLintUtils.RuleCreator.withoutDocs({
+		create(context) {
+			return {
+				ImportDeclaration(node) {
+					const path = node.source.value
+
+					const parts = path.split('/')
+
+					switch (parts[0]) {
+						case 'tldraw':
+							// 'tldraw'
+							if (parts.length === 1) return
+							// 'tldraw/**/*.css'
+							if (path.endsWith('.css')) return
+							break
+						case '@tldraw':
+							// '@tldraw/*'
+							if (parts.length === 2) return
+							// '@tldraw/**/*.css'
+							if (path.endsWith('.css')) return
+							// '@tldraw/assets/*'
+							if (parts[1] === 'assets' && parts.length === 3) return
+							break
+						default:
+							return
+					}
+
+					context.report({
+						messageId: 'internal',
+						node: node.source,
+						data: { path },
+					})
+				},
+			}
+		},
+		meta: {
+			messages: {
+				internal: "Don't import from internal tldraw source ({{path}})",
+			},
+			type: 'problem',
+			schema: [],
+		},
+		defaultOptions: [],
+	}),
 }