@spiffcommerce/core 0.4.4 → 0.4.5
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 +1 -1
- package/dist/module.js +1 -1
- package/package.json +1 -1
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"),h=require("lodash.isequal"),p=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"),O=require("papyrus/build/main/text/algorithm/autosize"),M=require("papyrus/build/main/generation");function T(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}function L(e,t,a){return t in e?Object.defineProperty(e,t,{value:a,enumerable:!0,configurable:!0,writable:!0}):e[t]=a,e}T(module.exports,"Client",(()=>Ut)),T(module.exports,"CommandContext",(()=>$eb7869949b641a40$re_export$CommandContext)),T(module.exports,"spiffCoreConfiguration",(()=>V)),T(module.exports,"PromiseQueue",(()=>He)),T(module.exports,"QueueablePromise",(()=>Ge)),T(module.exports,"MockWorkflowManager",(()=>Ft)),T(module.exports,"InformationMessageType",(()=>Ct)),T(module.exports,"assetService",(()=>Ce)),T(module.exports,"optionService",(()=>P)),T(module.exports,"server",(()=>q)),T(module.exports,"persistenceService",(()=>Ee)),T(module.exports,"graphQlManager",(()=>W)),T(module.exports,"toast",(()=>gt)),T(module.exports,"FrameService",(()=>Ze)),T(module.exports,"frameStepService",(()=>rt)),T(module.exports,"modelStepService",(()=>lt)),T(module.exports,"materialStepService",(()=>st)),T(module.exports,"patchworkStepService",(()=>pt)),T(module.exports,"shapeStepService",(()=>mt)),T(module.exports,"questionStepService",(()=>Pe)),T(module.exports,"digitalContentStepService",(()=>ot)),T(module.exports,"moduleStepService",(()=>ct)),T(module.exports,"pictureStepService",(()=>ut)),T(module.exports,"textStepService",(()=>vt)),T(module.exports,"illustrationStepService",(()=>Je)),T(module.exports,"svgObjectURL",(()=>Qe)),T(module.exports,"generate",(()=>de)),T(module.exports,"CreateElementCommand",(()=>$eb7869949b641a40$re_export$CreateElementCommand)),T(module.exports,"TextChangeCommand",(()=>$eb7869949b641a40$re_export$TextChangeCommand)),T(module.exports,"FontAlignmentCommand",(()=>$eb7869949b641a40$re_export$FontAlignmentCommand)),T(module.exports,"FontColorCommand",(()=>$eb7869949b641a40$re_export$FontColorCommand)),T(module.exports,"LayoutElementFactory",(()=>$eb7869949b641a40$re_export$LayoutElementFactory)),T(module.exports,"minZoom",(()=>he)),T(module.exports,"AdvancedEditor",(()=>ve)),T(module.exports,"EditorCore",(()=>Se)),T(module.exports,"useLayouts",(()=>B)),T(module.exports,"useEditorState",(()=>Q)),T(module.exports,"useEditorInteraction",(()=>pe)),T(module.exports,"commandReducer",(()=>X)),T(module.exports,"getDefaultState",(()=>H)),T(module.exports,"CommandContextContext",(()=>$)),T(module.exports,"AdvancedEditorStateProvider",(()=>Y)),T(module.exports,"AdvancedEditorContext",(()=>_)),T(module.exports,"UICommand",(()=>Z)),T(module.exports,"EditorSubMenu",(()=>K)),T(module.exports,"gatherVaryingStepAspects",(()=>ze)),T(module.exports,"SpiffCommerce3DPreviewService",(()=>$eb7869949b641a40$re_export$SpiffCommerce3DPreviewService)),T(module.exports,"ProductCameraRig",(()=>$eb7869949b641a40$re_export$ProductCameraRig));const P=new class{constructor(){L(this,"cache",new Map),L(this,"getDisplayImageSource",(e=>{if(e){const t=e.displayImage?.links.find((e=>"cdn"===e.rel));if(t)return t.href}})),L(this,"getSelectedVariant",((e,t)=>{if(e&&0!==t.length)return e.variants.find((e=>e.id===t[0]))})),L(this,"getSelectedVariants",((e,t)=>e?.variants.filter((e=>t.includes(e.id)))||[]))}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 P.getLocalOrFromServer(q,e);"Font"===t.data.type&&t.data.variants.forEach((async e=>{if(e.assetKey){const t=(await Ce.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 Ce.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 Ce.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}};function D(e,t,a){return t in e?Object.defineProperty(e,t,{value:a,enumerable:!0,configurable:!0,writable:!0}):e[t]=a,e}const V=new class{constructor(){D(this,"defaultServerUrl","https://api.spiff.com.au"),D(this,"defaultServicesApiUrl","https://services.spiff.com.au"),D(this,"serverUrl",void 0),D(this,"servicesApiUrl",void 0),D(this,"serverUrlCallbacks",void 0),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)}};function z(e,t,a){return t in e?Object.defineProperty(e,t,{value:a,enumerable:!0,configurable:!0,writable:!0}):e[t]=a,e}let U;const F=e=>{U=e},j=async()=>({transactionOwnerId:U});const q=new class{constructor(){z(this,"client",void 0),z(this,"uncachedOperations",[]),V.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 j();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 j(),t=V.getServerUrl()+"/v2/api-docs";return await A(i)(t,{authorizations:{OAuth2:{token:{access_token:e.bearer,token_type:"Bearer"}},PartnerId:e.partnerId}})}};const W=new class{constructor(){z(this,"shadowGraphqlClient",void 0),this.shadowGraphqlClient=this.constructShadowGraphqlClient(),V.addServerUrlCallback((()=>{this.shadowGraphqlClient=this.constructShadowGraphqlClient()}))}getShadowGraphqlClient(){return this.shadowGraphqlClient}constructShadowGraphqlClient(){const e=(0,n.createHttpLink)({uri:`${V.getServerUrl()}/graphql`,fetch:A(s)}),t=(0,o.setContext)((async(e,{headers:t})=>{const a=t||{},i=await j();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"})}},$=(0,l.createContext)(new(0,e.CommandContext)),B=()=>{const e=(0,l.useContext)($);(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 K;var G;(G=K||(K={})).None="None",G.FrameAdjustment="FrameAdjustment",G.FinalizeDesign="FinalizeDesign";const H=(e,t)=>({layoutId:e()[0].layoutState.layout.id,selectedElement:void 0,zoom:t,maxZoom:5,units:d.UnitOfMeasurement.Pixel,subMenu:K.None,activeModifierKeys:[],metaPressed:!1,elementEvent:void 0,scrolledMovement:!1}),X=(e,t)=>A(h)(e,t.apply(e))?e:t.apply(e),_=(0,l.createContext)({}),Y=e=>{const{getAllLayouts:t}=B(),[a,i]=(0,l.useReducer)(X,H(t,e.defaultZoom||1)),n=(0,l.useMemo)((()=>({state:a,uiDispatcher:i})),[a,i]);return(0,c.jsx)(_.Provider,{value:n,children:e.children})};class Z{constructor(e){var t,a,i;i=void 0,(a="changes")in(t=this)?Object.defineProperty(t,a,{value:i,enumerable:!0,configurable:!0,writable:!0}):t[a]=i,this.changes=e}apply(e){return{...e,...this.changes}}}const Q=()=>(0,l.useContext)(_),J=7*window.devicePixelRatio,ee=(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 h=new Set;s.forEach((e=>h.add(e.minY))),s.forEach((e=>h.add(e.maxY))),[0,o/2,o].forEach((e=>h.add(e)));const p=r.map((e=>e.y));for(let e=-315;e<=315;e+=45)p.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,h]=((e,t)=>[{x:"x"===e?t:0,y:"x"===e?0:t},{x:"x"===e?t:n,y:"x"===e?o:t}])(e,t),p="rotation"===e?null:(0,c.jsx)("line",{x1:d.x,y1:d.y,x2:h.x,y2:h.y,stroke:r||"#D61B5C",strokeDasharray:5*a,strokeWidth:1.2*a,overflow:"overlay"},`${e}-${t}-${d.x}-${d.y}-${h.x}-${h.y}`);void 0!==l&&s.push({type:e,value:t,anchorPoint:l.anchor,svgNode:p,guidelineCoordinates:[d,h]})})),s};return l.push(...y("x",Array.from(d),f,i)),l.push(...y("y",Array.from(h),g,i)),l.push(...y("rotation",p,w,i)),l};let te;var ae;let ie;var ne;(ae=te||(te={})).Translate="Translate",ae.Rotate="Rotate",ae.Resize="Resize",(ne=ie||(ie={})).ControlLeft="ControlLeft",ne.ControlRight="ControlRight",ne.Equal="Equal",ne.MetaLeft="MetaLeft",ne.MetaRight="MetaRight",ne.Minus="Minus",ne.ArrowLeft="ArrowLeft",ne.ArrowRight="ArrowRight",ne.ArrowUp="ArrowUp",ne.ArrowDown="ArrowDown",ne.AltLeft="AltLeft",ne.AltRight="AltRight",ne.Delete="Delete",ne.Backspace="Backspace";const oe=(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 ie.ArrowLeft:l=a.x-1/o();break;case ie.ArrowUp:c=a.y-1/o();break;case ie.ArrowRight:l=a.x+1/o();break;case ie.ArrowDown:c=a.y+1/o();break;default:throw new Error("Unhandled element interaction!")}const h=(0,u.getAxisAlignedBoundingBox)(l,c,a.width,a.height,a.rotation);return(!n||h.minX>=n.left&&h.maxX<=n.left+n.width&&h.minY>=n.top&&h.maxY<=n.top+n.height)&&(r=l,s=c),new(0,t.MoveCommand)(a.id,r,s)};var re=0,se=0,le=0;const ce=(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,h=e.movementY/l,g=a.rotation*Math.PI/180,w=Math.sin(g),y=Math.cos(g);let S;switch(n.type){case te.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+h*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+h*w,i=a.width+e;let n=a.height;if(a.type===p.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+h*w,i=a.x+e,n=a.width-e;let o=a.height;if(a.type===p.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+h*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+h*w,i=a.width+e;let n=a.height+e,o=a.y-e,r=a.fontSize;if(a.type===p.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+-h*w,i=a.x-e,n=a.width+e;let o=a.y-e,r=a.height+e,s=a.fontSize;if(a.type===p.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+h*w,i=a.width+e;let n=a.height+e,o=a.fontSize;if(a.type===p.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+-h*w,i=a.width+e;let n=a.x-e,o=a.height+e,r=a.fontSize;if(a.type===p.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 te.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)le=0,C=(a.rotation+E-I)%360;else{le+=Math.sqrt(c**2+h**2);const e=Math.abs(le)>J/s;C=e?(a.rotation+E-I)%360:o.find((e=>"rotation"===e.type))?.value||0,e&&(le=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 te.Translate:let N,R,O=a.x,M=a.y;if(0===o.filter((e=>"rotation"!==e.type)).length)re=0,se=0,N=a.x+c,R=a.y+h;else{const e=o.find((e=>"x"===e.type)),t=o.find((e=>"y"===e.type));e||(re=0),t||(se=0);const i=Math.abs(re)>J/s,n=Math.abs(se)>J/l;N=e?i?a.x+re:a.x:a.x+c,R=t?n?a.y+se:a.y:a.y+h,re=i?0:re+c,se=n?0:se+h}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)&&(O=N,M=R),{top:M,left:O,width:a.width,height:a.height,rotation:a.rotation}}})(e,a,i,n,o,r,s),c=[];if(i.type===p.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===p.LayoutElementType.Textbox){const e=i;l.fontSize&&e.fontSize!==l.fontSize&&c.push(new(0,t.FontSizeCommand)(e.id,l.fontSize))}return c},de=()=>{const e=()=>Math.floor(65536*(1+Math.random())).toString(16).substring(1);return e()+e()+"-"+e()+"-"+e()+"-"+e()+"-"+e()+e()+e()},he=.5,pe=(e,a,i,n,o,r,s)=>{const{state:c,uiDispatcher:d}=(0,l.useContext)(_),{getLayoutById:h,getReducerState:p,flattenSequence:u}=B(),[m,f]=(0,l.useState)(void 0),[g,w]=(0,l.useState)(void 0),y=h(c.layoutId);(0,l.useEffect)((()=>{if("adjustment"===o&&e?.current&&n){if(n<he)return void d(new Z({zoom:he}));if(n>c.maxZoom)return void d(new Z({zoom:c.maxZoom}));d(new Z({zoom:n}))}}),[n,d,e,o,c.maxZoom]);const S=(0,l.useCallback)(((e,t)=>{d(new Z({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 Z({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(ie.ControlLeft)||e.includes(ie.MetaLeft)||e.includes(ie.ControlRight)||e.includes(ie.MetaRight);if(!c.selectedElement||!t||a)return[];const i=t&&t.type===te.Translate,n=t&&t.type===te.Rotate,o=y.layoutState.elements.find((e=>e.id===c.selectedElement));return(i||n)&&o?ee(o,y.layoutState,C,s):[]}),[c.selectedElement,c.elementEvent,c.activeModifierKeys,y.layoutState,C]),k=(0,l.useCallback)((()=>{const e=de();f(e),w(p().transaction)}),[p]),E=(0,l.useCallback)((()=>{d(new Z({selectedElement:void 0}))}),[d]),I=(0,l.useCallback)((()=>{d(new Z({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)(ce(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 Z({elementEvent:e}))}),[d]),O=(0,l.useCallback)((()=>{d(new Z({elementEvent:void 0})),m&&g&&(u(m,g),f(void 0),w(void 0))}),[d,m,g,u]),M=(0,l.useCallback)(((e,a)=>{let i=c.zoom;const n=c.maxZoom,s=c.selectedElement,l=c.activeModifierKeys;if((l.includes(ie.AltLeft)||l.includes(ie.AltRight))&&(e.code===ie.Equal||e.code===ie.Minus)){const t=.05*n;e.code===ie.Equal?d(new Z({zoom:i+t<=n?i+=t:i})):d(new Z({zoom:i-t>=he?i-t:i}))}const h=y.layoutState.elements.find((e=>e.id===s));if(s&&h){if(e.code===ie.MetaLeft||e.code===ie.ControlLeft||e.code===ie.MetaRight||e.code===ie.ControlRight){const t=e.code,a=c.activeModifierKeys;if(!a.includes(t))return d(new Z({activeModifierKeys:a.concat(t)}))}if(e.code===ie.ArrowDown||e.code===ie.ArrowUp||e.code===ie.ArrowLeft||e.code===ie.ArrowRight){d(new Z({elementEvent:{type:te.Translate}}));const t=oe(e.code,h,c.units,a);r(t),d(new Z({elementEvent:void 0}))}e.code!==ie.Delete&&e.code!==ie.Backspace||"advanced"!==o||(d(new Z({selectedElement:void 0})),r(new(0,t.DeleteElementCommand)(h.id)))}}),[r,d,y.layoutState.elements,o,c.activeModifierKeys,c.maxZoom,c.selectedElement,c.units,c.zoom]),T=(0,l.useCallback)((e=>{if(e.code===ie.MetaLeft||e.code===ie.ControlLeft||e.code===ie.MetaRight||e.code===ie.ControlRight){const t=c.activeModifierKeys,a=e.code;d(new Z({activeModifierKeys:t.filter((e=>e!==a))}))}}),[d,c.activeModifierKeys]);return{guidelines:b,scale:C,zoomableElementRef:i,setElementEvent:R,handleZoom:S,handleKeyDown:M,handleKeyUp:T,handlePointerPressedBackground:E,handlePointerReleased:O,handlePointerMove:N,handleScroll:I,handleSequenceStart:k}},ue=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})},me=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})},fe=e=>{const{color:t,elementHeight:a,elementWidth:i,onBeginResize:n,rotation:o,scaleFactor:r,disableX:s,disableY:h}=e,p=7.5*r,m=3*r,f=28*r,g=6*r,w=1.2*r,y=a-2*p,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)(ue,{x:0,y:0,cursorStyle:"nwse-resize",onPointerDown:k,handleClass:"cornerNorthWest",cornerRadius:p,color:t,strokeWidth:w}),R?(0,c.jsx)(ue,{x:i,y:0,cursorStyle:"nesw-resize",onPointerDown:E,handleClass:"cornerNorthEast",cornerRadius:p,color:t,strokeWidth:w}):void 0,R?(0,c.jsx)(ue,{x:i,y:a,cursorStyle:"nwse-resize",onPointerDown:N,handleClass:"cornerSouthEast",cornerRadius:p,color:t,strokeWidth:w}):void 0,R?(0,c.jsx)(ue,{x:0,y:a,cursorStyle:"nesw-resize",onPointerDown:I,handleClass:"cornerSouthWest",cornerRadius:p,color:t,strokeWidth:w}):void 0,R&&!s?(0,c.jsx)(me,{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&&!h?(0,c.jsx)(me,{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)(me,{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&&!h?(0,c.jsx)(me,{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]})},ge=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"})]})]})},we=e=>{const{color:t,height:a,highlighted:i,id:n,immutable:o,onBeginMove:r,onBeginResize:s,onBeginRotate:d,onPointerEnter:h,onPointerLeave:p,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)((()=>{h(n)}),[n,h]),I=(0,l.useCallback)((()=>{p(n)}),[n,p]),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)(ge,{color:t,elementWidth:y,onBeginRotate:d,scaleFactor:g}),(0,c.jsx)(fe,{color:t,elementHeight:a,elementWidth:y,rotation:f,scaleFactor:g,onBeginResize:s,disableX:x,disableY:C})]})]})},ye=({primaryColor:e,containerHeight:t,containerWidth:a,customViewbox:i,editorRef:n,elementEvent:o,guidelines:r,layoutHeight:s,layoutWidth:d,targetedElements:h,scale:u,selectedElement:m,onElementEvent:f,onElementSelected:g,onSequenceStart:w})=>{const{state:y}=Q(),{getLayoutById:S}=B(),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:te.Translate})}),[f]),I=(0,l.useCallback)(((e,t)=>{w(),f({type:te.Resize,relativeAxis:e,screenAxis:t})}),[f]),N=(0,l.useCallback)((()=>{w(),f({type:te.Rotate})}),[f]),R=i||{x:0,y:0,width:d,height:s},O=u*(Math.sqrt(R.width*R.height)/1e3)*(100/Math.sqrt(t*a))*Math.sqrt((M=a/t,Math.exp(Math.abs(Math.log(M)))));var M;const T=v.layoutState.elements.findIndex((({id:e})=>e===m)),A=[...v.layoutState.elements];return T>=0&&A.push(A.splice(T,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)(we,{color:e,id:t.id,selected:a,highlighted:n,pressed:i,x:t.x,y:t.y,disableX:t.type===p.LayoutElementType.Frame,disableY:t.type===p.LayoutElementType.Textbox||t.type===p.LayoutElementType.Frame,width:t.width,height:t.height,rotation:t.rotation,immutable:t.immutable||h&&!h.includes(t.id),onSelected:g,onBeginMove:E,onBeginResize:I,onBeginRotate:N,onPointerEnter:b,onPointerLeave:k,scaleFactor:O},t.id)}))]})},Se=e=>{const{color:t,editorRef:a,zoomableElementRef:i,interactionElementRef:n,guidelines:o,isMakingAdjustments:r,viewmask:s,visibleLayoutId:d,xTranslation:h,yTranslation:p,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}=B(),I=E(d),N=I.layoutState,{state:R}=Q(),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 g(e,t)}return g(e)}),[g,s]),M=(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:O,onKeyUp:w,onPointerDown:S,onPointerMoveCapture:M,onPointerUp:v,onWheelCapture:x,ref:n,tabIndex:-1,children:(0,c.jsxs)("div",{ref:i,style:{height:"100%",transform:`scale(${R.zoom}) translate(${h}px, ${p}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)(ye,{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})]})})},ve=({color:e,borderRadius:a,guidelineColor:i,handleContextMenu:n,onElementSelected:o})=>{const{commandDispatcher:r,getLayoutById:s}=B(),{state:d,uiDispatcher:h}=Q(),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}=pe(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===p.LayoutElementType.Textbox){const a=i.algorithm;(!a||a===p.TextAlgorithm.Autosize)&&r(new(0,t.FontAlgorithmCommand)(e,p.TextAlgorithm.Traditional))}o&&o(e,a),h(new Z({selectedElement:e}))}),[r,s,d.layoutId,h]);return(0,c.jsx)(Se,{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})};function xe(e,t,a){return t in e?Object.defineProperty(e,t,{value:a,enumerable:!0,configurable:!0,writable:!0}):e[t]=a,e}const Ce=new class{constructor(){xe(this,"server",void 0),xe(this,"cache",new Map),xe(this,"materialCache",new Map),xe(this,"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)}})),this.server=q}async getLocalOrFromServer(e){if(this.cache.has(e))return this.cache.get(e);const t=(async()=>(await q.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 q.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}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 be{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 ke{constructor(){var e,t,a;e=this,t="storage",a=new Map,t in e?Object.defineProperty(e,t,{value:a,enumerable:!0,configurable:!0,writable:!0}):e[t]=a}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 Ee=(()=>{try{return localStorage?new be:new ke}catch{return console.warn("Local storage was unavilable due to browser security settings. Using in-memory storage instead."),new ke}})(),Ie=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"),h=require("lodash.isequal"),p=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"),O=require("papyrus/build/main/text/algorithm/autosize"),M=require("papyrus/build/main/generation");function T(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}function L(e,t,a){return t in e?Object.defineProperty(e,t,{value:a,enumerable:!0,configurable:!0,writable:!0}):e[t]=a,e}T(module.exports,"Client",(()=>Ut)),T(module.exports,"CommandContext",(()=>$eb7869949b641a40$re_export$CommandContext)),T(module.exports,"spiffCoreConfiguration",(()=>V)),T(module.exports,"PromiseQueue",(()=>He)),T(module.exports,"QueueablePromise",(()=>Ge)),T(module.exports,"MockWorkflowManager",(()=>Ft)),T(module.exports,"InformationMessageType",(()=>Ct)),T(module.exports,"assetService",(()=>Ce)),T(module.exports,"optionService",(()=>P)),T(module.exports,"server",(()=>q)),T(module.exports,"persistenceService",(()=>Ee)),T(module.exports,"graphQlManager",(()=>W)),T(module.exports,"toast",(()=>gt)),T(module.exports,"FrameService",(()=>Ze)),T(module.exports,"frameStepService",(()=>rt)),T(module.exports,"modelStepService",(()=>lt)),T(module.exports,"materialStepService",(()=>st)),T(module.exports,"patchworkStepService",(()=>pt)),T(module.exports,"shapeStepService",(()=>mt)),T(module.exports,"questionStepService",(()=>Pe)),T(module.exports,"digitalContentStepService",(()=>ot)),T(module.exports,"moduleStepService",(()=>ct)),T(module.exports,"pictureStepService",(()=>ut)),T(module.exports,"textStepService",(()=>vt)),T(module.exports,"illustrationStepService",(()=>Je)),T(module.exports,"svgObjectURL",(()=>Qe)),T(module.exports,"generate",(()=>de)),T(module.exports,"CreateElementCommand",(()=>$eb7869949b641a40$re_export$CreateElementCommand)),T(module.exports,"TextChangeCommand",(()=>$eb7869949b641a40$re_export$TextChangeCommand)),T(module.exports,"FontAlignmentCommand",(()=>$eb7869949b641a40$re_export$FontAlignmentCommand)),T(module.exports,"FontColorCommand",(()=>$eb7869949b641a40$re_export$FontColorCommand)),T(module.exports,"LayoutElementFactory",(()=>$eb7869949b641a40$re_export$LayoutElementFactory)),T(module.exports,"minZoom",(()=>he)),T(module.exports,"AdvancedEditor",(()=>ve)),T(module.exports,"EditorCore",(()=>Se)),T(module.exports,"useLayouts",(()=>B)),T(module.exports,"useEditorState",(()=>Q)),T(module.exports,"useEditorInteraction",(()=>pe)),T(module.exports,"commandReducer",(()=>X)),T(module.exports,"getDefaultState",(()=>H)),T(module.exports,"CommandContextContext",(()=>$)),T(module.exports,"AdvancedEditorStateProvider",(()=>Y)),T(module.exports,"AdvancedEditorContext",(()=>_)),T(module.exports,"UICommand",(()=>Z)),T(module.exports,"EditorSubMenu",(()=>K)),T(module.exports,"gatherVaryingStepAspects",(()=>ze)),T(module.exports,"SpiffCommerce3DPreviewService",(()=>$eb7869949b641a40$re_export$SpiffCommerce3DPreviewService)),T(module.exports,"ProductCameraRig",(()=>$eb7869949b641a40$re_export$ProductCameraRig));const P=new class{constructor(){L(this,"cache",new Map),L(this,"getDisplayImageSource",(e=>{if(e){const t=e.displayImage?.links.find((e=>"cdn"===e.rel));if(t)return t.href}})),L(this,"getSelectedVariant",((e,t)=>{if(e&&0!==t.length)return e.variants.find((e=>e.id===t[0]))})),L(this,"getSelectedVariants",((e,t)=>e?.variants.filter((e=>t.includes(e.id)))||[]))}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 P.getLocalOrFromServer(q,e);"Font"===t.data.type&&t.data.variants.forEach((async e=>{if(e.assetKey){const t=(await Ce.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 Ce.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 Ce.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}};function D(e,t,a){return t in e?Object.defineProperty(e,t,{value:a,enumerable:!0,configurable:!0,writable:!0}):e[t]=a,e}const V=new class{constructor(){D(this,"defaultServerUrl","https://api.spiff.com.au"),D(this,"defaultServicesApiUrl","https://services.spiff.com.au"),D(this,"serverUrl",void 0),D(this,"servicesApiUrl",void 0),D(this,"serverUrlCallbacks",void 0),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)}};function z(e,t,a){return t in e?Object.defineProperty(e,t,{value:a,enumerable:!0,configurable:!0,writable:!0}):e[t]=a,e}let U;const F=e=>{U=e},j=async()=>{const e={transactionOwnerId:U};return window.location.href.includes("/workflows/product/")?{...await new Promise((e=>{e({})})),...e}:e};const q=new class{constructor(){z(this,"client",void 0),z(this,"uncachedOperations",[]),V.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 j();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 j(),t=V.getServerUrl()+"/v2/api-docs";return await A(i)(t,{authorizations:{OAuth2:{token:{access_token:e.bearer,token_type:"Bearer"}},PartnerId:e.partnerId}})}};const W=new class{constructor(){z(this,"shadowGraphqlClient",void 0),this.shadowGraphqlClient=this.constructShadowGraphqlClient(),V.addServerUrlCallback((()=>{this.shadowGraphqlClient=this.constructShadowGraphqlClient()}))}getShadowGraphqlClient(){return this.shadowGraphqlClient}constructShadowGraphqlClient(){const e=(0,n.createHttpLink)({uri:`${V.getServerUrl()}/graphql`,fetch:A(s)}),t=(0,o.setContext)((async(e,{headers:t})=>{const a=t||{},i=await j();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"})}},$=(0,l.createContext)(new(0,e.CommandContext)),B=()=>{const e=(0,l.useContext)($);(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 K;var G;(G=K||(K={})).None="None",G.FrameAdjustment="FrameAdjustment",G.FinalizeDesign="FinalizeDesign";const H=(e,t)=>({layoutId:e()[0].layoutState.layout.id,selectedElement:void 0,zoom:t,maxZoom:5,units:d.UnitOfMeasurement.Pixel,subMenu:K.None,activeModifierKeys:[],metaPressed:!1,elementEvent:void 0,scrolledMovement:!1}),X=(e,t)=>A(h)(e,t.apply(e))?e:t.apply(e),_=(0,l.createContext)({}),Y=e=>{const{getAllLayouts:t}=B(),[a,i]=(0,l.useReducer)(X,H(t,e.defaultZoom||1)),n=(0,l.useMemo)((()=>({state:a,uiDispatcher:i})),[a,i]);return(0,c.jsx)(_.Provider,{value:n,children:e.children})};class Z{constructor(e){var t,a,i;i=void 0,(a="changes")in(t=this)?Object.defineProperty(t,a,{value:i,enumerable:!0,configurable:!0,writable:!0}):t[a]=i,this.changes=e}apply(e){return{...e,...this.changes}}}const Q=()=>(0,l.useContext)(_),J=7*window.devicePixelRatio,ee=(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 h=new Set;s.forEach((e=>h.add(e.minY))),s.forEach((e=>h.add(e.maxY))),[0,o/2,o].forEach((e=>h.add(e)));const p=r.map((e=>e.y));for(let e=-315;e<=315;e+=45)p.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,h]=((e,t)=>[{x:"x"===e?t:0,y:"x"===e?0:t},{x:"x"===e?t:n,y:"x"===e?o:t}])(e,t),p="rotation"===e?null:(0,c.jsx)("line",{x1:d.x,y1:d.y,x2:h.x,y2:h.y,stroke:r||"#D61B5C",strokeDasharray:5*a,strokeWidth:1.2*a,overflow:"overlay"},`${e}-${t}-${d.x}-${d.y}-${h.x}-${h.y}`);void 0!==l&&s.push({type:e,value:t,anchorPoint:l.anchor,svgNode:p,guidelineCoordinates:[d,h]})})),s};return l.push(...y("x",Array.from(d),f,i)),l.push(...y("y",Array.from(h),g,i)),l.push(...y("rotation",p,w,i)),l};let te;var ae;let ie;var ne;(ae=te||(te={})).Translate="Translate",ae.Rotate="Rotate",ae.Resize="Resize",(ne=ie||(ie={})).ControlLeft="ControlLeft",ne.ControlRight="ControlRight",ne.Equal="Equal",ne.MetaLeft="MetaLeft",ne.MetaRight="MetaRight",ne.Minus="Minus",ne.ArrowLeft="ArrowLeft",ne.ArrowRight="ArrowRight",ne.ArrowUp="ArrowUp",ne.ArrowDown="ArrowDown",ne.AltLeft="AltLeft",ne.AltRight="AltRight",ne.Delete="Delete",ne.Backspace="Backspace";const oe=(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 ie.ArrowLeft:l=a.x-1/o();break;case ie.ArrowUp:c=a.y-1/o();break;case ie.ArrowRight:l=a.x+1/o();break;case ie.ArrowDown:c=a.y+1/o();break;default:throw new Error("Unhandled element interaction!")}const h=(0,u.getAxisAlignedBoundingBox)(l,c,a.width,a.height,a.rotation);return(!n||h.minX>=n.left&&h.maxX<=n.left+n.width&&h.minY>=n.top&&h.maxY<=n.top+n.height)&&(r=l,s=c),new(0,t.MoveCommand)(a.id,r,s)};var re=0,se=0,le=0;const ce=(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,h=e.movementY/l,g=a.rotation*Math.PI/180,w=Math.sin(g),y=Math.cos(g);let S;switch(n.type){case te.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+h*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+h*w,i=a.width+e;let n=a.height;if(a.type===p.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+h*w,i=a.x+e,n=a.width-e;let o=a.height;if(a.type===p.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+h*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+h*w,i=a.width+e;let n=a.height+e,o=a.y-e,r=a.fontSize;if(a.type===p.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+-h*w,i=a.x-e,n=a.width+e;let o=a.y-e,r=a.height+e,s=a.fontSize;if(a.type===p.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+h*w,i=a.width+e;let n=a.height+e,o=a.fontSize;if(a.type===p.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+-h*w,i=a.width+e;let n=a.x-e,o=a.height+e,r=a.fontSize;if(a.type===p.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 te.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)le=0,C=(a.rotation+E-I)%360;else{le+=Math.sqrt(c**2+h**2);const e=Math.abs(le)>J/s;C=e?(a.rotation+E-I)%360:o.find((e=>"rotation"===e.type))?.value||0,e&&(le=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 te.Translate:let N,R,O=a.x,M=a.y;if(0===o.filter((e=>"rotation"!==e.type)).length)re=0,se=0,N=a.x+c,R=a.y+h;else{const e=o.find((e=>"x"===e.type)),t=o.find((e=>"y"===e.type));e||(re=0),t||(se=0);const i=Math.abs(re)>J/s,n=Math.abs(se)>J/l;N=e?i?a.x+re:a.x:a.x+c,R=t?n?a.y+se:a.y:a.y+h,re=i?0:re+c,se=n?0:se+h}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)&&(O=N,M=R),{top:M,left:O,width:a.width,height:a.height,rotation:a.rotation}}})(e,a,i,n,o,r,s),c=[];if(i.type===p.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===p.LayoutElementType.Textbox){const e=i;l.fontSize&&e.fontSize!==l.fontSize&&c.push(new(0,t.FontSizeCommand)(e.id,l.fontSize))}return c},de=()=>{const e=()=>Math.floor(65536*(1+Math.random())).toString(16).substring(1);return e()+e()+"-"+e()+"-"+e()+"-"+e()+"-"+e()+e()+e()},he=.5,pe=(e,a,i,n,o,r,s)=>{const{state:c,uiDispatcher:d}=(0,l.useContext)(_),{getLayoutById:h,getReducerState:p,flattenSequence:u}=B(),[m,f]=(0,l.useState)(void 0),[g,w]=(0,l.useState)(void 0),y=h(c.layoutId);(0,l.useEffect)((()=>{if("adjustment"===o&&e?.current&&n){if(n<he)return void d(new Z({zoom:he}));if(n>c.maxZoom)return void d(new Z({zoom:c.maxZoom}));d(new Z({zoom:n}))}}),[n,d,e,o,c.maxZoom]);const S=(0,l.useCallback)(((e,t)=>{d(new Z({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 Z({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(ie.ControlLeft)||e.includes(ie.MetaLeft)||e.includes(ie.ControlRight)||e.includes(ie.MetaRight);if(!c.selectedElement||!t||a)return[];const i=t&&t.type===te.Translate,n=t&&t.type===te.Rotate,o=y.layoutState.elements.find((e=>e.id===c.selectedElement));return(i||n)&&o?ee(o,y.layoutState,C,s):[]}),[c.selectedElement,c.elementEvent,c.activeModifierKeys,y.layoutState,C]),k=(0,l.useCallback)((()=>{const e=de();f(e),w(p().transaction)}),[p]),E=(0,l.useCallback)((()=>{d(new Z({selectedElement:void 0}))}),[d]),I=(0,l.useCallback)((()=>{d(new Z({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)(ce(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 Z({elementEvent:e}))}),[d]),O=(0,l.useCallback)((()=>{d(new Z({elementEvent:void 0})),m&&g&&(u(m,g),f(void 0),w(void 0))}),[d,m,g,u]),M=(0,l.useCallback)(((e,a)=>{let i=c.zoom;const n=c.maxZoom,s=c.selectedElement,l=c.activeModifierKeys;if((l.includes(ie.AltLeft)||l.includes(ie.AltRight))&&(e.code===ie.Equal||e.code===ie.Minus)){const t=.05*n;e.code===ie.Equal?d(new Z({zoom:i+t<=n?i+=t:i})):d(new Z({zoom:i-t>=he?i-t:i}))}const h=y.layoutState.elements.find((e=>e.id===s));if(s&&h){if(e.code===ie.MetaLeft||e.code===ie.ControlLeft||e.code===ie.MetaRight||e.code===ie.ControlRight){const t=e.code,a=c.activeModifierKeys;if(!a.includes(t))return d(new Z({activeModifierKeys:a.concat(t)}))}if(e.code===ie.ArrowDown||e.code===ie.ArrowUp||e.code===ie.ArrowLeft||e.code===ie.ArrowRight){d(new Z({elementEvent:{type:te.Translate}}));const t=oe(e.code,h,c.units,a);r(t),d(new Z({elementEvent:void 0}))}e.code!==ie.Delete&&e.code!==ie.Backspace||"advanced"!==o||(d(new Z({selectedElement:void 0})),r(new(0,t.DeleteElementCommand)(h.id)))}}),[r,d,y.layoutState.elements,o,c.activeModifierKeys,c.maxZoom,c.selectedElement,c.units,c.zoom]),T=(0,l.useCallback)((e=>{if(e.code===ie.MetaLeft||e.code===ie.ControlLeft||e.code===ie.MetaRight||e.code===ie.ControlRight){const t=c.activeModifierKeys,a=e.code;d(new Z({activeModifierKeys:t.filter((e=>e!==a))}))}}),[d,c.activeModifierKeys]);return{guidelines:b,scale:C,zoomableElementRef:i,setElementEvent:R,handleZoom:S,handleKeyDown:M,handleKeyUp:T,handlePointerPressedBackground:E,handlePointerReleased:O,handlePointerMove:N,handleScroll:I,handleSequenceStart:k}},ue=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})},me=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})},fe=e=>{const{color:t,elementHeight:a,elementWidth:i,onBeginResize:n,rotation:o,scaleFactor:r,disableX:s,disableY:h}=e,p=7.5*r,m=3*r,f=28*r,g=6*r,w=1.2*r,y=a-2*p,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)(ue,{x:0,y:0,cursorStyle:"nwse-resize",onPointerDown:k,handleClass:"cornerNorthWest",cornerRadius:p,color:t,strokeWidth:w}),R?(0,c.jsx)(ue,{x:i,y:0,cursorStyle:"nesw-resize",onPointerDown:E,handleClass:"cornerNorthEast",cornerRadius:p,color:t,strokeWidth:w}):void 0,R?(0,c.jsx)(ue,{x:i,y:a,cursorStyle:"nwse-resize",onPointerDown:N,handleClass:"cornerSouthEast",cornerRadius:p,color:t,strokeWidth:w}):void 0,R?(0,c.jsx)(ue,{x:0,y:a,cursorStyle:"nesw-resize",onPointerDown:I,handleClass:"cornerSouthWest",cornerRadius:p,color:t,strokeWidth:w}):void 0,R&&!s?(0,c.jsx)(me,{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&&!h?(0,c.jsx)(me,{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)(me,{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&&!h?(0,c.jsx)(me,{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]})},ge=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"})]})]})},we=e=>{const{color:t,height:a,highlighted:i,id:n,immutable:o,onBeginMove:r,onBeginResize:s,onBeginRotate:d,onPointerEnter:h,onPointerLeave:p,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)((()=>{h(n)}),[n,h]),I=(0,l.useCallback)((()=>{p(n)}),[n,p]),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)(ge,{color:t,elementWidth:y,onBeginRotate:d,scaleFactor:g}),(0,c.jsx)(fe,{color:t,elementHeight:a,elementWidth:y,rotation:f,scaleFactor:g,onBeginResize:s,disableX:x,disableY:C})]})]})},ye=({primaryColor:e,containerHeight:t,containerWidth:a,customViewbox:i,editorRef:n,elementEvent:o,guidelines:r,layoutHeight:s,layoutWidth:d,targetedElements:h,scale:u,selectedElement:m,onElementEvent:f,onElementSelected:g,onSequenceStart:w})=>{const{state:y}=Q(),{getLayoutById:S}=B(),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:te.Translate})}),[f]),I=(0,l.useCallback)(((e,t)=>{w(),f({type:te.Resize,relativeAxis:e,screenAxis:t})}),[f]),N=(0,l.useCallback)((()=>{w(),f({type:te.Rotate})}),[f]),R=i||{x:0,y:0,width:d,height:s},O=u*(Math.sqrt(R.width*R.height)/1e3)*(100/Math.sqrt(t*a))*Math.sqrt((M=a/t,Math.exp(Math.abs(Math.log(M)))));var M;const T=v.layoutState.elements.findIndex((({id:e})=>e===m)),A=[...v.layoutState.elements];return T>=0&&A.push(A.splice(T,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)(we,{color:e,id:t.id,selected:a,highlighted:n,pressed:i,x:t.x,y:t.y,disableX:t.type===p.LayoutElementType.Frame,disableY:t.type===p.LayoutElementType.Textbox||t.type===p.LayoutElementType.Frame,width:t.width,height:t.height,rotation:t.rotation,immutable:t.immutable||h&&!h.includes(t.id),onSelected:g,onBeginMove:E,onBeginResize:I,onBeginRotate:N,onPointerEnter:b,onPointerLeave:k,scaleFactor:O},t.id)}))]})},Se=e=>{const{color:t,editorRef:a,zoomableElementRef:i,interactionElementRef:n,guidelines:o,isMakingAdjustments:r,viewmask:s,visibleLayoutId:d,xTranslation:h,yTranslation:p,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}=B(),I=E(d),N=I.layoutState,{state:R}=Q(),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 g(e,t)}return g(e)}),[g,s]),M=(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:O,onKeyUp:w,onPointerDown:S,onPointerMoveCapture:M,onPointerUp:v,onWheelCapture:x,ref:n,tabIndex:-1,children:(0,c.jsxs)("div",{ref:i,style:{height:"100%",transform:`scale(${R.zoom}) translate(${h}px, ${p}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)(ye,{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})]})})},ve=({color:e,borderRadius:a,guidelineColor:i,handleContextMenu:n,onElementSelected:o})=>{const{commandDispatcher:r,getLayoutById:s}=B(),{state:d,uiDispatcher:h}=Q(),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}=pe(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===p.LayoutElementType.Textbox){const a=i.algorithm;(!a||a===p.TextAlgorithm.Autosize)&&r(new(0,t.FontAlgorithmCommand)(e,p.TextAlgorithm.Traditional))}o&&o(e,a),h(new Z({selectedElement:e}))}),[r,s,d.layoutId,h]);return(0,c.jsx)(Se,{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})};function xe(e,t,a){return t in e?Object.defineProperty(e,t,{value:a,enumerable:!0,configurable:!0,writable:!0}):e[t]=a,e}const Ce=new class{constructor(){xe(this,"server",void 0),xe(this,"cache",new Map),xe(this,"materialCache",new Map),xe(this,"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)}})),this.server=q}async getLocalOrFromServer(e){if(this.cache.has(e))return this.cache.get(e);const t=(async()=>(await q.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 q.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}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 be{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 ke{constructor(){var e,t,a;e=this,t="storage",a=new Map,t in e?Object.defineProperty(e,t,{value:a,enumerable:!0,configurable:!0,writable:!0}):e[t]=a}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 Ee=(()=>{try{return localStorage?new be:new ke}catch{return console.warn("Local storage was unavilable due to browser security settings. Using in-memory storage instead."),new ke}})(),Ie=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
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{CommandContext as e,getSvgString as t}from"papyrus/build/main/CommandContext";import{CreateElementCommand as a,TextChangeCommand as i,FontAlignmentCommand as n,FontColorCommand as o,FontAlgorithmCommand as s,GroupCommand as r,DeleteElementCommand as l,MoveCommand as c,ResizeCommand as d,RotateCommand as h,FontSizeCommand as p,UpdateWorkflowStateCommand as u,UpdateFramePattern as m,IllustrationColorCommand as f,IllustrationCacheCommand as g,ShiftPatchworkCommand as w,FontSourceCommand as y,CreateLayoutCommand as v}from"papyrus/build/main/command";import{LayoutElementFactory as S}from"papyrus/build/main/Elements/factory";import{SpiffCommerce3DPreviewService as b,ProductCameraRig as C}from"spiff-preview";import{loadFontFromExternalUrl as x,getFontMetrics as k}from"papyrus/build/main/font";import I from"swagger-client";import{createHttpLink as E,InMemoryCache as N,ApolloClient as R,from as O,gql as M}from"@apollo/client";import{setContext as P}from"@apollo/client/link/context";import{onError as L}from"@apollo/client/link/error";import D from"cross-fetch";import{createContext as A,useContext as T,useEffect as z,useState as V,useReducer as U,useMemo as F,useRef as W,useCallback as j}from"react";import{jsx as q,jsxs as $,Fragment as B}from"react/jsx-runtime";import{UnitOfMeasurement as K,ScaleAxis as H}from"papyrus/build/main/types";import X from"lodash.isequal";import{LayoutElementType as G,TextAlgorithm as Y}from"papyrus/build/main/LayoutsState/types";import{getAxisAlignedBoundingBox as Z,isCloseToValue as Q,mmPerPixel as _,cmPerPixel as J,getElementVertices as ee,rotateAroundPoint as te,findAngle as ae,currentDirection as ie}from"papyrus/build/main/math";import{calculateTextboxLines as ne}from"papyrus/build/main/text/algorithm/traditional";import{defaultLineHeightFactor as oe,applyTextTransformations as se}from"papyrus/build/main/text/shared";import{getAttributesFromArrayBuffer as re}from"papyrus/build/main/image";import le,{Canvg as ce}from"canvg";import{StepType as de,StepAspectType as he}from"papyrus/build/main/generation/Workflow";import pe from"lodash.clonedeep";import ue from"papyrus/build/main/module/resolver";import me from"lodash.debounce";import{getFrameData as fe,calculateOffsets as ge,frameDataCache as we,generateDefaultRectangleFrameSvg as ye,GetSVGDimensions as ve,patternImageDataCache as Se}from"papyrus/build/main/frame";import{generateSVGWithUnknownColors as be,modifySVGWithElementProperties as Ce,sanitizeSvgTree as xe}from"papyrus/build/main/illustration";import{findElement as ke,rehydrateSerializedLayout as Ie}from"papyrus/build/main/LayoutsState";import{toString as Ee}from"qrcode";import{fetchAsString as Ne}from"papyrus/build/main/crossplatform";import Re from"react-dom/server";import Oe from"papyrus/build/main/Elements/Patchwork";import{determineCorrectFontSizeAndLines as Me}from"papyrus/build/main/text/algorithm/autosize";import{generateCommands as Pe}from"papyrus/build/main/generation";function Le(e,t,a){return t in e?Object.defineProperty(e,t,{value:a,enumerable:!0,configurable:!0,writable:!0}):e[t]=a,e}const De=new class{constructor(){Le(this,"cache",new Map),Le(this,"getDisplayImageSource",(e=>{if(e){const t=e.displayImage?.links.find((e=>"cdn"===e.rel));if(t)return t.href}})),Le(this,"getSelectedVariant",((e,t)=>{if(e&&0!==t.length)return e.variants.find((e=>e.id===t[0]))})),Le(this,"getSelectedVariants",((e,t)=>e?.variants.filter((e=>t.includes(e.id)))||[]))}async cacheRequiredOptions(e){const t=e.steps.map((e=>e.optionId)).filter((e=>void 0!==e)),a=e.steps.map((e=>e.data.colourOptionId)).filter((e=>void 0!==e)),i=[...new Set([...t,...a])].map((async e=>{const t=await De.getLocalOrFromServer(We,e);"Font"===t.data.type&&t.data.variants.forEach((async e=>{if(e.assetKey){const t=(await bt.getLocalOrFromServer(e.assetKey)).links.find((e=>"cdn"===e.rel))?.href;t&&await x(t)}}))}));await Promise.allSettled([...i])}async getLocalOrFromServer(e,t){if(this.cache.has(t))return this.cache.get(t);const a=(await e.execute("getOptionV2",{id:t})).body;return this.cache.set(t,a),a}getLocalOrUndefined(e){if(e)return this.cache.get(e)}async getAssetTileImageForVariant(e){if(e.thumbnailKey){const t=await bt.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 bt.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}};function Ae(e,t,a){return t in e?Object.defineProperty(e,t,{value:a,enumerable:!0,configurable:!0,writable:!0}):e[t]=a,e}const Te=new class{constructor(){Ae(this,"defaultServerUrl","https://api.spiff.com.au"),Ae(this,"defaultServicesApiUrl","https://services.spiff.com.au"),Ae(this,"serverUrl",void 0),Ae(this,"servicesApiUrl",void 0),Ae(this,"serverUrlCallbacks",void 0),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)}};function ze(e,t,a){return t in e?Object.defineProperty(e,t,{value:a,enumerable:!0,configurable:!0,writable:!0}):e[t]=a,e}let Ve;const Ue=e=>{Ve=e},Fe=async()=>({transactionOwnerId:Ve});const We=new class{constructor(){ze(this,"client",void 0),ze(this,"uncachedOperations",[]),Te.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 Fe();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 Fe(),t=Te.getServerUrl()+"/v2/api-docs";return await I(t,{authorizations:{OAuth2:{token:{access_token:e.bearer,token_type:"Bearer"}},PartnerId:e.partnerId}})}};const je=new class{constructor(){ze(this,"shadowGraphqlClient",void 0),this.shadowGraphqlClient=this.constructShadowGraphqlClient(),Te.addServerUrlCallback((()=>{this.shadowGraphqlClient=this.constructShadowGraphqlClient()}))}getShadowGraphqlClient(){return this.shadowGraphqlClient}constructShadowGraphqlClient(){const e=E({uri:`${Te.getServerUrl()}/graphql`,fetch:D}),t=P((async(e,{headers:t})=>{const a=t||{},i=await Fe();return i.bearer&&(a.Authorization=`Bearer ${i.bearer}`),i.partnerId&&(a.partnerId=i.partnerId),i.activeIntegration&&(a.activeIntegration=i.activeIntegration),i.transactionOwnerId&&(a.transactionOwnerId=i.transactionOwnerId),{headers:a}})),a=L((({operation:e,graphQLErrors:t,networkError:a})=>{(t||[]).forEach((({message:t,locations:a,path:i})=>{console.log("[GraphQL Operation Error]"),console.log("Name:"+e.operationName),console.log("Query:"+JSON.stringify(e.query)),console.log(`Message: ${t}, Location: ${JSON.stringify(a,null,2)}, Path: ${i}`),console.log("Variables:"+JSON.stringify(e.variables))})),a&&console.log("GraphQL Network error")}));const i=new N({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 R({link:O([a,t,e]),cache:i,name:"Core"})}},qe=A(new e),$e=()=>{const e=T(qe);z((()=>{e.registerStateCallback((()=>{a(new Date)}))}),[e]);const[t,a]=V(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 Be;var Ke;(Ke=Be||(Be={})).None="None",Ke.FrameAdjustment="FrameAdjustment",Ke.FinalizeDesign="FinalizeDesign";const He=(e,t)=>({layoutId:e()[0].layoutState.layout.id,selectedElement:void 0,zoom:t,maxZoom:5,units:K.Pixel,subMenu:Be.None,activeModifierKeys:[],metaPressed:!1,elementEvent:void 0,scrolledMovement:!1}),Xe=(e,t)=>X(e,t.apply(e))?e:t.apply(e),Ge=A({}),Ye=e=>{const{getAllLayouts:t}=$e(),[a,i]=U(Xe,He(t,e.defaultZoom||1)),n=F((()=>({state:a,uiDispatcher:i})),[a,i]);return q(Ge.Provider,{value:n,children:e.children})};class Ze{constructor(e){var t,a,i;i=void 0,(a="changes")in(t=this)?Object.defineProperty(t,a,{value:i,enumerable:!0,configurable:!0,writable:!0}):t[a]=i,this.changes=e}apply(e){return{...e,...this.changes}}}const Qe=()=>T(Ge),_e=7*window.devicePixelRatio,Je=(e,t,a,i)=>{const n=t.layout.width,o=t.layout.height,s=t.elements.filter((t=>t.id!==e.id&&!t.immutable&&!t.productOverlay)),r=s.map((e=>Z(e.x,e.y,e.width,e.height,e.rotation))),l=[],c=new Set;r.forEach((e=>c.add(e.minX))),r.forEach((e=>c.add(e.maxX))),[0,n/2,n].forEach((e=>c.add(e)));const d=new Set;r.forEach((e=>d.add(e.minY))),r.forEach((e=>d.add(e.maxY))),[0,o/2,o].forEach((e=>d.add(e)));const h=s.map((e=>e.y));for(let e=-315;e<=315;e+=45)h.push(e);const p=Z(e.x,e.y,e.width,e.height,e.rotation),u=[{value:p.minX,anchor:-1},{value:p.minX+(p.maxX-p.minX)/2,anchor:0},{value:p.minX+(p.maxX-p.minX),anchor:1}],m=[{value:p.minY,anchor:-1},{value:p.minY+(p.maxY-p.minY)/2,anchor:0},{value:p.minY+(p.maxY-p.minY),anchor:1}],f=[{value:e.rotation,anchor:0}],g=(e,t,i,s)=>{const r=[];return t.forEach((t=>{const l=i.find((e=>Q(t,e.value,2*a))),[c,d]=((e,t)=>[{x:"x"===e?t:0,y:"x"===e?0:t},{x:"x"===e?t:n,y:"x"===e?o:t}])(e,t),h="rotation"===e?null:q("line",{x1:c.x,y1:c.y,x2:d.x,y2:d.y,stroke:s||"#D61B5C",strokeDasharray:5*a,strokeWidth:1.2*a,overflow:"overlay"},`${e}-${t}-${c.x}-${c.y}-${d.x}-${d.y}`);void 0!==l&&r.push({type:e,value:t,anchorPoint:l.anchor,svgNode:h,guidelineCoordinates:[c,d]})})),r};return l.push(...g("x",Array.from(c),u,i)),l.push(...g("y",Array.from(d),m,i)),l.push(...g("rotation",h,f,i)),l};let et;var tt;let at;var it;(tt=et||(et={})).Translate="Translate",tt.Rotate="Rotate",tt.Resize="Resize",(it=at||(at={})).ControlLeft="ControlLeft",it.ControlRight="ControlRight",it.Equal="Equal",it.MetaLeft="MetaLeft",it.MetaRight="MetaRight",it.Minus="Minus",it.ArrowLeft="ArrowLeft",it.ArrowRight="ArrowRight",it.ArrowUp="ArrowUp",it.ArrowDown="ArrowDown",it.AltLeft="AltLeft",it.AltRight="AltRight",it.Delete="Delete",it.Backspace="Backspace";const nt=(e,t,a,i)=>{const n=()=>{switch(a){case K.Pixel:return 1;case K.Millimeter:return _;case K.Centimeter:return J;default:throw new Error("Unknown unit of measurement")}};let o=t.x,s=t.y,r=t.x,l=t.y;switch(e){case at.ArrowLeft:r=t.x-1/n();break;case at.ArrowUp:l=t.y-1/n();break;case at.ArrowRight:r=t.x+1/n();break;case at.ArrowDown:l=t.y+1/n();break;default:throw new Error("Unhandled element interaction!")}const d=Z(r,l,t.width,t.height,t.rotation);return(!i||d.minX>=i.left&&d.maxX<=i.left+i.width&&d.minY>=i.top&&d.maxY<=i.top+i.height)&&(o=r,s=l),new c(t.id,o,s)};var ot=0,st=0,rt=0;const lt=(e,t,a,n,o,s,r)=>{const l=((e,t,a,i,n,o,s)=>{const r=i.width/t.width,l=i.height/t.height,c=e.movementX/r,d=e.movementY/l,h=a.rotation*Math.PI/180,p=Math.sin(h),u=Math.cos(h);let m;switch(n.type){case et.Resize:let t={top:a.y,left:a.x,width:a.width,height:a.height,rotation:a.rotation,fontSize:a.fontSize},f=t;switch(n.screenAxis){case H.North:{const e=-c*p+d*u,i=a.y+e,n=a.height-e,o=ee({...a}).center,s=ee({...a,y:i,height:n}).center,r=te(s,o,h),l=r.x-a.width/2,m=r.y-n/2;f={...t,left:l,top:m,height:n}}break;case H.East:{const e=c*u+d*p,i=a.width+e;let n=a.height;if(a.type===G.Textbox){const e=a;n=ne(e.fontSize,e.fontData,e,e.input||e.text||"",e.lineHeight).requiredHeight}const o=ee({...a}).center,s=ee({...a,width:i,height:n}).center,r=te(s,o,h),l=r.x-i/2,m=r.y-n/2;f={...t,left:l,top:m,width:i,height:n}}break;case H.West:{const e=c*u+d*p,i=a.x+e,n=a.width-e;let o=a.height;if(a.type===G.Textbox){const e=a;o=ne(e.fontSize,e.fontData,e,e.input||e.text||"",e.lineHeight).requiredHeight}const s=ee({...a}).center,r=ee({...a,width:n,height:o,x:i}).center,l=te(r,s,h),m=l.x-n/2,g=l.y-o/2;f={...t,left:m,top:g,width:n,height:o}}break;case H.South:{const e=-c*p+d*u,i=a.height+e,n=ee({...a}).center,o=ee({...a,height:i}).center,s=te(o,n,h),r=s.x-a.width/2,l=s.y-i/2;f={...t,left:r,top:l,height:i}}break;case H.Northeast:{const e=c*u+d*p,i=a.width+e;let n=a.height+e,o=a.y-e,s=a.fontSize;if(a.type===G.Textbox){const t=a;s=t.fontSize+e/8,n=ne(s,t.fontData,t,t.input||t.text||"",t.lineHeight).requiredHeight;const i=t.lineHeight||oe;o=a.y-e*i/8}const r=ee({...a}).center,l=ee({...a,width:i,height:n,y:o}).center,m=te(l,r,h),g=m.x-i/2,w=m.y-n/2;f={...t,left:g,top:w,width:i,height:n,fontSize:s}}break;case H.Northwest:{const e=-c*u+-d*p,i=a.x-e,n=a.width+e;let o=a.y-e,s=a.height+e,r=a.fontSize;if(a.type===G.Textbox){const t=a;r=t.fontSize+e/8,s=ne(r,t.fontData,t,t.input||t.text||"",t.lineHeight).requiredHeight;const i=t.lineHeight||oe;o=a.y-e*i/8}const l=ee({...a}).center,m=ee({...a,x:i,y:o,width:n,height:s}).center,g=te(m,l,h),w=g.x-n/2,y=g.y-s/2;f={...t,left:w,top:y,width:n,height:s,fontSize:r}}break;case H.Southeast:{const e=c*u+d*p,i=a.width+e;let n=a.height+e,o=a.fontSize;if(a.type===G.Textbox){const t=a;o=t.fontSize+e/8,n=ne(o,t.fontData,t,t.input||t.text||"",t.lineHeight).requiredHeight}const s=ee({...a}).center,r=ee({...a,width:i,height:n}).center,l=te(r,s,h),m=l.x-i/2,g=l.y-n/2;f={...t,left:m,top:g,width:i,height:n,fontSize:o}}break;case H.Southwest:{const e=-c*u+-d*p,i=a.width+e;let n=a.x-e,o=a.height+e,s=a.fontSize;if(a.type===G.Textbox){const t=a;s=t.fontSize+e/8,o=ne(s,t.fontData,t,t.input||t.text||"",t.lineHeight).requiredHeight}const r=ee({...a}).center,l=ee({...a,width:i,height:o,x:n}).center,m=te(l,r,h),g=m.x-i/2,w=m.y-o/2;f={...t,left:g,top:w,width:i,height:o,fontSize:s}}}return m=Z(f.left,f.top,f.width,f.height,f.rotation),(!s||m.minX>=s.left&&m.maxX<=s.left+s.width&&m.minY>=s.top&&m.maxY<=s.top+s.height)&&(t=f),t;case et.Rotate:const g={x:e.clientX,y:e.clientY};let w,y=a.rotation;const v=ee(a,i,{x:r,y:l}),S=ae(g,v.c,v.d),b=ae(g,v.d,v.c);if(0===o.filter((e=>"rotation"===e.type)).length)rt=0,w=(a.rotation+S-b)%360;else{rt+=Math.sqrt(c**2+d**2);const e=Math.abs(rt)>_e/r;w=e?(a.rotation+S-b)%360:o.find((e=>"rotation"===e.type))?.value||0,e&&(rt=0)}return m=Z(a.x,a.y,a.width,a.height,w),(!s||m.minX>=s.left&&m.maxX<=s.left+s.width&&m.minY>=s.top&&m.maxY<=s.top+s.height)&&(y=w),{top:a.y,left:a.x,width:a.width,height:a.height,rotation:y};case et.Translate:let C,x,k=a.x,I=a.y;if(0===o.filter((e=>"rotation"!==e.type)).length)ot=0,st=0,C=a.x+c,x=a.y+d;else{const e=o.find((e=>"x"===e.type)),t=o.find((e=>"y"===e.type));e||(ot=0),t||(st=0);const i=Math.abs(ot)>_e/r,n=Math.abs(st)>_e/l;C=e?i?a.x+ot:a.x:a.x+c,x=t?n?a.y+st:a.y:a.y+d,ot=i?0:ot+c,st=n?0:st+d}return m=Z(C,x,a.width,a.height,a.rotation),(!s||m.minX>=s.left&&m.maxX<=s.left+s.width&&m.minY>=s.top&&m.maxY<=s.top+s.height)&&(k=C,I=x),{top:I,left:k,width:a.width,height:a.height,rotation:a.rotation}}})(e,t,a,n,o,s,r),u=[];if(a.type===G.Textbox){const e=a;u.push(new i(e.id,e.text||e.input||""))}if(u.push(new c(a.id,l.left,l.top),new d(a.id,l.width,l.height),new h(a.id,l.rotation)),a.type===G.Textbox){const e=a;l.fontSize&&e.fontSize!==l.fontSize&&u.push(new p(e.id,l.fontSize))}return u},ct=()=>{const e=()=>Math.floor(65536*(1+Math.random())).toString(16).substring(1);return e()+e()+"-"+e()+"-"+e()+"-"+e()+"-"+e()+e()+e()},dt=.5,ht=(e,t,a,i,n,o,s)=>{const{state:c,uiDispatcher:d}=T(Ge),{getLayoutById:h,getReducerState:p,flattenSequence:u}=$e(),[m,f]=V(void 0),[g,w]=V(void 0),y=h(c.layoutId);z((()=>{if("adjustment"===n&&e?.current&&i){if(i<.5)return void d(new Ze({zoom:.5}));if(i>c.maxZoom)return void d(new Ze({zoom:c.maxZoom}));d(new Ze({zoom:i}))}}),[i,d,e,n,c.maxZoom]);const v=j(((e,i)=>{d(new Ze({zoom:i}));const o=t?.current?.scrollWidth-t?.current?.clientWidth!=0,s=t?.current?.scrollHeight-t?.current?.clientHeight!=0;t.current&&a.current&&!c.scrolledMovement&&"advanced"===n&&(s&&(t.current.scrollTop=a.current.offsetTop+(t.current.scrollHeight-t.current.clientHeight)/2),o&&(t.current.scrollLeft=(a.current.offsetLeft+t.current.scrollWidth-t.current.clientWidth)/2))}),[d,t,a,c.scrolledMovement,n]);z((()=>{c.zoom<=1&&d(new Ze({scrolledMovement:!1}))}),[d,c.zoom]);const S=t?.current?.getBoundingClientRect(),b=((S?.width||1)+(S?.height||1))/2,C=(y.layoutState.layout.width+y.layoutState.layout.height)/2/b/c.zoom,x=F((()=>{const e=c.activeModifierKeys,t=c.elementEvent,a=e.includes(at.ControlLeft)||e.includes(at.MetaLeft)||e.includes(at.ControlRight)||e.includes(at.MetaRight);if(!c.selectedElement||!t||a)return[];const i=t&&t.type===et.Translate,n=t&&t.type===et.Rotate,o=y.layoutState.elements.find((e=>e.id===c.selectedElement));return(i||n)&&o?Je(o,y.layoutState,C,s):[]}),[c.selectedElement,c.elementEvent,c.activeModifierKeys,y.layoutState,C]),k=j((()=>{const e=ct();f(e),w(p().transaction)}),[p]),I=j((()=>{d(new Ze({selectedElement:void 0}))}),[d]),E=j((()=>{d(new Ze({scrolledMovement:!0}))}),[d]),N=j(((a,i)=>{const n=y.layoutState.elements.find((e=>e.id===c.selectedElement));if(!(c.elementEvent&&e.current&&t.current&&c.selectedElement&&n))return;t.current.hasPointerCapture(a.pointerId)||t.current.setPointerCapture(a.pointerId);const s=e.current.getBoundingClientRect(),l=new r(lt(a,y.layoutState.layout,n,s,c.elementEvent,x,i));l.sequenceId=m,o(l)}),[y.layoutState.elements,y.layoutState.layout,c.elementEvent,e,c.selectedElement,t,x,o]),R=j((e=>{d(new Ze({elementEvent:e}))}),[d]),O=j((()=>{d(new Ze({elementEvent:void 0})),m&&g&&(u(m,g),f(void 0),w(void 0))}),[d,m,g,u]),M=j(((e,t)=>{let a=c.zoom;const i=c.maxZoom,s=c.selectedElement,r=c.activeModifierKeys;if((r.includes(at.AltLeft)||r.includes(at.AltRight))&&(e.code===at.Equal||e.code===at.Minus)){const t=.05*i;e.code===at.Equal?d(new Ze({zoom:a+t<=i?a+=t:a})):d(new Ze({zoom:a-t>=.5?a-t:a}))}const h=y.layoutState.elements.find((e=>e.id===s));if(s&&h){if(e.code===at.MetaLeft||e.code===at.ControlLeft||e.code===at.MetaRight||e.code===at.ControlRight){const t=e.code,a=c.activeModifierKeys;if(!a.includes(t))return d(new Ze({activeModifierKeys:a.concat(t)}))}if(e.code===at.ArrowDown||e.code===at.ArrowUp||e.code===at.ArrowLeft||e.code===at.ArrowRight){d(new Ze({elementEvent:{type:et.Translate}}));const a=nt(e.code,h,c.units,t);o(a),d(new Ze({elementEvent:void 0}))}e.code!==at.Delete&&e.code!==at.Backspace||"advanced"!==n||(d(new Ze({selectedElement:void 0})),o(new l(h.id)))}}),[o,d,y.layoutState.elements,n,c.activeModifierKeys,c.maxZoom,c.selectedElement,c.units,c.zoom]),P=j((e=>{if(e.code===at.MetaLeft||e.code===at.ControlLeft||e.code===at.MetaRight||e.code===at.ControlRight){const t=c.activeModifierKeys,a=e.code;d(new Ze({activeModifierKeys:t.filter((e=>e!==a))}))}}),[d,c.activeModifierKeys]);return{guidelines:x,scale:C,zoomableElementRef:a,setElementEvent:R,handleZoom:v,handleKeyDown:M,handleKeyUp:P,handlePointerPressedBackground:I,handlePointerReleased:O,handlePointerMove:N,handleScroll:E,handleSequenceStart:k}},pt=e=>{const{x:t,y:a,cursorStyle:i,onPointerDown:n,handleClass:o,cornerRadius:s,color:r,strokeWidth:l}=e;return q("circle",{className:o,cx:t,cy:a,r:s,fill:"#ffffff",style:{cursor:i},stroke:r,strokeWidth:l,onPointerDown:n})},ut=e=>{const{x:t,y:a,width:i,height:n,cursorStyle:o,onPointerDown:s,edgeHandleRadius:r,color:l,strokeWidth:c}=e;return q("rect",{x:t,y:a,width:i,height:n,rx:r,fill:"#ffffff",style:{cursor:o},stroke:l,strokeWidth:c,onPointerDown:s})},mt=e=>{const{color:t,elementHeight:a,elementWidth:i,onBeginResize:n,rotation:o,scaleFactor:s,disableX:r,disableY:l}=e,c=7.5*s,d=3*s,h=28*s,p=6*s,u=1.2*s,m=a-2*c,f=j(((e,t,a)=>{e.stopPropagation(),n(t,a)}),[n]),g=j((e=>f(e,ie(H.West,360-o),H.West)),[f,o]),w=j((e=>f(e,ie(H.East,360-o),H.East)),[f,o]),y=j((e=>f(e,ie(H.North,360-o),H.North)),[f,o]),v=j((e=>f(e,ie(H.South,360-o),H.South)),[f,o]),S=j((e=>f(e,H.Northwest,H.Northwest)),[f]),b=j((e=>f(e,H.Northeast,H.Northeast)),[f]),C=j((e=>f(e,H.Southwest,H.Southwest)),[f]),x=j((e=>f(e,H.Northeast,H.Southeast)),[f]),k=h<=m;return $(B,{children:[q(pt,{x:0,y:0,cursorStyle:"nwse-resize",onPointerDown:S,handleClass:"cornerNorthWest",cornerRadius:c,color:t,strokeWidth:u}),k?q(pt,{x:i,y:0,cursorStyle:"nesw-resize",onPointerDown:b,handleClass:"cornerNorthEast",cornerRadius:c,color:t,strokeWidth:u}):void 0,k?q(pt,{x:i,y:a,cursorStyle:"nwse-resize",onPointerDown:x,handleClass:"cornerSouthEast",cornerRadius:c,color:t,strokeWidth:u}):void 0,k?q(pt,{x:0,y:a,cursorStyle:"nesw-resize",onPointerDown:C,handleClass:"cornerSouthWest",cornerRadius:c,color:t,strokeWidth:u}):void 0,k&&!r?q(ut,{x:-p/2,y:a/2-h/2,width:p,height:h,onPointerDown:g,edgeHandleRadius:d,cursorStyle:"ew-resize",color:t,strokeWidth:u}):void 0,k&&!l?q(ut,{x:i/2-h/2,y:a-p/2,width:h,height:p,onPointerDown:v,edgeHandleRadius:d,cursorStyle:"ns-resize",color:t,strokeWidth:u}):void 0,r?void 0:q(ut,{x:i-p/2,y:a/2-Math.min(h,.8*a)/2,width:p,height:Math.min(h,.8*a),onPointerDown:w,edgeHandleRadius:d,cursorStyle:"ew-resize",color:t,strokeWidth:u}),k&&!l?q(ut,{x:i/2-h/2,y:-p/2,width:h,height:p,onPointerDown:y,edgeHandleRadius:d,cursorStyle:"ns-resize",color:t,strokeWidth:u}):void 0]})},ft=e=>{const{color:t,elementWidth:a,onBeginRotate:i,scaleFactor:n}=e,o=j((e=>{e.stopPropagation(),i()}),[i]),s=10*n,r=1.2*n;return $("g",{children:[q("circle",{cx:a/2,cy:-2.5*s,r:1.3*s,fill:"rgba(0, 0, 0, 0.5)",opacity:.4,style:{cursor:"ew-resize"},onPointerDown:o}),q("circle",{cx:a/2,cy:-2.5*s,r:s,fill:"#fff",style:{cursor:"ew-resize"},stroke:t,strokeWidth:r,onPointerDown:o}),$("svg",{x:a/2-s,y:-2.5*s-s,xmlns:"http://www.w3.org/2000/svg",style:{cursor:"ew-resize"},height:2*s,viewBox:"0 0 24 24",width:2*s,fill:t,onPointerDown:o,children:[q("path",{d:"M0 0h24v24H0z",fill:"none"}),q("path",{d:"M12 6v3l4-4-4-4v3c-4.42 0-8 3.58-8 8 0 1.57.46 3.03 1.24 4.26L6.7 14.8c-.45-.83-.7-1.79-.7-2.8 0-3.31 2.69-6 6-6zm6.76 1.74L17.3 9.2c.44.84.7 1.79.7 2.8 0 3.31-2.69 6-6 6v-3l-4 4 4 4v-3c4.42 0 8-3.58 8-8 0-1.57-.46-3.03-1.24-4.26z"})]})]})},gt=e=>{const{color:t,height:a,highlighted:i,id:n,immutable:o,onBeginMove:s,onBeginResize:r,onBeginRotate:l,onPointerEnter:c,onPointerLeave:d,onSelected:h,pressed:p,rotation:u,scaleFactor:m,selected:f,width:g,x:w,y:y,disableX:v,disableY:S}=e,b=1.2*m,C=j((e=>{2===e.button&&(e.stopPropagation(),h(n,e)),0===e.button&&(e.stopPropagation(),!f&&h(n,e),s())}),[n,f,h,s]),x=j((()=>{c(n)}),[n,c]),k=j((()=>{d(n)}),[n,d]);return $("g",{transform:`translate(${w}, ${y}) rotate(${u} ${g/2} ${a/2})`,children:[q("rect",{className:"interactableInnerRect",width:g,height:a,stroke:f||i?t:"none",pointerEvents:o?"none":"visibleFill",fill:"none",strokeWidth:b,style:{cursor:o?void 0:f?p?"grabbing":"grab":"pointer"},onPointerDown:o?void 0:C,onPointerEnter:o?void 0:x,onPointerLeave:o?void 0:k}),f&&$(B,{children:[q(ft,{color:t,elementWidth:g,onBeginRotate:l,scaleFactor:m}),q(mt,{color:t,elementHeight:a,elementWidth:g,rotation:u,scaleFactor:m,onBeginResize:r,disableX:v,disableY:S})]})]})},wt=({primaryColor:e,containerHeight:t,containerWidth:a,customViewbox:i,editorRef:n,elementEvent:o,guidelines:s,layoutHeight:r,layoutWidth:l,targetedElements:c,scale:d,selectedElement:h,onElementEvent:p,onElementSelected:u,onSequenceStart:m})=>{const{state:f}=Qe(),{getLayoutById:g}=$e(),w=g(f.layoutId),[y,v]=V(void 0),S=j((e=>{v(e)}),[]),b=j((e=>{y===e&&v(void 0)}),[y]),C=j((()=>{m(),p({type:et.Translate})}),[p]),x=j(((e,t)=>{m(),p({type:et.Resize,relativeAxis:e,screenAxis:t})}),[p]),k=j((()=>{m(),p({type:et.Rotate})}),[p]),I=i||{x:0,y:0,width:l,height:r},E=d*(Math.sqrt(I.width*I.height)/1e3)*(100/Math.sqrt(t*a))*Math.sqrt((N=a/t,Math.exp(Math.abs(Math.log(N)))));var N;const R=w.layoutState.elements.findIndex((({id:e})=>e===h)),O=[...w.layoutState.elements];return R>=0&&O.push(O.splice(R,1)[0]),$("svg",{xmlns:"http://www.w3.org/2000/svg",xmlnsXlink:"http://www.w3.org/1999/xlink",xmlSpace:"preserve",version:"1.1",style:{touchAction:"none",position:"absolute",maxWidth:"100%",maxHeight:"100%"},width:"100%",height:"100%",viewBox:`${I.x} ${I.y} ${I.width} ${I.height}`,overflow:"overlay",children:[q("rect",{fill:"none",stroke:"none",ref:n,width:l,height:r}),s.map((e=>e.svgNode)),O.map((t=>{const a=void 0!==h&&t.id===h,i=a&&void 0!==o,n=void 0!==y&&t.id===y;return q(gt,{color:e,id:t.id,selected:a,highlighted:n,pressed:i,x:t.x,y:t.y,disableX:t.type===G.Frame,disableY:t.type===G.Textbox||t.type===G.Frame,width:t.width,height:t.height,rotation:t.rotation,immutable:t.immutable||c&&!c.includes(t.id),onSelected:u,onBeginMove:C,onBeginResize:x,onBeginRotate:k,onPointerEnter:S,onPointerLeave:b,scaleFactor:E},t.id)}))]})},yt=e=>{const{color:t,editorRef:a,zoomableElementRef:i,interactionElementRef:n,guidelines:o,isMakingAdjustments:s,viewmask:r,visibleLayoutId:l,xTranslation:c,yTranslation:d,targetedElements:h,borderRadius:p,handleContextMenu:u,handleKeyDown:m,handleKeyUp:f,handlePointerMove:g,handlePointerPressedBackground:w,handlePointerReleased:y,handleScroll:v,onSequenceStart:S,setElementEvent:b,onElementSelected:C}=e,{getLayoutById:x}=$e(),k=x(l),I=k.layoutState,{state:E}=Qe(),N=j((e=>{if(r){const t={left:r.x,top:r.y,width:r.width,height:r.height,panelId:"",rotation:0};return m(e,t)}return m(e)}),[m,r]),R=j((e=>{if(r){const t={left:r.x,top:r.y,width:r.width,height:r.height,panelId:"",rotation:0};return g(e,t)}return g(e)}),[g,r]);return q("div",{style:{justifyContent:"center",position:"relative",height:"100%",width:"100%",scrollbarWidth:"none",outline:"none"},onContextMenu:u,onKeyDown:N,onKeyUp:f,onPointerDown:w,onPointerMoveCapture:R,onPointerUp:y,onWheelCapture:v,ref:n,tabIndex:-1,children:$("div",{ref:i,style:{height:"100%",transform:`scale(${E.zoom}) translate(${c}px, ${d}px)`,display:"grid",filter:"drop-shadow(rgba(0, 0, 0, 0.2) 0px 0px 6px)"},children:[e.children,k.getComponentWithProps({height:s?"100%":"auto",maxHeight:"100%",maxWidth:"100%",position:"absolute",viewmask:r,width:s?"100%":"auto",borderRadius:p}),q(wt,{primaryColor:t,containerHeight:i.current?.offsetHeight||1024,containerWidth:i.current?.offsetWidth||1024,editorRef:a,elementEvent:E.elementEvent,guidelines:o,layoutHeight:I.layout.height,layoutWidth:I.layout.width,onElementEvent:b,onSequenceStart:S,onElementSelected:C,scale:10/E.zoom,selectedElement:E.selectedElement,targetedElements:h})]})})},vt=({color:e,borderRadius:t,guidelineColor:a,handleContextMenu:i,onElementSelected:n})=>{const{commandDispatcher:o,getLayoutById:r}=$e(),{state:l,uiDispatcher:c}=Qe(),d=W(null),h=W(null),p=W(null),{guidelines:u,handleKeyDown:m,handleKeyUp:f,handlePointerMove:g,handlePointerPressedBackground:w,handlePointerReleased:y,handleScroll:v,handleSequenceStart:S,setElementEvent:b}=ht(d,h,p,void 0,"advanced",o,a),C=j(((e,t)=>{const a=r(l.layoutId).layoutState.elements.find((t=>t.id===e));if(e&&a&&a.type===G.Textbox){const t=a.algorithm;(!t||t===Y.Autosize)&&o(new s(e,Y.Traditional))}n&&n(e,t),c(new Ze({selectedElement:e}))}),[o,r,l.layoutId,c]);return q(yt,{color:e,editorRef:d,interactionElementRef:h,zoomableElementRef:p,guidelines:u,visibleLayoutId:l.layoutId,xTranslation:0,yTranslation:0,borderRadius:t,handleContextMenu:i,handleKeyDown:m,handleKeyUp:f,handlePointerMove:g,handlePointerPressedBackground:w,handlePointerReleased:y,handleScroll:v,onSequenceStart:S,setElementEvent:b,onElementSelected:C})};function St(e,t,a){return t in e?Object.defineProperty(e,t,{value:a,enumerable:!0,configurable:!0,writable:!0}):e[t]=a,e}const bt=new class{constructor(){St(this,"server",void 0),St(this,"cache",new Map),St(this,"materialCache",new Map),St(this,"loadImageAsFileInfo",(async e=>{const t=await e.arrayBuffer(),a=await re(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)}})),this.server=We}async getLocalOrFromServer(e){if(this.cache.has(e))return this.cache.get(e);const t=(async()=>(await We.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 We.execute("getMaterialV2",{id:e})).body)();return this.materialCache.set(e,t),t}async uploadAssetWithProgress(e,t,a,i,n,o){const s=await this.dispatchCreateAssetRequest(e,t,n,o);var r=new XMLHttpRequest;return r.open("PUT",s.assetResponse.uploadUrl,!0),r.setRequestHeader("Content-Type",s.mimeType),r.setRequestHeader("Cache-Control","public,max-age=31536000,immutable"),r.upload.onprogress=e=>{e.lengthComputable&&a(100*e.loaded/e.total)},r.onload=()=>{const e=s.assetResponse.asset;i(e)},r.onerror=()=>{console.warn("Asset upload failed")},r.send(e.blob),s.assetResponse.asset}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 Ct{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 xt{constructor(){var e,t,a;e=this,t="storage",a=new Map,t in e?Object.defineProperty(e,t,{value:a,enumerable:!0,configurable:!0,writable:!0}):e[t]=a}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 kt=(()=>{try{return localStorage?new Ct:new xt}catch{return console.warn("Local storage was unavilable due to browser security settings. Using in-memory storage instead."),new xt}})(),It=M`
|
|
1
|
+
import{CommandContext as e,getSvgString as t}from"papyrus/build/main/CommandContext";import{CreateElementCommand as a,TextChangeCommand as i,FontAlignmentCommand as n,FontColorCommand as o,FontAlgorithmCommand as s,GroupCommand as r,DeleteElementCommand as l,MoveCommand as c,ResizeCommand as d,RotateCommand as h,FontSizeCommand as p,UpdateWorkflowStateCommand as u,UpdateFramePattern as m,IllustrationColorCommand as f,IllustrationCacheCommand as g,ShiftPatchworkCommand as w,FontSourceCommand as y,CreateLayoutCommand as v}from"papyrus/build/main/command";import{LayoutElementFactory as S}from"papyrus/build/main/Elements/factory";import{SpiffCommerce3DPreviewService as b,ProductCameraRig as C}from"spiff-preview";import{loadFontFromExternalUrl as x,getFontMetrics as k}from"papyrus/build/main/font";import I from"swagger-client";import{createHttpLink as E,InMemoryCache as N,ApolloClient as R,from as O,gql as M}from"@apollo/client";import{setContext as P}from"@apollo/client/link/context";import{onError as L}from"@apollo/client/link/error";import D from"cross-fetch";import{createContext as A,useContext as T,useEffect as z,useState as V,useReducer as U,useMemo as F,useRef as W,useCallback as j}from"react";import{jsx as q,jsxs as $,Fragment as B}from"react/jsx-runtime";import{UnitOfMeasurement as K,ScaleAxis as H}from"papyrus/build/main/types";import X from"lodash.isequal";import{LayoutElementType as G,TextAlgorithm as Y}from"papyrus/build/main/LayoutsState/types";import{getAxisAlignedBoundingBox as Z,isCloseToValue as Q,mmPerPixel as _,cmPerPixel as J,getElementVertices as ee,rotateAroundPoint as te,findAngle as ae,currentDirection as ie}from"papyrus/build/main/math";import{calculateTextboxLines as ne}from"papyrus/build/main/text/algorithm/traditional";import{defaultLineHeightFactor as oe,applyTextTransformations as se}from"papyrus/build/main/text/shared";import{getAttributesFromArrayBuffer as re}from"papyrus/build/main/image";import le,{Canvg as ce}from"canvg";import{StepType as de,StepAspectType as he}from"papyrus/build/main/generation/Workflow";import pe from"lodash.clonedeep";import ue from"papyrus/build/main/module/resolver";import me from"lodash.debounce";import{getFrameData as fe,calculateOffsets as ge,frameDataCache as we,generateDefaultRectangleFrameSvg as ye,GetSVGDimensions as ve,patternImageDataCache as Se}from"papyrus/build/main/frame";import{generateSVGWithUnknownColors as be,modifySVGWithElementProperties as Ce,sanitizeSvgTree as xe}from"papyrus/build/main/illustration";import{findElement as ke,rehydrateSerializedLayout as Ie}from"papyrus/build/main/LayoutsState";import{toString as Ee}from"qrcode";import{fetchAsString as Ne}from"papyrus/build/main/crossplatform";import Re from"react-dom/server";import Oe from"papyrus/build/main/Elements/Patchwork";import{determineCorrectFontSizeAndLines as Me}from"papyrus/build/main/text/algorithm/autosize";import{generateCommands as Pe}from"papyrus/build/main/generation";function Le(e,t,a){return t in e?Object.defineProperty(e,t,{value:a,enumerable:!0,configurable:!0,writable:!0}):e[t]=a,e}const De=new class{constructor(){Le(this,"cache",new Map),Le(this,"getDisplayImageSource",(e=>{if(e){const t=e.displayImage?.links.find((e=>"cdn"===e.rel));if(t)return t.href}})),Le(this,"getSelectedVariant",((e,t)=>{if(e&&0!==t.length)return e.variants.find((e=>e.id===t[0]))})),Le(this,"getSelectedVariants",((e,t)=>e?.variants.filter((e=>t.includes(e.id)))||[]))}async cacheRequiredOptions(e){const t=e.steps.map((e=>e.optionId)).filter((e=>void 0!==e)),a=e.steps.map((e=>e.data.colourOptionId)).filter((e=>void 0!==e)),i=[...new Set([...t,...a])].map((async e=>{const t=await De.getLocalOrFromServer(We,e);"Font"===t.data.type&&t.data.variants.forEach((async e=>{if(e.assetKey){const t=(await bt.getLocalOrFromServer(e.assetKey)).links.find((e=>"cdn"===e.rel))?.href;t&&await x(t)}}))}));await Promise.allSettled([...i])}async getLocalOrFromServer(e,t){if(this.cache.has(t))return this.cache.get(t);const a=(await e.execute("getOptionV2",{id:t})).body;return this.cache.set(t,a),a}getLocalOrUndefined(e){if(e)return this.cache.get(e)}async getAssetTileImageForVariant(e){if(e.thumbnailKey){const t=await bt.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 bt.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}};function Ae(e,t,a){return t in e?Object.defineProperty(e,t,{value:a,enumerable:!0,configurable:!0,writable:!0}):e[t]=a,e}const Te=new class{constructor(){Ae(this,"defaultServerUrl","https://api.spiff.com.au"),Ae(this,"defaultServicesApiUrl","https://services.spiff.com.au"),Ae(this,"serverUrl",void 0),Ae(this,"servicesApiUrl",void 0),Ae(this,"serverUrlCallbacks",void 0),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)}};function ze(e,t,a){return t in e?Object.defineProperty(e,t,{value:a,enumerable:!0,configurable:!0,writable:!0}):e[t]=a,e}let Ve;const Ue=e=>{Ve=e},Fe=async()=>{const e={transactionOwnerId:Ve};return window.location.href.includes("/workflows/product/")?{...await new Promise((e=>{e({})})),...e}:e};const We=new class{constructor(){ze(this,"client",void 0),ze(this,"uncachedOperations",[]),Te.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 Fe();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 Fe(),t=Te.getServerUrl()+"/v2/api-docs";return await I(t,{authorizations:{OAuth2:{token:{access_token:e.bearer,token_type:"Bearer"}},PartnerId:e.partnerId}})}};const je=new class{constructor(){ze(this,"shadowGraphqlClient",void 0),this.shadowGraphqlClient=this.constructShadowGraphqlClient(),Te.addServerUrlCallback((()=>{this.shadowGraphqlClient=this.constructShadowGraphqlClient()}))}getShadowGraphqlClient(){return this.shadowGraphqlClient}constructShadowGraphqlClient(){const e=E({uri:`${Te.getServerUrl()}/graphql`,fetch:D}),t=P((async(e,{headers:t})=>{const a=t||{},i=await Fe();return i.bearer&&(a.Authorization=`Bearer ${i.bearer}`),i.partnerId&&(a.partnerId=i.partnerId),i.activeIntegration&&(a.activeIntegration=i.activeIntegration),i.transactionOwnerId&&(a.transactionOwnerId=i.transactionOwnerId),{headers:a}})),a=L((({operation:e,graphQLErrors:t,networkError:a})=>{(t||[]).forEach((({message:t,locations:a,path:i})=>{console.log("[GraphQL Operation Error]"),console.log("Name:"+e.operationName),console.log("Query:"+JSON.stringify(e.query)),console.log(`Message: ${t}, Location: ${JSON.stringify(a,null,2)}, Path: ${i}`),console.log("Variables:"+JSON.stringify(e.variables))})),a&&console.log("GraphQL Network error")}));const i=new N({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 R({link:O([a,t,e]),cache:i,name:"Core"})}},qe=A(new e),$e=()=>{const e=T(qe);z((()=>{e.registerStateCallback((()=>{a(new Date)}))}),[e]);const[t,a]=V(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 Be;var Ke;(Ke=Be||(Be={})).None="None",Ke.FrameAdjustment="FrameAdjustment",Ke.FinalizeDesign="FinalizeDesign";const He=(e,t)=>({layoutId:e()[0].layoutState.layout.id,selectedElement:void 0,zoom:t,maxZoom:5,units:K.Pixel,subMenu:Be.None,activeModifierKeys:[],metaPressed:!1,elementEvent:void 0,scrolledMovement:!1}),Xe=(e,t)=>X(e,t.apply(e))?e:t.apply(e),Ge=A({}),Ye=e=>{const{getAllLayouts:t}=$e(),[a,i]=U(Xe,He(t,e.defaultZoom||1)),n=F((()=>({state:a,uiDispatcher:i})),[a,i]);return q(Ge.Provider,{value:n,children:e.children})};class Ze{constructor(e){var t,a,i;i=void 0,(a="changes")in(t=this)?Object.defineProperty(t,a,{value:i,enumerable:!0,configurable:!0,writable:!0}):t[a]=i,this.changes=e}apply(e){return{...e,...this.changes}}}const Qe=()=>T(Ge),_e=7*window.devicePixelRatio,Je=(e,t,a,i)=>{const n=t.layout.width,o=t.layout.height,s=t.elements.filter((t=>t.id!==e.id&&!t.immutable&&!t.productOverlay)),r=s.map((e=>Z(e.x,e.y,e.width,e.height,e.rotation))),l=[],c=new Set;r.forEach((e=>c.add(e.minX))),r.forEach((e=>c.add(e.maxX))),[0,n/2,n].forEach((e=>c.add(e)));const d=new Set;r.forEach((e=>d.add(e.minY))),r.forEach((e=>d.add(e.maxY))),[0,o/2,o].forEach((e=>d.add(e)));const h=s.map((e=>e.y));for(let e=-315;e<=315;e+=45)h.push(e);const p=Z(e.x,e.y,e.width,e.height,e.rotation),u=[{value:p.minX,anchor:-1},{value:p.minX+(p.maxX-p.minX)/2,anchor:0},{value:p.minX+(p.maxX-p.minX),anchor:1}],m=[{value:p.minY,anchor:-1},{value:p.minY+(p.maxY-p.minY)/2,anchor:0},{value:p.minY+(p.maxY-p.minY),anchor:1}],f=[{value:e.rotation,anchor:0}],g=(e,t,i,s)=>{const r=[];return t.forEach((t=>{const l=i.find((e=>Q(t,e.value,2*a))),[c,d]=((e,t)=>[{x:"x"===e?t:0,y:"x"===e?0:t},{x:"x"===e?t:n,y:"x"===e?o:t}])(e,t),h="rotation"===e?null:q("line",{x1:c.x,y1:c.y,x2:d.x,y2:d.y,stroke:s||"#D61B5C",strokeDasharray:5*a,strokeWidth:1.2*a,overflow:"overlay"},`${e}-${t}-${c.x}-${c.y}-${d.x}-${d.y}`);void 0!==l&&r.push({type:e,value:t,anchorPoint:l.anchor,svgNode:h,guidelineCoordinates:[c,d]})})),r};return l.push(...g("x",Array.from(c),u,i)),l.push(...g("y",Array.from(d),m,i)),l.push(...g("rotation",h,f,i)),l};let et;var tt;let at;var it;(tt=et||(et={})).Translate="Translate",tt.Rotate="Rotate",tt.Resize="Resize",(it=at||(at={})).ControlLeft="ControlLeft",it.ControlRight="ControlRight",it.Equal="Equal",it.MetaLeft="MetaLeft",it.MetaRight="MetaRight",it.Minus="Minus",it.ArrowLeft="ArrowLeft",it.ArrowRight="ArrowRight",it.ArrowUp="ArrowUp",it.ArrowDown="ArrowDown",it.AltLeft="AltLeft",it.AltRight="AltRight",it.Delete="Delete",it.Backspace="Backspace";const nt=(e,t,a,i)=>{const n=()=>{switch(a){case K.Pixel:return 1;case K.Millimeter:return _;case K.Centimeter:return J;default:throw new Error("Unknown unit of measurement")}};let o=t.x,s=t.y,r=t.x,l=t.y;switch(e){case at.ArrowLeft:r=t.x-1/n();break;case at.ArrowUp:l=t.y-1/n();break;case at.ArrowRight:r=t.x+1/n();break;case at.ArrowDown:l=t.y+1/n();break;default:throw new Error("Unhandled element interaction!")}const d=Z(r,l,t.width,t.height,t.rotation);return(!i||d.minX>=i.left&&d.maxX<=i.left+i.width&&d.minY>=i.top&&d.maxY<=i.top+i.height)&&(o=r,s=l),new c(t.id,o,s)};var ot=0,st=0,rt=0;const lt=(e,t,a,n,o,s,r)=>{const l=((e,t,a,i,n,o,s)=>{const r=i.width/t.width,l=i.height/t.height,c=e.movementX/r,d=e.movementY/l,h=a.rotation*Math.PI/180,p=Math.sin(h),u=Math.cos(h);let m;switch(n.type){case et.Resize:let t={top:a.y,left:a.x,width:a.width,height:a.height,rotation:a.rotation,fontSize:a.fontSize},f=t;switch(n.screenAxis){case H.North:{const e=-c*p+d*u,i=a.y+e,n=a.height-e,o=ee({...a}).center,s=ee({...a,y:i,height:n}).center,r=te(s,o,h),l=r.x-a.width/2,m=r.y-n/2;f={...t,left:l,top:m,height:n}}break;case H.East:{const e=c*u+d*p,i=a.width+e;let n=a.height;if(a.type===G.Textbox){const e=a;n=ne(e.fontSize,e.fontData,e,e.input||e.text||"",e.lineHeight).requiredHeight}const o=ee({...a}).center,s=ee({...a,width:i,height:n}).center,r=te(s,o,h),l=r.x-i/2,m=r.y-n/2;f={...t,left:l,top:m,width:i,height:n}}break;case H.West:{const e=c*u+d*p,i=a.x+e,n=a.width-e;let o=a.height;if(a.type===G.Textbox){const e=a;o=ne(e.fontSize,e.fontData,e,e.input||e.text||"",e.lineHeight).requiredHeight}const s=ee({...a}).center,r=ee({...a,width:n,height:o,x:i}).center,l=te(r,s,h),m=l.x-n/2,g=l.y-o/2;f={...t,left:m,top:g,width:n,height:o}}break;case H.South:{const e=-c*p+d*u,i=a.height+e,n=ee({...a}).center,o=ee({...a,height:i}).center,s=te(o,n,h),r=s.x-a.width/2,l=s.y-i/2;f={...t,left:r,top:l,height:i}}break;case H.Northeast:{const e=c*u+d*p,i=a.width+e;let n=a.height+e,o=a.y-e,s=a.fontSize;if(a.type===G.Textbox){const t=a;s=t.fontSize+e/8,n=ne(s,t.fontData,t,t.input||t.text||"",t.lineHeight).requiredHeight;const i=t.lineHeight||oe;o=a.y-e*i/8}const r=ee({...a}).center,l=ee({...a,width:i,height:n,y:o}).center,m=te(l,r,h),g=m.x-i/2,w=m.y-n/2;f={...t,left:g,top:w,width:i,height:n,fontSize:s}}break;case H.Northwest:{const e=-c*u+-d*p,i=a.x-e,n=a.width+e;let o=a.y-e,s=a.height+e,r=a.fontSize;if(a.type===G.Textbox){const t=a;r=t.fontSize+e/8,s=ne(r,t.fontData,t,t.input||t.text||"",t.lineHeight).requiredHeight;const i=t.lineHeight||oe;o=a.y-e*i/8}const l=ee({...a}).center,m=ee({...a,x:i,y:o,width:n,height:s}).center,g=te(m,l,h),w=g.x-n/2,y=g.y-s/2;f={...t,left:w,top:y,width:n,height:s,fontSize:r}}break;case H.Southeast:{const e=c*u+d*p,i=a.width+e;let n=a.height+e,o=a.fontSize;if(a.type===G.Textbox){const t=a;o=t.fontSize+e/8,n=ne(o,t.fontData,t,t.input||t.text||"",t.lineHeight).requiredHeight}const s=ee({...a}).center,r=ee({...a,width:i,height:n}).center,l=te(r,s,h),m=l.x-i/2,g=l.y-n/2;f={...t,left:m,top:g,width:i,height:n,fontSize:o}}break;case H.Southwest:{const e=-c*u+-d*p,i=a.width+e;let n=a.x-e,o=a.height+e,s=a.fontSize;if(a.type===G.Textbox){const t=a;s=t.fontSize+e/8,o=ne(s,t.fontData,t,t.input||t.text||"",t.lineHeight).requiredHeight}const r=ee({...a}).center,l=ee({...a,width:i,height:o,x:n}).center,m=te(l,r,h),g=m.x-i/2,w=m.y-o/2;f={...t,left:g,top:w,width:i,height:o,fontSize:s}}}return m=Z(f.left,f.top,f.width,f.height,f.rotation),(!s||m.minX>=s.left&&m.maxX<=s.left+s.width&&m.minY>=s.top&&m.maxY<=s.top+s.height)&&(t=f),t;case et.Rotate:const g={x:e.clientX,y:e.clientY};let w,y=a.rotation;const v=ee(a,i,{x:r,y:l}),S=ae(g,v.c,v.d),b=ae(g,v.d,v.c);if(0===o.filter((e=>"rotation"===e.type)).length)rt=0,w=(a.rotation+S-b)%360;else{rt+=Math.sqrt(c**2+d**2);const e=Math.abs(rt)>_e/r;w=e?(a.rotation+S-b)%360:o.find((e=>"rotation"===e.type))?.value||0,e&&(rt=0)}return m=Z(a.x,a.y,a.width,a.height,w),(!s||m.minX>=s.left&&m.maxX<=s.left+s.width&&m.minY>=s.top&&m.maxY<=s.top+s.height)&&(y=w),{top:a.y,left:a.x,width:a.width,height:a.height,rotation:y};case et.Translate:let C,x,k=a.x,I=a.y;if(0===o.filter((e=>"rotation"!==e.type)).length)ot=0,st=0,C=a.x+c,x=a.y+d;else{const e=o.find((e=>"x"===e.type)),t=o.find((e=>"y"===e.type));e||(ot=0),t||(st=0);const i=Math.abs(ot)>_e/r,n=Math.abs(st)>_e/l;C=e?i?a.x+ot:a.x:a.x+c,x=t?n?a.y+st:a.y:a.y+d,ot=i?0:ot+c,st=n?0:st+d}return m=Z(C,x,a.width,a.height,a.rotation),(!s||m.minX>=s.left&&m.maxX<=s.left+s.width&&m.minY>=s.top&&m.maxY<=s.top+s.height)&&(k=C,I=x),{top:I,left:k,width:a.width,height:a.height,rotation:a.rotation}}})(e,t,a,n,o,s,r),u=[];if(a.type===G.Textbox){const e=a;u.push(new i(e.id,e.text||e.input||""))}if(u.push(new c(a.id,l.left,l.top),new d(a.id,l.width,l.height),new h(a.id,l.rotation)),a.type===G.Textbox){const e=a;l.fontSize&&e.fontSize!==l.fontSize&&u.push(new p(e.id,l.fontSize))}return u},ct=()=>{const e=()=>Math.floor(65536*(1+Math.random())).toString(16).substring(1);return e()+e()+"-"+e()+"-"+e()+"-"+e()+"-"+e()+e()+e()},dt=.5,ht=(e,t,a,i,n,o,s)=>{const{state:c,uiDispatcher:d}=T(Ge),{getLayoutById:h,getReducerState:p,flattenSequence:u}=$e(),[m,f]=V(void 0),[g,w]=V(void 0),y=h(c.layoutId);z((()=>{if("adjustment"===n&&e?.current&&i){if(i<.5)return void d(new Ze({zoom:.5}));if(i>c.maxZoom)return void d(new Ze({zoom:c.maxZoom}));d(new Ze({zoom:i}))}}),[i,d,e,n,c.maxZoom]);const v=j(((e,i)=>{d(new Ze({zoom:i}));const o=t?.current?.scrollWidth-t?.current?.clientWidth!=0,s=t?.current?.scrollHeight-t?.current?.clientHeight!=0;t.current&&a.current&&!c.scrolledMovement&&"advanced"===n&&(s&&(t.current.scrollTop=a.current.offsetTop+(t.current.scrollHeight-t.current.clientHeight)/2),o&&(t.current.scrollLeft=(a.current.offsetLeft+t.current.scrollWidth-t.current.clientWidth)/2))}),[d,t,a,c.scrolledMovement,n]);z((()=>{c.zoom<=1&&d(new Ze({scrolledMovement:!1}))}),[d,c.zoom]);const S=t?.current?.getBoundingClientRect(),b=((S?.width||1)+(S?.height||1))/2,C=(y.layoutState.layout.width+y.layoutState.layout.height)/2/b/c.zoom,x=F((()=>{const e=c.activeModifierKeys,t=c.elementEvent,a=e.includes(at.ControlLeft)||e.includes(at.MetaLeft)||e.includes(at.ControlRight)||e.includes(at.MetaRight);if(!c.selectedElement||!t||a)return[];const i=t&&t.type===et.Translate,n=t&&t.type===et.Rotate,o=y.layoutState.elements.find((e=>e.id===c.selectedElement));return(i||n)&&o?Je(o,y.layoutState,C,s):[]}),[c.selectedElement,c.elementEvent,c.activeModifierKeys,y.layoutState,C]),k=j((()=>{const e=ct();f(e),w(p().transaction)}),[p]),I=j((()=>{d(new Ze({selectedElement:void 0}))}),[d]),E=j((()=>{d(new Ze({scrolledMovement:!0}))}),[d]),N=j(((a,i)=>{const n=y.layoutState.elements.find((e=>e.id===c.selectedElement));if(!(c.elementEvent&&e.current&&t.current&&c.selectedElement&&n))return;t.current.hasPointerCapture(a.pointerId)||t.current.setPointerCapture(a.pointerId);const s=e.current.getBoundingClientRect(),l=new r(lt(a,y.layoutState.layout,n,s,c.elementEvent,x,i));l.sequenceId=m,o(l)}),[y.layoutState.elements,y.layoutState.layout,c.elementEvent,e,c.selectedElement,t,x,o]),R=j((e=>{d(new Ze({elementEvent:e}))}),[d]),O=j((()=>{d(new Ze({elementEvent:void 0})),m&&g&&(u(m,g),f(void 0),w(void 0))}),[d,m,g,u]),M=j(((e,t)=>{let a=c.zoom;const i=c.maxZoom,s=c.selectedElement,r=c.activeModifierKeys;if((r.includes(at.AltLeft)||r.includes(at.AltRight))&&(e.code===at.Equal||e.code===at.Minus)){const t=.05*i;e.code===at.Equal?d(new Ze({zoom:a+t<=i?a+=t:a})):d(new Ze({zoom:a-t>=.5?a-t:a}))}const h=y.layoutState.elements.find((e=>e.id===s));if(s&&h){if(e.code===at.MetaLeft||e.code===at.ControlLeft||e.code===at.MetaRight||e.code===at.ControlRight){const t=e.code,a=c.activeModifierKeys;if(!a.includes(t))return d(new Ze({activeModifierKeys:a.concat(t)}))}if(e.code===at.ArrowDown||e.code===at.ArrowUp||e.code===at.ArrowLeft||e.code===at.ArrowRight){d(new Ze({elementEvent:{type:et.Translate}}));const a=nt(e.code,h,c.units,t);o(a),d(new Ze({elementEvent:void 0}))}e.code!==at.Delete&&e.code!==at.Backspace||"advanced"!==n||(d(new Ze({selectedElement:void 0})),o(new l(h.id)))}}),[o,d,y.layoutState.elements,n,c.activeModifierKeys,c.maxZoom,c.selectedElement,c.units,c.zoom]),P=j((e=>{if(e.code===at.MetaLeft||e.code===at.ControlLeft||e.code===at.MetaRight||e.code===at.ControlRight){const t=c.activeModifierKeys,a=e.code;d(new Ze({activeModifierKeys:t.filter((e=>e!==a))}))}}),[d,c.activeModifierKeys]);return{guidelines:x,scale:C,zoomableElementRef:a,setElementEvent:R,handleZoom:v,handleKeyDown:M,handleKeyUp:P,handlePointerPressedBackground:I,handlePointerReleased:O,handlePointerMove:N,handleScroll:E,handleSequenceStart:k}},pt=e=>{const{x:t,y:a,cursorStyle:i,onPointerDown:n,handleClass:o,cornerRadius:s,color:r,strokeWidth:l}=e;return q("circle",{className:o,cx:t,cy:a,r:s,fill:"#ffffff",style:{cursor:i},stroke:r,strokeWidth:l,onPointerDown:n})},ut=e=>{const{x:t,y:a,width:i,height:n,cursorStyle:o,onPointerDown:s,edgeHandleRadius:r,color:l,strokeWidth:c}=e;return q("rect",{x:t,y:a,width:i,height:n,rx:r,fill:"#ffffff",style:{cursor:o},stroke:l,strokeWidth:c,onPointerDown:s})},mt=e=>{const{color:t,elementHeight:a,elementWidth:i,onBeginResize:n,rotation:o,scaleFactor:s,disableX:r,disableY:l}=e,c=7.5*s,d=3*s,h=28*s,p=6*s,u=1.2*s,m=a-2*c,f=j(((e,t,a)=>{e.stopPropagation(),n(t,a)}),[n]),g=j((e=>f(e,ie(H.West,360-o),H.West)),[f,o]),w=j((e=>f(e,ie(H.East,360-o),H.East)),[f,o]),y=j((e=>f(e,ie(H.North,360-o),H.North)),[f,o]),v=j((e=>f(e,ie(H.South,360-o),H.South)),[f,o]),S=j((e=>f(e,H.Northwest,H.Northwest)),[f]),b=j((e=>f(e,H.Northeast,H.Northeast)),[f]),C=j((e=>f(e,H.Southwest,H.Southwest)),[f]),x=j((e=>f(e,H.Northeast,H.Southeast)),[f]),k=h<=m;return $(B,{children:[q(pt,{x:0,y:0,cursorStyle:"nwse-resize",onPointerDown:S,handleClass:"cornerNorthWest",cornerRadius:c,color:t,strokeWidth:u}),k?q(pt,{x:i,y:0,cursorStyle:"nesw-resize",onPointerDown:b,handleClass:"cornerNorthEast",cornerRadius:c,color:t,strokeWidth:u}):void 0,k?q(pt,{x:i,y:a,cursorStyle:"nwse-resize",onPointerDown:x,handleClass:"cornerSouthEast",cornerRadius:c,color:t,strokeWidth:u}):void 0,k?q(pt,{x:0,y:a,cursorStyle:"nesw-resize",onPointerDown:C,handleClass:"cornerSouthWest",cornerRadius:c,color:t,strokeWidth:u}):void 0,k&&!r?q(ut,{x:-p/2,y:a/2-h/2,width:p,height:h,onPointerDown:g,edgeHandleRadius:d,cursorStyle:"ew-resize",color:t,strokeWidth:u}):void 0,k&&!l?q(ut,{x:i/2-h/2,y:a-p/2,width:h,height:p,onPointerDown:v,edgeHandleRadius:d,cursorStyle:"ns-resize",color:t,strokeWidth:u}):void 0,r?void 0:q(ut,{x:i-p/2,y:a/2-Math.min(h,.8*a)/2,width:p,height:Math.min(h,.8*a),onPointerDown:w,edgeHandleRadius:d,cursorStyle:"ew-resize",color:t,strokeWidth:u}),k&&!l?q(ut,{x:i/2-h/2,y:-p/2,width:h,height:p,onPointerDown:y,edgeHandleRadius:d,cursorStyle:"ns-resize",color:t,strokeWidth:u}):void 0]})},ft=e=>{const{color:t,elementWidth:a,onBeginRotate:i,scaleFactor:n}=e,o=j((e=>{e.stopPropagation(),i()}),[i]),s=10*n,r=1.2*n;return $("g",{children:[q("circle",{cx:a/2,cy:-2.5*s,r:1.3*s,fill:"rgba(0, 0, 0, 0.5)",opacity:.4,style:{cursor:"ew-resize"},onPointerDown:o}),q("circle",{cx:a/2,cy:-2.5*s,r:s,fill:"#fff",style:{cursor:"ew-resize"},stroke:t,strokeWidth:r,onPointerDown:o}),$("svg",{x:a/2-s,y:-2.5*s-s,xmlns:"http://www.w3.org/2000/svg",style:{cursor:"ew-resize"},height:2*s,viewBox:"0 0 24 24",width:2*s,fill:t,onPointerDown:o,children:[q("path",{d:"M0 0h24v24H0z",fill:"none"}),q("path",{d:"M12 6v3l4-4-4-4v3c-4.42 0-8 3.58-8 8 0 1.57.46 3.03 1.24 4.26L6.7 14.8c-.45-.83-.7-1.79-.7-2.8 0-3.31 2.69-6 6-6zm6.76 1.74L17.3 9.2c.44.84.7 1.79.7 2.8 0 3.31-2.69 6-6 6v-3l-4 4 4 4v-3c4.42 0 8-3.58 8-8 0-1.57-.46-3.03-1.24-4.26z"})]})]})},gt=e=>{const{color:t,height:a,highlighted:i,id:n,immutable:o,onBeginMove:s,onBeginResize:r,onBeginRotate:l,onPointerEnter:c,onPointerLeave:d,onSelected:h,pressed:p,rotation:u,scaleFactor:m,selected:f,width:g,x:w,y:y,disableX:v,disableY:S}=e,b=1.2*m,C=j((e=>{2===e.button&&(e.stopPropagation(),h(n,e)),0===e.button&&(e.stopPropagation(),!f&&h(n,e),s())}),[n,f,h,s]),x=j((()=>{c(n)}),[n,c]),k=j((()=>{d(n)}),[n,d]);return $("g",{transform:`translate(${w}, ${y}) rotate(${u} ${g/2} ${a/2})`,children:[q("rect",{className:"interactableInnerRect",width:g,height:a,stroke:f||i?t:"none",pointerEvents:o?"none":"visibleFill",fill:"none",strokeWidth:b,style:{cursor:o?void 0:f?p?"grabbing":"grab":"pointer"},onPointerDown:o?void 0:C,onPointerEnter:o?void 0:x,onPointerLeave:o?void 0:k}),f&&$(B,{children:[q(ft,{color:t,elementWidth:g,onBeginRotate:l,scaleFactor:m}),q(mt,{color:t,elementHeight:a,elementWidth:g,rotation:u,scaleFactor:m,onBeginResize:r,disableX:v,disableY:S})]})]})},wt=({primaryColor:e,containerHeight:t,containerWidth:a,customViewbox:i,editorRef:n,elementEvent:o,guidelines:s,layoutHeight:r,layoutWidth:l,targetedElements:c,scale:d,selectedElement:h,onElementEvent:p,onElementSelected:u,onSequenceStart:m})=>{const{state:f}=Qe(),{getLayoutById:g}=$e(),w=g(f.layoutId),[y,v]=V(void 0),S=j((e=>{v(e)}),[]),b=j((e=>{y===e&&v(void 0)}),[y]),C=j((()=>{m(),p({type:et.Translate})}),[p]),x=j(((e,t)=>{m(),p({type:et.Resize,relativeAxis:e,screenAxis:t})}),[p]),k=j((()=>{m(),p({type:et.Rotate})}),[p]),I=i||{x:0,y:0,width:l,height:r},E=d*(Math.sqrt(I.width*I.height)/1e3)*(100/Math.sqrt(t*a))*Math.sqrt((N=a/t,Math.exp(Math.abs(Math.log(N)))));var N;const R=w.layoutState.elements.findIndex((({id:e})=>e===h)),O=[...w.layoutState.elements];return R>=0&&O.push(O.splice(R,1)[0]),$("svg",{xmlns:"http://www.w3.org/2000/svg",xmlnsXlink:"http://www.w3.org/1999/xlink",xmlSpace:"preserve",version:"1.1",style:{touchAction:"none",position:"absolute",maxWidth:"100%",maxHeight:"100%"},width:"100%",height:"100%",viewBox:`${I.x} ${I.y} ${I.width} ${I.height}`,overflow:"overlay",children:[q("rect",{fill:"none",stroke:"none",ref:n,width:l,height:r}),s.map((e=>e.svgNode)),O.map((t=>{const a=void 0!==h&&t.id===h,i=a&&void 0!==o,n=void 0!==y&&t.id===y;return q(gt,{color:e,id:t.id,selected:a,highlighted:n,pressed:i,x:t.x,y:t.y,disableX:t.type===G.Frame,disableY:t.type===G.Textbox||t.type===G.Frame,width:t.width,height:t.height,rotation:t.rotation,immutable:t.immutable||c&&!c.includes(t.id),onSelected:u,onBeginMove:C,onBeginResize:x,onBeginRotate:k,onPointerEnter:S,onPointerLeave:b,scaleFactor:E},t.id)}))]})},yt=e=>{const{color:t,editorRef:a,zoomableElementRef:i,interactionElementRef:n,guidelines:o,isMakingAdjustments:s,viewmask:r,visibleLayoutId:l,xTranslation:c,yTranslation:d,targetedElements:h,borderRadius:p,handleContextMenu:u,handleKeyDown:m,handleKeyUp:f,handlePointerMove:g,handlePointerPressedBackground:w,handlePointerReleased:y,handleScroll:v,onSequenceStart:S,setElementEvent:b,onElementSelected:C}=e,{getLayoutById:x}=$e(),k=x(l),I=k.layoutState,{state:E}=Qe(),N=j((e=>{if(r){const t={left:r.x,top:r.y,width:r.width,height:r.height,panelId:"",rotation:0};return m(e,t)}return m(e)}),[m,r]),R=j((e=>{if(r){const t={left:r.x,top:r.y,width:r.width,height:r.height,panelId:"",rotation:0};return g(e,t)}return g(e)}),[g,r]);return q("div",{style:{justifyContent:"center",position:"relative",height:"100%",width:"100%",scrollbarWidth:"none",outline:"none"},onContextMenu:u,onKeyDown:N,onKeyUp:f,onPointerDown:w,onPointerMoveCapture:R,onPointerUp:y,onWheelCapture:v,ref:n,tabIndex:-1,children:$("div",{ref:i,style:{height:"100%",transform:`scale(${E.zoom}) translate(${c}px, ${d}px)`,display:"grid",filter:"drop-shadow(rgba(0, 0, 0, 0.2) 0px 0px 6px)"},children:[e.children,k.getComponentWithProps({height:s?"100%":"auto",maxHeight:"100%",maxWidth:"100%",position:"absolute",viewmask:r,width:s?"100%":"auto",borderRadius:p}),q(wt,{primaryColor:t,containerHeight:i.current?.offsetHeight||1024,containerWidth:i.current?.offsetWidth||1024,editorRef:a,elementEvent:E.elementEvent,guidelines:o,layoutHeight:I.layout.height,layoutWidth:I.layout.width,onElementEvent:b,onSequenceStart:S,onElementSelected:C,scale:10/E.zoom,selectedElement:E.selectedElement,targetedElements:h})]})})},vt=({color:e,borderRadius:t,guidelineColor:a,handleContextMenu:i,onElementSelected:n})=>{const{commandDispatcher:o,getLayoutById:r}=$e(),{state:l,uiDispatcher:c}=Qe(),d=W(null),h=W(null),p=W(null),{guidelines:u,handleKeyDown:m,handleKeyUp:f,handlePointerMove:g,handlePointerPressedBackground:w,handlePointerReleased:y,handleScroll:v,handleSequenceStart:S,setElementEvent:b}=ht(d,h,p,void 0,"advanced",o,a),C=j(((e,t)=>{const a=r(l.layoutId).layoutState.elements.find((t=>t.id===e));if(e&&a&&a.type===G.Textbox){const t=a.algorithm;(!t||t===Y.Autosize)&&o(new s(e,Y.Traditional))}n&&n(e,t),c(new Ze({selectedElement:e}))}),[o,r,l.layoutId,c]);return q(yt,{color:e,editorRef:d,interactionElementRef:h,zoomableElementRef:p,guidelines:u,visibleLayoutId:l.layoutId,xTranslation:0,yTranslation:0,borderRadius:t,handleContextMenu:i,handleKeyDown:m,handleKeyUp:f,handlePointerMove:g,handlePointerPressedBackground:w,handlePointerReleased:y,handleScroll:v,onSequenceStart:S,setElementEvent:b,onElementSelected:C})};function St(e,t,a){return t in e?Object.defineProperty(e,t,{value:a,enumerable:!0,configurable:!0,writable:!0}):e[t]=a,e}const bt=new class{constructor(){St(this,"server",void 0),St(this,"cache",new Map),St(this,"materialCache",new Map),St(this,"loadImageAsFileInfo",(async e=>{const t=await e.arrayBuffer(),a=await re(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)}})),this.server=We}async getLocalOrFromServer(e){if(this.cache.has(e))return this.cache.get(e);const t=(async()=>(await We.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 We.execute("getMaterialV2",{id:e})).body)();return this.materialCache.set(e,t),t}async uploadAssetWithProgress(e,t,a,i,n,o){const s=await this.dispatchCreateAssetRequest(e,t,n,o);var r=new XMLHttpRequest;return r.open("PUT",s.assetResponse.uploadUrl,!0),r.setRequestHeader("Content-Type",s.mimeType),r.setRequestHeader("Cache-Control","public,max-age=31536000,immutable"),r.upload.onprogress=e=>{e.lengthComputable&&a(100*e.loaded/e.total)},r.onload=()=>{const e=s.assetResponse.asset;i(e)},r.onerror=()=>{console.warn("Asset upload failed")},r.send(e.blob),s.assetResponse.asset}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 Ct{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 xt{constructor(){var e,t,a;e=this,t="storage",a=new Map,t in e?Object.defineProperty(e,t,{value:a,enumerable:!0,configurable:!0,writable:!0}):e[t]=a}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 kt=(()=>{try{return localStorage?new Ct:new xt}catch{return console.warn("Local storage was unavilable due to browser security settings. Using in-memory storage instead."),new xt}})(),It=M`
|
|
2
2
|
mutation CreateTransaction($integrationProductId: String!, $bulk: Boolean) {
|
|
3
3
|
transactionCreate(integrationProductId: $integrationProductId, bulk: $bulk) {
|
|
4
4
|
id
|