@seaverse/payment-sdk 0.8.2 → 0.9.1

package/dist/index.d.ts

@@ -401,7 +401,7 @@ type SubscriptionPeriod = 'week' | 'month' | 'year' | 'WEEK' | 'MONTH' | 'YEAR';
 /**
  * 计费周期
  */
-type BillingPeriod = 'month' | 'year';
+type BillingPeriod$1 = 'month' | 'year';
 /**
  * 订阅参数
  */
@@ -444,7 +444,7 @@ interface CheckoutOptions extends BaseCheckoutOptions {
  */
 interface SubscribeOptions extends CheckoutOptions {
     /** 计费周期（可选，"month" 或 "year"，默认 "month"） */
-    billing_period?: BillingPeriod;
+    billing_period?: BillingPeriod$1;
     /** 购买类型：1-一次性，2-订阅（必填） */
     purchaseType: PurchaseType;
 }
@@ -476,7 +476,7 @@ interface SDKCheckoutRequest {
     /** 购买类型：1-一次性，2-订阅（必填） */
     purchase_type: PurchaseType;
     /** 计费周期（可选，仅订阅时使用，默认 'month'）- 用于区分月付和年付 */
-    billing_period?: BillingPeriod;
+    billing_period?: BillingPeriod$1;
     /** 支付完成后的重定向 URL（可选） */
     redirect_url?: string;
 }
@@ -768,7 +768,7 @@ declare class CheckoutAPI {
      */
     createSubscriptionCheckout(params: {
         productId: string;
-        billingPeriod?: BillingPeriod;
+        billingPeriod?: BillingPeriod$1;
         /** 支付完成后的重定向 URL */
         redirectUrl?: string;
     }): Promise<CheckoutResult>;
@@ -1032,10 +1032,96 @@ declare const BIZ_CODE: {
     readonly INVALID_ORDER_STATUS: 4006;
 };
 
+/**
+ * 共享类型定义
+ * Shared types for CreditPackageModal and GenericPackageModal
+ */
+
+/** 环境类型 */
+type Environment = 'development' | 'production';
+/** 环境配置接口 */
+interface EnvironmentConfig {
+    /** SDK 脚本 URL */
+    scriptUrl: string;
+    /** 客户端 ID */
+    clientId: string;
+    /** 订单 API 地址 */
+    orderApiUrl: string;
+    /** 钱包 API 地址 */
+    walletApiUrl: string;
+    /** CSS 文件 URL */
+    cssUrl: string;
+}
+/**
+ * 语言代码（ISO 639-1 + BCP 47 区域子标签）
+ *
+ * 格式说明：
+ * - 基础码：ISO 639-1 两字母语言码（en, zh, ja, ko...）
+ * - 区域变体：BCP 47 格式 language-REGION（zh-CN, zh-TW, pt-BR...）
+ * - zh-CN / zh-TW 需要区分简繁体，不能只用 zh
+ */
+type LocaleCode = 'en' | 'zh' | 'zh-TW' | 'ja' | 'ko' | 'es' | 'fr' | 'de' | 'pt' | 'ru' | 'ar' | 'hi' | 'id';
+/** 国家/地区代码（ISO 3166-1 alpha-2） */
+type CountryCode = 'US' | 'CN' | 'TW' | 'JP' | 'KR' | 'ES' | 'FR' | 'DE' | 'PT' | 'BR' | 'RU' | 'SA' | 'IN' | 'ID';
+/**
+ * SDK 配置选项 - 简化版（支持环境变量）
+ * 用户只需提供 environment、countryCode、accountToken 三个核心参数
+ * SDK 会自动根据 environment 选择对应的配置
+ */
+interface PaymentSDKConfig {
+    /** 环境变量（development/production） - SDK 自动选择对应配置 */
+    environment: Environment;
+    /** 国家/地区代码 */
+    countryCode?: CountryCode;
+    /** 账户 Token（用于用户认证） */
+    accountToken: string;
+    /** 业务类型：1-一次性，2-订阅（可选，默认为 1） */
+    businessType?: 1 | 2;
+    /** 脚本加载超时（毫秒，默认 10000ms） */
+    scriptTimeout?: number;
+    /** 支付方式类型过滤（可选，默认 'dropin'） */
+    paymentMethodType?: string;
+    /** 自定义脚本 URL（覆盖环境配置） */
+    scriptUrl?: string;
+    /** 自定义客户端 ID（覆盖环境配置） */
+    clientId?: string;
+    /** 自定义订单 API 地址（覆盖环境配置） */
+    orderApiUrl?: string;
+    /** 自定义 CSS URL（覆盖环境配置） */
+    cssUrl?: string;
+}
+/**
+ * Base package modal options - common configuration for all package modals
+ */
+interface BasePackageModalOptions<TPackage extends BasePackage> {
+    /** SDK configuration (required for automatic SDK initialization) */
+    sdkConfig: PaymentSDKConfig;
+    /** Language (default 'en') */
+    language: LocaleCode;
+    /**
+     * Payment success callback - notifies when payment is completed
+     * @param orderId Order ID
+     * @param transactionId Transaction ID
+     * @param pkg Purchased package
+     */
+    onPaymentSuccess?: (orderId: string, transactionId: string, pkg: TPackage) => void;
+    /**
+     * Payment failed callback
+     * @param error Error information
+     * @param pkg Package that failed to purchase
+     */
+    onPaymentFailed?: (error: Error, pkg: TPackage) => void;
+    /** Modal close callback */
+    onClose?: () => void;
+    paymentMethod?: PaymentMethod;
+    accountToken?: string;
+}
+
 /**
  * SeaartPayment Types
  * SeaartPaymentComponent SDK 相关类型定义
  */
+
 declare global {
     interface Window {
         SeaartPaymentComponent: SeaartPaymentComponentSDK;
@@ -1187,7 +1273,7 @@ interface SeaartPaymentSDKConfig {
     /** 客户端 ID */
     clientId: string;
     /** 语言 */
-    language?: string;
+    language?: LocaleCode;
     /** 脚本加载超时（毫秒） */
     scriptTimeout?: number;
     /** CSS 样式表 URL（可选） */
@@ -1346,6 +1432,18 @@ interface GenericPackage extends BasePackage {
     /** Package type for categorization */
     package_type?: 'iceBreaker' | 'emergency' | 'firstCharge' | 'custom';
 }
+interface CreditPackageItem extends BasePackage {
+    /** 总积分（与 credits 相同，API 返回字段） */
+    total_credits: string;
+    /** 基础积分 */
+    base_credits: string;
+    /** 奖励积分 */
+    bonus_credits: string;
+    /** 每日购买限制 */
+    remain_daily_limit: number;
+    /** 是否为首次购买积分包 */
+    is_first_purchase_pkg: boolean;
+}
 
 /**
  * LinkPaymentComponent
@@ -1553,19 +1651,21 @@ declare class PaymentModal {
 
 /**
  * RetentionModal - 支付挽留弹框
- * 当用户尝试取消支付时弹出，提供优惠信息以挽留用户
- * 参考图片中的深色卡片设计风格
+ * 当用户尝试取消支付时弹出，提供订单信息以挽留用户
+ *
+ * 设计风格：深色卡片 + 清晰信息层次 + 渐变 CTA 按钮
  */
+
 interface RetentionModalOptions {
     /** 语言，默认 'en' */
-    language?: 'en' | 'zh-CN';
+    language?: LocaleCode;
     /** 商品名称 */
     productName: string;
     /** 购买数量（积分数等） */
     purchaseAmount: number;
     /** 活动赠送（例如：990） */
     bonusAmount?: number;
-    /** 优惠价格（例如："US$4.99"） */
+    /** 优惠价格（例如："$4.99"） */
     discountPrice: string;
     /** 确认继续支付回调 */
     onContinue: () => void;
@@ -1600,41 +1700,25 @@ declare class RetentionModal {
      */
     private createModal;
     /**
-     * 添加 CSS 动画
+     * 注入 CSS 动画和 hover 效果
      */
     private addStyles;
     /**
-     * 添加事件监听
+     * 事件监听
      */
     private attachEventListeners;
-    /**
-     * 处理 ESC 键
-     */
     private handleEscKey;
     /**
-     * 启动倒计时
+     * 倒计时
      */
     private startCountdown;
-    /**
-     * 停止倒计时
-     */
     private stopCountdown;
-    /**
-     * 更新倒计时显示
-     */
     private updateCountdownDisplay;
     /**
      * 清理资源
      */
     private cleanup;
-    /**
-     * HTML 转义工具函数
-     * 防止 XSS 攻击
-     */
     private escapeHtml;
-    /**
-     * 检查弹框是否打开
-     */
     isOpen(): boolean;
 }
 
@@ -1770,102 +1854,6 @@ declare class SeaartPaymentSDK {
     destroy(): void;
 }
 
-/**
- * 积分套餐数据
- */
-
-interface CreditPackage extends BasePackage {
-    day_limit: number;
-    is_popular?: boolean;
-}
-declare const CREDIT_PACKAGES: CreditPackage[];
-/**
- * 创作力量类型和对应的积分消耗
- */
-interface CreativePowerType {
-    icon: string;
-    name: string;
-    name_cn: string;
-    credits_range: string;
-    description: string;
-    description_cn: string;
-}
-declare const CREATIVE_POWER_TYPES: CreativePowerType[];
-
-/**
- * 共享类型定义
- * Shared types for CreditPackageModal and GenericPackageModal
- */
-
-/** 环境类型 */
-type Environment = 'development' | 'production';
-/** 环境配置接口 */
-interface EnvironmentConfig {
-    /** SDK 脚本 URL */
-    scriptUrl: string;
-    /** 客户端 ID */
-    clientId: string;
-    /** 订单 API 地址 */
-    orderApiUrl: string;
-    /** 钱包 API 地址 */
-    walletApiUrl: string;
-    /** CSS 文件 URL */
-    cssUrl: string;
-}
-/**
- * SDK 配置选项 - 简化版（支持环境变量）
- * 用户只需提供 environment、countryCode、accountToken 三个核心参数
- * SDK 会自动根据 environment 选择对应的配置
- */
-interface PaymentSDKConfig {
-    /** 环境变量（development/production） - SDK 自动选择对应配置 */
-    environment: Environment;
-    /** 国家/地区代码 */
-    countryCode: string;
-    /** 账户 Token（用于用户认证） */
-    accountToken?: string;
-    /** 业务类型：1-一次性，2-订阅（可选，默认为 1） */
-    businessType?: 1 | 2;
-    /** 脚本加载超时（毫秒，默认 10000ms） */
-    scriptTimeout?: number;
-    /** 支付方式类型过滤（可选，默认 'dropin'） */
-    paymentMethodType?: string;
-    /** 自定义脚本 URL（覆盖环境配置） */
-    scriptUrl?: string;
-    /** 自定义客户端 ID（覆盖环境配置） */
-    clientId?: string;
-    /** 自定义订单 API 地址（覆盖环境配置） */
-    orderApiUrl?: string;
-    /** 自定义 CSS URL（覆盖环境配置） */
-    cssUrl?: string;
-}
-/**
- * Base package modal options - common configuration for all package modals
- */
-interface BasePackageModalOptions<TPackage extends BasePackage> {
-    /** SDK configuration (required for automatic SDK initialization) */
-    sdkConfig: PaymentSDKConfig;
-    /** Language (default 'en') */
-    language?: 'en' | 'zh-CN';
-    /**
-     * Payment success callback - notifies when payment is completed
-     * @param orderId Order ID
-     * @param transactionId Transaction ID
-     * @param pkg Purchased package
-     */
-    onPaymentSuccess?: (orderId: string, transactionId: string, pkg: TPackage) => void;
-    /**
-     * Payment failed callback
-     * @param error Error information
-     * @param pkg Package that failed to purchase
-     */
-    onPaymentFailed?: (error: Error, pkg: TPackage) => void;
-    /** Modal close callback */
-    onClose?: () => void;
-    paymentMethod?: PaymentMethod;
-    accountToken?: string;
-}
-
 /**
  * BasePackageModal - Abstract base class for package modals
  * Provides shared logic for SDK initialization, payment flow, and event handling
@@ -1878,7 +1866,7 @@ interface BasePackageModalOptions<TPackage extends BasePackage> {
 declare abstract class BasePackageModal<TPackage extends BasePackage, TOptions extends BasePackageModalOptions<TPackage>> {
     protected modal: PaymentModal;
     protected options: TOptions;
-    protected language: 'en' | 'zh-CN';
+    protected language: LocaleCode;
     protected resizeHandler: (() => void) | null;
     protected isInitializingSDK: boolean;
     protected sdkInitialized: boolean;
@@ -1970,31 +1958,67 @@ declare abstract class BasePackageModal<TPackage extends BasePackage, TOptions e
  * 展示不同的积分套餐供用户选择
  */
 
-interface CreditPackageModalOptions extends BasePackageModalOptions<CreditPackage> {
+interface CreditPackageModalOptions extends BasePackageModalOptions<CreditPackageItem> {
     /** Modal title */
     title?: string;
     /** Modal title (Chinese) */
     title_cn?: string;
-    /** Subtitle */
-    subtitle?: string;
-    /** Subtitle (Chinese) */
-    subtitle_cn?: string;
 }
-declare class CreditPackageModal extends BasePackageModal<CreditPackage, CreditPackageModalOptions> {
+declare class CreditPackageModal extends BasePackageModal<CreditPackageItem, CreditPackageModalOptions> {
     private readonly SPACING;
     private readonly COLORS;
+    private dynamicPackages;
+    private isFetchingPackages;
+    /**
+     * Override open to fetch packages before rendering
+     */
+    open(): Promise<void>;
+    /**
+     * 覆盖 BasePackageModal 的 initializeSDK 方法
+     * CreditPackageModal 使用 PaymentCheckoutModal，不需要 BasePackageModal 的 SDK 初始化
+     * PaymentCheckoutModal 会自行处理 SDK 初始化
+     */
+    protected initializeSDK(): Promise<void>;
+    /**
+     * 覆盖 BasePackageModal 的 waitForSDKInitialization 方法
+     * CreditPackageModal 使用 PaymentCheckoutModal，不需要等待 BasePackageModal 的 SDK 初始化
+     */
+    protected waitForSDKInitialization(_timeout?: number, _maxRetries?: number): Promise<boolean>;
     /**
      * Create and configure the PaymentModal instance
      */
     protected createModal(): PaymentModal;
     /**
-     * Get packages to display
+     * Get packages to display (dynamic or fallback to static)
+     */
+    protected getPackages(): CreditPackageItem[];
+    /**
+     * Fetch available packages from API
+     */
+    private fetchDynamicPackages;
+    /**
+     * Parse purchase limit string to day_limit number
+     * Example: "Daily limit: 1" => 1
+     */
+    private parsePurchaseLimit;
+    /**
+     * 覆盖 BasePackageModal 的 handlePaymentFlow 方法
+     * 使用 PaymentCheckoutModal 替代旧的 DropinPaymentModal
+     * 支付成功后刷新积分包列表，而不是立即关闭弹框
+     */
+    protected handlePaymentFlow(pkg: CreditPackageItem, button: HTMLButtonElement, originalHTML: string): Promise<void>;
+    /**
+     * 将 CreditPackageItem 转换为 Product
+     */
+    private convertToProduct;
+    /**
+     * 构建 AutoCreateOrderConfig
      */
-    protected getPackages(): CreditPackage[];
+    private buildAutoCreateOrderConfig;
     /**
      * Get package display name for payment modal title
      */
-    protected getPackageDisplayName(pkg: CreditPackage): string;
+    protected getPackageDisplayName(pkg: CreditPackageItem): string;
     /**
      * Get loading button HTML with spinner
      */
@@ -2012,11 +2036,7 @@ declare class CreditPackageModal extends BasePackageModal<CreditPackage, CreditP
      */
     private getResponsiveStyles;
     /**
-     * Render compute credits cards
-     */
-    private renderComputeCreditsCards;
-    /**
-     * Render package card
+     * Render package card using CreditPackCard component
      */
     private renderPackageCard;
 }
@@ -2033,6 +2053,17 @@ interface GenericPackageModalOptions extends BasePackageModalOptions<GenericPack
 }
 declare class GenericPackageModal extends BasePackageModal<GenericPackage, GenericPackageModalOptions> {
     constructor(options: GenericPackageModalOptions);
+    /**
+     * 覆盖 BasePackageModal 的 initializeSDK 方法
+     * GenericPackageModal 使用 PaymentCheckoutModal，不需要 BasePackageModal 的 SDK 初始化
+     * PaymentCheckoutModal 会自行处理 SDK 初始化
+     */
+    protected initializeSDK(): Promise<void>;
+    /**
+     * 覆盖 BasePackageModal 的 waitForSDKInitialization 方法
+     * GenericPackageModal 使用 PaymentCheckoutModal，不需要等待 BasePackageModal 的 SDK 初始化
+     */
+    protected waitForSDKInitialization(_timeout?: number, _maxRetries?: number): Promise<boolean>;
     /**
      * Create and configure the PaymentModal instance
      */
@@ -2057,6 +2088,19 @@ declare class GenericPackageModal extends BasePackageModal<GenericPackage, Gener
      * Render modal content
      */
     protected renderContent(): void;
+    /**
+     * 覆盖 BasePackageModal 的 handlePaymentFlow 方法
+     * 使用 PaymentCheckoutModal 替代 DropinPaymentModal
+     */
+    protected handlePaymentFlow(pkg: GenericPackage, button: HTMLButtonElement, originalHTML: string): Promise<void>;
+    /**
+     * 将 GenericPackage 转换为 Product
+     */
+    private convertToProduct;
+    /**
+     * 构建 AutoCreateOrderConfig
+     */
+    private buildAutoCreateOrderConfig;
     /**
      * Render package card
      */
@@ -2064,42 +2108,341 @@ declare class GenericPackageModal extends BasePackageModal<GenericPackage, Gener
 }
 
 /**
- * 共享配置文件
- * Shared configuration for CreditPackageModal and GenericPackageModal
+ * 商品类型
  */
-
+declare enum PRODUCT_TYPE$1 {
+    SUBSCRIPTION = "subscription",
+    CREDITPACK = "credit_package"
+}
 /**
- * 环境配置映射表
- * SDK 根据 environment 参数自动选择对应的配置
+ * 订单状态
  */
-declare const ENVIRONMENT_CONFIGS: Record<Environment, EnvironmentConfig>;
+type OrderStatus = 'pending' | 'paid' | 'failed' | 'expired' | 'refunded';
 /**
- * 响应式断点配置
- * Responsive breakpoints for grid layout
+ * 商品数据
  */
-declare const RESPONSIVE_BREAKPOINTS: {
-    readonly mobile: 768;
-    readonly tablet: 1200;
-    readonly laptop: 1400;
-    readonly desktop: number;
-};
+interface ProductData {
+    /** 商品ID */
+    product_id: string;
+    /** 商品名称 */
+    product_name: string;
+    /** 商品类型 */
+    product_type: PRODUCT_TYPE$1;
+    /** 商品价格 */
+    price: number;
+    /** 商品货币 */
+    currency: string;
+    /** 订阅周期 */
+    subscription_period?: 'month' | 'year';
+    /** 积分 */
+    total_credits?: number;
+}
 /**
- * 网格列数配置
- * Grid columns for different screen sizes
+ * SDK 配置
  */
-declare const GRID_COLUMNS: {
-    readonly mobile: 1;
-    readonly tablet: 2;
-    readonly laptop: 2;
-    readonly desktop: 4;
-};
+interface SdkConfig {
+    /** 应用 ID */
+    app_id: string;
+    /** API 域名 */
+    api_host: string;
+    /** 环境 */
+    environment: string;
+}
 /**
- * SDK 初始化配置
+ * 订阅计费周期
  */
-declare const SDK_CONFIG: {
-    /** 默认脚本加载超时 (毫秒) */
-    readonly DEFAULT_SCRIPT_TIMEOUT: 10000;
-    /** 默认 SDK 初始化超时 (毫秒) */
+type BillingPeriod = 'month' | 'year';
+/**
+ * 积分池类型
+ */
+type CreditPoolType = 'daily' | 'event' | 'monthly' | 'permanent';
+
+/**
+ * Order API
+ * 订单管理 - 查询和轮询订单状态
+ */
+
+/**
+ * 订单状态响应
+ */
+interface OrderStatusResponse {
+    status: OrderStatus;
+    product: ProductData;
+}
+
+/**
+ * 查询订单状态
+ * @param transactionId SDK checkout 返回的 transaction_id
+ * @param apiHost Payment API 地址
+ * @param authToken 认证 Token
+ * @returns 订单状态
+ */
+declare function checkOrderStatus(transactionId: string, apiHost: string, authToken?: string): Promise<OrderStatusResponse>;
+/**
+ * 轮询订单状态直到支付完成或超时
+ * @param transactionId SDK checkout 返回的 transaction_id
+ * @param apiHost Payment API 地址
+ * @param authToken 认证 Token
+ * @param options 轮询配置
+ * @returns 最终订单状态
+ */
+declare function pollOrderStatus(transactionId: string, apiHost: string, authToken: string | undefined, options?: {
+    /** 轮询间隔（毫秒），默认 2000ms */
+    interval?: number;
+    /** 最大轮询次数，默认 30 次（总计 60 秒） */
+    maxAttempts?: number;
+    /** 每次轮询后的回调 */
+    onPoll?: (status: OrderStatus, attempt: number) => void;
+}): Promise<OrderStatusResponse>;
+
+/**
+ * @filename types.ts
+ * @description PaymentCheckoutModal 的 TypeScript 类型定义
+ */
+
+/**
+ * 产品类型
+ */
+declare const PRODUCT_TYPE: {
+    readonly SUBSCRIPTION: "subscription";
+    readonly CREDITPACK: "credit_package";
+    readonly CHANGE_SUBSCRIPTION: "change_subscription";
+};
+/**
+ * 产品类型的类型定义
+ */
+type ProductType = (typeof PRODUCT_TYPE)[keyof typeof PRODUCT_TYPE];
+/**
+ * 商品信息
+ */
+interface Product {
+    id: string;
+    name: string;
+    price: number;
+    currency: string;
+    type: ProductType;
+}
+/**
+ * 自动创建订单配置
+ */
+interface AutoCreateOrderConfig {
+    /** 产品ID */
+    productId: string;
+    /** 购买类型：1-一次性购买，2-订阅 */
+    purchaseType: 1 | 2;
+    /** API 主机地址 */
+    apiHost: string;
+    /** 账户 Token */
+    accountToken: string;
+    /** 客户端 ID */
+    clientId: string;
+    /** 国家代码 */
+    language_code: LocaleCode;
+}
+/**
+ * PaymentCheckoutModal 配置选项
+ */
+interface PaymentCheckoutModalOptions {
+    /** 当前选择的商品 */
+    product?: Product | null;
+    /** 自动创建订单配置（优先级最高） */
+    autoCreateOrder?: AutoCreateOrderConfig;
+    /** OrderPayment 实例（提前创建时使用） */
+    payment?: OrderPayment;
+    /** 订单 transaction_id（延迟创建支付实例时使用） */
+    transactionId?: string;
+    /** 支付方式列表（当不使用 autoCreateOrder 时需要提供） */
+    paymentMethods?: PaymentMethod[];
+    /** 是否正在加载支付方式 */
+    loadingMethods?: boolean;
+    /** 当前业务类型：1-一次性购买，2-订阅 */
+    currentBusinessType?: 1 | 2 | null;
+    /** 支付成功回调 */
+    onPaymentSuccess?: (payload: OrderStatusResponse) => void;
+    /** 支付失败回调 */
+    onPaymentFailed?: (error: {
+        message: string;
+    }) => void;
+    /** 选择支付方式回调 */
+    onPaymentMethodSelect?: (method: PaymentMethod) => void;
+    /** Link 支付开始回调（用于显示验证弹窗） */
+    onLinkPaymentStart?: (paymentMethodName: string) => void;
+    /** 加载回调 */
+    onLoading?: (loading: boolean) => void;
+    /** 弹框标题 */
+    modalTitle?: string;
+    /** 弹框选项 */
+    modalOptions?: Omit<PaymentModalOptions, 'title'>;
+    /** 是否显示返回按钮 */
+    showBackButton?: boolean;
+    /** 返回按钮文本 */
+    backButtonText?: string;
+    /** 用户账号名称 */
+    accountName?: string;
+    /** 语言设置 */
+    language?: LocaleCode;
+}
+
+/**
+ * PaymentCheckoutModal - 通用支付收银台弹框
+ * 支持 Link、Dropin 和 BindCard 三种支付方式
+ * 纯 JavaScript 实现，不依赖任何框架
+ */
+
+declare class PaymentCheckoutModal {
+    private options;
+    private modal;
+    private orderPayment;
+    private containerElement;
+    private retentionModal;
+    private bindCardPayment;
+    private verificationModal;
+    private isCleanedUp;
+    private orderService;
+    private loadingManager;
+    private stateManager;
+    private strategyFactory;
+    private uiRenderer;
+    constructor(options: PaymentCheckoutModalOptions);
+    /**
+     * 获取当前语言的文本
+     */
+    private getText;
+    /**
+     * 打开弹框
+     */
+    open(): Promise<void>;
+    /**
+     * 显示加载指示器（使用 LoadingManager）
+     */
+    private showLoading;
+    /**
+     * 隐藏加载指示器（使用 LoadingManager）
+     */
+    private hideLoading;
+    /**
+     * 自动创建订单（使用 OrderService）
+     */
+    private handleAutoCreateOrder;
+    /**
+     * 检查 SDK 是否已初始化
+     */
+    private checkSDKInitialized;
+    /**
+     * 开始轮询订单状态（使用 OrderService）
+     */
+    private startOrderPolling;
+    /**
+     * 停止轮询订单状态（使用 OrderService）
+     */
+    private stopOrderPolling;
+    /**
+     * 检查订单状态（使用 OrderService）
+     * 点击"我已完成支付"按钮后，开始轮询订单状态（最多 10 次）
+     */
+    private checkOrderStatus;
+    /**
+     * 显示支付失败弹窗
+     */
+    private showPaymentFailedModal;
+    /**
+     * 显示支付验证弹窗（仅用于 Link 支付）
+     */
+    private showVerificationModal;
+    /**
+     * 处理支付成功
+     */
+    private handlePaymentSuccess;
+    /**
+     * 从 transactionId 创建 OrderPayment
+     */
+    private createOrderPaymentFromTransactionId;
+    /**
+     * 渲染支付方式列表
+     */
+    private renderPaymentMethods;
+    /**
+     * 自动选中默认支付方式
+     * 策略：
+     * - 如果有 Dropin（payment_type === 2），自动选中并渲染表单
+     * - 如果只有 Link（payment_type === 1），不自动选中，让用户手动选择
+     */
+    private autoSelectDefaultPaymentMethod;
+    /**
+     * 处理支付方式选择
+     */
+    private handleSelectPaymentMethod;
+    /**
+     * 执行支付策略
+     */
+    private executePaymentStrategy;
+    /**
+     * 渲染卡片列表
+     */
+    private renderCardList;
+    /**
+     * 渲染错误状态
+     */
+    private renderError;
+    /**
+     * 显示挽留弹框
+     */
+    private showRetentionModal;
+    /**
+     * 显示购买成功弹框
+     */
+    private showPurchaseSuccessModal;
+    /**
+     * 关闭弹框
+     */
+    close(): void;
+    /**
+     * 清理资源
+     */
+    private cleanup;
+    /**
+     * 检查弹框是否打开
+     */
+    isOpen(): boolean;
+}
+
+/**
+ * 共享配置文件
+ * Shared configuration for CreditPackageModal and GenericPackageModal
+ */
+
+/**
+ * 环境配置映射表
+ * SDK 根据 environment 参数自动选择对应的配置
+ */
+declare const ENVIRONMENT_CONFIGS: Record<Environment, EnvironmentConfig>;
+/**
+ * 响应式断点配置
+ * Responsive breakpoints for grid layout
+ */
+declare const RESPONSIVE_BREAKPOINTS: {
+    readonly mobile: 768;
+    readonly tablet: 1200;
+    readonly laptop: 1400;
+    readonly desktop: number;
+};
+/**
+ * 网格列数配置
+ * Grid columns for different screen sizes
+ */
+declare const GRID_COLUMNS: {
+    readonly mobile: 1;
+    readonly tablet: 2;
+    readonly laptop: 2;
+    readonly desktop: 4;
+};
+/**
+ * SDK 初始化配置
+ */
+declare const SDK_CONFIG: {
+    /** 默认脚本加载超时 (毫秒) */
+    readonly DEFAULT_SCRIPT_TIMEOUT: 10000;
+    /** 默认 SDK 初始化超时 (毫秒) */
     readonly DEFAULT_INIT_TIMEOUT: 30000;
     /** 默认最大重试次数 */
     readonly DEFAULT_MAX_RETRIES: 1;
@@ -2156,6 +2499,7 @@ declare function showInfoMessage(message: string, duration?: number): void;
  * - 精美的动画效果（淡入淡出、缩放）
  * - 包含成功图标、套餐详情、积分数、支付金额
  */
+
 interface PurchaseSuccessData {
     /** 套餐名称 */
     packName: string;
@@ -2174,7 +2518,7 @@ interface PurchaseSuccessModalOptions {
     /** 购买成功数据 */
     data: PurchaseSuccessData;
     /** 语言，默认 'en' */
-    language?: 'en' | 'zh-CN';
+    language?: LocaleCode;
     /** 关闭回调 */
     onClose?: () => void;
 }
@@ -2188,6 +2532,7 @@ declare class PurchaseSuccessModal {
     private isExiting;
     private scrollY;
     private boundHandleEscKey;
+    private boundPreventTouchMove;
     constructor(options: PurchaseSuccessModalOptions);
     /**
      * 打开弹窗
@@ -2217,6 +2562,202 @@ declare class PurchaseSuccessModal {
      * 处理 ESC 键
      */
     private handleEscKey;
+    /**
+     * 阻止 body 的触摸滑动
+     */
+    private preventTouchMove;
+    /**
+     * 清理资源
+     */
+    private cleanup;
+    /**
+     * HTML 转义工具函数
+     * 防止 XSS 攻击
+     */
+    private escapeHtml;
+    /**
+     * 检查弹窗是否打开
+     */
+    isOpen(): boolean;
+}
+
+/**
+ * PaymentVerificationModal - 支付验证状态弹窗
+ * 纯 JavaScript 实现，不依赖 React
+ *
+ * 样式完全参考 next-meta 项目的设计
+ * 按钮逻辑参考 @seaart/payment-component
+ */
+
+interface PaymentVerificationOptions {
+    /** 语言，默认 'en' */
+    language?: LocaleCode;
+    /** 交易ID */
+    transactionId: string;
+    /** 产品名称（可选） */
+    productName?: string;
+    /** 支付方式名称 */
+    paymentMethodName?: string;
+    /** 成功回调 */
+    onSuccess?: (orderInfo: any) => void;
+    /** 失败回调 */
+    onFailed?: (error: {
+        message: string;
+    }) => void;
+    /** 超时回调 */
+    onTimeout?: () => void;
+    /** Cancel 按钮回调 */
+    onCancel?: () => void;
+    /** Complete Payment 按钮回调 */
+    onCompletePayment?: () => void;
+}
+/**
+ * 支付验证弹窗类
+ */
+declare class PaymentVerificationModal {
+    private overlay;
+    private modal;
+    private options;
+    private isExiting;
+    private scrollY;
+    private boundHandleEscKey;
+    private boundPreventTouchMove;
+    constructor(options: PaymentVerificationOptions);
+    /**
+     * 打开弹窗
+     */
+    open(): void;
+    /**
+     * 关闭弹窗
+     */
+    close(): void;
+    /**
+     * 创建弹窗元素
+     */
+    private createModal;
+    /**
+     * 生成弹窗 HTML
+     */
+    private getModalHTML;
+    /**
+     * 获取语言文本
+     */
+    private getTexts;
+    /**
+     * 添加 CSS 动画
+     */
+    private addStyles;
+    /**
+     * 添加事件监听
+     */
+    private attachEventListeners;
+    /**
+     * 处理 Cancel 按钮
+     */
+    private handleCancel;
+    /**
+     * 处理 Complete Payment 按钮
+     */
+    private handleCompletePayment;
+    /**
+     * 切换到 Processing（加载中）状态
+     * 显示加载动画和 "Checking payment status..." 文本
+     * 按钮变为 "Processing..." 且不可点击
+     */
+    showProcessing(): void;
+    /**
+     * 恢复到初始状态（隐藏加载动画，恢复按钮文本）
+     */
+    hideProcessing(): void;
+    /**
+     * 处理 ESC 键
+     */
+    private handleEscKey;
+    /**
+     * 阻止 body 的触摸滑动
+     */
+    private preventTouchMove;
+    /**
+     * 清理资源
+     */
+    private cleanup;
+    /**
+     * 检查弹窗是否打开
+     */
+    isOpen(): boolean;
+}
+
+/**
+ * PaymentFailedModal - 支付失败弹窗
+ * 纯 JavaScript 实现，不依赖 React
+ *
+ * 样式与 PaymentVerificationModal 保持一致
+ * 深蓝渐变主题背景，按钮样式统一
+ */
+
+interface PaymentFailedModalOptions {
+    /** 语言，默认 'en' */
+    language?: LocaleCode;
+    /** 错误标题 */
+    title?: string;
+    /** 错误消息 */
+    message: string;
+    /** 错误详情（可选，支持展开/折叠） */
+    details?: string;
+    /** 关闭回调 */
+    onClose?: () => void;
+    /** 重试回调（可选） */
+    onRetry?: () => void;
+}
+/**
+ * 支付失败弹窗类
+ */
+declare class PaymentFailedModal {
+    private overlay;
+    private modal;
+    private options;
+    private isExiting;
+    private scrollY;
+    private boundHandleEscKey;
+    private boundPreventTouchMove;
+    private detailsExpanded;
+    constructor(options: PaymentFailedModalOptions);
+    /**
+     * 打开弹窗
+     */
+    open(): void;
+    /**
+     * 关闭弹窗
+     */
+    close(): void;
+    /**
+     * 创建弹窗元素
+     */
+    private createModal;
+    /**
+     * 生成弹窗 HTML
+     */
+    private getModalHTML;
+    /**
+     * 添加 CSS 动画
+     */
+    private addStyles;
+    /**
+     * 添加事件监听
+     */
+    private attachEventListeners;
+    /**
+     * 切换详情展开/折叠
+     */
+    private toggleDetails;
+    /**
+     * 处理 ESC 键
+     */
+    private handleEscKey;
+    /**
+     * 阻止 body 的触摸滑动
+     */
+    private preventTouchMove;
     /**
      * 清理资源
      */
@@ -2340,6 +2881,7 @@ declare class StylesheetLoader {
  * Subscription API
  * 订阅管理 - 查询、变更、重启订阅
  */
+
 /**
  * 当前订阅状态
  */
@@ -2347,7 +2889,7 @@ interface CurrentSubscription {
     subscription_id: string;
     product_id: string;
     tier: string;
-    billing_period: 'month' | 'year';
+    billing_period: BillingPeriod;
     status: string;
     cancel_at_period_end: boolean;
     current_period_end: number;
@@ -2358,7 +2900,7 @@ interface CurrentSubscription {
 interface ActiveSubscription {
     subscription_id: string;
     tier: number;
-    billing_period: 'month' | 'year';
+    billing_period: BillingPeriod;
     price: string;
     currency: string;
     current_period_start: number;
@@ -2367,14 +2909,6 @@ interface ActiveSubscription {
     cancel_at_period_end: boolean;
     can_cancel: boolean;
 }
-/**
- * 统一响应格式
- */
-interface UnifiedResponse<T = any> {
-    code: number;
-    msg: string;
-    data: T | null;
-}
 /**
  * 创建订单响应
  */
@@ -2392,17 +2926,6 @@ interface CreateOrderResponse {
     /** SDK 配置 */
     sdk_config: SdkConfig;
 }
-/**
- * SDK 配置
- */
-interface SdkConfig {
-    /** 应用 ID */
-    app_id: string;
-    /** API 域名 */
-    api_host: string;
-    /** 环境 */
-    environment: string;
-}
 /**
  * 获取当前订阅状态（用于升降级判断）
  */
@@ -2414,11 +2937,13 @@ declare function getCurrentSubscription(apiHost: string, authToken?: string, sig
   * @param params 创建订单参数
   * @param product_id 产品ID
   * @param purchase_type 购买类型（1=一次性, 2=订阅）
+  * @param currency 币种（可选，如 USD, CNY）
   * @returns 创建订单响应
   */
 declare function createOrder(apiHost: string, authToken: string, params: {
     product_id: string;
     purchase_type: number | string;
+    currency?: string;
 }): Promise<CreateOrderResponse | null | undefined>;
 /**
  * 获取活跃订阅详情
@@ -2448,10 +2973,6 @@ declare function restartSubscription(apiHost: string, authToken: string | undefi
     message: string;
     next_billing_date: number;
 }>;
-/**
- * 积分池类型
- */
-type CreditPoolType = 'daily' | 'event' | 'monthly' | 'permanent';
 /**
  * 积分池详情
  */
@@ -2483,43 +3004,95 @@ interface CreditDetailResponse {
 declare function getCreditDetail(apiHost: string, authToken?: string): Promise<CreditDetailResponse | null>;
 
 /**
- * Order API
- * 订单管理 - 查询和轮询订单状态
+ * @filename packages/index.ts
+ * @description 积分包（Credit Package）API 接口
+ * 新版接口：GET /api/v1/payment/sdk/packages/available
  */
+
 /**
- * 订单状态
+ * 可用积分包列表响应
  */
-type OrderStatus = 'pending' | 'paid' | 'failed' | 'expired' | 'refunded';
+interface AvailablePackagesResponse {
+    code: number;
+    msg: string;
+    data: {
+        packages: CreditPackageItem[];
+    } | null;
+}
 /**
- * 订单状态响应
+ * 获取可用积分包列表
+ * @param apiHost API 主机地址
+ * @param token 认证 Token
+ * @returns 可用的积分包列表
  */
-interface OrderStatusResponse {
-    status: OrderStatus;
-}
+declare function fetchAvailablePackages(apiHost: string, token: string): Promise<CreditPackageItem[]>;
+
 /**
- * 查询订单状态
- * @param transactionId SDK checkout 返回的 transaction_id
- * @param apiHost Payment API 地址
- * @param authToken 认证 Token
- * @returns 订单状态
+ * @filename CreditPackCard.ts
+ * @description 积分包卡片组件（纯 JavaScript 实现）
+ * 完整迁移自 Restore UI Design 项目的 PricingCard 组件
+ *
+ * 设计特点：
+ * - 深色主题，半透明玻璃态背景
+ * - 支持高亮状态（推荐套餐）带绿色渐变
+ * - 光晕效果和呼吸动画
+ * - SVG 徽章装饰（首充双倍）
+ * - 悬停微交互和平滑过渡
  */
-declare function checkOrderStatus(transactionId: string, apiHost: string, authToken?: string): Promise<OrderStatus>;
+
+interface CreditPackCardOptions {
+    /** 积分包 ID */
+    id: string;
+    /** 积分包名称 */
+    name: string;
+    /** 价格（美元） */
+    price: number;
+    /** 基础积分 */
+    baseCredits: number;
+    /** 奖励积分 */
+    bonusCredits: number;
+    /** 总积分 */
+    totalCredits: number;
+    /** 购买限制（可选） */
+    purchaseLimit?: string;
+    /** 是否推荐 */
+    recommended?: boolean;
+    /** 是否首充双倍 */
+    isFirstPurchase?: boolean;
+    /** 语言 */
+    language?: LocaleCode;
+    /** 点击购买回调 */
+    onBuy: (packId: string) => Promise<void>;
+}
 /**
- * 轮询订单状态直到支付完成或超时
- * @param transactionId SDK checkout 返回的 transaction_id
- * @param apiHost Payment API 地址
- * @param authToken 认证 Token
- * @param options 轮询配置
- * @returns 最终订单状态
+ * 积分包卡片组件
  */
-declare function pollOrderStatus(transactionId: string, apiHost: string, authToken: string | undefined, options?: {
-    /** 轮询间隔（毫秒），默认 2000ms */
-    interval?: number;
-    /** 最大轮询次数，默认 30 次（总计 60 秒） */
-    maxAttempts?: number;
-    /** 每次轮询后的回调 */
-    onPoll?: (status: OrderStatus, attempt: number) => void;
-}): Promise<OrderStatus>;
+declare class CreditPackCard {
+    private options;
+    private card;
+    private loading;
+    constructor(options: CreditPackCardOptions);
+    /**
+     * 渲染卡片到容器
+     */
+    render(container: HTMLElement): void;
+    /**
+     * 创建卡片元素 - 完全还原 Restore UI Design
+     */
+    private createCard;
+    /**
+     * 创建双倍奖励徽章 SVG
+     */
+    private createDoubleBonusBadge;
+    /**
+     * 处理购买 - 更新为使用 span 而不是 button
+     */
+    private handleBuy;
+    /**
+     * 销毁卡片
+     */
+    destroy(): void;
+}
 
 /**
  * @seaverse/payment-sdk
@@ -2568,7 +3141,7 @@ declare function pollOrderStatus(transactionId: string, apiHost: string, authTok
 /**
  * SDK version
  */
-declare const VERSION = "0.8.0";
+declare const VERSION = "0.9.1";
 
-export { API_ENDPOINTS, BIZ_CODE, BindCardPaymentComponent, COMPONENT_LOAD_TIMEOUT, CREATIVE_POWER_TYPES, CREDIT_PACKAGES, CheckoutAPI, CreditPackageModal, DEFAULT_CHECKOUT_CONFIG, DropinPaymentComponent, DropinPaymentModal, ENVIRONMENT_CONFIGS, ENV_CONFIG, ErrorHandler, GRID_COLUMNS, GenericPackageModal, HTTP_STATUS, LinkPaymentComponent, OrderPayment, PAYMENT_ELEMENT_NAME, PaymentAPIError, PaymentCheckoutClient, PaymentClient, PaymentError, PaymentModal, PaymentStorage, PurchaseSuccessModal, RESPONSIVE_BREAKPOINTS, RetentionModal, SDK_CONFIG, ScriptLoader, SeaArtPayLoader, SeaartPaymentSDK, StylesheetLoader, VERSION, centsToDollars, changeSubscription, checkOrderStatus, createCheckoutPaymentError, createOrder, delay, dollarsToCents, formatPrice, generateOrderReference, getActiveSubscription, getCreditDetail, getCurrentSubscription, getCurrentUrl, getGlobalLoader, getSDKLocale, hideLoadingIndicator, isBrowser, isCheckoutPaymentError, pollOrderStatus, resetGlobalLoader, restartSubscription, safeJsonParse, showErrorMessage, showInfoMessage, showLoadingIndicator, showSuccessMessage, withTimeout };
-export type { ActiveSubscription, ApiErrorResponse, ApiResponse, ApiSuccessResponse, BaseCheckoutOptions, BillingPeriod, BindCard, BindCardCallbacks, BindCardPaymentOptions, CheckoutAPIConfig, CheckoutAPIResponse, CheckoutClientConfig, CheckoutClientStatus, CheckoutOptions, CheckoutPaymentError, CheckoutPaymentErrorCode, CheckoutResult, ComponentLoadStatus, CreateOrderResponse, CreativePowerType, CreditAccount, CreditAccountStatus, CreditDetailResponse$1 as CreditDetailResponse, CreditDetailSuccessResponse, CreditPackage, CreditPackageModalOptions, CreditPoolDetail, CreditPoolType$1 as CreditPoolType, CreditTransaction, CurrentSubscription, DropinCallbacks, DropinPaymentModalOptions, DropinPaymentOptions, Environment, EnvironmentConfig, GenericPackage, GenericPackageModalOptions, LinkPaymentOptions, ListTransactionsRequest, LoaderConfig, OrderInfo, OrderStatus, OrderStatusResponse, PaymentClientOptions, PaymentEnvironment, PaymentMethod, PaymentMethodsParams, PaymentModalOptions, PaymentReadyEventDetail, PaymentResult, PaymentSDKConfig, PaymentSuccessEventDetail, PaymentUnsuccessEventDetail, PaymentUnsuccessResult, PurchaseSuccessData, PurchaseSuccessModalOptions, PurchaseType, RetentionModalOptions, SDKCheckoutRequest, SDKCheckoutResponse, SDKConfig, SDKLoadStatus, ScriptLoaderOptions, SeaArtPaymentElement, SeaartBindCardPayment, SeaartDropinPayment, SeaartLinkPayment, SeaartPaymentComponentSDK, SeaartPaymentInstance, SeaartPaymentSDKConfig, ShowPaymentOptions, SubscribeOptions, SubscriptionParams, SubscriptionPeriod, TransactionListResponse, TransactionStatus, TransactionStorageData, TransactionType, UnifiedResponse };
+export { API_ENDPOINTS, BIZ_CODE, BindCardPaymentComponent, COMPONENT_LOAD_TIMEOUT, CheckoutAPI, CreditPackCard, CreditPackageModal, DEFAULT_CHECKOUT_CONFIG, DropinPaymentComponent, DropinPaymentModal, ENVIRONMENT_CONFIGS, ENV_CONFIG, ErrorHandler, GRID_COLUMNS, GenericPackageModal, HTTP_STATUS, LinkPaymentComponent, OrderPayment, PAYMENT_ELEMENT_NAME, PaymentAPIError, PaymentCheckoutClient, PaymentCheckoutModal, PaymentClient, PaymentError, PaymentFailedModal, PaymentModal, PaymentStorage, PaymentVerificationModal, PurchaseSuccessModal, RESPONSIVE_BREAKPOINTS, RetentionModal, SDK_CONFIG, ScriptLoader, SeaArtPayLoader, SeaartPaymentSDK, StylesheetLoader, VERSION, centsToDollars, changeSubscription, checkOrderStatus, createCheckoutPaymentError, createOrder, delay, dollarsToCents, fetchAvailablePackages, formatPrice, generateOrderReference, getActiveSubscription, getCreditDetail, getCurrentSubscription, getCurrentUrl, getGlobalLoader, getSDKLocale, hideLoadingIndicator, isBrowser, isCheckoutPaymentError, pollOrderStatus, resetGlobalLoader, restartSubscription, safeJsonParse, showErrorMessage, showInfoMessage, showLoadingIndicator, showSuccessMessage, withTimeout };
+export type { ActiveSubscription, ApiErrorResponse, ApiResponse, ApiSuccessResponse, AutoCreateOrderConfig, AvailablePackagesResponse, BaseCheckoutOptions, BillingPeriod$1 as BillingPeriod, BindCard, BindCardCallbacks, BindCardPaymentOptions, CheckoutAPIConfig, CheckoutAPIResponse, CheckoutClientConfig, CheckoutClientStatus, CheckoutOptions, CheckoutPaymentError, CheckoutPaymentErrorCode, CheckoutResult, ComponentLoadStatus, CreateOrderResponse, CreditAccount, CreditAccountStatus, CreditDetailResponse$1 as CreditDetailResponse, CreditDetailSuccessResponse, CreditPackCardOptions, CreditPackageModalOptions, CreditPoolDetail, CreditPoolType$1 as CreditPoolType, CreditTransaction, CurrentSubscription, DropinCallbacks, DropinPaymentModalOptions, DropinPaymentOptions, Environment, EnvironmentConfig, GenericPackage, GenericPackageModalOptions, LinkPaymentOptions, ListTransactionsRequest, LoaderConfig, LocaleCode, OrderInfo, OrderStatus, OrderStatusResponse, PaymentCheckoutModalOptions, PaymentClientOptions, PaymentEnvironment, PaymentFailedModalOptions, PaymentMethod, PaymentMethodsParams, PaymentModalOptions, PaymentReadyEventDetail, PaymentResult, PaymentSDKConfig, PaymentSuccessEventDetail, PaymentUnsuccessEventDetail, PaymentUnsuccessResult, PaymentVerificationOptions, Product, PurchaseSuccessData, PurchaseSuccessModalOptions, PurchaseType, RetentionModalOptions, SDKCheckoutRequest, SDKCheckoutResponse, SDKConfig, SDKLoadStatus, ScriptLoaderOptions, SeaArtPaymentElement, SeaartBindCardPayment, SeaartDropinPayment, SeaartLinkPayment, SeaartPaymentComponentSDK, SeaartPaymentInstance, SeaartPaymentSDKConfig, ShowPaymentOptions, SubscribeOptions, SubscriptionParams, SubscriptionPeriod, TransactionListResponse, TransactionStatus, TransactionStorageData, TransactionType };