@spiffcommerce/core 0.3.3 → 0.3.4

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/main.js CHANGED
@@ -1,4 +1,4 @@
1
- var e=require("papyrus/build/main/CommandContext"),t=require("papyrus/build/main/command"),a=(require("papyrus/build/main/Elements/factory"),require("spiff-preview"),require("papyrus/build/main/font")),i=require("swagger-client"),n=require("@apollo/client"),o=require("@apollo/client/link/context"),r=require("@apollo/client/link/error"),s=require("cross-fetch"),l=require("react"),c=require("react/jsx-runtime"),d=require("papyrus/build/main/types"),p=require("lodash.isequal"),h=require("papyrus/build/main/LayoutsState/types"),u=require("papyrus/build/main/math"),m=require("papyrus/build/main/text/algorithm/traditional"),f=require("papyrus/build/main/text/shared"),g=require("papyrus/build/main/image"),w=require("canvg"),y=require("papyrus/build/main/generation/Workflow"),S=require("lodash.clonedeep"),v=require("papyrus/build/main/module/resolver"),x=require("lodash.debounce"),C=require("papyrus/build/main/frame"),b=require("papyrus/build/main/illustration"),k=require("papyrus/build/main/LayoutsState"),E=require("qrcode"),I=require("papyrus/build/main/crossplatform"),N=require("react-dom/server"),R=require("papyrus/build/main/Elements/Patchwork"),T=require("papyrus/build/main/text/algorithm/autosize"),O=require("papyrus/build/main/generation");function M(e,t,a,i){Object.defineProperty(e,t,{get:a,set:i,enumerable:!0,configurable:!0})}function A(e){return e&&e.__esModule?e.default:e}M(module.exports,"Client",(()=>bt)),M(module.exports,"CommandContext",(()=>$eb7869949b641a40$re_export$CommandContext)),M(module.exports,"spiffCoreConfiguration",(()=>D)),M(module.exports,"PromiseQueue",(()=>je)),M(module.exports,"QueueablePromise",(()=>qe)),M(module.exports,"assetService",(()=>ye)),M(module.exports,"optionService",(()=>L)),M(module.exports,"server",(()=>F)),M(module.exports,"persistenceService",(()=>xe)),M(module.exports,"graphQlManager",(()=>U)),M(module.exports,"toast",(()=>rt)),M(module.exports,"FrameService",(()=>Be)),M(module.exports,"frameStepService",(()=>Ze)),M(module.exports,"modelStepService",(()=>Je)),M(module.exports,"materialStepService",(()=>Qe)),M(module.exports,"patchworkStepService",(()=>it)),M(module.exports,"pictureStepService",(()=>nt)),M(module.exports,"textStepService",(()=>ct)),M(module.exports,"illustrationStepService",(()=>Ge)),M(module.exports,"svgObjectURL",(()=>Ke)),M(module.exports,"generate",(()=>se)),M(module.exports,"CreateElementCommand",(()=>$eb7869949b641a40$re_export$CreateElementCommand)),M(module.exports,"TextChangeCommand",(()=>$eb7869949b641a40$re_export$TextChangeCommand)),M(module.exports,"FontAlignmentCommand",(()=>$eb7869949b641a40$re_export$FontAlignmentCommand)),M(module.exports,"FontColorCommand",(()=>$eb7869949b641a40$re_export$FontColorCommand)),M(module.exports,"LayoutElementFactory",(()=>$eb7869949b641a40$re_export$LayoutElementFactory)),M(module.exports,"minZoom",(()=>le)),M(module.exports,"AdvancedEditor",(()=>we)),M(module.exports,"EditorCore",(()=>ge)),M(module.exports,"useLayouts",(()=>j)),M(module.exports,"useEditorState",(()=>Y)),M(module.exports,"useEditorInteraction",(()=>ce)),M(module.exports,"commandReducer",(()=>K)),M(module.exports,"getDefaultState",(()=>B)),M(module.exports,"CommandContextContext",(()=>q)),M(module.exports,"AdvancedEditorStateProvider",(()=>H)),M(module.exports,"AdvancedEditorContext",(()=>G)),M(module.exports,"UICommand",(()=>X)),M(module.exports,"SpiffCommerce3DPreviewService",(()=>$eb7869949b641a40$re_export$SpiffCommerce3DPreviewService));const L=new class{cache=new Map;async cacheRequiredOptions(e){const t=e.steps.map((e=>e.optionId)).filter((e=>void 0!==e)),i=e.steps.map((e=>e.data.colourOptionId)).filter((e=>void 0!==e)),n=[...new Set([...t,...i])].map((async e=>{const t=await L.getLocalOrFromServer(F,e);"Font"===t.data.type&&t.data.variants.forEach((async e=>{if(e.assetKey){const t=(await ye.getLocalOrFromServer(e.assetKey)).links.find((e=>"cdn"===e.rel))?.href;t&&await(0,a.loadFontFromExternalUrl)(t)}}))}));await Promise.allSettled([...n])}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 ye.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 ye.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 D=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 P;const z=e=>{P=e},V=async()=>({transactionOwnerId:P});const F=new class{uncachedOperations=[];constructor(){D.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 V();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 V(),t=D.getServerUrl()+"/v2/api-docs";return await A(i)(t,{authorizations:{OAuth2:{token:{access_token:e.bearer,token_type:"Bearer"}},PartnerId:e.partnerId}})}};const U=new class{constructor(){this.shadowGraphqlClient=this.constructShadowGraphqlClient(),D.addServerUrlCallback((()=>{this.shadowGraphqlClient=this.constructShadowGraphqlClient()}))}getShadowGraphqlClient(){return this.shadowGraphqlClient}constructShadowGraphqlClient(){const e=(0,n.createHttpLink)({uri:`${D.getServerUrl()}/graphql`,fetch:A(s)}),t=(0,o.setContext)((async(e,{headers:t})=>{const a=t||{},i=await V();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=(0,r.onError)((({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(0,n.InMemoryCache)({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(0,n.ApolloClient)({link:(0,n.from)([a,t,e]),cache:i,name:"Core"})}},q=(0,l.createContext)(new(0,e.CommandContext)),j=()=>{const e=(0,l.useContext)(q);(0,l.useEffect)((()=>{e.registerStateCallback((()=>{a(new Date)}))}),[e]);const[t,a]=(0,l.useState)(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 W;var $;($=W||(W={})).None="None",$.FrameAdjustment="FrameAdjustment",$.FinalizeDesign="FinalizeDesign";const B=(e,t)=>({layoutId:e()[0].layoutState.layout.id,selectedElement:void 0,zoom:t,maxZoom:5,units:d.UnitOfMeasurement.Pixel,subMenu:W.None,activeModifierKeys:[],metaPressed:!1,elementEvent:void 0,scrolledMovement:!1}),K=(e,t)=>A(p)(e,t.apply(e))?e:t.apply(e),G=(0,l.createContext)({}),H=e=>{const{getAllLayouts:t}=j(),[a,i]=(0,l.useReducer)(K,B(t,e.defaultZoom||1)),n=(0,l.useMemo)((()=>({state:a,uiDispatcher:i})),[a,i]);return(0,c.jsx)(G.Provider,{value:n,children:e.children})};class X{constructor(e){this.changes=e}apply(e){return{...e,...this.changes}}}const Y=()=>(0,l.useContext)(G),_=7*window.devicePixelRatio,Z=(e,t,a,i)=>{const n=t.layout.width,o=t.layout.height,r=t.elements.filter((t=>t.id!==e.id&&!t.immutable&&!t.productOverlay)),s=r.map((e=>(0,u.getAxisAlignedBoundingBox)(e.x,e.y,e.width,e.height,e.rotation))),l=[],d=new Set;s.forEach((e=>d.add(e.minX))),s.forEach((e=>d.add(e.maxX))),[0,n/2,n].forEach((e=>d.add(e)));const p=new Set;s.forEach((e=>p.add(e.minY))),s.forEach((e=>p.add(e.maxY))),[0,o/2,o].forEach((e=>p.add(e)));const h=r.map((e=>e.y));for(let e=-315;e<=315;e+=45)h.push(e);const m=(0,u.getAxisAlignedBoundingBox)(e.x,e.y,e.width,e.height,e.rotation),f=[{value:m.minX,anchor:-1},{value:m.minX+(m.maxX-m.minX)/2,anchor:0},{value:m.minX+(m.maxX-m.minX),anchor:1}],g=[{value:m.minY,anchor:-1},{value:m.minY+(m.maxY-m.minY)/2,anchor:0},{value:m.minY+(m.maxY-m.minY),anchor:1}],w=[{value:e.rotation,anchor:0}],y=(e,t,i,r)=>{const s=[];return t.forEach((t=>{const l=i.find((e=>(0,u.isCloseToValue)(t,e.value,2*a))),[d,p]=((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:(0,c.jsx)("line",{x1:d.x,y1:d.y,x2:p.x,y2:p.y,stroke:r||"#D61B5C",strokeDasharray:5*a,strokeWidth:1.2*a,overflow:"overlay"},`${e}-${t}-${d.x}-${d.y}-${p.x}-${p.y}`);void 0!==l&&s.push({type:e,value:t,anchorPoint:l.anchor,svgNode:h,guidelineCoordinates:[d,p]})})),s};return l.push(...y("x",Array.from(d),f,i)),l.push(...y("y",Array.from(p),g,i)),l.push(...y("rotation",h,w,i)),l};let Q;var J;let ee;var te;(J=Q||(Q={})).Translate="Translate",J.Rotate="Rotate",J.Resize="Resize",(te=ee||(ee={})).ControlLeft="ControlLeft",te.ControlRight="ControlRight",te.Equal="Equal",te.MetaLeft="MetaLeft",te.MetaRight="MetaRight",te.Minus="Minus",te.ArrowLeft="ArrowLeft",te.ArrowRight="ArrowRight",te.ArrowUp="ArrowUp",te.ArrowDown="ArrowDown",te.AltLeft="AltLeft",te.AltRight="AltRight",te.Delete="Delete",te.Backspace="Backspace";const ae=(e,a,i,n)=>{const o=()=>{switch(i){case d.UnitOfMeasurement.Pixel:return 1;case d.UnitOfMeasurement.Millimeter:return u.mmPerPixel;case d.UnitOfMeasurement.Centimeter:return u.cmPerPixel;default:throw new Error("Unknown unit of measurement")}};let r=a.x,s=a.y,l=a.x,c=a.y;switch(e){case ee.ArrowLeft:l=a.x-1/o();break;case ee.ArrowUp:c=a.y-1/o();break;case ee.ArrowRight:l=a.x+1/o();break;case ee.ArrowDown:c=a.y+1/o();break;default:throw new Error("Unhandled element interaction!")}const p=(0,u.getAxisAlignedBoundingBox)(l,c,a.width,a.height,a.rotation);return(!n||p.minX>=n.left&&p.maxX<=n.left+n.width&&p.minY>=n.top&&p.maxY<=n.top+n.height)&&(r=l,s=c),new(0,t.MoveCommand)(a.id,r,s)};var ie=0,ne=0,oe=0;const re=(e,a,i,n,o,r,s)=>{const l=((e,t,a,i,n,o,r)=>{const s=i.width/t.width,l=i.height/t.height,c=e.movementX/s,p=e.movementY/l,g=a.rotation*Math.PI/180,w=Math.sin(g),y=Math.cos(g);let S;switch(n.type){case Q.Resize:let t={top:a.y,left:a.x,width:a.width,height:a.height,rotation:a.rotation,fontSize:a.fontSize},v=t;switch(n.screenAxis){case d.ScaleAxis.North:{const e=-c*w+p*y,i=a.y+e,n=a.height-e,o=(0,u.getElementVertices)({...a}).center,r=(0,u.getElementVertices)({...a,y:i,height:n}).center,s=(0,u.rotateAroundPoint)(r,o,g),l=s.x-a.width/2,d=s.y-n/2;v={...t,left:l,top:d,height:n}}break;case d.ScaleAxis.East:{const e=c*y+p*w,i=a.width+e;let n=a.height;if(a.type===h.LayoutElementType.Textbox){const e=a;n=(0,m.calculateTextboxLines)(e.fontSize,e.fontData,e,e.input||e.text||"",e.lineHeight).requiredHeight}const o=(0,u.getElementVertices)({...a}).center,r=(0,u.getElementVertices)({...a,width:i,height:n}).center,s=(0,u.rotateAroundPoint)(r,o,g),l=s.x-i/2,d=s.y-n/2;v={...t,left:l,top:d,width:i,height:n}}break;case d.ScaleAxis.West:{const e=c*y+p*w,i=a.x+e,n=a.width-e;let o=a.height;if(a.type===h.LayoutElementType.Textbox){const e=a;o=(0,m.calculateTextboxLines)(e.fontSize,e.fontData,e,e.input||e.text||"",e.lineHeight).requiredHeight}const r=(0,u.getElementVertices)({...a}).center,s=(0,u.getElementVertices)({...a,width:n,height:o,x:i}).center,l=(0,u.rotateAroundPoint)(s,r,g),d=l.x-n/2,f=l.y-o/2;v={...t,left:d,top:f,width:n,height:o}}break;case d.ScaleAxis.South:{const e=-c*w+p*y,i=a.height+e,n=(0,u.getElementVertices)({...a}).center,o=(0,u.getElementVertices)({...a,height:i}).center,r=(0,u.rotateAroundPoint)(o,n,g),s=r.x-a.width/2,l=r.y-i/2;v={...t,left:s,top:l,height:i}}break;case d.ScaleAxis.Northeast:{const e=c*y+p*w,i=a.width+e;let n=a.height+e,o=a.y-e,r=a.fontSize;if(a.type===h.LayoutElementType.Textbox){const t=a;r=t.fontSize+e/8,n=(0,m.calculateTextboxLines)(r,t.fontData,t,t.input||t.text||"",t.lineHeight).requiredHeight;const i=t.lineHeight||f.defaultLineHeightFactor;o=a.y-e*i/8}const s=(0,u.getElementVertices)({...a}).center,l=(0,u.getElementVertices)({...a,width:i,height:n,y:o}).center,d=(0,u.rotateAroundPoint)(l,s,g),S=d.x-i/2,x=d.y-n/2;v={...t,left:S,top:x,width:i,height:n,fontSize:r}}break;case d.ScaleAxis.Northwest:{const e=-c*y+-p*w,i=a.x-e,n=a.width+e;let o=a.y-e,r=a.height+e,s=a.fontSize;if(a.type===h.LayoutElementType.Textbox){const t=a;s=t.fontSize+e/8,r=(0,m.calculateTextboxLines)(s,t.fontData,t,t.input||t.text||"",t.lineHeight).requiredHeight;const i=t.lineHeight||f.defaultLineHeightFactor;o=a.y-e*i/8}const l=(0,u.getElementVertices)({...a}).center,d=(0,u.getElementVertices)({...a,x:i,y:o,width:n,height:r}).center,S=(0,u.rotateAroundPoint)(d,l,g),x=S.x-n/2,C=S.y-r/2;v={...t,left:x,top:C,width:n,height:r,fontSize:s}}break;case d.ScaleAxis.Southeast:{const e=c*y+p*w,i=a.width+e;let n=a.height+e,o=a.fontSize;if(a.type===h.LayoutElementType.Textbox){const t=a;o=t.fontSize+e/8,n=(0,m.calculateTextboxLines)(o,t.fontData,t,t.input||t.text||"",t.lineHeight).requiredHeight}const r=(0,u.getElementVertices)({...a}).center,s=(0,u.getElementVertices)({...a,width:i,height:n}).center,l=(0,u.rotateAroundPoint)(s,r,g),d=l.x-i/2,f=l.y-n/2;v={...t,left:d,top:f,width:i,height:n,fontSize:o}}break;case d.ScaleAxis.Southwest:{const e=-c*y+-p*w,i=a.width+e;let n=a.x-e,o=a.height+e,r=a.fontSize;if(a.type===h.LayoutElementType.Textbox){const t=a;r=t.fontSize+e/8,o=(0,m.calculateTextboxLines)(r,t.fontData,t,t.input||t.text||"",t.lineHeight).requiredHeight}const s=(0,u.getElementVertices)({...a}).center,l=(0,u.getElementVertices)({...a,width:i,height:o,x:n}).center,d=(0,u.rotateAroundPoint)(l,s,g),f=d.x-i/2,S=d.y-o/2;v={...t,left:f,top:S,width:i,height:o,fontSize:r}}}return S=(0,u.getAxisAlignedBoundingBox)(v.left,v.top,v.width,v.height,v.rotation),(!r||S.minX>=r.left&&S.maxX<=r.left+r.width&&S.minY>=r.top&&S.maxY<=r.top+r.height)&&(t=v),t;case Q.Rotate:const x={x:e.clientX,y:e.clientY};let C,b=a.rotation;const k=(0,u.getElementVertices)(a,i,{x:s,y:l}),E=(0,u.findAngle)(x,k.c,k.d),I=(0,u.findAngle)(x,k.d,k.c);if(0===o.filter((e=>"rotation"===e.type)).length)oe=0,C=(a.rotation+E-I)%360;else{oe+=Math.sqrt(c**2+p**2);const e=Math.abs(oe)>_/s;C=e?(a.rotation+E-I)%360:o.find((e=>"rotation"===e.type))?.value||0,e&&(oe=0)}return S=(0,u.getAxisAlignedBoundingBox)(a.x,a.y,a.width,a.height,C),(!r||S.minX>=r.left&&S.maxX<=r.left+r.width&&S.minY>=r.top&&S.maxY<=r.top+r.height)&&(b=C),{top:a.y,left:a.x,width:a.width,height:a.height,rotation:b};case Q.Translate:let N,R,T=a.x,O=a.y;if(0===o.filter((e=>"rotation"!==e.type)).length)ie=0,ne=0,N=a.x+c,R=a.y+p;else{const e=o.find((e=>"x"===e.type)),t=o.find((e=>"y"===e.type));e||(ie=0),t||(ne=0);const i=Math.abs(ie)>_/s,n=Math.abs(ne)>_/l;N=e?i?a.x+ie:a.x:a.x+c,R=t?n?a.y+ne:a.y:a.y+p,ie=i?0:ie+c,ne=n?0:ne+p}return S=(0,u.getAxisAlignedBoundingBox)(N,R,a.width,a.height,a.rotation),(!r||S.minX>=r.left&&S.maxX<=r.left+r.width&&S.minY>=r.top&&S.maxY<=r.top+r.height)&&(T=N,O=R),{top:O,left:T,width:a.width,height:a.height,rotation:a.rotation}}})(e,a,i,n,o,r,s),c=[];if(i.type===h.LayoutElementType.Textbox){const e=i;c.push(new(0,t.TextChangeCommand)(e.id,e.text||e.input||""))}if(c.push(new(0,t.MoveCommand)(i.id,l.left,l.top),new(0,t.ResizeCommand)(i.id,l.width,l.height),new(0,t.RotateCommand)(i.id,l.rotation)),i.type===h.LayoutElementType.Textbox){const e=i;l.fontSize&&e.fontSize!==l.fontSize&&c.push(new(0,t.FontSizeCommand)(e.id,l.fontSize))}return c},se=()=>{const e=()=>Math.floor(65536*(1+Math.random())).toString(16).substring(1);return e()+e()+"-"+e()+"-"+e()+"-"+e()+"-"+e()+e()+e()},le=.5,ce=(e,a,i,n,o,r,s)=>{const{state:c,uiDispatcher:d}=(0,l.useContext)(G),{getLayoutById:p,getReducerState:h,flattenSequence:u}=j(),[m,f]=(0,l.useState)(void 0),[g,w]=(0,l.useState)(void 0),y=p(c.layoutId);(0,l.useEffect)((()=>{if("adjustment"===o&&e?.current&&n){if(n<le)return void d(new X({zoom:le}));if(n>c.maxZoom)return void d(new X({zoom:c.maxZoom}));d(new X({zoom:n}))}}),[n,d,e,o,c.maxZoom]);const S=(0,l.useCallback)(((e,t)=>{d(new X({zoom:t}));const n=a?.current?.scrollWidth-a?.current?.clientWidth!=0,r=a?.current?.scrollHeight-a?.current?.clientHeight!=0;a.current&&i.current&&!c.scrolledMovement&&"advanced"===o&&(r&&(a.current.scrollTop=i.current.offsetTop+(a.current.scrollHeight-a.current.clientHeight)/2),n&&(a.current.scrollLeft=(i.current.offsetLeft+a.current.scrollWidth-a.current.clientWidth)/2))}),[d,a,i,c.scrolledMovement,o]);(0,l.useEffect)((()=>{c.zoom<=1&&d(new X({scrolledMovement:!1}))}),[d,c.zoom]);const v=a?.current?.getBoundingClientRect(),x=((v?.width||1)+(v?.height||1))/2,C=(y.layoutState.layout.width+y.layoutState.layout.height)/2/x/c.zoom,b=(0,l.useMemo)((()=>{const e=c.activeModifierKeys,t=c.elementEvent,a=e.includes(ee.ControlLeft)||e.includes(ee.MetaLeft)||e.includes(ee.ControlRight)||e.includes(ee.MetaRight);if(!c.selectedElement||!t||a)return[];const i=t&&t.type===Q.Translate,n=t&&t.type===Q.Rotate,o=y.layoutState.elements.find((e=>e.id===c.selectedElement));return(i||n)&&o?Z(o,y.layoutState,C,s):[]}),[c.selectedElement,c.elementEvent,c.activeModifierKeys,y.layoutState,C]),k=(0,l.useCallback)((()=>{const e=se();f(e),w(h().transaction)}),[h]),E=(0,l.useCallback)((()=>{d(new X({selectedElement:void 0}))}),[d]),I=(0,l.useCallback)((()=>{d(new X({scrolledMovement:!0}))}),[d]),N=(0,l.useCallback)(((i,n)=>{const o=y.layoutState.elements.find((e=>e.id===c.selectedElement));if(!(c.elementEvent&&e.current&&a.current&&c.selectedElement&&o))return;a.current.hasPointerCapture(i.pointerId)||a.current.setPointerCapture(i.pointerId);const s=e.current.getBoundingClientRect(),l=new(0,t.GroupCommand)(re(i,y.layoutState.layout,o,s,c.elementEvent,b,n));l.sequenceId=m,r(l)}),[y.layoutState.elements,y.layoutState.layout,c.elementEvent,e,c.selectedElement,a,b,r]),R=(0,l.useCallback)((e=>{d(new X({elementEvent:e}))}),[d]),T=(0,l.useCallback)((()=>{d(new X({elementEvent:void 0})),m&&g&&(u(m,g),f(void 0),w(void 0))}),[d,m,g,u]),O=(0,l.useCallback)(((e,a)=>{let i=c.zoom;const n=c.maxZoom,s=c.selectedElement,l=c.activeModifierKeys;if((l.includes(ee.AltLeft)||l.includes(ee.AltRight))&&(e.code===ee.Equal||e.code===ee.Minus)){const t=.05*n;e.code===ee.Equal?d(new X({zoom:i+t<=n?i+=t:i})):d(new X({zoom:i-t>=le?i-t:i}))}const p=y.layoutState.elements.find((e=>e.id===s));if(s&&p){if(e.code===ee.MetaLeft||e.code===ee.ControlLeft||e.code===ee.MetaRight||e.code===ee.ControlRight){const t=e.code,a=c.activeModifierKeys;if(!a.includes(t))return d(new X({activeModifierKeys:a.concat(t)}))}if(e.code===ee.ArrowDown||e.code===ee.ArrowUp||e.code===ee.ArrowLeft||e.code===ee.ArrowRight){d(new X({elementEvent:{type:Q.Translate}}));const t=ae(e.code,p,c.units,a);r(t),d(new X({elementEvent:void 0}))}e.code!==ee.Delete&&e.code!==ee.Backspace||"advanced"!==o||(d(new X({selectedElement:void 0})),r(new(0,t.DeleteElementCommand)(p.id)))}}),[r,d,y.layoutState.elements,o,c.activeModifierKeys,c.maxZoom,c.selectedElement,c.units,c.zoom]),M=(0,l.useCallback)((e=>{if(e.code===ee.MetaLeft||e.code===ee.ControlLeft||e.code===ee.MetaRight||e.code===ee.ControlRight){const t=c.activeModifierKeys,a=e.code;d(new X({activeModifierKeys:t.filter((e=>e!==a))}))}}),[d,c.activeModifierKeys]);return{guidelines:b,scale:C,zoomableElementRef:i,setElementEvent:R,handleZoom:S,handleKeyDown:O,handleKeyUp:M,handlePointerPressedBackground:E,handlePointerReleased:T,handlePointerMove:N,handleScroll:I,handleSequenceStart:k}},de=e=>{const{x:t,y:a,cursorStyle:i,onPointerDown:n,handleClass:o,cornerRadius:r,color:s,strokeWidth:l}=e;return(0,c.jsx)("circle",{className:o,cx:t,cy:a,r:r,fill:"#ffffff",style:{cursor:i},stroke:s,strokeWidth:l,onPointerDown:n})},pe=e=>{const{x:t,y:a,width:i,height:n,cursorStyle:o,onPointerDown:r,edgeHandleRadius:s,color:l,strokeWidth:d}=e;return(0,c.jsx)("rect",{x:t,y:a,width:i,height:n,rx:s,fill:"#ffffff",style:{cursor:o},stroke:l,strokeWidth:d,onPointerDown:r})},he=e=>{const{color:t,elementHeight:a,elementWidth:i,onBeginResize:n,rotation:o,scaleFactor:r,disableX:s,disableY:p}=e,h=7.5*r,m=3*r,f=28*r,g=6*r,w=1.2*r,y=a-2*h,S=(0,l.useCallback)(((e,t,a)=>{e.stopPropagation(),n(t,a)}),[n]),v=(0,l.useCallback)((e=>S(e,(0,u.currentDirection)(d.ScaleAxis.West,360-o),d.ScaleAxis.West)),[S,o]),x=(0,l.useCallback)((e=>S(e,(0,u.currentDirection)(d.ScaleAxis.East,360-o),d.ScaleAxis.East)),[S,o]),C=(0,l.useCallback)((e=>S(e,(0,u.currentDirection)(d.ScaleAxis.North,360-o),d.ScaleAxis.North)),[S,o]),b=(0,l.useCallback)((e=>S(e,(0,u.currentDirection)(d.ScaleAxis.South,360-o),d.ScaleAxis.South)),[S,o]),k=(0,l.useCallback)((e=>S(e,d.ScaleAxis.Northwest,d.ScaleAxis.Northwest)),[S]),E=(0,l.useCallback)((e=>S(e,d.ScaleAxis.Northeast,d.ScaleAxis.Northeast)),[S]),I=(0,l.useCallback)((e=>S(e,d.ScaleAxis.Southwest,d.ScaleAxis.Southwest)),[S]),N=(0,l.useCallback)((e=>S(e,d.ScaleAxis.Northeast,d.ScaleAxis.Southeast)),[S]),R=f<=y;return(0,c.jsxs)(c.Fragment,{children:[(0,c.jsx)(de,{x:0,y:0,cursorStyle:"nwse-resize",onPointerDown:k,handleClass:"cornerNorthWest",cornerRadius:h,color:t,strokeWidth:w}),R?(0,c.jsx)(de,{x:i,y:0,cursorStyle:"nesw-resize",onPointerDown:E,handleClass:"cornerNorthEast",cornerRadius:h,color:t,strokeWidth:w}):void 0,R?(0,c.jsx)(de,{x:i,y:a,cursorStyle:"nwse-resize",onPointerDown:N,handleClass:"cornerSouthEast",cornerRadius:h,color:t,strokeWidth:w}):void 0,R?(0,c.jsx)(de,{x:0,y:a,cursorStyle:"nesw-resize",onPointerDown:I,handleClass:"cornerSouthWest",cornerRadius:h,color:t,strokeWidth:w}):void 0,R&&!s?(0,c.jsx)(pe,{x:-g/2,y:a/2-f/2,width:g,height:f,onPointerDown:v,edgeHandleRadius:m,cursorStyle:"ew-resize",color:t,strokeWidth:w}):void 0,R&&!p?(0,c.jsx)(pe,{x:i/2-f/2,y:a-g/2,width:f,height:g,onPointerDown:b,edgeHandleRadius:m,cursorStyle:"ns-resize",color:t,strokeWidth:w}):void 0,s?void 0:(0,c.jsx)(pe,{x:i-g/2,y:a/2-Math.min(f,.8*a)/2,width:g,height:Math.min(f,.8*a),onPointerDown:x,edgeHandleRadius:m,cursorStyle:"ew-resize",color:t,strokeWidth:w}),R&&!p?(0,c.jsx)(pe,{x:i/2-f/2,y:-g/2,width:f,height:g,onPointerDown:C,edgeHandleRadius:m,cursorStyle:"ns-resize",color:t,strokeWidth:w}):void 0]})},ue=e=>{const{color:t,elementWidth:a,onBeginRotate:i,scaleFactor:n}=e,o=(0,l.useCallback)((e=>{e.stopPropagation(),i()}),[i]),r=10*n,s=1.2*n;return(0,c.jsxs)("g",{children:[(0,c.jsx)("circle",{cx:a/2,cy:-2.5*r,r:1.3*r,fill:"rgba(0, 0, 0, 0.5)",opacity:.4,style:{cursor:"ew-resize"},onPointerDown:o}),(0,c.jsx)("circle",{cx:a/2,cy:-2.5*r,r:r,fill:"#fff",style:{cursor:"ew-resize"},stroke:t,strokeWidth:s,onPointerDown:o}),(0,c.jsxs)("svg",{x:a/2-r,y:-2.5*r-r,xmlns:"http://www.w3.org/2000/svg",style:{cursor:"ew-resize"},height:2*r,viewBox:"0 0 24 24",width:2*r,fill:t,onPointerDown:o,children:[(0,c.jsx)("path",{d:"M0 0h24v24H0z",fill:"none"}),(0,c.jsx)("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"})]})]})},me=e=>{const{color:t,height:a,highlighted:i,id:n,immutable:o,onBeginMove:r,onBeginResize:s,onBeginRotate:d,onPointerEnter:p,onPointerLeave:h,onSelected:u,pressed:m,rotation:f,scaleFactor:g,selected:w,width:y,x:S,y:v,disableX:x,disableY:C}=e,b=1.2*g,k=(0,l.useCallback)((e=>{2===e.button&&(e.stopPropagation(),u(n,e)),0===e.button&&(e.stopPropagation(),!w&&u(n,e),r())}),[n,w,u,r]),E=(0,l.useCallback)((()=>{p(n)}),[n,p]),I=(0,l.useCallback)((()=>{h(n)}),[n,h]),N=o?void 0:w?m?"grabbing":"grab":"pointer",R=o?"none":"visibleFill";return(0,c.jsxs)("g",{transform:`translate(${S}, ${v}) rotate(${f} ${y/2} ${a/2})`,children:[(0,c.jsx)("rect",{className:"interactableInnerRect",width:y,height:a,stroke:w||i?t:"none",pointerEvents:R,fill:"none",strokeWidth:b,style:{cursor:N},onPointerDown:o?void 0:k,onPointerEnter:o?void 0:E,onPointerLeave:o?void 0:I}),w&&(0,c.jsxs)(c.Fragment,{children:[(0,c.jsx)(ue,{color:t,elementWidth:y,onBeginRotate:d,scaleFactor:g}),(0,c.jsx)(he,{color:t,elementHeight:a,elementWidth:y,rotation:f,scaleFactor:g,onBeginResize:s,disableX:x,disableY:C})]})]})},fe=({primaryColor:e,containerHeight:t,containerWidth:a,customViewbox:i,editorRef:n,elementEvent:o,guidelines:r,layoutHeight:s,layoutWidth:d,targetedElements:p,scale:u,selectedElement:m,onElementEvent:f,onElementSelected:g,onSequenceStart:w})=>{const{state:y}=Y(),{getLayoutById:S}=j(),v=S(y.layoutId),[x,C]=(0,l.useState)(void 0),b=(0,l.useCallback)((e=>{C(e)}),[]),k=(0,l.useCallback)((e=>{x===e&&C(void 0)}),[x]),E=(0,l.useCallback)((()=>{w(),f({type:Q.Translate})}),[f]),I=(0,l.useCallback)(((e,t)=>{w(),f({type:Q.Resize,relativeAxis:e,screenAxis:t})}),[f]),N=(0,l.useCallback)((()=>{w(),f({type:Q.Rotate})}),[f]),R=i||{x:0,y:0,width:d,height:s},T=u*(Math.sqrt(R.width*R.height)/1e3)*(100/Math.sqrt(t*a))*Math.sqrt((O=a/t,Math.exp(Math.abs(Math.log(O)))));var O;const M=v.layoutState.elements.findIndex((({id:e})=>e===m)),A=[...v.layoutState.elements];return M>=0&&A.push(A.splice(M,1)[0]),(0,c.jsxs)("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:`${R.x} ${R.y} ${R.width} ${R.height}`,overflow:"overlay",children:[(0,c.jsx)("rect",{fill:"none",stroke:"none",ref:n,width:d,height:s}),r.map((e=>e.svgNode)),A.map((t=>{const a=void 0!==m&&t.id===m,i=a&&void 0!==o,n=void 0!==x&&t.id===x;return(0,c.jsx)(me,{color:e,id:t.id,selected:a,highlighted:n,pressed:i,x:t.x,y:t.y,disableX:t.type===h.LayoutElementType.Frame,disableY:t.type===h.LayoutElementType.Textbox||t.type===h.LayoutElementType.Frame,width:t.width,height:t.height,rotation:t.rotation,immutable:t.immutable||p&&!p.includes(t.id),onSelected:g,onBeginMove:E,onBeginResize:I,onBeginRotate:N,onPointerEnter:b,onPointerLeave:k,scaleFactor:T},t.id)}))]})},ge=e=>{const{color:t,editorRef:a,zoomableElementRef:i,interactionElementRef:n,guidelines:o,isMakingAdjustments:r,viewmask:s,visibleLayoutId:d,xTranslation:p,yTranslation:h,targetedElements:u,borderRadius:m,handleContextMenu:f,handleKeyDown:g,handleKeyUp:w,handlePointerMove:y,handlePointerPressedBackground:S,handlePointerReleased:v,handleScroll:x,onSequenceStart:C,setElementEvent:b,onElementSelected:k}=e,{getLayoutById:E}=j(),I=E(d),N=I.layoutState,{state:R}=Y(),T=(0,l.useCallback)((e=>{if(s){const t={left:s.x,top:s.y,width:s.width,height:s.height,panelId:"",rotation:0};return g(e,t)}return g(e)}),[g,s]),O=(0,l.useCallback)((e=>{if(s){const t={left:s.x,top:s.y,width:s.width,height:s.height,panelId:"",rotation:0};return y(e,t)}return y(e)}),[y,s]);return(0,c.jsx)("div",{style:{justifyContent:"center",position:"relative",height:"100%",width:"100%",scrollbarWidth:"none",outline:"none"},onContextMenu:f,onKeyDown:T,onKeyUp:w,onPointerDown:S,onPointerMoveCapture:O,onPointerUp:v,onWheelCapture:x,ref:n,tabIndex:-1,children:(0,c.jsxs)("div",{ref:i,style:{height:"100%",transform:`scale(${R.zoom}) translate(${p}px, ${h}px)`,display:"grid",filter:"drop-shadow(rgba(0, 0, 0, 0.2) 0px 0px 6px)"},children:[e.children,I.getComponentWithProps({height:r?"100%":"auto",maxHeight:"100%",maxWidth:"100%",position:"absolute",viewmask:s,width:r?"100%":"auto",borderRadius:m}),(0,c.jsx)(fe,{primaryColor:t,containerHeight:i.current?.offsetHeight||1024,containerWidth:i.current?.offsetWidth||1024,editorRef:a,elementEvent:R.elementEvent,guidelines:o,layoutHeight:N.layout.height,layoutWidth:N.layout.width,onElementEvent:b,onSequenceStart:C,onElementSelected:k,scale:10/R.zoom,selectedElement:R.selectedElement,targetedElements:u})]})})},we=({color:e,borderRadius:a,guidelineColor:i,handleContextMenu:n,onElementSelected:o})=>{const{commandDispatcher:r,getLayoutById:s}=j(),{state:d,uiDispatcher:p}=Y(),u=(0,l.useRef)(null),m=(0,l.useRef)(null),f=(0,l.useRef)(null),{guidelines:g,handleKeyDown:w,handleKeyUp:y,handlePointerMove:S,handlePointerPressedBackground:v,handlePointerReleased:x,handleScroll:C,handleSequenceStart:b,setElementEvent:k}=ce(u,m,f,void 0,"advanced",r,i),E=(0,l.useCallback)(((e,a)=>{const i=s(d.layoutId).layoutState.elements.find((t=>t.id===e));if(e&&i&&i.type===h.LayoutElementType.Textbox){const a=i.algorithm;(!a||a===h.TextAlgorithm.Autosize)&&r(new(0,t.FontAlgorithmCommand)(e,h.TextAlgorithm.Traditional))}o&&o(e,a),p(new X({selectedElement:e}))}),[r,s,d.layoutId,p]);return(0,c.jsx)(ge,{color:e,editorRef:u,interactionElementRef:m,zoomableElementRef:f,guidelines:g,visibleLayoutId:d.layoutId,xTranslation:0,yTranslation:0,borderRadius:a,handleContextMenu:n,handleKeyDown:w,handleKeyUp:y,handlePointerMove:S,handlePointerPressedBackground:v,handlePointerReleased:x,handleScroll:C,onSequenceStart:b,setElementEvent:k,onElementSelected:E})};const ye=new class{cache=new Map;materialCache=new Map;constructor(){this.server=F}async getLocalOrFromServer(e){if(this.cache.has(e))return this.cache.get(e);const t=(async()=>(await F.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 F.execute("getMaterialV2",{id:e})).body)();return this.materialCache.set(e,t),t}async uploadAssetWithProgress(e,t,a,i,n,o){const r=await this.dispatchCreateAssetRequest(e,t,n,o);var s=new XMLHttpRequest;return s.open("PUT",r.assetResponse.uploadUrl,!0),s.setRequestHeader("Content-Type",r.mimeType),s.setRequestHeader("Cache-Control","public,max-age=31536000,immutable"),s.upload.onprogress=e=>{e.lengthComputable&&a(100*e.loaded/e.total)},s.onload=()=>{const e=r.assetResponse.asset;i(e)},s.onerror=()=>{console.warn("Asset upload failed")},s.send(e.blob),r.assetResponse.asset}loadImageAsFileInfo=async e=>{const t=await e.arrayBuffer(),a=await(0,g.getAttributesFromArrayBuffer)(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 Se{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 ve{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 xe=(()=>{try{return localStorage?new Se:new ve}catch{return console.warn("Local storage was unavilable due to browser security settings. Using in-memory storage instead."),new ve}})(),Ce=n.gql`
1
+ var e=require("papyrus/build/main/CommandContext"),t=require("papyrus/build/main/command"),a=(require("papyrus/build/main/Elements/factory"),require("spiff-preview"),require("papyrus/build/main/font")),i=require("swagger-client"),n=require("@apollo/client"),o=require("@apollo/client/link/context"),r=require("@apollo/client/link/error"),s=require("cross-fetch"),l=require("react"),c=require("react/jsx-runtime"),d=require("papyrus/build/main/types"),p=require("lodash.isequal"),h=require("papyrus/build/main/LayoutsState/types"),u=require("papyrus/build/main/math"),m=require("papyrus/build/main/text/algorithm/traditional"),f=require("papyrus/build/main/text/shared"),g=require("papyrus/build/main/image"),w=require("canvg"),y=require("papyrus/build/main/generation/Workflow"),S=require("lodash.clonedeep"),v=require("papyrus/build/main/module/resolver"),x=require("lodash.debounce"),C=require("papyrus/build/main/frame"),b=require("papyrus/build/main/illustration"),k=require("papyrus/build/main/LayoutsState"),E=require("qrcode"),I=require("papyrus/build/main/crossplatform"),N=require("react-dom/server"),R=require("papyrus/build/main/Elements/Patchwork"),T=require("papyrus/build/main/text/algorithm/autosize"),O=require("papyrus/build/main/generation");function M(e,t,a,i){Object.defineProperty(e,t,{get:a,set:i,enumerable:!0,configurable:!0})}function A(e){return e&&e.__esModule?e.default:e}M(module.exports,"Client",(()=>bt)),M(module.exports,"CommandContext",(()=>$eb7869949b641a40$re_export$CommandContext)),M(module.exports,"spiffCoreConfiguration",(()=>D)),M(module.exports,"PromiseQueue",(()=>je)),M(module.exports,"QueueablePromise",(()=>qe)),M(module.exports,"assetService",(()=>ye)),M(module.exports,"optionService",(()=>L)),M(module.exports,"server",(()=>F)),M(module.exports,"persistenceService",(()=>xe)),M(module.exports,"graphQlManager",(()=>U)),M(module.exports,"toast",(()=>rt)),M(module.exports,"FrameService",(()=>Be)),M(module.exports,"frameStepService",(()=>Ze)),M(module.exports,"modelStepService",(()=>Je)),M(module.exports,"materialStepService",(()=>Qe)),M(module.exports,"patchworkStepService",(()=>it)),M(module.exports,"questionStepService",(()=>Oe)),M(module.exports,"pictureStepService",(()=>nt)),M(module.exports,"textStepService",(()=>ct)),M(module.exports,"illustrationStepService",(()=>Ge)),M(module.exports,"svgObjectURL",(()=>Ke)),M(module.exports,"generate",(()=>se)),M(module.exports,"CreateElementCommand",(()=>$eb7869949b641a40$re_export$CreateElementCommand)),M(module.exports,"TextChangeCommand",(()=>$eb7869949b641a40$re_export$TextChangeCommand)),M(module.exports,"FontAlignmentCommand",(()=>$eb7869949b641a40$re_export$FontAlignmentCommand)),M(module.exports,"FontColorCommand",(()=>$eb7869949b641a40$re_export$FontColorCommand)),M(module.exports,"LayoutElementFactory",(()=>$eb7869949b641a40$re_export$LayoutElementFactory)),M(module.exports,"minZoom",(()=>le)),M(module.exports,"AdvancedEditor",(()=>we)),M(module.exports,"EditorCore",(()=>ge)),M(module.exports,"useLayouts",(()=>j)),M(module.exports,"useEditorState",(()=>Y)),M(module.exports,"useEditorInteraction",(()=>ce)),M(module.exports,"commandReducer",(()=>K)),M(module.exports,"getDefaultState",(()=>B)),M(module.exports,"CommandContextContext",(()=>q)),M(module.exports,"AdvancedEditorStateProvider",(()=>H)),M(module.exports,"AdvancedEditorContext",(()=>G)),M(module.exports,"UICommand",(()=>X)),M(module.exports,"SpiffCommerce3DPreviewService",(()=>$eb7869949b641a40$re_export$SpiffCommerce3DPreviewService));const L=new class{cache=new Map;async cacheRequiredOptions(e){const t=e.steps.map((e=>e.optionId)).filter((e=>void 0!==e)),i=e.steps.map((e=>e.data.colourOptionId)).filter((e=>void 0!==e)),n=[...new Set([...t,...i])].map((async e=>{const t=await L.getLocalOrFromServer(F,e);"Font"===t.data.type&&t.data.variants.forEach((async e=>{if(e.assetKey){const t=(await ye.getLocalOrFromServer(e.assetKey)).links.find((e=>"cdn"===e.rel))?.href;t&&await(0,a.loadFontFromExternalUrl)(t)}}))}));await Promise.allSettled([...n])}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 ye.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 ye.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 D=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 P;const z=e=>{P=e},V=async()=>({transactionOwnerId:P});const F=new class{uncachedOperations=[];constructor(){D.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 V();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 V(),t=D.getServerUrl()+"/v2/api-docs";return await A(i)(t,{authorizations:{OAuth2:{token:{access_token:e.bearer,token_type:"Bearer"}},PartnerId:e.partnerId}})}};const U=new class{constructor(){this.shadowGraphqlClient=this.constructShadowGraphqlClient(),D.addServerUrlCallback((()=>{this.shadowGraphqlClient=this.constructShadowGraphqlClient()}))}getShadowGraphqlClient(){return this.shadowGraphqlClient}constructShadowGraphqlClient(){const e=(0,n.createHttpLink)({uri:`${D.getServerUrl()}/graphql`,fetch:A(s)}),t=(0,o.setContext)((async(e,{headers:t})=>{const a=t||{},i=await V();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=(0,r.onError)((({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(0,n.InMemoryCache)({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(0,n.ApolloClient)({link:(0,n.from)([a,t,e]),cache:i,name:"Core"})}},q=(0,l.createContext)(new(0,e.CommandContext)),j=()=>{const e=(0,l.useContext)(q);(0,l.useEffect)((()=>{e.registerStateCallback((()=>{a(new Date)}))}),[e]);const[t,a]=(0,l.useState)(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 W;var $;($=W||(W={})).None="None",$.FrameAdjustment="FrameAdjustment",$.FinalizeDesign="FinalizeDesign";const B=(e,t)=>({layoutId:e()[0].layoutState.layout.id,selectedElement:void 0,zoom:t,maxZoom:5,units:d.UnitOfMeasurement.Pixel,subMenu:W.None,activeModifierKeys:[],metaPressed:!1,elementEvent:void 0,scrolledMovement:!1}),K=(e,t)=>A(p)(e,t.apply(e))?e:t.apply(e),G=(0,l.createContext)({}),H=e=>{const{getAllLayouts:t}=j(),[a,i]=(0,l.useReducer)(K,B(t,e.defaultZoom||1)),n=(0,l.useMemo)((()=>({state:a,uiDispatcher:i})),[a,i]);return(0,c.jsx)(G.Provider,{value:n,children:e.children})};class X{constructor(e){this.changes=e}apply(e){return{...e,...this.changes}}}const Y=()=>(0,l.useContext)(G),_=7*window.devicePixelRatio,Z=(e,t,a,i)=>{const n=t.layout.width,o=t.layout.height,r=t.elements.filter((t=>t.id!==e.id&&!t.immutable&&!t.productOverlay)),s=r.map((e=>(0,u.getAxisAlignedBoundingBox)(e.x,e.y,e.width,e.height,e.rotation))),l=[],d=new Set;s.forEach((e=>d.add(e.minX))),s.forEach((e=>d.add(e.maxX))),[0,n/2,n].forEach((e=>d.add(e)));const p=new Set;s.forEach((e=>p.add(e.minY))),s.forEach((e=>p.add(e.maxY))),[0,o/2,o].forEach((e=>p.add(e)));const h=r.map((e=>e.y));for(let e=-315;e<=315;e+=45)h.push(e);const m=(0,u.getAxisAlignedBoundingBox)(e.x,e.y,e.width,e.height,e.rotation),f=[{value:m.minX,anchor:-1},{value:m.minX+(m.maxX-m.minX)/2,anchor:0},{value:m.minX+(m.maxX-m.minX),anchor:1}],g=[{value:m.minY,anchor:-1},{value:m.minY+(m.maxY-m.minY)/2,anchor:0},{value:m.minY+(m.maxY-m.minY),anchor:1}],w=[{value:e.rotation,anchor:0}],y=(e,t,i,r)=>{const s=[];return t.forEach((t=>{const l=i.find((e=>(0,u.isCloseToValue)(t,e.value,2*a))),[d,p]=((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:(0,c.jsx)("line",{x1:d.x,y1:d.y,x2:p.x,y2:p.y,stroke:r||"#D61B5C",strokeDasharray:5*a,strokeWidth:1.2*a,overflow:"overlay"},`${e}-${t}-${d.x}-${d.y}-${p.x}-${p.y}`);void 0!==l&&s.push({type:e,value:t,anchorPoint:l.anchor,svgNode:h,guidelineCoordinates:[d,p]})})),s};return l.push(...y("x",Array.from(d),f,i)),l.push(...y("y",Array.from(p),g,i)),l.push(...y("rotation",h,w,i)),l};let Q;var J;let ee;var te;(J=Q||(Q={})).Translate="Translate",J.Rotate="Rotate",J.Resize="Resize",(te=ee||(ee={})).ControlLeft="ControlLeft",te.ControlRight="ControlRight",te.Equal="Equal",te.MetaLeft="MetaLeft",te.MetaRight="MetaRight",te.Minus="Minus",te.ArrowLeft="ArrowLeft",te.ArrowRight="ArrowRight",te.ArrowUp="ArrowUp",te.ArrowDown="ArrowDown",te.AltLeft="AltLeft",te.AltRight="AltRight",te.Delete="Delete",te.Backspace="Backspace";const ae=(e,a,i,n)=>{const o=()=>{switch(i){case d.UnitOfMeasurement.Pixel:return 1;case d.UnitOfMeasurement.Millimeter:return u.mmPerPixel;case d.UnitOfMeasurement.Centimeter:return u.cmPerPixel;default:throw new Error("Unknown unit of measurement")}};let r=a.x,s=a.y,l=a.x,c=a.y;switch(e){case ee.ArrowLeft:l=a.x-1/o();break;case ee.ArrowUp:c=a.y-1/o();break;case ee.ArrowRight:l=a.x+1/o();break;case ee.ArrowDown:c=a.y+1/o();break;default:throw new Error("Unhandled element interaction!")}const p=(0,u.getAxisAlignedBoundingBox)(l,c,a.width,a.height,a.rotation);return(!n||p.minX>=n.left&&p.maxX<=n.left+n.width&&p.minY>=n.top&&p.maxY<=n.top+n.height)&&(r=l,s=c),new(0,t.MoveCommand)(a.id,r,s)};var ie=0,ne=0,oe=0;const re=(e,a,i,n,o,r,s)=>{const l=((e,t,a,i,n,o,r)=>{const s=i.width/t.width,l=i.height/t.height,c=e.movementX/s,p=e.movementY/l,g=a.rotation*Math.PI/180,w=Math.sin(g),y=Math.cos(g);let S;switch(n.type){case Q.Resize:let t={top:a.y,left:a.x,width:a.width,height:a.height,rotation:a.rotation,fontSize:a.fontSize},v=t;switch(n.screenAxis){case d.ScaleAxis.North:{const e=-c*w+p*y,i=a.y+e,n=a.height-e,o=(0,u.getElementVertices)({...a}).center,r=(0,u.getElementVertices)({...a,y:i,height:n}).center,s=(0,u.rotateAroundPoint)(r,o,g),l=s.x-a.width/2,d=s.y-n/2;v={...t,left:l,top:d,height:n}}break;case d.ScaleAxis.East:{const e=c*y+p*w,i=a.width+e;let n=a.height;if(a.type===h.LayoutElementType.Textbox){const e=a;n=(0,m.calculateTextboxLines)(e.fontSize,e.fontData,e,e.input||e.text||"",e.lineHeight).requiredHeight}const o=(0,u.getElementVertices)({...a}).center,r=(0,u.getElementVertices)({...a,width:i,height:n}).center,s=(0,u.rotateAroundPoint)(r,o,g),l=s.x-i/2,d=s.y-n/2;v={...t,left:l,top:d,width:i,height:n}}break;case d.ScaleAxis.West:{const e=c*y+p*w,i=a.x+e,n=a.width-e;let o=a.height;if(a.type===h.LayoutElementType.Textbox){const e=a;o=(0,m.calculateTextboxLines)(e.fontSize,e.fontData,e,e.input||e.text||"",e.lineHeight).requiredHeight}const r=(0,u.getElementVertices)({...a}).center,s=(0,u.getElementVertices)({...a,width:n,height:o,x:i}).center,l=(0,u.rotateAroundPoint)(s,r,g),d=l.x-n/2,f=l.y-o/2;v={...t,left:d,top:f,width:n,height:o}}break;case d.ScaleAxis.South:{const e=-c*w+p*y,i=a.height+e,n=(0,u.getElementVertices)({...a}).center,o=(0,u.getElementVertices)({...a,height:i}).center,r=(0,u.rotateAroundPoint)(o,n,g),s=r.x-a.width/2,l=r.y-i/2;v={...t,left:s,top:l,height:i}}break;case d.ScaleAxis.Northeast:{const e=c*y+p*w,i=a.width+e;let n=a.height+e,o=a.y-e,r=a.fontSize;if(a.type===h.LayoutElementType.Textbox){const t=a;r=t.fontSize+e/8,n=(0,m.calculateTextboxLines)(r,t.fontData,t,t.input||t.text||"",t.lineHeight).requiredHeight;const i=t.lineHeight||f.defaultLineHeightFactor;o=a.y-e*i/8}const s=(0,u.getElementVertices)({...a}).center,l=(0,u.getElementVertices)({...a,width:i,height:n,y:o}).center,d=(0,u.rotateAroundPoint)(l,s,g),S=d.x-i/2,x=d.y-n/2;v={...t,left:S,top:x,width:i,height:n,fontSize:r}}break;case d.ScaleAxis.Northwest:{const e=-c*y+-p*w,i=a.x-e,n=a.width+e;let o=a.y-e,r=a.height+e,s=a.fontSize;if(a.type===h.LayoutElementType.Textbox){const t=a;s=t.fontSize+e/8,r=(0,m.calculateTextboxLines)(s,t.fontData,t,t.input||t.text||"",t.lineHeight).requiredHeight;const i=t.lineHeight||f.defaultLineHeightFactor;o=a.y-e*i/8}const l=(0,u.getElementVertices)({...a}).center,d=(0,u.getElementVertices)({...a,x:i,y:o,width:n,height:r}).center,S=(0,u.rotateAroundPoint)(d,l,g),x=S.x-n/2,C=S.y-r/2;v={...t,left:x,top:C,width:n,height:r,fontSize:s}}break;case d.ScaleAxis.Southeast:{const e=c*y+p*w,i=a.width+e;let n=a.height+e,o=a.fontSize;if(a.type===h.LayoutElementType.Textbox){const t=a;o=t.fontSize+e/8,n=(0,m.calculateTextboxLines)(o,t.fontData,t,t.input||t.text||"",t.lineHeight).requiredHeight}const r=(0,u.getElementVertices)({...a}).center,s=(0,u.getElementVertices)({...a,width:i,height:n}).center,l=(0,u.rotateAroundPoint)(s,r,g),d=l.x-i/2,f=l.y-n/2;v={...t,left:d,top:f,width:i,height:n,fontSize:o}}break;case d.ScaleAxis.Southwest:{const e=-c*y+-p*w,i=a.width+e;let n=a.x-e,o=a.height+e,r=a.fontSize;if(a.type===h.LayoutElementType.Textbox){const t=a;r=t.fontSize+e/8,o=(0,m.calculateTextboxLines)(r,t.fontData,t,t.input||t.text||"",t.lineHeight).requiredHeight}const s=(0,u.getElementVertices)({...a}).center,l=(0,u.getElementVertices)({...a,width:i,height:o,x:n}).center,d=(0,u.rotateAroundPoint)(l,s,g),f=d.x-i/2,S=d.y-o/2;v={...t,left:f,top:S,width:i,height:o,fontSize:r}}}return S=(0,u.getAxisAlignedBoundingBox)(v.left,v.top,v.width,v.height,v.rotation),(!r||S.minX>=r.left&&S.maxX<=r.left+r.width&&S.minY>=r.top&&S.maxY<=r.top+r.height)&&(t=v),t;case Q.Rotate:const x={x:e.clientX,y:e.clientY};let C,b=a.rotation;const k=(0,u.getElementVertices)(a,i,{x:s,y:l}),E=(0,u.findAngle)(x,k.c,k.d),I=(0,u.findAngle)(x,k.d,k.c);if(0===o.filter((e=>"rotation"===e.type)).length)oe=0,C=(a.rotation+E-I)%360;else{oe+=Math.sqrt(c**2+p**2);const e=Math.abs(oe)>_/s;C=e?(a.rotation+E-I)%360:o.find((e=>"rotation"===e.type))?.value||0,e&&(oe=0)}return S=(0,u.getAxisAlignedBoundingBox)(a.x,a.y,a.width,a.height,C),(!r||S.minX>=r.left&&S.maxX<=r.left+r.width&&S.minY>=r.top&&S.maxY<=r.top+r.height)&&(b=C),{top:a.y,left:a.x,width:a.width,height:a.height,rotation:b};case Q.Translate:let N,R,T=a.x,O=a.y;if(0===o.filter((e=>"rotation"!==e.type)).length)ie=0,ne=0,N=a.x+c,R=a.y+p;else{const e=o.find((e=>"x"===e.type)),t=o.find((e=>"y"===e.type));e||(ie=0),t||(ne=0);const i=Math.abs(ie)>_/s,n=Math.abs(ne)>_/l;N=e?i?a.x+ie:a.x:a.x+c,R=t?n?a.y+ne:a.y:a.y+p,ie=i?0:ie+c,ne=n?0:ne+p}return S=(0,u.getAxisAlignedBoundingBox)(N,R,a.width,a.height,a.rotation),(!r||S.minX>=r.left&&S.maxX<=r.left+r.width&&S.minY>=r.top&&S.maxY<=r.top+r.height)&&(T=N,O=R),{top:O,left:T,width:a.width,height:a.height,rotation:a.rotation}}})(e,a,i,n,o,r,s),c=[];if(i.type===h.LayoutElementType.Textbox){const e=i;c.push(new(0,t.TextChangeCommand)(e.id,e.text||e.input||""))}if(c.push(new(0,t.MoveCommand)(i.id,l.left,l.top),new(0,t.ResizeCommand)(i.id,l.width,l.height),new(0,t.RotateCommand)(i.id,l.rotation)),i.type===h.LayoutElementType.Textbox){const e=i;l.fontSize&&e.fontSize!==l.fontSize&&c.push(new(0,t.FontSizeCommand)(e.id,l.fontSize))}return c},se=()=>{const e=()=>Math.floor(65536*(1+Math.random())).toString(16).substring(1);return e()+e()+"-"+e()+"-"+e()+"-"+e()+"-"+e()+e()+e()},le=.5,ce=(e,a,i,n,o,r,s)=>{const{state:c,uiDispatcher:d}=(0,l.useContext)(G),{getLayoutById:p,getReducerState:h,flattenSequence:u}=j(),[m,f]=(0,l.useState)(void 0),[g,w]=(0,l.useState)(void 0),y=p(c.layoutId);(0,l.useEffect)((()=>{if("adjustment"===o&&e?.current&&n){if(n<le)return void d(new X({zoom:le}));if(n>c.maxZoom)return void d(new X({zoom:c.maxZoom}));d(new X({zoom:n}))}}),[n,d,e,o,c.maxZoom]);const S=(0,l.useCallback)(((e,t)=>{d(new X({zoom:t}));const n=a?.current?.scrollWidth-a?.current?.clientWidth!=0,r=a?.current?.scrollHeight-a?.current?.clientHeight!=0;a.current&&i.current&&!c.scrolledMovement&&"advanced"===o&&(r&&(a.current.scrollTop=i.current.offsetTop+(a.current.scrollHeight-a.current.clientHeight)/2),n&&(a.current.scrollLeft=(i.current.offsetLeft+a.current.scrollWidth-a.current.clientWidth)/2))}),[d,a,i,c.scrolledMovement,o]);(0,l.useEffect)((()=>{c.zoom<=1&&d(new X({scrolledMovement:!1}))}),[d,c.zoom]);const v=a?.current?.getBoundingClientRect(),x=((v?.width||1)+(v?.height||1))/2,C=(y.layoutState.layout.width+y.layoutState.layout.height)/2/x/c.zoom,b=(0,l.useMemo)((()=>{const e=c.activeModifierKeys,t=c.elementEvent,a=e.includes(ee.ControlLeft)||e.includes(ee.MetaLeft)||e.includes(ee.ControlRight)||e.includes(ee.MetaRight);if(!c.selectedElement||!t||a)return[];const i=t&&t.type===Q.Translate,n=t&&t.type===Q.Rotate,o=y.layoutState.elements.find((e=>e.id===c.selectedElement));return(i||n)&&o?Z(o,y.layoutState,C,s):[]}),[c.selectedElement,c.elementEvent,c.activeModifierKeys,y.layoutState,C]),k=(0,l.useCallback)((()=>{const e=se();f(e),w(h().transaction)}),[h]),E=(0,l.useCallback)((()=>{d(new X({selectedElement:void 0}))}),[d]),I=(0,l.useCallback)((()=>{d(new X({scrolledMovement:!0}))}),[d]),N=(0,l.useCallback)(((i,n)=>{const o=y.layoutState.elements.find((e=>e.id===c.selectedElement));if(!(c.elementEvent&&e.current&&a.current&&c.selectedElement&&o))return;a.current.hasPointerCapture(i.pointerId)||a.current.setPointerCapture(i.pointerId);const s=e.current.getBoundingClientRect(),l=new(0,t.GroupCommand)(re(i,y.layoutState.layout,o,s,c.elementEvent,b,n));l.sequenceId=m,r(l)}),[y.layoutState.elements,y.layoutState.layout,c.elementEvent,e,c.selectedElement,a,b,r]),R=(0,l.useCallback)((e=>{d(new X({elementEvent:e}))}),[d]),T=(0,l.useCallback)((()=>{d(new X({elementEvent:void 0})),m&&g&&(u(m,g),f(void 0),w(void 0))}),[d,m,g,u]),O=(0,l.useCallback)(((e,a)=>{let i=c.zoom;const n=c.maxZoom,s=c.selectedElement,l=c.activeModifierKeys;if((l.includes(ee.AltLeft)||l.includes(ee.AltRight))&&(e.code===ee.Equal||e.code===ee.Minus)){const t=.05*n;e.code===ee.Equal?d(new X({zoom:i+t<=n?i+=t:i})):d(new X({zoom:i-t>=le?i-t:i}))}const p=y.layoutState.elements.find((e=>e.id===s));if(s&&p){if(e.code===ee.MetaLeft||e.code===ee.ControlLeft||e.code===ee.MetaRight||e.code===ee.ControlRight){const t=e.code,a=c.activeModifierKeys;if(!a.includes(t))return d(new X({activeModifierKeys:a.concat(t)}))}if(e.code===ee.ArrowDown||e.code===ee.ArrowUp||e.code===ee.ArrowLeft||e.code===ee.ArrowRight){d(new X({elementEvent:{type:Q.Translate}}));const t=ae(e.code,p,c.units,a);r(t),d(new X({elementEvent:void 0}))}e.code!==ee.Delete&&e.code!==ee.Backspace||"advanced"!==o||(d(new X({selectedElement:void 0})),r(new(0,t.DeleteElementCommand)(p.id)))}}),[r,d,y.layoutState.elements,o,c.activeModifierKeys,c.maxZoom,c.selectedElement,c.units,c.zoom]),M=(0,l.useCallback)((e=>{if(e.code===ee.MetaLeft||e.code===ee.ControlLeft||e.code===ee.MetaRight||e.code===ee.ControlRight){const t=c.activeModifierKeys,a=e.code;d(new X({activeModifierKeys:t.filter((e=>e!==a))}))}}),[d,c.activeModifierKeys]);return{guidelines:b,scale:C,zoomableElementRef:i,setElementEvent:R,handleZoom:S,handleKeyDown:O,handleKeyUp:M,handlePointerPressedBackground:E,handlePointerReleased:T,handlePointerMove:N,handleScroll:I,handleSequenceStart:k}},de=e=>{const{x:t,y:a,cursorStyle:i,onPointerDown:n,handleClass:o,cornerRadius:r,color:s,strokeWidth:l}=e;return(0,c.jsx)("circle",{className:o,cx:t,cy:a,r:r,fill:"#ffffff",style:{cursor:i},stroke:s,strokeWidth:l,onPointerDown:n})},pe=e=>{const{x:t,y:a,width:i,height:n,cursorStyle:o,onPointerDown:r,edgeHandleRadius:s,color:l,strokeWidth:d}=e;return(0,c.jsx)("rect",{x:t,y:a,width:i,height:n,rx:s,fill:"#ffffff",style:{cursor:o},stroke:l,strokeWidth:d,onPointerDown:r})},he=e=>{const{color:t,elementHeight:a,elementWidth:i,onBeginResize:n,rotation:o,scaleFactor:r,disableX:s,disableY:p}=e,h=7.5*r,m=3*r,f=28*r,g=6*r,w=1.2*r,y=a-2*h,S=(0,l.useCallback)(((e,t,a)=>{e.stopPropagation(),n(t,a)}),[n]),v=(0,l.useCallback)((e=>S(e,(0,u.currentDirection)(d.ScaleAxis.West,360-o),d.ScaleAxis.West)),[S,o]),x=(0,l.useCallback)((e=>S(e,(0,u.currentDirection)(d.ScaleAxis.East,360-o),d.ScaleAxis.East)),[S,o]),C=(0,l.useCallback)((e=>S(e,(0,u.currentDirection)(d.ScaleAxis.North,360-o),d.ScaleAxis.North)),[S,o]),b=(0,l.useCallback)((e=>S(e,(0,u.currentDirection)(d.ScaleAxis.South,360-o),d.ScaleAxis.South)),[S,o]),k=(0,l.useCallback)((e=>S(e,d.ScaleAxis.Northwest,d.ScaleAxis.Northwest)),[S]),E=(0,l.useCallback)((e=>S(e,d.ScaleAxis.Northeast,d.ScaleAxis.Northeast)),[S]),I=(0,l.useCallback)((e=>S(e,d.ScaleAxis.Southwest,d.ScaleAxis.Southwest)),[S]),N=(0,l.useCallback)((e=>S(e,d.ScaleAxis.Northeast,d.ScaleAxis.Southeast)),[S]),R=f<=y;return(0,c.jsxs)(c.Fragment,{children:[(0,c.jsx)(de,{x:0,y:0,cursorStyle:"nwse-resize",onPointerDown:k,handleClass:"cornerNorthWest",cornerRadius:h,color:t,strokeWidth:w}),R?(0,c.jsx)(de,{x:i,y:0,cursorStyle:"nesw-resize",onPointerDown:E,handleClass:"cornerNorthEast",cornerRadius:h,color:t,strokeWidth:w}):void 0,R?(0,c.jsx)(de,{x:i,y:a,cursorStyle:"nwse-resize",onPointerDown:N,handleClass:"cornerSouthEast",cornerRadius:h,color:t,strokeWidth:w}):void 0,R?(0,c.jsx)(de,{x:0,y:a,cursorStyle:"nesw-resize",onPointerDown:I,handleClass:"cornerSouthWest",cornerRadius:h,color:t,strokeWidth:w}):void 0,R&&!s?(0,c.jsx)(pe,{x:-g/2,y:a/2-f/2,width:g,height:f,onPointerDown:v,edgeHandleRadius:m,cursorStyle:"ew-resize",color:t,strokeWidth:w}):void 0,R&&!p?(0,c.jsx)(pe,{x:i/2-f/2,y:a-g/2,width:f,height:g,onPointerDown:b,edgeHandleRadius:m,cursorStyle:"ns-resize",color:t,strokeWidth:w}):void 0,s?void 0:(0,c.jsx)(pe,{x:i-g/2,y:a/2-Math.min(f,.8*a)/2,width:g,height:Math.min(f,.8*a),onPointerDown:x,edgeHandleRadius:m,cursorStyle:"ew-resize",color:t,strokeWidth:w}),R&&!p?(0,c.jsx)(pe,{x:i/2-f/2,y:-g/2,width:f,height:g,onPointerDown:C,edgeHandleRadius:m,cursorStyle:"ns-resize",color:t,strokeWidth:w}):void 0]})},ue=e=>{const{color:t,elementWidth:a,onBeginRotate:i,scaleFactor:n}=e,o=(0,l.useCallback)((e=>{e.stopPropagation(),i()}),[i]),r=10*n,s=1.2*n;return(0,c.jsxs)("g",{children:[(0,c.jsx)("circle",{cx:a/2,cy:-2.5*r,r:1.3*r,fill:"rgba(0, 0, 0, 0.5)",opacity:.4,style:{cursor:"ew-resize"},onPointerDown:o}),(0,c.jsx)("circle",{cx:a/2,cy:-2.5*r,r:r,fill:"#fff",style:{cursor:"ew-resize"},stroke:t,strokeWidth:s,onPointerDown:o}),(0,c.jsxs)("svg",{x:a/2-r,y:-2.5*r-r,xmlns:"http://www.w3.org/2000/svg",style:{cursor:"ew-resize"},height:2*r,viewBox:"0 0 24 24",width:2*r,fill:t,onPointerDown:o,children:[(0,c.jsx)("path",{d:"M0 0h24v24H0z",fill:"none"}),(0,c.jsx)("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"})]})]})},me=e=>{const{color:t,height:a,highlighted:i,id:n,immutable:o,onBeginMove:r,onBeginResize:s,onBeginRotate:d,onPointerEnter:p,onPointerLeave:h,onSelected:u,pressed:m,rotation:f,scaleFactor:g,selected:w,width:y,x:S,y:v,disableX:x,disableY:C}=e,b=1.2*g,k=(0,l.useCallback)((e=>{2===e.button&&(e.stopPropagation(),u(n,e)),0===e.button&&(e.stopPropagation(),!w&&u(n,e),r())}),[n,w,u,r]),E=(0,l.useCallback)((()=>{p(n)}),[n,p]),I=(0,l.useCallback)((()=>{h(n)}),[n,h]),N=o?void 0:w?m?"grabbing":"grab":"pointer",R=o?"none":"visibleFill";return(0,c.jsxs)("g",{transform:`translate(${S}, ${v}) rotate(${f} ${y/2} ${a/2})`,children:[(0,c.jsx)("rect",{className:"interactableInnerRect",width:y,height:a,stroke:w||i?t:"none",pointerEvents:R,fill:"none",strokeWidth:b,style:{cursor:N},onPointerDown:o?void 0:k,onPointerEnter:o?void 0:E,onPointerLeave:o?void 0:I}),w&&(0,c.jsxs)(c.Fragment,{children:[(0,c.jsx)(ue,{color:t,elementWidth:y,onBeginRotate:d,scaleFactor:g}),(0,c.jsx)(he,{color:t,elementHeight:a,elementWidth:y,rotation:f,scaleFactor:g,onBeginResize:s,disableX:x,disableY:C})]})]})},fe=({primaryColor:e,containerHeight:t,containerWidth:a,customViewbox:i,editorRef:n,elementEvent:o,guidelines:r,layoutHeight:s,layoutWidth:d,targetedElements:p,scale:u,selectedElement:m,onElementEvent:f,onElementSelected:g,onSequenceStart:w})=>{const{state:y}=Y(),{getLayoutById:S}=j(),v=S(y.layoutId),[x,C]=(0,l.useState)(void 0),b=(0,l.useCallback)((e=>{C(e)}),[]),k=(0,l.useCallback)((e=>{x===e&&C(void 0)}),[x]),E=(0,l.useCallback)((()=>{w(),f({type:Q.Translate})}),[f]),I=(0,l.useCallback)(((e,t)=>{w(),f({type:Q.Resize,relativeAxis:e,screenAxis:t})}),[f]),N=(0,l.useCallback)((()=>{w(),f({type:Q.Rotate})}),[f]),R=i||{x:0,y:0,width:d,height:s},T=u*(Math.sqrt(R.width*R.height)/1e3)*(100/Math.sqrt(t*a))*Math.sqrt((O=a/t,Math.exp(Math.abs(Math.log(O)))));var O;const M=v.layoutState.elements.findIndex((({id:e})=>e===m)),A=[...v.layoutState.elements];return M>=0&&A.push(A.splice(M,1)[0]),(0,c.jsxs)("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:`${R.x} ${R.y} ${R.width} ${R.height}`,overflow:"overlay",children:[(0,c.jsx)("rect",{fill:"none",stroke:"none",ref:n,width:d,height:s}),r.map((e=>e.svgNode)),A.map((t=>{const a=void 0!==m&&t.id===m,i=a&&void 0!==o,n=void 0!==x&&t.id===x;return(0,c.jsx)(me,{color:e,id:t.id,selected:a,highlighted:n,pressed:i,x:t.x,y:t.y,disableX:t.type===h.LayoutElementType.Frame,disableY:t.type===h.LayoutElementType.Textbox||t.type===h.LayoutElementType.Frame,width:t.width,height:t.height,rotation:t.rotation,immutable:t.immutable||p&&!p.includes(t.id),onSelected:g,onBeginMove:E,onBeginResize:I,onBeginRotate:N,onPointerEnter:b,onPointerLeave:k,scaleFactor:T},t.id)}))]})},ge=e=>{const{color:t,editorRef:a,zoomableElementRef:i,interactionElementRef:n,guidelines:o,isMakingAdjustments:r,viewmask:s,visibleLayoutId:d,xTranslation:p,yTranslation:h,targetedElements:u,borderRadius:m,handleContextMenu:f,handleKeyDown:g,handleKeyUp:w,handlePointerMove:y,handlePointerPressedBackground:S,handlePointerReleased:v,handleScroll:x,onSequenceStart:C,setElementEvent:b,onElementSelected:k}=e,{getLayoutById:E}=j(),I=E(d),N=I.layoutState,{state:R}=Y(),T=(0,l.useCallback)((e=>{if(s){const t={left:s.x,top:s.y,width:s.width,height:s.height,panelId:"",rotation:0};return g(e,t)}return g(e)}),[g,s]),O=(0,l.useCallback)((e=>{if(s){const t={left:s.x,top:s.y,width:s.width,height:s.height,panelId:"",rotation:0};return y(e,t)}return y(e)}),[y,s]);return(0,c.jsx)("div",{style:{justifyContent:"center",position:"relative",height:"100%",width:"100%",scrollbarWidth:"none",outline:"none"},onContextMenu:f,onKeyDown:T,onKeyUp:w,onPointerDown:S,onPointerMoveCapture:O,onPointerUp:v,onWheelCapture:x,ref:n,tabIndex:-1,children:(0,c.jsxs)("div",{ref:i,style:{height:"100%",transform:`scale(${R.zoom}) translate(${p}px, ${h}px)`,display:"grid",filter:"drop-shadow(rgba(0, 0, 0, 0.2) 0px 0px 6px)"},children:[e.children,I.getComponentWithProps({height:r?"100%":"auto",maxHeight:"100%",maxWidth:"100%",position:"absolute",viewmask:s,width:r?"100%":"auto",borderRadius:m}),(0,c.jsx)(fe,{primaryColor:t,containerHeight:i.current?.offsetHeight||1024,containerWidth:i.current?.offsetWidth||1024,editorRef:a,elementEvent:R.elementEvent,guidelines:o,layoutHeight:N.layout.height,layoutWidth:N.layout.width,onElementEvent:b,onSequenceStart:C,onElementSelected:k,scale:10/R.zoom,selectedElement:R.selectedElement,targetedElements:u})]})})},we=({color:e,borderRadius:a,guidelineColor:i,handleContextMenu:n,onElementSelected:o})=>{const{commandDispatcher:r,getLayoutById:s}=j(),{state:d,uiDispatcher:p}=Y(),u=(0,l.useRef)(null),m=(0,l.useRef)(null),f=(0,l.useRef)(null),{guidelines:g,handleKeyDown:w,handleKeyUp:y,handlePointerMove:S,handlePointerPressedBackground:v,handlePointerReleased:x,handleScroll:C,handleSequenceStart:b,setElementEvent:k}=ce(u,m,f,void 0,"advanced",r,i),E=(0,l.useCallback)(((e,a)=>{const i=s(d.layoutId).layoutState.elements.find((t=>t.id===e));if(e&&i&&i.type===h.LayoutElementType.Textbox){const a=i.algorithm;(!a||a===h.TextAlgorithm.Autosize)&&r(new(0,t.FontAlgorithmCommand)(e,h.TextAlgorithm.Traditional))}o&&o(e,a),p(new X({selectedElement:e}))}),[r,s,d.layoutId,p]);return(0,c.jsx)(ge,{color:e,editorRef:u,interactionElementRef:m,zoomableElementRef:f,guidelines:g,visibleLayoutId:d.layoutId,xTranslation:0,yTranslation:0,borderRadius:a,handleContextMenu:n,handleKeyDown:w,handleKeyUp:y,handlePointerMove:S,handlePointerPressedBackground:v,handlePointerReleased:x,handleScroll:C,onSequenceStart:b,setElementEvent:k,onElementSelected:E})};const ye=new class{cache=new Map;materialCache=new Map;constructor(){this.server=F}async getLocalOrFromServer(e){if(this.cache.has(e))return this.cache.get(e);const t=(async()=>(await F.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 F.execute("getMaterialV2",{id:e})).body)();return this.materialCache.set(e,t),t}async uploadAssetWithProgress(e,t,a,i,n,o){const r=await this.dispatchCreateAssetRequest(e,t,n,o);var s=new XMLHttpRequest;return s.open("PUT",r.assetResponse.uploadUrl,!0),s.setRequestHeader("Content-Type",r.mimeType),s.setRequestHeader("Cache-Control","public,max-age=31536000,immutable"),s.upload.onprogress=e=>{e.lengthComputable&&a(100*e.loaded/e.total)},s.onload=()=>{const e=r.assetResponse.asset;i(e)},s.onerror=()=>{console.warn("Asset upload failed")},s.send(e.blob),r.assetResponse.asset}loadImageAsFileInfo=async e=>{const t=await e.arrayBuffer(),a=await(0,g.getAttributesFromArrayBuffer)(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 Se{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 ve{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 xe=(()=>{try{return localStorage?new Se:new ve}catch{return console.warn("Local storage was unavilable due to browser security settings. Using in-memory storage instead."),new ve}})(),Ce=n.gql`
2
2
  mutation CreateTransaction($integrationProductId: String!, $bulk: Boolean) {
3
3
  transactionCreate(integrationProductId: $integrationProductId, bulk: $bulk) {
4
4
  id
package/dist/module.js CHANGED
@@ -94,5 +94,5 @@ import{CommandContext as e,getSvgString as t}from"papyrus/build/main/CommandCont
94
94
  workflowState
95
95
  }
96
96
  }
97
- `;const Rt=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 Ot{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`);Rt.selectVariant(this.stepConfiguration,e.id,this.manager)}}const Mt=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},Lt=[ce.SilentIllustration,"ProductOverlay"],Dt=(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=Pt(i.stepName,e.stepGroups);if(n){const e=a.find((e=>e.name===n.name));e?Lt.includes(i.type)?e.silentSteps.push(i):e.renderableSteps.push(i):a.push({name:n.name,title:n.name,renderableSteps:Lt.includes(i.type)?[]:[i],silentSteps:Lt.includes(i.type)?[i]:[]})}else a.push({name:i.stepName,title:i.stepTitle,renderableSteps:Lt.includes(i.type)?[]:[i],silentSteps:Lt.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:Mt(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},Pt=(e,t)=>t.find((t=>t.stepNames.includes(e))),At=(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})),zt=(e,t)=>e.map((e=>((e,t)=>{const a={name:e.name,title:e.title,renderableSteps:e.renderableSteps.filter((e=>At(e,t))),silentSteps:e.silentSteps.filter((e=>At(e,t)))};return 0===a.silentSteps.length&&0===a.renderableSteps.length?null:a})(e,t))).filter((e=>null!==e)),Tt=(e,t)=>zt(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)),Vt=(e,t)=>zt(e,t).filter((e=>e.renderableSteps.filter((e=>e)).length>0));class Ut{timestamp=Date.now()}class Ft{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 Wt(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=qt(e.x,t.width-o,0),i.y=qt(e.y,t.height-s,0),i}const s=e;return s.x=qt(s.x,-n,t.width),s.y=qt(s.y,-o,t.height),s}function qt(e,t,a){return Math.min(Math.max(e,t),a)}class $t{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(Wt(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(Wt(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=Wt(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 jt=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)},Bt=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 jt(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 gt.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 jt(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 Kt{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 jt(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 Ht=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 Xt{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 Gt=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 Xt((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 Ht(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 Yt=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 Xt((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 gt.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 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=await gt.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 gt.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 Qt=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 gt.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 gt.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)))})),ea=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)},ta=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 gt.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=ea(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 aa=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 gt.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 ia=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 na=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 oa extends Error{constructor(e){super(e),Object.setPrototypeOf(this,new.target.prototype),this.name=oa.name}}class sa extends Error{constructor(e){super(e),Object.setPrototypeOf(this,new.target.prototype),this.name=sa.name}}const ra=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 gt.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 sa("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 oa("Error adding font to region")}}))).catch((e=>{throw e instanceof oa?(na.setLatestToast("Failed to load font.",la.Error),e):e instanceof sa?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 la;var ca;(ca=la||(la={})).Error="Error",ca.Warning="Warning";class da extends Ut{createdAt=new Date;constructor(e){super(),this.update=e}async execute(){await this.update(),await new Promise((e=>{window.setTimeout((()=>{e()}),1e3)}))}}class ha{workflowStatePromiseQueue=new Ft(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=Dt(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=>{At(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=zt(n,i),s=zt(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=>{At(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 da((async()=>{await this.updateTransaction({variables:{id:this.transaction.id,workflowState:t.transaction}})})))}async updateStateWithServerImmediate(e){const t=this.serialize(e);return new da((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)=>(At(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)=>(!At(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 Kt(e,t).trigger():"ProductOverlay"===e.type?new Kt(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=zt(t,this.stepSelections).map((e=>e.silentSteps)).flat(),{stepElements:i,commands:n}=await this.stepElementsForIntroducedSilentSteps(a);this.stepElements={...this.stepElements,...i};const o=Vt(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 Gt.init(t,this,e));break;case"Finish":case"Introduction":default:break;case"Frame":case"Photo":const a=new $t(t.data.forceImageCover);a.connectWorkflowManager(this,t.stepName),this.stepSpecificServices[t.stepName]={frameService:a},s.push(await Yt.init(t,this,e));break;case"Illustration":s.push(await Bt.init(t,this,e));break;case"Material":r.push(await Zt.init(t,this,e));break;case"Model":r.push(await Qt.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 ta.init(t,this,e));break;case"Picture":s.push(await aa.init(t,this,e));break;case"Question":r.push(await Rt.init(t,this,e));break;case"Shape":s.push(await ia.init(t,this,e));break;case"Text":s.push(await ra.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 Tt(e,this.stepSelections)}}class pa{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||!St.getMap("transactionOwnerIds")?.get(t.transaction.id);this.workflowManager=new ha(t.workflow,t.product.profanities?.map((e=>e.word))||[],a,this.commandContext,(async e=>{this.isReadOnly||Ve.getShadowGraphqlClient().mutate({...e,mutation:bt})}),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:It,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 Ot(this.getWorkflowManager(),t)}getStepByName(e){const t=this.getWorkflowManager().getWorkflow().steps.find((t=>t.stepTitle===e));if(t)return new Ot(this.getWorkflowManager(),t)}getStepsByType(e){return this.getWorkflowManager().getWorkflow().steps.filter((t=>t.type===e)).map((e=>new Ot(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:Nt,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:Et,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 ua{constructor(e){this.handleCompleteRender=null;const t=new Map;e.forEach((e=>t.set(e.id,new fa(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 ma;class fa{hasSetStaticContext=!1;interactiveDirty=!1;staticCtxDirty=!1;lastRequestedRenderArguments=void 0;lastCompletedStaticRender=void 0;lastModificationID=void 0;renderQueue=new Ft(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 ga(this.getID(),o,(()=>{if(void 0!==ma)return ma;const e=document.createElement("canvas").getContext("webgl2");return ma=!!e,ma})(),(()=>{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 jt(t.svg))}}this.rehydrated=!0}}),i))}}class ga extends Ut{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 gt.getLocalOrFromServer(t.assetKey))}const i=await ya(wa(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 wa=(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},ya=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},Sa=async e=>(await Te.execute("getProductById",{productId:e})).body,va=(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 xa{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:vt,variables:{integrationProductId:e,bulk:this.options.bulk||!1}}),i=(await t.mutate({mutation:xt,variables:{id:a.data?.transactionCreate.id}})).data?.transactionClaim;if(!i)throw new Error("Failed to create transaction.");const n=St.getMap("transactionOwnerIds")||new Map;n.set(i.id,i.transactionOwnerId),Ae(i.transactionOwnerId||""),St.setMap("transactionOwnerIds",n);const o=await Sa(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=St.getMap("transactionOwnerIds")||new Map,i=a.get(e);if(i){Ae(i);const a=(await t.query({query:Ct,variables:{id:e}})).data?.transactions[0];if(!a)throw new Error("Failed to read transaction.");const n=await Sa(a.product?.id||"");return this.experienceOptions={product:n.data,transaction:a,layouts:[]},void(this.initialized=!0)}const n=(await t.mutate({mutation:xt,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),St.setMap("transactionOwnerIds",a));const o=await Sa(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 ua(this.experienceOptions.layouts),this.experienceOptions.product?.modelUrl&&await(this.experienceOptions.previewService?.initialize(this.experienceOptions.product.modelUrl,this.experienceOptions.renderableContextService)),new pa(this.experienceOptions)}if(e){const i=(await Te.execute("getWorkflowV2",{workflowSlug:e})).body.data;if(this.experienceOptions.workflow=i,await Ve.getShadowGraphqlClient().mutate({mutation:kt,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=va(this.experienceOptions.transaction,this.experienceOptions.workflow);return this.experienceOptions.previewService=a&&a(i),this.experienceOptions.renderableContextService=new ua(this.experienceOptions.layouts),this.experienceOptions.product?.modelUrl&&await(this.experienceOptions.previewService?.initialize(this.experienceOptions.product.modelUrl,this.experienceOptions.renderableContextService)),new pa(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{xa as Client,e as CommandContext,De as spiffCoreConfiguration,Ft as PromiseQueue,Ut as QueueablePromise,gt as assetService,Le as optionService,Te as server,St as persistenceService,Ve as graphQlManager,na as toast,$t as FrameService,Yt as frameStepService,Qt as modelStepService,Zt as materialStepService,ta as patchworkStepService,aa as pictureStepService,ra as textStepService,Bt as illustrationStepService,jt as svgObjectURL,ot as generate,a as CreateElementCommand,i as TextChangeCommand,n as FontAlignmentCommand,o as FontColorCommand,v as LayoutElementFactory,st as minZoom,ft as AdvancedEditor,mt as EditorCore,Fe as useLayouts,Xe as useEditorState,rt as useEditorInteraction,je as commandReducer,$e as getDefaultState,Ue as CommandContextContext,Ke as AdvancedEditorStateProvider,Be as AdvancedEditorContext,He as UICommand,x as SpiffCommerce3DPreviewService};
97
+ `;const Rt=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 Ot{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`);Rt.selectVariant(this.stepConfiguration,e.id,this.manager)}}const Mt=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},Lt=[ce.SilentIllustration,"ProductOverlay"],Dt=(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=Pt(i.stepName,e.stepGroups);if(n){const e=a.find((e=>e.name===n.name));e?Lt.includes(i.type)?e.silentSteps.push(i):e.renderableSteps.push(i):a.push({name:n.name,title:n.name,renderableSteps:Lt.includes(i.type)?[]:[i],silentSteps:Lt.includes(i.type)?[i]:[]})}else a.push({name:i.stepName,title:i.stepTitle,renderableSteps:Lt.includes(i.type)?[]:[i],silentSteps:Lt.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:Mt(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},Pt=(e,t)=>t.find((t=>t.stepNames.includes(e))),At=(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})),zt=(e,t)=>e.map((e=>((e,t)=>{const a={name:e.name,title:e.title,renderableSteps:e.renderableSteps.filter((e=>At(e,t))),silentSteps:e.silentSteps.filter((e=>At(e,t)))};return 0===a.silentSteps.length&&0===a.renderableSteps.length?null:a})(e,t))).filter((e=>null!==e)),Tt=(e,t)=>zt(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)),Vt=(e,t)=>zt(e,t).filter((e=>e.renderableSteps.filter((e=>e)).length>0));class Ut{timestamp=Date.now()}class Ft{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 Wt(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=qt(e.x,t.width-o,0),i.y=qt(e.y,t.height-s,0),i}const s=e;return s.x=qt(s.x,-n,t.width),s.y=qt(s.y,-o,t.height),s}function qt(e,t,a){return Math.min(Math.max(e,t),a)}class $t{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(Wt(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(Wt(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=Wt(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 jt=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)},Bt=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 jt(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 gt.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 jt(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 Kt{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 jt(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 Ht=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 Xt{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 Gt=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 Xt((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 Ht(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 Yt=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 Xt((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 gt.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 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=await gt.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 gt.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 Qt=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 gt.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 gt.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)))})),ea=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)},ta=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 gt.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=ea(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 aa=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 gt.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 ia=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 na=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 oa extends Error{constructor(e){super(e),Object.setPrototypeOf(this,new.target.prototype),this.name=oa.name}}class sa extends Error{constructor(e){super(e),Object.setPrototypeOf(this,new.target.prototype),this.name=sa.name}}const ra=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 gt.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 sa("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 oa("Error adding font to region")}}))).catch((e=>{throw e instanceof oa?(na.setLatestToast("Failed to load font.",la.Error),e):e instanceof sa?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 la;var ca;(ca=la||(la={})).Error="Error",ca.Warning="Warning";class da extends Ut{createdAt=new Date;constructor(e){super(),this.update=e}async execute(){await this.update(),await new Promise((e=>{window.setTimeout((()=>{e()}),1e3)}))}}class ha{workflowStatePromiseQueue=new Ft(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=Dt(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=>{At(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=zt(n,i),s=zt(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=>{At(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 da((async()=>{await this.updateTransaction({variables:{id:this.transaction.id,workflowState:t.transaction}})})))}async updateStateWithServerImmediate(e){const t=this.serialize(e);return new da((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)=>(At(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)=>(!At(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 Kt(e,t).trigger():"ProductOverlay"===e.type?new Kt(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=zt(t,this.stepSelections).map((e=>e.silentSteps)).flat(),{stepElements:i,commands:n}=await this.stepElementsForIntroducedSilentSteps(a);this.stepElements={...this.stepElements,...i};const o=Vt(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 Gt.init(t,this,e));break;case"Finish":case"Introduction":default:break;case"Frame":case"Photo":const a=new $t(t.data.forceImageCover);a.connectWorkflowManager(this,t.stepName),this.stepSpecificServices[t.stepName]={frameService:a},s.push(await Yt.init(t,this,e));break;case"Illustration":s.push(await Bt.init(t,this,e));break;case"Material":r.push(await Zt.init(t,this,e));break;case"Model":r.push(await Qt.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 ta.init(t,this,e));break;case"Picture":s.push(await aa.init(t,this,e));break;case"Question":r.push(await Rt.init(t,this,e));break;case"Shape":s.push(await ia.init(t,this,e));break;case"Text":s.push(await ra.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 Tt(e,this.stepSelections)}}class pa{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||!St.getMap("transactionOwnerIds")?.get(t.transaction.id);this.workflowManager=new ha(t.workflow,t.product.profanities?.map((e=>e.word))||[],a,this.commandContext,(async e=>{this.isReadOnly||Ve.getShadowGraphqlClient().mutate({...e,mutation:bt})}),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:It,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 Ot(this.getWorkflowManager(),t)}getStepByName(e){const t=this.getWorkflowManager().getWorkflow().steps.find((t=>t.stepTitle===e));if(t)return new Ot(this.getWorkflowManager(),t)}getStepsByType(e){return this.getWorkflowManager().getWorkflow().steps.filter((t=>t.type===e)).map((e=>new Ot(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:Nt,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:Et,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 ua{constructor(e){this.handleCompleteRender=null;const t=new Map;e.forEach((e=>t.set(e.id,new fa(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 ma;class fa{hasSetStaticContext=!1;interactiveDirty=!1;staticCtxDirty=!1;lastRequestedRenderArguments=void 0;lastCompletedStaticRender=void 0;lastModificationID=void 0;renderQueue=new Ft(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 ga(this.getID(),o,(()=>{if(void 0!==ma)return ma;const e=document.createElement("canvas").getContext("webgl2");return ma=!!e,ma})(),(()=>{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 jt(t.svg))}}this.rehydrated=!0}}),i))}}class ga extends Ut{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 gt.getLocalOrFromServer(t.assetKey))}const i=await ya(wa(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 wa=(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},ya=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},Sa=async e=>(await Te.execute("getProductById",{productId:e})).body,va=(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 xa{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:vt,variables:{integrationProductId:e,bulk:this.options.bulk||!1}}),i=(await t.mutate({mutation:xt,variables:{id:a.data?.transactionCreate.id}})).data?.transactionClaim;if(!i)throw new Error("Failed to create transaction.");const n=St.getMap("transactionOwnerIds")||new Map;n.set(i.id,i.transactionOwnerId),Ae(i.transactionOwnerId||""),St.setMap("transactionOwnerIds",n);const o=await Sa(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=St.getMap("transactionOwnerIds")||new Map,i=a.get(e);if(i){Ae(i);const a=(await t.query({query:Ct,variables:{id:e}})).data?.transactions[0];if(!a)throw new Error("Failed to read transaction.");const n=await Sa(a.product?.id||"");return this.experienceOptions={product:n.data,transaction:a,layouts:[]},void(this.initialized=!0)}const n=(await t.mutate({mutation:xt,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),St.setMap("transactionOwnerIds",a));const o=await Sa(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 ua(this.experienceOptions.layouts),this.experienceOptions.product?.modelUrl&&await(this.experienceOptions.previewService?.initialize(this.experienceOptions.product.modelUrl,this.experienceOptions.renderableContextService)),new pa(this.experienceOptions)}if(e){const i=(await Te.execute("getWorkflowV2",{workflowSlug:e})).body.data;if(this.experienceOptions.workflow=i,await Ve.getShadowGraphqlClient().mutate({mutation:kt,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=va(this.experienceOptions.transaction,this.experienceOptions.workflow);return this.experienceOptions.previewService=a&&a(i),this.experienceOptions.renderableContextService=new ua(this.experienceOptions.layouts),this.experienceOptions.product?.modelUrl&&await(this.experienceOptions.previewService?.initialize(this.experienceOptions.product.modelUrl,this.experienceOptions.renderableContextService)),new pa(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{xa as Client,e as CommandContext,De as spiffCoreConfiguration,Ft as PromiseQueue,Ut as QueueablePromise,gt as assetService,Le as optionService,Te as server,St as persistenceService,Ve as graphQlManager,na as toast,$t as FrameService,Yt as frameStepService,Qt as modelStepService,Zt as materialStepService,ta as patchworkStepService,Rt as questionStepService,aa as pictureStepService,ra as textStepService,Bt as illustrationStepService,jt as svgObjectURL,ot as generate,a as CreateElementCommand,i as TextChangeCommand,n as FontAlignmentCommand,o as FontColorCommand,v as LayoutElementFactory,st as minZoom,ft as AdvancedEditor,mt as EditorCore,Fe as useLayouts,Xe as useEditorState,rt as useEditorInteraction,je as commandReducer,$e as getDefaultState,Ue as CommandContextContext,Ke as AdvancedEditorStateProvider,Be as AdvancedEditorContext,He as UICommand,x as SpiffCommerce3DPreviewService};
98
98
  //# sourceMappingURL=module.js.map
package/dist/types.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { StepAspect, Workflow, AnyStepData, Step, Asset, AssetType, IServerModel, MaterialResource, IllustrationStepData, VariantResource, FrameStepData, MaterialStepData, ModelStepData, PatchworkStepData, PictureStepData, TextStepData as _TextStepData1, CameraAnimation, ModelAnimation, OptionResource, StepType, TextStepData } from "papyrus/build/main/generation/Workflow";
1
+ import { StepAspect, Workflow, AnyStepData, Step, Asset, AssetType, IServerModel, MaterialResource, IllustrationStepData, VariantResource, FrameStepData, MaterialStepData, ModelStepData, PatchworkStepData, PictureStepData, QuestionStepData, TextStepData as _TextStepData1, CameraAnimation, ModelAnimation, OptionResource, StepType, TextStepData } from "papyrus/build/main/generation/Workflow";
2
2
  import { PatternImageData, FrameData as _FrameData1, Point, ScaleAxis, UnitOfMeasurement } from "papyrus/build/main/types";
3
3
  import { FrameOffsets, ColorDefinition, ILayout, IllustrationElement as _IllustrationElement1, LayoutsState as _LayoutsState1, Region, FrameElement as _FrameElement1, PatchworkOffsets, TextboxElement as _TextboxElement1, FontData, SerializableStep, StepStorage, FrameElement, IllustrationElement, LayoutElement, LayoutsState, PatchworkElement, TextboxElement, ImageElement } from "papyrus/build/main/LayoutsState/types";
4
4
  import { ApolloClient } from "@apollo/client";
@@ -251,6 +251,11 @@ declare class PictureStepService implements StepService<PictureStepData> {
251
251
  selectVariant(stepData: Step<PictureStepData>, variant: VariantResource, workflowManager: WorkflowManager, setIsUpdating: (status: boolean) => void): void;
252
252
  }
253
253
  export const pictureStepService: PictureStepService;
254
+ declare class QuestionStepService implements StepService<QuestionStepData> {
255
+ init(stepData: Step<QuestionStepData>, workflowManager: WorkflowManager, reducerState?: _LayoutsState1): Promise<null | (() => Promise<void>)>;
256
+ selectVariant(stepData: Step<QuestionStepData>, variantId: string, workflowManager: WorkflowManager): void;
257
+ }
258
+ export const questionStepService: QuestionStepService;
254
259
  type ToastCallback = (callbackOptions: {
255
260
  toastMessage: null | string;
256
261
  toastType: InformationMessageType | null;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@spiffcommerce/core",
3
- "version": "0.3.3",
3
+ "version": "0.3.4",
4
4
  "description": "Core client API for interacting with the Spiff Commerce backend.",
5
5
  "source": "src/index.ts",
6
6
  "main": "dist/main.js",