@paykka/card-checkout-ui 0.5.15 → 0.6.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (108) hide show
  1. package/dist/card-checkout-ui.js +22 -0
  2. package/dist/card-checkout-ui.umd.cjs +19 -5
  3. package/dist/es/api/index.js +3 -0
  4. package/dist/es/api/modules/checkout/map.js +2 -1
  5. package/dist/es/api/modules/encrypted-card/index.js +54 -0
  6. package/dist/es/api/modules/get-browser-params.js +2 -2
  7. package/dist/es/api/modules/index.js +3 -0
  8. package/dist/es/components/AccountNameField/index.js +4 -0
  9. package/dist/es/components/AddressField/index.js +4 -0
  10. package/dist/es/components/AliPay/index.js +8 -8
  11. package/dist/es/components/ApplePay/index.js +71 -14
  12. package/dist/es/components/Card/index.js +56 -40
  13. package/dist/es/components/CardExpireDateField/index.js +8 -3
  14. package/dist/es/components/CardHolderNameField/index.js +4 -0
  15. package/dist/es/components/CardIBANField/index.js +4 -0
  16. package/dist/es/components/CardNumberField/index.js +34 -17
  17. package/dist/es/components/CardSecurityCodeField/index.js +8 -3
  18. package/dist/es/components/CardSelector/index.js +3 -0
  19. package/dist/es/components/CombinedEncryptedField/index.js +75 -0
  20. package/dist/es/components/EmailField/EmailField.js +4 -0
  21. package/dist/es/components/EncryptedCard/index.js +448 -0
  22. package/dist/es/components/GooglePay/index.js +57 -19
  23. package/dist/es/components/RecurringTip/index.js +1 -1
  24. package/dist/es/components/SecuredFieldsProvider/SecuredFieldsProvider.js +70 -25
  25. package/dist/es/components/SecuredIframe/index.js +190 -22
  26. package/dist/es/components/Sepa/index.js +16 -6
  27. package/dist/es/components/WechatPay/index.js +8 -8
  28. package/dist/es/components/index.js +4 -0
  29. package/dist/es/components/internal/CheckBox/CheckBox.js +1 -1
  30. package/dist/es/components/internal/Form/FormItem.js +28 -24
  31. package/dist/es/components/internal/Form/index.js +1 -0
  32. package/dist/es/components/internal/Form/type.js +15 -1
  33. package/dist/es/components/internal/Input/Input.js +9 -11
  34. package/dist/es/components/internal/Input/index.js +1 -0
  35. package/dist/es/components/internal/Input/type.js +13 -1
  36. package/dist/es/components/internal/Select/Select.js +2 -0
  37. package/dist/es/config.js +23 -6
  38. package/dist/es/constant.js +10 -0
  39. package/dist/es/core/PayKKaCheckout.js +62 -0
  40. package/dist/es/core/Session.js +3 -0
  41. package/dist/es/core/index.js +2 -0
  42. package/dist/es/core/query.js +4 -6
  43. package/dist/es/core.js +30 -30
  44. package/dist/es/hooks/useI18n.js +2 -2
  45. package/dist/es/hooks/usePayState.js +14 -25
  46. package/dist/es/i18n/I18n.js +11 -8
  47. package/dist/es/index.js +16 -3
  48. package/dist/es/out/fraud-detection.js +99 -0
  49. package/dist/es/style.css +8 -0
  50. package/dist/es/types/{radar.js → fraud-detection.js} +1 -1
  51. package/dist/es/types/index.js +49 -1
  52. package/dist/es/utils/card-brand/brands.js +16 -42
  53. package/dist/es/utils/index.js +11 -0
  54. package/dist/es/utils/load.js +14 -0
  55. package/dist/es/utils/style.js +37 -0
  56. package/dist/style.css +1 -1
  57. package/dist/types/api/modules/checkout/map.d.ts +1 -0
  58. package/dist/types/api/modules/encrypted-card/index.d.ts +6 -0
  59. package/dist/types/api/modules/encrypted-card/type.d.ts +31 -0
  60. package/dist/types/api/modules/get-browser-params.d.ts +2 -2
  61. package/dist/types/components/AliPay/type.d.ts +0 -4
  62. package/dist/types/components/ApplePay/type.d.ts +16 -7
  63. package/dist/types/components/ApplePay/utils.d.ts +3 -0
  64. package/dist/types/components/Card/type.d.ts +15 -5
  65. package/dist/types/components/CardExpireDateField/type.d.ts +1 -0
  66. package/dist/types/components/CardNumberField/type.d.ts +3 -0
  67. package/dist/types/components/CardSecurityCodeField/type.d.ts +1 -0
  68. package/dist/types/components/CombinedEncryptedField/CombinedEncryptedField.d.ts +4 -0
  69. package/dist/types/components/CombinedEncryptedField/index.d.ts +2 -0
  70. package/dist/types/components/CombinedEncryptedField/type.d.ts +15 -0
  71. package/dist/types/components/EncryptedCard/EncryptedCard.d.ts +4 -0
  72. package/dist/types/components/EncryptedCard/index.d.ts +4 -0
  73. package/dist/types/components/EncryptedCard/output.d.ts +9 -0
  74. package/dist/types/components/EncryptedCard/type.d.ts +85 -0
  75. package/dist/types/components/GooglePay/type.d.ts +17 -8
  76. package/dist/types/components/GooglePay/utils.d.ts +2 -0
  77. package/dist/types/components/SecuredFieldsProvider/type.d.ts +103 -22
  78. package/dist/types/components/SecuredIframe/useSecuredInput.d.ts +6 -2
  79. package/dist/types/components/Sepa/type.d.ts +0 -4
  80. package/dist/types/components/WechatPay/type.d.ts +0 -4
  81. package/dist/types/components/index.d.ts +2 -0
  82. package/dist/types/components/internal/Form/FormItem.d.ts +1 -1
  83. package/dist/types/components/internal/Form/type.d.ts +7 -0
  84. package/dist/types/components/internal/Input/Input.d.ts +1 -1
  85. package/dist/types/components/internal/Input/type.d.ts +6 -0
  86. package/dist/types/config.d.ts +10 -3
  87. package/dist/types/constant.d.ts +1 -0
  88. package/dist/types/core/PayKKaCheckout.d.ts +12 -0
  89. package/dist/types/core/index.d.ts +1 -0
  90. package/dist/types/core/query.d.ts +2 -2
  91. package/dist/types/hooks/useI18n.d.ts +2 -2
  92. package/dist/types/hooks/usePayState.d.ts +4 -22
  93. package/dist/types/i18n/I18n.d.ts +6 -5
  94. package/dist/types/i18n/locales/index.d.ts +1 -0
  95. package/dist/types/index.d.ts +3 -3
  96. package/dist/types/out/fraud-detection.d.ts +9 -0
  97. package/dist/types/types/{radar.d.ts → fraud-detection.d.ts} +3 -2
  98. package/dist/types/types/index.d.ts +69 -1
  99. package/dist/types/utils/card-brand/brands.d.ts +3 -10
  100. package/dist/types/utils/card-brand/index.d.ts +10 -9
  101. package/dist/types/utils/format.d.ts +2 -3
  102. package/dist/types/utils/index.d.ts +3 -0
  103. package/dist/types/utils/load.d.ts +7 -0
  104. package/dist/types/utils/style.d.ts +17 -0
  105. package/package.json +2 -2
  106. package/dist/card-checkout-ui.iife.js +0 -8
  107. package/dist/es/out/radar.js +0 -123
  108. package/dist/types/out/radar.d.ts +0 -14
