@abstraxn/signer-react 3.3.9 → 4.0.0

package/dist/src/components/WalletModal/components/PreviewTransactionModal.css

@@ -113,15 +113,5 @@
   background: #f3f4f6;
 }
 
-.wallet-modal-loading-spinner {
-  animation: spin 1s linear infinite;
-}
-
-@keyframes spin {
-  from {
-    transform: rotate(0deg);
-  }
-  to {
-    transform: rotate(360deg);
-  }
-}
+/* .wallet-modal-loading-spinner and @keyframes spin are defined once in WalletModal.css,
+   always bundled alongside this file's CSS in the same shadow root. */

package/dist/src/components/WalletModal/components/PreviewTransactionModal.css.d.ts

@@ -0,0 +1,2 @@
+declare const cssText: string;
+export default cssText;

package/dist/src/components/WalletModal/components/PreviewTransactionModal.css.js

@@ -0,0 +1 @@
+export default "/* Preview Transaction Modal Styles */\n.wallet-modal-preview-content {\n  padding: 20px 0;\n  display: flex;\n  flex-direction: column;\n  gap: 24px;\n}\n\n.wallet-modal-preview-section {\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n  padding: 20px;\n  border-radius: 12px;\n  border: 1px solid;\n}\n\n.wallet-modal-theme-dark .wallet-modal-preview-section {\n  background: #2a2a2a;\n  border-color: #3a3a3a;\n}\n\n.wallet-modal-theme-light .wallet-modal-preview-section {\n  background: #f9fafb;\n  border-color: #e5e7eb;\n}\n\n.wallet-modal-preview-item {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n}\n\n.wallet-modal-preview-label {\n  font-size: 12px;\n  opacity: 0.7;\n  text-align: left;\n}\n\n.wallet-modal-preview-value {\n  font-size: 14px;\n  font-weight: 500;\n  word-break: break-all;\n  text-align: left;\n}\n\n.wallet-modal-theme-dark .wallet-modal-preview-label,\n.wallet-modal-theme-dark .wallet-modal-preview-value {\n  color: #ffffff;\n}\n\n.wallet-modal-theme-light .wallet-modal-preview-label,\n.wallet-modal-theme-light .wallet-modal-preview-value {\n  color: #111827;\n}\n\n.wallet-modal-preview-actions {\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n}\n\n.wallet-modal-preview-btn {\n  width: 100%;\n  padding: 14px 24px;\n  border-radius: 12px;\n  border: none;\n  font-size: 16px;\n  font-weight: 600;\n  cursor: pointer;\n  transition: all 0.2s;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 8px;\n}\n\n.wallet-modal-preview-btn:disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n\n.wallet-modal-preview-btn-primary {\n  background: var(--abstraxn-primary);\n  color: var(--abstraxn-primary-text);\n}\n\n.wallet-modal-preview-btn-primary:hover:not(:disabled) {\n  background: var(--abstraxn-primary-hover);\n  transform: translateY(-1px);\n}\n\n.wallet-modal-preview-btn-secondary {\n  background: transparent;\n  border: 1px solid;\n}\n\n.wallet-modal-theme-dark .wallet-modal-preview-btn-secondary {\n  border-color: #3a3a3a;\n  color: #ffffff;\n}\n\n.wallet-modal-theme-light .wallet-modal-preview-btn-secondary {\n  border-color: #e5e7eb;\n  color: #111827;\n}\n\n.wallet-modal-theme-dark .wallet-modal-preview-btn-secondary:hover:not(:disabled) {\n  background: #3a3a3a;\n}\n\n.wallet-modal-theme-light .wallet-modal-preview-btn-secondary:hover:not(:disabled) {\n  background: #f3f4f6;\n}\n\n/* .wallet-modal-loading-spinner and @keyframes spin are defined once in WalletModal.css,\n   always bundled alongside this file's CSS in the same shadow root. */\n";

package/dist/src/components/WalletModal/components/PreviewTransactionModal.d.ts

@@ -2,7 +2,6 @@
  * Preview Transaction Modal Component
  */
 import type { ChainData } from '../../../chains';
