@b3dotfun/sdk 0.0.74-alpha.1 → 0.0.75-alpha.1

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.
Files changed (57) hide show
  1. package/dist/cjs/anyspend/react/components/AnySpend.js +1 -1
  2. package/dist/cjs/global-account/react/components/AvatarEditor/AvatarEditor.js +4 -4
  3. package/dist/cjs/global-account/react/components/ManageAccount/Header.js +2 -2
  4. package/dist/cjs/global-account/react/components/ManageAccount/NotificationChannel.js +1 -1
  5. package/dist/cjs/global-account/react/components/ManageAccount/NotificationsContent.js +1 -1
  6. package/dist/cjs/global-account/react/components/ManageAccount/SettingsContent.js +1 -1
  7. package/dist/cjs/global-account/react/components/ManageAccount/SettingsMenuItem.js +1 -1
  8. package/dist/cjs/global-account/react/components/ManageAccount/SettingsProfileCard.js +2 -2
  9. package/dist/cjs/global-account/react/components/ManageAccount/channels/DiscordChannel.js +9 -3
  10. package/dist/cjs/global-account/react/components/ManageAccount/channels/EmailChannel.js +1 -1
  11. package/dist/cjs/global-account/react/components/ManageAccount/channels/PhoneChannel.js +2 -2
  12. package/dist/cjs/global-account/react/components/ManageAccount/channels/TelegramChannel.js +1 -1
  13. package/dist/cjs/global-account/react/components/ModalHeader/ModalHeader.js +1 -1
  14. package/dist/cjs/global-account/react/components/Send/Send.js +2 -2
  15. package/dist/cjs/global-account/react/hooks/index.d.ts +1 -1
  16. package/dist/cjs/global-account/react/hooks/index.js +2 -1
  17. package/dist/cjs/global-account/react/hooks/useSimBalance.d.ts +28 -0
  18. package/dist/cjs/global-account/react/hooks/useSimBalance.js +38 -2
  19. package/dist/esm/anyspend/react/components/AnySpend.js +1 -1
  20. package/dist/esm/global-account/react/components/AvatarEditor/AvatarEditor.js +4 -4
  21. package/dist/esm/global-account/react/components/ManageAccount/Header.js +2 -2
  22. package/dist/esm/global-account/react/components/ManageAccount/NotificationChannel.js +1 -1
  23. package/dist/esm/global-account/react/components/ManageAccount/NotificationsContent.js +1 -1
  24. package/dist/esm/global-account/react/components/ManageAccount/SettingsContent.js +1 -1
  25. package/dist/esm/global-account/react/components/ManageAccount/SettingsMenuItem.js +1 -1
  26. package/dist/esm/global-account/react/components/ManageAccount/SettingsProfileCard.js +2 -2
  27. package/dist/esm/global-account/react/components/ManageAccount/channels/DiscordChannel.js +9 -3
  28. package/dist/esm/global-account/react/components/ManageAccount/channels/EmailChannel.js +1 -1
  29. package/dist/esm/global-account/react/components/ManageAccount/channels/PhoneChannel.js +2 -2
  30. package/dist/esm/global-account/react/components/ManageAccount/channels/TelegramChannel.js +1 -1
  31. package/dist/esm/global-account/react/components/ModalHeader/ModalHeader.js +1 -1
  32. package/dist/esm/global-account/react/components/Send/Send.js +2 -2
  33. package/dist/esm/global-account/react/hooks/index.d.ts +1 -1
  34. package/dist/esm/global-account/react/hooks/index.js +1 -1
  35. package/dist/esm/global-account/react/hooks/useSimBalance.d.ts +28 -0
  36. package/dist/esm/global-account/react/hooks/useSimBalance.js +37 -2
  37. package/dist/styles/index.css +1 -1
  38. package/dist/types/global-account/react/hooks/index.d.ts +1 -1
  39. package/dist/types/global-account/react/hooks/useSimBalance.d.ts +28 -0
  40. package/package.json +1 -1
  41. package/src/anyspend/react/components/AnySpend.tsx +1 -1
  42. package/src/global-account/react/components/AvatarEditor/AvatarEditor.tsx +9 -7
  43. package/src/global-account/react/components/ManageAccount/Header.tsx +2 -2
  44. package/src/global-account/react/components/ManageAccount/NotificationChannel.tsx +8 -6
  45. package/src/global-account/react/components/ManageAccount/NotificationsContent.tsx +1 -1
  46. package/src/global-account/react/components/ManageAccount/SettingsContent.tsx +1 -1
  47. package/src/global-account/react/components/ManageAccount/SettingsMenuItem.tsx +5 -5
  48. package/src/global-account/react/components/ManageAccount/SettingsProfileCard.tsx +3 -3
  49. package/src/global-account/react/components/ManageAccount/channels/DiscordChannel.tsx +25 -2
  50. package/src/global-account/react/components/ManageAccount/channels/EmailChannel.tsx +1 -1
  51. package/src/global-account/react/components/ManageAccount/channels/PhoneChannel.tsx +4 -4
  52. package/src/global-account/react/components/ManageAccount/channels/TelegramChannel.tsx +2 -2
  53. package/src/global-account/react/components/ModalHeader/ModalHeader.tsx +3 -3
  54. package/src/global-account/react/components/Send/Send.tsx +35 -27
  55. package/src/global-account/react/hooks/index.ts +1 -1
  56. package/src/global-account/react/hooks/useSimBalance.ts +72 -2
  57. package/src/styles/index.css +25 -0
@@ -315,7 +315,7 @@ export function AvatarEditor({ onSetAvatar, className }) {
315
315
  };
316
316
  })
317
317
  .filter(p => p.avatar !== null) || []; // Filter out profiles with invalid avatars
318
- return (_jsxs("div", { className: cn("b3-modal-avatar-editor flex w-full max-w-md flex-col bg-white", className), children: [viewStep === "upload" && _jsx(ModalHeader, { title: "Upload Image" }), _jsxs("div", { className: "flex flex-col items-center p-6", children: [viewStep === "select" ? (_jsxs(_Fragment, { children: [_jsx("div", { className: "relative mb-6", children: _jsx("div", { className: "h-32 w-32 overflow-hidden rounded-full", children: safePreviewUrl || selectedAvatar || currentAvatar ? (_jsx(IPFSMediaRenderer, { src: safePreviewUrl || selectedAvatar || currentAvatar || "", alt: "Avatar preview", className: "h-full w-full object-cover" })) : (_jsx("div", { className: "bg-b3-primary-wash h-full w-full" })) }) }), _jsxs("button", { onClick: handleUploadImageClick, className: "font-inter mb-6 flex w-full items-center justify-center gap-2 rounded-xl border border-[#e4e4e7] bg-white px-4 py-3 text-sm font-semibold text-[#18181b] shadow-sm transition-colors hover:bg-[#f4f4f5]", children: [_jsx(Upload, { className: "h-4 w-4" }), "Upload image"] }), _jsxs("div", { className: "w-full", children: [_jsx("h3", { className: "mb-2 text-base font-semibold text-[#18181b]", children: "Select your profile image" }), _jsx("p", { className: "mb-4 text-sm font-semibold text-[#475467]", children: "Pick an avatar from your linked profiles, ENS or upload a new one." }), _jsx("div", { className: "mb-4 flex gap-3", children: profileAvatars.map((profileAvatar, index) => {
318
+ return (_jsxs("div", { className: cn("b3-modal-avatar-editor dark:bg-b3-background flex w-full max-w-md flex-col bg-white", className), children: [viewStep === "upload" && _jsx(ModalHeader, { title: "Upload Image" }), _jsxs("div", { className: "flex flex-col items-center p-6", children: [viewStep === "select" ? (_jsxs(_Fragment, { children: [_jsx("div", { className: "relative mb-6", children: _jsx("div", { className: "h-32 w-32 overflow-hidden rounded-full", children: safePreviewUrl || selectedAvatar || currentAvatar ? (_jsx(IPFSMediaRenderer, { src: safePreviewUrl || selectedAvatar || currentAvatar || "", alt: "Avatar preview", className: "h-full w-full object-cover" })) : (_jsx("div", { className: "bg-b3-primary-wash h-full w-full" })) }) }), _jsxs("button", { onClick: handleUploadImageClick, className: "font-inter dark:border-b3-line dark:bg-b3-react-primary mb-6 flex w-full items-center justify-center gap-2 rounded-xl border border-[#e4e4e7] bg-white px-4 py-3 text-sm font-semibold text-[#18181b] shadow-sm transition-colors hover:bg-[#f4f4f5] dark:text-white", children: [_jsx(Upload, { className: "h-4 w-4" }), "Upload image"] }), _jsxs("div", { className: "w-full", children: [_jsx("h3", { className: "mb-2 text-base font-semibold text-[#18181b]", children: "Select your profile image" }), _jsx("p", { className: "mb-4 text-sm font-semibold text-[#475467]", children: "Pick an avatar from your linked profiles, ENS or upload a new one." }), _jsx("div", { className: "mb-4 flex gap-3", children: profileAvatars.map((profileAvatar, index) => {
319
319
  // Skip if avatar is null (should not happen due to filter, but TypeScript doesn't know that)
320
320
  if (!profileAvatar.avatar)
321
321
  return null;
@@ -323,8 +323,8 @@ export function AvatarEditor({ onSetAvatar, className }) {
323
323
  ? "border-[#3368ef] ring-2 ring-[#3368ef]/20"
324
324
  : "border-transparent hover:border-[#e4e4e7]"), children: _jsx(IPFSMediaRenderer, { src: profileAvatar.avatar || "", alt: `${profileAvatar.type} avatar`, className: "h-full w-full object-cover" }) }), hoveredProfile === profileAvatar.type && (_jsx("div", { className: "absolute -top-10 left-1/2 -translate-x-1/2 whitespace-nowrap rounded-md bg-[#18181b] px-3 py-1.5 text-xs text-white", children: profileAvatar.name }))] }, profileAvatar.type + "-" + index));
325
325
  }) }), _jsxs("button", { onClick: handleLinkMoreAccount, className: "b3-modal-link-more-account font-inter flex items-center gap-2 text-sm font-semibold text-[#3368ef] hover:underline", children: [_jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: "h-4 w-4", children: _jsx("path", { d: "M8.75 2.75C8.75 2.33579 8.41421 2 8 2C7.58579 2 7.25 2.33579 7.25 2.75V7.25H2.75C2.33579 7.25 2 7.58579 2 8C2 8.41421 2.33579 8.75 2.75 8.75H7.25V13.25C7.25 13.6642 7.58579 14 8 14C8.41421 14 8.75 13.6642 8.75 13.25V8.75H13.25C13.6642 8.75 14 8.41421 14 8C14 7.58579 13.6642 7.25 13.25 7.25H8.75V2.75Z", fill: "currentColor" }) }), "Link more accounts"] })] })] })) : (_jsx(_Fragment, { children: !selectedFile && !previewUrl ? (_jsxs("div", { onClick: handleOpenFilePicker, onDragEnter: handleDragEnter, onDragLeave: handleDragLeave, onDragOver: handleDragOver, onDrop: handleDrop, className: cn("b3-modal-upload-view mb-6 flex w-full cursor-pointer flex-col items-center justify-center rounded-xl border-2 border-dashed p-16 transition-colors", isDragging
326
- ? "border-[#3368ef] bg-[#f0f5ff]"
327
- : "border-[#e4e4e7] hover:border-[#3368ef] hover:bg-[#f0f5ff]"), children: [_jsxs("p", { className: "font-inter mb-1 text-sm", children: [_jsx("span", { className: "font-semibold text-[#3368ef]", children: "Click to upload" }), _jsx("span", { className: "text-[#71717a]", children: " or drag and drop" })] }), _jsx("p", { className: "text-xs text-[#71717a]", children: "PNG, JPG or GIF (up to 5MB)" })] })) : (_jsxs("div", { className: "mb-6 w-full", children: [_jsx("div", { className: "relative aspect-square w-full overflow-hidden rounded-xl bg-[#f4f4f5]", children: safePreviewUrl ? (_jsxs(_Fragment, { children: [_jsx(Cropper, { image: safePreviewUrl, crop: crop, zoom: zoom, aspect: 1, onCropChange: setCrop, onCropComplete: onCropComplete, onZoomChange: setZoom, cropShape: "rect", showGrid: false, style: {
326
+ ? "dark:border-b3-line dark:bg-b3-react-primary border-[#3368ef] bg-[#f0f5ff]"
327
+ : "dark:border-b3-line dark:bg-b3-background border-[#e4e4e7] hover:border-[#3368ef] hover:bg-[#f0f5ff]"), children: [_jsxs("p", { className: "font-inter mb-1 text-sm", children: [_jsx("span", { className: "font-semibold text-[#3368ef] dark:text-white", children: "Click to upload" }), _jsx("span", { className: "text-[#71717a]", children: " or drag and drop" })] }), _jsx("p", { className: "text-xs text-[#71717a] dark:text-white", children: "PNG, JPG or GIF (up to 5MB)" })] })) : (_jsxs("div", { className: "mb-6 w-full", children: [_jsx("div", { className: "relative aspect-square w-full overflow-hidden rounded-xl bg-[#f4f4f5]", children: safePreviewUrl ? (_jsxs(_Fragment, { children: [_jsx(Cropper, { image: safePreviewUrl, crop: crop, zoom: zoom, aspect: 1, onCropChange: setCrop, onCropComplete: onCropComplete, onZoomChange: setZoom, cropShape: "rect", showGrid: false, style: {
328
328
  containerStyle: {
329
329
  width: "100%",
330
330
  height: "100%",
@@ -334,5 +334,5 @@ export function AvatarEditor({ onSetAvatar, className }) {
334
334
  border: "2px solid #3368ef",
335
335
  borderRadius: "0px",
336
336
  },
337
- } }), _jsx("button", { onClick: handleRemovePreview, className: "absolute right-4 top-4 z-10 flex h-8 w-8 items-center justify-center rounded-full bg-[#51525c] text-white transition-colors hover:bg-[#71717a]", children: _jsx(X, { className: "h-4 w-4" }) })] })) : (_jsx("div", { className: "bg-b3-primary-wash h-full w-full" })) }), safePreviewUrl && (_jsxs("div", { className: "mt-4 flex items-center gap-3", children: [_jsx("label", { className: "shrink-0 text-sm font-semibold text-[#475467]", children: "Zoom" }), _jsx("input", { type: "range", min: 1, max: 3, step: 0.1, value: zoom, onChange: e => setZoom(Number(e.target.value)), className: "flex-1 accent-[#3368ef]" })] }))] })) })), _jsx("input", { ref: fileInputRef, type: "file", accept: "image/*", onChange: handleFileSelect, className: "hidden" })] }), _jsxs("div", { className: "font-inter flex gap-3 border-t border-[#e4e4e7] p-6 font-semibold", children: [_jsx(Button, { onClick: handleCancel, variant: "outline", disabled: isLoading, className: "flex-1 rounded-xl border-[#e4e4e7] text-[#18181b] hover:bg-[#f4f4f5]", children: "Cancel" }), _jsx(Button, { onClick: handleSaveChanges, disabled: isLoading || (!selectedFile && !selectedProfileType), className: "b3-modal-save-button flex-1 rounded-xl bg-[#3368ef] text-white hover:bg-[#2952cc]", children: isLoading ? (_jsxs(_Fragment, { children: [_jsx(Loader2, { className: "mr-2 h-4 w-4 animate-spin" }), "Saving..."] })) : ("Save changes") })] })] }));
337
+ } }), _jsx("button", { onClick: handleRemovePreview, className: "absolute right-4 top-4 z-10 flex h-8 w-8 items-center justify-center rounded-full bg-[#51525c] text-white transition-colors hover:bg-[#71717a]", children: _jsx(X, { className: "h-4 w-4" }) })] })) : (_jsx("div", { className: "bg-b3-primary-wash h-full w-full" })) }), safePreviewUrl && (_jsxs("div", { className: "mt-4 flex items-center gap-3", children: [_jsx("label", { className: "shrink-0 text-sm font-semibold text-[#475467]", children: "Zoom" }), _jsx("input", { type: "range", min: 1, max: 3, step: 0.1, value: zoom, onChange: e => setZoom(Number(e.target.value)), className: "flex-1 accent-[#3368ef]" })] }))] })) })), _jsx("input", { ref: fileInputRef, type: "file", accept: "image/*", onChange: handleFileSelect, className: "hidden" })] }), _jsxs("div", { className: "font-inter flex gap-3 border-t border-[#e4e4e7] p-6 font-semibold", children: [_jsx(Button, { onClick: handleCancel, variant: "outline", disabled: isLoading, className: "dark:border-b3-line dark:bg-b3-background flex-1 rounded-xl border-[#e4e4e7] text-[#18181b] hover:bg-[#f4f4f5] dark:text-white", children: "Cancel" }), _jsx(Button, { onClick: handleSaveChanges, disabled: isLoading || (!selectedFile && !selectedProfileType), className: "b3-modal-save-button flex-1 rounded-xl bg-[#3368ef] text-white hover:bg-[#2952cc]", children: isLoading ? (_jsxs(_Fragment, { children: [_jsx(Loader2, { className: "mr-2 h-4 w-4 animate-spin" }), "Saving..."] })) : ("Save changes") })] })] }));
338
338
  }