@@ -0,0 +1,15 @@
1
+ import type { CardBrand } from '../../types';
2
+ import type { FormItemProps, FormValidationStatus } from '../internal/Form';
3
+ import type { InputProps } from '../internal/Input';
4
+ export interface CombinedEncryptedFieldProps extends Pick<FormItemProps, 'onValidationStatusChange' | 'className' | 'style'>, Pick<InputProps, 'onInput'> {
5
+ supportedCardBrands?: string[];
6
+ security: boolean;
7
+ }
8
+ export interface CombinedEncryptedFieldRef {
9
+ focus: () => void;
10
+ blur: () => void;
11
+ resetValidation: (status: FormValidationStatus, errorTip?: string) => void;
12
+ binValueChanged: (binValue: string) => void;
13
+ brandChanged: (brand?: CardBrand) => void;
14
+ getCardBrand: () => Recordable;
15
+ }
@@ -0,0 +1,4 @@
1
+ import { type EncryptedCardProps, type EncryptedCardRef } from './type';
2
+ export declare const EncryptedCard: import("preact").FunctionalComponent<import("preact/compat").PropsWithoutRef<EncryptedCardProps> & {
3
+ ref?: import("preact").Ref<EncryptedCardRef> | undefined;
4
+ }>;
@@ -0,0 +1,4 @@
1
+ import PayKKaEncryptedCard from './output';
2
+ export * from './EncryptedCard';
3
+ export * from './type';
4
+ export { PayKKaEncryptedCard };
@@ -0,0 +1,9 @@
1
+ import { type EncryptedCardProps } from './type';
2
+ export default class PayKKaEncryptedCard {
3
+ constructor();
4
+ static init(props: EncryptedCardProps): import("./type").EncryptedCardRef | undefined;
5
+ static setEnv(env: {
6
+ apiUrl: string;
7
+ cdnUrl: string;
8
+ }): void;
9
+ }
@@ -0,0 +1,85 @@
1
+ import type { EncryptCardRes } from '../../api/modules/encrypted-card/type';
2
+ import type { LocaleKeyType } from '../../i18n';
3
+ import type { CardBrand, ElementStylesConfig } from '../../types';
4
+ import type { FieldType } from '../SecuredFieldsProvider/type';
5
+ import type { FormValidationStatus } from '../internal/Form';
6
+ export interface EncryptedCardProps {
7
+ /** 商户 id */
8
+ merchantId: string;
9
+ /** clientKey,需要商户进行配置 */
10
+ clientKey: string;
11
+ /** 国际化语言 */
12
+ locale?: LocaleKeyType;
13
+ /**
14
+ * 自定义有效的卡品牌数组
15
+ * 待初始化时请求后端接口验证身份后也会拿到卡品牌,然后两者取交集
16
+ * 如果不传,则直接取后端返回的卡品牌
17
+ */
18
+ brands?: CardBrand[];
19
+ /** 自定义 输入框、label 和 错误提示文字 的样式 */
20
+ styles?: ElementStylesConfig;
21
+ /** 是否展示 label,展示 label 时可设置相关样式 */
22
+ showLabel?: boolean;
23
+ /**
24
+ * 卡 bin 信息改变触发
25
+ * 包含卡号前 1-6 位的值
26
+ * 如果用户删除卡号,或卡号不足 6 位,则卡 bin 信息为空
27
+ */
28
+ onBinChanged?: (binInfo: {
29
+ binValue: string;
30
+ brand?: CardBrand;
31
+ }) => void;
32
+ /** 只要检测到了卡品牌变化,就会调用,无论用户输入了几位卡号 */
33
+ onBrand?: (brand?: CardBrand) => void;
34
+ /** 卡信息加密成功后触发 */
35
+ onCardEncrypted?: (encryptedInfo: EncryptCardRes) => void;
36
+ /** 卡信息加密失败后触发 */
37
+ onCardEncryptionFailed?: () => void;
38
+ /**
39
+ * 进行了 client key 的校验后调用(此时还未渲染表单)
40
+ * status 为 true 表示通过校验,为 false 表示未通过
41
+ * res 为校验结果,包含可用的卡品牌(交集)
42
+ */
43
+ onReady?: (status: boolean, res?: {
44
+ brands: CardBrand[];
45
+ }) => void;
46
+ /** 表单 iframe 激活后触发 */
47
+ onActivated?: (fieldType: FieldType) => void;
48
+ /**
49
+ * 当输入字段获得焦点时触发
50
+ * fieldType 表示哪个表单项
51
+ */
52
+ onFocus?: (fieldType: FieldType) => void;
53
+ /**
54
+ * 当输入字段失去焦点时触发
55
+ * fieldType 表示哪个表单项
56
+ */
57
+ onBlur?: (fieldType: FieldType) => void;
58
+ /**
59
+ * 通知表单项验证信息
60
+ * fieldType 表示哪个表单项
61
+ * status 可以是错误,成功或未验证
62
+ */
63
+ onValidationChanged?: (validationInfo: {
64
+ fieldType: FieldType;
65
+ status: FormValidationStatus;
66
+ }) => void;
67
+ /** 是否为沙盒环境 */
68
+ sandbox?: boolean;
69
+ }
70
+ export interface EncryptedCardRef {
71
+ /** 调用该方法开始表单验证和加密流程 */
72
+ encrypt: () => void;
73
+ }
74
+ /** 包在加密表单最外面的元素id */
75
+ export declare const ENCRYPTED_CARD_WRAPPER_ID = "encryptedCardWrapper";
76
+ /** 包在表单元素外面的元素自定义属性名 */
77
+ export declare const ENCRYPTED_CARD_ITEM_ATTR = "data-eci";
78
+ /** 表单项类型 */
79
+ export declare enum EEncryptedCardType {
80
+ CARD = "card",
81
+ CARD_NUMBER = "cardNumber",
82
+ CVV = "securityCode",
83
+ EXPIRE_DATE = "expiryDate"
84
+ }
85
+ export type EncryptedCardItemType = keyof typeof EEncryptedCardType;
@@ -1,21 +1,30 @@
1
- import type { PayRes } from '../../api';
2
- import type { LocaleKey } from '../../i18n';
1
+ import type { PaymentSuccessData } from '../../types';
3
2
  export interface GooglePayProps {
4
- sessionId: string;
5
- clientKey?: string;
6
- i18n?: LocaleKey;
3
+ /** 支付授权成功后触发 */
7
4
  onSubmit?: () => void;
8
- onSuccess?: (...args: any[]) => void;
5
+ /** 支付成功后触发 */
6
+ onSuccess?: (data: PaymentSuccessData) => void;
7
+ /** SDK 加载回调,status 为 true 表示加载成功,false 表示加载失败 */
8
+ onLoad?: (status: boolean) => void;
9
+ /** 支付失败时触发 */
9
10
  onError?: (error: any) => void;
11
+ /** 支付超时时触发 */
10
12
  onTimeout?: (source: 'retry' | 'channel') => void;
13
+ /** 收银台已过期时触发 */
11
14
  onExpired?: () => void;
12
- onSubmitResponse?: (payRes: PayRes) => void;
15
+ /** 交易被风控拦截时触发 */
13
16
  onAuthorized?: () => void;
17
+ /** 交易需要 3DS 验证时触发,url 为 3DS 验证链接,incomplete 为 false 表示目前要开始进行 3DS 验证,为 true 表示上一次 3DS 验证还未完成 */
14
18
  onThreeDS?: (url: string, incomplete: boolean) => void;
19
+ /** 当前设备环境是否可用于 Google Pay 支付 */
20
+ onCanUse?: (canUse: boolean) => void;
21
+ /**
22
+ * 内部使用
23
+ */
15
24
  /** 点击 GooglePay 按钮 */
16
25
  onBtnClick?: () => void;
17
- onCanUse?: (canUse: boolean) => void;
18
26
  }
