@settlr/sdk 0.6.1 → 0.6.2

package/dist/index.d.mts

@@ -270,8 +270,10 @@ declare class Settlr {
     constructor(config: SettlrConfig);
     /**
      * Validate API key with Settlr backend
+     * This is called automatically by SettlrProvider, but can also be called manually.
+     * Fetches merchant wallet address if not provided in config.
      */
-    private validateApiKey;
+    validateApiKey(): Promise<void>;
     /**
      * Get the current tier
      */
@@ -455,6 +457,10 @@ interface SettlrContextValue {
     settlr: Settlr | null;
     /** Whether user is authenticated */
     authenticated: boolean;
+    /** Whether the SDK is ready (API key validated) */
+    ready: boolean;
+    /** Error if initialization failed */
+    error: Error | null;
     /** Create a payment link (redirect flow) */
     createPayment: (options: CreatePaymentOptions) => Promise<Payment>;
     /** Generate checkout URL for redirect */

package/dist/index.d.ts

@@ -270,8 +270,10 @@ declare class Settlr {
     constructor(config: SettlrConfig);
     /**
      * Validate API key with Settlr backend
+     * This is called automatically by SettlrProvider, but can also be called manually.
+     * Fetches merchant wallet address if not provided in config.
      */
-    private validateApiKey;
+    validateApiKey(): Promise<void>;
     /**
      * Get the current tier
      */
@@ -455,6 +457,10 @@ interface SettlrContextValue {
     settlr: Settlr | null;
     /** Whether user is authenticated */
     authenticated: boolean;
+    /** Whether the SDK is ready (API key validated) */
+    ready: boolean;
+    /** Error if initialization failed */
+    error: Error | null;
     /** Create a payment link (redirect flow) */
     createPayment: (options: CreatePaymentOptions) => Promise<Payment>;
     /** Generate checkout URL for redirect */

package/dist/index.js

@@ -203,6 +203,8 @@ var Settlr = class {
   }
   /**
    * Validate API key with Settlr backend
+   * This is called automatically by SettlrProvider, but can also be called manually.
+   * Fetches merchant wallet address if not provided in config.
    */
   async validateApiKey() {
     if (this.validated) return;
@@ -230,6 +232,7 @@ var Settlr = class {
       this.tier = data.tier;
       if (data.merchantWallet && !this.merchantWallet) {
         this.merchantWallet = new import_web32.PublicKey(data.merchantWallet);
+        this.merchantWalletFromValidation = data.merchantWallet;
         this.config.merchant.walletAddress = data.merchantWallet;
       }
       if (data.merchantName && !this.config.merchant.name) {
@@ -601,27 +604,54 @@ function SettlrProvider({
   config,
   authenticated = false
 }) {
+  const [ready, setReady] = (0, import_react.useState)(false);
+  const [error, setError] = (0, import_react.useState)(null);
   const settlr = (0, import_react.useMemo)(() => {
     return new Settlr({
       ...config,
       rpcEndpoint: config.rpcEndpoint ?? "https://api.devnet.solana.com"
     });
   }, [config]);
+  (0, import_react.useEffect)(() => {
+    let cancelled = false;
+    settlr.validateApiKey().then(() => {
+      if (!cancelled) {
+        setReady(true);
+        setError(null);
+      }
+    }).catch((err) => {
+      if (!cancelled) {
+        console.error("[Settlr] API key validation failed:", err);
+        setError(err instanceof Error ? err : new Error(String(err)));
+        if (config.apiKey?.startsWith("sk_test_")) {
+          setReady(true);
+        }
+      }
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, [settlr, config.apiKey]);
   const value = (0, import_react.useMemo)(
     () => ({
       settlr,
       authenticated,
+      ready,
+      error,
       createPayment: (options) => {
         return settlr.createPayment(options);
       },
       getCheckoutUrl: (options) => {
+        if (!ready) {
+          console.warn("[Settlr] SDK not ready yet. Ensure API key is valid.");
+        }
         return settlr.getCheckoutUrl(options);
       },
       getBalance: () => {
         return settlr.getMerchantBalance();
       }
     }),
-    [settlr, authenticated]
+    [settlr, authenticated, ready, error]
   );
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SettlrContext.Provider, { value, children });
 }
@@ -701,11 +731,18 @@ function BuyButton({
   variant = "primary",
   size = "md"
 }) {
-  const { getCheckoutUrl, createPayment } = useSettlr();
+  const { getCheckoutUrl, createPayment, ready, error: sdkError } = useSettlr();
   const [loading, setLoading] = (0, import_react2.useState)(false);
   const [status, setStatus] = (0, import_react2.useState)("idle");
   const handleClick = (0, import_react2.useCallback)(async () => {
     if (disabled || loading) return;
+    if (!ready) {
+      const notReadyError = new Error(
+        sdkError?.message || "Settlr SDK not ready. Please check your API key configuration."
+      );
+      onError?.(notReadyError);
+      return;
+    }
     setLoading(true);
     setStatus("processing");
     onProcessing?.();
@@ -729,6 +766,8 @@ function BuyButton({
     orderId,
     disabled,
     loading,
+    ready,
+    sdkError,
     successUrl,
     cancelUrl,
     getCheckoutUrl,

package/dist/index.mjs

@@ -139,6 +139,8 @@ var Settlr = class {
   }
   /**
    * Validate API key with Settlr backend
+   * This is called automatically by SettlrProvider, but can also be called manually.
+   * Fetches merchant wallet address if not provided in config.
    */
   async validateApiKey() {
     if (this.validated) return;
@@ -166,6 +168,7 @@ var Settlr = class {
       this.tier = data.tier;
       if (data.merchantWallet && !this.merchantWallet) {
         this.merchantWallet = new PublicKey2(data.merchantWallet);
+        this.merchantWalletFromValidation = data.merchantWallet;
         this.config.merchant.walletAddress = data.merchantWallet;
       }
       if (data.merchantName && !this.config.merchant.name) {
@@ -529,7 +532,13 @@ var Settlr = class {
 };
 
 // src/react.tsx
-import { createContext, useContext, useMemo } from "react";
+import {
+  createContext,
+  useContext,
+  useMemo,
+  useEffect,
+  useState
+} from "react";
 import { jsx } from "react/jsx-runtime";
 var SettlrContext = createContext(null);
 function SettlrProvider({
@@ -537,27 +546,54 @@ function SettlrProvider({
   config,
   authenticated = false
 }) {
+  const [ready, setReady] = useState(false);
+  const [error, setError] = useState(null);
   const settlr = useMemo(() => {
     return new Settlr({
       ...config,
       rpcEndpoint: config.rpcEndpoint ?? "https://api.devnet.solana.com"
     });
   }, [config]);
+  useEffect(() => {
+    let cancelled = false;
+    settlr.validateApiKey().then(() => {
+      if (!cancelled) {
+        setReady(true);
+        setError(null);
+      }
+    }).catch((err) => {
+      if (!cancelled) {
+        console.error("[Settlr] API key validation failed:", err);
+        setError(err instanceof Error ? err : new Error(String(err)));
+        if (config.apiKey?.startsWith("sk_test_")) {
+          setReady(true);
+        }
+      }
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, [settlr, config.apiKey]);
   const value = useMemo(
     () => ({
       settlr,
       authenticated,
+      ready,
+      error,
       createPayment: (options) => {
         return settlr.createPayment(options);
       },
       getCheckoutUrl: (options) => {
+        if (!ready) {
+          console.warn("[Settlr] SDK not ready yet. Ensure API key is valid.");
+        }
         return settlr.getCheckoutUrl(options);
       },
       getBalance: () => {
         return settlr.getMerchantBalance();
       }
     }),
-    [settlr, authenticated]
+    [settlr, authenticated, ready, error]
   );
   return /* @__PURE__ */ jsx(SettlrContext.Provider, { value, children });
 }
@@ -571,9 +607,9 @@ function useSettlr() {
 
 // src/components.tsx
 import {
-  useState,
+  useState as useState2,
   useCallback,
-  useEffect
+  useEffect as useEffect2
 } from "react";
 import { Fragment, jsx as jsx2, jsxs } from "react/jsx-runtime";
 var defaultStyles = {
@@ -641,11 +677,18 @@ function BuyButton({
   variant = "primary",
   size = "md"
 }) {
-  const { getCheckoutUrl, createPayment } = useSettlr();
-  const [loading, setLoading] = useState(false);
-  const [status, setStatus] = useState("idle");
+  const { getCheckoutUrl, createPayment, ready, error: sdkError } = useSettlr();
+  const [loading, setLoading] = useState2(false);
+  const [status, setStatus] = useState2("idle");
   const handleClick = useCallback(async () => {
     if (disabled || loading) return;
+    if (!ready) {
+      const notReadyError = new Error(
+        sdkError?.message || "Settlr SDK not ready. Please check your API key configuration."
+      );
+      onError?.(notReadyError);
+      return;
+    }
     setLoading(true);
     setStatus("processing");
     onProcessing?.();
@@ -669,6 +712,8 @@ function BuyButton({
     orderId,
     disabled,
     loading,
+    ready,
+    sdkError,
     successUrl,
     cancelUrl,
     getCheckoutUrl,
@@ -820,7 +865,7 @@ function CheckoutWidget({
   showBranding = true
 }) {
   const { getCheckoutUrl } = useSettlr();
-  const [status, setStatus] = useState("idle");
+  const [status, setStatus] = useState2("idle");
   const containerStyle = {
     ...widgetStyles.container,
     ...theme === "dark" ? widgetStyles.containerDark : widgetStyles.containerLight,
@@ -1003,7 +1048,7 @@ function PaymentModal({
   onError,
   checkoutUrl = "https://settlr.dev/checkout"
 }) {
-  const [loading, setLoading] = useState(true);
+  const [loading, setLoading] = useState2(true);
   const params = new URLSearchParams({
     amount: amount.toString(),
     merchant: merchantName,
@@ -1013,7 +1058,7 @@ function PaymentModal({
   if (memo) params.set("memo", memo);
   if (orderId) params.set("orderId", orderId);
   const iframeSrc = `${checkoutUrl}?${params.toString()}`;
-  useEffect(() => {
+  useEffect2(() => {
     const handleMessage = (event) => {
       if (!event.origin.includes("settlr.dev") && !event.origin.includes("localhost")) {
         return;
@@ -1037,7 +1082,7 @@ function PaymentModal({
     window.addEventListener("message", handleMessage);
     return () => window.removeEventListener("message", handleMessage);
   }, [amount, onSuccess, onError, onClose]);
-  useEffect(() => {
+  useEffect2(() => {
     const handleEscape = (e) => {
       if (e.key === "Escape") onClose?.();
     };
@@ -1074,7 +1119,7 @@ function PaymentModal({
   ] }) });
 }
 function usePaymentModal(config) {
-  const [modalState, setModalState] = useState({
+  const [modalState, setModalState] = useState2({
     isOpen: false,
     amount: 0
   });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@settlr/sdk",
-  "version": "0.6.1",
+  "version": "0.6.2",
   "description": "Settlr SDK - Accept Solana USDC payments with privacy. Email checkout, gasless transactions, FHE-encrypted receipts. Private on-chain, compliant off-chain.",
   "main": "dist/index.js",
   "module": "dist/index.mjs",