@miden-npm/react 2.0.3 → 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 +746 -349
- package/dist/index.cjs.map +1 -1
- package/dist/index.css +3 -0
- package/dist/index.css.map +1 -1
- package/dist/index.js +677 -280
- 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: "",
|
|
@@ -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;
|
|
@@ -2799,15 +3144,25 @@ function PayByCard({
|
|
|
2799
3144
|
setCardType(cardTypeHandler(event));
|
|
2800
3145
|
payRules.cardPin = cardType === "Verve" ? "required|numeric" : "";
|
|
2801
3146
|
};
|
|
2802
|
-
(0,
|
|
3147
|
+
(0, import_react10.useEffect)(() => {
|
|
2803
3148
|
(async () => {
|
|
2804
3149
|
await generatePaymentLinkHandler();
|
|
2805
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);
|
|
2806
3161
|
})();
|
|
2807
3162
|
}, []);
|
|
2808
|
-
return /* @__PURE__ */ (0,
|
|
2809
|
-
formIndex === 0 && /* @__PURE__ */ (0,
|
|
2810
|
-
/* @__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)(
|
|
2811
3166
|
BaseInput,
|
|
2812
3167
|
{
|
|
2813
3168
|
label: "Address Line 1",
|
|
@@ -2822,7 +3177,7 @@ function PayByCard({
|
|
|
2822
3177
|
validationError: billingErrors.address1 ?? ""
|
|
2823
3178
|
}
|
|
2824
3179
|
) }),
|
|
2825
|
-
/* @__PURE__ */ (0,
|
|
3180
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "col-span-2", children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
2826
3181
|
BaseInput,
|
|
2827
3182
|
{
|
|
2828
3183
|
label: "Address Line 2",
|
|
@@ -2831,7 +3186,7 @@ function PayByCard({
|
|
|
2831
3186
|
validationError: billingErrors.address2 ?? ""
|
|
2832
3187
|
}
|
|
2833
3188
|
) }),
|
|
2834
|
-
/* @__PURE__ */ (0,
|
|
3189
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
2835
3190
|
BaseSelect,
|
|
2836
3191
|
{
|
|
2837
3192
|
label: "Select Country",
|
|
@@ -2842,6 +3197,12 @@ function PayByCard({
|
|
|
2842
3197
|
onChange: (e) => {
|
|
2843
3198
|
setBillingForm({ ...billingForm, country: e, state: "" });
|
|
2844
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
|
+
}
|
|
2845
3206
|
if (billingErrors.country) {
|
|
2846
3207
|
setBillingErrors((er) => ({ ...er, country: "" }));
|
|
2847
3208
|
}
|
|
@@ -2849,7 +3210,7 @@ function PayByCard({
|
|
|
2849
3210
|
validationError: billingErrors.country ?? ""
|
|
2850
3211
|
}
|
|
2851
3212
|
),
|
|
2852
|
-
/* @__PURE__ */ (0,
|
|
3213
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
2853
3214
|
BaseSelect,
|
|
2854
3215
|
{
|
|
2855
3216
|
label: "Select State",
|
|
@@ -2866,7 +3227,7 @@ function PayByCard({
|
|
|
2866
3227
|
validationError: billingErrors.state ?? ""
|
|
2867
3228
|
}
|
|
2868
3229
|
),
|
|
2869
|
-
/* @__PURE__ */ (0,
|
|
3230
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
2870
3231
|
BaseInput,
|
|
2871
3232
|
{
|
|
2872
3233
|
label: "City",
|
|
@@ -2881,7 +3242,7 @@ function PayByCard({
|
|
|
2881
3242
|
validationError: billingErrors.city ?? ""
|
|
2882
3243
|
}
|
|
2883
3244
|
),
|
|
2884
|
-
/* @__PURE__ */ (0,
|
|
3245
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
2885
3246
|
BaseInput,
|
|
2886
3247
|
{
|
|
2887
3248
|
label: "Postal Code",
|
|
@@ -2896,7 +3257,7 @@ function PayByCard({
|
|
|
2896
3257
|
validationError: billingErrors.postalCode ?? ""
|
|
2897
3258
|
}
|
|
2898
3259
|
),
|
|
2899
|
-
/* @__PURE__ */ (0,
|
|
3260
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
2900
3261
|
BaseInput,
|
|
2901
3262
|
{
|
|
2902
3263
|
label: "Email",
|
|
@@ -2911,29 +3272,37 @@ function PayByCard({
|
|
|
2911
3272
|
validationError: billingErrors.emailAddress ?? ""
|
|
2912
3273
|
}
|
|
2913
3274
|
),
|
|
2914
|
-
/* @__PURE__ */ (0,
|
|
2915
|
-
|
|
3275
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "col-span-2", children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
3276
|
+
BasePhoneNumberInput,
|
|
2916
3277
|
{
|
|
2917
3278
|
label: "Phone Number",
|
|
2918
3279
|
required: true,
|
|
2919
3280
|
value: billingForm.phoneNumber,
|
|
3281
|
+
phoneCodeOptions,
|
|
3282
|
+
defaultCountryCode,
|
|
2920
3283
|
onChange: (e) => {
|
|
2921
3284
|
setBillingForm({ ...billingForm, phoneNumber: e });
|
|
2922
3285
|
if (billingErrors.phoneNumber) {
|
|
2923
3286
|
setBillingErrors((er) => ({ ...er, phoneNumber: "" }));
|
|
2924
3287
|
}
|
|
2925
3288
|
},
|
|
3289
|
+
onCodeChange: (e) => {
|
|
3290
|
+
setBillingForm({ ...billingForm, phoneNumberExt: e });
|
|
3291
|
+
if (billingErrors.phoneNumberExt) {
|
|
3292
|
+
setBillingErrors((er) => ({ ...er, phoneNumberExt: "" }));
|
|
3293
|
+
}
|
|
3294
|
+
},
|
|
2926
3295
|
validationError: billingErrors.phoneNumber ?? ""
|
|
2927
3296
|
}
|
|
2928
|
-
)
|
|
3297
|
+
) })
|
|
2929
3298
|
] }),
|
|
2930
|
-
formIndex === 1 && /* @__PURE__ */ (0,
|
|
3299
|
+
formIndex === 1 && /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
|
|
2931
3300
|
"div",
|
|
2932
3301
|
{
|
|
2933
3302
|
className: "grid grid-cols-2 gap-6 overflow-y-auto",
|
|
2934
3303
|
style: { maxHeight: 320 },
|
|
2935
3304
|
children: [
|
|
2936
|
-
/* @__PURE__ */ (0,
|
|
3305
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "col-span-2", children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
2937
3306
|
BaseInput,
|
|
2938
3307
|
{
|
|
2939
3308
|
label: "Card Name",
|
|
@@ -2948,7 +3317,7 @@ function PayByCard({
|
|
|
2948
3317
|
validationError: payErrors.customerName ?? ""
|
|
2949
3318
|
}
|
|
2950
3319
|
) }),
|
|
2951
|
-
/* @__PURE__ */ (0,
|
|
3320
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "col-span-2", children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
2952
3321
|
BaseInput,
|
|
2953
3322
|
{
|
|
2954
3323
|
label: "Card Number",
|
|
@@ -2967,7 +3336,7 @@ function PayByCard({
|
|
|
2967
3336
|
validationError: payErrors.cardNo ?? ""
|
|
2968
3337
|
}
|
|
2969
3338
|
) }),
|
|
2970
|
-
/* @__PURE__ */ (0,
|
|
3339
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
2971
3340
|
BaseInput,
|
|
2972
3341
|
{
|
|
2973
3342
|
label: "Expiry Date",
|
|
@@ -2983,7 +3352,7 @@ function PayByCard({
|
|
|
2983
3352
|
validationError: payErrors.expireDate ?? ""
|
|
2984
3353
|
}
|
|
2985
3354
|
),
|
|
2986
|
-
/* @__PURE__ */ (0,
|
|
3355
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
2987
3356
|
BaseInput,
|
|
2988
3357
|
{
|
|
2989
3358
|
label: "CVV",
|
|
@@ -2999,7 +3368,7 @@ function PayByCard({
|
|
|
2999
3368
|
validationError: payErrors.cvv ?? ""
|
|
3000
3369
|
}
|
|
3001
3370
|
),
|
|
3002
|
-
cardType === "Verve" && /* @__PURE__ */ (0,
|
|
3371
|
+
cardType === "Verve" && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
3003
3372
|
BaseInput,
|
|
3004
3373
|
{
|
|
3005
3374
|
label: "Card Pin",
|
|
@@ -3019,7 +3388,7 @@ function PayByCard({
|
|
|
3019
3388
|
]
|
|
3020
3389
|
}
|
|
3021
3390
|
),
|
|
3022
|
-
/* @__PURE__ */ (0,
|
|
3391
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
3023
3392
|
BaseButton,
|
|
3024
3393
|
{
|
|
3025
3394
|
label: formIndex === 0 ? "Proceed" : `Pay ${formatAmountHandler}`,
|
|
@@ -3035,8 +3404,8 @@ function PayByCard({
|
|
|
3035
3404
|
}
|
|
3036
3405
|
|
|
3037
3406
|
// src/components/pay-by-transfer.tsx
|
|
3038
|
-
var
|
|
3039
|
-
var
|
|
3407
|
+
var import_react11 = require("react");
|
|
3408
|
+
var import_jsx_runtime37 = require("react/jsx-runtime");
|
|
3040
3409
|
var PayByTransfer = ({
|
|
3041
3410
|
secretKey,
|
|
3042
3411
|
paymentObject,
|
|
@@ -3046,25 +3415,25 @@ var PayByTransfer = ({
|
|
|
3046
3415
|
onError,
|
|
3047
3416
|
caller = "buzapay"
|
|
3048
3417
|
}) => {
|
|
3049
|
-
const [formIndex, setFormIndex] = (0,
|
|
3050
|
-
const [isMakingPayment, setIsMakingPayment] = (0,
|
|
3051
|
-
const [isConfirmCall, setIsConfirmCall] = (0,
|
|
3052
|
-
const [isPaymentConfirmed, setIsPaymentConfirmed] = (0,
|
|
3053
|
-
const [transactionReference, setTransactionReference] = (0,
|
|
3054
|
-
const [paymentReferenceStatus, setPaymentReferenceStatus] = (0,
|
|
3055
|
-
const [isFetchingPaymentDetails, setIsFetchingPaymentDetails] = (0,
|
|
3056
|
-
const [paymentReferenceDetails, setPaymentReferenceDetails] = (0,
|
|
3057
|
-
const [paymentAccountDetails, setPaymentAccountDetails] = (0,
|
|
3058
|
-
const [paymentMade, setPaymentMade] = (0,
|
|
3059
|
-
const [loading, setLoading] = (0,
|
|
3060
|
-
const [message, setMessage] = (0,
|
|
3061
|
-
const [remainingSeconds, setRemainingSeconds] = (0,
|
|
3062
|
-
const [countDownTime, setCountDownTime] = (0,
|
|
3063
|
-
const intervalRef = (0,
|
|
3064
|
-
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)({
|
|
3065
3434
|
customerName: ""
|
|
3066
3435
|
});
|
|
3067
|
-
const [transferErrors, setTransferErrors] = (0,
|
|
3436
|
+
const [transferErrors, setTransferErrors] = (0, import_react11.useState)(
|
|
3068
3437
|
{}
|
|
3069
3438
|
);
|
|
3070
3439
|
const transferRules = {
|
|
@@ -3214,12 +3583,12 @@ var PayByTransfer = ({
|
|
|
3214
3583
|
setLoading(false);
|
|
3215
3584
|
}
|
|
3216
3585
|
};
|
|
3217
|
-
const updateDisplay = (0,
|
|
3586
|
+
const updateDisplay = (0, import_react11.useCallback)((secs) => {
|
|
3218
3587
|
const minutes = String(Math.floor(secs / 60)).padStart(2, "0");
|
|
3219
3588
|
const seconds = String(secs % 60).padStart(2, "0");
|
|
3220
3589
|
setCountDownTime(`${minutes}:${seconds}`);
|
|
3221
3590
|
}, []);
|
|
3222
|
-
const startTimer = (0,
|
|
3591
|
+
const startTimer = (0, import_react11.useCallback)(() => {
|
|
3223
3592
|
if (intervalRef.current) {
|
|
3224
3593
|
clearInterval(intervalRef.current);
|
|
3225
3594
|
intervalRef.current = null;
|
|
@@ -3247,19 +3616,19 @@ var PayByTransfer = ({
|
|
|
3247
3616
|
intervalRef.current = null;
|
|
3248
3617
|
}
|
|
3249
3618
|
};
|
|
3250
|
-
(0,
|
|
3619
|
+
(0, import_react11.useEffect)(() => {
|
|
3251
3620
|
(async () => {
|
|
3252
3621
|
await generatePaymentLinkHandler();
|
|
3253
3622
|
})();
|
|
3254
3623
|
}, []);
|
|
3255
|
-
(0,
|
|
3624
|
+
(0, import_react11.useEffect)(() => {
|
|
3256
3625
|
if (remainingSeconds < 0 && intervalRef.current) {
|
|
3257
3626
|
stopTimer();
|
|
3258
3627
|
}
|
|
3259
3628
|
}, [remainingSeconds]);
|
|
3260
|
-
return /* @__PURE__ */ (0,
|
|
3261
|
-
formIndex === 0 && /* @__PURE__ */ (0,
|
|
3262
|
-
/* @__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)(
|
|
3263
3632
|
BaseInput,
|
|
3264
3633
|
{
|
|
3265
3634
|
label: "Customer Name",
|
|
@@ -3274,7 +3643,7 @@ var PayByTransfer = ({
|
|
|
3274
3643
|
validationError: transferErrors.customerName ?? ""
|
|
3275
3644
|
}
|
|
3276
3645
|
),
|
|
3277
|
-
/* @__PURE__ */ (0,
|
|
3646
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
3278
3647
|
BaseButton,
|
|
3279
3648
|
{
|
|
3280
3649
|
label: `Pay ${formatAmountHandler}`,
|
|
@@ -3286,8 +3655,8 @@ var PayByTransfer = ({
|
|
|
3286
3655
|
}
|
|
3287
3656
|
)
|
|
3288
3657
|
] }),
|
|
3289
|
-
formIndex === 1 && /* @__PURE__ */ (0,
|
|
3290
|
-
/* @__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)(
|
|
3291
3660
|
"div",
|
|
3292
3661
|
{
|
|
3293
3662
|
className: [
|
|
@@ -3295,22 +3664,22 @@ var PayByTransfer = ({
|
|
|
3295
3664
|
caller === "miden" ? "bg-[#FAFDFF] border border-[#F0FAFF]" : "bg-[#EFF7FF]"
|
|
3296
3665
|
].join(" "),
|
|
3297
3666
|
children: [
|
|
3298
|
-
/* @__PURE__ */ (0,
|
|
3667
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
3299
3668
|
BaseLabelInfo,
|
|
3300
3669
|
{
|
|
3301
3670
|
label: "Bank Name",
|
|
3302
3671
|
value: `${paymentAccountDetails?.bank} ${paymentAccountDetails?.accountName}`
|
|
3303
3672
|
}
|
|
3304
3673
|
),
|
|
3305
|
-
/* @__PURE__ */ (0,
|
|
3306
|
-
/* @__PURE__ */ (0,
|
|
3674
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: "flex items-center justify-between", children: [
|
|
3675
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
3307
3676
|
BaseLabelInfo,
|
|
3308
3677
|
{
|
|
3309
3678
|
label: "Account Number",
|
|
3310
3679
|
value: paymentAccountDetails?.accountNumber
|
|
3311
3680
|
}
|
|
3312
3681
|
),
|
|
3313
|
-
/* @__PURE__ */ (0,
|
|
3682
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
3314
3683
|
BaseCopy,
|
|
3315
3684
|
{
|
|
3316
3685
|
color: "#9DBFDE",
|
|
@@ -3318,20 +3687,20 @@ var PayByTransfer = ({
|
|
|
3318
3687
|
}
|
|
3319
3688
|
)
|
|
3320
3689
|
] }),
|
|
3321
|
-
/* @__PURE__ */ (0,
|
|
3322
|
-
/* @__PURE__ */ (0,
|
|
3323
|
-
/* @__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 })
|
|
3324
3693
|
] })
|
|
3325
3694
|
]
|
|
3326
3695
|
}
|
|
3327
3696
|
),
|
|
3328
|
-
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: [
|
|
3329
3698
|
"This account is for this transaction only and expires in",
|
|
3330
3699
|
" ",
|
|
3331
|
-
/* @__PURE__ */ (0,
|
|
3700
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)("span", { className: "text-orange-500", children: remainingSeconds >= 0 ? countDownTime : "00:00" })
|
|
3332
3701
|
] }),
|
|
3333
|
-
caller === "miden" && /* @__PURE__ */ (0,
|
|
3334
|
-
/* @__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)(
|
|
3335
3704
|
BaseCircularCountdown,
|
|
3336
3705
|
{
|
|
3337
3706
|
value: remainingSeconds,
|
|
@@ -3342,16 +3711,16 @@ var PayByTransfer = ({
|
|
|
3342
3711
|
color: "#3b82f6"
|
|
3343
3712
|
}
|
|
3344
3713
|
),
|
|
3345
|
-
/* @__PURE__ */ (0,
|
|
3714
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("p", { className: "text-body-3xs font-medium text-light-copy", children: [
|
|
3346
3715
|
"This account is for this transaction only and expires in",
|
|
3347
|
-
/* @__PURE__ */ (0,
|
|
3716
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("span", { className: "text-[#1383E8] ml-2", children: [
|
|
3348
3717
|
countDownTime,
|
|
3349
3718
|
"..."
|
|
3350
3719
|
] })
|
|
3351
3720
|
] })
|
|
3352
3721
|
] }),
|
|
3353
|
-
/* @__PURE__ */ (0,
|
|
3354
|
-
/* @__PURE__ */ (0,
|
|
3722
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: "flex flex-col gap-4", children: [
|
|
3723
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
3355
3724
|
BaseButton,
|
|
3356
3725
|
{
|
|
3357
3726
|
label: "I have paid the money",
|
|
@@ -3362,7 +3731,7 @@ var PayByTransfer = ({
|
|
|
3362
3731
|
onClick: getReferenceDetails
|
|
3363
3732
|
}
|
|
3364
3733
|
),
|
|
3365
|
-
/* @__PURE__ */ (0,
|
|
3734
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
3366
3735
|
"button",
|
|
3367
3736
|
{
|
|
3368
3737
|
type: "button",
|
|
@@ -3377,8 +3746,8 @@ var PayByTransfer = ({
|
|
|
3377
3746
|
};
|
|
3378
3747
|
|
|
3379
3748
|
// src/components/pay-by-stable-coin.tsx
|
|
3380
|
-
var
|
|
3381
|
-
var
|
|
3749
|
+
var import_react12 = require("react");
|
|
3750
|
+
var import_jsx_runtime38 = require("react/jsx-runtime");
|
|
3382
3751
|
var PayByStableCoin = ({
|
|
3383
3752
|
secretKey,
|
|
3384
3753
|
paymentObject,
|
|
@@ -3387,25 +3756,25 @@ var PayByStableCoin = ({
|
|
|
3387
3756
|
onError,
|
|
3388
3757
|
caller = "buzapay"
|
|
3389
3758
|
}) => {
|
|
3390
|
-
const [formIndex, setFormIndex] = (0,
|
|
3391
|
-
const [message, setMessage] = (0,
|
|
3392
|
-
const [loading, setLoading] = (0,
|
|
3393
|
-
const [generatingAddress, setGeneratingAddress] = (0,
|
|
3394
|
-
const [loadingStableCoins, setLoadingStableCoins] = (0,
|
|
3395
|
-
const [loadingStableCoinNetworks, setLoadingStableCoinNetworks] = (0,
|
|
3396
|
-
const [transactionReference, setTransactionReference] = (0,
|
|
3397
|
-
const [stableCoins, setStableCoins] = (0,
|
|
3398
|
-
const [networkList, setNetworkList] = (0,
|
|
3399
|
-
const [addressDetails, setAddressDetails] = (0,
|
|
3400
|
-
const [generateAddressPayload, setGenerateAddressPayload] = (0,
|
|
3401
|
-
const [isConfirmingPayment, setIsConfirmingPayment] = (0,
|
|
3402
|
-
const [paymentReferenceDetails, setPaymentReferenceDetails] = (0,
|
|
3403
|
-
const [paymentReferenceStatus, setPaymentReferenceStatus] = (0,
|
|
3404
|
-
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)({
|
|
3405
3774
|
stableCoin: "",
|
|
3406
3775
|
network: ""
|
|
3407
3776
|
});
|
|
3408
|
-
const [stableCoinErrors, setStableCoinErrors] = (0,
|
|
3777
|
+
const [stableCoinErrors, setStableCoinErrors] = (0, import_react12.useState)({});
|
|
3409
3778
|
const stableCoinRules = {
|
|
3410
3779
|
stableCoin: "required",
|
|
3411
3780
|
network: "required"
|
|
@@ -3597,16 +3966,16 @@ var PayByStableCoin = ({
|
|
|
3597
3966
|
}
|
|
3598
3967
|
};
|
|
3599
3968
|
const amountPlusNetworkFee = addressDetails ? Number(addressDetails.transactionAmount) + addressDetails.networkFee : 0;
|
|
3600
|
-
(0,
|
|
3969
|
+
(0, import_react12.useEffect)(() => {
|
|
3601
3970
|
(async () => {
|
|
3602
3971
|
await generatePaymentLinkHandler();
|
|
3603
3972
|
await getAllStableCoins();
|
|
3604
3973
|
})();
|
|
3605
3974
|
}, []);
|
|
3606
|
-
return /* @__PURE__ */ (0,
|
|
3607
|
-
formIndex === 0 && /* @__PURE__ */ (0,
|
|
3608
|
-
/* @__PURE__ */ (0,
|
|
3609
|
-
/* @__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)(
|
|
3610
3979
|
BaseSelect,
|
|
3611
3980
|
{
|
|
3612
3981
|
label: "Select Crypto",
|
|
@@ -3624,7 +3993,7 @@ var PayByStableCoin = ({
|
|
|
3624
3993
|
validationError: stableCoinErrors.stableCoin ?? ""
|
|
3625
3994
|
}
|
|
3626
3995
|
),
|
|
3627
|
-
/* @__PURE__ */ (0,
|
|
3996
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
3628
3997
|
BaseSelect,
|
|
3629
3998
|
{
|
|
3630
3999
|
label: "Select Network",
|
|
@@ -3642,7 +4011,7 @@ var PayByStableCoin = ({
|
|
|
3642
4011
|
}
|
|
3643
4012
|
)
|
|
3644
4013
|
] }),
|
|
3645
|
-
/* @__PURE__ */ (0,
|
|
4014
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
3646
4015
|
BaseButton,
|
|
3647
4016
|
{
|
|
3648
4017
|
label: `Pay ${formatAmountHandler}`,
|
|
@@ -3654,22 +4023,22 @@ var PayByStableCoin = ({
|
|
|
3654
4023
|
}
|
|
3655
4024
|
)
|
|
3656
4025
|
] }),
|
|
3657
|
-
formIndex === 1 && /* @__PURE__ */ (0,
|
|
3658
|
-
caller === "buzapay" && /* @__PURE__ */ (0,
|
|
3659
|
-
/* @__PURE__ */ (0,
|
|
3660
|
-
/* @__PURE__ */ (0,
|
|
3661
|
-
/* @__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 })
|
|
3662
4031
|
] }),
|
|
3663
|
-
/* @__PURE__ */ (0,
|
|
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,
|
|
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)(
|
|
3673
4042
|
BaseCurrencyAmount,
|
|
3674
4043
|
{
|
|
3675
4044
|
currency: generateAddressPayload?.currency ?? "",
|
|
@@ -3682,21 +4051,21 @@ var PayByStableCoin = ({
|
|
|
3682
4051
|
)
|
|
3683
4052
|
] })
|
|
3684
4053
|
] }),
|
|
3685
|
-
/* @__PURE__ */ (0,
|
|
4054
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(IconArrowSwap, {})
|
|
3686
4055
|
] })
|
|
3687
4056
|
] }),
|
|
3688
|
-
/* @__PURE__ */ (0,
|
|
3689
|
-
/* @__PURE__ */ (0,
|
|
3690
|
-
/* @__PURE__ */ (0,
|
|
3691
|
-
/* @__PURE__ */ (0,
|
|
3692
|
-
/* @__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 ?? "" })
|
|
3693
4062
|
] })
|
|
3694
4063
|
] })
|
|
3695
4064
|
] }),
|
|
3696
|
-
/* @__PURE__ */ (0,
|
|
3697
|
-
/* @__PURE__ */ (0,
|
|
3698
|
-
/* @__PURE__ */ (0,
|
|
3699
|
-
/* @__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)(
|
|
3700
4069
|
BaseCurrencyAmount,
|
|
3701
4070
|
{
|
|
3702
4071
|
currency: generateAddressPayload?.currency ?? "",
|
|
@@ -3706,9 +4075,9 @@ var PayByStableCoin = ({
|
|
|
3706
4075
|
}
|
|
3707
4076
|
)
|
|
3708
4077
|
] }),
|
|
3709
|
-
/* @__PURE__ */ (0,
|
|
3710
|
-
/* @__PURE__ */ (0,
|
|
3711
|
-
/* @__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)(
|
|
3712
4081
|
BaseCurrencyAmount,
|
|
3713
4082
|
{
|
|
3714
4083
|
currency: generateAddressPayload?.currency ?? "",
|
|
@@ -3721,7 +4090,7 @@ var PayByStableCoin = ({
|
|
|
3721
4090
|
)
|
|
3722
4091
|
] })
|
|
3723
4092
|
] }),
|
|
3724
|
-
/* @__PURE__ */ (0,
|
|
4093
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "flex flex-col gap-6", children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
3725
4094
|
BaseButton,
|
|
3726
4095
|
{
|
|
3727
4096
|
label: "Confirm Payment",
|
|
@@ -3733,17 +4102,17 @@ var PayByStableCoin = ({
|
|
|
3733
4102
|
}
|
|
3734
4103
|
) })
|
|
3735
4104
|
] }),
|
|
3736
|
-
caller === "miden" && /* @__PURE__ */ (0,
|
|
3737
|
-
/* @__PURE__ */ (0,
|
|
3738
|
-
/* @__PURE__ */ (0,
|
|
3739
|
-
/* @__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)(
|
|
3740
4109
|
BaseLabelInfo,
|
|
3741
4110
|
{
|
|
3742
4111
|
label: "Chain",
|
|
3743
4112
|
value: addressDetails?.chain ?? ""
|
|
3744
4113
|
}
|
|
3745
4114
|
),
|
|
3746
|
-
/* @__PURE__ */ (0,
|
|
4115
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
3747
4116
|
BaseCopy,
|
|
3748
4117
|
{
|
|
3749
4118
|
color: "#9DBFDE",
|
|
@@ -3751,15 +4120,15 @@ var PayByStableCoin = ({
|
|
|
3751
4120
|
}
|
|
3752
4121
|
)
|
|
3753
4122
|
] }),
|
|
3754
|
-
/* @__PURE__ */ (0,
|
|
3755
|
-
/* @__PURE__ */ (0,
|
|
4123
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "flex items-center justify-between", children: [
|
|
4124
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
3756
4125
|
BaseLabelInfo,
|
|
3757
4126
|
{
|
|
3758
4127
|
label: "Wallet Address",
|
|
3759
4128
|
value: addressDetails?.walletAddress ?? ""
|
|
3760
4129
|
}
|
|
3761
4130
|
),
|
|
3762
|
-
/* @__PURE__ */ (0,
|
|
4131
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
3763
4132
|
BaseCopy,
|
|
3764
4133
|
{
|
|
3765
4134
|
color: "#9DBFDE",
|
|
@@ -3767,9 +4136,9 @@ var PayByStableCoin = ({
|
|
|
3767
4136
|
}
|
|
3768
4137
|
)
|
|
3769
4138
|
] }),
|
|
3770
|
-
/* @__PURE__ */ (0,
|
|
3771
|
-
/* @__PURE__ */ (0,
|
|
3772
|
-
/* @__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)(
|
|
3773
4142
|
BaseCurrencyAmount,
|
|
3774
4143
|
{
|
|
3775
4144
|
currency: generateAddressPayload?.currency ?? "",
|
|
@@ -3781,17 +4150,17 @@ var PayByStableCoin = ({
|
|
|
3781
4150
|
}
|
|
3782
4151
|
)
|
|
3783
4152
|
] }),
|
|
3784
|
-
/* @__PURE__ */ (0,
|
|
3785
|
-
/* @__PURE__ */ (0,
|
|
3786
|
-
/* @__PURE__ */ (0,
|
|
3787
|
-
/* @__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]" })
|
|
3788
4157
|
] }),
|
|
3789
|
-
/* @__PURE__ */ (0,
|
|
3790
|
-
/* @__PURE__ */ (0,
|
|
3791
|
-
/* @__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, {})
|
|
3792
4161
|
] })
|
|
3793
4162
|
] }),
|
|
3794
|
-
/* @__PURE__ */ (0,
|
|
4163
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "flex flex-col gap-6", children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
3795
4164
|
BaseButton,
|
|
3796
4165
|
{
|
|
3797
4166
|
label: "I have made this payment",
|
|
@@ -3808,7 +4177,8 @@ var PayByStableCoin = ({
|
|
|
3808
4177
|
};
|
|
3809
4178
|
|
|
3810
4179
|
// src/buzapay-checkout/checkout-card.tsx
|
|
3811
|
-
var
|
|
4180
|
+
var import_react_hot_toast = __toESM(require("react-hot-toast"), 1);
|
|
4181
|
+
var import_jsx_runtime39 = require("react/jsx-runtime");
|
|
3812
4182
|
function BzpCheckoutCard({
|
|
3813
4183
|
secretKey,
|
|
3814
4184
|
environment = "sandbox",
|
|
@@ -3823,15 +4193,15 @@ function BzpCheckoutCard({
|
|
|
3823
4193
|
onPaymentAuthorized,
|
|
3824
4194
|
onError
|
|
3825
4195
|
}) {
|
|
3826
|
-
const [checkoutState, setCheckoutState] = (0,
|
|
4196
|
+
const [checkoutState, setCheckoutState] = (0, import_react13.useState)("PENDING");
|
|
3827
4197
|
const paymentTypeOptions = [
|
|
3828
4198
|
{ label: "Card", value: "CARD" },
|
|
3829
4199
|
{ label: "Bank Transfer", value: "BANK_TRANSFER" },
|
|
3830
4200
|
{ label: "Stable Coin", value: "STABLE_COIN" }
|
|
3831
4201
|
];
|
|
3832
|
-
const [filteredPaymentTypeOptions, setFilteredPaymentTypeOptions] = (0,
|
|
3833
|
-
const [paymentType, setPaymentType] = (0,
|
|
3834
|
-
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)({
|
|
3835
4205
|
paymentDate: "",
|
|
3836
4206
|
paymentId: "",
|
|
3837
4207
|
paymentStatus: ""
|
|
@@ -3843,16 +4213,26 @@ function BzpCheckoutCard({
|
|
|
3843
4213
|
setSuccessObject({ ...event });
|
|
3844
4214
|
if (event.paymentStatus === "authorized") {
|
|
3845
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);
|
|
3846
4220
|
} else if (event.paymentStatus === "payment failed") {
|
|
3847
4221
|
setCheckoutState("PENDING");
|
|
4222
|
+
import_react_hot_toast.default.error("Payment pending.", toastConfig);
|
|
3848
4223
|
} else if (event.paymentStatus === "used") {
|
|
3849
4224
|
setCheckoutState("USED");
|
|
3850
4225
|
} else {
|
|
3851
4226
|
setCheckoutState("PENDING");
|
|
4227
|
+
import_react_hot_toast.default.error("Payment pending.", toastConfig);
|
|
3852
4228
|
}
|
|
3853
4229
|
onPaymentAuthorized?.(event);
|
|
3854
4230
|
};
|
|
3855
|
-
|
|
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)(() => {
|
|
3856
4236
|
let options = [];
|
|
3857
4237
|
if (paymentObject.currency === "USD") {
|
|
3858
4238
|
if (paymentObject.amount < 50) {
|
|
@@ -3871,103 +4251,106 @@ function BzpCheckoutCard({
|
|
|
3871
4251
|
}
|
|
3872
4252
|
setFilteredPaymentTypeOptions(options);
|
|
3873
4253
|
}, [paymentObject.currency, paymentObject.amount]);
|
|
3874
|
-
(0,
|
|
4254
|
+
(0, import_react13.useEffect)(() => {
|
|
3875
4255
|
if (filteredPaymentTypeOptions.length) {
|
|
3876
4256
|
setPaymentType(filteredPaymentTypeOptions[0].value);
|
|
3877
4257
|
}
|
|
3878
4258
|
}, [filteredPaymentTypeOptions]);
|
|
3879
|
-
return /* @__PURE__ */ (0,
|
|
3880
|
-
|
|
3881
|
-
|
|
3882
|
-
/* @__PURE__ */ (0,
|
|
3883
|
-
|
|
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",
|
|
3884
4274
|
{
|
|
3885
|
-
|
|
3886
|
-
|
|
3887
|
-
|
|
3888
|
-
|
|
3889
|
-
|
|
3890
|
-
|
|
3891
|
-
|
|
3892
|
-
|
|
3893
|
-
|
|
3894
|
-
|
|
3895
|
-
|
|
3896
|
-
|
|
3897
|
-
|
|
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,
|
|
3898
4306
|
{
|
|
3899
|
-
|
|
3900
|
-
|
|
3901
|
-
|
|
3902
|
-
|
|
3903
|
-
|
|
4307
|
+
secretKey,
|
|
4308
|
+
environment,
|
|
4309
|
+
paymentObject,
|
|
4310
|
+
onPaymentAuthorized: setSuccess,
|
|
4311
|
+
onError: onErrorHandler
|
|
3904
4312
|
}
|
|
3905
|
-
) : /* @__PURE__ */ (0,
|
|
3906
|
-
|
|
4313
|
+
) : paymentType === "BANK_TRANSFER" ? /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
|
|
4314
|
+
PayByTransfer,
|
|
3907
4315
|
{
|
|
3908
|
-
|
|
3909
|
-
|
|
3910
|
-
|
|
4316
|
+
secretKey,
|
|
4317
|
+
environment,
|
|
4318
|
+
paymentObject,
|
|
4319
|
+
onPaymentAuthorized: setSuccess,
|
|
4320
|
+
onError: onErrorHandler
|
|
3911
4321
|
}
|
|
3912
|
-
),
|
|
3913
|
-
|
|
3914
|
-
|
|
3915
|
-
|
|
3916
|
-
|
|
3917
|
-
|
|
3918
|
-
|
|
3919
|
-
|
|
3920
|
-
|
|
3921
|
-
|
|
3922
|
-
|
|
3923
|
-
|
|
3924
|
-
|
|
3925
|
-
|
|
3926
|
-
|
|
3927
|
-
|
|
3928
|
-
|
|
3929
|
-
|
|
3930
|
-
|
|
3931
|
-
|
|
3932
|
-
|
|
3933
|
-
|
|
3934
|
-
|
|
3935
|
-
|
|
3936
|
-
paymentObject,
|
|
3937
|
-
onPaymentAuthorized: setSuccess,
|
|
3938
|
-
onError
|
|
3939
|
-
}
|
|
3940
|
-
) : /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
3941
|
-
PayByStableCoin,
|
|
3942
|
-
{
|
|
3943
|
-
secretKey,
|
|
3944
|
-
environment,
|
|
3945
|
-
paymentObject,
|
|
3946
|
-
onPaymentAuthorized: setSuccess,
|
|
3947
|
-
onError
|
|
3948
|
-
}
|
|
3949
|
-
) }),
|
|
3950
|
-
checkoutState === "SUCCESS" && /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
3951
|
-
BaseSuccess,
|
|
3952
|
-
{
|
|
3953
|
-
amount: paymentObject.amount,
|
|
3954
|
-
currency: paymentObject.currency,
|
|
3955
|
-
redirectUrl: paymentObject.redirectUrl ?? "",
|
|
3956
|
-
successObject
|
|
3957
|
-
}
|
|
3958
|
-
)
|
|
3959
|
-
]
|
|
3960
|
-
}
|
|
3961
|
-
)
|
|
3962
|
-
] }) });
|
|
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
|
+
] });
|
|
3963
4346
|
}
|
|
3964
4347
|
|
|
3965
4348
|
// src/miden-checkout/checkout-button.tsx
|
|
3966
|
-
var
|
|
4349
|
+
var import_react15 = require("react");
|
|
3967
4350
|
|
|
3968
4351
|
// src/miden-checkout/checkout-iframe.tsx
|
|
3969
|
-
var
|
|
3970
|
-
var
|
|
4352
|
+
var import_react14 = require("react");
|
|
4353
|
+
var import_jsx_runtime40 = require("react/jsx-runtime");
|
|
3971
4354
|
function MidenCheckoutIframe({
|
|
3972
4355
|
style = {
|
|
3973
4356
|
width: "100%",
|
|
@@ -3990,12 +4373,12 @@ function MidenCheckoutIframe({
|
|
|
3990
4373
|
},
|
|
3991
4374
|
onError
|
|
3992
4375
|
}) {
|
|
3993
|
-
const containerRef = (0,
|
|
3994
|
-
const iframeRef = (0,
|
|
3995
|
-
const [message, setMessage] = (0,
|
|
3996
|
-
const [launchUrl, setLaunchUrl] = (0,
|
|
3997
|
-
const [loading, setLoading] = (0,
|
|
3998
|
-
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)(
|
|
3999
4382
|
(url2) => {
|
|
4000
4383
|
if (iframeRef.current && iframeRef.current.parentNode) {
|
|
4001
4384
|
iframeRef.current.parentNode.removeChild(iframeRef.current);
|
|
@@ -4051,18 +4434,18 @@ function MidenCheckoutIframe({
|
|
|
4051
4434
|
setLoading(false);
|
|
4052
4435
|
}
|
|
4053
4436
|
};
|
|
4054
|
-
(0,
|
|
4437
|
+
(0, import_react14.useEffect)(() => {
|
|
4055
4438
|
if (!containerRef.current) return;
|
|
4056
4439
|
generatePaymentLinkHandler();
|
|
4057
4440
|
}, []);
|
|
4058
|
-
return /* @__PURE__ */ (0,
|
|
4059
|
-
/* @__PURE__ */ (0,
|
|
4060
|
-
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, {}) })
|
|
4061
4444
|
] });
|
|
4062
4445
|
}
|
|
4063
4446
|
|
|
4064
4447
|
// src/miden-checkout/checkout-button.tsx
|
|
4065
|
-
var
|
|
4448
|
+
var import_jsx_runtime41 = require("react/jsx-runtime");
|
|
4066
4449
|
function MidenCheckoutButton({
|
|
4067
4450
|
secretKey,
|
|
4068
4451
|
environment = "sandbox",
|
|
@@ -4078,10 +4461,10 @@ function MidenCheckoutButton({
|
|
|
4078
4461
|
mode = "redirect",
|
|
4079
4462
|
onError
|
|
4080
4463
|
}) {
|
|
4081
|
-
const [message, setMessage] = (0,
|
|
4082
|
-
const [launchUrl, setLaunchUrl] = (0,
|
|
4083
|
-
const [urlLaunchUrl, setUrlLaunchUrl] = (0,
|
|
4084
|
-
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);
|
|
4085
4468
|
const generatePaymentLinkHandler = async () => {
|
|
4086
4469
|
if (!secretKey) {
|
|
4087
4470
|
setMessage("Secret key is required.");
|
|
@@ -4119,15 +4502,15 @@ function MidenCheckoutButton({
|
|
|
4119
4502
|
setLoading(false);
|
|
4120
4503
|
}
|
|
4121
4504
|
};
|
|
4122
|
-
return urlLaunchUrl && mode === "iframe" ? /* @__PURE__ */ (0,
|
|
4505
|
+
return urlLaunchUrl && mode === "iframe" ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
4123
4506
|
MidenCheckoutIframe,
|
|
4124
4507
|
{
|
|
4125
4508
|
url: urlLaunchUrl,
|
|
4126
4509
|
secretKey,
|
|
4127
4510
|
environment
|
|
4128
4511
|
}
|
|
4129
|
-
) : /* @__PURE__ */ (0,
|
|
4130
|
-
/* @__PURE__ */ (0,
|
|
4512
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { children: [
|
|
4513
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
4131
4514
|
BaseButton,
|
|
4132
4515
|
{
|
|
4133
4516
|
label: "Pay",
|
|
@@ -4138,13 +4521,14 @@ function MidenCheckoutButton({
|
|
|
4138
4521
|
onClick: generatePaymentLinkHandler
|
|
4139
4522
|
}
|
|
4140
4523
|
),
|
|
4141
|
-
/* @__PURE__ */ (0,
|
|
4524
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(BaseInputError, { errorMessage: message })
|
|
4142
4525
|
] });
|
|
4143
4526
|
}
|
|
4144
4527
|
|
|
4145
4528
|
// src/miden-checkout/checkout-card.tsx
|
|
4146
|
-
var
|
|
4147
|
-
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");
|
|
4148
4532
|
function MidenCheckoutCard({
|
|
4149
4533
|
secretKey,
|
|
4150
4534
|
options,
|
|
@@ -4160,15 +4544,15 @@ function MidenCheckoutCard({
|
|
|
4160
4544
|
onPaymentAuthorized,
|
|
4161
4545
|
onError
|
|
4162
4546
|
}) {
|
|
4163
|
-
const [checkoutState, setCheckoutState] = (0,
|
|
4547
|
+
const [checkoutState, setCheckoutState] = (0, import_react16.useState)("PENDING");
|
|
4164
4548
|
const paymentTypeOptions = [
|
|
4165
4549
|
{ label: "Card", value: "CARD" },
|
|
4166
4550
|
{ label: "Bank Transfer", value: "BANK_TRANSFER" },
|
|
4167
4551
|
{ label: "Stable Coin", value: "STABLE_COIN" }
|
|
4168
4552
|
];
|
|
4169
|
-
const [filteredPaymentTypeOptions, setFilteredPaymentTypeOptions] = (0,
|
|
4170
|
-
const [paymentType, setPaymentType] = (0,
|
|
4171
|
-
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)({
|
|
4172
4556
|
paymentDate: "",
|
|
4173
4557
|
paymentId: "",
|
|
4174
4558
|
paymentStatus: ""
|
|
@@ -4180,22 +4564,32 @@ function MidenCheckoutCard({
|
|
|
4180
4564
|
setSuccessObject({ ...event });
|
|
4181
4565
|
if (event.paymentStatus === "authorized") {
|
|
4182
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);
|
|
4183
4571
|
} else if (event.paymentStatus === "payment failed") {
|
|
4184
4572
|
setCheckoutState("PENDING");
|
|
4573
|
+
import_react_hot_toast2.default.error("Payment pending.", toastConfig);
|
|
4185
4574
|
} else if (event.paymentStatus === "used") {
|
|
4186
4575
|
setCheckoutState("USED");
|
|
4187
4576
|
} else {
|
|
4188
4577
|
setCheckoutState("PENDING");
|
|
4578
|
+
import_react_hot_toast2.default.error("Payment pending.", toastConfig);
|
|
4189
4579
|
}
|
|
4190
4580
|
onPaymentAuthorized?.(event);
|
|
4191
4581
|
};
|
|
4582
|
+
const onErrorHandler = (error) => {
|
|
4583
|
+
import_react_hot_toast2.default.error(error.errorMessage ?? "Payment failed.", toastConfig);
|
|
4584
|
+
onError?.(error);
|
|
4585
|
+
};
|
|
4192
4586
|
const formatAmountHandler = () => {
|
|
4193
4587
|
return formatAmount(paymentObject.amount, paymentObject.currency);
|
|
4194
4588
|
};
|
|
4195
4589
|
const formatChargeHandler = () => {
|
|
4196
4590
|
return formatAmount(0, paymentObject.currency);
|
|
4197
4591
|
};
|
|
4198
|
-
(0,
|
|
4592
|
+
(0, import_react16.useEffect)(() => {
|
|
4199
4593
|
let options2 = [];
|
|
4200
4594
|
if (paymentObject.currency === "USD") {
|
|
4201
4595
|
if (paymentObject.amount < 50) {
|
|
@@ -4214,89 +4608,92 @@ function MidenCheckoutCard({
|
|
|
4214
4608
|
}
|
|
4215
4609
|
setFilteredPaymentTypeOptions(options2);
|
|
4216
4610
|
}, [paymentObject.currency, paymentObject.amount]);
|
|
4217
|
-
(0,
|
|
4611
|
+
(0, import_react16.useEffect)(() => {
|
|
4218
4612
|
if (filteredPaymentTypeOptions.length) {
|
|
4219
4613
|
setPaymentType(filteredPaymentTypeOptions[0].value);
|
|
4220
4614
|
}
|
|
4221
4615
|
}, [filteredPaymentTypeOptions]);
|
|
4222
|
-
return /* @__PURE__ */ (0,
|
|
4223
|
-
|
|
4224
|
-
|
|
4225
|
-
/* @__PURE__ */ (0,
|
|
4226
|
-
|
|
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",
|
|
4227
4632
|
{
|
|
4228
|
-
|
|
4229
|
-
|
|
4230
|
-
|
|
4231
|
-
|
|
4232
|
-
|
|
4233
|
-
|
|
4234
|
-
|
|
4235
|
-
|
|
4236
|
-
|
|
4237
|
-
|
|
4238
|
-
|
|
4239
|
-
|
|
4240
|
-
|
|
4241
|
-
|
|
4242
|
-
|
|
4243
|
-
|
|
4244
|
-
|
|
4245
|
-
/* @__PURE__ */ (0,
|
|
4246
|
-
|
|
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,
|
|
4247
4652
|
{
|
|
4248
|
-
|
|
4249
|
-
|
|
4653
|
+
secretKey,
|
|
4654
|
+
environment,
|
|
4655
|
+
caller: "miden",
|
|
4656
|
+
paymentObject,
|
|
4657
|
+
onPaymentAuthorized: setSuccess,
|
|
4658
|
+
onError: onErrorHandler
|
|
4250
4659
|
}
|
|
4251
|
-
),
|
|
4252
|
-
|
|
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
|
+
) })
|
|
4253
4681
|
] }),
|
|
4254
|
-
|
|
4255
|
-
|
|
4256
|
-
{
|
|
4257
|
-
secretKey,
|
|
4258
|
-
environment,
|
|
4259
|
-
caller: "miden",
|
|
4260
|
-
paymentObject,
|
|
4261
|
-
onPaymentAuthorized: setSuccess,
|
|
4262
|
-
onError
|
|
4263
|
-
}
|
|
4264
|
-
) : paymentType === "BANK_TRANSFER" ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
4265
|
-
PayByTransfer,
|
|
4682
|
+
checkoutState === "SUCCESS" && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
4683
|
+
BaseSuccess,
|
|
4266
4684
|
{
|
|
4267
|
-
|
|
4268
|
-
|
|
4685
|
+
amount: paymentObject.amount,
|
|
4686
|
+
currency: paymentObject.currency,
|
|
4269
4687
|
caller: "miden",
|
|
4270
|
-
paymentObject,
|
|
4271
|
-
|
|
4272
|
-
onError
|
|
4688
|
+
redirectUrl: paymentObject.redirectUrl ?? "",
|
|
4689
|
+
successObject
|
|
4273
4690
|
}
|
|
4274
|
-
)
|
|
4275
|
-
|
|
4276
|
-
|
|
4277
|
-
|
|
4278
|
-
|
|
4279
|
-
|
|
4280
|
-
paymentObject,
|
|
4281
|
-
onPaymentAuthorized: setSuccess,
|
|
4282
|
-
onError
|
|
4283
|
-
}
|
|
4284
|
-
) })
|
|
4285
|
-
] }),
|
|
4286
|
-
checkoutState === "SUCCESS" && /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
4287
|
-
BaseSuccess,
|
|
4288
|
-
{
|
|
4289
|
-
amount: paymentObject.amount,
|
|
4290
|
-
currency: paymentObject.currency,
|
|
4291
|
-
caller: "miden",
|
|
4292
|
-
redirectUrl: paymentObject.redirectUrl ?? "",
|
|
4293
|
-
successObject
|
|
4294
|
-
}
|
|
4295
|
-
)
|
|
4296
|
-
]
|
|
4297
|
-
}
|
|
4298
|
-
)
|
|
4299
|
-
] }) });
|
|
4691
|
+
)
|
|
4692
|
+
]
|
|
4693
|
+
}
|
|
4694
|
+
)
|
|
4695
|
+
] })
|
|
4696
|
+
] });
|
|
4300
4697
|
}
|
|
4301
4698
|
// Annotate the CommonJS export names for ESM import in node:
|
|
4302
4699
|
0 && (module.exports = {
|