@cimplify/sdk 0.8.0 → 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",
@@ -31,7 +32,8 @@ var MESSAGE_TYPES = {
   CONTACT_PROVIDED: "contact_provided",
   CHECKOUT_STATUS: "checkout_status",
   CHECKOUT_COMPLETE: "checkout_complete",
-  ORDER_TYPE_CHANGED: "order_type_changed"
+  ORDER_TYPE_CHANGED: "order_type_changed",
+  REQUEST_SUBMIT: "request_submit"
 };
 var EVENT_TYPES = {
   READY: "ready",
@@ -39,7 +41,8 @@ var EVENT_TYPES = {
   REQUIRES_OTP: "requires_otp",
   ERROR: "error",
   CHANGE: "change",
-  ORDER_TYPE_CHANGED: "order_type_changed"
+  ORDER_TYPE_CHANGED: "order_type_changed",
+  REQUEST_SUBMIT: "request_submit"
 };
 
 // src/ads/identity.ts
@@ -341,7 +344,62 @@ function Ad({
     }
   );
 }
-var SPACE = { sm: 8, md: 12, lg: 16, xl: 24 };
+
+// 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 {
     text: isDark ? "#f4f4f5" : "#1a1a1a",
@@ -407,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);
@@ -414,23 +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);
-  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)) {
@@ -466,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) {
@@ -483,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;
         }
@@ -498,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);
@@ -524,42 +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);
-      }
-    });
-    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;
     }
@@ -594,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);
@@ -605,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;
     }
@@ -620,30 +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
-  ]);
+  });
+  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..." }) });
@@ -666,28 +737,6 @@ function CimplifyCheckout({
       }
     ),
     /* @__PURE__ */ jsx("div", { "data-cimplify-section": "checkout", children: /* @__PURE__ */ jsx("div", { ref: isDemoCheckout ? void 0 : checkoutMountRef }) }),
-    /* @__PURE__ */ jsx("div", { style: { marginTop: SPACE.xl }, children: /* @__PURE__ */ jsx(
-      "button",
-      {
-        type: "button",
-        onClick: handleSubmit,
-        disabled: isSubmitting,
-        style: {
-          width: "100%",
-          padding: `${SPACE.md}px ${SPACE.lg}px`,
-          borderRadius: 8,
-          border: "none",
-          background: isSubmitting ? colors.textMuted : primaryColor,
-          color: "#ffffff",
-          cursor: isSubmitting ? "not-allowed" : "pointer",
-          fontWeight: 600,
-          fontSize: 16,
-          transition: "all 150ms ease",
-          WebkitTapHighlightColor: "transparent"
-        },
-        children: isSubmitting ? "Processing..." : "Complete Order"
-      }
-    ) }),
     status && /* @__PURE__ */ jsx("p", { "data-cimplify-status": "", style: { marginTop: SPACE.sm, fontSize: 13, color: colors.textSecondary }, children: statusText || statusToLabel(status) }),
     errorMessage && /* @__PURE__ */ jsx("p", { "data-cimplify-error": "", style: { marginTop: SPACE.sm, fontSize: 13, color: colors.error }, children: errorMessage })
   ] });
@@ -1297,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) {
@@ -1535,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;
 }
@@ -1767,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.",
@@ -1897,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,
@@ -2971,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.",
@@ -2981,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.",
@@ -2990,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.",
@@ -2998,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.",
@@ -3009,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.",
@@ -3046,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 = () => {
@@ -3341,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);
@@ -3396,7 +3474,8 @@ var CimplifyElement = class {
         prefillEmail: this.options.prefillEmail,
         appearance: this.parent.getAppearance(),
         orderTypes: this.options.orderTypes,
-        defaultOrderType: this.options.defaultOrderType
+        defaultOrderType: this.options.defaultOrderType,
+        renderSubmitButton: true
       });
       const token = this.parent.getAccessToken();
       if (token && this.type !== ELEMENT_TYPES.AUTH) {
@@ -3463,6 +3542,9 @@ var CimplifyElement = class {
       case MESSAGE_TYPES.ORDER_TYPE_CHANGED:
         this.emit(EVENT_TYPES.ORDER_TYPE_CHANGED, { orderType: message.orderType });
         break;
+      case MESSAGE_TYPES.REQUEST_SUBMIT:
+        this.emit(EVENT_TYPES.REQUEST_SUBMIT, {});
+        break;
     }
   }
   emit(event, data) {
@@ -3485,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;
@@ -3634,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;
   }
@@ -3715,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 {
       }
     }
   }
@@ -3791,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.0",
+  "version": "0.8.2",
   "description": "Cimplify Commerce SDK for storefronts",
   "keywords": [
     "cimplify",