@solvapay/react 1.0.9-preview.1 → 1.0.9

package/dist/chunk-R2ZPZ7VM.js

@@ -0,0 +1,597 @@
+import {
+  AmountPicker,
+  MissingProductRefError,
+  MissingProviderError,
+  Slot,
+  SolvaPayContext,
+  TopupForm,
+  composeEventHandlers,
+  getMinorUnitsPerMajor,
+  interpolate,
+  useActivation,
+  useBalance,
+  useCopy,
+  usePlan,
+  usePlanSelection,
+  useProduct,
+  usePurchase,
+  useTopupAmountSelector
+} from "./chunk-37R5NZGF.js";
+
+// src/TopupForm.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+var TopupForm2 = (props) => {
+  const { className, buttonClassName, submitButtonText, ...rootProps } = props;
+  const rootClass = ["solvapay-topup-form", className].filter(Boolean).join(" ");
+  const buttonClass = ["solvapay-topup-form-submit", buttonClassName].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsxs(TopupForm.Root, { ...rootProps, className: rootClass, children: [
+    /* @__PURE__ */ jsx(TopupForm.PaymentElement, {}),
+    /* @__PURE__ */ jsx(TopupForm.Error, { className: "solvapay-topup-form-error" }),
+    /* @__PURE__ */ jsx(TopupForm.Loading, { className: "solvapay-topup-form-loading" }),
+    /* @__PURE__ */ jsx(TopupForm.SubmitButton, { className: buttonClass, children: submitButtonText })
+  ] });
+};
+
+// src/primitives/ProductBadge.tsx
+import { forwardRef, useContext, useEffect, useState } from "react";
+import { Fragment, jsx as jsx2 } from "react/jsx-runtime";
+var ProductBadgeImpl = forwardRef(function ProductBadge({ asChild, children, ...rest }, forwardedRef) {
+  const solva = useContext(SolvaPayContext);
+  if (!solva) throw new MissingProviderError("ProductBadge");
+  const { purchases, loading, hasPaidPurchase, activePurchase } = usePurchase();
+  const copy = useCopy();
+  const [hasLoadedOnce, setHasLoadedOnce] = useState(false);
+  useEffect(() => {
+    if (!loading) setHasLoadedOnce(true);
+  }, [loading]);
+  const planToDisplay = activePurchase?.productName ?? null;
+  const shouldShow = planToDisplay !== null && (!loading || hasLoadedOnce);
+  if (!shouldShow) return null;
+  const commonProps = {
+    "data-solvapay-product-badge": "",
+    "data-loading": loading ? "" : void 0,
+    "data-has-purchase": activePurchase ? "" : void 0,
+    "data-has-paid-purchase": hasPaidPurchase ? "" : void 0,
+    role: "status",
+    "aria-live": "polite",
+    "aria-busy": loading,
+    "aria-label": interpolate(copy.product.currentProductLabel, { name: planToDisplay }),
+    ...rest
+  };
+  if (asChild) {
+    return (
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      /* @__PURE__ */ jsx2(Slot, { ref: forwardedRef, ...commonProps, children: children ?? /* @__PURE__ */ jsx2(Fragment, { children: planToDisplay }) })
+    );
+  }
+  void purchases;
+  return (
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    /* @__PURE__ */ jsx2("div", { ref: forwardedRef, ...commonProps, children: children ?? planToDisplay })
+  );
+});
+var ProductBadge2 = ProductBadgeImpl;
+var PlanBadge = ProductBadgeImpl;
+
+// src/primitives/PurchaseGate.tsx
+import {
+  createContext,
+  forwardRef as forwardRef2,
+  useContext as useContext2,
+  useMemo
+} from "react";
+import { jsx as jsx3 } from "react/jsx-runtime";
+var PurchaseGateContext = createContext(null);
+function useGateCtx(part) {
+  const ctx = useContext2(PurchaseGateContext);
+  if (!ctx) {
+    throw new Error(`PurchaseGate.${part} must be rendered inside <PurchaseGate.Root>.`);
+  }
+  return ctx;
+}
+var Root = forwardRef2(function PurchaseGateRoot({ requirePlan, requireProduct, asChild, children, ...rest }, forwardedRef) {
+  const solva = useContext2(SolvaPayContext);
+  if (!solva) throw new MissingProviderError("PurchaseGate");
+  const { purchases, loading, hasProduct, error } = usePurchase();
+  const productToCheck = requireProduct || requirePlan;
+  const hasAccess = productToCheck ? hasProduct(productToCheck) : purchases.some((p) => p.status === "active");
+  const state = loading ? "loading" : hasAccess ? "allowed" : "blocked";
+  const ctx = useMemo(
+    () => ({ state, loading, hasAccess, error }),
+    [state, loading, hasAccess, error]
+  );
+  const Comp = asChild ? Slot : "div";
+  return /* @__PURE__ */ jsx3(PurchaseGateContext.Provider, { value: ctx, children: /* @__PURE__ */ jsx3(
+    Comp,
+    {
+      ref: forwardedRef,
+      "data-solvapay-purchase-gate": "",
+      "data-state": state,
+      ...rest,
+      children
+    }
+  ) });
+});
+var Allowed = forwardRef2(function PurchaseGateAllowed({ asChild, children, ...rest }, forwardedRef) {
+  const ctx = useGateCtx("Allowed");
+  if (ctx.state !== "allowed") return null;
+  const Comp = asChild ? Slot : "div";
+  return /* @__PURE__ */ jsx3(Comp, { ref: forwardedRef, "data-solvapay-purchase-gate-allowed": "", ...rest, children });
+});
+var Blocked = forwardRef2(function PurchaseGateBlocked({ asChild, children, ...rest }, forwardedRef) {
+  const ctx = useGateCtx("Blocked");
+  if (ctx.state !== "blocked") return null;
+  const Comp = asChild ? Slot : "div";
+  return /* @__PURE__ */ jsx3(Comp, { ref: forwardedRef, "data-solvapay-purchase-gate-blocked": "", ...rest, children });
+});
+var Loading = forwardRef2(function PurchaseGateLoading({ asChild, children, ...rest }, forwardedRef) {
+  const ctx = useGateCtx("Loading");
+  if (ctx.state !== "loading") return null;
+  const Comp = asChild ? Slot : "div";
+  return /* @__PURE__ */ jsx3(Comp, { ref: forwardedRef, "data-solvapay-purchase-gate-loading": "", ...rest, children });
+});
+var ErrorSlot = forwardRef2(function PurchaseGateError({ asChild, children, ...rest }, forwardedRef) {
+  const ctx = useGateCtx("Error");
+  if (!ctx.error) return null;
+  const Comp = asChild ? Slot : "div";
+  return /* @__PURE__ */ jsx3(Comp, { ref: forwardedRef, "data-solvapay-purchase-gate-error": "", role: "alert", ...rest, children: children ?? ctx.error.message });
+});
+var PurchaseGateRoot2 = Root;
+var PurchaseGateAllowed2 = Allowed;
+var PurchaseGateBlocked2 = Blocked;
+var PurchaseGateLoading2 = Loading;
+var PurchaseGateError2 = ErrorSlot;
+var PurchaseGate = {
+  Root,
+  Allowed,
+  Blocked,
+  Loading,
+  Error: ErrorSlot
+};
+function usePurchaseGate() {
+  return useGateCtx("usePurchaseGate");
+}
+
+// src/primitives/ActivationFlow.tsx
+import {
+  createContext as createContext2,
+  forwardRef as forwardRef3,
+  useCallback,
+  useContext as useContext3,
+  useEffect as useEffect2,
+  useMemo as useMemo2,
+  useRef,
+  useState as useState2
+} from "react";
+import { Fragment as Fragment2, jsx as jsx4 } from "react/jsx-runtime";
+var ActivationFlowContext = createContext2(null);
+function useFlowCtx(part) {
+  const ctx = useContext3(ActivationFlowContext);
+  if (!ctx) {
+    throw new Error(`ActivationFlow.${part} must be rendered inside <ActivationFlow.Root>.`);
+  }
+  return ctx;
+}
+var Root2 = forwardRef3(function ActivationFlowRoot({
+  productRef,
+  planRef: planRefProp,
+  onSuccess,
+  onError,
+  retryDelayMs = 1500,
+  retryBackoffMs = 2e3,
+  asChild,
+  children,
+  ...rest
+}, forwardedRef) {
+  const solva = useContext3(SolvaPayContext);
+  if (!solva) throw new MissingProviderError("ActivationFlow");
+  if (!productRef) throw new MissingProductRefError("ActivationFlow");
+  const planSelection = usePlanSelection();
+  const resolvedPlanRef = planRefProp ?? planSelection?.selectedPlanRef ?? void 0;
+  const { plan } = usePlan({ planRef: resolvedPlanRef, productRef });
+  const { activate, state, error, result, reset } = useActivation();
+  const currency = plan?.currency ?? "USD";
+  const amountSelector = useTopupAmountSelector({ currency });
+  const { adjustBalance, creditsPerMinorUnit, displayExchangeRate } = useBalance();
+  const [step, setStep] = useState2("summary");
+  const calledSuccessRef = useRef(false);
+  const retryTimeoutRef = useRef(null);
+  useEffect2(() => {
+    if (state === "activated" && !calledSuccessRef.current) {
+      calledSuccessRef.current = true;
+      setStep("activated");
+      if (result) {
+        const activationResult = { kind: "activated", result };
+        onSuccess?.(activationResult);
+      }
+    }
+  }, [state, result, onSuccess]);
+  useEffect2(() => {
+    if (state === "topup_required" && (step === "summary" || step === "activating")) {
+      setStep("selectAmount");
+    }
+  }, [state, step]);
+  useEffect2(() => {
+    if ((state === "error" || state === "payment_required") && error) {
+      setStep("error");
+      if (state === "error") onError?.(new Error(error));
+    }
+  }, [state, error, onError]);
+  const handleActivate = useCallback(async () => {
+    if (!resolvedPlanRef) return;
+    setStep("activating");
+    await activate({ productRef, planRef: resolvedPlanRef });
+  }, [activate, productRef, resolvedPlanRef]);
+  const goToTopupPayment = useCallback(() => {
+    if (amountSelector.validate()) setStep("topupPayment");
+  }, [amountSelector]);
+  const backToSelectAmount = useCallback(() => {
+    setStep("selectAmount");
+  }, []);
+  const retryActivation = useCallback(async () => {
+    if (!resolvedPlanRef) return;
+    setStep("retrying");
+    const amountMinor2 = Math.round(
+      (amountSelector.resolvedAmount || 0) * getMinorUnitsPerMajor(currency)
+    );
+    const rate = displayExchangeRate ?? 1;
+    if (creditsPerMinorUnit) {
+      adjustBalance(Math.floor(amountMinor2 / rate * creditsPerMinorUnit));
+    }
+    await new Promise((r) => setTimeout(r, retryDelayMs));
+    await activate({ productRef, planRef: resolvedPlanRef });
+  }, [
+    resolvedPlanRef,
+    amountSelector.resolvedAmount,
+    currency,
+    displayExchangeRate,
+    creditsPerMinorUnit,
+    adjustBalance,
+    retryDelayMs,
+    activate,
+    productRef
+  ]);
+  const handleTopupSuccess = useCallback(async () => {
+    await retryActivation();
+  }, [retryActivation]);
+  useEffect2(() => {
+    if (step !== "retrying") return;
+    if (state !== "topup_required") return;
+    if (!resolvedPlanRef) return;
+    retryTimeoutRef.current = setTimeout(async () => {
+      await activate({ productRef, planRef: resolvedPlanRef });
+    }, retryBackoffMs);
+    return () => {
+      if (retryTimeoutRef.current) clearTimeout(retryTimeoutRef.current);
+    };
+  }, [step, state, resolvedPlanRef, retryBackoffMs, activate, productRef]);
+  const resetFlow = useCallback(() => {
+    reset();
+    calledSuccessRef.current = false;
+    setStep("summary");
+  }, [reset]);
+  const amountMinor = Math.round(
+    (amountSelector.resolvedAmount || 0) * getMinorUnitsPerMajor(currency)
+  );
+  const ctx = useMemo2(
+    () => ({
+      step,
+      plan,
+      productRef,
+      planRef: resolvedPlanRef ?? "",
+      amountSelector,
+      amountMinor,
+      // Deprecated alias — same value as amountMinor so legacy consumers
+      // keep working after the zero-decimal fix (previously this was
+      // `resolvedAmount * 100`, which over-billed JPY/KRW by 100x).
+      amountCents: amountMinor,
+      currency,
+      activate: handleActivate,
+      reset: resetFlow,
+      goToTopupPayment,
+      backToSelectAmount,
+      onTopupSuccess: handleTopupSuccess,
+      error,
+      onError
+    }),
+    [
+      step,
+      plan,
+      productRef,
+      resolvedPlanRef,
+      amountSelector,
+      amountMinor,
+      currency,
+      handleActivate,
+      resetFlow,
+      goToTopupPayment,
+      backToSelectAmount,
+      handleTopupSuccess,
+      error,
+      onError
+    ]
+  );
+  const Comp = asChild ? Slot : "div";
+  return /* @__PURE__ */ jsx4(ActivationFlowContext.Provider, { value: ctx, children: /* @__PURE__ */ jsx4(
+    Comp,
+    {
+      ref: forwardedRef,
+      "data-solvapay-activation-flow": "",
+      "data-state": step,
+      ...rest,
+      children
+    }
+  ) });
+});
+function matchStep(step, allowed) {
+  return allowed.includes(step);
+}
+var Summary = forwardRef3(function ActivationFlowSummary({ asChild, children, ...rest }, forwardedRef) {
+  const ctx = useFlowCtx("Summary");
+  if (!matchStep(ctx.step, ["summary", "activating"])) return null;
+  const Comp = asChild ? Slot : "div";
+  return /* @__PURE__ */ jsx4(Comp, { ref: forwardedRef, "data-solvapay-activation-flow-summary": "", ...rest, children });
+});
+var ActivateButton = forwardRef3(
+  function ActivationFlowActivateButton({ asChild, onClick, children, ...rest }, forwardedRef) {
+    const ctx = useFlowCtx("ActivateButton");
+    const copy = useCopy();
+    if (!matchStep(ctx.step, ["summary", "activating"])) return null;
+    const isActivating = ctx.step === "activating";
+    const disabled = isActivating;
+    const commonProps = {
+      "data-solvapay-activation-flow-activate": "",
+      "data-state": isActivating ? "activating" : "idle",
+      "aria-busy": isActivating,
+      disabled,
+      onClick: composeEventHandlers(onClick, () => {
+        void ctx.activate();
+      }),
+      ...rest
+    };
+    const label = isActivating ? copy.activationFlow.activatingLabel : copy.activationFlow.activateButton;
+    if (asChild) {
+      return (
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        /* @__PURE__ */ jsx4(Slot, { ref: forwardedRef, ...commonProps, children: children ?? /* @__PURE__ */ jsx4(Fragment2, { children: label }) })
+      );
+    }
+    return /* @__PURE__ */ jsx4("button", { ref: forwardedRef, type: "button", ...commonProps, children: children ?? label });
+  }
+);
+var AmountPickerMount = ({ children }) => {
+  const ctx = useFlowCtx("AmountPicker");
+  if (ctx.step !== "selectAmount") return null;
+  return /* @__PURE__ */ jsx4("div", { "data-solvapay-activation-flow-amount-picker": "", children: /* @__PURE__ */ jsx4(AmountPicker.Root, { currency: ctx.currency, selector: ctx.amountSelector, children }) });
+};
+var ContinueButton = forwardRef3(
+  function ActivationFlowContinueButton({ asChild, onClick, children, ...rest }, forwardedRef) {
+    const ctx = useFlowCtx("ContinueButton");
+    const copy = useCopy();
+    if (ctx.step !== "selectAmount") return null;
+    const disabled = !ctx.amountSelector.resolvedAmount;
+    const commonProps = {
+      "data-solvapay-activation-flow-continue": "",
+      "data-state": disabled ? "disabled" : "idle",
+      disabled,
+      "aria-disabled": disabled || void 0,
+      onClick: composeEventHandlers(onClick, () => {
+        ctx.goToTopupPayment();
+      }),
+      ...rest
+    };
+    if (asChild) {
+      return (
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        /* @__PURE__ */ jsx4(Slot, { ref: forwardedRef, ...commonProps, children: children ?? /* @__PURE__ */ jsx4(Fragment2, { children: copy.activationFlow.continueToPayment }) })
+      );
+    }
+    return /* @__PURE__ */ jsx4("button", { ref: forwardedRef, type: "button", ...commonProps, children: children ?? copy.activationFlow.continueToPayment });
+  }
+);
+var Retrying = forwardRef3(function ActivationFlowRetrying({ asChild, children, ...rest }, forwardedRef) {
+  const ctx = useFlowCtx("Retrying");
+  if (ctx.step !== "retrying") return null;
+  const Comp = asChild ? Slot : "div";
+  return /* @__PURE__ */ jsx4(Comp, { ref: forwardedRef, "data-solvapay-activation-flow-retrying": "", ...rest, children });
+});
+var Activated = forwardRef3(function ActivationFlowActivated({ asChild, children, ...rest }, forwardedRef) {
+  const ctx = useFlowCtx("Activated");
+  if (ctx.step !== "activated") return null;
+  const Comp = asChild ? Slot : "div";
+  return /* @__PURE__ */ jsx4(Comp, { ref: forwardedRef, "data-solvapay-activation-flow-activated": "", ...rest, children });
+});
+var Loading2 = forwardRef3(function ActivationFlowLoading({ asChild, children, ...rest }, forwardedRef) {
+  const ctx = useFlowCtx("Loading");
+  if (ctx.plan) return null;
+  const Comp = asChild ? Slot : "div";
+  return /* @__PURE__ */ jsx4(Comp, { ref: forwardedRef, "data-solvapay-activation-flow-loading": "", ...rest, children });
+});
+var ErrorSlot2 = forwardRef3(function ActivationFlowError({ asChild, children, ...rest }, forwardedRef) {
+  const ctx = useFlowCtx("Error");
+  if (ctx.step !== "error") return null;
+  const Comp = asChild ? Slot : "div";
+  return /* @__PURE__ */ jsx4(
+    Comp,
+    {
+      ref: forwardedRef,
+      role: "alert",
+      "data-solvapay-activation-flow-error": "",
+      ...rest,
+      children: children ?? ctx.error
+    }
+  );
+});
+var ActivationFlowRoot2 = Root2;
+var ActivationFlowSummary2 = Summary;
+var ActivationFlowActivateButton2 = ActivateButton;
+var ActivationFlowAmountPicker = AmountPickerMount;
+var ActivationFlowContinueButton2 = ContinueButton;
+var ActivationFlowRetrying2 = Retrying;
+var ActivationFlowActivated2 = Activated;
+var ActivationFlowLoading2 = Loading2;
+var ActivationFlowError2 = ErrorSlot2;
+var ActivationFlow = {
+  Root: Root2,
+  Summary,
+  ActivateButton,
+  AmountPicker: AmountPickerMount,
+  ContinueButton,
+  Retrying,
+  Activated,
+  Loading: Loading2,
+  Error: ErrorSlot2
+};
+function useActivationFlow() {
+  return useFlowCtx("useActivationFlow");
+}
+
+// src/primitives/CreditGate.tsx
+import {
+  createContext as createContext3,
+  forwardRef as forwardRef4,
+  useContext as useContext4,
+  useMemo as useMemo3
+} from "react";
+import { jsx as jsx5 } from "react/jsx-runtime";
+var CreditGateContext = createContext3(null);
+function useGateCtx2(part) {
+  const ctx = useContext4(CreditGateContext);
+  if (!ctx) {
+    throw new Error(`CreditGate.${part} must be rendered inside <CreditGate.Root>.`);
+  }
+  return ctx;
+}
+var Root3 = forwardRef4(function CreditGateRoot({
+  minCredits = 1,
+  productRef,
+  topupAmount = 1e3,
+  topupCurrency = "usd",
+  asChild,
+  children,
+  ...rest
+}, forwardedRef) {
+  const solva = useContext4(SolvaPayContext);
+  if (!solva) throw new MissingProviderError("CreditGate");
+  const { credits, loading } = useBalance();
+  const { product } = useProduct(productRef);
+  const hasCredits = credits != null && credits >= minCredits;
+  const state = loading && credits == null ? "loading" : hasCredits ? "allowed" : "blocked";
+  const ctx = useMemo3(
+    () => ({
+      state,
+      loading,
+      hasCredits,
+      balance: credits,
+      productName: product?.name ?? null,
+      topupAmount,
+      topupCurrency
+    }),
+    [state, loading, hasCredits, credits, product?.name, topupAmount, topupCurrency]
+  );
+  const Comp = asChild ? Slot : "div";
+  return /* @__PURE__ */ jsx5(CreditGateContext.Provider, { value: ctx, children: /* @__PURE__ */ jsx5(
+    Comp,
+    {
+      ref: forwardedRef,
+      "data-solvapay-credit-gate": "",
+      "data-state": state,
+      ...rest,
+      children
+    }
+  ) });
+});
+var Heading = forwardRef4(function CreditGateHeading({ asChild, children, ...rest }, forwardedRef) {
+  const ctx = useGateCtx2("Heading");
+  const copy = useCopy();
+  if (ctx.state !== "blocked") return null;
+  const Comp = asChild ? Slot : "h3";
+  return /* @__PURE__ */ jsx5(Comp, { ref: forwardedRef, "data-solvapay-credit-gate-heading": "", ...rest, children: children ?? copy.creditGate.lowBalanceHeading });
+});
+var Subheading = forwardRef4(function CreditGateSubheading({ asChild, children, ...rest }, forwardedRef) {
+  const ctx = useGateCtx2("Subheading");
+  const copy = useCopy();
+  if (ctx.state !== "blocked") return null;
+  const text = interpolate(copy.creditGate.lowBalanceSubheading, {
+    product: ctx.productName ?? "this product"
+  });
+  const Comp = asChild ? Slot : "p";
+  return /* @__PURE__ */ jsx5(Comp, { ref: forwardedRef, "data-solvapay-credit-gate-subheading": "", ...rest, children: children ?? text });
+});
+var Topup = ({ amount, currency }) => {
+  const ctx = useGateCtx2("Topup");
+  if (ctx.state !== "blocked") return null;
+  return /* @__PURE__ */ jsx5(
+    TopupForm2,
+    {
+      amount: amount ?? ctx.topupAmount,
+      currency: currency ?? ctx.topupCurrency
+    }
+  );
+};
+var Loading3 = forwardRef4(function CreditGateLoading({ asChild, children, ...rest }, forwardedRef) {
+  const ctx = useGateCtx2("Loading");
+  if (ctx.state !== "loading") return null;
+  const Comp = asChild ? Slot : "div";
+  return (
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    /* @__PURE__ */ jsx5(Comp, { ref: forwardedRef, "data-solvapay-credit-gate-loading": "", ...rest, children })
+  );
+});
+var ErrorSlot3 = forwardRef4(function CreditGateError({ asChild, children, ...rest }, forwardedRef) {
+  if (!children) return null;
+  const Comp = asChild ? Slot : "div";
+  return (
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    /* @__PURE__ */ jsx5(Comp, { ref: forwardedRef, "data-solvapay-credit-gate-error": "", role: "alert", ...rest, children })
+  );
+});
+var CreditGateRoot2 = Root3;
+var CreditGateHeading2 = Heading;
+var CreditGateSubheading2 = Subheading;
+var CreditGateTopup = Topup;
+var CreditGateLoading2 = Loading3;
+var CreditGateError2 = ErrorSlot3;
+var CreditGate = {
+  Root: Root3,
+  Heading,
+  Subheading,
+  Topup,
+  Loading: Loading3,
+  Error: ErrorSlot3
+};
+function useCreditGate() {
+  return useGateCtx2("useCreditGate");
+}
+
+export {
+  TopupForm2 as TopupForm,
+  ProductBadge2 as ProductBadge,
+  PlanBadge,
+  PurchaseGateRoot2 as PurchaseGateRoot,
+  PurchaseGateAllowed2 as PurchaseGateAllowed,
+  PurchaseGateBlocked2 as PurchaseGateBlocked,
+  PurchaseGateLoading2 as PurchaseGateLoading,
+  PurchaseGateError2 as PurchaseGateError,
+  PurchaseGate,
+  usePurchaseGate,
+  ActivationFlowRoot2 as ActivationFlowRoot,
+  ActivationFlowSummary2 as ActivationFlowSummary,
+  ActivationFlowActivateButton2 as ActivationFlowActivateButton,
+  ActivationFlowAmountPicker,
+  ActivationFlowContinueButton2 as ActivationFlowContinueButton,
+  ActivationFlowRetrying2 as ActivationFlowRetrying,
+  ActivationFlowActivated2 as ActivationFlowActivated,
+  ActivationFlowLoading2 as ActivationFlowLoading,
+  ActivationFlowError2 as ActivationFlowError,
+  ActivationFlow,
+  useActivationFlow,
+  CreditGateRoot2 as CreditGateRoot,
+  CreditGateHeading2 as CreditGateHeading,
+  CreditGateSubheading2 as CreditGateSubheading,
+  CreditGateTopup,
+  CreditGateLoading2 as CreditGateLoading,
+  CreditGateError2 as CreditGateError,
+  CreditGate,
+  useCreditGate
+};