@spiffcommerce/core 21.14.0 → 21.15.0

package/dist/index.js

@@ -1,6 +1,6 @@
 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 L, 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 Tt, sanitizeSvgTree as Lt, traverse as TA, xmlSerializer as Ot, CreateLayoutCommand as LA, 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 Ts } from "@spiffcommerce/papyrus";
+import { fetch as et, getAttributesFromArrayBuffer as Ht, AssetType as ut, StepType as y, getFrameData as tt, frameDataCache as yA, GroupCommand as v, UpdateFramePattern as Rt, 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 HA, FontColorCommand as RA, 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 Hs, getFrameData as Rs, 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 OA } from "@apollo/client/link/context";
 import { onError as zA } from "@apollo/client/link/error";
 import { Pith as zt } from "pith";
@@ -21,7 +21,7 @@ class ue extends Wt {
     super(`ConfigurationError - ${e}`);
   }
 }
-class Re extends ue {
+class He extends ue {
   constructor(e) {
     super(`Option not Configured: ${e.stepTitle}`), this.optionId = (e == null ? void 0 : e.optionId) || "N/A";
   }
@@ -41,7 +41,7 @@ class he extends ue {
     super(`Resource not found for asset: ${e.name}`), this.asset = e;
   }
 }
-class He extends ue {
+class Re extends ue {
   constructor(e, t) {
     super(`Workflow Misconfiguration: ${e.stepName} - ${t}`), this.step = e;
   }
@@ -66,7 +66,7 @@ class U extends Je {
     super(`Client Error: ${e}`);
   }
 }
-class Te extends Je {
+class Le extends Je {
   constructor(e) {
     super(`Resource Generation Failed: ${e}`);
   }
@@ -388,7 +388,7 @@ const x = new $A(), _A = D`
 class sa {
   constructor() {
     this.cache = /* @__PURE__ */ new Map(), this.bgrmProcessCache = /* @__PURE__ */ new Map(), this.materialCache = /* @__PURE__ */ new Map(), this.loadImageAsFileInfo = async (e) => {
-      const t = await e.arrayBuffer(), A = await Rt(t), a = (n, i) => {
+      const t = await e.arrayBuffer(), A = await Ht(t), a = (n, i) => {
         const s = atob(n.split(",")[1]), o = [];
         for (let r = 0; r < s.length; r++)
           o.push(s.charCodeAt(r));
@@ -1653,7 +1653,7 @@ class Ya {
     n.forEach((o, r) => {
       s(
         new v([
-          new Ht(o, t, e[r]),
+          new Rt(o, t, e[r]),
           new MA(
             o,
             a.useThreshold,
@@ -1701,7 +1701,7 @@ class St {
       if (this.configuration.type === y.ProductOverlay) {
         let l = "";
         if ((o = this.product) != null && o.overlayImageUrl && (l = this.product.overlayImageUrl), i = l, !l)
-          throw new He(this.configuration, "Couldn't find an asset for product overlay step");
+          throw new Re(this.configuration, "Couldn't find an asset for product overlay step");
       }
       const s = this.evaluateAssetType();
       if (s === k.Image) {
@@ -1730,7 +1730,7 @@ class St {
             id: d.id,
             region: a
           },
-          command: new L(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) => {
@@ -1765,14 +1765,14 @@ class St {
             id: E.id,
             region: a
           },
-          command: new L(E, n)
+          command: new T(E, n)
         };
       }
     }, this.configuration = e, this.layouts = t, this.product = A || void 0;
   }
   async trigger() {
     if (!this.configuration.data.regions)
-      throw new He(this.configuration, "Missing regions.");
+      throw new Re(this.configuration, "Missing regions.");
     if (this.configuration.type === y.SilentIllustration) {
       const e = this.configuration.data.regions.map(this.processRegion);
       return Promise.all(e);
@@ -1802,7 +1802,7 @@ const Pa = async (c) => {
       }
     })).json()).shortUrl;
   } catch (t) {
-    throw console.error(t), new Te("Failed to shorten URL, see console.");
+    throw console.error(t), new Le("Failed to shorten URL, see console.");
   }
 };
 class aA {
@@ -1876,10 +1876,10 @@ class xa {
       d.searchParams.append("video", btoa(JSON.stringify([B]))), d.pathname = d.pathname + (d.pathname.slice(-1) === "/" ? "" : "/");
       const w = d.toString();
       if (w.length >= 2e3)
-        throw new Te("Cannot create QR code, URL too long.");
+        throw new Le("Cannot create QR code, URL too long.");
       const E = await Pa(w);
       if (s(E), !i.data || !i.data.regions)
-        throw new He(i, "Missing regions.");
+        throw new Re(i, "Missing regions.");
       const h = await this.regionElements(i), u = await this.command(E, h, n, i.stepName);
       u && (u.command && n.getCommandDispatcher()(u.command), u.followup && await u.followup()), await n.setSelectionsAndElements(i.stepName, [], h, async () => {
         n.updateStorage(i.stepName, {
@@ -1903,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 L(
+      return new T(
         {
           stepRegion: g,
           stepName: a,
@@ -1924,7 +1924,7 @@ class xa {
   }
 }
 const Na = new xa();
-class Ra {
+class Ha {
   constructor() {
     this.frameSourceSvg = async (e, t) => {
       if (!e)
@@ -2035,7 +2035,7 @@ class Ra {
             });
           },
           () => {
-            throw new Te("Failed to resolve transcoded PDF");
+            throw new Le("Failed to resolve transcoded PDF");
           }
         )
       );
@@ -2052,7 +2052,7 @@ class Ra {
     i && (i.command && a.getCommandDispatcher()(i.command), i.followup && await i.followup());
   }
   getCreateElementCommand(e, t, A, a) {
-    return new L(
+    return new T(
       {
         id: e,
         type: k.Frame,
@@ -2090,7 +2090,7 @@ class Ra {
       };
       Qt.set(e, s), t.setPatternData(s, A);
     } else {
-      const a = await YA(e, !0), n = await Rt(a), i = {
+      const a = await YA(e, !0), n = await Ht(a), i = {
         src: e,
         width: n.width,
         height: n.height,
@@ -2186,8 +2186,8 @@ class Ra {
     }), A.markUpdateCompleted(i);
   }
 }
-const Se = new Ra();
-class Ha {
+const Se = new Ha();
+class Ra {
   async getIllustrationBody(e) {
     return new Promise((t) => {
       _(e, !0).then((A) => {
@@ -2196,7 +2196,7 @@ class Ha {
     });
   }
   getCreateElementCommand(e, t, A, a) {
-    return new L(
+    return new T(
       {
         stepRegion: t,
         stepName: a.stepName,
@@ -2341,7 +2341,7 @@ class Ha {
   async selectVariantCommand(e, t, A, a, n, i) {
     var C;
     if (!e.data || !e.data.regions)
-      throw new He(e, "Missing regions.");
+      throw new Re(e, "Missing regions.");
     a(!0);
     const s = A.map((I) => new ee(I.id));
     e.mandatory && n.setMandatoryFulfilled(e.stepName, !1);
@@ -2399,12 +2399,12 @@ class Ha {
     };
   }
 }
-const Ye = new Ha();
+const Ye = new Ra();
 class Ua {
   async init(e, t, A) {
     const a = e.option;
     if (!a)
-      throw new Re(e);
+      throw new He(e);
     if (A)
       await this.reload(e, t, A);
     else {
@@ -2422,7 +2422,7 @@ class Ua {
       A.serializableWorkflow.steps
     ), s = Object.values(A.layouts).map((g) => g.elements).flat().filter((g) => g.stepName === e.stepName), o = e.option;
     if (!o)
-      throw new Re(e);
+      throw new He(e);
     if (a != null && a.selectedVariants) {
       const g = a.selectedVariants[0].id;
       if (g) {
@@ -2478,7 +2478,7 @@ class va {
   async init(e, t, A) {
     const a = e.option;
     if (!a)
-      throw new Re(e);
+      throw new He(e);
     if (A)
       await this.reload(e, t, A);
     else {
@@ -2600,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 L(
+        new T(
           {
             stepRegion: l,
             stepName: e.stepName,
@@ -2728,7 +2728,7 @@ class ba {
       const E = J();
       return {
         regionElement: { id: E, region: l },
-        command: new L(
+        command: new T(
           {
             stepName: e.stepName,
             stepRegion: l,
@@ -2824,7 +2824,7 @@ class Ja {
   }
 }
 const oA = new Ja();
-class Ta {
+class La {
   constructor() {
     this.shapeFillId = "spiff-fill-shape";
   }
@@ -2850,7 +2850,7 @@ class Ta {
   async init(e, t, A) {
     const a = e.option;
     if (!a)
-      throw new Re(e);
+      throw new He(e);
     if (A)
       await this.reload(e, t, A);
     else {
@@ -2958,7 +2958,7 @@ class Ta {
         return {
           id: C,
           region: d,
-          command: new L(
+          command: new T(
             {
               stepRegion: d,
               stepName: e.stepName,
@@ -2996,8 +2996,8 @@ class Ta {
     }
   }
 }
-const le = new Ta();
-class La {
+const le = new La();
+class Ta {
   constructor() {
     this.latestToast = null, this.toastType = null, this.toastCallbacks = [];
   }
@@ -3022,7 +3022,7 @@ class La {
     );
   }
 }
-const Oa = new La(), 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;
@@ -3136,7 +3136,7 @@ class Ka {
       return;
     const n = a.getCommandDispatcher();
     for (const i of A) {
-      const s = new RA(i.id, t);
+      const s = new HA(i.id, t);
       n(s);
     }
   }
@@ -3156,7 +3156,7 @@ class Ka {
     for (const r of A) {
       if (!t.fill)
         throw new Error("Fill not set on new color selection!");
-      const g = new HA(r.id, t.fill, s);
+      const g = new RA(r.id, t.fill, s);
       n(g);
     }
   }
@@ -3401,9 +3401,9 @@ class Ka {
         const h = A.colorOption;
         let u;
         if (h && h.variants) {
-          const N = h.variants.find((R) => {
+          const N = h.variants.find((H) => {
             var O;
-            return R.id === ((O = h.defaultVariant) == null ? void 0 : O.id);
+            return H.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
@@ -3456,7 +3456,7 @@ class Ka {
         Q.push(
           this.generateTextChangeCommandsForRegion(F, A, m.id, P)
         );
-        const S = new L(m, d);
+        const S = new T(m, d);
         return {
           regionElement: { id: w, region: B },
           commands: [S, ...Q],
@@ -4808,14 +4808,14 @@ IfnI8vaNAAAAAElFTkSuQmCC" transform="matrix(0.13 0.0141 -0.0141 0.1301 104.926 1
 </g>
 </svg>
 
-`, H = (c) => GA("http://www.w3.org/2000/svg", c), gt = (c, e) => {
-  const t = H("rect");
+`, R = (c) => GA("http://www.w3.org/2000/svg", c), gt = (c, e) => {
+  const t = R("rect");
   return t.setAttribute("height", `${c}`), t.setAttribute("width", `${e}`), t;
 }, Wa = () => {
-  const c = H("svg");
+  const c = R("svg");
   return c.setAttribute("xmlns", "http://www.w3.org/2000/svg"), c.setAttribute("xmlns:xlink", "http://www.w3.org/1999/xlink"), c.setAttribute("version", "1.1"), c;
 }, Xa = (c) => {
-  const e = H("use");
+  const e = R("use");
   return e.setAttribute("xlink:href", c), e.setAttribute("href", c), e;
 };
 function rA(c) {
@@ -4823,7 +4823,7 @@ function rA(c) {
   return e.setAttribute("height", `${a}`), e.setAttribute("width", `${A}`), [e, a, A];
 }
 const qa = (c, e, t) => {
-  const A = H("g");
+  const A = R("g");
   c.appendChild(A), A.setAttribute("id", t), A.innerHTML = e;
 };
 function cA(c, e, t) {
@@ -4985,26 +4985,26 @@ class $a extends ct {
   }
   brandSvg(e, t) {
     const A = e.toSVG(2), a = e.getBoundingBox(), n = a.x2 - a.x1, i = e.toPathData(3), s = () => {
-      const Q = H("g"), p = H("defs");
+      const Q = R("g"), p = R("defs");
       Q.appendChild(p), p.appendChild(gA(3, 7, 4, "shadow"));
-      const f = H("g");
+      const f = R("g");
       Q.appendChild(f), f.setAttribute("filter", "url(#shadow)"), f.innerHTML = A;
-      const F = H("g");
+      const F = R("g");
       Q.appendChild(F), F.setAttribute("fill", "red"), F.setAttribute("stroke", "red"), F.setAttribute("stroke-width", "9"), F.innerHTML = A;
-      const M = H("g");
+      const M = R("g");
       Q.appendChild(M), M.setAttribute("fill", "#9d2621"), M.setAttribute("transform", "translate(1,1)"), M.innerHTML = A;
-      const P = H("g");
-      return Q.appendChild(P), P.setAttribute("fill", "yellow"), P.innerHTML = A, new Bt(Q).transform(([N, R]) => [N, R + (n / 2 - N) ** 2 / (n * 2.9)]), Q;
+      const P = R("g");
+      return Q.appendChild(P), P.setAttribute("fill", "yellow"), P.innerHTML = A, new Bt(Q).transform(([N, H]) => [N, H + (n / 2 - N) ** 2 / (n * 2.9)]), Q;
     }, [o, r, g] = rA(t);
     if (!o)
       return "";
-    const B = H("defs");
+    const B = R("defs");
     o.appendChild(B), cA(o, B, t);
-    const l = r * 0.23, d = g * 0.94, w = g * 0.04, E = r * 0.53, h = H("g");
+    const l = r * 0.23, d = g * 0.94, w = g * 0.04, E = r * 0.53, h = R("g");
     o.appendChild(h), h.setAttribute("transform", `translate(${w} ${E}) rotate(-21)`);
     const u = gt(l, d);
     u.setAttribute("opacity", "0"), h.appendChild(u);
-    const C = H("g");
+    const C = R("g");
     h.appendChild(C);
     const I = s();
     C.appendChild(I);
@@ -5029,29 +5029,29 @@ class en extends ct {
   }
   brandSvg(e, t, A) {
     const a = e.toSVG(2), n = e.getBoundingBox(), i = n.y2 - n.y1, s = n.x2 - n.x1, o = e.toPathData(3), r = () => {
-      const f = H("g"), F = H("g");
+      const f = R("g"), F = R("g");
       f.appendChild(F), F.setAttribute("stroke", "#5C1A0D"), F.setAttribute("stroke-width", "4"), F.setAttribute("transform", "translate(1,1)"), F.innerHTML = a;
-      const M = H("g");
+      const M = R("g");
       f.appendChild(M), M.setAttribute("fill", "#FFE386"), M.setAttribute("transform", "translate(1,1)"), M.innerHTML = a;
-      const P = H("g");
+      const P = R("g");
       f.appendChild(P), P.setAttribute("fill", "white"), P.innerHTML = a;
       const S = new Bt(f);
-      return S.transform(([N, R]) => [N, R + ((s - N) * R) ** 2 / (s * 5e4)]), S.transform(([N, R]) => [
+      return S.transform(([N, H]) => [N, H + ((s - N) * H) ** 2 / (s * 5e4)]), S.transform(([N, H]) => [
         N,
-        R + (s / 3 - N) ** 2 / s * this.indicator(N < s / 3)
-      ]), S.transform(([N, R]) => [N - (i - R) * (s - N) / 800, R]), f;
+        H + (s / 3 - N) ** 2 / s * this.indicator(N < s / 3)
+      ]), S.transform(([N, H]) => [N - (i - H) * (s - N) / 800, H]), f;
     }, [g, B, l] = rA(t);
     if (!g)
       return "";
-    const d = H("defs");
+    const d = R("defs");
     g.appendChild(d), cA(g, d, t);
     let w, E, h, u;
     A ? (w = B * 0.25 * (1 + 0.1), E = l / 2 * (1 + 0.1), h = l * 0.22, u = B * 0.32) : (w = B * 0.22 * (1 + 0.1), E = l * 0.8, h = l * 0.067, u = B * 0.33);
-    const C = H("g");
+    const C = R("g");
     g.appendChild(C), C.setAttribute("transform", `translate(${h} ${u}) rotate(-10)`);
     const I = gt(w, E);
     I.setAttribute("opacity", "0"), C.appendChild(I);
-    const m = H("g");
+    const m = R("g");
     C.appendChild(m);
     const Q = r();
     m.appendChild(Q);
@@ -5073,29 +5073,29 @@ class An extends ct {
   }
   svgElement(e, t) {
     const A = nt(tn), n = e !== "" ? ((I) => I.charAt(0).toUpperCase() + I.substr(1).toLowerCase())(e) : "", i = A.getPath(n, 0, 72, 72), s = i.toSVG(2), o = i.getBoundingBox(), r = o.x2 - o.x1, g = i.toPathData(3), B = () => {
-      const I = H("g");
+      const I = R("g");
       I.classList.add("module-text-group");
-      const m = H("defs");
+      const m = R("defs");
       I.appendChild(m), m.appendChild(gA(0, 2, 2, "shadow"));
-      const Q = H("path");
+      const Q = R("path");
       Q.setAttribute("d", g), Q.setAttribute("stroke", "black"), Q.setAttribute("stroke-width", "3"), m.appendChild(Q);
-      const p = H("g");
+      const p = R("g");
       p.classList.add("module-layer0"), I.appendChild(p), p.setAttribute("filter", "url(#shadow)"), p.innerHTML = Q.outerHTML;
-      const f = H("g");
+      const f = R("g");
       f.classList.add("module-layer1"), I.appendChild(f), f.setAttribute("stroke-width", "3"), f.setAttribute("stroke", "rgb(45,41,38)"), f.setAttribute("fill", "rgb(45,41,38)"), f.setAttribute("transform", "translate(0.5,0)"), f.innerHTML = s;
-      const F = H("g");
+      const F = R("g");
       F.classList.add("module-layer2"), I.appendChild(F), F.setAttribute("fill", "rgb(255,209,0)"), F.setAttribute("transform", "translate(1,-0.1)"), F.innerHTML = s;
-      const M = H("g");
+      const M = R("g");
       return M.classList.add("module-layer3"), I.appendChild(M), M.setAttribute("fill", "white"), M.innerHTML = s, new Bt(I).transform(([S, N]) => [S, N + (r / 2 - S) ** 2 / (r * 6)]), I;
-    }, l = H("g");
+    }, l = R("g");
     l.classList.add("module-root");
-    const d = H("defs");
+    const d = R("defs");
     l.appendChild(d);
-    const w = H("g");
+    const w = R("g");
     w.classList.add("module-bounds"), l.appendChild(w);
     const E = gt(t.height, t.width);
     E.setAttribute("opacity", "0"), w.appendChild(E);
-    const h = H("g");
+    const h = R("g");
     h.classList.add("module-text-enclosure"), l.appendChild(h);
     const u = B();
     h.appendChild(u);
@@ -6290,7 +6290,7 @@ class Ie {
       case y.Model:
         return new rn(e, t);
       case y.Frame:
-        return new Hi(e, t);
+        return new Ri(e, t);
       default:
         throw new b(`Step type ${t.type} not yet supported in Core SDK`);
     }
@@ -6518,26 +6518,26 @@ const En = async (c) => {
       context: {
         transactionOwnerId: P
       }
-    }), R = (O = N.data) == null ? void 0 : O.transactions[0].workflowState;
-    return N.errors ? (N.errors.forEach((T) => {
-      N.errors && console.log("Server Error:", T.message);
-    }), null) : R ?? null;
+    }), H = (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) : H ?? null;
   })() || (console.warn("State mismatch detected. Uploading known state explicitly"), console.warn("State Object:", JSON.stringify(A())), await c.updateStateWithServerImmediate(A), console.log("Server state is undefined @ Workflow completion"));
   const l = c.getPreviewService(), d = (F = e == null ? void 0 : e.finalizeStepConfig) == null ? void 0 : F.lookAtAnimation, w = l && e.showModelOnFinishStep && !!d, E = o && _e(o, e, !0), h = o && _e(o, e, !1), u = async (M) => {
     const P = {};
     let S = 0;
     if (Object.keys(n).length > 0)
       for (const N of Object.keys(n)) {
-        const R = n[N], O = e.steps.find((T) => T.stepName === N);
-        for (let T = 0; T < R.selections.length; ++T) {
-          const W = R.selections[T];
+        const H = n[N], O = e.steps.find((L) => L.stepName === N);
+        for (let L = 0; L < H.selections.length; ++L) {
+          const W = H.selections[L];
           if (O && (!M || O.option && (O.option.variants || []).length > 1 && !O.data.hideSelectionInCart && !O.data.hideSelectionsInCart)) {
-            const Le = O.stepTitle;
-            P[Le] ? P[Le].push({
+            const Te = O.stepTitle;
+            P[Te] ? P[Te].push({
               id: W.id || "",
               name: W.name,
               priceModifier: W.priceModifier
-            }) : P[Le] = [
+            }) : P[Te] = [
               {
                 id: W.id || "",
                 name: W.name,
@@ -6853,7 +6853,7 @@ class fe {
       height: g.layoutState.layout.height
     }, l = this.commandContext.getLayoutById(g.layoutState.layout.id), d = i.getContext("2d");
     if (!d)
-      throw new Te("Failed to obtain 2D context for preview image creation");
+      throw new Le("Failed to obtain 2D context for preview image creation");
     const w = vt(l.layoutState.layout, l.layoutState.elements, {
       renderingConfiguration: {
         purpose: Gt.Print,
@@ -7153,7 +7153,7 @@ const Dn = [
     if (!w)
       throw new z(d);
     const E = J();
-    return new L(
+    return new T(
       {
         id: E,
         src: g,
@@ -7194,7 +7194,7 @@ const Dn = [
         top: a.y
       });
       return [
-        new L(
+        new T(
           {
             id: l,
             path: B.path,
@@ -7218,7 +7218,7 @@ const Dn = [
           },
           d
         ),
-        new Ht(l, i, w)
+        new Rt(l, i, w)
       ];
     };
     return (await Promise.all(A.data.regions.map((r) => o(r)))).flat();
@@ -7239,12 +7239,12 @@ const Dn = [
   const s = (p = i.asset) == null ? void 0 : p.fileLink;
   if (!s)
     return console.error(`No asset link for variant with ID: ${a.illustrationVariantId}`), [];
-  const o = await _(s, !0), r = /<svg.*?<\/svg>/s, g = o.match(r) || [], B = (g == null ? void 0 : g.length) > 0 ? g[0] : "", w = Tt().parseFromString(B, "image/svg+xml").firstElementChild;
+  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."), [];
-  Lt(w);
+  Tt(w);
   const E = {};
-  TA(w, (f) => {
+  LA(w, (f) => {
     Dn.includes(f.tagName) && !f.attributes.getNamedItem("fill") && f.setAttribute("fill", "#000000");
     const F = f.attributes.getNamedItem("fill");
     if (F && F.value !== "none") {
@@ -7271,7 +7271,7 @@ const Dn = [
     if (!F)
       throw new z(f);
     const M = J();
-    return new L(
+    return new T(
       {
         colors: E,
         id: M,
@@ -7300,7 +7300,7 @@ const Dn = [
     if (!r)
       throw new z(o);
     const g = J();
-    return new L(
+    return new T(
       {
         colors: {},
         id: g,
@@ -7343,7 +7343,7 @@ const Dn = [
     if (!d)
       throw new z(l);
     const w = J();
-    return new L(
+    return new T(
       {
         id: w,
         src: s,
@@ -7400,7 +7400,7 @@ const Dn = [
             />
         </svg>
         `, w = { "spiff-fill-shape": { browserValue: i.color || "#000000" } }, E = J();
-    return new L(
+    return new T(
       {
         colors: w,
         id: E,
@@ -7451,17 +7451,17 @@ const Dn = [
           excludeFromExport: e.data.excludeFromPrint,
           preserveAspectRatio: "none"
         };
-        A.push(new L(B, g));
+        A.push(new T(B, g));
       });
     } catch (r) {
       console.error(r);
     }
   else {
     const r = await _(n, !0), g = (B) => {
-      const l = /<svg.*?<\/svg>/s, d = B.match(l) || [], w = (d == null ? void 0 : d.length) > 0 ? d[0] : "", u = Tt().parseFromString(w, "image/svg+xml").firstElementChild;
+      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 Lt(u), Ot().serializeToString(u);
+      return Tt(u), Ot().serializeToString(u);
     };
     o.forEach((B) => {
       const l = c.find((w) => w.panelId === B.panelId);
@@ -7486,7 +7486,7 @@ const Dn = [
         productOverlay: e.type === y.ProductOverlay ? !0 : void 0,
         excludeFromExport: e.data.excludeFromPrint
       };
-      A.push(new L(d, l));
+      A.push(new T(d, l));
     });
   }
   return A;
@@ -7565,7 +7565,7 @@ const Dn = [
         }
       );
       a.push(
-        new L(
+        new T(
           {
             ...C,
             fontSize: I,
@@ -7576,10 +7576,10 @@ const Dn = [
         )
       );
     } else
-      a.push(new L(C, u));
+      a.push(new T(C, u));
   }
   return a;
-}, Rn = (c, e) => c.conditions ? c.conditions.every((t) => {
+}, Hn = (c, e) => c.conditions ? c.conditions.every((t) => {
   const A = e[t.targetStepName];
   if (A && A.selectedVariants) {
     const a = A.selectedVariants;
@@ -7588,7 +7588,7 @@ const Dn = [
     );
   }
   return !1;
-}) : !0, Hn = async (c, e, t, A) => {
+}) : !0, Rn = async (c, e, t, A) => {
   const a = [], n = {};
   for (const i of c) {
     const s = e.steps.find((o) => o.stepName === i.name);
@@ -7636,7 +7636,7 @@ const Dn = [
       }
   }
   for (const i of e.steps)
-    i.type !== y.SilentIllustration && i.type !== y.ProductOverlay || Rn(i, n) && a.push(
+    i.type !== y.SilentIllustration && i.type !== y.ProductOverlay || Hn(i, n) && a.push(
       ...await xn(t, i, A)
     );
   return a;
@@ -7645,7 +7645,12 @@ class De {
   constructor(e) {
     this.handleCompleteRender = null;
     const t = /* @__PURE__ */ new Map();
-    e.forEach((A) => t.set(A.id, new Gn(A.id, A.name, this))), this.layouts = t;
+    e.forEach(
+      (A) => t.set(
+        A.id,
+        new Gn(A.id, A.name, this, { width: A.width, height: A.height })
+      )
+    ), this.layouts = t;
   }
   setCompleteRenderCallback(e) {
     this.handleCompleteRender = e, e(Array.from(this.layouts.values()));
@@ -7662,8 +7667,8 @@ const Un = () => new Promise((c, e) => {
   c(!!A);
 }), vn = Un();
 class Gn {
-  constructor(e, t, A) {
-    this.hasSetStaticContext = !1, this.interactiveDirty = !1, this.staticCtxDirty = !1, this.lastRequestedRenderArguments = void 0, this.lastCompletedStaticRender = void 0, this.lastModificationID = void 0, this.renderQueue = new AA(2), this.id = e, this.name = t, this.service = A;
+  constructor(e, t, A, a) {
+    this.hasSetStaticContext = !1, this.interactiveDirty = !1, this.staticCtxDirty = !1, this.lastRequestedRenderArguments = void 0, this.lastCompletedStaticRender = void 0, this.lastModificationID = void 0, this.renderQueue = new AA(2), this.id = e, this.name = t, this.service = A, this.panelSize = a;
   }
   getID() {
     return this.id;
@@ -7671,6 +7676,9 @@ class Gn {
   getName() {
     return this.name;
   }
+  getPanelSize() {
+    return this.panelSize;
+  }
   getStaticContext() {
     return this.textureCtx;
   }
@@ -7744,6 +7752,7 @@ class kn extends tA {
   }
   /**
    * Returns the resolution expected for generated textures.
+   * FIXME: This is reimplemented from the preview package. Can we find a way to remove this duplication.
    */
   getDynamicTextureResolution() {
     return this.getIsMobile() || !this.offscreenRenderingSupported() ? {
@@ -7775,21 +7784,21 @@ class kn extends tA {
    * a loose target but should be kept in mind when making changes.
    */
   async execute() {
-    const e = this.layouts.find((l) => l.layoutState.layout.id === this.layoutId);
+    const e = this.layouts.find((d) => d.layoutState.layout.id === this.layoutId);
     if (!e)
       return;
-    const t = e.layoutState.elements || [], A = e.layoutState.layout.width, a = e.layoutState.layout.height, n = this.getDynamicTextureResolution().width, i = this.getDynamicTextureResolution().height;
-    let s, o;
+    const t = e.layoutState.elements || [], A = e.layoutState.layout.width, a = e.layoutState.layout.height, n = A === 1 || a === 1 ? { width: 1, height: 1 } : this.getDynamicTextureResolution(), i = n.width, s = n.height;
+    let o, r;
     if (this.nonPOTSupport) {
-      const l = n / i;
-      A / a < l ? (s = n, o = a * (n / A)) : (s = A * (i / a), o = i);
-      const w = this.resizeFit({ width: s, height: o });
-      s = w.width, o = w.height;
+      const d = i / s;
+      A / a < d ? (o = i, r = a * (i / A)) : (o = A * (s / a), r = s);
+      const E = this.resizeFit({ width: o, height: r });
+      o = E.width, r = E.height;
     } else
-      s = this.getDynamicTextureResolution().width, o = this.getDynamicTextureResolution().height;
-    const r = vt(e.layoutState.layout, t, {
+      o = n.width, r = n.height;
+    const g = vt(e.layoutState.layout, t, {
       renderingConfiguration: { purpose: Gt.ThreeD }
-    }), g = kt(r), B = await zt.from(this.ctx, g, {
+    }), B = kt(g), l = await zt.from(this.ctx, B, {
       anonymousCrossOrigin: !0,
       ignoreDimensions: !this.nonPOTSupport,
       ignoreAnimation: !0,
@@ -7801,7 +7810,7 @@ class kn extends tA {
       DOMParser: Jt(),
       fetch: et
     });
-    B.resize(s, o), await B.render(), this.onRender();
+    l.resize(o, r), await l.render(), this.onRender();
   }
 }
 const Vi = (c, e) => {
@@ -7820,8 +7829,8 @@ const Vi = (c, e) => {
     serializableWorkflow: { steps: [] },
     layouts: {}
   };
-  a = new v(t.map((o) => new LA(o))).apply(a);
-  const i = await Hn(c, e, t, A);
+  a = new v(t.map((o) => new TA(o))).apply(a);
+  const i = await Rn(c, e, t, A);
   return new v(i).apply(a);
 }, bn = D`
     ${oe}
@@ -7943,7 +7952,7 @@ const Vi = (c, e) => {
             }
         }
     }
-`, Tn = D`
+`, Ln = D`
     query GetBundleStakeholders($id: String!) {
         bundles(ids: [$id]) {
             id
@@ -7963,7 +7972,7 @@ const Vi = (c, e) => {
             }
         }
     }
-`, Ln = D`
+`, Tn = D`
     query GetBundlesForCustomer($id: String!) {
         customers(ids: [$id]) {
             bundleStakeholders {
@@ -9269,7 +9278,7 @@ class xt {
   }
   async getAllStakeholders() {
     const e = await x.getShadowGraphqlClient().query({
-      query: Tn,
+      query: Ln,
       errorPolicy: "all",
       fetchPolicy: "no-cache",
       variables: {
@@ -10676,7 +10685,7 @@ class Ni {
     if (!this.customer)
       throw new Error("Customer not authenticated.");
     const e = await x.getShadowGraphqlClient().query({
-      query: Ln,
+      query: Tn,
       variables: {
         id: this.customer.id
       },
@@ -10822,11 +10831,11 @@ class Ni {
         throw new U(`Not all transactions were found: ${S}`);
       }
       return F.map((S, N) => {
-        var R;
+        var H;
         return {
           transaction: S,
           workflowId: S.workflowId,
-          readOnly: ((R = Q.find((O) => O.option.transactionId === S.id)) == null ? void 0 : R.option.readOnly) ?? !1,
+          readOnly: ((H = Q.find((O) => O.option.transactionId === S.id)) == null ? void 0 : H.option.readOnly) ?? !1,
           index: Q[N].index
         };
       });
@@ -10867,32 +10876,32 @@ class Ni {
       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 = {
+      const N = E.get(p.id) || void 0, H = {
         product: p.product,
         transaction: p,
         layouts: [],
         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 (T) => this.updateTransactionState({ ...T, context: { transactionOwnerId: N } }),
+        } : async (L) => this.updateTransactionState({ ...L, context: { transactionOwnerId: N } }),
         readOnly: F,
         workflow: P,
         isReloadedTransaction: S.type === "transaction"
       };
       if (S.type === "transaction" && p.workflowState) {
-        const T = JSON.parse(p.workflowState);
-        R.layouts = Object.values(T.layouts || {}).map((W) => W.layout), await Ae(T), await ne(T), R.reloadedState = T;
+        const L = JSON.parse(p.workflowState);
+        H.layouts = Object.values(L.layouts || {}).map((W) => W.layout), await Ae(L), await ne(L), H.reloadedState = L;
       } else if (!F && S.workflowState) {
-        const T = JSON.parse(S.workflowState);
-        R.layouts = Object.values(T.layouts || {}).map((W) => W.layout), await Ae(T), await ne(T), R.reloadedState = T;
+        const L = JSON.parse(S.workflowState);
+        H.layouts = Object.values(L.layouts || {}).map((W) => W.layout), await Ae(L), await ne(L), H.reloadedState = L;
       } else
-        R.layouts = Ve(
-          R.transaction,
-          R.workflow
+        H.layouts = Ve(
+          H.transaction,
+          H.workflow
         );
-      return R.renderableContextService = new De(
-        R.layouts
-      ), R.delayWorkflowStateSync = !0, this.initialized = !0, this.experienceOptions = R, { experienceOptions: R, index: M, options: S };
+      return H.renderableContextService = new De(
+        H.layouts
+      ), H.delayWorkflowStateSync = !0, this.initialized = !0, this.experienceOptions = H, { experienceOptions: H, index: M, options: S };
     });
     Y.setMap("transactionOwnerIds", E);
     const I = (await Promise.all(h)).sort((Q, p) => Q.index - p.index).map(async (Q) => {
@@ -11263,8 +11272,8 @@ class Zi {
   setWorkflowStateSyncEnabled(e) {
   }
 }
-var Ri = /* @__PURE__ */ ((c) => (c.SelectFrame = "SelectFrame", c.SelectImage = "SelectImage", c.Position = "Position", c))(Ri || {});
-class Hi extends X {
+var Hi = /* @__PURE__ */ ((c) => (c.SelectFrame = "SelectFrame", c.SelectImage = "SelectImage", c.Position = "Position", c))(Hi || {});
+class Ri extends X {
   constructor(e, t) {
     var A;
     super(e, t), this.frameService = (A = this.manager.getStepSpecificServices(this.getId())) == null ? void 0 : A.frameService;
@@ -11421,8 +11430,8 @@ export {
   Bs as FontSizeCommand,
   ds as FontSourceCommand,
   Ya as FrameService,
-  Ri as FrameStep,
-  Hi as FrameStepHandle,
+  Hi as FrameStep,
+  Ri as FrameStepHandle,
   wt as GlobalPropertyHandle,
   ws as GroupCommand,
   sn as IllustrationStepHandle,
@@ -11434,14 +11443,14 @@ export {
   Es as LayoutElementType,
   z as LayoutNotFoundError,
   on as MaterialStepHandle,
-  He as MisconfigurationError,
+  Re as MisconfigurationError,
   Zi as MockWorkflowManager,
   rn as ModelStepHandle,
   us as MoveCommand,
   mA as ObjectInput,
   hi as ObjectInputType,
   QA as OptionGlobalPropertyHandle,
-  Re as OptionNotFoundError,
+  He as OptionNotFoundError,
   ge as ParseError,
   cn as PictureStepHandle,
   wa as ProductCameraRig,
@@ -11483,13 +11492,13 @@ export {
   Ys as frameDataCache,
   Se as frameStepService,
   Ps as generate,
-  Hn as generateCommands,
+  Rn as generateCommands,
   xs as generateSVGWithUnknownColors,
   Wi as generateStateFromDesignInputSteps,
   Ns as getAttributesFromArrayBuffer,
-  Rs as getAxisAlignedBoundingBox,
+  Hs as getAxisAlignedBoundingBox,
   Sa as getBoundedOffsets,
-  Hs as getFrameData,
+  Rs as getFrameData,
   Us as getSvgElement,
   ye as getWorkflow,
   pA as getWorkflows,
@@ -11507,7 +11516,7 @@ export {
   ks as registerFetchImplementation,
   bs as registerWindowImplementation,
   Js as rehydrateSerializedLayout,
-  Ts as setCanvasModule,
+  Ls as setCanvasModule,
   le as shapeStepService,
   Pa as shortenUrl,
   $ as spiffCoreConfiguration,