@cimplify/sdk 0.8.1 → 0.8.2

package/dist/react.mjs

@@ -1,4 +1,4 @@
-import { createContext, useContext, useState, useEffect, useRef, useMemo, useCallback, useSyncExternalStore } from 'react';
+import React2, { createContext, useContext, useState, useEffect, useRef, useMemo, useCallback, useSyncExternalStore } from 'react';
 import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
 
 // src/react/index.tsx
@@ -14,6 +14,7 @@ var MESSAGE_TYPES = {
   // Parent → Iframe
   INIT: "init",
   SET_TOKEN: "set_token",
+  SET_CART: "set_cart",
   GET_DATA: "get_data",
   PROCESS_CHECKOUT: "process_checkout",
   ABORT_CHECKOUT: "abort_checkout",
@@ -343,6 +344,61 @@ function Ad({
     }
   );
 }
+
+// src/utils/cart-transform.ts
+function getSelections(item) {
+  if (item.bundle_resolved?.selections?.length) {
+    return item.bundle_resolved.selections.map((s) => ({
+      name: s.product_name || s.component_id,
+      quantity: s.quantity,
+      variant_name: s.variant_name
+    }));
+  }
+  if (item.composite_resolved?.selections?.length) {
+    return item.composite_resolved.selections.map((s) => ({
+      name: s.component_name || s.component_id,
+      quantity: s.quantity
+    }));
+  }
+  return void 0;
+}
+function mapItem(item) {
+  const result = {
+    name: item.name,
+    quantity: item.quantity,
+    unit_price: String(item.base_price),
+    total_price: String(item.total_price),
+    line_type: item.line_type
+  };
+  if (item.image_url) result.image_url = item.image_url;
+  const variantName = item.variant_info?.name || item.variant_name || void 0;
+  if (variantName) result.variant_name = variantName;
+  if (item.scheduled_start) result.scheduled_start = item.scheduled_start;
+  if (item.scheduled_end) result.scheduled_end = item.scheduled_end;
+  const selections = getSelections(item);
+  if (selections) result.selections = selections;
+  if (item.add_on_options?.length) {
+    result.add_ons = item.add_on_options.map((opt) => ({
+      name: opt.name,
+      price: String(opt.price ?? "0")
+    }));
+  }
+  if (item.special_instructions) {
+    result.special_instructions = item.special_instructions;
+  }
+  return result;
+}
+function transformToCheckoutCart(cart) {
+  return {
+    items: cart.items.map(mapItem),
+    subtotal: String(cart.pricing.subtotal),
+    tax_amount: String(cart.pricing.tax_amount),
+    total_discounts: String(cart.pricing.total_discounts),
+    service_charge: String(cart.pricing.service_charge),
+    total: String(cart.pricing.total_price),
+    currency: cart.pricing.currency
+  };
+}
 var SPACE = { sm: 8};
 function shellColors(isDark, primaryColor) {
   return {
@@ -409,6 +465,7 @@ function CimplifyCheckout({
   const [errorMessage, setErrorMessage] = useState(null);
   const [resolvedBusinessId, setResolvedBusinessId] = useState(businessId ?? null);
   const [resolvedCartId, setResolvedCartId] = useState(cartId ?? null);
+  const [resolvedCart, setResolvedCart] = useState(null);
   const checkoutMountRef = useRef(null);
   const elementsRef = useRef(null);
   const activeCheckoutRef = useRef(null);
@@ -416,25 +473,21 @@ function CimplifyCheckout({
   const hasWarnedInlineAppearanceRef = useRef(false);
   const isMountedRef = useRef(true);
   const demoRunRef = useRef(0);
-  const onCompleteRef = useRef(onComplete);
-  const onErrorRef = useRef(onError);
-  const onStatusChangeRef = useRef(onStatusChange);
-  const handleSubmitRef = useRef(async () => {
-  });
-  onCompleteRef.current = onComplete;
-  onErrorRef.current = onError;
-  onStatusChangeRef.current = onStatusChange;
   const isDemoCheckout = demoMode ?? client.getPublicKey().trim().length === 0;
   const isTestMode = client.isTestMode();
   const primaryColor = appearance?.variables?.primaryColor || "#0a2540";
   const isDark = appearance?.theme === "dark";
-  const emitStatus = useCallback(
+  const emitStatus = React2.useEffectEvent(
     (nextStatus, context = {}) => {
       setStatus(nextStatus);
       setStatusText(context.display_text || "");
-      onStatusChangeRef.current?.(nextStatus, context);
-    },
-    []
+      onStatusChange?.(nextStatus, context);
+    }
+  );
+  const fireError = React2.useEffectEvent(
+    (error) => {
+      onError?.(error);
+    }
   );
   useEffect(() => {
     if (!resolvedOrderTypes.includes(orderType)) {
@@ -470,6 +523,12 @@ function CimplifyCheckout({
           setIsInitializing(false);
           setErrorMessage(null);
         }
+        client.cart.get().then((cartResult) => {
+          if (!cancelled && cartResult.ok && cartResult.value) {
+            setResolvedCart(cartResult.value);
+          }
+        }).catch(() => {
+        });
         return;
       }
       if (!cancelled) {
@@ -487,7 +546,7 @@ function CimplifyCheckout({
             setResolvedCartId(null);
             setErrorMessage(message);
             setIsInitializing(false);
-            onErrorRef.current?.({ code: "BUSINESS_ID_REQUIRED", message });
+            fireError({ code: "BUSINESS_ID_REQUIRED", message });
           }
           return;
         }
@@ -502,11 +561,14 @@ function CimplifyCheckout({
             setResolvedCartId(null);
             setErrorMessage(message);
             setIsInitializing(false);
-            onErrorRef.current?.({ code: "CART_EMPTY", message });
+            fireError({ code: "CART_EMPTY", message });
           }
           return;
         }
         nextCartId = cartResult.value.id;
+        if (!cancelled) {
+          setResolvedCart(cartResult.value);
+        }
       }
       if (!cancelled) {
         setResolvedBusinessId(nextBusinessId);
@@ -528,45 +590,12 @@ function CimplifyCheckout({
       activeCheckoutRef.current = null;
     };
   }, []);
-  useEffect(() => {
-    if (isDemoCheckout || !resolvedBusinessId) {
-      elementsRef.current = null;
-      return;
-    }
-    const elements = client.elements(resolvedBusinessId, {
-      appearance: initialAppearanceRef.current,
-      linkUrl
-    });
-    elementsRef.current = elements;
-    const checkout = elements.create("checkout", {
-      orderTypes: resolvedOrderTypes,
-      defaultOrderType: resolvedOrderTypes[0]
-    });
-    if (checkoutMountRef.current) {
-      checkout.mount(checkoutMountRef.current);
-    }
-    checkout.on("order_type_changed", (data) => {
-      const typed = data;
-      if (typed.orderType) {
-        setOrderType(typed.orderType);
-      }
-    });
-    checkout.on("request_submit", () => {
-      void handleSubmitRef.current();
-    });
-    return () => {
-      activeCheckoutRef.current?.abort();
-      activeCheckoutRef.current = null;
-      elements.destroy();
-      elementsRef.current = null;
-    };
-  }, [client, resolvedBusinessId, isDemoCheckout]);
-  const handleSubmit = useCallback(async () => {
+  const handleSubmit = React2.useEffectEvent(async () => {
     if (isSubmitting || isInitializing || !resolvedCartId) {
       if (!resolvedCartId && !isInitializing) {
         const message = "Your cart is empty. Add items before checkout.";
         setErrorMessage(message);
-        onErrorRef.current?.({ code: "CART_EMPTY", message });
+        fireError({ code: "CART_EMPTY", message });
       }
       return;
     }
@@ -601,7 +630,7 @@ function CimplifyCheckout({
           order_number: result.order?.order_number,
           display_text: statusToLabel("success")
         });
-        onCompleteRef.current(result);
+        onComplete(result);
       } finally {
         if (isMountedRef.current && runId === demoRunRef.current) {
           setIsSubmitting(false);
@@ -612,7 +641,7 @@ function CimplifyCheckout({
     if (!elementsRef.current) {
       const message = "Checkout is still initializing. Please try again.";
       setErrorMessage(message);
-      onErrorRef.current?.({ code: "CHECKOUT_NOT_READY", message });
+      fireError({ code: "CHECKOUT_NOT_READY", message });
       setIsSubmitting(false);
       return;
     }
@@ -627,31 +656,65 @@ function CimplifyCheckout({
     try {
       const result = await checkout;
       if (result.success) {
-        onCompleteRef.current(result);
+        onComplete(result);
         return;
       }
       const code = result.error?.code || "CHECKOUT_FAILED";
       const message = result.error?.message || "Payment failed.";
       setErrorMessage(message);
-      onErrorRef.current?.({ code, message });
+      fireError({ code, message });
     } finally {
       if (isMountedRef.current) {
         activeCheckoutRef.current = null;
         setIsSubmitting(false);
       }
     }
-  }, [
-    resolvedCartId,
-    client,
-    enrollInLink,
-    emitStatus,
-    isDemoCheckout,
-    isInitializing,
-    isSubmitting,
-    locationId,
-    orderType
-  ]);
-  handleSubmitRef.current = handleSubmit;
+  });
+  useEffect(() => {
+    if (isDemoCheckout || !resolvedBusinessId) {
+      elementsRef.current = null;
+      return;
+    }
+    const elements = client.elements(resolvedBusinessId, {
+      appearance: initialAppearanceRef.current,
+      linkUrl
+    });
+    elementsRef.current = elements;
+    const checkout = elements.create("checkout", {
+      orderTypes: resolvedOrderTypes,
+      defaultOrderType: resolvedOrderTypes[0]
+    });
+    if (checkoutMountRef.current) {
+      checkout.mount(checkoutMountRef.current);
+    }
+    checkout.on("ready", () => {
+      if (resolvedCart) {
+        checkout.setCart(transformToCheckoutCart(resolvedCart));
+      }
+    });
+    checkout.on("order_type_changed", (data) => {
+      const typed = data;
+      if (typed.orderType) {
+        setOrderType(typed.orderType);
+      }
+    });
+    checkout.on("request_submit", () => {
+      void handleSubmit();
+    });
+    return () => {
+      activeCheckoutRef.current?.abort();
+      activeCheckoutRef.current = null;
+      elements.destroy();
+      elementsRef.current = null;
+    };
+  }, [client, resolvedBusinessId, isDemoCheckout]);
+  useEffect(() => {
+    if (!resolvedCart || !elementsRef.current) return;
+    const checkoutElement = elementsRef.current.getElement("checkout");
+    if (checkoutElement) {
+      checkoutElement.setCart(transformToCheckoutCart(resolvedCart));
+    }
+  }, [resolvedCart]);
   const colors = shellColors(isDark ?? false, primaryColor);
   if (isInitializing) {
     return /* @__PURE__ */ jsx("div", { className, "data-cimplify-checkout": "", children: /* @__PURE__ */ jsx("p", { "data-cimplify-status": "", style: { fontSize: 13, color: colors.textSecondary }, children: "Preparing checkout..." }) });
@@ -1283,6 +1346,13 @@ var CartOperations = class {
   }
 };
 
+// src/constants.ts
+var MOBILE_MONEY_PROVIDER = {
+  MTN: "mtn",
+  VODAFONE: "vodafone",
+  AIRTEL: "airtel"
+};
+
 // src/utils/price.ts
 function parsePrice(value) {
   if (value === void 0 || value === null) {
@@ -1521,6 +1591,10 @@ async function openCardPopup(provider, checkoutResult, email, currency, signal)
   }
   return { success: false, error: "PROVIDER_UNAVAILABLE" };
 }
+var VALID_MOBILE_MONEY_PROVIDERS = new Set(Object.values(MOBILE_MONEY_PROVIDER));
+function isValidMobileMoneyProvider(value) {
+  return VALID_MOBILE_MONEY_PROVIDERS.has(value);
+}
 function normalizeAuthorizationType(value) {
   return value === "otp" || value === "pin" ? value : void 0;
 }
@@ -1753,6 +1827,16 @@ var CheckoutResolver = class {
       }
       await this.wait(this.pollIntervalMs);
     }
+    try {
+      const finalResult = await this.client.checkout.pollPaymentStatus(input.orderId);
+      if (finalResult.ok) {
+        const normalized = normalizeStatusResponse(finalResult.value);
+        if (normalized.paid || isPaymentStatusSuccess(normalized.status)) {
+          return this.finalizeSuccess(latestCheckoutResult);
+        }
+      }
+    } catch {
+    }
     return this.fail(
       "PAYMENT_TIMEOUT",
       "Payment confirmation timed out. Please retry checkout.",
@@ -1883,7 +1967,7 @@ var CheckoutResolver = class {
     };
   }
   getEnrollmentMobileMoney() {
-    if (this.paymentData?.type === "mobile_money" && this.paymentData.phone_number && this.paymentData.provider) {
+    if (this.paymentData?.type === "mobile_money" && this.paymentData.phone_number && this.paymentData.provider && isValidMobileMoneyProvider(this.paymentData.provider)) {
       return {
         phone_number: this.paymentData.phone_number,
         provider: this.paymentData.provider,
@@ -2957,8 +3041,10 @@ var CimplifyElements = class {
           false
         );
       }
+      this.checkoutInProgress = true;
       if (!options.cart_id) {
         console.debug("[cimplify:checkout] BLOCKED: no cart_id");
+        this.checkoutInProgress = false;
         return toCheckoutError(
           "INVALID_CART",
           "A valid cart is required before checkout can start.",
@@ -2967,6 +3053,7 @@ var CimplifyElements = class {
       }
       if (!options.order_type) {
         console.debug("[cimplify:checkout] BLOCKED: no order_type");
+        this.checkoutInProgress = false;
         return toCheckoutError(
           "ORDER_TYPE_REQUIRED",
           "Order type is required before checkout can start.",
@@ -2976,6 +3063,7 @@ var CimplifyElements = class {
       const checkoutElement = this.elements.get(ELEMENT_TYPES.CHECKOUT) || this.elements.get(ELEMENT_TYPES.PAYMENT);
       if (!checkoutElement) {
         console.debug("[cimplify:checkout] BLOCKED: no checkout element");
+        this.checkoutInProgress = false;
         return toCheckoutError(
           "NO_PAYMENT_ELEMENT",
           "Checkout element must be mounted before checkout.",
@@ -2984,6 +3072,7 @@ var CimplifyElements = class {
       }
       if (!checkoutElement.isMounted()) {
         console.debug("[cimplify:checkout] BLOCKED: checkout element not mounted");
+        this.checkoutInProgress = false;
         return toCheckoutError(
           "PAYMENT_NOT_MOUNTED",
           "Checkout element must be mounted before checkout.",
@@ -2995,6 +3084,7 @@ var CimplifyElements = class {
         const authElement = this.elements.get(ELEMENT_TYPES.AUTH);
         if (authElement && !this.accessToken) {
           console.debug("[cimplify:checkout] BLOCKED: auth incomplete");
+          this.checkoutInProgress = false;
           return toCheckoutError(
             "AUTH_INCOMPLETE",
             "Authentication must complete before checkout can start.",
@@ -3032,7 +3122,6 @@ var CimplifyElements = class {
       };
       const timeoutMs = options.timeout_ms ?? 18e4;
       const paymentWindow = checkoutElement.getContentWindow();
-      this.checkoutInProgress = true;
       return new Promise((resolve) => {
         let settled = false;
         const cleanup = () => {
@@ -3327,6 +3416,9 @@ var CimplifyElement = class {
       this.sendMessage({ type: MESSAGE_TYPES.GET_DATA });
     });
   }
+  setCart(cart) {
+    this.sendMessage({ type: MESSAGE_TYPES.SET_CART, cart });
+  }
   sendMessage(message) {
     if (this.iframe?.contentWindow) {
       this.iframe.contentWindow.postMessage(message, this.linkUrl);
@@ -3475,6 +3567,7 @@ var ACCESS_TOKEN_STORAGE_KEY = "cimplify_access_token";
 var SESSION_TOKEN_STORAGE_KEY = "cimplify_session_token";
 var ORDER_TOKEN_PREFIX = "cimplify_ot_";
 var SESSION_TOKEN_HEADER = "x-session-token";
+var ORDER_TOKEN_TTL_MS = 24 * 60 * 60 * 1e3;
 var DEFAULT_TIMEOUT_MS = 3e4;
 var DEFAULT_MAX_RETRIES = 3;
 var DEFAULT_RETRY_DELAY_MS = 1e3;
@@ -3624,12 +3717,27 @@ var CimplifyClient = class {
   }
   setOrderToken(orderId, token) {
     if (typeof window !== "undefined" && window.localStorage) {
-      localStorage.setItem(`${ORDER_TOKEN_PREFIX}${orderId}`, token);
+      try {
+        const entry = JSON.stringify({ token, storedAt: Date.now() });
+        localStorage.setItem(`${ORDER_TOKEN_PREFIX}${orderId}`, entry);
+      } catch {
+      }
     }
   }
   getOrderToken(orderId) {
     if (typeof window !== "undefined" && window.localStorage) {
-      return localStorage.getItem(`${ORDER_TOKEN_PREFIX}${orderId}`);
+      try {
+        const raw = localStorage.getItem(`${ORDER_TOKEN_PREFIX}${orderId}`);
+        if (!raw) return null;
+        const entry = JSON.parse(raw);
+        if (Date.now() - entry.storedAt > ORDER_TOKEN_TTL_MS) {
+          localStorage.removeItem(`${ORDER_TOKEN_PREFIX}${orderId}`);
+          return null;
+        }
+        return entry.token;
+      } catch {
+        return null;
+      }
     }
     return null;
   }
@@ -3705,10 +3813,13 @@ var CimplifyClient = class {
   }
   saveAccessToken(token) {
     if (typeof window !== "undefined" && window.localStorage) {
-      if (token) {
-        localStorage.setItem(ACCESS_TOKEN_STORAGE_KEY, token);
-      } else {
-        localStorage.removeItem(ACCESS_TOKEN_STORAGE_KEY);
+      try {
+        if (token) {
+          localStorage.setItem(ACCESS_TOKEN_STORAGE_KEY, token);
+        } else {
+          localStorage.removeItem(ACCESS_TOKEN_STORAGE_KEY);
+        }
+      } catch {
       }
     }
   }
@@ -3781,6 +3892,19 @@ var CimplifyClient = class {
           });
           return response;
         }
+        if (response.status === 429 && attempt < this.maxRetries) {
+          retryCount++;
+          const retryAfter = response.headers.get("Retry-After");
+          const delay = retryAfter ? Math.min(parseInt(retryAfter, 10) * 1e3, 3e4) || this.retryDelay * Math.pow(2, attempt) : this.retryDelay * Math.pow(2, attempt);
+          this.hooks.onRetry?.({
+            ...context,
+            attempt: retryCount,
+            delayMs: delay,
+            error: new Error(`Rate limited: ${response.status}`)
+          });
+          await sleep(delay);
+          continue;
+        }
         if (response.status >= 400 && response.status < 500) {
           this.hooks.onRequestError?.({
             ...context,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cimplify/sdk",
-  "version": "0.8.1",
+  "version": "0.8.2",
   "description": "Cimplify Commerce SDK for storefronts",
   "keywords": [
     "cimplify",