@paperxyz/react-client-sdk - npm Package Compare versions

Comparing version 0.0.5 to 0.0.6

dist/components/PayWithCard.d.ts

@@ -5,2 +5,8 @@ import React from 'react';
 import { TransferSuccessResult } from '../interfaces/TransferSuccessResult';
+export declare const openCenteredPopup: ({ url, title, width, height, }: {
+    url: string;
+    title?: string | undefined;
+    width: number;
+    height: number;
+}) => void;
 interface PayWithCardProps {
@@ -7,0 +13,0 @@ checkoutId: string;

dist/index.js

@@ -1,2 +0,2 @@
-var U=Object.create;var C=Object.defineProperty;var _=Object.getOwnPropertyDescriptor;var F=Object.getOwnPropertyNames,T=Object.getOwnPropertySymbols,V=Object.getPrototypeOf,O=Object.prototype.hasOwnProperty,K=Object.prototype.propertyIsEnumerable;var R=(e,r,a)=>r in e?C(e,r,{enumerable:!0,configurable:!0,writable:!0,value:a}):e[r]=a,p=(e,r)=>{for(var a in r||(r={}))O.call(r,a)&&R(e,a,r[a]);if(T)for(var a of T(r))K.call(r,a)&&R(e,a,r[a]);return e};var L=(e,r)=>{for(var a in r)C(e,a,{get:r[a],enumerable:!0})},W=(e,r,a,s)=>{if(r&&typeof r=="object"||typeof r=="function")for(let o of F(r))!O.call(e,o)&&o!==a&&C(e,o,{get:()=>r[o],enumerable:!(s=_(r,o))||s.enumerable});return e};var x=(e,r,a)=>(a=e!=null?U(V(e)):{},W(r||!e||!e.__esModule?C(a,"default",{value:e,enumerable:!0}):a,e)),M=e=>W(C({},"__esModule",{value:!0}),e);var Y={};L(Y,{CreateWallet:()=>X,PaperCheckout:()=>$,PaperCheckoutDisplay:()=>I,PaperSDKErrorCode:()=>N,PaperSDKProvider:()=>q,PayWithCard:()=>H,usePaperSDKContext:()=>S});module.exports=M(Y);var i=x(require("react"));var b="https://paper.xyz",k={colorPrimary:"#cf3781",colorBackground:"#ffffff",colorText:"#1a202c",borderRadius:12,fontFamily:"Open Sans"};var I=(c=>(c.POPUP="POPUP",c.NEW_TAB="NEW_TAB",c.MODAL="MODAL",c.DRAWER="DRAWER",c.EMBED="EMBED",c))(I||{}),$=({checkoutId:e,display:r="POPUP",recipientWalletAddress:a,emailAddress:s,quantity:o,appName:c,options:t=p({width:400,height:800},k),onPaymentSuccess:y,onTransferSuccess:P,children:v})=>{let[l,d]=(0,i.useState)(!1);(0,i.useEffect)(()=>{let A=D=>{let w=D.data;switch(w.eventType){case"paymentSuccess":y&&y({id:w.id});break;case"transferSuccess":P&&P({id:w.id});break;case"modalClosed":d(!1);break;default:}};window.addEventListener("message",A)},[]);let n=new URL(`/checkout/${e}`,b);n.searchParams.append("display",r),t.colorPrimary&&n.searchParams.append("colorPrimary",t.colorPrimary),t.colorBackground&&n.searchParams.append("colorBackground",t.colorBackground),t.colorText&&n.searchParams.append("colorText",t.colorText),t.borderRadius!==void 0&&n.searchParams.append("borderRadius",t.borderRadius.toString()),t.fontFamily&&n.searchParams.append("fontFamily",t.fontFamily),c&&n.searchParams.append("appName",c),a&&n.searchParams.append("wallet",a),s&&n.searchParams.append("username",s),o&&n.searchParams.append("quantity",o.toString()),n.searchParams.append("date",Date.now().toString());let u=v||i.default.createElement("button",{style:{backgroundColor:"#cf3781",padding:"8px 20px 8px 20px",borderRadius:"8px",color:"white",fontWeight:"bold"}},"Buy Now");switch(r){case"POPUP":return i.default.createElement("a",{onClick:()=>{if(!(window!=null&&window.top))return;let D=window.top.outerHeight/2+window.top.screenY-t.height/2,w=window.top.outerWidth/2+window.top.screenX-t.width/2;window.open(n,"Paper Checkout",`toolbar=no,
+var F=Object.create;var x=Object.defineProperty;var L=Object.getOwnPropertyDescriptor;var V=Object.getOwnPropertyNames,O=Object.getOwnPropertySymbols,K=Object.getPrototypeOf,B=Object.prototype.hasOwnProperty,$=Object.prototype.propertyIsEnumerable;var W=(e,r,a)=>r in e?x(e,r,{enumerable:!0,configurable:!0,writable:!0,value:a}):e[r]=a,d=(e,r)=>{for(var a in r||(r={}))B.call(r,a)&&W(e,a,r[a]);if(O)for(var a of O(r))$.call(r,a)&&W(e,a,r[a]);return e};var z=(e,r)=>{for(var a in r)x(e,a,{get:r[a],enumerable:!0})},U=(e,r,a,s)=>{if(r&&typeof r=="object"||typeof r=="function")for(let t of V(r))!B.call(e,t)&&t!==a&&x(e,t,{get:()=>r[t],enumerable:!(s=L(r,t))||s.enumerable});return e};var E=(e,r,a)=>(a=e!=null?F(K(e)):{},U(r||!e||!e.__esModule?x(a,"default",{value:e,enumerable:!0}):a,e)),H=e=>U(x({},"__esModule",{value:!0}),e);var J={};z(J,{CreateWallet:()=>G,PaperCheckout:()=>j,PaperCheckoutDisplay:()=>I,PaperSDKErrorCode:()=>A,PaperSDKProvider:()=>Y,PayWithCard:()=>Z,openCenteredPopup:()=>_,usePaperSDKContext:()=>k});module.exports=H(J);var i=E(require("react"));var w="https://paper.xyz",D={colorPrimary:"#cf3781",colorBackground:"#ffffff",colorText:"#1a202c",borderRadius:12,fontFamily:"Open Sans"};var I=(l=>(l.POPUP="POPUP",l.NEW_TAB="NEW_TAB",l.MODAL="MODAL",l.DRAWER="DRAWER",l.EMBED="EMBED",l))(I||{}),j=({checkoutId:e,display:r="POPUP",recipientWalletAddress:a,emailAddress:s,quantity:t,appName:l,options:o=d({width:400,height:800},D),onPaymentSuccess:b,onTransferSuccess:y,children:C})=>{let[p,h]=(0,i.useState)(!1);(0,i.useEffect)(()=>{let m=v=>{let g=v.data;switch(g.eventType){case"paymentSuccess":b&&b({id:g.id});break;case"transferSuccess":y&&y({id:g.id});break;case"modalClosed":h(!1);break;default:}};window.addEventListener("message",m)},[]);let n=new URL(`/checkout/${e}`,w);n.searchParams.append("display",r),o.colorPrimary&&n.searchParams.append("colorPrimary",o.colorPrimary),o.colorBackground&&n.searchParams.append("colorBackground",o.colorBackground),o.colorText&&n.searchParams.append("colorText",o.colorText),o.borderRadius!==void 0&&n.searchParams.append("borderRadius",o.borderRadius.toString()),o.fontFamily&&n.searchParams.append("fontFamily",o.fontFamily),l&&n.searchParams.append("appName",l),a&&n.searchParams.append("wallet",a),s&&n.searchParams.append("username",s),t&&n.searchParams.append("quantity",t.toString()),n.searchParams.append("date",Date.now().toString());let c=C||i.default.createElement("button",{style:{backgroundColor:"#cf3781",padding:"8px 20px 8px 20px",borderRadius:"8px",color:"white",fontWeight:"bold"}},"Buy Now");switch(r){case"POPUP":return i.default.createElement("a",{onClick:()=>{if(!(window!=null&&window.top))return;let v=window.top.outerHeight/2+window.top.screenY-o.height/2,g=window.top.outerWidth/2+window.top.screenX-o.width/2;window.open(n,"Paper Checkout",`toolbar=no,
           location=no,
@@ -7,6 +7,15 @@ status=no,
           resizable=yes,
-          width=${t.width},
-          height=${t.height},
-          top=${D},
-          left=${w}`)}},u);case"NEW_TAB":return i.default.createElement("a",{onClick:()=>window.open(n,"_blank")},u);case"MODAL":return i.default.createElement(j,{clickableElement:u,checkoutUrl:n.href,width:t.width,height:t.height,isOpen:l,setIsOpen:d});case"DRAWER":return i.default.createElement(z,{clickableElement:u,checkoutUrl:n.href,width:t.width,isOpen:l,setIsOpen:d});case"EMBED":return i.default.createElement("iframe",{src:n.href,width:t.width,height:t.height});default:return console.error(`Invalid or unimplemented display type: ${r}`),i.default.createElement(i.default.Fragment,null)}},m={overlay:{position:"fixed",top:0,left:0,right:0,bottom:0,margin:0,zIndex:1,overflow:"hidden",display:"flex",visibility:"hidden",opacity:0,transition:"all 0.2s ease"},overlayIsVisible:{visibility:"visible",opacity:1,backdropFilter:"blur(2px)",background:"#0008"},modalOverlay:{alignItems:"center",justifyContent:"center"},drawerOverlay:{justifyContent:"flex-end"},modalDialog:{position:"relative",overflow:"hidden",borderRadius:"8px",visibility:"hidden",opacity:0,top:"5%",transition:"all 0.2s ease"},modalDialogIsVisible:{visibility:"visible",opacity:1,top:0},drawerDialog:{position:"relative",visibility:"hidden",opacity:0,right:"-10%",transition:"all 0.2s ease"},drawerDialogIsVisible:{visibility:"visible",opacity:1,right:0},modalCloseButton:{position:"absolute",top:"0.1em",right:"0.2em",borderRadius:"8px",fontSize:"x-large",padding:"0 0.4em",color:"#888"}},z=({clickableElement:e,checkoutUrl:r,width:a,isOpen:s,setIsOpen:o})=>i.default.createElement(i.default.Fragment,null,i.default.createElement("a",{onClick:()=>o(!0)},e),i.default.createElement("div",{className:"paper-overlay",style:p(p(p({},m.overlay),s?m.overlayIsVisible:{}),m.drawerOverlay)},i.default.createElement("div",{className:"paper-drawer",style:p(p({},m.drawerDialog),s?m.drawerDialogIsVisible:{})},i.default.createElement("button",{onClick:()=>o(!1),style:m.modalCloseButton},"\xD7"),i.default.createElement("iframe",{src:r,width:a,height:"100%"})))),j=({clickableElement:e,checkoutUrl:r,width:a,height:s,isOpen:o,setIsOpen:c})=>i.default.createElement(i.default.Fragment,null,i.default.createElement("a",{onClick:()=>c(!0)},e),i.default.createElement("div",{className:"paper-overlay",style:p(p(p({},m.overlay),o?m.overlayIsVisible:{}),m.modalOverlay)},i.default.createElement("div",{className:"paper-modal",style:p(p({},m.modalDialog),o?m.modalDialogIsVisible:{})},i.default.createElement("button",{onClick:()=>c(!1),style:m.modalCloseButton},"\xD7"),i.default.createElement("iframe",{src:r,width:a,height:s}))));var E=x(require("react"));var f=x(require("react")),B=(0,f.createContext)({chainName:"Polygon",setChainName:()=>{}}),q=({chainName:e,children:r})=>{let[a,s]=(0,f.useState)(e),o=(0,f.useMemo)(()=>({chainName:a,setChainName:s}),[a,s]);return f.default.createElement(B.Provider,{value:o},r)},S=()=>(0,f.useContext)(B);var H=({checkoutId:e,recipientWalletAddress:r,emailAddress:a,quantity:s,options:o=p({},k),onPaymentSuccess:c,onTransferSuccess:t,onCancel:y,onError:P})=>{let{chainName:v}=S();(0,E.useEffect)(()=>{let d=n=>{let u=n.data;switch(u.eventType){case"payWithCardError":console.error("Error in Paper SDK PayWithCard",u.error),P&&P({code:u.code,error:u.error});break;case"payWithCardCancel":console.error("Paper SDK PayWithCard cancelled"),y&&y();break;case"payWithCardPaymentSuccess":c&&c({id:u.id});break;case"payWithCardTransferSuccess":t&&t({id:u.id});break;default:}};window.addEventListener("message",d)},[]);let l=new URL("/sdk/v1/pay-with-card",b);return l.searchParams.append("checkoutId",e),l.searchParams.append("recipientWalletAddress",r),l.searchParams.append("chainName",v),a&&l.searchParams.append("emailAddress",a),s&&l.searchParams.append("quantity",s.toString()),o.colorPrimary&&l.searchParams.append("colorPrimary",o.colorPrimary),o.colorBackground&&l.searchParams.append("colorBackground",o.colorBackground),o.colorText&&l.searchParams.append("colorText",o.colorText),o.borderRadius!==void 0&&l.searchParams.append("borderRadius",o.borderRadius.toString()),o.fontFamily&&l.searchParams.append("fontFamily",o.fontFamily),l.searchParams.append("date",Date.now().toString()),E.default.createElement("iframe",{src:l.href,width:"100%",height:"100%",allowTransparency:!0})};var N=(t=>(t.InvalidProps="The props you passed in to this component are not valid.",t.InvalidCard="The card information is invalid. Please double check that the Card, CVC, and Zip code are all correct.",t.EmailNotVerified="The email was unable to be verified.",t.NotEnoughSupply="There is not enough supply to claim.",t.AddressNotAllowed="This address is not on the allowlist.",t.NoActiveClaimPhase="There is no active claim phase at the moment.",t))(N||{});var h=x(require("react"));var X=({emailAddress:e,onSuccess:r,onEmailVerificationInitiated:a,onError:s,children:o})=>{let[c,t]=(0,h.useState)(!1),{chainName:y}=S();(0,h.useEffect)(()=>{let v=l=>{let d=l.data;console.log("data is ",d),d.eventType==="verifyEmailEmailVerificationInitiated"?a&&a():d.eventType==="verifyEmailError"?(console.error("Error in Paper SDK VerifyEmail",d.error),s&&s({code:"The email was unable to be verified.",error:d.error})):d.eventType==="verifyEmailSuccess"&&r({emailAddress:d.emailAddress,walletAddress:d.walletAddress})};window.addEventListener("message",v)},[]);let P=()=>{t(!0)};return h.default.createElement(h.default.Fragment,null,e&&c&&h.default.createElement(h.default.Fragment,null,e,h.default.createElement("iframe",{src:`${b}/sdk/v1/verify-email?email=${encodeURIComponent(e)}&chainName=${y}&date=${Date.now().toString()}`,style:{width:"0px",height:"0px",visibility:"hidden"}})),o?h.default.createElement("a",{onClick:P},o):h.default.createElement("button",{onClick:P},"Verify Email"))};0&&(module.exports={CreateWallet,PaperCheckout,PaperCheckoutDisplay,PaperSDKErrorCode,PaperSDKProvider,PayWithCard,usePaperSDKContext});
+          width=${o.width},
+          height=${o.height},
+          top=${v},
+          left=${g}`)}},c);case"NEW_TAB":return i.default.createElement("a",{onClick:()=>window.open(n,"_blank")},c);case"MODAL":return i.default.createElement(X,{clickableElement:c,checkoutUrl:n.href,width:o.width,height:o.height,isOpen:p,setIsOpen:h});case"DRAWER":return i.default.createElement(q,{clickableElement:c,checkoutUrl:n.href,width:o.width,isOpen:p,setIsOpen:h});case"EMBED":return i.default.createElement("iframe",{src:n.href,width:o.width,height:o.height});default:return console.error(`Invalid or unimplemented display type: ${r}`),i.default.createElement(i.default.Fragment,null)}},u={overlay:{position:"fixed",top:0,left:0,right:0,bottom:0,margin:0,zIndex:1,overflow:"hidden",display:"flex",visibility:"hidden",opacity:0,transition:"all 0.2s ease"},overlayIsVisible:{visibility:"visible",opacity:1,backdropFilter:"blur(2px)",background:"#0008"},modalOverlay:{alignItems:"center",justifyContent:"center"},drawerOverlay:{justifyContent:"flex-end"},modalDialog:{position:"relative",overflow:"hidden",borderRadius:"8px",visibility:"hidden",opacity:0,top:"5%",transition:"all 0.2s ease"},modalDialogIsVisible:{visibility:"visible",opacity:1,top:0},drawerDialog:{position:"relative",visibility:"hidden",opacity:0,right:"-10%",transition:"all 0.2s ease"},drawerDialogIsVisible:{visibility:"visible",opacity:1,right:0},modalCloseButton:{position:"absolute",top:"0.1em",right:"0.2em",borderRadius:"8px",fontSize:"x-large",padding:"0 0.4em",color:"#888"}},q=({clickableElement:e,checkoutUrl:r,width:a,isOpen:s,setIsOpen:t})=>i.default.createElement(i.default.Fragment,null,i.default.createElement("a",{onClick:()=>t(!0)},e),i.default.createElement("div",{className:"paper-overlay",style:d(d(d({},u.overlay),s?u.overlayIsVisible:{}),u.drawerOverlay)},i.default.createElement("div",{className:"paper-drawer",style:d(d({},u.drawerDialog),s?u.drawerDialogIsVisible:{})},i.default.createElement("button",{onClick:()=>t(!1),style:u.modalCloseButton},"\xD7"),i.default.createElement("iframe",{src:r,width:a,height:"100%"})))),X=({clickableElement:e,checkoutUrl:r,width:a,height:s,isOpen:t,setIsOpen:l})=>i.default.createElement(i.default.Fragment,null,i.default.createElement("a",{onClick:()=>l(!0)},e),i.default.createElement("div",{className:"paper-overlay",style:d(d(d({},u.overlay),t?u.overlayIsVisible:{}),u.modalOverlay)},i.default.createElement("div",{className:"paper-modal",style:d(d({},u.modalDialog),t?u.modalDialogIsVisible:{})},i.default.createElement("button",{onClick:()=>l(!1),style:u.modalCloseButton},"\xD7"),i.default.createElement("iframe",{src:r,width:a,height:s}))));var N=E(require("react"));var P=E(require("react")),M=(0,P.createContext)({chainName:"Polygon",setChainName:()=>{}}),Y=({chainName:e,children:r})=>{let[a,s]=(0,P.useState)(e),t=(0,P.useMemo)(()=>({chainName:a,setChainName:s}),[a,s]);return P.default.createElement(M.Provider,{value:t},r)},k=()=>(0,P.useContext)(M);var _=({url:e,title:r="Paper Checkout",width:a,height:s})=>{if(!(window!=null&&window.top))return;let t=window.top.outerHeight/2+window.top.screenY-s/2,l=window.top.outerWidth/2+window.top.screenX-a/2;window.open(e,r,`toolbar=no,
+    location=no,
+    status=no,
+    menubar=no,
+    scrollbars=yes,
+    resizable=yes,
+    width=${a},
+    height=${s},
+    top=${t},
+    left=${l}`)},Z=({checkoutId:e,recipientWalletAddress:r,emailAddress:a,quantity:s,options:t=d({},D),onPaymentSuccess:l,onTransferSuccess:o,onCancel:b,onError:y})=>{let{chainName:C}=k();(0,N.useEffect)(()=>{let h=n=>{var v,g,T,R;if(!n.origin.startsWith(w))return;let c=n.data,m=document.getElementById("payWithCardIframe");switch(c.eventType){case"payWithCardError":console.error("Error in Paper SDK PayWithCard",c.error),y&&y({code:c.code,error:c.error}),(v=m==null?void 0:m.contentWindow)==null||v.postMessage(d({},c),"*");break;case"payWithCardCancel":console.error("Paper SDK PayWithCard cancelled"),b&&b(),(g=m==null?void 0:m.contentWindow)==null||g.postMessage(d({},c),"*");break;case"paymentSuccess":l&&l({id:c.id}),(T=m==null?void 0:m.contentWindow)==null||T.postMessage(d({},c),"*");break;case"transferSuccess":o&&o({id:c.id}),(R=m==null?void 0:m.contentWindow)==null||R.postMessage(d({},c),"*");break;case"openReviewPaymentPopupWindow":_({url:c.url,width:c.width,height:c.height});break;default:}};window.addEventListener("message",h)},[]);let p=new URL("/sdk/v1/pay-with-card",w);return p.searchParams.append("checkoutId",e),p.searchParams.append("recipientWalletAddress",r),p.searchParams.append("chainName",C),a&&p.searchParams.append("emailAddress",a),s&&p.searchParams.append("quantity",s.toString()),t.colorPrimary&&p.searchParams.append("colorPrimary",t.colorPrimary),t.colorBackground&&p.searchParams.append("colorBackground",t.colorBackground),t.colorText&&p.searchParams.append("colorText",t.colorText),t.borderRadius!==void 0&&p.searchParams.append("borderRadius",t.borderRadius.toString()),t.fontFamily&&p.searchParams.append("fontFamily",t.fontFamily),p.searchParams.append("date",Date.now().toString()),N.default.createElement("iframe",{id:"payWithCardIframe",src:p.href,width:"100%",height:"100%",allowTransparency:!0})};var A=(o=>(o.InvalidProps="The props you passed in to this component are not valid.",o.InvalidCard="The card information is invalid. Please double check that the Card, CVC, and Zip code are all correct.",o.EmailNotVerified="The email was unable to be verified.",o.NotEnoughSupply="There is not enough supply to claim.",o.AddressNotAllowed="This address is not on the allowlist.",o.NoActiveClaimPhase="There is no active claim phase at the moment.",o))(A||{});var f=E(require("react"));var G=({emailAddress:e,onSuccess:r,onEmailVerificationInitiated:a,onError:s,children:t})=>{let[l,o]=(0,f.useState)(!1),{chainName:b}=k();(0,f.useEffect)(()=>{let C=p=>{let h=p.data;console.log("data is ",h),h.eventType==="verifyEmailEmailVerificationInitiated"?a&&a():h.eventType==="verifyEmailError"?(console.error("Error in Paper SDK VerifyEmail",h.error),s&&s({code:"The email was unable to be verified.",error:h.error})):h.eventType==="verifyEmailSuccess"&&r({emailAddress:h.emailAddress,walletAddress:h.walletAddress})};window.addEventListener("message",C)},[]);let y=()=>{o(!0)};return f.default.createElement(f.default.Fragment,null,e&&l&&f.default.createElement(f.default.Fragment,null,e,f.default.createElement("iframe",{src:`${w}/sdk/v1/verify-email?email=${encodeURIComponent(e)}&chainName=${b}&date=${Date.now().toString()}`,style:{width:"0px",height:"0px",visibility:"hidden"}})),t?f.default.createElement("a",{onClick:y},t):f.default.createElement("button",{onClick:y},"Verify Email"))};0&&(module.exports={CreateWallet,PaperCheckout,PaperCheckoutDisplay,PaperSDKErrorCode,PaperSDKProvider,PayWithCard,openCenteredPopup,usePaperSDKContext});
 //# sourceMappingURL=index.js.map

package.json

 {
   "name": "@paperxyz/react-client-sdk",
-  "version": "0.0.5",
+  "version": "0.0.6",
   "description": "Paper.xyz React Client SDK",
@@ -5,0 +5,0 @@ "source": "src/index.ts",

No alert changes

Improved metrics

Total package byte prevSize

114521

increased by7.42%

Lines of code

1131

increased by9.06%

No dependency changes