@crossmint/client-sdk-react-ui 1.18.3 → 1.19.0-alpha.0

package/dist/chunk-UYMSOJYK.cjs

@@ -0,0 +1,89 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+
+var _chunkDF5JCCWOcjs = require('./chunk-DF5JCCWO.cjs');
+
+
+var _chunkEH64D65Zcjs = require('./chunk-EH64D65Z.cjs');
+
+
+
+
+
+var _chunkLEAESLKVcjs = require('./chunk-LEAESLKV.cjs');
+
+// src/components/signers/EmailSignersDialog.tsx
+var _react = require('react');
+var _reactvisuallyhidden = require('@radix-ui/react-visually-hidden');
+var _jsxruntime = require('react/jsx-runtime');
+function EmailSignersDialog({
+  open,
+  setOpen,
+  step,
+  setStep,
+  onSubmitOTP,
+  onResendOTPCode,
+  onSubmitEmail,
+  appearance
+}) {
+  var _a, _b, _c;
+  const [email, setEmail] = _react.useState.call(void 0, "");
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkLEAESLKVcjs.Dialog, { modal: false, open, onOpenChange: setOpen, children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+    _chunkLEAESLKVcjs.DialogContent,
+    {
+      onInteractOutside: (e) => e.preventDefault(),
+      onOpenAutoFocus: (e) => e.preventDefault(),
+      className: "!p-0 !min-[480px]:p-0",
+      style: {
+        borderRadius: appearance == null ? void 0 : appearance.borderRadius,
+        backgroundColor: (_a = appearance == null ? void 0 : appearance.colors) == null ? void 0 : _a.background
+      },
+      children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactvisuallyhidden.VisuallyHidden, { asChild: true, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkLEAESLKVcjs.DialogTitle, { children: "Crossmint Recovery Key" }) }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactvisuallyhidden.VisuallyHidden, { asChild: true, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkLEAESLKVcjs.DialogDescription, { children: "Create a recovery key" }) }),
+        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "relative pt-10 pb-[30px] px-6 !min-[480px]:px-10 flex flex-col gap-[10px] antialiased animate-none max-w-[448px]", children: [
+          step === "initial" ? /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { children: [
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+              "h1",
+              {
+                className: "text-2xl font-bold text-cm-text-primary",
+                style: { color: (_b = appearance == null ? void 0 : appearance.colors) == null ? void 0 : _b.textPrimary },
+                children: "Create Recovery Key"
+              }
+            ),
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+              "p",
+              {
+                className: "text-base font-normal mb-3 text-cm-text-secondary",
+                style: { color: (_c = appearance == null ? void 0 : appearance.colors) == null ? void 0 : _c.textSecondary },
+                children: "Enter your email to create a recovery key"
+              }
+            )
+          ] }) : null,
+          step === "otp" ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+            _chunkEH64D65Zcjs.EmailOTPInput,
+            {
+              email,
+              onSubmitOTP,
+              handleOnBack: () => setStep("initial"),
+              onResendCode: () => onResendOTPCode(email),
+              appearance
+            }
+          ) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+            _chunkDF5JCCWOcjs.EmailInput,
+            {
+              email,
+              setEmail,
+              onSubmitEmail,
+              appearance
+            }
+          )
+        ] })
+      ]
+    }
+  ) });
+}
+
+
+
+exports.EmailSignersDialog = EmailSignersDialog;
+//# sourceMappingURL=chunk-UYMSOJYK.cjs.map

