@zonos/elements 1.3.41 → 1.3.42

package/dist/cjs/{cart-497bb434.js → cart-99a1ed87.js}

@@ -6866,12 +6866,6 @@ const handleRequest = async (url, options) => {
     const usingZonosPreview = window.Zonos.zonosQaUrl;
     // We only want to alert once if the user is in preview mode and it's also using production environment
     if (!window.Zonos.modeAlerted && zonosMode && usingZonosPreview) {
-        if (zonosMode === 'production') {
-            alert(`Please be aware that you are currently operating in the production environment. Any interactions with the customer store, including payments, will be processed as real transactions!`);
-        }
-        if (zonosMode === 'test') {
-            alert(`For testing payments, you can utilize the test payment information provided at this link: https://stripe.com/docs/payments/accept-a-payment?platform=web&ui=elements#web-test-the-integration`);
-        }
         window.Zonos.modeAlerted = true;
     }
     if (response.ok) {
@@ -7219,7 +7213,10 @@ const convertCurrency = (element) => {
             });
         // default to the currencyConvertAndFormat if the currencyConverter function does not return a value, or invalid value. This is to make sure we don't break the merchant's price.
         const observedFormattedValue = customizedCurrencyFormat || currencyConvertAndFormat(amount);
-        element.textContent = observedFormattedValue;
+        if (observedFormattedValue !== element.textContent) {
+            // Only set textContent if the value has changed, this is to prevent it redrawing the element if the value is the same
+            element.textContent = observedFormattedValue;
+        }
         // save the new rate to the data-zrate attribute
         element.setAttribute('data-zrate', rate.toString());
         // save the new value to the data-zintl attribute

package/dist/cjs/index.cjs.js

@@ -40,7 +40,7 @@ const checkIfLoadVersionDomain = ({ loadScriptSrc }) => {
     return { currentLoadScriptUrl, isForceLoadVersionDomain, isWhiteListed };
 };
 
-const fallbackList = ['jsdelivr', 'unpkg', 'vercel'];
+const fallbackList = ['jsdelivr', 'cdnjs', 'unpkg', 'vercel'];
 /**
  * Get the next cdn type in the fallback list
  * @param currentCdnType The current cdn type that want to get the next fallback url
@@ -84,10 +84,21 @@ const extractZonosQaUrl = (url) => {
  * Get the Zonos QA URL and return it. Will remove `zonosQaUrl` from the url query if it doesn't exists.
  */
 const getZonosQaUrl = () => {
-    if (typeof window === 'undefined') {
+    /**
+     * This is flag to force load cdn for testing purpose
+     * When developing, if the script load is from `dev.elements.zonos.com`,
+     * it would load script from that same domain instead of loading from cdn
+     */
+    const shoudForceLoadCdn = window && window.location.href.includes('forceLoadCdn');
+    if (typeof window === 'undefined' || shoudForceLoadCdn) {
         return null;
     }
     const qaUrl = extractZonosQaUrl(window.location.href);
+    const cdnUrl = "https://v1.3.42.js.zonos.com";
+    // when the qaUrl is not set and the built URL is from the test domain, use the test domain for testing
+    if (!qaUrl && cdnUrl.includes('test.')) {
+        return cdnUrl;
+    }
     // when local demo app is running, it needs to use the local dev script unless the qaUrl is set
     if (!qaUrl && window.location.hostname === 'dev.demo.elements.zonos.com') {
         return 'https://dev.elements.zonos.com';
@@ -253,9 +264,10 @@ const zonosLoadUrl = (() => {
     }
     return null;
 })();
-const ZONOS_URL = "https://v1.3.41.js.zonos.com";
-const JS_DELIVR_ZONOS_URL = zonosLoadUrl || "https://cdn.jsdelivr.net/npm/@zonos/elements@1.3.41";
-const UNPKG_ZONOS_URL = "https://unpkg.com/@zonos/elements@1.3.41";
+const ZONOS_URL = "https://v1.3.42.js.zonos.com";
+const JS_DELIVR_ZONOS_URL = zonosLoadUrl || "https://cdn.jsdelivr.net/npm/@zonos/elements@1.3.42";
+const UNPKG_ZONOS_URL = "https://unpkg.com/@zonos/elements@1.3.42";
+const CDNJS_ZONOS_URL = "https://cdnjs.cloudflare.com/ajax/libs/zonos-elements/1.3.42";
 const MAIN_LOAD_CDN_TYPE = 'jsdelivr';
 const INTER_FONT_URL = 'https://rsms.me';
 const GOOGLE_FONT_URL = 'https://fonts.googleapis.com';
@@ -276,7 +288,7 @@ Zonos.isBigCommerce = false;
  */
 Zonos.isNpm = true;
 Zonos.zonosQaUrl = null;
-Zonos.version = `v${"1.3.41"}`;
+Zonos.version = `v${"1.3.42"}`;
 Zonos.modeAlerted = false;
 Zonos.tempCartData = null;
 Zonos.paypal = null;
@@ -476,7 +488,9 @@ Zonos.getZonosUrl = (type) => {
                 return JS_DELIVR_ZONOS_URL;
             case 'unpkg':
                 return UNPKG_ZONOS_URL;
-            default:
+            case 'cdnjs':
+                return CDNJS_ZONOS_URL;
+            case 'vercel':
                 return ZONOS_URL;
         }
     };

package/dist/cjs/{paypal-e65a287a.js → paypal-5509a76f.js}

@@ -1,7 +1,7 @@
 'use strict';
 
 const zonosStore = require('./zonosStore-56401fdb.js');
-const cart = require('./cart-497bb434.js');
+const cart = require('./cart-99a1ed87.js');
 const isDarkColor = require('./isDarkColor-4eb96a1e.js');
 const logError = require('./logError-4e2f2020.js');
 

package/dist/cjs/{sendErrorLog-c3c315a9.js → sendErrorLog-21996939.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-const cart = require('./cart-497bb434.js');
+const cart = require('./cart-99a1ed87.js');
 const zonosStore = require('./zonosStore-56401fdb.js');
 
 const trackConversionEvent = async (eventName, metadata) => {

package/dist/cjs/zonos-address_8.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-d56e0a8b.js');
-const cart = require('./cart-497bb434.js');
+const cart = require('./cart-99a1ed87.js');
 const isCheckoutMobile = require('./isCheckoutMobile-f491ca7c.js');
 const logError = require('./logError-4e2f2020.js');
 const containsNonLatinChars = require('./containsNonLatinChars-2be5129b.js');

package/dist/cjs/zonos-cart-items_12.cjs.entry.js

@@ -3,11 +3,11 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-d56e0a8b.js');
-const cart = require('./cart-497bb434.js');
+const cart = require('./cart-99a1ed87.js');
 const classes = require('./classes-b7918f56.js');
-const paypal = require('./paypal-e65a287a.js');
+const paypal = require('./paypal-5509a76f.js');
 const zonosStore = require('./zonosStore-56401fdb.js');
-const sendErrorLog = require('./sendErrorLog-c3c315a9.js');
+const sendErrorLog = require('./sendErrorLog-21996939.js');
 const getBorderRadius = require('./getBorderRadius-4413e191.js');
 const isCheckoutMobile = require('./isCheckoutMobile-f491ca7c.js');
 const ILanguage = require('./ILanguage-98b04442.js');

package/dist/cjs/zonos-checkout.cjs.entry.js

@@ -3,10 +3,10 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-d56e0a8b.js');
-const cart = require('./cart-497bb434.js');
-const paypal = require('./paypal-e65a287a.js');
+const cart = require('./cart-99a1ed87.js');
+const paypal = require('./paypal-5509a76f.js');
 const zonosStore = require('./zonosStore-56401fdb.js');
-const sendErrorLog = require('./sendErrorLog-c3c315a9.js');
+const sendErrorLog = require('./sendErrorLog-21996939.js');
 const isCheckoutMobile = require('./isCheckoutMobile-f491ca7c.js');
 const logError = require('./logError-4e2f2020.js');
 const classes = require('./classes-b7918f56.js');

package/dist/cjs/zonos-controller.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-d56e0a8b.js');
-const cart = require('./cart-497bb434.js');
+const cart = require('./cart-99a1ed87.js');
 const zonosStore = require('./zonosStore-56401fdb.js');
 const logError = require('./logError-4e2f2020.js');
 require('./isDarkColor-4eb96a1e.js');

package/dist/cjs/zonos-country-flag.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-d56e0a8b.js');
-const cart = require('./cart-497bb434.js');
+const cart = require('./cart-99a1ed87.js');
 const zonosStore = require('./zonosStore-56401fdb.js');
 const classes = require('./classes-b7918f56.js');
 require('./logError-4e2f2020.js');

package/dist/cjs/zonos-country-select_4.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-d56e0a8b.js');
-const cart = require('./cart-497bb434.js');
+const cart = require('./cart-99a1ed87.js');
 const zonosStore = require('./zonosStore-56401fdb.js');
 const formatStringWithLinks = require('./formatStringWithLinks-52341fc7.js');
 const isDarkColor = require('./isDarkColor-4eb96a1e.js');
@@ -1822,7 +1822,7 @@ const ZonosCountrySelect = class {
     componentDidRender() {
         var _a, _b;
         // focus the input on render
-        (_b = (_a = this.ele.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.zonos--country-filter-content')) === null || _b === void 0 ? void 0 : _b.focus();
+        (_b = (_a = this.ele.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.zonos--country-filter-input')) === null || _b === void 0 ? void 0 : _b.focus();
     }
     render() {
         const { helloCountryList } = cart.localizationStore;
@@ -1837,9 +1837,9 @@ const ZonosCountrySelect = class {
             ? fuseObject.map(country => country.item)
             : countries.sort((a, b) => a.displayName.localeCompare(b.displayName));
         const isEmpty = !filteredCountries.length;
-        return (index.h(index.Host, { key: '1e17d188428f8caeb495389f7870c3052d3cfb4a', class: "zonos--elements", style: {
+        return (index.h(index.Host, { key: 'd6d6a0736660d0c6e76f749f8ea78a8c95825b88', class: "zonos--elements", style: {
                 '--font-family': zonosStore.zonosStoreFontFamily(),
-            } }, index.h("div", { key: '2f6d0f239a4fad7c48349878b53dc8cb426aa022', class: "zonos--country-select" }, index.h("zonos-v-stack", { key: '76ad667603fce800457dae6d8951abe97e5db9d8', class: "zonos--country-select-header", spacing: 8 }, index.h("zonos-select-dialog-header", { key: '091416c3c6b91d3b50dd033d8bca0df79841871b', handleOnClose: () => this.handleOnClose(), label: cart.translate('Select a country') }, index.h("input", { key: '0c5d12e941bf7824594ebdd4b353ba833b6d9418', class: "zonos--country-select-input", onInput: this.handleInputChange, placeholder: cart.translate('Search countries'), value: this.inputValue }))), index.h("div", { key: '9ff13fd2b3528ddff2bd379baa0b2ec919a6f928', class: "zonos--country-select-content" }, isEmpty && (index.h("zonos-text", { key: '9cf46a7a706d335930eeedcc3663571c5dbaaafc', class: "no-country", textColor: "gray-800" }, cart.translate('No countries found'))), index.h("zonos-virtual-scroll", { key: '297237f0e2179ea95a49ae4872f6cc216026dd47', class: "zonos--country-filter-content", fallbackItemHeight: 34, itemHeights: filteredCountries.map(() => 34), renderItem: index$1 => {
+            } }, index.h("div", { key: '0bc3773965c49f0ee4da2056b6acc0ae361e227a', class: "zonos--country-select" }, index.h("zonos-v-stack", { key: '9e00877189dc39b789861c0425702d276cdad410', class: "zonos--country-select-header", spacing: 8 }, index.h("zonos-select-dialog-header", { key: '9c098afdf6db8ef8e18dc855e19ab6d45b7db8be', handleOnClose: () => this.handleOnClose(), label: cart.translate('Select a country') }, index.h("input", { key: '10c59b07a42da02fb348e289dc0211ae33b96638', autocomplete: "off", autofocus: "autofocus", class: "zonos--country-select-input", onInput: this.handleInputChange, placeholder: cart.translate('Search countries'), value: this.inputValue }))), index.h("div", { key: 'fec8fb874726377a3c4a03ac5d264fc7d8a94a21', class: "zonos--country-select-content" }, isEmpty && (index.h("zonos-text", { key: '182fb6955798519e63d63121752bc65ac6045770', class: "no-country", textColor: "gray-800" }, cart.translate('No countries found'))), index.h("zonos-virtual-scroll", { key: '3ccda154b37344857595d65ce3131ca6d2610a11', class: "zonos--country-filter-content", fallbackItemHeight: 34, itemHeights: filteredCountries.map(() => 34), renderItem: index$1 => {
                 const country = filteredCountries[index$1];
                 if (!country) {
                     return null;

package/dist/cjs/zonos-hello-dialog.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-d56e0a8b.js');
-const cart = require('./cart-497bb434.js');
+const cart = require('./cart-99a1ed87.js');
 const zonosStore = require('./zonosStore-56401fdb.js');
 const classes = require('./classes-b7918f56.js');
 const formatStringWithLinks = require('./formatStringWithLinks-52341fc7.js');

package/dist/cjs/zonos-hello.cjs.entry.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-d56e0a8b.js');
 const zonosStore = require('./zonosStore-56401fdb.js');
-const cart = require('./cart-497bb434.js');
+const cart = require('./cart-99a1ed87.js');
 const classes = require('./classes-b7918f56.js');
 const logError = require('./logError-4e2f2020.js');
 const getHasMoreSpaceOnRight = require('./getHasMoreSpaceOnRight-4c94667f.js');

package/dist/cjs/zonos-language-select_2.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-d56e0a8b.js');
-const cart = require('./cart-497bb434.js');
+const cart = require('./cart-99a1ed87.js');
 const zonosStore = require('./zonosStore-56401fdb.js');
 const ILanguage = require('./ILanguage-98b04442.js');
 require('./logError-4e2f2020.js');

package/dist/cjs/zonos-notification_3.cjs.entry.js

@@ -5,9 +5,9 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-d56e0a8b.js');
 const zonosStore = require('./zonosStore-56401fdb.js');
 const classes = require('./classes-b7918f56.js');
-const cart = require('./cart-497bb434.js');
+const cart = require('./cart-99a1ed87.js');
 const logError = require('./logError-4e2f2020.js');
-const paypal = require('./paypal-e65a287a.js');
+const paypal = require('./paypal-5509a76f.js');
 require('./isDarkColor-4eb96a1e.js');
 require('./getBorderRadius-4413e191.js');
 

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

@@ -29,7 +29,7 @@ export class ZonosCountrySelect {
     componentDidRender() {
         var _a, _b;
         // focus the input on render
-        (_b = (_a = this.ele.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.zonos--country-filter-content')) === null || _b === void 0 ? void 0 : _b.focus();
+        (_b = (_a = this.ele.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.zonos--country-filter-input')) === null || _b === void 0 ? void 0 : _b.focus();
     }
     render() {
         const { helloCountryList } = localizationStore;
@@ -44,9 +44,9 @@ export class ZonosCountrySelect {
             ? fuseObject.map(country => country.item)
             : countries.sort((a, b) => a.displayName.localeCompare(b.displayName));
         const isEmpty = !filteredCountries.length;
-        return (h(Host, { key: '1e17d188428f8caeb495389f7870c3052d3cfb4a', class: "zonos--elements", style: {
+        return (h(Host, { key: 'd6d6a0736660d0c6e76f749f8ea78a8c95825b88', class: "zonos--elements", style: {
                 '--font-family': zonosStoreFontFamily(),
-            } }, h("div", { key: '2f6d0f239a4fad7c48349878b53dc8cb426aa022', class: "zonos--country-select" }, h("zonos-v-stack", { key: '76ad667603fce800457dae6d8951abe97e5db9d8', class: "zonos--country-select-header", spacing: 8 }, h("zonos-select-dialog-header", { key: '091416c3c6b91d3b50dd033d8bca0df79841871b', handleOnClose: () => this.handleOnClose(), label: translate('Select a country') }, h("input", { key: '0c5d12e941bf7824594ebdd4b353ba833b6d9418', class: "zonos--country-select-input", onInput: this.handleInputChange, placeholder: translate('Search countries'), value: this.inputValue }))), h("div", { key: '9ff13fd2b3528ddff2bd379baa0b2ec919a6f928', class: "zonos--country-select-content" }, isEmpty && (h("zonos-text", { key: '9cf46a7a706d335930eeedcc3663571c5dbaaafc', class: "no-country", textColor: "gray-800" }, translate('No countries found'))), h("zonos-virtual-scroll", { key: '297237f0e2179ea95a49ae4872f6cc216026dd47', class: "zonos--country-filter-content", fallbackItemHeight: 34, itemHeights: filteredCountries.map(() => 34), renderItem: index => {
+            } }, h("div", { key: '0bc3773965c49f0ee4da2056b6acc0ae361e227a', class: "zonos--country-select" }, h("zonos-v-stack", { key: '9e00877189dc39b789861c0425702d276cdad410', class: "zonos--country-select-header", spacing: 8 }, h("zonos-select-dialog-header", { key: '9c098afdf6db8ef8e18dc855e19ab6d45b7db8be', handleOnClose: () => this.handleOnClose(), label: translate('Select a country') }, h("input", { key: '10c59b07a42da02fb348e289dc0211ae33b96638', autocomplete: "off", autofocus: "autofocus", class: "zonos--country-select-input", onInput: this.handleInputChange, placeholder: translate('Search countries'), value: this.inputValue }))), h("div", { key: 'fec8fb874726377a3c4a03ac5d264fc7d8a94a21', class: "zonos--country-select-content" }, isEmpty && (h("zonos-text", { key: '182fb6955798519e63d63121752bc65ac6045770', class: "no-country", textColor: "gray-800" }, translate('No countries found'))), h("zonos-virtual-scroll", { key: '3ccda154b37344857595d65ce3131ca6d2610a11', class: "zonos--country-filter-content", fallbackItemHeight: 34, itemHeights: filteredCountries.map(() => 34), renderItem: index => {
                 const country = filteredCountries[index];
                 if (!country) {
                     return null;

package/dist/collection/components/hello/zonos-hello/zonos-hello.js

@@ -447,12 +447,17 @@ export class ZonosHello {
         return {
             "getCountryList": {
                 "complexType": {
-                    "signature": "() => Promise<import(\"/home/runner/work/zonos-elements/zonos-elements/src/types/ICountryJson\").ICountryJson | null>",
+                    "signature": "() => Promise<ICountryJson | null>",
                     "parameters": [],
                     "references": {
                         "Promise": {
                             "location": "global",
                             "id": "global::Promise"
+                        },
+                        "ICountryJson": {
+                            "location": "import",
+                            "path": "src/types/ICountryJson",
+                            "id": "src/types/ICountryJson.ts::ICountryJson"
                         }
                     },
                     "return": "Promise<ICountryJson | null>"

package/dist/collection/components/utils/handleFetch.js

@@ -52,12 +52,6 @@ const handleRequest = async (url, options) => {
     const usingZonosPreview = window.Zonos.zonosQaUrl;
     // We only want to alert once if the user is in preview mode and it's also using production environment
     if (!window.Zonos.modeAlerted && zonosMode && usingZonosPreview) {
-        if (zonosMode === 'production') {
-            alert(`Please be aware that you are currently operating in the production environment. Any interactions with the customer store, including payments, will be processed as real transactions!`);
-        }
-        if (zonosMode === 'test') {
-            alert(`For testing payments, you can utilize the test payment information provided at this link: https://stripe.com/docs/payments/accept-a-payment?platform=web&ui=elements#web-test-the-integration`);
-        }
         window.Zonos.modeAlerted = true;
     }
     if (response.ok) {

package/dist/collection/components/utils/hello/currencyConversion/defaultCurrencyConverter.js

@@ -40,7 +40,10 @@ const convertCurrency = (element) => {
             });
         // default to the currencyConvertAndFormat if the currencyConverter function does not return a value, or invalid value. This is to make sure we don't break the merchant's price.
         const observedFormattedValue = customizedCurrencyFormat || currencyConvertAndFormat(amount);
-        element.textContent = observedFormattedValue;
+        if (observedFormattedValue !== element.textContent) {
+            // Only set textContent if the value has changed, this is to prevent it redrawing the element if the value is the same
+            element.textContent = observedFormattedValue;
+        }
         // save the new rate to the data-zrate attribute
         element.setAttribute('data-zrate', rate.toString());
         // save the new value to the data-zintl attribute

package/dist/collection/environment.js

@@ -21,6 +21,10 @@ const JS_DELIVR_ZONOS_URL = `https://cdn.jsdelivr.net/npm/@zonos/elements@${pack
  * @example https://unpkg.com/@zonos/elements@1.3.15/dist/scripts/zonos.js
  */
 const UNPKG_ZONOS_URL = `https://unpkg.com/@zonos/elements@${packageVersion}`;
+/**
+ * @example https://cdnjs.cloudflare.com/ajax/libs/zonos-elements/1.3.41/dist/scripts/loadZonos.js
+ */
+const CDNJS_ZONOS_URL = `https://cdnjs.cloudflare.com/ajax/libs/zonos-elements/${packageVersion}`;
 const currentBranch = process.env.VERCEL_GIT_COMMIT_REF || process.env.BRANCH_NAME;
 export const formattedUrl = ({ branchName, inCI: _inCI, inVercel: _inVercel, isVercelPreview: _isVercelPreview, packageVersion: _packageVersion, type = 'full', url, }) => {
     if (!url) {
@@ -121,6 +125,7 @@ else {
 const envClient = {
     NEXT_PUBLIC_FLAG_URL: z.string(),
     NEXT_PUBLIC_ZONOS_API_KEY: z.string(),
+    NEXT_PUBLIC_ZONOS_CDNJS_CDN_URL: z.string(),
     NEXT_PUBLIC_ZONOS_CDN_URL: z.string(),
     NEXT_PUBLIC_ZONOS_JS_DELIVR_CDN_URL: z.string(),
     NEXT_PUBLIC_ZONOS_PACKAGE_VERSION: z.string(),
@@ -145,6 +150,7 @@ export const env = createEnv({
     runtimeEnvStrict: {
         NEXT_PUBLIC_FLAG_URL: process.env.NEXT_PUBLIC_FLAG_URL,
         NEXT_PUBLIC_ZONOS_API_KEY: process.env.NEXT_PUBLIC_ZONOS_API_KEY,
+        NEXT_PUBLIC_ZONOS_CDNJS_CDN_URL: CDNJS_ZONOS_URL,
         /**
          * Versioning url for production environment
          * @example v1.2.3.js.zonos.com

package/dist/collection/scripts/_getNextFallbackUrl.js

@@ -1,4 +1,4 @@
-export const fallbackList = ['jsdelivr', 'unpkg', 'vercel'];
+export const fallbackList = ['jsdelivr', 'cdnjs', 'unpkg', 'vercel'];
 /**
  * Get the next cdn type in the fallback list
  * @param currentCdnType The current cdn type that want to get the next fallback url

package/dist/collection/scripts/_getZonosQaUrl.js

@@ -4,10 +4,21 @@ import { extractZonosQaUrl } from "./_extractZonosQaUrl";
  * Get the Zonos QA URL and return it. Will remove `zonosQaUrl` from the url query if it doesn't exists.
  */
 export const getZonosQaUrl = () => {
-    if (typeof window === 'undefined') {
+    /**
+     * This is flag to force load cdn for testing purpose
+     * When developing, if the script load is from `dev.elements.zonos.com`,
+     * it would load script from that same domain instead of loading from cdn
+     */
+    const shoudForceLoadCdn = window && window.location.href.includes('forceLoadCdn');
+    if (typeof window === 'undefined' || shoudForceLoadCdn) {
         return null;
     }
     const qaUrl = extractZonosQaUrl(window.location.href);
+    const cdnUrl = process.env.NEXT_PUBLIC_ZONOS_CDN_URL;
+    // when the qaUrl is not set and the built URL is from the test domain, use the test domain for testing
+    if (!qaUrl && cdnUrl.includes('test.')) {
+        return cdnUrl;
+    }
     // when local demo app is running, it needs to use the local dev script unless the qaUrl is set
     if (!qaUrl && window.location.hostname === 'dev.demo.elements.zonos.com') {
         return 'https://dev.elements.zonos.com';

package/dist/collection/scripts/_zonosBase.js

@@ -24,6 +24,7 @@ const zonosLoadUrl = (() => {
 const ZONOS_URL = process.env.NEXT_PUBLIC_ZONOS_CDN_URL;
 const JS_DELIVR_ZONOS_URL = zonosLoadUrl || process.env.NEXT_PUBLIC_ZONOS_JS_DELIVR_CDN_URL;
 const UNPKG_ZONOS_URL = process.env.NEXT_PUBLIC_ZONOS_UNPKG_CDN_URL;
+const CDNJS_ZONOS_URL = process.env.NEXT_PUBLIC_ZONOS_CDNJS_CDN_URL;
 export const MAIN_LOAD_CDN_TYPE = 'jsdelivr';
 const INTER_FONT_URL = 'https://rsms.me';
 const GOOGLE_FONT_URL = 'https://fonts.googleapis.com';
@@ -244,7 +245,9 @@ Zonos.getZonosUrl = (type) => {
                 return JS_DELIVR_ZONOS_URL;
             case 'unpkg':
                 return UNPKG_ZONOS_URL;
-            default:
+            case 'cdnjs':
+                return CDNJS_ZONOS_URL;
+            case 'vercel':
                 return ZONOS_URL;
         }
     };

package/dist/esm/{cart-f53c9f90.js → cart-bc217300.js}

@@ -6864,12 +6864,6 @@ const handleRequest = async (url, options) => {
     const usingZonosPreview = window.Zonos.zonosQaUrl;
     // We only want to alert once if the user is in preview mode and it's also using production environment
     if (!window.Zonos.modeAlerted && zonosMode && usingZonosPreview) {
-        if (zonosMode === 'production') {
-            alert(`Please be aware that you are currently operating in the production environment. Any interactions with the customer store, including payments, will be processed as real transactions!`);
-        }
-        if (zonosMode === 'test') {
-            alert(`For testing payments, you can utilize the test payment information provided at this link: https://stripe.com/docs/payments/accept-a-payment?platform=web&ui=elements#web-test-the-integration`);
-        }
         window.Zonos.modeAlerted = true;
     }
     if (response.ok) {
@@ -7217,7 +7211,10 @@ const convertCurrency = (element) => {
             });
         // default to the currencyConvertAndFormat if the currencyConverter function does not return a value, or invalid value. This is to make sure we don't break the merchant's price.
         const observedFormattedValue = customizedCurrencyFormat || currencyConvertAndFormat(amount);
-        element.textContent = observedFormattedValue;
+        if (observedFormattedValue !== element.textContent) {
+            // Only set textContent if the value has changed, this is to prevent it redrawing the element if the value is the same
+            element.textContent = observedFormattedValue;
+        }
         // save the new rate to the data-zrate attribute
         element.setAttribute('data-zrate', rate.toString());
         // save the new value to the data-zintl attribute

package/dist/esm/index.js

@@ -36,7 +36,7 @@ const checkIfLoadVersionDomain = ({ loadScriptSrc }) => {
     return { currentLoadScriptUrl, isForceLoadVersionDomain, isWhiteListed };
 };
 
-const fallbackList = ['jsdelivr', 'unpkg', 'vercel'];
+const fallbackList = ['jsdelivr', 'cdnjs', 'unpkg', 'vercel'];
 /**
  * Get the next cdn type in the fallback list
  * @param currentCdnType The current cdn type that want to get the next fallback url
@@ -80,10 +80,21 @@ const extractZonosQaUrl = (url) => {
  * Get the Zonos QA URL and return it. Will remove `zonosQaUrl` from the url query if it doesn't exists.
  */
 const getZonosQaUrl = () => {
-    if (typeof window === 'undefined') {
+    /**
+     * This is flag to force load cdn for testing purpose
+     * When developing, if the script load is from `dev.elements.zonos.com`,
+     * it would load script from that same domain instead of loading from cdn
+     */
+    const shoudForceLoadCdn = window && window.location.href.includes('forceLoadCdn');
+    if (typeof window === 'undefined' || shoudForceLoadCdn) {
         return null;
     }
     const qaUrl = extractZonosQaUrl(window.location.href);
+    const cdnUrl = "https://v1.3.42.js.zonos.com";
+    // when the qaUrl is not set and the built URL is from the test domain, use the test domain for testing
+    if (!qaUrl && cdnUrl.includes('test.')) {
+        return cdnUrl;
+    }
     // when local demo app is running, it needs to use the local dev script unless the qaUrl is set
     if (!qaUrl && window.location.hostname === 'dev.demo.elements.zonos.com') {
         return 'https://dev.elements.zonos.com';
@@ -249,9 +260,10 @@ const zonosLoadUrl = (() => {
     }
     return null;
 })();
-const ZONOS_URL = "https://v1.3.41.js.zonos.com";
-const JS_DELIVR_ZONOS_URL = zonosLoadUrl || "https://cdn.jsdelivr.net/npm/@zonos/elements@1.3.41";
-const UNPKG_ZONOS_URL = "https://unpkg.com/@zonos/elements@1.3.41";
+const ZONOS_URL = "https://v1.3.42.js.zonos.com";
+const JS_DELIVR_ZONOS_URL = zonosLoadUrl || "https://cdn.jsdelivr.net/npm/@zonos/elements@1.3.42";
+const UNPKG_ZONOS_URL = "https://unpkg.com/@zonos/elements@1.3.42";
+const CDNJS_ZONOS_URL = "https://cdnjs.cloudflare.com/ajax/libs/zonos-elements/1.3.42";
 const MAIN_LOAD_CDN_TYPE = 'jsdelivr';
 const INTER_FONT_URL = 'https://rsms.me';
 const GOOGLE_FONT_URL = 'https://fonts.googleapis.com';
@@ -272,7 +284,7 @@ Zonos.isBigCommerce = false;
  */
 Zonos.isNpm = true;
 Zonos.zonosQaUrl = null;
-Zonos.version = `v${"1.3.41"}`;
+Zonos.version = `v${"1.3.42"}`;
 Zonos.modeAlerted = false;
 Zonos.tempCartData = null;
 Zonos.paypal = null;
@@ -472,7 +484,9 @@ Zonos.getZonosUrl = (type) => {
                 return JS_DELIVR_ZONOS_URL;
             case 'unpkg':
                 return UNPKG_ZONOS_URL;
-            default:
+            case 'cdnjs':
+                return CDNJS_ZONOS_URL;
+            case 'vercel':
                 return ZONOS_URL;
         }
     };

package/dist/esm/{paypal-72296ae6.js → paypal-fa96e7c3.js}

@@ -1,5 +1,5 @@
 import { z as zonosStore, c as createStore } from './zonosStore-8fc9ceb2.js';
-import { w as handleFetch, d as cartStore, q as stripeStoreHandleInventoryCheck, t as translate, p as cartStoreNextStep, h as cartStoreClearCheckoutInterval, x as jsonParse } from './cart-f53c9f90.js';
+import { w as handleFetch, d as cartStore, q as stripeStoreHandleInventoryCheck, t as translate, p as cartStoreNextStep, h as cartStoreClearCheckoutInterval, x as jsonParse } from './cart-bc217300.js';
 import { t as tinycolor } from './isDarkColor-3119e351.js';
 import { l as log, a as logError } from './logError-c456c092.js';
 

package/dist/esm/{sendErrorLog-f8d3ec4b.js → sendErrorLog-c40b553a.js}

@@ -1,4 +1,4 @@
-import { w as handleFetch, d as cartStore, l as localizationStore } from './cart-f53c9f90.js';
+import { w as handleFetch, d as cartStore, l as localizationStore } from './cart-bc217300.js';
 import { z as zonosStore } from './zonosStore-8fc9ceb2.js';
 
 const trackConversionEvent = async (eventName, metadata) => {

package/dist/esm/zonos-address_8.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, c as createEvent, h, H as Host, d as getElement } from './index-86b8247e.js';
-import { j as stripeStore, l as localizationStore, t as translate } from './cart-f53c9f90.js';
+import { j as stripeStore, l as localizationStore, t as translate } from './cart-bc217300.js';
 import { i as isCheckoutMobile } from './isCheckoutMobile-8846dccb.js';
 import { a as logError } from './logError-c456c092.js';
 import { i as isTextContainsNonLatinChars, c as containsNonLatinChars } from './containsNonLatinChars-2d8810c3.js';

package/dist/esm/zonos-cart-items_12.entry.js

@@ -1,9 +1,9 @@
 import { r as registerInstance, a as getAssetPath, h, H as Host, F as Fragment, c as createEvent, d as getElement } from './index-86b8247e.js';
-import { d as cartStore, F as currencyFormat, G as cartStoreHasOneEligibleItem, t as translate, w as handleFetch, u as stripeStoreReset, j as stripeStore, H as stripeStoreRetrievePayment, I as stripeStoreMessageBasedOnStatus, l as localizationStore, J as stripeStoreTranslateAddressToLatin, K as cartStoreUpdateSelectedShippingOption, L as cartStoreGetShippingTransitInfo } from './cart-f53c9f90.js';
+import { d as cartStore, F as currencyFormat, G as cartStoreHasOneEligibleItem, t as translate, w as handleFetch, u as stripeStoreReset, j as stripeStore, H as stripeStoreRetrievePayment, I as stripeStoreMessageBasedOnStatus, l as localizationStore, J as stripeStoreTranslateAddressToLatin, K as cartStoreUpdateSelectedShippingOption, L as cartStoreGetShippingTransitInfo } from './cart-bc217300.js';
 import { c as classes } from './classes-0d95c529.js';
-import { s as submitGtag, a as paypalStore, b as paypalStoreReset, c as paypalStoreHasPaypalEnabled, i as isContrastColor } from './paypal-72296ae6.js';
+import { s as submitGtag, a as paypalStore, b as paypalStoreReset, c as paypalStoreHasPaypalEnabled, i as isContrastColor } from './paypal-fa96e7c3.js';
 import { z as zonosStore, g as getZonosStoreTheme, d as zonosStoreFontFamily } from './zonosStore-8fc9ceb2.js';
-import { t as trackConversionEvent, s as sendErrorLog, c as createCustomEvent, g as getIsTestMode } from './sendErrorLog-f8d3ec4b.js';
+import { t as trackConversionEvent, s as sendErrorLog, c as createCustomEvent, g as getIsTestMode } from './sendErrorLog-c40b553a.js';
 import { g as getBorderRadius } from './getBorderRadius-3ba98361.js';
 import { i as isCheckoutMobile } from './isCheckoutMobile-8846dccb.js';
 import { l as languages } from './ILanguage-cd6acb72.js';

package/dist/esm/zonos-checkout.entry.js

@@ -1,8 +1,8 @@
 import { r as registerInstance, h, H as Host, F as Fragment } from './index-86b8247e.js';
-import { l as localizationStore, s as stripeStoreGetDomesticShippingSession, a as localizationStoreUpdateSelectedCountryCode, b as stripeStoreCleanupDomesticShippingSession, c as stripeStoreSaveDomesticShippingSession, i as initStripeElements, d as cartStore, e as cartStoreUpdateItems, f as cartStoreReset, g as cartStoreResetTabItems, h as cartStoreClearCheckoutInterval, j as stripeStore, k as stripeStoreInitCheckoutSession, m as cartStoreStartCheckoutInterval, n as cartStoreUpdateToErrorState, t as translate, o as stripeStorePrefetchLandedCost, p as cartStoreNextStep, q as stripeStoreHandleInventoryCheck, r as stripeStoreConfirmPayment, u as stripeStoreReset, v as localizationStoreOnUpdate } from './cart-f53c9f90.js';
-import { s as submitGtag, p as paypalInitScript } from './paypal-72296ae6.js';
+import { l as localizationStore, s as stripeStoreGetDomesticShippingSession, a as localizationStoreUpdateSelectedCountryCode, b as stripeStoreCleanupDomesticShippingSession, c as stripeStoreSaveDomesticShippingSession, i as initStripeElements, d as cartStore, e as cartStoreUpdateItems, f as cartStoreReset, g as cartStoreResetTabItems, h as cartStoreClearCheckoutInterval, j as stripeStore, k as stripeStoreInitCheckoutSession, m as cartStoreStartCheckoutInterval, n as cartStoreUpdateToErrorState, t as translate, o as stripeStorePrefetchLandedCost, p as cartStoreNextStep, q as stripeStoreHandleInventoryCheck, r as stripeStoreConfirmPayment, u as stripeStoreReset, v as localizationStoreOnUpdate } from './cart-bc217300.js';
+import { s as submitGtag, p as paypalInitScript } from './paypal-fa96e7c3.js';
 import { z as zonosStore, g as getZonosStoreTheme, m as mergeConfig } from './zonosStore-8fc9ceb2.js';
-import { c as createCustomEvent, s as sendErrorLog, t as trackConversionEvent, g as getIsTestMode } from './sendErrorLog-f8d3ec4b.js';
+import { c as createCustomEvent, s as sendErrorLog, t as trackConversionEvent, g as getIsTestMode } from './sendErrorLog-c40b553a.js';
 import { i as isCheckoutMobile } from './isCheckoutMobile-8846dccb.js';
 import { l as log, a as logError } from './logError-c456c092.js';
 import { c as classes } from './classes-0d95c529.js';

package/dist/esm/zonos-controller.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-86b8247e.js';
-import { w as handleFetch, y as isValidSelector, j as stripeStore, z as initLocalizationStore, d as cartStore, a as localizationStoreUpdateSelectedCountryCode } from './cart-f53c9f90.js';
+import { w as handleFetch, y as isValidSelector, j as stripeStore, z as initLocalizationStore, d as cartStore, a as localizationStoreUpdateSelectedCountryCode } from './cart-bc217300.js';
 import { z as zonosStore, b as zonosStoreInitSetting, d as zonosStoreFontFamily } from './zonosStore-8fc9ceb2.js';
 import { a as logError, l as log } from './logError-c456c092.js';
 import './isDarkColor-3119e351.js';

package/dist/esm/zonos-country-flag.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, H as Host, d as getElement } from './index-86b8247e.js';
-import { l as localizationStore } from './cart-f53c9f90.js';
+import { l as localizationStore } from './cart-bc217300.js';
 import { d as zonosStoreFontFamily } from './zonosStore-8fc9ceb2.js';
 import { c as classes } from './classes-0d95c529.js';
 import './logError-c456c092.js';

package/dist/esm/zonos-country-select_4.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, H as Host, d as getElement } from './index-86b8247e.js';
-import { a as localizationStoreUpdateSelectedCountryCode, t as translate, l as localizationStore } from './cart-f53c9f90.js';
+import { a as localizationStoreUpdateSelectedCountryCode, t as translate, l as localizationStore } from './cart-bc217300.js';
 import { d as zonosStoreFontFamily } from './zonosStore-8fc9ceb2.js';
 import { f as formatStringWithLinks } from './formatStringWithLinks-9e819405.js';
 import { i as isDarkColor } from './isDarkColor-3119e351.js';
@@ -1818,7 +1818,7 @@ const ZonosCountrySelect = class {
     componentDidRender() {
         var _a, _b;
         // focus the input on render
-        (_b = (_a = this.ele.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.zonos--country-filter-content')) === null || _b === void 0 ? void 0 : _b.focus();
+        (_b = (_a = this.ele.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.zonos--country-filter-input')) === null || _b === void 0 ? void 0 : _b.focus();
     }
     render() {
         const { helloCountryList } = localizationStore;
@@ -1833,9 +1833,9 @@ const ZonosCountrySelect = class {
             ? fuseObject.map(country => country.item)
             : countries.sort((a, b) => a.displayName.localeCompare(b.displayName));
         const isEmpty = !filteredCountries.length;
-        return (h(Host, { key: '1e17d188428f8caeb495389f7870c3052d3cfb4a', class: "zonos--elements", style: {
+        return (h(Host, { key: 'd6d6a0736660d0c6e76f749f8ea78a8c95825b88', class: "zonos--elements", style: {
                 '--font-family': zonosStoreFontFamily(),
-            } }, h("div", { key: '2f6d0f239a4fad7c48349878b53dc8cb426aa022', class: "zonos--country-select" }, h("zonos-v-stack", { key: '76ad667603fce800457dae6d8951abe97e5db9d8', class: "zonos--country-select-header", spacing: 8 }, h("zonos-select-dialog-header", { key: '091416c3c6b91d3b50dd033d8bca0df79841871b', handleOnClose: () => this.handleOnClose(), label: translate('Select a country') }, h("input", { key: '0c5d12e941bf7824594ebdd4b353ba833b6d9418', class: "zonos--country-select-input", onInput: this.handleInputChange, placeholder: translate('Search countries'), value: this.inputValue }))), h("div", { key: '9ff13fd2b3528ddff2bd379baa0b2ec919a6f928', class: "zonos--country-select-content" }, isEmpty && (h("zonos-text", { key: '9cf46a7a706d335930eeedcc3663571c5dbaaafc', class: "no-country", textColor: "gray-800" }, translate('No countries found'))), h("zonos-virtual-scroll", { key: '297237f0e2179ea95a49ae4872f6cc216026dd47', class: "zonos--country-filter-content", fallbackItemHeight: 34, itemHeights: filteredCountries.map(() => 34), renderItem: index => {
+            } }, h("div", { key: '0bc3773965c49f0ee4da2056b6acc0ae361e227a', class: "zonos--country-select" }, h("zonos-v-stack", { key: '9e00877189dc39b789861c0425702d276cdad410', class: "zonos--country-select-header", spacing: 8 }, h("zonos-select-dialog-header", { key: '9c098afdf6db8ef8e18dc855e19ab6d45b7db8be', handleOnClose: () => this.handleOnClose(), label: translate('Select a country') }, h("input", { key: '10c59b07a42da02fb348e289dc0211ae33b96638', autocomplete: "off", autofocus: "autofocus", class: "zonos--country-select-input", onInput: this.handleInputChange, placeholder: translate('Search countries'), value: this.inputValue }))), h("div", { key: 'fec8fb874726377a3c4a03ac5d264fc7d8a94a21', class: "zonos--country-select-content" }, isEmpty && (h("zonos-text", { key: '182fb6955798519e63d63121752bc65ac6045770', class: "no-country", textColor: "gray-800" }, translate('No countries found'))), h("zonos-virtual-scroll", { key: '3ccda154b37344857595d65ce3131ca6d2610a11', class: "zonos--country-filter-content", fallbackItemHeight: 34, itemHeights: filteredCountries.map(() => 34), renderItem: index => {
                 const country = filteredCountries[index];
                 if (!country) {
                     return null;

package/dist/esm/zonos-hello-dialog.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, c as createEvent, h, F as Fragment, H as Host } from './index-86b8247e.js';
-import { t as translate, l as localizationStore, F as currencyFormat } from './cart-f53c9f90.js';
+import { t as translate, l as localizationStore, F as currencyFormat } from './cart-bc217300.js';
 import { z as zonosStore } from './zonosStore-8fc9ceb2.js';
 import { c as classes } from './classes-0d95c529.js';
 import { f as formatStringWithLinks } from './formatStringWithLinks-9e819405.js';