@@ -37,7 +37,7 @@ function WalletItem({ wallet, isActive, onClick }) {
37
37
  : isGlobalAccount
38
38
  ? "Smart Wallet"
39
39
  : "Wallet";
40
- return (_jsxs("div", { className: `b3-modal-wallet-item ${isActive ? "b3-modal-wallet-item-active bg-[#F4F4F5]" : "hover:bg-b3-line/50"} box-border flex cursor-pointer items-center gap-2 rounded-xl px-3 py-2 transition-colors`, onClick: onClick, children: [_jsx("div", { className: "relative size-10 shrink-0 text-clip rounded-full", children: isGlobalAccount ? (_jsx("div", { className: "flex size-full items-center justify-center p-1", children: _jsx("img", { src: "https://cdn.b3.fun/b3_logo.svg", alt: "B3", className: "size-full object-contain" }) })) : walletImage ? (_jsx("img", { src: walletImage, alt: walletName, className: "size-full object-contain p-1" })) : (_jsx("div", { className: "flex size-full items-center justify-center", children: _jsx(WalletIcon, {}) })) }), _jsxs("div", { className: "flex min-w-0 flex-1 flex-col gap-1", children: [_jsx("p", { className: "text-b3-grey font-neue-montreal-semibold truncate text-sm", children: walletName }), _jsx("p", { className: "text-b3-foreground-muted font-neue-montreal-medium text-sm", children: centerTruncate(address, 4) })] }), isActive && (_jsx("div", { className: "shrink-0", children: _jsx(CheckIcon, {}) }))] }));
40
+ return (_jsxs("div", { className: `b3-modal-wallet-item ${isActive ? "b3-modal-wallet-item-active dark:bg-b3-line bg-[#F4F4F5]" : "hover:bg-b3-line/50"} box-border flex cursor-pointer items-center gap-2 rounded-xl px-3 py-2 transition-colors`, onClick: onClick, children: [_jsx("div", { className: "relative size-10 shrink-0 text-clip rounded-full", children: isGlobalAccount ? (_jsx("div", { className: "flex size-full items-center justify-center p-1", children: _jsx("img", { src: "https://cdn.b3.fun/b3_logo.svg", alt: "B3", className: "size-full object-contain" }) })) : walletImage ? (_jsx("img", { src: walletImage, alt: walletName, className: "size-full object-contain p-1" })) : (_jsx("div", { className: "flex size-full items-center justify-center", children: _jsx(WalletIcon, {}) })) }), _jsxs("div", { className: "flex min-w-0 flex-1 flex-col gap-1", children: [_jsx("p", { className: "text-b3-grey font-neue-montreal-semibold truncate text-sm", children: walletName }), _jsx("p", { className: "text-b3-foreground-muted font-neue-montreal-medium text-sm", children: centerTruncate(address, 4) })] }), isActive && (_jsx("div", { className: "shrink-0", children: _jsx(CheckIcon, {}) }))] }));
41
41
  }
42
42
  export function Header({ onLogout }) {
43
43
  const activeWallet = useActiveWallet();
@@ -75,7 +75,7 @@ export function Header({ onLogout }) {
75
75
  },
76
76
  });
77
77
  };