package/dist/chunk-UYMSOJYK.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/signers/EmailSignersDialog.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;AAAA,SAAS,gBAAgB;AACzB,SAAS,sBAAsB;AAyCX,cAQI,YARJ;AAxBb,SAAS,mBAAmB;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACJ,GAA4B;AA3B5B;AA4BI,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAiB,EAAE;AAE7C,SACI,oBAAC,UAAO,OAAO,OAAO,MAAY,cAAc,SAC5C;AAAA,IAAC;AAAA;AAAA,MACG,mBAAmB,CAAC,MAAM,EAAE,eAAe;AAAA,MAC3C,iBAAiB,CAAC,MAAM,EAAE,eAAe;AAAA,MACzC,WAAU;AAAA,MACV,OAAO;AAAA,QACH,cAAc,yCAAY;AAAA,QAC1B,kBAAiB,8CAAY,WAAZ,mBAAoB;AAAA,MACzC;AAAA,MAEA;AAAA,4BAAC,kBAAe,SAAO,MACnB,8BAAC,eAAY,oCAAsB,GACvC;AAAA,QACA,oBAAC,kBAAe,SAAO,MACnB,8BAAC,qBAAkB,mCAAqB,GAC5C;AAAA,QAEA,qBAAC,SAAI,WAAU,oHACV;AAAA,mBAAS,YACN,qBAAC,SACG;AAAA;AAAA,cAAC;AAAA;AAAA,gBACG,WAAU;AAAA,gBACV,OAAO,EAAE,QAAO,8CAAY,WAAZ,mBAAoB,YAAY;AAAA,gBACnD;AAAA;AAAA,YAED;AAAA,YACA;AAAA,cAAC;AAAA;AAAA,gBACG,WAAU;AAAA,gBACV,OAAO,EAAE,QAAO,8CAAY,WAAZ,mBAAoB,cAAc;AAAA,gBACrD;AAAA;AAAA,YAED;AAAA,aACJ,IACA;AAAA,UAEH,SAAS,QACN;AAAA,YAAC;AAAA;AAAA,cACG;AAAA,cACA;AAAA,cACA,cAAc,MAAM,QAAQ,SAAS;AAAA,cACrC,cAAc,MAAM,gBAAgB,KAAK;AAAA,cACzC;AAAA;AAAA,UACJ,IAEA;AAAA,YAAC;AAAA;AAAA,cACG;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA;AAAA,UACJ;AAAA,WAER;AAAA;AAAA;AAAA,EACJ,GACJ;AAER","sourcesContent":["import { useState } from \"react\";\nimport { VisuallyHidden } from \"@radix-ui/react-visually-hidden\";\nimport type { UIConfig } from \"@crossmint/common-sdk-base\";\nimport { Dialog, DialogContent, DialogDescription, DialogTitle } from \"../common/Dialog\";\nimport { EmailOTPInput } from \"./EmailOTPInput\";\nimport { EmailInput } from \"./EmailInput\";\n\ninterface EmailSignersDialogProps {\n    open: boolean;\n    setOpen: (open: boolean) => void;\n    step: \"initial\" | \"otp\";\n    setStep: (step: \"initial\" | \"otp\") => void;\n    onSubmitOTP: (token: string) => Promise<void>;\n    onResendOTPCode: (email: string) => Promise<void>;\n    onSubmitEmail: (email: string) => Promise<void>;\n    appearance?: UIConfig;\n}\n\nexport function EmailSignersDialog({\n    open,\n    setOpen,\n    step,\n    setStep,\n    onSubmitOTP,\n    onResendOTPCode,\n    onSubmitEmail,\n    appearance,\n}: EmailSignersDialogProps) {\n    const [email, setEmail] = useState<string>(\"\");\n\n    return (\n        <Dialog modal={false} open={open} onOpenChange={setOpen}>\n            <DialogContent\n                onInteractOutside={(e) => e.preventDefault()}\n                onOpenAutoFocus={(e) => e.preventDefault()}\n                className=\"!p-0 !min-[480px]:p-0\"\n                style={{\n                    borderRadius: appearance?.borderRadius,\n                    backgroundColor: appearance?.colors?.background,\n                }}\n            >\n                <VisuallyHidden asChild>\n                    <DialogTitle>Crossmint Recovery Key</DialogTitle>\n                </VisuallyHidden>\n                <VisuallyHidden asChild>\n                    <DialogDescription>Create a recovery key</DialogDescription>\n                </VisuallyHidden>\n\n                <div className=\"relative pt-10 pb-[30px] px-6 !min-[480px]:px-10 flex flex-col gap-[10px] antialiased animate-none max-w-[448px]\">\n                    {step === \"initial\" ? (\n                        <div>\n                            <h1\n                                className=\"text-2xl font-bold text-cm-text-primary\"\n                                style={{ color: appearance?.colors?.textPrimary }}\n                            >\n                                Create Recovery Key\n                            </h1>\n                            <p\n                                className=\"text-base font-normal mb-3 text-cm-text-secondary\"\n                                style={{ color: appearance?.colors?.textSecondary }}\n                            >\n                                Enter your email to create a recovery key\n                            </p>\n                        </div>\n                    ) : null}\n\n                    {step === \"otp\" ? (\n                        <EmailOTPInput\n                            email={email}\n                            onSubmitOTP={onSubmitOTP}\n                            handleOnBack={() => setStep(\"initial\")}\n                            onResendCode={() => onResendOTPCode(email)}\n                            appearance={appearance}\n                        />\n                    ) : (\n                        <EmailInput\n                            email={email}\n                            setEmail={setEmail}\n                            onSubmitEmail={onSubmitEmail}\n                            appearance={appearance}\n                        />\n                    )}\n                </div>\n            </DialogContent>\n        </Dialog>\n    );\n}\n"]}

package/dist/chunk-V7CWLETC.js

@@ -0,0 +1,13 @@
+// src/utils/errorUtils.ts
+function deriveWalletErrorState(error) {
+  const message = error instanceof Error ? error.message : String(error);
+  return {
+    status: "loading-error",
+    error: message
+  };
+}
+
+export {
+  deriveWalletErrorState
+};
+//# sourceMappingURL=chunk-V7CWLETC.js.map

package/dist/chunk-V7CWLETC.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/utils/errorUtils.ts"],"sourcesContent":["export function deriveWalletErrorState(error: unknown): {\n    status: \"loading-error\";\n    error: string;\n} {\n    const message = error instanceof Error ? error.message : String(error);\n    return {\n        status: \"loading-error\",\n        error: message,\n    };\n}\n"],"mappings":";AAAO,SAAS,uBAAuB,OAGrC;AACE,QAAM,UAAU,iBAAiB,QAAQ,MAAM,UAAU,OAAO,KAAK;AACrE,SAAO;AAAA,IACH,QAAQ;AAAA,IACR,OAAO;AAAA,EACX;AACJ;","names":[]}

package/dist/chunk-VEPJM7ZC.cjs

