@ab-org/predicate-market-sdk 1.0.0 → 1.0.1

package/dist/types.d.ts

@@ -1,62 +0,0 @@
-export interface CustodyAdapter {
-    getDepositStatus(depositId: string): Promise<{
-        status: string;
-        txHash?: string;
-    }>;
-    requestWithdraw(params: {
-        amount: string;
-        token: string;
-        chain: string;
-        targetAddress: string;
-    }): Promise<{
-        requestId: string;
-    }>;
-    getWithdrawStatus(requestId: string): Promise<{
-        status: string;
-        txHash?: string;
-        etaSeconds?: number;
-    }>;
-}
-export interface ModalController<TConfig> {
-    open(config?: TConfig): void;
-}
-export interface TokenInfo {
-    symbol: string;
-    name: string;
-    decimals: number;
-    iconUrl?: string;
-    minAmount?: string;
-    maxAmount?: string;
-}
-export interface ChainInfo {
-    id: string;
-    name: string;
-    iconUrl?: string;
-    confirmations?: number;
-    estimatedTime?: string;
-}
-export interface QuoteRequest {
-    token: string;
-    chain: string;
-    amount: string;
-    direction: "deposit" | "withdraw";
-}
-export interface QuoteResult {
-    quoteId: string;
-    estimatedAmount: string;
-    slippage: string;
-    fee: string;
-    feeToken: string;
-    exchangeRate: string;
-    expiresAt: number;
-}
-export interface DepositAddressResult {
-    address: string;
-    minimumDeposit?: string;
-}
-export interface MarketDataProvider {
-    getSupportedTokens(direction: "deposit" | "withdraw"): Promise<TokenInfo[]>;
-    getSupportedChains(token: string, direction: "deposit" | "withdraw"): Promise<ChainInfo[]>;
-    getQuote(request: QuoteRequest): Promise<QuoteResult>;
-    getDepositAddress(token: string, chain: string): Promise<DepositAddressResult>;
-}

package/dist/types.js

@@ -1 +0,0 @@
-export {};

package/dist/ui/DepositModal.d.ts

@@ -1,36 +0,0 @@
-import { type ReactNode } from "react";
-import { type SelectOption } from "./components/DropdownField.js";
-export interface DepositModalProps {
-    /** Pre-selected token id. */
-    token?: string;
-    /** Pre-selected chain id. */
-    chain?: string;
-    /** Available tokens (when not provided, fetched from getChains). */
-    tokenOptions?: SelectOption[];
-    /** Available chains (when not provided, derived from getChains by token). */
-    chainOptions?: SelectOption[];
-    /** Deposit address，必须由调用方传入；在已选 token+chain 时若未传入合法值将抛错。 */
-    depositAddress?: string;
-    /** e.g. "0.01 USDT" */
-    minimumDeposit?: string;
-    /** Icon rendered at the center of the QR code. */
-    qrCenterIcon?: ReactNode;
-    /** Extra icons shown on the Transfer Crypto row. */
-    cryptoIcons?: ReactNode;
-    /** Deposit amount for quote (optional; when set, quote is fetched and shown). */
-    depositAmount?: string;
-    /** Called for toast messages (copy, quote expired, wait for balance, transfer confirmed). */
-    onShowToast?: (message: string) => void;
-    /** When set, show "Transfer confirmed" toast and explorer link. */
-    txHash?: string;
-    /** Build explorer URL for tx; e.g. (chainId, txHash) => `https://bscscan.com/tx/${txHash}` */
-    explorerTxUrl?: (chainId: string, txHash: string) => string;
-    onTokenSelect?: (id: string) => void;
-    onChainSelect?: (id: string) => void;
-    onCopyAddress?: (address: string) => void;
-    onBuyCrypto?: () => void;
-    onSignIn?: () => void;
-    onBack?: () => void;
-    onClose?: () => void;
-}
-export declare const DepositModal: ({ token, chain, tokenOptions: tokenOptionsProp, chainOptions: chainOptionsProp, depositAddress, minimumDeposit, qrCenterIcon, cryptoIcons, depositAmount, onShowToast, txHash, explorerTxUrl, onTokenSelect, onChainSelect, onCopyAddress, onBuyCrypto, onSignIn, onBack, onClose, }: DepositModalProps) => import("react/jsx-runtime.js").JSX.Element;

package/dist/ui/DepositModal.js

