microboard-temp 0.5.137 → 0.5.139

package/dist/cjs/browser.js

@@ -7302,6 +7302,20 @@ class TransformationCommand {
   getReverse() {
     const op = this.operation;
     switch (this.operation.method) {
+      case "applyMatrix": {
+        const op2 = this.operation;
+        return mapItemsByOperation(this.transformation, () => ({
+          ...op2,
+          matrix: {
+            translateX: -op2.matrix.translateX,
+            translateY: -op2.matrix.translateY,
+            scaleX: 1 / op2.matrix.scaleX,
+            scaleY: 1 / op2.matrix.scaleY,
+            shearX: 0,
+            shearY: 0
+          }
+        }));
+      }
       case "translateTo":
         return mapItemsByOperation(this.transformation, (transformation) => {
           return {
@@ -7383,7 +7397,19 @@ class TransformationCommand {
         return transformation.map((currTrans) => {
           const op2 = operation.items[currTrans.getId()];
           let reverseOp;
-          if (op2.method === "scaleByTranslateBy") {
+          if (op2.method === "applyMatrix") {
+            reverseOp = {
+              ...op2,
+              matrix: {
+                translateX: -op2.matrix.translateX,
+                translateY: -op2.matrix.translateY,
+                scaleX: 1 / op2.matrix.scaleX,
+                scaleY: 1 / op2.matrix.scaleY,
+                shearX: 0,
+                shearY: 0
+              }
+            };
+          } else if (op2.method === "scaleByTranslateBy") {
             reverseOp = {
               ...op2,
               scale: { x: 1 / op2.scale.x, y: 1 / op2.scale.y },
@@ -7554,6 +7580,10 @@ class Transformation {
   apply(op) {
     this.previous = this.matrix.copy();
     switch (op.method) {
+      case "applyMatrix":
+        this.matrix.scale(op.matrix.scaleX, op.matrix.scaleY);
+        this.matrix.translate(op.matrix.translateX, op.matrix.translateY);
+        break;
       case "translateTo":
         this.applyTranslateTo(op.x, op.y);
         break;
@@ -7614,7 +7644,10 @@ class Transformation {
     this.matrix.translate(translate.x, translate.y);
   }
   applyTransformMany(op) {
-    if (op.method === "scaleByTranslateBy") {
+    if (op.method === "applyMatrix") {
+      this.matrix.scale(op.matrix.scaleX, op.matrix.scaleY);
+      this.matrix.translate(op.matrix.translateX, op.matrix.translateY);
+    } else if (op.method === "scaleByTranslateBy") {
       this.applyScaleByTranslateBy(op.scale, op.translate);
     } else if (op.method === "scaleBy") {
       this.applyScaleBy(op.x, op.y);
@@ -7681,66 +7714,75 @@ class Transformation {
   getId() {
     return this.id;
   }
-  translateTo(x, y, timeStamp) {
-    if (!this.id) {}
+  emitMatrix(matrix, timeStamp) {
     this.emit({
       class: "Transformation",
-      method: "translateTo",
+      method: "applyMatrix",
       item: [this.id],
-      x,
-      y,
+      matrix,
       timeStamp
     });
   }
+  translateTo(x, y, timeStamp) {
+    if (!this.id) {}
+    this.emitMatrix({
+      translateX: x - this.matrix.translateX,
+      translateY: y - this.matrix.translateY,
+      scaleX: 1,
+      scaleY: 1,
+      shearX: 0,
+      shearY: 0
+    }, timeStamp);
+  }
   translateBy(x, y, timeStamp) {
     if (!this.id) {}
     if (x === 0 && y === 0) {
       return;
     }
-    this.emit({
-      class: "Transformation",
-      method: "translateBy",
-      item: [this.id],
-      x,
-      y,
-      timeStamp
-    });
+    this.emitMatrix({
+      translateX: x,
+      translateY: y,
+      scaleX: 1,
+      scaleY: 1,
+      shearX: 0,
+      shearY: 0
+    }, timeStamp);
   }
   scaleTo(x, y, timeStamp) {
-    this.emit({
-      class: "Transformation",
-      method: "scaleTo",
-      item: [this.id],
-      x,
-      y,
-      timeStamp
-    });
+    this.emitMatrix({
+      translateX: 0,
+      translateY: 0,
+      scaleX: x / this.matrix.scaleX,
+      scaleY: y / this.matrix.scaleY,
+      shearX: 0,
+      shearY: 0
+    }, timeStamp);
   }
   scaleBy(x, y, timeStamp) {
     if (x === 0 && y === 0) {
       return;
     }
-    this.emit({
-      class: "Transformation",
-      method: "scaleBy",
-      item: [this.id],
-      x,
-      y,
-      timeStamp
-    });
+    this.emitMatrix({
+      translateX: 0,
+      translateY: 0,
+      scaleX: x,
+      scaleY: y,
+      shearX: 0,
+      shearY: 0
+    }, timeStamp);
   }
   scaleByTranslateBy(scale, translate, timeStamp) {
     if (scale.x === 0 && scale.y === 0 && translate.x === 0 && translate.y === 0) {
       return;
     }
-    this.emit({
-      class: "Transformation",
-      method: "scaleByTranslateBy",
-      item: [this.id],
-      scale,
-      translate,
-      timeStamp
-    });
+    this.emitMatrix({
+      translateX: translate.x,
+      translateY: translate.y,
+      scaleX: scale.x,
+      scaleY: scale.y,
+      shearX: 0,
+      shearY: 0
+    }, timeStamp);
   }
   rotateTo(degree, timeStamp) {
     this.emit({
@@ -7760,27 +7802,28 @@ class Transformation {
       timeStamp
     });
   }
-  scaleToRelativeTo(x, y, point, timeStamp) {
-    this.emit({
-      class: "Transformation",
-      method: "scaleToRelativeTo",
-      item: [this.id],
-      x,
-      y,
-      point,
-      timeStamp
-    });
+  scaleToRelativeTo(x, y, _point, timeStamp) {
+    this.emitMatrix({
+      translateX: 0,
+      translateY: 0,
+      scaleX: x / this.matrix.scaleX,
+      scaleY: y / this.matrix.scaleY,
+      shearX: 0,
+      shearY: 0
+    }, timeStamp);
   }
   scaleByRelativeTo(x, y, point, timeStamp) {
-    this.emit({
-      class: "Transformation",
-      method: "scaleByRelativeTo",
-      item: [this.id],
-      x,
-      y,
-      point,
-      timeStamp
-    });
+    const { scaleX: sx0, scaleY: sy0, translateX: tx0, translateY: ty0 } = this.matrix;
+    const newSx = sx0 * x;
+    const newSy = sy0 * y;
+    this.emitMatrix({
+      translateX: -point.x * newSx + point.x - tx0,
+      translateY: -point.y * newSy + point.y - ty0,
+      scaleX: x,
+      scaleY: y,
+      shearX: 0,
+      shearY: 0
+    }, timeStamp);
   }
   setIsLocked(isLocked, timestamp) {
     if (isLocked) {
@@ -37079,7 +37122,11 @@ class Connector2 extends BaseItem {
     this.transformation.subject.subscribe((_sub, op) => {
       if (op.method === "transformMany") {
         const operation = op.items[this.getId()];
-        if (operation.method === "scaleByTranslateBy" && (operation.scale.x !== 1 || operation.scale.y !== 1)) {
+        if (operation.method === "applyMatrix") {
+          if (operation.matrix.scaleX !== 1 || operation.matrix.scaleY !== 1) {
+            this.scalePoints();
+          }
+        } else if (operation.method === "scaleByTranslateBy" && (operation.scale.x !== 1 || operation.scale.y !== 1)) {
           this.scalePoints();
         }
       }
@@ -51823,26 +51870,23 @@ function getRichTextTranslation({
     item.editor.setMaxWidth(item.getWidth() / item.transformation.getScale().x * matrix.scaleX);
     return {
       class: "Transformation",
-      method: "scaleByTranslateBy",
+      method: "applyMatrix",
       item: [item.getId()],
-      translate: { x: matrix.translateX, y: 0 },
-      scale: { x: matrix.scaleX, y: matrix.scaleX }
+      matrix: { translateX: matrix.translateX, translateY: 0, scaleX: matrix.scaleX, scaleY: matrix.scaleX, shearX: 0, shearY: 0 }
     };
   } else if (isHeight) {
     return {
       class: "Transformation",
-      method: "scaleByTranslateBy",
+      method: "applyMatrix",
       item: [item.getId()],
-      translate: { x: translateX, y: translateY },
-      scale: { x: 1, y: 1 }
+      matrix: { translateX, translateY, scaleX: 1, scaleY: 1, shearX: 0, shearY: 0 }
     };
   } else {
     return {
       class: "Transformation",
-      method: "scaleByTranslateBy",
+      method: "applyMatrix",
       item: [item.getId()],
-      translate: { x: translateX, y: translateY },
-      scale: { x: matrix.scaleX, y: matrix.scaleX }
+      matrix: { translateX, translateY, scaleX: matrix.scaleX, scaleY: matrix.scaleX, shearX: 0, shearY: 0 }
     };
   }
 }
@@ -51858,26 +51902,23 @@ function getAINodeTranslation({
     item.text.editor.setMaxWidth(item.text.getWidth() / item.transformation.getScale().x * matrix.scaleX);
     return {
       class: "Transformation",
-      method: "scaleByTranslateBy",
+      method: "applyMatrix",
       item: [item.getId()],
-      translate: { x: matrix.translateX, y: 0 },
-      scale: { x: matrix.scaleX, y: matrix.scaleX }
+      matrix: { translateX: matrix.translateX, translateY: 0, scaleX: matrix.scaleX, scaleY: matrix.scaleX, shearX: 0, shearY: 0 }
     };
   } else if (isHeight) {
     return {
       class: "Transformation",
-      method: "scaleByTranslateBy",
+      method: "applyMatrix",
       item: [item.getId()],
-      translate: { x: translateX, y: translateY },
-      scale: { x: 1, y: 1 }
+      matrix: { translateX, translateY, scaleX: 1, scaleY: 1, shearX: 0, shearY: 0 }
     };
   } else {
     return {
       class: "Transformation",
-      method: "scaleByTranslateBy",
+      method: "applyMatrix",
       item: [item.getId()],
-      translate: { x: translateX, y: translateY },
-      scale: { x: matrix.scaleX, y: matrix.scaleX }
+      matrix: { translateX, translateY, scaleX: matrix.scaleX, scaleY: matrix.scaleX, shearX: 0, shearY: 0 }
     };
   }
 }
@@ -51893,10 +51934,9 @@ function getItemTranslation({
   if (item instanceof Sticker && (isWidth || isHeight)) {
     return {
       class: "Transformation",
-      method: "scaleByTranslateBy",
+      method: "applyMatrix",
       item: [item.getId()],
-      translate: { x: translateX, y: translateY },
-      scale: { x: 1, y: 1 }
+      matrix: { translateX, translateY, scaleX: 1, scaleY: 1, shearX: 0, shearY: 0 }
     };
   } else {
     if (item instanceof Frame2 && item.getCanChangeRatio() && isShiftPressed && item.getFrameType() !== "Custom") {
@@ -51904,10 +51944,9 @@ function getItemTranslation({
     }
     return {
       class: "Transformation",
-      method: "scaleByTranslateBy",
+      method: "applyMatrix",
       item: [item.getId()],
-      translate: { x: translateX, y: translateY },
-      scale: { x: matrix.scaleX, y: matrix.scaleY }
+      matrix: { translateX, translateY, scaleX: matrix.scaleX, scaleY: matrix.scaleY, shearX: 0, shearY: 0 }
     };
   }
 }
@@ -53284,10 +53323,9 @@ class BoardSelection {
     function addItemToTranslation(itemId) {
       translation[itemId] = {
         class: "Transformation",
-        method: "scaleByTranslateBy",
+        method: "applyMatrix",
         item: [itemId],
-        scale: { x: 1, y: 1 },
-        translate: { x, y }
+        matrix: { translateX: x, translateY: y, scaleX: 1, scaleY: 1, shearX: 0, shearY: 0 }
       };
     }
     function tryToAddFrameChildrenToTranslation(selectedItem) {
@@ -53303,10 +53341,9 @@ class BoardSelection {
       for (const comment2 of followedComments) {
         translation[comment2.getId()] = {
           class: "Transformation",
-          method: "scaleByTranslateBy",
+          method: "applyMatrix",
           item: [comment2.getId()],
-          scale: { x: 1, y: 1 },
-          translate: { x, y }
+          matrix: { translateX: x, translateY: y, scaleX: 1, scaleY: 1, shearX: 0, shearY: 0 }
         };
       }
     };
@@ -54872,6 +54909,24 @@ function mergeTransformationOperations(opA, opB) {
   }
   const method = opA.method;
   switch (method) {
+    case "applyMatrix":
+      if (opB.method !== method) {
+        return;
+      }
+      return {
+        class: "Transformation",
+        method: "applyMatrix",
+        item: opA.item,
+        matrix: {
+          translateX: opA.matrix.translateX + opB.matrix.translateX,
+          translateY: opA.matrix.translateY + opB.matrix.translateY,
+          scaleX: opA.matrix.scaleX * opB.matrix.scaleX,
+          scaleY: opA.matrix.scaleY * opB.matrix.scaleY,
+          shearX: 0,
+          shearY: 0
+        },
+        timeStamp: opB.timeStamp
+      };
     case "translateBy":
       if (opB.method !== method) {
         return;
@@ -54983,7 +55038,23 @@ function mergeItems(opA, opB) {
     const items = {};
     Object.keys(opB.items).forEach((itemId) => {
       if (opA.items[itemId] !== undefined) {
-        if (opA.items[itemId].method === "scaleByTranslateBy") {
+        if (opA.items[itemId].method === "applyMatrix" && opB.items[itemId].method === "applyMatrix") {
+          const a2 = opA.items[itemId].matrix;
+          const b = opB.items[itemId].matrix;
+          items[itemId] = {
+            class: "Transformation",
+            method: "applyMatrix",
+            item: [itemId],
+            matrix: {
+              translateX: a2.translateX + b.translateX,
+              translateY: a2.translateY + b.translateY,
+              scaleX: a2.scaleX * b.scaleX,
+              scaleY: a2.scaleY * b.scaleY,
+              shearX: 0,
+              shearY: 0
+            }
+          };
+        } else if (opA.items[itemId].method === "scaleByTranslateBy") {
           const newTransformation = resolve2(opA.items[itemId].scale, opA.items[itemId].translate, opB.items[itemId]);
           items[itemId] = {
             class: "Transformation",