Merge pull request #145 from bnb-chain/wenty/wallet

fix: Fix colorMode does not follow the parameter

.release/.changeset/few-cherries-smile.md

@@ -0,0 +1,5 @@
+---
+"@bnb-chain/canonical-bridge-widget": patch
+---
+
+Support custom breakpoints

.release/.changeset/gorgeous-maps-fly.md

@@ -0,0 +1,5 @@
+---
+"@bnb-chain/canonical-bridge-widget": patch
+---
+
+Fix wallet issues

.release/.changeset/grumpy-squids-collect.md

@@ -0,0 +1,5 @@
+---
+"@bnb-chain/canonical-bridge-widget": patch
+---
+
+Fix wallet issues

.release/.changeset/honest-lies-cheer.md

@@ -0,0 +1,5 @@
+---
+"@bnb-chain/canonical-bridge-widget": patch
+---
+
+Remove delayTime for wallet

.release/.changeset/itchy-flies-fail.md

@@ -0,0 +1,5 @@
+---
+"@bnb-chain/canonical-bridge-widget": patch
+---
+
+Fix colorMode does not follow the parameter

.release/.changeset/late-swans-sparkle.md

@@ -0,0 +1,5 @@
+---
+"@bnb-chain/canonical-bridge-widget": patch
+---
+
+Fix wallet issues

.release/.changeset/lovely-maps-study.md

@@ -0,0 +1,5 @@
+---
+"@bnb-chain/canonical-bridge-widget": patch
+---
+
+Support custom connect wallet button

.release/.changeset/pre.json

@@ -0,0 +1,20 @@
+{
+  "mode": "pre",
+  "tag": "alpha",
+  "initialVersions": {
+    "@bnb-chain/canonical-bridge-sdk": "0.4.1",
+    "@bnb-chain/canonical-bridge-widget": "0.5.1"
+  },
+  "changesets": [
+    "few-cherries-smile",
+    "gorgeous-maps-fly",
+    "grumpy-squids-collect",
+    "honest-lies-cheer",
+    "itchy-flies-fail",
+    "late-swans-sparkle",
+    "lovely-maps-study",
+    "quick-pots-tease",
+    "tall-spiders-love",
+    "twelve-moose-sit"
+  ]
+}

.release/.changeset/quick-pots-tease.md

@@ -0,0 +1,5 @@
+---
+"@bnb-chain/canonical-bridge-widget": patch
+---
+
+Show all tokens in token list with different token address

.release/.changeset/tall-spiders-love.md

@@ -0,0 +1,5 @@
+---
+"@bnb-chain/canonical-bridge-widget": patch
+---
+
+Separate wallet component

.release/.changeset/twelve-moose-sit.md

@@ -0,0 +1,5 @@
+---
+"@bnb-chain/canonical-bridge-widget": patch
+---
+
+Add log for solana

.vscode/settings.json

