@spiffcommerce/core 34.4.7 → 34.4.8

package/dist/index.mjs

@@ -332,26 +332,31 @@ class di {
       fetch: ci
     }), e = Pr(async (i, o) => {
       const { headers: s } = o, l = s || {}, c = await li();
-      let d = o.bearer ?? c.bearer;
-      if (this.spiffClient)
+      let d = o.bearer ?? c.bearer, A;
+      if (this.spiffClient) {
         try {
           d = await this.spiffClient.loggedInBearerToken();
         } catch {
         }
-      const A = o.partnerId ?? c.partnerId, u = o.activeIntegration ?? c.activeIntegration, h = o.transactionOwnerId, g = o.customerToken ?? c.customerToken, m = o.applicationKey ?? c.applicationKey, p = o.bundleOwnerId;
+        try {
+          A = await this.spiffClient.getIntegration();
+        } catch {
+        }
+      }
+      const u = o.partnerId ?? c.partnerId, h = o.activeIntegration ?? c.activeIntegration, g = o.transactionOwnerId, m = o.customerToken ?? c.customerToken, p = o.applicationKey ?? c.applicationKey, f = o.bundleOwnerId;
       try {
         if (window && window.__SENTRY__) {
-          const f = window.__SENTRY__.hub;
-          if (f) {
-            const v = f.traceHeaders();
-            Object.entries(v).forEach(([w, x]) => {
-              l[w] = x;
+          const S = window.__SENTRY__.hub;
+          if (S) {
+            const w = S.traceHeaders();
+            Object.entries(w).forEach(([x, v]) => {
+              l[x] = v;
             });
           }
         }
       } catch {
       }
-      return d && (l.Authorization = `Bearer ${d}`), A && (l.partnerId = A), u && (l.activeIntegration = u), h && (l.transactionOwnerId = h), g && (l.customerToken = g), m && (l["X-Application-Key"] = m), p && (l.bundleOwnerId = p), l["Allow-Moonlight-Redirect"] = "true", {
+      return d && (l.Authorization = `Bearer ${d}`), u && (l.partnerId = u), h && (l.activeIntegration = h), g && (l.transactionOwnerId = g), m && (l.customerToken = m), p && (l["X-Application-Key"] = p), f && (l.bundleOwnerId = f), A?.partner?.beta && (l["X-Spiff-Beta"] = "true"), l["Allow-Moonlight-Redirect"] = "true", {
         headers: l
       };
     }), a = xr(({ operation: i, graphQLErrors: o, networkError: s }) => {
@@ -5311,14 +5316,14 @@ const T = () => {
   viewBox: A,
   width: u
 }) => {
-  const h = e || 0, g = 2 * (l?.scale || 1), m = A || { x: 0, y: 0, width: u, height: i }, p = `${m.x} ${m.y} ${m.width} ${m.height}`, f = T(), v = a.purpose === Yt.FreeDesign && /* @__PURE__ */ P("defs", { children: /* @__PURE__ */ P("clipPath", { id: "viewboxClip", children: /* @__PURE__ */ P("rect", { width: m.width, height: m.height, rx: h }) }) }), w = a.colorProfiles?.map((S, I) => (
+  const h = e || 0, g = 2 * (l?.scale || 1), m = A || { x: 0, y: 0, width: u, height: i }, p = `${m.x} ${m.y} ${m.width} ${m.height}`, f = T(), S = a.purpose === Yt.FreeDesign && /* @__PURE__ */ P("defs", { children: /* @__PURE__ */ P("clipPath", { id: "viewboxClip", children: /* @__PURE__ */ P("rect", { width: m.width, height: m.height, rx: h }) }) }), w = a.colorProfiles?.map((E, I) => (
     /* @ts-ignore */
-    /* @__PURE__ */ P("color-profile", { name: S.name, xlinkHref: S.key, children: " " }, I)
-  )), x = r.map((S) => ({
-    ...S,
+    /* @__PURE__ */ P("color-profile", { name: E.name, xlinkHref: E.key, children: " " }, I)
+  )), x = r.map((E) => ({
+    ...E,
     _renderingConfiguration: a,
     mask: l ? `url(#viewmask-${f})` : void 0
-  })), E = Ma(x);
+  })), v = Ma(x);
   return /* @__PURE__ */ ct(
     "svg",
     {
@@ -5339,7 +5344,7 @@ const T = () => {
       viewBox: p,
       children: [
         w,
-        v,
+        S,
         !!n && /* @__PURE__ */ P(
           "rect",
           {
@@ -5355,7 +5360,7 @@ const T = () => {
           {
             id: "element-group",
             clipPath: a.purpose === Yt.FreeDesign ? "url(#viewboxClip)" : void 0,
-            children: E.map((S) => Xn(S)).filter((S) => !!S)
+            children: v.map((E) => Xn(E)).filter((E) => !!E)
           }
         ),
         l && /* @__PURE__ */ P(
@@ -5397,12 +5402,12 @@ const T = () => {
     }
   );
 }, hd = (n, t, e, a, r) => {
-  const i = Ct(r), o = e / 2, s = a / 2, l = n + o, c = t + s, d = Math.sin(i), A = Math.cos(i), u = o, h = o, g = -s, m = s, p = u * A - g * d, f = h * A - m * d, v = u * d + g * A, w = h * d + m * A, x = Math.max(Math.abs(p), Math.abs(f)), E = Math.max(Math.abs(v), Math.abs(w));
+  const i = Ct(r), o = e / 2, s = a / 2, l = n + o, c = t + s, d = Math.sin(i), A = Math.cos(i), u = o, h = o, g = -s, m = s, p = u * A - g * d, f = h * A - m * d, S = u * d + g * A, w = h * d + m * A, x = Math.max(Math.abs(p), Math.abs(f)), v = Math.max(Math.abs(S), Math.abs(w));
   return {
     minX: l - x,
     maxX: l + x,
-    minY: c - E,
-    maxY: c + E
+    minY: c - v,
+    maxY: c + v
   };
 }, gd = (n, t, e) => {
   const a = Math.sqrt(Math.pow(t.x - n.x, 2) + Math.pow(t.y - n.y, 2)), r = Math.sqrt(Math.pow(t.x - e.x, 2) + Math.pow(t.y - e.y, 2)), i = Math.sqrt(Math.pow(e.x - n.x, 2) + Math.pow(e.y - n.y, 2));
@@ -5710,22 +5715,22 @@ const yo = (n) => n.substring(0, 5).toLowerCase().trim() === "data:", Je = /* @_
   });
   const o = e.querySelectorAll("tspan");
   for (let d = 0; d < o.length; d++) {
-    const A = o.item(d), u = A.closest("text"), h = A.closest("g"), g = u.getAttribute("font-family"), m = await Tt(r.get(g)), p = Tr(A.innerHTML), f = u.getAttribute("fill"), v = u.getAttribute("stroke"), w = u.getAttribute("stroke-width"), x = m.getPath(
+    const A = o.item(d), u = A.closest("text"), h = A.closest("g"), g = u.getAttribute("font-family"), m = await Tt(r.get(g)), p = Tr(A.innerHTML), f = u.getAttribute("fill"), S = u.getAttribute("stroke"), w = u.getAttribute("stroke-width"), x = m.getPath(
       p,
       0,
       0,
       parseInt(u.getAttribute("font-size") ?? "72")
-    ), E = x.getBoundingBox().x2 - x.getBoundingBox().x1;
-    let S = 0;
+    ), v = x.getBoundingBox().x2 - x.getBoundingBox().x1;
+    let E = 0;
     const I = A.getAttribute("text-anchor");
-    I === "middle" ? S = E / 2 : I === "end" && (S = E);
+    I === "middle" ? E = v / 2 : I === "end" && (E = v);
     const N = m.getPath(
       p,
-      parseFloat(A.getAttribute("x") ?? "0") - S,
+      parseFloat(A.getAttribute("x") ?? "0") - E,
       parseFloat(A.getAttribute("y") ?? "0"),
       parseInt(u.getAttribute("font-size") ?? "72")
     );
-    N.fill = f, N.stroke = v, N.strokeWidth = parseFloat(w ?? "0");
+    N.fill = f, N.stroke = S, N.strokeWidth = parseFloat(w ?? "0");
     const R = N.toSVG(2), M = t.parseFromString(R, "image/svg+xml").firstElementChild;
     h.appendChild(M);
   }
@@ -7685,7 +7690,7 @@ class De {
     i && i(!0);
     const c = t.data.initialZoomLevel, d = await Promise.all(
       t.data.regions.map(async (h, g) => {
-        const m = await Le(l[g]), p = s.getImageData(), f = a.map((I) => new Nt(I.id)), v = p ? Ta(
+        const m = await Le(l[g]), p = s.getImageData(), f = a.map((I) => new Nt(I.id)), S = p ? Ta(
           p,
           m,
           c && !t.data.forceImageCover ? { scale: c } : void 0,
@@ -7693,18 +7698,18 @@ class De {
         ) : void 0, w = p ? {
           id: T(),
           src: p.src,
-          x: v?.x || 0,
-          y: v?.y || 0,
+          x: S?.x || 0,
+          y: S?.y || 0,
           width: p.width,
           height: p.height,
-          scaleX: v?.zoom || 1,
-          scaleY: v?.zoom || 1,
+          scaleX: S?.zoom || 1,
+          scaleY: S?.zoom || 1,
           rotation: 0
-        } : void 0, x = T(), S = r.getLayouts().find((I) => I.panelId === h.panelId);
-        if (!S)
+        } : void 0, x = T(), E = r.getLayouts().find((I) => I.panelId === h.panelId);
+        if (!E)
           throw new Y(h);
         return {
-          command: this.getCreateElementCommand(x, h, g, S, {
+          command: this.getCreateElementCommand(x, h, g, E, {
             frameData: m,
             pattern: w,
             disablePlaceholder: t.data.disablePlaceholder,
@@ -7949,14 +7954,14 @@ class Go {
     const l = s.fileLink;
     if (!l)
       throw new Jt(s);
-    const c = await st(await this.getIllustrationBody(l)), d = await _t(c.svg), A = (f, v) => {
-      const w = i.getLayouts().find((E) => E.panelId === f.panelId);
+    const c = await st(await this.getIllustrationBody(l)), d = await _t(c.svg), A = (f, S) => {
+      const w = i.getLayouts().find((v) => v.panelId === f.panelId);
       if (!w)
         throw new Y(f);
       const x = T();
       return {
-        regionElement: { id: x, region: f, regionIndex: v },
-        command: this.getCreateElementCommand(x, f, v, w, {
+        regionElement: { id: x, region: f, regionIndex: S },
+        command: this.getCreateElementCommand(x, f, S, w, {
           stepName: t.stepName,
           src: l,
           objectURL: d,
@@ -7967,47 +7972,47 @@ class Go {
     let m = Array.from(Object.values(c.colors)).map((f) => f.browserValue);
     const p = t.data.colorOption;
     return p && p.variants?.forEach((f) => {
-      m = m.map((v) => v.toLowerCase() === f.color?.toLowerCase() ? f.name : v);
+      m = m.map((S) => S.toLowerCase() === f.color?.toLowerCase() ? f.name : S);
     }), i.updateMetadata(t.stepName, { colors: m }), {
       command: new U(g),
       followup: async () => {
         await i.setSelectionsAndElements(
           t.stepName,
           [e],
-          u.map((v) => v.regionElement),
+          u.map((S) => S.regionElement),
           async () => {
             r(!1);
           }
         );
         const f = s.assetConfiguration?.defaultColorVariants || [];
         if (f.length !== 0) {
-          const v = {};
+          const S = {};
           (s.assetConfiguration?.channelNumbers || []).forEach((x) => {
-            const E = f.find((S) => S.channelNumber === x.number);
-            E && (v[`${x.id.replace(/\W/g, "")}`] = { browserValue: E?.variant?.color || "" });
+            const v = f.find((E) => E.channelNumber === x.number);
+            v && (S[`${x.id.replace(/\W/g, "")}`] = { browserValue: v?.variant?.color || "" });
           }), await this.changeColors(
             t,
             u.map((x) => x.regionElement),
             i,
             () => i.getCommandContext().getAllLayouts(),
-            new Map(Object.entries(v))
+            new Map(Object.entries(S))
           );
         }
         if (t.data.colorPickerEnabled) {
-          const v = await this.availableColors(t, i) || [], w = Object.keys(c.colors), x = v.length === 1 && w.length === 1;
+          const S = await this.availableColors(t, i) || [], w = Object.keys(c.colors), x = S.length === 1 && w.length === 1;
           if (x) {
-            const E = v[0], S = w[0];
+            const v = S[0], E = w[0];
             await this.changeColors(
               t,
               u.map((I) => I.regionElement),
               i,
               () => i.getCommandContext().getAllLayouts(),
-              /* @__PURE__ */ new Map([[S, E.variant.color]])
+              /* @__PURE__ */ new Map([[E, v.variant.color]])
             );
           }
           !x && f.length === 0 && await this.changeColors(
             t,
-            u.map((E) => E.regionElement),
+            u.map((v) => v.regionElement),
             i,
             () => i.getCommandContext().getAllLayouts(),
             /* @__PURE__ */ new Map()
@@ -8218,7 +8223,7 @@ class Ho {
       return console.error("Missing configuration."), null;
     a.updateStorage(t.stepName, { text: e }), a.updateMetadata(t.stepName, { text: e });
     const c = (d, A, u, h) => {
-      const g = h || T(), p = a.getLayouts().find((v) => v.panelId === A.panelId);
+      const g = h || T(), p = a.getLayouts().find((S) => S.panelId === A.panelId);
       if (!p)
         return console.error(`Can not find layout for region: ${A.panelId}`), null;
       const f = [];
@@ -8573,9 +8578,9 @@ class Jo {
                     </svg>
                 `, f = {};
         f[this.shapeFillId] = { browserValue: m };
-        const v = T();
+        const S = T();
         return {
-          id: v,
+          id: S,
           region: u,
           command: new W(
             {
@@ -8583,7 +8588,7 @@ class Jo {
               stepRegionIndex: h,
               stepName: t.stepName,
               colors: f,
-              id: v,
+              id: S,
               svg: p,
               type: D.Illustration,
               y: u.top,
@@ -8655,7 +8660,7 @@ const _o = new Ko(), ea = (n, t, e, a, r) => {
     const A = Math.max(...s);
     if (A <= n.width)
       return [i, A];
-    const u = s.reduce((p, f, v, w) => f > w[p] ? v : p, 0), h = i[u];
+    const u = s.reduce((p, f, S, w) => f > w[p] ? S : p, 0), h = i[u];
     let g = !1, m = h.length;
     for (; !g && m > -1; ) {
       m = h.lastIndexOf(" ", m - 1);
@@ -8983,7 +8988,7 @@ class Zo {
           const m = e.getWorkflowExperience().getBundle();
           if (m && t.globalPropertyAspectConfigurations) {
             const f = m.getGlobalPropertyConfiguration()?.aspects?.find(
-              (v) => v.type === z.Text && t.globalPropertyAspectConfigurations?.map((w) => w.aspectName).includes(v.name)
+              (S) => S.type === z.Text && t.globalPropertyAspectConfigurations?.map((w) => w.aspectName).includes(S.name)
             );
             if (f) {
               const w = m.getGlobalPropertyStateManager().getAspect(f.name);
@@ -8996,7 +9001,7 @@ class Zo {
             u,
             async () => {
               e.updateMetadata(t.stepName, { color: h, text: g }), e.updateStorage(t.stepName, { text: g, inputText: g });
-              const p = s.map((v) => new tn(v.id, A)), f = new U(p);
+              const p = s.map((S) => new tn(S.id, A)), f = new U(p);
               e.getCommandDispatcher()(f);
             }
           ), s.length === 0 && l) {
@@ -9187,14 +9192,14 @@ class Zo {
         if (!m)
           throw new ke("Failed to find layout for region: " + u.panelId);
         const f = a.colorOption;
-        let v;
+        let S;
         if (f && f.variants) {
           const F = O.getDefaultVariant(f);
-          F && (v = this.createTextFillSpotColor(f, F), o.updateStorage(t, {
+          F && (S = this.createTextFillSpotColor(f, F), o.updateStorage(t, {
             colorProfileAssetKey: f.colorProfile?.key
           }));
         }
-        const w = await this.getDefaultColor(a), x = w || "#000000", E = {
+        const w = await this.getDefaultColor(a), x = w || "#000000", v = {
           stepRegion: u,
           stepRegionIndex: h,
           stepName: t,
@@ -9218,34 +9223,34 @@ class Zo {
           verticalAlign: a.verticalAlign || "middle",
           curved: a.curved,
           paths: a.paths,
-          fillSpotColorDefinition: v
-        }, S = [], I = /* @__PURE__ */ new Map(), N = /* @__PURE__ */ new Map();
-        if (!E.fontData) throw new Q("Failed to resolve font data for text.");
+          fillSpotColorDefinition: S
+        }, E = [], I = /* @__PURE__ */ new Map(), N = /* @__PURE__ */ new Map();
+        if (!v.fontData) throw new Q("Failed to resolve font data for text.");
         const [R, B] = Ce(
-          E.fontSize,
-          E.fontData,
+          v.fontSize,
+          v.fontData,
           {
-            left: E.x,
-            top: E.y,
-            width: E.width,
-            height: E.height,
-            rotation: E.rotation,
+            left: v.x,
+            top: v.y,
+            width: v.width,
+            height: v.height,
+            rotation: v.rotation,
             panelId: ""
           },
           [c],
           { size: a.size, minSize: a.minSize, maxSize: a.maxSize }
         );
-        I.set(E.id, R), N.set(E.id, B);
+        I.set(v.id, R), N.set(v.id, B);
         const M = a.curved || a.vertical ? c : (B || []).join(`
 `);
-        S.push(
-          this.generateTextChangeCommandsForRegion(R, a, E.id, M)
+        E.push(
+          this.generateTextChangeCommandsForRegion(R, a, v.id, M)
         );
-        const L = new W(E, m);
+        const L = new W(v, m);
         return {
           regionElement: { id: p, region: u, regionIndex: h },
-          commands: [L, ...S],
-          newElement: E,
+          commands: [L, ...E],
+          newElement: v,
           fontData: r
         };
       } catch (f) {
@@ -9280,49 +9285,49 @@ class Zo {
    */
   async changeInputTextWithRegion(t, e, a, r, i, o, s, l, c, d) {
     const A = (r || "").replace(/^(?![\u000A\u000D])[\u0000-\u001F\u007F-\u009F]/g, ""), u = xt(A, o), h = this.getProcessedInput(u, t.data, s), g = o.getRegionElements(t.stepName), m = /* @__PURE__ */ new Map(), p = /* @__PURE__ */ new Map();
-    for (const E of g)
-      if (E.region) {
-        const [S, I] = Ce(
+    for (const v of g)
+      if (v.region) {
+        const [E, I] = Ce(
           e,
           a,
-          E.region,
+          v.region,
           [h],
           { size: t.data.size, minSize: t.data.minSize, maxSize: t.data.maxSize }
         );
-        m.set(E.id, S), p.set(E.id, I);
+        m.set(v.id, E), p.set(v.id, I);
       }
-    const v = (() => {
+    const S = (() => {
       if (t.data && t.data.maxLength && h.length > t.data.maxLength)
         return d && d(!0), { info: "0" };
-      const E = o.getWorkflowExperience().getProfanityList(), S = la(h.toLowerCase());
-      for (const I of S)
-        for (const N in E) {
-          const R = E[N].toLowerCase().replace(/\s/g, "");
+      const v = o.getWorkflowExperience().getProfanityList(), E = la(h.toLowerCase());
+      for (const I of E)
+        for (const N in v) {
+          const R = v[N].toLowerCase().replace(/\s/g, "");
           if (I === R)
             return l(!0), { error: "Blocked profanity." };
         }
       return !t.data.vertical && !t.data.allowNewlines && (h.includes(`
 `) || h.includes("\r")) ? (l(!0), { error: "Cannot span multiple lines." }) : !t.data.curved && !Array.from(p.values()).every((N) => N) ? (l(!0), { error: "Does not fit." }) : (l(!1), { info: (t.data.maxLength - h.length).toString() });
     })();
-    if (v.error) {
-      c(v.error);
+    if (S.error) {
+      c(S.error);
       return;
     }
-    if (c(`${v.info} characters remaining` || ""), d)
+    if (c(`${S.info} characters remaining` || ""), d)
       return;
     o.updateStorage(t.stepName, { text: A }), o.updateMetadata(t.stepName, {
       text: this.injectReplaceableText(A, t.data)
     }), (i.defaultCleared || !t.data.deleteDefaultOnFocus) && A.trim() !== "" && o.setMandatoryFulfilled(t.stepName, !0);
     const w = [];
-    for (const E of g) {
-      const S = t.data.curved ? h : (p.get(E.id) || []).join(`
+    for (const v of g) {
+      const E = t.data.curved ? h : (p.get(v.id) || []).join(`
 `);
       w.push(
         this.generateTextChangeCommandsForRegion(
-          m.get(E.id) || 1,
+          m.get(v.id) || 1,
           t.data,
-          E.id,
-          S
+          v.id,
+          E
         )
       );
     }
@@ -9490,10 +9495,10 @@ class ls extends ts {
       w.classList.add("module-text-group");
       const x = et("defs");
       w.appendChild(x), x.appendChild(ns(0, 2, 2, "shadow"));
-      const E = et("path");
-      E.setAttribute("d", d), E.setAttribute("stroke", "black"), E.setAttribute("stroke-width", "3"), x.appendChild(E);
-      const S = et("g");
-      S.classList.add("module-layer0"), w.appendChild(S), S.setAttribute("filter", "url(#shadow)"), S.innerHTML = E.outerHTML;
+      const v = et("path");
+      v.setAttribute("d", d), v.setAttribute("stroke", "black"), v.setAttribute("stroke-width", "3"), x.appendChild(v);
+      const E = et("g");
+      E.classList.add("module-layer0"), w.appendChild(E), E.setAttribute("filter", "url(#shadow)"), E.innerHTML = v.outerHTML;
       const I = et("g");
       I.classList.add("module-layer1"), w.appendChild(I), I.setAttribute("stroke-width", "3"), I.setAttribute("stroke", "rgb(45,41,38)"), I.setAttribute("fill", "rgb(45,41,38)"), I.setAttribute("transform", "translate(0.5,0)"), I.innerHTML = s;
       const N = et("g");
@@ -9512,8 +9517,8 @@ class ls extends ts {
     p.classList.add("module-text-enclosure"), u.appendChild(p);
     const f = A();
     p.appendChild(f);
-    const v = Rr(d);
-    return is(p, v, e.height, e.width, 0.35, 0.65), rs(u.outerHTML);
+    const S = Rr(d);
+    return is(p, S, e.height, e.width, 0.35, 0.65), rs(u.outerHTML);
   }
 }
 async function dr(n) {
@@ -9621,7 +9626,7 @@ const cs = [
   const r = e.data, i = a.option;
   if (!i)
     return console.error(`No option for step ${a.stepName}.`), [];
-  const o = i.variants?.find((E) => E.id === r.illustrationVariantId) || O.getDefaultVariant(i, a.overrideDefaultVariantId);
+  const o = i.variants?.find((v) => v.id === r.illustrationVariantId) || O.getDefaultVariant(i, a.overrideDefaultVariantId);
   if (!o)
     return console.error(`No variant with ID: ${r.illustrationVariantId}`), [];
   if (!o.asset)
@@ -9635,32 +9640,32 @@ const cs = [
     return console.error("Failed to read SVG."), [];
   Pa(g);
   const m = {};
-  Ft(g, (E) => {
-    cs.includes(E.tagName) && !E.attributes.getNamedItem("fill") && E.setAttribute("fill", "#000000");
-    const S = E.attributes.getNamedItem("fill");
-    if (S && S.value !== "none") {
-      const N = S.value, B = `spiff-fill-${N.replace(/\W/g, "")}`;
-      E.classList.add(B), m[B] = { browserValue: N };
-    }
-    const I = E.attributes.getNamedItem("stroke");
+  Ft(g, (v) => {
+    cs.includes(v.tagName) && !v.attributes.getNamedItem("fill") && v.setAttribute("fill", "#000000");
+    const E = v.attributes.getNamedItem("fill");
+    if (E && E.value !== "none") {
+      const N = E.value, B = `spiff-fill-${N.replace(/\W/g, "")}`;
+      v.classList.add(B), m[B] = { browserValue: N };
+    }
+    const I = v.attributes.getNamedItem("stroke");
     if (I && I.value !== "none") {
       const N = I.value, B = `spiff-stroke-${N.replace(/\W/g, "")}`;
-      E.classList.add(B), m[B] = { browserValue: N };
+      v.classList.add(B), m[B] = { browserValue: N };
     }
   });
-  const f = It().serializeToString(g), v = r.colors;
-  if (v) {
-    for (const [E, S] of Object.entries(m))
-      for (const I of Object.keys(v))
-        if (S.browserValue === I) {
-          m[E] = { browserValue: v[I] };
+  const f = It().serializeToString(g), S = r.colors;
+  if (S) {
+    for (const [v, E] of Object.entries(m))
+      for (const I of Object.keys(S))
+        if (E.browserValue === I) {
+          m[v] = { browserValue: S[I] };
           break;
         }
   }
-  const w = (E) => {
-    const S = n.find((N) => N.panelId === E.panelId);
-    if (!S)
-      throw new Y(E);
+  const w = (v) => {
+    const E = n.find((N) => N.panelId === v.panelId);
+    if (!E)
+      throw new Y(v);
     const I = T();
     return new W(
       {
@@ -9668,22 +9673,22 @@ const cs = [
         id: I,
         svg: f,
         type: D.Illustration,
-        y: E.top,
-        x: E.left,
-        rotation: E.rotation,
-        width: E.width,
-        height: E.height,
-        layer: E.layer,
-        layerIndex: E.layerIndex,
-        immutable: E.immutable
+        y: v.top,
+        x: v.left,
+        rotation: v.rotation,
+        width: v.width,
+        height: v.height,
+        layer: v.layer,
+        layerIndex: v.layerIndex,
+        immutable: v.immutable
       },
-      S
+      E
     );
   }, x = a.data.regions;
   try {
     return x.map(w);
-  } catch (E) {
-    return console.error(E), [];
+  } catch (v) {
+    return console.error(v), [];
   }
 }, hs = async (n, t, e) => {
   const a = await dr(e.data.module), r = t.data, i = (s, l) => {
@@ -9885,9 +9890,9 @@ const cs = [
     if (!f || !f.asset)
       return;
     t[a.stepName] = { selectedVariants: [f] };
-    const v = f.asset.fileLink;
-    if (v)
-      return v;
+    const S = f.asset.fileLink;
+    if (S)
+      return S;
   }, d = await (async () => {
     const p = l();
     if (!p)
@@ -9908,7 +9913,7 @@ const cs = [
     const f = n.find((w) => w.panelId === p.panelId);
     if (!f)
       continue;
-    const v = {
+    const S = {
       stepName: e.name,
       id: T(),
       align: s(a.data),
@@ -9949,16 +9954,16 @@ const cs = [
       r.push(
         new W(
           {
-            ...v,
+            ...S,
             fontSize: w,
-            text: v.curved ? v.text : (x || []).join(`
+            text: S.curved ? S.text : (x || []).join(`
 `)
           },
           f
         )
       );
     } else
-      r.push(new W(v, f));
+      r.push(new W(S, f));
   }
   return r;
 }, Cs = (n, t) => n.conditions ? n.conditions.every((e) => {
@@ -11001,7 +11006,7 @@ const rl = (n) => n.sort((t, e) => t.index - e.index).map((t) => ({
       a.type === we.FirstName ? e[r] = t?.firstName : a.type === we.LastName ? e[r] = t?.lastName : a.type === we.Custom && (a.customFieldIndex === 1 ? e[r] = t?.customField1 : a.customFieldIndex === 2 ? e[r] = t?.customField2 : a.customFieldIndex === 3 ? e[r] = t?.customField3 : a.customFieldIndex === 4 ? e[r] = t?.customField4 : a.customFieldIndex === 5 && (e[r] = t?.customField5), a.option && (e[r] = a.option.variants?.find((i) => i.id === e[r])?.name));
     }), e;
   }
-  async updateRecipient(t, e, a, r, i, o, s, l, c, d, A, u, h, g, m, p, f, v) {
+  async updateRecipient(t, e, a, r, i, o, s, l, c, d, A, u, h, g, m, p, f, S) {
     const w = this.experience.getTransaction();
     if (w.recipient?.id)
       this.experience.getTransaction().recipient = {
@@ -11046,7 +11051,7 @@ const rl = (n) => n.sort((t, e) => t.index - e.index).map((t) => ({
           customField4: m || w.recipient.customField4,
           customField5: p || w.recipient.customField5,
           conversionConfigurationId: f || w.recipient.conversionConfigurationId,
-          prevalidated: v
+          prevalidated: S
         }
       });
     else {
@@ -11586,14 +11591,14 @@ const rl = (n) => n.sort((t, e) => t.index - e.index).map((t) => ({
     this.stepSelections = {
       ...this.stepSelections,
       [t]: { selectedVariants: e }
-    }, this.selectionCost = Object.values(this.stepSelections).reduce((S, I) => S + I.selectedVariants.map((N) => N.priceModifier || 0).reduce((N, R) => N + R, 0), 0), i.steps.forEach((S) => {
-      vt(S, this.stepSelections) || (this.stepInitialised[S.stepName] = !1, delete this.stepMetadata[S.stepName], delete this.stepSelections[S.stepName], delete this.storage[S.stepName]);
+    }, this.selectionCost = Object.values(this.stepSelections).reduce((E, I) => E + I.selectedVariants.map((N) => N.priceModifier || 0).reduce((N, R) => N + R, 0), 0), i.steps.forEach((E) => {
+      vt(E, this.stepSelections) || (this.stepInitialised[E.stepName] = !1, delete this.stepMetadata[E.stepName], delete this.stepSelections[E.stepName], delete this.storage[E.stepName]);
     });
-    const s = this.allScenes, l = yt(s, o), c = yt(s, this.stepSelections), d = l.map((S) => S.silentSteps).flat(), u = c.map((S) => S.silentSteps).flat().filter(
-      (S) => !d.some((I) => I.stepName === S.stepName)
+    const s = this.allScenes, l = yt(s, o), c = yt(s, this.stepSelections), d = l.map((E) => E.silentSteps).flat(), u = c.map((E) => E.silentSteps).flat().filter(
+      (E) => !d.some((I) => I.stepName === E.stepName)
     );
-    d.forEach((S) => {
-      vt(S, this.stepSelections) || (this.stepInitialised[S.stepName] = !1);
+    d.forEach((E) => {
+      vt(E, this.stepSelections) || (this.stepInitialised[E.stepName] = !1);
     });
     const h = this.getInvalidCanvasRegions(), { stepElements: g, commands: m } = await this.stepElementsForIntroducedSilentSteps(u, !1);
     this.stepElements = {
@@ -11601,14 +11606,14 @@ const rl = (n) => n.sort((t, e) => t.index - e.index).map((t) => ({
       ...g,
       [t]: a
     }, this.removeElements(h);
-    const p = i.steps.find((S) => S.stepName === t);
+    const p = i.steps.find((E) => E.stepName === t);
     p?.type === b.Frame && this.getWorkflowExperience().getStepById(p.stepName)?.frameService?.setTargetElements(a.map((I) => I.id));
-    const f = h.map((S) => new Nt(S.id)), v = new Za(this.constructSerializableWorkflow()), w = [...m, ...f, v];
+    const f = h.map((E) => new Nt(E.id)), S = new Za(this.constructSerializableWorkflow()), w = [...m, ...f, S];
     w.length > 0 && this.commandContext.apply(new U(w), !0), await this.ensureStepsAreLoaded(), this.onElementsChange();
-    const x = this.getInvalidModelVariants(), E = this.modelContainer;
-    if (E) {
-      const S = x.map(
-        (I) => E.applyModelVariant(
+    const x = this.getInvalidModelVariants(), v = this.modelContainer;
+    if (v) {
+      const E = x.map(
+        (I) => v.applyModelVariant(
           I,
           {
             contextService: this.getLayoutPreviewService()
@@ -11616,7 +11621,7 @@ const rl = (n) => n.sort((t, e) => t.index - e.index).map((t) => ({
           !1
         )
       );
-      await Promise.all(S);
+      await Promise.all(E);
     }
     await this.onSelectionChange(), p?.type !== b.Frame && p?.type !== b.Text && this.setMandatoryFulfilled(t, !0), r && await r();
   }
@@ -12620,7 +12625,7 @@ const Cl = async (n, t) => {
   return i && (h.metadata = i), a && (h.selectedVariants = a), r && (h.sku = r), h;
 }, Sl = async (n, t, e, a, r, i, o, s, l, c) => {
   c && (console.warn("State mismatch detected. Uploading known state explicitly"), console.warn("State Object:", JSON.stringify(a())), await n.updateStateWithServerImmediate(a), console.log("Server state is undefined @ Workflow completion"));
-  const d = n.getPreviewService(), A = t?.finalizeStepConfig?.lookAtAnimation, u = d && t.showModelOnFinishStep && !!A, h = l && on(l, t, !0), g = l && on(l, t, !1), m = async (S) => {
+  const d = n.getPreviewService(), A = t?.finalizeStepConfig?.lookAtAnimation, u = d && t.showModelOnFinishStep && !!A, h = l && on(l, t, !0), g = l && on(l, t, !1), m = async (E) => {
     const I = {};
     let N = 0;
     if (Object.keys(i).length > 0)
@@ -12628,7 +12633,7 @@ const Cl = async (n, t) => {
         const B = i[R], M = t.steps.find((L) => L.stepName === R);
         for (let L = 0; L < B.selections.length; ++L) {
           const F = B.selections[L];
-          if (M && (!S || M.option && (M.option.variants || []).length > 1 && !M.data.hideSelectionInCart && !M.data.hideSelectionsInCart)) {
+          if (M && (!E || M.option && (M.option.variants || []).length > 1 && !M.data.hideSelectionInCart && !M.data.hideSelectionsInCart)) {
             const J = M.stepTitle;
             I[J] ? I[J].push({
               id: F.id || "",
@@ -12647,18 +12652,18 @@ const Cl = async (n, t) => {
       }
     return [I, N];
   }, [p] = await m(!0), f = Object.fromEntries(
-    Object.keys(p).map((S) => [S, p[S].map((I) => I.id)])
-  ), [v] = await m(!1), w = Object.fromEntries(
-    Object.keys(v).map((S) => [
-      S,
-      v[S].map((I) => I.id)
+    Object.keys(p).map((E) => [E, p[E].map((I) => I.id)])
+  ), [S] = await m(!1), w = Object.fromEntries(
+    Object.keys(S).map((E) => [
+      E,
+      S[E].map((I) => I.id)
     ])
   );
   let x = await s(u, r.id);
   if (x) {
-    const S = await (await nt(x)).blob();
+    const E = await (await nt(x)).blob();
     x = (await j.uploadAsset(
-      { name: `${r.id}-preview-image.png`, blob: S },
+      { name: `${r.id}-preview-image.png`, blob: E },
       Se.Image,
       !0,
       !1
@@ -12666,7 +12671,7 @@ const Cl = async (n, t) => {
   }
   return {
     designDetails: (() => {
-      const S = {
+      const E = {
         name: o,
         layouts: e.map((I) => ({
           index: I.index,
@@ -12681,15 +12686,15 @@ const Cl = async (n, t) => {
         const I = [];
         for (const [N, R] of Object.entries(g))
           I.push({ key: N, value: R });
-        S.metadata = I;
+        E.metadata = I;
       }
       if (f) {
         const I = [];
         for (const [N, R] of Object.entries(w))
           I.push({ key: N, ids: R });
-        S.selectedVariants = I;
+        E.selectedVariants = I;
       }
-      return S;
+      return E;
     })(),
     cartSelectionsWithPrices: p,
     cartMetadata: h
@@ -13152,8 +13157,8 @@ class Bl {
       DOMParser: Ba(),
       fetch
     })).render();
-    const v = await this.getCanvasObjectURLAsync(o);
-    return o.toDataURL(v);
+    const S = await this.getCanvasObjectURLAsync(o);
+    return o.toDataURL(S);
   }
   getStepById(t) {
     const e = this.getWorkflow()?.steps.find((i) => i.stepName === t);
@@ -14867,7 +14872,7 @@ class cn {
         const g = h.map((m) => {
           if (m.getType() === z.ColorOption || m.getType() === z.Option) {
             const p = m;
-            if (!u.aspects.find((v) => v.name === p.getName()))
+            if (!u.aspects.find((S) => S.name === p.getName()))
               return p.initDefaultVariant();
           }
         });
@@ -16183,7 +16188,7 @@ class Vd {
       } catch (a) {
         throw console.error(a), new gt("Critical - Unable to synchronize workflow state with server.");
       }
-    }, this.options = t, this.options.applicationKey && ri(this.options.applicationKey), console.debug("------------------------"), console.debug("Spiff Commerce Core SDK"), console.debug("Version: 34.4.7"), console.debug(`Application Key Provided: ${!!this.options.applicationKey}`), console.debug("------------------------");
+    }, this.options = t, this.options.applicationKey && ri(this.options.applicationKey), console.debug("------------------------"), console.debug("Spiff Commerce Core SDK"), console.debug("Version: 34.4.8"), console.debug(`Application Key Provided: ${!!this.options.applicationKey}`), console.debug("------------------------");
   }
   configure(t) {
     pt.setHubUrl(t.hubUrl), pt.setServerUrl(t.serverUrl), pt.setServicesApiUrl(t.servicesApiUrl), this.marketplaceThemeInstallId = t.marketplaceThemeInstallId, this.marketplaceThemeInstallConfigurationId = t.marketplaceThemeInstallConfigurationId, this.userPoolClientId = t.userPoolClientId, this.userPoolRegion = t.userPoolRegion, this.spiffRegion = t.spiffRegion, t.bearerAuthenticationToken && oi(t.bearerAuthenticationToken), this.options.applicationKey && this.getIntegration(), this.spiffRegion && this.userPoolRegion && this.userPoolClientId && Lt.init(this.spiffRegion, this.userPoolRegion, this.userPoolClientId);
@@ -16502,7 +16507,7 @@ class Vd {
       const g = await this.loggedInBearerToken();
       l.Authorization = `Bearer ${g}`;
     } catch {
-      const p = Object.entries(localStorage).find(([v, w]) => v.startsWith("CognitoIdentityServiceProvider") && v.endsWith("idToken"))?.[0] || "", f = localStorage.getItem(p);
+      const p = Object.entries(localStorage).find(([S, w]) => S.startsWith("CognitoIdentityServiceProvider") && S.endsWith("idToken"))?.[0] || "", f = localStorage.getItem(p);
       f && !Me(f) && (l.Authorization = `Bearer ${f}`);
     }
     const c = {
@@ -16705,11 +16710,11 @@ class Vd {
       ...new Set(m.map((B) => B.transaction.integrationProductId))
     ].filter((B) => B !== void 0), f = [...new Set(m.map((B) => B.workflowId))].filter(
       (B) => B !== void 0
-    ), [v, w] = await Promise.all([
+    ), [S, w] = await Promise.all([
       (async () => p.length > 0 ? await cc(p) : [])(),
       (async () => f.length > 0 ? await fr(f, e) : [])()
-    ]), x = new Map(v.map((B) => [B.id, B])), E = new Map(w.map((B) => [B.id, B])), S = m.map(async (B) => {
-      const { transaction: M, workflowId: L, readOnly: F, index: J } = B, We = L ? E.get(L) : void 0, At = t[J];
+    ]), x = new Map(S.map((B) => [B.id, B])), v = new Map(w.map((B) => [B.id, B])), E = m.map(async (B) => {
+      const { transaction: M, workflowId: L, readOnly: F, index: J } = B, We = L ? v.get(L) : void 0, At = t[J];
       if (M.integrationProductId) {
         const rt = x.get(M.integrationProductId);
         M.integrationProduct = rt, M.product = rt?.product, M.integrationProduct || console.error("failed to find transaction's product");
@@ -16741,7 +16746,7 @@ class Vd {
         await Xa(rt), ie.reloadedState = rt;
       }
       return ie.delayWorkflowStateSync = !0, { experienceOptions: ie, index: J, options: At };
-    }), N = (await Promise.all(S)).sort((B, M) => B.index - M.index);
+    }), N = (await Promise.all(E)).sort((B, M) => B.index - M.index);
     let R = [];
     for (const B of N) {
       const { experienceOptions: M, options: L } = B, F = new Bl(this, M);