-import './PreviewTransactionModal.css';
 export interface PreviewTransactionModalProps {
     isOpen: boolean;
     onClose: () => void;

package/dist/src/components/WalletModal/components/PreviewTransactionModal.js

@@ -1,6 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { formatAddress } from '../utils/formatUtils';
-import './PreviewTransactionModal.css';
 export function PreviewTransactionModal({ isOpen, onClose, onConfirm, recipientAddress, amount, displayAddress, currentChain, isSending, theme = 'dark', }) {
     if (!isOpen)
         return null;

package/dist/src/components/WalletModal/components/ReceiveModal.css.d.ts

@@ -0,0 +1,2 @@
+declare const cssText: string;
+export default cssText;

package/dist/src/components/WalletModal/components/ReceiveModal.css.js

@@ -0,0 +1 @@
+export default "/* Receive Funds modal - styled to match the provided design screenshot */\n\n/* Modal padding */\n.wallet-modal-content.wallet-modal-receive {\n  padding: 20px;\n  gap: 0;\n}\n\n/* Header */\n.wallet-modal-content.wallet-modal-receive .wallet-modal-receive-header {\n}\n\n.wallet-modal-content.wallet-modal-receive .wallet-modal-receive-title {\n  font-size: 18px;\n  font-weight: 600;\n  margin: 0;\n  flex: 1;\n  text-align: center;\n}\n\n/* Content */\n.wallet-modal-receive-content {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: 18px;\n  padding: 0;\n  margin-top: 12px;\n}\n\n/* QR */\n.wallet-modal-receive-qr-card {\n  position: relative;\n}\n\n.wallet-modal-receive-qr {\n  width: 100%;\n  padding: 18px;\n  background: #ffffff;\n  border-radius: 18px;\n  border: 1px solid #e5e7eb;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  box-shadow: 0 10px 25px -15px rgba(0, 0, 0, 0.25);\n}\n\n.wallet-modal-receive-qr-badge {\n  position: absolute;\n  left: 50%;\n  top: 50%;\n  transform: translate(-50%, -50%);\n  pointer-events: none;\n}\n\n.wallet-modal-receive-qr-badge-inner {\n  width: 56px;\n  height: 56px;\n  border-radius: 16px;\n  background: #ffffff;\n  border: 1px solid #e5e7eb;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: #2563eb;\n}\n\n/* Address \"input\" row */\n.wallet-modal-receive-address-row {\n  width: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 12px;\n  padding: 14px 16px;\n  border-radius: 12px;\n  border: 1px solid;\n  cursor: pointer;\n  transition: all 0.2s ease;\n}\n\n.wallet-modal-receive-address-text {\n  flex: 1;\n  text-align: left;\n  font-size: 15px;\n  font-weight: 600;\n  font-family: 'GeistMono', 'SF Mono', 'Monaco', 'Roboto Mono', monospace;\n}\n\n.wallet-modal-receive-copy-icon {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n}\n\n.wallet-modal-theme-light .wallet-modal-receive-address-row {\n  background: #ffffff;\n  border-color: #e5e7eb;\n  color: #111827;\n}\n\n.wallet-modal-theme-light .wallet-modal-receive-address-row:hover {\n  background: #f9fafb;\n}\n\n.wallet-modal-theme-dark .wallet-modal-receive-address-row {\n  background: #1a1a1a;\n  border-color: #3a3a3a;\n  color: #ffffff;\n}\n\n.wallet-modal-theme-dark .wallet-modal-receive-address-row:hover {\n  background: #202020;\n}\n\n.wallet-modal-receive-address-row.copied {\n  border-color: rgba(16, 185, 129, 0.55);\n  box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.18);\n}\n\n/* Helper text */\n.wallet-modal-receive-helper {\n  font-size: 12px;\n  text-align: center;\n  margin: 0;\n}\n\n.wallet-modal-theme-light .wallet-modal-receive-helper {\n  color: #6b7280;\n}\n\n.wallet-modal-theme-dark .wallet-modal-receive-helper {\n  color: #9ca3af;\n}\n";

package/dist/src/components/WalletModal/components/ReceiveModal.d.ts

@@ -1,4 +1,3 @@
-import './ReceiveModal.css';
 export interface ReceiveModalProps {
     isOpen: boolean;
     onClose: () => void;

package/dist/src/components/WalletModal/components/ReceiveModal.js

@@ -5,7 +5,7 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 import { useState, useCallback } from 'react';
 import { QRCode } from '../../QRCode';
 import { formatAddress } from '../utils/formatUtils';
-import './ReceiveModal.css';
+import { CloseIcon } from '../../icons';
 export function ReceiveModal({ isOpen, onClose, address, theme = 'dark', }) {
     const [copied, setCopied] = useState(false);
     const handleCopy = useCallback(() => {
@@ -17,6 +17,6 @@ export function ReceiveModal({ isOpen, onClose, address, theme = 'dark', }) {
     }, [address]);
     if (!isOpen)
         return null;
-    return (_jsx("div", { className: `wallet-modal-overlay wallet-modal-theme-${theme}`, onClick: onClose, children: _jsxs("div", { className: `wallet-modal-content wallet-modal-theme-${theme} wallet-modal-receive`, onClick: (e) => e.stopPropagation(), children: [_jsxs("div", { className: "wallet-modal-receive-header", children: [_jsx("button", { className: "wallet-modal-back", onClick: onClose, children: _jsx("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", children: _jsx("path", { d: "M12.5 15L7.5 10L12.5 5", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) }) }), _jsx("h2", { className: "wallet-modal-receive-title", children: "Receive Funds" }), _jsx("button", { className: "wallet-modal-close", onClick: onClose, "aria-label": "Close", children: _jsx("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", children: _jsx("path", { d: "M15 5L5 15M5 5L15 15", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) }) })] }), _jsx("div", { className: "wallet-modal-receive-content", children: address && (_jsxs(_Fragment, { children: [_jsxs("div", { className: "wallet-modal-receive-qr-card", children: [_jsx("div", { className: "wallet-modal-receive-qr", children: _jsx(QRCode, { value: address, size: 260 }) }), _jsx("div", { className: "wallet-modal-receive-qr-badge", "aria-hidden": "true", children: _jsx("div", { className: "wallet-modal-receive-qr-badge-inner", children: _jsxs("svg", { width: "26", height: "26", viewBox: "0 0 24 24", fill: "none", children: [_jsx("path", { d: "M4 7.5C4 6.67157 4.67157 6 5.5 6H18.5C19.3284 6 20 6.67157 20 7.5V16.5C20 17.3284 19.3284 18 18.5 18H5.5C4.67157 18 4 17.3284 4 16.5V7.5Z", stroke: "currentColor", strokeWidth: "2", strokeLinejoin: "round" }), _jsx("path", { d: "M5.5 7.5L12 12L18.5 7.5", stroke: "currentColor", strokeWidth: "2", strokeLinejoin: "round", strokeLinecap: "round" })] }) }) })] }), _jsxs("button", { type: "button", className: `wallet-modal-receive-address-row wallet-modal-theme-${theme} ${copied ? 'copied' : ''}`, onClick: handleCopy, "aria-label": "Copy wallet address", children: [_jsx("span", { className: "wallet-modal-receive-address-text", children: formatAddress(address) }), _jsx("span", { className: "wallet-modal-receive-copy-icon", "aria-hidden": "true", children: copied ? (_jsx("svg", { width: "18", height: "18", viewBox: "0 0 16 16", fill: "none", children: _jsx("path", { d: "M13.5 4L6 11.5L2.5 8", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) })) : (_jsx("svg", { width: "18", height: "18", viewBox: "0 0 16 16", fill: "none", children: _jsx("path", { d: "M5.5 4.5H3.5C2.67157 4.5 2 5.17157 2 6V12.5C2 13.3284 2.67157 14 3.5 14H10C10.8284 14 11.5 13.3284 11.5 12.5V10.5M5.5 4.5C5.5 3.67157 6.17157 3 7 3H10.5C11.3284 3 12 3.67157 12 4.5V8M5.5 4.5C5.5 5.32843 6.17157 6 7 6H10.5", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) })) })] }), _jsx("p", { className: "wallet-modal-receive-helper", children: "Copy the address to send funds to this wallet" })] })) })] }) }));
+    return (_jsx("div", { className: `wallet-modal-overlay wallet-modal-theme-${theme}`, onClick: onClose, children: _jsxs("div", { className: `wallet-modal-content wallet-modal-theme-${theme} wallet-modal-receive`, onClick: (e) => e.stopPropagation(), children: [_jsxs("div", { className: "wallet-modal-receive-header", children: [_jsx("button", { className: "wallet-modal-back", onClick: onClose, children: _jsx("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", children: _jsx("path", { d: "M12.5 15L7.5 10L12.5 5", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) }) }), _jsx("h2", { className: "wallet-modal-receive-title", children: "Receive Funds" }), _jsx("button", { className: "wallet-modal-close", onClick: onClose, "aria-label": "Close", children: _jsx(CloseIcon, { size: 20 }) })] }), _jsx("div", { className: "wallet-modal-receive-content", children: address && (_jsxs(_Fragment, { children: [_jsxs("div", { className: "wallet-modal-receive-qr-card", children: [_jsx("div", { className: "wallet-modal-receive-qr", children: _jsx(QRCode, { value: address, size: 260 }) }), _jsx("div", { className: "wallet-modal-receive-qr-badge", "aria-hidden": "true", children: _jsx("div", { className: "wallet-modal-receive-qr-badge-inner", children: _jsxs("svg", { width: "26", height: "26", viewBox: "0 0 24 24", fill: "none", children: [_jsx("path", { d: "M4 7.5C4 6.67157 4.67157 6 5.5 6H18.5C19.3284 6 20 6.67157 20 7.5V16.5C20 17.3284 19.3284 18 18.5 18H5.5C4.67157 18 4 17.3284 4 16.5V7.5Z", stroke: "currentColor", strokeWidth: "2", strokeLinejoin: "round" }), _jsx("path", { d: "M5.5 7.5L12 12L18.5 7.5", stroke: "currentColor", strokeWidth: "2", strokeLinejoin: "round", strokeLinecap: "round" })] }) }) })] }), _jsxs("button", { type: "button", className: `wallet-modal-receive-address-row wallet-modal-theme-${theme} ${copied ? 'copied' : ''}`, onClick: handleCopy, "aria-label": "Copy wallet address", children: [_jsx("span", { className: "wallet-modal-receive-address-text", children: formatAddress(address) }), _jsx("span", { className: "wallet-modal-receive-copy-icon", "aria-hidden": "true", children: copied ? (_jsx("svg", { width: "18", height: "18", viewBox: "0 0 16 16", fill: "none", children: _jsx("path", { d: "M13.5 4L6 11.5L2.5 8", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) })) : (_jsx("svg", { width: "18", height: "18", viewBox: "0 0 16 16", fill: "none", children: _jsx("path", { d: "M5.5 4.5H3.5C2.67157 4.5 2 5.17157 2 6V12.5C2 13.3284 2.67157 14 3.5 14H10C10.8284 14 11.5 13.3284 11.5 12.5V10.5M5.5 4.5C5.5 3.67157 6.17157 3 7 3H10.5C11.3284 3 12 3.67157 12 4.5V8M5.5 4.5C5.5 5.32843 6.17157 6 7 6H10.5", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) })) })] }), _jsx("p", { className: "wallet-modal-receive-helper", children: "Copy the address to send funds to this wallet" })] })) })] }) }));
 }
 //# sourceMappingURL=ReceiveModal.js.map

package/dist/src/components/WalletModal/components/SendModal.css.d.ts

@@ -0,0 +1,2 @@
+declare const cssText: string;
+export default cssText;

package/dist/src/components/WalletModal/components/SendModal.css.js

@@ -0,0 +1 @@
+export default "/* Send Modal Styles - Clean minimal design */\n\n/* Override modal padding for send modal */\n.wallet-modal-content.wallet-modal-send {\n  padding: 20px;\n  gap: 0;\n}\n\n/* Header */\n.wallet-modal-send-header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 0;\n}\n\n.wallet-modal-send-title {\n  font-size: 18px;\n  font-weight: 600;\n  margin: 0;\n  color: #111827;\n}\n\n.wallet-modal-theme-dark .wallet-modal-send-title {\n  color: #ffffff;\n}\n\n\n/* Content */\n.wallet-modal-send-content {\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n  padding: 0;\n  margin-top: 16px;\n}\n\n.wallet-modal-send-field {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n}\n\n.wallet-modal-send-label {\n  font-size: 14px;\n  font-weight: 500;\n  color: #374151;\n  text-align: left;\n}\n\n.wallet-modal-theme-dark .wallet-modal-send-label {\n  color: #9ca3af;\n}\n\n/* Token Card */\n.wallet-modal-send-token-card {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  width: 100%;\n  padding: 12px;\n  border-radius: 12px;\n  border: 1px solid #e5e7eb;\n  background: #ffffff;\n  cursor: pointer;\n  transition: all 0.2s;\n  text-align: left;\n}\n\n.wallet-modal-send-token-card:hover {\n  border-color: #3b82f6;\n}\n\n.wallet-modal-theme-dark .wallet-modal-send-token-card {\n  border-color: #3a3a3a;\n  background: #1a1a1a;\n}\n\n.wallet-modal-theme-dark .wallet-modal-send-token-card:hover {\n  border-color: #3b82f6;\n}\n\n.wallet-modal-send-token-icon {\n  width: 40px;\n  height: 40px;\n  flex-shrink: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.wallet-modal-send-token-icon img {\n  width: 100%;\n  height: 100%;\n  border-radius: 50%;\n  object-fit: cover;\n}\n\n.wallet-modal-send-token-icon-placeholder {\n  width: 100%;\n  height: 100%;\n  border-radius: 50%;\n  background: #e5e7eb;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-weight: 600;\n  font-size: 16px;\n  color: #6b7280;\n}\n\n.wallet-modal-theme-dark .wallet-modal-send-token-icon-placeholder {\n  background: #2a2a2a;\n  color: #9ca3af;\n}\n\n.wallet-modal-send-token-details {\n  display: flex;\n  flex-direction: column;\n  gap: 2px;\n}\n\n.wallet-modal-send-token-name {\n  font-size: 16px;\n  font-weight: 600;\n  color: #111827;\n}\n\n.wallet-modal-theme-dark .wallet-modal-send-token-name {\n  color: #ffffff;\n}\n\n.wallet-modal-send-token-balance {\n  font-size: 13px;\n  color: #6b7280;\n}\n\n.wallet-modal-theme-dark .wallet-modal-send-token-balance {\n  color: #9ca3af;\n}\n\n/* Input Fields */\n.wallet-modal-send-input {\n  width: 100%;\n  padding: 12px 14px;\n  border-radius: 12px;\n  border: 1px solid #e5e7eb;\n  background: #ffffff;\n  font-size: 15px;\n  outline: none;\n  transition: all 0.2s;\n  box-sizing: border-box;\n  color: #111827;\n}\n\n.wallet-modal-send-input::placeholder {\n  color: #9ca3af;\n}\n\n.wallet-modal-send-input:focus {\n  border-color: #3b82f6;\n}\n\n.wallet-modal-send-input.error {\n  border-color: #ef4444;\n}\n\n.wallet-modal-theme-dark .wallet-modal-send-input {\n  border-color: #3a3a3a;\n  background: #1a1a1a;\n  color: #ffffff;\n}\n\n.wallet-modal-theme-dark .wallet-modal-send-input::placeholder {\n  color: #6b7280;\n}\n\n.wallet-modal-theme-dark .wallet-modal-send-input:focus {\n  border-color: #3b82f6;\n}\n\n/* Amount Box */\n.wallet-modal-send-amount-box {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  width: 100%;\n  padding: 12px 14px;\n  border-radius: 12px;\n  border: 1px solid #e5e7eb;\n  background: #ffffff;\n  box-sizing: border-box;\n  transition: all 0.2s;\n}\n\n.wallet-modal-send-amount-box:focus-within {\n  border-color: #3b82f6;\n}\n\n.wallet-modal-send-amount-box.error {\n  border-color: #ef4444;\n}\n\n.wallet-modal-theme-dark .wallet-modal-send-amount-box {\n  border-color: #3a3a3a;\n  background: #1a1a1a;\n}\n\n.wallet-modal-theme-dark .wallet-modal-send-amount-box:focus-within {\n  border-color: #3b82f6;\n}\n\n.wallet-modal-send-amount-input {\n  flex: 1;\n  border: none;\n  background: transparent;\n  font-size: 15px;\n  outline: none;\n  min-width: 0;\n  color: #111827;\n  padding: 0;\n}\n\n.wallet-modal-send-amount-input::placeholder {\n  color: #9ca3af;\n}\n\n.wallet-modal-theme-dark .wallet-modal-send-amount-input {\n  color: #ffffff;\n}\n\n.wallet-modal-theme-dark .wallet-modal-send-amount-input::placeholder {\n  color: #6b7280;\n}\n\n.wallet-modal-send-amount-symbol {\n  font-size: 15px;\n  font-weight: 500;\n  color: #6b7280;\n  flex-shrink: 0;\n  margin-left: 8px;\n}\n\n.wallet-modal-theme-dark .wallet-modal-send-amount-symbol {\n  color: #9ca3af;\n}\n\n/* Error Message */\n.wallet-modal-send-error {\n  font-size: 12px;\n  color: #ef4444;\n  text-align: left;\n}\n\n/* Send Button */\n.wallet-modal-send-btn {\n  width: 100%;\n  padding: 14px 24px;\n  border-radius: 12px;\n  border: none;\n  font-size: 16px;\n  font-weight: 600;\n  cursor: pointer;\n  transition: all 0.2s;\n  background: #3b82f6;\n  color: #ffffff;\n  margin-top: 8px;\n}\n\n.wallet-modal-send-btn:hover:not(.disabled) {\n  background: #2563eb;\n}\n\n.wallet-modal-send-btn.disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n";

package/dist/src/components/WalletModal/components/SendModal.d.ts

@@ -1,5 +1,5 @@
 import type { ChainData } from "../../../chains";
-import "./SendModal.css";
+import { type TokenData } from "./TokenSelectorModal";
 export interface SendModalProps {
     isOpen: boolean;
     onClose: () => void;
@@ -8,9 +8,12 @@ export interface SendModalProps {
     availableBalance: bigint | null;
     externalWalletBalance: bigint | null;
     walletBalance: bigint | null;
+    /** Live token list (native + non-native) from useTokenBalances()/useSolanaTokenBalances(), passed down by WalletModal so both surfaces share one fetch. */
+    liveTokens: TokenData[];
+    liveTokensLoading?: boolean;
     sendTransaction?: (tx: any) => Promise<{
         hash: string;
     }>;
     theme?: "light" | "dark";
 }
-export declare function SendModal({ isOpen, onClose, currentChain, displayAddress, availableBalance, externalWalletBalance, walletBalance, sendTransaction, theme, }: SendModalProps): import("react/jsx-runtime").JSX.Element | null;
+export declare function SendModal({ isOpen, onClose, currentChain, displayAddress, availableBalance, externalWalletBalance, walletBalance, liveTokens, liveTokensLoading, sendTransaction, theme, }: SendModalProps): import("react/jsx-runtime").JSX.Element | null;

package/dist/src/components/WalletModal/components/SendModal.js

@@ -10,8 +10,8 @@ import { useAddressValidation } from "../hooks/useAddressValidation";
 import { useAmountValidation } from "../hooks/useAmountValidation";
 import { useSendTransaction } from "../hooks/useSendTransaction";
 import { formatBalanceValue } from "../utils/formatUtils";
-import "./SendModal.css";
-export function SendModal({ isOpen, onClose, currentChain, displayAddress, availableBalance, externalWalletBalance, walletBalance, sendTransaction, theme = "dark", }) {
+import { CloseIcon } from "../../icons";
+export function SendModal({ isOpen, onClose, currentChain, displayAddress, availableBalance, externalWalletBalance, walletBalance, liveTokens, liveTokensLoading, sendTransaction, theme = "dark", }) {
     const [recipientAddress, setRecipientAddress] = useState("");
     const [amount, setAmount] = useState("");
     const [addressError, setAddressError] = useState("");
@@ -20,88 +20,31 @@ export function SendModal({ isOpen, onClose, currentChain, displayAddress, avail
     const [showTokenSelector, setShowTokenSelector] = useState(false);
     const [selectedToken, setSelectedToken] = useState(null);
     const balance = externalWalletBalance || walletBalance || availableBalance;
-    // Get available tokens for the current chain
+    // Available tokens for the current chain: prefer the live list (native + non-native,
+    // real balances) passed down from WalletModal; fall back to a single native-only
+    // entry while it's still loading or if the chain isn't Turnkey-covered and no RPC
+    // fallback entry has landed yet.
     const availableTokens = useMemo(() => {
         if (!currentChain)
             return [];
-        const nativeToken = {
-            address: "0x0",
-            symbol: currentChain.nativeCurrency.symbol,
-            name: currentChain.nativeCurrency.name,
-            decimals: currentChain.nativeCurrency.decimals,
-            iconUrl: currentChain.iconUrl,
-            balance: balance || 0n,
-            isNative: true,
-        };
-        // Example tokens for Ethereum (you can expand this for other chains)
-        const tokensByChain = {
-            1: [
-                // Ethereum Mainnet
-                nativeToken,
-                {
-                    address: "0xC02aaA39b223FE8D0A0e5C4F27eAD9083C756Cc2",
-                    symbol: "WETH",
-                    name: "Wrapped Ether",
-                    decimals: 18,
-                    iconUrl: "https://raw.githubusercontent.com/spothq/cryptocurrency-icons/master/128/color/eth.png",
-                    balance: 0n,
-                },
-                {
-                    address: "0xdAC17F958D2ee523a2206206994597C13D831ec7",
-                    symbol: "USDT",
-                    name: "Tether USD",
-                    decimals: 6,
-                    iconUrl: "https://raw.githubusercontent.com/spothq/cryptocurrency-icons/master/128/color/usdt.png",
-                    balance: 0n,
-                },
-                {
-                    address: "0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48",
-                    symbol: "USDC",
-                    name: "USD Coin",
-                    decimals: 6,
-                    iconUrl: "https://raw.githubusercontent.com/spothq/cryptocurrency-icons/master/128/color/usdc.png",
-                    balance: 0n,
-                },
-                {
-                    address: "0x2260FAC5E5542a773Aa44fBCfeDf7C193bc2C599",
-                    symbol: "WBTC",
-                    name: "Wrapped Bitcoin",
-                    decimals: 8,
-                    iconUrl: "https://raw.githubusercontent.com/spothq/cryptocurrency-icons/master/128/color/btc.png",
-                    balance: 0n,
-                },
-            ],
-            137: [
-                // Polygon Mainnet
-                nativeToken,
-                {
-                    address: "0x0d500B1d8E8eF31E21C99d1Db9A6444d3ADf1270",
-                    symbol: "WMATIC",
-                    name: "Wrapped Matic",
-                    decimals: 18,
-                    iconUrl: "https://raw.githubusercontent.com/spothq/cryptocurrency-icons/master/128/color/matic.png",
-                    balance: 0n,
-                },
-                {
-                    address: "0xc2132D05D31c914a87C6611C10748AEb04B58e8F",
-                    symbol: "USDT",
-                    name: "Tether USD",
-                    decimals: 6,
-                    iconUrl: "https://raw.githubusercontent.com/spothq/cryptocurrency-icons/master/128/color/usdt.png",
-                    balance: 0n,
-                },
-                {
-                    address: "0x2791Bca1f2de4661ED88A30C99A7a9449Aa84174",
-                    symbol: "USDC",
-                    name: "USD Coin",
-                    decimals: 6,
-                    iconUrl: "https://raw.githubusercontent.com/spothq/cryptocurrency-icons/master/128/color/usdc.png",
-                    balance: 0n,
-                },
-            ],
-        };
-        return tokensByChain[currentChain.id] || [nativeToken];
-    }, [currentChain, balance]);
+        if (liveTokens.length > 0) {
+            return liveTokens;
+        }
+        if (liveTokensLoading) {
+            return [];
+        }
+        return [
+            {
+                address: "0x0",
+                symbol: currentChain.nativeCurrency.symbol,
+                name: currentChain.nativeCurrency.name,
+                decimals: currentChain.nativeCurrency.decimals,
+                iconUrl: currentChain.iconUrl,
+                balance: balance || 0n,
+                isNative: true,
+            },
+        ];
+    }, [currentChain, liveTokens, liveTokensLoading, balance]);
     // Initialize selected token when chain changes
     useEffect(() => {
         if (currentChain && availableTokens.length > 0) {
@@ -214,6 +157,6 @@ export function SendModal({ isOpen, onClose, currentChain, displayAddress, avail
     if (showTokenSelector) {
         return (_jsx(TokenSelectorModal, { isOpen: true, onClose: () => setShowTokenSelector(false), onTokenSelect: handleTokenSelect, currentChain: currentChain, tokens: availableTokens, selectedToken: selectedToken || undefined, theme: theme }));
     }
-    return (_jsx("div", { className: `wallet-modal-overlay wallet-modal-theme-${theme}`, onClick: onClose, children: _jsxs("div", { className: `wallet-modal-content wallet-modal-theme-${theme} wallet-modal-send`, onClick: (e) => e.stopPropagation(), children: [_jsxs("div", { className: "wallet-modal-send-header", children: [_jsx("button", { className: "wallet-modal-back", onClick: onClose, "aria-label": "Go back", children: _jsx("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: _jsx("path", { d: "M12.5 15L7.5 10L12.5 5", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) }) }), _jsx("h2", { className: "wallet-modal-send-title", children: "Send Funds" }), _jsx("button", { className: "wallet-modal-close", onClick: onClose, "aria-label": "Close", children: _jsx("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: _jsx("path", { d: "M15 5L5 15M5 5L15 15", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) }) })] }), _jsxs("div", { className: "wallet-modal-send-content", children: [_jsxs("div", { className: "wallet-modal-send-field", children: [_jsx("label", { className: "wallet-modal-send-label", children: "Token" }), _jsxs("button", { className: "wallet-modal-send-token-card", onClick: () => setShowTokenSelector(true), type: "button", children: [_jsx("div", { className: "wallet-modal-send-token-icon", children: selectedToken?.iconUrl ? (_jsx("img", { src: selectedToken.iconUrl, alt: selectedToken.name })) : (_jsx("div", { className: "wallet-modal-send-token-icon-placeholder", children: selectedToken?.symbol?.charAt(0) || "?" })) }), _jsxs("div", { className: "wallet-modal-send-token-details", children: [_jsx("span", { className: "wallet-modal-send-token-name", children: selectedToken?.name || "Ether" }), _jsxs("span", { className: "wallet-modal-send-token-balance", children: [availableBalanceValue, " ", symbol] })] })] })] }), _jsxs("div", { className: "wallet-modal-send-field", children: [_jsx("label", { className: "wallet-modal-send-label", children: "Send to" }), _jsx("input", { type: "text", className: `wallet-modal-send-input ${addressError ? "error" : ""}`, placeholder: "0x... or ENS name", value: recipientAddress, onChange: (e) => handleRecipientAddressChange(e.target.value) }), addressError && (_jsx("div", { className: "wallet-modal-send-error", children: addressError }))] }), _jsxs("div", { className: "wallet-modal-send-field", children: [_jsx("label", { className: "wallet-modal-send-label", children: "Amount" }), _jsxs("div", { className: `wallet-modal-send-amount-box ${amountError ? "error" : ""}`, children: [_jsx("input", { type: "text", className: "wallet-modal-send-amount-input", placeholder: "0", value: amount, onChange: (e) => handleAmountChange(e.target.value) }), _jsx("span", { className: "wallet-modal-send-amount-symbol", children: symbol })] }), amountError && (_jsx("div", { className: "wallet-modal-send-error", children: amountError }))] }), _jsx("button", { className: `wallet-modal-send-btn ${!isFormValid ? "disabled" : ""}`, onClick: handlePreviewTransaction, disabled: !isFormValid, children: "Send" })] })] }) }));
+    return (_jsx("div", { className: `wallet-modal-overlay wallet-modal-theme-${theme}`, onClick: onClose, children: _jsxs("div", { className: `wallet-modal-content wallet-modal-theme-${theme} wallet-modal-send`, onClick: (e) => e.stopPropagation(), children: [_jsxs("div", { className: "wallet-modal-send-header", children: [_jsx("button", { className: "wallet-modal-back", onClick: onClose, "aria-label": "Go back", children: _jsx("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: _jsx("path", { d: "M12.5 15L7.5 10L12.5 5", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) }) }), _jsx("h2", { className: "wallet-modal-send-title", children: "Send Funds" }), _jsx("button", { className: "wallet-modal-close", onClick: onClose, "aria-label": "Close", children: _jsx(CloseIcon, { size: 20 }) })] }), _jsxs("div", { className: "wallet-modal-send-content", children: [_jsxs("div", { className: "wallet-modal-send-field", children: [_jsx("label", { className: "wallet-modal-send-label", children: "Token" }), _jsxs("button", { className: "wallet-modal-send-token-card", onClick: () => setShowTokenSelector(true), type: "button", children: [_jsx("div", { className: "wallet-modal-send-token-icon", children: selectedToken?.iconUrl ? (_jsx("img", { src: selectedToken.iconUrl, alt: selectedToken.name })) : (_jsx("div", { className: "wallet-modal-send-token-icon-placeholder", children: selectedToken?.symbol?.charAt(0) || "?" })) }), _jsxs("div", { className: "wallet-modal-send-token-details", children: [_jsx("span", { className: "wallet-modal-send-token-name", children: selectedToken?.name || "Ether" }), _jsxs("span", { className: "wallet-modal-send-token-balance", children: [availableBalanceValue, " ", symbol] })] })] })] }), _jsxs("div", { className: "wallet-modal-send-field", children: [_jsx("label", { className: "wallet-modal-send-label", children: "Send to" }), _jsx("input", { type: "text", className: `wallet-modal-send-input ${addressError ? "error" : ""}`, placeholder: "0x... or ENS name", value: recipientAddress, onChange: (e) => handleRecipientAddressChange(e.target.value) }), addressError && (_jsx("div", { className: "wallet-modal-send-error", children: addressError }))] }), _jsxs("div", { className: "wallet-modal-send-field", children: [_jsx("label", { className: "wallet-modal-send-label", children: "Amount" }), _jsxs("div", { className: `wallet-modal-send-amount-box ${amountError ? "error" : ""}`, children: [_jsx("input", { type: "text", className: "wallet-modal-send-amount-input", placeholder: "0", value: amount, onChange: (e) => handleAmountChange(e.target.value) }), _jsx("span", { className: "wallet-modal-send-amount-symbol", children: symbol })] }), amountError && (_jsx("div", { className: "wallet-modal-send-error", children: amountError }))] }), _jsx("button", { className: `wallet-modal-send-btn ${!isFormValid ? "disabled" : ""}`, onClick: handlePreviewTransaction, disabled: !isFormValid, children: "Send" })] })] }) }));
 }
 //# sourceMappingURL=SendModal.js.map

package/dist/src/components/WalletModal/components/SignMfaModalHost.d.ts

@@ -0,0 +1 @@
+export declare function SignMfaModalHost(): import("react/jsx-runtime").JSX.Element;

package/dist/src/components/WalletModal/components/SignMfaModalHost.js

@@ -0,0 +1,50 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * Host that registers the sign-MFA code requester with the bridge and
+ * opens the shared MfaVerifyModal when a signing hook needs step-up.
+ */
+import { useCallback, useEffect, useRef, useState } from "react";
+import { useAbstraxnWallet } from "../../AbstraxnProvider/useAbstraxnWallet";
+import { registerSignMfaCodeRequester } from "../../../signMfaBridge";
+import { MfaVerifyModal } from "./MfaVerifyModal";
+export function SignMfaModalHost() {
+    const { uiConfig } = useAbstraxnWallet();
+    const theme = uiConfig?.theme === "dark" ? "dark" : "light";
+    const [open, setOpen] = useState(false);
+    const pendingRef = useRef(null);
+    const clearPending = useCallback((error) => {
+        const pending = pendingRef.current;
+        pendingRef.current = null;
+        setOpen(false);
+        if (pending && error) {
+            pending.reject(error);
+        }
+    }, []);
+    useEffect(() => {
+        const unregister = registerSignMfaCodeRequester(() => new Promise((resolve, reject) => {
+            if (pendingRef.current) {
+                pendingRef.current.reject(new Error("MFA step-up was replaced by a newer signing request."));
+            }
+            pendingRef.current = { resolve, reject };
+            setOpen(true);
+        }));
+        return () => {
+            unregister();
+            if (pendingRef.current) {
+                pendingRef.current.reject(new Error("MFA step-up cancelled because the provider unmounted."));
+                pendingRef.current = null;
+            }
+        };
+    }, []);
+    const handleSubmit = useCallback((code) => {
+        const pending = pendingRef.current;
+        pendingRef.current = null;
+        setOpen(false);
+        pending?.resolve(code);
+    }, []);
+    const handleCancel = useCallback(() => {
+        clearPending(new Error("MFA step-up was cancelled."));
+    }, [clearPending]);
+    return (_jsx(MfaVerifyModal, { isOpen: open, theme: theme, portal: true, title: "Approve signing", description: "Enter your authentication code to approve this signing request.", submitLabel: "Continue", onSubmit: handleSubmit, onCancel: handleCancel }));
+}
+//# sourceMappingURL=SignMfaModalHost.js.map

package/dist/src/components/WalletModal/components/SuccessModal.css.d.ts

@@ -0,0 +1,2 @@
+declare const cssText: string;
+export default cssText;

package/dist/src/components/WalletModal/components/SuccessModal.css.js

@@ -0,0 +1 @@
+export default "/* Success Modal Styles */\n.wallet-modal-success-content {\n  padding: 40px 20px;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: 20px;\n  text-align: center;\n}\n\n.wallet-modal-success-icon {\n  width: 64px;\n  height: 64px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.wallet-modal-content .wallet-modal-success-title {\n  font-size: 24px;\n  font-weight: 500;\n  margin: 0;\n}\n\n.wallet-modal-content.wallet-modal-theme-dark .wallet-modal-success-title {\n  color: #ffffff;\n}\n\n.wallet-modal-content.wallet-modal-theme-light .wallet-modal-success-title {\n  color: #111827;\n}\n\n.wallet-modal-success-message {\n  font-size: 14px;\n  opacity: 0.7;\n  margin: 0;\n}\n\n.wallet-modal-theme-dark .wallet-modal-success-message {\n  color: #9ca3af;\n}\n\n.wallet-modal-theme-light .wallet-modal-success-message {\n  color: #6b7280;\n}\n\n.wallet-modal-success-link {\n  font-size: 14px;\n  text-decoration: none;\n  padding: 8px 16px;\n  border-radius: 8px;\n  transition: all 0.2s;\n}\n\n.wallet-modal-theme-dark .wallet-modal-success-link {\n  color: #a855f7;\n  background: rgba(147, 51, 234, 0.1);\n}\n\n.wallet-modal-theme-light .wallet-modal-success-link {\n  color: #9333ea;\n  background: rgba(147, 51, 234, 0.1);\n}\n\n.wallet-modal-success-link:hover {\n  background: rgba(147, 51, 234, 0.2);\n}\n\n.wallet-modal-success-btn {\n  width: 100%;\n  padding: 14px 24px;\n  border-radius: 12px;\n  border: none;\n  font-size: 16px;\n  font-weight: 600;\n  cursor: pointer;\n  transition: all 0.2s;\n  background: var(--abstraxn-primary);\n  color: var(--abstraxn-primary-text);\n}\n\n.wallet-modal-success-btn:hover {\n  background: var(--abstraxn-primary-hover);\n  transform: translateY(-1px);\n}\n";

package/dist/src/components/WalletModal/components/SuccessModal.d.ts

@@ -2,7 +2,6 @@
  * Success Modal Component
  */
 import type { ChainData } from '../../../chains';
-import './SuccessModal.css';
 export interface SuccessModalProps {
     isOpen: boolean;
     onClose: () => void;

package/dist/src/components/WalletModal/components/SuccessModal.js

@@ -1,5 +1,4 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import './SuccessModal.css';
 export function SuccessModal({ isOpen, onClose, txHash, currentChain, theme = 'dark', }) {
     if (!isOpen)
         return null;

package/dist/src/components/WalletModal/components/TokenSelectorModal.css.d.ts

@@ -0,0 +1,2 @@
+declare const cssText: string;
+export default cssText;

package/dist/src/components/WalletModal/components/TokenSelectorModal.css.js

@@ -0,0 +1 @@
+export default "/* Token Selector Modal Styles */\n\n.wallet-modal-token-selector {\n  max-width: 420px;\n  width: 100%;\n  max-height: 85vh;\n  display: flex;\n  flex-direction: column;\n}\n\n.wallet-modal-token-selector-header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 0;\n  border-bottom: 1px solid;\n  gap: 16px;\n}\n\n.wallet-modal-theme-dark .wallet-modal-token-selector-header {\n  border-color: #2a2a2a;\n}\n\n.wallet-modal-theme-light .wallet-modal-token-selector-header {\n  border-color: #e5e7eb;\n}\n\n.wallet-modal-content .wallet-modal-token-selector-title {\n  font-size: 18px;\n  font-weight: 500;\n  margin: 0;\n  flex: 1;\n  text-align: center;\n}\n\n.wallet-modal-content.wallet-modal-theme-dark .wallet-modal-token-selector-title {\n  color: #ffffff;\n}\n\n.wallet-modal-content.wallet-modal-theme-light .wallet-modal-token-selector-title {\n  color: #111827;\n}\n\n.wallet-modal-token-selector-search {\n  position: relative;\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  border-bottom: 1px solid;\n}\n\n.wallet-modal-theme-dark .wallet-modal-token-selector-search {\n  border-color: #2a2a2a;\n}\n\n.wallet-modal-theme-light .wallet-modal-token-selector-search {\n  border-color: #e5e7eb;\n}\n\n.wallet-modal-token-selector-search-icon {\n  flex-shrink: 0;\n  opacity: 0.5;\n}\n\n.wallet-modal-theme-dark .wallet-modal-token-selector-search-icon {\n  color: #9ca3af;\n}\n\n.wallet-modal-theme-light .wallet-modal-token-selector-search-icon {\n  color: #6b7280;\n}\n\n.wallet-modal-token-selector-search-input {\n  flex: 1;\n  border: none;\n  background: transparent;\n  outline: none;\n  font-size: 14px;\n  padding: 8px 0;\n}\n\n.wallet-modal-theme-dark .wallet-modal-token-selector-search-input {\n  color: #ffffff;\n}\n\n.wallet-modal-theme-light .wallet-modal-token-selector-search-input {\n  color: #111827;\n}\n\n.wallet-modal-token-selector-search-input::placeholder {\n  opacity: 0.5;\n}\n\n.wallet-modal-theme-dark .wallet-modal-token-selector-search-input::placeholder {\n  color: #9ca3af;\n}\n\n.wallet-modal-theme-light .wallet-modal-token-selector-search-input::placeholder {\n  color: #6b7280;\n}\n\n.wallet-modal-token-selector-list {\n  flex: 1;\n  overflow-y: auto;\n  padding: 8px 0;\n}\n\n.wallet-modal-token-selector-empty {\n  padding: 40px 0;\n  text-align: center;\n  opacity: 0.6;\n}\n\n.wallet-modal-theme-dark .wallet-modal-token-selector-empty {\n  color: #9ca3af;\n}\n\n.wallet-modal-theme-light .wallet-modal-token-selector-empty {\n  color: #6b7280;\n}\n\n.wallet-modal-token-selector-item {\n  width: 100%;\n  padding: 12px 0;\n  background: transparent;\n  border: none;\n  cursor: pointer;\n  transition: all 0.2s;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 12px;\n  text-align: left;\n}\n\n.wallet-modal-theme-dark .wallet-modal-token-selector-item {\n  color: #ffffff;\n}\n\n.wallet-modal-theme-light .wallet-modal-token-selector-item {\n  color: #111827;\n}\n\n.wallet-modal-theme-dark .wallet-modal-token-selector-item:hover {\n  background: rgba(255, 255, 255, 0.05);\n}\n\n.wallet-modal-theme-light .wallet-modal-token-selector-item:hover {\n  background: rgba(0, 0, 0, 0.03);\n}\n\n.wallet-modal-token-selector-item.selected {\n  background: rgba(147, 51, 234, 0.1);\n}\n\n.wallet-modal-token-selector-item-info {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  flex: 1;\n  min-width: 0;\n}\n\n.wallet-modal-token-selector-item-icon {\n  width: 40px;\n  height: 40px;\n  flex-shrink: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.wallet-modal-token-selector-item-icon-img {\n  width: 100%;\n  height: 100%;\n  border-radius: 50%;\n  object-fit: cover;\n}\n\n.wallet-modal-token-selector-item-icon-placeholder {\n  width: 100%;\n  height: 100%;\n  border-radius: 50%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-weight: 700;\n  font-size: 16px;\n  text-transform: uppercase;\n}\n\n.wallet-modal-theme-dark .wallet-modal-token-selector-item-icon-placeholder {\n  background: #2a2a2a;\n  color: #9ca3af;\n}\n\n.wallet-modal-theme-light .wallet-modal-token-selector-item-icon-placeholder {\n  background: #f1f5f9;\n  color: #64748b;\n}\n\n.wallet-modal-token-selector-item-details {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n  flex: 1;\n  min-width: 0;\n}\n\n.wallet-modal-token-selector-item-name {\n  font-size: 15px;\n  font-weight: 600;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.wallet-modal-theme-dark .wallet-modal-token-selector-item-name {\n  color: #ffffff;\n}\n\n.wallet-modal-theme-light .wallet-modal-token-selector-item-name {\n  color: #111827;\n}\n\n.wallet-modal-token-selector-item-balance {\n  font-size: 13px;\n  opacity: 0.7;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.wallet-modal-theme-dark .wallet-modal-token-selector-item-balance {\n  color: #9ca3af;\n}\n\n.wallet-modal-theme-light .wallet-modal-token-selector-item-balance {\n  color: #6b7280;\n}\n";

package/dist/src/components/WalletModal/components/TokenSelectorModal.d.ts

@@ -1,5 +1,4 @@
 import type { ChainData } from "../../../chains";
-import "./TokenSelectorModal.css";
 export interface TokenData {
     address: string;
     symbol: string;

package/dist/src/components/WalletModal/components/TokenSelectorModal.js

@@ -3,7 +3,6 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  * Token Selector Modal Component
  */
 import { useState, useEffect, useMemo } from "react";
-import "./TokenSelectorModal.css";
 export function TokenSelectorModal({ isOpen, onClose, onTokenSelect, tokens, selectedToken, theme = "dark", }) {
     const [searchQuery, setSearchQuery] = useState("");
     // Reset state when opened

package/dist/src/components/WalletModal/components/UserAvatar.js

@@ -1,4 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { GoogleIcon } from '../../icons';
 export function UserAvatar({ user, isExternalWalletConnected }) {
     const authProvider = (user?.authProvider || '').toLowerCase();
     // External wallet
@@ -7,7 +8,7 @@ export function UserAvatar({ user, isExternalWalletConnected }) {
     }
     // Google
     if (authProvider === 'google') {
-        return (_jsxs("svg", { width: "32", height: "32", viewBox: "0 0 24 24", fill: "none", children: [_jsx("path", { d: "M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92c-.26 1.37-1.04 2.53-2.21 3.31v2.77h3.57c2.08-1.92 3.28-4.74 3.28-8.09z", fill: "#4285F4" }), _jsx("path", { d: "M12 23c2.97 0 5.46-.98 7.28-2.66l-3.57-2.77c-.98.66-2.23 1.06-3.71 1.06-2.86 0-5.29-1.93-6.16-4.53H2.18v2.84C3.99 20.53 7.7 23 12 23z", fill: "#34A853" }), _jsx("path", { d: "M5.84 14.09c-.22-.66-.35-1.36-.35-2.09s.13-1.43.35-2.09V7.07H2.18C1.43 8.55 1 10.22 1 12s.43 3.45 1.18 4.93l2.85-2.22.81-.62z", fill: "#FBBC05" }), _jsx("path", { d: "M12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.07l3.66 2.84c.87-2.6 3.3-4.53 6.16-4.53z", fill: "#EA4335" })] }));
+        return _jsx(GoogleIcon, { size: 32 });
     }
     // Discord
     if (authProvider === 'discord') {

package/dist/src/components/WalletModal/components/index.d.ts

@@ -11,6 +11,8 @@ export { ExportWarningModal } from './ExportWarningModal';
 export { ExportKeyModal } from './ExportKeyModal';
 export { UserAvatar } from './UserAvatar';
 export { TokenSelectorModal } from './TokenSelectorModal';
+export { MfaVerifyModal } from './MfaVerifyModal';
+export { SignMfaModalHost } from './SignMfaModalHost';
 export type { ChainSelectorProps } from './ChainSelector';
 export type { SendModalProps } from './SendModal';
 export type { ReceiveModalProps } from './ReceiveModal';
@@ -21,3 +23,4 @@ export type { ExportWarningModalProps } from './ExportWarningModal';
 export type { ExportKeyModalProps } from './ExportKeyModal';
 export type { UserAvatarProps } from './UserAvatar';
 export type { TokenSelectorModalProps, TokenData } from './TokenSelectorModal';
+export type { MfaVerifyModalProps } from './MfaVerifyModal';

package/dist/src/components/WalletModal/components/index.js

@@ -11,4 +11,6 @@ export { ExportWarningModal } from './ExportWarningModal';
 export { ExportKeyModal } from './ExportKeyModal';
 export { UserAvatar } from './UserAvatar';
 export { TokenSelectorModal } from './TokenSelectorModal';
+export { MfaVerifyModal } from './MfaVerifyModal';
+export { SignMfaModalHost } from './SignMfaModalHost';
 //# sourceMappingURL=index.js.map

package/dist/src/components/WalletModal/hooks/useSendTransaction.js

@@ -88,18 +88,30 @@ export function useSendTransaction({ sendTransaction, currentChain, fromAddress,
                 value: valueWei,
             });
             const gasFees = await getGasPrice();
+            // Prefer legacy gasPrice when available. Ethermint/Cosmos EVM chains
+            // (e.g. BlockMaze) often advertise low EIP-1559 tips that fail the
+            // node's minimum-global-fee check, while eth_gasPrice matches the floor.
+            // Passing both fee styles makes viem serialize EIP-1559 and ignore gasPrice.
+            const gas = gasFees.gasPrice !== undefined
+                ? { gasLimit, gasPrice: gasFees.gasPrice }
+                : gasFees.maxFeePerGas !== undefined &&
+                    gasFees.maxPriorityFeePerGas !== undefined
+                    ? {
+                        gasLimit,
+                        maxFeePerGas: gasFees.maxFeePerGas,
+                        maxPriorityFeePerGas: gasFees.maxPriorityFeePerGas,
+                    }
+                    : null;
+            if (!gas) {
+                throw new Error('Unable to determine gas price from the network');
+            }
             const result = await signAndSendTxn({
                 from: fromAddress,
                 to: recipientAddress,
                 value: valueWei,
                 data: '0x',
                 chainId: currentChain.id,
-                gas: {
-                    gasLimit: gasLimit,
-                    maxFeePerGas: gasFees.maxFeePerGas,
-                    maxPriorityFeePerGas: gasFees.maxPriorityFeePerGas,
-                    gasPrice: gasFees.gasPrice,
-                },
+                gas,
             });
             setTxHash(result.hash);
             onSuccess?.(result.hash);

package/dist/src/components/icons.d.ts

@@ -20,4 +20,6 @@ export declare function FiMail(props: IconProps): React.ReactElement<unknown, st
 export declare function FiLink(props: IconProps): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;
 export declare function FiInfo(props: IconProps): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;
 export declare function BiShieldQuarter(props: IconProps): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;
+export declare function CloseIcon(props: IconProps): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;
+export declare function GoogleIcon(props: IconProps): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;
 export {};

package/dist/src/components/icons.js

@@ -32,4 +32,8 @@ export function FiMail(props) { return GenIcon({ "tag": "svg", "attr": { "viewBo
 export function FiLink(props) { return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 24 24", "fill": "none", "stroke": "currentColor", "strokeWidth": "2", "strokeLinecap": "round", "strokeLinejoin": "round" }, "child": [{ "tag": "path", "attr": { "d": "M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71" }, "child": [] }, { "tag": "path", "attr": { "d": "M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71" }, "child": [] }] })(props); }
 export function FiInfo(props) { return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 24 24", "fill": "none", "stroke": "currentColor", "strokeWidth": "2", "strokeLinecap": "round", "strokeLinejoin": "round" }, "child": [{ "tag": "circle", "attr": { "cx": "12", "cy": "12", "r": "10" }, "child": [] }, { "tag": "line", "attr": { "x1": "12", "y1": "16", "x2": "12", "y2": "12" }, "child": [] }, { "tag": "line", "attr": { "x1": "12", "y1": "8", "x2": "12.01", "y2": "8" }, "child": [] }] })(props); }
 export function BiShieldQuarter(props) { return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 24 24" }, "child": [{ "tag": "path", "attr": { "d": "M20.995 6.9a.998.998 0 0 0-.548-.795l-8-4a1 1 0 0 0-.895 0l-8 4a1.002 1.002 0 0 0-.547.795c-.011.107-.961 10.767 8.589 15.014a.987.987 0 0 0 .812 0c9.55-4.247 8.6-14.906 8.589-15.014zM12 19.897V12H5.51a15.473 15.473 0 0 1-.544-4.365L12 4.118V12h6.46c-.759 2.74-2.498 5.979-6.46 7.897z" }, "child": [] }] })(props); }
+// Shared close icon: matches the stroke-based X already used by SendModal/ReceiveModal/ExportKeyModal/ExportWarningModal/WalletModal.tsx/Modal.tsx
+export function CloseIcon(props) { return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 24 24", "fill": "none", "stroke": "currentColor", "strokeWidth": "2", "strokeLinecap": "round", "strokeLinejoin": "round" }, "child": [{ "tag": "path", "attr": { "d": "M18 6L6 18M6 6L18 18" }, "child": [] }] })(props); }
+// Shared Google icon: matches the 24x24 4-path logo already used by SocialButtons.tsx/UserAvatar.tsx
+export function GoogleIcon(props) { return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 24 24", "fill": "currentColor" }, "child": [{ "tag": "path", "attr": { "fill": "#4285F4", "d": "M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92c-.26 1.37-1.04 2.53-2.21 3.31v2.77h3.57c2.08-1.92 3.28-4.74 3.28-8.09z" }, "child": [] }, { "tag": "path", "attr": { "fill": "#34A853", "d": "M12 23c2.97 0 5.46-.98 7.28-2.66l-3.57-2.77c-.98.66-2.23 1.06-3.71 1.06-2.86 0-5.29-1.93-6.16-4.53H2.18v2.84C3.99 20.53 7.7 23 12 23z" }, "child": [] }, { "tag": "path", "attr": { "fill": "#FBBC05", "d": "M5.84 14.09c-.22-.66-.35-1.36-.35-2.09s.13-1.43.35-2.09V7.07H2.18C1.43 8.55 1 10.22 1 12s.43 3.45 1.18 4.93l2.85-2.22.81-.62z" }, "child": [] }, { "tag": "path", "attr": { "fill": "#EA4335", "d": "M12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.07l3.66 2.84c.87-2.6 3.3-4.53 6.16-4.53z" }, "child": [] }] })(props); }
 //# sourceMappingURL=icons.js.map