@unifold/connect-react 0.1.68-beta.2 → 0.1.68

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.
package/dist/index.mjs CHANGED
@@ -8042,14 +8042,13 @@ import { jsx as jsx43, jsxs as jsxs40 } from "react/jsx-runtime";
8042
8042
  import { useState as useState282, useEffect as useEffect232, useRef as useRef72, useCallback as useCallback32 } from "react";
8043
8043
  import { Fragment as Fragment62, jsx as jsx44, jsxs as jsxs41 } from "react/jsx-runtime";
8044
8044
  import { useState as useState30, useEffect as useEffect252, useCallback as useCallback52, useMemo as useMemo72, useRef as useRef92 } from "react";
8045
- import { useQuery as useQuery8 } from "@tanstack/react-query";
8045
+ import { useQuery as useQuery8, keepPreviousData } from "@tanstack/react-query";
8046
8046
  import { useQuery as useQuery9 } from "@tanstack/react-query";
8047
8047
  import { useQuery as useQuery10 } from "@tanstack/react-query";
8048
8048
  import { Fragment as Fragment72, jsx as jsx45, jsxs as jsxs422 } from "react/jsx-runtime";
8049
8049
  import { useQuery as useQuery11 } from "@tanstack/react-query";
8050
8050
  import { useQuery as useQuery12 } from "@tanstack/react-query";
8051
8051
  import { useQuery as useQuery13 } from "@tanstack/react-query";
8052
- import { useQuery as useQuery14 } from "@tanstack/react-query";
8053
8052
  import { useState as useState36, useEffect as useEffect302, useMemo as useMemo102 } from "react";
8054
8053
  import { useEffect as useEffect272, useState as useState31 } from "react";
8055
8054
  import * as React312 from "react";
@@ -12800,7 +12799,7 @@ var Content22 = TooltipContent;
12800
12799
 
12801
12800
  // ../ui-react/dist/index.mjs
12802
12801
  import { jsx as jsx522 } from "react/jsx-runtime";
12803
- import { useQuery as useQuery15 } from "@tanstack/react-query";
12802
+ import { useQuery as useQuery14 } from "@tanstack/react-query";
12804
12803
  import { jsx as jsx53, jsxs as jsxs48 } from "react/jsx-runtime";
12805
12804
  import { Fragment as Fragment10, jsx as jsx54, jsxs as jsxs49 } from "react/jsx-runtime";
12806
12805
  import { useState as useState37, useEffect as useEffect312, useMemo as useMemo112 } from "react";
@@ -14042,8 +14041,8 @@ var Separator = SelectSeparator;
14042
14041
  import { jsx as jsx55, jsxs as jsxs50 } from "react/jsx-runtime";
14043
14042
  import { jsx as jsx56, jsxs as jsxs51 } from "react/jsx-runtime";
14044
14043
  import * as React342 from "react";
14044
+ import { useQuery as useQuery15 } from "@tanstack/react-query";
14045
14045
  import { useQuery as useQuery16 } from "@tanstack/react-query";
14046
- import { useQuery as useQuery17 } from "@tanstack/react-query";
14047
14046
  import { jsx as jsx57 } from "react/jsx-runtime";
14048
14047
  import { jsx as jsx58, jsxs as jsxs52 } from "react/jsx-runtime";
14049
14048
  import { Fragment as Fragment11, jsx as jsx59, jsxs as jsxs53 } from "react/jsx-runtime";
@@ -14053,19 +14052,19 @@ import { Fragment as Fragment13, jsx as jsx61, jsxs as jsxs55 } from "react/jsx-
14053
14052
  import { jsx as jsx622, jsxs as jsxs56 } from "react/jsx-runtime";
14054
14053
  import { Fragment as Fragment14, jsx as jsx63, jsxs as jsxs57 } from "react/jsx-runtime";
14055
14054
  import { useState as useState41, useEffect as useEffect35, useLayoutEffect as useLayoutEffect32, useCallback as useCallback92, useRef as useRef132, useMemo as useMemo142 } from "react";
14056
- import { useQuery as useQuery18 } from "@tanstack/react-query";
14055
+ import { useQuery as useQuery17 } from "@tanstack/react-query";
14057
14056
  import { Fragment as Fragment15, jsx as jsx64, jsxs as jsxs58 } from "react/jsx-runtime";
14058
14057
  import { useState as useState45, useEffect as useEffect39, useLayoutEffect as useLayoutEffect42, useCallback as useCallback112, useRef as useRef152 } from "react";
14058
+ import { useQuery as useQuery18 } from "@tanstack/react-query";
14059
14059
  import { useQuery as useQuery19 } from "@tanstack/react-query";
14060
14060
  import { useQuery as useQuery20 } from "@tanstack/react-query";
14061
14061
  import { useQuery as useQuery21 } from "@tanstack/react-query";
14062
- import { useQuery as useQuery222 } from "@tanstack/react-query";
14063
14062
  import { useState as useState42, useEffect as useEffect36, useRef as useRef142 } from "react";
14064
14063
  import { jsx as jsx65, jsxs as jsxs59 } from "react/jsx-runtime";
14065
14064
  import { useState as useState43, useCallback as useCallback102, useMemo as useMemo16, useEffect as useEffect37 } from "react";
14066
- import { useQuery as useQuery23 } from "@tanstack/react-query";
14065
+ import { useQuery as useQuery222 } from "@tanstack/react-query";
14067
14066
  import { useMemo as useMemo15 } from "react";
14068
- import { useQuery as useQuery24 } from "@tanstack/react-query";
14067
+ import { useQuery as useQuery23 } from "@tanstack/react-query";
14069
14068
  import { Fragment as Fragment16, jsx as jsx66, jsxs as jsxs60 } from "react/jsx-runtime";
14070
14069
  import { jsx as jsx67, jsxs as jsxs61 } from "react/jsx-runtime";
14071
14070
  import { useState as useState44, useEffect as useEffect38 } from "react";