78
- return (_jsx(AccordionPrimitive.Root, { type: "single", collapsible: true, value: isExpanded ? "wallet-switcher" : "", className: "b3-modal-wallet-switcher bg-b3-background border-b3-line relative border-b", onValueChange: (value) => setIsExpanded(value === "wallet-switcher"), children: _jsxs(AccordionPrimitive.Item, { value: "wallet-switcher", className: "border-none", children: [_jsxs(AccordionPrimitive.Trigger, { className: "b3-modal-wallet-switcher-trigger group flex w-full items-center justify-between border-none bg-transparent px-5 py-3 outline-none", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("div", { className: "relative size-10 shrink-0 text-clip rounded-full", children: isActiveGlobalAccount ? (_jsx("div", { className: "flex size-full items-center justify-center p-1", children: _jsx("img", { src: "https://cdn.b3.fun/b3_logo.svg", alt: "B3", className: "size-full object-contain" }) })) : activeWalletImage ? (_jsx("img", { src: activeWalletImage, alt: "Active Wallet", className: "size-full object-contain p-1" })) : (_jsx("div", { className: "flex size-full items-center justify-center", children: _jsx(WalletIcon, {}) })) }), _jsxs("div", { className: "flex flex-col gap-0.5", children: [_jsx("p", { className: "text-b3-grey font-neue-montreal-semibold text-left text-sm", children: "Active Wallet" }), _jsxs("div", { className: "flex items-center gap-1", children: [_jsx("p", { className: "text-b3-foreground-muted font-neue-montreal-medium text-sm", children: centerTruncate(address, 4) }), _jsx(CopyToClipboard, { text: address })] })] })] }), _jsx(ChevronDownIcon, { className: "b3-modal-wallet-switcher-chevron text-b3-grey transition-transform duration-200 group-data-[state=open]:rotate-180" })] }), _jsx(AnimatePresence, { children: isExpanded && (_jsx(AccordionPrimitive.Content, { forceMount: true, className: "absolute left-0 right-0 top-full z-50 overflow-visible", children: _jsxs(motion.div, { initial: { opacity: 0, y: -10 }, animate: { opacity: 1, y: 0 }, exit: { opacity: 0, y: -10 }, transition: { duration: 0.2, ease: "easeInOut" }, className: "b3-modal-wallet-switcher-content flex flex-col gap-3 rounded-bl-3xl rounded-br-3xl bg-white px-2 pb-5 pt-3 shadow-[0px_32px_64px_-12px_rgba(10,13,18,0.14),0px_5px_5px_-2.5px_rgba(10,13,18,0.04)]", children: [_jsxs("div", { className: "flex flex-col gap-3", children: [connectedWallets.map(wallet => (_jsx(WalletItem, { wallet: wallet, isActive: activeWallet?.id === wallet.id, onClick: () => handleWalletSwitch(wallet) }, wallet.id))), _jsxs("div", { className: "b3-modal-link-another-wallet hover:bg-b3-line/50 box-border flex cursor-pointer items-center gap-2 rounded-xl px-3 py-2 transition-colors", onClick: handleLinkWallet, children: [_jsx("div", { className: "bg-b3-line flex size-10 shrink-0 items-center justify-center rounded-full", children: _jsx(LinkIcon, { className: "text-b3-grey" }) }), _jsx("div", { className: "flex flex-1 flex-col", children: _jsx("p", { className: "text-b3-grey font-neue-montreal-semibold text-sm", children: "Link another wallet" }) })] })] }), _jsxs("button", { className: "b3-modal-sign-out-button border-b3-line hover:bg-b3-line bg-b3-background flex items-center justify-center gap-1.5 rounded-xl border border-solid p-2.5 transition-colors", onClick: onLogoutEnhanced, disabled: logoutLoading, style: {
78
+ return (_jsx(AccordionPrimitive.Root, { type: "single", collapsible: true, value: isExpanded ? "wallet-switcher" : "", className: "b3-modal-wallet-switcher bg-b3-background border-b3-line relative border-b", onValueChange: (value) => setIsExpanded(value === "wallet-switcher"), children: _jsxs(AccordionPrimitive.Item, { value: "wallet-switcher", className: "border-none", children: [_jsxs(AccordionPrimitive.Trigger, { className: "b3-modal-wallet-switcher-trigger group flex w-full items-center justify-between border-none bg-transparent px-5 py-3 outline-none", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("div", { className: "relative size-10 shrink-0 text-clip rounded-full", children: isActiveGlobalAccount ? (_jsx("div", { className: "flex size-full items-center justify-center p-1", children: _jsx("img", { src: "https://cdn.b3.fun/b3_logo.svg", alt: "B3", className: "size-full object-contain" }) })) : activeWalletImage ? (_jsx("img", { src: activeWalletImage, alt: "Active Wallet", className: "size-full object-contain p-1" })) : (_jsx("div", { className: "flex size-full items-center justify-center", children: _jsx(WalletIcon, {}) })) }), _jsxs("div", { className: "flex flex-col gap-0.5", children: [_jsx("p", { className: "text-b3-grey font-neue-montreal-semibold text-left text-sm", children: "Active Wallet" }), _jsxs("div", { className: "flex items-center gap-1", children: [_jsx("p", { className: "text-b3-foreground-muted font-neue-montreal-medium text-sm", children: centerTruncate(address, 4) }), _jsx(CopyToClipboard, { text: address })] })] })] }), _jsx(ChevronDownIcon, { className: "b3-modal-wallet-switcher-chevron text-b3-grey transition-transform duration-200 group-data-[state=open]:rotate-180" })] }), _jsx(AnimatePresence, { children: isExpanded && (_jsx(AccordionPrimitive.Content, { forceMount: true, className: "absolute left-0 right-0 top-full z-50 overflow-visible", children: _jsxs(motion.div, { initial: { opacity: 0, y: -10 }, animate: { opacity: 1, y: 0 }, exit: { opacity: 0, y: -10 }, transition: { duration: 0.2, ease: "easeInOut" }, className: "b3-modal-wallet-switcher-content dark:bg-b3-background flex flex-col gap-3 rounded-bl-3xl rounded-br-3xl bg-white px-2 pb-5 pt-3 shadow-[0px_32px_64px_-12px_rgba(10,13,18,0.14),0px_5px_5px_-2.5px_rgba(10,13,18,0.04)]", children: [_jsxs("div", { className: "flex flex-col gap-3", children: [connectedWallets.map(wallet => (_jsx(WalletItem, { wallet: wallet, isActive: activeWallet?.id === wallet.id, onClick: () => handleWalletSwitch(wallet) }, wallet.id))), _jsxs("div", { className: "b3-modal-link-another-wallet hover:bg-b3-line/50 box-border flex cursor-pointer items-center gap-2 rounded-xl px-3 py-2 transition-colors", onClick: handleLinkWallet, children: [_jsx("div", { className: "bg-b3-line flex size-10 shrink-0 items-center justify-center rounded-full", children: _jsx(LinkIcon, { className: "text-b3-grey" }) }), _jsx("div", { className: "flex flex-1 flex-col", children: _jsx("p", { className: "text-b3-grey font-neue-montreal-semibold text-sm", children: "Link another wallet" }) })] })] }), _jsxs("button", { className: "b3-modal-sign-out-button border-b3-line hover:bg-b3-line bg-b3-background flex items-center justify-center gap-1.5 rounded-xl border border-solid p-2.5 transition-colors", onClick: onLogoutEnhanced, disabled: logoutLoading, style: {
79
79
  boxShadow: "inset 0px 0px 0px 1px rgba(10,13,18,0.18), inset 0px -2px 0px 0px rgba(10,13,18,0.05)",
80
80
  }, children: [logoutLoading ? (_jsx(Loader2, { className: "animate-spin", size: 20 })) : (_jsx(SignOutIcon, { size: 20, className: "text-b3-grey" })), _jsx("p", { className: "text-b3-grey font-neue-montreal-semibold text-base", children: "Sign out" })] })] }) })) })] }) }));
81
81
  }
@@ -1,7 +1,7 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import { cn } from "../../../../shared/utils/index.js";
3
3
  export const NotificationChannel = ({ icon, title, isConnected, isConnecting, isDisconnecting, connectedInfo, inputSection, addButtonSection, iconClassName, onToggle, showBorder = true, }) => {
4
- return (_jsxs("div", { className: `flex items-start gap-3 p-[15px] ${showBorder ? "border-b border-[#e4e4e7]" : ""}`, children: [_jsx("div", { className: cn("flex h-10 w-10 shrink-0 items-center justify-center", iconClassName), children: icon }), _jsxs("div", { className: "flex-1", children: [_jsx("p", { className: "font-['PP_Neue_Montreal','PP_Neue_Montreal_Fallback',sans-serif] text-[14px] font-semibold leading-[20px] text-[#3f3f46]", children: title }), isConnecting ? (_jsx("div", { className: "mt-1", children: _jsx("p", { className: "font-['PP_Neue_Montreal','PP_Neue_Montreal_Fallback',sans-serif] text-[14px] leading-[20px] text-[#51525c]", children: "Connecting..." }) })) : isDisconnecting ? (_jsx("div", { className: "mt-1", children: _jsx("p", { className: "font-['PP_Neue_Montreal','PP_Neue_Montreal_Fallback',sans-serif] text-[14px] leading-[20px] text-[#51525c]", children: "Disconnecting..." }) })) : isConnected && connectedInfo ? (_jsx("div", { className: "mt-1", children: _jsx("p", { className: "font-['PP_Neue_Montreal','PP_Neue_Montreal_Fallback',sans-serif] text-[14px] leading-[20px] text-[#51525c]", children: connectedInfo }) })) : inputSection ? (inputSection) : (addButtonSection)] }), _jsx(ToggleSwitch, { enabled: isConnected, onChange: onToggle })] }));
4
+ return (_jsxs("div", { className: `b3-modal-notifications-channels-item dark:border-b3-line flex items-start gap-3 p-[15px] ${showBorder ? "border-b border-[#e4e4e7]" : ""}`, children: [_jsx("div", { className: cn("flex h-10 w-10 shrink-0 items-center justify-center", iconClassName), children: icon }), _jsxs("div", { className: "flex-1", children: [_jsx("p", { className: "font-['PP_Neue_Montreal','PP_Neue_Montreal_Fallback',sans-serif] text-[14px] font-semibold leading-[20px] text-[#3f3f46] dark:text-white", children: title }), isConnecting ? (_jsx("div", { className: "mt-1", children: _jsx("p", { className: "font-['PP_Neue_Montreal','PP_Neue_Montreal_Fallback',sans-serif] text-[14px] leading-[20px] text-[#51525c] dark:text-white", children: "Connecting..." }) })) : isDisconnecting ? (_jsx("div", { className: "mt-1", children: _jsx("p", { className: "font-['PP_Neue_Montreal','PP_Neue_Montreal_Fallback',sans-serif] text-[14px] leading-[20px] text-[#51525c] dark:text-white", children: "Disconnecting..." }) })) : isConnected && connectedInfo ? (_jsx("div", { className: "mt-1", children: _jsx("div", { className: "font-['PP_Neue_Montreal','PP_Neue_Montreal_Fallback',sans-serif] text-[14px] leading-[20px] text-[#51525c] dark:text-white", children: connectedInfo }) })) : inputSection ? (inputSection) : (addButtonSection)] }), _jsx(ToggleSwitch, { enabled: isConnected, onChange: onToggle })] }));
5
5
  };
6
6
  // Toggle Switch Component
7
7
  const ToggleSwitch = ({ enabled, onChange, disabled, }) => {
@@ -142,6 +142,6 @@ const NotificationsContent = ({ partnerId, chain, onSuccess }) => {
142
142
  if (loading) {
143
143
  return (_jsxs("div", { className: "flex h-[470px] flex-col", children: [_jsx(ModalHeader, { showBackButton: true, showCloseButton: false, title: "Notifications", handleBack: handleBack }), _jsx("div", { className: "flex flex-1 items-center justify-center", children: _jsx("div", { className: "font-['PP_Neue_Montreal','PP_Neue_Montreal_Fallback',sans-serif] text-[14px] leading-[20px] text-gray-500", children: "Loading..." }) })] }));
144
144
  }
145
- return (_jsxs("div", { className: "flex h-[470px] flex-col", children: [_jsx(ModalHeader, { showBackButton: true, showCloseButton: false, title: "Notifications", handleBack: handleBack }), _jsxs("div", { className: "flex-1 space-y-2 overflow-y-auto px-5 py-6", children: [error && (_jsx("div", { className: "mb-3 rounded-lg bg-red-50 p-3 font-['PP_Neue_Montreal','PP_Neue_Montreal_Fallback',sans-serif] text-[14px] leading-[20px] text-red-600 dark:bg-red-900/20 dark:text-red-400", children: error })), userId && jwtToken && (_jsxs("div", { className: "rounded-[20px] bg-[#f4f4f5]", children: [_jsx(PhoneChannel, { userId: userId, jwtToken: jwtToken, smsChannel: smsChannel, whatsappChannel: whatsappChannel, isSMSConnected: smsConnected, isWhatsAppConnected: whatsappConnected, isOptimisticallySMSConnected: optimisticSMSConnected, isOptimisticallyWhatsAppConnected: optimisticWhatsAppConnected, onConnectionChange: handleConnectionChange, onToggle: (type, shouldDisconnect) => handleToggleChannel(type, shouldDisconnect) }), _jsx(EmailChannel, { userId: userId, jwtToken: jwtToken, emailChannel: emailChannel, isConnected: emailConnected, isOptimisticallyConnected: optimisticEmailConnected, onConnectionChange: handleConnectionChange, onToggle: enabled => handleToggleChannel("email", enabled) }), _jsx(TelegramChannel, { userId: userId, jwtToken: jwtToken, telegramChannel: telegramChannel, isConnected: telegramConnected, isOptimisticallyConnected: optimisticTelegramConnected, onConnectionChange: handleConnectionChange, onToggle: enabled => handleToggleChannel("telegram", enabled) }), _jsx(DiscordChannel, { userId: userId, jwtToken: jwtToken, discordChannel: discordChannel, isConnected: discordConnected, isOptimisticallyConnected: optimisticDiscordConnected, onConnectionChange: handleConnectionChange, onToggle: enabled => handleToggleChannel("discord", enabled) })] })), process.env.NODE_ENV === "development" && hasAnyChannelConnected && (_jsxs("div", { className: "mt-6 rounded-xl border border-[#e4e4e7] bg-white p-4", children: [_jsxs("div", { className: "mb-3 flex items-center gap-2", children: [_jsx("div", { className: "text-lg", children: "\uD83E\uDDEA" }), _jsx("h3", { className: "font-['PP_Neue_Montreal','PP_Neue_Montreal_Fallback',sans-serif] text-[14px] font-semibold leading-[20px] text-gray-900", children: "Test Notifications" })] }), _jsx("p", { className: "mb-3 font-['PP_Neue_Montreal','PP_Neue_Montreal_Fallback',sans-serif] text-[14px] leading-[20px] text-gray-600", children: "Send a test notification to all your connected channels to verify they're working correctly." }), _jsx("button", { onClick: handleSendTestNotification, disabled: isSendingTest, className: "w-full rounded-lg bg-purple-600 px-4 py-2 font-['Inter',sans-serif] text-[14px] font-semibold leading-[20px] text-white transition-colors hover:bg-purple-700 disabled:opacity-50", children: isSendingTest ? "Sending..." : "Send Test Notification" }), testSuccess && (_jsx("div", { className: "mt-3 rounded-lg bg-green-50 p-3 font-['PP_Neue_Montreal','PP_Neue_Montreal_Fallback',sans-serif] text-[14px] leading-[20px] text-green-700", children: "\u2713 Test notification sent! Check your connected channels." }))] }))] })] }));
145
+ return (_jsxs("div", { className: "flex h-[470px] flex-col", children: [_jsx(ModalHeader, { showBackButton: true, showCloseButton: false, title: "Notifications", handleBack: handleBack }), _jsxs("div", { className: "flex-1 space-y-2 overflow-y-auto px-5 py-6", children: [error && (_jsx("div", { className: "mb-3 rounded-lg bg-red-50 p-3 font-['PP_Neue_Montreal','PP_Neue_Montreal_Fallback',sans-serif] text-[14px] leading-[20px] text-red-600 dark:bg-red-900/20 dark:text-red-400", children: error })), userId && jwtToken && (_jsxs("div", { className: "b3-modal-notifications-channels dark:bg-b3-background rounded-[20px] bg-[#f4f4f5]", children: [_jsx(PhoneChannel, { userId: userId, jwtToken: jwtToken, smsChannel: smsChannel, whatsappChannel: whatsappChannel, isSMSConnected: smsConnected, isWhatsAppConnected: whatsappConnected, isOptimisticallySMSConnected: optimisticSMSConnected, isOptimisticallyWhatsAppConnected: optimisticWhatsAppConnected, onConnectionChange: handleConnectionChange, onToggle: (type, shouldDisconnect) => handleToggleChannel(type, shouldDisconnect) }), _jsx(EmailChannel, { userId: userId, jwtToken: jwtToken, emailChannel: emailChannel, isConnected: emailConnected, isOptimisticallyConnected: optimisticEmailConnected, onConnectionChange: handleConnectionChange, onToggle: enabled => handleToggleChannel("email", enabled) }), _jsx(TelegramChannel, { userId: userId, jwtToken: jwtToken, telegramChannel: telegramChannel, isConnected: telegramConnected, isOptimisticallyConnected: optimisticTelegramConnected, onConnectionChange: handleConnectionChange, onToggle: enabled => handleToggleChannel("telegram", enabled) }), _jsx(DiscordChannel, { userId: userId, jwtToken: jwtToken, discordChannel: discordChannel, isConnected: discordConnected, isOptimisticallyConnected: optimisticDiscordConnected, onConnectionChange: handleConnectionChange, onToggle: enabled => handleToggleChannel("discord", enabled) })] })), process.env.NODE_ENV === "development" && hasAnyChannelConnected && (_jsxs("div", { className: "mt-6 rounded-xl border border-[#e4e4e7] bg-white p-4", children: [_jsxs("div", { className: "mb-3 flex items-center gap-2", children: [_jsx("div", { className: "text-lg", children: "\uD83E\uDDEA" }), _jsx("h3", { className: "font-['PP_Neue_Montreal','PP_Neue_Montreal_Fallback',sans-serif] text-[14px] font-semibold leading-[20px] text-gray-900", children: "Test Notifications" })] }), _jsx("p", { className: "mb-3 font-['PP_Neue_Montreal','PP_Neue_Montreal_Fallback',sans-serif] text-[14px] leading-[20px] text-gray-600", children: "Send a test notification to all your connected channels to verify they're working correctly." }), _jsx("button", { onClick: handleSendTestNotification, disabled: isSendingTest, className: "w-full rounded-lg bg-purple-600 px-4 py-2 font-['Inter',sans-serif] text-[14px] font-semibold leading-[20px] text-white transition-colors hover:bg-purple-700 disabled:opacity-50", children: isSendingTest ? "Sending..." : "Send Test Notification" }), testSuccess && (_jsx("div", { className: "mt-3 rounded-lg bg-green-50 p-3 font-['PP_Neue_Montreal','PP_Neue_Montreal_Fallback',sans-serif] text-[14px] leading-[20px] text-green-700", children: "\u2713 Test notification sent! Check your connected channels." }))] }))] })] }));
146
146
  };
147
147
  export default NotificationsContent;
@@ -50,6 +50,6 @@ const SettingsContent = ({ partnerId, onLogout, chain, }) => {
50
50
  }
51
51
  setB3ModalOpen(true);
52
52
  };
53
- return (_jsxs("div", { className: "flex h-[470px] flex-col", children: [_jsx(ModalHeader, { showBackButton: false, showCloseButton: false, title: "Settings" }), _jsx("div", { className: "p-5", children: _jsx("div", { className: "b3-modal-settings-profile-card flex items-center rounded-xl border border-[#e4e4e7] bg-[#f4f4f5] p-4", children: _jsx(SettingsProfileCard, {}) }) }), _jsxs("div", { className: "space-y-3 px-5", children: [_jsx(SettingsMenuItem, { icon: _jsx("svg", { width: "40", height: "40", viewBox: "0 0 40 40", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { d: "M0 12C0 5.37258 5.37258 0 12 0H28C34.6274 0 40 5.37258 40 12V28C40 34.6274 34.6274 40 28 40H12C5.37258 40 0 34.6274 0 28V12Z", fill: "#F4F4F5" }) }), title: "Linked Accounts", subtitle: `${profiles.length} connected account${profiles.length > 1 ? "s" : ""}`, onClick: () => handleNavigate("linkAccount") }), _jsx(SettingsMenuItem, { icon: _jsx("svg", { width: "40", height: "40", viewBox: "0 0 40 40", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { d: "M0 12C0 5.37258 5.37258 0 12 0H28C34.6274 0 40 5.37258 40 12V28C40 34.6274 34.6274 40 28 40H12C5.37258 40 0 34.6274 0 28V12Z", fill: "#F4F4F5" }) }), title: "Notifications", subtitle: "Manage your notifications", onClick: () => handleNavigate("notifications") })] })] }));
53
+ return (_jsxs("div", { className: "flex h-[470px] flex-col", children: [_jsx(ModalHeader, { showBackButton: false, showCloseButton: false, title: "Settings" }), _jsx("div", { className: "p-5", children: _jsx("div", { className: "b3-modal-settings-profile-card dark:border-b3-line dark:bg-b3-background flex items-center rounded-xl border border-[#e4e4e7] bg-[#f4f4f5] p-4", children: _jsx(SettingsProfileCard, {}) }) }), _jsxs("div", { className: "space-y-3 px-5", children: [_jsx(SettingsMenuItem, { icon: _jsx("svg", { width: "40", height: "40", viewBox: "0 0 40 40", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { d: "M0 12C0 5.37258 5.37258 0 12 0H28C34.6274 0 40 5.37258 40 12V28C40 34.6274 34.6274 40 28 40H12C5.37258 40 0 34.6274 0 28V12Z", fill: "#F4F4F5" }) }), title: "Linked Accounts", subtitle: `${profiles.length} connected account${profiles.length > 1 ? "s" : ""}`, onClick: () => handleNavigate("linkAccount") }), _jsx(SettingsMenuItem, { icon: _jsx("svg", { width: "40", height: "40", viewBox: "0 0 40 40", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { d: "M0 12C0 5.37258 5.37258 0 12 0H28C34.6274 0 40 5.37258 40 12V28C40 34.6274 34.6274 40 28 40H12C5.37258 40 0 34.6274 0 28V12Z", fill: "#F4F4F5" }) }), title: "Notifications", subtitle: "Manage your notifications", onClick: () => handleNavigate("notifications") })] })] }));
54
54
  };
55
55
  export default SettingsContent;
@@ -1,6 +1,6 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import { ChevronRight } from "lucide-react";
3
3
  const SettingsMenuItem = ({ icon, title, subtitle, onClick }) => {
4
- return (_jsxs("button", { onClick: onClick, className: "b3-modal-settings-menu-item flex w-full items-center gap-2 rounded-xl px-3 py-2 transition-colors hover:bg-[#f4f4f5]", children: [_jsx("div", { className: "flex size-10 items-center justify-center rounded-full bg-[#f4f4f5]", children: icon }), _jsxs("div", { className: "flex flex-1 flex-col items-start gap-1 text-left", children: [_jsx("span", { className: "font-neue-montreal-semibold text-[14px] leading-none tracking-[-0.28px] text-[#3f3f46]", children: title }), _jsx("span", { className: "font-neue-montreal-medium text-[14px] leading-none tracking-[-0.28px] text-[#70707b]", children: subtitle })] }), _jsx(ChevronRight, { size: 20, className: "text-[#51525c]" })] }));
4
+ return (_jsxs("button", { onClick: onClick, className: "b3-modal-settings-menu-item dark:hover:bg-b3-line/50 flex w-full items-center gap-2 rounded-xl px-3 py-2 transition-colors hover:bg-[#f4f4f5]", children: [_jsx("div", { className: "dark:bg-b3-line flex size-10 items-center justify-center rounded-full bg-[#f4f4f5]", children: icon }), _jsxs("div", { className: "flex flex-1 flex-col items-start gap-1 text-left dark:text-white", children: [_jsx("span", { className: "font-neue-montreal-semibold text-[14px] leading-none tracking-[-0.28px] text-[#3f3f46] dark:text-white", children: title }), _jsx("span", { className: "dark:text-b3-foreground-muted font-neue-montreal-medium text-[14px] leading-none tracking-[-0.28px] text-[#70707b]", children: subtitle })] }), _jsx(ChevronRight, { size: 20, className: "text-[#51525c]" })] }));
5
5
  };
6
6
  export default SettingsMenuItem;
@@ -102,10 +102,10 @@ const SettingsProfileCard = () => {
102
102
  handleCancelEdit();
103
103
  }
104
104
  };
105
- return (_jsxs("div", { className: "flex w-full items-center gap-3", children: [_jsxs("div", { className: "relative shrink-0", children: [_jsx(IPFSMediaRenderer, { src: avatarSrc, alt: "Profile", className: "border-black/8 size-14 rounded-full border object-cover" }), _jsx("button", { onClick: handleEditAvatar, className: "absolute -bottom-0.5 -right-0.5 flex size-[18px] items-center justify-center rounded-full border-[1.5px] border-white bg-[#a0a0ab] transition-colors hover:bg-[#a0a0ab]/80", "aria-label": "Edit avatar", children: _jsx(Pencil, { size: 10, className: "text-white", strokeWidth: 2.5 }) })] }), _jsx("div", { className: "flex shrink-0 flex-col gap-1", children: isEditingUsername ? (
105
+ return (_jsxs("div", { className: "flex w-full items-center gap-3", children: [_jsxs("div", { className: "relative shrink-0", children: [_jsx(IPFSMediaRenderer, { src: avatarSrc, alt: "Profile", className: "border-b3-line dark:border-white/8 size-14 rounded-full border object-cover" }), _jsx("button", { onClick: handleEditAvatar, className: "border-b3-line absolute -bottom-0.5 -right-0.5 flex size-[18px] items-center justify-center rounded-full border-[1.5px] bg-[#a0a0ab] transition-colors hover:bg-[#a0a0ab]/80 dark:border-white", "aria-label": "Edit avatar", children: _jsx(Pencil, { size: 10, className: "text-white", strokeWidth: 2.5 }) })] }), _jsx("div", { className: "flex shrink-0 flex-col gap-1", children: isEditingUsername ? (
106
106
  /* Edit mode - inline input */
107
107
  _jsxs("div", { className: "flex items-center gap-2", children: [_jsx("input", { ref: inputRef, type: "text", value: editedUsername, onChange: e => setEditedUsername(e.target.value), onKeyDown: handleKeyDown, disabled: isSaving, className: "border-b3-line bg-b3-background text-b3-grey placeholder:text-b3-foreground-muted font-neue-montreal-medium focus:border-b3-primary-blue text-md w-full rounded-md border px-2 py-1 leading-none transition-colors focus:outline-none disabled:opacity-50", placeholder: "Enter username" }), _jsxs("div", { className: "flex items-center gap-1", children: [_jsx("button", { onClick: handleSaveUsername, disabled: isSaving, className: "text-b3-primary-blue hover:text-b3-primary-blue/80 flex items-center justify-center rounded-md p-1 transition-colors disabled:opacity-50", "aria-label": "Save username", children: isSaving ? _jsx(Loader2, { size: 18, className: "animate-spin" }) : _jsx(Check, { size: 18, strokeWidth: 2.5 }) }), _jsx("button", { onClick: handleCancelEdit, disabled: isSaving, className: "text-b3-foreground-muted hover:text-b3-grey flex items-center justify-center rounded-md p-1 transition-colors disabled:opacity-50", "aria-label": "Cancel editing", children: _jsx(X, { size: 18, strokeWidth: 2.5 }) })] })] })) : (
108
108
  /* Display mode */
109
- _jsxs(_Fragment, { children: [_jsx("div", { className: "flex items-center gap-1", children: _jsx("p", { className: "b3-modal-username font-neue-montreal-semibold text-lg leading-none text-[#0B57C2]", children: currentUsername }) }), _jsx("button", { onClick: handleEditUsername, className: "flex items-center justify-center gap-1 text-left transition-opacity hover:opacity-80", children: _jsx("p", { className: "font-inter text-sm font-semibold leading-5 text-[#51525C]", children: "Edit Username" }) })] })) })] }));
109
+ _jsxs(_Fragment, { children: [_jsx("div", { className: "flex items-center gap-1", children: _jsx("p", { className: "b3-modal-username font-neue-montreal-semibold text-lg leading-none text-[#0B57C2]", children: currentUsername }) }), _jsx("button", { onClick: handleEditUsername, className: "flex items-center justify-center gap-1 text-left transition-opacity hover:opacity-80", children: _jsx("p", { className: "font-inter text-sm font-semibold leading-5 text-[#51525C] dark:text-white", children: "Edit Username" }) })] })) })] }));
110
110
  };
111
111
  export default SettingsProfileCard;
@@ -10,6 +10,7 @@ export const DiscordChannel = ({ userId, jwtToken, discordChannel, isConnected,
10
10
  const { partnerId } = useB3();
11
11
  const [discordId, setDiscordId] = useState("");
12
12
  const [isConnecting, setIsConnecting] = useState(false);
13
+ const [showInput, setShowInput] = useState(false);
13
14
  // Detect if we're disconnecting
14
15
  const isDisconnecting = isConnected && !isOptimisticallyConnected;
15
16
  const handleConnect = async () => {
@@ -20,6 +21,7 @@ export const DiscordChannel = ({ userId, jwtToken, discordChannel, isConnected,
20
21
  await notificationsAPI.connectDiscord(userId, discordId, jwtToken);
21
22
  await notificationsAPI.ensureNotificationSettings(userId, partnerId, "general", jwtToken);
22
23
  setDiscordId("");
24
+ setShowInput(false);
23
25
  toast.success("Discord connected successfully!");
24
26
  onConnectionChange();
25
27
  }
@@ -32,13 +34,17 @@ export const DiscordChannel = ({ userId, jwtToken, discordChannel, isConnected,
32
34
  }
33
35
  };
34
36
  const handleToggle = () => {
37
+ if (isConnected) {
38
+ setShowInput(false);
39
+ }
35
40
  onToggle(isConnected);
36
41
  };
37
42
  const icon = (_jsx("svg", { id: "Discord-Logo", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 126.644 96", children: _jsx("path", { id: "Discord-Symbol-Blurple", className: "fill-[#ffffff]", d: "M81.15,0c-1.2376,2.1973-2.3489,4.4704-3.3591,6.794-9.5975-1.4396-19.3718-1.4396-28.9945,0-.985-2.3236-2.1216-4.5967-3.3591-6.794-9.0166,1.5407-17.8059,4.2431-26.1405,8.0568C2.779,32.5304-1.6914,56.3725.5312,79.8863c9.6732,7.1476,20.5083,12.603,32.0505,16.0884,2.6014-3.4854,4.8998-7.1981,6.8698-11.0623-3.738-1.3891-7.3497-3.1318-10.8098-5.1523.9092-.6567,1.7932-1.3386,2.6519-1.9953,20.281,9.547,43.7696,9.547,64.0758,0,.8587.7072,1.7427,1.3891,2.6519,1.9953-3.4601,2.0457-7.0718,3.7632-10.835,5.1776,1.97,3.8642,4.2683,7.5769,6.8698,11.0623,11.5419-3.4854,22.3769-8.9156,32.0509-16.0631,2.626-27.2771-4.496-50.9172-18.817-71.8548C98.9811,4.2684,90.1918,1.5659,81.1752.0505l-.0252-.0505ZM42.2802,65.4144c-6.2383,0-11.4159-5.6575-11.4159-12.6535s4.9755-12.6788,11.3907-12.6788,11.5169,5.708,11.4159,12.6788c-.101,6.9708-5.026,12.6535-11.3907,12.6535ZM84.3576,65.4144c-6.2637,0-11.3907-5.6575-11.3907-12.6535s4.9755-12.6788,11.3907-12.6788,11.4917,5.708,11.3906,12.6788c-.101,6.9708-5.026,12.6535-11.3906,12.6535Z" }) }));
38
- const inputSection = (_jsxs("div", { className: "mt-1 space-y-2", children: [_jsx("input", { type: "text", value: discordId, onChange: e => setDiscordId(e.target.value), onKeyDown: e => {
43
+ const addButtonSection = (_jsxs("button", { onClick: () => setShowInput(true), className: "mt-1 flex items-center gap-1", children: [_jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: _jsx("path", { d: "M8 3.33333V12.6667M3.33333 8H12.6667", stroke: "#0c68e9", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }), _jsx("span", { className: "font-['Inter',sans-serif] text-[11px] font-semibold leading-[16px] text-[#0b57c2]", children: "Add Discord" })] }));
44
+ const inputSection = showInput ? (_jsxs("div", { className: "mt-1 space-y-2", children: [_jsx("input", { type: "text", value: discordId, onChange: e => setDiscordId(e.target.value), onKeyDown: e => {
39
45
  if (e.key === "Enter" && discordId) {
40
46
  handleConnect();
41
47
  }
42
- }, placeholder: "Discord User ID", className: "w-full rounded-lg border border-gray-300 px-2 py-1.5 font-['Inter',sans-serif] text-sm focus:border-blue-500 focus:outline-none" }), _jsxs("button", { onClick: handleConnect, disabled: isConnecting || !discordId, className: "flex items-center gap-1 disabled:opacity-50", children: [_jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: _jsx("path", { d: "M8 3.33333V12.6667M3.33333 8H12.6667", stroke: "#0c68e9", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }), _jsx("span", { className: "font-['Inter',sans-serif] text-[11px] font-semibold leading-[16px] text-[#0b57c2]", children: isConnecting ? "Connecting..." : "Add Discord" })] })] }));
43
- return (_jsx(NotificationChannel, { icon: icon, iconClassName: "bg-[#5865f2] rounded-xl p-2", title: "Discord", isConnected: isOptimisticallyConnected, isConnecting: isConnecting, isDisconnecting: isDisconnecting, connectedInfo: discordChannel?.channel_identifier, inputSection: inputSection, onToggle: handleToggle, showBorder: false }));
48
+ }, placeholder: "Discord User ID", className: "w-full rounded-lg border border-gray-300 px-2 py-1.5 font-['Inter',sans-serif] text-sm focus:border-blue-500 focus:outline-none" }), _jsxs("button", { onClick: handleConnect, disabled: isConnecting || !discordId, className: "flex items-center gap-1 disabled:opacity-50", children: [_jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: _jsx("path", { d: "M8 3.33333V12.6667M3.33333 8H12.6667", stroke: "#0c68e9", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }), _jsx("span", { className: "font-['Inter',sans-serif] text-[11px] font-semibold leading-[16px] text-[#0b57c2]", children: isConnecting ? "Connecting..." : "Add Discord" })] })] })) : null;
49
+ return (_jsx(NotificationChannel, { icon: icon, iconClassName: "bg-[#5865f2] rounded-xl p-2", title: "Discord", isConnected: isOptimisticallyConnected, isConnecting: isConnecting, isDisconnecting: isDisconnecting, connectedInfo: discordChannel?.channel_identifier, inputSection: inputSection, addButtonSection: addButtonSection, onToggle: handleToggle, showBorder: false }));
44
50
  };
@@ -59,6 +59,6 @@ export const EmailChannel = ({ userId, jwtToken, emailChannel, isConnected, isOp
59
59
  if (e.key === "Enter" && email) {
60
60
  handleConnect();
61
61
  }
62
- }, placeholder: "your@email.com", className: `w-full rounded-lg border px-2 py-1.5 font-['Inter',sans-serif] text-sm focus:outline-none ${emailError ? "border-red-500 focus:border-red-500" : "border-gray-300 focus:border-blue-500"}` }), emailError && (_jsx("p", { className: "mt-1 font-['PP_Neue_Montreal','PP_Neue_Montreal_Fallback',sans-serif] text-[12px] leading-[16px] text-red-600", children: emailError }))] }), _jsxs("button", { onClick: handleConnect, disabled: isConnecting || !email, className: "flex items-center gap-1 disabled:opacity-50", children: [_jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: _jsx("path", { d: "M8 3.33333V12.6667M3.33333 8H12.6667", stroke: "#0c68e9", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }), _jsx("span", { className: "font-['Inter',sans-serif] text-[11px] font-semibold leading-[16px] text-[#0b57c2]", children: isConnecting ? "Connecting..." : "Add Email" })] })] })) : null;
62
+ }, placeholder: "your@email.com", className: `dark:border-b3-line dark:bg-b3-background w-full rounded-lg border px-2 py-1.5 font-['Inter',sans-serif] text-sm focus:outline-none dark:text-white ${emailError ? "border-red-500 focus:border-red-500" : "border-gray-300 focus:border-blue-500"}` }), emailError && (_jsx("p", { className: "mt-1 font-['PP_Neue_Montreal','PP_Neue_Montreal_Fallback',sans-serif] text-[12px] leading-[16px] text-red-600", children: emailError }))] }), _jsxs("button", { onClick: handleConnect, disabled: isConnecting || !email, className: "flex items-center gap-1 disabled:opacity-50", children: [_jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: _jsx("path", { d: "M8 3.33333V12.6667M3.33333 8H12.6667", stroke: "#0c68e9", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }), _jsx("span", { className: "font-['Inter',sans-serif] text-[11px] font-semibold leading-[16px] text-[#0b57c2]", children: isConnecting ? "Connecting..." : "Add Email" })] })] })) : null;
63
63
  return (_jsx(NotificationChannel, { icon: icon, title: "Email", isConnected: isOptimisticallyConnected, isConnecting: isConnecting, isDisconnecting: isDisconnecting, connectedInfo: emailChannel?.channel_identifier, inputSection: inputSection, addButtonSection: addButtonSection, onToggle: handleToggle }));
