@pooder/vue 4.4.5 → 4.5.1

package/dist/index.es.js

@@ -1,89 +1,97 @@
-import { defineComponent as B, ref as T, onMounted as V, onUnmounted as O, createElementBlock as P, openBlock as k, createElementVNode as j, provide as $, createVNode as q } from "vue";
-import { Pooder as G } from "@pooder/core";
+import { defineComponent as F, ref as E, onMounted as J, onUnmounted as O, createElementBlock as N, openBlock as P, createElementVNode as K, provide as Q, createVNode as Z } from "vue";
+import { Pooder as ee } from "@pooder/core";
 export * from "@pooder/core";
-import { CanvasService as J, SceneLayoutService as K, BackgroundTool as Q, SizeTool as Z, ImageTool as ee, WhiteInkTool as te, DielineTool as ne, RulerTool as re, FeatureTool as oe } from "@pooder/kit";
+import { CanvasService as te, SceneLayoutService as ne, BackgroundTool as oe, SizeTool as ae, ImageTool as re, WhiteInkTool as ie, DielineTool as ce, RulerTool as se, FeatureTool as de } from "@pooder/kit";
 export * from "@pooder/kit";
-const ie = /* @__PURE__ */ B({
+const me = /* @__PURE__ */ F({
   __name: "CanvasArea",
   emits: ["canvas-ready", "resize"],
-  setup(h, { emit: l }) {
-    const m = l, r = T(null), o = T(null);
-    let i = null;
-    return V(() => {
-      if (r.value && o.value) {
-        const { clientWidth: u, clientHeight: f } = r.value;
-        o.value.width = u, o.value.height = f, m("canvas-ready", o.value), i = new ResizeObserver((v) => {
+  setup(f, { emit: l }) {
+    const m = l, o = E(null), a = E(null);
+    let c = null;
+    return J(() => {
+      if (o.value && a.value) {
+        const { clientWidth: u, clientHeight: g } = o.value;
+        a.value.width = u, a.value.height = g, m("canvas-ready", a.value), c = new ResizeObserver((v) => {
           for (const p of v) {
             const { width: w, height: y } = p.contentRect;
             m("resize", w, y);
           }
-        }), i.observe(r.value);
+        }), c.observe(o.value);
       }
     }), O(() => {
-      i && i.disconnect();
-    }), (u, f) => (k(), P("div", {
+      c && c.disconnect();
+    }), (u, g) => (P(), N("div", {
       ref_key: "container",
-      ref: r,
+      ref: o,
       class: "pooder-canvas-area"
     }, [
-      j("canvas", {
+      K("canvas", {
         ref_key: "canvas",
-        ref: o
+        ref: a
       }, null, 512)
     ], 512));
   }
-}), N = (h, l) => {
-  const m = h.__vccOpts || h;
-  for (const [r, o] of l)
-    m[r] = o;
+}), k = (f, l) => {
+  const m = f.__vccOpts || f;
+  for (const [o, a] of l)
+    m[o] = a;
   return m;
-}, ae = /* @__PURE__ */ N(ie, [["__scopeId", "data-v-203ff8d9"]]), ce = { class: "pooder-editor" }, I = "SceneLayoutService", se = /* @__PURE__ */ B({
+}, ue = /* @__PURE__ */ k(me, [["__scopeId", "data-v-203ff8d9"]]), le = { class: "pooder-editor" }, T = "SceneLayoutService", ge = /* @__PURE__ */ F({
   __name: "PooderEditor",
-  emits: ["image-change"],
-  setup(h, { expose: l, emit: m }) {
-    const r = new G();
-    $("pooder", r);
-    const o = r.getService("CommandService"), i = r.getService("ConfigurationService"), u = r.getService("WorkbenchService"), f = m, v = i.onAnyChange((e) => {
-      e.key === "image.items" && f("image-change", e.value);
-    }), p = (e) => {
-      i.import(e);
-    }, w = () => i.export(), y = () => i.get("image.items", []), R = async (e) => {
+  emits: ["image-state-change", "image-session-notice"],
+  setup(f, { expose: l, emit: m }) {
+    const o = new ee();
+    Q("pooder", o);
+    const a = o.getService("CommandService"), c = o.getService("ConfigurationService"), u = o.getService("WorkbenchService"), g = m, v = (e) => {
+      g("image-state-change", e);
+    }, p = (e) => {
+      g("image-session-notice", e);
+    };
+    o.eventBus.on("image:state:change", v), o.eventBus.on("image:session:notice", p);
+    const w = (e) => {
+      c.import(e);
+    }, y = () => c.export(), R = async (e) => {
       try {
-        const t = await o.executeCommand(
+        const t = await a.executeCommand(
           "exportCutImage",
           e
         );
         return t || console.warn("[PooderEditor] generateCutImage returned null", {
           options: e,
-          imageCount: (i.get("image.items") || []).length,
-          hasCanvasService: !!r.getService("CanvasService")
+          imageCount: (c.get("image.items") || []).length,
+          hasCanvasService: !!o.getService("CanvasService")
         }), t;
       } catch (t) {
         throw console.error("[PooderEditor] generateCutImage failed", t), t;
       }
-    }, D = async (e, t) => await o.executeCommand("upsertImage", e, {
+    }, _ = async (e, t) => await a.executeCommand("upsertImage", e, {
       id: t?.id,
       mode: t?.mode,
       addOptions: t?.addOptions,
-      fitOnAdd: t?.fitOnAdd
-    }), _ = async (e, t) => (await D(e, {
+      operation: t?.operation
+    }), D = async (e, t) => (await _(e, {
       mode: "add",
-      addOptions: t,
-      fitOnAdd: !0
-    })).id, A = async (e, t) => await o.executeCommand("updateImage", e, t), U = async () => await o.executeCommand("clearImages"), C = async (e) => await o.executeCommand(
+      addOptions: t
+    })).id, U = async (e, t, n) => await a.executeCommand(
+      "applyImageOperation",
+      e,
+      t,
+      n
+    ), z = async () => await a.executeCommand("getImageViewState"), M = async (e, t, n) => await a.executeCommand("setImageTransform", e, t, n), W = (e) => (o.eventBus.on("image:state:change", e), () => o.eventBus.off("image:state:change", e)), L = (e) => (o.eventBus.on("image:session:notice", e), () => o.eventBus.off("image:session:notice", e)), Y = async (e, t) => await a.executeCommand("updateImage", e, t), A = async () => await a.executeCommand("clearImages"), C = async (e) => await a.executeCommand(
       "exportUserCroppedImage",
       e
-    ), z = async (e, t) => await o.executeCommand("focusImage", e, t), x = (e, t) => {
-      i.update("dieline.shape", "custom"), i.update("dieline.pathData", e.pathData);
-      const n = Number(e.imageWidth ?? t?.width ?? 0), a = Number(e.imageHeight ?? t?.height ?? 0);
-      i.update(
+    ), H = async (e, t) => await a.executeCommand("focusImage", e, t), x = (e, t) => {
+      c.update("dieline.shape", "custom"), c.update("dieline.pathData", e.pathData);
+      const n = Number(e.imageWidth ?? t?.width ?? 0), r = Number(e.imageHeight ?? t?.height ?? 0);
+      c.update(
         "dieline.customSourceWidthPx",
         Number.isFinite(n) && n > 0 ? n : void 0
-      ), i.update(
+      ), c.update(
         "dieline.customSourceHeightPx",
-        Number.isFinite(a) && a > 0 ? a : void 0
-      ), i.update("size.cutMode", "trim"), i.update("size.cutMarginMm", 0);
-    }, b = (e) => !!e && Number.isFinite(e.x) && Number.isFinite(e.y) && Number.isFinite(e.width) && Number.isFinite(e.height) && e.width > 0 && e.height > 0, E = (e, t) => {
+        Number.isFinite(r) && r > 0 ? r : void 0
+      ), c.update("size.cutMode", "trim"), c.update("size.cutMarginMm", 0);
+    }, b = (e) => !!e && Number.isFinite(e.x) && Number.isFinite(e.y) && Number.isFinite(e.width) && Number.isFinite(e.height) && e.width > 0 && e.height > 0, I = (e, t) => {
       const n = e.rawBounds || e.baseBounds || null;
       if (!n)
         return {
@@ -95,17 +103,17 @@ const ie = /* @__PURE__ */ B({
           coverageX: 0,
           coverageY: 0
         };
-      const a = t.width / 2, c = t.height / 2, s = n.x + n.width / 2, d = n.y + n.height / 2;
+      const r = t.width / 2, i = t.height / 2, s = n.x + n.width / 2, d = n.y + n.height / 2;
       return {
         sourceWidth: t.width,
         sourceHeight: t.height,
         detectedBounds: n,
-        centerOffsetX: s - a,
-        centerOffsetY: d - c,
+        centerOffsetX: s - r,
+        centerOffsetY: d - i,
         coverageX: t.width > 0 ? n.width / t.width : 0,
         coverageY: t.height > 0 ? n.height / t.height : 0
       };
-    }, M = (e) => {
+    }, X = (e) => {
       if (!b(e.rawBounds) || !b(e.baseBounds))
         return null;
       const t = e.rawBounds, n = e.baseBounds;
@@ -115,61 +123,65 @@ const ie = /* @__PURE__ */ B({
         right: t.x + t.width - (n.x + n.width),
         bottom: t.y + t.height - (n.y + n.height)
       };
-    }, W = (e, t, n) => {
-      const a = E(e, t), c = M(e), s = c ? {
-        left: c.left - n,
-        top: c.top - n,
-        right: c.right - n,
-        bottom: c.bottom - n
-      } : null, d = c ? {
-        x: c.right - c.left,
-        y: c.bottom - c.top
+    }, V = (e, t, n) => {
+      const r = I(e, t), i = X(e), s = i ? {
+        left: i.left - n,
+        top: i.top - n,
+        right: i.right - n,
+        bottom: i.bottom - n
+      } : null, d = i ? {
+        x: i.right - i.left,
+        y: i.bottom - i.top
       } : null;
       return {
-        frame: a,
-        margin: c,
+        frame: r,
+        margin: i,
         expectedExpand: n,
         marginDeltaFromExpected: s,
         marginAsymmetry: d
       };
-    }, L = async (e, t, n) => {
+    }, j = async (e, t, n) => {
       if (!e.length) return null;
-      const a = await C({
+      const r = await C({
         multiplier: n?.multiplier ?? 2,
         format: n?.format ?? "png",
         imageIds: e
-      }), c = a?.url;
-      if (!c) return null;
+      }), i = r?.url;
+      if (!i) return null;
       try {
-        const s = await o.executeCommand("detectEdge", c, {
+        const s = await a.executeCommand("detectEdge", i, {
           expand: n?.detect?.expand ?? 0,
           smoothing: n?.detect?.smoothing ?? !0,
           simplifyTolerance: n?.detect?.simplifyTolerance ?? 2,
           threshold: n?.detect?.threshold,
           debug: !1
         });
-        return s ? W(
+        return s ? V(
           s,
-          a,
+          r,
           t
         ) : null;
       } finally {
-        URL.revokeObjectURL(c);
+        URL.revokeObjectURL(i);
       }
     };
     l({
-      importConfig: p,
-      exportConfig: w,
-      getImages: y,
+      importConfig: w,
+      exportConfig: y,
       generateCutImage: R,
-      addImage: _,
-      upsertImage: D,
-      updateImage: A,
-      clearImages: U,
+      addImage: D,
+      upsertImage: _,
+      getImageState: z,
+      onImageStateChange: W,
+      onImageSessionNotice: L,
+      applyImageOperation: U,
+      setImageTransform: M,
+      updateImage: Y,
+      clearImages: A,
       exportUserCroppedImage: C,
-      focusImage: z,
+      focusImage: H,
       detectDieline: async (e) => {
-        const t = await o.executeCommand("detectEdge", e, {
+        const t = await a.executeCommand("detectEdge", e, {
           expand: 10,
           // 安全距离（像素）
           smoothing: !0,
@@ -179,8 +191,8 @@ const ie = /* @__PURE__ */ B({
         });
         return t ? (x(t), t.pathData) : null;
       },
-      detectDielineFromFrame: async (e) => {
-        const t = e?.detect?.debug === !0, n = e?.inspect?.includeCroppedImage === !0, a = e?.inspect?.includeDiagnostics === !0, c = Math.max(0, Number(e?.detect?.expand ?? 0)), s = await C({
+      detectDielineFromFrame: async (e = {}) => {
+        const t = e?.detect?.debug === !0, n = e?.inspect?.includeCroppedImage === !0, r = e?.inspect?.includeDiagnostics === !0, i = Math.max(0, Number(e?.detect?.expand ?? 0)), s = await C({
           multiplier: e?.export?.multiplier ?? 2,
           format: e?.export?.format ?? "png",
           imageIds: e?.export?.imageIds
@@ -188,26 +200,26 @@ const ie = /* @__PURE__ */ B({
         if (!d)
           return console.warn("[PooderEditor] detectDielineFromFrame no source image"), null;
         try {
-          const g = await o.executeCommand("detectEdge", d, {
+          const h = await a.executeCommand("detectEdge", d, {
             expand: e?.detect?.expand ?? 0,
             smoothing: e?.detect?.smoothing ?? !0,
             simplifyTolerance: e?.detect?.simplifyTolerance ?? 2,
             threshold: e?.detect?.threshold,
             debug: t
           });
-          if (!g)
+          if (!h)
             return console.warn(
               "[PooderEditor] detectDielineFromFrame detectEdge returned null"
             ), null;
-          const F = E(g, s);
+          const B = I(h, s);
           if (e?.commit === !1)
             return {
-              ...g,
+              ...h,
               ...n ? { sourceImage: s } : {},
-              ...a ? { diagnostics: F } : {}
+              ...r ? { diagnostics: B } : {}
             };
-          x(g, s);
-          const X = {
+          x(h, s);
+          const G = {
             multiplier: e?.export?.multiplier ?? 2,
             format: e?.export?.format ?? "png",
             detect: {
@@ -217,10 +229,10 @@ const ie = /* @__PURE__ */ B({
               threshold: e?.detect?.threshold
             }
           };
-          let S = await L(
+          let S = await j(
             s.imageIds,
-            c,
-            X
+            i,
+            G
           );
           return S ? console.info(
             "[PooderEditor] detectDielineFromFrame post-commit diagnostics",
@@ -228,67 +240,67 @@ const ie = /* @__PURE__ */ B({
           ) : s.imageIds.length > 0 && console.warn(
             "[PooderEditor] detectDielineFromFrame post-commit detectEdge returned null"
           ), {
-            ...g,
+            ...h,
             ...n ? { sourceImage: s } : {},
-            ...a ? { diagnostics: F, postCommitDiagnostics: S } : {}
+            ...r ? { diagnostics: B, postCommitDiagnostics: S } : {}
           };
         } finally {
           d && !n && URL.revokeObjectURL(d);
         }
       },
       uploadAndDetectEdge: async (e, t) => {
-        const n = await _(e), a = await o.executeCommand("detectEdge", e, {
+        const n = await D(e), r = await a.executeCommand("detectEdge", e, {
           expand: t?.expand ?? 10,
           smoothing: t?.smoothing ?? !0,
           simplifyTolerance: t?.simplifyTolerance ?? 2
         });
-        return a ? (x(a), { imageId: n, url: e, pathData: a.pathData }) : null;
+        return r ? (x(r), { imageId: n, url: e, pathData: r.pathData }) : null;
       },
       activateTool: async (e) => await u.switchTool(e),
       deactivateTool: async () => await u.deactivate(),
-      on: (e, t) => r.eventBus.on(e, t),
-      off: (e, t) => r.eventBus.off(e, t),
-      emit: (e, t) => r.eventBus.emit(e, t),
-      executeCommand: (e, ...t) => o.executeCommand(e, ...t),
-      getConfig: (e) => i.get(e),
-      updateConfig: (e, t) => i.update(e, t),
+      on: (e, t) => o.eventBus.on(e, t),
+      off: (e, t) => o.eventBus.off(e, t),
+      emit: (e, t) => o.eventBus.emit(e, t),
+      executeCommand: (e, ...t) => a.executeCommand(e, ...t),
+      getConfig: (e) => c.get(e),
+      updateConfig: (e, t) => c.update(e, t),
       services: {
         workbench: u,
-        command: o,
-        config: i
+        command: a,
+        config: c
       }
     });
-    const Y = (e) => {
-      const t = new J(e, {
-        eventBus: r.eventBus
+    const $ = (e) => {
+      const t = new te(e, {
+        eventBus: o.eventBus
       });
-      r.registerService(t, "CanvasService"), r.registerService(new K(), I), [
-        new Q(),
-        new Z(),
-        new ee(),
+      o.registerService(t, "CanvasService"), o.registerService(new ne(), T), [
+        new oe(),
+        new ae(),
+        new re(),
         // new FilmTool(),
-        new te(),
+        new ie(),
         // new MirrorTool(),
-        new ne(),
-        new re(),
-        new oe()
-      ].forEach((a) => {
-        r.extensionManager.register(a);
+        new ce(),
+        new se(),
+        new de()
+      ].forEach((r) => {
+        o.extensionManager.register(r);
       });
-    }, H = (e, t) => {
-      const n = r.getService("CanvasService");
+    }, q = (e, t) => {
+      const n = o.getService("CanvasService");
       n && n.resize(e, t);
     };
     return O(() => {
-      v.dispose(), r.extensionManager.destroy(), r.unregisterService(I), r.unregisterService("CanvasService");
-    }), (e, t) => (k(), P("div", ce, [
-      q(ae, {
-        onCanvasReady: Y,
-        onResize: H
+      o.eventBus.off("image:state:change", v), o.eventBus.off("image:session:notice", p), o.extensionManager.destroy(), o.unregisterService(T), o.unregisterService("CanvasService");
+    }), (e, t) => (P(), N("div", le, [
+      Z(ue, {
+        onCanvasReady: $,
+        onResize: q
       })
     ]));
   }
-}), fe = /* @__PURE__ */ N(se, [["__scopeId", "data-v-32ae317e"]]);
+}), xe = /* @__PURE__ */ k(ge, [["__scopeId", "data-v-d74921ee"]]);
 export {
-  fe as PooderEditor
+  xe as PooderEditor
 };

package/dist/index.umd.js

@@ -1 +1 @@
-(function(l,s){typeof exports=="object"&&typeof module<"u"?s(exports,require("vue"),require("@pooder/core"),require("@pooder/kit")):typeof define=="function"&&define.amd?define(["exports","vue","@pooder/core","@pooder/kit"],s):(l=typeof globalThis<"u"?globalThis:l||self,s(l.PooderVue={},l.Vue,l.PooderCore,l.PooderKit))})(this,(function(l,s,w,m){"use strict";const R=s.defineComponent({__name:"CanvasArea",emits:["canvas-ready","resize"],setup(d,{emit:p}){const f=p,r=s.ref(null),o=s.ref(null);let i=null;return s.onMounted(()=>{if(r.value&&o.value){const{clientWidth:h,clientHeight:y}=r.value;o.value.width=h,o.value.height=y,f("canvas-ready",o.value),i=new ResizeObserver(C=>{for(const x of C){const{width:b,height:S}=x.contentRect;f("resize",b,S)}}),i.observe(r.value)}}),s.onUnmounted(()=>{i&&i.disconnect()}),(h,y)=>(s.openBlock(),s.createElementBlock("div",{ref_key:"container",ref:r,class:"pooder-canvas-area"},[s.createElementVNode("canvas",{ref_key:"canvas",ref:o},null,512)],512))}}),E=(d,p)=>{const f=d.__vccOpts||d;for(const[r,o]of p)f[r]=o;return f},U=E(R,[["__scopeId","data-v-203ff8d9"]]),j={class:"pooder-editor"},T="SceneLayoutService",A=E(s.defineComponent({__name:"PooderEditor",emits:["image-change"],setup(d,{expose:p,emit:f}){const r=new w.Pooder;s.provide("pooder",r);const o=r.getService("CommandService"),i=r.getService("ConfigurationService"),h=r.getService("WorkbenchService"),y=f,C=i.onAnyChange(e=>{e.key==="image.items"&&y("image-change",e.value)}),x=e=>{i.import(e)},b=()=>i.export(),S=()=>i.get("image.items",[]),z=async e=>{try{const t=await o.executeCommand("exportCutImage",e);return t||console.warn("[PooderEditor] generateCutImage returned null",{options:e,imageCount:(i.get("image.items")||[]).length,hasCanvasService:!!r.getService("CanvasService")}),t}catch(t){throw console.error("[PooderEditor] generateCutImage failed",t),t}},P=async(e,t)=>await o.executeCommand("upsertImage",e,{id:t?.id,mode:t?.mode,addOptions:t?.addOptions,fitOnAdd:t?.fitOnAdd}),F=async(e,t)=>(await P(e,{mode:"add",addOptions:t,fitOnAdd:!0})).id,M=async(e,t)=>await o.executeCommand("updateImage",e,t),W=async()=>await o.executeCommand("clearImages"),_=async e=>await o.executeCommand("exportUserCroppedImage",e),L=async(e,t)=>await o.executeCommand("focusImage",e,t),D=(e,t)=>{i.update("dieline.shape","custom"),i.update("dieline.pathData",e.pathData);const n=Number(e.imageWidth??t?.width??0),a=Number(e.imageHeight??t?.height??0);i.update("dieline.customSourceWidthPx",Number.isFinite(n)&&n>0?n:void 0),i.update("dieline.customSourceHeightPx",Number.isFinite(a)&&a>0?a:void 0),i.update("size.cutMode","trim"),i.update("size.cutMarginMm",0)},B=e=>!!e&&Number.isFinite(e.x)&&Number.isFinite(e.y)&&Number.isFinite(e.width)&&Number.isFinite(e.height)&&e.width>0&&e.height>0,I=(e,t)=>{const n=e.rawBounds||e.baseBounds||null;if(!n)return{sourceWidth:t.width,sourceHeight:t.height,detectedBounds:null,centerOffsetX:0,centerOffsetY:0,coverageX:0,coverageY:0};const a=t.width/2,c=t.height/2,u=n.x+n.width/2,g=n.y+n.height/2;return{sourceWidth:t.width,sourceHeight:t.height,detectedBounds:n,centerOffsetX:u-a,centerOffsetY:g-c,coverageX:t.width>0?n.width/t.width:0,coverageY:t.height>0?n.height/t.height:0}},Y=e=>{if(!B(e.rawBounds)||!B(e.baseBounds))return null;const t=e.rawBounds,n=e.baseBounds;return{left:n.x-t.x,top:n.y-t.y,right:t.x+t.width-(n.x+n.width),bottom:t.y+t.height-(n.y+n.height)}},H=(e,t,n)=>{const a=I(e,t),c=Y(e),u=c?{left:c.left-n,top:c.top-n,right:c.right-n,bottom:c.bottom-n}:null,g=c?{x:c.right-c.left,y:c.bottom-c.top}:null;return{frame:a,margin:c,expectedExpand:n,marginDeltaFromExpected:u,marginAsymmetry:g}},V=async(e,t,n)=>{if(!e.length)return null;const a=await _({multiplier:n?.multiplier??2,format:n?.format??"png",imageIds:e}),c=a?.url;if(!c)return null;try{const u=await o.executeCommand("detectEdge",c,{expand:n?.detect?.expand??0,smoothing:n?.detect?.smoothing??!0,simplifyTolerance:n?.detect?.simplifyTolerance??2,threshold:n?.detect?.threshold,debug:!1});return u?H(u,a,t):null}finally{URL.revokeObjectURL(c)}};p({importConfig:x,exportConfig:b,getImages:S,generateCutImage:z,addImage:F,upsertImage:P,updateImage:M,clearImages:W,exportUserCroppedImage:_,focusImage:L,detectDieline:async e=>{const t=await o.executeCommand("detectEdge",e,{expand:10,smoothing:!0,simplifyTolerance:2});return t?(D(t),t.pathData):null},detectDielineFromFrame:async e=>{const t=e?.detect?.debug===!0,n=e?.inspect?.includeCroppedImage===!0,a=e?.inspect?.includeDiagnostics===!0,c=Math.max(0,Number(e?.detect?.expand??0)),u=await _({multiplier:e?.export?.multiplier??2,format:e?.export?.format??"png",imageIds:e?.export?.imageIds}),g=u?.url;if(!g)return console.warn("[PooderEditor] detectDielineFromFrame no source image"),null;try{const v=await o.executeCommand("detectEdge",g,{expand:e?.detect?.expand??0,smoothing:e?.detect?.smoothing??!0,simplifyTolerance:e?.detect?.simplifyTolerance??2,threshold:e?.detect?.threshold,debug:t});if(!v)return console.warn("[PooderEditor] detectDielineFromFrame detectEdge returned null"),null;const N=I(v,u);if(e?.commit===!1)return{...v,...n?{sourceImage:u}:{},...a?{diagnostics:N}:{}};D(v,u);const k={multiplier:e?.export?.multiplier??2,format:e?.export?.format??"png",detect:{expand:e?.detect?.expand??0,smoothing:e?.detect?.smoothing??!0,simplifyTolerance:e?.detect?.simplifyTolerance??2,threshold:e?.detect?.threshold}};let O=await V(u.imageIds,c,k);return O?console.info("[PooderEditor] detectDielineFromFrame post-commit diagnostics",O):u.imageIds.length>0&&console.warn("[PooderEditor] detectDielineFromFrame post-commit detectEdge returned null"),{...v,...n?{sourceImage:u}:{},...a?{diagnostics:N,postCommitDiagnostics:O}:{}}}finally{g&&!n&&URL.revokeObjectURL(g)}},uploadAndDetectEdge:async(e,t)=>{const n=await F(e),a=await o.executeCommand("detectEdge",e,{expand:t?.expand??10,smoothing:t?.smoothing??!0,simplifyTolerance:t?.simplifyTolerance??2});return a?(D(a),{imageId:n,url:e,pathData:a.pathData}):null},activateTool:async e=>await h.switchTool(e),deactivateTool:async()=>await h.deactivate(),on:(e,t)=>r.eventBus.on(e,t),off:(e,t)=>r.eventBus.off(e,t),emit:(e,t)=>r.eventBus.emit(e,t),executeCommand:(e,...t)=>o.executeCommand(e,...t),getConfig:e=>i.get(e),updateConfig:(e,t)=>i.update(e,t),services:{workbench:h,command:o,config:i}});const X=e=>{const t=new m.CanvasService(e,{eventBus:r.eventBus});r.registerService(t,"CanvasService"),r.registerService(new m.SceneLayoutService,T),[new m.BackgroundTool,new m.SizeTool,new m.ImageTool,new m.WhiteInkTool,new m.DielineTool,new m.RulerTool,new m.FeatureTool].forEach(a=>{r.extensionManager.register(a)})},q=(e,t)=>{const n=r.getService("CanvasService");n&&n.resize(e,t)};return s.onUnmounted(()=>{C.dispose(),r.extensionManager.destroy(),r.unregisterService(T),r.unregisterService("CanvasService")}),(e,t)=>(s.openBlock(),s.createElementBlock("div",j,[s.createVNode(U,{onCanvasReady:X,onResize:q})]))}}),[["__scopeId","data-v-32ae317e"]]);l.PooderEditor=A,Object.keys(w).forEach(d=>{d!=="default"&&!Object.prototype.hasOwnProperty.call(l,d)&&Object.defineProperty(l,d,{enumerable:!0,get:()=>w[d]})}),Object.keys(m).forEach(d=>{d!=="default"&&!Object.prototype.hasOwnProperty.call(l,d)&&Object.defineProperty(l,d,{enumerable:!0,get:()=>m[d]})}),Object.defineProperty(l,Symbol.toStringTag,{value:"Module"})}));
+(function(u,c){typeof exports=="object"&&typeof module<"u"?c(exports,require("vue"),require("@pooder/core"),require("@pooder/kit")):typeof define=="function"&&define.amd?define(["exports","vue","@pooder/core","@pooder/kit"],c):(u=typeof globalThis<"u"?globalThis:u||self,c(u.PooderVue={},u.Vue,u.PooderCore,u.PooderKit))})(this,(function(u,c,x,l){"use strict";const R=c.defineComponent({__name:"CanvasArea",emits:["canvas-ready","resize"],setup(d,{emit:p}){const f=p,o=c.ref(null),r=c.ref(null);let s=null;return c.onMounted(()=>{if(o.value&&r.value){const{clientWidth:h,clientHeight:v}=o.value;r.value.width=h,r.value.height=v,f("canvas-ready",r.value),s=new ResizeObserver(w=>{for(const C of w){const{width:S,height:b}=C.contentRect;f("resize",S,b)}}),s.observe(o.value)}}),c.onUnmounted(()=>{s&&s.disconnect()}),(h,v)=>(c.openBlock(),c.createElementBlock("div",{ref_key:"container",ref:o,class:"pooder-canvas-area"},[c.createElementVNode("canvas",{ref_key:"canvas",ref:r},null,512)],512))}}),B=(d,p)=>{const f=d.__vccOpts||d;for(const[o,r]of p)f[o]=r;return f},U=B(R,[["__scopeId","data-v-203ff8d9"]]),j={class:"pooder-editor"},E="SceneLayoutService",z=B(c.defineComponent({__name:"PooderEditor",emits:["image-state-change","image-session-notice"],setup(d,{expose:p,emit:f}){const o=new x.Pooder;c.provide("pooder",o);const r=o.getService("CommandService"),s=o.getService("ConfigurationService"),h=o.getService("WorkbenchService"),v=f,w=e=>{v("image-state-change",e)},C=e=>{v("image-session-notice",e)};o.eventBus.on("image:state:change",w),o.eventBus.on("image:session:notice",C);const S=e=>{s.import(e)},b=()=>s.export(),M=async e=>{try{const t=await r.executeCommand("exportCutImage",e);return t||console.warn("[PooderEditor] generateCutImage returned null",{options:e,imageCount:(s.get("image.items")||[]).length,hasCanvasService:!!o.getService("CanvasService")}),t}catch(t){throw console.error("[PooderEditor] generateCutImage failed",t),t}},O=async(e,t)=>await r.executeCommand("upsertImage",e,{id:t?.id,mode:t?.mode,addOptions:t?.addOptions,operation:t?.operation}),T=async(e,t)=>(await O(e,{mode:"add",addOptions:t})).id,W=async(e,t,n)=>await r.executeCommand("applyImageOperation",e,t,n),L=async()=>await r.executeCommand("getImageViewState"),V=async(e,t,n)=>await r.executeCommand("setImageTransform",e,t,n),Y=e=>(o.eventBus.on("image:state:change",e),()=>o.eventBus.off("image:state:change",e)),A=e=>(o.eventBus.on("image:session:notice",e),()=>o.eventBus.off("image:session:notice",e)),H=async(e,t)=>await r.executeCommand("updateImage",e,t),X=async()=>await r.executeCommand("clearImages"),_=async e=>await r.executeCommand("exportUserCroppedImage",e),q=async(e,t)=>await r.executeCommand("focusImage",e,t),D=(e,t)=>{s.update("dieline.shape","custom"),s.update("dieline.pathData",e.pathData);const n=Number(e.imageWidth??t?.width??0),a=Number(e.imageHeight??t?.height??0);s.update("dieline.customSourceWidthPx",Number.isFinite(n)&&n>0?n:void 0),s.update("dieline.customSourceHeightPx",Number.isFinite(a)&&a>0?a:void 0),s.update("size.cutMode","trim"),s.update("size.cutMarginMm",0)},P=e=>!!e&&Number.isFinite(e.x)&&Number.isFinite(e.y)&&Number.isFinite(e.width)&&Number.isFinite(e.height)&&e.width>0&&e.height>0,F=(e,t)=>{const n=e.rawBounds||e.baseBounds||null;if(!n)return{sourceWidth:t.width,sourceHeight:t.height,detectedBounds:null,centerOffsetX:0,centerOffsetY:0,coverageX:0,coverageY:0};const a=t.width/2,i=t.height/2,m=n.x+n.width/2,g=n.y+n.height/2;return{sourceWidth:t.width,sourceHeight:t.height,detectedBounds:n,centerOffsetX:m-a,centerOffsetY:g-i,coverageX:t.width>0?n.width/t.width:0,coverageY:t.height>0?n.height/t.height:0}},k=e=>{if(!P(e.rawBounds)||!P(e.baseBounds))return null;const t=e.rawBounds,n=e.baseBounds;return{left:n.x-t.x,top:n.y-t.y,right:t.x+t.width-(n.x+n.width),bottom:t.y+t.height-(n.y+n.height)}},K=(e,t,n)=>{const a=F(e,t),i=k(e),m=i?{left:i.left-n,top:i.top-n,right:i.right-n,bottom:i.bottom-n}:null,g=i?{x:i.right-i.left,y:i.bottom-i.top}:null;return{frame:a,margin:i,expectedExpand:n,marginDeltaFromExpected:m,marginAsymmetry:g}},$=async(e,t,n)=>{if(!e.length)return null;const a=await _({multiplier:n?.multiplier??2,format:n?.format??"png",imageIds:e}),i=a?.url;if(!i)return null;try{const m=await r.executeCommand("detectEdge",i,{expand:n?.detect?.expand??0,smoothing:n?.detect?.smoothing??!0,simplifyTolerance:n?.detect?.simplifyTolerance??2,threshold:n?.detect?.threshold,debug:!1});return m?K(m,a,t):null}finally{URL.revokeObjectURL(i)}};p({importConfig:S,exportConfig:b,generateCutImage:M,addImage:T,upsertImage:O,getImageState:L,onImageStateChange:Y,onImageSessionNotice:A,applyImageOperation:W,setImageTransform:V,updateImage:H,clearImages:X,exportUserCroppedImage:_,focusImage:q,detectDieline:async e=>{const t=await r.executeCommand("detectEdge",e,{expand:10,smoothing:!0,simplifyTolerance:2});return t?(D(t),t.pathData):null},detectDielineFromFrame:async(e={})=>{const t=e?.detect?.debug===!0,n=e?.inspect?.includeCroppedImage===!0,a=e?.inspect?.includeDiagnostics===!0,i=Math.max(0,Number(e?.detect?.expand??0)),m=await _({multiplier:e?.export?.multiplier??2,format:e?.export?.format??"png",imageIds:e?.export?.imageIds}),g=m?.url;if(!g)return console.warn("[PooderEditor] detectDielineFromFrame no source image"),null;try{const y=await r.executeCommand("detectEdge",g,{expand:e?.detect?.expand??0,smoothing:e?.detect?.smoothing??!0,simplifyTolerance:e?.detect?.simplifyTolerance??2,threshold:e?.detect?.threshold,debug:t});if(!y)return console.warn("[PooderEditor] detectDielineFromFrame detectEdge returned null"),null;const N=F(y,m);if(e?.commit===!1)return{...y,...n?{sourceImage:m}:{},...a?{diagnostics:N}:{}};D(y,m);const Q={multiplier:e?.export?.multiplier??2,format:e?.export?.format??"png",detect:{expand:e?.detect?.expand??0,smoothing:e?.detect?.smoothing??!0,simplifyTolerance:e?.detect?.simplifyTolerance??2,threshold:e?.detect?.threshold}};let I=await $(m.imageIds,i,Q);return I?console.info("[PooderEditor] detectDielineFromFrame post-commit diagnostics",I):m.imageIds.length>0&&console.warn("[PooderEditor] detectDielineFromFrame post-commit detectEdge returned null"),{...y,...n?{sourceImage:m}:{},...a?{diagnostics:N,postCommitDiagnostics:I}:{}}}finally{g&&!n&&URL.revokeObjectURL(g)}},uploadAndDetectEdge:async(e,t)=>{const n=await T(e),a=await r.executeCommand("detectEdge",e,{expand:t?.expand??10,smoothing:t?.smoothing??!0,simplifyTolerance:t?.simplifyTolerance??2});return a?(D(a),{imageId:n,url:e,pathData:a.pathData}):null},activateTool:async e=>await h.switchTool(e),deactivateTool:async()=>await h.deactivate(),on:(e,t)=>o.eventBus.on(e,t),off:(e,t)=>o.eventBus.off(e,t),emit:(e,t)=>o.eventBus.emit(e,t),executeCommand:(e,...t)=>r.executeCommand(e,...t),getConfig:e=>s.get(e),updateConfig:(e,t)=>s.update(e,t),services:{workbench:h,command:r,config:s}});const G=e=>{const t=new l.CanvasService(e,{eventBus:o.eventBus});o.registerService(t,"CanvasService"),o.registerService(new l.SceneLayoutService,E),[new l.BackgroundTool,new l.SizeTool,new l.ImageTool,new l.WhiteInkTool,new l.DielineTool,new l.RulerTool,new l.FeatureTool].forEach(a=>{o.extensionManager.register(a)})},J=(e,t)=>{const n=o.getService("CanvasService");n&&n.resize(e,t)};return c.onUnmounted(()=>{o.eventBus.off("image:state:change",w),o.eventBus.off("image:session:notice",C),o.extensionManager.destroy(),o.unregisterService(E),o.unregisterService("CanvasService")}),(e,t)=>(c.openBlock(),c.createElementBlock("div",j,[c.createVNode(U,{onCanvasReady:G,onResize:J})]))}}),[["__scopeId","data-v-d74921ee"]]);u.PooderEditor=z,Object.keys(x).forEach(d=>{d!=="default"&&!Object.prototype.hasOwnProperty.call(u,d)&&Object.defineProperty(u,d,{enumerable:!0,get:()=>x[d]})}),Object.keys(l).forEach(d=>{d!=="default"&&!Object.prototype.hasOwnProperty.call(u,d)&&Object.defineProperty(u,d,{enumerable:!0,get:()=>l[d]})}),Object.defineProperty(u,Symbol.toStringTag,{value:"Module"})}));

package/dist/vue/src/PooderEditor.vue.d.ts

@@ -1,112 +1,35 @@
 import { CommandService, ConfigurationService, WorkbenchService } from '../../core/src/index.ts';
-interface DetectBounds {
-    x: number;
-    y: number;
-    width: number;
-    height: number;
-}
-interface DetectFrameDiagnostics {
-    sourceWidth: number;
-    sourceHeight: number;
-    detectedBounds: DetectBounds | null;
-    centerOffsetX: number;
-    centerOffsetY: number;
-    coverageX: number;
-    coverageY: number;
-}
-interface DetectMarginDiagnostics {
-    left: number;
-    top: number;
-    right: number;
-    bottom: number;
-}
-interface DetectPostCommitDiagnostics {
-    frame: DetectFrameDiagnostics;
-    margin: DetectMarginDiagnostics | null;
-    expectedExpand: number;
-    marginDeltaFromExpected: DetectMarginDiagnostics | null;
-    marginAsymmetry: {
-        x: number;
-        y: number;
-    } | null;
-}
-interface ExportUserCroppedImageResult {
-    url: string;
-    width: number;
-    height: number;
-    multiplier: number;
-    format: "png" | "jpeg";
-    imageIds: string[];
-}
+import { ImageOperation, ImageSessionNotice, ImageTransformUpdates, ImageViewState } from '../../kit/src/index.ts';
+import { PooderDetectDielineFromFrameOptions, PooderDetectDielineFromFrameResult, PooderEditorImageStateChangeHandler, PooderEditorImageSessionNoticeHandler, PooderExportUserCroppedImageOptions, PooderExportUserCroppedImageResult as ExportUserCroppedImageResult, PooderFocusImageOptions, PooderGenerateCutImageOptions, PooderImageTarget, PooderUpsertImageOptions, PooderUploadAndDetectEdgeOptions, PooderUploadAndDetectEdgeResult } from './model';
 declare const _default: import('vue').DefineComponent<{}, {
     importConfig: (config: Record<string, any>) => void;
     exportConfig: () => Record<string, any>;
-    getImages: () => never[];
-    generateCutImage: (options?: {
-        debug?: boolean;
-    }) => Promise<string | null>;
+    generateCutImage: (options?: PooderGenerateCutImageOptions) => Promise<string | null>;
     addImage: (url: string, options?: any) => Promise<any>;
-    upsertImage: (url: string, options?: {
-        id?: string;
-        mode?: "replace" | "add";
-        addOptions?: any;
-        fitOnAdd?: boolean;
+    upsertImage: (url: string, options?: PooderUpsertImageOptions) => Promise<any>;
+    getImageState: () => Promise<ImageViewState>;
+    onImageStateChange: (handler: PooderEditorImageStateChangeHandler) => () => void;
+    onImageSessionNotice: (handler: PooderEditorImageSessionNoticeHandler) => () => void;
+    applyImageOperation: (id: string, operation: ImageOperation, options?: {
+        target?: PooderImageTarget;
+    }) => Promise<any>;
+    setImageTransform: (id: string, updates: ImageTransformUpdates, options?: {
+        target?: PooderImageTarget;
     }) => Promise<any>;
     updateImage: (id: string, options?: any) => Promise<any>;
     clearImages: () => Promise<any>;
-    exportUserCroppedImage: (options?: {
-        multiplier?: number;
-        format?: "png" | "jpeg";
-        imageIds?: string[];
-    }) => Promise<ExportUserCroppedImageResult>;
-    focusImage: (id: string | null, options?: {
-        syncCanvasSelection?: boolean;
-    }) => Promise<any>;
+    exportUserCroppedImage: (options?: PooderExportUserCroppedImageOptions) => Promise<ExportUserCroppedImageResult>;
+    focusImage: (id: string | null, options?: PooderFocusImageOptions) => Promise<any>;
     detectDieline: (url: string) => Promise<string | null>;
-    detectDielineFromFrame: (options?: {
-        detect?: {
-            expand?: number;
-            smoothing?: boolean;
-            simplifyTolerance?: number;
-            threshold?: number;
-            debug?: boolean;
-        };
-        export?: {
-            multiplier?: number;
-            format?: "png" | "jpeg";
-            imageIds?: string[];
-        };
-        inspect?: {
-            includeCroppedImage?: boolean;
-            includeDiagnostics?: boolean;
-        };
-        commit?: boolean;
-    }) => Promise<{
-        diagnostics?: DetectFrameDiagnostics | undefined;
-        postCommitDiagnostics?: DetectPostCommitDiagnostics | null | undefined;
-        sourceImage?: ExportUserCroppedImageResult | undefined;
-        pathData: string;
-        rawBounds?: DetectBounds;
-        baseBounds?: DetectBounds;
-        imageWidth?: number;
-        imageHeight?: number;
-    } | null>;
-    uploadAndDetectEdge: (url: string, options?: {
-        expand?: number;
-        smoothing?: boolean;
-        simplifyTolerance?: number;
-    }) => Promise<{
-        imageId: any;
-        url: string;
-        pathData: string;
-    } | null>;
+    detectDielineFromFrame: (options?: PooderDetectDielineFromFrameOptions) => Promise<PooderDetectDielineFromFrameResult | null>;
+    uploadAndDetectEdge: (url: string, options?: PooderUploadAndDetectEdgeOptions) => Promise<PooderUploadAndDetectEdgeResult | null>;
     activateTool: (id: string | null) => Promise<import('../../core/src/services/WorkbenchService').ToolSwitchResult>;
     deactivateTool: () => Promise<import('../../core/src/services/WorkbenchService').ToolSwitchResult>;
     on: (event: string, handler: any) => void;
     off: (event: string, handler: any) => void;
     emit: (event: string, data: any) => void;
-    executeCommand: (id: string, ...args: any[]) => Promise<any>;
-    getConfig: (key: string) => any;
+    executeCommand: <T = unknown>(id: string, ...args: any[]) => Promise<T>;
+    getConfig: <T = unknown>(key: string) => T;
     updateConfig: (key: string, val: any) => void;
     services: {
         workbench: WorkbenchService;
@@ -114,8 +37,10 @@ declare const _default: import('vue').DefineComponent<{}, {
         config: ConfigurationService;
     };
 }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
-    "image-change": (images: any[]) => any;
+    "image-state-change": (state: ImageViewState) => any;
+    "image-session-notice": (notice: ImageSessionNotice | null) => any;
 }, string, import('vue').PublicProps, Readonly<{}> & Readonly<{
-    "onImage-change"?: ((images: any[]) => any) | undefined;
+    "onImage-state-change"?: ((state: ImageViewState) => any) | undefined;
+    "onImage-session-notice"?: ((notice: ImageSessionNotice | null) => any) | undefined;
 }>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, HTMLDivElement>;
 export default _default;

package/dist/vue/src/index.d.ts

@@ -1,4 +1,5 @@
 import { default as PooderEditor } from './PooderEditor.vue';
 export { PooderEditor };
+export * from './model';
 export * from '../../core/src/index.ts';
 export * from '../../kit/src/index.ts';

package/dist/vue/src/model.d.ts

@@ -0,0 +1,148 @@
+import { CommandService, ConfigurationService, WorkbenchService } from '../../core/src/index.ts';
+import { ImageOperation, ImageSessionNotice, ImageTransformUpdates, ImageViewState } from '../../kit/src/index.ts';
+export type PooderImageTarget = "auto" | "config" | "working";
+export type PooderEditorEventHandler = (data: any) => void;
+export type PooderEditorImageStateChangeHandler = (state: ImageViewState) => void;
+export type PooderEditorImageSessionNoticeHandler = (notice: ImageSessionNotice | null) => void;
+export interface PooderGenerateCutImageOptions {
+    debug?: boolean;
+}
+export interface PooderUpsertImageOptions {
+    id?: string;
+    mode?: "replace" | "add";
+    addOptions?: any;
+    operation?: ImageOperation;
+}
+export interface PooderExportUserCroppedImageOptions {
+    multiplier?: number;
+    format?: "png" | "jpeg";
+    imageIds?: string[];
+}
+export interface PooderExportUserCroppedImageResult {
+    url: string;
+    width: number;
+    height: number;
+    multiplier: number;
+    format: "png" | "jpeg";
+    imageIds: string[];
+}
+export interface PooderDetectBounds {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+}
+export interface PooderDetectEdgeResult {
+    pathData: string;
+    rawBounds?: PooderDetectBounds;
+    baseBounds?: PooderDetectBounds;
+    imageWidth?: number;
+    imageHeight?: number;
+}
+export interface PooderDetectFrameDiagnostics {
+    sourceWidth: number;
+    sourceHeight: number;
+    detectedBounds: PooderDetectBounds | null;
+    centerOffsetX: number;
+    centerOffsetY: number;
+    coverageX: number;
+    coverageY: number;
+}
+export interface PooderDetectMarginDiagnostics {
+    left: number;
+    top: number;
+    right: number;
+    bottom: number;
+}
+export interface PooderDetectPostCommitDiagnostics {
+    frame: PooderDetectFrameDiagnostics;
+    margin: PooderDetectMarginDiagnostics | null;
+    expectedExpand: number;
+    marginDeltaFromExpected: PooderDetectMarginDiagnostics | null;
+    marginAsymmetry: {
+        x: number;
+        y: number;
+    } | null;
+}
+export interface PooderDetectDielineOptions {
+    expand?: number;
+    smoothing?: boolean;
+    simplifyTolerance?: number;
+    threshold?: number;
+    debug?: boolean;
+}
+export interface PooderDetectDielineFromFrameOptions {
+    detect?: PooderDetectDielineOptions;
+    export?: PooderExportUserCroppedImageOptions;
+    inspect?: {
+        includeCroppedImage?: boolean;
+        includeDiagnostics?: boolean;
+    };
+    commit?: boolean;
+}
+export interface PooderDetectDielineFromFrameResult extends PooderDetectEdgeResult {
+    sourceImage?: PooderExportUserCroppedImageResult;
+    diagnostics?: PooderDetectFrameDiagnostics;
+    postCommitDiagnostics?: PooderDetectPostCommitDiagnostics | null;
+}
+export interface PooderUploadAndDetectEdgeOptions {
+    expand?: number;
+    smoothing?: boolean;
+    simplifyTolerance?: number;
+}
+export interface PooderUploadAndDetectEdgeResult {
+    imageId: string;
+    url: string;
+    pathData: string;
+}
+export interface PooderFocusImageOptions {
+    syncCanvasSelection?: boolean;
+}
+export interface PooderEditorServices {
+    workbench: WorkbenchService;
+    command: CommandService;
+    config: ConfigurationService;
+}
+export interface PooderToolSwitchResult {
+    ok: boolean;
+    from: string | null;
+    to: string | null;
+    reason?: string;
+    detail?: any;
+}
+export interface PooderEditorExposed {
+    importConfig(config: Record<string, any>): void;
+    exportConfig(): Record<string, any>;
+    generateCutImage(options?: PooderGenerateCutImageOptions): Promise<string | null>;
+    addImage(url: string, options?: any): Promise<string>;
+    upsertImage(url: string, options?: PooderUpsertImageOptions): Promise<{
+        id: string;
+        mode: "replace" | "add";
+    }>;
+    getImageState(): Promise<ImageViewState>;
+    onImageStateChange(handler: PooderEditorImageStateChangeHandler): () => void;
+    onImageSessionNotice(handler: PooderEditorImageSessionNoticeHandler): () => void;
+    applyImageOperation(id: string, operation: ImageOperation, options?: {
+        target?: PooderImageTarget;
+    }): Promise<void>;
+    setImageTransform(id: string, updates: ImageTransformUpdates, options?: {
+        target?: PooderImageTarget;
+    }): Promise<void>;
+    updateImage(id: string, options?: any): Promise<void>;
+    clearImages(): Promise<void>;
+    exportUserCroppedImage(options?: PooderExportUserCroppedImageOptions): Promise<PooderExportUserCroppedImageResult>;
+    focusImage(id: string | null, options?: PooderFocusImageOptions): Promise<any>;
+    detectDieline(url: string): Promise<string | null>;
+    detectDielineFromFrame(options?: PooderDetectDielineFromFrameOptions): Promise<PooderDetectDielineFromFrameResult | null>;
+    uploadAndDetectEdge(url: string, options?: PooderUploadAndDetectEdgeOptions): Promise<PooderUploadAndDetectEdgeResult | null>;
+    activateTool(id: string | null): Promise<PooderToolSwitchResult>;
+    deactivateTool(): Promise<PooderToolSwitchResult>;
+    on(event: string, handler: PooderEditorEventHandler): void;
+    off(event: string, handler: PooderEditorEventHandler): void;
+    emit(event: string, data: any): void;
+    executeCommand<T = unknown>(id: string, ...args: any[]): Promise<T>;
+    getConfig<T = unknown>(key: string): T;
+    updateConfig(key: string, val: any): void;
+    services: PooderEditorServices;
+}
+export type PooderEditorImageApi = Pick<PooderEditorExposed, "addImage" | "upsertImage" | "getImageState" | "onImageStateChange" | "onImageSessionNotice" | "applyImageOperation" | "setImageTransform" | "updateImage" | "clearImages" | "focusImage">;

package/dist/vue.css

@@ -1 +1 @@
-.pooder-canvas-area[data-v-203ff8d9]{flex:1;width:100%;height:100%;min-height:650px;min-width:650px;overflow:hidden;background:#ececec;position:relative}canvas[data-v-203ff8d9]{display:block}.pooder-editor[data-v-32ae317e]{display:flex;width:100%;height:100%;overflow:hidden}
+.pooder-canvas-area[data-v-203ff8d9]{flex:1;width:100%;height:100%;min-height:650px;min-width:650px;overflow:hidden;background:#ececec;position:relative}canvas[data-v-203ff8d9]{display:block}.pooder-editor[data-v-d74921ee]{display:flex;width:100%;height:100%;overflow:hidden}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pooder/vue",
-  "version": "4.4.5",
+  "version": "4.5.1",
   "main": "./dist/index.umd.js",
   "module": "./dist/index.es.js",
   "types": "./dist/index.d.ts",
@@ -19,8 +19,8 @@
     "access": "public"
   },
   "dependencies": {
-    "@pooder/core": "2.2.1",
-    "@pooder/kit": "6.2.2"
+    "@pooder/core": "2.2.2",
+    "@pooder/kit": "6.3.1"
   },
   "peerDependencies": {
     "vue": "^3.0.0"