btc-wallet 0.5.23-beta → 0.5.25-beta

package/README.md

@@ -19,7 +19,7 @@ Initialize and integrate BTC wallet with NEAR wallet selector.
 ```typescript
 // 1. Setup wallet selector with BTC wallet module
 import { setupWalletSelector } from '@near-wallet-selector/core';
-import { setupBTCWallet } from 'btc-wallet';
+import { setupBTCWallet, setupWalletSelectorModal } from 'btc-wallet';
 
 const selector = await setupWalletSelector({
   network: 'mainnet', // or 'testnet'
@@ -36,7 +36,12 @@ const selector = await setupWalletSelector({
   ],
 });
 
-// 2. Wrap your app with BtcWalletSelectorContextProvider
+// 2. Setup wallet selector modal,params see setupModal @near-wallet-selector/modal-ui
+setupWalletSelectorModal(selector, {
+  contractId:'xxx.near',
+});
+
+// 3. Wrap your app with BtcWalletSelectorContextProvider
 import { BtcWalletSelectorContextProvider } from 'btc-wallet';
 
 function App() {

package/dist/context/index.d.ts

@@ -6,6 +6,7 @@ interface GlobalState {
     setConnectorId: (connectorId?: string) => void;
     connector?: BaseConnector;
     connectors: BaseConnector[];
+    connectModalOpen: boolean;
     openConnectModal: () => void;
     closeConnectModal: () => void;
     accounts: string[];

package/dist/core/btcWalletSelectorContext.d.ts

@@ -1,4 +1,5 @@
 import React from 'react';
+import 'ref-modal-ui/styles.css';
 export declare function BtcWalletSelectorContextProvider({ children, }: {
     children: React.ReactNode;
     autoConnect?: boolean;

package/dist/core/setupModal.d.ts

@@ -0,0 +1,5 @@
+import { type WalletSelectorModal as _WalletSelectorModal, type ModalOptions as _ModalOptions } from 'ref-modal-ui';
+import type { WalletSelector } from '@near-wallet-selector/core';
+export type WalletSelectorModalOptions = _ModalOptions;
+export type WalletSelectorModal = _WalletSelectorModal;
+export declare function setupWalletSelectorModal(selector: WalletSelector, options: WalletSelectorModalOptions): _WalletSelectorModal;

package/dist/hooks/useConnectModal.d.ts

@@ -2,4 +2,5 @@ export declare const useConnectModal: () => {
     openConnectModal: () => void;
     disconnect: () => void;
     requestDirectAccount: (connector: import("..").BaseConnector) => any;
+    connectModalOpen: boolean;
 };

package/dist/index.d.ts

@@ -5,4 +5,5 @@ export * from './core/btcWalletSelectorContext';
 export * from './core/setupBTCWallet/index';
 export * from './core/btcUtils';
 export * from './config';
+export * from './core/setupModal';
 export declare const getVersion: () => string;

package/dist/index.js

@@ -122,6 +122,7 @@ __export(src_exports, {
   nearRpcUrls: () => nearRpcUrls,
   sendBitcoin: () => sendBitcoin,
   setupBTCWallet: () => setupBTCWallet,
+  setupWalletSelectorModal: () => setupWalletSelectorModal,
   useAccountContract: () => useAccountContract,
   useAccounts: () => useAccounts,
   useBTCProvider: () => useBTCProvider,
@@ -313,6 +314,44 @@ var Dialog = class {
       });
     });
   }
+  static openModal({
+    title,
+    titleStyle,
+    content
+  }) {
+    return new Promise((resolve) => {
+      const modalContainer = document.createElement("div");
+      modalContainer.innerHTML = this.template;
+      document.body.appendChild(modalContainer);
+      const btns = modalContainer.querySelector(".dialog-buttons");
+      btns.style.display = "none";
+      this.injectStyles();
+      const titleEl = modalContainer.querySelector(".dialog-title");
+      if (title) {
+        titleEl.textContent = title;
+        if (titleStyle) {
+          titleEl.style.cssText = titleStyle;
+        }
+      } else {
+        titleEl.style.display = "none";
+      }
+      const cleanup = () => {
+        document.body.removeChild(modalContainer);
+      };
+      const close = () => {
+        cleanup();
+        resolve(null);
+      };
+      const messageEl = modalContainer.querySelector(".dialog-message");
+      messageEl.appendChild(content(resolve, close));
+      const overlay = modalContainer.querySelector(".dialog-overlay");
+      overlay.addEventListener("click", (e) => {
+        if (e.target === overlay) {
+          close();
+        }
+      });
+    });
+  }
 };
 Dialog.template = `
     <div class="dialog-overlay">
