@crossmint/client-sdk-react-ui 1.0.1-alpha.5 → 1.1.0-alpha.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +201 -201
- package/dist/index.cjs +2 -0
- package/dist/index.cjs.map +1 -0
- package/dist/index.d.cts +18 -0
- package/dist/index.d.ts +18 -0
- package/dist/index.js +2 -0
- package/dist/index.js.map +1 -0
- package/package.json +18 -25
- package/src/components/CrossmintCollectionView.test.tsx +34 -0
- package/src/{CrossmintNFTCollectionView.tsx → components/CrossmintNFTCollectionView.tsx} +1 -3
- package/src/components/CrossmintNFTDetail.test.tsx +36 -0
- package/src/{CrossmintNFTDetail.tsx → components/CrossmintNFTDetail.tsx} +1 -3
- package/src/components/embed/CrossmintPaymentElement.test.tsx +78 -0
- package/src/components/embed/CryptoEmbeddedCheckout.tsx +13 -0
- package/src/components/embed/EmbeddedCheckoutIFrame.tsx +65 -0
- package/src/{CrossmintPaymentElement.tsx → components/embed/FiatPaymentElement_OLD.tsx} +8 -8
- package/src/components/embed/index.tsx +20 -0
- package/src/components/hosted/CrossmintPayButton.test.tsx +187 -0
- package/src/{CrossmintPayButton.tsx → components/hosted/CrossmintPayButton.tsx} +14 -5
- package/src/components/hosted/index.ts +1 -0
- package/src/{styles/index.ts → components/hosted/styles.ts} +1 -0
- package/src/components/index.ts +5 -0
- package/src/consts/version.ts +1 -0
- package/src/{useEnvironment.ts → hooks/useEnvironment.ts} +10 -10
- package/src/index.ts +4 -6
- package/lib/index.cjs +0 -1
- package/lib/index.d.ts +0 -18
- package/lib/index.js +0 -1
- package/src/types.ts +0 -8
- package/src/version.ts +0 -1
package/lib/index.cjs
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
"use strict";var it=Object.create;var d=Object.defineProperty;var st=Object.getOwnPropertyDescriptor;var at=Object.getOwnPropertyNames;var mt=Object.getPrototypeOf,lt=Object.prototype.hasOwnProperty;var ct=(t,e)=>{for(var n in e)d(t,n,{get:e[n],enumerable:!0})},V=(t,e,n,m)=>{if(e&&typeof e=="object"||typeof e=="function")for(let o of at(e))!lt.call(t,o)&&o!==n&&d(t,o,{get:()=>e[o],enumerable:!(m=st(e,o))||m.enumerable});return t};var h=(t,e,n)=>(n=t!=null?it(mt(t)):{},V(e||!t||!t.__esModule?d(n,"default",{value:t,enumerable:!0}):n,t)),gt=t=>V(d({},"__esModule",{value:!0}),t);var yt={};ct(yt,{CheckoutEvents:()=>v.CheckoutEvents,CrossmintNFTCollectionView:()=>ft,CrossmintNFTDetail:()=>dt,CrossmintPayButton:()=>ut,CrossmintPaymentElement:()=>ht,useCrossmintEvents:()=>v.useCrossmintEvents});module.exports=gt(yt);var i=h(require("react"),1),M=require("react"),c=require("@crossmint/client-sdk-base");var R=require("react-jss"),pt="#1e1e1e",F=t=>t==="light",U=t=>({buttonBgColor:F(t)?"white":pt,paragraphColor:F(t)?"black":"white"}),L=(0,R.createUseStyles)({"@global":{"@import":"url('https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap')"},crossmintButton:{display:"flex","flex-direction":"row","align-items":"center",padding:"0.875rem 0.875rem","font-weight":"900",transition:"opacity ease-in-out 0.25s","border-radius":"0.5rem","font-family":'"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif',outline:"none",border:"none","box-shadow":"0px 8px 15px rgba(0, 0, 0, 0.1)","justify-content":"center",background:({buttonBgColor:t})=>t,"&:hover:enabled":{opacity:"0.6",cursor:"pointer"}},crossmintImg:{width:"21px",height:"21px","margin-right":"0.875rem"},crossmintParagraph:{color:({paragraphColor:t})=>t,margin:"0"}});var y=require("react");function k(){let[t,e]=(0,y.useState)(!0);return(0,y.useEffect)(()=>{e(!1)},[]),{isServerSideRendering:t}}var l="1.0.1-alpha.5";function ut(t){let{className:e,disabled:n,onClick:m,style:o,tabIndex:w,theme:b="dark",mintTo:P,emailTo:s,listingId:g,auctionId:p,showOverlay:I=!0,mintConfig:_,whPassThroughArgs:A,environment:G,paymentMethod:u,preferredSigninMethod:H,dismissOverlayOnClick:$,prepay:j,locale:B="en-US",currency:K="usd",successCallbackURL:Q="",failureCallbackURL:W="",loginEmail:q="",projectId:z,getButtonText:E,...T}=t,J="clientId"in T?T.clientId:T.collectionId,[f,X]=(0,M.useState)(!1),{isServerSideRendering:Y}=k(),{connect:Z}=(0,c.crossmintModalService)({clientId:J,projectId:z,showOverlay:I,dismissOverlayOnClick:$,setConnecting:X,libVersion:l,environment:G,clientName:c.clientNames.reactUi,locale:B,currency:K,successCallbackURL:Q,failureCallbackURL:W,loginEmail:q}),{getButtonText:tt,handleClick:et}=(0,c.crossmintPayButtonService)({onClick:m,connecting:f,paymentMethod:u,locale:B}),nt=rt=>et(rt,()=>{Z(_,P,s,g,A,u,H,j)}),N=L(U(b)),ot=(0,i.useMemo)(()=>i.default.createElement("span",{className:N.crossmintParagraph,role:"button-paragraph"},E!=null?E(f,u||"fiat"):tt(f)),[f,E,u]);return i.default.createElement(i.default.Fragment,null,!Y&&i.default.createElement("button",{className:`${N.crossmintButton} ${e||""}`,disabled:n,onClick:nt,style:{...o},tabIndex:w},i.default.createElement("img",{className:N.crossmintImg,src:"https://www.crossmint.io/assets/crossmint/logo.svg",alt:"Crossmint logo"}),ot))}var O=h(require("react"),1),C=require("@crossmint/client-sdk-base");function ft(t){(0,C.assertValidNFTCollectionViewProps)(t);let e=(0,C.getNFTCollectionViewSrc)(t,l);return O.createElement("iframe",{src:e,width:"100%",height:"100%",style:{flexGrow:"1",border:"none",margin:"0",padding:"0"},role:"nft-collection-view"})}var D=h(require("react"),1),x=require("@crossmint/client-sdk-base");function dt(t){(0,x.assertValidValidateNFTDetailProps)(t);let e=(0,x.getNFTDetailSrc)(t,l);return D.createElement("iframe",{src:e,width:"100%",height:"100%",style:{flexGrow:"1",border:"none",margin:"0",padding:"0"},role:"nft-details"})}var r=h(require("react"),1),S=require("@crossmint/client-sdk-base");function ht(t){let[e,n]=(0,r.useState)(0),{getIframeUrl:m,listenToEvents:o,emitQueryParams:w}=(0,S.crossmintPaymentService)(t),{listenToEvents:b}=(0,S.crossmintUiService)({environment:t.environment}),[P]=(0,r.useState)(m());return(0,r.useEffect)(()=>{let s=o(g=>{var p;return(p=t.onEvent)==null?void 0:p.call(t,g.data)});return()=>{s&&s()}},[]),(0,r.useEffect)(()=>{let s=b(g=>{let{type:p,payload:I}=g.data;switch(p){case"ui:height.changed":n(I.height);break;default:return}});return()=>{s&&s()}},[]),(0,r.useEffect)(()=>{w({recipient:t.recipient,mintConfig:t.mintConfig,locale:t.locale,whPassThroughArgs:t.whPassThroughArgs})},[t.recipient,t.mintConfig,t.locale,t.whPassThroughArgs]),r.default.createElement("iframe",{src:P,id:"iframe-crossmint-payment-element",role:"iframe-crossmint-payment-element",allow:"payment *",style:{border:"none !important",padding:"0px !important",width:"100% !important",minWidth:"100% !important",overflow:"hidden !important",display:"block !important",userSelect:"none",transform:"translate(0px) !important",opacity:"1",transition:"ease 0s, opacity 0.4s ease 0.1s",height:`${e}px`}})}var v=require("@crossmint/client-sdk-base");0&&(module.exports={CheckoutEvents,CrossmintNFTCollectionView,CrossmintNFTDetail,CrossmintPayButton,CrossmintPaymentElement,useCrossmintEvents});
|
package/lib/index.d.ts
DELETED
|
@@ -1,18 +0,0 @@
|
|
|
1
|
-
import { MouseEvent, CSSProperties } from 'react';
|
|
2
|
-
import { CrossmintPayButtonProps, NFTCollectionViewProps, NFTDetailProps, PaymentElement } from '@crossmint/client-sdk-base';
|
|
3
|
-
export { CheckoutEventMap, CheckoutEvents, CrossmintCheckoutEvent, CrossmintCheckoutEventUnion, useCrossmintEvents } from '@crossmint/client-sdk-base';
|
|
4
|
-
|
|
5
|
-
type CrossmintPayButtonReactProps = CrossmintPayButtonProps & {
|
|
6
|
-
onClick?: (e: MouseEvent<HTMLButtonElement>) => void;
|
|
7
|
-
style?: CSSProperties;
|
|
8
|
-
};
|
|
9
|
-
|
|
10
|
-
declare function CrossmintPayButton(buttonProps: CrossmintPayButtonReactProps): JSX.Element;
|
|
11
|
-
|
|
12
|
-
declare function CrossmintNFTCollectionView(props: NFTCollectionViewProps): JSX.Element;
|
|
13
|
-
|
|
14
|
-
declare function CrossmintNFTDetail(props: NFTDetailProps): JSX.Element;
|
|
15
|
-
|
|
16
|
-
declare function CrossmintPaymentElement(props: PaymentElement): JSX.Element;
|
|
17
|
-
|
|
18
|
-
export { CrossmintNFTCollectionView, CrossmintNFTDetail, CrossmintPayButton, CrossmintPaymentElement };
|
package/lib/index.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import m,{useMemo as tt}from"react";import{useState as et}from"react";import{clientNames as nt,crossmintModalService as ot,crossmintPayButtonService as rt}from"@crossmint/client-sdk-base";import{createUseStyles as J}from"react-jss";var X="#1e1e1e",P=t=>t==="light",I=t=>({buttonBgColor:P(t)?"white":X,paragraphColor:P(t)?"black":"white"}),E=J({"@global":{"@import":"url('https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap')"},crossmintButton:{display:"flex","flex-direction":"row","align-items":"center",padding:"0.875rem 0.875rem","font-weight":"900",transition:"opacity ease-in-out 0.25s","border-radius":"0.5rem","font-family":'"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif',outline:"none",border:"none","box-shadow":"0px 8px 15px rgba(0, 0, 0, 0.1)","justify-content":"center",background:({buttonBgColor:t})=>t,"&:hover:enabled":{opacity:"0.6",cursor:"pointer"}},crossmintImg:{width:"21px",height:"21px","margin-right":"0.875rem"},crossmintParagraph:{color:({paragraphColor:t})=>t,margin:"0"}});import{useEffect as Y,useState as Z}from"react";function v(){let[t,e]=Z(!0);return Y(()=>{e(!1)},[]),{isServerSideRendering:t}}var i="1.0.1-alpha.5";function Pt(t){let{className:e,disabled:g,onClick:p,style:u,tabIndex:f,theme:d="dark",mintTo:h,emailTo:n,listingId:s,auctionId:a,showOverlay:y=!0,mintConfig:B,whPassThroughArgs:V,environment:F,paymentMethod:l,preferredSigninMethod:R,dismissOverlayOnClick:U,prepay:L,locale:b="en-US",currency:M="usd",successCallbackURL:O="",failureCallbackURL:D="",loginEmail:_="",projectId:A,getButtonText:C,...x}=t,G="clientId"in x?x.clientId:x.collectionId,[c,H]=et(!1),{isServerSideRendering:$}=v(),{connect:j}=ot({clientId:G,projectId:A,showOverlay:y,dismissOverlayOnClick:U,setConnecting:H,libVersion:i,environment:F,clientName:nt.reactUi,locale:b,currency:M,successCallbackURL:O,failureCallbackURL:D,loginEmail:_}),{getButtonText:K,handleClick:Q}=rt({onClick:p,connecting:c,paymentMethod:l,locale:b}),W=z=>Q(z,()=>{j(B,h,n,s,V,l,R,L)}),S=E(I(d)),q=tt(()=>m.createElement("span",{className:S.crossmintParagraph,role:"button-paragraph"},C!=null?C(c,l||"fiat"):K(c)),[c,C,l]);return m.createElement(m.Fragment,null,!$&&m.createElement("button",{className:`${S.crossmintButton} ${e||""}`,disabled:g,onClick:W,style:{...u},tabIndex:f},m.createElement("img",{className:S.crossmintImg,src:"https://www.crossmint.io/assets/crossmint/logo.svg",alt:"Crossmint logo"}),q))}import*as T from"react";import{assertValidNFTCollectionViewProps as it,getNFTCollectionViewSrc as st}from"@crossmint/client-sdk-base";function kt(t){it(t);let e=st(t,i);return T.createElement("iframe",{src:e,width:"100%",height:"100%",style:{flexGrow:"1",border:"none",margin:"0",padding:"0"},role:"nft-collection-view"})}import*as N from"react";import{assertValidValidateNFTDetailProps as at,getNFTDetailSrc as mt}from"@crossmint/client-sdk-base";function Ut(t){at(t);let e=mt(t,i);return N.createElement("iframe",{src:e,width:"100%",height:"100%",style:{flexGrow:"1",border:"none",margin:"0",padding:"0"},role:"nft-details"})}import lt,{useEffect as w,useState as k}from"react";import{crossmintPaymentService as ct,crossmintUiService as gt}from"@crossmint/client-sdk-base";function Dt(t){let[e,g]=k(0),{getIframeUrl:p,listenToEvents:u,emitQueryParams:f}=ct(t),{listenToEvents:d}=gt({environment:t.environment}),[h]=k(p());return w(()=>{let n=u(s=>{var a;return(a=t.onEvent)==null?void 0:a.call(t,s.data)});return()=>{n&&n()}},[]),w(()=>{let n=d(s=>{let{type:a,payload:y}=s.data;switch(a){case"ui:height.changed":g(y.height);break;default:return}});return()=>{n&&n()}},[]),w(()=>{f({recipient:t.recipient,mintConfig:t.mintConfig,locale:t.locale,whPassThroughArgs:t.whPassThroughArgs})},[t.recipient,t.mintConfig,t.locale,t.whPassThroughArgs]),lt.createElement("iframe",{src:h,id:"iframe-crossmint-payment-element",role:"iframe-crossmint-payment-element",allow:"payment *",style:{border:"none !important",padding:"0px !important",width:"100% !important",minWidth:"100% !important",overflow:"hidden !important",display:"block !important",userSelect:"none",transform:"translate(0px) !important",opacity:"1",transition:"ease 0s, opacity 0.4s ease 0.1s",height:`${e}px`}})}import{CheckoutEvents as Qt,useCrossmintEvents as Wt}from"@crossmint/client-sdk-base";export{Qt as CheckoutEvents,kt as CrossmintNFTCollectionView,Ut as CrossmintNFTDetail,Pt as CrossmintPayButton,Dt as CrossmintPaymentElement,Wt as useCrossmintEvents};
|
package/src/types.ts
DELETED
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
import { CSSProperties, MouseEvent } from "react";
|
|
2
|
-
|
|
3
|
-
import { CrossmintPayButtonProps } from "@crossmint/client-sdk-base";
|
|
4
|
-
|
|
5
|
-
export type CrossmintPayButtonReactProps = CrossmintPayButtonProps & {
|
|
6
|
-
onClick?: (e: MouseEvent<HTMLButtonElement>) => void;
|
|
7
|
-
style?: CSSProperties;
|
|
8
|
-
};
|
package/src/version.ts
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export const LIB_VERSION = "1.0.1-alpha.5";
|