64
64
  };
@@ -69,7 +69,7 @@ export const PhoneChannel = ({ userId, jwtToken, smsChannel, whatsappChannel, is
69
69
  if (e.key === "Enter" && phoneNumber) {
70
70
  handleConnectSMS();
71
71
  }
72
- }, placeholder: "+1 (555) 123-4567", className: "w-full rounded-lg border border-gray-300 px-2 py-1.5 font-['Inter',sans-serif] text-sm focus:border-blue-500 focus:outline-none" }), _jsxs("div", { className: "flex gap-2", children: [_jsxs("button", { onClick: handleConnectSMS, disabled: isConnectingSMS || !phoneNumber, className: "flex items-center gap-1 disabled:opacity-50", children: [_jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: _jsx("path", { d: "M8 3.33333V12.6667M3.33333 8H12.6667", stroke: "#0c68e9", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }), _jsx("span", { className: "font-['Inter',sans-serif] text-[11px] font-semibold leading-[16px] text-[#0b57c2]", children: isConnectingSMS ? "Connecting..." : "Add SMS" })] }), _jsx("span", { className: "text-[11px] text-gray-400", children: "|" }), _jsxs("button", { onClick: handleConnectWhatsApp, disabled: isConnectingWhatsApp || !phoneNumber, className: "flex items-center gap-1 disabled:opacity-50", children: [_jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: _jsx("path", { d: "M8 3.33333V12.6667M3.33333 8H12.6667", stroke: "#0c68e9", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }), _jsx("span", { className: "font-['Inter',sans-serif] text-[11px] font-semibold leading-[16px] text-[#0b57c2]", children: isConnectingWhatsApp ? "Connecting..." : "Add WhatsApp" })] })] })] })) : null;
73
- const connectedInfo = (_jsxs(_Fragment, { children: [isSMSConnected && (_jsx("p", { className: "font-['PP_Neue_Montreal','PP_Neue_Montreal_Fallback',sans-serif] text-[14px] leading-[20px] text-[#51525c]", children: smsChannel?.channel_identifier })), isWhatsAppConnected && (_jsx("p", { className: "font-['PP_Neue_Montreal','PP_Neue_Montreal_Fallback',sans-serif] text-[14px] leading-[20px] text-[#51525c]", children: whatsappChannel?.channel_identifier }))] }));
72
+ }, placeholder: "+1 (555) 123-4567", className: "dark:border-b3-line dark:bg-b3-background w-full rounded-lg border border-gray-300 px-2 py-1.5 font-['Inter',sans-serif] text-sm focus:border-blue-500 focus:outline-none dark:text-white" }), _jsxs("div", { className: "flex gap-2", children: [_jsxs("button", { onClick: handleConnectSMS, disabled: isConnectingSMS || !phoneNumber, className: "flex items-center gap-1 disabled:opacity-50", children: [_jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: _jsx("path", { d: "M8 3.33333V12.6667M3.33333 8H12.6667", stroke: "#0c68e9", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }), _jsx("span", { className: "font-['Inter',sans-serif] text-[11px] font-semibold leading-[16px] text-[#0b57c2] dark:text-white", children: isConnectingSMS ? "Connecting..." : "Add SMS" })] }), _jsx("span", { className: "text-[11px] text-gray-400", children: "|" }), _jsxs("button", { onClick: handleConnectWhatsApp, disabled: isConnectingWhatsApp || !phoneNumber, className: "flex items-center gap-1 disabled:opacity-50", children: [_jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: _jsx("path", { d: "M8 3.33333V12.6667M3.33333 8H12.6667", stroke: "#0c68e9", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }), _jsx("span", { className: "font-['Inter',sans-serif] text-[11px] font-semibold leading-[16px] text-[#0b57c2]", children: isConnectingWhatsApp ? "Connecting..." : "Add WhatsApp" })] })] })] })) : null;
73
+ const connectedInfo = (_jsxs(_Fragment, { children: [isSMSConnected && (_jsx("p", { className: "font-['PP_Neue_Montreal','PP_Neue_Montreal_Fallback',sans-serif] text-[14px] leading-[20px] text-[#51525c] dark:text-white", children: smsChannel?.channel_identifier })), isWhatsAppConnected && (_jsx("p", { className: "font-['PP_Neue_Montreal','PP_Neue_Montreal_Fallback',sans-serif] text-[14px] leading-[20px] text-[#51525c] dark:text-white", children: whatsappChannel?.channel_identifier }))] }));
74
74
  return (_jsx(NotificationChannel, { icon: icon, title: "SMS/WhatsApp", isConnected: isOptimisticallySMSConnected || isOptimisticallyWhatsAppConnected, isConnecting: isConnectingSMS || isConnectingWhatsApp, isDisconnecting: isDisconnecting, connectedInfo: isSMSConnected || isWhatsAppConnected ? (_jsx("div", { className: "mt-1 flex flex-col gap-1", children: connectedInfo })) : undefined, inputSection: inputSection, addButtonSection: addButtonSection, onToggle: handleToggle }));