@@ -1,354 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { useState, useEffect, useCallback, useMemo, useRef } from "react";
-import { ModalFrame } from "./components/ModalFrame.js";
-import { StepIndicator } from "./components/StepIndicator.js";
-import { DropdownField } from "./components/DropdownField.js";
-import { Countdown } from "./components/Countdown.js";
-import { DepositDetailsPanel } from "./components/DepositDetailsPanel.js";
-import { LoginRequiredOverlay } from "./components/LoginRequiredOverlay.js";
-import { useSession } from "./hooks/useSession.js";
-import { colors, fonts, radii } from "./theme.js";
-import { getChains, quote, registerPlatform, } from "../modules/api.js";
-import { getEnv } from "../utils/env";
-/** 校验是否为合法的充值地址（传入值）：非空且长度满足常见链地址格式 */
-function isValidDepositAddress(v) {
-    return typeof v === "string" && v.trim().length >= 20;
-}
-/* ─── Icons ──────────────────────────────────── */
-const BackArrow = () => (_jsx("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", children: _jsx("path", { d: "M15 6L9 12L15 18", stroke: colors.textPrimary, strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }));
-const TransferIcon = () => (_jsxs("svg", { width: "36", height: "36", viewBox: "0 0 36 36", fill: "none", children: [_jsx("circle", { cx: "18", cy: "18", r: "18", fill: "rgba(255,255,255,0.08)" }), _jsx("circle", { cx: "18", cy: "18", r: "7", stroke: colors.textPrimary, strokeWidth: "1.5" }), _jsx("circle", { cx: "18", cy: "18", r: "2.5", fill: colors.textPrimary }), _jsx("path", { d: "M18 7V11", stroke: colors.textPrimary, strokeWidth: "1.5", strokeLinecap: "round" }), _jsx("path", { d: "M18 25V29", stroke: colors.textPrimary, strokeWidth: "1.5", strokeLinecap: "round" }), _jsx("path", { d: "M7 18H11", stroke: colors.textPrimary, strokeWidth: "1.5", strokeLinecap: "round" }), _jsx("path", { d: "M25 18H29", stroke: colors.textPrimary, strokeWidth: "1.5", strokeLinecap: "round" })] }));
-const FiatIcon = () => (_jsxs("svg", { width: "36", height: "36", viewBox: "0 0 36 36", fill: "none", children: [_jsx("circle", { cx: "18", cy: "18", r: "18", fill: "rgba(255,255,255,0.06)" }), _jsx("circle", { cx: "18", cy: "18", r: "10", stroke: colors.textSecondary, strokeWidth: "1.5" }), _jsx("path", { d: "M18 12V24", stroke: colors.textSecondary, strokeWidth: "1.5", strokeLinecap: "round" }), _jsx("path", { d: "M15 15.5C15 14.12 16.34 13 18 13C19.66 13 21 14.12 21 15.5C21 16.88 19.66 18 18 18C16.34 18 15 19.12 15 20.5C15 21.88 16.34 23 18 23C19.66 23 21 21.88 21 20.5", stroke: colors.textSecondary, strokeWidth: "1.5", strokeLinecap: "round" })] }));
-const DefaultCryptoIcons = () => {
-    const tokens = [
-        { label: "B", bg: "#F7931A" },
-        { label: "E", bg: "#627EEA" },
-        { label: "≡", bg: "#26A17B" },
-        { label: "$", bg: "#2775CA" },
-        { label: "S", bg: "#9945FF" },
-        { label: "A", bg: "#E84142" },
-    ];
-    return (_jsx("div", { style: { display: "flex", gap: 0 }, children: tokens.map((t, i) => (_jsx("div", { style: {
-                width: 24,
-                height: 24,
-                borderRadius: "50%",
-                background: t.bg,
-                display: "flex",
-                alignItems: "center",
-                justifyContent: "center",
-                fontSize: 11,
-                fontWeight: 700,
-                color: "#fff",
-                marginLeft: i > 0 ? -4 : 0,
-                border: `2px solid ${colors.card}`,
-                boxSizing: "content-box",
-            }, children: t.label }, i))) }));
-};
-/* ─── Helpers: derive options from getChains ─── */
-function chainsToTokenOptions(chains) {
-    const bySymbol = new Map();
-    for (const c of chains) {
-        for (const t of c.tokens) {
-            if (!bySymbol.has(t.symbol))
-                bySymbol.set(t.symbol, { symbol: t.symbol, decimals: t.decimals });
-        }
-    }
-    return Array.from(bySymbol.entries())
-        .map(([id, { symbol }]) => ({
-        id,
-        label: symbol,
-        subtitle: symbol,
-    }));
-}
-function chainsToChainOptionsForToken(chains, tokenSymbol) {
-    return chains
-        .filter((c) => c.tokens.some((t) => t.symbol === tokenSymbol))
-        .map((c) => ({
-        id: c.chain_id,
-        label: c.network,
-        subtitle: `chainId: ${c.chain_id}`,
-        icon: (_jsx("span", { style: {
-                display: "inline-flex",
-                alignItems: "center",
-                justifyContent: "center",
-                minWidth: 28,
-                height: 28,
-                padding: "0 6px",
-                borderRadius: radii.card,
-                background: "rgba(255,255,255,0.08)",
-                fontSize: 12,
-                fontWeight: 600,
-                color: colors.textPrimary,
-                fontFamily: fonts.family,
-            }, children: c.network })),
-    }));
-}
-function getTokenAddressForChain(chains, chainId, tokenSymbol) {
-    const chain = chains.find((c) => c.chain_id === chainId);
-    return chain?.tokens.find((t) => t.symbol === tokenSymbol)?.address;
-}
-/* ─── Main Component ─────────────────────────── */
-const FUNDING_TOKEN_SYMBOL = getEnv("FUNDING_TOKEN_SYMBOL");
-export const DepositModal = ({ token, chain, tokenOptions: tokenOptionsProp, chainOptions: chainOptionsProp, depositAddress, minimumDeposit, qrCenterIcon, cryptoIcons, depositAmount, onShowToast, txHash, explorerTxUrl, onTokenSelect, onChainSelect, onCopyAddress, onBuyCrypto, onSignIn, onBack, onClose, }) => {
-    const session = useSession();
-    const [view, setView] = useState("entry");
-    const [copySuccessMessage, setCopySuccessMessage] = useState(null);
-    const [apiChains, setApiChains] = useState(null);
-    const [apiQuote, setApiQuote] = useState(null);
-    const [loadingChains, setLoadingChains] = useState(false);
-    const [loadingQuote, setLoadingQuote] = useState(false);
-    const [quoteRefreshKey, setQuoteRefreshKey] = useState(0);
-    const [internalDepositAddress, setInternalDepositAddress] = useState(undefined);
-    const lastEmittedAddressRef = useRef(undefined);
-    const lastEmittedChainRef = useRef(undefined);
-    const tokenOptions = useMemo(() => {
-        if (tokenOptionsProp?.length)
-            return tokenOptionsProp;
-        if (!apiChains?.length)
-            return undefined;
-        return chainsToTokenOptions(apiChains);
-    }, [tokenOptionsProp, apiChains]);
-    const chainOptions = useMemo(() => {
-        if (chainOptionsProp?.length)
-            return chainOptionsProp;
-        if (!apiChains?.length || !token)
-            return undefined;
-        return chainsToChainOptionsForToken(apiChains, token);
-    }, [chainOptionsProp, apiChains, token]);
-    // 仅有一个 chain 选项时默认选中
-    useEffect(() => {
-        if (chainOptions?.length !== 1 || !onChainSelect)
-            return;
-        const onlyId = chainOptions[0].id;
-        if (chain === onlyId)
-            return;
-        onChainSelect(onlyId);
-    }, [chainOptions, chain, onChainSelect]);
-    useEffect(() => {
-        if (view !== "transfer")
-            return;
-        setLoadingChains(true);
-        getChains()
-            .then((res) => setApiChains(res?.chains ?? {}))
-            .finally(() => setLoadingChains(false));
-    }, [view]);
-    // Fetch depositAddress internally when user is signed in and a chain has been selected.
-    useEffect(() => {
-        if (view !== "transfer")
-            return;
-        if (!session?.address || !chain)
-            return;
-        registerPlatform({
-            platform_contract_address: session.address,
-            chain_id: chain,
-        })
-            .then((res) => {
-            if (res?.deposit_address) {
-                setInternalDepositAddress(res.deposit_address);
-            }
-        })
-            .catch(() => {
-            // silent failure; UI will keep placeholder if any
-        });
-    }, [view, chain, session?.address]);
-    useEffect(() => {
-        if (!apiChains?.length || !token || !chain) {
-            setApiQuote(null);
-            return;
-        }
-        const tokenAddress = getTokenAddressForChain(apiChains, chain, token);
-        if (!tokenAddress) {
-            setApiQuote(null);
-            return;
-        }
-        setLoadingQuote(true);
-        console.log('setLoadingQuote', tokenAddress, depositAmount);
-        quote({
-            direction: "deposit",
-            chain_id: chain,
-            token_address: tokenAddress,
-            token_amount: depositAmount || undefined,
-        })
-            .then((q) => setApiQuote(q ?? null))
-            .catch((err) => {
-            const message = err?.message ?? String(err);
-            console.error('setLoadingQuote', message);
-            if (onShowToast)
-                onShowToast(message);
-            setApiQuote({
-                token_address: tokenAddress,
-                token_symbol: token,
-                token_decimals: 18,
-                rate: "1",
-                chain_id: Number(chain) || 56,
-                deposit_address: "0x" + "0".repeat(39) + "1",
-                dst_token_amount: depositAmount ?? "0",
-                expires_at: new Date(Date.now() + 60000).toISOString(),
-            });
-        })
-            .finally(() => setLoadingQuote(false));
-    }, [apiChains, token, chain, depositAmount, quoteRefreshKey, onShowToast]);
-    // Emit resolved address when external prop is provided/changes
-    useEffect(() => {
-        if (!chain)
-            return;
-        if (!depositAddress)
-            return;
-        if (lastEmittedAddressRef.current === depositAddress &&
-            lastEmittedChainRef.current === chain) {
-            return;
-        }
-        lastEmittedAddressRef.current = depositAddress;
-        lastEmittedChainRef.current = chain;
-    }, [depositAddress, chain]);
-    const handleQuoteExpired = useCallback(() => {
-        setQuoteRefreshKey((k) => k + 1);
-    }, []);
-    useEffect(() => {
-        if (txHash && chain && onShowToast) {
-            onShowToast("Transfer confirmed");
-        }
-    }, [txHash, chain, onShowToast]);
-    if (!session) {
-        return _jsx(LoginRequiredOverlay, { title: "Deposit", onSignIn: onSignIn, onClose: onClose });
-    }
-    const goToEntry = () => {
-        setView("entry");
-        onBack?.();
-    };
-    const handleCopyAddress = useCallback((address) => {
-        onCopyAddress?.(address);
-        onShowToast?.("Address copied");
-        setCopySuccessMessage("Address copied");
-    }, [onCopyAddress, onShowToast]);
-    useEffect(() => {
-        if (!copySuccessMessage)
-            return;
-        const t = setTimeout(() => setCopySuccessMessage(null), 2000);
-        return () => clearTimeout(t);
-    }, [copySuccessMessage]);
-    return (_jsxs(ModalFrame, { onClose: onClose, contentStyle: { padding: "24px", position: "relative" }, children: [copySuccessMessage && (_jsx("div", { style: {
-                    position: "absolute",
-                    bottom: 24,
-                    left: "50%",
-                    transform: "translateX(-50%)",
-                    padding: "10px 20px",
-                    borderRadius: 8,
-                    background: "var(--pm-colors-card, #1a1a2e)",
-                    color: "var(--pm-colors-textPrimary, #fff)",
-                    fontSize: 13,
-                    fontWeight: 500,
-                    boxShadow: "0 4px 12px rgba(0,0,0,.25)",
-                    zIndex: 10,
-                }, children: copySuccessMessage })), view === "entry" ? (_jsx(EntryView, { cryptoIcons: cryptoIcons, onTransferCrypto: () => setView("transfer"), onBuyCrypto: onBuyCrypto })) : (_jsx(TransferView, { token: token, chain: chain, tokenOptions: tokenOptions, chainOptions: chainOptions, depositAddress: depositAddress ?? internalDepositAddress, minimumDeposit: minimumDeposit, qrCenterIcon: qrCenterIcon, quote: apiQuote, quoteLoading: loadingQuote, txHash: txHash, chainIdForExplorer: chain, explorerTxUrl: explorerTxUrl, loadingChains: loadingChains, onTokenSelect: onTokenSelect, onChainSelect: onChainSelect, onCopyAddress: handleCopyAddress, onQuoteExpired: handleQuoteExpired, onRefreshQuote: () => {
-                    if (!apiChains?.length || !token || !chain)
-                        return;
-                    const tokenAddress = getTokenAddressForChain(apiChains, chain, token);
-                    if (tokenAddress) {
-                        setLoadingQuote(true);
-                        quote({ direction: "deposit", chain_id: chain, token_address: tokenAddress, token_amount: depositAmount })
-                            .then((q) => setApiQuote(q ?? null))
-                            .catch(() => {
-                            setApiQuote({
-                                token_address: tokenAddress,
-                                token_symbol: token,
-                                token_decimals: 18,
-                                rate: "1",
-                                chain_id: Number(chain) || 56,
-                                deposit_address: "0x" + "0".repeat(39) + "1",
-                                dst_token_amount: depositAmount ?? "0",
-                                expires_at: new Date(Date.now() + 60000).toISOString(),
-                            });
-                        })
-                            .finally(() => setLoadingQuote(false));
-                    }
-                }, onShowToast: onShowToast, onBack: goToEntry }))] }));
-};
-/* ─── Entry View ─────────────────────────────── */
-const EntryView = ({ cryptoIcons, onTransferCrypto, onBuyCrypto: _onBuyCrypto, }) => (_jsxs("div", { style: { display: "flex", flexDirection: "column", gap: 24 }, children: [_jsx("h2", { style: { margin: 0, fontSize: 24, fontWeight: 600, lineHeight: 1.4 }, children: "Deposit" }), _jsxs("div", { style: { display: "flex", flexDirection: "column", gap: 12 }, children: [_jsxs("button", { type: "button", onClick: onTransferCrypto, style: {
-                        display: "flex",
-                        alignItems: "center",
-                        gap: 14,
-                        padding: "18px 20px",
-                        borderRadius: radii.card,
-                        border: `1px solid ${colors.border}`,
-                        background: "transparent",
-                        cursor: "pointer",
-                        textAlign: "left",
-                        fontFamily: fonts.family,
-                        width: "100%",
-                        transition: "border-color .15s",
-                    }, onMouseEnter: (e) => { e.target.closest("button").style.borderColor = colors.borderStrong; }, onMouseLeave: (e) => { e.target.closest("button").style.borderColor = colors.border; }, children: [_jsx(TransferIcon, {}), _jsxs("div", { style: { flex: 1, display: "flex", flexDirection: "column", gap: 2 }, children: [_jsx("span", { style: { color: colors.textPrimary, fontSize: 16, fontWeight: 600 }, children: "Transfer Crypto" }), _jsx("span", { style: { color: colors.textSecondary, fontSize: 13 }, children: "No limit \u00B7 Instant" })] }), cryptoIcons ?? _jsx(DefaultCryptoIcons, {})] }), _jsxs("div", { style: {
-                        display: "flex",
-                        alignItems: "center",
-                        gap: 14,
-                        padding: "18px 20px",
-                        borderRadius: radii.card,
-                        border: `1px solid ${colors.border}`,
-                        opacity: 0.55,
-                    }, children: [_jsx(FiatIcon, {}), _jsxs("div", { style: { flex: 1, display: "flex", flexDirection: "column", gap: 2 }, children: [_jsx("span", { style: { color: colors.textSecondary, fontSize: 16, fontWeight: 600 }, children: "Buy Crypto" }), _jsx("span", { style: { color: colors.textSecondary, fontSize: 13 }, children: "Debit card, credit card, ACH" })] }), _jsx("span", { style: {
-                                padding: "5px 12px",
-                                borderRadius: radii.pill,
-                                border: `1px solid ${colors.border}`,
-                                fontSize: 12,
-                                fontWeight: 500,
-                                color: colors.textSecondary,
-                                whiteSpace: "nowrap",
-                            }, children: "Coming Soon" })] })] })] }));
-/* ─── Transfer View (stepper) ────────────────── */
-const TransferView = ({ token, chain, tokenOptions, chainOptions, depositAddress, minimumDeposit, qrCenterIcon, quote: quoteData, quoteLoading, txHash, chainIdForExplorer, explorerTxUrl, loadingChains, onTokenSelect, onChainSelect, onCopyAddress, onQuoteExpired, onRefreshQuote, onShowToast, onBack, }) => {
-    const activeStep = chain ? 2 : token ? 1 : 0;
-    const stepActive = [!!token, !!chain, !!quoteData];
-    const quoteExpired = useMemo(() => {
-        if (!quoteData?.expires_at)
-            return false;
-        try {
-            return new Date(quoteData.expires_at).getTime() < Date.now();
-        }
-        catch {
-            return false;
-        }
-    }, [quoteData?.expires_at]);
-    const didToastWait = useRef(false);
-    useEffect(() => {
-        if (!depositAddress || !onShowToast || didToastWait.current)
-            return;
-        didToastWait.current = true;
-        onShowToast("Please wait for deposit-address balance to update");
-    }, [depositAddress, onShowToast]);
-    return (_jsxs("div", { style: { display: "flex", flexDirection: "column", gap: 24 }, children: [_jsx("div", { style: { display: "flex", alignItems: "center", justifyContent: "space-between" }, children: _jsxs("div", { style: { display: "flex", alignItems: "center", gap: 12 }, children: [onBack && (_jsx("button", { type: "button", onClick: onBack, style: {
-                                background: "transparent",
-                                border: "none",
-                                cursor: "pointer",
-                                padding: 0,
-                                display: "flex",
-                                alignItems: "center",
-                            }, children: _jsx(BackArrow, {}) })), _jsx("h2", { style: { margin: 0, fontSize: 24, fontWeight: 600, lineHeight: 1.4 }, children: "Transfer Crypto" })] }) }), _jsxs("div", { style: { display: "flex", gap: 16, position: "relative" }, children: [_jsx(StepIndicator, { steps: 3, stepActive: stepActive, activeStep: activeStep }), _jsxs("div", { style: { flex: 1, display: "flex", flexDirection: "column", gap: 40 }, children: [_jsx(DropdownField, { label: "Select token", placeholder: loadingChains ? "Loading…" : "Token", value: token, options: tokenOptions, onSelect: onTokenSelect }), _jsx(DropdownField, { label: "Select chain", placeholder: loadingChains ? "Loading…" : "Chain", value: chain, options: chainOptions, onSelect: onChainSelect }), quoteData && token && chain && (_jsx("div", { id: "quote-panel", style: {
-                                    padding: "12px 16px",
-                                    borderRadius: radii.card,
-                                    margin: "-10px 0",
-                                    border: `1px solid ${colors.border}`,
-                                    display: "flex",
-                                    flexDirection: "column",
-                                    gap: 8,
-                                }, children: quoteLoading ? (_jsx("span", { style: { fontSize: 13, color: colors.textSecondary }, children: "Loading\u2026" })) : (_jsxs(_Fragment, { children: [_jsxs("span", { style: { fontSize: 13, color: colors.textSecondary }, children: ["1 ", quoteData.token_symbol, " = ", quoteData.rate, " ", FUNDING_TOKEN_SYMBOL] }), quoteData.expires_at && (_jsx(Countdown, { expiresAt: quoteData.expires_at, isExpired: quoteExpired, onExpired: onQuoteExpired })), quoteExpired && (_jsxs("div", { style: { display: "flex", alignItems: "center", gap: 8 }, children: [_jsx("span", { style: { fontSize: 13, color: "#f59e0b" }, children: "Quote expired, please refresh" }), onRefreshQuote && (_jsx("button", { type: "button", onClick: onRefreshQuote, style: {
-                                                        padding: "4px 12px",
-                                                        fontSize: 12,
-                                                        borderRadius: radii.pill,
-                                                        border: `1px solid ${colors.border}`,
-                                                        background: "transparent",
-                                                        color: colors.textPrimary,
-                                                        cursor: "pointer",
-                                                        fontFamily: fonts.family,
-                                                    }, children: "Refresh" }))] }))] })) })), _jsxs("div", { style: { display: "flex", flexDirection: "column", gap: 8, marginTop: "-5px" }, id: "deposit-details", children: [_jsx("span", { style: { fontSize: 14, lineHeight: 1.4, color: colors.textPrimary }, children: "Deposit details" }), depositAddress ? (_jsxs(_Fragment, { children: [_jsx(DepositDetailsPanel, { address: depositAddress, tokenIcon: qrCenterIcon, minimumDeposit: minimumDeposit, onCopyAddress: onCopyAddress }), txHash && chainIdForExplorer && explorerTxUrl && (_jsx("a", { href: explorerTxUrl(chainIdForExplorer, txHash), target: "_blank", rel: "noopener noreferrer", style: {
-                                                    fontSize: 13,
-                                                    color: colors.textPrimary,
-                                                    textDecoration: "underline",
-                                                }, children: "View on explorer" }))] })) : (_jsx("div", { style: {
-                                            padding: "20px",
-                                            borderRadius: radii.card,
-                                            border: `1px solid ${colors.border}`,
-                                            color: colors.textSecondary,
-                                            fontSize: 13,
-                                            textAlign: "center",
-                                        }, children: "Select token and chain to view deposit details" }))] })] })] })] }));
-};

package/dist/ui/SignInModal.d.ts

@@ -1,22 +0,0 @@
-import { type CubeSignerSession, type WalletSession } from "@ab-org/sdk-core";
-import type { GoogleCredential } from "../auth/google.js";
-import type { TwitterAuthResult } from "../auth/twitter.js";
-import type { SocialProvider, WalletItem } from "./signInTypes.js";
-export interface SignInModalProps {
-    title?: string;
-    socialProviders?: SocialProvider[];
-    wallets?: WalletItem[];
-    initialVisibleCount?: number;
-    privacyPolicyUrl?: string;
-    termsOfUseUrl?: string;
-    onGoogleLogin?: (credential: GoogleCredential) => void;
-    onTwitterLogin?: (result: TwitterAuthResult) => void;
-    onCubeSignerSession?: (session: CubeSignerSession) => void;
-    onWalletConnected?: (session: WalletSession, walletId: string) => void;
-    onSocialLogin?: (providerId: string) => void;
-    onWalletSelect?: (walletId: string) => void | Promise<void>;
-    onDismiss?: () => void;
-    onSuccess?: (session: WalletSession) => void;
-}
-export declare function clearSocialAccountInstance(): void;
-export declare const SignInModal: ({ title, socialProviders, wallets, initialVisibleCount, privacyPolicyUrl, termsOfUseUrl, onGoogleLogin, onTwitterLogin, onCubeSignerSession, onWalletConnected, onSocialLogin, onWalletSelect, onDismiss, onSuccess, }: SignInModalProps) => import("react/jsx-runtime.js").JSX.Element;

package/dist/ui/SignInModal.js

@@ -1,77 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState } from "react";
-import { sessionStore } from "@ab-org/sdk-core";
-import { getSDKConfig } from "../auth/config.js";
-import { clearSocialAccountInstance as clearEmbeddedWalletAccount } from "../auth/walletAccount.js";
-import { resolveSocialProviders } from "./SignInModal.shared.js";
-import { SignInModalFooter, SignInModalFrame, SignInModalSocialSection, SignInModalWalletGrid, } from "./SignInModal.sections.js";
-import { useSignInModalController } from "./useSignInModalController.js";
-import { Toast } from "./components/Toast.js";
-export function clearSocialAccountInstance() {
-    try {
-        clearEmbeddedWalletAccount();
-        const storage = typeof localStorage !== "undefined" ? localStorage : null;
-        const adapterId = storage?.getItem("ab:wallet:adapterId");
-        const session = sessionStore.getState().session;
-        const isSocialSession = session?.walletType === "social" ||
-            session?.authSource === "google" ||
-            session?.authSource === "twitter" ||
-            adapterId === "cubist";
-        if (!isSocialSession)
-            return;
-        sessionStore.clearSession();
-        storage?.removeItem("ab:wallet:session");
-        storage?.removeItem("ab:wallet:adapterId");
-    }
-    catch {
-        clearEmbeddedWalletAccount();
-        sessionStore.clearSession();
-    }
-}
-export const SignInModal = ({ title = "Welcome to PredicateMarket", socialProviders, wallets, initialVisibleCount, privacyPolicyUrl = "#", termsOfUseUrl = "#", onGoogleLogin, onTwitterLogin, onCubeSignerSession, onWalletConnected, onSocialLogin, onWalletSelect, onDismiss, onSuccess, }) => {
-    const sdkConfig = getSDKConfig();
-    const effectiveSocialProviders = resolveSocialProviders(socialProviders ?? sdkConfig.signIn?.socialProviders);
-    const effectiveWallets = wallets ?? sdkConfig.signIn?.wallets;
-    const effectiveInitialVisibleCount = initialVisibleCount ?? sdkConfig.signIn?.initialVisibleCount ?? 5;
-    const [toastError, setToastError] = useState(null);
-    const { expanded, loadingProvider, loadingWalletId, visibleWallets, showExpandToggle, isBusy, handleSocialClick, handleWalletClick, toggleExpanded, } = useSignInModalController({
-        wallets: effectiveWallets,
-        initialVisibleCount: effectiveInitialVisibleCount,
-        onGoogleLogin,
-        onTwitterLogin,
-        onCubeSignerSession,
-        onWalletConnected,
-        onSocialLogin,
-        onWalletSelect,
-    });
-    return (_jsxs(SignInModalFrame, { id: "SignInModalFrame", title: title, onClose: onDismiss, footer: _jsx(SignInModalFooter, { privacyPolicyUrl: privacyPolicyUrl, termsOfUseUrl: termsOfUseUrl }), children: [toastError ? (_jsx(Toast, { message: toastError, variant: "error", duration: 5000, onClose: () => setToastError(null) })) : null, _jsx(SignInModalSocialSection, { id: "SignInModalSocialSection", socialProviders: effectiveSocialProviders, isBusy: isBusy, loadingProvider: loadingProvider, onSocialClick: async (providerId) => {
-                    try {
-                        const session = await handleSocialClick(providerId);
-                        if (!session)
-                            return;
-                        const normalizedAuthSource = providerId === "x"
-                            ? "twitter"
-                            : providerId;
-                        onSuccess?.({
-                            ...session,
-                            walletType: session.walletType ?? "social",
-                            authSource: session.authSource ?? normalizedAuthSource,
-                        });
-                    }
-                    catch (error) {
-                        const msg = error instanceof Error ? error.message : "Social login failed";
-                        setToastError(msg);
-                    }
-                } }), _jsx(SignInModalWalletGrid, { wallets: visibleWallets, isBusy: isBusy, loadingWalletId: loadingWalletId, expanded: expanded, showExpandToggle: showExpandToggle, onWalletClick: async (walletId) => {
-                    try {
-                        const session = await handleWalletClick(walletId);
-                        if (session) {
-                            onSuccess?.(session);
-                        }
-                    }
-                    catch (error) {
-                        const msg = error instanceof Error ? error.message : "Wallet connect failed";
-                        setToastError(msg);
-                    }
-                }, onToggleExpanded: toggleExpanded })] }));
-};

