npm - @unifold/ui-web - Versions diffs - 0.1.35 → 0.1.36 - Mend

@unifold/ui-web 0.1.35 → 0.1.36

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (5) hide show

package/dist/index.d.mts CHANGED Viewed

@@ -1,5 +1,5 @@
 import { UnifoldConnectProviderConfig, DepositConfig, DepositResult } from '@unifold/connect-react';
-export { DepositConfig, DepositError, DepositResult, UnifoldConnectProviderConfig } from '@unifold/connect-react';
+export { DepositConfig, DepositError, DepositInitialScreen, DepositResult, UnifoldConnectProviderConfig } from '@unifold/connect-react';
 type UnifoldConfig = UnifoldConnectProviderConfig["config"];
 interface UnifoldHandle {

package/dist/index.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
 import { UnifoldConnectProviderConfig, DepositConfig, DepositResult } from '@unifold/connect-react';
-export { DepositConfig, DepositError, DepositResult, UnifoldConnectProviderConfig } from '@unifold/connect-react';
+export { DepositConfig, DepositError, DepositInitialScreen, DepositResult, UnifoldConnectProviderConfig } from '@unifold/connect-react';
 type UnifoldConfig = UnifoldConnectProviderConfig["config"];
 interface UnifoldHandle {

package/dist/index.js CHANGED Viewed

@@ -38711,18 +38711,18 @@ function composeContextScopes(...scopes) {
   createScope.scopeName = baseScope.scopeName;
   return createScope;
 }
-var useLayoutEffect22 = globalThis?.document ? React32.useLayoutEffect : () => {
+var useLayoutEffect23 = globalThis?.document ? React32.useLayoutEffect : () => {
 };
 var useReactId = React42[" useId ".trim().toString()] || (() => void 0);
 var count = 0;
 function useId13(deterministicId) {
   const [id, setId] = React42.useState(useReactId());
-  useLayoutEffect22(() => {
+  useLayoutEffect23(() => {
     if (!deterministicId) setId((reactId) => reactId ?? String(count++));
   }, [deterministicId]);
   return deterministicId || (id ? `radix-${id}` : "");
 }
-var useInsertionEffect = React52[" useInsertionEffect ".trim().toString()] || useLayoutEffect22;
+var useInsertionEffect = React52[" useInsertionEffect ".trim().toString()] || useLayoutEffect23;
 function useControllableState({
   prop,
   defaultProp,
@@ -39337,7 +39337,7 @@ var PORTAL_NAME = "Portal";
 var Portal = React12.forwardRef((props, forwardedRef) => {
   const { container: containerProp, ...portalProps } = props;
   const [mounted, setMounted] = React12.useState(false);
-  useLayoutEffect22(() => setMounted(true), []);
+  useLayoutEffect23(() => setMounted(true), []);
   const container = containerProp || mounted && globalThis?.document?.body;
   return container ? import_react_dom.default.createPortal(/* @__PURE__ */ (0, import_jsx_runtime9.jsx)(Primitive.div, { ...portalProps, ref: forwardedRef }), container) : null;
 });
@@ -39380,7 +39380,7 @@ function usePresence(present) {
     const currentAnimationName = getAnimationName(stylesRef.current);
     prevAnimationNameRef.current = state === "mounted" ? currentAnimationName : "none";
   }, [state]);
-  useLayoutEffect22(() => {
+  useLayoutEffect23(() => {
     const styles = stylesRef.current;
     const wasPresent = prevPresentRef.current;
     const hasPresentChanged = wasPresent !== present;
@@ -39402,7 +39402,7 @@ function usePresence(present) {
       prevPresentRef.current = present;
     }
   }, [present, send]);
-  useLayoutEffect22(() => {
+  useLayoutEffect23(() => {
     if (node) {
       let timeoutId;
       const ownerWindow = node.ownerDocument.defaultView ?? window;
@@ -45415,7 +45415,7 @@ Arrow.displayName = NAME;
 var Root2 = Arrow;
 function useSize(element) {
   const [size4, setSize] = React27.useState(void 0);
-  useLayoutEffect22(() => {
+  useLayoutEffect23(() => {
     if (element) {
       setSize({ width: element.offsetWidth, height: element.offsetHeight });
       const resizeObserver = new ResizeObserver((entries) => {
@@ -45552,7 +45552,7 @@ var PopperContent = React28.forwardRef(
     });
     const [placedSide, placedAlign] = getSideAndAlignFromPlacement(placement);
     const handlePlaced = useCallbackRef(onPlaced);
-    useLayoutEffect22(() => {
+    useLayoutEffect23(() => {
       if (isPositioned) {
         handlePlaced?.();
       }
@@ -45561,7 +45561,7 @@ var PopperContent = React28.forwardRef(
     const arrowY = middlewareData.arrow?.y;
     const cannotCenterArrow = middlewareData.arrow?.centerOffset !== 0;
     const [contentZIndex, setContentZIndex] = React28.useState();
-    useLayoutEffect22(() => {
+    useLayoutEffect23(() => {
       if (content) setContentZIndex(window.getComputedStyle(content).zIndex);
     }, [content]);
     return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
@@ -46492,7 +46492,7 @@ var SelectValue = React34.forwardRef(
     const { onValueNodeHasChildrenChange } = context;
     const hasChildren = children !== void 0;
     const composedRefs = useComposedRefs(forwardedRef, context.onValueNodeChange);
-    useLayoutEffect22(() => {
+    useLayoutEffect23(() => {
       onValueNodeHasChildrenChange(hasChildren);
     }, [onValueNodeHasChildrenChange, hasChildren]);
     return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
@@ -46525,7 +46525,7 @@ var SelectContent = React34.forwardRef(
   (props, forwardedRef) => {
     const context = useSelectContext(CONTENT_NAME4, props.__scopeSelect);
     const [fragment, setFragment] = React34.useState();
-    useLayoutEffect22(() => {
+    useLayoutEffect23(() => {
       setFragment(new DocumentFragment());
     }, []);
     if (!context.open) {
@@ -46887,9 +46887,9 @@ var SelectItemAlignedPosition = React34.forwardRef((props, forwardedRef) => {
     context.dir,
     onPlaced
   ]);
-  useLayoutEffect22(() => position(), [position]);
+  useLayoutEffect23(() => position(), [position]);
   const [contentZIndex, setContentZIndex] = React34.useState();
-  useLayoutEffect22(() => {
+  useLayoutEffect23(() => {
     if (content) setContentZIndex(window.getComputedStyle(content).zIndex);
   }, [content]);
   const handleScrollButtonChange = React34.useCallback(
@@ -47186,7 +47186,7 @@ var SelectItemText = React34.forwardRef(
       [itemContext.disabled, itemContext.value, textContent]
     );
     const { onNativeOptionAdd, onNativeOptionRemove } = nativeOptionsContext;
-    useLayoutEffect22(() => {
+    useLayoutEffect23(() => {
       onNativeOptionAdd(nativeOption);
       return () => onNativeOptionRemove(nativeOption);
     }, [onNativeOptionAdd, onNativeOptionRemove, nativeOption]);
@@ -47212,7 +47212,7 @@ var SelectScrollUpButton = React34.forwardRef((props, forwardedRef) => {
   const viewportContext = useSelectViewportContext(SCROLL_UP_BUTTON_NAME, props.__scopeSelect);
   const [canScrollUp, setCanScrollUp] = React34.useState(false);
   const composedRefs = useComposedRefs(forwardedRef, viewportContext.onScrollButtonChange);
-  useLayoutEffect22(() => {
+  useLayoutEffect23(() => {
     if (contentContext.viewport && contentContext.isPositioned) {
       let handleScroll22 = function() {
         const canScrollUp2 = viewport.scrollTop > 0;
@@ -47246,7 +47246,7 @@ var SelectScrollDownButton = React34.forwardRef((props, forwardedRef) => {
   const viewportContext = useSelectViewportContext(SCROLL_DOWN_BUTTON_NAME, props.__scopeSelect);
   const [canScrollDown, setCanScrollDown] = React34.useState(false);
   const composedRefs = useComposedRefs(forwardedRef, viewportContext.onScrollButtonChange);
-  useLayoutEffect22(() => {
+  useLayoutEffect23(() => {
     if (contentContext.viewport && contentContext.isPositioned) {
       let handleScroll22 = function() {
         const maxScroll = viewport.scrollHeight - viewport.clientHeight;
@@ -47289,7 +47289,7 @@ var SelectScrollButtonImpl = React34.forwardRef((props, forwardedRef) => {
   React34.useEffect(() => {
     return () => clearAutoScrollTimer();
   }, [clearAutoScrollTimer]);
-  useLayoutEffect22(() => {
+  useLayoutEffect23(() => {
     const activeItem = getItems().find((item) => item.ref.current === document.activeElement);
     activeItem?.ref.current?.scrollIntoView({ block: "nearest" });
   }, [getItems]);
@@ -58027,14 +58027,23 @@ function DepositModal({
   onDepositSuccess,
   onDepositError,
   theme = "dark",
-  hideOverlay = false
+  hideOverlay = false,
+  initialScreen = "main"
 }) {
   const { colors: colors2, fonts, components } = useTheme();
+  const effectiveInitialScreen = (0, import_react3.useMemo)(() => {
+    const s = initialScreen ?? "main";
+    if (s === "tracker" && hideDepositTracker) return "main";
+    return s;
+  }, [initialScreen, hideDepositTracker]);
   const [containerEl, setContainerEl] = (0, import_react3.useState)(null);
   const containerCallbackRef = (0, import_react3.useCallback)((el) => {
     setContainerEl(el);
   }, []);
-  const [view, setView] = (0, import_react3.useState)("main");
+  const [view, setView] = (0, import_react3.useState)(
+    effectiveInitialScreen
+  );
+  const resetViewTimeoutRef = (0, import_react3.useRef)(null);
   const [cardView, setCardView] = (0, import_react3.useState)(
     "amount"
   );
@@ -58154,6 +58163,43 @@ function DepositModal({
     const template = errors[code] ?? addressValidationMessages.defaultError;
     return interpolate(template, metadata);
   };
+  const openingScreen = effectiveInitialScreen;
+  const sessionOpenedFromMenu = openingScreen === "main";
+  const standaloneNeedsDepositPrereq = openingScreen !== "main" && (view === "transfer" || view === "card");
+  let depositPrerequisiteBody;
+  if (isCountryLoading || isAddressValidationLoading || tokensLoading || walletsLoading || !projectConfig) {
+    depositPrerequisiteBody = standaloneNeedsDepositPrereq ? /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(SkeletonButton, { variant: "with-icons" }) : /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(import_jsx_runtime66.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(SkeletonButton, { variant: "with-icons" }),
+      /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(SkeletonButton, { variant: "with-icons" }),
+      !hideDepositTracker && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(SkeletonButton, {})
+    ] });
+  } else if (countryError) {
+    depositPrerequisiteBody = /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("div", { className: "uf-flex uf-flex-col uf-items-center uf-justify-center uf-py-8 uf-px-4 uf-text-center", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: "uf-w-16 uf-h-16 uf-rounded-full uf-bg-muted uf-flex uf-items-center uf-justify-center uf-mb-4", children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(TriangleAlert, { className: "uf-w-8 uf-h-8 uf-text-muted-foreground" }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("h3", { className: "uf-text-lg uf-font-semibold uf-text-foreground uf-mb-2", children: "Unable to Verify Location" }),
+      /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("p", { className: "uf-text-sm uf-text-muted-foreground uf-max-w-[280px]", children: "We couldn't verify your location. Please check your connection and try again." })
+    ] });
+  } else if (!isAllowed) {
+    depositPrerequisiteBody = /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("div", { className: "uf-flex uf-flex-col uf-items-center uf-justify-center uf-py-8 uf-px-4 uf-text-center", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: "uf-w-16 uf-h-16 uf-rounded-full uf-bg-muted uf-flex uf-items-center uf-justify-center uf-mb-4", children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(MapPinOff, { className: "uf-w-8 uf-h-8 uf-text-muted-foreground" }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("h3", { className: "uf-text-lg uf-font-semibold uf-text-foreground uf-mb-2", children: "No Tokens Available" }),
+      /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("p", { className: "uf-text-sm uf-text-muted-foreground uf-max-w-[280px]", children: "There are no supported tokens available from your current location." })
+    ] });
+  } else if (isAddressValid === false) {
+    depositPrerequisiteBody = /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("div", { className: "uf-flex uf-flex-col uf-items-center uf-justify-center uf-py-8 uf-px-4 uf-text-center", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: "uf-w-16 uf-h-16 uf-rounded-full uf-bg-muted uf-flex uf-items-center uf-justify-center uf-mb-4", children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(TriangleAlert, { className: "uf-w-8 uf-h-8 uf-text-muted-foreground" }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("h3", { className: "uf-text-lg uf-font-semibold uf-text-foreground uf-mb-2", children: addressValidationMessages.unableToReceiveFunds }),
+      /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("p", { className: "uf-text-sm uf-text-muted-foreground uf-max-w-[280px]", children: getAddressValidationErrorMessage(
+        addressFailureCode,
+        addressFailureMetadata
+      ) })
+    ] });
+  } else {
+    depositPrerequisiteBody = null;
+  }
+  const showBackTransfer = sessionOpenedFromMenu;
+  const showBackCard = cardView !== "amount" || sessionOpenedFromMenu;
+  const showBackTracker = selectedExecution !== null || sessionOpenedFromMenu;
   const themeClass = resolvedTheme === "dark" ? "uf-dark" : "";
   const handleWalletDisconnect = () => {
     setUserDisconnectedWallet(true);
@@ -58164,13 +58210,37 @@ function DepositModal({
   };
   const handleClose = () => {
     onOpenChange(false);
-    setTimeout(() => {
-      setView("main");
+    if (resetViewTimeoutRef.current) {
+      clearTimeout(resetViewTimeoutRef.current);
+    }
+    resetViewTimeoutRef.current = setTimeout(() => {
+      setView(effectiveInitialScreen);
       setCardView("amount");
       setExchangeView("providers");
       setBrowserWalletInfo(null);
+      resetViewTimeoutRef.current = null;
     }, 200);
   };
+  (0, import_react3.useLayoutEffect)(() => {
+    if (!open) return;
+    if (resetViewTimeoutRef.current) {
+      clearTimeout(resetViewTimeoutRef.current);
+      resetViewTimeoutRef.current = null;
+    }
+    setView(effectiveInitialScreen);
+    setCardView("amount");
+    setExchangeView("providers");
+    setBrowserWalletInfo(null);
+    setSelectedExecution(null);
+  }, [open, effectiveInitialScreen]);
+  (0, import_react3.useEffect)(
+    () => () => {
+      if (resetViewTimeoutRef.current) {
+        clearTimeout(resetViewTimeoutRef.current);
+      }
+    },
+    []
+  );
   const handleBack = () => {
     if (view === "card" && cardView === "quotes") {
       setCardView("amount");
@@ -58283,95 +58353,64 @@ function DepositModal({
                   publishableKey
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: "uf-pb-4 uf-space-y-3", children: isCountryLoading || isAddressValidationLoading || tokensLoading || walletsLoading || !projectConfig ? /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(import_jsx_runtime66.Fragment, { children: [
-                /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(SkeletonButton, { variant: "with-icons" }),
-                /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(SkeletonButton, { variant: "with-icons" }),
-                !hideDepositTracker && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(SkeletonButton, {})
-              ] }) : countryError ? (
-                /* Error state - couldn't verify location */
-                /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("div", { className: "uf-flex uf-flex-col uf-items-center uf-justify-center uf-py-8 uf-px-4 uf-text-center", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: "uf-w-16 uf-h-16 uf-rounded-full uf-bg-muted uf-flex uf-items-center uf-justify-center uf-mb-4", children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(TriangleAlert, { className: "uf-w-8 uf-h-8 uf-text-muted-foreground" }) }),
-                  /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("h3", { className: "uf-text-lg uf-font-semibold uf-text-foreground uf-mb-2", children: "Unable to Verify Location" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("p", { className: "uf-text-sm uf-text-muted-foreground uf-max-w-[280px]", children: "We couldn't verify your location. Please check your connection and try again." })
-                ] })
-              ) : !isAllowed ? (
-                /* Blocked country state (isAllowed is false or null without error) */
-                /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("div", { className: "uf-flex uf-flex-col uf-items-center uf-justify-center uf-py-8 uf-px-4 uf-text-center", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: "uf-w-16 uf-h-16 uf-rounded-full uf-bg-muted uf-flex uf-items-center uf-justify-center uf-mb-4", children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(MapPinOff, { className: "uf-w-8 uf-h-8 uf-text-muted-foreground" }) }),
-                  /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("h3", { className: "uf-text-lg uf-font-semibold uf-text-foreground uf-mb-2", children: "No Tokens Available" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("p", { className: "uf-text-sm uf-text-muted-foreground uf-max-w-[280px]", children: "There are no supported tokens available from your current location." })
-                ] })
-              ) : isAddressValid === false ? (
-                /* Invalid recipient address state (e.g., Algorand not opted in) */
-                /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("div", { className: "uf-flex uf-flex-col uf-items-center uf-justify-center uf-py-8 uf-px-4 uf-text-center", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: "uf-w-16 uf-h-16 uf-rounded-full uf-bg-muted uf-flex uf-items-center uf-justify-center uf-mb-4", children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(TriangleAlert, { className: "uf-w-8 uf-h-8 uf-text-muted-foreground" }) }),
-                  /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("h3", { className: "uf-text-lg uf-font-semibold uf-text-foreground uf-mb-2", children: addressValidationMessages.unableToReceiveFunds }),
-                  /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("p", { className: "uf-text-sm uf-text-muted-foreground uf-max-w-[280px]", children: getAddressValidationErrorMessage(
-                    addressFailureCode,
-                    addressFailureMetadata
-                  ) })
-                ] })
-              ) : (
-                /* Normal deposit options */
-                /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(import_jsx_runtime66.Fragment, { children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
-                    TransferCryptoButton,
-                    {
-                      onClick: () => setView("transfer"),
-                      title: t6.transferCrypto.title,
-                      subtitle: t6.transferCrypto.subtitle,
-                      featuredTokens: projectConfig.transfer_crypto.networks
-                    }
-                  ),
-                  enableConnectWallet && !isMobileView && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
-                    BrowserWalletButton,
-                    {
-                      onClick: handleBrowserWalletClick,
-                      onConnectClick: handleWalletConnectClick,
-                      onDisconnect: handleWalletDisconnect,
-                      chainType: browserWalletChainType,
-                      publishableKey
-                    }
-                  ),
-                  /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
-                    DepositWithCardButton,
-                    {
-                      onClick: () => setView("card"),
-                      title: t6.depositWithCard.title,
-                      subtitle: t6.depositWithCard.subtitle,
-                      paymentNetworks: projectConfig.payment_networks.networks
-                    }
-                  ),
-                  showPayWithExchange && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
-                    PayWithExchangeButton,
-                    {
-                      onClick: () => setView("exchange"),
-                      title: t6.payWithExchange.title,
-                      subtitle: t6.payWithExchange.subtitle,
-                      exchanges,
-                      loading: exchangesLoading
-                    }
-                  ),
-                  !hideDepositTracker && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
-                    DepositTrackerButton,
-                    {
-                      onClick: () => {
-                        setAllExecutions(depositExecutions);
-                        setView("tracker");
-                      },
-                      title: "Deposit Tracker",
-                      subtitle: "Track your deposit progress",
-                      badge: depositExecutions.length > 0 ? depositExecutions.length : void 0
-                    }
-                  )
-                ] })
-              ) })
+              /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: "uf-pb-4 uf-space-y-3", children: depositPrerequisiteBody ?? /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(import_jsx_runtime66.Fragment, { children: [
+                /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+                  TransferCryptoButton,
+                  {
+                    onClick: () => setView("transfer"),
+                    title: t6.transferCrypto.title,
+                    subtitle: t6.transferCrypto.subtitle,
+                    featuredTokens: projectConfig?.transfer_crypto.networks
+                  }
+                ),
+                enableConnectWallet && !isMobileView && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+                  BrowserWalletButton,
+                  {
+                    onClick: handleBrowserWalletClick,
+                    onConnectClick: handleWalletConnectClick,
+                    onDisconnect: handleWalletDisconnect,
+                    chainType: browserWalletChainType,
+                    publishableKey
+                  }
+                ),
+                /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+                  DepositWithCardButton,
+                  {
+                    onClick: () => setView("card"),
+                    title: t6.depositWithCard.title,
+                    subtitle: t6.depositWithCard.subtitle,
+                    paymentNetworks: projectConfig?.payment_networks.networks
+                  }
+                ),
+                showPayWithExchange && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+                  PayWithExchangeButton,
+                  {
+                    onClick: () => setView("exchange"),
+                    title: t6.payWithExchange.title,
+                    subtitle: t6.payWithExchange.subtitle,
+                    exchanges,
+                    loading: exchangesLoading
+                  }
+                ),
+                !hideDepositTracker && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+                  DepositTrackerButton,
+                  {
+                    onClick: () => {
+                      setAllExecutions(depositExecutions);
+                      setView("tracker");
+                    },
+                    title: "Deposit Tracker",
+                    subtitle: "Track your deposit progress",
+                    badge: depositExecutions.length > 0 ? depositExecutions.length : void 0
+                  }
+                )
+              ] }) })
             ] }) : view === "transfer" ? /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(import_jsx_runtime66.Fragment, { children: [
               /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
                 DepositHeader,
                 {
                   title: t6.transferCrypto.title,
-                  showBack: true,
+                  showBack: showBackTransfer,
                   onBack: handleBack,
                   onClose: handleClose,
                   showBalance: showBalanceHeader,
@@ -58383,7 +58422,7 @@ function DepositModal({
                   publishableKey
                 }
               ),
-              transferInputVariant === "single_input" ? /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+              standaloneNeedsDepositPrereq && depositPrerequisiteBody !== null ? /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: "uf-pb-4 uf-space-y-3", children: depositPrerequisiteBody }) : transferInputVariant === "single_input" ? /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
                 TransferCryptoSingleInput,
                 {
                   userId,
@@ -58419,7 +58458,7 @@ function DepositModal({
                 DepositHeader,
                 {
                   title: selectedExecution ? "Deposit Details" : "Deposit Tracker",
-                  showBack: true,
+                  showBack: showBackTracker,
                   onBack: handleBack,
                   onClose: handleClose
                 }
@@ -58444,7 +58483,7 @@ function DepositModal({
                 DepositHeader,
                 {
                   title: cardView === "quotes" ? t6.quotes : t6.depositWithCard.title,
-                  showBack: true,
+                  showBack: showBackCard,
                   onBack: handleBack,
                   onClose: handleClose,
                   badge: cardView === "quotes" ? { count: quotesCount } : void 0,
@@ -58457,7 +58496,7 @@ function DepositModal({
                   publishableKey
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+              standaloneNeedsDepositPrereq && depositPrerequisiteBody !== null ? /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: "uf-pb-4 uf-space-y-3", children: depositPrerequisiteBody }) : /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
                 BuyWithCard,
                 {
                   userId,
@@ -58747,7 +58786,8 @@ function UnifoldProvider2({
             enablePayWithExchange: config?.enablePayWithExchange,
             onDepositSuccess: handleDepositSuccess,
             onDepositError: handleDepositError,
-            theme: resolvedTheme
+            theme: resolvedTheme,
+            initialScreen: depositConfig.initialScreen ?? config?.defaultInitialScreen
           }
         )
       ]

package/dist/index.mjs CHANGED Viewed

@@ -38698,18 +38698,18 @@ function composeContextScopes(...scopes) {
   createScope.scopeName = baseScope.scopeName;
   return createScope;
 }
-var useLayoutEffect22 = globalThis?.document ? React32.useLayoutEffect : () => {
+var useLayoutEffect23 = globalThis?.document ? React32.useLayoutEffect : () => {
 };
 var useReactId = React42[" useId ".trim().toString()] || (() => void 0);
 var count = 0;
 function useId13(deterministicId) {
   const [id, setId] = React42.useState(useReactId());
-  useLayoutEffect22(() => {
+  useLayoutEffect23(() => {
     if (!deterministicId) setId((reactId) => reactId ?? String(count++));
   }, [deterministicId]);
   return deterministicId || (id ? `radix-${id}` : "");
 }
-var useInsertionEffect = React52[" useInsertionEffect ".trim().toString()] || useLayoutEffect22;
+var useInsertionEffect = React52[" useInsertionEffect ".trim().toString()] || useLayoutEffect23;
 function useControllableState({
   prop,
   defaultProp,
@@ -39324,7 +39324,7 @@ var PORTAL_NAME = "Portal";
 var Portal = React12.forwardRef((props, forwardedRef) => {
   const { container: containerProp, ...portalProps } = props;
   const [mounted, setMounted] = React12.useState(false);
-  useLayoutEffect22(() => setMounted(true), []);
+  useLayoutEffect23(() => setMounted(true), []);
   const container = containerProp || mounted && globalThis?.document?.body;
   return container ? import_react_dom.default.createPortal(/* @__PURE__ */ (0, import_jsx_runtime9.jsx)(Primitive.div, { ...portalProps, ref: forwardedRef }), container) : null;
 });
@@ -39367,7 +39367,7 @@ function usePresence(present) {
     const currentAnimationName = getAnimationName(stylesRef.current);
     prevAnimationNameRef.current = state === "mounted" ? currentAnimationName : "none";
   }, [state]);
-  useLayoutEffect22(() => {
+  useLayoutEffect23(() => {
     const styles = stylesRef.current;
     const wasPresent = prevPresentRef.current;
     const hasPresentChanged = wasPresent !== present;
@@ -39389,7 +39389,7 @@ function usePresence(present) {
       prevPresentRef.current = present;
     }
   }, [present, send]);
-  useLayoutEffect22(() => {
+  useLayoutEffect23(() => {
     if (node) {
       let timeoutId;
       const ownerWindow = node.ownerDocument.defaultView ?? window;
@@ -45402,7 +45402,7 @@ Arrow.displayName = NAME;
 var Root2 = Arrow;
 function useSize(element) {
   const [size4, setSize] = React27.useState(void 0);
-  useLayoutEffect22(() => {
+  useLayoutEffect23(() => {
     if (element) {
       setSize({ width: element.offsetWidth, height: element.offsetHeight });
       const resizeObserver = new ResizeObserver((entries) => {
@@ -45539,7 +45539,7 @@ var PopperContent = React28.forwardRef(
     });
     const [placedSide, placedAlign] = getSideAndAlignFromPlacement(placement);
     const handlePlaced = useCallbackRef(onPlaced);
-    useLayoutEffect22(() => {
+    useLayoutEffect23(() => {
       if (isPositioned) {
         handlePlaced?.();
       }
@@ -45548,7 +45548,7 @@ var PopperContent = React28.forwardRef(
     const arrowY = middlewareData.arrow?.y;
     const cannotCenterArrow = middlewareData.arrow?.centerOffset !== 0;
     const [contentZIndex, setContentZIndex] = React28.useState();
-    useLayoutEffect22(() => {
+    useLayoutEffect23(() => {
       if (content) setContentZIndex(window.getComputedStyle(content).zIndex);
     }, [content]);
     return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
@@ -46479,7 +46479,7 @@ var SelectValue = React34.forwardRef(
     const { onValueNodeHasChildrenChange } = context;
     const hasChildren = children !== void 0;
     const composedRefs = useComposedRefs(forwardedRef, context.onValueNodeChange);
-    useLayoutEffect22(() => {
+    useLayoutEffect23(() => {
       onValueNodeHasChildrenChange(hasChildren);
     }, [onValueNodeHasChildrenChange, hasChildren]);
     return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
@@ -46512,7 +46512,7 @@ var SelectContent = React34.forwardRef(
   (props, forwardedRef) => {
     const context = useSelectContext(CONTENT_NAME4, props.__scopeSelect);
     const [fragment, setFragment] = React34.useState();
-    useLayoutEffect22(() => {
+    useLayoutEffect23(() => {
       setFragment(new DocumentFragment());
     }, []);
     if (!context.open) {
@@ -46874,9 +46874,9 @@ var SelectItemAlignedPosition = React34.forwardRef((props, forwardedRef) => {
     context.dir,
     onPlaced
   ]);
-  useLayoutEffect22(() => position(), [position]);
+  useLayoutEffect23(() => position(), [position]);
   const [contentZIndex, setContentZIndex] = React34.useState();
-  useLayoutEffect22(() => {
+  useLayoutEffect23(() => {
     if (content) setContentZIndex(window.getComputedStyle(content).zIndex);
   }, [content]);
   const handleScrollButtonChange = React34.useCallback(
@@ -47173,7 +47173,7 @@ var SelectItemText = React34.forwardRef(
       [itemContext.disabled, itemContext.value, textContent]
     );
     const { onNativeOptionAdd, onNativeOptionRemove } = nativeOptionsContext;
-    useLayoutEffect22(() => {
+    useLayoutEffect23(() => {
       onNativeOptionAdd(nativeOption);
       return () => onNativeOptionRemove(nativeOption);
     }, [onNativeOptionAdd, onNativeOptionRemove, nativeOption]);
@@ -47199,7 +47199,7 @@ var SelectScrollUpButton = React34.forwardRef((props, forwardedRef) => {
   const viewportContext = useSelectViewportContext(SCROLL_UP_BUTTON_NAME, props.__scopeSelect);
   const [canScrollUp, setCanScrollUp] = React34.useState(false);
   const composedRefs = useComposedRefs(forwardedRef, viewportContext.onScrollButtonChange);
-  useLayoutEffect22(() => {
+  useLayoutEffect23(() => {
     if (contentContext.viewport && contentContext.isPositioned) {
       let handleScroll22 = function() {
         const canScrollUp2 = viewport.scrollTop > 0;
@@ -47233,7 +47233,7 @@ var SelectScrollDownButton = React34.forwardRef((props, forwardedRef) => {
   const viewportContext = useSelectViewportContext(SCROLL_DOWN_BUTTON_NAME, props.__scopeSelect);
   const [canScrollDown, setCanScrollDown] = React34.useState(false);
   const composedRefs = useComposedRefs(forwardedRef, viewportContext.onScrollButtonChange);
-  useLayoutEffect22(() => {
+  useLayoutEffect23(() => {
     if (contentContext.viewport && contentContext.isPositioned) {
       let handleScroll22 = function() {
         const maxScroll = viewport.scrollHeight - viewport.clientHeight;
@@ -47276,7 +47276,7 @@ var SelectScrollButtonImpl = React34.forwardRef((props, forwardedRef) => {
   React34.useEffect(() => {
     return () => clearAutoScrollTimer();
   }, [clearAutoScrollTimer]);
-  useLayoutEffect22(() => {
+  useLayoutEffect23(() => {
     const activeItem = getItems().find((item) => item.ref.current === document.activeElement);
     activeItem?.ref.current?.scrollIntoView({ block: "nearest" });
   }, [getItems]);
@@ -58014,14 +58014,23 @@ function DepositModal({
   onDepositSuccess,
   onDepositError,
   theme = "dark",
-  hideOverlay = false
+  hideOverlay = false,
+  initialScreen = "main"
 }) {
   const { colors: colors2, fonts, components } = useTheme();
+  const effectiveInitialScreen = (0, import_react3.useMemo)(() => {
+    const s = initialScreen ?? "main";
+    if (s === "tracker" && hideDepositTracker) return "main";
+    return s;
+  }, [initialScreen, hideDepositTracker]);
   const [containerEl, setContainerEl] = (0, import_react3.useState)(null);
   const containerCallbackRef = (0, import_react3.useCallback)((el) => {
     setContainerEl(el);
   }, []);
-  const [view, setView] = (0, import_react3.useState)("main");
+  const [view, setView] = (0, import_react3.useState)(
+    effectiveInitialScreen
+  );
+  const resetViewTimeoutRef = (0, import_react3.useRef)(null);
   const [cardView, setCardView] = (0, import_react3.useState)(
     "amount"
   );
@@ -58141,6 +58150,43 @@ function DepositModal({
     const template = errors[code] ?? addressValidationMessages.defaultError;
     return interpolate(template, metadata);
   };
+  const openingScreen = effectiveInitialScreen;
+  const sessionOpenedFromMenu = openingScreen === "main";
+  const standaloneNeedsDepositPrereq = openingScreen !== "main" && (view === "transfer" || view === "card");
+  let depositPrerequisiteBody;
+  if (isCountryLoading || isAddressValidationLoading || tokensLoading || walletsLoading || !projectConfig) {
+    depositPrerequisiteBody = standaloneNeedsDepositPrereq ? /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(SkeletonButton, { variant: "with-icons" }) : /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(import_jsx_runtime66.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(SkeletonButton, { variant: "with-icons" }),
+      /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(SkeletonButton, { variant: "with-icons" }),
+      !hideDepositTracker && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(SkeletonButton, {})
+    ] });
+  } else if (countryError) {
+    depositPrerequisiteBody = /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("div", { className: "uf-flex uf-flex-col uf-items-center uf-justify-center uf-py-8 uf-px-4 uf-text-center", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: "uf-w-16 uf-h-16 uf-rounded-full uf-bg-muted uf-flex uf-items-center uf-justify-center uf-mb-4", children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(TriangleAlert, { className: "uf-w-8 uf-h-8 uf-text-muted-foreground" }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("h3", { className: "uf-text-lg uf-font-semibold uf-text-foreground uf-mb-2", children: "Unable to Verify Location" }),
+      /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("p", { className: "uf-text-sm uf-text-muted-foreground uf-max-w-[280px]", children: "We couldn't verify your location. Please check your connection and try again." })
+    ] });
+  } else if (!isAllowed) {
+    depositPrerequisiteBody = /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("div", { className: "uf-flex uf-flex-col uf-items-center uf-justify-center uf-py-8 uf-px-4 uf-text-center", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: "uf-w-16 uf-h-16 uf-rounded-full uf-bg-muted uf-flex uf-items-center uf-justify-center uf-mb-4", children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(MapPinOff, { className: "uf-w-8 uf-h-8 uf-text-muted-foreground" }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("h3", { className: "uf-text-lg uf-font-semibold uf-text-foreground uf-mb-2", children: "No Tokens Available" }),
+      /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("p", { className: "uf-text-sm uf-text-muted-foreground uf-max-w-[280px]", children: "There are no supported tokens available from your current location." })
+    ] });
+  } else if (isAddressValid === false) {
+    depositPrerequisiteBody = /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("div", { className: "uf-flex uf-flex-col uf-items-center uf-justify-center uf-py-8 uf-px-4 uf-text-center", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: "uf-w-16 uf-h-16 uf-rounded-full uf-bg-muted uf-flex uf-items-center uf-justify-center uf-mb-4", children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(TriangleAlert, { className: "uf-w-8 uf-h-8 uf-text-muted-foreground" }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("h3", { className: "uf-text-lg uf-font-semibold uf-text-foreground uf-mb-2", children: addressValidationMessages.unableToReceiveFunds }),
+      /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("p", { className: "uf-text-sm uf-text-muted-foreground uf-max-w-[280px]", children: getAddressValidationErrorMessage(
+        addressFailureCode,
+        addressFailureMetadata
+      ) })
+    ] });
+  } else {
+    depositPrerequisiteBody = null;
+  }
+  const showBackTransfer = sessionOpenedFromMenu;
+  const showBackCard = cardView !== "amount" || sessionOpenedFromMenu;
+  const showBackTracker = selectedExecution !== null || sessionOpenedFromMenu;
   const themeClass = resolvedTheme === "dark" ? "uf-dark" : "";
   const handleWalletDisconnect = () => {
     setUserDisconnectedWallet(true);
@@ -58151,13 +58197,37 @@ function DepositModal({
   };
   const handleClose = () => {
     onOpenChange(false);
-    setTimeout(() => {
-      setView("main");
+    if (resetViewTimeoutRef.current) {
+      clearTimeout(resetViewTimeoutRef.current);
+    }
+    resetViewTimeoutRef.current = setTimeout(() => {
+      setView(effectiveInitialScreen);
       setCardView("amount");
       setExchangeView("providers");
       setBrowserWalletInfo(null);
+      resetViewTimeoutRef.current = null;
     }, 200);
   };
+  (0, import_react3.useLayoutEffect)(() => {
+    if (!open) return;
+    if (resetViewTimeoutRef.current) {
+      clearTimeout(resetViewTimeoutRef.current);
+      resetViewTimeoutRef.current = null;
+    }
+    setView(effectiveInitialScreen);
+    setCardView("amount");
+    setExchangeView("providers");
+    setBrowserWalletInfo(null);
+    setSelectedExecution(null);
+  }, [open, effectiveInitialScreen]);
+  (0, import_react3.useEffect)(
+    () => () => {
+      if (resetViewTimeoutRef.current) {
+        clearTimeout(resetViewTimeoutRef.current);
+      }
+    },
+    []
+  );
   const handleBack = () => {
     if (view === "card" && cardView === "quotes") {
       setCardView("amount");
@@ -58270,95 +58340,64 @@ function DepositModal({
                   publishableKey
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: "uf-pb-4 uf-space-y-3", children: isCountryLoading || isAddressValidationLoading || tokensLoading || walletsLoading || !projectConfig ? /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(import_jsx_runtime66.Fragment, { children: [
-                /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(SkeletonButton, { variant: "with-icons" }),
-                /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(SkeletonButton, { variant: "with-icons" }),
-                !hideDepositTracker && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(SkeletonButton, {})
-              ] }) : countryError ? (
-                /* Error state - couldn't verify location */
-                /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("div", { className: "uf-flex uf-flex-col uf-items-center uf-justify-center uf-py-8 uf-px-4 uf-text-center", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: "uf-w-16 uf-h-16 uf-rounded-full uf-bg-muted uf-flex uf-items-center uf-justify-center uf-mb-4", children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(TriangleAlert, { className: "uf-w-8 uf-h-8 uf-text-muted-foreground" }) }),
-                  /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("h3", { className: "uf-text-lg uf-font-semibold uf-text-foreground uf-mb-2", children: "Unable to Verify Location" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("p", { className: "uf-text-sm uf-text-muted-foreground uf-max-w-[280px]", children: "We couldn't verify your location. Please check your connection and try again." })
-                ] })
-              ) : !isAllowed ? (
-                /* Blocked country state (isAllowed is false or null without error) */
-                /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("div", { className: "uf-flex uf-flex-col uf-items-center uf-justify-center uf-py-8 uf-px-4 uf-text-center", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: "uf-w-16 uf-h-16 uf-rounded-full uf-bg-muted uf-flex uf-items-center uf-justify-center uf-mb-4", children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(MapPinOff, { className: "uf-w-8 uf-h-8 uf-text-muted-foreground" }) }),
-                  /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("h3", { className: "uf-text-lg uf-font-semibold uf-text-foreground uf-mb-2", children: "No Tokens Available" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("p", { className: "uf-text-sm uf-text-muted-foreground uf-max-w-[280px]", children: "There are no supported tokens available from your current location." })
-                ] })
-              ) : isAddressValid === false ? (
-                /* Invalid recipient address state (e.g., Algorand not opted in) */
-                /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("div", { className: "uf-flex uf-flex-col uf-items-center uf-justify-center uf-py-8 uf-px-4 uf-text-center", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: "uf-w-16 uf-h-16 uf-rounded-full uf-bg-muted uf-flex uf-items-center uf-justify-center uf-mb-4", children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(TriangleAlert, { className: "uf-w-8 uf-h-8 uf-text-muted-foreground" }) }),
-                  /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("h3", { className: "uf-text-lg uf-font-semibold uf-text-foreground uf-mb-2", children: addressValidationMessages.unableToReceiveFunds }),
-                  /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("p", { className: "uf-text-sm uf-text-muted-foreground uf-max-w-[280px]", children: getAddressValidationErrorMessage(
-                    addressFailureCode,
-                    addressFailureMetadata
-                  ) })
-                ] })
-              ) : (
-                /* Normal deposit options */
-                /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(import_jsx_runtime66.Fragment, { children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
-                    TransferCryptoButton,
-                    {
-                      onClick: () => setView("transfer"),
-                      title: t6.transferCrypto.title,
-                      subtitle: t6.transferCrypto.subtitle,
-                      featuredTokens: projectConfig.transfer_crypto.networks
-                    }
-                  ),
-                  enableConnectWallet && !isMobileView && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
-                    BrowserWalletButton,
-                    {
-                      onClick: handleBrowserWalletClick,
-                      onConnectClick: handleWalletConnectClick,
-                      onDisconnect: handleWalletDisconnect,
-                      chainType: browserWalletChainType,
-                      publishableKey
-                    }
-                  ),
-                  /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
-                    DepositWithCardButton,
-                    {
-                      onClick: () => setView("card"),
-                      title: t6.depositWithCard.title,
-                      subtitle: t6.depositWithCard.subtitle,
-                      paymentNetworks: projectConfig.payment_networks.networks
-                    }
-                  ),
-                  showPayWithExchange && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
-                    PayWithExchangeButton,
-                    {
-                      onClick: () => setView("exchange"),
-                      title: t6.payWithExchange.title,
-                      subtitle: t6.payWithExchange.subtitle,
-                      exchanges,
-                      loading: exchangesLoading
-                    }
-                  ),
-                  !hideDepositTracker && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
-                    DepositTrackerButton,
-                    {
-                      onClick: () => {
-                        setAllExecutions(depositExecutions);
-                        setView("tracker");
-                      },
-                      title: "Deposit Tracker",
-                      subtitle: "Track your deposit progress",
-                      badge: depositExecutions.length > 0 ? depositExecutions.length : void 0
-                    }
-                  )
-                ] })
-              ) })
+              /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: "uf-pb-4 uf-space-y-3", children: depositPrerequisiteBody ?? /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(import_jsx_runtime66.Fragment, { children: [
+                /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+                  TransferCryptoButton,
+                  {
+                    onClick: () => setView("transfer"),
+                    title: t6.transferCrypto.title,
+                    subtitle: t6.transferCrypto.subtitle,
+                    featuredTokens: projectConfig?.transfer_crypto.networks
+                  }
+                ),
+                enableConnectWallet && !isMobileView && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+                  BrowserWalletButton,
+                  {
+                    onClick: handleBrowserWalletClick,
+                    onConnectClick: handleWalletConnectClick,
+                    onDisconnect: handleWalletDisconnect,
+                    chainType: browserWalletChainType,
+                    publishableKey
+                  }
+                ),
+                /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+                  DepositWithCardButton,
+                  {
+                    onClick: () => setView("card"),
+                    title: t6.depositWithCard.title,
+                    subtitle: t6.depositWithCard.subtitle,
+                    paymentNetworks: projectConfig?.payment_networks.networks
+                  }
+                ),
+                showPayWithExchange && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+                  PayWithExchangeButton,
+                  {
+                    onClick: () => setView("exchange"),
+                    title: t6.payWithExchange.title,
+                    subtitle: t6.payWithExchange.subtitle,
+                    exchanges,
+                    loading: exchangesLoading
+                  }
+                ),
+                !hideDepositTracker && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+                  DepositTrackerButton,
+                  {
+                    onClick: () => {
+                      setAllExecutions(depositExecutions);
+                      setView("tracker");
+                    },
+                    title: "Deposit Tracker",
+                    subtitle: "Track your deposit progress",
+                    badge: depositExecutions.length > 0 ? depositExecutions.length : void 0
+                  }
+                )
+              ] }) })
             ] }) : view === "transfer" ? /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(import_jsx_runtime66.Fragment, { children: [
               /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
                 DepositHeader,
                 {
                   title: t6.transferCrypto.title,
-                  showBack: true,
+                  showBack: showBackTransfer,
                   onBack: handleBack,
                   onClose: handleClose,
                   showBalance: showBalanceHeader,
@@ -58370,7 +58409,7 @@ function DepositModal({
                   publishableKey
                 }
               ),
-              transferInputVariant === "single_input" ? /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+              standaloneNeedsDepositPrereq && depositPrerequisiteBody !== null ? /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: "uf-pb-4 uf-space-y-3", children: depositPrerequisiteBody }) : transferInputVariant === "single_input" ? /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
                 TransferCryptoSingleInput,
                 {
                   userId,
@@ -58406,7 +58445,7 @@ function DepositModal({
                 DepositHeader,
                 {
                   title: selectedExecution ? "Deposit Details" : "Deposit Tracker",
-                  showBack: true,
+                  showBack: showBackTracker,
                   onBack: handleBack,
                   onClose: handleClose
                 }
@@ -58431,7 +58470,7 @@ function DepositModal({
                 DepositHeader,
                 {
                   title: cardView === "quotes" ? t6.quotes : t6.depositWithCard.title,
-                  showBack: true,
+                  showBack: showBackCard,
                   onBack: handleBack,
                   onClose: handleClose,
                   badge: cardView === "quotes" ? { count: quotesCount } : void 0,
@@ -58444,7 +58483,7 @@ function DepositModal({
                   publishableKey
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+              standaloneNeedsDepositPrereq && depositPrerequisiteBody !== null ? /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: "uf-pb-4 uf-space-y-3", children: depositPrerequisiteBody }) : /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
                 BuyWithCard,
                 {
                   userId,
@@ -58734,7 +58773,8 @@ function UnifoldProvider2({
             enablePayWithExchange: config?.enablePayWithExchange,
             onDepositSuccess: handleDepositSuccess,
             onDepositError: handleDepositError,
-            theme: resolvedTheme
+            theme: resolvedTheme,
+            initialScreen: depositConfig.initialScreen ?? config?.defaultInitialScreen
           }
         )
       ]

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@unifold/ui-web",
-  "version": "0.1.35",
+  "version": "0.1.36",
   "description": "Unifold UI Web - Framework-agnostic deposit widget",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",
@@ -27,10 +27,10 @@
     "@types/react-dom": "^19.0.0",
     "tsup": "^8.0.0",
     "typescript": "^5.0.0",
-    "@unifold/connect-react": "0.1.35",
-    "@unifold/ui-react": "0.1.35",
-    "@unifold/react-provider": "0.1.35",
-    "@unifold/core": "0.1.35"
+    "@unifold/connect-react": "0.1.36",
+    "@unifold/core": "0.1.36",
+    "@unifold/ui-react": "0.1.36",
+    "@unifold/react-provider": "0.1.36"
   },
   "keywords": [
     "unifold",