coinley-pay 0.33.0 → 0.34.0

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.
@@ -5,7 +5,7 @@ import { jsxs, jsx, Fragment } from "react/jsx-runtime";
5
5
  import { useState, useRef, useEffect, useCallback, useMemo } from "react";
6
6
  import { useConnect, useAccount, useSwitchChain, useSendTransaction, useWaitForTransactionReceipt, WagmiProvider, useDisconnect } from "wagmi";
7
7
  import { QueryClientProvider, QueryClient } from "@tanstack/react-query";
8
- import { s as sdkAnalytics, c as clarityAnalytics, d as dist, a as Buffer2, B as Buffer$1, g as getCurrencyInfo, p as prefetchRates, i as isSupportedCurrency, b as convertToUSD, f as formatCurrency } from "./index-y1EdvKhM.js";
8
+ import { s as sdkAnalytics, c as clarityAnalytics, d as dist, a as Buffer2, B as Buffer$1, g as getCurrencyInfo, p as prefetchRates, i as isSupportedCurrency, b as convertToUSD, f as formatCurrency } from "./index-C8sFF-PH.js";
9
9
  import { createConfig, fallback, http, getAccount as getAccount$1, getWalletClient, simulateContract, writeContract, readContract, waitForTransactionReceipt, estimateFeesPerGas as estimateFeesPerGas$1 } from "@wagmi/core";
10
10
  import { injected, metaMask, coinbaseWallet, walletConnect } from "@wagmi/connectors";
11
11
  import { defineChain as defineChain$1, erc20Abi, http as http$1, createPublicClient, fallback as fallback$1 } from "viem";
@@ -2470,6 +2470,23 @@ class SimplePaymentAPI {
2470
2470
  timeout: 2e4
2471
2471
  });
2472
2472
  }
