@tonconnect/ui 2.1.1-beta.0 → 2.2.0

package/lib/index.mjs

@@ -42,7 +42,7 @@ var __async = (__this, __arguments, generator) => {
   });
 };
 var _a, _b, _c, _d, _e, _f, _g, _h;
-import { TonConnectError, isWalletInfoCurrentlyInjected, toUserFriendlyAddress, CHAIN, TonConnect, isTelegramUrl, encodeTelegramUrlParameters, WalletMissingRequiredFeaturesError, isWalletInfoRemote, checkRequiredWalletFeatures, isWalletInfoCurrentlyEmbedded, createVersionInfo, BrowserEventDispatcher, createResponseVersionEvent, createRequestVersionEvent, createConnectionStartedEvent, createConnectionCompletedEvent, createConnectionErrorEvent, createConnectionRestoringStartedEvent, createConnectionRestoringCompletedEvent, createConnectionRestoringErrorEvent, createDisconnectionEvent, createTransactionSentForSignatureEvent, createTransactionSignedEvent, createTransactionSigningFailedEvent } from "@tonconnect/sdk";
+import { TonConnectError, isWalletInfoCurrentlyInjected, toUserFriendlyAddress, CHAIN, TonConnect, isTelegramUrl, encodeTelegramUrlParameters, WalletMissingRequiredFeaturesError, isWalletInfoRemote, checkRequiredWalletFeatures, isWalletInfoCurrentlyEmbedded, createVersionInfo, BrowserEventDispatcher, createResponseVersionEvent, createRequestVersionEvent, createConnectionStartedEvent, createConnectionCompletedEvent, createConnectionErrorEvent, createConnectionRestoringStartedEvent, createConnectionRestoringCompletedEvent, createConnectionRestoringErrorEvent, createDisconnectionEvent, createTransactionSentForSignatureEvent, createTransactionSignedEvent, createTransactionSigningFailedEvent, createDataSentForSignatureEvent, createDataSignedEvent, createDataSigningFailedEvent, WalletNotSupportFeatureError } from "@tonconnect/sdk";
 export * from "@tonconnect/sdk";
 import UAParser from "ua-parser-js";
 import deepmerge from "deepmerge";
