orderopia-payments-vue 0.0.1
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 +5 -0
- package/dist/orderopia-payments.js +834 -0
- package/dist/orderopia-payments.umd.cjs +1 -0
- package/dist/style.css +1 -0
- package/dist/vite.svg +1 -0
- package/package.json +47 -0
package/README.md
ADDED
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
# Vue 3 + TypeScript + Vite
|
|
2
|
+
|
|
3
|
+
This template should help get you started developing with Vue 3 and TypeScript in Vite. The template uses Vue 3 `<script setup>` SFCs, check out the [script setup docs](https://v3.vuejs.org/api/sfc-script-setup.html#sfc-script-setup) to learn more.
|
|
4
|
+
|
|
5
|
+
Learn more about the recommended Project Setup and IDE Support in the [Vue Docs TypeScript Guide](https://vuejs.org/guide/typescript/overview.html#project-setup).
|
|
@@ -0,0 +1,834 @@
|
|
|
1
|
+
var W = Object.defineProperty;
|
|
2
|
+
var X = (e, o, a) => o in e ? W(e, o, { enumerable: !0, configurable: !0, writable: !0, value: a }) : e[o] = a;
|
|
3
|
+
var H = (e, o, a) => X(e, typeof o != "symbol" ? o + "" : o, a);
|
|
4
|
+
import { provide as Q, inject as Z, defineComponent as E, renderSlot as ee, ref as S, openBlock as b, createElementBlock as v, unref as x, onMounted as Y, normalizeClass as te, toDisplayString as q, createCommentVNode as L, createElementVNode as f, withModifiers as ae, withDirectives as R, vModelText as T } from "vue";
|
|
5
|
+
const J = Symbol("orderopia-payment-config");
|
|
6
|
+
function oe(e) {
|
|
7
|
+
Q(J, e);
|
|
8
|
+
}
|
|
9
|
+
function G() {
|
|
10
|
+
const e = Z(J, null);
|
|
11
|
+
if (!e)
|
|
12
|
+
throw new Error("Payment config was not provided. Wrap your payment components in OrderopiaPaymentsProvider.");
|
|
13
|
+
return e;
|
|
14
|
+
}
|
|
15
|
+
function se(e) {
|
|
16
|
+
return e === "live" ? "live" : "sandbox";
|
|
17
|
+
}
|
|
18
|
+
function ne(e) {
|
|
19
|
+
const o = se(
|
|
20
|
+
e.environment || "sandbox"
|
|
21
|
+
), a = e.apiBaseUrl || "https://pay.orderopia.com", t = e.opayoHost || "https://sandbox.opayo.eu.elavon.com", i = e.opayoApiBaseUrl || "https://sandbox.opayo.eu.elavon.com/api/v1";
|
|
22
|
+
return {
|
|
23
|
+
sessionId: e.sessionId,
|
|
24
|
+
apiBaseUrl: a,
|
|
25
|
+
returnUrl: e.returnUrl,
|
|
26
|
+
merchantReference: e.merchantReference,
|
|
27
|
+
environment: o,
|
|
28
|
+
opayoHost: t,
|
|
29
|
+
opayoApiBaseUrl: i,
|
|
30
|
+
customer: e.customer,
|
|
31
|
+
billingAddress: e.billingAddress,
|
|
32
|
+
saveCard: e.saveCard,
|
|
33
|
+
googlePay: e.googlePay ? {
|
|
34
|
+
merchantName: e.googlePay.merchantName,
|
|
35
|
+
merchantId: e.googlePay.merchantId,
|
|
36
|
+
gatewayMerchantId: e.googlePay.gatewayMerchantId,
|
|
37
|
+
countryCode: e.googlePay.countryCode,
|
|
38
|
+
currencyCode: e.googlePay.currencyCode,
|
|
39
|
+
totalPrice: e.googlePay.totalPrice,
|
|
40
|
+
totalPriceStatus: e.googlePay.totalPriceStatus || "FINAL",
|
|
41
|
+
allowedCardNetworks: e.googlePay.allowedCardNetworks || ["MASTERCARD", "VISA"],
|
|
42
|
+
allowedAuthMethods: e.googlePay.allowedAuthMethods || ["PAN_ONLY", "CRYPTOGRAM_3DS"],
|
|
43
|
+
buttonColor: e.googlePay.buttonColor || "black",
|
|
44
|
+
buttonType: e.googlePay.buttonType || "pay"
|
|
45
|
+
} : void 0,
|
|
46
|
+
applePay: e.applePay ? {
|
|
47
|
+
merchantIdentifier: e.applePay.merchantIdentifier,
|
|
48
|
+
merchantName: e.applePay.merchantName,
|
|
49
|
+
countryCode: e.applePay.countryCode,
|
|
50
|
+
currencyCode: e.applePay.currencyCode,
|
|
51
|
+
supportedNetworks: e.applePay.supportedNetworks || ["visa", "masterCard"],
|
|
52
|
+
merchantCapabilities: e.applePay.merchantCapabilities || ["supports3DS"],
|
|
53
|
+
totalLabel: e.applePay.totalLabel,
|
|
54
|
+
totalAmount: e.applePay.totalAmount,
|
|
55
|
+
buttonStyle: e.applePay.buttonStyle || "black",
|
|
56
|
+
buttonType: e.applePay.buttonType || "buy"
|
|
57
|
+
} : void 0
|
|
58
|
+
};
|
|
59
|
+
}
|
|
60
|
+
const Ye = /* @__PURE__ */ E({
|
|
61
|
+
__name: "OrderopiaPaymentsProvider",
|
|
62
|
+
props: {
|
|
63
|
+
config: {}
|
|
64
|
+
},
|
|
65
|
+
setup(e) {
|
|
66
|
+
const a = ne(e.config);
|
|
67
|
+
return oe(a), (t, i) => ee(t.$slots, "default");
|
|
68
|
+
}
|
|
69
|
+
});
|
|
70
|
+
class $ {
|
|
71
|
+
constructor(o) {
|
|
72
|
+
H(this, "apiBaseUrl");
|
|
73
|
+
this.apiBaseUrl = o;
|
|
74
|
+
}
|
|
75
|
+
async startPayment(o) {
|
|
76
|
+
const a = await fetch(
|
|
77
|
+
`${this.apiBaseUrl}/checkout/sessions/${o.checkoutSessionId}/start-payment`,
|
|
78
|
+
{
|
|
79
|
+
method: "POST",
|
|
80
|
+
headers: {
|
|
81
|
+
"Content-Type": "application/json"
|
|
82
|
+
},
|
|
83
|
+
body: JSON.stringify({
|
|
84
|
+
paymentMethod: o.paymentMethod,
|
|
85
|
+
returnUrl: o.returnUrl
|
|
86
|
+
})
|
|
87
|
+
}
|
|
88
|
+
);
|
|
89
|
+
if (!a.ok)
|
|
90
|
+
throw new Error("Failed to start payment");
|
|
91
|
+
return await a.json();
|
|
92
|
+
}
|
|
93
|
+
async getSessionStatus(o) {
|
|
94
|
+
const a = await fetch(
|
|
95
|
+
`${this.apiBaseUrl}/checkout/sessions/${o}`,
|
|
96
|
+
{
|
|
97
|
+
method: "GET",
|
|
98
|
+
headers: {
|
|
99
|
+
"Content-Type": "application/json"
|
|
100
|
+
}
|
|
101
|
+
}
|
|
102
|
+
);
|
|
103
|
+
if (!a.ok)
|
|
104
|
+
throw new Error("Failed to get checkout session status");
|
|
105
|
+
return await a.json();
|
|
106
|
+
}
|
|
107
|
+
async getOpayoMerchantSessionKey(o) {
|
|
108
|
+
const a = await fetch(
|
|
109
|
+
`${this.apiBaseUrl}/checkout/sessions/${o}/opayo/merchant-session-key`,
|
|
110
|
+
{
|
|
111
|
+
method: "POST",
|
|
112
|
+
headers: {
|
|
113
|
+
"Content-Type": "application/json"
|
|
114
|
+
}
|
|
115
|
+
}
|
|
116
|
+
);
|
|
117
|
+
if (!a.ok)
|
|
118
|
+
throw new Error("Failed to get Opayo merchant session key");
|
|
119
|
+
return await a.json();
|
|
120
|
+
}
|
|
121
|
+
async getApplePaySession(o) {
|
|
122
|
+
const a = await fetch(
|
|
123
|
+
`${this.apiBaseUrl}/checkout/sessions/${o}/opayo/apple-pay/merchant-session`,
|
|
124
|
+
{
|
|
125
|
+
method: "POST",
|
|
126
|
+
headers: {
|
|
127
|
+
"Content-Type": "application/json"
|
|
128
|
+
},
|
|
129
|
+
body: JSON.stringify({
|
|
130
|
+
domainName: window.location.origin
|
|
131
|
+
})
|
|
132
|
+
}
|
|
133
|
+
);
|
|
134
|
+
if (!a.ok)
|
|
135
|
+
throw new Error("Failed to get Apple Pay merchant session");
|
|
136
|
+
return await a.json();
|
|
137
|
+
}
|
|
138
|
+
async getApplePayMerchantSession(o, a) {
|
|
139
|
+
const t = await fetch(
|
|
140
|
+
`${this.apiBaseUrl}/checkout/sessions/${o}/apple-pay/merchant-session`,
|
|
141
|
+
{
|
|
142
|
+
method: "POST",
|
|
143
|
+
headers: {
|
|
144
|
+
"Content-Type": "application/json"
|
|
145
|
+
},
|
|
146
|
+
body: JSON.stringify(a)
|
|
147
|
+
}
|
|
148
|
+
);
|
|
149
|
+
if (!t.ok)
|
|
150
|
+
throw new Error("Failed to get Apple Pay merchant session");
|
|
151
|
+
return await t.json();
|
|
152
|
+
}
|
|
153
|
+
async createCheckoutPayment(o) {
|
|
154
|
+
const a = await fetch(
|
|
155
|
+
`${this.apiBaseUrl}/checkout/sessions/${o.checkoutSessionId}/opayo/card-payment`,
|
|
156
|
+
{
|
|
157
|
+
method: "POST",
|
|
158
|
+
headers: {
|
|
159
|
+
"Content-Type": "application/json"
|
|
160
|
+
},
|
|
161
|
+
body: JSON.stringify(o)
|
|
162
|
+
}
|
|
163
|
+
);
|
|
164
|
+
if (!a.ok)
|
|
165
|
+
throw new Error("Failed to create checkout payment");
|
|
166
|
+
return await a.json();
|
|
167
|
+
}
|
|
168
|
+
}
|
|
169
|
+
function re(e) {
|
|
170
|
+
const o = S(!1), a = S(null);
|
|
171
|
+
return {
|
|
172
|
+
loading: o,
|
|
173
|
+
error: a,
|
|
174
|
+
startPayment: async (n) => {
|
|
175
|
+
o.value = !0, a.value = null;
|
|
176
|
+
try {
|
|
177
|
+
const d = new $(e.apiBaseUrl), l = await d.startPayment({
|
|
178
|
+
checkoutSessionId: e.sessionId,
|
|
179
|
+
paymentMethod: n.paymentMethod,
|
|
180
|
+
returnUrl: e.returnUrl
|
|
181
|
+
});
|
|
182
|
+
if (!l.success)
|
|
183
|
+
throw {
|
|
184
|
+
message: l.message || "Payment failed"
|
|
185
|
+
};
|
|
186
|
+
if (l.redirectUrl) {
|
|
187
|
+
const m = {
|
|
188
|
+
checkoutSessionId: e.sessionId,
|
|
189
|
+
paymentReference: l.paymentReference,
|
|
190
|
+
status: "Redirecting"
|
|
191
|
+
};
|
|
192
|
+
return window.location.href = l.redirectUrl, m;
|
|
193
|
+
}
|
|
194
|
+
const s = await d.getSessionStatus(e.sessionId);
|
|
195
|
+
if (s.status !== "Paid" && s.status !== "Completed")
|
|
196
|
+
throw {
|
|
197
|
+
message: s.message || "Payment not completed"
|
|
198
|
+
};
|
|
199
|
+
return {
|
|
200
|
+
checkoutSessionId: s.checkoutSessionId,
|
|
201
|
+
paymentReference: s.paymentReference,
|
|
202
|
+
orderId: s.orderId,
|
|
203
|
+
bookingId: s.bookingId,
|
|
204
|
+
status: s.status
|
|
205
|
+
};
|
|
206
|
+
} catch (d) {
|
|
207
|
+
throw a.value = (d == null ? void 0 : d.message) || "Unknown payment error", {
|
|
208
|
+
message: a.value,
|
|
209
|
+
code: d == null ? void 0 : d.code
|
|
210
|
+
};
|
|
211
|
+
} finally {
|
|
212
|
+
o.value = !1;
|
|
213
|
+
}
|
|
214
|
+
},
|
|
215
|
+
createStartedEvent: (n) => ({
|
|
216
|
+
checkoutSessionId: e.sessionId,
|
|
217
|
+
paymentMethod: n
|
|
218
|
+
}),
|
|
219
|
+
createFailedEvent: (n, d) => ({
|
|
220
|
+
checkoutSessionId: e.sessionId,
|
|
221
|
+
paymentMethod: n,
|
|
222
|
+
message: d.message,
|
|
223
|
+
code: d.code
|
|
224
|
+
})
|
|
225
|
+
};
|
|
226
|
+
}
|
|
227
|
+
const ie = ["disabled"], le = { key: 0 }, de = { key: 1 }, F = "card", ce = /* @__PURE__ */ E({
|
|
228
|
+
__name: "PayButton",
|
|
229
|
+
props: {
|
|
230
|
+
disabled: { type: Boolean }
|
|
231
|
+
},
|
|
232
|
+
emits: ["started", "success", "failed"],
|
|
233
|
+
setup(e, { emit: o }) {
|
|
234
|
+
const a = o, t = G(), { loading: i, startPayment: u, createStartedEvent: n, createFailedEvent: d } = re(t), l = async () => {
|
|
235
|
+
a("started", n(F));
|
|
236
|
+
try {
|
|
237
|
+
const s = await u({
|
|
238
|
+
paymentMethod: F
|
|
239
|
+
});
|
|
240
|
+
a("success", s);
|
|
241
|
+
} catch (s) {
|
|
242
|
+
a("failed", d(F, s));
|
|
243
|
+
}
|
|
244
|
+
};
|
|
245
|
+
return (s, m) => (b(), v("button", {
|
|
246
|
+
class: "op-payment-button",
|
|
247
|
+
disabled: e.disabled || x(i),
|
|
248
|
+
onClick: l
|
|
249
|
+
}, [
|
|
250
|
+
x(i) ? (b(), v("span", le, "Processing...")) : (b(), v("span", de, "Pay Now"))
|
|
251
|
+
], 8, ie));
|
|
252
|
+
}
|
|
253
|
+
}), D = (e, o) => {
|
|
254
|
+
const a = e.__vccOpts || e;
|
|
255
|
+
for (const [t, i] of o)
|
|
256
|
+
a[t] = i;
|
|
257
|
+
return a;
|
|
258
|
+
}, Je = /* @__PURE__ */ D(ce, [["__scopeId", "data-v-8b98b0e7"]]);
|
|
259
|
+
function K() {
|
|
260
|
+
return typeof window < "u" && !!window.ApplePaySession;
|
|
261
|
+
}
|
|
262
|
+
function pe(e = 3) {
|
|
263
|
+
return K() && window.ApplePaySession.supportsVersion(e);
|
|
264
|
+
}
|
|
265
|
+
function ue() {
|
|
266
|
+
return K() && window.ApplePaySession.canMakePayments();
|
|
267
|
+
}
|
|
268
|
+
function ye(e) {
|
|
269
|
+
if (!e.applePay)
|
|
270
|
+
throw new Error("Apple Pay config is missing");
|
|
271
|
+
return {
|
|
272
|
+
countryCode: e.applePay.countryCode,
|
|
273
|
+
currencyCode: e.applePay.currencyCode,
|
|
274
|
+
supportedNetworks: e.applePay.supportedNetworks || ["visa", "masterCard"],
|
|
275
|
+
merchantCapabilities: e.applePay.merchantCapabilities || ["supports3DS"],
|
|
276
|
+
total: {
|
|
277
|
+
label: e.applePay.totalLabel,
|
|
278
|
+
amount: e.applePay.totalAmount,
|
|
279
|
+
type: "final"
|
|
280
|
+
},
|
|
281
|
+
requiredBillingContactFields: ["postalAddress", "name", "email", "phone"]
|
|
282
|
+
};
|
|
283
|
+
}
|
|
284
|
+
function me(e, o) {
|
|
285
|
+
if (!e.applePay)
|
|
286
|
+
throw new Error("Apple Pay config is missing");
|
|
287
|
+
return {
|
|
288
|
+
validationUrl: o,
|
|
289
|
+
domainName: window.location.hostname,
|
|
290
|
+
displayName: e.applePay.merchantName
|
|
291
|
+
};
|
|
292
|
+
}
|
|
293
|
+
function j() {
|
|
294
|
+
return {
|
|
295
|
+
customerIPAddress: "",
|
|
296
|
+
browserAcceptHeader: "text/html,application/xhtml+xml,application/xml;q=0.9,/;q=0.8",
|
|
297
|
+
browserJavasriptEnabled: !0,
|
|
298
|
+
browserJavaEnabled: !1,
|
|
299
|
+
browserLanguage: navigator.language || "en-GB",
|
|
300
|
+
browserColorDepth: window.screen.colorDepth || 24,
|
|
301
|
+
browserHeight: String(window.screen.height || 0),
|
|
302
|
+
browserWidth: String(window.screen.width || 0),
|
|
303
|
+
browserTimezone: String((/* @__PURE__ */ new Date()).getTimezoneOffset()),
|
|
304
|
+
browserUserAgentHeader: navigator.userAgent
|
|
305
|
+
};
|
|
306
|
+
}
|
|
307
|
+
const he = { class: "apple-pay-wrap" }, ge = ["disabled"], we = { key: 0 }, Pe = { key: 1 }, fe = {
|
|
308
|
+
key: 1,
|
|
309
|
+
class: "apple-pay-status apple-pay-error"
|
|
310
|
+
}, be = /* @__PURE__ */ E({
|
|
311
|
+
__name: "ApplePayButton",
|
|
312
|
+
props: {
|
|
313
|
+
disabled: { type: Boolean }
|
|
314
|
+
},
|
|
315
|
+
emits: ["started", "success", "failed"],
|
|
316
|
+
setup(e, { emit: o }) {
|
|
317
|
+
const a = o, t = G(), i = S(!1), u = S(!1), n = S("");
|
|
318
|
+
Y(() => {
|
|
319
|
+
if (!t.applePay) {
|
|
320
|
+
n.value = "Apple Pay config is missing.";
|
|
321
|
+
return;
|
|
322
|
+
}
|
|
323
|
+
if (!pe(3)) {
|
|
324
|
+
n.value = "Apple Pay is not supported in this browser.";
|
|
325
|
+
return;
|
|
326
|
+
}
|
|
327
|
+
if (!ue()) {
|
|
328
|
+
n.value = "Apple Pay is not available on this device.";
|
|
329
|
+
return;
|
|
330
|
+
}
|
|
331
|
+
u.value = !0;
|
|
332
|
+
});
|
|
333
|
+
async function d() {
|
|
334
|
+
if (n.value = "", !t.applePay) {
|
|
335
|
+
const l = "Apple Pay config is missing.";
|
|
336
|
+
n.value = l, a("failed", {
|
|
337
|
+
checkoutSessionId: t.sessionId,
|
|
338
|
+
paymentMethod: "apple_pay",
|
|
339
|
+
message: l
|
|
340
|
+
});
|
|
341
|
+
return;
|
|
342
|
+
}
|
|
343
|
+
a("started", {
|
|
344
|
+
checkoutSessionId: t.sessionId,
|
|
345
|
+
paymentMethod: "apple_pay"
|
|
346
|
+
}), i.value = !0;
|
|
347
|
+
try {
|
|
348
|
+
const l = ye(t), s = new window.ApplePaySession(3, l), m = new $(t.apiBaseUrl);
|
|
349
|
+
s.onvalidatemerchant = async (c) => {
|
|
350
|
+
try {
|
|
351
|
+
const I = await m.getApplePayMerchantSession(
|
|
352
|
+
t.sessionId,
|
|
353
|
+
me(t, c.validationURL)
|
|
354
|
+
);
|
|
355
|
+
s.completeMerchantValidation(I);
|
|
356
|
+
} catch (I) {
|
|
357
|
+
throw s.abort(), I;
|
|
358
|
+
}
|
|
359
|
+
}, s.onpaymentauthorized = async (c) => {
|
|
360
|
+
var I, p, r, y, k, A, g, _;
|
|
361
|
+
try {
|
|
362
|
+
const C = {
|
|
363
|
+
token: c.payment.token,
|
|
364
|
+
billingContact: c.payment.billingContact,
|
|
365
|
+
shippingContact: c.payment.shippingContact
|
|
366
|
+
}, w = {
|
|
367
|
+
checkoutSessionId: t.sessionId,
|
|
368
|
+
customerFirstName: ((I = t.customer) == null ? void 0 : I.firstName) || ((p = c.payment.billingContact) == null ? void 0 : p.givenName),
|
|
369
|
+
customerLastName: ((r = t.customer) == null ? void 0 : r.lastName) || ((y = c.payment.billingContact) == null ? void 0 : y.familyName),
|
|
370
|
+
customerEmailAddress: ((k = t.customer) == null ? void 0 : k.emailAddress) || ((A = c.payment.billingContact) == null ? void 0 : A.emailAddress),
|
|
371
|
+
customerPhoneNumber: ((g = t.customer) == null ? void 0 : g.phoneNumber) || ((_ = c.payment.billingContact) == null ? void 0 : _.phoneNumber),
|
|
372
|
+
saveCard: t.saveCard ?? !1,
|
|
373
|
+
billingAddress: t.billingAddress,
|
|
374
|
+
browserInformation: j(),
|
|
375
|
+
applePayInfo: {
|
|
376
|
+
payload: JSON.stringify(C)
|
|
377
|
+
}
|
|
378
|
+
}, P = await m.createCheckoutPayment(w);
|
|
379
|
+
if (!P.success)
|
|
380
|
+
throw s.completePayment(window.ApplePaySession.STATUS_FAILURE), new Error(P.message || "Apple Pay payment failed");
|
|
381
|
+
if (P.redirectUrl) {
|
|
382
|
+
s.completePayment(window.ApplePaySession.STATUS_SUCCESS), window.location.href = P.redirectUrl;
|
|
383
|
+
return;
|
|
384
|
+
}
|
|
385
|
+
const h = await m.getSessionStatus(t.sessionId);
|
|
386
|
+
if (h.status !== "Paid" && h.status !== "Completed")
|
|
387
|
+
throw s.completePayment(window.ApplePaySession.STATUS_FAILURE), new Error(h.message || "Payment not completed");
|
|
388
|
+
s.completePayment(window.ApplePaySession.STATUS_SUCCESS), a("success", {
|
|
389
|
+
checkoutSessionId: h.checkoutSessionId,
|
|
390
|
+
paymentReference: h.paymentReference,
|
|
391
|
+
orderId: h.orderId,
|
|
392
|
+
bookingId: h.bookingId,
|
|
393
|
+
status: h.status
|
|
394
|
+
});
|
|
395
|
+
} catch (C) {
|
|
396
|
+
s.completePayment(window.ApplePaySession.STATUS_FAILURE);
|
|
397
|
+
const w = (C == null ? void 0 : C.message) || "Unable to process Apple Pay payment.";
|
|
398
|
+
n.value = w, a("failed", {
|
|
399
|
+
checkoutSessionId: t.sessionId,
|
|
400
|
+
paymentMethod: "apple_pay",
|
|
401
|
+
message: w
|
|
402
|
+
});
|
|
403
|
+
} finally {
|
|
404
|
+
i.value = !1;
|
|
405
|
+
}
|
|
406
|
+
}, s.oncancel = () => {
|
|
407
|
+
i.value = !1;
|
|
408
|
+
}, s.begin();
|
|
409
|
+
} catch (l) {
|
|
410
|
+
i.value = !1;
|
|
411
|
+
const s = (l == null ? void 0 : l.message) || "Unable to initialise Apple Pay.";
|
|
412
|
+
n.value = s, a("failed", {
|
|
413
|
+
checkoutSessionId: t.sessionId,
|
|
414
|
+
paymentMethod: "apple_pay",
|
|
415
|
+
message: s
|
|
416
|
+
});
|
|
417
|
+
}
|
|
418
|
+
}
|
|
419
|
+
return (l, s) => {
|
|
420
|
+
var m, c;
|
|
421
|
+
return b(), v("div", he, [
|
|
422
|
+
u.value ? (b(), v("button", {
|
|
423
|
+
key: 0,
|
|
424
|
+
class: te(["apple-pay-button", [
|
|
425
|
+
`apple-pay-button--${((m = x(t).applePay) == null ? void 0 : m.buttonStyle) || "black"}`,
|
|
426
|
+
`apple-pay-button--${((c = x(t).applePay) == null ? void 0 : c.buttonType) || "buy"}`
|
|
427
|
+
]]),
|
|
428
|
+
disabled: e.disabled || i.value,
|
|
429
|
+
onClick: d
|
|
430
|
+
}, [
|
|
431
|
+
i.value ? (b(), v("span", we, "Processing...")) : (b(), v("span", Pe, "Apple Pay"))
|
|
432
|
+
], 10, ge)) : n.value ? (b(), v("div", fe, q(n.value), 1)) : L("", !0)
|
|
433
|
+
]);
|
|
434
|
+
};
|
|
435
|
+
}
|
|
436
|
+
}), Ke = /* @__PURE__ */ D(be, [["__scopeId", "data-v-15ec9241"]]);
|
|
437
|
+
let B = null;
|
|
438
|
+
function ve() {
|
|
439
|
+
var e, o, a;
|
|
440
|
+
return (a = (o = (e = window.google) == null ? void 0 : e.payments) == null ? void 0 : o.api) != null && a.PaymentsClient ? Promise.resolve() : B || (B = new Promise((t, i) => {
|
|
441
|
+
const u = document.querySelector(
|
|
442
|
+
'script[data-google-pay-script="true"]'
|
|
443
|
+
);
|
|
444
|
+
if (u) {
|
|
445
|
+
u.addEventListener("load", () => t()), u.addEventListener(
|
|
446
|
+
"error",
|
|
447
|
+
() => i(new Error("Failed to load Google Pay script"))
|
|
448
|
+
);
|
|
449
|
+
return;
|
|
450
|
+
}
|
|
451
|
+
const n = document.createElement("script");
|
|
452
|
+
n.src = "https://pay.google.com/gp/p/js/pay.js", n.async = !0, n.setAttribute("data-google-pay-script", "true"), n.onload = () => t(), n.onerror = () => i(new Error("Failed to load Google Pay script")), document.head.appendChild(n);
|
|
453
|
+
}), B);
|
|
454
|
+
}
|
|
455
|
+
function V(e) {
|
|
456
|
+
var o, a, t;
|
|
457
|
+
if (!((t = (a = (o = window.google) == null ? void 0 : o.payments) == null ? void 0 : a.api) != null && t.PaymentsClient))
|
|
458
|
+
throw new Error("Google Pay script is not available");
|
|
459
|
+
return new window.google.payments.api.PaymentsClient({
|
|
460
|
+
environment: e.environment === "live" ? "PRODUCTION" : "TEST"
|
|
461
|
+
});
|
|
462
|
+
}
|
|
463
|
+
function z() {
|
|
464
|
+
return {
|
|
465
|
+
apiVersion: 2,
|
|
466
|
+
apiVersionMinor: 0
|
|
467
|
+
};
|
|
468
|
+
}
|
|
469
|
+
function Ce(e) {
|
|
470
|
+
if (!e.googlePay)
|
|
471
|
+
throw new Error("Google Pay config is missing");
|
|
472
|
+
return {
|
|
473
|
+
type: "CARD",
|
|
474
|
+
parameters: {
|
|
475
|
+
allowedAuthMethods: e.googlePay.allowedAuthMethods,
|
|
476
|
+
allowedCardNetworks: e.googlePay.allowedCardNetworks
|
|
477
|
+
},
|
|
478
|
+
tokenizationSpecification: {
|
|
479
|
+
type: "PAYMENT_GATEWAY",
|
|
480
|
+
parameters: {
|
|
481
|
+
gateway: "opayoelavon",
|
|
482
|
+
gatewayMerchantId: e.googlePay.gatewayMerchantId
|
|
483
|
+
}
|
|
484
|
+
}
|
|
485
|
+
};
|
|
486
|
+
}
|
|
487
|
+
function Se(e) {
|
|
488
|
+
var o, a;
|
|
489
|
+
return {
|
|
490
|
+
...z(),
|
|
491
|
+
allowedPaymentMethods: [
|
|
492
|
+
{
|
|
493
|
+
type: "CARD",
|
|
494
|
+
parameters: {
|
|
495
|
+
allowedAuthMethods: ((o = e.googlePay) == null ? void 0 : o.allowedAuthMethods) || [
|
|
496
|
+
"PAN_ONLY",
|
|
497
|
+
"CRYPTOGRAM_3DS"
|
|
498
|
+
],
|
|
499
|
+
allowedCardNetworks: ((a = e.googlePay) == null ? void 0 : a.allowedCardNetworks) || [
|
|
500
|
+
"MASTERCARD",
|
|
501
|
+
"VISA"
|
|
502
|
+
]
|
|
503
|
+
}
|
|
504
|
+
}
|
|
505
|
+
]
|
|
506
|
+
};
|
|
507
|
+
}
|
|
508
|
+
function Ie(e) {
|
|
509
|
+
if (!e.googlePay)
|
|
510
|
+
throw new Error("Google Pay config is missing");
|
|
511
|
+
const o = {
|
|
512
|
+
...z(),
|
|
513
|
+
merchantInfo: {
|
|
514
|
+
merchantName: e.googlePay.merchantName
|
|
515
|
+
},
|
|
516
|
+
allowedPaymentMethods: [Ce(e)],
|
|
517
|
+
transactionInfo: {
|
|
518
|
+
totalPriceStatus: e.googlePay.totalPriceStatus,
|
|
519
|
+
totalPrice: e.googlePay.totalPrice,
|
|
520
|
+
currencyCode: e.googlePay.currencyCode,
|
|
521
|
+
countryCode: e.googlePay.countryCode
|
|
522
|
+
},
|
|
523
|
+
emailRequired: !0
|
|
524
|
+
};
|
|
525
|
+
return e.environment === "live" && e.googlePay.merchantId && (o.merchantInfo.merchantId = e.googlePay.merchantId), o;
|
|
526
|
+
}
|
|
527
|
+
const ke = { class: "google-pay-wrap" }, Ae = {
|
|
528
|
+
key: 0,
|
|
529
|
+
class: "google-pay-status"
|
|
530
|
+
}, _e = {
|
|
531
|
+
key: 1,
|
|
532
|
+
class: "google-pay-status google-pay-error"
|
|
533
|
+
}, Ue = /* @__PURE__ */ E({
|
|
534
|
+
__name: "GooglePayButton",
|
|
535
|
+
emits: ["started", "success", "failed"],
|
|
536
|
+
setup(e, { emit: o }) {
|
|
537
|
+
const a = o, t = G(), i = S(null), u = S(!0), n = S("");
|
|
538
|
+
async function d() {
|
|
539
|
+
if (!t.googlePay) {
|
|
540
|
+
n.value = "Google Pay config is missing.", u.value = !1;
|
|
541
|
+
return;
|
|
542
|
+
}
|
|
543
|
+
try {
|
|
544
|
+
await ve();
|
|
545
|
+
const s = V(t), m = Se(t), c = await s.isReadyToPay(m);
|
|
546
|
+
if (!(c != null && c.result)) {
|
|
547
|
+
n.value = "Google Pay is not available on this device/browser.", u.value = !1;
|
|
548
|
+
return;
|
|
549
|
+
}
|
|
550
|
+
const I = s.createButton({
|
|
551
|
+
onClick: l,
|
|
552
|
+
allowedPaymentMethods: m.allowedPaymentMethods,
|
|
553
|
+
buttonColor: t.googlePay.buttonColor,
|
|
554
|
+
buttonType: t.googlePay.buttonType
|
|
555
|
+
});
|
|
556
|
+
i.value && (i.value.innerHTML = "", i.value.appendChild(I));
|
|
557
|
+
} catch (s) {
|
|
558
|
+
n.value = (s == null ? void 0 : s.message) || "Failed to initialise Google Pay.";
|
|
559
|
+
} finally {
|
|
560
|
+
u.value = !1;
|
|
561
|
+
}
|
|
562
|
+
}
|
|
563
|
+
async function l() {
|
|
564
|
+
var s, m, c, I;
|
|
565
|
+
if (n.value = "", !t.googlePay) {
|
|
566
|
+
const p = "Google Pay config is missing.";
|
|
567
|
+
n.value = p, a("failed", {
|
|
568
|
+
checkoutSessionId: t.sessionId,
|
|
569
|
+
paymentMethod: "google_pay",
|
|
570
|
+
message: p
|
|
571
|
+
});
|
|
572
|
+
return;
|
|
573
|
+
}
|
|
574
|
+
a("started", {
|
|
575
|
+
checkoutSessionId: t.sessionId,
|
|
576
|
+
paymentMethod: "google_pay"
|
|
577
|
+
});
|
|
578
|
+
try {
|
|
579
|
+
const p = V(t), r = Ie(t), k = (await p.loadPaymentData(r)).paymentMethodData.tokenizationData.token;
|
|
580
|
+
if (!k)
|
|
581
|
+
throw new Error("Google Pay token is missing.");
|
|
582
|
+
const A = new $(t.apiBaseUrl), g = btoa(k), _ = {
|
|
583
|
+
checkoutSessionId: t.sessionId,
|
|
584
|
+
customerFirstName: (s = t.customer) == null ? void 0 : s.firstName,
|
|
585
|
+
customerLastName: (m = t.customer) == null ? void 0 : m.lastName,
|
|
586
|
+
customerEmailAddress: (c = t.customer) == null ? void 0 : c.emailAddress,
|
|
587
|
+
customerPhoneNumber: (I = t.customer) == null ? void 0 : I.phoneNumber,
|
|
588
|
+
saveCard: t.saveCard ?? !1,
|
|
589
|
+
billingAddress: t.billingAddress,
|
|
590
|
+
browserInformation: j(),
|
|
591
|
+
googlePayInfo: {
|
|
592
|
+
payload: g
|
|
593
|
+
}
|
|
594
|
+
}, C = await A.createCheckoutPayment(_);
|
|
595
|
+
if (!C.success)
|
|
596
|
+
throw new Error(C.message || "Google Pay payment failed");
|
|
597
|
+
if (C.redirectUrl) {
|
|
598
|
+
window.location.href = C.redirectUrl;
|
|
599
|
+
return;
|
|
600
|
+
}
|
|
601
|
+
const w = await A.getSessionStatus(t.sessionId);
|
|
602
|
+
if (w.status !== "Paid" && w.status !== "Completed")
|
|
603
|
+
throw new Error(w.message || "Payment not completed");
|
|
604
|
+
a("success", {
|
|
605
|
+
checkoutSessionId: w.checkoutSessionId,
|
|
606
|
+
paymentReference: w.paymentReference,
|
|
607
|
+
orderId: w.orderId,
|
|
608
|
+
bookingId: w.bookingId,
|
|
609
|
+
status: w.status
|
|
610
|
+
});
|
|
611
|
+
} catch (p) {
|
|
612
|
+
const r = (p == null ? void 0 : p.message) || "Unable to process Google Pay payment.";
|
|
613
|
+
n.value = r, a("failed", {
|
|
614
|
+
checkoutSessionId: t.sessionId,
|
|
615
|
+
paymentMethod: "google_pay",
|
|
616
|
+
message: r
|
|
617
|
+
});
|
|
618
|
+
}
|
|
619
|
+
}
|
|
620
|
+
return Y(() => {
|
|
621
|
+
d();
|
|
622
|
+
}), (s, m) => (b(), v("div", ke, [
|
|
623
|
+
u.value ? (b(), v("div", Ae, "Loading Google Pay...")) : n.value ? (b(), v("div", _e, q(n.value), 1)) : L("", !0),
|
|
624
|
+
f("div", {
|
|
625
|
+
ref_key: "buttonContainer",
|
|
626
|
+
ref: i
|
|
627
|
+
}, null, 512)
|
|
628
|
+
]));
|
|
629
|
+
}
|
|
630
|
+
}), ze = /* @__PURE__ */ D(Ue, [["__scopeId", "data-v-a9cb32d9"]]);
|
|
631
|
+
let O = null;
|
|
632
|
+
function Ee(e) {
|
|
633
|
+
return window.opayoOwnForm ? (window.OpayoConfig && (e == null ? void 0 : e.environment) === "sandbox" && (window.OpayoConfig.restHost = e.opayoHost, window.OpayoConfig.restBaseURL = e.opayoApiBaseUrl), Promise.resolve()) : O || (O = new Promise((o, a) => {
|
|
634
|
+
const t = document.createElement("script");
|
|
635
|
+
t.src = "https://assets.ci.opayo.cloud/assets/js/opayo-1.2.40.js", t.integrity = "sha512-ZplJXUTeRh13LTLjfwydrUFpRJaHOoSIKdoMQP4s1gWyJoXqsTqxBeGdt4fQyfNq/Xo21u8IGaA3PjLfiefZJw==", t.crossOrigin = "anonymous", t.async = !0, t.onload = () => {
|
|
636
|
+
window.OpayoConfig && (e == null ? void 0 : e.environment) === "sandbox" && (window.OpayoConfig.restHost = e.opayoHost, window.OpayoConfig.restBaseURL = e.opayoApiBaseUrl), o();
|
|
637
|
+
}, t.onerror = () => a(new Error("Failed to load Opayo script")), document.head.appendChild(t);
|
|
638
|
+
}), O);
|
|
639
|
+
}
|
|
640
|
+
const Ne = { class: "field" }, Me = ["disabled"], Re = { class: "field" }, Te = ["disabled"], Be = { class: "field-row" }, Oe = { class: "field" }, xe = ["disabled"], Ge = { class: "field" }, $e = ["disabled"], De = ["disabled"], Fe = { key: 0 }, qe = { key: 1 }, Le = {
|
|
641
|
+
key: 0,
|
|
642
|
+
class: "error-message"
|
|
643
|
+
}, je = /* @__PURE__ */ E({
|
|
644
|
+
__name: "OpayoCardForm",
|
|
645
|
+
emits: ["started", "success", "failed"],
|
|
646
|
+
setup(e, { emit: o }) {
|
|
647
|
+
const a = o, t = G(), i = S("CHALLENGE"), u = S("4929000000006"), n = S("0829"), d = S("123"), l = S(!1), s = S("");
|
|
648
|
+
function m() {
|
|
649
|
+
var p, r, y, k, A, g;
|
|
650
|
+
return i.value.trim() ? u.value.trim() ? n.value.trim() ? d.value.trim() ? /^\d{4}$/.test(n.value.trim()) ? (r = (p = t.billingAddress) == null ? void 0 : p.address1) != null && r.trim() ? (k = (y = t.billingAddress) == null ? void 0 : y.city) != null && k.trim() ? (g = (A = t.billingAddress) == null ? void 0 : A.postCode) != null && g.trim() ? null : "Billing postcode is missing from payment config." : "Billing city is missing from payment config." : "Billing address line 1 is missing from payment config." : "Expiry date must be in MMYY format." : "Security code is required." : "Expiry date is required." : "Card number is required." : "Cardholder name is required.";
|
|
651
|
+
}
|
|
652
|
+
function c(p) {
|
|
653
|
+
return new Promise((r, y) => {
|
|
654
|
+
if (!window.opayoOwnForm) {
|
|
655
|
+
y(new Error("Opayo script is not available"));
|
|
656
|
+
return;
|
|
657
|
+
}
|
|
658
|
+
window.opayoOwnForm({
|
|
659
|
+
merchantSessionKey: p
|
|
660
|
+
}).tokeniseCardDetails({
|
|
661
|
+
cardDetails: {
|
|
662
|
+
cardholderName: i.value,
|
|
663
|
+
cardNumber: u.value,
|
|
664
|
+
expiryDate: n.value,
|
|
665
|
+
securityCode: d.value
|
|
666
|
+
},
|
|
667
|
+
onTokenised: (k) => {
|
|
668
|
+
r(k);
|
|
669
|
+
}
|
|
670
|
+
});
|
|
671
|
+
});
|
|
672
|
+
}
|
|
673
|
+
const I = async () => {
|
|
674
|
+
var r, y, k, A;
|
|
675
|
+
s.value = "";
|
|
676
|
+
const p = m();
|
|
677
|
+
if (p) {
|
|
678
|
+
s.value = p, a("failed", {
|
|
679
|
+
checkoutSessionId: t.sessionId,
|
|
680
|
+
paymentMethod: "card",
|
|
681
|
+
message: p
|
|
682
|
+
});
|
|
683
|
+
return;
|
|
684
|
+
}
|
|
685
|
+
a("started", {
|
|
686
|
+
checkoutSessionId: t.sessionId,
|
|
687
|
+
paymentMethod: "card"
|
|
688
|
+
}), l.value = !0;
|
|
689
|
+
try {
|
|
690
|
+
await Ee({
|
|
691
|
+
environment: t.environment,
|
|
692
|
+
opayoHost: t.opayoHost,
|
|
693
|
+
opayoApiBaseUrl: t.opayoApiBaseUrl
|
|
694
|
+
});
|
|
695
|
+
const g = new $(t.apiBaseUrl), _ = await g.getOpayoMerchantSessionKey(
|
|
696
|
+
t.sessionId
|
|
697
|
+
), C = await c(
|
|
698
|
+
_.merchantSessionKey
|
|
699
|
+
);
|
|
700
|
+
if (!C.success || !C.cardIdentifier)
|
|
701
|
+
throw new Error("Card tokenisation failed");
|
|
702
|
+
const w = {
|
|
703
|
+
checkoutSessionId: t.sessionId,
|
|
704
|
+
customerFirstName: (r = t.customer) == null ? void 0 : r.firstName,
|
|
705
|
+
customerLastName: (y = t.customer) == null ? void 0 : y.lastName,
|
|
706
|
+
customerEmailAddress: (k = t.customer) == null ? void 0 : k.emailAddress,
|
|
707
|
+
customerPhoneNumber: (A = t.customer) == null ? void 0 : A.phoneNumber,
|
|
708
|
+
saveCard: t.saveCard ?? !1,
|
|
709
|
+
merchantSessionKey: _.merchantSessionKey,
|
|
710
|
+
billingAddress: t.billingAddress,
|
|
711
|
+
browserInformation: j(),
|
|
712
|
+
cardInformation: {
|
|
713
|
+
cardIdentifier: C.cardIdentifier,
|
|
714
|
+
savedCardId: 0
|
|
715
|
+
}
|
|
716
|
+
}, P = await g.createCheckoutPayment(w);
|
|
717
|
+
if (P.requires3DSChallenge && P.acsUrl && P.cReq) {
|
|
718
|
+
const U = document.createElement("form");
|
|
719
|
+
U.method = "POST", U.action = P.acsUrl;
|
|
720
|
+
const N = document.createElement("input");
|
|
721
|
+
N.type = "hidden", N.name = "creq", N.value = P.cReq, U.appendChild(N);
|
|
722
|
+
const M = document.createElement("input");
|
|
723
|
+
M.type = "hidden", M.name = "threeDSSessionData", M.value = t.sessionId, U.appendChild(M), document.body.appendChild(U), U.submit();
|
|
724
|
+
return;
|
|
725
|
+
}
|
|
726
|
+
if (!P.success)
|
|
727
|
+
throw new Error(P.message || P.statusDetail || "Payment failed");
|
|
728
|
+
if (P.redirectUrl) {
|
|
729
|
+
window.location.href = P.redirectUrl;
|
|
730
|
+
return;
|
|
731
|
+
}
|
|
732
|
+
const h = await g.getSessionStatus(t.sessionId);
|
|
733
|
+
if (h.status !== "Paid" && h.status !== "Completed")
|
|
734
|
+
throw new Error(h.message || "Payment not completed");
|
|
735
|
+
a("success", {
|
|
736
|
+
checkoutSessionId: h.checkoutSessionId,
|
|
737
|
+
paymentReference: h.paymentReference,
|
|
738
|
+
orderId: h.orderId,
|
|
739
|
+
bookingId: h.bookingId,
|
|
740
|
+
status: h.status
|
|
741
|
+
});
|
|
742
|
+
} catch (g) {
|
|
743
|
+
const _ = (g == null ? void 0 : g.message) || "Unable to process card payment.";
|
|
744
|
+
s.value = _, a("failed", {
|
|
745
|
+
checkoutSessionId: t.sessionId,
|
|
746
|
+
paymentMethod: "card",
|
|
747
|
+
message: _
|
|
748
|
+
});
|
|
749
|
+
} finally {
|
|
750
|
+
l.value = !1;
|
|
751
|
+
}
|
|
752
|
+
};
|
|
753
|
+
return (p, r) => (b(), v("form", {
|
|
754
|
+
class: "opayo-card-form",
|
|
755
|
+
onSubmit: ae(I, ["prevent"])
|
|
756
|
+
}, [
|
|
757
|
+
f("div", Ne, [
|
|
758
|
+
r[4] || (r[4] = f("label", { for: "opayo-cardholder-name" }, "Cardholder name", -1)),
|
|
759
|
+
R(f("input", {
|
|
760
|
+
id: "opayo-cardholder-name",
|
|
761
|
+
"onUpdate:modelValue": r[0] || (r[0] = (y) => i.value = y),
|
|
762
|
+
"data-card-details": "cardholder-name",
|
|
763
|
+
type: "text",
|
|
764
|
+
autocomplete: "cc-name",
|
|
765
|
+
disabled: l.value
|
|
766
|
+
}, null, 8, Me), [
|
|
767
|
+
[T, i.value]
|
|
768
|
+
])
|
|
769
|
+
]),
|
|
770
|
+
f("div", Re, [
|
|
771
|
+
r[5] || (r[5] = f("label", { for: "opayo-card-number" }, "Card number", -1)),
|
|
772
|
+
R(f("input", {
|
|
773
|
+
id: "opayo-card-number",
|
|
774
|
+
"onUpdate:modelValue": r[1] || (r[1] = (y) => u.value = y),
|
|
775
|
+
"data-card-details": "card-number",
|
|
776
|
+
type: "text",
|
|
777
|
+
inputmode: "numeric",
|
|
778
|
+
autocomplete: "cc-number",
|
|
779
|
+
disabled: l.value
|
|
780
|
+
}, null, 8, Te), [
|
|
781
|
+
[T, u.value]
|
|
782
|
+
])
|
|
783
|
+
]),
|
|
784
|
+
f("div", Be, [
|
|
785
|
+
f("div", Oe, [
|
|
786
|
+
r[6] || (r[6] = f("label", { for: "opayo-expiry-date" }, "Expiry date (MMYY)", -1)),
|
|
787
|
+
R(f("input", {
|
|
788
|
+
id: "opayo-expiry-date",
|
|
789
|
+
"onUpdate:modelValue": r[2] || (r[2] = (y) => n.value = y),
|
|
790
|
+
"data-card-details": "expiry-date",
|
|
791
|
+
type: "text",
|
|
792
|
+
inputmode: "numeric",
|
|
793
|
+
maxlength: "4",
|
|
794
|
+
placeholder: "MMYY",
|
|
795
|
+
autocomplete: "cc-exp",
|
|
796
|
+
disabled: l.value
|
|
797
|
+
}, null, 8, xe), [
|
|
798
|
+
[T, n.value]
|
|
799
|
+
])
|
|
800
|
+
]),
|
|
801
|
+
f("div", Ge, [
|
|
802
|
+
r[7] || (r[7] = f("label", { for: "opayo-security-code" }, "Security code", -1)),
|
|
803
|
+
R(f("input", {
|
|
804
|
+
id: "opayo-security-code",
|
|
805
|
+
"onUpdate:modelValue": r[3] || (r[3] = (y) => d.value = y),
|
|
806
|
+
"data-card-details": "security-code",
|
|
807
|
+
type: "password",
|
|
808
|
+
inputmode: "numeric",
|
|
809
|
+
autocomplete: "cc-csc",
|
|
810
|
+
disabled: l.value
|
|
811
|
+
}, null, 8, $e), [
|
|
812
|
+
[T, d.value]
|
|
813
|
+
])
|
|
814
|
+
])
|
|
815
|
+
]),
|
|
816
|
+
f("button", {
|
|
817
|
+
class: "submit-button",
|
|
818
|
+
type: "submit",
|
|
819
|
+
disabled: l.value
|
|
820
|
+
}, [
|
|
821
|
+
l.value ? (b(), v("span", Fe, "Processing...")) : (b(), v("span", qe, "Pay by Card"))
|
|
822
|
+
], 8, De),
|
|
823
|
+
s.value ? (b(), v("p", Le, q(s.value), 1)) : L("", !0)
|
|
824
|
+
], 32));
|
|
825
|
+
}
|
|
826
|
+
}), We = /* @__PURE__ */ D(je, [["__scopeId", "data-v-808b530f"]]);
|
|
827
|
+
export {
|
|
828
|
+
Ke as ApplePayButton,
|
|
829
|
+
ze as GooglePayButton,
|
|
830
|
+
We as OpayoCardForm,
|
|
831
|
+
Ye as OrderopiaPaymentsProvider,
|
|
832
|
+
Je as PayButton,
|
|
833
|
+
re as useCheckout
|
|
834
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
(function(h,t){typeof exports=="object"&&typeof module<"u"?t(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],t):(h=typeof globalThis<"u"?globalThis:h||self,t(h.OrderopiaPayments={},h.Vue))})(this,function(h,t){"use strict";var ve=Object.defineProperty;var Me=(h,t,A)=>t in h?ve(h,t,{enumerable:!0,configurable:!0,writable:!0,value:A}):h[t]=A;var F=(h,t,A)=>Me(h,typeof t!="symbol"?t+"":t,A);const A=Symbol("orderopia-payment-config");function q(e){t.provide(A,e)}function N(){const e=t.inject(A,null);if(!e)throw new Error("Payment config was not provided. Wrap your payment components in OrderopiaPaymentsProvider.");return e}function L(e){return e==="live"?"live":"sandbox"}function j(e){const s=L(e.environment||"sandbox"),a=e.apiBaseUrl||"https://pay.orderopia.com",o=e.opayoHost||"https://sandbox.opayo.eu.elavon.com",l=e.opayoApiBaseUrl||"https://sandbox.opayo.eu.elavon.com/api/v1";return{sessionId:e.sessionId,apiBaseUrl:a,returnUrl:e.returnUrl,merchantReference:e.merchantReference,environment:s,opayoHost:o,opayoApiBaseUrl:l,customer:e.customer,billingAddress:e.billingAddress,saveCard:e.saveCard,googlePay:e.googlePay?{merchantName:e.googlePay.merchantName,merchantId:e.googlePay.merchantId,gatewayMerchantId:e.googlePay.gatewayMerchantId,countryCode:e.googlePay.countryCode,currencyCode:e.googlePay.currencyCode,totalPrice:e.googlePay.totalPrice,totalPriceStatus:e.googlePay.totalPriceStatus||"FINAL",allowedCardNetworks:e.googlePay.allowedCardNetworks||["MASTERCARD","VISA"],allowedAuthMethods:e.googlePay.allowedAuthMethods||["PAN_ONLY","CRYPTOGRAM_3DS"],buttonColor:e.googlePay.buttonColor||"black",buttonType:e.googlePay.buttonType||"pay"}:void 0,applePay:e.applePay?{merchantIdentifier:e.applePay.merchantIdentifier,merchantName:e.applePay.merchantName,countryCode:e.applePay.countryCode,currencyCode:e.applePay.currencyCode,supportedNetworks:e.applePay.supportedNetworks||["visa","masterCard"],merchantCapabilities:e.applePay.merchantCapabilities||["supports3DS"],totalLabel:e.applePay.totalLabel,totalAmount:e.applePay.totalAmount,buttonStyle:e.applePay.buttonStyle||"black",buttonType:e.applePay.buttonType||"buy"}:void 0}}const H=t.defineComponent({__name:"OrderopiaPaymentsProvider",props:{config:{}},setup(e){const a=j(e.config);return q(a),(o,l)=>t.renderSlot(o.$slots,"default")}});class B{constructor(s){F(this,"apiBaseUrl");this.apiBaseUrl=s}async startPayment(s){const a=await fetch(`${this.apiBaseUrl}/checkout/sessions/${s.checkoutSessionId}/start-payment`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({paymentMethod:s.paymentMethod,returnUrl:s.returnUrl})});if(!a.ok)throw new Error("Failed to start payment");return await a.json()}async getSessionStatus(s){const a=await fetch(`${this.apiBaseUrl}/checkout/sessions/${s}`,{method:"GET",headers:{"Content-Type":"application/json"}});if(!a.ok)throw new Error("Failed to get checkout session status");return await a.json()}async getOpayoMerchantSessionKey(s){const a=await fetch(`${this.apiBaseUrl}/checkout/sessions/${s}/opayo/merchant-session-key`,{method:"POST",headers:{"Content-Type":"application/json"}});if(!a.ok)throw new Error("Failed to get Opayo merchant session key");return await a.json()}async getApplePaySession(s){const a=await fetch(`${this.apiBaseUrl}/checkout/sessions/${s}/opayo/apple-pay/merchant-session`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({domainName:window.location.origin})});if(!a.ok)throw new Error("Failed to get Apple Pay merchant session");return await a.json()}async getApplePayMerchantSession(s,a){const o=await fetch(`${this.apiBaseUrl}/checkout/sessions/${s}/apple-pay/merchant-session`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(a)});if(!o.ok)throw new Error("Failed to get Apple Pay merchant session");return await o.json()}async createCheckoutPayment(s){const a=await fetch(`${this.apiBaseUrl}/checkout/sessions/${s.checkoutSessionId}/opayo/card-payment`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(s)});if(!a.ok)throw new Error("Failed to create checkout payment");return await a.json()}}function $(e){const s=t.ref(!1),a=t.ref(null);return{loading:s,error:a,startPayment:async r=>{s.value=!0,a.value=null;try{const c=new B(e.apiBaseUrl),d=await c.startPayment({checkoutSessionId:e.sessionId,paymentMethod:r.paymentMethod,returnUrl:e.returnUrl});if(!d.success)throw{message:d.message||"Payment failed"};if(d.redirectUrl){const g={checkoutSessionId:e.sessionId,paymentReference:d.paymentReference,status:"Redirecting"};return window.location.href=d.redirectUrl,g}const n=await c.getSessionStatus(e.sessionId);if(n.status!=="Paid"&&n.status!=="Completed")throw{message:n.message||"Payment not completed"};return{checkoutSessionId:n.checkoutSessionId,paymentReference:n.paymentReference,orderId:n.orderId,bookingId:n.bookingId,status:n.status}}catch(c){throw a.value=(c==null?void 0:c.message)||"Unknown payment error",{message:a.value,code:c==null?void 0:c.code}}finally{s.value=!1}},createStartedEvent:r=>({checkoutSessionId:e.sessionId,paymentMethod:r}),createFailedEvent:(r,c)=>({checkoutSessionId:e.sessionId,paymentMethod:r,message:c.message,code:c.code})}}const Y=["disabled"],J={key:0},K={key:1},O="card",z=t.defineComponent({__name:"PayButton",props:{disabled:{type:Boolean}},emits:["started","success","failed"],setup(e,{emit:s}){const a=s,o=N(),{loading:l,startPayment:y,createStartedEvent:r,createFailedEvent:c}=$(o),d=async()=>{a("started",r(O));try{const n=await y({paymentMethod:O});a("success",n)}catch(n){a("failed",c(O,n))}};return(n,g)=>(t.openBlock(),t.createElementBlock("button",{class:"op-payment-button",disabled:e.disabled||t.unref(l),onClick:d},[t.unref(l)?(t.openBlock(),t.createElementBlock("span",J,"Processing...")):(t.openBlock(),t.createElementBlock("span",K,"Pay Now"))],8,Y))}}),v=(e,s)=>{const a=e.__vccOpts||e;for(const[o,l]of s)a[o]=l;return a},W=v(z,[["__scopeId","data-v-8b98b0e7"]]);function G(){return typeof window<"u"&&!!window.ApplePaySession}function X(e=3){return G()&&window.ApplePaySession.supportsVersion(e)}function Q(){return G()&&window.ApplePaySession.canMakePayments()}function Z(e){if(!e.applePay)throw new Error("Apple Pay config is missing");return{countryCode:e.applePay.countryCode,currencyCode:e.applePay.currencyCode,supportedNetworks:e.applePay.supportedNetworks||["visa","masterCard"],merchantCapabilities:e.applePay.merchantCapabilities||["supports3DS"],total:{label:e.applePay.totalLabel,amount:e.applePay.totalAmount,type:"final"},requiredBillingContactFields:["postalAddress","name","email","phone"]}}function ee(e,s){if(!e.applePay)throw new Error("Apple Pay config is missing");return{validationUrl:s,domainName:window.location.hostname,displayName:e.applePay.merchantName}}function D(){return{customerIPAddress:"",browserAcceptHeader:"text/html,application/xhtml+xml,application/xml;q=0.9,/;q=0.8",browserJavasriptEnabled:!0,browserJavaEnabled:!1,browserLanguage:navigator.language||"en-GB",browserColorDepth:window.screen.colorDepth||24,browserHeight:String(window.screen.height||0),browserWidth:String(window.screen.width||0),browserTimezone:String(new Date().getTimezoneOffset()),browserUserAgentHeader:navigator.userAgent}}const te={class:"apple-pay-wrap"},oe=["disabled"],ae={key:0},se={key:1},ne={key:1,class:"apple-pay-status apple-pay-error"},re=v(t.defineComponent({__name:"ApplePayButton",props:{disabled:{type:Boolean}},emits:["started","success","failed"],setup(e,{emit:s}){const a=s,o=N(),l=t.ref(!1),y=t.ref(!1),r=t.ref("");t.onMounted(()=>{if(!o.applePay){r.value="Apple Pay config is missing.";return}if(!X(3)){r.value="Apple Pay is not supported in this browser.";return}if(!Q()){r.value="Apple Pay is not available on this device.";return}y.value=!0});async function c(){if(r.value="",!o.applePay){const d="Apple Pay config is missing.";r.value=d,a("failed",{checkoutSessionId:o.sessionId,paymentMethod:"apple_pay",message:d});return}a("started",{checkoutSessionId:o.sessionId,paymentMethod:"apple_pay"}),l.value=!0;try{const d=Z(o),n=new window.ApplePaySession(3,d),g=new B(o.apiBaseUrl);n.onvalidatemerchant=async p=>{try{const k=await g.getApplePayMerchantSession(o.sessionId,ee(o,p.validationURL));n.completeMerchantValidation(k)}catch(k){throw n.abort(),k}},n.onpaymentauthorized=async p=>{var k,m,i,u,S,I,f,_;try{const C={token:p.payment.token,billingContact:p.payment.billingContact,shippingContact:p.payment.shippingContact},P={checkoutSessionId:o.sessionId,customerFirstName:((k=o.customer)==null?void 0:k.firstName)||((m=p.payment.billingContact)==null?void 0:m.givenName),customerLastName:((i=o.customer)==null?void 0:i.lastName)||((u=p.payment.billingContact)==null?void 0:u.familyName),customerEmailAddress:((S=o.customer)==null?void 0:S.emailAddress)||((I=p.payment.billingContact)==null?void 0:I.emailAddress),customerPhoneNumber:((f=o.customer)==null?void 0:f.phoneNumber)||((_=p.payment.billingContact)==null?void 0:_.phoneNumber),saveCard:o.saveCard??!1,billingAddress:o.billingAddress,browserInformation:D(),applePayInfo:{payload:JSON.stringify(C)}},b=await g.createCheckoutPayment(P);if(!b.success)throw n.completePayment(window.ApplePaySession.STATUS_FAILURE),new Error(b.message||"Apple Pay payment failed");if(b.redirectUrl){n.completePayment(window.ApplePaySession.STATUS_SUCCESS),window.location.href=b.redirectUrl;return}const w=await g.getSessionStatus(o.sessionId);if(w.status!=="Paid"&&w.status!=="Completed")throw n.completePayment(window.ApplePaySession.STATUS_FAILURE),new Error(w.message||"Payment not completed");n.completePayment(window.ApplePaySession.STATUS_SUCCESS),a("success",{checkoutSessionId:w.checkoutSessionId,paymentReference:w.paymentReference,orderId:w.orderId,bookingId:w.bookingId,status:w.status})}catch(C){n.completePayment(window.ApplePaySession.STATUS_FAILURE);const P=(C==null?void 0:C.message)||"Unable to process Apple Pay payment.";r.value=P,a("failed",{checkoutSessionId:o.sessionId,paymentMethod:"apple_pay",message:P})}finally{l.value=!1}},n.oncancel=()=>{l.value=!1},n.begin()}catch(d){l.value=!1;const n=(d==null?void 0:d.message)||"Unable to initialise Apple Pay.";r.value=n,a("failed",{checkoutSessionId:o.sessionId,paymentMethod:"apple_pay",message:n})}}return(d,n)=>{var g,p;return t.openBlock(),t.createElementBlock("div",te,[y.value?(t.openBlock(),t.createElementBlock("button",{key:0,class:t.normalizeClass(["apple-pay-button",[`apple-pay-button--${((g=t.unref(o).applePay)==null?void 0:g.buttonStyle)||"black"}`,`apple-pay-button--${((p=t.unref(o).applePay)==null?void 0:p.buttonType)||"buy"}`]]),disabled:e.disabled||l.value,onClick:c},[l.value?(t.openBlock(),t.createElementBlock("span",ae,"Processing...")):(t.openBlock(),t.createElementBlock("span",se,"Apple Pay"))],10,oe)):r.value?(t.openBlock(),t.createElementBlock("div",ne,t.toDisplayString(r.value),1)):t.createCommentVNode("",!0)])}}}),[["__scopeId","data-v-15ec9241"]]);let M=null;function ie(){var e,s,a;return(a=(s=(e=window.google)==null?void 0:e.payments)==null?void 0:s.api)!=null&&a.PaymentsClient?Promise.resolve():M||(M=new Promise((o,l)=>{const y=document.querySelector('script[data-google-pay-script="true"]');if(y){y.addEventListener("load",()=>o()),y.addEventListener("error",()=>l(new Error("Failed to load Google Pay script")));return}const r=document.createElement("script");r.src="https://pay.google.com/gp/p/js/pay.js",r.async=!0,r.setAttribute("data-google-pay-script","true"),r.onload=()=>o(),r.onerror=()=>l(new Error("Failed to load Google Pay script")),document.head.appendChild(r)}),M)}function x(e){var s,a,o;if(!((o=(a=(s=window.google)==null?void 0:s.payments)==null?void 0:a.api)!=null&&o.PaymentsClient))throw new Error("Google Pay script is not available");return new window.google.payments.api.PaymentsClient({environment:e.environment==="live"?"PRODUCTION":"TEST"})}function V(){return{apiVersion:2,apiVersionMinor:0}}function le(e){if(!e.googlePay)throw new Error("Google Pay config is missing");return{type:"CARD",parameters:{allowedAuthMethods:e.googlePay.allowedAuthMethods,allowedCardNetworks:e.googlePay.allowedCardNetworks},tokenizationSpecification:{type:"PAYMENT_GATEWAY",parameters:{gateway:"opayoelavon",gatewayMerchantId:e.googlePay.gatewayMerchantId}}}}function de(e){var s,a;return{...V(),allowedPaymentMethods:[{type:"CARD",parameters:{allowedAuthMethods:((s=e.googlePay)==null?void 0:s.allowedAuthMethods)||["PAN_ONLY","CRYPTOGRAM_3DS"],allowedCardNetworks:((a=e.googlePay)==null?void 0:a.allowedCardNetworks)||["MASTERCARD","VISA"]}}]}}function ce(e){if(!e.googlePay)throw new Error("Google Pay config is missing");const s={...V(),merchantInfo:{merchantName:e.googlePay.merchantName},allowedPaymentMethods:[le(e)],transactionInfo:{totalPriceStatus:e.googlePay.totalPriceStatus,totalPrice:e.googlePay.totalPrice,currencyCode:e.googlePay.currencyCode,countryCode:e.googlePay.countryCode},emailRequired:!0};return e.environment==="live"&&e.googlePay.merchantId&&(s.merchantInfo.merchantId=e.googlePay.merchantId),s}const pe={class:"google-pay-wrap"},me={key:0,class:"google-pay-status"},ye={key:1,class:"google-pay-status google-pay-error"},ue=v(t.defineComponent({__name:"GooglePayButton",emits:["started","success","failed"],setup(e,{emit:s}){const a=s,o=N(),l=t.ref(null),y=t.ref(!0),r=t.ref("");async function c(){if(!o.googlePay){r.value="Google Pay config is missing.",y.value=!1;return}try{await ie();const n=x(o),g=de(o),p=await n.isReadyToPay(g);if(!(p!=null&&p.result)){r.value="Google Pay is not available on this device/browser.",y.value=!1;return}const k=n.createButton({onClick:d,allowedPaymentMethods:g.allowedPaymentMethods,buttonColor:o.googlePay.buttonColor,buttonType:o.googlePay.buttonType});l.value&&(l.value.innerHTML="",l.value.appendChild(k))}catch(n){r.value=(n==null?void 0:n.message)||"Failed to initialise Google Pay."}finally{y.value=!1}}async function d(){var n,g,p,k;if(r.value="",!o.googlePay){const m="Google Pay config is missing.";r.value=m,a("failed",{checkoutSessionId:o.sessionId,paymentMethod:"google_pay",message:m});return}a("started",{checkoutSessionId:o.sessionId,paymentMethod:"google_pay"});try{const m=x(o),i=ce(o),S=(await m.loadPaymentData(i)).paymentMethodData.tokenizationData.token;if(!S)throw new Error("Google Pay token is missing.");const I=new B(o.apiBaseUrl),f=btoa(S),_={checkoutSessionId:o.sessionId,customerFirstName:(n=o.customer)==null?void 0:n.firstName,customerLastName:(g=o.customer)==null?void 0:g.lastName,customerEmailAddress:(p=o.customer)==null?void 0:p.emailAddress,customerPhoneNumber:(k=o.customer)==null?void 0:k.phoneNumber,saveCard:o.saveCard??!1,billingAddress:o.billingAddress,browserInformation:D(),googlePayInfo:{payload:f}},C=await I.createCheckoutPayment(_);if(!C.success)throw new Error(C.message||"Google Pay payment failed");if(C.redirectUrl){window.location.href=C.redirectUrl;return}const P=await I.getSessionStatus(o.sessionId);if(P.status!=="Paid"&&P.status!=="Completed")throw new Error(P.message||"Payment not completed");a("success",{checkoutSessionId:P.checkoutSessionId,paymentReference:P.paymentReference,orderId:P.orderId,bookingId:P.bookingId,status:P.status})}catch(m){const i=(m==null?void 0:m.message)||"Unable to process Google Pay payment.";r.value=i,a("failed",{checkoutSessionId:o.sessionId,paymentMethod:"google_pay",message:i})}}return t.onMounted(()=>{c()}),(n,g)=>(t.openBlock(),t.createElementBlock("div",pe,[y.value?(t.openBlock(),t.createElementBlock("div",me,"Loading Google Pay...")):r.value?(t.openBlock(),t.createElementBlock("div",ye,t.toDisplayString(r.value),1)):t.createCommentVNode("",!0),t.createElementVNode("div",{ref_key:"buttonContainer",ref:l},null,512)]))}}),[["__scopeId","data-v-a9cb32d9"]]);let U=null;function he(e){return window.opayoOwnForm?(window.OpayoConfig&&(e==null?void 0:e.environment)==="sandbox"&&(window.OpayoConfig.restHost=e.opayoHost,window.OpayoConfig.restBaseURL=e.opayoApiBaseUrl),Promise.resolve()):U||(U=new Promise((s,a)=>{const o=document.createElement("script");o.src="https://assets.ci.opayo.cloud/assets/js/opayo-1.2.40.js",o.integrity="sha512-ZplJXUTeRh13LTLjfwydrUFpRJaHOoSIKdoMQP4s1gWyJoXqsTqxBeGdt4fQyfNq/Xo21u8IGaA3PjLfiefZJw==",o.crossOrigin="anonymous",o.async=!0,o.onload=()=>{window.OpayoConfig&&(e==null?void 0:e.environment)==="sandbox"&&(window.OpayoConfig.restHost=e.opayoHost,window.OpayoConfig.restBaseURL=e.opayoApiBaseUrl),s()},o.onerror=()=>a(new Error("Failed to load Opayo script")),document.head.appendChild(o)}),U)}const ge={class:"field"},we=["disabled"],fe={class:"field"},Pe=["disabled"],be={class:"field-row"},Ce={class:"field"},ke=["disabled"],Se={class:"field"},Ie=["disabled"],_e=["disabled"],Ae={key:0},Ee={key:1},Ne={key:0,class:"error-message"},Be=v(t.defineComponent({__name:"OpayoCardForm",emits:["started","success","failed"],setup(e,{emit:s}){const a=s,o=N(),l=t.ref("CHALLENGE"),y=t.ref("4929000000006"),r=t.ref("0829"),c=t.ref("123"),d=t.ref(!1),n=t.ref("");function g(){var m,i,u,S,I,f;return l.value.trim()?y.value.trim()?r.value.trim()?c.value.trim()?/^\d{4}$/.test(r.value.trim())?(i=(m=o.billingAddress)==null?void 0:m.address1)!=null&&i.trim()?(S=(u=o.billingAddress)==null?void 0:u.city)!=null&&S.trim()?(f=(I=o.billingAddress)==null?void 0:I.postCode)!=null&&f.trim()?null:"Billing postcode is missing from payment config.":"Billing city is missing from payment config.":"Billing address line 1 is missing from payment config.":"Expiry date must be in MMYY format.":"Security code is required.":"Expiry date is required.":"Card number is required.":"Cardholder name is required."}function p(m){return new Promise((i,u)=>{if(!window.opayoOwnForm){u(new Error("Opayo script is not available"));return}window.opayoOwnForm({merchantSessionKey:m}).tokeniseCardDetails({cardDetails:{cardholderName:l.value,cardNumber:y.value,expiryDate:r.value,securityCode:c.value},onTokenised:S=>{i(S)}})})}const k=async()=>{var i,u,S,I;n.value="";const m=g();if(m){n.value=m,a("failed",{checkoutSessionId:o.sessionId,paymentMethod:"card",message:m});return}a("started",{checkoutSessionId:o.sessionId,paymentMethod:"card"}),d.value=!0;try{await he({environment:o.environment,opayoHost:o.opayoHost,opayoApiBaseUrl:o.opayoApiBaseUrl});const f=new B(o.apiBaseUrl),_=await f.getOpayoMerchantSessionKey(o.sessionId),C=await p(_.merchantSessionKey);if(!C.success||!C.cardIdentifier)throw new Error("Card tokenisation failed");const P={checkoutSessionId:o.sessionId,customerFirstName:(i=o.customer)==null?void 0:i.firstName,customerLastName:(u=o.customer)==null?void 0:u.lastName,customerEmailAddress:(S=o.customer)==null?void 0:S.emailAddress,customerPhoneNumber:(I=o.customer)==null?void 0:I.phoneNumber,saveCard:o.saveCard??!1,merchantSessionKey:_.merchantSessionKey,billingAddress:o.billingAddress,browserInformation:D(),cardInformation:{cardIdentifier:C.cardIdentifier,savedCardId:0}},b=await f.createCheckoutPayment(P);if(b.requires3DSChallenge&&b.acsUrl&&b.cReq){const E=document.createElement("form");E.method="POST",E.action=b.acsUrl;const T=document.createElement("input");T.type="hidden",T.name="creq",T.value=b.cReq,E.appendChild(T);const R=document.createElement("input");R.type="hidden",R.name="threeDSSessionData",R.value=o.sessionId,E.appendChild(R),document.body.appendChild(E),E.submit();return}if(!b.success)throw new Error(b.message||b.statusDetail||"Payment failed");if(b.redirectUrl){window.location.href=b.redirectUrl;return}const w=await f.getSessionStatus(o.sessionId);if(w.status!=="Paid"&&w.status!=="Completed")throw new Error(w.message||"Payment not completed");a("success",{checkoutSessionId:w.checkoutSessionId,paymentReference:w.paymentReference,orderId:w.orderId,bookingId:w.bookingId,status:w.status})}catch(f){const _=(f==null?void 0:f.message)||"Unable to process card payment.";n.value=_,a("failed",{checkoutSessionId:o.sessionId,paymentMethod:"card",message:_})}finally{d.value=!1}};return(m,i)=>(t.openBlock(),t.createElementBlock("form",{class:"opayo-card-form",onSubmit:t.withModifiers(k,["prevent"])},[t.createElementVNode("div",ge,[i[4]||(i[4]=t.createElementVNode("label",{for:"opayo-cardholder-name"},"Cardholder name",-1)),t.withDirectives(t.createElementVNode("input",{id:"opayo-cardholder-name","onUpdate:modelValue":i[0]||(i[0]=u=>l.value=u),"data-card-details":"cardholder-name",type:"text",autocomplete:"cc-name",disabled:d.value},null,8,we),[[t.vModelText,l.value]])]),t.createElementVNode("div",fe,[i[5]||(i[5]=t.createElementVNode("label",{for:"opayo-card-number"},"Card number",-1)),t.withDirectives(t.createElementVNode("input",{id:"opayo-card-number","onUpdate:modelValue":i[1]||(i[1]=u=>y.value=u),"data-card-details":"card-number",type:"text",inputmode:"numeric",autocomplete:"cc-number",disabled:d.value},null,8,Pe),[[t.vModelText,y.value]])]),t.createElementVNode("div",be,[t.createElementVNode("div",Ce,[i[6]||(i[6]=t.createElementVNode("label",{for:"opayo-expiry-date"},"Expiry date (MMYY)",-1)),t.withDirectives(t.createElementVNode("input",{id:"opayo-expiry-date","onUpdate:modelValue":i[2]||(i[2]=u=>r.value=u),"data-card-details":"expiry-date",type:"text",inputmode:"numeric",maxlength:"4",placeholder:"MMYY",autocomplete:"cc-exp",disabled:d.value},null,8,ke),[[t.vModelText,r.value]])]),t.createElementVNode("div",Se,[i[7]||(i[7]=t.createElementVNode("label",{for:"opayo-security-code"},"Security code",-1)),t.withDirectives(t.createElementVNode("input",{id:"opayo-security-code","onUpdate:modelValue":i[3]||(i[3]=u=>c.value=u),"data-card-details":"security-code",type:"password",inputmode:"numeric",autocomplete:"cc-csc",disabled:d.value},null,8,Ie),[[t.vModelText,c.value]])])]),t.createElementVNode("button",{class:"submit-button",type:"submit",disabled:d.value},[d.value?(t.openBlock(),t.createElementBlock("span",Ae,"Processing...")):(t.openBlock(),t.createElementBlock("span",Ee,"Pay by Card"))],8,_e),n.value?(t.openBlock(),t.createElementBlock("p",Ne,t.toDisplayString(n.value),1)):t.createCommentVNode("",!0)],32))}}),[["__scopeId","data-v-808b530f"]]);h.ApplePayButton=re,h.GooglePayButton=ue,h.OpayoCardForm=Be,h.OrderopiaPaymentsProvider=H,h.PayButton=W,h.useCheckout=$,Object.defineProperty(h,Symbol.toStringTag,{value:"Module"})});
|
package/dist/style.css
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.op-payment-button[data-v-8b98b0e7]{border:none;border-radius:12px;padding:12px 18px;font-size:16px;font-weight:600;cursor:pointer}.apple-pay-wrap[data-v-15ec9241]{display:grid;gap:8px}.apple-pay-button[data-v-15ec9241]{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;border-radius:12px;padding:12px 18px;font-size:16px;font-weight:600;cursor:pointer}.apple-pay-button--black[data-v-15ec9241]{background:#000;color:#fff}.apple-pay-button--white[data-v-15ec9241]{background:#fff;color:#000;border:1px solid #d1d5db}.apple-pay-button--white-outline[data-v-15ec9241]{background:#fff;color:#000;border:1px solid black}.apple-pay-status[data-v-15ec9241]{font-size:14px;color:#374151}.apple-pay-error[data-v-15ec9241]{color:#b91c1c}.google-pay-wrap[data-v-a9cb32d9]{display:grid;gap:8px}.google-pay-status[data-v-a9cb32d9]{font-size:14px;color:#374151}.google-pay-error[data-v-a9cb32d9]{color:#b91c1c}.opayo-card-form[data-v-808b530f]{display:grid;gap:16px;max-width:420px}.field[data-v-808b530f]{display:grid;gap:6px}.field-row[data-v-808b530f]{display:grid;gap:16px;grid-template-columns:1fr 1fr}.field label[data-v-808b530f]{font-size:14px;font-weight:600}.field input[data-v-808b530f]{border:1px solid #d1d5db;border-radius:10px;padding:12px;font-size:16px}.submit-button[data-v-808b530f]{border:none;border-radius:12px;padding:12px 18px;font-size:16px;font-weight:600;cursor:pointer}.error-message[data-v-808b530f]{color:#b91c1c;font-size:14px}
|
package/dist/vite.svg
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>
|
package/package.json
ADDED
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "orderopia-payments-vue",
|
|
3
|
+
"version": "0.0.1",
|
|
4
|
+
"type": "module",
|
|
5
|
+
|
|
6
|
+
"main": "./dist/orderopia-payments.umd.cjs",
|
|
7
|
+
"module": "./dist/orderopia-payments.js",
|
|
8
|
+
"types": "./dist/index.d.ts",
|
|
9
|
+
|
|
10
|
+
"exports": {
|
|
11
|
+
".": {
|
|
12
|
+
"types": "./dist/index.d.ts",
|
|
13
|
+
"import": "./dist/orderopia-payments.js",
|
|
14
|
+
"require": "./dist/orderopia-payments.umd.cjs"
|
|
15
|
+
}
|
|
16
|
+
},
|
|
17
|
+
|
|
18
|
+
"files": [
|
|
19
|
+
"dist"
|
|
20
|
+
],
|
|
21
|
+
|
|
22
|
+
"scripts": {
|
|
23
|
+
"dev": "vite",
|
|
24
|
+
"build": "vue-tsc && vite build",
|
|
25
|
+
"preview": "vite preview"
|
|
26
|
+
},
|
|
27
|
+
|
|
28
|
+
"peerDependencies": {
|
|
29
|
+
"vue": "^3.3.0"
|
|
30
|
+
},
|
|
31
|
+
|
|
32
|
+
"dependencies": {
|
|
33
|
+
},
|
|
34
|
+
|
|
35
|
+
"devDependencies": {
|
|
36
|
+
"@types/applepayjs": "^14.0.9",
|
|
37
|
+
"@vitejs/plugin-vue": "^5.0.0",
|
|
38
|
+
"@vue/tsconfig": "^0.9.0",
|
|
39
|
+
"typescript": "^5.0.0",
|
|
40
|
+
"vite": "^5.0.0",
|
|
41
|
+
"vue-tsc": "^2.0.0"
|
|
42
|
+
},
|
|
43
|
+
|
|
44
|
+
"publishConfig": {
|
|
45
|
+
"access": "public"
|
|
46
|
+
}
|
|
47
|
+
}
|