@b3dotfun/sdk 0.0.65-test.5 → 0.0.66
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/anyspend/react/components/AnySpend.js +69 -97
- package/dist/cjs/anyspend/react/components/AnySpendCustom.js +23 -10
- package/dist/cjs/anyspend/react/components/AnySpendCustomExactIn.d.ts +3 -1
- package/dist/cjs/anyspend/react/components/AnySpendCustomExactIn.js +45 -14
- package/dist/cjs/anyspend/react/components/AnySpendDepositUpside.d.ts +11 -0
- package/dist/cjs/anyspend/react/components/AnySpendDepositUpside.js +41 -0
- package/dist/cjs/anyspend/react/components/AnyspendDepositHype.d.ts +1 -1
- package/dist/cjs/anyspend/react/components/AnyspendDepositHype.js +14 -251
- package/dist/cjs/anyspend/react/components/common/CryptoPaymentMethod.d.ts +6 -0
- package/dist/cjs/anyspend/react/components/common/CryptoPaymentMethod.js +3 -5
- package/dist/cjs/anyspend/react/components/common/FeeDetailPanel.js +1 -1
- package/dist/cjs/anyspend/react/components/common/FiatPaymentMethod.js +2 -2
- package/dist/cjs/anyspend/react/components/common/OrderHistory.d.ts +1 -1
- package/dist/cjs/anyspend/react/components/common/OrderHistory.js +3 -7
- package/dist/cjs/anyspend/react/components/common/OrderTokenAmount.js +2 -10
- package/dist/cjs/anyspend/react/components/common/PanelOnrampPayment.js +1 -1
- package/dist/cjs/anyspend/react/components/common/PointsDetailPanel.js +1 -1
- package/dist/cjs/anyspend/react/components/common/RecipientSelection.js +1 -1
- package/dist/cjs/anyspend/react/components/index.d.ts +1 -0
- package/dist/cjs/anyspend/react/components/index.js +4 -1
- package/dist/cjs/anyspend/react/hooks/useAnyspendFlow.d.ts +5 -1
- package/dist/cjs/anyspend/react/hooks/useAnyspendFlow.js +16 -10
- package/dist/cjs/anyspend/react/hooks/useAutoSelectCryptoPaymentMethod.d.ts +7 -5
- package/dist/cjs/anyspend/react/hooks/useAutoSelectCryptoPaymentMethod.js +13 -9
- package/dist/cjs/anyspend/react/hooks/useCryptoPaymentMethodState.d.ts +42 -0
- package/dist/cjs/anyspend/react/hooks/useCryptoPaymentMethodState.js +51 -0
- package/dist/cjs/anyspend/react/hooks/useSigMint.d.ts +1 -1
- package/dist/cjs/global-account/react/components/AccountAssets/AccountAssets.js +2 -38
- package/dist/cjs/global-account/react/components/AvatarEditor/AvatarEditor.d.ts +0 -1
- package/dist/cjs/global-account/react/components/AvatarEditor/AvatarEditor.js +35 -251
- package/dist/cjs/global-account/react/components/B3DynamicModal.js +15 -23
- package/dist/cjs/global-account/react/components/LinkAccount/LinkAccount.d.ts +4 -6
- package/dist/cjs/global-account/react/components/LinkAccount/LinkAccount.js +279 -113
- package/dist/cjs/global-account/react/components/ManageAccount/BalanceContent.js +5 -6
- package/dist/cjs/global-account/react/components/ManageAccount/ManageAccount.js +193 -24
- package/dist/cjs/global-account/react/components/ProfileEditor/ProfileEditor.d.ts +6 -0
- package/dist/cjs/global-account/react/components/ProfileEditor/ProfileEditor.js +141 -0
- package/dist/cjs/global-account/react/components/SignInWithB3/SignIn.js +1 -3
- package/dist/cjs/global-account/react/components/index.d.ts +4 -5
- package/dist/cjs/global-account/react/components/index.js +9 -14
- package/dist/cjs/global-account/react/components/ui/Tabs.js +2 -2
- package/dist/cjs/global-account/react/components/ui/dialog.js +2 -2
- package/dist/cjs/global-account/react/components/ui/drawer.js +1 -1
- package/dist/cjs/global-account/react/hooks/index.d.ts +1 -1
- package/dist/cjs/global-account/react/hooks/index.js +1 -3
- package/dist/cjs/global-account/react/hooks/useAccountWallet.d.ts +0 -1
- package/dist/cjs/global-account/react/hooks/useAccountWallet.js +0 -18
- package/dist/cjs/global-account/react/hooks/useAuthentication.d.ts +2 -2
- package/dist/cjs/global-account/react/hooks/useB3BalanceFromAddresses.js +0 -1
- package/dist/cjs/global-account/react/hooks/useUnifiedChainSwitchAndExecute.js +6 -14
- package/dist/cjs/global-account/react/hooks/useUserQuery.d.ts +2 -2
- package/dist/cjs/global-account/react/stores/index.d.ts +0 -1
- package/dist/cjs/global-account/react/stores/index.js +1 -3
- package/dist/cjs/global-account/react/stores/useModalStore.d.ts +26 -31
- package/dist/cjs/global-account/react/utils/profileDisplay.d.ts +0 -2
- package/dist/cjs/global-account/react/utils/profileDisplay.js +2 -2
- package/dist/cjs/shared/constants/chains/supported.d.ts +3 -3
- package/dist/cjs/shared/utils/ipfs.js +3 -10
- package/dist/esm/anyspend/react/components/AnySpend.js +70 -98
- package/dist/esm/anyspend/react/components/AnySpendCustom.js +23 -10
- package/dist/esm/anyspend/react/components/AnySpendCustomExactIn.d.ts +3 -1
- package/dist/esm/anyspend/react/components/AnySpendCustomExactIn.js +45 -14
- package/dist/esm/anyspend/react/components/AnySpendDepositUpside.d.ts +11 -0
- package/dist/esm/anyspend/react/components/AnySpendDepositUpside.js +38 -0
- package/dist/esm/anyspend/react/components/AnyspendDepositHype.d.ts +1 -1
- package/dist/esm/anyspend/react/components/AnyspendDepositHype.js +15 -249
- package/dist/esm/anyspend/react/components/common/CryptoPaymentMethod.d.ts +6 -0
- package/dist/esm/anyspend/react/components/common/CryptoPaymentMethod.js +3 -5
- package/dist/esm/anyspend/react/components/common/FeeDetailPanel.js +1 -1
- package/dist/esm/anyspend/react/components/common/FiatPaymentMethod.js +2 -2
- package/dist/esm/anyspend/react/components/common/OrderHistory.d.ts +1 -1
- package/dist/esm/anyspend/react/components/common/OrderHistory.js +5 -6
- package/dist/esm/anyspend/react/components/common/OrderTokenAmount.js +2 -10
- package/dist/esm/anyspend/react/components/common/PanelOnrampPayment.js +1 -1
- package/dist/esm/anyspend/react/components/common/PointsDetailPanel.js +1 -1
- package/dist/esm/anyspend/react/components/common/RecipientSelection.js +1 -1
- package/dist/esm/anyspend/react/components/index.d.ts +1 -0
- package/dist/esm/anyspend/react/components/index.js +1 -0
- package/dist/esm/anyspend/react/hooks/useAnyspendFlow.d.ts +5 -1
- package/dist/esm/anyspend/react/hooks/useAnyspendFlow.js +16 -10
- package/dist/esm/anyspend/react/hooks/useAutoSelectCryptoPaymentMethod.d.ts +7 -5
- package/dist/esm/anyspend/react/hooks/useAutoSelectCryptoPaymentMethod.js +13 -9
- package/dist/esm/anyspend/react/hooks/useCryptoPaymentMethodState.d.ts +42 -0
- package/dist/esm/anyspend/react/hooks/useCryptoPaymentMethodState.js +48 -0
- package/dist/esm/anyspend/react/hooks/useSigMint.d.ts +1 -1
- package/dist/esm/global-account/react/components/AccountAssets/AccountAssets.js +2 -38
- package/dist/esm/global-account/react/components/AvatarEditor/AvatarEditor.d.ts +0 -1
- package/dist/esm/global-account/react/components/AvatarEditor/AvatarEditor.js +38 -254
- package/dist/esm/global-account/react/components/B3DynamicModal.js +15 -23
- package/dist/esm/global-account/react/components/LinkAccount/LinkAccount.d.ts +4 -6
- package/dist/esm/global-account/react/components/LinkAccount/LinkAccount.js +280 -113
- package/dist/esm/global-account/react/components/ManageAccount/BalanceContent.js +5 -6
- package/dist/esm/global-account/react/components/ManageAccount/ManageAccount.js +195 -26
- package/dist/esm/global-account/react/components/ProfileEditor/ProfileEditor.d.ts +6 -0
- package/dist/esm/global-account/react/components/ProfileEditor/ProfileEditor.js +135 -0
- package/dist/esm/global-account/react/components/SignInWithB3/SignIn.js +2 -4
- package/dist/esm/global-account/react/components/index.d.ts +4 -5
- package/dist/esm/global-account/react/components/index.js +5 -9
- package/dist/esm/global-account/react/components/ui/Tabs.js +2 -2
- package/dist/esm/global-account/react/components/ui/dialog.js +2 -2
- package/dist/esm/global-account/react/components/ui/drawer.js +1 -1
- package/dist/esm/global-account/react/hooks/index.d.ts +1 -1
- package/dist/esm/global-account/react/hooks/index.js +1 -1
- package/dist/esm/global-account/react/hooks/useAccountWallet.d.ts +0 -1
- package/dist/esm/global-account/react/hooks/useAccountWallet.js +0 -17
- package/dist/esm/global-account/react/hooks/useAuthentication.d.ts +2 -2
- package/dist/esm/global-account/react/hooks/useB3BalanceFromAddresses.js +0 -1
- package/dist/esm/global-account/react/hooks/useUnifiedChainSwitchAndExecute.js +6 -14
- package/dist/esm/global-account/react/hooks/useUserQuery.d.ts +2 -2
- package/dist/esm/global-account/react/stores/index.d.ts +0 -1
- package/dist/esm/global-account/react/stores/index.js +0 -1
- package/dist/esm/global-account/react/stores/useModalStore.d.ts +26 -31
- package/dist/esm/global-account/react/utils/profileDisplay.d.ts +0 -2
- package/dist/esm/global-account/react/utils/profileDisplay.js +2 -2
- package/dist/esm/shared/constants/chains/supported.d.ts +3 -3
- package/dist/esm/shared/utils/ipfs.js +3 -10
- package/dist/styles/index.css +1 -1
- package/dist/types/anyspend/react/components/AnySpendCustomExactIn.d.ts +3 -1
- package/dist/types/anyspend/react/components/AnySpendDepositUpside.d.ts +11 -0
- package/dist/types/anyspend/react/components/AnyspendDepositHype.d.ts +1 -1
- package/dist/types/anyspend/react/components/common/CryptoPaymentMethod.d.ts +6 -0
- package/dist/types/anyspend/react/components/common/OrderHistory.d.ts +1 -1
- package/dist/types/anyspend/react/components/index.d.ts +1 -0
- package/dist/types/anyspend/react/hooks/useAnyspendFlow.d.ts +5 -1
- package/dist/types/anyspend/react/hooks/useAutoSelectCryptoPaymentMethod.d.ts +7 -5
- package/dist/types/anyspend/react/hooks/useCryptoPaymentMethodState.d.ts +42 -0
- package/dist/types/anyspend/react/hooks/useSigMint.d.ts +1 -1
- package/dist/types/global-account/react/components/AvatarEditor/AvatarEditor.d.ts +0 -1
- package/dist/types/global-account/react/components/LinkAccount/LinkAccount.d.ts +4 -6
- package/dist/types/global-account/react/components/ProfileEditor/ProfileEditor.d.ts +6 -0
- package/dist/types/global-account/react/components/index.d.ts +4 -5
- package/dist/types/global-account/react/hooks/index.d.ts +1 -1
- package/dist/types/global-account/react/hooks/useAccountWallet.d.ts +0 -1
- package/dist/types/global-account/react/hooks/useAuthentication.d.ts +2 -2
- package/dist/types/global-account/react/hooks/useUserQuery.d.ts +2 -2
- package/dist/types/global-account/react/stores/index.d.ts +0 -1
- package/dist/types/global-account/react/stores/useModalStore.d.ts +26 -31
- package/dist/types/global-account/react/utils/profileDisplay.d.ts +0 -2
- package/dist/types/shared/constants/chains/supported.d.ts +3 -3
- package/package.json +1 -2
- package/src/anyspend/react/components/AnySpend.tsx +218 -256
- package/src/anyspend/react/components/AnySpendCustom.tsx +31 -16
- package/src/anyspend/react/components/AnySpendCustomExactIn.tsx +56 -13
- package/src/anyspend/react/components/AnySpendDepositUpside.tsx +81 -0
- package/src/anyspend/react/components/AnyspendDepositHype.tsx +36 -524
- package/src/anyspend/react/components/common/CryptoPaymentMethod.tsx +14 -7
- package/src/anyspend/react/components/common/FeeDetailPanel.tsx +1 -1
- package/src/anyspend/react/components/common/FiatPaymentMethod.tsx +2 -2
- package/src/anyspend/react/components/common/OrderHistory.tsx +13 -8
- package/src/anyspend/react/components/common/OrderTokenAmount.tsx +2 -13
- package/src/anyspend/react/components/common/PanelOnrampPayment.tsx +1 -1
- package/src/anyspend/react/components/common/PointsDetailPanel.tsx +1 -1
- package/src/anyspend/react/components/common/RecipientSelection.tsx +1 -1
- package/src/anyspend/react/components/index.ts +1 -0
- package/src/anyspend/react/hooks/useAnyspendFlow.ts +24 -12
- package/src/anyspend/react/hooks/useAutoSelectCryptoPaymentMethod.ts +20 -12
- package/src/anyspend/react/hooks/useCryptoPaymentMethodState.ts +71 -0
- package/src/global-account/react/components/AccountAssets/AccountAssets.tsx +25 -115
- package/src/global-account/react/components/AvatarEditor/AvatarEditor.tsx +128 -477
- package/src/global-account/react/components/B3DynamicModal.tsx +17 -28
- package/src/global-account/react/components/LinkAccount/LinkAccount.tsx +433 -332
- package/src/global-account/react/components/ManageAccount/BalanceContent.tsx +10 -6
- package/src/global-account/react/components/ManageAccount/ManageAccount.tsx +589 -73
- package/src/global-account/react/components/ProfileEditor/ProfileEditor.tsx +265 -0
- package/src/global-account/react/components/SignInWithB3/SignIn.tsx +7 -11
- package/src/global-account/react/components/index.ts +5 -11
- package/src/global-account/react/components/ui/Tabs.tsx +13 -5
- package/src/global-account/react/components/ui/dialog.tsx +14 -32
- package/src/global-account/react/components/ui/drawer.tsx +1 -1
- package/src/global-account/react/hooks/index.ts +0 -3
- package/src/global-account/react/hooks/useAccountWallet.tsx +0 -26
- package/src/global-account/react/hooks/useB3BalanceFromAddresses.ts +0 -1
- package/src/global-account/react/hooks/useUnifiedChainSwitchAndExecute.ts +6 -12
- package/src/global-account/react/stores/index.ts +0 -1
- package/src/global-account/react/stores/useModalStore.ts +28 -35
- package/src/global-account/react/utils/profileDisplay.ts +2 -4
- package/src/shared/utils/ipfs.ts +3 -10
- package/src/styles/index.css +9 -6
- package/dist/cjs/global-account/react/components/Deposit/Deposit.d.ts +0 -1
- package/dist/cjs/global-account/react/components/Deposit/Deposit.js +0 -65
- package/dist/cjs/global-account/react/components/IPFSMediaRenderer/IPFSMediaRenderer.d.ts +0 -39
- package/dist/cjs/global-account/react/components/IPFSMediaRenderer/IPFSMediaRenderer.js +0 -37
- package/dist/cjs/global-account/react/components/LinkAccount/LinkNewAccount.d.ts +0 -4
- package/dist/cjs/global-account/react/components/LinkAccount/LinkNewAccount.js +0 -331
- package/dist/cjs/global-account/react/components/ManageAccount/AppsContent.d.ts +0 -6
- package/dist/cjs/global-account/react/components/ManageAccount/AppsContent.js +0 -34
- package/dist/cjs/global-account/react/components/ManageAccount/BottomNavigation.d.ts +0 -2
- package/dist/cjs/global-account/react/components/ManageAccount/BottomNavigation.js +0 -23
- package/dist/cjs/global-account/react/components/ManageAccount/Header.d.ts +0 -3
- package/dist/cjs/global-account/react/components/ManageAccount/Header.js +0 -120
- package/dist/cjs/global-account/react/components/ManageAccount/HomeActions.d.ts +0 -5
- package/dist/cjs/global-account/react/components/ManageAccount/HomeActions.js +0 -43
- package/dist/cjs/global-account/react/components/ManageAccount/HomeContent.d.ts +0 -6
- package/dist/cjs/global-account/react/components/ManageAccount/HomeContent.js +0 -16
- package/dist/cjs/global-account/react/components/ManageAccount/NFTContent.d.ts +0 -2
- package/dist/cjs/global-account/react/components/ManageAccount/NFTContent.js +0 -15
- package/dist/cjs/global-account/react/components/ManageAccount/ProfileSection.d.ts +0 -2
- package/dist/cjs/global-account/react/components/ManageAccount/ProfileSection.js +0 -47
- package/dist/cjs/global-account/react/components/ManageAccount/SettingsContent.d.ts +0 -7
- package/dist/cjs/global-account/react/components/ManageAccount/SettingsContent.js +0 -50
- package/dist/cjs/global-account/react/components/ManageAccount/SettingsMenuItem.d.ts +0 -9
- package/dist/cjs/global-account/react/components/ManageAccount/SettingsMenuItem.js +0 -8
- package/dist/cjs/global-account/react/components/ManageAccount/SettingsProfileCard.d.ts +0 -2
- package/dist/cjs/global-account/react/components/ManageAccount/SettingsProfileCard.js +0 -106
- package/dist/cjs/global-account/react/components/ManageAccount/TokenContent.d.ts +0 -2
- package/dist/cjs/global-account/react/components/ManageAccount/TokenContent.js +0 -22
- package/dist/cjs/global-account/react/components/ModalHeader/ModalHeader.d.ts +0 -11
- package/dist/cjs/global-account/react/components/ModalHeader/ModalHeader.js +0 -12
- package/dist/cjs/global-account/react/components/Send/Send.d.ts +0 -5
- package/dist/cjs/global-account/react/components/Send/Send.js +0 -187
- package/dist/cjs/global-account/react/components/icons/BellIcon.d.ts +0 -3
- package/dist/cjs/global-account/react/components/icons/BellIcon.js +0 -5
- package/dist/cjs/global-account/react/components/icons/ChevronDownIcon.d.ts +0 -2
- package/dist/cjs/global-account/react/components/icons/ChevronDownIcon.js +0 -7
- package/dist/cjs/global-account/react/components/icons/CopyIcon.d.ts +0 -2
- package/dist/cjs/global-account/react/components/icons/CopyIcon.js +0 -7
- package/dist/cjs/global-account/react/components/icons/LinkIcon.d.ts +0 -3
- package/dist/cjs/global-account/react/components/icons/LinkIcon.js +0 -5
- package/dist/cjs/global-account/react/components/icons/LockIcon.d.ts +0 -3
- package/dist/cjs/global-account/react/components/icons/LockIcon.js +0 -5
- package/dist/cjs/global-account/react/components/icons/WalletIcon.d.ts +0 -2
- package/dist/cjs/global-account/react/components/icons/WalletIcon.js +0 -7
- package/dist/cjs/global-account/react/stores/useRecentAddressesStore.d.ts +0 -25
- package/dist/cjs/global-account/react/stores/useRecentAddressesStore.js +0 -36
- package/dist/esm/global-account/react/components/Deposit/Deposit.d.ts +0 -1
- package/dist/esm/global-account/react/components/Deposit/Deposit.js +0 -59
- package/dist/esm/global-account/react/components/IPFSMediaRenderer/IPFSMediaRenderer.d.ts +0 -39
- package/dist/esm/global-account/react/components/IPFSMediaRenderer/IPFSMediaRenderer.js +0 -34
- package/dist/esm/global-account/react/components/LinkAccount/LinkNewAccount.d.ts +0 -4
- package/dist/esm/global-account/react/components/LinkAccount/LinkNewAccount.js +0 -325
- package/dist/esm/global-account/react/components/ManageAccount/AppsContent.d.ts +0 -6
- package/dist/esm/global-account/react/components/ManageAccount/AppsContent.js +0 -32
- package/dist/esm/global-account/react/components/ManageAccount/BottomNavigation.d.ts +0 -2
- package/dist/esm/global-account/react/components/ManageAccount/BottomNavigation.js +0 -21
- package/dist/esm/global-account/react/components/ManageAccount/Header.d.ts +0 -3
- package/dist/esm/global-account/react/components/ManageAccount/Header.js +0 -81
- package/dist/esm/global-account/react/components/ManageAccount/HomeActions.d.ts +0 -5
- package/dist/esm/global-account/react/components/ManageAccount/HomeActions.js +0 -41
- package/dist/esm/global-account/react/components/ManageAccount/HomeContent.d.ts +0 -6
- package/dist/esm/global-account/react/components/ManageAccount/HomeContent.js +0 -10
- package/dist/esm/global-account/react/components/ManageAccount/NFTContent.d.ts +0 -2
- package/dist/esm/global-account/react/components/ManageAccount/NFTContent.js +0 -13
- package/dist/esm/global-account/react/components/ManageAccount/ProfileSection.d.ts +0 -2
- package/dist/esm/global-account/react/components/ManageAccount/ProfileSection.js +0 -45
- package/dist/esm/global-account/react/components/ManageAccount/SettingsContent.d.ts +0 -7
- package/dist/esm/global-account/react/components/ManageAccount/SettingsContent.js +0 -45
- package/dist/esm/global-account/react/components/ManageAccount/SettingsMenuItem.d.ts +0 -9
- package/dist/esm/global-account/react/components/ManageAccount/SettingsMenuItem.js +0 -6
- package/dist/esm/global-account/react/components/ManageAccount/SettingsProfileCard.d.ts +0 -2
- package/dist/esm/global-account/react/components/ManageAccount/SettingsProfileCard.js +0 -101
- package/dist/esm/global-account/react/components/ManageAccount/TokenContent.d.ts +0 -2
- package/dist/esm/global-account/react/components/ManageAccount/TokenContent.js +0 -20
- package/dist/esm/global-account/react/components/ModalHeader/ModalHeader.d.ts +0 -11
- package/dist/esm/global-account/react/components/ModalHeader/ModalHeader.js +0 -10
- package/dist/esm/global-account/react/components/Send/Send.d.ts +0 -5
- package/dist/esm/global-account/react/components/Send/Send.js +0 -181
- package/dist/esm/global-account/react/components/icons/BellIcon.d.ts +0 -3
- package/dist/esm/global-account/react/components/icons/BellIcon.js +0 -3
- package/dist/esm/global-account/react/components/icons/ChevronDownIcon.d.ts +0 -2
- package/dist/esm/global-account/react/components/icons/ChevronDownIcon.js +0 -4
- package/dist/esm/global-account/react/components/icons/CopyIcon.d.ts +0 -2
- package/dist/esm/global-account/react/components/icons/CopyIcon.js +0 -4
- package/dist/esm/global-account/react/components/icons/LinkIcon.d.ts +0 -3
- package/dist/esm/global-account/react/components/icons/LinkIcon.js +0 -3
- package/dist/esm/global-account/react/components/icons/LockIcon.d.ts +0 -3
- package/dist/esm/global-account/react/components/icons/LockIcon.js +0 -3
- package/dist/esm/global-account/react/components/icons/WalletIcon.d.ts +0 -2
- package/dist/esm/global-account/react/components/icons/WalletIcon.js +0 -4
- package/dist/esm/global-account/react/stores/useRecentAddressesStore.d.ts +0 -25
- package/dist/esm/global-account/react/stores/useRecentAddressesStore.js +0 -33
- package/dist/types/global-account/react/components/Deposit/Deposit.d.ts +0 -1
- package/dist/types/global-account/react/components/IPFSMediaRenderer/IPFSMediaRenderer.d.ts +0 -39
- package/dist/types/global-account/react/components/LinkAccount/LinkNewAccount.d.ts +0 -4
- package/dist/types/global-account/react/components/ManageAccount/AppsContent.d.ts +0 -6
- package/dist/types/global-account/react/components/ManageAccount/BottomNavigation.d.ts +0 -2
- package/dist/types/global-account/react/components/ManageAccount/Header.d.ts +0 -3
- package/dist/types/global-account/react/components/ManageAccount/HomeActions.d.ts +0 -5
- package/dist/types/global-account/react/components/ManageAccount/HomeContent.d.ts +0 -6
- package/dist/types/global-account/react/components/ManageAccount/NFTContent.d.ts +0 -2
- package/dist/types/global-account/react/components/ManageAccount/ProfileSection.d.ts +0 -2
- package/dist/types/global-account/react/components/ManageAccount/SettingsContent.d.ts +0 -7
- package/dist/types/global-account/react/components/ManageAccount/SettingsMenuItem.d.ts +0 -9
- package/dist/types/global-account/react/components/ManageAccount/SettingsProfileCard.d.ts +0 -2
- package/dist/types/global-account/react/components/ManageAccount/TokenContent.d.ts +0 -2
- package/dist/types/global-account/react/components/ModalHeader/ModalHeader.d.ts +0 -11
- package/dist/types/global-account/react/components/Send/Send.d.ts +0 -5
- package/dist/types/global-account/react/components/icons/BellIcon.d.ts +0 -3
- package/dist/types/global-account/react/components/icons/ChevronDownIcon.d.ts +0 -2
- package/dist/types/global-account/react/components/icons/CopyIcon.d.ts +0 -2
- package/dist/types/global-account/react/components/icons/LinkIcon.d.ts +0 -3
- package/dist/types/global-account/react/components/icons/LockIcon.d.ts +0 -3
- package/dist/types/global-account/react/components/icons/WalletIcon.d.ts +0 -2
- package/dist/types/global-account/react/stores/useRecentAddressesStore.d.ts +0 -25
- package/src/global-account/react/components/Deposit/Deposit.tsx +0 -211
- package/src/global-account/react/components/IPFSMediaRenderer/IPFSMediaRenderer.tsx +0 -84
- package/src/global-account/react/components/LinkAccount/LinkNewAccount.tsx +0 -490
- package/src/global-account/react/components/ManageAccount/AppsContent.tsx +0 -79
- package/src/global-account/react/components/ManageAccount/BottomNavigation.tsx +0 -83
- package/src/global-account/react/components/ManageAccount/Header.tsx +0 -230
- package/src/global-account/react/components/ManageAccount/HomeActions.tsx +0 -118
- package/src/global-account/react/components/ManageAccount/HomeContent.tsx +0 -42
- package/src/global-account/react/components/ManageAccount/NFTContent.tsx +0 -24
- package/src/global-account/react/components/ManageAccount/ProfileSection.tsx +0 -79
- package/src/global-account/react/components/ManageAccount/SettingsContent.tsx +0 -87
- package/src/global-account/react/components/ManageAccount/SettingsMenuItem.tsx +0 -31
- package/src/global-account/react/components/ManageAccount/SettingsProfileCard.tsx +0 -182
- package/src/global-account/react/components/ManageAccount/TokenContent.tsx +0 -41
- package/src/global-account/react/components/ModalHeader/ModalHeader.tsx +0 -61
- package/src/global-account/react/components/Send/Send.tsx +0 -585
- package/src/global-account/react/components/icons/BellIcon.tsx +0 -15
- package/src/global-account/react/components/icons/ChevronDownIcon.tsx +0 -17
- package/src/global-account/react/components/icons/CopyIcon.tsx +0 -22
- package/src/global-account/react/components/icons/LinkIcon.tsx +0 -15
- package/src/global-account/react/components/icons/LockIcon.tsx +0 -15
- package/src/global-account/react/components/icons/WalletIcon.tsx +0 -21
- package/src/global-account/react/stores/useRecentAddressesStore.ts +0 -55
|
@@ -1,585 +0,0 @@
|
|
|
1
|
-
import { ALL_CHAINS, getExplorerTxUrl } from "@b3dotfun/sdk/anyspend";
|
|
2
|
-
import { ChainTokenIcon } from "@b3dotfun/sdk/anyspend/react/components/common/ChainTokenIcon";
|
|
3
|
-
import {
|
|
4
|
-
useAccountWallet,
|
|
5
|
-
useAnalytics,
|
|
6
|
-
useModalStore,
|
|
7
|
-
useSimBalance,
|
|
8
|
-
useUnifiedChainSwitchAndExecute,
|
|
9
|
-
} from "@b3dotfun/sdk/global-account/react";
|
|
10
|
-
import { formatDisplayNumber, formatTokenAmount } from "@b3dotfun/sdk/shared/utils/number";
|
|
11
|
-
import invariant from "invariant";
|
|
12
|
-
import { CircleHelp, Clock, Loader2, Send as SendIcon, Wallet } from "lucide-react";
|
|
13
|
-
import { useState } from "react";
|
|
14
|
-
import { NumericFormat } from "react-number-format";
|
|
15
|
-
import { toast } from "sonner";
|
|
16
|
-
import { encodeFunctionData, erc20Abi, isAddress, parseUnits } from "viem";
|
|
17
|
-
import type { SimBalanceItem } from "../../hooks/useSimBalance";
|
|
18
|
-
import { useRecentAddressesStore } from "../../stores/useRecentAddressesStore";
|
|
19
|
-
import ModalHeader from "../ModalHeader/ModalHeader";
|
|
20
|
-
import { Button } from "../ui/button";
|
|
21
|
-
|
|
22
|
-
export interface SendModalProps {
|
|
23
|
-
recipientAddress?: string;
|
|
24
|
-
onSuccess?: (txHash?: string) => void;
|
|
25
|
-
}
|
|
26
|
-
|
|
27
|
-
type SendStep = "recipient" | "token" | "amount" | "confirm" | "success";
|
|
28
|
-
|
|
29
|
-
export function Send({ recipientAddress: initialRecipient, onSuccess }: SendModalProps) {
|
|
30
|
-
const { address } = useAccountWallet();
|
|
31
|
-
const navigateBack = useModalStore(state => state.navigateBack);
|
|
32
|
-
const setB3ModalOpen = useModalStore(state => state.setB3ModalOpen);
|
|
33
|
-
|
|
34
|
-
// Wizard state
|
|
35
|
-
const [step, setStep] = useState<SendStep>("recipient");
|
|
36
|
-
const [selectedToken, setSelectedToken] = useState<SimBalanceItem | null>(null);
|
|
37
|
-
const [recipientAddress, setRecipientAddress] = useState(initialRecipient || "");
|
|
38
|
-
const [sendAmount, setSendAmount] = useState("");
|
|
39
|
-
const [isSending, setIsSending] = useState(false);
|
|
40
|
-
const [addressError, setAddressError] = useState("");
|
|
41
|
-
const [showValidatedResult, setShowValidatedResult] = useState(false);
|
|
42
|
-
|
|
43
|
-
// Hooks
|
|
44
|
-
const { data: simBalance, refetch: refetchSimBalance, isLoading: isLoadingBalance } = useSimBalance(address);
|
|
45
|
-
const { switchChainAndExecute } = useUnifiedChainSwitchAndExecute();
|
|
46
|
-
const { sendAnalyticsEvent } = useAnalytics();
|
|
47
|
-
|
|
48
|
-
// Recent addresses store
|
|
49
|
-
const recentAddresses = useRecentAddressesStore(state => state.recentAddresses);
|
|
50
|
-
const addRecentAddress = useRecentAddressesStore(state => state.addRecentAddress);
|
|
51
|
-
|
|
52
|
-
// Address validation
|
|
53
|
-
const handleRecipientAddressChange = (value: string) => {
|
|
54
|
-
setRecipientAddress(value);
|
|
55
|
-
setShowValidatedResult(false);
|
|
56
|
-
if (value && !isAddress(value)) {
|
|
57
|
-
setAddressError("Please enter a valid EVM address (0x...)");
|
|
58
|
-
} else {
|
|
59
|
-
setAddressError("");
|
|
60
|
-
if (value && isAddress(value)) {
|
|
61
|
-
setShowValidatedResult(true);
|
|
62
|
-
}
|
|
63
|
-
}
|
|
64
|
-
};
|
|
65
|
-
|
|
66
|
-
// Paste from clipboard
|
|
67
|
-
const handlePaste = async () => {
|
|
68
|
-
try {
|
|
69
|
-
const text = await navigator.clipboard.readText();
|
|
70
|
-
const trimmedText = text.trim();
|
|
71
|
-
setRecipientAddress(trimmedText);
|
|
72
|
-
|
|
73
|
-
if (trimmedText && isAddress(trimmedText)) {
|
|
74
|
-
setAddressError("");
|
|
75
|
-
setShowValidatedResult(true);
|
|
76
|
-
} else if (trimmedText) {
|
|
77
|
-
setAddressError("Please enter a valid EVM address (0x...)");
|
|
78
|
-
setShowValidatedResult(false);
|
|
79
|
-
}
|
|
80
|
-
} catch (error) {
|
|
81
|
-
toast.error("Failed to read clipboard");
|
|
82
|
-
}
|
|
83
|
-
};
|
|
84
|
-
|
|
85
|
-
// Handle clicking on the validated result to proceed
|
|
86
|
-
const handleSelectValidatedAddress = () => {
|
|
87
|
-
if (recipientAddress && isAddress(recipientAddress)) {
|
|
88
|
-
addRecentAddress(recipientAddress);
|
|
89
|
-
setStep("token");
|
|
90
|
-
}
|
|
91
|
-
};
|
|
92
|
-
|
|
93
|
-
// Go to previous step
|
|
94
|
-
const handleBack = () => {
|
|
95
|
-
if (step === "token") setStep("recipient");
|
|
96
|
-
else if (step === "amount") setStep("token");
|
|
97
|
-
else if (step === "confirm") setStep("amount");
|
|
98
|
-
else navigateBack();
|
|
99
|
-
};
|
|
100
|
-
|
|
101
|
-
// Get current selected token from fresh balance
|
|
102
|
-
const getCurrentSelectedToken = (): SimBalanceItem | null => {
|
|
103
|
-
if (!selectedToken || !simBalance?.balances) {
|
|
104
|
-
return null;
|
|
105
|
-
}
|
|
106
|
-
const found = simBalance.balances.find(
|
|
107
|
-
token => token.chain_id === selectedToken.chain_id && token.address === selectedToken.address,
|
|
108
|
-
);
|
|
109
|
-
return found || null;
|
|
110
|
-
};
|
|
111
|
-
|
|
112
|
-
// Percentage button handler
|
|
113
|
-
const handlePercentageClick = (percentage: number) => {
|
|
114
|
-
const currentToken = getCurrentSelectedToken();
|
|
115
|
-
if (currentToken) {
|
|
116
|
-
const tokenBalance = (BigInt(currentToken.amount) * BigInt(percentage)) / BigInt(100);
|
|
117
|
-
const amount = formatTokenAmount(tokenBalance, currentToken.decimals, 30, false);
|
|
118
|
-
setSendAmount(amount);
|
|
119
|
-
}
|
|
120
|
-
};
|
|
121
|
-
|
|
122
|
-
// Send transaction
|
|
123
|
-
const handleSend = async () => {
|
|
124
|
-
const sendAmountWithoutCommas = sendAmount.replace(/,/g, "");
|
|
125
|
-
const currentToken = getCurrentSelectedToken();
|
|
126
|
-
|
|
127
|
-
if (!currentToken || !recipientAddress || !sendAmount || parseFloat(sendAmountWithoutCommas) <= 0) {
|
|
128
|
-
return;
|
|
129
|
-
}
|
|
130
|
-
|
|
131
|
-
setIsSending(true);
|
|
132
|
-
|
|
133
|
-
const amountInWei = parseUnits(sendAmountWithoutCommas, currentToken.decimals);
|
|
134
|
-
|
|
135
|
-
const analyticsData = {
|
|
136
|
-
amount: sendAmount,
|
|
137
|
-
symbol: currentToken.symbol,
|
|
138
|
-
chain_id: currentToken.chain_id,
|
|
139
|
-
address: currentToken.address,
|
|
140
|
-
};
|
|
141
|
-
|
|
142
|
-
try {
|
|
143
|
-
invariant(isAddress(recipientAddress), "Recipient address is not a valid address");
|
|
144
|
-
|
|
145
|
-
const sendTokenData = encodeFunctionData({
|
|
146
|
-
abi: erc20Abi,
|
|
147
|
-
functionName: "transfer",
|
|
148
|
-
args: [recipientAddress, amountInWei],
|
|
149
|
-
});
|
|
150
|
-
|
|
151
|
-
const tx = await switchChainAndExecute(currentToken.chain_id, {
|
|
152
|
-
to: currentToken.address === "native" ? recipientAddress : currentToken.address,
|
|
153
|
-
data: sendTokenData,
|
|
154
|
-
value: currentToken.address === "native" ? amountInWei : BigInt(0),
|
|
155
|
-
});
|
|
156
|
-
|
|
157
|
-
if (tx) {
|
|
158
|
-
sendAnalyticsEvent("send_token_button_click", {
|
|
159
|
-
...analyticsData,
|
|
160
|
-
success: true,
|
|
161
|
-
tx: getExplorerTxUrl(currentToken.chain_id, tx),
|
|
162
|
-
});
|
|
163
|
-
|
|
164
|
-
setStep("success");
|
|
165
|
-
toast.success(`Successfully sent ${sendAmount} ${currentToken.symbol}`);
|
|
166
|
-
|
|
167
|
-
if (onSuccess) {
|
|
168
|
-
onSuccess(tx);
|
|
169
|
-
}
|
|
170
|
-
|
|
171
|
-
setTimeout(async () => {
|
|
172
|
-
await refetchSimBalance();
|
|
173
|
-
}, 1000);
|
|
174
|
-
}
|
|
175
|
-
} catch (error: any) {
|
|
176
|
-
sendAnalyticsEvent("send_token_button_click", {
|
|
177
|
-
...analyticsData,
|
|
178
|
-
success: false,
|
|
179
|
-
reason: error.message || "Unknown error",
|
|
180
|
-
});
|
|
181
|
-
|
|
182
|
-
toast.error(`Failed to send ${currentToken.symbol}: ${error.message || "Unknown error"}`);
|
|
183
|
-
} finally {
|
|
184
|
-
setIsSending(false);
|
|
185
|
-
}
|
|
186
|
-
};
|
|
187
|
-
|
|
188
|
-
// Get step title
|
|
189
|
-
const getStepTitle = () => {
|
|
190
|
-
switch (step) {
|
|
191
|
-
case "recipient":
|
|
192
|
-
return "Select Recipient";
|
|
193
|
-
case "token":
|
|
194
|
-
return "Select Token";
|
|
195
|
-
case "amount":
|
|
196
|
-
return "Enter Amount";
|
|
197
|
-
case "confirm":
|
|
198
|
-
return "Confirm";
|
|
199
|
-
case "success":
|
|
200
|
-
return "Sent!";
|
|
201
|
-
default:
|
|
202
|
-
return "Send";
|
|
203
|
-
}
|
|
204
|
-
};
|
|
205
|
-
|
|
206
|
-
return (
|
|
207
|
-
<div className="flex h-[600px] w-full flex-col bg-white">
|
|
208
|
-
<ModalHeader handleBack={handleBack} title={getStepTitle()} />
|
|
209
|
-
|
|
210
|
-
{/* Content - 20px padding */}
|
|
211
|
-
<div className="flex-1 overflow-y-auto">
|
|
212
|
-
{step === "recipient" && (
|
|
213
|
-
<div className="flex flex-col gap-6 p-5">
|
|
214
|
-
{/* Input field - 48px height */}
|
|
215
|
-
<div className="flex h-12 w-full items-stretch overflow-hidden rounded-lg border border-[#d1d1d6] bg-white">
|
|
216
|
-
{/* "To" addon - 48px width */}
|
|
217
|
-
<div className="flex w-12 items-center justify-center bg-transparent px-3 py-2">
|
|
218
|
-
<span className="font-neue-montreal-medium text-base text-[#3f3f46]">To</span>
|
|
219
|
-
</div>
|
|
220
|
-
{/* Input */}
|
|
221
|
-
<div className="flex flex-1 items-center border-l border-[#d1d1d6] px-3 py-2">
|
|
222
|
-
<input
|
|
223
|
-
type="text"
|
|
224
|
-
value={recipientAddress}
|
|
225
|
-
onChange={e => handleRecipientAddressChange(e.target.value)}
|
|
226
|
-
placeholder="ENS or Address"
|
|
227
|
-
className="font-neue-montreal-medium flex-1 text-base text-[#70707b] outline-none placeholder:text-[#70707b]"
|
|
228
|
-
/>
|
|
229
|
-
{/* Paste badge */}
|
|
230
|
-
<button
|
|
231
|
-
onClick={handlePaste}
|
|
232
|
-
className="font-inter ml-2 rounded-md border border-[#e4e4e7] bg-[#fafafa] px-2.5 py-0.5 text-sm font-medium text-[#3f3f46] transition-colors hover:bg-[#f4f4f5]"
|
|
233
|
-
>
|
|
234
|
-
Paste
|
|
235
|
-
</button>
|
|
236
|
-
</div>
|
|
237
|
-
</div>
|
|
238
|
-
|
|
239
|
-
{addressError && <p className="font-neue-montreal-medium -mt-4 text-xs text-red-500">{addressError}</p>}
|
|
240
|
-
|
|
241
|
-
{/* Validated Result Section */}
|
|
242
|
-
{showValidatedResult && recipientAddress && isAddress(recipientAddress) && (
|
|
243
|
-
<div className="flex flex-col gap-2">
|
|
244
|
-
{/* Result Header */}
|
|
245
|
-
<div className="flex items-center gap-1">
|
|
246
|
-
<span className="font-sf-pro-text text-sm font-semibold leading-[1.3] tracking-[-0.41px] text-[#0b57c2]">
|
|
247
|
-
Result
|
|
248
|
-
</span>
|
|
249
|
-
</div>
|
|
250
|
-
|
|
251
|
-
{/* Validated Address Card */}
|
|
252
|
-
<button
|
|
253
|
-
onClick={handleSelectValidatedAddress}
|
|
254
|
-
className="flex items-center gap-2 rounded-xl bg-[#f4f4f5] px-3 py-2 transition-colors hover:bg-[#e4e4e7]"
|
|
255
|
-
>
|
|
256
|
-
{/* Avatar */}
|
|
257
|
-
<div className="flex h-10 w-10 items-center justify-center rounded-full border border-[#e4e4e7] bg-[#f4f4f5]">
|
|
258
|
-
<Wallet className="h-5 w-5 text-[#a0a0ab]" />
|
|
259
|
-
</div>
|
|
260
|
-
{/* Address */}
|
|
261
|
-
<span className="font-neue-montreal-medium text-base tracking-[-0.32px] text-[#70707b]">
|
|
262
|
-
{recipientAddress.slice(0, 6)}...{recipientAddress.slice(-4)}
|
|
263
|
-
</span>
|
|
264
|
-
</button>
|
|
265
|
-
</div>
|
|
266
|
-
)}
|
|
267
|
-
|
|
268
|
-
{/* Recents Container */}
|
|
269
|
-
{recentAddresses.length > 0 && (
|
|
270
|
-
<div className="flex flex-col gap-2">
|
|
271
|
-
{/* Recents Header */}
|
|
272
|
-
<div className="flex items-center gap-1">
|
|
273
|
-
<Clock className="h-3.5 w-3.5 text-[#3f3f46]" />
|
|
274
|
-
<span className="font-sf-pro-text text-sm font-semibold leading-[1.3] tracking-[-0.41px] text-[#3f3f46]">
|
|
275
|
-
Recents
|
|
276
|
-
</span>
|
|
277
|
-
</div>
|
|
278
|
-
|
|
279
|
-
{/* Recent addresses list */}
|
|
280
|
-
<div className="flex flex-col">
|
|
281
|
-
{recentAddresses.map((recent, index) => (
|
|
282
|
-
<button
|
|
283
|
-
key={index}
|
|
284
|
-
onClick={() => {
|
|
285
|
-
// Just fill the input and show validation - don't auto-proceed
|
|
286
|
-
handleRecipientAddressChange(recent.address);
|
|
287
|
-
}}
|
|
288
|
-
className="flex items-center gap-2 rounded-xl px-3 py-2 transition-colors hover:bg-[#fafafa]"
|
|
289
|
-
>
|
|
290
|
-
{/* Avatar */}
|
|
291
|
-
<div className="flex h-10 w-10 items-center justify-center rounded-full border border-[#e4e4e7] bg-[#f4f4f5]">
|
|
292
|
-
<Wallet className="h-5 w-5 text-[#a0a0ab]" />
|
|
293
|
-
</div>
|
|
294
|
-
{/* Address */}
|
|
295
|
-
<span className="font-neue-montreal-medium text-base tracking-[-0.32px] text-[#70707b]">
|
|
296
|
-
{recent.address.slice(0, 6)}...{recent.address.slice(-4)}
|
|
297
|
-
</span>
|
|
298
|
-
</button>
|
|
299
|
-
))}
|
|
300
|
-
</div>
|
|
301
|
-
</div>
|
|
302
|
-
)}
|
|
303
|
-
</div>
|
|
304
|
-
)}
|
|
305
|
-
|
|
306
|
-
{step === "token" && (
|
|
307
|
-
<div className="flex flex-col p-5">
|
|
308
|
-
{isLoadingBalance ? (
|
|
309
|
-
<div className="space-y-4">
|
|
310
|
-
<div className="space-y-1">
|
|
311
|
-
{[...Array(3)].map((_, index) => (
|
|
312
|
-
<div key={index} className="flex items-center justify-between rounded-xl p-3">
|
|
313
|
-
<div className="flex items-center gap-3">
|
|
314
|
-
<div className="bg-b3-line h-10 w-10 animate-pulse rounded-full"></div>
|
|
315
|
-
<div>
|
|
316
|
-
<div className="bg-b3-line mb-1 h-4 w-16 animate-pulse rounded"></div>
|
|
317
|
-
<div className="bg-b3-line h-3 w-24 animate-pulse rounded"></div>
|
|
318
|
-
</div>
|
|
319
|
-
</div>
|
|
320
|
-
<div className="text-right">
|
|
321
|
-
<div className="bg-b3-line mb-1 h-4 w-20 animate-pulse rounded"></div>
|
|
322
|
-
<div className="bg-b3-line h-3 w-16 animate-pulse rounded"></div>
|
|
323
|
-
</div>
|
|
324
|
-
</div>
|
|
325
|
-
))}
|
|
326
|
-
</div>
|
|
327
|
-
</div>
|
|
328
|
-
) : simBalance?.balances && simBalance.balances.length > 0 ? (
|
|
329
|
-
<div className="space-y-4">
|
|
330
|
-
<div className="space-y-1">
|
|
331
|
-
{simBalance.balances.map(token => (
|
|
332
|
-
<div
|
|
333
|
-
key={token.chain_id + "_" + token.address}
|
|
334
|
-
className="hover:bg-b3-line/60 dark:hover:bg-b3-primary-wash/40 group flex cursor-pointer items-center justify-between rounded-xl p-3 transition-all duration-200"
|
|
335
|
-
onClick={() => {
|
|
336
|
-
setSelectedToken(token);
|
|
337
|
-
setStep("amount");
|
|
338
|
-
}}
|
|
339
|
-
>
|
|
340
|
-
<div className="flex items-center gap-3">
|
|
341
|
-
<div className="flex h-10 w-10 items-center justify-center rounded-full">
|
|
342
|
-
{ALL_CHAINS[token.chain_id]?.logoUrl ? (
|
|
343
|
-
<ChainTokenIcon
|
|
344
|
-
chainUrl={ALL_CHAINS[token.chain_id].logoUrl}
|
|
345
|
-
tokenUrl={token.token_metadata?.logo}
|
|
346
|
-
className="size-10"
|
|
347
|
-
/>
|
|
348
|
-
) : (
|
|
349
|
-
<CircleHelp className="text-b3-react-foreground size-10" />
|
|
350
|
-
)}
|
|
351
|
-
</div>
|
|
352
|
-
<div>
|
|
353
|
-
<div className="flex items-center gap-2">
|
|
354
|
-
<span className="text-b3-grey font-neue-montreal-semibold transition-colors duration-200 group-hover:font-bold group-hover:text-black">
|
|
355
|
-
{token.symbol}
|
|
356
|
-
</span>
|
|
357
|
-
</div>
|
|
358
|
-
<div className="text-b3-foreground-muted font-neue-montreal-medium text-sm transition-colors duration-200 group-hover:text-gray-700">
|
|
359
|
-
{token.name}
|
|
360
|
-
</div>
|
|
361
|
-
</div>
|
|
362
|
-
</div>
|
|
363
|
-
<div className="text-right">
|
|
364
|
-
<div className="text-b3-grey font-neue-montreal-semibold transition-colors duration-200 group-hover:font-bold group-hover:text-black">
|
|
365
|
-
{formatTokenAmount(BigInt(token.amount), token.decimals)}
|
|
366
|
-
</div>
|
|
367
|
-
<div className="text-b3-foreground-muted font-neue-montreal-medium text-sm transition-colors duration-200 group-hover:text-gray-700">
|
|
368
|
-
{formatDisplayNumber(token.value_usd, { style: "currency", fractionDigits: 2 })}
|
|
369
|
-
</div>
|
|
370
|
-
</div>
|
|
371
|
-
</div>
|
|
372
|
-
))}
|
|
373
|
-
</div>
|
|
374
|
-
</div>
|
|
375
|
-
) : (
|
|
376
|
-
<div className="flex flex-col items-center justify-center py-12 text-center">
|
|
377
|
-
<CircleHelp className="text-b3-foreground-muted mb-4 h-8 w-8" />
|
|
378
|
-
<p className="text-b3-foreground-muted font-neue-montreal-medium text-sm">No tokens available</p>
|
|
379
|
-
</div>
|
|
380
|
-
)}
|
|
381
|
-
</div>
|
|
382
|
-
)}
|
|
383
|
-
|
|
384
|
-
{step === "amount" && selectedToken && (
|
|
385
|
-
<div className="flex flex-col gap-6 p-5">
|
|
386
|
-
{/* Selected Token Display */}
|
|
387
|
-
<div className="flex items-center justify-between rounded-xl border border-[#d1d1d6] bg-[#fafafa] p-3">
|
|
388
|
-
<div className="flex items-center gap-3">
|
|
389
|
-
<div className="flex h-10 w-10 items-center justify-center">
|
|
390
|
-
{ALL_CHAINS[selectedToken.chain_id]?.logoUrl ? (
|
|
391
|
-
<ChainTokenIcon
|
|
392
|
-
chainUrl={ALL_CHAINS[selectedToken.chain_id].logoUrl}
|
|
393
|
-
tokenUrl={selectedToken.token_metadata?.logo}
|
|
394
|
-
className="size-10"
|
|
395
|
-
/>
|
|
396
|
-
) : (
|
|
397
|
-
<CircleHelp className="text-b3-react-foreground size-10" />
|
|
398
|
-
)}
|
|
399
|
-
</div>
|
|
400
|
-
<div>
|
|
401
|
-
<div className="font-neue-montreal-semibold text-base text-[#18181b]">{selectedToken.symbol}</div>
|
|
402
|
-
<div className="font-neue-montreal-medium text-sm text-[#70707b]">
|
|
403
|
-
{formatTokenAmount(BigInt(selectedToken.amount), selectedToken.decimals)}
|
|
404
|
-
</div>
|
|
405
|
-
</div>
|
|
406
|
-
</div>
|
|
407
|
-
<button
|
|
408
|
-
onClick={() => setStep("token")}
|
|
409
|
-
className="text-b3-primary-blue font-neue-montreal-semibold hover:text-b3-primary-blue/80 text-sm transition-colors"
|
|
410
|
-
>
|
|
411
|
-
Change
|
|
412
|
-
</button>
|
|
413
|
-
</div>
|
|
414
|
-
|
|
415
|
-
{/* Amount Input */}
|
|
416
|
-
<div className="space-y-3">
|
|
417
|
-
<NumericFormat
|
|
418
|
-
decimalSeparator="."
|
|
419
|
-
allowedDecimalSeparators={[","]}
|
|
420
|
-
thousandSeparator
|
|
421
|
-
inputMode="decimal"
|
|
422
|
-
autoComplete="off"
|
|
423
|
-
autoCorrect="off"
|
|
424
|
-
type="text"
|
|
425
|
-
placeholder="0.00"
|
|
426
|
-
minLength={1}
|
|
427
|
-
maxLength={30}
|
|
428
|
-
spellCheck="false"
|
|
429
|
-
className="font-neue-montreal-medium placeholder:text-b3-foreground-muted w-full rounded-lg border border-[#d1d1d6] bg-white px-3 py-2 text-base text-[#18181b] outline-none focus:border-[#0c68e9]"
|
|
430
|
-
pattern="^[0-9]*[.,]?[0-9]*$"
|
|
431
|
-
disabled={isSending}
|
|
432
|
-
value={sendAmount}
|
|
433
|
-
allowNegative={false}
|
|
434
|
-
onValueChange={values => setSendAmount(values.value)}
|
|
435
|
-
/>
|
|
436
|
-
|
|
437
|
-
{/* Percentage buttons */}
|
|
438
|
-
<div className="grid grid-cols-4 gap-2">
|
|
439
|
-
{[25, 50, 75, 100].map(percentage => (
|
|
440
|
-
<Button
|
|
441
|
-
key={percentage}
|
|
442
|
-
variant="outline"
|
|
443
|
-
onClick={() => handlePercentageClick(percentage)}
|
|
444
|
-
className="font-neue-montreal-medium border-[#d1d1d6] text-sm text-[#18181b] hover:bg-[#fafafa]"
|
|
445
|
-
disabled={isSending}
|
|
446
|
-
>
|
|
447
|
-
{percentage}%
|
|
448
|
-
</Button>
|
|
449
|
-
))}
|
|
450
|
-
</div>
|
|
451
|
-
|
|
452
|
-
{/* Available balance */}
|
|
453
|
-
<div className="font-neue-montreal-medium text-sm text-[#70707b]">
|
|
454
|
-
Available: {formatTokenAmount(BigInt(selectedToken.amount), selectedToken.decimals)}{" "}
|
|
455
|
-
{selectedToken.symbol}
|
|
456
|
-
</div>
|
|
457
|
-
</div>
|
|
458
|
-
|
|
459
|
-
{/* Continue Button */}
|
|
460
|
-
<Button
|
|
461
|
-
onClick={() => setStep("confirm")}
|
|
462
|
-
disabled={!sendAmount || parseFloat(sendAmount) <= 0}
|
|
463
|
-
className="bg-b3-primary-blue hover:bg-b3-primary-blue/90 font-neue-montreal-semibold disabled:bg-b3-line disabled:text-b3-foreground-muted h-12 w-full rounded-xl text-white"
|
|
464
|
-
>
|
|
465
|
-
Continue
|
|
466
|
-
</Button>
|
|
467
|
-
</div>
|
|
468
|
-
)}
|
|
469
|
-
|
|
470
|
-
{step === "confirm" && selectedToken && (
|
|
471
|
-
<div className="flex min-h-full flex-col">
|
|
472
|
-
{/* Top section with icon and amount */}
|
|
473
|
-
<div className="flex flex-col items-center gap-4 px-5 pb-0 pt-6">
|
|
474
|
-
{/* Send icon */}
|
|
475
|
-
<div className="flex h-14 w-14 items-center justify-center rounded-full bg-[#d5e5fd]">
|
|
476
|
-
<SendIcon className="h-7 w-7 text-[#0c68e9]" />
|
|
477
|
-
</div>
|
|
478
|
-
|
|
479
|
-
{/* Amount */}
|
|
480
|
-
<div className="flex items-center gap-1">
|
|
481
|
-
<span className="font-neue-montreal-semibold text-[30px] leading-[38px] text-[#18181b]">
|
|
482
|
-
{sendAmount}
|
|
483
|
-
</span>
|
|
484
|
-
<span className="font-neue-montreal-semibold text-[30px] leading-[38px] text-[#70707b]">
|
|
485
|
-
{selectedToken.symbol}
|
|
486
|
-
</span>
|
|
487
|
-
</div>
|
|
488
|
-
</div>
|
|
489
|
-
|
|
490
|
-
{/* Spacing */}
|
|
491
|
-
<div className="h-5" />
|
|
492
|
-
|
|
493
|
-
{/* Transaction details */}
|
|
494
|
-
<div className="flex flex-col gap-3 px-5">
|
|
495
|
-
<div className="rounded-xl border border-[#e4e4e7] bg-[#fafafa] p-4">
|
|
496
|
-
<div className="flex flex-col gap-3">
|
|
497
|
-
{/* To */}
|
|
498
|
-
<div className="flex items-center justify-between border-b border-[#e4e4e7] pb-3">
|
|
499
|
-
<span className="font-inter text-sm font-normal leading-5 text-[#51525c]">To</span>
|
|
500
|
-
<span className="font-inter text-sm font-normal leading-5 text-[#18181b]">
|
|
501
|
-
Wallet ({recipientAddress.slice(0, 6)}...{recipientAddress.slice(-4)})
|
|
502
|
-
</span>
|
|
503
|
-
</div>
|
|
504
|
-
|
|
505
|
-
{/* Network */}
|
|
506
|
-
<div className="flex items-center justify-between border-b border-[#e4e4e7] pb-3">
|
|
507
|
-
<span className="font-inter text-sm font-normal leading-5 text-[#51525c]">Network</span>
|
|
508
|
-
<div className="flex items-center gap-1.5">
|
|
509
|
-
<span className="font-inter text-sm font-normal leading-5 text-[#51525c]">
|
|
510
|
-
{ALL_CHAINS[selectedToken.chain_id]?.name || "Unknown"}
|
|
511
|
-
</span>
|
|
512
|
-
{ALL_CHAINS[selectedToken.chain_id]?.logoUrl && (
|
|
513
|
-
<img
|
|
514
|
-
src={ALL_CHAINS[selectedToken.chain_id].logoUrl}
|
|
515
|
-
alt={ALL_CHAINS[selectedToken.chain_id]?.name}
|
|
516
|
-
className="h-4 w-4 rounded-full"
|
|
517
|
-
/>
|
|
518
|
-
)}
|
|
519
|
-
</div>
|
|
520
|
-
</div>
|
|
521
|
-
|
|
522
|
-
{/* Network fee */}
|
|
523
|
-
<div className="flex items-center justify-between">
|
|
524
|
-
<span className="font-inter text-sm font-normal leading-5 text-[#51525c]">Network fee</span>
|
|
525
|
-
<span className="font-inter text-sm font-normal leading-5 text-[#18181b]">$0.1</span>
|
|
526
|
-
</div>
|
|
527
|
-
</div>
|
|
528
|
-
</div>
|
|
529
|
-
</div>
|
|
530
|
-
|
|
531
|
-
{/* Spacer to push buttons to bottom */}
|
|
532
|
-
<div className="flex-1" />
|
|
533
|
-
|
|
534
|
-
{/* Bottom buttons */}
|
|
535
|
-
<div className="flex gap-4 border-t border-[#e4e4e7] bg-[#fafafa] p-4">
|
|
536
|
-
<Button
|
|
537
|
-
onClick={handleBack}
|
|
538
|
-
disabled={isSending}
|
|
539
|
-
variant="outline"
|
|
540
|
-
className="font-inter h-12 flex-1 rounded-xl border border-[#e4e4e7] bg-white text-base font-semibold text-[#3f3f46] shadow-[inset_0px_0px_0px_1px_rgba(10,13,18,0.18),inset_0px_-2px_0px_0px_rgba(10,13,18,0.05)] hover:bg-[#fafafa]"
|
|
541
|
-
>
|
|
542
|
-
Cancel
|
|
543
|
-
</Button>
|
|
544
|
-
<Button
|
|
545
|
-
onClick={handleSend}
|
|
546
|
-
disabled={isSending}
|
|
547
|
-
className="font-inter border-white/12 h-12 flex-1 rounded-xl border-2 bg-[#0c68e9] text-base font-semibold text-white shadow-[inset_0px_0px_0px_1px_rgba(10,13,18,0.18),inset_0px_-2px_0px_0px_rgba(10,13,18,0.05)] hover:bg-[#0b5fd4]"
|
|
548
|
-
>
|
|
549
|
-
{isSending ? (
|
|
550
|
-
<>
|
|
551
|
-
<Loader2 className="mr-2 h-4 w-4 animate-spin" />
|
|
552
|
-
Sending...
|
|
553
|
-
</>
|
|
554
|
-
) : (
|
|
555
|
-
"Send"
|
|
556
|
-
)}
|
|
557
|
-
</Button>
|
|
558
|
-
</div>
|
|
559
|
-
</div>
|
|
560
|
-
)}
|
|
561
|
-
|
|
562
|
-
{step === "success" && selectedToken && (
|
|
563
|
-
<div className="flex h-full flex-col items-center justify-center gap-6 p-5 text-center">
|
|
564
|
-
<div className="flex h-14 w-14 items-center justify-center rounded-full bg-green-100">
|
|
565
|
-
<SendIcon className="h-7 w-7 text-green-600" />
|
|
566
|
-
</div>
|
|
567
|
-
<div>
|
|
568
|
-
<h3 className="font-neue-montreal-semibold mb-2 text-xl text-[#18181b]">Sent!</h3>
|
|
569
|
-
<p className="font-neue-montreal-medium text-sm text-[#70707b]">
|
|
570
|
-
{sendAmount} {selectedToken.symbol} was sent to {recipientAddress.slice(0, 6)}...
|
|
571
|
-
{recipientAddress.slice(-4)}
|
|
572
|
-
</p>
|
|
573
|
-
</div>
|
|
574
|
-
<Button
|
|
575
|
-
onClick={() => setB3ModalOpen(false)}
|
|
576
|
-
className="bg-b3-primary-blue hover:bg-b3-primary-blue/90 font-neue-montreal-semibold h-12 w-full rounded-xl text-white"
|
|
577
|
-
>
|
|
578
|
-
Done
|
|
579
|
-
</Button>
|
|
580
|
-
</div>
|
|
581
|
-
)}
|
|
582
|
-
</div>
|
|
583
|
-
</div>
|
|
584
|
-
);
|
|
585
|
-
}
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
import { SVGProps } from "react";
|
|
2
|
-
|
|
3
|
-
const BellIcon = (props: SVGProps<SVGSVGElement>) => (
|
|
4
|
-
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
|
|
5
|
-
<path
|
|
6
|
-
d="M7.5 17.5H12.5M4.16667 7.5C4.16667 4.27834 6.77834 1.66667 10 1.66667C13.2217 1.66667 15.8333 4.27834 15.8333 7.5V8.33333C15.8333 9.61667 16.2167 10.8583 16.9167 11.9167L17.5 12.75C17.9417 13.3917 17.4833 14.1667 16.7333 14.1667H3.26667C2.51667 14.1667 2.05834 13.3917 2.5 12.75L3.08334 11.9167C3.78334 10.8583 4.16667 9.61667 4.16667 8.33333V7.5Z"
|
|
7
|
-
stroke="currentColor"
|
|
8
|
-
strokeWidth="1.5"
|
|
9
|
-
strokeLinecap="round"
|
|
10
|
-
strokeLinejoin="round"
|
|
11
|
-
/>
|
|
12
|
-
</svg>
|
|
13
|
-
);
|
|
14
|
-
|
|
15
|
-
export default BellIcon;
|
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
import { SVGProps } from "react";
|
|
2
|
-
|
|
3
|
-
export function ChevronDownIcon({ className, ...props }: SVGProps<SVGSVGElement>) {
|
|
4
|
-
return (
|
|
5
|
-
<svg
|
|
6
|
-
width="24"
|
|
7
|
-
height="24"
|
|
8
|
-
viewBox="0 0 24 24"
|
|
9
|
-
fill="none"
|
|
10
|
-
xmlns="http://www.w3.org/2000/svg"
|
|
11
|
-
className={className}
|
|
12
|
-
{...props}
|
|
13
|
-
>
|
|
14
|
-
<path d="M6 9L12 15L18 9" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" />
|
|
15
|
-
</svg>
|
|
16
|
-
);
|
|
17
|
-
}
|
|
@@ -1,22 +0,0 @@
|
|
|
1
|
-
import { SVGProps } from "react";
|
|
2
|
-
|
|
3
|
-
export function CopyIcon({ className, ...props }: SVGProps<SVGSVGElement>) {
|
|
4
|
-
return (
|
|
5
|
-
<svg
|
|
6
|
-
width="12"
|
|
7
|
-
height="12"
|
|
8
|
-
viewBox="0 0 12 12"
|
|
9
|
-
fill="none"
|
|
10
|
-
xmlns="http://www.w3.org/2000/svg"
|
|
11
|
-
className={className}
|
|
12
|
-
{...props}
|
|
13
|
-
>
|
|
14
|
-
<path
|
|
15
|
-
d="M3.33333 3.33333V2C3.33333 1.63181 3.63181 1.33333 4 1.33333H10C10.3682 1.33333 10.6667 1.63181 10.6667 2V8C10.6667 8.36819 10.3682 8.66667 10 8.66667H8.66667M2 3.33333H8C8.36819 3.33333 8.66667 3.63181 8.66667 4V10C8.66667 10.3682 8.36819 10.6667 8 10.6667H2C1.63181 10.6667 1.33333 10.3682 1.33333 10V4C1.33333 3.63181 1.63181 3.33333 2 3.33333Z"
|
|
16
|
-
stroke="currentColor"
|
|
17
|
-
strokeLinecap="round"
|
|
18
|
-
strokeLinejoin="round"
|
|
19
|
-
/>
|
|
20
|
-
</svg>
|
|
21
|
-
);
|
|
22
|
-
}
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
import { SVGProps } from "react";
|
|
2
|
-
|
|
3
|
-
const LinkIcon = (props: SVGProps<SVGSVGElement>) => (
|
|
4
|
-
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
|
|
5
|
-
<path
|
|
6
|
-
d="M10.8333 9.16667L15.8333 4.16667M17.5 2.5L15.8333 4.16667L17.5 2.5ZM11.6667 4.16667H15.8333V8.33333L11.6667 4.16667ZM9.16667 10.8333L4.16667 15.8333L9.16667 10.8333ZM8.33333 15.8333H4.16667V11.6667L8.33333 15.8333ZM15.8333 10V15.8333H10L15.8333 10ZM4.16667 4.16667V10L10 4.16667H4.16667Z"
|
|
7
|
-
stroke="currentColor"
|
|
8
|
-
strokeWidth="1.5"
|
|
9
|
-
strokeLinecap="round"
|
|
10
|
-
strokeLinejoin="round"
|
|
11
|
-
/>
|
|
12
|
-
</svg>
|
|
13
|
-
);
|
|
14
|
-
|
|
15
|
-
export default LinkIcon;
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
import { SVGProps } from "react";
|
|
2
|
-
|
|
3
|
-
const LockIcon = (props: SVGProps<SVGSVGElement>) => (
|
|
4
|
-
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
|
|
5
|
-
<path
|
|
6
|
-
d="M14.1667 9.16667V6.66667C14.1667 4.36548 12.3012 2.5 10 2.5C7.69881 2.5 5.83333 4.36548 5.83333 6.66667V9.16667M7.5 14.1667C7.5 15.0871 8.24619 15.8333 9.16667 15.8333H10.8333C11.7538 15.8333 12.5 15.0871 12.5 14.1667C12.5 13.2462 11.7538 12.5 10.8333 12.5H9.16667C8.24619 12.5 7.5 11.7538 7.5 10.8333C7.5 9.91286 8.24619 9.16667 9.16667 9.16667H10.8333C11.7538 9.16667 12.5 9.91286 12.5 10.8333"
|
|
7
|
-
stroke="currentColor"
|
|
8
|
-
strokeWidth="1.5"
|
|
9
|
-
strokeLinecap="round"
|
|
10
|
-
strokeLinejoin="round"
|
|
11
|
-
/>
|
|
12
|
-
</svg>
|
|
13
|
-
);
|
|
14
|
-
|
|
15
|
-
export default LockIcon;
|