@@ -343,7 +382,7 @@ Dialog.style = `
       backdrop-filter: blur(4px);
     }
     .dialog-container {
-      background: #21232f;
+      background: #131313;
       border-radius: 12px;
       padding: 24px;
       width: 350px;
@@ -430,6 +469,30 @@ Dialog.style = `
         opacity: 1;
       }
     }
+    .option-list {
+      display: flex;
+      flex-direction: column;
+      gap: 12px;
+    }
+    .option-item {
+      display: flex;
+      align-items: center;
+      gap: 12px;
+      color: #fff;
+      border: 1px solid transparent;
+      background-color: hsla(0, 0%, 100%, .05);
+      border-radius: 8px;
+      padding: 8px 16px;
+      transition: all 0.15s ease;
+      cursor: pointer;
+      font-size: 14px;
+      font-weight: bold;
+      &:hover {
+        border-color: #ff7a00;
+        color: #ff7a00;
+        background-color: hsla(0, 0%, 100%, .08);
+      }
+    }
   `;
 
 // src/connector/universalLink.ts
@@ -1148,8 +1211,8 @@ var useBTCProvider = () => {
 
 // src/hooks/useConnectModal.ts
 var useConnectModal = () => {
-  const { openConnectModal, disconnect, requestDirectAccount } = useConnectProvider();
-  return { openConnectModal, disconnect, requestDirectAccount };
+  const { openConnectModal, disconnect, requestDirectAccount, connectModalOpen } = useConnectProvider();
+  return { openConnectModal, disconnect, requestDirectAccount, connectModalOpen };
 };
 
 // src/hooks/useConnector.ts
@@ -1523,9 +1586,9 @@ var import_react_dom = require("react-dom");
 var import_react_remove_scroll = require("react-remove-scroll");
 
 // esbuild-scss-modules-plugin:./modal.module.scss
-var digest3 = "65eada90924218eba4e72a5f00291c3cb69387ecce1351e454cdefd066d4bcff";
-var classes3 = { "container": "_container_smzpm_1", "modal": "_modal_smzpm_18" };
-var css3 = `._container_smzpm_1{align-items:center;backdrop-filter:blur(12px);background:rgba(0,0,0,.502);bottom:0;color:#fff;display:flex;height:100%;justify-content:center;left:0;overflow:hidden;position:fixed;right:0;top:0;width:100%;z-index:100000}._container_smzpm_1 ._modal_smzpm_18{align-items:center;background-color:#171a1f;border-radius:16px;display:flex;flex-direction:column;font-size:14px;height:auto;margin:16px;max-height:80%;max-width:100%;overflow:auto;padding:24px;position:relative;width:380px}`;
+var digest3 = "9c9a003376c4060e772fdba1e4b20a9af75a33b996c44ae9cea877de3ceb1b80";
+var classes3 = { "container": "_container_1s3ca_1", "modal": "_modal_1s3ca_18" };
+var css3 = `._container_1s3ca_1{align-items:center;backdrop-filter:blur(12px);background:rgba(0,0,0,.502);bottom:0;color:#fff;display:flex;height:100%;justify-content:center;left:0;overflow:hidden;position:fixed;right:0;top:0;width:100%;z-index:100000}._container_1s3ca_1 ._modal_1s3ca_18{align-items:center;background-color:#131313;border-radius:16px;display:flex;flex-direction:column;font-size:14px;height:auto;margin:16px;max-height:80%;max-width:100%;overflow:auto;padding:24px;position:relative;width:380px}`;
 (function() {
   if (typeof document !== "undefined" && !document.getElementById(digest3)) {
     var ele = document.createElement("style");
@@ -1568,9 +1631,9 @@ var Modal = ({ open, onClose, children, isDismissable = true, contentStyle, cont
 var modal_default = Modal;
 
 // esbuild-scss-modules-plugin:./connect.module.scss
-var digest4 = "c7bbc091f1227154742a5bd0d55a3df29eb913eb0ad4cafc7ab236b574002f65";
-var classes4 = { "connectModal": "_connectModal_1kqtj_1", "title": "_title_1kqtj_4", "closeBtn": "_closeBtn_1kqtj_9", "backBtn": "_backBtn_1kqtj_15", "walletItem": "_walletItem_1kqtj_21", "walletIcon": "_walletIcon_1kqtj_33", "walletName": "_walletName_1kqtj_38", "connecting": "_connecting_1kqtj_43", "connectingIconContainer": "_connectingIconContainer_1kqtj_51", "retryContainer": "_retryContainer_1kqtj_54", "retryIcon": "_retryIcon_1kqtj_63", "connectingIcon": "_connectingIcon_1kqtj_51", "connection": "_connection_1kqtj_72", "acceptRequest": "_acceptRequest_1kqtj_76", "btnDownload": "_btnDownload_1kqtj_83" };
-var css4 = `._connectModal_1kqtj_1{gap:12px}._connectModal_1kqtj_1 ._title_1kqtj_4{font-size:18px;font-weight:700;margin-bottom:4px}._connectModal_1kqtj_1 ._closeBtn_1kqtj_9{cursor:pointer;position:absolute;right:16px;top:16px}._connectModal_1kqtj_1 ._backBtn_1kqtj_15{cursor:pointer;left:16px;position:absolute;top:16px}._connectModal_1kqtj_1 ._walletItem_1kqtj_21{border:1px solid #3a3a3a;border-radius:8px;box-sizing:border-box;cursor:pointer;display:flex;padding:8px;width:100%}._connectModal_1kqtj_1 ._walletItem_1kqtj_21:hover{background:hsla(0,0%,100%,.05)}._connectModal_1kqtj_1 ._walletItem_1kqtj_21 ._walletIcon_1kqtj_33{border-radius:4px;height:42px;width:42px}._connectModal_1kqtj_1 ._walletItem_1kqtj_21 ._walletName_1kqtj_38{flex-grow:1;line-height:42px;text-align:center}._connectModal_1kqtj_1 ._connecting_1kqtj_43{align-items:center;display:flex;flex-direction:column;height:204px;justify-content:center;width:100%}._connectModal_1kqtj_1 ._connecting_1kqtj_43 ._connectingIconContainer_1kqtj_51{position:relative}._connectModal_1kqtj_1 ._connecting_1kqtj_43 ._connectingIconContainer_1kqtj_51 ._retryContainer_1kqtj_54{background:#4b5563;border-radius:50%;bottom:-12px;cursor:pointer;padding:4px;position:absolute;right:-12px}._connectModal_1kqtj_1 ._connecting_1kqtj_43 ._connectingIconContainer_1kqtj_51 ._retryContainer_1kqtj_54 ._retryIcon_1kqtj_63{height:24px;width:24px}._connectModal_1kqtj_1 ._connecting_1kqtj_43 ._connectingIcon_1kqtj_51{border-radius:4px;height:60px;width:60px}._connectModal_1kqtj_1 ._connecting_1kqtj_43 ._connection_1kqtj_72{font-size:18px;margin-top:20px}._connectModal_1kqtj_1 ._connecting_1kqtj_43 ._acceptRequest_1kqtj_76{color:hsla(0,0%,100%,.4);font-size:14px;margin-top:6px;text-align:center;white-space:pre-wrap}._connectModal_1kqtj_1 ._connecting_1kqtj_43 ._btnDownload_1kqtj_83{margin-top:20px}`;
+var digest4 = "9f37532ca7be1b0e97d8b75261330d17b9316635d48e9ec58b471baefd1f674c";
+var classes4 = { "connectModal": "_connectModal_1tdkv_1", "title": "_title_1tdkv_4", "closeBtn": "_closeBtn_1tdkv_9", "backBtn": "_backBtn_1tdkv_15", "walletItem": "_walletItem_1tdkv_21", "walletIcon": "_walletIcon_1tdkv_41", "walletName": "_walletName_1tdkv_46", "connecting": "_connecting_1tdkv_50", "connectingIconContainer": "_connectingIconContainer_1tdkv_58", "retryContainer": "_retryContainer_1tdkv_61", "retryIcon": "_retryIcon_1tdkv_70", "connectingIcon": "_connectingIcon_1tdkv_58", "connection": "_connection_1tdkv_79", "acceptRequest": "_acceptRequest_1tdkv_83", "btnDownload": "_btnDownload_1tdkv_90" };
+var css4 = `._connectModal_1tdkv_1{gap:12px}._connectModal_1tdkv_1 ._title_1tdkv_4{font-size:18px;font-weight:700;margin-bottom:16px}._connectModal_1tdkv_1 ._closeBtn_1tdkv_9{cursor:pointer;position:absolute;right:16px;top:16px}._connectModal_1tdkv_1 ._backBtn_1tdkv_15{cursor:pointer;left:16px;position:absolute;top:16px}._connectModal_1tdkv_1 ._walletItem_1tdkv_21{background-color:hsla(0,0%,100%,.05);border:1px solid transparent;border-radius:8px;box-sizing:border-box;color:#fff;cursor:pointer;display:flex;font-size:14px;font-weight:700;gap:12px;padding:8px 16px;transition:all .15s ease;width:100%}._connectModal_1tdkv_1 ._walletItem_1tdkv_21:hover{background:hsla(0,0%,100%,.08);border-color:#ff7a00;color:#ff7a00}._connectModal_1tdkv_1 ._walletItem_1tdkv_21 ._walletIcon_1tdkv_41{border-radius:8px;height:32px;width:32px}._connectModal_1tdkv_1 ._walletItem_1tdkv_21 ._walletName_1tdkv_46{flex-grow:1;line-height:32px}._connectModal_1tdkv_1 ._connecting_1tdkv_50{align-items:center;display:flex;flex-direction:column;height:204px;justify-content:center;width:100%}._connectModal_1tdkv_1 ._connecting_1tdkv_50 ._connectingIconContainer_1tdkv_58{position:relative}._connectModal_1tdkv_1 ._connecting_1tdkv_50 ._connectingIconContainer_1tdkv_58 ._retryContainer_1tdkv_61{background:#4b5563;border-radius:50%;bottom:-12px;cursor:pointer;padding:4px;position:absolute;right:-12px}._connectModal_1tdkv_1 ._connecting_1tdkv_50 ._connectingIconContainer_1tdkv_58 ._retryContainer_1tdkv_61 ._retryIcon_1tdkv_70{height:24px;width:24px}._connectModal_1tdkv_1 ._connecting_1tdkv_50 ._connectingIcon_1tdkv_58{border-radius:4px;height:60px;width:60px}._connectModal_1tdkv_1 ._connecting_1tdkv_50 ._connection_1tdkv_79{font-size:18px;margin-top:20px}._connectModal_1tdkv_1 ._connecting_1tdkv_50 ._acceptRequest_1tdkv_83{color:hsla(0,0%,100%,.4);font-size:14px;margin-top:6px;text-align:center;white-space:pre-wrap}._connectModal_1tdkv_1 ._connecting_1tdkv_50 ._btnDownload_1tdkv_90{margin-top:20px}`;
 (function() {
   if (typeof document !== "undefined" && !document.getElementById(digest4)) {
     var ele = document.createElement("style");
@@ -2611,6 +2674,7 @@ var ConnectProvider = ({
         setConnectorId,
         connector,
         connectors,
+        connectModalOpen,
         openConnectModal,
         closeConnectModal,
         accounts,
@@ -2696,6 +2760,7 @@ function ComfirmBox({ onClose, status = 1, fromChain = {
 }
 
 // src/core/btcWalletSelectorContext.tsx
+var import_styles = require("ref-modal-ui/styles.css");
 var import_jsx_runtime12 = require("react/jsx-runtime");
 var WalletSelectorContext = import_react11.default.createContext(null);
 function BtcWalletSelectorContextProvider({
@@ -2773,7 +2838,7 @@ function InitBtcWalletSelectorContext() {
   return null;
 }
 function useBtcWalletSelector() {
-  const { openConnectModal, disconnect, requestDirectAccount } = useConnectModal();
+  const { openConnectModal, disconnect, requestDirectAccount, connectModalOpen } = useConnectModal();
   const {
     accounts,
     sendBitcoin: sendBitcoin2,
@@ -2788,7 +2853,6 @@ function useBtcWalletSelector() {
   const signMessageFn = (0, import_react11.useRef)(null);
   const connectorRef = (0, import_react11.useRef)(null);
   const context = (0, import_react11.useContext)(WalletSelectorContext);
-  const isLoggingIn = (0, import_react11.useRef)(false);
   (0, import_react11.useEffect)(() => {
     if (provider) {
       getPublicKey().then((res) => {
@@ -2822,12 +2886,13 @@ function useBtcWalletSelector() {
     return {
       login: () => __async(this, null, function* () {
         const account = accounts == null ? void 0 : accounts[0];
+        console.log("account", account);
+        console.log("connecting", connectModalOpen);
         if (!account) {
-          if (isLoggingIn.current) {
+          if (connectModalOpen) {
             return null;
           }
           try {
-            isLoggingIn.current = true;
             openConnectModal == null ? void 0 : openConnectModal();
             const account1 = yield retryOperation(
               () => window.btcContext.account,
@@ -2841,8 +2906,9 @@ function useBtcWalletSelector() {
               throw new Error("Failed to get account");
             }
             return account1;
-          } finally {
-            isLoggingIn.current = false;
+          } catch (error) {
+            console.error("btcLoginError", error);
+            context.emit("btcLoginError");
           }
         }
         return account;
@@ -3343,7 +3409,8 @@ function getAccountInfo(_0) {
       },
       { network: config.network }
     ).catch((error) => {
-      return void 0;
+      console.log(`get_account error, please try again later`, error);
+      throw error;
     });
     return accountInfo;
   });
@@ -3703,7 +3770,7 @@ function calculateWithdraw(_0) {
           return {
             withdrawFee: 0,
             isError: true,
-            errorMsg: "Mini withdraw amount is " + (Number(brgConfig.min_withdraw_amount) + Number(gasLimit))
+            errorMsg: `Mini withdraw amount is ${Number(brgConfig.min_withdraw_amount) + Number(gasLimit)} sats`
           };
         }
       }
@@ -4324,7 +4391,6 @@ function createFloatingButtonWithIframe({
     zIndex: "100000",
     width: "60px",
     height: "60px",
-    borderRadius: "50%",
     cursor: "grab",
     transition: "transform 0.15s ease",
     userSelect: "none"
@@ -4830,9 +4896,74 @@ function setupBTCWallet({
   return btcWallet;
 }
 
+// src/core/setupModal.ts
+var import_ref_modal_ui = require("ref-modal-ui");
+function setupWalletSelectorModal(selector, options) {
+  if (!selector)
+    throw new Error("selector is required");
+  const state = selector.store.getState();
+  const group = getGroup(state);
+  const modal = (0, import_ref_modal_ui.setupModal)(selector, options);
+  const originalShow = modal.show.bind(modal);
+  modal.show = () => __async(this, null, function* () {
+    const chain = group.length > 1 ? yield openChainModal() : group[0];
+    if (chain === "btc") {
+      const module2 = state.modules.find((module3) => module3.id === "btc-wallet");
+      if (module2) {
+        const wallet = yield module2.wallet();
+        yield wallet.signIn(options);
+      }
+    } else if (chain === "near") {
+      originalShow();
+    }
+  });
+  return modal;
+}
+function openChainModal() {
+  return __async(this, null, function* () {
+    const chains5 = ["btc", "near"];
+    const content = (resolve, close) => {
+      const buttons = `
+      <div class="option-list">${chains5.map(
+        (chain) => `<button class="chain-button option-item" data-chain="${chain}">
+        <img src="https://assets.deltatrade.ai/assets/chain/${chain}.svg" alt="${chain}" style="width:32px; height: 32px;" />
+        ${chain.toUpperCase()}
+        </button>`
+      ).join("")}
+      </div>
+    `;
+      const div = document.createElement("div");
+      div.innerHTML = buttons;
+      const buttonsEl = div.querySelectorAll(".chain-button");
+      buttonsEl.forEach((button) => {
+        button.addEventListener("click", () => {
+          resolve(button.dataset.chain);
+          close();
+        });
+      });
+      return div;
+    };
+    return yield Dialog.openModal({
+      title: "Choose Chain",
+      titleStyle: "font-size: 18px; font-weight: 600; color: #fff; text-align: center;padding-bottom: 10px;",
+      content
+    });
+  });
+}
+function getGroup(state) {
+  const hasBtcWallet = state.modules.some((module2) => module2.id === "btc-wallet");
+  const hasNearWallet = state.modules.some((module2) => module2.id !== "btc-wallet");
+  const group = [];
+  if (hasBtcWallet)
+    group.push("btc");
+  if (hasNearWallet)
+    group.push("near");
+  return group;
+}
+
 // src/index.ts
 var getVersion = () => {
-  return "0.5.23-beta";
+  return "0.5.25-beta";
 };
 if (typeof window !== "undefined") {
   window.__BTC_WALLET_VERSION = getVersion();