@tonconnect/ui 2.0.1-beta.1 → 2.0.1-beta.3

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/lib/index.mjs CHANGED
@@ -1749,7 +1749,32 @@ class TonConnectUIError extends TonConnectError {
1749
1749
  Object.setPrototypeOf(this, TonConnectUIError.prototype);
1750
1750
  }
1751
1751
  }
1752
+ function logDebug(...args) {
1753
+ {
1754
+ try {
1755
+ console.debug("[TON_CONNECT_UI]", ...args);
1756
+ } catch (e2) {
1757
+ }
1758
+ }
1759
+ }
1760
+ function logError(...args) {
1761
+ {
1762
+ try {
1763
+ console.error("[TON_CONNECT_UI]", ...args);
1764
+ } catch (e2) {
1765
+ }
1766
+ }
1767
+ }
1768
+ function logWarning(...args) {
1769
+ {
1770
+ try {
1771
+ console.warn("[TON_CONNECT_UI]", ...args);
1772
+ } catch (e2) {
1773
+ }
1774
+ }
1775
+ }
1752
1776
  function openLink(href, target = "_self") {
1777
+ logDebug("openLink", href, target);
1753
1778
  window.open(href, target, "noopener noreferrer");
1754
1779
  }
1755
1780
  function openLinkBlank(href) {
@@ -1757,7 +1782,7 @@ function openLinkBlank(href) {
1757
1782
  }
1758
1783
  function openDeeplinkWithFallback(href, fallback) {
1759
1784
  const doFallback = () => {
1760
- if (isBrowser("safari")) {
1785
+ if (isBrowser("safari") || isOS("android") && isBrowser("firefox")) {
1761
1786
  return;
1762
1787
  }
1763
1788
  fallback();
@@ -1877,6 +1902,9 @@ function getUserAgent() {
1877
1902
  case (browserName == null ? void 0 : browserName.includes("safari")):
1878
1903
  browser = "safari";
1879
1904
  break;
1905
+ case (browserName == null ? void 0 : browserName.includes("opera")):
1906
+ browser = "opera";
1907
+ break;
1880
1908
  }
1881
1909
  return {
1882
1910
  os,
@@ -2626,22 +2654,6 @@ const Image = (props) => {
2626
2654
  }
2627
2655
  })];
2628
2656
  };
2629
- function logError(...args) {
2630
- {
2631
- try {
2632
- console.error("[TON_CONNECT_UI]", ...args);
2633
- } catch (e2) {
2634
- }
2635
- }
2636
- }
2637
- function logWarning(...args) {
2638
- {
2639
- try {
2640
- console.warn("[TON_CONNECT_UI]", ...args);
2641
- } catch (e2) {
2642
- }
2643
- }
2644
- }
2645
2657
  let initParams = {};
2646
2658
  try {
2647
2659
  let locationHash = location.hash.toString();
@@ -2674,12 +2686,18 @@ function isInTMA() {
2674
2686
  function sendExpand() {
2675
2687
  postEvent("web_app_expand", {});
2676
2688
  }
2677
- function sendOpenTelegramLink(link) {
2689
+ function sendOpenTelegramLink(link, fallback) {
2678
2690
  const url = new URL(link);
2679
2691
  if (url.protocol !== "http:" && url.protocol !== "https:") {
2692
+ if (fallback) {
2693
+ return fallback();
2694
+ }
2680
2695
  throw new TonConnectUIError(`Url protocol is not supported: ${url}`);
2681
2696
  }
2682
2697
  if (url.hostname !== "t.me") {
2698
+ if (fallback) {
2699
+ return fallback();
2700
+ }
2683
2701
  throw new TonConnectUIError(`Url host is not supported: ${url}`);
2684
2702
  }
2685
2703
  const pathFull = url.pathname + url.search;
@@ -2707,12 +2725,15 @@ function postEvent(eventType, eventData) {
2707
2725
  throw new TonConnectUIError(`Can't post event to parent window: window is not defined`);
2708
2726
  }
2709
2727
  if (window2.TelegramWebviewProxy !== void 0) {
2728
+ logDebug("postEvent", eventType, eventData);
2710
2729
  window2.TelegramWebviewProxy.postEvent(eventType, JSON.stringify(eventData));
2711
2730
  } else if (window2.external && "notify" in window2.external) {
2731
+ logDebug("postEvent", eventType, eventData);
2712
2732
  window2.external.notify(JSON.stringify({ eventType, eventData }));
2713
2733
  } else if (isIframe()) {
2714
2734
  const trustedTarget = "*";
2715
2735
  const message = JSON.stringify({ eventType, eventData });
2736
+ logDebug("postEvent", eventType, eventData);
2716
2737
  window2.parent.postMessage(message, trustedTarget);
2717
2738
  } else {
2718
2739
  throw new TonConnectUIError(`Can't post event to TMA`);
@@ -8308,9 +8329,46 @@ function redirectToTelegram(universalLink, options) {
8308
8329
  openLinkBlank(addReturnStrategy(directLinkUrl.toString(), options));
8309
8330
  }
8310
8331
  } else {
8311
- if (isOS("ios", "android")) {
8312
- options.returnStrategy = location.href;
8313
- openLinkBlank(addReturnStrategy(directLinkUrl.toString(), options.returnStrategy));
8332
+ if (isOS("ios")) {
8333
+ if (options.returnStrategy === "back") {
8334
+ options.returnStrategy = location.href;
8335
+ }
8336
+ const isChrome = isBrowser("chrome");
8337
+ const isFirefox = isBrowser("firefox");
8338
+ const useDeepLink = (isChrome || isFirefox) && !options.forceRedirect;
8339
+ if (useDeepLink) {
8340
+ const linkWithStrategy = addReturnStrategy(
8341
+ directLinkUrl.toString(),
8342
+ options.returnStrategy
8343
+ );
8344
+ const deepLink = convertToTGDeepLink(linkWithStrategy);
8345
+ openDeeplinkWithFallback(deepLink, () => openLinkBlank(linkWithStrategy));
8346
+ } else {
8347
+ const linkWithStrategy = addReturnStrategy(
8348
+ directLinkUrl.toString(),
8349
+ options.returnStrategy
8350
+ );
8351
+ openLinkBlank(linkWithStrategy);
8352
+ }
8353
+ } else if (isOS("android")) {
8354
+ options.returnStrategy = "none";
8355
+ const isChrome = isBrowser("chrome");
8356
+ const isFirefox = isBrowser("firefox");
8357
+ const useDeepLink = (isChrome || isFirefox) && !options.forceRedirect;
8358
+ if (useDeepLink) {
8359
+ const linkWithStrategy = addReturnStrategy(
8360
+ directLinkUrl.toString(),
8361
+ options.returnStrategy
8362
+ );
8363
+ const deepLink = convertToTGDeepLink(linkWithStrategy);
8364
+ openDeeplinkWithFallback(deepLink, () => openLinkBlank(linkWithStrategy));
8365
+ } else {
8366
+ const linkWithStrategy = addReturnStrategy(
8367
+ directLinkUrl.toString(),
8368
+ options.returnStrategy
8369
+ );
8370
+ openLinkBlank(linkWithStrategy);
8371
+ }
8314
8372
  } else if (isOS("macos", "windows", "linux")) {
8315
8373
  options.returnStrategy = "none";
8316
8374
  options.twaReturnUrl = void 0;
@@ -8326,6 +8384,160 @@ function redirectToTelegram(universalLink, options) {
8326
8384
  }
8327
8385
  }
8328
8386
  }
8387
+ function redirectToWallet(universalLink, deepLink, options, setOpenMethod) {
8388
+ options = __spreadValues({}, options);
8389
+ if (isInTMA()) {
8390
+ if (isTmaPlatform("ios", "android")) {
8391
+ if (options.returnStrategy === "back") {
8392
+ options.returnStrategy = "tg://resolve";
8393
+ }
8394
+ setOpenMethod("universal-link");
8395
+ const linkWitStrategy = addReturnStrategy(universalLink, options.returnStrategy);
8396
+ sendOpenTelegramLink(linkWitStrategy, () => {
8397
+ setOpenMethod("universal-link");
8398
+ openLinkBlank(linkWitStrategy);
8399
+ });
8400
+ } else if (isTmaPlatform("macos", "tdesktop")) {
8401
+ if (options.returnStrategy === "back") {
8402
+ options.returnStrategy = "tg://resolve";
8403
+ }
8404
+ const linkWitStrategy = addReturnStrategy(universalLink, options.returnStrategy);
8405
+ const useDeepLink = !!deepLink && !options.forceRedirect;
8406
+ if (useDeepLink) {
8407
+ setOpenMethod("custom-deeplink");
8408
+ openDeeplinkWithFallback(toDeeplink(linkWitStrategy, deepLink), () => {
8409
+ setOpenMethod("universal-link");
8410
+ openLinkBlank(linkWitStrategy);
8411
+ });
8412
+ } else {
8413
+ setOpenMethod("universal-link");
8414
+ openLinkBlank(linkWitStrategy);
8415
+ }
8416
+ } else if (isTmaPlatform("weba")) {
8417
+ if (options.returnStrategy === "back") {
8418
+ if (isBrowser("safari")) {
8419
+ options.returnStrategy = location.href;
8420
+ } else if (isBrowser("chrome")) {
8421
+ options.returnStrategy = "googlechrome://";
8422
+ } else if (isBrowser("firefox")) {
8423
+ options.returnStrategy = "firefox://";
8424
+ } else if (isBrowser("opera")) {
8425
+ options.returnStrategy = "opera-http://";
8426
+ } else {
8427
+ options.returnStrategy = location.href;
8428
+ }
8429
+ }
8430
+ const linkWitStrategy = addReturnStrategy(universalLink, options.returnStrategy);
8431
+ const useDeepLink = !!deepLink && !options.forceRedirect;
8432
+ if (useDeepLink) {
8433
+ setOpenMethod("custom-deeplink");
8434
+ openDeeplinkWithFallback(toDeeplink(linkWitStrategy, deepLink), () => {
8435
+ setOpenMethod("universal-link");
8436
+ openLinkBlank(linkWitStrategy);
8437
+ });
8438
+ } else {
8439
+ setOpenMethod("universal-link");
8440
+ openLinkBlank(linkWitStrategy);
8441
+ }
8442
+ } else if (isTmaPlatform("web")) {
8443
+ if (options.returnStrategy === "back") {
8444
+ if (isBrowser("safari")) {
8445
+ options.returnStrategy = location.href;
8446
+ } else if (isBrowser("chrome")) {
8447
+ options.returnStrategy = "googlechrome://";
8448
+ } else if (isBrowser("firefox")) {
8449
+ options.returnStrategy = "firefox://";
8450
+ } else if (isBrowser("opera")) {
8451
+ options.returnStrategy = "opera-http://";
8452
+ } else {
8453
+ options.returnStrategy = location.href;
8454
+ }
8455
+ }
8456
+ const linkWitStrategy = addReturnStrategy(universalLink, options.returnStrategy);
8457
+ const useDeepLink = !!deepLink && !options.forceRedirect;
8458
+ if (useDeepLink) {
8459
+ setOpenMethod("custom-deeplink");
8460
+ openDeeplinkWithFallback(toDeeplink(linkWitStrategy, deepLink), () => {
8461
+ setOpenMethod("universal-link");
8462
+ openLinkBlank(linkWitStrategy);
8463
+ });
8464
+ } else {
8465
+ setOpenMethod("universal-link");
8466
+ openLinkBlank(linkWitStrategy);
8467
+ }
8468
+ } else {
8469
+ setOpenMethod("universal-link");
8470
+ const linkWitStrategy = addReturnStrategy(universalLink, options.returnStrategy);
8471
+ openLinkBlank(linkWitStrategy);
8472
+ }
8473
+ } else {
8474
+ if (isOS("ios")) {
8475
+ if (options.returnStrategy === "back") {
8476
+ if (isBrowser("safari")) {
8477
+ options.returnStrategy = location.href;
8478
+ } else if (isBrowser("chrome")) {
8479
+ options.returnStrategy = "googlechrome://";
8480
+ } else if (isBrowser("firefox")) {
8481
+ options.returnStrategy = "firefox://";
8482
+ } else if (isBrowser("opera")) {
8483
+ options.returnStrategy = "opera-http://";
8484
+ } else {
8485
+ options.returnStrategy = location.href;
8486
+ }
8487
+ }
8488
+ if (isBrowser("chrome")) {
8489
+ setOpenMethod("universal-link");
8490
+ openLink(addReturnStrategy(universalLink, options.returnStrategy), "_self");
8491
+ } else {
8492
+ setOpenMethod("universal-link");
8493
+ openLinkBlank(addReturnStrategy(universalLink, options.returnStrategy));
8494
+ }
8495
+ } else if (isOS("android")) {
8496
+ if (options.returnStrategy === "back") {
8497
+ if (isBrowser("chrome")) {
8498
+ options.returnStrategy = "googlechrome://";
8499
+ } else if (isBrowser("firefox")) {
8500
+ options.returnStrategy = "firefox://";
8501
+ } else if (isBrowser("opera")) {
8502
+ options.returnStrategy = "opera-http://";
8503
+ } else {
8504
+ options.returnStrategy = location.href;
8505
+ }
8506
+ }
8507
+ setOpenMethod("universal-link");
8508
+ openLinkBlank(addReturnStrategy(universalLink, options.returnStrategy));
8509
+ } else if (isOS("macos", "windows", "linux")) {
8510
+ if (options.returnStrategy === "back") {
8511
+ if (isBrowser("safari")) {
8512
+ options.returnStrategy = "none";
8513
+ } else if (isBrowser("chrome")) {
8514
+ options.returnStrategy = "googlechrome://";
8515
+ } else if (isBrowser("firefox")) {
8516
+ options.returnStrategy = "firefox://";
8517
+ } else if (isBrowser("opera")) {
8518
+ options.returnStrategy = "opera-http://";
8519
+ } else {
8520
+ options.returnStrategy = "none";
8521
+ }
8522
+ }
8523
+ const linkWitStrategy = addReturnStrategy(universalLink, options.returnStrategy);
8524
+ const useDeepLink = !!deepLink && !options.forceRedirect;
8525
+ if (useDeepLink) {
8526
+ setOpenMethod("custom-deeplink");
8527
+ openDeeplinkWithFallback(toDeeplink(linkWitStrategy, deepLink), () => {
8528
+ setOpenMethod("universal-link");
8529
+ openLinkBlank(linkWitStrategy);
8530
+ });
8531
+ } else {
8532
+ setOpenMethod("universal-link");
8533
+ openLinkBlank(linkWitStrategy);
8534
+ }
8535
+ } else {
8536
+ setOpenMethod("universal-link");
8537
+ openLinkBlank(addReturnStrategy(universalLink, options.returnStrategy));
8538
+ }
8539
+ }
8540
+ }
8329
8541
  function addQueryParameter(url, key, value) {
8330
8542
  const parsed = new URL(url);
8331
8543
  parsed.searchParams.append(key, value);
@@ -8345,7 +8557,6 @@ function convertToTGDeepLink(directLink) {
8345
8557
  const startapp = parsed.searchParams.get("startapp");
8346
8558
  return `tg://resolve?domain=${domain}&appname=${appname}&startapp=${startapp}`;
8347
8559
  }
8348
- let openDesktopDeeplinkAttempts = 0;
8349
8560
  const DesktopConnectionModal = (props) => {
8350
8561
  const [mode, setMode] = createSignal("mobile");
8351
8562
  const [connectionErrored, setConnectionErrored] = createSignal(false);
@@ -8386,25 +8597,16 @@ const DesktopConnectionModal = (props) => {
8386
8597
  generateUniversalLink();
8387
8598
  }
8388
8599
  setMode("desktop");
8389
- const linkWithStrategy = addReturnStrategy(universalLink(), appState.returnStrategy);
8390
- const haveTriedToOpenDeeplinkInSafari = isBrowser("safari") && openDesktopDeeplinkAttempts >= 1;
8391
- if (props.wallet.deepLink && !haveTriedToOpenDeeplinkInSafari) {
8392
- openDesktopDeeplinkAttempts++;
8393
- setLastSelectedWalletInfo(__spreadProps(__spreadValues({}, props.wallet), {
8394
- openMethod: "custom-deeplink"
8395
- }));
8396
- openDeeplinkWithFallback(toDeeplink(linkWithStrategy, props.wallet.deepLink), () => {
8397
- setLastSelectedWalletInfo(__spreadProps(__spreadValues({}, props.wallet), {
8398
- openMethod: "universal-link"
8399
- }));
8400
- openLinkBlank(linkWithStrategy);
8401
- });
8402
- } else {
8600
+ const forceRedirect = !firstClick();
8601
+ setFirstClick(false);
8602
+ redirectToWallet(universalLink(), props.wallet.deepLink, {
8603
+ returnStrategy: appState.returnStrategy,
8604
+ forceRedirect
8605
+ }, (method) => {
8403
8606
  setLastSelectedWalletInfo(__spreadProps(__spreadValues({}, props.wallet), {
8404
- openMethod: "universal-link"
8607
+ openMethod: method
8405
8608
  }));
8406
- openLinkBlank(linkWithStrategy);
8407
- }
8609
+ });
8408
8610
  };
8409
8611
  const onClickTelegram = () => {
8410
8612
  const forceRedirect = !firstClick();
@@ -8974,6 +9176,7 @@ const MobileConnectionQR = (props) => {
8974
9176
  };
8975
9177
  const MobileConnectionModal = (props) => {
8976
9178
  const theme = useTheme();
9179
+ const [firstClick, setFirstClick] = createSignal(true);
8977
9180
  const [showQR, setShowQR] = createSignal(false);
8978
9181
  const [connectionErrored, setConnectionErrored] = createSignal(false);
8979
9182
  const connector = useContext(ConnectorContext);
@@ -9002,10 +9205,16 @@ const MobileConnectionModal = (props) => {
9002
9205
  return onClickTelegram();
9003
9206
  }
9004
9207
  setConnectionErrored(false);
9005
- setLastSelectedWalletInfo(__spreadProps(__spreadValues({}, props.wallet), {
9006
- openMethod: "universal-link"
9007
- }));
9008
- openLinkBlank(addReturnStrategy(universalLink(), appState.returnStrategy));
9208
+ const forceRedirect = !firstClick();
9209
+ setFirstClick(false);
9210
+ redirectToWallet(universalLink(), props.wallet.deepLink, {
9211
+ returnStrategy: appState.returnStrategy,
9212
+ forceRedirect
9213
+ }, (method) => {
9214
+ setLastSelectedWalletInfo(__spreadProps(__spreadValues({}, props.wallet), {
9215
+ openMethod: method
9216
+ }));
9217
+ });
9009
9218
  };
9010
9219
  const onOpenQR = () => {
9011
9220
  setConnectionErrored(false);
@@ -9369,7 +9578,16 @@ const MobileUniversalModal = (props) => {
9369
9578
  setIsCopiedShown(timeoutId);
9370
9579
  });
9371
9580
  const onSelectUniversal = () => {
9372
- openLinkBlank(addReturnStrategy(getUniversalLink(), appState.returnStrategy));
9581
+ const forceRedirect = !firstClick();
9582
+ setFirstClick(false);
9583
+ redirectToWallet(getUniversalLink(), void 0, {
9584
+ returnStrategy: appState.returnStrategy,
9585
+ forceRedirect
9586
+ }, (method) => {
9587
+ setLastSelectedWalletInfo({
9588
+ openMethod: method
9589
+ });
9590
+ });
9373
9591
  };
9374
9592
  const onSelectTelegram = () => {
9375
9593
  const atWallet = props.walletsList.find((wallet) => wallet.appName === AT_WALLET_APP_NAME);
@@ -9891,19 +10109,27 @@ const ActionModal = (props) => {
9891
10109
  if ((tonConnectUI == null ? void 0 : tonConnectUI.wallet) && "universalLink" in tonConnectUI.wallet && (tonConnectUI.wallet.openMethod === "universal-link" || isTelegramUrl(tonConnectUI.wallet.universalLink) && isInTMA())) {
9892
10110
  universalLink = tonConnectUI.wallet.universalLink;
9893
10111
  }
10112
+ let deepLink;
10113
+ if ((tonConnectUI == null ? void 0 : tonConnectUI.wallet) && "deepLink" in tonConnectUI.wallet && (tonConnectUI.wallet.openMethod === "custom-deeplink" || isTelegramUrl(tonConnectUI.wallet.deepLink) && isInTMA())) {
10114
+ deepLink = tonConnectUI.wallet.deepLink;
10115
+ }
9894
10116
  const onOpenWallet = () => {
9895
10117
  const currentAction = action();
9896
10118
  const returnStrategy = "returnStrategy" in currentAction ? currentAction.returnStrategy : appState.returnStrategy;
10119
+ const forceRedirect = !firstClick();
10120
+ setFirstClick(false);
9897
10121
  if (isTelegramUrl(universalLink)) {
9898
- const forceRedirect = !firstClick();
9899
- setFirstClick(false);
9900
10122
  redirectToTelegram(universalLink, {
9901
10123
  returnStrategy,
9902
10124
  twaReturnUrl: "twaReturnUrl" in currentAction ? currentAction.twaReturnUrl : appState.twaReturnUrl,
9903
10125
  forceRedirect
9904
10126
  });
9905
10127
  } else {
9906
- openLinkBlank(addReturnStrategy(universalLink, returnStrategy));
10128
+ redirectToWallet(universalLink, deepLink, {
10129
+ returnStrategy,
10130
+ forceRedirect
10131
+ }, () => {
10132
+ });
9907
10133
  }
9908
10134
  };
9909
10135
  return createComponent(ActionModalStyled, mergeProps(dataAttrs, {