From c127c3734ba42cc5b77bd4636c436c9d508f54f9 Mon Sep 17 00:00:00 2001
From: "Michael S. Scherotter" <mscherotter@gmail.com>
Date: Tue, 20 May 2025 23:27:57 -0700
Subject: [PATCH] Fixed a bug where a rotated text or image did not translate
 correctly. (#1055)

---
 packages/svgcanvas/core/recalculate.js | 37 +++++++++++++++++++-------
 1 file changed, 28 insertions(+), 9 deletions(-)

diff --git a/packages/svgcanvas/core/recalculate.js b/packages/svgcanvas/core/recalculate.js
index ae4a9648..ccbd1d94 100644
--- a/packages/svgcanvas/core/recalculate.js
+++ b/packages/svgcanvas/core/recalculate.js
@@ -236,16 +236,35 @@ export const recalculateDimensions = selected => {
     // Handle rotation transformations
     const angle = getRotationAngle(selected)
     if (angle) {
-      // Include x and y in the rotation center calculation
-      oldcenter = {
-        x: box.x + box.width / 2 + x,
-        y: box.y + box.height / 2 + y
+      if (selected.localName === 'image') {
+        // Use the center of the image as the rotation center
+        const xAttr = convertToNum('x', selected.getAttribute('x') || '0')
+        const yAttr = convertToNum('y', selected.getAttribute('y') || '0')
+        const width = convertToNum('width', selected.getAttribute('width') || '0')
+        const height = convertToNum('height', selected.getAttribute('height') || '0')
+        const cx = xAttr + width / 2
+        const cy = yAttr + height / 2
+        oldcenter = { x: cx, y: cy }
+        const transform = transformListToTransform(tlist).matrix
+        newcenter = transformPoint(cx, cy, transform)
+      } else if (selected.localName === 'text') {
+        // Use the center of the bounding box as the rotation center for text
+        const cx = box.x + box.width / 2
+        const cy = box.y + box.height / 2
+        oldcenter = { x: cx, y: cy }
+        newcenter = transformPoint(cx, cy, transformListToTransform(tlist).matrix)
+      } else {
+        // Include x and y in the rotation center calculation for other elements
+        oldcenter = {
+          x: box.x + box.width / 2 + x,
+          y: box.y + box.height / 2 + y
+        }
+        newcenter = transformPoint(
+          box.x + box.width / 2 + x,
+          box.y + box.height / 2 + y,
+          transformListToTransform(tlist).matrix
+        )
       }
-      newcenter = transformPoint(
-        box.x + box.width / 2 + x,
-        box.y + box.height / 2 + y,
-        transformListToTransform(tlist).matrix
-      )
 
       // Remove the rotation transform from the list
       for (let i = 0; i < tlist.numberOfItems; ++i) {