package/dist/ui/SignInModal.sections.d.ts

@@ -1,33 +0,0 @@
-import type { ReactNode } from "react";
-import type { SocialProvider, WalletItem } from "./signInTypes.js";
-export interface SignInModalSocialSectionProps {
-    id: string;
-    socialProviders: SocialProvider[];
-    isBusy: boolean;
-    loadingProvider: string | null;
-    onSocialClick: (providerId: string) => void | Promise<void>;
-}
-export interface SignInModalFrameProps {
-    id: string;
-    title: string;
-    onClose?: () => void;
-    footer?: ReactNode;
-    children: ReactNode;
-}
-export declare const SignInModalFrame: ({ id, title, onClose, footer, children, }: SignInModalFrameProps) => import("react/jsx-runtime.js").JSX.Element;
-export declare const SignInModalSocialSection: ({ id, socialProviders, isBusy, loadingProvider, onSocialClick, }: SignInModalSocialSectionProps) => import("react/jsx-runtime.js").JSX.Element;
-export interface SignInModalWalletGridProps {
-    wallets: WalletItem[];
-    isBusy: boolean;
-    loadingWalletId: string | null;
-    expanded: boolean;
-    showExpandToggle: boolean;
-    onWalletClick: (walletId: string) => void | Promise<void>;
-    onToggleExpanded: () => void;
-}
-export declare const SignInModalWalletGrid: ({ wallets, isBusy, loadingWalletId, expanded, showExpandToggle, onWalletClick, onToggleExpanded, }: SignInModalWalletGridProps) => import("react/jsx-runtime.js").JSX.Element;
-export interface SignInModalFooterProps {
-    privacyPolicyUrl: string;
-    termsOfUseUrl: string;
-}
-export declare const SignInModalFooter: ({ privacyPolicyUrl, termsOfUseUrl, }: SignInModalFooterProps) => import("react/jsx-runtime.js").JSX.Element;

