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

package/dist/cjs/anyspend/react/components/AnySpend.js

@@ -849,7 +849,7 @@ function AnySpendInner({ destinationTokenAddress, destinationTokenChainId, mode
                                 type: "anySpend",
                             });
                         }
-                    }, children: (0, jsx_runtime_1.jsx)(BottomNavigation_1.default, {}) }) })] }));
+                    }, children: mode !== "page" && (0, jsx_runtime_1.jsx)(BottomNavigation_1.default, {}) }) })] }));
     const onrampPaymentView = ((0, jsx_runtime_1.jsx)(PanelOnrampPayment_1.PanelOnrampPayment, { srcAmountOnRamp: srcAmountOnRamp, recipientName: recipientName || undefined, recipientAddress: effectiveRecipientAddress, isBuyMode: isBuyMode, destinationTokenChainId: destinationTokenChainId, destinationTokenAddress: destinationTokenAddress, selectedDstChainId: selectedDstChainId, selectedDstToken: selectedDstToken, orderType: "swap", anyspendQuote: anyspendQuote, globalAddress: globalAddress, onOrderCreated: orderId => {
             setOrderId(orderId);
             navigateToPanel(PanelView.ORDER_DETAILS, "forward");

package/dist/cjs/global-account/react/components/AvatarEditor/AvatarEditor.js

@@ -321,7 +321,7 @@ function AvatarEditor({ onSetAvatar, className }) {
         };
     })
         .filter(p => p.avatar !== null) || []; // Filter out profiles with invalid avatars
-    return ((0, jsx_runtime_1.jsxs)("div", { className: (0, cn_1.cn)("b3-modal-avatar-editor flex w-full max-w-md flex-col bg-white", className), children: [viewStep === "upload" && (0, jsx_runtime_1.jsx)(ModalHeader_1.default, { title: "Upload Image" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col items-center p-6", children: [viewStep === "select" ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { className: "relative mb-6", children: (0, jsx_runtime_1.jsx)("div", { className: "h-32 w-32 overflow-hidden rounded-full", children: safePreviewUrl || selectedAvatar || currentAvatar ? ((0, jsx_runtime_1.jsx)(react_1.IPFSMediaRenderer, { src: safePreviewUrl || selectedAvatar || currentAvatar || "", alt: "Avatar preview", className: "h-full w-full object-cover" })) : ((0, jsx_runtime_1.jsx)("div", { className: "bg-b3-primary-wash h-full w-full" })) }) }), (0, jsx_runtime_1.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: [(0, jsx_runtime_1.jsx)(lucide_react_1.Upload, { className: "h-4 w-4" }), "Upload image"] }), (0, jsx_runtime_1.jsxs)("div", { className: "w-full", children: [(0, jsx_runtime_1.jsx)("h3", { className: "mb-2 text-base font-semibold text-[#18181b]", children: "Select your profile image" }), (0, jsx_runtime_1.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." }), (0, jsx_runtime_1.jsx)("div", { className: "mb-4 flex gap-3", children: profileAvatars.map((profileAvatar, index) => {
+    return ((0, jsx_runtime_1.jsxs)("div", { className: (0, cn_1.cn)("b3-modal-avatar-editor dark:bg-b3-background flex w-full max-w-md flex-col bg-white", className), children: [viewStep === "upload" && (0, jsx_runtime_1.jsx)(ModalHeader_1.default, { title: "Upload Image" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col items-center p-6", children: [viewStep === "select" ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { className: "relative mb-6", children: (0, jsx_runtime_1.jsx)("div", { className: "h-32 w-32 overflow-hidden rounded-full", children: safePreviewUrl || selectedAvatar || currentAvatar ? ((0, jsx_runtime_1.jsx)(react_1.IPFSMediaRenderer, { src: safePreviewUrl || selectedAvatar || currentAvatar || "", alt: "Avatar preview", className: "h-full w-full object-cover" })) : ((0, jsx_runtime_1.jsx)("div", { className: "bg-b3-primary-wash h-full w-full" })) }) }), (0, jsx_runtime_1.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: [(0, jsx_runtime_1.jsx)(lucide_react_1.Upload, { className: "h-4 w-4" }), "Upload image"] }), (0, jsx_runtime_1.jsxs)("div", { className: "w-full", children: [(0, jsx_runtime_1.jsx)("h3", { className: "mb-2 text-base font-semibold text-[#18181b]", children: "Select your profile image" }), (0, jsx_runtime_1.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." }), (0, jsx_runtime_1.jsx)("div", { className: "mb-4 flex gap-3", children: profileAvatars.map((profileAvatar, index) => {
                                             // Skip if avatar is null (should not happen due to filter, but TypeScript doesn't know that)
                                             if (!profileAvatar.avatar)
                                                 return null;
@@ -329,8 +329,8 @@ function AvatarEditor({ onSetAvatar, className }) {
                                                             ? "border-[#3368ef] ring-2 ring-[#3368ef]/20"
                                                             : "border-transparent hover:border-[#e4e4e7]"), children: (0, jsx_runtime_1.jsx)(react_1.IPFSMediaRenderer, { src: profileAvatar.avatar || "", alt: `${profileAvatar.type} avatar`, className: "h-full w-full object-cover" }) }), hoveredProfile === profileAvatar.type && ((0, jsx_runtime_1.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));
                                         }) }), (0, jsx_runtime_1.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: [(0, jsx_runtime_1.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: (0, jsx_runtime_1.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"] })] })] })) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: !selectedFile && !previewUrl ? ((0, jsx_runtime_1.jsxs)("div", { onClick: handleOpenFilePicker, onDragEnter: handleDragEnter, onDragLeave: handleDragLeave, onDragOver: handleDragOver, onDrop: handleDrop, className: (0, cn_1.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
-                                ? "border-[#3368ef] bg-[#f0f5ff]"
-                                : "border-[#e4e4e7] hover:border-[#3368ef] hover:bg-[#f0f5ff]"), children: [(0, jsx_runtime_1.jsxs)("p", { className: "font-inter mb-1 text-sm", children: [(0, jsx_runtime_1.jsx)("span", { className: "font-semibold text-[#3368ef]", children: "Click to upload" }), (0, jsx_runtime_1.jsx)("span", { className: "text-[#71717a]", children: " or drag and drop" })] }), (0, jsx_runtime_1.jsx)("p", { className: "text-xs text-[#71717a]", children: "PNG, JPG or GIF (up to 5MB)" })] })) : ((0, jsx_runtime_1.jsxs)("div", { className: "mb-6 w-full", children: [(0, jsx_runtime_1.jsx)("div", { className: "relative aspect-square w-full overflow-hidden rounded-xl bg-[#f4f4f5]", children: safePreviewUrl ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_easy_crop_1.default, { image: safePreviewUrl, crop: crop, zoom: zoom, aspect: 1, onCropChange: setCrop, onCropComplete: onCropComplete, onZoomChange: setZoom, cropShape: "rect", showGrid: false, style: {
+                                ? "dark:border-b3-line dark:bg-b3-react-primary border-[#3368ef] bg-[#f0f5ff]"
+                                : "dark:border-b3-line dark:bg-b3-background border-[#e4e4e7] hover:border-[#3368ef] hover:bg-[#f0f5ff]"), children: [(0, jsx_runtime_1.jsxs)("p", { className: "font-inter mb-1 text-sm", children: [(0, jsx_runtime_1.jsx)("span", { className: "font-semibold text-[#3368ef] dark:text-white", children: "Click to upload" }), (0, jsx_runtime_1.jsx)("span", { className: "text-[#71717a]", children: " or drag and drop" })] }), (0, jsx_runtime_1.jsx)("p", { className: "text-xs text-[#71717a] dark:text-white", children: "PNG, JPG or GIF (up to 5MB)" })] })) : ((0, jsx_runtime_1.jsxs)("div", { className: "mb-6 w-full", children: [(0, jsx_runtime_1.jsx)("div", { className: "relative aspect-square w-full overflow-hidden rounded-xl bg-[#f4f4f5]", children: safePreviewUrl ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_easy_crop_1.default, { image: safePreviewUrl, crop: crop, zoom: zoom, aspect: 1, onCropChange: setCrop, onCropComplete: onCropComplete, onZoomChange: setZoom, cropShape: "rect", showGrid: false, style: {
                                                     containerStyle: {
                                                         width: "100%",
                                                         height: "100%",
@@ -340,5 +340,5 @@ function AvatarEditor({ onSetAvatar, className }) {
                                                         border: "2px solid #3368ef",
                                                         borderRadius: "0px",
                                                     },
-                                                } }), (0, jsx_runtime_1.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: (0, jsx_runtime_1.jsx)(lucide_react_1.X, { className: "h-4 w-4" }) })] })) : ((0, jsx_runtime_1.jsx)("div", { className: "bg-b3-primary-wash h-full w-full" })) }), safePreviewUrl && ((0, jsx_runtime_1.jsxs)("div", { className: "mt-4 flex items-center gap-3", children: [(0, jsx_runtime_1.jsx)("label", { className: "shrink-0 text-sm font-semibold text-[#475467]", children: "Zoom" }), (0, jsx_runtime_1.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]" })] }))] })) })), (0, jsx_runtime_1.jsx)("input", { ref: fileInputRef, type: "file", accept: "image/*", onChange: handleFileSelect, className: "hidden" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "font-inter flex gap-3 border-t border-[#e4e4e7] p-6 font-semibold", children: [(0, jsx_runtime_1.jsx)(react_1.Button, { onClick: handleCancel, variant: "outline", disabled: isLoading, className: "flex-1 rounded-xl border-[#e4e4e7] text-[#18181b] hover:bg-[#f4f4f5]", children: "Cancel" }), (0, jsx_runtime_1.jsx)(react_1.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 ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "mr-2 h-4 w-4 animate-spin" }), "Saving..."] })) : ("Save changes") })] })] }));
+                                                } }), (0, jsx_runtime_1.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: (0, jsx_runtime_1.jsx)(lucide_react_1.X, { className: "h-4 w-4" }) })] })) : ((0, jsx_runtime_1.jsx)("div", { className: "bg-b3-primary-wash h-full w-full" })) }), safePreviewUrl && ((0, jsx_runtime_1.jsxs)("div", { className: "mt-4 flex items-center gap-3", children: [(0, jsx_runtime_1.jsx)("label", { className: "shrink-0 text-sm font-semibold text-[#475467]", children: "Zoom" }), (0, jsx_runtime_1.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]" })] }))] })) })), (0, jsx_runtime_1.jsx)("input", { ref: fileInputRef, type: "file", accept: "image/*", onChange: handleFileSelect, className: "hidden" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "font-inter flex gap-3 border-t border-[#e4e4e7] p-6 font-semibold", children: [(0, jsx_runtime_1.jsx)(react_1.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" }), (0, jsx_runtime_1.jsx)(react_1.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 ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "mr-2 h-4 w-4 animate-spin" }), "Saving..."] })) : ("Save changes") })] })] }));
 }

package/dist/cjs/global-account/react/components/ManageAccount/Header.js

@@ -76,7 +76,7 @@ function WalletItem({ wallet, isActive, onClick }) {
                     : isGlobalAccount
                         ? "Smart Wallet"
                         : "Wallet";
-    return ((0, jsx_runtime_1.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: [(0, jsx_runtime_1.jsx)("div", { className: "relative size-10 shrink-0 text-clip rounded-full", children: isGlobalAccount ? ((0, jsx_runtime_1.jsx)("div", { className: "flex size-full items-center justify-center p-1", children: (0, jsx_runtime_1.jsx)("img", { src: "https://cdn.b3.fun/b3_logo.svg", alt: "B3", className: "size-full object-contain" }) })) : walletImage ? ((0, jsx_runtime_1.jsx)("img", { src: walletImage, alt: walletName, className: "size-full object-contain p-1" })) : ((0, jsx_runtime_1.jsx)("div", { className: "flex size-full items-center justify-center", children: (0, jsx_runtime_1.jsx)(WalletIcon_1.WalletIcon, {}) })) }), (0, jsx_runtime_1.jsxs)("div", { className: "flex min-w-0 flex-1 flex-col gap-1", children: [(0, jsx_runtime_1.jsx)("p", { className: "text-b3-grey font-neue-montreal-semibold truncate text-sm", children: walletName }), (0, jsx_runtime_1.jsx)("p", { className: "text-b3-foreground-muted font-neue-montreal-medium text-sm", children: centerTruncate(address, 4) })] }), isActive && ((0, jsx_runtime_1.jsx)("div", { className: "shrink-0", children: (0, jsx_runtime_1.jsx)(CheckIcon, {}) }))] }));
+    return ((0, jsx_runtime_1.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: [(0, jsx_runtime_1.jsx)("div", { className: "relative size-10 shrink-0 text-clip rounded-full", children: isGlobalAccount ? ((0, jsx_runtime_1.jsx)("div", { className: "flex size-full items-center justify-center p-1", children: (0, jsx_runtime_1.jsx)("img", { src: "https://cdn.b3.fun/b3_logo.svg", alt: "B3", className: "size-full object-contain" }) })) : walletImage ? ((0, jsx_runtime_1.jsx)("img", { src: walletImage, alt: walletName, className: "size-full object-contain p-1" })) : ((0, jsx_runtime_1.jsx)("div", { className: "flex size-full items-center justify-center", children: (0, jsx_runtime_1.jsx)(WalletIcon_1.WalletIcon, {}) })) }), (0, jsx_runtime_1.jsxs)("div", { className: "flex min-w-0 flex-1 flex-col gap-1", children: [(0, jsx_runtime_1.jsx)("p", { className: "text-b3-grey font-neue-montreal-semibold truncate text-sm", children: walletName }), (0, jsx_runtime_1.jsx)("p", { className: "text-b3-foreground-muted font-neue-montreal-medium text-sm", children: centerTruncate(address, 4) })] }), isActive && ((0, jsx_runtime_1.jsx)("div", { className: "shrink-0", children: (0, jsx_runtime_1.jsx)(CheckIcon, {}) }))] }));
 }
 function Header({ onLogout }) {
     const activeWallet = (0, react_3.useActiveWallet)();
@@ -114,7 +114,7 @@ function Header({ onLogout }) {
             },
         });
     };
-    return ((0, jsx_runtime_1.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: (0, jsx_runtime_1.jsxs)(AccordionPrimitive.Item, { value: "wallet-switcher", className: "border-none", children: [(0, jsx_runtime_1.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: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)("div", { className: "relative size-10 shrink-0 text-clip rounded-full", children: isActiveGlobalAccount ? ((0, jsx_runtime_1.jsx)("div", { className: "flex size-full items-center justify-center p-1", children: (0, jsx_runtime_1.jsx)("img", { src: "https://cdn.b3.fun/b3_logo.svg", alt: "B3", className: "size-full object-contain" }) })) : activeWalletImage ? ((0, jsx_runtime_1.jsx)("img", { src: activeWalletImage, alt: "Active Wallet", className: "size-full object-contain p-1" })) : ((0, jsx_runtime_1.jsx)("div", { className: "flex size-full items-center justify-center", children: (0, jsx_runtime_1.jsx)(WalletIcon_1.WalletIcon, {}) })) }), (0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col gap-0.5", children: [(0, jsx_runtime_1.jsx)("p", { className: "text-b3-grey font-neue-montreal-semibold text-left text-sm", children: "Active Wallet" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-1", children: [(0, jsx_runtime_1.jsx)("p", { className: "text-b3-foreground-muted font-neue-montreal-medium text-sm", children: centerTruncate(address, 4) }), (0, jsx_runtime_1.jsx)(react_1.CopyToClipboard, { text: address })] })] })] }), (0, jsx_runtime_1.jsx)(ChevronDownIcon_1.ChevronDownIcon, { className: "b3-modal-wallet-switcher-chevron text-b3-grey transition-transform duration-200 group-data-[state=open]:rotate-180" })] }), (0, jsx_runtime_1.jsx)(framer_motion_1.AnimatePresence, { children: isExpanded && ((0, jsx_runtime_1.jsx)(AccordionPrimitive.Content, { forceMount: true, className: "absolute left-0 right-0 top-full z-50 overflow-visible", children: (0, jsx_runtime_1.jsxs)(framer_motion_1.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: [(0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col gap-3", children: [connectedWallets.map(wallet => ((0, jsx_runtime_1.jsx)(WalletItem, { wallet: wallet, isActive: activeWallet?.id === wallet.id, onClick: () => handleWalletSwitch(wallet) }, wallet.id))), (0, jsx_runtime_1.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: [(0, jsx_runtime_1.jsx)("div", { className: "bg-b3-line flex size-10 shrink-0 items-center justify-center rounded-full", children: (0, jsx_runtime_1.jsx)(LinkIcon_1.default, { className: "text-b3-grey" }) }), (0, jsx_runtime_1.jsx)("div", { className: "flex flex-1 flex-col", children: (0, jsx_runtime_1.jsx)("p", { className: "text-b3-grey font-neue-montreal-semibold text-sm", children: "Link another wallet" }) })] })] }), (0, jsx_runtime_1.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: {
+    return ((0, jsx_runtime_1.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: (0, jsx_runtime_1.jsxs)(AccordionPrimitive.Item, { value: "wallet-switcher", className: "border-none", children: [(0, jsx_runtime_1.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: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)("div", { className: "relative size-10 shrink-0 text-clip rounded-full", children: isActiveGlobalAccount ? ((0, jsx_runtime_1.jsx)("div", { className: "flex size-full items-center justify-center p-1", children: (0, jsx_runtime_1.jsx)("img", { src: "https://cdn.b3.fun/b3_logo.svg", alt: "B3", className: "size-full object-contain" }) })) : activeWalletImage ? ((0, jsx_runtime_1.jsx)("img", { src: activeWalletImage, alt: "Active Wallet", className: "size-full object-contain p-1" })) : ((0, jsx_runtime_1.jsx)("div", { className: "flex size-full items-center justify-center", children: (0, jsx_runtime_1.jsx)(WalletIcon_1.WalletIcon, {}) })) }), (0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col gap-0.5", children: [(0, jsx_runtime_1.jsx)("p", { className: "text-b3-grey font-neue-montreal-semibold text-left text-sm", children: "Active Wallet" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-1", children: [(0, jsx_runtime_1.jsx)("p", { className: "text-b3-foreground-muted font-neue-montreal-medium text-sm", children: centerTruncate(address, 4) }), (0, jsx_runtime_1.jsx)(react_1.CopyToClipboard, { text: address })] })] })] }), (0, jsx_runtime_1.jsx)(ChevronDownIcon_1.ChevronDownIcon, { className: "b3-modal-wallet-switcher-chevron text-b3-grey transition-transform duration-200 group-data-[state=open]:rotate-180" })] }), (0, jsx_runtime_1.jsx)(framer_motion_1.AnimatePresence, { children: isExpanded && ((0, jsx_runtime_1.jsx)(AccordionPrimitive.Content, { forceMount: true, className: "absolute left-0 right-0 top-full z-50 overflow-visible", children: (0, jsx_runtime_1.jsxs)(framer_motion_1.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: [(0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col gap-3", children: [connectedWallets.map(wallet => ((0, jsx_runtime_1.jsx)(WalletItem, { wallet: wallet, isActive: activeWallet?.id === wallet.id, onClick: () => handleWalletSwitch(wallet) }, wallet.id))), (0, jsx_runtime_1.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: [(0, jsx_runtime_1.jsx)("div", { className: "bg-b3-line flex size-10 shrink-0 items-center justify-center rounded-full", children: (0, jsx_runtime_1.jsx)(LinkIcon_1.default, { className: "text-b3-grey" }) }), (0, jsx_runtime_1.jsx)("div", { className: "flex flex-1 flex-col", children: (0, jsx_runtime_1.jsx)("p", { className: "text-b3-grey font-neue-montreal-semibold text-sm", children: "Link another wallet" }) })] })] }), (0, jsx_runtime_1.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: {
                                         boxShadow: "inset 0px 0px 0px 1px rgba(10,13,18,0.18), inset 0px -2px 0px 0px rgba(10,13,18,0.05)",
                                     }, children: [logoutLoading ? ((0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "animate-spin", size: 20 })) : ((0, jsx_runtime_1.jsx)(SignOutIcon_1.default, { size: 20, className: "text-b3-grey" })), (0, jsx_runtime_1.jsx)("p", { className: "text-b3-grey font-neue-montreal-semibold text-base", children: "Sign out" })] })] }) })) })] }) }));
 }

package/dist/cjs/global-account/react/components/ManageAccount/NotificationChannel.js

@@ -4,7 +4,7 @@ exports.NotificationChannel = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const utils_1 = require("../../../../shared/utils");
 const NotificationChannel = ({ icon, title, isConnected, isConnecting, isDisconnecting, connectedInfo, inputSection, addButtonSection, iconClassName, onToggle, showBorder = true, }) => {
-    return ((0, jsx_runtime_1.jsxs)("div", { className: `flex items-start gap-3 p-[15px] ${showBorder ? "border-b border-[#e4e4e7]" : ""}`, children: [(0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)("flex h-10 w-10 shrink-0 items-center justify-center", iconClassName), children: icon }), (0, jsx_runtime_1.jsxs)("div", { className: "flex-1", children: [(0, jsx_runtime_1.jsx)("p", { className: "font-['PP_Neue_Montreal','PP_Neue_Montreal_Fallback',sans-serif] text-[14px] font-semibold leading-[20px] text-[#3f3f46]", children: title }), isConnecting ? ((0, jsx_runtime_1.jsx)("div", { className: "mt-1", children: (0, jsx_runtime_1.jsx)("p", { className: "font-['PP_Neue_Montreal','PP_Neue_Montreal_Fallback',sans-serif] text-[14px] leading-[20px] text-[#51525c]", children: "Connecting..." }) })) : isDisconnecting ? ((0, jsx_runtime_1.jsx)("div", { className: "mt-1", children: (0, jsx_runtime_1.jsx)("p", { className: "font-['PP_Neue_Montreal','PP_Neue_Montreal_Fallback',sans-serif] text-[14px] leading-[20px] text-[#51525c]", children: "Disconnecting..." }) })) : isConnected && connectedInfo ? ((0, jsx_runtime_1.jsx)("div", { className: "mt-1", children: (0, jsx_runtime_1.jsx)("p", { className: "font-['PP_Neue_Montreal','PP_Neue_Montreal_Fallback',sans-serif] text-[14px] leading-[20px] text-[#51525c]", children: connectedInfo }) })) : inputSection ? (inputSection) : (addButtonSection)] }), (0, jsx_runtime_1.jsx)(ToggleSwitch, { enabled: isConnected, onChange: onToggle })] }));
+    return ((0, jsx_runtime_1.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: [(0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)("flex h-10 w-10 shrink-0 items-center justify-center", iconClassName), children: icon }), (0, jsx_runtime_1.jsxs)("div", { className: "flex-1", children: [(0, jsx_runtime_1.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 ? ((0, jsx_runtime_1.jsx)("div", { className: "mt-1", children: (0, jsx_runtime_1.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 ? ((0, jsx_runtime_1.jsx)("div", { className: "mt-1", children: (0, jsx_runtime_1.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 ? ((0, jsx_runtime_1.jsx)("div", { className: "mt-1", children: (0, jsx_runtime_1.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)] }), (0, jsx_runtime_1.jsx)(ToggleSwitch, { enabled: isConnected, onChange: onToggle })] }));
 };
 exports.NotificationChannel = NotificationChannel;
 // Toggle Switch Component

package/dist/cjs/global-account/react/components/ManageAccount/NotificationsContent.js

@@ -147,6 +147,6 @@ const NotificationsContent = ({ partnerId, chain, onSuccess }) => {
     if (loading) {
         return ((0, jsx_runtime_1.jsxs)("div", { className: "flex h-[470px] flex-col", children: [(0, jsx_runtime_1.jsx)(ModalHeader_1.default, { showBackButton: true, showCloseButton: false, title: "Notifications", handleBack: handleBack }), (0, jsx_runtime_1.jsx)("div", { className: "flex flex-1 items-center justify-center", children: (0, jsx_runtime_1.jsx)("div", { className: "font-['PP_Neue_Montreal','PP_Neue_Montreal_Fallback',sans-serif] text-[14px] leading-[20px] text-gray-500", children: "Loading..." }) })] }));
     }
-    return ((0, jsx_runtime_1.jsxs)("div", { className: "flex h-[470px] flex-col", children: [(0, jsx_runtime_1.jsx)(ModalHeader_1.default, { showBackButton: true, showCloseButton: false, title: "Notifications", handleBack: handleBack }), (0, jsx_runtime_1.jsxs)("div", { className: "flex-1 space-y-2 overflow-y-auto px-5 py-6", children: [error && ((0, jsx_runtime_1.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 && ((0, jsx_runtime_1.jsxs)("div", { className: "rounded-[20px] bg-[#f4f4f5]", children: [(0, jsx_runtime_1.jsx)(channels_1.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) }), (0, jsx_runtime_1.jsx)(channels_1.EmailChannel, { userId: userId, jwtToken: jwtToken, emailChannel: emailChannel, isConnected: emailConnected, isOptimisticallyConnected: optimisticEmailConnected, onConnectionChange: handleConnectionChange, onToggle: enabled => handleToggleChannel("email", enabled) }), (0, jsx_runtime_1.jsx)(channels_1.TelegramChannel, { userId: userId, jwtToken: jwtToken, telegramChannel: telegramChannel, isConnected: telegramConnected, isOptimisticallyConnected: optimisticTelegramConnected, onConnectionChange: handleConnectionChange, onToggle: enabled => handleToggleChannel("telegram", enabled) }), (0, jsx_runtime_1.jsx)(channels_1.DiscordChannel, { userId: userId, jwtToken: jwtToken, discordChannel: discordChannel, isConnected: discordConnected, isOptimisticallyConnected: optimisticDiscordConnected, onConnectionChange: handleConnectionChange, onToggle: enabled => handleToggleChannel("discord", enabled) })] })), process.env.NODE_ENV === "development" && hasAnyChannelConnected && ((0, jsx_runtime_1.jsxs)("div", { className: "mt-6 rounded-xl border border-[#e4e4e7] bg-white p-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "mb-3 flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-lg", children: "\uD83E\uDDEA" }), (0, jsx_runtime_1.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" })] }), (0, jsx_runtime_1.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." }), (0, jsx_runtime_1.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 && ((0, jsx_runtime_1.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." }))] }))] })] }));
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "flex h-[470px] flex-col", children: [(0, jsx_runtime_1.jsx)(ModalHeader_1.default, { showBackButton: true, showCloseButton: false, title: "Notifications", handleBack: handleBack }), (0, jsx_runtime_1.jsxs)("div", { className: "flex-1 space-y-2 overflow-y-auto px-5 py-6", children: [error && ((0, jsx_runtime_1.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 && ((0, jsx_runtime_1.jsxs)("div", { className: "b3-modal-notifications-channels dark:bg-b3-background rounded-[20px] bg-[#f4f4f5]", children: [(0, jsx_runtime_1.jsx)(channels_1.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) }), (0, jsx_runtime_1.jsx)(channels_1.EmailChannel, { userId: userId, jwtToken: jwtToken, emailChannel: emailChannel, isConnected: emailConnected, isOptimisticallyConnected: optimisticEmailConnected, onConnectionChange: handleConnectionChange, onToggle: enabled => handleToggleChannel("email", enabled) }), (0, jsx_runtime_1.jsx)(channels_1.TelegramChannel, { userId: userId, jwtToken: jwtToken, telegramChannel: telegramChannel, isConnected: telegramConnected, isOptimisticallyConnected: optimisticTelegramConnected, onConnectionChange: handleConnectionChange, onToggle: enabled => handleToggleChannel("telegram", enabled) }), (0, jsx_runtime_1.jsx)(channels_1.DiscordChannel, { userId: userId, jwtToken: jwtToken, discordChannel: discordChannel, isConnected: discordConnected, isOptimisticallyConnected: optimisticDiscordConnected, onConnectionChange: handleConnectionChange, onToggle: enabled => handleToggleChannel("discord", enabled) })] })), process.env.NODE_ENV === "development" && hasAnyChannelConnected && ((0, jsx_runtime_1.jsxs)("div", { className: "mt-6 rounded-xl border border-[#e4e4e7] bg-white p-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "mb-3 flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-lg", children: "\uD83E\uDDEA" }), (0, jsx_runtime_1.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" })] }), (0, jsx_runtime_1.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." }), (0, jsx_runtime_1.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 && ((0, jsx_runtime_1.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." }))] }))] })] }));
 };
 exports.default = NotificationsContent;

package/dist/cjs/global-account/react/components/ManageAccount/SettingsContent.js

@@ -55,6 +55,6 @@ const SettingsContent = ({ partnerId, onLogout, chain, }) => {
         }
         setB3ModalOpen(true);
     };
-    return ((0, jsx_runtime_1.jsxs)("div", { className: "flex h-[470px] flex-col", children: [(0, jsx_runtime_1.jsx)(ModalHeader_1.default, { showBackButton: false, showCloseButton: false, title: "Settings" }), (0, jsx_runtime_1.jsx)("div", { className: "p-5", children: (0, jsx_runtime_1.jsx)("div", { className: "b3-modal-settings-profile-card flex items-center rounded-xl border border-[#e4e4e7] bg-[#f4f4f5] p-4", children: (0, jsx_runtime_1.jsx)(SettingsProfileCard_1.default, {}) }) }), (0, jsx_runtime_1.jsxs)("div", { className: "space-y-3 px-5", children: [(0, jsx_runtime_1.jsx)(SettingsMenuItem_1.default, { icon: (0, jsx_runtime_1.jsx)("svg", { width: "40", height: "40", viewBox: "0 0 40 40", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: (0, jsx_runtime_1.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") }), (0, jsx_runtime_1.jsx)(SettingsMenuItem_1.default, { icon: (0, jsx_runtime_1.jsx)("svg", { width: "40", height: "40", viewBox: "0 0 40 40", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: (0, jsx_runtime_1.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") })] })] }));
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "flex h-[470px] flex-col", children: [(0, jsx_runtime_1.jsx)(ModalHeader_1.default, { showBackButton: false, showCloseButton: false, title: "Settings" }), (0, jsx_runtime_1.jsx)("div", { className: "p-5", children: (0, jsx_runtime_1.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: (0, jsx_runtime_1.jsx)(SettingsProfileCard_1.default, {}) }) }), (0, jsx_runtime_1.jsxs)("div", { className: "space-y-3 px-5", children: [(0, jsx_runtime_1.jsx)(SettingsMenuItem_1.default, { icon: (0, jsx_runtime_1.jsx)("svg", { width: "40", height: "40", viewBox: "0 0 40 40", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: (0, jsx_runtime_1.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") }), (0, jsx_runtime_1.jsx)(SettingsMenuItem_1.default, { icon: (0, jsx_runtime_1.jsx)("svg", { width: "40", height: "40", viewBox: "0 0 40 40", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: (0, jsx_runtime_1.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") })] })] }));
 };
 exports.default = SettingsContent;

package/dist/cjs/global-account/react/components/ManageAccount/SettingsMenuItem.js

@@ -3,6 +3,6 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const jsx_runtime_1 = require("react/jsx-runtime");
 const lucide_react_1 = require("lucide-react");
 const SettingsMenuItem = ({ icon, title, subtitle, onClick }) => {
-    return ((0, jsx_runtime_1.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: [(0, jsx_runtime_1.jsx)("div", { className: "flex size-10 items-center justify-center rounded-full bg-[#f4f4f5]", children: icon }), (0, jsx_runtime_1.jsxs)("div", { className: "flex flex-1 flex-col items-start gap-1 text-left", children: [(0, jsx_runtime_1.jsx)("span", { className: "font-neue-montreal-semibold text-[14px] leading-none tracking-[-0.28px] text-[#3f3f46]", children: title }), (0, jsx_runtime_1.jsx)("span", { className: "font-neue-montreal-medium text-[14px] leading-none tracking-[-0.28px] text-[#70707b]", children: subtitle })] }), (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronRight, { size: 20, className: "text-[#51525c]" })] }));
+    return ((0, jsx_runtime_1.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: [(0, jsx_runtime_1.jsx)("div", { className: "dark:bg-b3-line flex size-10 items-center justify-center rounded-full bg-[#f4f4f5]", children: icon }), (0, jsx_runtime_1.jsxs)("div", { className: "flex flex-1 flex-col items-start gap-1 text-left dark:text-white", children: [(0, jsx_runtime_1.jsx)("span", { className: "font-neue-montreal-semibold text-[14px] leading-none tracking-[-0.28px] text-[#3f3f46] dark:text-white", children: title }), (0, jsx_runtime_1.jsx)("span", { className: "dark:text-b3-foreground-muted font-neue-montreal-medium text-[14px] leading-none tracking-[-0.28px] text-[#70707b]", children: subtitle })] }), (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronRight, { size: 20, className: "text-[#51525c]" })] }));
 };
 exports.default = SettingsMenuItem;

package/dist/cjs/global-account/react/components/ManageAccount/SettingsProfileCard.js

@@ -107,10 +107,10 @@ const SettingsProfileCard = () => {
             handleCancelEdit();
         }
     };
-    return ((0, jsx_runtime_1.jsxs)("div", { className: "flex w-full items-center gap-3", children: [(0, jsx_runtime_1.jsxs)("div", { className: "relative shrink-0", children: [(0, jsx_runtime_1.jsx)(IPFSMediaRenderer_1.IPFSMediaRenderer, { src: avatarSrc, alt: "Profile", className: "border-black/8 size-14 rounded-full border object-cover" }), (0, jsx_runtime_1.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: (0, jsx_runtime_1.jsx)(lucide_react_1.Pencil, { size: 10, className: "text-white", strokeWidth: 2.5 }) })] }), (0, jsx_runtime_1.jsx)("div", { className: "flex shrink-0 flex-col gap-1", children: isEditingUsername ? (
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "flex w-full items-center gap-3", children: [(0, jsx_runtime_1.jsxs)("div", { className: "relative shrink-0", children: [(0, jsx_runtime_1.jsx)(IPFSMediaRenderer_1.IPFSMediaRenderer, { src: avatarSrc, alt: "Profile", className: "border-b3-line dark:border-white/8 size-14 rounded-full border object-cover" }), (0, jsx_runtime_1.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: (0, jsx_runtime_1.jsx)(lucide_react_1.Pencil, { size: 10, className: "text-white", strokeWidth: 2.5 }) })] }), (0, jsx_runtime_1.jsx)("div", { className: "flex shrink-0 flex-col gap-1", children: isEditingUsername ? (
                 /* Edit mode - inline input */
                 (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.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" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-1", children: [(0, jsx_runtime_1.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 ? (0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { size: 18, className: "animate-spin" }) : (0, jsx_runtime_1.jsx)(lucide_react_1.Check, { size: 18, strokeWidth: 2.5 }) }), (0, jsx_runtime_1.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: (0, jsx_runtime_1.jsx)(lucide_react_1.X, { size: 18, strokeWidth: 2.5 }) })] })] })) : (
                 /* Display mode */
-                (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { className: "flex items-center gap-1", children: (0, jsx_runtime_1.jsx)("p", { className: "b3-modal-username font-neue-montreal-semibold text-lg leading-none text-[#0B57C2]", children: currentUsername }) }), (0, jsx_runtime_1.jsx)("button", { onClick: handleEditUsername, className: "flex items-center justify-center gap-1 text-left transition-opacity hover:opacity-80", children: (0, jsx_runtime_1.jsx)("p", { className: "font-inter text-sm font-semibold leading-5 text-[#51525C]", children: "Edit Username" }) })] })) })] }));
+                (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { className: "flex items-center gap-1", children: (0, jsx_runtime_1.jsx)("p", { className: "b3-modal-username font-neue-montreal-semibold text-lg leading-none text-[#0B57C2]", children: currentUsername }) }), (0, jsx_runtime_1.jsx)("button", { onClick: handleEditUsername, className: "flex items-center justify-center gap-1 text-left transition-opacity hover:opacity-80", children: (0, jsx_runtime_1.jsx)("p", { className: "font-inter text-sm font-semibold leading-5 text-[#51525C] dark:text-white", children: "Edit Username" }) })] })) })] }));
 };
 exports.default = SettingsProfileCard;

