@spiffcommerce/core 21.12.0 → 21.13.0-alpha.0

package/dist/index.js

@@ -1,7 +1,7 @@
 import { createHttpLink as IA, InMemoryCache as fA, ApolloClient as DA, from as FA, gql as D } from "@apollo/client/core";
-import { fetch as et, getAttributesFromArrayBuffer as Rt, AssetType as ut, StepType as y, getFrameData as tt, frameDataCache as yA, GroupCommand as v, UpdateFramePattern as Ht, UpdateFrameThresholdSettingsCommand as MA, calculateOffsets as At, LayoutElementType as k, generate as J, CreateElementCommand as O, generateSVGWithUnknownColors as Ut, svgObjectURL as Pe, fetchAsString as _, DeleteElementCommand as ee, generateDefaultRectangleFrameSvg as Ct, GetSVGDimensions as SA, patternImageDataCache as Qt, fetchAsArrayBuffer as YA, findElement as xe, modifySVGWithElementProperties as PA, IllustrationColorCommand as We, IllustrationCacheCommand as xA, getFontMetrics as NA, getPatternImageData as Xe, FontAlignmentCommand as RA, FontColorCommand as HA, FontImageFillCommand as Te, applyTextTransformations as qe, determineCorrectFontSizeAndLines as Me, FontSourceCommand as mt, loadFont as at, TextChangeCommand as UA, FontSizeCommand as vA, createElementNS as GA, createElement as Qe, _loadFontExternalDataURL as nt, UpdateWorkflowStateCommand as pt, CommandContext as kA, createCanvas as Ne, getSvgElement as vt, LayoutRenderingPurpose as Gt, renderPapyrusComponentAsString as kt, loadImage as bt, getDomParser as Jt, toBase64 as It, getVariant as bA, generateFrameSVG as JA, getDefaultVariant as be, domParser as Lt, sanitizeSvgTree as Ot, traverse as LA, xmlSerializer as Tt, CreateLayoutCommand as OA, AspectType as Be, rehydrateSerializedLayout as Ae } from "@spiffcommerce/papyrus";
+import { fetch as et, getAttributesFromArrayBuffer as Rt, AssetType as ut, StepType as y, getFrameData as tt, frameDataCache as yA, GroupCommand as v, UpdateFramePattern as Ht, UpdateFrameThresholdSettingsCommand as MA, calculateOffsets as At, LayoutElementType as k, generate as J, CreateElementCommand as T, generateSVGWithUnknownColors as Ut, svgObjectURL as Pe, fetchAsString as _, DeleteElementCommand as ee, generateDefaultRectangleFrameSvg as Ct, GetSVGDimensions as SA, patternImageDataCache as Qt, fetchAsArrayBuffer as YA, findElement as xe, modifySVGWithElementProperties as PA, IllustrationColorCommand as We, IllustrationCacheCommand as xA, getFontMetrics as NA, getPatternImageData as Xe, FontAlignmentCommand as RA, FontColorCommand as HA, FontImageFillCommand as Oe, applyTextTransformations as qe, determineCorrectFontSizeAndLines as Me, FontSourceCommand as mt, loadFont as at, TextChangeCommand as UA, FontSizeCommand as vA, createElementNS as GA, createElement as Qe, _loadFontExternalDataURL as nt, UpdateWorkflowStateCommand as pt, CommandContext as kA, createCanvas as Ne, getSvgElement as vt, LayoutRenderingPurpose as Gt, renderPapyrusComponentAsString as kt, loadImage as bt, getDomParser as Jt, toBase64 as It, getVariant as bA, generateFrameSVG as JA, getDefaultVariant as be, domParser as Lt, sanitizeSvgTree as Tt, traverse as LA, xmlSerializer as Ot, CreateLayoutCommand as TA, AspectType as Be, rehydrateSerializedLayout as Ae } from "@spiffcommerce/papyrus";
 import { AspectType as es, AssetType as ts, BringForwardCommand as As, BringToBackCommand as as, BringToFrontCommand as ns, CanvasCommand as is, CommandContext as ss, CreateElementCommand as os, CreateLayoutCommand as rs, DeleteElementCommand as cs, FontAlignmentCommand as gs, FontColorCommand as ls, FontSizeCommand as Bs, FontSourceCommand as ds, GroupCommand as ws, LayoutElementFactory as hs, LayoutElementType as Es, MoveCommand as us, ResizeCommand as Cs, RotateCommand as Qs, SendBackwardsCommand as ms, StepAspectType as ps, StepType as Is, TextChangeCommand as fs, UnitOfMeasurement as Ds, UpdateImageSourceCommand as Fs, dataUrlFromExternalUrl as ys, determineCorrectFontSizeAndLines as Ms, findElement as Ss, frameDataCache as Ys, generate as Ps, generateSVGWithUnknownColors as xs, getAttributesFromArrayBuffer as Ns, getAxisAlignedBoundingBox as Rs, getFrameData as Hs, getSvgElement as Us, loadFont as vs, patternImageDataCache as Gs, registerFetchImplementation as ks, registerWindowImplementation as bs, rehydrateSerializedLayout as Js, setCanvasModule as Ls } from "@spiffcommerce/papyrus";
