@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 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) : ""} ${num?.toLocaleString(
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 import_react12 = require("react");
2715
+ var import_react13 = require("react");
2462
2716
 
2463
2717
  // src/components/pay-by-card.tsx
2464
- var import_react9 = require("react");
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, import_react9.useState)(0);
2475
- const [message, setMessage] = (0, import_react9.useState)("");
2476
- const [isMakingPayment, setIsMakingPayment] = (0, import_react9.useState)(false);
2477
- const [loading, setLoading] = (0, import_react9.useState)(false);
2478
- const [cardType, setCardType] = (0, import_react9.useState)("");
2479
- const [transactionReference, setTransactionReference] = (0, import_react9.useState)("");
2480
- const [loadingCountries, setLoadingCountries] = (0, import_react9.useState)(false);
2481
- const [loadingStates, setLoadingStates] = (0, import_react9.useState)(false);
2482
- const [rawCountries, setRawCountries] = (0, import_react9.useState)([]);
2483
- const [countries, setCountries] = (0, import_react9.useState)([]);
2484
- const [countryStates, setCountryStates] = (0, import_react9.useState)([]);
2485
- const [billingForm, setBillingForm] = (0, import_react9.useState)({
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, import_react9.useState)({
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, import_react9.useState)(
2848
+ const [billingErrors, setBillingErrors] = (0, import_react10.useState)(
2504
2849
  {}
2505
2850
  );
2506
- const [payErrors, setPayErrors] = (0, import_react9.useState)({});
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, import_react9.useEffect)(() => {
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, import_jsx_runtime35.jsxs)("div", { className: "flex flex-col gap-6", children: [
2810
- formIndex === 0 && /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: "grid grid-cols-2 gap-6 overflow-y-auto", children: [
2811
- /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "col-span-2", children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
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, import_jsx_runtime35.jsx)("div", { className: "col-span-2", children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
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, import_jsx_runtime35.jsx)(
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, import_jsx_runtime35.jsx)(
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, import_jsx_runtime35.jsx)(
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, import_jsx_runtime35.jsx)(
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, import_jsx_runtime35.jsx)(
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, import_jsx_runtime35.jsx)(
2916
- BaseInput,
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, import_jsx_runtime35.jsxs)(
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, import_jsx_runtime35.jsx)("div", { className: "col-span-2", children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
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, import_jsx_runtime35.jsx)("div", { className: "col-span-2", children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
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, import_jsx_runtime35.jsx)(
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, import_jsx_runtime35.jsx)(
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, import_jsx_runtime35.jsx)(
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, import_jsx_runtime35.jsx)(
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 import_react10 = require("react");
3040
- var import_jsx_runtime36 = require("react/jsx-runtime");
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, import_react10.useState)(0);
3051
- const [isMakingPayment, setIsMakingPayment] = (0, import_react10.useState)(false);
3052
- const [isConfirmCall, setIsConfirmCall] = (0, import_react10.useState)(false);
3053
- const [isPaymentConfirmed, setIsPaymentConfirmed] = (0, import_react10.useState)(false);
3054
- const [transactionReference, setTransactionReference] = (0, import_react10.useState)("");
3055
- const [paymentReferenceStatus, setPaymentReferenceStatus] = (0, import_react10.useState)("");
3056
- const [isFetchingPaymentDetails, setIsFetchingPaymentDetails] = (0, import_react10.useState)(false);
3057
- const [paymentReferenceDetails, setPaymentReferenceDetails] = (0, import_react10.useState)(null);
3058
- const [paymentAccountDetails, setPaymentAccountDetails] = (0, import_react10.useState)(null);
3059
- const [paymentMade, setPaymentMade] = (0, import_react10.useState)(false);
3060
- const [loading, setLoading] = (0, import_react10.useState)(false);
3061
- const [message, setMessage] = (0, import_react10.useState)("");
3062
- const [remainingSeconds, setRemainingSeconds] = (0, import_react10.useState)(30 * 60);
3063
- const [countDownTime, setCountDownTime] = (0, import_react10.useState)("00:00");
3064
- const intervalRef = (0, import_react10.useRef)(null);
3065
- const [transferForm, setTransferForm] = (0, import_react10.useState)({
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, import_react10.useState)(
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, import_react10.useCallback)((secs) => {
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, import_react10.useCallback)(() => {
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, import_react10.useEffect)(() => {
3619
+ (0, import_react11.useEffect)(() => {
3252
3620
  (async () => {
3253
3621
  await generatePaymentLinkHandler();
3254
3622
  })();
3255
3623
  }, []);
3256
- (0, import_react10.useEffect)(() => {
3624
+ (0, import_react11.useEffect)(() => {
3257
3625
  if (remainingSeconds < 0 && intervalRef.current) {
3258
3626
  stopTimer();
3259
3627
  }
3260
3628
  }, [remainingSeconds]);
3261
- return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("div", { className: "flex flex-col gap-10", children: [
3262
- formIndex === 0 && /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("div", { className: "flex flex-col gap-10", children: [
3263
- /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
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, import_jsx_runtime36.jsx)(
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, import_jsx_runtime36.jsxs)("div", { className: "flex flex-col gap-10", children: [
3291
- /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
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, import_jsx_runtime36.jsx)(
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, import_jsx_runtime36.jsxs)("div", { className: "flex items-center justify-between", children: [
3307
- /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
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, import_jsx_runtime36.jsx)(
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, import_jsx_runtime36.jsxs)("div", { className: "flex items-center justify-between", children: [
3323
- /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(BaseLabelInfo, { label: "Amount", value: formatAmountHandler }),
3324
- /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(BaseCopy, { color: "#9DBFDE", copyText: formatAmountHandler })
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, import_jsx_runtime36.jsxs)("p", { className: "w-2/3 mx-auto text-center text-body-2xs font-medium text-sub-copy", children: [
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, import_jsx_runtime36.jsx)("span", { className: "text-orange-500", children: remainingSeconds >= 0 ? countDownTime : "00:00" })
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, import_jsx_runtime36.jsxs)("div", { className: "p-4 rounded-lg bg-[#FAFDFF] flex items-center gap-3", children: [
3335
- /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
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, import_jsx_runtime36.jsxs)("p", { className: "text-body-3xs font-medium text-light-copy", children: [
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, import_jsx_runtime36.jsxs)("span", { className: "text-[#1383E8] ml-2", children: [
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, import_jsx_runtime36.jsxs)("div", { className: "flex flex-col gap-4", children: [
3355
- /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
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, import_jsx_runtime36.jsx)(
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 import_react11 = require("react");
3382
- var import_jsx_runtime37 = require("react/jsx-runtime");
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, import_react11.useState)(0);
3392
- const [message, setMessage] = (0, import_react11.useState)("");
3393
- const [loading, setLoading] = (0, import_react11.useState)(false);
3394
- const [generatingAddress, setGeneratingAddress] = (0, import_react11.useState)(false);
3395
- const [loadingStableCoins, setLoadingStableCoins] = (0, import_react11.useState)(false);
3396
- const [loadingStableCoinNetworks, setLoadingStableCoinNetworks] = (0, import_react11.useState)(false);
3397
- const [transactionReference, setTransactionReference] = (0, import_react11.useState)("");
3398
- const [stableCoins, setStableCoins] = (0, import_react11.useState)([]);
3399
- const [networkList, setNetworkList] = (0, import_react11.useState)([]);
3400
- const [addressDetails, setAddressDetails] = (0, import_react11.useState)(null);
3401
- const [generateAddressPayload, setGenerateAddressPayload] = (0, import_react11.useState)(null);
3402
- const [isConfirmingPayment, setIsConfirmingPayment] = (0, import_react11.useState)(false);
3403
- const [paymentReferenceDetails, setPaymentReferenceDetails] = (0, import_react11.useState)(null);
3404
- const [paymentReferenceStatus, setPaymentReferenceStatus] = (0, import_react11.useState)("");
3405
- const [stableCoinForm, setStableCoinForm] = (0, import_react11.useState)({
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, import_react11.useState)({});
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, import_react11.useEffect)(() => {
3969
+ (0, import_react12.useEffect)(() => {
3602
3970
  (async () => {
3603
3971
  await generatePaymentLinkHandler();
3604
3972
  await getAllStableCoins();
3605
3973
  })();
3606
3974
  }, []);
3607
- return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: "flex flex-col gap-6", children: [
3608
- formIndex === 0 && /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(import_jsx_runtime37.Fragment, { children: [
3609
- /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: "grid grid-cols-1 gap-6", children: [
3610
- /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
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, import_jsx_runtime37.jsx)(
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, import_jsx_runtime37.jsx)(
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, import_jsx_runtime37.jsxs)("div", { children: [
3659
- caller === "buzapay" && /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: "flex flex-col gap-6", children: [
3660
- /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: "mx-auto", children: [
3661
- /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(IconQrCode, {}),
3662
- /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("p", { className: "mb-0 text-body-4xs text-light-copy font-normal text-center", children: generateAddressPayload?.currency })
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, import_jsx_runtime37.jsxs)("div", { className: "flex flex-col gap-6 border-c border-grey-100 p-4 rounded-2xl bg-light-white-50", children: [
3665
- /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: "border-b border-grey-border pb-4 flex flex-col gap-2", children: [
3666
- /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("p", { className: "mb-0 text-body-3xs text-light-copy font-normal", children: "Network" }),
3667
- /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: "flex justify-between", children: [
3668
- /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: "flex flex-col gap-1", children: [
3669
- /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("p", { className: "mb-0 text-body-2xs font-medium text-sub-copy", children: addressDetails?.chain }),
3670
- /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: "flex items-center gap-2", children: [
3671
- /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("p", { className: "mb-0 text-body-3xs text-light-copy font-normal", children: "*Est. arrival = 3 mins" }),
3672
- /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("p", { className: "mb-0 text-body-3xs text-light-copy font-normal", children: "|" }),
3673
- /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
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, import_jsx_runtime37.jsx)(IconArrowSwap, {})
4054
+ /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(IconArrowSwap, {})
3687
4055
  ] })
3688
4056
  ] }),
3689
- /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: "pb-4 flex flex-col gap-2", children: [
3690
- /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("p", { className: "mb-0 text-body-3xs text-light-copy font-normal", children: "Deposit Address >" }),
3691
- /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: "flex justify-between", children: [
3692
- /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("p", { className: "mb-0 text-body-2xs font-medium text-sub-copy w-2/3 break-words", children: addressDetails?.walletAddress }),
3693
- /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(BaseCopy, { copyText: addressDetails?.walletAddress ?? "" })
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, import_jsx_runtime37.jsxs)("div", { className: "flex flex-col gap-2", children: [
3698
- /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: "flex items-center justify-between border-b border-grey-border py-3", children: [
3699
- /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("p", { className: "mb-0 text-body-2xs font-medium text-primary-black", children: "Network fee" }),
3700
- /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
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, import_jsx_runtime37.jsxs)("div", { className: "flex items-center justify-between py-4", children: [
3711
- /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("p", { className: "mb-0 text-body-lg font-semibold text-primary-black", children: "Pay" }),
3712
- /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
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, import_jsx_runtime37.jsx)("div", { className: "flex flex-col gap-6", children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
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, import_jsx_runtime37.jsxs)("div", { className: "flex flex-col gap-6", children: [
3738
- /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: "p-4 rounded-lg flex flex-col gap-6 bg-[#FAFDFF] border border-[#F0FAFF]", children: [
3739
- /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: "flex items-center justify-between", children: [
3740
- /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
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, import_jsx_runtime37.jsx)(
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, import_jsx_runtime37.jsxs)("div", { className: "flex items-center justify-between", children: [
3756
- /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
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, import_jsx_runtime37.jsx)(
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, import_jsx_runtime37.jsxs)("div", { className: "flex flex-col", children: [
3772
- /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("p", { className: "mb-1 text-body-4xs font-medium text-light-copy uppercase", children: "Amount" }),
3773
- /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
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, import_jsx_runtime37.jsxs)("div", { className: "flex gap-4 items-center justify-center", children: [
3786
- /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: "w-24 border border-[#E1EBF5]" }),
3787
- /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("p", { className: "mb-2 text-body-2xs text-[#5F738C] font-normal", children: "Or" }),
3788
- /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: "w-24 border border-[#E1EBF5]" })
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, import_jsx_runtime37.jsxs)("div", { className: "mx-auto", children: [
3791
- /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("p", { className: "mb-2 text-body-xs text-primary font-semibold text-center", children: "Scan to Pay" }),
3792
- /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(IconQrCode, {})
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, import_jsx_runtime37.jsx)("div", { className: "flex flex-col gap-6", children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
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 import_jsx_runtime38 = require("react/jsx-runtime");
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, import_react12.useState)("PENDING");
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, import_react12.useState)([]);
3836
- const [paymentType, setPaymentType] = (0, import_react12.useState)("");
3837
- const [successObject, setSuccessObject] = (0, import_react12.useState)({
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
- (0, import_react12.useEffect)(() => {
3859
- let options2 = [];
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
- options2 = paymentTypeOptions.filter(
4239
+ options = paymentTypeOptions.filter(
3863
4240
  (option) => option.value !== "BANK_TRANSFER" && option.value !== "STABLE_COIN"
3864
4241
  );
3865
4242
  } else {
3866
- options2 = paymentTypeOptions.filter(
4243
+ options = paymentTypeOptions.filter(
3867
4244
  (option) => option.value !== "BANK_TRANSFER"
3868
4245
  );
3869
4246
  }
3870
4247
  } else {
3871
- options2 = paymentTypeOptions.filter(
4248
+ options = paymentTypeOptions.filter(
3872
4249
  (option) => option.value !== "STABLE_COIN"
3873
4250
  );
3874
4251
  }
3875
- setFilteredPaymentTypeOptions(options2);
4252
+ setFilteredPaymentTypeOptions(options);
3876
4253
  }, [paymentObject.currency, paymentObject.amount]);
3877
- (0, import_react12.useEffect)(() => {
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, import_jsx_runtime38.jsx)(BaseCard, { children: /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "grid grid-cols-3", children: [
3883
- checkoutState === "PENDING" && /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "bg-[#EFF7FF] px-6 py-8 flex flex-col gap-5 col-span-1 rounded-l-xl", children: [
3884
- /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("p", { className: "text-heading-text text-body-xs font-semibold", children: "Pay with" }),
3885
- /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
3886
- BaseRadioGroup,
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
- options: filteredPaymentTypeOptions,
3889
- selectedChange: (e) => paymentTypeHandler(e)
3890
- }
3891
- )
3892
- ] }),
3893
- /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(
3894
- "div",
3895
- {
3896
- className: checkoutState === "SUCCESS" ? "col-span-3" : "col-span-2",
3897
- children: [
3898
- checkoutState === "PENDING" && /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "flex items-center justify-between px-12 py-8", children: [
3899
- options?.imageUrl ? /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
3900
- BaseImage,
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
- src: options?.imageUrl ?? "",
3903
- alt: "Merchant Logo",
3904
- width: 52,
3905
- height: 52,
3906
- customClass: "rounded-lg"
4307
+ secretKey,
4308
+ environment,
4309
+ paymentObject,
4310
+ onPaymentAuthorized: setSuccess,
4311
+ onError: onErrorHandler
3907
4312
  }
3908
- ) : /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
3909
- "div",
4313
+ ) : paymentType === "BANK_TRANSFER" ? /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
4314
+ PayByTransfer,
3910
4315
  {
3911
- className: "bg-heading-text rounded flex flex-col justify-center",
3912
- style: { width: "52px", height: "52px" },
3913
- children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("p", { className: "text-white text-center text-body-2xs font-medium", children: "Logo" })
4316
+ secretKey,
4317
+ environment,
4318
+ paymentObject,
4319
+ onPaymentAuthorized: setSuccess,
4320
+ onError: onErrorHandler
3914
4321
  }
3915
- ),
3916
- /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "flex flex-col gap-1", children: [
3917
- /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("p", { className: "text-body-2xs font-regular text-sub-copy text-right", children: paymentObject.merchantName }),
3918
- /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("p", { className: "text-body-2xs font-regular text-sub-copy text-right", children: [
3919
- "Pay:",
3920
- " ",
3921
- /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("span", { className: "text-orange-500 font-extrabold", children: formatAmount(paymentObject.amount, paymentObject.currency) })
3922
- ] })
3923
- ] })
3924
- ] }),
3925
- checkoutState === "PENDING" && /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "overflow-y-scroll px-10 pb-10 pt-2", children: paymentType === "CARD" ? /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
3926
- PayByCard,
3927
- {
3928
- secretKey,
3929
- environment,
3930
- paymentObject,
3931
- onPaymentAuthorized: setSuccess,
3932
- onError
3933
- }
3934
- ) : paymentType === "BANK_TRANSFER" ? /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
3935
- PayByTransfer,
3936
- {
3937
- secretKey,
3938
- environment,
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 import_react14 = require("react");
4349
+ var import_react15 = require("react");
3970
4350
 
3971
4351
  // src/miden-checkout/checkout-iframe.tsx
3972
- var import_react13 = require("react");
3973
- var import_jsx_runtime39 = require("react/jsx-runtime");
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, import_react13.useRef)(null);
3997
- const iframeRef = (0, import_react13.useRef)(null);
3998
- const [message, setMessage] = (0, import_react13.useState)("");
3999
- const [launchUrl, setLaunchUrl] = (0, import_react13.useState)("");
4000
- const [loading, setLoading] = (0, import_react13.useState)(false);
4001
- const launchIframe = (0, import_react13.useCallback)(
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, import_react13.useEffect)(() => {
4437
+ (0, import_react14.useEffect)(() => {
4058
4438
  if (!containerRef.current) return;
4059
4439
  generatePaymentLinkHandler();
4060
4440
  }, []);
4061
- return /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("div", { className: "relative", style, children: [
4062
- /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { ref: containerRef, className: "w-full h-full" }),
4063
- loading && /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: "absolute inset-0 grid place-items-center bg-white/60", children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(IconLoader, {}) })
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 import_jsx_runtime40 = require("react/jsx-runtime");
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, import_react14.useState)("");
4085
- const [launchUrl, setLaunchUrl] = (0, import_react14.useState)("");
4086
- const [urlLaunchUrl, setUrlLaunchUrl] = (0, import_react14.useState)("");
4087
- const [loading, setLoading] = (0, import_react14.useState)(false);
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, import_jsx_runtime40.jsx)(
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, import_jsx_runtime40.jsxs)("div", { children: [
4133
- /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
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, import_jsx_runtime40.jsx)(BaseInputError, { errorMessage: message })
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 import_react15 = require("react");
4150
- var import_jsx_runtime41 = require("react/jsx-runtime");
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, import_react15.useState)("PENDING");
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, import_react15.useState)([]);
4174
- const [paymentType, setPaymentType] = (0, import_react15.useState)("");
4175
- const [successObject, setSuccessObject] = (0, import_react15.useState)({
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, import_react15.useEffect)(() => {
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, import_react15.useEffect)(() => {
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, import_jsx_runtime41.jsx)(BaseCard, { caller: "miden", children: /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "grid grid-cols-3", children: [
4227
- checkoutState === "PENDING" && /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "bg-[#0A0032] py-6 flex flex-col gap-5 col-span-1 rounded-l-xl", children: [
4228
- /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("p", { className: "text-white text-body-xs font-semibold px-6", children: "Pay with" }),
4229
- /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
4230
- BaseRadioGroup,
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
- caller: "miden",
4233
- options: filteredPaymentTypeOptions,
4234
- selectedChange: (e) => paymentTypeHandler(e)
4235
- }
4236
- )
4237
- ] }),
4238
- /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
4239
- "div",
4240
- {
4241
- className: checkoutState === "SUCCESS" ? "col-span-3" : "col-span-2",
4242
- children: [
4243
- checkoutState === "PENDING" && /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "flex items-center justify-between p-6", children: [
4244
- /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(IconMidenLogo, {}),
4245
- /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(IconClose, { color: "black", className: "cursor-pointer" })
4246
- ] }),
4247
- checkoutState === "PENDING" && /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "px-14 pt-4 pb-8 flex flex-col gap-6 max-h-[32rem] overflow-y-scroll", children: [
4248
- /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "flex items-center justify-between py-3 px-4 bg-[#F8FDFF] border border-[#DAE4E8] rounded-lg", children: [
4249
- /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
4250
- BaseLabelInfo,
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
- label: "Amount Due",
4253
- value: formatAmountHandler()
4653
+ secretKey,
4654
+ environment,
4655
+ caller: "miden",
4656
+ paymentObject,
4657
+ onPaymentAuthorized: setSuccess,
4658
+ onError: onErrorHandler
4254
4659
  }
4255
- ),
4256
- /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(BaseLabelInfo, { label: "Charges", value: formatChargeHandler() })
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
- /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { children: paymentType === "CARD" ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
4259
- PayByCard,
4682
+ checkoutState === "SUCCESS" && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
4683
+ BaseSuccess,
4260
4684
  {
4261
- secretKey,
4262
- environment,
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
- onPaymentAuthorized: setSuccess,
4286
- onError
4688
+ redirectUrl: paymentObject.redirectUrl ?? "",
4689
+ successObject
4287
4690
  }
4288
- ) })
4289
- ] }),
4290
- checkoutState === "SUCCESS" && /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
4291
- BaseSuccess,
4292
- {
4293
- amount: paymentObject.amount,
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 = {