@miden-npm/react 2.0.2 → 2.0.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/index.cjs +754 -361
- package/dist/index.cjs.map +1 -1
- package/dist/index.css +3 -0
- package/dist/index.css.map +1 -1
- package/dist/index.d.cts +2 -2
- package/dist/index.d.ts +2 -2
- package/dist/index.js +685 -292
- package/dist/index.js.map +1 -1
- package/dist/styles.css +1 -1
- package/package.json +4 -1
package/dist/index.cjs
CHANGED
|
@@ -144,6 +144,10 @@ function buildDeviceInformation(partial) {
|
|
|
144
144
|
...partial
|
|
145
145
|
};
|
|
146
146
|
}
|
|
147
|
+
var toastConfig = {
|
|
148
|
+
position: "top-right",
|
|
149
|
+
style: { fontSize: "12px" }
|
|
150
|
+
};
|
|
147
151
|
|
|
148
152
|
// src/utils/api.util.ts
|
|
149
153
|
var getBaseUrl = (mode, caller) => {
|
|
@@ -168,7 +172,7 @@ var currencySign = (currency) => {
|
|
|
168
172
|
var formatAmount = (value, currency) => {
|
|
169
173
|
const num = typeof value === "string" ? parseFloat(value) : value;
|
|
170
174
|
if (isNaN(num)) return "0";
|
|
171
|
-
return `${currency ? currencySign(currency) : ""}
|
|
175
|
+
return `${currency ? currencySign(currency) : ""}${num?.toLocaleString(
|
|
172
176
|
"en-US"
|
|
173
177
|
)}`;
|
|
174
178
|
};
|
|
@@ -201,6 +205,254 @@ var restrictToNumericKeys = (event) => {
|
|
|
201
205
|
event.preventDefault();
|
|
202
206
|
}
|
|
203
207
|
};
|
|
208
|
+
var COUNTRIES = [
|
|
209
|
+
{ name: "Afghanistan", code: "AF", phoneCode: "+93", flag: "\u{1F1E6}\u{1F1EB}" },
|
|
210
|
+
{ name: "Albania", code: "AL", phoneCode: "+355", flag: "\u{1F1E6}\u{1F1F1}" },
|
|
211
|
+
{ name: "Algeria", code: "DZ", phoneCode: "+213", flag: "\u{1F1E9}\u{1F1FF}" },
|
|
212
|
+
{ name: "American Samoa", code: "AS", phoneCode: "+1", flag: "\u{1F1E6}\u{1F1F8}" },
|
|
213
|
+
{ name: "Andorra", code: "AD", phoneCode: "+376", flag: "\u{1F1E6}\u{1F1E9}" },
|
|
214
|
+
{ name: "Angola", code: "AO", phoneCode: "+244", flag: "\u{1F1E6}\u{1F1F4}" },
|
|
215
|
+
{ name: "Anguilla", code: "AI", phoneCode: "+1", flag: "\u{1F1E6}\u{1F1EE}" },
|
|
216
|
+
{ name: "Antarctica", code: "AQ", phoneCode: "+672", flag: "\u{1F1E6}\u{1F1F6}" },
|
|
217
|
+
{ name: "Antigua and Barbuda", code: "AG", phoneCode: "+1", flag: "\u{1F1E6}\u{1F1EC}" },
|
|
218
|
+
{ name: "Argentina", code: "AR", phoneCode: "+54", flag: "\u{1F1E6}\u{1F1F7}" },
|
|
219
|
+
{ name: "Armenia", code: "AM", phoneCode: "+374", flag: "\u{1F1E6}\u{1F1F2}" },
|
|
220
|
+
{ name: "Aruba", code: "AW", phoneCode: "+297", flag: "\u{1F1E6}\u{1F1FC}" },
|
|
221
|
+
{ name: "Australia", code: "AU", phoneCode: "+61", flag: "\u{1F1E6}\u{1F1FA}" },
|
|
222
|
+
{ name: "Austria", code: "AT", phoneCode: "+43", flag: "\u{1F1E6}\u{1F1F9}" },
|
|
223
|
+
{ name: "Azerbaijan", code: "AZ", phoneCode: "+994", flag: "\u{1F1E6}\u{1F1FF}" },
|
|
224
|
+
{ name: "Bahamas", code: "BS", phoneCode: "+1", flag: "\u{1F1E7}\u{1F1F8}" },
|
|
225
|
+
{ name: "Bahrain", code: "BH", phoneCode: "+973", flag: "\u{1F1E7}\u{1F1ED}" },
|
|
226
|
+
{ name: "Bangladesh", code: "BD", phoneCode: "+880", flag: "\u{1F1E7}\u{1F1E9}" },
|
|
227
|
+
{ name: "Barbados", code: "BB", phoneCode: "+1", flag: "\u{1F1E7}\u{1F1E7}" },
|
|
228
|
+
{ name: "Belarus", code: "BY", phoneCode: "+375", flag: "\u{1F1E7}\u{1F1FE}" },
|
|
229
|
+
{ name: "Belgium", code: "BE", phoneCode: "+32", flag: "\u{1F1E7}\u{1F1EA}" },
|
|
230
|
+
{ name: "Belize", code: "BZ", phoneCode: "+501", flag: "\u{1F1E7}\u{1F1FF}" },
|
|
231
|
+
{ name: "Benin", code: "BJ", phoneCode: "+229", flag: "\u{1F1E7}\u{1F1EF}" },
|
|
232
|
+
{ name: "Bermuda", code: "BM", phoneCode: "+1", flag: "\u{1F1E7}\u{1F1F2}" },
|
|
233
|
+
{ name: "Bhutan", code: "BT", phoneCode: "+975", flag: "\u{1F1E7}\u{1F1F9}" },
|
|
234
|
+
{ name: "Bolivia", code: "BO", phoneCode: "+591", flag: "\u{1F1E7}\u{1F1F4}" },
|
|
235
|
+
{ name: "Bosnia and Herzegovina", code: "BA", phoneCode: "+387", flag: "\u{1F1E7}\u{1F1E6}" },
|
|
236
|
+
{ name: "Botswana", code: "BW", phoneCode: "+267", flag: "\u{1F1E7}\u{1F1FC}" },
|
|
237
|
+
{ name: "Bouvet Island", code: "BV", phoneCode: "+47", flag: "\u{1F1E7}\u{1F1FB}" },
|
|
238
|
+
{ name: "Brazil", code: "BR", phoneCode: "+55", flag: "\u{1F1E7}\u{1F1F7}" },
|
|
239
|
+
{ name: "British Indian Ocean Territory", code: "IO", phoneCode: "+246", flag: "\u{1F1EE}\u{1F1F4}" },
|
|
240
|
+
{ name: "Brunei Darussalam", code: "BN", phoneCode: "+673", flag: "\u{1F1E7}\u{1F1F3}" },
|
|
241
|
+
{ name: "Bulgaria", code: "BG", phoneCode: "+359", flag: "\u{1F1E7}\u{1F1EC}" },
|
|
242
|
+
{ name: "Burkina Faso", code: "BF", phoneCode: "+226", flag: "\u{1F1E7}\u{1F1EB}" },
|
|
243
|
+
{ name: "Burundi", code: "BI", phoneCode: "+257", flag: "\u{1F1E7}\u{1F1EE}" },
|
|
244
|
+
{ name: "Cambodia", code: "KH", phoneCode: "+855", flag: "\u{1F1F0}\u{1F1ED}" },
|
|
245
|
+
{ name: "Cameroon", code: "CM", phoneCode: "+237", flag: "\u{1F1E8}\u{1F1F2}" },
|
|
246
|
+
{ name: "Canada", code: "CA", phoneCode: "+1", flag: "\u{1F1E8}\u{1F1E6}" },
|
|
247
|
+
{ name: "Cape Verde", code: "CV", phoneCode: "+238", flag: "\u{1F1E8}\u{1F1FB}" },
|
|
248
|
+
{ name: "Cayman Islands", code: "KY", phoneCode: "+1", flag: "\u{1F1F0}\u{1F1FE}" },
|
|
249
|
+
{ name: "Central African Republic", code: "CF", phoneCode: "+236", flag: "\u{1F1E8}\u{1F1EB}" },
|
|
250
|
+
{ name: "Chad", code: "TD", phoneCode: "+235", flag: "\u{1F1F9}\u{1F1E9}" },
|
|
251
|
+
{ name: "Chile", code: "CL", phoneCode: "+56", flag: "\u{1F1E8}\u{1F1F1}" },
|
|
252
|
+
{ name: "China", code: "CN", phoneCode: "+86", flag: "\u{1F1E8}\u{1F1F3}" },
|
|
253
|
+
{ name: "Christmas Island", code: "CX", phoneCode: "+61", flag: "\u{1F1E8}\u{1F1FD}" },
|
|
254
|
+
{ name: "Cocos (Keeling) Islands", code: "CC", phoneCode: "+61", flag: "\u{1F1E8}\u{1F1E8}" },
|
|
255
|
+
{ name: "Colombia", code: "CO", phoneCode: "+57", flag: "\u{1F1E8}\u{1F1F4}" },
|
|
256
|
+
{ name: "Comoros", code: "KM", phoneCode: "+269", flag: "\u{1F1F0}\u{1F1F2}" },
|
|
257
|
+
{ name: "Congo", code: "CG", phoneCode: "+242", flag: "\u{1F1E8}\u{1F1EC}" },
|
|
258
|
+
{ name: "Congo, Democratic Republic of the", code: "CD", phoneCode: "+243", flag: "\u{1F1E8}\u{1F1E9}" },
|
|
259
|
+
{ name: "Cook Islands", code: "CK", phoneCode: "+682", flag: "\u{1F1E8}\u{1F1F0}" },
|
|
260
|
+
{ name: "Costa Rica", code: "CR", phoneCode: "+506", flag: "\u{1F1E8}\u{1F1F7}" },
|
|
261
|
+
{ name: "C\xF4te d'Ivoire", code: "CI", phoneCode: "+225", flag: "\u{1F1E8}\u{1F1EE}" },
|
|
262
|
+
{ name: "Croatia", code: "HR", phoneCode: "+385", flag: "\u{1F1ED}\u{1F1F7}" },
|
|
263
|
+
{ name: "Cuba", code: "CU", phoneCode: "+53", flag: "\u{1F1E8}\u{1F1FA}" },
|
|
264
|
+
{ name: "Cyprus", code: "CY", phoneCode: "+357", flag: "\u{1F1E8}\u{1F1FE}" },
|
|
265
|
+
{ name: "Czech Republic", code: "CZ", phoneCode: "+420", flag: "\u{1F1E8}\u{1F1FF}" },
|
|
266
|
+
{ name: "Denmark", code: "DK", phoneCode: "+45", flag: "\u{1F1E9}\u{1F1F0}" },
|
|
267
|
+
{ name: "Djibouti", code: "DJ", phoneCode: "+253", flag: "\u{1F1E9}\u{1F1EF}" },
|
|
268
|
+
{ name: "Dominica", code: "DM", phoneCode: "+1", flag: "\u{1F1E9}\u{1F1F2}" },
|
|
269
|
+
{ name: "Dominican Republic", code: "DO", phoneCode: "+1", flag: "\u{1F1E9}\u{1F1F4}" },
|
|
270
|
+
{ name: "Ecuador", code: "EC", phoneCode: "+593", flag: "\u{1F1EA}\u{1F1E8}" },
|
|
271
|
+
{ name: "Egypt", code: "EG", phoneCode: "+20", flag: "\u{1F1EA}\u{1F1EC}" },
|
|
272
|
+
{ name: "El Salvador", code: "SV", phoneCode: "+503", flag: "\u{1F1F8}\u{1F1FB}" },
|
|
273
|
+
{ name: "Equatorial Guinea", code: "GQ", phoneCode: "+240", flag: "\u{1F1EC}\u{1F1F6}" },
|
|
274
|
+
{ name: "Eritrea", code: "ER", phoneCode: "+291", flag: "\u{1F1EA}\u{1F1F7}" },
|
|
275
|
+
{ name: "Estonia", code: "EE", phoneCode: "+372", flag: "\u{1F1EA}\u{1F1EA}" },
|
|
276
|
+
{ name: "Ethiopia", code: "ET", phoneCode: "+251", flag: "\u{1F1EA}\u{1F1F9}" },
|
|
277
|
+
{ name: "Falkland Islands (Malvinas)", code: "FK", phoneCode: "+500", flag: "\u{1F1EB}\u{1F1F0}" },
|
|
278
|
+
{ name: "Faroe Islands", code: "FO", phoneCode: "+298", flag: "\u{1F1EB}\u{1F1F4}" },
|
|
279
|
+
{ name: "Fiji", code: "FJ", phoneCode: "+679", flag: "\u{1F1EB}\u{1F1EF}" },
|
|
280
|
+
{ name: "Finland", code: "FI", phoneCode: "+358", flag: "\u{1F1EB}\u{1F1EE}" },
|
|
281
|
+
{ name: "France", code: "FR", phoneCode: "+33", flag: "\u{1F1EB}\u{1F1F7}" },
|
|
282
|
+
{ name: "French Guiana", code: "GF", phoneCode: "+594", flag: "\u{1F1EC}\u{1F1EB}" },
|
|
283
|
+
{ name: "French Polynesia", code: "PF", phoneCode: "+689", flag: "\u{1F1F5}\u{1F1EB}" },
|
|
284
|
+
{ name: "French Southern Territories", code: "TF", phoneCode: "+262", flag: "\u{1F1F9}\u{1F1EB}" },
|
|
285
|
+
{ name: "Gabon", code: "GA", phoneCode: "+240", flag: "\u{1F1EC}\u{1F1E6}" },
|
|
286
|
+
{ name: "Gambia", code: "GM", phoneCode: "+220", flag: "\u{1F1EC}\u{1F1F2}" },
|
|
287
|
+
{ name: "Georgia", code: "GE", phoneCode: "+995", flag: "\u{1F1EC}\u{1F1EA}" },
|
|
288
|
+
{ name: "Germany", code: "DE", phoneCode: "+49", flag: "\u{1F1E9}\u{1F1EA}" },
|
|
289
|
+
{ name: "Ghana", code: "GH", phoneCode: "+233", flag: "\u{1F1EC}\u{1F1ED}" },
|
|
290
|
+
{ name: "Gibraltar", code: "GI", phoneCode: "+350", flag: "\u{1F1EC}\u{1F1EE}" },
|
|
291
|
+
{ name: "Greece", code: "GR", phoneCode: "+30", flag: "\u{1F1EC}\u{1F1F7}" },
|
|
292
|
+
{ name: "Greenland", code: "GL", phoneCode: "+299", flag: "\u{1F1EC}\u{1F1F1}" },
|
|
293
|
+
{ name: "Grenada", code: "GD", phoneCode: "+1", flag: "\u{1F1EC}\u{1F1E9}" },
|
|
294
|
+
{ name: "Guadeloupe", code: "GP", phoneCode: "+590", flag: "\u{1F1EC}\u{1F1F5}" },
|
|
295
|
+
{ name: "Guam", code: "GU", phoneCode: "+1", flag: "\u{1F1EC}\u{1F1FA}" },
|
|
296
|
+
{ name: "Guatemala", code: "GT", phoneCode: "+502", flag: "\u{1F1EC}\u{1F1F9}" },
|
|
297
|
+
{ name: "Guernsey", code: "GG", phoneCode: "+44", flag: "\u{1F1EC}\u{1F1EC}" },
|
|
298
|
+
{ name: "Guinea", code: "GN", phoneCode: "+224", flag: "\u{1F1EC}\u{1F1F3}" },
|
|
299
|
+
{ name: "Guinea-Bissau", code: "GW", phoneCode: "+245", flag: "\u{1F1EC}\u{1F1FC}" },
|
|
300
|
+
{ name: "Guyana", code: "GY", phoneCode: "+592", flag: "\u{1F1EC}\u{1F1FE}" },
|
|
301
|
+
{ name: "Haiti", code: "HT", phoneCode: "+509", flag: "\u{1F1ED}\u{1F1F9}" },
|
|
302
|
+
{ name: "Heard Island and McDonald Islands", code: "HM", phoneCode: "+672", flag: "\u{1F1ED}\u{1F1F2}" },
|
|
303
|
+
{ name: "Holy See (Vatican City State)", code: "VA", phoneCode: "+39", flag: "\u{1F1FB}\u{1F1E6}" },
|
|
304
|
+
{ name: "Honduras", code: "HN", phoneCode: "+504", flag: "\u{1F1ED}\u{1F1F3}" },
|
|
305
|
+
{ name: "Hong Kong", code: "HK", phoneCode: "+852", flag: "\u{1F1ED}\u{1F1F0}" },
|
|
306
|
+
{ name: "Hungary", code: "HU", phoneCode: "+36", flag: "\u{1F1ED}\u{1F1FA}" },
|
|
307
|
+
{ name: "Iceland", code: "IS", phoneCode: "+354", flag: "\u{1F1EE}\u{1F1F8}" },
|
|
308
|
+
{ name: "India", code: "IN", phoneCode: "+91", flag: "\u{1F1EE}\u{1F1F3}" },
|
|
309
|
+
{ name: "Indonesia", code: "ID", phoneCode: "+62", flag: "\u{1F1EE}\u{1F1E9}" },
|
|
310
|
+
{ name: "Iran, Islamic Republic of", code: "IR", phoneCode: "+98", flag: "\u{1F1EE}\u{1F1F7}" },
|
|
311
|
+
{ name: "Iraq", code: "IQ", phoneCode: "+964", flag: "\u{1F1EE}\u{1F1F6}" },
|
|
312
|
+
{ name: "Ireland", code: "IE", phoneCode: "+353", flag: "\u{1F1EE}\u{1F1EA}" },
|
|
313
|
+
{ name: "Isle of Man", code: "IM", phoneCode: "+44", flag: "\u{1F1EE}\u{1F1F2}" },
|
|
314
|
+
{ name: "Israel", code: "IL", phoneCode: "+972", flag: "\u{1F1EE}\u{1F1F1}" },
|
|
315
|
+
{ name: "Italy", code: "IT", phoneCode: "+39", flag: "\u{1F1EE}\u{1F1F9}" },
|
|
316
|
+
{ name: "Jamaica", code: "JM", phoneCode: "+1", flag: "\u{1F1EF}\u{1F1F2}" },
|
|
317
|
+
{ name: "Japan", code: "JP", phoneCode: "+81", flag: "\u{1F1EF}\u{1F1F5}" },
|
|
318
|
+
{ name: "Jersey", code: "JE", phoneCode: "+44", flag: "\u{1F1EF}\u{1F1EA}" },
|
|
319
|
+
{ name: "Jordan", code: "JO", phoneCode: "+962", flag: "\u{1F1EF}\u{1F1F4}" },
|
|
320
|
+
{ name: "Kazakhstan", code: "KZ", phoneCode: "+7", flag: "\u{1F1F0}\u{1F1FF}" },
|
|
321
|
+
{ name: "Kenya", code: "KE", phoneCode: "+254", flag: "\u{1F1F0}\u{1F1EA}" },
|
|
322
|
+
{ name: "Kiribati", code: "KI", phoneCode: "+686", flag: "\u{1F1F0}\u{1F1EE}" },
|
|
323
|
+
{ name: "Korea, Democratic People's Republic of", code: "KP", phoneCode: "+850", flag: "\u{1F1F0}\u{1F1F5}" },
|
|
324
|
+
{ name: "Korea, Republic of", code: "KR", phoneCode: "+82", flag: "\u{1F1F0}\u{1F1F7}" },
|
|
325
|
+
{ name: "Kuwait", code: "KW", phoneCode: "+965", flag: "\u{1F1F0}\u{1F1FC}" },
|
|
326
|
+
{ name: "Kyrgyzstan", code: "KG", phoneCode: "+996", flag: "\u{1F1F0}\u{1F1EC}" },
|
|
327
|
+
{ name: "Lao People's Democratic Republic", code: "LA", phoneCode: "+856", flag: "\u{1F1F1}\u{1F1E6}" },
|
|
328
|
+
{ name: "Latvia", code: "LV", phoneCode: "+371", flag: "\u{1F1F1}\u{1F1FB}" },
|
|
329
|
+
{ name: "Lebanon", code: "LB", phoneCode: "+961", flag: "\u{1F1F1}\u{1F1E7}" },
|
|
330
|
+
{ name: "Lesotho", code: "LS", phoneCode: "+266", flag: "\u{1F1F1}\u{1F1F8}" },
|
|
331
|
+
{ name: "Liberia", code: "LR", phoneCode: "+231", flag: "\u{1F1F1}\u{1F1F7}" },
|
|
332
|
+
{ name: "Libya", code: "LY", phoneCode: "+218", flag: "\u{1F1F1}\u{1F1FE}" },
|
|
333
|
+
{ name: "Liechtenstein", code: "LI", phoneCode: "+423", flag: "\u{1F1F1}\u{1F1EE}" },
|
|
334
|
+
{ name: "Lithuania", code: "LT", phoneCode: "+370", flag: "\u{1F1F1}\u{1F1F9}" },
|
|
335
|
+
{ name: "Luxembourg", code: "LU", phoneCode: "+352", flag: "\u{1F1F1}\u{1F1FA}" },
|
|
336
|
+
{ name: "Macao", code: "MO", phoneCode: "+853", flag: "\u{1F1F2}\u{1F1F4}" },
|
|
337
|
+
{ name: "Macedonia, the former Yugoslav Republic of", code: "MK", phoneCode: "+389", flag: "\u{1F1F2}\u{1F1F0}" },
|
|
338
|
+
{ name: "Madagascar", code: "MG", phoneCode: "+261", flag: "\u{1F1F2}\u{1F1EC}" },
|
|
339
|
+
{ name: "Malawi", code: "MW", phoneCode: "+265", flag: "\u{1F1F2}\u{1F1FC}" },
|
|
340
|
+
{ name: "Malaysia", code: "MY", phoneCode: "+60", flag: "\u{1F1F2}\u{1F1FE}" },
|
|
341
|
+
{ name: "Maldives", code: "MV", phoneCode: "+960", flag: "\u{1F1F2}\u{1F1FB}" },
|
|
342
|
+
{ name: "Mali", code: "ML", phoneCode: "+223", flag: "\u{1F1F2}\u{1F1F1}" },
|
|
343
|
+
{ name: "Malta", code: "MT", phoneCode: "+356", flag: "\u{1F1F2}\u{1F1F9}" },
|
|
344
|
+
{ name: "Marshall Islands", code: "MH", phoneCode: "+692", flag: "\u{1F1F2}\u{1F1ED}" },
|
|
345
|
+
{ name: "Martinique", code: "MQ", phoneCode: "+596", flag: "\u{1F1F2}\u{1F1F6}" },
|
|
346
|
+
{ name: "Mauritania", code: "MR", phoneCode: "+222", flag: "\u{1F1F2}\u{1F1F7}" },
|
|
347
|
+
{ name: "Mauritius", code: "MU", phoneCode: "+230", flag: "\u{1F1F2}\u{1F1FA}" },
|
|
348
|
+
{ name: "Mayotte", code: "YT", phoneCode: "+262", flag: "\u{1F1FE}\u{1F1F9}" },
|
|
349
|
+
{ name: "Mexico", code: "MX", phoneCode: "+52", flag: "\u{1F1F2}\u{1F1FD}" },
|
|
350
|
+
{ name: "Micronesia, Federated States of", code: "FM", phoneCode: "+691", flag: "\u{1F1EB}\u{1F1F2}" },
|
|
351
|
+
{ name: "Moldova, Republic of", code: "MD", phoneCode: "+373", flag: "\u{1F1F2}\u{1F1E9}" },
|
|
352
|
+
{ name: "Monaco", code: "MC", phoneCode: "+377", flag: "\u{1F1F2}\u{1F1E8}" },
|
|
353
|
+
{ name: "Mongolia", code: "MN", phoneCode: "+976", flag: "\u{1F1F2}\u{1F1F3}" },
|
|
354
|
+
{ name: "Montenegro", code: "ME", phoneCode: "+382", flag: "\u{1F1F2}\u{1F1EA}" },
|
|
355
|
+
{ name: "Montserrat", code: "MS", phoneCode: "+1", flag: "\u{1F1F2}\u{1F1F8}" },
|
|
356
|
+
{ name: "Morocco", code: "MA", phoneCode: "+212", flag: "\u{1F1F2}\u{1F1E6}" },
|
|
357
|
+
{ name: "Mozambique", code: "MZ", phoneCode: "+258", flag: "\u{1F1F2}\u{1F1FF}" },
|
|
358
|
+
{ name: "Myanmar", code: "MM", phoneCode: "+95", flag: "\u{1F1F2}\u{1F1F2}" },
|
|
359
|
+
{ name: "Namibia", code: "NA", phoneCode: "+264", flag: "\u{1F1F3}\u{1F1E6}" },
|
|
360
|
+
{ name: "Nauru", code: "NR", phoneCode: "+674", flag: "\u{1F1F3}\u{1F1F7}" },
|
|
361
|
+
{ name: "Nepal", code: "NP", phoneCode: "+977", flag: "\u{1F1F3}\u{1F1F5}" },
|
|
362
|
+
{ name: "Netherlands", code: "NL", phoneCode: "+31", flag: "\u{1F1F3}\u{1F1F1}" },
|
|
363
|
+
{ name: "New Caledonia", code: "NC", phoneCode: "+687", flag: "\u{1F1F3}\u{1F1E8}" },
|
|
364
|
+
{ name: "New Zealand", code: "NZ", phoneCode: "+64", flag: "\u{1F1F3}\u{1F1FF}" },
|
|
365
|
+
{ name: "Nicaragua", code: "NI", phoneCode: "+505", flag: "\u{1F1F3}\u{1F1EE}" },
|
|
366
|
+
{ name: "Niger", code: "NE", phoneCode: "+227", flag: "\u{1F1F3}\u{1F1EA}" },
|
|
367
|
+
{ name: "Nigeria", code: "NG", phoneCode: "+234", flag: "\u{1F1F3}\u{1F1EC}" },
|
|
368
|
+
{ name: "Niue", code: "NU", phoneCode: "+683", flag: "\u{1F1F3}\u{1F1FA}" },
|
|
369
|
+
{ name: "Norfolk Island", code: "NF", phoneCode: "+672", flag: "\u{1F1F3}\u{1F1EB}" },
|
|
370
|
+
{ name: "Northern Mariana Islands", code: "MP", phoneCode: "+1", flag: "\u{1F1F2}\u{1F1F5}" },
|
|
371
|
+
{ name: "Norway", code: "NO", phoneCode: "+47", flag: "\u{1F1F3}\u{1F1F4}" },
|
|
372
|
+
{ name: "Oman", code: "OM", phoneCode: "+968", flag: "\u{1F1F4}\u{1F1F2}" },
|
|
373
|
+
{ name: "Pakistan", code: "PK", phoneCode: "+92", flag: "\u{1F1F5}\u{1F1F0}" },
|
|
374
|
+
{ name: "Palau", code: "PW", phoneCode: "+680", flag: "\u{1F1F5}\u{1F1FC}" },
|
|
375
|
+
{ name: "Palestinian Territory, Occupied", code: "PS", phoneCode: "+970", flag: "\u{1F1F5}\u{1F1F8}" },
|
|
376
|
+
{ name: "Panama", code: "PA", phoneCode: "+507", flag: "\u{1F1F5}\u{1F1E6}" },
|
|
377
|
+
{ name: "Papua New Guinea", code: "PG", phoneCode: "+675", flag: "\u{1F1F5}\u{1F1EC}" },
|
|
378
|
+
{ name: "Paraguay", code: "PY", phoneCode: "+595", flag: "\u{1F1F5}\u{1F1FE}" },
|
|
379
|
+
{ name: "Peru", code: "PE", phoneCode: "+51", flag: "\u{1F1F5}\u{1F1EA}" },
|
|
380
|
+
{ name: "Philippines", code: "PH", phoneCode: "+63", flag: "\u{1F1F5}\u{1F1ED}" },
|
|
381
|
+
{ name: "Pitcairn", code: "PN", phoneCode: "+64", flag: "\u{1F1F5}\u{1F1F3}" },
|
|
382
|
+
{ name: "Poland", code: "PL", phoneCode: "+48", flag: "\u{1F1F5}\u{1F1F1}" },
|
|
383
|
+
{ name: "Portugal", code: "PT", phoneCode: "+351", flag: "\u{1F1F5}\u{1F1F9}" },
|
|
384
|
+
{ name: "Puerto Rico", code: "PR", phoneCode: "+1", flag: "\u{1F1F5}\u{1F1F7}" },
|
|
385
|
+
{ name: "Qatar", code: "QA", phoneCode: "+974", flag: "\u{1F1F6}\u{1F1E6}" },
|
|
386
|
+
{ name: "R\xE9union", code: "RE", phoneCode: "+262", flag: "\u{1F1F7}\u{1F1EA}" },
|
|
387
|
+
{ name: "Romania", code: "RO", phoneCode: "+40", flag: "\u{1F1F7}\u{1F1F4}" },
|
|
388
|
+
{ name: "Russian Federation", code: "RU", phoneCode: "+7", flag: "\u{1F1F7}\u{1F1FA}" },
|
|
389
|
+
{ name: "Rwanda", code: "RW", phoneCode: "+250", flag: "\u{1F1F7}\u{1F1FC}" },
|
|
390
|
+
{ name: "Saint Barth\xE9lemy", code: "BL", phoneCode: "+590", flag: "\u{1F1E7}\u{1F1F1}" },
|
|
391
|
+
{ name: "Saint Helena, Ascension and Tristan da Cunha", code: "SH", phoneCode: "+290", flag: "\u{1F1F8}\u{1F1ED}" },
|
|
392
|
+
{ name: "Saint Kitts and Nevis", code: "KN", phoneCode: "+1", flag: "\u{1F1F0}\u{1F1F3}" },
|
|
393
|
+
{ name: "Saint Lucia", code: "LC", phoneCode: "+1", flag: "\u{1F1F1}\u{1F1E8}" },
|
|
394
|
+
{ name: "Saint Martin (French part)", code: "MF", phoneCode: "+590", flag: "\u{1F1F2}\u{1F1EB}" },
|
|
395
|
+
{ name: "Saint Pierre and Miquelon", code: "PM", phoneCode: "+508", flag: "\u{1F1F5}\u{1F1F2}" },
|
|
396
|
+
{ name: "Saint Vincent and the Grenadines", code: "VC", phoneCode: "+1", flag: "\u{1F1FB}\u{1F1E8}" },
|
|
397
|
+
{ name: "Samoa", code: "WS", phoneCode: "+685", flag: "\u{1F1FC}\u{1F1F8}" },
|
|
398
|
+
{ name: "San Marino", code: "SM", phoneCode: "+378", flag: "\u{1F1F8}\u{1F1F2}" },
|
|
399
|
+
{ name: "Sao Tome and Principe", code: "ST", phoneCode: "+239", flag: "\u{1F1F8}\u{1F1F9}" },
|
|
400
|
+
{ name: "Saudi Arabia", code: "SA", phoneCode: "+966", flag: "\u{1F1F8}\u{1F1E6}" },
|
|
401
|
+
{ name: "Senegal", code: "SN", phoneCode: "+221", flag: "\u{1F1F8}\u{1F1F3}" },
|
|
402
|
+
{ name: "Serbia", code: "RS", phoneCode: "+381", flag: "\u{1F1F7}\u{1F1F8}" },
|
|
403
|
+
{ name: "Seychelles", code: "SC", phoneCode: "+248", flag: "\u{1F1F8}\u{1F1E8}" },
|
|
404
|
+
{ name: "Sierra Leone", code: "SL", phoneCode: "+232", flag: "\u{1F1F8}\u{1F1F1}" },
|
|
405
|
+
{ name: "Singapore", code: "SG", phoneCode: "+65", flag: "\u{1F1F8}\u{1F1EC}" },
|
|
406
|
+
{ name: "Sint Maarten (Dutch part)", code: "SX", phoneCode: "+1", flag: "\u{1F1F8}\u{1F1FD}" },
|
|
407
|
+
{ name: "Slovakia", code: "SK", phoneCode: "+421", flag: "\u{1F1F8}\u{1F1F0}" },
|
|
408
|
+
{ name: "Slovenia", code: "SI", phoneCode: "+386", flag: "\u{1F1F8}\u{1F1EE}" },
|
|
409
|
+
{ name: "Solomon Islands", code: "SB", phoneCode: "+677", flag: "\u{1F1F8}\u{1F1E7}" },
|
|
410
|
+
{ name: "Somalia", code: "SO", phoneCode: "+252", flag: "\u{1F1F8}\u{1F1F4}" },
|
|
411
|
+
{ name: "South Africa", code: "ZA", phoneCode: "+27", flag: "\u{1F1FF}\u{1F1E6}" },
|
|
412
|
+
{ name: "South Georgia and the South Sandwich Islands", code: "GS", phoneCode: "+500", flag: "\u{1F1EC}\u{1F1F8}" },
|
|
413
|
+
{ name: "South Sudan", code: "SS", phoneCode: "+211", flag: "\u{1F1F8}\u{1F1F8}" },
|
|
414
|
+
{ name: "Spain", code: "ES", phoneCode: "+34", flag: "\u{1F1EA}\u{1F1F8}" },
|
|
415
|
+
{ name: "Sri Lanka", code: "LK", phoneCode: "+94", flag: "\u{1F1F1}\u{1F1F0}" },
|
|
416
|
+
{ name: "Sudan", code: "SD", phoneCode: "+249", flag: "\u{1F1F8}\u{1F1E9}" },
|
|
417
|
+
{ name: "Suriname", code: "SR", phoneCode: "+597", flag: "\u{1F1F8}\u{1F1F7}" },
|
|
418
|
+
{ name: "Svalbard and Jan Mayen", code: "SJ", phoneCode: "+47", flag: "\u{1F1F8}\u{1F1EF}" },
|
|
419
|
+
{ name: "Swaziland", code: "SZ", phoneCode: "+268", flag: "\u{1F1F8}\u{1F1FF}" },
|
|
420
|
+
{ name: "Sweden", code: "SE", phoneCode: "+46", flag: "\u{1F1F8}\u{1F1EA}" },
|
|
421
|
+
{ name: "Switzerland", code: "CH", phoneCode: "+41", flag: "\u{1F1E8}\u{1F1ED}" },
|
|
422
|
+
{ name: "Syrian Arab Republic", code: "SY", phoneCode: "+963", flag: "\u{1F1F8}\u{1F1FE}" },
|
|
423
|
+
{ name: "Taiwan, Province of China", code: "TW", phoneCode: "+886", flag: "\u{1F1F9}\u{1F1FC}" },
|
|
424
|
+
{ name: "Tajikistan", code: "TJ", phoneCode: "+992", flag: "\u{1F1F9}\u{1F1EF}" },
|
|
425
|
+
{ name: "Tanzania, United Republic of", code: "TZ", phoneCode: "+255", flag: "\u{1F1F9}\u{1F1FF}" },
|
|
426
|
+
{ name: "Thailand", code: "TH", phoneCode: "+66", flag: "\u{1F1F9}\u{1F1ED}" },
|
|
427
|
+
{ name: "Timor-Leste", code: "TL", phoneCode: "+670", flag: "\u{1F1F9}\u{1F1F1}" },
|
|
428
|
+
{ name: "Togo", code: "TG", phoneCode: "+228", flag: "\u{1F1F9}\u{1F1EC}" },
|
|
429
|
+
{ name: "Tokelau", code: "TK", phoneCode: "+690", flag: "\u{1F1F9}\u{1F1F0}" },
|
|
430
|
+
{ name: "Tonga", code: "TO", phoneCode: "+676", flag: "\u{1F1F9}\u{1F1F4}" },
|
|
431
|
+
{ name: "Trinidad and Tobago", code: "TT", phoneCode: "+1", flag: "\u{1F1F9}\u{1F1F9}" },
|
|
432
|
+
{ name: "Tunisia", code: "TN", phoneCode: "+216", flag: "\u{1F1F9}\u{1F1F3}" },
|
|
433
|
+
{ name: "Turkey", code: "TR", phoneCode: "+90", flag: "\u{1F1F9}\u{1F1F7}" },
|
|
434
|
+
{ name: "Turkmenistan", code: "TM", phoneCode: "+993", flag: "\u{1F1F9}\u{1F1F2}" },
|
|
435
|
+
{ name: "Turks and Caicos Islands", code: "TC", phoneCode: "+1", flag: "\u{1F1F9}\u{1F1E8}" },
|
|
436
|
+
{ name: "Tuvalu", code: "TV", phoneCode: "+688", flag: "\u{1F1F9}\u{1F1FB}" },
|
|
437
|
+
{ name: "Uganda", code: "UG", phoneCode: "+256", flag: "\u{1F1FA}\u{1F1EC}" },
|
|
438
|
+
{ name: "Ukraine", code: "UA", phoneCode: "+380", flag: "\u{1F1FA}\u{1F1E6}" },
|
|
439
|
+
{ name: "United Arab Emirates", code: "AE", phoneCode: "+971", flag: "\u{1F1E6}\u{1F1EA}" },
|
|
440
|
+
{ name: "United Kingdom", code: "GB", phoneCode: "+44", flag: "\u{1F1EC}\u{1F1E7}" },
|
|
441
|
+
{ name: "United States", code: "US", phoneCode: "+1", flag: "\u{1F1FA}\u{1F1F8}" },
|
|
442
|
+
{ name: "United States Minor Outlying Islands", code: "UM", phoneCode: "+1", flag: "\u{1F1FA}\u{1F1F2}" },
|
|
443
|
+
{ name: "Uruguay", code: "UY", phoneCode: "+598", flag: "\u{1F1FA}\u{1F1FE}" },
|
|
444
|
+
{ name: "Uzbekistan", code: "UZ", phoneCode: "+998", flag: "\u{1F1FA}\u{1F1FF}" },
|
|
445
|
+
{ name: "Vanuatu", code: "VU", phoneCode: "+678", flag: "\u{1F1FB}\u{1F1FA}" },
|
|
446
|
+
{ name: "Venezuela, Bolivarian Republic of", code: "VE", phoneCode: "+58", flag: "\u{1F1FB}\u{1F1EA}" },
|
|
447
|
+
{ name: "Viet Nam", code: "VN", phoneCode: "+84", flag: "\u{1F1FB}\u{1F1F3}" },
|
|
448
|
+
{ name: "Virgin Islands, British", code: "VG", phoneCode: "+1", flag: "\u{1F1FB}\u{1F1EC}" },
|
|
449
|
+
{ name: "Virgin Islands, U.S.", code: "VI", phoneCode: "+1", flag: "\u{1F1FB}\u{1F1EE}" },
|
|
450
|
+
{ name: "Wallis and Futuna", code: "WF", phoneCode: "+681", flag: "\u{1F1FC}\u{1F1EB}" },
|
|
451
|
+
{ name: "Western Sahara", code: "EH", phoneCode: "+212", flag: "\u{1F1EA}\u{1F1ED}" },
|
|
452
|
+
{ name: "Yemen", code: "YE", phoneCode: "+967", flag: "\u{1F1FE}\u{1F1EA}" },
|
|
453
|
+
{ name: "Zambia", code: "ZM", phoneCode: "+260", flag: "\u{1F1FF}\u{1F1F2}" },
|
|
454
|
+
{ name: "Zimbabwe", code: "ZW", phoneCode: "+263", flag: "\u{1F1FF}\u{1F1FC}" }
|
|
455
|
+
];
|
|
204
456
|
|
|
205
457
|
// src/utils/error.util.ts
|
|
206
458
|
var validateRegex = (value, regex) => regex.test(value);
|
|
@@ -1777,6 +2029,7 @@ var BaseSelect = ({
|
|
|
1777
2029
|
disabled = false,
|
|
1778
2030
|
loading = false,
|
|
1779
2031
|
validationError = "",
|
|
2032
|
+
showBottomText = true,
|
|
1780
2033
|
label = "",
|
|
1781
2034
|
hint = "",
|
|
1782
2035
|
required = false,
|
|
@@ -2030,8 +2283,8 @@ var BaseSelect = ({
|
|
|
2030
2283
|
]
|
|
2031
2284
|
}
|
|
2032
2285
|
),
|
|
2033
|
-
hint && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(BaseHint, { hint }),
|
|
2034
|
-
validationError && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(BaseInputError, { errorMessage: validationError })
|
|
2286
|
+
hint && showBottomText && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(BaseHint, { hint }),
|
|
2287
|
+
validationError && showBottomText && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(BaseInputError, { errorMessage: validationError })
|
|
2035
2288
|
] });
|
|
2036
2289
|
};
|
|
2037
2290
|
|
|
@@ -2080,6 +2333,7 @@ var BaseInput = ({
|
|
|
2080
2333
|
mask,
|
|
2081
2334
|
placeholder,
|
|
2082
2335
|
validationError = "",
|
|
2336
|
+
showBottomText = true,
|
|
2083
2337
|
hint = "",
|
|
2084
2338
|
rules = [],
|
|
2085
2339
|
isAmountInput = false,
|
|
@@ -2183,8 +2437,8 @@ var BaseInput = ({
|
|
|
2183
2437
|
]
|
|
2184
2438
|
}
|
|
2185
2439
|
),
|
|
2186
|
-
(hint || localHint) && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("p", { className: "text-body-3xs text-light-copy", children: localHint || hint }),
|
|
2187
|
-
(validationError || localError) && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("p", { className: "text-body-3xs text-red-500", children: localError || validationError })
|
|
2440
|
+
(hint || localHint) && showBottomText && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("p", { className: "text-body-3xs text-light-copy", children: localHint || hint }),
|
|
2441
|
+
(validationError || localError) && showBottomText && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("p", { className: "text-body-3xs text-red-500", children: localError || validationError })
|
|
2188
2442
|
] });
|
|
2189
2443
|
};
|
|
2190
2444
|
|
|
@@ -2458,11 +2712,97 @@ function BzpCheckoutButton({
|
|
|
2458
2712
|
}
|
|
2459
2713
|
|
|
2460
2714
|
// src/buzapay-checkout/checkout-card.tsx
|
|
2461
|
-
var
|
|
2715
|
+
var import_react13 = require("react");
|
|
2462
2716
|
|
|
2463
2717
|
// src/components/pay-by-card.tsx
|
|
2464
|
-
var
|
|
2718
|
+
var import_react10 = require("react");
|
|
2719
|
+
|
|
2720
|
+
// src/components/base/phone-number-input.tsx
|
|
2721
|
+
var import_react9 = __toESM(require("react"), 1);
|
|
2465
2722
|
var import_jsx_runtime35 = require("react/jsx-runtime");
|
|
2723
|
+
var BasePhoneNumberInput = ({
|
|
2724
|
+
phoneCodeOptions,
|
|
2725
|
+
value,
|
|
2726
|
+
onChange,
|
|
2727
|
+
onCodeChange,
|
|
2728
|
+
label = "",
|
|
2729
|
+
required = false,
|
|
2730
|
+
disabled = false,
|
|
2731
|
+
loading = false,
|
|
2732
|
+
validationError = "",
|
|
2733
|
+
hint = "",
|
|
2734
|
+
defaultCountryCode,
|
|
2735
|
+
preventPaste = false,
|
|
2736
|
+
showCopyIcon = false,
|
|
2737
|
+
containerClassName = "",
|
|
2738
|
+
inputClassName = "",
|
|
2739
|
+
placeholder
|
|
2740
|
+
}) => {
|
|
2741
|
+
const safeDefaultCode = phoneCodeOptions?.[0]?.value ?? "+1";
|
|
2742
|
+
const [selectedCode, setSelectedCode] = import_react9.default.useState(safeDefaultCode);
|
|
2743
|
+
const selectedMeta = import_react9.default.useMemo(() => {
|
|
2744
|
+
return phoneCodeOptions.find((o) => o.value === selectedCode);
|
|
2745
|
+
}, [phoneCodeOptions, selectedCode]);
|
|
2746
|
+
const getFormattedCode = (codeValue) => codeValue.split("-")[0];
|
|
2747
|
+
const handleCountryChange = (nextValue) => {
|
|
2748
|
+
setSelectedCode(nextValue);
|
|
2749
|
+
onCodeChange?.(getFormattedCode(nextValue));
|
|
2750
|
+
};
|
|
2751
|
+
const handleChange = (e) => {
|
|
2752
|
+
const incoming = e;
|
|
2753
|
+
onChange?.(incoming);
|
|
2754
|
+
};
|
|
2755
|
+
const computedPlaceholder = placeholder ?? selectedMeta?.placeholder ?? (label ? `Enter ${label.toLowerCase()}` : "Enter phone number");
|
|
2756
|
+
(0, import_react9.useEffect)(() => {
|
|
2757
|
+
const nextValue = defaultCountryCode ?? safeDefaultCode;
|
|
2758
|
+
setSelectedCode(nextValue);
|
|
2759
|
+
onCodeChange?.(getFormattedCode(nextValue));
|
|
2760
|
+
}, [defaultCountryCode]);
|
|
2761
|
+
return /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: `flex flex-col gap-2`, children: [
|
|
2762
|
+
label ? /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("p", { className: "mb-0 text-body-2xs font-normal text-heading-text", children: [
|
|
2763
|
+
label,
|
|
2764
|
+
required && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("span", { className: "text-orange-required", children: " *" })
|
|
2765
|
+
] }) : null,
|
|
2766
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: `flex items-center gap-2 ${containerClassName}`, children: [
|
|
2767
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "w-1/3", children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
2768
|
+
BaseSelect,
|
|
2769
|
+
{
|
|
2770
|
+
required: true,
|
|
2771
|
+
options: phoneCodeOptions,
|
|
2772
|
+
value: selectedCode,
|
|
2773
|
+
showBottomText: false,
|
|
2774
|
+
itemImageType: "country",
|
|
2775
|
+
onChange: handleCountryChange,
|
|
2776
|
+
validationError,
|
|
2777
|
+
placeholder: "+234"
|
|
2778
|
+
}
|
|
2779
|
+
) }),
|
|
2780
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "w-2/3", children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
2781
|
+
BaseInput,
|
|
2782
|
+
{
|
|
2783
|
+
className: inputClassName,
|
|
2784
|
+
required,
|
|
2785
|
+
disabled,
|
|
2786
|
+
loading,
|
|
2787
|
+
validationError,
|
|
2788
|
+
showBottomText: false,
|
|
2789
|
+
hint,
|
|
2790
|
+
value,
|
|
2791
|
+
onChange: handleChange,
|
|
2792
|
+
rules: ["numeric"],
|
|
2793
|
+
preventPaste,
|
|
2794
|
+
showCopyIcon,
|
|
2795
|
+
placeholder: computedPlaceholder
|
|
2796
|
+
}
|
|
2797
|
+
) })
|
|
2798
|
+
] }),
|
|
2799
|
+
hint && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("p", { className: "text-body-3xs text-light-copy", children: hint }),
|
|
2800
|
+
validationError && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("p", { className: "text-body-3xs text-red-500", children: validationError })
|
|
2801
|
+
] });
|
|
2802
|
+
};
|
|
2803
|
+
|
|
2804
|
+
// src/components/pay-by-card.tsx
|
|
2805
|
+
var import_jsx_runtime36 = require("react/jsx-runtime");
|
|
2466
2806
|
function PayByCard({
|
|
2467
2807
|
secretKey,
|
|
2468
2808
|
paymentObject,
|
|
@@ -2471,18 +2811,22 @@ function PayByCard({
|
|
|
2471
2811
|
onError,
|
|
2472
2812
|
caller = "buzapay"
|
|
2473
2813
|
}) {
|
|
2474
|
-
const [formIndex, setFormIndex] = (0,
|
|
2475
|
-
const [message, setMessage] = (0,
|
|
2476
|
-
const [isMakingPayment, setIsMakingPayment] = (0,
|
|
2477
|
-
const [loading, setLoading] = (0,
|
|
2478
|
-
const [
|
|
2479
|
-
const [
|
|
2480
|
-
const [
|
|
2481
|
-
const [
|
|
2482
|
-
const [
|
|
2483
|
-
const [
|
|
2484
|
-
const [
|
|
2485
|
-
const [
|
|
2814
|
+
const [formIndex, setFormIndex] = (0, import_react10.useState)(0);
|
|
2815
|
+
const [message, setMessage] = (0, import_react10.useState)("");
|
|
2816
|
+
const [isMakingPayment, setIsMakingPayment] = (0, import_react10.useState)(false);
|
|
2817
|
+
const [loading, setLoading] = (0, import_react10.useState)(false);
|
|
2818
|
+
const [defaultCountryCode, setDefaultCountryCode] = (0, import_react10.useState)("");
|
|
2819
|
+
const [cardType, setCardType] = (0, import_react10.useState)("");
|
|
2820
|
+
const [transactionReference, setTransactionReference] = (0, import_react10.useState)("");
|
|
2821
|
+
const [loadingCountries, setLoadingCountries] = (0, import_react10.useState)(false);
|
|
2822
|
+
const [loadingStates, setLoadingStates] = (0, import_react10.useState)(false);
|
|
2823
|
+
const [rawCountries, setRawCountries] = (0, import_react10.useState)([]);
|
|
2824
|
+
const [countries, setCountries] = (0, import_react10.useState)([]);
|
|
2825
|
+
const [countryStates, setCountryStates] = (0, import_react10.useState)([]);
|
|
2826
|
+
const [phoneCodeOptions, setPhoneCodeOptions] = (0, import_react10.useState)(
|
|
2827
|
+
[]
|
|
2828
|
+
);
|
|
2829
|
+
const [billingForm, setBillingForm] = (0, import_react10.useState)({
|
|
2486
2830
|
address1: "",
|
|
2487
2831
|
address2: "",
|
|
2488
2832
|
postalCode: "",
|
|
@@ -2490,9 +2834,10 @@ function PayByCard({
|
|
|
2490
2834
|
city: "",
|
|
2491
2835
|
country: "",
|
|
2492
2836
|
emailAddress: "",
|
|
2493
|
-
phoneNumber: ""
|
|
2837
|
+
phoneNumber: "",
|
|
2838
|
+
phoneNumberExt: ""
|
|
2494
2839
|
});
|
|
2495
|
-
const [payForm, setPayForm] = (0,
|
|
2840
|
+
const [payForm, setPayForm] = (0, import_react10.useState)({
|
|
2496
2841
|
customerName: "",
|
|
2497
2842
|
cardNo: "",
|
|
2498
2843
|
expireDate: "",
|
|
@@ -2500,10 +2845,10 @@ function PayByCard({
|
|
|
2500
2845
|
cardPin: ""
|
|
2501
2846
|
// Only required for Verve cards
|
|
2502
2847
|
});
|
|
2503
|
-
const [billingErrors, setBillingErrors] = (0,
|
|
2848
|
+
const [billingErrors, setBillingErrors] = (0, import_react10.useState)(
|
|
2504
2849
|
{}
|
|
2505
2850
|
);
|
|
2506
|
-
const [payErrors, setPayErrors] = (0,
|
|
2851
|
+
const [payErrors, setPayErrors] = (0, import_react10.useState)({});
|
|
2507
2852
|
const billingRules = {
|
|
2508
2853
|
address1: "required",
|
|
2509
2854
|
address2: "",
|
|
@@ -2563,7 +2908,7 @@ function PayByCard({
|
|
|
2563
2908
|
setIsMakingPayment(true);
|
|
2564
2909
|
setMessage("");
|
|
2565
2910
|
const cardDetails = {
|
|
2566
|
-
pan: payForm.cardNo
|
|
2911
|
+
pan: payForm.cardNo ? payForm.cardNo.replace(/ /g, "") : "",
|
|
2567
2912
|
expiryDate: payForm.expireDate ?? "",
|
|
2568
2913
|
cvv: payForm.cvv ?? "",
|
|
2569
2914
|
cardScheme: cardType,
|
|
@@ -2578,7 +2923,7 @@ function PayByCard({
|
|
|
2578
2923
|
city: billingForm.city ?? "",
|
|
2579
2924
|
country: billingForm.country ?? "",
|
|
2580
2925
|
emailAddress: billingForm.emailAddress ?? "",
|
|
2581
|
-
phoneNumber: billingForm.phoneNumber
|
|
2926
|
+
phoneNumber: billingForm.phoneNumber ? `${billingForm.phoneNumberExt}${billingForm.phoneNumber}` : ""
|
|
2582
2927
|
};
|
|
2583
2928
|
const encryptedCardDetails = encryptPayload(secretKey, cardDetails);
|
|
2584
2929
|
let payload = null;
|
|
@@ -2614,7 +2959,6 @@ function PayByCard({
|
|
|
2614
2959
|
}
|
|
2615
2960
|
const request = caller === "buzapay" ? { ...payload, merchantId: secretKey } : { ...payloadMiden, merchantId: secretKey };
|
|
2616
2961
|
let response = await authorizeCardPayment(environment, request, caller);
|
|
2617
|
-
debugger;
|
|
2618
2962
|
if (response?.responseParam) {
|
|
2619
2963
|
response = decryptPayload(environment, response.responseParam);
|
|
2620
2964
|
}
|
|
@@ -2800,15 +3144,25 @@ function PayByCard({
|
|
|
2800
3144
|
setCardType(cardTypeHandler(event));
|
|
2801
3145
|
payRules.cardPin = cardType === "Verve" ? "required|numeric" : "";
|
|
2802
3146
|
};
|
|
2803
|
-
(0,
|
|
3147
|
+
(0, import_react10.useEffect)(() => {
|
|
2804
3148
|
(async () => {
|
|
2805
3149
|
await generatePaymentLinkHandler();
|
|
2806
3150
|
await getAllCountries();
|
|
3151
|
+
const codeOptions = COUNTRIES.map((country) => {
|
|
3152
|
+
return {
|
|
3153
|
+
value: `${country.phoneCode}-${country.code}`,
|
|
3154
|
+
label: `${country.phoneCode}`,
|
|
3155
|
+
flag: country.flag,
|
|
3156
|
+
phoneCode: country.phoneCode,
|
|
3157
|
+
countryCode: country.code
|
|
3158
|
+
};
|
|
3159
|
+
}).sort((a, b) => a.label.localeCompare(b.label));
|
|
3160
|
+
setPhoneCodeOptions(codeOptions);
|
|
2807
3161
|
})();
|
|
2808
3162
|
}, []);
|
|
2809
|
-
return /* @__PURE__ */ (0,
|
|
2810
|
-
formIndex === 0 && /* @__PURE__ */ (0,
|
|
2811
|
-
/* @__PURE__ */ (0,
|
|
3163
|
+
return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("div", { className: "flex flex-col gap-6", children: [
|
|
3164
|
+
formIndex === 0 && /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("div", { className: "grid grid-cols-2 gap-6 overflow-y-auto", children: [
|
|
3165
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "col-span-2", children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
2812
3166
|
BaseInput,
|
|
2813
3167
|
{
|
|
2814
3168
|
label: "Address Line 1",
|
|
@@ -2823,7 +3177,7 @@ function PayByCard({
|
|
|
2823
3177
|
validationError: billingErrors.address1 ?? ""
|
|
2824
3178
|
}
|
|
2825
3179
|
) }),
|
|
2826
|
-
/* @__PURE__ */ (0,
|
|
3180
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "col-span-2", children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
2827
3181
|
BaseInput,
|
|
2828
3182
|
{
|
|
2829
3183
|
label: "Address Line 2",
|
|
@@ -2832,7 +3186,7 @@ function PayByCard({
|
|
|
2832
3186
|
validationError: billingErrors.address2 ?? ""
|
|
2833
3187
|
}
|
|
2834
3188
|
) }),
|
|
2835
|
-
/* @__PURE__ */ (0,
|
|
3189
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
2836
3190
|
BaseSelect,
|
|
2837
3191
|
{
|
|
2838
3192
|
label: "Select Country",
|
|
@@ -2843,6 +3197,12 @@ function PayByCard({
|
|
|
2843
3197
|
onChange: (e) => {
|
|
2844
3198
|
setBillingForm({ ...billingForm, country: e, state: "" });
|
|
2845
3199
|
getStates(e);
|
|
3200
|
+
const selectedCountry = COUNTRIES.filter(
|
|
3201
|
+
(c) => c.code.toLowerCase() === e.toLowerCase()
|
|
3202
|
+
)[0];
|
|
3203
|
+
if (selectedCountry) {
|
|
3204
|
+
setDefaultCountryCode(`${selectedCountry.phoneCode}-${selectedCountry.code}`);
|
|
3205
|
+
}
|
|
2846
3206
|
if (billingErrors.country) {
|
|
2847
3207
|
setBillingErrors((er) => ({ ...er, country: "" }));
|
|
2848
3208
|
}
|
|
@@ -2850,7 +3210,7 @@ function PayByCard({
|
|
|
2850
3210
|
validationError: billingErrors.country ?? ""
|
|
2851
3211
|
}
|
|
2852
3212
|
),
|
|
2853
|
-
/* @__PURE__ */ (0,
|
|
3213
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
2854
3214
|
BaseSelect,
|
|
2855
3215
|
{
|
|
2856
3216
|
label: "Select State",
|
|
@@ -2867,7 +3227,7 @@ function PayByCard({
|
|
|
2867
3227
|
validationError: billingErrors.state ?? ""
|
|
2868
3228
|
}
|
|
2869
3229
|
),
|
|
2870
|
-
/* @__PURE__ */ (0,
|
|
3230
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
2871
3231
|
BaseInput,
|
|
2872
3232
|
{
|
|
2873
3233
|
label: "City",
|
|
@@ -2882,7 +3242,7 @@ function PayByCard({
|
|
|
2882
3242
|
validationError: billingErrors.city ?? ""
|
|
2883
3243
|
}
|
|
2884
3244
|
),
|
|
2885
|
-
/* @__PURE__ */ (0,
|
|
3245
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
2886
3246
|
BaseInput,
|
|
2887
3247
|
{
|
|
2888
3248
|
label: "Postal Code",
|
|
@@ -2897,7 +3257,7 @@ function PayByCard({
|
|
|
2897
3257
|
validationError: billingErrors.postalCode ?? ""
|
|
2898
3258
|
}
|
|
2899
3259
|
),
|
|
2900
|
-
/* @__PURE__ */ (0,
|
|
3260
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
2901
3261
|
BaseInput,
|
|
2902
3262
|
{
|
|
2903
3263
|
label: "Email",
|
|
@@ -2912,29 +3272,37 @@ function PayByCard({
|
|
|
2912
3272
|
validationError: billingErrors.emailAddress ?? ""
|
|
2913
3273
|
}
|
|
2914
3274
|
),
|
|
2915
|
-
/* @__PURE__ */ (0,
|
|
2916
|
-
|
|
3275
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "col-span-2", children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
3276
|
+
BasePhoneNumberInput,
|
|
2917
3277
|
{
|
|
2918
3278
|
label: "Phone Number",
|
|
2919
3279
|
required: true,
|
|
2920
3280
|
value: billingForm.phoneNumber,
|
|
3281
|
+
phoneCodeOptions,
|
|
3282
|
+
defaultCountryCode,
|
|
2921
3283
|
onChange: (e) => {
|
|
2922
3284
|
setBillingForm({ ...billingForm, phoneNumber: e });
|
|
2923
3285
|
if (billingErrors.phoneNumber) {
|
|
2924
3286
|
setBillingErrors((er) => ({ ...er, phoneNumber: "" }));
|
|
2925
3287
|
}
|
|
2926
3288
|
},
|
|
3289
|
+
onCodeChange: (e) => {
|
|
3290
|
+
setBillingForm({ ...billingForm, phoneNumberExt: e });
|
|
3291
|
+
if (billingErrors.phoneNumberExt) {
|
|
3292
|
+
setBillingErrors((er) => ({ ...er, phoneNumberExt: "" }));
|
|
3293
|
+
}
|
|
3294
|
+
},
|
|
2927
3295
|
validationError: billingErrors.phoneNumber ?? ""
|
|
2928
3296
|
}
|
|
2929
|
-
)
|
|
3297
|
+
) })
|
|
2930
3298
|
] }),
|
|
2931
|
-
formIndex === 1 && /* @__PURE__ */ (0,
|
|
3299
|
+
formIndex === 1 && /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
|
|
2932
3300
|
"div",
|
|
2933
3301
|
{
|
|
2934
3302
|
className: "grid grid-cols-2 gap-6 overflow-y-auto",
|
|
2935
3303
|
style: { maxHeight: 320 },
|
|
2936
3304
|
children: [
|
|
2937
|
-
/* @__PURE__ */ (0,
|
|
3305
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "col-span-2", children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
2938
3306
|
BaseInput,
|
|
2939
3307
|
{
|
|
2940
3308
|
label: "Card Name",
|
|
@@ -2949,7 +3317,7 @@ function PayByCard({
|
|
|
2949
3317
|
validationError: payErrors.customerName ?? ""
|
|
2950
3318
|
}
|
|
2951
3319
|
) }),
|
|
2952
|
-
/* @__PURE__ */ (0,
|
|
3320
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "col-span-2", children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
2953
3321
|
BaseInput,
|
|
2954
3322
|
{
|
|
2955
3323
|
label: "Card Number",
|
|
@@ -2968,7 +3336,7 @@ function PayByCard({
|
|
|
2968
3336
|
validationError: payErrors.cardNo ?? ""
|
|
2969
3337
|
}
|
|
2970
3338
|
) }),
|
|
2971
|
-
/* @__PURE__ */ (0,
|
|
3339
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
2972
3340
|
BaseInput,
|
|
2973
3341
|
{
|
|
2974
3342
|
label: "Expiry Date",
|
|
@@ -2984,7 +3352,7 @@ function PayByCard({
|
|
|
2984
3352
|
validationError: payErrors.expireDate ?? ""
|
|
2985
3353
|
}
|
|
2986
3354
|
),
|
|
2987
|
-
/* @__PURE__ */ (0,
|
|
3355
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
2988
3356
|
BaseInput,
|
|
2989
3357
|
{
|
|
2990
3358
|
label: "CVV",
|
|
@@ -3000,7 +3368,7 @@ function PayByCard({
|
|
|
3000
3368
|
validationError: payErrors.cvv ?? ""
|
|
3001
3369
|
}
|
|
3002
3370
|
),
|
|
3003
|
-
cardType === "Verve" && /* @__PURE__ */ (0,
|
|
3371
|
+
cardType === "Verve" && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
3004
3372
|
BaseInput,
|
|
3005
3373
|
{
|
|
3006
3374
|
label: "Card Pin",
|
|
@@ -3020,7 +3388,7 @@ function PayByCard({
|
|
|
3020
3388
|
]
|
|
3021
3389
|
}
|
|
3022
3390
|
),
|
|
3023
|
-
/* @__PURE__ */ (0,
|
|
3391
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
3024
3392
|
BaseButton,
|
|
3025
3393
|
{
|
|
3026
3394
|
label: formIndex === 0 ? "Proceed" : `Pay ${formatAmountHandler}`,
|
|
@@ -3036,8 +3404,8 @@ function PayByCard({
|
|
|
3036
3404
|
}
|
|
3037
3405
|
|
|
3038
3406
|
// src/components/pay-by-transfer.tsx
|
|
3039
|
-
var
|
|
3040
|
-
var
|
|
3407
|
+
var import_react11 = require("react");
|
|
3408
|
+
var import_jsx_runtime37 = require("react/jsx-runtime");
|
|
3041
3409
|
var PayByTransfer = ({
|
|
3042
3410
|
secretKey,
|
|
3043
3411
|
paymentObject,
|
|
@@ -3047,25 +3415,25 @@ var PayByTransfer = ({
|
|
|
3047
3415
|
onError,
|
|
3048
3416
|
caller = "buzapay"
|
|
3049
3417
|
}) => {
|
|
3050
|
-
const [formIndex, setFormIndex] = (0,
|
|
3051
|
-
const [isMakingPayment, setIsMakingPayment] = (0,
|
|
3052
|
-
const [isConfirmCall, setIsConfirmCall] = (0,
|
|
3053
|
-
const [isPaymentConfirmed, setIsPaymentConfirmed] = (0,
|
|
3054
|
-
const [transactionReference, setTransactionReference] = (0,
|
|
3055
|
-
const [paymentReferenceStatus, setPaymentReferenceStatus] = (0,
|
|
3056
|
-
const [isFetchingPaymentDetails, setIsFetchingPaymentDetails] = (0,
|
|
3057
|
-
const [paymentReferenceDetails, setPaymentReferenceDetails] = (0,
|
|
3058
|
-
const [paymentAccountDetails, setPaymentAccountDetails] = (0,
|
|
3059
|
-
const [paymentMade, setPaymentMade] = (0,
|
|
3060
|
-
const [loading, setLoading] = (0,
|
|
3061
|
-
const [message, setMessage] = (0,
|
|
3062
|
-
const [remainingSeconds, setRemainingSeconds] = (0,
|
|
3063
|
-
const [countDownTime, setCountDownTime] = (0,
|
|
3064
|
-
const intervalRef = (0,
|
|
3065
|
-
const [transferForm, setTransferForm] = (0,
|
|
3418
|
+
const [formIndex, setFormIndex] = (0, import_react11.useState)(0);
|
|
3419
|
+
const [isMakingPayment, setIsMakingPayment] = (0, import_react11.useState)(false);
|
|
3420
|
+
const [isConfirmCall, setIsConfirmCall] = (0, import_react11.useState)(false);
|
|
3421
|
+
const [isPaymentConfirmed, setIsPaymentConfirmed] = (0, import_react11.useState)(false);
|
|
3422
|
+
const [transactionReference, setTransactionReference] = (0, import_react11.useState)("");
|
|
3423
|
+
const [paymentReferenceStatus, setPaymentReferenceStatus] = (0, import_react11.useState)("");
|
|
3424
|
+
const [isFetchingPaymentDetails, setIsFetchingPaymentDetails] = (0, import_react11.useState)(false);
|
|
3425
|
+
const [paymentReferenceDetails, setPaymentReferenceDetails] = (0, import_react11.useState)(null);
|
|
3426
|
+
const [paymentAccountDetails, setPaymentAccountDetails] = (0, import_react11.useState)(null);
|
|
3427
|
+
const [paymentMade, setPaymentMade] = (0, import_react11.useState)(false);
|
|
3428
|
+
const [loading, setLoading] = (0, import_react11.useState)(false);
|
|
3429
|
+
const [message, setMessage] = (0, import_react11.useState)("");
|
|
3430
|
+
const [remainingSeconds, setRemainingSeconds] = (0, import_react11.useState)(30 * 60);
|
|
3431
|
+
const [countDownTime, setCountDownTime] = (0, import_react11.useState)("00:00");
|
|
3432
|
+
const intervalRef = (0, import_react11.useRef)(null);
|
|
3433
|
+
const [transferForm, setTransferForm] = (0, import_react11.useState)({
|
|
3066
3434
|
customerName: ""
|
|
3067
3435
|
});
|
|
3068
|
-
const [transferErrors, setTransferErrors] = (0,
|
|
3436
|
+
const [transferErrors, setTransferErrors] = (0, import_react11.useState)(
|
|
3069
3437
|
{}
|
|
3070
3438
|
);
|
|
3071
3439
|
const transferRules = {
|
|
@@ -3215,12 +3583,12 @@ var PayByTransfer = ({
|
|
|
3215
3583
|
setLoading(false);
|
|
3216
3584
|
}
|
|
3217
3585
|
};
|
|
3218
|
-
const updateDisplay = (0,
|
|
3586
|
+
const updateDisplay = (0, import_react11.useCallback)((secs) => {
|
|
3219
3587
|
const minutes = String(Math.floor(secs / 60)).padStart(2, "0");
|
|
3220
3588
|
const seconds = String(secs % 60).padStart(2, "0");
|
|
3221
3589
|
setCountDownTime(`${minutes}:${seconds}`);
|
|
3222
3590
|
}, []);
|
|
3223
|
-
const startTimer = (0,
|
|
3591
|
+
const startTimer = (0, import_react11.useCallback)(() => {
|
|
3224
3592
|
if (intervalRef.current) {
|
|
3225
3593
|
clearInterval(intervalRef.current);
|
|
3226
3594
|
intervalRef.current = null;
|
|
@@ -3248,19 +3616,19 @@ var PayByTransfer = ({
|
|
|
3248
3616
|
intervalRef.current = null;
|
|
3249
3617
|
}
|
|
3250
3618
|
};
|
|
3251
|
-
(0,
|
|
3619
|
+
(0, import_react11.useEffect)(() => {
|
|
3252
3620
|
(async () => {
|
|
3253
3621
|
await generatePaymentLinkHandler();
|
|
3254
3622
|
})();
|
|
3255
3623
|
}, []);
|
|
3256
|
-
(0,
|
|
3624
|
+
(0, import_react11.useEffect)(() => {
|
|
3257
3625
|
if (remainingSeconds < 0 && intervalRef.current) {
|
|
3258
3626
|
stopTimer();
|
|
3259
3627
|
}
|
|
3260
3628
|
}, [remainingSeconds]);
|
|
3261
|
-
return /* @__PURE__ */ (0,
|
|
3262
|
-
formIndex === 0 && /* @__PURE__ */ (0,
|
|
3263
|
-
/* @__PURE__ */ (0,
|
|
3629
|
+
return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: "flex flex-col gap-10", children: [
|
|
3630
|
+
formIndex === 0 && /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: "flex flex-col gap-10", children: [
|
|
3631
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
3264
3632
|
BaseInput,
|
|
3265
3633
|
{
|
|
3266
3634
|
label: "Customer Name",
|
|
@@ -3275,7 +3643,7 @@ var PayByTransfer = ({
|
|
|
3275
3643
|
validationError: transferErrors.customerName ?? ""
|
|
3276
3644
|
}
|
|
3277
3645
|
),
|
|
3278
|
-
/* @__PURE__ */ (0,
|
|
3646
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
3279
3647
|
BaseButton,
|
|
3280
3648
|
{
|
|
3281
3649
|
label: `Pay ${formatAmountHandler}`,
|
|
@@ -3287,8 +3655,8 @@ var PayByTransfer = ({
|
|
|
3287
3655
|
}
|
|
3288
3656
|
)
|
|
3289
3657
|
] }),
|
|
3290
|
-
formIndex === 1 && /* @__PURE__ */ (0,
|
|
3291
|
-
/* @__PURE__ */ (0,
|
|
3658
|
+
formIndex === 1 && /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: "flex flex-col gap-10", children: [
|
|
3659
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(
|
|
3292
3660
|
"div",
|
|
3293
3661
|
{
|
|
3294
3662
|
className: [
|
|
@@ -3296,22 +3664,22 @@ var PayByTransfer = ({
|
|
|
3296
3664
|
caller === "miden" ? "bg-[#FAFDFF] border border-[#F0FAFF]" : "bg-[#EFF7FF]"
|
|
3297
3665
|
].join(" "),
|
|
3298
3666
|
children: [
|
|
3299
|
-
/* @__PURE__ */ (0,
|
|
3667
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
3300
3668
|
BaseLabelInfo,
|
|
3301
3669
|
{
|
|
3302
3670
|
label: "Bank Name",
|
|
3303
3671
|
value: `${paymentAccountDetails?.bank} ${paymentAccountDetails?.accountName}`
|
|
3304
3672
|
}
|
|
3305
3673
|
),
|
|
3306
|
-
/* @__PURE__ */ (0,
|
|
3307
|
-
/* @__PURE__ */ (0,
|
|
3674
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: "flex items-center justify-between", children: [
|
|
3675
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
3308
3676
|
BaseLabelInfo,
|
|
3309
3677
|
{
|
|
3310
3678
|
label: "Account Number",
|
|
3311
3679
|
value: paymentAccountDetails?.accountNumber
|
|
3312
3680
|
}
|
|
3313
3681
|
),
|
|
3314
|
-
/* @__PURE__ */ (0,
|
|
3682
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
3315
3683
|
BaseCopy,
|
|
3316
3684
|
{
|
|
3317
3685
|
color: "#9DBFDE",
|
|
@@ -3319,20 +3687,20 @@ var PayByTransfer = ({
|
|
|
3319
3687
|
}
|
|
3320
3688
|
)
|
|
3321
3689
|
] }),
|
|
3322
|
-
/* @__PURE__ */ (0,
|
|
3323
|
-
/* @__PURE__ */ (0,
|
|
3324
|
-
/* @__PURE__ */ (0,
|
|
3690
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: "flex items-center justify-between", children: [
|
|
3691
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)(BaseLabelInfo, { label: "Amount", value: formatAmountHandler }),
|
|
3692
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)(BaseCopy, { color: "#9DBFDE", copyText: formatAmountHandler })
|
|
3325
3693
|
] })
|
|
3326
3694
|
]
|
|
3327
3695
|
}
|
|
3328
3696
|
),
|
|
3329
|
-
caller === "buzapay" && /* @__PURE__ */ (0,
|
|
3697
|
+
caller === "buzapay" && /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("p", { className: "w-2/3 mx-auto text-center text-body-2xs font-medium text-sub-copy", children: [
|
|
3330
3698
|
"This account is for this transaction only and expires in",
|
|
3331
3699
|
" ",
|
|
3332
|
-
/* @__PURE__ */ (0,
|
|
3700
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)("span", { className: "text-orange-500", children: remainingSeconds >= 0 ? countDownTime : "00:00" })
|
|
3333
3701
|
] }),
|
|
3334
|
-
caller === "miden" && /* @__PURE__ */ (0,
|
|
3335
|
-
/* @__PURE__ */ (0,
|
|
3702
|
+
caller === "miden" && /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: "p-4 rounded-lg bg-[#FAFDFF] flex items-center gap-3", children: [
|
|
3703
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
3336
3704
|
BaseCircularCountdown,
|
|
3337
3705
|
{
|
|
3338
3706
|
value: remainingSeconds,
|
|
@@ -3343,16 +3711,16 @@ var PayByTransfer = ({
|
|
|
3343
3711
|
color: "#3b82f6"
|
|
3344
3712
|
}
|
|
3345
3713
|
),
|
|
3346
|
-
/* @__PURE__ */ (0,
|
|
3714
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("p", { className: "text-body-3xs font-medium text-light-copy", children: [
|
|
3347
3715
|
"This account is for this transaction only and expires in",
|
|
3348
|
-
/* @__PURE__ */ (0,
|
|
3716
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("span", { className: "text-[#1383E8] ml-2", children: [
|
|
3349
3717
|
countDownTime,
|
|
3350
3718
|
"..."
|
|
3351
3719
|
] })
|
|
3352
3720
|
] })
|
|
3353
3721
|
] }),
|
|
3354
|
-
/* @__PURE__ */ (0,
|
|
3355
|
-
/* @__PURE__ */ (0,
|
|
3722
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: "flex flex-col gap-4", children: [
|
|
3723
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
3356
3724
|
BaseButton,
|
|
3357
3725
|
{
|
|
3358
3726
|
label: "I have paid the money",
|
|
@@ -3363,7 +3731,7 @@ var PayByTransfer = ({
|
|
|
3363
3731
|
onClick: getReferenceDetails
|
|
3364
3732
|
}
|
|
3365
3733
|
),
|
|
3366
|
-
/* @__PURE__ */ (0,
|
|
3734
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
3367
3735
|
"button",
|
|
3368
3736
|
{
|
|
3369
3737
|
type: "button",
|
|
@@ -3378,8 +3746,8 @@ var PayByTransfer = ({
|
|
|
3378
3746
|
};
|
|
3379
3747
|
|
|
3380
3748
|
// src/components/pay-by-stable-coin.tsx
|
|
3381
|
-
var
|
|
3382
|
-
var
|
|
3749
|
+
var import_react12 = require("react");
|
|
3750
|
+
var import_jsx_runtime38 = require("react/jsx-runtime");
|
|
3383
3751
|
var PayByStableCoin = ({
|
|
3384
3752
|
secretKey,
|
|
3385
3753
|
paymentObject,
|
|
@@ -3388,25 +3756,25 @@ var PayByStableCoin = ({
|
|
|
3388
3756
|
onError,
|
|
3389
3757
|
caller = "buzapay"
|
|
3390
3758
|
}) => {
|
|
3391
|
-
const [formIndex, setFormIndex] = (0,
|
|
3392
|
-
const [message, setMessage] = (0,
|
|
3393
|
-
const [loading, setLoading] = (0,
|
|
3394
|
-
const [generatingAddress, setGeneratingAddress] = (0,
|
|
3395
|
-
const [loadingStableCoins, setLoadingStableCoins] = (0,
|
|
3396
|
-
const [loadingStableCoinNetworks, setLoadingStableCoinNetworks] = (0,
|
|
3397
|
-
const [transactionReference, setTransactionReference] = (0,
|
|
3398
|
-
const [stableCoins, setStableCoins] = (0,
|
|
3399
|
-
const [networkList, setNetworkList] = (0,
|
|
3400
|
-
const [addressDetails, setAddressDetails] = (0,
|
|
3401
|
-
const [generateAddressPayload, setGenerateAddressPayload] = (0,
|
|
3402
|
-
const [isConfirmingPayment, setIsConfirmingPayment] = (0,
|
|
3403
|
-
const [paymentReferenceDetails, setPaymentReferenceDetails] = (0,
|
|
3404
|
-
const [paymentReferenceStatus, setPaymentReferenceStatus] = (0,
|
|
3405
|
-
const [stableCoinForm, setStableCoinForm] = (0,
|
|
3759
|
+
const [formIndex, setFormIndex] = (0, import_react12.useState)(0);
|
|
3760
|
+
const [message, setMessage] = (0, import_react12.useState)("");
|
|
3761
|
+
const [loading, setLoading] = (0, import_react12.useState)(false);
|
|
3762
|
+
const [generatingAddress, setGeneratingAddress] = (0, import_react12.useState)(false);
|
|
3763
|
+
const [loadingStableCoins, setLoadingStableCoins] = (0, import_react12.useState)(false);
|
|
3764
|
+
const [loadingStableCoinNetworks, setLoadingStableCoinNetworks] = (0, import_react12.useState)(false);
|
|
3765
|
+
const [transactionReference, setTransactionReference] = (0, import_react12.useState)("");
|
|
3766
|
+
const [stableCoins, setStableCoins] = (0, import_react12.useState)([]);
|
|
3767
|
+
const [networkList, setNetworkList] = (0, import_react12.useState)([]);
|
|
3768
|
+
const [addressDetails, setAddressDetails] = (0, import_react12.useState)(null);
|
|
3769
|
+
const [generateAddressPayload, setGenerateAddressPayload] = (0, import_react12.useState)(null);
|
|
3770
|
+
const [isConfirmingPayment, setIsConfirmingPayment] = (0, import_react12.useState)(false);
|
|
3771
|
+
const [paymentReferenceDetails, setPaymentReferenceDetails] = (0, import_react12.useState)(null);
|
|
3772
|
+
const [paymentReferenceStatus, setPaymentReferenceStatus] = (0, import_react12.useState)("");
|
|
3773
|
+
const [stableCoinForm, setStableCoinForm] = (0, import_react12.useState)({
|
|
3406
3774
|
stableCoin: "",
|
|
3407
3775
|
network: ""
|
|
3408
3776
|
});
|
|
3409
|
-
const [stableCoinErrors, setStableCoinErrors] = (0,
|
|
3777
|
+
const [stableCoinErrors, setStableCoinErrors] = (0, import_react12.useState)({});
|
|
3410
3778
|
const stableCoinRules = {
|
|
3411
3779
|
stableCoin: "required",
|
|
3412
3780
|
network: "required"
|
|
@@ -3598,16 +3966,16 @@ var PayByStableCoin = ({
|
|
|
3598
3966
|
}
|
|
3599
3967
|
};
|
|
3600
3968
|
const amountPlusNetworkFee = addressDetails ? Number(addressDetails.transactionAmount) + addressDetails.networkFee : 0;
|
|
3601
|
-
(0,
|
|
3969
|
+
(0, import_react12.useEffect)(() => {
|
|
3602
3970
|
(async () => {
|
|
3603
3971
|
await generatePaymentLinkHandler();
|
|
3604
3972
|
await getAllStableCoins();
|
|
3605
3973
|
})();
|
|
3606
3974
|
}, []);
|
|
3607
|
-
return /* @__PURE__ */ (0,
|
|
3608
|
-
formIndex === 0 && /* @__PURE__ */ (0,
|
|
3609
|
-
/* @__PURE__ */ (0,
|
|
3610
|
-
/* @__PURE__ */ (0,
|
|
3975
|
+
return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "flex flex-col gap-6", children: [
|
|
3976
|
+
formIndex === 0 && /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(import_jsx_runtime38.Fragment, { children: [
|
|
3977
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "grid grid-cols-1 gap-6", children: [
|
|
3978
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
3611
3979
|
BaseSelect,
|
|
3612
3980
|
{
|
|
3613
3981
|
label: "Select Crypto",
|
|
@@ -3625,7 +3993,7 @@ var PayByStableCoin = ({
|
|
|
3625
3993
|
validationError: stableCoinErrors.stableCoin ?? ""
|
|
3626
3994
|
}
|
|
3627
3995
|
),
|
|
3628
|
-
/* @__PURE__ */ (0,
|
|
3996
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
3629
3997
|
BaseSelect,
|
|
3630
3998
|
{
|
|
3631
3999
|
label: "Select Network",
|
|
@@ -3643,7 +4011,7 @@ var PayByStableCoin = ({
|
|
|
3643
4011
|
}
|
|
3644
4012
|
)
|
|
3645
4013
|
] }),
|
|
3646
|
-
/* @__PURE__ */ (0,
|
|
4014
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
3647
4015
|
BaseButton,
|
|
3648
4016
|
{
|
|
3649
4017
|
label: `Pay ${formatAmountHandler}`,
|
|
@@ -3655,22 +4023,22 @@ var PayByStableCoin = ({
|
|
|
3655
4023
|
}
|
|
3656
4024
|
)
|
|
3657
4025
|
] }),
|
|
3658
|
-
formIndex === 1 && /* @__PURE__ */ (0,
|
|
3659
|
-
caller === "buzapay" && /* @__PURE__ */ (0,
|
|
3660
|
-
/* @__PURE__ */ (0,
|
|
3661
|
-
/* @__PURE__ */ (0,
|
|
3662
|
-
/* @__PURE__ */ (0,
|
|
4026
|
+
formIndex === 1 && /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { children: [
|
|
4027
|
+
caller === "buzapay" && /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "flex flex-col gap-6", children: [
|
|
4028
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "mx-auto", children: [
|
|
4029
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(IconQrCode, {}),
|
|
4030
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)("p", { className: "mb-0 text-body-4xs text-light-copy font-normal text-center", children: generateAddressPayload?.currency })
|
|
3663
4031
|
] }),
|
|
3664
|
-
/* @__PURE__ */ (0,
|
|
3665
|
-
/* @__PURE__ */ (0,
|
|
3666
|
-
/* @__PURE__ */ (0,
|
|
3667
|
-
/* @__PURE__ */ (0,
|
|
3668
|
-
/* @__PURE__ */ (0,
|
|
3669
|
-
/* @__PURE__ */ (0,
|
|
3670
|
-
/* @__PURE__ */ (0,
|
|
3671
|
-
/* @__PURE__ */ (0,
|
|
3672
|
-
/* @__PURE__ */ (0,
|
|
3673
|
-
/* @__PURE__ */ (0,
|
|
4032
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "flex flex-col gap-6 border-c border-grey-100 p-4 rounded-2xl bg-light-white-50", children: [
|
|
4033
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "border-b border-grey-border pb-4 flex flex-col gap-2", children: [
|
|
4034
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)("p", { className: "mb-0 text-body-3xs text-light-copy font-normal", children: "Network" }),
|
|
4035
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "flex justify-between", children: [
|
|
4036
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "flex flex-col gap-1", children: [
|
|
4037
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)("p", { className: "mb-0 text-body-2xs font-medium text-sub-copy", children: addressDetails?.chain }),
|
|
4038
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "flex items-center gap-2", children: [
|
|
4039
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)("p", { className: "mb-0 text-body-3xs text-light-copy font-normal", children: "*Est. arrival = 3 mins" }),
|
|
4040
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)("p", { className: "mb-0 text-body-3xs text-light-copy font-normal", children: "|" }),
|
|
4041
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
3674
4042
|
BaseCurrencyAmount,
|
|
3675
4043
|
{
|
|
3676
4044
|
currency: generateAddressPayload?.currency ?? "",
|
|
@@ -3683,21 +4051,21 @@ var PayByStableCoin = ({
|
|
|
3683
4051
|
)
|
|
3684
4052
|
] })
|
|
3685
4053
|
] }),
|
|
3686
|
-
/* @__PURE__ */ (0,
|
|
4054
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(IconArrowSwap, {})
|
|
3687
4055
|
] })
|
|
3688
4056
|
] }),
|
|
3689
|
-
/* @__PURE__ */ (0,
|
|
3690
|
-
/* @__PURE__ */ (0,
|
|
3691
|
-
/* @__PURE__ */ (0,
|
|
3692
|
-
/* @__PURE__ */ (0,
|
|
3693
|
-
/* @__PURE__ */ (0,
|
|
4057
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "pb-4 flex flex-col gap-2", children: [
|
|
4058
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)("p", { className: "mb-0 text-body-3xs text-light-copy font-normal", children: "Deposit Address >" }),
|
|
4059
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "flex justify-between", children: [
|
|
4060
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)("p", { className: "mb-0 text-body-2xs font-medium text-sub-copy w-2/3 break-words", children: addressDetails?.walletAddress }),
|
|
4061
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(BaseCopy, { copyText: addressDetails?.walletAddress ?? "" })
|
|
3694
4062
|
] })
|
|
3695
4063
|
] })
|
|
3696
4064
|
] }),
|
|
3697
|
-
/* @__PURE__ */ (0,
|
|
3698
|
-
/* @__PURE__ */ (0,
|
|
3699
|
-
/* @__PURE__ */ (0,
|
|
3700
|
-
/* @__PURE__ */ (0,
|
|
4065
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "flex flex-col gap-2", children: [
|
|
4066
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "flex items-center justify-between border-b border-grey-border py-3", children: [
|
|
4067
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)("p", { className: "mb-0 text-body-2xs font-medium text-primary-black", children: "Network fee" }),
|
|
4068
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
3701
4069
|
BaseCurrencyAmount,
|
|
3702
4070
|
{
|
|
3703
4071
|
currency: generateAddressPayload?.currency ?? "",
|
|
@@ -3707,9 +4075,9 @@ var PayByStableCoin = ({
|
|
|
3707
4075
|
}
|
|
3708
4076
|
)
|
|
3709
4077
|
] }),
|
|
3710
|
-
/* @__PURE__ */ (0,
|
|
3711
|
-
/* @__PURE__ */ (0,
|
|
3712
|
-
/* @__PURE__ */ (0,
|
|
4078
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "flex items-center justify-between py-4", children: [
|
|
4079
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)("p", { className: "mb-0 text-body-lg font-semibold text-primary-black", children: "Pay" }),
|
|
4080
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
3713
4081
|
BaseCurrencyAmount,
|
|
3714
4082
|
{
|
|
3715
4083
|
currency: generateAddressPayload?.currency ?? "",
|
|
@@ -3722,7 +4090,7 @@ var PayByStableCoin = ({
|
|
|
3722
4090
|
)
|
|
3723
4091
|
] })
|
|
3724
4092
|
] }),
|
|
3725
|
-
/* @__PURE__ */ (0,
|
|
4093
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "flex flex-col gap-6", children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
3726
4094
|
BaseButton,
|
|
3727
4095
|
{
|
|
3728
4096
|
label: "Confirm Payment",
|
|
@@ -3734,17 +4102,17 @@ var PayByStableCoin = ({
|
|
|
3734
4102
|
}
|
|
3735
4103
|
) })
|
|
3736
4104
|
] }),
|
|
3737
|
-
caller === "miden" && /* @__PURE__ */ (0,
|
|
3738
|
-
/* @__PURE__ */ (0,
|
|
3739
|
-
/* @__PURE__ */ (0,
|
|
3740
|
-
/* @__PURE__ */ (0,
|
|
4105
|
+
caller === "miden" && /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "flex flex-col gap-6", children: [
|
|
4106
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "p-4 rounded-lg flex flex-col gap-6 bg-[#FAFDFF] border border-[#F0FAFF]", children: [
|
|
4107
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "flex items-center justify-between", children: [
|
|
4108
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
3741
4109
|
BaseLabelInfo,
|
|
3742
4110
|
{
|
|
3743
4111
|
label: "Chain",
|
|
3744
4112
|
value: addressDetails?.chain ?? ""
|
|
3745
4113
|
}
|
|
3746
4114
|
),
|
|
3747
|
-
/* @__PURE__ */ (0,
|
|
4115
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
3748
4116
|
BaseCopy,
|
|
3749
4117
|
{
|
|
3750
4118
|
color: "#9DBFDE",
|
|
@@ -3752,15 +4120,15 @@ var PayByStableCoin = ({
|
|
|
3752
4120
|
}
|
|
3753
4121
|
)
|
|
3754
4122
|
] }),
|
|
3755
|
-
/* @__PURE__ */ (0,
|
|
3756
|
-
/* @__PURE__ */ (0,
|
|
4123
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "flex items-center justify-between", children: [
|
|
4124
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
3757
4125
|
BaseLabelInfo,
|
|
3758
4126
|
{
|
|
3759
4127
|
label: "Wallet Address",
|
|
3760
4128
|
value: addressDetails?.walletAddress ?? ""
|
|
3761
4129
|
}
|
|
3762
4130
|
),
|
|
3763
|
-
/* @__PURE__ */ (0,
|
|
4131
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
3764
4132
|
BaseCopy,
|
|
3765
4133
|
{
|
|
3766
4134
|
color: "#9DBFDE",
|
|
@@ -3768,9 +4136,9 @@ var PayByStableCoin = ({
|
|
|
3768
4136
|
}
|
|
3769
4137
|
)
|
|
3770
4138
|
] }),
|
|
3771
|
-
/* @__PURE__ */ (0,
|
|
3772
|
-
/* @__PURE__ */ (0,
|
|
3773
|
-
/* @__PURE__ */ (0,
|
|
4139
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "flex flex-col", children: [
|
|
4140
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)("p", { className: "mb-1 text-body-4xs font-medium text-light-copy uppercase", children: "Amount" }),
|
|
4141
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
3774
4142
|
BaseCurrencyAmount,
|
|
3775
4143
|
{
|
|
3776
4144
|
currency: generateAddressPayload?.currency ?? "",
|
|
@@ -3782,17 +4150,17 @@ var PayByStableCoin = ({
|
|
|
3782
4150
|
}
|
|
3783
4151
|
)
|
|
3784
4152
|
] }),
|
|
3785
|
-
/* @__PURE__ */ (0,
|
|
3786
|
-
/* @__PURE__ */ (0,
|
|
3787
|
-
/* @__PURE__ */ (0,
|
|
3788
|
-
/* @__PURE__ */ (0,
|
|
4153
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "flex gap-4 items-center justify-center", children: [
|
|
4154
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "w-24 border border-[#E1EBF5]" }),
|
|
4155
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)("p", { className: "mb-2 text-body-2xs text-[#5F738C] font-normal", children: "Or" }),
|
|
4156
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "w-24 border border-[#E1EBF5]" })
|
|
3789
4157
|
] }),
|
|
3790
|
-
/* @__PURE__ */ (0,
|
|
3791
|
-
/* @__PURE__ */ (0,
|
|
3792
|
-
/* @__PURE__ */ (0,
|
|
4158
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "mx-auto", children: [
|
|
4159
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)("p", { className: "mb-2 text-body-xs text-primary font-semibold text-center", children: "Scan to Pay" }),
|
|
4160
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(IconQrCode, {})
|
|
3793
4161
|
] })
|
|
3794
4162
|
] }),
|
|
3795
|
-
/* @__PURE__ */ (0,
|
|
4163
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "flex flex-col gap-6", children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
3796
4164
|
BaseButton,
|
|
3797
4165
|
{
|
|
3798
4166
|
label: "I have made this payment",
|
|
@@ -3809,10 +4177,10 @@ var PayByStableCoin = ({
|
|
|
3809
4177
|
};
|
|
3810
4178
|
|
|
3811
4179
|
// src/buzapay-checkout/checkout-card.tsx
|
|
3812
|
-
var
|
|
4180
|
+
var import_react_hot_toast = __toESM(require("react-hot-toast"), 1);
|
|
4181
|
+
var import_jsx_runtime39 = require("react/jsx-runtime");
|
|
3813
4182
|
function BzpCheckoutCard({
|
|
3814
4183
|
secretKey,
|
|
3815
|
-
options,
|
|
3816
4184
|
environment = "sandbox",
|
|
3817
4185
|
paymentObject = {
|
|
3818
4186
|
merchantName: "",
|
|
@@ -3820,21 +4188,20 @@ function BzpCheckoutCard({
|
|
|
3820
4188
|
currency: "",
|
|
3821
4189
|
email: "",
|
|
3822
4190
|
phoneNumber: "",
|
|
3823
|
-
narration: ""
|
|
3824
|
-
redirectUrl: ""
|
|
4191
|
+
narration: ""
|
|
3825
4192
|
},
|
|
3826
4193
|
onPaymentAuthorized,
|
|
3827
4194
|
onError
|
|
3828
4195
|
}) {
|
|
3829
|
-
const [checkoutState, setCheckoutState] = (0,
|
|
4196
|
+
const [checkoutState, setCheckoutState] = (0, import_react13.useState)("PENDING");
|
|
3830
4197
|
const paymentTypeOptions = [
|
|
3831
4198
|
{ label: "Card", value: "CARD" },
|
|
3832
4199
|
{ label: "Bank Transfer", value: "BANK_TRANSFER" },
|
|
3833
4200
|
{ label: "Stable Coin", value: "STABLE_COIN" }
|
|
3834
4201
|
];
|
|
3835
|
-
const [filteredPaymentTypeOptions, setFilteredPaymentTypeOptions] = (0,
|
|
3836
|
-
const [paymentType, setPaymentType] = (0,
|
|
3837
|
-
const [successObject, setSuccessObject] = (0,
|
|
4202
|
+
const [filteredPaymentTypeOptions, setFilteredPaymentTypeOptions] = (0, import_react13.useState)([]);
|
|
4203
|
+
const [paymentType, setPaymentType] = (0, import_react13.useState)("");
|
|
4204
|
+
const [successObject, setSuccessObject] = (0, import_react13.useState)({
|
|
3838
4205
|
paymentDate: "",
|
|
3839
4206
|
paymentId: "",
|
|
3840
4207
|
paymentStatus: ""
|
|
@@ -3846,131 +4213,144 @@ function BzpCheckoutCard({
|
|
|
3846
4213
|
setSuccessObject({ ...event });
|
|
3847
4214
|
if (event.paymentStatus === "authorized") {
|
|
3848
4215
|
setCheckoutState("SUCCESS");
|
|
4216
|
+
import_react_hot_toast.default.success("Payment authorization successful.", toastConfig);
|
|
4217
|
+
} else if (event.paymentStatus === "confirmed") {
|
|
4218
|
+
setCheckoutState("SUCCESS");
|
|
4219
|
+
import_react_hot_toast.default.success("Payment confirmed.", toastConfig);
|
|
3849
4220
|
} else if (event.paymentStatus === "payment failed") {
|
|
3850
4221
|
setCheckoutState("PENDING");
|
|
4222
|
+
import_react_hot_toast.default.error("Payment pending.", toastConfig);
|
|
3851
4223
|
} else if (event.paymentStatus === "used") {
|
|
3852
4224
|
setCheckoutState("USED");
|
|
3853
4225
|
} else {
|
|
3854
4226
|
setCheckoutState("PENDING");
|
|
4227
|
+
import_react_hot_toast.default.error("Payment pending.", toastConfig);
|
|
3855
4228
|
}
|
|
3856
4229
|
onPaymentAuthorized?.(event);
|
|
3857
4230
|
};
|
|
3858
|
-
|
|
3859
|
-
|
|
4231
|
+
const onErrorHandler = (error) => {
|
|
4232
|
+
import_react_hot_toast.default.error(error.errorMessage ?? "Payment failed.", toastConfig);
|
|
4233
|
+
onError?.(error);
|
|
4234
|
+
};
|
|
4235
|
+
(0, import_react13.useEffect)(() => {
|
|
4236
|
+
let options = [];
|
|
3860
4237
|
if (paymentObject.currency === "USD") {
|
|
3861
4238
|
if (paymentObject.amount < 50) {
|
|
3862
|
-
|
|
4239
|
+
options = paymentTypeOptions.filter(
|
|
3863
4240
|
(option) => option.value !== "BANK_TRANSFER" && option.value !== "STABLE_COIN"
|
|
3864
4241
|
);
|
|
3865
4242
|
} else {
|
|
3866
|
-
|
|
4243
|
+
options = paymentTypeOptions.filter(
|
|
3867
4244
|
(option) => option.value !== "BANK_TRANSFER"
|
|
3868
4245
|
);
|
|
3869
4246
|
}
|
|
3870
4247
|
} else {
|
|
3871
|
-
|
|
4248
|
+
options = paymentTypeOptions.filter(
|
|
3872
4249
|
(option) => option.value !== "STABLE_COIN"
|
|
3873
4250
|
);
|
|
3874
4251
|
}
|
|
3875
|
-
setFilteredPaymentTypeOptions(
|
|
4252
|
+
setFilteredPaymentTypeOptions(options);
|
|
3876
4253
|
}, [paymentObject.currency, paymentObject.amount]);
|
|
3877
|
-
(0,
|
|
4254
|
+
(0, import_react13.useEffect)(() => {
|
|
3878
4255
|
if (filteredPaymentTypeOptions.length) {
|
|
3879
4256
|
setPaymentType(filteredPaymentTypeOptions[0].value);
|
|
3880
4257
|
}
|
|
3881
4258
|
}, [filteredPaymentTypeOptions]);
|
|
3882
|
-
return /* @__PURE__ */ (0,
|
|
3883
|
-
|
|
3884
|
-
|
|
3885
|
-
/* @__PURE__ */ (0,
|
|
3886
|
-
|
|
4259
|
+
return /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(BaseCard, { children: [
|
|
4260
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_react_hot_toast.Toaster, {}),
|
|
4261
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("div", { className: "grid grid-cols-3", children: [
|
|
4262
|
+
checkoutState === "PENDING" && /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("div", { className: "bg-[#EFF7FF] px-6 py-8 flex flex-col gap-5 col-span-1 rounded-l-xl", children: [
|
|
4263
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)("p", { className: "text-heading-text text-body-xs font-semibold", children: "Pay with" }),
|
|
4264
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
|
|
4265
|
+
BaseRadioGroup,
|
|
4266
|
+
{
|
|
4267
|
+
options: filteredPaymentTypeOptions,
|
|
4268
|
+
selectedChange: (e) => paymentTypeHandler(e)
|
|
4269
|
+
}
|
|
4270
|
+
)
|
|
4271
|
+
] }),
|
|
4272
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(
|
|
4273
|
+
"div",
|
|
3887
4274
|
{
|
|
3888
|
-
|
|
3889
|
-
|
|
3890
|
-
|
|
3891
|
-
|
|
3892
|
-
|
|
3893
|
-
|
|
3894
|
-
|
|
3895
|
-
|
|
3896
|
-
|
|
3897
|
-
|
|
3898
|
-
|
|
3899
|
-
|
|
3900
|
-
|
|
4275
|
+
className: checkoutState === "SUCCESS" || checkoutState === "USED" && paymentType === "BANK_TRANSFER" ? "col-span-3" : "col-span-2",
|
|
4276
|
+
children: [
|
|
4277
|
+
checkoutState === "PENDING" && /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("div", { className: "flex items-center justify-between px-12 py-8", children: [
|
|
4278
|
+
paymentObject.logoUrl ? /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
|
|
4279
|
+
BaseImage,
|
|
4280
|
+
{
|
|
4281
|
+
src: paymentObject.logoUrl ?? "",
|
|
4282
|
+
alt: "Merchant Logo",
|
|
4283
|
+
width: 52,
|
|
4284
|
+
height: 52,
|
|
4285
|
+
customClass: "rounded-lg object-fit"
|
|
4286
|
+
}
|
|
4287
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
|
|
4288
|
+
"div",
|
|
4289
|
+
{
|
|
4290
|
+
className: "bg-heading-text rounded flex flex-col justify-center",
|
|
4291
|
+
style: { width: "52px", height: "52px" },
|
|
4292
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("p", { className: "text-white text-center text-body-2xs font-medium", children: "Logo" })
|
|
4293
|
+
}
|
|
4294
|
+
),
|
|
4295
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("div", { className: "flex flex-col gap-1", children: [
|
|
4296
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)("p", { className: "text-body-2xs font-regular text-sub-copy text-right", children: paymentObject.merchantName }),
|
|
4297
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("p", { className: "text-body-2xs font-regular text-sub-copy text-right", children: [
|
|
4298
|
+
"Pay:",
|
|
4299
|
+
" ",
|
|
4300
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)("span", { className: "text-orange-500 font-extrabold", children: formatAmount(paymentObject.amount, paymentObject.currency) })
|
|
4301
|
+
] })
|
|
4302
|
+
] })
|
|
4303
|
+
] }),
|
|
4304
|
+
checkoutState === "PENDING" && /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: "max-h-[32rem] overflow-y-scroll px-10 pb-10 pt-2", children: paymentType === "CARD" ? /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
|
|
4305
|
+
PayByCard,
|
|
3901
4306
|
{
|
|
3902
|
-
|
|
3903
|
-
|
|
3904
|
-
|
|
3905
|
-
|
|
3906
|
-
|
|
4307
|
+
secretKey,
|
|
4308
|
+
environment,
|
|
4309
|
+
paymentObject,
|
|
4310
|
+
onPaymentAuthorized: setSuccess,
|
|
4311
|
+
onError: onErrorHandler
|
|
3907
4312
|
}
|
|
3908
|
-
) : /* @__PURE__ */ (0,
|
|
3909
|
-
|
|
4313
|
+
) : paymentType === "BANK_TRANSFER" ? /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
|
|
4314
|
+
PayByTransfer,
|
|
3910
4315
|
{
|
|
3911
|
-
|
|
3912
|
-
|
|
3913
|
-
|
|
4316
|
+
secretKey,
|
|
4317
|
+
environment,
|
|
4318
|
+
paymentObject,
|
|
4319
|
+
onPaymentAuthorized: setSuccess,
|
|
4320
|
+
onError: onErrorHandler
|
|
3914
4321
|
}
|
|
3915
|
-
),
|
|
3916
|
-
|
|
3917
|
-
|
|
3918
|
-
|
|
3919
|
-
|
|
3920
|
-
|
|
3921
|
-
|
|
3922
|
-
|
|
3923
|
-
|
|
3924
|
-
|
|
3925
|
-
|
|
3926
|
-
|
|
3927
|
-
|
|
3928
|
-
|
|
3929
|
-
|
|
3930
|
-
|
|
3931
|
-
|
|
3932
|
-
|
|
3933
|
-
|
|
3934
|
-
|
|
3935
|
-
|
|
3936
|
-
|
|
3937
|
-
|
|
3938
|
-
|
|
3939
|
-
paymentObject,
|
|
3940
|
-
onPaymentAuthorized: setSuccess,
|
|
3941
|
-
onError
|
|
3942
|
-
}
|
|
3943
|
-
) : /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
3944
|
-
PayByStableCoin,
|
|
3945
|
-
{
|
|
3946
|
-
secretKey,
|
|
3947
|
-
environment,
|
|
3948
|
-
paymentObject,
|
|
3949
|
-
onPaymentAuthorized: setSuccess,
|
|
3950
|
-
onError
|
|
3951
|
-
}
|
|
3952
|
-
) }),
|
|
3953
|
-
checkoutState === "SUCCESS" && /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
3954
|
-
BaseSuccess,
|
|
3955
|
-
{
|
|
3956
|
-
amount: paymentObject.amount,
|
|
3957
|
-
currency: paymentObject.currency,
|
|
3958
|
-
redirectUrl: paymentObject.redirectUrl ?? "",
|
|
3959
|
-
successObject
|
|
3960
|
-
}
|
|
3961
|
-
)
|
|
3962
|
-
]
|
|
3963
|
-
}
|
|
3964
|
-
)
|
|
3965
|
-
] }) });
|
|
4322
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
|
|
4323
|
+
PayByStableCoin,
|
|
4324
|
+
{
|
|
4325
|
+
secretKey,
|
|
4326
|
+
environment,
|
|
4327
|
+
paymentObject,
|
|
4328
|
+
onPaymentAuthorized: setSuccess,
|
|
4329
|
+
onError: onErrorHandler
|
|
4330
|
+
}
|
|
4331
|
+
) }),
|
|
4332
|
+
checkoutState === "SUCCESS" || checkoutState === "USED" && paymentType === "BANK_TRANSFER" && /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
|
|
4333
|
+
BaseSuccess,
|
|
4334
|
+
{
|
|
4335
|
+
amount: paymentObject.amount,
|
|
4336
|
+
currency: paymentObject.currency,
|
|
4337
|
+
redirectUrl: paymentObject.redirectUrl ?? "",
|
|
4338
|
+
successObject
|
|
4339
|
+
}
|
|
4340
|
+
)
|
|
4341
|
+
]
|
|
4342
|
+
}
|
|
4343
|
+
)
|
|
4344
|
+
] })
|
|
4345
|
+
] });
|
|
3966
4346
|
}
|
|
3967
4347
|
|
|
3968
4348
|
// src/miden-checkout/checkout-button.tsx
|
|
3969
|
-
var
|
|
4349
|
+
var import_react15 = require("react");
|
|
3970
4350
|
|
|
3971
4351
|
// src/miden-checkout/checkout-iframe.tsx
|
|
3972
|
-
var
|
|
3973
|
-
var
|
|
4352
|
+
var import_react14 = require("react");
|
|
4353
|
+
var import_jsx_runtime40 = require("react/jsx-runtime");
|
|
3974
4354
|
function MidenCheckoutIframe({
|
|
3975
4355
|
style = {
|
|
3976
4356
|
width: "100%",
|
|
@@ -3993,12 +4373,12 @@ function MidenCheckoutIframe({
|
|
|
3993
4373
|
},
|
|
3994
4374
|
onError
|
|
3995
4375
|
}) {
|
|
3996
|
-
const containerRef = (0,
|
|
3997
|
-
const iframeRef = (0,
|
|
3998
|
-
const [message, setMessage] = (0,
|
|
3999
|
-
const [launchUrl, setLaunchUrl] = (0,
|
|
4000
|
-
const [loading, setLoading] = (0,
|
|
4001
|
-
const launchIframe = (0,
|
|
4376
|
+
const containerRef = (0, import_react14.useRef)(null);
|
|
4377
|
+
const iframeRef = (0, import_react14.useRef)(null);
|
|
4378
|
+
const [message, setMessage] = (0, import_react14.useState)("");
|
|
4379
|
+
const [launchUrl, setLaunchUrl] = (0, import_react14.useState)("");
|
|
4380
|
+
const [loading, setLoading] = (0, import_react14.useState)(false);
|
|
4381
|
+
const launchIframe = (0, import_react14.useCallback)(
|
|
4002
4382
|
(url2) => {
|
|
4003
4383
|
if (iframeRef.current && iframeRef.current.parentNode) {
|
|
4004
4384
|
iframeRef.current.parentNode.removeChild(iframeRef.current);
|
|
@@ -4054,18 +4434,18 @@ function MidenCheckoutIframe({
|
|
|
4054
4434
|
setLoading(false);
|
|
4055
4435
|
}
|
|
4056
4436
|
};
|
|
4057
|
-
(0,
|
|
4437
|
+
(0, import_react14.useEffect)(() => {
|
|
4058
4438
|
if (!containerRef.current) return;
|
|
4059
4439
|
generatePaymentLinkHandler();
|
|
4060
4440
|
}, []);
|
|
4061
|
-
return /* @__PURE__ */ (0,
|
|
4062
|
-
/* @__PURE__ */ (0,
|
|
4063
|
-
loading && /* @__PURE__ */ (0,
|
|
4441
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "relative", style, children: [
|
|
4442
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { ref: containerRef, className: "w-full h-full" }),
|
|
4443
|
+
loading && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "absolute inset-0 grid place-items-center bg-white/60", children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(IconLoader, {}) })
|
|
4064
4444
|
] });
|
|
4065
4445
|
}
|
|
4066
4446
|
|
|
4067
4447
|
// src/miden-checkout/checkout-button.tsx
|
|
4068
|
-
var
|
|
4448
|
+
var import_jsx_runtime41 = require("react/jsx-runtime");
|
|
4069
4449
|
function MidenCheckoutButton({
|
|
4070
4450
|
secretKey,
|
|
4071
4451
|
environment = "sandbox",
|
|
@@ -4081,10 +4461,10 @@ function MidenCheckoutButton({
|
|
|
4081
4461
|
mode = "redirect",
|
|
4082
4462
|
onError
|
|
4083
4463
|
}) {
|
|
4084
|
-
const [message, setMessage] = (0,
|
|
4085
|
-
const [launchUrl, setLaunchUrl] = (0,
|
|
4086
|
-
const [urlLaunchUrl, setUrlLaunchUrl] = (0,
|
|
4087
|
-
const [loading, setLoading] = (0,
|
|
4464
|
+
const [message, setMessage] = (0, import_react15.useState)("");
|
|
4465
|
+
const [launchUrl, setLaunchUrl] = (0, import_react15.useState)("");
|
|
4466
|
+
const [urlLaunchUrl, setUrlLaunchUrl] = (0, import_react15.useState)("");
|
|
4467
|
+
const [loading, setLoading] = (0, import_react15.useState)(false);
|
|
4088
4468
|
const generatePaymentLinkHandler = async () => {
|
|
4089
4469
|
if (!secretKey) {
|
|
4090
4470
|
setMessage("Secret key is required.");
|
|
@@ -4122,15 +4502,15 @@ function MidenCheckoutButton({
|
|
|
4122
4502
|
setLoading(false);
|
|
4123
4503
|
}
|
|
4124
4504
|
};
|
|
4125
|
-
return urlLaunchUrl && mode === "iframe" ? /* @__PURE__ */ (0,
|
|
4505
|
+
return urlLaunchUrl && mode === "iframe" ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
4126
4506
|
MidenCheckoutIframe,
|
|
4127
4507
|
{
|
|
4128
4508
|
url: urlLaunchUrl,
|
|
4129
4509
|
secretKey,
|
|
4130
4510
|
environment
|
|
4131
4511
|
}
|
|
4132
|
-
) : /* @__PURE__ */ (0,
|
|
4133
|
-
/* @__PURE__ */ (0,
|
|
4512
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { children: [
|
|
4513
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
4134
4514
|
BaseButton,
|
|
4135
4515
|
{
|
|
4136
4516
|
label: "Pay",
|
|
@@ -4141,13 +4521,14 @@ function MidenCheckoutButton({
|
|
|
4141
4521
|
onClick: generatePaymentLinkHandler
|
|
4142
4522
|
}
|
|
4143
4523
|
),
|
|
4144
|
-
/* @__PURE__ */ (0,
|
|
4524
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(BaseInputError, { errorMessage: message })
|
|
4145
4525
|
] });
|
|
4146
4526
|
}
|
|
4147
4527
|
|
|
4148
4528
|
// src/miden-checkout/checkout-card.tsx
|
|
4149
|
-
var
|
|
4150
|
-
var
|
|
4529
|
+
var import_react16 = require("react");
|
|
4530
|
+
var import_react_hot_toast2 = __toESM(require("react-hot-toast"), 1);
|
|
4531
|
+
var import_jsx_runtime42 = require("react/jsx-runtime");
|
|
4151
4532
|
function MidenCheckoutCard({
|
|
4152
4533
|
secretKey,
|
|
4153
4534
|
options,
|
|
@@ -4158,21 +4539,20 @@ function MidenCheckoutCard({
|
|
|
4158
4539
|
currency: "",
|
|
4159
4540
|
email: "",
|
|
4160
4541
|
phoneNumber: "",
|
|
4161
|
-
narration: ""
|
|
4162
|
-
redirectUrl: ""
|
|
4542
|
+
narration: ""
|
|
4163
4543
|
},
|
|
4164
4544
|
onPaymentAuthorized,
|
|
4165
4545
|
onError
|
|
4166
4546
|
}) {
|
|
4167
|
-
const [checkoutState, setCheckoutState] = (0,
|
|
4547
|
+
const [checkoutState, setCheckoutState] = (0, import_react16.useState)("PENDING");
|
|
4168
4548
|
const paymentTypeOptions = [
|
|
4169
4549
|
{ label: "Card", value: "CARD" },
|
|
4170
4550
|
{ label: "Bank Transfer", value: "BANK_TRANSFER" },
|
|
4171
4551
|
{ label: "Stable Coin", value: "STABLE_COIN" }
|
|
4172
4552
|
];
|
|
4173
|
-
const [filteredPaymentTypeOptions, setFilteredPaymentTypeOptions] = (0,
|
|
4174
|
-
const [paymentType, setPaymentType] = (0,
|
|
4175
|
-
const [successObject, setSuccessObject] = (0,
|
|
4553
|
+
const [filteredPaymentTypeOptions, setFilteredPaymentTypeOptions] = (0, import_react16.useState)([]);
|
|
4554
|
+
const [paymentType, setPaymentType] = (0, import_react16.useState)("");
|
|
4555
|
+
const [successObject, setSuccessObject] = (0, import_react16.useState)({
|
|
4176
4556
|
paymentDate: "",
|
|
4177
4557
|
paymentId: "",
|
|
4178
4558
|
paymentStatus: ""
|
|
@@ -4184,22 +4564,32 @@ function MidenCheckoutCard({
|
|
|
4184
4564
|
setSuccessObject({ ...event });
|
|
4185
4565
|
if (event.paymentStatus === "authorized") {
|
|
4186
4566
|
setCheckoutState("SUCCESS");
|
|
4567
|
+
import_react_hot_toast2.default.success("Payment authorization successful.", toastConfig);
|
|
4568
|
+
} else if (event.paymentStatus === "confirmed") {
|
|
4569
|
+
setCheckoutState("SUCCESS");
|
|
4570
|
+
import_react_hot_toast2.default.success("Payment confirmed.", toastConfig);
|
|
4187
4571
|
} else if (event.paymentStatus === "payment failed") {
|
|
4188
4572
|
setCheckoutState("PENDING");
|
|
4573
|
+
import_react_hot_toast2.default.error("Payment pending.", toastConfig);
|
|
4189
4574
|
} else if (event.paymentStatus === "used") {
|
|
4190
4575
|
setCheckoutState("USED");
|
|
4191
4576
|
} else {
|
|
4192
4577
|
setCheckoutState("PENDING");
|
|
4578
|
+
import_react_hot_toast2.default.error("Payment pending.", toastConfig);
|
|
4193
4579
|
}
|
|
4194
4580
|
onPaymentAuthorized?.(event);
|
|
4195
4581
|
};
|
|
4582
|
+
const onErrorHandler = (error) => {
|
|
4583
|
+
import_react_hot_toast2.default.error(error.errorMessage ?? "Payment failed.", toastConfig);
|
|
4584
|
+
onError?.(error);
|
|
4585
|
+
};
|
|
4196
4586
|
const formatAmountHandler = () => {
|
|
4197
4587
|
return formatAmount(paymentObject.amount, paymentObject.currency);
|
|
4198
4588
|
};
|
|
4199
4589
|
const formatChargeHandler = () => {
|
|
4200
4590
|
return formatAmount(0, paymentObject.currency);
|
|
4201
4591
|
};
|
|
4202
|
-
(0,
|
|
4592
|
+
(0, import_react16.useEffect)(() => {
|
|
4203
4593
|
let options2 = [];
|
|
4204
4594
|
if (paymentObject.currency === "USD") {
|
|
4205
4595
|
if (paymentObject.amount < 50) {
|
|
@@ -4218,89 +4608,92 @@ function MidenCheckoutCard({
|
|
|
4218
4608
|
}
|
|
4219
4609
|
setFilteredPaymentTypeOptions(options2);
|
|
4220
4610
|
}, [paymentObject.currency, paymentObject.amount]);
|
|
4221
|
-
(0,
|
|
4611
|
+
(0, import_react16.useEffect)(() => {
|
|
4222
4612
|
if (filteredPaymentTypeOptions.length) {
|
|
4223
4613
|
setPaymentType(filteredPaymentTypeOptions[0].value);
|
|
4224
4614
|
}
|
|
4225
4615
|
}, [filteredPaymentTypeOptions]);
|
|
4226
|
-
return /* @__PURE__ */ (0,
|
|
4227
|
-
|
|
4228
|
-
|
|
4229
|
-
/* @__PURE__ */ (0,
|
|
4230
|
-
|
|
4616
|
+
return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(BaseCard, { caller: "miden", children: [
|
|
4617
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_react_hot_toast2.Toaster, {}),
|
|
4618
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: "grid grid-cols-3", children: [
|
|
4619
|
+
checkoutState === "PENDING" && /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: "bg-[#0A0032] py-6 flex flex-col gap-5 col-span-1 rounded-l-xl", children: [
|
|
4620
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)("p", { className: "text-white text-body-xs font-semibold px-6", children: "Pay with" }),
|
|
4621
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
4622
|
+
BaseRadioGroup,
|
|
4623
|
+
{
|
|
4624
|
+
caller: "miden",
|
|
4625
|
+
options: filteredPaymentTypeOptions,
|
|
4626
|
+
selectedChange: (e) => paymentTypeHandler(e)
|
|
4627
|
+
}
|
|
4628
|
+
)
|
|
4629
|
+
] }),
|
|
4630
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
|
|
4631
|
+
"div",
|
|
4231
4632
|
{
|
|
4232
|
-
|
|
4233
|
-
|
|
4234
|
-
|
|
4235
|
-
|
|
4236
|
-
|
|
4237
|
-
|
|
4238
|
-
|
|
4239
|
-
|
|
4240
|
-
|
|
4241
|
-
|
|
4242
|
-
|
|
4243
|
-
|
|
4244
|
-
|
|
4245
|
-
|
|
4246
|
-
|
|
4247
|
-
|
|
4248
|
-
|
|
4249
|
-
/* @__PURE__ */ (0,
|
|
4250
|
-
|
|
4633
|
+
className: checkoutState === "SUCCESS" ? "col-span-3" : "col-span-2",
|
|
4634
|
+
children: [
|
|
4635
|
+
checkoutState === "PENDING" && /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: "flex items-center justify-between p-6", children: [
|
|
4636
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)(IconMidenLogo, {}),
|
|
4637
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)(IconClose, { color: "black", className: "cursor-pointer" })
|
|
4638
|
+
] }),
|
|
4639
|
+
checkoutState === "PENDING" && /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: "px-14 pt-4 pb-8 flex flex-col gap-6 max-h-[32rem] overflow-y-scroll", children: [
|
|
4640
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: "flex items-center justify-between py-3 px-4 bg-[#F8FDFF] border border-[#DAE4E8] rounded-lg", children: [
|
|
4641
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
4642
|
+
BaseLabelInfo,
|
|
4643
|
+
{
|
|
4644
|
+
label: "Amount Due",
|
|
4645
|
+
value: formatAmountHandler()
|
|
4646
|
+
}
|
|
4647
|
+
),
|
|
4648
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)(BaseLabelInfo, { label: "Charges", value: formatChargeHandler() })
|
|
4649
|
+
] }),
|
|
4650
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { children: paymentType === "CARD" ? /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
4651
|
+
PayByCard,
|
|
4251
4652
|
{
|
|
4252
|
-
|
|
4253
|
-
|
|
4653
|
+
secretKey,
|
|
4654
|
+
environment,
|
|
4655
|
+
caller: "miden",
|
|
4656
|
+
paymentObject,
|
|
4657
|
+
onPaymentAuthorized: setSuccess,
|
|
4658
|
+
onError: onErrorHandler
|
|
4254
4659
|
}
|
|
4255
|
-
),
|
|
4256
|
-
|
|
4660
|
+
) : paymentType === "BANK_TRANSFER" ? /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
4661
|
+
PayByTransfer,
|
|
4662
|
+
{
|
|
4663
|
+
secretKey,
|
|
4664
|
+
environment,
|
|
4665
|
+
caller: "miden",
|
|
4666
|
+
paymentObject,
|
|
4667
|
+
onPaymentAuthorized: setSuccess,
|
|
4668
|
+
onError: onErrorHandler
|
|
4669
|
+
}
|
|
4670
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
4671
|
+
PayByStableCoin,
|
|
4672
|
+
{
|
|
4673
|
+
secretKey,
|
|
4674
|
+
environment,
|
|
4675
|
+
caller: "miden",
|
|
4676
|
+
paymentObject,
|
|
4677
|
+
onPaymentAuthorized: setSuccess,
|
|
4678
|
+
onError: onErrorHandler
|
|
4679
|
+
}
|
|
4680
|
+
) })
|
|
4257
4681
|
] }),
|
|
4258
|
-
|
|
4259
|
-
|
|
4682
|
+
checkoutState === "SUCCESS" && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
4683
|
+
BaseSuccess,
|
|
4260
4684
|
{
|
|
4261
|
-
|
|
4262
|
-
|
|
4263
|
-
caller: "miden",
|
|
4264
|
-
paymentObject,
|
|
4265
|
-
onPaymentAuthorized: setSuccess,
|
|
4266
|
-
onError
|
|
4267
|
-
}
|
|
4268
|
-
) : paymentType === "BANK_TRANSFER" ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
4269
|
-
PayByTransfer,
|
|
4270
|
-
{
|
|
4271
|
-
secretKey,
|
|
4272
|
-
environment,
|
|
4273
|
-
caller: "miden",
|
|
4274
|
-
paymentObject,
|
|
4275
|
-
onPaymentAuthorized: setSuccess,
|
|
4276
|
-
onError
|
|
4277
|
-
}
|
|
4278
|
-
) : /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
4279
|
-
PayByStableCoin,
|
|
4280
|
-
{
|
|
4281
|
-
secretKey,
|
|
4282
|
-
environment,
|
|
4685
|
+
amount: paymentObject.amount,
|
|
4686
|
+
currency: paymentObject.currency,
|
|
4283
4687
|
caller: "miden",
|
|
4284
|
-
paymentObject,
|
|
4285
|
-
|
|
4286
|
-
onError
|
|
4688
|
+
redirectUrl: paymentObject.redirectUrl ?? "",
|
|
4689
|
+
successObject
|
|
4287
4690
|
}
|
|
4288
|
-
)
|
|
4289
|
-
]
|
|
4290
|
-
|
|
4291
|
-
|
|
4292
|
-
|
|
4293
|
-
|
|
4294
|
-
currency: paymentObject.currency,
|
|
4295
|
-
caller: "miden",
|
|
4296
|
-
redirectUrl: paymentObject.redirectUrl ?? "",
|
|
4297
|
-
successObject
|
|
4298
|
-
}
|
|
4299
|
-
)
|
|
4300
|
-
]
|
|
4301
|
-
}
|
|
4302
|
-
)
|
|
4303
|
-
] }) });
|
|
4691
|
+
)
|
|
4692
|
+
]
|
|
4693
|
+
}
|
|
4694
|
+
)
|
|
4695
|
+
] })
|
|
4696
|
+
] });
|
|
4304
4697
|
}
|
|
4305
4698
|
// Annotate the CommonJS export names for ESM import in node:
|
|
4306
4699
|
0 && (module.exports = {
|