@@ -14502,6 +14501,7 @@ var DialogContent2 = React36.forwardRef(({ className, style, children, omitOverl
14502
14501
  className: cn(
14503
14502
  portalContainer ? "uf-absolute" : "uf-fixed",
14504
14503
  "uf-bottom-0 uf-left-0 uf-right-0 uf-top-0 uf-z-50 uf-grid uf-w-full uf-max-w-full uf-h-full",
14504
+ "focus:uf-outline-none focus-visible:uf-outline-none",
14505
14505
  !portalContainer && "sm:uf-left-[50%] sm:uf-top-[50%] sm:uf-bottom-auto sm:uf-right-auto sm:uf-translate-x-[-50%] sm:uf-translate-y-[-50%] sm:uf-h-auto",
14506
14506
  "uf-border uf-bg-background",
14507
14507
  omitOverlayEmbed ? "uf-gap-0 uf-p-0" : "uf-gap-4 uf-p-6 uf-shadow-lg uf-duration-200",
@@ -14517,6 +14517,14 @@ var DialogContent2 = React36.forwardRef(({ className, style, children, omitOverl
14517
14517
  ),
14518
14518
  style: {
14519
14519
  "--uf-container-radius": `${components.container.borderRadius}px`,
14520
+ // Radix traps focus and, when the focused control unmounts during an
14521
+ // in-modal screen transition, moves focus onto this container. Modern
14522
+ // browsers paint the default focus ring via `:focus-visible`, which
14523
+ // flashes a highlight around the whole modal until focus settles on
14524
+ // the next screen. Suppress it inline so it works regardless of the
14525
+ // Tailwind build (the container is a programmatic focus target, not an
14526
+ // interactive control, so it should never show a focus ring).
14527
+ outline: "none",
14520
14528
  ...portalContainer ? { display: "flex", flexDirection: "column" } : {},
14521
14529
  ...style
14522
14530
  },
@@ -26633,10 +26641,16 @@ function PayWithStripeLink({
26633
26641
  return /* @__PURE__ */ jsxs41(
26634
26642
  "div",
26635
26643
  {
26636
- className: "uf-flex uf-flex-col uf-py-4 uf-overflow-y-auto uf-max-h-[70vh]",
26644
+ className: "uf-flex uf-flex-col uf-py-4 uf-overflow-y-auto uf-overflow-x-hidden uf-max-h-[70vh]",
26637
26645
  style: { backgroundColor: colors2.background },
26638
26646
  children: [
26639
- /* @__PURE__ */ jsx44("div", { ref: paymentMountRef, className: "uf-w-full uf-flex-1 uf-overflow-y-auto" }),
26647
+ /* @__PURE__ */ jsx44(
26648
+ "div",
26649
+ {
26650
+ ref: paymentMountRef,
26651
+ className: "uf-w-full uf-flex-1 uf-overflow-y-auto uf-overflow-x-hidden"
26652
+ }
26653
+ ),
26640
26654
  !stripePaymentUIReady && /* @__PURE__ */ jsx44("div", { className: "uf-flex uf-items-center uf-justify-center uf-py-8", children: /* @__PURE__ */ jsx44(LoaderCircle, { className: "uf-w-8 uf-h-8 uf-animate-spin", style: { color: colors2.primary } }) }),
26641
26655
  error && /* @__PURE__ */ jsx44(
26642
26656
  "div",
@@ -26654,7 +26668,7 @@ function PayWithStripeLink({
26654
26668
  return /* @__PURE__ */ jsxs41(
26655
26669
  "div",
26656
26670
  {
26657
- className: "uf-flex uf-flex-col uf-py-4 uf-overflow-y-auto uf-max-h-[70vh]",
26671
+ className: "uf-flex uf-flex-col uf-py-4 uf-overflow-y-auto uf-overflow-x-hidden uf-max-h-[70vh]",
26658
26672
  style: { backgroundColor: colors2.background },
26659
26673
  children: [
26660
26674
  displayPaymentTokens.length === 0 && !loading && /* @__PURE__ */ jsx44("div", { className: "uf-px-1 uf-mb-3 uf-text-center", children: /* @__PURE__ */ jsx44(
@@ -27764,17 +27778,30 @@ function PayWithStripeLink({
27764
27778
  }
27765
27779
  function useProjectConfig({
27766
27780
  publishableKey,
27767
- enabled = true
27781
+ enabled = true,
27782
+ countryCode,
27783
+ subdivisionCode
27768
27784
  }) {
27769
- const { data: projectConfig, isLoading } = useQuery8({
27770
- queryKey: ["unifold", "projectConfig", publishableKey],
27771
- queryFn: () => getProjectConfig(publishableKey),
27785
+ const {
27786
+ data: projectConfig,
27787
+ isLoading,
27788
+ error
27789
+ } = useQuery8({
27790
+ // Country is part of the key so a region change refetches the region-aware
27791
+ // config. Omitted when undefined so callers that don't pass a country keep
27792
+ // sharing the base cache entry.
27793
+ queryKey: countryCode ? ["unifold", "projectConfig", publishableKey, countryCode, subdivisionCode ?? null] : ["unifold", "projectConfig", publishableKey],
27794
+ queryFn: () => getProjectConfig(publishableKey, countryCode ? { countryCode, subdivisionCode } : void 0),
27772
27795
  enabled,
27796
+ // Keep the previous (e.g. no-country) config visible while the region-aware
27797
+ // config refetches after the country resolves, so unrelated config-driven
27798
+ // UI doesn't flash back to defaults.
27799
+ placeholderData: keepPreviousData,
27773
27800
  staleTime: 1e3 * 60 * 30,
27774
27801
  refetchOnMount: true,
27775
27802
  refetchOnWindowFocus: true
27776
27803
  });
27777
- return { projectConfig, isLoading };
27804
+ return { projectConfig, isLoading, error: error ?? null };
27778
27805
  }
27779
27806
  function useSupportedDepositTokens(publishableKey, options) {
27780
27807
  const hasDestination = options?.destination_token_address && options?.destination_chain_id && options?.destination_chain_type;
@@ -29813,44 +29840,28 @@ function useApplePayProviders({
29813
29840
  return { providers, isLoading };
29814
29841
  }
29815
29842
  function useAllowedCountry(publishableKey) {
29843
+ const { userIpInfo, isLoading: isIpLoading, error: ipError } = useUserIp2();
29816
29844
  const {
29817
- data: ipData,
29818
- isLoading: isIpLoading,
29819
- error: ipError
29820
- } = useQuery13({
29821
- queryKey: ["unifold", "ipAddress"],
29822
- queryFn: () => getIpAddress(),
29823
- refetchOnMount: false,
29824
- refetchOnReconnect: true,
29825
- refetchOnWindowFocus: false,
29826
- staleTime: 1e3 * 60 * 60,
29827
- // 1 hour
29828
- gcTime: 1e3 * 60 * 60 * 24
29829
- // 24 hours
29830
- });
29831
- const {
29832
- data: configData,
29845
+ projectConfig,
29833
29846
  isLoading: isConfigLoading,
29834
29847
  error: configError
29835
- } = useQuery13({
29836
- queryKey: ["unifold", "projectConfig", publishableKey],
29837
- queryFn: () => getProjectConfig(publishableKey),
29838
- refetchOnMount: false,
29839
- refetchOnReconnect: true,
29840
- refetchOnWindowFocus: false,
29841
- staleTime: 1e3 * 60 * 5,
29842
- // 5 minutes
29843
- gcTime: 1e3 * 60 * 60
29844
- // 1 hour
29848
+ } = useProjectConfig({
29849
+ publishableKey,
29850
+ // Wait for the IP so we issue a single country-aware config request rather
29851
+ // than a country-less fetch followed by a country-aware refetch. Shares the
29852
+ // query key with DepositModal's useProjectConfig, so they dedupe.
29853
+ enabled: !isIpLoading,
29854
+ countryCode: userIpInfo?.alpha2,
29855
+ subdivisionCode: userIpInfo?.subdivisionCode ?? void 0
29845
29856
  });
29846
29857
  const isLoading = isIpLoading || isConfigLoading;
29847
29858
  const error = ipError || configError || null;
29859
+ const userSubdivision = userIpInfo?.subdivisionCode || userIpInfo?.state || "";
29848
29860
  let isAllowed = null;
29849
- if (ipData && configData) {
29850
- const blockedCodes = configData.blocked_country_codes || [];
29851
- const blockedSubdivisions = configData.blocked_country_subdivisions || [];
29852
- const userCountryUpper = ipData.alpha2.toUpperCase();
29853
- const userSubdivision = ipData.subdivision_code || ipData.state || "";
29861
+ if (userIpInfo && projectConfig) {
29862
+ const blockedCodes = projectConfig.blocked_country_codes || [];
29863
+ const blockedSubdivisions = projectConfig.blocked_country_subdivisions || [];
29864
+ const userCountryUpper = userIpInfo.alpha2.toUpperCase();
29854
29865
  const userSubdivisionUpper = userSubdivision.toUpperCase();
29855
29866
  const isCountryBlocked = blockedCodes.some((code) => code.toUpperCase() === userCountryUpper);
29856
29867
  const isSubdivisionBlocked = blockedSubdivisions.some((entry) => {
@@ -29859,12 +29870,11 @@ function useAllowedCountry(publishableKey) {
29859
29870
  });
29860
29871
  isAllowed = !isCountryBlocked && !isSubdivisionBlocked;
29861
29872
  }
29862
- const subdivisionCode = ipData?.subdivision_code || ipData?.state || "" || null;
29863
29873
  return {
29864
29874
  isAllowed,
29865
- alpha2: ipData?.alpha2 ?? null,
29866
- country: ipData?.country ?? null,
29867
- subdivisionCode,
29875
+ alpha2: userIpInfo?.alpha2 ?? null,
29876
+ country: userIpInfo?.country ?? null,
29877
+ subdivisionCode: userSubdivision || null,
29868
29878
  isLoading,
29869
29879
  error
29870
29880
  };
@@ -29879,7 +29889,7 @@ function useAddressValidation({
29879
29889
  refetchOnMount = false
29880
29890
  }) {
29881
29891
  const shouldValidate = enabled && !!recipientAddress && !!destinationChainType && !!destinationChainId && !!destinationTokenAddress;
29882
- const { data, isLoading, error } = useQuery14({
29892
+ const { data, isLoading, error } = useQuery13({
29883
29893
  queryKey: [
29884
29894
  "unifold",
29885
29895
  "addressValidation",
@@ -31181,7 +31191,7 @@ function useHypercoreActivation(params) {
31181
31191
  const recipient = recipientAddress?.trim() ?? "";
31182
31192
  const source = sourceAddress?.trim() ?? "";
31183
31193
  const hasAddresses = !!recipient && !!source;
31184
- const { data, isLoading } = useQuery15({
31194
+ const { data, isLoading } = useQuery14({
31185
31195
  queryKey: ["unifold", "hypercoreActivation", source, recipient, publishableKey],
31186
31196
  queryFn: () => checkHypercoreActivation(
31187
31197
  {
@@ -32679,7 +32689,7 @@ function useDepositQuote(params) {
32679
32689
  ...adjustForSlippage ? { adjust_for_slippage: true } : {},
32680
32690
  ...stablecoinParity ? { stablecoin_parity: true } : {}
32681
32691
  };
32682
- return useQuery16({
32692
+ return useQuery15({
32683
32693
  queryKey: [
32684
32694
  "unifold",
32685
32695
  "depositQuote",
@@ -32709,7 +32719,7 @@ function useExternalWallets({
32709
32719
  publishableKey,
32710
32720
  enabled = true
32711
32721
  }) {
32712
- const { data: wallets = [], isLoading } = useQuery17({
32722
+ const { data: wallets = [], isLoading } = useQuery16({
32713
32723
  queryKey: ["unifold", "external-wallets", publishableKey],
32714
32724
  queryFn: () => getExternalWallets(publishableKey).then((res) => res.data),
32715
32725
  enabled: enabled && !!publishableKey,
@@ -34814,116 +34824,131 @@ function WalletConnect({
34814
34824
  ] });
34815
34825
  }
34816
34826
  if (view === "select_wallet") {
34817
- return /* @__PURE__ */ jsxs56("div", { style: viewTransitionStyle, children: [
34818
- /* @__PURE__ */ jsx622(
34819
- DepositHeader,
34827
+ return (
34828
+ // Mobile: flex column that fills the full-height sheet so the wallet list
34829
+ // scrolls and the footer pins to the bottom. Desktop (sm:): content-sized.
34830
+ /* @__PURE__ */ jsxs56(
34831
+ "div",
34820
34832
  {
34821
- title: "Connect Wallet",
34822
- showBack: canGoBack,
34823
- onBack: handleBack,
34824
- onClose
34825
- }
34826
- ),
34827
- /* @__PURE__ */ jsxs56("div", { className: "uf-pb-4", children: [
34828
- /* @__PURE__ */ jsx622(
34829
- "p",
34830
- {
34831
- className: "uf-text-sm uf-text-center uf-pb-4",
34832
- style: { color: colors2.foregroundMuted, fontFamily: fonts.regular },
34833
- children: isMobile ? "Open this page in your wallet's app to connect" : "Select a wallet to connect"
34834
- }
34835
- ),
34836
- /* @__PURE__ */ jsx622("div", { className: "uf-space-y-2", style: { maxHeight: 330, overflowY: "auto" }, children: availableWallets.map((wallet) => {
34837
- const walletPlatformAllowed = !wallet.mobileBrowsePlatforms || wallet.mobileBrowsePlatforms.includes(getMobilePlatform() ?? "");
34838
- const showOpenInApp = isMobile && !wallet.isInstalled && wallet.supportsMobileBrowse !== false && walletPlatformAllowed;
34839
- const isPending = pendingMobileWallet?.id === wallet.id;
34840
- return /* @__PURE__ */ jsxs56(
34841
- "button",
34842
- {
34843
- onClick: () => void handleWalletClick(wallet),
34844
- disabled: isWalletConnecting || !!pendingMobileWallet,
34845
- className: "uf-w-full uf-transition-colors uf-p-3 uf-flex uf-items-center uf-justify-between hover:uf-opacity-90 disabled:uf-opacity-50",
34846
- style: {
34847
- backgroundColor: components.card.backgroundColor,
34848
- borderRadius: components.card.borderRadius,
34849
- border: `${components.card.borderWidth}px solid ${components.card.borderColor}`
34850
- },
34851
- children: [
34852
- /* @__PURE__ */ jsxs56("div", { className: "uf-flex uf-items-center uf-gap-3", children: [
34853
- WALLET_ICONS3[wallet.id] ? /* @__PURE__ */ jsx622(
34854
- WalletIconWithNetwork,
34855
- {
34856
- WalletIcon: WALLET_ICONS3[wallet.id],
34857
- networks: wallet.networks,
34858
- size: 40,
34859
- className: "uf-rounded-lg"
34860
- }
34861
- ) : /* @__PURE__ */ jsx622("div", { className: "uf-w-10 uf-h-10 uf-rounded-lg uf-bg-gray-500" }),
34862
- /* @__PURE__ */ jsxs56("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
34863
- /* @__PURE__ */ jsx622(
34864
- "div",
34865
- {
34866
- className: "uf-text-sm uf-font-medium",
34867
- style: { color: components.card.titleColor, fontFamily: fonts.medium },
34868
- children: wallet.name
34869
- }
34870
- ),
34871
- wallet.id === recentWalletId && /* @__PURE__ */ jsx622(
34872
- "span",
34873
- {
34874
- className: "uf-text-xs uf-px-2 uf-py-0.5 uf-rounded-full",
34875
- style: {
34876
- backgroundColor: colors2.primary + "20",
34877
- color: colors2.primary,
34878
- fontFamily: fonts.medium
34879
- },
34880
- children: "Last used"
34881
- }
34882
- )
34883
- ] })
34884
- ] }),
34885
- isPending ? /* @__PURE__ */ jsx622(
34886
- LoaderCircle,
34887
- {
34888
- className: "uf-w-4 uf-h-4 uf-animate-spin",
34889
- style: { color: colors2.primary }
34890
- }
34891
- ) : wallet.isInstalled ? /* @__PURE__ */ jsx622(
34892
- "span",
34833
+ style: viewTransitionStyle,
34834
+ className: "uf-flex uf-min-h-0 uf-flex-1 uf-flex-col sm:uf-block",
34835
+ children: [
34836
+ /* @__PURE__ */ jsx622(
34837
+ DepositHeader,
34838
+ {
34839
+ title: "Connect Wallet",
34840
+ showBack: canGoBack,
34841
+ onBack: handleBack,
34842
+ onClose
34843
+ }
34844
+ ),
34845
+ /* @__PURE__ */ jsxs56("div", { className: "uf-pb-4 uf-flex uf-min-h-0 uf-flex-1 uf-flex-col sm:uf-block", children: [
34846
+ /* @__PURE__ */ jsx622(
34847
+ "p",
34848
+ {
34849
+ className: "uf-text-sm uf-text-center uf-pb-4",
34850
+ style: { color: colors2.foregroundMuted, fontFamily: fonts.regular },
34851
+ children: isMobile ? "Open this page in your wallet's app to connect" : "Select a wallet to connect"
34852
+ }
34853
+ ),
34854
+ /* @__PURE__ */ jsx622("div", { className: "uf-space-y-2 uf-min-h-0 uf-flex-1 uf-overflow-y-auto sm:uf-flex-none sm:uf-max-h-[330px] [scrollbar-width:none] [&::-webkit-scrollbar]:uf-hidden", children: availableWallets.filter((wallet) => {
34855
+ if (!isMobile || wallet.isInstalled) return true;
34856
+ const platformAllowed = !wallet.mobileBrowsePlatforms || wallet.mobileBrowsePlatforms.includes(getMobilePlatform() ?? "");
34857
+ return wallet.supportsMobileBrowse !== false && platformAllowed;
34858
+ }).map((wallet) => {
34859
+ const walletPlatformAllowed = !wallet.mobileBrowsePlatforms || wallet.mobileBrowsePlatforms.includes(getMobilePlatform() ?? "");
34860
+ const showOpenInApp = isMobile && !wallet.isInstalled && wallet.supportsMobileBrowse !== false && walletPlatformAllowed;
34861
+ const isPending = pendingMobileWallet?.id === wallet.id;
34862
+ return /* @__PURE__ */ jsxs56(
34863
+ "button",
34893
34864
  {
34894
- className: "uf-text-xs uf-px-2 uf-py-1 uf-rounded-full",
34865
+ onClick: () => void handleWalletClick(wallet),
34866
+ disabled: isWalletConnecting || !!pendingMobileWallet,
34867
+ className: "uf-w-full uf-transition-colors uf-p-3 uf-flex uf-items-center uf-justify-between hover:uf-opacity-90 disabled:uf-opacity-50",
34895
34868
  style: {
34896
- backgroundColor: colors2.primary + "20",
34897
- color: colors2.primary,
34898
- fontFamily: fonts.medium
34869
+ backgroundColor: components.card.backgroundColor,
34870
+ borderRadius: components.card.borderRadius,
34871
+ border: `${components.card.borderWidth}px solid ${components.card.borderColor}`
34899
34872
  },
34900
- children: "Detected"
34901
- }
34902
- ) : /* @__PURE__ */ jsxs56("div", { className: "uf-flex uf-items-center uf-gap-1", children: [
34903
- /* @__PURE__ */ jsx622(
34904
- "span",
34905
- {
34906
- className: "uf-text-xs",
34907
- style: { color: colors2.foregroundMuted, fontFamily: fonts.regular },
34908
- children: showOpenInApp ? "Open" : "Install"
34909
- }
34910
- ),
34911
- /* @__PURE__ */ jsx622(
34912
- ExternalLink,
34913
- {
34914
- className: "uf-w-3 uf-h-3",
34915
- style: { color: colors2.foregroundMuted }
34916
- }
34917
- )
34918
- ] })
34919
- ]
34920
- },
34921
- wallet.id
34922
- );
34923
- }) }),
34924
- walletError && /* @__PURE__ */ jsx622("div", { className: "uf-text-center uf-text-sm uf-mt-4 uf-px-4", style: { color: "#ef4444" }, children: walletError })
34925
- ] })
34926
- ] });
34873
+ children: [
34874
+ /* @__PURE__ */ jsxs56("div", { className: "uf-flex uf-items-center uf-gap-3", children: [
34875
+ WALLET_ICONS3[wallet.id] ? /* @__PURE__ */ jsx622(
34876
+ WalletIconWithNetwork,
34877
+ {
34878
+ WalletIcon: WALLET_ICONS3[wallet.id],
34879
+ networks: wallet.networks,
34880
+ size: 40,
34881
+ className: "uf-rounded-lg"
34882
+ }
34883
+ ) : /* @__PURE__ */ jsx622("div", { className: "uf-w-10 uf-h-10 uf-rounded-lg uf-bg-gray-500" }),
34884
+ /* @__PURE__ */ jsxs56("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
34885
+ /* @__PURE__ */ jsx622(
34886
+ "div",
34887
+ {
34888
+ className: "uf-text-sm uf-font-medium",
34889
+ style: { color: components.card.titleColor, fontFamily: fonts.medium },
34890
+ children: wallet.name
34891
+ }
34892
+ ),
34893
+ wallet.id === recentWalletId && /* @__PURE__ */ jsx622(
34894
+ "span",
34895
+ {
34896
+ className: "uf-text-xs uf-px-2 uf-py-0.5 uf-rounded-full",
34897
+ style: {
34898
+ backgroundColor: colors2.primary + "20",
34899
+ color: colors2.primary,
34900
+ fontFamily: fonts.medium
34901
+ },
34902
+ children: "Last used"
34903
+ }
34904
+ )
34905
+ ] })
34906
+ ] }),
34907
+ isPending ? /* @__PURE__ */ jsx622(
34908
+ LoaderCircle,
34909
+ {
34910
+ className: "uf-w-4 uf-h-4 uf-animate-spin",
34911
+ style: { color: colors2.primary }
34912
+ }
34913
+ ) : wallet.isInstalled ? /* @__PURE__ */ jsx622(
34914
+ "span",
34915
+ {
34916
+ className: "uf-text-xs uf-px-2 uf-py-1 uf-rounded-full",
34917
+ style: {
34918
+ backgroundColor: colors2.primary + "20",
34919
+ color: colors2.primary,
34920
+ fontFamily: fonts.medium
34921
+ },
34922
+ children: "Detected"
34923
+ }
34924
+ ) : /* @__PURE__ */ jsxs56("div", { className: "uf-flex uf-items-center uf-gap-1", children: [
34925
+ /* @__PURE__ */ jsx622(
34926
+ "span",
34927
+ {
34928
+ className: "uf-text-xs",
34929
+ style: { color: colors2.foregroundMuted, fontFamily: fonts.regular },
34930
+ children: showOpenInApp ? "Open" : "Install"
34931
+ }
34932
+ ),
34933
+ /* @__PURE__ */ jsx622(
34934
+ ExternalLink,
34935
+ {
34936
+ className: "uf-w-3 uf-h-3",
34937
+ style: { color: colors2.foregroundMuted }
34938
+ }
34939
+ )
34940
+ ] })
34941
+ ]
34942
+ },
34943
+ wallet.id
34944
+ );
34945
+ }) }),
34946
+ walletError && /* @__PURE__ */ jsx622("div", { className: "uf-text-center uf-text-sm uf-mt-4 uf-px-4", style: { color: "#ef4444" }, children: walletError })
34947
+ ] })
34948
+ ]
34949
+ }
34950
+ )
34951
+ );
34927
34952
  }
34928
34953
  const preConnectAccent = selectedWalletDef ? getWalletBrandColor(selectedWalletDef.id, mode) : void 0;
34929
34954
  const preConnectFg = preConnectAccent ? getContrastingTextColor(preConnectAccent) : void 0;
@@ -35312,7 +35337,9 @@ function DepositModal({
35312
35337
  applePayTitle = "Pay with Apple Pay",
35313
35338
  applePaySubTitle = "Instant",
35314
35339
  enableBankTransfer,
35315
- enableStripeLink = false,
35340
+ // No default: left undefined so the backend `stripe_link.enabled` can govern
35341
+ // (via the `??` chain in showStripeLink) once a dashboard toggle exists.
35342
+ enableStripeLink,
35316
35343
  userEmail,
35317
35344
  hideDepositFlowInfo = false,
35318
35345
  hideDisplayDescription = false,
@@ -35393,14 +35420,18 @@ function DepositModal({
35393
35420
  const [allExecutions, setAllExecutions] = useState40([]);
35394
35421
  const [selectedExecution, setSelectedExecution] = useState40(null);
35395
35422
  const [depositExecutions, setDepositExecutions] = useState40([]);
35423
+ const { userIpInfo, isLoading: isLoadingIp } = useUserIp2();
35396
35424
  const { projectConfig } = useProjectConfig({
35397
35425
  publishableKey,
35398
- enabled: open
35426
+ enabled: open && !isLoadingIp,
35427
+ countryCode: userIpInfo?.alpha2,
35428
+ subdivisionCode: userIpInfo?.subdivisionCode ?? void 0
35399
35429
  });
35400
35430
  const showTransferCrypto = enableTransferCrypto ?? projectConfig?.transfer_crypto?.enabled ?? true;
35401
35431
  const showConnectWallet = enableConnectWallet ?? projectConfig?.connect_wallet?.enabled ?? true;
35402
35432
  const showPayWithExchange = enablePayWithExchange ?? projectConfig?.pay_with_exchange?.enabled ?? true;
35403
35433
  const showFiatOnramp = !projectConfig?.fiat_onramp?.is_hidden && (enableFiatOnramp ?? projectConfig?.fiat_onramp?.enabled ?? true);
35434
+ const showStripeLink = !projectConfig?.stripe_link?.is_hidden && (enableStripeLink ?? projectConfig?.stripe_link?.enabled ?? false);
35404
35435
  const showConnectExchange = enableConnectExchange ?? projectConfig?.connect_exchange?.enabled ?? true;
35405
35436
  const showCashApp = enableCashApp ?? projectConfig?.cash_app?.enabled ?? true;
35406
35437
  const showApplePay = enableApplePay ?? projectConfig?.apple_pay?.enabled ?? true;
@@ -35546,7 +35577,6 @@ function DepositModal({
35546
35577
  publishableKey,
35547
35578
  enabled: open && showPayWithExchange
35548
35579
  });
35549
- const { userIpInfo, isLoading: isLoadingIp } = useUserIp2();
35550
35580
  const { providers: bankTransferProviders, isLoading: bankTransferProvidersLoading } = useBankTransferProviders({
35551
35581
  publishableKey,
35552
35582
  enabled: open && !!userIpInfo?.alpha2,
@@ -35724,6 +35754,12 @@ function DepositModal({
35724
35754
  const [cashAppView, setCashAppView] = useState40("amount");
35725
35755
  const [stripeLinkStep, setStripeLinkStep] = useState40("amount");
35726
35756
  const stripeLinkBackRef = useRef122(null);
35757
+ useEffect34(() => {
35758
+ if (view === "stripe_link" && !showStripeLink && effectiveInitialScreen === "main") {
35759
+ setView("main");
35760
+ setStripeLinkStep("amount");
35761
+ }
35762
+ }, [view, showStripeLink, effectiveInitialScreen]);
35727
35763
  const [cashAppAmount, setCashAppAmount] = useState40("");
35728
35764
  const [applePayView, setApplePayView] = useState40("email_input");
35729
35765
  const applePayHandleRef = useRef122(null);
@@ -35948,7 +35984,7 @@ function DepositModal({
35948
35984
  },
35949
35985
  "cashapp"
35950
35986
  ) : null;
35951
- const stripeLinkMenuButton = enableStripeLink ? /* @__PURE__ */ jsx63(
35987
+ const stripeLinkMenuButton = showStripeLink ? /* @__PURE__ */ jsx63(
35952
35988
  StripeLinkButton,
35953
35989
  {
35954
35990
  onClick: () => setView("stripe_link"),
@@ -35996,11 +36032,13 @@ function DepositModal({
35996
36032
  connectExchangeMenuButton
35997
36033
  ].filter(Boolean);
35998
36034
  const cashMenuButtons = [
36035
+ // Stripe "Pay with Link" is intentionally listed first so it always sits
36036
+ // above "Deposit with Card".
36037
+ stripeLinkMenuButton,
35999
36038
  depositWithCardMenuButton,
36000
36039
  applePayMenuButton,
36001
36040
  cashAppMenuButton,
36002
- bankTransferMenuButton,
36003
- stripeLinkMenuButton
36041
+ bankTransferMenuButton
36004
36042
  ].filter(Boolean);
36005
36043
  const depositTabs = [
36006
36044
  { id: "crypto", label: "Use Crypto", icon: Bitcoin, buttons: cryptoMenuButtons },
@@ -36095,13 +36133,13 @@ function DepositModal({
36095
36133
  const stackedOptions = [
36096
36134
  transferCryptoMenuButton,
36097
36135
  connectWalletMenuButton,
36136
+ stripeLinkMenuButton,
36098
36137
  depositWithCardMenuButton,
36099
36138
  applePayMenuButton,
36100
36139
  payWithExchangeMenuButton,
36101
36140
  connectExchangeMenuButton,
36102
36141
  cashAppMenuButton,
36103
36142
  bankTransferMenuButton,
36104
- stripeLinkMenuButton,
36105
36143
  depositTrackerMenuButton
36106
36144
  ].filter(Boolean);
36107
36145
  return renderScrollableOptions(stackedOptions);
@@ -36117,410 +36155,452 @@ function DepositModal({
36117
36155
  {
36118
36156
  ref: hideOverlay ? containerCallbackRef : void 0,
36119
36157
  hideOverlay,
36120
- className: `sm:uf-max-w-[400px] uf-border-secondary uf-text-foreground uf-gap-0 [&>button]:uf-hidden ${hideOverlay ? `uf-p-6 uf-overflow-hidden ${themeClass}` : `uf-p-0 uf-overflow-visible ${view === "main" ? "!uf-top-auto !uf-h-auto !uf-max-h-[85vh] sm:!uf-max-h-none sm:!uf-top-[50%]" : "!uf-top-0 !uf-h-full sm:!uf-h-auto sm:!uf-top-[50%]"} ${themeClass}`}`,
36158
+ className: `sm:uf-max-w-[400px] uf-border-secondary uf-text-foreground uf-gap-0 [&>button]:uf-hidden ${hideOverlay ? `uf-p-6 uf-overflow-hidden ${themeClass}` : `uf-p-0 uf-overflow-visible ${view === "main" ? "!uf-top-auto !uf-h-auto !uf-max-h-[85vh] sm:!uf-max-h-none sm:!uf-top-[50%]" : "!uf-top-0 !uf-h-full sm:!uf-h-auto sm:!uf-top-[50%]"} ${// wallet_connect fills the full-height mobile sheet. DialogContent
36159
+ // is a grid, and its single auto row only *grows* to fill free
36160
+ // space (align-content: stretch) — it never shrinks below content,
36161
+ // so a long wallet list would balloon the row past the viewport and
36162
+ // push the footer off-screen instead of scrolling. Clamp the row to
36163
+ // the modal height with minmax(0,1fr) so the inner overflow-y-auto
36164
+ // list scrolls with the footer pinned. Reset to content-sized on
36165
+ // desktop (sm:) where the modal is auto-height and centered.
36166
+ view === "wallet_connect" ? "[grid-template-rows:minmax(0,1fr)] sm:[grid-template-rows:none]" : ""} ${themeClass}`}`,
36121
36167
  style: { backgroundColor: colors2.background },
36122
36168
  onPointerDownOutside: (e) => e.preventDefault(),
36123
36169
  onInteractOutside: (e) => e.preventDefault(),
36124
36170
  children: [
36125
36171
  /* @__PURE__ */ jsx63(DialogTitle2, { className: "uf-sr-only", children: modalTitle || "Deposit" }),
36126
- /* @__PURE__ */ jsx63(ThemeStyleInjector, { children: view === "main" ? /* @__PURE__ */ jsxs57("div", { className: "uf-flex uf-flex-col uf-min-h-0 uf-max-h-full", children: [
36127
- /* @__PURE__ */ jsx63("div", { className: "uf-flex-shrink-0", children: /* @__PURE__ */ jsx63(
36128
- DepositHeader,
36129
- {
36130
- title: modalTitle || "Deposit",
36131
- showClose: !hideOverlay,
36132
- onClose: handleClose,
36133
- showBalance: showBalanceHeader,
36134
- balanceAddress: recipientAddress,
36135
- balanceChainType: destinationChainType === "ethereum" || destinationChainType === "solana" || destinationChainType === "bitcoin" || destinationChainType === "n1" ? destinationChainType : void 0,
36136
- balanceChainId: destinationChainId,
36137
- balanceTokenAddress: destinationTokenAddress,
36138
- projectName: projectConfig?.project_name,
36139
- publishableKey
36140
- }
36141
- ) }),
36142
- renderMainMenuBody(),
36143
- /* @__PURE__ */ jsx63("div", { className: "uf-flex-shrink-0", children: depositPoweredByFooter })
36144
- ] }) : view === "transfer" ? /* @__PURE__ */ jsxs57(Fragment14, { children: [
36145
- /* @__PURE__ */ jsx63(
36146
- DepositHeader,
36147
- {
36148
- title: transferCryptoTitle,
36149
- showBack: showBackTransfer,
36150
- onBack: handleBack,
36151
- onClose: handleClose,
36152
- showBalance: showBalanceHeader,
36153
- balanceAddress: recipientAddress,
36154
- balanceChainType: destinationChainType === "ethereum" || destinationChainType === "solana" || destinationChainType === "bitcoin" || destinationChainType === "n1" ? destinationChainType : void 0,
36155
- balanceChainId: destinationChainId,
36156
- balanceTokenAddress: destinationTokenAddress,
36157
- projectName: projectConfig?.project_name,
36158
- publishableKey
36159
- }
36160
- ),
36161
- /* @__PURE__ */ jsxs57("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
36162
- standaloneNeedsDepositPrereq && depositPrerequisiteBody !== null ? /* @__PURE__ */ jsx63("div", { className: "uf-pb-4 uf-space-y-3", children: depositPrerequisiteBody }) : transferInputVariant === "single_input" ? /* @__PURE__ */ jsx63(
36163
- TransferCryptoSingleInput,
36164
- {
36165
- userId,
36166
- publishableKey,
36167
- recipientAddress,
36168
- destinationChainType,
36169
- destinationChainId,
36170
- destinationTokenAddress,
36171
- defaultSourceChainType,
36172
- defaultSourceChainId,
36173
- defaultSourceTokenAddress,
36174
- defaultSourceSymbol,
36175
- depositConfirmationMode,
36176
- onExecutionsChange: setDepositExecutions,
36177
- onDepositSuccess: onDepositSuccessFor("transfer"),
36178
- onDepositError: onDepositErrorFor("transfer"),
36179
- wallets
36180
- }
36181
- ) : /* @__PURE__ */ jsx63(
36182
- TransferCryptoDoubleInput,
36183
- {
36184
- userId,
36185
- publishableKey,
36186
- recipientAddress,
36187
- destinationChainType,
36188
- destinationChainId,
36189
- destinationTokenAddress,
36190
- defaultSourceChainType,
36191
- defaultSourceChainId,
36192
- defaultSourceTokenAddress,
36193
- defaultSourceSymbol,
36194
- depositConfirmationMode,
36195
- onExecutionsChange: setDepositExecutions,
36196
- onDepositSuccess: onDepositSuccessFor("transfer"),
36197
- onDepositError: onDepositErrorFor("transfer"),
36198
- wallets
36199
- }
36200
- ),
36201
- depositPoweredByFooter
36202
- ] })
36203
- ] }) : view === "tracker" ? /* @__PURE__ */ jsxs57(Fragment14, { children: [
36204
- /* @__PURE__ */ jsx63(
36205
- DepositHeader,
36206
- {
36207
- title: selectedExecution ? "Deposit Details" : depositTrackerTitle,
36208
- showBack: showBackTracker,
36209
- onBack: handleBack,
36210
- onClose: handleClose
36211
- }
36212
- ),
36213
- /* @__PURE__ */ jsxs57("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
36214
- /* @__PURE__ */ jsx63("div", { className: "uf-h-[460px] uf-overflow-y-auto [scrollbar-width:none] [&::-webkit-scrollbar]:uf-hidden", children: selectedExecution ? /* @__PURE__ */ jsx63(DepositDetailContent, { execution: selectedExecution }) : /* @__PURE__ */ jsx63("div", { className: "uf-space-y-2 uf-pb-8", children: allExecutions.length === 0 ? /* @__PURE__ */ jsx63("div", { className: "uf-py-8 uf-px-4 uf-text-center", children: /* @__PURE__ */ jsx63(
36215
- "div",
36216
- {
36217
- className: "uf-text-sm",
36218
- style: {
36219
- color: components.container.subtitleColor,
36220
- fontFamily: fonts.regular
36221
- },
36222
- children: "No deposits yet"
36223
- }
36224
- ) }) : allExecutions.map((execution) => /* @__PURE__ */ jsx63(
36225
- DepositExecutionItem,
36226
- {
36227
- execution,
36228
- onClick: () => setSelectedExecution(execution)
36229
- },
36230
- execution.id
36231
- )) }) }),
36232
- depositPoweredByFooter
36233
- ] })
36234
- ] }) : view === "card" ? /* @__PURE__ */ jsxs57(Fragment14, { children: [
36235
- /* @__PURE__ */ jsx63(
36236
- DepositHeader,
36237
- {
36238
- title: cardView === "quotes" ? t8.quotes : depositWithCardTitle,
36239
- showBack: showBackCard,
36240
- onBack: handleBack,
36241
- onClose: handleClose,
36242
- badge: cardView === "quotes" ? { count: quotesCount } : void 0,
36243
- showBalance: showBalanceHeader,
36244
- balanceAddress: recipientAddress,
36245
- balanceChainType: destinationChainType === "ethereum" || destinationChainType === "solana" || destinationChainType === "bitcoin" || destinationChainType === "n1" ? destinationChainType : void 0,
36246
- balanceChainId: destinationChainId,
36247
- balanceTokenAddress: destinationTokenAddress,
36248
- projectName: projectConfig?.project_name,
36249
- publishableKey
36250
- }
36251
- ),
36252
- /* @__PURE__ */ jsxs57("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
36253
- standaloneNeedsDepositPrereq && depositPrerequisiteBody !== null ? /* @__PURE__ */ jsx63("div", { className: "uf-pb-4 uf-space-y-3", children: depositPrerequisiteBody }) : !showFiatOnramp ? (
36254
- // Fiat on-ramp resolved hidden/disabled after a direct open
36255
- // (e.g. platform `is_hidden` for a Stripe Link-only project).
36256
- // Show a geo-restriction screen rather than the card UI so the
36257
- // hard-hide is honoured without a flash of "Pay with Card".
36258
- /* @__PURE__ */ jsx63(GeoRestrictionScreen, { methodName: "Card" })
36259
- ) : /* @__PURE__ */ jsx63(
36260
- BuyWithCard,
36261
- {
36262
- userId,
36263
- publishableKey,
36264
- view: cardView,
36265
- onViewChange: handleCardViewChange,
36266
- destinationTokenSymbol,
36267
- recipientAddress,
36268
- destinationChainType,
36269
- destinationChainId,
36270
- destinationTokenAddress,
36271
- onDepositSuccess: onDepositSuccessFor("card"),
36272
- onDepositError: onDepositErrorFor("card"),
36273
- onEvent,
36274
- themeClass,
36275
- wallets,
36276
- assetCdnUrl: projectConfig?.asset_cdn_url,
36277
- hideDepositFlowInfo,
36278
- hideDisplayDescription
36279
- }
36280
- ),
36281
- depositPoweredByFooter
36282
- ] })
36283
- ] }) : view === "exchange" ? /* @__PURE__ */ jsxs57(Fragment14, { children: [
36284
- /* @__PURE__ */ jsx63(
36285
- DepositHeader,
36286
- {
36287
- title: payWithExchangeTitle,
36288
- showBack: exchangeView === "pending" || sessionOpenedFromMenu,
36289
- onBack: handleBack,
36290
- onClose: handleClose
36291
- }
36292
- ),
36293
- /* @__PURE__ */ jsxs57("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
36294
- /* @__PURE__ */ jsx63(
36295
- PayWithExchange,
36296
- {
36297
- userId,
36298
- publishableKey,
36299
- exchanges,
36300
- view: exchangeView,
36301
- onViewChange: setExchangeView,
36302
- destinationTokenSymbol,
36303
- recipientAddress,
36304
- destinationChainType,
36305
- destinationChainId,
36306
- destinationTokenAddress,
36307
- onDepositSuccess: onDepositSuccessFor("pay_with_exchange"),
36308
- onDepositError: onDepositErrorFor("pay_with_exchange"),
36309
- wallets,
36310
- defaultToken: defaultToken ?? null
36311
- }
36312
- ),
36313
- depositPoweredByFooter
36314
- ] })
36315
- ] }) : view === "coinbase_connect" ? /* @__PURE__ */ jsxs57("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
36316
- /* @__PURE__ */ jsx63(
36317
- CoinbaseConnect,
36318
- {
36319
- publishableKey,
36320
- userId,
36321
- wallets,
36322
- recipientAddress,
36323
- destinationTokenAddress: destinationTokenAddress ?? "",
36324
- destinationChainId: destinationChainId ?? "",
36325
- destinationChainType: destinationChainType ?? "",
36326
- onDepositSuccess: onDepositSuccessFor("exchange_connect"),
36327
- onDepositError: onDepositErrorFor("exchange_connect"),
36328
- onTransferError: (error) => {
36329
- onDepositErrorFor("exchange_connect")?.({
36330
- message: error.message,
36331
- error
36332
- });
36333
- },
36334
- onBack: handleBack,
36335
- onClose: handleClose,
36336
- onDisconnect: handleExchangeDisconnect,
36337
- skipToHoldings: coinbaseSkipToHoldings,
36338
- canGoBack: sessionOpenedFromMenu,
36339
- onExecutionsChange: setDepositExecutions,
36340
- defaultSourceChainType,
36341
- defaultSourceChainId,
36342
- defaultSourceTokenAddress,
36343
- defaultSourceSymbol
36344
- }
36345
- ),
36346
- depositPoweredByFooter
36347
- ] }) : view === "wallet_connect" ? /* @__PURE__ */ jsxs57("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
36348
- /* @__PURE__ */ jsx63(
36349
- WalletConnect,
36350
- {
36351
- walletInfo: browserWalletInfo ?? void 0,
36352
- depositWallet: browserWalletInfo?.depositWallet ?? void 0,
36353
- wallets,
36354
- userId,
36355
- publishableKey,
36356
- assetCdnUrl: projectConfig?.asset_cdn_url,
36357
- projectName: projectConfig?.project_name,
36358
- onError: (error) => {
36359
- onDepositErrorFor("wallet_connect")?.({
36360
- message: error.message,
36361
- error
36362
- });
36363
- },
36364
- onDepositSuccess: onDepositSuccessFor("wallet_connect"),
36365
- onDepositError: onDepositErrorFor("wallet_connect"),
36366
- amountQuickSelect: browserWalletAmountQuickSelect,
36367
- onWalletDisconnect: handleWalletDisconnect,
36368
- onWalletConnected: (info, dw) => {
36369
- setBrowserWalletInfo({ ...info, depositWallet: dw });
36370
- setStoredWalletState(info.type);
36371
- setBrowserWalletChainType(dw.chain_type === "solana" ? "solana" : "ethereum");
36372
- },
36373
- onBack: handleBack,
36374
- onClose: handleClose,
36375
- defaultSourceChainType,
36376
- defaultSourceChainId,
36377
- defaultSourceTokenAddress,
36378
- defaultSourceSymbol,
36379
- canGoBack: sessionOpenedFromMenu,
36380
- depositWalletsLoading: walletsLoading
36381
- }
36382
- ),
36383
- depositPoweredByFooter
36384
- ] }) : view === "bank_transfer" ? /* @__PURE__ */ jsxs57(Fragment14, { children: [
36385
- /* @__PURE__ */ jsx63(
36386
- DepositHeader,
36387
- {
36388
- title: t8.bankTransfer.title,
36389
- showBack: bankTransferView !== "providers" || sessionOpenedFromMenu,
36390
- onBack: handleBack,
36391
- onClose: handleClose
36392
- }
36393
- ),
36394
- /* @__PURE__ */ jsxs57("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
36395
- bankTransferProvidersLoading ? /* @__PURE__ */ jsx63(SkeletonButton, { variant: "with-icons" }) : !hasEnabledBankTransferProvider ? /* @__PURE__ */ jsx63(GeoRestrictionScreen, { methodName: "Bank Transfer" }) : /* @__PURE__ */ jsx63(
36396
- BankTransfer,
36397
- {
36398
- userId,
36399
- publishableKey,
36400
- view: bankTransferView,
36401
- onViewChange: setBankTransferView,
36402
- recipientAddress,
36403
- destinationChainType,
36404
- destinationChainId,
36405
- destinationTokenAddress,
36406
- destinationTokenSymbol,
36407
- wallets,
36408
- defaultToken: defaultToken ?? null,
36409
- assetCdnUrl: projectConfig?.asset_cdn_url,
36410
- onEvent,
36411
- onDepositSuccess,
36412
- onDepositError
36413
- }
36414
- ),
36415
- depositPoweredByFooter
36416
- ] })
36417
- ] }) : view === "stripe_link" ? /* @__PURE__ */ jsxs57(Fragment14, { children: [
36418
- /* @__PURE__ */ jsx63(
36419
- DepositHeader,
36420
- {
36421
- title: "Deposit with Link",
36422
- showBack: stripeLinkStep !== "checkout" && stripeLinkStep !== "success",
36423
- onBack: handleBack,
36424
- showClose: stripeLinkStep !== "checkout",
36425
- onClose: handleClose
36426
- }
36427
- ),
36428
- /* @__PURE__ */ jsxs57("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
36429
- /* @__PURE__ */ jsx63(
36430
- PayWithStripeLink,
36431
- {
36432
- userId,
36433
- publishableKey,
36434
- recipientAddress,
36435
- destinationChainType,
36436
- destinationChainId,
36437
- destinationTokenAddress,
36438
- wallets,
36439
- email: userEmail,
36440
- iconUrl: projectConfig?.asset_cdn_url ? `${projectConfig.asset_cdn_url}/api/public/icons/onramps/svg/link.svg` : void 0,
36441
- step: stripeLinkStep,
36442
- onStepChange: setStripeLinkStep,
36443
- backHandlerRef: stripeLinkBackRef,
36444
- onDepositSuccess,
36445
- onDepositError
36446
- }
36447
- ),
36448
- depositPoweredByFooter
36449
- ] })
36450
- ] }) : view === "cashapp" ? /* @__PURE__ */ jsxs57(Fragment14, { children: [
36451
- /* @__PURE__ */ jsx63(
36452
- DepositHeader,
36453
- {
36454
- title: cashAppView !== "amount" && cashAppAmount ? `Pay $${cashAppAmount} via Cash App` : "Pay with Cash App",
36455
- showBack: cashAppView !== "amount" || sessionOpenedFromMenu,
36456
- onBack: handleBack,
36457
- onClose: handleClose
36458
- }
36459
- ),
36460
- /* @__PURE__ */ jsxs57("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
36461
- /* @__PURE__ */ jsx63(
36462
- PayWithCashApp,
36463
- {
36464
- userId,
36465
- publishableKey,
36466
- recipientAddress,
36467
- destinationChainType,
36468
- destinationChainId,
36469
- destinationTokenAddress,
36470
- cashAppIconUrl: projectConfig?.asset_cdn_url ? `${projectConfig.asset_cdn_url}/api/public/icons/onramps/svg/cashapp.svg` : void 0,
36471
- view: cashAppView,
36472
- onViewChange: setCashAppView,
36473
- onAmountChange: setCashAppAmount,
36474
- onEvent,
36475
- onDepositSuccess: onDepositSuccessFor("cashapp"),
36476
- onDepositError: onDepositErrorFor("cashapp"),
36477
- wallets
36478
- }
36479
- ),
36480
- depositPoweredByFooter
36481
- ] })
36482
- ] }) : view === "apple_pay" ? /* @__PURE__ */ jsxs57(Fragment14, { children: [
36483
- /* @__PURE__ */ jsx63(
36484
- DepositHeader,
36485
- {
36486
- title: applePayHeaderTitle,
36487
- showBack: applePayShowBack,
36488
- onBack: () => {
36489
- const handled = applePayHandleRef.current?.requestBack() ?? false;
36490
- if (!handled) handleBack();
36491
- },
36492
- onClose: handleClose
36493
- }
36494
- ),
36495
- /* @__PURE__ */ jsxs57("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
36496
- applePayProvidersLoading ? /* @__PURE__ */ jsx63(SkeletonButton, { variant: "with-icons" }) : !hasEnabledApplePayProvider ? /* @__PURE__ */ jsx63(GeoRestrictionScreen, { methodName: "Apple Pay" }) : /* @__PURE__ */ jsx63(
36497
- BuyWithApplePay,
36498
- {
36499
- ref: applePayHandleRef,
36500
- userId,
36501
- publishableKey,
36502
- destinationChainType,
36503
- destinationChainId,
36504
- destinationTokenAddress,
36505
- userEmail,
36506
- wallets,
36507
- onViewChange: setApplePayView,
36508
- onEvent,
36509
- onDepositSuccess: onDepositSuccessFor("apple_pay"),
36510
- onDepositError: onDepositErrorFor("apple_pay"),
36511
- exitLabel: sessionOpenedFromMenu ? "Return" : "Close",
36512
- onExit: () => {
36513
- if (sessionOpenedFromMenu) {
36514
- setView("main");
36515
- } else {
36516
- handleClose();
36172
+ /* @__PURE__ */ jsx63(
36173
+ ThemeStyleInjector,
36174
+ {
36175
+ className: view === "wallet_connect" ? "uf-flex uf-min-h-0 uf-flex-col" : void 0,
36176
+ children: view === "main" ? /* @__PURE__ */ jsxs57("div", { className: "uf-flex uf-flex-col uf-min-h-0 uf-max-h-full", children: [
36177
+ /* @__PURE__ */ jsx63("div", { className: "uf-flex-shrink-0", children: /* @__PURE__ */ jsx63(
36178
+ DepositHeader,
36179
+ {
36180
+ title: modalTitle || "Deposit",
36181
+ showClose: !hideOverlay,
36182
+ onClose: handleClose,
36183
+ showBalance: showBalanceHeader,
36184
+ balanceAddress: recipientAddress,
36185
+ balanceChainType: destinationChainType === "ethereum" || destinationChainType === "solana" || destinationChainType === "bitcoin" || destinationChainType === "n1" ? destinationChainType : void 0,
36186
+ balanceChainId: destinationChainId,
36187
+ balanceTokenAddress: destinationTokenAddress,
36188
+ projectName: projectConfig?.project_name,
36189
+ publishableKey
36190
+ }
36191
+ ) }),
36192
+ renderMainMenuBody(),
36193
+ /* @__PURE__ */ jsx63("div", { className: "uf-flex-shrink-0", children: depositPoweredByFooter })
36194
+ ] }) : view === "transfer" ? /* @__PURE__ */ jsxs57(Fragment14, { children: [
36195
+ /* @__PURE__ */ jsx63(
36196
+ DepositHeader,
36197
+ {
36198
+ title: transferCryptoTitle,
36199
+ showBack: showBackTransfer,
36200
+ onBack: handleBack,
36201
+ onClose: handleClose,
36202
+ showBalance: showBalanceHeader,
36203
+ balanceAddress: recipientAddress,
36204
+ balanceChainType: destinationChainType === "ethereum" || destinationChainType === "solana" || destinationChainType === "bitcoin" || destinationChainType === "n1" ? destinationChainType : void 0,
36205
+ balanceChainId: destinationChainId,
36206
+ balanceTokenAddress: destinationTokenAddress,
36207
+ projectName: projectConfig?.project_name,
36208
+ publishableKey
36209
+ }
36210
+ ),
36211
+ /* @__PURE__ */ jsxs57("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
36212
+ standaloneNeedsDepositPrereq && depositPrerequisiteBody !== null ? /* @__PURE__ */ jsx63("div", { className: "uf-pb-4 uf-space-y-3", children: depositPrerequisiteBody }) : transferInputVariant === "single_input" ? /* @__PURE__ */ jsx63(
36213
+ TransferCryptoSingleInput,
36214
+ {
36215
+ userId,
36216
+ publishableKey,
36217
+ recipientAddress,
36218
+ destinationChainType,
36219
+ destinationChainId,
36220
+ destinationTokenAddress,
36221
+ defaultSourceChainType,
36222
+ defaultSourceChainId,
36223
+ defaultSourceTokenAddress,
36224
+ defaultSourceSymbol,
36225
+ depositConfirmationMode,
36226
+ onExecutionsChange: setDepositExecutions,
36227
+ onDepositSuccess: onDepositSuccessFor("transfer"),
36228
+ onDepositError: onDepositErrorFor("transfer"),
36229
+ wallets
36230
+ }
36231
+ ) : /* @__PURE__ */ jsx63(
36232
+ TransferCryptoDoubleInput,
36233
+ {
36234
+ userId,
36235
+ publishableKey,
36236
+ recipientAddress,
36237
+ destinationChainType,
36238
+ destinationChainId,
36239
+ destinationTokenAddress,
36240
+ defaultSourceChainType,
36241
+ defaultSourceChainId,
36242
+ defaultSourceTokenAddress,
36243
+ defaultSourceSymbol,
36244
+ depositConfirmationMode,
36245
+ onExecutionsChange: setDepositExecutions,
36246
+ onDepositSuccess: onDepositSuccessFor("transfer"),
36247
+ onDepositError: onDepositErrorFor("transfer"),
36248
+ wallets
36517
36249
  }
36250
+ ),
36251
+ depositPoweredByFooter
36252
+ ] })
36253
+ ] }) : view === "tracker" ? /* @__PURE__ */ jsxs57(Fragment14, { children: [
36254
+ /* @__PURE__ */ jsx63(
36255
+ DepositHeader,
36256
+ {
36257
+ title: selectedExecution ? "Deposit Details" : depositTrackerTitle,
36258
+ showBack: showBackTracker,
36259
+ onBack: handleBack,
36260
+ onClose: handleClose
36518
36261
  }
36519
- }
36520
- ),
36521
- depositPoweredByFooter
36522
- ] })
36523
- ] }) : null })
36262
+ ),
36263
+ /* @__PURE__ */ jsxs57("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
36264
+ /* @__PURE__ */ jsx63("div", { className: "uf-h-[460px] uf-overflow-y-auto [scrollbar-width:none] [&::-webkit-scrollbar]:uf-hidden", children: selectedExecution ? /* @__PURE__ */ jsx63(DepositDetailContent, { execution: selectedExecution }) : /* @__PURE__ */ jsx63("div", { className: "uf-space-y-2 uf-pb-8", children: allExecutions.length === 0 ? /* @__PURE__ */ jsx63("div", { className: "uf-py-8 uf-px-4 uf-text-center", children: /* @__PURE__ */ jsx63(
36265
+ "div",
36266
+ {
36267
+ className: "uf-text-sm",
36268
+ style: {
36269
+ color: components.container.subtitleColor,
36270
+ fontFamily: fonts.regular
36271
+ },
36272
+ children: "No deposits yet"
36273
+ }
36274
+ ) }) : allExecutions.map((execution) => /* @__PURE__ */ jsx63(
36275
+ DepositExecutionItem,
36276
+ {
36277
+ execution,
36278
+ onClick: () => setSelectedExecution(execution)
36279
+ },
36280
+ execution.id
36281
+ )) }) }),
36282
+ depositPoweredByFooter
36283
+ ] })
36284
+ ] }) : view === "card" ? /* @__PURE__ */ jsxs57(Fragment14, { children: [
36285
+ /* @__PURE__ */ jsx63(
36286
+ DepositHeader,
36287
+ {
36288
+ title: cardView === "quotes" ? t8.quotes : depositWithCardTitle,
36289
+ showBack: showBackCard,
36290
+ onBack: handleBack,
36291
+ onClose: handleClose,
36292
+ badge: cardView === "quotes" ? { count: quotesCount } : void 0,
36293
+ showBalance: showBalanceHeader,
36294
+ balanceAddress: recipientAddress,
36295
+ balanceChainType: destinationChainType === "ethereum" || destinationChainType === "solana" || destinationChainType === "bitcoin" || destinationChainType === "n1" ? destinationChainType : void 0,
36296
+ balanceChainId: destinationChainId,
36297
+ balanceTokenAddress: destinationTokenAddress,
36298
+ projectName: projectConfig?.project_name,
36299
+ publishableKey
36300
+ }
36301
+ ),
36302
+ /* @__PURE__ */ jsxs57("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
36303
+ standaloneNeedsDepositPrereq && depositPrerequisiteBody !== null ? /* @__PURE__ */ jsx63("div", { className: "uf-pb-4 uf-space-y-3", children: depositPrerequisiteBody }) : !showFiatOnramp ? (
36304
+ // Fiat on-ramp resolved hidden/disabled after a direct open
36305
+ // (e.g. platform `is_hidden` for a Stripe Link-only project).
36306
+ // Show a geo-restriction screen rather than the card UI so the
36307
+ // hard-hide is honoured without a flash of "Pay with Card".
36308
+ /* @__PURE__ */ jsx63(GeoRestrictionScreen, { methodName: "Card" })
36309
+ ) : /* @__PURE__ */ jsx63(
36310
+ BuyWithCard,
36311
+ {
36312
+ userId,
36313
+ publishableKey,
36314
+ view: cardView,
36315
+ onViewChange: handleCardViewChange,
36316
+ destinationTokenSymbol,
36317
+ recipientAddress,
36318
+ destinationChainType,
36319
+ destinationChainId,
36320
+ destinationTokenAddress,
36321
+ onDepositSuccess: onDepositSuccessFor("card"),
36322
+ onDepositError: onDepositErrorFor("card"),
36323
+ onEvent,
36324
+ themeClass,
36325
+ wallets,
36326
+ assetCdnUrl: projectConfig?.asset_cdn_url,
36327
+ hideDepositFlowInfo,
36328
+ hideDisplayDescription
36329
+ }
36330
+ ),
36331
+ depositPoweredByFooter
36332
+ ] })
36333
+ ] }) : view === "exchange" ? /* @__PURE__ */ jsxs57(Fragment14, { children: [
36334
+ /* @__PURE__ */ jsx63(
36335
+ DepositHeader,
36336
+ {
36337
+ title: payWithExchangeTitle,
36338
+ showBack: exchangeView === "pending" || sessionOpenedFromMenu,
36339
+ onBack: handleBack,
36340
+ onClose: handleClose
36341
+ }
36342
+ ),
36343
+ /* @__PURE__ */ jsxs57("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
36344
+ /* @__PURE__ */ jsx63(
36345
+ PayWithExchange,
36346
+ {
36347
+ userId,
36348
+ publishableKey,
36349
+ exchanges,
36350
+ view: exchangeView,
36351
+ onViewChange: setExchangeView,
36352
+ destinationTokenSymbol,
36353
+ recipientAddress,
36354
+ destinationChainType,
36355
+ destinationChainId,
36356
+ destinationTokenAddress,
36357
+ onDepositSuccess: onDepositSuccessFor("pay_with_exchange"),
36358
+ onDepositError: onDepositErrorFor("pay_with_exchange"),
36359
+ wallets,
36360
+ defaultToken: defaultToken ?? null
36361
+ }
36362
+ ),
36363
+ depositPoweredByFooter
36364
+ ] })
36365
+ ] }) : view === "coinbase_connect" ? /* @__PURE__ */ jsxs57("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
36366
+ /* @__PURE__ */ jsx63(
36367
+ CoinbaseConnect,
36368
+ {
36369
+ publishableKey,
36370
+ userId,
36371
+ wallets,
36372
+ recipientAddress,
36373
+ destinationTokenAddress: destinationTokenAddress ?? "",
36374
+ destinationChainId: destinationChainId ?? "",
36375
+ destinationChainType: destinationChainType ?? "",
36376
+ onDepositSuccess: onDepositSuccessFor("exchange_connect"),
36377
+ onDepositError: onDepositErrorFor("exchange_connect"),
36378
+ onTransferError: (error) => {
36379
+ onDepositErrorFor("exchange_connect")?.({
36380
+ message: error.message,
36381
+ error
36382
+ });
36383
+ },
36384
+ onBack: handleBack,
36385
+ onClose: handleClose,
36386
+ onDisconnect: handleExchangeDisconnect,
36387
+ skipToHoldings: coinbaseSkipToHoldings,
36388
+ canGoBack: sessionOpenedFromMenu,
36389
+ onExecutionsChange: setDepositExecutions,
36390
+ defaultSourceChainType,
36391
+ defaultSourceChainId,
36392
+ defaultSourceTokenAddress,
36393
+ defaultSourceSymbol
36394
+ }
36395
+ ),
36396
+ depositPoweredByFooter
36397
+ ] }) : view === "wallet_connect" ? (
36398
+ // Mobile: flex-fill the full-height dialog body so the wallet list
36399
+ // can grow and scroll, with the footer pinned to the bottom.
36400
+ // Desktop (sm:): stays content-sized.
36401
+ /* @__PURE__ */ jsxs57(
36402
+ "div",
36403
+ {
36404
+ className: "uf-flex uf-flex-col uf-gap-1.5 uf-min-h-0 uf-flex-1 sm:uf-flex-none",
36405
+ children: [
36406
+ /* @__PURE__ */ jsx63(
36407
+ WalletConnect,
36408
+ {
36409
+ walletInfo: browserWalletInfo ?? void 0,
36410
+ depositWallet: browserWalletInfo?.depositWallet ?? void 0,
36411
+ wallets,
36412
+ userId,
36413
+ publishableKey,
36414
+ assetCdnUrl: projectConfig?.asset_cdn_url,
36415
+ projectName: projectConfig?.project_name,
36416
+ onError: (error) => {
36417
+ onDepositErrorFor("wallet_connect")?.({
36418
+ message: error.message,
36419
+ error
36420
+ });
36421
+ },
36422
+ onDepositSuccess: onDepositSuccessFor("wallet_connect"),
36423
+ onDepositError: onDepositErrorFor("wallet_connect"),
36424
+ amountQuickSelect: browserWalletAmountQuickSelect,
36425
+ onWalletDisconnect: handleWalletDisconnect,
36426
+ onWalletConnected: (info, dw) => {
36427
+ setBrowserWalletInfo({ ...info, depositWallet: dw });
36428
+ setStoredWalletState(info.type);
36429
+ setBrowserWalletChainType(dw.chain_type === "solana" ? "solana" : "ethereum");
36430
+ },
36431
+ onBack: handleBack,
36432
+ onClose: handleClose,
36433
+ defaultSourceChainType,
36434
+ defaultSourceChainId,
36435
+ defaultSourceTokenAddress,
36436
+ defaultSourceSymbol,
36437
+ canGoBack: sessionOpenedFromMenu,
36438
+ depositWalletsLoading: walletsLoading
36439
+ }
36440
+ ),
36441
+ depositPoweredByFooter
36442
+ ]
36443
+ }
36444
+ )
36445
+ ) : view === "bank_transfer" ? /* @__PURE__ */ jsxs57(Fragment14, { children: [
36446
+ /* @__PURE__ */ jsx63(
36447
+ DepositHeader,
36448
+ {
36449
+ title: t8.bankTransfer.title,
36450
+ showBack: bankTransferView !== "providers" || sessionOpenedFromMenu,
36451
+ onBack: handleBack,
36452
+ onClose: handleClose
36453
+ }
36454
+ ),
36455
+ /* @__PURE__ */ jsxs57("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
36456
+ bankTransferProvidersLoading ? /* @__PURE__ */ jsx63(SkeletonButton, { variant: "with-icons" }) : !hasEnabledBankTransferProvider ? /* @__PURE__ */ jsx63(GeoRestrictionScreen, { methodName: "Bank Transfer" }) : /* @__PURE__ */ jsx63(
36457
+ BankTransfer,
36458
+ {
36459
+ userId,
36460
+ publishableKey,
36461
+ view: bankTransferView,
36462
+ onViewChange: setBankTransferView,
36463
+ recipientAddress,
36464
+ destinationChainType,
36465
+ destinationChainId,
36466
+ destinationTokenAddress,
36467
+ destinationTokenSymbol,
36468
+ wallets,
36469
+ defaultToken: defaultToken ?? null,
36470
+ assetCdnUrl: projectConfig?.asset_cdn_url,
36471
+ onEvent,
36472
+ onDepositSuccess,
36473
+ onDepositError
36474
+ }
36475
+ ),
36476
+ depositPoweredByFooter
36477
+ ] })
36478
+ ] }) : view === "stripe_link" ? /* @__PURE__ */ jsxs57(Fragment14, { children: [
36479
+ /* @__PURE__ */ jsx63(
36480
+ DepositHeader,
36481
+ {
36482
+ title: "Deposit with Link",
36483
+ showBack: stripeLinkStep !== "checkout" && stripeLinkStep !== "success",
36484
+ onBack: handleBack,
36485
+ showClose: stripeLinkStep !== "checkout",
36486
+ onClose: handleClose
36487
+ }
36488
+ ),
36489
+ /* @__PURE__ */ jsxs57("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
36490
+ isLoadingIp ? (
36491
+ // Hold the geo decision until IP resolves so we don't mount
36492
+ // PayWithStripeLink (which kicks off config/OAuth work) for a
36493
+ // deep-link user who turns out to be outside the US.
36494
+ /* @__PURE__ */ jsx63(SkeletonButton, { variant: "with-icons" })
36495
+ ) : !showStripeLink ? (
36496
+ // Stripe Link's crypto on-ramp is US-only. On a direct open
36497
+ // (initialScreen="stripe_link") the row isn't in a menu to
36498
+ // fall back to, so show a geo-restriction screen rather than
36499
+ // the Link UI.
36500
+ /* @__PURE__ */ jsx63(
36501
+ GeoRestrictionScreen,
36502
+ {
36503
+ methodName: t8.stripeLink.title,
36504
+ message: "Pay with Link is only available in the US."
36505
+ }
36506
+ )
36507
+ ) : /* @__PURE__ */ jsx63(
36508
+ PayWithStripeLink,
36509
+ {
36510
+ userId,
36511
+ publishableKey,
36512
+ recipientAddress,
36513
+ destinationChainType,
36514
+ destinationChainId,
36515
+ destinationTokenAddress,
36516
+ wallets,
36517
+ email: userEmail,
36518
+ iconUrl: projectConfig?.asset_cdn_url ? `${projectConfig.asset_cdn_url}/api/public/icons/onramps/svg/link.svg` : void 0,
36519
+ step: stripeLinkStep,
36520
+ onStepChange: setStripeLinkStep,
36521
+ backHandlerRef: stripeLinkBackRef,
36522
+ onDepositSuccess,
36523
+ onDepositError
36524
+ }
36525
+ ),
36526
+ depositPoweredByFooter
36527
+ ] })
36528
+ ] }) : view === "cashapp" ? /* @__PURE__ */ jsxs57(Fragment14, { children: [
36529
+ /* @__PURE__ */ jsx63(
36530
+ DepositHeader,
36531
+ {
36532
+ title: cashAppView !== "amount" && cashAppAmount ? `Pay $${cashAppAmount} via Cash App` : "Pay with Cash App",
36533
+ showBack: cashAppView !== "amount" || sessionOpenedFromMenu,
36534
+ onBack: handleBack,
36535
+ onClose: handleClose
36536
+ }
36537
+ ),
36538
+ /* @__PURE__ */ jsxs57("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
36539
+ /* @__PURE__ */ jsx63(
36540
+ PayWithCashApp,
36541
+ {
36542
+ userId,
36543
+ publishableKey,
36544
+ recipientAddress,
36545
+ destinationChainType,
36546
+ destinationChainId,
36547
+ destinationTokenAddress,
36548
+ cashAppIconUrl: projectConfig?.asset_cdn_url ? `${projectConfig.asset_cdn_url}/api/public/icons/onramps/svg/cashapp.svg` : void 0,
36549
+ view: cashAppView,
36550
+ onViewChange: setCashAppView,
36551
+ onAmountChange: setCashAppAmount,
36552
+ onEvent,
36553
+ onDepositSuccess: onDepositSuccessFor("cashapp"),
36554
+ onDepositError: onDepositErrorFor("cashapp"),
36555
+ wallets
36556
+ }
36557
+ ),
36558
+ depositPoweredByFooter
36559
+ ] })
36560
+ ] }) : view === "apple_pay" ? /* @__PURE__ */ jsxs57(Fragment14, { children: [
36561
+ /* @__PURE__ */ jsx63(
36562
+ DepositHeader,
36563
+ {
36564
+ title: applePayHeaderTitle,
36565
+ showBack: applePayShowBack,
36566
+ onBack: () => {
36567
+ const handled = applePayHandleRef.current?.requestBack() ?? false;
36568
+ if (!handled) handleBack();
36569
+ },
36570
+ onClose: handleClose
36571
+ }
36572
+ ),
36573
+ /* @__PURE__ */ jsxs57("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
36574
+ applePayProvidersLoading ? /* @__PURE__ */ jsx63(SkeletonButton, { variant: "with-icons" }) : !hasEnabledApplePayProvider ? /* @__PURE__ */ jsx63(GeoRestrictionScreen, { methodName: "Apple Pay" }) : /* @__PURE__ */ jsx63(
36575
+ BuyWithApplePay,
36576
+ {
36577
+ ref: applePayHandleRef,
36578
+ userId,
36579
+ publishableKey,
36580
+ destinationChainType,
36581
+ destinationChainId,
36582
+ destinationTokenAddress,
36583
+ userEmail,
36584
+ wallets,
36585
+ onViewChange: setApplePayView,
36586
+ onEvent,
36587
+ onDepositSuccess: onDepositSuccessFor("apple_pay"),
36588
+ onDepositError: onDepositErrorFor("apple_pay"),
36589
+ exitLabel: sessionOpenedFromMenu ? "Return" : "Close",
36590
+ onExit: () => {
36591
+ if (sessionOpenedFromMenu) {
36592
+ setView("main");
36593
+ } else {
36594
+ handleClose();
36595
+ }
36596
+ }
36597
+ }
36598
+ ),
36599
+ depositPoweredByFooter
36600
+ ] })
36601
+ ] }) : null
36602
+ }
36603
+ )
36524
36604
  ]
36525
36605
  }
36526
36606
  )
@@ -36530,7 +36610,7 @@ function DepositModal({
36530
36610
  var TERMINAL_STATUSES = /* @__PURE__ */ new Set(["succeeded", "expired", "refunded", "canceled"]);
36531
36611
  function usePaymentIntent(params) {
36532
36612
  const { clientSecret, publishableKey, enabled = true, pollingInterval = 3e3 } = params;
36533
- return useQuery18({
36613
+ return useQuery17({
36534
36614
  queryKey: ["unifold", "paymentIntent", clientSecret, publishableKey],
36535
36615
  queryFn: () => retrievePaymentIntent(clientSecret, publishableKey),
36536
36616
  enabled: enabled && !!clientSecret && !!publishableKey,
@@ -36959,258 +37039,280 @@ function CheckoutModal({
36959
37039
  return /* @__PURE__ */ jsx64(PortalContainerProvider, { value: null, children: /* @__PURE__ */ jsx64(Dialog2, { open, onOpenChange: handleClose, modal: true, children: /* @__PURE__ */ jsx64(
36960
37040
  DialogContent2,
36961
37041
  {
36962
- className: `sm:uf-max-w-[400px] uf-border-secondary uf-text-foreground uf-gap-0 [&>button]:uf-hidden uf-p-0 uf-overflow-visible ${view === "main" ? "!uf-top-auto !uf-h-auto !uf-max-h-[60vh] sm:!uf-max-h-none sm:!uf-top-[50%]" : "!uf-top-0 !uf-h-full sm:!uf-h-auto sm:!uf-top-[50%]"} ${themeClass}`,
37042
+ className: `sm:uf-max-w-[400px] uf-border-secondary uf-text-foreground uf-gap-0 [&>button]:uf-hidden uf-p-0 uf-overflow-visible ${view === "main" ? "!uf-top-auto !uf-h-auto !uf-max-h-[60vh] sm:!uf-max-h-none sm:!uf-top-[50%]" : "!uf-top-0 !uf-h-full sm:!uf-h-auto sm:!uf-top-[50%]"} ${// wallet_connect fills the full-height mobile sheet. DialogContent is a
37043
+ // grid whose single auto row only grows to fill free space and never
37044
+ // shrinks below content, so a long wallet list would balloon the row
37045
+ // past the viewport and push the footer off-screen. Clamp the row to
37046
+ // the modal height with minmax(0,1fr) so the inner overflow-y-auto list
37047
+ // scrolls with the footer pinned. Reset to content-sized on desktop.
37048
+ view === "wallet_connect" ? "[grid-template-rows:minmax(0,1fr)] sm:[grid-template-rows:none]" : ""} ${themeClass}`,
36963
37049
  style: { backgroundColor: colors2.background },
36964
37050
  onPointerDownOutside: (e) => e.preventDefault(),
36965
37051
  onInteractOutside: (e) => e.preventDefault(),
36966
- children: /* @__PURE__ */ jsx64(ThemeStyleInjector, { children: view === "main" ? /* @__PURE__ */ jsxs58(Fragment15, { children: [
36967
- /* @__PURE__ */ jsx64(DepositHeader, { title: modalTitle || "Checkout", showClose: true, onClose: handleClose }),
36968
- /* @__PURE__ */ jsxs58("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
36969
- piLoading ? /* @__PURE__ */ jsxs58("div", { className: "uf-space-y-3", children: [
36970
- /* @__PURE__ */ jsx64(
36971
- "div",
36972
- {
36973
- className: "uf-rounded-xl uf-p-4 uf-animate-pulse",
36974
- style: {
36975
- backgroundColor: components.card.backgroundColor,
36976
- borderRadius: components.card.borderRadius,
36977
- border: `${components.card.borderWidth}px solid ${components.card.borderColor}`
36978
- },
36979
- children: /* @__PURE__ */ jsxs58("div", { className: "uf-flex uf-flex-col uf-items-center uf-gap-2", children: [
36980
- /* @__PURE__ */ jsx64(
36981
- "div",
37052
+ children: /* @__PURE__ */ jsx64(
37053
+ ThemeStyleInjector,
37054
+ {
37055
+ className: view === "wallet_connect" ? "uf-flex uf-min-h-0 uf-flex-col" : void 0,
37056
+ children: view === "main" ? /* @__PURE__ */ jsxs58(Fragment15, { children: [
37057
+ /* @__PURE__ */ jsx64(DepositHeader, { title: modalTitle || "Checkout", showClose: true, onClose: handleClose }),
37058
+ /* @__PURE__ */ jsxs58("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
37059
+ piLoading ? /* @__PURE__ */ jsxs58("div", { className: "uf-space-y-3", children: [
37060
+ /* @__PURE__ */ jsx64(
37061
+ "div",
37062
+ {
37063
+ className: "uf-rounded-xl uf-p-4 uf-animate-pulse",
37064
+ style: {
37065
+ backgroundColor: components.card.backgroundColor,
37066
+ borderRadius: components.card.borderRadius,
37067
+ border: `${components.card.borderWidth}px solid ${components.card.borderColor}`
37068
+ },
37069
+ children: /* @__PURE__ */ jsxs58("div", { className: "uf-flex uf-flex-col uf-items-center uf-gap-2", children: [
37070
+ /* @__PURE__ */ jsx64(
37071
+ "div",
37072
+ {
37073
+ className: "uf-h-8 uf-w-24 uf-rounded",
37074
+ style: {
37075
+ backgroundColor: components.card.borderColor
37076
+ }
37077
+ }
37078
+ ),
37079
+ /* @__PURE__ */ jsx64(
37080
+ "div",
37081
+ {
37082
+ className: "uf-h-4 uf-w-16 uf-rounded",
37083
+ style: {
37084
+ backgroundColor: components.card.borderColor
37085
+ }
37086
+ }
37087
+ )
37088
+ ] })
37089
+ }
37090
+ ),
37091
+ /* @__PURE__ */ jsx64(SkeletonButton2, {}),
37092
+ /* @__PURE__ */ jsx64(SkeletonButton2, {})
37093
+ ] }) : piError ? /* @__PURE__ */ jsxs58("div", { className: "uf-flex uf-flex-col uf-items-center uf-justify-center uf-py-8 uf-px-4 uf-text-center", children: [
37094
+ /* @__PURE__ */ jsx64("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__ */ jsx64(TriangleAlert, { className: "uf-w-8 uf-h-8 uf-text-muted-foreground" }) }),
37095
+ /* @__PURE__ */ jsx64(
37096
+ "h3",
37097
+ {
37098
+ className: "uf-text-lg uf-font-semibold uf-mb-2",
37099
+ style: {
37100
+ color: colors2.foreground,
37101
+ fontFamily: fonts.semibold
37102
+ },
37103
+ children: "Unable to Load Checkout"
37104
+ }
37105
+ ),
37106
+ /* @__PURE__ */ jsx64(
37107
+ "p",
37108
+ {
37109
+ className: "uf-text-sm uf-max-w-[280px]",
37110
+ style: {
37111
+ color: colors2.foregroundMuted,
37112
+ fontFamily: fonts.regular
37113
+ },
37114
+ children: piError instanceof Error ? piError.message : "Something went wrong. Please try again."
37115
+ }
37116
+ )
37117
+ ] }) : paymentIntent ? /* @__PURE__ */ jsxs58("div", { className: "uf-space-y-3", children: [
37118
+ progressSection,
37119
+ (paymentIntent.status === "requires_payment" || paymentIntent.status === "processing") && /* @__PURE__ */ jsxs58(Fragment15, { children: [
37120
+ showTransferCrypto && /* @__PURE__ */ jsx64(
37121
+ TransferCryptoButton,
36982
37122
  {
36983
- className: "uf-h-8 uf-w-24 uf-rounded",
36984
- style: {
36985
- backgroundColor: components.card.borderColor
36986
- }
37123
+ onClick: () => {
37124
+ lastCheckoutMethodRef.current = "transfer";
37125
+ setView("transfer");
37126
+ },
37127
+ title: i18n2.checkoutModal.transferCrypto.title,
37128
+ subtitle: i18n2.checkoutModal.transferCrypto.subtitle,
37129
+ featuredTokens: projectConfig?.transfer_crypto.networks
36987
37130
  }
36988
37131
  ),
36989
- /* @__PURE__ */ jsx64(
36990
- "div",
37132
+ showConnectWallet && /* @__PURE__ */ jsx64(
37133
+ BrowserWalletButton,
36991
37134
  {
36992
- className: "uf-h-4 uf-w-16 uf-rounded",
36993
- style: {
36994
- backgroundColor: components.card.borderColor
36995
- }
37135
+ onClick: handleBrowserWalletClick,
37136
+ onConnectClick: handleWalletConnectClick,
37137
+ onDisconnect: handleWalletDisconnect,
37138
+ chainType: browserWalletChainType,
37139
+ publishableKey,
37140
+ featuredWallets: projectConfig?.connect_wallet?.wallets,
37141
+ subtitle: i18n2.checkoutModal.browserWallet.subtitle
36996
37142
  }
36997
37143
  )
36998
37144
  ] })
36999
- }
37000
- ),
37001
- /* @__PURE__ */ jsx64(SkeletonButton2, {}),
37002
- /* @__PURE__ */ jsx64(SkeletonButton2, {})
37003
- ] }) : piError ? /* @__PURE__ */ jsxs58("div", { className: "uf-flex uf-flex-col uf-items-center uf-justify-center uf-py-8 uf-px-4 uf-text-center", children: [
37004
- /* @__PURE__ */ jsx64("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__ */ jsx64(TriangleAlert, { className: "uf-w-8 uf-h-8 uf-text-muted-foreground" }) }),
37145
+ ] }) : null,
37146
+ poweredByFooter
37147
+ ] })
37148
+ ] }) : view === "transfer" ? /* @__PURE__ */ jsxs58(Fragment15, { children: [
37005
37149
  /* @__PURE__ */ jsx64(
37006
- "h3",
37150
+ DepositHeader,
37007
37151
  {
37008
- className: "uf-text-lg uf-font-semibold uf-mb-2",
37009
- style: {
37010
- color: colors2.foreground,
37011
- fontFamily: fonts.semibold
37012
- },
37013
- children: "Unable to Load Checkout"
37152
+ title: modalTitle || "Checkout",
37153
+ showBack: true,
37154
+ onBack: handleBack,
37155
+ onClose: handleClose
37014
37156
  }
37015
37157
  ),
37016
- /* @__PURE__ */ jsx64(
37017
- "p",
37018
- {
37019
- className: "uf-text-sm uf-max-w-[280px]",
37020
- style: {
37021
- color: colors2.foregroundMuted,
37022
- fontFamily: fonts.regular
37023
- },
37024
- children: piError instanceof Error ? piError.message : "Something went wrong. Please try again."
37025
- }
37026
- )
37027
- ] }) : paymentIntent ? /* @__PURE__ */ jsxs58("div", { className: "uf-space-y-3", children: [
37028
- progressSection,
37029
- (paymentIntent.status === "requires_payment" || paymentIntent.status === "processing") && /* @__PURE__ */ jsxs58(Fragment15, { children: [
37030
- showTransferCrypto && /* @__PURE__ */ jsx64(
37031
- TransferCryptoButton,
37032
- {
37033
- onClick: () => {
37034
- lastCheckoutMethodRef.current = "transfer";
37035
- setView("transfer");
37036
- },
37037
- title: i18n2.checkoutModal.transferCrypto.title,
37038
- subtitle: i18n2.checkoutModal.transferCrypto.subtitle,
37039
- featuredTokens: projectConfig?.transfer_crypto.networks
37040
- }
37041
- ),
37042
- showConnectWallet && /* @__PURE__ */ jsx64(
37043
- BrowserWalletButton,
37044
- {
37045
- onClick: handleBrowserWalletClick,
37046
- onConnectClick: handleWalletConnectClick,
37047
- onDisconnect: handleWalletDisconnect,
37048
- chainType: browserWalletChainType,
37049
- publishableKey,
37050
- featuredWallets: projectConfig?.connect_wallet?.wallets,
37051
- subtitle: i18n2.checkoutModal.browserWallet.subtitle
37052
- }
37053
- )
37054
- ] })
37055
- ] }) : null,
37056
- poweredByFooter
37057
- ] })
37058
- ] }) : view === "transfer" ? /* @__PURE__ */ jsxs58(Fragment15, { children: [
37059
- /* @__PURE__ */ jsx64(
37060
- DepositHeader,
37061
- {
37062
- title: modalTitle || "Checkout",
37063
- showBack: true,
37064
- onBack: handleBack,
37065
- onClose: handleClose
37066
- }
37067
- ),
37068
- /* @__PURE__ */ jsxs58("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
37069
- paymentIntent ? /* @__PURE__ */ jsxs58(Fragment15, { children: [
37070
- (() => {
37071
- const receivedUsd = parseFloat(
37072
- paymentIntent.destination_amount_received_usd || paymentIntent.amount_received_usd
37073
- );
37074
- const totalUsd = parseFloat(
37075
- paymentIntent.destination_amount_usd || paymentIntent.amount_usd
37076
- );
37077
- const pct = totalUsd > 0 ? Math.min(receivedUsd / totalUsd * 100, 100) : 0;
37078
- return /* @__PURE__ */ jsxs58("div", { className: "uf-space-y-2", children: [
37079
- /* @__PURE__ */ jsxs58("div", { className: "uf-flex uf-items-center uf-justify-between", children: [
37080
- /* @__PURE__ */ jsx64(
37081
- "span",
37082
- {
37083
- className: "uf-text-xs",
37084
- style: { color: colors2.foregroundMuted, fontFamily: fonts.regular },
37085
- children: "Received"
37086
- }
37087
- ),
37088
- /* @__PURE__ */ jsxs58(
37089
- "span",
37090
- {
37091
- className: "uf-text-xs",
37092
- style: { color: colors2.foreground, fontFamily: fonts.medium },
37093
- children: [
37094
- "$",
37095
- receivedUsd.toFixed(2),
37096
- " / $",
37097
- totalUsd.toFixed(2)
37098
- ]
37099
- }
37100
- )
37101
- ] }),
37102
- /* @__PURE__ */ jsx64(
37103
- "div",
37104
- {
37105
- className: "uf-w-full uf-h-1.5 uf-rounded-full uf-overflow-hidden",
37106
- style: { backgroundColor: colors2.border },
37107
- children: /* @__PURE__ */ jsx64(
37158
+ /* @__PURE__ */ jsxs58("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
37159
+ paymentIntent ? /* @__PURE__ */ jsxs58(Fragment15, { children: [
37160
+ (() => {
37161
+ const receivedUsd = parseFloat(
37162
+ paymentIntent.destination_amount_received_usd || paymentIntent.amount_received_usd
37163
+ );
37164
+ const totalUsd = parseFloat(
37165
+ paymentIntent.destination_amount_usd || paymentIntent.amount_usd
37166
+ );
37167
+ const pct = totalUsd > 0 ? Math.min(receivedUsd / totalUsd * 100, 100) : 0;
37168
+ return /* @__PURE__ */ jsxs58("div", { className: "uf-space-y-2", children: [
37169
+ /* @__PURE__ */ jsxs58("div", { className: "uf-flex uf-items-center uf-justify-between", children: [
37170
+ /* @__PURE__ */ jsx64(
37171
+ "span",
37172
+ {
37173
+ className: "uf-text-xs",
37174
+ style: { color: colors2.foregroundMuted, fontFamily: fonts.regular },
37175
+ children: "Received"
37176
+ }
37177
+ ),
37178
+ /* @__PURE__ */ jsxs58(
37179
+ "span",
37180
+ {
37181
+ className: "uf-text-xs",
37182
+ style: { color: colors2.foreground, fontFamily: fonts.medium },
37183
+ children: [
37184
+ "$",
37185
+ receivedUsd.toFixed(2),
37186
+ " / $",
37187
+ totalUsd.toFixed(2)
37188
+ ]
37189
+ }
37190
+ )
37191
+ ] }),
37192
+ /* @__PURE__ */ jsx64(
37108
37193
  "div",
37109
37194
  {
37110
- className: "uf-h-full uf-rounded-full uf-transition-all uf-duration-500",
37111
- style: {
37112
- width: `${pct}%`,
37113
- backgroundColor: paymentIntent.status === "succeeded" ? "rgb(34, 197, 94)" : colors2.primary
37114
- }
37195
+ className: "uf-w-full uf-h-1.5 uf-rounded-full uf-overflow-hidden",
37196
+ style: { backgroundColor: colors2.border },
37197
+ children: /* @__PURE__ */ jsx64(
37198
+ "div",
37199
+ {
37200
+ className: "uf-h-full uf-rounded-full uf-transition-all uf-duration-500",
37201
+ style: {
37202
+ width: `${pct}%`,
37203
+ backgroundColor: paymentIntent.status === "succeeded" ? "rgb(34, 197, 94)" : colors2.primary
37204
+ }
37205
+ }
37206
+ )
37115
37207
  }
37116
37208
  )
37209
+ ] });
37210
+ })(),
37211
+ /* @__PURE__ */ jsx64(
37212
+ TransferCryptoSingleInput,
37213
+ {
37214
+ userId: paymentIntent.user_id || "",
37215
+ publishableKey,
37216
+ clientSecret,
37217
+ recipientAddress: paymentIntent.recipient_address,
37218
+ destinationChainType: paymentIntent.destination_chain_type,
37219
+ destinationChainId: paymentIntent.destination_chain_id,
37220
+ destinationTokenAddress: paymentIntent.destination_token_address,
37221
+ defaultSourceChainType,
37222
+ defaultSourceChainId,
37223
+ defaultSourceTokenAddress,
37224
+ defaultSourceSymbol,
37225
+ depositConfirmationMode: "auto_ui",
37226
+ wallets,
37227
+ onSourceTokenChange: setSelectedSource,
37228
+ persistCheckingIndicator: true,
37229
+ productType: "payment",
37230
+ checkoutQuote: effectiveCheckoutQuote,
37231
+ isCheckoutQuoteLoading: isQuoteLoading || isQuoteFetching
37117
37232
  }
37118
37233
  )
37119
- ] });
37120
- })(),
37121
- /* @__PURE__ */ jsx64(
37122
- TransferCryptoSingleInput,
37234
+ ] }) : /* @__PURE__ */ jsx64(SkeletonButton2, {}),
37235
+ poweredByFooter
37236
+ ] })
37237
+ ] }) : view === "wallet_connect" && paymentIntent ? (
37238
+ // Mobile: flex-fill the full-height sheet so the wallet list grows and
37239
+ // scrolls with the footer pinned. Desktop (sm:): content-sized.
37240
+ /* @__PURE__ */ jsxs58(
37241
+ "div",
37123
37242
  {
37124
- userId: paymentIntent.user_id || "",
37125
- publishableKey,
37126
- clientSecret,
37127
- recipientAddress: paymentIntent.recipient_address,
37128
- destinationChainType: paymentIntent.destination_chain_type,
37129
- destinationChainId: paymentIntent.destination_chain_id,
37130
- destinationTokenAddress: paymentIntent.destination_token_address,
37131
- defaultSourceChainType,
37132
- defaultSourceChainId,
37133
- defaultSourceTokenAddress,
37134
- defaultSourceSymbol,
37135
- depositConfirmationMode: "auto_ui",
37136
- wallets,
37137
- onSourceTokenChange: setSelectedSource,
37138
- persistCheckingIndicator: true,
37139
- productType: "payment",
37140
- checkoutQuote: effectiveCheckoutQuote,
37141
- isCheckoutQuoteLoading: isQuoteLoading || isQuoteFetching
37243
+ className: "uf-flex uf-flex-col uf-gap-1.5 uf-min-h-0 uf-flex-1 sm:uf-flex-none",
37244
+ children: [
37245
+ /* @__PURE__ */ jsx64(
37246
+ WalletConnect,
37247
+ {
37248
+ walletInfo: browserWalletInfo ?? void 0,
37249
+ depositWallet: browserWalletInfo?.depositWallet ?? void 0,
37250
+ wallets,
37251
+ userId: paymentIntent.user_id || "",
37252
+ publishableKey,
37253
+ clientSecret,
37254
+ prefillAmountUsd: remainingAmountUsd,
37255
+ checkoutAmountUsd: paymentIntent.amount_usd,
37256
+ checkoutReceivedUsd: paymentIntent.amount_received_usd,
37257
+ checkoutDestination: {
37258
+ chainType: paymentIntent.destination_chain_type,
37259
+ chainId: paymentIntent.destination_chain_id,
37260
+ tokenAddress: paymentIntent.destination_token_address,
37261
+ decimals: paymentIntent.destination_token_decimals ?? 6
37262
+ },
37263
+ productType: "payment",
37264
+ stablecoinParity: paymentIntent.stablecoin_parity ?? false,
37265
+ checkoutRemainingBaseUnits: (() => {
37266
+ const remaining = BigInt(paymentIntent.amount) - BigInt(paymentIntent.amount_received);
37267
+ return remaining > 0n ? remaining.toString() : "0";
37268
+ })(),
37269
+ onSuccess: (_txHash) => {
37270
+ emitCheckoutSuccess(
37271
+ {
37272
+ paymentIntentId: paymentIntent.id,
37273
+ status: "processing",
37274
+ paymentIntent
37275
+ },
37276
+ "wallet_connect"
37277
+ );
37278
+ },
37279
+ onError: (error) => {
37280
+ onCheckoutError?.({
37281
+ message: error.message,
37282
+ error,
37283
+ method: "wallet_connect"
37284
+ });
37285
+ },
37286
+ onWalletDisconnect: handleWalletDisconnect,
37287
+ onWalletConnected: (info, dw) => {
37288
+ setBrowserWalletInfo({ ...info, depositWallet: dw });
37289
+ setStoredWalletState(info.type);
37290
+ setBrowserWalletChainType(dw.chain_type === "solana" ? "solana" : "ethereum");
37291
+ lastCheckoutMethodRef.current = "wallet_connect";
37292
+ },
37293
+ onNewDeposit: () => setView("main"),
37294
+ onDone: () => setView("main"),
37295
+ paymentIntentStatus: paymentIntent.status,
37296
+ onBack: handleBack,
37297
+ onClose: handleClose,
37298
+ defaultSourceChainType,
37299
+ defaultSourceChainId,
37300
+ defaultSourceTokenAddress,
37301
+ defaultSourceSymbol
37302
+ }
37303
+ ),
37304
+ poweredByFooter
37305
+ ]
37142
37306
  }
37143
37307
  )
37144
- ] }) : /* @__PURE__ */ jsx64(SkeletonButton2, {}),
37145
- poweredByFooter
37146
- ] })
37147
- ] }) : view === "wallet_connect" && paymentIntent ? /* @__PURE__ */ jsxs58("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
37148
- /* @__PURE__ */ jsx64(
37149
- WalletConnect,
37150
- {
37151
- walletInfo: browserWalletInfo ?? void 0,
37152
- depositWallet: browserWalletInfo?.depositWallet ?? void 0,
37153
- wallets,
37154
- userId: paymentIntent.user_id || "",
37155
- publishableKey,
37156
- clientSecret,
37157
- prefillAmountUsd: remainingAmountUsd,
37158
- checkoutAmountUsd: paymentIntent.amount_usd,
37159
- checkoutReceivedUsd: paymentIntent.amount_received_usd,
37160
- checkoutDestination: {
37161
- chainType: paymentIntent.destination_chain_type,
37162
- chainId: paymentIntent.destination_chain_id,
37163
- tokenAddress: paymentIntent.destination_token_address,
37164
- decimals: paymentIntent.destination_token_decimals ?? 6
37165
- },
37166
- productType: "payment",
37167
- stablecoinParity: paymentIntent.stablecoin_parity ?? false,
37168
- checkoutRemainingBaseUnits: (() => {
37169
- const remaining = BigInt(paymentIntent.amount) - BigInt(paymentIntent.amount_received);
37170
- return remaining > 0n ? remaining.toString() : "0";
37171
- })(),
37172
- onSuccess: (_txHash) => {
37173
- emitCheckoutSuccess(
37174
- {
37175
- paymentIntentId: paymentIntent.id,
37176
- status: "processing",
37177
- paymentIntent
37178
- },
37179
- "wallet_connect"
37180
- );
37181
- },
37182
- onError: (error) => {
37183
- onCheckoutError?.({
37184
- message: error.message,
37185
- error,
37186
- method: "wallet_connect"
37187
- });
37188
- },
37189
- onWalletDisconnect: handleWalletDisconnect,
37190
- onWalletConnected: (info, dw) => {
37191
- setBrowserWalletInfo({ ...info, depositWallet: dw });
37192
- setStoredWalletState(info.type);
37193
- setBrowserWalletChainType(dw.chain_type === "solana" ? "solana" : "ethereum");
37194
- lastCheckoutMethodRef.current = "wallet_connect";
37195
- },
37196
- onNewDeposit: () => setView("main"),
37197
- onDone: () => setView("main"),
37198
- paymentIntentStatus: paymentIntent.status,
37199
- onBack: handleBack,
37200
- onClose: handleClose,
37201
- defaultSourceChainType,
37202
- defaultSourceChainId,
37203
- defaultSourceTokenAddress,
37204
- defaultSourceSymbol
37205
- }
37206
- ),
37207
- poweredByFooter
37208
- ] }) : null })
37308
+ ) : null
37309
+ }
37310
+ )
37209
37311
  }
37210
37312
  ) }) });
37211
37313
  }
37212
37314
  function useSupportedDestinationTokens(publishableKey, enabled = true) {
37213
- return useQuery19({
37315
+ return useQuery18({
37214
37316
  queryKey: ["unifold", "supportedDestinationTokens", publishableKey],
37215
37317
  queryFn: () => getSupportedDestinationTokens(publishableKey),
37216
37318
  staleTime: 1e3 * 60 * 5,
@@ -37245,7 +37347,7 @@ function useSourceTokenValidation(params) {
37245
37347
  enabled = true
37246
37348
  } = params;
37247
37349
  const hasParams = !!sourceChainType && !!sourceChainId && !!sourceTokenAddress;
37248
- return useQuery20({
37350
+ return useQuery19({
37249
37351
  queryKey: [
37250
37352
  "unifold",
37251
37353
  "sourceTokenValidation",
@@ -37294,7 +37396,7 @@ function useSourceTokenValidation(params) {
37294
37396
  function useAddressBalance(params) {
37295
37397
  const { address, chainType, chainId, tokenAddress, publishableKey, enabled = true } = params;
37296
37398
  const hasParams = !!address && !!chainType && !!chainId && !!tokenAddress;
37297
- return useQuery21({
37399
+ return useQuery20({
37298
37400
  queryKey: [
37299
37401
  "unifold",
37300
37402
  "addressBalance",
@@ -37350,7 +37452,7 @@ function useAddressBalance(params) {
37350
37452
  }
37351
37453
  function useExecutions(userId, publishableKey, options) {
37352
37454
  const actionType = options?.actionType ?? ActionType.Deposit;
37353
- return useQuery222({
37455
+ return useQuery21({
37354
37456
  queryKey: ["unifold", "executions", actionType, userId, publishableKey],
37355
37457
  queryFn: () => queryExecutions(userId, publishableKey, actionType),
37356
37458
  enabled: (options?.enabled ?? true) && !!userId,
@@ -37676,7 +37778,7 @@ function useVerifyRecipientAddress(params) {
37676
37778
  } = params;
37677
37779
  const trimmedAddress = recipientAddress?.trim() || "";
37678
37780
  const hasAllParams = !!chainType && !!chainId && !!tokenAddress && trimmedAddress.length > 0;
37679
- return useQuery23({
37781
+ return useQuery222({
37680
37782
  queryKey: [
37681
37783
  "unifold",
37682
37784
  "verifyRecipientAddress",
@@ -37715,7 +37817,7 @@ function useGetDepositAddress(params) {
37715
37817
  enabled = true
37716
37818
  } = params;
37717
37819
  const canFire = !!userId && !!recipientAddress && !!destinationChainType && !!destinationChainId && !!destinationTokenAddress;
37718
- return useQuery24({
37820
+ return useQuery23({
37719
37821
  queryKey: [
37720
37822
  "unifold",
37721
37823
  "getDepositAddress",