75
75
  };
@@ -70,6 +70,6 @@ export const TelegramChannel = ({ userId, jwtToken, telegramChannel, isConnected
70
70
  }
71
71
  };
72
72
  const icon = (_jsx("svg", { width: "1000px", height: "1000px", viewBox: "0 0 1000 1000", version: "1.1", xmlns: "http://www.w3.org/2000/svg", children: _jsx("g", { id: "Telegram", stroke: "none", "stroke-width": "1", fill: "none", "fill-rule": "evenodd", children: _jsx("path", { d: "M226.328419,494.722069 C372.088573,431.216685 469.284839,389.350049 517.917216,369.122161 C656.772535,311.36743 685.625481,301.334815 704.431427,301.003532 C708.567621,300.93067 717.815839,301.955743 723.806446,306.816707 C728.864797,310.92121 730.256552,316.46581 730.922551,320.357329 C731.588551,324.248848 732.417879,333.113828 731.758626,340.040666 C724.234007,419.102486 691.675104,610.964674 675.110982,699.515267 C668.10208,736.984342 654.301336,749.547532 640.940618,750.777006 C611.904684,753.448938 589.856115,731.588035 561.733393,713.153237 C517.726886,684.306416 492.866009,666.349181 450.150074,638.200013 C400.78442,605.66878 432.786119,587.789048 460.919462,558.568563 C468.282091,550.921423 596.21508,434.556479 598.691227,424.000355 C599.00091,422.680135 599.288312,417.758981 596.36474,415.160431 C593.441168,412.561881 589.126229,413.450484 586.012448,414.157198 C581.598758,415.158943 511.297793,461.625274 375.109553,553.556189 C355.154858,567.258623 337.080515,573.934908 320.886524,573.585046 C303.033948,573.199351 268.692754,563.490928 243.163606,555.192408 C211.851067,545.013936 186.964484,539.632504 189.131547,522.346309 C190.260287,513.342589 202.659244,504.134509 226.328419,494.722069 Z", id: "Path-3", fill: "#FFFFFF" }) }) }));