19
27
  export interface GooglePayRef {
28
+ /** 3DS 验证流程结束后可调用该方法轮询收银台支付状态 */
20
29
  checkThreeDS: () => void;
21
30
  }
@@ -0,0 +1,2 @@
1
+ /** 动态加载GooglePay */
2
+ export declare const loadGooglePayJS: (onload?: () => any, onerror?: () => any) => void;
@@ -1,41 +1,64 @@
1
- import type { CSSProperties, ReactNode } from 'preact/compat';
1
+ import type { ReactNode } from 'preact/compat';
2
2
  import type { SessionMode } from '../../constant';
3
3
  import type { I18n } from '../../i18n';
4
4
  import type { PayRes } from '../../api';
5
5
  import type { FormValidationStatus } from '../internal/Form';
6
+ import type { CardBrand, InputStylesConfig } from '../../types';
7
+ import type { EncryptCardRes } from '../../api/modules/encrypted-card/type';
6
8
  export interface SecuredFieldsProviderProps extends SecuredFieldsCallback {
7
- children: ReactNode;
8
- sessionMode: SessionMode;
9
9
  i18n: I18n;
10
10
  supportedCardBrands: string[];
11
+ sessionMode?: SessionMode;
12
+ /** 包裹的子元素,如果传了targetElement,就不需要传这个 */
13
+ children?: ReactNode;
14
+ targetElement?: HTMLElement;
15
+ style?: InputStylesConfig;
11
16
  }