-import { setContext as TA } from "@apollo/client/link/context";
+import { setContext as OA } from "@apollo/client/link/context";
 import { onError as zA } from "@apollo/client/link/error";
 import { Pith as zt } from "pith";
 import Kt from "lodash.debounce";
@@ -180,7 +180,7 @@ class $A {
     const e = IA({
       uri: `${$.getServerUrl()}/graphql`,
       fetch: et
-    }), t = TA(async (i, s) => {
+    }), t = OA(async (i, s) => {
       const { headers: o } = s, r = o || {}, g = await ZA(), B = s.bearer ?? g.bearer, l = s.partnerId ?? g.partnerId, d = s.activeIntegration ?? g.activeIntegration, w = s.transactionOwnerId, E = s.customerToken ?? g.customerToken, h = s.applicationKey ?? g.applicationKey, u = s.bundleOwnerId;
       try {
         if (window && window.__SENTRY__) {
@@ -1475,7 +1475,12 @@ function pe(c, e, t) {
 }
 class Ya {
   constructor(e) {
-    this.minZoomScale = [0.03], this.maxZoomScale = [20], this._debouncedUpdateFrameOffsets = Kt(this.updateFrameOffsets, 200), this.targetElements = [], this.onFrameDataChangeListeners = [], this.onZoomChangeListeners = [], this.forceImageCover = e, this.thresholdSettings = { useThreshold: !1, invertThreshold: !1, threshold: 128, thresholdSaturation: 0.5 };
+    this.minZoomScale = [0.03], this.maxZoomScale = [20], this._debouncedUpdateFrameOffsets = Kt(this.updateFrameOffsets, 200), this.targetElements = [], this.onFrameDataChangeListeners = [], this.onZoomChangeListeners = [], this.forceImageCover = e, this.thresholdSettings = {
+      useThreshold: !1,
+      invertThreshold: !1,
+      threshold: 128,
+      thresholdSaturation: 0.5
+    };
   }
   /**
    * When we want to connect a workflow manager to the state of the image cropper we
@@ -1573,9 +1578,11 @@ class Ya {
   /**
    * Sets the image currently contained by this frame.
    * @param value The new image as an ImageData property
+   * @param [recalculateOffsets=true] Optional: Enable/disable re-calculating of frame offsets.
+   * Useful when you are replacing an image with the exact same dimensions (e.g. alterations to an image). Default: `true`.
    */
-  setPatternData(e) {
-    this.imageData = e, e && this.frameData && (this.recalculateOffsets(e), this.updateOffsets(this.offsets, void 0, !0)), this.imageData && this.frameData && this.recalculateZoomLimits(this.imageData, this.frameData);
+  setPatternData(e, t = !0) {
+    this.imageData = e, e && this.frameData && (t && this.recalculateOffsets(e), this.updateOffsets(this.offsets, void 0, !0)), this.imageData && this.frameData && this.recalculateZoomLimits(this.imageData, this.frameData);
   }
   /**
    * Modify the offsets of the frame.
@@ -1597,13 +1604,26 @@ class Ya {
     }
     (!this.offsets || this.offsets.length !== this.frameData.length) && (this.offsets = new Array(this.frameData.length)), this.frameData.forEach((i, s) => {
       this.offsets[s] = Sa(e[s], i, this.imageData, this.forceImageCover);
-    }), this._debouncedUpdateFrameOffsets(this.offsets, a, this.frameData, this.thresholdSettings, this.targetElements, t);
+    }), this._debouncedUpdateFrameOffsets(
+      this.offsets,
+      a,
+      this.frameData,
+      this.thresholdSettings,
+      this.targetElements,
+      t
+    );
   }
   getThresholdSettings() {
     return this.thresholdSettings;
   }
   setThresholdSettings(e) {
-    this.thresholdSettings = e, this.imageData && this.frameData && this._debouncedUpdateFrameOffsets(this.offsets, this.imageData, this.frameData, e, this.targetElements);
+    this.thresholdSettings = e, this.imageData && this.frameData && this._debouncedUpdateFrameOffsets(
+      this.offsets,
+      this.imageData,
+      this.frameData,
+      e,
+      this.targetElements
+    );
   }
   // Allows users of the frame service to listen to frame data changes.
   onFrameDataChanged(e) {
@@ -1634,7 +1654,13 @@ class Ya {
       s(
         new v([
           new Ht(o, t, e[r]),
-          new MA(o, a.useThreshold, a.invertThreshold, a.threshold, a.thresholdSaturation)
+          new MA(
+            o,
+            a.useThreshold,
+            a.invertThreshold,
+            a.threshold,
+            a.thresholdSaturation
+          )
         ])
       );
     }), this.stepName && this.workflowManager.updateStorage(this.stepName, {
@@ -1655,7 +1681,13 @@ class Ya {
   recalculateOffsets(e) {
     this.frameData && ((!this.offsets || this.offsets.length !== this.frameData.length) && (this.offsets = new Array(this.frameData.length)), this.frameData.forEach((t, A) => {
       this.offsets[A] = At(e, t);
-    }), this._debouncedUpdateFrameOffsets(this.offsets, e, this.frameData, this.thresholdSettings, this.targetElements));
+    }), this._debouncedUpdateFrameOffsets(
+      this.offsets,
+      e,
+      this.frameData,
+      this.thresholdSettings,
+      this.targetElements
+    ));
   }
 }
 class St {
@@ -1698,7 +1730,7 @@ class St {
             id: d.id,
             region: a
           },
-          command: new O(d, n)
+          command: new T(d, n)
         };
       } else {
         const l = this.configuration.type === y.SilentIllustration ? (B = this.configuration.data.asset) == null ? void 0 : B.fileLink : i, w = await Ut(await (async () => new Promise((h, u) => {
@@ -1733,7 +1765,7 @@ class St {
             id: E.id,
             region: a
           },
-          command: new O(E, n)
+          command: new T(E, n)
         };
       }
     }, this.configuration = e, this.layouts = t, this.product = A || void 0;
@@ -1871,7 +1903,7 @@ class xa {
         throw new Error("Region not found");
       if (!B || !g)
         throw new Error("Neither a region or layout found!");
-      return new O(
+      return new T(
         {
           stepRegion: g,
           stepName: a,
@@ -1952,7 +1984,7 @@ class Ra {
           const u = (E = t.getStepSpecificServices(e.stepName)) == null ? void 0 : E.frameService;
           if (!u)
             throw new Error("Frame service unavailable, cannot load pattern!");
-          await this.loadPatternFromString(B, u), t.updateMetadata(e.stepName, { image: B }), t.updateStorage(e.stepName, {
+          await this.loadPatternFromString(B, u, !0), t.updateMetadata(e.stepName, { image: B }), t.updateStorage(e.stepName, {
             framePatternSrc: B
           });
         }
@@ -1984,18 +2016,22 @@ class Ra {
         await t.setSelectionsAndElements(e.stepName, [], o, g);
     }
   }
-  selectImage(e, t, A) {
-    return A.setEditedStatus(e.stepName, !0), (t.fileLink || "").endsWith("pdf") ? new Promise((n) => {
+  selectImage(e, t, A, a = !0) {
+    var o;
+    const n = this.patternSource(t), i = (o = A.getStepStorage(e.stepName)) == null ? void 0 : o.framePatternSrc;
+    return i && i === n ? Promise.resolve() : (A.setEditedStatus(e.stepName, !0), (t.fileLink || "").endsWith("pdf") ? new Promise((r) => {
       A.addPoller(
         new aA(
           async () => {
-            var r;
-            const s = (r = (await G.getLocalOrFromServer(t.key || "")).versions) == null ? void 0 : r.find((g) => g.name === "svg");
-            return s ? (await fetch(s.link)).status === 200 : !1;
+            var d;
+            const B = (d = (await G.getLocalOrFromServer(t.key || "")).versions) == null ? void 0 : d.find((w) => w.name === "svg");
+            return B ? (await fetch(B.link)).status === 200 : !1;
           },
           () => {
-            G.getLocalOrFromServer(t.key || "").then((i) => {
-              this.loadPatternFromAsset(i, e, A).then(n);
+            G.getLocalOrFromServer(t.key || "").then((g) => {
+              this.loadPatternFromAsset(g, e, A, a).then(
+                r
+              );
             });
           },
           () => {
@@ -2003,7 +2039,7 @@ class Ra {
           }
         )
       );
-    }) : this.loadPatternFromAsset(t, e, A);
+    }) : this.loadPatternFromAsset(t, e, A, a));
   }
   async selectVariant(e, t, A, a, n) {
     const i = await this.selectVariantCommand(
@@ -2016,7 +2052,7 @@ class Ra {
     i && (i.command && a.getCommandDispatcher()(i.command), i.followup && await i.followup());
   }
   getCreateElementCommand(e, t, A, a) {
-    return new O(
+    return new T(
       {
         id: e,
         type: k.Frame,
@@ -2044,23 +2080,23 @@ class Ra {
       A
     );
   }
-  async loadPatternFromString(e, t) {
+  async loadPatternFromString(e, t, A) {
     if (e.endsWith("svg")) {
-      const A = await SA(e), a = A.width, n = A.height, i = {
+      const a = await SA(e), n = a.width, i = a.height, s = {
         src: e,
-        width: a,
-        height: n,
-        aspect: a / n
+        width: n,
+        height: i,
+        aspect: n / i
       };
-      Qt.set(e, i), t.setPatternData(i);
+      Qt.set(e, s), t.setPatternData(s, A);
     } else {
-      const A = await YA(e, !0), a = await Rt(A), n = {
+      const a = await YA(e, !0), n = await Rt(a), i = {
         src: e,
-        width: a.width,
-        height: a.height,
-        aspect: a.width / a.height
+        width: n.width,
+        height: n.height,
+        aspect: n.width / n.height
       };
-      Qt.set(e, n), t.setPatternData(n);
+      Qt.set(e, i), t.setPatternData(i, A);
     }
   }
   async selectVariantCommand(e, t, A, a, n, i) {
@@ -2120,7 +2156,7 @@ class Ra {
               )) == null ? void 0 : d.frameService;
               if (!w)
                 throw new Error("Frame service unavailable, cannot load pattern!");
-              await this.loadPatternFromString(i, w);
+              await this.loadPatternFromString(i, w, !0);
             }
           }
         );
@@ -2140,14 +2176,14 @@ class Ra {
       return A;
     throw new he(e);
   }
-  async loadPatternFromAsset(e, t, A) {
-    var s;
-    const a = this.patternSource(e), n = A.markUpdatePending(), i = (s = A.getStepSpecificServices(t.stepName)) == null ? void 0 : s.frameService;
-    if (!i)
+  async loadPatternFromAsset(e, t, A, a) {
+    var o;
+    const n = this.patternSource(e), i = A.markUpdatePending(), s = (o = A.getStepSpecificServices(t.stepName)) == null ? void 0 : o.frameService;
+    if (!s)
       throw new Error("Frame service unavailable, cannot load pattern!");
-    await this.loadPatternFromString(a, i), A.updateMetadata(t.stepName, { image: a }), A.updateStorage(t.stepName, {
-      framePatternSrc: a
-    }), A.markUpdateCompleted(n);
+    await this.loadPatternFromString(n, s, a), A.updateMetadata(t.stepName, { image: n }), A.updateStorage(t.stepName, {
+      framePatternSrc: n
+    }), A.markUpdateCompleted(i);
   }
 }
 const Se = new Ra();
@@ -2160,7 +2196,7 @@ class Ha {
     });
   }
   getCreateElementCommand(e, t, A, a) {
-    return new O(
+    return new T(
       {
         stepRegion: t,
         stepName: a.stepName,
@@ -2564,7 +2600,7 @@ class Ga {
         return console.error(`Can not find layout for region: ${l.panelId}`), null;
       const u = [];
       return d && u.push(new ee(w)), u.push(
-        new O(
+        new T(
           {
             stepRegion: l,
             stepName: e.stepName,
@@ -2692,7 +2728,7 @@ class ba {
       const E = J();
       return {
         regionElement: { id: E, region: l },
-        command: new O(
+        command: new T(
           {
             stepName: e.stepName,
             stepRegion: l,
@@ -2922,7 +2958,7 @@ class La {
         return {
           id: C,
           region: d,
-          command: new O(
+          command: new T(
             {
               stepRegion: d,
               stepName: e.stepName,
@@ -2961,7 +2997,7 @@ class La {
   }
 }
 const le = new La();
-class Oa {
+class Ta {
   constructor() {
     this.latestToast = null, this.toastType = null, this.toastCallbacks = [];
   }
@@ -2986,7 +3022,7 @@ class Oa {
     );
   }
 }
-const Ta = new Oa(), ze = 30;
+const Oa = new Ta(), ze = 30;
 class ve extends Error {
   constructor(e) {
     super(e), Object.setPrototypeOf(this, new.target.prototype), this.name = ve.name;
@@ -3158,7 +3194,7 @@ class Ka {
       fillImage: t
     });
     for (const r of A) {
-      const g = new Te(r.id, t);
+      const g = new Oe(r.id, t);
       n(g);
     }
   }
@@ -3292,7 +3328,7 @@ class Ka {
     if (a.length > 0) {
       const l = a.map((E) => new mt(E.id, g));
       if (o) {
-        const E = a.map((h) => new Te(h.id, o));
+        const E = a.map((h) => new Oe(h.id, o));
         l.push(...E);
       }
       const d = await this.changeInputTextWithRegion(
@@ -3333,7 +3369,7 @@ class Ka {
       ), w = l.flatMap((h) => h.commands);
       if (o) {
         const h = l.map(
-          (u) => new Te(u.regionElement.id, o)
+          (u) => new Oe(u.regionElement.id, o)
         );
         w.push(...h);
       }
@@ -3366,8 +3402,8 @@ class Ka {
         let u;
         if (h && h.variants) {
           const N = h.variants.find((R) => {
-            var T;
-            return R.id === ((T = h.defaultVariant) == null ? void 0 : T.id);
+            var O;
+            return R.id === ((O = h.defaultVariant) == null ? void 0 : O.id);
           }) || h.variants[0];
           u = this.createTextFillSpotColor(h, N), i.updateStorage(e, {
             colorProfileAssetKey: (E = h.colorProfile) == null ? void 0 : E.key
@@ -3420,7 +3456,7 @@ class Ka {
         Q.push(
           this.generateTextChangeCommandsForRegion(F, A, m.id, P)
         );
-        const S = new O(m, d);
+        const S = new T(m, d);
         return {
           regionElement: { id: w, region: B },
           commands: [S, ...Q],
@@ -3431,7 +3467,7 @@ class Ka {
         throw console.log(h), new ve("Error adding font to region");
       }
     }, g = await Promise.all(A.regions.map(r)).catch((B) => {
-      throw B instanceof ve ? (Ta.setLatestToast("Failed to load font.", ke.Error), B) : B instanceof Ge ? B : new Error(B);
+      throw B instanceof ve ? (Oa.setLatestToast("Failed to load font.", ke.Error), B) : B instanceof Ge ? B : new Error(B);
     });
     return await i.setSelectionsAndElements(
       e,
@@ -6470,7 +6506,7 @@ const En = async (c) => {
 }, EA = async (c, e, t, A, a, n, i, s, o, r) => {
   var F;
   await (async () => {
-    var T;
+    var O;
     if (r !== void 0)
       return r;
     await c.outstandingRequestsPromise();
@@ -6482,7 +6518,7 @@ const En = async (c) => {
       context: {
         transactionOwnerId: P
       }
-    }), R = (T = N.data) == null ? void 0 : T.transactions[0].workflowState;
+    }), R = (O = N.data) == null ? void 0 : O.transactions[0].workflowState;
     return N.errors ? (N.errors.forEach((L) => {
       N.errors && console.log("Server Error:", L.message);
     }), null) : R ?? null;
@@ -6492,16 +6528,16 @@ const En = async (c) => {
     let S = 0;
     if (Object.keys(n).length > 0)
       for (const N of Object.keys(n)) {
-        const R = n[N], T = e.steps.find((L) => L.stepName === N);
+        const R = n[N], O = e.steps.find((L) => L.stepName === N);
         for (let L = 0; L < R.selections.length; ++L) {
           const W = R.selections[L];
-          if (T && (!M || T.option && (T.option.variants || []).length > 1 && !T.data.hideSelectionInCart && !T.data.hideSelectionsInCart)) {
-            const Oe = T.stepTitle;
-            P[Oe] ? P[Oe].push({
+          if (O && (!M || O.option && (O.option.variants || []).length > 1 && !O.data.hideSelectionInCart && !O.data.hideSelectionsInCart)) {
+            const Te = O.stepTitle;
+            P[Te] ? P[Te].push({
               id: W.id || "",
               name: W.name,
               priceModifier: W.priceModifier
-            }) : P[Oe] = [
+            }) : P[Te] = [
               {
                 id: W.id || "",
                 name: W.name,
@@ -7117,7 +7153,7 @@ const Dn = [
     if (!w)
       throw new z(d);
     const E = J();
-    return new O(
+    return new T(
       {
         id: E,
         src: g,
@@ -7158,7 +7194,7 @@ const Dn = [
         top: a.y
       });
       return [
-        new O(
+        new T(
           {
             id: l,
             path: B.path,
@@ -7206,7 +7242,7 @@ const Dn = [
   const o = await _(s, !0), r = /<svg.*?<\/svg>/s, g = o.match(r) || [], B = (g == null ? void 0 : g.length) > 0 ? g[0] : "", w = Lt().parseFromString(B, "image/svg+xml").firstElementChild;
   if (!w)
     return console.error("Failed to read SVG."), [];
-  Ot(w);
+  Tt(w);
   const E = {};
   LA(w, (f) => {
     Dn.includes(f.tagName) && !f.attributes.getNamedItem("fill") && f.setAttribute("fill", "#000000");
@@ -7221,7 +7257,7 @@ const Dn = [
       f.classList.add(N), E[N] = { browserValue: P };
     }
   });
-  const u = Tt().serializeToString(w), C = a.colors;
+  const u = Ot().serializeToString(w), C = a.colors;
   if (C) {
     for (const [f, F] of Object.entries(E))
       for (const M of Object.keys(C))
@@ -7235,7 +7271,7 @@ const Dn = [
     if (!F)
       throw new z(f);
     const M = J();
-    return new O(
+    return new T(
       {
         colors: E,
         id: M,
@@ -7264,7 +7300,7 @@ const Dn = [
     if (!r)
       throw new z(o);
     const g = J();
-    return new O(
+    return new T(
       {
         colors: {},
         id: g,
@@ -7307,7 +7343,7 @@ const Dn = [
     if (!d)
       throw new z(l);
     const w = J();
-    return new O(
+    return new T(
       {
         id: w,
         src: s,
@@ -7364,7 +7400,7 @@ const Dn = [
             />
         </svg>
         `, w = { "spiff-fill-shape": { browserValue: i.color || "#000000" } }, E = J();
-    return new O(
+    return new T(
       {
         colors: w,
         id: E,
@@ -7415,7 +7451,7 @@ const Dn = [
           excludeFromExport: e.data.excludeFromPrint,
           preserveAspectRatio: "none"
         };
-        A.push(new O(B, g));
+        A.push(new T(B, g));
       });
     } catch (r) {
       console.error(r);
@@ -7425,7 +7461,7 @@ const Dn = [
       const l = /<svg.*?<\/svg>/s, d = B.match(l) || [], w = (d == null ? void 0 : d.length) > 0 ? d[0] : "", u = Lt().parseFromString(w, "image/svg+xml").firstElementChild;
       if (!u)
         throw new ge("Failed to read SVG.");
-      return Ot(u), Tt().serializeToString(u);
+      return Tt(u), Ot().serializeToString(u);
     };
     o.forEach((B) => {
       const l = c.find((w) => w.panelId === B.panelId);
@@ -7450,7 +7486,7 @@ const Dn = [
         productOverlay: e.type === y.ProductOverlay ? !0 : void 0,
         excludeFromExport: e.data.excludeFromPrint
       };
-      A.push(new O(d, l));
+      A.push(new T(d, l));
     });
   }
   return A;
@@ -7529,7 +7565,7 @@ const Dn = [
         }
       );
       a.push(
-        new O(
+        new T(
           {
             ...C,
             fontSize: I,
@@ -7540,7 +7576,7 @@ const Dn = [
         )
       );
     } else
-      a.push(new O(C, u));
+      a.push(new T(C, u));
   }
   return a;
 }, Rn = (c, e) => c.conditions ? c.conditions.every((t) => {
@@ -7784,7 +7820,7 @@ const Vi = (c, e) => {
     serializableWorkflow: { steps: [] },
     layouts: {}
   };
-  a = new v(t.map((o) => new OA(o))).apply(a);
+  a = new v(t.map((o) => new TA(o))).apply(a);
   const i = await Hn(c, e, t, A);
   return new v(i).apply(a);
 }, bn = D`
@@ -7927,7 +7963,7 @@ const Vi = (c, e) => {
             }
         }
     }
-`, On = D`
+`, Tn = D`
     query GetBundlesForCustomer($id: String!) {
         customers(ids: [$id]) {
             bundleStakeholders {
@@ -7948,7 +7984,7 @@ const Vi = (c, e) => {
             }
         }
     }
-`, Tn = D`
+`, On = D`
     ${uA}
     query GetProductCollectionProducts($id: String!) {
         productCollections(ids: [$id]) {
@@ -8301,12 +8337,11 @@ class ti extends wt {
     const A = await G.getLocalOrFromServer(t);
     if (!A)
       return;
-    await this.applyImageSelection(A, e, !1);
     const a = this.bundle.getGlobalPropertyStateManager().getAspectStorage(this.property.name);
-    a ? this.updateSharedStepStorage({ ...a }) : (this.updateSharedStepStorage({ originalAssetKey: t }), await this.bundle.getGlobalPropertyStateManager().setAspectStorage(this.property.name, { originalAssetKey: t }));
+    await this.applyImageSelection(A, e, !1), a ? this.updateSharedStepStorage({ ...a }) : (this.updateSharedStepStorage({ originalAssetKey: t }), await this.bundle.getGlobalPropertyStateManager().setAspectStorage(this.property.name, { originalAssetKey: t }));
   }
   async applyImageSelection(e, t, A = !0) {
-    const n = this.getSharedSteps(t).map((i) => i.selectImage(e, A));
+    const n = this.getSharedSteps(t).map((i) => i.selectImage(e, A, !1));
     await Promise.all(n);
   }
   updateSharedStepStorage(e) {
@@ -8726,7 +8761,7 @@ class ci {
     if (this.collection.productCollectionProducts)
       return this.collection.productCollectionProducts.map((t) => new je(t));
     const e = await x.getShadowGraphqlClient().query({
-      query: Tn,
+      query: On,
       variables: {
         id: this.getId()
       },
@@ -10640,7 +10675,7 @@ class Ni {
     if (!this.customer)
       throw new Error("Customer not authenticated.");
     const e = await x.getShadowGraphqlClient().query({
-      query: On,
+      query: Tn,
       variables: {
         id: this.customer.id
       },
@@ -10790,7 +10825,7 @@ class Ni {
         return {
           transaction: S,
           workflowId: S.workflowId,
-          readOnly: ((R = Q.find((T) => T.option.transactionId === S.id)) == null ? void 0 : R.option.readOnly) ?? !1,
+          readOnly: ((R = Q.find((O) => O.option.transactionId === S.id)) == null ? void 0 : R.option.readOnly) ?? !1,
           index: Q[N].index
         };
       });
@@ -10828,14 +10863,14 @@ class Ni {
       ...r.map(a),
       ...g.map(n)
     ])).flat(), l = [...new Set(B.map((Q) => Q.workflowId))], d = await pA(l, t), w = new Map(d.map((Q) => [Q.id, Q])), E = Y.getMap("transactionOwnerIds") || /* @__PURE__ */ new Map(), h = B.map(async (Q) => {
-      var T;
+      var O;
       const { transaction: p, workflowId: f, readOnly: F, index: M } = Q, P = w.get(f), S = e[M];
       !E.get(p.id) && p.transactionOwnerId && E.set(p.id, p.transactionOwnerId);
       const N = E.get(p.id) || void 0, R = {
         product: p.product,
         transaction: p,
         layouts: [],
-        singleVariantsRenderable: (T = S == null ? void 0 : S.workflowConfiguration) == null ? void 0 : T.singleVariantsRenderable,
+        singleVariantsRenderable: (O = S == null ? void 0 : S.workflowConfiguration) == null ? void 0 : O.singleVariantsRenderable,
         stateMutationFunc: F ? async () => {
           throw new b("State mutation is forbidden in read only mode!");
         } : async (L) => this.updateTransactionState({ ...L, context: { transactionOwnerId: N } }),
@@ -11252,14 +11287,15 @@ class Hi extends X {
    * Updates the image selection inside the frame.
    * @param asset The asset to use.
    * @param storeAsOriginal Optional: Store this asset as the original, unmodified version of the image. Default: `true`.
+   * @param [recalculateOffsets=true] Optional: Recalculates the offsets of the image inside the frame. Default: `true`.
    */
-  async selectImage(e, t = !0) {
-    var A;
-    if (await Se.selectImage(this.step, e, this.manager), t) {
-      const a = ((A = this.manager.getStepStorage(this.step.stepName)) == null ? void 0 : A.framePatternData) || {};
+  async selectImage(e, t = !0, A = !0) {
+    var a;
+    if (await Se.selectImage(this.step, e, this.manager, A), t) {
+      const n = ((a = this.manager.getStepStorage(this.step.stepName)) == null ? void 0 : a.framePatternData) || {};
       this.manager.updateStorage(this.step.stepName, {
         framePatternData: {
-          ...a,
+          ...n,
           originalAssetKey: e.key,
           backgroundRemovedAssetKey: void 0,
           useOriginalAsset: void 0
@@ -11285,7 +11321,7 @@ class Hi extends X {
     if (!t)
       throw new Error("You must supply an image selection before attempting to remove the background.");
     const A = await G.removeBackgroundFromAsset(t);
-    e && await Se.selectImage(this.step, A, this.manager);
+    e && await Se.selectImage(this.step, A, this.manager, !1);
     const a = ((n = this.manager.getStepStorage(this.step.stepName)) == null ? void 0 : n.framePatternData) || {};
     return this.manager.updateStorage(this.step.stepName, {
       framePatternData: {
@@ -11340,14 +11376,14 @@ class Hi extends X {
     if (!A)
       throw new Error("You must provide an image selection before calling setUseOriginalImageSelection");
     if (e)
-      await this.selectImage(A, !1);
+      await this.selectImage(A, !1, !1);
     else {
       const n = await this.getBackgroundRemovedImageSelection();
       if (!n)
         throw new Error(
           "You must call removeBackgroundFromImageSelection before attempting to apply the image."
         );
-      await this.selectImage(n, !1);
+      await this.selectImage(n, !1, !1);
     }
     this.manager.updateStorage(this.step.stepName, {
       framePatternData: { ...t, useOriginalAsset: e }
@@ -11476,5 +11512,5 @@ export {
   $ as spiffCoreConfiguration,
   Vi as stepAspectValuesToDesignInputSteps,
   j as textStepService,
-  Ta as toast
+  Oa as toast
 };