@@ -0,0 +1,125 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { newObj[key] = obj[key]; } } } newObj.default = obj; return newObj; } }
+
+var _chunk3CWYQQ65cjs = require('./chunk-3CWYQQ65.cjs');
+
+
+var _chunkYKL53K3Ccjs = require('./chunk-YKL53K3C.cjs');
+
+
+var _chunkKEKBOJCFcjs = require('./chunk-KEKBOJCF.cjs');
+
+
+
+var _chunk4DAZAO6Ycjs = require('./chunk-4DAZAO6Y.cjs');
+
+// src/components/embed/v3/EmbeddedCheckoutV3IFrame.tsx
+var _react = require('react');
+
+
+var _clientsdkbase = require('@crossmint/client-sdk-base');
+var _jsxruntime = require('react/jsx-runtime');
+var CryptoWalletConnectionHandler = _react.lazy.call(void 0, 
+  () => (
+    // @ts-expect-error - Error because we dont use 'module' field in tsconfig, which is expected because we use tsup to compile
+    Promise.resolve().then(() => _interopRequireWildcard(require("./components/embed/v3/crypto/CryptoWalletConnectionHandler.cjs"))).then((mod) => ({
+      default: mod.CryptoWalletConnectionHandler
+    }))
+  )
+);
+function EmbeddedCheckoutV3IFrame(props) {
+  var _a;
+  const [iframeClient, setIframeClient] = _react.useState.call(void 0, null);
+  const [height, setHeight] = _react.useState.call(void 0, 0);
+  const initialChainRef = _react.useRef.call(void 0, (_a = props.payment.crypto.payer) == null ? void 0 : _a.initialChain);
+  const memoizedProps = _react.useRef.call(void 0, props);
+  if (havePropsChanged(props, memoizedProps.current)) {
+    const newProps = _chunk4DAZAO6Ycjs.__spreadValues.call(void 0, {}, props);
+    const initialChainPreservation = shouldPreserveInitialChain(props, initialChainRef.current);
+    if (initialChainPreservation.shouldPreserve) {
+      newProps.payment.crypto.payer = initialChainPreservation.updatedPayer;
+    }
+    memoizedProps.current = newProps;
+  }
+  const { crossmint } = _chunkKEKBOJCFcjs.useCrossmint.call(void 0, );
+  const apiClient = _chunkYKL53K3Ccjs.createCrossmintApiClient.call(void 0, crossmint, {
+    usageOrigin: "client"
+  });
+  const embeddedCheckoutService = _clientsdkbase.crossmintEmbeddedCheckoutV3Service.call(void 0, { apiClient });
+  const ref = _react.useRef.call(void 0, null);
+  _react.useEffect.call(void 0, () => {
+    const iframe = ref.current;
+    if (!iframe || iframeClient) {
+      return;
+    }
+    setIframeClient(embeddedCheckoutService.iframe.createClient(iframe));
+  }, [ref.current, iframeClient]);
+  _react.useEffect.call(void 0, () => {
+    if (iframeClient == null) {
+      return;
+    }
+    iframeClient.on("ui:height.changed", (data) => setHeight(data.height));
+    return () => {
+      iframeClient.off("ui:height.changed");
+    };
+  }, [iframeClient]);
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      "iframe",
+      {
+        ref,
+        src: embeddedCheckoutService.iframe.getUrl(memoizedProps.current),
+        id: "crossmint-embedded-checkout.iframe",
+        role: "crossmint-embedded-checkout.iframe",
+        allow: "payment *",
+        style: {
+          boxShadow: "none",
+          border: "none",
+          padding: "0px",
+          width: "100%",
+          minWidth: "100%",
+          overflow: "hidden",
+          display: "block",
+          userSelect: "none",
+          transform: "translate(0px)",
+          opacity: "1",
+          transition: "ease 0s, opacity 0.4s ease 0.1s",
+          height: `${height}px`,
+          backgroundColor: "transparent"
+        }
+      }
+    ),
+    memoizedProps.current.payment.crypto.enabled ? memoizedProps.current.payment.crypto.payer != null ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      _chunk3CWYQQ65cjs.PayerConnectionHandler,
+      {
+        payer: memoizedProps.current.payment.crypto.payer,
+        iframeClient
+      }
+    ) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      CryptoWalletConnectionHandler,
+      {
+        iframeClient,
+        apiKeyEnvironment: apiClient["parsedAPIKey"].environment
+      }
+    ) : null,
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { id: "crossmint-focus-target", tabIndex: -1 })
+  ] });
+}
+function havePropsChanged(parentProps, currentRefProps) {
+  return JSON.stringify(parentProps) !== JSON.stringify(currentRefProps);
+}
+function shouldPreserveInitialChain(props, storedInitialChain) {
+  if (props.payment.crypto.payer && storedInitialChain != null) {
+    return {
+      shouldPreserve: true,
+      updatedPayer: _chunk4DAZAO6Ycjs.__spreadProps.call(void 0, _chunk4DAZAO6Ycjs.__spreadValues.call(void 0, {}, props.payment.crypto.payer), {
+        initialChain: storedInitialChain
+      })
+    };
+  }
+  return { shouldPreserve: false };
+}
+
+
+
+exports.EmbeddedCheckoutV3IFrame = EmbeddedCheckoutV3IFrame;
+//# sourceMappingURL=chunk-VEPJM7ZC.cjs.map

