@zonos/elements 1.3.192 → 1.3.193

package/dist/cjs/index.cjs.js

@@ -131,7 +131,7 @@ const getZonosQaUrl = () => {
         return null;
     }
     const qaUrl = extractZonosQaUrl(window.location.href);
-    const cdnUrl = "https://v1.3.192.js.zonos.com";
+    const cdnUrl = "https://v1.3.193.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.') ||
@@ -372,10 +372,10 @@ const zonosLoadUrl = (() => {
     }
     return null;
 })();
-const ZONOS_URL = "https://v1.3.192.js.zonos.com";
-const JS_DELIVR_ZONOS_URL = zonosLoadUrl || "https://cdn.jsdelivr.net/npm/@zonos/elements@1.3.192";
-const UNPKG_ZONOS_URL = "https://unpkg.com/@zonos/elements@1.3.192";
-const CDNJS_ZONOS_URL = "https://cdnjs.cloudflare.com/ajax/libs/zonos-elements/1.3.192";
+const ZONOS_URL = "https://v1.3.193.js.zonos.com";
+const JS_DELIVR_ZONOS_URL = zonosLoadUrl || "https://cdn.jsdelivr.net/npm/@zonos/elements@1.3.193";
+const UNPKG_ZONOS_URL = "https://unpkg.com/@zonos/elements@1.3.193";
+const CDNJS_ZONOS_URL = "https://cdnjs.cloudflare.com/ajax/libs/zonos-elements/1.3.193";
 const GOOGLE_FONT_URL = 'https://fonts.googleapis.com';
 const GOOGLE_FONT_REGEX = /^https:\/\/fonts\.googleapis\.com/;
 class Zonos {
@@ -393,7 +393,7 @@ Zonos.iframeLogType = typeof window !== 'undefined'
     ? new URLSearchParams(window.location.search).get('iframeLogType')
     : null;
 Zonos.isBigCommerce = false;
-Zonos.releaseDate = "1745964248308";
+Zonos.releaseDate = "1746131604123";
 Zonos.isLegacyCheckout = false;
 Zonos.domain = typeof window !== 'undefined'
     ? // domain that embeds the iframe
@@ -411,7 +411,7 @@ Zonos.isNpm = true;
 Zonos.zonosQaUrl = null;
 Zonos.zonosQaUrlApi = null;
 Zonos.trackEventLogs = [];
-Zonos.version = `v${"1.3.192"}`;
+Zonos.version = `v${"1.3.193"}`;
 Zonos.modeAlerted = false;
 Zonos.cartData = null;
 Zonos.paypal = null;

package/dist/cjs/{containsNonLatinChars-2be5129b.js → shouldRenderTaxIdInput-9b8a8de1.js}

@@ -1,5 +1,7 @@
 'use strict';
 
+const TaxId = require('./TaxId-12acedde.js');
+
 const isTextContainsNonLatinChars = (text) => {
     const specialCharacters = /[ʼˮ՚ߴߵ']{1}/u;
     /**
@@ -20,5 +22,26 @@ const containsNonLatinChars = (params) => {
     return nonLatinValueList;
 };
 
+const isInTaxIdCountry = (countryCode) => {
+    return TaxId.countryRequireTaxId.includes(countryCode);
+};
+/**
+ * Checks if the tax ID input should be rendered based on the company name and country code.
+ */
+const shouldRenderTaxIdInput = ({ companyName, countryCode, }) => {
+    // Only show the tax ID input if the country is in the EU and the company name is provided
+    if (TaxId.euCountryCodes.includes(countryCode)) {
+        return companyName.trim().length > 0;
+    }
+    // If country require tax id, show the input
+    const isCountryRequireTaxId = isInTaxIdCountry(countryCode);
+    if (isCountryRequireTaxId) {
+        return true;
+    }
+    // If country doesn't require tax ID, no need to show the input
+    return false;
+};
+
 exports.containsNonLatinChars = containsNonLatinChars;
 exports.isTextContainsNonLatinChars = isTextContainsNonLatinChars;
+exports.shouldRenderTaxIdInput = shouldRenderTaxIdInput;

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

@@ -5,8 +5,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-0993f42d.js');
 const cart = require('./cart-27f6c7a4.js');
 const handleFetch = require('./handleFetch-969d05d8.js');
+const shouldRenderTaxIdInput = require('./shouldRenderTaxIdInput-9b8a8de1.js');
 const TaxId = require('./TaxId-12acedde.js');
-const containsNonLatinChars = require('./containsNonLatinChars-2be5129b.js');
 const classes = require('./classes-b7918f56.js');
 const getBorderRadius = require('./getBorderRadius-87f3b69c.js');
 const zonosStore = require('./zonosStore-adc42868.js');
@@ -211,8 +211,16 @@ const ZonosAddress$1 = class {
         if (!countryCode) {
             return null;
         }
-        const isCountryRequireTaxId = this.isInTaxIdCountry(countryCode);
-        if (!isCountryRequireTaxId) {
+        // This just to type guard the countryCode, if it's able to get to this point it should already be in country that has tax id input
+        if (!this.isInTaxIdCountry(countryCode)) {
+            return null;
+        }
+        const taxIdInputRendered = shouldRenderTaxIdInput.shouldRenderTaxIdInput({
+            companyName: cart.stripeStore.companyName,
+            countryCode,
+        });
+        // Don't render tax id input if the country doesn't require tax id
+        if (!taxIdInputRendered) {
             return null;
         }
         const taxIdInputInfo = TaxId.shipToTaxIdLabels[countryCode];
@@ -250,7 +258,7 @@ const ZonosAddress$1 = class {
             this.isAddressFilled = true;
         }
         // this component loads iframe from the stripe elements and puts here, so we don't need to do anything here
-        return (index.h(index.Host, { key: 'd0ca96da12614cde628ff4dad124b54c454cd140', class: "zonos--address zonos--elements" }, index.h("zonos-text", { key: '761b0fb6b313cb6884c3f48f7e46261650669502', class: "zonos--title", type: "semiBoldLabel" }, this.titleText), this.renderCompanyNameInput(), this.renderTaxIdInput(), index.h("div", { key: '634b40091645760295a5ef544be8080826739301', class: "zonos--address-component" })));
+        return (index.h(index.Host, { key: '8509c142efbfe37d81b3da8b2a2e7b3ca9b350dc', class: "zonos--address zonos--elements" }, index.h("zonos-text", { key: '16e151eb3204d656f4a726531b9a64d955ac99c8', class: "zonos--title", type: "semiBoldLabel" }, this.titleText), this.renderCompanyNameInput(), this.renderTaxIdInput(), index.h("div", { key: '6b9d493c1e61cbfb77fc89cfa3cc1081b3b1c147', class: "zonos--address-component" })));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {
@@ -276,7 +284,7 @@ const ZonosAddressDisplay = class {
         const { city, country, email, line1, line2, name, phone, postal_code, state, } = this.currentAddress;
         const shippingZoneCountry = (_a = cart.localizationStore.shippingZoneCountries) === null || _a === void 0 ? void 0 : _a[country];
         const renderEnteredInfoText = ({ bold, content, }) => {
-            const textColor = containsNonLatinChars.isTextContainsNonLatinChars(content)
+            const textColor = shouldRenderTaxIdInput.isTextContainsNonLatinChars(content)
                 ? 'red-600'
                 : 'gray-1000';
             return (index.h("zonos-text", { textColor: textColor, type: bold ? 'boldLabel' : 'body' }, content));
@@ -322,13 +330,13 @@ const ZonosAddressForm = class {
         const lastName = name.split(' ').slice(1).join(' ') || '';
         return (index.h(index.Host, { key: '8b578737e33203a23563be7e9be0778deec99bbf', class: "zonos--address-form zonos--elements" }, index.h("div", { key: '793675a1348547bf3f781788956befe325191011', class: "zonos--title" }, index.h("zonos-text", { key: '13de35cb0a7c98a48342e3fb86ae3ade9f5b88d9', textColor: "gray-700", type: "smallHeader" }, this.addressType === 'shipping'
             ? cart.translate('Shipping')
-            : cart.translate('Billing'))), index.h("div", { key: '2c5de5b5283fb99ee5f8b61d7a217177986fc2db', class: "zonos--address-group" }, index.h("div", { key: '23bf3c893071000d5995a5f175867bab11929193', class: "zonos--contact" }, index.h("zonos-text", { key: '7cdfe2a84ebad89ba5b16498d75def99cf392384', type: "label" }, cart.translate('Contact')), index.h("zonos-input", { key: '1c39c38767fd306c5eb1164cdc989b8291209cf0', class: "zonos--form-email", inputLabel: cart.translate('Email'), inputValue: this.currentAddress.email, isDisabled: true }), index.h("div", { key: 'cbdf61217125e22b1a6cec9a340ef0aca2c75670', class: "zonos--name zonos--address-row" }, index.h("zonos-input", { key: '360c99e7b2c6caa64580d5768b5bb53368927275', class: "zonos--form-first-name", inputLabel: cart.translate('First name'), inputValue: firstName, isError: containsNonLatinChars.isTextContainsNonLatinChars(firstName), onInputChange: e => this.onInputChange({
+            : cart.translate('Billing'))), index.h("div", { key: '2c5de5b5283fb99ee5f8b61d7a217177986fc2db', class: "zonos--address-group" }, index.h("div", { key: '23bf3c893071000d5995a5f175867bab11929193', class: "zonos--contact" }, index.h("zonos-text", { key: '7cdfe2a84ebad89ba5b16498d75def99cf392384', type: "label" }, cart.translate('Contact')), index.h("zonos-input", { key: '1c39c38767fd306c5eb1164cdc989b8291209cf0', class: "zonos--form-email", inputLabel: cart.translate('Email'), inputValue: this.currentAddress.email, isDisabled: true }), index.h("div", { key: 'cbdf61217125e22b1a6cec9a340ef0aca2c75670', class: "zonos--name zonos--address-row" }, index.h("zonos-input", { key: '360c99e7b2c6caa64580d5768b5bb53368927275', class: "zonos--form-first-name", inputLabel: cart.translate('First name'), inputValue: firstName, isError: shouldRenderTaxIdInput.isTextContainsNonLatinChars(firstName), onInputChange: e => this.onInputChange({
                 key: 'name',
                 value: `${e.detail} ${lastName}`,
-            }) }), index.h("zonos-input", { key: '8ce5fa5c15c6f7928339ea10009ce0e68954a91f', class: "zonos--form-last-name", inputLabel: cart.translate('Last name'), inputValue: lastName, isError: containsNonLatinChars.isTextContainsNonLatinChars(lastName), onInputChange: e => this.onInputChange({
+            }) }), index.h("zonos-input", { key: '8ce5fa5c15c6f7928339ea10009ce0e68954a91f', class: "zonos--form-last-name", inputLabel: cart.translate('Last name'), inputValue: lastName, isError: shouldRenderTaxIdInput.isTextContainsNonLatinChars(lastName), onInputChange: e => this.onInputChange({
                 key: 'name',
                 value: `${firstName} ${e.detail}`,
-            }) }))), index.h("div", { key: '7b4fa2d3baa6cb257e7688e5ba6777123898b3fd', class: "zonos--address" }, index.h("zonos-text", { key: '9d5782331b2642755a755aeb7f98c9f4d87f9a20', type: "label" }, cart.translate('Address')), index.h("zonos-input", { key: 'a622025924ca86bdbf1d3c04b79e6dee172b4c42', class: "zonos--form-country", inputLabel: cart.translate('Country'), inputValue: country, isDisabled: true }), index.h("zonos-input", { key: 'f99b3a74db09ab5730878e80705b9aeac76bf800', class: "zonos--form-line1", inputLabel: cart.translate('Address line 1'), inputValue: line1, isError: containsNonLatinChars.isTextContainsNonLatinChars(line1), onInputChange: e => this.onInputChange({ key: 'line1', value: e.detail }) }), index.h("zonos-input", { key: '5d16aefa45a78045c87d166aaaec0255606e455e', class: "zonos--form-line2", inputLabel: cart.translate('Address line 2'), inputValue: line2, isError: containsNonLatinChars.isTextContainsNonLatinChars(line2), onInputChange: e => this.onInputChange({ key: 'line2', value: e.detail }) }), index.h("div", { key: 'dc166be9381142835d72e731cb38a718522a068a', class: "zonos--address-row" }, index.h("zonos-input", { key: '4f1a98f9d10ce0cff3ef18a3037a12382552b31d', class: "zonos--form-city", inputLabel: cart.translate('City'), inputValue: city, isError: containsNonLatinChars.isTextContainsNonLatinChars(city), onInputChange: e => this.onInputChange({ key: 'city', value: e.detail }) }), index.h("zonos-input", { key: 'd4f97900b5fe2e1619950a52d1d1f716a8bc19ff', class: "zonos--form-state", inputLabel: cart.translate('State/Province'), inputValue: state, isError: containsNonLatinChars.isTextContainsNonLatinChars(state), onInputChange: e => this.onInputChange({ key: 'state', value: e.detail }) })), index.h("zonos-input", { key: 'cf1eb0ca5cd15c8412a2e1246aaf2e39361dc733', class: "zonos--form-postal-code", inputLabel: cart.translate('Postal code'), inputValue: postal_code, isError: containsNonLatinChars.isTextContainsNonLatinChars(postal_code), onInputChange: e => this.onInputChange({ key: 'postal_code', value: e.detail }) }), index.h("zonos-input", { key: '7421c82847eded6bdbcce49ef8196124d8e50c1d', class: "zonos--form-phone", inputLabel: cart.translate('Phone number'), inputValue: phone, onInputChange: e => this.onInputChange({ key: 'phone', value: e.detail }) })))));
+            }) }))), index.h("div", { key: '7b4fa2d3baa6cb257e7688e5ba6777123898b3fd', class: "zonos--address" }, index.h("zonos-text", { key: '9d5782331b2642755a755aeb7f98c9f4d87f9a20', type: "label" }, cart.translate('Address')), index.h("zonos-input", { key: 'a622025924ca86bdbf1d3c04b79e6dee172b4c42', class: "zonos--form-country", inputLabel: cart.translate('Country'), inputValue: country, isDisabled: true }), index.h("zonos-input", { key: 'f99b3a74db09ab5730878e80705b9aeac76bf800', class: "zonos--form-line1", inputLabel: cart.translate('Address line 1'), inputValue: line1, isError: shouldRenderTaxIdInput.isTextContainsNonLatinChars(line1), onInputChange: e => this.onInputChange({ key: 'line1', value: e.detail }) }), index.h("zonos-input", { key: '5d16aefa45a78045c87d166aaaec0255606e455e', class: "zonos--form-line2", inputLabel: cart.translate('Address line 2'), inputValue: line2, isError: shouldRenderTaxIdInput.isTextContainsNonLatinChars(line2), onInputChange: e => this.onInputChange({ key: 'line2', value: e.detail }) }), index.h("div", { key: 'dc166be9381142835d72e731cb38a718522a068a', class: "zonos--address-row" }, index.h("zonos-input", { key: '4f1a98f9d10ce0cff3ef18a3037a12382552b31d', class: "zonos--form-city", inputLabel: cart.translate('City'), inputValue: city, isError: shouldRenderTaxIdInput.isTextContainsNonLatinChars(city), onInputChange: e => this.onInputChange({ key: 'city', value: e.detail }) }), index.h("zonos-input", { key: 'd4f97900b5fe2e1619950a52d1d1f716a8bc19ff', class: "zonos--form-state", inputLabel: cart.translate('State/Province'), inputValue: state, isError: shouldRenderTaxIdInput.isTextContainsNonLatinChars(state), onInputChange: e => this.onInputChange({ key: 'state', value: e.detail }) })), index.h("zonos-input", { key: 'cf1eb0ca5cd15c8412a2e1246aaf2e39361dc733', class: "zonos--form-postal-code", inputLabel: cart.translate('Postal code'), inputValue: postal_code, isError: shouldRenderTaxIdInput.isTextContainsNonLatinChars(postal_code), onInputChange: e => this.onInputChange({ key: 'postal_code', value: e.detail }) }), index.h("zonos-input", { key: '7421c82847eded6bdbcce49ef8196124d8e50c1d', class: "zonos--form-phone", inputLabel: cart.translate('Phone number'), inputValue: phone, onInputChange: e => this.onInputChange({ key: 'phone', value: e.detail }) })))));
     }
     static get watchers() { return {
         "translatedAddress": ["watchCurrentAddress"]
@@ -482,11 +490,11 @@ const ZonosAddressUpdateDialog = class {
                 translatedAddress: this.translatedShippingAddressState,
             });
             // check to see if there are still non-latin characters in the translated address
-            const shippingNonlatinChars = containsNonLatinChars.containsNonLatinChars(Object.assign(Object.assign({}, translatedShippingAddress), { country: this.shippingAddress.country }));
+            const shippingNonlatinChars = shouldRenderTaxIdInput.containsNonLatinChars(Object.assign(Object.assign({}, translatedShippingAddress), { country: this.shippingAddress.country }));
             // get list of non-latin characters field in the billing address
             const billingNonLatinChars = translatedBillingAddress &&
                 this.billingAddress &&
-                containsNonLatinChars.containsNonLatinChars(Object.assign(Object.assign({}, translatedBillingAddress), { country: this.billingAddress.country }));
+                shouldRenderTaxIdInput.containsNonLatinChars(Object.assign(Object.assign({}, translatedBillingAddress), { country: this.billingAddress.country }));
             const shippingHasNonLatinChars = !!Object.keys(shippingNonlatinChars)
                 .length;
             const billingHasNonLatinChars = !!billingNonLatinChars && !!Object.keys(billingNonLatinChars).length;
@@ -1060,8 +1068,16 @@ const ZonosAddress = class {
         if (!countryCode) {
             return null;
         }
-        const isCountryRequireTaxId = this.isInTaxIdCountry(countryCode);
-        if (!isCountryRequireTaxId) {
+        // This just to type guard the countryCode, if it's able to get to this point it should already be in country that has tax id input
+        if (!this.isInTaxIdCountry(countryCode)) {
+            return null;
+        }
+        const taxIdInputRendered = shouldRenderTaxIdInput.shouldRenderTaxIdInput({
+            companyName: cart.stripeStore.companyName,
+            countryCode,
+        });
+        // Don't render tax id input if the country doesn't require tax id
+        if (!taxIdInputRendered) {
             return null;
         }
         const taxIdInputInfo = TaxId.shipToTaxIdLabels[countryCode];
@@ -1547,10 +1563,10 @@ const ZonosAddress = class {
             this.country = cart.localizationStore.selectedCountryCode;
         }
         // this component loads iframe from the stripe elements and puts here, so we don't need to do anything here
-        return (index.h(index.Host, { key: '66cc13d7c7a01e23610447ffff5b87ee3b62e65c', class: classes.classes([
+        return (index.h(index.Host, { key: '7bb0587de62e4c9b50992c3b6334e0382ea6ac08', class: classes.classes([
                 'zonos--address zonos--elements',
                 `zonos--${this.type}-address`,
-            ]) }, index.h("zonos-text", { key: '52902420cfc1af2d18c2d502eed38870386e3a3c', class: "zonos--title", type: "semiBoldLabel" }, this.titleText), this.renderCompanyNameInput(), this.renderTaxIdInput(), this.renderCustomAddressForm()));
+            ]) }, index.h("zonos-text", { key: '5f2590456c7b20851af976263a82fbb17e47d995', class: "zonos--title", type: "semiBoldLabel" }, this.titleText), this.renderCompanyNameInput(), this.renderTaxIdInput(), this.renderCustomAddressForm()));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

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

@@ -13,7 +13,7 @@ const getBorderRadius = require('./getBorderRadius-87f3b69c.js');
 const ILanguage = require('./ILanguage-98b04442.js');
 const isDarkColor = require('./isDarkColor-d0c67c3d.js');
 const isColorVariable = require('./isColorVariable-525dbfa7.js');
-const containsNonLatinChars = require('./containsNonLatinChars-2be5129b.js');
+const shouldRenderTaxIdInput = require('./shouldRenderTaxIdInput-9b8a8de1.js');
 const TaxId = require('./TaxId-12acedde.js');
 
 const getDisplayCurrency = () => {
@@ -1894,7 +1894,9 @@ const ZonosCheckoutPayment = class {
                     variant: this.submitBtnType }, cart.translate('Place test order')))));
             }
             return (index.h(index.Fragment, null, this.showErrorBanner && (index.h("zonos-banner", { class: "zonos--error-banner", intent: "error" }, cart.translate('Missing required fields. Make sure all fields are completed.'))), this.hasStripePaymentError && (index.h("zonos-banner", { class: "zonos--payment-error-banner", intent: "error" }, cart.stripeStore.customErrorMessage ||
-                cart.translate("We couldn't complete your payment. Please verify the payment details and try again."))), paypal.paypalStore.paypalErrorMessage && (index.h("zonos-banner", { class: "zonos--payment-error-banner", intent: "error" }, paypal.paypalStore.paypalErrorMessage)), index.h("zonos-payment", null), index.h("div", { class: "zonos--group-btn" }, !isPaypalTabSelected && (index.h(index.Fragment, null, index.h("zonos-button", { backgroundColor: this.submitBtnColor, bold: true, loading: this.continueLoading, onClick: async () => {
+                cart.translate("We couldn't complete your payment. Please verify the payment details and try again."))), paypal.paypalStore.paypalErrorMessage && (index.h("zonos-banner", { class: "zonos--payment-error-banner", intent: "error" }, paypal.paypalStore.paypalErrorMessage)), index.h("zonos-payment", null), index.h("div", { class: "zonos--group-btn" }, !isPaypalTabSelected && (index.h(index.Fragment, null, index.h("zonos-button", { backgroundColor: this.submitBtnColor, bold: true, isDisabled: this.continueLoading &&
+                    cart.stripeStore.checkoutSettlementCurrency === 'USD', loading: this.continueLoading &&
+                    cart.stripeStore.checkoutSettlementCurrency !== 'USD', onClick: async () => {
                     if (!cart.cartStore.checkoutSession) {
                         handleFetch.log('Checkout session is not found');
                         return;
@@ -1910,7 +1912,9 @@ const ZonosCheckoutPayment = class {
                     amount: cart.cartStore.total,
                     isForeign: true,
                 }),
-            })), cart.stripeStore.shouldRenderPayInUsdButton && (index.h("zonos-button", { class: "zonos--pay-in-base-currency-btn", loading: this.continueLoading, onClick: async () => {
+            })), cart.stripeStore.shouldRenderPayInUsdButton && (index.h("zonos-button", { class: "zonos--pay-in-base-currency-btn", isDisabled: this.continueLoading &&
+                    cart.stripeStore.checkoutSettlementCurrency !== 'USD', loading: this.continueLoading &&
+                    cart.stripeStore.checkoutSettlementCurrency === 'USD', onClick: async () => {
                     await this.continueClickHandler({
                         currencyCode: 'USD',
                     });
@@ -2208,16 +2212,29 @@ const isTaxIdRequired = (shippingCountry) => {
 };
 const taxIdValidationResult = ({ companyName, shippingCountry, taxId, }) => {
     // Check to see if we are required to collect tax id for the shipping country or not
-    const taxRequired = isTaxIdRequired(shippingCountry);
-    if (!taxRequired) {
+    const isTaxIdInputRendered = shouldRenderTaxIdInput.shouldRenderTaxIdInput({
+        companyName,
+        countryCode: shippingCountry,
+    });
+    // If the tax id input is not even rendered, no need to validate anything and allow to proceed. Validate when tax id input is not even rendered would prevent the user from checking out
+    if (!isTaxIdInputRendered) {
+        return {
+            error: null,
+            valid: true,
+        };
+    }
+    // Cache the result of isTaxIdRequired for reuse
+    const taxIdRequired = isTaxIdRequired(shippingCountry);
+    if (!taxIdRequired) {
+        // If the shipping country does not require a tax id, the validation immediately returns valid
         return {
             error: null,
             valid: true,
         };
     }
-    // For GB, tax id is not required if company name is not filled (not business address)
+    // For all EU countries, tax id is not required if company name is not filled (not business address)
     if (TaxId.euCountryCodes.includes(shippingCountry)) {
-        if (!companyName) {
+        if (!companyName.trim()) {
             return {
                 error: null,
                 valid: true,
@@ -2534,7 +2551,7 @@ const ZonosCustomerInfo = class {
         }
         const { address: addressValue, firstName, lastName, name } = address.value;
         const { city, country, line1, line2, postal_code, state } = addressValue;
-        const invalidList = containsNonLatinChars.containsNonLatinChars({
+        const invalidList = shouldRenderTaxIdInput.containsNonLatinChars({
             city,
             country,
             line1,

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

@@ -135,7 +135,9 @@ export class ZonosCheckoutPayment {
                     variant: this.submitBtnType }, translate('Place test order')))));
             }
             return (h(Fragment, null, this.showErrorBanner && (h("zonos-banner", { class: "zonos--error-banner", intent: "error" }, translate('Missing required fields. Make sure all fields are completed.'))), this.hasStripePaymentError && (h("zonos-banner", { class: "zonos--payment-error-banner", intent: "error" }, stripeStore.customErrorMessage ||
-                translate("We couldn't complete your payment. Please verify the payment details and try again."))), paypalStore.paypalErrorMessage && (h("zonos-banner", { class: "zonos--payment-error-banner", intent: "error" }, paypalStore.paypalErrorMessage)), h("zonos-payment", null), h("div", { class: "zonos--group-btn" }, !isPaypalTabSelected && (h(Fragment, null, h("zonos-button", { backgroundColor: this.submitBtnColor, bold: true, loading: this.continueLoading, onClick: async () => {
+                translate("We couldn't complete your payment. Please verify the payment details and try again."))), paypalStore.paypalErrorMessage && (h("zonos-banner", { class: "zonos--payment-error-banner", intent: "error" }, paypalStore.paypalErrorMessage)), h("zonos-payment", null), h("div", { class: "zonos--group-btn" }, !isPaypalTabSelected && (h(Fragment, null, h("zonos-button", { backgroundColor: this.submitBtnColor, bold: true, isDisabled: this.continueLoading &&
+                    stripeStore.checkoutSettlementCurrency === 'USD', loading: this.continueLoading &&
+                    stripeStore.checkoutSettlementCurrency !== 'USD', onClick: async () => {
                     if (!cartStore.checkoutSession) {
                         log('Checkout session is not found');
                         return;
@@ -151,7 +153,9 @@ export class ZonosCheckoutPayment {
                     amount: cartStore.total,
                     isForeign: true,
                 }),
-            })), stripeStore.shouldRenderPayInUsdButton && (h("zonos-button", { class: "zonos--pay-in-base-currency-btn", loading: this.continueLoading, onClick: async () => {
+            })), stripeStore.shouldRenderPayInUsdButton && (h("zonos-button", { class: "zonos--pay-in-base-currency-btn", isDisabled: this.continueLoading &&
+                    stripeStore.checkoutSettlementCurrency !== 'USD', loading: this.continueLoading &&
+                    stripeStore.checkoutSettlementCurrency === 'USD', onClick: async () => {
                     await this.continueClickHandler({
                         currencyCode: 'USD',
                     });

package/dist/collection/components/stripe/zonos-address/zonos-address.js

@@ -5,6 +5,7 @@ import { getFallbackDefaultCountryCode, localizationStore, } from "../../store/h
 import { translate } from "../../store/translationStore";
 import { trackConversionEvent } from "../../utils/api/trackConversionEvent";
 import { isCheckoutMobile } from "../../utils/checkout/isCheckoutMobile";
+import { shouldRenderTaxIdInput } from "../../utils/checkout/shouldRenderTaxIdInput";
 import { log } from "../../utils/logging/log";
 import { logError } from "../../utils/logging/logError";
 import { countryRequireTaxId, shipToTaxIdLabels, } from "../../../types/checkout/Tax";
@@ -201,8 +202,16 @@ export class ZonosAddress {
         if (!countryCode) {
             return null;
         }
-        const isCountryRequireTaxId = this.isInTaxIdCountry(countryCode);
-        if (!isCountryRequireTaxId) {
+        // This just to type guard the countryCode, if it's able to get to this point it should already be in country that has tax id input
+        if (!this.isInTaxIdCountry(countryCode)) {
+            return null;
+        }
+        const taxIdInputRendered = shouldRenderTaxIdInput({
+            companyName: stripeStore.companyName,
+            countryCode,
+        });
+        // Don't render tax id input if the country doesn't require tax id
+        if (!taxIdInputRendered) {
             return null;
         }
         const taxIdInputInfo = shipToTaxIdLabels[countryCode];
@@ -240,7 +249,7 @@ export class ZonosAddress {
             this.isAddressFilled = true;
         }
         // this component loads iframe from the stripe elements and puts here, so we don't need to do anything here
-        return (h(Host, { key: 'd0ca96da12614cde628ff4dad124b54c454cd140', class: "zonos--address zonos--elements" }, h("zonos-text", { key: '761b0fb6b313cb6884c3f48f7e46261650669502', class: "zonos--title", type: "semiBoldLabel" }, this.titleText), this.renderCompanyNameInput(), this.renderTaxIdInput(), h("div", { key: '634b40091645760295a5ef544be8080826739301', class: "zonos--address-component" })));
+        return (h(Host, { key: '8509c142efbfe37d81b3da8b2a2e7b3ca9b350dc', class: "zonos--address zonos--elements" }, h("zonos-text", { key: '16e151eb3204d656f4a726531b9a64d955ac99c8', class: "zonos--title", type: "semiBoldLabel" }, this.titleText), this.renderCompanyNameInput(), this.renderTaxIdInput(), h("div", { key: '6b9d493c1e61cbfb77fc89cfa3cc1081b3b1c147', class: "zonos--address-component" })));
     }
     static get is() { return "zonos-address"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/stripe/zonos-custom-address/zonos-custom-address.js

@@ -20,6 +20,7 @@ import { zonosStore } from "../../store/zonosStore";
 import { trackConversionEvent } from "../../utils/api/trackConversionEvent";
 import { isValidZip } from "../../utils/checkout/form/isValidZip";
 import { isCheckoutMobile } from "../../utils/checkout/isCheckoutMobile";
+import { shouldRenderTaxIdInput } from "../../utils/checkout/shouldRenderTaxIdInput";
 import { classes } from "../../utils/classes";
 import { log } from "../../utils/logging/log";
 import { mergeAddress } from "../../utils/mergeAddress";
@@ -308,8 +309,16 @@ export class ZonosAddress {
         if (!countryCode) {
             return null;
         }
-        const isCountryRequireTaxId = this.isInTaxIdCountry(countryCode);
-        if (!isCountryRequireTaxId) {
+        // This just to type guard the countryCode, if it's able to get to this point it should already be in country that has tax id input
+        if (!this.isInTaxIdCountry(countryCode)) {
+            return null;
+        }
+        const taxIdInputRendered = shouldRenderTaxIdInput({
+            companyName: stripeStore.companyName,
+            countryCode,
+        });
+        // Don't render tax id input if the country doesn't require tax id
+        if (!taxIdInputRendered) {
             return null;
         }
         const taxIdInputInfo = shipToTaxIdLabels[countryCode];
@@ -795,10 +804,10 @@ export class ZonosAddress {
             this.country = localizationStore.selectedCountryCode;
         }
         // this component loads iframe from the stripe elements and puts here, so we don't need to do anything here
-        return (h(Host, { key: '66cc13d7c7a01e23610447ffff5b87ee3b62e65c', class: classes([
+        return (h(Host, { key: '7bb0587de62e4c9b50992c3b6334e0382ea6ac08', class: classes([
                 'zonos--address zonos--elements',
                 `zonos--${this.type}-address`,
-            ]) }, h("zonos-text", { key: '52902420cfc1af2d18c2d502eed38870386e3a3c', class: "zonos--title", type: "semiBoldLabel" }, this.titleText), this.renderCompanyNameInput(), this.renderTaxIdInput(), this.renderCustomAddressForm()));
+            ]) }, h("zonos-text", { key: '5f2590456c7b20851af976263a82fbb17e47d995', class: "zonos--title", type: "semiBoldLabel" }, this.titleText), this.renderCompanyNameInput(), this.renderTaxIdInput(), this.renderCustomAddressForm()));
     }
     static get is() { return "zonos-custom-address"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/utils/checkout/shouldRenderTaxIdInput.js

@@ -0,0 +1,20 @@
+import { countryRequireTaxId, euCountryCodes, } from "../../../types/checkout/Tax";
+const isInTaxIdCountry = (countryCode) => {
+    return countryRequireTaxId.includes(countryCode);
+};
+/**
+ * Checks if the tax ID input should be rendered based on the company name and country code.
+ */
+export const shouldRenderTaxIdInput = ({ companyName, countryCode, }) => {
+    // Only show the tax ID input if the country is in the EU and the company name is provided
+    if (euCountryCodes.includes(countryCode)) {
+        return companyName.trim().length > 0;
+    }
+    // If country require tax id, show the input
+    const isCountryRequireTaxId = isInTaxIdCountry(countryCode);
+    if (isCountryRequireTaxId) {
+        return true;
+    }
+    // If country doesn't require tax ID, no need to show the input
+    return false;
+};

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

@@ -1,3 +1,4 @@
+import { shouldRenderTaxIdInput } from "./checkout/shouldRenderTaxIdInput";
 import { euCountryCodes } from "../../types/index";
 const isTaxIdRequired = (shippingCountry) => {
     const requireTaxIdCountry = ['MX', ...euCountryCodes];
@@ -5,16 +6,29 @@ const isTaxIdRequired = (shippingCountry) => {
 };
 export const taxIdValidationResult = ({ companyName, shippingCountry, taxId, }) => {
     // Check to see if we are required to collect tax id for the shipping country or not
-    const taxRequired = isTaxIdRequired(shippingCountry);
-    if (!taxRequired) {
+    const isTaxIdInputRendered = shouldRenderTaxIdInput({
+        companyName,
+        countryCode: shippingCountry,
+    });
+    // If the tax id input is not even rendered, no need to validate anything and allow to proceed. Validate when tax id input is not even rendered would prevent the user from checking out
+    if (!isTaxIdInputRendered) {
         return {
             error: null,
             valid: true,
         };
     }
-    // For GB, tax id is not required if company name is not filled (not business address)
+    // Cache the result of isTaxIdRequired for reuse
+    const taxIdRequired = isTaxIdRequired(shippingCountry);
+    if (!taxIdRequired) {
+        // If the shipping country does not require a tax id, the validation immediately returns valid
+        return {
+            error: null,
+            valid: true,
+        };
+    }
+    // For all EU countries, tax id is not required if company name is not filled (not business address)
     if (euCountryCodes.includes(shippingCountry)) {
-        if (!companyName) {
+        if (!companyName.trim()) {
             return {
                 error: null,
                 valid: true,

package/dist/esm/index.js

@@ -128,7 +128,7 @@ const getZonosQaUrl = () => {
         return null;
     }
     const qaUrl = extractZonosQaUrl(window.location.href);
-    const cdnUrl = "https://v1.3.192.js.zonos.com";
+    const cdnUrl = "https://v1.3.193.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.') ||
@@ -369,10 +369,10 @@ const zonosLoadUrl = (() => {
     }
     return null;
 })();
-const ZONOS_URL = "https://v1.3.192.js.zonos.com";
-const JS_DELIVR_ZONOS_URL = zonosLoadUrl || "https://cdn.jsdelivr.net/npm/@zonos/elements@1.3.192";
-const UNPKG_ZONOS_URL = "https://unpkg.com/@zonos/elements@1.3.192";
-const CDNJS_ZONOS_URL = "https://cdnjs.cloudflare.com/ajax/libs/zonos-elements/1.3.192";
+const ZONOS_URL = "https://v1.3.193.js.zonos.com";
+const JS_DELIVR_ZONOS_URL = zonosLoadUrl || "https://cdn.jsdelivr.net/npm/@zonos/elements@1.3.193";
+const UNPKG_ZONOS_URL = "https://unpkg.com/@zonos/elements@1.3.193";
+const CDNJS_ZONOS_URL = "https://cdnjs.cloudflare.com/ajax/libs/zonos-elements/1.3.193";
 const GOOGLE_FONT_URL = 'https://fonts.googleapis.com';
 const GOOGLE_FONT_REGEX = /^https:\/\/fonts\.googleapis\.com/;
 class Zonos {
@@ -390,7 +390,7 @@ Zonos.iframeLogType = typeof window !== 'undefined'
     ? new URLSearchParams(window.location.search).get('iframeLogType')
     : null;
 Zonos.isBigCommerce = false;
-Zonos.releaseDate = "1745964248308";
+Zonos.releaseDate = "1746131604123";
 Zonos.isLegacyCheckout = false;
 Zonos.domain = typeof window !== 'undefined'
     ? // domain that embeds the iframe
@@ -408,7 +408,7 @@ Zonos.isNpm = true;
 Zonos.zonosQaUrl = null;
 Zonos.zonosQaUrlApi = null;
 Zonos.trackEventLogs = [];
-Zonos.version = `v${"1.3.192"}`;
+Zonos.version = `v${"1.3.193"}`;
 Zonos.modeAlerted = false;
 Zonos.cartData = null;
 Zonos.paypal = null;

package/dist/esm/{containsNonLatinChars-2d8810c3.js → shouldRenderTaxIdInput-8bc112bb.js}

@@ -1,3 +1,5 @@
+import { e as euCountryCodes, c as countryRequireTaxId } from './TaxId-50d72254.js';
+
 const isTextContainsNonLatinChars = (text) => {
     const specialCharacters = /[ʼˮ՚ߴߵ']{1}/u;
     /**
@@ -18,4 +20,24 @@ const containsNonLatinChars = (params) => {
     return nonLatinValueList;
 };
 
-export { containsNonLatinChars as c, isTextContainsNonLatinChars as i };
+const isInTaxIdCountry = (countryCode) => {
+    return countryRequireTaxId.includes(countryCode);
+};
+/**
+ * Checks if the tax ID input should be rendered based on the company name and country code.
+ */
+const shouldRenderTaxIdInput = ({ companyName, countryCode, }) => {
+    // Only show the tax ID input if the country is in the EU and the company name is provided
+    if (euCountryCodes.includes(countryCode)) {
+        return companyName.trim().length > 0;
+    }
+    // If country require tax id, show the input
+    const isCountryRequireTaxId = isInTaxIdCountry(countryCode);
+    if (isCountryRequireTaxId) {
+        return true;
+    }
+    // If country doesn't require tax ID, no need to show the input
+    return false;
+};
+
+export { containsNonLatinChars as c, isTextContainsNonLatinChars as i, shouldRenderTaxIdInput as s };

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

@@ -1,8 +1,8 @@
 import { r as registerInstance, c as createEvent, h, H as Host, d as getElement } from './index-a457c60c.js';
 import { e as cartStore, f as stripeStore, t as trackConversionEvent, V as getFallbackDefaultCountryCode, r as translate, l as localizationStore } from './cart-f5c12be6.js';
 import { b as logError, l as log, i as isCheckoutMobile } from './handleFetch-621e45bc.js';
+import { s as shouldRenderTaxIdInput, i as isTextContainsNonLatinChars, c as containsNonLatinChars } from './shouldRenderTaxIdInput-8bc112bb.js';
 import { c as countryRequireTaxId, s as shipToTaxIdLabels } from './TaxId-50d72254.js';
-import { i as isTextContainsNonLatinChars, c as containsNonLatinChars } from './containsNonLatinChars-2d8810c3.js';
 import { c as classes } from './classes-0d95c529.js';
 import { g as getBorderRadius } from './getBorderRadius-a9a48f79.js';
 import { z as zonosStore, d as zonosStoreFontFamily, f as isObject_1 } from './zonosStore-1ce34e04.js';
@@ -207,8 +207,16 @@ const ZonosAddress$1 = class {
         if (!countryCode) {
             return null;
         }
-        const isCountryRequireTaxId = this.isInTaxIdCountry(countryCode);
-        if (!isCountryRequireTaxId) {
+        // This just to type guard the countryCode, if it's able to get to this point it should already be in country that has tax id input
+        if (!this.isInTaxIdCountry(countryCode)) {
+            return null;
+        }
+        const taxIdInputRendered = shouldRenderTaxIdInput({
+            companyName: stripeStore.companyName,
+            countryCode,
+        });
+        // Don't render tax id input if the country doesn't require tax id
+        if (!taxIdInputRendered) {
             return null;
         }
         const taxIdInputInfo = shipToTaxIdLabels[countryCode];
@@ -246,7 +254,7 @@ const ZonosAddress$1 = class {
             this.isAddressFilled = true;
         }
         // this component loads iframe from the stripe elements and puts here, so we don't need to do anything here
-        return (h(Host, { key: 'd0ca96da12614cde628ff4dad124b54c454cd140', class: "zonos--address zonos--elements" }, h("zonos-text", { key: '761b0fb6b313cb6884c3f48f7e46261650669502', class: "zonos--title", type: "semiBoldLabel" }, this.titleText), this.renderCompanyNameInput(), this.renderTaxIdInput(), h("div", { key: '634b40091645760295a5ef544be8080826739301', class: "zonos--address-component" })));
+        return (h(Host, { key: '8509c142efbfe37d81b3da8b2a2e7b3ca9b350dc', class: "zonos--address zonos--elements" }, h("zonos-text", { key: '16e151eb3204d656f4a726531b9a64d955ac99c8', class: "zonos--title", type: "semiBoldLabel" }, this.titleText), this.renderCompanyNameInput(), this.renderTaxIdInput(), h("div", { key: '6b9d493c1e61cbfb77fc89cfa3cc1081b3b1c147', class: "zonos--address-component" })));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -1056,8 +1064,16 @@ const ZonosAddress = class {
         if (!countryCode) {
             return null;
         }
-        const isCountryRequireTaxId = this.isInTaxIdCountry(countryCode);
-        if (!isCountryRequireTaxId) {
+        // This just to type guard the countryCode, if it's able to get to this point it should already be in country that has tax id input
+        if (!this.isInTaxIdCountry(countryCode)) {
+            return null;
+        }
+        const taxIdInputRendered = shouldRenderTaxIdInput({
+            companyName: stripeStore.companyName,
+            countryCode,
+        });
+        // Don't render tax id input if the country doesn't require tax id
+        if (!taxIdInputRendered) {
             return null;
         }
         const taxIdInputInfo = shipToTaxIdLabels[countryCode];
@@ -1543,10 +1559,10 @@ const ZonosAddress = class {
             this.country = localizationStore.selectedCountryCode;
         }
         // this component loads iframe from the stripe elements and puts here, so we don't need to do anything here
-        return (h(Host, { key: '66cc13d7c7a01e23610447ffff5b87ee3b62e65c', class: classes([
+        return (h(Host, { key: '7bb0587de62e4c9b50992c3b6334e0382ea6ac08', class: classes([
                 'zonos--address zonos--elements',
                 `zonos--${this.type}-address`,
-            ]) }, h("zonos-text", { key: '52902420cfc1af2d18c2d502eed38870386e3a3c', class: "zonos--title", type: "semiBoldLabel" }, this.titleText), this.renderCompanyNameInput(), this.renderTaxIdInput(), this.renderCustomAddressForm()));
+            ]) }, h("zonos-text", { key: '5f2590456c7b20851af976263a82fbb17e47d995', class: "zonos--title", type: "semiBoldLabel" }, this.titleText), this.renderCompanyNameInput(), this.renderTaxIdInput(), this.renderCustomAddressForm()));
     }
     get el() { return getElement(this); }
     static get watchers() { return {