@spiffcommerce/core 21.14.0-alpha.0 → 21.14.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.d.ts CHANGED
@@ -306,7 +306,6 @@ declare class LayoutPreviewBridge implements RenderableContext {
306
306
  hasSetStaticContext: boolean;
307
307
  private readonly id;
308
308
  private readonly name;
309
- private readonly panelSize;
310
309
  private service;
311
310
  private interactiveDirty;
312
311
  private textureCtx?;
@@ -315,16 +314,9 @@ declare class LayoutPreviewBridge implements RenderableContext {
315
314
  private lastCompletedStaticRender;
316
315
  private lastModificationID;
317
316
  private renderQueue;
318
- constructor(id: string, name: string, service: LayoutPreviewService, panelSize: {
319
- width: number;
320
- height: number;
321
- });
317
+ constructor(id: string, name: string, service: LayoutPreviewService);
322
318
  getID(): string;
323
319
  getName(): string;
324
- getPanelSize(): {
325
- width: number;
326
- height: number;
327
- };
328
320
  getStaticContext(): CanvasRenderingContext2D | undefined;
329
321
  /**
330
322
  * Register canvas to be rendered to.
package/dist/index.js CHANGED
@@ -7645,12 +7645,7 @@ class De {
7645
7645
  constructor(e) {
7646
7646
  this.handleCompleteRender = null;
7647
7647
  const t = /* @__PURE__ */ new Map();
7648
- e.forEach(
7649
- (A) => t.set(
7650
- A.id,
7651
- new Gn(A.id, A.name, this, { width: A.width, height: A.height })
7652
- )
7653
- ), this.layouts = t;
7648
+ e.forEach((A) => t.set(A.id, new Gn(A.id, A.name, this))), this.layouts = t;
7654
7649
  }
7655
7650
  setCompleteRenderCallback(e) {
7656
7651
  this.handleCompleteRender = e, e(Array.from(this.layouts.values()));
@@ -7667,8 +7662,8 @@ const Un = () => new Promise((c, e) => {
7667
7662
  c(!!A);
7668
7663
  }), vn = Un();
7669
7664
  class Gn {
7670
- constructor(e, t, A, a) {
7671
- 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;
7665
+ constructor(e, t, A) {
7666
+ 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;
7672
7667
  }
7673
7668
  getID() {
7674
7669
  return this.id;
@@ -7676,9 +7671,6 @@ class Gn {
7676
7671
  getName() {
7677
7672
  return this.name;
7678
7673
  }
7679
- getPanelSize() {
7680
- return this.panelSize;
7681
- }
7682
7674
  getStaticContext() {
7683
7675
  return this.textureCtx;
7684
7676
  }
@@ -2037,7 +2037,7 @@ IfnI8vaNAAAAAElFTkSuQmCC" transform="matrix(0.13 0.0141 -0.0141 0.1301 104.926 1
2037
2037
  />
2038
2038
  </svg>
2039
2039
  `,h={"spiff-fill-shape":{browserValue:i.color||"#000000"}},u=l.generate();return new l.CreateElementCommand({colors:h,id:u,svg:d,type:l.LayoutElementType.Illustration,y:g.top,x:g.left,rotation:g.rotation,width:g.width,height:g.height,layer:g.layer,layerIndex:g.layerIndex,immutable:g.immutable},B)},s=A.data.regions;try{return s.map(o)}catch(g){return console.error(g),[]}},Gn=async(c,e,t)=>{const A=[],a=(()=>{var r,g;return e.type===l.StepType.ProductOverlay?t||((r=e.data.asset)==null?void 0:r.fileLink)||"":((g=e.data.asset)==null?void 0:g.fileLink)||""})(),o=(()=>a.endsWith(".jpeg")||a.endsWith(".jpg")||a.endsWith(".png")?l.LayoutElementType.Image:(a.endsWith(".svg"),l.LayoutElementType.Illustration))(),s=e.data.regions;if(o==="image")try{s.forEach(r=>{const g=c.find(d=>d.panelId===r.panelId);if(!g)throw new J(r);const B={id:l.generate(),src:a,type:o,y:r.top,x:r.left,width:r.width,height:r.height,layer:r.layer,layerIndex:r.layerIndex,productOverlay:e.type===l.StepType.ProductOverlay?!0:void 0,scaleX:1,scaleY:1,rotation:r.rotation,excludeFromExport:e.data.excludeFromPrint,preserveAspectRatio:"none"};A.push(new l.CreateElementCommand(B,g))})}catch(r){console.error(r)}else{const r=await l.fetchAsString(a,!0),g=B=>{const d=/<svg.*?<\/svg>/s,w=B.match(d)||[],h=(w==null?void 0:w.length)>0?w[0]:"",Q=l.domParser().parseFromString(h,"image/svg+xml").firstElementChild;if(!Q)throw new $("Failed to read SVG.");return l.sanitizeSvgTree(Q),l.xmlSerializer().serializeToString(Q)};s.forEach(B=>{const d=c.find(h=>h.panelId===B.panelId);if(!d)throw new J(B);const w={id:l.generate(),src:a,asset_key:a,svg:g(r),colors:{},type:o,y:B.top,x:B.left,width:B.width,height:B.height,layer:B.layer,layerIndex:B.layerIndex,scaleX:1,scaleY:1,rotation:B.rotation,productOverlay:e.type===l.StepType.ProductOverlay?!0:void 0,excludeFromExport:e.data.excludeFromPrint};A.push(new l.CreateElementCommand(w,d))})}return A},kn=async(c,e,t,A)=>{const n=[],a=t.data,i=30,o=E=>E.vertical?"center":E.textAlign||"center",s=()=>{var D;const E=A.option;if(!E)return;const Q=((D=E.variants)==null?void 0:D.find(I=>I.id===a.fontVariantId))||l.getDefaultVariant(E);if(!Q||!Q.asset)return;e[A.stepName]={selectedVariants:[Q]};const m=Q.asset.fileLink;if(m)return m},g=await(async()=>{const E=s();if(!E)return;const Q=await l.loadFont(E);return{assetUrl:E,name:Q.names.fullName.en}})(),B=(A.data.replaceableText?A.data.replaceableText.replace("{{}}",a.text):a.text)||"",d=l.applyTextTransformations(B,{vertical:A.data.vertical,uppercase:A.data.uppercase}),w=async E=>{const Q=E.colorOption;if(!Q)return;const m=L.getDefaultVariant(Q);return m==null?void 0:m.color},h=a.color||await w(A.data),u=A.data.regions;for(const E of u){const Q=c.find(D=>D.panelId===E.panelId);if(!Q)continue;const m={stepName:t.name,id:l.generate(),align:o(A.data),curved:A.data.curved,fill:a.color||h||"#000000",fontData:g,fontSize:A.data.size||i,height:E.height,layer:E.layer,layerIndex:E.layerIndex,paths:A.data.paths,rotation:E.rotation,text:d,type:l.LayoutElementType.Textbox,vertical:A.data.vertical,verticalAlign:A.data.verticalAlign||"middle",width:E.width,x:E.left,y:E.top};if(g){const[D,I]=l.determineCorrectFontSizeAndLines(A.data.size||i,g,E,[l.applyTextTransformations(d,{vertical:A.data.vertical,uppercase:A.data.uppercase})],{size:A.data.size,minSize:A.data.minSize,maxSize:A.data.maxSize});n.push(new l.CreateElementCommand({...m,fontSize:D,text:m.curved?m.text:(I||[]).join(`
2040
- `)},Q))}else n.push(new l.CreateElementCommand(m,Q))}return n},bn=(c,e)=>c.conditions?c.conditions.every(t=>{const A=e[t.targetStepName];if(A&&A.selectedVariants){const n=A.selectedVariants;return t.requiredVariantSelections.some(a=>n.find(i=>i.id===a)!==void 0)}return!1}):!0,eA=async(c,e,t,A)=>{const n=[],a={};for(const i of c){const o=e.steps.find(s=>s.stepName===i.name);if(o)switch(o.type){case l.StepType.DigitalContent:n.push(...await xn(t,i,o));break;case l.StepType.Frame:case l.StepType.Photo:n.push(...await Nn(t,a,i,o));break;case l.StepType.Illustration:n.push(...await Hn(t,a,i,o));break;case l.StepType.Module:n.push(...await Rn(t,i,o));break;case l.StepType.Picture:n.push(...await Un(t,a,i,o));break;case l.StepType.Shape:n.push(...await vn(t,a,i,o));break;case l.StepType.Text:n.push(...await kn(t,a,i,o));break}}for(const i of e.steps)i.type!==l.StepType.SilentIllustration&&i.type!==l.StepType.ProductOverlay||bn(i,a)&&n.push(...await Gn(t,i,A));return n};class Pe{constructor(e){this.handleCompleteRender=null;const t=new Map;e.forEach(A=>t.set(A.id,new Tn(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()))}onCompleteRender(){this.handleCompleteRender&&this.handleCompleteRender(Array.from(this.layouts.values()))}getAll(){return this.layouts}}const Jn=(()=>new Promise((c,e)=>{const A=l.createCanvas().getContext("webgl2");c(!!A)}))();class Tn{constructor(e,t,A,n){this.hasSetStaticContext=!1,this.interactiveDirty=!1,this.staticCtxDirty=!1,this.lastRequestedRenderArguments=void 0,this.lastCompletedStaticRender=void 0,this.lastModificationID=void 0,this.renderQueue=new ke(2),this.id=e,this.name=t,this.service=A,this.panelSize=n}getID(){return this.id}getName(){return this.name}getPanelSize(){return this.panelSize}getStaticContext(){return this.textureCtx}setStaticContext(e){if(this.textureCtx=e,this.lastRequestedRenderArguments){const{workflow:t,layouts:A,productOverlayImageUrl:n}=this.lastRequestedRenderArguments;this.render(t,A,n)}}getStaticContextDirty(){return this.staticCtxDirty}setStaticContextDirty(e){this.staticCtxDirty=e}getInteractiveCanvasDirty(){return this.interactiveDirty}setInteractiveCanvasDirty(e){this.interactiveDirty=e}markLastCompletedStaticRender(){this.lastCompletedStaticRender=Date.now(),this.service.onCompleteRender()}getLastCompletedStaticRender(){return this.lastCompletedStaticRender}getLastModificationID(){return this.lastModificationID}async render(e,t,A){const n=se(t);this.lastRequestedRenderArguments={workflow:e,layouts:n,productOverlayImageUrl:A};const a=this.getStaticContext();if(!a){this.markLastCompletedStaticRender(),this.setStaticContextDirty(!1);return}this.renderQueue.enqueue(new On(this.getID(),a,await Jn,()=>{this.markLastCompletedStaticRender(),this.setStaticContextDirty(!0)},e,n,A))}}class On extends Ge{constructor(e,t,A,n,a,i,o){super(),this.layoutId=e,this.ctx=t,this.nonPOTSupport=A,this.onRender=n,this.workflow=a,this.layouts=i,this.productOverlayImageUrl=o}getDynamicTextureResolution(){return this.getIsMobile()||!this.offscreenRenderingSupported()?{width:1024,height:1024}:{width:2048,height:2048}}getIsMobile(){return window.innerWidth<=480}offscreenRenderingSupported(){return navigator.userAgent.includes("SamsungBrowser")?!1:!!window.Worker&&!!window.OffscreenCanvas}resizeFit(e,t=4096){const A=t/e.width,n=t/e.height,a=Math.min(A,n);return a>1?e:{width:e.width*a,height:e.height*a}}async execute(){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,n=e.layoutState.layout.height,a=this.getDynamicTextureResolution().width,i=this.getDynamicTextureResolution().height;let o,s;if(this.nonPOTSupport){const d=a/i;A/n<d?(o=a,s=n*(a/A)):(o=A*(i/n),s=i);const h=this.resizeFit({width:o,height:s});o=h.width,s=h.height}else o=this.getDynamicTextureResolution().width,s=this.getDynamicTextureResolution().height;const r=l.getSvgElement(e.layoutState.layout,t,{renderingConfiguration:{purpose:l.LayoutRenderingPurpose.ThreeD}}),g=l.renderPapyrusComponentAsString(r),B=await it.Pith.from(this.ctx,g,{anonymousCrossOrigin:!0,ignoreDimensions:!this.nonPOTSupport,ignoreAnimation:!0,ignoreClear:!0,ignoreMouse:!0,enableRedraw:!1,createCanvas:l.createCanvas,createImage:l.loadImage,DOMParser:l.getDomParser(),fetch:l.fetch});B.resize(o,s),await B.render(),this.onRender()}}const Ln=(c,e)=>{const t=[];return c.forEach(A=>{const n=e.steps.find(a=>a.stepName===A.stepName);(n==null?void 0:n.type)===l.StepType.Text&&A.stepAspectType==="Text"&&t.push({name:n.stepName,data:{text:A.value}})}),t},zn=async(c,e,t,A)=>{let n={serializableWorkflow:{steps:[]},layouts:{}};n=new l.GroupCommand(t.map(s=>new l.CreateLayoutCommand(s))).apply(n);const i=await eA(c,e,t,A);return new l.GroupCommand(i).apply(n)},jn=M.gql`
2040
+ `)},Q))}else n.push(new l.CreateElementCommand(m,Q))}return n},bn=(c,e)=>c.conditions?c.conditions.every(t=>{const A=e[t.targetStepName];if(A&&A.selectedVariants){const n=A.selectedVariants;return t.requiredVariantSelections.some(a=>n.find(i=>i.id===a)!==void 0)}return!1}):!0,eA=async(c,e,t,A)=>{const n=[],a={};for(const i of c){const o=e.steps.find(s=>s.stepName===i.name);if(o)switch(o.type){case l.StepType.DigitalContent:n.push(...await xn(t,i,o));break;case l.StepType.Frame:case l.StepType.Photo:n.push(...await Nn(t,a,i,o));break;case l.StepType.Illustration:n.push(...await Hn(t,a,i,o));break;case l.StepType.Module:n.push(...await Rn(t,i,o));break;case l.StepType.Picture:n.push(...await Un(t,a,i,o));break;case l.StepType.Shape:n.push(...await vn(t,a,i,o));break;case l.StepType.Text:n.push(...await kn(t,a,i,o));break}}for(const i of e.steps)i.type!==l.StepType.SilentIllustration&&i.type!==l.StepType.ProductOverlay||bn(i,a)&&n.push(...await Gn(t,i,A));return n};class Pe{constructor(e){this.handleCompleteRender=null;const t=new Map;e.forEach(A=>t.set(A.id,new Tn(A.id,A.name,this))),this.layouts=t}setCompleteRenderCallback(e){this.handleCompleteRender=e,e(Array.from(this.layouts.values()))}onCompleteRender(){this.handleCompleteRender&&this.handleCompleteRender(Array.from(this.layouts.values()))}getAll(){return this.layouts}}const Jn=(()=>new Promise((c,e)=>{const A=l.createCanvas().getContext("webgl2");c(!!A)}))();class Tn{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 ke(2),this.id=e,this.name=t,this.service=A}getID(){return this.id}getName(){return this.name}getStaticContext(){return this.textureCtx}setStaticContext(e){if(this.textureCtx=e,this.lastRequestedRenderArguments){const{workflow:t,layouts:A,productOverlayImageUrl:n}=this.lastRequestedRenderArguments;this.render(t,A,n)}}getStaticContextDirty(){return this.staticCtxDirty}setStaticContextDirty(e){this.staticCtxDirty=e}getInteractiveCanvasDirty(){return this.interactiveDirty}setInteractiveCanvasDirty(e){this.interactiveDirty=e}markLastCompletedStaticRender(){this.lastCompletedStaticRender=Date.now(),this.service.onCompleteRender()}getLastCompletedStaticRender(){return this.lastCompletedStaticRender}getLastModificationID(){return this.lastModificationID}async render(e,t,A){const n=se(t);this.lastRequestedRenderArguments={workflow:e,layouts:n,productOverlayImageUrl:A};const a=this.getStaticContext();if(!a){this.markLastCompletedStaticRender(),this.setStaticContextDirty(!1);return}this.renderQueue.enqueue(new On(this.getID(),a,await Jn,()=>{this.markLastCompletedStaticRender(),this.setStaticContextDirty(!0)},e,n,A))}}class On extends Ge{constructor(e,t,A,n,a,i,o){super(),this.layoutId=e,this.ctx=t,this.nonPOTSupport=A,this.onRender=n,this.workflow=a,this.layouts=i,this.productOverlayImageUrl=o}getDynamicTextureResolution(){return this.getIsMobile()||!this.offscreenRenderingSupported()?{width:1024,height:1024}:{width:2048,height:2048}}getIsMobile(){return window.innerWidth<=480}offscreenRenderingSupported(){return navigator.userAgent.includes("SamsungBrowser")?!1:!!window.Worker&&!!window.OffscreenCanvas}resizeFit(e,t=4096){const A=t/e.width,n=t/e.height,a=Math.min(A,n);return a>1?e:{width:e.width*a,height:e.height*a}}async execute(){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,n=e.layoutState.layout.height,a=this.getDynamicTextureResolution().width,i=this.getDynamicTextureResolution().height;let o,s;if(this.nonPOTSupport){const d=a/i;A/n<d?(o=a,s=n*(a/A)):(o=A*(i/n),s=i);const h=this.resizeFit({width:o,height:s});o=h.width,s=h.height}else o=this.getDynamicTextureResolution().width,s=this.getDynamicTextureResolution().height;const r=l.getSvgElement(e.layoutState.layout,t,{renderingConfiguration:{purpose:l.LayoutRenderingPurpose.ThreeD}}),g=l.renderPapyrusComponentAsString(r),B=await it.Pith.from(this.ctx,g,{anonymousCrossOrigin:!0,ignoreDimensions:!this.nonPOTSupport,ignoreAnimation:!0,ignoreClear:!0,ignoreMouse:!0,enableRedraw:!1,createCanvas:l.createCanvas,createImage:l.loadImage,DOMParser:l.getDomParser(),fetch:l.fetch});B.resize(o,s),await B.render(),this.onRender()}}const Ln=(c,e)=>{const t=[];return c.forEach(A=>{const n=e.steps.find(a=>a.stepName===A.stepName);(n==null?void 0:n.type)===l.StepType.Text&&A.stepAspectType==="Text"&&t.push({name:n.stepName,data:{text:A.value}})}),t},zn=async(c,e,t,A)=>{let n={serializableWorkflow:{steps:[]},layouts:{}};n=new l.GroupCommand(t.map(s=>new l.CreateLayoutCommand(s))).apply(n);const i=await eA(c,e,t,A);return new l.GroupCommand(i).apply(n)},jn=M.gql`
2041
2041
  ${te}
2042
2042
  fragment ProductFields on Product {
2043
2043
  id
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@spiffcommerce/core",
3
- "version": "21.14.0-alpha.0",
3
+ "version": "21.14.0",
4
4
  "description": "Core client API for interacting with the Spiff Commerce backend.",
5
5
  "source": "src/index.ts",
6
6
  "main": "dist/index.umd.cjs",