@tldraw/editor 3.14.0-canary.ab6376ed9638 → 3.14.0-canary.ae54a012ca55

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

@@ -357,6 +357,7 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
     __publicField(this, "externalContentHandlers", {
       text: null,
       files: null,
+      "file-replace": null,
       embed: null,
       "svg-text": null,
       url: null,
@@ -473,6 +474,7 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
     this.disposables.add(() => this.user.dispose());
     this.getContainer = getContainer;
     this.textMeasure = new TextManager(this);
+    this.disposables.add(() => this.textMeasure.dispose());
     this.fonts = new FontManager(this, fontAssetUrls);
     this._tickManager = new TickManager(this);
     class NewRoot extends RootState {
@@ -593,20 +595,21 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
         shape: {
           afterChange: (shapeBefore, shapeAfter) => {
             for (const binding of this.getBindingsInvolvingShape(shapeAfter)) {
-              if (areShapesContentEqual(shapeBefore, shapeAfter)) continue;
               invalidBindingTypes.add(binding.type);
               if (binding.fromId === shapeAfter.id) {
                 this.getBindingUtil(binding).onAfterChangeFromShape?.({
                   binding,
                   shapeBefore,
-                  shapeAfter
+                  shapeAfter,
+                  reason: "self"
                 });
               }
               if (binding.toId === shapeAfter.id) {
                 this.getBindingUtil(binding).onAfterChangeToShape?.({
                   binding,
                   shapeBefore,
-                  shapeAfter
+                  shapeAfter,
+                  reason: "self"
                 });
               }
             }
@@ -620,14 +623,16 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
                     this.getBindingUtil(binding).onAfterChangeFromShape?.({
                       binding,
                       shapeBefore: descendantShape,
-                      shapeAfter: descendantShape
+                      shapeAfter: descendantShape,
+                      reason: "ancestry"
                     });
                   }
                   if (binding.toId === descendantShape.id) {
                     this.getBindingUtil(binding).onAfterChangeToShape?.({
                       binding,
                       shapeBefore: descendantShape,
-                      shapeAfter: descendantShape
+                      shapeAfter: descendantShape,
+                      reason: "ancestry"
                     });
                   }
                 }
@@ -1671,6 +1676,19 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
   getSelectionPageBounds() {
     return this.getShapesPageBounds(this.getSelectedShapeIds());
   }
+  /**
+   * The bounds of the selection bounding box in the current page space.
+   *
+   * @readonly
+   * @public
+   */
+  getSelectionScreenBounds() {
+    const bounds = this.getSelectionPageBounds();
+    if (!bounds) return void 0;
+    const { x, y } = this.pageToScreen(bounds.point);
+    const zoom = this.getZoomLevel();
+    return new Box(x, y, bounds.width * zoom, bounds.height * zoom);
+  }
   /**
    * @internal
    */
@@ -4147,7 +4165,7 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
     if (!id) return void 0;
     const freshShape = this.getShape(id);
     if (freshShape === void 0 || !isShapeId(freshShape.parentId)) return void 0;
-    return this.store.get(freshShape.parentId);
+    return this.getShape(freshShape.parentId);
   }
   /**
    * If siblingShape and targetShape are siblings, this returns targetShape. If targetShape has an
@@ -4279,6 +4297,9 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
           if (!pagePoint) continue;
           const newPoint = invertedParentTransform.applyToPoint(pagePoint);
           const newRotation = pageTransform.rotation() - parentPageRotation;
+          if (shape.id === parentId) {
+            throw Error("Attempted to reparent a shape to itself!");
+          }
           changes.push({
             id: shape.id,
             type: shape.type,
@@ -4371,6 +4392,10 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
     }
     return shapeIds;
   }
+  /** @deprecated Use {@link Editor.getDraggingOverShape} instead */
+  getDroppingOverShape(point, droppingShapes) {
+    return this.getDraggingOverShape(point, droppingShapes);
+  }
   /**
    * Get the shape that some shapes should be dropped on at a given point.
    *
@@ -4381,22 +4406,20 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
    *
    * @public
    */
-  getDroppingOverShape(point, droppingShapes = []) {
-    const currentPageShapesSorted = this.getCurrentPageShapesSorted();
-    for (let i = currentPageShapesSorted.length - 1; i >= 0; i--) {
-      const shape = currentPageShapesSorted[i];
-      if (
-        // ignore hidden shapes
-        this.isShapeHidden(shape) || // don't allow dropping on selected shapes
-        this.getSelectedShapeIds().includes(shape.id) || // only allow shapes that can receive children
-        !this.getShapeUtil(shape).canDropShapes(shape, droppingShapes) || // don't allow dropping a shape on itself or one of it's children
-        droppingShapes.find((s) => s.id === shape.id || this.hasAncestor(shape, s.id))
-      ) {
-        continue;
-      }
-      const maskedPageBounds = this.getShapeMaskedPageBounds(shape.id);
-      if (maskedPageBounds && maskedPageBounds.containsPoint(point) && this.getShapeGeometry(shape).hitTestPoint(this.getPointInShapeSpace(shape, point), 0, true)) {
-        return shape;
+  getDraggingOverShape(point, droppingShapes) {
+    const draggingShapes = compact(droppingShapes.map((s) => this.getShape(s))).filter(
+      (s) => !s.isLocked && !this.isShapeHidden(s)
+    );
+    const maybeDraggingOverShapes = this.getShapesAtPoint(point, {
+      hitInside: true,
+      margin: 0
+    }).filter(
+      (s) => !droppingShapes.includes(s) && !s.isLocked && !this.isShapeHidden(s) && !draggingShapes.includes(s)
+    );
+    for (const maybeDraggingOverShape of maybeDraggingOverShapes) {
+      const shapeUtil = this.getShapeUtil(maybeDraggingOverShape);
+      if (shapeUtil.onDragShapesOver || shapeUtil.onDragShapesIn || shapeUtil.onDragShapesOut || shapeUtil.onDropShapesOver) {
+        return maybeDraggingOverShape;
       }
     }
   }
@@ -4673,7 +4696,8 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
    */
   duplicateShapes(shapes, offset) {
     this.run(() => {
-      const ids = typeof shapes[0] === "string" ? shapes : shapes.map((s) => s.id);
+      const _ids = typeof shapes[0] === "string" ? shapes : shapes.map((s) => s.id);
+      const ids = this._shouldIgnoreShapeLock ? _ids : this._getUnlockedShapeIds(_ids);
       if (ids.length <= 0) return this;
       const initialIds = new Set(ids);
       const shapeIdSet = this.getShapeAndDescendantIds(ids);
@@ -4737,8 +4761,7 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
         shape.index = index;
       });
       const shapesToCreate = shapesToCreateWithOriginals.map(({ shape }) => shape);
-      const maxShapesReached = shapesToCreate.length + this.getCurrentPageShapeIds().size > this.options.maxShapesPerPage;
-      if (maxShapesReached) {
+      if (!this.canCreateShapes(shapesToCreate)) {
         alertMaxShapes(this);
         return;
       }
@@ -5753,6 +5776,26 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
   getInitialMetaForShape(_shape) {
     return {};
   }
+  /**
+   * Get whether the provided shape can be created.
+   *
+   * @param shape - The shape or shape IDs to check.
+   *
+   * @public
+   */
+  canCreateShape(shape) {
+    return this.canCreateShapes([shape]);
+  }
+  /**
+   * Get whether the provided shapes can be created.
+   *
+   * @param shapes - The shapes or shape IDs to create.
+   *
+   * @public
+   */
+  canCreateShapes(shapes) {
+    return shapes.length + this.getCurrentPageShapeIds().size <= this.options.maxShapesPerPage;
+  }
   /**
    * Create a single shape.
    *
@@ -5806,7 +5849,8 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
           let parentId = this.getFocusedGroupId();
           for (let i = currentPageShapesSorted.length - 1; i >= 0; i--) {
             const parent = currentPageShapesSorted[i];
-            if (!this.isShapeHidden(parent) && this.getShapeUtil(parent).canReceiveNewChildrenOfType(parent, partial.type) && this.isPointInShape(
+            const util = this.getShapeUtil(parent);
+            if (util.canReceiveNewChildrenOfType(parent, partial.type) && !this.isShapeHidden(parent) && this.isPointInShape(
               parent,
               // If no parent is provided, then we can treat the
               // shape's provided x/y as being in the page's space.
@@ -5881,6 +5925,8 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
           ...shape.meta
         };
       });
+      this.emit("created-shapes", shapeRecordsToCreate);
+      this.emit("edit");
       this.store.put(shapeRecordsToCreate);
     });
     return this;
@@ -6122,6 +6168,8 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
         updated = this.getShapeUtil(shape).onBeforeUpdate?.(shape, updated) ?? updated;
         updates.push(updated);
       }
+      this.emit("edited-shapes", updates);
+      this.emit("edit");
       this.store.put(updates);
     });
   }
@@ -6143,6 +6191,8 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
         allShapeIdsToDelete.add(childId);
       });
     }
+    this.emit("deleted-shapes", [...allShapeIdsToDelete]);
+    this.emit("edit");
     return this.run(() => this.store.remove([...allShapeIdsToDelete]));
   }
   deleteShape(_id) {
@@ -6486,6 +6536,14 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
   async putExternalContent(info) {
     return this.externalContentHandlers[info.type]?.(info);
   }
+  /**
+   * Handle replacing external content.
+   *
+   * @param info - Info about the external content.
+   */
+  async replaceExternalContent(info) {
+    return this.externalContentHandlers[info.type]?.(info);
+  }
   /**
    * Get content that can be exported for the given shape ids.
    *
@@ -6903,7 +6961,9 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
       previousScreenPoint,
       previousPagePoint,
       currentScreenPoint,
-      currentPagePoint
+      currentPagePoint,
+      originScreenPoint,
+      originPagePoint
     } = this.inputs;
     const { screenBounds } = this.store.unsafeGetWithoutCapture(TLINSTANCE_ID);
     const { x: cx, y: cy, z: cz } = unsafe__withoutCapture(() => this.getCamera());
@@ -6921,8 +6981,8 @@ class Editor extends (_a = EventEmitter, _getIsShapeHiddenCache_dec = [computed]
     this.inputs.isPen = info.type === "pointer" && info.isPen;
     if (info.name === "pointer_down" || this.inputs.isPinching) {
       pointerVelocity.set(0, 0);
-      this.inputs.originScreenPoint.setTo(currentScreenPoint);
-      this.inputs.originPagePoint.setTo(currentPagePoint);
+      originScreenPoint.setTo(currentScreenPoint);
+      originPagePoint.setTo(currentPagePoint);
     }
     this.run(
       () => {