@paykka/card-checkout-ui 0.15.2 → 0.16.0

package/dist/es/i18n/locales/zh-TW.js

@@ -58,7 +58,7 @@ const zhTW = {
   "common.pay": "支付",
   "common.payProcessing": "處理中...",
   "common.paySuccess": "支付成功",
-  "common.payTimeout": "支付超時",
+  "common.payTimeout": "您的網路連線不穩定，付款可能已經成功。",
   "common.pay3DSIncomplete": "未完成3DS認證",
   "common.queryTimeout": "查詢超時，請刷新頁面或者重新支付查詢結果",
   "common.generateQrCode": "生成二維碼",

package/dist/es/i18n/util.js

@@ -3,6 +3,9 @@ import "../utils/card-brand/brands.js";
 import { getBrowserInfo } from "../utils/system-info/get-browser-info.js";
 import { LocaleKey, language2LocaleKeyMap, getLocales } from "./locales/index.js";
 import enGB from "./locales/en-GB.js";
+import "../core.js";
+import "../core/context.js";
+import "../out/fraud-detection.js";
 const normalizedLocale = (locale) => {
   return locale.trim().replaceAll("_", "-").toLowerCase();
 };

package/dist/es/index.js

@@ -52,11 +52,11 @@ import { getFingerprint } from "./utils/system-info/finger-print.js";
 import "./utils/system-info/get-browser-info.js";
 import { CardBrandCode, EPayKKaEnv, PaymentAction, PaymentStatus, defaultInputStyleConfig, inputStyleAttrs } from "./types/index.js";
 import { redirectToPayment } from "./utils/redirect.js";
+import { setApiUrl, setCDNUrl, setCustomLocale, setCustomReqHeaders, setFraudDetectionEnv } from "./config.js";
 import "./core.js";
 import { I18n } from "./i18n/I18n.js";
 import { LocaleKey } from "./i18n/locales/index.js";
 import "./out/fraud-detection.js";
-import { setApiUrl, setCDNUrl, setCustomLocale, setCustomReqHeaders, setFraudDetectionEnv } from "./config.js";
 import { ECollMode } from "./types/fraud-detection.js";
 import { MessageAction } from "./types/message.js";
 import { ApplePayEventType, FraudDetectionEventType, GooglePayEventType, LoggerEventType, PaymentEventType, SecurityIframeEventType, ThreeDSEventType, WechatPayEventType } from "./types/event.js";

package/dist/es/utils/bem.js

@@ -1,6 +1,9 @@
 import { isString, isNil, isNumber, isArray } from "./is.js";
 import "./card-brand/brands.js";
 import "./system-info/get-browser-info.js";
+import "../core.js";
+import "../core/context.js";
+import "../out/fraud-detection.js";
 function generateBEM(name, mods = []) {
   if (isNil(mods)) {
     return "";

package/dist/es/utils/card-brand/brands.js

@@ -2,6 +2,8 @@ import { IconAmex } from "../../components/internal/icons/IconAmex.js";
 import "../../core.js";
 import "../system-info/get-browser-info.js";
 import { CardBrandCode } from "../../types/index.js";
+import "../../core/context.js";
+import "../../out/fraud-detection.js";
 import { IconDinnersClub } from "../../components/internal/icons/IconDinnersClub.js";
 import { IconDiscover } from "../../components/internal/icons/IconDiscover.js";
 import { IconJcb } from "../../components/internal/icons/IconJcb.js";

package/dist/es/utils/index.js

@@ -1,6 +1,9 @@
 import { isUndefined } from "./is.js";
 import "./card-brand/brands.js";
 import "./system-info/get-browser-info.js";
+import "../core.js";
+import "../core/context.js";
+import "../out/fraud-detection.js";
 const getIf = (value, condition) => {
   return condition ? value : void 0;
 };

package/dist/es/utils/payment.js

@@ -1,3 +1,7 @@
+import { isTimeoutError } from "../api/http.js";
+import "./card-brand/brands.js";
+import "./system-info/get-browser-info.js";
+import "../core.js";
 const processPaymentStatus = async (res, config) => {
   var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k;
   const { status, orderStatus } = res;
@@ -33,7 +37,7 @@ const processPaymentStatus = async (res, config) => {
           break;
         }
         default: {
-          await ((_h = config.onDefault) == null ? void 0 : _h.call(config));
+          await ((_h = config.onProcessing) == null ? void 0 : _h.call(config));
           break;
         }
       }
@@ -76,7 +80,78 @@ const formatPaymentResult = (res) => {
     rawResponse: res == null ? void 0 : res.rawResponse
   };
 };
+const CheckpointSchedule = [
+  [10 * 1e3, 5 * 1e3],
+  [15 * 1e3, 5 * 1e3],
+  [20 * 1e3, 5 * 1e3]
+];
+const payWithCheckpoints = async (pay, query) => {
+  const abortController = new AbortController();
+  let pendingCount = 1 + CheckpointSchedule.length;
+  let mainTimedOut = false;
+  let lastTimeoutError = null;
+  let settled = false;
+  const timers = [];
+  return new Promise((resolve, reject) => {
+    const done = (data) => {
+      if (settled)
+        return;
+      settled = true;
+      timers.forEach(clearTimeout);
+      abortController.abort();
+      resolve(data);
+    };
+    const fail = (err) => {
+      if (settled)
+        return;
+      settled = true;
+      timers.forEach(clearTimeout);
+      abortController.abort();
+      reject(err);
+    };
+    const tryFailFromTimeout = () => {
+      if (pendingCount === 0 && !settled && mainTimedOut) {
+        fail(lastTimeoutError);
+      }
+    };
+    pay(abortController.signal).then((res) => {
+      done(res);
+    }).catch((err) => {
+      if (isTimeoutError(err)) {
+        mainTimedOut = true;
+        lastTimeoutError = err;
+        pendingCount--;
+        tryFailFromTimeout();
+      } else {
+        fail(err);
+      }
+    });
+    for (let i = 0; i < CheckpointSchedule.length; i++) {
+      const [delay, timeout] = CheckpointSchedule[i];
+      const timer = setTimeout(() => {
+        if (settled) {
+          return;
+        }
+        query(timeout, abortController.signal).then((res) => {
+          done(res);
+        }).catch((err) => {
+          if ((err == null ? void 0 : err.name) === "AbortError") {
+            pendingCount--;
+            tryFailFromTimeout();
+          } else if (isTimeoutError(err)) {
+            pendingCount--;
+            tryFailFromTimeout();
+          } else {
+            fail(err);
+          }
+        });
+      }, delay);
+      timers.push(timer);
+    }
+  });
+};
 export {
   formatPaymentResult,
+  payWithCheckpoints,
   processPaymentStatus
 };

package/dist/types/api/http.d.ts

@@ -1,12 +1,17 @@
 export interface RequestOptions {
+    /** 请求超时时间 */
     timeout?: number;
+    /** 请求语言 */
     locale?: string;
+    /** 请求头 */
     headers?: Recordable;
+    /** 请求信号 */
+    signal?: AbortSignal;
 }
 export declare enum EHttpCode {
     INTERNAL_SERVER_ERROR = "500"
 }
-export declare const request: <T = any, P = any>(method: 'get' | 'post', url: string, params?: P, { timeout, headers, locale }?: RequestOptions) => Promise<T>;
+export declare const request: <T = any, P = any>(method: 'get' | 'post', url: string, params?: P, { timeout, headers, locale, signal }?: RequestOptions) => Promise<T>;
 export declare const http: {
     get: <T = any, P = any>(url: string, params?: P, options?: RequestOptions) => Promise<T>;
     post: <T_1 = any, P_1 = any>(url: string, params?: P_1 | undefined, options?: RequestOptions) => Promise<T_1>;

package/dist/types/api/modules/apple-pay/index.d.ts

@@ -1,5 +1,2 @@
 import { type RequestOptions } from '../../http';
-import type { CheckoutPaymentParams, CheckoutQueryParams } from '../type';
 export declare const getMerchantSession: (options?: RequestOptions) => Promise<any>;
-export declare const applePay: (params: CheckoutPaymentParams, extraParams?: Recordable, options?: RequestOptions) => Promise<import("../../..").BasePaymentInfo>;
-export declare const getApplePayInfo: (params: CheckoutQueryParams, extraParams?: Recordable, options?: RequestOptions) => Promise<import("../../..").BasePaymentInfo>;

package/dist/types/api/modules/common/index.d.ts

@@ -0,0 +1,39 @@
+import { type RequestOptions } from '../../http';
+import type { CheckoutPaymentParams, CheckoutQueryParams } from '../type';
+/** 支付配置 */
+interface PaymentConfig {
+    /** 支付参数 */
+    params: CheckoutPaymentParams;
+    /** 额外参数 */
+    extraParams?: Recordable;
+    options?: {
+        /** 请求配置 */
+        request?: RequestOptions;
+        /** 查询配置，默认开启查询轮询 */
+        query?: {
+            /** 是否开启检查点查询轮询 */
+            enable?: boolean;
+            /** 查询参数 */
+            params: CheckoutQueryParams;
+            /** 额外参数 */
+            extraParams?: Recordable;
+        };
+    };
+}
+/**
+ * 通用支付请求
+ * @param params 支付参数
+ * @param extraParams 额外参数
+ * @param options 请求配置
+ * @returns 支付结果
+ */
+export declare const commonPayment: (config: PaymentConfig) => Promise<import("../../..").BasePaymentInfo>;
+/**
+ * 通用支付查询
+ * @param params 查询参数`
+ * @param extraParams 额外参数
+ * @param options 请求配置
+ * @returns 支付结果
+ */
+export declare const commonPaymentQuery: (params: CheckoutQueryParams, extraParams?: Recordable, options?: RequestOptions) => Promise<import("../../..").BasePaymentInfo>;
+export {};

package/dist/types/api/modules/index.d.ts

@@ -1,9 +1,6 @@
-export * from './card';
 export * from './checkout';
 export * from './apple-pay';
-export * from './google-pay';
-export * from './sepa';
-export * from './wallet';
+export * from './common';
 export * from './map';
 export * from './type';
 export * from './get-browser-params';

package/dist/types/hooks/useBaseWallet.d.ts

@@ -6,7 +6,19 @@ import { type FieldStatusConfig } from '../api';
 import type { PaymentButtonStatus } from '../components/PaymentButton';
 import type { PaymentCommonProps, PaymentMethodContext } from '../types/payment';
 export type BaseWalletProps = WalletCustomProps & WalletRedirectProps & WalletQRCodeModalProps & CoreProps & PaymentCommonProps;
-export type BaseWalletOptions = {
+export interface BaseWalletOnProcessingResult {
+    /**
+     * 是否需要继续轮询查询
+     * @defaultValue true
+     */
+    continueSearch?: boolean;
+    /**
+     * 是否已经处理过支付动作
+     * @defaultValue false
+     */
+    actionHandled?: boolean;
+}
+export interface BaseWalletOptions {
     /**
      * 轮询超时时间
      * @defaultValue 20 * 1000
@@ -21,9 +33,9 @@ export type BaseWalletOptions = {
     getFormData: () => Recordable;
     /**
      * 处理支付中状态
-     * 返回 false 时，结束轮询
+     * 可通过返回值控制是否继续轮询，以及是否已处理当前支付动作
      */
-    onProcessing?: (paymentInfo: BasePaymentInfo) => MaybePromise<void | boolean>;
+    onProcessing?: (paymentInfo: BasePaymentInfo) => MaybePromise<void | BaseWalletOnProcessingResult>;
     /** 获取支付请求额外的参数，通常为某种支付方式所特有 */
     getExtraPaymentParams?: () => MaybePromise<DeepPartial<CheckoutPaymentParams>>;
     /**
@@ -31,7 +43,7 @@ export type BaseWalletOptions = {
      * 支付完成后，需要 processAfterPayment 方法处理后续逻辑
      **/
     executePayment?: (params: CheckoutPaymentParams, extraParams?: Recordable) => void;
-};
+}
 /**
  * 基础钱包通用逻辑
  * @param paymentMethod - 支付方式

package/dist/types/utils/payment.d.ts

@@ -1,8 +1,8 @@
 /**
  * 支付流程处理
  */
-import type { CheckoutRes, PayRes } from '../api';
-import type { PaymentInfo } from '../types';
+import { type CheckoutRes, type OrderStatus, type PayRes, type SessionStatus } from '../api';
+import type { BasePaymentInfo, PaymentInfo } from '../types';
 export interface PaymentCallbackConfig {
     /** 订单处理中，定时查询订单 */
     onProcessing?: () => void | Promise<void>;
@@ -35,3 +35,14 @@ export declare const processPaymentStatus: (res: PayRes, config: PaymentCallback
  * @param res
  */
 export declare const formatPaymentResult: (res?: PayRes | CheckoutRes) => PaymentInfo;
+/**
+ * 判断支付结果是否为终态，如果为终态则无需继续查询（注意：这里说的终态并不代表支付已经结束，而是指不需要继续查询）
+ * @param status 收银台状态
+ * @param orderStatus 订单状态
+ * @returns 是否支付完成
+ * @returns
+ */
+export declare const isPaymentDone: (status: SessionStatus | undefined, orderStatus: OrderStatus | undefined) => boolean;
+/** 查询轮询时间间隔配置，对应[支付开始后的触发时间, 超时时间]，单位: 毫秒 */
+export declare const CheckpointSchedule: number[][];
+export declare const payWithCheckpoints: (pay: (signal: AbortSignal) => Promise<BasePaymentInfo>, query: (timeout: number, signal: AbortSignal) => Promise<BasePaymentInfo>) => Promise<BasePaymentInfo>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@paykka/card-checkout-ui",
-  "version": "0.15.2",
+  "version": "0.16.0",
   "type": "module",
   "main": "dist/paykka-card-checkout-ui.umd.js",
   "module": "dist/es/index.js",

package/dist/es/api/modules/card/index.js

@@ -1,16 +0,0 @@
-import { apiPrefix } from "../../../config.js";
-import { http } from "../../http.js";
-import { buildPaymentParams, buildQueryParams } from "../../utils/index.js";
-import { payResMap } from "../map.js";
-const cardPay = async (params, extraParams, options) => {
-  const paymentParams = buildPaymentParams(params, extraParams);
-  return http.post(`${apiPrefix}/payments`, paymentParams, options).then(payResMap);
-};
-const getCardPayInfo = async (params, extraParams, options) => {
-  const queryParams = buildQueryParams(params, extraParams);
-  return http.post(`${apiPrefix}/payments/query`, queryParams, options).then(payResMap);
-};
-export {
-  cardPay,
-  getCardPayInfo
-};

package/dist/es/api/modules/google-pay/index.js

@@ -1,16 +0,0 @@
-import { apiPrefix } from "../../../config.js";
-import { http } from "../../http.js";
-import { buildPaymentParams, buildQueryParams } from "../../utils/index.js";
-import { payResMap } from "../map.js";
-const googlePay = async (params, extraParams, options) => {
-  const paymentParams = buildPaymentParams(params, extraParams);
-  return http.post(`${apiPrefix}/payments`, paymentParams, options).then(payResMap);
-};
-const getGooglePayInfo = async (params, extraParams, options) => {
-  const queryParams = buildQueryParams(params, extraParams);
-  return http.post(`${apiPrefix}/payments/query`, queryParams, options).then(payResMap);
-};
-export {
-  getGooglePayInfo,
-  googlePay
-};

package/dist/es/api/modules/sepa/index.js

@@ -1,16 +0,0 @@
-import { apiPrefix } from "../../../config.js";
-import { http } from "../../http.js";
-import { buildPaymentParams, buildQueryParams } from "../../utils/index.js";
-import { payResMap } from "../map.js";
-const sepaPay = async (params, extraParams, options) => {
-  const paymentParams = buildPaymentParams(params, extraParams);
-  return http.post(`${apiPrefix}/payments`, paymentParams, options).then(payResMap);
-};
-const getSepaPayInfo = async (params, extraParams, options) => {
-  const queryParams = buildQueryParams(params, extraParams);
-  return http.post(`${apiPrefix}/payments/query`, queryParams, options).then(payResMap);
-};
-export {
-  getSepaPayInfo,
-  sepaPay
-};

package/dist/es/api/modules/wallet/index.js

@@ -1,16 +0,0 @@
-import { apiPrefix } from "../../../config.js";
-import { http } from "../../http.js";
-import { buildPaymentParams, buildQueryParams } from "../../utils/index.js";
-import { payResMap } from "../map.js";
-const walletPay = async (params, extraParams, options) => {
-  const paymentParams = buildPaymentParams(params, extraParams);
-  return http.post(`${apiPrefix}/payments`, paymentParams, options).then(payResMap);
-};
-const getWalletPayInfo = async (params, extraParams, options) => {
-  const queryParams = buildQueryParams(params, extraParams);
-  return http.post(`${apiPrefix}/payments/query`, queryParams, options).then(payResMap);
-};
-export {
-  getWalletPayInfo,
-  walletPay
-};

package/dist/types/api/modules/card/index.d.ts

@@ -1,4 +0,0 @@
-import { type RequestOptions } from '../../http';
-import type { CheckoutPaymentParams, CheckoutQueryParams } from '../type';
-export declare const cardPay: (params: CheckoutPaymentParams, extraParams?: Recordable, options?: RequestOptions) => Promise<import("../../..").BasePaymentInfo>;
-export declare const getCardPayInfo: (params: CheckoutQueryParams, extraParams?: Recordable, options?: RequestOptions) => Promise<import("../../..").BasePaymentInfo>;

package/dist/types/api/modules/google-pay/index.d.ts

@@ -1,4 +0,0 @@
-import { type RequestOptions } from '../../http';
-import type { CheckoutPaymentParams, CheckoutQueryParams } from '../type';
-export declare const googlePay: (params: CheckoutPaymentParams, extraParams?: Recordable, options?: RequestOptions) => Promise<import("../../..").BasePaymentInfo>;
-export declare const getGooglePayInfo: (params: CheckoutQueryParams, extraParams?: Recordable, options?: RequestOptions) => Promise<import("../../..").BasePaymentInfo>;

package/dist/types/api/modules/sepa/index.d.ts

@@ -1,4 +0,0 @@
-import { type RequestOptions } from '../../http';
-import type { CheckoutPaymentParams, CheckoutQueryParams } from '../type';
-export declare const sepaPay: (params: CheckoutPaymentParams, extraParams?: Recordable, options?: RequestOptions) => Promise<import("../../..").BasePaymentInfo>;
-export declare const getSepaPayInfo: (params: CheckoutQueryParams, extraParams?: Recordable, options?: RequestOptions) => Promise<import("../../..").BasePaymentInfo>;

package/dist/types/api/modules/wallet/index.d.ts

@@ -1,18 +0,0 @@
-import { type RequestOptions } from '../../http';
-import type { CheckoutPaymentParams, CheckoutQueryParams } from '../type';
-/**
- * 钱包通用支付请求
- * @param params 支付参数
- * @param extraParams 额外参数
- * @param options 请求配置
- * @returns 支付结果
- */
-export declare const walletPay: (params: CheckoutPaymentParams, extraParams?: Recordable, options?: RequestOptions) => Promise<import("../../..").BasePaymentInfo>;
-/**
- * 钱包通用支付查询
- * @param params 查询参数
- * @param extraParams 额外参数
- * @param options 请求配置
- * @returns 支付结果
- */
-export declare const getWalletPayInfo: (params: CheckoutQueryParams, extraParams?: Recordable, options?: RequestOptions) => Promise<import("../../..").BasePaymentInfo>;