package/dist/cjs/global-account/react/components/ManageAccount/channels/DiscordChannel.js

@@ -13,6 +13,7 @@ const DiscordChannel = ({ userId, jwtToken, discordChannel, isConnected, isOptim
     const { partnerId } = (0, useB3_1.useB3)();
     const [discordId, setDiscordId] = (0, react_1.useState)("");
     const [isConnecting, setIsConnecting] = (0, react_1.useState)(false);
+    const [showInput, setShowInput] = (0, react_1.useState)(false);
     // Detect if we're disconnecting
     const isDisconnecting = isConnected && !isOptimisticallyConnected;
     const handleConnect = async () => {
@@ -23,6 +24,7 @@ const DiscordChannel = ({ userId, jwtToken, discordChannel, isConnected, isOptim
             await notificationsAPI_1.notificationsAPI.connectDiscord(userId, discordId, jwtToken);
             await notificationsAPI_1.notificationsAPI.ensureNotificationSettings(userId, partnerId, "general", jwtToken);
             setDiscordId("");
+            setShowInput(false);
             toastApi_1.toast.success("Discord connected successfully!");
             onConnectionChange();
         }
@@ -35,14 +37,18 @@ const DiscordChannel = ({ userId, jwtToken, discordChannel, isConnected, isOptim
         }
     };
     const handleToggle = () => {
+        if (isConnected) {
+            setShowInput(false);
+        }
         onToggle(isConnected);
     };
     const icon = ((0, jsx_runtime_1.jsx)("svg", { id: "Discord-Logo", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 126.644 96", children: (0, jsx_runtime_1.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" }) }));
-    const inputSection = ((0, jsx_runtime_1.jsxs)("div", { className: "mt-1 space-y-2", children: [(0, jsx_runtime_1.jsx)("input", { type: "text", value: discordId, onChange: e => setDiscordId(e.target.value), onKeyDown: e => {
+    const addButtonSection = ((0, jsx_runtime_1.jsxs)("button", { onClick: () => setShowInput(true), className: "mt-1 flex items-center gap-1", children: [(0, jsx_runtime_1.jsx)("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: (0, jsx_runtime_1.jsx)("path", { d: "M8 3.33333V12.6667M3.33333 8H12.6667", stroke: "#0c68e9", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }), (0, jsx_runtime_1.jsx)("span", { className: "font-['Inter',sans-serif] text-[11px] font-semibold leading-[16px] text-[#0b57c2]", children: "Add Discord" })] }));
+    const inputSection = showInput ? ((0, jsx_runtime_1.jsxs)("div", { className: "mt-1 space-y-2", children: [(0, jsx_runtime_1.jsx)("input", { type: "text", value: discordId, onChange: e => setDiscordId(e.target.value), onKeyDown: e => {
                     if (e.key === "Enter" && discordId) {
                         handleConnect();
                     }
-                }, 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" }), (0, jsx_runtime_1.jsxs)("button", { onClick: handleConnect, disabled: isConnecting || !discordId, className: "flex items-center gap-1 disabled:opacity-50", children: [(0, jsx_runtime_1.jsx)("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: (0, jsx_runtime_1.jsx)("path", { d: "M8 3.33333V12.6667M3.33333 8H12.6667", stroke: "#0c68e9", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }), (0, jsx_runtime_1.jsx)("span", { className: "font-['Inter',sans-serif] text-[11px] font-semibold leading-[16px] text-[#0b57c2]", children: isConnecting ? "Connecting..." : "Add Discord" })] })] }));
-    return ((0, jsx_runtime_1.jsx)(NotificationChannel_1.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 }));
+                }, 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" }), (0, jsx_runtime_1.jsxs)("button", { onClick: handleConnect, disabled: isConnecting || !discordId, className: "flex items-center gap-1 disabled:opacity-50", children: [(0, jsx_runtime_1.jsx)("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: (0, jsx_runtime_1.jsx)("path", { d: "M8 3.33333V12.6667M3.33333 8H12.6667", stroke: "#0c68e9", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }), (0, jsx_runtime_1.jsx)("span", { className: "font-['Inter',sans-serif] text-[11px] font-semibold leading-[16px] text-[#0b57c2]", children: isConnecting ? "Connecting..." : "Add Discord" })] })] })) : null;
+    return ((0, jsx_runtime_1.jsx)(NotificationChannel_1.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 }));
 };
 exports.DiscordChannel = DiscordChannel;

package/dist/cjs/global-account/react/components/ManageAccount/channels/EmailChannel.js

@@ -62,7 +62,7 @@ const EmailChannel = ({ userId, jwtToken, emailChannel, isConnected, isOptimisti
                             if (e.key === "Enter" && email) {
                                 handleConnect();
                             }
-                        }, 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 && ((0, jsx_runtime_1.jsx)("p", { className: "mt-1 font-['PP_Neue_Montreal','PP_Neue_Montreal_Fallback',sans-serif] text-[12px] leading-[16px] text-red-600", children: emailError }))] }), (0, jsx_runtime_1.jsxs)("button", { onClick: handleConnect, disabled: isConnecting || !email, className: "flex items-center gap-1 disabled:opacity-50", children: [(0, jsx_runtime_1.jsx)("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: (0, jsx_runtime_1.jsx)("path", { d: "M8 3.33333V12.6667M3.33333 8H12.6667", stroke: "#0c68e9", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }), (0, jsx_runtime_1.jsx)("span", { className: "font-['Inter',sans-serif] text-[11px] font-semibold leading-[16px] text-[#0b57c2]", children: isConnecting ? "Connecting..." : "Add Email" })] })] })) : null;
+                        }, 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 && ((0, jsx_runtime_1.jsx)("p", { className: "mt-1 font-['PP_Neue_Montreal','PP_Neue_Montreal_Fallback',sans-serif] text-[12px] leading-[16px] text-red-600", children: emailError }))] }), (0, jsx_runtime_1.jsxs)("button", { onClick: handleConnect, disabled: isConnecting || !email, className: "flex items-center gap-1 disabled:opacity-50", children: [(0, jsx_runtime_1.jsx)("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: (0, jsx_runtime_1.jsx)("path", { d: "M8 3.33333V12.6667M3.33333 8H12.6667", stroke: "#0c68e9", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }), (0, jsx_runtime_1.jsx)("span", { className: "font-['Inter',sans-serif] text-[11px] font-semibold leading-[16px] text-[#0b57c2]", children: isConnecting ? "Connecting..." : "Add Email" })] })] })) : null;
     return ((0, jsx_runtime_1.jsx)(NotificationChannel_1.NotificationChannel, { icon: icon, title: "Email", isConnected: isOptimisticallyConnected, isConnecting: isConnecting, isDisconnecting: isDisconnecting, connectedInfo: emailChannel?.channel_identifier, inputSection: inputSection, addButtonSection: addButtonSection, onToggle: handleToggle }));
 };
 exports.EmailChannel = EmailChannel;

package/dist/cjs/global-account/react/components/ManageAccount/channels/PhoneChannel.js

@@ -72,8 +72,8 @@ const PhoneChannel = ({ userId, jwtToken, smsChannel, whatsappChannel, isSMSConn
                     if (e.key === "Enter" && phoneNumber) {
                         handleConnectSMS();
                     }
-                }, 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" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex gap-2", children: [(0, jsx_runtime_1.jsxs)("button", { onClick: handleConnectSMS, disabled: isConnectingSMS || !phoneNumber, className: "flex items-center gap-1 disabled:opacity-50", children: [(0, jsx_runtime_1.jsx)("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: (0, jsx_runtime_1.jsx)("path", { d: "M8 3.33333V12.6667M3.33333 8H12.6667", stroke: "#0c68e9", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }), (0, jsx_runtime_1.jsx)("span", { className: "font-['Inter',sans-serif] text-[11px] font-semibold leading-[16px] text-[#0b57c2]", children: isConnectingSMS ? "Connecting..." : "Add SMS" })] }), (0, jsx_runtime_1.jsx)("span", { className: "text-[11px] text-gray-400", children: "|" }), (0, jsx_runtime_1.jsxs)("button", { onClick: handleConnectWhatsApp, disabled: isConnectingWhatsApp || !phoneNumber, className: "flex items-center gap-1 disabled:opacity-50", children: [(0, jsx_runtime_1.jsx)("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: (0, jsx_runtime_1.jsx)("path", { d: "M8 3.33333V12.6667M3.33333 8H12.6667", stroke: "#0c68e9", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }), (0, jsx_runtime_1.jsx)("span", { className: "font-['Inter',sans-serif] text-[11px] font-semibold leading-[16px] text-[#0b57c2]", children: isConnectingWhatsApp ? "Connecting..." : "Add WhatsApp" })] })] })] })) : null;
-    const connectedInfo = ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isSMSConnected && ((0, jsx_runtime_1.jsx)("p", { className: "font-['PP_Neue_Montreal','PP_Neue_Montreal_Fallback',sans-serif] text-[14px] leading-[20px] text-[#51525c]", children: smsChannel?.channel_identifier })), isWhatsAppConnected && ((0, jsx_runtime_1.jsx)("p", { className: "font-['PP_Neue_Montreal','PP_Neue_Montreal_Fallback',sans-serif] text-[14px] leading-[20px] text-[#51525c]", children: whatsappChannel?.channel_identifier }))] }));
+                }, 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" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex gap-2", children: [(0, jsx_runtime_1.jsxs)("button", { onClick: handleConnectSMS, disabled: isConnectingSMS || !phoneNumber, className: "flex items-center gap-1 disabled:opacity-50", children: [(0, jsx_runtime_1.jsx)("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: (0, jsx_runtime_1.jsx)("path", { d: "M8 3.33333V12.6667M3.33333 8H12.6667", stroke: "#0c68e9", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }), (0, jsx_runtime_1.jsx)("span", { className: "font-['Inter',sans-serif] text-[11px] font-semibold leading-[16px] text-[#0b57c2] dark:text-white", children: isConnectingSMS ? "Connecting..." : "Add SMS" })] }), (0, jsx_runtime_1.jsx)("span", { className: "text-[11px] text-gray-400", children: "|" }), (0, jsx_runtime_1.jsxs)("button", { onClick: handleConnectWhatsApp, disabled: isConnectingWhatsApp || !phoneNumber, className: "flex items-center gap-1 disabled:opacity-50", children: [(0, jsx_runtime_1.jsx)("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: (0, jsx_runtime_1.jsx)("path", { d: "M8 3.33333V12.6667M3.33333 8H12.6667", stroke: "#0c68e9", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }), (0, jsx_runtime_1.jsx)("span", { className: "font-['Inter',sans-serif] text-[11px] font-semibold leading-[16px] text-[#0b57c2]", children: isConnectingWhatsApp ? "Connecting..." : "Add WhatsApp" })] })] })] })) : null;
+    const connectedInfo = ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isSMSConnected && ((0, jsx_runtime_1.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 && ((0, jsx_runtime_1.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 }))] }));
     return ((0, jsx_runtime_1.jsx)(NotificationChannel_1.NotificationChannel, { icon: icon, title: "SMS/WhatsApp", isConnected: isOptimisticallySMSConnected || isOptimisticallyWhatsAppConnected, isConnecting: isConnectingSMS || isConnectingWhatsApp, isDisconnecting: isDisconnecting, connectedInfo: isSMSConnected || isWhatsAppConnected ? ((0, jsx_runtime_1.jsx)("div", { className: "mt-1 flex flex-col gap-1", children: connectedInfo })) : undefined, inputSection: inputSection, addButtonSection: addButtonSection, onToggle: handleToggle }));
 };
 exports.PhoneChannel = PhoneChannel;

package/dist/cjs/global-account/react/components/ManageAccount/channels/TelegramChannel.js

@@ -73,7 +73,7 @@ const TelegramChannel = ({ userId, jwtToken, telegramChannel, isConnected, isOpt
         }
     };
     const icon = ((0, jsx_runtime_1.jsx)("svg", { width: "1000px", height: "1000px", viewBox: "0 0 1000 1000", version: "1.1", xmlns: "http://www.w3.org/2000/svg", children: (0, jsx_runtime_1.jsx)("g", { id: "Telegram", stroke: "none", "stroke-width": "1", fill: "none", "fill-rule": "evenodd", children: (0, jsx_runtime_1.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" }) }) }));
-    const inputSection = status === "pending" ? ((0, jsx_runtime_1.jsxs)("div", { className: "mt-1", children: [(0, jsx_runtime_1.jsx)("p", { className: "font-['PP_Neue_Montreal','PP_Neue_Montreal_Fallback',sans-serif] text-[14px] leading-[20px] text-yellow-700", children: "Waiting for connection..." }), (0, jsx_runtime_1.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" })] })) : ((0, jsx_runtime_1.jsxs)("button", { onClick: handleConnect, disabled: isConnecting, className: "mt-1 flex items-center gap-1 disabled:opacity-50", children: [(0, jsx_runtime_1.jsx)("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: (0, jsx_runtime_1.jsx)("path", { d: "M8 3.33333V12.6667M3.33333 8H12.6667", stroke: "#0c68e9", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }), (0, jsx_runtime_1.jsx)("span", { className: "font-['Inter',sans-serif] text-[11px] font-semibold leading-[16px] text-[#0b57c2]", children: isConnecting ? "Opening..." : "Add Telegram" })] }));
+    const inputSection = status === "pending" ? ((0, jsx_runtime_1.jsxs)("div", { className: "mt-1", children: [(0, jsx_runtime_1.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..." }), (0, jsx_runtime_1.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" })] })) : ((0, jsx_runtime_1.jsxs)("button", { onClick: handleConnect, disabled: isConnecting, className: "mt-1 flex items-center gap-1 disabled:opacity-50", children: [(0, jsx_runtime_1.jsx)("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: (0, jsx_runtime_1.jsx)("path", { d: "M8 3.33333V12.6667M3.33333 8H12.6667", stroke: "#0c68e9", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }), (0, jsx_runtime_1.jsx)("span", { className: "font-['Inter',sans-serif] text-[11px] font-semibold leading-[16px] text-[#0b57c2]", children: isConnecting ? "Opening..." : "Add Telegram" })] }));
     return ((0, jsx_runtime_1.jsx)(NotificationChannel_1.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 }));
 };
 exports.TelegramChannel = TelegramChannel;

package/dist/cjs/global-account/react/components/ModalHeader/ModalHeader.js

@@ -7,6 +7,6 @@ const stores_1 = require("../../stores");
 const ModalHeader = ({ showBackButton = true, handleBack, handleClose, title, children, showCloseButton = true, className, showBackWord = false, }) => {
     const navigateBack = (0, stores_1.useModalStore)(state => state.navigateBack);
     const setB3ModalOpen = (0, stores_1.useModalStore)(state => state.setB3ModalOpen);
-    return ((0, jsx_runtime_1.jsxs)("div", { className: (0, utils_1.cn)("b3-modal-header flex h-16 items-center justify-between border-b border-[#e4e4e7] bg-white px-5 py-3", className), children: [showBackButton ? ((0, jsx_runtime_1.jsxs)("button", { onClick: handleBack || navigateBack, className: "flex h-6 w-6 items-center justify-center transition-opacity hover:opacity-70", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.ChevronLeft, { className: "h-6 w-6 text-[#51525c]" }), showBackWord && (0, jsx_runtime_1.jsx)("span", { className: "text-sm font-medium", children: "Back" })] })) : ((0, jsx_runtime_1.jsx)("div", { className: "w-2" })), (0, jsx_runtime_1.jsx)("p", { className: "font-inter text-lg font-semibold leading-7 text-[#18181b]", children: title }), showCloseButton ? ((0, jsx_runtime_1.jsx)("button", { onClick: handleClose || (() => setB3ModalOpen(false)), className: "flex h-6 w-6 items-center justify-center transition-opacity hover:opacity-70", children: (0, jsx_runtime_1.jsx)(lucide_react_1.X, { className: "h-6 w-6 text-[#51525c]" }) })) : !children ? ((0, jsx_runtime_1.jsx)("div", { className: "w-2" })) : undefined, children] }));
+    return ((0, jsx_runtime_1.jsxs)("div", { className: (0, utils_1.cn)("b3-modal-header flex h-16 items-center justify-between border-b border-[#e4e4e7] bg-white px-5 py-3", className), children: [showBackButton ? ((0, jsx_runtime_1.jsxs)("button", { onClick: handleBack || navigateBack, className: "flex h-6 w-6 items-center justify-center transition-opacity hover:opacity-70", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.ChevronLeft, { className: "h-6 w-6 text-[#51525c] dark:text-white" }), showBackWord && (0, jsx_runtime_1.jsx)("span", { className: "text-sm font-medium", children: "Back" })] })) : ((0, jsx_runtime_1.jsx)("div", { className: "w-2" })), (0, jsx_runtime_1.jsx)("p", { className: "font-inter text-lg font-semibold leading-7 text-[#18181b] dark:text-white", children: title }), showCloseButton ? ((0, jsx_runtime_1.jsx)("button", { onClick: handleClose || (() => setB3ModalOpen(false)), className: "flex h-6 w-6 items-center justify-center transition-opacity hover:opacity-70", children: (0, jsx_runtime_1.jsx)(lucide_react_1.X, { className: "h-6 w-6 text-[#51525c] dark:text-white" }) })) : !children ? ((0, jsx_runtime_1.jsx)("div", { className: "w-2" })) : undefined, children] }));
 };
 exports.default = ModalHeader;

package/dist/cjs/global-account/react/components/Send/Send.js

@@ -185,11 +185,11 @@ function Send({ recipientAddress: initialRecipient, onSuccess }) {
                 return "Send";
         }
     };
-    return ((0, jsx_runtime_1.jsxs)("div", { className: "flex h-[600px] w-full flex-col bg-white", children: [(0, jsx_runtime_1.jsx)(ModalHeader_1.default, { handleBack: handleBack, title: getStepTitle() }), (0, jsx_runtime_1.jsxs)("div", { className: "flex-1 overflow-y-auto", children: [step === "recipient" && ((0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col gap-6 p-5", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex h-12 w-full items-stretch overflow-hidden rounded-lg border border-[#d1d1d6] bg-white", children: [(0, jsx_runtime_1.jsx)("div", { className: "flex w-12 items-center justify-center bg-transparent px-3 py-2", children: (0, jsx_runtime_1.jsx)("span", { className: "font-neue-montreal-medium text-base text-[#3f3f46]", children: "To" }) }), (0, jsx_runtime_1.jsxs)("div", { className: "flex flex-1 items-center border-l border-[#d1d1d6] px-3 py-2", children: [(0, jsx_runtime_1.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]" }), (0, jsx_runtime_1.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 && (0, jsx_runtime_1.jsx)("p", { className: "font-neue-montreal-medium -mt-4 text-xs text-red-500", children: addressError }), showValidatedResult && recipientAddress && (0, viem_1.isAddress)(recipientAddress) && ((0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col gap-2", children: [(0, jsx_runtime_1.jsx)("div", { className: "flex items-center gap-1", children: (0, jsx_runtime_1.jsx)("span", { className: "font-sf-pro-text text-sm font-semibold leading-[1.3] tracking-[-0.41px] text-[#0b57c2]", children: "Result" }) }), (0, jsx_runtime_1.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 ? ((0, jsx_runtime_1.jsx)("img", { src: validatedProfileData.avatar, alt: validatedProfileData.name || recipientAddress, className: "h-10 w-10 rounded-full" })) : ((0, jsx_runtime_1.jsx)("div", { className: "flex h-10 w-10 items-center justify-center rounded-full border border-[#e4e4e7] bg-[#f4f4f5]", children: (0, jsx_runtime_1.jsx)(lucide_react_1.Wallet, { className: "h-5 w-5 text-[#a0a0ab]" }) })), (0, jsx_runtime_1.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 && ((0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col gap-2", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-1", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Clock, { className: "h-3.5 w-3.5 text-[#3f3f46]" }), (0, jsx_runtime_1.jsx)("span", { className: "font-sf-pro-text text-sm font-semibold leading-[1.3] tracking-[-0.41px] text-[#3f3f46]", children: "Recents" })] }), (0, jsx_runtime_1.jsx)("div", { className: "flex flex-col", children: recentAddresses.map((recent, index) => ((0, jsx_runtime_1.jsx)(RecentAddressItem, { address: recent.address, onClick: () => {
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "dark:bg-b3-background flex h-[600px] w-full flex-col bg-white", children: [(0, jsx_runtime_1.jsx)(ModalHeader_1.default, { handleBack: handleBack, title: getStepTitle() }), (0, jsx_runtime_1.jsxs)("div", { className: "flex-1 overflow-y-auto", children: [step === "recipient" && ((0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col gap-6 p-5", children: [(0, jsx_runtime_1.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: [(0, jsx_runtime_1.jsx)("div", { className: "flex w-12 items-center justify-center bg-transparent px-3 py-2", children: (0, jsx_runtime_1.jsx)("span", { className: "font-neue-montreal-medium text-base text-[#3f3f46] dark:text-white", children: "To" }) }), (0, jsx_runtime_1.jsxs)("div", { className: "flex flex-1 items-center border-l border-[#d1d1d6] px-3 py-2", children: [(0, jsx_runtime_1.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" }), (0, jsx_runtime_1.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 && (0, jsx_runtime_1.jsx)("p", { className: "font-neue-montreal-medium -mt-4 text-xs text-red-500", children: addressError }), showValidatedResult && recipientAddress && (0, viem_1.isAddress)(recipientAddress) && ((0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col gap-2", children: [(0, jsx_runtime_1.jsx)("div", { className: "flex items-center gap-1", children: (0, jsx_runtime_1.jsx)("span", { className: "font-sf-pro-text text-sm font-semibold leading-[1.3] tracking-[-0.41px] text-[#0b57c2]", children: "Result" }) }), (0, jsx_runtime_1.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 ? ((0, jsx_runtime_1.jsx)("img", { src: validatedProfileData.avatar, alt: validatedProfileData.name || recipientAddress, className: "h-10 w-10 rounded-full" })) : ((0, jsx_runtime_1.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: (0, jsx_runtime_1.jsx)(lucide_react_1.Wallet, { className: "h-5 w-5 text-[#a0a0ab] dark:text-white" }) })), (0, jsx_runtime_1.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 && ((0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col gap-2", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-1", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Clock, { className: "h-3.5 w-3.5 text-[#3f3f46]" }), (0, jsx_runtime_1.jsx)("span", { className: "font-sf-pro-text text-sm font-semibold leading-[1.3] tracking-[-0.41px] text-[#3f3f46]", children: "Recents" })] }), (0, jsx_runtime_1.jsx)("div", { className: "flex flex-col", children: recentAddresses.map((recent, index) => ((0, jsx_runtime_1.jsx)(RecentAddressItem, { address: recent.address, onClick: () => {
                                                 // Just fill the input and show validation - don't auto-proceed
                                                 handleRecipientAddressChange(recent.address);
                                             } }, index))) })] }))] })), step === "token" && ((0, jsx_runtime_1.jsx)("div", { className: "flex flex-col p-5", children: isLoadingBalance ? ((0, jsx_runtime_1.jsx)("div", { className: "space-y-4", children: (0, jsx_runtime_1.jsx)("div", { className: "space-y-1", children: [...Array(3)].map((_, index) => ((0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between rounded-xl p-3", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-3", children: [(0, jsx_runtime_1.jsx)("div", { className: "bg-b3-line h-10 w-10 animate-pulse rounded-full" }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", { className: "bg-b3-line mb-1 h-4 w-16 animate-pulse rounded" }), (0, jsx_runtime_1.jsx)("div", { className: "bg-b3-line h-3 w-24 animate-pulse rounded" })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "text-right", children: [(0, jsx_runtime_1.jsx)("div", { className: "bg-b3-line mb-1 h-4 w-20 animate-pulse rounded" }), (0, jsx_runtime_1.jsx)("div", { className: "bg-b3-line h-3 w-16 animate-pulse rounded" })] })] }, index))) }) })) : simBalance?.balances && simBalance.balances.length > 0 ? ((0, jsx_runtime_1.jsx)("div", { className: "space-y-4", children: (0, jsx_runtime_1.jsx)("div", { className: "space-y-1", children: simBalance.balances.map(token => ((0, jsx_runtime_1.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: () => {
                                         setSelectedToken(token);
                                         setStep("amount");
-                                    }, children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-3", children: [(0, jsx_runtime_1.jsx)("div", { className: "flex h-10 w-10 items-center justify-center rounded-full", children: anyspend_1.ALL_CHAINS[token.chain_id]?.logoUrl ? ((0, jsx_runtime_1.jsx)(ChainTokenIcon_1.ChainTokenIcon, { chainUrl: anyspend_1.ALL_CHAINS[token.chain_id].logoUrl, tokenUrl: token.token_metadata?.logo, className: "size-10" })) : ((0, jsx_runtime_1.jsx)(lucide_react_1.CircleHelp, { className: "text-b3-react-foreground size-10" })) }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", { className: "flex items-center gap-2", children: (0, jsx_runtime_1.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 }) }), (0, jsx_runtime_1.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 })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "text-right", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-b3-grey font-neue-montreal-semibold transition-colors duration-200 group-hover:font-bold group-hover:text-black", children: (0, number_1.formatTokenAmount)(BigInt(token.amount), token.decimals) }), (0, jsx_runtime_1.jsx)("div", { className: "text-b3-foreground-muted font-neue-montreal-medium text-sm transition-colors duration-200 group-hover:text-gray-700", children: (0, number_1.formatDisplayNumber)(token.value_usd, { style: "currency", fractionDigits: 2 }) })] })] }, token.chain_id + "_" + token.address))) }) })) : ((0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col items-center justify-center py-12 text-center", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.CircleHelp, { className: "text-b3-foreground-muted mb-4 h-8 w-8" }), (0, jsx_runtime_1.jsx)("p", { className: "text-b3-foreground-muted font-neue-montreal-medium text-sm", children: "No tokens available" })] })) })), step === "amount" && selectedToken && ((0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col gap-6 p-5", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between rounded-xl border border-[#d1d1d6] bg-[#fafafa] p-3", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-3", children: [(0, jsx_runtime_1.jsx)("div", { className: "flex h-10 w-10 items-center justify-center", children: anyspend_1.ALL_CHAINS[selectedToken.chain_id]?.logoUrl ? ((0, jsx_runtime_1.jsx)(ChainTokenIcon_1.ChainTokenIcon, { chainUrl: anyspend_1.ALL_CHAINS[selectedToken.chain_id].logoUrl, tokenUrl: selectedToken.token_metadata?.logo, className: "size-10" })) : ((0, jsx_runtime_1.jsx)(lucide_react_1.CircleHelp, { className: "text-b3-react-foreground size-10" })) }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", { className: "font-neue-montreal-semibold text-base text-[#18181b]", children: selectedToken.symbol }), (0, jsx_runtime_1.jsx)("div", { className: "font-neue-montreal-medium text-sm text-[#70707b]", children: (0, number_1.formatTokenAmount)(BigInt(selectedToken.amount), selectedToken.decimals) })] })] }), (0, jsx_runtime_1.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" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "space-y-3", children: [(0, jsx_runtime_1.jsx)(react_number_format_1.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) }), (0, jsx_runtime_1.jsx)("div", { className: "grid grid-cols-4 gap-2", children: [25, 50, 75, 100].map(percentage => ((0, jsx_runtime_1.jsxs)(button_1.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))) }), (0, jsx_runtime_1.jsxs)("div", { className: "font-neue-montreal-medium text-sm text-[#70707b]", children: ["Available: ", (0, number_1.formatTokenAmount)(BigInt(selectedToken.amount), selectedToken.decimals), " ", selectedToken.symbol] })] }), (0, jsx_runtime_1.jsx)(button_1.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 && ((0, jsx_runtime_1.jsxs)("div", { className: "flex min-h-full flex-col", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col items-center gap-4 px-5 pb-0 pt-6", children: [(0, jsx_runtime_1.jsx)("div", { className: "flex h-14 w-14 items-center justify-center rounded-full bg-[#d5e5fd]", children: (0, jsx_runtime_1.jsx)(lucide_react_1.Send, { className: "h-7 w-7 text-[#0c68e9]" }) }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-1", children: [(0, jsx_runtime_1.jsx)("span", { className: "font-neue-montreal-semibold text-[30px] leading-[38px] text-[#18181b]", children: sendAmount }), (0, jsx_runtime_1.jsx)("span", { className: "font-neue-montreal-semibold text-[30px] leading-[38px] text-[#70707b]", children: selectedToken.symbol })] })] }), (0, jsx_runtime_1.jsx)("div", { className: "h-5" }), (0, jsx_runtime_1.jsx)("div", { className: "flex flex-col gap-3 px-5", children: (0, jsx_runtime_1.jsx)("div", { className: "rounded-xl border border-[#e4e4e7] bg-[#fafafa] p-4", children: (0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col gap-3", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between border-b border-[#e4e4e7] pb-3", children: [(0, jsx_runtime_1.jsx)("span", { className: "font-inter text-sm font-normal leading-5 text-[#51525c]", children: "To" }), (0, jsx_runtime_1.jsxs)("span", { className: "font-inter text-sm font-normal leading-5 text-[#18181b]", children: ["Wallet (", recipientAddress.slice(0, 6), "...", recipientAddress.slice(-4), ")"] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between border-b border-[#e4e4e7] pb-3", children: [(0, jsx_runtime_1.jsx)("span", { className: "font-inter text-sm font-normal leading-5 text-[#51525c]", children: "Network" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-1.5", children: [(0, jsx_runtime_1.jsx)("span", { className: "font-inter text-sm font-normal leading-5 text-[#51525c]", children: anyspend_1.ALL_CHAINS[selectedToken.chain_id]?.name || "Unknown" }), anyspend_1.ALL_CHAINS[selectedToken.chain_id]?.logoUrl && ((0, jsx_runtime_1.jsx)("img", { src: anyspend_1.ALL_CHAINS[selectedToken.chain_id].logoUrl, alt: anyspend_1.ALL_CHAINS[selectedToken.chain_id]?.name, className: "h-4 w-4 rounded-full" }))] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between", children: [(0, jsx_runtime_1.jsx)("span", { className: "font-inter text-sm font-normal leading-5 text-[#51525c]", children: "Network fee" }), (0, jsx_runtime_1.jsx)("span", { className: "font-inter text-sm font-normal leading-5 text-[#18181b]", children: "$0.1" })] })] }) }) }), (0, jsx_runtime_1.jsx)("div", { className: "flex-1" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex gap-4 border-t border-[#e4e4e7] bg-[#fafafa] p-4", children: [(0, jsx_runtime_1.jsx)(button_1.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" }), (0, jsx_runtime_1.jsx)(button_1.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 ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "mr-2 h-4 w-4 animate-spin" }), "Sending..."] })) : ("Send") })] })] })), step === "success" && selectedToken && ((0, jsx_runtime_1.jsxs)("div", { className: "flex h-full flex-col items-center justify-center gap-6 p-5 text-center", children: [(0, jsx_runtime_1.jsx)("div", { className: "flex h-14 w-14 items-center justify-center rounded-full bg-green-100", children: (0, jsx_runtime_1.jsx)(lucide_react_1.Send, { className: "h-7 w-7 text-green-600" }) }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h3", { className: "font-neue-montreal-semibold mb-2 text-xl text-[#18181b]", children: "Sent!" }), (0, jsx_runtime_1.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)] })] }), (0, jsx_runtime_1.jsx)(button_1.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" })] }))] })] }));
+                                    }, children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-3", children: [(0, jsx_runtime_1.jsx)("div", { className: "flex h-10 w-10 items-center justify-center rounded-full", children: anyspend_1.ALL_CHAINS[token.chain_id]?.logoUrl ? ((0, jsx_runtime_1.jsx)(ChainTokenIcon_1.ChainTokenIcon, { chainUrl: anyspend_1.ALL_CHAINS[token.chain_id].logoUrl, tokenUrl: token.token_metadata?.logo, className: "size-10" })) : ((0, jsx_runtime_1.jsx)(lucide_react_1.CircleHelp, { className: "text-b3-react-foreground size-10" })) }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", { className: "flex items-center gap-2", children: (0, jsx_runtime_1.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 }) }), (0, jsx_runtime_1.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 })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "text-right", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-b3-grey font-neue-montreal-semibold transition-colors duration-200 group-hover:font-bold group-hover:text-black", children: (0, number_1.formatTokenAmount)(BigInt(token.amount), token.decimals) }), (0, jsx_runtime_1.jsx)("div", { className: "text-b3-foreground-muted font-neue-montreal-medium text-sm transition-colors duration-200 group-hover:text-gray-700", children: (0, number_1.formatDisplayNumber)(token.value_usd, { style: "currency", fractionDigits: 2 }) })] })] }, token.chain_id + "_" + token.address))) }) })) : ((0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col items-center justify-center py-12 text-center", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.CircleHelp, { className: "text-b3-foreground-muted mb-4 h-8 w-8" }), (0, jsx_runtime_1.jsx)("p", { className: "text-b3-foreground-muted font-neue-montreal-medium text-sm", children: "No tokens available" })] })) })), step === "amount" && selectedToken && ((0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col gap-6 p-5", children: [(0, jsx_runtime_1.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: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-3", children: [(0, jsx_runtime_1.jsx)("div", { className: "flex h-10 w-10 items-center justify-center", children: anyspend_1.ALL_CHAINS[selectedToken.chain_id]?.logoUrl ? ((0, jsx_runtime_1.jsx)(ChainTokenIcon_1.ChainTokenIcon, { chainUrl: anyspend_1.ALL_CHAINS[selectedToken.chain_id].logoUrl, tokenUrl: selectedToken.token_metadata?.logo, className: "size-10" })) : ((0, jsx_runtime_1.jsx)(lucide_react_1.CircleHelp, { className: "text-b3-react-foreground size-10" })) }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", { className: "font-neue-montreal-semibold text-base text-[#18181b] dark:text-white", children: selectedToken.symbol }), (0, jsx_runtime_1.jsx)("div", { className: "font-neue-montreal-medium text-sm text-[#70707b] dark:text-white", children: (0, number_1.formatTokenAmount)(BigInt(selectedToken.amount), selectedToken.decimals) })] })] }), (0, jsx_runtime_1.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" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "space-y-3", children: [(0, jsx_runtime_1.jsx)(react_number_format_1.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) }), (0, jsx_runtime_1.jsx)("div", { className: "grid grid-cols-4 gap-2", children: [25, 50, 75, 100].map(percentage => ((0, jsx_runtime_1.jsxs)(button_1.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))) }), (0, jsx_runtime_1.jsxs)("div", { className: "font-neue-montreal-medium text-sm text-[#70707b]", children: ["Available: ", (0, number_1.formatTokenAmount)(BigInt(selectedToken.amount), selectedToken.decimals), " ", selectedToken.symbol] })] }), (0, jsx_runtime_1.jsx)(button_1.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 && ((0, jsx_runtime_1.jsxs)("div", { className: "flex min-h-full flex-col", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col items-center gap-4 px-5 pb-0 pt-6", children: [(0, jsx_runtime_1.jsx)("div", { className: "dark:bg-b3-line flex h-14 w-14 items-center justify-center rounded-full bg-[#d5e5fd]", children: (0, jsx_runtime_1.jsx)(lucide_react_1.Send, { className: "h-7 w-7 text-[#0c68e9]" }) }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-1", children: [(0, jsx_runtime_1.jsx)("span", { className: "font-neue-montreal-semibold text-[30px] leading-[38px] text-[#18181b] dark:text-white", children: sendAmount }), (0, jsx_runtime_1.jsx)("span", { className: "font-neue-montreal-semibold text-[30px] leading-[38px] text-[#70707b] dark:text-white", children: selectedToken.symbol })] })] }), (0, jsx_runtime_1.jsx)("div", { className: "h-5" }), (0, jsx_runtime_1.jsx)("div", { className: "flex flex-col gap-3 px-5", children: (0, jsx_runtime_1.jsx)("div", { className: "dark:border-b3-line dark:bg-b3-background rounded-xl border border-[#e4e4e7] bg-[#fafafa] p-4", children: (0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col gap-3", children: [(0, jsx_runtime_1.jsxs)("div", { className: "dark:border-b3-line flex items-center justify-between border-b border-[#e4e4e7] pb-3", children: [(0, jsx_runtime_1.jsx)("span", { className: "font-inter text-sm font-normal leading-5 text-[#51525c] dark:text-white", children: "To" }), (0, jsx_runtime_1.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), ")"] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "dark:border-b3-line flex items-center justify-between border-b border-[#e4e4e7] pb-3", children: [(0, jsx_runtime_1.jsx)("span", { className: "font-inter text-sm font-normal leading-5 text-[#51525c] dark:text-white", children: "Network" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-1.5", children: [(0, jsx_runtime_1.jsx)("span", { className: "font-inter text-sm font-normal leading-5 text-[#51525c] dark:text-white", children: anyspend_1.ALL_CHAINS[selectedToken.chain_id]?.name || "Unknown" }), anyspend_1.ALL_CHAINS[selectedToken.chain_id]?.logoUrl && ((0, jsx_runtime_1.jsx)("img", { src: anyspend_1.ALL_CHAINS[selectedToken.chain_id].logoUrl, alt: anyspend_1.ALL_CHAINS[selectedToken.chain_id]?.name, className: "h-4 w-4 rounded-full" }))] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between", children: [(0, jsx_runtime_1.jsx)("span", { className: "font-inter text-sm font-normal leading-5 text-[#51525c] dark:text-white", children: "Network fee" }), (0, jsx_runtime_1.jsx)("span", { className: "font-inter text-sm font-normal leading-5 text-[#18181b] dark:text-white", children: "$0.1" })] })] }) }) }), (0, jsx_runtime_1.jsx)("div", { className: "flex-1" }), (0, jsx_runtime_1.jsxs)("div", { className: "dark:border-b3-line dark:bg-b3-background flex gap-4 border-t border-[#e4e4e7] bg-[#fafafa] p-4", children: [(0, jsx_runtime_1.jsx)(button_1.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" }), (0, jsx_runtime_1.jsx)(button_1.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 ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "mr-2 h-4 w-4 animate-spin" }), "Sending..."] })) : ("Send") })] })] })), step === "success" && selectedToken && ((0, jsx_runtime_1.jsxs)("div", { className: "flex h-full flex-col items-center justify-center gap-6 p-5 text-center", children: [(0, jsx_runtime_1.jsx)("div", { className: "flex h-14 w-14 items-center justify-center rounded-full bg-green-100", children: (0, jsx_runtime_1.jsx)(lucide_react_1.Send, { className: "h-7 w-7 text-green-600" }) }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h3", { className: "font-neue-montreal-semibold mb-2 text-xl text-[#18181b]", children: "Sent!" }), (0, jsx_runtime_1.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)] })] }), (0, jsx_runtime_1.jsx)(button_1.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" })] }))] })] }));
 }

package/dist/cjs/global-account/react/hooks/useSimBalance.js

@@ -7,8 +7,8 @@ async function fetchSimBalance(address, chainIdsParam) {
         throw new Error("Address is required");
     const chainIds = chainIdsParam.length === 0 ? "mainnet" : chainIdsParam.join(",");
     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`;
-    if (process.env.NEXT_PUBLIC_SIMDUNE_LOCAL_KEY) {
-        url += `&localkey=${process.env.NEXT_PUBLIC_SIMDUNE_LOCAL_KEY}`;
+    if (process.env.NEXT_PUBLIC_DEVMODE_SHARED_SECRET) {
+        url += `&localkey=${process.env.NEXT_PUBLIC_DEVMODE_SHARED_SECRET}`;
     }
     const response = await fetch(url);
     if (!response.ok) {

package/dist/esm/anyspend/react/components/AnySpend.js

@@ -842,7 +842,7 @@ function AnySpendInner({ destinationTokenAddress, destinationTokenChainId, mode
                                 type: "anySpend",
                             });
                         }
-                    }, children: _jsx(BottomNavigation, {}) }) })] }));
+                    }, children: mode !== "page" && _jsx(BottomNavigation, {}) }) })] }));
     const onrampPaymentView = (_jsx(PanelOnrampPayment, { srcAmountOnRamp: srcAmountOnRamp, recipientName: recipientName || undefined, recipientAddress: effectiveRecipientAddress, isBuyMode: isBuyMode, destinationTokenChainId: destinationTokenChainId, destinationTokenAddress: destinationTokenAddress, selectedDstChainId: selectedDstChainId, selectedDstToken: selectedDstToken, orderType: "swap", anyspendQuote: anyspendQuote, globalAddress: globalAddress, onOrderCreated: orderId => {
             setOrderId(orderId);
             navigateToPanel(PanelView.ORDER_DETAILS, "forward");

package/dist/esm/global-account/react/components/AvatarEditor/AvatarEditor.js

@@ -315,7 +315,7 @@ export function AvatarEditor({ onSetAvatar, className }) {
         };
     })
         .filter(p => p.avatar !== null) || []; // Filter out profiles with invalid avatars
-    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) => {
+    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) => {
                                             // Skip if avatar is null (should not happen due to filter, but TypeScript doesn't know that)
                                             if (!profileAvatar.avatar)
                                                 return null;
@@ -323,8 +323,8 @@ export function AvatarEditor({ onSetAvatar, className }) {
                                                             ? "border-[#3368ef] ring-2 ring-[#3368ef]/20"
                                                             : "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));
                                         }) }), _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
-                                ? "border-[#3368ef] bg-[#f0f5ff]"
-                                : "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: {
+                                ? "dark:border-b3-line dark:bg-b3-react-primary border-[#3368ef] bg-[#f0f5ff]"
+                                : "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: {
                                                     containerStyle: {
                                                         width: "100%",
                                                         height: "100%",
@@ -334,5 +334,5 @@ export function AvatarEditor({ onSetAvatar, className }) {
                                                         border: "2px solid #3368ef",
                                                         borderRadius: "0px",
                                                     },
-                                                } }), _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") })] })] }));
+                                                } }), _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") })] })] }));
 }

package/dist/esm/global-account/react/components/ManageAccount/Header.js

@@ -37,7 +37,7 @@ function WalletItem({ wallet, isActive, onClick }) {
                     : isGlobalAccount
                         ? "Smart Wallet"
                         : "Wallet";
-    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, {}) }))] }));
+    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, {}) }))] }));
 }
 export function Header({ onLogout }) {
     const activeWallet = useActiveWallet();
@@ -75,7 +75,7 @@ export function Header({ onLogout }) {
             },
         });
     };
-    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: {
+    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: {
                                         boxShadow: "inset 0px 0px 0px 1px rgba(10,13,18,0.18), inset 0px -2px 0px 0px rgba(10,13,18,0.05)",
                                     }, 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" })] })] }) })) })] }) }));
 }

package/dist/esm/global-account/react/components/ManageAccount/NotificationChannel.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { cn } from "../../../../shared/utils/index.js";
 export const NotificationChannel = ({ icon, title, isConnected, isConnecting, isDisconnecting, connectedInfo, inputSection, addButtonSection, iconClassName, onToggle, showBorder = true, }) => {
-    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 })] }));
+    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 })] }));
 };
 // Toggle Switch Component
 const ToggleSwitch = ({ enabled, onChange, disabled, }) => {

package/dist/esm/global-account/react/components/ManageAccount/NotificationsContent.js

@@ -142,6 +142,6 @@ const NotificationsContent = ({ partnerId, chain, onSuccess }) => {
     if (loading) {
         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..." }) })] }));
     }
-    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." }))] }))] })] }));
+    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." }))] }))] })] }));
 };
 export default NotificationsContent;