@paykka/card-checkout-ui 0.11.6 → 0.13.1

package/dist/types/components/wallets/Paymaya/type.d.ts

@@ -1,7 +1,7 @@
 import type { PayKKaError } from '../../..';
-import type { PayRes } from '../../../api';
+import type { PayKKaCommonConfig, PaymentInfo } from '../../../types';
 import type { FormValidateError } from '../../internal/Form';
-export interface PaymayaProps {
+export interface PaymayaProps extends PayKKaCommonConfig {
     /**
      * 是否展示邮箱
      * 若配置 true 但创建收银台时已经传了，就展示禁用状态。
@@ -17,35 +17,13 @@ export interface PaymayaProps {
     /** 提交表单时触发 */
     onSubmit?: (formValidateError?: Recordable<FormValidateError[]>) => void;
     /** 支付成功后触发 */
-    onSuccess?: (...args: any[]) => void;
+    onSuccess?: (data: PaymentInfo) => void;
     /** 支付失败时触发 */
     onError?: (error: PayKKaError) => void;
     /** 支付超时时触发 */
     onTimeout?: () => void;
     /** 收银台已过期时触发 */
     onExpired?: () => void;
-    /**
-     * @internal
-     * 请求支付接口成功后返回跳转链接
-     */
-    onSubmitResponse?: (payRes: PayRes) => void;
-    /**
-     * @internal
-     * 跳转模式，钱包支付时需要跳转到第三方页面进行支付，流程结束在返回收银台
-     * auto: 自动跳转
-     * manual: 需要在 onSubmitResponse 中接收跳转链接并手动跳转
-     */
-    redirectMode?: 'auto' | 'manual';
-    /**
-     * @internal
-     * 从第三方支付页面跳转回来时，是否自动查询支付结果
-     */
-    autoQuery?: boolean;
-    /**
-     * @internal
-     * 是否展示引导卡片
-     */
-    showGuideCard?: boolean;
 }
 export interface PaymayaRef {
     /** 停止轮询支付结果 */

package/dist/types/components/wallets/Zalopay/Zalopay.d.ts

@@ -0,0 +1,10 @@
+import type { ZalopayProps, ZalopayRef } from './type';
+import './zalopay.scss';
+export declare const Zalopay: import("preact").FunctionalComponent<import("preact/compat").PropsWithoutRef<ZalopayProps & import("../../../types").PayKKaCommonConfig & {
+    session: import("../../../core").Session;
+    core: import("../../../core").PayKKaCheckout;
+    threeDSFrame?: import("../../../types").ThreeDSFrameConfig | undefined;
+    isDropIn?: boolean | undefined;
+}> & {
+    ref?: import("preact").Ref<ZalopayRef> | undefined;
+}>;

package/dist/types/components/wallets/Zalopay/index.d.ts

@@ -0,0 +1,2 @@
+export * from './Zalopay';
+export * from './type';

package/dist/types/components/wallets/Zalopay/type.d.ts

@@ -0,0 +1,39 @@
+import type { PayKKaError } from '../../..';
+import type { PayKKaCommonConfig, PaymentInfo } from '../../../types';
+import type { FormValidateError } from '../../internal/Form';
+export interface ZalopayProps extends PayKKaCommonConfig {
+    /**
+     * 是否展示邮箱
+     * 若配置 true 但创建收银台时已经传了，就展示禁用状态。
+     * 若配置 false 但创建收银台时未传，依旧会展示该输入框。
+     */
+    showEmail?: boolean;
+    /**
+     * 是否展示邮箱
+     * 若配置 true 但创建收银台时已经传了，还是展示，先不禁用。
+     * 若配置 false 但创建收银台时未传，依旧会展示该输入框。
+     */
+    showAddress?: boolean;
+    /** 提交表单时触发 */
+    onSubmit?: (formValidateError?: Recordable<FormValidateError[]>) => void;
+    /** 支付成功后触发 */
+    onSuccess?: (data: PaymentInfo) => void;
+    /** 支付失败时触发 */
+    onError?: (error: PayKKaError) => void;
+    /** 支付超时时触发 */
+    onTimeout?: (type: 'retry' | 'channel') => void;
+    /** 收银台已过期时触发 */
+    onExpired?: () => void;
+}
+export interface ZalopayRef {
+    /** 停止轮询支付结果 */
+    stopRetry: () => void;
+    /** 开始轮询支付结果 */
+    startRetry: (timeout?: number) => void;
+    /** 更新表单地址 */
+    updateAddress: () => void;
+    /** 更新表单邮箱 */
+    updateEmail: () => void;
+    /** 不展示支付按钮时，可调用该方法进行支付 */
+    payment: () => void;
+}

package/dist/types/config.d.ts

@@ -7,12 +7,10 @@ export declare let cdnUrl: string;
 export declare let fraudDetectionEnv: FraudDetectionEnv | undefined;
 export declare let customReqHeaders: Recordable;
 export declare let customLocale: LocaleKeyType | undefined;
-export declare let hidePaymentButton: boolean;
+export declare let apiPrefix: string;
 export declare const setApiUrl: (url: string) => void;
 export declare const setCDNUrl: (url: string) => void;
 export declare const setFraudDetectionEnv: (env: FraudDetectionEnv) => void;
 export declare const setCustomReqHeaders: (headers: Recordable) => void;
 export declare const setCustomLocale: (locale: LocaleKeyType) => void;
-export declare const setCheckoutConfig: (params: {
-    hidePaymentButton?: boolean;
-}) => void;
+export declare const setApiPrefix: (prefix: string) => void;

package/dist/types/constant.d.ts

@@ -27,6 +27,7 @@ export declare enum PaymentMethod {
     NINE_PAY = "NINE_PAY",
     GCASH = "G_CASH",
     PAYMAYA = "PAYMAYA",
+    ZALOPAY = "ZALOPAY",
     /** 目前没用 */
     SEPA_DEBIT = "SEPA_DEBIT"
 }
@@ -48,7 +49,8 @@ export declare enum PaymentCategory {
     LINE_PAY = "linePay",
     NINE_PAY = "ninePay",
     GCASH = "gcash",
-    PAYMAYA = "paymaya"
+    PAYMAYA = "paymaya",
+    ZALOPAY = "zalopay"
 }
 export declare const PaymentMethod2CategoryMap: Partial<Record<PaymentMethod, PaymentCategory>>;
 export declare const PaymentCategory2MethodMap: Partial<Record<PaymentCategory, PaymentMethod[]>>;

package/dist/types/core/{Address.d.ts → address.d.ts}

@@ -4,14 +4,14 @@ interface Option {
     label: string;
     value: string;
 }
-interface AddressState {
-    country: string;
-    province: string;
-    city: string;
-    area: string;
-    postCode: string;
-    address1: string;
-    address2: string;
+export interface Address {
+    country?: string;
+    province?: string;
+    city?: string;
+    area?: string;
+    postCode?: string;
+    address1?: string;
+    address2?: string;
 }
 export interface AddressFormatItem {
     addressItem: keyof typeof EAddressType;
@@ -38,20 +38,20 @@ export declare class AddressCore {
     getProvinceOption(): Option[];
     requestCityOption(): Promise<void>;
     setCountry(country: string): void;
-    getCountry(): string;
+    getCountry(): string | undefined;
     setProvince(province: string): void;
-    getProvince(): string;
+    getProvince(): string | undefined;
     setAddressFormat(addressFormat: AddressFormatItem[]): void;
     getAddressFormat(): AddressFormatItem[];
-    getAddress1(): string;
+    getAddress1(): string | undefined;
     setAddress1(address1: string): void;
-    getAddress2(): string;
+    getAddress2(): string | undefined;
     setAddress2(address2: string): void;
-    getCity(): string;
+    getCity(): string | undefined;
     setCity(city: string): void;
-    getArea(): string;
+    getArea(): string | undefined;
     setArea(area: string): void;
-    getPostCode(): string;
+    getPostCode(): string | undefined;
     setPostCode(postCode: string): void;
     setMap(): {
         ADDRESS_1: (value: string) => void;
@@ -64,20 +64,19 @@ export declare class AddressCore {
     };
     setAddressStateByKey(key: keyof typeof EAddressType | 'COUNTRY', value: string): void;
     getAddressState(): {
-        country: string;
-        province: string;
-        city: string;
-        area: string;
-        postCode: string;
-        address1: string;
-        address2: string;
+        country: string | undefined;
+        province: string | undefined;
+        city: string | undefined;
+        area: string | undefined;
+        postCode: string | undefined;
+        address1: string | undefined;
+        address2: string | undefined;
     };
-    setAddressState(value: AddressState): void;
+    setAddressState(value: Address): void;
     getValidateAllFields(): boolean;
     setValidateAllFields(value: boolean): void;
     getCityOptions(): Option[];
     setCityOptions(options: Option[]): void;
     getLabel(value: string, options: Option[]): string | null;
 }
-export declare const createAddressCore: () => AddressCore;
 export {};

package/dist/types/core/{PayKKaCheckout.d.ts → checkout.d.ts}

@@ -1,9 +1,10 @@
 import type { ComponentType, JSX } from 'preact';
 import type { CoreProps, PayKKaEnvConfig, PayKKaInitConfiguration } from '../types';
 import { type ComponentInst } from './create';
-import { Session } from './Session';
+import { Session } from './session';
 import getFraudDetectionInstance from '../out/fraud-detection';
 import type { PaymentMethod } from '../constant';
+import { AddressCore } from './address';
 export type FraudDetectionType = ReturnType<typeof getFraudDetectionInstance>;
 /**
  * 收银台实例
@@ -19,7 +20,8 @@ export declare class PayKKaCheckout {
      */
     enablePaymentMethod: import("@preact/signals").Signal<PaymentMethod | null>;
     constructor(config: PayKKaInitConfiguration);
-    private init;
+    init(): Promise<void>;
+    private initCheckoutConfig;
     private initSession;
     /**
      * 初始化环境配置
@@ -27,7 +29,6 @@ export declare class PayKKaCheckout {
      */
     private initEnv;
     private initLocale;
-    private initExtraParams;
     private initOtherData;
     get session(): Session;
     get envConfig(): PayKKaEnvConfig;
@@ -36,4 +37,5 @@ export declare class PayKKaCheckout {
     create<P extends Recordable>(component: ComponentType<P> | ((props: P) => JSX.Element), props?: Partial<P> | null): ComponentInst<P>;
     getCoreProps(): CoreProps;
     resetEnablePaymentMethod(): void;
+    getAddressCore(): AddressCore;
 }

package/dist/types/core/context.d.ts

@@ -1,7 +1,8 @@
 import type { I18n } from '../i18n';
-import type { Session } from './Session';
+import type { Session } from './session';
+import type { PayKKaCheckout } from './checkout';
 export declare const CoreContext: import("preact").Context<{
+    core?: PayKKaCheckout | null | undefined;
     i18n?: I18n | null | undefined;
     session?: Session | null | undefined;
-    threeDSMessageListenerInit?: boolean | undefined;
 } | null>;

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

@@ -1,6 +1,6 @@
 export * from './context';
 export * from './create';
-export * from './Session';
+export * from './session';
 export * from './query';
-export * from './PayKKaCheckout';
+export * from './checkout';
 export * from './error';

package/dist/types/core/query.d.ts

@@ -1,2 +1,2 @@
-import { type RequestOptions, type QueryCheckoutParams, type CheckoutRes } from '../api';
-export declare const querySession: ({ sessionId, clientKey }: QueryCheckoutParams, options?: RequestOptions) => Promise<CheckoutRes>;
+import { type RequestOptions, type CheckoutInitParams, type CheckoutRes } from '../api';
+export declare const querySession: (params: CheckoutInitParams, extraParams?: Recordable, options?: RequestOptions) => Promise<CheckoutRes>;

package/dist/types/core/session.d.ts

@@ -0,0 +1,33 @@
+import { type CheckoutRes } from '../api';
+export interface SessionParams {
+    /**
+     * 会话 ID
+     * Hosted、Component、Drop-in 必填
+     */
+    sessionId?: string;
+    /**
+     * 客户端密钥
+     * Component、Drop-in 必填
+     */
+    clientKey?: string;
+}
+export interface CheckoutTheme {
+    primary: string;
+    primaryHover: string;
+    primaryActive: string;
+}
+export declare class Session {
+    #private;
+    sessionId?: string;
+    readonly clientKey?: string;
+    checkout?: CheckoutRes;
+    colors: CheckoutTheme | null;
+    extraParams: Recordable;
+    constructor(params: SessionParams, extraParams?: Recordable);
+    /**
+     * 设置主题
+     * 目前的主题仅仅包含按钮背景和字体色
+     */
+    private initTheme;
+    ready(): import("../utils").CreatePromiseReturn<boolean>;
+}

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

@@ -3,3 +3,4 @@ export * from './useI18n';
 export * from './usePayState';
 export * from './useRetry';
 export * from './useBreakpoints';
+export * from './usePayment';

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

@@ -0,0 +1,8 @@
+import type { SubmitButtonStatus } from '../components';
+/** 支付状态管理 */
+export declare const usePaymentStatus: () => {
+    paymentButtonStatus: SubmitButtonStatus;
+    setPaymentButtonStatus: import("preact/hooks").Dispatch<import("preact/hooks").StateUpdater<SubmitButtonStatus>>;
+    errorMsg: string;
+    setErrorMsg: import("preact/hooks").Dispatch<import("preact/hooks").StateUpdater<string>>;
+};

package/dist/types/i18n/locales/de-DE.d.ts

@@ -12,6 +12,7 @@ declare const _default: {
     'dropIn.ninePay.label': string;
     'dropIn.gcash.label': string;
     'dropIn.paymaya.label': string;
+    'dropIn.zalopay.label': string;
     'card.cardNumber.label': string;
     'card.cardNumber.incomplete': string;
     'card.cardNumber.invalid': string;
@@ -67,5 +68,6 @@ declare const _default: {
     'threeDS.returnToCheckout': string;
     'qrCode.expired': string;
     'qrCode.scanByGcash': string;
+    'qrCode.scanByZalopay': string;
 };
 export default _default;

package/dist/types/i18n/locales/en-GB.d.ts

@@ -12,6 +12,7 @@ declare const _default: {
     'dropIn.ninePay.label': string;
     'dropIn.gcash.label': string;
     'dropIn.paymaya.label': string;
+    'dropIn.zalopay.label': string;
     'card.cardNumber.label': string;
     'card.cardNumber.incomplete': string;
     'card.cardNumber.invalid': string;
@@ -67,5 +68,6 @@ declare const _default: {
     'threeDS.returnToCheckout': string;
     'qrCode.expired': string;
     'qrCode.scanByGcash': string;
+    'qrCode.scanByZalopay': string;
 };
 export default _default;

package/dist/types/i18n/locales/es-ES.d.ts

@@ -12,6 +12,7 @@ declare const _default: {
     'dropIn.ninePay.label': string;
     'dropIn.gcash.label': string;
     'dropIn.paymaya.label': string;
+    'dropIn.zalopay.label': string;
     'card.cardNumber.label': string;
     'card.cardNumber.incomplete': string;
     'card.cardNumber.invalid': string;
@@ -67,5 +68,6 @@ declare const _default: {
     'threeDS.returnToCheckout': string;
     'qrCode.expired': string;
     'qrCode.scanByGcash': string;
+    'qrCode.scanByZalopay': string;
 };
 export default _default;

package/dist/types/i18n/locales/fr-FR.d.ts

@@ -12,6 +12,7 @@ declare const _default: {
     'dropIn.ninePay.label': string;
     'dropIn.gcash.label': string;
     'dropIn.paymaya.label': string;
+    'dropIn.zalopay.label': string;
     'card.cardNumber.label': string;
     'card.cardNumber.incomplete': string;
     'card.cardNumber.invalid': string;
@@ -67,5 +68,6 @@ declare const _default: {
     'threeDS.returnToCheckout': string;
     'qrCode.expired': string;
     'qrCode.scanByGcash': string;
+    'qrCode.scanByZalopay': string;
 };
 export default _default;

package/dist/types/i18n/locales/ja-JP.d.ts

@@ -12,6 +12,7 @@ declare const _default: {
     'dropIn.ninePay.label': string;
     'dropIn.gcash.label': string;
     'dropIn.paymaya.label': string;
+    'dropIn.zalopay.label': string;
     'card.cardNumber.label': string;
     'card.cardNumber.incomplete': string;
     'card.cardNumber.invalid': string;
@@ -67,5 +68,6 @@ declare const _default: {
     'threeDS.returnToCheckout': string;
     'qrCode.expired': string;
     'qrCode.scanByGcash': string;
+    'qrCode.scanByZalopay': string;
 };
 export default _default;

package/dist/types/i18n/locales/ko-KR.d.ts

@@ -12,6 +12,7 @@ declare const _default: {
     'dropIn.ninePay.label': string;
     'dropIn.gcash.label': string;
     'dropIn.paymaya.label': string;
+    'dropIn.zalopay.label': string;
     'card.cardNumber.label': string;
     'card.cardNumber.incomplete': string;
     'card.cardNumber.invalid': string;
@@ -67,5 +68,6 @@ declare const _default: {
     'threeDS.returnToCheckout': string;
     'qrCode.expired': string;
     'qrCode.scanByGcash': string;
+    'qrCode.scanByZalopay': string;
 };
 export default _default;

package/dist/types/i18n/locales/nl-NL.d.ts

@@ -12,6 +12,7 @@ declare const _default: {
     'dropIn.ninePay.label': string;
     'dropIn.gcash.label': string;
     'dropIn.paymaya.label': string;
+    'dropIn.zalopay.label': string;
     'card.cardNumber.label': string;
     'card.cardNumber.incomplete': string;
     'card.cardNumber.invalid': string;
@@ -67,5 +68,6 @@ declare const _default: {
     'threeDS.returnToCheckout': string;
     'qrCode.expired': string;
     'qrCode.scanByGcash': string;
+    'qrCode.scanByZalopay': string;
 };
 export default _default;

package/dist/types/i18n/locales/pt-PT.d.ts

@@ -12,6 +12,7 @@ declare const _default: {
     'dropIn.ninePay.label': string;
     'dropIn.gcash.label': string;
     'dropIn.paymaya.label': string;
+    'dropIn.zalopay.label': string;
     'card.cardNumber.label': string;
     'card.cardNumber.incomplete': string;
     'card.cardNumber.invalid': string;
@@ -67,5 +68,6 @@ declare const _default: {
     'threeDS.returnToCheckout': string;
     'qrCode.expired': string;
     'qrCode.scanByGcash': string;
+    'qrCode.scanByZalopay': string;
 };
 export default _default;

package/dist/types/i18n/locales/ru-RU.d.ts

@@ -12,6 +12,7 @@ declare const _default: {
     'dropIn.ninePay.label': string;
     'dropIn.gcash.label': string;
     'dropIn.paymaya.label': string;
+    'dropIn.zalopay.label': string;
     'card.cardNumber.label': string;
     'card.cardNumber.incomplete': string;
     'card.cardNumber.invalid': string;
@@ -67,5 +68,6 @@ declare const _default: {
     'threeDS.returnToCheckout': string;
     'qrCode.expired': string;
     'qrCode.scanByGcash': string;
+    'qrCode.scanByZalopay': string;
 };
 export default _default;

package/dist/types/i18n/locales/zh-CN.d.ts

@@ -12,6 +12,7 @@ declare const _default: {
     'dropIn.ninePay.label': string;
     'dropIn.gcash.label': string;
     'dropIn.paymaya.label': string;
+    'dropIn.zalopay.label': string;
     'card.cardNumber.label': string;
     'card.cardNumber.incomplete': string;
     'card.cardNumber.invalid': string;
@@ -67,5 +68,6 @@ declare const _default: {
     'threeDS.returnToCheckout': string;
     'qrCode.expired': string;
     'qrCode.scanByGcash': string;
+    'qrCode.scanByZalopay': string;
 };
 export default _default;

package/dist/types/i18n/locales/zh-HK.d.ts

@@ -12,6 +12,7 @@ declare const _default: {
     'dropIn.ninePay.label': string;
     'dropIn.gcash.label': string;
     'dropIn.paymaya.label': string;
+    'dropIn.zalopay.label': string;
     'card.cardNumber.label': string;
     'card.cardNumber.incomplete': string;
     'card.cardNumber.invalid': string;
@@ -67,5 +68,6 @@ declare const _default: {
     'threeDS.returnToCheckout': string;
     'qrCode.expired': string;
     'qrCode.scanByGcash': string;
+    'qrCode.scanByZalopay': string;
 };
 export default _default;

package/dist/types/i18n/locales/zh-TW.d.ts

@@ -12,6 +12,7 @@ declare const _default: {
     'dropIn.ninePay.label': string;
     'dropIn.gcash.label': string;
     'dropIn.paymaya.label': string;
+    'dropIn.zalopay.label': string;
     'card.cardNumber.label': string;
     'card.cardNumber.incomplete': string;
     'card.cardNumber.invalid': string;
@@ -67,5 +68,6 @@ declare const _default: {
     'threeDS.returnToCheckout': string;
     'qrCode.expired': string;
     'qrCode.scanByGcash': string;
+    'qrCode.scanByZalopay': string;
 };
 export default _default;

package/dist/types/index.d.ts

@@ -1,6 +1,7 @@
 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 { setApiUrl, setCDNUrl, setFraudDetectionEnv, setCustomReqHeaders, setCustomLocale } from './config';
 export { getFingerprint, redirectToPayment } from './utils';
 export { PaymentMethod } from './constant';
+export * from './types';