From d2f1fb561e4924ad9313fabc6e75c62f3c5ac237 Mon Sep 17 00:00:00 2001
From: Peng Xiao <pengxiao@outlook.com>
Date: Fri, 24 Jun 2022 11:37:49 +0800
Subject: [PATCH] fix: arrow binding issue

---
 .../cljs-demo/src/main/playground/tldraw.cljs  |  2 +-
 .../core/src/lib/TLBaseLineBindingState.ts     |  1 +
 tldraw/packages/core/src/lib/TLPage/TLPage.ts  | 18 ++++--------------
 3 files changed, 6 insertions(+), 15 deletions(-)

diff --git a/tldraw/cljs-demo/src/main/playground/tldraw.cljs b/tldraw/cljs-demo/src/main/playground/tldraw.cljs
index 2168e5fad..dba517d40 100644
--- a/tldraw/cljs-demo/src/main/playground/tldraw.cljs
+++ b/tldraw/cljs-demo/src/main/playground/tldraw.cljs
@@ -41,7 +41,7 @@
        "size" [600 320],
        "opacity" 1,
        "point" [876.7157262252258 195.59449311640805]}],
-     "bindings" [],
+     "bindings" {},
      "nonce" 1}],
    "assets" []})
 
diff --git a/tldraw/packages/core/src/lib/TLBaseLineBindingState.ts b/tldraw/packages/core/src/lib/TLBaseLineBindingState.ts
index 7fff3b24b..3a367f43c 100644
--- a/tldraw/packages/core/src/lib/TLBaseLineBindingState.ts
+++ b/tldraw/packages/core/src/lib/TLBaseLineBindingState.ts
@@ -20,6 +20,7 @@ export class TLBaseLineBindingState<
   bindableShapeIds: string[] = []
   startBindingShapeId?: string
   newStartBindingId = ''
+  // Seems this value is never assigned to other than the default?
   draggedBindingId = ''
 
   onPointerMove: TLStateEvents<S, K>['onPointerMove'] = () => {
diff --git a/tldraw/packages/core/src/lib/TLPage/TLPage.ts b/tldraw/packages/core/src/lib/TLPage/TLPage.ts
index b453d95f5..1126aab69 100644
--- a/tldraw/packages/core/src/lib/TLPage/TLPage.ts
+++ b/tldraw/packages/core/src/lib/TLPage/TLPage.ts
@@ -1,20 +1,10 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
 import { intersectRayBounds } from '@tldraw/intersect'
 import Vec from '@tldraw/vec'
-import {
-  action,
-  autorun,
-  computed,
-  makeObservable,
-  observable,
-  observe,
-  reaction,
-  toJS,
-  transaction,
-} from 'mobx'
+import { action, computed, makeObservable, observable, reaction, toJS } from 'mobx'
 import { BINDING_DISTANCE } from '~constants'
 import type { TLApp, TLShape, TLShapeModel } from '~lib'
-import type { TLLineShape, TLShapeProps } from '~lib/shapes'
+import type { TLLineShape } from '~lib/shapes'
 import { TLBinding, TLBounds, TLEventMap, TLHandle, TLResizeCorner } from '~types'
 import { BoundsUtils, deepCopy, deepEqual, PointUtils } from '~utils'
 
@@ -38,7 +28,7 @@ export class TLPage<S extends TLShape = TLShape, E extends TLEventMap = TLEventM
     const { id, name, shapes = [], bindings = {} } = props
     this.id = id
     this.name = name
-    this.bindings = bindings
+    this.bindings = Object.assign({}, bindings) // make sure it is type of object
     this.app = app
     this.addShapes(...shapes)
     makeObservable(this)
@@ -66,7 +56,7 @@ export class TLPage<S extends TLShape = TLShape, E extends TLEventMap = TLEventM
 
   @observable shapes: S[] = []
 
-  @observable bindings: Record<string, TLBinding>
+  @observable bindings: Record<string, TLBinding> = {}
 
   @computed get serialized(): TLPageModel<S> {
     return {