package/dist/chunk-VEPJM7ZC.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/embed/v3/EmbeddedCheckoutV3IFrame.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useCrossmint } from \"@/hooks\";\nimport { lazy, useEffect, useRef, useState } from \"react\";\n\nimport {\n    type CrossmintEmbeddedCheckoutV3Props,\n    type EmbeddedCheckoutV3IFrameEmitter,\n    crossmintEmbeddedCheckoutV3Service,\n} from \"@crossmint/client-sdk-base\";\n\nimport { createCrossmintApiClient } from \"@/utils/createCrossmintApiClient\";\nimport { PayerConnectionHandler } from \"./crypto/PayerConnectionHandler\";\nimport type { PayerSupportedBlockchains } from \"@crossmint/common-sdk-base\";\n\nconst CryptoWalletConnectionHandler = lazy(() =>\n    // @ts-expect-error - Error because we dont use 'module' field in tsconfig, which is expected because we use tsup to compile\n    import(\"./crypto/CryptoWalletConnectionHandler\").then((mod) => ({\n        default: mod.CryptoWalletConnectionHandler,\n    }))\n);\n\nexport function EmbeddedCheckoutV3IFrame(props: CrossmintEmbeddedCheckoutV3Props) {\n    const [iframeClient, setIframeClient] = useState<EmbeddedCheckoutV3IFrameEmitter | null>(null);\n    const [height, setHeight] = useState(0);\n\n    const initialChainRef = useRef(props.payment.crypto.payer?.initialChain);\n\n    const memoizedProps = useRef(props);\n    if (havePropsChanged(props, memoizedProps.current)) {\n        const newProps = { ...props };\n        const initialChainPreservation = shouldPreserveInitialChain(props, initialChainRef.current);\n        if (initialChainPreservation.shouldPreserve) {\n            newProps.payment.crypto.payer = initialChainPreservation.updatedPayer;\n        }\n        memoizedProps.current = newProps;\n    }\n\n    const { crossmint } = useCrossmint();\n    const apiClient = createCrossmintApiClient(crossmint, {\n        usageOrigin: \"client\",\n    });\n    const embeddedCheckoutService = crossmintEmbeddedCheckoutV3Service({ apiClient });\n\n    const ref = useRef<HTMLIFrameElement>(null);\n\n    useEffect(() => {\n        const iframe = ref.current;\n        if (!iframe || iframeClient) {\n            return;\n        }\n        setIframeClient(embeddedCheckoutService.iframe.createClient(iframe));\n    }, [ref.current, iframeClient]);\n\n    useEffect(() => {\n        if (iframeClient == null) {\n            return;\n        }\n        iframeClient.on(\"ui:height.changed\", (data) => setHeight(data.height));\n\n        return () => {\n            iframeClient.off(\"ui:height.changed\");\n        };\n    }, [iframeClient]);\n\n    return (\n        <>\n            <iframe\n                ref={ref}\n                src={embeddedCheckoutService.iframe.getUrl(memoizedProps.current)}\n                id=\"crossmint-embedded-checkout.iframe\"\n                role=\"crossmint-embedded-checkout.iframe\"\n                allow=\"payment *\"\n                style={{\n                    boxShadow: \"none\",\n                    border: \"none\",\n                    padding: \"0px\",\n                    width: \"100%\",\n                    minWidth: \"100%\",\n                    overflow: \"hidden\",\n                    display: \"block\",\n                    userSelect: \"none\",\n                    transform: \"translate(0px)\",\n                    opacity: \"1\",\n                    transition: \"ease 0s, opacity 0.4s ease 0.1s\",\n                    height: `${height}px`,\n                    backgroundColor: \"transparent\",\n                }}\n            />\n            {memoizedProps.current.payment.crypto.enabled ? (\n                memoizedProps.current.payment.crypto.payer != null ? (\n                    <PayerConnectionHandler\n                        payer={memoizedProps.current.payment.crypto.payer}\n                        iframeClient={iframeClient}\n                    />\n                ) : (\n                    <CryptoWalletConnectionHandler\n                        iframeClient={iframeClient}\n                        apiKeyEnvironment={apiClient[\"parsedAPIKey\"].environment}\n                    />\n                )\n            ) : null}\n            <span id=\"crossmint-focus-target\" tabIndex={-1} />\n        </>\n    );\n}\n\nfunction havePropsChanged(\n    parentProps: CrossmintEmbeddedCheckoutV3Props,\n    currentRefProps: CrossmintEmbeddedCheckoutV3Props\n): boolean {\n    return JSON.stringify(parentProps) !== JSON.stringify(currentRefProps);\n}\n\nfunction shouldPreserveInitialChain(\n    props: CrossmintEmbeddedCheckoutV3Props,\n    storedInitialChain: PayerSupportedBlockchains | undefined\n): { shouldPreserve: true; updatedPayer: typeof props.payment.crypto.payer } | { shouldPreserve: false } {\n    if (props.payment.crypto.payer && storedInitialChain != null) {\n        return {\n            shouldPreserve: true,\n            updatedPayer: {\n                ...props.payment.crypto.payer,\n                initialChain: storedInitialChain,\n            },\n        };\n    }\n    return { shouldPreserve: false };\n}\n"]}

package/dist/chunk-VKQ4YOEX.cjs

@@ -0,0 +1,19 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+
+var _chunkLYUX72JOcjs = require('./chunk-LYUX72JO.cjs');
+
+// src/providers/TwindProvider.tsx
+var _core = require('@twind/core');
+var _react = require('react');
+var _jsxruntime = require('react/jsx-runtime');
+function TwindProvider({ children }) {
+  _react.useEffect.call(void 0, () => {
+    _core.install.call(void 0, _chunkLYUX72JOcjs.twind_config_default);
+  }, []);
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _jsxruntime.Fragment, { children });
+}
+
+
+
+exports.TwindProvider = TwindProvider;
+//# sourceMappingURL=chunk-VKQ4YOEX.cjs.map

package/dist/chunk-VKQ4YOEX.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/providers/TwindProvider.tsx"],"names":[],"mappings":";;;;;AAEA,SAAS,eAAe;AACxB,SAAS,iBAAiB;AASf;AAPJ,SAAS,cAAc,EAAE,SAAS,GAAkC;AACvE,YAAU,MAAM;AAGZ,YAAQ,oBAAW;AAAA,EACvB,GAAG,CAAC,CAAC;AAEL,SAAO,gCAAG,UAAS;AACvB","sourcesContent":["import type React from \"react\";\nimport twindConfig from \"@/twind.config\";\nimport { install } from \"@twind/core\";\nimport { useEffect } from \"react\";\n\nexport function TwindProvider({ children }: { children: React.ReactNode }) {\n    useEffect(() => {\n        // Initialize twind with custom configuration\n        // This sets up the CSS-in-JS styling solution for the entire application\n        install(twindConfig);\n    }, []);\n\n    return <>{children}</>;\n}\n"]}

package/dist/chunk-VPXCDIYZ.cjs