package/dist/ui/SignInModal.sections.js

@@ -1,45 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { ModalFrame } from "./components/ModalFrame.js";
-import { colors, fonts, radii } from "./theme.js";
-import { DefaultWalletIcon, ExpandIcon, SpinnerIcon } from "./SignInModal.shared.js";
-export const SignInModalFrame = ({ id, title, onClose, footer, children, }) => (_jsx(ModalFrame, { onClose: onClose, cardStyle: { padding: "32px 24px" }, contentStyle: { alignItems: "center" }, children: _jsxs("div", { style: { width: "100%", display: "flex", flexDirection: "column", gap: 24, alignItems: "center" }, id: id, children: [_jsx("h2", { style: { margin: 0, fontSize: 24, fontWeight: 600, lineHeight: 1.4, textAlign: "center" }, children: title }), _jsx("div", { style: { width: "100%", display: "flex", flexDirection: "column", gap: 12, alignItems: "center" }, children: children }), footer] }) }));
-export const SignInModalSocialSection = ({ id, socialProviders, isBusy, loadingProvider, onSocialClick, }) => (_jsxs("div", { style: { width: "100%", display: "flex", flexDirection: "column", gap: 24 }, id: id, children: [_jsx("div", { style: { display: "flex", flexDirection: "column", gap: 16 }, children: socialProviders.map((provider) => {
-                const isLoading = loadingProvider === provider.id;
-                return (_jsxs("button", { type: "button", disabled: isBusy, onClick: () => onSocialClick(provider.id), style: {
-                        width: "100%",
-                        height: 48,
-                        borderRadius: radii.pill,
-                        border: `1px solid ${colors.border}`,
-                        background: "transparent",
-                        display: "flex",
-                        alignItems: "center",
-                        justifyContent: "center",
-                        gap: 12,
-                        cursor: isBusy ? "wait" : "pointer",
-                        padding: 12,
-                        boxSizing: "border-box",
-                        opacity: isLoading ? 0.6 : isBusy ? 0.8 : 1,
-                        transition: "opacity .15s",
-                    }, children: [isLoading ? _jsx(SpinnerIcon, {}) : provider.icon, _jsx("span", { style: { fontSize: 16, fontWeight: 500, lineHeight: 1.4, color: colors.textPrimary, fontFamily: fonts.family }, children: isLoading ? "Signing in..." : provider.label })] }, provider.id));
-            }) }), _jsxs("div", { style: { display: "flex", alignItems: "center", gap: 20, width: "100%" }, children: [_jsx("div", { style: { flex: 1, height: 1, background: colors.border } }), _jsx("span", { style: { fontSize: 14, lineHeight: 1.4, color: colors.textPrimary, opacity: 0.4, whiteSpace: "nowrap" }, children: "Or connect a wallet" }), _jsx("div", { style: { flex: 1, height: 1, background: colors.border } })] })] }));
-export const SignInModalWalletGrid = ({ wallets, isBusy, loadingWalletId, expanded, showExpandToggle, onWalletClick, onToggleExpanded, }) => (_jsxs("div", { style: { width: "100%", display: "flex", flexDirection: "column", gap: 8, alignItems: "center", paddingTop: 12 }, children: [_jsx("div", { style: { width: "100%", display: "flex", flexWrap: "wrap", gap: "14px 0" }, children: wallets.map((wallet) => (_jsxs("button", { type: "button", disabled: isBusy, onClick: () => onWalletClick(wallet.id), style: {
-                    width: "25%",
-                    display: "flex",
-                    flexDirection: "column",
-                    alignItems: "center",
-                    gap: 4,
-                    background: "transparent",
-                    border: "none",
-                    cursor: isBusy ? "wait" : "pointer",
-                    padding: 0,
-                    opacity: loadingWalletId === wallet.id ? 0.7 : isBusy ? 0.85 : 1,
-                }, children: [_jsx("div", { style: { width: 56, height: 56, display: "flex", alignItems: "center", justifyContent: "center" }, children: loadingWalletId === wallet.id ? (_jsx(SpinnerIcon, {})) : (wallet.icon ?? _jsx(DefaultWalletIcon, { walletId: wallet.id, name: wallet.name })) }), _jsxs("div", { style: { display: "flex", flexDirection: "column", alignItems: "center", width: "100%" }, children: [_jsx("span", { style: { fontSize: 12, fontWeight: 500, lineHeight: 1.4, color: colors.textPrimary, fontFamily: fonts.family, textAlign: "center", whiteSpace: "nowrap" }, children: wallet.name }), loadingWalletId === wallet.id ? (_jsx("span", { style: { fontSize: 10, lineHeight: 1.4, color: colors.textSecondary, fontFamily: fonts.family }, children: "Connecting..." })) : wallet.installed ? (_jsx("span", { style: { fontSize: 10, lineHeight: 1.4, color: colors.accent, fontFamily: fonts.family }, children: "Installed" })) : wallet.installUrl ? (_jsx("a", { href: wallet.installUrl, target: "_blank", rel: "noopener noreferrer", onClick: (event) => event.stopPropagation(), style: { fontSize: 10, lineHeight: 1.4, color: colors.textSecondary, fontFamily: fonts.family, textDecoration: "underline" }, children: "Install" })) : null] })] }, wallet.id))) }), showExpandToggle && (_jsx("button", { type: "button", onClick: onToggleExpanded, style: {
-                background: "transparent",
-                border: "none",
-                cursor: "pointer",
-                display: "flex",
-                alignItems: "center",
-                justifyContent: "center",
-                padding: 4,
-            }, children: _jsx(ExpandIcon, { expanded: expanded }) }))] }));
-export const SignInModalFooter = ({ privacyPolicyUrl, termsOfUseUrl, }) => (_jsx("div", { style: { padding: "12px 0", display: "flex", justifyContent: "center", width: "100%" }, children: _jsxs("p", { style: { margin: 0, fontSize: 14, lineHeight: 1.4, color: colors.textSecondary, fontFamily: fonts.family, textAlign: "center" }, children: ["By continuing, I agree to the", " ", _jsx("a", { href: privacyPolicyUrl, style: { color: colors.textPrimary, textDecoration: "underline" }, target: "_blank", rel: "noopener noreferrer", children: "Privacy Policy" }), " ", "and", " ", _jsx("a", { href: termsOfUseUrl, style: { color: colors.textPrimary, textDecoration: "underline" }, target: "_blank", rel: "noopener noreferrer", children: "Terms of Use" })] }) }));