@zonos/elements 1.1.2 → 1.2.0

package/dist/components/localization.js

@@ -3154,7 +3154,7 @@ const handleFetch = async (url, _opts) => {
   const body = opts.body ? JSON.stringify(opts.body) : undefined;
   const method = opts.method || 'GET';
   // headers content type
-  const headers = Object.assign({ 'Content-Type': 'application/json', 'Zonos-Referer': window.location.hostname, credentialtoken: window.Zonos.zonosApiKey }, opts.headers);
+  const headers = Object.assign({ 'Content-Type': 'application/json', 'Zonos-Is-BigCommerce': window.Zonos.isBigCommerce.toString(), 'Zonos-Referer': window.location.hostname, 'Zonos-Version': window.Zonos.version, credentialtoken: window.Zonos.zonosApiKey }, opts.headers);
   const options = Object.assign(Object.assign({}, opts), { body: method === 'GET' ? undefined : body, headers,
     method });
   return handleRequest(url, options);
@@ -3194,9 +3194,9 @@ const getCountryLandedCost = async (countryCode) => {
   return json || null;
 };
 
-const getExchangeRate = async ({ country, sourceCurrency, targetCurrency, }) => {
+const getExchangeRate = async ({ country, isGuaranteed, sourceCurrency, targetCurrency, }) => {
   var _a;
-  const url = `${"https://v1.route.js.zonos.com"}/api/exchange-rates?sourceCurrency=${sourceCurrency}&targetCurrency=${targetCurrency}`;
+  const url = `${"https://v1.route.js.zonos.com"}/api/exchange-rates?sourceCurrency=${sourceCurrency}&targetCurrency=${targetCurrency}&isGuaranteed=${isGuaranteed}&country=${country}}`;
   const { errors, json } = await handleFetch(url);
   if (errors.length || !json) {
     logError(`Error fetching country landed cost: ${(_a = errors.find(Boolean)) === null || _a === void 0 ? void 0 : _a.message}`);
@@ -3225,7 +3225,9 @@ const getLocaleMessages = async ({ countryCode, localeTo, storeId, }) => {
 const getLocalization = async () => {
   try {
     const currentUrl = new URL(window.location.href);
-    const zonosCountry = currentUrl.searchParams.get('zonosCountry');
+    // load and use country from session storage when zonosCountry query param is not present
+    const countryLoadedSession = window.sessionStorage.getItem('zonos--country');
+    const zonosCountry = currentUrl.searchParams.get('zonosCountry') || countryLoadedSession;
     const fetchUrl = `${"https://v1.route.js.zonos.com"}/api/localization${zonosCountry ? `?zonosCountry=${zonosCountry}` : ''}`;
     const { errors, json } = await handleFetch(fetchUrl, {
       method: 'GET',
@@ -3466,6 +3468,7 @@ const { state: localizationStore } = createStore({
 const getNewLocalization = async () => {
   log('get new localization store');
   const { isShippableCountry, selectedCountryCode } = localizationStore;
+  const isGuaranteed = zonosStore.checkoutSettings.visibilityStatus === 'ENABLED';
   if (zonosStore.helloSettings.currencyBehavior === 'DISABLED' ||
     !isShippableCountry ||
     !selectedCountryCode) {
@@ -3473,6 +3476,7 @@ const getNewLocalization = async () => {
   }
   localizationStore.exchangeRate = await getExchangeRate({
     country: localizationStore.selectedCountryCode,
+    isGuaranteed,
     sourceCurrency: zonosStore.sourceCurrency,
     targetCurrency: localizationStore.targetCurrency,
   });
@@ -3525,6 +3529,8 @@ const localizationStoreUpdateSelectedCountryCode = async (newSelectedCountryCode
   localizationStore.targetCurrency = currencyCode;
   void getNewLocalization();
   void getCustomMessages();
+  // Save the country code to session storage for later use
+  window.sessionStorage.setItem('zonos--country', selectedCountryCode);
   // Update the URL query param with the new country code
   setZonosCountryUrlParam(selectedCountryCode);
 };
@@ -3556,6 +3562,4 @@ const initLocalizationStore = async () => {
   void getCustomMessages();
 };
 
-export { localizationStore as a, log as b, initLocalizationStore as c, localizationStoreUpdateSelectedCountryCode as d, currencyDisplay as e, currencyConvertAndFormat as f, currencyConvert as g, handleFetch as h, isValidSelector as i, currencyFormat as j, logError as l, setZonosCountryUrlParam as s, translate as t };
-
-//# sourceMappingURL=localization.js.map
+export { log as a, localizationStore as b, initLocalizationStore as c, localizationStoreUpdateSelectedCountryCode as d, currencyDisplay as e, currencyConvertAndFormat as f, currencyConvert as g, handleFetch as h, isValidSelector as i, currencyFormat as j, logError as l, setZonosCountryUrlParam as s, translate as t };

package/dist/components/submitGtag.js

@@ -1,5 +1,5 @@
 import { z as zonosStore } from './zonosStore.js';
-import { b as log } from './localization.js';
+import { a as log } from './localization.js';
 
 /**
  * Submit a gtag event if the gtag function is available.
@@ -17,5 +17,3 @@ const submitGtag = (event) => {
 };
 
 export { submitGtag as s };
-
-//# sourceMappingURL=submitGtag.js.map

package/dist/components/zonos-address.js

@@ -4,5 +4,3 @@ const ZonosAddress = ZonosAddress$1;
 const defineCustomElement = defineCustomElement$1;
 
 export { ZonosAddress, defineCustomElement };
-
-//# sourceMappingURL=zonos-address.js.map

package/dist/components/zonos-address2.js

@@ -1,6 +1,6 @@
 import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-import { s as stripeStore, a as stripeStorePrefetchLandedCost } from './stripe.js';
-import { l as logError, a as localizationStore } from './localization.js';
+import { s as stripeStore, k as stripeStorePrefetchLandedCost } from './cart.js';
+import { l as logError, b as localizationStore } from './localization.js';
 import { d as defineCustomElement$1 } from './zonos-text2.js';
 
 const zonosAddressCss = ".sc-zonos-address-h{font-family:Inter;display:block}.sc-zonos-address-h img.sc-zonos-address{max-width:100%}.sc-zonos-address-h dl.sc-zonos-address,.sc-zonos-address-h dd.sc-zonos-address,.sc-zonos-address-h h1.sc-zonos-address,.sc-zonos-address-h h2.sc-zonos-address,.sc-zonos-address-h h3.sc-zonos-address,.sc-zonos-address-h h4.sc-zonos-address,.sc-zonos-address-h h5.sc-zonos-address,.sc-zonos-address-h h6.sc-zonos-address,.sc-zonos-address-h hr.sc-zonos-address,.sc-zonos-address-h figure.sc-zonos-address,.sc-zonos-address-h p.sc-zonos-address,.sc-zonos-address-h pre.sc-zonos-address{margin:0}.sc-zonos-address-h{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}.sc-zonos-address-h .zonos--title.sc-zonos-address{margin-bottom:var(--amino-space-16)}";
@@ -97,5 +97,3 @@ function defineCustomElement() {
 }
 
 export { ZonosAddress as Z, defineCustomElement as d };
-
-//# sourceMappingURL=zonos-address2.js.map

package/dist/components/zonos-badge.js

@@ -4,5 +4,3 @@ const ZonosBadge = ZonosBadge$1;
 const defineCustomElement = defineCustomElement$1;
 
 export { ZonosBadge, defineCustomElement };
-
-//# sourceMappingURL=zonos-badge.js.map

package/dist/components/zonos-badge2.js

@@ -51,5 +51,3 @@ function defineCustomElement() {
 }
 
 export { ZonosBadge as Z, defineCustomElement as d };
-
-//# sourceMappingURL=zonos-badge2.js.map

package/dist/components/zonos-banner.js

@@ -4,5 +4,3 @@ const ZonosBanner = ZonosBanner$1;
 const defineCustomElement = defineCustomElement$1;
 
 export { ZonosBanner, defineCustomElement };
-
-//# sourceMappingURL=zonos-banner.js.map

package/dist/components/zonos-banner2.js

@@ -86,5 +86,3 @@ function defineCustomElement() {
 }
 
 export { ZonosBanner as Z, defineCustomElement as d };
-
-//# sourceMappingURL=zonos-banner2.js.map

package/dist/components/zonos-button.js

@@ -4,5 +4,3 @@ const ZonosButton = ZonosButton$1;
 const defineCustomElement = defineCustomElement$1;
 
 export { ZonosButton, defineCustomElement };
-
-//# sourceMappingURL=zonos-button.js.map

package/dist/components/zonos-button2.js

@@ -140,5 +140,3 @@ function defineCustomElement() {
 }
 
 export { ZonosButton as Z, defineCustomElement as d };
-
-//# sourceMappingURL=zonos-button2.js.map

package/dist/components/zonos-card.js

@@ -4,5 +4,3 @@ const ZonosCard = ZonosCard$1;
 const defineCustomElement = defineCustomElement$1;
 
 export { ZonosCard, defineCustomElement };
-
-//# sourceMappingURL=zonos-card.js.map

package/dist/components/zonos-card2.js

@@ -47,5 +47,3 @@ function defineCustomElement() {
 }
 
 export { ZonosCard as Z, defineCustomElement as d };
-
-//# sourceMappingURL=zonos-card2.js.map

package/dist/components/zonos-cart-items.js

@@ -4,5 +4,3 @@ const ZonosCartItems = ZonosCartItems$1;
 const defineCustomElement = defineCustomElement$1;
 
 export { ZonosCartItems, defineCustomElement };
-
-//# sourceMappingURL=zonos-cart-items.js.map

package/dist/components/zonos-cart-items2.js

@@ -1,5 +1,5 @@
 import { proxyCustomElement, HTMLElement, getAssetPath, h, Host } from '@stencil/core/internal/client';
-import { c as cartStore } from './stripe.js';
+import { c as cartStore } from './cart.js';
 import { f as formatCurrency } from './formatCurrency.js';
 import { d as defineCustomElement$1 } from './zonos-text2.js';
 
@@ -53,5 +53,3 @@ function defineCustomElement() {
 }
 
 export { ZonosCartItems as Z, defineCustomElement as d };
-
-//# sourceMappingURL=zonos-cart-items2.js.map

package/dist/components/zonos-cart-subtotal.js

@@ -4,5 +4,3 @@ const ZonosCartSubtotal = ZonosCartSubtotal$1;
 const defineCustomElement = defineCustomElement$1;
 
 export { ZonosCartSubtotal, defineCustomElement };
-
-//# sourceMappingURL=zonos-cart-subtotal.js.map

package/dist/components/zonos-cart-subtotal2.js

@@ -1,5 +1,5 @@
 import { proxyCustomElement, HTMLElement, h, Host, Fragment } from '@stencil/core/internal/client';
-import { c as cartStore } from './stripe.js';
+import { c as cartStore } from './cart.js';
 import { t as translate } from './localization.js';
 import { f as formatCurrency } from './formatCurrency.js';
 import { d as defineCustomElement$3 } from './zonos-badge2.js';
@@ -83,5 +83,3 @@ function defineCustomElement() {
 }
 
 export { ZonosCartSubtotal as Z, defineCustomElement as d };
-
-//# sourceMappingURL=zonos-cart-subtotal2.js.map

package/dist/components/zonos-checkout-finish.js

@@ -4,5 +4,3 @@ const ZonosCheckoutFinish = ZonosCheckoutFinish$1;
 const defineCustomElement = defineCustomElement$1;
 
 export { ZonosCheckoutFinish, defineCustomElement };
-
-//# sourceMappingURL=zonos-checkout-finish.js.map

package/dist/components/zonos-checkout-finish2.js

@@ -1,5 +1,5 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host, Fragment } from '@stencil/core/internal/client';
-import { s as stripeStore, l as stripeStoreRetrievePayment, j as stripeStoreReset } from './stripe.js';
+import { s as stripeStore, p as stripeStoreRetrievePayment, o as stripeStoreReset } from './cart.js';
 import { t as translate } from './localization.js';
 import { g as getBorderRadius } from './getBorderRadius.js';
 import { s as submitGtag } from './submitGtag.js';
@@ -38,6 +38,12 @@ const ZonosCheckoutFinish = /*@__PURE__*/ proxyCustomElement(class ZonosCheckout
         }
         else {
           submitGtag('zonos-checkout-success');
+          const successEvent = new CustomEvent('zonos-checkout-success', {
+            detail: {
+              message: 'Zonos Checkout successfully processed order',
+            },
+          });
+          document.dispatchEvent(successEvent);
         }
       }
       stripeStoreReset();
@@ -60,6 +66,7 @@ const ZonosCheckoutFinish = /*@__PURE__*/ proxyCustomElement(class ZonosCheckout
       this.notificationType = this.overrideNotification.type;
       this.notificationTitle = this.overrideNotification.title;
       this.notificationMessages = this.overrideNotification.messages;
+      this.isLoading = false;
       return;
     }
     void this.checkPaymentStatus();
@@ -115,5 +122,3 @@ function defineCustomElement() {
 }
 
 export { ZonosCheckoutFinish as Z, defineCustomElement as d };
-
-//# sourceMappingURL=zonos-checkout-finish2.js.map

package/dist/components/zonos-checkout-payment.js

@@ -4,5 +4,3 @@ const ZonosCheckoutPayment = ZonosCheckoutPayment$1;
 const defineCustomElement = defineCustomElement$1;
 
 export { ZonosCheckoutPayment, defineCustomElement };
-
-//# sourceMappingURL=zonos-checkout-payment.js.map

package/dist/components/zonos-checkout-payment2.js

@@ -1,5 +1,5 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { s as stripeStore, c as cartStore } from './stripe.js';
+import { s as stripeStore, c as cartStore } from './cart.js';
 import { t as translate } from './localization.js';
 import { f as formatCurrency } from './formatCurrency.js';
 import { s as submitGtag } from './submitGtag.js';
@@ -100,5 +100,3 @@ function defineCustomElement() {
 }
 
 export { ZonosCheckoutPayment as Z, defineCustomElement as d };
-
-//# sourceMappingURL=zonos-checkout-payment2.js.map

package/dist/components/zonos-checkout.js

@@ -1,6 +1,6 @@
 import { proxyCustomElement, HTMLElement, h, Host, Fragment } from '@stencil/core/internal/client';
-import { i as initStripeElements, c as cartStore, b as cartStoreUpdateItems, d as cartStoreReset, s as stripeStore, e as stripeStoreInitCheckoutSession, f as cartStoreUpdateToErrorState, a as stripeStorePrefetchLandedCost, g as cartStoreNextStep, h as stripeStoreConfirmPayment, j as stripeStoreReset, k as cartStorePreviousStep } from './stripe.js';
-import { b as log, a as localizationStore, t as translate } from './localization.js';
+import { l as initStripeElements, c as cartStore, h as cartStoreUpdateItems, g as cartStoreReset, s as stripeStore, m as stripeStoreInitCheckoutSession, j as cartStoreUpdateToErrorState, k as stripeStorePrefetchLandedCost, d as cartStoreNextStep, n as stripeStoreConfirmPayment, o as stripeStoreReset, e as cartStorePreviousStep } from './cart.js';
+import { b as localizationStore, a as log, t as translate } from './localization.js';
 import { z as zonosStore, m as mergeConfig } from './zonosStore.js';
 import { i as isCheckoutMobile, d as defineCustomElement$7 } from './zonos-review2.js';
 import { c as classes } from './classes.js';
@@ -55,6 +55,19 @@ const ZonosCheckout$1 = /*@__PURE__*/ proxyCustomElement(class ZonosCheckout ext
         overrideTheme: this.isMobile ? theme : undefined,
       });
     };
+    this.isShippableCountry = (showLog = true) => {
+      if (!localizationStore.localizationLoaded) {
+        return false;
+      }
+      // if localization is loaded and the localization is not a shippable country, keep the original click event
+      if (!localizationStore.isShippableCountry) {
+        if (showLog) {
+          log(`not shippable country`);
+        }
+        return false;
+      }
+      return true;
+    };
     this.getCurrentLocalePageEnum = () => {
       switch (cartStore.step) {
         case 'customer-info':
@@ -70,7 +83,6 @@ const ZonosCheckout$1 = /*@__PURE__*/ proxyCustomElement(class ZonosCheckout ext
     this.appearanceSettingsOverride = undefined;
     this.preview = false;
     this.mobile = false;
-    this.buttonAnchorElements = null;
     this.defaultAddress = null;
     this.forceDialogOpen = false;
     this.open = this.forceDialogOpen;
@@ -112,6 +124,7 @@ const ZonosCheckout$1 = /*@__PURE__*/ proxyCustomElement(class ZonosCheckout ext
     // if client secret doesn't exist, request a new one.
     if (!stripeStore.clientSecret) {
       const success = await stripeStoreInitCheckoutSession();
+      log(`stripeStoreInitCheckoutSession: ${success}`);
       if (!success) {
         return false;
       }
@@ -121,41 +134,46 @@ const ZonosCheckout$1 = /*@__PURE__*/ proxyCustomElement(class ZonosCheckout ext
     return true;
   }
   attachCheckout() {
-    if (!this.buttonAnchorElements) {
+    const buttonAnchorSelector = zonosStore.checkoutSettings.placeOrderButtonSelector;
+    if (!buttonAnchorSelector) {
       // do nothing if button element is not found
       return;
     }
+    const buttonAnchorElements = document.querySelectorAll(buttonAnchorSelector);
     // only attach event once, and looping through all of the button elements
-    this.buttonAnchorElements.forEach(button => {
+    buttonAnchorElements.forEach(button => {
       const isEventAttached = button.getAttribute('data-zonos-checkout-attached');
-      if (!isEventAttached) {
-        button.addEventListener('click', async (e) => {
-          if (!localizationStore.localizationLoaded) {
-            return;
-          }
-          // if localization is loaded and the localization is not a shippable country, keep the original click event
-          if (!localizationStore.isShippableCountry) {
-            log(`not shippable country`);
-            return;
-          }
-          e.preventDefault();
-          e.stopPropagation();
-          log('zonos checkout button clicked');
-          this.open = true;
+      if (isEventAttached) {
+        // do nothing if event is already attached
+        return;
+      }
+      button.addEventListener('click', async (e) => {
+        // do nothing if it's not shippable country
+        if (!this.isShippableCountry()) {
+          return;
+        }
+        e.preventDefault();
+        e.stopPropagation();
+        log('zonos checkout button clicked');
+        this.open = true;
+        try {
+          // buildCartDetail need to be catch since it may throw error
           const result = await this.buildCartAndInit();
           if (!result) {
-            cartStoreUpdateToErrorState({
-              messages: [
-                translate("There's been an error creating your checkout session. Please reload and try again or contact support if the error persists"),
-              ],
-              title: translate('Error creating Checkout'),
-            });
-            return;
+            throw new Error('Error building cart');
           }
           submitGtag('zonos-checkout-start');
-        });
-        button.setAttribute('data-zonos-checkout-attached', 'true');
-      }
+        }
+        catch (err) {
+          cartStoreUpdateToErrorState({
+            messages: [
+              translate("There's been an error creating your checkout session. Please reload and try again or contact support if the error persists"),
+            ],
+            title: translate('Error creating Checkout'),
+          });
+        }
+      });
+      button.setAttribute('data-zonos-checkout-attached', 'true');
     });
   }
   appearanceSettingsOverrideChanged() {
@@ -171,20 +189,38 @@ const ZonosCheckout$1 = /*@__PURE__*/ proxyCustomElement(class ZonosCheckout ext
   async init() {
     stripeStore.stripe = window.Zonos.stripe;
     this.stripe = window.Zonos.stripe;
-    // only init checkout if visitor's country is in the shipping zones.
-    const interval = setInterval(() => {
-      stripeStore.stripe = window.Zonos.stripe;
-      this.stripe = window.Zonos.stripe;
-      if (!localizationStore.localizationLoaded) {
+    const hideInternationalOrderInterval = setInterval(() => {
+      const internationalSelector = window.Zonos.internationalHideSelector;
+      if (!internationalSelector) {
+        // cleanup right away if selector is not found
+        clearInterval(hideInternationalOrderInterval);
         return;
       }
-      // if localization is loaded and the localization is not a shippable country, stop the interval and don't init checkout
-      // No need to check localization if it's preview mode
-      if (!localizationStore.isShippableCountry && !this.preview) {
-        log('not shippable country');
-        clearInterval(interval);
+      // hide the selector if it's international
+      const isInternationalOrder = this.isShippableCountry(false);
+      const selector = document.querySelectorAll(internationalSelector);
+      if (!isInternationalOrder) {
+        // show the selector when it's domestic
+        selector === null || selector === void 0 ? void 0 : selector.forEach(el => {
+          const element = el;
+          const display = element.getAttribute('data-zonos-checkout-original-display');
+          // fallback to initial (browser value) if "display" is not found
+          element.style.display = display || 'initial';
+        });
         return;
       }
+      selector === null || selector === void 0 ? void 0 : selector.forEach(el => {
+        const element = el;
+        const display = element.style.display;
+        // save the display state so we can restore it later
+        element.setAttribute('data-zonos-checkout-original-display', display);
+        element.style.display = 'none';
+      });
+    }, 100);
+    // only init checkout if visitor's country is in the shipping zones.
+    const interval = setInterval(() => {
+      stripeStore.stripe = window.Zonos.stripe;
+      this.stripe = window.Zonos.stripe;
       if (!this.stripe) {
         log('waiting for stripe to be loaded');
         return;
@@ -199,9 +235,13 @@ const ZonosCheckout$1 = /*@__PURE__*/ proxyCustomElement(class ZonosCheckout ext
       }
       else {
         this.attachCheckout();
+        // keep checking for checkout selector every 50ms just in case the selector is not loaded in the DOM yet
+        setInterval(() => {
+          this.attachCheckout();
+        }, 50);
       }
       clearInterval(interval);
-    }, 100);
+    }, 50);
     setTimeout(() => {
       // if localization is not loaded after 10 seconds, stop the interval and don't init checkout
       clearInterval(interval);
@@ -307,7 +347,9 @@ const ZonosCheckout$1 = /*@__PURE__*/ proxyCustomElement(class ZonosCheckout ext
     var _a;
     const dialogLoading = 
     // if it's last step, don't need to check stripe elements
-    (cartStore.step !== 'finish' && !stripeStore.stripeElements) ||
+    (cartStore.step !== 'finish' &&
+      cartStore.step !== 'error' &&
+      !stripeStore.stripeElements) ||
       stripeStore.isFetchingSession;
     const { colorPrimary, colorSecondary, logoUrl, style } = mergeConfig(zonosStore.appearance, this.appearanceSettingsOverride);
     const hasFooter = zonosStore.appearance.zonosAttribution === 'ENABLED';
@@ -358,7 +400,6 @@ const ZonosCheckout$1 = /*@__PURE__*/ proxyCustomElement(class ZonosCheckout ext
     "appearanceSettingsOverride": [16],
     "preview": [4],
     "mobile": [4],
-    "buttonAnchorElements": [16],
     "defaultAddress": [16],
     "forceDialogOpen": [4, "force-dialog-open"],
     "open": [32],
@@ -510,5 +551,3 @@ const ZonosCheckout = ZonosCheckout$1;
 const defineCustomElement = defineCustomElement$1;
 
 export { ZonosCheckout, defineCustomElement };
-
-//# sourceMappingURL=zonos-checkout.js.map

package/dist/components/zonos-collapse.js

@@ -4,5 +4,3 @@ const ZonosCollapse = ZonosCollapse$1;
 const defineCustomElement = defineCustomElement$1;
 
 export { ZonosCollapse, defineCustomElement };
-
-//# sourceMappingURL=zonos-collapse.js.map

package/dist/components/zonos-collapse2.js

@@ -53,5 +53,3 @@ function defineCustomElement() {
 }
 
 export { ZonosCollapse as Z, defineCustomElement as d };
-
-//# sourceMappingURL=zonos-collapse2.js.map

package/dist/components/zonos-component.js

@@ -45,5 +45,3 @@ const ZonosComponent = ZonosComponent$1;
 const defineCustomElement = defineCustomElement$1;
 
 export { ZonosComponent, defineCustomElement };
-
-//# sourceMappingURL=zonos-component.js.map

package/dist/components/zonos-controller.js

@@ -1,6 +1,6 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { s as stripeStore } from './stripe.js';
-import { h as handleFetch, l as logError, i as isValidSelector, b as log, c as initLocalizationStore, d as localizationStoreUpdateSelectedCountryCode } from './localization.js';
+import { s as stripeStore } from './cart.js';
+import { h as handleFetch, l as logError, i as isValidSelector, a as log, c as initLocalizationStore, d as localizationStoreUpdateSelectedCountryCode } from './localization.js';
 import { z as zonosStore, d as zonosStoreInitSetting } from './zonosStore.js';
 import { d as defineCustomElement$3 } from './zonos-notification2.js';
 import { d as defineCustomElement$2 } from './zonos-text2.js';
@@ -15,12 +15,11 @@ const getZonosSetting = async () => {
   return { errors: [], json };
 };
 
-const injectCheckoutElement = (triggerAnchorElement) => {
+const injectCheckoutElement = () => {
   // append checkout component if doesn't exist
   const checkoutElement = document.querySelector('zonos-checkout');
   if (!checkoutElement) {
     const newCheckoutElement = document.createElement('zonos-checkout');
-    newCheckoutElement.buttonAnchorElements = triggerAnchorElement;
     document.body.appendChild(newCheckoutElement);
   }
 };
@@ -34,8 +33,7 @@ const initCheckout = async (config) => {
     logError(`Selector checkoutButtonAnchor "${config.placeOrderButtonSelector}" is not a valid selector`);
     return;
   }
-  const triggerElement = document.querySelectorAll(config.placeOrderButtonSelector);
-  injectCheckoutElement(triggerElement);
+  injectCheckoutElement();
 };
 
 const injectHelloComponent = (triggerAnchorElement) => {
@@ -196,5 +194,3 @@ const ZonosController = ZonosController$1;
 const defineCustomElement = defineCustomElement$1;
 
 export { ZonosController, defineCustomElement };
-
-//# sourceMappingURL=zonos-controller.js.map

package/dist/components/zonos-country-flag.js

@@ -4,5 +4,3 @@ const ZonosCountryFlag = ZonosCountryFlag$1;
 const defineCustomElement = defineCustomElement$1;
 
 export { ZonosCountryFlag, defineCustomElement };
-
-//# sourceMappingURL=zonos-country-flag.js.map

package/dist/components/zonos-country-flag2.js

@@ -1,5 +1,5 @@
 import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-import { a as localizationStore } from './localization.js';
+import { b as localizationStore } from './localization.js';
 import { c as classes } from './classes.js';
 
 const zonosCountryFlagCss = ":host{font-family:Inter;display:block}:host img{max-width:100%}:host dl,:host dd,:host h1,:host h2,:host h3,:host h4,:host h5,:host h6,:host hr,:host figure,:host p,:host pre{margin:0}:host{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}:host{display:-ms-inline-flexbox;display:inline-flex}:host .flag-container{position:relative;overflow:hidden;width:100%;height:100%}:host .flag-icon{position:absolute;top:0;left:0;width:100%;height:100%;background-position:center;background-repeat:no-repeat;background-size:cover}";
@@ -48,5 +48,3 @@ function defineCustomElement() {
 }
 
 export { ZonosCountryFlag as Z, defineCustomElement as d };
-
-//# sourceMappingURL=zonos-country-flag2.js.map

package/dist/components/zonos-country-select.js

@@ -4,5 +4,3 @@ const ZonosCountrySelect = ZonosCountrySelect$1;
 const defineCustomElement = defineCustomElement$1;
 
 export { ZonosCountrySelect, defineCustomElement };
-
-//# sourceMappingURL=zonos-country-select.js.map

package/dist/components/zonos-country-select2.js

@@ -1,5 +1,5 @@
 import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-import { d as localizationStoreUpdateSelectedCountryCode, t as translate, a as localizationStore } from './localization.js';
+import { d as localizationStoreUpdateSelectedCountryCode, t as translate, b as localizationStore } from './localization.js';
 import { d as defineCustomElement$6 } from './zonos-button2.js';
 import { d as defineCustomElement$5 } from './zonos-country-flag2.js';
 import { d as defineCustomElement$4 } from './zonos-icon2.js';
@@ -1874,5 +1874,3 @@ function defineCustomElement() {
 }
 
 export { ZonosCountrySelect as Z, defineCustomElement as d };
-
-//# sourceMappingURL=zonos-country-select2.js.map

package/dist/components/zonos-custom-message.js

@@ -4,5 +4,3 @@ const ZonosCustomMessage = ZonosCustomMessage$1;
 const defineCustomElement = defineCustomElement$1;
 
 export { ZonosCustomMessage, defineCustomElement };
-
-//# sourceMappingURL=zonos-custom-message.js.map

package/dist/components/zonos-custom-message2.js

@@ -51,5 +51,3 @@ function defineCustomElement() {
 }
 
 export { ZonosCustomMessage as Z, defineCustomElement as d };
-
-//# sourceMappingURL=zonos-custom-message2.js.map

package/dist/components/zonos-customer-info.js

@@ -4,5 +4,3 @@ const ZonosCustomerInfo = ZonosCustomerInfo$1;
 const defineCustomElement = defineCustomElement$1;
 
 export { ZonosCustomerInfo, defineCustomElement };
-
-//# sourceMappingURL=zonos-customer-info.js.map

package/dist/components/zonos-customer-info2.js

@@ -1,5 +1,5 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { s as stripeStore } from './stripe.js';
+import { s as stripeStore } from './cart.js';
 import { t as translate } from './localization.js';
 import { s as submitGtag } from './submitGtag.js';
 import { d as defineCustomElement$5 } from './zonos-address2.js';
@@ -8,7 +8,7 @@ import { d as defineCustomElement$3 } from './zonos-link-authentication2.js';
 import { d as defineCustomElement$2 } from './zonos-spinner2.js';
 import { d as defineCustomElement$1 } from './zonos-text2.js';
 
-const zonosCustomerInfoCss = ".sc-zonos-customer-info-h{font-family:Inter;display:block}.sc-zonos-customer-info-h img.sc-zonos-customer-info{max-width:100%}.sc-zonos-customer-info-h dl.sc-zonos-customer-info,.sc-zonos-customer-info-h dd.sc-zonos-customer-info,.sc-zonos-customer-info-h h1.sc-zonos-customer-info,.sc-zonos-customer-info-h h2.sc-zonos-customer-info,.sc-zonos-customer-info-h h3.sc-zonos-customer-info,.sc-zonos-customer-info-h h4.sc-zonos-customer-info,.sc-zonos-customer-info-h h5.sc-zonos-customer-info,.sc-zonos-customer-info-h h6.sc-zonos-customer-info,.sc-zonos-customer-info-h hr.sc-zonos-customer-info,.sc-zonos-customer-info-h figure.sc-zonos-customer-info,.sc-zonos-customer-info-h p.sc-zonos-customer-info,.sc-zonos-customer-info-h pre.sc-zonos-customer-info{margin:0}.sc-zonos-customer-info-h{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}.sc-zonos-customer-info-h{overflow:hidden;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.sc-zonos-customer-info-h .zonos--title.sc-zonos-customer-info{margin-bottom:var(--amino-space-20)}.sc-zonos-customer-info-h .zonos--link-authentication.sc-zonos-customer-info{margin-bottom:var(--amino-space-32)}.sc-zonos-customer-info-h .zonos--group.sc-zonos-customer-info{margin-bottom:var(--amino-space-20);overflow:auto;padding:0 5px}.sc-zonos-customer-info-h .zonos--group.sc-zonos-customer-info::-webkit-scrollbar{width:10px}.sc-zonos-customer-info-h .zonos--group.sc-zonos-customer-info::-webkit-scrollbar-track{background:var(--amino-gray-50)}.sc-zonos-customer-info-h .zonos--group.sc-zonos-customer-info::-webkit-scrollbar-thumb{border-radius:10px;background:#cccccc;border:3px solid transparent;background-clip:content-box}.sc-zonos-customer-info-h .zonos--group.sc-zonos-customer-info::-webkit-scrollbar-thumb:hover{background:#d6d6d6}.sc-zonos-customer-info-h zonos-button.sc-zonos-customer-info{width:100%}";
+const zonosCustomerInfoCss = ".sc-zonos-customer-info-h{font-family:Inter;display:block}.sc-zonos-customer-info-h img.sc-zonos-customer-info{max-width:100%}.sc-zonos-customer-info-h dl.sc-zonos-customer-info,.sc-zonos-customer-info-h dd.sc-zonos-customer-info,.sc-zonos-customer-info-h h1.sc-zonos-customer-info,.sc-zonos-customer-info-h h2.sc-zonos-customer-info,.sc-zonos-customer-info-h h3.sc-zonos-customer-info,.sc-zonos-customer-info-h h4.sc-zonos-customer-info,.sc-zonos-customer-info-h h5.sc-zonos-customer-info,.sc-zonos-customer-info-h h6.sc-zonos-customer-info,.sc-zonos-customer-info-h hr.sc-zonos-customer-info,.sc-zonos-customer-info-h figure.sc-zonos-customer-info,.sc-zonos-customer-info-h p.sc-zonos-customer-info,.sc-zonos-customer-info-h pre.sc-zonos-customer-info{margin:0}.sc-zonos-customer-info-h{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}.sc-zonos-customer-info-h{overflow:hidden;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.sc-zonos-customer-info-h .zonos--title.sc-zonos-customer-info{margin-bottom:var(--amino-space-20)}.sc-zonos-customer-info-h .zonos--link-authentication.sc-zonos-customer-info{margin-bottom:var(--amino-space-32)}.sc-zonos-customer-info-h .zonos--group.sc-zonos-customer-info{margin-bottom:var(--amino-space-20);overflow:auto;padding:5px}.sc-zonos-customer-info-h .zonos--group.sc-zonos-customer-info::-webkit-scrollbar{width:10px}.sc-zonos-customer-info-h .zonos--group.sc-zonos-customer-info::-webkit-scrollbar-track{background:var(--amino-gray-50)}.sc-zonos-customer-info-h .zonos--group.sc-zonos-customer-info::-webkit-scrollbar-thumb{border-radius:10px;background:#cccccc;border:3px solid transparent;background-clip:content-box}.sc-zonos-customer-info-h .zonos--group.sc-zonos-customer-info::-webkit-scrollbar-thumb:hover{background:#d6d6d6}.sc-zonos-customer-info-h zonos-button.sc-zonos-customer-info{width:100%}";
 
 const ZonosCustomerInfo = /*@__PURE__*/ proxyCustomElement(class ZonosCustomerInfo extends HTMLElement {
   constructor() {
@@ -99,5 +99,3 @@ function defineCustomElement() {
 }
 
 export { ZonosCustomerInfo as Z, defineCustomElement as d };
-
-//# sourceMappingURL=zonos-customer-info2.js.map

package/dist/components/zonos-dialog.js

@@ -4,5 +4,3 @@ const ZonosDialog = ZonosDialog$1;
 const defineCustomElement = defineCustomElement$1;
 
 export { ZonosDialog, defineCustomElement };
-
-//# sourceMappingURL=zonos-dialog.js.map

package/dist/components/zonos-dialog2.js

@@ -119,5 +119,3 @@ function defineCustomElement() {
 }
 
 export { ZonosDialog as Z, defineCustomElement as d };
-
-//# sourceMappingURL=zonos-dialog2.js.map