From 0cf8d05c1e0c3c450dd49b4c12bcd7999cef5fdd Mon Sep 17 00:00:00 2001
From: thePR0M3TH3AN <53631862+PR0M3TH3AN@users.noreply.github.com>
Date: Wed, 27 May 2026 19:09:03 -0400
Subject: [PATCH] Resize: corner handles default to independent axes (Shift =
 lock aspect)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Corner handles used to lock the aspect ratio whenever the sidebar 🔒
toggle was on (the default). Result: dragging the corner horizontally
a lot and vertically a little still scaled both axes by the
horizontal-driven factor — width and height grew at the SAME rate
regardless of the drag vector.

Switch to the Figma / Photoshop / Keynote convention:

- Corner handle drag → axes are independent. Each axis follows its
  own drag delta. Drag right-and-a-bit-down → width grows a lot,
  height grows a little, matching the cursor exactly.
- Hold Shift while dragging the corner → lock the aspect ratio. Same
  math as before (the larger-magnitude axis sets the scale, both
  axes get it).

The sidebar 🔒 toggle still governs typed W / H input cascades — so
typing Width:5 with the lock on still updates Height proportionally.
Only the visual corner-drag behaviour changed.

Same fix applies to:
- startLayerResize (single-layer corner handles).
- startLayerSelectionResize (multi-select bounding-box corner
  handles).

Edge handles (n/s/e/w) are unchanged — they're always single-axis.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
---
 src/index.html | 14 ++++++++++----
 1 file changed, 10 insertions(+), 4 deletions(-)

diff --git a/src/index.html b/src/index.html
index 9dfa9f7..04655f2 100644
--- a/src/index.html
+++ b/src/index.html
@@ -14336,7 +14336,11 @@
           nextY = fixedY - nextH;
         }
         const isCorner = drivesW && drivesH;
-        if (_aspectLocked && isCorner) {
+        // Corner-handle resize defaults to INDEPENDENT axes — each axis
+        // scales by its own drag delta. Hold Shift while dragging to lock
+        // the aspect ratio (matches Figma / Photoshop / Keynote). The
+        // sidebar 🔒 toggle still governs typed W / H input cascades.
+        if (moveEvent.shiftKey && isCorner) {
           const sxRaw = nextW / startBounds.w;
           const syRaw = nextH / startBounds.h;
           const scale = Math.max(MIN / startBounds.w, MIN / startBounds.h, Math.abs(sxRaw) >= Math.abs(syRaw) ? sxRaw : syRaw);
@@ -14425,11 +14429,13 @@
         const dh = drivesH ? (dir.includes('s') ? ldy : -ldy) : 0;
 
         // Edge handles are always single-axis — they resize in their one
-        // direction only. Aspect-lock applies to corner handles alone, so
-        // grabbing an edge never balloons the box on the other axis.
+        // direction only. Corner handles default to INDEPENDENT axes —
+        // each axis follows its own drag delta. Hold Shift to lock the
+        // aspect ratio (Figma / Photoshop / Keynote convention). The
+        // sidebar 🔒 toggle still governs typed W / H input cascades.
         const isCorner = drivesW && drivesH;
         let newW, newH;
-        if (_aspectLocked && isCorner && w0 > 0 && h0 > 0) {
+        if (e.shiftKey && isCorner && w0 > 0 && h0 > 0) {
           const sw = dw / w0;
           const sh = dh / h0;
           const s = Math.abs(sw) >= Math.abs(sh) ? sw : sh;