@zonos/elements 1.3.218 → 1.3.220

package/dist/cjs/localization-0169b27d.js

@@ -0,0 +1,738 @@
+'use strict';
+
+const zonosStore = require('./zonosStore-f8ee56aa.js');
+const handleFetch = require('./handleFetch-45f35cac.js');
+const VarianceTest = require('./VarianceTest-0cb1e118.js');
+const translationStore = require('./translationStore-0c67178f.js');
+
+/**
+ * Check if the response contains at least one available test key that we support
+ */
+const hasAtLeastOneAvailableTestKey = (rawResponse) => {
+    const hasAvailableTestKey = !!rawResponse.find(item => item.testKey in VarianceTest.availableTestKeys);
+    if (!hasAvailableTestKey) {
+        handleFetch.log('No available test key found in response', 'info', {
+            response: rawResponse,
+        });
+    }
+    return !!rawResponse.find(item => item.testKey in VarianceTest.availableTestKeys);
+};
+
+/**
+ * Filter the response to only include test keys and variants key that we support
+ */
+const filterValidTests = (testKeys) => {
+    // Type guard the response to ensure it matches the expected structure
+    if (!hasAtLeastOneAvailableTestKey(testKeys)) {
+        return [];
+    }
+    // Filter the response to only include test keys that we support
+    return testKeys
+        .filter(item => {
+        var _a;
+        const isTestKeyValidButNoSelectedVariantKey = VarianceTest.availableTestKeys[item.testKey] && !item.selectedVariantKey;
+        const validTestKeyWithSelectedVariantKey = item.selectedVariantKey &&
+            !!((_a = VarianceTest.availableTestKeys[item.testKey]) === null || _a === void 0 ? void 0 : _a['availableVariants'].includes(item.selectedVariantKey));
+        return (isTestKeyValidButNoSelectedVariantKey ||
+            validTestKeyWithSelectedVariantKey);
+    })
+        .map(item => (Object.assign(Object.assign({}, item), { expiresAt: item.expiresAt || Date.now() + VARIANT_TEST_KEY_EXPIRATION, selectedVariantKey: item.selectedVariantKey || null })));
+};
+
+/**
+ * Expiration time for variant test keys in milliseconds
+ * @default 1 day
+ */
+const VARIANT_TEST_KEY_EXPIRATION = 60 * 60 * 24 * 1000;
+const { onChange: storageStoreOnChange, state: storageStore } = zonosStore.createStore({
+    checkoutSessionId: sessionStorage.getItem('zonos--checkout-session-id'),
+    enabledVariantTestKeys: handleFetch.jsonParse(localStorage.getItem('zonos--enabled-variant-test-keys')),
+});
+storageStoreOnChange('enabledVariantTestKeys', () => {
+    var _a;
+    // This should be set in localStorage so we don't have multiple tests for the same user in short period of time
+    if (!((_a = storageStore.enabledVariantTestKeys) === null || _a === void 0 ? void 0 : _a.length)) {
+        localStorage.removeItem('zonos--enabled-variant-test-keys');
+        return;
+    }
+    localStorage.setItem('zonos--enabled-variant-test-keys', JSON.stringify(storageStore.enabledVariantTestKeys));
+});
+storageStoreOnChange('checkoutSessionId', () => {
+    if (!storageStore.checkoutSessionId) {
+        sessionStorage.removeItem('zonos--checkout-session-id');
+        return;
+    }
+    sessionStorage.setItem('zonos--checkout-session-id', storageStore.checkoutSessionId);
+});
+const storageStoreSetEnabledVariantTestKeys = (testKeys) => {
+    storageStore.enabledVariantTestKeys = filterValidTests(testKeys);
+};
+
+const getCountries = async () => {
+    try {
+        const { errors, json } = await handleFetch.handleFetch('/api/zonos-elements/get-countries', {
+            method: 'GET',
+        });
+        if (errors.length || !json) {
+            return null;
+        }
+        return json;
+    }
+    catch (_a) {
+        return null;
+    }
+};
+
+const getCountryLandedCost = async (countryCode) => {
+    var _a;
+    if (!countryCode) {
+        return null;
+    }
+    const url = `/api/zonos-elements/country-landed-cost/${countryCode}`;
+    const { errors, json } = await handleFetch.handleFetch(url);
+    if (errors.length || !json) {
+        handleFetch.logError(`Error fetching country landed cost: ${(_a = errors.find(Boolean)) === null || _a === void 0 ? void 0 : _a.message}`);
+        return null;
+    }
+    return json || null;
+};
+
+const defaultUsExchangeRate = {
+    exchangeRate: {
+        rate: 1,
+        targetFormat: {
+            currencyCode: 'USD',
+            decimalDelimiter: '.',
+            scale: 2,
+            symbol: '$',
+            symbolLocation: 'before',
+            thousandsDelimiter: ',',
+        },
+    },
+    maxAge: null,
+};
+const getExchangeRate = async ({ country, isGuaranteed, sourceCurrency, targetCurrency, }) => {
+    var _a;
+    // If source currency matches target currency (US -> US) and is not a guaranteed rate, return default exchange rate so we still format properly.
+    if (sourceCurrency === targetCurrency && !isGuaranteed) {
+        return defaultUsExchangeRate;
+    }
+    const searchParams = new URLSearchParams();
+    searchParams.set('sourceCurrency', sourceCurrency);
+    searchParams.set('targetCurrency', targetCurrency);
+    searchParams.set('isGuaranteed', String(isGuaranteed));
+    searchParams.set('country', country || '');
+    const { errors, json } = await handleFetch.handleFetch(`/api/zonos-elements/exchange-rates?${searchParams.toString()}`);
+    if (errors.length || !json) {
+        handleFetch.logError(`Error fetching country landed cost: ${(_a = errors.find(Boolean)) === null || _a === void 0 ? void 0 : _a.message}`);
+        return defaultUsExchangeRate;
+    }
+    const { rate, targetFormat } = json.exchangeRateCreate;
+    const maxAge = json.maxAge;
+    if (rate) {
+        sessionStorage.setItem(country + '_rate', JSON.stringify(rate));
+        const exchangeRate = { rate, targetFormat };
+        return { exchangeRate, maxAge };
+    }
+    return defaultUsExchangeRate;
+};
+
+const getInclusivePricing = async (countryCode) => {
+    var _a;
+    if (!countryCode) {
+        return null;
+    }
+    const { errors, json } = await handleFetch.handleFetch(`/api/zonos-elements/inclusive-prices/${countryCode}`);
+    if (errors.length || !json) {
+        handleFetch.logError(`Error fetching country inclusive price setting: ${(_a = errors.find(Boolean)) === null || _a === void 0 ? void 0 : _a.message}`);
+        return null;
+    }
+    return json || null;
+};
+
+const getLocaleMessages = async ({ countryCode, localeTo, storeId, }) => {
+    var _a;
+    const searchParams = new URLSearchParams();
+    searchParams.set('countryCode', countryCode);
+    searchParams.set('storeId', storeId.toString());
+    if (localeTo) {
+        searchParams.set('localeTo', localeTo);
+    }
+    const { errors, json } = await handleFetch.handleFetch(`/api/zonos-elements/locale-messages?${searchParams.toString()}`);
+    if (errors.length || !json) {
+        handleFetch.logError('Error fetching exchange rate', (_a = errors.find(Boolean)) === null || _a === void 0 ? void 0 : _a.message);
+        return [];
+    }
+    return json.locale_countryCodesPage;
+};
+
+const validateCountryCode = (countryCode) => {
+    // Check that the country is two characters and is upper case
+    if (countryCode && /^[A-Z]{2}$/.test(countryCode)) {
+        return countryCode;
+    }
+    return null;
+};
+const getZCountryUrlParam = (urlParams) => {
+    const urlSearchParams = new URLSearchParams(urlParams || window.location.search);
+    const getCountryParam = (param) => {
+        const country = urlSearchParams.get(param);
+        // Check that the country is two characters and is upper case
+        return validateCountryCode(country);
+    };
+    const zCountry = getCountryParam('zCountry');
+    // Fallback to legacy 'country'
+    const fallback = getCountryParam('country');
+    // Fallback to customerCountry
+    const secondFallback = getCountryParam('customerCountry');
+    return zCountry || fallback || secondFallback;
+};
+
+const getLocalization = async () => {
+    try {
+        const currentUrl = new URL(window.location.href);
+        // load and use country from session storage when zCountry query param is not present
+        const countryLoadedSession = window.sessionStorage.getItem('zonos--country');
+        const zCountry = getZCountryUrlParam(currentUrl.searchParams) || countryLoadedSession;
+        const searchParams = new URLSearchParams();
+        if (zCountry) {
+            searchParams.set('zCountry', zCountry);
+        }
+        const { errors, json } = await handleFetch.handleFetch(`/api/zonos-elements/localization?${searchParams.toString()}`);
+        if (errors.length || !json) {
+            return { country: null, locale: null };
+        }
+        return {
+            country: json.country,
+            locale: json.locale,
+        };
+    }
+    catch (_a) {
+        return { country: null, locale: null };
+    }
+};
+
+const getShippingZones = async () => {
+    var _a, _b, _c;
+    if ((_a = window.Zonos.cartSettings) === null || _a === void 0 ? void 0 : _a.shippingZones) {
+        return window.Zonos.cartSettings.shippingZones
+            .flatMap(zone => zone === null || zone === void 0 ? void 0 : zone.countryCodes)
+            .filter(Boolean);
+    }
+    const { errors, json } = await handleFetch.handleFetch('/api/zonos-elements/shipping-zones');
+    if (errors.length || !json) {
+        handleFetch.logError(`Error fetching shipping zones: ${(_b = errors.find(Boolean)) === null || _b === void 0 ? void 0 : _b.message}`);
+        return null;
+    }
+    const shippingZones = (_c = json === null || json === void 0 ? void 0 : json.shippingZones) === null || _c === void 0 ? void 0 : _c.flatMap(zone => zone === null || zone === void 0 ? void 0 : zone.countryCodes).filter(Boolean);
+    return shippingZones || null;
+};
+
+const currencyConvert = (value) => {
+    // TODO(potentially): Bring over the code for vanity checks
+    const { exchangeRate } = localizationStore;
+    if (!exchangeRate || !value || isNaN(value)) {
+        return value;
+    }
+    const minimumFractionDigits = (exchangeRate === null || exchangeRate === void 0 ? void 0 : exchangeRate.targetFormat.scale) || 2;
+    const convertedValue = value * exchangeRate.rate;
+    const fixedValue = convertedValue.toFixed(minimumFractionDigits);
+    return Number(fixedValue);
+};
+
+/**
+ * This function only to format the number in
+ * @returns
+ */
+const numberFormat = ({ amount, currency, targetFormat, }) => {
+    const targetCurrency = currency || localizationStore.targetCurrency;
+    const minimumFractionDigits = (targetFormat === null || targetFormat === void 0 ? void 0 : targetFormat.scale) || 2;
+    const isIE = window.navigator.userAgent.indexOf('MSIE ') !== -1;
+    const numberFormatExists = typeof Intl === 'object' && Intl && typeof Intl.NumberFormat === 'function';
+    if (isIE || !numberFormatExists) {
+        // use native number formatting if it's IE.
+        const formattedNumber = Number(amount)
+            .toFixed(minimumFractionDigits)
+            .replace('.', '|dec|')
+            .replace(',', (targetFormat === null || targetFormat === void 0 ? void 0 : targetFormat.thousandsDelimiter) || '')
+            .replace('|dec|', (targetFormat === null || targetFormat === void 0 ? void 0 : targetFormat.decimalDelimiter) || '');
+        return formattedNumber;
+    }
+    const formatedNumber = new Intl.NumberFormat(window.navigator.language, {
+        currency: targetCurrency,
+        currencyDisplay: 'code',
+        minimumFractionDigits: minimumFractionDigits,
+        style: 'currency',
+    }).format(amount);
+    return formatedNumber.replace(new RegExp(`${targetCurrency}\\s+`), '');
+};
+
+const currencyFormat = ({ amount, currency, }) => {
+    if (isNaN(amount) || (amount !== 0 && !amount)) {
+        return '';
+    }
+    const overrideCurrencyFormat = zonosStore.zonosStore.overrideCurrencyFormat;
+    const { exchangeRate } = localizationStore;
+    const targetCurrency = currency || localizationStore.targetCurrency;
+    // Use user-defined currency format
+    if (typeof overrideCurrencyFormat === 'function') {
+        return overrideCurrencyFormat({
+            amount: amount,
+            currencyCode: targetCurrency,
+            numberFormat: ({ amount: _amount }) => numberFormat({
+                amount: _amount,
+                currency: targetCurrency,
+                targetFormat: (exchangeRate === null || exchangeRate === void 0 ? void 0 : exchangeRate.targetFormat) || null,
+            }),
+        });
+    }
+    const { targetFormat } = exchangeRate || {};
+    if (!targetFormat || !exchangeRate) {
+        // Return the amount as a string if no exchange rate is available
+        return `${amount.toFixed(2)} ${targetCurrency}`;
+    }
+    const minimumFractionDigits = targetFormat.scale || 2;
+    const isIE = window.navigator.userAgent.indexOf('MSIE ') !== -1;
+    const numberFormatExists = typeof Intl === 'object' && Intl && typeof Intl.NumberFormat === 'function';
+    if (isIE || !numberFormatExists) {
+        // use native number formatting if it's IE.
+        const formattedNumber = Number(amount)
+            .toFixed(minimumFractionDigits)
+            .replace('.', '|dec|')
+            .replace(',', targetFormat.thousandsDelimiter || '')
+            .replace('|dec|', targetFormat.decimalDelimiter || '');
+        const result = `${formattedNumber}${targetFormat.currencyCode !== 'USD' ? ` ${targetFormat.currencyCode}` : ''}`;
+        return result;
+    }
+    const currencyDisplay = (overrideCurrencyFormat === null || overrideCurrencyFormat === void 0 ? void 0 : overrideCurrencyFormat.currencyDisplay) || 'symbol';
+    const formattedNumber = new Intl.NumberFormat(window.navigator.language, {
+        currency: targetCurrency,
+        currencyDisplay,
+        minimumFractionDigits: minimumFractionDigits,
+        style: 'currency',
+    }).format(amount);
+    // Move currency code to the end of the string if currencyDisplay is 'code'
+    const result = currencyDisplay === 'code'
+        ? `${formattedNumber.replace(new RegExp(`${targetCurrency}\\s+`), '')} ${targetCurrency}`
+        : formattedNumber;
+    return result;
+};
+
+const currencyConvertAndFormat = (value) => {
+    const convertedValue = currencyConvert(value);
+    const formattedValue = currencyFormat({ amount: convertedValue });
+    return formattedValue;
+};
+
+/**
+ * Check if selector user pass is valid
+ * @example
+ * isValidSelector('div') // true
+ * isValidSelector('div + >>> span') // false
+ */
+const isValidSelector = (selector) => {
+    try {
+        // this will error out if the selector is invalid in the DOM
+        document.createDocumentFragment().querySelector(selector);
+    }
+    catch (_a) {
+        return false;
+    }
+    return true;
+};
+
+const getCurrencyElements = (selector) => {
+    const currencySelector = selector || '.money';
+    if (!isValidSelector(currencySelector)) {
+        handleFetch.logError(`Currency element selector "${currencySelector}" is not valid.`);
+        return null;
+    }
+    const currencyElements = document.querySelectorAll(currencySelector);
+    if (!currencyElements.length) {
+        handleFetch.log(`No currency elements found with selector "${currencySelector}"`, 'warn');
+        return null;
+    }
+    // return array of currency elements instead of a NodeList
+    return Array.from(currencyElements);
+};
+
+const getInitialElementAmount = (element) => {
+    var _a;
+    const domesticValue = element.getAttribute('data-domestic');
+    const intlValue = element.getAttribute('data-zintl');
+    // Only keep numbers, decimal, and hyphens
+    const cleanedText = (_a = element.textContent) === null || _a === void 0 ? void 0 : _a.replace(/[^\d.-]/g, '');
+    if (!cleanedText) {
+        return null;
+    }
+    // If the element has no data-domestic attribute, or the text content is different from the data-zintl attribute, set the data-domestic attribute
+    if (!domesticValue || (element.textContent !== intlValue && intlValue)) {
+        // Store the original value on the element once, and international on every new conversion
+        element.setAttribute('data-domestic', cleanedText);
+        return parseFloat(cleanedText);
+    }
+    return parseFloat(domesticValue);
+};
+
+const convertCurrency = (element) => {
+    var _a;
+    const amount = getInitialElementAmount(element);
+    if (!amount || isNaN(amount)) {
+        return;
+    }
+    const currentIntlValue = element.getAttribute('data-zintl');
+    // get rate
+    const currentIntlRateValue = parseFloat(element.getAttribute('data-zrate') || '1');
+    const currentCountryValue = element.getAttribute('data-zcountry-code');
+    // do nothing if the target currency is the same
+    const isExchangeRateReady = localizationStore.exchangeRate &&
+        localizationStore.targetCurrency ===
+            localizationStore.exchangeRate.targetFormat.currencyCode;
+    const rate = ((_a = localizationStore.exchangeRate) === null || _a === void 0 ? void 0 : _a.rate) || 1;
+    // if the current value on the element is different from the current intl value, update the data-zintl attribute
+    if (isExchangeRateReady &&
+        // Update currency if the value is not yet formatted
+        (element.textContent !== currentIntlValue ||
+            // Update rate when new rate is available
+            rate !== currentIntlRateValue ||
+            // Update currency when the country code changes
+            currentCountryValue !== localizationStore.selectedCountryCode)) {
+        const customizedCurrencyFormat = typeof zonosStore.zonosStore.currencyConverter === 'function' &&
+            zonosStore.zonosStore.currencyConverter({
+                convert: currencyConvert,
+                convertAndFormat: currencyConvertAndFormat,
+                currencyCode: localizationStore.targetCurrency,
+                format: (value) => currencyFormat({ amount: value }),
+                originalAmount: amount,
+                selector: 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);
+        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
+        element.setAttribute('data-zintl', observedFormattedValue);
+        element.setAttribute('data-zcountry-code', localizationStore.selectedCountryCode || '');
+    }
+};
+const defaultCurrencyConverter = () => {
+    const { currencyElementSelector } = zonosStore.zonosStore.helloSettings;
+    const currencyElements = getCurrencyElements(currencyElementSelector);
+    // do nothing if none of the currency elements are found
+    if (!(currencyElements === null || currencyElements === void 0 ? void 0 : currencyElements.length)) {
+        return;
+    }
+    if (!localizationStore.exchangeRate) {
+        handleFetch.logError('Could not display currency. Exchange rate and format data is not available.');
+        return;
+    }
+    currencyElements.forEach(element => {
+        // convert the currency and save the formatted value to the data-zintl attribute
+        convertCurrency(element);
+    });
+};
+
+const currencyDisplay = () => {
+    if (zonosStore.zonosStore.helloSettings.currencyBehavior === 'DISABLED' ||
+        window.Zonos.isLegacyCheckout) {
+        return;
+    }
+    defaultCurrencyConverter();
+};
+
+const getCurrencyCode = (code) => {
+    var _a;
+    const countryInShippingZone = (_a = localizationStore.shippingZoneCountries) === null || _a === void 0 ? void 0 : _a[code];
+    if (countryInShippingZone) {
+        return countryInShippingZone.currencyCode;
+    }
+    return null;
+};
+
+const setZCountryUrlParam = (selectedCountryCode) => {
+    if (!selectedCountryCode) {
+        return;
+    }
+    const urlSearchParams = new URLSearchParams(window.location.search);
+    // Only append zCountry if it's already in the URL or the countryOverrideBehavior is URL_PARAM
+    const shouldAppendParam = urlSearchParams.has('zCountry') ||
+        zonosStore.zonosStore.helloSettings.countryOverrideBehavior === 'URL_PARAM';
+    if (shouldAppendParam) {
+        // Only append zCountry if it's not already in the URL
+        urlSearchParams.set('zCountry', selectedCountryCode);
+        const newUrl = `${window.location.pathname}?${urlSearchParams.toString()}`;
+        /**
+         * Setting the state to null in window.history.replaceState can cause issues with rendering when using next/link and pressing the back button.
+         * @ref https://github.com/vercel/next.js/issues/33233#issuecomment-1052349396
+         **/
+        window.history.replaceState(window.history.state, document.title, newUrl);
+    }
+};
+
+const { dispose: localizationDispose, onChange: localizationStoreOnChange, state: localizationStore, } = zonosStore.createStore({
+    countryLandedCost: null,
+    customMessages: [],
+    exchangeRate: null,
+    helloCountryList: null,
+    inclusivePricing: null,
+    isDisabledCountry: true,
+    isShippableCountry: false,
+    localizationLoaded: false,
+    selectedCountryCode: null,
+    selectedLocale: 'en',
+    shippingZoneCountries: null,
+    targetCurrency: 'USD',
+});
+const triggerGetExchangeRate = async (isGuaranteed) => {
+    const { exchangeRate, maxAge } = await getExchangeRate({
+        country: localizationStore.selectedCountryCode,
+        isGuaranteed,
+        sourceCurrency: zonosStore.zonosStore.sourceCurrency,
+        targetCurrency: localizationStore.targetCurrency,
+    });
+    if (exchangeRate) {
+        localizationStore.exchangeRate = exchangeRate;
+        currencyDisplay();
+    }
+    return { maxAge };
+};
+/**
+ * CHORE: This is mostly for legacy checkout as the country param is not guaranteed.
+ */
+const DEFAULT_COUNTRY_CODE_LEGACY_CHECKOUT = 'CA';
+const getFallbackDefaultCountryCode = (allowedCountries) => {
+    if (localizationStore.selectedCountryCode &&
+        allowedCountries.includes(localizationStore.selectedCountryCode)) {
+        return localizationStore.selectedCountryCode;
+    }
+    // Don't check if it is allowed. If it is not allowed it will fallback to Albania (first option).
+    return DEFAULT_COUNTRY_CODE_LEGACY_CHECKOUT;
+};
+// This recursive function is for users who step away from their computer and come back needing a new exchange rate
+const startExchangeRateTimeout = ({ isGuaranteed, maxAge, }) => {
+    if (localizationStore.exchangeRateTimeout) {
+        clearTimeout(localizationStore.exchangeRateTimeout);
+    }
+    // maxAge comes in seconds, convert to milliseconds
+    const defaultMaxAge = 5 * 60;
+    const maxAgeToUse = maxAge || defaultMaxAge;
+    // Recursively set timeouts to get new exchange rates when the current one expires
+    localizationStore.exchangeRateTimeout = setTimeout(async () => {
+        const { maxAge: newMaxAge } = await triggerGetExchangeRate(isGuaranteed);
+        startExchangeRateTimeout({ isGuaranteed, maxAge: newMaxAge });
+    }, maxAgeToUse * 1000);
+};
+const getNewLocalization = async () => {
+    var _a;
+    handleFetch.log('get new localization store');
+    const { isDisabledCountry, isShippableCountry, selectedCountryCode } = localizationStore;
+    if (!window.Zonos.isLegacyCheckout) {
+        // These requests are only needed for Hello, so we can skip them for legacy checkout
+        localizationStore.countryLandedCost = await getCountryLandedCost(localizationStore.selectedCountryCode);
+        localizationStore.inclusivePricing =
+            ((_a = (await getInclusivePricing(selectedCountryCode))) === null || _a === void 0 ? void 0 : _a.setting) || null;
+        if (localizationStore.inclusivePricing) {
+            handleFetch.log(`Inclusive price setting found for this country (${selectedCountryCode}) ${JSON.stringify(localizationStore.inclusivePricing, null, 2)}`);
+        }
+    }
+    else {
+        handleFetch.log('Skipping country landed cost and inclusive pricing requests, because this is a legacy checkout');
+    }
+    if (zonosStore.zonosStore.helloSettings.currencyBehavior === 'DISABLED' ||
+        !isShippableCountry ||
+        isDisabledCountry ||
+        !selectedCountryCode) {
+        return;
+    }
+    const isGuaranteed = zonosStore.zonosStore.checkoutSettings.visibilityStatus === 'ENABLED';
+    const { maxAge } = await triggerGetExchangeRate(isGuaranteed);
+    startExchangeRateTimeout({ isGuaranteed, maxAge });
+};
+const getCustomMessages = async () => {
+    handleFetch.log(`Getting custom messages for ${localizationStore.selectedCountryCode}`);
+    if (!localizationStore.selectedCountryCode || !zonosStore.zonosStore.storeId) {
+        return;
+    }
+    const localeMessages = await getLocaleMessages({
+        countryCode: localizationStore.selectedCountryCode,
+        localeTo: localizationStore.selectedLocale,
+        storeId: zonosStore.zonosStore.storeId,
+    });
+    const allMessages = localeMessages.flatMap(x => {
+        var _a;
+        return {
+            countryCode: localizationStore.selectedCountryCode,
+            message: (_a = x.countryCodesPageMessageLinks.find(Boolean)) === null || _a === void 0 ? void 0 : _a.message.textTo,
+            pageName: x.pageName,
+        };
+    });
+    localizationStore.customMessages = allMessages;
+};
+const getOverrideLocale = () => {
+    const currentUrl = new URL(window.location.href);
+    const zonosLocale = currentUrl.searchParams.get('zonosLocale');
+    return zonosLocale;
+};
+const addInternationalHideClass = () => {
+    if (localizationStore.isShippableCountry) {
+        document.body.classList.add('z-intl');
+    }
+    else {
+        document.body.classList.remove('z-intl');
+    }
+};
+const getValidCountryCode = (countryCode) => {
+    if (countryCode === 'UK') {
+        return 'GB';
+    }
+    return countryCode;
+};
+const localizationStoreUpdateSelectedCountryCode = (newSelectedCountryCode) => {
+    var _a, _b;
+    handleFetch.log(`Updating selected country code to ${newSelectedCountryCode}`);
+    const isFirstTime = !localizationStore.selectedCountryCode;
+    localizationStore.selectedCountryCode = getValidCountryCode(newSelectedCountryCode);
+    const { selectedCountryCode, shippingZoneCountries } = localizationStore;
+    const isShippableCountry = !!shippingZoneCountries &&
+        !!selectedCountryCode &&
+        !!shippingZoneCountries[selectedCountryCode] &&
+        // Make sure the country is not in the disabled countries list
+        !zonosStore.zonosStore.disabledCountries.includes(selectedCountryCode);
+    // update shippable country
+    localizationStore.isShippableCountry = isShippableCountry;
+    handleFetch.log(`${localizationStore.selectedCountryCode} is a shippable country: ${localizationStore.isShippableCountry}`);
+    const isDisabledCountry = !!selectedCountryCode &&
+        zonosStore.zonosStore.disabledCountries.includes(selectedCountryCode);
+    localizationStore.isDisabledCountry = isDisabledCountry;
+    handleFetch.log(`${localizationStore.selectedCountryCode} is a disabled country: ${localizationStore.isDisabledCountry}`);
+    addInternationalHideClass();
+    if (!selectedCountryCode) {
+        return;
+    }
+    const currencyCode = getCurrencyCode(selectedCountryCode);
+    // Only trigger callback onCountryChange if the country code has been set before
+    if (!isFirstTime) {
+        // Trigger callback onCountryChange
+        (_a = zonosStore.zonosStore.onCountryChange) === null || _a === void 0 ? void 0 : _a.call(zonosStore.zonosStore, {
+            countryCode: selectedCountryCode,
+            currencyCode,
+            isShippableCountry: isShippableCountry,
+        });
+    }
+    if (!currencyCode) {
+        return;
+    }
+    localizationStore.targetCurrency = currencyCode;
+    void getNewLocalization();
+    // 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
+    setZCountryUrlParam(selectedCountryCode);
+    (_b = document
+        .querySelector('zonos-hello')) === null || _b === void 0 ? void 0 : _b.setAttribute('z-country', selectedCountryCode);
+};
+const initHelloCountryList = (allCountries) => {
+    const showCountryList = zonosStore.zonosStore.helloSettings.showCountryList;
+    const hellCountryList = localizationStore.shippingZoneCountries;
+    if (!showCountryList || showCountryList === 'ONLY_SHIPPABLE') {
+        // just use the shipping zone countries
+        localizationStore.helloCountryList = hellCountryList;
+        return;
+    }
+    if (showCountryList === 'ALL') {
+        localizationStore.helloCountryList = allCountries;
+        return;
+    }
+    // get all active countries in the showCountryList
+    localizationStore.helloCountryList = showCountryList.reduce((acc, countryCode) => {
+        const countryInfo = allCountries === null || allCountries === void 0 ? void 0 : allCountries[countryCode];
+        return countryInfo
+            ? Object.assign(Object.assign({}, acc), { [countryCode]: countryInfo }) : acc;
+    }, {});
+};
+const updateCheckoutSessionLanguage = async () => {
+    if (!storageStore.checkoutSessionId) {
+        return null;
+    }
+    const { errors, json } = await handleFetch.handleFetch('/api/zonos-elements/update-checkout-session-metadata', {
+        body: {
+            id: storageStore.checkoutSessionId,
+            metadata: [
+                // This is being used from the backend to determine the language of the checkout session
+                {
+                    key: 'language',
+                    value: localizationStore.selectedLocale,
+                },
+            ],
+        },
+        method: 'POST',
+    });
+    if (errors.length || !json) {
+        handleFetch.logError('Error occurs when updating checkout session', JSON.stringify(errors, null, 2));
+        return { errors, json };
+    }
+    return { errors: [], json };
+};
+const localizationStoreUpdateSelectedLocale = (newSelectedLocale) => {
+    localizationStore.selectedLocale = newSelectedLocale;
+    translationStore.translationStoreUpdateLanguage(newSelectedLocale);
+    void updateCheckoutSessionLanguage();
+    void getCustomMessages();
+};
+const initLocalizationStore = async () => {
+    // all countries from countries.json, shipping zone and localization
+    const [allCountries, shippingZoneCountries, localization] = await Promise.all([getCountries(), getShippingZones(), getLocalization()]);
+    // Filter countries to only include countries in the shipping zone
+    const filteredCountries = shippingZoneCountries === null || shippingZoneCountries === void 0 ? void 0 : shippingZoneCountries.reduce((acc, countryCode) => {
+        const countryInfo = allCountries === null || allCountries === void 0 ? void 0 : allCountries[countryCode];
+        return countryInfo
+            ? Object.assign(Object.assign({}, acc), { [countryCode]: countryInfo }) : acc;
+    }, {});
+    localizationStore.shippingZoneCountries = filteredCountries || null;
+    // Initialize the country list for the hello widget
+    initHelloCountryList(allCountries || {});
+    const { country, locale } = localization;
+    handleFetch.log(`Country code from localization: ${country}`);
+    handleFetch.log(`Locale from localization: ${locale}`);
+    // update selected country code in store
+    localizationStoreUpdateSelectedCountryCode(country);
+    // use locale from params if it exists, otherwise use locale from localization
+    const overrideLocale = getOverrideLocale();
+    localizationStoreUpdateSelectedLocale(overrideLocale || locale || 'en');
+    const devSites = [
+        'dev.storybook.elements',
+        'dev.elements',
+        'dev.demo.elements',
+        'dev.dashboard',
+    ];
+    // If the country code is not set, set it to the US for development (vercel can't get geo country in dev)
+    if (!localizationStore.selectedCountryCode &&
+        devSites.some(site => window.location.origin.includes(site))) {
+        // update selected country code in store
+        localizationStoreUpdateSelectedCountryCode('CA');
+    }
+    localizationStore.localizationLoaded = true;
+};
+
+exports.VARIANT_TEST_KEY_EXPIRATION = VARIANT_TEST_KEY_EXPIRATION;
+exports.currencyConvert = currencyConvert;
+exports.currencyConvertAndFormat = currencyConvertAndFormat;
+exports.currencyDisplay = currencyDisplay;
+exports.currencyFormat = currencyFormat;
+exports.filterValidTests = filterValidTests;
+exports.getFallbackDefaultCountryCode = getFallbackDefaultCountryCode;
+exports.getZCountryUrlParam = getZCountryUrlParam;
+exports.initLocalizationStore = initLocalizationStore;
+exports.isValidSelector = isValidSelector;
+exports.localizationStore = localizationStore;
+exports.localizationStoreOnChange = localizationStoreOnChange;
+exports.localizationStoreUpdateSelectedCountryCode = localizationStoreUpdateSelectedCountryCode;
+exports.localizationStoreUpdateSelectedLocale = localizationStoreUpdateSelectedLocale;
+exports.setZCountryUrlParam = setZCountryUrlParam;
+exports.storageStore = storageStore;
+exports.storageStoreOnChange = storageStoreOnChange;
+exports.storageStoreSetEnabledVariantTestKeys = storageStoreSetEnabledVariantTestKeys;