(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[99],{30033:function(e,t,n){(window.__NEXT_P=window.__NEXT_P||[]).push(["/builder",function(){return n(77640)}])},94309:function(e,t,n){"use strict";var r=n(27409),a=n(48459),i=n(8821),o=n.n(i);t.Z=e=>{let{children:t,sx:n={}}=e;return(0,r.tZ)(a.Z,{"data-testid":"book-demo-button",component:o(),href:"https://use.superfluid.finance/subscriptions",target:"_blank",fullWidth:!0,size:"large",variant:"outlined",color:"primary",sx:n,children:t})}},77640:function(e,t,n){"use strict";n.r(t),n.d(t,{default:function(){return tP}});var r=n(27409),a=n(41713),i=n(97672),o=n(52957),l=n(77885),d=n(43486),s=n(32818),c=n(62887),u=n(50001),p=n(3196),h=n(55488),Z=n(60976),m=n(70608),f=n(88706),g=n(47118),y=n(63130),b=n(48459),v=n(52983),w=n(50215),k=n(14103),x=n(24352),C=n(20769),S=n(49091),R=n(6872),B=n(80834),I=n(12680);let X=B.z.object({productDetails:R.gJ,paymentDetails:R.aA,type:B.z.enum(["dialog","drawer","full-screen","page"])});var D=e=>{let{value:t,setValue:n}=e,a=(0,v.useRef)(null),i=(0,k.Ik)();(0,v.useEffect)(()=>{i&&i.languages.json.jsonDefaults.setDiagnosticsOptions({validate:!0,allowComments:!0,schemaValidation:"error",schemas:[{uri:"https://superfluid.finance/widget",fileMatch:["*"],schema:(0,I.Y_)(X.describe("widgetConfig"))}]})},[i]);let o=(0,v.useMemo)(()=>JSON.stringify({...t,displaySettings:void 0},void 0,2),[t]),[l,d]=(0,v.useState)(o),[s,c]=(0,v.useState)(!0),u=(0,v.useCallback)(e=>{c(e.every(e=>8!==e.severity))},[]),f=(0,v.useCallback)(e=>{d(null!=e?e:"")},[]),[g,y]=(0,v.useState)(!1),[b,w]=(0,v.useState)(),R=(0,v.useCallback)((0,x.Z)((e,t)=>{if(w(null),e)try{let e=X.safeParse(JSON.parse(t));e.success?(n("productDetails",e.data.productDetails),n("type",e.data.type),n("paymentDetails",e.data.paymentDetails),y(!0),setTimeout(()=>{y(!1)},1e3)):w(e.error.message)}catch(e){w("Could not parse JSON")}},250),[n,y,w]);return(0,v.useEffect)(()=>(o!==l&&R(s,l),()=>{R.clear()}),[l,s,R]),(0,r.BX)(h.Z,{height:"100vh",children:[(0,r.tZ)(p.Z,{position:"relative",children:(0,r.BX)(h.Z,{component:Z.Z,direction:"row",justifyContent:"space-between",alignItems:"center",spacing:1,children:[(0,r.tZ)(m.Z,{"data-testid":"json-editor",variant:"h6",component:"h2",color:"white",children:"JSON Editor"}),g&&(0,r.tZ)(m.Z,{variant:"caption",color:"white",children:"Saved..."})]})}),b&&(0,r.tZ)(C.Z,{open:!!b,autoHideDuration:5e3,ClickAwayListenerProps:{mouseEvent:!1},onClose:()=>w(null),anchorOrigin:{vertical:"bottom",horizontal:"right"},children:(0,r.tZ)(S.Z,{variant:"standard",severity:"error",children:b})}),(0,r.tZ)(k.ZP,{defaultLanguage:"json",theme:"vs-light",onChange:f,value:l,onValidate:u,onMount:(e,t)=>{a.current=e},options:{automaticLayout:!0,scrollBeyondLastLine:!1,minimap:{enabled:!1}}})]})},T=e=>{let{isOpen:t,setIsOpen:n,value:a,setValue:i}=e;return(0,r.tZ)(u.ZP,{variant:"temporary",open:t,onClose:()=>n(!1),keepMounted:!0,anchor:"right",PaperProps:{sx:{width:"40%"}},ModalProps:{keepMounted:!1},children:(0,r.tZ)(D,{value:a,setValue:i})})},P=n(51727),E=n(54897);let O=(e,t,n)=>{let r=new FileReader;r.readAsDataURL(e),r.onload=()=>t(r.result),r.onerror=n},A=e=>e instanceof File,N=e=>{let[t,n]=(0,v.useState)(""),[r,a]=(0,v.useState)();return(0,v.useEffect)(()=>{let t=async()=>{if(e){if(A(e))O(e,n,a);else{let t=await (await fetch(e)).blob(),r=new File([t],"image.png",{type:t.type});O(r,n,a)}}};t()},[e]),{base64:t,error:r}};var j=n(94309),F=n(63780),M=n(67057),z=e=>{let{json:t}=e,n=(0,M.ZP)(),a=(0,v.useCallback)(()=>{n.track("download_json",{productDetails:t.productDetails,paymentDetails:t.paymentDetails})},[n,t]);return(0,r.tZ)(b.Z,{"data-testid":"download-button",fullWidth:!0,size:"large",color:"primary",variant:"contained",href:URL.createObjectURL(new Blob([JSON.stringify(t,null,2)],{type:"application/json"})),download:"widget.json",startIcon:(0,r.tZ)(F.Z,{}),onClick:a,children:"Download JSON"})},_=n(98018),U=n(87854),L=n(43752),W=n(97458),Y=n(9084),V=n(66959),J=({widgetUrl:e,children:t,pulse:n=!0,...r})=>(0,W.jsx)(b.Z,{...r,"data-testid":"go-to-widget-button",target:"_blank",variant:"contained",size:"large",href:e,sx:{color:"white",textTransform:"none",...n?{animation:"pulse 3000ms ease-in-out infinite"}:{},overflow:"hidden",whiteSpace:"nowrap","@keyframes pulse":{"0%":{transform:"scale(0.97.5)",boxShadow:`0 0px 0px ${Y.Z[500]}`},"70%":{transform:"scale(1)",boxShadow:`0 0px 15px ${Y.Z[500]}`},"100%":{transform:"scale(0.97.5)",boxShadow:`0 0px 0px ${Y.Z[300]}`}}},endIcon:(0,W.jsx)(V.Z,{fill:"#FFF"}),children:t||"Pay with"}),Q=n(76963),H=n.n(Q),G=e=>{let[t,n]=(0,v.useState)(!1),[r,a]=(0,v.useState)(""),i=new(H())({pinataApiKey:"80649f21f0085c44eb5a",pinataSecretApiKey:"f37f76e7e51901d39e171c1c01093b5f68f49f14de74447f8eda1554ec7eb1ac"}),o=(0,v.useCallback)(async t=>{try{n(!0);let r=await i.pinJSONToIPFS(t,e);a(r.IpfsHash)}catch(e){console.error(e)}n(!1)},[]);return{publish:o,isLoading:t,ipfsHash:r}},q=e=>{let{json:t}=e,{publish:n,isLoading:a,ipfsHash:i}=G({pinataMetadata:{name:"".concat(t.productDetails.name,"-superfluid-widget")}}),o=!!i,l=(0,M.ZP)(),d=(0,v.useCallback)(()=>{l.track("publish_ipfs",{productDetails:t.productDetails,paymentDetails:t.paymentDetails}),n(t)},[l,n,t]);return(0,r.BX)(h.Z,{direction:"column",gap:2,children:[(0,r.tZ)(L.Z,{"data-testid":"publish-button",size:"large",loading:a,disabled:o,variant:"contained",onClick:d,startIcon:o?(0,r.tZ)(_.Z,{}):(0,r.tZ)(U.Z,{}),children:o?"Published to IPFS":"Publish to IPFS"}),o&&(0,r.BX)(h.Z,{direction:"column",sx:{alignItems:"center",mt:4},gap:2,children:[(0,r.tZ)(m.Z,{"data-testid":"published-message",variant:"subtitle2",textAlign:"center",children:"Your config is published to IPFS. Test it with our hosted widget:"}),(0,r.tZ)(J,{fullWidth:!0,widgetUrl:"".concat("https://checkout.superfluid.finance","/").concat(i)})]})]})},K=n(72047),$=n(56422),ee=n(10284),et=n(88491),en=n(46393),er=n(35614);let ea=e=>{let{tooltip:t}=e;return(0,$.Z)(),(0,r.tZ)(ee.Z,{title:t,children:(0,r.tZ)(K.Z,{"data-testid":"tooltip-icon",fontSize:"small",sx:{color:"text.secondary"}})})};var ei=e=>{var t;let{dataTestid:n,title:a,tooltip:i,sx:o={},helperText:l,children:d,optional:s,error:c,...u}=e,p=(0,v.useId)(),Z=null!==(t=u.id)&&void 0!==t?t:p,f="label-".concat(Z);return(0,r.BX)(et.Z,{sx:o,error:c,children:[(0,r.BX)(h.Z,{direction:"row",alignItems:"center",gap:1,sx:{mb:.75},children:[!!a&&(0,r.BX)(en.Z,{"data-testid":n,id:f,htmlFor:Z,focused:!1,children:[a,!!s&&(0,r.tZ)(m.Z,{component:"span",variant:"caption",color:"text.secondary",sx:{ml:1},children:"(optional)"})]}),!!i&&(0,r.tZ)(ea,{tooltip:i})]}),d(Z,c),!!l&&(0,r.tZ)(er.Z,{"data-testid":"helper-text","aria-describedby":f,children:l})]})},eo=n(75160),el=n(86796),ed=n(89601),es=n(42687);let ec={400:"regular",500:"500",600:"600"},eu=Object.keys(ec),ep=Object.values(ec);function eh(e){return ep.every(t=>e.variants.includes(t))}function eZ(e){return{family:e.family,category:e.category}}var em=()=>{let[e,t]=(0,v.useState)([]);return(0,v.useEffect)(()=>{let e=async()=>{let e=await fetch("https://www.googleapis.com/webfonts/v1/webfonts?key=".concat("AIzaSyD3BrC-9z1dZx6ZkZcVKub2TDYoLirnNgU")),{items:n}=await e.json();n&&t(n.filter(eh).map(eZ))};e()},[]),e},ef=e=>{(0,v.useEffect)(()=>{if(!e)return;let t=document.createElement("link");return t.rel="stylesheet",t.href="https://fonts.googleapis.com/css2?family=".concat(e,":wght@").concat(eu.join(";"),"&display=swap"),document.head.appendChild(t),()=>{t.remove()}},[e])};let eg=ed.Bs,ey=(0,v.createContext)({productDetails:{name:"Product Name",description:"Product Description",imageURI:"https://picsum.photos/200/200"},paymentDetails:{paymentOptions:[]},type:"dialog",displaySettings:{stepperOrientation:"vertical",darkMode:!1,containerRadius:20,buttonRadius:10,inputRadius:10,font:{family:"Noto Sans",category:"sans-serif"},primaryColor:Y.Z[500],secondaryColor:eo.Z.white}}),eb=(e,t,n,a,i,o)=>"page"===e?(0,r.tZ)(R.ZP,{productDetails:t,paymentDetails:n,tokenList:eg,type:e,theme:a,walletManager:i,stepper:{orientation:o},eventListeners:{onTransactionSent:console.log}}):(0,r.tZ)(R.ZP,{productDetails:t,paymentDetails:n,tokenList:eg,type:e,theme:a,walletManager:i,stepper:{orientation:o},children:t=>{let{openModal:n}=t;return(0,r.tZ)(el.Z,{"data-testid":"open-checkout-in-button",color:"primary",variant:"extended",onClick:()=>n(),children:"Open Checkout in ".concat(e.toUpperCase())})}}),ev=e=>({...e.font?{typography:{fontFamily:"'".concat(e.font.family,"', '").concat(e.font.category,"'")}}:{},palette:{mode:e.darkMode?"dark":"light",primary:{main:e.primaryColor},secondary:{main:e.secondaryColor}},shape:{borderRadius:e.containerRadius},components:{MuiStepIcon:{styleOverrides:{text:{fill:e.secondaryColor}}},MuiOutlinedInput:{styleOverrides:{root:{borderRadius:e.inputRadius}}},MuiButton:{styleOverrides:{root:{borderRadius:e.buttonRadius}}}}});var ew=e=>{var t;let{displaySettings:n,paymentDetails:a,productDetails:i,type:o}=e,{open:l,isOpen:d,setDefaultChain:s}=(0,es.k_)(),c=(0,v.useMemo)(()=>({open:e=>{let{chain:t}=e;t&&s(t),l()},isOpen:d}),[l,d,s]),[u,p]=(0,v.useState)(!1);(0,v.useEffect)(()=>p(!0),[]);let h=ev(n);return ef(null===(t=n.font)||void 0===t?void 0:t.family),(0,r.tZ)(ey.Provider,{value:e,children:u&&eb(o,i,a,h,c,n.stepperOrientation)})};let ek=(e,t)=>{switch(e){case"json":return(0,r.tZ)(z,{json:t});case"ipfs":return(0,r.tZ)(q,{json:t});default:return(0,r.tZ)(r.HY,{})}};var ex=()=>{let{watch:e}=(0,w.Gc)(),[t,n,a,i]=e(["productDetails","paymentDetails","displaySettings","type"]),{base64:o}=N(t.imageURI),l=(0,v.useMemo)(()=>({productDetails:{...t,imageURI:o},paymentDetails:n,type:i,theme:ev(a)}),[t,n,a,i,o]),[d,s]=(0,v.useState)("ipfs");return(0,r.BX)(h.Z,{height:"100%",gap:2,children:[(0,r.tZ)(m.Z,{variant:"h6",component:"h2",children:"Checkout Export"}),(0,r.BX)(c.Z,{children:[(0,r.tZ)(ei,{title:"Export option",sx:{width:"100%"},children:e=>(0,r.BX)(P.Z,{id:e,labelId:"label-".concat(e),"data-testid":"export-option",value:d,defaultValue:"ipfs",onChange:e=>{let{target:t}=e;return s(t.value)},fullWidth:!0,children:[(0,r.tZ)(E.Z,{value:"ipfs",children:"Publish to IPFS to get a hosted link"}),(0,r.tZ)(E.Z,{value:"json",children:"Download JSON"})]})}),(0,r.BX)(c.Z,{textAlign:"center",sx:{my:3},children:[(0,r.tZ)(m.Z,{variant:"h6",component:"h3",sx:{mb:1},children:"How does it work?"}),(0,r.tZ)(m.Z,{color:"text.secondary",children:"ipfs"===d?"You’ll create a hosted link to your checkout which you can embed in your CTAs.":"json"===d?"Use this JSON configuration when embedding react or web component directly to your code.":""})]}),ek(d,l)]}),(0,r.BX)(h.Z,{height:"100%",justifyContent:"flex-end",alignItems:"center",children:[(0,r.tZ)(m.Z,{variant:"h6",component:"h3",sx:{mb:1},children:"Do you have more questions?"}),(0,r.tZ)(m.Z,{color:"text.secondary",sx:{mb:3},children:"We’ll show you how your business can benefit from using our checkout."}),(0,r.tZ)(j.Z,{children:"Book a Demo"})]})]})},eC=n(5319),eS=n(39790),eR=n(39878),eB=n(10826),eI=n(93352),eX=n(85263),eD=n(7705),eT=n(73606),eP=n(98696);let eE={paymentOptions:[{receiverAddress:"0xf26ce9749f29e61c25d0333bce2301cb2dfd3a22",chainId:R.ug.goerli.id,superToken:{address:"0x8ae68021f6170e5a766be613cea0d75236ecca9a"},flowRate:{amountEther:"1",period:"month"}},{receiverAddress:"0xf26ce9749f29e61c25d0333bce2301cb2dfd3a22",chainId:R.ug.goerli.id,superToken:{address:"0xf2d68898557ccb2cf4c10c3ef2b034b2a69dad00"},flowRate:{amountEther:"1",period:"month"}},{receiverAddress:"0x7d3e32ae08f50387a83cf222e08d8ec26317d7aa",chainId:R.ug.goerli.id,superToken:{address:"0x7d3e32ae08f50387a83cf222e08d8ec26317d7aa"},flowRate:{amountEther:"1",period:"month"}},{receiverAddress:"0x7d3e32ae08f50387a83cf222e08d8ec26317d7aa",chainId:R.ug.goerli.id,superToken:{address:"0xcc48a0349077b91ab540d2e46addffb4a4a26251"},flowRate:{amountEther:"1",period:"month"}},{receiverAddress:"0xf26ce9749f29e61c25d0333bce2301cb2dfd3a22",chainId:R.ug.polygonMumbai.id,superToken:{address:"0x42bb40bf79730451b11f6de1cba222f17b87afd7"},flowRate:{amountEther:"1",period:"month"}},{receiverAddress:"0x5d8b4c2554aeb7e86f387b4d6c00ac33499ed01f",chainId:R.ug.polygonMumbai.id,superToken:{address:"0x5d8b4c2554aeb7e86f387b4d6c00ac33499ed01f"},flowRate:{amountEther:"1",period:"month"}},{receiverAddress:"0x5d8b4c2554aeb7e86f387b4d6c00ac33499ed01f",chainId:R.ug.polygonMumbai.id,superToken:{address:"0x5d8b4c2554aeb7e86f387b4d6c00ac33499ed01f"}},{receiverAddress:"0xd8dA6BF26964aF9D7eEd9e03E53415D37aA96045",chainId:R.ug.celo.id,superToken:{address:"0x62b8b11039fcfe5ab0c56e502b1c372a3d2a9c7a"},flowRate:{amountEther:"1",period:"month"}}]},eO={paymentOptions:[{receiverAddress:"0xf26ce9749f29e61c25d0333bce2301cb2dfd3a22",chainId:R.ug.goerli.id,superToken:{address:"0x8ae68021f6170e5a766be613cea0d75236ecca9a"},flowRate:{amountEther:"1",period:"month"}}]},eA={darkMode:!1,containerRadius:20,buttonRadius:10,inputRadius:10,font:{family:"Noto Sans",category:"sans-serif"},primaryColor:"rgb(29, 178, 39)",secondaryColor:"rgb(255, 255, 255)",stepperOrientation:"vertical"},eN={productDetails:{name:"",description:"",imageURI:""},paymentDetails:eO,type:"page",displaySettings:eA};var ej=()=>{let{setValue:e}=(0,w.Gc)(),t=(0,v.useCallback)(()=>e("paymentDetails",eE),[e]),n=(0,v.useCallback)(()=>{let t={name:"".concat(eP.We.commerce.productName()),description:"".concat(eP.We.commerce.productDescription()),imageURI:"https://picsum.photos/200/200"};e("productDetails",t)},[e]),r=(0,v.useCallback)(()=>{let t={...eA,darkMode:eP.We.datatype.boolean(),primaryColor:eP.We.color.rgb(),secondaryColor:eP.We.color.rgb(),containerRadius:eP.We.number.int({min:0,max:50}),buttonRadius:eP.We.number.int({min:0,max:25}),inputRadius:eP.We.number.int({min:0,max:25})};e("displaySettings",t)},[e]);return{setDemoPaymentDetails:t,setDemoProductDetails:n,setDemoStyling:r}},eF=n(21488),eM=n(1456),ez=n(70055),e_=n(81165),eU=n(40764),eL=n(40455),eW=n(15062),eY=n(60075),eV=n(5575),eJ=n.n(eV),eQ=n(61918),eH=n(19686),eG=e=>{let{network:t,AvatarProps:n={}}=e,a=(0,v.useMemo)(()=>R.ES[t.id],[t]),{sx:i={}}=n;return(0,r.tZ)(eH.Z,{"data-testid":"".concat(t.id,"-badge"),src:null==a?void 0:a.logoURI,...n,sx:{...a&&!a.logoURI&&a.color?{backgroundColor:a.color}:{},width:24,height:24,fontSize:16,...i},children:t.testnet&&t.name.charAt(0)})};let eq=(0,e_.ZP)(e=>{let{className:t,...n}=e;return(0,r.tZ)(ee.Z,{...n,classes:{popper:t}})})({["& .".concat(eU.Z.tooltip)]:{maxWidth:"none"}}),eK=e=>{let{label:t,value:n}=e;return(0,r.BX)(h.Z,{"data-testid":"".concat(t.toLowerCase().replaceAll(" ","-"),"-added-payment-option"),direction:"row",sx:{width:"100%",justifyContent:"space-between"},children:[(0,r.tZ)(m.Z,{"data-testid":"payment-option-label",fontWeight:"500",children:t}),n]})};var e$=e=>{var t;let{superToken:n,upfrontPaymentAmountEther:a,flowRate:i,receiverAddress:o,chainId:l,index:d,clone:s,edit:c,remove:u}=e,p=(0,$.Z)(),Z=(0,v.useMemo)(()=>R.S7.find(e=>e.id===l),[l]),f=(0,v.useMemo)(()=>(0,eQ.K)(o),[o]),g=(0,v.useMemo)(()=>Object.values(eg.tokens).find(e=>e.address.toLowerCase()===n.address.toLowerCase()),[eg,n.address]),y=(0,v.useMemo)(()=>{var e;return i?"".concat(i.amountEther," ").concat(null!==(e=null==g?void 0:g.symbol)&&void 0!==e?e:"x","/").concat(i.period):"User-defined"},[i,g]);return(0,r.BX)(eL.Z,{variant:"elevation",elevation:1,children:[(0,r.tZ)(eW.Z,{children:(0,r.BX)(h.Z,{direction:"column",gap:1,children:[(0,r.tZ)(eK,{label:"Network",value:(0,r.BX)(h.Z,{"data-testid":"added-network-option",direction:"row",gap:1,sx:{alignItems:"center"},children:[(0,r.tZ)(eG,{network:Z}),null==Z?void 0:Z.name]})}),(0,r.tZ)(eK,{label:"Token",value:(0,r.BX)(h.Z,{"data-testid":"added-token-option",direction:"row",gap:1,sx:{alignItems:"center"},children:[(null==g?void 0:g.logoURI)&&(0,r.tZ)(eJ(),{src:g.logoURI,alt:"",width:24,height:24,objectFit:"contain"}),null==g?void 0:g.name]})}),(0,r.tZ)(eK,{label:"Stream Rate",value:y}),a&&(0,r.tZ)(eK,{label:"Upfront Payment Amount",value:"".concat(a," ").concat(null!==(t=null==g?void 0:g.symbol)&&void 0!==t?t:"")}),(0,r.tZ)(eK,{label:"Receiver",value:(0,r.tZ)(eq,{title:f,"data-testid":"added-payment-receiver-tooltip",placement:"bottom",arrow:!0,PopperProps:{sx:{maxWidth:"none"}},children:(0,r.tZ)(m.Z,{"data-testid":"added-payment-receiver",children:"".concat(f.substring(0,6),"...").concat(f.substring(f.length-4,f.length),"\n                ")})})})]})}),(0,r.BX)(h.Z,{component:eY.Z,direction:"row",justifyContent:"flex-end",bgcolor:"grey.50",children:[(0,r.tZ)(ee.Z,{title:"Edit payment option",arrow:!0,children:(0,r.tZ)(eD.Z,{"data-testid":"edit-payment-option-button",onClick:()=>c(d),sx:{"&:hover .MuiSvgIcon-root":{color:p.palette.primary.main}},children:(0,r.tZ)(eM.Z,{sx:{fontSize:20}})})}),(0,r.tZ)(ee.Z,{title:"Copy payment option",arrow:!0,children:(0,r.tZ)(eD.Z,{"data-testid":"clone-payment-option-button",onClick:()=>s(d),sx:{"&:hover .MuiSvgIcon-root":{color:p.palette.secondary.main}},children:(0,r.tZ)(ez.Z,{sx:{fontSize:20}})})}),(0,r.tZ)(ee.Z,{title:"Delete payment option",arrow:!0,children:(0,r.tZ)(eD.Z,{"data-testid":"delete-payment-option-button",onClick:()=>u(d),sx:{"&:hover .MuiSvgIcon-root":{color:p.palette.error.main}},children:(0,r.tZ)(eF.Z,{sx:{fontSize:20}})})})]})]})},e0=n(54880),e1=n(32197),e2=n(90021),e5=n(28891),e3=n(43450),e4=n(2749),e7=n(59247),e6=n(57805),e8=n(34240),e9=n(70008),te=n(69421),tt=n(86922),tn=n(13839),tr=n(46482),ta=n(55386),ti=e=>{var t,n,a,i,o,l,d,s,c,u;let{selectedPaymentOption:p,dialogMode:Z,onAdd:m,onEdit:f,onDiscard:g}=e,[y,w]=(0,v.useState)(""),[k,x]=(0,v.useState)(null),[C,S]=(0,v.useState)(null),[B,I]=(0,v.useState)(!1),[X,D]=(0,v.useState)(""),[T,O]=(0,v.useState)("month");(0,v.useEffect)(()=>{if(p&&"add"!==Z){var e,t;let{value:n}=p;w(n.receiverAddress),x(null!==(e=R.S7.find(e=>{let{id:t}=e;return t===n.chainId}))&&void 0!==e?e:null),n.superToken&&S(null!==(t=eg.tokens.find(e=>{let{address:t}=e;return t.toLowerCase()===n.superToken.address.toLowerCase()}))&&void 0!==t?t:null),n.flowRate?(D(n.flowRate.amountEther),O(n.flowRate.period)):I(!0),n.transferAmountEther&&(U(!0),W(n.transferAmountEther))}},[null==p?void 0:p.value,Z]);let A=(0,v.useMemo)(()=>R.S7.filter(e=>eg.tokens.find(t=>{let{chainId:n,tags:r}=t;return 1!==e.id&&e.id===n&&r&&r.includes("supertoken")})),[]),N=e=>{let{target:{value:t}}=e,n=A.find(e=>{let{name:n}=e;return n===t});n&&(x(n),S(null))},[j,F]=(0,v.useState)(null),M=(0,v.useMemo)(()=>{let e=R.S7.find(e=>{let{name:t}=e;return t===(null==k?void 0:k.name)});return eg.tokens.filter(t=>{var n;return t.chainId===(null==e?void 0:e.id)&&(null===(n=t.tags)||void 0===n?void 0:n.includes("supertoken"))})},[k]),z=(e,t)=>{null!==t&&t!==B&&(I(t),U(!1),W(""),D(""))},[_,U]=(0,v.useState)(!1),[L,W]=(0,v.useState)("");return(0,r.BX)(r.HY,{children:[(0,r.tZ)(e0.Z,{children:(0,r.BX)(h.Z,{direction:"column",gap:1.5,children:[(0,r.tZ)(ei,{dataTestid:"network-title",title:"Network",tooltip:"Select the network you'd like to request payment on.",error:!!(null==j?void 0:null===(n=j.formErrors)||void 0===n?void 0:null===(t=n.fieldErrors)||void 0===t?void 0:t.chainId),children:e=>(0,r.BX)(P.Z,{labelId:"label-".concat(e),id:e,"data-testid":"network-selection",value:(null==k?void 0:k.name)||"",onChange:N,fullWidth:!0,children:[(0,r.tZ)(e1.Z,{children:"Mainnets"}),A.filter(e=>!e.testnet).map(e=>(0,r.tZ)(E.Z,{"data-testid":e.id,value:e.name,children:(0,r.BX)(h.Z,{direction:"row",gap:1,sx:{alignItems:"center",width:"100%"},children:[(0,r.tZ)(eG,{network:e}),e.name]})},"".concat(e.id))),(0,r.tZ)(e1.Z,{children:"Testnets"}),A.filter(e=>e.testnet).map(e=>(0,r.tZ)(E.Z,{"data-testid":e.id,value:e.name,children:(0,r.BX)(h.Z,{direction:"row",gap:1,sx:{alignItems:"center",width:"100%"},children:[(0,r.tZ)(eG,{network:e}),e.name]})},"".concat(e.id)))]})}),(0,r.tZ)(ei,{dataTestid:"receiver-title",title:"Receiver Address",tooltip:"Set your wallet or multisig address on the relevant network.",error:!!(null==j?void 0:null===(i=j.formErrors)||void 0===i?void 0:null===(a=i.fieldErrors)||void 0===a?void 0:a.receiverAddress),children:(e,t)=>(0,r.tZ)(e2.Z,{id:e,error:t,"data-testid":"receiver-input-field",value:y,onChange:e=>{let{target:t}=e;return w(t.value)}})}),(0,r.tZ)(ei,{dataTestid:"token-title",id:"token-select",title:"Super Token",tooltip:"Select the SuperToken you'd like to request payment in.",error:!!(null==j?void 0:null===(l=j.formErrors)||void 0===l?void 0:null===(o=l.fieldErrors)||void 0===o?void 0:o.superToken),children:(e,t)=>(0,r.tZ)(e5.Z,{fullWidth:!0,disabled:!k,value:C,onChange:(e,t)=>S(t),id:e,options:M,getOptionLabel:e=>e.symbol,componentsProps:{popper:{placement:"bottom-end"}},renderOption:(e,t)=>(0,r.BX)(e3.ZP,{...e,children:[(0,r.tZ)(e4.Z,{sx:{minWidth:40},children:t.logoURI&&(0,r.tZ)(eH.Z,{sx:{width:24,height:24,objectFit:"contain"},src:t.logoURI})}),(0,r.tZ)(e7.Z,{"data-testid":"token-selection-name-and-symbol",primary:t.symbol,secondary:t.name,secondaryTypographyProps:{variant:"caption"},sx:{m:0}})]}),renderInput:e=>(0,r.tZ)(e2.Z,{...e,error:t,InputProps:{...e.InputProps,startAdornment:(null==C?void 0:C.logoURI)&&(0,r.tZ)(eH.Z,{sx:{width:24,height:24,objectFit:"contain"},src:C.logoURI})}})})}),(0,r.tZ)(ei,{title:"",sx:{width:"100%"},helperText:B?"User-defined rate is a payment type suited for donations where users determine the amount they want to pay over a given period of time.":"Fixed rate is a payment type suited for regular subscriptions where users pay a predetermined amount over a given period of time.",children:e=>(0,r.BX)(e6.Z,{id:e,value:B,exclusive:!0,onChange:z,fullWidth:!0,color:"primary",children:[(0,r.tZ)(e8.Z,{"data-testid":"fixed-rate-button",value:!1,children:"Fixed rate"}),(0,r.tZ)(e8.Z,{"data-testid":"user-defined-rate-button",value:!0,children:"User-defined rate"})]})}),(0,r.tZ)(e9.Z,{in:!B,children:(0,r.BX)(h.Z,{spacing:1,children:[(0,r.tZ)(ei,{dataTestid:"stream-rate-title",title:"Stream Rate",tooltip:"Set the amount of tokens per month for the payment.",error:!!(null==j?void 0:null===(s=j.formErrors)||void 0===s?void 0:null===(d=s.fieldErrors)||void 0===d?void 0:d.flowRate),children:(e,t)=>(0,r.BX)(h.Z,{gap:"-1px",sx:{display:"grid",gridTemplateColumns:"2fr 1fr"},children:[(0,r.tZ)(e2.Z,{id:e,error:t,"data-testid":"flow-rate-input",fullWidth:!0,value:X,onChange:e=>{let{target:t}=e;return D(t.value)},InputProps:{sx:{borderTopRightRadius:0,borderBottomRightRadius:0},endAdornment:(0,r.tZ)(te.Z,{position:"end",children:null==C?void 0:C.symbol})}}),(0,r.tZ)(P.Z,{"data-testid":"time-unit-selection",value:T,onChange:e=>{let{target:t}=e;return O(t.value)},sx:{borderTopLeftRadius:0,borderBottomLeftRadius:0,marginLeft:"-1px"},children:R.Yk.map(e=>(0,r.BX)(E.Z,{value:e,children:["/",e]},e))})]})}),(0,r.tZ)(tt.Z,{children:(0,r.BX)(h.Z,{direction:"row",alignItems:"center",gap:1,children:[(0,r.tZ)(tn.Z,{"data-testid":"upfront-payment-label",sx:{mr:0},control:(0,r.tZ)(tr.Z,{"data-testid":"upfront-payment-switch",color:"primary",checked:_,value:_,onChange:(e,t)=>{t?(U(!0),W(X)):(U(!1),W(""))}}),label:"Charge upfront payment amount"}),(0,r.tZ)(ea,{tooltip:"A one-time payment amount to be paid before the stream starts."})]})}),(0,r.tZ)(e9.Z,{in:_,children:(0,r.tZ)(tt.Z,{children:(0,r.tZ)(ei,{dataTestid:"upfront-payment-title",title:"Upfront Payment Amount",tooltip:"The ERC-20 transfer amount the user should send as an upfront payment.",error:!!(null==j?void 0:null===(u=j.formErrors)||void 0===u?void 0:null===(c=u.fieldErrors)||void 0===c?void 0:c.transferAmountEther),children:(e,t)=>(0,r.tZ)(e2.Z,{id:e,error:t,"data-testid":"upfront-payment-amount-input",fullWidth:!0,value:L,onChange:e=>{let{target:t}=e;return W(t.value)},InputProps:{endAdornment:(0,r.tZ)(te.Z,{position:"end",children:null==C?void 0:C.symbol})}})})})})]})})]})}),(0,r.tZ)(eT.Z,{}),(0,r.tZ)(ta.Z,{children:(0,r.BX)(h.Z,{direction:"row",spacing:2,sx:{width:"100%"},justifyContent:"flex-end",children:[(0,r.tZ)(b.Z,{size:"large","data-testid":"discard-option-button",color:"primary",variant:"text",onClick:g,children:"Discard"}),(0,r.BX)(b.Z,{size:"large","data-testid":"add-option-button",variant:"contained",color:"primary",onClick:()=>{F(null);let e={receiverAddress:y,superToken:C?{address:C.address}:void 0,chainId:C?C.chainId:void 0,...B?{}:{..._?{transferAmountEther:L||"0"}:{},flowRate:{amountEther:X||"0",period:T}}},t=R.GV.safeParse(e);t.success?"edit"===Z&&p?f(p.index,t.data):m(t.data):F(t.error)},children:["edit"===Z?"Update":"Add"," Payment Option"]})]})})]})},to=()=>{let e=(0,$.Z)(),{control:t,watch:n}=(0,w.Gc)(),{fields:a,append:i,update:o,remove:l}=(0,w.Dq)({control:t,name:"paymentDetails.paymentOptions"}),[d]=n(["paymentDetails.paymentOptions"]),[s,u]=(0,v.useState)(),[f,g]=(0,v.useState)(),[y,k]=(0,v.useState)(!1);(0,v.useEffect)(()=>{k(!0)},[]);let x=(0,v.useCallback)(()=>{u(void 0),g(void 0)},[]),{setDemoPaymentDetails:C}=ej(),S=(0,v.useCallback)(()=>{k(!0),C()},[]);return(0,r.BX)(r.HY,{children:[(0,r.BX)(h.Z,{direction:"column",gap:2,children:[(0,r.BX)(c.Z,{mb:1,children:[(0,r.tZ)(m.Z,{variant:"h6",component:"h2",children:"Checkout Payment Details"}),(0,r.tZ)(m.Z,{variant:"body2",color:"text.secondary",children:"Enter your preferred payment options to start receiving ongoing real-time payments powered by the Superfluid Protocol."})]}),(0,r.BX)(h.Z,{direction:"column",children:[(0,r.BX)(h.Z,{direction:"row",justifyContent:"space-between",alignItems:"center",sx:{mb:2},children:[(0,r.tZ)(m.Z,{variant:"subtitle1",component:"h3",children:(0,r.BX)(h.Z,{direction:"row",alignItems:"center",gap:1,children:["Payment Options",(0,r.BX)(m.Z,{component:"span","data-testid":"added-payment-options-count",color:"text.secondary",children:["(",d.length,")"]})]})}),(0,r.tZ)(h.Z,{direction:"row",gap:1,children:(0,r.tZ)(b.Z,{"data-testid":"add-payment-option-button",variant:"contained",size:"medium",color:"primary",onClick:()=>{u("add")},startIcon:(0,r.tZ)(eC.Z,{}),children:"Add"})})]}),(0,r.tZ)(h.Z,{direction:"column",gap:2.5,children:d.length?d.map((e,t)=>{let{superToken:n,chainId:a,transferAmountEther:i,flowRate:o,receiverAddress:s}=e;return(0,r.tZ)(eB.Z,{in:!0,appear:!!y,children:(0,r.tZ)(c.Z,{children:(0,r.tZ)(e$,{upfrontPaymentAmountEther:i,flowRate:o,receiverAddress:s,superToken:n,chainId:a,index:t,clone:e=>{g({index:e,value:d[e]}),u("clone")},edit:e=>{g({index:e,value:d[e]}),u("edit")},remove:e=>{l(e)}})})},"".concat(n.address,"-").concat(t))}).reverse():(0,r.BX)(m.Z,{"data-testid":"no-options-message",variant:"body1",color:"text.secondary",children:["You haven't added any payment options yet."," Add your first one or"," ",(0,r.tZ)(m.Z,{component:"span",color:"primary",sx:{cursor:"pointer"},onClick:S,children:"replace with demo data"}),"."]})})]})]}),(0,r.BX)(eI.Z,{open:!!s,keepMounted:!1,TransitionComponent:eX.Z,TransitionProps:{direction:"right",exit:!1},transitionDuration:{enter:e.transitions.duration.enteringScreen,exit:e.transitions.duration.shortest},children:[(0,r.tZ)(p.Z,{color:"transparent",position:"relative",elevation:0,children:(0,r.BX)(h.Z,{component:Z.Z,direction:"row",justifyContent:"space-between",children:[(0,r.BX)(m.Z,{variant:"h6",children:["edit"===s?"Edit":"Add"," Payment Option"]}),(0,r.tZ)(eD.Z,{edge:"start",color:"inherit",onClick:x,"aria-label":"close",children:(0,r.tZ)(eR.default,{})})]})}),(0,r.tZ)(eT.Z,{}),(0,r.tZ)(w.Qr,{control:t,name:"paymentDetails.paymentOptions",render:()=>(0,r.tZ)(ti,{selectedPaymentOption:f,dialogMode:s,onAdd:e=>{i(e),x()},onEdit:(e,t)=>{o(e,t),x()},onDiscard:()=>{g(void 0),x()}},y.toString())})]}),(0,r.tZ)(ee.Z,{title:"Replace with demo payment details",placement:"right",arrow:!0,children:(0,r.tZ)(el.Z,{"data-testid":"wand-button",size:"medium",color:"secondary",sx:{position:"absolute",bottom:72,left:20},onClick:S,children:(0,r.tZ)(eS.Z,{})})})]})},tl=n(96631),td=e=>{let{id:t,imageSrc:n,sizeLimit:a,onClick:i,onRemove:o}=e,l=(0,$.Z)(),d=(0,v.useRef)(null);return(0,r.BX)(h.Z,{direction:"column",gap:1,sx:{flex:1},children:[n&&(0,r.tZ)(h.Z,{direction:"row",justifyContent:"flex-end",children:(0,r.tZ)(eD.Z,{onClick:o,size:"small",sx:{p:0},children:(0,r.tZ)(tl.Z,{"data-testid":"remove-image-button"})})}),n?(0,r.tZ)(c.Z,{sx:{display:"flex",justifyContent:"center",alignItems:"center"},children:(0,r.tZ)("img",{"data-testid":"product-image",src:n,height:90,alt:"not found"})}):(0,r.BX)(b.Z,{fullWidth:!0,sx:{p:0,m:0},onClick:()=>{var e;null===(e=d.current)||void 0===e||e.click()},children:[(0,r.tZ)("input",{"data-testid":"file-upload-field",hidden:!0,type:"file",accept:"image/*",name:t,ref:d,onChange:e=>{if(e.target.files){if(a&&e.target.files[0].size>a){alert("File size is too large. Please upload a file smaller than ".concat(Math.floor(a/1024)," kB."));return}i(e.target.files[0])}}}),(0,r.tZ)(h.Z,{direction:"column",alignItems:"center",justifyContent:"center",sx:{width:"100%",p:.5,borderStyle:"solid",borderRadius:1,borderWidth:.5,borderColor:l.palette.grey[400],height:90},children:(0,r.tZ)(c.Z,{sx:{display:"flex",alignItems:"center",justifyContent:"center"},children:(0,r.tZ)(eC.Z,{fontSize:"large",sx:{color:l.palette.grey[700]}})})})]})]})},ts=()=>{let{control:e,watch:t}=(0,w.Gc)(),{fields:n,append:a,remove:i}=(0,w.Dq)({control:e,name:"paymentDetails.paymentOptions"}),[o]=t(["paymentDetails.paymentOptions"]),{setDemoProductDetails:l}=ej();return(0,r.BX)(r.HY,{children:[(0,r.BX)(h.Z,{gap:2,children:[(0,r.BX)(c.Z,{mb:1,children:[(0,r.tZ)(m.Z,{variant:"h6",component:"h2",children:"Checkout Product Details"}),(0,r.tZ)(m.Z,{variant:"body2",color:"text.secondary",children:"Define the product you want to receive ongoing real-time payments for."})]}),(0,r.tZ)(w.Qr,{control:e,name:"productDetails.name",render:e=>{let{field:{value:t,onChange:n}}=e;return(0,r.tZ)(ei,{title:"Product Name",optional:!0,children:e=>(0,r.tZ)(e2.Z,{id:e,placeholder:"","data-testid":"product-name-field",value:t,onChange:n})})}}),(0,r.tZ)(w.Qr,{control:e,name:"productDetails.description",render:e=>{let{field:{value:t,onChange:n}}=e;return(0,r.tZ)(ei,{title:"Product Description",optional:!0,children:e=>(0,r.tZ)(e2.Z,{id:e,"data-testid":"product-description-field",placeholder:"",multiline:!0,minRows:4,value:t,onChange:n})})}}),(0,r.tZ)(w.Qr,{control:e,name:"productDetails.imageURI",render:e=>{let{field:{value:t,onChange:n}}=e;return(0,r.tZ)(ei,{id:"product-image",title:"Product Image",optional:!0,children:e=>(0,r.tZ)(td,{id:e,onClick:e=>n(URL.createObjectURL(e)),onRemove:()=>n(""),imageSrc:t})})}})]}),(0,r.tZ)(ee.Z,{title:"Replace with demo product details",placement:"right",arrow:!0,children:(0,r.tZ)(el.Z,{"data-testid":"wand-button",size:"medium",color:"secondary",onClick:l,sx:{position:"absolute",bottom:72,left:20},children:(0,r.tZ)(eS.Z,{})})})]})},tc=n(86462),tu=n(29787),tp=n.n(tu),th=n(3010),tZ=n.n(th),tm=n(21723),tf=n(37768),tg=n(28934),ty=n(8821),tb=n.n(ty),tv=n(26253);let tw=(0,e_.ZP)("a")({}),tk=v.forwardRef(function(e,t){let{to:n,linkAs:a,replace:i,scroll:o,shallow:l,prefetch:d,legacyBehavior:s=!0,locale:c,...u}=e;return(0,r.tZ)(tb(),{href:n,prefetch:d,as:a,replace:i,scroll:o,shallow:l,passHref:!0,locale:c,legacyBehavior:s,children:(0,r.tZ)(tw,{ref:t,...u})})}),tx=v.forwardRef(function(e,t){let{activeClassName:n="active",as:a,className:i,href:o,legacyBehavior:l,linkAs:d,locale:s,noLinkStyle:c,prefetch:u,replace:p,role:h,scroll:Z,shallow:m,...f}=e,g=(0,tv.useRouter)(),y="string"==typeof o?o:o.pathname,b=(0,tg.Z)(i,{[n]:g.pathname===y&&n}),v="string"==typeof o&&(0===o.indexOf("http")||0===o.indexOf("mailto:"));if(v)return c?(0,r.tZ)(tw,{className:b,href:o,ref:t,...f}):(0,r.tZ)(tf.Z,{className:b,href:o,ref:t,...f});let w={to:o,linkAs:d||a,replace:p,scroll:Z,shallow:m,prefetch:u,legacyBehavior:l,locale:s};return c?(0,r.tZ)(tk,{className:b,ref:t,...w,...f}):(0,r.tZ)(tf.Z,{component:tk,className:b,ref:t,...w,...f})});var tC=e=>{let{cloneAddresses:t,open:n,onClose:a}=e,i=(0,v.useCallback)(()=>{let e=t.map(e=>{let t=Object.entries(e);return t.join(",")}).join("\n"),n=encodeURI("data:text/csv;charset=utf-8,chainId,address\n"+e),r=document.createElement("a");r.setAttribute("href",n),r.setAttribute("download","nft-contracts.csv"),document.body.appendChild(r),r.click()},[t]),[o,l]=(0,v.useMemo)(()=>{let e=Object.values(t).filter(Boolean).length,n=t.length-e;return[e,n]},[t]);return(0,r.tZ)(eI.Z,{open:n,children:(0,r.BX)(c.Z,{sx:{position:"relative",padding:5},children:[(0,r.tZ)(eD.Z,{onClick:a,sx:{position:"absolute",right:12,top:12,color:"grey.900"},children:(0,r.tZ)(eR.default,{})}),(0,r.BX)(h.Z,{direction:"column",gap:2,sx:{alignItems:"center"},children:[(0,r.tZ)(eJ(),{src:"/assets/nft-check.svg",width:120,height:120,alt:"✅"}),(0,r.BX)(h.Z,{sx:{mb:2},children:[(0,r.tZ)(m.Z,{variant:"h6",textAlign:"center",children:"You deployed an NFT contract for ".concat(o," networks.").concat(0===l?"":" Failed to deploy for ".concat(l," networks."))}),(0,r.tZ)(m.Z,{color:"grey.800",textAlign:"center",children:"Export contract addresses or check how you can use them to gate your content."})]}),(0,r.BX)(h.Z,{gap:1.5,sx:{width:"100%"},children:[(0,r.tZ)(b.Z,{variant:"contained",color:"primary",size:"large",onClick:i,children:"Export Addresses"}),(0,r.tZ)(tx,{href:"https://docs.superfluid.finance/superfluid/protocol-tutorials/nft-gating",style:{width:"100%"},target:"_blank",children:(0,r.tZ)(b.Z,{variant:"outlined",color:"primary",size:"large",fullWidth:!0,children:"See documentation"})})]})]})]})})};BigInt.prototype.toJSON=function(){return this.toString()};var tS=e=>{let{previewContainerRef:t}=e,{watch:n}=(0,w.Gc)(),[a,i]=n(["paymentDetails.paymentOptions","productDetails"]),o=(0,v.createRef)(),[l,d]=(0,v.useState)(""),[s,u]=(0,v.useState)(""),[p,Z]=(0,v.useState)(""),[f,g]=(0,v.useState)(""),[y,b]=(0,v.useState)(),{base64:k}=N(y),[x,C]=(0,v.useState)({}),[S,B]=(0,v.useState)([]),[I,X]=(0,v.useState)(!1),[D,T]=(0,v.useState)(!1),[P,E]=(0,v.useState)(null);(0,v.useLayoutEffect)(()=>{o.current&&o.current.execute()},[]),(0,v.useEffect)(()=>{P&&alert("".concat(P.error).concat(P.message?": "+P.message:""))},[P]);let O=(0,v.useCallback)(e=>{d(e)},[]),A=(0,M.ZP)(),j=(0,v.useMemo)(()=>{try{let e=tZ()(a,"chainId").map(e=>{let{chainId:t}=e,n=R.S7.find(e=>{let{id:n}=e;return n===t});if(!n)throw Error("Network not found.");return n});return e}catch(e){return[]}},[a]),F=(0,v.useCallback)((e,t)=>{let n=a.filter(e=>{let{chainId:n}=e;return t.id===n});C(r=>e?{...r,[t.id]:n}:(delete r[t.id],Object.assign({},r)))},[a,C]),z=(0,v.useCallback)(async()=>{try{if(X(!0),!l)throw Error("Recaptcha token is missing");A.track("enft_deployment_requested",{selectedPaymentOptions:x});let e=await fetch("/api/deploy-enft",{method:"POST",body:JSON.stringify({productDetails:i,selectedPaymentOptions:x,tokenName:p,tokenSymbol:s,contractOwner:f,nftImage:k,recaptchaToken:l})});if(!e.ok){let t=await e.json();console.error("Deploying NFT failed.",t),E(t),A.track("enft_deployment_failed",{reason:e});return}let{deployments:t}=await e.json();A.track("enft_deployment_succeeded",{deployments:t}),B(t),T(Object.values(t).every(Boolean))}catch(e){console.error("Deploying NFT failed. Reason:",e),A.track("enft_deployment_failed",{reason:e})}finally{X(!1)}},[p,s,f,y,x,l,k]),_=()=>{B([]),C({}),E(null)},U=(0,v.useMemo)(()=>!p||!s||!f||!l||0===a.length||tp()(x)||S.length>0||D,[p,s,f,a,x,S,l,D]);return(0,r.BX)(r.HY,{children:[(0,r.BX)(h.Z,{gap:2,height:"100%",children:[(0,r.BX)(c.Z,{mb:1,children:[(0,r.tZ)(m.Z,{"data-testid":"gating-title",variant:"h6",component:"h2",children:"Gate your content with NFTs"}),(0,r.tZ)(m.Z,{"data-testid":"nft-gating-message",variant:"body2",color:"text.secondary",children:"Create NFT your users will hold while they are paying for your product or service."})]}),(0,r.tZ)(ei,{dataTestid:"nft-symbol-title",title:"NFT Symbol",tooltip:"The Symbol of your NFT. It will be displayed in your users' wallets.",children:e=>(0,r.tZ)(e2.Z,{"data-testid":"nft-symbol-input-field",id:e,value:s,onChange:e=>{let{target:t}=e;return u(t.value)}})}),(0,r.tZ)(ei,{dataTestid:"nft-name-title",title:"NFT Name",tooltip:"The Name of your NFT. It will be displayed in your users' wallets.",children:e=>(0,r.tZ)(e2.Z,{"data-testid":"nft-name-input-field",id:e,value:p,onChange:e=>{let{target:t}=e;return Z(t.value)}})}),(0,r.tZ)(ei,{"data-testid":"contract-owner-title",title:"Contract owner",tooltip:"The address with authority to add further PaymentOptions or deprecate the contract.",children:e=>(0,r.tZ)(e2.Z,{"data-testid":"contract-owner-input-field",id:e,value:f,onChange:e=>{let{target:t}=e;return g(t.value)}})}),(0,r.tZ)(ei,{dataTestid:"nft-image-title",id:"nft-image",title:"NFT Image",optional:!0,tooltip:"The custom artwork for the NFT, which will be displayed in your users' wallets",children:e=>(0,r.tZ)(td,{"data-testid":"nft-image-upload-field",id:e,imageSrc:y?URL.createObjectURL(y):void 0,onClick:e=>b(e),onRemove:()=>b(void 0),sizeLimit:262144})}),(0,r.BX)(h.Z,{direction:"column",sx:{mt:2},children:[(0,r.tZ)(m.Z,{variant:"subtitle1",sx:{fontSize:"1.1rem"},children:"Select networks you want to deploy your NFT to."}),(0,r.tZ)(m.Z,{variant:"body2",color:"text.secondary",children:"The following networks are used in your checkout widget:"})]}),(0,r.BX)(h.Z,{justifyContent:"space-between",height:"100%",children:[(0,r.tZ)(tt.Z,{sx:{px:1},children:j.map(e=>(0,r.tZ)(tn.Z,{sx:{fontWeight:"bold"},control:(0,r.tZ)(tc.Z,{"data-testid":"".concat(e.name,"-checkbox"),color:"primary",value:e.name,checked:!!x[e.id],onChange:t=>{let{target:n}=t;return F(n.checked,e)}}),label:(0,r.BX)(h.Z,{direction:"row",gap:1,sx:{alignItems:"center"},children:[(0,r.tZ)(eG,{network:e}),e.name]})},e.id))}),(0,r.tZ)(L.Z,{"data-testid":"create-nft-button",color:"primary",variant:"contained",size:"large",onClick:P?()=>_():z,loading:I,disabled:U,sx:{mt:1},children:P?"Deployment Failed, Reset?":"Create NFT"})]})]}),(0,r.tZ)(tC,{open:S.length>0,cloneAddresses:S,onClose:()=>B([])}),(0,r.tZ)(tm.Z,{ref:o,sitekey:"6Lc4XOQnAAAAAOVzTEfqBDYDPUVTL1dT_J9vjkF8",size:"invisible",onChange:O})]})},tR=()=>(0,r.BX)(c.Z,{sx:{position:"absolute",p:2,bottom:0,left:"540px"},children:[(0,r.tZ)(tx,{"data-testid":"terms-link",href:"https://www.superfluid.finance/termsofuse/",target:"_blank",children:"Terms of Use"})," & ",(0,r.tZ)(tx,{"data-testid":"privacy-link",href:"https://www.iubenda.com/privacy-policy/34415583/legal",target:"_blank",children:"Privacy Policy"})]}),tB=n(93969),tI=n(79290),tX=()=>{let{control:e,watch:t}=(0,w.Gc)(),[n]=t(["displaySettings"]),a=em(),{setDemoStyling:i}=ej();return(0,r.BX)(r.HY,{children:[(0,r.BX)(h.Z,{direction:"column",gap:2,children:[(0,r.BX)(c.Z,{mb:1,children:[(0,r.tZ)(m.Z,{variant:"h6",component:"h2",children:"Checkout Widget Styling"}),(0,r.tZ)(m.Z,{variant:"body2",color:"text.secondary",children:"You are free to customize the look and feel of the checkout widget."})]}),(0,r.tZ)(w.Qr,{control:e,name:"type",render:e=>{let{field:{value:t,onChange:n}}=e;return(0,r.tZ)(ei,{title:"View type",children:e=>(0,r.BX)(e6.Z,{id:e,value:t,exclusive:!0,onChange:(e,t)=>n(t),sx:{borderTopRightRadius:0,borderBottomRightRadius:0},children:[(0,r.tZ)(e8.Z,{"data-testid":"inline-button",value:"page","aria-label":"page",title:"Page",children:"Inline"}),(0,r.tZ)(e8.Z,{"data-testid":"dialog-button",value:"dialog","aria-label":"dialog",title:"Dialog",children:"Dialog"}),(0,r.tZ)(e8.Z,{"data-testid":"drawer-button",value:"drawer","aria-label":"drawer",title:"Drawer",children:"Drawer"}),(0,r.tZ)(e8.Z,{"data-testid":"full-screen-button",value:"full-screen","aria-label":"full-screen",title:"Full Screen",children:"Full-screen"})]})})}}),(0,r.tZ)(w.Qr,{control:e,name:"displaySettings.darkMode",render:e=>{let{field:{value:t,onChange:n}}=e;return(0,r.tZ)(tn.Z,{"data-testid":"dark-mode-switch",control:(0,r.tZ)(tr.Z,{checked:null!=t&&t,onChange:n}),label:(0,r.tZ)(m.Z,{children:"Dark mode: ".concat(t?"on":"off")})})}}),(0,r.tZ)(w.Qr,{control:e,name:"displaySettings.containerRadius",render:e=>{let{field:{value:t,onChange:a}}=e;return(0,r.tZ)(ei,{dataTestid:"container-radius-value",title:"Container border-radius: ".concat(n.containerRadius),children:e=>(0,r.tZ)(tB.ZP,{id:e,"data-testid":"container-radius-slider",step:1,min:0,max:50,value:Number(t),onChange:(e,t)=>a(t)})})}}),(0,r.tZ)(w.Qr,{control:e,name:"displaySettings.inputRadius",render:e=>{let{field:{value:t,onChange:a}}=e;return(0,r.tZ)(ei,{dataTestid:"field-border-radius-value",title:"Field border-radius: ".concat(n.inputRadius),children:e=>(0,r.tZ)(tB.ZP,{"data-testid":"field-border-slider",step:1,min:0,max:25,value:Number(t),onChange:(e,t)=>a(t)})})}}),(0,r.tZ)(w.Qr,{control:e,name:"displaySettings.buttonRadius",render:e=>{let{field:{value:t,onChange:a}}=e;return(0,r.tZ)(ei,{dataTestid:"button-border-radius",title:"Button border-radius: ".concat(n.buttonRadius),children:e=>(0,r.tZ)(tB.ZP,{id:e,"data-testid":"button-border-radius-slider",step:1,min:0,max:25,value:Number(t),onChange:(e,t)=>a(t)})})}}),(0,r.BX)(h.Z,{direction:"row",gap:1,children:[(0,r.tZ)(w.Qr,{control:e,name:"displaySettings.primaryColor",render:e=>{let{field:{value:t,onChange:n}}=e;return(0,r.tZ)(ei,{"data-testid":"primary-color",title:"Primary color",children:e=>(0,r.tZ)(tI.O,{"data-testid":"primary-color-picker",id:e,fallbackValue:"rgb(0, 0, 0)",format:"rgb",value:t,onChange:e=>n(e)})})}}),(0,r.tZ)(w.Qr,{control:e,name:"displaySettings.secondaryColor",render:e=>{let{field:{value:t,onChange:n}}=e;return(0,r.tZ)(ei,{title:"Secondary color",children:e=>(0,r.tZ)(tI.O,{id:e,"data-testid":"secondary-color-picker",fallbackValue:"rgb(0, 0, 0)",format:"rgb",value:t,onChange:e=>n(e)})})}})]}),(0,r.tZ)(w.Qr,{control:e,name:"displaySettings.font",render:e=>{let{field:{value:t,onChange:n}}=e;return(0,r.tZ)(ei,{title:"Font Family",children:e=>(0,r.tZ)(e5.Z,{id:e,"data-testid":"font-picker",value:t,loading:0===a.length,disablePortal:!0,options:a,isOptionEqualToValue:(e,t)=>e.family===t.family,onChange:(e,t)=>n(t),getOptionLabel:e=>"".concat(e.family,", ").concat(e.category),fullWidth:!0,renderInput:e=>(0,r.tZ)(e2.Z,{...e})})})}}),(0,r.tZ)(w.Qr,{control:e,name:"displaySettings.stepperOrientation",render:e=>{let{field:{value:t,onChange:n}}=e;return(0,r.tZ)(ei,{title:"Stepper",children:e=>(0,r.BX)(e6.Z,{id:e,value:t,exclusive:!0,onChange:(e,t)=>n(t),sx:{borderTopRightRadius:0,borderBottomRightRadius:0},children:[(0,r.tZ)(e8.Z,{"data-testid":"vertical-stepper-button",value:"vertical","aria-label":"vertical stepper",title:"Choose vertical stepper",disabled:"vertical"===t,children:"Vertical"}),(0,r.tZ)(e8.Z,{"data-testid":"horizontal-stepper-button",value:"horizontal","aria-label":"horizontal stepper",title:"Choose horizontal stepper",disabled:"horizontal"===t,children:"Horizontal"})]})})}})]}),(0,r.tZ)(ee.Z,{title:"Replace with random styling",placement:"right",arrow:!0,children:(0,r.tZ)(el.Z,{"data-testid":"wand-button",size:"medium",color:"secondary",onClick:i,sx:{position:"absolute",bottom:72,left:20},children:(0,r.tZ)(eS.Z,{})})})]})};let tD="540px",tT={0:"Product",1:"Payment",2:"Styling",3:"Export",4:"Gating"};function tP(){let[e,t]=(0,v.useState)(0),n=4===e,k=0===e,x=(0,M.ZP)(),C=(0,v.useRef)(null),S=(0,v.useCallback)(()=>{let n=Math.min(e+1,4);t(n),x.track("tab_changed",{tab:tT[n],button:"next_button"})},[x,e]),R=(0,v.useCallback)(()=>{let n=Math.max(e-1,0);t(n),x.track("tab_changed",{tab:tT[n],button:"back_button"})},[x,e]),B=(0,w.cI)({values:eN}),{watch:I,control:X,getValues:D,setValue:P}=B,[E,O,A,N]=I(["productDetails","paymentDetails","displaySettings","type"]),[j,F]=(0,v.useState)(!1),z=(0,v.useCallback)((e,n)=>{let r=Number(n);t(r),x.track("tab_changed",{tab:tT[r],button:"tab_button"})},[x]);return(0,r.BX)(c.Z,{sx:{display:"flex",position:"relative",height:"100vh"},children:[(0,r.tZ)(u.ZP,{variant:"permanent",anchor:"left",sx:{width:tD,flexShrink:0,"& .MuiDrawer-paper":{width:tD,boxSizing:"border-box"}},children:(0,r.BX)(l.ZP,{value:e.toString(),children:[(0,r.BX)(p.Z,{position:"sticky",color:"primary",elevation:3,children:[(0,r.tZ)(h.Z,{component:Z.Z,justifyContent:"center",children:(0,r.tZ)(m.Z,{variant:"h6",component:"h1",children:"Checkout Builder"})}),(0,r.tZ)(c.Z,{bgcolor:"background.paper",children:(0,r.BX)(d.Z,{variant:"fullWidth",onChange:z,children:[(0,r.tZ)(f.Z,{label:tT[0],value:"0","data-testid":"product-tab"}),(0,r.tZ)(f.Z,{label:tT[1],value:"1","data-testid":"payment-tab"}),(0,r.tZ)(f.Z,{label:tT[2],value:"2","data-testid":"ui-tab"}),(0,r.tZ)(f.Z,{label:tT[3],value:"3","data-testid":"export-tab"}),(0,r.tZ)(f.Z,{label:tT[4],value:"4","data-testid":"gating-tab"})]})})]}),(0,r.tZ)(c.Z,{height:"100%",sx:{overflowY:"scroll"},children:(0,r.BX)(w.RV,{...B,children:[(0,r.tZ)(s.Z,{value:"0",children:(0,r.tZ)(ts,{})}),(0,r.tZ)(s.Z,{value:"1",children:(0,r.tZ)(to,{})}),(0,r.tZ)(s.Z,{value:"2",children:(0,r.tZ)(tX,{})}),(0,r.tZ)(s.Z,{value:"3",children:(0,r.tZ)(ex,{})}),(0,r.tZ)(s.Z,{value:"4",children:(0,r.tZ)(tS,{previewContainerRef:C})})]})}),(0,r.tZ)(g.Z,{sx:{position:"sticky",bottom:0,left:0,right:0},elevation:3,children:(0,r.tZ)(y.Z,{sx:{bgcolor:"background.paper"},variant:"dots",steps:5,position:"static",activeStep:e,nextButton:(0,r.BX)(b.Z,{"data-testid":"next-button",size:"medium",variant:"outlined",color:"primary",onClick:S,disabled:n,sx:{visibility:n?"hidden":"visible"},children:["Next",(0,r.tZ)(o.Z,{})]}),backButton:(0,r.BX)(b.Z,{"data-testid":"back-button",size:"medium",variant:"outlined",color:"primary",onClick:R,disabled:k,sx:{visibility:k?"hidden":"visible"},children:[(0,r.tZ)(i.Z,{}),"Back"]})})})]})}),(0,r.BX)(h.Z,{component:"main",alignItems:"center",sx:{flexGrow:1,position:"relative",py:"8vh",overflow:"auto"},ref:C,children:[(0,r.BX)(c.Z,{textAlign:"center",sx:{mb:6.5},children:[(0,r.tZ)(m.Z,{variant:"h5",color:"grey.900",sx:{mb:1},children:"Widget Preview"}),(0,r.tZ)(m.Z,{color:"grey.800",children:"In this preview you can see all the changes you apply in the builder menu."}),(0,r.tZ)(m.Z,{color:"grey.800",children:"This is how your checkout will look once you export it."})]}),(0,r.tZ)(ew,{productDetails:E,paymentDetails:O,displaySettings:A,type:N})]}),(0,r.tZ)(tR,{}),(0,r.tZ)(c.Z,{sx:{position:"absolute",top:5,right:5},children:(0,r.tZ)(b.Z,{variant:"outlined",onClick:()=>F(e=>!e),startIcon:(0,r.tZ)(a.Z,{}),sx:{bgcolor:"background.paper"},children:"JSON Editor"})}),(0,r.tZ)(T,{value:D(),setValue:P,isOpen:j,setIsOpen:F})]})}},95258:function(){}},function(e){e.O(0,[582,586,410,178,671,495,656,323,707,774,888,179],function(){return e(e.s=30033)}),_N_E=e.O()}]);