@nexus-cross/dapp-ui 1.0.0-beta.1

package/dist/index.d.cts

@@ -0,0 +1,537 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
+import { CSSProperties, ReactNode } from 'react';
+import * as _tanstack_react_query from '@tanstack/react-query';
+
+type Environment = "dev" | "stage" | "production";
+type Theme = "dark" | "light";
+type DrawerDirection$1 = "right" | "bottom" | "left";
+
+interface AppLauncherProps {
+    env?: Environment;
+    theme?: Theme;
+    mobileBreakpoint?: number;
+    domain?: string;
+    children: React.ReactNode;
+}
+declare function AppLauncher({ env, theme, mobileBreakpoint, domain, children, }: AppLauncherProps): react_jsx_runtime.JSX.Element;
+
+interface AppLauncherTriggerProps {
+    asChild?: boolean;
+    children?: React.ReactNode;
+}
+declare function AppLauncherTrigger({ asChild, children, }: AppLauncherTriggerProps): react_jsx_runtime.JSX.Element;
+
+interface AppLauncherContentProps {
+    align?: "start" | "center" | "end";
+    sideOffset?: number;
+    className?: string;
+}
+declare function AppLauncherContent({ align, sideOffset, className, }: AppLauncherContentProps): react_jsx_runtime.JSX.Element;
+
+interface GlobalMenuItemUrl {
+    dev: string;
+    stage: string;
+    production: string;
+}
+interface GlobalMenuItem {
+    id: string;
+    label: string;
+    description: string;
+    url: GlobalMenuItemUrl;
+    iconUrl: string;
+    order: number;
+    type: string;
+    badge: string | null;
+    isNew: boolean;
+}
+interface GlobalMenu {
+    version: string;
+    items: GlobalMenuItem[];
+}
+
+declare function useGlobalMenu(env?: Environment): _tanstack_react_query.UseQueryResult<GlobalMenu, Error>;
+
+/** CAIP-2 chain identifier (e.g. "eip155:612044") */
+type ChainId = `eip155:${number}`;
+declare enum ConnectorId {
+    CROSSx = "crossx",
+    MetaMask = "io.metamask",
+    Binance = "com.binance.wallet"
+}
+interface ConnectorMeta {
+    name: string;
+    iconUrl: string;
+}
+declare const CONNECTOR_REGISTRY: Record<ConnectorId, ConnectorMeta>;
+interface PreferredToken {
+    chainId: ChainId;
+    address: string;
+}
+interface WalletInfoStyle extends CSSProperties {
+    "--wi-primary"?: string;
+    "--wi-secondary"?: string;
+    "--wi-surface-bg"?: string;
+    "--wi-surface-default"?: string;
+    "--wi-surface-subtle"?: string;
+    "--wi-border-default"?: string;
+    "--wi-border-subtle"?: string;
+    "--wi-texticon-primary"?: string;
+    "--wi-texticon-secondary"?: string;
+    "--wi-texticon-tertiary"?: string;
+}
+interface TokenBalance {
+    blockNumber: number;
+    name: string;
+    symbol: string;
+    chainId: number;
+    address: string;
+    quantity: {
+        decimals: number;
+        numeric: string;
+    };
+    icon_url: string;
+}
+interface TokenBalanceResponse {
+    code: number;
+    message: string;
+    data: TokenBalance[];
+}
+interface TokenStats {
+    chain_id: number;
+    address: string;
+    price: string;
+    percent_change_24h: string;
+}
+interface TokenStatsResponse {
+    code: number;
+    message: string;
+    data: TokenStats[];
+}
+
+interface WalletInfoTriggerProps {
+    asChild?: boolean;
+    className?: string;
+    children?: React.ReactNode;
+}
+declare function WalletInfoTrigger({ asChild, className, children, }: WalletInfoTriggerProps): react_jsx_runtime.JSX.Element;
+
+interface WalletInfoContentProps {
+    align?: "start" | "center" | "end";
+    sideOffset?: number;
+    className?: string;
+    children?: React.ReactNode;
+}
+declare function WalletInfoContent({ align, sideOffset, className, children, }: WalletInfoContentProps): react_jsx_runtime.JSX.Element;
+
+interface WalletInfoNavProps {
+    position?: "top" | "bottom";
+    children: React.ReactNode;
+}
+declare function WalletInfoNav({ position, children, }: WalletInfoNavProps): null;
+
+interface WalletInfoFooterProps {
+    children: React.ReactNode;
+}
+declare function WalletInfoFooter({ children }: WalletInfoFooterProps): null;
+
+interface WalletInfoProps {
+    env?: Environment;
+    theme?: Theme;
+    mobileBreakpoint?: number;
+    drawerDirection?: DrawerDirection$1;
+    modal?: boolean;
+    showBalance?: boolean;
+    showForgeToken?: boolean;
+    showGameToken?: boolean;
+    showQR?: boolean;
+    qrLogoSrc?: string;
+    walletAddress: string;
+    accountName?: string;
+    /** 헤더 좌측에 표시될 프로필 이미지 URL. 미지정 시 주소 기반 그라디언트 아바타가 자동 생성됨. */
+    profileImageUrl?: string;
+    /** Resolves connectorName & connectorIconUrl from CONNECTOR_REGISTRY */
+    connectorId?: ConnectorId;
+    connectorName?: string;
+    connectorIconUrl?: string;
+    preferredTokens?: PreferredToken[];
+    onSelectWallet?: () => void;
+    onCopyAddress?: (address: string, success: boolean) => void;
+    /** 지정 시 기본 Disconnect 버튼이 Footer에 노출됨. WalletInfo.Footer 슬롯이 우선. */
+    onDisconnect?: () => void;
+    /** 기본 Disconnect 버튼 라벨 (기본 "Disconnect"). */
+    disconnectLabel?: string;
+    /** Footer 하단 Terms 링크 URL. 지정 시에만 노출. */
+    termsUrl?: string;
+    /** Terms 링크 라벨 (기본 "Terms of Service"). */
+    termsLabel?: string;
+    /** Footer 하단 Privacy 링크 URL. 지정 시에만 노출. */
+    privacyUrl?: string;
+    /** Privacy 링크 라벨 (기본 "Privacy Policy"). */
+    privacyLabel?: string;
+    open?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    /**
+     * Portfolio 뷰 사용 여부.
+     * true면 Total Assets 섹션이 클릭 가능해지며, 클릭 시 내부 Portfolio 뷰로 전환됩니다.
+     * (showBalance=true && showTotalAssets=true 일 때만 클릭 영역이 표시됩니다.)
+     */
+    showPortfolio?: boolean;
+    /** Portfolio 뷰의 헤더 타이틀 (기본 "My Portfolio"). */
+    portfolioTitle?: string;
+    /** Total Assets 섹션 노출 여부 (기본 true). showBalance=true일 때만 실제 표기. */
+    showTotalAssets?: boolean;
+    /** Total Assets 라벨 텍스트 (기본 "Total Assets USD"). */
+    totalAssetsLabel?: string;
+    style?: WalletInfoStyle;
+    children: React.ReactNode;
+}
+declare function WalletInfoRoot({ env, theme, mobileBreakpoint, drawerDirection, modal, showBalance, showForgeToken, showGameToken, showQR, qrLogoSrc, walletAddress, accountName, profileImageUrl, connectorId, connectorName: connectorNameProp, connectorIconUrl: connectorIconUrlProp, preferredTokens, onSelectWallet, onCopyAddress, onDisconnect, disconnectLabel, termsUrl, termsLabel, privacyUrl, privacyLabel, open: propOpen, onOpenChange, showPortfolio, portfolioTitle, showTotalAssets, totalAssetsLabel, style, children, }: WalletInfoProps): react_jsx_runtime.JSX.Element;
+declare const WalletInfo: typeof WalletInfoRoot & {
+    Trigger: typeof WalletInfoTrigger;
+    Content: typeof WalletInfoContent;
+    Nav: typeof WalletInfoNav;
+    Footer: typeof WalletInfoFooter;
+};
+
+declare const USER_BALANCE_QUERY_KEY = "user-balance";
+declare function useTokenBalance(env: Environment, walletAddress: string, active?: boolean): {
+    tokens: TokenBalance[];
+    isLoading: boolean;
+    isError: boolean;
+};
+
+declare const TOKEN_STATS_QUERY_KEY = "token-stats";
+declare function useTokenStats(env: Environment, enabled?: boolean): {
+    error: Error;
+    isError: true;
+    isPending: false;
+    isLoading: false;
+    isLoadingError: false;
+    isRefetchError: true;
+    isSuccess: false;
+    isPlaceholderData: false;
+    status: "error";
+    dataUpdatedAt: number;
+    errorUpdatedAt: number;
+    failureCount: number;
+    failureReason: Error | null;
+    errorUpdateCount: number;
+    isFetched: boolean;
+    isFetchedAfterMount: boolean;
+    isFetching: boolean;
+    isInitialLoading: boolean;
+    isPaused: boolean;
+    isRefetching: boolean;
+    isStale: boolean;
+    isEnabled: boolean;
+    refetch: (options?: _tanstack_react_query.RefetchOptions) => Promise<_tanstack_react_query.QueryObserverResult<TokenStatsResponse, Error>>;
+    fetchStatus: _tanstack_react_query.FetchStatus;
+    promise: Promise<TokenStatsResponse>;
+    statsMap: Map<string, TokenStats>;
+} | {
+    error: null;
+    isError: false;
+    isPending: false;
+    isLoading: false;
+    isLoadingError: false;
+    isRefetchError: false;
+    isSuccess: true;
+    isPlaceholderData: false;
+    status: "success";
+    dataUpdatedAt: number;
+    errorUpdatedAt: number;
+    failureCount: number;
+    failureReason: Error | null;
+    errorUpdateCount: number;
+    isFetched: boolean;
+    isFetchedAfterMount: boolean;
+    isFetching: boolean;
+    isInitialLoading: boolean;
+    isPaused: boolean;
+    isRefetching: boolean;
+    isStale: boolean;
+    isEnabled: boolean;
+    refetch: (options?: _tanstack_react_query.RefetchOptions) => Promise<_tanstack_react_query.QueryObserverResult<TokenStatsResponse, Error>>;
+    fetchStatus: _tanstack_react_query.FetchStatus;
+    promise: Promise<TokenStatsResponse>;
+    statsMap: Map<string, TokenStats>;
+} | {
+    error: Error;
+    isError: true;
+    isPending: false;
+    isLoading: false;
+    isLoadingError: true;
+    isRefetchError: false;
+    isSuccess: false;
+    isPlaceholderData: false;
+    status: "error";
+    dataUpdatedAt: number;
+    errorUpdatedAt: number;
+    failureCount: number;
+    failureReason: Error | null;
+    errorUpdateCount: number;
+    isFetched: boolean;
+    isFetchedAfterMount: boolean;
+    isFetching: boolean;
+    isInitialLoading: boolean;
+    isPaused: boolean;
+    isRefetching: boolean;
+    isStale: boolean;
+    isEnabled: boolean;
+    refetch: (options?: _tanstack_react_query.RefetchOptions) => Promise<_tanstack_react_query.QueryObserverResult<TokenStatsResponse, Error>>;
+    fetchStatus: _tanstack_react_query.FetchStatus;
+    promise: Promise<TokenStatsResponse>;
+    statsMap: Map<string, TokenStats>;
+} | {
+    error: null;
+    isError: false;
+    isPending: true;
+    isLoading: true;
+    isLoadingError: false;
+    isRefetchError: false;
+    isSuccess: false;
+    isPlaceholderData: false;
+    status: "pending";
+    dataUpdatedAt: number;
+    errorUpdatedAt: number;
+    failureCount: number;
+    failureReason: Error | null;
+    errorUpdateCount: number;
+    isFetched: boolean;
+    isFetchedAfterMount: boolean;
+    isFetching: boolean;
+    isInitialLoading: boolean;
+    isPaused: boolean;
+    isRefetching: boolean;
+    isStale: boolean;
+    isEnabled: boolean;
+    refetch: (options?: _tanstack_react_query.RefetchOptions) => Promise<_tanstack_react_query.QueryObserverResult<TokenStatsResponse, Error>>;
+    fetchStatus: _tanstack_react_query.FetchStatus;
+    promise: Promise<TokenStatsResponse>;
+    statsMap: Map<string, TokenStats>;
+} | {
+    error: null;
+    isError: false;
+    isPending: true;
+    isLoadingError: false;
+    isRefetchError: false;
+    isSuccess: false;
+    isPlaceholderData: false;
+    status: "pending";
+    dataUpdatedAt: number;
+    errorUpdatedAt: number;
+    failureCount: number;
+    failureReason: Error | null;
+    errorUpdateCount: number;
+    isFetched: boolean;
+    isFetchedAfterMount: boolean;
+    isFetching: boolean;
+    isLoading: boolean;
+    isInitialLoading: boolean;
+    isPaused: boolean;
+    isRefetching: boolean;
+    isStale: boolean;
+    isEnabled: boolean;
+    refetch: (options?: _tanstack_react_query.RefetchOptions) => Promise<_tanstack_react_query.QueryObserverResult<TokenStatsResponse, Error>>;
+    fetchStatus: _tanstack_react_query.FetchStatus;
+    promise: Promise<TokenStatsResponse>;
+    statsMap: Map<string, TokenStats>;
+} | {
+    isError: false;
+    error: null;
+    isPending: false;
+    isLoading: false;
+    isLoadingError: false;
+    isRefetchError: false;
+    isSuccess: true;
+    isPlaceholderData: true;
+    status: "success";
+    dataUpdatedAt: number;
+    errorUpdatedAt: number;
+    failureCount: number;
+    failureReason: Error | null;
+    errorUpdateCount: number;
+    isFetched: boolean;
+    isFetchedAfterMount: boolean;
+    isFetching: boolean;
+    isInitialLoading: boolean;
+    isPaused: boolean;
+    isRefetching: boolean;
+    isStale: boolean;
+    isEnabled: boolean;
+    refetch: (options?: _tanstack_react_query.RefetchOptions) => Promise<_tanstack_react_query.QueryObserverResult<TokenStatsResponse, Error>>;
+    fetchStatus: _tanstack_react_query.FetchStatus;
+    promise: Promise<TokenStatsResponse>;
+    statsMap: Map<string, TokenStats>;
+};
+
+interface WalletPortfolioTriggerProps {
+    asChild?: boolean;
+    children?: React.ReactNode;
+}
+declare function WalletPortfolioTrigger({ asChild, children, }: WalletPortfolioTriggerProps): react_jsx_runtime.JSX.Element;
+
+interface WalletPortfolioContentProps {
+    className?: string;
+}
+declare function WalletPortfolioContent({ className, }: WalletPortfolioContentProps): react_jsx_runtime.JSX.Element;
+
+interface WalletPortfolioProps {
+    env?: Environment;
+    theme?: Theme;
+    walletAddress: string;
+    open?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    children: React.ReactNode;
+}
+declare function WalletPortfolioRoot({ env, theme, walletAddress, open: propOpen, onOpenChange, children, }: WalletPortfolioProps): react_jsx_runtime.JSX.Element;
+declare const WalletPortfolio: typeof WalletPortfolioRoot & {
+    Trigger: typeof WalletPortfolioTrigger;
+    Content: typeof WalletPortfolioContent;
+};
+
+interface WalletPortfolioBodyProps {
+    env?: Environment;
+    theme?: Theme;
+    walletAddress: string;
+    /** 왼쪽 상단 back 버튼 클릭 핸들러. 없으면 back 버튼 숨김. */
+    onBack?: () => void;
+    /** 헤더 노출 여부. embed 시 외부 헤더를 쓰면 false로 숨길 수 있음. */
+    showHeader?: boolean;
+    /**
+     * 컨테이너 variant.
+     * - `"embed"`(기본): 부모 영역을 채우도록 `.wp-embed` 래퍼로 감쌈
+     * - `"fullscreen"`: 고정 풀스크린 `.wp-fullscreen` 래퍼로 감쌈
+     * - `"none"`: 래퍼 div 없이 본문만 반환 (Drawer.Content 등 외부 래퍼에 클래스를 직접 줄 때)
+     */
+    variant?: "fullscreen" | "embed" | "none";
+    className?: string;
+}
+declare function WalletPortfolioBody({ env, theme, walletAddress, onBack, showHeader, variant, className, }: WalletPortfolioBodyProps): react_jsx_runtime.JSX.Element;
+
+declare function CROSSxIcon(): react_jsx_runtime.JSX.Element;
+declare function MetaMaskIcon(): react_jsx_runtime.JSX.Element;
+declare function Verse8Icon(): react_jsx_runtime.JSX.Element;
+declare function TronIcon(): react_jsx_runtime.JSX.Element;
+
+declare const WALLET_REGISTRY: {
+    cross_embedded: {
+        id: string;
+        name: string;
+        description: string;
+        icon: typeof CROSSxIcon;
+        featured: true;
+    };
+    cross_wallet: {
+        id: string;
+        name: string;
+        description: string;
+        icon: typeof CROSSxIcon;
+    };
+    cross_extension: {
+        id: string;
+        name: string;
+        description: string;
+        icon: typeof CROSSxIcon;
+        rdns: string;
+        installUrl: string;
+        visibility: "desktop-only";
+    };
+    metamask: {
+        id: string;
+        name: string;
+        description: string;
+        icon: typeof MetaMaskIcon;
+        rdns: string;
+    };
+    verse8: {
+        id: string;
+        name: string;
+        description: string;
+        icon: typeof Verse8Icon;
+        badge: string;
+    };
+    tron: {
+        id: string;
+        name: string;
+        description: string;
+        icon: typeof TronIcon;
+        badge: string;
+    };
+};
+type WalletId = keyof typeof WALLET_REGISTRY;
+
+interface WalletConnectModalStyle extends CSSProperties {
+    "--wcm-primary"?: string;
+    "--wcm-secondary"?: string;
+    "--wcm-surface-bg"?: string;
+    "--wcm-surface-default"?: string;
+    "--wcm-surface-subtle"?: string;
+    "--wcm-border-default"?: string;
+    "--wcm-border-subtle"?: string;
+    "--wcm-texticon-primary"?: string;
+    "--wcm-texticon-secondary"?: string;
+    "--wcm-texticon-tertiary"?: string;
+    "--wcm-dialog-width"?: string;
+    "--wcm-drawer-max-width"?: string;
+    "--wcm-drawer-min-width"?: string;
+}
+type WalletVisibility = "always" | "mobile-only" | "desktop-only";
+interface WalletConfig {
+    id: string;
+    name: string;
+    description: string;
+    icon: () => ReactNode;
+    rdns?: string;
+    featured?: boolean;
+    badge?: string;
+    installUrl?: string;
+    visibility?: WalletVisibility;
+}
+type WalletHandlers = Partial<Record<WalletId, () => void | Promise<void>>>;
+type DrawerDirection = "bottom" | "left" | "right" | "top";
+interface WalletConnectModalProps {
+    wallets: WalletHandlers;
+    theme?: "dark" | "light";
+    mobileBreakpoint?: number;
+    drawerDirection?: DrawerDirection;
+    dialogWidth?: string;
+    drawerMaxWidth?: string;
+    drawerMinWidth?: string;
+    style?: WalletConnectModalStyle;
+    open?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    children: ReactNode;
+}
+interface WalletConnectModalTriggerProps {
+    asChild?: boolean;
+    children?: ReactNode;
+}
+interface WalletConnectModalContentProps {
+    className?: string;
+}
+
+declare function WalletConnectModalTrigger({ asChild, children, }: WalletConnectModalTriggerProps): react_jsx_runtime.JSX.Element;
+
+declare function WalletConnectModalContent({ className, }: WalletConnectModalContentProps): react_jsx_runtime.JSX.Element;
+
+declare function WalletConnectModalRoot({ wallets, theme, mobileBreakpoint, drawerDirection, dialogWidth, drawerMaxWidth, drawerMinWidth, style, open: openProp, onOpenChange, children, }: WalletConnectModalProps): react_jsx_runtime.JSX.Element;
+declare const WalletConnectModal: typeof WalletConnectModalRoot & {
+    Trigger: typeof WalletConnectModalTrigger;
+    Content: typeof WalletConnectModalContent;
+};
+
+interface DetectedWallet {
+    rdns: string;
+    name: string;
+    icon?: string;
+}
+interface WalletDetectResult {
+    wallets: DetectedWallet[];
+    isDetected: (rdns: string) => boolean;
+    isLoading: boolean;
+}
+declare function useWalletDetect(): WalletDetectResult;
+
+export { AppLauncher, AppLauncherContent, type AppLauncherContentProps, type AppLauncherProps, AppLauncherTrigger, type AppLauncherTriggerProps, CONNECTOR_REGISTRY, type ChainId, ConnectorId, type ConnectorMeta, type DrawerDirection$1 as DrawerDirection, type Environment, type GlobalMenu, type GlobalMenuItem, type GlobalMenuItemUrl, type PreferredToken, TOKEN_STATS_QUERY_KEY, type Theme, type TokenBalance, type TokenBalanceResponse, type TokenStats, type TokenStatsResponse, USER_BALANCE_QUERY_KEY, WALLET_REGISTRY, type WalletConfig, WalletConnectModal, type WalletConnectModalContentProps, type WalletConnectModalProps, type WalletConnectModalStyle, type WalletConnectModalTriggerProps, type WalletHandlers, type WalletId, WalletInfo, type WalletInfoContentProps, type WalletInfoFooterProps, type WalletInfoNavProps, type WalletInfoProps, type WalletInfoStyle, type WalletInfoTriggerProps, WalletPortfolio, WalletPortfolioBody, type WalletPortfolioBodyProps, type WalletPortfolioContentProps, type WalletPortfolioProps, type WalletPortfolioTriggerProps, useGlobalMenu, useTokenBalance, useTokenStats, useWalletDetect };