@@ -0,0 +1,153 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+
+
+var _chunkQ3M4UH5Ucjs = require('./chunk-Q3M4UH5U.cjs');
+
+
+var _chunkKLWDDALZcjs = require('./chunk-KLWDDALZ.cjs');
+
+
+var _chunkYHFDNKTScjs = require('./chunk-YHFDNKTS.cjs');
+
+
+
+var _chunk4DAZAO6Ycjs = require('./chunk-4DAZAO6Y.cjs');
+
+// src/components/hosted/CrossmintPayButton_DEPRECATED.tsx
+var _react = require('react');
+
+
+
+
+
+var _clientsdkbase = require('@crossmint/client-sdk-base');
+var _jsxruntime = require('react/jsx-runtime');
+function CrossmintPayButton_DEPRECATED(buttonProps) {
+  const _a = buttonProps, {
+    className,
+    disabled,
+    onClick,
+    style,
+    tabIndex,
+    theme = "dark",
+    mintTo,
+    emailTo,
+    listingId,
+    auctionId,
+    showOverlay = true,
+    mintConfig,
+    whPassThroughArgs,
+    environment,
+    paymentMethod,
+    preferredSigninMethod,
+    dismissOverlayOnClick,
+    prepay,
+    locale = "en-US",
+    currency = "usd",
+    successCallbackURL = "",
+    failureCallbackURL = "",
+    loginEmail = "",
+    projectId,
+    getButtonText,
+    checkoutProps = {
+      experimental: false,
+      display: "same-tab",
+      paymentMethods: ["fiat", "ETH", "SOL"]
+    }
+  } = _a, props = _chunk4DAZAO6Ycjs.__objRest.call(void 0, _a, [
+    "className",
+    "disabled",
+    "onClick",
+    "style",
+    "tabIndex",
+    "theme",
+    "mintTo",
+    "emailTo",
+    "listingId",
+    "auctionId",
+    "showOverlay",
+    "mintConfig",
+    "whPassThroughArgs",
+    "environment",
+    "paymentMethod",
+    "preferredSigninMethod",
+    "dismissOverlayOnClick",
+    "prepay",
+    "locale",
+    "currency",
+    "successCallbackURL",
+    "failureCallbackURL",
+    "loginEmail",
+    "projectId",
+    "getButtonText",
+    "checkoutProps"
+  ]);
+  const collectionId = "clientId" in props ? props.clientId : props.collectionId;
+  const [connecting, setConnecting] = _react.useState.call(void 0, false);
+  const { isServerSideRendering } = _chunkKLWDDALZcjs.useEnvironment.call(void 0, );
+  const { connect } = _clientsdkbase.crossmintModalService.call(void 0, {
+    clientId: collectionId,
+    projectId,
+    showOverlay,
+    dismissOverlayOnClick,
+    setConnecting,
+    libVersion: _chunkYHFDNKTScjs.LIB_VERSION,
+    environment,
+    clientName: _clientsdkbase.clientNames.reactUi,
+    locale,
+    currency,
+    successCallbackURL,
+    failureCallbackURL,
+    loginEmail
+  });
+  const { getButtonText: getButtonTextInternal, handleClick } = _clientsdkbase.crossmintPayButtonService.call(void 0, {
+    onClick,
+    connecting,
+    paymentMethod,
+    locale,
+    checkoutProps
+  });
+  const _handleClick = (event) => handleClick(event, () => {
+    connect(
+      mintConfig,
+      mintTo,
+      emailTo,
+      listingId,
+      whPassThroughArgs,
+      paymentMethod,
+      preferredSigninMethod,
+      prepay,
+      checkoutProps
+    );
+  });
+  const classes = _chunkQ3M4UH5Ucjs.useStyles.call(void 0, _chunkQ3M4UH5Ucjs.formatProps.call(void 0, theme));
+  const content = _react.useMemo.call(void 0, () => {
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: classes.crossmintParagraph, role: "button-paragraph", children: getButtonText != null ? getButtonText(connecting, paymentMethod || "fiat") : getButtonTextInternal(connecting) });
+  }, [connecting, getButtonText, paymentMethod]);
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _jsxruntime.Fragment, { children: !isServerSideRendering && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+    "button",
+    {
+      className: `${classes.crossmintButton} ${className || ""}`,
+      disabled,
+      onClick: _handleClick,
+      style: _chunk4DAZAO6Ycjs.__spreadValues.call(void 0, {}, style),
+      tabIndex,
+      children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          "img",
+          {
+            className: classes.crossmintImg,
+            src: "https://www.crossmint.io/assets/crossmint/logo.svg",
+            alt: "Crossmint logo"
+          }
+        ),
+        content
+      ]
+    }
+  ) });
+}
+
+
+
+exports.CrossmintPayButton_DEPRECATED = CrossmintPayButton_DEPRECATED;
+//# sourceMappingURL=chunk-VPXCDIYZ.cjs.map