2473
+ // ==================== CROSS-CHAIN (no-wallet Relay deposit address) ====================
2474
+ // Distinct from the BRIDGE ROUTING API above: this is the no-wallet flow where the
2475
+ // customer sends to a Relay-generated source-chain address that bridges to the
2476
+ // merchant's settlement chain. Backend resolves the destination.
2477
+ async getCrossChainSources() {
2478
+ const result = await this.request("/api/payments/cross-chain/sources");
2479
+ return (result == null ? void 0 : result.sources) || [];
2480
+ }
2481
+ async createCrossChainPayment(data) {
2482
+ return await this.request("/api/payments/cross-chain/create", {
2483
+ method: "POST",
2484
+ body: JSON.stringify(data)
2485
+ });
2486
+ }
2487
+ async getCrossChainStatus(paymentId) {
2488
+ return await this.request(`/api/payments/cross-chain/status/${paymentId}`);
2489
+ }
2473
2490
  /**
2474
2491
  * Check if a network supports deposit address payments
2475
2492
  * @param {number|string} chainId - Chain ID
@@ -21133,7 +21150,7 @@ const WalletSelector = ({
21133
21150
  try {
21134
21151
  setAppKitError(null);
21135
21152
  setWalletConnectAddress(solanaAccountState.address);
21136
- const { createWalletConnectAdapter } = await import("./appKitSolana-XFYOjQeJ.js");
21153
+ const { createWalletConnectAdapter } = await import("./appKitSolana-D3rTiqkR.js");
21137
21154
  const adapter = createWalletConnectAdapter(solanaAccountState.address);
21138
21155
  await solanaWallet.connectWalletConnect(adapter, solanaAccountState.address);
21139
21156
  console.log("✅ WalletConnect synced with SDK");
@@ -21238,7 +21255,7 @@ const WalletSelector = ({
21238
21255
  setAppKitLoading(true);
21239
21256
  setAppKitError(null);
21240
21257
  try {
21241
- const { initializeAppKitEVM, openAppKitModal } = await import("./appKitEVM-BzFOTXTT.js");
21258
+ const { initializeAppKitEVM, openAppKitModal } = await import("./appKitEVM-ByJCOOlj.js");
21242
21259
  await initializeAppKitEVM(wagmiConfig);
21243
21260
  await openAppKitModal();
21244
21261
  } catch (error) {
@@ -21258,7 +21275,7 @@ const WalletSelector = ({
21258
21275
  setAppKitError(null);
21259
21276
  try {
21260
21277
  console.log("📦 Loading AppKit Solana module...");
21261
- const { initializeAppKitSolana } = await import("./appKitSolana-XFYOjQeJ.js");
21278
+ const { initializeAppKitSolana } = await import("./appKitSolana-D3rTiqkR.js");
21262
21279
  console.log("✅ Module loaded, initializing...");
21263
21280
  const modal = await initializeAppKitSolana(solanaWallet);
21264
21281
  console.log("✅ AppKit Solana initialized successfully");
@@ -22840,7 +22857,7 @@ const normalizeWalletType = (walletType) => {
22840
22857
  };
22841
22858
  const getSupportedMobileWallets = () => Object.values(MOBILE_WALLET_CONFIG);
22842
22859
  const appendHostedPaymentContext = (params, paymentData, selectedToken = null, selectedNetwork = null) => {
22843
- var _a, _b, _c, _d;
22860
+ var _a, _b, _c, _d, _e;
22844
22861
  const paymentToken = selectedToken || (paymentData == null ? void 0 : paymentData.Token) || null;
22845
22862
  const paymentNetwork = selectedNetwork || (paymentData == null ? void 0 : paymentData.Network) || null;
22846
22863
  const paymentAmount = (paymentData == null ? void 0 : paymentData.totalAmount) || (paymentData == null ? void 0 : paymentData.amount) || (paymentData == null ? void 0 : paymentData.productAmount) || null;
@@ -22851,6 +22868,9 @@ const appendHostedPaymentContext = (params, paymentData, selectedToken = null, s
22851
22868
  const tokenSymbol = (paymentToken == null ? void 0 : paymentToken.symbol) || (paymentData == null ? void 0 : paymentData.currency) || (paymentData == null ? void 0 : paymentData.token) || ((_d = paymentData == null ? void 0 : paymentData.metadata) == null ? void 0 : _d.selectedToken) || null;
22852
22869
  const tokenContract = (paymentToken == null ? void 0 : paymentToken.contractAddress) || (paymentData == null ? void 0 : paymentData.tokenContract) || (paymentData == null ? void 0 : paymentData.tokenAddress) || null;
22853
22870
  const tokenDecimals = (paymentToken == null ? void 0 : paymentToken.decimals) || (paymentData == null ? void 0 : paymentData.tokenDecimals) || null;
22871
+ const depositAddress = (paymentData == null ? void 0 : paymentData.depositAddress) || (paymentData == null ? void 0 : paymentData.deposit_address) || ((_e = paymentData == null ? void 0 : paymentData.paymentDetails) == null ? void 0 : _e.depositAddress) || null;
22872
+ const isDepositPayment = (paymentData == null ? void 0 : paymentData.isDepositPayment) || (paymentData == null ? void 0 : paymentData.depositMethod) === "deposit_address" || (paymentData == null ? void 0 : paymentData.paymentMethod) === "deposit_address" || Boolean(depositAddress);
22873
+ const bridgeContext = (paymentData == null ? void 0 : paymentData.mobileBridgeContext) || null;
22854
22874
  if (networkName) {
22855
22875
  params.set("network", networkName);
22856
22876
  }
@@ -22875,6 +22895,41 @@ const appendHostedPaymentContext = (params, paymentData, selectedToken = null, s
22875
22895
  if (amountInWei !== null && amountInWei !== void 0 && amountInWei !== "") {
22876
22896
  params.set("amountInWei", String(amountInWei));
22877
22897
  }
22898
+ if (isDepositPayment) {
22899
+ params.set("isDepositPayment", "true");
22900
+ params.set("paymentMethod", "deposit_address");
22901
+ }
22902
+ if (depositAddress) {
22903
+ params.set("depositAddress", depositAddress);
22904
+ }
22905
+ if (bridgeContext == null ? void 0 : bridgeContext.isBridgePayment) {
22906
+ params.set("isBridgePayment", "true");
22907
+ params.set("bridgeProvider", bridgeContext.provider || "lifi");
22908
+ if (bridgeContext.originChainId !== null && bridgeContext.originChainId !== void 0) {
22909
+ params.set("bridgeOriginChainId", String(bridgeContext.originChainId));
22910
+ }
22911
+ if (bridgeContext.originNetwork) {
22912
+ params.set("bridgeOriginNetwork", bridgeContext.originNetwork);
22913
+ }
22914
+ if (bridgeContext.originToken) {
22915
+ params.set("bridgeOriginToken", bridgeContext.originToken);
22916
+ }
22917
+ if (bridgeContext.originTokenSymbol) {
22918
+ params.set("bridgeOriginTokenSymbol", bridgeContext.originTokenSymbol);
22919
+ }
22920
+ if (bridgeContext.originTokenDecimals !== null && bridgeContext.originTokenDecimals !== void 0) {
22921
+ params.set("bridgeOriginTokenDecimals", String(bridgeContext.originTokenDecimals));
22922
+ }
22923
+ if (bridgeContext.destinationNetwork) {
22924
+ params.set("bridgeDestinationNetwork", bridgeContext.destinationNetwork);
22925
+ }
22926
+ if (bridgeContext.destinationTokenSymbol) {
22927
+ params.set("bridgeDestinationTokenSymbol", bridgeContext.destinationTokenSymbol);
22928
+ }
22929
+ if (bridgeContext.quoteId) {
22930
+ params.set("bridgeQuoteId", bridgeContext.quoteId);
22931
+ }
22932
+ }
22878
22933
  };
22879
22934
  const getHostedPaymentUrl = (paymentData, preferredWallet = "metamask", selectedToken = null, selectedNetwork = null, apiUrl = null) => {
22880
22935
  const paymentId = (paymentData == null ? void 0 : paymentData.id) || (paymentData == null ? void 0 : paymentData.splitterPaymentId);
@@ -23116,6 +23171,28 @@ const PAYMENT_TABS = {
23116
23171
  QR: "qr",
23117
23172
  TRANSFER: "transfer"
23118
23173
  };
23174
+ const CC_CHAIN_NAMES = {
23175
+ 1: "Ethereum",
23176
+ 10: "Optimism",
23177
+ 56: "BNB Chain",
23178
+ 137: "Polygon",
23179
+ 8453: "Base",
23180
+ 42161: "Arbitrum",
23181
+ 43114: "Avalanche",
23182
+ 59144: "Linea",
23183
+ 534352: "Scroll",
23184
+ 130: "Unichain",
23185
+ 143: "Monad",
23186
+ 324: "zkSync Era",
23187
+ 100: "Gnosis",
23188
+ 25: "Cronos",
23189
+ 146: "Sonic",
23190
+ 480: "World Chain",
23191
+ 1135: "Lisk",
23192
+ 81457: "Blast"
23193
+ };
23194
+ const ccChainName = (id) => CC_CHAIN_NAMES[Number(id)] || `Chain ${id}`;
23195
+ const ccChainIcon = (id) => `https://assets.relay.link/icons/${Number(id)}/light.png`;
23119
23196
  const CoinleyPaymentInternal = ({
23120
23197
  publicKey: publicKey2,
23121
23198
  apiKey,
@@ -23259,6 +23336,15 @@ const CoinleyPaymentInternal = ({
23259
23336
  setSelectedToken(null);
23260
23337
  };
23261
23338
  const [activeTab, setActiveTab] = useState(PAYMENT_TABS.TRANSFER);
23339
+ const [ccSources, setCcSources] = useState([]);
23340
+ const [ccOriginChainId, setCcOriginChainId] = useState("");
23341
+ const [ccOriginToken, setCcOriginToken] = useState(null);
23342
+ const [ccResult, setCcResult] = useState(null);
23343
+ const [ccQrCode, setCcQrCode] = useState("");
23344
+ const [ccPhase, setCcPhase] = useState("idle");
23345
+ const [ccError, setCcError] = useState(null);
23346
+ const [ccGenerating, setCcGenerating] = useState(false);
23347
+ const ccSucceeded = useRef(false);
23262
23348
  const [networkSearch, setNetworkSearch] = useState("");
23263
23349
  const [walletNetworkSearch, setWalletNetworkSearch] = useState("");
23264
23350
  const [openCheckoutDropdown, setOpenCheckoutDropdown] = useState(null);
@@ -23294,6 +23380,8 @@ const CoinleyPaymentInternal = ({
23294
23380
  const STANDARD_PAYMENT_TIMEOUT_MS = 15 * 60 * 1e3;
23295
23381
  const BRIDGE_PAYMENT_TIMEOUT_MS = 15 * 60 * 1e3;
23296
23382
  const BRIDGE_DEPOSIT_EXPIRY_SECONDS = 15 * 60;
23383
+ const MOBILE_BRIDGE_PLACEHOLDER_ADDRESS = "0x0000000000000000000000000000000000000001";
23384
+ const DEPOSIT_SUPPORTED_CHAINS = [8453, 56, 42161, 137, 10, 43114, 143, 59144, 534352, 130];
23297
23385
  const [timeRemaining, setTimeRemaining] = useState(STANDARD_PAYMENT_TIMEOUT_MS);
23298
23386
  const modalOpenedAtRef = useRef(Date.now());
23299
23387
  const [mobileStep, setMobileStep] = useState("content");
@@ -23566,6 +23654,8 @@ const CoinleyPaymentInternal = ({
23566
23654
  );
23567
23655
  const isSwapOrBridgeFlow = requiresDepositRouting(selectedNetwork, selectedToken) || sourceNeedsMerchantBridge;
23568
23656
  const paymentTimeoutMs = isSwapOrBridgeFlow ? BRIDGE_PAYMENT_TIMEOUT_MS : STANDARD_PAYMENT_TIMEOUT_MS;
23657
+ const mobileBridgeQuoteAddress = isMobile && showMobileWalletPicker && selectedMobileWallet ? MOBILE_BRIDGE_PLACEHOLDER_ADDRESS : null;
23658
+ const effectiveQuoteAddress = address || mobileBridgeQuoteAddress;
23569
23659
  useEffect(() => {
23570
23660
  if (hasCommittedTransaction) return;
23571
23661
  modalOpenedAtRef.current = Date.now();
@@ -23573,7 +23663,7 @@ const CoinleyPaymentInternal = ({
23573
23663
  }, [hasCommittedTransaction, paymentTimeoutMs, selectedNetwork == null ? void 0 : selectedNetwork.chainId, selectedToken == null ? void 0 : selectedToken.id]);
23574
23664
  const activeAttemptRef = useRef(null);
23575
23665
  const [retryEpoch, setRetryEpoch] = useState(0);
23576
- const buildSelectionSnapshot = (networkArg = selectedNetwork, tokenArg = selectedToken, addressArg = address, solanaPubkeyArg = solanaWallet == null ? void 0 : solanaWallet.publicKey) => ({
23666
+ const buildSelectionSnapshot = (networkArg = selectedNetwork, tokenArg = selectedToken, addressArg = effectiveQuoteAddress, solanaPubkeyArg = solanaWallet == null ? void 0 : solanaWallet.publicKey) => ({
23577
23667
  networkId: (networkArg == null ? void 0 : networkArg.id) ?? null,
23578
23668
  chainId: (networkArg == null ? void 0 : networkArg.chainId) ?? null,
23579
23669
  networkShortName: (networkArg == null ? void 0 : networkArg.shortName) ?? null,
@@ -24224,6 +24314,99 @@ const CoinleyPaymentInternal = ({
24224
24314
  setMobileWalletRedirecting(null);
24225
24315
  setPaymentData(null);
24226
24316
  };
24317
+ const prepareMobileWalletPayment = async () => {
24318
+ var _a2, _b, _c, _d, _e, _f, _g, _h, _i;
24319
+ const amountToUse = paymentAmount || parseFloat(config.amount);
24320
+ if (!amountToUse || amountToUse <= 0 || isNaN(amountToUse)) {
24321
+ throw new Error("Invalid payment amount. Please refresh and try again.");
24322
+ }
24323
+ const currentSelectionSnapshot = buildSelectionSnapshot(selectedNetwork, selectedToken, effectiveQuoteAddress, solanaWallet == null ? void 0 : solanaWallet.publicKey);
24324
+ let attempt = activeAttemptRef.current;
24325
+ if (!attempt || !snapshotsMatch(attempt.snapshot, currentSelectionSnapshot)) {
24326
+ attempt = createNewAttempt("mobile-wallet-handoff", {
24327
+ snapshot: currentSelectionSnapshot
24328
+ });
24329
+ }
24330
+ const attemptMeta = buildAttemptMeta(attempt);
24331
+ const metadata = {
24332
+ ...config.metadata,
24333
+ originalCurrency: merchantCurrency,
24334
+ originalAmount,
24335
+ exchangeRate,
24336
+ mobileWalletHandoff: true,
24337
+ preferredWallet: selectedMobileWallet,
24338
+ selectedNetwork: selectedNetwork.shortName,
24339
+ selectedToken: selectedToken.symbol,
24340
+ ...isSwapOrBridgeFlow ? {
24341
+ bridgeProvider: ((_a2 = relayBridge.bridgeQuote) == null ? void 0 : _a2.provider) || "lifi",
24342
+ bridgeOriginChainId: parseInt(selectedNetwork.chainId),
24343
+ bridgeOriginToken: selectedToken.contractAddress || selectedToken.symbol,
24344
+ bridgeOriginTokenSymbol: selectedToken.symbol,
24345
+ bridgeOriginTokenDecimals: selectedToken.decimals || 18,
24346
+ bridgeRequiresWalletExecution: true
24347
+ } : {},
24348
+ ...(selectedToken == null ? void 0 : selectedToken.isSwapToken) ? {
24349
+ swapFrom: selectedToken.symbol,
24350
+ swapProvider: ((_b = relayBridge.bridgeQuote) == null ? void 0 : _b.provider) || "lifi"
24351
+ } : {}
24352
+ };
24353
+ if (isSwapOrBridgeFlow) {
24354
+ if ((selectedToken == null ? void 0 : selectedToken.routeStatus) === "unsupported") {
24355
+ throw new Error(UNSUPPORTED_ROUTE_MESSAGE);
24356
+ }
24357
+ const selectedChainId = parseInt(selectedNetwork == null ? void 0 : selectedNetwork.chainId);
24358
+ const chainHasCreate2 = DEPOSIT_SUPPORTED_CHAINS.includes(selectedChainId);
24359
+ const sourceIsMerchantDestination = isMerchantReceiveNetwork(selectedNetwork);
24360
+ let effectiveNetwork;
24361
+ let merchantStable;
24362
+ if (selectedNetwork == null ? void 0 : selectedNetwork.isBridgeNetwork) {
24363
+ effectiveNetwork = (_c = selectedNetwork.bridgeDestination) == null ? void 0 : _c.shortName;
24364
+ merchantStable = paymentFlow.getMerchantStablecoin({ shortName: effectiveNetwork });
24365
+ } else if (chainHasCreate2 && sourceIsMerchantDestination) {
24366
+ effectiveNetwork = selectedNetwork.shortName;
24367
+ merchantStable = paymentFlow.getMerchantStablecoin(selectedNetwork);
24368
+ } else {
24369
+ const quotedDest = ((_d = relayBridge.bridgeQuote) == null ? void 0 : _d.destChainId) ? merchantReceiveNetworks.find((network) => parseInt(network.chainId) === parseInt(relayBridge.bridgeQuote.destChainId)) : null;
24370
+ const bestDest = quotedDest || getBestDestinationChain(merchantReceiveNetworks);
24371
+ effectiveNetwork = (bestDest == null ? void 0 : bestDest.shortName) || "base";
24372
+ merchantStable = paymentFlow.getMerchantStablecoin(bestDest || { shortName: "base" });
24373
+ }
24374
+ if (!effectiveNetwork) {
24375
+ throw new Error("No bridge destination is available for this mobile payment. Please try another network.");
24376
+ }
24377
+ if (!merchantStable) merchantStable = { symbol: "USDC" };
24378
+ const depositPayment = await createDepositPayment({
24379
+ ...config,
24380
+ amount: amountToUse,
24381
+ currency: merchantStable.symbol || "USDC",
24382
+ network: effectiveNetwork,
24383
+ expiresIn: BRIDGE_DEPOSIT_EXPIRY_SECONDS,
24384
+ __coinleyAttemptMeta: attemptMeta,
24385
+ metadata: {
24386
+ ...metadata,
24387
+ bridgeTo: effectiveNetwork,
24388
+ bridgeDestinationChainId: ((_e = relayBridge.bridgeQuote) == null ? void 0 : _e.destChainId) || null,
24389
+ bridgeDestinationToken: ((_f = relayBridge.bridgeQuote) == null ? void 0 : _f.destTokenAddress) || null
24390
+ }
24391
+ });
24392
+ return {
24393
+ ...depositPayment,
24394
+ mobileBridgeContext: {
24395
+ isBridgePayment: true,
24396
+ originChainId: parseInt(selectedNetwork.chainId),
24397
+ originNetwork: selectedNetwork.shortName,
24398
+ originToken: selectedToken.contractAddress || selectedToken.symbol,
24399
+ originTokenSymbol: selectedToken.symbol,
24400
+ originTokenDecimals: selectedToken.decimals || 18,
24401
+ destinationNetwork: effectiveNetwork,
24402
+ destinationTokenSymbol: merchantStable.symbol || "USDC",
24403
+ provider: ((_g = relayBridge.bridgeQuote) == null ? void 0 : _g.provider) || "lifi",
24404
+ quoteId: ((_h = relayBridge.bridgeQuote) == null ? void 0 : _h.id) || ((_i = relayBridge.bridgeQuote) == null ? void 0 : _i.quoteId) || null
24405
+ }
24406
+ };
24407
+ }
24408
+ return (paymentData == null ? void 0 : paymentData.id) ? paymentData : await createHostedPayment(selectedNetwork, selectedToken, "wallet_browser");
24409
+ };
24227
24410
  const handleMobileWalletPay = async () => {
24228
24411
  const selectedWalletMeta = mobileWalletOptions.find((wallet) => wallet.id === selectedMobileWallet);
24229
24412
  if (!selectedMobileWallet || !selectedWalletMeta) {
@@ -24234,11 +24417,15 @@ const CoinleyPaymentInternal = ({
24234
24417
  setError("Select a network and token before opening your wallet app.");
24235
24418
  return;
24236
24419
  }
24420
+ if (isConverting) {
24421
+ setError("Please wait for currency conversion to complete");
24422
+ return;
24423
+ }
24237
24424
  setError("");
24238
24425
  setPreferredWallet(selectedMobileWallet);
24239
24426
  setMobileWalletRedirecting(selectedMobileWallet);
24240
24427
  try {
24241
- const activePayment = (paymentData == null ? void 0 : paymentData.id) ? paymentData : await createHostedPayment(selectedNetwork, selectedToken, "wallet_browser");
24428
+ const activePayment = await prepareMobileWalletPayment();
24242
24429
  const opened = openPaymentPageInWallet(selectedMobileWallet, activePayment, selectedNetwork, selectedToken, apiUrl);
24243
24430
  if (!opened) {
24244
24431
  throw new Error(`Failed to open ${selectedWalletMeta.name}.`);
@@ -24504,7 +24691,7 @@ const CoinleyPaymentInternal = ({
24504
24691
  relayBridge.resetBridge();
24505
24692
  return;
24506
24693
  }
24507
- if (!selectedToken || !address && !(solanaWallet == null ? void 0 : solanaWallet.publicKey)) {
24694
+ if (!selectedToken || !effectiveQuoteAddress && !(solanaWallet == null ? void 0 : solanaWallet.publicKey)) {
24508
24695
  relayBridge.resetBridge();
24509
24696
  return;
24510
24697
  }
@@ -24520,7 +24707,6 @@ const CoinleyPaymentInternal = ({
24520
24707
  }
24521
24708
  const attemptMeta = buildAttemptMeta(attempt);
24522
24709
  if (isSwap && !isBridge) {
24523
- const DEPOSIT_SUPPORTED_CHAINS = [8453, 56, 42161, 137, 10, 43114, 143, 59144, 534352, 130];
24524
24710
  const isSolanaSwap = (selectedNetwork == null ? void 0 : selectedNetwork.shortName) === "solana" || (selectedNetwork == null ? void 0 : selectedNetwork.chainType) === "solana";
24525
24711
  const originChainId = isSolanaSwap ? RELAY_SOLANA_CHAIN_ID : parseInt(selectedNetwork.chainId);
24526
24712
  const chainHasCreate2 = DEPOSIT_SUPPORTED_CHAINS.includes(originChainId);
@@ -24547,7 +24733,7 @@ const CoinleyPaymentInternal = ({
24547
24733
  if (originTokenAddress === "native") originTokenAddress = SOLANA_TOKEN_ADDRESSES.SOL;
24548
24734
  }
24549
24735
  const PLACEHOLDER_EVM_ADDRESS = "0x0000000000000000000000000000000000000001";
24550
- const quoteRecipient = isSolanaSwap && !chainHasCreate2 ? PLACEHOLDER_EVM_ADDRESS : isSolanaSwap ? (solanaWallet == null ? void 0 : solanaWallet.publicKey) || address : address;
24736
+ const quoteRecipient = isSolanaSwap && !chainHasCreate2 ? PLACEHOLDER_EVM_ADDRESS : isSolanaSwap ? (solanaWallet == null ? void 0 : solanaWallet.publicKey) || effectiveQuoteAddress : effectiveQuoteAddress;
24551
24737
  const quoteUser = isSolanaSwap && !chainHasCreate2 ? solanaWallet == null ? void 0 : solanaWallet.publicKey : void 0;
24552
24738
  if (destinationCandidates) {
24553
24739
  getQuoteWithDestinationTrials({
@@ -24608,7 +24794,7 @@ const CoinleyPaymentInternal = ({
24608
24794
  getBridgeTokenAddress(destStableSymbol, destNetwork.bridgeTokens) || (merchantStable == null ? void 0 : merchantStable.contractAddress),
24609
24795
  destStableSymbol,
24610
24796
  amount.toString(),
24611
- address,
24797
+ effectiveQuoteAddress,
24612
24798
  selectedNetwork.bridgeTokens,
24613
24799
  destNetwork.bridgeTokens,
24614
24800
  void 0,
@@ -24629,7 +24815,7 @@ const CoinleyPaymentInternal = ({
24629
24815
  selectedToken.symbol,
24630
24816
  selectedToken.symbol,
24631
24817
  amount.toString(),
24632
- address,
24818
+ effectiveQuoteAddress,
24633
24819
  selectedNetwork.bridgeTokens,
24634
24820
  destNetwork.bridgeTokens,
24635
24821
  void 0,
@@ -24665,7 +24851,7 @@ const CoinleyPaymentInternal = ({
24665
24851
  selectedNetwork == null ? void 0 : selectedNetwork.id,
24666
24852
  selectedNetwork == null ? void 0 : selectedNetwork.shortName,
24667
24853
  selectedToken == null ? void 0 : selectedToken.id,
24668
- address,
24854
+ effectiveQuoteAddress,
24669
24855
  solanaWallet == null ? void 0 : solanaWallet.publicKey,
24670
24856
  paymentAmount,
24671
24857
  retryEpoch,
@@ -24864,6 +25050,64 @@ const CoinleyPaymentInternal = ({
24864
25050
  sdkAnalytics.trackTokenSelected(token == null ? void 0 : token.symbol, selectedNetwork == null ? void 0 : selectedNetwork.name, config == null ? void 0 : config.merchantName);
24865
25051
  clarityAnalytics.trackTokenSelected(token == null ? void 0 : token.symbol, selectedNetwork == null ? void 0 : selectedNetwork.name, config == null ? void 0 : config.merchantName);
24866
25052
  };
25053
+ useEffect(() => {
25054
+ if (activeTab !== PAYMENT_TABS.TRANSFER || ccSources.length) return;
25055
+ let cancelled = false;
25056
+ paymentFlow.api.getCrossChainSources().then((s) => {
25057
+ if (!cancelled) setCcSources(Array.isArray(s) ? s : []);
25058
+ }).catch((e) => {
25059
+ if (!cancelled) setCcError(e.message || "Failed to load chains");
25060
+ });
25061
+ return () => {
25062
+ cancelled = true;
25063
+ };
25064
+ }, [activeTab, ccSources.length, paymentFlow.api]);
25065
+ const ccOriginTokens = useMemo(() => {
25066
+ const c = ccSources.find((s) => Number(s.chainId) === Number(ccOriginChainId));
25067
+ return c ? c.tokens : [];
25068
+ }, [ccSources, ccOriginChainId]);
25069
+ const handleGenerateCrossChain = async () => {
25070
+ if (!ccOriginChainId || !ccOriginToken) return;
25071
+ setCcError(null);
25072
+ setCcGenerating(true);
25073
+ try {
25074
+ const r = await paymentFlow.api.createCrossChainPayment({
25075
+ amount: Number((config == null ? void 0 : config.amount) ?? paymentAmount),
25076
+ originChainId: Number(ccOriginChainId),
25077
+ originCurrency: ccOriginToken.address
25078
+ });
25079
+ const p = r.payment || r;
25080
+ setCcResult(p);
25081
+ setCcPhase("awaiting_deposit");
25082
+ setCcQrCode(await QRCode.toDataURL(p.relayDepositAddress, { width: 220, margin: 1 }));
25083
+ } catch (e) {
25084
+ setCcError(e.message || "Could not generate payment address");
25085
+ } finally {
25086
+ setCcGenerating(false);
25087
+ }
25088
+ };
25089
+ useEffect(() => {
25090
+ if (!(ccResult == null ? void 0 : ccResult.id)) return;
25091
+ let cancelled = false;
25092
+ const tick = async () => {
25093
+ try {
25094
+ const s = await paymentFlow.api.getCrossChainStatus(ccResult.id);
25095
+ if (cancelled) return;
25096
+ setCcPhase(s.phase);
25097
+ if ((s.phase === "received" || s.phase === "settled") && !ccSucceeded.current) {
25098
+ ccSucceeded.current = true;
25099
+ onSuccess == null ? void 0 : onSuccess(s);
25100
+ }
25101
+ } catch {
25102
+ }
25103
+ };
25104
+ tick();
25105
+ const t = setInterval(tick, 8e3);
25106
+ return () => {
25107
+ cancelled = true;
25108
+ clearInterval(t);
25109
+ };
25110
+ }, [ccResult == null ? void 0 : ccResult.id, paymentFlow.api, onSuccess]);
24867
25111
  const handleGenerateTransferAddress = async () => {
24868
25112
  if (isConverting) {
24869
25113
  setError("Please wait for currency conversion to complete");
@@ -25013,9 +25257,9 @@ const CoinleyPaymentInternal = ({
25013
25257
  if (selectedNetwork && !selectedNetwork.isBridgeNetwork && !(selectedToken == null ? void 0 : selectedToken.isSwapToken)) {
25014
25258
  console.log(`[Routing] Direct payment unsupported on ${selectedNetwork.shortName}; forcing deposit flow`);
25015
25259
  }
25016
- const DEPOSIT_SUPPORTED_CHAINS = [8453, 56, 42161, 137, 10, 43114, 143, 59144, 534352, 130];
25260
+ const DEPOSIT_SUPPORTED_CHAINS2 = [8453, 56, 42161, 137, 10, 43114, 143, 59144, 534352, 130];
25017
25261
  const selectedChainId = parseInt(selectedNetwork == null ? void 0 : selectedNetwork.chainId);
25018
- const chainHasCreate2 = DEPOSIT_SUPPORTED_CHAINS.includes(selectedChainId);
25262
+ const chainHasCreate2 = DEPOSIT_SUPPORTED_CHAINS2.includes(selectedChainId);
25019
25263
  const sourceIsMerchantDestination = isMerchantReceiveNetwork(selectedNetwork);
25020
25264
  let effectiveNetwork;
25021
25265
  let merchantStable;
@@ -25798,7 +26042,7 @@ const CoinleyPaymentInternal = ({
25798
26042
  if (currentStep === PAYMENT_STEPS.PROCESSING) {
25799
26043
  return /* @__PURE__ */ jsxs("div", { id: SDK_ROOT_ID, className: `${SDK_ROOT_CLASS} fixed inset-0 z-50`, style: { fontFamily: FONT_FAMILY }, children: [
25800
26044
  /* @__PURE__ */ jsx("div", { className: "fixed inset-0 bg-black bg-opacity-50", onClick: handleCancel }),
25801
- /* @__PURE__ */ jsx("div", { className: isMobile ? "fixed inset-0 flex items-end" : "fixed inset-0 flex items-center justify-center p-4", style: { zIndex: 51 }, children: /* @__PURE__ */ jsxs("div", { className: isMobile ? "relative flex w-full max-h-[92vh] flex-col overflow-hidden rounded-t-[28px] bg-white px-4 pb-5 pt-7 shadow-2xl animate-slide-up-sheet" : "relative flex h-[500px] w-[430px] flex-col overflow-hidden rounded-[28px] bg-white px-4 pb-5 pt-7 shadow-2xl", children: [
26045
+ /* @__PURE__ */ jsx("div", { className: isMobile ? "fixed inset-0 flex items-end" : "fixed inset-0 flex items-center justify-center p-4", style: { zIndex: 51 }, children: /* @__PURE__ */ jsxs("div", { className: isMobile ? "coinley-mobile-sheet relative flex w-full max-h-[92dvh] flex-col overflow-hidden rounded-t-[24px] bg-white px-4 pb-5 pt-7 shadow-2xl animate-slide-up-sheet" : "relative flex h-[500px] w-[430px] flex-col overflow-hidden rounded-[28px] bg-white px-4 pb-5 pt-7 shadow-2xl", children: [
25802
26046
  /* @__PURE__ */ jsx(
25803
26047
  "button",
25804
26048
  {
@@ -25839,7 +26083,7 @@ const CoinleyPaymentInternal = ({
25839
26083
  if (currentStep === PAYMENT_STEPS.SUCCESS) {
25840
26084
  return /* @__PURE__ */ jsxs("div", { id: SDK_ROOT_ID, className: `${SDK_ROOT_CLASS} fixed inset-0 z-50`, style: { fontFamily: FONT_FAMILY }, children: [
25841
26085
  /* @__PURE__ */ jsx("div", { className: "fixed inset-0 bg-black bg-opacity-50" }),
25842
- /* @__PURE__ */ jsx("div", { className: isMobile ? "fixed inset-0 flex items-end" : "fixed inset-0 flex items-center justify-center p-4", style: { zIndex: 51 }, children: /* @__PURE__ */ jsx("div", { className: isMobile ? "relative flex w-full max-h-[92vh] flex-col overflow-hidden rounded-t-[28px] bg-white px-4 pb-5 pt-5 animate-slide-up-sheet" : "relative flex h-[640px] max-h-[calc(100vh-32px)] min-h-0 w-[450px] max-w-[calc(100vw-32px)] flex-col overflow-hidden rounded-[28px] bg-white px-4 pb-5 pt-5", children: /* @__PURE__ */ jsx(
26086
+ /* @__PURE__ */ jsx("div", { className: isMobile ? "fixed inset-0 flex items-end" : "fixed inset-0 flex items-center justify-center p-4", style: { zIndex: 51 }, children: /* @__PURE__ */ jsx("div", { className: isMobile ? "coinley-mobile-sheet relative flex w-full max-h-[92dvh] flex-col overflow-hidden rounded-t-[24px] bg-white px-4 pb-5 pt-5 animate-slide-up-sheet" : "relative flex h-[640px] max-h-[calc(100vh-32px)] min-h-0 w-[450px] max-w-[calc(100vw-32px)] flex-col overflow-hidden rounded-[28px] bg-white px-4 pb-5 pt-5", children: /* @__PURE__ */ jsx(
25843
26087
  PaymentStatus,
25844
26088
  {
25845
26089
  status: "success",
@@ -25875,12 +26119,13 @@ const CoinleyPaymentInternal = ({
25875
26119
  };
25876
26120
  const getNetworkDisplayName = (network) => (network == null ? void 0 : network.name) || (network == null ? void 0 : network.displayName) || (network == null ? void 0 : network.shortName) || "Network";
25877
26121
  const getNetworkDisplayLogo = (network) => (network == null ? void 0 : network.logo) || (network == null ? void 0 : network.logoURI) || (network == null ? void 0 : network.icon) || getNetworkLogoUrl(network) || getFallbackNetworkLogoUrl(getNetworkDisplayName(network));
25878
- const isTransferSetupView = activeTab === PAYMENT_TABS.TRANSFER && (!selectedNetwork || !selectedToken || !(paymentData == null ? void 0 : paymentData.depositAddress));
26122
+ const isCrossChainTransferSetupView = activeTab === PAYMENT_TABS.TRANSFER && !ccResult;
26123
+ const isTransferSetupView = activeTab === PAYMENT_TABS.TRANSFER && !ccResult && (!selectedNetwork || !selectedToken || !(paymentData == null ? void 0 : paymentData.depositAddress));
25879
26124
  const isQrSetupView = activeTab === PAYMENT_TABS.QR && (!selectedNetwork || !selectedToken || !paymentData || (paymentData == null ? void 0 : paymentData.isDepositPayment));
25880
26125
  const isWalletExtensionSetupView = activeTab === PAYMENT_TABS.WALLET && !showWalletConfirm && !(showMobileWalletPicker && isMobile) && (!connectedWalletType || !selectedNetwork || !selectedToken);
25881
26126
  const isWalletExtensionReadyView = activeTab === PAYMENT_TABS.WALLET && connectedWalletType && selectedNetwork && selectedToken && !showWalletConfirm && !(showMobileWalletPicker && isMobile);
25882
26127
  const isWalletExtensionConfirmView = activeTab === PAYMENT_TABS.WALLET && showWalletConfirm;
25883
- const isCompactCheckoutSetupView = isTransferSetupView || isQrSetupView || isWalletExtensionSetupView;
26128
+ const isCompactCheckoutSetupView = isCrossChainTransferSetupView || isTransferSetupView || isQrSetupView || isWalletExtensionSetupView;
25884
26129
  const isCompactCheckoutView = isCompactCheckoutSetupView || isWalletExtensionReadyView || isWalletExtensionConfirmView;
25885
26130
  const isTightWalletView = isWalletExtensionReadyView || isWalletExtensionConfirmView;
25886
26131
  const renderPaymentSummary = () => /* @__PURE__ */ jsxs("div", { className: isTightWalletView ? "mb-3" : isCompactCheckoutView ? "mb-6 mt-[-5px]" : "mb-8", children: [
@@ -25918,108 +26163,7 @@ const CoinleyPaymentInternal = ({
25918
26163
  method.tab
25919
26164
  )) })
25920
26165
  ] });
25921
- const renderUnderpaymentWarning = (title = "Amount received is less than expected", description = null) => /* @__PURE__ */ jsxs("div", { className: "mb-5 rounded-lg border border-[#F5E5B8] bg-[#FFF9E8] px-3 py-2", children: [
25922
- /* @__PURE__ */ jsxs("div", { className: `flex items-start gap-2 text-[#B54708] ${title && description ? "mb-1" : ""}`, children: [
25923
- /* @__PURE__ */ jsx("svg", { className: "mt-0.5 h-4 w-4 flex-shrink-0", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M12 9v4m0 4h.01M12 3a9 9 0 110 18 9 9 0 010-18z" }) }),
25924
- title ? /* @__PURE__ */ jsx("p", { className: "text-sm font-semibold", children: title }) : /* @__PURE__ */ jsx("p", { className: "text-xs leading-5 text-[#B54708]", children: description })
25925
- ] }),
25926
- title && description && /* @__PURE__ */ jsx("p", { className: "pl-6 text-xs leading-5 text-[#B54708]", children: description })
25927
- ] });
25928
- const renderUnderpaymentOptionCard = ({ choice, icon, title, description }) => {
25929
- const selected = underpaymentChoice === choice;
25930
- return /* @__PURE__ */ jsxs(
25931
- "button",
25932
- {
25933
- type: "button",
25934
- onClick: () => {
25935
- setUnderpaymentChoice(choice);
25936
- setRefundRequestSubmitted(false);
25937
- setRefundRequestStatus(null);
25938
- setRefundRequestMessage("");
25939
- },
25940
- className: `relative flex min-h-[118px] flex-1 flex-col items-start rounded-xl border p-3 text-left transition-colors ${selected ? "border-[#8B5CF6] bg-[#F4EEFF]" : "border-[#ECEEF2] bg-white hover:border-[#D7C5FF]"}`,
25941
- children: [
25942
- selected && /* @__PURE__ */ jsx("span", { className: "absolute right-[-7px] top-[-9px] flex h-5 w-5 items-center justify-center rounded-full border border-[#8B5CF6] bg-white text-[#7042D2]", children: /* @__PURE__ */ jsx("svg", { className: "h-3.5 w-3.5", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2.5, d: "M5 13l4 4L19 7" }) }) }),
25943
- /* @__PURE__ */ jsx("div", { className: "mb-3 flex h-6 w-6 items-center justify-center text-[#111827]", children: icon }),
25944
- /* @__PURE__ */ jsx("p", { className: "mb-1 text-sm font-semibold text-[#111827]", children: title }),
25945
- /* @__PURE__ */ jsx("p", { className: "text-xs leading-4 text-[#A3A5AC]", children: description })
25946
- ]
25947
- }
25948
- );
25949
- };
25950
- const renderUnderpaymentChoicePanel = () => /* @__PURE__ */ jsxs("div", { className: "pt-1", children: [
25951
- renderUnderpaymentWarning(
25952
- "Amount received is less than expected",
25953
- `We received $${formatAmount(underpaymentInfo.receivedAmount || 0)} but expected $${formatAmount(underpaymentInfo.expectedAmount || paymentAmount || 0)}. Your transaction is on hold, please choose how to proceed.`
25954
- ),
25955
- /* @__PURE__ */ jsxs("div", { className: "mb-5 flex gap-2", children: [
25956
- renderUnderpaymentOptionCard({
25957
- choice: "offset",
25958
- title: "Send offset",
25959
- description: underpaymentChoice === "offset" ? "Top up the shortfall and complete this transfer with extended time" : "Top up the shortfall with extended time",
25960
- icon: /* @__PURE__ */ jsx("svg", { className: "h-6 w-6", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1.8, d: "M4 4v6h6M20 20v-6h-6M5.5 15.5A7 7 0 0017.7 18M18.5 8.5A7 7 0 006.3 6" }) })
25961
- }),
25962
- renderUnderpaymentOptionCard({
25963
- choice: "refund",
25964
- title: "Cancel & refund",
25965
- description: "Cancel my transaction so i get refunded",
25966
- icon: /* @__PURE__ */ jsxs("svg", { className: "h-6 w-6", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: [
25967
- /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "9", strokeWidth: 1.8 }),
25968
- /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1.8, d: "M9 9l6 6m0-6l-6 6" })
25969
- ] })
25970
- })
25971
- ] })
25972
- ] });
25973
- const renderUnderpaymentOffsetPanel = () => /* @__PURE__ */ jsxs("div", { className: "pt-1", children: [
25974
- /* @__PURE__ */ jsxs("div", { className: "mb-5 flex items-start gap-3", children: [
25975
- /* @__PURE__ */ jsx("div", { className: "h-[92px] w-[92px] flex-shrink-0 bg-white", children: depositQrCode ? /* @__PURE__ */ jsx("img", { src: depositQrCode, alt: "Deposit Address QR Code", className: "h-full w-full" }) : /* @__PURE__ */ jsx("div", { className: "flex h-full w-full items-center justify-center rounded-lg bg-gray-100", children: /* @__PURE__ */ jsx("div", { className: "h-6 w-6 animate-spin rounded-full border-2 border-[#E5E7EB] border-t-[#7042D2]" }) }) }),
25976
- /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1 pt-1", children: [
25977
- /* @__PURE__ */ jsx("p", { className: "mb-2 text-xs font-medium text-[#1F2430]", children: "Same Wallet address" }),
25978
- /* @__PURE__ */ jsxs("div", { className: "flex min-h-[58px] items-center gap-2 rounded-xl border border-[#EEF0F4] bg-[#FAFAFB] px-3 py-2", children: [
25979
- /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 break-all text-sm leading-5 text-[#1F2430]", children: paymentData.depositAddress }),
25980
- /* @__PURE__ */ jsx(
25981
- "button",
25982
- {
25983
- onClick: () => copyToClipboard(paymentData.depositAddress, "depositAddress"),
25984
- className: `flex h-8 w-8 flex-shrink-0 items-center justify-center rounded-lg transition-colors ${copiedField === "depositAddress" ? "bg-green-100 text-green-600" : "text-[#7042D2] hover:bg-purple-50"}`,
25985
- "aria-label": "Copy wallet address",
25986
- children: copiedField === "depositAddress" ? /* @__PURE__ */ jsx("svg", { className: "h-4 w-4", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M5 13l4 4L19 7" }) }) : /* @__PURE__ */ jsx("svg", { className: "h-4 w-4", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z" }) })
25987
- }
25988
- )
25989
- ] })
25990
- ] })
25991
- ] }),
25992
- renderUnderpaymentWarning(
25993
- null,
25994
- "Send only the offset amount to the same address. Make sure to add network fees on top of this amount."
25995
- ),
25996
- manualCheckStatus === "not_found" && /* @__PURE__ */ jsx("div", { className: "mb-3 rounded-xl border border-amber-200 bg-amber-50 p-3", children: /* @__PURE__ */ jsx("p", { className: "text-sm leading-5 text-amber-700", children: "We have not detected the offset yet. It can take a few moments to appear on-chain, and we will keep checking automatically." }) })
25997
- ] });
25998
- const renderUnderpaymentRefundPanel = () => /* @__PURE__ */ jsxs("div", { className: "pt-1", children: [
25999
- renderUnderpaymentWarning(
26000
- `Refund of $${formatAmount(underpaymentInfo.receivedAmount || 0)} ${underpaymentInfo.tokenSymbol}`,
26001
- `Provide a ${underpaymentInfo.tokenSymbol} wallet address on the same network (${underpaymentInfo.refundNetworkLabel}) to receive your refund. Network fees will be deducted.`
26002
- ),
26003
- /* @__PURE__ */ jsxs("label", { className: "mb-2 block text-xs font-medium text-[#111827]", children: [
26004
- "Your ",
26005
- underpaymentInfo.tokenSymbol,
26006
- " (",
26007
- underpaymentInfo.refundNetworkLabel,
26008
- ") receiving wallet address"
26009
- ] }),
26010
- /* @__PURE__ */ jsx(
26011
- "input",
26012
- {
26013
- type: "text",
26014
- value: refundAddress,
26015
- onChange: (event) => setRefundAddress(event.target.value),
26016
- placeholder: "Paste your wallet address here",
26017
- className: "mb-5 h-11 w-full rounded-xl border border-[#E4E6EB] bg-white px-3 text-sm text-[#1F2430] outline-none transition-colors placeholder:text-[#8B8E98] focus:border-[#B49AF0]"
26018
- }
26019
- ),
26020
- refundRequestMessage && /* @__PURE__ */ jsx("p", { className: `mt-2 text-center text-xs leading-5 ${refundRequestStatus === "error" ? "text-red-600" : "text-[#8B8E98]"}`, children: refundRequestMessage })
26021
- ] });
26022
- const transferNetworks = networks.filter((network) => {
26166
+ networks.filter((network) => {
26023
26167
  const chainId = parseInt(network.chainId);
26024
26168
  const supportedChains = [8453, 56, 42161, 137, 10, 43114, 143, 59144, 534352, 130];
26025
26169
  return supportedChains.includes(chainId);
@@ -26123,41 +26267,6 @@ const CoinleyPaymentInternal = ({
26123
26267
  ] })
26124
26268
  ] });
26125
26269
  };
26126
- const renderTransferSetupPanel = () => /* @__PURE__ */ jsxs("div", { className: "pt-1", children: [
26127
- renderCheckoutSelect({
26128
- id: "transfer-network",
26129
- label: "Select a Network",
26130
- value: selectedNetwork == null ? void 0 : selectedNetwork.id,
26131
- placeholder: "Select a network",
26132
- options: transferNetworks,
26133
- getLabel: (network) => getNetworkDisplayName(network),
26134
- getIcon: (network) => getNetworkDisplayLogo(network),
26135
- compact: true,
26136
- elevated: true,
26137
- maxVisibleItems: 4,
26138
- onChange: (networkId) => {
26139
- const network = transferNetworks.find((item) => item.id === networkId);
26140
- if (network) handleNetworkSelect(network);
26141
- }
26142
- }),
26143
- renderCheckoutSelect({
26144
- id: "transfer-token",
26145
- label: "Pick a Token",
26146
- value: selectedToken == null ? void 0 : selectedToken.id,
26147
- placeholder: selectedNetwork ? "Select a token" : "Select a token",
26148
- disabled: !selectedNetwork || availableTokens.length === 0,
26149
- options: availableTokens,
26150
- getLabel: (token) => getTokenDisplaySymbol(token),
26151
- getIcon: (token) => getTokenDisplayLogo(token),
26152
- compact: true,
26153
- elevated: true,
26154
- maxVisibleItems: 2,
26155
- onChange: (tokenId) => {
26156
- const token = availableTokens.find((item) => item.id === tokenId);
26157
- if (token) handleTokenSelect(token);
26158
- }
26159
- })
26160
- ] });
26161
26270
  const renderWalletExtensionSetupPanel = () => /* @__PURE__ */ jsxs("div", { className: "pt-1", children: [
26162
26271
  !selectedNetwork && renderWalletNetworkPickerPanel(),
26163
26272
  selectedNetwork && !selectedToken && renderWalletTokenPickerPanel(),
@@ -26216,7 +26325,7 @@ const CoinleyPaymentInternal = ({
26216
26325
  className: "h-8 w-full rounded-lg border border-[#E5E7EB] bg-white px-3 text-xs text-[#1F2430] outline-none placeholder:text-[#A9ABB2] focus:border-[#B49AF0]"
26217
26326
  }
26218
26327
  ) }),
26219
- /* @__PURE__ */ jsx("div", { className: "grid grid-cols-2 gap-2", children: visibleWalletNetworkOptions.length > 0 ? visibleWalletNetworkOptions.map((network) => /* @__PURE__ */ jsxs(
26328
+ /* @__PURE__ */ jsx("div", { className: "grid grid-cols-1 gap-2 min-[360px]:grid-cols-2", children: visibleWalletNetworkOptions.length > 0 ? visibleWalletNetworkOptions.map((network) => /* @__PURE__ */ jsxs(
26220
26329
  "button",
26221
26330
  {
26222
26331
  type: "button",
@@ -26226,7 +26335,7 @@ const CoinleyPaymentInternal = ({
26226
26335
  setPaymentData(null);
26227
26336
  setWalletNetworkSearch("");
26228
26337
  },
26229
- className: "flex h-10 items-center gap-2 rounded-xl bg-[#FAFAFB] px-3 text-left text-sm text-[#1F2430] transition-colors hover:bg-purple-50",
26338
+ className: "flex min-h-10 items-center gap-2 rounded-xl bg-[#FAFAFB] px-3 py-2 text-left text-sm text-[#1F2430] transition-colors hover:bg-purple-50",
26230
26339
  children: [
26231
26340
  /* @__PURE__ */ jsx(
26232
26341
  "img",
@@ -26300,7 +26409,7 @@ const CoinleyPaymentInternal = ({
26300
26409
  className: "mb-2 h-8 w-full rounded-lg border border-[#E5E7EB] bg-white px-3 text-xs text-[#1F2430] outline-none placeholder:text-[#A9ABB2] focus:border-[#B49AF0]"
26301
26410
  }
26302
26411
  ),
26303
- /* @__PURE__ */ jsx("div", { className: "grid grid-cols-2 gap-2", children: visibleWalletTokens.length > 0 ? visibleWalletTokens.map((token) => /* @__PURE__ */ jsxs(
26412
+ /* @__PURE__ */ jsx("div", { className: "grid grid-cols-1 gap-2 min-[360px]:grid-cols-2", children: visibleWalletTokens.length > 0 ? visibleWalletTokens.map((token) => /* @__PURE__ */ jsxs(
26304
26413
  "button",
26305
26414
  {
26306
26415
  type: "button",
@@ -26309,7 +26418,7 @@ const CoinleyPaymentInternal = ({
26309
26418
  setTokenSearch("");
26310
26419
  setPaymentData(null);
26311
26420
  },
26312
- className: "flex h-10 items-center gap-2 rounded-xl bg-[#FAFAFB] px-3 text-left text-sm text-[#1F2430] transition-colors hover:bg-purple-50",
26421
+ className: "flex min-h-10 items-center gap-2 rounded-xl bg-[#FAFAFB] px-3 py-2 text-left text-sm text-[#1F2430] transition-colors hover:bg-purple-50",
26313
26422
  children: [
26314
26423
  /* @__PURE__ */ jsx(
26315
26424
  "img",
@@ -26398,13 +26507,13 @@ const CoinleyPaymentInternal = ({
26398
26507
  }
26399
26508
  }),
26400
26509
  /* @__PURE__ */ jsx("p", { className: "mb-2 text-xs font-medium text-[#1F2430]", children: "Please select your wallet app" }),
26401
- /* @__PURE__ */ jsx("div", { className: "mb-3 grid grid-cols-3 gap-1.5", children: qrWalletOptions.map((wallet) => /* @__PURE__ */ jsxs(
26510
+ /* @__PURE__ */ jsx("div", { className: "mb-3 grid grid-cols-1 gap-1.5 min-[360px]:grid-cols-3", children: qrWalletOptions.map((wallet) => /* @__PURE__ */ jsxs(
26402
26511
  "button",
26403
26512
  {
26404
26513
  type: "button",
26405
26514
  onClick: () => handleQrWalletSelect(wallet.id),
26406
26515
  disabled: !selectedNetwork || !selectedToken || qrLoading || isConverting,
26407
- className: `relative flex h-[76px] flex-col items-start justify-between rounded-lg border bg-[#FAFAFB] px-3 py-3 text-left transition-colors ${preferredWallet === wallet.id ? "border-[#7042D2] bg-[#FBF8FF]" : "border-[#EEF0F4] hover:border-[#C9B8F6]"} disabled:cursor-not-allowed disabled:opacity-60`,
26516
+ className: `relative flex min-h-[64px] flex-row items-center gap-2 rounded-lg border bg-[#FAFAFB] px-3 py-3 text-left transition-colors min-[360px]:h-[76px] min-[360px]:flex-col min-[360px]:items-start min-[360px]:justify-between ${preferredWallet === wallet.id ? "border-[#7042D2] bg-[#FBF8FF]" : "border-[#EEF0F4] hover:border-[#C9B8F6]"} disabled:cursor-not-allowed disabled:opacity-60`,
26408
26517
  children: [
26409
26518
  preferredWallet === wallet.id && qrWalletChoiceConfirmed && /* @__PURE__ */ jsx("span", { className: "absolute right-[-5px] top-[-6px] flex h-4 w-4 items-center justify-center rounded-full border border-[#7042D2] bg-white text-[#7042D2]", children: /* @__PURE__ */ jsx("svg", { className: "h-2.5 w-2.5", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 3, d: "M5 13l4 4L19 7" }) }) }),
26410
26519
  /* @__PURE__ */ jsx(
@@ -26418,7 +26527,7 @@ const CoinleyPaymentInternal = ({
26418
26527
  }
26419
26528
  }
26420
26529
  ),
26421
- /* @__PURE__ */ jsx("span", { className: "truncate text-sm font-medium text-[#111827]", children: wallet.name })
26530
+ /* @__PURE__ */ jsx("span", { className: "min-w-0 truncate text-sm font-medium text-[#111827]", children: wallet.name })
26422
26531
  ]
26423
26532
  },
26424
26533
  wallet.id
@@ -26430,7 +26539,7 @@ const CoinleyPaymentInternal = ({
26430
26539
  /* @__PURE__ */ jsx("p", { className: "text-xs leading-5 text-[#9EA0A8]", children: "Simply select a wallet app to generate the QR code then input the amount, and transfer your funds" })
26431
26540
  ] });
26432
26541
  const renderQrPaymentPanel = () => /* @__PURE__ */ jsxs("div", { className: "pt-1", children: [
26433
- /* @__PURE__ */ jsxs("div", { className: "mb-4 flex items-start gap-4", children: [
26542
+ /* @__PURE__ */ jsxs("div", { className: "mb-4 flex flex-col gap-3 min-[380px]:flex-row min-[380px]:items-start", children: [
26434
26543
  /* @__PURE__ */ jsx("div", { className: "h-[92px] w-[92px] flex-shrink-0 bg-white", children: qrCodeDataUrl ? /* @__PURE__ */ jsx("img", { src: qrCodeDataUrl, alt: "Payment QR Code", className: "h-full w-full" }) : /* @__PURE__ */ jsx("div", { className: "flex h-full w-full items-center justify-center rounded-lg bg-gray-100", children: /* @__PURE__ */ jsx("div", { className: "h-6 w-6 animate-spin rounded-full border-2 border-[#E5E7EB] border-t-[#7042D2]" }) }) }),
26435
26544
  /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
26436
26545
  /* @__PURE__ */ jsx("p", { className: "mb-2 text-base font-semibold text-[#111827]", children: "Instructions" }),
@@ -26575,7 +26684,7 @@ const CoinleyPaymentInternal = ({
26575
26684
  renderFooterPrimaryButton({
26576
26685
  label: mobileWalletRedirecting === selectedMobileWallet ? `Opening ${walletName}...` : selectedMobileWallet ? `Open ${walletName}` : "Choose a Wallet",
26577
26686
  onClick: handleMobileWalletPay,
26578
- disabled: !selectedMobileWallet || !selectedNetwork || !selectedToken || mobileWalletRedirecting === selectedMobileWallet || loading || isSwapOrBridgeFlow && (relayBridge.bridgeStatus === "quoting" || (selectedToken == null ? void 0 : selectedToken.routeStatus) === "unsupported")
26687
+ disabled: !selectedMobileWallet || !selectedNetwork || !selectedToken || mobileWalletRedirecting === selectedMobileWallet || loading || isConverting || isSwapOrBridgeFlow && (relayBridge.bridgeStatus === "quoting" || (selectedToken == null ? void 0 : selectedToken.routeStatus) === "unsupported")
26579
26688
  }),
26580
26689
  renderFooterPrimaryButton({ label: "Cancel", onClick: handleCancel, variant: "secondary" }),
26581
26690
  /* @__PURE__ */ jsx(
@@ -26592,6 +26701,13 @@ const CoinleyPaymentInternal = ({
26592
26701
  )
26593
26702
  ] });
26594
26703
  }
26704
+ if (isCrossChainTransferSetupView) {
26705
+ return renderFooterPrimaryButton({
26706
+ label: ccGenerating ? "Generating Address..." : `Pay ${paymentAmountLabel}`,
26707
+ onClick: handleGenerateCrossChain,
26708
+ disabled: !ccOriginToken || ccGenerating || isConverting
26709
+ });
26710
+ }
26595
26711
  if (activeTab === PAYMENT_TABS.TRANSFER && selectedNetwork && selectedToken && (paymentData == null ? void 0 : paymentData.depositAddress) && underpaymentInfo) {
26596
26712
  if (underpaymentView === "choice") {
26597
26713
  return renderFooterPrimaryButton({
@@ -26763,11 +26879,11 @@ const CoinleyPaymentInternal = ({
26763
26879
  }
26764
26880
  ),
26765
26881
  /* @__PURE__ */ jsx("span", { className: "text-sm font-medium", children: selectedNetwork.name })
26766
- ] }) : /* @__PURE__ */ jsx("div", { className: "grid grid-cols-2 gap-3", children: merchantFilteredNetworks.map((network) => /* @__PURE__ */ jsxs(
26882
+ ] }) : /* @__PURE__ */ jsx("div", { className: "grid grid-cols-1 gap-2 min-[380px]:grid-cols-2", children: merchantFilteredNetworks.map((network) => /* @__PURE__ */ jsxs(
26767
26883
  "button",
26768
26884
  {
26769
26885
  onClick: () => handleNetworkSelect(network),
26770
- className: "flex items-center gap-3 p-3 rounded-xl border-2 border-gray-100 hover:border-[#7042D2] hover:bg-purple-50 transition-all text-left",
26886
+ className: "flex min-w-0 items-center gap-3 rounded-xl border-2 border-gray-100 p-3 text-left transition-all hover:border-[#7042D2] hover:bg-purple-50",
26771
26887
  children: [
26772
26888
  /* @__PURE__ */ jsx(
26773
26889
  "img",
@@ -26812,7 +26928,7 @@ const CoinleyPaymentInternal = ({
26812
26928
  className: "w-full mb-3 px-3 py-2 text-sm border border-gray-200 rounded-xl focus:outline-none focus:ring-2 focus:ring-[#7042D2] focus:border-transparent"
26813
26929
  }
26814
26930
  ),
26815
- /* @__PURE__ */ jsx("div", { className: "grid grid-cols-2 gap-3", children: availableTokens.filter((t) => {
26931
+ /* @__PURE__ */ jsx("div", { className: "grid grid-cols-1 gap-2 min-[380px]:grid-cols-2", children: availableTokens.filter((t) => {
26816
26932
  var _a3;
26817
26933
  return !tokenSearch || t.symbol.toLowerCase().includes(tokenSearch.toLowerCase()) || ((_a3 = t.name) == null ? void 0 : _a3.toLowerCase().includes(tokenSearch.toLowerCase()));
26818
26934
  }).map((token) => /* @__PURE__ */ jsxs(
@@ -26822,7 +26938,7 @@ const CoinleyPaymentInternal = ({
26822
26938
  handleTokenSelect(token);
26823
26939
  setTokenSearch("");
26824
26940
  },
26825
- className: "flex items-center gap-3 p-3 rounded-xl border-2 border-gray-100 hover:border-[#7042D2] hover:bg-purple-50 transition-all text-left",
26941
+ className: "flex min-w-0 items-center gap-3 rounded-xl border-2 border-gray-100 p-3 text-left transition-all hover:border-[#7042D2] hover:bg-purple-50",
26826
26942
  children: [
26827
26943
  /* @__PURE__ */ jsx(
26828
26944
  "img",
@@ -26956,36 +27072,81 @@ const CoinleyPaymentInternal = ({
26956
27072
  ] }),
26957
27073
  activeTab === PAYMENT_TABS.QR && /* @__PURE__ */ jsx(Fragment, { children: qrWalletChoiceConfirmed ? renderQrPaymentPanel() : renderQrWalletChoicePanel() }),
26958
27074
  activeTab === PAYMENT_TABS.TRANSFER && /* @__PURE__ */ jsxs(Fragment, { children: [
26959
- (!selectedNetwork || !selectedToken || !(paymentData == null ? void 0 : paymentData.depositAddress)) && renderTransferSetupPanel(),
26960
- selectedNetwork && selectedToken && (paymentData == null ? void 0 : paymentData.depositAddress) && (underpaymentInfo ? /* @__PURE__ */ jsx(Fragment, { children: underpaymentView === "offset" ? renderUnderpaymentOffsetPanel() : underpaymentView === "refund" ? renderUnderpaymentRefundPanel() : renderUnderpaymentChoicePanel() }) : /* @__PURE__ */ jsxs("div", { className: "pt-1", children: [
26961
- (expirationTime == null ? void 0 : expirationTime.expired) && /* @__PURE__ */ jsx("div", { className: "mb-4 rounded-lg border border-red-200 bg-red-50 px-3 py-2 text-xs font-medium text-red-600", children: "Timer exhausted - No transaction detected. Please generate a new address." }),
26962
- /* @__PURE__ */ jsxs("div", { className: "mb-5 flex items-start gap-3", children: [
26963
- /* @__PURE__ */ jsx("div", { className: "h-[92px] w-[92px] flex-shrink-0 bg-white", children: depositQrCode ? /* @__PURE__ */ jsx("img", { src: depositQrCode, alt: "Deposit Address QR Code", className: "h-full w-full" }) : /* @__PURE__ */ jsx("div", { className: "flex h-full w-full items-center justify-center rounded-lg bg-gray-100", children: /* @__PURE__ */ jsx("div", { className: "h-6 w-6 animate-spin rounded-full border-2 border-[#E5E7EB] border-t-[#7042D2]" }) }) }),
26964
- /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1 pt-1", children: [
27075
+ !ccResult && /* @__PURE__ */ jsxs("div", { className: "pt-1", children: [
27076
+ renderCheckoutSelect({
27077
+ id: "cross-chain-network",
27078
+ label: "Select a Network",
27079
+ value: ccOriginChainId,
27080
+ placeholder: "Select a network",
27081
+ options: ccSources.map((s) => ({ id: String(s.chainId), chainId: s.chainId })),
27082
+ getLabel: (o) => ccChainName(o.chainId),
27083
+ getIcon: (o) => ccChainIcon(o.chainId),
27084
+ compact: true,
27085
+ elevated: true,
27086
+ maxVisibleItems: 4,
27087
+ onChange: (chainId) => {
27088
+ setCcOriginChainId(chainId);
27089
+ setCcOriginToken(null);
27090
+ }
27091
+ }),
27092
+ renderCheckoutSelect({
27093
+ id: "cross-chain-token",
27094
+ label: "Pick a Token",
27095
+ value: ccOriginToken == null ? void 0 : ccOriginToken.address,
27096
+ placeholder: "Select a token",
27097
+ disabled: !ccOriginChainId || ccOriginTokens.length === 0,
27098
+ options: ccOriginTokens.map((t) => ({ id: t.address, ...t })),
27099
+ getLabel: (o) => o.symbol,
27100
+ compact: true,
27101
+ elevated: true,
27102
+ maxVisibleItems: 4,
27103
+ onChange: (address2) => setCcOriginToken(ccOriginTokens.find((t) => t.address === address2) || null)
27104
+ }),
27105
+ ccError && /* @__PURE__ */ jsx("div", { className: "mb-3 rounded-lg border border-red-200 bg-red-50 px-3 py-2 text-xs font-medium text-red-600", children: ccError })
27106
+ ] }),
27107
+ ccResult && /* @__PURE__ */ jsxs("div", { className: "pt-1", children: [
27108
+ /* @__PURE__ */ jsxs("div", { className: "mb-4 text-center", children: [
27109
+ /* @__PURE__ */ jsx("p", { className: "text-xs uppercase tracking-wide text-[#9EA0A8]", children: "Send exactly" }),
27110
+ /* @__PURE__ */ jsxs("p", { className: "text-2xl font-bold text-[#1F2430]", children: [
27111
+ ccResult.amountToSendFormatted,
27112
+ " ",
27113
+ ccOriginToken == null ? void 0 : ccOriginToken.symbol
27114
+ ] }),
27115
+ /* @__PURE__ */ jsxs("p", { className: "text-sm text-[#535865]", children: [
27116
+ "on ",
27117
+ ccChainName(ccResult.originChainId)
27118
+ ] })
27119
+ ] }),
27120
+ /* @__PURE__ */ jsx("p", { className: "mb-4 text-xs leading-5 text-[#9EA0A8]", children: "Simply scan the QR code which holds just the address, or copy it, and send the exact amount shown." }),
27121
+ /* @__PURE__ */ jsxs("div", { className: "mb-5 flex flex-col gap-3 min-[380px]:flex-row min-[380px]:items-center", children: [
27122
+ /* @__PURE__ */ jsx("div", { className: "h-[92px] w-[92px] flex-shrink-0 bg-white", children: ccQrCode ? /* @__PURE__ */ jsx("img", { src: ccQrCode, alt: "Payment Address QR Code", className: "h-full w-full" }) : /* @__PURE__ */ jsx("div", { className: "flex h-full w-full items-center justify-center rounded-lg bg-gray-100", children: /* @__PURE__ */ jsx("div", { className: "h-6 w-6 animate-spin rounded-full border-2 border-[#E5E7EB] border-t-[#7042D2]" }) }) }),
27123
+ /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
26965
27124
  /* @__PURE__ */ jsx("p", { className: "mb-2 text-xs font-medium text-[#1F2430]", children: "Wallet address" }),
26966
- /* @__PURE__ */ jsxs("div", { className: "flex min-h-[58px] items-center gap-2 rounded-xl border border-[#EEF0F4] bg-[#FAFAFB] px-3 py-2", children: [
26967
- /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 break-all text-sm leading-5 text-[#1F2430]", children: paymentData.depositAddress }),
27125
+ /* @__PURE__ */ jsxs("div", { className: "flex min-h-[60px] items-center gap-2 rounded-xl border border-[#EEF0F4] bg-[#FAFAFB] px-3 py-2", children: [
27126
+ /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 break-all text-sm leading-5 text-[#1F2430]", children: ccResult.relayDepositAddress }),
26968
27127
  /* @__PURE__ */ jsx(
26969
27128
  "button",
26970
27129
  {
26971
- onClick: () => copyToClipboard(paymentData.depositAddress, "depositAddress"),
26972
- className: `flex h-8 w-8 flex-shrink-0 items-center justify-center rounded-lg transition-colors ${copiedField === "depositAddress" ? "bg-green-100 text-green-600" : "text-[#7042D2] hover:bg-purple-50"}`,
27130
+ onClick: () => copyToClipboard(ccResult.relayDepositAddress, "ccAddress"),
27131
+ className: `flex h-8 w-8 flex-shrink-0 items-center justify-center rounded-lg transition-colors ${copiedField === "ccAddress" ? "bg-green-100 text-green-600" : "text-[#7042D2] hover:bg-purple-50"}`,
26973
27132
  "aria-label": "Copy wallet address",
26974
- children: copiedField === "depositAddress" ? /* @__PURE__ */ jsx("svg", { className: "h-4 w-4", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M5 13l4 4L19 7" }) }) : /* @__PURE__ */ jsx("svg", { className: "h-4 w-4", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z" }) })
27133
+ children: copiedField === "ccAddress" ? /* @__PURE__ */ jsx("svg", { className: "h-4 w-4", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M5 13l4 4L19 7" }) }) : /* @__PURE__ */ jsx("svg", { className: "h-4 w-4", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z" }) })
26975
27134
  }
26976
27135
  )
26977
27136
  ] })
26978
27137
  ] })
26979
27138
  ] }),
26980
- /* @__PURE__ */ jsxs("div", { className: "mb-3 rounded-lg border border-[#F5E5B8] bg-[#FFF9E8] px-3 py-2.5", children: [
26981
- /* @__PURE__ */ jsxs("div", { className: "mb-1 flex items-center gap-2 text-[#C55A11]", children: [
26982
- /* @__PURE__ */ jsx("svg", { className: "h-4 w-4 flex-shrink-0", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M12 9v4m0 4h.01M12 3a9 9 0 110 18 9 9 0 010-18z" }) }),
26983
- /* @__PURE__ */ jsx("span", { className: "text-xs font-semibold", children: "Important!" })
27139
+ ccPhase === "failed" ? /* @__PURE__ */ jsx("div", { className: "rounded-lg border border-red-200 bg-red-50 px-3 py-2 text-center text-xs font-medium text-red-600", children: "Payment failed — please try again" }) : ccPhase === "received" || ccPhase === "settled" ? /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-center gap-2 text-xs font-medium text-green-600", children: [
27140
+ /* @__PURE__ */ jsx("span", { className: "relative inline-flex h-2 w-2 rounded-full bg-green-500" }),
27141
+ "Payment received"
27142
+ ] }) : /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-center gap-2 text-xs text-[#A3A5AC]", children: [
27143
+ /* @__PURE__ */ jsxs("span", { className: "relative flex h-2 w-2", children: [
27144
+ /* @__PURE__ */ jsx("span", { className: "animate-ping absolute inline-flex h-full w-full rounded-full bg-green-400 opacity-75" }),
27145
+ /* @__PURE__ */ jsx("span", { className: "relative inline-flex rounded-full h-2 w-2 bg-green-500" })
26984
27146
  ] }),
26985
- /* @__PURE__ */ jsx("p", { className: "pl-6 text-xs leading-5 text-[#C55A11]", children: "We must receive the exact amount shown. If your exchange charges a withdrawal fee, add it on top of this amount before sending." })
26986
- ] }),
26987
- manualCheckStatus === "not_found" && !(expirationTime == null ? void 0 : expirationTime.expired) && /* @__PURE__ */ jsx("div", { className: "mb-3 rounded-xl border border-amber-200 bg-amber-50 p-3", children: /* @__PURE__ */ jsx("p", { className: "text-sm leading-5 text-amber-700", children: "We haven't received your payment yet. It may take a few moments for the transaction to appear on the blockchain. We'll keep checking automatically." }) })
26988
- ] }))
27147
+ "Checking automatically every few seconds..."
27148
+ ] })
27149
+ ] })
26989
27150
  ] }),
26990
27151
  (error || transactionError) && /* @__PURE__ */ jsxs("div", { className: "mt-4 p-4 bg-red-50 border border-red-200 rounded-xl", children: [
26991
27152
  /* @__PURE__ */ jsx("p", { className: "text-red-800 text-sm", children: error || transactionError }),
@@ -27019,7 +27180,7 @@ const CoinleyPaymentInternal = ({
27019
27180
  )
27020
27181
  ] });
27021
27182
  };
27022
- const isTransferAddressGenerated = activeTab === PAYMENT_TABS.TRANSFER && selectedNetwork && selectedToken && (paymentData == null ? void 0 : paymentData.depositAddress);
27183
+ const isTransferAddressGenerated = activeTab === PAYMENT_TABS.TRANSFER && (selectedNetwork && selectedToken && (paymentData == null ? void 0 : paymentData.depositAddress) || ccResult);
27023
27184
  const isWalletReadyForPayment = isWalletExtensionReadyView;
27024
27185
  const isWalletBackHeaderView = activeTab === PAYMENT_TABS.WALLET && showWalletConfirm;
27025
27186
  const isWalletTokenSelectionView = activeTab === PAYMENT_TABS.WALLET && selectedNetwork && !selectedToken && !showWalletConfirm && !(showMobileWalletPicker && isMobile);
@@ -27029,6 +27190,14 @@ const CoinleyPaymentInternal = ({
27029
27190
  setUnderpaymentView("choice");
27030
27191
  return;
27031
27192
  }
27193
+ if (ccResult) {
27194
+ setCcResult(null);
27195
+ setCcQrCode("");
27196
+ setCcPhase("idle");
27197
+ setCcError(null);
27198
+ ccSucceeded.current = false;
27199
+ return;
27200
+ }
27032
27201
  clearUnderpaymentRecovery(paymentData == null ? void 0 : paymentData.id);
27033
27202
  setPaymentData((prev) => {
27034
27203
  if (!prev) return prev;
@@ -27071,15 +27240,19 @@ const CoinleyPaymentInternal = ({
27071
27240
  "transfer-token",
27072
27241
  "qr-network",
27073
27242
  "qr-token",
27074
- "wallet-choice"
27243
+ "wallet-choice",
27244
+ "cross-chain-network",
27245
+ "cross-chain-token"
27075
27246
  ].includes(openCheckoutDropdown);
27076
27247
  return /* @__PURE__ */ jsxs("div", { id: SDK_ROOT_ID, className: `${SDK_ROOT_CLASS} fixed inset-0 z-50`, style: { fontFamily: FONT_FAMILY }, children: [
27077
27248
  /* @__PURE__ */ jsx("div", { className: "fixed inset-0 bg-black bg-opacity-50", onClick: handleCancel }),
27078
- /* @__PURE__ */ jsx("div", { className: isMobile ? "fixed inset-0 flex items-end" : "fixed inset-0 flex items-center justify-center p-4", style: { zIndex: 51 }, children: /* @__PURE__ */ jsxs("div", { className: isMobile ? "relative bg-white rounded-t-[28px] shadow-2xl w-full max-h-[96vh] overflow-hidden flex flex-col animate-slide-up-sheet" : `relative bg-white rounded-[28px] shadow-2xl w-[430px] ${isTransferAddressGenerated ? "h-[640px]" : "h-[600px]"} max-h-[calc(100vh-32px)] overflow-hidden flex flex-col`, children: [
27079
- /* @__PURE__ */ jsx("span", { className: `pointer-events-none absolute left-[-10px] ${isTransferAddressGenerated ? "top-[36%]" : "top-[44%]"} z-20 h-5 w-5 rounded-full bg-black/50` }),
27080
- /* @__PURE__ */ jsx("span", { className: `pointer-events-none absolute right-[-10px] ${isTransferAddressGenerated ? "top-[36%]" : "top-[44%]"} z-20 h-5 w-5 rounded-full bg-black/50` }),
27249
+ /* @__PURE__ */ jsx("div", { className: isMobile ? "fixed inset-0 flex items-end" : "fixed inset-0 flex items-center justify-center p-4", style: { zIndex: 51 }, children: /* @__PURE__ */ jsxs("div", { className: isMobile ? "coinley-mobile-sheet relative bg-white rounded-t-[24px] shadow-2xl w-full max-h-[96dvh] overflow-hidden flex flex-col animate-slide-up-sheet" : `relative bg-white rounded-[28px] shadow-2xl w-[430px] ${isTransferAddressGenerated ? "h-[640px]" : "h-[600px]"} max-h-[calc(100vh-32px)] overflow-hidden flex flex-col`, children: [
27250
+ !isMobile && /* @__PURE__ */ jsxs(Fragment, { children: [
27251
+ /* @__PURE__ */ jsx("span", { className: `pointer-events-none absolute left-[-10px] ${isTransferAddressGenerated ? "top-[36%]" : "top-[44%]"} z-20 h-5 w-5 rounded-full bg-black/50` }),
27252
+ /* @__PURE__ */ jsx("span", { className: `pointer-events-none absolute right-[-10px] ${isTransferAddressGenerated ? "top-[36%]" : "top-[44%]"} z-20 h-5 w-5 rounded-full bg-black/50` })
27253
+ ] }),
27081
27254
  isMobile && /* @__PURE__ */ jsx("div", { className: "flex justify-center pt-3 pb-1 flex-shrink-0", children: /* @__PURE__ */ jsx("div", { className: "w-10 h-1 bg-gray-300 rounded-full" }) }),
27082
- /* @__PURE__ */ jsxs("div", { className: `flex min-h-0 flex-1 flex-col px-4 ${isTightWalletView ? "pb-2 pt-3" : "pb-4 pt-4"}`, children: [
27255
+ /* @__PURE__ */ jsxs("div", { className: `flex min-h-0 flex-1 flex-col ${isMobile ? "px-3" : "px-4"} ${isTightWalletView ? "pb-2 pt-3" : "pb-4 pt-4"}`, children: [
27083
27256
  /* @__PURE__ */ jsxs("div", { className: `${isTightWalletView ? "mb-3" : "mb-5"} flex items-center justify-between`, children: [
27084
27257
  isTransferAddressGenerated || isWalletReadyForPayment || isQrPaymentActiveView || isWalletBackHeaderView || isWalletTokenSelectionView ? /* @__PURE__ */ jsx(
27085
27258
  "button",
@@ -27142,4 +27315,4 @@ export {
27142
27315
  isFeatureEnabled as i,
27143
27316
  logo as l
27144
27317
  };
27145
- //# sourceMappingURL=CoinleyPayment-Cmw8jI0B.js.map
27318
+ //# sourceMappingURL=CoinleyPayment-DUMYMJUv.js.map