12
17
  export interface SecuredFieldsProviderRef {
13
18
  payment: (formData: any) => void;
19
+ encryptCard: (encryptInfo: EncryptCardMessage) => void;
14
20
  reload: () => void;
21
+ validate: () => void;
22
+ setConfig: (config: {
23
+ style?: InputStylesConfig;
24
+ }) => void;
15
25
  }
16
26
  export interface SecuredFieldsCallback {
17
- onFocus: (data: Message<MessageAction.FOCUS>) => void;
18
- onBinValue: (data: Message<MessageAction.BIN_VALUE>) => void;
19
- onAfterPayment: (data: Message<MessageAction.AFTER_PAYMENT>) => void;
20
- onPaymentError: (data: Message<MessageAction.PAYMENT_ERROR>) => void;
21
- onPaymentTimeout: (data: Message<MessageAction.PAYMENT_TIMEOUT>) => void;
22
- onValidStatusChanged: (data: Message<MessageAction.VALID_STATUS_CHANGED>) => void;
23
- }
24
- export declare enum FieldType {
27
+ onFocus?: (data: Message<MessageAction.FOCUS>) => void;
28
+ onBinValue?: (data: Message<MessageAction.BIN_VALUE>) => void;
29
+ onBrand?: (data: Message<MessageAction.BRAND>) => void;
30
+ onAuthorized?: (data: Message<MessageAction.AUTHORIZED>) => void;
31
+ onActivated?: (data: Message<MessageAction.ACTIVATED>) => void;
32
+ onAfterPayment?: (data: Message<MessageAction.AFTER_PAYMENT>) => void;
33
+ onPaymentError?: (data: Message<MessageAction.PAYMENT_ERROR>) => void;
34
+ onPaymentTimeout?: (data: Message<MessageAction.PAYMENT_TIMEOUT>) => void;
35
+ onValidStatusChanged?: (data: Message<MessageAction.VALID_STATUS_CHANGED>) => void;
36
+ onCardEncrypted?: (data: Message<MessageAction.CARD_ENCRYPTED>) => void;
37
+ onCardEncryptionFailed?: (data: Message<MessageAction.CARD_ENCRYPTION_FAILED>) => void;
38
+ onValidated?: (data: Message<MessageAction.VALIDATED>) => void;
39
+ }
40
+ export declare enum EFieldType {
25
41
  CARD_NUMBER = "CARD_NUMBER",
26
42
  CVV = "CVV",
27
43
  EXPIRE_DATE = "EXPIRE_DATE"
28
44
  }