package/dist/chunk-VPXCDIYZ.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/hosted/CrossmintPayButton_DEPRECATED.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,SAA8C,eAAe;AAC7D,SAAS,gBAAgB;AAEzB;AAAA,EAGI;AAAA,EACA;AAAA,EACA;AAAA,OACG;AA8FK,SASJ,UATI,KAWI,YAXJ;AAnFL,SAAS,8BAA8B,aAA2C;AACrF,QAgCI,kBA/BA;AAAA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,QAAQ;AAAA,IACR;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,cAAc;AAAA,IACd;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT,WAAW;AAAA,IACX,qBAAqB;AAAA,IACrB,qBAAqB;AAAA,IACrB,aAAa;AAAA,IACb;AAAA,IACA;AAAA,IACA,gBAAgB;AAAA,MACZ,cAAc;AAAA,MACd,SAAS;AAAA,MACT,gBAAgB,CAAC,QAAQ,OAAO,KAAK;AAAA,IACzC;AAAA,EAnDR,IAqDQ,IADG,kBACH,IADG;AAAA,IA9BH;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAQJ,QAAM,eAAe,cAAc,QAAQ,MAAM,WAAW,MAAM;AAElE,QAAM,CAAC,YAAY,aAAa,IAAI,SAAS,KAAK;AAClD,QAAM,EAAE,sBAAsB,IAAI,eAAe;AAEjD,QAAM,EAAE,QAAQ,IAAI,sBAAsB;AAAA,IACtC,UAAU;AAAA,IACV;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,YAAY;AAAA,IACZ;AAAA,IACA,YAAY,YAAY;AAAA,IACxB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACJ,CAAC;AAED,QAAM,EAAE,eAAe,uBAAuB,YAAY,IAAI,0BAA0B;AAAA,IACpF;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACJ,CAAC;AAED,QAAM,eAAe,CAAC,UAClB,YAAY,OAAO,MAAM;AACrB;AAAA,MACI;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACJ;AAAA,EACJ,CAAC;AAEL,QAAM,UAAU,UAAU,YAAY,KAAK,CAAC;AAE5C,QAAM,UAAU,QAAQ,MAAM;AAC1B,WACI,oBAAC,UAAK,WAAW,QAAQ,oBAAoB,MAAK,oBAC7C,2BAAiB,OACZ,cAAc,YAAY,iBAAiB,MAAM,IACjD,sBAAsB,UAAU,GAC1C;AAAA,EAER,GAAG,CAAC,YAAY,eAAe,aAAa,CAAC;AAE7C,SACI,gCACK,WAAC,yBACE;AAAA,IAAC;AAAA;AAAA,MACG,WAAW,GAAG,QAAQ,eAAe,IAAI,aAAa,EAAE;AAAA,MACxD;AAAA,MACA,SAAS;AAAA,MACT,OAAO,mBAAK;AAAA,MACZ;AAAA,MAEA;AAAA;AAAA,UAAC;AAAA;AAAA,YACG,WAAW,QAAQ;AAAA,YACnB,KAAI;AAAA,YACJ,KAAI;AAAA;AAAA,QACR;AAAA,QACC;AAAA;AAAA;AAAA,EACL,GAER;AAER","sourcesContent":["import { type CSSProperties, type MouseEvent, useMemo } from \"react\";\nimport { useState } from \"react\";\n\nimport {\n    type CheckoutProps,\n    type CrossmintPayButtonProps,\n    clientNames,\n    crossmintModalService,\n    crossmintPayButtonService,\n} from \"@crossmint/client-sdk-base\";\n\nimport { LIB_VERSION } from \"../../consts/version\";\nimport useEnvironment from \"../../hooks/useEnvironment\";\nimport { formatProps, useStyles } from \"./styles\";\n\nexport type CrossmintPayButtonReactProps = CrossmintPayButtonProps & {\n    onClick?: (e: MouseEvent<HTMLButtonElement>) => void;\n    style?: CSSProperties;\n};\n\nexport function CrossmintPayButton_DEPRECATED(buttonProps: CrossmintPayButtonReactProps) {\n    const {\n        className,\n        disabled,\n        onClick,\n        style,\n        tabIndex,\n        theme = \"dark\",\n        mintTo,\n        emailTo,\n        listingId,\n        auctionId,\n        showOverlay = true,\n        mintConfig,\n        whPassThroughArgs,\n        environment,\n        paymentMethod,\n        preferredSigninMethod,\n        dismissOverlayOnClick,\n        prepay,\n        locale = \"en-US\",\n        currency = \"usd\",\n        successCallbackURL = \"\",\n        failureCallbackURL = \"\",\n        loginEmail = \"\",\n        projectId,\n        getButtonText,\n        checkoutProps = {\n            experimental: false,\n            display: \"same-tab\",\n            paymentMethods: [\"fiat\", \"ETH\", \"SOL\"],\n        } as CheckoutProps,\n        ...props\n    } = buttonProps;\n\n    const collectionId = \"clientId\" in props ? props.clientId : props.collectionId;\n\n    const [connecting, setConnecting] = useState(false);\n    const { isServerSideRendering } = useEnvironment();\n\n    const { connect } = crossmintModalService({\n        clientId: collectionId,\n        projectId,\n        showOverlay,\n        dismissOverlayOnClick,\n        setConnecting,\n        libVersion: LIB_VERSION,\n        environment,\n        clientName: clientNames.reactUi,\n        locale,\n        currency,\n        successCallbackURL,\n        failureCallbackURL,\n        loginEmail,\n    });\n\n    const { getButtonText: getButtonTextInternal, handleClick } = crossmintPayButtonService({\n        onClick,\n        connecting,\n        paymentMethod,\n        locale,\n        checkoutProps,\n    });\n\n    const _handleClick = (event: MouseEvent<HTMLButtonElement>) =>\n        handleClick(event, () => {\n            connect(\n                mintConfig,\n                mintTo,\n                emailTo,\n                listingId,\n                whPassThroughArgs,\n                paymentMethod,\n                preferredSigninMethod,\n                prepay,\n                checkoutProps\n            );\n        });\n\n    const classes = useStyles(formatProps(theme));\n\n    const content = useMemo(() => {\n        return (\n            <span className={classes.crossmintParagraph} role=\"button-paragraph\">\n                {getButtonText != null\n                    ? getButtonText(connecting, paymentMethod || \"fiat\")\n                    : getButtonTextInternal(connecting)}\n            </span>\n        );\n    }, [connecting, getButtonText, paymentMethod]);\n\n    return (\n        <>\n            {!isServerSideRendering && (\n                <button\n                    className={`${classes.crossmintButton} ${className || \"\"}`}\n                    disabled={disabled}\n                    onClick={_handleClick}\n                    style={{ ...style }}\n                    tabIndex={tabIndex}\n                >\n                    <img\n                        className={classes.crossmintImg}\n                        src=\"https://www.crossmint.io/assets/crossmint/logo.svg\"\n                        alt=\"Crossmint logo\"\n                    />\n                    {content}\n                </button>\n            )}\n        </>\n    );\n}\n"]}

