@miden-npm/react 2.0.3 → 2.0.4

package/dist/index.js

@@ -99,6 +99,10 @@ function buildDeviceInformation(partial) {
     ...partial
   };
 }
+var toastConfig = {
+  position: "top-right",
+  style: { fontSize: "12px" }
+};
 
 // src/utils/api.util.ts
 var getBaseUrl = (mode, caller) => {
@@ -123,7 +127,7 @@ var currencySign = (currency) => {
 var formatAmount = (value, currency) => {
   const num = typeof value === "string" ? parseFloat(value) : value;
   if (isNaN(num)) return "0";
-  return `${currency ? currencySign(currency) : ""} ${num?.toLocaleString(
+  return `${currency ? currencySign(currency) : ""}${num?.toLocaleString(
     "en-US"
   )}`;
 };
@@ -156,6 +160,254 @@ var restrictToNumericKeys = (event) => {
     event.preventDefault();
   }
 };
+var COUNTRIES = [
+  { name: "Afghanistan", code: "AF", phoneCode: "+93", flag: "\u{1F1E6}\u{1F1EB}" },
+  { name: "Albania", code: "AL", phoneCode: "+355", flag: "\u{1F1E6}\u{1F1F1}" },
+  { name: "Algeria", code: "DZ", phoneCode: "+213", flag: "\u{1F1E9}\u{1F1FF}" },
+  { name: "American Samoa", code: "AS", phoneCode: "+1", flag: "\u{1F1E6}\u{1F1F8}" },
+  { name: "Andorra", code: "AD", phoneCode: "+376", flag: "\u{1F1E6}\u{1F1E9}" },
+  { name: "Angola", code: "AO", phoneCode: "+244", flag: "\u{1F1E6}\u{1F1F4}" },
+  { name: "Anguilla", code: "AI", phoneCode: "+1", flag: "\u{1F1E6}\u{1F1EE}" },
+  { name: "Antarctica", code: "AQ", phoneCode: "+672", flag: "\u{1F1E6}\u{1F1F6}" },
+  { name: "Antigua and Barbuda", code: "AG", phoneCode: "+1", flag: "\u{1F1E6}\u{1F1EC}" },
+  { name: "Argentina", code: "AR", phoneCode: "+54", flag: "\u{1F1E6}\u{1F1F7}" },
+  { name: "Armenia", code: "AM", phoneCode: "+374", flag: "\u{1F1E6}\u{1F1F2}" },
+  { name: "Aruba", code: "AW", phoneCode: "+297", flag: "\u{1F1E6}\u{1F1FC}" },
+  { name: "Australia", code: "AU", phoneCode: "+61", flag: "\u{1F1E6}\u{1F1FA}" },
+  { name: "Austria", code: "AT", phoneCode: "+43", flag: "\u{1F1E6}\u{1F1F9}" },
+  { name: "Azerbaijan", code: "AZ", phoneCode: "+994", flag: "\u{1F1E6}\u{1F1FF}" },
+  { name: "Bahamas", code: "BS", phoneCode: "+1", flag: "\u{1F1E7}\u{1F1F8}" },
+  { name: "Bahrain", code: "BH", phoneCode: "+973", flag: "\u{1F1E7}\u{1F1ED}" },
+  { name: "Bangladesh", code: "BD", phoneCode: "+880", flag: "\u{1F1E7}\u{1F1E9}" },
+  { name: "Barbados", code: "BB", phoneCode: "+1", flag: "\u{1F1E7}\u{1F1E7}" },
+  { name: "Belarus", code: "BY", phoneCode: "+375", flag: "\u{1F1E7}\u{1F1FE}" },
+  { name: "Belgium", code: "BE", phoneCode: "+32", flag: "\u{1F1E7}\u{1F1EA}" },
+  { name: "Belize", code: "BZ", phoneCode: "+501", flag: "\u{1F1E7}\u{1F1FF}" },
+  { name: "Benin", code: "BJ", phoneCode: "+229", flag: "\u{1F1E7}\u{1F1EF}" },
+  { name: "Bermuda", code: "BM", phoneCode: "+1", flag: "\u{1F1E7}\u{1F1F2}" },
+  { name: "Bhutan", code: "BT", phoneCode: "+975", flag: "\u{1F1E7}\u{1F1F9}" },
+  { name: "Bolivia", code: "BO", phoneCode: "+591", flag: "\u{1F1E7}\u{1F1F4}" },
+  { name: "Bosnia and Herzegovina", code: "BA", phoneCode: "+387", flag: "\u{1F1E7}\u{1F1E6}" },
+  { name: "Botswana", code: "BW", phoneCode: "+267", flag: "\u{1F1E7}\u{1F1FC}" },
+  { name: "Bouvet Island", code: "BV", phoneCode: "+47", flag: "\u{1F1E7}\u{1F1FB}" },
+  { name: "Brazil", code: "BR", phoneCode: "+55", flag: "\u{1F1E7}\u{1F1F7}" },
+  { name: "British Indian Ocean Territory", code: "IO", phoneCode: "+246", flag: "\u{1F1EE}\u{1F1F4}" },
+  { name: "Brunei Darussalam", code: "BN", phoneCode: "+673", flag: "\u{1F1E7}\u{1F1F3}" },
+  { name: "Bulgaria", code: "BG", phoneCode: "+359", flag: "\u{1F1E7}\u{1F1EC}" },
+  { name: "Burkina Faso", code: "BF", phoneCode: "+226", flag: "\u{1F1E7}\u{1F1EB}" },
+  { name: "Burundi", code: "BI", phoneCode: "+257", flag: "\u{1F1E7}\u{1F1EE}" },
+  { name: "Cambodia", code: "KH", phoneCode: "+855", flag: "\u{1F1F0}\u{1F1ED}" },
+  { name: "Cameroon", code: "CM", phoneCode: "+237", flag: "\u{1F1E8}\u{1F1F2}" },
+  { name: "Canada", code: "CA", phoneCode: "+1", flag: "\u{1F1E8}\u{1F1E6}" },
+  { name: "Cape Verde", code: "CV", phoneCode: "+238", flag: "\u{1F1E8}\u{1F1FB}" },
+  { name: "Cayman Islands", code: "KY", phoneCode: "+1", flag: "\u{1F1F0}\u{1F1FE}" },
+  { name: "Central African Republic", code: "CF", phoneCode: "+236", flag: "\u{1F1E8}\u{1F1EB}" },
+  { name: "Chad", code: "TD", phoneCode: "+235", flag: "\u{1F1F9}\u{1F1E9}" },
+  { name: "Chile", code: "CL", phoneCode: "+56", flag: "\u{1F1E8}\u{1F1F1}" },
+  { name: "China", code: "CN", phoneCode: "+86", flag: "\u{1F1E8}\u{1F1F3}" },
+  { name: "Christmas Island", code: "CX", phoneCode: "+61", flag: "\u{1F1E8}\u{1F1FD}" },
+  { name: "Cocos (Keeling) Islands", code: "CC", phoneCode: "+61", flag: "\u{1F1E8}\u{1F1E8}" },
+  { name: "Colombia", code: "CO", phoneCode: "+57", flag: "\u{1F1E8}\u{1F1F4}" },
+  { name: "Comoros", code: "KM", phoneCode: "+269", flag: "\u{1F1F0}\u{1F1F2}" },
+  { name: "Congo", code: "CG", phoneCode: "+242", flag: "\u{1F1E8}\u{1F1EC}" },
+  { name: "Congo, Democratic Republic of the", code: "CD", phoneCode: "+243", flag: "\u{1F1E8}\u{1F1E9}" },
+  { name: "Cook Islands", code: "CK", phoneCode: "+682", flag: "\u{1F1E8}\u{1F1F0}" },
+  { name: "Costa Rica", code: "CR", phoneCode: "+506", flag: "\u{1F1E8}\u{1F1F7}" },
+  { name: "C\xF4te d'Ivoire", code: "CI", phoneCode: "+225", flag: "\u{1F1E8}\u{1F1EE}" },
+  { name: "Croatia", code: "HR", phoneCode: "+385", flag: "\u{1F1ED}\u{1F1F7}" },
+  { name: "Cuba", code: "CU", phoneCode: "+53", flag: "\u{1F1E8}\u{1F1FA}" },
+  { name: "Cyprus", code: "CY", phoneCode: "+357", flag: "\u{1F1E8}\u{1F1FE}" },
+  { name: "Czech Republic", code: "CZ", phoneCode: "+420", flag: "\u{1F1E8}\u{1F1FF}" },
+  { name: "Denmark", code: "DK", phoneCode: "+45", flag: "\u{1F1E9}\u{1F1F0}" },
+  { name: "Djibouti", code: "DJ", phoneCode: "+253", flag: "\u{1F1E9}\u{1F1EF}" },
+  { name: "Dominica", code: "DM", phoneCode: "+1", flag: "\u{1F1E9}\u{1F1F2}" },
+  { name: "Dominican Republic", code: "DO", phoneCode: "+1", flag: "\u{1F1E9}\u{1F1F4}" },
+  { name: "Ecuador", code: "EC", phoneCode: "+593", flag: "\u{1F1EA}\u{1F1E8}" },
+  { name: "Egypt", code: "EG", phoneCode: "+20", flag: "\u{1F1EA}\u{1F1EC}" },
+  { name: "El Salvador", code: "SV", phoneCode: "+503", flag: "\u{1F1F8}\u{1F1FB}" },
+  { name: "Equatorial Guinea", code: "GQ", phoneCode: "+240", flag: "\u{1F1EC}\u{1F1F6}" },
+  { name: "Eritrea", code: "ER", phoneCode: "+291", flag: "\u{1F1EA}\u{1F1F7}" },
+  { name: "Estonia", code: "EE", phoneCode: "+372", flag: "\u{1F1EA}\u{1F1EA}" },
+  { name: "Ethiopia", code: "ET", phoneCode: "+251", flag: "\u{1F1EA}\u{1F1F9}" },
+  { name: "Falkland Islands (Malvinas)", code: "FK", phoneCode: "+500", flag: "\u{1F1EB}\u{1F1F0}" },
+  { name: "Faroe Islands", code: "FO", phoneCode: "+298", flag: "\u{1F1EB}\u{1F1F4}" },
+  { name: "Fiji", code: "FJ", phoneCode: "+679", flag: "\u{1F1EB}\u{1F1EF}" },
+  { name: "Finland", code: "FI", phoneCode: "+358", flag: "\u{1F1EB}\u{1F1EE}" },
+  { name: "France", code: "FR", phoneCode: "+33", flag: "\u{1F1EB}\u{1F1F7}" },
+  { name: "French Guiana", code: "GF", phoneCode: "+594", flag: "\u{1F1EC}\u{1F1EB}" },
+  { name: "French Polynesia", code: "PF", phoneCode: "+689", flag: "\u{1F1F5}\u{1F1EB}" },
+  { name: "French Southern Territories", code: "TF", phoneCode: "+262", flag: "\u{1F1F9}\u{1F1EB}" },
+  { name: "Gabon", code: "GA", phoneCode: "+240", flag: "\u{1F1EC}\u{1F1E6}" },
+  { name: "Gambia", code: "GM", phoneCode: "+220", flag: "\u{1F1EC}\u{1F1F2}" },
+  { name: "Georgia", code: "GE", phoneCode: "+995", flag: "\u{1F1EC}\u{1F1EA}" },
+  { name: "Germany", code: "DE", phoneCode: "+49", flag: "\u{1F1E9}\u{1F1EA}" },
+  { name: "Ghana", code: "GH", phoneCode: "+233", flag: "\u{1F1EC}\u{1F1ED}" },
+  { name: "Gibraltar", code: "GI", phoneCode: "+350", flag: "\u{1F1EC}\u{1F1EE}" },
+  { name: "Greece", code: "GR", phoneCode: "+30", flag: "\u{1F1EC}\u{1F1F7}" },
+  { name: "Greenland", code: "GL", phoneCode: "+299", flag: "\u{1F1EC}\u{1F1F1}" },
+  { name: "Grenada", code: "GD", phoneCode: "+1", flag: "\u{1F1EC}\u{1F1E9}" },
+  { name: "Guadeloupe", code: "GP", phoneCode: "+590", flag: "\u{1F1EC}\u{1F1F5}" },
+  { name: "Guam", code: "GU", phoneCode: "+1", flag: "\u{1F1EC}\u{1F1FA}" },
+  { name: "Guatemala", code: "GT", phoneCode: "+502", flag: "\u{1F1EC}\u{1F1F9}" },
+  { name: "Guernsey", code: "GG", phoneCode: "+44", flag: "\u{1F1EC}\u{1F1EC}" },
+  { name: "Guinea", code: "GN", phoneCode: "+224", flag: "\u{1F1EC}\u{1F1F3}" },
+  { name: "Guinea-Bissau", code: "GW", phoneCode: "+245", flag: "\u{1F1EC}\u{1F1FC}" },
+  { name: "Guyana", code: "GY", phoneCode: "+592", flag: "\u{1F1EC}\u{1F1FE}" },
+  { name: "Haiti", code: "HT", phoneCode: "+509", flag: "\u{1F1ED}\u{1F1F9}" },
+  { name: "Heard Island and McDonald Islands", code: "HM", phoneCode: "+672", flag: "\u{1F1ED}\u{1F1F2}" },
+  { name: "Holy See (Vatican City State)", code: "VA", phoneCode: "+39", flag: "\u{1F1FB}\u{1F1E6}" },
+  { name: "Honduras", code: "HN", phoneCode: "+504", flag: "\u{1F1ED}\u{1F1F3}" },
+  { name: "Hong Kong", code: "HK", phoneCode: "+852", flag: "\u{1F1ED}\u{1F1F0}" },
+  { name: "Hungary", code: "HU", phoneCode: "+36", flag: "\u{1F1ED}\u{1F1FA}" },
+  { name: "Iceland", code: "IS", phoneCode: "+354", flag: "\u{1F1EE}\u{1F1F8}" },
+  { name: "India", code: "IN", phoneCode: "+91", flag: "\u{1F1EE}\u{1F1F3}" },
+  { name: "Indonesia", code: "ID", phoneCode: "+62", flag: "\u{1F1EE}\u{1F1E9}" },
+  { name: "Iran, Islamic Republic of", code: "IR", phoneCode: "+98", flag: "\u{1F1EE}\u{1F1F7}" },
+  { name: "Iraq", code: "IQ", phoneCode: "+964", flag: "\u{1F1EE}\u{1F1F6}" },
+  { name: "Ireland", code: "IE", phoneCode: "+353", flag: "\u{1F1EE}\u{1F1EA}" },
+  { name: "Isle of Man", code: "IM", phoneCode: "+44", flag: "\u{1F1EE}\u{1F1F2}" },
+  { name: "Israel", code: "IL", phoneCode: "+972", flag: "\u{1F1EE}\u{1F1F1}" },
+  { name: "Italy", code: "IT", phoneCode: "+39", flag: "\u{1F1EE}\u{1F1F9}" },
+  { name: "Jamaica", code: "JM", phoneCode: "+1", flag: "\u{1F1EF}\u{1F1F2}" },
+  { name: "Japan", code: "JP", phoneCode: "+81", flag: "\u{1F1EF}\u{1F1F5}" },
+  { name: "Jersey", code: "JE", phoneCode: "+44", flag: "\u{1F1EF}\u{1F1EA}" },
+  { name: "Jordan", code: "JO", phoneCode: "+962", flag: "\u{1F1EF}\u{1F1F4}" },
+  { name: "Kazakhstan", code: "KZ", phoneCode: "+7", flag: "\u{1F1F0}\u{1F1FF}" },
+  { name: "Kenya", code: "KE", phoneCode: "+254", flag: "\u{1F1F0}\u{1F1EA}" },
+  { name: "Kiribati", code: "KI", phoneCode: "+686", flag: "\u{1F1F0}\u{1F1EE}" },
+  { name: "Korea, Democratic People's Republic of", code: "KP", phoneCode: "+850", flag: "\u{1F1F0}\u{1F1F5}" },
+  { name: "Korea, Republic of", code: "KR", phoneCode: "+82", flag: "\u{1F1F0}\u{1F1F7}" },
+  { name: "Kuwait", code: "KW", phoneCode: "+965", flag: "\u{1F1F0}\u{1F1FC}" },
+  { name: "Kyrgyzstan", code: "KG", phoneCode: "+996", flag: "\u{1F1F0}\u{1F1EC}" },
+  { name: "Lao People's Democratic Republic", code: "LA", phoneCode: "+856", flag: "\u{1F1F1}\u{1F1E6}" },
+  { name: "Latvia", code: "LV", phoneCode: "+371", flag: "\u{1F1F1}\u{1F1FB}" },
+  { name: "Lebanon", code: "LB", phoneCode: "+961", flag: "\u{1F1F1}\u{1F1E7}" },
+  { name: "Lesotho", code: "LS", phoneCode: "+266", flag: "\u{1F1F1}\u{1F1F8}" },
+  { name: "Liberia", code: "LR", phoneCode: "+231", flag: "\u{1F1F1}\u{1F1F7}" },
+  { name: "Libya", code: "LY", phoneCode: "+218", flag: "\u{1F1F1}\u{1F1FE}" },
+  { name: "Liechtenstein", code: "LI", phoneCode: "+423", flag: "\u{1F1F1}\u{1F1EE}" },
+  { name: "Lithuania", code: "LT", phoneCode: "+370", flag: "\u{1F1F1}\u{1F1F9}" },
+  { name: "Luxembourg", code: "LU", phoneCode: "+352", flag: "\u{1F1F1}\u{1F1FA}" },
+  { name: "Macao", code: "MO", phoneCode: "+853", flag: "\u{1F1F2}\u{1F1F4}" },
+  { name: "Macedonia, the former Yugoslav Republic of", code: "MK", phoneCode: "+389", flag: "\u{1F1F2}\u{1F1F0}" },
+  { name: "Madagascar", code: "MG", phoneCode: "+261", flag: "\u{1F1F2}\u{1F1EC}" },
+  { name: "Malawi", code: "MW", phoneCode: "+265", flag: "\u{1F1F2}\u{1F1FC}" },
+  { name: "Malaysia", code: "MY", phoneCode: "+60", flag: "\u{1F1F2}\u{1F1FE}" },
+  { name: "Maldives", code: "MV", phoneCode: "+960", flag: "\u{1F1F2}\u{1F1FB}" },
+  { name: "Mali", code: "ML", phoneCode: "+223", flag: "\u{1F1F2}\u{1F1F1}" },
+  { name: "Malta", code: "MT", phoneCode: "+356", flag: "\u{1F1F2}\u{1F1F9}" },
+  { name: "Marshall Islands", code: "MH", phoneCode: "+692", flag: "\u{1F1F2}\u{1F1ED}" },
+  { name: "Martinique", code: "MQ", phoneCode: "+596", flag: "\u{1F1F2}\u{1F1F6}" },
+  { name: "Mauritania", code: "MR", phoneCode: "+222", flag: "\u{1F1F2}\u{1F1F7}" },
+  { name: "Mauritius", code: "MU", phoneCode: "+230", flag: "\u{1F1F2}\u{1F1FA}" },
+  { name: "Mayotte", code: "YT", phoneCode: "+262", flag: "\u{1F1FE}\u{1F1F9}" },
+  { name: "Mexico", code: "MX", phoneCode: "+52", flag: "\u{1F1F2}\u{1F1FD}" },
+  { name: "Micronesia, Federated States of", code: "FM", phoneCode: "+691", flag: "\u{1F1EB}\u{1F1F2}" },
+  { name: "Moldova, Republic of", code: "MD", phoneCode: "+373", flag: "\u{1F1F2}\u{1F1E9}" },
+  { name: "Monaco", code: "MC", phoneCode: "+377", flag: "\u{1F1F2}\u{1F1E8}" },
+  { name: "Mongolia", code: "MN", phoneCode: "+976", flag: "\u{1F1F2}\u{1F1F3}" },
+  { name: "Montenegro", code: "ME", phoneCode: "+382", flag: "\u{1F1F2}\u{1F1EA}" },
+  { name: "Montserrat", code: "MS", phoneCode: "+1", flag: "\u{1F1F2}\u{1F1F8}" },
+  { name: "Morocco", code: "MA", phoneCode: "+212", flag: "\u{1F1F2}\u{1F1E6}" },
+  { name: "Mozambique", code: "MZ", phoneCode: "+258", flag: "\u{1F1F2}\u{1F1FF}" },
+  { name: "Myanmar", code: "MM", phoneCode: "+95", flag: "\u{1F1F2}\u{1F1F2}" },
+  { name: "Namibia", code: "NA", phoneCode: "+264", flag: "\u{1F1F3}\u{1F1E6}" },
+  { name: "Nauru", code: "NR", phoneCode: "+674", flag: "\u{1F1F3}\u{1F1F7}" },
+  { name: "Nepal", code: "NP", phoneCode: "+977", flag: "\u{1F1F3}\u{1F1F5}" },
+  { name: "Netherlands", code: "NL", phoneCode: "+31", flag: "\u{1F1F3}\u{1F1F1}" },
+  { name: "New Caledonia", code: "NC", phoneCode: "+687", flag: "\u{1F1F3}\u{1F1E8}" },
+  { name: "New Zealand", code: "NZ", phoneCode: "+64", flag: "\u{1F1F3}\u{1F1FF}" },
+  { name: "Nicaragua", code: "NI", phoneCode: "+505", flag: "\u{1F1F3}\u{1F1EE}" },
+  { name: "Niger", code: "NE", phoneCode: "+227", flag: "\u{1F1F3}\u{1F1EA}" },
+  { name: "Nigeria", code: "NG", phoneCode: "+234", flag: "\u{1F1F3}\u{1F1EC}" },
+  { name: "Niue", code: "NU", phoneCode: "+683", flag: "\u{1F1F3}\u{1F1FA}" },
+  { name: "Norfolk Island", code: "NF", phoneCode: "+672", flag: "\u{1F1F3}\u{1F1EB}" },
+  { name: "Northern Mariana Islands", code: "MP", phoneCode: "+1", flag: "\u{1F1F2}\u{1F1F5}" },
+  { name: "Norway", code: "NO", phoneCode: "+47", flag: "\u{1F1F3}\u{1F1F4}" },
+  { name: "Oman", code: "OM", phoneCode: "+968", flag: "\u{1F1F4}\u{1F1F2}" },
+  { name: "Pakistan", code: "PK", phoneCode: "+92", flag: "\u{1F1F5}\u{1F1F0}" },
+  { name: "Palau", code: "PW", phoneCode: "+680", flag: "\u{1F1F5}\u{1F1FC}" },
+  { name: "Palestinian Territory, Occupied", code: "PS", phoneCode: "+970", flag: "\u{1F1F5}\u{1F1F8}" },
+  { name: "Panama", code: "PA", phoneCode: "+507", flag: "\u{1F1F5}\u{1F1E6}" },
+  { name: "Papua New Guinea", code: "PG", phoneCode: "+675", flag: "\u{1F1F5}\u{1F1EC}" },
+  { name: "Paraguay", code: "PY", phoneCode: "+595", flag: "\u{1F1F5}\u{1F1FE}" },
+  { name: "Peru", code: "PE", phoneCode: "+51", flag: "\u{1F1F5}\u{1F1EA}" },
+  { name: "Philippines", code: "PH", phoneCode: "+63", flag: "\u{1F1F5}\u{1F1ED}" },
+  { name: "Pitcairn", code: "PN", phoneCode: "+64", flag: "\u{1F1F5}\u{1F1F3}" },
+  { name: "Poland", code: "PL", phoneCode: "+48", flag: "\u{1F1F5}\u{1F1F1}" },
+  { name: "Portugal", code: "PT", phoneCode: "+351", flag: "\u{1F1F5}\u{1F1F9}" },
+  { name: "Puerto Rico", code: "PR", phoneCode: "+1", flag: "\u{1F1F5}\u{1F1F7}" },
+  { name: "Qatar", code: "QA", phoneCode: "+974", flag: "\u{1F1F6}\u{1F1E6}" },
+  { name: "R\xE9union", code: "RE", phoneCode: "+262", flag: "\u{1F1F7}\u{1F1EA}" },
+  { name: "Romania", code: "RO", phoneCode: "+40", flag: "\u{1F1F7}\u{1F1F4}" },
+  { name: "Russian Federation", code: "RU", phoneCode: "+7", flag: "\u{1F1F7}\u{1F1FA}" },
+  { name: "Rwanda", code: "RW", phoneCode: "+250", flag: "\u{1F1F7}\u{1F1FC}" },
+  { name: "Saint Barth\xE9lemy", code: "BL", phoneCode: "+590", flag: "\u{1F1E7}\u{1F1F1}" },
+  { name: "Saint Helena, Ascension and Tristan da Cunha", code: "SH", phoneCode: "+290", flag: "\u{1F1F8}\u{1F1ED}" },
+  { name: "Saint Kitts and Nevis", code: "KN", phoneCode: "+1", flag: "\u{1F1F0}\u{1F1F3}" },
+  { name: "Saint Lucia", code: "LC", phoneCode: "+1", flag: "\u{1F1F1}\u{1F1E8}" },
+  { name: "Saint Martin (French part)", code: "MF", phoneCode: "+590", flag: "\u{1F1F2}\u{1F1EB}" },
+  { name: "Saint Pierre and Miquelon", code: "PM", phoneCode: "+508", flag: "\u{1F1F5}\u{1F1F2}" },
+  { name: "Saint Vincent and the Grenadines", code: "VC", phoneCode: "+1", flag: "\u{1F1FB}\u{1F1E8}" },
+  { name: "Samoa", code: "WS", phoneCode: "+685", flag: "\u{1F1FC}\u{1F1F8}" },
+  { name: "San Marino", code: "SM", phoneCode: "+378", flag: "\u{1F1F8}\u{1F1F2}" },
+  { name: "Sao Tome and Principe", code: "ST", phoneCode: "+239", flag: "\u{1F1F8}\u{1F1F9}" },
+  { name: "Saudi Arabia", code: "SA", phoneCode: "+966", flag: "\u{1F1F8}\u{1F1E6}" },
+  { name: "Senegal", code: "SN", phoneCode: "+221", flag: "\u{1F1F8}\u{1F1F3}" },
+  { name: "Serbia", code: "RS", phoneCode: "+381", flag: "\u{1F1F7}\u{1F1F8}" },
+  { name: "Seychelles", code: "SC", phoneCode: "+248", flag: "\u{1F1F8}\u{1F1E8}" },
+  { name: "Sierra Leone", code: "SL", phoneCode: "+232", flag: "\u{1F1F8}\u{1F1F1}" },
+  { name: "Singapore", code: "SG", phoneCode: "+65", flag: "\u{1F1F8}\u{1F1EC}" },
+  { name: "Sint Maarten (Dutch part)", code: "SX", phoneCode: "+1", flag: "\u{1F1F8}\u{1F1FD}" },
+  { name: "Slovakia", code: "SK", phoneCode: "+421", flag: "\u{1F1F8}\u{1F1F0}" },
+  { name: "Slovenia", code: "SI", phoneCode: "+386", flag: "\u{1F1F8}\u{1F1EE}" },
+  { name: "Solomon Islands", code: "SB", phoneCode: "+677", flag: "\u{1F1F8}\u{1F1E7}" },
+  { name: "Somalia", code: "SO", phoneCode: "+252", flag: "\u{1F1F8}\u{1F1F4}" },
+  { name: "South Africa", code: "ZA", phoneCode: "+27", flag: "\u{1F1FF}\u{1F1E6}" },
+  { name: "South Georgia and the South Sandwich Islands", code: "GS", phoneCode: "+500", flag: "\u{1F1EC}\u{1F1F8}" },
+  { name: "South Sudan", code: "SS", phoneCode: "+211", flag: "\u{1F1F8}\u{1F1F8}" },
+  { name: "Spain", code: "ES", phoneCode: "+34", flag: "\u{1F1EA}\u{1F1F8}" },
+  { name: "Sri Lanka", code: "LK", phoneCode: "+94", flag: "\u{1F1F1}\u{1F1F0}" },
+  { name: "Sudan", code: "SD", phoneCode: "+249", flag: "\u{1F1F8}\u{1F1E9}" },
+  { name: "Suriname", code: "SR", phoneCode: "+597", flag: "\u{1F1F8}\u{1F1F7}" },
+  { name: "Svalbard and Jan Mayen", code: "SJ", phoneCode: "+47", flag: "\u{1F1F8}\u{1F1EF}" },
+  { name: "Swaziland", code: "SZ", phoneCode: "+268", flag: "\u{1F1F8}\u{1F1FF}" },
+  { name: "Sweden", code: "SE", phoneCode: "+46", flag: "\u{1F1F8}\u{1F1EA}" },
+  { name: "Switzerland", code: "CH", phoneCode: "+41", flag: "\u{1F1E8}\u{1F1ED}" },
+  { name: "Syrian Arab Republic", code: "SY", phoneCode: "+963", flag: "\u{1F1F8}\u{1F1FE}" },
+  { name: "Taiwan, Province of China", code: "TW", phoneCode: "+886", flag: "\u{1F1F9}\u{1F1FC}" },
+  { name: "Tajikistan", code: "TJ", phoneCode: "+992", flag: "\u{1F1F9}\u{1F1EF}" },
+  { name: "Tanzania, United Republic of", code: "TZ", phoneCode: "+255", flag: "\u{1F1F9}\u{1F1FF}" },
+  { name: "Thailand", code: "TH", phoneCode: "+66", flag: "\u{1F1F9}\u{1F1ED}" },
+  { name: "Timor-Leste", code: "TL", phoneCode: "+670", flag: "\u{1F1F9}\u{1F1F1}" },
+  { name: "Togo", code: "TG", phoneCode: "+228", flag: "\u{1F1F9}\u{1F1EC}" },
+  { name: "Tokelau", code: "TK", phoneCode: "+690", flag: "\u{1F1F9}\u{1F1F0}" },
+  { name: "Tonga", code: "TO", phoneCode: "+676", flag: "\u{1F1F9}\u{1F1F4}" },
+  { name: "Trinidad and Tobago", code: "TT", phoneCode: "+1", flag: "\u{1F1F9}\u{1F1F9}" },
+  { name: "Tunisia", code: "TN", phoneCode: "+216", flag: "\u{1F1F9}\u{1F1F3}" },
+  { name: "Turkey", code: "TR", phoneCode: "+90", flag: "\u{1F1F9}\u{1F1F7}" },
+  { name: "Turkmenistan", code: "TM", phoneCode: "+993", flag: "\u{1F1F9}\u{1F1F2}" },
+  { name: "Turks and Caicos Islands", code: "TC", phoneCode: "+1", flag: "\u{1F1F9}\u{1F1E8}" },
+  { name: "Tuvalu", code: "TV", phoneCode: "+688", flag: "\u{1F1F9}\u{1F1FB}" },
+  { name: "Uganda", code: "UG", phoneCode: "+256", flag: "\u{1F1FA}\u{1F1EC}" },
+  { name: "Ukraine", code: "UA", phoneCode: "+380", flag: "\u{1F1FA}\u{1F1E6}" },
+  { name: "United Arab Emirates", code: "AE", phoneCode: "+971", flag: "\u{1F1E6}\u{1F1EA}" },
+  { name: "United Kingdom", code: "GB", phoneCode: "+44", flag: "\u{1F1EC}\u{1F1E7}" },
+  { name: "United States", code: "US", phoneCode: "+1", flag: "\u{1F1FA}\u{1F1F8}" },
+  { name: "United States Minor Outlying Islands", code: "UM", phoneCode: "+1", flag: "\u{1F1FA}\u{1F1F2}" },
+  { name: "Uruguay", code: "UY", phoneCode: "+598", flag: "\u{1F1FA}\u{1F1FE}" },
+  { name: "Uzbekistan", code: "UZ", phoneCode: "+998", flag: "\u{1F1FA}\u{1F1FF}" },
+  { name: "Vanuatu", code: "VU", phoneCode: "+678", flag: "\u{1F1FB}\u{1F1FA}" },
+  { name: "Venezuela, Bolivarian Republic of", code: "VE", phoneCode: "+58", flag: "\u{1F1FB}\u{1F1EA}" },
+  { name: "Viet Nam", code: "VN", phoneCode: "+84", flag: "\u{1F1FB}\u{1F1F3}" },
+  { name: "Virgin Islands, British", code: "VG", phoneCode: "+1", flag: "\u{1F1FB}\u{1F1EC}" },
+  { name: "Virgin Islands, U.S.", code: "VI", phoneCode: "+1", flag: "\u{1F1FB}\u{1F1EE}" },
+  { name: "Wallis and Futuna", code: "WF", phoneCode: "+681", flag: "\u{1F1FC}\u{1F1EB}" },
+  { name: "Western Sahara", code: "EH", phoneCode: "+212", flag: "\u{1F1EA}\u{1F1ED}" },
+  { name: "Yemen", code: "YE", phoneCode: "+967", flag: "\u{1F1FE}\u{1F1EA}" },
+  { name: "Zambia", code: "ZM", phoneCode: "+260", flag: "\u{1F1FF}\u{1F1F2}" },
+  { name: "Zimbabwe", code: "ZW", phoneCode: "+263", flag: "\u{1F1FF}\u{1F1FC}" }
+];
 
 // src/utils/error.util.ts
 var validateRegex = (value, regex) => regex.test(value);
@@ -1732,6 +1984,7 @@ var BaseSelect = ({
   disabled = false,
   loading = false,
   validationError = "",
+  showBottomText = true,
   label = "",
   hint = "",
   required = false,
@@ -1985,8 +2238,8 @@ var BaseSelect = ({
         ]
       }
     ),
-    hint && /* @__PURE__ */ jsx29(BaseHint, { hint }),
-    validationError && /* @__PURE__ */ jsx29(BaseInputError, { errorMessage: validationError })
+    hint && showBottomText && /* @__PURE__ */ jsx29(BaseHint, { hint }),
+    validationError && showBottomText && /* @__PURE__ */ jsx29(BaseInputError, { errorMessage: validationError })
   ] });
 };
 
@@ -2035,6 +2288,7 @@ var BaseInput = ({
   mask,
   placeholder,
   validationError = "",
+  showBottomText = true,
   hint = "",
   rules = [],
   isAmountInput = false,
@@ -2138,8 +2392,8 @@ var BaseInput = ({
         ]
       }
     ),
-    (hint || localHint) && /* @__PURE__ */ jsx31("p", { className: "text-body-3xs text-light-copy", children: localHint || hint }),
-    (validationError || localError) && /* @__PURE__ */ jsx31("p", { className: "text-body-3xs text-red-500", children: localError || validationError })
+    (hint || localHint) && showBottomText && /* @__PURE__ */ jsx31("p", { className: "text-body-3xs text-light-copy", children: localHint || hint }),
+    (validationError || localError) && showBottomText && /* @__PURE__ */ jsx31("p", { className: "text-body-3xs text-red-500", children: localError || validationError })
   ] });
 };
 
@@ -2413,11 +2667,97 @@ function BzpCheckoutButton({
 }
 
 // src/buzapay-checkout/checkout-card.tsx
-import { useEffect as useEffect6, useState as useState7 } from "react";
+import { useEffect as useEffect7, useState as useState7 } from "react";
 
 // src/components/pay-by-card.tsx
-import { useEffect as useEffect3, useState as useState4 } from "react";
+import { useEffect as useEffect4, useState as useState4 } from "react";
+
+// src/components/base/phone-number-input.tsx
+import React5, { useEffect as useEffect3 } from "react";
 import { jsx as jsx35, jsxs as jsxs23 } from "react/jsx-runtime";
+var BasePhoneNumberInput = ({
+  phoneCodeOptions,
+  value,
+  onChange,
+  onCodeChange,
+  label = "",
+  required = false,
+  disabled = false,
+  loading = false,
+  validationError = "",
+  hint = "",
+  defaultCountryCode,
+  preventPaste = false,
+  showCopyIcon = false,
+  containerClassName = "",
+  inputClassName = "",
+  placeholder
+}) => {
+  const safeDefaultCode = phoneCodeOptions?.[0]?.value ?? "+1";
+  const [selectedCode, setSelectedCode] = React5.useState(safeDefaultCode);
+  const selectedMeta = React5.useMemo(() => {
+    return phoneCodeOptions.find((o) => o.value === selectedCode);
+  }, [phoneCodeOptions, selectedCode]);
+  const getFormattedCode = (codeValue) => codeValue.split("-")[0];
+  const handleCountryChange = (nextValue) => {
+    setSelectedCode(nextValue);
+    onCodeChange?.(getFormattedCode(nextValue));
+  };
+  const handleChange = (e) => {
+    const incoming = e;
+    onChange?.(incoming);
+  };
+  const computedPlaceholder = placeholder ?? selectedMeta?.placeholder ?? (label ? `Enter ${label.toLowerCase()}` : "Enter phone number");
+  useEffect3(() => {
+    const nextValue = defaultCountryCode ?? safeDefaultCode;
+    setSelectedCode(nextValue);
+    onCodeChange?.(getFormattedCode(nextValue));
+  }, [defaultCountryCode]);
+  return /* @__PURE__ */ jsxs23("div", { className: `flex flex-col gap-2`, children: [
+    label ? /* @__PURE__ */ jsxs23("p", { className: "mb-0 text-body-2xs font-normal text-heading-text", children: [
+      label,
+      required && /* @__PURE__ */ jsx35("span", { className: "text-orange-required", children: " *" })
+    ] }) : null,
+    /* @__PURE__ */ jsxs23("div", { className: `flex items-center gap-2 ${containerClassName}`, children: [
+      /* @__PURE__ */ jsx35("div", { className: "w-1/3", children: /* @__PURE__ */ jsx35(
+        BaseSelect,
+        {
+          required: true,
+          options: phoneCodeOptions,
+          value: selectedCode,
+          showBottomText: false,
+          itemImageType: "country",
+          onChange: handleCountryChange,
+          validationError,
+          placeholder: "+234"
+        }
+      ) }),
+      /* @__PURE__ */ jsx35("div", { className: "w-2/3", children: /* @__PURE__ */ jsx35(
+        BaseInput,
+        {
+          className: inputClassName,
+          required,
+          disabled,
+          loading,
+          validationError,
+          showBottomText: false,
+          hint,
+          value,
+          onChange: handleChange,
+          rules: ["numeric"],
+          preventPaste,
+          showCopyIcon,
+          placeholder: computedPlaceholder
+        }
+      ) })
+    ] }),
+    hint && /* @__PURE__ */ jsx35("p", { className: "text-body-3xs text-light-copy", children: hint }),
+    validationError && /* @__PURE__ */ jsx35("p", { className: "text-body-3xs text-red-500", children: validationError })
+  ] });
+};
+
+// src/components/pay-by-card.tsx
+import { jsx as jsx36, jsxs as jsxs24 } from "react/jsx-runtime";
 function PayByCard({
   secretKey,
   paymentObject,
@@ -2430,6 +2770,7 @@ function PayByCard({
   const [message, setMessage] = useState4("");
   const [isMakingPayment, setIsMakingPayment] = useState4(false);
   const [loading, setLoading] = useState4(false);
+  const [defaultCountryCode, setDefaultCountryCode] = useState4("");
   const [cardType, setCardType] = useState4("");
   const [transactionReference, setTransactionReference] = useState4("");
   const [loadingCountries, setLoadingCountries] = useState4(false);
@@ -2437,6 +2778,9 @@ function PayByCard({
   const [rawCountries, setRawCountries] = useState4([]);
   const [countries, setCountries] = useState4([]);
   const [countryStates, setCountryStates] = useState4([]);
+  const [phoneCodeOptions, setPhoneCodeOptions] = useState4(
+    []
+  );
   const [billingForm, setBillingForm] = useState4({
     address1: "",
     address2: "",
@@ -2445,7 +2789,8 @@ function PayByCard({
     city: "",
     country: "",
     emailAddress: "",
-    phoneNumber: ""
+    phoneNumber: "",
+    phoneNumberExt: ""
   });
   const [payForm, setPayForm] = useState4({
     customerName: "",
@@ -2533,7 +2878,7 @@ function PayByCard({
           city: billingForm.city ?? "",
           country: billingForm.country ?? "",
           emailAddress: billingForm.emailAddress ?? "",
-          phoneNumber: billingForm.phoneNumber ?? ""
+          phoneNumber: billingForm.phoneNumber ? `${billingForm.phoneNumberExt}${billingForm.phoneNumber}` : ""
         };
         const encryptedCardDetails = encryptPayload(secretKey, cardDetails);
         let payload = null;
@@ -2754,15 +3099,25 @@ function PayByCard({
     setCardType(cardTypeHandler(event));
     payRules.cardPin = cardType === "Verve" ? "required|numeric" : "";
   };
-  useEffect3(() => {
+  useEffect4(() => {
     (async () => {
       await generatePaymentLinkHandler();
       await getAllCountries();
+      const codeOptions = COUNTRIES.map((country) => {
+        return {
+          value: `${country.phoneCode}-${country.code}`,
+          label: `${country.phoneCode}`,
+          flag: country.flag,
+          phoneCode: country.phoneCode,
+          countryCode: country.code
+        };
+      }).sort((a, b) => a.label.localeCompare(b.label));
+      setPhoneCodeOptions(codeOptions);
     })();
   }, []);
-  return /* @__PURE__ */ jsxs23("div", { className: "flex flex-col gap-6", children: [
-    formIndex === 0 && /* @__PURE__ */ jsxs23("div", { className: "grid grid-cols-2 gap-6 overflow-y-auto", children: [
-      /* @__PURE__ */ jsx35("div", { className: "col-span-2", children: /* @__PURE__ */ jsx35(
+  return /* @__PURE__ */ jsxs24("div", { className: "flex flex-col gap-6", children: [
+    formIndex === 0 && /* @__PURE__ */ jsxs24("div", { className: "grid grid-cols-2 gap-6 overflow-y-auto", children: [
+      /* @__PURE__ */ jsx36("div", { className: "col-span-2", children: /* @__PURE__ */ jsx36(
         BaseInput,
         {
           label: "Address Line 1",
@@ -2777,7 +3132,7 @@ function PayByCard({
           validationError: billingErrors.address1 ?? ""
         }
       ) }),
-      /* @__PURE__ */ jsx35("div", { className: "col-span-2", children: /* @__PURE__ */ jsx35(
+      /* @__PURE__ */ jsx36("div", { className: "col-span-2", children: /* @__PURE__ */ jsx36(
         BaseInput,
         {
           label: "Address Line 2",
@@ -2786,7 +3141,7 @@ function PayByCard({
           validationError: billingErrors.address2 ?? ""
         }
       ) }),
-      /* @__PURE__ */ jsx35(
+      /* @__PURE__ */ jsx36(
         BaseSelect,
         {
           label: "Select Country",
@@ -2797,6 +3152,12 @@ function PayByCard({
           onChange: (e) => {
             setBillingForm({ ...billingForm, country: e, state: "" });
             getStates(e);
+            const selectedCountry = COUNTRIES.filter(
+              (c) => c.code.toLowerCase() === e.toLowerCase()
+            )[0];
+            if (selectedCountry) {
+              setDefaultCountryCode(`${selectedCountry.phoneCode}-${selectedCountry.code}`);
+            }
             if (billingErrors.country) {
               setBillingErrors((er) => ({ ...er, country: "" }));
             }
@@ -2804,7 +3165,7 @@ function PayByCard({
           validationError: billingErrors.country ?? ""
         }
       ),
-      /* @__PURE__ */ jsx35(
+      /* @__PURE__ */ jsx36(
         BaseSelect,
         {
           label: "Select State",
@@ -2821,7 +3182,7 @@ function PayByCard({
           validationError: billingErrors.state ?? ""
         }
       ),
-      /* @__PURE__ */ jsx35(
+      /* @__PURE__ */ jsx36(
         BaseInput,
         {
           label: "City",
@@ -2836,7 +3197,7 @@ function PayByCard({
           validationError: billingErrors.city ?? ""
         }
       ),
-      /* @__PURE__ */ jsx35(
+      /* @__PURE__ */ jsx36(
         BaseInput,
         {
           label: "Postal Code",
@@ -2851,7 +3212,7 @@ function PayByCard({
           validationError: billingErrors.postalCode ?? ""
         }
       ),
-      /* @__PURE__ */ jsx35(
+      /* @__PURE__ */ jsx36(
         BaseInput,
         {
           label: "Email",
@@ -2866,29 +3227,37 @@ function PayByCard({
           validationError: billingErrors.emailAddress ?? ""
         }
       ),
-      /* @__PURE__ */ jsx35(
-        BaseInput,
+      /* @__PURE__ */ jsx36("div", { className: "col-span-2", children: /* @__PURE__ */ jsx36(
+        BasePhoneNumberInput,
         {
           label: "Phone Number",
           required: true,
           value: billingForm.phoneNumber,
+          phoneCodeOptions,
+          defaultCountryCode,
           onChange: (e) => {
             setBillingForm({ ...billingForm, phoneNumber: e });
             if (billingErrors.phoneNumber) {
               setBillingErrors((er) => ({ ...er, phoneNumber: "" }));
             }
           },
+          onCodeChange: (e) => {
+            setBillingForm({ ...billingForm, phoneNumberExt: e });
+            if (billingErrors.phoneNumberExt) {
+              setBillingErrors((er) => ({ ...er, phoneNumberExt: "" }));
+            }
+          },
           validationError: billingErrors.phoneNumber ?? ""
         }
-      )
+      ) })
     ] }),
-    formIndex === 1 && /* @__PURE__ */ jsxs23(
+    formIndex === 1 && /* @__PURE__ */ jsxs24(
       "div",
       {
         className: "grid grid-cols-2 gap-6 overflow-y-auto",
         style: { maxHeight: 320 },
         children: [
-          /* @__PURE__ */ jsx35("div", { className: "col-span-2", children: /* @__PURE__ */ jsx35(
+          /* @__PURE__ */ jsx36("div", { className: "col-span-2", children: /* @__PURE__ */ jsx36(
             BaseInput,
             {
               label: "Card Name",
@@ -2903,7 +3272,7 @@ function PayByCard({
               validationError: payErrors.customerName ?? ""
             }
           ) }),
-          /* @__PURE__ */ jsx35("div", { className: "col-span-2", children: /* @__PURE__ */ jsx35(
+          /* @__PURE__ */ jsx36("div", { className: "col-span-2", children: /* @__PURE__ */ jsx36(
             BaseInput,
             {
               label: "Card Number",
@@ -2922,7 +3291,7 @@ function PayByCard({
               validationError: payErrors.cardNo ?? ""
             }
           ) }),
-          /* @__PURE__ */ jsx35(
+          /* @__PURE__ */ jsx36(
             BaseInput,
             {
               label: "Expiry Date",
@@ -2938,7 +3307,7 @@ function PayByCard({
               validationError: payErrors.expireDate ?? ""
             }
           ),
-          /* @__PURE__ */ jsx35(
+          /* @__PURE__ */ jsx36(
             BaseInput,
             {
               label: "CVV",
@@ -2954,7 +3323,7 @@ function PayByCard({
               validationError: payErrors.cvv ?? ""
             }
           ),
-          cardType === "Verve" && /* @__PURE__ */ jsx35(
+          cardType === "Verve" && /* @__PURE__ */ jsx36(
             BaseInput,
             {
               label: "Card Pin",
@@ -2974,7 +3343,7 @@ function PayByCard({
         ]
       }
     ),
-    /* @__PURE__ */ jsx35(
+    /* @__PURE__ */ jsx36(
       BaseButton,
       {
         label: formIndex === 0 ? "Proceed" : `Pay ${formatAmountHandler}`,
@@ -2992,11 +3361,11 @@ function PayByCard({
 // src/components/pay-by-transfer.tsx
 import {
   useCallback as useCallback3,
-  useEffect as useEffect4,
+  useEffect as useEffect5,
   useRef as useRef2,
   useState as useState5
 } from "react";
-import { jsx as jsx36, jsxs as jsxs24 } from "react/jsx-runtime";
+import { jsx as jsx37, jsxs as jsxs25 } from "react/jsx-runtime";
 var PayByTransfer = ({
   secretKey,
   paymentObject,
@@ -3207,19 +3576,19 @@ var PayByTransfer = ({
       intervalRef.current = null;
     }
   };
-  useEffect4(() => {
+  useEffect5(() => {
     (async () => {
       await generatePaymentLinkHandler();
     })();
   }, []);
-  useEffect4(() => {
+  useEffect5(() => {
     if (remainingSeconds < 0 && intervalRef.current) {
       stopTimer();
     }
   }, [remainingSeconds]);
-  return /* @__PURE__ */ jsxs24("div", { className: "flex flex-col gap-10", children: [
-    formIndex === 0 && /* @__PURE__ */ jsxs24("div", { className: "flex flex-col gap-10", children: [
-      /* @__PURE__ */ jsx36(
+  return /* @__PURE__ */ jsxs25("div", { className: "flex flex-col gap-10", children: [
+    formIndex === 0 && /* @__PURE__ */ jsxs25("div", { className: "flex flex-col gap-10", children: [
+      /* @__PURE__ */ jsx37(
         BaseInput,
         {
           label: "Customer Name",
@@ -3234,7 +3603,7 @@ var PayByTransfer = ({
           validationError: transferErrors.customerName ?? ""
         }
       ),
-      /* @__PURE__ */ jsx36(
+      /* @__PURE__ */ jsx37(
         BaseButton,
         {
           label: `Pay ${formatAmountHandler}`,
@@ -3246,8 +3615,8 @@ var PayByTransfer = ({
         }
       )
     ] }),
-    formIndex === 1 && /* @__PURE__ */ jsxs24("div", { className: "flex flex-col gap-10", children: [
-      /* @__PURE__ */ jsxs24(
+    formIndex === 1 && /* @__PURE__ */ jsxs25("div", { className: "flex flex-col gap-10", children: [
+      /* @__PURE__ */ jsxs25(
         "div",
         {
           className: [
@@ -3255,22 +3624,22 @@ var PayByTransfer = ({
             caller === "miden" ? "bg-[#FAFDFF] border border-[#F0FAFF]" : "bg-[#EFF7FF]"
           ].join(" "),
           children: [
-            /* @__PURE__ */ jsx36(
+            /* @__PURE__ */ jsx37(
               BaseLabelInfo,
               {
                 label: "Bank Name",
                 value: `${paymentAccountDetails?.bank} ${paymentAccountDetails?.accountName}`
               }
             ),
-            /* @__PURE__ */ jsxs24("div", { className: "flex items-center justify-between", children: [
-              /* @__PURE__ */ jsx36(
+            /* @__PURE__ */ jsxs25("div", { className: "flex items-center justify-between", children: [
+              /* @__PURE__ */ jsx37(
                 BaseLabelInfo,
                 {
                   label: "Account Number",
                   value: paymentAccountDetails?.accountNumber
                 }
               ),
-              /* @__PURE__ */ jsx36(
+              /* @__PURE__ */ jsx37(
                 BaseCopy,
                 {
                   color: "#9DBFDE",
@@ -3278,20 +3647,20 @@ var PayByTransfer = ({
                 }
               )
             ] }),
-            /* @__PURE__ */ jsxs24("div", { className: "flex items-center justify-between", children: [
-              /* @__PURE__ */ jsx36(BaseLabelInfo, { label: "Amount", value: formatAmountHandler }),
-              /* @__PURE__ */ jsx36(BaseCopy, { color: "#9DBFDE", copyText: formatAmountHandler })
+            /* @__PURE__ */ jsxs25("div", { className: "flex items-center justify-between", children: [
+              /* @__PURE__ */ jsx37(BaseLabelInfo, { label: "Amount", value: formatAmountHandler }),
+              /* @__PURE__ */ jsx37(BaseCopy, { color: "#9DBFDE", copyText: formatAmountHandler })
             ] })
           ]
         }
       ),
-      caller === "buzapay" && /* @__PURE__ */ jsxs24("p", { className: "w-2/3 mx-auto text-center text-body-2xs font-medium text-sub-copy", children: [
+      caller === "buzapay" && /* @__PURE__ */ jsxs25("p", { className: "w-2/3 mx-auto text-center text-body-2xs font-medium text-sub-copy", children: [
         "This account is for this transaction only and expires in",
         " ",
-        /* @__PURE__ */ jsx36("span", { className: "text-orange-500", children: remainingSeconds >= 0 ? countDownTime : "00:00" })
+        /* @__PURE__ */ jsx37("span", { className: "text-orange-500", children: remainingSeconds >= 0 ? countDownTime : "00:00" })
       ] }),
-      caller === "miden" && /* @__PURE__ */ jsxs24("div", { className: "p-4 rounded-lg bg-[#FAFDFF] flex items-center gap-3", children: [
-        /* @__PURE__ */ jsx36(
+      caller === "miden" && /* @__PURE__ */ jsxs25("div", { className: "p-4 rounded-lg bg-[#FAFDFF] flex items-center gap-3", children: [
+        /* @__PURE__ */ jsx37(
           BaseCircularCountdown,
           {
             value: remainingSeconds,
@@ -3302,16 +3671,16 @@ var PayByTransfer = ({
             color: "#3b82f6"
           }
         ),
-        /* @__PURE__ */ jsxs24("p", { className: "text-body-3xs font-medium text-light-copy", children: [
+        /* @__PURE__ */ jsxs25("p", { className: "text-body-3xs font-medium text-light-copy", children: [
           "This account is for this transaction only and expires in",
-          /* @__PURE__ */ jsxs24("span", { className: "text-[#1383E8] ml-2", children: [
+          /* @__PURE__ */ jsxs25("span", { className: "text-[#1383E8] ml-2", children: [
             countDownTime,
             "..."
           ] })
         ] })
       ] }),
-      /* @__PURE__ */ jsxs24("div", { className: "flex flex-col gap-4", children: [
-        /* @__PURE__ */ jsx36(
+      /* @__PURE__ */ jsxs25("div", { className: "flex flex-col gap-4", children: [
+        /* @__PURE__ */ jsx37(
           BaseButton,
           {
             label: "I have paid the money",
@@ -3322,7 +3691,7 @@ var PayByTransfer = ({
             onClick: getReferenceDetails
           }
         ),
-        /* @__PURE__ */ jsx36(
+        /* @__PURE__ */ jsx37(
           "button",
           {
             type: "button",
@@ -3337,8 +3706,8 @@ var PayByTransfer = ({
 };
 
 // src/components/pay-by-stable-coin.tsx
-import { useEffect as useEffect5, useState as useState6 } from "react";
-import { Fragment as Fragment3, jsx as jsx37, jsxs as jsxs25 } from "react/jsx-runtime";
+import { useEffect as useEffect6, useState as useState6 } from "react";
+import { Fragment as Fragment3, jsx as jsx38, jsxs as jsxs26 } from "react/jsx-runtime";
 var PayByStableCoin = ({
   secretKey,
   paymentObject,
@@ -3557,16 +3926,16 @@ var PayByStableCoin = ({
     }
   };
   const amountPlusNetworkFee = addressDetails ? Number(addressDetails.transactionAmount) + addressDetails.networkFee : 0;
-  useEffect5(() => {
+  useEffect6(() => {
     (async () => {
       await generatePaymentLinkHandler();
       await getAllStableCoins();
     })();
   }, []);
-  return /* @__PURE__ */ jsxs25("div", { className: "flex flex-col gap-6", children: [
-    formIndex === 0 && /* @__PURE__ */ jsxs25(Fragment3, { children: [
-      /* @__PURE__ */ jsxs25("div", { className: "grid grid-cols-1 gap-6", children: [
-        /* @__PURE__ */ jsx37(
+  return /* @__PURE__ */ jsxs26("div", { className: "flex flex-col gap-6", children: [
+    formIndex === 0 && /* @__PURE__ */ jsxs26(Fragment3, { children: [
+      /* @__PURE__ */ jsxs26("div", { className: "grid grid-cols-1 gap-6", children: [
+        /* @__PURE__ */ jsx38(
           BaseSelect,
           {
             label: "Select Crypto",
@@ -3584,7 +3953,7 @@ var PayByStableCoin = ({
             validationError: stableCoinErrors.stableCoin ?? ""
           }
         ),
-        /* @__PURE__ */ jsx37(
+        /* @__PURE__ */ jsx38(
           BaseSelect,
           {
             label: "Select Network",
@@ -3602,7 +3971,7 @@ var PayByStableCoin = ({
           }
         )
       ] }),
-      /* @__PURE__ */ jsx37(
+      /* @__PURE__ */ jsx38(
         BaseButton,
         {
           label: `Pay ${formatAmountHandler}`,
@@ -3614,22 +3983,22 @@ var PayByStableCoin = ({
         }
       )
     ] }),
-    formIndex === 1 && /* @__PURE__ */ jsxs25("div", { children: [
-      caller === "buzapay" && /* @__PURE__ */ jsxs25("div", { className: "flex flex-col gap-6", children: [
-        /* @__PURE__ */ jsxs25("div", { className: "mx-auto", children: [
-          /* @__PURE__ */ jsx37(IconQrCode, {}),
-          /* @__PURE__ */ jsx37("p", { className: "mb-0 text-body-4xs text-light-copy font-normal text-center", children: generateAddressPayload?.currency })
+    formIndex === 1 && /* @__PURE__ */ jsxs26("div", { children: [
+      caller === "buzapay" && /* @__PURE__ */ jsxs26("div", { className: "flex flex-col gap-6", children: [
+        /* @__PURE__ */ jsxs26("div", { className: "mx-auto", children: [
+          /* @__PURE__ */ jsx38(IconQrCode, {}),
+          /* @__PURE__ */ jsx38("p", { className: "mb-0 text-body-4xs text-light-copy font-normal text-center", children: generateAddressPayload?.currency })
         ] }),
-        /* @__PURE__ */ jsxs25("div", { className: "flex flex-col gap-6 border-c border-grey-100 p-4 rounded-2xl bg-light-white-50", children: [
-          /* @__PURE__ */ jsxs25("div", { className: "border-b border-grey-border pb-4 flex flex-col gap-2", children: [
-            /* @__PURE__ */ jsx37("p", { className: "mb-0 text-body-3xs text-light-copy font-normal", children: "Network" }),
-            /* @__PURE__ */ jsxs25("div", { className: "flex justify-between", children: [
-              /* @__PURE__ */ jsxs25("div", { className: "flex flex-col gap-1", children: [
-                /* @__PURE__ */ jsx37("p", { className: "mb-0 text-body-2xs font-medium text-sub-copy", children: addressDetails?.chain }),
-                /* @__PURE__ */ jsxs25("div", { className: "flex items-center gap-2", children: [
-                  /* @__PURE__ */ jsx37("p", { className: "mb-0 text-body-3xs text-light-copy font-normal", children: "*Est. arrival = 3 mins" }),
-                  /* @__PURE__ */ jsx37("p", { className: "mb-0 text-body-3xs text-light-copy font-normal", children: "|" }),
-                  /* @__PURE__ */ jsx37(
+        /* @__PURE__ */ jsxs26("div", { className: "flex flex-col gap-6 border-c border-grey-100 p-4 rounded-2xl bg-light-white-50", children: [
+          /* @__PURE__ */ jsxs26("div", { className: "border-b border-grey-border pb-4 flex flex-col gap-2", children: [
+            /* @__PURE__ */ jsx38("p", { className: "mb-0 text-body-3xs text-light-copy font-normal", children: "Network" }),
+            /* @__PURE__ */ jsxs26("div", { className: "flex justify-between", children: [
+              /* @__PURE__ */ jsxs26("div", { className: "flex flex-col gap-1", children: [
+                /* @__PURE__ */ jsx38("p", { className: "mb-0 text-body-2xs font-medium text-sub-copy", children: addressDetails?.chain }),
+                /* @__PURE__ */ jsxs26("div", { className: "flex items-center gap-2", children: [
+                  /* @__PURE__ */ jsx38("p", { className: "mb-0 text-body-3xs text-light-copy font-normal", children: "*Est. arrival = 3 mins" }),
+                  /* @__PURE__ */ jsx38("p", { className: "mb-0 text-body-3xs text-light-copy font-normal", children: "|" }),
+                  /* @__PURE__ */ jsx38(
                     BaseCurrencyAmount,
                     {
                       currency: generateAddressPayload?.currency ?? "",
@@ -3642,21 +4011,21 @@ var PayByStableCoin = ({
                   )
                 ] })
               ] }),
-              /* @__PURE__ */ jsx37(IconArrowSwap, {})
+              /* @__PURE__ */ jsx38(IconArrowSwap, {})
             ] })
           ] }),
-          /* @__PURE__ */ jsxs25("div", { className: "pb-4 flex flex-col gap-2", children: [
-            /* @__PURE__ */ jsx37("p", { className: "mb-0 text-body-3xs text-light-copy font-normal", children: "Deposit Address >" }),
-            /* @__PURE__ */ jsxs25("div", { className: "flex justify-between", children: [
-              /* @__PURE__ */ jsx37("p", { className: "mb-0 text-body-2xs font-medium text-sub-copy w-2/3 break-words", children: addressDetails?.walletAddress }),
-              /* @__PURE__ */ jsx37(BaseCopy, { copyText: addressDetails?.walletAddress ?? "" })
+          /* @__PURE__ */ jsxs26("div", { className: "pb-4 flex flex-col gap-2", children: [
+            /* @__PURE__ */ jsx38("p", { className: "mb-0 text-body-3xs text-light-copy font-normal", children: "Deposit Address >" }),
+            /* @__PURE__ */ jsxs26("div", { className: "flex justify-between", children: [
+              /* @__PURE__ */ jsx38("p", { className: "mb-0 text-body-2xs font-medium text-sub-copy w-2/3 break-words", children: addressDetails?.walletAddress }),
+              /* @__PURE__ */ jsx38(BaseCopy, { copyText: addressDetails?.walletAddress ?? "" })
             ] })
           ] })
         ] }),
-        /* @__PURE__ */ jsxs25("div", { className: "flex flex-col gap-2", children: [
-          /* @__PURE__ */ jsxs25("div", { className: "flex items-center justify-between border-b border-grey-border py-3", children: [
-            /* @__PURE__ */ jsx37("p", { className: "mb-0 text-body-2xs font-medium text-primary-black", children: "Network fee" }),
-            /* @__PURE__ */ jsx37(
+        /* @__PURE__ */ jsxs26("div", { className: "flex flex-col gap-2", children: [
+          /* @__PURE__ */ jsxs26("div", { className: "flex items-center justify-between border-b border-grey-border py-3", children: [
+            /* @__PURE__ */ jsx38("p", { className: "mb-0 text-body-2xs font-medium text-primary-black", children: "Network fee" }),
+            /* @__PURE__ */ jsx38(
               BaseCurrencyAmount,
               {
                 currency: generateAddressPayload?.currency ?? "",
@@ -3666,9 +4035,9 @@ var PayByStableCoin = ({
               }
             )
           ] }),
-          /* @__PURE__ */ jsxs25("div", { className: "flex items-center justify-between py-4", children: [
-            /* @__PURE__ */ jsx37("p", { className: "mb-0 text-body-lg font-semibold text-primary-black", children: "Pay" }),
-            /* @__PURE__ */ jsx37(
+          /* @__PURE__ */ jsxs26("div", { className: "flex items-center justify-between py-4", children: [
+            /* @__PURE__ */ jsx38("p", { className: "mb-0 text-body-lg font-semibold text-primary-black", children: "Pay" }),
+            /* @__PURE__ */ jsx38(
               BaseCurrencyAmount,
               {
                 currency: generateAddressPayload?.currency ?? "",
@@ -3681,7 +4050,7 @@ var PayByStableCoin = ({
             )
           ] })
         ] }),
-        /* @__PURE__ */ jsx37("div", { className: "flex flex-col gap-6", children: /* @__PURE__ */ jsx37(
+        /* @__PURE__ */ jsx38("div", { className: "flex flex-col gap-6", children: /* @__PURE__ */ jsx38(
           BaseButton,
           {
             label: "Confirm Payment",
@@ -3693,17 +4062,17 @@ var PayByStableCoin = ({
           }
         ) })
       ] }),
-      caller === "miden" && /* @__PURE__ */ jsxs25("div", { className: "flex flex-col gap-6", children: [
-        /* @__PURE__ */ jsxs25("div", { className: "p-4 rounded-lg flex flex-col gap-6 bg-[#FAFDFF] border border-[#F0FAFF]", children: [
-          /* @__PURE__ */ jsxs25("div", { className: "flex items-center justify-between", children: [
-            /* @__PURE__ */ jsx37(
+      caller === "miden" && /* @__PURE__ */ jsxs26("div", { className: "flex flex-col gap-6", children: [
+        /* @__PURE__ */ jsxs26("div", { className: "p-4 rounded-lg flex flex-col gap-6 bg-[#FAFDFF] border border-[#F0FAFF]", children: [
+          /* @__PURE__ */ jsxs26("div", { className: "flex items-center justify-between", children: [
+            /* @__PURE__ */ jsx38(
               BaseLabelInfo,
               {
                 label: "Chain",
                 value: addressDetails?.chain ?? ""
               }
             ),
-            /* @__PURE__ */ jsx37(
+            /* @__PURE__ */ jsx38(
               BaseCopy,
               {
                 color: "#9DBFDE",
@@ -3711,15 +4080,15 @@ var PayByStableCoin = ({
               }
             )
           ] }),
-          /* @__PURE__ */ jsxs25("div", { className: "flex items-center justify-between", children: [
-            /* @__PURE__ */ jsx37(
+          /* @__PURE__ */ jsxs26("div", { className: "flex items-center justify-between", children: [
+            /* @__PURE__ */ jsx38(
               BaseLabelInfo,
               {
                 label: "Wallet Address",
                 value: addressDetails?.walletAddress ?? ""
               }
             ),
-            /* @__PURE__ */ jsx37(
+            /* @__PURE__ */ jsx38(
               BaseCopy,
               {
                 color: "#9DBFDE",
@@ -3727,9 +4096,9 @@ var PayByStableCoin = ({
               }
             )
           ] }),
-          /* @__PURE__ */ jsxs25("div", { className: "flex flex-col", children: [
-            /* @__PURE__ */ jsx37("p", { className: "mb-1 text-body-4xs font-medium text-light-copy uppercase", children: "Amount" }),
-            /* @__PURE__ */ jsx37(
+          /* @__PURE__ */ jsxs26("div", { className: "flex flex-col", children: [
+            /* @__PURE__ */ jsx38("p", { className: "mb-1 text-body-4xs font-medium text-light-copy uppercase", children: "Amount" }),
+            /* @__PURE__ */ jsx38(
               BaseCurrencyAmount,
               {
                 currency: generateAddressPayload?.currency ?? "",
@@ -3741,17 +4110,17 @@ var PayByStableCoin = ({
               }
             )
           ] }),
-          /* @__PURE__ */ jsxs25("div", { className: "flex gap-4 items-center justify-center", children: [
-            /* @__PURE__ */ jsx37("div", { className: "w-24 border border-[#E1EBF5]" }),
-            /* @__PURE__ */ jsx37("p", { className: "mb-2 text-body-2xs text-[#5F738C] font-normal", children: "Or" }),
-            /* @__PURE__ */ jsx37("div", { className: "w-24 border border-[#E1EBF5]" })
+          /* @__PURE__ */ jsxs26("div", { className: "flex gap-4 items-center justify-center", children: [
+            /* @__PURE__ */ jsx38("div", { className: "w-24 border border-[#E1EBF5]" }),
+            /* @__PURE__ */ jsx38("p", { className: "mb-2 text-body-2xs text-[#5F738C] font-normal", children: "Or" }),
+            /* @__PURE__ */ jsx38("div", { className: "w-24 border border-[#E1EBF5]" })
           ] }),
-          /* @__PURE__ */ jsxs25("div", { className: "mx-auto", children: [
-            /* @__PURE__ */ jsx37("p", { className: "mb-2 text-body-xs text-primary font-semibold text-center", children: "Scan to Pay" }),
-            /* @__PURE__ */ jsx37(IconQrCode, {})
+          /* @__PURE__ */ jsxs26("div", { className: "mx-auto", children: [
+            /* @__PURE__ */ jsx38("p", { className: "mb-2 text-body-xs text-primary font-semibold text-center", children: "Scan to Pay" }),
+            /* @__PURE__ */ jsx38(IconQrCode, {})
           ] })
         ] }),
-        /* @__PURE__ */ jsx37("div", { className: "flex flex-col gap-6", children: /* @__PURE__ */ jsx37(
+        /* @__PURE__ */ jsx38("div", { className: "flex flex-col gap-6", children: /* @__PURE__ */ jsx38(
           BaseButton,
           {
             label: "I have made this payment",
@@ -3768,7 +4137,8 @@ var PayByStableCoin = ({
 };
 
 // src/buzapay-checkout/checkout-card.tsx
-import { jsx as jsx38, jsxs as jsxs26 } from "react/jsx-runtime";
+import toast, { Toaster } from "react-hot-toast";
+import { jsx as jsx39, jsxs as jsxs27 } from "react/jsx-runtime";
 function BzpCheckoutCard({
   secretKey,
   environment = "sandbox",
@@ -3803,16 +4173,26 @@ function BzpCheckoutCard({
     setSuccessObject({ ...event });
     if (event.paymentStatus === "authorized") {
       setCheckoutState("SUCCESS");
+      toast.success("Payment authorization successful.", toastConfig);
+    } else if (event.paymentStatus === "confirmed") {
+      setCheckoutState("SUCCESS");
+      toast.success("Payment confirmed.", toastConfig);
     } else if (event.paymentStatus === "payment failed") {
       setCheckoutState("PENDING");
+      toast.error("Payment pending.", toastConfig);
     } else if (event.paymentStatus === "used") {
       setCheckoutState("USED");
     } else {
       setCheckoutState("PENDING");
+      toast.error("Payment pending.", toastConfig);
     }
     onPaymentAuthorized?.(event);
   };
-  useEffect6(() => {
+  const onErrorHandler = (error) => {
+    toast.error(error.errorMessage ?? "Payment failed.", toastConfig);
+    onError?.(error);
+  };
+  useEffect7(() => {
     let options = [];
     if (paymentObject.currency === "USD") {
       if (paymentObject.amount < 50) {
@@ -3831,103 +4211,106 @@ function BzpCheckoutCard({
     }
     setFilteredPaymentTypeOptions(options);
   }, [paymentObject.currency, paymentObject.amount]);
-  useEffect6(() => {
+  useEffect7(() => {
     if (filteredPaymentTypeOptions.length) {
       setPaymentType(filteredPaymentTypeOptions[0].value);
     }
   }, [filteredPaymentTypeOptions]);
-  return /* @__PURE__ */ jsx38(BaseCard, { children: /* @__PURE__ */ jsxs26("div", { className: "grid grid-cols-3", children: [
-    checkoutState === "PENDING" && /* @__PURE__ */ jsxs26("div", { className: "bg-[#EFF7FF] px-6 py-8 flex flex-col gap-5 col-span-1 rounded-l-xl", children: [
-      /* @__PURE__ */ jsx38("p", { className: "text-heading-text text-body-xs font-semibold", children: "Pay with" }),
-      /* @__PURE__ */ jsx38(
-        BaseRadioGroup,
+  return /* @__PURE__ */ jsxs27(BaseCard, { children: [
+    /* @__PURE__ */ jsx39(Toaster, {}),
+    /* @__PURE__ */ jsxs27("div", { className: "grid grid-cols-3", children: [
+      checkoutState === "PENDING" && /* @__PURE__ */ jsxs27("div", { className: "bg-[#EFF7FF] px-6 py-8 flex flex-col gap-5 col-span-1 rounded-l-xl", children: [
+        /* @__PURE__ */ jsx39("p", { className: "text-heading-text text-body-xs font-semibold", children: "Pay with" }),
+        /* @__PURE__ */ jsx39(
+          BaseRadioGroup,
+          {
+            options: filteredPaymentTypeOptions,
+            selectedChange: (e) => paymentTypeHandler(e)
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs27(
+        "div",
         {
-          options: filteredPaymentTypeOptions,
-          selectedChange: (e) => paymentTypeHandler(e)
-        }
-      )
-    ] }),
-    /* @__PURE__ */ jsxs26(
-      "div",
-      {
-        className: checkoutState === "SUCCESS" ? "col-span-3" : "col-span-2",
-        children: [
-          checkoutState === "PENDING" && /* @__PURE__ */ jsxs26("div", { className: "flex items-center justify-between px-12 py-8", children: [
-            paymentObject.logoUrl ? /* @__PURE__ */ jsx38(
-              BaseImage,
+          className: checkoutState === "SUCCESS" || checkoutState === "USED" && paymentType === "BANK_TRANSFER" ? "col-span-3" : "col-span-2",
+          children: [
+            checkoutState === "PENDING" && /* @__PURE__ */ jsxs27("div", { className: "flex items-center justify-between px-12 py-8", children: [
+              paymentObject.logoUrl ? /* @__PURE__ */ jsx39(
+                BaseImage,
+                {
+                  src: paymentObject.logoUrl ?? "",
+                  alt: "Merchant Logo",
+                  width: 52,
+                  height: 52,
+                  customClass: "rounded-lg object-fit"
+                }
+              ) : /* @__PURE__ */ jsx39(
+                "div",
+                {
+                  className: "bg-heading-text rounded flex flex-col justify-center",
+                  style: { width: "52px", height: "52px" },
+                  children: /* @__PURE__ */ jsx39("p", { className: "text-white text-center text-body-2xs font-medium", children: "Logo" })
+                }
+              ),
+              /* @__PURE__ */ jsxs27("div", { className: "flex flex-col gap-1", children: [
+                /* @__PURE__ */ jsx39("p", { className: "text-body-2xs font-regular text-sub-copy text-right", children: paymentObject.merchantName }),
+                /* @__PURE__ */ jsxs27("p", { className: "text-body-2xs font-regular text-sub-copy text-right", children: [
+                  "Pay:",
+                  " ",
+                  /* @__PURE__ */ jsx39("span", { className: "text-orange-500 font-extrabold", children: formatAmount(paymentObject.amount, paymentObject.currency) })
+                ] })
+              ] })
+            ] }),
+            checkoutState === "PENDING" && /* @__PURE__ */ jsx39("div", { className: "max-h-[32rem] overflow-y-scroll px-10 pb-10 pt-2", children: paymentType === "CARD" ? /* @__PURE__ */ jsx39(
+              PayByCard,
+              {
+                secretKey,
+                environment,
+                paymentObject,
+                onPaymentAuthorized: setSuccess,
+                onError: onErrorHandler
+              }
+            ) : paymentType === "BANK_TRANSFER" ? /* @__PURE__ */ jsx39(
+              PayByTransfer,
               {
-                src: paymentObject.logoUrl ?? "",
-                alt: "Merchant Logo",
-                width: 52,
-                height: 52,
-                customClass: "rounded-lg object-fit"
+                secretKey,
+                environment,
+                paymentObject,
+                onPaymentAuthorized: setSuccess,
+                onError: onErrorHandler
               }
-            ) : /* @__PURE__ */ jsx38(
-              "div",
+            ) : /* @__PURE__ */ jsx39(
+              PayByStableCoin,
               {
-                className: "bg-heading-text rounded flex flex-col justify-center",
-                style: { width: "52px", height: "52px" },
-                children: /* @__PURE__ */ jsx38("p", { className: "text-white text-center text-body-2xs font-medium", children: "Logo" })
+                secretKey,
+                environment,
+                paymentObject,
+                onPaymentAuthorized: setSuccess,
+                onError: onErrorHandler
               }
-            ),
-            /* @__PURE__ */ jsxs26("div", { className: "flex flex-col gap-1", children: [
-              /* @__PURE__ */ jsx38("p", { className: "text-body-2xs font-regular text-sub-copy text-right", children: paymentObject.merchantName }),
-              /* @__PURE__ */ jsxs26("p", { className: "text-body-2xs font-regular text-sub-copy text-right", children: [
-                "Pay:",
-                " ",
-                /* @__PURE__ */ jsx38("span", { className: "text-orange-500 font-extrabold", children: formatAmount(paymentObject.amount, paymentObject.currency) })
-              ] })
-            ] })
-          ] }),
-          checkoutState === "PENDING" && /* @__PURE__ */ jsx38("div", { className: "max-h-[32rem] overflow-y-scroll px-10 pb-10 pt-2", children: paymentType === "CARD" ? /* @__PURE__ */ jsx38(
-            PayByCard,
-            {
-              secretKey,
-              environment,
-              paymentObject,
-              onPaymentAuthorized: setSuccess,
-              onError
-            }
-          ) : paymentType === "BANK_TRANSFER" ? /* @__PURE__ */ jsx38(
-            PayByTransfer,
-            {
-              secretKey,
-              environment,
-              paymentObject,
-              onPaymentAuthorized: setSuccess,
-              onError
-            }
-          ) : /* @__PURE__ */ jsx38(
-            PayByStableCoin,
-            {
-              secretKey,
-              environment,
-              paymentObject,
-              onPaymentAuthorized: setSuccess,
-              onError
-            }
-          ) }),
-          checkoutState === "SUCCESS" && /* @__PURE__ */ jsx38(
-            BaseSuccess,
-            {
-              amount: paymentObject.amount,
-              currency: paymentObject.currency,
-              redirectUrl: paymentObject.redirectUrl ?? "",
-              successObject
-            }
-          )
-        ]
-      }
-    )
-  ] }) });
+            ) }),
+            checkoutState === "SUCCESS" || checkoutState === "USED" && paymentType === "BANK_TRANSFER" && /* @__PURE__ */ jsx39(
+              BaseSuccess,
+              {
+                amount: paymentObject.amount,
+                currency: paymentObject.currency,
+                redirectUrl: paymentObject.redirectUrl ?? "",
+                successObject
+              }
+            )
+          ]
+        }
+      )
+    ] })
+  ] });
 }
 
 // src/miden-checkout/checkout-button.tsx
 import { useState as useState9 } from "react";
 
 // src/miden-checkout/checkout-iframe.tsx
-import { useCallback as useCallback4, useEffect as useEffect7, useRef as useRef3, useState as useState8 } from "react";
-import { jsx as jsx39, jsxs as jsxs27 } from "react/jsx-runtime";
+import { useCallback as useCallback4, useEffect as useEffect8, useRef as useRef3, useState as useState8 } from "react";
+import { jsx as jsx40, jsxs as jsxs28 } from "react/jsx-runtime";
 function MidenCheckoutIframe({
   style = {
     width: "100%",
@@ -4011,18 +4394,18 @@ function MidenCheckoutIframe({
       setLoading(false);
     }
   };
-  useEffect7(() => {
+  useEffect8(() => {
     if (!containerRef.current) return;
     generatePaymentLinkHandler();
   }, []);
-  return /* @__PURE__ */ jsxs27("div", { className: "relative", style, children: [
-    /* @__PURE__ */ jsx39("div", { ref: containerRef, className: "w-full h-full" }),
-    loading && /* @__PURE__ */ jsx39("div", { className: "absolute inset-0 grid place-items-center bg-white/60", children: /* @__PURE__ */ jsx39(IconLoader, {}) })
+  return /* @__PURE__ */ jsxs28("div", { className: "relative", style, children: [
+    /* @__PURE__ */ jsx40("div", { ref: containerRef, className: "w-full h-full" }),
+    loading && /* @__PURE__ */ jsx40("div", { className: "absolute inset-0 grid place-items-center bg-white/60", children: /* @__PURE__ */ jsx40(IconLoader, {}) })
   ] });
 }
 
 // src/miden-checkout/checkout-button.tsx
-import { jsx as jsx40, jsxs as jsxs28 } from "react/jsx-runtime";
+import { jsx as jsx41, jsxs as jsxs29 } from "react/jsx-runtime";
 function MidenCheckoutButton({
   secretKey,
   environment = "sandbox",
@@ -4079,15 +4462,15 @@ function MidenCheckoutButton({
       setLoading(false);
     }
   };
-  return urlLaunchUrl && mode === "iframe" ? /* @__PURE__ */ jsx40(
+  return urlLaunchUrl && mode === "iframe" ? /* @__PURE__ */ jsx41(
     MidenCheckoutIframe,
     {
       url: urlLaunchUrl,
       secretKey,
       environment
     }
-  ) : /* @__PURE__ */ jsxs28("div", { children: [
-    /* @__PURE__ */ jsx40(
+  ) : /* @__PURE__ */ jsxs29("div", { children: [
+    /* @__PURE__ */ jsx41(
       BaseButton,
       {
         label: "Pay",
@@ -4098,13 +4481,14 @@ function MidenCheckoutButton({
         onClick: generatePaymentLinkHandler
       }
     ),
-    /* @__PURE__ */ jsx40(BaseInputError, { errorMessage: message })
+    /* @__PURE__ */ jsx41(BaseInputError, { errorMessage: message })
   ] });
 }
 
 // src/miden-checkout/checkout-card.tsx
-import { useEffect as useEffect8, useState as useState10 } from "react";
-import { jsx as jsx41, jsxs as jsxs29 } from "react/jsx-runtime";
+import { useEffect as useEffect9, useState as useState10 } from "react";
+import toast2, { Toaster as Toaster2 } from "react-hot-toast";
+import { jsx as jsx42, jsxs as jsxs30 } from "react/jsx-runtime";
 function MidenCheckoutCard({
   secretKey,
   options,
@@ -4140,22 +4524,32 @@ function MidenCheckoutCard({
     setSuccessObject({ ...event });
     if (event.paymentStatus === "authorized") {
       setCheckoutState("SUCCESS");
+      toast2.success("Payment authorization successful.", toastConfig);
+    } else if (event.paymentStatus === "confirmed") {
+      setCheckoutState("SUCCESS");
+      toast2.success("Payment confirmed.", toastConfig);
     } else if (event.paymentStatus === "payment failed") {
       setCheckoutState("PENDING");
+      toast2.error("Payment pending.", toastConfig);
     } else if (event.paymentStatus === "used") {
       setCheckoutState("USED");
     } else {
       setCheckoutState("PENDING");
+      toast2.error("Payment pending.", toastConfig);
     }
     onPaymentAuthorized?.(event);
   };
+  const onErrorHandler = (error) => {
+    toast2.error(error.errorMessage ?? "Payment failed.", toastConfig);
+    onError?.(error);
+  };
   const formatAmountHandler = () => {
     return formatAmount(paymentObject.amount, paymentObject.currency);
   };
   const formatChargeHandler = () => {
     return formatAmount(0, paymentObject.currency);
   };
-  useEffect8(() => {
+  useEffect9(() => {
     let options2 = [];
     if (paymentObject.currency === "USD") {
       if (paymentObject.amount < 50) {
@@ -4174,89 +4568,92 @@ function MidenCheckoutCard({
     }
     setFilteredPaymentTypeOptions(options2);
   }, [paymentObject.currency, paymentObject.amount]);
-  useEffect8(() => {
+  useEffect9(() => {
     if (filteredPaymentTypeOptions.length) {
       setPaymentType(filteredPaymentTypeOptions[0].value);
     }
   }, [filteredPaymentTypeOptions]);
-  return /* @__PURE__ */ jsx41(BaseCard, { caller: "miden", children: /* @__PURE__ */ jsxs29("div", { className: "grid grid-cols-3", children: [
-    checkoutState === "PENDING" && /* @__PURE__ */ jsxs29("div", { className: "bg-[#0A0032] py-6 flex flex-col gap-5 col-span-1 rounded-l-xl", children: [
-      /* @__PURE__ */ jsx41("p", { className: "text-white text-body-xs font-semibold px-6", children: "Pay with" }),
-      /* @__PURE__ */ jsx41(
-        BaseRadioGroup,
+  return /* @__PURE__ */ jsxs30(BaseCard, { caller: "miden", children: [
+    /* @__PURE__ */ jsx42(Toaster2, {}),
+    /* @__PURE__ */ jsxs30("div", { className: "grid grid-cols-3", children: [
+      checkoutState === "PENDING" && /* @__PURE__ */ jsxs30("div", { className: "bg-[#0A0032] py-6 flex flex-col gap-5 col-span-1 rounded-l-xl", children: [
+        /* @__PURE__ */ jsx42("p", { className: "text-white text-body-xs font-semibold px-6", children: "Pay with" }),
+        /* @__PURE__ */ jsx42(
+          BaseRadioGroup,
+          {
+            caller: "miden",
+            options: filteredPaymentTypeOptions,
+            selectedChange: (e) => paymentTypeHandler(e)
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs30(
+        "div",
         {
-          caller: "miden",
-          options: filteredPaymentTypeOptions,
-          selectedChange: (e) => paymentTypeHandler(e)
-        }
-      )
-    ] }),
-    /* @__PURE__ */ jsxs29(
-      "div",
-      {
-        className: checkoutState === "SUCCESS" ? "col-span-3" : "col-span-2",
-        children: [
-          checkoutState === "PENDING" && /* @__PURE__ */ jsxs29("div", { className: "flex items-center justify-between p-6", children: [
-            /* @__PURE__ */ jsx41(IconMidenLogo, {}),
-            /* @__PURE__ */ jsx41(IconClose, { color: "black", className: "cursor-pointer" })
-          ] }),
-          checkoutState === "PENDING" && /* @__PURE__ */ jsxs29("div", { className: "px-14 pt-4 pb-8 flex flex-col gap-6 max-h-[32rem] overflow-y-scroll", children: [
-            /* @__PURE__ */ jsxs29("div", { className: "flex items-center justify-between py-3 px-4 bg-[#F8FDFF] border border-[#DAE4E8] rounded-lg", children: [
-              /* @__PURE__ */ jsx41(
-                BaseLabelInfo,
+          className: checkoutState === "SUCCESS" ? "col-span-3" : "col-span-2",
+          children: [
+            checkoutState === "PENDING" && /* @__PURE__ */ jsxs30("div", { className: "flex items-center justify-between p-6", children: [
+              /* @__PURE__ */ jsx42(IconMidenLogo, {}),
+              /* @__PURE__ */ jsx42(IconClose, { color: "black", className: "cursor-pointer" })
+            ] }),
+            checkoutState === "PENDING" && /* @__PURE__ */ jsxs30("div", { className: "px-14 pt-4 pb-8 flex flex-col gap-6 max-h-[32rem] overflow-y-scroll", children: [
+              /* @__PURE__ */ jsxs30("div", { className: "flex items-center justify-between py-3 px-4 bg-[#F8FDFF] border border-[#DAE4E8] rounded-lg", children: [
+                /* @__PURE__ */ jsx42(
+                  BaseLabelInfo,
+                  {
+                    label: "Amount Due",
+                    value: formatAmountHandler()
+                  }
+                ),
+                /* @__PURE__ */ jsx42(BaseLabelInfo, { label: "Charges", value: formatChargeHandler() })
+              ] }),
+              /* @__PURE__ */ jsx42("div", { children: paymentType === "CARD" ? /* @__PURE__ */ jsx42(
+                PayByCard,
                 {
-                  label: "Amount Due",
-                  value: formatAmountHandler()
+                  secretKey,
+                  environment,
+                  caller: "miden",
+                  paymentObject,
+                  onPaymentAuthorized: setSuccess,
+                  onError: onErrorHandler
                 }
-              ),
-              /* @__PURE__ */ jsx41(BaseLabelInfo, { label: "Charges", value: formatChargeHandler() })
+              ) : paymentType === "BANK_TRANSFER" ? /* @__PURE__ */ jsx42(
+                PayByTransfer,
+                {
+                  secretKey,
+                  environment,
+                  caller: "miden",
+                  paymentObject,
+                  onPaymentAuthorized: setSuccess,
+                  onError: onErrorHandler
+                }
+              ) : /* @__PURE__ */ jsx42(
+                PayByStableCoin,
+                {
+                  secretKey,
+                  environment,
+                  caller: "miden",
+                  paymentObject,
+                  onPaymentAuthorized: setSuccess,
+                  onError: onErrorHandler
+                }
+              ) })
             ] }),
-            /* @__PURE__ */ jsx41("div", { children: paymentType === "CARD" ? /* @__PURE__ */ jsx41(
-              PayByCard,
-              {
-                secretKey,
-                environment,
-                caller: "miden",
-                paymentObject,
-                onPaymentAuthorized: setSuccess,
-                onError
-              }
-            ) : paymentType === "BANK_TRANSFER" ? /* @__PURE__ */ jsx41(
-              PayByTransfer,
-              {
-                secretKey,
-                environment,
-                caller: "miden",
-                paymentObject,
-                onPaymentAuthorized: setSuccess,
-                onError
-              }
-            ) : /* @__PURE__ */ jsx41(
-              PayByStableCoin,
+            checkoutState === "SUCCESS" && /* @__PURE__ */ jsx42(
+              BaseSuccess,
               {
-                secretKey,
-                environment,
+                amount: paymentObject.amount,
+                currency: paymentObject.currency,
                 caller: "miden",
-                paymentObject,
-                onPaymentAuthorized: setSuccess,
-                onError
+                redirectUrl: paymentObject.redirectUrl ?? "",
+                successObject
               }
-            ) })
-          ] }),
-          checkoutState === "SUCCESS" && /* @__PURE__ */ jsx41(
-            BaseSuccess,
-            {
-              amount: paymentObject.amount,
-              currency: paymentObject.currency,
-              caller: "miden",
-              redirectUrl: paymentObject.redirectUrl ?? "",
-              successObject
-            }
-          )
-        ]
-      }
-    )
-  ] }) });
+            )
+          ]
+        }
+      )
+    ] })
+  ] });
 }
 export {
   BzpCheckoutButton,