@crossmint/client-sdk-react-ui 0.0.5-alpha.1 → 0.0.8-alpha.0

package/lib/esm/CrossMintProvider.js

@@ -1,15 +1,17 @@
-import React, { useState } from "react";
-import { CrossMintModal } from "./CrossMintModal";
-import { CrossMintPopupProvider } from "./CrossMintPopupProvider";
-import { CrossMintModalContext } from "./useCrossMintModal";
-export const CrossMintProvider = ({ development = false, children, ...props }) => {
-    const [visible, setVisible] = useState(false);
-    return (React.createElement(CrossMintModalContext.Provider, { value: {
-            visible,
-            setVisible,
-        } },
-        React.createElement(CrossMintPopupProvider, { development: development },
-            children,
-            visible && React.createElement(CrossMintModal, { ...props }))));
-};
+import React, { useState } from "react";
+import { CrossMintModal } from "./CrossMintModal";
+import { CrossMintPopupProvider } from "./CrossMintPopupProvider";
+import { CrossMintStatusProvider } from "./CrossMintStatusProvider";
+import { CrossMintModalContext } from "./useCrossMintModal";
+export const CrossMintProvider = ({ clientId, hideMintOnInactiveClient = false, development = false, children, ...props }) => {
+    const [visible, setVisible] = useState(false);
+    return (React.createElement(CrossMintStatusProvider, { clientId: clientId, hideMintOnInactiveClient: hideMintOnInactiveClient },
+        React.createElement(CrossMintModalContext.Provider, { value: {
+                visible,
+                setVisible,
+            } },
+            React.createElement(CrossMintPopupProvider, { development: development },
+                children,
+                visible && React.createElement(CrossMintModal, { ...props })))));
+};
 //# sourceMappingURL=CrossMintProvider.js.map