73
- const inputSection = status === "pending" ? (_jsxs("div", { className: "mt-1", children: [_jsx("p", { className: "font-['PP_Neue_Montreal','PP_Neue_Montreal_Fallback',sans-serif] text-[14px] leading-[20px] text-yellow-700", children: "Waiting for connection..." }), _jsx("p", { className: "font-['PP_Neue_Montreal','PP_Neue_Montreal_Fallback',sans-serif] text-[12px] text-yellow-600", children: "Send /start to @b3_notifications_bot" })] })) : (_jsxs("button", { onClick: handleConnect, disabled: isConnecting, className: "mt-1 flex items-center gap-1 disabled:opacity-50", children: [_jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: _jsx("path", { d: "M8 3.33333V12.6667M3.33333 8H12.6667", stroke: "#0c68e9", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }), _jsx("span", { className: "font-['Inter',sans-serif] text-[11px] font-semibold leading-[16px] text-[#0b57c2]", children: isConnecting ? "Opening..." : "Add Telegram" })] }));
73
+ const inputSection = status === "pending" ? (_jsxs("div", { className: "mt-1", children: [_jsx("p", { className: "font-['PP_Neue_Montreal','PP_Neue_Montreal_Fallback',sans-serif] text-[14px] leading-[20px] text-yellow-700 dark:text-white", children: "Waiting for connection..." }), _jsx("p", { className: "font-['PP_Neue_Montreal','PP_Neue_Montreal_Fallback',sans-serif] text-[12px] text-yellow-600 dark:text-white", children: "Send /start to @b3_notifications_bot" })] })) : (_jsxs("button", { onClick: handleConnect, disabled: isConnecting, className: "mt-1 flex items-center gap-1 disabled:opacity-50", children: [_jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: _jsx("path", { d: "M8 3.33333V12.6667M3.33333 8H12.6667", stroke: "#0c68e9", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }), _jsx("span", { className: "font-['Inter',sans-serif] text-[11px] font-semibold leading-[16px] text-[#0b57c2]", children: isConnecting ? "Opening..." : "Add Telegram" })] }));
74
74
  return (_jsx(NotificationChannel, { icon: icon, iconClassName: "bg-[#24A1DE] rounded-xl", title: "Telegram", isConnected: isOptimisticallyConnected || status === "connected", isConnecting: isConnecting, isDisconnecting: isDisconnecting, connectedInfo: telegramChannel?.channel_identifier || "Connected", inputSection: inputSection, onToggle: handleToggle }));
75
75
  };
@@ -5,6 +5,6 @@ import { useModalStore } from "../../stores/index.js";
5
5
  const ModalHeader = ({ showBackButton = true, handleBack, handleClose, title, children, showCloseButton = true, className, showBackWord = false, }) => {
6
6
  const navigateBack = useModalStore(state => state.navigateBack);
7
7
  const setB3ModalOpen = useModalStore(state => state.setB3ModalOpen);
8
- return (_jsxs("div", { className: cn("b3-modal-header flex h-16 items-center justify-between border-b border-[#e4e4e7] bg-white px-5 py-3", className), children: [showBackButton ? (_jsxs("button", { onClick: handleBack || navigateBack, className: "flex h-6 w-6 items-center justify-center transition-opacity hover:opacity-70", children: [_jsx(ChevronLeft, { className: "h-6 w-6 text-[#51525c]" }), showBackWord && _jsx("span", { className: "text-sm font-medium", children: "Back" })] })) : (_jsx("div", { className: "w-2" })), _jsx("p", { className: "font-inter text-lg font-semibold leading-7 text-[#18181b]", children: title }), showCloseButton ? (_jsx("button", { onClick: handleClose || (() => setB3ModalOpen(false)), className: "flex h-6 w-6 items-center justify-center transition-opacity hover:opacity-70", children: _jsx(X, { className: "h-6 w-6 text-[#51525c]" }) })) : !children ? (_jsx("div", { className: "w-2" })) : undefined, children] }));
8
+ return (_jsxs("div", { className: cn("b3-modal-header flex h-16 items-center justify-between border-b border-[#e4e4e7] bg-white px-5 py-3", className), children: [showBackButton ? (_jsxs("button", { onClick: handleBack || navigateBack, className: "flex h-6 w-6 items-center justify-center transition-opacity hover:opacity-70", children: [_jsx(ChevronLeft, { className: "h-6 w-6 text-[#51525c] dark:text-white" }), showBackWord && _jsx("span", { className: "text-sm font-medium", children: "Back" })] })) : (_jsx("div", { className: "w-2" })), _jsx("p", { className: "font-inter text-lg font-semibold leading-7 text-[#18181b] dark:text-white", children: title }), showCloseButton ? (_jsx("button", { onClick: handleClose || (() => setB3ModalOpen(false)), className: "flex h-6 w-6 items-center justify-center transition-opacity hover:opacity-70", children: _jsx(X, { className: "h-6 w-6 text-[#51525c] dark:text-white" }) })) : !children ? (_jsx("div", { className: "w-2" })) : undefined, children] }));
9
9
  };
10
10
  export default ModalHeader;
@@ -179,11 +179,11 @@ export function Send({ recipientAddress: initialRecipient, onSuccess }) {
179
179
  return "Send";
180
180
  }
181
181
  };