package/dist/chunk-VZIXXIU5.js

@@ -0,0 +1,32 @@
+// src/icons/wallet.tsx
+import { jsx } from "react/jsx-runtime";
+function WalletIcon({ className, style }) {
+  var _a;
+  return /* @__PURE__ */ jsx(
+    "svg",
+    {
+      className,
+      style,
+      width: "21",
+      height: "21",
+      viewBox: "0 0 21 21",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: /* @__PURE__ */ jsx(
+        "path",
+        {
+          d: "M15.0566 12.5H15.067M1.10156 3.5V17.5C1.10156 18.6046 2.02718 19.5 3.16898 19.5H17.6409C18.7827 19.5 19.7083 18.6046 19.7083 17.5V7.5C19.7083 6.39543 18.7827 5.5 17.6409 5.5L3.16898 5.5C2.02718 5.5 1.10156 4.60457 1.10156 3.5ZM1.10156 3.5C1.10156 2.39543 2.02718 1.5 3.16898 1.5H15.5735M15.5735 12.5C15.5735 12.7761 15.3421 13 15.0566 13C14.7712 13 14.5398 12.7761 14.5398 12.5C14.5398 12.2239 14.7712 12 15.0566 12C15.3421 12 15.5735 12.2239 15.5735 12.5Z",
+          stroke: (_a = style == null ? void 0 : style.color) != null ? _a : "black",
+          strokeWidth: "2",
+          strokeLinecap: "round",
+          strokeLinejoin: "round"
+        }
+      )
+    }
+  );
+}
+
+export {
+  WalletIcon
+};
+//# sourceMappingURL=chunk-VZIXXIU5.js.map

package/dist/chunk-VZIXXIU5.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/icons/wallet.tsx"],"sourcesContent":["import type React from \"react\";\n\nexport function WalletIcon({ className, style }: { className?: string; style?: React.CSSProperties }) {\n    return (\n        <svg\n            className={className}\n            style={style}\n            width=\"21\"\n            height=\"21\"\n            viewBox=\"0 0 21 21\"\n            fill=\"none\"\n            xmlns=\"http://www.w3.org/2000/svg\"\n        >\n            <path\n                d=\"M15.0566 12.5H15.067M1.10156 3.5V17.5C1.10156 18.6046 2.02718 19.5 3.16898 19.5H17.6409C18.7827 19.5 19.7083 18.6046 19.7083 17.5V7.5C19.7083 6.39543 18.7827 5.5 17.6409 5.5L3.16898 5.5C2.02718 5.5 1.10156 4.60457 1.10156 3.5ZM1.10156 3.5C1.10156 2.39543 2.02718 1.5 3.16898 1.5H15.5735M15.5735 12.5C15.5735 12.7761 15.3421 13 15.0566 13C14.7712 13 14.5398 12.7761 14.5398 12.5C14.5398 12.2239 14.7712 12 15.0566 12C15.3421 12 15.5735 12.2239 15.5735 12.5Z\"\n                stroke={style?.color ?? \"black\"}\n                strokeWidth=\"2\"\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n            />\n        </svg>\n    );\n}\n"],"mappings":";AAaY;AAXL,SAAS,WAAW,EAAE,WAAW,MAAM,GAAwD;AAFtG;AAGI,SACI;AAAA,IAAC;AAAA;AAAA,MACG;AAAA,MACA;AAAA,MACA,OAAM;AAAA,MACN,QAAO;AAAA,MACP,SAAQ;AAAA,MACR,MAAK;AAAA,MACL,OAAM;AAAA,MAEN;AAAA,QAAC;AAAA;AAAA,UACG,GAAE;AAAA,UACF,SAAQ,oCAAO,UAAP,YAAgB;AAAA,UACxB,aAAY;AAAA,UACZ,eAAc;AAAA,UACd,gBAAe;AAAA;AAAA,MACnB;AAAA;AAAA,EACJ;AAER;","names":[]}

package/dist/chunk-WO6OW46H.cjs

@@ -0,0 +1,57 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+
+var _chunk4DAZAO6Ycjs = require('./chunk-4DAZAO6Y.cjs');
+
+// src/hooks/useSignerInvisibleIFrame.ts
+var _react = require('react');
+var _clientsdkwindow = require('@crossmint/client-sdk-window');
+var _clientsigners = require('@crossmint/client-signers');
+function createInvisibleIFrame(url) {
+  return _chunk4DAZAO6Ycjs.__async.call(void 0, this, null, function* () {
+    const iframe = document.createElement("iframe");
+    iframe.src = url;
+    iframe.style.position = "absolute";
+    iframe.style.opacity = "0";
+    iframe.style.pointerEvents = "none";
+    iframe.style.width = "0";
+    iframe.style.height = "0";
+    iframe.style.border = "none";
+    iframe.style.top = "-9999px";
+    iframe.style.left = "-9999px";
+    return new Promise((resolve, reject) => {
+      iframe.onload = () => resolve(iframe);
+      iframe.onerror = () => reject("Failed to load iframe content");
+      document.body.appendChild(iframe);
+    });
+  });
+}
+function useSignerIFrameWindow() {
+  const iframeWindow = _react.useRef.call(void 0, null);
+  _react.useEffect.call(void 0, () => {
+    const initIFrameWindow = () => _chunk4DAZAO6Ycjs.__async.call(void 0, this, null, function* () {
+      try {
+        const iframeUrl = new URL("https://crossmint-signer-frames.onrender.com/");
+        const iframeElement = yield createInvisibleIFrame(iframeUrl.toString());
+        iframeWindow.current = yield _clientsdkwindow.IFrameWindow.init(iframeElement, {
+          targetOrigin: iframeUrl.origin,
+          incomingEvents: _clientsigners.signerOutboundEvents,
+          outgoingEvents: _clientsigners.signerInboundEvents
+        });
+        yield iframeWindow.current.handshakeWithChild();
+      } catch (err) {
+        console.error("Failed to initialize or connect to iframe:", err);
+      }
+    });
+    initIFrameWindow();
+    return () => {
+      if (iframeWindow.current) {
+      }
+    };
+  }, []);
+  return iframeWindow;
+}
+
+
+
+exports.useSignerIFrameWindow = useSignerIFrameWindow;
+//# sourceMappingURL=chunk-WO6OW46H.cjs.map

