Setup papercuts (#2987)

I'm bringing the sockets example up to date and ran into some issues
that were tricky to resolve in userland but trivial to resolve in
packageland.

Gonna collect them here.  

### Change Type

- [x] `patch` — Bug fix
- [ ] `minor` — New feature
- [ ] `major` — Breaking change
- [ ] `dependencies` — Changes to package dependencies[^1]
- [ ] `documentation` — Changes to the documentation only[^2]
- [ ] `tests` — Changes to any test code only[^2]
- [ ] `internal` — Any other changes that don't affect the published
package[^2]
- [ ] I don't know

[^1]: publishes a `patch` release, for devDependencies use `internal`
[^2]: will not publish a new version

### Test Plan

1. Add a step-by-step description of how to test your PR here.
2.

- [ ] Unit Tests
- [ ] End to end tests

### Release Notes

- Add a brief release note for your PR here.

packages/editor/src/lib/config/TLUserPreferences.ts

@@ -196,7 +196,7 @@ function loadUserPreferences(): TLUserPreferences {
 	return migrateUserPreferences(userData)
 }
 
-const globalUserPreferences = atom<TLUserPreferences>('globalUserData', loadUserPreferences())
+const globalUserPreferences = atom<TLUserPreferences | null>('globalUserData', null)
 
 function storeUserPreferences() {
 	if (typeof window !== 'undefined' && window.localStorage) {
@@ -240,13 +240,18 @@ function broadcastUserPreferencesChange() {
 		type: broadcastEventKey,
 		origin: broadcastOrigin,
 		data: {
-			user: globalUserPreferences.get(),
+			user: getUserPreferences(),
 			version: userMigrations.currentVersion,
 		},
 	} satisfies UserChangeBroadcastMessage)
 }
 
 /** @public */
-export function getUserPreferences() {
-	return globalUserPreferences.get()
+export function getUserPreferences(): TLUserPreferences {
+	let prefs = globalUserPreferences.get()
+	if (!prefs) {
+		prefs = loadUserPreferences()
+		globalUserPreferences.set(prefs)
+	}
+	return prefs
 }

packages/tlschema/api-report.md

@@ -148,8 +148,8 @@ export function createShapeValidator<Type extends string, Props extends JsonObje
 }): T.ObjectValidator<{ [P in "id" | "index" | "isLocked" | "meta" | "opacity" | "parentId" | "rotation" | "typeName" | "x" | "y" | (undefined extends Props ? never : "props") | (undefined extends Type ? never : "type")]: TLBaseShape<Type, Props>[P]; } & { [P_1 in (undefined extends Props ? "props" : never) | (undefined extends Type ? "type" : never)]?: TLBaseShape<Type, Props>[P_1] | undefined; }>;
 
 // @public
-export function createTLSchema({ shapes }: {
-    shapes: Record<string, SchemaShapeInfo>;
+export function createTLSchema({ shapes, }?: {
+    shapes?: Record<string, SchemaShapeInfo>;
 }): TLSchema;
 
 // @public (undocumented)

packages/tlschema/api/api.json

@@ -1300,11 +1300,11 @@
           "excerptTokens": [
             {
               "kind": "Content",
-              "text": "export declare function createTLSchema({ shapes }: "
+              "text": "export declare function createTLSchema({ shapes, }?: "
             },
             {
               "kind": "Content",
-              "text": "{\n    shapes: "
+              "text": "{\n    shapes?: "
             },
             {
               "kind": "Reference",
@@ -1347,12 +1347,12 @@
           "overloadIndex": 1,
           "parameters": [
             {
-              "parameterName": "{ shapes }",
+              "parameterName": "{ shapes, }",
               "parameterTypeTokenRange": {
                 "startIndex": 1,
                 "endIndex": 6
               },
-              "isOptional": false
+              "isOptional": true
             }
           ],
           "name": "createTLSchema"

packages/tlschema/src/createTLSchema.ts

@@ -10,7 +10,20 @@ import { InstancePageStateRecordType } from './records/TLPageState'
 import { PointerRecordType } from './records/TLPointer'
 import { InstancePresenceRecordType } from './records/TLPresence'
 import { TLRecord } from './records/TLRecord'
-import { createShapeRecordType, getShapePropKeysByStyle } from './records/TLShape'
+import { TLDefaultShape, createShapeRecordType, getShapePropKeysByStyle } from './records/TLShape'
+import { arrowShapeMigrations, arrowShapeProps } from './shapes/TLArrowShape'
+import { bookmarkShapeMigrations, bookmarkShapeProps } from './shapes/TLBookmarkShape'
+import { drawShapeMigrations, drawShapeProps } from './shapes/TLDrawShape'
+import { embedShapeMigrations, embedShapeProps } from './shapes/TLEmbedShape'
+import { frameShapeMigrations, frameShapeProps } from './shapes/TLFrameShape'
+import { geoShapeMigrations, geoShapeProps } from './shapes/TLGeoShape'
+import { groupShapeMigrations, groupShapeProps } from './shapes/TLGroupShape'
+import { highlightShapeMigrations, highlightShapeProps } from './shapes/TLHighlightShape'
+import { imageShapeMigrations, imageShapeProps } from './shapes/TLImageShape'
+import { lineShapeMigrations, lineShapeProps } from './shapes/TLLineShape'
+import { noteShapeMigrations, noteShapeProps } from './shapes/TLNoteShape'
+import { textShapeMigrations, textShapeProps } from './shapes/TLTextShape'
+import { videoShapeMigrations, videoShapeProps } from './shapes/TLVideoShape'
 import { storeMigrations } from './store-migrations'
 import { StyleProp } from './styles/StyleProp'
 
@@ -29,13 +42,33 @@ export type SchemaShapeInfo = {
 /** @public */
 export type TLSchema = StoreSchema<TLRecord, TLStoreProps>
 
+const defaultShapes: { [T in TLDefaultShape['type']]: SchemaShapeInfo } = {
+	arrow: { migrations: arrowShapeMigrations, props: arrowShapeProps },
+	bookmark: { migrations: bookmarkShapeMigrations, props: bookmarkShapeProps },
+	draw: { migrations: drawShapeMigrations, props: drawShapeProps },
+	embed: { migrations: embedShapeMigrations, props: embedShapeProps },
+	frame: { migrations: frameShapeMigrations, props: frameShapeProps },
+	geo: { migrations: geoShapeMigrations, props: geoShapeProps },
+	group: { migrations: groupShapeMigrations, props: groupShapeProps },
+	highlight: { migrations: highlightShapeMigrations, props: highlightShapeProps },
+	image: { migrations: imageShapeMigrations, props: imageShapeProps },
+	line: { migrations: lineShapeMigrations, props: lineShapeProps },
+	note: { migrations: noteShapeMigrations, props: noteShapeProps },
+	text: { migrations: textShapeMigrations, props: textShapeProps },
+	video: { migrations: videoShapeMigrations, props: videoShapeProps },
+}
+
 /**
  * Create a TLSchema with custom shapes. Custom shapes cannot override default shapes.
  *
  * @param opts - Options
  *
  * @public */
-export function createTLSchema({ shapes }: { shapes: Record<string, SchemaShapeInfo> }): TLSchema {
+export function createTLSchema({
+	shapes = defaultShapes,
+}: {
+	shapes?: Record<string, SchemaShapeInfo>
+} = {}): TLSchema {
 	const stylesById = new Map<string, StyleProp<unknown>>()
 	for (const shape of objectMapValues(shapes)) {
 		for (const style of getShapePropKeysByStyle(shape.props ?? {}).keys()) {