45
+ export type FieldType = keyof typeof EFieldType;
29
46
  export declare enum MessageAction {
30
47
  /** 通知 iframe 初始化 input */
31
48
  INIT = "init",
49
+ /** 表单 iframe DOM 已加载 */
50
+ ACTIVATED = "Activated",
51
+ /** 隐藏的 iframe 已经加载 */
52
+ HIDDEN_IFRAME_READY = "hiddenIframeReady",
32
53
  /** 是否聚焦 */
33
54
  FOCUS = "focus",
34
- /** 卡 bin 信息 */
55
+ /** 卡 bin 信息改变 */
35
56
  BIN_VALUE = "binValue",
57
+ /** 检测到卡品牌 */
58
+ BRAND = "brand",
36
59
  /** 传递验证通过信息(附带值) */
37
60
  VALID_WITH_VALUE = "validWithValue",
38
- /** 通知隐藏iframe进行支付 */
61
+ /** 通知隐藏 iframe 进行支付 */
39
62
  PAYMENT = "payment",
40
63
  /** 通知表单组件支付响应信息 */
41
64
  AFTER_PAYMENT = "afterPayment",
@@ -44,7 +67,24 @@ export declare enum MessageAction {
44
67
  /** 通知表单组件支付超时 */
45
68
  PAYMENT_TIMEOUT = "paymentTimeout",
46
69
  /** 通知表单项验证信息 */
47
- VALID_STATUS_CHANGED = "validStatusChanged"
70
+ VALID_STATUS_CHANGED = "validStatusChanged",
71
+ /** 通知表单项校验 */
72
+ VALIDATE = "validate",
73
+ /** 通知表单项校验结果 */
74
+ VALIDATED = "validated",
75
+ /** 通知表单项配置 */
76
+ SET_CONFIG = "setConfig",
77
+ /**
78
+ * frames
79
+ */
80
+ /** 通知 clientKey 已校验 */
81
+ AUTHORIZED = "authorized",
82
+ /** 通知隐藏 iframe 加密卡信息 */
83
+ ENCRYPT_CARD = "encryptCard",
84
+ /** 通知加密后的卡信息 */
85
+ CARD_ENCRYPTED = "cardEncrypted",
86
+ /** 通知卡信息加密错误 */
87
+ CARD_ENCRYPTION_FAILED = "cardEncryptionFailed"
48
88
  }
49
89
  export interface SecuredFieldConfig extends FieldIframeConfig, SecuredFieldsCallback {
50
90
  rootNode: HTMLElement;
@@ -54,11 +94,11 @@ export interface SecuredFieldConfig extends FieldIframeConfig, SecuredFieldsCall
54
94
  hiddenIframe: HTMLIFrameElement;
55
95
  }
56
96
  export interface FieldIframeConfig {
57
- fieldType: FieldType;
97
+ fieldType: EFieldType;
58
98
  placeholder: string;
59
- style: CSSProperties;
60
99
  hiddenIframeName: string;
61
100
  supportedCardBrands: string[];
101
+ style?: InputStylesConfig;
62
102
  }
63
103
  /**
64
104
  * message data
@@ -76,6 +116,16 @@ type MessageMapping = {
76
116
  [MessageAction.PAYMENT_ERROR]: PaymentErrorMessage;
77
117
  [MessageAction.PAYMENT_TIMEOUT]: PaymentTimeoutMessage;
78
118
  [MessageAction.VALID_STATUS_CHANGED]: ValidStatusChangedMessage;
119
+ [MessageAction.ENCRYPT_CARD]: EncryptCardMessage;
120
+ [MessageAction.CARD_ENCRYPTED]: CardEncryptedMessage;
121
+ [MessageAction.CARD_ENCRYPTION_FAILED]: CardEncryptionFailedMessage;
122
+ [MessageAction.AUTHORIZED]: AuthorizedMessage;
123
+ [MessageAction.BRAND]: BrandMessage;
124
+ [MessageAction.ACTIVATED]: ActivatedMessage;
125
+ [MessageAction.HIDDEN_IFRAME_READY]: {};
126
+ [MessageAction.VALIDATE]: {};
127
+ [MessageAction.VALIDATED]: ValidatedMessage;
128
+ [MessageAction.SET_CONFIG]: SetConfigMessage;
79
129
  };
80
130
  export interface InitMessage {
81
131
  config?: FieldIframeConfig;
@@ -86,22 +136,23 @@ export interface InitMessage {
86
136
  }
87
137
  export interface FocusMessage {
88
138
  focus: boolean;
89
- fieldType: FieldType;
139
+ fieldType: EFieldType;
90
140
  }
91
141
  export interface InvalidMessage {
92
142
  errorTip: string;
93
- fieldType: FieldType;
143
+ fieldType: EFieldType;
94
144
  }
95
145
  export interface ValidMessage {
96
- fieldType: FieldType;
146
+ fieldType: EFieldType;
97
147
  }
98
148
  export interface BinValueMessage {
99
149
  binValue: string;
100
- fieldType: FieldType;
150
+ fieldType: EFieldType;
151
+ brand?: CardBrand;
101
152
  }
102
153
  export interface ValidWithValueMessage {
103
154
  value: string;
104
- fieldType: FieldType;
155
+ fieldType: EFieldType;
105
156
  }
106
157
  export interface PaymentMessage {
107
158
  formData: any;
@@ -119,11 +170,41 @@ export interface PaymentErrorMessage {
119
170
  export interface ValidStatusChangedMessage {
120
171
  status: FormValidationStatus;
121
172
  errorTip?: string;
122
- fieldType: FieldType;
173
+ fieldType: EFieldType;
123
174
  }
124
175
  export interface PaymentTimeoutMessage {
125
176
  message?: string;
126
177
  }
178
+ export interface CardEncryptedMessage {
179
+ encryptedInfo: EncryptCardRes;
180
+ }
181
+ export interface CardEncryptionFailedMessage {
182
+ error: {
183
+ message: string;
184
+ code: string;
185
+ };
186
+ }
187
+ export interface AuthorizedMessage {
188
+ success: boolean;
189
+ }
190
+ export interface BrandMessage {
191
+ brand?: CardBrand;
192
+ fieldType: EFieldType;
193
+ }
194
+ export interface EncryptCardMessage {
195
+ merchantId: string;
196
+ clientKey: string;
197
+ }
198
+ export interface ActivatedMessage {
199
+ fieldType: EFieldType;
200
+ }
201
+ export interface ValidatedMessage {
202
+ status: FormValidationStatus;
203
+ fieldType: EFieldType;
204
+ }
205
+ export interface SetConfigMessage {
206
+ style?: InputStylesConfig;
207
+ }
127
208
  export declare const SECURED_FILED_ATTR = "data-sf";
128
209
  export declare const SECURED_IFRAME_CLASS_NAME = "secured-iframe";
129
210
  export declare const HIDDEN_IFRAME_NAME = "hidden-pay-iframe";
@@ -1,15 +1,19 @@
1
- import { FieldType, MessageAction, type Message } from '../SecuredFieldsProvider/type';
1
+ import { EFieldType, MessageAction, type Message } from '../SecuredFieldsProvider/type';
2
2
  export declare const useSecuredInput: () => {
3
3
  value: import("preact/hooks").MutableRef<string>;
4
4
  cardBin: string;
5
5
  initSecuredInput: (options: {
6
- fieldType: FieldType;
6
+ fieldType: EFieldType;
7
7
  supportedCardBrands: string[];
8
8
  sendMessage: (message: Message<MessageAction>) => void;
9
9
  }) => void;
10
10
  getConfigByFieldType: () => {
11
11
  maxLength: number;
12
+ inputMode: string;
12
13
  onInput: (event: Event) => void;
13
14
  validator: () => boolean;
14
15
  };
16
+ getCurrCardBrand: (realValue: string) => import("../../utils/card-brand/brands").CardBrandConfig | undefined;
17
+ brand: "VISA" | "MASTER_CARD" | "JCB" | "AMEX" | "DINERS_CLUB" | "DISCOVER" | undefined;
18
+ validate: () => boolean | void;
15
19
  };
@@ -1,9 +1,5 @@
1
- import type { LocaleKey } from '../../i18n';
2
1
  import type { FormValidateError } from '../internal/Form';
3
2
  export interface SepaProps {
4
- sessionId: string;
5
- clientKey?: string;
6
- i18n?: LocaleKey;
7
3
  onSubmit?: (formValidateError?: Recordable<FormValidateError[]>) => void;
8
4
  onSuccess?: (returnUrl?: string) => void;
9
5
  onError?: (error: any) => void;
@@ -1,10 +1,6 @@
1
1
  import type { PayRes } from '../../api';
2
- import type { LocaleKey } from '../../i18n';
3
2
  import type { FormValidateError } from '../internal/Form';
4
3
  export interface WechatPayProps {
5
- sessionId: string;
6
- clientKey?: string;
7
- i18n?: LocaleKey;
8
4
  onSubmit?: (formValidateError?: Recordable<FormValidateError[]>) => void;
9
5
  onSuccess?: (...args: any[]) => void;
10
6
  onError?: (error: any) => void;
@@ -15,3 +15,5 @@ export * from './GooglePay';
15
15
  export * from './SecuredIframe';
16
16
  export * from './Sepa';
17
17
  export * from './CardIBANField';
18
+ export * from './EncryptedCard';
19
+ export * from './CombinedEncryptedField';
@@ -1,5 +1,5 @@
1
1
  import './form-item.scss';
2
- import type { FormItemProps, FormItemRef } from './type';
2
+ import { type FormItemProps, type FormItemRef } from './type';
3
3
  export declare const FormItem: import("preact").FunctionalComponent<import("preact/compat").PropsWithoutRef<FormItemProps> & {
4
4
  ref?: import("preact").Ref<FormItemRef> | undefined;
5
5
  }>;
@@ -38,6 +38,7 @@ export interface FormItemProps extends CustomAttributes<HTMLDivElement> {
38
38
  triggersOfEmptyValue?: FormRuleTrigger[];
39
39
  onValidationStatusChange?: (status: FormValidationStatus) => void;
40
40
  showErrorMessage?: boolean;
41
+ showLabel?: boolean;
41
42
  }
42
43
  export interface FormItemRef {
43
44
  validate: (value: string, options: {
@@ -48,3 +49,9 @@ export interface FormItemRef {
48
49
  getValidateResult: () => FormValidationResult;
49
50
  resetValidation: (status?: FormValidationStatus, errors?: FormValidateError[]) => FormValidationResult;
50
51
  }
52
+ export declare const formItemBEM: {
53
+ bem: (el?: Nil | (string | Recordable<any>) | (Nil | (string | Recordable<any>))[], mods?: Nil | (string | Recordable<any>) | (Nil | (string | Recordable<any>))[]) => string;
54
+ bemWithoutEl: (el?: Nil | (string | Recordable<any>) | (Nil | (string | Recordable<any>))[], mods?: Nil | (string | Recordable<any>) | (Nil | (string | Recordable<any>))[]) => string;
55
+ };
56
+ export declare const formItemLabelClassName: string;
57
+ export declare const formItemErrorMessageClassName: string;
@@ -1,5 +1,5 @@
1
1
  import './input.scss';
2
- import type { InputProps, InputRef } from './type';
2
+ import { type InputProps, type InputRef } from './type';
3
3
  export declare const Input: import("preact").FunctionalComponent<import("preact/compat").PropsWithoutRef<InputProps> & {
4
4
  ref?: import("preact").Ref<InputRef> | undefined;
5
5
  }>;
@@ -5,6 +5,7 @@ export interface InputProps extends HTMLAttributes<HTMLInputElement>, CustomAttr
5
5
  status?: 'error' | 'success';
6
6
  placeholder?: string;
7
7
  rightIcon?: ReactNode;
8
+ leftIcon?: ReactNode;
8
9
  inputClassName?: string;
9
10
  onCompositionStart?: (e: CompositionEvent) => void;
10
11
  }
@@ -13,3 +14,8 @@ export interface InputRef {
13
14
  focus: () => void;
14
15
  blur: () => void;
15
16
  }
17
+ export declare const inputBEM: {
18
+ bem: (el?: Nil | (string | Recordable<any>) | (Nil | (string | Recordable<any>))[], mods?: Nil | (string | Recordable<any>) | (Nil | (string | Recordable<any>))[]) => string;
19
+ bemWithoutEl: (el?: Nil | (string | Recordable<any>) | (Nil | (string | Recordable<any>))[], mods?: Nil | (string | Recordable<any>) | (Nil | (string | Recordable<any>))[]) => string;
20
+ };
21
+ export declare const inputWrapperClassName: string;
@@ -1,11 +1,18 @@
1
- import { type RadarEnv } from "./types";
1
+ import { type LocaleKeyType } from "./i18n";
2
+ import { type FraudDetectionEnv } from "./types";
2
3
  export declare let apiUrl: string;
3
4
  export declare let cdnOrigin: any;
4
5
  export declare let cdnDir: any;
5
6
  export declare let cdnUrl: string;
6
- export declare let radarEnv: RadarEnv | undefined;
7
+ export declare let fraudDetectionEnv: FraudDetectionEnv | undefined;
7
8
  export declare let customReqHeaders: Recordable;
9
+ export declare let customLocale: LocaleKeyType | undefined;
10
+ export declare let hidePaymentButton: boolean;
8
11
  export declare function setApiUrl(url: string): void;
9
12
  export declare function setCDNUrl(url: string): void;
10
- export declare function setRadarEnv(env: RadarEnv): void;
13
+ export declare function setFraudDetectionEnv(env: FraudDetectionEnv): void;
11
14
  export declare function setCustomReqHeaders(headers: Recordable): void;
15
+ export declare function setCustomLocale(locale: LocaleKeyType): void;
16
+ export declare function setCheckoutConfig(params: {
17
+ hidePaymentButton?: boolean;
18
+ }): void;
@@ -16,6 +16,7 @@ export declare enum PaymentMethod {
16
16
  BOC = "BOC",
17
17
  SEPA_DEBIT = "SEPA_DEBIT"
18
18
  }
19
+ export declare const CardPaymentMethods: PaymentMethod[];
19
20
  export declare enum PaymentType {
20
21
  PURCHASE = "PURCHASE",
21
22
  PREPARE_AUTHORIZE = "PREPARE_AUTHORIZE",
@@ -0,0 +1,12 @@
1
+ import type { ComponentType, JSX } from 'preact';
2
+ import type { PayKKaInitConfiguration } from '../types';
3
+ import { Session } from './Session';
4
+ export declare class PayKKaCheckout {
5
+ private readonly config;
6
+ private static session?;
7
+ private static instance;
8
+ constructor(config: PayKKaInitConfiguration);
9
+ private init;
10
+ static getSession(): Session | undefined;
11
+ create<P extends Recordable>(component: ComponentType<P> | ((props: P) => JSX.Element), props?: Partial<P> | null): import("./create").ComponentInst<P>;
12
+ }
@@ -2,3 +2,4 @@ export * from './context';
2
2
  export * from './create';
3
3
  export * from './Session';
4
4
  export * from './query';
5
+ export * from './PayKKaCheckout';
@@ -1,2 +1,2 @@
1
- import { type CheckoutRes, type RequestOptions, type QueryCheckoutParams } from '../api';
2
- export declare function querySession({ sessionId, clientKey }: QueryCheckoutParams, options?: RequestOptions): Promise<CheckoutRes>;
1
+ import { type RequestOptions, type QueryCheckoutParams } from '../api';
2
+ export declare function querySession({ sessionId, clientKey }: QueryCheckoutParams, options?: RequestOptions): Promise<import("../api").CheckoutRes>;
@@ -1,4 +1,4 @@
1
- import { I18n, LocaleKey } from '../i18n';
2
- export declare function useI18n(locale?: LocaleKey): {
1
+ import { I18n, type LocaleKeyType } from '../i18n';
2
+ export declare function useI18n(locale?: LocaleKeyType): {
3
3
  i18n: I18n;
4
4
  };
@@ -1,11 +1,6 @@
1
1
  import type { SubmitButtonStatus } from '../components';
2
2
  import { Session } from '../core';
3
- import type { LocaleKey } from '../i18n';
4
- export declare function usePayState(props: {
5
- i18n?: LocaleKey;
6
- sessionId: string;
7
- clientKey?: string;
8
- }): {
3
+ export declare function usePayState(): {
9
4
  validated: boolean;
10
5
  setValidated: import("preact/hooks").Dispatch<import("preact/hooks").StateUpdater<boolean>>;
11
6
  submitButtonStatus: SubmitButtonStatus;
@@ -17,21 +12,8 @@ export declare function usePayState(props: {
17
12
  sessionReady: boolean;
18
13
  setSessionReady: import("preact/hooks").Dispatch<import("preact/hooks").StateUpdater<boolean>>;
19
14
  i18n: import("../i18n").I18n;
20
- payKKaRadar: {
21
- "__#3@#PayKKaRadar": {
22
- s: string;
23
- };
24
- "__#3@#collMap": {
25
- STRIPE_RADAR: () => Promise<unknown>;
26
- };
27
- "__#3@#p": Promise<unknown[]> | undefined;
28
- "__#3@#realMode": "STRIPE_RADAR"[];
29
- "__#3@#keyMap": {
30
- STRIPE_RADAR?: string | undefined;
31
- };
32
- "__#3@#transferRes"(): string;
33
- readonly radarId: string;
34
- "__#3@#stripeRadarColl"(): Promise<unknown>;
35
- createPayKKaRadar(): Promise<void>;
15
+ fraudDetection: {
16
+ fraudDetectionID: string;
17
+ createFraudDetection: () => Promise<void>;
36
18
  } | null;
37
19
  };
@@ -1,17 +1,18 @@
1
- import type { LocaleKey, Translation } from './locales';
1
+ import type { LocaleKeyType, Translation } from './locales';
2
2
  import { Signal } from '@preact/signals';
3
3
  export declare class I18n {
4
4
  /** 语言 */
5
- locale: LocaleKey;
5
+ locale: LocaleKeyType;
6
6
  /** 翻译文案 */
7
7
  translation?: Translation;
8
8
  /** 加载文案完成标识 */
9
- ready: Signal<boolean>;
9
+ private isReady;
10
10
  /** 当前正在加载的id标识 */
11
11
  private currentLoadId;
12
12
  private static instance;
13
- constructor(locale?: LocaleKey);
13
+ constructor();
14
14
  get(key: keyof Translation): string;
15
+ get ready(): Signal<boolean>;
15
16
  /** 加载国际化翻译文案 */
16
- load(locale?: LocaleKey): void;
17
+ load(locale?: LocaleKeyType): void;
17
18
  }
