From f09e4655604dd8d1e9f58d20c4daaa18a63bc94e Mon Sep 17 00:00:00 2001 From: Ryan Di Date: Wed, 28 Jan 2026 11:58:06 +1100 Subject: [PATCH] fix: text corner resizing only takes delta y --- packages/element/src/resizeElements.ts | 17 ++++++++++++++--- packages/element/tests/resize.test.tsx | 18 ++++++++++++++++++ 2 files changed, 32 insertions(+), 3 deletions(-) diff --git a/packages/element/src/resizeElements.ts b/packages/element/src/resizeElements.ts index bb9094a5d2..92044c30f3 100644 --- a/packages/element/src/resizeElements.ts +++ b/packages/element/src/resizeElements.ts @@ -318,7 +318,18 @@ export const resizeSingleTextElement = ( ) => { const elementsMap = scene.getNonDeletedElementsMap(); - const metricsWidth = element.width * (nextHeight / element.height); + const isCornerHandle = transformHandleType.length === 2; + let metricsWidth = element.width * (nextHeight / element.height); + let metricsHeight = nextHeight; + + if (isCornerHandle) { + const widthRatio = Math.abs(nextWidth) / element.width; + const heightRatio = Math.abs(nextHeight) / element.height; + const ratio = Math.max(widthRatio, heightRatio); + const sign = Math.sign(nextHeight) || 1; + metricsWidth = element.width * ratio * sign; + metricsHeight = element.height * ratio * sign; + } const metrics = measureFontSizeFromWidth(element, elementsMap, metricsWidth); if (metrics === null) { @@ -333,7 +344,7 @@ export const resizeSingleTextElement = ( origElement.width, origElement.height, metricsWidth, - nextHeight, + metricsHeight, origElement.angle, transformHandleType, false, @@ -343,7 +354,7 @@ export const resizeSingleTextElement = ( scene.mutateElement(element, { fontSize: metrics.size, width: metricsWidth, - height: nextHeight, + height: metricsHeight, x: newOrigin.x, y: newOrigin.y, }); diff --git a/packages/element/tests/resize.test.tsx b/packages/element/tests/resize.test.tsx index b51d537e37..7ff17fc2a4 100644 --- a/packages/element/tests/resize.test.tsx +++ b/packages/element/tests/resize.test.tsx @@ -563,6 +563,24 @@ describe("text element", () => { expect(text.fontSize).toBeCloseTo(fontSize * scale); }); + it("resizes proportionally using horizontal delta from corner handles", async () => { + const text = UI.createElement("text"); + await UI.editText(text, "hello\nworld"); + const { x, y, width, height, fontSize } = text; + const deltaX = width; + const deltaY = 0; + const scale = (width + deltaX) / width; + + UI.resize(text, "se", [deltaX, deltaY]); + + expect(text.x).toBeCloseTo(x); + expect(text.y).toBeCloseTo(y); + expect(text.width).toBeCloseTo(width * scale); + expect(text.height).toBeCloseTo(height * scale); + expect(text.angle).toBeCloseTo(0); + expect(text.fontSize).toBeCloseTo(fontSize * scale); + }); + // TODO enable this test after adding single text element flipping it.skip("flips while resizing", async () => { const text = UI.createElement("text");