@tldraw/editor 5.2.0-next.335655a13f00 → 5.2.0-next.5d769d321393

package/dist-cjs/index.d.ts

@@ -746,6 +746,7 @@ export declare class ClickManager {
     private _clickTimeout?;
     private _clickScreenPoint?;
     private _previousScreenPoint?;
+    private _isPressingWhilePending;
     _getClickTimeout(state: TLClickState, id?: string): void;
     /* Excluded from this release type: _clickState */
     /**
@@ -4444,6 +4445,7 @@ export declare class Editor extends EventEmitter<TLEventMap> {
     /* Excluded from this release type: _restoreToolId */
     /* Excluded from this release type: _didPinch */
     /* Excluded from this release type: _selectedShapeIdsAtPointerDown */
+    /* Excluded from this release type: _didCaptureSelectionAtPointerDown */
     /* Excluded from this release type: _longPressTimeout */
     /* Excluded from this release type: capturedPointerId */
     /* Excluded from this release type: performanceTracker */
@@ -7165,8 +7167,6 @@ export declare abstract class StateNode implements Partial<TLEventHandlers> {
     onLongPress?(info: TLPointerEventInfo): void;
     onPointerUp?(info: TLPointerEventInfo): void;
     onDoubleClick?(info: TLClickEventInfo): void;
-    onTripleClick?(info: TLClickEventInfo): void;
-    onQuadrupleClick?(info: TLClickEventInfo): void;
     onRightClick?(info: TLPointerEventInfo): void;
     onMiddleClick?(info: TLPointerEventInfo): void;
     onKeyDown?(info: TLKeyboardEventInfo): void;
@@ -7566,17 +7566,17 @@ export declare type TLClickEvent = (info: TLClickEventInfo) => void;
 export declare type TLClickEventInfo = TLBaseEventInfo & {
     button: number;
     name: TLCLickEventName;
-    phase: 'down' | 'settle' | 'up';
+    phase: 'down' | 'settle-down' | 'settle-up' | 'up';
     point: VecLike;
     pointerId: number;
     type: 'click';
 } & TLPointerEventTarget;
 
 /** @public */
-export declare type TLCLickEventName = 'double_click' | 'quadruple_click' | 'triple_click';
+export declare type TLCLickEventName = 'double_click';
 
 /** @public */
-export declare type TLClickState = 'idle' | 'overflow' | 'pendingDouble' | 'pendingOverflow' | 'pendingQuadruple' | 'pendingTriple';
+export declare type TLClickState = 'idle' | 'overflow' | 'pendingDouble' | 'pendingOverflow';
 
 /**
  * Raw clipboard paste payload, before tldraw parses clipboard contents into {@link TLExternalContent}.
@@ -8356,8 +8356,6 @@ export declare interface TLEventHandlers {
     onLongPress: TLPointerEvent;
     onRightClick: TLPointerEvent;
     onDoubleClick: TLClickEvent;
-    onTripleClick: TLClickEvent;
-    onQuadrupleClick: TLClickEvent;
     onMiddleClick: TLPointerEvent;
     onPointerUp: TLPointerEvent;
     onKeyDown: TLKeyboardEvent;

package/dist-cjs/index.js

@@ -380,7 +380,7 @@ var import_uniq = require("./lib/utils/uniq");
 var import_defaultThemes2 = require("./lib/editor/managers/ThemeManager/defaultThemes");
 (0, import_utils.registerTldrawLibraryVersion)(
   "@tldraw/editor",
-  "5.2.0-next.335655a13f00",
+  "5.2.0-next.5d769d321393",
   "cjs"
 );
 //# sourceMappingURL=index.js.map

package/dist-cjs/lib/editor/Editor.js

@@ -2340,6 +2340,11 @@ class Editor extends import_eventemitter3.default {
   getConstrainedCamera(point, opts) {
     const currentCamera = this.getCamera();
     let { x, y, z = currentCamera.z } = point;
+    const preserveFocalPoint = (current, requested, rz, z2) => {
+      const cz = currentCamera.z;
+      if (rz === cz) return current;
+      return current + (requested - current) * (1 / z2 - 1 / cz) / (1 / rz - 1 / cz);
+    };
     if (!opts?.force) {
       const cameraOptions = this.getCameraOptions();
       const zoomMin = cameraOptions.zoomSteps[0];
@@ -2359,14 +2364,10 @@ class Editor extends import_eventemitter3.default {
           z = this.getInitialZoom();
         }
         if (z < minZ || z > maxZ) {
-          const { x: cx, y: cy, z: cz } = currentCamera;
-          const cxA = -cx + vsb.w / cz / 2;
-          const cyA = -cy + vsb.h / cz / 2;
+          const rz = z;
           z = (0, import_utils2.clamp)(z, minZ, maxZ);
-          const cxB = -cx + vsb.w / z / 2;
-          const cyB = -cy + vsb.h / z / 2;
-          x = cx + cxB - cxA;
-          y = cy + cyB - cyA;
+          x = preserveFocalPoint(currentCamera.x, x, rz, z);
+          y = preserveFocalPoint(currentCamera.y, y, rz, z);
         }
         const minX = px / z - bounds.x;
         const minY = py / z - bounds.y;
@@ -2435,10 +2436,10 @@ class Editor extends import_eventemitter3.default {
         }
       } else {
         if (z > zoomMax || z < zoomMin) {
-          const { x: cx, y: cy, z: cz } = currentCamera;
+          const rz = z;
           z = (0, import_utils2.clamp)(z, zoomMin, zoomMax);
-          x = cx + (-cx + vsb.w / z / 2) - (-cx + vsb.w / cz / 2);
-          y = cy + (-cy + vsb.h / z / 2) - (-cy + vsb.h / cz / 2);
+          x = preserveFocalPoint(currentCamera.x, x, rz, z);
+          y = preserveFocalPoint(currentCamera.y, y, rz, z);
         }
       }
     }
@@ -7834,6 +7835,15 @@ class Editor extends import_eventemitter3.default {
   _didPinch = false;
   /** @internal */
   _selectedShapeIdsAtPointerDown = [];
+  /**
+   * Whether `_selectedShapeIdsAtPointerDown` holds a pre-gesture selection
+   * captured by a `pointer_down` (the touch path) that a following pinch
+   * should restore. False when no pointer_down preceded the pinch (the
+   * Safari trackpad path uses gesture events), in which case `pinch_start`
+   * captures the live selection instead.
+   * @internal
+   */
+  _didCaptureSelectionAtPointerDown = false;
   /** @internal */
   _longPressTimeout = -1;
   /** @internal */
@@ -7966,10 +7976,15 @@ class Editor extends import_eventemitter3.default {
           case "pinch_start": {
             if (inputs.getIsPinching()) return;
             if (!inputs.getIsEditing()) {
-              this._selectedShapeIdsAtPointerDown = [...pageState.selectedShapeIds];
+              if (!this._didCaptureSelectionAtPointerDown) {
+                this._selectedShapeIdsAtPointerDown = [...pageState.selectedShapeIds];
+              }
               this._didPinch = true;
               inputs.setIsPinching(true);
               this.interrupt();
+              if (this._didCaptureSelectionAtPointerDown) {
+                this.setSelectedShapes(this._selectedShapeIdsAtPointerDown);
+              }
             }
             this.emit("event", info);
             return;
@@ -8009,6 +8024,7 @@ class Editor extends import_eventemitter3.default {
             const { _selectedShapeIdsAtPointerDown: shapesToReselect } = this;
             this.setSelectedShapes(this._selectedShapeIdsAtPointerDown);
             this._selectedShapeIdsAtPointerDown = [];
+            this._didCaptureSelectionAtPointerDown = false;
             if (this._didPinch) {
               this._didPinch = false;
               if (shapesToReselect.length > 0) {
@@ -8102,7 +8118,10 @@ class Editor extends import_eventemitter3.default {
                 });
               }, this.options.longPressDurationMs);
             }
-            this._selectedShapeIdsAtPointerDown = this.getSelectedShapeIds();
+            if (!this._didCaptureSelectionAtPointerDown) {
+              this._selectedShapeIdsAtPointerDown = this.getSelectedShapeIds();
+              this._didCaptureSelectionAtPointerDown = true;
+            }
             if (info.button === import_constants.LEFT_MOUSE_BUTTON) this.capturedPointerId = info.pointerId;
             inputs.buttons.add(info.button);
             inputs.setIsPointing(true);
@@ -8175,6 +8194,7 @@ class Editor extends import_eventemitter3.default {
             if (this.inputs.getIsRightPointing() && !this.inputs.getIsPanning()) {
               this.inputs.setIsRightPointing(false);
               this._selectedShapeIdsAtPointerDown = [];
+              this._didCaptureSelectionAtPointerDown = false;
               break;
             }
             this.inputs.setIsRightPointing(false);
@@ -8212,6 +8232,7 @@ class Editor extends import_eventemitter3.default {
                     this.slideCamera({ speed: slideSpeed, direction: slideDirection });
                   }
                   this._selectedShapeIdsAtPointerDown = [];
+                  this._didCaptureSelectionAtPointerDown = false;
                   return this;
                 }
               }
@@ -8225,6 +8246,7 @@ class Editor extends import_eventemitter3.default {
               }
             }
             this._selectedShapeIdsAtPointerDown = [];
+            this._didCaptureSelectionAtPointerDown = false;
             break;
           }
         }