182
- return (_jsxs("div", { className: "flex h-[600px] w-full flex-col bg-white", children: [_jsx(ModalHeader, { handleBack: handleBack, title: getStepTitle() }), _jsxs("div", { className: "flex-1 overflow-y-auto", children: [step === "recipient" && (_jsxs("div", { className: "flex flex-col gap-6 p-5", children: [_jsxs("div", { className: "flex h-12 w-full items-stretch overflow-hidden rounded-lg border border-[#d1d1d6] bg-white", children: [_jsx("div", { className: "flex w-12 items-center justify-center bg-transparent px-3 py-2", children: _jsx("span", { className: "font-neue-montreal-medium text-base text-[#3f3f46]", children: "To" }) }), _jsxs("div", { className: "flex flex-1 items-center border-l border-[#d1d1d6] px-3 py-2", children: [_jsx("input", { type: "text", value: recipientAddress, onChange: e => handleRecipientAddressChange(e.target.value), placeholder: "ENS or Address", className: "font-neue-montreal-medium flex-1 text-base text-[#70707b] outline-none placeholder:text-[#70707b]" }), _jsx("button", { onClick: handlePaste, 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]", children: "Paste" })] })] }), addressError && _jsx("p", { className: "font-neue-montreal-medium -mt-4 text-xs text-red-500", children: addressError }), showValidatedResult && recipientAddress && isAddress(recipientAddress) && (_jsxs("div", { className: "flex flex-col gap-2", children: [_jsx("div", { className: "flex items-center gap-1", children: _jsx("span", { className: "font-sf-pro-text text-sm font-semibold leading-[1.3] tracking-[-0.41px] text-[#0b57c2]", children: "Result" }) }), _jsxs("button", { onClick: handleSelectValidatedAddress, className: "flex items-center gap-2 rounded-xl bg-[#f4f4f5] px-3 py-2 transition-colors hover:bg-[#e4e4e7]", children: [validatedProfileData?.avatar ? (_jsx("img", { src: validatedProfileData.avatar, alt: validatedProfileData.name || recipientAddress, className: "h-10 w-10 rounded-full" })) : (_jsx("div", { className: "flex h-10 w-10 items-center justify-center rounded-full border border-[#e4e4e7] bg-[#f4f4f5]", children: _jsx(Wallet, { className: "h-5 w-5 text-[#a0a0ab]" }) })), _jsxs("span", { className: "font-neue-montreal-medium text-base tracking-[-0.32px] text-[#70707b]", children: [recipientAddress.slice(0, 6), "...", recipientAddress.slice(-4), validatedProfileData?.name && ` (${validatedProfileData.name})`] })] })] })), recentAddresses.length > 0 && (_jsxs("div", { className: "flex flex-col gap-2", children: [_jsxs("div", { className: "flex items-center gap-1", children: [_jsx(Clock, { className: "h-3.5 w-3.5 text-[#3f3f46]" }), _jsx("span", { className: "font-sf-pro-text text-sm font-semibold leading-[1.3] tracking-[-0.41px] text-[#3f3f46]", children: "Recents" })] }), _jsx("div", { className: "flex flex-col", children: recentAddresses.map((recent, index) => (_jsx(RecentAddressItem, { address: recent.address, onClick: () => {
182
+ return (_jsxs("div", { className: "dark:bg-b3-background flex h-[600px] w-full flex-col bg-white", children: [_jsx(ModalHeader, { handleBack: handleBack, title: getStepTitle() }), _jsxs("div", { className: "flex-1 overflow-y-auto", children: [step === "recipient" && (_jsxs("div", { className: "flex flex-col gap-6 p-5", children: [_jsxs("div", { className: "dark:border-b3-line dark:bg-b3-background flex h-12 w-full items-stretch overflow-hidden rounded-lg border border-[#d1d1d6] bg-white", children: [_jsx("div", { className: "flex w-12 items-center justify-center bg-transparent px-3 py-2", children: _jsx("span", { className: "font-neue-montreal-medium text-base text-[#3f3f46] dark:text-white", children: "To" }) }), _jsxs("div", { className: "flex flex-1 items-center border-l border-[#d1d1d6] px-3 py-2", children: [_jsx("input", { type: "text", value: recipientAddress, onChange: e => handleRecipientAddressChange(e.target.value), placeholder: "ENS or Address", className: "font-neue-montreal-medium dark:bg-b3-background flex-1 text-base text-[#70707b] outline-none placeholder:text-[#70707b] dark:text-white dark:placeholder:text-white" }), _jsx("button", { onClick: handlePaste, 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]", children: "Paste" })] })] }), addressError && _jsx("p", { className: "font-neue-montreal-medium -mt-4 text-xs text-red-500", children: addressError }), showValidatedResult && recipientAddress && isAddress(recipientAddress) && (_jsxs("div", { className: "flex flex-col gap-2", children: [_jsx("div", { className: "flex items-center gap-1", children: _jsx("span", { className: "font-sf-pro-text text-sm font-semibold leading-[1.3] tracking-[-0.41px] text-[#0b57c2]", children: "Result" }) }), _jsxs("button", { onClick: handleSelectValidatedAddress, className: "dark:bg-b3-background dark:border-b3-line flex items-center gap-2 rounded-xl bg-[#f4f4f5] px-3 py-2 transition-colors hover:bg-[#e4e4e7]", children: [validatedProfileData?.avatar ? (_jsx("img", { src: validatedProfileData.avatar, alt: validatedProfileData.name || recipientAddress, className: "h-10 w-10 rounded-full" })) : (_jsx("div", { className: "dark:border-b3-line dark:bg-b3-background flex h-10 w-10 items-center justify-center rounded-full border border-[#e4e4e7] bg-[#f4f4f5]", children: _jsx(Wallet, { className: "h-5 w-5 text-[#a0a0ab] dark:text-white" }) })), _jsxs("span", { className: "font-neue-montreal-medium text-base tracking-[-0.32px] text-[#70707b] dark:text-white", children: [recipientAddress.slice(0, 6), "...", recipientAddress.slice(-4), validatedProfileData?.name && ` (${validatedProfileData.name})`] })] })] })), recentAddresses.length > 0 && (_jsxs("div", { className: "flex flex-col gap-2", children: [_jsxs("div", { className: "flex items-center gap-1", children: [_jsx(Clock, { className: "h-3.5 w-3.5 text-[#3f3f46]" }), _jsx("span", { className: "font-sf-pro-text text-sm font-semibold leading-[1.3] tracking-[-0.41px] text-[#3f3f46]", children: "Recents" })] }), _jsx("div", { className: "flex flex-col", children: recentAddresses.map((recent, index) => (_jsx(RecentAddressItem, { address: recent.address, onClick: () => {
183
183
  // Just fill the input and show validation - don't auto-proceed
184
184
  handleRecipientAddressChange(recent.address);
185
185
  } }, index))) })] }))] })), step === "token" && (_jsx("div", { className: "flex flex-col p-5", children: isLoadingBalance ? (_jsx("div", { className: "space-y-4", children: _jsx("div", { className: "space-y-1", children: [...Array(3)].map((_, index) => (_jsxs("div", { className: "flex items-center justify-between rounded-xl p-3", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "bg-b3-line h-10 w-10 animate-pulse rounded-full" }), _jsxs("div", { children: [_jsx("div", { className: "bg-b3-line mb-1 h-4 w-16 animate-pulse rounded" }), _jsx("div", { className: "bg-b3-line h-3 w-24 animate-pulse rounded" })] })] }), _jsxs("div", { className: "text-right", children: [_jsx("div", { className: "bg-b3-line mb-1 h-4 w-20 animate-pulse rounded" }), _jsx("div", { className: "bg-b3-line h-3 w-16 animate-pulse rounded" })] })] }, index))) }) })) : simBalance?.balances && simBalance.balances.length > 0 ? (_jsx("div", { className: "space-y-4", children: _jsx("div", { className: "space-y-1", children: simBalance.balances.map(token => (_jsxs("div", { 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", onClick: () => {
186
186
  setSelectedToken(token);
187
187
  setStep("amount");
188
- }, children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "flex h-10 w-10 items-center justify-center rounded-full", children: ALL_CHAINS[token.chain_id]?.logoUrl ? (_jsx(ChainTokenIcon, { chainUrl: ALL_CHAINS[token.chain_id].logoUrl, tokenUrl: token.token_metadata?.logo, className: "size-10" })) : (_jsx(CircleHelp, { className: "text-b3-react-foreground size-10" })) }), _jsxs("div", { children: [_jsx("div", { className: "flex items-center gap-2", children: _jsx("span", { className: "text-b3-grey font-neue-montreal-semibold transition-colors duration-200 group-hover:font-bold group-hover:text-black", children: token.symbol }) }), _jsx("div", { className: "text-b3-foreground-muted font-neue-montreal-medium text-sm transition-colors duration-200 group-hover:text-gray-700", children: token.name })] })] }), _jsxs("div", { className: "text-right", children: [_jsx("div", { className: "text-b3-grey font-neue-montreal-semibold transition-colors duration-200 group-hover:font-bold group-hover:text-black", children: formatTokenAmount(BigInt(token.amount), token.decimals) }), _jsx("div", { className: "text-b3-foreground-muted font-neue-montreal-medium text-sm transition-colors duration-200 group-hover:text-gray-700", children: formatDisplayNumber(token.value_usd, { style: "currency", fractionDigits: 2 }) })] })] }, token.chain_id + "_" + token.address))) }) })) : (_jsxs("div", { className: "flex flex-col items-center justify-center py-12 text-center", children: [_jsx(CircleHelp, { className: "text-b3-foreground-muted mb-4 h-8 w-8" }), _jsx("p", { className: "text-b3-foreground-muted font-neue-montreal-medium text-sm", children: "No tokens available" })] })) })), step === "amount" && selectedToken && (_jsxs("div", { className: "flex flex-col gap-6 p-5", children: [_jsxs("div", { className: "flex items-center justify-between rounded-xl border border-[#d1d1d6] bg-[#fafafa] p-3", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "flex h-10 w-10 items-center justify-center", children: ALL_CHAINS[selectedToken.chain_id]?.logoUrl ? (_jsx(ChainTokenIcon, { chainUrl: ALL_CHAINS[selectedToken.chain_id].logoUrl, tokenUrl: selectedToken.token_metadata?.logo, className: "size-10" })) : (_jsx(CircleHelp, { className: "text-b3-react-foreground size-10" })) }), _jsxs("div", { children: [_jsx("div", { className: "font-neue-montreal-semibold text-base text-[#18181b]", children: selectedToken.symbol }), _jsx("div", { className: "font-neue-montreal-medium text-sm text-[#70707b]", children: formatTokenAmount(BigInt(selectedToken.amount), selectedToken.decimals) })] })] }), _jsx("button", { onClick: () => setStep("token"), className: "text-b3-primary-blue font-neue-montreal-semibold hover:text-b3-primary-blue/80 text-sm transition-colors", children: "Change" })] }), _jsxs("div", { className: "space-y-3", children: [_jsx(NumericFormat, { decimalSeparator: ".", allowedDecimalSeparators: [","], thousandSeparator: true, inputMode: "decimal", autoComplete: "off", autoCorrect: "off", type: "text", placeholder: "0.00", minLength: 1, maxLength: 30, spellCheck: "false", 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]", pattern: "^[0-9]*[.,]?[0-9]*$", disabled: isSending, value: sendAmount, allowNegative: false, onValueChange: values => setSendAmount(values.value) }), _jsx("div", { className: "grid grid-cols-4 gap-2", children: [25, 50, 75, 100].map(percentage => (_jsxs(Button, { variant: "outline", onClick: () => handlePercentageClick(percentage), className: "font-neue-montreal-medium border-[#d1d1d6] text-sm text-[#18181b] hover:bg-[#fafafa]", disabled: isSending, children: [percentage, "%"] }, percentage))) }), _jsxs("div", { className: "font-neue-montreal-medium text-sm text-[#70707b]", children: ["Available: ", formatTokenAmount(BigInt(selectedToken.amount), selectedToken.decimals), " ", selectedToken.symbol] })] }), _jsx(Button, { onClick: () => setStep("confirm"), disabled: !sendAmount || parseFloat(sendAmount) <= 0, 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", children: "Continue" })] })), step === "confirm" && selectedToken && (_jsxs("div", { className: "flex min-h-full flex-col", children: [_jsxs("div", { className: "flex flex-col items-center gap-4 px-5 pb-0 pt-6", children: [_jsx("div", { className: "flex h-14 w-14 items-center justify-center rounded-full bg-[#d5e5fd]", children: _jsx(SendIcon, { className: "h-7 w-7 text-[#0c68e9]" }) }), _jsxs("div", { className: "flex items-center gap-1", children: [_jsx("span", { className: "font-neue-montreal-semibold text-[30px] leading-[38px] text-[#18181b]", children: sendAmount }), _jsx("span", { className: "font-neue-montreal-semibold text-[30px] leading-[38px] text-[#70707b]", children: selectedToken.symbol })] })] }), _jsx("div", { className: "h-5" }), _jsx("div", { className: "flex flex-col gap-3 px-5", children: _jsx("div", { className: "rounded-xl border border-[#e4e4e7] bg-[#fafafa] p-4", children: _jsxs("div", { className: "flex flex-col gap-3", children: [_jsxs("div", { className: "flex items-center justify-between border-b border-[#e4e4e7] pb-3", children: [_jsx("span", { className: "font-inter text-sm font-normal leading-5 text-[#51525c]", children: "To" }), _jsxs("span", { className: "font-inter text-sm font-normal leading-5 text-[#18181b]", children: ["Wallet (", recipientAddress.slice(0, 6), "...", recipientAddress.slice(-4), ")"] })] }), _jsxs("div", { className: "flex items-center justify-between border-b border-[#e4e4e7] pb-3", children: [_jsx("span", { className: "font-inter text-sm font-normal leading-5 text-[#51525c]", children: "Network" }), _jsxs("div", { className: "flex items-center gap-1.5", children: [_jsx("span", { className: "font-inter text-sm font-normal leading-5 text-[#51525c]", children: ALL_CHAINS[selectedToken.chain_id]?.name || "Unknown" }), ALL_CHAINS[selectedToken.chain_id]?.logoUrl && (_jsx("img", { src: ALL_CHAINS[selectedToken.chain_id].logoUrl, alt: ALL_CHAINS[selectedToken.chain_id]?.name, className: "h-4 w-4 rounded-full" }))] })] }), _jsxs("div", { className: "flex items-center justify-between", children: [_jsx("span", { className: "font-inter text-sm font-normal leading-5 text-[#51525c]", children: "Network fee" }), _jsx("span", { className: "font-inter text-sm font-normal leading-5 text-[#18181b]", children: "$0.1" })] })] }) }) }), _jsx("div", { className: "flex-1" }), _jsxs("div", { className: "flex gap-4 border-t border-[#e4e4e7] bg-[#fafafa] p-4", children: [_jsx(Button, { onClick: handleBack, disabled: isSending, variant: "outline", 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]", children: "Cancel" }), _jsx(Button, { onClick: handleSend, disabled: isSending, 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]", children: isSending ? (_jsxs(_Fragment, { children: [_jsx(Loader2, { className: "mr-2 h-4 w-4 animate-spin" }), "Sending..."] })) : ("Send") })] })] })), step === "success" && selectedToken && (_jsxs("div", { className: "flex h-full flex-col items-center justify-center gap-6 p-5 text-center", children: [_jsx("div", { className: "flex h-14 w-14 items-center justify-center rounded-full bg-green-100", children: _jsx(SendIcon, { className: "h-7 w-7 text-green-600" }) }), _jsxs("div", { children: [_jsx("h3", { className: "font-neue-montreal-semibold mb-2 text-xl text-[#18181b]", children: "Sent!" }), _jsxs("p", { className: "font-neue-montreal-medium text-sm text-[#70707b]", children: [sendAmount, " ", selectedToken.symbol, " was sent to ", recipientAddress.slice(0, 6), "...", recipientAddress.slice(-4)] })] }), _jsx(Button, { onClick: () => setB3ModalOpen(false), className: "bg-b3-primary-blue hover:bg-b3-primary-blue/90 font-neue-montreal-semibold h-12 w-full rounded-xl text-white", children: "Done" })] }))] })] }));
188
+ }, children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "flex h-10 w-10 items-center justify-center rounded-full", children: ALL_CHAINS[token.chain_id]?.logoUrl ? (_jsx(ChainTokenIcon, { chainUrl: ALL_CHAINS[token.chain_id].logoUrl, tokenUrl: token.token_metadata?.logo, className: "size-10" })) : (_jsx(CircleHelp, { className: "text-b3-react-foreground size-10" })) }), _jsxs("div", { children: [_jsx("div", { className: "flex items-center gap-2", children: _jsx("span", { className: "text-b3-grey font-neue-montreal-semibold transition-colors duration-200 group-hover:font-bold group-hover:text-black", children: token.symbol }) }), _jsx("div", { className: "text-b3-foreground-muted font-neue-montreal-medium text-sm transition-colors duration-200 group-hover:text-gray-700", children: token.name })] })] }), _jsxs("div", { className: "text-right", children: [_jsx("div", { className: "text-b3-grey font-neue-montreal-semibold transition-colors duration-200 group-hover:font-bold group-hover:text-black", children: formatTokenAmount(BigInt(token.amount), token.decimals) }), _jsx("div", { className: "text-b3-foreground-muted font-neue-montreal-medium text-sm transition-colors duration-200 group-hover:text-gray-700", children: formatDisplayNumber(token.value_usd, { style: "currency", fractionDigits: 2 }) })] })] }, token.chain_id + "_" + token.address))) }) })) : (_jsxs("div", { className: "flex flex-col items-center justify-center py-12 text-center", children: [_jsx(CircleHelp, { className: "text-b3-foreground-muted mb-4 h-8 w-8" }), _jsx("p", { className: "text-b3-foreground-muted font-neue-montreal-medium text-sm", children: "No tokens available" })] })) })), step === "amount" && selectedToken && (_jsxs("div", { className: "flex flex-col gap-6 p-5", children: [_jsxs("div", { className: "dark:border-b3-line dark:bg-b3-background flex items-center justify-between rounded-xl border border-[#d1d1d6] bg-[#fafafa] p-3", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "flex h-10 w-10 items-center justify-center", children: ALL_CHAINS[selectedToken.chain_id]?.logoUrl ? (_jsx(ChainTokenIcon, { chainUrl: ALL_CHAINS[selectedToken.chain_id].logoUrl, tokenUrl: selectedToken.token_metadata?.logo, className: "size-10" })) : (_jsx(CircleHelp, { className: "text-b3-react-foreground size-10" })) }), _jsxs("div", { children: [_jsx("div", { className: "font-neue-montreal-semibold text-base text-[#18181b] dark:text-white", children: selectedToken.symbol }), _jsx("div", { className: "font-neue-montreal-medium text-sm text-[#70707b] dark:text-white", children: formatTokenAmount(BigInt(selectedToken.amount), selectedToken.decimals) })] })] }), _jsx("button", { onClick: () => setStep("token"), className: "text-b3-primary-blue font-neue-montreal-semibold hover:text-b3-primary-blue/80 text-sm transition-colors dark:text-white", children: "Change" })] }), _jsxs("div", { className: "space-y-3", children: [_jsx(NumericFormat, { decimalSeparator: ".", allowedDecimalSeparators: [","], thousandSeparator: true, inputMode: "decimal", autoComplete: "off", autoCorrect: "off", type: "text", placeholder: "0.00", minLength: 1, maxLength: 30, spellCheck: "false", className: "font-neue-montreal-medium placeholder:text-b3-foreground-muted dark:border-b3-line dark:bg-b3-background w-full rounded-lg border border-[#d1d1d6] bg-white px-3 py-2 text-base text-[#18181b] outline-none focus:border-[#0c68e9] dark:text-white", pattern: "^[0-9]*[.,]?[0-9]*$", disabled: isSending, value: sendAmount, allowNegative: false, onValueChange: values => setSendAmount(values.value) }), _jsx("div", { className: "grid grid-cols-4 gap-2", children: [25, 50, 75, 100].map(percentage => (_jsxs(Button, { variant: "outline", onClick: () => handlePercentageClick(percentage), className: "font-neue-montreal-medium dark:border-b3-line dark:bg-b3-background border-[#d1d1d6] text-sm text-[#18181b] hover:bg-[#fafafa] dark:text-white", disabled: isSending, children: [percentage, "%"] }, percentage))) }), _jsxs("div", { className: "font-neue-montreal-medium text-sm text-[#70707b]", children: ["Available: ", formatTokenAmount(BigInt(selectedToken.amount), selectedToken.decimals), " ", selectedToken.symbol] })] }), _jsx(Button, { onClick: () => setStep("confirm"), disabled: !sendAmount || parseFloat(sendAmount) <= 0, 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", children: "Continue" })] })), step === "confirm" && selectedToken && (_jsxs("div", { className: "flex min-h-full flex-col", children: [_jsxs("div", { className: "flex flex-col items-center gap-4 px-5 pb-0 pt-6", children: [_jsx("div", { className: "dark:bg-b3-line flex h-14 w-14 items-center justify-center rounded-full bg-[#d5e5fd]", children: _jsx(SendIcon, { className: "h-7 w-7 text-[#0c68e9]" }) }), _jsxs("div", { className: "flex items-center gap-1", children: [_jsx("span", { className: "font-neue-montreal-semibold text-[30px] leading-[38px] text-[#18181b] dark:text-white", children: sendAmount }), _jsx("span", { className: "font-neue-montreal-semibold text-[30px] leading-[38px] text-[#70707b] dark:text-white", children: selectedToken.symbol })] })] }), _jsx("div", { className: "h-5" }), _jsx("div", { className: "flex flex-col gap-3 px-5", children: _jsx("div", { className: "dark:border-b3-line dark:bg-b3-background rounded-xl border border-[#e4e4e7] bg-[#fafafa] p-4", children: _jsxs("div", { className: "flex flex-col gap-3", children: [_jsxs("div", { className: "dark:border-b3-line flex items-center justify-between border-b border-[#e4e4e7] pb-3", children: [_jsx("span", { className: "font-inter text-sm font-normal leading-5 text-[#51525c] dark:text-white", children: "To" }), _jsxs("span", { className: "font-inter text-sm font-normal leading-5 text-[#18181b] dark:text-white", children: ["Wallet (", recipientAddress.slice(0, 6), "...", recipientAddress.slice(-4), ")"] })] }), _jsxs("div", { className: "dark:border-b3-line flex items-center justify-between border-b border-[#e4e4e7] pb-3", children: [_jsx("span", { className: "font-inter text-sm font-normal leading-5 text-[#51525c] dark:text-white", children: "Network" }), _jsxs("div", { className: "flex items-center gap-1.5", children: [_jsx("span", { className: "font-inter text-sm font-normal leading-5 text-[#51525c] dark:text-white", children: ALL_CHAINS[selectedToken.chain_id]?.name || "Unknown" }), ALL_CHAINS[selectedToken.chain_id]?.logoUrl && (_jsx("img", { src: ALL_CHAINS[selectedToken.chain_id].logoUrl, alt: ALL_CHAINS[selectedToken.chain_id]?.name, className: "h-4 w-4 rounded-full" }))] })] }), _jsxs("div", { className: "flex items-center justify-between", children: [_jsx("span", { className: "font-inter text-sm font-normal leading-5 text-[#51525c] dark:text-white", children: "Network fee" }), _jsx("span", { className: "font-inter text-sm font-normal leading-5 text-[#18181b] dark:text-white", children: "$0.1" })] })] }) }) }), _jsx("div", { className: "flex-1" }), _jsxs("div", { className: "dark:border-b3-line dark:bg-b3-background flex gap-4 border-t border-[#e4e4e7] bg-[#fafafa] p-4", children: [_jsx(Button, { onClick: handleBack, disabled: isSending, variant: "outline", 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]", children: "Cancel" }), _jsx(Button, { onClick: handleSend, disabled: isSending, 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]", children: isSending ? (_jsxs(_Fragment, { children: [_jsx(Loader2, { className: "mr-2 h-4 w-4 animate-spin" }), "Sending..."] })) : ("Send") })] })] })), step === "success" && selectedToken && (_jsxs("div", { className: "flex h-full flex-col items-center justify-center gap-6 p-5 text-center", children: [_jsx("div", { className: "flex h-14 w-14 items-center justify-center rounded-full bg-green-100", children: _jsx(SendIcon, { className: "h-7 w-7 text-green-600" }) }), _jsxs("div", { children: [_jsx("h3", { className: "font-neue-montreal-semibold mb-2 text-xl text-[#18181b]", children: "Sent!" }), _jsxs("p", { className: "font-neue-montreal-medium text-sm text-[#70707b]", children: [sendAmount, " ", selectedToken.symbol, " was sent to ", recipientAddress.slice(0, 6), "...", recipientAddress.slice(-4)] })] }), _jsx(Button, { onClick: () => setB3ModalOpen(false), className: "bg-b3-primary-blue hover:bg-b3-primary-blue/90 font-neue-montreal-semibold h-12 w-full rounded-xl text-white", children: "Done" })] }))] })] }));
189
189
  }
@@ -30,7 +30,7 @@ export { useQueryBSMNT } from "./useQueryBSMNT";
30
30
  export { useRemoveSessionKey } from "./useRemoveSessionKey";
31
31
  export { useRouter } from "./useRouter";
32
32
  export { useSearchParamsSSR } from "./useSearchParamsSSR";
33
- export { useSimBalance } from "./useSimBalance";
33
+ export { useSimBalance, useSimSvmBalance } from "./useSimBalance";
34
34
  export { useSiwe } from "./useSiwe";
35
35
  export { useTokenBalance } from "./useTokenBalance";
36
36
  export { useTokenBalanceDirect } from "./useTokenBalanceDirect";
@@ -30,7 +30,7 @@ export { useQueryBSMNT } from "./useQueryBSMNT.js";
30
30
  export { useRemoveSessionKey } from "./useRemoveSessionKey.js";
31
31
  export { useRouter } from "./useRouter.js";
32
32
  export { useSearchParamsSSR } from "./useSearchParamsSSR.js";
33
- export { useSimBalance } from "./useSimBalance.js";
33
+ export { useSimBalance, useSimSvmBalance } from "./useSimBalance.js";
34
34
  export { useSiwe } from "./useSiwe.js";
35
35
  export { useTokenBalance } from "./useTokenBalance.js";
36
36
  export { useTokenBalanceDirect } from "./useTokenBalanceDirect.js";
@@ -21,4 +21,32 @@ export interface SimBalanceResponse {
21
21
  wallet_address: string;
22
22
  balances: SimBalanceItem[];
23
23
  }
24
+ export interface SvmBalanceItem {
25
+ chain: string;
26
+ address: string;
27
+ amount: string;
28
+ balance: string;
29
+ raw_balance: string;
30
+ value_usd?: number;
31
+ program_id: string | null;
32
+ decimals: number;
33
+ total_supply: string;
34
+ metadata_address?: string;
35
+ name?: string;
36
+ symbol: string;
37
+ uri?: string | null;
38
+ price_usd?: number;
39
+ liquidity_usd?: number;
40
+ pool_type?: string | null;
41
+ pool_address?: string | null;
42
+ mint_authority?: string | null;
43
+ }
44
+ export interface SvmBalanceResponse {
45
+ processing_time_ms?: number;
46
+ wallet_address: string;
47
+ next_offset?: string;
48
+ balances_count?: number;
49
+ balances: SvmBalanceItem[];
50
+ }
24
51
  export declare function useSimBalance(address?: string, chainIdsParam?: number[]): import("@tanstack/react-query").UseQueryResult<SimBalanceResponse, Error>;
52
+ export declare function useSimSvmBalance(address?: string, chains?: ("solana" | "eclipse")[], limit?: number): import("@tanstack/react-query").UseQueryResult<SvmBalanceResponse, Error>;
@@ -4,8 +4,8 @@ async function fetchSimBalance(address, chainIdsParam) {
4
4
  throw new Error("Address is required");
5
5
  const chainIds = chainIdsParam.length === 0 ? "mainnet" : chainIdsParam.join(",");
6
6
  let url = `https://simdune-api.sean-430.workers.dev/?url=https://api.sim.dune.com/v1/evm/balances/${address}?metadata=logo&chain_ids=${chainIds}&exclude_spam_tokens=true`;
7
- if (process.env.NEXT_PUBLIC_SIMDUNE_LOCAL_KEY) {
8
- url += `&localkey=${process.env.NEXT_PUBLIC_SIMDUNE_LOCAL_KEY}`;
7
+ if (process.env.NEXT_PUBLIC_DEVMODE_SHARED_SECRET) {
8
+ url += `&localkey=${process.env.NEXT_PUBLIC_DEVMODE_SHARED_SECRET}`;
9
9
  }
10
10
  const response = await fetch(url);
11
11
  if (!response.ok) {
@@ -14,6 +14,30 @@ async function fetchSimBalance(address, chainIdsParam) {
14
14
  const balanceData = await response.json();
15
15
  return balanceData;
16
16
  }
17
+ async function fetchSimSvmBalance(address, chains, limit) {
18
+ if (!address)
19
+ throw new Error("Address is required");
20
+ const queryParams = new URLSearchParams();
21
+ if (chains && chains.length > 0) {
22
+ queryParams.append("chains", chains.join(","));
23
+ }
24
+ if (limit) {
25
+ queryParams.append("limit", limit.toString());
26
+ }
27
+ let url = `https://simdune-api.sean-430.workers.dev/?url=https://api.sim.dune.com/beta/svm/balances/${address}`;
28
+ if (queryParams.toString()) {
29
+ url += `?${queryParams.toString()}`;
30
+ }
31
+ if (process.env.NEXT_PUBLIC_LOCAL_SIMDUNE_KEY) {
32
+ url += `${queryParams.toString() ? "&" : "?"}localkey=${process.env.NEXT_PUBLIC_LOCAL_SIMDUNE_KEY}`;
33
+ }
34
+ const response = await fetch(url);
35
+ if (!response.ok) {
36
+ throw new Error(`Failed to fetch SVM balance: ${response.statusText}`);
37
+ }
38
+ const balanceData = await response.json();
39
+ return balanceData;
40
+ }
17
41
  export function useSimBalance(address, chainIdsParam) {
18
42
  return useQuery({
19
43
  queryKey: ["simBalance", address, chainIdsParam],
@@ -25,3 +49,14 @@ export function useSimBalance(address, chainIdsParam) {
25
49
  enabled: Boolean(address),
26
50
  });
27
51
  }
52
+ export function useSimSvmBalance(address, chains, limit) {
53
+ return useQuery({
54
+ queryKey: ["svmBalance", address, chains, limit],
55
+ queryFn: () => {
56
+ if (!address)
57
+ throw new Error("Address is required");
58
+ return fetchSimSvmBalance(address, chains, limit);
59
+ },
60
+ enabled: Boolean(address),
61
+ });
62
+ }