package/lib/esm/CrossMintProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"CrossMintProvider.js","sourceRoot":"","sources":["../../src/CrossMintProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAiB,QAAQ,EAAE,MAAM,OAAO,CAAC;AACvD,OAAO,EAAE,cAAc,EAAuB,MAAM,kBAAkB,CAAC;AACvE,OAAO,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,EAAE,qBAAqB,EAAE,MAAM,qBAAqB,CAAC;AAQ5D,MAAM,CAAC,MAAM,iBAAiB,GAA+B,CAAC,EAAE,WAAW,GAAG,KAAK,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,EAAE;IACzG,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAE9C,OAAO,CACH,oBAAC,qBAAqB,CAAC,QAAQ,IAC3B,KAAK,EAAE;YACH,OAAO;YACP,UAAU;SACb;QAED,oBAAC,sBAAsB,IAAC,WAAW,EAAE,WAAW;YAC3C,QAAQ;YACR,OAAO,IAAI,oBAAC,cAAc,OAAK,KAAK,GAAI,CACpB,CACI,CACpC,CAAC;AACN,CAAC,CAAC"}
+{"version":3,"file":"CrossMintProvider.js","sourceRoot":"","sources":["../../src/CrossMintProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAiB,QAAQ,EAAE,MAAM,OAAO,CAAC;AACvD,OAAO,EAAE,cAAc,EAAuB,MAAM,kBAAkB,CAAC;AACvE,OAAO,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,EAAE,uBAAuB,EAAE,MAAM,2BAA2B,CAAC;AACpE,OAAO,EAAE,qBAAqB,EAAE,MAAM,qBAAqB,CAAC;AAS5D,MAAM,CAAC,MAAM,iBAAiB,GAA+B,CAAC,EAC1D,QAAQ,EACR,wBAAwB,GAAG,KAAK,EAChC,WAAW,GAAG,KAAK,EACnB,QAAQ,EACR,GAAG,KAAK,EACX,EAAE,EAAE;IACD,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAE9C,OAAO,CACH,oBAAC,uBAAuB,IAAC,QAAQ,EAAE,QAAQ,EAAE,wBAAwB,EAAE,wBAAwB;QAC3F,oBAAC,qBAAqB,CAAC,QAAQ,IAC3B,KAAK,EAAE;gBACH,OAAO;gBACP,UAAU;aACb;YAED,oBAAC,sBAAsB,IAAC,WAAW,EAAE,WAAW;gBAC3C,QAAQ;gBACR,OAAO,IAAI,oBAAC,cAAc,OAAK,KAAK,GAAI,CACpB,CACI,CACX,CAC7B,CAAC;AACN,CAAC,CAAC"}

package/lib/esm/CrossMintStatusButton.d.ts

@@ -0,0 +1,10 @@
+import { CSSProperties, FC, MouseEvent } from "react";
+export interface StatusButtonProps {
+    className?: string;
+    disabled?: boolean;
+    onClick?: (e: MouseEvent<HTMLButtonElement>) => void;
+    style?: CSSProperties;
+    tabIndex?: number;
+    theme?: "light" | "dark";
+}
+export declare const CrossMintStatusButton: FC<StatusButtonProps>;

package/lib/esm/CrossMintStatusButton.js

@@ -0,0 +1,31 @@
+import React, { useMemo, useCallback } from "react";
+import { OnboardingRequestStatusResponse, useCrossMintStatus } from "./useCrossMintStatus";
+export const CrossMintStatusButton = ({ className, disabled, onClick, style, tabIndex, theme = "dark", ...props }) => {
+    const { status, clientId } = useCrossMintStatus();
+    const handleClick = useCallback((event) => {
+        if (onClick)
+            onClick(event);
+        if (status === OnboardingRequestStatusResponse.WAITING_SUBMISSION) {
+            window.open(`https://crossmint.io/developers/onboarding${clientId && `?clientId=${clientId}`}`, "_blank");
+            return;
+        }
+    }, [status]);
+    const content = useMemo(() => {
+        switch (status) {
+            case OnboardingRequestStatusResponse.INVALID:
+                return React.createElement("p", null, "Invalid clientId");
+            case OnboardingRequestStatusResponse.WAITING_SUBMISSION:
+                return React.createElement("p", null, "Click here to setup CrossMint");
+            case OnboardingRequestStatusResponse.PENDING:
+                return React.createElement("p", null, "Your application is under review");
+            case OnboardingRequestStatusResponse.ACCEPTED:
+                return React.createElement("p", null, "You're good to go!");
+            case OnboardingRequestStatusResponse.REJECTED:
+                return React.createElement("p", null, "You're application was rejected");
+        }
+    }, [status]);
+    return (React.createElement("button", { className: `client-sdk-button-trigger client-sdk-button-trigger-${theme}`, disabled: status !== OnboardingRequestStatusResponse.WAITING_SUBMISSION, onClick: handleClick, style: { ...style }, tabIndex: tabIndex, ...props },
+        React.createElement("img", { className: "client-sdk-button-icon", src: "https://www.crossmint.io/assets/crossmint/logo.png", alt: "Crossmint logo" }),
+        content));
+};
+//# sourceMappingURL=CrossMintStatusButton.js.map

package/lib/esm/CrossMintStatusButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CrossMintStatusButton.js","sourceRoot":"","sources":["../../src/CrossMintStatusButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAoD,OAAO,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AACtG,OAAO,EAAE,+BAA+B,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAW3F,MAAM,CAAC,MAAM,qBAAqB,GAA0B,CAAC,EACzD,SAAS,EACT,QAAQ,EACR,OAAO,EACP,KAAK,EACL,QAAQ,EACR,KAAK,GAAG,MAAM,EACd,GAAG,KAAK,EACX,EAAE,EAAE;IACD,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,GAAG,kBAAkB,EAAE,CAAC;IAElD,MAAM,WAAW,GAAyC,WAAW,CACjE,CAAC,KAAK,EAAE,EAAE;QACN,IAAI,OAAO;YAAE,OAAO,CAAC,KAAK,CAAC,CAAC;QAE5B,IAAI,MAAM,KAAK,+BAA+B,CAAC,kBAAkB,EAAE;YAC/D,MAAM,CAAC,IAAI,CACP,6CAA6C,QAAQ,IAAI,aAAa,QAAQ,EAAE,EAAE,EAClF,QAAQ,CACX,CAAC;YACF,OAAO;SACV;IACL,CAAC,EACD,CAAC,MAAM,CAAC,CACX,CAAC;IAEF,MAAM,OAAO,GAAG,OAAO,CAAC,GAAG,EAAE;QACzB,QAAQ,MAAM,EAAE;YACZ,KAAK,+BAA+B,CAAC,OAAO;gBACxC,OAAO,kDAAuB,CAAC;YACnC,KAAK,+BAA+B,CAAC,kBAAkB;gBACnD,OAAO,+DAAoC,CAAC;YAChD,KAAK,+BAA+B,CAAC,OAAO;gBACxC,OAAO,kEAAuC,CAAC;YACnD,KAAK,+BAA+B,CAAC,QAAQ;gBACzC,OAAO,oDAAyB,CAAC;YACrC,KAAK,+BAA+B,CAAC,QAAQ;gBACzC,OAAO,iEAAsC,CAAC;SACrD;IACL,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;IAEb,OAAO,CACH,gCACI,SAAS,EAAE,uDAAuD,KAAK,EAAE,EACzE,QAAQ,EAAE,MAAM,KAAK,+BAA+B,CAAC,kBAAkB,EACvE,OAAO,EAAE,WAAW,EACpB,KAAK,EAAE,EAAE,GAAG,KAAK,EAAE,EACnB,QAAQ,EAAE,QAAQ,KACd,KAAK;QAET,6BACI,SAAS,EAAC,wBAAwB,EAClC,GAAG,EAAC,oDAAoD,EACxD,GAAG,EAAC,gBAAgB,GACtB;QACD,OAAO,CACH,CACZ,CAAC;AACN,CAAC,CAAC"}

package/lib/esm/CrossMintStatusProvider.d.ts

@@ -0,0 +1,7 @@
+import { FC, ReactNode } from "react";
+export interface CrossMintStatusProviderProps {
+    clientId: string;
+    hideMintOnInactiveClient: boolean;
+    children: ReactNode;
+}
+export declare const CrossMintStatusProvider: FC<CrossMintStatusProviderProps>;

package/lib/esm/CrossMintStatusProvider.js

@@ -0,0 +1,31 @@
+import React, { useEffect, useState } from "react";
+import { OnboardingRequestStatusResponse, CrossMintStatusContext } from "./useCrossMintStatus";
+export const CrossMintStatusProvider = ({ clientId, hideMintOnInactiveClient, children, }) => {
+    const [status, setStatus] = useState(OnboardingRequestStatusResponse.WAITING_SUBMISSION);
+    async function fetchClientIntegration() {
+        const res = await fetch(`https://crossmint.io/api/crossmint/onboardingRequests/${clientId}/status`);
+        if (res.status === 200) {
+            const resData = await res.json();
+            console.log("resData", resData);
+            setStatus(resData.status);
+        }
+        else {
+            if (status !== OnboardingRequestStatusResponse.INVALID) {
+                setStatus(OnboardingRequestStatusResponse.INVALID);
+            }
+        }
+    }
+    useEffect(() => {
+        fetchClientIntegration();
+        const interval = setInterval(() => {
+            fetchClientIntegration();
+        }, 60 * 1000);
+        return () => clearInterval(interval);
+    }, []);
+    return (React.createElement(CrossMintStatusContext.Provider, { value: {
+            status,
+            clientId,
+            hideMintOnInactiveClient,
+        } }, children));
+};
+//# sourceMappingURL=CrossMintStatusProvider.js.map

package/lib/esm/CrossMintStatusProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CrossMintStatusProvider.js","sourceRoot":"","sources":["../../src/CrossMintStatusProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAiB,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAClE,OAAO,EAAE,+BAA+B,EAAE,sBAAsB,EAAE,MAAM,sBAAsB,CAAC;AAQ/F,MAAM,CAAC,MAAM,uBAAuB,GAAqC,CAAC,EACtE,QAAQ,EACR,wBAAwB,EACxB,QAAQ,GACX,EAAE,EAAE;IACD,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAChC,+BAA+B,CAAC,kBAAkB,CACrD,CAAC;IAEF,KAAK,UAAU,sBAAsB;QACjC,MAAM,GAAG,GAAG,MAAM,KAAK,CAAC,yDAAyD,QAAQ,SAAS,CAAC,CAAC;QAEpG,IAAI,GAAG,CAAC,MAAM,KAAK,GAAG,EAAE;YACpB,MAAM,OAAO,GAAkE,MAAM,GAAG,CAAC,IAAI,EAAE,CAAC;YAEhG,OAAO,CAAC,GAAG,CAAC,SAAS,EAAE,OAAO,CAAC,CAAC;YAChC,SAAS,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;SAC7B;aAAM;YACH,IAAI,MAAM,KAAK,+BAA+B,CAAC,OAAO,EAAE;gBACpD,SAAS,CAAC,+BAA+B,CAAC,OAAO,CAAC,CAAC;aACtD;SACJ;IACL,CAAC;IAED,SAAS,CAAC,GAAG,EAAE;QACX,sBAAsB,EAAE,CAAC;QAEzB,MAAM,QAAQ,GAAG,WAAW,CAAC,GAAG,EAAE;YAC9B,sBAAsB,EAAE,CAAC;QAC7B,CAAC,EAAE,EAAE,GAAG,IAAI,CAAC,CAAC;QAEd,OAAO,GAAG,EAAE,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;IACzC,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,CACH,oBAAC,sBAAsB,CAAC,QAAQ,IAC5B,KAAK,EAAE;YACH,MAAM;YACN,QAAQ;YACR,wBAAwB;SAC3B,IAEA,QAAQ,CACqB,CACrC,CAAC;AACN,CAAC,CAAC"}

package/lib/esm/index.d.ts

@@ -1,5 +1,7 @@
-export * from "./CrossMintButton";
-export * from "./CrossMintModal";
-export * from "./useCrossMintModal";
-export * from "./useCrossMintPopup";
-export * from "./CrossMintProvider";
+export * from "./CrossMintButton";
+export * from "./CrossMintModal";
+export * from "./useCrossMintModal";
+export * from "./useCrossMintPopup";
+export * from "./CrossMintProvider";
+export * from "./useCrossMintStatus";
+export * from "./CrossMintStatusButton";

package/lib/esm/index.js

@@ -1,6 +1,8 @@
-export * from "./CrossMintButton";
-export * from "./CrossMintModal";
-export * from "./useCrossMintModal";
-export * from "./useCrossMintPopup";
-export * from "./CrossMintProvider";
+export * from "./CrossMintButton";
+export * from "./CrossMintModal";
+export * from "./useCrossMintModal";
+export * from "./useCrossMintPopup";
+export * from "./CrossMintProvider";
+export * from "./useCrossMintStatus";
+export * from "./CrossMintStatusButton";
 //# sourceMappingURL=index.js.map

package/lib/esm/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,mBAAmB,CAAC;AAClC,cAAc,kBAAkB,CAAC;AACjC,cAAc,qBAAqB,CAAC;AACpC,cAAc,qBAAqB,CAAC;AACpC,cAAc,qBAAqB,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,mBAAmB,CAAC;AAClC,cAAc,kBAAkB,CAAC;AACjC,cAAc,qBAAqB,CAAC;AACpC,cAAc,qBAAqB,CAAC;AACpC,cAAc,qBAAqB,CAAC;AACpC,cAAc,sBAAsB,CAAC;AACrC,cAAc,yBAAyB,CAAC"}

package/lib/esm/useCrossMintModal.d.ts

@@ -1,7 +1,7 @@
-/// <reference types="react" />
-export interface CrossMintModalContextState {
-    visible: boolean;
-    setVisible: (open: boolean) => void;
-}
-export declare const CrossMintModalContext: import("react").Context<CrossMintModalContextState>;
-export declare function useCrossMintModal(): CrossMintModalContextState;
+/// <reference types="react" />
+export interface CrossMintModalContextState {
+    visible: boolean;
+    setVisible: (open: boolean) => void;
+}
+export declare const CrossMintModalContext: import("react").Context<CrossMintModalContextState>;
+export declare function useCrossMintModal(): CrossMintModalContextState;

package/lib/esm/useCrossMintModal.js

@@ -1,6 +1,6 @@
-import { createContext, useContext } from "react";
-export const CrossMintModalContext = createContext({});
-export function useCrossMintModal() {
-    return useContext(CrossMintModalContext);
-}
+import { createContext, useContext } from "react";
+export const CrossMintModalContext = createContext({});
+export function useCrossMintModal() {
+    return useContext(CrossMintModalContext);
+}
 //# sourceMappingURL=useCrossMintModal.js.map

package/lib/esm/useCrossMintPopup.d.ts

@@ -1,8 +1,8 @@
-/// <reference types="react" />
-export interface PopupContextState {
-    connecting: boolean;
-    connect: (candyMachineId: string, collectionTitle?: string, collectionDescription?: string, collectionPhoto?: string) => void;
-    popup: Window | null;
-}
-export declare const PopupContext: import("react").Context<PopupContextState>;
-export declare function useCrossMintPopup(): PopupContextState;
+/// <reference types="react" />
+export interface PopupContextState {
+    connecting: boolean;
+    connect: (collectionTitle?: string, collectionDescription?: string, collectionPhoto?: string, mintTo?: string, emailTo?: string, listingId?: string) => void;
+    popup: Window | null;
+}
+export declare const PopupContext: import("react").Context<PopupContextState>;
+export declare function useCrossMintPopup(): PopupContextState;

package/lib/esm/useCrossMintPopup.js

@@ -1,6 +1,6 @@
-import { createContext, useContext } from "react";
-export const PopupContext = createContext({});
-export function useCrossMintPopup() {
-    return useContext(PopupContext);
-}
+import { createContext, useContext } from "react";
+export const PopupContext = createContext({});
+export function useCrossMintPopup() {
+    return useContext(PopupContext);
+}
 //# sourceMappingURL=useCrossMintPopup.js.map

package/lib/esm/useCrossMintPopup.js.map

@@ -1 +1 @@
-{"version":3,"file":"useCrossMintPopup.js","sourceRoot":"","sources":["../../src/useCrossMintPopup.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAclD,MAAM,CAAC,MAAM,YAAY,GAAG,aAAa,CAAoB,EAAuB,CAAC,CAAC;AAEtF,MAAM,UAAU,iBAAiB;IAC7B,OAAO,UAAU,CAAC,YAAY,CAAC,CAAC;AACpC,CAAC"}
+{"version":3,"file":"useCrossMintPopup.js","sourceRoot":"","sources":["../../src/useCrossMintPopup.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAgBlD,MAAM,CAAC,MAAM,YAAY,GAAG,aAAa,CAAoB,EAAuB,CAAC,CAAC;AAEtF,MAAM,UAAU,iBAAiB;IAC7B,OAAO,UAAU,CAAC,YAAY,CAAC,CAAC;AACpC,CAAC"}

package/lib/esm/useCrossMintStatus.d.ts

@@ -0,0 +1,15 @@
+/// <reference types="react" />
+export declare enum OnboardingRequestStatusResponse {
+    WAITING_SUBMISSION = "waiting-submission",
+    PENDING = "pending",
+    REJECTED = "rejected",
+    ACCEPTED = "accepted",
+    INVALID = "invalid"
+}
+export interface CrossMintStatusContextState {
+    status: OnboardingRequestStatusResponse;
+    clientId: string;
+    hideMintOnInactiveClient: boolean;
+}
+export declare const CrossMintStatusContext: import("react").Context<CrossMintStatusContextState>;
+export declare function useCrossMintStatus(): CrossMintStatusContextState;

package/lib/esm/useCrossMintStatus.js

@@ -0,0 +1,14 @@
+import { createContext, useContext } from "react";
+export var OnboardingRequestStatusResponse;
+(function (OnboardingRequestStatusResponse) {
+    OnboardingRequestStatusResponse["WAITING_SUBMISSION"] = "waiting-submission";
+    OnboardingRequestStatusResponse["PENDING"] = "pending";
+    OnboardingRequestStatusResponse["REJECTED"] = "rejected";
+    OnboardingRequestStatusResponse["ACCEPTED"] = "accepted";
+    OnboardingRequestStatusResponse["INVALID"] = "invalid";
+})(OnboardingRequestStatusResponse || (OnboardingRequestStatusResponse = {}));
+export const CrossMintStatusContext = createContext({});
+export function useCrossMintStatus() {
+    return useContext(CrossMintStatusContext);
+}
+//# sourceMappingURL=useCrossMintStatus.js.map

package/lib/esm/useCrossMintStatus.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useCrossMintStatus.js","sourceRoot":"","sources":["../../src/useCrossMintStatus.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAElD,MAAM,CAAN,IAAY,+BAMX;AAND,WAAY,+BAA+B;IACvC,4EAAyC,CAAA;IACzC,sDAAmB,CAAA;IACnB,wDAAqB,CAAA;IACrB,wDAAqB,CAAA;IACrB,sDAAmB,CAAA;AACvB,CAAC,EANW,+BAA+B,KAA/B,+BAA+B,QAM1C;AAQD,MAAM,CAAC,MAAM,sBAAsB,GAAG,aAAa,CAA8B,EAAiC,CAAC,CAAC;AAEpH,MAAM,UAAU,kBAAkB;IAC9B,OAAO,UAAU,CAAC,sBAAsB,CAAC,CAAC;AAC9C,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@crossmint/client-sdk-react-ui",
-    "version": "0.0.5-alpha.1",
+    "version": "0.0.8-alpha.0",
     "author": "Paella Labs Inc",
     "license": "Apache-2.0",
     "repository": "https://github.com/CrossMint/crossmint-client-sdk",
@@ -28,7 +28,7 @@
     "scripts": {
         "clean": "shx rm -rf lib/*",
         "build": "yarn clean && tsc -p tsconfig.json && tsc -p tsconfig-cjs.json",
-        "postbuild": "echo '{\"type\":\"commonjs\"}' | npx json > lib/cjs/package.json && echo '{\"type\":\"module\"} ' | npx json > lib/esm/package.json"
+        "postbuild": "echo {\"type\":\"commonjs\"} | npx json > lib/cjs/package.json && echo {\"type\":\"module\"} | npx json > lib/esm/package.json"
     },
     "peerDependencies": {
         "react": "^17.0.2",
@@ -40,5 +40,5 @@
         "react": "^17.0.2",
         "react-dom": "^17.0.2"
     },
-    "gitHead": "358bee40dee1bfa54abf61050860d152947e32c5"
+    "gitHead": "de01d9a883021d03c2cf37f9442144abb8fae9b9"
 }

package/src/CrossMintButton.tsx

@@ -1,8 +1,8 @@
 import React, { CSSProperties, FC, MouseEvent, MouseEventHandler, useMemo, useCallback } from "react";
+import { OnboardingRequestStatusResponse, useCrossMintStatus } from ".";
 import { useCrossMintPopup } from "./useCrossMintPopup";
 
 export interface ButtonProps {
-    candyMachineId: string;
     className?: string;
     disabled?: boolean;
     onClick?: (e: MouseEvent<HTMLButtonElement>) => void;
@@ -12,10 +12,12 @@ export interface ButtonProps {
     collectionTitle?: string;
     collectionDescription?: string;
     collectionPhoto?: string;
+    mintTo?: string;
+    emailTo?: string;
+    listingId?: string;
 }
 
 export const CrossMintButton: FC<ButtonProps> = ({
-    candyMachineId,
     className,
     disabled,
     onClick,
@@ -25,8 +27,13 @@ export const CrossMintButton: FC<ButtonProps> = ({
     collectionTitle,
     collectionDescription,
     collectionPhoto,
+    mintTo,
+    emailTo,
+    listingId,
     ...props
 }) => {
+    const { hideMintOnInactiveClient, status } = useCrossMintStatus();
+
     const { connecting, connect } = useCrossMintPopup();
 
     const handleClick: MouseEventHandler<HTMLButtonElement> = useCallback(
@@ -34,7 +41,7 @@ export const CrossMintButton: FC<ButtonProps> = ({
             if (onClick) onClick(event);
 
             if (!event.defaultPrevented)
-                connect(candyMachineId, collectionTitle, collectionDescription, collectionPhoto);
+                connect(collectionTitle, collectionDescription, collectionPhoto, mintTo, emailTo, listingId);
         },
         [onClick]
     );
@@ -44,6 +51,10 @@ export const CrossMintButton: FC<ButtonProps> = ({
         return <p>Buy with credit card</p>;
     }, [connecting]);
 
+    if (hideMintOnInactiveClient && status !== OnboardingRequestStatusResponse.ACCEPTED) {
+        return null;
+    }
+
     return (
         <button
             className={`client-sdk-button-trigger client-sdk-button-trigger-${theme}`}

package/src/CrossMintModal.tsx

@@ -1,54 +1,54 @@
-import React, { FC, useCallback, useLayoutEffect, useRef, useState } from "react";
-import { createPortal } from "react-dom";
-import { useCrossMintModal } from "./useCrossMintModal";
-
-export interface CrossMintModalProps {
-    className?: string;
-    container?: string;
-}
-
-export const CrossMintModal: FC<CrossMintModalProps> = ({ className = "", container = "body" }) => {
-    const ref = useRef<HTMLDivElement>(null);
-    const { setVisible } = useCrossMintModal();
-
-    const [fadeIn, setFadeIn] = useState(false);
-    const [portal, setPortal] = useState<Element | null>(null);
-
-    const hideModal = useCallback(() => {
-        setFadeIn(false);
-        setTimeout(() => setVisible(false), 150);
-    }, [setFadeIn, setVisible]);
-
-    useLayoutEffect(() => {
-        // Get original overflow
-        const { overflow } = window.getComputedStyle(document.body);
-        // Hack to enable fade in animation after mount
-        setTimeout(() => setFadeIn(true), 0);
-        // Prevent scrolling on mount
-        document.body.style.overflow = "hidden";
-
-        return () => {
-            // Re-enable scrolling when component unmounts
-            document.body.style.overflow = overflow;
-        };
-    }, [hideModal]);
-
-    useLayoutEffect(() => setPortal(document.querySelector(container)), [setPortal, container]);
-
-    return (
-        portal &&
-        createPortal(
-            <div
-                aria-modal="true"
-                className={`client-sdk-modal ${fadeIn && "client-sdk-modal-fade-in"} ${className}`}
-                ref={ref}
-            >
-                <div className="client-sdk-modal-container">
-                    <span className="client-sdk-modal-loader" />
-                </div>
-                <div className="client-sdk-modal-overlay" />
-            </div>,
-            portal
-        )
-    );
-};
+import React, { FC, useCallback, useLayoutEffect, useRef, useState } from "react";
+import { createPortal } from "react-dom";
+import { useCrossMintModal } from "./useCrossMintModal";
+
+export interface CrossMintModalProps {
+    className?: string;
+    container?: string;
+}
+
+export const CrossMintModal: FC<CrossMintModalProps> = ({ className = "", container = "body" }) => {
+    const ref = useRef<HTMLDivElement>(null);
+    const { setVisible } = useCrossMintModal();
+
+    const [fadeIn, setFadeIn] = useState(false);
+    const [portal, setPortal] = useState<Element | null>(null);
+
+    const hideModal = useCallback(() => {
+        setFadeIn(false);
+        setTimeout(() => setVisible(false), 150);
+    }, [setFadeIn, setVisible]);
+
+    useLayoutEffect(() => {
+        // Get original overflow
+        const { overflow } = window.getComputedStyle(document.body);
+        // Hack to enable fade in animation after mount
+        setTimeout(() => setFadeIn(true), 0);
+        // Prevent scrolling on mount
+        document.body.style.overflow = "hidden";
+
+        return () => {
+            // Re-enable scrolling when component unmounts
+            document.body.style.overflow = overflow;
+        };
+    }, [hideModal]);
+
+    useLayoutEffect(() => setPortal(document.querySelector(container)), [setPortal, container]);
+
+    return (
+        portal &&
+        createPortal(
+            <div
+                aria-modal="true"
+                className={`client-sdk-modal ${fadeIn && "client-sdk-modal-fade-in"} ${className}`}
+                ref={ref}
+            >
+                <div className="client-sdk-modal-container">
+                    <span className="client-sdk-modal-loader" />
+                </div>
+                <div className="client-sdk-modal-overlay" />
+            </div>,
+            portal
+        )
+    );
+};

package/src/CrossMintModalProvider.tsx

@@ -1,7 +1,6 @@
 import React, { FC, ReactNode, useState } from "react";
 import { CrossMintModal, CrossMintModalProps } from "./CrossMintModal";
 import { CrossMintModalContext } from "./useCrossMintModal";
-// import { WalletModal, WalletModalProps } from './WalletModal';
 
 export interface CrossMintModalProviderProps extends CrossMintModalProps {
     children: ReactNode;

package/src/CrossMintPopupProvider.tsx

@@ -1,5 +1,5 @@
 import React, { FC, ReactNode, useState } from "react";
-import { useCrossMintModal } from ".";
+import { useCrossMintModal, useCrossMintStatus } from ".";
 import { PopupContext } from "./useCrossMintPopup";
 
 export interface PopupProviderProps {
@@ -7,29 +7,33 @@ export interface PopupProviderProps {
     children: ReactNode;
 }
 
-const PROD_URL = "https://crossmint.io";
+const PROD_URL = "https://www.crossmint.io";
 const DEV_URL = "http://localhost:3001";
 
 export const CrossMintPopupProvider: FC<PopupProviderProps> = ({ development, children }) => {
     const [connecting, setConnecting] = useState(false);
     const [popup, setPopup] = useState<Window | null>(null);
 
+    const { clientId } = useCrossMintStatus();
+
     const { setVisible } = useCrossMintModal();
 
     const createPopup = (
-        candyMachineId: string,
         collectionTitle?: string,
         collectionDescription?: string,
-        collectionPhoto?: string
+        collectionPhoto?: string,
+        mintTo?: string,
+        emailTo?: string,
+        listingId?: string
     ) => {
         const pop = window.open(
             `${development ? DEV_URL : PROD_URL}/signin?callbackUrl=${encodeURIComponent(
-                `${
-                    development ? DEV_URL : PROD_URL
-                }/checkout/mint?candyMachineId=${candyMachineId}&closeOnSuccess=false${
-                    collectionTitle ? `&collectionTitle=${collectionTitle}` : ""
-                }${collectionDescription ? `&collectionDescription=${collectionDescription}` : ""}${
-                    collectionPhoto ? `&collectionPhoto=${collectionPhoto}` : ""
+                `${development ? DEV_URL : PROD_URL}/checkout/mint?clientId=${clientId}&closeOnSuccess=false${
+                    collectionTitle && `collectionTitle=${collectionTitle}`
+                }${collectionDescription && `&collectionDescription=${collectionDescription}`}${
+                    collectionPhoto && `&collectionPhoto=${collectionPhoto}`
+                }${mintTo && `&mintTo=${mintTo}`}${emailTo && `&emailTo=${emailTo}`}${
+                    listingId && `&listingId=${listingId}`
                 }`
             )}`,
             "popUpWindow",
@@ -46,16 +50,18 @@ export const CrossMintPopupProvider: FC<PopupProviderProps> = ({ development, ch
     };
 
     const connect = (
-        candyMachineId: string,
         collectionTitle?: string,
         collectionDescription?: string,
-        collectionPhoto?: string
+        collectionPhoto?: string,
+        mintTo?: string,
+        emailTo?: string,
+        listingId?: string
     ) => {
         if (connecting) return;
 
         setConnecting(true);
 
-        createPopup(candyMachineId, collectionTitle, collectionDescription, collectionPhoto);
+        createPopup(collectionTitle, collectionDescription, collectionPhoto, mintTo, emailTo, listingId);
     };
 
     function registerListeners(pop: Window) {

package/src/CrossMintProvider.tsx

@@ -1,28 +1,44 @@
 import React, { FC, ReactNode, useState } from "react";
 import { CrossMintModal, CrossMintModalProps } from "./CrossMintModal";
 import { CrossMintPopupProvider } from "./CrossMintPopupProvider";
+import { CrossMintStatusProvider } from "./CrossMintStatusProvider";
 import { CrossMintModalContext } from "./useCrossMintModal";
-// import { WalletModal, WalletModalProps } from './WalletModal';
 
 export interface CrossMintProviderProps extends CrossMintModalProps {
+    clientId: string;
+    auctionId?: string;
+    hideMintOnInactiveClient?: boolean;
     development?: boolean;
     children: ReactNode;
 }
 
-export const CrossMintProvider: FC<CrossMintProviderProps> = ({ development = false, children, ...props }) => {
+export const CrossMintProvider: FC<CrossMintProviderProps> = ({
+    clientId,
+    auctionId,
+    hideMintOnInactiveClient = false,
+    development = false,
+    children,
+    ...props
+}) => {
     const [visible, setVisible] = useState(false);
 
     return (
-        <CrossMintModalContext.Provider
-            value={{
-                visible,
-                setVisible,
-            }}
+        <CrossMintStatusProvider
+            clientId={clientId}
+            hideMintOnInactiveClient={hideMintOnInactiveClient}
+            auctionId={auctionId}
         >
-            <CrossMintPopupProvider development={development}>
-                {children}
-                {visible && <CrossMintModal {...props} />}
-            </CrossMintPopupProvider>
-        </CrossMintModalContext.Provider>
+            <CrossMintModalContext.Provider
+                value={{
+                    visible,
+                    setVisible,
+                }}
+            >
+                <CrossMintPopupProvider development={development}>
+                    {children}
+                    {visible && <CrossMintModal {...props} />}
+                </CrossMintPopupProvider>
+            </CrossMintModalContext.Provider>
+        </CrossMintStatusProvider>
     );
 };