@@ -3,17 +3,17 @@
     "*.json": "jsonc"
   },
   "files.exclude": {
-    // "**/.git": true,
+    "**/.git": true,
     "**/.svn": true,
     "**/.hg": true,
     "**/CVS": true,
     "**/.DS_Store": true,
-    // "**/node_modules": true,
-    // "**/.next": true,
+    "**/node_modules": true,
+    "**/.next": true,
     "**/*.log": true,
-    // "**/dist": true,
-    // "**/.rush": true,
-    // "**/temp": true,
+    "**/dist": true,
+    "**/.rush": true,
+    "**/temp": true,
     "**/tsconfig.tsbuildinfo": true
   },
   "[typescript]": {
@@ -49,13 +49,16 @@
     "bnbchain",
     "cbridge",
     "debridge",
+    "LAMPORTS",
     "multichain",
     "onflow",
     "protobuf",
     "reduxjs",
     "Solana",
     "stargate",
     "tanstack",
+    "tronwallet",
+    "tronweb",
     "unauthenticate",
     "viem",
     "Wagmi",

apps/canonical-bridge-ui/core/components/Layout/Header.tsx

@@ -1,8 +1,8 @@
 import { Flex, FlexProps, theme, useColorMode } from '@bnb-chain/space';
 import React from 'react';
-import { ConnectButton } from '@bnb-chain/canonical-bridge-widget';
 
 import { LogoIcon } from '@/core/components/icons/Logo';
+import { ConnectWalletButton } from '@/core/wallet/components/ConnectWalletButton';
 
 export function Header(props: FlexProps) {
   const { colorMode } = useColorMode();
@@ -20,7 +20,7 @@ export function Header(props: FlexProps) {
       {...props}
     >
       <LogoIcon />
-      <ConnectButton />
+      <ConnectWalletButton />
     </Flex>
   );
 }

apps/canonical-bridge-ui/core/components/icons/NetworkIcon.tsx

@@ -0,0 +1,14 @@
+import { Icon, IconProps } from '@bnb-chain/space';
+
+export function NetworkIcon(props: IconProps) {
+  return (
+    <Icon width="16px" height="16px" viewBox="0 0 16 16" fill="currentColor" {...props}>
+      <g mask={`url(#mask0_2473_30846_)`}>
+        <path
+          d="M2.46668 6.66641C2.46668 7.29463 2.57479 7.91685 2.79101 8.53307C3.00723 9.1493 3.33245 9.71941 3.76668 10.2434C3.84957 10.34 3.89318 10.4506 3.89751 10.5754C3.90173 10.7002 3.85895 10.8075 3.76918 10.8972C3.67951 10.9869 3.57118 11.0251 3.44418 11.0119C3.31729 10.9987 3.2124 10.9438 3.12951 10.8472C2.60984 10.2309 2.22329 9.56913 1.96984 8.86191C1.71651 8.15469 1.58984 7.42285 1.58984 6.66641C1.58984 5.90996 1.71651 5.17813 1.96984 4.47091C2.22329 3.76369 2.60984 3.10191 3.12951 2.48557C3.2124 2.38902 3.31729 2.33413 3.44418 2.32091C3.57118 2.30769 3.67951 2.34591 3.76918 2.43557C3.85895 2.52535 3.90173 2.63263 3.89751 2.75741C3.89318 2.88219 3.84957 2.99285 3.76668 3.08941C3.33245 3.61341 3.00723 4.18352 2.79101 4.79974C2.57479 5.41596 2.46668 6.03819 2.46668 6.66641ZM4.66668 6.66641C4.66668 7.0143 4.72201 7.36235 4.83268 7.71057C4.94334 8.05891 5.12051 8.38391 5.36418 8.68557C5.43596 8.78224 5.4729 8.89019 5.47501 9.00941C5.47712 9.12863 5.43334 9.23307 5.34368 9.32274C5.2539 9.41252 5.1494 9.45463 5.03018 9.44907C4.91095 9.44352 4.81201 9.39246 4.73334 9.29591C4.42223 8.90869 4.18718 8.4888 4.02818 8.03624C3.86929 7.58369 3.78984 7.12707 3.78984 6.66641C3.78984 6.20574 3.86929 5.74913 4.02818 5.29657C4.18718 4.84402 4.42223 4.42413 4.73334 4.03691C4.81201 3.94035 4.91095 3.8893 5.03018 3.88374C5.1494 3.87819 5.2539 3.9203 5.34368 4.01007C5.43334 4.09974 5.4754 4.2053 5.46984 4.32674C5.46429 4.44807 5.42351 4.55702 5.34751 4.65357C5.11929 4.94413 4.94873 5.26185 4.83584 5.60674C4.72307 5.95163 4.66668 6.30485 4.66668 6.66641ZM6.48201 12.7817L6.15634 13.7842C6.12045 13.8809 6.06084 13.9602 5.97751 14.0221C5.89418 14.0841 5.80084 14.1151 5.69751 14.1151C5.52651 14.1151 5.3949 14.0504 5.30268 13.9209C5.21034 13.7914 5.18895 13.6445 5.23851 13.4804L7.12184 7.82657C6.93551 7.69246 6.78957 7.52307 6.68401 7.31841C6.57845 7.11363 6.52568 6.8963 6.52568 6.66641C6.52568 6.2553 6.66862 5.9068 6.95451 5.62091C7.2404 5.33502 7.5889 5.19207 8.00001 5.19207C8.41112 5.19207 8.75962 5.33502 9.04551 5.62091C9.3314 5.9068 9.47434 6.2553 9.47434 6.66641C9.47434 6.8963 9.42373 7.11146 9.32251 7.31191C9.22118 7.51235 9.07307 7.68391 8.87818 7.82657L10.7615 13.4804C10.8111 13.6334 10.7914 13.7775 10.7025 13.9126C10.6136 14.0476 10.4837 14.1151 10.3128 14.1151C10.2094 14.1151 10.1154 14.0858 10.0308 14.0272C9.94618 13.9687 9.8859 13.8877 9.85001 13.7842L9.52818 12.7817H6.48201ZM6.81284 11.7817H9.18718L8.00001 8.21757L6.81284 11.7817ZM11.3333 6.66641C11.3333 6.33141 11.277 5.98652 11.1642 5.63174C11.0513 5.27707 10.8752 4.94891 10.6358 4.64724C10.5641 4.55057 10.5271 4.44263 10.525 4.32341C10.5229 4.20419 10.5667 4.09974 10.6563 4.01007C10.7461 3.9203 10.8523 3.87819 10.975 3.88374C11.0977 3.8893 11.1949 3.94035 11.2667 4.03691C11.5709 4.42413 11.8008 4.84507 11.9563 5.29974C12.1119 5.75441 12.1965 6.21207 12.2102 6.67274C12.2102 7.13352 12.1318 7.58907 11.975 8.03941C11.8181 8.48985 11.582 8.90869 11.2667 9.29591C11.188 9.39246 11.0891 9.44352 10.9698 9.44907C10.8506 9.45463 10.7461 9.41252 10.6563 9.32274C10.5667 9.23307 10.5246 9.12752 10.5302 9.00607C10.5357 8.88474 10.5765 8.7758 10.6525 8.67924C10.8807 8.38869 11.0513 8.07096 11.1642 7.72607C11.277 7.38119 11.3333 7.02796 11.3333 6.66641ZM13.5333 6.66641C13.5333 6.03819 13.4252 5.41596 13.209 4.79974C12.9928 4.18352 12.6676 3.61341 12.2333 3.08941C12.1505 2.99285 12.1068 2.88219 12.1025 2.75741C12.0983 2.63263 12.1411 2.52535 12.2308 2.43557C12.3205 2.34591 12.4288 2.30769 12.5558 2.32091C12.6827 2.33413 12.7876 2.38902 12.8705 2.48557C13.3902 3.10191 13.7767 3.76369 14.0302 4.47091C14.2835 5.17813 14.4102 5.90996 14.4102 6.66641C14.4102 7.42285 14.2897 8.15469 14.0487 8.86191C13.8077 9.56913 13.4183 10.2309 12.8807 10.8472C12.791 10.9438 12.6844 11.0004 12.5608 11.0171C12.4374 11.0337 12.3274 10.9938 12.2308 10.8972C12.1411 10.8075 12.0983 10.7002 12.1025 10.5754C12.1068 10.4506 12.1505 10.34 12.2333 10.2434C12.6676 9.71941 12.9928 9.1493 13.209 8.53307C13.4252 7.91685 13.5333 7.29463 13.5333 6.66641Z"
+          fill="#E55F00"
+        />
+      </g>
+    </Icon>
+  );
+}

apps/canonical-bridge-ui/core/components/icons/SvgDefs.tsx

@@ -0,0 +1,69 @@
+import { Icon } from '@bnb-chain/space';
+
+export function SvgDefs() {
+  return (
+    <Icon
+      position={'absolute'}
+      w={0}
+      h={0}
+      viewBox="0 0 440 280"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <clipPath id="clip0_9685_21608">
+        <rect width="18" height="15" fill="white" transform="translate(3 4)" />
+      </clipPath>
+
+      <mask id="mask0_18_3" maskUnits="userSpaceOnUse" x="0" y="0" width="65" height="65">
+        <path
+          d="M7.30721 0C3.27132 0 0 3.59886 0 8.03839V56.9616C0 61.4011 3.27132 65 7.30721 65H57.6928C61.7283 65 65 61.4011 65 56.9616V8.03839C65 3.59886 61.7283 0 57.6928 0H7.30721Z"
+          fill="white"
+        />
+      </mask>
+
+      <linearGradient
+        id="paint0_linear_18_3"
+        x1="537.383"
+        y1="266.088"
+        x2="6244.77"
+        y2="6544.28"
+        gradientUnits="userSpaceOnUse"
+      >
+        <stop stopColor="#145ECC" />
+        <stop offset="1" stopColor="#1260CC" />
+      </linearGradient>
+
+      <clipPath id="clip0_18_3">
+        <rect width="65" height="65" fill="white" />
+      </clipPath>
+
+      <linearGradient
+        id="paint0_linear_7476_132116"
+        x1="4.77107"
+        y1="21.3854"
+        x2="7.65309"
+        y2="0.538518"
+        gradientUnits="userSpaceOnUse"
+      >
+        <stop offset="0.26" stopColor="#48FF91" />
+        <stop offset="0.66" stopColor="#0094FF" />
+        <stop offset="0.8" stopColor="#0038FF" />
+        <stop offset="0.89" stopColor="#0500FF" />
+      </linearGradient>
+
+      <linearGradient
+        id="paint1_linear_7476_132116"
+        x1="11.7182"
+        y1="21.3853"
+        x2="17.1746"
+        y2="1.64876"
+        gradientUnits="userSpaceOnUse"
+      >
+        <stop offset="0.26" stopColor="#48FF91" />
+        <stop offset="0.66" stopColor="#0094FF" />
+        <stop offset="0.8" stopColor="#0038FF" />
+        <stop offset="0.89" stopColor="#0500FF" />
+      </linearGradient>
+    </Icon>
+  );
+}

apps/canonical-bridge-ui/core/components/icons/wallets/BinanceWeb3WalletIcon.tsx

@@ -0,0 +1,17 @@
+import { IconProps, Icon } from '@bnb-chain/space';
+
+export function BinanceWeb3WalletIcon(props: IconProps) {
+  return (
+    <Icon width="24px" height="24px" viewBox="0 0 24 24" fill="none" {...props}>
+      <rect width="24" height="24" fill="#0B0E11" />
+      <path
+        d="M8.98987 10.7632L12 7.75312L15.0116 10.7648L16.7631 9.01321L12 4.25L7.23836 9.01166L8.98987 10.7632ZM6.00157 10.2483L7.75305 11.9998L6.00148 13.7514L4.25 11.9999L6.00157 10.2483ZM8.98987 13.2368L12 16.2468L15.0115 13.2353L16.764 14.9859L16.7631 14.9868L12 19.75L7.2383 14.9883L7.23585 14.9859L8.98987 13.2368ZM19.75 12.0002L17.9985 13.7517L16.247 12.0002L17.9985 10.2487L19.75 12.0002Z"
+        fill="#F0B90B"
+      />
+      <path
+        d="M13.7764 11.9991H13.7772L11.9999 10.2217L10.2217 12L10.2241 12.0024L11.9999 13.7782L13.7781 12L13.7764 11.9991Z"
+        fill="#F0B90B"
+      />
+    </Icon>
+  );
+}

apps/canonical-bridge-ui/core/components/icons/wallets/CoinbaseWalletIcon.tsx

@@ -0,0 +1,15 @@
+import { IconProps, Icon } from '@bnb-chain/space';
+
+export function CoinbaseWalletIcon(props: IconProps) {
+  return (
+    <Icon width="24px" height="24px" viewBox="0 0 24 24" fill="none" {...props}>
+      <rect width="24" height="24" fill="#0051FE" />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M12 19C15.866 19 19 15.866 19 12C19 8.13401 15.866 5 12 5C8.13401 5 5 8.13401 5 12C5 15.866 8.13401 19 12 19ZM10.2889 9.66667C9.94525 9.66667 9.66667 9.94525 9.66667 10.2889V13.7111C9.66667 14.0548 9.94525 14.3333 10.2889 14.3333H13.7111C14.0548 14.3333 14.3333 14.0548 14.3333 13.7111V10.2889C14.3333 9.94525 14.0548 9.66667 13.7111 9.66667H10.2889Z"
+        fill="white"
+      />
+    </Icon>
+  );
+}

apps/canonical-bridge-ui/core/components/icons/wallets/MathWalletIcon.tsx

@@ -0,0 +1,13 @@
+import { IconProps, Icon } from '@bnb-chain/space';
+
+export function MathWalletIcon(props: IconProps) {
+  return (
+    <Icon width="24px" height="24px" viewBox="0 0 24 24" fill="none" {...props}>
+      <rect width="24" height="24" fill="black" />
+      <path
+        d="M16.2096 11.2434C15.8526 10.8788 15.8526 10.2879 16.2096 9.92336C16.5666 9.55886 17.1455 9.55886 17.5025 9.92336C17.8596 10.2879 17.8596 10.8788 17.5025 11.2434C17.1455 11.6079 16.5666 11.6079 16.2096 11.2434ZM13.1389 14.3783C12.8711 14.1049 12.8711 13.6617 13.1389 13.3883C13.4066 13.115 13.8408 13.115 14.1086 13.3883C14.3763 13.6617 14.3763 14.1049 14.1086 14.3783C13.8408 14.6517 13.4066 14.6517 13.1389 14.3783ZM17.9874 12.7283C17.7196 12.455 17.7196 12.0117 17.9874 11.7383C18.2551 11.465 18.6893 11.465 18.9571 11.7383C19.2248 12.0117 19.2248 12.455 18.9571 12.7283C18.6893 13.0017 18.2551 13.0017 17.9874 12.7283ZM16.3712 14.3783C16.1034 14.1049 16.1034 13.6617 16.3712 13.3883C16.639 13.115 17.0731 13.115 17.3409 13.3883C17.6087 13.6617 17.6087 14.1049 17.3409 14.3783C17.0731 14.6517 16.639 14.6517 16.3712 14.3783ZM19.7652 14.2133C19.5866 14.0311 19.5866 13.7356 19.7652 13.5533C19.9437 13.3711 20.2331 13.3711 20.4116 13.5533C20.5901 13.7356 20.5901 14.0311 20.4116 14.2133C20.2331 14.3956 19.9437 14.3956 19.7652 14.2133ZM18.149 15.8633C17.9705 15.6811 17.9705 15.3856 18.149 15.2033C18.3275 15.0211 18.6169 15.0211 18.7955 15.2033C18.974 15.3856 18.974 15.6811 18.7955 15.8633C18.6169 16.0456 18.3275 16.0456 18.149 15.8633ZM14.5934 12.8933C14.2364 12.5288 14.2364 11.9379 14.5934 11.5733C14.9505 11.2088 15.5293 11.2088 15.8864 11.5733C16.2434 11.9379 16.2434 12.5288 15.8864 12.8933C15.5293 13.2578 14.9505 13.2578 14.5934 12.8933ZM14.5934 9.59337C14.2364 9.22886 14.2364 8.63788 14.5934 8.27338C14.9505 7.90887 15.5293 7.90887 15.8864 8.27338C16.2434 8.63788 16.2434 9.22886 15.8864 9.59337C15.5293 9.95787 14.9505 9.95787 14.5934 9.59337ZM12.9773 11.2434C12.6202 10.8788 12.6202 10.2879 12.9773 9.92336C13.3343 9.55886 13.9132 9.55886 14.2702 9.92336C14.6272 10.2879 14.6272 10.8788 14.2702 11.2434C13.9132 11.6079 13.3343 11.6079 12.9773 11.2434ZM9.7299 11.2434C9.37287 10.8788 9.37287 10.2879 9.7299 9.92336C10.0869 9.55886 10.6658 9.55886 11.0228 9.92336C11.3799 10.2879 11.3799 10.8788 11.0228 11.2434C10.6658 11.6079 10.0869 11.6079 9.7299 11.2434ZM6.65919 14.3783C6.39142 14.1049 6.39142 13.6617 6.65919 13.3883C6.92697 13.115 7.36111 13.115 7.62889 13.3883C7.89667 13.6617 7.89667 14.1049 7.62889 14.3783C7.36111 14.6517 6.92697 14.6517 6.65919 14.3783ZM11.5077 12.7283C11.2399 12.455 11.2399 12.0117 11.5077 11.7383C11.7755 11.465 12.2096 11.465 12.4774 11.7383C12.7452 12.0117 12.7452 12.455 12.4774 12.7283C12.2096 13.0017 11.7755 13.0017 11.5077 12.7283ZM9.89152 14.3783C9.62375 14.1049 9.62375 13.6617 9.89152 13.3883C10.1593 13.115 10.5934 13.115 10.8612 13.3883C11.129 13.6617 11.129 14.1049 10.8612 14.3783C10.5934 14.6517 10.1593 14.6517 9.89152 14.3783ZM3.58848 14.2133C3.40996 14.0311 3.40996 13.7356 3.58848 13.5533C3.76699 13.3711 4.05643 13.3711 4.23494 13.5533C4.41346 13.7356 4.41346 14.0311 4.23494 14.2133C4.05643 14.3956 3.76699 14.3956 3.58848 14.2133ZM5.20464 15.8633C5.02613 15.6811 5.02613 15.3856 5.20464 15.2033C5.38316 15.0211 5.67259 15.0211 5.85111 15.2033C6.02963 15.3856 6.02963 15.6811 5.85111 15.8633C5.67259 16.0456 5.38316 16.0456 5.20464 15.8633ZM11.6693 15.8633C11.4908 15.6811 11.4908 15.3856 11.6693 15.2033C11.8478 15.0211 12.1373 15.0211 12.3158 15.2033C12.4943 15.3856 12.4943 15.6811 12.3158 15.8633C12.1373 16.0456 11.8478 16.0456 11.6693 15.8633ZM5.04303 12.7283C4.77525 12.455 4.77525 12.0117 5.04303 11.7383C5.3108 11.465 5.74495 11.465 6.01273 11.7383C6.2805 12.0117 6.2805 12.455 6.01273 12.7283C5.74495 13.0017 5.3108 13.0017 5.04303 12.7283ZM8.11374 12.8933C7.75671 12.5288 7.75671 11.9379 8.11374 11.5733C8.47077 11.2088 9.04964 11.2088 9.40667 11.5733C9.76371 11.9379 9.76371 12.5288 9.40667 12.8933C9.04964 13.2578 8.47077 13.2578 8.11374 12.8933ZM8.11374 9.59337C7.75671 9.22886 7.75671 8.63788 8.11374 8.27338C8.47077 7.90887 9.04964 7.90887 9.40667 8.27338C9.76371 8.63788 9.76371 9.22886 9.40667 9.59337C9.04964 9.95787 8.47077 9.95787 8.11374 9.59337ZM6.49757 11.2434C6.14054 10.8788 6.14054 10.2879 6.49757 9.92336C6.85461 9.55886 7.43347 9.55886 7.79051 9.92336C8.14754 10.2879 8.14754 10.8788 7.79051 11.2434C7.43347 11.6079 6.85461 11.6079 6.49757 11.2434Z"
+        fill="white"
+      />
+    </Icon>
+  );
+}