@@ -2049,6 +2049,12 @@ const notifications$1 = {
   transactionCanceled: {
     header: "Transaction canceled",
     text: "There will be no changes to\xA0your account."
+  },
+  dataSigned: {
+    header: "Data signed"
+  },
+  signDataCanceled: {
+    header: "Sign data canceled"
   }
 };
 const walletItem$1 = {
@@ -2106,9 +2112,41 @@ const walletModal$1 = {
     easilySend: "Easily send, receive, monitor your cryptocurrencies.\xA0Streamline your operations with\xA0decentralized applications.",
     getAWallet: "Get a Wallet"
   },
+  restoreModal: {
+    title: "Restore",
+    step1: {
+      title: "Find your current recovery phrase",
+      text: "Open your wallet settings and locate the\xA0recovery\xA0phrase"
+    },
+    step2: {
+      title: "Copy your recovery phrase",
+      text: "Write it down or copy it to a safe place"
+    },
+    step3: {
+      title: "Restore in a supported wallet",
+      text: "Enter the recovery phrase to access your wallet"
+    }
+  },
   allWallets: {
     walletsBelowNotSupported: "The wallets below don\u2019t support all features of\xA0the connected service. You can use your recovery phrase in one of the supported wallets above.",
     walletNotSupportService: "{{ name }} doesn\u2019t support connected service"
+  },
+  featureNotSupported: {
+    wallet: {
+      title: "{{ name }} doesn\u2019t support the requested\xA0action",
+      description: "Install a supported wallet from the list below, restore it with your recovery phrase, then connect it and try again.",
+      info: "Learn how to restore your wallet"
+    },
+    version: {
+      description: "Your current version of {{ name }} or wallet contract type doesn't support the required features. Please update it to continue.",
+      updateButton: "Update {{ name }}",
+      aboutW5: "About W5"
+    },
+    disconnect: {
+      title: "Confirm Disconnect",
+      description: "You will be disconnected from your current wallet and redirected to connect {{ name }}.",
+      button: "Disconnect"
+    }
   }
 };
 const actionModal$1 = {
@@ -2116,8 +2154,14 @@ const actionModal$1 = {
     header: "Confirm the\xA0transaction in\xA0{{ name }}",
     text: "It will only take a\xA0moment."
   },
+  signData: {
+    header: "Sign the\xA0data in\xA0{{ name }}",
+    text: "It will only take a\xA0moment."
+  },
   transactionSent: "$notifications.transactionSent",
-  transactionCanceled: "$notifications.transactionCanceled"
+  transactionCanceled: "$notifications.transactionCanceled",
+  dataSigned: "$notifications.dataSigned",
+  signDataCanceled: "$notifications.signDataCanceled"
 };
 const en = {
   common: common$1,
@@ -2159,6 +2203,12 @@ const notifications = {
   transactionCanceled: {
     header: "\u0422\u0440\u0430\u043D\u0437\u0430\u043A\u0446\u0438\u044F \u043E\u0442\u043C\u0435\u043D\u0435\u043D\u0430",
     text: "\u0421\u043E\u0441\u0442\u043E\u044F\u043D\u0438\u0435 \u0432\u0430\u0448\u0435\u0433\u043E \u0441\u0447\u0451\u0442\u0430 \u043D\u0435\xA0\u0438\u0437\u043C\u0435\u043D\u0438\u0442\u0441\u044F."
+  },
+  dataSigned: {
+    header: "\u0414\u0430\u043D\u043D\u044B\u0435 \u043F\u043E\u0434\u043F\u0438\u0441\u0430\u043D\u044B"
+  },
+  signDataCanceled: {
+    header: "\u041F\u043E\u0434\u043F\u0438\u0441\u044C \u0434\u0430\u043D\u043D\u044B\u0445 \u043E\u0442\u043C\u0435\u043D\u0435\u043D\u0430"
   }
 };
 const walletItem = {
@@ -2216,9 +2266,41 @@ const walletModal = {
     easilySend: "\u041B\u0435\u0433\u043A\u043E \u043E\u0442\u043F\u0440\u0430\u0432\u043B\u044F\u0439\u0442\u0435, \u043F\u043E\u043B\u0443\u0447\u0430\u0439\u0442\u0435 \u0438\xA0\u043E\u0442\u0441\u043B\u0435\u0436\u0438\u0432\u0430\u0439\u0442\u0435 \u0441\u0432\u043E\u0438 \u043A\u0440\u0438\u043F\u0442\u043E\u0432\u0430\u043B\u044E\u0442\u044B. \u041E\u043F\u0442\u0438\u043C\u0438\u0437\u0438\u0440\u0443\u0439\u0442\u0435 \u0441\u0432\u043E\u0438 \u043E\u043F\u0435\u0440\u0430\u0446\u0438\u0438 \u0441\xA0\u043F\u043E\u043C\u043E\u0449\u044C\u044E \u0434\u0435\u0446\u0435\u043D\u0442\u0440\u0430\u043B\u0438\u0437\u043E\u0432\u0430\u043D\u043D\u044B\u0445 \u043F\u0440\u0438\u043B\u043E\u0436\u0435\u043D\u0438\u0439.",
     getAWallet: "\u0421\u043A\u0430\u0447\u0430\u0442\u044C \u043A\u043E\u0448\u0435\u043B\u0451\u043A"
   },
+  restoreModal: {
+    title: "\u0412\u043E\u0441\u0441\u0442\u0430\u043D\u043E\u0432\u043B\u0435\u043D\u0438\u0435",
+    step1: {
+      title: "\u041D\u0430\u0439\u0434\u0438\u0442\u0435 \u0432\u0430\u0448\u0443 \u0442\u0435\u043A\u0443\u0449\u0443\u044E \u0444\u0440\u0430\u0437\u0443 \u0432\u043E\u0441\u0441\u0442\u0430\u043D\u043E\u0432\u043B\u0435\u043D\u0438\u044F",
+      text: "\u041E\u0442\u043A\u0440\u043E\u0439\u0442\u0435 \u043D\u0430\u0441\u0442\u0440\u043E\u0439\u043A\u0438 \u043A\u043E\u0448\u0435\u043B\u044C\u043A\u0430 \u0438 \u043D\u0430\u0439\u0434\u0438\u0442\u0435 \u0444\u0440\u0430\u0437\u0443\xA0\u0432\u043E\u0441\u0441\u0442\u0430\u043D\u043E\u0432\u043B\u0435\u043D\u0438\u044F"
+    },
+    step2: {
+      title: "\u0421\u043A\u043E\u043F\u0438\u0440\u0443\u0439\u0442\u0435 \u0432\u0430\u0448\u0443 \u0444\u0440\u0430\u0437\u0443 \u0432\u043E\u0441\u0441\u0442\u0430\u043D\u043E\u0432\u043B\u0435\u043D\u0438\u044F",
+      text: "\u0417\u0430\u043F\u0438\u0448\u0438\u0442\u0435 \u0435\u0451 \u0438\u043B\u0438 \u0441\u043E\u0445\u0440\u0430\u043D\u0438\u0442\u0435 \u0432 \u0431\u0435\u0437\u043E\u043F\u0430\u0441\u043D\u043E\u043C \u043C\u0435\u0441\u0442\u0435"
+    },
+    step3: {
+      title: "\u0412\u043E\u0441\u0441\u0442\u0430\u043D\u043E\u0432\u0438\u0442\u0435 \u0432 \u043F\u043E\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u043C\u043E\u043C \u043A\u043E\u0448\u0435\u043B\u044C\u043A\u0435",
+      text: "\u0412\u0432\u0435\u0434\u0438\u0442\u0435 \u0444\u0440\u0430\u0437\u0443 \u0432\u043E\u0441\u0441\u0442\u0430\u043D\u043E\u0432\u043B\u0435\u043D\u0438\u044F \u0434\u043B\u044F \u0434\u043E\u0441\u0442\u0443\u043F\u0430\xA0\u043A\xA0\u0432\u0430\u0448\u0435\u043C\u0443\xA0\u043A\u043E\u0448\u0435\u043B\u044C\u043A\u0443"
+    }
+  },
   allWallets: {
     walletsBelowNotSupported: "\u041A\u043E\u0448\u0435\u043B\u044C\u043A\u0438 \u043D\u0438\u0436\u0435 \u043D\u0435 \u043F\u043E\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u044E\u0442 \u0432\u0441\u0435 \u0444\u0443\u043D\u043A\u0446\u0438\u0438 \u043F\u043E\u0434\u043A\u043B\u044E\u0447\u0451\u043D\u043D\u043E\u0433\u043E \u0441\u0435\u0440\u0432\u0438\u0441\u0430. \u0412\u044B \u043C\u043E\u0436\u0435\u0442\u0435 \u0438\u0441\u043F\u043E\u043B\u044C\u0437\u043E\u0432\u0430\u0442\u044C \u0441\u0432\u043E\u044E \u0444\u0440\u0430\u0437\u0443 \u0432\u043E\u0441\u0441\u0442\u0430\u043D\u043E\u0432\u043B\u0435\u043D\u0438\u044F \u0432 \u043E\u0434\u043D\u043E\u043C \u0438\u0437 \u043F\u043E\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u043C\u044B\u0445 \u0432\u044B\u0448\u0435 \u043A\u043E\u0448\u0435\u043B\u044C\u043A\u043E\u0432.",
     walletNotSupportService: "{{ name }} \u043D\u0435 \u043F\u043E\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u0442 \u043F\u043E\u0434\u043A\u043B\u044E\u0447\u0451\u043D\u043D\u044B\u0439 \u0441\u0435\u0440\u0432\u0438\u0441"
+  },
+  featureNotSupported: {
+    wallet: {
+      title: "{{ name }} \u043D\u0435 \u043F\u043E\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u0442 \u0437\u0430\u043F\u0440\u043E\u0448\u0435\u043D\u043D\u043E\u0435\xA0\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435",
+      description: "\u0423\u0441\u0442\u0430\u043D\u043E\u0432\u0438\u0442\u0435 \u043F\u043E\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u043C\u044B\u0439 \u043A\u043E\u0448\u0435\u043B\u0451\u043A \u0438\u0437 \u0441\u043F\u0438\u0441\u043A\u0430 \u043D\u0438\u0436\u0435, \u0432\u043E\u0441\u0441\u0442\u0430\u043D\u043E\u0432\u0438\u0442\u0435 \u0435\u0433\u043E \u0441 \u043F\u043E\u043C\u043E\u0449\u044C\u044E \u0444\u0440\u0430\u0437\u044B \u0432\u043E\u0441\u0441\u0442\u0430\u043D\u043E\u0432\u043B\u0435\u043D\u0438\u044F, \u0437\u0430\u0442\u0435\u043C \u043F\u043E\u0434\u043A\u043B\u044E\u0447\u0438\u0442\u0435\u0441\u044C \u0438 \u043F\u043E\u043F\u0440\u043E\u0431\u0443\u0439\u0442\u0435 \u0441\u043D\u043E\u0432\u0430.",
+      info: "\u0423\u0437\u043D\u0430\u0442\u044C, \u043A\u0430\u043A \u0432\u043E\u0441\u0441\u0442\u0430\u043D\u043E\u0432\u0438\u0442\u044C \u043A\u043E\u0448\u0435\u043B\u0451\u043A"
+    },
+    version: {
+      description: "\u0422\u0435\u043A\u0443\u0449\u0430\u044F \u0432\u0435\u0440\u0441\u0438\u044F {{ name }} \u0438\u043B\u0438 \u0442\u0438\u043F \u043A\u043E\u043D\u0442\u0440\u0430\u043A\u0442\u0430 \u043A\u043E\u0448\u0435\u043B\u044C\u043A\u0430 \u043D\u0435 \u043F\u043E\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u0442 \u043D\u0435\u043E\u0431\u0445\u043E\u0434\u0438\u043C\u044B\u0435 \u0444\u0443\u043D\u043A\u0446\u0438\u0438. \u041E\u0431\u043D\u043E\u0432\u0438\u0442\u0435 \u043A\u043E\u0448\u0435\u043B\u0451\u043A, \u0447\u0442\u043E\u0431\u044B \u043F\u0440\u043E\u0434\u043E\u043B\u0436\u0438\u0442\u044C.",
+      updateButton: "\u041E\u0431\u043D\u043E\u0432\u0438\u0442\u044C {{ name }}",
+      aboutW5: "\u041F\u0440\u043E W5"
+    },
+    disconnect: {
+      title: "\u041F\u043E\u0434\u0442\u0432\u0435\u0440\u0434\u0438\u0442\u0435 \u043E\u0442\u043A\u043B\u044E\u0447\u0435\u043D\u0438\u0435",
+      description: "\u0412\u044B \u0431\u0443\u0434\u0435\u0442\u0435 \u043E\u0442\u043A\u043B\u044E\u0447\u0435\u043D\u044B \u043E\u0442 \u0442\u0435\u043A\u0443\u0449\u0435\u0433\u043E \u043A\u043E\u0448\u0435\u043B\u044C\u043A\u0430 \u0438 \u043F\u0435\u0440\u0435\u043D\u0430\u043F\u0440\u0430\u0432\u043B\u0435\u043D\u044B \u043D\u0430 \u043F\u043E\u0434\u043A\u043B\u044E\u0447\u0435\u043D\u0438\u0435 {{ name }}.",
+      button: "\u041E\u0442\u043A\u043B\u044E\u0447\u0438\u0442\u044C\u0441\u044F"
+    }
   }
 };
 const actionModal = {
@@ -2226,8 +2308,14 @@ const actionModal = {
     header: "\u041F\u043E\u0434\u0442\u0432\u0435\u0440\u0434\u0438\u0442\u0435 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435 \u0432\xA0{{ name }}",
     text: "\u042D\u0442\u043E \u0437\u0430\u0439\u043C\u0435\u0442 \u043F\u0430\u0440\u0443 \u0441\u0435\u043A\u0443\u043D\u0434."
   },
+  signData: {
+    header: "\u041F\u043E\u0434\u043F\u0438\u0448\u0438\u0442\u0435 \u0434\u0430\u043D\u043D\u044B\u0435 \u0432\xA0{{ name }}",
+    text: "\u042D\u0442\u043E \u0437\u0430\u0439\u043C\u0435\u0442 \u043F\u0430\u0440\u0443 \u0441\u0435\u043A\u0443\u043D\u0434."
+  },
   transactionSent: "$notifications.transactionSent",
-  transactionCanceled: "$notifications.transactionCanceled"
+  transactionCanceled: "$notifications.transactionCanceled",
+  dataSigned: "$notifications.dataSigned",
+  signDataCanceled: "$notifications.signDataCanceled"
 };
 const ru = {
   common,
@@ -2887,7 +2975,7 @@ function media(device) {
 }
 const mediaTouch = "@media (hover: none)";
 const mediaNotTouch = "@media not all and (hover: none)";
-const borders$5 = {
+const borders$6 = {
   m: "100vh",
   s: "8px",
   none: "0"
@@ -2908,7 +2996,7 @@ const ButtonStyled$1 = styled.button`
     padding-left: ${(props) => props.leftIcon && props.appearance !== "flat" ? "12px" : "16px"};
     padding-right: ${(props) => props.rightIcon && props.appearance !== "flat" ? "12px" : "16px"};
     border: none;
-    border-radius: ${(props) => borders$5[props.theme.borderRadius]};
+    border-radius: ${(props) => borders$6[props.theme.borderRadius]};
     cursor: ${(props) => props.disabled ? "not-allowed" : "pointer"};
 
     font-size: 14px;
@@ -3472,7 +3560,7 @@ const IconButton = (props) => {
     }
   }));
 };
-const borders$4 = {
+const borders$5 = {
   m: "24px",
   s: "16px",
   none: "0"
@@ -3513,7 +3601,7 @@ const ModalBodyStyled = styled.div`
     box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.04);
 
     background-color: ${(props) => props.theme.colors.background.primary};
-    border-radius: ${(props) => borders$4[props.theme.borderRadius]};
+    border-radius: ${(props) => borders$5[props.theme.borderRadius]};
 
     ${media("mobile")} {
         width: 100%;
@@ -3529,8 +3617,8 @@ const ModalFooterStyled = styled.div`
     justify-content: space-between;
     align-items: center;
     padding: 16px 16px 16px 18px;
-    border-radius: 0 0 ${(props) => borders$4[props.theme.borderRadius]}
-        ${(props) => borders$4[props.theme.borderRadius]};
+    border-radius: 0 0 ${(props) => borders$5[props.theme.borderRadius]}
+        ${(props) => borders$5[props.theme.borderRadius]};
 `;
 const QuestionButtonStyled = styled(IconButton)`
     background-color: ${(props) => rgba(props.theme.colors.icon.secondary, 0.12)};
@@ -3684,7 +3772,7 @@ const Modal = (props) => {
               }), null);
               insert(_el$, createComponent(Show, {
                 get when() {
-                  return props.onClickQuestion;
+                  return props.onClickQuestion && props.showFooter;
                 },
                 get children() {
                   return createComponent(ModalFooterStyled, {
@@ -3700,12 +3788,12 @@ const Modal = (props) => {
                 }
               }), null);
               createRenderEffect(() => className(_el$, cn(ModalWrapperClass, u`
-                                border-radius: ${borders$4[theme.borderRadius]};
+                                border-radius: ${borders$5[theme.borderRadius]};
                                 background-color: ${theme.colors.background.tint};
 
                                 ${media("mobile")} {
-                                    border-radius: ${borders$4[theme.borderRadius]}
-                                        ${borders$4[theme.borderRadius]} 0 0;
+                                    border-radius: ${borders$5[theme.borderRadius]}
+                                        ${borders$5[theme.borderRadius]} 0 0;
                                 }
                             `)));
               return _el$;
@@ -5779,7 +5867,7 @@ var createI18nContext = (init = {}, lang = navigator.language in init ? navigato
 };
 var I18nContext = createContext({});
 var useI18n = () => useContext(I18nContext);
-const TextStyled$3 = styled.div`
+const TextStyled$4 = styled.div`
     font-style: normal;
     font-weight: ${(props) => props.fontWeight};
     font-size: ${(props) => props.fontSize};
@@ -5808,7 +5896,7 @@ const Text = (inputs) => {
       textRef.style.cursor = "default";
     }
   });
-  return createComponent(TextStyled$3, {
+  return createComponent(TextStyled$4, {
     get fontSize() {
       return props.fontSize;
     },
@@ -5869,7 +5957,7 @@ const WalletImage = (props) => {
     }
   });
 };
-const borders$3 = {
+const borders$4 = {
   m: "16px",
   s: "12px",
   none: "0"
@@ -5939,7 +6027,7 @@ const WalletItemStyled = styled.button`
 const ImageStyled$1 = styled(WalletImage)`
     width: 60px;
     height: 60px;
-    border-radius: ${(props) => borders$3[props.theme.borderRadius]};
+    border-radius: ${(props) => borders$4[props.theme.borderRadius]};
     margin-bottom: 8px;
     position: relative;
 `;
@@ -6037,7 +6125,7 @@ const WalletItem = (props) => {
     }
   });
 };
-const H1Styled$9 = styled.h1`
+const H1Styled$b = styled.h1`
     font-style: normal;
     font-weight: 590;
     font-size: 20px;
@@ -6054,7 +6142,7 @@ const H1Styled$9 = styled.h1`
 `;
 const H1 = (props) => {
   const [t2] = useI18n();
-  return createComponent(H1Styled$9, {
+  return createComponent(H1Styled$b, {
     get ["class"]() {
       return props.class;
     },
@@ -6093,7 +6181,7 @@ const H2 = (props) => {
     }
   });
 };
-const H3Styled$1 = styled.h3`
+const H3Styled$2 = styled.h3`
     font-style: normal;
     font-weight: 510;
     font-size: 16px;
@@ -6108,7 +6196,7 @@ const H3Styled$1 = styled.h3`
 `;
 const H3 = (props) => {
   const [t2] = useI18n();
-  return createComponent(H3Styled$1, {
+  return createComponent(H3Styled$2, {
     "data-tc-h3": "true",
     get ["class"]() {
       return props.class;
@@ -6842,7 +6930,7 @@ const AccountButtonDropdown = (props) => {
     }
   });
 };
-const borders$2 = {
+const borders$3 = {
   m: "16px",
   s: "8px",
   none: "0"
@@ -6855,7 +6943,7 @@ const NotificationStyled = styled.div`
 
     background-color: ${(props) => props.theme.colors.background.primary};
     box-shadow: 0 4px 24px rgba(0, 0, 0, 0.16);
-    border-radius: ${(props) => borders$2[props.theme.borderRadius]};
+    border-radius: ${(props) => borders$3[props.theme.borderRadius]};
 `;
 const NotificationContentStyled = styled.div`
     width: 192px;
@@ -6864,7 +6952,7 @@ const NotificationContentStyled = styled.div`
         font-size: 15px;
     }
 `;
-const TextStyled$2 = styled(Text)`
+const TextStyled$3 = styled(Text)`
     margin-top: 4px;
     color: ${(props) => props.theme.colors.text.secondary};
 `;
@@ -6894,7 +6982,7 @@ const Notification = (props) => {
               return props.text;
             },
             get children() {
-              return createComponent(TextStyled$2, {
+              return createComponent(TextStyled$3, {
                 get translationKey() {
                   return props.text.translationKey;
                 },
@@ -6935,7 +7023,7 @@ const ConfirmOperationNotification = (props) => {
     children: "Confirm operation in your wallet"
   });
 };
-const ErrorIconStyled$2 = styled(ErrorIcon)`
+const ErrorIconStyled$4 = styled(ErrorIcon)`
     margin-top: 2px;
 `;
 const ErrorTransactionNotification = (props) => {
@@ -6947,7 +7035,7 @@ const ErrorTransactionNotification = (props) => {
       translationKey: "notifications.transactionCanceled.text"
     },
     get icon() {
-      return createComponent(ErrorIconStyled$2, {
+      return createComponent(ErrorIconStyled$4, {
         size: "xs"
       });
     },
@@ -6993,19 +7081,26 @@ function useOpenedNotifications(config) {
   const [timeoutIds, setTimeoutIds] = createSignal([]);
   createEffect(
     on(action, (action2) => {
-      var _a2;
+      var _a2, _b2;
       if (!action2 || !action2.showNotification) {
+        setOpenedNotifications(
+          (openedNotifications2) => openedNotifications2.filter((n2) => n2.action !== "confirm-transaction")
+        );
         return;
       }
       if (latestAction() === action2) {
         return;
       }
-      if (((_a2 = latestAction()) == null ? void 0 : _a2.name) === "confirm-transaction" && action2.name === "confirm-transaction") {
+      const isConfirmTransactionAction = ((_a2 = latestAction()) == null ? void 0 : _a2.name) === "confirm-transaction" && action2.name === "confirm-transaction";
+      const isConfirmSignDataAction = ((_b2 = latestAction()) == null ? void 0 : _b2.name) === "confirm-sign-data" && action2.name === "confirm-sign-data";
+      if (isConfirmTransactionAction || isConfirmSignDataAction) {
         return;
       }
       setLatestAction(action2);
       setOpenedNotifications(
-        (openedNotifications2) => openedNotifications2.filter((n2) => n2.action !== "confirm-transaction")
+        (openedNotifications2) => openedNotifications2.filter(
+          (n2) => n2.action !== "confirm-transaction" && n2.action !== "confirm-sign-data"
+        )
       );
       const notification = { action: action2.name };
       setOpenedNotifications((openedNotifications2) => [...openedNotifications2, notification]);
@@ -7023,6 +7118,41 @@ function useOpenedNotifications(config) {
   });
   return openedNotifications;
 }
+const ErrorIconStyled$3 = styled(ErrorIcon)`
+    margin-top: 2px;
+`;
+const ErrorSignDataNotification = (props) => {
+  return createComponent(Notification, {
+    header: {
+      translationKey: "notifications.signDataCanceled.header"
+    },
+    get icon() {
+      return createComponent(ErrorIconStyled$3, {
+        size: "xs"
+      });
+    },
+    get ["class"]() {
+      return props.class;
+    },
+    "data-tc-notification-sign-data-cancelled": "true",
+    children: "Sign data canceled"
+  });
+};
+const SuccessSignDataNotification = (props) => {
+  return createComponent(Notification, {
+    header: {
+      translationKey: "notifications.dataSigned.header"
+    },
+    get icon() {
+      return createComponent(SuccessIconStyled, {});
+    },
+    get ["class"]() {
+      return props.class;
+    },
+    "data-tc-notification-data-signed": "true",
+    children: "Data signed"
+  });
+};
 const _tmpl$$5 = /* @__PURE__ */ template$1(`<div data-tc-list-notifications="true"></div>`);
 const Notifications = (props) => {
   const openedNotifications = useOpenedNotifications();
@@ -7079,7 +7209,25 @@ const Notifications = (props) => {
                 }
               }), createComponent(Match, {
                 get when() {
-                  return openedNotification.action === "confirm-transaction";
+                  return openedNotification.action === "data-signed";
+                },
+                get children() {
+                  return createComponent(SuccessSignDataNotification, {
+                    "class": NotificationClass
+                  });
+                }
+              }), createComponent(Match, {
+                get when() {
+                  return openedNotification.action === "sign-data-canceled";
+                },
+                get children() {
+                  return createComponent(ErrorSignDataNotification, {
+                    "class": NotificationClass
+                  });
+                }
+              }), createComponent(Match, {
+                get when() {
+                  return openedNotification.action === "confirm-transaction" || openedNotification.action === "confirm-sign-data";
                 },
                 get children() {
                   return createComponent(ConfirmOperationNotification, {
@@ -8098,7 +8246,7 @@ const StyledModal = styled(Modal)`
         padding-right: 0;
     }
 `;
-const H1Styled$8 = styled(H1)`
+const H1Styled$a = styled(H1)`
     margin-top: 12px;
 
     ${media("mobile")} {
@@ -8185,7 +8333,7 @@ const DesktopSelectWalletModalStyled = styled.div`
     flex-direction: column;
     align-items: center;
 `;
-const H1Styled$7 = styled(H1)`
+const H1Styled$9 = styled(H1)`
     margin-bottom: 18px;
 `;
 styled.div`
@@ -8240,7 +8388,7 @@ styled(Button)`
     margin: 0 auto 1px;
     font-size: 15px;
 `;
-const StyledIconButton$3 = styled(IconButton)`
+const StyledIconButton$5 = styled(IconButton)`
     position: absolute;
     top: 16px;
     left: 16px;
@@ -8343,7 +8491,7 @@ const AllWalletsListModal = (props) => {
     timeoutId = setTimeout(() => setErrorSupportOpened(null), 1500);
   };
   const handleSelectWallet = (wallet) => {
-    if (!wallet.isSupportRequiredFeatures) {
+    if (!wallet.isSupportRequiredFeatures && props.featureCheckMode === "strict") {
       onErrorClick(wallet);
       return;
     }
@@ -8355,10 +8503,10 @@ const AllWalletsListModal = (props) => {
   return createComponent(DesktopSelectWalletModalStyled, {
     "data-tc-wallets-modal-list": "true",
     get children() {
-      return [createComponent(StyledIconButton$3, {
+      return [createComponent(StyledIconButton$5, {
         icon: "arrow",
         onClick: () => props.onBack()
-      }), createComponent(H1Styled$7, {
+      }), createComponent(H1Styled$9, {
         translationKey: "walletModal.wallets",
         children: "Wallets"
       }), createComponent(ScrollContainer, {
@@ -8384,7 +8532,7 @@ const AllWalletsListModal = (props) => {
             }
           }), createComponent(Show, {
             get when() {
-              return unsupportedWallets().length > 0;
+              return unsupportedWallets().length > 0 && props.featureCheckMode !== "hide";
             },
             get children() {
               return [createComponent(WalletsNotSupportedNotifier, {
@@ -8407,7 +8555,9 @@ const AllWalletsListModal = (props) => {
                       insert(_el$2, createComponent(WalletLabeledItemStyled, {
                         wallet,
                         onClick: () => handleSelectWallet(wallet),
-                        withOpacity: true
+                        get withOpacity() {
+                          return props.featureCheckMode === "strict";
+                        }
                       }));
                       return _el$2;
                     })()
@@ -8500,7 +8650,7 @@ const BodyStyled$1 = styled.div`
 const QRCodeStyled$1 = styled(QRCode)`
     margin-bottom: 24px;
 `;
-const H1Styled$6 = styled(H1)`
+const H1Styled$8 = styled(H1)`
     max-width: 288px;
     margin: 0 auto 2px;
 `;
@@ -8509,18 +8659,18 @@ const H2Styled$4 = styled(H2)`
     text-align: center;
     margin: 0 auto 20px;
 `;
-const StyledIconButton$2 = styled(IconButton)`
+const StyledIconButton$4 = styled(IconButton)`
     position: absolute;
     top: 16px;
     left: 16px;
 `;
-const ButtonsContainerStyled$1 = styled.div`
+const ButtonsContainerStyled$2 = styled.div`
     display: flex;
     justify-content: center;
     gap: 8px;
     padding-bottom: 16px;
 `;
-const BottomButtonsContainerStyled = styled(ButtonsContainerStyled$1)`
+const BottomButtonsContainerStyled = styled(ButtonsContainerStyled$2)`
     padding-bottom: 0;
 `;
 const FooterButton$1 = styled(Button)`
@@ -8530,10 +8680,10 @@ const LoaderStyled$1 = styled(LoaderIcon)`
     margin-bottom: 18px;
     margin-top: 2px;
 `;
-const ErrorIconStyled$1 = styled(ErrorIcon)`
+const ErrorIconStyled$2 = styled(ErrorIcon)`
     margin-bottom: 16px;
 `;
-const BodyTextStyled$1 = styled(H2)`
+const BodyTextStyled$2 = styled(H2)`
     color: ${(props) => props.theme.colors.text.secondary};
     text-align: center;
     margin-bottom: 20px;
@@ -9003,12 +9153,12 @@ const DesktopConnectionModal = (props) => {
           return !props.backDisabled;
         },
         get children() {
-          return createComponent(StyledIconButton$2, {
+          return createComponent(StyledIconButton$4, {
             icon: "arrow",
             onClick: () => props.onBackClick()
           });
         }
-      }), createComponent(H1Styled$6, {
+      }), createComponent(H1Styled$8, {
         get children() {
           return props.wallet.name;
         }
@@ -9041,7 +9191,7 @@ const DesktopConnectionModal = (props) => {
                   return connectionErrored();
                 },
                 get children() {
-                  return [createComponent(ErrorIconStyled$1, {
+                  return [createComponent(ErrorIconStyled$2, {
                     size: "s"
                   }), createComponent(Switch, {
                     get children() {
@@ -9050,7 +9200,7 @@ const DesktopConnectionModal = (props) => {
                           return connectionErrored() === "missing-features";
                         },
                         get children() {
-                          return createComponent(BodyTextStyled$1, {
+                          return createComponent(BodyTextStyled$2, {
                             translationKey: "walletModal.desktopConnectionModal.missingFeatures",
                             get translationValues() {
                               return {
@@ -9065,7 +9215,7 @@ const DesktopConnectionModal = (props) => {
                           return connectionErrored() === "connection-declined";
                         },
                         get children() {
-                          return createComponent(BodyTextStyled$1, {
+                          return createComponent(BodyTextStyled$2, {
                             translationKey: "walletModal.desktopConnectionModal.connectionDeclined",
                             children: "Connection declined"
                           });
@@ -9075,7 +9225,7 @@ const DesktopConnectionModal = (props) => {
                           return connectionErrored() === "not-supported";
                         },
                         get children() {
-                          return createComponent(BodyTextStyled$1, {
+                          return createComponent(BodyTextStyled$2, {
                             translationKey: "walletModal.desktopConnectionModal.notSupportedWallet",
                             get translationValues() {
                               return {
@@ -9089,7 +9239,7 @@ const DesktopConnectionModal = (props) => {
                         }
                       })];
                     }
-                  }), createComponent(ButtonsContainerStyled$1, {
+                  }), createComponent(ButtonsContainerStyled$2, {
                     get children() {
                       return [createComponent(Show, {
                         get when() {
@@ -9189,7 +9339,7 @@ const DesktopConnectionModal = (props) => {
                     get children() {
                       return [createComponent(LoaderStyled$1, {
                         size: "s"
-                      }), createComponent(BodyTextStyled$1, {
+                      }), createComponent(BodyTextStyled$2, {
                         translationKey: "walletModal.desktopConnectionModal.continueInExtension",
                         get translationValues() {
                           return {
@@ -9199,7 +9349,7 @@ const DesktopConnectionModal = (props) => {
                         get children() {
                           return ["Continue in ", createMemo(() => props.wallet.name), " browser extension\u2026"];
                         }
-                      }), createComponent(ButtonsContainerStyled$1, {
+                      }), createComponent(ButtonsContainerStyled$2, {
                         get children() {
                           return createComponent(Button, {
                             get leftIcon() {
@@ -9221,7 +9371,7 @@ const DesktopConnectionModal = (props) => {
                       return !isWalletInfoCurrentlyInjected(props.wallet);
                     },
                     get children() {
-                      return [createComponent(BodyTextStyled$1, {
+                      return [createComponent(BodyTextStyled$2, {
                         translationKey: "walletModal.desktopConnectionModal.dontHaveExtension",
                         get translationValues() {
                           return {
@@ -9231,7 +9381,7 @@ const DesktopConnectionModal = (props) => {
                         get children() {
                           return ["Seems you don't have installed ", createMemo(() => props.wallet.name), " browser extension"];
                         }
-                      }), createComponent(ButtonsContainerStyled$1, {
+                      }), createComponent(ButtonsContainerStyled$2, {
                         get children() {
                           return createComponent(Link, {
                             get href() {
@@ -9272,7 +9422,7 @@ const DesktopConnectionModal = (props) => {
                 get children() {
                   return [createComponent(LoaderIcon, {
                     size: "m"
-                  }), createComponent(BodyTextStyled$1, {
+                  }), createComponent(BodyTextStyled$2, {
                     translationKey: "walletModal.desktopConnectionModal.continueOnDesktop",
                     get translationValues() {
                       return {
@@ -9282,7 +9432,7 @@ const DesktopConnectionModal = (props) => {
                     get children() {
                       return ["Continue in ", createMemo(() => props.wallet.name), " on desktop\u2026"];
                     }
-                  }), createComponent(ButtonsContainerStyled$1, {
+                  }), createComponent(ButtonsContainerStyled$2, {
                     get children() {
                       return [createComponent(Button, {
                         get leftIcon() {
@@ -9424,12 +9574,12 @@ const DesktopConnectionModal = (props) => {
   });
 };
 const InfoModalStyled = styled.div``;
-const StyledIconButton$1 = styled(IconButton)`
+const StyledIconButton$3 = styled(IconButton)`
     position: absolute;
     top: 16px;
     left: 16px;
 `;
-const H1Styled$5 = styled(H1)`
+const H1Styled$7 = styled(H1)`
     margin-bottom: 18px;
 `;
 const InfoBlock = styled.div`
@@ -9441,11 +9591,11 @@ const InfoBlock = styled.div`
 const InfoBlockIconClass = u`
     margin-bottom: 12px;
 `;
-const H3Styled = styled(H3)`
+const H3Styled$1 = styled(H3)`
     text-align: center;
     margin-bottom: 4px;
 `;
-const TextStyled$1 = styled(Text)`
+const TextStyled$2 = styled(Text)`
     text-align: center;
     max-width: 352px;
     color: ${(props) => props.theme.colors.text.secondary};
@@ -9464,10 +9614,10 @@ const InfoModal = (props) => {
   return createComponent(InfoModalStyled, {
     "data-tc-wallets-modal-info": "true",
     get children() {
-      return [createComponent(StyledIconButton$1, {
+      return [createComponent(StyledIconButton$3, {
         icon: "arrow",
         onClick: () => props.onBackClick()
-      }), createComponent(H1Styled$5, {
+      }), createComponent(H1Styled$7, {
         translationKey: "walletModal.infoModal.whatIsAWallet",
         children: "What is a wallet"
       }), createComponent(ScrollContainer, {
@@ -9476,10 +9626,10 @@ const InfoModal = (props) => {
             get children() {
               return [createComponent(SecurityIcon, {
                 "class": InfoBlockIconClass
-              }), createComponent(H3Styled, {
+              }), createComponent(H3Styled$1, {
                 translationKey: "walletModal.infoModal.secureDigitalAssets",
                 children: "Secure digital assets storage"
-              }), createComponent(TextStyled$1, {
+              }), createComponent(TextStyled$2, {
                 translationKey: "walletModal.infoModal.walletProtects",
                 children: "A wallet protects and manages your digital assets including TON, tokens and collectables."
               })];
@@ -9488,10 +9638,10 @@ const InfoModal = (props) => {
             get children() {
               return [createComponent(PersonalityIcon, {
                 "class": InfoBlockIconClass
-              }), createComponent(H3Styled, {
+              }), createComponent(H3Styled$1, {
                 translationKey: "walletModal.infoModal.controlIdentity",
                 children: "Control your Web3 identity"
-              }), createComponent(TextStyled$1, {
+              }), createComponent(TextStyled$2, {
                 translationKey: "walletModal.infoModal.manageIdentity",
                 children: "Manage your digital identity and access decentralized applications with ease. Maintain control over your data and engage securely in the blockchain ecosystem."
               })];
@@ -9500,10 +9650,10 @@ const InfoModal = (props) => {
             get children() {
               return [createComponent(SwapIcon, {
                 "class": InfoBlockIconClass
-              }), createComponent(H3Styled, {
+              }), createComponent(H3Styled$1, {
                 translationKey: "walletModal.infoModal.effortlessCryptoTransactions",
                 children: "Effortless crypto transactions"
-              }), createComponent(TextStyled$1, {
+              }), createComponent(TextStyled$2, {
                 translationKey: "walletModal.infoModal.easilySend",
                 children: "Easily send, receive, monitor your cryptocurrencies. Streamline your operations with decentralized applications."
               })];
@@ -9546,11 +9696,11 @@ const BodyStyled = styled.div`
     justify-content: center;
     min-height: 232px;
 `;
-const H1Styled$4 = styled(H1)`
+const H1Styled$6 = styled(H1)`
     max-width: 262px;
     margin: 0 auto 8px;
 `;
-const StyledIconButton = styled(IconButton)`
+const StyledIconButton$2 = styled(IconButton)`
     position: absolute;
     top: 16px;
     left: 16px;
@@ -9574,15 +9724,15 @@ const LoaderStyled = styled(LoaderIcon)`
     margin-bottom: 18px;
     margin-top: 2px;
 `;
-const ErrorIconStyled = styled(ErrorIcon)`
+const ErrorIconStyled$1 = styled(ErrorIcon)`
     margin-bottom: 16px;
 `;
-const BodyTextStyled = styled(H2)`
+const BodyTextStyled$1 = styled(H2)`
     color: ${(props) => props.theme.colors.text.secondary};
     text-align: center;
     margin-bottom: 20px;
 `;
-const ButtonsContainerStyled = styled.div`
+const ButtonsContainerStyled$1 = styled.div`
     display: flex;
     justify-content: center;
     gap: 8px;
@@ -9593,7 +9743,7 @@ const actionButtonBorderRadius$1 = {
   s: "8px",
   none: "0"
 };
-const H1Styled$3 = styled(H1)`
+const H1Styled$5 = styled(H1)`
     margin-bottom: 2px;
     padding: 0 52px;
 `;
@@ -9623,7 +9773,7 @@ const ActionButton$1 = styled(Button)`
     padding: 17px 20px 19px 20px;
 `;
 const MobileConnectionQR = (props) => {
-  return [createComponent(H1Styled$3, {
+  return [createComponent(H1Styled$5, {
     get children() {
       return props.walletInfo.name;
     }
@@ -9768,7 +9918,7 @@ const MobileConnectionModal = (props) => {
           return !props.backDisabled || showQR();
         },
         get children() {
-          return createComponent(StyledIconButton, {
+          return createComponent(StyledIconButton$2, {
             icon: "arrow",
             onClick: onBack
           });
@@ -9797,7 +9947,7 @@ const MobileConnectionModal = (props) => {
           return !showQR();
         },
         get children() {
-          return [createComponent(H1Styled$4, {
+          return [createComponent(H1Styled$6, {
             get children() {
               return props.wallet.name;
             }
@@ -9808,7 +9958,7 @@ const MobileConnectionModal = (props) => {
                   return connectionErrored();
                 },
                 get children() {
-                  return [createComponent(ErrorIconStyled, {
+                  return [createComponent(ErrorIconStyled$1, {
                     size: "s"
                   }), createComponent(Switch, {
                     get children() {
@@ -9817,7 +9967,7 @@ const MobileConnectionModal = (props) => {
                           return connectionErrored() === "missing-features";
                         },
                         get children() {
-                          return createComponent(BodyTextStyled, {
+                          return createComponent(BodyTextStyled$1, {
                             translationKey: "walletModal.mobileConnectionModal.missingFeatures",
                             get translationValues() {
                               return {
@@ -9832,7 +9982,7 @@ const MobileConnectionModal = (props) => {
                           return connectionErrored() === "connection-declined";
                         },
                         get children() {
-                          return createComponent(BodyTextStyled, {
+                          return createComponent(BodyTextStyled$1, {
                             translationKey: "walletModal.mobileConnectionModal.connectionDeclined",
                             children: "Connection declined"
                           });
@@ -9842,7 +9992,7 @@ const MobileConnectionModal = (props) => {
                           return connectionErrored() === "not-supported";
                         },
                         get children() {
-                          return createComponent(BodyTextStyled, {
+                          return createComponent(BodyTextStyled$1, {
                             translationKey: "walletModal.mobileConnectionModal.notSupportedWallet",
                             get translationValues() {
                               return {
@@ -9856,7 +10006,7 @@ const MobileConnectionModal = (props) => {
                         }
                       })];
                     }
-                  }), createComponent(ButtonsContainerStyled, {
+                  }), createComponent(ButtonsContainerStyled$1, {
                     get children() {
                       return createComponent(Switch, {
                         get children() {
@@ -9964,7 +10114,7 @@ const MobileConnectionModal = (props) => {
                 get children() {
                   return [createComponent(LoaderStyled, {
                     size: "s"
-                  }), createComponent(BodyTextStyled, {
+                  }), createComponent(BodyTextStyled$1, {
                     translationKey: "walletModal.mobileConnectionModal.continueIn",
                     get translationValues() {
                       return {
@@ -9974,7 +10124,7 @@ const MobileConnectionModal = (props) => {
                     get children() {
                       return ["Continue in ", createMemo(() => props.wallet.name), "\u2026"];
                     }
-                  }), createComponent(ButtonsContainerStyled, {
+                  }), createComponent(ButtonsContainerStyled$1, {
                     get children() {
                       return [createComponent(Button, {
                         get leftIcon() {
@@ -10041,7 +10191,7 @@ const MobileConnectionModal = (props) => {
     }
   });
 };
-const borders$1 = {
+const borders$2 = {
   m: "16px",
   s: "12px",
   none: "0"
@@ -10081,7 +10231,7 @@ styled.li`
         }
     }
 `;
-const H1Styled$2 = styled(H1)`
+const H1Styled$4 = styled(H1)`
     margin-top: 38px;
     margin-bottom: 4px;
     padding: 0 24px;
@@ -10110,7 +10260,7 @@ styled(Button)`
 const TelegramButtonStyled = styled(Button)`
     margin: 0 28px 24px;
     width: calc(100% - 56px);
-    border-radius: ${(props) => borders$1[props.theme.borderRadius]};
+    border-radius: ${(props) => borders$2[props.theme.borderRadius]};
     padding: 14px 16px 14px 14px;
     background-color: ${(props) => props.theme.colors.telegramButton};
 
@@ -10140,7 +10290,7 @@ const actionButtonBorderRadius = {
   s: "8px",
   none: "0"
 };
-const H1Styled$1 = styled(H1)`
+const H1Styled$3 = styled(H1)`
     margin-bottom: 2px;
     padding: 0 52px;
 `;
@@ -10170,7 +10320,7 @@ const ActionButton = styled(Button)`
     padding: 17px 20px 19px 20px;
 `;
 const MobileUniversalQR = (props) => {
-  return [createComponent(H1Styled$1, {
+  return [createComponent(H1Styled$3, {
     translationKey: "walletModal.mobileUniversalModal.connectYourWallet",
     children: "Connect your TON wallet"
   }), createComponent(H2Styled$1, {
@@ -10337,7 +10487,7 @@ const MobileUniversalModal = (props) => {
             return createComponent(QRIcon, {});
           },
           onClick: onOpenQR
-        }), createComponent(H1Styled$2, {
+        }), createComponent(H1Styled$4, {
           translationKey: "walletModal.mobileUniversalModal.connectYourWallet",
           children: "Connect your TON wallet"
         }), createComponent(Show, {
@@ -10419,7 +10569,7 @@ const MobileUniversalModal = (props) => {
     return _el$;
   })();
 };
-const borders = {
+const borders$1 = {
   m: "16px",
   s: "8px",
   none: "0"
@@ -10461,7 +10611,7 @@ styled(Button)`
     width: 100%;
     padding: 0 16px;
     height: 56px;
-    border-radius: ${(props) => borders[props.theme.borderRadius]};
+    border-radius: ${(props) => borders$1[props.theme.borderRadius]};
 
     &:hover {
         ${(props) => props.disableEventsAnimation ? "transform: unset;" : ""}
@@ -10481,7 +10631,7 @@ styled.ul`
     transform: translateY(-16px);
 
     background-color: ${(props) => props.theme.colors.background.primary};
-    border-radius: ${(props) => borders[props.theme.borderRadius]};
+    border-radius: ${(props) => borders$1[props.theme.borderRadius]};
     box-shadow: 0 4px 24px rgba(0, 0, 0, 0.16);
 `;
 styled.li`
@@ -10586,111 +10736,475 @@ const DesktopUniversalModal = (props) => {
     }
   });
 };
-const WalletsModal = () => {
-  const {
-    locale
-  } = useI18n()[1];
-  createEffect(() => locale(appState.language));
-  createEffect(() => {
-    if (getWalletsModalIsOpened()) {
-      updateIsMobile();
-    } else {
-      setSelectedWalletInfo(null);
-      setSelectedTab("universal");
-      setInfoTab(false);
-    }
-  });
-  const connector = useContext(ConnectorContext);
-  const tonConnectUI = useContext(TonConnectUiContext);
-  const [fetchedWalletsList] = createResource(() => tonConnectUI.getWallets());
-  const [selectedWalletInfo, setSelectedWalletInfo] = createSignal(null);
-  const [selectedWalletError, setSelectedWalletError] = createSignal(null);
-  const [selectedTab, setSelectedTab] = createSignal("universal");
-  const [infoTab, setInfoTab] = createSignal(false);
-  const walletsList = createMemo(() => {
-    if (fetchedWalletsList.state !== "ready") {
-      return null;
-    }
-    let walletsList2 = applyWalletsListConfiguration(fetchedWalletsList(), appState.walletsListConfiguration);
-    const injectedWallets = walletsList2.filter(isWalletInfoCurrentlyInjected);
-    const notInjectedWallets = walletsList2.filter((w) => !isWalletInfoCurrentlyInjected(w));
-    walletsList2 = (injectedWallets || []).concat(notInjectedWallets);
-    const preferredWalletAppName = appState.preferredWalletAppName;
-    const preferredWallet = walletsList2.find((item) => eqWalletName(item, preferredWalletAppName));
-    const someWalletsWithSameName = walletsList2.filter((item) => eqWalletName(item, preferredWalletAppName)).length >= 2;
-    if (preferredWalletAppName && preferredWallet && !someWalletsWithSameName) {
-      walletsList2 = [__spreadProps(__spreadValues({}, preferredWallet), {
-        isPreferred: true
-      })].concat(walletsList2.filter((item) => !eqWalletName(item, preferredWalletAppName)));
-    }
-    const atWallet = walletsList2.find((item) => eqWalletName(item, AT_WALLET_APP_NAME));
-    if (atWallet) {
-      walletsList2 = [atWallet].concat(walletsList2.filter((item) => !eqWalletName(item, AT_WALLET_APP_NAME)));
-    }
-    const uiWallets = walletsList2.map((wallet) => {
-      var _a2;
-      return __spreadProps(__spreadValues({}, wallet), {
-        isSupportRequiredFeatures: (tonConnectUI == null ? void 0 : tonConnectUI.walletsRequiredFeatures) ? checkRequiredWalletFeatures((_a2 = wallet.features) != null ? _a2 : [], tonConnectUI.walletsRequiredFeatures) : true
-      });
-    });
-    return uiWallets;
-  });
-  const additionalRequestLoading = () => {
-    var _a2;
-    return ((_a2 = appState.connectRequestParameters) == null ? void 0 : _a2.state) === "loading";
-  };
-  const additionalRequest = createMemo(() => {
-    var _a2;
-    if (additionalRequestLoading()) {
-      return void 0;
-    }
-    return (_a2 = appState.connectRequestParameters) == null ? void 0 : _a2.value;
-  });
-  const onClose = (closeReason) => {
-    tonConnectUI.closeModal(closeReason);
-  };
-  const unsubscribe = connector.onStatusChange((wallet) => {
-    if (wallet) {
-      onClose("wallet-selected");
-    }
-  }, (err) => {
-    var _a2;
-    if (err instanceof WalletMissingRequiredFeaturesError) {
-      const errorAppName = err.cause.connectEvent.device.appName.toLowerCase();
-      const wallet = (_a2 = walletsList()) == null ? void 0 : _a2.find((w) => w.appName.toLowerCase() === errorAppName);
-      if (!wallet) {
-        throw new TonConnectError("Wallet not found");
-      }
-      const walletErrorType = wallet.isSupportRequiredFeatures ? "missing-features" : "not-supported";
-      setSelectedWalletError(walletErrorType);
-      setSelectedWalletInfo(wallet);
-    }
-  });
-  const onSelectAllWallets = () => {
-    setSelectedTab("all-wallets");
-  };
-  const onSelectUniversal = () => {
-    setSelectedTab("universal");
-  };
-  const clearSelectedWalletInfo = () => {
-    setSelectedWalletInfo(null);
-    setSelectedWalletError(null);
-  };
-  onCleanup(() => {
-    setSelectedWalletInfo(null);
-    setSelectedWalletError(null);
-    setInfoTab(false);
-  });
-  onCleanup(unsubscribe);
-  return createComponent(StyledModal, {
-    get opened() {
-      return getWalletsModalIsOpened();
-    },
-    get enableAndroidBackHandler() {
-      return appState.enableAndroidBackHandler;
-    },
+const borders = {
+  m: "16px",
+  s: "8px",
+  none: "0"
+};
+const H1Styled$2 = styled(H1)`
+    max-width: 288px;
+    margin: 0 auto 38px;
+`;
+const DesktopFeatureNotSupportModalStyled = styled.div`
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+`;
+const StyledIconButton$1 = styled(IconButton)`
+    position: absolute;
+    top: 16px;
+    left: 16px;
+`;
+const TitleStyled = styled(H1)`
+    text-align: center;
+    font-size: 20px;
+    line-height: 28px;
+`;
+const DescriptionStyled = styled(Text)`
+    margin-top: 12px;
+    margin-bottom: 24px;
+    text-align: center;
+    max-width: 360px;
+    font-weight: 400;
+    color: ${(props) => props.theme.colors.text.secondary};
+`;
+styled.button`
+    background: transparent;
+    border: none;
+    padding: 0;
+    margin: 0;
+    color: ${(props) => props.theme.colors.accent};
+    text-decoration: underline;
+    cursor: pointer;
+    font: inherit;
+`;
+const Spacer = styled.div`
+    margin-bottom: 46px;
+`;
+const ErrorIconStyled = styled(ErrorIcon)`
+    margin-bottom: 16px;
+`;
+styled.ul`
+    display: flex;
+    gap: 8px;
+    margin-bottom: 24px;
+    list-style: none;
+    padding: 0;
+`;
+const DisconnectButtonStyled = styled(Button)`
+    max-width: 320px;
+    width: 100%;
+    height: 48px;
+    font-size: 16px;
+    line-height: 20px;
+    border-radius: ${(props) => borders[props.theme.borderRadius]};
+    margin-bottom: 28px;
+`;
+const BodyTextStyled = styled(H2)`
+    color: ${(props) => props.theme.colors.text.secondary};
+    text-align: center;
+    margin-bottom: 20px;
+`;
+const ButtonsContainerStyled = styled.div`
+    display: flex;
+    justify-content: center;
+    gap: 8px;
+    padding-bottom: 31px;
+`;
+const RestoreInfoModalStyled = styled.div`
+    margin: 0 8px 16px 8px;
+`;
+const StyledIconButton = styled(IconButton)`
+    position: absolute;
+    top: 16px;
+    left: 16px;
+`;
+const H1Styled$1 = styled(H1)`
+    margin-bottom: 18px;
+    text-align: center;
+`;
+const StepBlock = styled.div`
+    padding: 16px 0;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+`;
+styled.div`
+    margin-bottom: 12px;
+`;
+const H3Styled = styled(H3)`
+    text-align: center;
+    margin-bottom: 4px;
+`;
+const TextStyled$1 = styled(Text)`
+    text-align: center;
+    max-width: 352px;
+    color: ${(props) => props.theme.colors.text.secondary};
+`;
+const CircleNumber = styled.div`
+    width: 44px;
+    height: 44px;
+    border-radius: 20px;
+    background-color: ${(props) => {
+  var _a2;
+  return (_a2 = props.theme) == null ? void 0 : _a2.colors.icon.secondary;
+}};
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin-bottom: 12px;
+    font-weight: 700;
+    font-size: 22px;
+    color: ${(props) => {
+  var _a2;
+  return (_a2 = props.theme) == null ? void 0 : _a2.colors.text.primary;
+}};
+`;
+const RestoreInfoModal = (props) => {
+  return createComponent(RestoreInfoModalStyled, {
+    "data-tc-wallets-modal-restore": "true",
+    get children() {
+      return [createComponent(StyledIconButton, {
+        icon: "arrow",
+        get onClick() {
+          return props.onBackClick;
+        }
+      }), createComponent(H1Styled$1, {
+        translationKey: "walletModal.restoreInfoModal.title",
+        children: "Restore"
+      }), createComponent(ScrollContainer, {
+        get children() {
+          return [createComponent(StepBlock, {
+            get children() {
+              return [createComponent(CircleNumber, {
+                children: "1"
+              }), createComponent(H3Styled, {
+                translationKey: "walletModal.restoreModal.step1.title",
+                children: "Find your current recovery phrase"
+              }), createComponent(TextStyled$1, {
+                translationKey: "walletModal.restoreModal.step1.text",
+                children: "Open your wallet settings and locate the\xA0recovery\xA0phrase"
+              })];
+            }
+          }), createComponent(StepBlock, {
+            get children() {
+              return [createComponent(CircleNumber, {
+                children: "2"
+              }), createComponent(H3Styled, {
+                translationKey: "walletModal.restoreModal.step2.title",
+                children: "Copy your recovery phrase"
+              }), createComponent(TextStyled$1, {
+                translationKey: "walletModal.restoreModal.step2.text",
+                children: "Write it down or copy it to a safe place"
+              })];
+            }
+          }), createComponent(StepBlock, {
+            get children() {
+              return [createComponent(CircleNumber, {
+                children: "3"
+              }), createComponent(H3Styled, {
+                translationKey: "walletModal.restoreModal.step3.title",
+                children: "Restore in a supported wallet from\xA0the\xA0list\xA0below"
+              }), createComponent(TextStyled$1, {
+                translationKey: "walletModal.restoreModal.step3.text",
+                children: "Enter the recovery phrase to access your wallet"
+              })];
+            }
+          })];
+        }
+      })];
+    }
+  });
+};
+const DesktopFeatureNotSupportModal = (props) => {
+  const [selectedWallet, setSelectedWallet] = createSignal(null);
+  const [infoModalOpen, setInfoModalOpen] = createSignal(false);
+  const currentWalletUI = createMemo(() => props.walletsList.find((wallet) => wallet.appName === props.currentWallet.device.appName || wallet.name === props.currentWallet.device.appName));
+  const currentWalletName = createMemo(() => {
+    var _a2, _b2, _c2, _d2;
+    const appName = (_b2 = (_a2 = currentWalletUI()) == null ? void 0 : _a2.appName) != null ? _b2 : props.currentWallet.device.appName;
+    if (appName === AT_WALLET_APP_NAME) {
+      return "Wallet in Telegram";
+    }
+    return (_d2 = (_c2 = currentWalletUI()) == null ? void 0 : _c2.name) != null ? _d2 : props.currentWallet.device.appName;
+  });
+  const currentWalletVersionNotSupported = createMemo(() => {
+    const currentWalletUIVar = currentWalletUI();
+    if (!(currentWalletUIVar == null ? void 0 : currentWalletUIVar.features)) {
+      return false;
+    }
+    const requiredFeature = props.walletsModalState.requiredFeature;
+    const requiredFeatures = requiredFeature ? {
+      [requiredFeature.featureName]: requiredFeature.value
+    } : {};
+    const validInList = checkRequiredWalletFeatures(currentWalletUIVar.features, requiredFeatures);
+    const validCurrentWallet = checkRequiredWalletFeatures(props.currentWallet.device.features, requiredFeatures);
+    return validInList && !validCurrentWallet;
+  });
+  const handleDisconnect = () => __async(void 0, null, function* () {
+    yield props.onDisconnect();
+    props.onSelect(selectedWallet());
+  });
+  return createComponent(DesktopFeatureNotSupportModalStyled, {
+    get children() {
+      return createComponent(Switch, {
+        get children() {
+          return [createComponent(Match, {
+            get when() {
+              return infoModalOpen();
+            },
+            get children() {
+              return createComponent(RestoreInfoModal, {
+                onBackClick: () => setInfoModalOpen(false)
+              });
+            }
+          }), createComponent(Match, {
+            get when() {
+              return selectedWallet();
+            },
+            get children() {
+              return [createComponent(Spacer, {}), createComponent(DesktopFeatureNotSupportModalStyled, {
+                get children() {
+                  return [createComponent(StyledIconButton$1, {
+                    icon: "arrow",
+                    onClick: () => setSelectedWallet(null)
+                  }), createComponent(TitleStyled, {
+                    translationKey: "walletModal.featureNotSupported.disconnect.title",
+                    children: "Confirm Disconnect"
+                  }), createComponent(DescriptionStyled, {
+                    translationKey: "walletModal.featureNotSupported.disconnect.description",
+                    get translationValues() {
+                      return {
+                        name: selectedWallet().name
+                      };
+                    },
+                    get children() {
+                      return ["You will be disconnected from your current wallet and redirected to connect ", createMemo(() => {
+                        var _a2;
+                        return (_a2 = selectedWallet()) == null ? void 0 : _a2.name;
+                      }), "."];
+                    }
+                  }), createComponent(DisconnectButtonStyled, {
+                    onClick: () => handleDisconnect(),
+                    get children() {
+                      return createComponent(Translation, {
+                        translationKey: "walletModal.featureNotSupported.disconnect.button",
+                        children: "Disconnect"
+                      });
+                    }
+                  })];
+                }
+              })];
+            }
+          }), createComponent(Match, {
+            get when() {
+              return currentWalletVersionNotSupported();
+            },
+            get children() {
+              return [createComponent(H1Styled$2, {
+                get children() {
+                  return currentWalletName();
+                }
+              }), createComponent(ErrorIconStyled, {
+                size: "s"
+              }), createComponent(BodyTextStyled, {
+                translationKey: "walletModal.featureNotSupported.version.description",
+                get translationValues() {
+                  return {
+                    name: currentWalletName()
+                  };
+                },
+                get children() {
+                  return ["Your current version of ", createMemo(() => currentWalletName()), " or wallet contract type doesn't support the required features. Please update it to continue."];
+                }
+              }), createComponent(ButtonsContainerStyled, {
+                get children() {
+                  return [createComponent(Link, {
+                    get href() {
+                      return currentWalletUI().aboutUrl;
+                    },
+                    blank: true,
+                    get children() {
+                      return createComponent(Button, {
+                        get leftIcon() {
+                          return createComponent(LinkIcon, {});
+                        },
+                        get children() {
+                          return createComponent(Translation, {
+                            translationKey: "walletModal.featureNotSupported.version.updateButton",
+                            get translationValues() {
+                              return {
+                                name: currentWalletName()
+                              };
+                            },
+                            get children() {
+                              return ["Update ", createMemo(() => currentWalletName())];
+                            }
+                          });
+                        }
+                      });
+                    }
+                  }), createComponent(Link, {
+                    href: "https://tonkeeper.helpscoutdocs.com/article/102-w5",
+                    blank: true,
+                    get children() {
+                      return createComponent(Button, {
+                        get leftIcon() {
+                          return createComponent(LinkIcon, {});
+                        },
+                        get children() {
+                          return createComponent(Translation, {
+                            translationKey: "walletModal.featureNotSupported.version.aboutW5",
+                            children: "About W5"
+                          });
+                        }
+                      });
+                    }
+                  })];
+                }
+              })];
+            }
+          }), createComponent(Match, {
+            when: true,
+            get children() {
+              return [createComponent(Spacer, {}), createComponent(ErrorIconStyled, {
+                size: "s"
+              }), createComponent(TitleStyled, {
+                translationKey: "walletModal.featureNotSupported.wallet.title",
+                get translationValues() {
+                  return {
+                    name: currentWalletName()
+                  };
+                },
+                get children() {
+                  return [createMemo(() => currentWalletName()), " doesn\u2019t support the requested\xA0action"];
+                }
+              }), createComponent(Spacer, {})];
+            }
+          })];
+        }
+      });
+    }
+  });
+};
+const WalletsModal = () => {
+  const {
+    locale
+  } = useI18n()[1];
+  createEffect(() => locale(appState.language));
+  createEffect(() => {
+    if (getWalletsModalIsOpened()) {
+      updateIsMobile();
+    } else {
+      setSelectedWalletInfo(null);
+      setSelectedTab("universal");
+      setInfoTab(false);
+    }
+  });
+  const connector = useContext(ConnectorContext);
+  const tonConnectUI = useContext(TonConnectUiContext);
+  const [fetchedWalletsList] = createResource(() => tonConnectUI.getWallets());
+  const [selectedWalletInfo, setSelectedWalletInfo] = createSignal(null);
+  const [selectedWalletError, setSelectedWalletError] = createSignal(null);
+  const [selectedTab, setSelectedTab] = createSignal("universal");
+  const [infoTab, setInfoTab] = createSignal(false);
+  const walletsModalIsWalletNotSupportFeature = createMemo(() => {
+    const state = walletsModalState();
+    return "type" in state && state.type === "wallet-not-support-feature";
+  });
+  const walletsList = createMemo(() => {
+    var _a2;
+    if (fetchedWalletsList.state !== "ready") {
+      return null;
+    }
+    let walletsList2 = applyWalletsListConfiguration(fetchedWalletsList(), appState.walletsListConfiguration);
+    const injectedWallets = walletsList2.filter(isWalletInfoCurrentlyInjected);
+    const notInjectedWallets = walletsList2.filter((w) => !isWalletInfoCurrentlyInjected(w));
+    walletsList2 = (injectedWallets || []).concat(notInjectedWallets);
+    const preferredWalletAppName = appState.preferredWalletAppName;
+    const preferredWallet = walletsList2.find((item) => eqWalletName(item, preferredWalletAppName));
+    const someWalletsWithSameName = walletsList2.filter((item) => eqWalletName(item, preferredWalletAppName)).length >= 2;
+    if (preferredWalletAppName && preferredWallet && !someWalletsWithSameName) {
+      walletsList2 = [__spreadProps(__spreadValues({}, preferredWallet), {
+        isPreferred: true
+      })].concat(walletsList2.filter((item) => !eqWalletName(item, preferredWalletAppName)));
+    }
+    const atWallet = walletsList2.find((item) => eqWalletName(item, AT_WALLET_APP_NAME));
+    if (atWallet) {
+      walletsList2 = [atWallet].concat(walletsList2.filter((item) => !eqWalletName(item, AT_WALLET_APP_NAME)));
+    }
+    const walletsFeaturesRequested = (_a2 = tonConnectUI == null ? void 0 : tonConnectUI.walletsRequiredFeatures) != null ? _a2 : tonConnectUI == null ? void 0 : tonConnectUI.walletsPreferredFeatures;
+    const uiWallets = walletsList2.map((wallet) => {
+      var _a3;
+      return __spreadProps(__spreadValues({}, wallet), {
+        isSupportRequiredFeatures: walletsFeaturesRequested ? checkRequiredWalletFeatures((_a3 = wallet.features) != null ? _a3 : [], walletsFeaturesRequested) : true
+      });
+    });
+    return uiWallets;
+  });
+  const additionalRequestLoading = () => {
+    var _a2;
+    return ((_a2 = appState.connectRequestParameters) == null ? void 0 : _a2.state) === "loading";
+  };
+  const additionalRequest = createMemo(() => {
+    var _a2;
+    if (additionalRequestLoading()) {
+      return void 0;
+    }
+    return (_a2 = appState.connectRequestParameters) == null ? void 0 : _a2.value;
+  });
+  const onClose = (closeReason) => {
+    tonConnectUI.closeModal(closeReason);
+  };
+  const unsubscribe = connector.onStatusChange((wallet) => {
+    if (wallet) {
+      onClose("wallet-selected");
+    }
+  }, (err) => {
+    var _a2;
+    if (err instanceof WalletMissingRequiredFeaturesError) {
+      const errorAppName = err.cause.connectEvent.device.appName.toLowerCase();
+      const wallet = (_a2 = walletsList()) == null ? void 0 : _a2.find((w) => w.appName.toLowerCase() === errorAppName);
+      if (!wallet) {
+        throw new TonConnectError("Wallet not found");
+      }
+      const walletErrorType = wallet.isSupportRequiredFeatures ? "missing-features" : "not-supported";
+      setSelectedWalletError(walletErrorType);
+      setSelectedWalletInfo(wallet);
+    }
+  });
+  const onSelectAllWallets = () => {
+    setSelectedTab("all-wallets");
+  };
+  const onSelectUniversal = () => {
+    setSelectedTab("universal");
+  };
+  const onSelectWallet = (wallet) => {
+    setSelectedWalletInfo(wallet);
+    widgetController.openWalletsModal();
+  };
+  const clearSelectedWalletInfo = () => {
+    setSelectedWalletInfo(null);
+    setSelectedWalletError(null);
+  };
+  onCleanup(() => {
+    setSelectedWalletInfo(null);
+    setSelectedWalletError(null);
+    setInfoTab(false);
+  });
+  onCleanup(unsubscribe);
+  return createComponent(StyledModal, {
+    get opened() {
+      return getWalletsModalIsOpened();
+    },
+    get enableAndroidBackHandler() {
+      return appState.enableAndroidBackHandler;
+    },
     onClose: () => onClose("action-cancelled"),
     onClickQuestion: () => setInfoTab((v) => !v),
+    get showFooter() {
+      return !walletsModalIsWalletNotSupportFeature();
+    },
     "data-tc-wallets-modal-container": "true",
     get children() {
       return [createComponent(Show, {
@@ -10712,7 +11226,7 @@ const WalletsModal = () => {
               return additionalRequestLoading() || !walletsList();
             },
             get children() {
-              return [createComponent(H1Styled$8, {
+              return [createComponent(H1Styled$a, {
                 translationKey: "walletModal.loading",
                 children: "Wallets list is loading"
               }), createComponent(LoaderContainerStyled, {
@@ -10731,6 +11245,27 @@ const WalletsModal = () => {
               return createComponent(Switch, {
                 get children() {
                   return [createComponent(Match, {
+                    get when() {
+                      return walletsModalIsWalletNotSupportFeature();
+                    },
+                    get children() {
+                      return createComponent(DesktopFeatureNotSupportModal, {
+                        get walletsList() {
+                          return walletsList();
+                        },
+                        get currentWallet() {
+                          return tonConnectUI == null ? void 0 : tonConnectUI.wallet;
+                        },
+                        onSelect: onSelectWallet,
+                        onSelectAllWallets,
+                        onDisconnect: () => connector.disconnect(),
+                        get walletsModalState() {
+                          return walletsModalState();
+                        },
+                        onClose: () => onClose("action-cancelled")
+                      });
+                    }
+                  }), createComponent(Match, {
                     get when() {
                       return selectedWalletInfo();
                     },
@@ -10779,6 +11314,9 @@ const WalletsModal = () => {
                         get walletsList() {
                           return walletsList();
                         },
+                        get featureCheckMode() {
+                          return (tonConnectUI == null ? void 0 : tonConnectUI.walletsRequiredFeatures) ? "strict" : "soft";
+                        },
                         onBack: onSelectUniversal,
                         onSelect: setSelectedWalletInfo
                       });
@@ -10827,9 +11365,13 @@ const ActionModal = (props) => {
   const tonConnectUI = useContext(TonConnectUiContext);
   const [firstClick, setFirstClick] = createSignal(true);
   const [sent, setSent] = createSignal(false);
+  const [signed, setSigned] = createSignal(false);
+  const [canceled, setCanceled] = createSignal(false);
   createEffect(() => {
     const currentAction = action();
-    setSent(!!currentAction && "sent" in currentAction && currentAction.sent);
+    setSent(!!currentAction && ("sent" in currentAction && currentAction.sent || currentAction.name === "transaction-sent"));
+    setSigned(!!currentAction && ("signed" in currentAction && currentAction.signed || currentAction.name === "data-signed"));
+    setCanceled(!!currentAction && (currentAction.name === "transaction-canceled" || currentAction.name === "sign-data-canceled"));
   });
   let universalLink;
   if ((tonConnectUI == null ? void 0 : tonConnectUI.wallet) && "universalLink" in tonConnectUI.wallet && (tonConnectUI.wallet.openMethod === "universal-link" || isTelegramUrl(tonConnectUI.wallet.universalLink) && isInTMA())) {
@@ -10876,7 +11418,7 @@ const ActionModal = (props) => {
         }
       }), createComponent(Show, {
         get when() {
-          return !sent() && (props.showButton === "open-wallet" && universalLink || props.showButton !== "open-wallet");
+          return !sent() && !signed() && !canceled() && (props.showButton === "open-wallet" && universalLink || props.showButton !== "open-wallet");
         },
         get children() {
           return createComponent(LoaderButtonStyled, {
@@ -10889,7 +11431,7 @@ const ActionModal = (props) => {
         }
       }), createComponent(Show, {
         get when() {
-          return sent();
+          return sent() || signed();
         },
         get children() {
           return [createComponent(Show, {
@@ -10972,10 +11514,57 @@ const TransactionSentModal = (props) => {
         size: "m"
       });
     },
+    showButton: "open-wallet",
     onClose: () => props.onClose(),
     "data-tc-transaction-sent-modal": "true"
   });
 };
+const ConfirmSignDataModal = (props) => {
+  const tonConnectUI = useContext(TonConnectUiContext);
+  const [t2] = useI18n();
+  const name = () => tonConnectUI.wallet && "name" in tonConnectUI.wallet ? tonConnectUI.wallet.name : t2("common.yourWallet", {}, "Your wallet");
+  return createComponent(ActionModal, {
+    headerTranslationKey: "actionModal.signData.header",
+    get headerTranslationValues() {
+      return {
+        name: name()
+      };
+    },
+    textTranslationKey: "actionModal.signData.text",
+    get icon() {
+      return createComponent(LoaderIcon, {
+        size: "m"
+      });
+    },
+    onClose: () => props.onClose(),
+    showButton: "open-wallet",
+    "data-tc-sign-data-confirm-modal": "true"
+  });
+};
+const SignDataCanceledModal = (props) => {
+  return createComponent(ActionModal, {
+    headerTranslationKey: "actionModal.signDataCanceled.header",
+    get icon() {
+      return createComponent(ErrorIcon, {
+        size: "m"
+      });
+    },
+    onClose: () => props.onClose(),
+    "data-tc-sign-data-canceled-modal": "true"
+  });
+};
+const DataSignedModal = (props) => {
+  return createComponent(ActionModal, {
+    headerTranslationKey: "actionModal.dataSigned.header",
+    get icon() {
+      return createComponent(SuccessIcon, {
+        size: "m"
+      });
+    },
+    onClose: () => props.onClose(),
+    "data-tc-data-signed-modal": "true"
+  });
+};
 const ActionsModal = () => {
   return createComponent(Modal, {
     get opened() {
@@ -10986,6 +11575,7 @@ const ActionsModal = () => {
       return appState.enableAndroidBackHandler;
     },
     onClose: () => setAction(null),
+    showFooter: false,
     "data-tc-actions-modal-container": "true",
     get children() {
       return createComponent(Switch, {
@@ -11017,6 +11607,33 @@ const ActionsModal = () => {
                 onClose: () => setAction(null)
               });
             }
+          }), createComponent(Match, {
+            get when() {
+              return action().name === "data-signed";
+            },
+            get children() {
+              return createComponent(DataSignedModal, {
+                onClose: () => setAction(null)
+              });
+            }
+          }), createComponent(Match, {
+            get when() {
+              return action().name === "sign-data-canceled";
+            },
+            get children() {
+              return createComponent(SignDataCanceledModal, {
+                onClose: () => setAction(null)
+              });
+            }
+          }), createComponent(Match, {
+            get when() {
+              return action().name === "confirm-sign-data";
+            },
+            get children() {
+              return createComponent(ConfirmSignDataModal, {
+                onClose: () => setAction(null)
+              });
+            }
           })];
         }
       });
@@ -11068,6 +11685,7 @@ const SingleWalletModal = () => {
     },
     onClose: () => onClose("action-cancelled"),
     onClickQuestion: () => setInfoTab((v) => !v),
+    showFooter: true,
     "data-tc-wallets-modal-container": "true",
     get children() {
       return [createComponent(Show, {
@@ -11089,7 +11707,7 @@ const SingleWalletModal = () => {
               return additionalRequestLoading();
             },
             get children() {
-              return [createComponent(H1Styled$8, {
+              return [createComponent(H1Styled$a, {
                 translationKey: "walletModal.loading",
                 children: "Wallets list is loading"
               }), createComponent(LoaderContainerStyled, {
@@ -11195,6 +11813,12 @@ const widgetController = {
     status: "closed",
     closeReason: reason
   })),
+  openWalletNotSupportFeatureModal: (cause) => void setTimeout(() => setWalletsModalState({
+    status: "opened",
+    closeReason: null,
+    type: "wallet-not-support-feature",
+    requiredFeature: cause.requiredFeature
+  })),
   setAction: (action2) => void setTimeout(() => setAction(action2)),
   clearAction: () => void setTimeout(() => setAction(null)),
   getSelectedWalletInfo: () => lastSelectedWalletInfo(),
@@ -11506,8 +12130,29 @@ class TonConnectUITracker {
     } catch (e2) {
     }
   }
+  trackDataSentForSignature(...args) {
+    try {
+      const event = createDataSentForSignatureEvent(this.version, ...args);
+      this.dispatchUserActionEvent(event);
+    } catch (e2) {
+    }
+  }
+  trackDataSigned(...args) {
+    try {
+      const event = createDataSignedEvent(this.version, ...args);
+      this.dispatchUserActionEvent(event);
+    } catch (e2) {
+    }
+  }
+  trackDataSigningFailed(...args) {
+    try {
+      const event = createDataSigningFailedEvent(this.version, ...args);
+      this.dispatchUserActionEvent(event);
+    } catch (e2) {
+    }
+  }
 }
-const tonConnectUiVersion = "2.1.1-beta.0";
+const tonConnectUiVersion = "2.2.0";
 class TonConnectUI {
   constructor(options) {
     __publicField(this, "walletInfoStorage", new WalletInfoStorage());
@@ -11517,7 +12162,8 @@ class TonConnectUI {
     __publicField(this, "systemThemeChangeUnsubscribe", null);
     __publicField(this, "actionsConfiguration");
     __publicField(this, "walletsList");
-    __publicField(this, "walletsRequiredFeatures");
+    __publicField(this, "_walletsRequiredFeatures");
+    __publicField(this, "_walletsPreferredFeatures");
     __publicField(this, "connectRequestParametersCallback");
     __publicField(this, "connector");
     __publicField(this, "modal");
@@ -11558,7 +12204,8 @@ class TonConnectUI {
     this.transactionModal = new TransactionModalManager({
       connector: this.connector
     });
-    this.walletsRequiredFeatures = options.walletsRequiredFeatures;
+    this._walletsRequiredFeatures = options.walletsRequiredFeatures;
+    this._walletsPreferredFeatures = options.walletsPreferredFeatures;
     this.walletsList = this.getWallets();
     this.walletsList.then((list) => preloadImages(uniq(list.map((item) => item.imageUrl))));
     const rootId = this.normalizeWidgetRoot(options == null ? void 0 : options.widgetRootId);
@@ -11587,6 +12234,12 @@ class TonConnectUI {
   static getWallets() {
     return TonConnect.getWallets();
   }
+  get walletsRequiredFeatures() {
+    return this._walletsRequiredFeatures;
+  }
+  get walletsPreferredFeatures() {
+    return this._walletsPreferredFeatures;
+  }
   get connected() {
     return this.connector.connected;
   }
@@ -11603,6 +12256,12 @@ class TonConnectUI {
     var _a2, _b2, _c2, _d2, _e2;
     this.checkButtonRootExist(options.buttonRootId);
     this.actionsConfiguration = options.actionsConfiguration;
+    if ("walletsRequiredFeatures" in options) {
+      this._walletsRequiredFeatures = options.walletsRequiredFeatures;
+    }
+    if ("walletsPreferredFeatures" in options) {
+      this._walletsPreferredFeatures = options.walletsPreferredFeatures;
+    }
     if ((_a2 = options.uiPreferences) == null ? void 0 : _a2.theme) {
       if (((_b2 = options.uiPreferences) == null ? void 0 : _b2.theme) !== "SYSTEM") {
         (_c2 = this.systemThemeChangeUnsubscribe) == null ? void 0 : _c2.call(this);
@@ -11727,6 +12386,7 @@ class TonConnectUI {
         openModal: modals.includes("before"),
         sent: false
       });
+      const abortController = new AbortController();
       const onRequestSent = () => {
         if (abortController.signal.aborted) {
           return;
@@ -11737,28 +12397,11 @@ class TonConnectUI {
           openModal: modals.includes("before"),
           sent: true
         });
-        if (this.walletInfo && "universalLink" in this.walletInfo && (this.walletInfo.openMethod === "universal-link" || this.walletInfo.openMethod === "custom-deeplink")) {
-          if (isTelegramUrl(this.walletInfo.universalLink)) {
-            redirectToTelegram(this.walletInfo.universalLink, {
-              returnStrategy,
-              twaReturnUrl: twaReturnUrl || appState.twaReturnUrl,
-              forceRedirect: false
-            });
-          } else {
-            redirectToWallet(
-              this.walletInfo.universalLink,
-              this.walletInfo.deepLink,
-              {
-                returnStrategy,
-                forceRedirect: false
-              },
-              () => {
-              }
-            );
-          }
-        }
+        this.redirectAfterRequestSent({
+          returnStrategy,
+          twaReturnUrl
+        });
       };
-      const abortController = new AbortController();
       const unsubscribe = this.onTransactionModalStateChange((action2) => {
         if (action2 == null ? void 0 : action2.openModal) {
           return;
@@ -11784,6 +12427,11 @@ class TonConnectUI {
         });
         return result;
       } catch (e2) {
+        if (e2 instanceof WalletNotSupportFeatureError) {
+          widgetController.clearAction();
+          widgetController.openWalletNotSupportFeatureModal(e2.cause);
+          throw e2;
+        }
         widgetController.setAction({
           name: "transaction-canceled",
           showNotification: notifications2.includes("error"),
@@ -11800,6 +12448,110 @@ class TonConnectUI {
       }
     });
   }
+  signData(data) {
+    return __async(this, null, function* () {
+      this.tracker.trackDataSentForSignature(this.wallet, data);
+      if (!this.connected) {
+        this.tracker.trackDataSigningFailed(this.wallet, data, "Wallet was not connected");
+        throw new TonConnectUIError("Connect wallet to send a transaction.");
+      }
+      if (isInTMA()) {
+        sendExpand();
+      }
+      const { notifications: notifications2, modals, returnStrategy, twaReturnUrl } = this.getModalsAndNotificationsConfiguration();
+      widgetController.setAction({
+        name: "confirm-sign-data",
+        showNotification: notifications2.includes("before"),
+        openModal: modals.includes("before"),
+        signed: false
+      });
+      const abortController = new AbortController();
+      const onRequestSent = () => {
+        if (abortController.signal.aborted) {
+          return;
+        }
+        widgetController.setAction({
+          name: "confirm-sign-data",
+          showNotification: notifications2.includes("before"),
+          openModal: modals.includes("before"),
+          signed: true
+        });
+        this.redirectAfterRequestSent({
+          returnStrategy,
+          twaReturnUrl
+        });
+      };
+      const unsubscribe = this.onTransactionModalStateChange((action2) => {
+        if (action2 == null ? void 0 : action2.openModal) {
+          return;
+        }
+        unsubscribe();
+        if (!action2) {
+          abortController.abort();
+        }
+      });
+      try {
+        const result = yield this.waitForSignData(
+          {
+            data,
+            signal: new AbortController().signal
+          },
+          onRequestSent
+        );
+        this.tracker.trackDataSigned(this.wallet, data, result);
+        widgetController.setAction({
+          name: "data-signed",
+          showNotification: notifications2.includes("success"),
+          openModal: modals.includes("success")
+        });
+        return result;
+      } catch (e2) {
+        if (e2 instanceof WalletNotSupportFeatureError) {
+          widgetController.clearAction();
+          widgetController.openWalletNotSupportFeatureModal(e2.cause);
+          throw e2;
+        }
+        widgetController.setAction({
+          name: "sign-data-canceled",
+          showNotification: notifications2.includes("error"),
+          openModal: modals.includes("error")
+        });
+        if (e2 instanceof TonConnectError) {
+          throw e2;
+        } else {
+          console.error(e2);
+          throw new TonConnectUIError("Unhandled error:" + e2);
+        }
+      } finally {
+        unsubscribe();
+      }
+    });
+  }
+  redirectAfterRequestSent({
+    returnStrategy,
+    twaReturnUrl
+  }) {
+    if (this.walletInfo && "universalLink" in this.walletInfo && (this.walletInfo.openMethod === "universal-link" || this.walletInfo.openMethod === "custom-deeplink")) {
+      if (isTelegramUrl(this.walletInfo.universalLink)) {
+        redirectToTelegram(this.walletInfo.universalLink, {
+          returnStrategy,
+          twaReturnUrl: twaReturnUrl || appState.twaReturnUrl,
+          forceRedirect: false
+        });
+      } else {
+        redirectToWallet(
+          this.walletInfo.universalLink,
+          this.walletInfo.deepLink,
+          {
+            returnStrategy,
+            forceRedirect: false
+          },
+          () => {
+          }
+        );
+      }
+    }
+  }
   connectEmbeddedWallet(embeddedWallet) {
     return __async(this, null, function* () {
       const connect = (parameters) => {
@@ -11922,6 +12674,33 @@ class TonConnectUI {
       });
     });
   }
+  waitForSignData(options, onRequestSent) {
+    return __async(this, null, function* () {
+      return new Promise((resolve, reject) => {
+        const { data, signal } = options;
+        if (signal.aborted) {
+          this.tracker.trackDataSigningFailed(this.wallet, data, "SignData was cancelled");
+          return reject(new TonConnectUIError("SignData was not sent"));
+        }
+        const onSignHandler = (data2) => __async(this, null, function* () {
+          resolve(data2);
+        });
+        const onErrorsHandler = (reason) => {
+          reject(reason);
+        };
+        const onCanceledHandler = () => {
+          this.tracker.trackDataSigningFailed(this.wallet, data, "SignData was cancelled");
+          reject(new TonConnectUIError("SignData was not sent"));
+        };
+        signal.addEventListener("abort", onCanceledHandler, { once: true });
+        this.connector.signData(data, { onRequestSent, signal }).then((result) => {
+          return onSignHandler(result);
+        }).catch((reason) => {
+          return onErrorsHandler(reason);
+        });
+      });
+    });
+  }
   onTransactionModalStateChange(onChange) {
     return this.transactionModal.onStateChange(onChange);
   }