@@ -25,4 +25,5 @@ export declare enum LocaleKey {
25
25
  /** 中文(台湾) */
26
26
  zhTW = "zh-TW"
27
27
  }
28
+ export type LocaleKeyType = LocaleKey | `${LocaleKey}`;
28
29
  export default locales;
@@ -1,5 +1,5 @@
1
1
  export * from './components';
2
- export { type ComponentInst, create, querySession, Session } from './core';
3
- export { I18n } from './i18n';
4
- export { setApiUrl, setCDNUrl, setRadarEnv, setCustomReqHeaders } from './config';
2
+ export { type ComponentInst, create, querySession, Session, PayKKaCheckout } from './core';
3
+ export { I18n, LocaleKey } from './i18n';
4
+ export { setApiUrl, setCDNUrl, setFraudDetectionEnv, setCustomReqHeaders, setCustomLocale, setCheckoutConfig } from './config';
5
5
  export { getFingerprint } from './utils';
@@ -0,0 +1,9 @@
1
+ import { type CollModeType, type envType } from '../types';
2
+ type FraudDetectionType = {
3
+ fraudDetectionID: string;
4
+ createFraudDetection: () => Promise<void>;
5
+ };
6
+ export default function getFraudDetectionInstance(env?: envType | {
7
+ [k in CollModeType]?: string;
8
+ }, mode?: CollModeType[]): FraudDetectionType;
9
+ export {};
@@ -1,8 +1,9 @@
1
1
  export type envType = 'eu' | 'hk' | 'us';
2
2
  export declare const enum ECollMode {
3
- STRIPE_RADAR = "STRIPE_RADAR"
3
+ /** Stripe Radar */
4
+ SR = "SR"
4
5
  }
5
6
  export type CollModeType = keyof typeof ECollMode;
6
- export type RadarEnv = envType | {
7
+ export type FraudDetectionEnv = envType | {
7
8
  [k in CollModeType]?: string;
8
9
  };