@matchain/matchid-sdk-react 0.1.51-alpha.1 → 0.1.51

package/dist/hooks/index.mjs

@@ -12,7 +12,7 @@ import {
   useTransaction,
   useUserInfo,
   useWallet
-} from "../chunk-KKWAYHRG.mjs";
+} from "../chunk-VIJ4FUT3.mjs";
 import "../chunk-UA6XHZHX.mjs";
 import "../chunk-HLUFAIFV.mjs";
 import {

package/dist/index.css

@@ -1174,11 +1174,17 @@ body {
     display: flex;
     flex-direction: column;
     gap: 48px;
+    @media screen and (max-width: 768px) {
+        gap:36px;
+    }
 
     .matchid-change-network-list {
         display: flex;
         flex-direction: column;
         gap: 24px;
+        @media screen and (max-width: 768px) {
+            gap: 16px;
+        }
 
         .matchid-change-network-item {
             cursor: pointer;
@@ -1190,6 +1196,10 @@ body {
             border: 1px solid var(--matchid-line);
             border-radius: 16px;
             transition: border-color 0.2s;
+            @media screen and (max-width: 768px) {
+                padding: 10px 16px;
+                border-radius: 12px;
+            }
 
             &:hover, &.matchid-change-network-selected {
                 border-color: var(--matchid-highlight-orange);
@@ -1199,15 +1209,17 @@ body {
                 display: flex;
                 align-items: center;
                 gap: 16px;
+                @media screen and (max-width: 768px) {
+                    gap:8px;
+                }
 
                 .matchid-change-network-item-icon {
-                    width: 32px;
-                    height: 32px;
-                    border-radius: 4px;
+                    width: 28px;
+                    height: 28px;
+                    border-radius: 8px;
                     @media (min-width: 768px) {
                         width: 40px;
                         height: 40px;
-
                     }
                 }
 
@@ -1256,13 +1268,18 @@ body {
     align-items: center;
     flex: 1;
     gap: 48px;
+    @media screen and (max-width: 768px) {
+        gap: 36px;
+    }
 
     .matchid-receive-container {
         display: flex;
         flex-direction: column;
         align-items: center;
         gap: 48px;
-
+        @media screen and (max-width: 768px) {
+            gap: 24px;
+        }
         .matchid-receive-text {
             font-size: 14px;
             font-weight: 500;
@@ -1276,10 +1293,16 @@ body {
             border: 2px solid var(--matchid-line);
             border-radius: 12px;
             padding: 16px;
-
+            @media screen and (max-width: 768px) {
+                padding: 10px;
+            }
             .matchid-qr-code {
                 width: 148px;
                 height: 148px;
+                @media screen and (max-width: 768px) {
+                    width: 88px;
+                    height: 88px;
+                }
             }
         }
 
@@ -1287,12 +1310,8 @@ body {
             text-align: center;
             word-break: break-all;
             color: var(--matchid-link);
-            font-size: 12px;
+            font-size: 14px;
             font-weight: 500;
-
-            @media (min-width: 768px) {
-                font-size: 14px;
-            }
         }
     }
 }
@@ -1301,11 +1320,17 @@ body {
     display: flex;
     flex-direction: column;
     gap: 48px;
+    @media screen and (max-width: 768px) {
+        gap: 36px;
+    }
 
     .matchid-import-token-form {
         display: flex;
         flex-direction: column;
-        gap: 24px
+        gap: 24px;
+        @media screen and (max-width: 768px) {
+            gap: 16px;
+        }
     }
 }
 
@@ -1455,9 +1480,11 @@ body {
     justify-content: space-between;
     flex-direction: column;
     padding-bottom: 200px;
-    gap: 40px;
+    gap: 48px;
+
     @media (max-width: 768px) {
         padding-bottom: 0px;
+        gap:36px;
     }
 
     .matchid-token-main {
@@ -1510,6 +1537,9 @@ body {
             padding: 16px;
             background: var(--matchid-gray-100);
             border-radius: 12px;
+            @media (max-width: 768px) {
+               gap:8px;
+            }
 
             .matchid-token-contract-title {
                 color: var(--matchid-black);
@@ -1542,6 +1572,7 @@ body {
     gap: 40px;
     @media (max-width: 768px) {
         padding-bottom: 0px;
+        gap:68px;
     }
 
     .matchid-token-send-content {
@@ -1655,6 +1686,9 @@ body {
         font-weight: 600;
         border-bottom: 1px solid var(--matchid-line);
         caret-color: var(--matchid-black);
+        @media (max-width: 768px) {
+            font-size: 20px;
+        }
 
         &::placeholder {
             color: var(--matchid-disabled);
@@ -1673,6 +1707,9 @@ body {
     &.matchid-token-input-sm {
         .matchid-token-input {
             font-size: 16px;
+            @media (max-width: 768px) {
+                font-size: 14px;
+            }
         }
     }
 
@@ -1692,8 +1729,10 @@ body {
     overflow-y: scroll;
     max-height: 70vh;
 
+
     @media (max-width: 768px) {
         padding-bottom: 0px;
+        gap:36px;
     }
 
     .matchid-token-send-list {
@@ -1702,6 +1741,10 @@ body {
         gap: 24px;
         flex: 1;
         overflow-y: scroll;
+        max-height: calc(70vh - 48px - 50px);
+        @media (max-width: 768px) {
+            max-height: calc(70vh - 48px - 38px);
+        }
 
         .matchid-token-send-item {
             cursor: pointer;
@@ -1713,6 +1756,10 @@ body {
             border: 1px solid var(--matchid-line);
             border-radius: 16px;
             transition: border-color 0.2s;
+            @media (max-width: 768px) {
+                padding: 10px 16px;
+                border-radius: 12px;
+            }
 
             &:hover, &.matchid-token-send-checked {
                 border-color: var(--matchid-highlight-orange);
@@ -1723,10 +1770,13 @@ body {
                 align-items: center;
                 flex: 1;
                 gap: 16px;
+                @media (max-width: 768px) {
+                    gap: 8px;
+                }
 
                 .matchid-token-send-logo {
-                    width: 32px;
-                    height: 32px;
+                    width: 28px;
+                    height: 28px;
                     position: relative;
 
                     .matchid-token-send-icon {
@@ -1903,6 +1953,7 @@ body {
     justify-content: space-between;
     @media screen and (max-width: 768px) {
         padding-bottom: 0;
+        gap:115px;
     }
 
     .matchid-import-token-result-box {
@@ -1910,6 +1961,9 @@ body {
         flex-direction: column;
         gap: 48px;
         align-items: center;
+        @media screen and (max-width: 768px) {
+            gap: 24px;
+        }
 
         .matchid-import-token-result-img {
             width: 96px;
@@ -1921,7 +1975,7 @@ body {
             font-weight: 500;
             color: var(--matchid-success);
             @media screen and (max-width: 768px) {
-                font-size: 20px;
+                font-size: 18px;
             }
         }
 

package/dist/index.js

@@ -2051,11 +2051,11 @@ function useUserInfo() {
   };
   const getLoginEmailCode = async (email) => {
     const res = await getEmailCodeApi(email);
-    if (res && res.data && isSuccess(res)) {
+    if (isSuccess(res)) {
       window.sessionStorage.setItem("loginkey", res.data.key);
       return res.data.key;
     }
-    return "";
+    throw new Error(res.message);
   };
   const loginByEmail = async ({
     email,
@@ -3282,6 +3282,7 @@ function useMatchChain() {
   }) {
     const { chainId: storeChainId2, setChainId: setChainId2 } = useLocalStore_default();
     const [selectedChainId, setSelectedChainId] = (0, import_react13.useState)(storeChainId2);
+    const isDownMd = useDownMd();
     return /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("div", { className: `matchid-change-network-box`, children: [
       /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: `matchid-change-network-list`, children: chainListQuery.data?.map((item, index) => {
         return /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(
@@ -3294,7 +3295,7 @@ function useMatchChain() {
                 /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("img", { src: item.iconUrl, className: `matchid-change-network-item-icon` }),
                 /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("span", { className: "matchid-change-network-item-name", children: item.name })
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(Radio, { checked: selectedChainId === item.id })
+              /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(Radio, { checked: selectedChainId === item.id, size: isDownMd ? 18 : 24 })
             ]
           },
           index
@@ -3439,8 +3440,8 @@ function StepVerify(props) {
     try {
       setError("");
       setSending(true);
-      sendTimeRef.current = intervalTime;
       await getLoginEmailCode(props.email);
+      sendTimeRef.current = intervalTime;
       setSendBtnText(`${sendTimeRef.current}s`);
       intervalRef.current = setInterval(() => {
         sendTimeRef.current--;
@@ -5604,6 +5605,7 @@ var import_react31 = require("react");
 var import_react_intl16 = require("react-intl");
 var import_jsx_runtime87 = require("react/jsx-runtime");
 function TokenSendList({ close }) {
+  const isDownMd = useDownMd();
   const walletAssets = useMatchWalletAssets();
   const matchWalletAssetList = useMatchWalletAssetList({
     list: walletAssets.mergedAssets
@@ -5630,14 +5632,14 @@ function TokenSendList({ close }) {
             setChecked(n);
           },
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(Radio, { checked: checked?.address == n.address }),
+            /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(Radio, { checked: checked?.address == n.address, size: isDownMd ? 18 : 24 }),
             /* @__PURE__ */ (0, import_jsx_runtime87.jsxs)("div", { className: "matchid-token-send-content", children: [
               /* @__PURE__ */ (0, import_jsx_runtime87.jsxs)("div", { className: "matchid-token-send-logo", children: [
                 n.icon ? /* @__PURE__ */ (0, import_jsx_runtime87.jsx)("img", { src: n.icon, alt: n.symbol, className: `matchid-token-send-icon` }) : /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(
                   AlphaAvatar2,
                   {
                     className: `matchid-token-send-icon`,
-                    size: 40,
+                    size: isDownMd ? 28 : 40,
                     name: n.symbol || n.name || ""
                   }
                 ),