@spiffcommerce/core 0.2.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/module.js ADDED
@@ -0,0 +1,98 @@
1
+ import{CommandContext as e,getSvgString as t}from"papyrus/build/main/CommandContext";import{CreateElementCommand as a,TextChangeCommand as i,FontAlignmentCommand as n,FontColorCommand as o,FontAlgorithmCommand as s,GroupCommand as r,DeleteElementCommand as l,MoveCommand as c,ResizeCommand as d,RotateCommand as h,FontSizeCommand as p,UpdateWorkflowStateCommand as u,UpdateFramePattern as m,IllustrationColorCommand as f,IllustrationCacheCommand as g,ShiftPatchworkCommand as w,FontSourceCommand as y,CreateLayoutCommand as S}from"papyrus/build/main/command";import{LayoutElementFactory as v}from"papyrus/build/main/Elements/factory";import{SpiffCommerce3DPreviewService as x}from"spiff-preview";import{loadFontFromExternalUrl as C,getFontMetrics as b}from"papyrus/build/main/font";import k from"swagger-client";import{createHttpLink as I,InMemoryCache as E,ApolloClient as N,from as R,gql as O}from"@apollo/client";import{setContext as M}from"@apollo/client/link/context";import{onError as L}from"@apollo/client/link/error";import D from"cross-fetch";import{createContext as P,useContext as A,useEffect as z,useState as T,useReducer as V,useMemo as U,useRef as F,useCallback as W}from"react";import{jsx as q,jsxs as $,Fragment as j}from"react/jsx-runtime";import{UnitOfMeasurement as B,ScaleAxis as K}from"papyrus/build/main/types";import H from"lodash.isequal";import{LayoutElementType as X,TextAlgorithm as G}from"papyrus/build/main/LayoutsState/types";import{getAxisAlignedBoundingBox as Y,isCloseToValue as Z,mmPerPixel as _,cmPerPixel as J,getElementVertices as Q,rotateAroundPoint as ee,findAngle as te,currentDirection as ae}from"papyrus/build/main/math";import{calculateTextboxLines as ie}from"papyrus/build/main/text/algorithm/traditional";import{defaultLineHeightFactor as ne,applyTextTransformations as oe}from"papyrus/build/main/text/shared";import{getAttributesFromArrayBuffer as se}from"papyrus/build/main/image";import re,{Canvg as le}from"canvg";import{StepType as ce,StepAspectType as de}from"papyrus/build/main/generation/Workflow";import he from"lodash.clonedeep";import pe from"papyrus/build/main/module/resolver";import ue from"lodash.debounce";import{getFrameData as me,calculateOffsets as fe,frameDataCache as ge,generateDefaultRectangleFrameSvg as we,GetSVGDimensions as ye,patternImageDataCache as Se}from"papyrus/build/main/frame";import{generateSVGWithUnknownColors as ve,modifySVGWithElementProperties as xe,sanitizeSvgTree as Ce}from"papyrus/build/main/illustration";import{findElement as be,rehydrateSerializedLayout as ke}from"papyrus/build/main/LayoutsState";import{toString as Ie}from"qrcode";import{fetchAsString as Ee}from"papyrus/build/main/crossplatform";import Ne from"react-dom/server";import Re from"papyrus/build/main/Elements/Patchwork";import{determineCorrectFontSizeAndLines as Oe}from"papyrus/build/main/text/algorithm/autosize";import{generateCommands as Me}from"papyrus/build/main/generation";const Le=new class{cache=new Map;async cacheRequiredOptions(e){const t=e.steps.map((e=>e.optionId)).filter((e=>void 0!==e)),a=e.steps.map((e=>e.data.colourOptionId)).filter((e=>void 0!==e)),i=[...new Set([...t,...a])].map((async e=>{const t=await Le.getLocalOrFromServer(Te,e);"Font"===t.data.type&&t.data.variants.forEach((async e=>{if(e.assetKey){const t=(await ft.getLocalOrFromServer(e.assetKey)).links.find((e=>"cdn"===e.rel))?.href;t&&await C(t)}}))}));await Promise.allSettled([...i])}async getLocalOrFromServer(e,t){if(this.cache.has(t))return this.cache.get(t);const a=(await e.execute("getOptionV2",{id:t})).body;return this.cache.set(t,a),a}getLocalOrUndefined(e){if(e)return this.cache.get(e)}async getAssetTileImageForVariant(e){if(e.thumbnailKey){const t=await ft.getLocalOrFromServer(e.thumbnailKey),a=t.links.find((e=>"thumbnail"===e.rel)),i=t.links.find((e=>"cdn"===e.rel));return a?.href||i?.href}const t=e.assetKey;if(t){const e=await ft.getLocalOrFromServer(t),a=e.links.find((e=>"thumbnail"===e.rel)),i=e.links.find((e=>"cdn"===e.rel));return a?.href||i?.href}return e.materialId?e.materialId:""}getDefaultVariant(e){const t=e.variants;return 1===t.length?t[0]:void 0!==e.defaultVariant?t.find((t=>t.id===e.defaultVariant)):void 0}getDisplayImageSource=e=>{if(e){const t=e.displayImage?.links.find((e=>"cdn"===e.rel));if(t)return t.href}};getSelectedVariant=(e,t)=>{if(e&&0!==t.length)return e.variants.find((e=>e.id===t[0]))};getSelectedVariants=(e,t)=>e?.variants.filter((e=>t.includes(e.id)))||[]};const De=new class{defaultServerUrl="https://api.spiff.com.au";defaultServicesApiUrl="https://services.spiff.com.au";constructor(){this.serverUrl=this.defaultServerUrl,this.servicesApiUrl=this.defaultServicesApiUrl,this.serverUrlCallbacks=[]}getServerUrl(){return this.serverUrl}getServicesApiUrl(){return this.servicesApiUrl}setServerUrl(e){this.serverUrl=e,this.serverUrlCallbacks.forEach((e=>e()))}setServicesApiUrl(e){this.servicesApiUrl=e}addServerUrlCallback(e){this.serverUrlCallbacks.push(e)}};let Pe;const Ae=e=>{Pe=e},ze=async()=>({transactionOwnerId:Pe});const Te=new class{uncachedOperations=[];constructor(){De.addServerUrlCallback((async()=>{this.client=void 0,this.client=await this.constructClient()}))}setUncachedOperations(e){this.uncachedOperations=e}async execute(e,t){const a=this.uncachedOperations.includes(e)?e+"_private":e;return new Promise(((e,i)=>{this.getClient().then((n=>{n.execute({operationId:a,parameters:t}).then((t=>e(t))).catch((e=>{e.response&&e.response.status&&e.response.status>=500||(!e.response&&i(new Error(e)),e.response&&i(new Error(`${e.response.status} ${e.response.url}`)))}))})).catch((e=>{i(e)}))}))}async syncAuth(e){const t=await ze();if(t.bearer?e.authorizations={...e.authorizations,OAuth2:{token:{access_token:t.bearer,token_type:"Bearer"}}}:e.authorizations={...e.authorizations,OAuth2:{token:{access_token:"",token_type:"Bearer"}}},t.activeIntegration)e.authorizations={...e.authorizations,ActiveIntegration:t.activeIntegration};else{const t={...e.authorizations};delete t.ActiveIntegration,e.authorizations=t}if(t.partnerId)e.authorizations={...e.authorizations,PartnerId:t.partnerId};else{const t={...e.authorizations};delete t.PartnerId,e.authorizations=t}}async getClient(){return this.client||(this.client=await this.constructClient()),this.syncAuth(this.client),Promise.resolve(this.client)}async constructClient(){const e=await ze(),t=De.getServerUrl()+"/v2/api-docs";return await k(t,{authorizations:{OAuth2:{token:{access_token:e.bearer,token_type:"Bearer"}},PartnerId:e.partnerId}})}};const Ve=new class{constructor(){this.shadowGraphqlClient=this.constructShadowGraphqlClient(),De.addServerUrlCallback((()=>{this.shadowGraphqlClient=this.constructShadowGraphqlClient()}))}getShadowGraphqlClient(){return this.shadowGraphqlClient}constructShadowGraphqlClient(){const e=I({uri:`${De.getServerUrl()}/graphql`,fetch:D}),t=M((async(e,{headers:t})=>{const a=t||{},i=await ze();return i.bearer&&(a.Authorization=`Bearer ${i.bearer}`),i.partnerId&&(a.partnerId=i.partnerId),i.activeIntegration&&(a.activeIntegration=i.activeIntegration),i.transactionOwnerId&&(a.transactionOwnerId=i.transactionOwnerId),{headers:a}})),a=L((({operation:e,graphQLErrors:t,networkError:a})=>{(t||[]).forEach((({message:t,locations:a,path:i})=>{console.log("[GraphQL Operation Error]"),console.log("Name:"+e.operationName),console.log("Query:"+JSON.stringify(e.query)),console.log(`Message: ${t}, Location: ${JSON.stringify(a,null,2)}, Path: ${i}`),console.log("Variables:"+JSON.stringify(e.variables))})),a&&console.log("GraphQL Network error")}));const i=new E({typePolicies:{Transaction:{fields:{transactionOwnerId:{read:(e=null)=>e},customLogoLink:{read:(e=null)=>e},workflowFooterLogoLink:{read:(e=null)=>e},workflowState:{read:(e=null)=>e},bulkSourceUrl:{read:(e=null)=>e}}}}});return new N({link:R([a,t,e]),cache:i,name:"Core"})}},Ue=P(new e),Fe=()=>{const e=A(Ue);z((()=>{e.registerStateCallback((()=>{a(new Date)}))}),[e]);const[t,a]=T(new Date);return{commandDispatcher:t=>{e.apply(t)},getLayoutById:t=>e.getLayoutById(t),getAllLayouts:()=>e.getAllLayouts(),getReducerState:()=>{const t=e.getState();return t||{transaction:{layouts:{},serializableWorkflow:{steps:[]}}}},lastUpdated:t,flattenSequence:(t,a)=>{e.flattenSequence(t,a)}}};let We;var qe;(qe=We||(We={})).None="None",qe.FrameAdjustment="FrameAdjustment",qe.FinalizeDesign="FinalizeDesign";const $e=(e,t)=>({layoutId:e()[0].layoutState.layout.id,selectedElement:void 0,zoom:t,maxZoom:5,units:B.Pixel,subMenu:We.None,activeModifierKeys:[],metaPressed:!1,elementEvent:void 0,scrolledMovement:!1}),je=(e,t)=>H(e,t.apply(e))?e:t.apply(e),Be=P({}),Ke=e=>{const{getAllLayouts:t}=Fe(),[a,i]=V(je,$e(t,e.defaultZoom||1)),n=U((()=>({state:a,uiDispatcher:i})),[a,i]);return q(Be.Provider,{value:n,children:e.children})};class He{constructor(e){this.changes=e}apply(e){return{...e,...this.changes}}}const Xe=()=>A(Be),Ge=7*window.devicePixelRatio,Ye=(e,t,a,i)=>{const n=t.layout.width,o=t.layout.height,s=t.elements.filter((t=>t.id!==e.id&&!t.immutable&&!t.productOverlay)),r=s.map((e=>Y(e.x,e.y,e.width,e.height,e.rotation))),l=[],c=new Set;r.forEach((e=>c.add(e.minX))),r.forEach((e=>c.add(e.maxX))),[0,n/2,n].forEach((e=>c.add(e)));const d=new Set;r.forEach((e=>d.add(e.minY))),r.forEach((e=>d.add(e.maxY))),[0,o/2,o].forEach((e=>d.add(e)));const h=s.map((e=>e.y));for(let e=-315;e<=315;e+=45)h.push(e);const p=Y(e.x,e.y,e.width,e.height,e.rotation),u=[{value:p.minX,anchor:-1},{value:p.minX+(p.maxX-p.minX)/2,anchor:0},{value:p.minX+(p.maxX-p.minX),anchor:1}],m=[{value:p.minY,anchor:-1},{value:p.minY+(p.maxY-p.minY)/2,anchor:0},{value:p.minY+(p.maxY-p.minY),anchor:1}],f=[{value:e.rotation,anchor:0}],g=(e,t,i,s)=>{const r=[];return t.forEach((t=>{const l=i.find((e=>Z(t,e.value,2*a))),[c,d]=((e,t)=>[{x:"x"===e?t:0,y:"x"===e?0:t},{x:"x"===e?t:n,y:"x"===e?o:t}])(e,t),h="rotation"===e?null:q("line",{x1:c.x,y1:c.y,x2:d.x,y2:d.y,stroke:s||"#D61B5C",strokeDasharray:5*a,strokeWidth:1.2*a,overflow:"overlay"},`${e}-${t}-${c.x}-${c.y}-${d.x}-${d.y}`);void 0!==l&&r.push({type:e,value:t,anchorPoint:l.anchor,svgNode:h,guidelineCoordinates:[c,d]})})),r};return l.push(...g("x",Array.from(c),u,i)),l.push(...g("y",Array.from(d),m,i)),l.push(...g("rotation",h,f,i)),l};let Ze;var _e;let Je;var Qe;(_e=Ze||(Ze={})).Translate="Translate",_e.Rotate="Rotate",_e.Resize="Resize",(Qe=Je||(Je={})).ControlLeft="ControlLeft",Qe.ControlRight="ControlRight",Qe.Equal="Equal",Qe.MetaLeft="MetaLeft",Qe.MetaRight="MetaRight",Qe.Minus="Minus",Qe.ArrowLeft="ArrowLeft",Qe.ArrowRight="ArrowRight",Qe.ArrowUp="ArrowUp",Qe.ArrowDown="ArrowDown",Qe.AltLeft="AltLeft",Qe.AltRight="AltRight",Qe.Delete="Delete",Qe.Backspace="Backspace";const et=(e,t,a,i)=>{const n=()=>{switch(a){case B.Pixel:return 1;case B.Millimeter:return _;case B.Centimeter:return J;default:throw new Error("Unknown unit of measurement")}};let o=t.x,s=t.y,r=t.x,l=t.y;switch(e){case Je.ArrowLeft:r=t.x-1/n();break;case Je.ArrowUp:l=t.y-1/n();break;case Je.ArrowRight:r=t.x+1/n();break;case Je.ArrowDown:l=t.y+1/n();break;default:throw new Error("Unhandled element interaction!")}const d=Y(r,l,t.width,t.height,t.rotation);return(!i||d.minX>=i.left&&d.maxX<=i.left+i.width&&d.minY>=i.top&&d.maxY<=i.top+i.height)&&(o=r,s=l),new c(t.id,o,s)};var tt=0,at=0,it=0;const nt=(e,t,a,n,o,s,r)=>{const l=((e,t,a,i,n,o,s)=>{const r=i.width/t.width,l=i.height/t.height,c=e.movementX/r,d=e.movementY/l,h=a.rotation*Math.PI/180,p=Math.sin(h),u=Math.cos(h);let m;switch(n.type){case Ze.Resize:let t={top:a.y,left:a.x,width:a.width,height:a.height,rotation:a.rotation,fontSize:a.fontSize},f=t;switch(n.screenAxis){case K.North:{const e=-c*p+d*u,i=a.y+e,n=a.height-e,o=Q({...a}).center,s=Q({...a,y:i,height:n}).center,r=ee(s,o,h),l=r.x-a.width/2,m=r.y-n/2;f={...t,left:l,top:m,height:n}}break;case K.East:{const e=c*u+d*p,i=a.width+e;let n=a.height;if(a.type===X.Textbox){const e=a;n=ie(e.fontSize,e.fontData,e,e.input||e.text||"",e.lineHeight).requiredHeight}const o=Q({...a}).center,s=Q({...a,width:i,height:n}).center,r=ee(s,o,h),l=r.x-i/2,m=r.y-n/2;f={...t,left:l,top:m,width:i,height:n}}break;case K.West:{const e=c*u+d*p,i=a.x+e,n=a.width-e;let o=a.height;if(a.type===X.Textbox){const e=a;o=ie(e.fontSize,e.fontData,e,e.input||e.text||"",e.lineHeight).requiredHeight}const s=Q({...a}).center,r=Q({...a,width:n,height:o,x:i}).center,l=ee(r,s,h),m=l.x-n/2,g=l.y-o/2;f={...t,left:m,top:g,width:n,height:o}}break;case K.South:{const e=-c*p+d*u,i=a.height+e,n=Q({...a}).center,o=Q({...a,height:i}).center,s=ee(o,n,h),r=s.x-a.width/2,l=s.y-i/2;f={...t,left:r,top:l,height:i}}break;case K.Northeast:{const e=c*u+d*p,i=a.width+e;let n=a.height+e,o=a.y-e,s=a.fontSize;if(a.type===X.Textbox){const t=a;s=t.fontSize+e/8,n=ie(s,t.fontData,t,t.input||t.text||"",t.lineHeight).requiredHeight;const i=t.lineHeight||ne;o=a.y-e*i/8}const r=Q({...a}).center,l=Q({...a,width:i,height:n,y:o}).center,m=ee(l,r,h),g=m.x-i/2,w=m.y-n/2;f={...t,left:g,top:w,width:i,height:n,fontSize:s}}break;case K.Northwest:{const e=-c*u+-d*p,i=a.x-e,n=a.width+e;let o=a.y-e,s=a.height+e,r=a.fontSize;if(a.type===X.Textbox){const t=a;r=t.fontSize+e/8,s=ie(r,t.fontData,t,t.input||t.text||"",t.lineHeight).requiredHeight;const i=t.lineHeight||ne;o=a.y-e*i/8}const l=Q({...a}).center,m=Q({...a,x:i,y:o,width:n,height:s}).center,g=ee(m,l,h),w=g.x-n/2,y=g.y-s/2;f={...t,left:w,top:y,width:n,height:s,fontSize:r}}break;case K.Southeast:{const e=c*u+d*p,i=a.width+e;let n=a.height+e,o=a.fontSize;if(a.type===X.Textbox){const t=a;o=t.fontSize+e/8,n=ie(o,t.fontData,t,t.input||t.text||"",t.lineHeight).requiredHeight}const s=Q({...a}).center,r=Q({...a,width:i,height:n}).center,l=ee(r,s,h),m=l.x-i/2,g=l.y-n/2;f={...t,left:m,top:g,width:i,height:n,fontSize:o}}break;case K.Southwest:{const e=-c*u+-d*p,i=a.width+e;let n=a.x-e,o=a.height+e,s=a.fontSize;if(a.type===X.Textbox){const t=a;s=t.fontSize+e/8,o=ie(s,t.fontData,t,t.input||t.text||"",t.lineHeight).requiredHeight}const r=Q({...a}).center,l=Q({...a,width:i,height:o,x:n}).center,m=ee(l,r,h),g=m.x-i/2,w=m.y-o/2;f={...t,left:g,top:w,width:i,height:o,fontSize:s}}}return m=Y(f.left,f.top,f.width,f.height,f.rotation),(!s||m.minX>=s.left&&m.maxX<=s.left+s.width&&m.minY>=s.top&&m.maxY<=s.top+s.height)&&(t=f),t;case Ze.Rotate:const g={x:e.clientX,y:e.clientY};let w,y=a.rotation;const S=Q(a,i,{x:r,y:l}),v=te(g,S.c,S.d),x=te(g,S.d,S.c);if(0===o.filter((e=>"rotation"===e.type)).length)it=0,w=(a.rotation+v-x)%360;else{it+=Math.sqrt(c**2+d**2);const e=Math.abs(it)>Ge/r;w=e?(a.rotation+v-x)%360:o.find((e=>"rotation"===e.type))?.value||0,e&&(it=0)}return m=Y(a.x,a.y,a.width,a.height,w),(!s||m.minX>=s.left&&m.maxX<=s.left+s.width&&m.minY>=s.top&&m.maxY<=s.top+s.height)&&(y=w),{top:a.y,left:a.x,width:a.width,height:a.height,rotation:y};case Ze.Translate:let C,b,k=a.x,I=a.y;if(0===o.filter((e=>"rotation"!==e.type)).length)tt=0,at=0,C=a.x+c,b=a.y+d;else{const e=o.find((e=>"x"===e.type)),t=o.find((e=>"y"===e.type));e||(tt=0),t||(at=0);const i=Math.abs(tt)>Ge/r,n=Math.abs(at)>Ge/l;C=e?i?a.x+tt:a.x:a.x+c,b=t?n?a.y+at:a.y:a.y+d,tt=i?0:tt+c,at=n?0:at+d}return m=Y(C,b,a.width,a.height,a.rotation),(!s||m.minX>=s.left&&m.maxX<=s.left+s.width&&m.minY>=s.top&&m.maxY<=s.top+s.height)&&(k=C,I=b),{top:I,left:k,width:a.width,height:a.height,rotation:a.rotation}}})(e,t,a,n,o,s,r),u=[];if(a.type===X.Textbox){const e=a;u.push(new i(e.id,e.text||e.input||""))}if(u.push(new c(a.id,l.left,l.top),new d(a.id,l.width,l.height),new h(a.id,l.rotation)),a.type===X.Textbox){const e=a;l.fontSize&&e.fontSize!==l.fontSize&&u.push(new p(e.id,l.fontSize))}return u},ot=()=>{const e=()=>Math.floor(65536*(1+Math.random())).toString(16).substring(1);return e()+e()+"-"+e()+"-"+e()+"-"+e()+"-"+e()+e()+e()},st=(e,t,a,i,n,o,s)=>{const{state:c,uiDispatcher:d}=A(Be),{getLayoutById:h,getReducerState:p,flattenSequence:u}=Fe(),[m,f]=T(void 0),[g,w]=T(void 0),y=h(c.layoutId);z((()=>{if("adjustment"===n&&e?.current&&i){if(i<.5)return void d(new He({zoom:.5}));if(i>c.maxZoom)return void d(new He({zoom:c.maxZoom}));d(new He({zoom:i}))}}),[i,d,e,n,c.maxZoom]);const S=W(((e,i)=>{d(new He({zoom:i}));const o=t?.current?.scrollWidth-t?.current?.clientWidth!=0,s=t?.current?.scrollHeight-t?.current?.clientHeight!=0;t.current&&a.current&&!c.scrolledMovement&&"advanced"===n&&(s&&(t.current.scrollTop=a.current.offsetTop+(t.current.scrollHeight-t.current.clientHeight)/2),o&&(t.current.scrollLeft=(a.current.offsetLeft+t.current.scrollWidth-t.current.clientWidth)/2))}),[d,t,a,c.scrolledMovement,n]);z((()=>{c.zoom<=1&&d(new He({scrolledMovement:!1}))}),[d,c.zoom]);const v=t?.current?.getBoundingClientRect(),x=((v?.width||1)+(v?.height||1))/2,C=(y.layoutState.layout.width+y.layoutState.layout.height)/2/x/c.zoom,b=U((()=>{const e=c.activeModifierKeys,t=c.elementEvent,a=e.includes(Je.ControlLeft)||e.includes(Je.MetaLeft)||e.includes(Je.ControlRight)||e.includes(Je.MetaRight);if(!c.selectedElement||!t||a)return[];const i=t&&t.type===Ze.Translate,n=t&&t.type===Ze.Rotate,o=y.layoutState.elements.find((e=>e.id===c.selectedElement));return(i||n)&&o?Ye(o,y.layoutState,C,s):[]}),[c.selectedElement,c.elementEvent,c.activeModifierKeys,y.layoutState,C]),k=W((()=>{const e=ot();f(e),w(p().transaction)}),[p]),I=W((()=>{d(new He({selectedElement:void 0}))}),[d]),E=W((()=>{d(new He({scrolledMovement:!0}))}),[d]),N=W(((a,i)=>{const n=y.layoutState.elements.find((e=>e.id===c.selectedElement));if(!(c.elementEvent&&e.current&&t.current&&c.selectedElement&&n))return;t.current.hasPointerCapture(a.pointerId)||t.current.setPointerCapture(a.pointerId);const s=e.current.getBoundingClientRect(),l=new r(nt(a,y.layoutState.layout,n,s,c.elementEvent,b,i));l.sequenceId=m,o(l)}),[y.layoutState.elements,y.layoutState.layout,c.elementEvent,e,c.selectedElement,t,b,o]),R=W((e=>{d(new He({elementEvent:e}))}),[d]),O=W((()=>{d(new He({elementEvent:void 0})),m&&g&&(u(m,g),f(void 0),w(void 0))}),[d,m,g,u]),M=W(((e,t)=>{let a=c.zoom;const i=c.maxZoom,s=c.selectedElement,r=c.activeModifierKeys;if((r.includes(Je.AltLeft)||r.includes(Je.AltRight))&&(e.code===Je.Equal||e.code===Je.Minus)){const t=.05*i;e.code===Je.Equal?d(new He({zoom:a+t<=i?a+=t:a})):d(new He({zoom:a-t>=.5?a-t:a}))}const h=y.layoutState.elements.find((e=>e.id===s));if(s&&h){if(e.code===Je.MetaLeft||e.code===Je.ControlLeft||e.code===Je.MetaRight||e.code===Je.ControlRight){const t=e.code,a=c.activeModifierKeys;if(!a.includes(t))return d(new He({activeModifierKeys:a.concat(t)}))}if(e.code===Je.ArrowDown||e.code===Je.ArrowUp||e.code===Je.ArrowLeft||e.code===Je.ArrowRight){d(new He({elementEvent:{type:Ze.Translate}}));const a=et(e.code,h,c.units,t);o(a),d(new He({elementEvent:void 0}))}e.code!==Je.Delete&&e.code!==Je.Backspace||"advanced"!==n||(d(new He({selectedElement:void 0})),o(new l(h.id)))}}),[o,d,y.layoutState.elements,n,c.activeModifierKeys,c.maxZoom,c.selectedElement,c.units,c.zoom]),L=W((e=>{if(e.code===Je.MetaLeft||e.code===Je.ControlLeft||e.code===Je.MetaRight||e.code===Je.ControlRight){const t=c.activeModifierKeys,a=e.code;d(new He({activeModifierKeys:t.filter((e=>e!==a))}))}}),[d,c.activeModifierKeys]);return{guidelines:b,scale:C,zoomableElementRef:a,setElementEvent:R,handleZoom:S,handleKeyDown:M,handleKeyUp:L,handlePointerPressedBackground:I,handlePointerReleased:O,handlePointerMove:N,handleScroll:E,handleSequenceStart:k}},rt=e=>{const{x:t,y:a,cursorStyle:i,onPointerDown:n,handleClass:o,cornerRadius:s,color:r,strokeWidth:l}=e;return q("circle",{className:o,cx:t,cy:a,r:s,fill:"#ffffff",style:{cursor:i},stroke:r,strokeWidth:l,onPointerDown:n})},lt=e=>{const{x:t,y:a,width:i,height:n,cursorStyle:o,onPointerDown:s,edgeHandleRadius:r,color:l,strokeWidth:c}=e;return q("rect",{x:t,y:a,width:i,height:n,rx:r,fill:"#ffffff",style:{cursor:o},stroke:l,strokeWidth:c,onPointerDown:s})},ct=e=>{const{color:t,elementHeight:a,elementWidth:i,onBeginResize:n,rotation:o,scaleFactor:s,disableX:r,disableY:l}=e,c=7.5*s,d=3*s,h=28*s,p=6*s,u=1.2*s,m=a-2*c,f=W(((e,t,a)=>{e.stopPropagation(),n(t,a)}),[n]),g=W((e=>f(e,ae(K.West,360-o),K.West)),[f,o]),w=W((e=>f(e,ae(K.East,360-o),K.East)),[f,o]),y=W((e=>f(e,ae(K.North,360-o),K.North)),[f,o]),S=W((e=>f(e,ae(K.South,360-o),K.South)),[f,o]),v=W((e=>f(e,K.Northwest,K.Northwest)),[f]),x=W((e=>f(e,K.Northeast,K.Northeast)),[f]),C=W((e=>f(e,K.Southwest,K.Southwest)),[f]),b=W((e=>f(e,K.Northeast,K.Southeast)),[f]),k=h<=m;return $(j,{children:[q(rt,{x:0,y:0,cursorStyle:"nwse-resize",onPointerDown:v,handleClass:"cornerNorthWest",cornerRadius:c,color:t,strokeWidth:u}),k?q(rt,{x:i,y:0,cursorStyle:"nesw-resize",onPointerDown:x,handleClass:"cornerNorthEast",cornerRadius:c,color:t,strokeWidth:u}):void 0,k?q(rt,{x:i,y:a,cursorStyle:"nwse-resize",onPointerDown:b,handleClass:"cornerSouthEast",cornerRadius:c,color:t,strokeWidth:u}):void 0,k?q(rt,{x:0,y:a,cursorStyle:"nesw-resize",onPointerDown:C,handleClass:"cornerSouthWest",cornerRadius:c,color:t,strokeWidth:u}):void 0,k&&!r?q(lt,{x:-p/2,y:a/2-h/2,width:p,height:h,onPointerDown:g,edgeHandleRadius:d,cursorStyle:"ew-resize",color:t,strokeWidth:u}):void 0,k&&!l?q(lt,{x:i/2-h/2,y:a-p/2,width:h,height:p,onPointerDown:S,edgeHandleRadius:d,cursorStyle:"ns-resize",color:t,strokeWidth:u}):void 0,r?void 0:q(lt,{x:i-p/2,y:a/2-Math.min(h,.8*a)/2,width:p,height:Math.min(h,.8*a),onPointerDown:w,edgeHandleRadius:d,cursorStyle:"ew-resize",color:t,strokeWidth:u}),k&&!l?q(lt,{x:i/2-h/2,y:-p/2,width:h,height:p,onPointerDown:y,edgeHandleRadius:d,cursorStyle:"ns-resize",color:t,strokeWidth:u}):void 0]})},dt=e=>{const{color:t,elementWidth:a,onBeginRotate:i,scaleFactor:n}=e,o=W((e=>{e.stopPropagation(),i()}),[i]),s=10*n,r=1.2*n;return $("g",{children:[q("circle",{cx:a/2,cy:-2.5*s,r:1.3*s,fill:"rgba(0, 0, 0, 0.5)",opacity:.4,style:{cursor:"ew-resize"},onPointerDown:o}),q("circle",{cx:a/2,cy:-2.5*s,r:s,fill:"#fff",style:{cursor:"ew-resize"},stroke:t,strokeWidth:r,onPointerDown:o}),$("svg",{x:a/2-s,y:-2.5*s-s,xmlns:"http://www.w3.org/2000/svg",style:{cursor:"ew-resize"},height:2*s,viewBox:"0 0 24 24",width:2*s,fill:t,onPointerDown:o,children:[q("path",{d:"M0 0h24v24H0z",fill:"none"}),q("path",{d:"M12 6v3l4-4-4-4v3c-4.42 0-8 3.58-8 8 0 1.57.46 3.03 1.24 4.26L6.7 14.8c-.45-.83-.7-1.79-.7-2.8 0-3.31 2.69-6 6-6zm6.76 1.74L17.3 9.2c.44.84.7 1.79.7 2.8 0 3.31-2.69 6-6 6v-3l-4 4 4 4v-3c4.42 0 8-3.58 8-8 0-1.57-.46-3.03-1.24-4.26z"})]})]})},ht=e=>{const{color:t,height:a,highlighted:i,id:n,immutable:o,onBeginMove:s,onBeginResize:r,onBeginRotate:l,onPointerEnter:c,onPointerLeave:d,onSelected:h,pressed:p,rotation:u,scaleFactor:m,selected:f,width:g,x:w,y:y,disableX:S,disableY:v}=e,x=1.2*m,C=W((e=>{2===e.button&&(e.stopPropagation(),h(n,e)),0===e.button&&(e.stopPropagation(),!f&&h(n,e),s())}),[n,f,h,s]),b=W((()=>{c(n)}),[n,c]),k=W((()=>{d(n)}),[n,d]);return $("g",{transform:`translate(${w}, ${y}) rotate(${u} ${g/2} ${a/2})`,children:[q("rect",{className:"interactableInnerRect",width:g,height:a,stroke:f||i?t:"none",pointerEvents:o?"none":"visibleFill",fill:"none",strokeWidth:x,style:{cursor:o?void 0:f?p?"grabbing":"grab":"pointer"},onPointerDown:o?void 0:C,onPointerEnter:o?void 0:b,onPointerLeave:o?void 0:k}),f&&$(j,{children:[q(dt,{color:t,elementWidth:g,onBeginRotate:l,scaleFactor:m}),q(ct,{color:t,elementHeight:a,elementWidth:g,rotation:u,scaleFactor:m,onBeginResize:r,disableX:S,disableY:v})]})]})},pt=({primaryColor:e,containerHeight:t,containerWidth:a,customViewbox:i,editorRef:n,elementEvent:o,guidelines:s,layoutHeight:r,layoutWidth:l,targetedElements:c,scale:d,selectedElement:h,onElementEvent:p,onElementSelected:u,onSequenceStart:m})=>{const{state:f}=Xe(),{getLayoutById:g}=Fe(),w=g(f.layoutId),[y,S]=T(void 0),v=W((e=>{S(e)}),[]),x=W((e=>{y===e&&S(void 0)}),[y]),C=W((()=>{m(),p({type:Ze.Translate})}),[p]),b=W(((e,t)=>{m(),p({type:Ze.Resize,relativeAxis:e,screenAxis:t})}),[p]),k=W((()=>{m(),p({type:Ze.Rotate})}),[p]),I=i||{x:0,y:0,width:l,height:r},E=d*(Math.sqrt(I.width*I.height)/1e3)*(100/Math.sqrt(t*a))*Math.sqrt((N=a/t,Math.exp(Math.abs(Math.log(N)))));var N;const R=w.layoutState.elements.findIndex((({id:e})=>e===h)),O=[...w.layoutState.elements];return R>=0&&O.push(O.splice(R,1)[0]),$("svg",{xmlns:"http://www.w3.org/2000/svg",xmlnsXlink:"http://www.w3.org/1999/xlink",xmlSpace:"preserve",version:"1.1",style:{touchAction:"none",position:"absolute",maxWidth:"100%",maxHeight:"100%"},width:"100%",height:"100%",viewBox:`${I.x} ${I.y} ${I.width} ${I.height}`,overflow:"overlay",children:[q("rect",{fill:"none",stroke:"none",ref:n,width:l,height:r}),s.map((e=>e.svgNode)),O.map((t=>{const a=void 0!==h&&t.id===h,i=a&&void 0!==o,n=void 0!==y&&t.id===y;return q(ht,{color:e,id:t.id,selected:a,highlighted:n,pressed:i,x:t.x,y:t.y,disableX:t.type===X.Frame,disableY:t.type===X.Textbox||t.type===X.Frame,width:t.width,height:t.height,rotation:t.rotation,immutable:t.immutable||c&&!c.includes(t.id),onSelected:u,onBeginMove:C,onBeginResize:b,onBeginRotate:k,onPointerEnter:v,onPointerLeave:x,scaleFactor:E},t.id)}))]})},ut=e=>{const{color:t,editorRef:a,zoomableElementRef:i,interactionElementRef:n,guidelines:o,isMakingAdjustments:s,viewmask:r,visibleLayoutId:l,xTranslation:c,yTranslation:d,targetedElements:h,borderRadius:p,handleContextMenu:u,handleKeyDown:m,handleKeyUp:f,handlePointerMove:g,handlePointerPressedBackground:w,handlePointerReleased:y,handleScroll:S,onSequenceStart:v,setElementEvent:x,onElementSelected:C}=e,{getLayoutById:b}=Fe(),k=b(l),I=k.layoutState,{state:E}=Xe(),N=W((e=>{if(r){const t={left:r.x,top:r.y,width:r.width,height:r.height,panelId:"",rotation:0};return m(e,t)}return m(e)}),[m,r]),R=W((e=>{if(r){const t={left:r.x,top:r.y,width:r.width,height:r.height,panelId:"",rotation:0};return g(e,t)}return g(e)}),[g,r]);return q("div",{style:{justifyContent:"center",position:"relative",height:"100%",width:"100%",scrollbarWidth:"none",outline:"none"},onContextMenu:u,onKeyDown:N,onKeyUp:f,onPointerDown:w,onPointerMoveCapture:R,onPointerUp:y,onWheelCapture:S,ref:n,tabIndex:-1,children:$("div",{ref:i,style:{height:"100%",transform:`scale(${E.zoom}) translate(${c}px, ${d}px)`,display:"grid",filter:"drop-shadow(rgba(0, 0, 0, 0.2) 0px 0px 6px)"},children:[e.children,k.getComponentWithProps({height:s?"100%":"auto",maxHeight:"100%",maxWidth:"100%",position:"absolute",viewmask:r,width:s?"100%":"auto",borderRadius:p}),q(pt,{primaryColor:t,containerHeight:i.current?.offsetHeight||1024,containerWidth:i.current?.offsetWidth||1024,editorRef:a,elementEvent:E.elementEvent,guidelines:o,layoutHeight:I.layout.height,layoutWidth:I.layout.width,onElementEvent:x,onSequenceStart:v,onElementSelected:C,scale:10/E.zoom,selectedElement:E.selectedElement,targetedElements:h})]})})},mt=({color:e,borderRadius:t,guidelineColor:a,handleContextMenu:i,onElementSelected:n})=>{const{commandDispatcher:o,getLayoutById:r}=Fe(),{state:l,uiDispatcher:c}=Xe(),d=F(null),h=F(null),p=F(null),{guidelines:u,handleKeyDown:m,handleKeyUp:f,handlePointerMove:g,handlePointerPressedBackground:w,handlePointerReleased:y,handleScroll:S,handleSequenceStart:v,setElementEvent:x}=st(d,h,p,void 0,"advanced",o,a),C=W(((e,t)=>{const a=r(l.layoutId).layoutState.elements.find((t=>t.id===e));if(e&&a&&a.type===X.Textbox){const t=a.algorithm;(!t||t===G.Autosize)&&o(new s(e,G.Traditional))}n&&n(e,t),c(new He({selectedElement:e}))}),[o,r,l.layoutId,c]);return q(ut,{color:e,editorRef:d,interactionElementRef:h,zoomableElementRef:p,guidelines:u,visibleLayoutId:l.layoutId,xTranslation:0,yTranslation:0,borderRadius:t,handleContextMenu:i,handleKeyDown:m,handleKeyUp:f,handlePointerMove:g,handlePointerPressedBackground:w,handlePointerReleased:y,handleScroll:S,onSequenceStart:v,setElementEvent:x,onElementSelected:C})};const ft=new class{cache=new Map;materialCache=new Map;constructor(){this.server=Te}async getLocalOrFromServer(e){if(this.cache.has(e))return this.cache.get(e);const t=(async()=>(await Te.execute("getAssetByKeyV2",{assetKey:e.replace(/\//g,"_")})).body)();return this.cache.set(e,t),t}async getMaterialLocalOrFromServer(e){if(this.materialCache.has(e))return this.materialCache.get(e);const t=(async()=>(await Te.execute("getMaterialV2",{id:e})).body)();return this.materialCache.set(e,t),t}async uploadAssetWithProgress(e,t,a,i,n,o){const s=await this.dispatchCreateAssetRequest(e,t,n,o);var r=new XMLHttpRequest;return r.open("PUT",s.assetResponse.uploadUrl,!0),r.setRequestHeader("Content-Type",s.mimeType),r.setRequestHeader("Cache-Control","public,max-age=31536000,immutable"),r.upload.onprogress=e=>{e.lengthComputable&&a(100*e.loaded/e.total)},r.onload=()=>{const e=s.assetResponse.asset;i(e)},r.onerror=()=>{console.warn("Asset upload failed")},r.send(e.blob),s.assetResponse.asset}loadImageAsFileInfo=async e=>{const t=await e.arrayBuffer(),a=await se(t);return{name:e.name.substring(e.name.lastIndexOf("/")+1),blob:((e,t)=>{let a=atob(e.split(",")[1]),i=[];for(let e=0;e<a.length;e++)i.push(a.charCodeAt(e));return new Blob([new Uint8Array(i)],{type:t})})(a.dataUrl,e.type)}};async dispatchCreateAssetRequest(e,t,a,i){const n=e.blob.type?e.blob.type:this.guessMIME(e.name);return{assetResponse:(await this.server.execute("createAsset",{assetDetails:{name:e.name,type:t,mimeType:n,storageOwnerId:i,userAnonymous:!0}},a)).body,mimeType:n}}guessMIME(e){const t=e.split(".").pop();switch(t){case"glb":return"model/gltf-binary";case"ttf":return"font/ttf";case"mkv":return"video/x-matroska";default:throw new Error("Unexpected mimetype: "+t)}}};class gt{get(e){return localStorage.getItem(e)||void 0}set(e,t){localStorage.setItem(e,t)}remove(e){localStorage.removeItem(e)}getMap(e){const t=this.get(e);if(t)return new Map(JSON.parse(t))}setMap(e,t){const a=JSON.stringify([...t.entries()]);this.set(e,a)}}class wt{storage=new Map;get(e){return this.storage.get(e)||void 0}set(e,t){this.storage.set(e,t)}remove(e){this.storage.delete(e)}getMap(e){const t=this.get(e);if(t)return new Map(JSON.parse(t))}setMap(e,t){const a=JSON.stringify([...t.entries()]);this.set(e,a)}}const yt=(()=>{try{return localStorage?new gt:new wt}catch{return console.warn("Local storage was unavilable due to browser security settings. Using in-memory storage instead."),new wt}})(),St=O`
2
+ mutation CreateTransaction($integrationProductId: String!, $bulk: Boolean) {
3
+ transactionCreate(integrationProductId: $integrationProductId, bulk: $bulk) {
4
+ id
5
+ bulk
6
+ product {
7
+ id
8
+ }
9
+ transactionOwnerId
10
+ workflowId
11
+ customLogoLink
12
+ workflowFooterLogoLink
13
+ restApiIntegrationLink
14
+ bulkSourceUrl
15
+ }
16
+ }
17
+ `,vt=O`
18
+ mutation ClaimTransaction($id: String!) {
19
+ transactionClaim(id: $id) {
20
+ id
21
+ bulk
22
+ variationsCount
23
+ transactionOwnerId
24
+ workflowId
25
+ customLogoLink
26
+ workflowFooterLogoLink
27
+ restApiIntegrationLink
28
+ bulkSourceUrl
29
+ workflowState
30
+ workflowViewerLink
31
+ product {
32
+ id
33
+ }
34
+ }
35
+ }
36
+ `,xt=O`
37
+ query ReadTransaction($id: String!) {
38
+ transactions(ids: [$id]) {
39
+ id
40
+ bulk
41
+ variationsCount
42
+ workflowId
43
+ customLogoLink
44
+ workflowFooterLogoLink
45
+ restApiIntegrationLink
46
+ workflowState
47
+ workflowViewerLink
48
+ lineItem {
49
+ id
50
+ }
51
+ product {
52
+ id
53
+ }
54
+ bulkSourceUrl
55
+ }
56
+ }
57
+ `,Ct=O`
58
+ mutation UpdateTransactionWorkflowState($id: String!, $workflowState: String!) {
59
+ transactionUpdate(id: $id, workflowState: $workflowState) {
60
+ id
61
+ }
62
+ }
63
+ `,bt=O`
64
+ mutation UpdateTransactionWorkflowId($id: String!, $workflowId: String!) {
65
+ transactionUpdate(id: $id, workflowId: $workflowId) {
66
+ id
67
+ }
68
+ }
69
+ `,kt=O`
70
+ mutation UpdateVariationRecords($transactionId: String!, $updates: [VariationRecordUpdateInput]!) {
71
+ variationRecordsUpdate(transactionId: $transactionId, updates: $updates) {
72
+ recordNumber
73
+ }
74
+ }
75
+ `,It=O`
76
+ query ReadTransactionForDesignCreation($id: String!) {
77
+ transactions(ids: [$id]) {
78
+ id
79
+ bulk
80
+ product {
81
+ basePrice
82
+ }
83
+ priceModifierTotal
84
+ variationsCount
85
+ externalDesignProductId
86
+ externalDesignProductVariantId
87
+ workflowViewerLink
88
+ }
89
+ }
90
+ `,Et=O`
91
+ query ReadWorkflowState($id: String!) {
92
+ transactions(ids: [$id]) {
93
+ id
94
+ workflowState
95
+ }
96
+ }
97
+ `;const Nt=new class{async init(e,t,a){const i=Le.getLocalOrUndefined(e.optionId);if(!i)return null;if(a)await this.reload(e,t,a);else{const a=i.data.variants,n=Le.getDefaultVariant(i.data);if(!e.data.allowMultipleSelections&&n){const n=a.find((e=>e.id===i.data.defaultVariant));return this.selectVariantLambda(e,n?.id||"",t)}}return null}async reload(e,t,a){const i=t.getSerializedStep(e.stepName,a.serializableWorkflow.steps),n=Le.getLocalOrUndefined(e.optionId)?.data;if(i?.selectedVariants){const a=i.selectedVariants[0].id;if(n&&a){const i=n.variants.find((e=>e.id===a));i&&await t.setSelectionsAndElements(e.stepName,[i],[])}}}selectVariant(e,t,a){this.selectVariantLambda(e,t,a).then((e=>e&&e()))}async selectVariantLambda(e,t,a){const i=Le.getLocalOrUndefined(e.optionId);if(!i)return null;const n=i.data.variants,o=n.length>1?n.find((e=>e.id===t)):n[0];if(!o)throw new Error("Failed to find selected variant in step variants, this should never happen!");return async()=>{await a.setSelectionsAndElements(e.stepName,[o],[]),a.setMandatoryFulfilled(e.stepName,!0)}}};class Rt{constructor(e,t){this.manager=e,this.stepConfiguration=t}getCurrentVariant(){return this.manager.getWorkflowSelections()[this.stepConfiguration.stepName].selections}async getAvailableVariants(){const e=this.stepConfiguration.optionId;return(await Le.getLocalOrFromServer(Te,e)).data.variants}selectVariant(e){if(this.stepConfiguration.type!==ce.Question)throw new Error(`Step type ${this.stepConfiguration.type} not yet supported in Core SDK`);Nt.selectVariant(this.stepConfiguration,e.id,this.manager)}}const Ot=e=>{const t=[];for(const a of e.steps)switch(a.type){case ce.DigitalContent:a.data.varyUpload&&t.push({stepName:a.stepName,stepType:a.type,aspectType:de.Upload});break;case ce.Frame:const e=a.data;e.varySelection&&a.optionId&&t.push({stepName:a.stepName,stepType:a.type,aspectType:de.Selection}),e.varyUpload&&t.push({stepName:a.stepName,stepType:a.type,aspectType:de.Upload});break;case ce.Illustration:const i=a.data;i.varySelection&&a.optionId&&t.push({stepName:a.stepName,stepType:a.type,aspectType:de.Selection}),i.varyColors&&i.colourPickerEnabled&&t.push({stepName:a.stepName,stepType:a.type,aspectType:de.Colors});break;case ce.Material:a.data.varySelection&&t.push({stepName:a.stepName,stepType:a.type,aspectType:de.Selection});break;case ce.Model:a.data.varySelection&&t.push({stepName:a.stepName,stepType:a.type,aspectType:de.Selection});break;case ce.Picture:a.data.varySelection&&t.push({stepName:a.stepName,stepType:a.type,aspectType:de.Selection});break;case ce.Question:a.data.varySelections&&t.push({stepName:a.stepName,stepType:a.type,aspectType:de.Selections});break;case ce.Shape:a.data.varySelection&&t.push({stepName:a.stepName,stepType:a.type,aspectType:de.Selection});break;case ce.Text:const n=a.data;n.varyText&&t.push({stepName:a.stepName,stepType:a.type,aspectType:de.Text}),n.varySelection&&a.optionId&&t.push({stepName:a.stepName,stepType:a.type,aspectType:de.Selection}),n.varyColor&&n.colourPickerEnabled&&t.push({stepName:a.stepName,stepType:a.type,aspectType:de.Color})}return t},Mt=[ce.SilentIllustration,"ProductOverlay"],Lt=(e,t)=>{const a=[];e.introduction&&a.push({name:"Introduction",title:e.name,renderableSteps:[{type:ce.Introduction,stepName:"Introduction",stepTitle:e.name,helpText:e.introduction,data:{},conditions:[]}],silentSteps:[]});for(const i of e.steps){if(t.bulkScene){let e=!1;switch(i.type){case ce.DigitalContent:i.data.varyUpload&&(e=!0);break;case ce.Frame:const t=i.data;!t.varyUpload||!t.varySelection&&i.optionId||(e=!0);break;case ce.Illustration:const a=i.data;!a.varySelection&&i.optionId&&1!==Le.getLocalOrUndefined(i.optionId)?.data.variants.length||!a.varyColors&&a.colourPickerEnabled||(e=!0);break;case ce.Material:i.data.varySelection&&(e=!0);break;case ce.Model:i.data.varySelection&&(e=!0);break;case ce.Picture:i.data.varySelection&&(e=!0);break;case ce.Question:i.data.varySelections&&(e=!0);break;case ce.Shape:i.data.varySelection&&(e=!0);break;case ce.Text:const n=i.data;!n.varySelection&&i.optionId&&1!==Le.getLocalOrUndefined(i.optionId)?.data.variants.length||!n.varyColor&&n.colourPickerEnabled&&n.colourOptionId||!n.varyText||(e=!0)}if(e)continue}const n=Dt(i.stepName,e.stepGroups);if(n){const e=a.find((e=>e.name===n.name));e?Mt.includes(i.type)?e.silentSteps.push(i):e.renderableSteps.push(i):a.push({name:n.name,title:n.name,renderableSteps:Mt.includes(i.type)?[]:[i],silentSteps:Mt.includes(i.type)?[i]:[]})}else a.push({name:i.stepName,title:i.stepTitle,renderableSteps:Mt.includes(i.type)?[]:[i],silentSteps:Mt.includes(i.type)?[i]:[]})}return t.bulkScene&&a.push({name:"Bulk",title:t.bulkSceneTitle,renderableSteps:[{type:ce.Bulk,stepName:"Bulk",stepTitle:t.bulkSceneTitle,helpText:"help:/billing/bulk-ordering.md",data:{aspects:Ot(e)},conditions:[]}],silentSteps:[]}),t.finishScene&&a.push({name:"Finish",title:t.finishSceneTitle,renderableSteps:[{type:ce.Finish,stepName:"Finish",stepTitle:t.finishSceneTitle,helpText:"",data:{modelAnimation:e.finalizeStepConfig?e.finalizeStepConfig.modelAnimation:void 0,lookAtAnimation:e.finalizeStepConfig?e.finalizeStepConfig.lookAtAnimation:void 0},conditions:[]}],silentSteps:[]}),a},Dt=(e,t)=>t.find((t=>t.stepNames.includes(e))),Pt=(e,t)=>(e.conditions||[]).every((e=>{const a=t[e.targetStepName];if(a&&a.selectedVariants){const t=a.selectedVariants;return e.requiredVariantSelections.some((e=>void 0!==t.find((t=>t.id===e))))}return!1})),At=(e,t)=>e.map((e=>((e,t)=>{const a={name:e.name,title:e.title,renderableSteps:e.renderableSteps.filter((e=>Pt(e,t))),silentSteps:e.silentSteps.filter((e=>Pt(e,t)))};return 0===a.silentSteps.length&&0===a.renderableSteps.length?null:a})(e,t))).filter((e=>null!==e)),zt=(e,t)=>At(e,t).filter((e=>e.renderableSteps.filter(((e,t,a)=>e.type===ce.Model||e.type===ce.Material||e.type===ce.Picture||e.type===ce.Shape?Le.getLocalOrUndefined(e.optionId)?.data.variants&&Le.getLocalOrUndefined(e.optionId).data.variants.length>1?e:null:e)).length>0)),Tt=(e,t)=>At(e,t).filter((e=>e.renderableSteps.filter((e=>e)).length>0));class Vt{timestamp=Date.now()}class Ut{queue=[];activePromise=void 0;queueMaxSize=void 0;constructor(e){this.queueMaxSize=e}enqueue(e){if(this.queue.push(e),void 0!==this.queueMaxSize&&this.queue.length>this.queueMaxSize){const e=this.queue.length-1;for(let t=0;t<e;++t)this.queue.shift()}return this.process()}hasActivePromise(){return!!this.activePromise}getRemainingQueueSize(){return this.queue.length}async finalize(){return this.activePromise?this.activePromise:Promise.resolve()}async process(){return this.activePromise||(this.activePromise=this.dequeue(),this.activePromise.then((()=>{this.activePromise=void 0}))),this.activePromise}async dequeue(){const e=this.queue.shift();if(e)try{await e.execute(),await this.dequeue()}catch(e){await this.dequeue()}}}function Ft(e,t,a,i){const n=a.width*e.zoom,o=a.height*e.zoom;if(i){const i=e,n=Math.max(t.width/a.width,t.height/a.height);i.zoom=Math.max(n,e.zoom);const o=a.width*i.zoom,s=a.height*i.zoom;return i.x=Wt(e.x,t.width-o,0),i.y=Wt(e.y,t.height-s,0),i}const s=e;return s.x=Wt(s.x,-n,t.width),s.y=Wt(s.y,-o,t.height),s}function Wt(e,t,a){return Math.min(Math.max(e,t),a)}class qt{minZoomScale=.03;maxZoomScale=20;constructor(e){this._debouncedUpdateFrameOffsets=ue(this.updateFrameOffsets,200),this.targetElements=[],this.onFrameDataChangeListeners=[],this.onZoomChangeListeners=[],this.forceImageCover=e}connectWorkflowManager(e,t){t&&e.addStepSpecificStorageCallback((async e=>{if(e){const t=e;if(t.currentFrameSource){const e=await me(t.currentFrameSource);H(e,this.frameData)||(this.frameData=e,this.onFrameDataChangeListeners.forEach((e=>e(this.frameData))),this.frameData&&this.imageData&&(this.offsets=fe(this.imageData,this.frameData),this._debouncedUpdateFrameOffsets(this.offsets,this.imageData,this.frameData,this.targetElements),this.recalculateZoomLimits(this.imageData,this.frameData)))}}}),t),this.workflowManager=e,this.stepName=t}setTargetElements(e){this.targetElements=e}getFrameData(){return this.frameData}async setFrameData(e){const t=ge.get(e);this.frameData=t}getImageData(){return this.imageData}getOffsets(){return this.offsets}setOffsets(e){this.offsets=e}setZoom(e,t,a,i){if(this.imageData&&this.offsets&&this.frameData){const n=(t-this.offsets.x)/this.offsets.zoom,o=(a-this.offsets.y)/this.offsets.zoom,s={x:t-n*e,y:a-o*e,zoom:this.imageData.width*e/this.imageData.width};this.updateOffsets(Ft(s,this.frameData,this.imageData,this.forceImageCover),i),this.onZoomChangeListeners.forEach((t=>t(e)))}}setPatternData(e){(e&&this.frameData||e&&this.frameData&&!this.imageData)&&(this.offsets=fe(e,this.frameData),this._debouncedUpdateFrameOffsets(this.offsets,e,this.frameData,this.targetElements),this.updateOffsets(Ft(this.offsets,this.frameData,e,this.forceImageCover))),this.imageData=e,this.imageData&&this.frameData&&this.recalculateZoomLimits(this.imageData,this.frameData)}updateOffsets(e,t){const a=this.imageData;a&&this.frameData&&(this.offsets&&e.x===this.offsets.x&&e.y===this.offsets.y&&e.zoom===this.offsets.zoom?t&&t():(this.offsets=Ft(e,this.frameData,a,this.forceImageCover),this._debouncedUpdateFrameOffsets(e,a,this.frameData,this.targetElements,t)))}onFrameDataChanged(e){e(this.frameData),this.onFrameDataChangeListeners.push(e)}onZoom(e){this.onZoomChangeListeners.push(e)}updateFrameOffsets(e,t,a,i,n){if(!a)throw new Error("Frame data not set. This is a bug");if(!this.workflowManager)throw new Error("No workflow manager set, cannot update offsets.");const o=this.workflowManager.getCommandDispatcher();i.forEach((a=>{o(new m(a,t,e))})),this.stepName&&this.workflowManager.updateStorage(this.stepName,{frameOffsets:e}),n&&n()}recalculateZoomLimits(e,t){const a=Math.max(t.width/e.width,t.height/e.height);this.forceImageCover?(this.minZoomScale=a,this.maxZoomScale=2.5*a):(this.minZoomScale=a/10,this.maxZoomScale=2.5*a)}}const $t=async e=>{const t=(new DOMParser).parseFromString(e,"image/svg+xml").firstElementChild;if(!t)throw new Error("Failed to read SVG");const a=(new XMLSerializer).serializeToString(t),i=document.createElement("canvas"),n=i.getContext("2d"),o=await le.from(n,a,{anonymousCrossOrigin:!0,ignoreDimensions:!1}),s=t.getAttribute("width"),r=t.getAttribute("height");if(r&&s){const e=parseFloat(r),t=parseFloat(s)/e;t>1?o.resize(2048,2048/t):o.resize(2048*t,2048)}else o.resize(2048,2048);return await o.render(),await(async e=>new Promise(((t,a)=>{try{e.toBlob((e=>{if(e){const a=URL.createObjectURL(e);t(a)}else a("Failed to generate canvas object URL")}))}catch(e){a(e)}})))(i)},jt=new class{async getIllustrationBody(e){return new Promise((t=>{fetch(e).then((e=>{t(e.text())})).catch((e=>console.error(e)))}))}getCreateElementCommand(e,t,i,n){return new a({stepRegion:t,stepName:n.stepName,colors:n.svg.colors,id:e,src:n.src,svg:n.svg.svg,cachedObjectURL:n.objectURL,type:X.Illustration,y:t.top,x:t.left,rotation:t.rotation,width:t.width,height:t.height,layerIndex:t.layerIndex,immutable:t.immutable},i)}async init(e,t,a){const i=Le.getLocalOrUndefined(e.optionId);if(!i)return null;if(a)return this.reload(e,t,a);{t.updateMetadata(e.stepName,{colors:[]});const a=Le.getDefaultVariant(i.data);if(a)return this.selectVariantCommand(e,a,[],(()=>{}),t)}return null}async reload(e,t,a){const i=t.getSerializedStep(e.stepName,a.serializableWorkflow.steps),n=Object.values(a.layouts).map((e=>e.elements)).flat().filter((t=>t.stepName===e.stepName)),o=Le.getLocalOrUndefined(e.optionId)?.data;if(i?.selectedVariants){const a=i.selectedVariants[0].id;if(!o||!a)throw new Error("Required illustration variant no longer available");{const s=o.variants.find((e=>e.id===a));if(s){const a=n.map((e=>({id:e.id,region:e.stepRegion})));await t.setSelectionsAndElements(e.stepName,[s],a),t.updateMetadata(e.stepName,{colors:i.storage?.colors}),t.setMandatoryFulfilled(e.stepName,!0)}}}return null}availableColors(e){return Le.getLocalOrUndefined(e.data.colourOptionId)?Le.getLocalOrUndefined(e.data.colourOptionId).data.variants.map((e=>({fill:e.color,stroke:e.color,variant:e}))):(e.data.colours||[]).map((e=>({fill:e,stroke:e})))}async changeColorsCommand(e,t,a,i,n){const o={};for(const[e,t]of n.entries())o[e]={browserValue:t,spotColor:o[e]?.spotColor};const s=xe(e,t,a,o),l=await $t(s),c=[];for(const e of i){for(const[t,a]of n.entries())c.push(new f(e,t,a));c.push(new g(e,s,l))}return new r(c)}async changeColors(e,t,a,i,n){if(0===t.length)return;const o=be(t[0].id,i().map((e=>e.layoutState))),s={...o.colors},r={};Object.entries(s).forEach((([e,t])=>{const a={browserValue:t.browserValue},i=t.spotColor;i&&(a.spotColor={profileName:i.profileName,namedColor:i.namedColor}),r[e]=a}));for(const[e,t]of n.entries())s[e]={browserValue:t,spotColor:s[e]?.spotColor},r[e]={browserValue:t};a.updateStorage(e.stepName,{colors:r});let l=Array.from(Object.values(s)).map((e=>e.browserValue));Le.getLocalOrUndefined(e.data.colourOptionId)&&Le.getLocalOrUndefined(e.data.colourOptionId).data.variants.forEach((e=>{l=l.map((t=>t.toLowerCase()===e.color?.toLowerCase()?e.name:t))})),a.updateMetadata(e.stepName,{colors:l});const c=new Map;if(Object.entries(s).forEach((([e,t])=>{c.set(e,t.browserValue)})),!o.svg)throw new Error("Colors changed before SVG loaded. This should never happen!");const d=await this.changeColorsCommand(o.svg,o.width,o.height,t.map((e=>e.id)),c);a.getCommandDispatcher()(d)}selectVariant(e,t,a,i,n){this.selectVariantCommand(e,t,a,i,n).then((e=>{n.getCommandDispatcher()(e.command),e.followup()}))}selectVariantCommand(e,t,a,i,n){if(!e.data||!e.data.regions)throw new Error("Missing config data.");i(!0);const o=a.map((e=>new l(e.id)));return n.setMandatoryFulfilled(e.stepName,!1),new Promise((async a=>{if(!t.assetKey)throw new Error("No Asset for Variant");const s=(await ft.getLocalOrFromServer(t.assetKey)).links.find((e=>"cdn"===e.rel));if(!s)throw new Error("CDN Link not found on SVG Asset entity!");const l=await ve(await this.getIllustrationBody(s.href)),c=await $t(l.svg),d=e.data.regions.map((t=>{const a=n.getLayouts().find((e=>e.panelId===t.panelId));if(!a)throw new Error("Tried to create illustration but no layout.");const i=ot();return{regionElement:{id:i,region:t},command:this.getCreateElementCommand(i,t,a,{stepName:e.stepName,src:s.href,objectURL:c,svg:l})}})),h=[...d.map((e=>e.command)),...o];a({command:new r(h),followup:async()=>{await n.setSelectionsAndElements(e.stepName,[t],d.map((e=>e.regionElement))),n.setMandatoryFulfilled(e.stepName,!0),i(!1)}})}))}};class Bt{constructor(e,t,a){this.configuration=e,this.layouts=t,this.product=a||void 0}async trigger(){if(!this.configuration.data.regions)throw new Error("Missing regions.");if("SilentIllustration"===this.configuration.type){const e=this.configuration.data.regions.map(this.processRegion);return Promise.all(e)}return"ProductOverlay"===this.configuration.type?Promise.all(this.configuration.data.regions.map((e=>{if(!this.layouts.find((t=>e.panelId===t.panelId)))throw new Error("Can't find layout from region. This is a bug");return this.processRegion(e)}))):Promise.reject("Unknown silent step. This is a bug")}processRegion=async e=>{const t=this.layouts.find((t=>t.panelId===e.panelId));if(!t)throw new Error(`Can not find layout for region: ${e.panelId}`);let i="";if("ProductOverlay"===this.configuration.type){let e="";if(this.product?.overlayImageUrl&&(e=this.product.overlayImageUrl),i=e,!e)throw new Error("Couldn't find an asset for product overlay step")}const n=this.evaluateAssetType();if("image"===n){const i="SilentIllustration"===this.configuration.type?this.configuration.data.assetKey:this.product?.overlayImageUrl,o={id:ot(),src:i,type:n,y:e.top,x:e.left,width:e.width,height:e.height,layerIndex:e.layerIndex,immutable:e.immutable,productOverlay:"ProductOverlay"===this.configuration.type||void 0,rotation:e.rotation,excludeFromExport:this.configuration.data.excludeFromPrint,preserveAspectRatio:"none"};return{regionElement:{id:o.id,region:e},command:new a(o,t)}}{const o="SilentIllustration"===this.configuration.type?this.configuration.data.assetKey:i,s=async()=>new Promise((e=>{fetch(o).then((t=>{e(t.text())})).catch((e=>console.error(e)))})),r=await ve(await s()),l={id:ot(),cachedObjectURL:await $t(r.svg),src:o,svg:r.svg,colors:r.colors,type:n,y:e.top,x:e.left,width:e.width,height:e.height,layerIndex:e.layerIndex,rotation:e.rotation,immutable:e.immutable,productOverlay:"ProductOverlay"===this.configuration.type||void 0,excludeFromExport:this.configuration.data.excludeFromPrint};return{regionElement:{id:l.id,region:e},command:new a(l,t)}}};evaluateAssetType(){const e="ProductOverlay"===this.configuration.type&&this.product?.overlayImageUrl?this.product.overlayImageUrl.toLowerCase():this.configuration.data.assetKey?.toLowerCase().split("?")[0];return e?.endsWith(".jpeg")||e?.endsWith(".jpg")||e?.endsWith(".png")?X.Image:(e?.endsWith(".svg"),X.Illustration)}}const Kt=async e=>{const t=`${De.getServicesApiUrl()}/shortener`;try{const a=await fetch(t,{method:"POST",body:JSON.stringify({longUrl:e}),headers:{"Content-Type":"application/json"}});return(await a.json()).shortUrl}catch(e){throw console.error(e),new Error("Failed to shorten URL.")}};class Ht{async poll(){if(await this.predicate())return this.onSuccess(),void(this.pollingId>-1&&window.clearInterval(this.pollingId));this.attempts+=1,this.attempts<this.maxAttempts?this.pollingId=window.setTimeout(this.poll.bind(this),this.interval):this.onFailure()}constructor(e,t,a,i=3e3,n=10){this.onSuccess=t,this.onFailure=a,this.predicate=e,this.attempts=0,this.pollingId=-1,this.interval=i,this.maxAttempts=n,this.poll()}}const Xt=new class{async init(e,t,a){return a&&await this.reload(e,t,a),null}async reload(e,t,a){const i=t.getSerializedStep(e.stepName,a.serializableWorkflow.steps),n=Object.values(a.layouts).map((e=>e.elements)).flat().filter((t=>t.stepName===e.stepName)).map((e=>({id:e.id,region:e.stepRegion})));await t.setSelectionsAndElements(e.stepName,[],n);const o=i?.storage?.videoShortUrl,s=i?.storage?.videoUrl;t.updateStorage(e.stepName,{videoShortUrl:o,videoUrl:s})}async regenerateQRCode(e,t,a,i,n,o,s,r,c){if(!t&&""!==a&&""===i){const t=async()=>(await Te.execute("getAssetByKeyV2_private",{assetKey:a.replace(/\//g,"_")})).body.links.find((e=>"mpeg4"===e.rel)),c=await new Promise(((e,a)=>{new Ht((async()=>!!await t()),(async()=>{const a=await t();if(!a||!a.href)throw new Error("Poller succeeded but no mpeg link found");e(a)}),(()=>{a("Poller timed out with 40 attempts @ 3 second interval")}),3e3,40)}));e.forEach((e=>r(new l(e.id))));const d="http"===o.data.baseUrl.slice(0,4)?"":"https://",h=new URL(d+o.data.baseUrl);h.searchParams.append("video",btoa(JSON.stringify([c]))),h.pathname=h.pathname+("/"===h.pathname.slice(-1)?"":"/");const p=h.toString();if(p.length>=2e3)throw new Error("Cannot create QR code, URL too long.");const u=await Kt(p);if(s(u),!o.data||!o.data.regions)throw new Error("Missing config data.");const m=await this.regionElements(o),f=await this.command(u,m,n,o.stepName);f&&r(f.command),await n.setSelectionsAndElements(o.stepName,[],m),n.updateStorage(o.stepName,{videoShortUrl:u,videoUrl:i})}c(!1)}async regionElements(e){return e.data.regions.map((e=>({id:ot(),region:e})))}async command(e,t,i,n){const o=i.getLayouts(),s=`data:image/svg+xml;base64,${btoa(await Ie(e,{type:"svg"}))}`,l=t.map((e=>{const t=e.region,i=o.find((e=>e.panelId===t?.panelId));if(!i||!t)throw new Error(`Can not find layout for region: ${t?.panelId}`);return new a({stepRegion:t,stepName:n,id:e.id,src:s,type:X.Image,y:t.top,x:t.left,width:t.width,height:t.height,rotation:0},i)}));return{command:new r(l),followup:async()=>{}}}};const Gt=new class{async init(e,t,a){const i=Le.getLocalOrUndefined(e.optionId);if(a)await this.reload(e,t,a);else{if(t.setMandatoryFulfilled(e.stepName,!1),t.markStepsAsInitialised([e.stepName]),!i||0===i.data.variants.length)return this.selectVariantCommand(e,void 0,[],t,void 0,e.data.placeholderImageKey);{const a=Le.getDefaultVariant(i.data);if(a)return this.selectVariantCommand(e,a,[],t,void 0,e.data.placeholderImageKey)}}return null}async reload(e,t,a){const i=t.getSerializedStep(e.stepName,a.serializableWorkflow.steps),n=Object.values(a.layouts).map((e=>e.elements)).flat().filter((t=>t.stepName===e.stepName)).map((e=>({id:e.id,region:e.stepRegion}))),o=Le.getLocalOrUndefined(e.optionId)?.data;if(!o||0===o.variants.length){const a=we(e.data.regions[0]);t.updateStorage(e.stepName,{currentFrameSource:a})}if(i){if(i.selectedVariants&&i.selectedVariants.length>0){const a=i.selectedVariants[0].id;if(o&&a){const i=o.variants.find((e=>e.id===a));if(i){await t.setSelectionsAndElements(e.stepName,[i],n);const a=await this.frameSourceSvg(i,e);t.updateStorage(e.stepName,{currentFrameSource:a})}}}else await t.setSelectionsAndElements(e.stepName,[],n);const a=i.storage?.framePatternSrc,s=i.storage?.frameOffsets;if(t.updateMetadata(e.stepName,{frameOffsets:s,framePatternSrc:a}),a){const i=t.getStepSpecificServices(e.stepName)?.frameService;await this.loadPatternFromString(a,i),t.updateMetadata(e.stepName,{image:a}),t.updateStorage(e.stepName,{framePatternSrc:a})}if(s?.zoom){const a=t.getStepSpecificServices(e.stepName)?.frameService;a.updateOffsets(s)}t.setMandatoryFulfilled(e.stepName,!0)}}selectImage(e,t,a){a.setEditedStatus(e.stepName,!0);t.links.find((e=>"cdn"===e.rel)).href.endsWith("pdf")?a.addPoller(new Ht((async()=>{const e=(await Te.execute("getAssetByKeyV2_private",{assetKey:t.data.key.replace(/\//g,"_")})).body.links.find((e=>"svg"===e.rel));if(!e)return!1;return 200===(await fetch(e.href)).status}),(()=>{Te.execute("getAssetByKeyV2_private",{assetKey:t.data.key.replace(/\//g,"_")}).then((t=>{const i=t.body;this.loadPatternFromAsset(i,e,a)}))}),(()=>{throw new Error("Failed to resolve transcoded PDF")}))):this.loadPatternFromAsset(t,e,a)}selectVariant(e,t,a,i,n){this.selectVariantCommand(e,t,a,i,n).then((e=>{i.getCommandDispatcher()(e.command),e.followup()}))}getCreateElementCommand(e,t,i,n){return new a({id:e,type:X.Frame,x:t.left,y:t.top,width:t.width,height:t.height,layerIndex:t.layerIndex,rotation:t.rotation,scaleX:t.width/n.frameData.width,scaleY:t.height/n.frameData.height,path:n.frameData.path,stepRegion:t,stepName:n.stepName,disablePlaceholder:n.disablePlaceholder,focalBlur:n.focalBlur,focalBlurStrength:n.focalBlurStrength,focalBlurRadius:n.focalBlurRadius,pattern:n.pattern,immutable:t.immutable},i)}async loadPatternFromString(e,t){if(e.endsWith("svg")){const a=await ye(e),i=a.width,n=a.height,o={src:e,width:i,height:n,aspect:i/n};Se.set(e,o),t.setPatternData(o)}else{const a=await fetch(e),i=await a.arrayBuffer(),n=await se(i),o={src:e,width:n.width,height:n.height,aspect:n.width/n.height};Se.set(e,o),t.setPatternData(o)}}async selectVariantCommand(e,t,a,i,n,o){const s=i.getStepSpecificServices(e.stepName)?.frameService,c=await this.frameSourceSvg(t,e),d=await me(c),h=s.getImageData(),p=a.map((e=>new l(e.id))),u=h?fe(h,d):void 0,m=h?{id:ot(),src:h.src,x:u?.x||0,y:u?.y||0,width:h.width,height:h.height,scaleX:u?.zoom||1,scaleY:u?.zoom||1,rotation:0}:void 0;n&&n(!0);const f=e.data.regions.map((t=>{const a=ot(),n=i.getLayouts().find((e=>e.panelId===t.panelId));if(!n)throw new Error(`Can not find layout for region: ${t.panelId}`);return{command:this.getCreateElementCommand(a,t,n,{frameData:d,pattern:m,disablePlaceholder:e.data.disablePlaceholder,focalBlur:e.data.focalBlur,focalBlurStrength:e.data.focalBlurStrength,focalBlurRadius:e.data.focalBlurRadius,stepName:e.stepName}),regionEl:{id:a,region:t}}})),g=f.map((e=>e.command));return{command:new r([...g,...p]),followup:async()=>{if(n&&n(!1),await i.setSelectionsAndElements(e.stepName,t?[t]:[],[...f.map((e=>e.regionEl))]),i.updateStorage(e.stepName,{currentFrameSource:c}),o){const t=i.getStepSpecificServices(e.stepName)?.frameService;await this.loadPatternFromString(o,t)}}}}frameSourceSvg=async(e,t)=>{if(!e)return we(t.data.regions[0]);if(!e.assetKey)throw new Error("No Asset for Variant");const a=(await ft.getLocalOrFromServer(e.assetKey)).links.find((e=>"cdn"===e.rel));if(a)return Ee(a.href);throw new Error("No URL for frame!")};patternSource(e){const t=e.links.find((e=>"svg"===e.rel));if(t)return t.href;const a=e.links.find((e=>"cdn"===e.rel));if(a)return a.href;throw new Error("Frame pattern source file could not be find, neither svg or cdn assets existed on requested variant!")}async loadPatternFromAsset(e,t,a){const i=this.patternSource(e),n=ot();a.markUpdatePending(n);const o=a.getStepSpecificServices(t.stepName)?.frameService;await this.loadPatternFromString(i,o),a.updateMetadata(t.stepName,{image:i}),a.updateStorage(t.stepName,{framePatternSrc:i}),a.markUpdateCompleted(n)}};const Yt=new class{async init(e,t,a){const i=Le.getLocalOrUndefined(e.optionId);if(!i)return null;if(a)await this.reload(e,t,a);else{const a=Le.getDefaultVariant(i.data);if(a)return this.selectVariantLambda(e,a,t,(()=>{}))}return null}async reload(e,t,a){const i=t.getSerializedStep(e.stepName,a.serializableWorkflow.steps),n=Object.values(a.layouts).map((e=>e.elements)).flat().filter((t=>t.stepName===e.stepName)),o=Le.getLocalOrUndefined(e.optionId)?.data;if(i?.selectedVariants){const a=i.selectedVariants[0].id;if(o&&a){const i=o.variants.find((e=>e.id===a));if(i){const a=await ft.getMaterialLocalOrFromServer(i.materialId),o=n.map((e=>({id:e.id,region:e.stepRegion})));await t.setSelectionsAndElements(e.stepName,[i],o);const s=t.getPreviewService();if(s){const i=e.data.targetMaterials.map((t=>s.applyMaterialVariant(t,e.optionId,a.data)));Promise.all(i).then((()=>t.setMandatoryFulfilled(e.stepName,!0)))}}}}}selectVariant(e,t,a,i){this.selectVariantLambda(e,t,a,i).then((e=>e&&e()))}async selectVariantLambda(e,t,a,i){const n=a.getPreviewService();if(!n)return null;i(!0);const o=await ft.getMaterialLocalOrFromServer(t.materialId);if(!o)throw i(!1),new Error("No material set on variant");return async()=>{await a.setSelectionsAndElements(e.stepName,[t],[]);const s=e.data.targetMaterials.map((t=>n.applyMaterialVariant(t,e.optionId,o.data)));Promise.all(s).then((()=>a.setMandatoryFulfilled(e.stepName,!0))).finally((()=>i(!1)))}}};const Zt=new class{async init(e,t,a){const i=Le.getLocalOrUndefined(e.optionId);if(!i)return null;if(a)await this.reload(e,t,a);else{const a=Le.getDefaultVariant(i.data);if(a)return this.selectVariantLambda(e,a,t,(()=>{}))}return null}async reload(e,t,a){const i=t.getSerializedStep(e.stepName,a.serializableWorkflow.steps),n=Object.values(a.layouts).map((e=>e.elements)).flat().filter((t=>t.stepName===e.stepName)),o=Le.getLocalOrUndefined(e.optionId)?.data;if(i?.selectedVariants){const a=i.selectedVariants[0].id;if(o&&a){const i=o.variants.find((e=>e.id===a));if(i){const a=n.map((e=>({id:e.id,region:e.stepRegion})));await t.setSelectionsAndElements(e.stepName,[i],a);const o=t.getPreviewService();if(o){if(!i.assetKey)throw new Error("No Asset for Variant");const a=(await ft.getLocalOrFromServer(i.assetKey)).links.find((e=>"cdn"===e.rel));o.applyModelVariant(e.optionId,{model:a.href,contextService:t.getLayoutPreviewService()},e.data.replaceProductModel||!1).then((()=>{t.setMandatoryFulfilled(e.stepName,!0)}))}}}}}selectVariant(e,t,a,i){this.selectVariantLambda(e,t,a,i).then((e=>e&&e()))}async selectVariantLambda(e,t,a,i){const n=a.getPreviewService();if(!n)return null;if(i(!0),!t.assetKey)throw new Error("No Asset for Variant");const o=(await ft.getLocalOrFromServer(t.assetKey)).links.find((e=>"cdn"===e.rel));return async()=>{if(await a.setSelectionsAndElements(e.stepName,[t],[]),!o)throw new Error("Asset not found:"+t.assetKey);n.applyModelVariant(e.optionId,{model:o.href,contextService:a.getLayoutPreviewService()},e.data.replaceProductModel||!1).then((()=>{a.setMandatoryFulfilled(e.stepName,!0)})).finally((()=>i(!1)))}}};const _t=new class{async init(e,t,a){return a?(await this.reload(e,t,a),null):(t.updateMetadata(e.stepName,{text:""}),this.changeTextCommand(e,"",t,"",(()=>{})))}async reload(e,t,a){const i=t.getSerializedStep(e.stepName,a.serializableWorkflow.steps),n=Object.values(a.layouts).map((e=>e.elements)).flat().filter((t=>t.stepName===e.stepName)).map((e=>({id:e.id,region:e.stepRegion})));await t.setSelectionsAndElements(e.stepName,[],n),t.updateStorage(e.stepName,{text:i?.storage?.text}),t.setMandatoryFulfilled(e.stepName,""!==i?.storage?.text)}changeText(e,t,a,i,n){this.changeTextCommand(e,t,a,i,n).then((e=>{e&&(a.getCommandDispatcher()(e.command),e.followup())}))}async changeTextCommand(e,t,i,n,o){const s=i.getRegionElements(e.stepName),c=i.getStepSpecificServices(e.stepName)?.module;if(!c)return console.error("Missing module."),null;const d=i.getProfanities();if(!this.validateInput(e,t,d,o))return i.setMandatoryFulfilled(e.stepName,!1),console.error(n),null;if(i.setMandatoryFulfilled(e.stepName,""!==t),!e.data||!e.data.regions||e.data.regions.length<=0)return console.error("Missing configuration."),null;i.updateStorage(e.stepName,{text:t});const h=(t,n,o)=>{const s=o||ot(),c=i.getLayouts().find((e=>e.panelId===n.panelId));if(!c)return console.error(`Can not find layout for region: ${n.panelId}`),null;const d=[];return o&&d.push(new l(s)),d.push(new a({stepRegion:n,stepName:e.stepName,colors:{},id:s,svg:t,type:X.Illustration,y:n.top,x:n.left,rotation:n.rotation,width:n.width,height:n.height,layerIndex:n.layerIndex,immutable:n.immutable},c)),{id:s,region:n,command:new r(d)}},p=c.svgPrint(t);if(s.length>0){const e=s.map((e=>e.region?h(p,e.region,e.id):null)).filter((e=>!!e)).filter((e=>!!e)).map((e=>e&&e.command));return{command:new r(e),followup:async()=>{}}}{const t=e.data.regions.map((e=>h(p,e))),a=t.filter((e=>!!e)).map((e=>e&&e.command));return{command:new r(a),followup:async()=>{const a=t.filter((e=>e)).map((e=>e&&{id:e.id,region:e.region}));await i.setSelectionsAndElements(e.stepName,[],a)}}}}validateInput(e,t,a,i){if(e.data&&e.data.maxLength){const a=e.data.maxLength;if(t.length>a)return i("Too many characters."),!1}if(!/^$|^[a-zA-Z0-9 ]+$/.test(t))return i("Unsupported characters."),!1;const n=t.toLowerCase();for(const e in a)if(n===a[e].toLowerCase().trim()&&""!==n)return i("Blocked profanity."),!1;return i(""),!0}};const Jt=e=>new Promise((t=>{fetch(e).then((e=>e.text())).then((e=>{t(e)})).catch((e=>console.error(e)))})),Qt=e=>{const t=e.match(/<svg.*?<\/svg>/s)||[],a=t?.length>0?t[0]:"",i=(new DOMParser).parseFromString(a,"image/svg+xml").firstElementChild;if(!i)throw new Error("Failed to read SVG.");Ce(i,!0);return(new XMLSerializer).serializeToString(i)},ea=new class{async init(e,t,a){const i=Le.getLocalOrUndefined(e.optionId);if(!i)return console.error(`Patchwork step ${e.stepName} is missing option.`),null;if(a)await this.reload(e,t,a);else{const a=Le.getDefaultVariant(i.data);if(a&&a.assetKey)return this.selectVariantCommand(e,a,[],t,(()=>{}))}return null}async reload(e,t,a){const i=t.getSerializedStep(e.stepName,a.serializableWorkflow.steps),n=Object.values(a.layouts).map((e=>e.elements)).flat().filter((t=>t.stepName===e.stepName)),o=Le.getLocalOrUndefined(e.optionId)?.data;if(i?.selectedVariants){const a=i.selectedVariants[0].id;if(o&&a){const s=o.variants.find((e=>e.id===a));if(s){const a=n.map((e=>({id:e.id,region:e.stepRegion})));await t.setSelectionsAndElements(e.stepName,[s],a),t.updateStorage(e.stepName,{patchworkOffsets:i.storage?.patchworkOffsets}),t.setMandatoryFulfilled(e.stepName,!0)}}}}recalculate(e,t,a,i){const n=a.getCommandDispatcher();var o;i(!0);const s=t.map((e=>e.region?this.getRandomPosition(e.region):null)).filter((e=>!!e));n(new r(t.map(((e,t)=>{const a=s[t];return 0===t&&(o=a),new w(e.id,a.scale,-a.xOffset,-a.yOffset)})))),o&&a.updateStorage(e.stepName,{patchworkOffsets:s}),i(!1)}selectVariant(e,t,a,i,n){this.selectVariantCommand(e,t,a,i,n).then((e=>{e&&(i.getCommandDispatcher()(e.command),e.followup())}))}async selectVariantCommand(e,t,i,n,o){if(!t.assetKey)throw new Error("No Asset for Variant");const s=(await ft.getLocalOrFromServer(t.assetKey)).links.find((e=>"cdn"===e.rel));if(!s)throw new Error("Could not find CDN link for patchwork.");if(!e.data||!e.data.regions)return console.error("Trying to update patchwork in design with no region data"),null;o(!0);const c=s.href,d=n.getLayouts();var h;const p=e.data.regions.map((e=>this.getRandomPosition(e))),u=await Jt(c),m=Qt(u),f=e.data.regions.map(((t,i)=>((t,i,n)=>{const o=d.find((e=>e.panelId===t.panelId));if(!o)throw new Error("Can't find layout");const s=p[i],r=ot();return 0===i&&(h=s),{regionElement:{id:r,region:t},command:new a({stepRegion:t,stepName:e.stepName,id:r,svg:n,type:X.Patchwork,y:t.top,x:t.left,rotation:t.rotation,width:t.width,height:t.height,layerIndex:t.layerIndex,immutable:t.immutable,patchX:-s.xOffset,patchY:-s.yOffset,patchScale:s.scale},o)}})(t,i,m))),g=i.map((e=>new l(e.id))),w=f.map((e=>e.command));return{command:new r([...g,...w]),followup:async()=>{await n.setSelectionsAndElements(e.stepName,[t],f.map((e=>e.regionElement))),h&&n.updateStorage(e.stepName,{patchworkOffsets:p}),o(!1)}}}getRandomPosition(e){const t=Math.random()*(.7-.25)+.25,a=1/t,i=1-t;return{scale:a,xOffset:Math.random()*i*a*e.width,yOffset:Math.random()*i*a*e.height}}constructPreviewSvg(e,t,a,i){if(!i||0===t.length)return null;try{const n=be(t[0].id,a().map((e=>e.layoutState))).svg,o=e.data.regions[0],s={x:0,y:0,width:o.width,height:o.height,rotation:0,id:"patchwork-preview",svg:n,patchX:-i.xOffset,patchY:-i.yOffset,patchScale:i.scale},r=q(Re,{...s}),l=Ne.renderToStaticMarkup(r);return`\n <svg\n version="1.1"\n xmlns="http://www.w3.org/2000/svg"\n xmlns:xlink="http://www.w3.org/1999/xlink"\n width="${s.width}px"\n height="${s.height}px"\n viewBox="0 0 ${s.width} ${s.height}"\n >\n ${l}\n </svg>\n `}catch(e){return null}}};const ta=new class{async init(e,t,a){const i=Le.getLocalOrUndefined(e.optionId)?.data;if(!i)return null;if(a)await this.reload(e,t,a);else if(i.defaultVariant){const a=i.defaultVariant,n=i.variants.find((e=>!!e.assetKey&&e.id===a));if(n)return t.markStepsAsInitialised([e.stepName]),this.selectVariantCommand(e,n,t,(()=>{}))}return t.markStepsAsInitialised([e.stepName]),null}async reload(e,t,a){const i=t.getSerializedStep(e.stepName,a.serializableWorkflow.steps),n=Object.values(a.layouts).map((e=>e.elements)).flat().filter((t=>t.stepName===e.stepName)),o=Le.getLocalOrUndefined(e.optionId)?.data;if(i?.selectedVariants){const a=i.selectedVariants[0].id;if(o&&a){const i=o.variants.find((e=>e.id===a));if(i){const a=n.map((e=>({id:e.id,region:e.stepRegion})));await t.setSelectionsAndElements(e.stepName,[i],a),t.setMandatoryFulfilled(e.stepName,!0)}}}}selectVariant(e,t,a,i){this.selectVariantCommand(e,t,a,i).then((e=>{e&&(a.getCommandDispatcher()(e.command),e.followup())}))}async selectVariantCommand(e,t,i,n){if(!t.assetKey)throw new Error("No Asset for Variant");const o=(await ft.getLocalOrFromServer(t.assetKey)).links.find((e=>"cdn"===e.rel));if(!o)return console.error("No URL for picture!"),null;const s=o.href;n(!0),i.setMandatoryFulfilled(e.stepName,!1);const c=i.getRegionElements(e.stepName).map((e=>new l(e.id))),d=e.data.regions.map((t=>{const n=i.getLayouts().find((e=>e.panelId===t.panelId));if(!n)throw new Error(`Can not find layout for region: ${t.panelId}`);const o=ot();return{regionElement:{id:o,region:t},command:new a({stepName:e.stepName,stepRegion:t,id:o,src:s,type:X.Image,y:t.top,x:t.left,rotation:t.rotation,width:t.width,height:t.height,layerIndex:t.layerIndex,immutable:t.immutable,preserveAspectRatio:"none"},n)}}));return{command:new r([...c,...d.map((e=>e.command))]),followup:async()=>{await i.setSelectionsAndElements(e.stepName,[t],d.map((e=>e.regionElement))),i.setMandatoryFulfilled(e.stepName,!0),n(!1)}}}};const aa=new class{colourOptions(e){return Le.getLocalOrUndefined(e.optionId)?Le.getLocalOrUndefined(e.optionId).data.variants.map((e=>({fill:e.color,stroke:e.color,variant:e}))):e.data.colours.length>0?e.data.colours.map((e=>({fill:e,stroke:e}))):[]}async init(e,t,a){const i=Le.getLocalOrUndefined(e.optionId);if(!i)return null;if(!a){const a=Le.getDefaultVariant(i.data);if(!a)return null;const n={fill:a.color,stroke:a.color,variant:a};return this.selectVariantCommand(e,n,[],t)}return await this.reload(e,t,a),null}async reload(e,t,a){const i=t.getSerializedStep(e.stepName,a.serializableWorkflow.steps),n=Object.values(a.layouts).map((e=>e.elements)).flat().filter((t=>t.stepName===e.stepName)),o=Le.getLocalOrUndefined(e.optionId)?.data;if(i?.selectedVariants){const a=i.selectedVariants[0].id;if(o&&a){const i=o.variants.find((e=>e.id===a));if(i){const a=n.map((e=>({id:e.id,region:e.stepRegion})));await t.setSelectionsAndElements(e.stepName,[i],a),t.updateStorage(e.stepName,{colour:i.color||""}),t.setMandatoryFulfilled(e.stepName,!0)}}}}selectVariant(e,t,a,i){this.selectVariantCommand(e,t,a,i).then((e=>{e&&(i.getCommandDispatcher()(e.command),e.followup())}))}async selectVariantCommand(e,t,i,n){const o=n.getLayouts();if(i.length>0){const a=a=>{const i=a.region;if(!o.find((e=>e.panelId===i?.panelId)))return console.error(`Step ${e.stepName} missing layout for panel: ${i?.panelId}.`),null;const n=t.variant?.color;return n?new f(a.id,"spiff-fill-shape",n):(console.error("Failed to change color."),null)},s=i.map(a).filter((e=>!!e));return{command:new r(s),followup:async()=>{n.setSelectionsAndElements(e.stepName,t.variant?[t.variant]:[],i),n.updateStorage(e.stepName,{colour:t.fill||""})}}}{const i=i=>{const n=o.find((e=>e.panelId===i.panelId));if(!n)return console.error(`Step ${e.stepName} missing layout for panel: ${i.panelId}.`),null;const s=`\n <svg\n xmlns="http://www.w3.org/2000/svg"\n xmlnsXlink="http://www.w3.org/1999/xlink"\n xmlSpace="preserve"\n preserveAspectRatio="none"\n version="1.1"\n width="1"\n height="1"\n viewBox="0 0 1 1"\n >\n <rect\n x="0"\n y="0"\n width="1"\n height="1"\n class="spiff-fill-shape"\n fill="${t.variant?.color}"\n />\n </svg>\n `,r={};r["spiff-fill-shape"]={browserValue:t.variant.color};const l=ot();return{id:l,region:i,command:new a({stepRegion:i,stepName:e.stepName,colors:r,id:l,svg:s,type:X.Illustration,y:i.top,x:i.left,rotation:i.rotation,width:i.width,height:i.height,layerIndex:i.layerIndex,immutable:i.immutable,excludeFromExport:e.data.excludeFromPrint},n)}},s=e.data.regions.map(i),l=s.filter((e=>!!e)).map((e=>e?.command)),c=s.filter((e=>!!e)).map((e=>({id:e.id,region:e.region})));return{command:new r(l),followup:async()=>{await n.setSelectionsAndElements(e.stepName,t.variant?[t.variant]:[],c),n.updateStorage(e.stepName,{colour:t.fill||""})}}}}};const ia=new class{constructor(){this.latestToast=null,this.toastType=null,this.toastCallbacks=[]}addToastCallback(e){e({toastMessage:this.latestToast,toastType:this.toastType}),this.toastCallbacks.push(e)}setLatestToast(e,t){this.latestToast=e,this.toastType=t,this.onToastChange()}onToastChange(){this.toastCallbacks.forEach((e=>e({toastMessage:this.latestToast,toastType:this.toastType})))}};class na extends Error{constructor(e){super(e),Object.setPrototypeOf(this,new.target.prototype),this.name=na.name}}class oa extends Error{constructor(e){super(e),Object.setPrototypeOf(this,new.target.prototype),this.name=oa.name}}const sa=new class{async init(e,t,a){const i=Le.getLocalOrUndefined(e.optionId);if(!i)return null;if(a)await this.reload(e,t,a);else{const a=e.data.defaultText||"";t.updateStorage(e.stepName,{inputText:a});this.getDefaultColor(e.data)&&t.updateMetadata(e.stepName,{color:e.data.colour});const n=Le.getDefaultVariant(i.data);if(n)return this.selectVariantCommand(e,n,{},[],t,!1,(()=>{}),(()=>{}))}return null}async reload(e,t,a){const i=t.getSerializedStep(e.stepName,a.serializableWorkflow.steps),n=Object.values(a.layouts).map((e=>e.elements)).flat().filter((t=>t.stepName===e.stepName)),o=(await Le.getLocalOrFromServer(Te,e.optionId))?.data;if(i?.selectedVariants){const a=i.selectedVariants[0].id;if(o&&a){const s=o.variants.find((e=>e.id===a));if(s){const a=await this.fontDataFromVariant(s),o=n.map((e=>({id:e.id,region:e.stepRegion})));await t.setSelectionsAndElements(e.stepName,[s],o),t.updateMetadata(e.stepName,{color:i.storage?.color,text:i.storage?.text}),t.updateStorage(e.stepName,{text:i.storage?.text});const l=n.map((e=>new y(e.id,a))),c=new r(l);t.getCommandDispatcher()(c),t.setMandatoryFulfilled(e.stepName,!0)}}}}getDefaultColor(e){if(Le.getLocalOrUndefined(e.colourOptionId)){const t=Le.getDefaultVariant(Le.getLocalOrUndefined(e.colourOptionId).data);if(t)return t.color}if(e.colour)return e.colour}findLayoutElement(e,t,a){const i=e.getRegionElements(t.stepName);if(i[0])return be(i[0].id,a().map((e=>e.layoutState)))}findLayoutElements(e,t,a){return e.getRegionElements(t.stepName).map((e=>be(e.id,a().map((e=>e.layoutState)))))}cachedColors=new Map;availableColors(e){const t=this.cachedColors.get(e.stepName);if(t)return t;if(Le.getLocalOrUndefined(e.data.colourOptionId)){const t=Le.getLocalOrUndefined(e.data.colourOptionId).data.variants.map((e=>({fill:e.color,stroke:e.color,variant:e})));return this.cachedColors.set(e.stepName,t),t}if(e.data.colours&&e.data.colours.length>0){const t=e.data.colours.map((e=>({fill:e,stroke:e})));return this.cachedColors.set(e.stepName,t),t}return[]}changeColor(e,t,a,i){if(!e.data||!e.data.regions)return;const n=i.getCommandDispatcher();i.updateStorage(e.stepName,{color:t.fill}),t.variant?i.updateMetadata(e.stepName,{color:t.variant.name}):i.updateMetadata(e.stepName,{color:t.fill});for(const e of a){if(!t.fill)throw new Error("Fill not set on new color selection!");n(new o(e.id,t.fill))}}filterUnsupportedCharacters=(e,t)=>{let a=t.replace(/(\r\n|\r|(\u00a9|\u00ae|[\u2000-\u3300]|\ud83c[\ud000-\udfff]|\ud83d[\ud000-\udfff]|\ud83e[\ud000-\udfff]))/gm,"");const i=[],n=e?.fontData?b(e?.fontData):void 0;if(n){const e=a.split("").map((e=>n.getFont().charToGlyph(e)));for(let t=0;t<e.length;t++){const n=".notdef"===e[t].name;"\n"===a.charAt(t)||n&&i.push(String.fromCharCode(a.charCodeAt(t)))}}for(let e=0;e<i.length;e++)a=a.replaceAll(i[e],"");return a};updateInputText(e,t,a,i,n,o){const s=t?e:this.injectReplaceableText(e,i.data),l=oe(s,{vertical:i.data.vertical,uppercase:i.data.uppercase});let c={command:void 0,helperText:"",errors:this.getErrorsForText(e,i,o)};if(c.errors.length>0)return c.helperText=c.errors[0].localizationKey,c;const d=(i.data.maxLength-s.length).toString();c.helperText=`${d} characters remaining`,o.updateStorage(i.stepName,{text:e}),o.updateMetadata(i.stepName,{text:l}),n.defaultCleared&&o.setMandatoryFulfilled(i.stepName,!0);const h=o.getTransaction().bulk&&i.data.varyText||!1,p=[],u=new Map,m=new Map;for(const e of a){if(!e.fontData)throw new Error("Failed to resolve font data for text.");const[t,a]=Oe(e.fontSize,e.fontData,{left:e.x,top:e.y,width:e.width,height:e.height,rotation:e.rotation,panelId:""},l,{size:i.data.size,minSize:i.data.minSize,maxSize:i.data.maxSize});u.set(e.id,t),m.set(e.id,a);const n=i.data.curved?l:(a||[]).join("\n");p.push(this.generateTextChangeCommandsForRegion(t,i.data,e.id,n,h))}if(!i.data.curved&&a.length>0){if(!Array.from(m.values()).every((e=>e)))return c.errors.push({localizationKey:"workflow.steps.text.doesNotFit"}),c}return c.command=new r(p),c.command.varying=h,c}getErrorsForText=(e,t,a)=>{const i=[];t.data&&t.data.maxLength&&e.length>t.data.maxLength&&i.push({localizationKey:"workflow.steps.text.characterLimit"});const n=a.getProfanities(),o=e.toLowerCase();if(""!==o)for(const e in n){if(o===n[e].toLowerCase().trim()){i.push({localizationKey:"workflow.steps.text.blockedProfanity"});break}}return!t.data.allowNewlines&&(e.includes("\n")||e.includes("\r"))&&i.push({localizationKey:"workflow.steps.text.multipleLines"}),i};async changeInputTextWithRegion(e,t,a,i,n,o,s,l,c,d){const h=i.replace(/^(?![\u000A\u000D])[\u0000-\u001F\u007F-\u009F]/g,""),p=s?h:this.injectReplaceableText(h,e.data),u=o.getRegionElements(e.stepName),m=new Map,f=new Map;for(const i of u)if(i.region){const[n,o]=Oe(t,a,i.region,p,{size:e.data.size,minSize:e.data.minSize,maxSize:e.data.maxSize});m.set(i.id,n),f.set(i.id,o)}const g=(()=>{if(e.data&&e.data.maxLength&&p.length>e.data.maxLength)return d&&d(!0),{info:"0"};var t=p.toLowerCase();const a=o.getProfanities();for(const e in a)if(t===a[e].toLowerCase().trim()&&""!==t)return l(!0),{error:"Blocked profanity."};if(!e.data.allowNewlines&&(p.includes("\n")||p.includes("\r")))return l(!0),{error:"Cannot span multiple lines."};if(!e.data.curved){if(!Array.from(f.values()).every((e=>e)))return l(!0),{error:"Does not fit."}}return l(!1),{info:(e.data.maxLength-p.length).toString()}})();if(g.error)return void c(g.error);if(c(`${g.info} characters remaining`||""),d)return;o.updateStorage(e.stepName,{text:h}),o.updateMetadata(e.stepName,{text:this.injectReplaceableText(h,e.data)});const w=o.getTransaction().bulk&&e.data.varyText||!1;n.defaultCleared&&o.setMandatoryFulfilled(e.stepName,!0);const y=[];for(const t of u){const a=e.data.curved?p:(f.get(t.id)||[]).join("\n");y.push(this.generateTextChangeCommandsForRegion(m.get(t.id)||1,e.data,t.id,a,w))}const S=new r(y);return S.varying=w,S}selectVariant(e,t,a,i,n,o,s,r){this.selectVariantCommand(e,t,a,i,n,o,s,r).then((e=>{n.getCommandDispatcher()(e.command),e.followup()}))}async fontDataFromVariant(e){if(!e.assetKey)throw new Error("No Asset for Variant");const t=(await ft.getLocalOrFromServer(e.assetKey)).links.find((e=>"cdn"===e.rel))?.href;if(!t)throw new Error("Failed to find resource link for font in text step.");return{assetUrl:t,name:(await C(t)).names.fullName.en}}async findOrCreateElements(e,t,a){const i=e.getTransaction().bulk&&t.data.varyText||!1,n=this.findLayoutElements(e,t,a);if(n.length>0)return n;const o=Le.getLocalOrUndefined(t.optionId);if(!o)throw new Error(`No option for step ${t.stepName}`);const s=Le.getDefaultVariant(o.data);if(!s)throw new Error(`No default variant for step ${t.stepName}`);const l=await this.fontDataFromVariant(s),c=await this.createTextboxRegions(t.stepName,s,t.data,l,{},e),d=c.map((e=>e.commands)),h=new r(d.flat());return h.varying=i,e.getCommandDispatcher()(h),c.map((e=>e.newElement))}async selectVariantCommand(e,t,a,i,n,o,s,l){const c=ot();n.markUpdatePending(c);const d=await this.fontDataFromVariant(t);if(i.length>0){const h=i.map((e=>new y(e.id,d))),p=await this.changeInputTextWithRegion(e,e.data.size||30,d,a.text||"",a,n,o,s,l);p&&h.push(p);return{command:new r(h),followup:async()=>{n.markUpdateCompleted(c),await n.setSelectionsAndElements(e.stepName,[t],i)}}}{const i=await this.createTextboxRegions(e.stepName,t,e.data,d,a,n),h=await this.changeInputTextWithRegion(e,e.data.size||30,d,i[0]?.newElement.text||a.text||"",a,n,o,s,l),p=i.flatMap((e=>e.commands));h&&p.push(h);return{command:new r(p),followup:async()=>{n.markUpdateCompleted(c)}}}}injectReplaceableText(e,t){return t.replaceableText?t.replaceableText.replace("{{}}",e):e}async createTextboxRegions(e,t,i,n,o,s){if(!i||!i.regions)throw new Error("Step data not supplied");const r=s.getTransaction().bulk&&i.varyText||!1,l=r?"":o.text||i.defaultText||"",c=await Promise.all(i.regions.map((t=>{const c=s.getLayouts().find((e=>e.panelId===t.panelId)),d=ot();try{const s=this.getDefaultColor(i),h=s||"#000000";if(!c)throw new oa("Failed to find layout for region: "+t.panelId);const p={stepRegion:t,stepName:e,align:this.textAlign(i),fill:o.color?o.color:h,fontSize:i.size||30,fontData:n,id:d,layerIndex:t.layerIndex,rotation:t.rotation,text:oe(l,{vertical:i.vertical,uppercase:i.uppercase}),input:l,type:X.Textbox,vertical:i.vertical,x:t.left,y:t.top,height:t.height,width:t.width,immutable:t.immutable,verticalAlign:i.verticalAlign||"middle",curved:i.curved,paths:i.paths},u=[];if(!i.curved){if(!p.fontData)throw new Error("Failed to resolve font data for text.");const e=new Map,a=new Map,[n,o]=Oe(p.fontSize,p.fontData,t,l,{size:i.size,minSize:i.minSize,maxSize:i.maxSize});e.set(d,n),a.set(d,o);const s=(a.get(d)||[]).join("\n");u.push(this.generateTextChangeCommandsForRegion(e.get(d)||1,i,d,s,r))}const m=new a(p,c);return m.varying=r,{regionElement:{id:d,region:t},commands:[m,...u],newElement:p,fontData:n}}catch(e){throw console.log(e),new na("Error adding font to region")}}))).catch((e=>{throw e instanceof na?(ia.setLatestToast("Failed to load font.",ra.Error),e):e instanceof oa?e:new Error(e)}));return await s.setSelectionsAndElements(e,[t],c.map((e=>e.regionElement))),s.updateMetadata(e,{text:l}),s.updateStorage(e,{text:l}),c}textAlign=e=>e.vertical?"center":e.textAlign||"center";generateTextChangeCommandsForRegion(e,t,a,n,o){const s=[],l=new i(a,n);if(l.varying=o,s.push(l),!t.size){const t=new p(a,e);t.varying=o,s.push(t)}const c=new r(s);return c.varying=o,c}};let ra;var la;(la=ra||(ra={})).Error="Error",la.Warning="Warning";class ca extends Vt{createdAt=new Date;constructor(e){super(),this.update=e}async execute(){await this.update(),await new Promise((e=>{window.setTimeout((()=>{e()}),1e3)}))}}class da{workflowStatePromiseQueue=new Ut(1);variationRecords=[];constructor(e,t,a,i,n,o,s,r,l){this.updateTransaction=n,this.commandContext=i,this.initialReducerState=o.workflowState,this.transaction=o,this.ensuredInitialised=!1,this.confirmedDesign=!1,this.editedSteps={},this.informationResults=[],this.mandatorySteps={},this.pendingUpdates=[],this.selectionCost=0,this.workflow=e,this.stepSpecificServices={},this.profanityFilter=t,this.pollers=[],this.allScenes=[],this.processingStepInitialisation=!1,this.layouts=a,this.product=l,this.previewService=s,this.stepElements={},this.stepInitialised={},this.stepMetadata={},this.stepSelections={},this.storage={},this.confirmCallbacks=[],this.editedCallbacks=[],this.elementsCallbacks=[],this.ensuredInitialisedCallbacks=[],this.informationResultCallbacks=[],this.initCallbacks=[],this.mandatoryCallbacks=[],this.makingAdjustmentsCallback=[],this.metadataCallbacks=[],this.selectionCallbacks=[],this.stepSpecificStorageCallbacks={},this.storageCallbacks=[],this.updateCallbacks=[],this.currentVariationRecordCallbacks=[],this.variationRecordCallbacks=[],this.invalidModelVariants=[],this.currentAdjustingStepId="",this.renderableContextService=r,this.currentVariationRecord=null,this.ensureStepsAreLoaded(),this.fireReloadAnimation()}addVariationRecord(e){const t={...e,recordNumber:this.variationRecords.reduce(((e,t)=>t.recordNumber>e?t.recordNumber:e),0)+1};return this.variationRecords.push(t),this.onVariationRecordsChange(),t}removeVariationRecord(e){if(this.variationRecords=this.variationRecords.filter((t=>t.recordNumber!==e)),this.variationRecords.forEach(((e,t)=>{e.recordNumber=t+1})),this.currentVariationRecord&&this.currentVariationRecord.recordNumber===e){const e=this.currentVariationRecord.recordNumber,t=e>1?this.variationRecords[e-2]:this.variationRecords[0];this.setCurrentVariationRecord(t||null)}return this.onVariationRecordsChange(),this.variationRecords}setVariationRecords(e){this.variationRecords=e,this.onVariationRecordsChange(),0===e.length?this.setCurrentVariationRecord(null):this.setCurrentVariationRecord(e[0])}setCurrentVariationRecord(e){this.currentVariationRecord=e,this.onCurrentVariationRecordChange()}fireReloadAnimation(){if(!this.initialReducerState)return;const e=this.workflow.finalizeStepConfig;e&&(e.lookAtAnimation&&this.previewService?.executeCameraAnimation(e.lookAtAnimation),e.modelAnimation&&this.previewService?.executeModelAnimation(e.modelAnimation))}addConfirmCallback(e){e(this.confirmedDesign),this.confirmCallbacks.push(e)}addEditedCallback(e){e(this.editedSteps),this.editedCallbacks.push(e)}addElementsCallback(e){e(this.stepElements),this.elementsCallbacks.push(e)}addEnsuredInitialisedCallback(e){e(this.ensuredInitialised),this.ensuredInitialisedCallbacks.push(e)}addInformationResultCallback(e){e(this.informationResults),this.informationResultCallbacks.push(e)}addInitCallback(e){e(this.stepInitialised),this.initCallbacks.push(e)}addMandatoryCallback(e){e(this.mandatorySteps),this.mandatoryCallbacks.push(e)}addMetadataCallback(e){e(this.stepMetadata),this.metadataCallbacks.push(e)}addSelectionCallback(e){e({invalidModelVariants:this.invalidModelVariants,selectionCost:this.selectionCost,selections:this.stepSelections,traversableScenes:this.traversableScenes()}),this.selectionCallbacks.push(e)}addStepSpecificStorageCallback(e,t){Object.keys(this.storage).includes(t)||(this.storage[t]={}),e(this.storage[t]),Object.keys(this.stepSpecificStorageCallbacks).includes(t)||(this.stepSpecificStorageCallbacks[t]=[]),this.stepSpecificStorageCallbacks[t].push(e)}addStorageCallback(e){e(this.storage),this.storageCallbacks.push(e)}addUpdateCallback(e){e(this.pendingUpdates.length>0),this.updateCallbacks.push(e)}addMakingAdjustmentsCallback(e){e(this.currentAdjustingStepId),this.makingAdjustmentsCallback.push(e)}addCurrentVariationCallback(e){e(this.currentVariationRecord),this.currentVariationRecordCallbacks.push(e)}addVariationRecordsCallback(e){e(this.variationRecords),this.variationRecordCallbacks.push(e)}addPoller(e){this.pollers.push(e)}getLayouts(){return this.layouts}getLayoutPreviewService(){return this.renderableContextService}getPreviewService(){return this.previewService}getProductName(){return this.product?.name}getProfanities(){return this.profanityFilter}getRegionElements(e){return this.stepElements[e]||[]}getStepSpecificServices(e){return this.stepSpecificServices[e]}getTransaction(){return this.transaction}getWorkflow(){return this.workflow}getCommandDispatcher(){return e=>this.commandContext.apply(e)}getWorkflowSelections(){const e={};return this.workflow.steps.forEach((t=>{const a=this.stepSelections[t.stepName];if(a&&a.selectedVariants&&a.selectedVariants.length>0){const i=this.workflow.stepGroups.find((e=>e.stepNames.includes(t.stepName)));Le.getLocalOrUndefined(t.optionId)&&(e[t.stepName]={groupName:i?i.name:void 0,optionName:Le.getLocalOrUndefined(t.optionId).data.name,selections:a.selectedVariants})}})),e}markStepsAsInitialised(e){const t={...this.stepInitialised};e.forEach((e=>{t[e]=!0})),this.stepInitialised=t,this.onInitChange()}markUpdateCompleted(e){this.pendingUpdates=this.pendingUpdates.filter((t=>t!==e)),this.onUpdateChange()}markUpdatePending(e){this.pendingUpdates=[...this.pendingUpdates,e],this.onUpdateChange()}setAllScenes(e){const t=this.allScenes;this.allScenes=Lt(this.workflow,e),H(t,this.allScenes)||this.ensureStepsAreLoaded()}setEditedStatus(e,t){this.editedSteps={...this.editedSteps,[e]:t},this.onEditedChange()}setInformationResults(e){this.informationResults=[...e],this.onInformationResultChange()}setCurrentAdjustingStepId(e){this.currentAdjustingStepId=e,this.onMakingAdjustmentsChange()}setMandatoryFulfilled(e,t){this.mandatorySteps[e]!==t&&(this.mandatorySteps={...this.mandatorySteps,[e]:t},this.onMandatoryChange())}async setSelectionsAndElements(e,t,a){const i=this.stepSelections;this.stepSelections={...this.stepSelections,[e]:{selectedVariants:t}},this.selectionCost=Object.values(this.stepSelections).reduce(((e,t)=>e+t.selectedVariants.map((e=>e.priceModifier)).reduce(((e,t)=>e+t),0)),0),this.workflow.steps.forEach((e=>{Pt(e,this.stepSelections)||(this.stepInitialised[e.stepName]=!1,delete this.stepMetadata[e.stepName],delete this.stepSelections[e.stepName],delete this.storage[e.stepName])}));const n=this.allScenes,o=At(n,i),s=At(n,this.stepSelections),c=o.map((e=>e.silentSteps)).flat(),d=s.map((e=>e.silentSteps)).flat().filter((e=>!c.some((t=>t.stepName===e.stepName))));c.forEach((e=>{Pt(e,this.stepSelections)||(this.stepInitialised[e.stepName]=!1)})),this.invalidModelVariants=this.getInvalidModelVariants();const h=this.getInvalidCanvasRegions(),{stepElements:p,commands:m}=await this.stepElementsForIntroducedSilentSteps(d);this.processingStepInitialisation||this.ensureStepsAreLoaded(),this.stepElements={...this.stepElements,...p,[e]:a},this.removeElements(h),this.onElementsChange();if(this.workflow.steps.find((t=>t.stepName===e))?.type===ce.Frame){this.getStepSpecificServices(e)?.frameService?.setTargetElements(a.map((e=>e.id)))}const f=[...h.map((e=>new l(e.id))),...m,new u(this.constructSerializableWorkflow())];f.length>0&&this.commandContext.apply(new r(f)),this.onSelectionChange()}toggleDesignConfirmed(){this.confirmedDesign=!this.confirmedDesign,this.onConfirmChange()}toggleMakingAdjustmentsCallback(e){e(this.mandatorySteps),this.mandatoryCallbacks.push(e)}async updateStorage(e,t){const a={...this.storage,[e]:{...this.storage[e],...t}};if(!H(a,this.storage)){this.storage=a;const t=new u(this.constructSerializableWorkflow());this.commandContext.apply(t),this.onStepSpecificStorageChange(e),this.onStorageChange()}}constructSerializableWorkflow(){const e=[];return this.allScenes.forEach((t=>{t.renderableSteps.forEach((t=>{const a={stepName:t.stepName};a.storage=this.storage[t.stepName],a.selectedVariants=this.stepSelections[t.stepName]?.selectedVariants?.map((e=>({id:e.id,priceModifier:e.priceModifier}))),e.push(a)}))})),{steps:e}}updateStateWithServer(e){const t=this.serialize(e);this.workflowStatePromiseQueue.enqueue(new ca((async()=>{await this.updateTransaction({variables:{id:this.transaction.id,workflowState:t.transaction}})})))}async updateStateWithServerImmediate(e){const t=this.serialize(e);return new ca((async()=>{await this.updateTransaction({variables:{id:this.transaction.id,workflowState:t.transaction}})})).execute()}serialize(e){const t=JSON.stringify(this.dehydrateState(he(e().transaction))),a=e().variation;if(!a)return{transaction:t};const i={layouts:{},serializableWorkflow:{steps:[]},...he(a)||{}};return{transaction:t,variation:JSON.stringify(this.dehydrateState(i))}}dehydrateState(e){for(const t of Object.values(e.layouts).map((e=>e.elements)).flat())"illustration"===t.type&&(delete t.cachedObjectURL,t.src&&delete t.svg);return e}async outstandingRequestsPromise(){return this.workflowStatePromiseQueue.finalize()}updateMetadata(e,t){this.stepMetadata={...this.stepMetadata,[e]:{...this.stepMetadata[e],...t}},this.onMetadataChange()}removeElements(e){this.stepElements=((e,t)=>Object.keys(e).reduce(((a,i)=>{const n=[...e[i]||[]];return t.forEach((e=>{const t=n.findIndex((t=>t.id===e.id));t>-1&&n.splice(t,1)})),a[i]=n,a}),{}))(this.stepElements,e)}getInvalidCanvasRegions(){return this.workflow.steps.reduce(((e,t)=>(Pt(t,this.stepSelections)||this.stepElements[t.stepName]&&this.stepElements[t.stepName].forEach((t=>e.push(t))),e)),[])}getInvalidModelVariants(){return this.workflow.steps.reduce(((e,t)=>(!Pt(t,this.stepSelections)&&Le.getLocalOrUndefined(t.optionId)&&"Model"===t.type&&e.push(Le.getLocalOrUndefined(t.optionId).data.id),e)),[])}async stepElementsForIntroducedSilentSteps(e){const t=this.product;if(!t)return Promise.resolve({stepElements:{},commands:[]});const a=(e,t,a)=>"SilentIllustration"===e.type?new Bt(e,t).trigger():"ProductOverlay"===e.type?new Bt(e,t,a).trigger():Promise.reject("Unknown silent step. This is a bug"),i=e.filter((e=>!this.stepInitialised[e.stepName]));let n={stepElements:{},commands:[]};for(const e of i){this.markStepsAsInitialised([e.stepName]);const i=await a(e,this.layouts,t);n.stepElements[e.stepName]=i.map((e=>e.regionElement)),n.commands=[...n.commands,...i.map((e=>e.command))]}return n}getSerializedStep(e,t){return t.find((t=>t.stepName===e))}getCurrentVariationRecord(){return this.currentVariationRecord||void 0}getVariationRecords(){return this.variationRecords}stepNotReadyForInitialization(e){return("Model"===e.type||"Material"===e.type)&&!this.previewService}async reset(){this.commandContext.getAllLayouts().forEach((e=>e.layoutState.elements.forEach((e=>{this.getCommandDispatcher()(new l(e.id))})))),this.stepElements={},this.stepInitialised={},this.stepMetadata={},this.stepSelections={},this.storage={},this.currentVariationRecord=null,await this.ensureStepsAreLoaded()}async ensureStepsAreLoaded(){const e=this.initialReducerState?JSON.parse(this.initialReducerState):void 0;this.processingStepInitialisation=!0,await Le.cacheRequiredOptions(this.workflow);const t=this.allScenes,a=At(t,this.stepSelections).map((e=>e.silentSteps)).flat(),{stepElements:i,commands:n}=await this.stepElementsForIntroducedSilentSteps(a);this.stepElements={...this.stepElements,...i};const o=Tt(this.allScenes,this.stepSelections).map((e=>e.renderableSteps)),s=[],r=[];n.forEach((e=>s.push({command:e,followup:async()=>{}})));const l=o.flat();for(const t of l)if(!this.stepInitialised[t.stepName]&&!this.stepNotReadyForInitialization(t))switch(this.stepInitialised[t.stepName]=!0,t.type){case"Bulk":this.updateStorage("Bulk",e?.serializableWorkflow.steps.find((e=>"Bulk"===e.stepName))?.storage||{});break;case"DigitalContent":s.push(await Xt.init(t,this,e));break;case"Finish":case"Introduction":default:break;case"Frame":case"Photo":const a=new qt(t.data.forceImageCover);a.connectWorkflowManager(this,t.stepName),this.stepSpecificServices[t.stepName]={frameService:a},s.push(await Gt.init(t,this,e));break;case"Illustration":s.push(await jt.init(t,this,e));break;case"Material":r.push(await Yt.init(t,this,e));break;case"Model":r.push(await Zt.init(t,this,e));break;case"Module":const i=t.data.module;this.stepSpecificServices[t.stepName]={module:await pe(i)},s.push(await _t.init(t,this,e));break;case"Patchwork":s.push(await ea.init(t,this,e));break;case"Picture":s.push(await ta.init(t,this,e));break;case"Question":r.push(await Nt.init(t,this,e));break;case"Shape":s.push(await aa.init(t,this,e));break;case"Text":s.push(await sa.init(t,this,e))}const c=s.filter((e=>!!e));for(const e of c)this.commandContext.apply(e.command),await e.followup();const d=r.filter((e=>!!e));if(d.length>0)for(const e of d)await e();(c.length>0||d.length>0)&&await this.ensureStepsAreLoaded();const h=l.map((e=>{if(Le.getLocalOrUndefined(e.optionId))return Le.getDefaultVariant(Le.getLocalOrUndefined(e.optionId).data)}));(e||l.length>0&&!h.some((e=>!!e))||c.length>0||d.length>0)&&(this.ensuredInitialised=!0,this.onEnsuredInitialisedChange()),this.processingStepInitialisation=!1,this.onSelectionChange(),this.onInitChange()}onConfirmChange(){this.confirmCallbacks.forEach((e=>e(this.confirmedDesign)))}onEditedChange(){this.editedCallbacks.forEach((e=>e(this.editedSteps)))}onEnsuredInitialisedChange(){this.ensuredInitialisedCallbacks.forEach((e=>e(this.ensuredInitialised)))}onElementsChange(){this.elementsCallbacks.forEach((e=>e(this.stepElements)))}onInformationResultChange(){this.informationResultCallbacks.forEach((e=>e(this.informationResults)))}onInitChange(){this.initCallbacks.forEach((e=>e(this.stepInitialised)))}onMakingAdjustmentsChange(){this.makingAdjustmentsCallback.forEach((e=>{e(this.currentAdjustingStepId)}))}onMandatoryChange(){this.mandatoryCallbacks.forEach((e=>e(this.mandatorySteps)))}onMetadataChange(){this.metadataCallbacks.forEach((e=>{e(this.stepMetadata)}))}onSelectionChange(){this.selectionCallbacks.forEach((e=>e({invalidModelVariants:this.invalidModelVariants,selectionCost:this.selectionCost,selections:this.stepSelections,traversableScenes:this.traversableScenes()})))}onStepSpecificStorageChange(e){Object.keys(this.stepSpecificStorageCallbacks).includes(e)||(this.stepSpecificStorageCallbacks[e]=[]),this.stepSpecificStorageCallbacks[e].forEach((t=>t(this.storage[e])))}onStorageChange(){this.storageCallbacks.forEach((e=>e(this.storage)))}onUpdateChange(){this.updateCallbacks.forEach((e=>{e(this.pendingUpdates.length>0)}))}onCurrentVariationRecordChange(){this.currentVariationRecordCallbacks.forEach((e=>{e(this.currentVariationRecord)}))}onVariationRecordsChange(){this.variationRecordCallbacks.forEach((e=>{e(this.variationRecords)}))}traversableScenes(){const e=this.allScenes;return zt(e,this.stepSelections)}}class ha{constructor(t){if(!t.workflow)throw new Error("No Workflow ID provided.");const a=t.layouts;this.commandContext=new e;const i=t.transaction.workflowState?JSON.parse(t.transaction.workflowState):void 0;this.commandContext.initialize(a,i),this.isReadOnly=!!t.transaction.lineItem?.id||!yt.getMap("transactionOwnerIds")?.get(t.transaction.id);this.workflowManager=new da(t.workflow,t.product.profanities?.map((e=>e.word))||[],a,this.commandContext,(async e=>{this.isReadOnly||Ve.getShadowGraphqlClient().mutate({...e,mutation:Ct})}),t.transaction,t.previewService,t.renderableContextService,t.product)}getIsReadOnly(){return this.isReadOnly}getCommandContext(){return this.commandContext}getWorkflowManager(){return this.workflowManager}async updateVariationRecords(e){await Ve.getShadowGraphqlClient().mutate({mutation:kt,variables:{transactionId:this.workflowManager.getTransaction().id,updates:e.map((e=>({recordNumber:e.recordNumber,values:e.values.map((e=>({aspect:e.aspect,stepName:e.stepName,value:e.value})))})))}})}async createPreviewImage(){const e=document.createElement("canvas");e.width=1024,e.height=1024;const a=this.commandContext.getAllLayouts()[this.workflowManager.getWorkflow().defaultPreviewPanelIndex||0],i=a.layoutState.layout.previewRegion?{x:a.layoutState.layout.previewRegion.left,y:a.layoutState.layout.previewRegion.top,width:a.layoutState.layout.previewRegion.width,height:a.layoutState.layout.previewRegion.height}:{x:0,y:0,width:a.layoutState.layout.width,height:a.layoutState.layout.height},n=this.commandContext.getLayoutById(a.layoutState.layout.id),o=e.getContext("2d");if(!o)throw new Error("Failed to build 2D context for preview image creation.");const s=t(n.layoutState.layout,n.layoutState.elements,{region:i}),r=await re.from(o,s,{anonymousCrossOrigin:!0,ignoreDimensions:!1});await r.render();const l=await(async e=>new Promise(((t,a)=>{try{e.toBlob((e=>{if(e){const a=URL.createObjectURL(e);t(a)}}))}catch(e){a(e)}})))(e);return e.toDataURL(l)}getStepById(e){const t=this.getWorkflowManager().getWorkflow().steps.find((t=>t.stepName===e));if(t)return new Rt(this.getWorkflowManager(),t)}getStepByName(e){const t=this.getWorkflowManager().getWorkflow().steps.find((t=>t.stepTitle===e));if(t)return new Rt(this.getWorkflowManager(),t)}getStepsByType(e){return this.getWorkflowManager().getWorkflow().steps.filter((t=>t.type===e)).map((e=>new Rt(this.getWorkflowManager(),e)))}async onDesignFinished(e,t,a,i){const n=(e,t,a)=>{const i={};return t.steps.forEach((t=>{Object.assign(i,(t=>{const i={};if("Frame"===t.type){const n=e[t.stepName],o=t.data;if(!n||o.hideImageInCart&&a)return i;i[`${t.stepTitle} exportedData.image`]=n.image}if("Illustration"===t.type){const n=e[t.stepName],o=t.data;if(!n||o.hideColorsInCart&&a||!n.colors)return i;if(n.colors.length>0){const e=n.colors.join(", ").toUpperCase();i[`${t.stepTitle} exportedData.colors`]=e}}if("Module"===t.type){const n=e[t.stepName],o=t.data;if(!n||o.hideTextInCart&&a)return i;i[`${t.stepTitle} exportedData.text`]=n.text}if("Text"===t.type){const n=e[t.stepName];if(!n)return i;const o=t.data;o.hideTextInCart&&a||(i[`${t.stepTitle} exportedData.text`]=n.text),!n.color||o.hideColorInCart&&a||(i[`${t.stepTitle} exportedData.color`]=n.color)}return i})(t))})),i},o=(e,t,a,i,n,o,s,r,l)=>({event:"onComplete",lineItemImageUrl:s?s.href:"",transactionId:e.id,metadata:n,selectedVariants:r,designProductVariantId:e.externalDesignProductVariantId,designProductId:e.externalDesignProductId,baseCost:a,weight:t.weight,optionsCost:i,exportedData:o,sku:l,workflowViewerLink:e.workflowViewerLink||""}),s=async(e,t,a,i,s,r,l)=>{const c=(e.product?.basePrice||0)*(e.variationsCount||0),d=e.priceModifierTotal||0,h=((e,t,a,i)=>{const o={};let s;if(a){s=n(a,t,!1);for(const e of Object.keys(s))o[e]={value:s[e],priceModifier:0}}else if(i){s=i;for(const e of Object.keys(s))o[e]={value:s[e],priceModifier:0}}for(const a of Object.keys(e)){const i=e[a],n=t.steps.find((e=>e.stepTitle===a));if(1===i.length)o[`${n?.stepTitle} exportedData.selection`]={value:i[0].name,priceModifier:i[0].priceModifier};else if(i.length>1)for(let e=0;e<i.length;e++)o[`${n?.stepTitle} exportedData.selection ${e+1}`]={value:i[e].name,priceModifier:i[e].priceModifier}}return o})(i,a,void 0,r);return o(e,t,c,d,r,h,l,i,s)};return(async(e,t,a,i,r,l,c,d,h,p,u,m)=>{h("workflow.steps.finish.finalize.buildingLayouts"),await e.outstandingRequestsPromise();const f=Ve.getShadowGraphqlClient();await f.resetStore();const g=await f.mutate({mutation:Et,variables:{id:l.id}}),w=g.data?.transactions[0].workflowState;!g.errors&&w||(console.warn("State mismatch detected. Uploading known state explicitly"),console.warn("State Object:",JSON.stringify(i())),g.errors&&g.errors.forEach((e=>{g.errors&&console.log("Server Error:",e.message)})),await e.updateStateWithServerImmediate(i),console.log("Server state is undefined @ Workflow completion"));const y=e.getPreviewService(),S=t?.finalizeStepConfig?.lookAtAnimation,v=y&&100===y.getSceneInitializationProgress()&&t.showModelOnFinishStep&&S,x=m&&n(m,t,!0),C=m&&n(m,t,!1),b=e=>{const a={};let i=0;if(Object.keys(c).length>0)for(const n of Object.keys(c)){const o=c[n],s=t.steps.find((e=>e.stepName===n));for(let t=0;t<o.selections.length;++t){const n=o.selections[t];if(s&&(!e||Le.getLocalOrUndefined(s.optionId)&&Le.getLocalOrUndefined(s.optionId).data.variants.length>1&&!s.data.hideSelectionInCart&&!s.data.hideSelectionsInCart)){const e=s.stepTitle;a[e]?a[e].push({id:n.id||"",name:n.name,priceModifier:n.priceModifier}):a[e]=[{id:n.id||"",name:n.name,priceModifier:n.priceModifier}]}i+=n.priceModifier}}return[a,i]},[k]=b(!0),I=Object.fromEntries(Object.keys(k).map((e=>[e,k[e].map((e=>e.id))]))),[E]=b(!1),N=Object.fromEntries(Object.keys(E).map((e=>[e,E[e].map((e=>e.id))]))),R=await this.createPreviewImage();h("workflow.steps.finish.finalize.creatingDesign");const O=(await Te.execute("createDesign",{designDetails:(()=>{const e={designName:d,layouts:a.map((e=>({index:e.index,panelId:e.panelId}))),workflowId:t.id,productId:r.id,transactionId:l.id,threeDimPreview:!!v,previewImage:R};return m&&(e.metadata=C),I&&(e.selectedVariants=N),e})()})).body,M=O.links.find((e=>"image"===e.rel));h("workflow.steps.finish.finalize.updatingTransaction");const L=(await Ve.getShadowGraphqlClient().query({query:It,variables:{id:l.id}})).data.transactions[0];return l.bulk?(await p(u),((e,t,a)=>{const i=(e.product?.basePrice||0)*(e.variationsCount||0),n=e.priceModifierTotal||0,s={items:{value:e.variationsCount?`${e.variationsCount}`:"0",priceModifier:0}};return o(e,t,i,n,void 0,s,a)})(L,r,M)):await s(L,r,t,k,O.data.sku,x,M)})(this.workflowManager,this.workflowManager.getWorkflow(),this.workflowManager.getLayouts(),(()=>this.commandContext.getState()),e,this.workflowManager.getTransaction(),a,this.workflowManager.getWorkflow().name,t,(e=>this.updateVariationRecords(e)),this.workflowManager.getVariationRecords(),i)}}class pa{constructor(e){this.handleCompleteRender=null;const t=new Map;e.forEach((e=>t.set(e.id,new ma(e.id,e.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}}let ua;class ma{hasSetStaticContext=!1;interactiveDirty=!1;staticCtxDirty=!1;lastRequestedRenderArguments=void 0;lastCompletedStaticRender=void 0;lastModificationID=void 0;renderQueue=new Ut(2);rehydrated=!1;constructor(e,t,a){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:e,layouts:t,variationRecord:a,productOverlayImageUrl:i}=this.lastRequestedRenderArguments;this.render(e,t,a,i)}}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,i){const n=he(t);this.lastRequestedRenderArguments={workflow:e,layouts:n,variationRecord:a,productOverlayImageUrl:i};const o=this.getStaticContext();if(!o)return this.markLastCompletedStaticRender(),void this.setStaticContextDirty(!1);this.renderQueue.enqueue(new fa(this.getID(),o,(()=>{if(void 0!==ua)return ua;const e=document.createElement("canvas").getContext("webgl2");return ua=!!e,ua})(),(()=>{this.markLastCompletedStaticRender(),this.setStaticContextDirty(!0)}),e,n,a,(async()=>{const e={layouts:{},serializableWorkflow:{steps:[]}};if(t.forEach((t=>{e.layouts[t.layoutState.layout.id]=t.layoutState})),!this.rehydrated){await ke(e);const t=Object.keys(e.layouts);for(let a=0;a<t.length;a++){const i=t[a],n=e.layouts[i].elements.filter((e=>"illustration"===e.type));for(let e=0;e<n.length;++e){const t=n[e];t.src&&t.svg&&(t.cachedObjectURL=await $t(t.svg))}}this.rehydrated=!0}}),i))}}class fa extends Vt{constructor(e,t,a,i,n,o,s,r,l){super(),this.layoutId=e,this.ctx=t,this.nonPOTSupport=a,this.onRender=i,this.workflow=n,this.layouts=o,this.variationRecord=s,this.preprocess=r,this.productOverlayImageUrl=l}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")&&(!!window.Worker&&!!window.OffscreenCanvas)}async execute(){const e=this.layouts.find((e=>e.layoutState.layout.id===this.layoutId));if(!e)return;const a=e.layoutState.elements||[];if(await this.preprocess(),this.variationRecord){const t=this.variationRecord.values.map((e=>({stepName:e.stepName,stepAspectType:e.aspect,value:e.value})));for(const e of this.workflow.steps)if(e.optionId&&!e.option){e.option=await Le.getLocalOrFromServer(Te,e.optionId);for(const t of e.option.data.variants)t.assetKey&&!t.asset&&(t.asset=await ft.getLocalOrFromServer(t.assetKey))}const i=await wa(ga(t,this.workflow),this.workflow,this.layouts.map((e=>e.layoutState.layout)),this.productOverlayImageUrl),n=i?.layouts[e.layoutState.layout.id];(n?.elements||[]).forEach((e=>{const t=a.find((t=>t.stepName===e.stepName));t&&t.type===X.Textbox?(t.text=e.text,t.fontSize=e.fontSize):a.push(e)})),a.sort(((e,t)=>void 0!==e.layerIndex&&void 0!==t.layerIndex?e.layerIndex-t.layerIndex:0))}const i=e.layoutState.layout.width,n=e.layoutState.layout.height,o=this.getDynamicTextureResolution().width,s=this.getDynamicTextureResolution().height;let r,l;if(this.nonPOTSupport){i/n<o/s?(r=o,l=n*(o/i)):(r=i*(s/n),l=s)}else r=this.getDynamicTextureResolution().width,l=this.getDynamicTextureResolution().height;const c=t(e.layoutState.layout,a),d=await le.from(this.ctx,c,{anonymousCrossOrigin:!0,ignoreDimensions:!this.nonPOTSupport,ignoreAnimation:!0,ignoreClear:!0,ignoreMouse:!0,enableRedraw:!1});d.resize(r,l),await d.render(),this.onRender()}}const ga=(e,t)=>{const a=[];return e.forEach((e=>{const i=t.steps.find((t=>t.stepName===e.stepName));i?.type===ce.Text&&"Text"===e.stepAspectType&&a.push({name:i.stepName,data:{text:e.value}})})),a},wa=async(e,t,a,i)=>{let n={serializableWorkflow:{steps:[]},layouts:{}};a.forEach((e=>{n=new S(e).apply(n)}));return(await Me(e,t,a,i)).forEach((e=>{n=e.apply(n)})),n},ya=async e=>(await Te.execute("getProductById",{productId:e})).body,Sa=(e,t)=>{const a=e.workflowState,i=a?JSON.parse(a):void 0;return i?Object.values(i.layouts).map((e=>e.layout)):t.panels.sort(((e,t)=>e.index-t.index)).map((e=>({id:ot(),panelId:e.name,name:e.name,index:e.index,createdAt:new Date,updatedAt:new Date,transparentBackground:e.transparentBackground,height:e.height,width:e.width,previewRegion:e.previewRegion})))};class va{constructor(e){this.initialized=!1,this.options=e}async initFromIntegrationProduct(e){if(""===e)throw new Error("No integration product ID provided.");this.options.useUncachedEndpoints&&Te.setUncachedOperations(["getAssetByKeyV2","getWorkflowV2","getMaterialV2","getOptionV2"]);const t=Ve.getShadowGraphqlClient();await t.resetStore();const a=await t.mutate({mutation:St,variables:{integrationProductId:e,bulk:this.options.bulk||!1}}),i=(await t.mutate({mutation:vt,variables:{id:a.data?.transactionCreate.id}})).data?.transactionClaim;if(!i)throw new Error("Failed to create transaction.");const n=yt.getMap("transactionOwnerIds")||new Map;n.set(i.id,i.transactionOwnerId),Ae(i.transactionOwnerId||""),yt.setMap("transactionOwnerIds",n);const o=await ya(i.product?.id||"");this.experienceOptions={product:o.data,transaction:i,layouts:[]},this.initialized=!0}async initFromTransaction(e){if(""===e)throw new Error("No transaction ID provided.");const t=Ve.getShadowGraphqlClient();await t.resetStore();const a=yt.getMap("transactionOwnerIds")||new Map,i=a.get(e);if(i){Ae(i);const a=(await t.query({query:xt,variables:{id:e}})).data?.transactions[0];if(!a)throw new Error("Failed to read transaction.");const n=await ya(a.product?.id||"");return this.experienceOptions={product:n.data,transaction:a,layouts:[]},void(this.initialized=!0)}const n=(await t.mutate({mutation:vt,variables:{id:e}})).data?.transactionClaim;if(!n)throw new Error("Failed to read transaction.");n.transactionOwnerId&&(a.set(n.id,n.transactionOwnerId),Ae(n.transactionOwnerId),yt.setMap("transactionOwnerIds",a));const o=await ya(n.product?.id||"");this.experienceOptions={product:o.data,transaction:n,layouts:[]},this.initialized=!0}async getWorkflowExperience(e,t,a){if(!this.initialized||!this.experienceOptions)throw new Error("Cannot launch experience: Not initialized.");if(this.experienceOptions.transaction.workflowId){const e=(await Te.execute("getWorkflowV2",{workflowSlug:this.experienceOptions.transaction.workflowId})).body.data;if(this.experienceOptions.workflow=e,this.experienceOptions.transaction.workflowState){const e=JSON.parse(this.experienceOptions.transaction.workflowState);this.experienceOptions.layouts=Object.values(e.layouts).map((e=>e.layout))}return this.experienceOptions.previewService=a&&a(e),this.experienceOptions.renderableContextService=new pa(this.experienceOptions.layouts),this.experienceOptions.product?.modelUrl&&await(this.experienceOptions.previewService?.initialize(this.experienceOptions.product.modelUrl,this.experienceOptions.renderableContextService)),new ha(this.experienceOptions)}if(e){const i=(await Te.execute("getWorkflowV2",{workflowSlug:e})).body.data;if(this.experienceOptions.workflow=i,await Ve.getShadowGraphqlClient().mutate({mutation:bt,variables:{workflowId:e,id:this.experienceOptions.transaction.id}}),t){this.experienceOptions.transaction.workflowState=t;const e=JSON.parse(this.experienceOptions.transaction.workflowState);this.experienceOptions.layouts=Object.values(e.layouts).map((e=>e.layout))}else this.experienceOptions.layouts=Sa(this.experienceOptions.transaction,this.experienceOptions.workflow);return this.experienceOptions.previewService=a&&a(i),this.experienceOptions.renderableContextService=new pa(this.experienceOptions.layouts),this.experienceOptions.product?.modelUrl&&await(this.experienceOptions.previewService?.initialize(this.experienceOptions.product.modelUrl,this.experienceOptions.renderableContextService)),new ha(this.experienceOptions)}throw new Error("No workflow ID provided.")}getPreviewService(){return this.experienceOptions?.previewService}getProduct(){if(!this.initialized||!this.experienceOptions)throw new Error("Cannot get product: Not initialized.");return this.experienceOptions.product}getTransaction(){if(!this.initialized||!this.experienceOptions)throw new Error("Cannot get transaction: Not initialized.");return this.experienceOptions.transaction}}export{va as Client,e as CommandContext,ft as assetService,Le as optionService,Te as server,yt as persistenceService,a as CreateElementCommand,i as TextChangeCommand,n as FontAlignmentCommand,o as FontColorCommand,v as LayoutElementFactory,mt as AdvancedEditor,Fe as useLayouts,Xe as useEditorState,je as commandReducer,$e as getDefaultState,Ue as CommandContextContext,Ke as AdvancedEditorStateProvider,Be as AdvancedEditorContext,He as UICommand,x as SpiffCommerce3DPreviewService};
98
+ //# sourceMappingURL=module.js.map