package/dist/chunk-WO6OW46H.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/hooks/useSignerInvisibleIFrame.ts"],"names":[],"mappings":";;;;;AAAA,SAAS,WAAW,cAAc;AAClC,SAAS,oBAAoB;AAC7B,SAAS,qBAAqB,4BAA4B;AAE1D,SAAe,sBAAsB,KAAyC;AAAA;AAC1E,UAAM,SAAS,SAAS,cAAc,QAAQ;AAC9C,WAAO,MAAM;AAGb,WAAO,MAAM,WAAW;AACxB,WAAO,MAAM,UAAU;AACvB,WAAO,MAAM,gBAAgB;AAC7B,WAAO,MAAM,QAAQ;AACrB,WAAO,MAAM,SAAS;AACtB,WAAO,MAAM,SAAS;AACtB,WAAO,MAAM,MAAM;AACnB,WAAO,MAAM,OAAO;AAEpB,WAAO,IAAI,QAAQ,CAAC,SAAS,WAAW;AACpC,aAAO,SAAS,MAAM,QAAQ,MAAM;AACpC,aAAO,UAAU,MAAM,OAAO,+BAA+B;AAC7D,eAAS,KAAK,YAAY,MAAM;AAAA,IACpC,CAAC;AAAA,EACL;AAAA;AAEO,SAAS,wBAAwB;AACpC,QAAM,eAAe,OAAqF,IAAI;AAC9G,YAAU,MAAM;AACZ,UAAM,mBAAmB,MAAY;AACjC,UAAI;AACA,cAAM,YAAY,IAAI,IAAI,+CAA+C;AACzE,cAAM,gBAAgB,MAAM,sBAAsB,UAAU,SAAS,CAAC;AACtE,qBAAa,UAAU,MAAM,aAAa,KAAK,eAAe;AAAA,UAC1D,cAAc,UAAU;AAAA,UACxB,gBAAgB;AAAA,UAChB,gBAAgB;AAAA,QACpB,CAAC;AAED,cAAM,aAAa,QAAQ,mBAAmB;AAAA,MAClD,SAAS,KAAK;AACV,gBAAQ,MAAM,8CAA8C,GAAG;AAAA,MACnE;AAAA,IACJ;AACA,qBAAiB;AAEjB,WAAO,MAAM;AACT,UAAI,aAAa,SAAS;AAAA,MAE1B;AAAA,IACJ;AAAA,EACJ,GAAG,CAAC,CAAC;AAEL,SAAO;AACX","sourcesContent":["import { useEffect, useRef } from \"react\";\nimport { IFrameWindow } from \"@crossmint/client-sdk-window\";\nimport { signerInboundEvents, signerOutboundEvents } from \"@crossmint/client-signers\";\n\nasync function createInvisibleIFrame(url: string): Promise<HTMLIFrameElement> {\n    const iframe = document.createElement(\"iframe\");\n    iframe.src = url;\n\n    // Make the iframe invisible but functional\n    iframe.style.position = \"absolute\";\n    iframe.style.opacity = \"0\";\n    iframe.style.pointerEvents = \"none\";\n    iframe.style.width = \"0\";\n    iframe.style.height = \"0\";\n    iframe.style.border = \"none\";\n    iframe.style.top = \"-9999px\";\n    iframe.style.left = \"-9999px\";\n\n    return new Promise((resolve, reject) => {\n        iframe.onload = () => resolve(iframe);\n        iframe.onerror = () => reject(\"Failed to load iframe content\");\n        document.body.appendChild(iframe);\n    });\n}\n\nexport function useSignerIFrameWindow() {\n    const iframeWindow = useRef<IFrameWindow<typeof signerOutboundEvents, typeof signerInboundEvents> | null>(null);\n    useEffect(() => {\n        const initIFrameWindow = async () => {\n            try {\n                const iframeUrl = new URL(\"https://crossmint-signer-frames.onrender.com/\");\n                const iframeElement = await createInvisibleIFrame(iframeUrl.toString());\n                iframeWindow.current = await IFrameWindow.init(iframeElement, {\n                    targetOrigin: iframeUrl.origin,\n                    incomingEvents: signerOutboundEvents,\n                    outgoingEvents: signerInboundEvents,\n                });\n\n                await iframeWindow.current.handshakeWithChild();\n            } catch (err) {\n                console.error(\"Failed to initialize or connect to iframe:\", err);\n            }\n        };\n        initIFrameWindow();\n        // Cleanup function\n        return () => {\n            if (iframeWindow.current) {\n                // Add cleanup if needed\n            }\n        };\n    }, []);\n\n    return iframeWindow;\n}\n"]}