@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 +1 -9
- package/dist/index.js +3 -11
- package/dist/index.umd.cjs +1 -1
- package/package.json +1 -1
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
|
|
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
|
|
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
|
|
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
|
}
|
package/dist/index.umd.cjs
CHANGED
|
@@ -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
|
|
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
|