@tldraw/editor 5.5.4 → 5.6.0-canary.0091c91994d6

package/dist-esm/lib/editor/Editor.mjs

@@ -72,6 +72,7 @@ import {
   getSnapshot,
   loadSnapshot
 } from "../config/TLEditorSnapshot.mjs";
+import { defaultI18n } from "../config/TLI18n.mjs";
 import {
   DEFAULT_ANIMATION_OPTIONS,
   DEFAULT_CAMERA_OPTIONS,
@@ -99,7 +100,8 @@ import {
   approximately,
   areAnglesCompatible,
   clamp,
-  pointInPolygon
+  pointInPolygon,
+  shortAngleDist
 } from "../primitives/utils.mjs";
 import { Vec } from "../primitives/Vec.mjs";
 import { areShapesContentEqual } from "../utils/areShapesContentEqual.mjs";
@@ -164,9 +166,11 @@ class Editor extends EventEmitter {
     colorScheme,
     fontAssetUrls,
     themes,
-    initialTheme
+    initialTheme,
+    i18n
   }) {
     super();
+    this.i18n = i18n ?? defaultI18n;
     this._getShapeVisibility = getShapeVisibility;
     const options = _textOptions ? { ..._options, text: _options?.text ?? _textOptions } : _options;
     this.options = { ...defaultTldrawOptions, ...options };
@@ -678,6 +682,12 @@ class Editor extends EventEmitter {
    */
   licenseManager;
   contextId = uniqueId();
+  /**
+   * The i18n adapter for translating strings.
+   *
+   * @public
+   */
+  i18n;
   /**
    * The editor's store
    *
@@ -1657,7 +1667,7 @@ class Editor extends EventEmitter {
     const firstParentId = selectedShapeIds[0] ? this.getShape(selectedShapeIds[0])?.parentId : null;
     const isSelectedWithinContainer = firstParentId && selectedShapeIds.every((shapeId) => this.getShape(shapeId)?.parentId === firstParentId) && !isPageId(firstParentId);
     const filteredShapes = this.getCurrentPageShapes().filter(
-      (shape2) => !this.isShapeOrAncestorLocked(shape2) && (isSelectedWithinContainer ? shape2.parentId === firstParentId : isPageId(shape2.parentId))
+      (shape2) => isSelectedWithinContainer ? shape2.parentId === firstParentId : isPageId(shape2.parentId)
     );
     const readingOrderShapes = this._getShapesInReadingOrder(filteredShapes);
     const currentShapeId = selectedShapeIds.length === 1 ? selectedShapeIds[0] : readingOrderShapes.find((shape2) => selectedShapeIds.includes(shape2.id))?.id;
@@ -1800,6 +1810,11 @@ class Editor extends EventEmitter {
     this._selectShapesAndZoom([sortedChildren[0].id]);
   }
   _selectShapesAndZoom(ids) {
+    const selectedShapeIds = this.getSelectedShapeIds();
+    const isSelectionChanging = ids.length !== selectedShapeIds.length || ids.some((id) => !selectedShapeIds.includes(id));
+    if (isSelectionChanging) {
+      this.markHistoryStoppingPoint("selecting adjacent shape");
+    }
     this.setSelectedShapes(ids);
     this.zoomToSelectionIfOffscreen(256, {
       animation: {
@@ -3698,7 +3713,9 @@ class Editor extends EventEmitter {
     const id = typeof page === "string" ? page : page.id;
     const freshPage = this.getPage(id);
     if (!freshPage) return this;
-    const prevCamera = { ...this.getCamera() };
+    const prevCamera = {
+      ...(this.store.get(CameraRecordType.createId(freshPage.id)) ?? this.getCamera())
+    };
     const content = this.getContentFromCurrentPage(this.getSortedChildIdsForParent(freshPage.id));
     this.run(() => {
       const pages = this.getPages();
@@ -3707,7 +3724,7 @@ class Editor extends EventEmitter {
       this.setCurrentPage(createId);
       this.setCamera(prevCamera);
       if (content) {
-        return this.putContentOntoCurrentPage(content);
+        return this.putContentOntoCurrentPage(content, { preservePosition: true });
       }
     });
     return this;
@@ -5967,9 +5984,10 @@ class Editor extends EventEmitter {
       }
     }
     let workingShape = null;
+    const initialPagePoint = Mat.applyToPoint(pageTransform, new Vec());
     if (util.onResize && util.canResize(initialShape)) {
       const newPagePoint = this._scalePagePoint(
-        Mat.applyToPoint(pageTransform, new Vec(0, 0)),
+        initialPagePoint,
         scaleOrigin,
         scale,
         scaleAxisRotation
@@ -5982,7 +6000,6 @@ class Editor extends EventEmitter {
       );
       myScale.x = areWidthAndHeightAlignedWithCorrectAxis ? scale.x : scale.y;
       myScale.y = areWidthAndHeightAlignedWithCorrectAxis ? scale.y : scale.x;
-      const initialPagePoint = Mat.applyToPoint(pageTransform, new Vec());
       const { x, y } = this.getPointInParentSpace(initialShape.id, initialPagePoint);
       workingShape = initialShape;
       if (!opts.skipStartAndEndCallbacks) {
@@ -6028,24 +6045,26 @@ class Editor extends EventEmitter {
       scale,
       scaleAxisRotation
     );
-    const initialPageCenterInParentSpace = this.getPointInParentSpace(
+    const repositionedPagePoint = Vec.Add(
+      newPageCenter,
+      Vec.Sub(initialPagePoint, initialPageCenter)
+    );
+    const repositionedLocalPoint = this.getPointInParentSpace(
       initialShape.id,
-      initialPageCenter
+      repositionedPagePoint
     );
-    const newPageCenterInParentSpace = this.getPointInParentSpace(initialShape.id, newPageCenter);
-    const delta = Vec.Sub(newPageCenterInParentSpace, initialPageCenterInParentSpace);
     if (workingShape) {
       return {
         ...workingShape,
-        x: initialShape.x + delta.x,
-        y: initialShape.y + delta.y
+        x: repositionedLocalPoint.x,
+        y: repositionedLocalPoint.y
       };
     }
     return {
       id,
       type: initialShape.type,
-      x: initialShape.x + delta.x,
-      y: initialShape.y + delta.y
+      x: repositionedLocalPoint.x,
+      y: repositionedLocalPoint.y
     };
   }
   /** @internal */
@@ -6071,11 +6090,20 @@ class Editor extends EventEmitter {
       initialShape: options.initialShape,
       initialBounds: options.initialBounds,
       isAspectRatioLocked: options.isAspectRatioLocked,
-      initialPageTransform: options.initialPageTransform
+      initialPageTransform: options.initialPageTransform,
+      dragHandle: options.dragHandle,
+      mode: options.mode,
+      // this is one frame of the same resize, not a new one, so don't fire start/end again
+      skipStartAndEndCallbacks: options.skipStartAndEndCallbacks
     });
     if (Math.sign(scale.x) * Math.sign(scale.y) < 0) {
       const parentRotation = this.getShapeParentTransform(id).rotation();
-      const rotation = -options.initialShape.rotation - 2 * parentRotation;
+      const parentDelta = shortAngleDist(
+        Mat.Cast(options.initialPageTransform).rotation() - options.initialShape.rotation,
+        parentRotation
+      );
+      const initialParentRotation = parentRotation - parentDelta;
+      const rotation = 2 * options.scaleAxisRotation - options.initialShape.rotation - 2 * initialParentRotation - parentDelta;
       this.updateShapes([{ id, type, rotation }]);
     }
     const preScaleShapePageCenter = Mat.applyToPoint(
@@ -8384,6 +8412,7 @@ class Editor extends EventEmitter {
             break;
           }
           case "key_repeat": {
+            inputs.keys.add(info.code);
             break;
           }
         }