@paykka/card-checkout-ui 0.7.0 → 0.9.2

package/dist/types/i18n/util.d.ts

@@ -1,4 +1,14 @@
 import type { CustomLocales, Translation } from './locales';
+/**
+ * 获取最终在收银台展示的语言
+ * 如果 locale 不符合，则取浏览器语言，若仍然不符合则用 en-GB
+ */
+export declare const getRealLocale: (locale: string) => string;
+/**
+ * 如果 local 不在语言列表中，则要看看是否是 en 或 zh 开头
+ * 如果都不是，则返回 undefined，这里不做英文兜底，由上层判断
+ */
+export declare const getLocalKey: (locale: string) => string | undefined;
 export declare function loadTranslation(locale: string, customLocales?: CustomLocales): Promise<{
     locale: string;
     translation: Translation;

package/dist/types/index.d.ts

@@ -2,4 +2,4 @@ export * from './components';
 export { type ComponentInst, create, querySession, Session, PayKKaCheckout, PayKKaError } from './core';
 export { I18n, LocaleKey } from './i18n';
 export { setApiUrl, setCDNUrl, setFraudDetectionEnv, setCustomReqHeaders, setCustomLocale, setCheckoutConfig } from './config';
-export { getFingerprint } from './utils';
+export { getFingerprint, redirectToPayment } from './utils';

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

@@ -1,7 +1,9 @@
 import type { HTMLAttributes } from 'preact/compat';
 import type { LocaleKeyType } from '../i18n';
-import type { PayKKaError, Session } from '../core';
+import type { PayKKaCheckout, PayKKaError, Session } from '../core';
 import type { FraudDetectionEnv } from './fraud-detection';
+import type { FormValidateError } from '../components/internal/Form';
+import type { PaymentMethod } from '../constant';
 export * from './fraud-detection';
 export * from './message';
 export type CustomAttributes<T extends EventTarget, K extends keyof HTMLAttributes<T> = 'style' | 'className'> = Pick<HTMLAttributes<T>, K>;
@@ -23,16 +25,40 @@ export interface PayKKaInitConfiguration {
     /** 收银台创建时报错触发 */
     onInitError?: (error: PayKKaError) => void;
     /**
-     * 内部参数
+     * 全局回调，可以统一处理支付状态
+     * 创建组件时传同名回调可覆盖
+     */
+    /** 提交表单时触发 */
+    onSubmit?: (formValidateError?: Recordable<FormValidateError[]>) => void;
+    /** 支付成功后触发 */
+    onSuccess?: (data: PaymentSuccessData) => void;
+    /** 支付失败时触发 */
+    onError?: (error: PayKKaError) => void;
+    /** 支付超时时触发 */
+    onTimeout?: () => void;
+    /** 收银台已过期时触发 */
+    onExpired?: () => void;
+    /**
+     * @internal
+     * 环境配置，优先级大于 env 参数
      */
-    /** 环境配置，优先级大于 env 参数 */
     _envConfig?: PayKKaEnvConfig;
+    /**
+     * @internal
+     * 根据请求类型和请求方式额外传递的参数回调
+     */
+    _getExtraParams?: (type: 'info' | 'query' | 'payment', paymentMethod: PaymentMethod) => Recordable;
 }
-export interface CoreProps {
-    session?: Session;
+/** 收银台创建组件时自动传入的内部属性 */
+export type CoreProps = {
+    session: Session;
+    /** 收银台实例 */
+    core: PayKKaCheckout;
     /** 定义 3DS 所需配置 */
     threeDSFrame?: ThreeDSFrameConfig;
-}
+    /** 组件是否通过 DropIn 创建 */
+    isDropIn?: boolean;
+};
 export interface ThreeDSFrameConfig {
     /** 3DS 页面宽度 */
     modalWidth?: number | string;
@@ -62,7 +88,8 @@ export declare enum CardBrandCode {
     JCB = "JCB",
     AMEX = "AMEX",
     DISCOVER = "DISCOVER",
-    DINERS_CLUB = "DINERS_CLUB"
+    DINERS_CLUB = "DINERS_CLUB",
+    CHINA_UNION_PAY = "CHINA_UNION_PAY"
 }
 export type CardBrand = `${CardBrandCode}`;
 export interface ElementStylesConfig {

package/dist/types/types/message.d.ts

@@ -113,6 +113,7 @@ export interface ValidWithValueMessage {
 export interface PaymentMessage {
     formData: any;
     locale: string;
+    extraParams?: Recordable;
 }
 export interface AfterPaymentMessage {
     response: PayRes;

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

@@ -0,0 +1 @@
+export declare const removeElementFromArray: (array: any[], element: any) => void;

package/dist/types/utils/card-brand/brands.d.ts

@@ -1,14 +1,15 @@
-import { IconAmex, IconDinnersClub, IconDiscover, IconJcb, IconMasterCard, IconVisa } from '../../components/internal/icons';
+import { IconAmex, IconDinnersClub, IconDiscover, IconJcb, IconMasterCard, IconUnionPay, IconVisa } from '../../components/internal/icons';
 import { CardBrandCode } from '../../types';
 export declare const cardBrandCodes: CardBrandCode[];
 export interface CardBrandConfig {
     name: string;
     code: CardBrandCode;
-    pattern: RegExp;
+    pattern?: RegExp;
+    validator?: (cardNumber: string) => boolean;
     lengths: number[];
     order: number;
 }
 export declare const cardBrands: CardBrandConfig[];
-export declare const getCardBrandIconMap: (code: CardBrandCode) => typeof IconVisa | typeof IconMasterCard | typeof IconJcb | typeof IconAmex | typeof IconDiscover | typeof IconDinnersClub;
+export declare const getCardBrandIconMap: (code: CardBrandCode) => typeof IconVisa | typeof IconMasterCard | typeof IconJcb | typeof IconAmex | typeof IconDiscover | typeof IconDinnersClub | typeof IconUnionPay;
 export type CardBrands = (typeof cardBrands)[number]['code'];
 export declare const cardBrandsLengthList: number[];

package/dist/types/utils/card-brand/index.d.ts

@@ -3,27 +3,30 @@ export { cardBrands, cardBrandsLengthList, cardBrandCodes };
 export declare function getSupportedCardBrands(supportedCardBrands?: string[]): CardBrandConfig[];
 export declare function findCardBrand(number: string, brands?: CardBrandConfig[]): CardBrandConfig | undefined;
 export declare function findCardBrandInfo(number: string, brands?: CardBrandConfig[]): {
-    icon: typeof import("../../components/internal/icons").IconVisa | typeof import("../../components/internal/icons").IconMasterCard | typeof import("../../components/internal/icons").IconJcb | typeof import("../../components/internal/icons").IconAmex | typeof import("../../components/internal/icons").IconDiscover | typeof import("../../components/internal/icons").IconDinnersClub;
+    icon: typeof import("../../components/internal/icons").IconVisa | typeof import("../../components/internal/icons").IconMasterCard | typeof import("../../components/internal/icons").IconJcb | typeof import("../../components/internal/icons").IconAmex | typeof import("../../components/internal/icons").IconDiscover | typeof import("../../components/internal/icons").IconDinnersClub | typeof import("../../components/internal/icons").IconUnionPay;
     name: string;
     code: import("../../types").CardBrandCode;
-    pattern: RegExp;
+    pattern?: RegExp | undefined;
+    validator?: ((cardNumber: string) => boolean) | undefined;
     lengths: number[];
     order: number;
 } | undefined;
 export declare function getCardBrandInfo(brand: CardBrandConfig): {
-    icon: typeof import("../../components/internal/icons").IconVisa | typeof import("../../components/internal/icons").IconMasterCard | typeof import("../../components/internal/icons").IconJcb | typeof import("../../components/internal/icons").IconAmex | typeof import("../../components/internal/icons").IconDiscover | typeof import("../../components/internal/icons").IconDinnersClub;
+    icon: typeof import("../../components/internal/icons").IconVisa | typeof import("../../components/internal/icons").IconMasterCard | typeof import("../../components/internal/icons").IconJcb | typeof import("../../components/internal/icons").IconAmex | typeof import("../../components/internal/icons").IconDiscover | typeof import("../../components/internal/icons").IconDinnersClub | typeof import("../../components/internal/icons").IconUnionPay;
     name: string;
     code: import("../../types").CardBrandCode;
-    pattern: RegExp;
+    pattern?: RegExp | undefined;
+    validator?: ((cardNumber: string) => boolean) | undefined;
     lengths: number[];
     order: number;
 };
 export type CardBrandInfo = ReturnType<typeof getCardBrandInfo>;
 export declare function finCardBrandInfoByCode(code: string): {
-    icon: typeof import("../../components/internal/icons").IconVisa | typeof import("../../components/internal/icons").IconMasterCard | typeof import("../../components/internal/icons").IconJcb | typeof import("../../components/internal/icons").IconAmex | typeof import("../../components/internal/icons").IconDiscover | typeof import("../../components/internal/icons").IconDinnersClub;
+    icon: typeof import("../../components/internal/icons").IconVisa | typeof import("../../components/internal/icons").IconMasterCard | typeof import("../../components/internal/icons").IconJcb | typeof import("../../components/internal/icons").IconAmex | typeof import("../../components/internal/icons").IconDiscover | typeof import("../../components/internal/icons").IconDinnersClub | typeof import("../../components/internal/icons").IconUnionPay;
     name: string;
     code: import("../../types").CardBrandCode;
-    pattern: RegExp;
+    pattern?: RegExp | undefined;
+    validator?: ((cardNumber: string) => boolean) | undefined;
     lengths: number[];
     order: number;
 } | undefined;

package/dist/types/utils/card-brand/luhn.d.ts

@@ -0,0 +1,9 @@
+/**
+ * 银行卡号码的校验采用Luhn算法，校验过程大致如下：
+ * 1. 从右到左给卡号字符串编号，最右边第一位是1，最右边第二位是2，最右边第三位是3….
+ * 2. 从右向左遍历，对每一位字符t执行第三个步骤，并将每一位的计算结果相加得到一个数s。
+ * 3. 对每一位的计算规则：如果这一位是奇数位，则返回t本身，如果是偶数位，则先将t乘以2得到一个数n，如果n是一位数（小于10），直接返回n，否则将n的个位数和十位数相加返回。
+ * 4. 如果s能够整除10，则此号码有效，否则号码无效。
+ * 因为最终的结果会对10取余来判断是否能够整除10，所以又叫做模10算法。
+ */
+export declare const luhnCheck: (cardNumber: string) => boolean;

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

@@ -0,0 +1,9 @@
+export declare const DATE_FORMAT = "MM/DD/YYYY";
+export declare const DATE_TIME_FORMAT = "MM/DD/YYYY HH:mm:ss";
+declare const timeTemplateMap: {
+    date: string;
+    datetime: string;
+};
+type TimeTemplate = keyof typeof timeTemplateMap;
+export declare const formatTime: (value?: Numeric | Date, template?: StringUnion<TimeTemplate>) => string;
+export {};

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

@@ -0,0 +1 @@
+export declare const isEventSupported: (eventName: string, element?: HTMLDivElement) => boolean;

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

@@ -1,9 +1,15 @@
+import type { Amount } from '../api/modules/type';
 export declare const normalizedStyle: <T extends string | Nil | Recordable<any>>(...args: MaybeArray<T>[]) => string;
 export declare const normalizedClass: <T extends string | Nil | Recordable<any>>(...args: MaybeArray<T>[]) => string;
 export declare function limitedToNumber(val: string, whitelist?: string[]): string;
 export declare function trimAll(str: string): string;
+export declare const formatAmount: ({ amount, digits, currency, symbol }: Amount) => {
+    fixedAmount: () => string;
+    jointSymbol: () => string;
+    jointSymbolAndCurrency: () => string;
+    jointCurrency: () => string;
+};
 export declare function toFixed(num: number, digits?: number): string;
-export declare const formatAmount: (value?: number | undefined, digits?: number) => string;
 export declare function cssVarPrefix(value: string): string;
 export declare function underscoreToUpperCamelCase(str: string): string;
 export declare function extractAreaCodeAndPhoneNumber(phoneNumber?: string): {

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

@@ -9,6 +9,12 @@ export * from './is';
 export * from './obj';
 export * from './style';
 export * from './iframe';
+export * from './location';
+export * from './redirect';
+export * from './array';
+export * from './detect';
+export * from './date';
+export * from './object';
 export declare function getIf<T>(value: T, condition: boolean): T | undefined;
 /**
  * 将一个数值限制在指定的范围内
@@ -18,6 +24,7 @@ export declare function getIf<T>(value: T, condition: boolean): T | undefined;
  */
 export declare function clamp(value: number, min?: number, max?: number): number;
 export declare const safeParse: <T>(dataStr: string, defaultValue?: {}) => T;
+export declare const safeStringify: (data: any, defaultValue?: string) => string;
 /**
  * @description: 日期是否过期
  * @param {string} expireDate MM/YY

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

@@ -0,0 +1,7 @@
+export declare const getUrlParams: () => Record<string, string>;
+export declare const getUrlParam: (paramName: string) => string | null;
+export declare const createUrlWithParams: (baseUrl: string, params: Record<string, string | number | boolean>) => string;
+export declare const parseUrl: (url: string) => {
+    baseUrl: string;
+    params: Record<string, string>;
+};

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

@@ -0,0 +1 @@
+export declare const deepMerge: <T extends Recordable<any>, U extends Recordable<any>>(target: T, source: U) => T & U;

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

@@ -0,0 +1,5 @@
+/**
+ * 跳转至支付页面
+ * 根据支付方式选择使用 GET 或 POST 方式跳转
+ */
+export declare const redirectToPayment: (payInfo: Recordable) => void;

package/dist/types/utils/system-info/get-browser-info.d.ts

@@ -1,7 +1,7 @@
 /**
  * 获取系统信息-同步
  */
-export declare function getBrowserInfo(): {
+export declare const getBrowserInfo: () => {
     deviceBrand: undefined;
     brand: undefined;
     deviceModel: string | undefined;

package/dist/types/utils/system-info/get-system-info.d.ts

@@ -1,4 +1,4 @@
-export declare function getDeviceInfo(): {
+export declare const getDeviceInfo: () => {
     brand: undefined;
     deviceBrand: undefined;
     deviceModel: string | undefined;
@@ -10,7 +10,7 @@ export declare function getDeviceInfo(): {
     platform: string;
     system: string;
 };
-export declare function getSystemInfo(): {
+export declare const getSystemInfo: () => {
     brand: undefined;
     deviceBrand: undefined;
     deviceModel: string | undefined;
@@ -30,3 +30,4 @@ export declare function getSystemInfo(): {
     osTheme: undefined;
     ua: string;
 };
+export declare const isMobile: () => boolean;

package/dist/types/utils/system-info/index.d.ts

@@ -1,7 +1,7 @@
 import { getFingerprint } from './finger-print';
 import { getBrowserInfo } from './get-browser-info';
-import { getSystemInfo } from './get-system-info';
-export { getBrowserInfo, getSystemInfo, getFingerprint };
+import { getSystemInfo, isMobile } from './get-system-info';
+export { getBrowserInfo, getSystemInfo, getFingerprint, isMobile };
 export * from './is-ua-webview';
 export interface Browser {
     userAgent: string;
@@ -16,4 +16,4 @@ export interface Browser {
     osName: string;
     deviceFingerprintId: string;
 }
-export declare function getBrowser(): Promise<Browser>;
+export declare const getBrowser: () => Promise<Browser>;

package/package.json

@@ -1,63 +1,65 @@
-{
-  "name": "@paykka/card-checkout-ui",
-  "version": "0.7.0",
-  "type": "module",
-  "main": "dist/paykka-card-checkout-ui.umd.js",
-  "module": "dist/es/index.js",
-  "typings": "dist/types/index.d.ts",
-  "exports": {
-    ".": {
-      "import": "./dist/es/index.js",
-      "require": "./dist/paykka-card-checkout-ui.umd.js",
-      "types": "./dist/types/index.d.ts"
-    },
-    "./*": "./dist/*"
-  },
-  "files": [
-    "dist"
-  ],
-  "publishConfig": {
-    "registry": "https://packages.aliyun.com/640edee5a84870ae9d591e48/npm/npm-registry/"
-  },
-  "dependencies": {
-    "@ctrl/tinycolor": "^4.0.3",
-    "@fingerprintjs/fingerprintjs": "^4.2.2",
-    "@preact/signals": "^1.3.0",
-    "@types/applepayjs": "^14.0.9",
-    "@types/googlepay": "^0.7.6",
-    "preact": "^10.24.3",
-    "ts-toolbelt": "^9.6.0",
-    "unfetch": "^5.0.0",
-    "vue-tsc": "^2.1.10"
-  },
-  "devDependencies": {
-    "@changesets/cli": "^2.27.1",
-    "@preact/preset-vite": "^2.9.1",
-    "@types/node": "^20.12.7",
-    "autoprefixer": "^10.4.18",
-    "execa": "^8.0.1",
-    "fast-glob": "^3.3.2",
-    "sass": "^1.71.1",
-    "tsx": "^4.7.3",
-    "typescript": "^5.4.5",
-    "vite": "^5.2.10"
-  },
-  "scripts": {
-    "dev": "vite --host",
-    "build": "pnpm type-check && pnpm build:npm && pnpm build:inner && pnpm copy-dist-to-cdn && pnpm build:outer",
-    "build:npm": "tsx ./build/run.ts",
-    "build:inner": "tsx ./build/runInner.ts",
-    "build:outer": "tsx ./build/runOuter.ts",
-    "build:type": "tsc -p ./tsconfig.build.json",
-    "copy-dist-to-cdn": "tsx ./build/copyDist2CDN.ts",
-    "changeset": "changeset",
-    "changeset:pre": "changeset pre enter beta",
-    "changeset:pre-exit": "changeset pre exit",
-    "changeset:version": "changeset version",
-    "changeset:release": "changeset publish",
-    "changeset:prelease": "changeset publish --tag beta",
-    "release:prod": "pnpm build && pnpm changeset:release",
-    "release:noprod": "pnpm build && pnpm changeset:pre-exit && pnpm changeset:prelease",
-    "type-check": "vue-tsc --noEmit -p tsconfig.json --composite false"
-  }
-}
+{
+  "name": "@paykka/card-checkout-ui",
+  "version": "0.9.2",
+  "type": "module",
+  "main": "dist/paykka-card-checkout-ui.umd.js",
+  "module": "dist/es/index.js",
+  "typings": "dist/types/index.d.ts",
+  "exports": {
+    ".": {
+      "import": "./dist/es/index.js",
+      "require": "./dist/paykka-card-checkout-ui.umd.js",
+      "types": "./dist/types/index.d.ts"
+    },
+    "./*": "./dist/*"
+  },
+  "files": [
+    "dist"
+  ],
+  "scripts": {
+    "dev": "vite --host",
+    "build": "pnpm type-check && pnpm build:npm && pnpm build:inner && pnpm copy-dist-to-cdn && pnpm build:outer",
+    "build:npm": "tsx ./build/run.ts",
+    "build:inner": "tsx ./build/runInner.ts",
+    "build:outer": "tsx ./build/runOuter.ts",
+    "build:type": "tsc -p ./tsconfig.build.json",
+    "copy-dist-to-cdn": "tsx ./build/copyDist2CDN.ts",
+    "changeset": "changeset",
+    "changeset:pre": "changeset pre enter beta",
+    "changeset:pre-exit": "changeset pre exit",
+    "changeset:version": "changeset version",
+    "changeset:release": "changeset publish",
+    "changeset:prelease": "changeset publish --tag beta",
+    "release:prod": "pnpm build && pnpm changeset:release",
+    "release:noprod": "pnpm build && pnpm changeset:pre-exit && pnpm changeset:prelease",
+    "type-check": "tsc --noEmit -p tsconfig.json --composite false",
+    "release:npm": "npm publish --registry=https://registry.npmjs.org --access public"
+  },
+  "publishConfig": {
+    "registry": "https://packages.aliyun.com/640edee5a84870ae9d591e48/npm/npm-registry/"
+  },
+  "dependencies": {
+    "@ctrl/tinycolor": "^4.0.3",
+    "@fingerprintjs/fingerprintjs": "^4.2.2",
+    "@preact/signals": "^1.3.0",
+    "@types/applepayjs": "^14.0.9",
+    "@types/googlepay": "^0.7.6",
+    "preact": "^10.24.3",
+    "ts-toolbelt": "^9.6.0",
+    "unfetch": "^5.0.0",
+    "vue-tsc": "^2.1.10"
+  },
+  "devDependencies": {
+    "@changesets/cli": "^2.27.1",
+    "@preact/preset-vite": "^2.9.1",
+    "@types/node": "^20.12.7",
+    "autoprefixer": "^10.4.18",
+    "execa": "^8.0.1",
+    "fast-glob": "^3.3.2",
+    "sass": "^1.71.1",
+    "terser": "^5.42.0",
+    "tsx": "^4.7.3",
+    "typescript": "^5.4.5",
+    "vite": "^5.2.10"
+  }
+}