@b3dotfun/sdk 0.0.65-test.5 → 0.0.66-alpha.0

package/src/global-account/react/stores/useModalStore.ts

@@ -82,9 +82,9 @@ export interface ManageAccountModalProps extends BaseModalProps {
   /** Partner ID */
   partnerId: string;
   /** Active Tab */
-  activeTab?: "home" | "tokens" | "nfts" | "apps" | "settings" | "swap";
+  activeTab?: "overview" | "tokens" | "nfts" | "apps" | "settings";
   /** Function to set the active tab */
-  setActiveTab?: (tab: "home" | "tokens" | "nfts" | "apps" | "settings" | "swap") => void;
+  setActiveTab?: (tab: "overview" | "tokens" | "nfts" | "apps" | "settings") => void;
   /** Whether to show the referral information */
   showReferralInfo?: boolean;
   /** Whether to show the swap button */
@@ -276,6 +276,27 @@ export interface AnySpendStakeUpsideExactInProps extends BaseModalProps {
   onSuccess?: () => void;
 }
 
+/**
+ * Props for the AnySpend Deposit Upside (Exact In) modal
+ * Handles token deposit operations using the custom exact in flow
+ */
+export interface AnySpendDepositUpsideProps extends BaseModalProps {
+  /** Modal type identifier */
+  type: "anySpendDepositUpside";
+  /**	Source token address */
+  sourceTokenAddress?: string;
+  /** Source token address */
+  sourceTokenChainId?: number;
+  /** Recipient address to deposit tokens for */
+  recipientAddress: string;
+  /** Deposit contract address */
+  depositContractAddress: string;
+  /** Token to deposit */
+  token: components["schemas"]["Token"];
+  /** Callback function called when the deposit is successful */
+  onSuccess?: () => void;
+}
+
 /**
  * Props for the AnySpend Buy Spin modal
  * Handles spin wheel entry purchases
@@ -345,16 +366,6 @@ export interface LinkAccountModalProps extends BaseModalProps {
   chain: Chain;
 }
 
-export interface LinkNewAccountModalProps extends BaseModalProps {
-  type: "linkNewAccount";
-  showBackButton?: boolean;
-  onSuccess?: () => void;
-  onError?: (error: Error) => void;
-  onClose?: () => void;
-  partnerId: string;
-  chain: Chain;
-}
-
 export interface AnySpendDepositHypeProps extends BaseModalProps {
   /** Modal type identifier */
   type: "anySpendDepositHype";
@@ -383,30 +394,13 @@ export interface AvatarEditorModalProps extends BaseModalProps {
   onSuccess?: () => void;
 }
 
-/**
- * Props for the Deposit modal
- * Allows users to deposit tokens into their global account
- */
-export interface DepositModalProps extends BaseModalProps {
+export interface ProfileEditorModalProps extends BaseModalProps {
   /** Modal type identifier */
-  type: "deposit";
-  /** Callback function called when deposit is successful */
+  type: "profileEditor";
+  /** Callback function called when profile is successfully updated */
   onSuccess?: () => void;
 }
 
-/**
- * Props for the Send modal
- * Allows users to send tokens from their global account to another address
- */
-export interface SendModalProps extends BaseModalProps {
-  /** Modal type identifier */
-  type: "send";
-  /** Pre-filled recipient address (optional) */
-  recipientAddress?: string;
-  /** Callback function called when send is successful */
-  onSuccess?: (txHash?: string) => void;
-}
-
 /**
  * Union type of all possible modal content types
  */
@@ -424,15 +418,14 @@ export type ModalContentType =
   | AnySpendStakeB3ExactInProps
   | AnySpendStakeUpsideProps
   | AnySpendStakeUpsideExactInProps
+  | AnySpendDepositUpsideProps
   | AnySpendBuySpinProps
   | AnySpendSignatureMintProps
   | AnySpendBondKitProps
   | LinkAccountModalProps
-  | LinkNewAccountModalProps
   | AnySpendDepositHypeProps
   | AvatarEditorModalProps
-  | DepositModalProps
-  | SendModalProps;
+  | ProfileEditorModalProps;
 // Add other modal types here like: | OtherModalProps | AnotherModalProps
 
 /**

package/src/global-account/react/utils/profileDisplay.ts

@@ -71,8 +71,6 @@ export interface ExtendedProfileDetails {
   name?: string;
   username?: string;
   profileImageUrl?: string;
-  picture?: string; // Google OAuth uses 'picture' field
-  pfpUrl?: string; // Farcaster uses 'pfpUrl' field
 }
 
 export interface ExtendedProfile extends Omit<Profile, "details"> {
@@ -114,7 +112,7 @@ export function getProfileDisplayInfo(profile: ExtendedProfile): ProfileDisplayI
       displayInfo = {
         title: details.name || details.username || "Unknown",
         subtitle: details.username ? `@${details.username}` : "Farcaster Account",
-        imageUrl: validateImageUrl(details.pfpUrl || details.profileImageUrl),
+        imageUrl: validateImageUrl(details.profileImageUrl),
         initial: "F",
         type,
       };
@@ -123,7 +121,7 @@ export function getProfileDisplayInfo(profile: ExtendedProfile): ProfileDisplayI
       displayInfo = {
         title: details.name || details.email || "Unknown",
         subtitle: details.email || "Google Account",
-        imageUrl: validateImageUrl(details.picture || details.profileImageUrl),
+        imageUrl: validateImageUrl(details.profileImageUrl),
         initial: "G",
         type,
       };

package/src/shared/utils/ipfs.ts

@@ -1,14 +1,7 @@
-/**
- * List of IPFS gateways to use for converting ipfs:// URLs to HTTP URLs
- * These gateways must match the allowed list in profileDisplay.ts validateImageUrl()
- */
 const IPFS_GATEWAYS = [
-  "https://cloudflare-ipfs.com/ipfs", // Primary gateway - fast and reliable
-  "https://ipfs.io/ipfs", // Fallback gateway
-  "https://gateway.pinata.cloud/ipfs", // Additional option
-  "https://dweb.link/ipfs", // Additional option
-  "https://nftstorage.link/ipfs", // Additional option
-  "https://w3s.link/ipfs", // Additional option
+  "https://ipfs.io/ipfs",
+  "https://cloudflare-ipfs.com/ipfs",
+  // Can add more gateways as needed
 ] as const;
 
 /**

package/src/styles/index.css

@@ -278,15 +278,10 @@ html[data-theme="dark"] .b3-root,
 
 /* Custom component styles */
 .b3-modal {
-  @apply text-b3-react-foreground rounded-2xl border;
+  @apply bg-b3-react-background text-b3-react-foreground rounded-2xl border;
   border: 1px solid var(--border);
   overflow: hidden;
   outline: none;
-  padding: 10px;
-
-  @media (min-width: 768px) {
-    background: #e4e4e7;
-  }
 }
 
 .b3-modal-freestyle {
@@ -635,6 +630,14 @@ Dark version
       font-size: 16px !important;
     }
   }
+
+  input[placeholder="Search Wallet"] {
+    padding-left: 48px !important;
+  }
+
+  li[style="list-style: none;"] {
+    margin-bottom: 12px !important;
+  }
 }
 /* Radix UI Accordion animations */
 @keyframes accordion-down {

package/dist/cjs/global-account/react/components/Deposit/Deposit.d.ts

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

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

@@ -1,65 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Deposit = Deposit;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const constants_1 = require("../../../../anyspend/constants");
-const chain_1 = require("../../../../anyspend/utils/chain");
-const react_1 = require("../../../../global-account/react");
-const relay_kit_ui_1 = require("@relayprotocol/relay-kit-ui");
-const lucide_react_1 = require("lucide-react");
-const qrcode_react_1 = require("qrcode.react");
-const react_2 = require("react");
-const sonner_1 = require("sonner");
-const chains_1 = require("thirdweb/chains");
-const ModalHeader_1 = __importDefault(require("../ModalHeader/ModalHeader"));
-const button_1 = require("../ui/button");
-const dropdown_menu_1 = require("../ui/dropdown-menu");
-// Coinbase logo SVG
-const CoinbaseLogo = () => ((0, jsx_runtime_1.jsxs)("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [(0, jsx_runtime_1.jsx)("path", { d: "M8 16C12.4183 16 16 12.4183 16 8C16 3.58172 12.4183 0 8 0C3.58172 0 0 3.58172 0 8C0 12.4183 3.58172 16 8 16Z", fill: "#0052FF" }), (0, jsx_runtime_1.jsx)("path", { d: "M8.00065 11.3337C6.16065 11.3337 4.66732 9.84033 4.66732 8.00033C4.66732 6.16033 6.16065 4.66699 8.00065 4.66699C9.47399 4.66699 10.734 5.64699 11.1607 7.00033H13.2273C12.774 4.54699 10.6273 2.66699 8.00065 2.66699C5.05399 2.66699 2.66732 5.05366 2.66732 8.00033C2.66732 10.947 5.05399 13.3337 8.00065 13.3337C10.6273 13.3337 12.774 11.4537 13.2273 9.00033H11.1607C10.734 10.3537 9.47399 11.3337 8.00065 11.3337Z", fill: "white" })] }));
-function Deposit() {
-    const { address } = (0, react_1.useAccountWallet)();
-    const navigateBack = (0, react_1.useModalStore)(state => state.navigateBack);
-    const setB3ModalOpen = (0, react_1.useModalStore)(state => state.setB3ModalOpen);
-    const history = (0, react_1.useModalStore)(state => state.history);
-    const [selectedChainId, setSelectedChainId] = (0, react_2.useState)(chains_1.base.id);
-    const [selectedToken, setSelectedToken] = (0, react_2.useState)({
-        address: "0xa0b86991c6218b36c1d19d4a2e9eb0ce3606eb48",
-        chainId: chains_1.base.id,
-        decimals: 6,
-        symbol: "USDC",
-        name: "USD Coin",
-        metadata: {
-            logoURI: "https://assets.relay.link/icons/1/light/usdc.png",
-        },
-    });
-    // Get the selected chain object
-    const selectedChain = (0, react_2.useMemo)(() => chain_1.ALL_CHAINS[selectedChainId], [selectedChainId]);
-    // Get all supported chains for the dropdown
-    const supportedChains = (0, react_2.useMemo)(() => Object.values(chain_1.ALL_CHAINS), []);
-    // The deposit address is the user's active wallet address
-    const depositAddress = address || "0x0000000000000000000000000000000000000000";
-    const handleTokenSelect = (token) => {
-        setSelectedChainId(token.chainId);
-        setSelectedToken({
-            address: token.address,
-            chainId: token.chainId,
-            decimals: token.decimals,
-            metadata: { logoURI: token.logoURI },
-            name: token.name,
-            symbol: token.symbol,
-        });
-    };
-    const handleCopyAddress = async () => {
-        try {
-            await navigator.clipboard.writeText(depositAddress);
-            sonner_1.toast.success("Address copied to clipboard");
-        }
-        catch (error) {
-            sonner_1.toast.error("Failed to copy address");
-        }
-    };
-    return ((0, jsx_runtime_1.jsxs)("div", { className: "flex w-full flex-col", children: [(0, jsx_runtime_1.jsx)(ModalHeader_1.default, { title: "Deposit", showCloseButton: false }), (0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col pb-5 pt-5", children: [(0, jsx_runtime_1.jsx)("div", { className: "mb-4 px-5", children: (0, jsx_runtime_1.jsx)("p", { className: "font-neue-montreal-medium text-base leading-snug text-[#3f3f46]", children: "Send any accepted token and we'll convert it to B3 on Base for you to use." }) }), (0, jsx_runtime_1.jsxs)("div", { className: "space-y-3 px-5", children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("label", { className: "mb-1.5 block text-sm font-medium text-[#3f3f46]", children: "Chain" }), (0, jsx_runtime_1.jsxs)(dropdown_menu_1.DropdownMenu, { children: [(0, jsx_runtime_1.jsx)(dropdown_menu_1.DropdownMenuTrigger, { asChild: true, children: (0, jsx_runtime_1.jsxs)("button", { className: "flex h-10 w-full items-center justify-between rounded-lg border border-[#d1d1d6] bg-white px-2.5 py-2 transition-colors hover:bg-[#fafafa]", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [selectedChain?.logoUrl && ((0, jsx_runtime_1.jsx)("img", { src: selectedChain.logoUrl, alt: selectedChain.name, className: "h-6 w-6 rounded-full" })), (0, jsx_runtime_1.jsx)("span", { className: "text-base text-[#18181b]", children: selectedChain?.name || "Select Chain" })] }), (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronDown, { className: "h-4 w-4 text-[#51525c]" })] }) }), (0, jsx_runtime_1.jsx)(dropdown_menu_1.DropdownMenuContent, { className: "max-h-[300px] w-full overflow-y-auto", children: supportedChains.map(chain => ((0, jsx_runtime_1.jsx)(dropdown_menu_1.DropdownMenuItem, { onClick: () => setSelectedChainId(chain.id), children: (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [chain.logoUrl && (0, jsx_runtime_1.jsx)("img", { src: chain.logoUrl, alt: chain.name, className: "h-6 w-6 rounded-full" }), (0, jsx_runtime_1.jsx)("span", { className: "text-[#18181b]", children: chain.name })] }) }, chain.id))) })] })] }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("label", { className: "mb-1.5 block text-sm font-medium text-[#3f3f46]", children: "Accepted tokens" }), (0, jsx_runtime_1.jsx)(relay_kit_ui_1.TokenSelector, { address: address, chainIdsFilter: [selectedChainId], context: "from", fromChainWalletVMSupported: true, isValidAddress: true, lockedChainIds: [selectedChainId], multiWalletSupportEnabled: true, onAnalyticEvent: undefined, popularChainIds: [1, 8453, constants_1.RELAY_SOLANA_MAINNET_CHAIN_ID], setToken: handleTokenSelect, supportedWalletVMs: ["evm", "svm"], token: undefined, trigger: (0, jsx_runtime_1.jsxs)("button", { className: "flex h-10 w-full items-center justify-between rounded-lg border border-[#d1d1d6] bg-white px-2.5 py-2 transition-colors hover:bg-[#fafafa]", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [selectedToken?.metadata?.logoURI && ((0, jsx_runtime_1.jsx)("img", { src: selectedToken.metadata.logoURI, alt: selectedToken.symbol, className: "h-6 w-6 rounded-full" })), (0, jsx_runtime_1.jsx)("span", { className: "text-base text-[#18181b]", children: selectedToken.symbol })] }), (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronDown, { className: "h-4 w-4 text-[#51525c]" })] }) })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "mx-5 mt-4 flex items-start rounded-xl border border-[#e4e4e7] bg-[#fafafa]", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex flex-1 flex-col items-center gap-2 px-5 pb-3 pt-5", children: [(0, jsx_runtime_1.jsx)("div", { className: "flex w-full items-center justify-center", children: (0, jsx_runtime_1.jsx)("div", { className: "w-full", children: (0, jsx_runtime_1.jsx)("div", { className: "flex aspect-[144/146] w-full flex-col items-center justify-center overflow-hidden", children: (0, jsx_runtime_1.jsx)(qrcode_react_1.QRCodeSVG, { value: depositAddress, size: 144, level: "M" }) }) }) }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-xs font-semibold leading-[18px] text-[#0b57c2]", children: "SCAN WITH" }), (0, jsx_runtime_1.jsx)(CoinbaseLogo, {})] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "relative flex flex-1 flex-col gap-2 self-stretch border-l border-[#e4e4e7] p-6", children: [(0, jsx_runtime_1.jsx)("label", { className: "text-sm font-medium leading-5 text-[#3f3f46]", children: "Deposit address:" }), (0, jsx_runtime_1.jsxs)("div", { className: "relative flex w-full flex-wrap items-center gap-2", children: [(0, jsx_runtime_1.jsx)("p", { className: "h-[74px] flex-1 overflow-hidden text-ellipsis whitespace-pre-wrap break-all pr-6 text-base font-semibold leading-6 text-[#18181b]", children: depositAddress }), (0, jsx_runtime_1.jsx)("button", { onClick: handleCopyAddress, className: "absolute bottom-0 right-0 h-4 w-4 transition-opacity hover:opacity-70", "aria-label": "Copy address", children: (0, jsx_runtime_1.jsx)(lucide_react_1.Copy, { className: "h-full w-full text-[#51525c]" }) })] })] })] }), (0, jsx_runtime_1.jsx)("div", { className: "mx-5 mt-4", children: (0, jsx_runtime_1.jsxs)("p", { className: "font-neue-montreal-italic text-center text-sm leading-[1.3] text-[#3f3f46]", children: ["Do not send any tokens other than the ones specified.", (0, jsx_runtime_1.jsx)("br", {}), "Tokens not accepted will not be converted."] }) }), (0, jsx_runtime_1.jsx)("div", { className: "mt-4 px-5", children: (0, jsx_runtime_1.jsx)(button_1.Button, { onClick: handleCopyAddress, className: "h-12 w-full rounded-xl 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: "Copy deposit address" }) })] })] }));
-}

package/dist/cjs/global-account/react/components/IPFSMediaRenderer/IPFSMediaRenderer.d.ts

@@ -1,39 +0,0 @@
-import type { ThirdwebClient } from "thirdweb";
-interface IPFSMediaRendererProps {
-    /** The source URL - can be IPFS URL (ipfs://...) or HTTP URL */
-    src: string | null | undefined;
-    /** Alt text for the media */
-    alt?: string;
-    /** CSS class name */
-    className?: string;
-    /** Thirdweb client instance (optional, uses default if not provided) */
-    client?: ThirdwebClient;
-    /** Width of the media */
-    width?: string | number;
-    /** Height of the media */
-    height?: string | number;
-    /** Controls property for video/audio */
-    controls?: boolean;
-    /** Style object */
-    style?: React.CSSProperties;
-}
-/**
- * IPFSMediaRenderer - A wrapper around Thirdweb's MediaRenderer that configures
- * the IPFS gateway URL to use our validated gateway.
- *
- * Features:
- * - Configures MediaRenderer to use cloudflare-ipfs.com gateway
- * - Gateway matches our allowed list in profileDisplay.ts
- * - Provides fallback for missing sources
- *
- * @example
- * ```tsx
- * <IPFSMediaRenderer
- *   src="ipfs://QmX..."
- *   alt="Profile Avatar"
- *   className="size-14 rounded-full"
- * />
- * ```
- */
-export declare function IPFSMediaRenderer({ src, alt, className, client, width, height, controls, style, }: IPFSMediaRendererProps): import("react/jsx-runtime").JSX.Element;
-export {};

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

@@ -1,37 +0,0 @@
-"use strict";
-"use client";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.IPFSMediaRenderer = IPFSMediaRenderer;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const thirdweb_1 = require("../../../../shared/utils/thirdweb");
-const react_1 = require("thirdweb/react");
-// Primary IPFS gateway URL - matches our allowed list in profileDisplay.ts
-// Note: MediaRenderer expects the base gateway URL without /ipfs path
-const IPFS_GATEWAY_URL = "https://cloudflare-ipfs.com";
-/**
- * IPFSMediaRenderer - A wrapper around Thirdweb's MediaRenderer that configures
- * the IPFS gateway URL to use our validated gateway.
- *
- * Features:
- * - Configures MediaRenderer to use cloudflare-ipfs.com gateway
- * - Gateway matches our allowed list in profileDisplay.ts
- * - Provides fallback for missing sources
- *
- * @example
- * ```tsx
- * <IPFSMediaRenderer
- *   src="ipfs://QmX..."
- *   alt="Profile Avatar"
- *   className="size-14 rounded-full"
- * />
- * ```
- */
-function IPFSMediaRenderer({ src, alt = "Media", className, client = thirdweb_1.client, width, height, controls, style, }) {
-    // If no source, render fallback
-    if (!src) {
-        return ((0, jsx_runtime_1.jsx)("div", { className: className, style: style, "aria-label": alt, children: (0, jsx_runtime_1.jsx)("div", { className: "bg-b3-primary-wash flex h-full w-full items-center justify-center", children: (0, jsx_runtime_1.jsx)("span", { className: "text-b3-grey font-neue-montreal-semibold text-xs", children: alt.charAt(0).toUpperCase() }) }) }));
-    }
-    // Convert IPFS URLs to HTTP gateway URLs if needed
-    // This handles both ipfs:// URLs and existing HTTP gateway URLs
-    return ((0, jsx_runtime_1.jsx)(react_1.MediaRenderer, { src: src, client: client, alt: alt, className: className, width: width ? width.toString() : undefined, height: height ? height.toString() : undefined, controls: controls, style: style }));
-}

package/dist/cjs/global-account/react/components/LinkAccount/LinkNewAccount.d.ts

@@ -1,4 +0,0 @@
-import { LinkNewAccountModalProps } from "../../stores/useModalStore";
-export declare function LinkNewAccount({ onSuccess: onSuccessCallback, onError, onClose, chain, partnerId, className, }: LinkNewAccountModalProps & {
-    className?: string;
-}): import("react/jsx-runtime").JSX.Element;