@pooder/kit 5.0.1 → 5.0.3

package/dist/index.js

@@ -3005,6 +3005,8 @@ var FeatureTool = class {
     this.workingFeatures = [];
     this.isUpdatingConfig = false;
     this.isToolActive = false;
+    this.isFeatureSessionActive = false;
+    this.sessionOriginalFeatures = null;
     this.hasWorkingChanges = false;
     this.handleMoving = null;
     this.handleModified = null;
@@ -3012,6 +3014,9 @@ var FeatureTool = class {
     this.currentGeometry = null;
     this.onToolActivated = (event) => {
       this.isToolActive = event.id === this.id;
+      if (!this.isToolActive) {
+        this.restoreSessionFeaturesToConfig();
+      }
       this.updateVisibility();
     };
     if (options) {
@@ -3035,6 +3040,7 @@ var FeatureTool = class {
       configService.onAnyChange((e) => {
         if (this.isUpdatingConfig) return;
         if (e.key === "dieline.features") {
+          if (this.isFeatureSessionActive) return;
           const next = e.value || [];
           this.workingFeatures = this.cloneFeatures(next);
           this.hasWorkingChanges = false;
@@ -3054,6 +3060,7 @@ var FeatureTool = class {
   deactivate(context) {
     var _a;
     context.eventBus.off("tool:activated", this.onToolActivated);
+    this.restoreSessionFeaturesToConfig();
     (_a = this.dirtyTrackerDisposable) == null ? void 0 : _a.dispose();
     this.dirtyTrackerDisposable = void 0;
     this.teardown();
@@ -3085,9 +3092,9 @@ var FeatureTool = class {
           name: "Feature",
           interaction: "session",
           commands: {
-            begin: "resetWorkingFeatures",
+            begin: "beginFeatureSession",
             commit: "completeFeatures",
-            rollback: "resetWorkingFeatures"
+            rollback: "rollbackFeatureSession"
           },
           session: {
             autoBegin: false,
@@ -3096,6 +3103,25 @@ var FeatureTool = class {
         }
       ],
       [import_core4.ContributionPointIds.COMMANDS]: [
+        {
+          command: "beginFeatureSession",
+          title: "Begin Feature Session",
+          handler: async () => {
+            if (this.isFeatureSessionActive) {
+              return { ok: true };
+            }
+            const original = this.getCommittedFeatures();
+            this.sessionOriginalFeatures = this.cloneFeatures(original);
+            this.isFeatureSessionActive = true;
+            await this.refreshGeometry();
+            this.setWorkingFeatures(this.cloneFeatures(original));
+            this.hasWorkingChanges = false;
+            this.redraw();
+            this.emitWorkingChange();
+            this.updateCommittedFeatures([]);
+            return { ok: true };
+          }
+        },
         {
           command: "addFeature",
           title: "Add Edge Feature",
@@ -3148,19 +3174,27 @@ var FeatureTool = class {
           }
         },
         {
-          command: "resetWorkingFeatures",
-          title: "Reset Working Features",
+          command: "rollbackFeatureSession",
+          title: "Rollback Feature Session",
           handler: async () => {
-            var _a;
-            const configService = (_a = this.context) == null ? void 0 : _a.services.get(
-              "ConfigurationService"
+            const original = this.cloneFeatures(
+              this.sessionOriginalFeatures || this.getCommittedFeatures()
             );
-            const next = (configService == null ? void 0 : configService.get("dieline.features", [])) || [];
             await this.refreshGeometry();
-            this.setWorkingFeatures(this.cloneFeatures(next));
+            this.setWorkingFeatures(original);
             this.hasWorkingChanges = false;
             this.redraw();
             this.emitWorkingChange();
+            this.updateCommittedFeatures(original);
+            this.clearFeatureSessionState();
+            return { ok: true };
+          }
+        },
+        {
+          command: "resetWorkingFeatures",
+          title: "Reset Working Features",
+          handler: async () => {
+            await this.resetWorkingFeaturesFromSource();
             return { ok: true };
           }
         },
@@ -3184,6 +3218,37 @@ var FeatureTool = class {
   cloneFeatures(features) {
     return JSON.parse(JSON.stringify(features || []));
   }
+  getConfigService() {
+    var _a;
+    return (_a = this.context) == null ? void 0 : _a.services.get("ConfigurationService");
+  }
+  getCommittedFeatures() {
+    const configService = this.getConfigService();
+    const committed = (configService == null ? void 0 : configService.get("dieline.features", [])) || [];
+    return this.cloneFeatures(committed);
+  }
+  updateCommittedFeatures(next) {
+    const configService = this.getConfigService();
+    if (!configService) return;
+    this.isUpdatingConfig = true;
+    try {
+      configService.update("dieline.features", next);
+    } finally {
+      this.isUpdatingConfig = false;
+    }
+  }
+  clearFeatureSessionState() {
+    this.isFeatureSessionActive = false;
+    this.sessionOriginalFeatures = null;
+  }
+  restoreSessionFeaturesToConfig() {
+    if (!this.isFeatureSessionActive) return;
+    const original = this.cloneFeatures(
+      this.sessionOriginalFeatures || this.getCommittedFeatures()
+    );
+    this.updateCommittedFeatures(original);
+    this.clearFeatureSessionState();
+  }
   emitWorkingChange() {
     var _a;
     (_a = this.context) == null ? void 0 : _a.eventBus.emit("feature:working:change", {
@@ -3202,6 +3267,16 @@ var FeatureTool = class {
     } catch (e) {
     }
   }
+  async resetWorkingFeaturesFromSource() {
+    const next = this.cloneFeatures(
+      this.isFeatureSessionActive && this.sessionOriginalFeatures ? this.sessionOriginalFeatures : this.getCommittedFeatures()
+    );
+    await this.refreshGeometry();
+    this.setWorkingFeatures(next);
+    this.hasWorkingChanges = false;
+    this.redraw();
+    this.emitWorkingChange();
+  }
   setWorkingFeatures(next) {
     this.workingFeatures = next;
   }
@@ -3258,12 +3333,7 @@ var FeatureTool = class {
       this.workingFeatures,
       { dielineWidth, dielineHeight },
       (next) => {
-        this.isUpdatingConfig = true;
-        try {
-          configService.update("dieline.features", next);
-        } finally {
-          this.isUpdatingConfig = false;
-        }
+        this.updateCommittedFeatures(next);
         this.workingFeatures = this.cloneFeatures(next);
         this.emitWorkingChange();
       }
@@ -3275,6 +3345,7 @@ var FeatureTool = class {
       };
     }
     this.hasWorkingChanges = false;
+    this.clearFeatureSessionState();
     this.redraw();
     return { ok: true };
   }
@@ -3847,10 +3918,7 @@ var ImageTool = class {
     context.eventBus.on("selection:created", this.onSelectionChanged);
     context.eventBus.on("selection:updated", this.onSelectionChanged);
     context.eventBus.on("selection:cleared", this.onSelectionCleared);
-    context.eventBus.on(
-      "scene:layout:change",
-      this.onSceneLayoutChanged
-    );
+    context.eventBus.on("scene:layout:change", this.onSceneLayoutChanged);
     const configService = context.services.get(
       "ConfigurationService"
     );
@@ -3890,10 +3958,7 @@ var ImageTool = class {
     context.eventBus.off("selection:created", this.onSelectionChanged);
     context.eventBus.off("selection:updated", this.onSelectionChanged);
     context.eventBus.off("selection:cleared", this.onSelectionCleared);
-    context.eventBus.off(
-      "scene:layout:change",
-      this.onSceneLayoutChanged
-    );
+    context.eventBus.off("scene:layout:change", this.onSceneLayoutChanged);
     (_a = this.dirtyTrackerDisposable) == null ? void 0 : _a.dispose();
     this.dirtyTrackerDisposable = void 0;
     this.clearRenderedImages();
@@ -4002,7 +4067,7 @@ var ImageTool = class {
           id: "image.frame.outerBackground",
           type: "color",
           label: "Image Frame Outer Background",
-          default: "rgba(0,0,0,0.18)"
+          default: "#f5f5f5"
         }
       ],
       [import_core5.ContributionPointIds.COMMANDS]: [
@@ -4045,6 +4110,7 @@ var ImageTool = class {
             this.workingItems = this.cloneItems(this.items);
             this.hasWorkingChanges = false;
             this.updateImages();
+            this.emitWorkingChange();
           }
         },
         {
@@ -4159,6 +4225,13 @@ var ImageTool = class {
   cloneItems(items) {
     return this.normalizeItems((items || []).map((i) => ({ ...i })));
   }
+  emitWorkingChange(changedId = null) {
+    var _a;
+    (_a = this.context) == null ? void 0 : _a.eventBus.emit("image:working:change", {
+      changedId,
+      items: this.cloneItems(this.workingItems)
+    });
+  }
   generateId() {
     return Math.random().toString(36).substring(2, 9);
   }
@@ -4227,6 +4300,7 @@ var ImageTool = class {
     if (this.workingItems.some((existing) => existing.id === item.id)) return;
     this.workingItems = this.cloneItems([...this.workingItems, item]);
     this.updateImages();
+    this.emitWorkingChange(item.id);
   }
   async updateImage(id, updates, options = {}) {
     this.syncToolActiveFromWorkbench();
@@ -4410,10 +4484,7 @@ var ImageTool = class {
         "image.frame.innerBackground",
         "rgba(0,0,0,0)"
       ) || "rgba(0,0,0,0)",
-      outerBackground: this.getConfig(
-        "image.frame.outerBackground",
-        "rgba(0,0,0,0.18)"
-      ) || "rgba(0,0,0,0.18)"
+      outerBackground: "#f5f5f5"
     };
   }
   resolveRenderImageState(item) {
@@ -4557,10 +4628,21 @@ var ImageTool = class {
     const canvasW = this.canvasService.canvas.width || 0;
     const canvasH = this.canvasService.canvas.height || 0;
     const visual = this.getFrameVisualConfig();
-    const topH = Math.max(0, frame.top);
-    const bottomH = Math.max(0, canvasH - (frame.top + frame.height));
-    const leftW = Math.max(0, frame.left);
-    const rightW = Math.max(0, canvasW - (frame.left + frame.width));
+    const frameLeft = Math.max(0, Math.min(canvasW, frame.left));
+    const frameTop = Math.max(0, Math.min(canvasH, frame.top));
+    const frameRight = Math.max(
+      frameLeft,
+      Math.min(canvasW, frame.left + frame.width)
+    );
+    const frameBottom = Math.max(
+      frameTop,
+      Math.min(canvasH, frame.top + frame.height)
+    );
+    const visibleFrameH = Math.max(0, frameBottom - frameTop);
+    const topH = frameTop;
+    const bottomH = Math.max(0, canvasH - frameBottom);
+    const leftW = frameLeft;
+    const rightW = Math.max(0, canvasW - frameRight);
     const mask = [
       {
         id: "image.cropMask.top",
@@ -4584,7 +4666,7 @@ var ImageTool = class {
         data: { id: "image.cropMask.bottom", zIndex: 2 },
         props: {
           left: canvasW / 2,
-          top: frame.top + frame.height + bottomH / 2,
+          top: frameBottom + bottomH / 2,
           width: canvasW,
           height: bottomH,
           originX: "center",
@@ -4600,9 +4682,9 @@ var ImageTool = class {
         data: { id: "image.cropMask.left", zIndex: 3 },
         props: {
           left: leftW / 2,
-          top: frame.top + frame.height / 2,
+          top: frameTop + visibleFrameH / 2,
           width: leftW,
-          height: frame.height,
+          height: visibleFrameH,
           originX: "center",
           originY: "center",
           fill: visual.outerBackground,
@@ -4615,10 +4697,10 @@ var ImageTool = class {
         type: "rect",
         data: { id: "image.cropMask.right", zIndex: 4 },
         props: {
-          left: frame.left + frame.width + rightW / 2,
-          top: frame.top + frame.height / 2,
+          left: frameRight + rightW / 2,
+          top: frameTop + visibleFrameH / 2,
           width: rightW,
-          height: frame.height,
+          height: visibleFrameH,
           originX: "center",
           originY: "center",
           fill: visual.outerBackground,
@@ -4708,6 +4790,7 @@ var ImageTool = class {
     if (this.isToolActive) {
       this.updateImages();
     }
+    this.emitWorkingChange(id);
   }
   async updateImageInConfig(id, updates) {
     var _a, _b, _c, _d;
@@ -4788,6 +4871,7 @@ var ImageTool = class {
     this.isImageSelectionActive = true;
     this.focusedImageId = id;
     this.updateImages();
+    this.emitWorkingChange(id);
   }
   focusImageSelection(id) {
     if (!this.canvasService) return;
@@ -4880,6 +4964,7 @@ var ImageTool = class {
     this.hasWorkingChanges = false;
     this.workingItems = this.cloneItems(next);
     this.updateConfig(next);
+    this.emitWorkingChange(focusId);
     if (focusId) {
       this.focusedImageId = focusId;
       this.isImageSelectionActive = true;

package/dist/index.mjs

@@ -2954,6 +2954,8 @@ var FeatureTool = class {
     this.workingFeatures = [];
     this.isUpdatingConfig = false;
     this.isToolActive = false;
+    this.isFeatureSessionActive = false;
+    this.sessionOriginalFeatures = null;
     this.hasWorkingChanges = false;
     this.handleMoving = null;
     this.handleModified = null;
@@ -2961,6 +2963,9 @@ var FeatureTool = class {
     this.currentGeometry = null;
     this.onToolActivated = (event) => {
       this.isToolActive = event.id === this.id;
+      if (!this.isToolActive) {
+        this.restoreSessionFeaturesToConfig();
+      }
       this.updateVisibility();
     };
     if (options) {
@@ -2984,6 +2989,7 @@ var FeatureTool = class {
       configService.onAnyChange((e) => {
         if (this.isUpdatingConfig) return;
         if (e.key === "dieline.features") {
+          if (this.isFeatureSessionActive) return;
           const next = e.value || [];
           this.workingFeatures = this.cloneFeatures(next);
           this.hasWorkingChanges = false;
@@ -3003,6 +3009,7 @@ var FeatureTool = class {
   deactivate(context) {
     var _a;
     context.eventBus.off("tool:activated", this.onToolActivated);
+    this.restoreSessionFeaturesToConfig();
     (_a = this.dirtyTrackerDisposable) == null ? void 0 : _a.dispose();
     this.dirtyTrackerDisposable = void 0;
     this.teardown();
@@ -3034,9 +3041,9 @@ var FeatureTool = class {
           name: "Feature",
           interaction: "session",
           commands: {
-            begin: "resetWorkingFeatures",
+            begin: "beginFeatureSession",
             commit: "completeFeatures",
-            rollback: "resetWorkingFeatures"
+            rollback: "rollbackFeatureSession"
           },
           session: {
             autoBegin: false,
@@ -3045,6 +3052,25 @@ var FeatureTool = class {
         }
       ],
       [ContributionPointIds4.COMMANDS]: [
+        {
+          command: "beginFeatureSession",
+          title: "Begin Feature Session",
+          handler: async () => {
+            if (this.isFeatureSessionActive) {
+              return { ok: true };
+            }
+            const original = this.getCommittedFeatures();
+            this.sessionOriginalFeatures = this.cloneFeatures(original);
+            this.isFeatureSessionActive = true;
+            await this.refreshGeometry();
+            this.setWorkingFeatures(this.cloneFeatures(original));
+            this.hasWorkingChanges = false;
+            this.redraw();
+            this.emitWorkingChange();
+            this.updateCommittedFeatures([]);
+            return { ok: true };
+          }
+        },
         {
           command: "addFeature",
           title: "Add Edge Feature",
@@ -3097,19 +3123,27 @@ var FeatureTool = class {
           }
         },
         {
-          command: "resetWorkingFeatures",
-          title: "Reset Working Features",
+          command: "rollbackFeatureSession",
+          title: "Rollback Feature Session",
           handler: async () => {
-            var _a;
-            const configService = (_a = this.context) == null ? void 0 : _a.services.get(
-              "ConfigurationService"
+            const original = this.cloneFeatures(
+              this.sessionOriginalFeatures || this.getCommittedFeatures()
             );
-            const next = (configService == null ? void 0 : configService.get("dieline.features", [])) || [];
             await this.refreshGeometry();
-            this.setWorkingFeatures(this.cloneFeatures(next));
+            this.setWorkingFeatures(original);
             this.hasWorkingChanges = false;
             this.redraw();
             this.emitWorkingChange();
+            this.updateCommittedFeatures(original);
+            this.clearFeatureSessionState();
+            return { ok: true };
+          }
+        },
+        {
+          command: "resetWorkingFeatures",
+          title: "Reset Working Features",
+          handler: async () => {
+            await this.resetWorkingFeaturesFromSource();
             return { ok: true };
           }
         },
@@ -3133,6 +3167,37 @@ var FeatureTool = class {
   cloneFeatures(features) {
     return JSON.parse(JSON.stringify(features || []));
   }
+  getConfigService() {
+    var _a;
+    return (_a = this.context) == null ? void 0 : _a.services.get("ConfigurationService");
+  }
+  getCommittedFeatures() {
+    const configService = this.getConfigService();
+    const committed = (configService == null ? void 0 : configService.get("dieline.features", [])) || [];
+    return this.cloneFeatures(committed);
+  }
+  updateCommittedFeatures(next) {
+    const configService = this.getConfigService();
+    if (!configService) return;
+    this.isUpdatingConfig = true;
+    try {
+      configService.update("dieline.features", next);
+    } finally {
+      this.isUpdatingConfig = false;
+    }
+  }
+  clearFeatureSessionState() {
+    this.isFeatureSessionActive = false;
+    this.sessionOriginalFeatures = null;
+  }
+  restoreSessionFeaturesToConfig() {
+    if (!this.isFeatureSessionActive) return;
+    const original = this.cloneFeatures(
+      this.sessionOriginalFeatures || this.getCommittedFeatures()
+    );
+    this.updateCommittedFeatures(original);
+    this.clearFeatureSessionState();
+  }
   emitWorkingChange() {
     var _a;
     (_a = this.context) == null ? void 0 : _a.eventBus.emit("feature:working:change", {
@@ -3151,6 +3216,16 @@ var FeatureTool = class {
     } catch (e) {
     }
   }
+  async resetWorkingFeaturesFromSource() {
+    const next = this.cloneFeatures(
+      this.isFeatureSessionActive && this.sessionOriginalFeatures ? this.sessionOriginalFeatures : this.getCommittedFeatures()
+    );
+    await this.refreshGeometry();
+    this.setWorkingFeatures(next);
+    this.hasWorkingChanges = false;
+    this.redraw();
+    this.emitWorkingChange();
+  }
   setWorkingFeatures(next) {
     this.workingFeatures = next;
   }
@@ -3207,12 +3282,7 @@ var FeatureTool = class {
       this.workingFeatures,
       { dielineWidth, dielineHeight },
       (next) => {
-        this.isUpdatingConfig = true;
-        try {
-          configService.update("dieline.features", next);
-        } finally {
-          this.isUpdatingConfig = false;
-        }
+        this.updateCommittedFeatures(next);
         this.workingFeatures = this.cloneFeatures(next);
         this.emitWorkingChange();
       }
@@ -3224,6 +3294,7 @@ var FeatureTool = class {
       };
     }
     this.hasWorkingChanges = false;
+    this.clearFeatureSessionState();
     this.redraw();
     return { ok: true };
   }
@@ -3798,10 +3869,7 @@ var ImageTool = class {
     context.eventBus.on("selection:created", this.onSelectionChanged);
     context.eventBus.on("selection:updated", this.onSelectionChanged);
     context.eventBus.on("selection:cleared", this.onSelectionCleared);
-    context.eventBus.on(
-      "scene:layout:change",
-      this.onSceneLayoutChanged
-    );
+    context.eventBus.on("scene:layout:change", this.onSceneLayoutChanged);
     const configService = context.services.get(
       "ConfigurationService"
     );
@@ -3841,10 +3909,7 @@ var ImageTool = class {
     context.eventBus.off("selection:created", this.onSelectionChanged);
     context.eventBus.off("selection:updated", this.onSelectionChanged);
     context.eventBus.off("selection:cleared", this.onSelectionCleared);
-    context.eventBus.off(
-      "scene:layout:change",
-      this.onSceneLayoutChanged
-    );
+    context.eventBus.off("scene:layout:change", this.onSceneLayoutChanged);
     (_a = this.dirtyTrackerDisposable) == null ? void 0 : _a.dispose();
     this.dirtyTrackerDisposable = void 0;
     this.clearRenderedImages();
@@ -3953,7 +4018,7 @@ var ImageTool = class {
           id: "image.frame.outerBackground",
           type: "color",
           label: "Image Frame Outer Background",
-          default: "rgba(0,0,0,0.18)"
+          default: "#f5f5f5"
         }
       ],
       [ContributionPointIds5.COMMANDS]: [
@@ -3996,6 +4061,7 @@ var ImageTool = class {
             this.workingItems = this.cloneItems(this.items);
             this.hasWorkingChanges = false;
             this.updateImages();
+            this.emitWorkingChange();
           }
         },
         {
@@ -4110,6 +4176,13 @@ var ImageTool = class {
   cloneItems(items) {
     return this.normalizeItems((items || []).map((i) => ({ ...i })));
   }
+  emitWorkingChange(changedId = null) {
+    var _a;
+    (_a = this.context) == null ? void 0 : _a.eventBus.emit("image:working:change", {
+      changedId,
+      items: this.cloneItems(this.workingItems)
+    });
+  }
   generateId() {
     return Math.random().toString(36).substring(2, 9);
   }
@@ -4178,6 +4251,7 @@ var ImageTool = class {
     if (this.workingItems.some((existing) => existing.id === item.id)) return;
     this.workingItems = this.cloneItems([...this.workingItems, item]);
     this.updateImages();
+    this.emitWorkingChange(item.id);
   }
   async updateImage(id, updates, options = {}) {
     this.syncToolActiveFromWorkbench();
@@ -4361,10 +4435,7 @@ var ImageTool = class {
         "image.frame.innerBackground",
         "rgba(0,0,0,0)"
       ) || "rgba(0,0,0,0)",
-      outerBackground: this.getConfig(
-        "image.frame.outerBackground",
-        "rgba(0,0,0,0.18)"
-      ) || "rgba(0,0,0,0.18)"
+      outerBackground: "#f5f5f5"
     };
   }
   resolveRenderImageState(item) {
@@ -4508,10 +4579,21 @@ var ImageTool = class {
     const canvasW = this.canvasService.canvas.width || 0;
     const canvasH = this.canvasService.canvas.height || 0;
     const visual = this.getFrameVisualConfig();
-    const topH = Math.max(0, frame.top);
-    const bottomH = Math.max(0, canvasH - (frame.top + frame.height));
-    const leftW = Math.max(0, frame.left);
-    const rightW = Math.max(0, canvasW - (frame.left + frame.width));
+    const frameLeft = Math.max(0, Math.min(canvasW, frame.left));
+    const frameTop = Math.max(0, Math.min(canvasH, frame.top));
+    const frameRight = Math.max(
+      frameLeft,
+      Math.min(canvasW, frame.left + frame.width)
+    );
+    const frameBottom = Math.max(
+      frameTop,
+      Math.min(canvasH, frame.top + frame.height)
+    );
+    const visibleFrameH = Math.max(0, frameBottom - frameTop);
+    const topH = frameTop;
+    const bottomH = Math.max(0, canvasH - frameBottom);
+    const leftW = frameLeft;
+    const rightW = Math.max(0, canvasW - frameRight);
     const mask = [
       {
         id: "image.cropMask.top",
@@ -4535,7 +4617,7 @@ var ImageTool = class {
         data: { id: "image.cropMask.bottom", zIndex: 2 },
         props: {
           left: canvasW / 2,
-          top: frame.top + frame.height + bottomH / 2,
+          top: frameBottom + bottomH / 2,
           width: canvasW,
           height: bottomH,
           originX: "center",
@@ -4551,9 +4633,9 @@ var ImageTool = class {
         data: { id: "image.cropMask.left", zIndex: 3 },
         props: {
           left: leftW / 2,
-          top: frame.top + frame.height / 2,
+          top: frameTop + visibleFrameH / 2,
           width: leftW,
-          height: frame.height,
+          height: visibleFrameH,
           originX: "center",
           originY: "center",
           fill: visual.outerBackground,
@@ -4566,10 +4648,10 @@ var ImageTool = class {
         type: "rect",
         data: { id: "image.cropMask.right", zIndex: 4 },
         props: {
-          left: frame.left + frame.width + rightW / 2,
-          top: frame.top + frame.height / 2,
+          left: frameRight + rightW / 2,
+          top: frameTop + visibleFrameH / 2,
           width: rightW,
-          height: frame.height,
+          height: visibleFrameH,
           originX: "center",
           originY: "center",
           fill: visual.outerBackground,
@@ -4659,6 +4741,7 @@ var ImageTool = class {
     if (this.isToolActive) {
       this.updateImages();
     }
+    this.emitWorkingChange(id);
   }
   async updateImageInConfig(id, updates) {
     var _a, _b, _c, _d;
@@ -4739,6 +4822,7 @@ var ImageTool = class {
     this.isImageSelectionActive = true;
     this.focusedImageId = id;
     this.updateImages();
+    this.emitWorkingChange(id);
   }
   focusImageSelection(id) {
     if (!this.canvasService) return;
@@ -4831,6 +4915,7 @@ var ImageTool = class {
     this.hasWorkingChanges = false;
     this.workingItems = this.cloneItems(next);
     this.updateConfig(next);
+    this.emitWorkingChange(focusId);
     if (focusId) {
       this.focusedImageId = focusId;
       this.isImageSelectionActive = true;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pooder/kit",
-  "version": "5.0.1",
+  "version": "5.0.3",
   "description": "Standard plugins for Pooder editor",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",