@lightspeed/online-payments-sdk 1.1.2 → 1.1.4
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/dist/cjs/v1/EventBroadcaster.js +1 -1
- package/dist/cjs/v1/adyen/ResultBuilder.js +1 -1
- package/dist/cjs/v1/stripe/ResultBuilder.js +27 -9
- package/dist/cjs/v1/stripe/shared.js +134 -33
- package/dist/cjs/v1/stripe/terms.js +29 -0
- package/dist/cjs/v1/stripe/widgets/moto.js +4 -4
- package/dist/cjs/v1/stripe/widgets/payment.js +5 -5
- package/dist/v1/EventBroadcaster.d.ts +4 -4
- package/dist/v1/EventBroadcaster.js +1 -1
- package/dist/v1/adyen/ResultBuilder.d.ts +2 -2
- package/dist/v1/adyen/ResultBuilder.js +1 -1
- package/dist/v1/error.d.ts +1 -1
- package/dist/v1/stripe/ResultBuilder.d.ts +2 -2
- package/dist/v1/stripe/ResultBuilder.js +27 -9
- package/dist/v1/stripe/shared.d.ts +9 -5
- package/dist/v1/stripe/shared.js +134 -33
- package/dist/v1/stripe/terms.d.ts +26 -0
- package/dist/v1/stripe/terms.js +26 -0
- package/dist/v1/stripe/widgets/moto.js +4 -4
- package/dist/v1/stripe/widgets/payment.js +5 -5
- package/package.json +1 -1
- package/styles/lightspeed-global-styles.css +61 -0
|
@@ -18,7 +18,7 @@ var EventBroadcaster = /** @class */ (function () {
|
|
|
18
18
|
this.middleware = [];
|
|
19
19
|
this.listenersRegistry = {
|
|
20
20
|
Succeeded: (listeners === null || listeners === void 0 ? void 0 : listeners.onSucceeded) || noOpListener,
|
|
21
|
-
|
|
21
|
+
Declined: (listeners === null || listeners === void 0 ? void 0 : listeners.onDeclined) || noOpListener,
|
|
22
22
|
Pending: (listeners === null || listeners === void 0 ? void 0 : listeners.onPending) || noOpListener,
|
|
23
23
|
Error: (listeners === null || listeners === void 0 ? void 0 : listeners.onError) || noOpListener,
|
|
24
24
|
Ready: (listeners === null || listeners === void 0 ? void 0 : listeners.onReady) || noOpListener,
|
|
@@ -26,39 +26,57 @@ var EventBuilder = /** @class */ (function () {
|
|
|
26
26
|
switch (stripeError.code) {
|
|
27
27
|
case 'expired_card':
|
|
28
28
|
case 'incorrect_cvc':
|
|
29
|
+
case 'incorrect_zip':
|
|
30
|
+
return {
|
|
31
|
+
status: 'Declined',
|
|
32
|
+
code: 'CardValidation',
|
|
33
|
+
loggingEnrichment: loggingEnrichment,
|
|
34
|
+
};
|
|
29
35
|
case 'incorrect_number':
|
|
30
|
-
case '
|
|
31
|
-
case '
|
|
36
|
+
case 'incomplete_name':
|
|
37
|
+
case 'incomplete_email':
|
|
38
|
+
case 'incomplete_address':
|
|
32
39
|
case 'incomplete_number':
|
|
33
40
|
case 'incomplete_cvc':
|
|
41
|
+
case 'incomplete_expiry':
|
|
42
|
+
case 'instant_verification_incomplete':
|
|
34
43
|
case 'invalid_postal_code':
|
|
35
44
|
case 'invalid_number':
|
|
36
|
-
case '
|
|
45
|
+
case 'invalid_cvc':
|
|
46
|
+
case 'invalid_zip':
|
|
47
|
+
case 'invalid_expiry_month':
|
|
48
|
+
case 'invalid_expiry_year':
|
|
49
|
+
case 'invalid_expiry_month_past':
|
|
50
|
+
case 'invalid_expiry_year_past':
|
|
37
51
|
return {
|
|
38
|
-
status: '
|
|
39
|
-
code: '
|
|
52
|
+
status: 'Error',
|
|
53
|
+
code: 'FormValidation',
|
|
40
54
|
loggingEnrichment: loggingEnrichment,
|
|
41
55
|
};
|
|
42
56
|
case 'processing_error':
|
|
43
57
|
case 'card_declined':
|
|
44
58
|
if ((stripeError === null || stripeError === void 0 ? void 0 : stripeError.decline_code) === 'card_not_supported') {
|
|
45
59
|
return {
|
|
46
|
-
status: '
|
|
60
|
+
status: 'Declined',
|
|
47
61
|
code: 'PaymentMethodNotSupported',
|
|
48
62
|
loggingEnrichment: loggingEnrichment,
|
|
49
63
|
};
|
|
50
64
|
}
|
|
51
65
|
return {
|
|
52
|
-
status: '
|
|
66
|
+
status: 'Declined',
|
|
53
67
|
code: 'Generic',
|
|
54
68
|
loggingEnrichment: loggingEnrichment,
|
|
55
69
|
};
|
|
56
70
|
case 'insufficient_funds':
|
|
57
|
-
case 'invalid_expiry_month_past':
|
|
58
71
|
case 'generic_decline':
|
|
59
72
|
case 'lost_card':
|
|
73
|
+
case 'charge_exceeds_source_limit':
|
|
74
|
+
case 'card_velocity_exceeded':
|
|
75
|
+
case 'payment_intent_payment_attempt_failed':
|
|
76
|
+
case 'payment_intent_authentication_failure':
|
|
77
|
+
case 'setup_intent_authentication_failure':
|
|
60
78
|
return {
|
|
61
|
-
status: '
|
|
79
|
+
status: 'Declined',
|
|
62
80
|
code: 'Generic',
|
|
63
81
|
loggingEnrichment: loggingEnrichment,
|
|
64
82
|
};
|
|
@@ -60,6 +60,7 @@ var stripe_js_1 = require("@stripe/stripe-js");
|
|
|
60
60
|
var ResultBuilder_1 = require("./ResultBuilder");
|
|
61
61
|
var error_1 = require("../error");
|
|
62
62
|
var themes_1 = require("./themes");
|
|
63
|
+
var terms_1 = require("./terms");
|
|
63
64
|
/**
|
|
64
65
|
* Initialize Stripe with the given context
|
|
65
66
|
*/
|
|
@@ -87,15 +88,25 @@ function initStripe(context, theme) {
|
|
|
87
88
|
}
|
|
88
89
|
/**
|
|
89
90
|
* Create payment element options with default wallet settings
|
|
91
|
+
* @param defaultValues - Default values for the payment element
|
|
92
|
+
* @param theme - Theme configuration
|
|
93
|
+
* @param hideNameField - Whether to hide the billing details name field (used when address element is present to avoid duplicates with ACH)
|
|
90
94
|
*/
|
|
91
|
-
function createPaymentElementOptions(defaultValues, theme) {
|
|
92
|
-
|
|
93
|
-
|
|
95
|
+
function createPaymentElementOptions(defaultValues, theme, hideNameField) {
|
|
96
|
+
if (hideNameField === void 0) { hideNameField = false; }
|
|
97
|
+
var options = __assign(__assign({ wallets: {
|
|
94
98
|
applePay: 'never',
|
|
95
99
|
googlePay: 'never',
|
|
96
100
|
link: 'never',
|
|
101
|
+
} }, (hideNameField && {
|
|
102
|
+
fields: {
|
|
103
|
+
billingDetails: {
|
|
104
|
+
name: 'never', // prevent duplicate Name field on the form when using ACH (only when address element is present)
|
|
105
|
+
},
|
|
97
106
|
},
|
|
98
|
-
}
|
|
107
|
+
})), { terms: {
|
|
108
|
+
usBankAccount: 'never', // Hide Stripe's default T&Cs (shown for ACH payments)
|
|
109
|
+
} });
|
|
99
110
|
if (defaultValues) {
|
|
100
111
|
options.defaultValues = {
|
|
101
112
|
billingDetails: {
|
|
@@ -132,6 +143,41 @@ function createAddressElementOptions(defaultValues) {
|
|
|
132
143
|
}
|
|
133
144
|
return addressOptions;
|
|
134
145
|
}
|
|
146
|
+
/**
|
|
147
|
+
* Create custom Terms & Conditions element for US Bank Account payments
|
|
148
|
+
* Styling is defined in lightspeed-global-styles.css
|
|
149
|
+
*/
|
|
150
|
+
function createCustomTermsElement() {
|
|
151
|
+
var termsContainer = document.createElement('div');
|
|
152
|
+
termsContainer.className = 'stripe-custom-terms-container';
|
|
153
|
+
termsContainer.style.display = 'none'; // Hidden by default
|
|
154
|
+
var termsText = document.createElement('p');
|
|
155
|
+
termsText.className = 'stripe-custom-terms-text';
|
|
156
|
+
// Build terms HTML with translatable strings
|
|
157
|
+
var stripeTermsLink = "<a href=\"".concat(terms_1.ACH_TERMS_URL.STRIPE_ACH_AUTHORIZATION, "\" target=\"_blank\" rel=\"noopener noreferrer\">").concat(terms_1.ACH_TERMS_TEXT.STRIPE_TERMS_LINK_TEXT, "</a>");
|
|
158
|
+
var expandableToggle = "<span class=\"stripe-expandable-terms-toggle\">".concat(terms_1.ACH_TERMS_TEXT.EXPANDABLE_TERMS_LINK_TEXT, " <span class=\"stripe-terms-triangle\">\u25BC</span></span>");
|
|
159
|
+
termsText.innerHTML = "".concat(terms_1.ACH_TERMS_TEXT.TERMS_PREFIX, " ").concat(stripeTermsLink, " ").concat(terms_1.ACH_TERMS_TEXT.TERMS_CONJUNCTION, " ").concat(expandableToggle);
|
|
160
|
+
// Create expandable terms content
|
|
161
|
+
var expandableContent = document.createElement('div');
|
|
162
|
+
expandableContent.className = 'stripe-expandable-terms-content';
|
|
163
|
+
expandableContent.style.display = 'none';
|
|
164
|
+
expandableContent.innerHTML = "<p>".concat(terms_1.ACH_TERMS_TEXT.EXPANDED_TERMS_CONTENT, "</p>");
|
|
165
|
+
termsContainer.appendChild(termsText);
|
|
166
|
+
termsContainer.appendChild(expandableContent);
|
|
167
|
+
// Add click handler for expandable toggle
|
|
168
|
+
var toggle = termsText.querySelector('.stripe-expandable-terms-toggle');
|
|
169
|
+
var triangle = termsText.querySelector('.stripe-terms-triangle');
|
|
170
|
+
if (toggle && triangle) {
|
|
171
|
+
toggle.addEventListener('click', function (e) {
|
|
172
|
+
e.preventDefault();
|
|
173
|
+
var isExpanded = expandableContent.style.display !== 'none';
|
|
174
|
+
expandableContent.style.display = isExpanded ? 'none' : 'block';
|
|
175
|
+
triangle.textContent = isExpanded ? '▼' : '▲';
|
|
176
|
+
toggle.classList.toggle('expanded', !isExpanded);
|
|
177
|
+
});
|
|
178
|
+
}
|
|
179
|
+
return termsContainer;
|
|
180
|
+
}
|
|
135
181
|
/**
|
|
136
182
|
* Create and mount payment element
|
|
137
183
|
*/
|
|
@@ -144,7 +190,25 @@ function createPaymentElement(elements, options, mountElement, eventBroadcaster)
|
|
|
144
190
|
paymentContainer.className = 'stripe-payment-element-container';
|
|
145
191
|
mountElement.appendChild(paymentContainer);
|
|
146
192
|
paymentElement.mount(paymentContainer);
|
|
147
|
-
|
|
193
|
+
// Create custom terms element for US Bank Account
|
|
194
|
+
var customTermsElement = createCustomTermsElement();
|
|
195
|
+
mountElement.appendChild(customTermsElement);
|
|
196
|
+
// Listen for payment method changes to show/hide custom terms
|
|
197
|
+
paymentElement.on('change', function (event) {
|
|
198
|
+
var _a;
|
|
199
|
+
// Show custom terms only when US Bank Account is selected
|
|
200
|
+
if (((_a = event.value) === null || _a === void 0 ? void 0 : _a.type) === 'us_bank_account') {
|
|
201
|
+
customTermsElement.style.display = 'block';
|
|
202
|
+
}
|
|
203
|
+
else {
|
|
204
|
+
customTermsElement.style.display = 'none';
|
|
205
|
+
}
|
|
206
|
+
});
|
|
207
|
+
return {
|
|
208
|
+
element: paymentElement,
|
|
209
|
+
container: paymentContainer,
|
|
210
|
+
customTermsContainer: customTermsElement,
|
|
211
|
+
};
|
|
148
212
|
}
|
|
149
213
|
/**
|
|
150
214
|
* Create and mount address element
|
|
@@ -160,7 +224,7 @@ function createAddressElement(elements, options, mountElement) {
|
|
|
160
224
|
/**
|
|
161
225
|
* Clean up elements and containers
|
|
162
226
|
*/
|
|
163
|
-
function cleanupElements(paymentElement, addressElement, paymentContainer, addressContainer) {
|
|
227
|
+
function cleanupElements(paymentElement, addressElement, paymentContainer, addressContainer, customTermsContainer) {
|
|
164
228
|
paymentElement.unmount();
|
|
165
229
|
if (addressElement) {
|
|
166
230
|
addressElement.unmount();
|
|
@@ -172,24 +236,44 @@ function cleanupElements(paymentElement, addressElement, paymentContainer, addre
|
|
|
172
236
|
if (paymentContainer) {
|
|
173
237
|
paymentContainer.remove();
|
|
174
238
|
}
|
|
239
|
+
if (customTermsContainer) {
|
|
240
|
+
customTermsContainer.remove();
|
|
241
|
+
}
|
|
175
242
|
}
|
|
176
243
|
/**
|
|
177
244
|
* Handle save card operation
|
|
178
245
|
*/
|
|
179
|
-
function handleSaveCard(stripe, elements, session) {
|
|
246
|
+
function handleSaveCard(stripe, elements, session, addressElement) {
|
|
180
247
|
return __awaiter(this, void 0, void 0, function () {
|
|
181
|
-
var _a, error, setupIntent;
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
return_url: session.context.redirectUrl || window.location.href,
|
|
189
|
-
},
|
|
190
|
-
})];
|
|
248
|
+
var addressValue, _a, billingName, _b, error, setupIntent;
|
|
249
|
+
var _c;
|
|
250
|
+
return __generator(this, function (_d) {
|
|
251
|
+
switch (_d.label) {
|
|
252
|
+
case 0:
|
|
253
|
+
if (!addressElement) return [3 /*break*/, 2];
|
|
254
|
+
return [4 /*yield*/, addressElement.getValue()];
|
|
191
255
|
case 1:
|
|
192
|
-
_a =
|
|
256
|
+
_a = _d.sent();
|
|
257
|
+
return [3 /*break*/, 3];
|
|
258
|
+
case 2:
|
|
259
|
+
_a = null;
|
|
260
|
+
_d.label = 3;
|
|
261
|
+
case 3:
|
|
262
|
+
addressValue = _a;
|
|
263
|
+
billingName = (_c = addressValue === null || addressValue === void 0 ? void 0 : addressValue.value) === null || _c === void 0 ? void 0 : _c.name;
|
|
264
|
+
return [4 /*yield*/, stripe.confirmSetup({
|
|
265
|
+
elements: elements,
|
|
266
|
+
redirect: 'if_required',
|
|
267
|
+
confirmParams: __assign({ return_url: session.context.redirectUrl || window.location.href }, (billingName && {
|
|
268
|
+
payment_method_data: {
|
|
269
|
+
billing_details: {
|
|
270
|
+
name: billingName,
|
|
271
|
+
},
|
|
272
|
+
},
|
|
273
|
+
})),
|
|
274
|
+
})];
|
|
275
|
+
case 4:
|
|
276
|
+
_b = _d.sent(), error = _b.error, setupIntent = _b.setupIntent;
|
|
193
277
|
return [2 /*return*/, error
|
|
194
278
|
? ResultBuilder_1.EventBuilder.fromStripeError(error)
|
|
195
279
|
: ResultBuilder_1.EventBuilder.fromSetupIntent(setupIntent)];
|
|
@@ -200,20 +284,37 @@ function handleSaveCard(stripe, elements, session) {
|
|
|
200
284
|
/**
|
|
201
285
|
* Handle payment operation
|
|
202
286
|
*/
|
|
203
|
-
function handlePayment(stripe, elements, session) {
|
|
287
|
+
function handlePayment(stripe, elements, session, addressElement) {
|
|
204
288
|
return __awaiter(this, void 0, void 0, function () {
|
|
205
|
-
var _a, error, paymentIntent;
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
return_url: session.context.redirectUrl || window.location.href,
|
|
213
|
-
},
|
|
214
|
-
})];
|
|
289
|
+
var addressValue, _a, billingName, _b, error, paymentIntent;
|
|
290
|
+
var _c;
|
|
291
|
+
return __generator(this, function (_d) {
|
|
292
|
+
switch (_d.label) {
|
|
293
|
+
case 0:
|
|
294
|
+
if (!addressElement) return [3 /*break*/, 2];
|
|
295
|
+
return [4 /*yield*/, addressElement.getValue()];
|
|
215
296
|
case 1:
|
|
216
|
-
_a =
|
|
297
|
+
_a = _d.sent();
|
|
298
|
+
return [3 /*break*/, 3];
|
|
299
|
+
case 2:
|
|
300
|
+
_a = null;
|
|
301
|
+
_d.label = 3;
|
|
302
|
+
case 3:
|
|
303
|
+
addressValue = _a;
|
|
304
|
+
billingName = (_c = addressValue === null || addressValue === void 0 ? void 0 : addressValue.value) === null || _c === void 0 ? void 0 : _c.name;
|
|
305
|
+
return [4 /*yield*/, stripe.confirmPayment({
|
|
306
|
+
elements: elements,
|
|
307
|
+
redirect: 'if_required',
|
|
308
|
+
confirmParams: __assign({ return_url: session.context.redirectUrl || window.location.href }, (billingName && {
|
|
309
|
+
payment_method_data: {
|
|
310
|
+
billing_details: {
|
|
311
|
+
name: billingName,
|
|
312
|
+
},
|
|
313
|
+
},
|
|
314
|
+
})),
|
|
315
|
+
})];
|
|
316
|
+
case 4:
|
|
317
|
+
_b = _d.sent(), error = _b.error, paymentIntent = _b.paymentIntent;
|
|
217
318
|
return [2 /*return*/, error
|
|
218
319
|
? ResultBuilder_1.EventBuilder.fromStripeError(error)
|
|
219
320
|
: ResultBuilder_1.EventBuilder.fromPaymentIntent(paymentIntent)];
|
|
@@ -224,7 +325,7 @@ function handlePayment(stripe, elements, session) {
|
|
|
224
325
|
/**
|
|
225
326
|
* Create common submit handler for widgets
|
|
226
327
|
*/
|
|
227
|
-
function createSubmitHandler(stripe, elements, session, eventBroadcaster) {
|
|
328
|
+
function createSubmitHandler(stripe, elements, session, eventBroadcaster, addressElement) {
|
|
228
329
|
var _this = this;
|
|
229
330
|
return function () { return __awaiter(_this, void 0, void 0, function () {
|
|
230
331
|
var result;
|
|
@@ -244,13 +345,13 @@ function createSubmitHandler(stripe, elements, session, eventBroadcaster) {
|
|
|
244
345
|
throw new error_1.InvalidSessionPayloadError();
|
|
245
346
|
}
|
|
246
347
|
if (!(session.context.intent === 'save-card')) return [3 /*break*/, 2];
|
|
247
|
-
return [4 /*yield*/, handleSaveCard(stripe, elements, session)];
|
|
348
|
+
return [4 /*yield*/, handleSaveCard(stripe, elements, session, addressElement)];
|
|
248
349
|
case 1:
|
|
249
350
|
result = _a.sent();
|
|
250
351
|
_a.label = 2;
|
|
251
352
|
case 2:
|
|
252
353
|
if (!(session.context.intent === 'payment')) return [3 /*break*/, 4];
|
|
253
|
-
return [4 /*yield*/, handlePayment(stripe, elements, session)];
|
|
354
|
+
return [4 /*yield*/, handlePayment(stripe, elements, session, addressElement)];
|
|
254
355
|
case 3:
|
|
255
356
|
result = _a.sent();
|
|
256
357
|
_a.label = 4;
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
/**
|
|
3
|
+
* Translatable strings for Stripe payment elements.
|
|
4
|
+
* These strings are prepared for Transifex extraction.
|
|
5
|
+
*
|
|
6
|
+
* Usage with Transifex:
|
|
7
|
+
* - Extract these strings using Transifex CLI or integration
|
|
8
|
+
* - Replace with translated versions based on locale
|
|
9
|
+
*/
|
|
10
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
11
|
+
exports.ACH_TERMS_URL = exports.ACH_TERMS_TEXT = void 0;
|
|
12
|
+
exports.ACH_TERMS_TEXT = {
|
|
13
|
+
/**
|
|
14
|
+
* Main terms text displayed for US Bank Account payments.
|
|
15
|
+
* Contains placeholders for links that will be injected.
|
|
16
|
+
*/
|
|
17
|
+
TERMS_PREFIX: 'By submitting your payment, you agree to authorize payments pursuant to',
|
|
18
|
+
STRIPE_TERMS_LINK_TEXT: "Stripe's terms",
|
|
19
|
+
TERMS_CONJUNCTION: 'and',
|
|
20
|
+
EXPANDABLE_TERMS_LINK_TEXT: 'these terms',
|
|
21
|
+
/**
|
|
22
|
+
* Expanded terms content for ACH authorization.
|
|
23
|
+
* This is the detailed legal text shown when user expands "these terms".
|
|
24
|
+
*/
|
|
25
|
+
EXPANDED_TERMS_CONTENT: 'By providing your bank account details and confirming this payment, you authorize the merchant to debit your account for the amount shown. If you choose to save your bank account for future payments, this authorization will also apply to any future amounts owed for products or services provided by the merchant, until you cancel it. You also authorize the merchant to credit your account as necessary to correct any erroneous debits. You may revoke authorization at any time by contacting the merchant, allowing up to thirty (30) days for processing. You confirm that you are an authorized signer on the account and that sufficient funds will be available for each payment. ACH payments may take up to five (5) business days to complete, and you may be responsible for fees if a payment is returned.',
|
|
26
|
+
};
|
|
27
|
+
exports.ACH_TERMS_URL = {
|
|
28
|
+
STRIPE_ACH_AUTHORIZATION: 'https://stripe.com/legal/ach-payments/authorization',
|
|
29
|
+
};
|
|
@@ -44,19 +44,19 @@ var shared_1 = require("../shared");
|
|
|
44
44
|
*/
|
|
45
45
|
function mountMotoWidget(mountElement, session, eventBroadcaster, defaultValues, theme) {
|
|
46
46
|
return __awaiter(this, void 0, void 0, function () {
|
|
47
|
-
var _a, stripe, elements, paymentOptions, _b, paymentElement, paymentContainer;
|
|
47
|
+
var _a, stripe, elements, paymentOptions, _b, paymentElement, paymentContainer, customTermsContainer;
|
|
48
48
|
return __generator(this, function (_c) {
|
|
49
49
|
switch (_c.label) {
|
|
50
50
|
case 0: return [4 /*yield*/, (0, shared_1.initStripe)(session.context, theme)];
|
|
51
51
|
case 1:
|
|
52
52
|
_a = _c.sent(), stripe = _a.stripe, elements = _a.elements;
|
|
53
53
|
paymentOptions = (0, shared_1.createPaymentElementOptions)(defaultValues, theme);
|
|
54
|
-
_b = (0, shared_1.createPaymentElement)(elements, paymentOptions, mountElement, eventBroadcaster), paymentElement = _b.element, paymentContainer = _b.container;
|
|
54
|
+
_b = (0, shared_1.createPaymentElement)(elements, paymentOptions, mountElement, eventBroadcaster), paymentElement = _b.element, paymentContainer = _b.container, customTermsContainer = _b.customTermsContainer;
|
|
55
55
|
return [2 /*return*/, {
|
|
56
56
|
unmount: function () {
|
|
57
|
-
(0, shared_1.cleanupElements)(paymentElement, null, paymentContainer, null);
|
|
57
|
+
(0, shared_1.cleanupElements)(paymentElement, null, paymentContainer, null, customTermsContainer);
|
|
58
58
|
},
|
|
59
|
-
submit: (0, shared_1.createSubmitHandler)(stripe, elements, session, eventBroadcaster),
|
|
59
|
+
submit: (0, shared_1.createSubmitHandler)(stripe, elements, session, eventBroadcaster, null),
|
|
60
60
|
}];
|
|
61
61
|
}
|
|
62
62
|
});
|
|
@@ -43,7 +43,7 @@ var shared_1 = require("../shared");
|
|
|
43
43
|
*/
|
|
44
44
|
function mountPaymentWidget(mountElement, session, eventBroadcaster, defaultValues, theme) {
|
|
45
45
|
return __awaiter(this, void 0, void 0, function () {
|
|
46
|
-
var _a, stripe, elements, addressOptions, _b, addressElement, addressContainer, paymentOptions, _c, paymentElement, paymentContainer;
|
|
46
|
+
var _a, stripe, elements, addressOptions, _b, addressElement, addressContainer, paymentOptions, _c, paymentElement, paymentContainer, customTermsContainer;
|
|
47
47
|
return __generator(this, function (_d) {
|
|
48
48
|
switch (_d.label) {
|
|
49
49
|
case 0: return [4 /*yield*/, (0, shared_1.initStripe)(session.context, theme)];
|
|
@@ -51,13 +51,13 @@ function mountPaymentWidget(mountElement, session, eventBroadcaster, defaultValu
|
|
|
51
51
|
_a = _d.sent(), stripe = _a.stripe, elements = _a.elements;
|
|
52
52
|
addressOptions = (0, shared_1.createAddressElementOptions)(defaultValues);
|
|
53
53
|
_b = (0, shared_1.createAddressElement)(elements, addressOptions, mountElement), addressElement = _b.element, addressContainer = _b.container;
|
|
54
|
-
paymentOptions = (0, shared_1.createPaymentElementOptions)(defaultValues, theme);
|
|
55
|
-
_c = (0, shared_1.createPaymentElement)(elements, paymentOptions, mountElement, eventBroadcaster), paymentElement = _c.element, paymentContainer = _c.container;
|
|
54
|
+
paymentOptions = (0, shared_1.createPaymentElementOptions)(defaultValues, theme, true);
|
|
55
|
+
_c = (0, shared_1.createPaymentElement)(elements, paymentOptions, mountElement, eventBroadcaster), paymentElement = _c.element, paymentContainer = _c.container, customTermsContainer = _c.customTermsContainer;
|
|
56
56
|
return [2 /*return*/, {
|
|
57
57
|
unmount: function () {
|
|
58
|
-
(0, shared_1.cleanupElements)(paymentElement, addressElement, paymentContainer, addressContainer);
|
|
58
|
+
(0, shared_1.cleanupElements)(paymentElement, addressElement, paymentContainer, addressContainer, customTermsContainer);
|
|
59
59
|
},
|
|
60
|
-
submit: (0, shared_1.createSubmitHandler)(stripe, elements, session, eventBroadcaster),
|
|
60
|
+
submit: (0, shared_1.createSubmitHandler)(stripe, elements, session, eventBroadcaster, addressElement),
|
|
61
61
|
}];
|
|
62
62
|
}
|
|
63
63
|
});
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { SupportedErrorCodes } from './error';
|
|
2
|
-
export type Status = 'Succeeded' | '
|
|
2
|
+
export type Status = 'Succeeded' | 'Declined' | 'Pending' | 'Error' | 'Ready';
|
|
3
3
|
export type BaseEvent = {
|
|
4
4
|
loggingEnrichment?: object;
|
|
5
5
|
};
|
|
@@ -11,8 +11,8 @@ export type PendingResultEvent = BaseEvent & {
|
|
|
11
11
|
code: 'Processing';
|
|
12
12
|
status: 'Pending';
|
|
13
13
|
};
|
|
14
|
-
export type
|
|
15
|
-
status: '
|
|
14
|
+
export type DeclinedResultEvent = BaseEvent & {
|
|
15
|
+
status: 'Declined';
|
|
16
16
|
code: 'CardValidation' | 'Generic' | 'PaymentMethodNotSupported';
|
|
17
17
|
};
|
|
18
18
|
export type ReadyEvent = BaseEvent & {
|
|
@@ -23,7 +23,7 @@ export type ErrorResultEvent = BaseEvent & {
|
|
|
23
23
|
code: SupportedErrorCodes;
|
|
24
24
|
status: 'Error';
|
|
25
25
|
};
|
|
26
|
-
export type InternalEvent = SucceededResultEvent | PendingResultEvent |
|
|
26
|
+
export type InternalEvent = SucceededResultEvent | PendingResultEvent | DeclinedResultEvent | ErrorResultEvent | ReadyEvent;
|
|
27
27
|
export type Event = Omit<InternalEvent, 'loggingEnrichment'>;
|
|
28
28
|
export type EventHandler = (result: Event) => void;
|
|
29
29
|
export type EventMiddleware = (event: InternalEvent) => InternalEvent | void;
|
|
@@ -15,7 +15,7 @@ var EventBroadcaster = /** @class */ (function () {
|
|
|
15
15
|
this.middleware = [];
|
|
16
16
|
this.listenersRegistry = {
|
|
17
17
|
Succeeded: (listeners === null || listeners === void 0 ? void 0 : listeners.onSucceeded) || noOpListener,
|
|
18
|
-
|
|
18
|
+
Declined: (listeners === null || listeners === void 0 ? void 0 : listeners.onDeclined) || noOpListener,
|
|
19
19
|
Pending: (listeners === null || listeners === void 0 ? void 0 : listeners.onPending) || noOpListener,
|
|
20
20
|
Error: (listeners === null || listeners === void 0 ? void 0 : listeners.onError) || noOpListener,
|
|
21
21
|
Ready: (listeners === null || listeners === void 0 ? void 0 : listeners.onReady) || noOpListener,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import { ErrorResultEvent, SucceededResultEvent, PendingResultEvent,
|
|
1
|
+
import { ErrorResultEvent, SucceededResultEvent, PendingResultEvent, DeclinedResultEvent } from '../EventBroadcaster';
|
|
2
2
|
import { PaymentCompletedData, PaymentFailedData } from '@adyen/adyen-web';
|
|
3
3
|
export declare class ResultBuilder {
|
|
4
4
|
static fromPaymentCompletedData(paymentCompleteData: PaymentCompletedData): SucceededResultEvent | PendingResultEvent;
|
|
5
|
-
static fromPaymentFailedData(paymentFailedData: PaymentFailedData):
|
|
5
|
+
static fromPaymentFailedData(paymentFailedData: PaymentFailedData): DeclinedResultEvent | ErrorResultEvent;
|
|
6
6
|
static generatePendingEvent(): PendingResultEvent;
|
|
7
7
|
}
|
package/dist/v1/error.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export type SupportedErrorCodes = 'Unexpected' | 'InvalidSession' | 'InvalidSessionPayload' | 'UnsupportedLocation' | 'Processing';
|
|
1
|
+
export type SupportedErrorCodes = 'Unexpected' | 'InvalidSession' | 'InvalidSessionPayload' | 'UnsupportedLocation' | 'Processing' | 'FormValidation';
|
|
2
2
|
export declare class BaseError extends Error {
|
|
3
3
|
code: SupportedErrorCodes;
|
|
4
4
|
constructor(code: SupportedErrorCodes, message: string);
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { StripeError, SetupIntent, PaymentIntent } from '@stripe/stripe-js';
|
|
2
|
-
import { ErrorResultEvent,
|
|
2
|
+
import { ErrorResultEvent, DeclinedResultEvent, SucceededResultEvent, PendingResultEvent } from '../EventBroadcaster';
|
|
3
3
|
export declare class EventBuilder {
|
|
4
4
|
static fromSetupIntent(setupIntent: SetupIntent): SucceededResultEvent | PendingResultEvent;
|
|
5
|
-
static fromStripeError(stripeError: StripeError):
|
|
5
|
+
static fromStripeError(stripeError: StripeError): DeclinedResultEvent | ErrorResultEvent;
|
|
6
6
|
static fromPaymentIntent(paymentIntent: PaymentIntent): SucceededResultEvent | PendingResultEvent;
|
|
7
7
|
}
|
|
@@ -23,39 +23,57 @@ var EventBuilder = /** @class */ (function () {
|
|
|
23
23
|
switch (stripeError.code) {
|
|
24
24
|
case 'expired_card':
|
|
25
25
|
case 'incorrect_cvc':
|
|
26
|
+
case 'incorrect_zip':
|
|
27
|
+
return {
|
|
28
|
+
status: 'Declined',
|
|
29
|
+
code: 'CardValidation',
|
|
30
|
+
loggingEnrichment: loggingEnrichment,
|
|
31
|
+
};
|
|
26
32
|
case 'incorrect_number':
|
|
27
|
-
case '
|
|
28
|
-
case '
|
|
33
|
+
case 'incomplete_name':
|
|
34
|
+
case 'incomplete_email':
|
|
35
|
+
case 'incomplete_address':
|
|
29
36
|
case 'incomplete_number':
|
|
30
37
|
case 'incomplete_cvc':
|
|
38
|
+
case 'incomplete_expiry':
|
|
39
|
+
case 'instant_verification_incomplete':
|
|
31
40
|
case 'invalid_postal_code':
|
|
32
41
|
case 'invalid_number':
|
|
33
|
-
case '
|
|
42
|
+
case 'invalid_cvc':
|
|
43
|
+
case 'invalid_zip':
|
|
44
|
+
case 'invalid_expiry_month':
|
|
45
|
+
case 'invalid_expiry_year':
|
|
46
|
+
case 'invalid_expiry_month_past':
|
|
47
|
+
case 'invalid_expiry_year_past':
|
|
34
48
|
return {
|
|
35
|
-
status: '
|
|
36
|
-
code: '
|
|
49
|
+
status: 'Error',
|
|
50
|
+
code: 'FormValidation',
|
|
37
51
|
loggingEnrichment: loggingEnrichment,
|
|
38
52
|
};
|
|
39
53
|
case 'processing_error':
|
|
40
54
|
case 'card_declined':
|
|
41
55
|
if ((stripeError === null || stripeError === void 0 ? void 0 : stripeError.decline_code) === 'card_not_supported') {
|
|
42
56
|
return {
|
|
43
|
-
status: '
|
|
57
|
+
status: 'Declined',
|
|
44
58
|
code: 'PaymentMethodNotSupported',
|
|
45
59
|
loggingEnrichment: loggingEnrichment,
|
|
46
60
|
};
|
|
47
61
|
}
|
|
48
62
|
return {
|
|
49
|
-
status: '
|
|
63
|
+
status: 'Declined',
|
|
50
64
|
code: 'Generic',
|
|
51
65
|
loggingEnrichment: loggingEnrichment,
|
|
52
66
|
};
|
|
53
67
|
case 'insufficient_funds':
|
|
54
|
-
case 'invalid_expiry_month_past':
|
|
55
68
|
case 'generic_decline':
|
|
56
69
|
case 'lost_card':
|
|
70
|
+
case 'charge_exceeds_source_limit':
|
|
71
|
+
case 'card_velocity_exceeded':
|
|
72
|
+
case 'payment_intent_payment_attempt_failed':
|
|
73
|
+
case 'payment_intent_authentication_failure':
|
|
74
|
+
case 'setup_intent_authentication_failure':
|
|
57
75
|
return {
|
|
58
|
-
status: '
|
|
76
|
+
status: 'Declined',
|
|
59
77
|
code: 'Generic',
|
|
60
78
|
loggingEnrichment: loggingEnrichment,
|
|
61
79
|
};
|
|
@@ -18,8 +18,11 @@ export interface ElementContainers {
|
|
|
18
18
|
export declare function initStripe(context: StripeContext, theme?: PaymentWidgetTheme): Promise<StripeInitResult>;
|
|
19
19
|
/**
|
|
20
20
|
* Create payment element options with default wallet settings
|
|
21
|
+
* @param defaultValues - Default values for the payment element
|
|
22
|
+
* @param theme - Theme configuration
|
|
23
|
+
* @param hideNameField - Whether to hide the billing details name field (used when address element is present to avoid duplicates with ACH)
|
|
21
24
|
*/
|
|
22
|
-
export declare function createPaymentElementOptions(defaultValues?: DefaultValues, theme?: PaymentWidgetTheme): StripePaymentElementOptions;
|
|
25
|
+
export declare function createPaymentElementOptions(defaultValues?: DefaultValues, theme?: PaymentWidgetTheme, hideNameField?: boolean): StripePaymentElementOptions;
|
|
23
26
|
/**
|
|
24
27
|
* Create address element options
|
|
25
28
|
*/
|
|
@@ -30,6 +33,7 @@ export declare function createAddressElementOptions(defaultValues?: DefaultValue
|
|
|
30
33
|
export declare function createPaymentElement(elements: StripeElements, options: StripePaymentElementOptions, mountElement: HTMLElement, eventBroadcaster: EventBroadcaster): {
|
|
31
34
|
element: StripePaymentElement;
|
|
32
35
|
container: HTMLElement;
|
|
36
|
+
customTermsContainer: HTMLElement;
|
|
33
37
|
};
|
|
34
38
|
/**
|
|
35
39
|
* Create and mount address element
|
|
@@ -41,16 +45,16 @@ export declare function createAddressElement(elements: StripeElements, options:
|
|
|
41
45
|
/**
|
|
42
46
|
* Clean up elements and containers
|
|
43
47
|
*/
|
|
44
|
-
export declare function cleanupElements(paymentElement: StripePaymentElement, addressElement: StripeAddressElement | null, paymentContainer: HTMLElement, addressContainer: HTMLElement | null): void;
|
|
48
|
+
export declare function cleanupElements(paymentElement: StripePaymentElement, addressElement: StripeAddressElement | null, paymentContainer: HTMLElement, addressContainer: HTMLElement | null, customTermsContainer?: HTMLElement): void;
|
|
45
49
|
/**
|
|
46
50
|
* Handle save card operation
|
|
47
51
|
*/
|
|
48
|
-
export declare function handleSaveCard(stripe: Stripe, elements: StripeElements, session: StripeSession): Promise<import("../EventBroadcaster").SucceededResultEvent | import("../EventBroadcaster").PendingResultEvent | import("../EventBroadcaster").
|
|
52
|
+
export declare function handleSaveCard(stripe: Stripe, elements: StripeElements, session: StripeSession, addressElement?: StripeAddressElement | null): Promise<import("../EventBroadcaster").SucceededResultEvent | import("../EventBroadcaster").PendingResultEvent | import("../EventBroadcaster").DeclinedResultEvent | import("../EventBroadcaster").ErrorResultEvent>;
|
|
49
53
|
/**
|
|
50
54
|
* Handle payment operation
|
|
51
55
|
*/
|
|
52
|
-
export declare function handlePayment(stripe: Stripe, elements: StripeElements, session: StripeSession): Promise<import("../EventBroadcaster").SucceededResultEvent | import("../EventBroadcaster").PendingResultEvent | import("../EventBroadcaster").
|
|
56
|
+
export declare function handlePayment(stripe: Stripe, elements: StripeElements, session: StripeSession, addressElement?: StripeAddressElement | null): Promise<import("../EventBroadcaster").SucceededResultEvent | import("../EventBroadcaster").PendingResultEvent | import("../EventBroadcaster").DeclinedResultEvent | import("../EventBroadcaster").ErrorResultEvent>;
|
|
53
57
|
/**
|
|
54
58
|
* Create common submit handler for widgets
|
|
55
59
|
*/
|
|
56
|
-
export declare function createSubmitHandler(stripe: Stripe, elements: StripeElements, session: StripeSession, eventBroadcaster: EventBroadcaster): () => Promise<import("../EventBroadcaster").SucceededResultEvent | import("../EventBroadcaster").PendingResultEvent | import("../EventBroadcaster").
|
|
60
|
+
export declare function createSubmitHandler(stripe: Stripe, elements: StripeElements, session: StripeSession, eventBroadcaster: EventBroadcaster, addressElement?: StripeAddressElement | null): () => Promise<import("../EventBroadcaster").SucceededResultEvent | import("../EventBroadcaster").PendingResultEvent | import("../EventBroadcaster").DeclinedResultEvent | import("../EventBroadcaster").ErrorResultEvent>;
|
package/dist/v1/stripe/shared.js
CHANGED
|
@@ -49,6 +49,7 @@ import { loadStripe, } from '@stripe/stripe-js';
|
|
|
49
49
|
import { EventBuilder } from './ResultBuilder';
|
|
50
50
|
import { InvalidSessionPayloadError, ProcessingError } from '../error';
|
|
51
51
|
import { getThemeConfig } from './themes';
|
|
52
|
+
import { ACH_TERMS_TEXT, ACH_TERMS_URL } from './terms';
|
|
52
53
|
/**
|
|
53
54
|
* Initialize Stripe with the given context
|
|
54
55
|
*/
|
|
@@ -76,15 +77,25 @@ export function initStripe(context, theme) {
|
|
|
76
77
|
}
|
|
77
78
|
/**
|
|
78
79
|
* Create payment element options with default wallet settings
|
|
80
|
+
* @param defaultValues - Default values for the payment element
|
|
81
|
+
* @param theme - Theme configuration
|
|
82
|
+
* @param hideNameField - Whether to hide the billing details name field (used when address element is present to avoid duplicates with ACH)
|
|
79
83
|
*/
|
|
80
|
-
export function createPaymentElementOptions(defaultValues, theme) {
|
|
81
|
-
|
|
82
|
-
|
|
84
|
+
export function createPaymentElementOptions(defaultValues, theme, hideNameField) {
|
|
85
|
+
if (hideNameField === void 0) { hideNameField = false; }
|
|
86
|
+
var options = __assign(__assign({ wallets: {
|
|
83
87
|
applePay: 'never',
|
|
84
88
|
googlePay: 'never',
|
|
85
89
|
link: 'never',
|
|
90
|
+
} }, (hideNameField && {
|
|
91
|
+
fields: {
|
|
92
|
+
billingDetails: {
|
|
93
|
+
name: 'never', // prevent duplicate Name field on the form when using ACH (only when address element is present)
|
|
94
|
+
},
|
|
86
95
|
},
|
|
87
|
-
}
|
|
96
|
+
})), { terms: {
|
|
97
|
+
usBankAccount: 'never', // Hide Stripe's default T&Cs (shown for ACH payments)
|
|
98
|
+
} });
|
|
88
99
|
if (defaultValues) {
|
|
89
100
|
options.defaultValues = {
|
|
90
101
|
billingDetails: {
|
|
@@ -121,6 +132,41 @@ export function createAddressElementOptions(defaultValues) {
|
|
|
121
132
|
}
|
|
122
133
|
return addressOptions;
|
|
123
134
|
}
|
|
135
|
+
/**
|
|
136
|
+
* Create custom Terms & Conditions element for US Bank Account payments
|
|
137
|
+
* Styling is defined in lightspeed-global-styles.css
|
|
138
|
+
*/
|
|
139
|
+
function createCustomTermsElement() {
|
|
140
|
+
var termsContainer = document.createElement('div');
|
|
141
|
+
termsContainer.className = 'stripe-custom-terms-container';
|
|
142
|
+
termsContainer.style.display = 'none'; // Hidden by default
|
|
143
|
+
var termsText = document.createElement('p');
|
|
144
|
+
termsText.className = 'stripe-custom-terms-text';
|
|
145
|
+
// Build terms HTML with translatable strings
|
|
146
|
+
var stripeTermsLink = "<a href=\"".concat(ACH_TERMS_URL.STRIPE_ACH_AUTHORIZATION, "\" target=\"_blank\" rel=\"noopener noreferrer\">").concat(ACH_TERMS_TEXT.STRIPE_TERMS_LINK_TEXT, "</a>");
|
|
147
|
+
var expandableToggle = "<span class=\"stripe-expandable-terms-toggle\">".concat(ACH_TERMS_TEXT.EXPANDABLE_TERMS_LINK_TEXT, " <span class=\"stripe-terms-triangle\">\u25BC</span></span>");
|
|
148
|
+
termsText.innerHTML = "".concat(ACH_TERMS_TEXT.TERMS_PREFIX, " ").concat(stripeTermsLink, " ").concat(ACH_TERMS_TEXT.TERMS_CONJUNCTION, " ").concat(expandableToggle);
|
|
149
|
+
// Create expandable terms content
|
|
150
|
+
var expandableContent = document.createElement('div');
|
|
151
|
+
expandableContent.className = 'stripe-expandable-terms-content';
|
|
152
|
+
expandableContent.style.display = 'none';
|
|
153
|
+
expandableContent.innerHTML = "<p>".concat(ACH_TERMS_TEXT.EXPANDED_TERMS_CONTENT, "</p>");
|
|
154
|
+
termsContainer.appendChild(termsText);
|
|
155
|
+
termsContainer.appendChild(expandableContent);
|
|
156
|
+
// Add click handler for expandable toggle
|
|
157
|
+
var toggle = termsText.querySelector('.stripe-expandable-terms-toggle');
|
|
158
|
+
var triangle = termsText.querySelector('.stripe-terms-triangle');
|
|
159
|
+
if (toggle && triangle) {
|
|
160
|
+
toggle.addEventListener('click', function (e) {
|
|
161
|
+
e.preventDefault();
|
|
162
|
+
var isExpanded = expandableContent.style.display !== 'none';
|
|
163
|
+
expandableContent.style.display = isExpanded ? 'none' : 'block';
|
|
164
|
+
triangle.textContent = isExpanded ? '▼' : '▲';
|
|
165
|
+
toggle.classList.toggle('expanded', !isExpanded);
|
|
166
|
+
});
|
|
167
|
+
}
|
|
168
|
+
return termsContainer;
|
|
169
|
+
}
|
|
124
170
|
/**
|
|
125
171
|
* Create and mount payment element
|
|
126
172
|
*/
|
|
@@ -133,7 +179,25 @@ export function createPaymentElement(elements, options, mountElement, eventBroad
|
|
|
133
179
|
paymentContainer.className = 'stripe-payment-element-container';
|
|
134
180
|
mountElement.appendChild(paymentContainer);
|
|
135
181
|
paymentElement.mount(paymentContainer);
|
|
136
|
-
|
|
182
|
+
// Create custom terms element for US Bank Account
|
|
183
|
+
var customTermsElement = createCustomTermsElement();
|
|
184
|
+
mountElement.appendChild(customTermsElement);
|
|
185
|
+
// Listen for payment method changes to show/hide custom terms
|
|
186
|
+
paymentElement.on('change', function (event) {
|
|
187
|
+
var _a;
|
|
188
|
+
// Show custom terms only when US Bank Account is selected
|
|
189
|
+
if (((_a = event.value) === null || _a === void 0 ? void 0 : _a.type) === 'us_bank_account') {
|
|
190
|
+
customTermsElement.style.display = 'block';
|
|
191
|
+
}
|
|
192
|
+
else {
|
|
193
|
+
customTermsElement.style.display = 'none';
|
|
194
|
+
}
|
|
195
|
+
});
|
|
196
|
+
return {
|
|
197
|
+
element: paymentElement,
|
|
198
|
+
container: paymentContainer,
|
|
199
|
+
customTermsContainer: customTermsElement,
|
|
200
|
+
};
|
|
137
201
|
}
|
|
138
202
|
/**
|
|
139
203
|
* Create and mount address element
|
|
@@ -149,7 +213,7 @@ export function createAddressElement(elements, options, mountElement) {
|
|
|
149
213
|
/**
|
|
150
214
|
* Clean up elements and containers
|
|
151
215
|
*/
|
|
152
|
-
export function cleanupElements(paymentElement, addressElement, paymentContainer, addressContainer) {
|
|
216
|
+
export function cleanupElements(paymentElement, addressElement, paymentContainer, addressContainer, customTermsContainer) {
|
|
153
217
|
paymentElement.unmount();
|
|
154
218
|
if (addressElement) {
|
|
155
219
|
addressElement.unmount();
|
|
@@ -161,24 +225,44 @@ export function cleanupElements(paymentElement, addressElement, paymentContainer
|
|
|
161
225
|
if (paymentContainer) {
|
|
162
226
|
paymentContainer.remove();
|
|
163
227
|
}
|
|
228
|
+
if (customTermsContainer) {
|
|
229
|
+
customTermsContainer.remove();
|
|
230
|
+
}
|
|
164
231
|
}
|
|
165
232
|
/**
|
|
166
233
|
* Handle save card operation
|
|
167
234
|
*/
|
|
168
|
-
export function handleSaveCard(stripe, elements, session) {
|
|
235
|
+
export function handleSaveCard(stripe, elements, session, addressElement) {
|
|
169
236
|
return __awaiter(this, void 0, void 0, function () {
|
|
170
|
-
var _a, error, setupIntent;
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
return_url: session.context.redirectUrl || window.location.href,
|
|
178
|
-
},
|
|
179
|
-
})];
|
|
237
|
+
var addressValue, _a, billingName, _b, error, setupIntent;
|
|
238
|
+
var _c;
|
|
239
|
+
return __generator(this, function (_d) {
|
|
240
|
+
switch (_d.label) {
|
|
241
|
+
case 0:
|
|
242
|
+
if (!addressElement) return [3 /*break*/, 2];
|
|
243
|
+
return [4 /*yield*/, addressElement.getValue()];
|
|
180
244
|
case 1:
|
|
181
|
-
_a =
|
|
245
|
+
_a = _d.sent();
|
|
246
|
+
return [3 /*break*/, 3];
|
|
247
|
+
case 2:
|
|
248
|
+
_a = null;
|
|
249
|
+
_d.label = 3;
|
|
250
|
+
case 3:
|
|
251
|
+
addressValue = _a;
|
|
252
|
+
billingName = (_c = addressValue === null || addressValue === void 0 ? void 0 : addressValue.value) === null || _c === void 0 ? void 0 : _c.name;
|
|
253
|
+
return [4 /*yield*/, stripe.confirmSetup({
|
|
254
|
+
elements: elements,
|
|
255
|
+
redirect: 'if_required',
|
|
256
|
+
confirmParams: __assign({ return_url: session.context.redirectUrl || window.location.href }, (billingName && {
|
|
257
|
+
payment_method_data: {
|
|
258
|
+
billing_details: {
|
|
259
|
+
name: billingName,
|
|
260
|
+
},
|
|
261
|
+
},
|
|
262
|
+
})),
|
|
263
|
+
})];
|
|
264
|
+
case 4:
|
|
265
|
+
_b = _d.sent(), error = _b.error, setupIntent = _b.setupIntent;
|
|
182
266
|
return [2 /*return*/, error
|
|
183
267
|
? EventBuilder.fromStripeError(error)
|
|
184
268
|
: EventBuilder.fromSetupIntent(setupIntent)];
|
|
@@ -189,20 +273,37 @@ export function handleSaveCard(stripe, elements, session) {
|
|
|
189
273
|
/**
|
|
190
274
|
* Handle payment operation
|
|
191
275
|
*/
|
|
192
|
-
export function handlePayment(stripe, elements, session) {
|
|
276
|
+
export function handlePayment(stripe, elements, session, addressElement) {
|
|
193
277
|
return __awaiter(this, void 0, void 0, function () {
|
|
194
|
-
var _a, error, paymentIntent;
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
return_url: session.context.redirectUrl || window.location.href,
|
|
202
|
-
},
|
|
203
|
-
})];
|
|
278
|
+
var addressValue, _a, billingName, _b, error, paymentIntent;
|
|
279
|
+
var _c;
|
|
280
|
+
return __generator(this, function (_d) {
|
|
281
|
+
switch (_d.label) {
|
|
282
|
+
case 0:
|
|
283
|
+
if (!addressElement) return [3 /*break*/, 2];
|
|
284
|
+
return [4 /*yield*/, addressElement.getValue()];
|
|
204
285
|
case 1:
|
|
205
|
-
_a =
|
|
286
|
+
_a = _d.sent();
|
|
287
|
+
return [3 /*break*/, 3];
|
|
288
|
+
case 2:
|
|
289
|
+
_a = null;
|
|
290
|
+
_d.label = 3;
|
|
291
|
+
case 3:
|
|
292
|
+
addressValue = _a;
|
|
293
|
+
billingName = (_c = addressValue === null || addressValue === void 0 ? void 0 : addressValue.value) === null || _c === void 0 ? void 0 : _c.name;
|
|
294
|
+
return [4 /*yield*/, stripe.confirmPayment({
|
|
295
|
+
elements: elements,
|
|
296
|
+
redirect: 'if_required',
|
|
297
|
+
confirmParams: __assign({ return_url: session.context.redirectUrl || window.location.href }, (billingName && {
|
|
298
|
+
payment_method_data: {
|
|
299
|
+
billing_details: {
|
|
300
|
+
name: billingName,
|
|
301
|
+
},
|
|
302
|
+
},
|
|
303
|
+
})),
|
|
304
|
+
})];
|
|
305
|
+
case 4:
|
|
306
|
+
_b = _d.sent(), error = _b.error, paymentIntent = _b.paymentIntent;
|
|
206
307
|
return [2 /*return*/, error
|
|
207
308
|
? EventBuilder.fromStripeError(error)
|
|
208
309
|
: EventBuilder.fromPaymentIntent(paymentIntent)];
|
|
@@ -213,7 +314,7 @@ export function handlePayment(stripe, elements, session) {
|
|
|
213
314
|
/**
|
|
214
315
|
* Create common submit handler for widgets
|
|
215
316
|
*/
|
|
216
|
-
export function createSubmitHandler(stripe, elements, session, eventBroadcaster) {
|
|
317
|
+
export function createSubmitHandler(stripe, elements, session, eventBroadcaster, addressElement) {
|
|
217
318
|
var _this = this;
|
|
218
319
|
return function () { return __awaiter(_this, void 0, void 0, function () {
|
|
219
320
|
var result;
|
|
@@ -233,13 +334,13 @@ export function createSubmitHandler(stripe, elements, session, eventBroadcaster)
|
|
|
233
334
|
throw new InvalidSessionPayloadError();
|
|
234
335
|
}
|
|
235
336
|
if (!(session.context.intent === 'save-card')) return [3 /*break*/, 2];
|
|
236
|
-
return [4 /*yield*/, handleSaveCard(stripe, elements, session)];
|
|
337
|
+
return [4 /*yield*/, handleSaveCard(stripe, elements, session, addressElement)];
|
|
237
338
|
case 1:
|
|
238
339
|
result = _a.sent();
|
|
239
340
|
_a.label = 2;
|
|
240
341
|
case 2:
|
|
241
342
|
if (!(session.context.intent === 'payment')) return [3 /*break*/, 4];
|
|
242
|
-
return [4 /*yield*/, handlePayment(stripe, elements, session)];
|
|
343
|
+
return [4 /*yield*/, handlePayment(stripe, elements, session, addressElement)];
|
|
243
344
|
case 3:
|
|
244
345
|
result = _a.sent();
|
|
245
346
|
_a.label = 4;
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Translatable strings for Stripe payment elements.
|
|
3
|
+
* These strings are prepared for Transifex extraction.
|
|
4
|
+
*
|
|
5
|
+
* Usage with Transifex:
|
|
6
|
+
* - Extract these strings using Transifex CLI or integration
|
|
7
|
+
* - Replace with translated versions based on locale
|
|
8
|
+
*/
|
|
9
|
+
export declare const ACH_TERMS_TEXT: {
|
|
10
|
+
/**
|
|
11
|
+
* Main terms text displayed for US Bank Account payments.
|
|
12
|
+
* Contains placeholders for links that will be injected.
|
|
13
|
+
*/
|
|
14
|
+
readonly TERMS_PREFIX: "By submitting your payment, you agree to authorize payments pursuant to";
|
|
15
|
+
readonly STRIPE_TERMS_LINK_TEXT: "Stripe's terms";
|
|
16
|
+
readonly TERMS_CONJUNCTION: "and";
|
|
17
|
+
readonly EXPANDABLE_TERMS_LINK_TEXT: "these terms";
|
|
18
|
+
/**
|
|
19
|
+
* Expanded terms content for ACH authorization.
|
|
20
|
+
* This is the detailed legal text shown when user expands "these terms".
|
|
21
|
+
*/
|
|
22
|
+
readonly EXPANDED_TERMS_CONTENT: "By providing your bank account details and confirming this payment, you authorize the merchant to debit your account for the amount shown. If you choose to save your bank account for future payments, this authorization will also apply to any future amounts owed for products or services provided by the merchant, until you cancel it. You also authorize the merchant to credit your account as necessary to correct any erroneous debits. You may revoke authorization at any time by contacting the merchant, allowing up to thirty (30) days for processing. You confirm that you are an authorized signer on the account and that sufficient funds will be available for each payment. ACH payments may take up to five (5) business days to complete, and you may be responsible for fees if a payment is returned.";
|
|
23
|
+
};
|
|
24
|
+
export declare const ACH_TERMS_URL: {
|
|
25
|
+
readonly STRIPE_ACH_AUTHORIZATION: "https://stripe.com/legal/ach-payments/authorization";
|
|
26
|
+
};
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Translatable strings for Stripe payment elements.
|
|
3
|
+
* These strings are prepared for Transifex extraction.
|
|
4
|
+
*
|
|
5
|
+
* Usage with Transifex:
|
|
6
|
+
* - Extract these strings using Transifex CLI or integration
|
|
7
|
+
* - Replace with translated versions based on locale
|
|
8
|
+
*/
|
|
9
|
+
export var ACH_TERMS_TEXT = {
|
|
10
|
+
/**
|
|
11
|
+
* Main terms text displayed for US Bank Account payments.
|
|
12
|
+
* Contains placeholders for links that will be injected.
|
|
13
|
+
*/
|
|
14
|
+
TERMS_PREFIX: 'By submitting your payment, you agree to authorize payments pursuant to',
|
|
15
|
+
STRIPE_TERMS_LINK_TEXT: "Stripe's terms",
|
|
16
|
+
TERMS_CONJUNCTION: 'and',
|
|
17
|
+
EXPANDABLE_TERMS_LINK_TEXT: 'these terms',
|
|
18
|
+
/**
|
|
19
|
+
* Expanded terms content for ACH authorization.
|
|
20
|
+
* This is the detailed legal text shown when user expands "these terms".
|
|
21
|
+
*/
|
|
22
|
+
EXPANDED_TERMS_CONTENT: 'By providing your bank account details and confirming this payment, you authorize the merchant to debit your account for the amount shown. If you choose to save your bank account for future payments, this authorization will also apply to any future amounts owed for products or services provided by the merchant, until you cancel it. You also authorize the merchant to credit your account as necessary to correct any erroneous debits. You may revoke authorization at any time by contacting the merchant, allowing up to thirty (30) days for processing. You confirm that you are an authorized signer on the account and that sufficient funds will be available for each payment. ACH payments may take up to five (5) business days to complete, and you may be responsible for fees if a payment is returned.',
|
|
23
|
+
};
|
|
24
|
+
export var ACH_TERMS_URL = {
|
|
25
|
+
STRIPE_ACH_AUTHORIZATION: 'https://stripe.com/legal/ach-payments/authorization',
|
|
26
|
+
};
|
|
@@ -41,19 +41,19 @@ import { initStripe, createPaymentElementOptions, createPaymentElement, cleanupE
|
|
|
41
41
|
*/
|
|
42
42
|
export function mountMotoWidget(mountElement, session, eventBroadcaster, defaultValues, theme) {
|
|
43
43
|
return __awaiter(this, void 0, void 0, function () {
|
|
44
|
-
var _a, stripe, elements, paymentOptions, _b, paymentElement, paymentContainer;
|
|
44
|
+
var _a, stripe, elements, paymentOptions, _b, paymentElement, paymentContainer, customTermsContainer;
|
|
45
45
|
return __generator(this, function (_c) {
|
|
46
46
|
switch (_c.label) {
|
|
47
47
|
case 0: return [4 /*yield*/, initStripe(session.context, theme)];
|
|
48
48
|
case 1:
|
|
49
49
|
_a = _c.sent(), stripe = _a.stripe, elements = _a.elements;
|
|
50
50
|
paymentOptions = createPaymentElementOptions(defaultValues, theme);
|
|
51
|
-
_b = createPaymentElement(elements, paymentOptions, mountElement, eventBroadcaster), paymentElement = _b.element, paymentContainer = _b.container;
|
|
51
|
+
_b = createPaymentElement(elements, paymentOptions, mountElement, eventBroadcaster), paymentElement = _b.element, paymentContainer = _b.container, customTermsContainer = _b.customTermsContainer;
|
|
52
52
|
return [2 /*return*/, {
|
|
53
53
|
unmount: function () {
|
|
54
|
-
cleanupElements(paymentElement, null, paymentContainer, null);
|
|
54
|
+
cleanupElements(paymentElement, null, paymentContainer, null, customTermsContainer);
|
|
55
55
|
},
|
|
56
|
-
submit: createSubmitHandler(stripe, elements, session, eventBroadcaster),
|
|
56
|
+
submit: createSubmitHandler(stripe, elements, session, eventBroadcaster, null),
|
|
57
57
|
}];
|
|
58
58
|
}
|
|
59
59
|
});
|
|
@@ -40,7 +40,7 @@ import { initStripe, createPaymentElementOptions, createAddressElementOptions, c
|
|
|
40
40
|
*/
|
|
41
41
|
export function mountPaymentWidget(mountElement, session, eventBroadcaster, defaultValues, theme) {
|
|
42
42
|
return __awaiter(this, void 0, void 0, function () {
|
|
43
|
-
var _a, stripe, elements, addressOptions, _b, addressElement, addressContainer, paymentOptions, _c, paymentElement, paymentContainer;
|
|
43
|
+
var _a, stripe, elements, addressOptions, _b, addressElement, addressContainer, paymentOptions, _c, paymentElement, paymentContainer, customTermsContainer;
|
|
44
44
|
return __generator(this, function (_d) {
|
|
45
45
|
switch (_d.label) {
|
|
46
46
|
case 0: return [4 /*yield*/, initStripe(session.context, theme)];
|
|
@@ -48,13 +48,13 @@ export function mountPaymentWidget(mountElement, session, eventBroadcaster, defa
|
|
|
48
48
|
_a = _d.sent(), stripe = _a.stripe, elements = _a.elements;
|
|
49
49
|
addressOptions = createAddressElementOptions(defaultValues);
|
|
50
50
|
_b = createAddressElement(elements, addressOptions, mountElement), addressElement = _b.element, addressContainer = _b.container;
|
|
51
|
-
paymentOptions = createPaymentElementOptions(defaultValues, theme);
|
|
52
|
-
_c = createPaymentElement(elements, paymentOptions, mountElement, eventBroadcaster), paymentElement = _c.element, paymentContainer = _c.container;
|
|
51
|
+
paymentOptions = createPaymentElementOptions(defaultValues, theme, true);
|
|
52
|
+
_c = createPaymentElement(elements, paymentOptions, mountElement, eventBroadcaster), paymentElement = _c.element, paymentContainer = _c.container, customTermsContainer = _c.customTermsContainer;
|
|
53
53
|
return [2 /*return*/, {
|
|
54
54
|
unmount: function () {
|
|
55
|
-
cleanupElements(paymentElement, addressElement, paymentContainer, addressContainer);
|
|
55
|
+
cleanupElements(paymentElement, addressElement, paymentContainer, addressContainer, customTermsContainer);
|
|
56
56
|
},
|
|
57
|
-
submit: createSubmitHandler(stripe, elements, session, eventBroadcaster),
|
|
57
|
+
submit: createSubmitHandler(stripe, elements, session, eventBroadcaster, addressElement),
|
|
58
58
|
}];
|
|
59
59
|
}
|
|
60
60
|
});
|
package/package.json
CHANGED
|
@@ -1 +1,62 @@
|
|
|
1
1
|
@import '@adyen/adyen-web/styles/adyen.css';
|
|
2
|
+
|
|
3
|
+
/* Custom Terms & Conditions for US Bank Account (ACH) payments */
|
|
4
|
+
.stripe-custom-terms-container {
|
|
5
|
+
margin-top: 12px;
|
|
6
|
+
padding: 0;
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
.stripe-custom-terms-text {
|
|
10
|
+
margin: 0;
|
|
11
|
+
font-size: 12px;
|
|
12
|
+
line-height: 16px;
|
|
13
|
+
color: #6b7280;
|
|
14
|
+
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
|
|
15
|
+
font-weight: 400;
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
.stripe-custom-terms-text a {
|
|
19
|
+
color: #635bff;
|
|
20
|
+
text-decoration: underline;
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
.stripe-custom-terms-text a:hover {
|
|
24
|
+
color: #0a2540;
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
/* Expandable terms toggle */
|
|
28
|
+
.stripe-expandable-terms-toggle {
|
|
29
|
+
color: #635bff;
|
|
30
|
+
cursor: pointer;
|
|
31
|
+
text-decoration: underline;
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
.stripe-expandable-terms-toggle:hover {
|
|
35
|
+
color: #0a2540;
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
.stripe-terms-triangle {
|
|
39
|
+
display: inline-block;
|
|
40
|
+
font-size: 10px;
|
|
41
|
+
color: #000000;
|
|
42
|
+
margin-left: 2px;
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
/* Expandable terms content */
|
|
46
|
+
.stripe-expandable-terms-content {
|
|
47
|
+
margin-top: 8px;
|
|
48
|
+
padding: 0;
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
.stripe-expandable-terms-content p {
|
|
52
|
+
margin: 0 0 8px 0;
|
|
53
|
+
font-size: 12px;
|
|
54
|
+
line-height: 18px;
|
|
55
|
+
color: #6b7280;
|
|
56
|
+
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
|
|
57
|
+
font-weight: 400;
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
.stripe-expandable-terms-content p:last-child {
|
|
61
|
+
margin-bottom: 0;
|
|
62
|
+
}
|