@tldraw/editor 3.8.0-canary.80294e641ad6 → 3.8.0-canary.811fed79c8ad

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

@@ -87,6 +87,7 @@ var import_defaultBindings = require("../config/defaultBindings");
 var import_defaultShapes = require("../config/defaultShapes");
 var import_constants = require("../constants");
 var import_exportToSvg = require("../exports/exportToSvg");
+var import_getSvgAsImage = require("../exports/getSvgAsImage");
 var import_environment = require("../globals/environment");
 var import_menus = require("../globals/menus");
 var import_time = require("../globals/time");
@@ -812,6 +813,10 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
     (0, import_utils.assert)(shapeUtil, `No shape util found for type "${type}"`);
     return shapeUtil;
   }
+  hasShapeUtil(arg) {
+    const type = typeof arg === "string" ? arg : arg.type;
+    return (0, import_utils.hasOwnProperty)(this.shapeUtils, type);
+  }
   getBindingUtil(arg) {
     const type = typeof arg === "string" ? arg : arg.type;
     const bindingUtil = (0, import_utils.getOwnProperty)(this.bindingUtils, type);
@@ -1159,8 +1164,8 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
    *
    * @example
    * ```ts
-   * state.getStateDescendant('select')
-   * state.getStateDescendant('select.brushing')
+   * editor.getStateDescendant('select')
+   * editor.getStateDescendant('select.brushing')
    * ```
    *
    * @param path - The descendant's path of state ids, separated by periods.
@@ -1214,7 +1219,7 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
       if (partial.isChangingStyle === true) {
         this._isChangingStyleTimeout = this.timers.setTimeout(() => {
           this._updateInstanceState({ isChangingStyle: false }, { history: "ignore" });
-        }, 2e3);
+        }, 1e3);
       }
     }
     return this;
@@ -3165,11 +3170,14 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
     if (!assetId) return null;
     const asset = this.getAsset(assetId);
     if (!asset) return null;
-    const { screenScale = 1, shouldResolveToOriginal = false } = context;
+    const {
+      screenScale = 1,
+      shouldResolveToOriginal = false,
+      dpr = this.getInstanceState().devicePixelRatio
+    } = context;
     const zoomStepFunction = (zoom) => Math.pow(2, Math.ceil(Math.log2(zoom)));
-    const steppedScreenScale = Math.max(0.125, zoomStepFunction(screenScale));
+    const steppedScreenScale = zoomStepFunction(screenScale);
     const networkEffectiveType = "connection" in navigator ? navigator.connection.effectiveType : null;
-    const dpr = this.getInstanceState().devicePixelRatio;
     return await this.store.props.assets.resolve(asset, {
       screenScale: screenScale || 1,
       steppedScreenScale,
@@ -5090,6 +5098,7 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
         scale = new import_Vec.Vec(Math.sign(scale.x) * Math.abs(scale.y), scale.y);
       }
     }
+    let didResize = false;
     if (util.onResize && util.canResize(initialShape)) {
       const newPagePoint = this._scalePagePoint(
         import_Mat.Mat.applyToPoint(pageTransform, new import_Vec.Vec(0, 0)),
@@ -5114,24 +5123,28 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
           util.onResizeStart?.(initialShape) ?? void 0
         );
       }
+      const resizedShape = util.onResize(
+        { ...initialShape, x, y },
+        {
+          newPoint: newLocalPoint,
+          handle: opts.dragHandle ?? "bottom_right",
+          // don't set isSingle to true for children
+          mode: opts.mode ?? "scale_shape",
+          scaleX: myScale.x,
+          scaleY: myScale.y,
+          initialBounds,
+          initialShape
+        }
+      );
+      if (resizedShape) {
+        didResize = true;
+      }
       workingShape = applyPartialToRecordWithProps(workingShape, {
         id,
         type: initialShape.type,
         x: newLocalPoint.x,
         y: newLocalPoint.y,
-        ...util.onResize(
-          { ...initialShape, x, y },
-          {
-            newPoint: newLocalPoint,
-            handle: opts.dragHandle ?? "bottom_right",
-            // don't set isSingle to true for children
-            mode: opts.mode ?? "scale_shape",
-            scaleX: myScale.x,
-            scaleY: myScale.y,
-            initialBounds,
-            initialShape
-          }
-        )
+        ...resizedShape
       });
       if (!opts.skipStartAndEndCallbacks) {
         workingShape = applyPartialToRecordWithProps(
@@ -5140,7 +5153,8 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
         );
       }
       this.updateShapes([workingShape]);
-    } else {
+    }
+    if (!didResize) {
       const initialPageCenter = import_Mat.Mat.applyToPoint(pageTransform, initialBounds.center);
       const newPageCenter = this._scalePagePoint(
         initialPageCenter,
@@ -6287,7 +6301,7 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
    * @public
    */
   async getSvgElement(shapes, opts = {}) {
-    const ids = typeof shapes[0] === "string" ? shapes : shapes.map((s) => s.id);
+    const ids = shapes.length === 0 ? this.getCurrentPageShapeIdsSorted() : typeof shapes[0] === "string" ? shapes : shapes.map((s) => s.id);
     if (ids.length === 0) return void 0;
     return (0, import_exportToSvg.exportToSvg)(this, ids, opts);
   }
@@ -6317,6 +6331,55 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
     if (!result) return void 0;
     return result.svg;
   }
+  /**
+   * Get an exported image of the given shapes.
+   *
+   * @param shapes - The shapes (or shape ids) to export.
+   * @param opts - Options for the export.
+   *
+   * @returns A blob of the image.
+   * @public
+   */
+  async toImage(shapes, opts = {}) {
+    const withDefaults = {
+      format: "png",
+      scale: 1,
+      pixelRatio: opts.format === "svg" ? void 0 : 2,
+      ...opts
+    };
+    const result = await this.getSvgString(shapes, withDefaults);
+    if (!result) throw new Error("Could not create SVG");
+    switch (withDefaults.format) {
+      case "svg":
+        return {
+          blob: new Blob([result.svg], { type: "text/plain" }),
+          width: result.width,
+          height: result.height
+        };
+      case "jpeg":
+      case "png":
+      case "webp": {
+        const blob = await (0, import_getSvgAsImage.getSvgAsImage)(result.svg, {
+          type: withDefaults.format,
+          quality: withDefaults.quality,
+          pixelRatio: withDefaults.pixelRatio,
+          width: result.width,
+          height: result.height
+        });
+        if (!blob) {
+          throw new Error("Could not construct image.");
+        }
+        return {
+          blob,
+          width: result.width,
+          height: result.height
+        };
+      }
+      default: {
+        (0, import_utils.exhaustiveSwitchError)(withDefaults.format);
+      }
+    }
+  }
   /**
    * Update the input points from a pointer, pinch, or wheel event.
    *
@@ -6810,6 +6873,7 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
   }
   _flushEventForTick(info) {
     if (this.getCrashingError()) return this;
+    this.emit("before-event", info);
     const { inputs } = this;
     const { type } = info;
     if (info.type === "misc") {