From f70be1e415f401ac243f368a2a67af73087e988b Mon Sep 17 00:00:00 2001
From: psychedelicious <4822129+psychedelicious@users.noreply.github.com>
Date: Fri, 6 Jun 2025 13:50:13 +1000
Subject: [PATCH] feat(ui): animate stage fit operations (e.g. fit layers to
 stage)

---
 .../controlLayers/konva/CanvasStageModule.ts      | 15 ++++++++++++---
 1 file changed, 12 insertions(+), 3 deletions(-)

diff --git a/invokeai/frontend/web/src/features/controlLayers/konva/CanvasStageModule.ts b/invokeai/frontend/web/src/features/controlLayers/konva/CanvasStageModule.ts
index d91fc68d6e..1e7c9aebf0 100644
--- a/invokeai/frontend/web/src/features/controlLayers/konva/CanvasStageModule.ts
+++ b/invokeai/frontend/web/src/features/controlLayers/konva/CanvasStageModule.ts
@@ -230,14 +230,23 @@ export class CanvasStageModule extends CanvasModuleBase {
     this._intendedScale = scale;
     this._activeSnapPoint = null;
 
-    this.konva.stage.setAttrs({
+    const tween = new Konva.Tween({
+      node: this.konva.stage,
+      duration: 0.15,
       x,
       y,
       scaleX: scale,
       scaleY: scale,
+      easing: Konva.Easings.EaseInOut,
+      onUpdate: () => {
+        this.syncStageAttrs();
+      },
+      onFinish: () => {
+        this.syncStageAttrs();
+        tween.destroy();
+      },
     });
-
-    this.syncStageAttrs({ x, y, scale });
+    tween.play();
   };
 
   /**