@miden-npm/react 2.0.3 → 2.0.5
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 +782 -368
- package/dist/index.cjs.map +1 -1
- package/dist/index.css +3 -0
- package/dist/index.css.map +1 -1
- package/dist/index.js +713 -299
- package/dist/index.js.map +1 -1
- package/dist/styles.css +1 -1
- package/package.json +4 -1
package/dist/index.js
CHANGED
|
@@ -99,6 +99,10 @@ function buildDeviceInformation(partial) {
|
|
|
99
99
|
...partial
|
|
100
100
|
};
|
|
101
101
|
}
|
|
102
|
+
var toastConfig = {
|
|
103
|
+
position: "top-right",
|
|
104
|
+
style: { fontSize: "12px" }
|
|
105
|
+
};
|
|
102
106
|
|
|
103
107
|
// src/utils/api.util.ts
|
|
104
108
|
var getBaseUrl = (mode, caller) => {
|
|
@@ -123,7 +127,7 @@ var currencySign = (currency) => {
|
|
|
123
127
|
var formatAmount = (value, currency) => {
|
|
124
128
|
const num = typeof value === "string" ? parseFloat(value) : value;
|
|
125
129
|
if (isNaN(num)) return "0";
|
|
126
|
-
return `${currency ? currencySign(currency) : ""}
|
|
130
|
+
return `${currency ? currencySign(currency) : ""}${num?.toLocaleString(
|
|
127
131
|
"en-US"
|
|
128
132
|
)}`;
|
|
129
133
|
};
|
|
@@ -156,6 +160,254 @@ var restrictToNumericKeys = (event) => {
|
|
|
156
160
|
event.preventDefault();
|
|
157
161
|
}
|
|
158
162
|
};
|
|
163
|
+
var COUNTRIES = [
|
|
164
|
+
{ name: "Afghanistan", code: "AF", phoneCode: "+93", flag: "\u{1F1E6}\u{1F1EB}" },
|
|
165
|
+
{ name: "Albania", code: "AL", phoneCode: "+355", flag: "\u{1F1E6}\u{1F1F1}" },
|
|
166
|
+
{ name: "Algeria", code: "DZ", phoneCode: "+213", flag: "\u{1F1E9}\u{1F1FF}" },
|
|
167
|
+
{ name: "American Samoa", code: "AS", phoneCode: "+1", flag: "\u{1F1E6}\u{1F1F8}" },
|
|
168
|
+
{ name: "Andorra", code: "AD", phoneCode: "+376", flag: "\u{1F1E6}\u{1F1E9}" },
|
|
169
|
+
{ name: "Angola", code: "AO", phoneCode: "+244", flag: "\u{1F1E6}\u{1F1F4}" },
|
|
170
|
+
{ name: "Anguilla", code: "AI", phoneCode: "+1", flag: "\u{1F1E6}\u{1F1EE}" },
|
|
171
|
+
{ name: "Antarctica", code: "AQ", phoneCode: "+672", flag: "\u{1F1E6}\u{1F1F6}" },
|
|
172
|
+
{ name: "Antigua and Barbuda", code: "AG", phoneCode: "+1", flag: "\u{1F1E6}\u{1F1EC}" },
|
|
173
|
+
{ name: "Argentina", code: "AR", phoneCode: "+54", flag: "\u{1F1E6}\u{1F1F7}" },
|
|
174
|
+
{ name: "Armenia", code: "AM", phoneCode: "+374", flag: "\u{1F1E6}\u{1F1F2}" },
|
|
175
|
+
{ name: "Aruba", code: "AW", phoneCode: "+297", flag: "\u{1F1E6}\u{1F1FC}" },
|
|
176
|
+
{ name: "Australia", code: "AU", phoneCode: "+61", flag: "\u{1F1E6}\u{1F1FA}" },
|
|
177
|
+
{ name: "Austria", code: "AT", phoneCode: "+43", flag: "\u{1F1E6}\u{1F1F9}" },
|
|
178
|
+
{ name: "Azerbaijan", code: "AZ", phoneCode: "+994", flag: "\u{1F1E6}\u{1F1FF}" },
|
|
179
|
+
{ name: "Bahamas", code: "BS", phoneCode: "+1", flag: "\u{1F1E7}\u{1F1F8}" },
|
|
180
|
+
{ name: "Bahrain", code: "BH", phoneCode: "+973", flag: "\u{1F1E7}\u{1F1ED}" },
|
|
181
|
+
{ name: "Bangladesh", code: "BD", phoneCode: "+880", flag: "\u{1F1E7}\u{1F1E9}" },
|
|
182
|
+
{ name: "Barbados", code: "BB", phoneCode: "+1", flag: "\u{1F1E7}\u{1F1E7}" },
|
|
183
|
+
{ name: "Belarus", code: "BY", phoneCode: "+375", flag: "\u{1F1E7}\u{1F1FE}" },
|
|
184
|
+
{ name: "Belgium", code: "BE", phoneCode: "+32", flag: "\u{1F1E7}\u{1F1EA}" },
|
|
185
|
+
{ name: "Belize", code: "BZ", phoneCode: "+501", flag: "\u{1F1E7}\u{1F1FF}" },
|
|
186
|
+
{ name: "Benin", code: "BJ", phoneCode: "+229", flag: "\u{1F1E7}\u{1F1EF}" },
|
|
187
|
+
{ name: "Bermuda", code: "BM", phoneCode: "+1", flag: "\u{1F1E7}\u{1F1F2}" },
|
|
188
|
+
{ name: "Bhutan", code: "BT", phoneCode: "+975", flag: "\u{1F1E7}\u{1F1F9}" },
|
|
189
|
+
{ name: "Bolivia", code: "BO", phoneCode: "+591", flag: "\u{1F1E7}\u{1F1F4}" },
|
|
190
|
+
{ name: "Bosnia and Herzegovina", code: "BA", phoneCode: "+387", flag: "\u{1F1E7}\u{1F1E6}" },
|
|
191
|
+
{ name: "Botswana", code: "BW", phoneCode: "+267", flag: "\u{1F1E7}\u{1F1FC}" },
|
|
192
|
+
{ name: "Bouvet Island", code: "BV", phoneCode: "+47", flag: "\u{1F1E7}\u{1F1FB}" },
|
|
193
|
+
{ name: "Brazil", code: "BR", phoneCode: "+55", flag: "\u{1F1E7}\u{1F1F7}" },
|
|
194
|
+
{ name: "British Indian Ocean Territory", code: "IO", phoneCode: "+246", flag: "\u{1F1EE}\u{1F1F4}" },
|
|
195
|
+
{ name: "Brunei Darussalam", code: "BN", phoneCode: "+673", flag: "\u{1F1E7}\u{1F1F3}" },
|
|
196
|
+
{ name: "Bulgaria", code: "BG", phoneCode: "+359", flag: "\u{1F1E7}\u{1F1EC}" },
|
|
197
|
+
{ name: "Burkina Faso", code: "BF", phoneCode: "+226", flag: "\u{1F1E7}\u{1F1EB}" },
|
|
198
|
+
{ name: "Burundi", code: "BI", phoneCode: "+257", flag: "\u{1F1E7}\u{1F1EE}" },
|
|
199
|
+
{ name: "Cambodia", code: "KH", phoneCode: "+855", flag: "\u{1F1F0}\u{1F1ED}" },
|
|
200
|
+
{ name: "Cameroon", code: "CM", phoneCode: "+237", flag: "\u{1F1E8}\u{1F1F2}" },
|
|
201
|
+
{ name: "Canada", code: "CA", phoneCode: "+1", flag: "\u{1F1E8}\u{1F1E6}" },
|
|
202
|
+
{ name: "Cape Verde", code: "CV", phoneCode: "+238", flag: "\u{1F1E8}\u{1F1FB}" },
|
|
203
|
+
{ name: "Cayman Islands", code: "KY", phoneCode: "+1", flag: "\u{1F1F0}\u{1F1FE}" },
|
|
204
|
+
{ name: "Central African Republic", code: "CF", phoneCode: "+236", flag: "\u{1F1E8}\u{1F1EB}" },
|
|
205
|
+
{ name: "Chad", code: "TD", phoneCode: "+235", flag: "\u{1F1F9}\u{1F1E9}" },
|
|
206
|
+
{ name: "Chile", code: "CL", phoneCode: "+56", flag: "\u{1F1E8}\u{1F1F1}" },
|
|
207
|
+
{ name: "China", code: "CN", phoneCode: "+86", flag: "\u{1F1E8}\u{1F1F3}" },
|
|
208
|
+
{ name: "Christmas Island", code: "CX", phoneCode: "+61", flag: "\u{1F1E8}\u{1F1FD}" },
|
|
209
|
+
{ name: "Cocos (Keeling) Islands", code: "CC", phoneCode: "+61", flag: "\u{1F1E8}\u{1F1E8}" },
|
|
210
|
+
{ name: "Colombia", code: "CO", phoneCode: "+57", flag: "\u{1F1E8}\u{1F1F4}" },
|
|
211
|
+
{ name: "Comoros", code: "KM", phoneCode: "+269", flag: "\u{1F1F0}\u{1F1F2}" },
|
|
212
|
+
{ name: "Congo", code: "CG", phoneCode: "+242", flag: "\u{1F1E8}\u{1F1EC}" },
|
|
213
|
+
{ name: "Congo, Democratic Republic of the", code: "CD", phoneCode: "+243", flag: "\u{1F1E8}\u{1F1E9}" },
|
|
214
|
+
{ name: "Cook Islands", code: "CK", phoneCode: "+682", flag: "\u{1F1E8}\u{1F1F0}" },
|
|
215
|
+
{ name: "Costa Rica", code: "CR", phoneCode: "+506", flag: "\u{1F1E8}\u{1F1F7}" },
|
|
216
|
+
{ name: "C\xF4te d'Ivoire", code: "CI", phoneCode: "+225", flag: "\u{1F1E8}\u{1F1EE}" },
|
|
217
|
+
{ name: "Croatia", code: "HR", phoneCode: "+385", flag: "\u{1F1ED}\u{1F1F7}" },
|
|
218
|
+
{ name: "Cuba", code: "CU", phoneCode: "+53", flag: "\u{1F1E8}\u{1F1FA}" },
|
|
219
|
+
{ name: "Cyprus", code: "CY", phoneCode: "+357", flag: "\u{1F1E8}\u{1F1FE}" },
|
|
220
|
+
{ name: "Czech Republic", code: "CZ", phoneCode: "+420", flag: "\u{1F1E8}\u{1F1FF}" },
|
|
221
|
+
{ name: "Denmark", code: "DK", phoneCode: "+45", flag: "\u{1F1E9}\u{1F1F0}" },
|
|
222
|
+
{ name: "Djibouti", code: "DJ", phoneCode: "+253", flag: "\u{1F1E9}\u{1F1EF}" },
|
|
223
|
+
{ name: "Dominica", code: "DM", phoneCode: "+1", flag: "\u{1F1E9}\u{1F1F2}" },
|
|
224
|
+
{ name: "Dominican Republic", code: "DO", phoneCode: "+1", flag: "\u{1F1E9}\u{1F1F4}" },
|
|
225
|
+
{ name: "Ecuador", code: "EC", phoneCode: "+593", flag: "\u{1F1EA}\u{1F1E8}" },
|
|
226
|
+
{ name: "Egypt", code: "EG", phoneCode: "+20", flag: "\u{1F1EA}\u{1F1EC}" },
|
|
227
|
+
{ name: "El Salvador", code: "SV", phoneCode: "+503", flag: "\u{1F1F8}\u{1F1FB}" },
|
|
228
|
+
{ name: "Equatorial Guinea", code: "GQ", phoneCode: "+240", flag: "\u{1F1EC}\u{1F1F6}" },
|
|
229
|
+
{ name: "Eritrea", code: "ER", phoneCode: "+291", flag: "\u{1F1EA}\u{1F1F7}" },
|
|
230
|
+
{ name: "Estonia", code: "EE", phoneCode: "+372", flag: "\u{1F1EA}\u{1F1EA}" },
|
|
231
|
+
{ name: "Ethiopia", code: "ET", phoneCode: "+251", flag: "\u{1F1EA}\u{1F1F9}" },
|
|
232
|
+
{ name: "Falkland Islands (Malvinas)", code: "FK", phoneCode: "+500", flag: "\u{1F1EB}\u{1F1F0}" },
|
|
233
|
+
{ name: "Faroe Islands", code: "FO", phoneCode: "+298", flag: "\u{1F1EB}\u{1F1F4}" },
|
|
234
|
+
{ name: "Fiji", code: "FJ", phoneCode: "+679", flag: "\u{1F1EB}\u{1F1EF}" },
|
|
235
|
+
{ name: "Finland", code: "FI", phoneCode: "+358", flag: "\u{1F1EB}\u{1F1EE}" },
|
|
236
|
+
{ name: "France", code: "FR", phoneCode: "+33", flag: "\u{1F1EB}\u{1F1F7}" },
|
|
237
|
+
{ name: "French Guiana", code: "GF", phoneCode: "+594", flag: "\u{1F1EC}\u{1F1EB}" },
|
|
238
|
+
{ name: "French Polynesia", code: "PF", phoneCode: "+689", flag: "\u{1F1F5}\u{1F1EB}" },
|
|
239
|
+
{ name: "French Southern Territories", code: "TF", phoneCode: "+262", flag: "\u{1F1F9}\u{1F1EB}" },
|
|
240
|
+
{ name: "Gabon", code: "GA", phoneCode: "+240", flag: "\u{1F1EC}\u{1F1E6}" },
|
|
241
|
+
{ name: "Gambia", code: "GM", phoneCode: "+220", flag: "\u{1F1EC}\u{1F1F2}" },
|
|
242
|
+
{ name: "Georgia", code: "GE", phoneCode: "+995", flag: "\u{1F1EC}\u{1F1EA}" },
|
|
243
|
+
{ name: "Germany", code: "DE", phoneCode: "+49", flag: "\u{1F1E9}\u{1F1EA}" },
|
|
244
|
+
{ name: "Ghana", code: "GH", phoneCode: "+233", flag: "\u{1F1EC}\u{1F1ED}" },
|
|
245
|
+
{ name: "Gibraltar", code: "GI", phoneCode: "+350", flag: "\u{1F1EC}\u{1F1EE}" },
|
|
246
|
+
{ name: "Greece", code: "GR", phoneCode: "+30", flag: "\u{1F1EC}\u{1F1F7}" },
|
|
247
|
+
{ name: "Greenland", code: "GL", phoneCode: "+299", flag: "\u{1F1EC}\u{1F1F1}" },
|
|
248
|
+
{ name: "Grenada", code: "GD", phoneCode: "+1", flag: "\u{1F1EC}\u{1F1E9}" },
|
|
249
|
+
{ name: "Guadeloupe", code: "GP", phoneCode: "+590", flag: "\u{1F1EC}\u{1F1F5}" },
|
|
250
|
+
{ name: "Guam", code: "GU", phoneCode: "+1", flag: "\u{1F1EC}\u{1F1FA}" },
|
|
251
|
+
{ name: "Guatemala", code: "GT", phoneCode: "+502", flag: "\u{1F1EC}\u{1F1F9}" },
|
|
252
|
+
{ name: "Guernsey", code: "GG", phoneCode: "+44", flag: "\u{1F1EC}\u{1F1EC}" },
|
|
253
|
+
{ name: "Guinea", code: "GN", phoneCode: "+224", flag: "\u{1F1EC}\u{1F1F3}" },
|
|
254
|
+
{ name: "Guinea-Bissau", code: "GW", phoneCode: "+245", flag: "\u{1F1EC}\u{1F1FC}" },
|
|
255
|
+
{ name: "Guyana", code: "GY", phoneCode: "+592", flag: "\u{1F1EC}\u{1F1FE}" },
|
|
256
|
+
{ name: "Haiti", code: "HT", phoneCode: "+509", flag: "\u{1F1ED}\u{1F1F9}" },
|
|
257
|
+
{ name: "Heard Island and McDonald Islands", code: "HM", phoneCode: "+672", flag: "\u{1F1ED}\u{1F1F2}" },
|
|
258
|
+
{ name: "Holy See (Vatican City State)", code: "VA", phoneCode: "+39", flag: "\u{1F1FB}\u{1F1E6}" },
|
|
259
|
+
{ name: "Honduras", code: "HN", phoneCode: "+504", flag: "\u{1F1ED}\u{1F1F3}" },
|
|
260
|
+
{ name: "Hong Kong", code: "HK", phoneCode: "+852", flag: "\u{1F1ED}\u{1F1F0}" },
|
|
261
|
+
{ name: "Hungary", code: "HU", phoneCode: "+36", flag: "\u{1F1ED}\u{1F1FA}" },
|
|
262
|
+
{ name: "Iceland", code: "IS", phoneCode: "+354", flag: "\u{1F1EE}\u{1F1F8}" },
|
|
263
|
+
{ name: "India", code: "IN", phoneCode: "+91", flag: "\u{1F1EE}\u{1F1F3}" },
|
|
264
|
+
{ name: "Indonesia", code: "ID", phoneCode: "+62", flag: "\u{1F1EE}\u{1F1E9}" },
|
|
265
|
+
{ name: "Iran, Islamic Republic of", code: "IR", phoneCode: "+98", flag: "\u{1F1EE}\u{1F1F7}" },
|
|
266
|
+
{ name: "Iraq", code: "IQ", phoneCode: "+964", flag: "\u{1F1EE}\u{1F1F6}" },
|
|
267
|
+
{ name: "Ireland", code: "IE", phoneCode: "+353", flag: "\u{1F1EE}\u{1F1EA}" },
|
|
268
|
+
{ name: "Isle of Man", code: "IM", phoneCode: "+44", flag: "\u{1F1EE}\u{1F1F2}" },
|
|
269
|
+
{ name: "Israel", code: "IL", phoneCode: "+972", flag: "\u{1F1EE}\u{1F1F1}" },
|
|
270
|
+
{ name: "Italy", code: "IT", phoneCode: "+39", flag: "\u{1F1EE}\u{1F1F9}" },
|
|
271
|
+
{ name: "Jamaica", code: "JM", phoneCode: "+1", flag: "\u{1F1EF}\u{1F1F2}" },
|
|
272
|
+
{ name: "Japan", code: "JP", phoneCode: "+81", flag: "\u{1F1EF}\u{1F1F5}" },
|
|
273
|
+
{ name: "Jersey", code: "JE", phoneCode: "+44", flag: "\u{1F1EF}\u{1F1EA}" },
|
|
274
|
+
{ name: "Jordan", code: "JO", phoneCode: "+962", flag: "\u{1F1EF}\u{1F1F4}" },
|
|
275
|
+
{ name: "Kazakhstan", code: "KZ", phoneCode: "+7", flag: "\u{1F1F0}\u{1F1FF}" },
|
|
276
|
+
{ name: "Kenya", code: "KE", phoneCode: "+254", flag: "\u{1F1F0}\u{1F1EA}" },
|
|
277
|
+
{ name: "Kiribati", code: "KI", phoneCode: "+686", flag: "\u{1F1F0}\u{1F1EE}" },
|
|
278
|
+
{ name: "Korea, Democratic People's Republic of", code: "KP", phoneCode: "+850", flag: "\u{1F1F0}\u{1F1F5}" },
|
|
279
|
+
{ name: "Korea, Republic of", code: "KR", phoneCode: "+82", flag: "\u{1F1F0}\u{1F1F7}" },
|
|
280
|
+
{ name: "Kuwait", code: "KW", phoneCode: "+965", flag: "\u{1F1F0}\u{1F1FC}" },
|
|
281
|
+
{ name: "Kyrgyzstan", code: "KG", phoneCode: "+996", flag: "\u{1F1F0}\u{1F1EC}" },
|
|
282
|
+
{ name: "Lao People's Democratic Republic", code: "LA", phoneCode: "+856", flag: "\u{1F1F1}\u{1F1E6}" },
|
|
283
|
+
{ name: "Latvia", code: "LV", phoneCode: "+371", flag: "\u{1F1F1}\u{1F1FB}" },
|
|
284
|
+
{ name: "Lebanon", code: "LB", phoneCode: "+961", flag: "\u{1F1F1}\u{1F1E7}" },
|
|
285
|
+
{ name: "Lesotho", code: "LS", phoneCode: "+266", flag: "\u{1F1F1}\u{1F1F8}" },
|
|
286
|
+
{ name: "Liberia", code: "LR", phoneCode: "+231", flag: "\u{1F1F1}\u{1F1F7}" },
|
|
287
|
+
{ name: "Libya", code: "LY", phoneCode: "+218", flag: "\u{1F1F1}\u{1F1FE}" },
|
|
288
|
+
{ name: "Liechtenstein", code: "LI", phoneCode: "+423", flag: "\u{1F1F1}\u{1F1EE}" },
|
|
289
|
+
{ name: "Lithuania", code: "LT", phoneCode: "+370", flag: "\u{1F1F1}\u{1F1F9}" },
|
|
290
|
+
{ name: "Luxembourg", code: "LU", phoneCode: "+352", flag: "\u{1F1F1}\u{1F1FA}" },
|
|
291
|
+
{ name: "Macao", code: "MO", phoneCode: "+853", flag: "\u{1F1F2}\u{1F1F4}" },
|
|
292
|
+
{ name: "Macedonia, the former Yugoslav Republic of", code: "MK", phoneCode: "+389", flag: "\u{1F1F2}\u{1F1F0}" },
|
|
293
|
+
{ name: "Madagascar", code: "MG", phoneCode: "+261", flag: "\u{1F1F2}\u{1F1EC}" },
|
|
294
|
+
{ name: "Malawi", code: "MW", phoneCode: "+265", flag: "\u{1F1F2}\u{1F1FC}" },
|
|
295
|
+
{ name: "Malaysia", code: "MY", phoneCode: "+60", flag: "\u{1F1F2}\u{1F1FE}" },
|
|
296
|
+
{ name: "Maldives", code: "MV", phoneCode: "+960", flag: "\u{1F1F2}\u{1F1FB}" },
|
|
297
|
+
{ name: "Mali", code: "ML", phoneCode: "+223", flag: "\u{1F1F2}\u{1F1F1}" },
|
|
298
|
+
{ name: "Malta", code: "MT", phoneCode: "+356", flag: "\u{1F1F2}\u{1F1F9}" },
|
|
299
|
+
{ name: "Marshall Islands", code: "MH", phoneCode: "+692", flag: "\u{1F1F2}\u{1F1ED}" },
|
|
300
|
+
{ name: "Martinique", code: "MQ", phoneCode: "+596", flag: "\u{1F1F2}\u{1F1F6}" },
|
|
301
|
+
{ name: "Mauritania", code: "MR", phoneCode: "+222", flag: "\u{1F1F2}\u{1F1F7}" },
|
|
302
|
+
{ name: "Mauritius", code: "MU", phoneCode: "+230", flag: "\u{1F1F2}\u{1F1FA}" },
|
|
303
|
+
{ name: "Mayotte", code: "YT", phoneCode: "+262", flag: "\u{1F1FE}\u{1F1F9}" },
|
|
304
|
+
{ name: "Mexico", code: "MX", phoneCode: "+52", flag: "\u{1F1F2}\u{1F1FD}" },
|
|
305
|
+
{ name: "Micronesia, Federated States of", code: "FM", phoneCode: "+691", flag: "\u{1F1EB}\u{1F1F2}" },
|
|
306
|
+
{ name: "Moldova, Republic of", code: "MD", phoneCode: "+373", flag: "\u{1F1F2}\u{1F1E9}" },
|
|
307
|
+
{ name: "Monaco", code: "MC", phoneCode: "+377", flag: "\u{1F1F2}\u{1F1E8}" },
|
|
308
|
+
{ name: "Mongolia", code: "MN", phoneCode: "+976", flag: "\u{1F1F2}\u{1F1F3}" },
|
|
309
|
+
{ name: "Montenegro", code: "ME", phoneCode: "+382", flag: "\u{1F1F2}\u{1F1EA}" },
|
|
310
|
+
{ name: "Montserrat", code: "MS", phoneCode: "+1", flag: "\u{1F1F2}\u{1F1F8}" },
|
|
311
|
+
{ name: "Morocco", code: "MA", phoneCode: "+212", flag: "\u{1F1F2}\u{1F1E6}" },
|
|
312
|
+
{ name: "Mozambique", code: "MZ", phoneCode: "+258", flag: "\u{1F1F2}\u{1F1FF}" },
|
|
313
|
+
{ name: "Myanmar", code: "MM", phoneCode: "+95", flag: "\u{1F1F2}\u{1F1F2}" },
|
|
314
|
+
{ name: "Namibia", code: "NA", phoneCode: "+264", flag: "\u{1F1F3}\u{1F1E6}" },
|
|
315
|
+
{ name: "Nauru", code: "NR", phoneCode: "+674", flag: "\u{1F1F3}\u{1F1F7}" },
|
|
316
|
+
{ name: "Nepal", code: "NP", phoneCode: "+977", flag: "\u{1F1F3}\u{1F1F5}" },
|
|
317
|
+
{ name: "Netherlands", code: "NL", phoneCode: "+31", flag: "\u{1F1F3}\u{1F1F1}" },
|
|
318
|
+
{ name: "New Caledonia", code: "NC", phoneCode: "+687", flag: "\u{1F1F3}\u{1F1E8}" },
|
|
319
|
+
{ name: "New Zealand", code: "NZ", phoneCode: "+64", flag: "\u{1F1F3}\u{1F1FF}" },
|
|
320
|
+
{ name: "Nicaragua", code: "NI", phoneCode: "+505", flag: "\u{1F1F3}\u{1F1EE}" },
|
|
321
|
+
{ name: "Niger", code: "NE", phoneCode: "+227", flag: "\u{1F1F3}\u{1F1EA}" },
|
|
322
|
+
{ name: "Nigeria", code: "NG", phoneCode: "+234", flag: "\u{1F1F3}\u{1F1EC}" },
|
|
323
|
+
{ name: "Niue", code: "NU", phoneCode: "+683", flag: "\u{1F1F3}\u{1F1FA}" },
|
|
324
|
+
{ name: "Norfolk Island", code: "NF", phoneCode: "+672", flag: "\u{1F1F3}\u{1F1EB}" },
|
|
325
|
+
{ name: "Northern Mariana Islands", code: "MP", phoneCode: "+1", flag: "\u{1F1F2}\u{1F1F5}" },
|
|
326
|
+
{ name: "Norway", code: "NO", phoneCode: "+47", flag: "\u{1F1F3}\u{1F1F4}" },
|
|
327
|
+
{ name: "Oman", code: "OM", phoneCode: "+968", flag: "\u{1F1F4}\u{1F1F2}" },
|
|
328
|
+
{ name: "Pakistan", code: "PK", phoneCode: "+92", flag: "\u{1F1F5}\u{1F1F0}" },
|
|
329
|
+
{ name: "Palau", code: "PW", phoneCode: "+680", flag: "\u{1F1F5}\u{1F1FC}" },
|
|
330
|
+
{ name: "Palestinian Territory, Occupied", code: "PS", phoneCode: "+970", flag: "\u{1F1F5}\u{1F1F8}" },
|
|
331
|
+
{ name: "Panama", code: "PA", phoneCode: "+507", flag: "\u{1F1F5}\u{1F1E6}" },
|
|
332
|
+
{ name: "Papua New Guinea", code: "PG", phoneCode: "+675", flag: "\u{1F1F5}\u{1F1EC}" },
|
|
333
|
+
{ name: "Paraguay", code: "PY", phoneCode: "+595", flag: "\u{1F1F5}\u{1F1FE}" },
|
|
334
|
+
{ name: "Peru", code: "PE", phoneCode: "+51", flag: "\u{1F1F5}\u{1F1EA}" },
|
|
335
|
+
{ name: "Philippines", code: "PH", phoneCode: "+63", flag: "\u{1F1F5}\u{1F1ED}" },
|
|
336
|
+
{ name: "Pitcairn", code: "PN", phoneCode: "+64", flag: "\u{1F1F5}\u{1F1F3}" },
|
|
337
|
+
{ name: "Poland", code: "PL", phoneCode: "+48", flag: "\u{1F1F5}\u{1F1F1}" },
|
|
338
|
+
{ name: "Portugal", code: "PT", phoneCode: "+351", flag: "\u{1F1F5}\u{1F1F9}" },
|
|
339
|
+
{ name: "Puerto Rico", code: "PR", phoneCode: "+1", flag: "\u{1F1F5}\u{1F1F7}" },
|
|
340
|
+
{ name: "Qatar", code: "QA", phoneCode: "+974", flag: "\u{1F1F6}\u{1F1E6}" },
|
|
341
|
+
{ name: "R\xE9union", code: "RE", phoneCode: "+262", flag: "\u{1F1F7}\u{1F1EA}" },
|
|
342
|
+
{ name: "Romania", code: "RO", phoneCode: "+40", flag: "\u{1F1F7}\u{1F1F4}" },
|
|
343
|
+
{ name: "Russian Federation", code: "RU", phoneCode: "+7", flag: "\u{1F1F7}\u{1F1FA}" },
|
|
344
|
+
{ name: "Rwanda", code: "RW", phoneCode: "+250", flag: "\u{1F1F7}\u{1F1FC}" },
|
|
345
|
+
{ name: "Saint Barth\xE9lemy", code: "BL", phoneCode: "+590", flag: "\u{1F1E7}\u{1F1F1}" },
|
|
346
|
+
{ name: "Saint Helena, Ascension and Tristan da Cunha", code: "SH", phoneCode: "+290", flag: "\u{1F1F8}\u{1F1ED}" },
|
|
347
|
+
{ name: "Saint Kitts and Nevis", code: "KN", phoneCode: "+1", flag: "\u{1F1F0}\u{1F1F3}" },
|
|
348
|
+
{ name: "Saint Lucia", code: "LC", phoneCode: "+1", flag: "\u{1F1F1}\u{1F1E8}" },
|
|
349
|
+
{ name: "Saint Martin (French part)", code: "MF", phoneCode: "+590", flag: "\u{1F1F2}\u{1F1EB}" },
|
|
350
|
+
{ name: "Saint Pierre and Miquelon", code: "PM", phoneCode: "+508", flag: "\u{1F1F5}\u{1F1F2}" },
|
|
351
|
+
{ name: "Saint Vincent and the Grenadines", code: "VC", phoneCode: "+1", flag: "\u{1F1FB}\u{1F1E8}" },
|
|
352
|
+
{ name: "Samoa", code: "WS", phoneCode: "+685", flag: "\u{1F1FC}\u{1F1F8}" },
|
|
353
|
+
{ name: "San Marino", code: "SM", phoneCode: "+378", flag: "\u{1F1F8}\u{1F1F2}" },
|
|
354
|
+
{ name: "Sao Tome and Principe", code: "ST", phoneCode: "+239", flag: "\u{1F1F8}\u{1F1F9}" },
|
|
355
|
+
{ name: "Saudi Arabia", code: "SA", phoneCode: "+966", flag: "\u{1F1F8}\u{1F1E6}" },
|
|
356
|
+
{ name: "Senegal", code: "SN", phoneCode: "+221", flag: "\u{1F1F8}\u{1F1F3}" },
|
|
357
|
+
{ name: "Serbia", code: "RS", phoneCode: "+381", flag: "\u{1F1F7}\u{1F1F8}" },
|
|
358
|
+
{ name: "Seychelles", code: "SC", phoneCode: "+248", flag: "\u{1F1F8}\u{1F1E8}" },
|
|
359
|
+
{ name: "Sierra Leone", code: "SL", phoneCode: "+232", flag: "\u{1F1F8}\u{1F1F1}" },
|
|
360
|
+
{ name: "Singapore", code: "SG", phoneCode: "+65", flag: "\u{1F1F8}\u{1F1EC}" },
|
|
361
|
+
{ name: "Sint Maarten (Dutch part)", code: "SX", phoneCode: "+1", flag: "\u{1F1F8}\u{1F1FD}" },
|
|
362
|
+
{ name: "Slovakia", code: "SK", phoneCode: "+421", flag: "\u{1F1F8}\u{1F1F0}" },
|
|
363
|
+
{ name: "Slovenia", code: "SI", phoneCode: "+386", flag: "\u{1F1F8}\u{1F1EE}" },
|
|
364
|
+
{ name: "Solomon Islands", code: "SB", phoneCode: "+677", flag: "\u{1F1F8}\u{1F1E7}" },
|
|
365
|
+
{ name: "Somalia", code: "SO", phoneCode: "+252", flag: "\u{1F1F8}\u{1F1F4}" },
|
|
366
|
+
{ name: "South Africa", code: "ZA", phoneCode: "+27", flag: "\u{1F1FF}\u{1F1E6}" },
|
|
367
|
+
{ name: "South Georgia and the South Sandwich Islands", code: "GS", phoneCode: "+500", flag: "\u{1F1EC}\u{1F1F8}" },
|
|
368
|
+
{ name: "South Sudan", code: "SS", phoneCode: "+211", flag: "\u{1F1F8}\u{1F1F8}" },
|
|
369
|
+
{ name: "Spain", code: "ES", phoneCode: "+34", flag: "\u{1F1EA}\u{1F1F8}" },
|
|
370
|
+
{ name: "Sri Lanka", code: "LK", phoneCode: "+94", flag: "\u{1F1F1}\u{1F1F0}" },
|
|
371
|
+
{ name: "Sudan", code: "SD", phoneCode: "+249", flag: "\u{1F1F8}\u{1F1E9}" },
|
|
372
|
+
{ name: "Suriname", code: "SR", phoneCode: "+597", flag: "\u{1F1F8}\u{1F1F7}" },
|
|
373
|
+
{ name: "Svalbard and Jan Mayen", code: "SJ", phoneCode: "+47", flag: "\u{1F1F8}\u{1F1EF}" },
|
|
374
|
+
{ name: "Swaziland", code: "SZ", phoneCode: "+268", flag: "\u{1F1F8}\u{1F1FF}" },
|
|
375
|
+
{ name: "Sweden", code: "SE", phoneCode: "+46", flag: "\u{1F1F8}\u{1F1EA}" },
|
|
376
|
+
{ name: "Switzerland", code: "CH", phoneCode: "+41", flag: "\u{1F1E8}\u{1F1ED}" },
|
|
377
|
+
{ name: "Syrian Arab Republic", code: "SY", phoneCode: "+963", flag: "\u{1F1F8}\u{1F1FE}" },
|
|
378
|
+
{ name: "Taiwan, Province of China", code: "TW", phoneCode: "+886", flag: "\u{1F1F9}\u{1F1FC}" },
|
|
379
|
+
{ name: "Tajikistan", code: "TJ", phoneCode: "+992", flag: "\u{1F1F9}\u{1F1EF}" },
|
|
380
|
+
{ name: "Tanzania, United Republic of", code: "TZ", phoneCode: "+255", flag: "\u{1F1F9}\u{1F1FF}" },
|
|
381
|
+
{ name: "Thailand", code: "TH", phoneCode: "+66", flag: "\u{1F1F9}\u{1F1ED}" },
|
|
382
|
+
{ name: "Timor-Leste", code: "TL", phoneCode: "+670", flag: "\u{1F1F9}\u{1F1F1}" },
|
|
383
|
+
{ name: "Togo", code: "TG", phoneCode: "+228", flag: "\u{1F1F9}\u{1F1EC}" },
|
|
384
|
+
{ name: "Tokelau", code: "TK", phoneCode: "+690", flag: "\u{1F1F9}\u{1F1F0}" },
|
|
385
|
+
{ name: "Tonga", code: "TO", phoneCode: "+676", flag: "\u{1F1F9}\u{1F1F4}" },
|
|
386
|
+
{ name: "Trinidad and Tobago", code: "TT", phoneCode: "+1", flag: "\u{1F1F9}\u{1F1F9}" },
|
|
387
|
+
{ name: "Tunisia", code: "TN", phoneCode: "+216", flag: "\u{1F1F9}\u{1F1F3}" },
|
|
388
|
+
{ name: "Turkey", code: "TR", phoneCode: "+90", flag: "\u{1F1F9}\u{1F1F7}" },
|
|
389
|
+
{ name: "Turkmenistan", code: "TM", phoneCode: "+993", flag: "\u{1F1F9}\u{1F1F2}" },
|
|
390
|
+
{ name: "Turks and Caicos Islands", code: "TC", phoneCode: "+1", flag: "\u{1F1F9}\u{1F1E8}" },
|
|
391
|
+
{ name: "Tuvalu", code: "TV", phoneCode: "+688", flag: "\u{1F1F9}\u{1F1FB}" },
|
|
392
|
+
{ name: "Uganda", code: "UG", phoneCode: "+256", flag: "\u{1F1FA}\u{1F1EC}" },
|
|
393
|
+
{ name: "Ukraine", code: "UA", phoneCode: "+380", flag: "\u{1F1FA}\u{1F1E6}" },
|
|
394
|
+
{ name: "United Arab Emirates", code: "AE", phoneCode: "+971", flag: "\u{1F1E6}\u{1F1EA}" },
|
|
395
|
+
{ name: "United Kingdom", code: "GB", phoneCode: "+44", flag: "\u{1F1EC}\u{1F1E7}" },
|
|
396
|
+
{ name: "United States", code: "US", phoneCode: "+1", flag: "\u{1F1FA}\u{1F1F8}" },
|
|
397
|
+
{ name: "United States Minor Outlying Islands", code: "UM", phoneCode: "+1", flag: "\u{1F1FA}\u{1F1F2}" },
|
|
398
|
+
{ name: "Uruguay", code: "UY", phoneCode: "+598", flag: "\u{1F1FA}\u{1F1FE}" },
|
|
399
|
+
{ name: "Uzbekistan", code: "UZ", phoneCode: "+998", flag: "\u{1F1FA}\u{1F1FF}" },
|
|
400
|
+
{ name: "Vanuatu", code: "VU", phoneCode: "+678", flag: "\u{1F1FB}\u{1F1FA}" },
|
|
401
|
+
{ name: "Venezuela, Bolivarian Republic of", code: "VE", phoneCode: "+58", flag: "\u{1F1FB}\u{1F1EA}" },
|
|
402
|
+
{ name: "Viet Nam", code: "VN", phoneCode: "+84", flag: "\u{1F1FB}\u{1F1F3}" },
|
|
403
|
+
{ name: "Virgin Islands, British", code: "VG", phoneCode: "+1", flag: "\u{1F1FB}\u{1F1EC}" },
|
|
404
|
+
{ name: "Virgin Islands, U.S.", code: "VI", phoneCode: "+1", flag: "\u{1F1FB}\u{1F1EE}" },
|
|
405
|
+
{ name: "Wallis and Futuna", code: "WF", phoneCode: "+681", flag: "\u{1F1FC}\u{1F1EB}" },
|
|
406
|
+
{ name: "Western Sahara", code: "EH", phoneCode: "+212", flag: "\u{1F1EA}\u{1F1ED}" },
|
|
407
|
+
{ name: "Yemen", code: "YE", phoneCode: "+967", flag: "\u{1F1FE}\u{1F1EA}" },
|
|
408
|
+
{ name: "Zambia", code: "ZM", phoneCode: "+260", flag: "\u{1F1FF}\u{1F1F2}" },
|
|
409
|
+
{ name: "Zimbabwe", code: "ZW", phoneCode: "+263", flag: "\u{1F1FF}\u{1F1FC}" }
|
|
410
|
+
];
|
|
159
411
|
|
|
160
412
|
// src/utils/error.util.ts
|
|
161
413
|
var validateRegex = (value, regex) => regex.test(value);
|
|
@@ -1732,6 +1984,7 @@ var BaseSelect = ({
|
|
|
1732
1984
|
disabled = false,
|
|
1733
1985
|
loading = false,
|
|
1734
1986
|
validationError = "",
|
|
1987
|
+
showBottomText = true,
|
|
1735
1988
|
label = "",
|
|
1736
1989
|
hint = "",
|
|
1737
1990
|
required = false,
|
|
@@ -1985,8 +2238,8 @@ var BaseSelect = ({
|
|
|
1985
2238
|
]
|
|
1986
2239
|
}
|
|
1987
2240
|
),
|
|
1988
|
-
hint && /* @__PURE__ */ jsx29(BaseHint, { hint }),
|
|
1989
|
-
validationError && /* @__PURE__ */ jsx29(BaseInputError, { errorMessage: validationError })
|
|
2241
|
+
hint && showBottomText && /* @__PURE__ */ jsx29(BaseHint, { hint }),
|
|
2242
|
+
validationError && showBottomText && /* @__PURE__ */ jsx29(BaseInputError, { errorMessage: validationError })
|
|
1990
2243
|
] });
|
|
1991
2244
|
};
|
|
1992
2245
|
|
|
@@ -2035,6 +2288,7 @@ var BaseInput = ({
|
|
|
2035
2288
|
mask,
|
|
2036
2289
|
placeholder,
|
|
2037
2290
|
validationError = "",
|
|
2291
|
+
showBottomText = true,
|
|
2038
2292
|
hint = "",
|
|
2039
2293
|
rules = [],
|
|
2040
2294
|
isAmountInput = false,
|
|
@@ -2138,8 +2392,8 @@ var BaseInput = ({
|
|
|
2138
2392
|
]
|
|
2139
2393
|
}
|
|
2140
2394
|
),
|
|
2141
|
-
(hint || localHint) && /* @__PURE__ */ jsx31("p", { className: "text-body-3xs text-light-copy", children: localHint || hint }),
|
|
2142
|
-
(validationError || localError) && /* @__PURE__ */ jsx31("p", { className: "text-body-3xs text-red-500", children: localError || validationError })
|
|
2395
|
+
(hint || localHint) && showBottomText && /* @__PURE__ */ jsx31("p", { className: "text-body-3xs text-light-copy", children: localHint || hint }),
|
|
2396
|
+
(validationError || localError) && showBottomText && /* @__PURE__ */ jsx31("p", { className: "text-body-3xs text-red-500", children: localError || validationError })
|
|
2143
2397
|
] });
|
|
2144
2398
|
};
|
|
2145
2399
|
|
|
@@ -2413,11 +2667,97 @@ function BzpCheckoutButton({
|
|
|
2413
2667
|
}
|
|
2414
2668
|
|
|
2415
2669
|
// src/buzapay-checkout/checkout-card.tsx
|
|
2416
|
-
import { useEffect as
|
|
2670
|
+
import { useEffect as useEffect7, useState as useState7 } from "react";
|
|
2417
2671
|
|
|
2418
2672
|
// src/components/pay-by-card.tsx
|
|
2419
|
-
import { useEffect as
|
|
2673
|
+
import { useEffect as useEffect4, useState as useState4 } from "react";
|
|
2674
|
+
|
|
2675
|
+
// src/components/base/phone-number-input.tsx
|
|
2676
|
+
import React5, { useEffect as useEffect3 } from "react";
|
|
2420
2677
|
import { jsx as jsx35, jsxs as jsxs23 } from "react/jsx-runtime";
|
|
2678
|
+
var BasePhoneNumberInput = ({
|
|
2679
|
+
phoneCodeOptions,
|
|
2680
|
+
value,
|
|
2681
|
+
onChange,
|
|
2682
|
+
onCodeChange,
|
|
2683
|
+
label = "",
|
|
2684
|
+
required = false,
|
|
2685
|
+
disabled = false,
|
|
2686
|
+
loading = false,
|
|
2687
|
+
validationError = "",
|
|
2688
|
+
hint = "",
|
|
2689
|
+
defaultCountryCode,
|
|
2690
|
+
preventPaste = false,
|
|
2691
|
+
showCopyIcon = false,
|
|
2692
|
+
containerClassName = "",
|
|
2693
|
+
inputClassName = "",
|
|
2694
|
+
placeholder
|
|
2695
|
+
}) => {
|
|
2696
|
+
const safeDefaultCode = phoneCodeOptions?.[0]?.value ?? "+1";
|
|
2697
|
+
const [selectedCode, setSelectedCode] = React5.useState(safeDefaultCode);
|
|
2698
|
+
const selectedMeta = React5.useMemo(() => {
|
|
2699
|
+
return phoneCodeOptions.find((o) => o.value === selectedCode);
|
|
2700
|
+
}, [phoneCodeOptions, selectedCode]);
|
|
2701
|
+
const getFormattedCode = (codeValue) => codeValue.split("-")[0];
|
|
2702
|
+
const handleCountryChange = (nextValue) => {
|
|
2703
|
+
setSelectedCode(nextValue);
|
|
2704
|
+
onCodeChange?.(getFormattedCode(nextValue));
|
|
2705
|
+
};
|
|
2706
|
+
const handleChange = (e) => {
|
|
2707
|
+
const incoming = e;
|
|
2708
|
+
onChange?.(incoming);
|
|
2709
|
+
};
|
|
2710
|
+
const computedPlaceholder = placeholder ?? selectedMeta?.placeholder ?? (label ? `Enter ${label.toLowerCase()}` : "Enter phone number");
|
|
2711
|
+
useEffect3(() => {
|
|
2712
|
+
const nextValue = defaultCountryCode ?? safeDefaultCode;
|
|
2713
|
+
setSelectedCode(nextValue);
|
|
2714
|
+
onCodeChange?.(getFormattedCode(nextValue));
|
|
2715
|
+
}, [defaultCountryCode]);
|
|
2716
|
+
return /* @__PURE__ */ jsxs23("div", { className: `flex flex-col gap-2`, children: [
|
|
2717
|
+
label ? /* @__PURE__ */ jsxs23("p", { className: "mb-0 text-body-2xs font-normal text-heading-text", children: [
|
|
2718
|
+
label,
|
|
2719
|
+
required && /* @__PURE__ */ jsx35("span", { className: "text-orange-required", children: " *" })
|
|
2720
|
+
] }) : null,
|
|
2721
|
+
/* @__PURE__ */ jsxs23("div", { className: `flex items-center gap-2 ${containerClassName}`, children: [
|
|
2722
|
+
/* @__PURE__ */ jsx35("div", { className: "w-1/3", children: /* @__PURE__ */ jsx35(
|
|
2723
|
+
BaseSelect,
|
|
2724
|
+
{
|
|
2725
|
+
required: true,
|
|
2726
|
+
options: phoneCodeOptions,
|
|
2727
|
+
value: selectedCode,
|
|
2728
|
+
showBottomText: false,
|
|
2729
|
+
itemImageType: "country",
|
|
2730
|
+
onChange: handleCountryChange,
|
|
2731
|
+
validationError,
|
|
2732
|
+
placeholder: "+234"
|
|
2733
|
+
}
|
|
2734
|
+
) }),
|
|
2735
|
+
/* @__PURE__ */ jsx35("div", { className: "w-2/3", children: /* @__PURE__ */ jsx35(
|
|
2736
|
+
BaseInput,
|
|
2737
|
+
{
|
|
2738
|
+
className: inputClassName,
|
|
2739
|
+
required,
|
|
2740
|
+
disabled,
|
|
2741
|
+
loading,
|
|
2742
|
+
validationError,
|
|
2743
|
+
showBottomText: false,
|
|
2744
|
+
hint,
|
|
2745
|
+
value,
|
|
2746
|
+
onChange: handleChange,
|
|
2747
|
+
rules: ["numeric"],
|
|
2748
|
+
preventPaste,
|
|
2749
|
+
showCopyIcon,
|
|
2750
|
+
placeholder: computedPlaceholder
|
|
2751
|
+
}
|
|
2752
|
+
) })
|
|
2753
|
+
] }),
|
|
2754
|
+
hint && /* @__PURE__ */ jsx35("p", { className: "text-body-3xs text-light-copy", children: hint }),
|
|
2755
|
+
validationError && /* @__PURE__ */ jsx35("p", { className: "text-body-3xs text-red-500", children: validationError })
|
|
2756
|
+
] });
|
|
2757
|
+
};
|
|
2758
|
+
|
|
2759
|
+
// src/components/pay-by-card.tsx
|
|
2760
|
+
import { jsx as jsx36, jsxs as jsxs24 } from "react/jsx-runtime";
|
|
2421
2761
|
function PayByCard({
|
|
2422
2762
|
secretKey,
|
|
2423
2763
|
paymentObject,
|
|
@@ -2430,6 +2770,7 @@ function PayByCard({
|
|
|
2430
2770
|
const [message, setMessage] = useState4("");
|
|
2431
2771
|
const [isMakingPayment, setIsMakingPayment] = useState4(false);
|
|
2432
2772
|
const [loading, setLoading] = useState4(false);
|
|
2773
|
+
const [defaultCountryCode, setDefaultCountryCode] = useState4("");
|
|
2433
2774
|
const [cardType, setCardType] = useState4("");
|
|
2434
2775
|
const [transactionReference, setTransactionReference] = useState4("");
|
|
2435
2776
|
const [loadingCountries, setLoadingCountries] = useState4(false);
|
|
@@ -2437,6 +2778,9 @@ function PayByCard({
|
|
|
2437
2778
|
const [rawCountries, setRawCountries] = useState4([]);
|
|
2438
2779
|
const [countries, setCountries] = useState4([]);
|
|
2439
2780
|
const [countryStates, setCountryStates] = useState4([]);
|
|
2781
|
+
const [phoneCodeOptions, setPhoneCodeOptions] = useState4(
|
|
2782
|
+
[]
|
|
2783
|
+
);
|
|
2440
2784
|
const [billingForm, setBillingForm] = useState4({
|
|
2441
2785
|
address1: "",
|
|
2442
2786
|
address2: "",
|
|
@@ -2445,7 +2789,8 @@ function PayByCard({
|
|
|
2445
2789
|
city: "",
|
|
2446
2790
|
country: "",
|
|
2447
2791
|
emailAddress: "",
|
|
2448
|
-
phoneNumber: ""
|
|
2792
|
+
phoneNumber: "",
|
|
2793
|
+
phoneNumberExt: ""
|
|
2449
2794
|
});
|
|
2450
2795
|
const [payForm, setPayForm] = useState4({
|
|
2451
2796
|
customerName: "",
|
|
@@ -2533,7 +2878,7 @@ function PayByCard({
|
|
|
2533
2878
|
city: billingForm.city ?? "",
|
|
2534
2879
|
country: billingForm.country ?? "",
|
|
2535
2880
|
emailAddress: billingForm.emailAddress ?? "",
|
|
2536
|
-
phoneNumber: billingForm.phoneNumber
|
|
2881
|
+
phoneNumber: billingForm.phoneNumber ? `${billingForm.phoneNumberExt}${billingForm.phoneNumber}` : ""
|
|
2537
2882
|
};
|
|
2538
2883
|
const encryptedCardDetails = encryptPayload(secretKey, cardDetails);
|
|
2539
2884
|
let payload = null;
|
|
@@ -2632,13 +2977,12 @@ function PayByCard({
|
|
|
2632
2977
|
setIsMakingPayment(false);
|
|
2633
2978
|
return;
|
|
2634
2979
|
}
|
|
2635
|
-
|
|
2636
|
-
|
|
2637
|
-
|
|
2638
|
-
|
|
2639
|
-
|
|
2640
|
-
|
|
2641
|
-
});
|
|
2980
|
+
if (response && response.message) {
|
|
2981
|
+
setMessage(response.message);
|
|
2982
|
+
onError?.({
|
|
2983
|
+
errorMessage: response.message
|
|
2984
|
+
});
|
|
2985
|
+
}
|
|
2642
2986
|
setIsMakingPayment(false);
|
|
2643
2987
|
} catch (err) {
|
|
2644
2988
|
let friendly = "Payment failed";
|
|
@@ -2722,6 +3066,9 @@ function PayByCard({
|
|
|
2722
3066
|
setLoadingCountries(false);
|
|
2723
3067
|
}
|
|
2724
3068
|
};
|
|
3069
|
+
const goBack = () => {
|
|
3070
|
+
setFormIndex(formIndex > 0 ? formIndex - 1 : 0);
|
|
3071
|
+
};
|
|
2725
3072
|
const getStates = async (countryIso2) => {
|
|
2726
3073
|
const country = rawCountries.find((c) => c.iso2 === countryIso2);
|
|
2727
3074
|
if (!country) return;
|
|
@@ -2754,15 +3101,25 @@ function PayByCard({
|
|
|
2754
3101
|
setCardType(cardTypeHandler(event));
|
|
2755
3102
|
payRules.cardPin = cardType === "Verve" ? "required|numeric" : "";
|
|
2756
3103
|
};
|
|
2757
|
-
|
|
3104
|
+
useEffect4(() => {
|
|
2758
3105
|
(async () => {
|
|
2759
3106
|
await generatePaymentLinkHandler();
|
|
2760
3107
|
await getAllCountries();
|
|
3108
|
+
const codeOptions = COUNTRIES.map((country) => {
|
|
3109
|
+
return {
|
|
3110
|
+
value: `${country.phoneCode}-${country.code}`,
|
|
3111
|
+
label: `${country.phoneCode}`,
|
|
3112
|
+
flag: country.flag,
|
|
3113
|
+
phoneCode: country.phoneCode,
|
|
3114
|
+
countryCode: country.code
|
|
3115
|
+
};
|
|
3116
|
+
}).sort((a, b) => a.label.localeCompare(b.label));
|
|
3117
|
+
setPhoneCodeOptions(codeOptions);
|
|
2761
3118
|
})();
|
|
2762
3119
|
}, []);
|
|
2763
|
-
return /* @__PURE__ */
|
|
2764
|
-
formIndex === 0 && /* @__PURE__ */
|
|
2765
|
-
/* @__PURE__ */
|
|
3120
|
+
return /* @__PURE__ */ jsxs24("div", { className: "flex flex-col gap-6", children: [
|
|
3121
|
+
formIndex === 0 && /* @__PURE__ */ jsxs24("div", { className: "grid grid-cols-2 gap-6 overflow-y-auto", children: [
|
|
3122
|
+
/* @__PURE__ */ jsx36("div", { className: "col-span-2", children: /* @__PURE__ */ jsx36(
|
|
2766
3123
|
BaseInput,
|
|
2767
3124
|
{
|
|
2768
3125
|
label: "Address Line 1",
|
|
@@ -2777,7 +3134,7 @@ function PayByCard({
|
|
|
2777
3134
|
validationError: billingErrors.address1 ?? ""
|
|
2778
3135
|
}
|
|
2779
3136
|
) }),
|
|
2780
|
-
/* @__PURE__ */
|
|
3137
|
+
/* @__PURE__ */ jsx36("div", { className: "col-span-2", children: /* @__PURE__ */ jsx36(
|
|
2781
3138
|
BaseInput,
|
|
2782
3139
|
{
|
|
2783
3140
|
label: "Address Line 2",
|
|
@@ -2786,7 +3143,7 @@ function PayByCard({
|
|
|
2786
3143
|
validationError: billingErrors.address2 ?? ""
|
|
2787
3144
|
}
|
|
2788
3145
|
) }),
|
|
2789
|
-
/* @__PURE__ */
|
|
3146
|
+
/* @__PURE__ */ jsx36(
|
|
2790
3147
|
BaseSelect,
|
|
2791
3148
|
{
|
|
2792
3149
|
label: "Select Country",
|
|
@@ -2797,6 +3154,14 @@ function PayByCard({
|
|
|
2797
3154
|
onChange: (e) => {
|
|
2798
3155
|
setBillingForm({ ...billingForm, country: e, state: "" });
|
|
2799
3156
|
getStates(e);
|
|
3157
|
+
const selectedCountry = COUNTRIES.filter(
|
|
3158
|
+
(c) => c.code.toLowerCase() === e.toLowerCase()
|
|
3159
|
+
)[0];
|
|
3160
|
+
if (selectedCountry) {
|
|
3161
|
+
setDefaultCountryCode(
|
|
3162
|
+
`${selectedCountry.phoneCode}-${selectedCountry.code}`
|
|
3163
|
+
);
|
|
3164
|
+
}
|
|
2800
3165
|
if (billingErrors.country) {
|
|
2801
3166
|
setBillingErrors((er) => ({ ...er, country: "" }));
|
|
2802
3167
|
}
|
|
@@ -2804,7 +3169,7 @@ function PayByCard({
|
|
|
2804
3169
|
validationError: billingErrors.country ?? ""
|
|
2805
3170
|
}
|
|
2806
3171
|
),
|
|
2807
|
-
/* @__PURE__ */
|
|
3172
|
+
/* @__PURE__ */ jsx36(
|
|
2808
3173
|
BaseSelect,
|
|
2809
3174
|
{
|
|
2810
3175
|
label: "Select State",
|
|
@@ -2821,7 +3186,7 @@ function PayByCard({
|
|
|
2821
3186
|
validationError: billingErrors.state ?? ""
|
|
2822
3187
|
}
|
|
2823
3188
|
),
|
|
2824
|
-
/* @__PURE__ */
|
|
3189
|
+
/* @__PURE__ */ jsx36(
|
|
2825
3190
|
BaseInput,
|
|
2826
3191
|
{
|
|
2827
3192
|
label: "City",
|
|
@@ -2836,7 +3201,7 @@ function PayByCard({
|
|
|
2836
3201
|
validationError: billingErrors.city ?? ""
|
|
2837
3202
|
}
|
|
2838
3203
|
),
|
|
2839
|
-
/* @__PURE__ */
|
|
3204
|
+
/* @__PURE__ */ jsx36(
|
|
2840
3205
|
BaseInput,
|
|
2841
3206
|
{
|
|
2842
3207
|
label: "Postal Code",
|
|
@@ -2851,7 +3216,7 @@ function PayByCard({
|
|
|
2851
3216
|
validationError: billingErrors.postalCode ?? ""
|
|
2852
3217
|
}
|
|
2853
3218
|
),
|
|
2854
|
-
/* @__PURE__ */
|
|
3219
|
+
/* @__PURE__ */ jsx36("div", { className: "col-span-2", children: /* @__PURE__ */ jsx36(
|
|
2855
3220
|
BaseInput,
|
|
2856
3221
|
{
|
|
2857
3222
|
label: "Email",
|
|
@@ -2865,30 +3230,39 @@ function PayByCard({
|
|
|
2865
3230
|
},
|
|
2866
3231
|
validationError: billingErrors.emailAddress ?? ""
|
|
2867
3232
|
}
|
|
2868
|
-
),
|
|
2869
|
-
/* @__PURE__ */
|
|
2870
|
-
|
|
3233
|
+
) }),
|
|
3234
|
+
/* @__PURE__ */ jsx36("div", { className: "col-span-2", children: /* @__PURE__ */ jsx36(
|
|
3235
|
+
BasePhoneNumberInput,
|
|
2871
3236
|
{
|
|
2872
3237
|
label: "Phone Number",
|
|
2873
3238
|
required: true,
|
|
3239
|
+
preventPaste: true,
|
|
2874
3240
|
value: billingForm.phoneNumber,
|
|
3241
|
+
phoneCodeOptions,
|
|
3242
|
+
defaultCountryCode,
|
|
2875
3243
|
onChange: (e) => {
|
|
2876
3244
|
setBillingForm({ ...billingForm, phoneNumber: e });
|
|
2877
3245
|
if (billingErrors.phoneNumber) {
|
|
2878
3246
|
setBillingErrors((er) => ({ ...er, phoneNumber: "" }));
|
|
2879
3247
|
}
|
|
2880
3248
|
},
|
|
3249
|
+
onCodeChange: (e) => {
|
|
3250
|
+
setBillingForm({ ...billingForm, phoneNumberExt: e });
|
|
3251
|
+
if (billingErrors.phoneNumberExt) {
|
|
3252
|
+
setBillingErrors((er) => ({ ...er, phoneNumberExt: "" }));
|
|
3253
|
+
}
|
|
3254
|
+
},
|
|
2881
3255
|
validationError: billingErrors.phoneNumber ?? ""
|
|
2882
3256
|
}
|
|
2883
|
-
)
|
|
3257
|
+
) })
|
|
2884
3258
|
] }),
|
|
2885
|
-
formIndex === 1 && /* @__PURE__ */
|
|
3259
|
+
formIndex === 1 && /* @__PURE__ */ jsxs24(
|
|
2886
3260
|
"div",
|
|
2887
3261
|
{
|
|
2888
3262
|
className: "grid grid-cols-2 gap-6 overflow-y-auto",
|
|
2889
3263
|
style: { maxHeight: 320 },
|
|
2890
3264
|
children: [
|
|
2891
|
-
/* @__PURE__ */
|
|
3265
|
+
/* @__PURE__ */ jsx36("div", { className: "col-span-2", children: /* @__PURE__ */ jsx36(
|
|
2892
3266
|
BaseInput,
|
|
2893
3267
|
{
|
|
2894
3268
|
label: "Card Name",
|
|
@@ -2903,7 +3277,7 @@ function PayByCard({
|
|
|
2903
3277
|
validationError: payErrors.customerName ?? ""
|
|
2904
3278
|
}
|
|
2905
3279
|
) }),
|
|
2906
|
-
/* @__PURE__ */
|
|
3280
|
+
/* @__PURE__ */ jsx36("div", { className: "col-span-2", children: /* @__PURE__ */ jsx36(
|
|
2907
3281
|
BaseInput,
|
|
2908
3282
|
{
|
|
2909
3283
|
label: "Card Number",
|
|
@@ -2922,7 +3296,7 @@ function PayByCard({
|
|
|
2922
3296
|
validationError: payErrors.cardNo ?? ""
|
|
2923
3297
|
}
|
|
2924
3298
|
) }),
|
|
2925
|
-
/* @__PURE__ */
|
|
3299
|
+
/* @__PURE__ */ jsx36(
|
|
2926
3300
|
BaseInput,
|
|
2927
3301
|
{
|
|
2928
3302
|
label: "Expiry Date",
|
|
@@ -2938,7 +3312,7 @@ function PayByCard({
|
|
|
2938
3312
|
validationError: payErrors.expireDate ?? ""
|
|
2939
3313
|
}
|
|
2940
3314
|
),
|
|
2941
|
-
/* @__PURE__ */
|
|
3315
|
+
/* @__PURE__ */ jsx36(
|
|
2942
3316
|
BaseInput,
|
|
2943
3317
|
{
|
|
2944
3318
|
label: "CVV",
|
|
@@ -2954,7 +3328,7 @@ function PayByCard({
|
|
|
2954
3328
|
validationError: payErrors.cvv ?? ""
|
|
2955
3329
|
}
|
|
2956
3330
|
),
|
|
2957
|
-
cardType === "Verve" && /* @__PURE__ */
|
|
3331
|
+
cardType === "Verve" && /* @__PURE__ */ jsx36(
|
|
2958
3332
|
BaseInput,
|
|
2959
3333
|
{
|
|
2960
3334
|
label: "Card Pin",
|
|
@@ -2974,29 +3348,41 @@ function PayByCard({
|
|
|
2974
3348
|
]
|
|
2975
3349
|
}
|
|
2976
3350
|
),
|
|
2977
|
-
/* @__PURE__ */
|
|
2978
|
-
|
|
2979
|
-
|
|
2980
|
-
|
|
2981
|
-
|
|
2982
|
-
|
|
2983
|
-
|
|
2984
|
-
|
|
2985
|
-
|
|
2986
|
-
|
|
2987
|
-
|
|
2988
|
-
|
|
3351
|
+
/* @__PURE__ */ jsxs24("div", { className: "flex items-center justify-between gap-4 mt-6", children: [
|
|
3352
|
+
formIndex > 0 && /* @__PURE__ */ jsx36(
|
|
3353
|
+
BaseButton,
|
|
3354
|
+
{
|
|
3355
|
+
label: "Previous",
|
|
3356
|
+
type: "secondary",
|
|
3357
|
+
customClass: "w-1/2",
|
|
3358
|
+
caller,
|
|
3359
|
+
onClick: goBack
|
|
3360
|
+
}
|
|
3361
|
+
),
|
|
3362
|
+
/* @__PURE__ */ jsx36(
|
|
3363
|
+
BaseButton,
|
|
3364
|
+
{
|
|
3365
|
+
label: formIndex === 0 ? "Proceed" : `Pay ${formatAmountHandler}`,
|
|
3366
|
+
type: "primary",
|
|
3367
|
+
customClass: `${formIndex > 0 ? "w-1/2" : "w-full"}`,
|
|
3368
|
+
caller,
|
|
3369
|
+
loading: isMakingPayment,
|
|
3370
|
+
onClick: proceedHandler,
|
|
3371
|
+
disabled: isMakingPayment
|
|
3372
|
+
}
|
|
3373
|
+
)
|
|
3374
|
+
] })
|
|
2989
3375
|
] });
|
|
2990
3376
|
}
|
|
2991
3377
|
|
|
2992
3378
|
// src/components/pay-by-transfer.tsx
|
|
2993
3379
|
import {
|
|
2994
3380
|
useCallback as useCallback3,
|
|
2995
|
-
useEffect as
|
|
3381
|
+
useEffect as useEffect5,
|
|
2996
3382
|
useRef as useRef2,
|
|
2997
3383
|
useState as useState5
|
|
2998
3384
|
} from "react";
|
|
2999
|
-
import { jsx as
|
|
3385
|
+
import { jsx as jsx37, jsxs as jsxs25 } from "react/jsx-runtime";
|
|
3000
3386
|
var PayByTransfer = ({
|
|
3001
3387
|
secretKey,
|
|
3002
3388
|
paymentObject,
|
|
@@ -3207,19 +3593,19 @@ var PayByTransfer = ({
|
|
|
3207
3593
|
intervalRef.current = null;
|
|
3208
3594
|
}
|
|
3209
3595
|
};
|
|
3210
|
-
|
|
3596
|
+
useEffect5(() => {
|
|
3211
3597
|
(async () => {
|
|
3212
3598
|
await generatePaymentLinkHandler();
|
|
3213
3599
|
})();
|
|
3214
3600
|
}, []);
|
|
3215
|
-
|
|
3601
|
+
useEffect5(() => {
|
|
3216
3602
|
if (remainingSeconds < 0 && intervalRef.current) {
|
|
3217
3603
|
stopTimer();
|
|
3218
3604
|
}
|
|
3219
3605
|
}, [remainingSeconds]);
|
|
3220
|
-
return /* @__PURE__ */
|
|
3221
|
-
formIndex === 0 && /* @__PURE__ */
|
|
3222
|
-
/* @__PURE__ */
|
|
3606
|
+
return /* @__PURE__ */ jsxs25("div", { className: "flex flex-col gap-10", children: [
|
|
3607
|
+
formIndex === 0 && /* @__PURE__ */ jsxs25("div", { className: "flex flex-col gap-10", children: [
|
|
3608
|
+
/* @__PURE__ */ jsx37(
|
|
3223
3609
|
BaseInput,
|
|
3224
3610
|
{
|
|
3225
3611
|
label: "Customer Name",
|
|
@@ -3234,7 +3620,7 @@ var PayByTransfer = ({
|
|
|
3234
3620
|
validationError: transferErrors.customerName ?? ""
|
|
3235
3621
|
}
|
|
3236
3622
|
),
|
|
3237
|
-
/* @__PURE__ */
|
|
3623
|
+
/* @__PURE__ */ jsx37(
|
|
3238
3624
|
BaseButton,
|
|
3239
3625
|
{
|
|
3240
3626
|
label: `Pay ${formatAmountHandler}`,
|
|
@@ -3246,8 +3632,8 @@ var PayByTransfer = ({
|
|
|
3246
3632
|
}
|
|
3247
3633
|
)
|
|
3248
3634
|
] }),
|
|
3249
|
-
formIndex === 1 && /* @__PURE__ */
|
|
3250
|
-
/* @__PURE__ */
|
|
3635
|
+
formIndex === 1 && /* @__PURE__ */ jsxs25("div", { className: "flex flex-col gap-10", children: [
|
|
3636
|
+
/* @__PURE__ */ jsxs25(
|
|
3251
3637
|
"div",
|
|
3252
3638
|
{
|
|
3253
3639
|
className: [
|
|
@@ -3255,22 +3641,22 @@ var PayByTransfer = ({
|
|
|
3255
3641
|
caller === "miden" ? "bg-[#FAFDFF] border border-[#F0FAFF]" : "bg-[#EFF7FF]"
|
|
3256
3642
|
].join(" "),
|
|
3257
3643
|
children: [
|
|
3258
|
-
/* @__PURE__ */
|
|
3644
|
+
/* @__PURE__ */ jsx37(
|
|
3259
3645
|
BaseLabelInfo,
|
|
3260
3646
|
{
|
|
3261
3647
|
label: "Bank Name",
|
|
3262
3648
|
value: `${paymentAccountDetails?.bank} ${paymentAccountDetails?.accountName}`
|
|
3263
3649
|
}
|
|
3264
3650
|
),
|
|
3265
|
-
/* @__PURE__ */
|
|
3266
|
-
/* @__PURE__ */
|
|
3651
|
+
/* @__PURE__ */ jsxs25("div", { className: "flex items-center justify-between", children: [
|
|
3652
|
+
/* @__PURE__ */ jsx37(
|
|
3267
3653
|
BaseLabelInfo,
|
|
3268
3654
|
{
|
|
3269
3655
|
label: "Account Number",
|
|
3270
3656
|
value: paymentAccountDetails?.accountNumber
|
|
3271
3657
|
}
|
|
3272
3658
|
),
|
|
3273
|
-
/* @__PURE__ */
|
|
3659
|
+
/* @__PURE__ */ jsx37(
|
|
3274
3660
|
BaseCopy,
|
|
3275
3661
|
{
|
|
3276
3662
|
color: "#9DBFDE",
|
|
@@ -3278,20 +3664,20 @@ var PayByTransfer = ({
|
|
|
3278
3664
|
}
|
|
3279
3665
|
)
|
|
3280
3666
|
] }),
|
|
3281
|
-
/* @__PURE__ */
|
|
3282
|
-
/* @__PURE__ */
|
|
3283
|
-
/* @__PURE__ */
|
|
3667
|
+
/* @__PURE__ */ jsxs25("div", { className: "flex items-center justify-between", children: [
|
|
3668
|
+
/* @__PURE__ */ jsx37(BaseLabelInfo, { label: "Amount", value: formatAmountHandler }),
|
|
3669
|
+
/* @__PURE__ */ jsx37(BaseCopy, { color: "#9DBFDE", copyText: formatAmountHandler })
|
|
3284
3670
|
] })
|
|
3285
3671
|
]
|
|
3286
3672
|
}
|
|
3287
3673
|
),
|
|
3288
|
-
caller === "buzapay" && /* @__PURE__ */
|
|
3674
|
+
caller === "buzapay" && /* @__PURE__ */ jsxs25("p", { className: "w-2/3 mx-auto text-center text-body-2xs font-medium text-sub-copy", children: [
|
|
3289
3675
|
"This account is for this transaction only and expires in",
|
|
3290
3676
|
" ",
|
|
3291
|
-
/* @__PURE__ */
|
|
3677
|
+
/* @__PURE__ */ jsx37("span", { className: "text-orange-500", children: remainingSeconds >= 0 ? countDownTime : "00:00" })
|
|
3292
3678
|
] }),
|
|
3293
|
-
caller === "miden" && /* @__PURE__ */
|
|
3294
|
-
/* @__PURE__ */
|
|
3679
|
+
caller === "miden" && /* @__PURE__ */ jsxs25("div", { className: "p-4 rounded-lg bg-[#FAFDFF] flex items-center gap-3", children: [
|
|
3680
|
+
/* @__PURE__ */ jsx37(
|
|
3295
3681
|
BaseCircularCountdown,
|
|
3296
3682
|
{
|
|
3297
3683
|
value: remainingSeconds,
|
|
@@ -3302,16 +3688,16 @@ var PayByTransfer = ({
|
|
|
3302
3688
|
color: "#3b82f6"
|
|
3303
3689
|
}
|
|
3304
3690
|
),
|
|
3305
|
-
/* @__PURE__ */
|
|
3691
|
+
/* @__PURE__ */ jsxs25("p", { className: "text-body-3xs font-medium text-light-copy", children: [
|
|
3306
3692
|
"This account is for this transaction only and expires in",
|
|
3307
|
-
/* @__PURE__ */
|
|
3693
|
+
/* @__PURE__ */ jsxs25("span", { className: "text-[#1383E8] ml-2", children: [
|
|
3308
3694
|
countDownTime,
|
|
3309
3695
|
"..."
|
|
3310
3696
|
] })
|
|
3311
3697
|
] })
|
|
3312
3698
|
] }),
|
|
3313
|
-
/* @__PURE__ */
|
|
3314
|
-
/* @__PURE__ */
|
|
3699
|
+
/* @__PURE__ */ jsxs25("div", { className: "flex flex-col gap-4", children: [
|
|
3700
|
+
/* @__PURE__ */ jsx37(
|
|
3315
3701
|
BaseButton,
|
|
3316
3702
|
{
|
|
3317
3703
|
label: "I have paid the money",
|
|
@@ -3322,7 +3708,7 @@ var PayByTransfer = ({
|
|
|
3322
3708
|
onClick: getReferenceDetails
|
|
3323
3709
|
}
|
|
3324
3710
|
),
|
|
3325
|
-
/* @__PURE__ */
|
|
3711
|
+
/* @__PURE__ */ jsx37(
|
|
3326
3712
|
"button",
|
|
3327
3713
|
{
|
|
3328
3714
|
type: "button",
|
|
@@ -3337,8 +3723,8 @@ var PayByTransfer = ({
|
|
|
3337
3723
|
};
|
|
3338
3724
|
|
|
3339
3725
|
// src/components/pay-by-stable-coin.tsx
|
|
3340
|
-
import { useEffect as
|
|
3341
|
-
import { Fragment as Fragment3, jsx as
|
|
3726
|
+
import { useEffect as useEffect6, useState as useState6 } from "react";
|
|
3727
|
+
import { Fragment as Fragment3, jsx as jsx38, jsxs as jsxs26 } from "react/jsx-runtime";
|
|
3342
3728
|
var PayByStableCoin = ({
|
|
3343
3729
|
secretKey,
|
|
3344
3730
|
paymentObject,
|
|
@@ -3557,16 +3943,16 @@ var PayByStableCoin = ({
|
|
|
3557
3943
|
}
|
|
3558
3944
|
};
|
|
3559
3945
|
const amountPlusNetworkFee = addressDetails ? Number(addressDetails.transactionAmount) + addressDetails.networkFee : 0;
|
|
3560
|
-
|
|
3946
|
+
useEffect6(() => {
|
|
3561
3947
|
(async () => {
|
|
3562
3948
|
await generatePaymentLinkHandler();
|
|
3563
3949
|
await getAllStableCoins();
|
|
3564
3950
|
})();
|
|
3565
3951
|
}, []);
|
|
3566
|
-
return /* @__PURE__ */
|
|
3567
|
-
formIndex === 0 && /* @__PURE__ */
|
|
3568
|
-
/* @__PURE__ */
|
|
3569
|
-
/* @__PURE__ */
|
|
3952
|
+
return /* @__PURE__ */ jsxs26("div", { className: "flex flex-col gap-6", children: [
|
|
3953
|
+
formIndex === 0 && /* @__PURE__ */ jsxs26(Fragment3, { children: [
|
|
3954
|
+
/* @__PURE__ */ jsxs26("div", { className: "grid grid-cols-1 gap-6", children: [
|
|
3955
|
+
/* @__PURE__ */ jsx38(
|
|
3570
3956
|
BaseSelect,
|
|
3571
3957
|
{
|
|
3572
3958
|
label: "Select Crypto",
|
|
@@ -3584,7 +3970,7 @@ var PayByStableCoin = ({
|
|
|
3584
3970
|
validationError: stableCoinErrors.stableCoin ?? ""
|
|
3585
3971
|
}
|
|
3586
3972
|
),
|
|
3587
|
-
/* @__PURE__ */
|
|
3973
|
+
/* @__PURE__ */ jsx38(
|
|
3588
3974
|
BaseSelect,
|
|
3589
3975
|
{
|
|
3590
3976
|
label: "Select Network",
|
|
@@ -3602,7 +3988,7 @@ var PayByStableCoin = ({
|
|
|
3602
3988
|
}
|
|
3603
3989
|
)
|
|
3604
3990
|
] }),
|
|
3605
|
-
/* @__PURE__ */
|
|
3991
|
+
/* @__PURE__ */ jsx38(
|
|
3606
3992
|
BaseButton,
|
|
3607
3993
|
{
|
|
3608
3994
|
label: `Pay ${formatAmountHandler}`,
|
|
@@ -3614,22 +4000,22 @@ var PayByStableCoin = ({
|
|
|
3614
4000
|
}
|
|
3615
4001
|
)
|
|
3616
4002
|
] }),
|
|
3617
|
-
formIndex === 1 && /* @__PURE__ */
|
|
3618
|
-
caller === "buzapay" && /* @__PURE__ */
|
|
3619
|
-
/* @__PURE__ */
|
|
3620
|
-
/* @__PURE__ */
|
|
3621
|
-
/* @__PURE__ */
|
|
4003
|
+
formIndex === 1 && /* @__PURE__ */ jsxs26("div", { children: [
|
|
4004
|
+
caller === "buzapay" && /* @__PURE__ */ jsxs26("div", { className: "flex flex-col gap-6", children: [
|
|
4005
|
+
/* @__PURE__ */ jsxs26("div", { className: "mx-auto", children: [
|
|
4006
|
+
/* @__PURE__ */ jsx38(IconQrCode, {}),
|
|
4007
|
+
/* @__PURE__ */ jsx38("p", { className: "mb-0 text-body-4xs text-light-copy font-normal text-center", children: generateAddressPayload?.currency })
|
|
3622
4008
|
] }),
|
|
3623
|
-
/* @__PURE__ */
|
|
3624
|
-
/* @__PURE__ */
|
|
3625
|
-
/* @__PURE__ */
|
|
3626
|
-
/* @__PURE__ */
|
|
3627
|
-
/* @__PURE__ */
|
|
3628
|
-
/* @__PURE__ */
|
|
3629
|
-
/* @__PURE__ */
|
|
3630
|
-
/* @__PURE__ */
|
|
3631
|
-
/* @__PURE__ */
|
|
3632
|
-
/* @__PURE__ */
|
|
4009
|
+
/* @__PURE__ */ jsxs26("div", { className: "flex flex-col gap-6 border-c border-grey-100 p-4 rounded-2xl bg-light-white-50", children: [
|
|
4010
|
+
/* @__PURE__ */ jsxs26("div", { className: "border-b border-grey-border pb-4 flex flex-col gap-2", children: [
|
|
4011
|
+
/* @__PURE__ */ jsx38("p", { className: "mb-0 text-body-3xs text-light-copy font-normal", children: "Network" }),
|
|
4012
|
+
/* @__PURE__ */ jsxs26("div", { className: "flex justify-between", children: [
|
|
4013
|
+
/* @__PURE__ */ jsxs26("div", { className: "flex flex-col gap-1", children: [
|
|
4014
|
+
/* @__PURE__ */ jsx38("p", { className: "mb-0 text-body-2xs font-medium text-sub-copy", children: addressDetails?.chain }),
|
|
4015
|
+
/* @__PURE__ */ jsxs26("div", { className: "flex items-center gap-2", children: [
|
|
4016
|
+
/* @__PURE__ */ jsx38("p", { className: "mb-0 text-body-3xs text-light-copy font-normal", children: "*Est. arrival = 3 mins" }),
|
|
4017
|
+
/* @__PURE__ */ jsx38("p", { className: "mb-0 text-body-3xs text-light-copy font-normal", children: "|" }),
|
|
4018
|
+
/* @__PURE__ */ jsx38(
|
|
3633
4019
|
BaseCurrencyAmount,
|
|
3634
4020
|
{
|
|
3635
4021
|
currency: generateAddressPayload?.currency ?? "",
|
|
@@ -3642,21 +4028,21 @@ var PayByStableCoin = ({
|
|
|
3642
4028
|
)
|
|
3643
4029
|
] })
|
|
3644
4030
|
] }),
|
|
3645
|
-
/* @__PURE__ */
|
|
4031
|
+
/* @__PURE__ */ jsx38(IconArrowSwap, {})
|
|
3646
4032
|
] })
|
|
3647
4033
|
] }),
|
|
3648
|
-
/* @__PURE__ */
|
|
3649
|
-
/* @__PURE__ */
|
|
3650
|
-
/* @__PURE__ */
|
|
3651
|
-
/* @__PURE__ */
|
|
3652
|
-
/* @__PURE__ */
|
|
4034
|
+
/* @__PURE__ */ jsxs26("div", { className: "pb-4 flex flex-col gap-2", children: [
|
|
4035
|
+
/* @__PURE__ */ jsx38("p", { className: "mb-0 text-body-3xs text-light-copy font-normal", children: "Deposit Address >" }),
|
|
4036
|
+
/* @__PURE__ */ jsxs26("div", { className: "flex justify-between", children: [
|
|
4037
|
+
/* @__PURE__ */ jsx38("p", { className: "mb-0 text-body-2xs font-medium text-sub-copy w-2/3 break-words", children: addressDetails?.walletAddress }),
|
|
4038
|
+
/* @__PURE__ */ jsx38(BaseCopy, { copyText: addressDetails?.walletAddress ?? "" })
|
|
3653
4039
|
] })
|
|
3654
4040
|
] })
|
|
3655
4041
|
] }),
|
|
3656
|
-
/* @__PURE__ */
|
|
3657
|
-
/* @__PURE__ */
|
|
3658
|
-
/* @__PURE__ */
|
|
3659
|
-
/* @__PURE__ */
|
|
4042
|
+
/* @__PURE__ */ jsxs26("div", { className: "flex flex-col gap-2", children: [
|
|
4043
|
+
/* @__PURE__ */ jsxs26("div", { className: "flex items-center justify-between border-b border-grey-border py-3", children: [
|
|
4044
|
+
/* @__PURE__ */ jsx38("p", { className: "mb-0 text-body-2xs font-medium text-primary-black", children: "Network fee" }),
|
|
4045
|
+
/* @__PURE__ */ jsx38(
|
|
3660
4046
|
BaseCurrencyAmount,
|
|
3661
4047
|
{
|
|
3662
4048
|
currency: generateAddressPayload?.currency ?? "",
|
|
@@ -3666,9 +4052,9 @@ var PayByStableCoin = ({
|
|
|
3666
4052
|
}
|
|
3667
4053
|
)
|
|
3668
4054
|
] }),
|
|
3669
|
-
/* @__PURE__ */
|
|
3670
|
-
/* @__PURE__ */
|
|
3671
|
-
/* @__PURE__ */
|
|
4055
|
+
/* @__PURE__ */ jsxs26("div", { className: "flex items-center justify-between py-4", children: [
|
|
4056
|
+
/* @__PURE__ */ jsx38("p", { className: "mb-0 text-body-lg font-semibold text-primary-black", children: "Pay" }),
|
|
4057
|
+
/* @__PURE__ */ jsx38(
|
|
3672
4058
|
BaseCurrencyAmount,
|
|
3673
4059
|
{
|
|
3674
4060
|
currency: generateAddressPayload?.currency ?? "",
|
|
@@ -3681,7 +4067,7 @@ var PayByStableCoin = ({
|
|
|
3681
4067
|
)
|
|
3682
4068
|
] })
|
|
3683
4069
|
] }),
|
|
3684
|
-
/* @__PURE__ */
|
|
4070
|
+
/* @__PURE__ */ jsx38("div", { className: "flex flex-col gap-6", children: /* @__PURE__ */ jsx38(
|
|
3685
4071
|
BaseButton,
|
|
3686
4072
|
{
|
|
3687
4073
|
label: "Confirm Payment",
|
|
@@ -3693,17 +4079,17 @@ var PayByStableCoin = ({
|
|
|
3693
4079
|
}
|
|
3694
4080
|
) })
|
|
3695
4081
|
] }),
|
|
3696
|
-
caller === "miden" && /* @__PURE__ */
|
|
3697
|
-
/* @__PURE__ */
|
|
3698
|
-
/* @__PURE__ */
|
|
3699
|
-
/* @__PURE__ */
|
|
4082
|
+
caller === "miden" && /* @__PURE__ */ jsxs26("div", { className: "flex flex-col gap-6", children: [
|
|
4083
|
+
/* @__PURE__ */ jsxs26("div", { className: "p-4 rounded-lg flex flex-col gap-6 bg-[#FAFDFF] border border-[#F0FAFF]", children: [
|
|
4084
|
+
/* @__PURE__ */ jsxs26("div", { className: "flex items-center justify-between", children: [
|
|
4085
|
+
/* @__PURE__ */ jsx38(
|
|
3700
4086
|
BaseLabelInfo,
|
|
3701
4087
|
{
|
|
3702
4088
|
label: "Chain",
|
|
3703
4089
|
value: addressDetails?.chain ?? ""
|
|
3704
4090
|
}
|
|
3705
4091
|
),
|
|
3706
|
-
/* @__PURE__ */
|
|
4092
|
+
/* @__PURE__ */ jsx38(
|
|
3707
4093
|
BaseCopy,
|
|
3708
4094
|
{
|
|
3709
4095
|
color: "#9DBFDE",
|
|
@@ -3711,15 +4097,15 @@ var PayByStableCoin = ({
|
|
|
3711
4097
|
}
|
|
3712
4098
|
)
|
|
3713
4099
|
] }),
|
|
3714
|
-
/* @__PURE__ */
|
|
3715
|
-
/* @__PURE__ */
|
|
4100
|
+
/* @__PURE__ */ jsxs26("div", { className: "flex items-center justify-between", children: [
|
|
4101
|
+
/* @__PURE__ */ jsx38(
|
|
3716
4102
|
BaseLabelInfo,
|
|
3717
4103
|
{
|
|
3718
4104
|
label: "Wallet Address",
|
|
3719
4105
|
value: addressDetails?.walletAddress ?? ""
|
|
3720
4106
|
}
|
|
3721
4107
|
),
|
|
3722
|
-
/* @__PURE__ */
|
|
4108
|
+
/* @__PURE__ */ jsx38(
|
|
3723
4109
|
BaseCopy,
|
|
3724
4110
|
{
|
|
3725
4111
|
color: "#9DBFDE",
|
|
@@ -3727,9 +4113,9 @@ var PayByStableCoin = ({
|
|
|
3727
4113
|
}
|
|
3728
4114
|
)
|
|
3729
4115
|
] }),
|
|
3730
|
-
/* @__PURE__ */
|
|
3731
|
-
/* @__PURE__ */
|
|
3732
|
-
/* @__PURE__ */
|
|
4116
|
+
/* @__PURE__ */ jsxs26("div", { className: "flex flex-col", children: [
|
|
4117
|
+
/* @__PURE__ */ jsx38("p", { className: "mb-1 text-body-4xs font-medium text-light-copy uppercase", children: "Amount" }),
|
|
4118
|
+
/* @__PURE__ */ jsx38(
|
|
3733
4119
|
BaseCurrencyAmount,
|
|
3734
4120
|
{
|
|
3735
4121
|
currency: generateAddressPayload?.currency ?? "",
|
|
@@ -3741,17 +4127,17 @@ var PayByStableCoin = ({
|
|
|
3741
4127
|
}
|
|
3742
4128
|
)
|
|
3743
4129
|
] }),
|
|
3744
|
-
/* @__PURE__ */
|
|
3745
|
-
/* @__PURE__ */
|
|
3746
|
-
/* @__PURE__ */
|
|
3747
|
-
/* @__PURE__ */
|
|
4130
|
+
/* @__PURE__ */ jsxs26("div", { className: "flex gap-4 items-center justify-center", children: [
|
|
4131
|
+
/* @__PURE__ */ jsx38("div", { className: "w-24 border border-[#E1EBF5]" }),
|
|
4132
|
+
/* @__PURE__ */ jsx38("p", { className: "mb-2 text-body-2xs text-[#5F738C] font-normal", children: "Or" }),
|
|
4133
|
+
/* @__PURE__ */ jsx38("div", { className: "w-24 border border-[#E1EBF5]" })
|
|
3748
4134
|
] }),
|
|
3749
|
-
/* @__PURE__ */
|
|
3750
|
-
/* @__PURE__ */
|
|
3751
|
-
/* @__PURE__ */
|
|
4135
|
+
/* @__PURE__ */ jsxs26("div", { className: "mx-auto", children: [
|
|
4136
|
+
/* @__PURE__ */ jsx38("p", { className: "mb-2 text-body-xs text-primary font-semibold text-center", children: "Scan to Pay" }),
|
|
4137
|
+
/* @__PURE__ */ jsx38(IconQrCode, {})
|
|
3752
4138
|
] })
|
|
3753
4139
|
] }),
|
|
3754
|
-
/* @__PURE__ */
|
|
4140
|
+
/* @__PURE__ */ jsx38("div", { className: "flex flex-col gap-6", children: /* @__PURE__ */ jsx38(
|
|
3755
4141
|
BaseButton,
|
|
3756
4142
|
{
|
|
3757
4143
|
label: "I have made this payment",
|
|
@@ -3768,7 +4154,8 @@ var PayByStableCoin = ({
|
|
|
3768
4154
|
};
|
|
3769
4155
|
|
|
3770
4156
|
// src/buzapay-checkout/checkout-card.tsx
|
|
3771
|
-
import
|
|
4157
|
+
import toast, { Toaster } from "react-hot-toast";
|
|
4158
|
+
import { jsx as jsx39, jsxs as jsxs27 } from "react/jsx-runtime";
|
|
3772
4159
|
function BzpCheckoutCard({
|
|
3773
4160
|
secretKey,
|
|
3774
4161
|
environment = "sandbox",
|
|
@@ -3803,16 +4190,26 @@ function BzpCheckoutCard({
|
|
|
3803
4190
|
setSuccessObject({ ...event });
|
|
3804
4191
|
if (event.paymentStatus === "authorized") {
|
|
3805
4192
|
setCheckoutState("SUCCESS");
|
|
4193
|
+
toast.success("Payment authorization successful.", toastConfig);
|
|
4194
|
+
} else if (event.paymentStatus === "confirmed") {
|
|
4195
|
+
setCheckoutState("SUCCESS");
|
|
4196
|
+
toast.success("Payment confirmed.", toastConfig);
|
|
3806
4197
|
} else if (event.paymentStatus === "payment failed") {
|
|
3807
4198
|
setCheckoutState("PENDING");
|
|
4199
|
+
toast.error("Payment pending.", toastConfig);
|
|
3808
4200
|
} else if (event.paymentStatus === "used") {
|
|
3809
4201
|
setCheckoutState("USED");
|
|
3810
4202
|
} else {
|
|
3811
4203
|
setCheckoutState("PENDING");
|
|
4204
|
+
toast.error("Payment pending.", toastConfig);
|
|
3812
4205
|
}
|
|
3813
4206
|
onPaymentAuthorized?.(event);
|
|
3814
4207
|
};
|
|
3815
|
-
|
|
4208
|
+
const onErrorHandler = (error) => {
|
|
4209
|
+
toast.error(error.errorMessage ?? "Payment failed.", toastConfig);
|
|
4210
|
+
onError?.(error);
|
|
4211
|
+
};
|
|
4212
|
+
useEffect7(() => {
|
|
3816
4213
|
let options = [];
|
|
3817
4214
|
if (paymentObject.currency === "USD") {
|
|
3818
4215
|
if (paymentObject.amount < 50) {
|
|
@@ -3831,103 +4228,106 @@ function BzpCheckoutCard({
|
|
|
3831
4228
|
}
|
|
3832
4229
|
setFilteredPaymentTypeOptions(options);
|
|
3833
4230
|
}, [paymentObject.currency, paymentObject.amount]);
|
|
3834
|
-
|
|
4231
|
+
useEffect7(() => {
|
|
3835
4232
|
if (filteredPaymentTypeOptions.length) {
|
|
3836
4233
|
setPaymentType(filteredPaymentTypeOptions[0].value);
|
|
3837
4234
|
}
|
|
3838
4235
|
}, [filteredPaymentTypeOptions]);
|
|
3839
|
-
return /* @__PURE__ */
|
|
3840
|
-
|
|
3841
|
-
|
|
3842
|
-
/* @__PURE__ */
|
|
3843
|
-
|
|
4236
|
+
return /* @__PURE__ */ jsxs27(BaseCard, { children: [
|
|
4237
|
+
/* @__PURE__ */ jsx39(Toaster, {}),
|
|
4238
|
+
/* @__PURE__ */ jsxs27("div", { className: "grid grid-cols-3", children: [
|
|
4239
|
+
checkoutState === "PENDING" && /* @__PURE__ */ jsxs27("div", { className: "bg-[#EFF7FF] px-6 py-8 flex flex-col gap-5 col-span-1 rounded-l-xl", children: [
|
|
4240
|
+
/* @__PURE__ */ jsx39("p", { className: "text-heading-text text-body-xs font-semibold", children: "Pay with" }),
|
|
4241
|
+
/* @__PURE__ */ jsx39(
|
|
4242
|
+
BaseRadioGroup,
|
|
4243
|
+
{
|
|
4244
|
+
options: filteredPaymentTypeOptions,
|
|
4245
|
+
selectedChange: (e) => paymentTypeHandler(e)
|
|
4246
|
+
}
|
|
4247
|
+
)
|
|
4248
|
+
] }),
|
|
4249
|
+
/* @__PURE__ */ jsxs27(
|
|
4250
|
+
"div",
|
|
3844
4251
|
{
|
|
3845
|
-
|
|
3846
|
-
|
|
3847
|
-
|
|
3848
|
-
|
|
3849
|
-
|
|
3850
|
-
|
|
3851
|
-
|
|
3852
|
-
|
|
3853
|
-
|
|
3854
|
-
|
|
3855
|
-
|
|
3856
|
-
|
|
3857
|
-
|
|
4252
|
+
className: checkoutState === "SUCCESS" || checkoutState === "USED" && paymentType === "BANK_TRANSFER" ? "col-span-3" : "col-span-2",
|
|
4253
|
+
children: [
|
|
4254
|
+
checkoutState === "PENDING" && /* @__PURE__ */ jsxs27("div", { className: "flex items-center justify-between px-12 py-8", children: [
|
|
4255
|
+
paymentObject.logoUrl ? /* @__PURE__ */ jsx39(
|
|
4256
|
+
BaseImage,
|
|
4257
|
+
{
|
|
4258
|
+
src: paymentObject.logoUrl ?? "",
|
|
4259
|
+
alt: "Merchant Logo",
|
|
4260
|
+
width: 52,
|
|
4261
|
+
height: 52,
|
|
4262
|
+
customClass: "rounded-lg object-fit"
|
|
4263
|
+
}
|
|
4264
|
+
) : /* @__PURE__ */ jsx39(
|
|
4265
|
+
"div",
|
|
4266
|
+
{
|
|
4267
|
+
className: "bg-heading-text rounded flex flex-col justify-center",
|
|
4268
|
+
style: { width: "52px", height: "52px" },
|
|
4269
|
+
children: /* @__PURE__ */ jsx39("p", { className: "text-white text-center text-body-2xs font-medium", children: "Logo" })
|
|
4270
|
+
}
|
|
4271
|
+
),
|
|
4272
|
+
/* @__PURE__ */ jsxs27("div", { className: "flex flex-col gap-1", children: [
|
|
4273
|
+
/* @__PURE__ */ jsx39("p", { className: "text-body-2xs font-regular text-sub-copy text-right", children: paymentObject.merchantName }),
|
|
4274
|
+
/* @__PURE__ */ jsxs27("p", { className: "text-body-2xs font-regular text-sub-copy text-right", children: [
|
|
4275
|
+
"Pay:",
|
|
4276
|
+
" ",
|
|
4277
|
+
/* @__PURE__ */ jsx39("span", { className: "text-orange-500 font-extrabold", children: formatAmount(paymentObject.amount, paymentObject.currency) })
|
|
4278
|
+
] })
|
|
4279
|
+
] })
|
|
4280
|
+
] }),
|
|
4281
|
+
checkoutState === "PENDING" && /* @__PURE__ */ jsx39("div", { className: "max-h-[32rem] overflow-y-scroll px-10 pb-10 pt-2", children: paymentType === "CARD" ? /* @__PURE__ */ jsx39(
|
|
4282
|
+
PayByCard,
|
|
3858
4283
|
{
|
|
3859
|
-
|
|
3860
|
-
|
|
3861
|
-
|
|
3862
|
-
|
|
3863
|
-
|
|
4284
|
+
secretKey,
|
|
4285
|
+
environment,
|
|
4286
|
+
paymentObject,
|
|
4287
|
+
onPaymentAuthorized: setSuccess,
|
|
4288
|
+
onError: onErrorHandler
|
|
3864
4289
|
}
|
|
3865
|
-
) : /* @__PURE__ */
|
|
3866
|
-
|
|
4290
|
+
) : paymentType === "BANK_TRANSFER" ? /* @__PURE__ */ jsx39(
|
|
4291
|
+
PayByTransfer,
|
|
3867
4292
|
{
|
|
3868
|
-
|
|
3869
|
-
|
|
3870
|
-
|
|
4293
|
+
secretKey,
|
|
4294
|
+
environment,
|
|
4295
|
+
paymentObject,
|
|
4296
|
+
onPaymentAuthorized: setSuccess,
|
|
4297
|
+
onError: onErrorHandler
|
|
3871
4298
|
}
|
|
3872
|
-
)
|
|
3873
|
-
|
|
3874
|
-
|
|
3875
|
-
|
|
3876
|
-
|
|
3877
|
-
|
|
3878
|
-
|
|
3879
|
-
|
|
3880
|
-
|
|
3881
|
-
|
|
3882
|
-
|
|
3883
|
-
|
|
3884
|
-
|
|
3885
|
-
|
|
3886
|
-
|
|
3887
|
-
|
|
3888
|
-
|
|
3889
|
-
|
|
3890
|
-
|
|
3891
|
-
|
|
3892
|
-
|
|
3893
|
-
|
|
3894
|
-
|
|
3895
|
-
|
|
3896
|
-
paymentObject,
|
|
3897
|
-
onPaymentAuthorized: setSuccess,
|
|
3898
|
-
onError
|
|
3899
|
-
}
|
|
3900
|
-
) : /* @__PURE__ */ jsx38(
|
|
3901
|
-
PayByStableCoin,
|
|
3902
|
-
{
|
|
3903
|
-
secretKey,
|
|
3904
|
-
environment,
|
|
3905
|
-
paymentObject,
|
|
3906
|
-
onPaymentAuthorized: setSuccess,
|
|
3907
|
-
onError
|
|
3908
|
-
}
|
|
3909
|
-
) }),
|
|
3910
|
-
checkoutState === "SUCCESS" && /* @__PURE__ */ jsx38(
|
|
3911
|
-
BaseSuccess,
|
|
3912
|
-
{
|
|
3913
|
-
amount: paymentObject.amount,
|
|
3914
|
-
currency: paymentObject.currency,
|
|
3915
|
-
redirectUrl: paymentObject.redirectUrl ?? "",
|
|
3916
|
-
successObject
|
|
3917
|
-
}
|
|
3918
|
-
)
|
|
3919
|
-
]
|
|
3920
|
-
}
|
|
3921
|
-
)
|
|
3922
|
-
] }) });
|
|
4299
|
+
) : /* @__PURE__ */ jsx39(
|
|
4300
|
+
PayByStableCoin,
|
|
4301
|
+
{
|
|
4302
|
+
secretKey,
|
|
4303
|
+
environment,
|
|
4304
|
+
paymentObject,
|
|
4305
|
+
onPaymentAuthorized: setSuccess,
|
|
4306
|
+
onError: onErrorHandler
|
|
4307
|
+
}
|
|
4308
|
+
) }),
|
|
4309
|
+
checkoutState === "SUCCESS" || checkoutState === "USED" && paymentType === "BANK_TRANSFER" && /* @__PURE__ */ jsx39(
|
|
4310
|
+
BaseSuccess,
|
|
4311
|
+
{
|
|
4312
|
+
amount: paymentObject.amount,
|
|
4313
|
+
currency: paymentObject.currency,
|
|
4314
|
+
redirectUrl: paymentObject.redirectUrl ?? "",
|
|
4315
|
+
successObject
|
|
4316
|
+
}
|
|
4317
|
+
)
|
|
4318
|
+
]
|
|
4319
|
+
}
|
|
4320
|
+
)
|
|
4321
|
+
] })
|
|
4322
|
+
] });
|
|
3923
4323
|
}
|
|
3924
4324
|
|
|
3925
4325
|
// src/miden-checkout/checkout-button.tsx
|
|
3926
4326
|
import { useState as useState9 } from "react";
|
|
3927
4327
|
|
|
3928
4328
|
// src/miden-checkout/checkout-iframe.tsx
|
|
3929
|
-
import { useCallback as useCallback4, useEffect as
|
|
3930
|
-
import { jsx as
|
|
4329
|
+
import { useCallback as useCallback4, useEffect as useEffect8, useRef as useRef3, useState as useState8 } from "react";
|
|
4330
|
+
import { jsx as jsx40, jsxs as jsxs28 } from "react/jsx-runtime";
|
|
3931
4331
|
function MidenCheckoutIframe({
|
|
3932
4332
|
style = {
|
|
3933
4333
|
width: "100%",
|
|
@@ -4011,18 +4411,18 @@ function MidenCheckoutIframe({
|
|
|
4011
4411
|
setLoading(false);
|
|
4012
4412
|
}
|
|
4013
4413
|
};
|
|
4014
|
-
|
|
4414
|
+
useEffect8(() => {
|
|
4015
4415
|
if (!containerRef.current) return;
|
|
4016
4416
|
generatePaymentLinkHandler();
|
|
4017
4417
|
}, []);
|
|
4018
|
-
return /* @__PURE__ */
|
|
4019
|
-
/* @__PURE__ */
|
|
4020
|
-
loading && /* @__PURE__ */
|
|
4418
|
+
return /* @__PURE__ */ jsxs28("div", { className: "relative", style, children: [
|
|
4419
|
+
/* @__PURE__ */ jsx40("div", { ref: containerRef, className: "w-full h-full" }),
|
|
4420
|
+
loading && /* @__PURE__ */ jsx40("div", { className: "absolute inset-0 grid place-items-center bg-white/60", children: /* @__PURE__ */ jsx40(IconLoader, {}) })
|
|
4021
4421
|
] });
|
|
4022
4422
|
}
|
|
4023
4423
|
|
|
4024
4424
|
// src/miden-checkout/checkout-button.tsx
|
|
4025
|
-
import { jsx as
|
|
4425
|
+
import { jsx as jsx41, jsxs as jsxs29 } from "react/jsx-runtime";
|
|
4026
4426
|
function MidenCheckoutButton({
|
|
4027
4427
|
secretKey,
|
|
4028
4428
|
environment = "sandbox",
|
|
@@ -4079,15 +4479,15 @@ function MidenCheckoutButton({
|
|
|
4079
4479
|
setLoading(false);
|
|
4080
4480
|
}
|
|
4081
4481
|
};
|
|
4082
|
-
return urlLaunchUrl && mode === "iframe" ? /* @__PURE__ */
|
|
4482
|
+
return urlLaunchUrl && mode === "iframe" ? /* @__PURE__ */ jsx41(
|
|
4083
4483
|
MidenCheckoutIframe,
|
|
4084
4484
|
{
|
|
4085
4485
|
url: urlLaunchUrl,
|
|
4086
4486
|
secretKey,
|
|
4087
4487
|
environment
|
|
4088
4488
|
}
|
|
4089
|
-
) : /* @__PURE__ */
|
|
4090
|
-
/* @__PURE__ */
|
|
4489
|
+
) : /* @__PURE__ */ jsxs29("div", { children: [
|
|
4490
|
+
/* @__PURE__ */ jsx41(
|
|
4091
4491
|
BaseButton,
|
|
4092
4492
|
{
|
|
4093
4493
|
label: "Pay",
|
|
@@ -4098,13 +4498,14 @@ function MidenCheckoutButton({
|
|
|
4098
4498
|
onClick: generatePaymentLinkHandler
|
|
4099
4499
|
}
|
|
4100
4500
|
),
|
|
4101
|
-
/* @__PURE__ */
|
|
4501
|
+
/* @__PURE__ */ jsx41(BaseInputError, { errorMessage: message })
|
|
4102
4502
|
] });
|
|
4103
4503
|
}
|
|
4104
4504
|
|
|
4105
4505
|
// src/miden-checkout/checkout-card.tsx
|
|
4106
|
-
import { useEffect as
|
|
4107
|
-
import {
|
|
4506
|
+
import { useEffect as useEffect9, useState as useState10 } from "react";
|
|
4507
|
+
import toast2, { Toaster as Toaster2 } from "react-hot-toast";
|
|
4508
|
+
import { jsx as jsx42, jsxs as jsxs30 } from "react/jsx-runtime";
|
|
4108
4509
|
function MidenCheckoutCard({
|
|
4109
4510
|
secretKey,
|
|
4110
4511
|
options,
|
|
@@ -4140,22 +4541,32 @@ function MidenCheckoutCard({
|
|
|
4140
4541
|
setSuccessObject({ ...event });
|
|
4141
4542
|
if (event.paymentStatus === "authorized") {
|
|
4142
4543
|
setCheckoutState("SUCCESS");
|
|
4544
|
+
toast2.success("Payment authorization successful.", toastConfig);
|
|
4545
|
+
} else if (event.paymentStatus === "confirmed") {
|
|
4546
|
+
setCheckoutState("SUCCESS");
|
|
4547
|
+
toast2.success("Payment confirmed.", toastConfig);
|
|
4143
4548
|
} else if (event.paymentStatus === "payment failed") {
|
|
4144
4549
|
setCheckoutState("PENDING");
|
|
4550
|
+
toast2.error("Payment pending.", toastConfig);
|
|
4145
4551
|
} else if (event.paymentStatus === "used") {
|
|
4146
4552
|
setCheckoutState("USED");
|
|
4147
4553
|
} else {
|
|
4148
4554
|
setCheckoutState("PENDING");
|
|
4555
|
+
toast2.error("Payment pending.", toastConfig);
|
|
4149
4556
|
}
|
|
4150
4557
|
onPaymentAuthorized?.(event);
|
|
4151
4558
|
};
|
|
4559
|
+
const onErrorHandler = (error) => {
|
|
4560
|
+
toast2.error(error.errorMessage ?? "Payment failed.", toastConfig);
|
|
4561
|
+
onError?.(error);
|
|
4562
|
+
};
|
|
4152
4563
|
const formatAmountHandler = () => {
|
|
4153
4564
|
return formatAmount(paymentObject.amount, paymentObject.currency);
|
|
4154
4565
|
};
|
|
4155
4566
|
const formatChargeHandler = () => {
|
|
4156
4567
|
return formatAmount(0, paymentObject.currency);
|
|
4157
4568
|
};
|
|
4158
|
-
|
|
4569
|
+
useEffect9(() => {
|
|
4159
4570
|
let options2 = [];
|
|
4160
4571
|
if (paymentObject.currency === "USD") {
|
|
4161
4572
|
if (paymentObject.amount < 50) {
|
|
@@ -4174,89 +4585,92 @@ function MidenCheckoutCard({
|
|
|
4174
4585
|
}
|
|
4175
4586
|
setFilteredPaymentTypeOptions(options2);
|
|
4176
4587
|
}, [paymentObject.currency, paymentObject.amount]);
|
|
4177
|
-
|
|
4588
|
+
useEffect9(() => {
|
|
4178
4589
|
if (filteredPaymentTypeOptions.length) {
|
|
4179
4590
|
setPaymentType(filteredPaymentTypeOptions[0].value);
|
|
4180
4591
|
}
|
|
4181
4592
|
}, [filteredPaymentTypeOptions]);
|
|
4182
|
-
return /* @__PURE__ */
|
|
4183
|
-
|
|
4184
|
-
|
|
4185
|
-
/* @__PURE__ */
|
|
4186
|
-
|
|
4593
|
+
return /* @__PURE__ */ jsxs30(BaseCard, { caller: "miden", children: [
|
|
4594
|
+
/* @__PURE__ */ jsx42(Toaster2, {}),
|
|
4595
|
+
/* @__PURE__ */ jsxs30("div", { className: "grid grid-cols-3", children: [
|
|
4596
|
+
checkoutState === "PENDING" && /* @__PURE__ */ jsxs30("div", { className: "bg-[#0A0032] py-6 flex flex-col gap-5 col-span-1 rounded-l-xl", children: [
|
|
4597
|
+
/* @__PURE__ */ jsx42("p", { className: "text-white text-body-xs font-semibold px-6", children: "Pay with" }),
|
|
4598
|
+
/* @__PURE__ */ jsx42(
|
|
4599
|
+
BaseRadioGroup,
|
|
4600
|
+
{
|
|
4601
|
+
caller: "miden",
|
|
4602
|
+
options: filteredPaymentTypeOptions,
|
|
4603
|
+
selectedChange: (e) => paymentTypeHandler(e)
|
|
4604
|
+
}
|
|
4605
|
+
)
|
|
4606
|
+
] }),
|
|
4607
|
+
/* @__PURE__ */ jsxs30(
|
|
4608
|
+
"div",
|
|
4187
4609
|
{
|
|
4188
|
-
|
|
4189
|
-
|
|
4190
|
-
|
|
4191
|
-
|
|
4192
|
-
|
|
4193
|
-
|
|
4194
|
-
|
|
4195
|
-
|
|
4196
|
-
|
|
4197
|
-
|
|
4198
|
-
|
|
4199
|
-
|
|
4200
|
-
|
|
4201
|
-
|
|
4202
|
-
|
|
4203
|
-
|
|
4204
|
-
|
|
4205
|
-
/* @__PURE__ */
|
|
4206
|
-
|
|
4610
|
+
className: checkoutState === "SUCCESS" ? "col-span-3" : "col-span-2",
|
|
4611
|
+
children: [
|
|
4612
|
+
checkoutState === "PENDING" && /* @__PURE__ */ jsxs30("div", { className: "flex items-center justify-between p-6", children: [
|
|
4613
|
+
/* @__PURE__ */ jsx42(IconMidenLogo, {}),
|
|
4614
|
+
/* @__PURE__ */ jsx42(IconClose, { color: "black", className: "cursor-pointer" })
|
|
4615
|
+
] }),
|
|
4616
|
+
checkoutState === "PENDING" && /* @__PURE__ */ jsxs30("div", { className: "px-14 pt-4 pb-8 flex flex-col gap-6 max-h-[32rem] overflow-y-scroll", children: [
|
|
4617
|
+
/* @__PURE__ */ jsxs30("div", { className: "flex items-center justify-between py-3 px-4 bg-[#F8FDFF] border border-[#DAE4E8] rounded-lg", children: [
|
|
4618
|
+
/* @__PURE__ */ jsx42(
|
|
4619
|
+
BaseLabelInfo,
|
|
4620
|
+
{
|
|
4621
|
+
label: "Amount Due",
|
|
4622
|
+
value: formatAmountHandler()
|
|
4623
|
+
}
|
|
4624
|
+
),
|
|
4625
|
+
/* @__PURE__ */ jsx42(BaseLabelInfo, { label: "Charges", value: formatChargeHandler() })
|
|
4626
|
+
] }),
|
|
4627
|
+
/* @__PURE__ */ jsx42("div", { children: paymentType === "CARD" ? /* @__PURE__ */ jsx42(
|
|
4628
|
+
PayByCard,
|
|
4207
4629
|
{
|
|
4208
|
-
|
|
4209
|
-
|
|
4630
|
+
secretKey,
|
|
4631
|
+
environment,
|
|
4632
|
+
caller: "miden",
|
|
4633
|
+
paymentObject,
|
|
4634
|
+
onPaymentAuthorized: setSuccess,
|
|
4635
|
+
onError: onErrorHandler
|
|
4210
4636
|
}
|
|
4211
|
-
)
|
|
4212
|
-
|
|
4637
|
+
) : paymentType === "BANK_TRANSFER" ? /* @__PURE__ */ jsx42(
|
|
4638
|
+
PayByTransfer,
|
|
4639
|
+
{
|
|
4640
|
+
secretKey,
|
|
4641
|
+
environment,
|
|
4642
|
+
caller: "miden",
|
|
4643
|
+
paymentObject,
|
|
4644
|
+
onPaymentAuthorized: setSuccess,
|
|
4645
|
+
onError: onErrorHandler
|
|
4646
|
+
}
|
|
4647
|
+
) : /* @__PURE__ */ jsx42(
|
|
4648
|
+
PayByStableCoin,
|
|
4649
|
+
{
|
|
4650
|
+
secretKey,
|
|
4651
|
+
environment,
|
|
4652
|
+
caller: "miden",
|
|
4653
|
+
paymentObject,
|
|
4654
|
+
onPaymentAuthorized: setSuccess,
|
|
4655
|
+
onError: onErrorHandler
|
|
4656
|
+
}
|
|
4657
|
+
) })
|
|
4213
4658
|
] }),
|
|
4214
|
-
|
|
4215
|
-
|
|
4216
|
-
{
|
|
4217
|
-
secretKey,
|
|
4218
|
-
environment,
|
|
4219
|
-
caller: "miden",
|
|
4220
|
-
paymentObject,
|
|
4221
|
-
onPaymentAuthorized: setSuccess,
|
|
4222
|
-
onError
|
|
4223
|
-
}
|
|
4224
|
-
) : paymentType === "BANK_TRANSFER" ? /* @__PURE__ */ jsx41(
|
|
4225
|
-
PayByTransfer,
|
|
4659
|
+
checkoutState === "SUCCESS" && /* @__PURE__ */ jsx42(
|
|
4660
|
+
BaseSuccess,
|
|
4226
4661
|
{
|
|
4227
|
-
|
|
4228
|
-
|
|
4662
|
+
amount: paymentObject.amount,
|
|
4663
|
+
currency: paymentObject.currency,
|
|
4229
4664
|
caller: "miden",
|
|
4230
|
-
paymentObject,
|
|
4231
|
-
|
|
4232
|
-
onError
|
|
4665
|
+
redirectUrl: paymentObject.redirectUrl ?? "",
|
|
4666
|
+
successObject
|
|
4233
4667
|
}
|
|
4234
|
-
)
|
|
4235
|
-
|
|
4236
|
-
|
|
4237
|
-
|
|
4238
|
-
|
|
4239
|
-
|
|
4240
|
-
paymentObject,
|
|
4241
|
-
onPaymentAuthorized: setSuccess,
|
|
4242
|
-
onError
|
|
4243
|
-
}
|
|
4244
|
-
) })
|
|
4245
|
-
] }),
|
|
4246
|
-
checkoutState === "SUCCESS" && /* @__PURE__ */ jsx41(
|
|
4247
|
-
BaseSuccess,
|
|
4248
|
-
{
|
|
4249
|
-
amount: paymentObject.amount,
|
|
4250
|
-
currency: paymentObject.currency,
|
|
4251
|
-
caller: "miden",
|
|
4252
|
-
redirectUrl: paymentObject.redirectUrl ?? "",
|
|
4253
|
-
successObject
|
|
4254
|
-
}
|
|
4255
|
-
)
|
|
4256
|
-
]
|
|
4257
|
-
}
|
|
4258
|
-
)
|
|
4259
|
-
] }) });
|
|
4668
|
+
)
|
|
4669
|
+
]
|
|
4670
|
+
}
|
|
4671
|
+
)
|
|
4672
|
+
] })
|
|
4673
|
+
] });
|
|
4260
4674
|
}
|
|
4261
4675
|
export {
|
|
4262
4676
|
BzpCheckoutButton,
|