@globalpayments/js 4.1.19 → 4.1.21
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.
- package/README.md +1 -1
- package/package.json +2 -2
- package/types/apm/enums.d.ts +15 -0
- package/types/apm/non-card-payments/bnpl-for-apex-data.d.ts +4 -0
- package/types/apm/non-card-payments/contracts.d.ts +1 -0
- package/types/internal/built-in-validations/helpers.d.ts +1 -0
- package/types/internal/lib/enums.d.ts +10 -2
- package/types/internal/lib/styles/default.d.ts +26 -0
- package/types/internal/lib/styles/gp-default.d.ts +27 -1
- package/types/internal/lib/styles/gp-default2.d.ts +27 -1
- package/types/internal/lib/styles/installments/common.d.ts +1 -1
- package/types/internal/lib/styles/installments/default.d.ts +1 -1
- package/types/internal/lib/styles/installments/gp-default.d.ts +1 -1
- package/types/internal/lib/styles/installments/simple.d.ts +1 -1
- package/types/internal/lib/styles/payment-methods/common.d.ts +26 -0
- package/types/internal/lib/styles/payment-methods/open-banking.d.ts +26 -0
- package/types/internal/lib/styles/themes/brand-themes/base/base-theme.d.ts +27 -1
- package/types/lib/version.d.ts +1 -1
- package/types/ui/form/index.d.ts +184 -117
- package/types/internal/lib/installments/components/add-issuer-banner.d.ts +0 -2
- package/types/internal/lib/installments/installments-handler.d.ts +0 -48
- package/types/internal/lib/installments/templates/create-step-0.d.ts +0 -3
- package/types/internal/lib/installments/templates/create-step-1.d.ts +0 -3
- package/types/internal/lib/installments/templates/modals.d.ts +0 -6
package/README.md
CHANGED
|
@@ -24,7 +24,7 @@ This plugin allows you to use online payments (eCommerce) features of a variety
|
|
|
24
24
|
## Usage
|
|
25
25
|
|
|
26
26
|
```html
|
|
27
|
-
<script src="https://js.globalpay.com/4.1.
|
|
27
|
+
<script src="https://js.globalpay.com/4.1.21/globalpayments.js"></script>
|
|
28
28
|
```
|
|
29
29
|
|
|
30
30
|
> Note: Installing via NPM will only provide TypeScript types for type-checking.
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@globalpayments/js",
|
|
3
|
-
"version": "4.1.
|
|
3
|
+
"version": "4.1.21",
|
|
4
4
|
"author": "Heartland Developer Portal <developers@heartland.us>",
|
|
5
5
|
"license": "GPL-2.0",
|
|
6
6
|
"repository": {
|
|
@@ -27,7 +27,7 @@
|
|
|
27
27
|
},
|
|
28
28
|
"cross-os": {
|
|
29
29
|
"postbuild-cross": {
|
|
30
|
-
"linux": "cp -
|
|
30
|
+
"linux": "cp -Rv src/assets/* dist && node bin/replace-gp-ref.js",
|
|
31
31
|
"win32": "xcopy src\\assets dist\\ /e/y/h && node bin/replace-gp-ref.js"
|
|
32
32
|
},
|
|
33
33
|
"test-cross": {
|
package/types/apm/enums.d.ts
CHANGED
|
@@ -8,3 +8,18 @@ export declare const enum QRCodePaymentsActions {
|
|
|
8
8
|
RedirectInFrameAction = "REDIRECT_IN_FRAME",
|
|
9
9
|
PresentQRCodeAction = "PRESENT_QR_CODE"
|
|
10
10
|
}
|
|
11
|
+
export declare const enum BnplCountries {
|
|
12
|
+
US = "US",
|
|
13
|
+
AU = "AU",
|
|
14
|
+
NZ = "NZ",
|
|
15
|
+
EU = "EU",
|
|
16
|
+
NO = "NO",
|
|
17
|
+
CH = "CH",
|
|
18
|
+
UK = "UK",
|
|
19
|
+
CA = "CA",
|
|
20
|
+
HK = "HK",
|
|
21
|
+
IN = "IN",
|
|
22
|
+
IL = "IL",
|
|
23
|
+
BZ = "BZ",
|
|
24
|
+
MX = "MX"
|
|
25
|
+
}
|
|
@@ -8,3 +8,4 @@ export declare const removeValidationRoundCounter: () => void;
|
|
|
8
8
|
export declare const isOpenBankingAvailable: (countryCode: string | undefined, aquirer: string | undefined) => boolean;
|
|
9
9
|
export declare const isBlikAvailable: (countryCode: string | undefined, currencyCode: string | undefined, options: IApmConfiguration | undefined) => boolean;
|
|
10
10
|
export declare const isExpressPayAvailable: (options: IApmConfiguration | undefined) => boolean | undefined;
|
|
11
|
+
export declare const getAvailableOptionsForBnpl: (countryCode: string | undefined, options: IApmConfiguration | undefined) => any;
|
|
@@ -12,7 +12,11 @@ export declare enum Apm {
|
|
|
12
12
|
PayPal = "paypal",
|
|
13
13
|
QRCodePayments = "qr-code-payments",
|
|
14
14
|
Blik = "blik",
|
|
15
|
-
ExpressPay = "express-pay"
|
|
15
|
+
ExpressPay = "express-pay",
|
|
16
|
+
Affirm = "affirm",
|
|
17
|
+
Klarna = "klarna",
|
|
18
|
+
Sezzle = "sezzle",
|
|
19
|
+
Zip = "zip"
|
|
16
20
|
}
|
|
17
21
|
export declare enum ApmEvents {
|
|
18
22
|
PaymentMethodActionDetail = "apm-action-details",
|
|
@@ -54,7 +58,11 @@ export declare enum ApmProviders {
|
|
|
54
58
|
PayPal = "PayPal",
|
|
55
59
|
WeChat = "WeChat",
|
|
56
60
|
Blik = "blik",
|
|
57
|
-
ExpressPay = "ExpressPay"
|
|
61
|
+
ExpressPay = "ExpressPay",
|
|
62
|
+
Affirm = "Affirm",
|
|
63
|
+
Klarna = "Klarna",
|
|
64
|
+
Sezzle = "Sezzle",
|
|
65
|
+
Zip = "Zip"
|
|
58
66
|
}
|
|
59
67
|
export declare enum QRCodePaymentsWeChatProviderBrands {
|
|
60
68
|
WeChatBrand = "WeChat",
|
|
@@ -470,6 +470,32 @@ export declare const parentStyles: (assetBaseUrl: string) => {
|
|
|
470
470
|
".secure-payment-form .express-pay-button::after": {
|
|
471
471
|
content: string;
|
|
472
472
|
};
|
|
473
|
+
".secure-payment-form .affirm-button, .secure-payment-form .klarna-button, .secure-payment-form .sezzle-button, .secure-payment-form .zip-button": {
|
|
474
|
+
background: string;
|
|
475
|
+
position: string;
|
|
476
|
+
color: string;
|
|
477
|
+
height: string;
|
|
478
|
+
width: string;
|
|
479
|
+
"border-radius": string;
|
|
480
|
+
border: string;
|
|
481
|
+
margin: string;
|
|
482
|
+
cursor: string;
|
|
483
|
+
};
|
|
484
|
+
".secure-payment-form .affirm-button:hover, .secure-payment-form .klarna-button:hover, .secure-payment-form .sezzle-button:hover, .secure-payment-form .zip-button:hover": {
|
|
485
|
+
"border-color": string;
|
|
486
|
+
"background-color": string;
|
|
487
|
+
};
|
|
488
|
+
".secure-payment-form .affirm-button:focus, .secure-payment-form .klarna-button:focus, .secure-payment-form .sezzle-button:focus, .secure-payment-form .zip-button:focus": {
|
|
489
|
+
outline: string;
|
|
490
|
+
"outline-offset": string;
|
|
491
|
+
};
|
|
492
|
+
".secure-payment-form .affirm-button::before, .secure-payment-form .klarna-button::before, .secure-payment-form .sezzle-button::before, .secure-payment-form .zip-button::before": {
|
|
493
|
+
width: string;
|
|
494
|
+
height: string;
|
|
495
|
+
position: string;
|
|
496
|
+
top: string;
|
|
497
|
+
right: string;
|
|
498
|
+
};
|
|
473
499
|
".secure-payment-form .link-button": {
|
|
474
500
|
display: string;
|
|
475
501
|
"flex-direction": string;
|
|
@@ -434,6 +434,32 @@ export declare const parentStyles: (assetBaseUrl: string, theme?: string | undef
|
|
|
434
434
|
".secure-payment-form .express-pay-button::after": {
|
|
435
435
|
content: string;
|
|
436
436
|
};
|
|
437
|
+
".secure-payment-form .affirm-button, .secure-payment-form .klarna-button, .secure-payment-form .sezzle-button, .secure-payment-form .zip-button": {
|
|
438
|
+
background: string;
|
|
439
|
+
position: string;
|
|
440
|
+
color: string;
|
|
441
|
+
height: string;
|
|
442
|
+
width: string;
|
|
443
|
+
"border-radius": string;
|
|
444
|
+
border: string;
|
|
445
|
+
margin: string;
|
|
446
|
+
cursor: string;
|
|
447
|
+
};
|
|
448
|
+
".secure-payment-form .affirm-button:hover, .secure-payment-form .klarna-button:hover, .secure-payment-form .sezzle-button:hover, .secure-payment-form .zip-button:hover": {
|
|
449
|
+
"border-color": string;
|
|
450
|
+
"background-color": string;
|
|
451
|
+
};
|
|
452
|
+
".secure-payment-form .affirm-button:focus, .secure-payment-form .klarna-button:focus, .secure-payment-form .sezzle-button:focus, .secure-payment-form .zip-button:focus": {
|
|
453
|
+
outline: string;
|
|
454
|
+
"outline-offset": string;
|
|
455
|
+
};
|
|
456
|
+
".secure-payment-form .affirm-button::before, .secure-payment-form .klarna-button::before, .secure-payment-form .sezzle-button::before, .secure-payment-form .zip-button::before": {
|
|
457
|
+
width: string;
|
|
458
|
+
height: string;
|
|
459
|
+
position: string;
|
|
460
|
+
top: string;
|
|
461
|
+
right: string;
|
|
462
|
+
};
|
|
437
463
|
".secure-payment-form .link-button": {
|
|
438
464
|
display: string;
|
|
439
465
|
"flex-direction": string;
|
|
@@ -1053,7 +1079,7 @@ export declare const parentStyles: (assetBaseUrl: string, theme?: string | undef
|
|
|
1053
1079
|
"font-size": string;
|
|
1054
1080
|
"font-weight": string;
|
|
1055
1081
|
};
|
|
1056
|
-
".secure-payment-form .payment-
|
|
1082
|
+
".secure-payment-form .payment-options": {
|
|
1057
1083
|
display: string;
|
|
1058
1084
|
"flex-direction": string;
|
|
1059
1085
|
gap: string;
|
|
@@ -433,6 +433,32 @@ export declare const parentStyles: (assetBaseUrl: string, theme?: string | undef
|
|
|
433
433
|
".secure-payment-form .express-pay-button::after": {
|
|
434
434
|
content: string;
|
|
435
435
|
};
|
|
436
|
+
".secure-payment-form .affirm-button, .secure-payment-form .klarna-button, .secure-payment-form .sezzle-button, .secure-payment-form .zip-button": {
|
|
437
|
+
background: string;
|
|
438
|
+
position: string;
|
|
439
|
+
color: string;
|
|
440
|
+
height: string;
|
|
441
|
+
width: string;
|
|
442
|
+
"border-radius": string;
|
|
443
|
+
border: string;
|
|
444
|
+
margin: string;
|
|
445
|
+
cursor: string;
|
|
446
|
+
};
|
|
447
|
+
".secure-payment-form .affirm-button:hover, .secure-payment-form .klarna-button:hover, .secure-payment-form .sezzle-button:hover, .secure-payment-form .zip-button:hover": {
|
|
448
|
+
"border-color": string;
|
|
449
|
+
"background-color": string;
|
|
450
|
+
};
|
|
451
|
+
".secure-payment-form .affirm-button:focus, .secure-payment-form .klarna-button:focus, .secure-payment-form .sezzle-button:focus, .secure-payment-form .zip-button:focus": {
|
|
452
|
+
outline: string;
|
|
453
|
+
"outline-offset": string;
|
|
454
|
+
};
|
|
455
|
+
".secure-payment-form .affirm-button::before, .secure-payment-form .klarna-button::before, .secure-payment-form .sezzle-button::before, .secure-payment-form .zip-button::before": {
|
|
456
|
+
width: string;
|
|
457
|
+
height: string;
|
|
458
|
+
position: string;
|
|
459
|
+
top: string;
|
|
460
|
+
right: string;
|
|
461
|
+
};
|
|
436
462
|
".secure-payment-form .link-button": {
|
|
437
463
|
display: string;
|
|
438
464
|
"flex-direction": string;
|
|
@@ -1052,7 +1078,7 @@ export declare const parentStyles: (assetBaseUrl: string, theme?: string | undef
|
|
|
1052
1078
|
"font-size": string;
|
|
1053
1079
|
"font-weight": string;
|
|
1054
1080
|
};
|
|
1055
|
-
".secure-payment-form .payment-
|
|
1081
|
+
".secure-payment-form .payment-options": {
|
|
1056
1082
|
display: string;
|
|
1057
1083
|
"flex-direction": string;
|
|
1058
1084
|
gap: string;
|
|
@@ -55,7 +55,7 @@ declare const styles: (assetBaseUrl: string) => {
|
|
|
55
55
|
"font-size": string;
|
|
56
56
|
"font-weight": string;
|
|
57
57
|
};
|
|
58
|
-
".secure-payment-form .payment-
|
|
58
|
+
".secure-payment-form .payment-options": {
|
|
59
59
|
display: string;
|
|
60
60
|
"flex-direction": string;
|
|
61
61
|
gap: string;
|
|
@@ -55,7 +55,7 @@ declare const styles: (assetBaseUrl: string) => {
|
|
|
55
55
|
"font-size": string;
|
|
56
56
|
"font-weight": string;
|
|
57
57
|
};
|
|
58
|
-
".secure-payment-form .payment-
|
|
58
|
+
".secure-payment-form .payment-options": {
|
|
59
59
|
display: string;
|
|
60
60
|
"flex-direction": string;
|
|
61
61
|
gap: string;
|
|
@@ -55,7 +55,7 @@ declare const styles: (assetBaseUrl: string) => {
|
|
|
55
55
|
"font-size": string;
|
|
56
56
|
"font-weight": string;
|
|
57
57
|
};
|
|
58
|
-
".secure-payment-form .payment-
|
|
58
|
+
".secure-payment-form .payment-options": {
|
|
59
59
|
display: string;
|
|
60
60
|
"flex-direction": string;
|
|
61
61
|
gap: string;
|
|
@@ -55,7 +55,7 @@ declare const styles: (assetBaseUrl: string) => {
|
|
|
55
55
|
"font-size": string;
|
|
56
56
|
"font-weight": string;
|
|
57
57
|
};
|
|
58
|
-
".secure-payment-form .payment-
|
|
58
|
+
".secure-payment-form .payment-options": {
|
|
59
59
|
display: string;
|
|
60
60
|
"flex-direction": string;
|
|
61
61
|
gap: string;
|
|
@@ -229,6 +229,32 @@ declare const _default: (assetBaseUrl: string) => {
|
|
|
229
229
|
".secure-payment-form .express-pay-button::after": {
|
|
230
230
|
content: string;
|
|
231
231
|
};
|
|
232
|
+
".secure-payment-form .affirm-button, .secure-payment-form .klarna-button, .secure-payment-form .sezzle-button, .secure-payment-form .zip-button": {
|
|
233
|
+
background: string;
|
|
234
|
+
position: string;
|
|
235
|
+
color: string;
|
|
236
|
+
height: string;
|
|
237
|
+
width: string;
|
|
238
|
+
"border-radius": string;
|
|
239
|
+
border: string;
|
|
240
|
+
margin: string;
|
|
241
|
+
cursor: string;
|
|
242
|
+
};
|
|
243
|
+
".secure-payment-form .affirm-button:hover, .secure-payment-form .klarna-button:hover, .secure-payment-form .sezzle-button:hover, .secure-payment-form .zip-button:hover": {
|
|
244
|
+
"border-color": string;
|
|
245
|
+
"background-color": string;
|
|
246
|
+
};
|
|
247
|
+
".secure-payment-form .affirm-button:focus, .secure-payment-form .klarna-button:focus, .secure-payment-form .sezzle-button:focus, .secure-payment-form .zip-button:focus": {
|
|
248
|
+
outline: string;
|
|
249
|
+
"outline-offset": string;
|
|
250
|
+
};
|
|
251
|
+
".secure-payment-form .affirm-button::before, .secure-payment-form .klarna-button::before, .secure-payment-form .sezzle-button::before, .secure-payment-form .zip-button::before": {
|
|
252
|
+
width: string;
|
|
253
|
+
height: string;
|
|
254
|
+
position: string;
|
|
255
|
+
top: string;
|
|
256
|
+
right: string;
|
|
257
|
+
};
|
|
232
258
|
".secure-payment-form .link-button": {
|
|
233
259
|
display: string;
|
|
234
260
|
"flex-direction": string;
|
|
@@ -93,5 +93,31 @@ declare const styles: (assetBaseUrl: string) => {
|
|
|
93
93
|
".secure-payment-form .express-pay-button::after": {
|
|
94
94
|
content: string;
|
|
95
95
|
};
|
|
96
|
+
".secure-payment-form .affirm-button, .secure-payment-form .klarna-button, .secure-payment-form .sezzle-button, .secure-payment-form .zip-button": {
|
|
97
|
+
background: string;
|
|
98
|
+
position: string;
|
|
99
|
+
color: string;
|
|
100
|
+
height: string;
|
|
101
|
+
width: string;
|
|
102
|
+
"border-radius": string;
|
|
103
|
+
border: string;
|
|
104
|
+
margin: string;
|
|
105
|
+
cursor: string;
|
|
106
|
+
};
|
|
107
|
+
".secure-payment-form .affirm-button:hover, .secure-payment-form .klarna-button:hover, .secure-payment-form .sezzle-button:hover, .secure-payment-form .zip-button:hover": {
|
|
108
|
+
"border-color": string;
|
|
109
|
+
"background-color": string;
|
|
110
|
+
};
|
|
111
|
+
".secure-payment-form .affirm-button:focus, .secure-payment-form .klarna-button:focus, .secure-payment-form .sezzle-button:focus, .secure-payment-form .zip-button:focus": {
|
|
112
|
+
outline: string;
|
|
113
|
+
"outline-offset": string;
|
|
114
|
+
};
|
|
115
|
+
".secure-payment-form .affirm-button::before, .secure-payment-form .klarna-button::before, .secure-payment-form .sezzle-button::before, .secure-payment-form .zip-button::before": {
|
|
116
|
+
width: string;
|
|
117
|
+
height: string;
|
|
118
|
+
position: string;
|
|
119
|
+
top: string;
|
|
120
|
+
right: string;
|
|
121
|
+
};
|
|
96
122
|
};
|
|
97
123
|
export default styles;
|
|
@@ -572,6 +572,32 @@ declare const parentStyles: (assetBaseUrl: string, themePreset?: IThemePreset |
|
|
|
572
572
|
".secure-payment-form .express-pay-button::after": {
|
|
573
573
|
content: string;
|
|
574
574
|
};
|
|
575
|
+
".secure-payment-form .affirm-button, .secure-payment-form .klarna-button, .secure-payment-form .sezzle-button, .secure-payment-form .zip-button": {
|
|
576
|
+
background: string;
|
|
577
|
+
position: string;
|
|
578
|
+
color: string;
|
|
579
|
+
height: string;
|
|
580
|
+
width: string;
|
|
581
|
+
"border-radius": string;
|
|
582
|
+
border: string;
|
|
583
|
+
margin: string;
|
|
584
|
+
cursor: string;
|
|
585
|
+
};
|
|
586
|
+
".secure-payment-form .affirm-button:hover, .secure-payment-form .klarna-button:hover, .secure-payment-form .sezzle-button:hover, .secure-payment-form .zip-button:hover": {
|
|
587
|
+
"border-color": string;
|
|
588
|
+
"background-color": string;
|
|
589
|
+
};
|
|
590
|
+
".secure-payment-form .affirm-button:focus, .secure-payment-form .klarna-button:focus, .secure-payment-form .sezzle-button:focus, .secure-payment-form .zip-button:focus": {
|
|
591
|
+
outline: string;
|
|
592
|
+
"outline-offset": string;
|
|
593
|
+
};
|
|
594
|
+
".secure-payment-form .affirm-button::before, .secure-payment-form .klarna-button::before, .secure-payment-form .sezzle-button::before, .secure-payment-form .zip-button::before": {
|
|
595
|
+
width: string;
|
|
596
|
+
height: string;
|
|
597
|
+
position: string;
|
|
598
|
+
top: string;
|
|
599
|
+
right: string;
|
|
600
|
+
};
|
|
575
601
|
".secure-payment-form .link-button": {
|
|
576
602
|
display: string;
|
|
577
603
|
"flex-direction": string;
|
|
@@ -1191,7 +1217,7 @@ declare const parentStyles: (assetBaseUrl: string, themePreset?: IThemePreset |
|
|
|
1191
1217
|
"font-size": string;
|
|
1192
1218
|
"font-weight": string;
|
|
1193
1219
|
};
|
|
1194
|
-
".secure-payment-form .payment-
|
|
1220
|
+
".secure-payment-form .payment-options": {
|
|
1195
1221
|
display: string;
|
|
1196
1222
|
"flex-direction": string;
|
|
1197
1223
|
gap: string;
|
package/types/lib/version.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
declare const _default: "4.1.
|
|
1
|
+
declare const _default: "4.1.21";
|
|
2
2
|
export default _default;
|
package/types/ui/form/index.d.ts
CHANGED
|
@@ -143,12 +143,7 @@ export declare const fieldStyles: () => {
|
|
|
143
143
|
};
|
|
144
144
|
"img.card-number-icon.invalid.card-type-visa": {
|
|
145
145
|
background: string;
|
|
146
|
-
"background-size": string;
|
|
147
|
-
* Instantiates a new UIForm object for a group of hosted fields
|
|
148
|
-
*
|
|
149
|
-
* @param fields Hosted field configuration
|
|
150
|
-
* @param styles Custom CSS configuration
|
|
151
|
-
*/
|
|
146
|
+
"background-size": string;
|
|
152
147
|
"background-position-y": string;
|
|
153
148
|
};
|
|
154
149
|
"img.card-number-icon.valid.card-type-amex": {
|
|
@@ -160,6 +155,16 @@ export declare const fieldStyles: () => {
|
|
|
160
155
|
background: string;
|
|
161
156
|
"background-size": string;
|
|
162
157
|
"background-position-y": string;
|
|
158
|
+
/**
|
|
159
|
+
* Sets an event listener for an event type
|
|
160
|
+
*
|
|
161
|
+
* @param fieldTypeOrEventName The field type on which the listener should
|
|
162
|
+
* be applied, or the type of event that should trigger the listener
|
|
163
|
+
* @param eventNameOrListener The type of event that should trigger the
|
|
164
|
+
* listener, or the listener function
|
|
165
|
+
* @param listener The listener function when both field type and event type
|
|
166
|
+
* are provided
|
|
167
|
+
*/
|
|
163
168
|
width: string;
|
|
164
169
|
};
|
|
165
170
|
"img.card-number-icon.valid.card-type-jcb": {
|
|
@@ -466,12 +471,6 @@ export declare const fieldStyles: () => {
|
|
|
466
471
|
"background-position-y": string;
|
|
467
472
|
};
|
|
468
473
|
"img.card-number-icon.valid.card-type-mastercard": {
|
|
469
|
-
/**
|
|
470
|
-
* Instantiates a new UIForm object for a group of hosted fields
|
|
471
|
-
*
|
|
472
|
-
* @param fields Hosted field configuration
|
|
473
|
-
* @param styles Custom CSS configuration
|
|
474
|
-
*/
|
|
475
474
|
background: string;
|
|
476
475
|
"background-size": string;
|
|
477
476
|
"background-position": string;
|
|
@@ -617,9 +616,6 @@ export declare const fieldStyles: () => {
|
|
|
617
616
|
"background-image": string;
|
|
618
617
|
};
|
|
619
618
|
"img.card-number-icon.card-type-mastercard": {
|
|
620
|
-
/**
|
|
621
|
-
* Represents logic surrounding a group of hosted fields.
|
|
622
|
-
*/
|
|
623
619
|
"background-image": string;
|
|
624
620
|
};
|
|
625
621
|
"img.card-number-icon.card-type-visa": {
|
|
@@ -627,7 +623,12 @@ export declare const fieldStyles: () => {
|
|
|
627
623
|
};
|
|
628
624
|
"img.card-number-icon.card-type-diners": {
|
|
629
625
|
"background-image": string;
|
|
630
|
-
};
|
|
626
|
+
}; /**
|
|
627
|
+
* Instantiates a new UIForm object for a group of hosted fields
|
|
628
|
+
*
|
|
629
|
+
* @param fields Hosted field configuration
|
|
630
|
+
* @param styles Custom CSS configuration
|
|
631
|
+
*/
|
|
631
632
|
"img.card-number-icon.card-type-carnet": {
|
|
632
633
|
"background-image": string;
|
|
633
634
|
};
|
|
@@ -800,9 +801,6 @@ export declare const parentStyles: () => {
|
|
|
800
801
|
display: string;
|
|
801
802
|
"align-items": string;
|
|
802
803
|
"justify-content": string;
|
|
803
|
-
/**
|
|
804
|
-
* Represents logic surrounding a group of hosted fields.
|
|
805
|
-
*/
|
|
806
804
|
width: string;
|
|
807
805
|
};
|
|
808
806
|
".secure-payment-form .qr-code-expired-alert-message"?: {
|
|
@@ -935,6 +933,32 @@ export declare const parentStyles: () => {
|
|
|
935
933
|
".secure-payment-form .express-pay-button::after": {
|
|
936
934
|
content: string;
|
|
937
935
|
};
|
|
936
|
+
".secure-payment-form .affirm-button, .secure-payment-form .klarna-button, .secure-payment-form .sezzle-button, .secure-payment-form .zip-button": {
|
|
937
|
+
background: string;
|
|
938
|
+
position: string;
|
|
939
|
+
color: string;
|
|
940
|
+
height: string;
|
|
941
|
+
width: string;
|
|
942
|
+
"border-radius": string;
|
|
943
|
+
border: string;
|
|
944
|
+
margin: string;
|
|
945
|
+
cursor: string;
|
|
946
|
+
};
|
|
947
|
+
".secure-payment-form .affirm-button:hover, .secure-payment-form .klarna-button:hover, .secure-payment-form .sezzle-button:hover, .secure-payment-form .zip-button:hover": {
|
|
948
|
+
"border-color": string;
|
|
949
|
+
"background-color": string;
|
|
950
|
+
};
|
|
951
|
+
".secure-payment-form .affirm-button:focus, .secure-payment-form .klarna-button:focus, .secure-payment-form .sezzle-button:focus, .secure-payment-form .zip-button:focus": {
|
|
952
|
+
outline: string;
|
|
953
|
+
"outline-offset": string;
|
|
954
|
+
};
|
|
955
|
+
".secure-payment-form .affirm-button::before, .secure-payment-form .klarna-button::before, .secure-payment-form .sezzle-button::before, .secure-payment-form .zip-button::before": {
|
|
956
|
+
width: string;
|
|
957
|
+
height: string;
|
|
958
|
+
position: string;
|
|
959
|
+
top: string;
|
|
960
|
+
right: string;
|
|
961
|
+
};
|
|
938
962
|
".secure-payment-form .link-button": {
|
|
939
963
|
display: string;
|
|
940
964
|
"flex-direction": string;
|
|
@@ -1116,12 +1140,7 @@ export declare const parentStyles: () => {
|
|
|
1116
1140
|
};
|
|
1117
1141
|
".secure-payment-form .credit-card-currency-conversion .merchant-currency-content.visible"?: {
|
|
1118
1142
|
display: string;
|
|
1119
|
-
opacity: string;
|
|
1120
|
-
* Instantiates a new UIForm object for a group of hosted fields
|
|
1121
|
-
*
|
|
1122
|
-
* @param fields Hosted field configuration
|
|
1123
|
-
* @param styles Custom CSS configuration
|
|
1124
|
-
*/
|
|
1143
|
+
opacity: string;
|
|
1125
1144
|
visibility: boolean;
|
|
1126
1145
|
};
|
|
1127
1146
|
".secure-payment-form .credit-card-currency-conversion .additional-info"?: {
|
|
@@ -1163,6 +1182,11 @@ export declare const parentStyles: () => {
|
|
|
1163
1182
|
right: string;
|
|
1164
1183
|
transform: string;
|
|
1165
1184
|
"border-width": string;
|
|
1185
|
+
/**
|
|
1186
|
+
* Appends additional CSS rules to the group of hosted fields
|
|
1187
|
+
*
|
|
1188
|
+
* @param json New CSS rules
|
|
1189
|
+
*/
|
|
1166
1190
|
"border-style": string;
|
|
1167
1191
|
"border-color": string;
|
|
1168
1192
|
};
|
|
@@ -1175,12 +1199,6 @@ export declare const parentStyles: () => {
|
|
|
1175
1199
|
"justify-content": string;
|
|
1176
1200
|
};
|
|
1177
1201
|
".secure-payment-form .credit-card-currency-conversion .radio-button": {
|
|
1178
|
-
/**
|
|
1179
|
-
* Sets a special-case event listener that fires when all hosted
|
|
1180
|
-
* fields in a form have registered / loaded
|
|
1181
|
-
*
|
|
1182
|
-
* @param fn The listener function
|
|
1183
|
-
*/
|
|
1184
1202
|
width: string;
|
|
1185
1203
|
"justify-content": string;
|
|
1186
1204
|
};
|
|
@@ -1425,6 +1443,11 @@ export declare const parentStyles: () => {
|
|
|
1425
1443
|
};
|
|
1426
1444
|
"#ctp-wrapper #verifyVisa label": {
|
|
1427
1445
|
display: string;
|
|
1446
|
+
/**
|
|
1447
|
+
* Appends additional CSS rules to the group of hosted fields
|
|
1448
|
+
*
|
|
1449
|
+
* @param json New CSS rules
|
|
1450
|
+
*/
|
|
1428
1451
|
"font-size": string;
|
|
1429
1452
|
"font-family": string;
|
|
1430
1453
|
margin: string;
|
|
@@ -1446,7 +1469,12 @@ export declare const parentStyles: () => {
|
|
|
1446
1469
|
};
|
|
1447
1470
|
"#ctp-wrapper button label": {
|
|
1448
1471
|
margin: string;
|
|
1449
|
-
"font-size": string;
|
|
1472
|
+
"font-size": string; /**
|
|
1473
|
+
* Sets a special-case event listener that fires when all hosted
|
|
1474
|
+
* fields in a form have registered / loaded
|
|
1475
|
+
*
|
|
1476
|
+
* @param fn The listener function
|
|
1477
|
+
*/
|
|
1450
1478
|
};
|
|
1451
1479
|
"#ctp-wrapper .quitbanner > svg": {
|
|
1452
1480
|
display: string;
|
|
@@ -1855,9 +1883,6 @@ export declare const parentStyles: () => {
|
|
|
1855
1883
|
display: string;
|
|
1856
1884
|
"align-items": string;
|
|
1857
1885
|
"justify-content": string;
|
|
1858
|
-
/**
|
|
1859
|
-
* Represents logic surrounding a group of hosted fields.
|
|
1860
|
-
*/
|
|
1861
1886
|
width: string;
|
|
1862
1887
|
};
|
|
1863
1888
|
".secure-payment-form .qr-code-expired-alert-message"?: {
|
|
@@ -1990,6 +2015,32 @@ export declare const parentStyles: () => {
|
|
|
1990
2015
|
".secure-payment-form .express-pay-button::after": {
|
|
1991
2016
|
content: string;
|
|
1992
2017
|
};
|
|
2018
|
+
".secure-payment-form .affirm-button, .secure-payment-form .klarna-button, .secure-payment-form .sezzle-button, .secure-payment-form .zip-button": {
|
|
2019
|
+
background: string;
|
|
2020
|
+
position: string;
|
|
2021
|
+
color: string;
|
|
2022
|
+
height: string;
|
|
2023
|
+
width: string;
|
|
2024
|
+
"border-radius": string;
|
|
2025
|
+
border: string;
|
|
2026
|
+
margin: string;
|
|
2027
|
+
cursor: string;
|
|
2028
|
+
};
|
|
2029
|
+
".secure-payment-form .affirm-button:hover, .secure-payment-form .klarna-button:hover, .secure-payment-form .sezzle-button:hover, .secure-payment-form .zip-button:hover": {
|
|
2030
|
+
"border-color": string;
|
|
2031
|
+
"background-color": string;
|
|
2032
|
+
};
|
|
2033
|
+
".secure-payment-form .affirm-button:focus, .secure-payment-form .klarna-button:focus, .secure-payment-form .sezzle-button:focus, .secure-payment-form .zip-button:focus": {
|
|
2034
|
+
outline: string;
|
|
2035
|
+
"outline-offset": string;
|
|
2036
|
+
};
|
|
2037
|
+
".secure-payment-form .affirm-button::before, .secure-payment-form .klarna-button::before, .secure-payment-form .sezzle-button::before, .secure-payment-form .zip-button::before": {
|
|
2038
|
+
width: string;
|
|
2039
|
+
height: string;
|
|
2040
|
+
position: string;
|
|
2041
|
+
top: string;
|
|
2042
|
+
right: string;
|
|
2043
|
+
};
|
|
1993
2044
|
".secure-payment-form .link-button": {
|
|
1994
2045
|
display: string;
|
|
1995
2046
|
"flex-direction": string;
|
|
@@ -2137,23 +2188,18 @@ export declare const parentStyles: () => {
|
|
|
2137
2188
|
".secure-payment-form .credit-card-currency-conversion .merchant-currency-content"?: {
|
|
2138
2189
|
opacity: string;
|
|
2139
2190
|
visibility: boolean;
|
|
2191
|
+
display: string;
|
|
2192
|
+
"flex-direction": string;
|
|
2140
2193
|
/**
|
|
2141
2194
|
* Represents logic surrounding a group of hosted fields.
|
|
2142
2195
|
*/
|
|
2143
|
-
display: string;
|
|
2144
|
-
"flex-direction": string;
|
|
2145
2196
|
"margin-left": string;
|
|
2146
2197
|
"align-items": string;
|
|
2147
2198
|
height: string;
|
|
2148
2199
|
};
|
|
2149
2200
|
".secure-payment-form .credit-card-currency-conversion .merchant-currency-content.visible"?: {
|
|
2150
2201
|
display: string;
|
|
2151
|
-
opacity: string;
|
|
2152
|
-
* Instantiates a new UIForm object for a group of hosted fields
|
|
2153
|
-
*
|
|
2154
|
-
* @param fields Hosted field configuration
|
|
2155
|
-
* @param styles Custom CSS configuration
|
|
2156
|
-
*/
|
|
2202
|
+
opacity: string;
|
|
2157
2203
|
visibility: boolean;
|
|
2158
2204
|
};
|
|
2159
2205
|
".secure-payment-form .credit-card-currency-conversion .additional-info"?: {
|
|
@@ -2202,6 +2248,11 @@ export declare const parentStyles: () => {
|
|
|
2202
2248
|
right: string;
|
|
2203
2249
|
transform: string;
|
|
2204
2250
|
"border-width": string;
|
|
2251
|
+
/**
|
|
2252
|
+
* Appends additional CSS rules to the group of hosted fields
|
|
2253
|
+
*
|
|
2254
|
+
* @param json New CSS rules
|
|
2255
|
+
*/
|
|
2205
2256
|
"border-style": string;
|
|
2206
2257
|
"border-color": string;
|
|
2207
2258
|
};
|
|
@@ -2214,12 +2265,6 @@ export declare const parentStyles: () => {
|
|
|
2214
2265
|
"justify-content": string;
|
|
2215
2266
|
};
|
|
2216
2267
|
".secure-payment-form .credit-card-currency-conversion .radio-button": {
|
|
2217
|
-
/**
|
|
2218
|
-
* Sets a special-case event listener that fires when all hosted
|
|
2219
|
-
* fields in a form have registered / loaded
|
|
2220
|
-
*
|
|
2221
|
-
* @param fn The listener function
|
|
2222
|
-
*/
|
|
2223
2268
|
width: string;
|
|
2224
2269
|
"justify-content": string;
|
|
2225
2270
|
};
|
|
@@ -2489,6 +2534,11 @@ export declare const parentStyles: () => {
|
|
|
2489
2534
|
};
|
|
2490
2535
|
"#ctp-wrapper #verifyVisa label": {
|
|
2491
2536
|
display: string;
|
|
2537
|
+
/**
|
|
2538
|
+
* Appends additional CSS rules to the group of hosted fields
|
|
2539
|
+
*
|
|
2540
|
+
* @param json New CSS rules
|
|
2541
|
+
*/
|
|
2492
2542
|
"font-size": string;
|
|
2493
2543
|
"font-family": string;
|
|
2494
2544
|
margin: string;
|
|
@@ -2510,7 +2560,12 @@ export declare const parentStyles: () => {
|
|
|
2510
2560
|
};
|
|
2511
2561
|
"#ctp-wrapper button label": {
|
|
2512
2562
|
margin: string;
|
|
2513
|
-
"font-size": string;
|
|
2563
|
+
"font-size": string; /**
|
|
2564
|
+
* Sets a special-case event listener that fires when all hosted
|
|
2565
|
+
* fields in a form have registered / loaded
|
|
2566
|
+
*
|
|
2567
|
+
* @param fn The listener function
|
|
2568
|
+
*/
|
|
2514
2569
|
};
|
|
2515
2570
|
"#ctp-wrapper .quitbanner > svg": {
|
|
2516
2571
|
display: string;
|
|
@@ -2623,7 +2678,7 @@ export declare const parentStyles: () => {
|
|
|
2623
2678
|
"font-size": string;
|
|
2624
2679
|
"font-weight": string;
|
|
2625
2680
|
};
|
|
2626
|
-
".secure-payment-form .payment-
|
|
2681
|
+
".secure-payment-form .payment-options": {
|
|
2627
2682
|
display: string;
|
|
2628
2683
|
"flex-direction": string;
|
|
2629
2684
|
gap: string;
|
|
@@ -2777,12 +2832,6 @@ export declare const parentStyles: () => {
|
|
|
2777
2832
|
"flex-direction": string;
|
|
2778
2833
|
"justify-content": string;
|
|
2779
2834
|
};
|
|
2780
|
-
/**
|
|
2781
|
-
* Sets a special-case event listener that fires when all hosted
|
|
2782
|
-
* fields in a form have registered / loaded
|
|
2783
|
-
*
|
|
2784
|
-
* @param fn The listener function
|
|
2785
|
-
*/
|
|
2786
2835
|
".secure-payment-form .installment-link": {
|
|
2787
2836
|
background: string;
|
|
2788
2837
|
border: string;
|
|
@@ -2803,9 +2852,7 @@ export declare const parentStyles: () => {
|
|
|
2803
2852
|
};
|
|
2804
2853
|
".secure-payment-form .installment-link:focus": {
|
|
2805
2854
|
color: string;
|
|
2806
|
-
border: string;
|
|
2807
|
-
* Deletes all hosted fields within the form
|
|
2808
|
-
*/
|
|
2855
|
+
border: string;
|
|
2809
2856
|
};
|
|
2810
2857
|
".secure-payment-form .installment-step-container": {
|
|
2811
2858
|
display: string;
|
|
@@ -3048,12 +3095,6 @@ export declare const parentStyles: () => {
|
|
|
3048
3095
|
"border-bottom": string;
|
|
3049
3096
|
};
|
|
3050
3097
|
"@font-face": {
|
|
3051
|
-
/**
|
|
3052
|
-
* Instantiates a new UIForm object for a group of hosted fields
|
|
3053
|
-
*
|
|
3054
|
-
* @param fields Hosted field configuration
|
|
3055
|
-
* @param styles Custom CSS configuration
|
|
3056
|
-
*/
|
|
3057
3098
|
"font-family": string;
|
|
3058
3099
|
src: string;
|
|
3059
3100
|
};
|
|
@@ -3072,6 +3113,16 @@ export declare const parentStyles: () => {
|
|
|
3072
3113
|
"font-weight": string;
|
|
3073
3114
|
"font-family": string;
|
|
3074
3115
|
};
|
|
3116
|
+
/**
|
|
3117
|
+
* Sets an event listener for an event type
|
|
3118
|
+
*
|
|
3119
|
+
* @param fieldTypeOrEventName The field type on which the listener should
|
|
3120
|
+
* be applied, or the type of event that should trigger the listener
|
|
3121
|
+
* @param eventNameOrListener The type of event that should trigger the
|
|
3122
|
+
* listener, or the listener function
|
|
3123
|
+
* @param listener The listener function when both field type and event type
|
|
3124
|
+
* are provided
|
|
3125
|
+
*/
|
|
3075
3126
|
".secure-payment-form > div": {
|
|
3076
3127
|
flex: string;
|
|
3077
3128
|
};
|
|
@@ -3480,12 +3531,7 @@ export declare const parentStyles: () => {
|
|
|
3480
3531
|
};
|
|
3481
3532
|
".secure-payment-form .credit-card-currency-conversion .merchant-currency-content.visible"?: {
|
|
3482
3533
|
display: string;
|
|
3483
|
-
opacity: string;
|
|
3484
|
-
* Instantiates a new UIForm object for a group of hosted fields
|
|
3485
|
-
*
|
|
3486
|
-
* @param fields Hosted field configuration
|
|
3487
|
-
* @param styles Custom CSS configuration
|
|
3488
|
-
*/
|
|
3534
|
+
opacity: string;
|
|
3489
3535
|
visibility: boolean;
|
|
3490
3536
|
};
|
|
3491
3537
|
".secure-payment-form .credit-card-currency-conversion .additional-info"?: {
|
|
@@ -3522,6 +3568,11 @@ export declare const parentStyles: () => {
|
|
|
3522
3568
|
right: string;
|
|
3523
3569
|
transform: string;
|
|
3524
3570
|
"border-width": string;
|
|
3571
|
+
/**
|
|
3572
|
+
* Appends additional CSS rules to the group of hosted fields
|
|
3573
|
+
*
|
|
3574
|
+
* @param json New CSS rules
|
|
3575
|
+
*/
|
|
3525
3576
|
"border-style": string;
|
|
3526
3577
|
"border-color": string;
|
|
3527
3578
|
};
|
|
@@ -3534,12 +3585,6 @@ export declare const parentStyles: () => {
|
|
|
3534
3585
|
"justify-content": string;
|
|
3535
3586
|
};
|
|
3536
3587
|
".secure-payment-form .credit-card-currency-conversion .radio-button": {
|
|
3537
|
-
/**
|
|
3538
|
-
* Sets a special-case event listener that fires when all hosted
|
|
3539
|
-
* fields in a form have registered / loaded
|
|
3540
|
-
*
|
|
3541
|
-
* @param fn The listener function
|
|
3542
|
-
*/
|
|
3543
3588
|
width: string;
|
|
3544
3589
|
"justify-content": string;
|
|
3545
3590
|
};
|
|
@@ -3671,9 +3716,6 @@ export declare const parentStyles: () => {
|
|
|
3671
3716
|
display: string;
|
|
3672
3717
|
"align-items": string;
|
|
3673
3718
|
"justify-content": string;
|
|
3674
|
-
/**
|
|
3675
|
-
* Represents logic surrounding a group of hosted fields.
|
|
3676
|
-
*/
|
|
3677
3719
|
width: string;
|
|
3678
3720
|
};
|
|
3679
3721
|
".secure-payment-form .qr-code-expired-alert-message"?: {
|
|
@@ -3913,6 +3955,11 @@ export declare const parentStyles: () => {
|
|
|
3913
3955
|
};
|
|
3914
3956
|
"#ctp-wrapper #verifyVisa label": {
|
|
3915
3957
|
display: string;
|
|
3958
|
+
/**
|
|
3959
|
+
* Appends additional CSS rules to the group of hosted fields
|
|
3960
|
+
*
|
|
3961
|
+
* @param json New CSS rules
|
|
3962
|
+
*/
|
|
3916
3963
|
"font-size": string;
|
|
3917
3964
|
"font-family": string;
|
|
3918
3965
|
margin: string;
|
|
@@ -3934,7 +3981,12 @@ export declare const parentStyles: () => {
|
|
|
3934
3981
|
};
|
|
3935
3982
|
"#ctp-wrapper button label": {
|
|
3936
3983
|
margin: string;
|
|
3937
|
-
"font-size": string;
|
|
3984
|
+
"font-size": string; /**
|
|
3985
|
+
* Sets a special-case event listener that fires when all hosted
|
|
3986
|
+
* fields in a form have registered / loaded
|
|
3987
|
+
*
|
|
3988
|
+
* @param fn The listener function
|
|
3989
|
+
*/
|
|
3938
3990
|
};
|
|
3939
3991
|
"#ctp-wrapper .quitbanner > svg": {
|
|
3940
3992
|
display: string;
|
|
@@ -4114,12 +4166,6 @@ export declare const parentStyles: () => {
|
|
|
4114
4166
|
flex: string;
|
|
4115
4167
|
"margin-left": string;
|
|
4116
4168
|
width: string;
|
|
4117
|
-
/**
|
|
4118
|
-
* Sets a special-case event listener that fires when all hosted
|
|
4119
|
-
* fields in a form have registered / loaded
|
|
4120
|
-
*
|
|
4121
|
-
* @param fn The listener function
|
|
4122
|
-
*/
|
|
4123
4169
|
height: string;
|
|
4124
4170
|
"text-align": string;
|
|
4125
4171
|
float: string;
|
|
@@ -4150,7 +4196,9 @@ export declare const parentStyles: () => {
|
|
|
4150
4196
|
};
|
|
4151
4197
|
".secure-payment-form .form-row": {
|
|
4152
4198
|
"margin-top": string;
|
|
4153
|
-
};
|
|
4199
|
+
}; /**
|
|
4200
|
+
* Deletes all hosted fields within the form
|
|
4201
|
+
*/
|
|
4154
4202
|
".secure-payment-form .form-wrapper": {
|
|
4155
4203
|
display: string;
|
|
4156
4204
|
margin: string;
|
|
@@ -4375,9 +4423,6 @@ export declare const parentStyles: () => {
|
|
|
4375
4423
|
display: string;
|
|
4376
4424
|
"align-items": string;
|
|
4377
4425
|
"justify-content": string;
|
|
4378
|
-
/**
|
|
4379
|
-
* Represents logic surrounding a group of hosted fields.
|
|
4380
|
-
*/
|
|
4381
4426
|
width: string;
|
|
4382
4427
|
};
|
|
4383
4428
|
".secure-payment-form .qr-code-expired-alert-message"?: {
|
|
@@ -4510,6 +4555,32 @@ export declare const parentStyles: () => {
|
|
|
4510
4555
|
".secure-payment-form .express-pay-button::after": {
|
|
4511
4556
|
content: string;
|
|
4512
4557
|
};
|
|
4558
|
+
".secure-payment-form .affirm-button, .secure-payment-form .klarna-button, .secure-payment-form .sezzle-button, .secure-payment-form .zip-button": {
|
|
4559
|
+
background: string;
|
|
4560
|
+
position: string;
|
|
4561
|
+
color: string;
|
|
4562
|
+
height: string;
|
|
4563
|
+
width: string;
|
|
4564
|
+
"border-radius": string;
|
|
4565
|
+
border: string;
|
|
4566
|
+
margin: string;
|
|
4567
|
+
cursor: string;
|
|
4568
|
+
};
|
|
4569
|
+
".secure-payment-form .affirm-button:hover, .secure-payment-form .klarna-button:hover, .secure-payment-form .sezzle-button:hover, .secure-payment-form .zip-button:hover": {
|
|
4570
|
+
"border-color": string;
|
|
4571
|
+
"background-color": string;
|
|
4572
|
+
};
|
|
4573
|
+
".secure-payment-form .affirm-button:focus, .secure-payment-form .klarna-button:focus, .secure-payment-form .sezzle-button:focus, .secure-payment-form .zip-button:focus": {
|
|
4574
|
+
outline: string;
|
|
4575
|
+
"outline-offset": string;
|
|
4576
|
+
};
|
|
4577
|
+
".secure-payment-form .affirm-button::before, .secure-payment-form .klarna-button::before, .secure-payment-form .sezzle-button::before, .secure-payment-form .zip-button::before": {
|
|
4578
|
+
width: string;
|
|
4579
|
+
height: string;
|
|
4580
|
+
position: string;
|
|
4581
|
+
top: string;
|
|
4582
|
+
right: string;
|
|
4583
|
+
};
|
|
4513
4584
|
".secure-payment-form .link-button": {
|
|
4514
4585
|
display: string;
|
|
4515
4586
|
"flex-direction": string;
|
|
@@ -4657,23 +4728,18 @@ export declare const parentStyles: () => {
|
|
|
4657
4728
|
".secure-payment-form .credit-card-currency-conversion .merchant-currency-content"?: {
|
|
4658
4729
|
opacity: string;
|
|
4659
4730
|
visibility: boolean;
|
|
4731
|
+
display: string;
|
|
4732
|
+
"flex-direction": string;
|
|
4660
4733
|
/**
|
|
4661
4734
|
* Represents logic surrounding a group of hosted fields.
|
|
4662
4735
|
*/
|
|
4663
|
-
display: string;
|
|
4664
|
-
"flex-direction": string;
|
|
4665
4736
|
"margin-left": string;
|
|
4666
4737
|
"align-items": string;
|
|
4667
4738
|
height: string;
|
|
4668
4739
|
};
|
|
4669
4740
|
".secure-payment-form .credit-card-currency-conversion .merchant-currency-content.visible"?: {
|
|
4670
4741
|
display: string;
|
|
4671
|
-
opacity: string;
|
|
4672
|
-
* Instantiates a new UIForm object for a group of hosted fields
|
|
4673
|
-
*
|
|
4674
|
-
* @param fields Hosted field configuration
|
|
4675
|
-
* @param styles Custom CSS configuration
|
|
4676
|
-
*/
|
|
4742
|
+
opacity: string;
|
|
4677
4743
|
visibility: boolean;
|
|
4678
4744
|
};
|
|
4679
4745
|
".secure-payment-form .credit-card-currency-conversion .additional-info"?: {
|
|
@@ -4722,6 +4788,11 @@ export declare const parentStyles: () => {
|
|
|
4722
4788
|
right: string;
|
|
4723
4789
|
transform: string;
|
|
4724
4790
|
"border-width": string;
|
|
4791
|
+
/**
|
|
4792
|
+
* Appends additional CSS rules to the group of hosted fields
|
|
4793
|
+
*
|
|
4794
|
+
* @param json New CSS rules
|
|
4795
|
+
*/
|
|
4725
4796
|
"border-style": string;
|
|
4726
4797
|
"border-color": string;
|
|
4727
4798
|
};
|
|
@@ -4734,12 +4805,6 @@ export declare const parentStyles: () => {
|
|
|
4734
4805
|
"justify-content": string;
|
|
4735
4806
|
};
|
|
4736
4807
|
".secure-payment-form .credit-card-currency-conversion .radio-button": {
|
|
4737
|
-
/**
|
|
4738
|
-
* Sets a special-case event listener that fires when all hosted
|
|
4739
|
-
* fields in a form have registered / loaded
|
|
4740
|
-
*
|
|
4741
|
-
* @param fn The listener function
|
|
4742
|
-
*/
|
|
4743
4808
|
width: string;
|
|
4744
4809
|
"justify-content": string;
|
|
4745
4810
|
};
|
|
@@ -5009,6 +5074,11 @@ export declare const parentStyles: () => {
|
|
|
5009
5074
|
};
|
|
5010
5075
|
"#ctp-wrapper #verifyVisa label": {
|
|
5011
5076
|
display: string;
|
|
5077
|
+
/**
|
|
5078
|
+
* Appends additional CSS rules to the group of hosted fields
|
|
5079
|
+
*
|
|
5080
|
+
* @param json New CSS rules
|
|
5081
|
+
*/
|
|
5012
5082
|
"font-size": string;
|
|
5013
5083
|
"font-family": string;
|
|
5014
5084
|
margin: string;
|
|
@@ -5030,7 +5100,12 @@ export declare const parentStyles: () => {
|
|
|
5030
5100
|
};
|
|
5031
5101
|
"#ctp-wrapper button label": {
|
|
5032
5102
|
margin: string;
|
|
5033
|
-
"font-size": string;
|
|
5103
|
+
"font-size": string; /**
|
|
5104
|
+
* Sets a special-case event listener that fires when all hosted
|
|
5105
|
+
* fields in a form have registered / loaded
|
|
5106
|
+
*
|
|
5107
|
+
* @param fn The listener function
|
|
5108
|
+
*/
|
|
5034
5109
|
};
|
|
5035
5110
|
"#ctp-wrapper .quitbanner > svg": {
|
|
5036
5111
|
display: string;
|
|
@@ -5143,7 +5218,7 @@ export declare const parentStyles: () => {
|
|
|
5143
5218
|
"font-size": string;
|
|
5144
5219
|
"font-weight": string;
|
|
5145
5220
|
};
|
|
5146
|
-
".secure-payment-form .payment-
|
|
5221
|
+
".secure-payment-form .payment-options": {
|
|
5147
5222
|
display: string;
|
|
5148
5223
|
"flex-direction": string;
|
|
5149
5224
|
gap: string;
|
|
@@ -5297,12 +5372,6 @@ export declare const parentStyles: () => {
|
|
|
5297
5372
|
"flex-direction": string;
|
|
5298
5373
|
"justify-content": string;
|
|
5299
5374
|
};
|
|
5300
|
-
/**
|
|
5301
|
-
* Sets a special-case event listener that fires when all hosted
|
|
5302
|
-
* fields in a form have registered / loaded
|
|
5303
|
-
*
|
|
5304
|
-
* @param fn The listener function
|
|
5305
|
-
*/
|
|
5306
5375
|
".secure-payment-form .installment-link": {
|
|
5307
5376
|
background: string;
|
|
5308
5377
|
border: string;
|
|
@@ -5323,9 +5392,7 @@ export declare const parentStyles: () => {
|
|
|
5323
5392
|
};
|
|
5324
5393
|
".secure-payment-form .installment-link:focus": {
|
|
5325
5394
|
color: string;
|
|
5326
|
-
border: string;
|
|
5327
|
-
* Deletes all hosted fields within the form
|
|
5328
|
-
*/
|
|
5395
|
+
border: string;
|
|
5329
5396
|
};
|
|
5330
5397
|
".secure-payment-form .installment-step-container": {
|
|
5331
5398
|
display: string;
|
|
@@ -1,48 +0,0 @@
|
|
|
1
|
-
import { IframeField } from "../../../ui";
|
|
2
|
-
import InstallmentPlansData from "./contracts/installment-plans-data";
|
|
3
|
-
export declare class InstallmentsHandler {
|
|
4
|
-
private readonly iframeField;
|
|
5
|
-
private readonly installmentPlans;
|
|
6
|
-
private currentStepIndex;
|
|
7
|
-
private steps;
|
|
8
|
-
private context;
|
|
9
|
-
private selectedTermIndex;
|
|
10
|
-
private tokenizationCallback;
|
|
11
|
-
constructor(_iframeField: IframeField | undefined, _installmentPlans: InstallmentPlansData, _tokenizationCallback: (installment: InstallmentPaymentData) => void);
|
|
12
|
-
init(): void;
|
|
13
|
-
private moveNext;
|
|
14
|
-
private moveToInitialStep;
|
|
15
|
-
private updateContainerContent;
|
|
16
|
-
private createContainerElement;
|
|
17
|
-
private getInstallmentSteps;
|
|
18
|
-
private getInitialContext;
|
|
19
|
-
private explorePlansHanlder;
|
|
20
|
-
private selectTermHandler;
|
|
21
|
-
private payHandler;
|
|
22
|
-
private changePaymentMethodHandler;
|
|
23
|
-
private changeCreditCardFormFieldsVisibility;
|
|
24
|
-
}
|
|
25
|
-
export interface InstallmentsContext {
|
|
26
|
-
installmentPlans: InstallmentPlansData;
|
|
27
|
-
selectedTerm: number;
|
|
28
|
-
hasIssuerInfo?: boolean;
|
|
29
|
-
explorePlans: () => void;
|
|
30
|
-
selectTerm: (i: number) => void;
|
|
31
|
-
changePaymentMethod: () => void;
|
|
32
|
-
pay: () => void;
|
|
33
|
-
updateContainerContent: () => void;
|
|
34
|
-
}
|
|
35
|
-
export interface InstallmentStepDefinition {
|
|
36
|
-
initialize?: (context: InstallmentsContext) => void;
|
|
37
|
-
contentHandler: (context: InstallmentsContext) => HTMLElement;
|
|
38
|
-
eventsListeners: (context: InstallmentsContext) => InstallmentEventListenerDefinition[];
|
|
39
|
-
}
|
|
40
|
-
export interface InstallmentEventListenerDefinition {
|
|
41
|
-
elementSelector: string;
|
|
42
|
-
eventName: string;
|
|
43
|
-
eventHandler: (e: Event) => void;
|
|
44
|
-
}
|
|
45
|
-
export interface InstallmentPaymentData {
|
|
46
|
-
id: string;
|
|
47
|
-
reference: string;
|
|
48
|
-
}
|